.headlight-film-model-page .headlight-film-model-hero { min-height: 100vh; }
@supports (min-height: 100svh) { .headlight-film-model-page .headlight-film-model-hero { min-height: 100svh; } }
.headlight-film-model-page .headlight-film-model-hero .headlight-film-hero__copy { max-width: 790px; }
.headlight-film-model-page .headlight-film-model-hero h1 { max-width: 790px; font-size: clamp(42px, 4.7vw, 68px); }
.headlight-film-model-page .headlight-film-model-hero--24 .headlight-film-hero__image,
.headlight-film-model-page .headlight-film-model-hero--99 .headlight-film-hero__image,
.headlight-film-model-page .headlight-film-model-hero--96 .headlight-film-hero__image { object-position: center center; }
.headlight-film-model-page .headlight-film-model-hero .headlight-film-hero__overlay {
  background: linear-gradient(90deg, rgba(8,8,8,.98) 0%, rgba(8,8,8,.92) 34%, rgba(8,8,8,.38) 64%, rgba(8,8,8,.08) 100%), linear-gradient(0deg, rgba(15,12,15,.54), transparent 46%);
}
.headlight-model-product {
  scroll-margin-top: 92px;
  padding: 112px 0;
  color: #fff;
  background: #0f0c0f;
}
.headlight-model-product__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(420px, .92fr);
  gap: clamp(48px, 6vw, 88px);
  align-items: center;
}
.headlight-model-product__media {
  display: grid;
  min-width: 0;
  aspect-ratio: 1 / 1;
  place-items: center;
  overflow: hidden;
  background: transparent;
}
.headlight-model-product__image {
  display: block;
  width: min(86%, 540px);
  height: auto;
  max-height: 86%;
  object-fit: contain;
}
.headlight-model-product__offer { min-width: 0; }
.headlight-model-product__status {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  align-items: center;
  margin-bottom: 22px;
  color: #b1b1b1;
  font-size: 14px;
  line-height: 1.4;
}
.headlight-model-product__stock {
  display: inline-flex;
  gap: 9px;
  align-items: center;
  color: #fff;
}
.headlight-model-product__stock > span {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #0cb563;
  box-shadow: 0 0 0 5px rgba(12,181,99,.13);
}
.headlight-model-product__sku { letter-spacing: .04em; text-transform: uppercase; }
.headlight-film-model-page .headlight-model-product__title {
  max-width: 700px;
  margin: 0;
  font-family: DelaGothicOne, Arial, sans-serif;
  font-size: clamp(32px, 3vw, 42px);
  font-weight: 400;
  line-height: 1.08;
  letter-spacing: .01em;
  overflow-wrap: break-word;
  text-transform: uppercase;
}
.headlight-model-product__lead {
  max-width: 650px;
  margin: 24px 0 34px;
  color: #b1b1b1;
  font-size: 17px;
  line-height: 1.65;
}
.headlight-model-product__formats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}
.headlight-model-product__formats legend,
.headlight-model-product__label {
  display: block;
  margin-bottom: 10px;
  color: #b1b1b1;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.headlight-model-product__formats legend { grid-column: 1 / -1; }
.headlight-model-product__format-input {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
}
.headlight-model-product__format {
  display: flex;
  min-width: 0;
  min-height: 76px;
  padding: 16px 18px;
  flex-direction: column;
  justify-content: center;
  border: 1px solid rgba(255,255,255,.17);
  border-radius: 14px;
  color: #fff;
  background: rgba(255,255,255,.025);
  cursor: pointer;
  transition: border-color .2s ease, background-color .2s ease, transform .2s ease;
}
.headlight-model-product__format:hover { border-color: rgba(12,181,99,.66); }
.headlight-model-product__format strong { font-size: 16px; font-weight: 700; line-height: 1.35; }
.headlight-model-product__format span { margin-top: 3px; color: #b1b1b1; font-size: 13px; line-height: 1.4; }
.headlight-model-product__format-input:checked + .headlight-model-product__format {
  border-color: #0cb563;
  background: rgba(12,181,99,.1);
}
.headlight-model-product__format-input:focus-visible + .headlight-model-product__format {
  outline: 3px solid rgba(255,255,255,.94);
  outline-offset: 3px;
}
.headlight-model-product__purchase {
  display: grid;
  grid-template-columns: minmax(150px, .7fr) minmax(180px, 1fr);
  gap: 28px;
  align-items: end;
  margin-top: 28px;
}
.headlight-model-product__counter {
  display: grid;
  grid-template-columns: 44px minmax(52px, 1fr) 44px;
  width: 160px;
  min-height: 48px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 999px;
}
.headlight-model-product__counter button,
.headlight-model-product__counter input {
  min-width: 0;
  border: 0;
  color: #fff;
  background: transparent;
  font: inherit;
  text-align: center;
}
.headlight-model-product__counter button {
  min-height: 46px;
  font-size: 23px;
  cursor: pointer;
}
.headlight-model-product__counter button:hover { background: rgba(255,255,255,.07); }
.headlight-model-product__counter button:focus-visible,
.headlight-model-product__counter input:focus-visible { outline: 2px solid #0cb563; outline-offset: -3px; }
.headlight-model-product__counter input { width: 100%; font-size: 17px; font-weight: 700; -moz-appearance: textfield; }
.headlight-model-product__counter input::-webkit-inner-spin-button,
.headlight-model-product__counter input::-webkit-outer-spin-button { margin: 0; -webkit-appearance: none; }
.headlight-model-product__price-block { min-width: 0; }
.headlight-model-product__price { display: block; font-size: clamp(30px, 3.5vw, 42px); line-height: 1.05; }
.headlight-model-product__unit { display: block; margin-top: 7px; color: #b1b1b1; font-size: 14px; line-height: 1.4; }
.headlight-model-product__actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 32px;
}
.headlight-model-product__actions .headlight-film-button { width: 100%; min-width: 0; }
.headlight-model-product__quick-summary {
  margin: 18px 0 0;
  padding: 14px 16px;
  border: 1px solid rgba(12,181,99,.34);
  border-radius: 12px;
  color: #fff;
  background: rgba(12,181,99,.08);
  font-size: 14px;
  line-height: 1.55;
}
.headlight-model-appearance {
  padding: var(--hf-section-space) 0;
  color: #fff;
  background: #0f0c0f;
}
.headlight-model-appearance__layout {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
  gap: clamp(52px, 7vw, 96px);
  align-items: center;
}
.headlight-model-appearance__media {
  min-width: 0;
  margin: 0;
}
.headlight-model-appearance__media img {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  object-position: 72% center;
  filter: saturate(.84) contrast(1.04);
}
.headlight-model-appearance__media figcaption {
  padding-top: 14px;
  color: #8f8b8f;
  font-size: 12px;
  line-height: 1.5;
}
.headlight-model-appearance__copy { min-width: 0; }
.headlight-model-appearance__copy > p:not(.headlight-film-kicker) {
  max-width: 620px;
  margin-top: 26px;
  color: #b1b1b1;
  font-size: 17px;
  line-height: 1.7;
}
.headlight-model-appearance__facts {
  margin: 38px 0 0;
  border-top: 1px solid rgba(255,255,255,.14);
}
.headlight-model-appearance__facts div {
  display: grid;
  grid-template-columns: 126px minmax(0, 1fr);
  gap: 24px;
  padding: 20px 0;
  border-bottom: 1px solid rgba(255,255,255,.14);
}
.headlight-model-appearance__facts dt {
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.headlight-model-appearance__facts dd {
  margin: 0;
  color: #b1b1b1;
  line-height: 1.55;
}
.headlight-model-patterns .headlight-film-patterns__copy .headlight-film-button {
  margin-top: 32px;
}
.headlight-model-related {
  padding: var(--hf-section-space) 0;
  border-top: 1px solid rgba(255,255,255,.06);
  color: #fff;
  background: #0f0c0f;
}
.headlight-model-related__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(22px, 3vw, 34px);
}
.headlight-model-related-card {
  display: grid;
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 22px;
  color: #fff;
  background: #171617;
  text-decoration: none;
  transition: border-color .2s ease, background-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.headlight-model-related-card:hover {
  border-color: rgba(12,181,99,.66);
  color: #fff;
  background: #1d1b1d;
  box-shadow: 0 18px 50px rgba(0,0,0,.24);
  text-decoration: none;
  transform: translateY(-4px);
}
.headlight-model-related-card:active { transform: translateY(-1px); }
.headlight-model-related-card:focus-visible {
  outline: 3px solid var(--hf-focus);
  outline-offset: 4px;
}
.headlight-model-related-card__media {
  display: block;
  width: 100%;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  background: #090909;
}
.headlight-model-related-card__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .32s ease;
}
.headlight-model-related-card:hover .headlight-model-related-card__media img { transform: scale(1.035); }
.headlight-model-related-card__body {
  display: flex;
  min-height: 258px;
  padding: clamp(24px, 3vw, 34px);
  box-sizing: border-box;
  flex-direction: column;
}
.headlight-model-related-card__meta {
  color: var(--hf-green);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.4;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.headlight-model-related-card__title {
  margin-top: 16px;
  font-family: var(--fontHead, "DelaGothicOne", Arial, sans-serif);
  font-size: clamp(27px, 3vw, 38px);
  font-weight: 400;
  line-height: 1.1;
  text-transform: uppercase;
}
.headlight-model-related-card__text {
  max-width: 580px;
  margin-top: 18px;
  color: #b1b1b1;
  font-size: 15px;
  line-height: 1.65;
}
.headlight-model-related-card__link {
  display: inline-flex;
  margin-top: auto;
  padding-top: 26px;
  align-items: center;
  gap: 10px;
  color: #fff;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.3;
}
.headlight-model-related-card__link > span {
  color: var(--hf-green);
  font-size: 19px;
  transition: transform .18s ease;
}
.headlight-model-related-card:hover .headlight-model-related-card__link > span { transform: translateX(3px); }
.headlight-model-final__question {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: baseline;
  justify-content: center;
  margin: 26px auto 0;
  color: #b1b1b1;
  font-size: 15px;
  line-height: 1.55;
}
.headlight-model-final__question-link {
  min-height: 44px;
  margin: 0;
  padding: 10px 0 7px;
  box-sizing: border-box;
  border: 0;
  border-bottom: 1px solid rgba(255,255,255,.35);
  background: transparent;
  color: #fff;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.headlight-model-final__question-link:active { color: #19ca75; }
@media (min-width: 1041px) {
  .headlight-film-model-page [data-headlight-model-protection="kppf24"] h3,
  .headlight-film-model-page [data-headlight-model-care="kppf24"] h3,
  .headlight-film-model-page [data-headlight-model-care="kppf99"] h3,
  .headlight-film-model-page [data-headlight-model-protection="kppf96"] h3,
  .headlight-film-model-page [data-headlight-model-care="kppf96"] h3 { min-height: 95px; }
  .headlight-film-model-page [data-headlight-model-protection="kppf99"] h3 { min-height: 128px; }
}
@media (min-width: 761px) and (max-width: 800px) {
  .headlight-film-model-page [data-headlight-model-protection="kppf99"] h3,
  .headlight-film-model-page [data-headlight-model-protection="kppf96"] h3,
  .headlight-film-model-page [data-headlight-model-care="kppf96"] h3 { min-height: 80px; }
}
@media (max-width: 760px) {
  .headlight-film-model-page [data-headlight-model-protection="kppf99"] h3,
  .headlight-film-model-page [data-headlight-model-care="kppf96"] h3 { min-height: 72px; }
}
@media (prefers-reduced-motion: reduce) {
  .headlight-model-product__format,
  .headlight-model-related-card,
  .headlight-model-related-card__media img,
  .headlight-model-related-card__link > span { transition: none; }
}
@media (max-width: 980px) {
  .headlight-model-product { padding: 88px 0; }
  .headlight-model-product__layout { grid-template-columns: minmax(0, .9fr) minmax(360px, 1.1fr); gap: 42px; }
  .headlight-film-model-page .headlight-model-product__title { font-size: clamp(28px, 3.7vw, 34px); }
  .headlight-model-product__actions { grid-template-columns: 1fr; }
  .headlight-model-appearance__layout { gap: 46px; }
}
@media (max-width: 767px) {
  .headlight-film-model-page .headlight-film-model-hero .headlight-film-hero__image { object-position: 67% center; }
  .headlight-film-model-page .headlight-film-model-hero--96 .headlight-film-hero__image { object-position: 72% center; }
  .headlight-film-model-page .headlight-film-model-hero .headlight-film-hero__overlay {
    background: linear-gradient(90deg, rgba(8,8,8,.97) 0%, rgba(8,8,8,.82) 62%, rgba(8,8,8,.38) 100%), linear-gradient(0deg, rgba(15,12,15,.76), transparent 48%);
  }
  .headlight-film-model-page .headlight-film-model-hero h1 { font-size: clamp(34px, 10.8vw, 48px); }
  .headlight-film-model-page .headlight-film-model-hero .headlight-film-hero__lead { max-width: calc(100% - 58px); }
  .headlight-model-product { scroll-margin-top: 72px; padding: 68px 0 72px; }
  .headlight-model-product__layout { grid-template-columns: minmax(0, 1fr); gap: 36px; }
  .headlight-model-product__media { max-width: 540px; margin: 0 auto; }
  .headlight-film-model-page .headlight-model-product__title { font-size: clamp(28px, 8.4vw, 38px); }
  .headlight-model-product__lead { margin: 18px 0 28px; font-size: 15px; }
  .headlight-model-product__purchase { gap: 20px; }
  .headlight-model-appearance { padding: 72px 0; }
  .headlight-model-appearance__layout { grid-template-columns: minmax(0, 1fr); gap: 38px; }
  .headlight-model-appearance__copy { order: 1; }
  .headlight-model-appearance__media { order: 2; }
  .headlight-model-appearance__copy > p:not(.headlight-film-kicker) { margin-top: 20px; font-size: 15px; line-height: 1.65; }
  .headlight-model-appearance__facts { margin-top: 30px; }
  .headlight-model-appearance__media img { aspect-ratio: 4 / 3; object-position: 76% center; }
  .headlight-model-related { padding: 72px 0; }
  .headlight-model-related__grid { grid-template-columns: minmax(0, 1fr); }
  .headlight-model-related-card { border-radius: 18px; }
  .headlight-model-related-card__body { min-height: 0; padding: 24px 22px 26px; }
  .headlight-model-related-card__title { font-size: 28px; }
  .headlight-model-related-card__link { margin-top: 24px; padding-top: 0; }
}
@media (max-width: 520px) {
  .headlight-film-model-page .headlight-model-care h2 { font-size: 22px; }
  .headlight-model-product__formats,
  .headlight-model-product__purchase,
  .headlight-model-product__actions { grid-template-columns: minmax(0, 1fr); }
  .headlight-model-product__purchase { gap: 24px; }
  .headlight-model-product__counter { width: 100%; grid-template-columns: 48px minmax(0, 1fr) 48px; }
  .headlight-model-product__price-block { padding-top: 2px; }
  .headlight-model-product__actions .headlight-film-button { min-height: 52px; }
  .headlight-model-appearance__facts div { grid-template-columns: minmax(0, 1fr); gap: 7px; padding: 18px 0; }
}
