/* Small finishing details. Hero rendering, media sizing and playback are unchanged. */
html {
  scrollbar-gutter: stable;
}

h1, h2, h3 {
  text-wrap: balance;
}

.intro-text,
.section-copy p,
.tex-description,
.picture figcaption,
.page-hero-art figcaption {
  text-wrap: pretty;
}

.hero-commercial-paths > .text-link,
.next-step-options .text-link {
  min-height: 44px;
}

.hero-commercial-paths {
  row-gap: 8px;
}

.search-input {
  gap: 12px;
  padding: 15px 16px;
  border: 1px solid #d9e1ec;
  border-radius: 14px;
  background: #f8fafc;
  transition: border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.search-input:focus-within {
  border-color: var(--blue);
  background: #fff;
  box-shadow: 0 0 0 3px #0071e31a;
}

.search-input:focus-within > svg {
  color: var(--blue);
}

.search-modal .search-input > input {
  line-height: 1.5;
  letter-spacing: -.01em;
}

.search-results {
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: #b9c7d8 transparent;
}

.search-results > a {
  gap: 20px;
  border-radius: 10px;
  padding-inline: 12px;
}

.search-results > a:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: -2px;
  background: #f2f7fd;
}

.search-results > a > svg {
  flex-shrink: 0;
}

.search-results span {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

.comparison-table-wrap {
  overscroll-behavior-inline: contain;
  scrollbar-width: thin;
  scrollbar-color: #9bacbf #eef2f6;
}

.comparison-table-wrap:focus-visible {
  outline: 3px solid var(--blue);
  outline-offset: 4px;
}

.battery-comparison th,
.battery-comparison td,
.spec-table dd {
  font-variant-numeric: tabular-nums;
}

.picture figcaption,
.page-hero-art figcaption {
  max-width: 55ch;
  margin-inline: auto;
}

.product-link-card {
  border: 1px solid transparent;
  transition: background .22s ease, border-color .22s ease, transform .22s ease, box-shadow .22s ease;
}

.footer-languages nav > a,
.footer-bottom > nav > a {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}

@media (hover: hover) and (pointer: fine) {
  .product-link-card:hover {
    transform: translateY(-3px);
    background: #f2f6fb;
    border-color: #dce5f0;
    box-shadow: 0 16px 32px -20px #233b5b30;
  }

  .service-card:hover {
    background: #f5f8fc;
  }

  .hero-commercial-paths > .text-link:hover,
  .footer-bottom > nav > a:hover {
    text-decoration: underline;
    text-underline-offset: 5px;
    text-decoration-thickness: 1px;
  }
}

@media (max-width: 780px) {
  .search-modal {
    padding: 52px 22px 25px;
  }

  .search-modal .search-input > input {
    font-size: 17px;
  }

  .search-hint {
    display: none;
  }

  .search-results {
    margin-top: 18px;
    max-height: min(440px, 54dvh);
  }
}

@media (max-height: 540px) and (max-width: 780px) {
  .modal-backdrop:has(.search-modal) {
    padding-top: 12px;
  }

  .search-modal .search-results {
    max-height: 40dvh;
  }
}

@media (prefers-reduced-motion: reduce) {
  .search-input,
  .product-link-card {
    transition: none;
  }

  .product-link-card:hover {
    transform: none;
  }
}