/* ============================================
   Shandong Hetian Machinery Co., Ltd - B2B Website Styles
   ============================================ */

/* === CSS VARIABLES === */
:root {
  --color-primary: #C8102E;
  --color-primary-dark: #9F0B23;
  --color-primary-light: #E8455C;
  --color-dark: #111820;
  --color-dark-secondary: #2B323B;
  --color-gray: #727A84;
  --color-metal: #8B929A;
  --color-light: #F3F5F7;
  --color-border: #DDE2E7;
  --color-white: #FFFFFF;
  --color-text: #151A20;
  --color-text-secondary: #5F6873;
  --color-success: #16A34A;

  --font-heading: 'Barlow Condensed', 'Arial Narrow', sans-serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --max-width: 1440px;
  --content-width: 1280px;
  --gutter: 48px;
  --radius: 6px;
  --radius-lg: 10px;
  --transition: 350ms ease;
}

/* === RESET === */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
  font-size: 16px;
}

body {
  font-family: var(--font-body);
  color: var(--color-text);
  background: var(--color-white);
  line-height: 1.6;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

a {
  color: inherit;
  text-decoration: none;
  transition: color var(--transition);
}

button {
  cursor: pointer;
  border: none;
  background: none;
  font-family: inherit;
  font-size: inherit;
}

ul, ol { list-style: none; }
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  font-weight: 700;
  line-height: 1.15;
}

/* === SKIP LINK === */
.skip-link {
  position: absolute;
  top: -100%;
  left: 16px;
  z-index: 10000;
  padding: 12px 24px;
  background: var(--color-primary);
  color: var(--color-white);
  font-weight: 600;
  border-radius: var(--radius);
}
.skip-link:focus {
  top: 16px;
}

/* === CONTAINER === */
.container {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 var(--gutter);
}

/* === BUTTONS === */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 14px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  padding: 14px 28px;
  border-radius: var(--radius);
  transition: all var(--transition);
  white-space: nowrap;
  border: 2px solid transparent;
  min-height: 48px;
}

.btn--primary {
  background: var(--color-primary);
  color: var(--color-white);
  border-color: var(--color-primary);
}
.btn--primary:hover {
  background: var(--color-primary-dark);
  border-color: var(--color-primary-dark);
  transform: translateY(-2px);
}

.btn--outline {
  background: transparent;
  color: var(--color-white);
  border-color: var(--color-white);
}
.btn--outline:hover {
  background: var(--color-white);
  color: var(--color-dark);
}

.btn--outline-dark {
  background: transparent;
  color: var(--color-text);
  border-color: var(--color-border);
}
.btn--outline-dark:hover {
  border-color: var(--color-primary);
  color: var(--color-primary);
}

.btn--sm {
  padding: 10px 20px;
  font-size: 13px;
  min-height: 40px;
}

.btn.btn--outline-dark.btn--sm,
.btn.btn--outline-dark.btn--sm:hover {
  color: var(--color-white);
}

.btn--lg {
  padding: 16px 36px;
  font-size: 15px;
  min-height: 52px;
}

.btn--block {
  display: flex;
  width: 100%;
}

/* === SECTION === */
.section {
  padding: 110px 0;
}
.section--gray { background: var(--color-light); }
.section--white { background: var(--color-white); }

/* === SECTION HEADER === */
.section-header {
  text-align: center;
  max-width: 720px;
  margin: 0 auto 60px;
}
.section-header__eyebrow {
  display: inline-block;
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--color-primary);
  margin-bottom: 16px;
}
.section-header__eyebrow--light { color: rgba(255,255,255,0.7); }
.section-header__title {
  font-size: 48px;
  color: var(--color-text);
  margin-bottom: 20px;
  letter-spacing: -0.5px;
}
.section-header__title--light { color: var(--color-white); }
.section-header__desc {
  font-size: 17px;
  color: var(--color-text-secondary);
  line-height: 1.7;
}

/* ============================
   TOP BAR
   ============================ */
.top-bar {
  background: var(--color-dark);
  color: rgba(255,255,255,0.7);
  font-size: 13px;
  height: 38px;
  display: flex;
  align-items: center;
  position: relative;
  z-index: 100;
}
.top-bar__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
.top-bar__text {
  font-weight: 500;
}
.top-bar__links {
  display: flex;
  align-items: center;
  gap: 20px;
}
.top-bar__link {
  display: flex;
  align-items: center;
  gap: 6px;
  color: rgba(255,255,255,0.7);
  transition: color var(--transition);
}
.top-bar__link:hover { color: var(--color-white); }
.top-bar__lang {
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
}

/* ============================
   HEADER
   ============================ */
.header {
  background: var(--color-white);
  height: 88px;
  display: flex;
  align-items: center;
  position: sticky;
  top: 0;
  z-index: 90;
  box-shadow: 0 1px 0 var(--color-border);
  transition: height var(--transition), box-shadow var(--transition);
}
.header.scrolled {
  height: 70px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.08);
}
.header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  gap: 24px;
}

/* Logo */
.header__logo {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}
.logo-icon svg { display: block; }
.logo-text {
  display: flex;
  flex-direction: column;
  line-height: 1.1;
}
.logo-text__main {
  font-family: var(--font-heading);
  font-size: 22px;
  font-weight: 800;
  color: var(--color-dark);
  letter-spacing: 2px;
}
.logo-text__sub {
  font-family: var(--font-heading);
  font-size: 13px;
  font-weight: 600;
  color: var(--color-gray);
  letter-spacing: 3px;
}
.logo-text__tagline {
  font-size: 9px;
  font-weight: 500;
  color: var(--color-metal);
  letter-spacing: 1.5px;
  text-transform: uppercase;
  margin-top: 2px;
}

/* Navigation */
.nav {
  display: flex;
  align-items: center;
  min-width: 0;
}
.nav__list {
  display: flex;
  align-items: center;
  gap: 4px;
}
.nav__item { position: relative; }
.nav__link {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 8px 14px;
  font-size: 14px;
  font-weight: 500;
  color: var(--color-text);
  transition: color var(--transition);
  white-space: nowrap;
}
.nav__link:hover,
.nav__link--active {
  color: var(--color-primary);
}
.nav__arrow {
  transition: transform var(--transition);
}

/* Mega Menu */
.mega-menu {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  background: var(--color-white);
  box-shadow: 0 8px 32px rgba(0,0,0,0.12);
  border-radius: 0 0 var(--radius-lg) var(--radius-lg);
  padding: 24px 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: all var(--transition);
  min-width: 560px;
}
.nav__item--has-dropdown:hover .mega-menu,
.nav__item--has-dropdown:focus-within .mega-menu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.nav__item--has-dropdown:hover .nav__arrow {
  transform: rotate(180deg);
}
.mega-menu__inner { max-width: var(--content-width); }
.mega-menu__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 4px;
}
.mega-menu__grid--parts { grid-template-columns: repeat(4, 1fr); min-width: 640px; }
.mega-menu__grid--service { grid-template-columns: repeat(3, 1fr); min-width: 420px; }
.mega-menu__item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  border-radius: var(--radius);
  transition: background var(--transition);
  font-size: 14px;
  font-weight: 500;
  color: var(--color-text);
}
.mega-menu__item:hover {
  background: var(--color-light);
  color: var(--color-primary);
}
.mega-menu__item--view-all {
  color: var(--color-primary);
  font-weight: 600;
  margin-top: 8px;
  border-top: 1px solid var(--color-border);
  padding-top: 16px;
}
.mega-menu__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: var(--radius);
  background: var(--color-light);
  color: var(--color-primary);
  flex-shrink: 0;
}

/* Header Actions */
.header__actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 1;
  min-width: 0;
}
.header__action-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: var(--radius);
  color: var(--color-text);
  transition: all var(--transition);
}
.header__action-btn:hover {
  background: var(--color-light);
  color: var(--color-primary);
}
.header__quote-btn { margin-left: 8px; }
.header__hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 40px;
  height: 40px;
  padding: 8px;
}
.header__hamburger-line {
  display: block;
  width: 24px;
  height: 2px;
  background: var(--color-dark);
  border-radius: 2px;
  transition: all var(--transition);
}
.header__hamburger.active .header__hamburger-line:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}
.header__hamburger.active .header__hamburger-line:nth-child(2) {
  opacity: 0;
}
.header__hamburger.active .header__hamburger-line:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

/* ============================
   MOBILE MENU
   ============================ */
.mobile-menu {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1000;
}
.mobile-menu[hidden] { display: none; }
.mobile-menu__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.5);
}
.mobile-menu__panel {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 320px;
  max-width: 85vw;
  background: var(--color-white);
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  transform: translateX(100%);
  transition: transform 300ms ease;
}
.mobile-menu.open .mobile-menu__panel {
  transform: translateX(0);
}
.mobile-menu__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px;
  border-bottom: 1px solid var(--color-border);
}
.mobile-menu__title {
  font-family: var(--font-heading);
  font-size: 20px;
  font-weight: 700;
}
.mobile-menu__close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  color: var(--color-text);
}
.mobile-menu__nav {
  flex: 1;
  padding: 16px 0;
}
.mobile-menu__list { padding: 0 16px; }
.mobile-menu__link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 14px 8px;
  font-size: 15px;
  font-weight: 500;
  color: var(--color-text);
  border-bottom: 1px solid var(--color-border);
  text-align: left;
}
.mobile-menu__link--active { color: var(--color-primary); }
.mobile-menu__arrow {
  transition: transform var(--transition);
}
.mobile-menu__toggle[aria-expanded="true"] .mobile-menu__arrow {
  transform: rotate(180deg);
}
.mobile-menu__submenu {
  padding: 0 0 0 16px;
}
.mobile-menu__sublink {
  display: block;
  padding: 10px 8px;
  font-size: 14px;
  color: var(--color-text-secondary);
  border-bottom: 1px solid var(--color-border);
}
.mobile-menu__sublink:hover,
.mobile-menu__sublink--all {
  color: var(--color-primary);
  font-weight: 500;
}
.mobile-menu__footer {
  padding: 20px 24px;
  border-top: 1px solid var(--color-border);
}
.mobile-menu__phone {
  display: block;
  text-align: center;
  margin-top: 12px;
  font-size: 14px;
  color: var(--color-text-secondary);
}

/* ============================
   HERO
   ============================ */
.hero {
  position: relative;
  height: 820px;
  overflow: hidden;
}
.hero__slider {
  position: relative;
  width: 100%;
  height: 100%;
}
.hero__slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity 700ms ease, visibility 700ms ease;
}
.hero__slide--active {
  opacity: 1;
  visibility: visible;
}
.hero__bg {
  position: absolute;
  inset: 0;
}
.hero__bg-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  animation: heroZoom 20s ease-in-out infinite alternate;
}
@keyframes heroZoom {
  from { transform: scale(1); }
  to { transform: scale(1.05); }
}
.hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(17,24,32,0.85) 0%, rgba(17,24,32,0.6) 40%, rgba(17,24,32,0.1) 70%, rgba(17,24,32,0) 100%);
}
.hero__content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  height: 100%;
  max-width: var(--max-width);
  padding-top: 40px;
  text-align: left;
}
.hero__eyebrow {
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 2px;
  color: var(--color-primary-light);
  margin-bottom: 20px;
}
.hero__title {
  max-width: 760px;
  font-family: var(--font-heading);
  font-size: 68px;
  font-weight: 800;
  color: var(--color-white);
  line-height: 1.08;
  margin-bottom: 24px;
  letter-spacing: -0.5px;
}
.hero__desc {
  font-size: 18px;
  color: rgba(255,255,255,0.8);
  line-height: 1.7;
  margin-bottom: 36px;
  max-width: 620px;
}
.hero__buttons {
  display: flex;
  gap: 16px;
  margin-bottom: 40px;
}
.hero__tags {
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
}
.hero__tag {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 500;
  color: rgba(255,255,255,0.75);
}
.hero__tag svg { color: var(--color-primary-light); }

/* Hero Controls */
.hero__arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,0.1);
  border: 1px solid rgba(255,255,255,0.2);
  color: var(--color-white);
  border-radius: 50%;
  backdrop-filter: blur(8px);
  transition: all var(--transition);
}
.hero__arrow:hover {
  background: var(--color-primary);
  border-color: var(--color-primary);
}
.hero__arrow--prev { left: 32px; }
.hero__arrow--next { right: 32px; }

.hero__dots {
  position: absolute;
  bottom: 36px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 3;
  display: flex;
  gap: 10px;
}
.hero__dot {
  width: 32px;
  height: 4px;
  border-radius: 2px;
  background: rgba(255,255,255,0.3);
  transition: all var(--transition);
}
.hero__dot--active {
  background: var(--color-primary);
  width: 48px;
}

/* Hero Animation */
.hero__slide--active .hero__eyebrow,
.hero__slide--active .hero__title,
.hero__slide--active .hero__desc,
.hero__slide--active .hero__buttons,
.hero__slide--active .hero__tags {
  animation: fadeSlideUp 700ms ease forwards;
}
.hero__slide--active .hero__title { animation-delay: 100ms; }
.hero__slide--active .hero__desc { animation-delay: 200ms; }
.hero__slide--active .hero__buttons { animation-delay: 300ms; }
.hero__slide--active .hero__tags { animation-delay: 400ms; }

@keyframes fadeSlideUp {
  from {
    opacity: 0;
    transform: translateY(24px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ============================
   STATS
   ============================ */
.stats {
  background: var(--color-dark);
  padding: 48px 0;
}
.stats__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0;
}
.stats__item {
  flex: 1;
  text-align: center;
  padding: 8px 16px;
}
.stats__number {
  font-family: var(--font-heading);
  font-size: 42px;
  font-weight: 800;
  color: var(--color-white);
}
.stats__plus, .stats__comma {
  font-family: var(--font-heading);
  font-size: 42px;
  font-weight: 800;
  color: var(--color-primary);
}
.stats__unit {
  font-family: var(--font-heading);
  font-size: 28px;
  font-weight: 700;
  color: var(--color-primary);
}
.stats__label {
  display: block;
  font-size: 14px;
  color: rgba(255,255,255,0.6);
  margin-top: 4px;
  line-height: 1.4;
}
.stats__divider {
  width: 1px;
  height: 48px;
  background: rgba(255,255,255,0.12);
}

/* ============================
   CATEGORIES
   ============================ */
.categories__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}
.category-card {
  position: relative;
  background: var(--color-white);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: all var(--transition);
  display: block;
  border: 1px solid var(--color-border);
}
.category-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 40px rgba(0,0,0,0.08);
  border-color: var(--color-primary);
}
.category-card__number {
  position: absolute;
  top: 16px;
  right: 16px;
  font-family: var(--font-heading);
  font-size: 48px;
  font-weight: 800;
  color: rgba(0,0,0,0.04);
  z-index: 1;
  line-height: 1;
}
.category-card__img {
  height: 220px;
  overflow: hidden;
  background: var(--color-light);
}
.category-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--transition);
}
.category-card:hover .category-card__img img {
  transform: scale(1.04);
}
.category-card__content {
  padding: 24px;
  position: relative;
}
.category-card__content::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 24px;
  right: 24px;
  height: 3px;
  background: var(--color-primary);
  transform: scaleX(0);
  transition: transform var(--transition);
}
.category-card:hover .category-card__content::after {
  transform: scaleX(1);
}
.category-card__title {
  font-size: 20px;
  color: var(--color-text);
  margin-bottom: 10px;
}
.category-card__desc {
  font-size: 14px;
  color: var(--color-text-secondary);
  line-height: 1.6;
  margin-bottom: 12px;
}
.category-card__hp {
  display: inline-block;
  font-size: 13px;
  font-weight: 600;
  color: var(--color-primary);
  margin-bottom: 16px;
}
.category-card__btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  font-weight: 600;
  color: var(--color-primary);
}
.category-card__btn svg {
  transition: transform var(--transition);
}
.category-card:hover .category-card__btn svg {
  transform: translateX(4px);
}

/* ============================
   HP SELECTOR
   ============================ */
.hp-selector__header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 40px;
}
.hp-selector__header .section-header__eyebrow,
.hp-selector__header .section-header__title,
.hp-selector__header .section-header__desc {
  text-align: left;
  margin-bottom: 0;
}
.hp-selector__header .section-header__title { margin-bottom: 8px; }
.hp-selector__header .section-header__desc { margin-bottom: 0; }

.hp-tabs {
  display: flex;
  gap: 6px;
  margin-bottom: 28px;
}
.hp-tabs__btn {
  flex: 1;
  padding: 16px 20px;
  font-family: var(--font-heading);
  font-size: 15px;
  font-weight: 600;
  color: var(--color-text-secondary);
  background: var(--color-light);
  border: 2px solid transparent;
  border-radius: var(--radius-lg);
  transition: all var(--transition);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  cursor: pointer;
}
.hp-tabs__hp {
  font-family: var(--font-heading);
  font-size: 20px;
  font-weight: 800;
  color: var(--color-text);
}
.hp-tabs__label {
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 500;
  color: var(--color-metal);
}
.hp-tabs__btn--active {
  background: var(--color-white);
  border-color: var(--color-primary);
  color: var(--color-primary);
  box-shadow: 0 4px 16px rgba(200,16,46,0.1);
}
.hp-tabs__btn--active .hp-tabs__hp { color: var(--color-primary); }
.hp-tabs__btn--active .hp-tabs__label { color: var(--color-primary); }
.hp-tabs__btn:hover { border-color: var(--color-primary); }

.hp-panel { display: none; }
.hp-panel--active { display: block; }

/* HP Card Grid */
.hp-panel__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

/* HP Card */
.hp-card {
  display: flex;
  flex-direction: column;
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: all var(--transition);
  text-decoration: none;
  color: inherit;
}
.hp-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 28px rgba(0,0,0,0.08);
  border-color: var(--color-primary);
}
.hp-card__img {
  aspect-ratio: 3 / 2;
  background: var(--color-light);
  overflow: hidden;
}
.hp-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--transition);
}
.hp-card:hover .hp-card__img img { transform: scale(1.04); }
.hp-card__body {
  padding: 16px;
  text-align: center;
}
.hp-card__model {
  display: block;
  font-family: var(--font-heading);
  font-size: 18px;
  font-weight: 800;
  color: var(--color-primary);
  letter-spacing: 1px;
  margin-bottom: 4px;
}
.hp-card__name {
  display: block;
  font-size: 14px;
  font-weight: 600;
  color: var(--color-text);
  margin-bottom: 2px;
}
.hp-card__type {
  display: block;
  font-size: 12px;
  color: var(--color-metal);
}

/* CTA Card */
.hp-card--cta {
  background: var(--color-light);
  border: 2px dashed var(--color-border);
  justify-content: center;
}
.hp-card--cta:hover {
  border-color: var(--color-primary);
  border-style: solid;
  background: var(--color-white);
}
.hp-card__cta-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
  text-align: center;
  gap: 10px;
}
.hp-card__cta-inner svg { color: var(--color-metal); }
.hp-card--cta:hover .hp-card__cta-inner svg { color: var(--color-primary); }
.hp-card__cta-text {
  font-size: 14px;
  font-weight: 600;
  color: var(--color-text);
}
.hp-card__cta-link {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 13px;
  font-weight: 500;
  color: var(--color-primary);
}

/* Product Grid */
.product-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}

/* Product Card */
.product-card {
  background: var(--color-white);
  border-radius: var(--radius-lg);
  overflow: hidden;
  border: 1px solid var(--color-border);
  transition: all var(--transition);
}
.product-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 8px 32px rgba(0,0,0,0.08);
  border-bottom-color: var(--color-primary);
}
.product-card__img {
  aspect-ratio: 3 / 2;
  background: var(--color-light);
  overflow: hidden;
}
.product-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--transition);
}
.product-card:hover .product-card__img img {
  transform: scale(1.04);
}
.product-card__info {
  padding: 20px;
}
.product-card__model {
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 700;
  color: var(--color-primary);
  letter-spacing: 1px;
}
.product-card__name {
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 600;
  color: var(--color-text);
  margin: 8px 0 14px;
}
.product-card__specs {
  margin-bottom: 16px;
}
.product-card__specs li {
  font-size: 13px;
  color: var(--color-text-secondary);
  padding: 4px 0;
  border-bottom: 1px solid var(--color-light);
}
.product-card__specs li strong {
  color: var(--color-text);
  font-weight: 500;
}
.product-card__specs-grid {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}
.product-card__specs-grid span {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 13px;
  color: var(--color-text-secondary);
  font-weight: 500;
}
.product-card__actions {
  display: flex;
  gap: 8px;
}
.product-card__actions .btn { flex: 1; }

/* Featured specific */
.product-card--featured .product-card__info {
  padding: 20px;
}
.product-card__request {
  transition: all var(--transition);
}
.product-card:hover .product-card__request {
  background: var(--color-primary);
  border-color: var(--color-primary);
  color: var(--color-white);
}

/* ============================
   FEATURED
   ============================ */
.featured__tabs {
  display: flex;
  gap: 4px;
  margin-bottom: 36px;
  justify-content: center;
  flex-wrap: wrap;
}
.featured__tab {
  padding: 10px 22px;
  font-size: 14px;
  font-weight: 600;
  color: var(--color-text-secondary);
  border-radius: var(--radius);
  border: 1px solid var(--color-border);
  transition: all var(--transition);
}
.featured__tab--active {
  background: var(--color-primary);
  color: var(--color-white);
  border-color: var(--color-primary);
}
.featured__tab:hover:not(.featured__tab--active) {
  border-color: var(--color-primary);
  color: var(--color-primary);
}
.featured__panel { display: none; }
.featured__panel--active { display: block; }
.product-grid--featured {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}

/* ============================
   MANUFACTURING
   ============================ */
.manufacturing {
  background: var(--color-dark);
  overflow: hidden;
}
.manufacturing__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
}
.manufacturing__image {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.manufacturing__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  min-height: 500px;
}
.manufacturing__play {
  position: absolute;
  bottom: 24px;
  left: 24px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 24px;
  background: rgba(0,0,0,0.6);
  backdrop-filter: blur(8px);
  border-radius: var(--radius);
  color: var(--color-white);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 1px;
  transition: all var(--transition);
}
.manufacturing__play:hover {
  background: var(--color-primary);
}
.manufacturing__play svg {
  color: var(--color-primary);
}
.manufacturing__content {
  color: var(--color-white);
}
.manufacturing__content .section-header__title {
  color: var(--color-white);
  text-align: left;
}
.manufacturing__text {
  font-size: 16px;
  color: rgba(255,255,255,0.7);
  line-height: 1.7;
  margin-bottom: 36px;
}
.manufacturing__features {
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin-bottom: 36px;
}
.manufacturing__feature {
  display: flex;
  gap: 16px;
  align-items: flex-start;
}
.manufacturing__feature-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: var(--radius);
  background: rgba(255,255,255,0.08);
  color: var(--color-primary);
  flex-shrink: 0;
}
.manufacturing__feature-title {
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 600;
  color: var(--color-white);
  margin-bottom: 4px;
}
.manufacturing__feature-desc {
  font-size: 14px;
  color: rgba(255,255,255,0.6);
  line-height: 1.5;
}

/* ============================
   QUALITY CONTROL
   ============================ */
.quality__timeline {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: 12px;
  margin-bottom: 48px;
}
.quality__step {
  text-align: center;
  padding: 24px 8px;
  position: relative;
}
.quality__step::after {
  content: '';
  position: absolute;
  top: 52px;
  right: -6px;
  width: 12px;
  height: 2px;
  background: var(--color-border);
}
.quality__step:last-child::after { display: none; }
.quality__step-num {
  display: block;
  font-family: var(--font-heading);
  font-size: 14px;
  font-weight: 700;
  color: var(--color-primary);
  margin-bottom: 12px;
}
.quality__step-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--color-light);
  color: var(--color-primary);
  margin: 0 auto 12px;
  border: 2px solid var(--color-border);
}
.quality__step-title {
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 600;
  color: var(--color-text);
  margin-bottom: 6px;
}
.quality__step-desc {
  font-size: 12px;
  color: var(--color-text-secondary);
  line-height: 1.5;
}
.quality__promise {
  text-align: center;
  padding: 32px;
  background: var(--color-light);
  border-radius: var(--radius-lg);
  border-left: 4px solid var(--color-primary);
}
.quality__promise p {
  font-size: 17px;
  font-weight: 500;
  color: var(--color-text);
  margin-bottom: 20px;
}

/* ============================
   PARTS
   ============================ */
.parts__inner {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 64px;
  align-items: center;
}
.parts__image {
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.parts__image img {
  width: 100%;
  object-fit: cover;
}
.parts__text {
  font-size: 16px;
  color: var(--color-text-secondary);
  line-height: 1.7;
  margin-bottom: 28px;
}
.parts__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  margin-bottom: 28px;
}
.parts__subtitle {
  font-family: var(--font-body);
  font-size: 15px;
  font-weight: 600;
  color: var(--color-text);
  margin-bottom: 12px;
}
.parts__list li {
  font-size: 14px;
  color: var(--color-text-secondary);
  padding: 8px 0;
  border-bottom: 1px solid var(--color-border);
  padding-left: 16px;
  position: relative;
}
.parts__list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  width: 6px;
  height: 6px;
  background: var(--color-primary);
  border-radius: 50%;
  transform: translateY(-50%);
}
.parts__actions {
  display: flex;
  gap: 12px;
  margin-bottom: 28px;
}
.parts__quick-inquiry {
  background: var(--color-light);
  padding: 20px 24px;
  border-radius: var(--radius);
  border-left: 4px solid var(--color-primary);
}
.parts__quick-inquiry p {
  font-size: 14px;
  color: var(--color-text-secondary);
  margin-bottom: 12px;
  line-height: 1.6;
}
.parts__quick-inquiry strong {
  color: var(--color-text);
}

/* ============================
   APPLICATIONS
   ============================ */
.applications__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.app-card {
  display: block;
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: var(--color-white);
  border: 1px solid var(--color-border);
  transition: all var(--transition);
}
.app-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 28px rgba(0,0,0,0.08);
  border-color: var(--color-primary);
}
.app-card__img {
  aspect-ratio: 3 / 2;
  overflow: hidden;
}
.app-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--transition);
}
.app-card:hover .app-card__img img {
  transform: scale(1.05);
}
.app-card__content {
  padding: 20px;
}
.app-card__title {
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 600;
  color: var(--color-text);
  margin-bottom: 8px;
}
.app-card__desc {
  font-size: 14px;
  color: var(--color-text-secondary);
  margin-bottom: 10px;
  line-height: 1.5;
}
.app-card__hp {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: var(--color-primary);
  margin-bottom: 12px;
}
.app-card__btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  font-weight: 600;
  color: var(--color-primary);
}
.app-card__btn svg { transition: transform var(--transition); }
.app-card:hover .app-card__btn svg { transform: translateX(4px); }

/* ============================
   OEM
   ============================ */
.oem {
  background: var(--color-dark);
  overflow: hidden;
}
.oem__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: center;
}
.oem__visual {
  position: relative;
}
.oem__visual img {
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  display: block;
}
.oem__points {
  position: absolute;
  inset: 0;
}
.oem__point {
  position: absolute;
  display: flex;
  align-items: center;
  gap: 8px;
}
.oem__point-dot {
  width: 12px;
  height: 12px;
  background: var(--color-primary);
  border-radius: 50%;
  border: 2px solid var(--color-white);
  box-shadow: 0 0 0 4px rgba(200,16,46,0.3);
  animation: oemPulse 2s ease-in-out infinite;
}
@keyframes oemPulse {
  0%, 100% { box-shadow: 0 0 0 4px rgba(200,16,46,0.3); }
  50% { box-shadow: 0 0 0 8px rgba(200,16,46,0.1); }
}
.oem__point-label {
  font-size: 12px;
  font-weight: 600;
  color: var(--color-white);
  background: rgba(0,0,0,0.6);
  padding: 4px 10px;
  border-radius: var(--radius);
  backdrop-filter: blur(4px);
  white-space: nowrap;
}
.oem__content {
  color: var(--color-white);
}
.oem__content .section-header__title {
  color: var(--color-white);
  text-align: left;
}
.oem__text {
  font-size: 16px;
  color: rgba(255,255,255,0.7);
  line-height: 1.7;
  margin-bottom: 32px;
}
.oem__options {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  margin-bottom: 36px;
}
.oem__option {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  background: rgba(255,255,255,0.06);
  border-radius: var(--radius);
  font-size: 14px;
  font-weight: 500;
  color: rgba(255,255,255,0.85);
  border: 1px solid rgba(255,255,255,0.08);
}
.oem__option-icon {
  font-family: var(--font-heading);
  font-size: 14px;
  font-weight: 700;
  color: var(--color-primary);
  min-width: 24px;
}
.oem__actions {
  display: flex;
  gap: 12px;
}

/* ============================
   DEALER
   ============================ */
.dealer {
  position: relative;
  overflow: hidden;
  padding: 120px 0;
}
.dealer__bg {
  position: absolute;
  inset: 0;
}
.dealer__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.dealer__overlay {
  position: absolute;
  inset: 0;
  background: rgba(17,24,32,0.82);
}
.dealer__content {
  position: relative;
  z-index: 2;
  text-align: center;
  max-width: 900px;
  margin: 0 auto;
}
.dealer__text {
  font-size: 17px;
  color: rgba(255,255,255,0.75);
  line-height: 1.7;
  margin-bottom: 40px;
}
.dealer__benefits {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-bottom: 40px;
}
.dealer__benefit {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 20px;
  background: rgba(255,255,255,0.06);
  border-radius: var(--radius);
  border: 1px solid rgba(255,255,255,0.1);
  font-size: 15px;
  font-weight: 500;
  color: var(--color-white);
}
.dealer__benefit svg { color: var(--color-primary); flex-shrink: 0; }
.dealer__actions {
  display: flex;
  gap: 16px;
  justify-content: center;
}

/* ============================
   SERVICE
   ============================ */
.service__phases {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  margin-bottom: 40px;
}
.service__phase {
  padding: 28px 24px;
  background: var(--color-light);
  border-radius: var(--radius-lg);
  border-top: 3px solid var(--color-primary);
  transition: all var(--transition);
}
.service__phase:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.06);
}
.service__phase-num {
  font-family: var(--font-heading);
  font-size: 32px;
  font-weight: 800;
  color: var(--color-primary);
  opacity: 0.3;
  display: block;
  margin-bottom: 12px;
}
.service__phase-title {
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 600;
  color: var(--color-text);
  margin-bottom: 10px;
}
.service__phase-desc {
  font-size: 14px;
  color: var(--color-text-secondary);
  line-height: 1.6;
}
.service__tags {
  display: flex;
  gap: 12px;
  justify-content: center;
  margin-bottom: 32px;
  flex-wrap: wrap;
}
.service__tag {
  padding: 10px 20px;
  background: var(--color-light);
  border-radius: var(--radius);
  font-size: 14px;
  font-weight: 500;
  color: var(--color-text-secondary);
  border: 1px solid var(--color-border);
}
.service__action { text-align: center; }

/* ============================
   GALLERY
   ============================ */
.gallery__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: 32px;
}
.gallery__item {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  aspect-ratio: 4/3;
}
.gallery__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--transition);
}
.gallery__item:hover img {
  transform: scale(1.05);
}
.gallery__info {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 12px 16px;
  background: linear-gradient(transparent, rgba(0,0,0,0.7));
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
.gallery__label {
  font-size: 13px;
  font-weight: 500;
  color: var(--color-white);
}
.gallery__model {
  font-family: var(--font-heading);
  font-size: 12px;
  font-weight: 700;
  color: var(--color-primary-light);
  letter-spacing: 1px;
}
.gallery__note {
  text-align: center;
  font-size: 16px;
  color: var(--color-text-secondary);
  margin-bottom: 20px;
}
.gallery__action { text-align: center; }

/* ============================
   VIDEOS
   ============================ */
.videos {
  background: var(--color-dark);
}
.videos .section-header__title { color: var(--color-white); }
.videos__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-bottom: 36px;
}
.video-card {
  background: var(--color-dark-secondary);
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.video-card__thumb {
  position: relative;
  aspect-ratio: 16/9;
  overflow: hidden;
}
.video-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.video-card__play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 64px;
  height: 64px;
  background: var(--color-primary);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-white);
  transition: all var(--transition);
  box-shadow: 0 4px 20px rgba(200,16,46,0.4);
}
.video-card__play:hover {
  transform: translate(-50%, -50%) scale(1.1);
}
.video-card__duration {
  position: absolute;
  bottom: 8px;
  right: 8px;
  padding: 4px 8px;
  background: rgba(0,0,0,0.7);
  border-radius: 4px;
  font-size: 12px;
  color: var(--color-white);
}
.video-card__title {
  padding: 16px 20px 8px;
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 600;
  color: var(--color-white);
}
.video-card__link {
  display: block;
  padding: 0 20px 16px;
  font-size: 13px;
  font-weight: 600;
  color: var(--color-primary);
  text-transform: uppercase;
  letter-spacing: 1px;
}
.videos__action { text-align: center; }

/* ============================
   FAQ
   ============================ */
.faq__list {
  max-width: 800px;
  margin: 0 auto 32px;
}
.faq__item {
  border-bottom: 1px solid var(--color-border);
}
.faq__question {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 20px 0;
  font-size: 16px;
  font-weight: 600;
  color: var(--color-text);
  text-align: left;
  gap: 16px;
}
.faq__question:hover { color: var(--color-primary); }
.faq__icon {
  flex-shrink: 0;
  transition: transform var(--transition);
  color: var(--color-primary);
}
.faq__question[aria-expanded="true"] .faq__icon {
  transform: rotate(45deg);
}
.faq__answer {
  padding: 0 0 20px;
}
.faq__answer p {
  font-size: 15px;
  color: var(--color-text-secondary);
  line-height: 1.7;
}
.faq__action { text-align: center; }

/* ============================
   NEWS
   ============================ */
.news__header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 40px;
}
.news__header .section-header__eyebrow,
.news__header .section-header__title {
  text-align: left;
  margin-bottom: 0;
}
.news__header .section-header__title { margin-bottom: 0; }
.news__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.news-card {
  display: block;
  background: var(--color-white);
  border-radius: var(--radius-lg);
  overflow: hidden;
  border: 1px solid var(--color-border);
  transition: all var(--transition);
}
.news-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 28px rgba(0,0,0,0.08);
}
.news-card__img {
  height: 200px;
  overflow: hidden;
}
.news-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--transition);
}
.news-card:hover .news-card__img img {
  transform: scale(1.04);
}
.news-card__content {
  padding: 20px;
}
.news-card__cat {
  font-size: 12px;
  font-weight: 600;
  color: var(--color-primary);
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-right: 12px;
}
.news-card__date {
  font-size: 12px;
  color: var(--color-metal);
}
.news-card__title {
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 600;
  color: var(--color-text);
  margin: 10px 0;
  line-height: 1.4;
}
.news-card__excerpt {
  font-size: 14px;
  color: var(--color-text-secondary);
  line-height: 1.6;
  margin-bottom: 14px;
}
.news-card__more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  font-weight: 600;
  color: var(--color-primary);
}
.news-card__more svg { transition: transform var(--transition); }
.news-card:hover .news-card__more svg { transform: translateX(4px); }

/* ============================
   CTA FORM
   ============================ */
.cta {
  position: relative;
  overflow: hidden;
  padding: 100px 0;
}
.cta__bg {
  position: absolute;
  inset: 0;
}
.cta__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.cta__overlay {
  position: absolute;
  inset: 0;
  background: rgba(17,24,32,0.85);
}
.cta__inner {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 64px;
  align-items: flex-start;
}
.cta__content {
  padding-top: 20px;
}
.cta__text {
  font-size: 17px;
  color: rgba(255,255,255,0.75);
  line-height: 1.7;
  margin-bottom: 28px;
}
.cta__tags {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.cta__tag {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 18px;
  background: rgba(255,255,255,0.06);
  border-radius: var(--radius);
  font-size: 14px;
  font-weight: 500;
  color: rgba(255,255,255,0.85);
  border: 1px solid rgba(255,255,255,0.1);
}
.cta__tag::before {
  content: '';
  width: 8px;
  height: 8px;
  background: var(--color-primary);
  border-radius: 50%;
  flex-shrink: 0;
}

.cta__form {
  background: var(--color-white);
  padding: 36px;
  border-radius: var(--radius-lg);
}
.cta__form-title {
  font-family: var(--font-heading);
  font-size: 26px;
  font-weight: 700;
  color: var(--color-text);
  margin-bottom: 24px;
}
.cta__honeypot {
  position: absolute;
  left: -9999px;
  opacity: 0;
  height: 0;
}
.cta__form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: 16px;
}
.cta__field {
  display: flex;
  flex-direction: column;
}
.cta__field label {
  font-size: 13px;
  font-weight: 500;
  color: var(--color-text);
  margin-bottom: 6px;
}
.required { color: var(--color-primary); }
.cta__field input,
.cta__field select,
.cta__field textarea {
  padding: 12px 14px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  font-family: var(--font-body);
  font-size: 14px;
  color: var(--color-text);
  transition: border-color var(--transition);
  background: var(--color-white);
}
.cta__field input:focus,
.cta__field select:focus,
.cta__field textarea:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(200,16,46,0.1);
}
.cta__field input.error,
.cta__field select.error {
  border-color: var(--color-primary);
}
.cta__error {
  font-size: 12px;
  color: var(--color-primary);
  margin-top: 4px;
  min-height: 16px;
}
.cta__field--full {
  grid-column: 1 / -1;
  margin-bottom: 16px;
}
.cta__checkbox {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  cursor: pointer;
  font-size: 13px;
  color: var(--color-text-secondary);
  line-height: 1.5;
}
.cta__checkbox input {
  margin-top: 3px;
  width: 16px;
  height: 16px;
  accent-color: var(--color-primary);
}
.cta__submit {
  width: 100%;
}
.cta__success {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 20px;
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  border-radius: var(--radius);
  margin-top: 16px;
}
.cta__success svg { color: var(--color-success); flex-shrink: 0; }
.cta__success p {
  font-size: 14px;
  color: #166534;
  font-weight: 500;
}

/* ============================
   FOOTER
   ============================ */
.footer {
  background: var(--color-dark);
  color: rgba(255,255,255,0.7);
  padding-top: 72px;
}
.footer__top {
  display: grid;
  grid-template-columns: 1.4fr repeat(4, 1fr);
  gap: 40px;
  padding-bottom: 48px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.footer__logo {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
}
.logo-text--footer .logo-text__main { color: var(--color-white); }
.logo-text--footer .logo-text__sub { color: rgba(255,255,255,0.5); }
.footer__about {
  font-size: 14px;
  line-height: 1.7;
  color: rgba(255,255,255,0.55);
}
.footer__heading {
  font-family: var(--font-body);
  font-size: 15px;
  font-weight: 600;
  color: var(--color-white);
  margin-bottom: 20px;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.footer__links li {
  margin-bottom: 10px;
}
.footer__links a {
  font-size: 14px;
  color: rgba(255,255,255,0.55);
  transition: color var(--transition);
}
.footer__links a:hover { color: var(--color-white); }
.footer__contact li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 14px;
  font-size: 14px;
  color: rgba(255,255,255,0.55);
}
.footer__contact svg {
  flex-shrink: 0;
  margin-top: 2px;
  color: var(--color-primary);
}
.footer__contact a {
  color: rgba(255,255,255,0.55);
  transition: color var(--transition);
}
.footer__contact a:hover { color: var(--color-white); }
.footer__social {
  display: flex;
  gap: 12px;
  margin-top: 16px;
}
.footer__social a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: var(--radius);
  background: rgba(255,255,255,0.06);
  color: rgba(255,255,255,0.6);
  transition: all var(--transition);
}
.footer__social a:hover {
  background: var(--color-primary);
  color: var(--color-white);
}
.footer__bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 24px 0;
  flex-wrap: wrap;
  gap: 12px;
}
.footer__copy {
  font-size: 13px;
  color: rgba(255,255,255,0.4);
}
.footer__tagline {
  font-size: 13px;
  color: rgba(255,255,255,0.3);
}
.footer__legal {
  display: flex;
  gap: 20px;
}
.footer__legal a {
  font-size: 13px;
  color: rgba(255,255,255,0.4);
  transition: color var(--transition);
}
.footer__legal a:hover { color: var(--color-white); }

/* ============================
   FLOATING TOOLS
   ============================ */
.floating {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 80;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.floating__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  color: var(--color-white);
  box-shadow: 0 4px 16px rgba(0,0,0,0.15);
  transition: all var(--transition);
}
.floating__btn:hover { transform: scale(1.1); }
.floating__btn--whatsapp { background: #25D366; }
.floating__btn--email { background: var(--color-dark); }
.floating__btn--quote { background: var(--color-primary); }
.floating__btn--top { background: var(--color-dark-secondary); }

/* Mobile Bar */
.mobile-bar {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 80;
  background: var(--color-white);
  box-shadow: 0 -2px 12px rgba(0,0,0,0.1);
  padding: 8px 16px;
  padding-bottom: max(8px, env(safe-area-inset-bottom));
}
.mobile-bar__btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  font-size: 11px;
  font-weight: 500;
  color: var(--color-text-secondary);
  padding: 6px;
}
.mobile-bar__btn svg { color: var(--color-text); }
.mobile-bar__btn--quote svg { color: var(--color-primary); }
.mobile-bar__btn--quote span { color: var(--color-primary); font-weight: 600; }

/* ============================
   MODAL
   ============================ */
.modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}
.modal[hidden] { display: none; }
.modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.8);
}
.modal__content {
  position: relative;
  max-width: 900px;
  width: 100%;
  background: #000;
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.modal__close {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0.5);
  color: var(--color-white);
  border-radius: 50%;
  transition: background var(--transition);
}
.modal__close:hover { background: var(--color-primary); }
.modal__video video {
  width: 100%;
  aspect-ratio: 16/9;
  display: block;
}
.modal__fallback {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 80px 40px;
  text-align: center;
  color: rgba(255,255,255,0.6);
  gap: 16px;
}
.modal__fallback p { font-size: 15px; }

/* ============================
   SCROLL ANIMATIONS
   ============================ */
.fade-in {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 600ms ease, transform 600ms ease;
}
.fade-in.visible {
  opacity: 1;
  transform: translateY(0);
}

/* ============================
   REDUCED MOTION
   ============================ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  html { scroll-behavior: auto; }
  .hero__bg-img { animation: none; }
  .oem__point-dot { animation: none; }
}

/* Keep the full desktop navigation from colliding with header actions. */
@media (max-width: 1365px) {
  .nav { display: none; }
  .header__hamburger { display: flex; }
  .header__action-btn--lang { display: none; }
}

.yf-form-status {
  width: 100%;
  margin-top: 12px;
  padding: 12px 14px;
  border: 1px solid #c8102e;
  background: #fff4f5;
  color: #9f0c25;
  font-size: 14px;
  line-height: 1.5;
}

.yf-form-status[hidden] { display: none; }

/* ============================
   RESPONSIVE: TABLET
   ============================ */
@media (max-width: 1199px) {
  :root { --gutter: 28px; }
  .hero { height: 680px; }
  .hero__title { font-size: 52px; }
  .nav__link { padding: 8px 10px; font-size: 13px; }
  .categories__grid { grid-template-columns: repeat(2, 1fr); }
  .product-grid { grid-template-columns: repeat(2, 1fr); }
  .product-grid--featured { grid-template-columns: repeat(2, 1fr); }
  .hp-panel__grid { grid-template-columns: repeat(2, 1fr); }
  .manufacturing__inner { gap: 48px; }
  .quality__timeline { grid-template-columns: repeat(4, 1fr); }
  .quality__step:nth-child(4)::after { display: none; }
  .applications__grid { grid-template-columns: repeat(2, 1fr); }
  .service__phases { grid-template-columns: repeat(2, 1fr); }
  .gallery__grid { grid-template-columns: repeat(3, 1fr); }
  .dealer__benefits { grid-template-columns: repeat(2, 1fr); }
  .footer__top { grid-template-columns: repeat(3, 1fr); }
  .footer__col--brand { grid-column: 1 / -1; }
  .mega-menu { min-width: 480px; }
}

/* ============================
   RESPONSIVE: SMALL TABLET
   ============================ */
@media (max-width: 991px) {
  .nav { display: none; }
  .header__hamburger { display: flex; }
  .header__action-btn--lang { display: none; }
  .hero { height: 620px; }
  .hero__title { font-size: 46px; }
  .hero__desc { font-size: 16px; }
  .section { padding: 80px 0; }
  .section-header__title { font-size: 38px; }
  .manufacturing__inner {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .parts__inner {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .oem__inner {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .cta__inner {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .quality__timeline { grid-template-columns: repeat(4, 1fr); }
  .videos__grid { grid-template-columns: repeat(2, 1fr); }
  .news__grid { grid-template-columns: repeat(2, 1fr); }
  .hp-selector__header {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  .stats__inner { flex-wrap: wrap; }
  .stats__item { flex: 0 0 calc(50% - 1px); }
  .stats__divider { display: none; }
  .floating { display: none; }
  .mobile-bar { display: flex; justify-content: space-around; }
  body { padding-bottom: 60px; }
}

/* ============================
   RESPONSIVE: MOBILE
   ============================ */
@media (max-width: 767px) {
  :root { --gutter: 18px; }
  .top-bar__text { display: none; }
  .top-bar__link-text { display: none; }
  .header { height: 64px; }
  .header.scrolled { height: 56px; }
  .logo-text__main { font-size: 18px; }
  .logo-text__sub { font-size: 11px; }
  .logo-text__tagline { display: none; }
  .header__quote-btn { display: none; }
  .hero { height: 560px; }
  .hero__title { font-size: 38px; }
  .hero__desc { font-size: 15px; margin-bottom: 24px; }
  .hero__buttons { flex-direction: column; gap: 12px; }
  .hero__buttons .btn { width: 100%; }
  .hero__tags { flex-direction: column; gap: 12px; }
  .hero__arrow { display: none; }
  .section { padding: 60px 0; }
  .section-header { margin-bottom: 36px; }
  .section-header__title { font-size: 32px; }
  .categories__grid { grid-template-columns: 1fr; }
  .product-grid { grid-template-columns: 1fr; }
  .product-grid--featured { grid-template-columns: 1fr; }
  .hp-tabs { gap: 4px; }
  .hp-tabs__btn { padding: 12px 14px; }
  .hp-tabs__hp { font-size: 16px; }
  .hp-tabs__label { font-size: 11px; }
  .hp-panel__grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .quality__timeline {
    grid-template-columns: 1fr;
    gap: 0;
  }
  .quality__step {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    text-align: left;
    padding: 20px 0;
    border-bottom: 1px solid var(--color-border);
  }
  .quality__step::after { display: none; }
  .quality__step-icon { margin: 0; }
  .applications__grid { grid-template-columns: 1fr; }
  .oem__options { grid-template-columns: 1fr; }
  .dealer__benefits { grid-template-columns: 1fr; }
  .dealer__actions { flex-direction: column; }
  .dealer__actions .btn { width: 100%; }
  .service__phases { grid-template-columns: 1fr; }
  .gallery__grid { grid-template-columns: repeat(2, 1fr); }
  .videos__grid { grid-template-columns: 1fr; }
  .news__grid { grid-template-columns: 1fr; }
  .news__header {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  .cta__form-grid { grid-template-columns: 1fr; }
  .cta__form { padding: 24px; }
  .footer__top {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .footer__bottom {
    flex-direction: column;
    text-align: center;
  }
  .mobile-menu__panel { width: 300px; }
  .stats__number { font-size: 32px; }
  .stats__plus, .stats__comma { font-size: 32px; }
  .stats__unit { font-size: 22px; }
}

/* ============================
   RESPONSIVE: SMALL MOBILE
   ============================ */
@media (max-width: 479px) {
  .hero { height: 520px; }
  .hero__title { font-size: 32px; }
  .hero__content { padding-top: 20px; }
  .section-header__title { font-size: 28px; }
  .gallery__grid { grid-template-columns: 1fr; }
  .parts__grid { grid-template-columns: 1fr; }
  .featured__tabs { gap: 4px; }
  .featured__tab { padding: 8px 14px; font-size: 13px; }
  .hp-selector__header { flex-direction: column; align-items: flex-start; gap: 16px; }
  .hp-tabs { flex-wrap: wrap; }
  .hp-tabs__btn { flex: 1 1 calc(50% - 4px); }
  .hp-panel__grid { grid-template-columns: 1fr; }
}

/* ============================================
   ABOUT PAGE STYLES
   ============================================ */

/* --- About Hero --- */
.about-hero {
  position: relative;
  height: 560px;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
}
.about-hero__bg {
  position: absolute;
  inset: 0;
}
.about-hero__bg-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.about-hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(17,24,32,0.55) 0%, rgba(17,24,32,0.8) 100%);
}
.about-hero__content {
  position: relative;
  z-index: 2;
  padding-bottom: 60px;
}
.about-hero__breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: rgba(255,255,255,0.6);
  margin-bottom: 20px;
}
.about-hero__breadcrumb a {
  color: rgba(255,255,255,0.6);
  transition: color var(--transition);
}
.about-hero__breadcrumb a:hover { color: var(--color-white); }
.about-hero__breadcrumb span:last-child { color: var(--color-white); }
.about-hero__eyebrow {
  display: block;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 2px;
  color: var(--color-primary-light);
  margin-bottom: 16px;
}
.about-hero__title {
  font-family: var(--font-heading);
  font-size: 56px;
  font-weight: 800;
  color: var(--color-white);
  line-height: 1.1;
  margin-bottom: 20px;
  letter-spacing: -0.5px;
}
.about-hero__desc {
  font-size: 17px;
  color: rgba(255,255,255,0.8);
  line-height: 1.7;
  max-width: 640px;
  margin-bottom: 32px;
}
.about-hero__buttons {
  display: flex;
  gap: 16px;
  margin-bottom: 32px;
}
.about-hero__tags {
  display: flex;
  gap: 12px;
}
.about-hero__tag {
  display: inline-block;
  padding: 6px 16px;
  background: rgba(255,255,255,0.1);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: var(--radius);
  font-size: 13px;
  font-weight: 500;
  color: rgba(255,255,255,0.8);
  backdrop-filter: blur(4px);
}

/* --- Company Introduction --- */
.about-intro__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: center;
}
.section-header__title--left { text-align: left; }
.about-intro__content p {
  font-size: 16px;
  color: var(--color-text-secondary);
  line-height: 1.7;
  margin-bottom: 16px;
}
.about-intro__quote {
  border-left: 4px solid var(--color-primary);
  padding: 16px 24px;
  margin: 24px 0 28px;
  background: var(--color-light);
  border-radius: 0 var(--radius) var(--radius) 0;
}
.about-intro__quote p {
  font-size: 16px;
  font-weight: 600;
  color: var(--color-text);
  font-style: italic;
  margin: 0;
}
.about-intro__images {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.about-intro__img-main {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.about-intro__img-main img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  min-height: 300px;
}
.about-intro__img-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.about-intro__img-small {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.about-intro__img-small img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  min-height: 160px;
}
.about-intro__img-label {
  position: absolute;
  bottom: 12px;
  left: 12px;
  padding: 4px 12px;
  background: rgba(0,0,0,0.6);
  border-radius: var(--radius);
  font-size: 12px;
  font-weight: 600;
  color: var(--color-white);
  backdrop-filter: blur(4px);
}

/* --- Brand Direction --- */
.about-direction__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  margin-bottom: 48px;
}
.about-direction__card {
  padding: 32px;
  background: var(--color-white);
  border-radius: var(--radius-lg);
  border: 1px solid var(--color-border);
  transition: all var(--transition);
}
.about-direction__card:hover {
  box-shadow: 0 8px 28px rgba(0,0,0,0.06);
  border-color: var(--color-primary);
}
.about-direction__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: var(--radius);
  background: var(--color-light);
  color: var(--color-primary);
  margin-bottom: 20px;
}
.about-direction__title {
  font-family: var(--font-body);
  font-size: 20px;
  font-weight: 600;
  color: var(--color-text);
  margin-bottom: 12px;
}
.about-direction__desc {
  font-size: 15px;
  color: var(--color-text-secondary);
  line-height: 1.7;
}
.about-direction__timeline {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}
.about-direction__step {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 20px;
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
}
.about-direction__step-icon {
  color: var(--color-primary);
  display: flex;
}
.about-direction__step-text {
  font-size: 14px;
  font-weight: 600;
  color: var(--color-text);
  white-space: nowrap;
}
.about-direction__arrow {
  color: var(--color-primary);
  display: flex;
}
.about-direction__note {
  text-align: center;
  font-size: 16px;
  color: var(--color-text-secondary);
  margin-bottom: 20px;
}
.about-direction__action { text-align: center; }

/* --- Why YUFENG --- */
.about-why__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.about-why__card {
  padding: 28px 24px;
  background: var(--color-light);
  border-radius: var(--radius-lg);
  border-top: 3px solid transparent;
  transition: all var(--transition);
}
.about-why__card:hover {
  border-top-color: var(--color-primary);
  background: var(--color-white);
  box-shadow: 0 8px 28px rgba(0,0,0,0.06);
  transform: translateY(-4px);
}
.about-why__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: var(--radius);
  background: var(--color-white);
  color: var(--color-primary);
  margin-bottom: 16px;
  border: 1px solid var(--color-border);
}
.about-why__card:hover .about-why__icon {
  background: var(--color-primary);
  color: var(--color-white);
  border-color: var(--color-primary);
}
.about-why__title {
  font-family: var(--font-body);
  font-size: 17px;
  font-weight: 600;
  color: var(--color-text);
  margin-bottom: 10px;
}
.about-why__desc {
  font-size: 14px;
  color: var(--color-text-secondary);
  line-height: 1.6;
}

/* --- Manufacturing --- */
.about-mfg {
  background: var(--color-dark);
}
.about-mfg__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-bottom: 36px;
}
.about-mfg__card {
  padding: 24px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: var(--radius-lg);
  transition: all var(--transition);
}
.about-mfg__card:hover {
  background: rgba(255,255,255,0.08);
  border-color: var(--color-primary);
}
.about-mfg__num {
  font-family: var(--font-heading);
  font-size: 13px;
  font-weight: 700;
  color: var(--color-primary);
  margin-bottom: 12px;
  letter-spacing: 1px;
}
.about-mfg__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: var(--radius);
  background: rgba(255,255,255,0.06);
  color: var(--color-primary);
  margin-bottom: 14px;
}
.about-mfg__title {
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 600;
  color: var(--color-white);
  margin-bottom: 8px;
}
.about-mfg__desc {
  font-size: 14px;
  color: rgba(255,255,255,0.6);
  line-height: 1.6;
}
.about-mfg__actions {
  display: flex;
  gap: 16px;
  justify-content: center;
}

/* --- Production Process --- */
.about-process__timeline {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: 12px;
}
.about-process__step {
  text-align: center;
  padding: 20px 8px;
  position: relative;
}
.about-process__step::after {
  content: '';
  position: absolute;
  top: 48px;
  right: -6px;
  width: 12px;
  height: 2px;
  background: var(--color-border);
}
.about-process__step:last-child::after { display: none; }
.about-process__num {
  display: block;
  font-family: var(--font-heading);
  font-size: 13px;
  font-weight: 700;
  color: var(--color-primary);
  margin-bottom: 10px;
}
.about-process__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--color-light);
  color: var(--color-primary);
  margin: 0 auto 10px;
  border: 2px solid var(--color-border);
}
.about-process__title {
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 600;
  color: var(--color-text);
  margin-bottom: 6px;
}
.about-process__desc {
  font-size: 12px;
  color: var(--color-text-secondary);
  line-height: 1.5;
}

/* --- Quality Control --- */
.about-quality__inner {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 64px;
  align-items: center;
}
.about-quality__image {
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.about-quality__image img {
  width: 100%;
  object-fit: cover;
}
.about-quality__text {
  font-size: 16px;
  color: var(--color-text-secondary);
  line-height: 1.7;
  margin-bottom: 24px;
}
.about-quality__list {
  margin-bottom: 24px;
}
.about-quality__list li {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid var(--color-border);
  font-size: 15px;
  font-weight: 500;
  color: var(--color-text);
}
.about-quality__list li svg {
  color: var(--color-primary);
  flex-shrink: 0;
}
.about-quality__promise {
  padding: 16px 20px;
  background: var(--color-light);
  border-left: 4px solid var(--color-primary);
  border-radius: 0 var(--radius) var(--radius) 0;
  margin-bottom: 24px;
}
.about-quality__promise p {
  font-size: 15px;
  font-weight: 500;
  color: var(--color-text);
  margin: 0;
}

/* --- Parts Capability --- */
.about-parts__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  margin-bottom: 36px;
}
.about-parts__subtitle {
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 600;
  color: var(--color-text);
  margin-bottom: 16px;
}
.about-parts__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.about-parts__tags span {
  display: inline-block;
  padding: 8px 16px;
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  font-size: 13px;
  font-weight: 500;
  color: var(--color-text-secondary);
  transition: all var(--transition);
}
.about-parts__tags span:hover {
  border-color: var(--color-primary);
  color: var(--color-primary);
}
.about-parts__inquiry {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 28px 32px;
  background: var(--color-white);
  border-radius: var(--radius-lg);
  border: 1px solid var(--color-border);
  border-left: 4px solid var(--color-primary);
}
.about-parts__inquiry h3 {
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 600;
  color: var(--color-text);
  margin-bottom: 4px;
}
.about-parts__inquiry p {
  font-size: 14px;
  color: var(--color-text-secondary);
}
.about-parts__inquiry-actions {
  display: flex;
  gap: 12px;
}

/* --- OEM --- */
.about-oem {
  background: var(--color-dark);
}
.about-oem__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: center;
}
.about-oem__visual {
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.about-oem__visual img {
  width: 100%;
  object-fit: cover;
}
.about-oem__content .section-header__title {
  color: var(--color-white);
}
.about-oem__text {
  font-size: 16px;
  color: rgba(255,255,255,0.7);
  line-height: 1.7;
  margin-bottom: 28px;
}
.about-oem__options {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 28px;
}
.about-oem__option {
  padding: 8px 14px;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: var(--radius);
  font-size: 13px;
  font-weight: 500;
  color: rgba(255,255,255,0.8);
}
.about-oem__actions {
  display: flex;
  gap: 12px;
}

/* --- Service --- */
.about-service__phases {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  margin-bottom: 32px;
}
.about-service__phase {
  padding: 24px;
  background: var(--color-light);
  border-radius: var(--radius-lg);
  border-top: 3px solid var(--color-primary);
  transition: all var(--transition);
}
.about-service__phase:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.06);
}
.about-service__num {
  font-family: var(--font-heading);
  font-size: 28px;
  font-weight: 800;
  color: var(--color-primary);
  opacity: 0.3;
  display: block;
  margin-bottom: 10px;
}
.about-service__title {
  font-family: var(--font-body);
  font-size: 17px;
  font-weight: 600;
  color: var(--color-text);
  margin-bottom: 8px;
}
.about-service__desc {
  font-size: 14px;
  color: var(--color-text-secondary);
  line-height: 1.6;
}
.about-service__capabilities {
  display: flex;
  gap: 16px;
  justify-content: center;
  margin-bottom: 28px;
  flex-wrap: wrap;
}
.about-service__cap {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 20px;
  background: var(--color-light);
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  font-size: 14px;
  font-weight: 500;
  color: var(--color-text-secondary);
}
.about-service__cap svg { color: var(--color-primary); }
.about-service__action { text-align: center; }

/* --- Gallery --- */
.about-gallery__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: 24px;
}
.about-gallery__item {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  aspect-ratio: 4/3;
}
.about-gallery__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--transition);
}
.about-gallery__item:hover img {
  transform: scale(1.05);
}
.about-gallery__info {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 10px 14px;
  background: linear-gradient(transparent, rgba(0,0,0,0.65));
}
.about-gallery__info span {
  font-size: 13px;
  font-weight: 500;
  color: var(--color-white);
}
.about-gallery__note {
  text-align: center;
  font-size: 16px;
  color: var(--color-text-secondary);
}

/* --- Values --- */
.about-values {
  background: var(--color-dark);
}
.about-values__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  margin-bottom: 32px;
}
.about-values__card {
  padding: 28px 24px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: var(--radius-lg);
  text-align: center;
  transition: all var(--transition);
}
.about-values__card:hover {
  background: rgba(255,255,255,0.08);
  border-color: var(--color-primary);
}
.about-values__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: rgba(255,255,255,0.06);
  color: var(--color-primary);
  margin: 0 auto 16px;
}
.about-values__title {
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 600;
  color: var(--color-white);
  margin-bottom: 10px;
}
.about-values__desc {
  font-size: 14px;
  color: rgba(255,255,255,0.6);
  line-height: 1.6;
}
.about-values__motto {
  text-align: center;
  font-size: 18px;
  font-weight: 600;
  color: var(--color-white);
  font-style: italic;
  padding: 24px;
  border-top: 1px solid rgba(255,255,255,0.1);
}

/* --- Factory Gallery --- */
.about-factory__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: 32px;
}
.about-factory__item {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  aspect-ratio: 4/3;
  cursor: pointer;
}
.about-factory__item--wide {
  grid-column: span 2;
  aspect-ratio: 16/9;
}
.about-factory__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--transition);
}
.about-factory__item:hover img {
  transform: scale(1.05);
}
.about-factory__info {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 10px 14px;
  background: linear-gradient(transparent, rgba(0,0,0,0.6));
}
.about-factory__info span {
  font-size: 13px;
  font-weight: 500;
  color: var(--color-white);
}
.about-factory__action { text-align: center; }

/* --- Videos --- */
.about-videos__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-bottom: 28px;
}
.about-videos__action { text-align: center; }

/* --- Partner CTA --- */
.about-partner {
  position: relative;
  overflow: hidden;
  padding: 100px 0;
}
.about-partner__bg {
  position: absolute;
  inset: 0;
}
.about-partner__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.about-partner__overlay {
  position: absolute;
  inset: 0;
  background: rgba(17,24,32,0.82);
}
.about-partner__content {
  position: relative;
  z-index: 2;
  text-align: center;
  max-width: 800px;
  margin: 0 auto;
}
.about-partner__text {
  font-size: 17px;
  color: rgba(255,255,255,0.75);
  line-height: 1.7;
  margin-bottom: 28px;
}
.about-partner__benefits {
  display: flex;
  gap: 16px;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 32px;
}
.about-partner__benefit {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: var(--radius);
  font-size: 14px;
  font-weight: 500;
  color: rgba(255,255,255,0.85);
}
.about-partner__benefit svg { color: var(--color-primary); }
.about-partner__actions {
  display: flex;
  gap: 16px;
  justify-content: center;
}

/* --- About FAQ --- */
.about-faq .faq__list { max-width: 800px; margin: 0 auto 32px; }

/* --- About CTA Form --- */
.about-cta {
  position: relative;
  overflow: hidden;
  padding: 100px 0;
}
.about-cta__bg {
  position: absolute;
  inset: 0;
}
.about-cta__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.about-cta__overlay {
  position: absolute;
  inset: 0;
  background: rgba(17,24,32,0.85);
}
.about-cta__inner {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 64px;
  align-items: flex-start;
}
.about-cta__content { padding-top: 20px; }
.about-cta__text {
  font-size: 17px;
  color: rgba(255,255,255,0.75);
  line-height: 1.7;
  margin-bottom: 28px;
}
.about-cta__tags {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.about-cta__tag {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 18px;
  background: rgba(255,255,255,0.06);
  border-radius: var(--radius);
  font-size: 14px;
  font-weight: 500;
  color: rgba(255,255,255,0.85);
  border: 1px solid rgba(255,255,255,0.1);
}
.about-cta__tag::before {
  content: '';
  width: 8px;
  height: 8px;
  background: var(--color-primary);
  border-radius: 50%;
  flex-shrink: 0;
}
.about-cta__form {
  background: var(--color-white);
  padding: 36px;
  border-radius: var(--radius-lg);
}
.about-cta__form-title {
  font-family: var(--font-heading);
  font-size: 26px;
  font-weight: 700;
  color: var(--color-text);
  margin-bottom: 24px;
}
.about-cta__honeypot {
  position: absolute;
  left: -9999px;
  opacity: 0;
  height: 0;
}
.about-cta__form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: 16px;
}
.about-cta__field {
  display: flex;
  flex-direction: column;
}
.about-cta__field label {
  font-size: 13px;
  font-weight: 500;
  color: var(--color-text);
  margin-bottom: 6px;
}
.about-cta__field input,
.about-cta__field select,
.about-cta__field textarea {
  padding: 12px 14px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  font-family: var(--font-body);
  font-size: 14px;
  color: var(--color-text);
  transition: border-color var(--transition);
  background: var(--color-white);
}
.about-cta__field input:focus,
.about-cta__field select:focus,
.about-cta__field textarea:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(200,16,46,0.1);
}
.about-cta__field input.error,
.about-cta__field select.error {
  border-color: var(--color-primary);
}
.about-cta__error {
  font-size: 12px;
  color: var(--color-primary);
  margin-top: 4px;
  min-height: 16px;
}
.about-cta__field--full {
  grid-column: 1 / -1;
  margin-bottom: 16px;
}
.about-cta__checkbox {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  cursor: pointer;
  font-size: 13px;
  color: var(--color-text-secondary);
  line-height: 1.5;
}
.about-cta__checkbox input {
  margin-top: 3px;
  width: 16px;
  height: 16px;
  accent-color: var(--color-primary);
}
.about-cta__submit { width: 100%; }
.about-cta__success {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 20px;
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  border-radius: var(--radius);
  margin-top: 16px;
}
.about-cta__success svg { color: var(--color-success); flex-shrink: 0; }
.about-cta__success p {
  font-size: 14px;
  color: #166534;
  font-weight: 500;
}

/* --- Lightbox --- */
.lightbox {
  position: fixed;
  inset: 0;
  z-index: 1001;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}
.lightbox[hidden] { display: none; }
.lightbox__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.9);
}
.lightbox__content {
  position: relative;
  max-width: 1000px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.lightbox__close {
  position: absolute;
  top: -48px;
  right: 0;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-white);
  background: rgba(255,255,255,0.1);
  border-radius: 50%;
  transition: background var(--transition);
  z-index: 2;
}
.lightbox__close:hover { background: var(--color-primary); }
.lightbox__prev,
.lightbox__next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-white);
  background: rgba(255,255,255,0.1);
  border-radius: 50%;
  transition: background var(--transition);
  z-index: 2;
}
.lightbox__prev { left: -60px; }
.lightbox__next { right: -60px; }
.lightbox__prev:hover,
.lightbox__next:hover { background: var(--color-primary); }
.lightbox__img-wrap {
  text-align: center;
}
.lightbox__img {
  max-width: 100%;
  max-height: 80vh;
  object-fit: cover;
  border-radius: var(--radius);
}
.lightbox__title {
  color: var(--color-white);
  font-size: 14px;
  margin-top: 12px;
  font-weight: 500;
}

/* ============================
   ABOUT RESPONSIVE: TABLET
   ============================ */
@media (max-width: 1199px) {
  .about-hero { height: 480px; }
  .about-hero__title { font-size: 46px; }
  .about-intro__inner { gap: 40px; }
  .about-direction__grid { grid-template-columns: 1fr; }
  .about-why__grid { grid-template-columns: repeat(2, 1fr); }
  .about-mfg__grid { grid-template-columns: repeat(2, 1fr); }
  .about-process__timeline { grid-template-columns: repeat(4, 1fr); }
  .about-process__step:nth-child(4)::after { display: none; }
  .about-quality__inner { gap: 40px; }
  .about-parts__grid { grid-template-columns: 1fr; }
  .about-oem__inner { gap: 40px; }
  .about-service__phases { grid-template-columns: repeat(2, 1fr); }
  .about-gallery__grid { grid-template-columns: repeat(3, 1fr); }
  .about-values__grid { grid-template-columns: repeat(2, 1fr); }
  .about-factory__grid { grid-template-columns: repeat(3, 1fr); }
  .about-factory__item--wide { grid-column: span 1; aspect-ratio: 4/3; }
  .about-videos__grid { grid-template-columns: repeat(2, 1fr); }
  .about-cta__inner { gap: 40px; }
  .lightbox__prev { left: 10px; }
  .lightbox__next { right: 10px; }
}

/* ============================
   ABOUT RESPONSIVE: SMALL TABLET
   ============================ */
@media (max-width: 991px) {
  .about-hero { height: 440px; }
  .about-hero__title { font-size: 40px; }
  .about-intro__inner {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .about-quality__inner {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .about-oem__inner {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .about-cta__inner {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .about-parts__inquiry {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  .about-parts__inquiry-actions { width: 100%; }
}

/* ============================
   ABOUT RESPONSIVE: MOBILE
   ============================ */
@media (max-width: 767px) {
  .about-hero { height: 420px; }
  .about-hero__title { font-size: 34px; }
  .about-hero__desc { font-size: 15px; }
  .about-hero__buttons { flex-direction: column; gap: 12px; }
  .about-hero__buttons .btn { width: 100%; }
  .about-hero__tags { flex-wrap: wrap; gap: 8px; }
  .about-intro__img-row { grid-template-columns: 1fr; }
  .about-direction__timeline { flex-direction: column; gap: 8px; }
  .about-direction__arrow { transform: rotate(90deg); }
  .about-why__grid { grid-template-columns: 1fr; }
  .about-mfg__grid { grid-template-columns: 1fr; }
  .about-mfg__actions { flex-direction: column; }
  .about-mfg__actions .btn { width: 100%; }
  .about-process__timeline { grid-template-columns: 1fr; gap: 0; }
  .about-process__step {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    text-align: left;
    padding: 18px 0;
    border-bottom: 1px solid var(--color-border);
  }
  .about-process__step::after { display: none; }
  .about-process__icon { margin: 0; }
  .about-gallery__grid { grid-template-columns: repeat(2, 1fr); }
  .about-values__grid { grid-template-columns: 1fr; }
  .about-factory__grid { grid-template-columns: repeat(2, 1fr); }
  .about-factory__item--wide { grid-column: span 1; }
  .about-videos__grid { grid-template-columns: 1fr; }
  .about-partner__benefits { flex-direction: column; align-items: center; }
  .about-partner__actions { flex-direction: column; }
  .about-partner__actions .btn { width: 100%; }
  .about-cta__form-grid { grid-template-columns: 1fr; }
  .about-cta__form { padding: 24px; }
  .about-service__phases { grid-template-columns: 1fr; }
  .about-service__capabilities { flex-direction: column; align-items: center; }
  .lightbox__prev { left: 4px; }
  .lightbox__next { right: 4px; }
  .lightbox__prev, .lightbox__next {
    width: 36px;
    height: 36px;
  }
}

/* ============================
   ABOUT RESPONSIVE: SMALL MOBILE
   ============================ */
@media (max-width: 479px) {
  .about-hero { height: 400px; }
  .about-hero__title { font-size: 28px; }
  .about-gallery__grid { grid-template-columns: 1fr; }
  .about-factory__grid { grid-template-columns: 1fr; }
  .lightbox__prev,
  .lightbox__next { display: none; }
}

/* ============================================
   TRACTORS PAGE STYLES
   ============================================ */

/* --- Tractors Hero --- */
.tractors-hero {
  position: relative;
  height: 540px;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
}
.tractors-hero__bg {
  position: absolute;
  inset: 0;
}
.tractors-hero__bg-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center bottom;
}
.tractors-hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(17,24,32,0.85) 0%, rgba(17,24,32,0.6) 45%, rgba(17,24,32,0.15) 100%);
}
.tractors-hero__content {
  position: relative;
  z-index: 2;
  padding-bottom: 56px;
  max-width: 700px;
}
.tractors-hero__breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: rgba(255,255,255,0.6);
  margin-bottom: 16px;
}
.tractors-hero__breadcrumb a { color: rgba(255,255,255,0.6); }
.tractors-hero__breadcrumb a:hover { color: var(--color-white); }
.tractors-hero__breadcrumb span:last-child { color: var(--color-white); }
.tractors-hero__eyebrow {
  display: block;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 2px;
  color: var(--color-primary-light);
  margin-bottom: 14px;
}
.tractors-hero__title {
  font-family: var(--font-heading);
  font-size: 54px;
  font-weight: 800;
  color: var(--color-white);
  line-height: 1.08;
  margin-bottom: 18px;
  letter-spacing: -0.5px;
}
.tractors-hero__desc {
  font-size: 17px;
  color: rgba(255,255,255,0.8);
  line-height: 1.7;
  margin-bottom: 28px;
}
.tractors-hero__buttons {
  display: flex;
  gap: 16px;
  margin-bottom: 28px;
}
.tractors-hero__tags {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.tractors-hero__tag {
  display: inline-block;
  padding: 6px 14px;
  background: rgba(255,255,255,0.1);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: var(--radius);
  font-size: 13px;
  font-weight: 500;
  color: rgba(255,255,255,0.8);
  backdrop-filter: blur(4px);
}

/* --- Category Cards --- */
.tractor-cats__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.tractor-cat-card {
  display: block;
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: all var(--transition);
  cursor: pointer;
}
.tractor-cat-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.06);
  border-color: var(--color-primary);
}
.tractor-cat-card__img {
  aspect-ratio: 3 / 2;
  background: var(--color-light);
  overflow: hidden;
}
.tractor-cat-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--transition);
}
.tractor-cat-card:hover .tractor-cat-card__img img { transform: scale(1.03); }
.tractor-cat-card__body {
  padding: 16px 18px;
  position: relative;
}
.tractor-cat-card__body::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 18px;
  right: 18px;
  height: 3px;
  background: var(--color-primary);
  transform: scaleX(0);
  transition: transform var(--transition);
}
.tractor-cat-card:hover .tractor-cat-card__body::after { transform: scaleX(1); }
.tractor-cat-card__name {
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 600;
  color: var(--color-text);
  margin-bottom: 6px;
}
.tractor-cat-card__desc {
  font-size: 13px;
  color: var(--color-text-secondary);
  line-height: 1.5;
  margin-bottom: 10px;
}
.tractor-cat-card__meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 12px;
  color: var(--color-metal);
}
.tractor-cat-card__hp {
  font-weight: 600;
  color: var(--color-primary);
}
.tractor-cat-card__arrow {
  color: var(--color-primary);
  transition: transform var(--transition);
}
.tractor-cat-card:hover .tractor-cat-card__arrow { transform: translateX(4px); }

/* --- Selection Guide --- */
.tractor-guide__wizard { max-width: 100%; }
.tractor-guide__progress { margin-bottom: 28px; }
.tractor-guide__progress-bar { height: 4px; background: var(--color-border); border-radius: 2px; margin-bottom: 12px; overflow: hidden; }
.tractor-guide__progress-fill { height: 100%; background: var(--color-primary); border-radius: 2px; width: 25%; transition: width 0.4s ease; }
.tractor-guide__progress-steps { display: flex; justify-content: space-between; }
.tractor-guide__progress-step { display: flex; flex-direction: column; align-items: center; gap: 4px; background: none; border: none; cursor: pointer; padding: 0; }
.tractor-guide__progress-step span { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%; background: var(--color-border); color: var(--color-metal); font-size: 13px; font-weight: 600; transition: all var(--transition); }
.tractor-guide__progress-step small { font-size: 11px; color: var(--color-metal); font-weight: 500; }
.tractor-guide__progress-step--active span { background: var(--color-primary); color: var(--color-white); }
.tractor-guide__progress-step--active small { color: var(--color-primary); }
.tractor-guide__progress-step--done span { background: var(--color-success, #2F7D4A); color: var(--color-white); }
.tractor-guide__panel { background: var(--color-white); padding: 28px; border-radius: var(--radius-lg); border: 1px solid var(--color-border); }
.tractor-guide__question {
  font-family: var(--font-heading);
  font-size: 22px;
  font-weight: 700;
  color: var(--color-text);
  margin-bottom: 6px;
  text-align: center;
}
.tractor-guide__hint { text-align: center; font-size: 14px; color: var(--color-text-secondary); margin-bottom: 24px; }
.tractor-guide__cards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 24px;
}
.tractor-guide__cards--hp { grid-template-columns: repeat(4, 1fr); }
.tractor-guide__cards--drive { grid-template-columns: repeat(3, 1fr); }
.tractor-guide__cards--config { grid-template-columns: repeat(3, 1fr); }
.tractor-guide__card { cursor: pointer; }
.tractor-guide__card input { display: none; }
.tractor-guide__card-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 20px 12px;
  border: 2px solid var(--color-border);
  border-radius: var(--radius-lg);
  transition: all var(--transition);
  gap: 6px;
}
.tractor-guide__card-inner svg { color: var(--color-metal); transition: color var(--transition); }
.tractor-guide__card-inner strong { font-size: 13px; font-weight: 600; color: var(--color-text); }
.tractor-guide__card-inner span { font-size: 11px; color: var(--color-text-secondary); line-height: 1.3; }
.tractor-guide__hp-num { font-family: var(--font-heading); font-size: 28px; font-weight: 800; color: var(--color-primary); line-height: 1; }
.tractor-guide__card:hover .tractor-guide__card-inner { border-color: var(--color-primary); }
.tractor-guide__card:hover .tractor-guide__card-inner svg { color: var(--color-primary); }
.tractor-guide__card input:checked + .tractor-guide__card-inner {
  border-color: var(--color-primary);
  background: rgba(200,16,46,0.04);
  box-shadow: 0 4px 16px rgba(200,16,46,0.12);
}
.tractor-guide__card input:checked + .tractor-guide__card-inner svg { color: var(--color-primary); }
.tractor-guide__card input:checked + .tractor-guide__card-inner strong { color: var(--color-primary); }
.tractor-guide__nav { display: flex; justify-content: space-between; align-items: center; padding-top: 16px; border-top: 1px solid var(--color-border); }
.tractor-guide__result { background: var(--color-white); padding: 28px; border-radius: var(--radius-lg); border: 2px solid var(--color-success, #2F7D4A); text-align: center; }
.tractor-guide__result-header { display: flex; align-items: center; justify-content: center; gap: 10px; margin-bottom: 16px; }
.tractor-guide__result-header svg { color: var(--color-success, #2F7D4A); }
.tractor-guide__result-header h3 { font-family: var(--font-heading); font-size: 22px; font-weight: 700; color: var(--color-text); }
.tractor-guide__result-summary { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 20px; }
.tractor-guide__result-tag { padding: 8px 16px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-weight: 500; color: var(--color-text); }
.tractor-guide__result-actions { display: flex; gap: 12px; justify-content: center; }

/* --- Filter Sidebar --- */
.tractor-listing__layout {
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 32px;
  align-items: flex-start;
}
.tractor-listing__main {
  min-width: 0;
  overflow: hidden;
}
.tractor-filter {
  position: sticky;
  top: 100px;
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: 20px;
}
.tractor-filter__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--color-border);
}
.tractor-filter__title {
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 600;
  color: var(--color-text);
}
.tractor-filter__clear {
  font-size: 13px;
  font-weight: 500;
  color: var(--color-primary);
  cursor: pointer;
}
.tractor-filter__group {
  margin-bottom: 20px;
}
.tractor-filter__group-title {
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 600;
  color: var(--color-text);
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 10px;
}
.tractor-filter__check {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 0;
  cursor: pointer;
  font-size: 14px;
  color: var(--color-text-secondary);
  transition: color var(--transition);
}
.tractor-filter__check:hover { color: var(--color-text); }
.tractor-filter__check input {
  width: 16px;
  height: 16px;
  accent-color: var(--color-primary);
  cursor: pointer;
}

/* --- Toolbar --- */
.tractor-listing__toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}
.tractor-listing__filter-btn {
  display: none;
  align-items: center;
  gap: 6px;
  padding: 10px 18px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  font-size: 14px;
  font-weight: 500;
  color: var(--color-text);
  background: var(--color-white);
}
.tractor-listing__active-filters {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  flex: 1;
}
.tractor-listing__active-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  background: var(--color-light);
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  font-size: 12px;
  font-weight: 500;
  color: var(--color-text-secondary);
}
.tractor-listing__active-tag button {
  display: flex;
  color: var(--color-metal);
  font-size: 14px;
  line-height: 1;
}
.tractor-listing__active-tag button:hover { color: var(--color-primary); }
.tractor-listing__controls {
  display: flex;
  align-items: center;
  gap: 12px;
}
.tractor-listing__sort select,
.tractor-listing__per-page select {
  padding: 8px 12px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  font-size: 13px;
  font-family: var(--font-body);
  color: var(--color-text);
  background: var(--color-white);
  cursor: pointer;
}
.tractor-listing__view {
  display: flex;
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  overflow: hidden;
}
.tractor-listing__view-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  color: var(--color-metal);
  background: var(--color-white);
  transition: all var(--transition);
}
.tractor-listing__view-btn--active { color: var(--color-primary); background: var(--color-light); }
.tractor-listing__view-btn:hover { color: var(--color-primary); }

/* --- Product Grid --- */
.tractor-listing__count {
  font-size: 14px;
  color: var(--color-text-secondary);
  margin-bottom: 16px;
}
.tractor-listing__results {
  min-width: 0;
}
.tractor-listing__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  min-width: 0;
}
.tractor-listing__grid--list {
  grid-template-columns: 1fr;
  min-width: 0;
}
.tractor-listing__grid--list .tractor-card {
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 20px;
}

/* --- Product Card --- */
.tractor-card {
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: all var(--transition);
  position: relative;
  min-width: 0;
}
.tractor-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 32px rgba(0,0,0,0.08);
  border-bottom-color: var(--color-primary);
}
.tractor-card__img {
  aspect-ratio: 3 / 2;
  background: var(--color-light);
  overflow: hidden;
  position: relative;
}
.tractor-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--transition);
}
.tractor-card:hover .tractor-card__img img { transform: scale(1.03); }
.tractor-card__badges {
  position: absolute;
  top: 10px;
  left: 10px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  z-index: 2;
}
.tractor-card__badge {
  display: inline-block;
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-radius: 4px;
  background: var(--color-primary);
  color: var(--color-white);
}
.tractor-card__badge--secondary {
  background: var(--color-dark);
}
.tractor-card__quickview {
  position: absolute;
  bottom: 10px;
  right: 10px;
  padding: 8px 14px;
  background: rgba(0,0,0,0.6);
  backdrop-filter: blur(6px);
  border-radius: var(--radius);
  color: var(--color-white);
  font-size: 12px;
  font-weight: 600;
  opacity: 0;
  transition: opacity var(--transition);
  z-index: 2;
}
.tractor-card:hover .tractor-card__quickview { opacity: 1; }
.tractor-card__body {
  padding: 18px 20px;
}
.tractor-card__model {
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 700;
  color: var(--color-primary);
  letter-spacing: 1px;
}
.tractor-card__name {
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 600;
  color: var(--color-text);
  margin: 6px 0 12px;
  line-height: 1.3;
}
.tractor-card__specs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  margin-bottom: 14px;
}
.tractor-card__spec {
  font-size: 12px;
  color: var(--color-text-secondary);
}
.tractor-card__spec strong {
  color: var(--color-text);
  font-weight: 500;
}
.tractor-card__actions {
  display: flex;
  gap: 8px;
  align-items: center;
}
.tractor-card__actions .btn { flex: 1; }
.tractor-card__compare-label {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--color-metal);
  cursor: pointer;
  white-space: nowrap;
}
.tractor-card__compare-label input {
  width: 16px;
  height: 16px;
  accent-color: var(--color-primary);
}

/* --- No Results --- */
.tractor-listing__empty {
  text-align: center;
  padding: 60px 20px;
}
.tractor-listing__empty svg { color: var(--color-metal); margin-bottom: 16px; }
.tractor-listing__empty h3 {
  font-family: var(--font-body);
  font-size: 20px;
  font-weight: 600;
  color: var(--color-text);
  margin-bottom: 10px;
}
.tractor-listing__empty p {
  font-size: 15px;
  color: var(--color-text-secondary);
  margin-bottom: 20px;
  max-width: 480px;
  margin-left: auto;
  margin-right: auto;
}
.tractor-listing__empty-actions {
  display: flex;
  gap: 12px;
  justify-content: center;
}

/* --- Pagination --- */
.tractor-listing__pagination {
  display: flex;
  justify-content: center;
  gap: 6px;
  margin-top: 28px;
}
.tractor-listing__pagination button {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  font-size: 14px;
  font-weight: 500;
  color: var(--color-text);
  background: var(--color-white);
  transition: all var(--transition);
}
.tractor-listing__pagination button:hover { border-color: var(--color-primary); color: var(--color-primary); }
.tractor-listing__pagination button.active { background: var(--color-primary); border-color: var(--color-primary); color: var(--color-white); }

/* --- Application Cards --- */
.tractor-apps__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.tractor-apps__card {
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: all var(--transition);
}
.tractor-apps__card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 28px rgba(0,0,0,0.06);
  border-color: var(--color-primary);
}
.tractor-apps__img { height: 180px; overflow: hidden; }
.tractor-apps__img img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--transition); }
.tractor-apps__card:hover .tractor-apps__img img { transform: scale(1.05); }
.tractor-apps__content { padding: 18px; }
.tractor-apps__title {
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 600;
  color: var(--color-text);
  margin-bottom: 6px;
}
.tractor-apps__desc {
  font-size: 14px;
  color: var(--color-text-secondary);
  line-height: 1.5;
  margin-bottom: 10px;
}
.tractor-apps__rec {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: var(--color-primary);
  margin-bottom: 12px;
}

/* --- HP Guide --- */
.tractor-hp__grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 16px;
  margin-bottom: 28px;
}
.tractor-hp__card {
  padding: 20px;
  background: var(--color-light);
  border-radius: var(--radius-lg);
  border-top: 3px solid var(--color-primary);
  transition: all var(--transition);
}
.tractor-hp__card:hover {
  background: var(--color-white);
  box-shadow: 0 4px 16px rgba(0,0,0,0.06);
}
.tractor-hp__range {
  font-family: var(--font-heading);
  font-size: 22px;
  font-weight: 700;
  color: var(--color-primary);
  display: block;
  margin-bottom: 10px;
}
.tractor-hp__suitable {
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 600;
  color: var(--color-text);
  margin-bottom: 8px;
}
.tractor-hp__list { list-style: none; }
.tractor-hp__list li {
  font-size: 13px;
  color: var(--color-text-secondary);
  padding: 4px 0;
  padding-left: 14px;
  position: relative;
}
.tractor-hp__list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  width: 5px;
  height: 5px;
  background: var(--color-primary);
  border-radius: 50%;
  transform: translateY(-50%);
}
.tractor-hp__note {
  text-align: center;
  font-size: 14px;
  color: var(--color-text-secondary);
  margin-bottom: 16px;
}
.tractor-hp__action { text-align: center; }
.tractor-hp__action .btn { max-width: 100%; word-wrap: break-word; white-space: normal; }

/* --- OEM --- */
.tractor-oem {
  background: var(--color-dark);
}
.tractor-oem__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: center;
}
.tractor-oem__inner > * { min-width: 0; }
.tractor-oem__visual { border-radius: var(--radius-lg); overflow: hidden; min-width: 0; }
.tractor-oem__visual img { width: 100%; object-fit: cover; }
.tractor-oem__content .section-header__title { color: var(--color-white); }
.tractor-oem__text { font-size: 16px; color: rgba(255,255,255,0.7); line-height: 1.7; margin-bottom: 24px; }
.tractor-oem__options {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 28px;
}
.tractor-oem__options span {
  padding: 8px 14px;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: var(--radius);
  font-size: 13px;
  font-weight: 500;
  color: rgba(255,255,255,0.8);
}
.tractor-oem__actions { display: flex; gap: 12px; flex-wrap: wrap; }

/* --- Implements --- */
.tractor-implements__grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 16px;
  margin-bottom: 24px;
}
.tractor-implements__card {
  padding: 20px 16px;
  text-align: center;
  background: var(--color-light);
  border-radius: var(--radius-lg);
  border: 1px solid var(--color-border);
  transition: all var(--transition);
}
.tractor-implements__card:hover {
  border-color: var(--color-primary);
  background: var(--color-white);
}
.tractor-implements__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--color-white);
  color: var(--color-primary);
  margin: 0 auto 12px;
  border: 1px solid var(--color-border);
}
.tractor-implements__card h3 {
  font-family: var(--font-body);
  font-size: 15px;
  font-weight: 600;
  color: var(--color-text);
  margin-bottom: 6px;
}
.tractor-implements__card p {
  font-size: 12px;
  color: var(--color-text-secondary);
  margin-bottom: 8px;
}
.tractor-implements__hp {
  font-size: 12px;
  font-weight: 600;
  color: var(--color-primary);
}
.tractor-implements__note {
  text-align: center;
  font-size: 14px;
  color: var(--color-text-secondary);
  margin-bottom: 16px;
}
.tractor-implements__action { text-align: center; }

/* --- Parts Section --- */
.tractor-parts-section {
  background: var(--color-light);
}
.tractor-parts-section__inner {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 64px;
  align-items: center;
}
.tractor-parts-section__inner > * { min-width: 0; }
.tractor-parts-section__text { font-size: 16px; color: var(--color-text-secondary); line-height: 1.7; margin-bottom: 20px; }
.tractor-parts-section__cats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 20px;
}
.tractor-parts-section__cats span {
  padding: 6px 12px;
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  font-size: 13px;
  font-weight: 500;
  color: var(--color-text-secondary);
}
.tractor-parts-section__benefits {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 24px;
}
.tractor-parts-section__benefits span {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--color-text-secondary);
}
.tractor-parts-section__benefits svg { color: var(--color-primary); flex-shrink: 0; }
.tractor-parts-section__actions { display: flex; gap: 12px; flex-wrap: wrap; }
.tractor-parts-section__image { border-radius: var(--radius-lg); overflow: hidden; min-width: 0; }
.tractor-parts-section__image img { width: 100%; object-fit: cover; }

/* --- Why YUFENG --- */
.tractor-why__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.tractor-why__card {
  padding: 28px 24px;
  background: var(--color-light);
  border-radius: var(--radius-lg);
  border-top: 3px solid transparent;
  transition: all var(--transition);
}
.tractor-why__card:hover {
  border-top-color: var(--color-primary);
  background: var(--color-white);
  box-shadow: 0 6px 20px rgba(0,0,0,0.05);
  transform: translateY(-3px);
}
.tractor-why__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: var(--radius);
  background: var(--color-white);
  color: var(--color-primary);
  margin-bottom: 14px;
  border: 1px solid var(--color-border);
}
.tractor-why__card:hover .tractor-why__icon { background: var(--color-primary); color: var(--color-white); border-color: var(--color-primary); }
.tractor-why__title {
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 600;
  color: var(--color-text);
  margin-bottom: 8px;
}
.tractor-why__desc {
  font-size: 14px;
  color: var(--color-text-secondary);
  line-height: 1.6;
}

/* --- Quality --- */
.tractor-quality {
  background: var(--color-dark);
}
.tractor-quality__inner {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 64px;
  align-items: center;
}
.tractor-quality__inner > * { min-width: 0; }
.tractor-quality__image { border-radius: var(--radius-lg); overflow: hidden; }
.tractor-quality__image img { width: 100%; object-fit: cover; }
.tractor-quality__content .section-header__title { color: var(--color-white); }
.tractor-quality__list {
  list-style: none;
  margin-bottom: 16px;
}
.tractor-quality__list li {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  font-size: 15px;
  font-weight: 500;
  color: rgba(255,255,255,0.85);
}
.tractor-quality__list svg { color: var(--color-primary); flex-shrink: 0; }
.tractor-quality__note {
  font-size: 14px;
  color: rgba(255,255,255,0.5);
  margin-bottom: 24px;
}

/* --- FAQ --- */
.tractor-faq .faq__list { max-width: 800px; margin: 0 auto 32px; }

/* --- CTA Form --- */
.tractor-cta {
  position: relative;
  overflow: hidden;
  padding: 100px 0;
}
.tractor-cta__bg {
  position: absolute;
  inset: 0;
}
.tractor-cta__bg img { width: 100%; height: 100%; object-fit: cover; }
.tractor-cta__overlay {
  position: absolute;
  inset: 0;
  background: rgba(17,24,32,0.85);
}
.tractor-cta__inner {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 64px;
  align-items: flex-start;
}
.tractor-cta__content { padding-top: 20px; }
.tractor-cta__text { font-size: 17px; color: rgba(255,255,255,0.75); line-height: 1.7; margin-bottom: 28px; }
.tractor-cta__tags { display: flex; flex-direction: column; gap: 12px; }
.tractor-cta__tag {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 18px;
  background: rgba(255,255,255,0.06);
  border-radius: var(--radius);
  font-size: 14px;
  font-weight: 500;
  color: rgba(255,255,255,0.85);
  border: 1px solid rgba(255,255,255,0.1);
}
.tractor-cta__tag::before {
  content: '';
  width: 8px;
  height: 8px;
  background: var(--color-primary);
  border-radius: 50%;
  flex-shrink: 0;
}
.tractor-cta__form {
  background: var(--color-white);
  padding: 36px;
  border-radius: var(--radius-lg);
}
.tractor-cta__form-title {
  font-family: var(--font-heading);
  font-size: 26px;
  font-weight: 700;
  color: var(--color-text);
  margin-bottom: 24px;
}
.tractor-cta__honeypot { position: absolute; left: -9999px; opacity: 0; height: 0; }
.tractor-cta__form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: 16px;
}
.tractor-cta__field { display: flex; flex-direction: column; }
.tractor-cta__field label { font-size: 13px; font-weight: 500; color: var(--color-text); margin-bottom: 6px; }
.tractor-cta__field input,
.tractor-cta__field select,
.tractor-cta__field textarea {
  padding: 12px 14px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  font-family: var(--font-body);
  font-size: 14px;
  color: var(--color-text);
  transition: border-color var(--transition);
  background: var(--color-white);
}
.tractor-cta__field input:focus,
.tractor-cta__field select:focus,
.tractor-cta__field textarea:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(200,16,46,0.1);
}
.tractor-cta__field input.error,
.tractor-cta__field select.error { border-color: var(--color-primary); }
.tractor-cta__error { font-size: 12px; color: var(--color-primary); margin-top: 4px; min-height: 16px; }
.tractor-cta__field--full { grid-column: 1 / -1; margin-bottom: 16px; }
.tractor-cta__checkbox { display: flex; align-items: flex-start; gap: 10px; cursor: pointer; font-size: 13px; color: var(--color-text-secondary); line-height: 1.5; }
.tractor-cta__checkbox input { margin-top: 3px; width: 16px; height: 16px; accent-color: var(--color-primary); }
.tractor-cta__submit { width: 100%; }
.tractor-cta__success {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 20px;
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  border-radius: var(--radius);
  margin-top: 16px;
}
.tractor-cta__success svg { color: var(--color-success); flex-shrink: 0; }
.tractor-cta__success p { font-size: 14px; color: #166534; font-weight: 500; }

/* --- Quick View Modal --- */
.modal__content--qv {
  max-width: 760px;
  max-height: 90vh;
  overflow-y: auto;
  background: var(--color-white);
  border-radius: var(--radius-lg);
  padding: 32px;
}
.qv__top {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 28px;
  margin-bottom: 24px;
}
.qv__img { border-radius: var(--radius-lg); overflow: hidden; background: var(--color-light); }
.qv__img img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; display: block; }
.qv__info h2 {
  font-family: var(--font-heading);
  font-size: 28px;
  font-weight: 700;
  color: var(--color-primary);
  margin-bottom: 4px;
}
.qv__info h3 {
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 600;
  color: var(--color-text);
  margin-bottom: 12px;
}
.qv__info p {
  font-size: 14px;
  color: var(--color-text-secondary);
  line-height: 1.6;
  margin-bottom: 16px;
}
.qv__specs { list-style: none; margin-bottom: 16px; }
.qv__specs li {
  display: flex;
  justify-content: space-between;
  padding: 8px 0;
  border-bottom: 1px solid var(--color-light);
  font-size: 14px;
}
.qv__specs li strong { color: var(--color-text); font-weight: 500; }
.qv__specs li span { color: var(--color-text-secondary); }
.qv__actions { display: flex; gap: 10px; flex-wrap: wrap; }

/* --- Compare Bar --- */
.compare-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 85;
  background: var(--color-dark);
  box-shadow: 0 -4px 16px rgba(0,0,0,0.2);
  padding: 14px 0;
}
.compare-bar[hidden] { display: none; }
.compare-bar__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.compare-bar__text { font-size: 14px; color: var(--color-white); }
.compare-bar__text strong { color: var(--color-primary); }
.compare-bar__actions { display: flex; gap: 10px; }

/* --- Compare Modal --- */
.modal__content--cmp {
  max-width: 1000px;
  max-height: 90vh;
  overflow: auto;
  background: var(--color-white);
  border-radius: var(--radius-lg);
  padding: 32px;
}
.cmp__table { width: 100%; border-collapse: collapse; }
.cmp__table th,
.cmp__table td {
  padding: 12px 16px;
  text-align: left;
  font-size: 14px;
  border-bottom: 1px solid var(--color-border);
}
.cmp__table th {
  background: var(--color-light);
  font-weight: 600;
  color: var(--color-text);
  position: sticky;
  top: 0;
}
.cmp__table td { color: var(--color-text-secondary); }
.cmp__table td strong { color: var(--color-primary); font-family: var(--font-heading); font-size: 15px; letter-spacing: 0.5px; }
.cmp__actions { margin-top: 20px; display: flex; gap: 12px; justify-content: center; }

/* --- Filter Drawer --- */
.filter-drawer { position: fixed; inset: 0; z-index: 1000; }
.filter-drawer[hidden] { display: none; }
.filter-drawer__overlay { position: absolute; inset: 0; background: rgba(0,0,0,0.5); }
.filter-drawer__panel {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 320px;
  max-width: 85vw;
  background: var(--color-white);
  display: flex;
  flex-direction: column;
  transform: translateX(100%);
  transition: transform 300ms ease;
}
.filter-drawer.open .filter-drawer__panel { transform: translateX(0); }
.filter-drawer__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 24px;
  border-bottom: 1px solid var(--color-border);
}
.filter-drawer__title { font-family: var(--font-heading); font-size: 20px; font-weight: 700; }
.filter-drawer__close { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; }
.filter-drawer__body { flex: 1; overflow-y: auto; padding: 20px 24px; }
.filter-drawer__footer { padding: 16px 24px; border-top: 1px solid var(--color-border); display: flex; flex-direction: column; gap: 10px; }

/* --- Screen reader only --- */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}

/* ============================
   TRACTORS RESPONSIVE
   ============================ */
@media (max-width: 1199px) {
  .tractors-hero { height: 480px; }
  .tractors-hero__title { font-size: 46px; }
  .tractor-cats__grid { grid-template-columns: repeat(3, 1fr); }
  .tractor-listing__layout { grid-template-columns: 240px 1fr; gap: 24px; }
  .tractor-listing__grid { grid-template-columns: repeat(2, 1fr); }
  .tractor-hp__grid { grid-template-columns: repeat(3, 1fr); }
  .tractor-oem__inner { gap: 40px; }
  .tractor-parts-section__inner { gap: 40px; }
  .tractor-quality__inner { gap: 40px; }
  .tractor-cta__inner { gap: 40px; }
  .tractor-apps__grid { grid-template-columns: repeat(2, 1fr); }
  .tractor-implements__grid { grid-template-columns: repeat(3, 1fr); }
  .tractor-guide__cards { grid-template-columns: repeat(4, 1fr); }
  .tractor-guide__cards--hp { grid-template-columns: repeat(4, 1fr); }
}

@media (max-width: 991px) {
  .tractors-hero { height: 440px; }
  .tractors-hero__title { font-size: 40px; }
  .tractor-listing__layout {
    grid-template-columns: 1fr;
  }
  .tractor-filter { display: none; }
  .tractor-listing__filter-btn { display: flex; }
  .tractor-oem__inner { grid-template-columns: 1fr; }
  .tractor-parts-section__inner { grid-template-columns: 1fr; }
  .tractor-quality__inner { grid-template-columns: 1fr; }
  .tractor-cta__inner { grid-template-columns: 1fr; }
  .qv__top { grid-template-columns: 1fr; }
}

@media (max-width: 767px) {
  .tractors-hero { height: 420px; }
  .tractors-hero__title { font-size: 34px; }
  .tractors-hero__desc { font-size: 15px; }
  .tractors-hero__buttons { flex-direction: column; gap: 12px; }
  .tractors-hero__buttons .btn { width: 100%; }
  .tractors-hero__tags { flex-wrap: wrap; gap: 8px; }
  .tractor-cats__grid { grid-template-columns: repeat(2, 1fr); }
  .tractor-listing__grid { grid-template-columns: 1fr; }
  .tractor-listing__toolbar { flex-direction: column; align-items: stretch; }
  .tractor-listing__controls { flex-wrap: wrap; }
  .tractor-apps__grid { grid-template-columns: 1fr; }
  .tractor-hp__grid { grid-template-columns: 1fr; }
  .tractor-why__grid { grid-template-columns: 1fr; }
  .tractor-implements__grid { grid-template-columns: repeat(2, 1fr); }
  .tractor-parts-section__benefits { grid-template-columns: 1fr; }
  .tractor-cta__form-grid { grid-template-columns: 1fr; }
  .tractor-cta__form { padding: 24px; }
  .compare-bar__inner { flex-direction: column; gap: 10px; text-align: center; }
  .modal__content--qv { padding: 20px; }
  .modal__content--cmp { padding: 16px; }
  .cmp__table { font-size: 13px; }
  .cmp__table th, .cmp__table td { padding: 8px 10px; }
  .tractor-listing__grid--list .tractor-card { grid-template-columns: 1fr; }
  .tractor-guide__cards { grid-template-columns: repeat(2, 1fr); }
  .tractor-guide__cards--hp { grid-template-columns: repeat(2, 1fr); }
  .tractor-guide__cards--drive { grid-template-columns: 1fr; }
  .tractor-guide__cards--config { grid-template-columns: 1fr; }
  .tractor-guide__panel { padding: 20px; }
  .tractor-guide__question { font-size: 18px; }
  .tractor-guide__nav { flex-direction: column; gap: 10px; }
  .tractor-guide__nav .btn { width: 100%; }
}

@media (max-width: 479px) {
  .tractors-hero { height: 400px; }
  .tractors-hero__title { font-size: 28px; }
  .tractor-cats__grid { grid-template-columns: 1fr; }
  .tractor-implements__grid { grid-template-columns: 1fr; }
  .tractor-oem__options { gap: 6px; }
  .tractor-oem__options span { font-size: 12px; padding: 6px 10px; }
  .tractor-oem__actions { flex-direction: column; }
  .tractor-oem__actions .btn { width: 100%; }
  .tractor-parts-section__actions { flex-direction: column; }
  .tractor-guide__cards { grid-template-columns: 1fr; }
  .tractor-guide__cards--hp { grid-template-columns: 1fr; }
  .tractor-guide__progress-steps { gap: 4px; }
  .tractor-guide__progress-step small { display: none; }
  .tractor-guide__result-actions { flex-direction: column; }
  .tractor-guide__result-actions .btn { width: 100%; }
  .tractor-parts-section__actions .btn { width: 100%; }
  .tractor-hp__action .btn { width: 100%; }
}

/* ============================================
   PRODUCT DETAIL PAGE STYLES
   ============================================ */

/* --- Breadcrumb --- */
.pd-breadcrumb { background: var(--color-white); padding: 14px 0; border-bottom: 1px solid var(--color-border); }
.pd-breadcrumb__nav { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--color-metal); }
.pd-breadcrumb__nav a { color: var(--color-metal); transition: color var(--transition); }
.pd-breadcrumb__nav a:hover { color: var(--color-primary); }
.pd-breadcrumb__nav span:last-child { color: var(--color-text); font-weight: 500; }

/* --- Product Hero --- */
.pd-hero { background: var(--color-white); padding: 48px 0 56px; }
.pd-hero__inner { display: grid; grid-template-columns: 58% 42%; gap: 40px; align-items: flex-start; }

/* --- Gallery --- */
.pd-gallery__main { position: relative; border-radius: var(--radius-lg); overflow: hidden; background: var(--color-light); margin-bottom: 12px; cursor: zoom-in; }
.pd-gallery__main img { width: 100%; height: auto; display: block; object-fit: cover; aspect-ratio: 3 / 2; }
.pd-gallery__zoom { position: absolute; bottom: 12px; right: 12px; display: flex; align-items: center; gap: 6px; padding: 8px 14px; background: rgba(0,0,0,0.5); backdrop-filter: blur(6px); border-radius: var(--radius); color: var(--color-white); font-size: 12px; font-weight: 500; }
.pd-gallery__thumbs { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px; }
.pd-gallery__thumb { flex-shrink: 0; width: 72px; height: 54px; border: 2px solid var(--color-border); border-radius: var(--radius); overflow: hidden; cursor: pointer; transition: border-color var(--transition); position: relative; background: var(--color-light); }
.pd-gallery__thumb--active { border-color: var(--color-primary); }
.pd-gallery__thumb:hover { border-color: var(--color-primary); }
.pd-gallery__thumb img { width: 100%; height: 100%; object-fit: cover; }
.pd-gallery__thumb-play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: rgba(0,0,0,0.3); color: var(--color-white); }

/* --- Product Info --- */
.pd-info__category { font-size: 12px; font-weight: 600; letter-spacing: 2px; color: var(--color-primary); text-transform: uppercase; margin-bottom: 8px; display: block; }
.pd-info__title { font-family: var(--font-heading); font-size: 32px; font-weight: 800; color: var(--color-text); line-height: 1.15; margin-bottom: 14px; letter-spacing: -0.3px; }
.pd-info__desc { font-size: 15px; color: var(--color-text-secondary); line-height: 1.7; margin-bottom: 14px; }
.pd-info__tags { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.pd-info__tag { padding: 5px 12px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 12px; font-weight: 600; color: var(--color-text-secondary); }
.pd-info__model { font-size: 14px; color: var(--color-text-secondary); margin-bottom: 12px; }
.pd-info__model strong { color: var(--color-text); }
.pd-info__share { display: flex; gap: 10px; margin-bottom: 20px; flex-wrap: wrap; }
.pd-info__share-btn { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: var(--color-metal); transition: color var(--transition); cursor: pointer; background: none; border: none; padding: 0; }
.pd-info__share-btn:hover { color: var(--color-primary); }

/* --- Core Specs --- */
.pd-specs { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border: 1px solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden; margin-bottom: 10px; }
.pd-specs__item { padding: 12px 16px; border-bottom: 1px solid var(--color-light); }
.pd-specs__item:nth-child(odd) { border-right: 1px solid var(--color-light); }
.pd-specs__label { display: block; font-size: 11px; font-weight: 600; color: var(--color-metal); text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 2px; }
.pd-specs__value { font-size: 15px; font-weight: 600; color: var(--color-text); }
.pd-specs__note { font-size: 12px; color: var(--color-metal); margin-bottom: 18px; }

/* --- Actions --- */
.pd-actions { display: flex; gap: 10px; margin-bottom: 10px; }
.pd-actions--secondary { margin-bottom: 10px; }
.pd-actions__main { flex: 1; }
.pd-trust { font-size: 12px; color: var(--color-metal); margin-bottom: 20px; }

/* --- Quick Inquiry --- */
.pd-inquiry { background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 20px; }
.pd-inquiry__title { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 14px; }
.pd-inquiry__honeypot { position: absolute; left: -9999px; height: 0; opacity: 0; }
.pd-inquiry__field { margin-bottom: 10px; }
.pd-inquiry__field label { display: block; font-size: 12px; font-weight: 500; color: var(--color-text); margin-bottom: 4px; }
.pd-inquiry__field input, .pd-inquiry__field textarea { width: 100%; padding: 10px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-family: var(--font-body); }
.pd-inquiry__field input:focus, .pd-inquiry__field textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 2px rgba(200,16,46,0.1); }
.pd-inquiry__field input.error { border-color: var(--color-primary); }
.pd-inquiry__error { font-size: 11px; color: var(--color-primary); margin-top: 2px; min-height: 14px; }
.pd-inquiry__field--full { grid-column: 1 / -1; }
.pd-inquiry__checkbox { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; color: var(--color-text-secondary); cursor: pointer; line-height: 1.4; }
.pd-inquiry__checkbox input { margin-top: 2px; width: 14px; height: 14px; accent-color: var(--color-primary); }
.pd-inquiry__submit { width: 100%; }
.pd-inquiry__success { display: flex; align-items: center; gap: 8px; padding: 12px; background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: var(--radius); margin-top: 10px; }
.pd-inquiry__success svg { color: var(--color-success); flex-shrink: 0; }
.pd-inquiry__success p { font-size: 13px; color: #166534; font-weight: 500; }

/* --- Sticky Anchor --- */
.pd-anchor { background: var(--color-white); border-bottom: 1px solid var(--color-border); position: sticky; top: 70px; z-index: 40; }
.pd-anchor__inner { display: flex; gap: 0; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.pd-anchor__link { flex-shrink: 0; padding: 14px 18px; font-size: 13px; font-weight: 600; color: var(--color-text-secondary); border-bottom: 3px solid transparent; transition: all var(--transition); white-space: nowrap; }
.pd-anchor__link:hover { color: var(--color-primary); }
.pd-anchor__link--active { color: var(--color-primary); border-bottom-color: var(--color-primary); }

/* --- Overview --- */
.pd-overview__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.pd-overview__content p { font-size: 15px; color: var(--color-text-secondary); line-height: 1.7; margin-bottom: 14px; }
.pd-overview__uses { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 16px; }
.pd-overview__uses span { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 500; color: var(--color-text); }
.pd-overview__uses svg { color: var(--color-primary); flex-shrink: 0; }
.pd-overview__tip { display: flex; gap: 10px; padding: 14px 16px; background: var(--color-light); border-radius: var(--radius); border-left: 3px solid var(--color-primary); }
.pd-overview__tip svg { flex-shrink: 0; color: var(--color-primary); margin-top: 2px; }
.pd-overview__tip p { font-size: 13px; color: var(--color-text-secondary); margin: 0; }
.pd-overview__image { border-radius: var(--radius-lg); overflow: hidden; }
.pd-overview__image img { width: 100%; object-fit: cover; }

/* --- Features --- */
.pd-features__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.pd-features__card { padding: 22px 18px; background: var(--color-white); border-radius: var(--radius-lg); border-top: 3px solid transparent; transition: all var(--transition); }
.pd-features__card:hover { border-top-color: var(--color-primary); transform: translateY(-3px); box-shadow: 0 6px 20px rgba(0,0,0,0.05); }
.pd-features__icon { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: var(--radius); background: var(--color-light); color: var(--color-primary); margin-bottom: 12px; border: 1px solid var(--color-border); }
.pd-features__card:hover .pd-features__icon { background: var(--color-primary); color: var(--color-white); border-color: var(--color-primary); }
.pd-features__card h3 { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-text); margin-bottom: 6px; }
.pd-features__card p { font-size: 13px; color: var(--color-text-secondary); line-height: 1.5; }

/* --- Product Details --- */
.pd-details__list { display: flex; flex-direction: column; gap: 48px; }
.pd-details__item { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; }
.pd-details__item--reverse { direction: rtl; }
.pd-details__item--reverse > * { direction: ltr; }
.pd-details__img { border-radius: var(--radius-lg); overflow: hidden; }
.pd-details__img img { width: 100%; object-fit: cover; }
.pd-details__text h3 { font-family: var(--font-body); font-size: 20px; font-weight: 600; color: var(--color-text); margin-bottom: 10px; }
.pd-details__text p { font-size: 15px; color: var(--color-text-secondary); line-height: 1.7; }

/* --- Spec Table --- */
.pd-spec-table__actions { display: flex; gap: 10px; margin-bottom: 24px; flex-wrap: wrap; }
.pd-spec-table__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-bottom: 20px; }
.pd-spec-group { background: var(--color-white); border-radius: var(--radius-lg); border: 1px solid var(--color-border); overflow: hidden; }
.pd-spec-group__title { padding: 12px 18px; background: var(--color-dark); color: var(--color-white); font-family: var(--font-body); font-size: 14px; font-weight: 600; }
.pd-spec-group__row { display: flex; padding: 10px 18px; border-bottom: 1px solid var(--color-light); font-size: 13px; }
.pd-spec-group__row:last-child { border-bottom: none; }
.pd-spec-group__label { width: 45%; color: var(--color-text-secondary); font-weight: 500; }
.pd-spec-group__value { width: 55%; color: var(--color-text); }
.pd-spec-table__disclaimer { font-size: 13px; color: var(--color-metal); text-align: center; padding: 16px; background: var(--color-white); border-radius: var(--radius); border: 1px solid var(--color-border); }

/* --- Config --- */
.pd-config__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 32px; }
.pd-config__card { padding: 18px; background: var(--color-light); border-radius: var(--radius-lg); border: 1px solid var(--color-border); text-align: center; transition: all var(--transition); }
.pd-config__card:hover { border-color: var(--color-primary); background: var(--color-white); }
.pd-config__card h3 { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.pd-config__card p { font-size: 12px; color: var(--color-text-secondary); margin-bottom: 6px; }
.pd-config__card-tag { font-size: 11px; font-weight: 600; color: var(--color-primary); }
.pd-config__selector { background: var(--color-light); padding: 28px; border-radius: var(--radius-lg); border: 1px solid var(--color-border); }
.pd-config__selector h3 { font-family: var(--font-body); font-size: 18px; font-weight: 600; color: var(--color-text); margin-bottom: 16px; }
.pd-config__checks { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 20px; }
.pd-config__checks label { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--color-text-secondary); cursor: pointer; }
.pd-config__checks input { width: 16px; height: 16px; accent-color: var(--color-primary); }

/* --- Operator --- */
.pd-operator { background: var(--color-dark); }
.pd-operator__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-bottom: 20px; }
.pd-operator__card { background: var(--color-dark-secondary); border-radius: var(--radius-lg); overflow: hidden; border: 1px solid rgba(255,255,255,0.08); transition: all var(--transition); }
.pd-operator__card:hover { border-color: var(--color-primary); }
.pd-operator__img { aspect-ratio: 3 / 2; overflow: hidden; background: var(--color-dark); }
.pd-operator__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pd-operator__body { padding: 18px; }
.pd-operator__body h3 { font-family: var(--font-body); font-size: 17px; font-weight: 600; color: var(--color-white); margin-bottom: 6px; }
.pd-operator__body p { font-size: 14px; color: rgba(255,255,255,0.6); line-height: 1.5; margin-bottom: 8px; }
.pd-operator__tag { font-size: 12px; font-weight: 600; color: var(--color-primary); }
.pd-operator__note { text-align: center; font-size: 14px; color: rgba(255,255,255,0.5); }

/* --- Engine --- */
.pd-engine__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.pd-engine__image { border-radius: var(--radius-lg); overflow: hidden; }
.pd-engine__image img { width: 100%; object-fit: cover; }
.pd-engine__content p { font-size: 15px; color: var(--color-text-secondary); line-height: 1.7; margin-bottom: 16px; }
.pd-engine__points { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 20px; }
.pd-engine__points span { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 500; color: var(--color-text); }
.pd-engine__points svg { color: var(--color-primary); flex-shrink: 0; }

/* --- Transmission --- */
.pd-trans { background: var(--color-light); }
.pd-trans__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.pd-trans__content p { font-size: 15px; color: var(--color-text-secondary); line-height: 1.7; margin-bottom: 16px; }
.pd-trans__specs { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border: 1px solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden; margin-bottom: 20px; background: var(--color-white); }
.pd-trans__spec { padding: 12px 16px; border-bottom: 1px solid var(--color-light); }
.pd-trans__spec:nth-child(odd) { border-right: 1px solid var(--color-light); }
.pd-trans__spec span { display: block; font-size: 11px; color: var(--color-metal); text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 2px; }
.pd-trans__spec strong { font-size: 14px; color: var(--color-text); }
.pd-trans__image { border-radius: var(--radius-lg); overflow: hidden; }
.pd-trans__image img { width: 100%; object-fit: cover; }

/* --- Hydraulics --- */
.pd-hydraulics__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.pd-hydraulics__image { border-radius: var(--radius-lg); overflow: hidden; }
.pd-hydraulics__image img { width: 100%; object-fit: cover; }
.pd-hydraulics__content p { font-size: 15px; color: var(--color-text-secondary); line-height: 1.7; margin-bottom: 16px; }
.pd-hydraulics__specs { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border: 1px solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden; margin-bottom: 14px; background: var(--color-light); }
.pd-hydraulics__spec { padding: 12px 16px; border-bottom: 1px solid var(--color-border); }
.pd-hydraulics__spec:nth-child(odd) { border-right: 1px solid var(--color-border); }
.pd-hydraulics__spec span { display: block; font-size: 11px; color: var(--color-metal); text-transform: uppercase; margin-bottom: 2px; }
.pd-hydraulics__spec strong { font-size: 14px; color: var(--color-text); }
.pd-hydraulics__tip { display: flex; gap: 8px; padding: 12px 14px; background: var(--color-light); border-radius: var(--radius); border-left: 3px solid var(--color-primary); }
.pd-hydraulics__tip svg { flex-shrink: 0; color: var(--color-primary); margin-top: 2px; }
.pd-hydraulics__tip p { font-size: 13px; color: var(--color-text-secondary); margin: 0; }

/* --- Chassis --- */
.pd-chassis__content { max-width: 720px; margin: 0 auto; text-align: center; }
.pd-chassis__content > p { font-size: 15px; color: var(--color-text-secondary); margin-bottom: 20px; }
.pd-chassis__tires { display: flex; gap: 4px; justify-content: center; margin-bottom: 16px; }
.pd-chassis__tire { padding: 10px 20px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 14px; font-weight: 500; color: var(--color-text-secondary); background: var(--color-white); transition: all var(--transition); }
.pd-chassis__tire--active { background: var(--color-primary); color: var(--color-white); border-color: var(--color-primary); }
.pd-chassis__tire:hover:not(.pd-chassis__tire--active) { border-color: var(--color-primary); color: var(--color-primary); }
.pd-chassis__tire-info { padding: 16px; background: var(--color-white); border-radius: var(--radius); border: 1px solid var(--color-border); }
.pd-chassis__tire-info p { font-size: 14px; color: var(--color-text-secondary); margin: 0; }

/* --- Applications --- */
.pd-apps__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-bottom: 20px; }
.pd-apps__card { background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden; transition: all var(--transition); }
.pd-apps__card:hover { transform: translateY(-3px); box-shadow: 0 6px 20px rgba(0,0,0,0.06); border-color: var(--color-primary); }
.pd-apps__img { aspect-ratio: 3 / 2; overflow: hidden; background: var(--color-light); }
.pd-apps__img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform var(--transition); }
.pd-apps__card:hover .pd-apps__img img { transform: scale(1.05); }
.pd-apps__card h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); padding: 14px 16px 6px; }
.pd-apps__card p { font-size: 13px; color: var(--color-text-secondary); padding: 0 16px 14px; line-height: 1.5; }
.pd-apps__note { text-align: center; font-size: 14px; color: var(--color-text-secondary); margin-bottom: 16px; }
.pd-apps__action { text-align: center; }

/* --- Implements --- */
.pd-implements__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 20px; }
.pd-implements__card { padding: 18px; text-align: center; background: var(--color-white); border-radius: var(--radius-lg); border: 1px solid var(--color-border); transition: all var(--transition); }
.pd-implements__card:hover { border-color: var(--color-primary); }
.pd-implements__icon { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: var(--color-light); color: var(--color-primary); margin: 0 auto 10px; border: 1px solid var(--color-border); }
.pd-implements__card h3 { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.pd-implements__card p { font-size: 12px; color: var(--color-text-secondary); margin-bottom: 8px; }
.pd-implements__link { font-size: 12px; font-weight: 600; color: var(--color-primary); }
.pd-implements__note { text-align: center; font-size: 14px; color: var(--color-text-secondary); margin-bottom: 16px; }
.pd-implements__actions { display: flex; gap: 12px; justify-content: center; }

/* --- OEM --- */
.pd-oem { background: var(--color-dark); }
.pd-oem__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.pd-oem__visual { border-radius: var(--radius-lg); overflow: hidden; }
.pd-oem__visual img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; display: block; }
.pd-oem__content .section-header__title { color: var(--color-white); }
.pd-oem__content p { font-size: 15px; color: rgba(255,255,255,0.7); line-height: 1.7; margin-bottom: 20px; }
.pd-oem__options { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
.pd-oem__options span { padding: 7px 14px; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: var(--radius); font-size: 13px; color: rgba(255,255,255,0.8); }
.pd-oem__actions { display: flex; gap: 12px; margin-bottom: 14px; }
.pd-oem__note { font-size: 13px; color: rgba(255,255,255,0.5); }

/* --- Manufacturing --- */
.pd-mfg__steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 28px; }
.pd-mfg__step { padding: 20px; background: var(--color-light); border-radius: var(--radius-lg); border-top: 3px solid var(--color-primary); }
.pd-mfg__num { font-family: var(--font-heading); font-size: 20px; font-weight: 800; color: var(--color-primary); opacity: 0.4; display: block; margin-bottom: 8px; }
.pd-mfg__step h3 { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.pd-mfg__step p { font-size: 13px; color: var(--color-text-secondary); }
.pd-mfg__action { text-align: center; }

/* --- Quality --- */
.pd-quality { background: var(--color-dark); }
.pd-quality__inner { display: grid; grid-template-columns: 1fr 1.1fr; gap: 48px; align-items: center; }
.pd-quality__image { border-radius: var(--radius-lg); overflow: hidden; }
.pd-quality__image img { width: 100%; object-fit: cover; }
.pd-quality__content .section-header__title { color: var(--color-white); }
.pd-quality__list { list-style: none; margin-bottom: 16px; }
.pd-quality__list li { display: flex; align-items: center; gap: 8px; padding: 8px 0; border-bottom: 1px solid rgba(255,255,255,0.08); font-size: 14px; color: rgba(255,255,255,0.85); }
.pd-quality__list svg { color: var(--color-primary); flex-shrink: 0; }
.pd-quality__promise { padding: 14px 18px; background: rgba(255,255,255,0.06); border-left: 3px solid var(--color-primary); border-radius: 0 var(--radius) var(--radius) 0; margin-bottom: 10px; }
.pd-quality__promise p { font-size: 14px; color: var(--color-white); font-weight: 500; margin: 0; }
.pd-quality__note { font-size: 13px; color: rgba(255,255,255,0.5); margin-bottom: 20px; }

/* --- Packing --- */
.pd-packing__steps { display: flex; gap: 8px; justify-content: center; margin-bottom: 32px; flex-wrap: wrap; }
.pd-packing__step { padding: 14px 18px; background: var(--color-light); border-radius: var(--radius); text-align: center; border-top: 3px solid var(--color-primary); }
.pd-packing__step span { font-family: var(--font-heading); font-size: 18px; font-weight: 700; color: var(--color-primary); display: block; margin-bottom: 4px; }
.pd-packing__step h3 { font-family: var(--font-body); font-size: 13px; font-weight: 600; color: var(--color-text); }
.pd-packing__info { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-bottom: 28px; }
.pd-packing__method, .pd-packing__qty { padding: 20px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.pd-packing__method h3, .pd-packing__qty h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 12px; }
.pd-packing__method li { font-size: 14px; color: var(--color-text-secondary); padding: 6px 0; border-bottom: 1px solid var(--color-light); padding-left: 14px; position: relative; }
.pd-packing__method li::before { content: ''; position: absolute; left: 0; top: 50%; width: 5px; height: 5px; background: var(--color-primary); border-radius: 50%; transform: translateY(-50%); }
.pd-packing__qty-item { display: flex; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid var(--color-light); font-size: 14px; }
.pd-packing__qty-item span { color: var(--color-text-secondary); }
.pd-packing__qty-item strong { color: var(--color-text); }
.pd-packing__qty p { font-size: 13px; color: var(--color-metal); margin-top: 10px; }
.pd-packing__action { text-align: center; }

/* --- Parts --- */
.pd-parts__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-bottom: 24px; }
.pd-parts__cats h3, .pd-parts__services h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 12px; }
.pd-parts__tags { display: flex; flex-wrap: wrap; gap: 8px; }
.pd-parts__tags span { padding: 7px 14px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; color: var(--color-text-secondary); }
.pd-parts__starter { padding: 20px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); border-left: 4px solid var(--color-primary); margin-bottom: 20px; }
.pd-parts__starter h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 8px; }
.pd-parts__starter p { font-size: 14px; color: var(--color-text-secondary); margin-bottom: 4px; }
.pd-parts__starter-note { font-size: 12px; color: var(--color-metal); }
.pd-parts__actions { display: flex; gap: 12px; justify-content: center; }

/* --- Service --- */
.pd-service__phases { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-bottom: 28px; }
.pd-service__phase { padding: 22px; background: var(--color-light); border-radius: var(--radius-lg); border-top: 3px solid var(--color-primary); }
.pd-service__phase span { font-family: var(--font-heading); font-size: 24px; font-weight: 800; color: var(--color-primary); opacity: 0.3; display: block; margin-bottom: 8px; }
.pd-service__phase h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 6px; }
.pd-service__phase p { font-size: 13px; color: var(--color-text-secondary); line-height: 1.5; }
.pd-service__caps { display: flex; gap: 16px; justify-content: center; margin-bottom: 16px; flex-wrap: wrap; }
.pd-service__caps span { display: flex; align-items: center; gap: 6px; padding: 10px 18px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; color: var(--color-text-secondary); }
.pd-service__caps svg { color: var(--color-primary); }
.pd-service__note { text-align: center; font-size: 13px; color: var(--color-metal); margin-bottom: 16px; }
.pd-service__action { text-align: center; }

/* --- Downloads --- */
.pd-downloads__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 16px; }
.pd-downloads__card { display: flex; align-items: center; gap: 14px; padding: 18px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); transition: all var(--transition); }
.pd-downloads__card:hover { border-color: var(--color-primary); }
.pd-downloads__card svg { color: var(--color-primary); flex-shrink: 0; }
.pd-downloads__card h3 { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-text); flex: 1; }
.pd-downloads__card span { font-size: 12px; color: var(--color-metal); }
.pd-downloads__card .btn { flex-shrink: 0; }
.pd-downloads__note { text-align: center; font-size: 13px; color: var(--color-metal); }

/* --- Videos --- */
.pd-videos { background: var(--color-dark); }
.pd-videos__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }

/* --- Related --- */
.pd-related__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; margin-bottom: 24px; }
.pd-related__action { text-align: center; }

/* --- Bottom CTA --- */
.pd-cta { position: relative; overflow: hidden; padding: 80px 0; }
.pd-cta__bg { position: absolute; inset: 0; }
.pd-cta__bg img { width: 100%; height: 100%; object-fit: cover; }
.pd-cta__overlay { position: absolute; inset: 0; background: rgba(17,24,32,0.85); }
.pd-cta__inner { position: relative; z-index: 2; display: grid; grid-template-columns: 1fr 1.1fr; gap: 48px; align-items: flex-start; }
.pd-cta__text { font-size: 16px; color: rgba(255,255,255,0.75); line-height: 1.7; margin-bottom: 20px; }
.pd-cta__tags { display: flex; flex-direction: column; gap: 10px; }
.pd-cta__tags span { display: flex; align-items: center; gap: 10px; padding: 10px 16px; background: rgba(255,255,255,0.06); border-radius: var(--radius); font-size: 13px; color: rgba(255,255,255,0.85); border: 1px solid rgba(255,255,255,0.1); }
.pd-cta__tags span::before { content: ''; width: 7px; height: 7px; background: var(--color-primary); border-radius: 50%; flex-shrink: 0; }
.pd-cta__form { background: var(--color-white); padding: 32px; border-radius: var(--radius-lg); }
.pd-cta__form-title { font-family: var(--font-heading); font-size: 24px; font-weight: 700; color: var(--color-text); margin-bottom: 20px; }
.pd-cta__honeypot { position: absolute; left: -9999px; height: 0; opacity: 0; }
.pd-cta__form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px; }
.pd-cta__field { display: flex; flex-direction: column; }
.pd-cta__field label { font-size: 12px; font-weight: 500; color: var(--color-text); margin-bottom: 4px; }
.pd-cta__field input, .pd-cta__field select, .pd-cta__field textarea { padding: 10px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-family: var(--font-body); color: var(--color-text); background: var(--color-white); }
.pd-cta__field input:focus, .pd-cta__field select:focus, .pd-cta__field textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 2px rgba(200,16,46,0.1); }
.pd-cta__field input.error { border-color: var(--color-primary); }
.pd-cta__error { font-size: 11px; color: var(--color-primary); margin-top: 2px; min-height: 14px; }
.pd-cta__field--full { grid-column: 1 / -1; margin-bottom: 12px; }
.pd-cta__checks { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.pd-cta__checks label { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--color-text-secondary); cursor: pointer; }
.pd-cta__checks input { width: 15px; height: 15px; accent-color: var(--color-primary); }
.pd-cta__checkbox { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; color: var(--color-text-secondary); cursor: pointer; line-height: 1.4; }
.pd-cta__checkbox input { margin-top: 2px; width: 14px; height: 14px; accent-color: var(--color-primary); }
.pd-cta__submit { width: 100%; }
.pd-cta__success { display: flex; align-items: center; gap: 10px; padding: 14px; background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: var(--radius); margin-top: 12px; }
.pd-cta__success svg { color: var(--color-success); flex-shrink: 0; }
.pd-cta__success p { font-size: 13px; color: #166534; font-weight: 500; }

/* ============================
   PRODUCT DETAIL RESPONSIVE
   ============================ */
@media (max-width: 1199px) {
  .pd-hero__inner { grid-template-columns: 55% 45%; gap: 28px; }
  .pd-features__grid { grid-template-columns: repeat(2, 1fr); }
  .pd-spec-table__grid { grid-template-columns: 1fr; }
  .pd-config__grid { grid-template-columns: repeat(3, 1fr); }
  .pd-implements__grid { grid-template-columns: repeat(3, 1fr); }
  .pd-related__grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 991px) {
  .pd-hero__inner { grid-template-columns: minmax(0, 1fr); }
  .pd-gallery, .pd-info, .pd-models__table-wrap { min-width: 0; max-width: 100%; }
  .pd-info__title { font-size: 28px; }
  .pd-overview__inner { grid-template-columns: 1fr; }
  .pd-details__item { grid-template-columns: 1fr; }
  .pd-details__item--reverse { direction: ltr; }
  .pd-engine__inner { grid-template-columns: 1fr; }
  .pd-trans__inner { grid-template-columns: 1fr; }
  .pd-hydraulics__inner { grid-template-columns: 1fr; }
  .pd-oem__inner { grid-template-columns: 1fr; }
  .pd-quality__inner { grid-template-columns: 1fr; }
  .pd-cta__inner { grid-template-columns: 1fr; }
  .pd-parts__grid { grid-template-columns: 1fr; }
  .pd-packing__info { grid-template-columns: 1fr; }
  .pd-operator__grid { grid-template-columns: 1fr; }
  .pd-videos__grid { grid-template-columns: repeat(2, 1fr); }
  .pd-mfg__steps { grid-template-columns: repeat(2, 1fr); }
  .pd-service__phases { grid-template-columns: repeat(2, 1fr); }
  .pd-downloads__grid { grid-template-columns: repeat(2, 1fr); }
  .pd-related__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 767px) {
  .pd-hero { padding: 28px 0 36px; }
  .pd-info__title { font-size: 24px; }
  .pd-info__tags { gap: 6px; }
  .pd-actions { flex-direction: column; }
  .pd-actions--secondary { flex-wrap: wrap; }
  .pd-specs { grid-template-columns: 1fr; }
  .pd-specs__item:nth-child(odd) { border-right: none; }
  .pd-features__grid { grid-template-columns: 1fr; }
  .pd-config__grid { grid-template-columns: repeat(2, 1fr); }
  .pd-config__checks { grid-template-columns: 1fr; }
  .pd-apps__grid { grid-template-columns: 1fr; }
  .pd-implements__grid { grid-template-columns: repeat(2, 1fr); }
  .pd-operator__grid { grid-template-columns: 1fr; }
  .pd-mfg__steps { grid-template-columns: 1fr; }
  .pd-service__phases { grid-template-columns: 1fr; }
  .pd-packing__steps { flex-direction: column; align-items: stretch; }
  .pd-downloads__grid { grid-template-columns: 1fr; }
  .pd-downloads__card { flex-wrap: wrap; }
  .pd-videos__grid { grid-template-columns: 1fr; }
  .pd-related__grid { grid-template-columns: 1fr; }
  .pd-cta__form-grid { grid-template-columns: 1fr; }
  .pd-cta__checks { grid-template-columns: 1fr; }
  .pd-cta__form { padding: 20px; }
  .pd-trans__specs { grid-template-columns: 1fr; }
  .pd-trans__spec:nth-child(odd) { border-right: none; }
  .pd-hydraulics__specs { grid-template-columns: 1fr; }
  .pd-hydraulics__spec:nth-child(odd) { border-right: none; }
  .pd-engine__points { grid-template-columns: 1fr; }
  .pd-overview__uses { grid-template-columns: 1fr; }
  .pd-chassis__tires { flex-wrap: wrap; justify-content: flex-start; }
  .pd-oem__options { gap: 6px; }
  .pd-oem__options span { font-size: 12px; padding: 5px 10px; }
  .pd-oem__actions { flex-direction: column; }
  .pd-implements__actions { flex-direction: column; align-items: center; }
  .pd-parts__actions { flex-direction: column; align-items: center; }
  .pd-service__caps { flex-direction: column; align-items: center; }
  .pd-spec-table__actions { flex-direction: column; }
}

@media (max-width: 479px) {
  .pd-info__title { font-size: 22px; }
  .pd-gallery__thumbs { gap: 6px; }
  .pd-gallery__thumb { width: 60px; height: 45px; }
  .pd-config__grid { grid-template-columns: 1fr; }
  .pd-implements__grid { grid-template-columns: 1fr; }
}

/* ============================================
   TRACTOR PARTS PAGE STYLES
   ============================================ */

/* --- Parts Hero --- */
.tp-hero { position: relative; height: 540px; overflow: hidden; display: flex; align-items: flex-end; }
.tp-hero__bg { position: absolute; inset: 0; }
.tp-hero__bg-img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.tp-hero__overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(17,24,32,0.85) 0%, rgba(17,24,32,0.6) 45%, rgba(17,24,32,0.15) 100%); }
.tp-hero__content { position: relative; z-index: 2; padding-bottom: 50px; max-width: 700px; }
.tp-hero__breadcrumb { display: flex; align-items: center; gap: 8px; font-size: 13px; color: rgba(255,255,255,0.6); margin-bottom: 14px; }
.tp-hero__breadcrumb a { color: rgba(255,255,255,0.6); }
.tp-hero__breadcrumb a:hover { color: var(--color-white); }
.tp-hero__breadcrumb span:last-child { color: var(--color-white); }
.tp-hero__eyebrow { display: block; font-size: 13px; font-weight: 600; letter-spacing: 2px; color: var(--color-primary-light); margin-bottom: 12px; }
.tp-hero__title { font-family: var(--font-heading); font-size: 50px; font-weight: 800; color: var(--color-white); line-height: 1.08; margin-bottom: 16px; }
.tp-hero__desc { font-size: 17px; color: rgba(255,255,255,0.8); line-height: 1.7; margin-bottom: 24px; }
.tp-hero__buttons { display: flex; gap: 16px; margin-bottom: 24px; }
.tp-hero__tags { display: flex; gap: 12px; flex-wrap: wrap; }
.tp-hero__tag { display: inline-block; padding: 6px 14px; background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.15); border-radius: var(--radius); font-size: 13px; font-weight: 500; color: rgba(255,255,255,0.8); backdrop-filter: blur(4px); }

/* --- Parts Categories --- */
.tp-cats__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.tp-cat-card { display: block; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden; transition: all var(--transition); cursor: pointer; min-width: 0; }
.tp-cat-card:hover { transform: translateY(-5px); box-shadow: 0 8px 24px rgba(0,0,0,0.06); border-color: var(--color-primary); }
.tp-cat-card__img { aspect-ratio: 3 / 2; background: var(--color-light); overflow: hidden; }
.tp-cat-card__img img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--transition); }
.tp-cat-card:hover .tp-cat-card__img img { transform: scale(1.03); }
.tp-cat-card__body { padding: 16px; position: relative; }
.tp-cat-card__body::after { content: ''; position: absolute; bottom: 0; left: 16px; right: 16px; height: 3px; background: var(--color-primary); transform: scaleX(0); transition: transform var(--transition); }
.tp-cat-card:hover .tp-cat-card__body::after { transform: scaleX(1); }
.tp-cat-card__icon { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: var(--radius); background: var(--color-light); color: var(--color-primary); margin-bottom: 10px; }
.tp-cat-card__name { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-text); margin-bottom: 6px; }
.tp-cat-card__desc { font-size: 12px; color: var(--color-text-secondary); line-height: 1.5; margin-bottom: 8px; }
.tp-cat-card__meta { display: flex; justify-content: space-between; align-items: center; }
.tp-cat-card__count { font-size: 11px; color: var(--color-metal); }
.tp-cat-card__arrow { color: var(--color-primary); transition: transform var(--transition); }
.tp-cat-card:hover .tp-cat-card__arrow { transform: translateX(4px); }

/* --- Parts Finder --- */
.tp-finder__tabs { display: flex; gap: 4px; margin-bottom: 24px; border-bottom: 2px solid var(--color-border); overflow-x: auto; }
.tp-finder__tab { padding: 14px 20px; font-size: 14px; font-weight: 600; color: var(--color-text-secondary); border-bottom: 3px solid transparent; margin-bottom: -2px; transition: all var(--transition); white-space: nowrap; }
.tp-finder__tab--active { color: var(--color-primary); border-bottom-color: var(--color-primary); }
.tp-finder__tab:hover { color: var(--color-primary); }
.tp-finder__panel { display: none; }
.tp-finder__panel--active { display: block; }
.tp-finder__pn-fields, .tp-finder__model-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }
.tp-finder__field { display: flex; flex-direction: column; }
.tp-finder__field label { font-size: 13px; font-weight: 500; color: var(--color-text); margin-bottom: 6px; }
.tp-finder__field input, .tp-finder__field select, .tp-finder__field textarea { padding: 12px 14px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 14px; font-family: var(--font-body); color: var(--color-text); }
.tp-finder__field input:focus, .tp-finder__field select:focus, .tp-finder__field textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(200,16,46,0.1); }
.tp-finder__note { font-size: 13px; color: var(--color-metal); margin-top: 10px; }
.tp-finder__pn-results { margin-top: 20px; padding: 20px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.tp-finder__pn-results h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 12px; }
.tp-finder__pn-nomatch { text-align: center; padding: 24px; }
.tp-finder__pn-nomatch p { font-size: 14px; color: var(--color-text-secondary); margin-bottom: 12px; }

/* System Grid */
.tp-finder__system-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.tp-finder__system-btn { padding: 16px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); text-align: center; font-size: 14px; font-weight: 600; color: var(--color-text); transition: all var(--transition); cursor: pointer; }
.tp-finder__system-btn:hover { border-color: var(--color-primary); color: var(--color-primary); background: var(--color-light); }

/* Photo Upload */
.tp-finder__photo-form { display: flex; flex-direction: column; gap: 16px; }
.tp-finder__photo-drop { border: 2px dashed var(--color-border); border-radius: var(--radius-lg); padding: 40px; text-align: center; cursor: pointer; transition: all var(--transition); }
.tp-finder__photo-drop:hover { border-color: var(--color-primary); background: var(--color-light); }
.tp-finder__photo-drop svg { color: var(--color-metal); margin-bottom: 12px; }
.tp-finder__photo-drop p { font-size: 14px; color: var(--color-text-secondary); margin-bottom: 6px; }
.tp-finder__photo-drop span { font-size: 12px; color: var(--color-metal); }
.tp-finder__photo-drop strong { color: var(--color-primary); cursor: pointer; }
.tp-finder__photo-preview { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-top: 12px; }
.tp-finder__photo-thumb { position: relative; border-radius: var(--radius); overflow: hidden; aspect-ratio: 1; }
.tp-finder__photo-thumb img { width: 100%; height: 100%; object-fit: cover; }
.tp-finder__photo-thumb button { position: absolute; top: 4px; right: 4px; width: 24px; height: 24px; background: rgba(0,0,0,0.6); color: white; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 14px; }
.tp-finder__photo-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.tp-finder__field--full { grid-column: 1 / -1; }
.tp-finder__photo-success { display: flex; align-items: center; gap: 10px; padding: 14px; background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: var(--radius); }
.tp-finder__photo-success svg { color: var(--color-success); flex-shrink: 0; }
.tp-finder__photo-success p { font-size: 13px; color: #166534; font-weight: 500; }

/* --- Parts Listing --- */
.tp-listing__layout { display: grid; grid-template-columns: 260px 1fr; gap: 32px; align-items: flex-start; }
.tp-listing__main { min-width: 0; overflow: hidden; }
.tp-filter { position: sticky; top: 100px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 20px; }
.tp-filter__header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; padding-bottom: 12px; border-bottom: 1px solid var(--color-border); }
.tp-filter__title { font-family: var(--font-body); font-size: 16px; font-weight: 600; }
.tp-filter__clear { font-size: 13px; font-weight: 500; color: var(--color-primary); cursor: pointer; }
.tp-filter__group { margin-bottom: 18px; }
.tp-filter__group-title { font-family: var(--font-body); font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; color: var(--color-text); margin-bottom: 8px; }
.tp-filter__check { display: flex; align-items: center; gap: 8px; padding: 5px 0; cursor: pointer; font-size: 13px; color: var(--color-text-secondary); }
.tp-filter__check:hover { color: var(--color-text); }
.tp-filter__check input { width: 15px; height: 15px; accent-color: var(--color-primary); cursor: pointer; }

/* Toolbar */
.tp-listing__toolbar { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
.tp-listing__filter-btn { display: none; align-items: center; gap: 6px; padding: 10px 16px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 14px; font-weight: 500; color: var(--color-text); background: var(--color-white); }
.tp-listing__search { flex: 1; position: relative; min-width: 200px; }
.tp-listing__search input { width: 100%; padding: 10px 14px 10px 38px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 14px; font-family: var(--font-body); }
.tp-listing__search input:focus { outline: none; border-color: var(--color-primary); }
.tp-listing__search svg { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--color-metal); }
.tp-listing__active-filters { display: flex; gap: 6px; flex-wrap: wrap; width: 100%; }
.tp-listing__active-tag { display: inline-flex; align-items: center; gap: 5px; padding: 5px 10px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 12px; color: var(--color-text-secondary); }
.tp-listing__active-tag button { color: var(--color-metal); font-size: 14px; line-height: 1; }
.tp-listing__active-tag button:hover { color: var(--color-primary); }
.tp-listing__controls { display: flex; align-items: center; gap: 10px; }
.tp-listing__sort select, .tp-listing__per-page select { padding: 8px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-family: var(--font-body); color: var(--color-text); background: var(--color-white); }
.tp-listing__view { display: flex; border: 1px solid var(--color-border); border-radius: var(--radius); overflow: hidden; }
.tp-listing__view-btn { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; color: var(--color-metal); background: var(--color-white); transition: all var(--transition); }
.tp-listing__view-btn--active { color: var(--color-primary); background: var(--color-light); }
.tp-listing__view-btn:hover { color: var(--color-primary); }
.tp-listing__count { font-size: 14px; color: var(--color-text-secondary); margin-bottom: 14px; }

/* Parts Grid */
.tp-listing__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; min-width: 0; }
.tp-listing__grid--list { grid-template-columns: 1fr; }
.tp-listing__grid--list .tp-card { display: grid; grid-template-columns: 200px 1fr; gap: 20px; }

/* Part Card */
.tp-card { background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden; transition: all var(--transition); position: relative; min-width: 0; }
.tp-card:hover { transform: translateY(-5px); box-shadow: 0 8px 24px rgba(0,0,0,0.07); border-bottom-color: var(--color-primary); }
.tp-card__img { aspect-ratio: 3 / 2; background: var(--color-light); overflow: hidden; position: relative; }
.tp-card__img img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--transition); }
.tp-card:hover .tp-card__img img { transform: scale(1.03); }
.tp-card__badge { position: absolute; top: 8px; left: 8px; padding: 4px 10px; font-size: 11px; font-weight: 600; background: var(--color-dark); color: var(--color-white); border-radius: 4px; text-transform: uppercase; }
.tp-card__qv { position: absolute; bottom: 8px; right: 8px; padding: 6px 12px; background: rgba(0,0,0,0.5); backdrop-filter: blur(6px); border-radius: var(--radius); color: var(--color-white); font-size: 11px; font-weight: 600; opacity: 0; transition: opacity var(--transition); cursor: pointer; }
.tp-card:hover .tp-card__qv { opacity: 1; }
.tp-card__body { padding: 16px; }
.tp-card__category { font-size: 11px; font-weight: 600; color: var(--color-primary); text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 6px; }
.tp-card__name { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-text); margin-bottom: 8px; }
.tp-card__specs { font-size: 12px; color: var(--color-text-secondary); margin-bottom: 10px; line-height: 1.6; }
.tp-card__specs strong { color: var(--color-text); font-weight: 500; }
.tp-card__actions { display: flex; gap: 6px; flex-wrap: wrap; }
.tp-card__actions .btn { flex: 1; min-width: 0; }

/* Empty */
.tp-listing__empty { text-align: center; padding: 48px 20px; }
.tp-listing__empty svg { color: var(--color-metal); margin-bottom: 16px; }
.tp-listing__empty h3 { font-family: var(--font-body); font-size: 18px; font-weight: 600; color: var(--color-text); margin-bottom: 8px; }
.tp-listing__empty p { font-size: 14px; color: var(--color-text-secondary); margin-bottom: 16px; max-width: 460px; margin-left: auto; margin-right: auto; }
.tp-listing__empty-actions { display: flex; gap: 12px; justify-content: center; }

/* Pagination */
.tp-listing__pagination { display: flex; justify-content: center; gap: 6px; margin-top: 24px; }
.tp-listing__pagination button { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 14px; font-weight: 500; color: var(--color-text); background: var(--color-white); transition: all var(--transition); }
.tp-listing__pagination button:hover { border-color: var(--color-primary); color: var(--color-primary); }
.tp-listing__pagination button.active { background: var(--color-primary); border-color: var(--color-primary); color: var(--color-white); }

/* --- Photo Identification --- */
.tp-photo { background: var(--color-dark); }
.tp-photo__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.tp-photo__image { border-radius: var(--radius-lg); overflow: hidden; }
.tp-photo__image img { width: 100%; object-fit: cover; }
.tp-photo__content .section-header__title { color: var(--color-white); }
.tp-photo__content > p { font-size: 15px; color: rgba(255,255,255,0.7); line-height: 1.7; margin-bottom: 20px; }
.tp-photo__subtitle { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-white); margin-bottom: 12px; }
.tp-photo__tips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.tp-photo__tips span { padding: 6px 12px; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: var(--radius); font-size: 12px; color: rgba(255,255,255,0.75); }
.tp-photo__advice { display: flex; gap: 10px; padding: 14px; background: rgba(255,255,255,0.06); border-radius: var(--radius); border-left: 3px solid var(--color-primary); margin-bottom: 20px; }
.tp-photo__advice svg { flex-shrink: 0; color: var(--color-primary); margin-top: 2px; }
.tp-photo__advice p { font-size: 13px; color: rgba(255,255,255,0.6); margin: 0; }

/* --- Maintenance Kits --- */
.tp-kits__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-bottom: 20px; }
.tp-kits__card { padding: 22px; background: var(--color-light); border-radius: var(--radius-lg); border: 1px solid var(--color-border); transition: all var(--transition); }
.tp-kits__card:hover { border-color: var(--color-primary); background: var(--color-white); }
.tp-kits__icon { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: var(--radius); background: var(--color-white); color: var(--color-primary); margin-bottom: 12px; border: 1px solid var(--color-border); }
.tp-kits__card:hover .tp-kits__icon { background: var(--color-primary); color: var(--color-white); border-color: var(--color-primary); }
.tp-kits__card h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 8px; }
.tp-kits__card p { font-size: 13px; color: var(--color-text-secondary); margin-bottom: 6px; }
.tp-kits__card ul { list-style: none; margin-bottom: 8px; }
.tp-kits__card li { font-size: 13px; color: var(--color-text-secondary); padding: 3px 0 3px 14px; position: relative; }
.tp-kits__card li::before { content: ''; position: absolute; left: 0; top: 50%; width: 5px; height: 5px; background: var(--color-primary); border-radius: 50%; transform: translateY(-50%); }
.tp-kits__note { font-size: 11px; color: var(--color-metal); display: block; margin-bottom: 12px; }
.tp-kits__footer { text-align: center; font-size: 14px; color: var(--color-text-secondary); margin-bottom: 16px; }
.tp-kits__action { text-align: center; }

/* --- Dealer Support --- */
.tp-dealer__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 32px; }
.tp-dealer__card { padding: 18px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.tp-dealer__card span { font-family: var(--font-heading); font-size: 20px; font-weight: 800; color: var(--color-primary); opacity: 0.3; display: block; margin-bottom: 6px; }
.tp-dealer__card h3 { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-text); }
.tp-dealer__flow-title { font-family: var(--font-body); font-size: 18px; font-weight: 600; color: var(--color-text); text-align: center; margin-bottom: 20px; }
.tp-dealer__flow { display: flex; gap: 12px; margin-bottom: 24px; }
.tp-dealer__flow-step { flex: 1; padding: 18px; background: var(--color-white); border-radius: var(--radius-lg); border-top: 3px solid var(--color-primary); text-align: center; }
.tp-dealer__flow-step span { font-family: var(--font-heading); font-size: 18px; font-weight: 700; color: var(--color-primary); opacity: 0.3; display: block; margin-bottom: 6px; }
.tp-dealer__flow-step h4 { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.tp-dealer__flow-step p { font-size: 12px; color: var(--color-text-secondary); }
.tp-dealer__actions { display: flex; gap: 12px; justify-content: center; }

/* --- Catalogs --- */
.tp-catalog { background: var(--color-dark); }
.tp-catalog__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 16px; }
.tp-catalog__card { display: flex; align-items: center; gap: 14px; padding: 18px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius-lg); }
.tp-catalog__card svg { color: var(--color-primary); flex-shrink: 0; }
.tp-catalog__card h3 { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-white); flex: 1; }
.tp-catalog__card span { font-size: 12px; color: rgba(255,255,255,0.5); }
.tp-catalog__card .btn { flex-shrink: 0; }
.tp-catalog__note { text-align: center; font-size: 13px; color: rgba(255,255,255,0.5); }

/* --- Compatibility --- */
.tp-compat__steps { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; margin-bottom: 24px; }
.tp-compat__step { padding: 20px; background: var(--color-light); border-radius: var(--radius-lg); border-top: 3px solid var(--color-primary); text-align: center; }
.tp-compat__step span { font-family: var(--font-heading); font-size: 20px; font-weight: 800; color: var(--color-primary); opacity: 0.3; display: block; margin-bottom: 8px; }
.tp-compat__step h3 { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-text); margin-bottom: 6px; }
.tp-compat__step p { font-size: 12px; color: var(--color-text-secondary); }
.tp-compat__warning { display: flex; gap: 10px; padding: 16px; background: #fff8e1; border: 1px solid #ffe082; border-radius: var(--radius); margin-bottom: 20px; }
.tp-compat__warning svg { color: #f57f17; flex-shrink: 0; margin-top: 2px; }
.tp-compat__warning p { font-size: 13px; color: #795548; margin: 0; }
.tp-compat__action { text-align: center; }

/* --- Quality --- */
.tp-quality { background: var(--color-light); }
.tp-quality__inner { display: grid; grid-template-columns: 1fr 1.1fr; gap: 48px; align-items: center; }
.tp-quality__inner > * { min-width: 0; }
.tp-quality__image { border-radius: var(--radius-lg); overflow: hidden; }
.tp-quality__image img { width: 100%; object-fit: cover; }
.tp-quality__list { list-style: none; margin-bottom: 14px; }
.tp-quality__list li { display: flex; align-items: center; gap: 8px; padding: 8px 0; border-bottom: 1px solid var(--color-border); font-size: 14px; color: var(--color-text); }
.tp-quality__list svg { color: var(--color-primary); flex-shrink: 0; }
.tp-quality__note { font-size: 13px; color: var(--color-metal); }

/* --- Packing --- */
.tp-packing__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-bottom: 24px; }
.tp-packing__methods, .tp-packing__process { padding: 20px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.tp-packing__methods h3, .tp-packing__process h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 12px; }
.tp-packing__methods li { font-size: 14px; color: var(--color-text-secondary); padding: 6px 0; border-bottom: 1px solid var(--color-light); padding-left: 14px; position: relative; }
.tp-packing__methods li::before { content: ''; position: absolute; left: 0; top: 50%; width: 5px; height: 5px; background: var(--color-primary); border-radius: 50%; transform: translateY(-50%); }
.tp-packing__steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.tp-packing__steps > div { padding: 12px; background: var(--color-light); border-radius: var(--radius); text-align: center; }
.tp-packing__steps span { font-family: var(--font-heading); font-size: 16px; font-weight: 700; color: var(--color-primary); display: block; margin-bottom: 4px; }
.tp-packing__steps h4 { font-family: var(--font-body); font-size: 12px; font-weight: 600; color: var(--color-text); }
.tp-packing__labels { margin-bottom: 16px; }
.tp-packing__labels h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 12px; text-align: center; }
.tp-packing__tags { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.tp-packing__tags span { padding: 7px 14px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; color: var(--color-text-secondary); }
.tp-packing__note { text-align: center; font-size: 13px; color: var(--color-metal); margin-bottom: 16px; }
.tp-packing__action { text-align: center; }

/* --- Why YUFENG --- */
.tp-why { background: var(--color-dark); }
.tp-why__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.tp-why__card { padding: 22px 18px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius-lg); transition: all var(--transition); }
.tp-why__card:hover { border-color: var(--color-primary); }
.tp-why__icon { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: var(--radius); background: rgba(255,255,255,0.06); color: var(--color-primary); margin-bottom: 12px; }
.tp-why__card h3 { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-white); margin-bottom: 6px; }
.tp-why__card p { font-size: 13px; color: rgba(255,255,255,0.6); line-height: 1.5; }

/* --- Parts FAQ --- */
.tp-faq .faq__list { max-width: 800px; margin: 0 auto 24px; }

/* --- Bottom CTA --- */
.tp-cta { position: relative; overflow: hidden; padding: 80px 0; }
.tp-cta__bg { position: absolute; inset: 0; }
.tp-cta__bg img { width: 100%; height: 100%; object-fit: cover; }
.tp-cta__overlay { position: absolute; inset: 0; background: rgba(17,24,32,0.85); }
.tp-cta__inner { position: relative; z-index: 2; display: grid; grid-template-columns: 1fr 1.1fr; gap: 48px; align-items: flex-start; }
.tp-cta__text { font-size: 16px; color: rgba(255,255,255,0.75); line-height: 1.7; margin-bottom: 20px; }
.tp-cta__tags { display: flex; flex-direction: column; gap: 10px; }
.tp-cta__tags span { display: flex; align-items: center; gap: 10px; padding: 10px 16px; background: rgba(255,255,255,0.06); border-radius: var(--radius); font-size: 13px; color: rgba(255,255,255,0.85); border: 1px solid rgba(255,255,255,0.1); }
.tp-cta__tags span::before { content: ''; width: 7px; height: 7px; background: var(--color-primary); border-radius: 50%; flex-shrink: 0; }
.tp-cta__form { background: var(--color-white); padding: 32px; border-radius: var(--radius-lg); }
.tp-cta__form-title { font-family: var(--font-heading); font-size: 24px; font-weight: 700; color: var(--color-text); margin-bottom: 20px; }
.tp-cta__honeypot { position: absolute; left: -9999px; height: 0; opacity: 0; }
.tp-cta__form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px; }
.tp-cta__field { display: flex; flex-direction: column; }
.tp-cta__field label { font-size: 12px; font-weight: 500; color: var(--color-text); margin-bottom: 4px; }
.tp-cta__field input, .tp-cta__field select, .tp-cta__field textarea { padding: 10px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-family: var(--font-body); color: var(--color-text); background: var(--color-white); }
.tp-cta__field input:focus, .tp-cta__field select:focus, .tp-cta__field textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 2px rgba(200,16,46,0.1); }
.tp-cta__field input.error { border-color: var(--color-primary); }
.tp-cta__error { font-size: 11px; color: var(--color-primary); margin-top: 2px; min-height: 14px; }
.tp-cta__field--full { grid-column: 1 / -1; margin-bottom: 12px; }
.tp-cta__checkbox { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; color: var(--color-text-secondary); cursor: pointer; line-height: 1.4; }
.tp-cta__checkbox input { margin-top: 2px; width: 14px; height: 14px; accent-color: var(--color-primary); }
.tp-cta__submit { width: 100%; }
.tp-cta__success { display: flex; align-items: center; gap: 10px; padding: 14px; background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: var(--radius); margin-top: 12px; }
.tp-cta__success svg { color: var(--color-success); flex-shrink: 0; }
.tp-cta__success p { font-size: 13px; color: #166534; font-weight: 500; }

/* --- Inquiry Drawer --- */
.tp-inquiry-drawer { position: fixed; inset: 0; z-index: 1000; }
.tp-inquiry-drawer[hidden] { display: none; }
.tp-inquiry-drawer__overlay { position: absolute; inset: 0; background: rgba(0,0,0,0.5); }
.tp-inquiry-drawer__panel { position: absolute; top: 0; right: 0; bottom: 0; width: 380px; max-width: 90vw; background: var(--color-white); display: flex; flex-direction: column; transform: translateX(100%); transition: transform 300ms ease; }
.tp-inquiry-drawer.open .tp-inquiry-drawer__panel { transform: translateX(0); }
.tp-inquiry-drawer__header { display: flex; justify-content: space-between; align-items: center; padding: 20px 24px; border-bottom: 1px solid var(--color-border); }
.tp-inquiry-drawer__title { font-family: var(--font-heading); font-size: 20px; font-weight: 700; }
.tp-inquiry-drawer__close { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; }
.tp-inquiry-drawer__body { flex: 1; overflow-y: auto; padding: 16px 24px; }
.tp-inquiry-drawer__footer { padding: 16px 24px; border-top: 1px solid var(--color-border); display: flex; flex-direction: column; gap: 10px; }
.tp-inquiry-item { display: flex; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--color-light); }
.tp-inquiry-item__img { width: 72px; aspect-ratio: 3 / 2; background: var(--color-light); border-radius: var(--radius); overflow: hidden; flex-shrink: 0; }
.tp-inquiry-item__img img { width: 100%; height: 100%; object-fit: cover; }
.tp-inquiry-item__info { flex: 1; min-width: 0; }
.tp-inquiry-item__name { font-size: 13px; font-weight: 600; color: var(--color-text); margin-bottom: 2px; }
.tp-inquiry-item__meta { font-size: 11px; color: var(--color-metal); }
.tp-inquiry-item__remove { color: var(--color-metal); font-size: 18px; flex-shrink: 0; cursor: pointer; }
.tp-inquiry-item__remove:hover { color: var(--color-primary); }
.tp-inquiry-empty { text-align: center; padding: 40px 20px; color: var(--color-metal); font-size: 14px; }

/* --- Inquiry Bar --- */
.tp-inquiry-bar { position: fixed; bottom: 0; left: 0; right: 0; z-index: 85; background: var(--color-dark); box-shadow: 0 -4px 16px rgba(0,0,0,0.2); padding: 12px 0; }
.tp-inquiry-bar[hidden] { display: none; }
.tp-inquiry-bar__inner { display: flex; align-items: center; justify-content: space-between; }
.tp-inquiry-bar__inner p { font-size: 14px; color: var(--color-white); }
.tp-inquiry-bar__inner strong { color: var(--color-primary); }
.tp-inquiry-bar__actions { display: flex; gap: 10px; }

/* ============================
   TRACTOR PARTS RESPONSIVE
   ============================ */
@media (max-width: 1199px) {
  .tp-hero { height: 480px; }
  .tp-hero__title { font-size: 42px; }
  .tp-cats__grid { grid-template-columns: repeat(3, 1fr); }
  .tp-listing__layout { grid-template-columns: 240px 1fr; gap: 24px; }
  .tp-listing__grid { grid-template-columns: repeat(2, 1fr); }
  .tp-finder__system-grid { grid-template-columns: repeat(3, 1fr); }
  .tp-kits__grid { grid-template-columns: repeat(2, 1fr); }
  .tp-dealer__grid { grid-template-columns: repeat(3, 1fr); }
  .tp-compat__steps { grid-template-columns: repeat(3, 1fr); }
  .tp-why__grid { grid-template-columns: repeat(3, 1fr); }
  .tp-catalog__grid { grid-template-columns: repeat(2, 1fr); }
  .tp-photo__inner { gap: 40px; }
  .tp-quality__inner { gap: 40px; }
  .tp-cta__inner { gap: 40px; }
}

@media (max-width: 991px) {
  .tp-hero { height: 440px; }
  .tp-hero__title { font-size: 38px; }
  .tp-listing__layout { grid-template-columns: 1fr; }
  .tp-filter { display: none; }
  .tp-listing__filter-btn { display: flex; }
  .tp-photo__inner { grid-template-columns: 1fr; }
  .tp-quality__inner { grid-template-columns: 1fr; }
  .tp-cta__inner { grid-template-columns: 1fr; }
  .tp-compat__steps { grid-template-columns: repeat(3, 1fr); }
  .tp-dealer__grid { grid-template-columns: repeat(2, 1fr); }
  .tp-dealer__flow { flex-wrap: wrap; }
  .tp-dealer__flow-step { flex: 0 0 calc(33% - 8px); }
  .tp-packing__grid { grid-template-columns: 1fr; }
}

@media (max-width: 767px) {
  .tp-hero { height: 420px; }
  .tp-hero__title { font-size: 32px; }
  .tp-hero__desc { font-size: 15px; }
  .tp-hero__buttons { flex-direction: column; gap: 12px; }
  .tp-hero__buttons .btn { width: 100%; }
  .tp-cats__grid { grid-template-columns: repeat(2, 1fr); }
  .tp-listing__grid { grid-template-columns: 1fr; }
  .tp-listing__toolbar { flex-direction: column; align-items: stretch; }
  .tp-listing__controls { flex-wrap: wrap; }
  .tp-finder__tabs { gap: 0; }
  .tp-finder__tab { padding: 12px 14px; font-size: 13px; }
  .tp-finder__pn-fields, .tp-finder__model-fields { grid-template-columns: 1fr; }
  .tp-finder__system-grid { grid-template-columns: repeat(2, 1fr); }
  .tp-finder__photo-fields { grid-template-columns: 1fr; }
  .tp-finder__photo-preview { grid-template-columns: repeat(3, 1fr); }
  .tp-kits__grid { grid-template-columns: 1fr; }
  .tp-dealer__grid { grid-template-columns: 1fr; }
  .tp-dealer__flow-step { flex: 0 0 100%; }
  .tp-dealer__actions { flex-direction: column; align-items: center; }
  .tp-catalog__grid { grid-template-columns: 1fr; }
  .tp-catalog__card { flex-wrap: wrap; }
  .tp-catalog__card .btn { width: 100%; }
  .tp-compat__steps { grid-template-columns: 1fr; }
  .tp-why__grid { grid-template-columns: 1fr; }
  .tp-packing__steps { grid-template-columns: repeat(2, 1fr); }
  .tp-cta__form-grid { grid-template-columns: 1fr; }
  .tp-cta__form { padding: 20px; }
  .tp-cta__tags { gap: 8px; }
  .tp-inquiry-bar__inner { flex-direction: column; gap: 8px; text-align: center; }
  .tp-inquiry-drawer__panel { width: 100%; max-width: 100%; }
  .tp-listing__grid--list .tp-card { grid-template-columns: 1fr; }
  .tp-why__grid { grid-template-columns: 1fr; }
}

@media (max-width: 479px) {
  .tp-hero { height: 400px; }
  .tp-hero__title { font-size: 28px; }
  .tp-cats__grid { grid-template-columns: 1fr; }
  .tp-finder__system-grid { grid-template-columns: 1fr; }
  .tp-finder__photo-preview { grid-template-columns: repeat(2, 1fr); }
}

/* ============================================
   TRACTOR PARTS DETAIL PAGE STYLES
   ============================================ */

/* --- Part Hero (reuses pd-hero from tractor-detail) --- */
.pd-info__subtitle { font-size: 14px; color: var(--color-text-secondary); margin-bottom: 8px; font-style: italic; }
.pd-info__ref { font-size: 13px; color: var(--color-text-secondary); margin-bottom: 12px; }
.pd-info__ref strong { color: var(--color-text); }
.pd-compat-warning { display: flex; gap: 10px; padding: 12px 14px; background: #fff8e1; border: 1px solid #ffe082; border-radius: var(--radius); margin-bottom: 16px; }
.pd-compat-warning svg { color: #f57f17; flex-shrink: 0; margin-top: 2px; }
.pd-compat-warning p { font-size: 12px; color: #795548; margin: 0; line-height: 1.5; }

/* --- Quick Compatibility --- */
.pd-quick-compat { background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 20px; margin-top: 16px; }
.pd-quick-compat__title { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 14px; }
.pd-quick-compat__form { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.pd-quick-compat__field { display: flex; flex-direction: column; }
.pd-quick-compat__field label { font-size: 12px; font-weight: 500; color: var(--color-text); margin-bottom: 4px; }
.pd-quick-compat__field input { padding: 10px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-family: var(--font-body); }
.pd-quick-compat__field input:focus { outline: none; border-color: var(--color-primary); }
.pd-quick-compat__btn { grid-column: 1 / -1; margin-top: 4px; }
.pd-quick-compat__note { font-size: 12px; color: var(--color-metal); margin-top: 10px; }

/* --- Product Details --- */
.pd-details__list { display: flex; flex-direction: column; gap: 48px; }
.pd-details__item { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; }
.pd-details__item--reverse { direction: rtl; }
.pd-details__item--reverse > * { direction: ltr; }
.pd-details__img { border-radius: var(--radius-lg); overflow: hidden; }
.pd-details__img img { width: 100%; object-fit: cover; }
.pd-details__text h3 { font-family: var(--font-body); font-size: 20px; font-weight: 600; color: var(--color-text); margin-bottom: 10px; }
.pd-details__text p { font-size: 15px; color: var(--color-text-secondary); line-height: 1.7; }

/* --- Spec Table --- */
.pd-spec-table__actions { display: flex; gap: 10px; margin-bottom: 24px; }
.pd-spec-table__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-bottom: 20px; }
.pd-spec-group { background: var(--color-white); border-radius: var(--radius-lg); border: 1px solid var(--color-border); overflow: hidden; }
.pd-spec-group__title { padding: 12px 18px; background: var(--color-dark); color: var(--color-white); font-family: var(--font-body); font-size: 14px; font-weight: 600; }
.pd-spec-group__row { display: flex; padding: 10px 18px; border-bottom: 1px solid var(--color-light); font-size: 13px; }
.pd-spec-group__row:last-child { border-bottom: none; }
.pd-spec-group__label { width: 45%; color: var(--color-text-secondary); font-weight: 500; }
.pd-spec-group__value { width: 55%; color: var(--color-text); }
.pd-spec-table__disclaimer { font-size: 13px; color: var(--color-metal); text-align: center; padding: 16px; background: var(--color-white); border-radius: var(--radius); border: 1px solid var(--color-border); }

/* --- Compatible Models --- */
.pd-models__table-wrap { overflow-x: auto; margin-bottom: 24px; }
.pd-models__table { width: 100%; border-collapse: collapse; min-width: 600px; }
.pd-models__table th { padding: 12px 16px; background: var(--color-dark); color: var(--color-white); font-size: 13px; font-weight: 600; text-align: left; }
.pd-models__table td { padding: 12px 16px; border-bottom: 1px solid var(--color-border); font-size: 13px; color: var(--color-text-secondary); }
.pd-models__action { text-align: center; }

/* --- System & Installation --- */
.pd-system { background: var(--color-light); }
.pd-system__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.pd-system__inner > * { min-width: 0; }
.pd-system__image { border-radius: var(--radius-lg); overflow: hidden; }
.pd-system__image img { width: 100%; object-fit: cover; }
.pd-system__info { margin-bottom: 16px; }
.pd-system__item { display: flex; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid var(--color-border); font-size: 14px; }
.pd-system__item span { color: var(--color-text-secondary); }
.pd-system__item strong { color: var(--color-text); }
.pd-system__note { font-size: 13px; color: var(--color-metal); }

/* --- Part Number ID --- */
.pd-pn { background: var(--color-dark); }
.pd-pn__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.pd-pn__inner > * { min-width: 0; }
.pd-pn__content .section-header__title { color: var(--color-white); }
.pd-pn__locations { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.pd-pn__locations span { padding: 6px 12px; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: var(--radius); font-size: 12px; color: rgba(255,255,255,0.75); }
.pd-pn__subtitle { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-white); margin-bottom: 10px; }
.pd-pn__tips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.pd-pn__tips span { padding: 6px 12px; background: rgba(255,255,255,0.06); border-radius: var(--radius); font-size: 12px; color: rgba(255,255,255,0.6); }
.pd-pn__image { border-radius: var(--radius-lg); overflow: hidden; }
.pd-pn__image img { width: 100%; object-fit: cover; }

/* --- Dimension Check --- */
.pd-dimension__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 20px; }
.pd-dimension__item { padding: 16px; background: var(--color-light); border-radius: var(--radius-lg); text-align: center; border: 1px solid var(--color-border); }
.pd-dimension__item span { display: block; font-size: 12px; color: var(--color-metal); margin-bottom: 4px; }
.pd-dimension__item strong { font-size: 14px; color: var(--color-text); }
.pd-dimension__note { text-align: center; font-size: 13px; color: var(--color-text-secondary); margin-bottom: 16px; }
.pd-dimension__action { text-align: center; }

/* --- Compatibility Process --- */
.pd-process__steps { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; margin-bottom: 24px; }
.pd-process__step { padding: 18px 12px; background: var(--color-white); border-radius: var(--radius-lg); border-top: 3px solid var(--color-primary); text-align: center; }
.pd-process__step span { font-family: var(--font-heading); font-size: 18px; font-weight: 800; color: var(--color-primary); opacity: 0.3; display: block; margin-bottom: 6px; }
.pd-process__step h3 { font-family: var(--font-body); font-size: 13px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.pd-process__step p { font-size: 12px; color: var(--color-text-secondary); }
.pd-process__warning { display: flex; gap: 10px; padding: 14px; background: #fff8e1; border: 1px solid #ffe082; border-radius: var(--radius); }
.pd-process__warning svg { color: #f57f17; flex-shrink: 0; margin-top: 2px; }
.pd-process__warning p { font-size: 13px; color: #795548; margin: 0; }

/* --- Photo Identification --- */
.pd-photo { background: var(--color-dark); }
.pd-photo__inner { display: grid; grid-template-columns: 1fr 1.2fr; gap: 48px; align-items: flex-start; }
.pd-photo__inner > * { min-width: 0; }
.pd-photo__image { border-radius: var(--radius-lg); overflow: hidden; }
.pd-photo__image img { width: 100%; object-fit: cover; }
.pd-photo__content .section-header__title { color: var(--color-white); }
.pd-photo__form { display: flex; flex-direction: column; gap: 14px; }
.pd-photo__upload { margin-bottom: 8px; }
.pd-photo__drop { border: 2px dashed rgba(255,255,255,0.2); border-radius: var(--radius-lg); padding: 30px; text-align: center; cursor: pointer; transition: all var(--transition); }
.pd-photo__drop:hover { border-color: var(--color-primary); }
.pd-photo__drop svg { color: rgba(255,255,255,0.5); margin-bottom: 10px; }
.pd-photo__drop p { font-size: 13px; color: rgba(255,255,255,0.7); margin-bottom: 4px; }
.pd-photo__drop span { font-size: 11px; color: rgba(255,255,255,0.4); }
.pd-photo__drop strong { color: var(--color-primary-light); }
.pd-photo__preview { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-top: 10px; }
.pd-photo__thumb { position: relative; border-radius: var(--radius); overflow: hidden; aspect-ratio: 1; }
.pd-photo__thumb img { width: 100%; height: 100%; object-fit: cover; }
.pd-photo__thumb button { position: absolute; top: 4px; right: 4px; width: 22px; height: 22px; background: rgba(0,0,0,0.6); color: white; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 12px; }
.pd-photo__fields { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.pd-photo__field { display: flex; flex-direction: column; }
.pd-photo__field label { font-size: 12px; font-weight: 500; color: rgba(255,255,255,0.8); margin-bottom: 4px; }
.pd-photo__field input, .pd-photo__field textarea { padding: 10px 12px; border: 1px solid rgba(255,255,255,0.15); border-radius: var(--radius); font-size: 13px; font-family: var(--font-body); color: var(--color-white); background: rgba(255,255,255,0.06); }
.pd-photo__field input:focus, .pd-photo__field textarea:focus { outline: none; border-color: var(--color-primary); }
.pd-photo__field--full { grid-column: 1 / -1; }
.pd-photo__success { display: flex; align-items: center; gap: 10px; padding: 12px; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.15); border-radius: var(--radius); }
.pd-photo__success svg { color: var(--color-success); flex-shrink: 0; }
.pd-photo__success p { font-size: 13px; color: rgba(255,255,255,0.8); margin: 0; }

/* --- Related Parts --- */
.pd-related__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-bottom: 24px; }
.pd-related__card { background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden; transition: all var(--transition); }
.pd-related__card:hover { transform: translateY(-4px); box-shadow: 0 6px 20px rgba(0,0,0,0.06); border-color: var(--color-primary); }
.pd-related__card-img { aspect-ratio: 3 / 2; background: var(--color-light); overflow: hidden; }
.pd-related__card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--transition); }
.pd-related__card:hover .pd-related__card-img img { transform: scale(1.03); }
.pd-related__card-body { padding: 14px; }
.pd-related__card-cat { font-size: 11px; font-weight: 600; color: var(--color-primary); text-transform: uppercase; margin-bottom: 4px; }
.pd-related__card-name { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-text); margin-bottom: 6px; }
.pd-related__card-pn { font-size: 12px; color: var(--color-metal); margin-bottom: 10px; }
.pd-related__card-actions { display: flex; gap: 6px; }
.pd-related__card-actions .btn { flex: 1; font-size: 11px; padding: 7px 10px; }
.pd-related__action { text-align: center; }

/* --- Maintenance Kit --- */
.pd-kit__content { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
.pd-kit__items h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 12px; }
.pd-kit__items label { display: flex; align-items: center; gap: 8px; padding: 8px 0; border-bottom: 1px solid var(--color-border); font-size: 14px; color: var(--color-text-secondary); cursor: pointer; }
.pd-kit__items input { width: 16px; height: 16px; accent-color: var(--color-primary); }
.pd-kit__field { margin-bottom: 14px; }
.pd-kit__field label { display: block; font-size: 13px; font-weight: 500; color: var(--color-text); margin-bottom: 6px; }
.pd-kit__field select { width: 100%; padding: 10px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 14px; font-family: var(--font-body); }
.pd-kit__note { font-size: 12px; color: var(--color-metal); margin-top: 10px; }

/* --- Installation --- */
.pd-install__steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 20px; }
.pd-install__step { padding: 16px; background: var(--color-light); border-radius: var(--radius-lg); text-align: center; border-top: 3px solid var(--color-primary); }
.pd-install__step span { font-family: var(--font-heading); font-size: 18px; font-weight: 700; color: var(--color-primary); opacity: 0.3; display: block; margin-bottom: 6px; }
.pd-install__step p { font-size: 13px; color: var(--color-text-secondary); }
.pd-install__warning { display: flex; gap: 10px; padding: 14px; background: #e3f2fd; border: 1px solid #90caf9; border-radius: var(--radius); margin-bottom: 16px; }
.pd-install__warning svg { color: #1565c0; flex-shrink: 0; margin-top: 2px; }
.pd-install__warning p { font-size: 13px; color: #1565c0; margin: 0; }
.pd-install__action { text-align: center; }

/* --- Quality --- */
.pd-quality { background: var(--color-dark); }
.pd-quality__inner { display: grid; grid-template-columns: 1fr 1.1fr; gap: 48px; align-items: center; }
.pd-quality__inner > * { min-width: 0; }
.pd-quality__image { border-radius: var(--radius-lg); overflow: hidden; }
.pd-quality__image img { width: 100%; object-fit: cover; }
.pd-quality__content .section-header__title { color: var(--color-white); }
.pd-quality__list { list-style: none; margin-bottom: 14px; }
.pd-quality__list li { display: flex; align-items: center; gap: 8px; padding: 7px 0; border-bottom: 1px solid rgba(255,255,255,0.08); font-size: 14px; color: rgba(255,255,255,0.85); }
.pd-quality__list svg { color: var(--color-primary); flex-shrink: 0; }
.pd-quality__note { font-size: 13px; color: rgba(255,255,255,0.5); }

/* --- Packing --- */
.pd-packing__types { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-bottom: 16px; }
.pd-packing__type { padding: 20px; background: var(--color-light); border-radius: var(--radius-lg); border: 1px solid var(--color-border); }
.pd-packing__type h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 12px; }
.pd-packing__type li { font-size: 14px; color: var(--color-text-secondary); padding: 6px 0; border-bottom: 1px solid var(--color-border); padding-left: 14px; position: relative; }
.pd-packing__type li::before { content: ''; position: absolute; left: 0; top: 50%; width: 5px; height: 5px; background: var(--color-primary); border-radius: 50%; transform: translateY(-50%); }
.pd-packing__note { text-align: center; font-size: 13px; color: var(--color-metal); margin-bottom: 16px; }
.pd-packing__action { text-align: center; }

/* --- Dealer --- */
.pd-dealer { background: var(--color-light); }
.pd-dealer__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 24px; }
.pd-dealer__card { padding: 16px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); text-align: center; }
.pd-dealer__card h3 { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-text); }
.pd-dealer__actions { display: flex; gap: 12px; justify-content: center; }

/* --- Technical Documents --- */
.pd-docs { background: var(--color-dark); }
.pd-docs__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 16px; }
.pd-docs__card { display: flex; align-items: center; gap: 14px; padding: 16px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius-lg); transition: all var(--transition); }
.pd-docs__card:hover { border-color: var(--color-primary); }
.pd-docs__card svg { color: var(--color-primary); flex-shrink: 0; }
.pd-docs__card h3 { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-white); }
.pd-docs__note { text-align: center; font-size: 13px; color: rgba(255,255,255,0.5); }

/* --- Parts Detail FAQ --- */
.pd-faq .faq__list { max-width: 800px; margin: 0 auto 24px; }

/* --- CTA Form (reuses pd-cta from tractor-detail) --- */
.pd-cta__form-title { font-family: var(--font-heading); font-size: 24px; font-weight: 700; color: var(--color-text); margin-bottom: 20px; }

/* ============================
   PARTS DETAIL RESPONSIVE
   ============================ */
@media (max-width: 1199px) {
  .pd-spec-table__grid { grid-template-columns: 1fr; }
  .pd-dimension__grid { grid-template-columns: repeat(3, 1fr); }
  .pd-process__steps { grid-template-columns: repeat(3, 1fr); }
  .pd-dealer__grid { grid-template-columns: repeat(3, 1fr); }
  .pd-docs__grid { grid-template-columns: repeat(2, 1fr); }
  .pd-related__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 991px) {
  .pd-system__inner { grid-template-columns: 1fr; }
  .pd-pn__inner { grid-template-columns: 1fr; }
  .pd-photo__inner { grid-template-columns: 1fr; }
  .pd-quality__inner { grid-template-columns: 1fr; }
  .pd-kit__content { grid-template-columns: 1fr; }
  .pd-cta__inner { grid-template-columns: 1fr; }
}

@media (max-width: 767px) {
  .pd-quick-compat__form { grid-template-columns: 1fr; }
  .pd-details__item { grid-template-columns: 1fr; }
  .pd-details__item--reverse { direction: ltr; }
  .pd-dimension__grid { grid-template-columns: repeat(2, 1fr); }
  .pd-process__steps { grid-template-columns: 1fr; }
  .pd-install__steps { grid-template-columns: 1fr; }
  .pd-packing__types { grid-template-columns: 1fr; }
  .pd-dealer__grid { grid-template-columns: 1fr; }
  .pd-dealer__actions { flex-direction: column; align-items: center; }
  .pd-docs__grid { grid-template-columns: 1fr; }
  .pd-related__grid { grid-template-columns: 1fr; }
  .pd-photo__fields { grid-template-columns: 1fr; }
  .pd-photo__preview { grid-template-columns: repeat(3, 1fr); }
  .pd-cta__form-grid { grid-template-columns: 1fr; }
  .pd-cta__form { padding: 20px; }
}

@media (max-width: 479px) {
  .pd-dimension__grid { grid-template-columns: 1fr; }
  .pd-photo__preview { grid-template-columns: repeat(2, 1fr); }
}

/* ============================================
   FACTORY PAGE STYLES
   ============================================ */

/* --- Factory Hero --- */
.f-hero { position: relative; height: 620px; overflow: hidden; display: flex; align-items: flex-end; }
.f-hero__bg { position: absolute; inset: 0; }
.f-hero__bg-img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.f-hero__overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(17,24,32,0.88) 0%, rgba(17,24,32,0.6) 45%, rgba(17,24,32,0.15) 100%); }
.f-hero__content { position: relative; z-index: 2; padding-bottom: 56px; max-width: 720px; }
.f-hero__breadcrumb { display: flex; align-items: center; gap: 8px; font-size: 13px; color: rgba(255,255,255,0.6); margin-bottom: 14px; }
.f-hero__breadcrumb a { color: rgba(255,255,255,0.6); }
.f-hero__breadcrumb a:hover { color: var(--color-white); }
.f-hero__breadcrumb span:last-child { color: var(--color-white); }
.f-hero__eyebrow { display: block; font-size: 13px; font-weight: 600; letter-spacing: 2px; color: var(--color-primary-light); margin-bottom: 12px; }
.f-hero__title { font-family: var(--font-heading); font-size: 52px; font-weight: 800; color: var(--color-white); line-height: 1.08; margin-bottom: 16px; }
.f-hero__desc { font-size: 17px; color: rgba(255,255,255,0.8); line-height: 1.7; margin-bottom: 28px; }
.f-hero__buttons { display: flex; gap: 12px; margin-bottom: 28px; flex-wrap: wrap; }
.f-hero__tags { display: flex; gap: 12px; flex-wrap: wrap; }
.f-hero__tag { display: inline-block; padding: 6px 14px; background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.15); border-radius: var(--radius); font-size: 13px; font-weight: 500; color: rgba(255,255,255,0.8); }

/* --- Factory Overview --- */
.f-overview__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.f-overview__content p { font-size: 16px; color: var(--color-text-secondary); line-height: 1.7; margin-bottom: 14px; }
.f-overview__quote { border-left: 4px solid var(--color-primary); padding: 14px 20px; background: var(--color-light); border-radius: 0 var(--radius) var(--radius) 0; margin: 20px 0 24px; }
.f-overview__quote p { font-size: 15px; font-weight: 600; color: var(--color-text); font-style: italic; margin: 0; }
.f-overview__images { display: flex; flex-direction: column; gap: 14px; }
.f-overview__img-main { position: relative; border-radius: var(--radius-lg); overflow: hidden; }
.f-overview__img-main img { width: 100%; height: 100%; object-fit: cover; min-height: 280px; }
.f-overview__img-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.f-overview__img-small { position: relative; border-radius: var(--radius-lg); overflow: hidden; }
.f-overview__img-small img { width: 100%; height: 100%; object-fit: cover; min-height: 150px; }
.f-overview__img-label { position: absolute; bottom: 10px; left: 10px; padding: 4px 10px; background: rgba(0,0,0,0.55); border-radius: var(--radius); font-size: 11px; font-weight: 600; color: var(--color-white); }

/* --- Factory Areas --- */
.f-areas__grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
.f-areas__card { display: block; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden; transition: all var(--transition); cursor: pointer; }
.f-areas__card:hover { transform: translateY(-4px); box-shadow: 0 8px 24px rgba(0,0,0,0.06); border-color: var(--color-primary); }
.f-areas__card-img { aspect-ratio: 3 / 2; background: var(--color-light); overflow: hidden; display: flex; align-items: center; justify-content: center; }
.f-areas__card-img img { width: 100%; height: 100%; object-fit: contain; display: block; transition: none; }
.f-areas__card:hover .f-areas__card-img img { transform: none; }
.f-areas__card-body { padding: 14px; position: relative; }
.f-areas__card-body::after { content: ''; position: absolute; bottom: 0; left: 14px; right: 14px; height: 3px; background: var(--color-primary); transform: scaleX(0); transition: transform var(--transition); }
.f-areas__card:hover .f-areas__card-body::after { transform: scaleX(1); }
.f-areas__card-num { font-family: var(--font-heading); font-size: 12px; font-weight: 700; color: var(--color-primary); opacity: 0.4; margin-bottom: 4px; }
.f-areas__card-name { font-family: var(--font-body); font-size: 13px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.f-areas__card-desc { font-size: 11px; color: var(--color-text-secondary); line-height: 1.4; }

/* --- Production Process --- */
.f-process__timeline { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; }
.f-process__step { padding: 18px 14px; background: var(--color-white); border-radius: var(--radius-lg); border-top: 3px solid var(--color-primary); text-align: center; }
.f-process__step span { font-family: var(--font-heading); font-size: 20px; font-weight: 800; color: var(--color-primary); opacity: 0.3; display: block; margin-bottom: 6px; }
.f-process__step h4 { font-family: var(--font-body); font-size: 13px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.f-process__step p { font-size: 11px; color: var(--color-text-secondary); }

/* --- Component Preparation --- */
.f-comp__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.f-comp__inner > * { min-width: 0; }
.f-comp__image { border-radius: var(--radius-lg); overflow: hidden; }
.f-comp__image img { width: 100%; object-fit: cover; }
.f-comp__content p { font-size: 15px; color: var(--color-text-secondary); line-height: 1.7; margin-bottom: 16px; }
.f-comp__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-bottom: 14px; }
.f-comp__list h3 { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-text); margin-bottom: 10px; }
.f-comp__list li { font-size: 13px; color: var(--color-text-secondary); padding: 5px 0; border-bottom: 1px solid var(--color-light); padding-left: 14px; position: relative; }
.f-comp__list li::before { content: ''; position: absolute; left: 0; top: 50%; width: 5px; height: 5px; background: var(--color-primary); border-radius: 50%; transform: translateY(-50%); }
.f-comp__note { font-size: 13px; color: var(--color-metal); font-style: italic; }

/* --- Chassis --- */
.f-chassis { background: var(--color-light); }
.f-chassis__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.f-chassis__inner > * { min-width: 0; }
.f-chassis__content p { font-size: 15px; color: var(--color-text-secondary); line-height: 1.7; margin-bottom: 16px; }
.f-chassis__items { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.f-chassis__items span { padding: 6px 12px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 12px; font-weight: 500; color: var(--color-text-secondary); }
.f-chassis__checks h3 { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-text); margin-bottom: 10px; }
.f-chassis__checks span { display: inline-block; padding: 5px 10px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 12px; color: var(--color-text-secondary); margin: 0 6px 6px 0; }
.f-chassis__image { border-radius: var(--radius-lg); overflow: hidden; }
.f-chassis__image img { width: 100%; object-fit: cover; }

/* --- Engine --- */
.f-engine__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.f-engine__inner > * { min-width: 0; }
.f-engine__image { border-radius: var(--radius-lg); overflow: hidden; }
.f-engine__image img { width: 100%; object-fit: cover; }
.f-engine__content p { font-size: 15px; color: var(--color-text-secondary); line-height: 1.7; margin-bottom: 16px; }
.f-engine__items { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.f-engine__items span { padding: 6px 12px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 12px; font-weight: 500; color: var(--color-text-secondary); }
.f-engine__note { font-size: 13px; color: var(--color-metal); margin-bottom: 20px; }

/* --- Hydraulic & Electrical --- */
.f-hydelec { background: var(--color-dark); }
.f-hydelec__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-bottom: 16px; }
.f-hydelec__card { background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius-lg); overflow: hidden; }
.f-hydelec__img { height: 200px; overflow: hidden; }
.f-hydelec__img img { width: 100%; height: 100%; object-fit: cover; }
.f-hydelec__card h3 { font-family: var(--font-body); font-size: 17px; font-weight: 600; color: var(--color-white); padding: 16px 20px 8px; }
.f-hydelec__card ul { padding: 0 20px 20px; }
.f-hydelec__card li { font-size: 13px; color: rgba(255,255,255,0.6); padding: 5px 0; border-bottom: 1px solid rgba(255,255,255,0.06); padding-left: 14px; position: relative; }
.f-hydelec__card li::before { content: ''; position: absolute; left: 0; top: 50%; width: 5px; height: 5px; background: var(--color-primary); border-radius: 50%; transform: translateY(-50%); }
.f-hydelec__note { text-align: center; font-size: 13px; color: rgba(255,255,255,0.5); }

/* --- Body & Cabin --- */
.f-body__configs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-bottom: 20px; }
.f-body__config { background: var(--color-light); border-radius: var(--radius-lg); overflow: hidden; border: 1px solid var(--color-border); }
.f-body__config-img { height: 200px; overflow: hidden; }
.f-body__config-img img { width: 100%; height: 100%; object-fit: cover; }
.f-body__config h3 { font-family: var(--font-body); font-size: 17px; font-weight: 600; color: var(--color-text); padding: 14px 18px 6px; }
.f-body__config p { font-size: 13px; color: var(--color-text-secondary); padding: 0 18px 14px; line-height: 1.5; }
.f-body__note { text-align: center; font-size: 14px; color: var(--color-text-secondary); }

/* --- Painting --- */
.f-paint { background: var(--color-light); }
.f-paint__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.f-paint__inner > * { min-width: 0; }
.f-paint__image { border-radius: var(--radius-lg); overflow: hidden; }
.f-paint__image img { width: 100%; object-fit: cover; }
.f-paint__content p { font-size: 15px; color: var(--color-text-secondary); line-height: 1.7; margin-bottom: 16px; }
.f-paint__steps { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.f-paint__steps span { padding: 6px 12px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 12px; font-weight: 500; color: var(--color-text-secondary); }
.f-paint__note { font-size: 13px; color: var(--color-metal); }

/* --- Machine Adjustment --- */
.f-adjust__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 16px; }
.f-adjust__grid span { padding: 12px; background: var(--color-light); border-radius: var(--radius); font-size: 13px; font-weight: 500; color: var(--color-text-secondary); text-align: center; border: 1px solid var(--color-border); }
.f-adjust__note { text-align: center; font-size: 13px; color: var(--color-metal); }

/* --- Quality Inspection --- */
.f-quality { background: var(--color-dark); }
.f-quality__inner { display: grid; grid-template-columns: 1fr 1.1fr; gap: 48px; align-items: center; }
.f-quality__inner > * { min-width: 0; }
.f-quality__image { border-radius: var(--radius-lg); overflow: hidden; }
.f-quality__image img { width: 100%; object-fit: cover; }
.f-quality__content .section-header__title { color: var(--color-white); }
.f-quality__list { list-style: none; margin-bottom: 16px; }
.f-quality__list li { display: flex; align-items: center; gap: 8px; padding: 7px 0; border-bottom: 1px solid rgba(255,255,255,0.08); font-size: 14px; color: rgba(255,255,255,0.85); }
.f-quality__list svg { color: var(--color-primary); flex-shrink: 0; }
.f-quality__promise { padding: 14px 18px; background: rgba(255,255,255,0.06); border-left: 3px solid var(--color-primary); border-radius: 0 var(--radius) var(--radius) 0; margin-bottom: 20px; }
.f-quality__promise p { font-size: 14px; color: var(--color-white); font-weight: 500; margin: 0; }

/* --- Machine Testing --- */
.f-testing__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; }
.f-testing__img { border-radius: var(--radius-lg); overflow: hidden; }
.f-testing__img img { width: 100%; object-fit: cover; }
.f-testing__content h3 { font-family: var(--font-body); font-size: 18px; font-weight: 600; color: var(--color-text); margin-bottom: 14px; }
.f-testing__items { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.f-testing__items span { padding: 6px 12px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 12px; font-weight: 500; color: var(--color-text-secondary); }
.f-testing__note { font-size: 13px; color: var(--color-metal); }

/* --- Parts Warehouse --- */
.f-warehouse { background: var(--color-light); }
.f-warehouse__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.f-warehouse__inner > * { min-width: 0; }
.f-warehouse__image { border-radius: var(--radius-lg); overflow: hidden; }
.f-warehouse__image img { width: 100%; object-fit: cover; }
.f-warehouse__content p { font-size: 15px; color: var(--color-text-secondary); line-height: 1.7; margin-bottom: 16px; }
.f-warehouse__cats { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
.f-warehouse__cats span { padding: 6px 12px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 12px; font-weight: 500; color: var(--color-text-secondary); }
.f-warehouse__actions { display: flex; gap: 12px; }

/* --- Finished Tractors --- */
.f-finished__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.f-finished__item { position: relative; border-radius: var(--radius-lg); overflow: hidden; }
.f-finished__item img { width: 100%; object-fit: cover; }
.f-finished__item span { position: absolute; bottom: 12px; left: 12px; padding: 6px 14px; background: rgba(0,0,0,0.55); border-radius: var(--radius); font-size: 13px; font-weight: 500; color: var(--color-white); }

/* --- Packing --- */
.f-packing { background: var(--color-dark); }
.f-packing__steps { display: flex; gap: 10px; justify-content: center; margin-bottom: 24px; flex-wrap: wrap; }
.f-packing__step { padding: 14px 16px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius); text-align: center; }
.f-packing__step span { font-family: var(--font-heading); font-size: 16px; font-weight: 700; color: var(--color-primary); display: block; margin-bottom: 4px; }
.f-packing__step h4 { font-family: var(--font-body); font-size: 12px; font-weight: 600; color: var(--color-white); }
.f-packing__methods { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 20px; }
.f-packing__methods span { padding: 7px 14px; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: var(--radius); font-size: 12px; color: rgba(255,255,255,0.7); }
.f-packing__qty { display: flex; gap: 20px; justify-content: center; margin-bottom: 16px; }
.f-packing__qty-item { padding: 14px 24px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius); display: flex; gap: 12px; align-items: center; }
.f-packing__qty-item span { font-size: 13px; color: rgba(255,255,255,0.6); }
.f-packing__qty-item strong { font-size: 14px; color: var(--color-white); }
.f-packing__note { text-align: center; font-size: 13px; color: rgba(255,255,255,0.5); margin-bottom: 16px; }
.f-packing__action { text-align: center; }

/* --- OEM --- */
.f-oem__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.f-oem__inner > * { min-width: 0; }
.f-oem__visual { border-radius: var(--radius-lg); overflow: hidden; }
.f-oem__visual img { width: 100%; object-fit: cover; }
.f-oem__content .section-header__title { color: var(--color-white); }
.f-oem__content p { font-size: 15px; color: rgba(255,255,255,0.7); line-height: 1.7; margin-bottom: 20px; }
.f-oem__options { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.f-oem__options span { padding: 7px 14px; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: var(--radius); font-size: 12px; color: rgba(255,255,255,0.75); }
.f-oem__flow { margin-bottom: 24px; }
.f-oem__flow h3 { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-white); margin-bottom: 10px; }
.f-oem__flow span { display: inline-block; padding: 6px 12px; background: rgba(255,255,255,0.06); border-radius: var(--radius); font-size: 12px; color: rgba(255,255,255,0.6); margin: 0 4px 6px 0; }
.f-oem__actions { display: flex; gap: 12px; margin-bottom: 14px; }
.f-oem__note { font-size: 12px; color: rgba(255,255,255,0.5); }

/* --- Bulk Orders --- */
.f-bulk__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 24px; }
.f-bulk__card { padding: 16px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); text-align: center; }
.f-bulk__card h3 { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-text); }
.f-bulk__clients { text-align: center; margin-bottom: 16px; }
.f-bulk__clients h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 12px; }
.f-bulk__clients span { display: inline-block; padding: 6px 14px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; color: var(--color-text-secondary); margin: 0 4px 6px 0; }
.f-bulk__note { text-align: center; font-size: 13px; color: var(--color-metal); }

/* --- Factory Management --- */
.f-mgmt__grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; margin-bottom: 16px; }
.f-mgmt__card { padding: 16px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius-lg); text-align: center; }
.f-mgmt__card h3 { font-family: var(--font-body); font-size: 13px; font-weight: 600; color: var(--color-text); }
.f-mgmt__note { text-align: center; font-size: 13px; color: var(--color-metal); }

/* --- Factory Gallery --- */
.f-gallery__filters { display: flex; gap: 6px; justify-content: center; margin-bottom: 28px; flex-wrap: wrap; }
.f-gallery__filter { padding: 8px 18px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-weight: 600; color: var(--color-text-secondary); background: var(--color-white); transition: all var(--transition); }
.f-gallery__filter--active { background: var(--color-primary); color: var(--color-white); border-color: var(--color-primary); }
.f-gallery__filter:hover:not(.f-gallery__filter--active) { border-color: var(--color-primary); color: var(--color-primary); }
.f-gallery__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.f-gallery__item { position: relative; border-radius: var(--radius-lg); overflow: hidden; aspect-ratio: 4/3; cursor: pointer; transition: all var(--transition); }
.f-gallery__item.hidden { display: none; }
.f-gallery__item img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--transition); }
.f-gallery__item:hover img { transform: scale(1.05); }
.f-gallery__info { position: absolute; bottom: 0; left: 0; right: 0; padding: 10px 14px; background: linear-gradient(transparent, rgba(0,0,0,0.6)); }
.f-gallery__info span { font-size: 12px; font-weight: 500; color: var(--color-white); }

/* --- Factory Videos --- */
.f-videos { background: var(--color-dark); }
.f-videos__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-bottom: 24px; }
.f-videos__action { text-align: center; }

/* --- Factory Visit --- */
.f-visit__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-bottom: 28px; }
.f-visit__card { padding: 24px; background: var(--color-light); border-radius: var(--radius-lg); border-top: 3px solid var(--color-primary); }
.f-visit__card h3 { font-family: var(--font-body); font-size: 17px; font-weight: 600; color: var(--color-text); margin-bottom: 8px; }
.f-visit__card p { font-size: 14px; color: var(--color-text-secondary); line-height: 1.6; }
.f-visit__flow { margin-bottom: 20px; }
.f-visit__flow h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); text-align: center; margin-bottom: 16px; }
.f-visit__flow-steps { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.f-visit__flow-steps > div { padding: 12px 16px; background: var(--color-light); border-radius: var(--radius); text-align: center; border-top: 3px solid var(--color-primary); }
.f-visit__flow-steps span { font-family: var(--font-heading); font-size: 16px; font-weight: 700; color: var(--color-primary); display: block; margin-bottom: 4px; }
.f-visit__flow-steps h4 { font-family: var(--font-body); font-size: 12px; font-weight: 600; color: var(--color-text); }
.f-visit__note { text-align: center; font-size: 14px; color: var(--color-text-secondary); margin-bottom: 16px; }
.f-visit__actions { display: flex; gap: 12px; justify-content: center; }

/* --- Why YUFENG --- */
.f-why { background: var(--color-dark); }
.f-why__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.f-why__card { padding: 22px 18px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius-lg); transition: all var(--transition); }
.f-why__card:hover { border-color: var(--color-primary); }
.f-why__icon { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: var(--radius); background: rgba(255,255,255,0.06); color: var(--color-primary); margin-bottom: 12px; }
.f-why__card h3 { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-white); margin-bottom: 6px; }
.f-why__card p { font-size: 13px; color: rgba(255,255,255,0.6); line-height: 1.5; }

/* --- Factory FAQ --- */
.f-faq .faq__list { max-width: 800px; margin: 0 auto 24px; }

/* --- Factory CTA --- */
.f-cta { position: relative; overflow: hidden; padding: 80px 0; }
.f-cta__bg { position: absolute; inset: 0; }
.f-cta__bg img { width: 100%; height: 100%; object-fit: cover; }
.f-cta__overlay { position: absolute; inset: 0; background: rgba(17,24,32,0.85); }
.f-cta__inner { position: relative; z-index: 2; display: grid; grid-template-columns: 1fr 1.1fr; gap: 48px; align-items: flex-start; }
.f-cta__text { font-size: 16px; color: rgba(255,255,255,0.75); line-height: 1.7; margin-bottom: 20px; }
.f-cta__tags { display: flex; flex-direction: column; gap: 10px; }
.f-cta__tags span { display: flex; align-items: center; gap: 10px; padding: 10px 16px; background: rgba(255,255,255,0.06); border-radius: var(--radius); font-size: 13px; color: rgba(255,255,255,0.85); border: 1px solid rgba(255,255,255,0.1); }
.f-cta__tags span::before { content: ''; width: 7px; height: 7px; background: var(--color-primary); border-radius: 50%; flex-shrink: 0; }
.f-cta__form { background: var(--color-white); padding: 32px; border-radius: var(--radius-lg); }
.f-cta__form-title { font-family: var(--font-heading); font-size: 24px; font-weight: 700; color: var(--color-text); margin-bottom: 20px; }
.f-cta__honeypot { position: absolute; left: -9999px; height: 0; opacity: 0; }
.f-cta__form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px; }
.f-cta__field { display: flex; flex-direction: column; }
.f-cta__field label { font-size: 12px; font-weight: 500; color: var(--color-text); margin-bottom: 4px; }
.f-cta__field input, .f-cta__field select, .f-cta__field textarea { padding: 10px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-family: var(--font-body); color: var(--color-text); background: var(--color-white); }
.f-cta__field input:focus, .f-cta__field select:focus, .f-cta__field textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 2px rgba(200,16,46,0.1); }
.f-cta__field input.error { border-color: var(--color-primary); }
.f-cta__error { font-size: 11px; color: var(--color-primary); margin-top: 2px; min-height: 14px; }
.f-cta__field--full { grid-column: 1 / -1; margin-bottom: 12px; }
.f-cta__checkbox { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; color: var(--color-text-secondary); cursor: pointer; line-height: 1.4; }
.f-cta__checkbox input { margin-top: 2px; width: 14px; height: 14px; accent-color: var(--color-primary); }
.f-cta__submit { width: 100%; }
.f-cta__success { display: flex; align-items: center; gap: 10px; padding: 14px; background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: var(--radius); margin-top: 12px; }
.f-cta__success svg { color: var(--color-success); flex-shrink: 0; }
.f-cta__success p { font-size: 13px; color: #166534; font-weight: 500; }

/* ============================
   FACTORY RESPONSIVE
   ============================ */
@media (max-width: 1199px) {
  .f-hero { height: 540px; }
  .f-hero__title { font-size: 44px; }
  .f-areas__grid { grid-template-columns: repeat(4, 1fr); }
  .f-process__timeline { grid-template-columns: repeat(5, 1fr); }
  .f-hydelec__grid { gap: 20px; }
  .f-packing__steps { gap: 8px; }
  .f-videos__grid { grid-template-columns: repeat(2, 1fr); }
  .f-gallery__grid { grid-template-columns: repeat(3, 1fr); }
  .f-why__grid { grid-template-columns: repeat(3, 1fr); }
  .f-bulk__grid { grid-template-columns: repeat(3, 1fr); }
  .f-mgmt__grid { grid-template-columns: repeat(4, 1fr); }
}

@media (max-width: 991px) {
  .f-hero { height: 500px; }
  .f-hero__title { font-size: 38px; }
  .f-overview__inner { grid-template-columns: 1fr; }
  .f-comp__inner { grid-template-columns: 1fr; }
  .f-chassis__inner { grid-template-columns: 1fr; }
  .f-engine__inner { grid-template-columns: 1fr; }
  .f-hydelec__grid { grid-template-columns: 1fr; }
  .f-paint__inner { grid-template-columns: 1fr; }
  .f-quality__inner { grid-template-columns: 1fr; }
  .f-testing__grid { grid-template-columns: 1fr; }
  .f-warehouse__inner { grid-template-columns: 1fr; }
  .f-oem__inner { grid-template-columns: 1fr; }
  .f-cta__inner { grid-template-columns: 1fr; }
  .f-areas__grid { grid-template-columns: repeat(3, 1fr); }
  .f-process__timeline { grid-template-columns: repeat(3, 1fr); }
  .f-body__configs { grid-template-columns: 1fr; }
  .f-visit__grid { grid-template-columns: 1fr; }
  .f-bulk__grid { grid-template-columns: repeat(2, 1fr); }
  .f-mgmt__grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 767px) {
  .f-hero { height: 460px; }
  .f-hero__title { font-size: 32px; }
  .f-hero__desc { font-size: 15px; }
  .f-hero__buttons { flex-direction: column; gap: 10px; }
  .f-hero__buttons .btn { width: 100%; }
  .f-comp__grid { grid-template-columns: 1fr; }
  .f-adjust__grid { grid-template-columns: repeat(2, 1fr); }
  .f-areas__grid { grid-template-columns: repeat(2, 1fr); }
  .f-process__timeline { grid-template-columns: 1fr; }
  .f-packing__steps { flex-direction: column; align-items: stretch; }
  .f-packing__qty { flex-direction: column; align-items: center; }
  .f-visit__flow-steps { flex-direction: column; align-items: center; }
  .f-visit__actions { flex-direction: column; align-items: center; }
  .f-finished__grid { grid-template-columns: 1fr; }
  .f-gallery__grid { grid-template-columns: repeat(2, 1fr); }
  .f-videos__grid { grid-template-columns: 1fr; }
  .f-why__grid { grid-template-columns: 1fr; }
  .f-bulk__grid { grid-template-columns: 1fr; }
  .f-mgmt__grid { grid-template-columns: repeat(2, 1fr); }
  .f-cta__form-grid { grid-template-columns: 1fr; }
  .f-cta__form { padding: 20px; }
  .f-oem__actions { flex-direction: column; }
  .f-warehouse__actions { flex-direction: column; }
}

@media (max-width: 479px) {
  .f-hero { height: 420px; }
  .f-hero__title { font-size: 28px; }
  .f-areas__grid { grid-template-columns: 1fr; }
  .f-gallery__grid { grid-template-columns: 1fr; }
  .f-adjust__grid { grid-template-columns: 1fr; }
  .f-mgmt__grid { grid-template-columns: 1fr; }
  .f-gallery__filters { gap: 4px; }
  .f-gallery__filter { padding: 6px 12px; font-size: 12px; }
}

/* ============================================
   CUSTOMIZATION / OEM PAGE STYLES
   ============================================ */

/* --- OEM Hero --- */
.oem-hero { position: relative; height: 640px; overflow: hidden; display: flex; align-items: flex-end; }
.oem-hero__bg { position: absolute; inset: 0; }
.oem-hero__bg-img { width: 100%; height: 100%; object-fit: cover; }
.oem-hero__overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(17,24,32,0.88) 0%, rgba(17,24,32,0.55) 50%, rgba(17,24,32,0.15) 100%); }
.oem-hero__content { position: relative; z-index: 2; padding-bottom: 56px; max-width: 720px; }
.oem-hero__breadcrumb { display: flex; align-items: center; gap: 8px; font-size: 13px; color: rgba(255,255,255,0.6); margin-bottom: 14px; }
.oem-hero__breadcrumb a { color: rgba(255,255,255,0.6); }
.oem-hero__breadcrumb a:hover { color: var(--color-white); }
.oem-hero__breadcrumb span:last-child { color: var(--color-white); }
.oem-hero__eyebrow { display: block; font-size: 13px; font-weight: 600; letter-spacing: 2px; color: var(--color-primary-light); margin-bottom: 12px; }
.oem-hero__title { font-family: var(--font-heading); font-size: 52px; font-weight: 800; color: var(--color-white); line-height: 1.08; margin-bottom: 16px; }
.oem-hero__desc { font-size: 17px; color: rgba(255,255,255,0.8); line-height: 1.7; margin-bottom: 28px; }
.oem-hero__buttons { display: flex; gap: 12px; margin-bottom: 28px; flex-wrap: wrap; }
.oem-hero__tags { display: flex; gap: 12px; flex-wrap: wrap; }
.oem-hero__tag { display: inline-block; padding: 6px 14px; background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.15); border-radius: var(--radius); font-size: 13px; font-weight: 500; color: rgba(255,255,255,0.8); }

/* --- OEM Overview --- */
.oem-overview__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.oem-overview__content p { font-size: 16px; color: var(--color-text-secondary); line-height: 1.7; margin-bottom: 14px; }
.oem-overview__quote { border-left: 4px solid var(--color-primary); padding: 14px 20px; background: var(--color-light); border-radius: 0 var(--radius) var(--radius) 0; margin: 20px 0 24px; }
.oem-overview__quote p { font-size: 15px; font-weight: 600; color: var(--color-text); font-style: italic; margin: 0; }
.oem-overview__images { display: flex; flex-direction: column; gap: 14px; }
.oem-overview__img-main { position: relative; border-radius: var(--radius-lg); overflow: hidden; }
.oem-overview__img-main img { width: 100%; min-height: 280px; object-fit: cover; }
.oem-overview__img-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.oem-overview__img-small { position: relative; border-radius: var(--radius-lg); overflow: hidden; }
.oem-overview__img-small img { width: 100%; min-height: 150px; object-fit: cover; }
.oem-overview__img-label { position: absolute; bottom: 10px; left: 10px; padding: 4px 10px; background: rgba(0,0,0,0.55); border-radius: var(--radius); font-size: 11px; font-weight: 600; color: var(--color-white); }

/* --- Clients --- */
.oem-clients__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.oem-clients__card { padding: 24px; background: var(--color-white); border-radius: var(--radius-lg); border: 1px solid var(--color-border); transition: all var(--transition); }
.oem-clients__card:hover { border-color: var(--color-primary); transform: translateY(-4px); box-shadow: 0 6px 20px rgba(0,0,0,0.05); }
.oem-clients__icon { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: var(--radius); background: var(--color-light); color: var(--color-primary); margin-bottom: 14px; border: 1px solid var(--color-border); }
.oem-clients__card:hover .oem-clients__icon { background: var(--color-primary); color: var(--color-white); border-color: var(--color-primary); }
.oem-clients__card h3 { font-family: var(--font-body); font-size: 17px; font-weight: 600; color: var(--color-text); margin-bottom: 8px; }
.oem-clients__card p { font-size: 14px; color: var(--color-text-secondary); line-height: 1.5; margin-bottom: 10px; }
.oem-clients__card > span:last-child { font-size: 12px; font-weight: 600; color: var(--color-primary); }

/* --- Capabilities --- */
.oem-caps__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.oem-cap-card { padding: 20px; background: var(--color-light); border-radius: var(--radius-lg); border: 1px solid var(--color-border); transition: all var(--transition); cursor: pointer; }
.oem-cap-card:hover { border-color: var(--color-primary); background: var(--color-white); }
.oem-cap-card h3 { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-text); margin-bottom: 6px; }
.oem-cap-card p { font-size: 12px; color: var(--color-text-secondary); margin-bottom: 8px; }
.oem-cap-card__tag { font-size: 11px; font-weight: 600; color: var(--color-primary); }

/* --- Brand --- */
.oem-brand { background: var(--color-dark); }
.oem-brand__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.oem-brand__inner > * { min-width: 0; }
.oem-brand__image { border-radius: var(--radius-lg); overflow: hidden; }
.oem-brand__image img { width: 100%; object-fit: cover; }
.oem-brand__content .section-header__title { color: var(--color-white); }
.oem-brand__items { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.oem-brand__items span { padding: 6px 12px; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: var(--radius); font-size: 12px; color: rgba(255,255,255,0.75); }
.oem-brand__note { font-size: 13px; color: rgba(255,255,255,0.5); margin-bottom: 20px; }
.oem-brand__formats { margin-bottom: 20px; }
.oem-brand__formats h3 { font-size: 14px; font-weight: 600; color: var(--color-white); margin-bottom: 8px; }
.oem-brand__formats span { display: inline-block; padding: 5px 12px; background: rgba(255,255,255,0.06); border-radius: var(--radius); font-size: 12px; color: rgba(255,255,255,0.7); margin: 0 4px 4px 0; }
.oem-brand__flow { margin-bottom: 20px; }
.oem-brand__flow h3 { font-size: 14px; font-weight: 600; color: var(--color-white); margin-bottom: 10px; }
.oem-brand__flow-steps { display: flex; gap: 8px; flex-wrap: wrap; }
.oem-brand__flow-steps > div { padding: 10px 14px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius); text-align: center; }
.oem-brand__flow-steps span { font-family: var(--font-heading); font-size: 14px; font-weight: 700; color: var(--color-primary); display: block; margin-bottom: 2px; }
.oem-brand__flow-steps h4 { font-family: var(--font-body); font-size: 11px; font-weight: 600; color: rgba(255,255,255,0.7); }

/* --- Color --- */
.oem-color__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: start; }
.oem-color__preview { background: var(--color-light); border-radius: var(--radius-lg); padding: 24px; border: 1px solid var(--color-border); }
.oem-color__tractor svg { width: 100%; height: auto; }
.oem-color__options h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 12px; }
.oem-color__swatches { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 24px; }
.oem-color__swatch { display: flex; align-items: center; gap: 6px; padding: 8px 14px; border: 2px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-weight: 500; color: var(--color-text-secondary); cursor: pointer; transition: all var(--transition); }
.oem-color__swatch span { width: 18px; height: 18px; border-radius: 50%; border: 1px solid rgba(0,0,0,0.1); }
.oem-color__swatch--active { border-color: var(--color-primary); color: var(--color-primary); }
.oem-color__swatch:hover:not(.oem-color__swatch--active) { border-color: var(--color-primary); }
.oem-color__custom { margin-bottom: 20px; }
.oem-color__fields { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.oem-color__field { display: flex; flex-direction: column; }
.oem-color__field label { font-size: 12px; font-weight: 500; color: var(--color-text); margin-bottom: 4px; }
.oem-color__field input { padding: 10px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-family: var(--font-body); }
.oem-color__field input:focus { outline: none; border-color: var(--color-primary); }
.oem-color__disclaimer { font-size: 12px; color: var(--color-metal); margin-bottom: 16px; padding: 10px; background: var(--color-light); border-radius: var(--radius); }

/* --- Engine --- */
.oem-engine__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.oem-engine__inner > * { min-width: 0; }
.oem-engine__image { border-radius: var(--radius-lg); overflow: hidden; }
.oem-engine__image img { width: 100%; object-fit: cover; }
.oem-engine__content p { font-size: 15px; color: var(--color-text-secondary); line-height: 1.7; margin-bottom: 16px; }
.oem-engine__factors, .oem-engine__options { margin-bottom: 16px; }
.oem-engine__factors h3, .oem-engine__options h3 { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-text); margin-bottom: 10px; }
.oem-engine__factors span, .oem-engine__options span { display: inline-block; padding: 5px 10px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 12px; color: var(--color-text-secondary); margin: 0 4px 4px 0; }
.oem-engine__note { font-size: 13px; color: var(--color-metal); margin-bottom: 20px; }

/* --- Transmission --- */
.oem-trans__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; margin-bottom: 24px; }
.oem-trans__options, .oem-trans__scenarios { padding: 24px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.oem-trans__options h3, .oem-trans__scenarios h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 12px; }
.oem-trans__options span { display: inline-block; padding: 5px 10px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 12px; color: var(--color-text-secondary); margin: 0 4px 4px 0; }
.oem-trans__scenario { padding: 12px 0; border-bottom: 1px solid var(--color-light); }
.oem-trans__scenario:last-child { border-bottom: none; }
.oem-trans__scenario h4 { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.oem-trans__scenario p { font-size: 13px; color: var(--color-text-secondary); }
.oem-trans__action { text-align: center; }

/* --- Operator --- */
.oem-operator__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-bottom: 24px; }
.oem-operator__card { background: var(--color-light); border-radius: var(--radius-lg); overflow: hidden; border: 1px solid var(--color-border); }
.oem-operator__img { height: 180px; overflow: hidden; }
.oem-operator__img img { width: 100%; height: 100%; object-fit: cover; }
.oem-operator__card h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); padding: 14px 16px 6px; }
.oem-operator__card p { font-size: 13px; color: var(--color-text-secondary); padding: 0 16px 14px; line-height: 1.5; }
.oem-operator__options { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 16px; }
.oem-operator__options h3 { width: 100%; text-align: center; font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 8px; }
.oem-operator__options span { padding: 6px 12px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 12px; color: var(--color-text-secondary); }
.oem-operator__note { text-align: center; font-size: 13px; color: var(--color-metal); }

/* --- Tires --- */
.oem-tires__inner { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-bottom: 16px; }
.oem-tires__types, .oem-tires__factors, .oem-tires__custom { padding: 20px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.oem-tires__types h3, .oem-tires__factors h3, .oem-tires__custom h3 { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-text); margin-bottom: 10px; }
.oem-tires__types span, .oem-tires__factors span, .oem-tires__custom span { display: inline-block; padding: 5px 10px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 12px; color: var(--color-text-secondary); margin: 0 4px 4px 0; }
.oem-tires__note { text-align: center; font-size: 13px; color: var(--color-metal); margin-bottom: 16px; }
.oem-tires__action { text-align: center; }

/* --- PTO --- */
.oem-pto__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-bottom: 16px; }
.oem-pto__card { padding: 20px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.oem-pto__card h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 10px; }
.oem-pto__card span { display: inline-block; padding: 5px 10px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 12px; color: var(--color-text-secondary); margin: 0 4px 4px 0; }
.oem-pto__note { text-align: center; font-size: 13px; color: var(--color-metal); }

/* --- Electrical --- */
.oem-electrical { background: var(--color-light); }
.oem-electrical__grid { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 16px; }
.oem-electrical__grid span { padding: 8px 16px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; color: var(--color-text-secondary); }
.oem-electrical__note { text-align: center; font-size: 13px; color: var(--color-metal); }

/* --- Weights --- */
.oem-weights__grid { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 16px; }
.oem-weights__grid span { padding: 8px 16px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; color: var(--color-text-secondary); }

/* --- Implements --- */
.oem-implements__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 24px; }
.oem-impl-card { padding: 18px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); text-align: center; transition: all var(--transition); }
.oem-impl-card:hover { border-color: var(--color-primary); }
.oem-impl-card h3 { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.oem-impl-card p { font-size: 12px; color: var(--color-text-secondary); margin-bottom: 8px; }
.oem-implements__actions { display: flex; gap: 12px; justify-content: center; }

/* --- Docs --- */
.oem-docs__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.oem-docs__inner > * { min-width: 0; }
.oem-docs__image { border-radius: var(--radius-lg); overflow: hidden; }
.oem-docs__image img { width: 100%; object-fit: cover; }
.oem-docs__types, .oem-docs__langs { margin-bottom: 16px; }
.oem-docs__types h3, .oem-docs__langs h3 { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-text); margin-bottom: 10px; }
.oem-docs__types span, .oem-docs__langs span { display: inline-block; padding: 5px 10px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 12px; color: var(--color-text-secondary); margin: 0 4px 4px 0; }
.oem-docs__note { font-size: 13px; color: var(--color-metal); }

/* --- Packaging --- */
.oem-pack__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.oem-pack__card { padding: 20px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.oem-pack__card h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 10px; }
.oem-pack__card span { display: inline-block; padding: 5px 10px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 12px; color: var(--color-text-secondary); margin: 0 4px 4px 0; }

/* --- Spare Parts --- */
.oem-parts__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 20px; }
.oem-parts__card { padding: 16px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius-lg); text-align: center; }
.oem-parts__card h3 { font-family: var(--font-body); font-size: 13px; font-weight: 600; color: var(--color-text); }
.oem-parts__note { text-align: center; font-size: 13px; color: var(--color-metal); margin-bottom: 16px; }
.oem-parts__action { text-align: center; }

/* --- Market --- */
.oem-market__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-bottom: 16px; }
.oem-market__card { padding: 20px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); border-top: 3px solid var(--color-primary); }
.oem-market__card h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 10px; }
.oem-market__card span { display: inline-block; padding: 4px 10px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 11px; color: var(--color-text-secondary); margin: 0 4px 4px 0; }
.oem-market__note { text-align: center; font-size: 13px; color: var(--color-metal); }

/* --- Configuration Builder --- */
.oem-builder { background: var(--color-light); }
.oem-builder__wrapper { max-width: 760px; margin: 0 auto; background: var(--color-white); border-radius: var(--radius-lg); border: 1px solid var(--color-border); overflow: hidden; }
.oem-builder__progress { height: 4px; background: var(--color-border); }
.oem-builder__progress-bar { height: 100%; background: var(--color-primary); transition: width 300ms ease; width: 12.5%; }
.oem-builder__steps-indicator { display: flex; justify-content: space-between; padding: 12px 24px; font-size: 12px; color: var(--color-metal); }
.oem-builder__body { padding: 28px 32px; min-height: 200px; }
.oem-builder__step-title { font-family: var(--font-heading); font-size: 22px; font-weight: 700; color: var(--color-text); margin-bottom: 16px; }
.oem-builder__options { display: flex; flex-wrap: wrap; gap: 10px; }
.oem-builder__opt { padding: 12px 20px; border: 2px solid var(--color-border); border-radius: var(--radius); font-size: 14px; font-weight: 500; color: var(--color-text-secondary); cursor: pointer; transition: all var(--transition); }
.oem-builder__opt:hover { border-color: var(--color-primary); color: var(--color-primary); }
.oem-builder__opt--selected { border-color: var(--color-primary); background: rgba(200,16,46,0.05); color: var(--color-primary); }
.oem-builder__checks { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.oem-builder__checks label { display: flex; align-items: center; gap: 8px; padding: 10px 14px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; color: var(--color-text-secondary); cursor: pointer; }
.oem-builder__checks input { width: 16px; height: 16px; accent-color: var(--color-primary); }
.oem-builder__nav { display: flex; justify-content: space-between; padding: 16px 32px; border-top: 1px solid var(--color-border); }
.oem-builder__result { padding: 24px 32px; border-top: 1px solid var(--color-border); }
.oem-builder__result h3 { font-family: var(--font-heading); font-size: 22px; font-weight: 700; color: var(--color-text); margin-bottom: 16px; }
.oem-builder__result-row { display: flex; padding: 8px 0; border-bottom: 1px solid var(--color-light); font-size: 14px; }
.oem-builder__result-label { width: 200px; color: var(--color-text-secondary); font-weight: 500; }
.oem-builder__result-value { color: var(--color-text); }
.oem-builder__result-actions { display: flex; gap: 10px; margin-top: 16px; flex-wrap: wrap; }
.oem-builder__disclaimer { font-size: 12px; color: var(--color-metal); text-align: center; padding: 12px 24px; border-top: 1px solid var(--color-border); }

/* --- OEM Process --- */
.oem-process__timeline { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-bottom: 16px; }
.oem-process__step { padding: 18px 12px; background: var(--color-white); border-radius: var(--radius-lg); border-top: 3px solid var(--color-primary); text-align: center; }
.oem-process__step span { font-family: var(--font-heading); font-size: 18px; font-weight: 800; color: var(--color-primary); opacity: 0.3; display: block; margin-bottom: 6px; }
.oem-process__step h4 { font-family: var(--font-body); font-size: 13px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.oem-process__step p { font-size: 11px; color: var(--color-text-secondary); }
.oem-process__note { text-align: center; font-size: 13px; color: var(--color-metal); }

/* --- Sample --- */
.oem-sample__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-bottom: 16px; }
.oem-sample__methods, .oem-sample__checklist { padding: 20px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.oem-sample__methods h3, .oem-sample__checklist h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 10px; }
.oem-sample__methods span, .oem-sample__checklist span { display: inline-block; padding: 5px 10px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 12px; color: var(--color-text-secondary); margin: 0 4px 4px 0; }
.oem-sample__note { text-align: center; font-size: 13px; color: var(--color-metal); }

/* --- Quality --- */
.oem-quality { background: var(--color-dark); }
.oem-quality__inner { display: grid; grid-template-columns: 1fr 1.1fr; gap: 48px; align-items: center; }
.oem-quality__inner > * { min-width: 0; }
.oem-quality__image { border-radius: var(--radius-lg); overflow: hidden; }
.oem-quality__image img { width: 100%; object-fit: cover; }
.oem-quality__content .section-header__title { color: var(--color-white); }
.oem-quality__list { list-style: none; margin-bottom: 14px; }
.oem-quality__list li { display: flex; align-items: center; gap: 8px; padding: 7px 0; border-bottom: 1px solid rgba(255,255,255,0.08); font-size: 14px; color: rgba(255,255,255,0.85); }
.oem-quality__list svg { color: var(--color-primary); flex-shrink: 0; }
.oem-quality__note { font-size: 13px; color: rgba(255,255,255,0.5); margin-bottom: 20px; }

/* --- Delivery --- */
.oem-delivery__grid { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 20px; }
.oem-delivery__grid span { padding: 8px 16px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; color: var(--color-text-secondary); }
.oem-delivery__qty { display: flex; gap: 20px; justify-content: center; margin-bottom: 16px; }
.oem-delivery__qty > div { padding: 14px 24px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius); display: flex; gap: 12px; align-items: center; }
.oem-delivery__qty span { font-size: 13px; color: var(--color-text-secondary); }
.oem-delivery__qty strong { font-size: 14px; color: var(--color-text); }
@media (max-width: 479px) {
  .oem-delivery__qty { gap: 8px; flex-wrap: wrap; }
  .oem-delivery__qty > div { flex: 1 1 160px; padding: 12px; }
}
.oem-delivery__note { text-align: center; font-size: 13px; color: var(--color-metal); }

/* --- Partner --- */
.oem-partner { background: var(--color-light); }
.oem-partner__grid { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 24px; }
.oem-partner__grid span { padding: 8px 16px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; color: var(--color-text-secondary); }
.oem-partner__actions { display: flex; gap: 12px; justify-content: center; }

/* --- Examples --- */
.oem-examples__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.oem-examples__card { padding: 24px; background: var(--color-light); border-radius: var(--radius-lg); border: 1px solid var(--color-border); }
.oem-examples__label { font-size: 11px; font-weight: 600; color: var(--color-primary); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 8px; display: block; }
.oem-examples__card h3 { font-family: var(--font-body); font-size: 18px; font-weight: 600; color: var(--color-text); margin-bottom: 8px; }
.oem-examples__card p { font-size: 14px; color: var(--color-text-secondary); line-height: 1.5; }
.oem-examples__note { font-size: 12px; color: var(--color-metal); margin-top: 8px; font-style: italic; }

/* --- FAQ --- */
.oem-faq .faq__list { max-width: 800px; margin: 0 auto 24px; }

/* --- CTA --- */
.oem-cta { position: relative; overflow: hidden; padding: 80px 0; }
.oem-cta__bg { position: absolute; inset: 0; }
.oem-cta__bg img { width: 100%; height: 100%; object-fit: cover; }
.oem-cta__overlay { position: absolute; inset: 0; background: rgba(17,24,32,0.88); }
.oem-cta__inner { position: relative; z-index: 2; display: grid; grid-template-columns: 1fr 1.2fr; gap: 48px; align-items: flex-start; }
.oem-cta__text { font-size: 16px; color: rgba(255,255,255,0.75); line-height: 1.7; margin-bottom: 20px; }
.oem-cta__tags { display: flex; flex-direction: column; gap: 10px; }
.oem-cta__tags span { display: flex; align-items: center; gap: 10px; padding: 10px 16px; background: rgba(255,255,255,0.06); border-radius: var(--radius); font-size: 13px; color: rgba(255,255,255,0.85); border: 1px solid rgba(255,255,255,0.1); }
.oem-cta__tags span::before { content: ''; width: 7px; height: 7px; background: var(--color-primary); border-radius: 50%; flex-shrink: 0; }
.oem-cta__form { background: var(--color-white); padding: 32px; border-radius: var(--radius-lg); }
.oem-cta__form-title { font-family: var(--font-heading); font-size: 24px; font-weight: 700; color: var(--color-text); margin-bottom: 20px; }
.oem-cta__honeypot { position: absolute; left: -9999px; height: 0; opacity: 0; }
.oem-cta__form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 12px; }
.oem-cta__field { display: flex; flex-direction: column; }
.oem-cta__field label { font-size: 12px; font-weight: 500; color: var(--color-text); margin-bottom: 4px; }
.oem-cta__field input, .oem-cta__field select, .oem-cta__field textarea { padding: 10px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-family: var(--font-body); color: var(--color-text); background: var(--color-white); }
.oem-cta__field input:focus, .oem-cta__field select:focus, .oem-cta__field textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 2px rgba(200,16,46,0.1); }
.oem-cta__field input.error { border-color: var(--color-primary); }
.oem-cta__error { font-size: 11px; color: var(--color-primary); margin-top: 2px; min-height: 14px; }
.oem-cta__field--full { grid-column: 1 / -1; margin-bottom: 12px; }
.oem-cta__checkbox { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; color: var(--color-text-secondary); cursor: pointer; line-height: 1.4; }
.oem-cta__checkbox input { margin-top: 2px; width: 14px; height: 14px; accent-color: var(--color-primary); }
.oem-cta__submit { width: 100%; }
.oem-cta__success { display: flex; align-items: center; gap: 10px; padding: 14px; background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: var(--radius); margin-top: 12px; }
.oem-cta__success svg { color: var(--color-success); flex-shrink: 0; }
.oem-cta__success p { font-size: 13px; color: #166534; font-weight: 500; }

/* --- Summary Modal --- */
.modal__content--summary { max-width: 640px; max-height: 90vh; overflow-y: auto; padding: 32px; background: var(--color-white); border-radius: var(--radius-lg); }
.modal__title { font-family: var(--font-heading); font-size: 24px; font-weight: 700; color: var(--color-text); margin-bottom: 20px; }
.modal__body { margin-bottom: 20px; }
.modal__body .oem-builder__result-row { display: flex; padding: 8px 0; border-bottom: 1px solid var(--color-light); font-size: 14px; }
.modal__body .oem-builder__result-label { width: 200px; color: var(--color-text-secondary); font-weight: 500; }
.modal__body .oem-builder__result-value { color: var(--color-text); }
.modal__actions { display: flex; gap: 8px; flex-wrap: wrap; }

/* ============================
   CUSTOMIZATION RESPONSIVE
   ============================ */
@media (max-width: 1199px) {
  .oem-hero { height: 560px; }
  .oem-hero__title { font-size: 44px; }
  .oem-clients__grid { grid-template-columns: repeat(2, 1fr); }
  .oem-caps__grid { grid-template-columns: repeat(3, 1fr); }
  .oem-operator__grid { grid-template-columns: repeat(2, 1fr); }
  .oem-implements__grid { grid-template-columns: repeat(3, 1fr); }
  .oem-parts__grid { grid-template-columns: repeat(3, 1fr); }
  .oem-process__timeline { grid-template-columns: repeat(3, 1fr); }
  .oem-examples__grid { grid-template-columns: repeat(2, 1fr); }
  .oem-market__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 991px) {
  .oem-hero { height: 520px; }
  .oem-hero__title { font-size: 38px; }
  .oem-overview__inner { grid-template-columns: 1fr; }
  .oem-brand__inner { grid-template-columns: 1fr; }
  .oem-engine__inner { grid-template-columns: 1fr; }
  .oem-docs__inner { grid-template-columns: 1fr; }
  .oem-quality__inner { grid-template-columns: 1fr; }
  .oem-cta__inner { grid-template-columns: 1fr; }
  .oem-color__inner { grid-template-columns: 1fr; }
  .oem-tires__inner { grid-template-columns: 1fr; }
  .oem-trans__grid { grid-template-columns: 1fr; }
  .oem-pto__grid { grid-template-columns: 1fr; }
  .oem-pack__grid { grid-template-columns: 1fr; }
  .oem-sample__grid { grid-template-columns: 1fr; }
  .oem-process__timeline { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 767px) {
  .oem-hero { height: 480px; }
  .oem-hero__title { font-size: 32px; }
  .oem-hero__desc { font-size: 15px; }
  .oem-hero__buttons { flex-direction: column; gap: 10px; }
  .oem-hero__buttons .btn { width: 100%; }
  .oem-clients__grid { grid-template-columns: 1fr; }
  .oem-caps__grid { grid-template-columns: repeat(2, 1fr); }
  .oem-operator__grid { grid-template-columns: 1fr; }
  .oem-market__grid { grid-template-columns: 1fr; }
  .oem-implements__grid { grid-template-columns: repeat(2, 1fr); }
  .oem-parts__grid { grid-template-columns: repeat(2, 1fr); }
  .oem-process__timeline { grid-template-columns: 1fr; }
  .oem-examples__grid { grid-template-columns: 1fr; }
  .oem-builder__body { padding: 20px 16px; }
  .oem-builder__nav { padding: 12px 16px; }
  .oem-builder__checks { grid-template-columns: 1fr; }
  .oem-cta__form-grid { grid-template-columns: 1fr; }
  .oem-cta__form { padding: 20px; }
  .oem-brand__flow-steps { flex-direction: column; }
  .oem-brand__actions { flex-direction: column; }
  .oem-partner__actions { flex-direction: column; align-items: center; }
  .oem-implements__actions { flex-direction: column; align-items: center; }
  .oem-tires__action { text-align: center; }
  .modal__content--summary { padding: 20px; }
  .modal__actions { flex-direction: column; }
}

@media (max-width: 479px) {
  .oem-hero { height: 450px; }
  .oem-hero__title { font-size: 28px; }
  .oem-caps__grid { grid-template-columns: 1fr; }
  .oem-implements__grid { grid-template-columns: 1fr; }
  .oem-parts__grid { grid-template-columns: 1fr; }
  .oem-color__fields { grid-template-columns: 1fr; }
}

/* ============================================
   NEWS / INSIGHTS PAGE STYLES
   ============================================ */

/* --- News Hero --- */
.news-hero { position: relative; min-height: 620px; overflow: hidden; display: flex; align-items: center; }
.news-hero__bg { position: absolute; inset: 0; }
.news-hero__bg-img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.news-hero__overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(17,24,32,0.88) 0%, rgba(17,24,32,0.6) 50%, rgba(17,24,32,0.2) 100%); }
.news-hero__content { position: relative; z-index: 2; width: 100%; max-width: var(--max-width); padding-top: 48px; padding-bottom: 48px; }
.news-hero__breadcrumb { display: flex; align-items: center; gap: 8px; font-size: 13px; color: rgba(255,255,255,0.6); margin-bottom: 14px; }
.news-hero__breadcrumb a { color: rgba(255,255,255,0.6); }
.news-hero__breadcrumb a:hover { color: var(--color-white); }
.news-hero__breadcrumb span:last-child { color: var(--color-white); }
.news-hero__eyebrow { display: block; font-size: 13px; font-weight: 600; letter-spacing: 2px; color: var(--color-primary-light); margin-bottom: 12px; }
.news-hero__title { max-width: 720px; font-family: var(--font-heading); font-size: 50px; font-weight: 800; color: var(--color-white); line-height: 1.08; margin-bottom: 16px; }
.news-hero__desc { max-width: 690px; font-size: 17px; color: rgba(255,255,255,0.8); line-height: 1.7; margin-bottom: 24px; }
.news-hero__buttons { display: flex; gap: 12px; margin-bottom: 24px; flex-wrap: wrap; }
.news-hero__buttons .btn--outline-dark { color: var(--color-white); border-color: rgba(255,255,255,0.72); background: rgba(17,24,32,0.1); }
.news-hero__buttons .btn--outline-dark:hover { color: var(--color-dark); border-color: var(--color-white); background: var(--color-white); }
.news-hero__tags { display: flex; gap: 12px; flex-wrap: wrap; }
.news-hero__tag { display: inline-block; padding: 6px 14px; background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.15); border-radius: var(--radius); font-size: 13px; font-weight: 500; color: rgba(255,255,255,0.8); }

/* --- Featured Articles --- */
.news-featured__grid { display: grid; grid-template-columns: 1.3fr 1fr; gap: 24px; }
.news-featured__main { position: relative; border-radius: var(--radius-lg); overflow: hidden; background: var(--color-light); min-height: 400px; display: flex; flex-direction: column; justify-content: flex-end; }
.news-featured__main-img { position: absolute; inset: 0; }
.news-featured__main-img img { width: 100%; height: 100%; object-fit: cover; }
.news-featured__main-overlay { position: absolute; inset: 0; background: linear-gradient(transparent 30%, rgba(0,0,0,0.75)); }
.news-featured__main-body { position: relative; z-index: 2; padding: 28px; }
.news-featured__main-cat { font-size: 12px; font-weight: 600; color: var(--color-primary-light); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 8px; }
.news-featured__main-title { font-family: var(--font-body); font-size: 24px; font-weight: 700; color: var(--color-white); margin-bottom: 8px; line-height: 1.3; }
.news-featured__main-excerpt { font-size: 14px; color: rgba(255,255,255,0.75); margin-bottom: 10px; line-height: 1.5; }
.news-featured__main-meta { display: flex; gap: 16px; font-size: 12px; color: rgba(255,255,255,0.6); }
.news-featured__side { display: flex; flex-direction: column; gap: 16px; }
.news-featured__side-card { display: flex; gap: 16px; padding: 16px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); transition: all var(--transition); }
.news-featured__side-card:hover { border-color: var(--color-primary); transform: translateY(-2px); }
.news-featured__side-img { width: 120px; height: 90px; flex-shrink: 0; border-radius: var(--radius); overflow: hidden; }
.news-featured__side-img img { width: 100%; height: 100%; object-fit: cover; }
.news-featured__side-cat { font-size: 11px; font-weight: 600; color: var(--color-primary); text-transform: uppercase; letter-spacing: 0.5px; }
.news-featured__side-title { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-text); margin: 4px 0; line-height: 1.35; }
.news-featured__side-meta { font-size: 12px; color: var(--color-metal); }

/* --- Categories --- */
.news-cats__grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
.news-cat-card { display: flex; flex-direction: column; align-items: center; padding: 24px 16px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); text-align: center; transition: all var(--transition); cursor: pointer; }
.news-cat-card:hover { border-color: var(--color-primary); transform: translateY(-3px); box-shadow: 0 6px 20px rgba(0,0,0,0.05); }
.news-cat-card__icon { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 50%; background: var(--color-light); color: var(--color-primary); margin-bottom: 12px; }
.news-cat-card:hover .news-cat-card__icon { background: var(--color-primary); color: var(--color-white); }
.news-cat-card__name { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.news-cat-card__desc { font-size: 12px; color: var(--color-text-secondary); margin-bottom: 8px; }
.news-cat-card__count { font-size: 12px; font-weight: 600; color: var(--color-primary); }

/* --- Search --- */
.news-search__header { text-align: center; margin-bottom: 28px; }
.news-search__title { font-family: var(--font-heading); font-size: 32px; font-weight: 700; color: var(--color-text); margin-bottom: 16px; }
.news-search__box { position: relative; max-width: 640px; margin: 0 auto 16px; }
.news-search__box input { width: 100%; padding: 14px 18px 14px 44px; border: 2px solid var(--color-border); border-radius: var(--radius-lg); font-size: 15px; font-family: var(--font-body); transition: border-color var(--transition); }
.news-search__box input:focus { outline: none; border-color: var(--color-primary); }
.news-search__box svg { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); color: var(--color-metal); }
.news-search__tags { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; }
.news-search__tag { padding: 6px 14px; border: 1px solid var(--color-border); border-radius: 20px; font-size: 13px; color: var(--color-text-secondary); cursor: pointer; transition: all var(--transition); background: var(--color-white); }
.news-search__tag:hover, .news-search__tag--active { border-color: var(--color-primary); color: var(--color-primary); background: rgba(200,16,46,0.04); }

/* --- Toolbar --- */
.news-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; flex-wrap: wrap; }
.news-toolbar__filters { display: flex; align-items: center; gap: 12px; flex: 1; flex-wrap: wrap; }
.news-toolbar__filter-btn { display: none; align-items: center; gap: 6px; padding: 10px 16px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 14px; font-weight: 500; color: var(--color-text); background: var(--color-white); }
.news-toolbar__active { display: flex; gap: 6px; flex-wrap: wrap; }
.news-toolbar__active-tag { display: inline-flex; align-items: center; gap: 5px; padding: 5px 10px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 12px; color: var(--color-text-secondary); }
.news-toolbar__active-tag button { color: var(--color-metal); font-size: 14px; }
.news-toolbar__active-tag button:hover { color: var(--color-primary); }
.news-toolbar__controls { display: flex; align-items: center; gap: 10px; }
.news-toolbar__sort select { padding: 8px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-family: var(--font-body); color: var(--color-text); background: var(--color-white); }
.news-toolbar__view { display: flex; border: 1px solid var(--color-border); border-radius: var(--radius); overflow: hidden; }
.news-toolbar__view-btn { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; color: var(--color-metal); background: var(--color-white); transition: all var(--transition); }
.news-toolbar__view-btn--active { color: var(--color-primary); background: var(--color-light); }
.news-toolbar__view-btn:hover { color: var(--color-primary); }
.news-toolbar__perpage select { padding: 8px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-family: var(--font-body); }
.news-toolbar__count { font-size: 14px; color: var(--color-text-secondary); margin-bottom: 16px; }

/* --- Article Card --- */
.news-listing { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; min-width: 0; }
.news-listing--list { grid-template-columns: 1fr; }
.news-listing--list .news-card { display: grid; grid-template-columns: minmax(240px, 32%) 1fr; gap: 20px; }
.news-card { background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden; transition: all var(--transition); }
.news-card:hover { transform: translateY(-4px); box-shadow: 0 8px 28px rgba(0,0,0,0.07); border-color: var(--color-primary); }
.news-card__img { width: 100%; height: auto; aspect-ratio: 16 / 10; overflow: hidden; position: relative; background: var(--color-light); }
.news-card__img img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--transition); }
.news-listing--list .news-card__img { height: 100%; min-height: 190px; aspect-ratio: auto; }
.news-card:hover .news-card__img img { transform: scale(1.04); }
.news-card__bookmark { position: absolute; top: 10px; right: 10px; width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; background: rgba(0,0,0,0.4); border-radius: 50%; color: var(--color-white); cursor: pointer; transition: all var(--transition); }
.news-card__bookmark:hover { background: var(--color-primary); }
.news-card__bookmark--saved { background: var(--color-primary); }
.news-card__body { padding: 18px; }
.news-card__meta { display: flex; gap: 10px; align-items: center; margin-bottom: 8px; flex-wrap: wrap; }
.news-card__cat { font-size: 11px; font-weight: 600; color: var(--color-primary); text-transform: uppercase; letter-spacing: 0.5px; }
.news-card__type { font-size: 11px; color: var(--color-metal); padding: 2px 8px; background: var(--color-light); border-radius: var(--radius); }
.news-card__date { font-size: 11px; color: var(--color-metal); }
.news-card__title { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 8px; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.news-card__title a { color: inherit; }
.news-card__title a:hover { color: var(--color-primary); }
.news-card__excerpt { font-size: 13px; color: var(--color-text-secondary); line-height: 1.5; margin-bottom: 10px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.news-card__tags { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; }
.news-card__tag { font-size: 11px; color: var(--color-metal); padding: 3px 8px; background: var(--color-light); border-radius: var(--radius); }
.news-card__footer { display: flex; justify-content: space-between; align-items: center; }
.news-card__read { font-size: 13px; font-weight: 600; color: var(--color-primary); display: inline-flex; align-items: center; gap: 4px; }
.news-card__read svg { transition: transform var(--transition); }
.news-card:hover .news-card__read svg { transform: translateX(4px); }
.news-card__actions { display: flex; gap: 8px; }
.news-card__action-btn { display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: var(--radius); color: var(--color-metal); transition: all var(--transition); }
.news-card__action-btn:hover { color: var(--color-primary); background: var(--color-light); }

/* --- Empty State --- */
.news-empty { text-align: center; padding: 48px 20px; }
.news-empty svg { color: var(--color-metal); margin-bottom: 16px; }
.news-empty h3 { font-family: var(--font-body); font-size: 18px; font-weight: 600; color: var(--color-text); margin-bottom: 8px; }
.news-empty p { font-size: 14px; color: var(--color-text-secondary); margin-bottom: 16px; }
.news-empty__actions { display: flex; gap: 12px; justify-content: center; }

/* --- Load More --- */
.news-load-more { text-align: center; margin-top: 28px; }

/* --- Buying Guides --- */
.news-buying { background: var(--color-dark); }
.news-buying__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-bottom: 28px; }
.news-buying__card { padding: 24px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius-lg); transition: all var(--transition); }
.news-buying__card:hover { border-color: var(--color-primary); }
.news-buying__num { font-family: var(--font-heading); font-size: 32px; font-weight: 800; color: var(--color-primary); opacity: 0.3; display: block; margin-bottom: 10px; }
.news-buying__card h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-white); margin-bottom: 8px; }
.news-buying__card p { font-size: 13px; color: rgba(255,255,255,0.6); line-height: 1.5; margin-bottom: 8px; }
.news-buying__card .news-card__read { color: var(--color-primary-light); }
.news-buying__cta { text-align: center; }
.news-buying__cta h3 { font-family: var(--font-body); font-size: 18px; font-weight: 600; color: var(--color-white); margin-bottom: 12px; }

/* --- Selection Topics --- */
.news-selection__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-bottom: 24px; }
.news-selection__card { padding: 22px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius-lg); transition: all var(--transition); }
.news-selection__card:hover { border-color: var(--color-primary); background: var(--color-white); }
.news-selection__icon { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: var(--radius); background: var(--color-white); color: var(--color-primary); margin-bottom: 12px; border: 1px solid var(--color-border); }
.news-selection__card:hover .news-selection__icon { background: var(--color-primary); color: var(--color-white); border-color: var(--color-primary); }
.news-selection__card h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 6px; }
.news-selection__card p { font-size: 13px; color: var(--color-text-secondary); margin-bottom: 10px; }
.news-selection__link { font-size: 13px; font-weight: 600; color: var(--color-primary); }
.news-selection__cta { text-align: center; }
.news-selection__cta p { font-size: 15px; color: var(--color-text-secondary); margin-bottom: 12px; }

/* --- Parts & Maintenance --- */
.news-parts { background: var(--color-light); }
.news-parts__inner { display: grid; grid-template-columns: 1fr 1.2fr; gap: 48px; align-items: center; }
.news-parts__inner > * { min-width: 0; }
.news-parts__image { border-radius: var(--radius-lg); overflow: hidden; }
.news-parts__image img { width: 100%; object-fit: cover; }
.news-parts__list { margin-bottom: 20px; }
.news-parts__list a { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--color-border); font-size: 14px; font-weight: 500; color: var(--color-text); transition: color var(--transition); }
.news-parts__list a:hover { color: var(--color-primary); }
.news-parts__list svg { flex-shrink: 0; color: var(--color-primary); }
.news-parts__actions { display: flex; gap: 12px; }

/* --- Implements --- */
.news-implements__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-bottom: 24px; }
.news-impl-card { display: flex; gap: 16px; padding: 18px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius-lg); transition: all var(--transition); }
.news-impl-card:hover { border-color: var(--color-primary); background: var(--color-white); }
.news-impl-card__icon { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: var(--radius); background: var(--color-white); color: var(--color-primary); flex-shrink: 0; border: 1px solid var(--color-border); }
.news-impl-card h3 { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.news-impl-card p { font-size: 12px; color: var(--color-text-secondary); }
.news-implements__action { text-align: center; }

/* --- Factory --- */
.news-factory { background: var(--color-dark); }
.news-factory__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; margin-bottom: 24px; }
.news-factory__card { display: flex; gap: 16px; padding: 18px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius-lg); transition: all var(--transition); }
.news-factory__card:hover { border-color: var(--color-primary); }
.news-factory__card h3 { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-white); margin-bottom: 4px; }
.news-factory__card p { font-size: 12px; color: rgba(255,255,255,0.6); }
.news-factory__actions { display: flex; gap: 12px; justify-content: center; }

/* --- OEM & Dealer --- */
.news-oem__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-bottom: 24px; }
.news-oem__card { padding: 20px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius-lg); transition: all var(--transition); }
.news-oem__card:hover { border-color: var(--color-primary); background: var(--color-white); }
.news-oem__card h3 { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-text); margin-bottom: 6px; }
.news-oem__card p { font-size: 13px; color: var(--color-text-secondary); }
.news-oem__actions { display: flex; gap: 12px; justify-content: center; }

/* --- Popular Guides --- */
.news-popular { background: var(--color-light); }
.news-popular__list { max-width: 800px; margin: 0 auto; }
.news-popular__item { display: flex; align-items: center; gap: 20px; padding: 18px 0; border-bottom: 1px solid var(--color-border); }
.news-popular__num { font-family: var(--font-heading); font-size: 28px; font-weight: 800; color: var(--color-primary); opacity: 0.3; min-width: 40px; }
.news-popular__info { flex: 1; }
.news-popular__info h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.news-popular__info h3 a { color: inherit; }
.news-popular__info h3 a:hover { color: var(--color-primary); }
.news-popular__meta { font-size: 12px; color: var(--color-metal); }

/* --- Newsletter --- */
.news-subscribe { background: var(--color-dark); }
.news-subscribe__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.news-subscribe__inner > * { min-width: 0; }
.news-subscribe__text { font-size: 16px; color: rgba(255,255,255,0.7); line-height: 1.7; }
.news-subscribe__form { background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.1); border-radius: var(--radius-lg); padding: 28px; }
.news-subscribe__form-title { font-family: var(--font-heading); font-size: 22px; font-weight: 700; color: var(--color-white); margin-bottom: 18px; }
.news-subscribe__honeypot { position: absolute; left: -9999px; height: 0; opacity: 0; }
.news-subscribe__form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 12px; }
.news-subscribe__field { display: flex; flex-direction: column; }
.news-subscribe__field label { font-size: 12px; font-weight: 500; color: rgba(255,255,255,0.8); margin-bottom: 4px; }
.news-subscribe__field input, .news-subscribe__field select { padding: 10px 12px; border: 1px solid rgba(255,255,255,0.15); border-radius: var(--radius); font-size: 13px; font-family: var(--font-body); color: var(--color-white); background: rgba(255,255,255,0.06); }
.news-subscribe__field input:focus, .news-subscribe__field select:focus { outline: none; border-color: var(--color-primary); }
.news-subscribe__field option { color: var(--color-text); background: var(--color-white); }
.news-subscribe__error { font-size: 11px; color: var(--color-primary-light); margin-top: 2px; min-height: 14px; }
.news-subscribe__field--full { grid-column: 1 / -1; margin-bottom: 12px; }
.news-subscribe__topics { display: flex; flex-wrap: wrap; gap: 10px; }
.news-subscribe__topics label { display: flex; align-items: center; gap: 6px; font-size: 13px; color: rgba(255,255,255,0.7); cursor: pointer; }
.news-subscribe__topics input { width: 15px; height: 15px; accent-color: var(--color-primary); }
.news-subscribe__checkbox { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; color: rgba(255,255,255,0.6); cursor: pointer; line-height: 1.4; }
.news-subscribe__checkbox input { margin-top: 2px; width: 14px; height: 14px; accent-color: var(--color-primary); }
.news-subscribe__submit { width: 100%; }
.news-subscribe__success { display: flex; align-items: center; gap: 10px; padding: 12px; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.15); border-radius: var(--radius); margin-top: 12px; }
.news-subscribe__success svg { color: var(--color-success); flex-shrink: 0; }
.news-subscribe__success p { font-size: 13px; color: rgba(255,255,255,0.8); }

/* --- Product CTA --- */
.news-product-cta__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.news-product-cta__card { display: block; border-radius: var(--radius-lg); overflow: hidden; border: 1px solid var(--color-border); transition: all var(--transition); }
.news-product-cta__card:hover { transform: translateY(-4px); box-shadow: 0 8px 24px rgba(0,0,0,0.06); border-color: var(--color-primary); }
.news-product-cta__img { height: 180px; overflow: hidden; }
.news-product-cta__img img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--transition); }
.news-product-cta__card:hover .news-product-cta__img img { transform: scale(1.04); }
.news-product-cta__card h3 { font-family: var(--font-body); font-size: 17px; font-weight: 600; color: var(--color-text); padding: 16px 18px; }

/* --- News FAQ --- */
.news-faq .faq__list { max-width: 800px; margin: 0 auto 24px; }

/* --- Bottom CTA --- */
.news-cta { position: relative; overflow: hidden; padding: 80px 0; }
.news-cta__bg { position: absolute; inset: 0; }
.news-cta__bg img { width: 100%; height: 100%; object-fit: cover; }
.news-cta__overlay { position: absolute; inset: 0; background: rgba(17,24,32,0.88); }
.news-cta__inner { position: relative; z-index: 2; display: grid; grid-template-columns: 1fr 1.1fr; gap: 48px; align-items: flex-start; }
.news-cta__text { font-size: 16px; color: rgba(255,255,255,0.75); line-height: 1.7; margin-bottom: 20px; }
.news-cta__tags { display: flex; flex-direction: column; gap: 10px; }
.news-cta__tags span { display: flex; align-items: center; gap: 10px; padding: 10px 16px; background: rgba(255,255,255,0.06); border-radius: var(--radius); font-size: 13px; color: rgba(255,255,255,0.85); border: 1px solid rgba(255,255,255,0.1); }
.news-cta__tags span::before { content: ''; width: 7px; height: 7px; background: var(--color-primary); border-radius: 50%; flex-shrink: 0; }
.news-cta__form { background: var(--color-white); padding: 32px; border-radius: var(--radius-lg); }
.news-cta__form-title { font-family: var(--font-heading); font-size: 24px; font-weight: 700; color: var(--color-text); margin-bottom: 20px; }
.news-cta__honeypot { position: absolute; left: -9999px; height: 0; opacity: 0; }
.news-cta__form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 12px; }
.news-cta__field { display: flex; flex-direction: column; }
.news-cta__field label { font-size: 12px; font-weight: 500; color: var(--color-text); margin-bottom: 4px; }
.news-cta__field input, .news-cta__field select, .news-cta__field textarea { padding: 10px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-family: var(--font-body); color: var(--color-text); background: var(--color-white); }
.news-cta__field input:focus, .news-cta__field select:focus, .news-cta__field textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 2px rgba(200,16,46,0.1); }
.news-cta__field input.error { border-color: var(--color-primary); }
.news-cta__error { font-size: 11px; color: var(--color-primary); margin-top: 2px; min-height: 14px; }
.news-cta__field--full { grid-column: 1 / -1; margin-bottom: 12px; }
.news-cta__checkbox { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; color: var(--color-text-secondary); cursor: pointer; line-height: 1.4; }
.news-cta__checkbox input { margin-top: 2px; width: 14px; height: 14px; accent-color: var(--color-primary); }
.news-cta__submit { width: 100%; }
.news-cta__success { display: flex; align-items: center; gap: 10px; padding: 14px; background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: var(--radius); margin-top: 12px; }
.news-cta__success svg { color: var(--color-success); flex-shrink: 0; }
.news-cta__success p { font-size: 13px; color: #166534; font-weight: 500; }

/* --- Saved Drawer --- */
.saved-drawer { position: fixed; inset: 0; z-index: 1000; }
.saved-drawer[hidden] { display: none; }
.saved-drawer__overlay { position: absolute; inset: 0; background: rgba(0,0,0,0.5); }
.saved-drawer__panel { position: absolute; top: 0; right: 0; bottom: 0; width: 380px; max-width: 90vw; background: var(--color-white); display: flex; flex-direction: column; transform: translateX(100%); transition: transform 300ms ease; }
.saved-drawer.open .saved-drawer__panel { transform: translateX(0); }
.saved-drawer__header { display: flex; justify-content: space-between; align-items: center; padding: 20px 24px; border-bottom: 1px solid var(--color-border); }
.saved-drawer__title { font-family: var(--font-heading); font-size: 20px; font-weight: 700; }
.saved-drawer__close { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; }
.saved-drawer__body { flex: 1; overflow-y: auto; padding: 16px 24px; }
.saved-drawer__empty { text-align: center; padding: 40px 20px; color: var(--color-metal); }
.saved-drawer__empty p { font-size: 14px; margin-top: 8px; }
.saved-drawer__item { display: flex; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--color-light); }
.saved-drawer__item-img { width: 60px; height: 45px; border-radius: var(--radius); overflow: hidden; flex-shrink: 0; }
.saved-drawer__item-img img { width: 100%; height: 100%; object-fit: cover; }
.saved-drawer__item-info { flex: 1; min-width: 0; }
.saved-drawer__item-title { font-size: 13px; font-weight: 600; color: var(--color-text); margin-bottom: 2px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.saved-drawer__item-cat { font-size: 11px; color: var(--color-metal); }
.saved-drawer__item-remove { color: var(--color-metal); font-size: 16px; flex-shrink: 0; cursor: pointer; }
.saved-drawer__item-remove:hover { color: var(--color-primary); }

/* ============================
   NEWS RESPONSIVE
   ============================ */
@media (max-width: 1199px) {
  .news-hero { height: 500px; }
  .news-hero__title { font-size: 42px; }
  .news-cats__grid { grid-template-columns: repeat(4, 1fr); }
  .news-featured__grid { grid-template-columns: 1fr 1fr; }
  .news-listing { grid-template-columns: repeat(2, 1fr); }
  .news-buying__grid { grid-template-columns: repeat(2, 1fr); }
  .news-selection__grid { grid-template-columns: repeat(2, 1fr); }
  .news-implements__grid { grid-template-columns: repeat(2, 1fr); }
  .news-oem__grid { grid-template-columns: repeat(2, 1fr); }
  .news-product-cta__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 991px) {
  .news-hero { height: 460px; }
  .news-hero__title { font-size: 36px; }
  .news-parts__inner { grid-template-columns: 1fr; }
  .news-subscribe__inner { grid-template-columns: 1fr; }
  .news-cta__inner { grid-template-columns: 1fr; }
  .news-featured__grid { grid-template-columns: 1fr; }
  .news-listing--list .news-card { grid-template-columns: 1fr; }
  .news-toolbar__filter-btn { display: flex; }
}

@media (max-width: 767px) {
  .news-hero { height: 440px; }
  .news-hero__title { font-size: 32px; }
  .news-hero__desc { font-size: 15px; }
  .news-hero__buttons { flex-direction: column; gap: 10px; }
  .news-hero__buttons .btn { width: 100%; }
  .news-cats__grid { grid-template-columns: repeat(2, 1fr); }
  .news-listing { grid-template-columns: 1fr; }
  .news-toolbar { flex-direction: column; align-items: stretch; }
  .news-toolbar__controls { flex-wrap: wrap; }
  .news-buying__grid { grid-template-columns: 1fr; }
  .news-selection__grid { grid-template-columns: 1fr; }
  .news-implements__grid { grid-template-columns: 1fr; }
  .news-factory__grid { grid-template-columns: 1fr; }
  .news-oem__grid { grid-template-columns: 1fr; }
  .news-product-cta__grid { grid-template-columns: 1fr; }
  .news-subscribe__form-grid { grid-template-columns: 1fr; }
  .news-subscribe__topics { gap: 8px; }
  .news-cta__form-grid { grid-template-columns: 1fr; }
  .news-cta__form { padding: 20px; }
  .news-parts__actions { flex-direction: column; }
  .news-oem__actions, .news-factory__actions { flex-direction: column; align-items: center; }
  .saved-drawer__panel { width: 100%; max-width: 100%; }
}

@media (max-width: 479px) {
  .news-hero { height: 420px; }
  .news-hero__title { font-size: 28px; }
  .news-cats__grid { grid-template-columns: 1fr; }
  .news-search__box input { font-size: 14px; }
}

/* ============================================
   NEWS DETAIL PAGE STYLES
   ============================================ */

/* --- Reading Progress Bar --- */
.nd-progress { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 95; background: transparent; }
.nd-progress__bar { height: 100%; background: var(--color-primary); width: 0; transition: width 100ms linear; }

/* --- Article Header --- */
.nd-header { padding: 48px 0 32px; }
.nd-header__inner { max-width: 900px; margin: 0 auto; }
.nd-header__meta { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 16px; }
.nd-header__cat { font-size: 12px; font-weight: 600; color: var(--color-primary); text-transform: uppercase; letter-spacing: 1px; padding: 4px 12px; background: rgba(200,16,46,0.06); border-radius: var(--radius); }
.nd-header__type { font-size: 12px; color: var(--color-metal); padding: 4px 10px; background: var(--color-light); border-radius: var(--radius); }
.nd-header__date, .nd-header__time, .nd-header__diff { font-size: 12px; color: var(--color-metal); }
.nd-header__title { font-family: var(--font-heading); font-size: 48px; font-weight: 800; color: var(--color-text); line-height: 1.1; margin-bottom: 16px; letter-spacing: -0.3px; }
.nd-header__excerpt { font-size: 18px; color: var(--color-text-secondary); line-height: 1.7; margin-bottom: 10px; }
.nd-header__audience { font-size: 13px; color: var(--color-metal); margin-bottom: 20px; }
.nd-header__actions { display: flex; gap: 10px; flex-wrap: wrap; }

/* --- Hero Image --- */
.nd-hero-img { background: var(--color-light); padding-bottom: 24px; }
.nd-hero-img .container { max-width: 1100px; }
.nd-hero-img img { width: 100%; border-radius: var(--radius-lg); object-fit: cover; aspect-ratio: 16/9; }
.nd-hero-img__caption { font-size: 13px; color: var(--color-metal); text-align: center; margin-top: 10px; }

/* --- Summary --- */
.nd-summary__box { max-width: 900px; margin: 0 auto; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 28px 32px; }
.nd-summary__title { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-primary); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 14px; }
.nd-summary__list { list-style: none; margin-bottom: 20px; }
.nd-summary__list li { font-size: 15px; color: var(--color-text); padding: 6px 0 6px 20px; position: relative; }
.nd-summary__list li::before { content: ''; position: absolute; left: 0; top: 12px; width: 8px; height: 8px; background: var(--color-primary); border-radius: 50%; }
.nd-summary__recommend { background: var(--color-light); padding: 18px; border-radius: var(--radius); border-left: 4px solid var(--color-primary); }
.nd-summary__recommend h3 { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-text); margin-bottom: 6px; }
.nd-summary__recommend p { font-size: 14px; color: var(--color-text-secondary); margin-bottom: 12px; }

/* --- Article Body Layout --- */
.nd-body { padding: 48px 0; }
.nd-body__layout { display: grid; grid-template-columns: 80px 1fr 280px; gap: 28px; max-width: 1200px; margin: 0 auto; align-items: flex-start; }

/* --- Left Share Sidebar --- */
.nd-share { position: sticky; top: 100px; }
.nd-share__inner { display: flex; flex-direction: column; gap: 12px; }
.nd-share__btn { display: flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--color-border); color: var(--color-metal); background: var(--color-white); transition: all var(--transition); }
.nd-share__btn:hover { color: var(--color-primary); border-color: var(--color-primary); }
.nd-share__btn[aria-pressed="true"] { color: var(--color-primary); background: rgba(200,16,46,0.06); border-color: var(--color-primary); }

/* --- Article Content --- */
.nd-content { max-width: 780px; min-width: 0; }
.nd-content h2 { font-family: var(--font-heading); font-size: 30px; font-weight: 700; color: var(--color-text); margin: 40px 0 16px; padding-top: 24px; letter-spacing: -0.2px; }
.nd-content h3 { font-family: var(--font-body); font-size: 20px; font-weight: 600; color: var(--color-text); margin: 28px 0 12px; }
.nd-content p { font-size: 17px; color: var(--color-text); line-height: 1.85; margin-bottom: 16px; }
.nd-content ul, .nd-content ol { margin-bottom: 16px; padding-left: 24px; }
.nd-content li { font-size: 17px; color: var(--color-text); line-height: 1.75; margin-bottom: 8px; }
.nd-content strong { color: var(--color-text); font-weight: 600; }
.nd-content a { color: var(--color-primary); text-decoration: underline; text-underline-offset: 3px; }
.nd-content a:hover { color: var(--color-primary-dark); }

/* --- Notes --- */
.nd-note { padding: 16px 20px; border-radius: var(--radius); margin: 20px 0; font-size: 15px; line-height: 1.6; display: flex; gap: 12px; }
.nd-note strong { display: block; margin-bottom: 4px; }
.nd-note--technical { background: #f0f4f8; border-left: 4px solid var(--color-info); color: #1e3a5f; }
.nd-note--warning { background: #fff8e1; border-left: 4px solid var(--color-warning); color: #7c5c00; }
.nd-note--tip { background: #f0fdf4; border-left: 4px solid var(--color-success); color: #166534; }
.nd-note--info { background: #f0f4f8; border-left: 4px solid var(--color-info); color: #1e3a5f; }
.nd-note--recommend { background: rgba(200,16,46,0.06); border-left: 4px solid var(--color-primary); color: var(--color-text); }

/* --- Tables --- */
.nd-table-wrap { overflow-x: auto; margin: 20px 0; -webkit-overflow-scrolling: touch; }
.nd-table-hint { font-size: 12px; color: var(--color-metal); margin-bottom: 8px; display: none; }
.nd-table { width: 100%; border-collapse: collapse; min-width: 500px; }
.nd-table caption { font-size: 13px; color: var(--color-metal); text-align: left; margin-bottom: 8px; font-weight: 500; }
.nd-table th { padding: 12px 16px; background: var(--color-dark); color: var(--color-white); font-size: 13px; font-weight: 600; text-align: left; }
.nd-table td { padding: 12px 16px; border-bottom: 1px solid var(--color-border); font-size: 14px; color: var(--color-text-secondary); }
.nd-table tr:hover td { background: var(--color-light); }

/* --- HP Cards --- */
.nd-hp-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin: 20px 0; }
.nd-hp-card { padding: 18px; background: var(--color-light); border-radius: var(--radius-lg); border-top: 3px solid var(--color-primary); }
.nd-hp-card__range { font-family: var(--font-heading); font-size: 20px; font-weight: 700; color: var(--color-primary); display: block; margin-bottom: 8px; }
.nd-hp-card p { font-size: 13px; color: var(--color-text-secondary); margin-bottom: 6px; }
.nd-hp-card strong { color: var(--color-text); }

/* --- Checklist --- */
.nd-checklist { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin: 16px 0; }
.nd-checklist label { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--color-text-secondary); padding: 6px 0; }
.nd-checklist input { width: 16px; height: 16px; accent-color: var(--color-primary); }
.nd-copy-success { font-size: 13px; color: var(--color-success); margin-top: 8px; }

/* --- Right TOC Sidebar --- */
.nd-toc { position: sticky; top: 100px; }
.nd-toc__inner { background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 20px; max-height: calc(100vh - 120px); overflow-y: auto; }
.nd-toc__title { font-family: var(--font-body); font-size: 13px; font-weight: 600; color: var(--color-text); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 14px; }
.nd-toc__nav a { display: block; padding: 6px 0 6px 14px; font-size: 13px; color: var(--color-text-secondary); border-left: 2px solid transparent; transition: all var(--transition); }
.nd-toc__nav a:hover { color: var(--color-primary); }
.nd-toc__nav a.active { color: var(--color-primary); border-left-color: var(--color-primary); font-weight: 600; }
.nd-toc__nav a.nd-toc__sub { padding-left: 28px; font-size: 12px; }

/* --- Related Products --- */
.nd-related-products__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-bottom: 12px; }
.nd-related-products__note { text-align: center; font-size: 12px; color: var(--color-metal); margin-bottom: 16px; }
.nd-related-products__action { text-align: center; }

/* --- Related Implements --- */
.nd-related-implements__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-bottom: 24px; }
.nd-impl-card { display: flex; gap: 14px; padding: 16px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); transition: all var(--transition); }
.nd-impl-card:hover { border-color: var(--color-primary); }
.nd-impl-card__icon { display: flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: var(--radius); background: var(--color-light); color: var(--color-primary); flex-shrink: 0; }
.nd-impl-card h3 { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-text); margin-bottom: 2px; }
.nd-impl-card p { font-size: 12px; color: var(--color-text-secondary); }
.nd-related-implements__action { text-align: center; }

/* --- Related Parts --- */
.nd-related-parts__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 24px; }
.nd-part-card { display: flex; gap: 14px; padding: 14px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius-lg); transition: all var(--transition); }
.nd-part-card:hover { border-color: var(--color-primary); background: var(--color-white); }
.nd-part-card__img { width: 72px; aspect-ratio: 3 / 2; background: var(--color-white); border-radius: var(--radius); overflow: hidden; flex-shrink: 0; }
.nd-part-card__img img { width: 100%; height: 100%; object-fit: cover; }
.nd-part-card h3 { font-family: var(--font-body); font-size: 13px; font-weight: 600; color: var(--color-text); margin-bottom: 2px; }
.nd-part-card p { font-size: 11px; color: var(--color-metal); }
.nd-related-parts__action { text-align: center; }

/* --- Downloads --- */
.nd-downloads { background: var(--color-dark); }
.nd-downloads__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 16px; }
.nd-downloads__card { display: flex; align-items: center; gap: 14px; padding: 18px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius-lg); transition: all var(--transition); }
.nd-downloads__card:hover { border-color: var(--color-primary); }
.nd-downloads__card svg { color: var(--color-primary); flex-shrink: 0; }
.nd-downloads__card h3 { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-white); }
.nd-downloads__note { text-align: center; font-size: 13px; color: rgba(255,255,255,0.5); }

/* --- FAQ --- */
.nd-faq .faq__list { max-width: 800px; margin: 0 auto 24px; }

/* --- Author --- */
.nd-author__inner { max-width: 800px; margin: 0 auto; }
.nd-author__title { font-family: var(--font-body); font-size: 13px; font-weight: 600; color: var(--color-primary); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 10px; }
.nd-author__name { font-family: var(--font-body); font-size: 20px; font-weight: 600; color: var(--color-text); margin-bottom: 8px; }
.nd-author__desc { font-size: 15px; color: var(--color-text-secondary); line-height: 1.6; margin-bottom: 16px; }
.nd-author__meta { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.nd-author__meta > div { padding: 12px; background: var(--color-light); border-radius: var(--radius); }
.nd-author__meta span { display: block; font-size: 11px; color: var(--color-metal); text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 4px; }
.nd-author__meta strong { font-size: 14px; color: var(--color-text); font-weight: 500; }

/* --- Review Notice --- */
.nd-review__box { max-width: 800px; margin: 0 auto; padding: 20px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); border-left: 4px solid var(--color-warning); }
.nd-review__box h3 { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-warning); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 8px; }
.nd-review__box p { font-size: 14px; color: var(--color-text-secondary); line-height: 1.6; margin-bottom: 8px; }

/* --- Related Articles --- */
.nd-related-articles__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-bottom: 24px; }
.nd-related-articles__action { text-align: center; }

/* --- Prev / Next --- */
.nd-nav__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.nd-nav__prev, .nd-nav__next { padding: 20px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); transition: all var(--transition); }
.nd-nav__prev:hover, .nd-nav__next:hover { border-color: var(--color-primary); }
.nd-nav__label { font-size: 12px; font-weight: 600; color: var(--color-metal); text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 6px; display: block; }
.nd-nav__title { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-text); }
.nd-nav__title a { color: inherit; }
.nd-nav__title a:hover { color: var(--color-primary); }
.nd-nav__next { text-align: right; }

/* --- Newsletter --- */
.nd-subscribe { background: var(--color-dark); }
.nd-subscribe__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; }
.nd-subscribe__inner > * { min-width: 0; }
.nd-subscribe__text { font-size: 15px; color: rgba(255,255,255,0.7); line-height: 1.7; }
.nd-subscribe__form { background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.1); border-radius: var(--radius-lg); padding: 24px; }
.nd-subscribe__honeypot { position: absolute; left: -9999px; height: 0; opacity: 0; }
.nd-subscribe__form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 12px; }
.nd-subscribe__field { display: flex; flex-direction: column; }
.nd-subscribe__field label { font-size: 12px; font-weight: 500; color: rgba(255,255,255,0.8); margin-bottom: 4px; }
.nd-subscribe__field input { padding: 10px 12px; border: 1px solid rgba(255,255,255,0.15); border-radius: var(--radius); font-size: 13px; font-family: var(--font-body); color: var(--color-white); background: rgba(255,255,255,0.06); }
.nd-subscribe__field input:focus { outline: none; border-color: var(--color-primary); }
.nd-subscribe__error { font-size: 11px; color: var(--color-primary-light); margin-top: 2px; }
.nd-subscribe__checkbox { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; color: rgba(255,255,255,0.6); cursor: pointer; margin-bottom: 12px; }
.nd-subscribe__checkbox input { margin-top: 2px; accent-color: var(--color-primary); }
.nd-subscribe__submit { width: 100%; }
.nd-subscribe__success { display: flex; align-items: center; gap: 10px; padding: 12px; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.15); border-radius: var(--radius); margin-top: 12px; }
.nd-subscribe__success svg { color: var(--color-success); }
.nd-subscribe__success p { font-size: 13px; color: rgba(255,255,255,0.8); }

/* --- Ask Question --- */
.nd-question { background: var(--color-light); }
.nd-question__inner { display: grid; grid-template-columns: 1fr 1.2fr; gap: 40px; align-items: flex-start; }
.nd-question__inner > * { min-width: 0; }
.nd-question__content p { font-size: 15px; color: var(--color-text-secondary); line-height: 1.7; }
.nd-question__form { background: var(--color-white); padding: 28px; border-radius: var(--radius-lg); border: 1px solid var(--color-border); }
.nd-question__honeypot { position: absolute; left: -9999px; height: 0; opacity: 0; }
.nd-question__form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 12px; }
.nd-question__field { display: flex; flex-direction: column; }
.nd-question__field label { font-size: 12px; font-weight: 500; color: var(--color-text); margin-bottom: 4px; }
.nd-question__field input, .nd-question__field select, .nd-question__field textarea { padding: 10px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-family: var(--font-body); color: var(--color-text); background: var(--color-white); }
.nd-question__field input:focus, .nd-question__field select:focus, .nd-question__field textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 2px rgba(200,16,46,0.1); }
.nd-question__field input.error { border-color: var(--color-primary); }
.nd-question__error { font-size: 11px; color: var(--color-primary); margin-top: 2px; }
.nd-question__field--full { grid-column: 1 / -1; margin-bottom: 12px; }
.nd-question__checkbox { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; color: var(--color-text-secondary); cursor: pointer; }
.nd-question__checkbox input { margin-top: 2px; accent-color: var(--color-primary); }
.nd-question__submit { width: 100%; }
.nd-question__success { display: flex; align-items: center; gap: 10px; padding: 14px; background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: var(--radius); margin-top: 12px; }
.nd-question__success svg { color: var(--color-success); }
.nd-question__success p { font-size: 13px; color: #166534; font-weight: 500; }

/* --- Bottom CTA --- */
.nd-cta { position: relative; overflow: hidden; padding: 80px 0; }
.nd-cta__bg { position: absolute; inset: 0; }
.nd-cta__bg img { width: 100%; height: 100%; object-fit: cover; }
.nd-cta__overlay { position: absolute; inset: 0; background: rgba(17,24,32,0.88); }
.nd-cta__inner { position: relative; z-index: 2; display: grid; grid-template-columns: 1fr 1.1fr; gap: 48px; align-items: flex-start; }
.nd-cta__text { font-size: 16px; color: rgba(255,255,255,0.75); line-height: 1.7; margin-bottom: 20px; }
.nd-cta__tags { display: flex; flex-direction: column; gap: 10px; }
.nd-cta__tags span { display: flex; align-items: center; gap: 10px; padding: 10px 16px; background: rgba(255,255,255,0.06); border-radius: var(--radius); font-size: 13px; color: rgba(255,255,255,0.85); border: 1px solid rgba(255,255,255,0.1); }
.nd-cta__tags span::before { content: ''; width: 7px; height: 7px; background: var(--color-primary); border-radius: 50%; flex-shrink: 0; }
.nd-cta__form { background: var(--color-white); padding: 32px; border-radius: var(--radius-lg); }
.nd-cta__form-title { font-family: var(--font-heading); font-size: 24px; font-weight: 700; color: var(--color-text); margin-bottom: 20px; }
.nd-cta__honeypot { position: absolute; left: -9999px; height: 0; opacity: 0; }
.nd-cta__form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 12px; }
.nd-cta__field { display: flex; flex-direction: column; }
.nd-cta__field label { font-size: 12px; font-weight: 500; color: var(--color-text); margin-bottom: 4px; }
.nd-cta__field input, .nd-cta__field select, .nd-cta__field textarea { padding: 10px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-family: var(--font-body); color: var(--color-text); background: var(--color-white); }
.nd-cta__field input:focus, .nd-cta__field select:focus, .nd-cta__field textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 2px rgba(200,16,46,0.1); }
.nd-cta__field input.error { border-color: var(--color-primary); }
.nd-cta__error { font-size: 11px; color: var(--color-primary); margin-top: 2px; }
.nd-cta__field--full { grid-column: 1 / -1; margin-bottom: 12px; }
.nd-cta__checkbox { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; color: var(--color-text-secondary); cursor: pointer; }
.nd-cta__checkbox input { margin-top: 2px; accent-color: var(--color-primary); }
.nd-cta__submit { width: 100%; }
.nd-cta__success { display: flex; align-items: center; gap: 10px; padding: 14px; background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: var(--radius); margin-top: 12px; }
.nd-cta__success svg { color: var(--color-success); }
.nd-cta__success p { font-size: 13px; color: #166534; font-weight: 500; }

/* --- Print Styles --- */
@media print {
  .top-bar, .header, .mobile-menu, .floating, .mobile-bar, .nd-progress, .nd-share, .nd-toc,
  .nd-subscribe, .nd-question, .nd-cta, .footer, .lightbox, .saved-drawer, .filter-drawer,
  .nd-header__actions, .nd-related-articles, .nd-nav, .nd-downloads { display: none !important; }
  .nd-body__layout { grid-template-columns: 1fr !important; }
  .nd-content { max-width: 100% !important; }
  .nd-content h2 { page-break-after: avoid; }
  .nd-table { page-break-inside: avoid; }
  body { font-size: 12pt; color: #000; }
  .nd-note { border: 1px solid #ccc; }
  a[href]::after { content: " (" attr(href) ")"; font-size: 10pt; color: #666; }
}

/* ============================
   NEWS DETAIL RESPONSIVE
   ============================ */
@media (max-width: 1199px) {
  .nd-body__layout { grid-template-columns: 60px 1fr 240px; gap: 20px; }
  .nd-header__title { font-size: 42px; }
  .nd-related-products__grid { grid-template-columns: repeat(3, 1fr); }
  .nd-related-articles__grid { grid-template-columns: repeat(3, 1fr); }
  .nd-hp-cards { grid-template-columns: repeat(2, 1fr); }
  .nd-downloads__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 991px) {
  .nd-body__layout { grid-template-columns: 1fr; }
  .nd-share { display: none; }
  .nd-toc { display: none; }
  .nd-header__title { font-size: 36px; }
  .nd-question__inner { grid-template-columns: 1fr; }
  .nd-cta__inner { grid-template-columns: 1fr; }
  .nd-subscribe__inner { grid-template-columns: 1fr; }
  .nd-related-products__grid { grid-template-columns: repeat(2, 1fr); }
  .nd-related-implements__grid { grid-template-columns: repeat(2, 1fr); }
  .nd-related-parts__grid { grid-template-columns: repeat(2, 1fr); }
  .nd-related-articles__grid { grid-template-columns: repeat(2, 1fr); }
  .nd-author__meta { grid-template-columns: 1fr; }
  #mobile-toc-btn { display: flex !important; }
  #mobile-save-btn { display: flex !important; }
}

@media (max-width: 767px) {
  .nd-header { padding: 32px 0 24px; }
  .nd-header__title { font-size: 30px; }
  .nd-header__excerpt { font-size: 16px; }
  .nd-header__actions { flex-wrap: wrap; }
  .nd-content p, .nd-content li { font-size: 16px; }
  .nd-content h2 { font-size: 24px; }
  .nd-hp-cards { grid-template-columns: 1fr; }
  .nd-checklist { grid-template-columns: 1fr; }
  .nd-question__form-grid { grid-template-columns: 1fr; }
  .nd-cta__form-grid { grid-template-columns: 1fr; }
  .nd-cta__form { padding: 20px; }
  .nd-subscribe__form-grid { grid-template-columns: 1fr; }
  .nd-related-products__grid { grid-template-columns: 1fr; }
  .nd-related-implements__grid { grid-template-columns: 1fr; }
  .nd-related-parts__grid { grid-template-columns: 1fr; }
  .nd-related-articles__grid { grid-template-columns: 1fr; }
  .nd-nav__inner { grid-template-columns: 1fr; }
  .nd-downloads__grid { grid-template-columns: 1fr; }
  .nd-summary__box { padding: 20px; }
  .nd-table-hint { display: block; }
  .mobile-bar__btn { display: flex !important; }
}

@media (max-width: 479px) {
  .nd-header__title { font-size: 26px; }
  .nd-hero-img img { aspect-ratio: 16/10; }
}

/* ============================================
   CONTACT PAGE STYLES
   ============================================ */

/* --- Contact Hero --- */
.ct-hero { position: relative; height: 560px; overflow: hidden; display: flex; align-items: flex-end; }
.ct-hero__bg { position: absolute; inset: 0; }
.ct-hero__bg-img { width: 100%; height: 100%; object-fit: cover; }
.ct-hero__overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(17,24,32,0.88) 0%, rgba(17,24,32,0.6) 50%, rgba(17,24,32,0.2) 100%); }
.ct-hero__content { position: relative; z-index: 2; padding-bottom: 50px; max-width: 720px; }
.ct-hero__breadcrumb { display: flex; align-items: center; gap: 8px; font-size: 13px; color: rgba(255,255,255,0.6); margin-bottom: 14px; }
.ct-hero__breadcrumb a { color: rgba(255,255,255,0.6); }
.ct-hero__breadcrumb a:hover { color: var(--color-white); }
.ct-hero__breadcrumb span:last-child { color: var(--color-white); }
.ct-hero__eyebrow { display: block; font-size: 13px; font-weight: 600; letter-spacing: 2px; color: var(--color-primary-light); margin-bottom: 12px; }
.ct-hero__title { font-family: var(--font-heading); font-size: 50px; font-weight: 800; color: var(--color-white); line-height: 1.08; margin-bottom: 16px; }
.ct-hero__desc { font-size: 17px; color: rgba(255,255,255,0.8); line-height: 1.7; margin-bottom: 24px; }
.ct-hero__buttons { display: flex; gap: 12px; margin-bottom: 24px; flex-wrap: wrap; }
.ct-hero__tags { display: flex; gap: 12px; flex-wrap: wrap; }
.ct-hero__tag { display: inline-block; padding: 6px 14px; background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.15); border-radius: var(--radius); font-size: 13px; font-weight: 500; color: rgba(255,255,255,0.8); }

/* --- Quick Contact --- */
.ct-quick__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.ct-quick__card { padding: 24px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius-lg); text-align: center; transition: all var(--transition); }
.ct-quick__card:hover { border-color: var(--color-primary); background: var(--color-white); transform: translateY(-3px); }
.ct-quick__icon { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 50%; background: var(--color-white); color: var(--color-primary); margin: 0 auto 12px; border: 1px solid var(--color-border); }
.ct-quick__card:hover .ct-quick__icon { background: var(--color-primary); color: var(--color-white); border-color: var(--color-primary); }
.ct-quick__card h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.ct-quick__value { font-size: 14px; font-weight: 600; color: var(--color-primary); margin-bottom: 6px; }
.ct-quick__desc { font-size: 13px; color: var(--color-text-secondary); margin-bottom: 14px; line-height: 1.5; }
.ct-quick__card .btn.btn--outline-dark.btn--sm,
.ct-catalogs__card .btn.btn--outline-dark.btn--sm,
.ct-location__actions .btn.btn--outline-dark.btn--sm {
  color: var(--color-primary);
  background: var(--color-white);
  border-color: rgba(200, 16, 46, 0.35);
}
.ct-quick__card .btn.btn--outline-dark.btn--sm:hover,
.ct-catalogs__card .btn.btn--outline-dark.btn--sm:hover,
.ct-location__actions .btn.btn--outline-dark.btn--sm:hover {
  color: var(--color-white);
  background: var(--color-primary);
  border-color: var(--color-primary);
}
.ct-location__actions .btn.btn--outline-dark.btn--sm:disabled {
  color: var(--color-metal);
  background: var(--color-white);
  border-color: var(--color-border);
  opacity: 1;
  cursor: not-allowed;
}

/* --- Inquiry Type Selector --- */
.ct-types__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.ct-type-card { padding: 24px 18px; background: var(--color-white); border: 2px solid var(--color-border); border-radius: var(--radius-lg); cursor: pointer; transition: all var(--transition); text-align: center; }
.ct-type-card:hover { border-color: var(--color-primary); transform: translateY(-3px); }
.ct-type-card--active { border-color: var(--color-primary); background: rgba(200,16,46,0.03); }
.ct-type-card__icon { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 50%; background: var(--color-light); color: var(--color-primary); margin: 0 auto 12px; }
.ct-type-card--active .ct-type-card__icon { background: var(--color-primary); color: var(--color-white); }
.ct-type-card h3 { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-text); margin-bottom: 6px; }
.ct-type-card p { font-size: 12px; color: var(--color-text-secondary); margin-bottom: 8px; line-height: 1.4; }
.ct-type-card__btn { font-size: 12px; font-weight: 600; color: var(--color-primary); }

/* --- Forms Area --- */
.ct-forms__progress { margin-bottom: 16px; }
.ct-forms__progress-bar { height: 4px; background: var(--color-border); border-radius: 2px; overflow: hidden; margin-bottom: 6px; }
.ct-forms__progress-fill { height: 100%; background: var(--color-primary); transition: width 300ms ease; }
.ct-forms__progress-text { font-size: 12px; color: var(--color-metal); }
.ct-forms__help { font-size: 14px; color: var(--color-text-secondary); margin-bottom: 24px; text-align: center; }

/* --- Form Styles --- */
.ct-form { background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 32px; max-width: 900px; margin: 0 auto; }
.ct-form__title { font-family: var(--font-heading); font-size: 28px; font-weight: 700; color: var(--color-text); margin-bottom: 8px; }
.ct-form__desc { font-size: 15px; color: var(--color-text-secondary); margin-bottom: 24px; line-height: 1.6; }
.ct-form__step-title { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin: 24px 0 14px; padding-top: 16px; border-top: 1px solid var(--color-border); }
.ct-form__step-title:first-of-type { border-top: none; margin-top: 0; padding-top: 0; }
.ct-form__honeypot { position: absolute; left: -9999px; height: 0; opacity: 0; }
.ct-form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px; }
.ct-form__field { display: flex; flex-direction: column; }
.ct-form__field label { font-size: 13px; font-weight: 500; color: var(--color-text); margin-bottom: 4px; }
.ct-form__field input, .ct-form__field select, .ct-form__field textarea { padding: 11px 14px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 14px; font-family: var(--font-body); color: var(--color-text); background: var(--color-white); }
.ct-form__field input:focus, .ct-form__field select:focus, .ct-form__field textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(200,16,46,0.08); }
.ct-form__field input.error, .ct-form__field select.error { border-color: var(--color-error); }
.ct-form__error { font-size: 11px; color: var(--color-error); margin-top: 2px; min-height: 14px; }
.ct-form__field--full { grid-column: 1 / -1; margin-bottom: 12px; }
.ct-form__checks { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 14px; }
.ct-form__checks label { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--color-text-secondary); cursor: pointer; }
.ct-form__checks input { width: 15px; height: 15px; accent-color: var(--color-primary); }
.ct-form__checkbox { display: flex; align-items: flex-start; gap: 8px; font-size: 13px; color: var(--color-text-secondary); cursor: pointer; line-height: 1.4; }
.ct-form__checkbox input { margin-top: 2px; width: 16px; height: 16px; accent-color: var(--color-primary); }
.ct-form__submit { width: 100%; margin-top: 4px; }
.ct-form__success { display: flex; align-items: center; gap: 10px; padding: 14px; background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: var(--radius); margin-top: 12px; }
.ct-form__success svg { color: var(--color-success); flex-shrink: 0; }
.ct-form__success p { font-size: 13px; color: #166534; font-weight: 500; }

/* --- File Upload --- */
.ct-upload { margin-bottom: 8px; }
.ct-upload__drop { border: 2px dashed var(--color-border); border-radius: var(--radius-lg); padding: 32px; text-align: center; cursor: pointer; transition: all var(--transition); }
.ct-upload__drop:hover { border-color: var(--color-primary); background: rgba(200,16,46,0.02); }
.ct-upload__drop svg { color: var(--color-metal); margin-bottom: 10px; }
.ct-upload__drop p { font-size: 14px; color: var(--color-text-secondary); margin-bottom: 4px; }
.ct-upload__drop p strong { color: var(--color-primary); cursor: pointer; }
.ct-upload__drop span { font-size: 12px; color: var(--color-metal); }
.ct-upload__preview { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-top: 12px; }
.ct-upload__thumb { position: relative; border-radius: var(--radius); overflow: hidden; aspect-ratio: 1; background: var(--color-light); }
.ct-upload__thumb img { width: 100%; height: 100%; object-fit: cover; }
.ct-upload__thumb-info { position: absolute; bottom: 0; left: 0; right: 0; padding: 4px 8px; background: rgba(0,0,0,0.6); font-size: 10px; color: var(--color-white); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ct-upload__thumb-remove { position: absolute; top: 4px; right: 4px; width: 22px; height: 22px; background: rgba(0,0,0,0.6); color: white; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 12px; cursor: pointer; }
.ct-upload__thumb-remove:hover { background: var(--color-error); }
.ct-upload__hint { font-size: 12px; color: var(--color-metal); margin-top: 6px; }

/* --- Catalogs --- */
.ct-catalogs__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.ct-catalogs__card { display: flex; align-items: center; gap: 14px; padding: 18px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); transition: all var(--transition); }
.ct-catalogs__card:hover { border-color: var(--color-primary); }
.ct-catalogs__card svg { color: var(--color-primary); flex-shrink: 0; }
.ct-catalogs__card h3 { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-text); flex: 1; }

/* --- Location --- */
.ct-location { background: var(--color-light); }
.ct-location__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.ct-location__inner > * { min-width: 0; }
.ct-location__details { margin-bottom: 20px; }
.ct-location__item { display: flex; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid var(--color-border); font-size: 14px; }
.ct-location__item span { color: var(--color-text-secondary); }
.ct-location__item strong { color: var(--color-text); }
.ct-location__item a strong { color: var(--color-primary); }
.ct-location__actions { display: flex; gap: 10px; margin-bottom: 10px; }
.ct-location__note { font-size: 12px; color: var(--color-metal); }
.ct-location__map { border-radius: var(--radius-lg); overflow: hidden; }
.ct-location__map img { width: 100%; object-fit: cover; }

/* --- Process --- */
.ct-process__steps { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; margin-bottom: 16px; }
.ct-process__step { padding: 20px; background: var(--color-white); border-radius: var(--radius-lg); border-top: 3px solid var(--color-primary); text-align: center; }
.ct-process__step span { font-family: var(--font-heading); font-size: 20px; font-weight: 800; color: var(--color-primary); opacity: 0.3; display: block; margin-bottom: 8px; }
.ct-process__step h3 { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-text); margin-bottom: 6px; }
.ct-process__step p { font-size: 12px; color: var(--color-text-secondary); }
.ct-process__note { text-align: center; font-size: 13px; color: var(--color-metal); }

/* --- Prepare --- */
.ct-prepare { background: var(--color-dark); }
.ct-prepare__grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; margin-bottom: 16px; }
.ct-prepare__card { padding: 20px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius-lg); }
.ct-prepare__card h3 { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-white); margin-bottom: 10px; }
.ct-prepare__card ul { list-style: none; }
.ct-prepare__card li { font-size: 13px; color: rgba(255,255,255,0.6); padding: 3px 0 3px 14px; position: relative; }
.ct-prepare__card li::before { content: ''; position: absolute; left: 0; top: 50%; width: 5px; height: 5px; background: var(--color-primary); border-radius: 50%; transform: translateY(-50%); }
.ct-prepare__note { text-align: center; font-size: 14px; color: rgba(255,255,255,0.5); }

/* --- FAQ --- */
.ct-faq .faq__list { max-width: 800px; margin: 0 auto 24px; }

/* --- Bottom CTA --- */
.ct-bottom-cta { position: relative; overflow: hidden; padding: 80px 0; }
.ct-bottom-cta__bg { position: absolute; inset: 0; }
.ct-bottom-cta__bg img { width: 100%; height: 100%; object-fit: cover; }
.ct-bottom-cta__overlay { position: absolute; inset: 0; background: rgba(17,24,32,0.85); }
.ct-bottom-cta__inner { position: relative; z-index: 2; }
.ct-bottom-cta__content { max-width: 700px; margin: 0 auto; text-align: center; }
.ct-bottom-cta__text { font-size: 17px; color: rgba(255,255,255,0.75); line-height: 1.7; margin-bottom: 20px; }
.ct-bottom-cta__tags { display: flex; gap: 12px; justify-content: center; margin-bottom: 28px; flex-wrap: wrap; }
.ct-bottom-cta__tags span { padding: 8px 16px; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.12); border-radius: var(--radius); font-size: 13px; color: rgba(255,255,255,0.8); }
.ct-bottom-cta__actions { display: flex; gap: 14px; justify-content: center; }

/* ============================
   CONTACT RESPONSIVE
   ============================ */
@media (max-width: 1199px) {
  .ct-hero { height: 500px; }
  .ct-hero__title { font-size: 42px; }
  .ct-quick__grid { grid-template-columns: repeat(2, 1fr); }
  .ct-types__grid { grid-template-columns: repeat(3, 1fr); }
  .ct-catalogs__grid { grid-template-columns: repeat(2, 1fr); }
  .ct-prepare__grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 991px) {
  .ct-hero { height: 460px; }
  .ct-hero__title { font-size: 36px; }
  .ct-location__inner { grid-template-columns: 1fr; }
  .ct-process__steps { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 767px) {
  .ct-hero { height: 440px; }
  .ct-hero__title { font-size: 30px; }
  .ct-hero__desc { font-size: 15px; }
  .ct-hero__buttons { flex-direction: column; gap: 10px; }
  .ct-hero__buttons .btn { width: 100%; }
  .ct-quick__grid { grid-template-columns: 1fr; }
  .ct-types__grid { grid-template-columns: repeat(2, 1fr); }
  .ct-form { padding: 20px; }
  .ct-form__grid { grid-template-columns: 1fr; }
  .ct-form__checks { grid-template-columns: 1fr; }
  .ct-catalogs__grid { grid-template-columns: 1fr; }
  .ct-prepare__grid { grid-template-columns: 1fr; }
  .ct-process__steps { grid-template-columns: 1fr; }
  .ct-upload__preview { grid-template-columns: repeat(3, 1fr); }
  .ct-location__actions { flex-direction: column; }
  .ct-bottom-cta__actions { flex-direction: column; align-items: center; }
}

@media (max-width: 479px) {
  .ct-hero { height: 420px; }
  .ct-hero__title { font-size: 26px; }
  .ct-types__grid { grid-template-columns: 1fr; }
  .ct-upload__preview { grid-template-columns: repeat(2, 1fr); }
}

/* ============================================
   SERVICE & SUPPORT PAGE STYLES
   ============================================ */

/* --- Service Hero --- */
.sv-hero { position: relative; height: 620px; overflow: hidden; display: flex; align-items: flex-end; }
.sv-hero__bg { position: absolute; inset: 0; }
.sv-hero__bg-img { width: 100%; height: 100%; object-fit: cover; }
.sv-hero__overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(17,24,32,0.88) 0%, rgba(17,24,32,0.6) 50%, rgba(17,24,32,0.2) 100%); }
.sv-hero__content { position: relative; z-index: 2; padding-bottom: 56px; max-width: 720px; }
.sv-hero__breadcrumb { display: flex; align-items: center; gap: 8px; font-size: 13px; color: rgba(255,255,255,0.6); margin-bottom: 14px; }
.sv-hero__breadcrumb a { color: rgba(255,255,255,0.6); }
.sv-hero__breadcrumb a:hover { color: var(--color-white); }
.sv-hero__breadcrumb span:last-child { color: var(--color-white); }
.sv-hero__eyebrow { display: block; font-size: 13px; font-weight: 600; letter-spacing: 2px; color: var(--color-primary-light); margin-bottom: 12px; }
.sv-hero__title { font-family: var(--font-heading); font-size: 50px; font-weight: 800; color: var(--color-white); line-height: 1.08; margin-bottom: 16px; }
.sv-hero__desc { font-size: 17px; color: rgba(255,255,255,0.8); line-height: 1.7; margin-bottom: 24px; }
.sv-hero__buttons { display: flex; gap: 12px; margin-bottom: 24px; flex-wrap: wrap; }
.sv-hero__tags { display: flex; gap: 12px; flex-wrap: wrap; }
.sv-hero__tag { display: inline-block; padding: 6px 14px; background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.15); border-radius: var(--radius); font-size: 13px; font-weight: 500; color: rgba(255,255,255,0.8); }

/* --- Service Overview --- */
.sv-overview__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.sv-overview__content p { font-size: 16px; color: var(--color-text-secondary); line-height: 1.7; margin-bottom: 14px; }
.sv-overview__quote { border-left: 4px solid var(--color-primary); padding: 14px 20px; background: var(--color-light); border-radius: 0 var(--radius) var(--radius) 0; margin: 20px 0 24px; }
.sv-overview__quote p { font-size: 15px; font-weight: 600; color: var(--color-text); font-style: italic; margin: 0; }
.sv-overview__images { display: flex; flex-direction: column; gap: 14px; }
.sv-overview__img-main { position: relative; border-radius: var(--radius-lg); overflow: hidden; }
.sv-overview__img-main img { width: 100%; min-height: 280px; object-fit: cover; }
.sv-overview__img-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.sv-overview__img-small { position: relative; border-radius: var(--radius-lg); overflow: hidden; }
.sv-overview__img-small img { width: 100%; min-height: 150px; object-fit: cover; }
.sv-overview__img-label { position: absolute; bottom: 10px; left: 10px; padding: 4px 10px; background: rgba(0,0,0,0.55); border-radius: var(--radius); font-size: 11px; font-weight: 600; color: var(--color-white); }

/* --- Service Stages --- */
.sv-stages__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.sv-stages__card { padding: 24px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); transition: all var(--transition); }
.sv-stages__card:hover { border-color: var(--color-primary); transform: translateY(-3px); }
.sv-stages__card span { font-family: var(--font-heading); font-size: 14px; font-weight: 700; color: var(--color-primary); opacity: 0.4; display: block; margin-bottom: 8px; }
.sv-stages__icon { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: var(--radius); background: var(--color-light); color: var(--color-primary); margin-bottom: 12px; }
.sv-stages__card:hover .sv-stages__icon { background: var(--color-primary); color: var(--color-white); }
.sv-stages__card h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 6px; }
.sv-stages__card p { font-size: 13px; color: var(--color-text-secondary); line-height: 1.5; }

/* --- Pre-Sales --- */
.sv-presales__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.sv-presales__inner > * { min-width: 0; }
.sv-presales__content h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin: 20px 0 10px; }
.sv-presales__info, .sv-presales__support { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.sv-presales__info span, .sv-presales__support span { padding: 6px 12px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 12px; color: var(--color-text-secondary); }
.sv-presales__actions { display: flex; gap: 12px; }
.sv-presales__image { border-radius: var(--radius-lg); overflow: hidden; }
.sv-presales__image img { width: 100%; object-fit: cover; }

/* --- Configuration --- */
.sv-config__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-bottom: 16px; }
.sv-config__list, .sv-config__methods { padding: 20px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.sv-config__list h3, .sv-config__methods h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 12px; }
.sv-config__list li, .sv-config__methods li { font-size: 14px; color: var(--color-text-secondary); padding: 5px 0; border-bottom: 1px solid var(--color-light); padding-left: 14px; position: relative; }
.sv-config__list li::before, .sv-config__methods li::before { content: ''; position: absolute; left: 0; top: 50%; width: 5px; height: 5px; background: var(--color-primary); border-radius: 50%; transform: translateY(-50%); }
.sv-config__note { text-align: center; font-size: 13px; color: var(--color-metal); }

/* --- Production --- */
.sv-production { background: var(--color-dark); }
.sv-production__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 20px; }
.sv-production__card { padding: 16px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius-lg); text-align: center; }
.sv-production__card h3 { font-family: var(--font-body); font-size: 13px; font-weight: 600; color: var(--color-white); }
.sv-production__materials { margin-bottom: 16px; }
.sv-production__materials h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-white); margin-bottom: 10px; }
.sv-production__materials span { display: inline-block; padding: 6px 12px; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: var(--radius); font-size: 12px; color: rgba(255,255,255,0.7); margin: 0 4px 4px 0; }
.sv-production__note { text-align: center; font-size: 13px; color: rgba(255,255,255,0.5); margin-bottom: 16px; }
.sv-production__action { text-align: center; }

/* --- Pre-Delivery --- */
.sv-predelivery__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.sv-predelivery__inner > * { min-width: 0; }
.sv-predelivery__image { border-radius: var(--radius-lg); overflow: hidden; }
.sv-predelivery__image img { width: 100%; object-fit: cover; }
.sv-predelivery__checks { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.sv-predelivery__checks span { padding: 6px 12px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 12px; color: var(--color-text-secondary); }

/* --- Documents --- */
.sv-docs__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 16px; }
.sv-docs__card { display: flex; align-items: center; gap: 12px; padding: 16px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.sv-docs__card svg { color: var(--color-primary); flex-shrink: 0; }
.sv-docs__card h3 { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-text); }
.sv-docs__note { text-align: center; font-size: 13px; color: var(--color-metal); }

/* --- Receiving --- */
.sv-receiving__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.sv-receiving__inner > * { min-width: 0; }
.sv-receiving__list { margin-bottom: 16px; }
.sv-receiving__list li { font-size: 14px; color: var(--color-text-secondary); padding: 6px 0 6px 24px; position: relative; }
.sv-receiving__list li::before { content: attr(data-num); position: absolute; left: 0; font-weight: 600; color: var(--color-primary); }
.sv-receiving__warning { display: flex; gap: 10px; padding: 14px; background: #fff8e1; border: 1px solid #ffe082; border-radius: var(--radius); }
.sv-receiving__warning svg { color: #f57f17; flex-shrink: 0; margin-top: 2px; }
.sv-receiving__warning p { font-size: 13px; color: #795548; margin: 0; }
.sv-receiving__image { border-radius: var(--radius-lg); overflow: hidden; }
.sv-receiving__image img { width: 100%; object-fit: cover; }

/* --- Operation --- */
.sv-operation__grid { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 20px; }
.sv-operation__grid span { padding: 8px 16px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; color: var(--color-text-secondary); }
.sv-operation__safety { display: flex; gap: 10px; padding: 16px; background: #e3f2fd; border: 1px solid #90caf9; border-radius: var(--radius); max-width: 700px; margin: 0 auto; }
.sv-operation__safety svg { color: #1565c0; flex-shrink: 0; margin-top: 2px; }
.sv-operation__safety p { font-size: 13px; color: #1565c0; margin: 0; }

/* --- Maintenance --- */
.sv-maintenance__grid { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 16px; }
.sv-maintenance__grid span { padding: 8px 16px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; color: var(--color-text-secondary); }
.sv-maintenance__note { display: flex; gap: 10px; padding: 14px; background: var(--color-light); border-left: 3px solid var(--color-primary); border-radius: 0 var(--radius) var(--radius) 0; max-width: 700px; margin: 0 auto; }
.sv-maintenance__note svg { color: var(--color-primary); flex-shrink: 0; margin-top: 2px; }
.sv-maintenance__note p { font-size: 13px; color: var(--color-text-secondary); margin: 0; }

/* --- Troubleshooting --- */
.sv-troubleshoot__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.sv-troubleshoot__inner > * { min-width: 0; }
.sv-troubleshoot__image { border-radius: var(--radius-lg); overflow: hidden; }
.sv-troubleshoot__image img { width: 100%; object-fit: cover; }
.sv-troubleshoot__info { margin-bottom: 16px; }
.sv-troubleshoot__info h3 { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-text); margin-bottom: 10px; }
.sv-troubleshoot__info span { display: inline-block; padding: 5px 10px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 12px; color: var(--color-text-secondary); margin: 0 4px 4px 0; }
.sv-troubleshoot__warning { display: flex; gap: 10px; padding: 14px; background: #fff8e1; border: 1px solid #ffe082; border-radius: var(--radius); margin-bottom: 20px; }
.sv-troubleshoot__warning svg { color: #f57f17; flex-shrink: 0; margin-top: 2px; }
.sv-troubleshoot__warning p { font-size: 13px; color: #795548; margin: 0; }

/* --- Remote Support --- */
.sv-remote { background: var(--color-dark); }
.sv-remote__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 28px; }
.sv-remote__card { padding: 18px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius-lg); text-align: center; }
.sv-remote__card h3 { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-white); }
.sv-remote__flow { margin-bottom: 16px; }
.sv-remote__flow h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-white); text-align: center; margin-bottom: 16px; }
.sv-remote__flow-steps { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.sv-remote__flow-steps > div { padding: 14px 16px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius); text-align: center; }
.sv-remote__flow-steps span { font-family: var(--font-heading); font-size: 16px; font-weight: 700; color: var(--color-primary); display: block; margin-bottom: 4px; }
.sv-remote__flow-steps h4 { font-family: var(--font-body); font-size: 12px; font-weight: 600; color: rgba(255,255,255,0.7); }
.sv-remote__note { text-align: center; font-size: 13px; color: rgba(255,255,255,0.5); }

/* --- Warranty --- */
.sv-warranty__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.sv-warranty__inner > * { min-width: 0; }
.sv-warranty__content h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin: 20px 0 10px; }
.sv-warranty__items, .sv-warranty__exclusions { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.sv-warranty__items span, .sv-warranty__exclusions span { padding: 6px 12px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 12px; color: var(--color-text-secondary); }
.sv-warranty__note { font-size: 13px; color: var(--color-metal); }
.sv-warranty__image { border-radius: var(--radius-lg); overflow: hidden; }
.sv-warranty__image img { width: 100%; object-fit: cover; }

/* --- Warranty Claim --- */
.sv-claim__steps { display: grid; grid-template-columns: repeat(7, 1fr); gap: 12px; margin-bottom: 16px; }
.sv-claim__step { padding: 16px 10px; background: var(--color-white); border-radius: var(--radius-lg); border-top: 3px solid var(--color-primary); text-align: center; }
.sv-claim__step span { font-family: var(--font-heading); font-size: 18px; font-weight: 800; color: var(--color-primary); opacity: 0.3; display: block; margin-bottom: 6px; }
.sv-claim__step h4 { font-family: var(--font-body); font-size: 13px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.sv-claim__step p { font-size: 11px; color: var(--color-text-secondary); }
.sv-claim__note { text-align: center; font-size: 13px; color: var(--color-metal); }

/* --- Parts Support --- */
.sv-parts { background: var(--color-dark); }
.sv-parts__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.sv-parts__inner > * { min-width: 0; }
.sv-parts__image { border-radius: var(--radius-lg); overflow: hidden; }
.sv-parts__image img { width: 100%; object-fit: cover; }
.sv-parts__categories { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.sv-parts__categories span { padding: 6px 12px; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: var(--radius); font-size: 12px; color: rgba(255,255,255,0.75); }
.sv-parts__services { margin-bottom: 20px; }
.sv-parts__services h3 { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-white); margin-bottom: 10px; }
.sv-parts__services span { display: inline-block; padding: 5px 10px; background: rgba(255,255,255,0.06); border-radius: var(--radius); font-size: 12px; color: rgba(255,255,255,0.6); margin: 0 4px 4px 0; }
.sv-parts__actions { display: flex; gap: 12px; }

/* --- Part Identification --- */
.sv-partid__steps { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; margin-bottom: 20px; }
.sv-partid__step { padding: 18px 12px; background: var(--color-white); border-radius: var(--radius-lg); border-top: 3px solid var(--color-primary); text-align: center; }
.sv-partid__step span { font-family: var(--font-heading); font-size: 18px; font-weight: 800; color: var(--color-primary); opacity: 0.3; display: block; margin-bottom: 6px; }
.sv-partid__step h4 { font-family: var(--font-body); font-size: 13px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.sv-partid__step p { font-size: 11px; color: var(--color-text-secondary); }
.sv-partid__warning { display: flex; gap: 10px; padding: 14px; background: #fff8e1; border: 1px solid #ffe082; border-radius: var(--radius); max-width: 700px; margin: 0 auto; }
.sv-partid__warning svg { color: #f57f17; flex-shrink: 0; margin-top: 2px; }
.sv-partid__warning p { font-size: 13px; color: #795548; margin: 0; }

/* --- Maintenance Kits --- */
.sv-kits__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 16px; }
.sv-kits__card { padding: 16px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius-lg); text-align: center; }
.sv-kits__card h3 { font-family: var(--font-body); font-size: 13px; font-weight: 600; color: var(--color-text); }
.sv-kits__note { text-align: center; font-size: 13px; color: var(--color-metal); margin-bottom: 16px; }
.sv-kits__action { text-align: center; }

/* --- Dealer Support --- */
.sv-dealer__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 24px; }
.sv-dealer__card { padding: 16px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); text-align: center; }
.sv-dealer__card h3 { font-family: var(--font-body); font-size: 13px; font-weight: 600; color: var(--color-text); }
.sv-dealer__actions { display: flex; gap: 12px; justify-content: center; }

/* --- Training --- */
.sv-training { background: var(--color-dark); }
.sv-training__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-bottom: 16px; }
.sv-training__note { text-align: center; font-size: 13px; color: rgba(255,255,255,0.5); margin-bottom: 16px; }
.sv-training__action { text-align: center; }

/* --- Service Docs --- */
.sv-servicedocs__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 16px; }
.sv-servicedocs__card { display: flex; align-items: center; gap: 12px; padding: 16px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); transition: all var(--transition); }
.sv-servicedocs__card:hover { border-color: var(--color-primary); }
.sv-servicedocs__card svg { color: var(--color-primary); flex-shrink: 0; }
.sv-servicedocs__card h3 { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-text); }
.sv-servicedocs__note { text-align: center; font-size: 13px; color: var(--color-metal); }

/* --- Support Type Selector --- */
.sv-supporttypes__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.sv-type-card { padding: 24px 18px; background: var(--color-light); border: 2px solid var(--color-border); border-radius: var(--radius-lg); cursor: pointer; transition: all var(--transition); text-align: center; }
.sv-type-card:hover { border-color: var(--color-primary); transform: translateY(-3px); }
.sv-type-card--active { border-color: var(--color-primary); background: rgba(200,16,46,0.03); }
.sv-type-card__icon { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 50%; background: var(--color-white); color: var(--color-primary); margin: 0 auto 12px; border: 1px solid var(--color-border); }
.sv-type-card--active .sv-type-card__icon { background: var(--color-primary); color: var(--color-white); border-color: var(--color-primary); }
.sv-type-card h3 { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-text); margin-bottom: 6px; }
.sv-type-card p { font-size: 12px; color: var(--color-text-secondary); margin-bottom: 8px; line-height: 1.4; }
.sv-type-card__tips { font-size: 11px; color: var(--color-metal); margin-bottom: 8px; }

/* --- Service Forms --- */
.sv-form { background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 32px; max-width: 900px; margin: 0 auto; }
.sv-form__title { font-family: var(--font-heading); font-size: 28px; font-weight: 700; color: var(--color-text); margin-bottom: 8px; }
.sv-form__desc { font-size: 15px; color: var(--color-text-secondary); margin-bottom: 20px; line-height: 1.6; }
.sv-form__step-title { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin: 24px 0 14px; padding-top: 16px; border-top: 1px solid var(--color-border); }
.sv-form__honeypot { position: absolute; left: -9999px; height: 0; opacity: 0; }
.sv-form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px; }
.sv-form__field { display: flex; flex-direction: column; }
.sv-form__field label { font-size: 13px; font-weight: 500; color: var(--color-text); margin-bottom: 4px; }
.sv-form__field input, .sv-form__field select, .sv-form__field textarea { padding: 11px 14px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 14px; font-family: var(--font-body); color: var(--color-text); background: var(--color-white); }
.sv-form__field input:focus, .sv-form__field select:focus, .sv-form__field textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(200,16,46,0.08); }
.sv-form__field input.error { border-color: var(--color-error); }
.sv-form__error { font-size: 11px; color: var(--color-error); margin-top: 2px; min-height: 14px; }
.sv-form__field--full { grid-column: 1 / -1; margin-bottom: 12px; }
.sv-form__checkbox { display: flex; align-items: flex-start; gap: 8px; font-size: 13px; color: var(--color-text-secondary); cursor: pointer; line-height: 1.4; }
.sv-form__checkbox input { margin-top: 2px; width: 16px; height: 16px; accent-color: var(--color-primary); }
.sv-form__submit { width: 100%; margin-top: 4px; }
.sv-form__success { display: flex; align-items: center; gap: 10px; padding: 14px; background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: var(--radius); margin-top: 12px; }
.sv-form__success svg { color: var(--color-success); flex-shrink: 0; }
.sv-form__success p { font-size: 13px; color: #166534; font-weight: 500; }

/* --- Support Process --- */
.sv-process__steps { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; margin-bottom: 16px; }
.sv-process__step { padding: 18px 12px; background: var(--color-light); border-radius: var(--radius-lg); border-top: 3px solid var(--color-primary); text-align: center; }
.sv-process__step span { font-family: var(--font-heading); font-size: 18px; font-weight: 800; color: var(--color-primary); opacity: 0.3; display: block; margin-bottom: 6px; }
.sv-process__step h4 { font-family: var(--font-body); font-size: 13px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.sv-process__step p { font-size: 11px; color: var(--color-text-secondary); }
.sv-process__note { text-align: center; font-size: 13px; color: var(--color-metal); }

/* --- Service FAQ --- */
.sv-faq .faq__list { max-width: 800px; margin: 0 auto 24px; }

/* --- Bottom CTA --- */
.sv-cta { position: relative; overflow: hidden; padding: 80px 0; }
.sv-cta__bg { position: absolute; inset: 0; }
.sv-cta__bg img { width: 100%; height: 100%; object-fit: cover; }
.sv-cta__overlay { position: absolute; inset: 0; background: rgba(17,24,32,0.88); }
.sv-cta__inner { position: relative; z-index: 2; display: grid; grid-template-columns: 1fr 1.1fr; gap: 48px; align-items: flex-start; }
.sv-cta__text { font-size: 16px; color: rgba(255,255,255,0.75); line-height: 1.7; margin-bottom: 20px; }
.sv-cta__tags { display: flex; flex-direction: column; gap: 10px; }
.sv-cta__tags span { display: flex; align-items: center; gap: 10px; padding: 10px 16px; background: rgba(255,255,255,0.06); border-radius: var(--radius); font-size: 13px; color: rgba(255,255,255,0.85); border: 1px solid rgba(255,255,255,0.1); }
.sv-cta__tags span::before { content: ''; width: 7px; height: 7px; background: var(--color-primary); border-radius: 50%; flex-shrink: 0; }
.sv-cta__form { background: var(--color-white); padding: 32px; border-radius: var(--radius-lg); }
.sv-cta__form-title { font-family: var(--font-heading); font-size: 24px; font-weight: 700; color: var(--color-text); margin-bottom: 20px; }
.sv-cta__honeypot { position: absolute; left: -9999px; height: 0; opacity: 0; }
.sv-cta__form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 12px; }
.sv-cta__field { display: flex; flex-direction: column; }
.sv-cta__field label { font-size: 12px; font-weight: 500; color: var(--color-text); margin-bottom: 4px; }
.sv-cta__field input, .sv-cta__field select, .sv-cta__field textarea { padding: 10px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-family: var(--font-body); color: var(--color-text); background: var(--color-white); }
.sv-cta__field input:focus, .sv-cta__field select:focus, .sv-cta__field textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 2px rgba(200,16,46,0.1); }
.sv-cta__field input.error { border-color: var(--color-error); }
.sv-cta__error { font-size: 11px; color: var(--color-error); margin-top: 2px; min-height: 14px; }
.sv-cta__field--full { grid-column: 1 / -1; margin-bottom: 12px; }
.sv-cta__checkbox { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; color: var(--color-text-secondary); cursor: pointer; }
.sv-cta__checkbox input { margin-top: 2px; accent-color: var(--color-primary); }
.sv-cta__submit { width: 100%; }
.sv-cta__success { display: flex; align-items: center; gap: 10px; padding: 14px; background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: var(--radius); margin-top: 12px; }
.sv-cta__success svg { color: var(--color-success); }
.sv-cta__success p { font-size: 13px; color: #166534; font-weight: 500; }

/* ============================
   SERVICE RESPONSIVE
   ============================ */
@media (max-width: 1199px) {
  .sv-hero { height: 540px; }
  .sv-hero__title { font-size: 42px; }
  .sv-stages__grid { grid-template-columns: repeat(2, 1fr); }
  .sv-production__grid { grid-template-columns: repeat(3, 1fr); }
  .sv-partid__steps { grid-template-columns: repeat(3, 1fr); }
  .sv-claim__steps { grid-template-columns: repeat(4, 1fr); }
  .sv-process__steps { grid-template-columns: repeat(3, 1fr); }
  .sv-dealer__grid { grid-template-columns: repeat(3, 1fr); }
  .sv-kits__grid { grid-template-columns: repeat(3, 1fr); }
  .sv-supporttypes__grid { grid-template-columns: repeat(2, 1fr); }
  .sv-docs__grid { grid-template-columns: repeat(2, 1fr); }
  .sv-servicedocs__grid { grid-template-columns: repeat(2, 1fr); }
  .sv-training__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 991px) {
  .sv-hero { height: 500px; }
  .sv-hero__title { font-size: 36px; }
  .sv-overview__inner { grid-template-columns: 1fr; }
  .sv-presales__inner { grid-template-columns: 1fr; }
  .sv-predelivery__inner { grid-template-columns: 1fr; }
  .sv-receiving__inner { grid-template-columns: 1fr; }
  .sv-troubleshoot__inner { grid-template-columns: 1fr; }
  .sv-warranty__inner { grid-template-columns: 1fr; }
  .sv-parts__inner { grid-template-columns: 1fr; }
  .sv-cta__inner { grid-template-columns: 1fr; }
  .sv-remote__grid { grid-template-columns: repeat(2, 1fr); }
  .sv-partid__steps { grid-template-columns: repeat(3, 1fr); }
  .sv-claim__steps { grid-template-columns: repeat(4, 1fr); }
}

@media (max-width: 767px) {
  .sv-hero { height: 460px; }
  .sv-hero__title { font-size: 30px; }
  .sv-hero__desc { font-size: 15px; }
  .sv-hero__buttons { flex-direction: column; gap: 10px; }
  .sv-hero__buttons .btn { width: 100%; }
  .sv-stages__grid { grid-template-columns: 1fr; }
  .sv-production__grid { grid-template-columns: repeat(2, 1fr); }
  .sv-config__grid { grid-template-columns: 1fr; }
  .sv-remote__grid { grid-template-columns: 1fr; }
  .sv-remote__flow-steps { flex-direction: column; align-items: center; }
  .sv-partid__steps { grid-template-columns: 1fr; }
  .sv-claim__steps { grid-template-columns: 1fr; }
  .sv-process__steps { grid-template-columns: 1fr; }
  .sv-kits__grid { grid-template-columns: repeat(2, 1fr); }
  .sv-dealer__grid { grid-template-columns: repeat(2, 1fr); }
  .sv-dealer__actions { flex-direction: column; align-items: center; }
  .sv-docs__grid { grid-template-columns: 1fr; }
  .sv-servicedocs__grid { grid-template-columns: 1fr; }
  .sv-training__grid { grid-template-columns: 1fr; }
  .sv-supporttypes__grid { grid-template-columns: 1fr; }
  .sv-form { padding: 20px; }
  .sv-form__grid { grid-template-columns: 1fr; }
  .sv-cta__form-grid { grid-template-columns: 1fr; }
  .sv-cta__form { padding: 20px; }
  .sv-presales__actions { flex-direction: column; }
  .sv-parts__actions { flex-direction: column; }
}

@media (max-width: 479px) {
  .sv-hero { height: 420px; }
  .sv-hero__title { font-size: 26px; }
  .sv-kits__grid { grid-template-columns: 1fr; }
  .sv-dealer__grid { grid-template-columns: 1fr; }
}

/* ============================================
   FAQ PAGE STYLES
   ============================================ */

/* --- FAQ Hero --- */
.faq-hero { position: relative; height: 560px; overflow: hidden; display: flex; align-items: center; }
.faq-hero__bg { position: absolute; inset: 0; }
.faq-hero__bg-img { width: 100%; height: 100%; object-fit: cover; }
.faq-hero__overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(17,24,32,0.88) 0%, rgba(17,24,32,0.65) 50%, rgba(17,24,32,0.25) 100%); }
.faq-hero__content { position: relative; z-index: 2; max-width: 720px; }
.faq-hero__breadcrumb { display: flex; align-items: center; gap: 8px; font-size: 13px; color: rgba(255,255,255,0.6); margin-bottom: 14px; }
.faq-hero__breadcrumb a { color: rgba(255,255,255,0.6); }
.faq-hero__breadcrumb a:hover { color: var(--color-white); }
.faq-hero__breadcrumb span:last-child { color: var(--color-white); }
.faq-hero__eyebrow { display: block; font-size: 13px; font-weight: 600; letter-spacing: 2px; color: var(--color-primary-light); margin-bottom: 12px; }
.faq-hero__title { font-family: var(--font-heading); font-size: 48px; font-weight: 800; color: var(--color-white); line-height: 1.08; margin-bottom: 14px; }
.faq-hero__desc { font-size: 17px; color: rgba(255,255,255,0.8); line-height: 1.7; margin-bottom: 24px; }
.faq-hero__search { display: flex; gap: 0; margin-bottom: 24px; }
.faq-hero__search input { flex: 1; padding: 14px 18px; border: none; border-radius: var(--radius) 0 0 var(--radius); font-size: 15px; font-family: var(--font-body); }
.faq-hero__search input:focus { outline: none; }
.faq-hero__search .btn { border-radius: 0 var(--radius) var(--radius) 0; }
.faq-hero__tags { display: flex; gap: 12px; flex-wrap: wrap; }
.faq-hero__tag { display: inline-block; padding: 6px 14px; background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.15); border-radius: var(--radius); font-size: 13px; font-weight: 500; color: rgba(255,255,255,0.8); }

/* --- FAQ Search --- */
.faq-search__box { position: relative; max-width: 640px; margin: 0 auto 16px; }
.faq-search__box input { width: 100%; padding: 14px 18px 14px 44px; border: 2px solid var(--color-border); border-radius: var(--radius-lg); font-size: 15px; font-family: var(--font-body); transition: border-color var(--transition); }
.faq-search__box input:focus { outline: none; border-color: var(--color-primary); }
.faq-search__box svg { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); color: var(--color-metal); }
.faq-search__count { text-align: center; font-size: 14px; color: var(--color-text-secondary); }

/* --- Popular Questions --- */
.faq-popular__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.faq-popular__card { display: flex; align-items: center; gap: 12px; padding: 16px 18px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); cursor: pointer; transition: all var(--transition); }
.faq-popular__card:hover { border-color: var(--color-primary); transform: translateY(-2px); }
.faq-popular__card svg { color: var(--color-primary); flex-shrink: 0; }
.faq-popular__card p { font-size: 14px; font-weight: 500; color: var(--color-text); }

/* --- FAQ Categories --- */
.faq-cats__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.faq-cat-card { padding: 22px 18px; background: var(--color-light); border: 2px solid transparent; border-radius: var(--radius-lg); cursor: pointer; transition: all var(--transition); text-align: center; }
.faq-cat-card:hover { border-color: var(--color-primary); background: var(--color-white); transform: translateY(-3px); }
.faq-cat-card--active { border-color: var(--color-primary); background: rgba(200,16,46,0.03); }
.faq-cat-card__icon { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: var(--color-white); color: var(--color-primary); margin: 0 auto 10px; border: 1px solid var(--color-border); }
.faq-cat-card--active .faq-cat-card__icon { background: var(--color-primary); color: var(--color-white); border-color: var(--color-primary); }
.faq-cat-card h3 { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.faq-cat-card__count { font-size: 12px; font-weight: 600; color: var(--color-primary); }

/* --- FAQ Toolbar --- */
.faq-toolbar__bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding: 16px 24px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.faq-toolbar__info { display: flex; align-items: center; gap: 12px; }
.faq-toolbar__active-cat { font-size: 15px; font-weight: 600; color: var(--color-text); }
.faq-toolbar__result-count { font-size: 13px; color: var(--color-metal); }
.faq-toolbar__actions { display: flex; gap: 8px; }
.faq-toolbar__btn { padding: 8px 16px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-weight: 500; color: var(--color-text-secondary); background: var(--color-white); cursor: pointer; transition: all var(--transition); }
.faq-toolbar__btn:hover { border-color: var(--color-primary); color: var(--color-primary); }
.faq-toolbar__btn--clear { color: var(--color-primary); border-color: var(--color-primary); }

/* --- FAQ Content --- */
.faq-content__list { max-width: 860px; margin: 0 auto; }

/* FAQ Item */
.faq-item { border-bottom: 1px solid var(--color-border); }
.faq-item__button { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 20px 0; font-size: 16px; font-weight: 600; color: var(--color-text); text-align: left; gap: 16px; cursor: pointer; background: none; border: none; font-family: var(--font-body); transition: color var(--transition); }
.faq-item__button:hover { color: var(--color-primary); }
.faq-item__button svg { flex-shrink: 0; transition: transform var(--transition); color: var(--color-primary); }
.faq-item__button[aria-expanded="true"] svg { transform: rotate(45deg); }
.faq-item__answer { padding: 0 0 20px; }
.faq-item__answer p { font-size: 15px; color: var(--color-text-secondary); line-height: 1.75; margin-bottom: 12px; }
.faq-item__answer a { color: var(--color-primary); text-decoration: underline; text-underline-offset: 2px; }
.faq-item__answer a:hover { color: var(--color-primary-dark); }

/* FAQ Meta */
.faq-item__meta { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--color-light); }
.faq-item__links { display: flex; gap: 8px; flex-wrap: wrap; }
.faq-item__link { display: inline-flex; align-items: center; gap: 4px; padding: 5px 12px; background: var(--color-light); border-radius: var(--radius); font-size: 12px; font-weight: 500; color: var(--color-text-secondary); transition: all var(--transition); }
.faq-item__link:hover { background: var(--color-white); border: 1px solid var(--color-border); color: var(--color-primary); }
.faq-item__copy { display: inline-flex; align-items: center; gap: 4px; padding: 5px 12px; background: none; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 12px; font-weight: 500; color: var(--color-metal); cursor: pointer; transition: all var(--transition); }
.faq-item__copy:hover { border-color: var(--color-primary); color: var(--color-primary); }

/* FAQ Helpful */
.faq-item__helpful { display: flex; align-items: center; gap: 12px; }
.faq-item__helpful-label { font-size: 13px; color: var(--color-metal); }
.faq-item__helpful-btn { padding: 5px 14px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 12px; font-weight: 500; color: var(--color-text-secondary); background: var(--color-white); cursor: pointer; transition: all var(--transition); }
.faq-item__helpful-btn:hover { border-color: var(--color-primary); color: var(--color-primary); }
.faq-item__helpful-btn--active { background: var(--color-primary); color: var(--color-white); border-color: var(--color-primary); }
.faq-item__helpful-thanks { font-size: 12px; color: var(--color-success); }
.faq-item__helpful-feedback { margin-top: 12px; }
.faq-item__helpful-feedback label { font-size: 12px; color: var(--color-text-secondary); margin-bottom: 4px; display: block; }
.faq-item__helpful-feedback textarea { width: 100%; padding: 8px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-family: var(--font-body); resize: vertical; }

/* FAQ Empty */
.faq-content__empty { text-align: center; padding: 60px 20px; }
.faq-content__empty svg { color: var(--color-metal); margin-bottom: 16px; }
.faq-content__empty h3 { font-family: var(--font-body); font-size: 18px; font-weight: 600; color: var(--color-text); margin-bottom: 8px; }
.faq-content__empty p { font-size: 14px; color: var(--color-text-secondary); margin-bottom: 16px; }
.faq-content__empty-actions { display: flex; gap: 12px; justify-content: center; }

/* --- Still Need Help --- */
.faq-still { background: var(--color-dark); }
.faq-still__desc { font-size: 16px; color: rgba(255,255,255,0.75); line-height: 1.7; margin-bottom: 28px; text-align: center; max-width: 700px; margin-left: auto; margin-right: auto; }
.faq-still__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.faq-still__card { padding: 22px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.1); border-radius: var(--radius-lg); text-align: center; transition: all var(--transition); }
.faq-still__card:hover { border-color: var(--color-primary); transform: translateY(-3px); }
.faq-still__card h3 { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-white); }

/* --- FAQ Form --- */
.faq-form { background: var(--color-light); }
.faq-form__inner { max-width: 900px; margin: 0 auto; }
.faq-form__content { margin-bottom: 24px; }
.faq-form__form { background: var(--color-white); padding: 32px; border-radius: var(--radius-lg); border: 1px solid var(--color-border); }
.faq-form__honeypot { position: absolute; left: -9999px; height: 0; opacity: 0; }
.faq-form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px; }
.faq-form__field { display: flex; flex-direction: column; }
.faq-form__field label { font-size: 13px; font-weight: 500; color: var(--color-text); margin-bottom: 4px; }
.faq-form__field input, .faq-form__field select, .faq-form__field textarea { padding: 11px 14px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 14px; font-family: var(--font-body); color: var(--color-text); background: var(--color-white); }
.faq-form__field input:focus, .faq-form__field select:focus, .faq-form__field textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(200,16,46,0.08); }
.faq-form__field input.error { border-color: var(--color-error); }
.faq-form__error { font-size: 11px; color: var(--color-error); margin-top: 2px; min-height: 14px; }
.faq-form__field--full { grid-column: 1 / -1; margin-bottom: 12px; }
.faq-form__checkbox { display: flex; align-items: flex-start; gap: 8px; font-size: 13px; color: var(--color-text-secondary); cursor: pointer; line-height: 1.4; }
.faq-form__checkbox input { margin-top: 2px; width: 16px; height: 16px; accent-color: var(--color-primary); }
.faq-form__submit { width: 100%; margin-top: 4px; }
.faq-form__success { display: flex; align-items: center; gap: 10px; padding: 14px; background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: var(--radius); margin-top: 12px; }
.faq-form__success svg { color: var(--color-success); flex-shrink: 0; }
.faq-form__success p { font-size: 13px; color: #166534; font-weight: 500; }

/* --- Helpful Resources --- */
.faq-resources__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.faq-resources__card { padding: 24px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); transition: all var(--transition); }
.faq-resources__card:hover { border-color: var(--color-primary); transform: translateY(-3px); }
.faq-resources__card h3 { font-family: var(--font-body); font-size: 17px; font-weight: 600; color: var(--color-text); margin-bottom: 6px; }
.faq-resources__card p { font-size: 14px; color: var(--color-text-secondary); }

/* ============================
   FAQ RESPONSIVE
   ============================ */
@media (max-width: 1199px) {
  .faq-hero { height: 500px; }
  .faq-hero__title { font-size: 42px; }
  .faq-cats__grid { grid-template-columns: repeat(3, 1fr); }
  .faq-resources__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 991px) {
  .faq-hero { height: 460px; }
  .faq-hero__title { font-size: 36px; }
  .faq-still__grid { grid-template-columns: repeat(2, 1fr); }
  .faq-toolbar__bar { flex-direction: column; align-items: stretch; }
  .faq-toolbar__actions { flex-wrap: wrap; }
}

@media (max-width: 767px) {
  .faq-hero { height: 440px; }
  .faq-hero__title { font-size: 30px; }
  .faq-hero__desc { font-size: 15px; }
  .faq-hero__search { flex-direction: column; gap: 0; }
  .faq-hero__search input { border-radius: var(--radius); margin-bottom: -1px; }
  .faq-hero__search .btn { border-radius: var(--radius); }
  .faq-popular__grid { grid-template-columns: 1fr; }
  .faq-cats__grid { grid-template-columns: repeat(2, 1fr); }
  .faq-still__grid { grid-template-columns: 1fr; }
  .faq-form__grid { grid-template-columns: 1fr; }
  .faq-form__form { padding: 20px; }
  .faq-resources__grid { grid-template-columns: 1fr; }
  .faq-item__meta { flex-direction: column; align-items: flex-start; }
}

@media (max-width: 479px) {
  .faq-hero { height: 420px; }
  .faq-hero__title { font-size: 26px; }
  .faq-cats__grid { grid-template-columns: 1fr; }
}

/* ============================================
   VIDEOS PAGE STYLES
   ============================================ */

.vid-hero { position: relative; height: 580px; overflow: hidden; display: flex; align-items: center; }
.vid-hero__bg { position: absolute; inset: 0; }
.vid-hero__bg-img { width: 100%; height: 100%; object-fit: cover; }
.vid-hero__overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(17,24,32,0.88) 0%, rgba(17,24,32,0.6) 50%, rgba(17,24,32,0.2) 100%); }
.vid-hero__content { position: relative; z-index: 2; max-width: 720px; }
.vid-hero__breadcrumb { display: flex; align-items: center; gap: 8px; font-size: 13px; color: rgba(255,255,255,0.6); margin-bottom: 14px; }
.vid-hero__breadcrumb a { color: rgba(255,255,255,0.6); }
.vid-hero__breadcrumb a:hover { color: var(--color-white); }
.vid-hero__breadcrumb span:last-child { color: var(--color-white); }
.vid-hero__eyebrow { display: block; font-size: 13px; font-weight: 600; letter-spacing: 2px; color: var(--color-primary-light); margin-bottom: 12px; }
.vid-hero__title { font-family: var(--font-heading); font-size: 48px; font-weight: 800; color: var(--color-white); line-height: 1.08; margin-bottom: 14px; }
.vid-hero__desc { font-size: 17px; color: rgba(255,255,255,0.8); line-height: 1.7; margin-bottom: 24px; }
.vid-hero__buttons { display: flex; gap: 12px; margin-bottom: 24px; flex-wrap: wrap; }
.vid-hero__tags { display: flex; gap: 12px; flex-wrap: wrap; }
.vid-hero__tag { display: inline-block; padding: 6px 14px; background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.15); border-radius: var(--radius); font-size: 13px; font-weight: 500; color: rgba(255,255,255,0.8); }

/* Featured */
.vid-featured__inner { display: grid; grid-template-columns: 1.4fr 1fr; gap: 48px; align-items: center; }
.vid-featured__inner > * { min-width: 0; }
.vid-featured__thumb { position: relative; border-radius: var(--radius-lg); overflow: hidden; cursor: pointer; background: var(--color-light); }
.vid-featured__thumb img { width: 100%; aspect-ratio: 16/9; object-fit: cover; display: block; }
.vid-featured__play { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 64px; height: 64px; background: var(--color-primary); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--color-white); box-shadow: 0 4px 20px rgba(200,16,46,0.4); transition: all var(--transition); }
.vid-featured__play:hover { transform: translate(-50%,-50%) scale(1.1); }
.vid-featured__cat { font-size: 12px; font-weight: 600; color: var(--color-primary); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 8px; display: block; }
.vid-featured__title { font-family: var(--font-heading); font-size: 28px; font-weight: 700; color: var(--color-text); margin-bottom: 10px; }
.vid-featured__desc { font-size: 15px; color: var(--color-text-secondary); line-height: 1.6; margin-bottom: 14px; }
.vid-featured__meta { display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px; }
.vid-featured__meta span { font-size: 13px; color: var(--color-text-secondary); }
.vid-featured__meta strong { color: var(--color-text); font-weight: 500; }
.vid-featured__links { display: flex; gap: 10px; margin-bottom: 12px; }
.vid-featured__note { font-size: 12px; color: var(--color-metal); font-style: italic; }

/* Categories */
.vid-cats__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.vid-cat-card { padding: 22px 16px; background: var(--color-white); border: 2px solid transparent; border-radius: var(--radius-lg); cursor: pointer; transition: all var(--transition); text-align: center; }
.vid-cat-card:hover { border-color: var(--color-primary); transform: translateY(-3px); }
.vid-cat-card--active { border-color: var(--color-primary); background: rgba(200,16,46,0.03); }
.vid-cat-card__icon { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: var(--color-light); color: var(--color-primary); margin: 0 auto 10px; border: 1px solid var(--color-border); }
.vid-cat-card--active .vid-cat-card__icon { background: var(--color-primary); color: var(--color-white); border-color: var(--color-primary); }
.vid-cat-card h3 { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.vid-cat-card p { font-size: 11px; color: var(--color-text-secondary); margin-bottom: 6px; }
.vid-cat-card__count { font-size: 12px; font-weight: 600; color: var(--color-primary); }

/* Search */
.vid-search__box { position: relative; max-width: 640px; margin: 0 auto 16px; }
.vid-search__box input { width: 100%; padding: 14px 18px 14px 44px; border: 2px solid var(--color-border); border-radius: var(--radius-lg); font-size: 15px; font-family: var(--font-body); }
.vid-search__box input:focus { outline: none; border-color: var(--color-primary); }
.vid-search__box svg { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); color: var(--color-metal); }
.vid-search__tags { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; margin-bottom: 12px; }
.vid-search__tag { padding: 6px 14px; border: 1px solid var(--color-border); border-radius: 20px; font-size: 13px; color: var(--color-text-secondary); cursor: pointer; transition: all var(--transition); background: var(--color-white); }
.vid-search__tag:hover, .vid-search__tag--active { border-color: var(--color-primary); color: var(--color-primary); background: rgba(200,16,46,0.04); }
.vid-search__count { text-align: center; font-size: 14px; color: var(--color-text-secondary); }

/* Toolbar */
.vid-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; flex-wrap: wrap; padding: 16px 20px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.vid-toolbar__left { display: flex; align-items: center; gap: 12px; flex: 1; flex-wrap: wrap; }
.vid-toolbar__filter-btn { display: none; align-items: center; gap: 6px; padding: 10px 16px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 14px; font-weight: 500; color: var(--color-text); background: var(--color-white); }
.vid-toolbar__active { display: flex; gap: 6px; flex-wrap: wrap; }
.vid-toolbar__active-tag { display: inline-flex; align-items: center; gap: 5px; padding: 5px 10px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 12px; color: var(--color-text-secondary); }
.vid-toolbar__active-tag button { color: var(--color-metal); font-size: 14px; }
.vid-toolbar__active-tag button:hover { color: var(--color-primary); }
.vid-toolbar__controls { display: flex; align-items: center; gap: 10px; }
.vid-toolbar__controls select { padding: 8px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-family: var(--font-body); color: var(--color-text); background: var(--color-white); }
.vid-toolbar__view { display: flex; border: 1px solid var(--color-border); border-radius: var(--radius); overflow: hidden; }
.vid-toolbar__view-btn { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; color: var(--color-metal); background: var(--color-white); transition: all var(--transition); }
.vid-toolbar__view-btn--active { color: var(--color-primary); background: var(--color-light); }

/* Video Grid */
.vid-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; min-width: 0; }
.vid-grid--list { grid-template-columns: 1fr; }
.vid-grid--list .vid-card { display: grid; grid-template-columns: 280px 1fr; gap: 20px; }

/* Video Card */
.vid-card { background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden; transition: all var(--transition); }
.vid-card:hover { transform: translateY(-4px); box-shadow: 0 8px 28px rgba(0,0,0,0.07); border-color: var(--color-primary); }
.vid-card__thumb { position: relative; aspect-ratio: 16/9; overflow: hidden; cursor: pointer; background: var(--color-light); }
.vid-card__thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--transition); }
.vid-card:hover .vid-card__thumb img { transform: scale(1.04); }
.vid-card__play { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 48px; height: 48px; background: var(--color-primary); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--color-white); box-shadow: 0 4px 16px rgba(200,16,46,0.35); transition: all var(--transition); opacity: 0; }
.vid-card:hover .vid-card__play { opacity: 1; }
.vid-card__play:hover { transform: translate(-50%,-50%) scale(1.1); }
.vid-card__duration { position: absolute; bottom: 8px; right: 8px; padding: 3px 8px; background: rgba(0,0,0,0.7); border-radius: 4px; font-size: 12px; color: var(--color-white); font-weight: 500; }
.vid-card__save { position: absolute; top: 8px; right: 8px; width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; background: rgba(0,0,0,0.4); border-radius: 50%; color: var(--color-white); cursor: pointer; transition: all var(--transition); opacity: 0; }
.vid-card:hover .vid-card__save { opacity: 1; }
.vid-card__save:hover { background: var(--color-primary); }
.vid-card__save--saved { opacity: 1; background: var(--color-primary); }
.vid-card__body { padding: 16px; }
.vid-card__meta { display: flex; gap: 8px; align-items: center; margin-bottom: 8px; flex-wrap: wrap; }
.vid-card__cat { font-size: 11px; font-weight: 600; color: var(--color-primary); text-transform: uppercase; letter-spacing: 0.5px; }
.vid-card__type { font-size: 11px; color: var(--color-metal); padding: 2px 8px; background: var(--color-light); border-radius: var(--radius); }
.vid-card__date { font-size: 11px; color: var(--color-metal); }
.vid-card__title { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-text); margin-bottom: 6px; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.vid-card__title a { color: inherit; }
.vid-card__title a:hover { color: var(--color-primary); }
.vid-card__desc { font-size: 12px; color: var(--color-text-secondary); line-height: 1.4; margin-bottom: 10px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.vid-card__tags { display: flex; gap: 4px; flex-wrap: wrap; margin-bottom: 10px; }
.vid-card__tag { font-size: 11px; color: var(--color-metal); padding: 2px 8px; background: var(--color-light); border-radius: var(--radius); }
.vid-card__actions { display: flex; gap: 6px; }
.vid-card__actions .btn { flex: 1; font-size: 12px; padding: 7px 10px; }

/* Empty */
.vid-empty { text-align: center; padding: 60px 20px; }
.vid-empty svg { color: var(--color-metal); margin-bottom: 16px; }
.vid-empty h3 { font-family: var(--font-body); font-size: 18px; font-weight: 600; color: var(--color-text); margin-bottom: 8px; }
.vid-empty p { font-size: 14px; color: var(--color-text-secondary); margin-bottom: 16px; }
.vid-empty__actions { display: flex; gap: 12px; justify-content: center; }
.vid-load-more { text-align: center; margin-top: 28px; }

/* Section Video Grids */
.vid-products__grid, .vid-factory__grid, .vid-testing__grid, .vid-implements__grid, .vid-maintenance__grid, .vid-parts__grid, .vid-oem__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-bottom: 24px; }
.vid-products__actions, .vid-factory__actions, .vid-testing__action, .vid-implements__action, .vid-maintenance__actions, .vid-parts__actions, .vid-oem__actions { display: flex; gap: 12px; justify-content: center; }
.vid-maintenance__note { text-align: center; font-size: 13px; color: rgba(255,255,255,0.5); margin-bottom: 16px; }

/* Dark sections */
.vid-factory, .vid-maintenance { background: var(--color-dark); }

/* Video Modal */
.modal__content--video { max-width: 900px; max-height: 90vh; overflow-y: auto; background: var(--color-white); border-radius: var(--radius-lg); padding: 24px; }
.vid-modal__body { margin-top: 16px; }
.vid-modal__title { font-family: var(--font-body); font-size: 18px; font-weight: 600; color: var(--color-text); margin-bottom: 8px; }
.vid-modal__meta { display: flex; gap: 12px; font-size: 13px; color: var(--color-text-secondary); margin-bottom: 12px; flex-wrap: wrap; }
.vid-modal__desc { font-size: 14px; color: var(--color-text-secondary); margin-bottom: 16px; line-height: 1.5; }
.vid-modal__actions { display: flex; gap: 8px; flex-wrap: wrap; }
.vid-modal__video-wrap { position: relative; aspect-ratio: 16/9; background: #000; border-radius: var(--radius); overflow: hidden; margin-bottom: 16px; }
.vid-modal__video-wrap video { width: 100%; height: 100%; }
.vid-modal__fallback { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; color: rgba(255,255,255,0.6); gap: 12px; }
.vid-modal__fallback p { font-size: 14px; }

/* Request Form */
.vid-request { background: var(--color-dark); }
.vid-request__inner { display: grid; grid-template-columns: 1fr 1.1fr; gap: 48px; align-items: flex-start; }
.vid-request__inner > * { min-width: 0; }
.vid-request__text { font-size: 16px; color: rgba(255,255,255,0.75); line-height: 1.7; margin-bottom: 20px; }
.vid-request__types { margin-bottom: 0; }
.vid-request__types h3 { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-white); margin-bottom: 10px; }
.vid-request__types span { display: inline-block; padding: 5px 10px; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: var(--radius); font-size: 12px; color: rgba(255,255,255,0.7); margin: 0 4px 4px 0; }
.vid-request__form { background: var(--color-white); padding: 32px; border-radius: var(--radius-lg); }
.vid-request__form-title { font-family: var(--font-heading); font-size: 24px; font-weight: 700; color: var(--color-text); margin-bottom: 20px; }
.vid-request__honeypot { position: absolute; left: -9999px; height: 0; opacity: 0; }
.vid-request__form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 12px; }
.vid-request__field { display: flex; flex-direction: column; }
.vid-request__field label { font-size: 12px; font-weight: 500; color: var(--color-text); margin-bottom: 4px; }
.vid-request__field input, .vid-request__field select, .vid-request__field textarea { padding: 10px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-family: var(--font-body); color: var(--color-text); background: var(--color-white); }
.vid-request__field input:focus, .vid-request__field select:focus, .vid-request__field textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 2px rgba(200,16,46,0.1); }
.vid-request__field input.error { border-color: var(--color-error); }
.vid-request__error { font-size: 11px; color: var(--color-error); margin-top: 2px; min-height: 14px; }
.vid-request__field--full { grid-column: 1 / -1; margin-bottom: 12px; }
.vid-request__checkbox { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; color: var(--color-text-secondary); cursor: pointer; }
.vid-request__checkbox input { margin-top: 2px; accent-color: var(--color-primary); }
.vid-request__submit { width: 100%; }
.vid-request__success { display: flex; align-items: center; gap: 10px; padding: 14px; background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: var(--radius); margin-top: 12px; }
.vid-request__success svg { color: var(--color-success); }
.vid-request__success p { font-size: 13px; color: #166534; font-weight: 500; }

/* Subscribe */
.vid-subscribe { background: var(--color-light); }
.vid-subscribe__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; }
.vid-subscribe__inner > * { min-width: 0; }
.vid-subscribe__text { font-size: 15px; color: var(--color-text-secondary); line-height: 1.7; }
.vid-subscribe__form { background: var(--color-white); padding: 24px; border-radius: var(--radius-lg); border: 1px solid var(--color-border); }
.vid-subscribe__honeypot { position: absolute; left: -9999px; height: 0; opacity: 0; }
.vid-subscribe__form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 12px; }
.vid-subscribe__field { display: flex; flex-direction: column; }
.vid-subscribe__field label { font-size: 12px; font-weight: 500; color: var(--color-text); margin-bottom: 4px; }
.vid-subscribe__field input { padding: 10px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-family: var(--font-body); }
.vid-subscribe__field input:focus { outline: none; border-color: var(--color-primary); }
.vid-subscribe__error { font-size: 11px; color: var(--color-error); margin-top: 2px; }
.vid-subscribe__checkbox { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; color: var(--color-text-secondary); cursor: pointer; margin-bottom: 12px; }
.vid-subscribe__checkbox input { margin-top: 2px; accent-color: var(--color-primary); }
.vid-subscribe__submit { width: 100%; }
.vid-subscribe__success { display: flex; align-items: center; gap: 10px; padding: 12px; background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: var(--radius); margin-top: 12px; }
.vid-subscribe__success svg { color: var(--color-success); }
.vid-subscribe__success p { font-size: 13px; color: #166534; }

/* FAQ */
.vid-faq .faq__list { max-width: 800px; margin: 0 auto 24px; }

/* Bottom CTA */
.vid-cta { position: relative; overflow: hidden; padding: 80px 0; }
.vid-cta__bg { position: absolute; inset: 0; }
.vid-cta__bg img { width: 100%; height: 100%; object-fit: cover; }
.vid-cta__overlay { position: absolute; inset: 0; background: rgba(17,24,32,0.88); }
.vid-cta__inner { position: relative; z-index: 2; display: grid; grid-template-columns: 1fr 1.1fr; gap: 48px; align-items: flex-start; }
.vid-cta__text { font-size: 16px; color: rgba(255,255,255,0.75); line-height: 1.7; margin-bottom: 20px; }
.vid-cta__tags { display: flex; flex-direction: column; gap: 10px; }
.vid-cta__tags span { display: flex; align-items: center; gap: 10px; padding: 10px 16px; background: rgba(255,255,255,0.06); border-radius: var(--radius); font-size: 13px; color: rgba(255,255,255,0.85); border: 1px solid rgba(255,255,255,0.1); }
.vid-cta__tags span::before { content: ''; width: 7px; height: 7px; background: var(--color-primary); border-radius: 50%; flex-shrink: 0; }
.vid-cta__form { background: var(--color-white); padding: 32px; border-radius: var(--radius-lg); }
.vid-cta__form-title { font-family: var(--font-heading); font-size: 24px; font-weight: 700; color: var(--color-text); margin-bottom: 20px; }
.vid-cta__honeypot { position: absolute; left: -9999px; height: 0; opacity: 0; }
.vid-cta__form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 12px; }
.vid-cta__field { display: flex; flex-direction: column; }
.vid-cta__field label { font-size: 12px; font-weight: 500; color: var(--color-text); margin-bottom: 4px; }
.vid-cta__field input, .vid-cta__field select, .vid-cta__field textarea { padding: 10px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-family: var(--font-body); color: var(--color-text); background: var(--color-white); }
.vid-cta__field input:focus, .vid-cta__field textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 2px rgba(200,16,46,0.1); }
.vid-cta__field input.error { border-color: var(--color-error); }
.vid-cta__error { font-size: 11px; color: var(--color-error); margin-top: 2px; min-height: 14px; }
.vid-cta__field--full { grid-column: 1 / -1; margin-bottom: 12px; }
.vid-cta__checkbox { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; color: var(--color-text-secondary); cursor: pointer; }
.vid-cta__checkbox input { margin-top: 2px; accent-color: var(--color-primary); }
.vid-cta__submit { width: 100%; }
.vid-cta__success { display: flex; align-items: center; gap: 10px; padding: 14px; background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: var(--radius); margin-top: 12px; }
.vid-cta__success svg { color: var(--color-success); }
.vid-cta__success p { font-size: 13px; color: #166534; font-weight: 500; }

/* ============================
   VIDEOS RESPONSIVE
   ============================ */
@media (max-width: 1199px) {
  .vid-hero { height: 520px; }
  .vid-hero__title { font-size: 42px; }
  .vid-cats__grid { grid-template-columns: repeat(3, 1fr); }
  .vid-grid { grid-template-columns: repeat(2, 1fr); }
  .vid-products__grid, .vid-factory__grid, .vid-testing__grid, .vid-implements__grid, .vid-maintenance__grid, .vid-parts__grid, .vid-oem__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 991px) {
  .vid-hero { height: 480px; }
  .vid-hero__title { font-size: 36px; }
  .vid-featured__inner { grid-template-columns: 1fr; }
  .vid-request__inner { grid-template-columns: 1fr; }
  .vid-cta__inner { grid-template-columns: 1fr; }
  .vid-subscribe__inner { grid-template-columns: 1fr; }
  .vid-toolbar__filter-btn { display: flex; }
}

@media (max-width: 767px) {
  .vid-hero { height: 440px; }
  .vid-hero__title { font-size: 30px; }
  .vid-hero__desc { font-size: 15px; }
  .vid-hero__buttons { flex-direction: column; gap: 10px; }
  .vid-hero__buttons .btn { width: 100%; }
  .vid-cats__grid { grid-template-columns: repeat(2, 1fr); }
  .vid-grid { grid-template-columns: 1fr; }
  .vid-grid--list .vid-card { grid-template-columns: 1fr; }
  .vid-toolbar { flex-direction: column; align-items: stretch; }
  .vid-toolbar__controls { flex-wrap: wrap; }
  .vid-products__grid, .vid-factory__grid, .vid-testing__grid, .vid-implements__grid, .vid-maintenance__grid, .vid-parts__grid, .vid-oem__grid { grid-template-columns: 1fr; }
  .vid-products__actions, .vid-factory__actions, .vid-testing__action, .vid-implements__action, .vid-maintenance__actions, .vid-parts__actions, .vid-oem__actions { flex-direction: column; align-items: center; }
  .vid-request__form-grid { grid-template-columns: 1fr; }
  .vid-request__form { padding: 20px; }
  .vid-cta__form-grid { grid-template-columns: 1fr; }
  .vid-cta__form { padding: 20px; }
  .vid-subscribe__form-grid { grid-template-columns: 1fr; }
  .vid-modal__actions { flex-direction: column; }
  .modal__content--video { padding: 16px; }
}

@media (max-width: 479px) {
  .vid-hero { height: 420px; }
  .vid-hero__title { font-size: 26px; }
  .vid-cats__grid { grid-template-columns: 1fr; }
}

/* ============================================
   DEALER PROGRAM PAGE STYLES
   ============================================ */

.dp-hero { position: relative; height: 640px; overflow: hidden; display: flex; align-items: center; }
.dp-hero__bg { position: absolute; inset: 0; }
.dp-hero__bg-img { width: 100%; height: 100%; object-fit: cover; }
.dp-hero__overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(17,24,32,0.88) 0%, rgba(17,24,32,0.55) 60%, rgba(17,24,32,0.15) 100%); }
.dp-hero__content { position: relative; z-index: 2; max-width: 760px; }
.dp-hero__breadcrumb { display: flex; align-items: center; gap: 8px; font-size: 13px; color: rgba(255,255,255,0.6); margin-bottom: 14px; }
.dp-hero__breadcrumb a { color: rgba(255,255,255,0.6); }
.dp-hero__breadcrumb a:hover { color: var(--color-white); }
.dp-hero__breadcrumb span:last-child { color: var(--color-white); }
.dp-hero__eyebrow { display: block; font-size: 13px; font-weight: 600; letter-spacing: 2px; color: var(--color-primary-light, #e8455a); margin-bottom: 12px; }
.dp-hero__title { font-family: var(--font-heading); font-size: 50px; font-weight: 800; color: var(--color-white); line-height: 1.08; margin-bottom: 16px; }
.dp-hero__desc { font-size: 17px; color: rgba(255,255,255,0.8); line-height: 1.7; margin-bottom: 28px; }
.dp-hero__buttons { display: flex; gap: 12px; margin-bottom: 28px; flex-wrap: wrap; }
.dp-hero__tags { display: flex; gap: 12px; flex-wrap: wrap; }
.dp-hero__tag { display: inline-block; padding: 6px 14px; background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.15); border-radius: var(--radius); font-size: 13px; font-weight: 500; color: rgba(255,255,255,0.8); }

/* Overview */
.dp-overview__inner { display: grid; grid-template-columns: 1.2fr 1fr; gap: 48px; align-items: center; }
.dp-overview__inner > * { min-width: 0; }
.dp-overview__content p { font-size: 16px; color: var(--color-text-secondary); line-height: 1.7; margin-bottom: 12px; }
.dp-overview__quote { padding: 16px 20px; border-left: 4px solid var(--color-primary); background: var(--color-light); border-radius: 0 var(--radius) var(--radius) 0; font-size: 15px; font-weight: 500; color: var(--color-text); margin: 20px 0 24px; font-style: italic; }
.dp-overview__images img { width: 100%; border-radius: var(--radius-lg); }

/* Partner Types */
.dp-partners__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.dp-partner-card { padding: 24px 18px; background: var(--color-white); border: 2px solid transparent; border-radius: var(--radius-lg); transition: all var(--transition); cursor: pointer; }
.dp-partner-card:hover { border-color: var(--color-primary); transform: translateY(-3px); }
.dp-partner-card__icon { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: var(--color-light); color: var(--color-primary); margin-bottom: 12px; border: 1px solid var(--color-border); }
.dp-partner-card h3 { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-text); margin-bottom: 6px; }
.dp-partner-card p { font-size: 12px; color: var(--color-text-secondary); line-height: 1.5; margin-bottom: 10px; }
.dp-partner-card .btn { font-size: 12px; padding: 6px 12px; }

/* Why Partner */
.dp-why__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.dp-why-card { padding: 22px 16px; background: var(--color-light); border-radius: var(--radius-lg); text-align: center; transition: all var(--transition); }
.dp-why-card:hover { transform: translateY(-3px); box-shadow: 0 6px 20px rgba(0,0,0,0.06); }
.dp-why-card__icon { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 50%; background: var(--color-white); color: var(--color-primary); margin: 0 auto 12px; border: 1px solid var(--color-border); }
.dp-why-card h3 { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--color-text); margin-bottom: 6px; }
.dp-why-card p { font-size: 12px; color: var(--color-text-secondary); line-height: 1.5; }

/* Product Portfolio */
.dp-products__grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; margin-bottom: 24px; }
.dp-product-card { padding: 16px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); text-align: center; transition: all var(--transition); }
.dp-product-card:hover { border-color: var(--color-primary); transform: translateY(-2px); }
.dp-product-card h4 { font-size: 13px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.dp-product-card p { font-size: 11px; color: var(--color-text-secondary); }
.dp-products__actions { display: flex; gap: 12px; justify-content: center; }

/* Partnership Options */
.dp-options__grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; margin-bottom: 16px; }
.dp-option-card { padding: 20px 14px; background: var(--color-light); border-radius: var(--radius-lg); text-align: center; transition: all var(--transition); }
.dp-option-card:hover { background: var(--color-white); box-shadow: 0 6px 20px rgba(0,0,0,0.06); }
.dp-option-card h3 { font-size: 14px; font-weight: 600; color: var(--color-text); margin-bottom: 6px; }
.dp-option-card p { font-size: 12px; color: var(--color-text-secondary); line-height: 1.4; margin-bottom: 8px; }
.dp-option-card ul { text-align: left; font-size: 11px; color: var(--color-text-secondary); padding-left: 14px; margin-bottom: 10px; }
.dp-option-card .btn { font-size: 11px; padding: 5px 10px; }
.dp-options__note { text-align: center; font-size: 13px; color: var(--color-metal); }

/* Market Planning */
.dp-market { background: var(--color-dark); }
.dp-market__text { text-align: center; max-width: 700px; margin: 0 auto 24px; font-size: 15px; color: rgba(255,255,255,0.75); }
.dp-market__factors { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 28px; }
.dp-market__factor { padding: 5px 12px; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: var(--radius); font-size: 12px; color: rgba(255,255,255,0.7); }
.dp-market__steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 32px; }
.dp-market__step { padding: 14px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius); text-align: center; }
.dp-market__step-num { display: block; font-family: var(--font-heading); font-size: 22px; font-weight: 700; color: var(--color-primary); margin-bottom: 4px; }
.dp-market__step-label { font-size: 12px; color: rgba(255,255,255,0.7); }
.dp-market__planner { background: var(--color-white); padding: 28px; border-radius: var(--radius-lg); max-width: 800px; margin: 0 auto; }
.dp-market__planner-title { font-family: var(--font-heading); font-size: 22px; font-weight: 700; color: var(--color-text); margin-bottom: 16px; }
.dp-market__form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 16px; }
.dp-market__field { display: flex; flex-direction: column; }
.dp-market__field label { font-size: 12px; font-weight: 500; color: var(--color-text); margin-bottom: 4px; }
.dp-market__field input, .dp-market__field select { padding: 10px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-family: var(--font-body); }
.dp-market__field input:focus, .dp-market__field select:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 2px rgba(200,16,46,0.1); }
.dp-market__honeypot { position: absolute; left: -9999px; height: 0; opacity: 0; }
.dp-market__submit { width: 100%; }
.dp-market__result { margin-top: 16px; padding: 16px; background: var(--color-light); border-radius: var(--radius); font-size: 13px; color: var(--color-text); line-height: 1.6; }

/* OEM */
.dp-oem__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 16px; }
.dp-oem-item { padding: 14px; background: var(--color-light); border-radius: var(--radius); text-align: center; font-size: 13px; font-weight: 500; color: var(--color-text); }
.dp-oem__note { text-align: center; font-size: 13px; color: var(--color-metal); margin-bottom: 24px; }
.dp-oem__steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 24px; }
.dp-oem__step { padding: 14px; background: var(--color-light); border-radius: var(--radius); text-align: center; }
.dp-oem__step-num { display: block; font-family: var(--font-heading); font-size: 20px; font-weight: 700; color: var(--color-primary); margin-bottom: 4px; }
.dp-oem__step-label { font-size: 12px; color: var(--color-text-secondary); }
.dp-oem__actions { display: flex; gap: 12px; justify-content: center; }

/* Sales Support */
.dp-sales__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 16px; }
.dp-sales-item { padding: 14px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; color: var(--color-text); text-align: center; }
.dp-sales__note { text-align: center; font-size: 13px; color: var(--color-metal); margin-bottom: 20px; }

/* Training */
.dp-training__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; margin-bottom: 16px; }
.dp-training__topics, .dp-training__methods { display: flex; flex-direction: column; gap: 8px; }
.dp-training__topics h3, .dp-training__methods h3 { font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 8px; }
.dp-training-item { padding: 10px 14px; background: var(--color-light); border-radius: var(--radius); font-size: 13px; color: var(--color-text); }
.dp-training__note { text-align: center; font-size: 13px; color: var(--color-metal); margin-bottom: 20px; }

/* Technical */
.dp-tech { background: var(--color-dark); }
.dp-tech__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; margin-bottom: 16px; }
.dp-tech__col h3 { font-size: 16px; font-weight: 600; color: var(--color-white); margin-bottom: 12px; }
.dp-tech-item { padding: 8px 12px; border-left: 3px solid var(--color-primary); margin-bottom: 6px; font-size: 13px; color: rgba(255,255,255,0.75); background: rgba(255,255,255,0.03); }
.dp-tech__note { text-align: center; font-size: 13px; color: rgba(255,255,255,0.5); margin-bottom: 20px; }
.dp-tech__actions { display: flex; gap: 12px; justify-content: center; }

/* Parts */
.dp-parts__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; margin-bottom: 24px; }
.dp-parts__col h3 { font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 12px; }
.dp-parts-item { padding: 8px 12px; background: var(--color-light); border-radius: var(--radius); font-size: 13px; color: var(--color-text); margin-bottom: 6px; }
.dp-parts__packages { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-bottom: 24px; }
.dp-parts-package { padding: 14px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); text-align: center; }
.dp-parts-package h4 { font-size: 13px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.dp-parts-package p { font-size: 11px; color: var(--color-text-secondary); }

/* Inventory */
.dp-inventory__levels { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 24px; }
.dp-inventory-level { padding: 20px 16px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.dp-inventory-level h3 { font-size: 14px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.dp-inventory-level p { font-size: 12px; color: var(--color-text-secondary); }
.dp-inventory__tips { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 16px; }
.dp-inventory-tip { padding: 10px; background: var(--color-light); border-radius: var(--radius); font-size: 12px; color: var(--color-text-secondary); }
.dp-inventory__note { text-align: center; font-size: 13px; color: var(--color-metal); margin-bottom: 20px; }

/* Territory */
.dp-territory__text { text-align: center; max-width: 700px; margin: 0 auto 24px; font-size: 15px; color: var(--color-text-secondary); }
.dp-territory__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 24px; }
.dp-territory-factor { padding: 12px; background: var(--color-light); border-radius: var(--radius); text-align: center; font-size: 13px; color: var(--color-text); }
.dp-territory__forms { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 16px; }
.dp-territory-form { padding: 8px 16px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; color: var(--color-text); }
.dp-territory__note { text-align: center; font-size: 13px; color: var(--color-metal); margin-bottom: 20px; }

/* Exclusivity */
.dp-exclusivity { background: var(--color-dark); }
.dp-exclusivity__steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 16px; }
.dp-exclusivity-step { padding: 20px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius-lg); }
.dp-exclusivity-step__num { display: block; font-family: var(--font-heading); font-size: 24px; font-weight: 700; color: var(--color-primary); margin-bottom: 6px; }
.dp-exclusivity-step h3 { font-size: 15px; font-weight: 600; color: var(--color-white); margin-bottom: 6px; }
.dp-exclusivity-step p { font-size: 12px; color: rgba(255,255,255,0.65); line-height: 1.5; }
.dp-exclusivity__note { text-align: center; font-size: 13px; color: rgba(255,255,255,0.5); }

/* Requirements */
.dp-requirements__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.dp-req-col h3 { font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 12px; padding-bottom: 8px; border-bottom: 2px solid var(--color-primary); }
.dp-req-item { padding: 8px 0; font-size: 13px; color: var(--color-text-secondary); border-bottom: 1px solid var(--color-border); }

/* Checklist */
.dp-checklist__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 24px; }
.dp-checklist-item { padding: 10px 14px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; color: var(--color-text); display: flex; align-items: center; gap: 8px; }
.dp-checklist-item::before { content: ''; width: 16px; height: 16px; border: 2px solid var(--color-border); border-radius: 3px; flex-shrink: 0; }

/* Process */
.dp-process__timeline { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-bottom: 16px; }
.dp-process-step { padding: 18px 12px; background: var(--color-light); border-radius: var(--radius-lg); text-align: center; position: relative; }
.dp-process-step__num { display: block; font-family: var(--font-heading); font-size: 28px; font-weight: 700; color: var(--color-primary); margin-bottom: 6px; }
.dp-process-step h3 { font-size: 13px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.dp-process-step p { font-size: 11px; color: var(--color-text-secondary); line-height: 1.4; }
.dp-process__note { text-align: center; font-size: 13px; color: var(--color-metal); }

/* First Order */
.dp-first { background: var(--color-dark); }
.dp-first__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; margin-bottom: 16px; }
.dp-first__col h3 { font-size: 16px; font-weight: 600; color: var(--color-white); margin-bottom: 12px; }
.dp-first-item { padding: 8px 12px; border-left: 3px solid var(--color-primary); margin-bottom: 6px; font-size: 13px; color: rgba(255,255,255,0.75); background: rgba(255,255,255,0.03); }
.dp-first__note { text-align: center; font-size: 13px; color: rgba(255,255,255,0.5); margin-bottom: 20px; }

/* Long-Term */
.dp-longterm__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 16px; }
.dp-longterm-item { padding: 14px; background: var(--color-light); border-radius: var(--radius); text-align: center; font-size: 13px; color: var(--color-text); }
.dp-longterm__note { text-align: center; font-size: 13px; color: var(--color-metal); }

/* Toolkit */
.dp-toolkit__grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.dp-toolkit-item { padding: 14px 10px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); text-align: center; transition: all var(--transition); }
.dp-toolkit-item:hover { border-color: var(--color-primary); }
.dp-toolkit-item h4 { font-size: 12px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.dp-toolkit-item p { font-size: 11px; color: var(--color-metal); }

/* Scenarios */
.dp-scenarios__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.dp-scenario { padding: 24px 18px; background: var(--color-light); border-radius: var(--radius-lg); }
.dp-scenario__label { font-size: 11px; font-weight: 600; color: var(--color-primary); text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 8px; }
.dp-scenario h3 { font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 8px; }
.dp-scenario p { font-size: 12px; color: var(--color-text-secondary); line-height: 1.5; margin-bottom: 8px; }
.dp-scenario__needs { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 10px; }
.dp-scenario__need { font-size: 11px; padding: 3px 8px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); color: var(--color-text-secondary); }
.dp-scenario__tag { font-size: 10px; color: var(--color-metal); font-style: italic; }

/* FAQ */
.dp-faq .faq__list { max-width: 800px; margin: 0 auto 24px; }

/* Application Form */
.dp-apply__steps { display: flex; justify-content: center; gap: 4px; margin-bottom: 28px; }
.dp-apply__step { display: flex; align-items: center; gap: 8px; padding: 10px 18px; background: var(--color-light); border: 2px solid transparent; border-radius: var(--radius); font-size: 13px; font-weight: 500; color: var(--color-text-secondary); cursor: pointer; transition: all var(--transition); }
.dp-apply__step--active { border-color: var(--color-primary); color: var(--color-primary); background: var(--color-white); }
.dp-apply__step--done { border-color: var(--color-success); color: var(--color-success); }
.dp-apply__step-num { display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; background: var(--color-border); font-size: 12px; font-weight: 600; color: var(--color-text); }
.dp-apply__step--active .dp-apply__step-num { background: var(--color-primary); color: var(--color-white); }
.dp-apply__step--done .dp-apply__step-num { background: var(--color-success); color: var(--color-white); }
.dp-apply__form { background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 32px; }
.dp-apply__honeypot { position: absolute; left: -9999px; height: 0; opacity: 0; }
.dp-apply__panel h3 { font-family: var(--font-heading); font-size: 22px; font-weight: 700; color: var(--color-text); margin-bottom: 20px; }
.dp-apply__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 16px; }
.dp-apply__field { display: flex; flex-direction: column; }
.dp-apply__field--full { grid-column: 1 / -1; }
.dp-apply__field label { font-size: 12px; font-weight: 500; color: var(--color-text); margin-bottom: 4px; }
.dp-apply__field input, .dp-apply__field select, .dp-apply__field textarea { padding: 10px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-family: var(--font-body); color: var(--color-text); background: var(--color-white); }
.dp-apply__field input:focus, .dp-apply__field select:focus, .dp-apply__field textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 2px rgba(200,16,46,0.1); }
.dp-apply__field input.error, .dp-apply__field select.error { border-color: var(--color-error); }
.dp-apply__error { font-size: 11px; color: var(--color-error); margin-top: 2px; min-height: 14px; }
.dp-apply__checks { display: flex; flex-wrap: wrap; gap: 6px; }
.dp-apply__check { display: flex; align-items: center; gap: 5px; padding: 6px 10px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 12px; color: var(--color-text-secondary); cursor: pointer; transition: all var(--transition); }
.dp-apply__check:hover { border-color: var(--color-primary); }
.dp-apply__check--selected { border-color: var(--color-primary); background: rgba(200,16,46,0.04); color: var(--color-primary); }
.dp-apply__check input { accent-color: var(--color-primary); }
.dp-apply__disclaimer { font-size: 12px; color: var(--color-warning, #B46B00); background: #FFF8E1; padding: 10px 14px; border-radius: var(--radius); border-left: 3px solid var(--color-warning, #B46B00); }
.dp-apply__nav { display: flex; justify-content: space-between; align-items: center; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--color-border); }

/* Upload */
.dp-apply__upload { margin-top: 8px; }
.dp-apply__upload-zone { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 32px; border: 2px dashed var(--color-border); border-radius: var(--radius-lg); cursor: pointer; transition: all var(--transition); text-align: center; }
.dp-apply__upload-zone:hover { border-color: var(--color-primary); background: rgba(200,16,46,0.02); }
.dp-apply__upload-zone svg { color: var(--color-metal); margin-bottom: 8px; }
.dp-apply__upload-zone p { font-size: 14px; font-weight: 500; color: var(--color-text); margin-bottom: 4px; }
.dp-apply__upload-zone span { font-size: 12px; color: var(--color-metal); }
.dp-apply__upload-list { display: flex; flex-direction: column; gap: 6px; margin-top: 10px; }
.dp-apply__upload-file { display: flex; align-items: center; gap: 10px; padding: 8px 12px; background: var(--color-light); border-radius: var(--radius); }
.dp-apply__upload-file span { font-size: 12px; color: var(--color-text); flex: 1; }
.dp-apply__upload-file small { font-size: 11px; color: var(--color-metal); }
.dp-apply__upload-file button { background: none; border: none; color: var(--color-metal); cursor: pointer; font-size: 16px; }
.dp-apply__upload-file button:hover { color: var(--color-primary); }
.dp-apply__upload-note { font-size: 11px; color: var(--color-metal); margin-top: 6px; }

/* Consent */
.dp-apply__consent { margin: 20px 0; display: flex; flex-direction: column; gap: 10px; }
.dp-apply__checkbox { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; color: var(--color-text-secondary); cursor: pointer; }
.dp-apply__checkbox input { margin-top: 2px; accent-color: var(--color-primary); }

/* Review */
.dp-apply__review { background: var(--color-light); padding: 20px; border-radius: var(--radius-lg); margin-bottom: 20px; }
.dp-apply__review h4 { font-size: 14px; font-weight: 600; color: var(--color-text); margin: 16px 0 8px; padding-bottom: 6px; border-bottom: 1px solid var(--color-border); }
.dp-apply__review h4:first-child { margin-top: 0; }
.dp-apply__review-row { display: grid; grid-template-columns: 180px 1fr; gap: 8px; padding: 4px 0; font-size: 13px; }
.dp-apply__review-label { font-weight: 500; color: var(--color-text); }
.dp-apply__review-value { color: var(--color-text-secondary); }

/* Submit */
.dp-apply__submit { }
.dp-apply__success { text-align: center; padding: 32px; }
.dp-apply__success svg { color: var(--color-success); margin-bottom: 12px; }
.dp-apply__success h3 { font-family: var(--font-heading); font-size: 24px; font-weight: 700; color: var(--color-text); margin-bottom: 12px; }
.dp-apply__success p { font-size: 15px; color: var(--color-text-secondary); margin-bottom: 20px; max-width: 600px; margin-left: auto; margin-right: auto; }
.dp-apply__success-info { background: var(--color-light); padding: 16px; border-radius: var(--radius-lg); margin-bottom: 20px; text-align: left; max-width: 500px; margin-left: auto; margin-right: auto; }
.dp-apply__success-info .dp-apply__review-row { font-size: 12px; }
.dp-apply__success-links { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }

/* ============================
   DEALER PROGRAM RESPONSIVE
   ============================ */
@media (max-width: 1199px) {
  .dp-hero { height: 560px; }
  .dp-hero__title { font-size: 42px; }
  .dp-partners__grid, .dp-why__grid { grid-template-columns: repeat(3, 1fr); }
  .dp-products__grid { grid-template-columns: repeat(4, 1fr); }
  .dp-options__grid { grid-template-columns: repeat(3, 1fr); }
  .dp-market__steps { grid-template-columns: repeat(4, 1fr); }
  .dp-process__timeline { grid-template-columns: repeat(5, 1fr); }
  .dp-inventory__levels { grid-template-columns: repeat(2, 1fr); }
  .dp-exclusivity__steps { grid-template-columns: repeat(3, 1fr); }
  .dp-scenarios__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 991px) {
  .dp-hero { height: 520px; }
  .dp-hero__title { font-size: 36px; }
  .dp-overview__inner { grid-template-columns: 1fr; }
  .dp-training__inner { grid-template-columns: 1fr; }
  .dp-tech__grid { grid-template-columns: 1fr; }
  .dp-parts__inner { grid-template-columns: 1fr; }
  .dp-first__grid { grid-template-columns: 1fr; }
  .dp-process__timeline { grid-template-columns: repeat(5, 1fr); }
  .dp-apply__steps { flex-wrap: wrap; }
}

@media (max-width: 767px) {
  .dp-hero { height: 480px; }
  .dp-hero__title { font-size: 30px; }
  .dp-hero__desc { font-size: 15px; }
  .dp-hero__buttons { flex-direction: column; gap: 10px; }
  .dp-hero__buttons .btn { width: 100%; }
  .dp-partners__grid, .dp-why__grid { grid-template-columns: repeat(2, 1fr); }
  .dp-products__grid { grid-template-columns: repeat(2, 1fr); }
  .dp-products__actions { flex-direction: column; align-items: stretch; }
  .dp-products__actions .btn { width: 100%; }
  .dp-options__grid { grid-template-columns: repeat(2, 1fr); }
  .dp-market__steps { grid-template-columns: repeat(2, 1fr); }
  .dp-market__form-grid { grid-template-columns: 1fr; }
  .dp-oem__grid { grid-template-columns: repeat(2, 1fr); }
  .dp-oem__steps { grid-template-columns: repeat(2, 1fr); }
  .dp-sales__grid { grid-template-columns: repeat(2, 1fr); }
  .dp-parts__packages { grid-template-columns: repeat(2, 1fr); }
  .dp-inventory__levels { grid-template-columns: 1fr; }
  .dp-inventory__tips { grid-template-columns: repeat(2, 1fr); }
  .dp-territory__grid { grid-template-columns: repeat(2, 1fr); }
  .dp-exclusivity__steps { grid-template-columns: 1fr; }
  .dp-requirements__grid { grid-template-columns: 1fr; }
  .dp-checklist__grid { grid-template-columns: 1fr; }
  .dp-process__timeline { grid-template-columns: 1fr; }
  .dp-longterm__grid { grid-template-columns: repeat(2, 1fr); }
  .dp-toolkit__grid { grid-template-columns: repeat(2, 1fr); }
  .dp-scenarios__grid { grid-template-columns: 1fr; }
  .dp-apply__grid { grid-template-columns: 1fr; }
  .dp-apply__form { padding: 20px; }
  .dp-apply__steps { flex-direction: column; align-items: stretch; }
  .dp-apply__nav { flex-direction: column; gap: 10px; }
  .dp-apply__nav .btn { width: 100%; }
  .dp-apply__review-row { grid-template-columns: 1fr; }
}

@media (max-width: 479px) {
  .dp-hero { height: 450px; }
  .dp-hero__title { font-size: 26px; }
  .dp-partners__grid, .dp-why__grid { grid-template-columns: 1fr; }
  .dp-products__grid { grid-template-columns: 1fr; }
  .dp-options__grid { grid-template-columns: 1fr; }
  .dp-market__steps { grid-template-columns: 1fr; }
  .dp-oem__steps { grid-template-columns: 1fr; }
  .dp-parts__packages { grid-template-columns: 1fr; }
  .dp-longterm__grid { grid-template-columns: 1fr; }
  .dp-toolkit__grid { grid-template-columns: 1fr; }
}

/* ============================================
   APPLICATIONS PAGE STYLES
   ============================================ */

/* App Hero */
.app-hero { position: relative; height: 620px; overflow: hidden; display: flex; align-items: center; }
.app-hero__bg { position: absolute; inset: 0; }
.app-hero__bg-img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.app-hero__overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(17,24,32,0.88) 0%, rgba(17,24,32,0.55) 50%, rgba(17,24,32,0.15) 100%); }
.app-hero__content { position: relative; z-index: 2; max-width: 760px; }
.app-hero__breadcrumb { display: flex; align-items: center; gap: 8px; font-size: 13px; color: rgba(255,255,255,0.6); margin-bottom: 14px; }
.app-hero__breadcrumb a { color: rgba(255,255,255,0.6); }
.app-hero__breadcrumb a:hover { color: var(--color-white); }
.app-hero__breadcrumb span:last-child { color: var(--color-white); }
.app-hero__eyebrow { display: block; font-size: 13px; font-weight: 600; letter-spacing: 2px; color: var(--color-primary-light, #e8455a); margin-bottom: 12px; }
.app-hero__title { font-family: var(--font-heading); font-size: 52px; font-weight: 800; color: var(--color-white); line-height: 1.08; margin-bottom: 16px; }
.app-hero__desc { font-size: 17px; color: rgba(255,255,255,0.8); line-height: 1.7; margin-bottom: 28px; }
.app-hero__buttons { display: flex; gap: 12px; margin-bottom: 28px; flex-wrap: wrap; }
.app-hero__tags { display: flex; gap: 20px; flex-wrap: wrap; }
.app-hero__tag { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 500; color: rgba(255,255,255,0.75); }
.app-hero__tag svg { color: var(--color-primary-light, #e8455a); }

/* App Overview */
.app-overview__inner { display: grid; grid-template-columns: 1.2fr 1fr; gap: 48px; align-items: center; }
.app-overview__content p { font-size: 16px; color: var(--color-text-secondary); line-height: 1.7; margin-bottom: 12px; }
.app-overview__quote { padding: 16px 20px; border-left: 4px solid var(--color-primary); background: var(--color-light); border-radius: 0 var(--radius) var(--radius) 0; font-size: 15px; font-weight: 500; color: var(--color-text); margin: 20px 0 24px; font-style: italic; }
.app-overview__grid-img { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.app-overview__grid-img img { width: 100%; aspect-ratio: 3 / 2; border-radius: var(--radius-lg); height: 100%; object-fit: cover; display: block; }

/* App Navigation Cards */
.app-nav__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.app-nav__card { display: block; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden; transition: all var(--transition); }
.app-nav__card:hover { transform: translateY(-4px); box-shadow: 0 8px 32px rgba(0,0,0,0.08); border-color: var(--color-primary); }
.app-nav__card--active { border-color: var(--color-primary); box-shadow: 0 0 0 2px rgba(200,16,46,0.2); }
.app-nav__card-img { aspect-ratio: 3 / 2; overflow: hidden; background: var(--color-light); }
.app-nav__card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--transition); }
.app-nav__card:hover .app-nav__card-img img { transform: scale(1.04); }
.app-nav__card-body { padding: 16px; }
.app-nav__card-title { font-family: var(--font-heading); font-size: 18px; font-weight: 700; color: var(--color-text); margin-bottom: 6px; }
.app-nav__card-desc { font-size: 13px; color: var(--color-text-secondary); line-height: 1.5; margin-bottom: 10px; }
.app-nav__card-factors { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 10px; }
.app-nav__card-factors span { font-size: 11px; padding: 2px 8px; background: var(--color-light); border-radius: var(--radius); color: var(--color-text-secondary); }
.app-nav__card-btn { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; font-weight: 600; color: var(--color-primary); }
.app-nav__card-btn svg { transition: transform var(--transition); }
.app-nav__card:hover .app-nav__card-btn svg { transform: translateX(4px); }

/* App Selector */
.app-selector__wrapper { max-width: 900px; margin: 0 auto; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 32px; }
.app-selector__progress { margin-bottom: 28px; }
.app-selector__progress-bar { height: 6px; background: var(--color-light); border-radius: 3px; overflow: hidden; }
.app-selector__progress-fill { height: 100%; background: var(--color-primary); border-radius: 3px; transition: width 300ms ease; width: 14.28%; }
.app-selector__progress-text { display: block; text-align: center; font-size: 13px; font-weight: 600; color: var(--color-primary); margin-top: 8px; }
.app-selector__step { display: none; border: none; padding: 0; margin: 0 0 20px; }
.app-selector__step--active { display: block; }
.app-selector__step legend { font-family: var(--font-heading); font-size: 22px; font-weight: 700; color: var(--color-text); margin-bottom: 16px; }
.app-selector__hint { font-size: 13px; color: var(--color-metal); margin-bottom: 12px; }
.app-selector__options { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.app-selector__opt { display: flex; align-items: center; gap: 8px; padding: 12px 16px; border: 2px solid var(--color-border); border-radius: var(--radius); cursor: pointer; transition: all var(--transition); font-size: 14px; font-weight: 500; color: var(--color-text); }
.app-selector__opt:hover { border-color: var(--color-primary); }
.app-selector__opt.selected { border-color: var(--color-primary); background: rgba(200,16,46,0.04); color: var(--color-primary); }
.app-selector__opt input { accent-color: var(--color-primary); }
.app-selector__fields { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.app-selector__field { display: flex; flex-direction: column; }
.app-selector__field label { font-size: 12px; font-weight: 500; color: var(--color-text); margin-bottom: 4px; }
.app-selector__field input { padding: 10px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-family: var(--font-body); }
.app-selector__field input:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 2px rgba(200,16,46,0.1); }
.app-selector__actions { display: flex; justify-content: space-between; align-items: center; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--color-border); }

/* Selector Result */
.app-selector__result { max-width: 900px; margin: 0 auto; }
.app-selector__result-title { font-family: var(--font-heading); font-size: 24px; font-weight: 700; color: var(--color-text); margin-bottom: 20px; }
.app-selector__result-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 20px; }
.app-selector__result-item { padding: 14px; background: var(--color-light); border-radius: var(--radius); }
.app-selector__result-item strong { display: block; font-size: 12px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.app-selector__result-item span { font-size: 14px; color: var(--color-primary); font-weight: 500; }
.app-selector__direction-box { padding: 20px; background: rgba(200,16,46,0.06); border: 2px solid var(--color-primary); border-radius: var(--radius-lg); margin-bottom: 20px; text-align: center; }
.app-selector__direction-box strong { display: block; font-size: 13px; color: var(--color-text-secondary); margin-bottom: 6px; }
.app-selector__direction-box span { font-size: 20px; font-weight: 700; color: var(--color-primary); font-family: var(--font-heading); }
.app-selector__disclaimer { font-size: 13px; color: var(--color-warning, #B46B00); background: #FFF8E1; padding: 12px 16px; border-radius: var(--radius); border-left: 3px solid var(--color-warning, #B46B00); margin-bottom: 20px; }
.app-selector__result-actions { display: flex; gap: 10px; flex-wrap: wrap; }

/* App Module */
.app-module__inner { display: grid; grid-template-columns: 1.1fr 1fr; gap: 48px; align-items: start; }
.app-module__desc { font-size: 16px; line-height: 1.7; margin-bottom: 16px; }
.app-module__note { display: flex; gap: 10px; padding: 14px 16px; background: #FFF8E1; border-left: 3px solid var(--color-warning, #B46B00); border-radius: 0 var(--radius) var(--radius) 0; margin-bottom: 20px; }
.app-module__note svg { flex-shrink: 0; color: var(--color-warning, #B46B00); }
.app-module__note p { font-size: 13px; color: var(--color-text-secondary); line-height: 1.5; }
.app-module__note--dark { background: rgba(255,255,255,0.06); border-left-color: rgba(255,255,255,0.3); }
.app-module__note--dark p { color: rgba(255,255,255,0.7); }
.app-module__note--warning { background: #FFF3E0; border-left-color: #E65100; }
.app-module__note--warning svg { color: #E65100; }
.app-module__sub-title { font-family: var(--font-heading); font-size: 16px; font-weight: 600; color: var(--color-text); margin: 16px 0 10px; }
.app-module__tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.app-module__tag { font-size: 13px; padding: 5px 12px; background: var(--color-light); border-radius: var(--radius); color: var(--color-text-secondary); font-weight: 500; }
.app-module__tag--impl { background: rgba(200,16,46,0.06); color: var(--color-primary); border: 1px solid rgba(200,16,46,0.15); }
.app-module__list { margin-bottom: 16px; padding-left: 18px; list-style: disc; }
.app-module__list li { font-size: 14px; color: var(--color-text-secondary); line-height: 1.6; padding: 2px 0; }
.app-module__actions { display: flex; gap: 10px; margin-top: 20px; flex-wrap: wrap; }
.app-module__visual { aspect-ratio: 3 / 2; border-radius: var(--radius-lg); overflow: hidden; background: var(--color-light); }
.app-module__visual img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Configuration Matrix */
.app-matrix { background: var(--color-dark); }
.app-matrix__scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; margin-bottom: 16px; }
.app-matrix__table { width: 100%; border-collapse: collapse; min-width: 900px; }
.app-matrix__table thead { background: rgba(255,255,255,0.08); }
.app-matrix__table th { padding: 14px 16px; font-size: 13px; font-weight: 600; color: var(--color-white); text-align: left; border-bottom: 2px solid rgba(255,255,255,0.1); white-space: nowrap; }
.app-matrix__table td { padding: 12px 16px; font-size: 13px; color: rgba(255,255,255,0.75); border-bottom: 1px solid rgba(255,255,255,0.06); }
.app-matrix__table td strong { color: var(--color-white); font-weight: 600; }
.app-matrix__table tbody tr:hover { background: rgba(255,255,255,0.04); }
.app-matrix__note { text-align: center; font-size: 13px; color: rgba(255,255,255,0.5); }

/* Implement Matching */
.app-implements__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 24px; }
.app-implements__card { background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden; transition: all var(--transition); }
.app-implements__card:hover { transform: translateY(-3px); box-shadow: 0 6px 24px rgba(0,0,0,0.06); }
.app-implements__card-img { height: 150px; overflow: hidden; background: var(--color-light); }
.app-implements__card-img img { width: 100%; height: 100%; object-fit: cover; }
.app-implements__card-body { padding: 14px; }
.app-implements__card-title { font-family: var(--font-heading); font-size: 16px; font-weight: 700; color: var(--color-text); margin-bottom: 6px; }
.app-implements__card-app { font-size: 12px; color: var(--color-text-secondary); margin-bottom: 8px; }
.app-implements__card-confirm { margin-bottom: 10px; }
.app-implements__card-confirm strong { font-size: 12px; color: var(--color-text); }
.app-implements__card-confirm ul { list-style: disc; padding-left: 14px; margin-top: 4px; }
.app-implements__card-confirm li { font-size: 11px; color: var(--color-text-secondary); padding: 1px 0; }
.app-implements__card-actions { display: flex; gap: 6px; }
.app-implements__card-actions .btn { font-size: 11px; padding: 6px 10px; }
.app-implements__actions { display: flex; gap: 12px; justify-content: center; }

/* Soil Cards */
.app-soil__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.app-soil__card { background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 20px; transition: all var(--transition); }
.app-soil__card:hover { border-color: var(--color-primary); transform: translateY(-2px); }
.app-soil__card-title { font-family: var(--font-heading); font-size: 18px; font-weight: 700; color: var(--color-text); margin-bottom: 12px; padding-bottom: 8px; border-bottom: 2px solid var(--color-primary); }
.app-soil__card-row { display: flex; gap: 8px; padding: 6px 0; font-size: 13px; border-bottom: 1px solid var(--color-light); }
.app-soil__card-row strong { color: var(--color-text); font-weight: 500; min-width: 120px; flex-shrink: 0; }
.app-soil__card-row span { color: var(--color-text-secondary); }

/* Climate Cards */
.app-climate__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 24px; }
.app-climate__card { background: var(--color-light); border-radius: var(--radius-lg); padding: 20px; }
.app-climate__card-title { font-family: var(--font-heading); font-size: 18px; font-weight: 700; color: var(--color-text); margin-bottom: 12px; }
.app-climate__card-conditions, .app-climate__card-config { margin-bottom: 10px; }
.app-climate__card-conditions strong, .app-climate__card-config strong { display: block; font-size: 12px; color: var(--color-text); margin-bottom: 4px; }
.app-climate__card-conditions span, .app-climate__card-config span { display: inline-block; font-size: 12px; padding: 2px 8px; background: var(--color-white); border-radius: var(--radius); color: var(--color-text-secondary); margin: 2px; }
.app-climate__card-config span { background: rgba(200,16,46,0.06); color: var(--color-primary); }
.app-climate__action { text-align: center; }

/* Scenarios */
.app-scenarios__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.app-scenarios__card { background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 20px; transition: all var(--transition); }
.app-scenarios__card:hover { border-color: var(--color-primary); }
.app-scenarios__label { font-size: 11px; font-weight: 600; color: var(--color-primary); text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 8px; }
.app-scenarios__title { font-family: var(--font-heading); font-size: 18px; font-weight: 700; color: var(--color-text); margin-bottom: 12px; }
.app-scenarios__row { display: flex; gap: 8px; padding: 5px 0; font-size: 13px; border-bottom: 1px solid var(--color-light); }
.app-scenarios__row strong { color: var(--color-text); font-weight: 500; min-width: 140px; flex-shrink: 0; }
.app-scenarios__row span { color: var(--color-text-secondary); }
.app-scenarios__implements { margin: 10px 0; }
.app-scenarios__implements strong { font-size: 12px; color: var(--color-text); display: block; margin-bottom: 4px; }
.app-scenarios__implements span { display: inline-block; font-size: 11px; padding: 2px 8px; background: var(--color-light); border-radius: var(--radius); color: var(--color-text-secondary); margin: 2px; }

/* Product Directions */
.app-products__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.app-products__card { background: var(--color-light); border-radius: var(--radius-lg); padding: 24px; transition: all var(--transition); }
.app-products__card:hover { background: var(--color-white); box-shadow: 0 6px 24px rgba(0,0,0,0.06); }
.app-products__card-title { font-family: var(--font-heading); font-size: 22px; font-weight: 700; color: var(--color-text); margin-bottom: 10px; }
.app-products__card-desc { font-size: 14px; color: var(--color-text-secondary); line-height: 1.6; margin-bottom: 12px; }
.app-products__card-row { display: flex; gap: 8px; padding: 4px 0; font-size: 13px; }
.app-products__card-row strong { color: var(--color-text); font-weight: 500; }
.app-products__card-row span { color: var(--color-text-secondary); }
.app-products__card-actions { display: flex; gap: 8px; margin-top: 14px; }

/* Parts & Maintenance */
.app-parts { background: var(--color-dark); }
.app-parts__inner { max-width: 900px; margin: 0 auto; text-align: center; }
.app-parts__text { font-size: 16px; color: rgba(255,255,255,0.8); line-height: 1.7; margin-bottom: 24px; }
.app-parts__conditions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 20px; }
.app-parts__condition { display: flex; align-items: center; gap: 8px; padding: 8px 16px; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: var(--radius); font-size: 13px; color: rgba(255,255,255,0.8); }
.app-parts__cond-icon { color: var(--color-primary); }
.app-parts__packages { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 28px; }
.app-parts__packages span { padding: 6px 14px; background: rgba(200,16,46,0.15); border: 1px solid rgba(200,16,46,0.3); border-radius: var(--radius); font-size: 13px; font-weight: 500; color: var(--color-white); }
.app-parts__actions { display: flex; gap: 12px; justify-content: center; }

/* App FAQ */
.app-faq .faq__list { max-width: 800px; margin: 0 auto 24px; }

/* App Form */
.app-form__form { max-width: 900px; margin: 0 auto; }
.app-form__steps { display: flex; justify-content: center; align-items: center; gap: 4px; margin-bottom: 28px; }
.app-form__step-indicator { display: flex; align-items: center; gap: 6px; }
.app-form__step-dot { display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; background: var(--color-light); font-size: 12px; font-weight: 600; color: var(--color-text-secondary); }
.app-form__step-dot--active { background: var(--color-primary); color: var(--color-white); }
.app-form__step-label { font-size: 13px; font-weight: 500; color: var(--color-text-secondary); }
.app-form__step-line { width: 40px; height: 2px; background: var(--color-border); }
.app-form__panel { display: none; }
.app-form__panel--active { display: block; }
.app-form__panel-title { font-family: var(--font-heading); font-size: 22px; font-weight: 700; color: var(--color-text); margin-bottom: 20px; }
.app-form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 16px; }
.app-form__field { display: flex; flex-direction: column; }
.app-form__field--full { grid-column: 1 / -1; }
.app-form__field label { font-size: 12px; font-weight: 500; color: var(--color-text); margin-bottom: 4px; }
.app-form__field input, .app-form__field select, .app-form__field textarea { padding: 10px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-family: var(--font-body); color: var(--color-text); background: var(--color-white); }
.app-form__field input:focus, .app-form__field select:focus, .app-form__field textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 2px rgba(200,16,46,0.1); }
.app-form__field input.error, .app-form__field select.error { border-color: var(--color-error, #dc3545); }
.app-form__error { font-size: 11px; color: var(--color-error, #dc3545); margin-top: 2px; min-height: 14px; }
.app-form__consent { margin: 20px 0; display: flex; flex-direction: column; gap: 10px; }
.app-form__checkbox { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; color: var(--color-text-secondary); cursor: pointer; }
.app-form__checkbox input { margin-top: 2px; accent-color: var(--color-primary); }
.app-form__nav { display: flex; justify-content: space-between; align-items: center; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--color-border); }
.app-form__honeypot { position: absolute; left: -9999px; height: 0; opacity: 0; }

/* Upload */
.app-upload__drop { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 32px; border: 2px dashed var(--color-border); border-radius: var(--radius-lg); cursor: pointer; transition: all var(--transition); text-align: center; }
.app-upload__drop:hover, .app-upload__drop.dragover { border-color: var(--color-primary); background: rgba(200,16,46,0.02); }
.app-upload__drop svg { color: var(--color-metal); margin-bottom: 8px; }
.app-upload__drop p { font-size: 14px; font-weight: 500; color: var(--color-text); margin-bottom: 4px; }
.app-upload__drop span { font-size: 12px; color: var(--color-metal); }
.app-upload__preview { display: flex; flex-direction: column; gap: 6px; margin-top: 10px; }
.app-upload__file { display: flex; align-items: center; gap: 10px; padding: 8px 12px; background: var(--color-light); border-radius: var(--radius); }
.app-upload__file-name { font-size: 13px; color: var(--color-text); flex: 1; }
.app-upload__file-size { font-size: 12px; color: var(--color-metal); }
.app-upload__file-remove { background: none; border: none; color: var(--color-metal); cursor: pointer; }
.app-upload__file-remove:hover { color: var(--color-primary); }

/* Review Modal */
.modal__content--review { max-width: 700px; max-height: 80vh; overflow-y: auto; }
.modal__review-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 20px; }
.modal__review-item { padding: 8px 12px; background: var(--color-light); border-radius: var(--radius); }
.modal__review-item strong { display: block; font-size: 11px; font-weight: 600; color: var(--color-text); margin-bottom: 2px; }
.modal__review-item span { font-size: 13px; color: var(--color-text-secondary); }
.modal__review-actions { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.modal__title { font-family: var(--font-heading); font-size: 24px; font-weight: 700; color: var(--color-text); margin-bottom: 16px; }
.modal__desc { font-size: 15px; color: var(--color-text-secondary); line-height: 1.7; margin-bottom: 20px; }

/* Success Modal */
.modal__content--success { max-width: 560px; text-align: center; }
.modal__success-icon { margin-bottom: 16px; }
.modal__success-details { text-align: left; background: var(--color-light); padding: 16px; border-radius: var(--radius-lg); margin-bottom: 20px; }
.modal__success-row { display: flex; gap: 8px; padding: 6px 0; font-size: 13px; border-bottom: 1px solid var(--color-border); }
.modal__success-row strong { color: var(--color-text); min-width: 140px; }
.modal__success-row span { color: var(--color-text-secondary); }

/* ============================
   APPLICATIONS RESPONSIVE
   ============================ */
@media (max-width: 1199px) {
  .app-hero { height: 560px; }
  .app-hero__title { font-size: 44px; }
  .app-nav__grid { grid-template-columns: repeat(3, 1fr); }
  .app-module__inner { grid-template-columns: 1fr; }
  .app-module__visual { order: -1; }
  .app-selector__options { grid-template-columns: repeat(3, 1fr); }
  .app-soil__grid { grid-template-columns: repeat(2, 1fr); }
  .app-climate__grid { grid-template-columns: repeat(2, 1fr); }
  .app-scenarios__grid { grid-template-columns: repeat(2, 1fr); }
  .app-products__grid { grid-template-columns: repeat(2, 1fr); }
  .app-implements__grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 991px) {
  .app-hero { height: 520px; }
  .app-hero__title { font-size: 36px; }
  .app-overview__inner { grid-template-columns: 1fr; }
  .app-selector__options { grid-template-columns: repeat(2, 1fr); }
  .app-selector__fields { grid-template-columns: 1fr; }
  .app-selector__result-grid { grid-template-columns: repeat(2, 1fr); }
  .app-form__grid { grid-template-columns: 1fr; }
  .modal__review-grid { grid-template-columns: 1fr; }
}

@media (max-width: 767px) {
  .app-hero { height: 480px; }
  .app-hero__title { font-size: 30px; }
  .app-hero__desc { font-size: 15px; }
  .app-hero__buttons { flex-direction: column; gap: 10px; }
  .app-hero__buttons .btn { width: 100%; }
  .app-nav__grid { grid-template-columns: repeat(2, 1fr); }
  .app-selector__options { grid-template-columns: 1fr; }
  .app-selector__wrapper { padding: 20px; }
  .app-selector__actions { flex-direction: column; gap: 10px; }
  .app-selector__actions .btn { width: 100%; }
  .app-selector__result-actions { flex-direction: column; }
  .app-selector__result-actions .btn { width: 100%; }
  .app-soil__grid, .app-climate__grid, .app-scenarios__grid, .app-products__grid { grid-template-columns: 1fr; }
  .app-implements__grid { grid-template-columns: repeat(2, 1fr); }
  .app-implements__actions, .app-parts__actions, .app-climate__action { flex-direction: column; align-items: center; }
  .app-form__grid { grid-template-columns: 1fr; }
  .app-form__steps { flex-direction: column; }
  .app-form__step-line { width: 2px; height: 20px; }
  .app-form__nav { flex-direction: column; gap: 10px; }
  .app-form__nav .btn { width: 100%; }
  .app-module__actions { flex-direction: column; }
  .app-module__actions .btn { width: 100%; }
  .modal__review-actions { flex-direction: column; }
  .modal__review-actions .btn { width: 100%; }
}

@media (max-width: 479px) {
  .app-hero { height: 450px; }
  .app-hero__title { font-size: 26px; }
  .app-nav__grid { grid-template-columns: 1fr; }
  .app-implements__grid { grid-template-columns: 1fr; }
  .app-parts__conditions, .app-parts__packages { flex-direction: column; align-items: center; }
}

/* ============================================
   THANK YOU PAGE STYLES
   ============================================ */

/* --- Hero --- */
.ty-hero { padding: 48px 0 40px; background: var(--color-white); text-align: center; }
.ty-hero__inner { max-width: 800px; margin: 0 auto; }
.ty-hero__breadcrumb { display: flex; align-items: center; justify-content: center; gap: 8px; font-size: 13px; color: var(--color-gray); margin-bottom: 28px; }
.ty-hero__breadcrumb a { color: var(--color-gray); }
.ty-hero__breadcrumb a:hover { color: var(--color-primary); }
.ty-hero__breadcrumb span:last-child { color: var(--color-text); }
.ty-hero__icon { margin-bottom: 20px; }
.ty-hero__icon svg { display: inline-block; }
.ty-hero__check { stroke-dasharray: 50; stroke-dashoffset: 50; animation: tyCheckDraw 0.6s ease 0.3s forwards; }
@keyframes tyCheckDraw { to { stroke-dashoffset: 0; } }
.ty-hero__eyebrow { display: block; font-family: var(--font-body); font-size: 13px; font-weight: 600; letter-spacing: 2px; text-transform: uppercase; color: var(--color-success); margin-bottom: 12px; }
.ty-hero__title { font-family: var(--font-heading); font-size: 42px; font-weight: 800; color: var(--color-text); line-height: 1.1; margin-bottom: 16px; letter-spacing: -0.5px; }
.ty-hero__desc { font-size: 16px; color: var(--color-text-secondary); line-height: 1.7; max-width: 640px; margin: 0 auto; }

/* --- Confirmation Card --- */
.ty-card__inner { max-width: 860px; margin: 0 auto; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 32px; box-shadow: 0 2px 12px rgba(0,0,0,0.04); animation: tyFadeUp 0.5s ease 0.2s both; }
@keyframes tyFadeUp { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } }
.ty-card__header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 24px; padding-bottom: 16px; border-bottom: 1px solid var(--color-border); }
.ty-card__heading { font-family: var(--font-heading); font-size: 22px; font-weight: 700; color: var(--color-text); }
.ty-card__status { display: inline-flex; align-items: center; gap: 6px; padding: 6px 14px; background: var(--color-success-light); color: var(--color-success); border-radius: 20px; font-size: 13px; font-weight: 600; }
.ty-card__status::before { content: ''; width: 8px; height: 8px; background: var(--color-success); border-radius: 50%; }
.ty-card__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin-bottom: 24px; }
.ty-card__row { display: flex; justify-content: space-between; padding: 12px 0; border-bottom: 1px solid var(--color-light); }
.ty-card__row:last-child, .ty-card__row:nth-last-child(2):nth-child(odd) { border-bottom: none; }
.ty-card__label { font-size: 14px; color: var(--color-text-secondary); }
.ty-card__value { font-size: 14px; font-weight: 600; color: var(--color-text); text-align: right; }
.ty-card__value--ref { font-family: var(--font-heading); font-size: 18px; font-weight: 700; color: var(--color-primary); letter-spacing: 0.5px; }
.ty-card__actions { display: flex; gap: 10px; flex-wrap: wrap; }
.ty-card__copy-toast { display: inline-flex; align-items: center; gap: 6px; padding: 8px 16px; background: var(--color-success-light); color: var(--color-success); border-radius: var(--radius); font-size: 13px; font-weight: 500; margin-top: 12px; }
.ty-card__demo { display: flex; align-items: flex-start; gap: 8px; padding: 12px 16px; background: #FFF8E1; border: 1px solid #FFE082; border-radius: var(--radius); margin-top: 16px; font-size: 12px; color: #795548; line-height: 1.5; }
.ty-card__demo svg { flex-shrink: 0; color: var(--color-warning); margin-top: 1px; }

/* --- Request Summary --- */
.ty-summary__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 16px; }
.ty-summary__item { padding: 14px 16px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); }
.ty-summary__item span { display: block; font-size: 12px; color: var(--color-text-secondary); margin-bottom: 4px; }
.ty-summary__item strong { font-size: 14px; font-weight: 600; color: var(--color-text); }
.ty-summary__secure { text-align: center; font-size: 13px; color: var(--color-metal); }

/* --- Next Steps --- */
.ty-next { background: var(--color-dark); padding: 80px 0; }
.ty-next__steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.ty-next__step { padding: 20px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius-lg); transition: all var(--transition); }
.ty-next__step:hover { border-color: var(--color-primary); transform: translateY(-2px); }
.ty-next__step span { display: block; font-family: var(--font-heading); font-size: 24px; font-weight: 700; color: var(--color-primary); margin-bottom: 8px; opacity: 0.7; }
.ty-next__step h3 { font-family: var(--font-body); font-size: 14px; font-weight: 500; color: rgba(255,255,255,0.85); line-height: 1.5; }

/* --- Info Tips --- */
.ty-info__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 28px; }
.ty-info__item { display: flex; align-items: center; gap: 8px; padding: 10px 14px; background: var(--color-light); border-radius: var(--radius); font-size: 13px; color: var(--color-text); }
.ty-info__item svg { color: var(--color-primary); flex-shrink: 0; }
.ty-info__action { text-align: center; }

/* --- Recommendations --- */
.ty-recommend__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.ty-recommend__card { display: flex; flex-direction: column; padding: 24px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); transition: all var(--transition); text-decoration: none; color: inherit; }
.ty-recommend__card:hover { border-color: var(--color-primary); transform: translateY(-3px); box-shadow: 0 6px 20px rgba(0,0,0,0.06); }
.ty-recommend__icon { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: var(--color-light); color: var(--color-primary); margin-bottom: 14px; border: 1px solid var(--color-border); transition: all var(--transition); }
.ty-recommend__card:hover .ty-recommend__icon { background: var(--color-primary); color: var(--color-white); border-color: var(--color-primary); }
.ty-recommend__card h3 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 6px; }
.ty-recommend__card p { font-size: 13px; color: var(--color-text-secondary); line-height: 1.5; margin-bottom: 14px; flex: 1; }
.ty-recommend__link { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; font-weight: 600; color: var(--color-primary); }

/* --- Quick Contact --- */
.ty-contact__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.ty-contact__card { display: flex; flex-direction: column; align-items: center; padding: 28px 20px; background: var(--color-light); border: 1px solid var(--color-border); border-radius: var(--radius-lg); text-align: center; transition: all var(--transition); text-decoration: none; color: inherit; }
.ty-contact__card:hover { border-color: var(--color-primary); background: var(--color-white); transform: translateY(-3px); }
.ty-contact__icon { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 50%; background: var(--color-white); color: var(--color-primary); margin-bottom: 12px; border: 1px solid var(--color-border); }
.ty-contact__card:hover .ty-contact__icon { background: var(--color-primary); color: var(--color-white); border-color: var(--color-primary); }
.ty-contact__card h3 { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.ty-contact__card p { font-size: 13px; color: var(--color-text-secondary); }

/* --- Duplicate Notice --- */
.ty-duplicate__inner { display: flex; align-items: center; gap: 20px; max-width: 900px; margin: 0 auto; padding: 24px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.ty-duplicate__icon { flex-shrink: 0; color: var(--color-warning); }
.ty-duplicate__content { flex: 1; }
.ty-duplicate__content h2 { font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.ty-duplicate__content p { font-size: 13px; color: var(--color-text-secondary); }

/* --- Privacy --- */
.ty-privacy__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 24px; }
.ty-privacy__card { padding: 24px; background: var(--color-light); border-radius: var(--radius-lg); text-align: center; }
.ty-privacy__icon { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 50%; background: var(--color-white); color: var(--color-primary); margin: 0 auto 12px; border: 1px solid var(--color-border); }
.ty-privacy__card h3 { font-family: var(--font-body); font-size: 15px; font-weight: 600; color: var(--color-text); margin-bottom: 6px; }
.ty-privacy__card p { font-size: 13px; color: var(--color-text-secondary); }
.ty-privacy__note { text-align: center; font-size: 13px; color: var(--color-text-secondary); margin-bottom: 12px; }
.ty-privacy__note a { color: var(--color-primary); text-decoration: underline; }
.ty-privacy__links { display: flex; gap: 20px; justify-content: center; }
.ty-privacy__links a { font-size: 13px; font-weight: 500; color: var(--color-primary); text-decoration: underline; text-underline-offset: 2px; }

/* --- FAQ --- */
.ty-faq .faq__list { max-width: 800px; margin: 0 auto; }
.faq__item { border-bottom: 1px solid var(--color-border); }
.faq__question { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 18px 0; font-size: 15px; font-weight: 600; color: var(--color-text); text-align: left; gap: 16px; cursor: pointer; background: none; border: none; font-family: var(--font-body); transition: color var(--transition); }
.faq__question:hover { color: var(--color-primary); }
.faq__question svg { flex-shrink: 0; transition: transform var(--transition); color: var(--color-primary); }
.faq__question[aria-expanded="true"] svg { transform: rotate(45deg); }
.faq__answer { padding: 0 0 18px; }
.faq__answer p { font-size: 14px; color: var(--color-text-secondary); line-height: 1.7; }

/* --- Fallback --- */
.ty-fallback { display: flex; align-items: center; justify-content: center; min-height: 60vh; padding: 80px 0; }
.ty-fallback__inner { text-align: center; max-width: 560px; }
.ty-fallback__icon { margin-bottom: 24px; }
.ty-fallback__icon svg { display: inline-block; }
.ty-fallback__title { font-family: var(--font-heading); font-size: 36px; font-weight: 800; color: var(--color-text); margin-bottom: 12px; }
.ty-fallback__desc { font-size: 16px; color: var(--color-text-secondary); margin-bottom: 32px; line-height: 1.6; }
.ty-fallback__actions { display: flex; flex-direction: column; gap: 10px; align-items: center; }
.ty-fallback__actions .btn { min-width: 260px; }

/* --- Print Styles --- */
.ty-print-header, .ty-print-footer { display: none; }
@media print {
  .top-bar, .header, .mobile-menu, .floating, .mobile-bar, .footer,
  .ty-hero__breadcrumb, .ty-card__actions, .ty-card__demo, .ty-card__copy-toast,
  .ty-contact, .ty-duplicate, .ty-recommend, .ty-faq,
  .skip-link, .btn { display: none !important; }
  .ty-print-header { display: flex; align-items: center; gap: 12px; padding: 16px 0; border-bottom: 2px solid var(--color-dark); margin-bottom: 24px; }
  .ty-print-header__logo { display: flex; align-items: center; gap: 8px; font-family: var(--font-heading); font-size: 18px; font-weight: 700; color: var(--color-text); }
  .ty-print-header h2 { font-family: var(--font-heading); font-size: 20px; font-weight: 700; color: var(--color-text); margin-left: auto; }
  .ty-print-footer { display: block; padding: 16px 0; border-top: 1px solid var(--color-border); margin-top: 32px; text-align: center; font-size: 11px; color: var(--color-gray); }
  .ty-print-footer p { margin-bottom: 4px; }
  .ty-hero { padding: 0; }
  .ty-hero__icon, .ty-hero__eyebrow { display: none; }
  .ty-hero__title { font-size: 28px; margin-bottom: 8px; }
  .ty-card__inner { box-shadow: none; border: 1px solid #ccc; }
  .ty-next { background: var(--color-light) !important; color: var(--color-text) !important; }
  .ty-next__step { background: var(--color-white) !important; border: 1px solid #ccc !important; }
  .ty-next__step span { color: var(--color-primary) !important; opacity: 1 !important; }
  .ty-next__step h3 { color: var(--color-text) !important; }
  .section-header__title--light { color: var(--color-text) !important; }
  .section-header__eyebrow--light { color: var(--color-primary) !important; }
  body { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* ============================
   THANK YOU RESPONSIVE
   ============================ */
@media (max-width: 1199px) {
  .ty-next__steps { grid-template-columns: repeat(2, 1fr); }
  .ty-info__grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 991px) {
  .ty-hero__title { font-size: 36px; }
  .ty-card__grid { grid-template-columns: 1fr; }
  .ty-card__value { text-align: left; }
  .ty-card__row { flex-direction: column; gap: 2px; }
  .ty-summary__grid { grid-template-columns: repeat(2, 1fr); }
  .ty-recommend__grid { grid-template-columns: repeat(2, 1fr); }
  .ty-contact__grid { grid-template-columns: repeat(2, 1fr); }
  .ty-privacy__grid { grid-template-columns: repeat(2, 1fr); }
  .ty-duplicate__inner { flex-direction: column; text-align: center; }
}

@media (max-width: 767px) {
  .ty-hero { padding: 32px 0 28px; }
  .ty-hero__title { font-size: 28px; }
  .ty-hero__desc { font-size: 15px; }
  .ty-hero__icon svg { width: 56px; height: 56px; }
  .ty-card__inner { padding: 20px; }
  .ty-card__header { flex-direction: column; align-items: flex-start; gap: 8px; }
  .ty-card__actions { flex-direction: column; }
  .ty-card__actions .btn { width: 100%; }
  .ty-next__steps { grid-template-columns: 1fr; }
  .ty-info__grid { grid-template-columns: repeat(2, 1fr); }
  .ty-recommend__grid { grid-template-columns: 1fr; }
  .ty-contact__grid { grid-template-columns: 1fr; }
  .ty-privacy__grid { grid-template-columns: 1fr; }
  .ty-summary__grid { grid-template-columns: 1fr; }
  .ty-fallback__title { font-size: 28px; }
  .ty-fallback__actions .btn { width: 100%; }
  .ty-card__value--ref { font-size: 15px; word-break: break-all; }
}

@media (max-width: 479px) {
  .ty-hero__title { font-size: 24px; }
  .ty-hero__icon svg { width: 48px; height: 48px; }
  .ty-info__grid { grid-template-columns: 1fr; }
}

/* --- Reduced Motion --- */
@media (prefers-reduced-motion: reduce) {
  .ty-hero__check { animation: none; stroke-dashoffset: 0; }
  .ty-card__inner { animation: none; }
  .ty-next__step:hover, .ty-recommend__card:hover, .ty-contact__card:hover { transform: none; }
}

/* ============================================
   QUALITY CONTROL PAGE STYLES
   ============================================ */

.qc-hero { position: relative; height: 640px; overflow: hidden; display: flex; align-items: center; }
.qc-hero__bg { position: absolute; inset: 0; }
.qc-hero__bg-img { width: 100%; height: 100%; object-fit: cover; }
.qc-hero__overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(17,24,32,0.88) 0%, rgba(17,24,32,0.55) 60%, rgba(17,24,32,0.15) 100%); }
.qc-hero__content { position: relative; z-index: 2; max-width: 800px; }
.qc-hero__breadcrumb { display: flex; align-items: center; gap: 8px; font-size: 13px; color: rgba(255,255,255,0.6); margin-bottom: 14px; }
.qc-hero__breadcrumb a { color: rgba(255,255,255,0.6); }
.qc-hero__breadcrumb a:hover { color: var(--color-white); }
.qc-hero__breadcrumb span:last-child { color: var(--color-white); }
.qc-hero__eyebrow { display: block; font-size: 13px; font-weight: 600; letter-spacing: 2px; color: var(--color-primary-light, #e8455a); margin-bottom: 12px; }
.qc-hero__title { font-family: var(--font-heading); font-size: 48px; font-weight: 800; color: var(--color-white); line-height: 1.08; margin-bottom: 16px; }
.qc-hero__desc { font-size: 17px; color: rgba(255,255,255,0.8); line-height: 1.7; margin-bottom: 28px; }
.qc-hero__buttons { display: flex; gap: 12px; margin-bottom: 28px; flex-wrap: wrap; }
.qc-hero__tags { display: flex; gap: 12px; flex-wrap: wrap; }
.qc-hero__tag { display: inline-block; padding: 6px 14px; background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.15); border-radius: var(--radius); font-size: 13px; font-weight: 500; color: rgba(255,255,255,0.8); }

/* Overview */
.qc-overview__inner { display: grid; grid-template-columns: 1.2fr 1fr; gap: 48px; align-items: center; }
.qc-overview__inner > * { min-width: 0; }
.qc-overview__content p { font-size: 16px; color: var(--color-text-secondary); line-height: 1.7; margin-bottom: 12px; }
.qc-overview__quote { padding: 16px 20px; border-left: 4px solid var(--color-primary); background: var(--color-light); border-radius: 0 var(--radius) var(--radius) 0; font-size: 15px; font-weight: 500; color: var(--color-text); margin: 20px 0 24px; font-style: italic; }
.qc-overview__img-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.qc-overview__img-grid img { width: 100%; border-radius: var(--radius); object-fit: cover; }

/* Process Timeline */
.qc-process__timeline { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; margin-bottom: 16px; }
.qc-process-step { padding: 18px 12px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); text-align: center; transition: all var(--transition); cursor: pointer; }
.qc-process-step:hover { border-color: var(--color-primary); transform: translateY(-2px); }
.qc-process-step__num { display: block; font-family: var(--font-heading); font-size: 24px; font-weight: 700; color: var(--color-primary); margin-bottom: 6px; }
.qc-process-step h3 { font-size: 12px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; line-height: 1.3; }
.qc-process-step p { font-size: 11px; color: var(--color-text-secondary); line-height: 1.3; }
.qc-process__note { text-align: center; font-size: 13px; color: var(--color-metal); }

/* Section Layout */
.qc-section__inner { display: grid; grid-template-columns: 1.2fr 1fr; gap: 48px; align-items: center; }
.qc-section__inner--reverse { grid-template-columns: 1fr 1.2fr; }
.qc-section__inner > * { min-width: 0; }
.qc-section__content p { font-size: 15px; color: var(--color-text-secondary); line-height: 1.7; margin-bottom: 12px; }
.qc-section__note { font-size: 13px; color: var(--color-metal); margin: 16px 0; }
.qc-section__img img { width: 100%; border-radius: var(--radius-lg); }
.qc-section__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 12px; }
.qc-section__item { padding: 8px 12px; background: var(--color-light); border-radius: var(--radius); font-size: 13px; color: var(--color-text); display: flex; align-items: center; gap: 8px; }
.qc-section__item::before { content: ''; width: 6px; height: 6px; background: var(--color-primary); border-radius: 50%; flex-shrink: 0; }

/* Assembly */
.qc-assembly { background: var(--color-dark); }
.qc-assembly__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 20px; }
.qc-assembly-item { padding: 16px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius); }
.qc-assembly-item h3 { font-size: 13px; font-weight: 600; color: var(--color-white); margin-bottom: 6px; }
.qc-assembly-item p { font-size: 11px; color: rgba(255,255,255,0.6); }
.qc-assembly__quote { text-align: center; font-size: 14px; color: rgba(255,255,255,0.7); font-style: italic; max-width: 700px; margin: 0 auto; }

/* Fastener */
.qc-fastener__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 16px; }
.qc-fastener-item { padding: 14px; background: var(--color-light); border-radius: var(--radius); }
.qc-fastener-item h3 { font-size: 13px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.qc-fastener-item p { font-size: 12px; color: var(--color-text-secondary); }

/* Hoses */
.qc-hoses__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.qc-hoses-item { padding: 14px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; color: var(--color-text); }

/* PTO */
.qc-pto { background: var(--color-dark); }
.qc-pto__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 16px; }
.qc-pto-item { padding: 14px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius); font-size: 13px; color: rgba(255,255,255,0.8); }
.qc-pto__note { text-align: center; font-size: 13px; color: rgba(255,255,255,0.5); margin-bottom: 20px; }

/* Linkage */
.qc-linkage__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 16px; }
.qc-linkage-item { padding: 14px; background: var(--color-light); border-radius: var(--radius); font-size: 13px; color: var(--color-text); }

/* Electrical */
.qc-electrical__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.qc-electrical-item { padding: 14px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; color: var(--color-text); }

/* Brake */
.qc-brake { background: var(--color-dark); }
.qc-brake__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 16px; }
.qc-brake-item { padding: 14px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius); font-size: 13px; color: rgba(255,255,255,0.8); }
.qc-brake__note { text-align: center; font-size: 13px; color: rgba(255,255,255,0.5); }

/* Running */
.qc-running__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.qc-running-item { padding: 14px; background: var(--color-light); border-radius: var(--radius); font-size: 13px; color: var(--color-text); }

/* Leakage */
.qc-leakage__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.qc-leakage-item { padding: 14px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; color: var(--color-text); }

/* Tires */
.qc-tires__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.qc-tires-item { padding: 14px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; color: var(--color-text); }

/* OEM */
.qc-oem { background: var(--color-dark); }
.qc-oem__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 16px; }
.qc-oem-item { padding: 14px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius); font-size: 13px; color: rgba(255,255,255,0.8); }
.qc-oem__note { text-align: center; font-size: 13px; color: rgba(255,255,255,0.5); margin-bottom: 20px; }

/* PDI */
.qc-pdi { background: var(--color-dark); }
.qc-pdi__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.qc-pdi-item { padding: 14px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius); font-size: 13px; color: rgba(255,255,255,0.8); display: flex; align-items: center; gap: 8px; }
.qc-pdi-item::before { content: ''; width: 6px; height: 6px; background: var(--color-primary); border-radius: 50%; flex-shrink: 0; }

/* Accessories */
.qc-acc__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.qc-acc-item { padding: 14px; background: var(--color-light); border-radius: var(--radius); font-size: 13px; color: var(--color-text); }

/* Packing */
.qc-packing__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 20px; }
.qc-packing-item { padding: 14px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; color: var(--color-text); }

/* Loading */
.qc-loading__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 20px; }
.qc-loading-item { padding: 14px; background: var(--color-light); border-radius: var(--radius); font-size: 13px; color: var(--color-text); }

/* Records */
.qc-records { background: var(--color-dark); }
.qc-records__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 16px; }
.qc-records-item { padding: 14px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius); font-size: 13px; color: rgba(255,255,255,0.8); }
.qc-records__note { text-align: center; font-size: 13px; color: rgba(255,255,255,0.5); }

/* Non-Conformity */
.qc-noncon__steps { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; margin-bottom: 16px; }
.qc-noncon-step { padding: 18px 12px; background: var(--color-light); border-radius: var(--radius-lg); text-align: center; }
.qc-noncon-step__num { display: block; font-family: var(--font-heading); font-size: 24px; font-weight: 700; color: var(--color-primary); margin-bottom: 6px; }
.qc-noncon-step h3 { font-size: 13px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.qc-noncon-step p { font-size: 11px; color: var(--color-text-secondary); line-height: 1.3; }

/* Inspection Options */
.qc-inspect__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 16px; }
.qc-inspect-card { padding: 24px 18px; background: var(--color-white); border: 2px solid transparent; border-radius: var(--radius-lg); transition: all var(--transition); }
.qc-inspect-card:hover { border-color: var(--color-primary); transform: translateY(-3px); }
.qc-inspect-card h3 { font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 8px; }
.qc-inspect-card p { font-size: 13px; color: var(--color-text-secondary); line-height: 1.5; margin-bottom: 12px; }
.qc-inspect__note { text-align: center; font-size: 13px; color: var(--color-metal); }

/* Third-Party */
.qc-thirdparty__list { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 16px 0; }
.qc-thirdparty-item { padding: 8px 12px; background: var(--color-light); border-radius: var(--radius); font-size: 13px; color: var(--color-text); display: flex; align-items: center; gap: 8px; }
.qc-thirdparty-item::before { content: ''; width: 6px; height: 6px; background: var(--color-primary); border-radius: 50%; flex-shrink: 0; }

/* Video Inspection */
.qc-video { background: var(--color-dark); }
.qc-video__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 24px; }
.qc-video-item { padding: 14px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius); font-size: 13px; color: rgba(255,255,255,0.8); }
.qc-video__steps { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; margin-bottom: 24px; }
.qc-video-step { padding: 14px 8px; background: rgba(255,255,255,0.04); border-radius: var(--radius); text-align: center; }
.qc-video-step__num { display: block; font-family: var(--font-heading); font-size: 20px; font-weight: 700; color: var(--color-primary); margin-bottom: 4px; }
.qc-video-step span { font-size: 11px; color: rgba(255,255,255,0.6); }

/* Documents */
.qc-docs__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.qc-doc-card { padding: 18px 14px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); transition: all var(--transition); cursor: pointer; }
.qc-doc-card:hover { border-color: var(--color-primary); transform: translateY(-2px); }
.qc-doc-card h4 { font-size: 13px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.qc-doc-card p { font-size: 11px; color: var(--color-metal); margin-bottom: 8px; }
.qc-doc-card .btn { font-size: 11px; padding: 5px 10px; }

/* FAQ */
.qc-faq .faq__list { max-width: 800px; margin: 0 auto 24px; }

/* Application Form */
.qc-apply__steps { display: flex; justify-content: center; gap: 4px; margin-bottom: 28px; }
.qc-apply__step { display: flex; align-items: center; gap: 8px; padding: 10px 18px; background: var(--color-light); border: 2px solid transparent; border-radius: var(--radius); font-size: 13px; font-weight: 500; color: var(--color-text-secondary); cursor: pointer; transition: all var(--transition); }
.qc-apply__step--active { border-color: var(--color-primary); color: var(--color-primary); background: var(--color-white); }
.qc-apply__step--done { border-color: var(--color-success, #2F7D4A); color: var(--color-success, #2F7D4A); }
.qc-apply__step-num { display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; background: var(--color-border); font-size: 12px; font-weight: 600; color: var(--color-text); }
.qc-apply__step--active .qc-apply__step-num { background: var(--color-primary); color: var(--color-white); }
.qc-apply__step--done .qc-apply__step-num { background: var(--color-success, #2F7D4A); color: var(--color-white); }
.qc-apply__form { background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 32px; }
.qc-apply__honeypot { position: absolute; left: -9999px; height: 0; opacity: 0; }
.qc-apply__panel h3 { font-family: var(--font-heading); font-size: 22px; font-weight: 700; color: var(--color-text); margin-bottom: 20px; }
.qc-apply__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 16px; }
.qc-apply__field { display: flex; flex-direction: column; }
.qc-apply__field--full { grid-column: 1 / -1; }
.qc-apply__field label { font-size: 12px; font-weight: 500; color: var(--color-text); margin-bottom: 4px; }
.qc-apply__field input, .qc-apply__field select, .qc-apply__field textarea { padding: 10px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-family: var(--font-body); color: var(--color-text); background: var(--color-white); }
.qc-apply__field input:focus, .qc-apply__field select:focus, .qc-apply__field textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 2px rgba(200,16,46,0.1); }
.qc-apply__field input.error, .qc-apply__field select.error { border-color: var(--color-error); }
.qc-apply__error { font-size: 11px; color: var(--color-error); margin-top: 2px; min-height: 14px; }
.qc-apply__checks { display: flex; flex-wrap: wrap; gap: 6px; }
.qc-apply__check { display: flex; align-items: center; gap: 5px; padding: 6px 10px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 12px; color: var(--color-text-secondary); cursor: pointer; transition: all var(--transition); }
.qc-apply__check:hover { border-color: var(--color-primary); }
.qc-apply__check--selected { border-color: var(--color-primary); background: rgba(200,16,46,0.04); color: var(--color-primary); }
.qc-apply__check input { accent-color: var(--color-primary); }
.qc-apply__nav { display: flex; justify-content: space-between; align-items: center; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--color-border); }

/* Upload */
.qc-apply__upload { margin-top: 8px; }
.qc-apply__upload-zone { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 32px; border: 2px dashed var(--color-border); border-radius: var(--radius-lg); cursor: pointer; transition: all var(--transition); text-align: center; }
.qc-apply__upload-zone:hover { border-color: var(--color-primary); background: rgba(200,16,46,0.02); }
.qc-apply__upload-zone svg { color: var(--color-metal); margin-bottom: 8px; }
.qc-apply__upload-zone p { font-size: 14px; font-weight: 500; color: var(--color-text); margin-bottom: 4px; }
.qc-apply__upload-zone span { font-size: 12px; color: var(--color-metal); }
.qc-apply__upload-list { display: flex; flex-direction: column; gap: 6px; margin-top: 10px; }
.qc-apply__upload-file { display: flex; align-items: center; gap: 10px; padding: 8px 12px; background: var(--color-light); border-radius: var(--radius); }
.qc-apply__upload-file span { font-size: 12px; color: var(--color-text); flex: 1; }
.qc-apply__upload-file small { font-size: 11px; color: var(--color-metal); }
.qc-apply__upload-file button { background: none; border: none; color: var(--color-metal); cursor: pointer; font-size: 16px; }
.qc-apply__upload-file button:hover { color: var(--color-primary); }

/* Consent */
.qc-apply__consent { margin: 20px 0; display: flex; flex-direction: column; gap: 10px; }
.qc-apply__checkbox { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; color: var(--color-text-secondary); cursor: pointer; }
.qc-apply__checkbox input { margin-top: 2px; accent-color: var(--color-primary); }

/* Success */
.qc-apply__success { text-align: center; padding: 32px; }
.qc-apply__success svg { color: var(--color-success, #2F7D4A); margin-bottom: 12px; }
.qc-apply__success h3 { font-family: var(--font-heading); font-size: 24px; font-weight: 700; color: var(--color-text); margin-bottom: 12px; }
.qc-apply__success p { font-size: 15px; color: var(--color-text-secondary); margin-bottom: 20px; max-width: 600px; margin-left: auto; margin-right: auto; }
.qc-apply__success-info { background: var(--color-light); padding: 16px; border-radius: var(--radius-lg); margin-bottom: 20px; text-align: left; max-width: 500px; margin-left: auto; margin-right: auto; }
.qc-apply__success-info .qc-apply__review-row { font-size: 12px; }
.qc-apply__success-links { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }

/* ============================
   QUALITY CONTROL RESPONSIVE
   ============================ */
@media (max-width: 1199px) {
  .qc-hero { height: 560px; }
  .qc-hero__title { font-size: 42px; }
  .qc-process__timeline { grid-template-columns: repeat(4, 1fr); }
  .qc-noncon__steps { grid-template-columns: repeat(3, 1fr); }
  .qc-video__steps { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 991px) {
  .qc-hero { height: 520px; }
  .qc-hero__title { font-size: 36px; }
  .qc-overview__inner { grid-template-columns: 1fr; }
  .qc-section__inner, .qc-section__inner--reverse { grid-template-columns: 1fr; }
  .qc-section__inner--reverse .qc-section__img { order: -1; }
  .qc-process__timeline { grid-template-columns: repeat(3, 1fr); }
  .qc-noncon__steps { grid-template-columns: repeat(3, 1fr); }
  .qc-video__steps { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 767px) {
  .qc-hero { height: 480px; }
  .qc-hero__title { font-size: 30px; }
  .qc-hero__desc { font-size: 15px; }
  .qc-hero__buttons { flex-direction: column; gap: 10px; }
  .qc-hero__buttons .btn { width: 100%; }
  .qc-overview__img-grid { grid-template-columns: 1fr 1fr; }
  .qc-process__timeline { grid-template-columns: 1fr; }
  .qc-section__grid { grid-template-columns: 1fr; }
  .qc-assembly__grid, .qc-fastener__grid, .qc-hoses__grid, .qc-pto__grid, .qc-linkage__grid, .qc-electrical__grid, .qc-brake__grid, .qc-running__grid, .qc-leakage__grid, .qc-tires__grid, .qc-oem__grid, .qc-pdi__grid, .qc-acc__grid, .qc-packing__grid, .qc-loading__grid, .qc-records__grid { grid-template-columns: 1fr; }
  .qc-noncon__steps { grid-template-columns: 1fr; }
  .qc-inspect__grid { grid-template-columns: 1fr; }
  .qc-thirdparty__list { grid-template-columns: 1fr; }
  .qc-video__grid { grid-template-columns: 1fr; }
  .qc-video__steps { grid-template-columns: 1fr; }
  .qc-docs__grid { grid-template-columns: 1fr; }
  .qc-apply__grid { grid-template-columns: 1fr; }
  .qc-apply__form { padding: 20px; }
  .qc-apply__steps { flex-direction: column; align-items: stretch; }
  .qc-apply__nav { flex-direction: column; gap: 10px; }
  .qc-apply__nav .btn { width: 100%; }
}

@media (max-width: 479px) {
  .qc-hero { height: 450px; }
  .qc-hero__title { font-size: 26px; }
  .qc-overview__img-grid { grid-template-columns: 1fr; }
}

/* ============================================
   OUR BRAND PAGE STYLES
   ============================================ */

.ob-hero { position: relative; height: 660px; overflow: hidden; display: flex; align-items: center; }
.ob-hero__bg { position: absolute; inset: 0; }
.ob-hero__bg-img { width: 100%; height: 100%; object-fit: cover; }
.ob-hero__overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(17,24,32,0.88) 0%, rgba(17,24,32,0.55) 60%, rgba(17,24,32,0.15) 100%); }
.ob-hero__content { position: relative; z-index: 2; max-width: 820px; }
.ob-hero__breadcrumb { display: flex; align-items: center; gap: 8px; font-size: 13px; color: rgba(255,255,255,0.6); margin-bottom: 14px; }
.ob-hero__breadcrumb a { color: rgba(255,255,255,0.6); }
.ob-hero__breadcrumb a:hover { color: var(--color-white); }
.ob-hero__breadcrumb span:last-child { color: var(--color-white); }
.ob-hero__eyebrow { display: block; font-size: 13px; font-weight: 600; letter-spacing: 2px; color: var(--color-primary-light, #e8455a); margin-bottom: 12px; }
.ob-hero__title { font-family: var(--font-heading); font-size: 48px; font-weight: 800; color: var(--color-white); line-height: 1.08; margin-bottom: 16px; }
.ob-hero__desc { font-size: 17px; color: rgba(255,255,255,0.8); line-height: 1.7; margin-bottom: 28px; }
.ob-hero__buttons { display: flex; gap: 12px; margin-bottom: 28px; flex-wrap: wrap; }
.ob-hero__tags { display: flex; gap: 12px; flex-wrap: wrap; }
.ob-hero__tag { padding: 6px 14px; background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.15); border-radius: var(--radius); font-size: 13px; font-weight: 500; color: rgba(255,255,255,0.8); }

/* Positioning */
.ob-positioning__inner { display: grid; grid-template-columns: 1.2fr 1fr; gap: 48px; align-items: center; }
.ob-positioning__inner > * { min-width: 0; }
.ob-positioning__content p { font-size: 16px; color: var(--color-text-secondary); line-height: 1.7; margin-bottom: 12px; }
.ob-positioning__quote { padding: 16px 20px; border-left: 4px solid var(--color-primary); background: var(--color-light); border-radius: 0 var(--radius) var(--radius) 0; font-size: 15px; font-weight: 500; color: var(--color-text); margin: 20px 0 24px; font-style: italic; }
.ob-positioning__img-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ob-positioning__img-grid img { width: 100%; border-radius: var(--radius); object-fit: cover; }

/* Foundation */
.ob-foundation__grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
.ob-foundation-card { padding: 24px 16px; background: var(--color-white); border: 2px solid transparent; border-radius: var(--radius-lg); text-align: center; transition: all var(--transition); }
.ob-foundation-card:hover { border-color: var(--color-primary); transform: translateY(-3px); }
.ob-foundation-card__num { display: block; font-family: var(--font-heading); font-size: 28px; font-weight: 800; color: var(--color-primary); margin-bottom: 8px; }
.ob-foundation-card__icon { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: var(--color-light); color: var(--color-primary); margin: 0 auto 10px; }
.ob-foundation-card h3 { font-size: 14px; font-weight: 600; color: var(--color-text); margin-bottom: 6px; }
.ob-foundation-card p { font-size: 12px; color: var(--color-text-secondary); line-height: 1.5; }
.ob-foundation-card .btn { font-size: 11px; padding: 5px 10px; margin-top: 8px; }

/* Factory */
.ob-factory { background: var(--color-dark); }
.ob-factory__inner { display: grid; grid-template-columns: 1.2fr 1fr; gap: 48px; align-items: center; }
.ob-factory__inner > * { min-width: 0; }
.ob-factory__content p { font-size: 15px; color: rgba(255,255,255,0.75); line-height: 1.7; margin-bottom: 12px; }
.ob-factory__steps { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin: 16px 0; }
.ob-factory-step { padding: 8px 12px; background: rgba(255,255,255,0.04); border-left: 3px solid var(--color-primary); font-size: 13px; color: rgba(255,255,255,0.8); }
.ob-factory__note { font-size: 13px; color: rgba(255,255,255,0.5); margin-bottom: 20px; }
.ob-factory__actions { display: flex; gap: 12px; }
.ob-factory__img img { width: 100%; border-radius: var(--radius-lg); }

/* Integrated */
.ob-integrated__compare { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-bottom: 16px; }
.ob-integrated__col { padding: 24px; border-radius: var(--radius-lg); }
.ob-integrated__col--left { background: var(--color-light); border: 1px solid var(--color-border); }
.ob-integrated__col--right { background: var(--color-primary); color: var(--color-white); }
.ob-integrated__col h3 { font-size: 16px; font-weight: 600; margin-bottom: 12px; }
.ob-integrated__col--right h3 { color: var(--color-white); }
.ob-integrated__col ul { list-style: none; padding: 0; }
.ob-integrated__col li { padding: 6px 0; font-size: 14px; color: var(--color-text-secondary); display: flex; align-items: center; gap: 8px; }
.ob-integrated__col--right li { color: rgba(255,255,255,0.85); }
.ob-integrated__col li::before { content: ''; width: 6px; height: 6px; background: var(--color-primary); border-radius: 50%; flex-shrink: 0; }
.ob-integrated__col--right li::before { background: var(--color-white); }
.ob-integrated__note { text-align: center; font-size: 14px; color: var(--color-text-secondary); font-style: italic; }

/* Why */
.ob-why__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 20px; }
.ob-why-card { padding: 24px 18px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.ob-why-card h3 { font-size: 15px; font-weight: 600; color: var(--color-text); margin-bottom: 8px; }
.ob-why-card p { font-size: 13px; color: var(--color-text-secondary); line-height: 1.5; }
.ob-why__quote { text-align: center; font-size: 15px; color: var(--color-text); font-style: italic; max-width: 700px; margin: 0 auto; padding: 16px 20px; border-left: 4px solid var(--color-primary); background: var(--color-white); border-radius: 0 var(--radius) var(--radius) 0; }

/* Commitment */
.ob-commitment { background: var(--color-dark); }
.ob-commitment__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 16px; }
.ob-commitment-card { padding: 24px 18px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius-lg); }
.ob-commitment-card__num { display: block; font-family: var(--font-heading); font-size: 24px; font-weight: 700; color: var(--color-primary); margin-bottom: 8px; }
.ob-commitment-card h3 { font-size: 15px; font-weight: 600; color: var(--color-white); margin-bottom: 6px; }
.ob-commitment-card p { font-size: 13px; color: rgba(255,255,255,0.65); line-height: 1.5; }
.ob-commitment__disclaimer { text-align: center; font-size: 12px; color: rgba(255,255,255,0.4); }

/* Products */
.ob-products__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 24px; }
.ob-product-card { background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden; transition: all var(--transition); }
.ob-product-card:hover { transform: translateY(-3px); box-shadow: 0 6px 20px rgba(0,0,0,0.06); }
.ob-product-card__img { aspect-ratio: 3 / 2; background: var(--color-light); overflow: hidden; }
.ob-product-card__img img { width: 100%; height: 100%; object-fit: cover; }
.ob-product-card__body { padding: 14px; }
.ob-product-card__body h3 { font-size: 14px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.ob-product-card__body p { font-size: 12px; color: var(--color-text-secondary); }
.ob-products__actions { display: flex; gap: 12px; justify-content: center; }

/* Capability */
.ob-capability__grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-bottom: 16px; }
.ob-capability-item { padding: 14px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; color: var(--color-text); text-align: center; }
.ob-capability__note { text-align: center; font-size: 13px; color: var(--color-metal); }

/* Quality */
.ob-quality__inner { display: grid; grid-template-columns: 1.2fr 1fr; gap: 48px; align-items: center; }
.ob-quality__inner > * { min-width: 0; }
.ob-quality__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 16px 0; }
.ob-quality-item { padding: 8px 12px; background: var(--color-light); border-radius: var(--radius); font-size: 13px; color: var(--color-text); display: flex; align-items: center; gap: 8px; }
.ob-quality-item::before { content: ''; width: 6px; height: 6px; background: var(--color-primary); border-radius: 50%; flex-shrink: 0; }
.ob-quality__note { font-size: 13px; color: var(--color-metal); margin-bottom: 16px; }
.ob-quality__img img { width: 100%; border-radius: var(--radius-lg); }

/* Identity */
.ob-identity { background: var(--color-dark); }
.ob-identity__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 16px; }
.ob-identity-item { padding: 16px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius); text-align: center; font-size: 13px; color: rgba(255,255,255,0.8); }
.ob-identity__note { text-align: center; font-size: 13px; color: rgba(255,255,255,0.5); }

/* OEM */
.ob-oem__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 24px; }
.ob-oem-card { padding: 24px 18px; background: var(--color-light); border: 2px solid transparent; border-radius: var(--radius-lg); transition: all var(--transition); }
.ob-oem-card:hover { border-color: var(--color-primary); }
.ob-oem-card h3 { font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 8px; }
.ob-oem-card p { font-size: 13px; color: var(--color-text-secondary); line-height: 1.5; }
.ob-oem__actions { display: flex; gap: 12px; justify-content: center; }

/* Parts */
.ob-parts__inner { display: grid; grid-template-columns: 1.2fr 1fr; gap: 48px; align-items: center; }
.ob-parts__inner > * { min-width: 0; }
.ob-parts__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 16px 0; }
.ob-parts-item { padding: 8px 12px; background: var(--color-light); border-radius: var(--radius); font-size: 13px; color: var(--color-text); display: flex; align-items: center; gap: 8px; }
.ob-parts-item::before { content: ''; width: 6px; height: 6px; background: var(--color-primary); border-radius: 50%; flex-shrink: 0; }
.ob-parts__note { font-size: 13px; color: var(--color-metal); margin-bottom: 16px; }
.ob-parts__actions { display: flex; gap: 12px; }
.ob-parts__img img { width: 100%; border-radius: var(--radius-lg); }

/* Partnership */
.ob-partnership__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; margin-bottom: 16px; }
.ob-partnership__col h3 { font-size: 16px; font-weight: 600; color: var(--color-text); margin-bottom: 12px; }
.ob-partnership-item { padding: 8px 12px; background: var(--color-light); border-radius: var(--radius); font-size: 13px; color: var(--color-text); margin-bottom: 6px; display: flex; align-items: center; gap: 8px; }
.ob-partnership-item::before { content: ''; width: 6px; height: 6px; background: var(--color-primary); border-radius: 50%; flex-shrink: 0; }
.ob-partnership__note { text-align: center; font-size: 13px; color: var(--color-metal); margin-bottom: 20px; }
.ob-partnership__actions { display: flex; gap: 12px; justify-content: center; }

/* Market */
.ob-market__regions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-bottom: 16px; }
.ob-market-region { padding: 10px 20px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 14px; font-weight: 500; color: var(--color-text); }
.ob-market__disclaimer { text-align: center; font-size: 12px; color: var(--color-metal); margin-bottom: 24px; font-style: italic; }
.ob-market__factors { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.ob-market-factor { padding: 12px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 12px; color: var(--color-text-secondary); text-align: center; }

/* Communication */
.ob-communication__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 16px; }
.ob-communication-item { padding: 14px; background: var(--color-light); border-radius: var(--radius); font-size: 13px; color: var(--color-text); text-align: center; }
.ob-communication__note { text-align: center; font-size: 13px; color: var(--color-metal); margin-bottom: 20px; }
.ob-communication__actions { display: flex; gap: 12px; justify-content: center; }

/* Roadmap */
.ob-roadmap { background: var(--color-dark); }
.ob-roadmap__timeline { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-bottom: 16px; }
.ob-roadmap-stage { padding: 24px 16px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius-lg); text-align: center; }
.ob-roadmap-stage__num { display: block; font-family: var(--font-heading); font-size: 28px; font-weight: 800; color: var(--color-primary); margin-bottom: 8px; }
.ob-roadmap-stage h3 { font-size: 15px; font-weight: 600; color: var(--color-white); margin-bottom: 6px; }
.ob-roadmap-stage p { font-size: 12px; color: rgba(255,255,255,0.6); line-height: 1.4; }
.ob-roadmap__note { text-align: center; font-size: 13px; color: rgba(255,255,255,0.4); }

/* Resources */
.ob-resources__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.ob-resource-card { padding: 18px 14px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); transition: all var(--transition); cursor: pointer; }
.ob-resource-card:hover { border-color: var(--color-primary); transform: translateY(-2px); }
.ob-resource-card h4 { font-size: 13px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; }
.ob-resource-card p { font-size: 11px; color: var(--color-metal); margin-bottom: 8px; }
.ob-resource-card .btn { font-size: 11px; padding: 5px 10px; }

/* FAQ */
.ob-faq .faq__list { max-width: 800px; margin: 0 auto 24px; }

/* Form */
.ob-apply__steps { display: flex; justify-content: center; gap: 4px; margin-bottom: 28px; }
.ob-apply__step { display: flex; align-items: center; gap: 8px; padding: 10px 18px; background: var(--color-light); border: 2px solid transparent; border-radius: var(--radius); font-size: 13px; font-weight: 500; color: var(--color-text-secondary); cursor: pointer; transition: all var(--transition); }
.ob-apply__step--active { border-color: var(--color-primary); color: var(--color-primary); background: var(--color-white); }
.ob-apply__step--done { border-color: var(--color-success, #2F7D4A); color: var(--color-success, #2F7D4A); }
.ob-apply__step-num { display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; background: var(--color-border); font-size: 12px; font-weight: 600; }
.ob-apply__step--active .ob-apply__step-num { background: var(--color-primary); color: var(--color-white); }
.ob-apply__step--done .ob-apply__step-num { background: var(--color-success, #2F7D4A); color: var(--color-white); }
.ob-apply__form { background: var(--color-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 32px; }
.ob-apply__honeypot { position: absolute; left: -9999px; height: 0; opacity: 0; }
.ob-apply__panel h3 { font-family: var(--font-heading); font-size: 22px; font-weight: 700; color: var(--color-text); margin-bottom: 20px; }
.ob-apply__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 16px; }
.ob-apply__field { display: flex; flex-direction: column; }
.ob-apply__field--full { grid-column: 1 / -1; }
.ob-apply__field label { font-size: 12px; font-weight: 500; color: var(--color-text); margin-bottom: 4px; }
.ob-apply__field input, .ob-apply__field select, .ob-apply__field textarea { padding: 10px 12px; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 13px; font-family: var(--font-body); color: var(--color-text); background: var(--color-white); }
.ob-apply__field input:focus, .ob-apply__field select:focus, .ob-apply__field textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 2px rgba(200,16,46,0.1); }
.ob-apply__field input.error, .ob-apply__field select.error { border-color: var(--color-error); }
.ob-apply__error { font-size: 11px; color: var(--color-error); margin-top: 2px; min-height: 14px; }
.ob-apply__nav { display: flex; justify-content: space-between; align-items: center; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--color-border); }

/* Upload */
.ob-apply__upload { margin-top: 8px; }
.ob-apply__upload-zone { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 28px; border: 2px dashed var(--color-border); border-radius: var(--radius-lg); cursor: pointer; transition: all var(--transition); text-align: center; }
.ob-apply__upload-zone:hover { border-color: var(--color-primary); }
.ob-apply__upload-zone svg { color: var(--color-metal); margin-bottom: 6px; }
.ob-apply__upload-zone p { font-size: 13px; font-weight: 500; color: var(--color-text); margin-bottom: 2px; }
.ob-apply__upload-zone span { font-size: 11px; color: var(--color-metal); }
.ob-apply__upload-list { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.ob-apply__upload-file { display: flex; align-items: center; gap: 10px; padding: 8px 12px; background: var(--color-light); border-radius: var(--radius); }
.ob-apply__upload-file span { font-size: 12px; color: var(--color-text); flex: 1; }
.ob-apply__upload-file small { font-size: 11px; color: var(--color-metal); }
.ob-apply__upload-file button { background: none; border: none; color: var(--color-metal); cursor: pointer; font-size: 16px; }

/* Consent */
.ob-apply__consent { margin: 20px 0; display: flex; flex-direction: column; gap: 10px; }
.ob-apply__checkbox { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; color: var(--color-text-secondary); cursor: pointer; }
.ob-apply__checkbox input { margin-top: 2px; accent-color: var(--color-primary); }

/* Success */
.ob-apply__success { text-align: center; padding: 32px; }
.ob-apply__success svg { color: var(--color-success, #2F7D4A); margin-bottom: 12px; }
.ob-apply__success h3 { font-family: var(--font-heading); font-size: 24px; font-weight: 700; color: var(--color-text); margin-bottom: 12px; }
.ob-apply__success p { font-size: 15px; color: var(--color-text-secondary); margin-bottom: 20px; max-width: 600px; margin-left: auto; margin-right: auto; }
.ob-apply__success-info { background: var(--color-light); padding: 16px; border-radius: var(--radius-lg); margin-bottom: 20px; text-align: left; max-width: 500px; margin-left: auto; margin-right: auto; }
.ob-apply__success-links { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }

/* ============================
   OUR BRAND RESPONSIVE
   ============================ */
@media (max-width: 1199px) {
  .ob-hero { height: 580px; }
  .ob-hero__title { font-size: 42px; }
  .ob-foundation__grid { grid-template-columns: repeat(3, 1fr); }
  .ob-commitment__grid { grid-template-columns: repeat(3, 1fr); }
  .ob-products__grid { grid-template-columns: repeat(3, 1fr); }
  .ob-roadmap__timeline { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 991px) {
  .ob-hero { height: 540px; }
  .ob-hero__title { font-size: 36px; }
  .ob-positioning__inner { grid-template-columns: 1fr; }
  .ob-factory__inner { grid-template-columns: 1fr; }
  .ob-quality__inner { grid-template-columns: 1fr; }
  .ob-parts__inner { grid-template-columns: 1fr; }
  .ob-partnership__grid { grid-template-columns: 1fr; }
  .ob-integrated__compare { grid-template-columns: 1fr; }
  .ob-roadmap__timeline { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 767px) {
  .ob-hero { height: 480px; }
  .ob-hero__title { font-size: 30px; }
  .ob-hero__desc { font-size: 15px; }
  .ob-hero__buttons { flex-direction: column; gap: 10px; }
  .ob-hero__buttons .btn { width: 100%; }
  .ob-foundation__grid { grid-template-columns: 1fr; }
  .ob-factory__steps { grid-template-columns: 1fr; }
  .ob-why__grid { grid-template-columns: 1fr; }
  .ob-commitment__grid { grid-template-columns: 1fr; }
  .ob-products__grid { grid-template-columns: 1fr; }
  .ob-capability__grid { grid-template-columns: 1fr; }
  .ob-quality__grid { grid-template-columns: 1fr; }
  .ob-identity__grid { grid-template-columns: 1fr; }
  .ob-oem__grid { grid-template-columns: 1fr; }
  .ob-parts__grid { grid-template-columns: 1fr; }
  .ob-communication__grid { grid-template-columns: 1fr; }
  .ob-roadmap__timeline { grid-template-columns: 1fr; }
  .ob-market__factors { grid-template-columns: 1fr; }
  .ob-resources__grid { grid-template-columns: 1fr; }
  .ob-apply__grid { grid-template-columns: 1fr; }
  .ob-apply__form { padding: 20px; }
  .ob-apply__steps { flex-direction: column; align-items: stretch; }
  .ob-apply__nav { flex-direction: column; gap: 10px; }
  .ob-apply__nav .btn { width: 100%; }
}

@media (max-width: 479px) {
  .ob-hero { height: 450px; }
  .ob-hero__title { font-size: 26px; }
}

/* ============================
   SHARED INNER PAGE HERO REFINEMENT
   ============================ */
.about-hero,
.tractors-hero,
.tp-hero,
.f-hero,
.oem-hero,
.news-hero,
.ct-hero,
.sv-hero,
.faq-hero,
.vid-hero,
.dp-hero,
.app-hero,
.qc-hero,
.ob-hero {
  height: auto;
  min-height: 620px;
  align-items: center;
}

.about-hero__content,
.tractors-hero__content,
.tp-hero__content,
.f-hero__content,
.oem-hero__content,
.news-hero__content,
.ct-hero__content,
.sv-hero__content,
.faq-hero__content,
.vid-hero__content,
.dp-hero__content,
.app-hero__content,
.qc-hero__content,
.ob-hero__content {
  width: 100%;
  max-width: var(--max-width);
  padding-top: 48px;
  padding-bottom: 48px;
}

.about-hero__title,
.tractors-hero__title,
.tp-hero__title,
.f-hero__title,
.oem-hero__title,
.news-hero__title,
.ct-hero__title,
.sv-hero__title,
.faq-hero__title,
.vid-hero__title,
.dp-hero__title,
.app-hero__title,
.qc-hero__title,
.ob-hero__title {
  max-width: 760px;
}

.about-hero__desc,
.tractors-hero__desc,
.tp-hero__desc,
.f-hero__desc,
.oem-hero__desc,
.news-hero__desc,
.ct-hero__desc,
.sv-hero__desc,
.faq-hero__desc,
.vid-hero__desc,
.dp-hero__desc,
.app-hero__desc,
.qc-hero__desc,
.ob-hero__desc {
  max-width: 720px;
}

.f-hero__buttons .btn--outline-dark,
.oem-hero__buttons .btn--outline-dark,
.news-hero__buttons .btn--outline-dark,
.ct-hero__buttons .btn--outline-dark,
.sv-hero__buttons .btn--outline-dark,
.vid-hero__buttons .btn--outline-dark,
.dp-hero__buttons .btn--outline-dark,
.app-hero__buttons .btn--outline-dark,
.qc-hero__buttons .btn--outline-dark,
.ob-hero__buttons .btn--outline-dark {
  color: var(--color-white);
  background: rgba(17, 24, 32, 0.1);
  border-color: rgba(255, 255, 255, 0.72);
}

.f-hero__buttons .btn--outline-dark:hover,
.oem-hero__buttons .btn--outline-dark:hover,
.news-hero__buttons .btn--outline-dark:hover,
.ct-hero__buttons .btn--outline-dark:hover,
.sv-hero__buttons .btn--outline-dark:hover,
.vid-hero__buttons .btn--outline-dark:hover,
.dp-hero__buttons .btn--outline-dark:hover,
.app-hero__buttons .btn--outline-dark:hover,
.qc-hero__buttons .btn--outline-dark:hover,
.ob-hero__buttons .btn--outline-dark:hover {
  color: var(--color-dark);
  background: var(--color-white);
  border-color: var(--color-white);
}

@media (max-width: 767px) {
  .about-hero,
  .tractors-hero,
  .tp-hero,
  .f-hero,
  .oem-hero,
  .news-hero,
  .ct-hero,
  .sv-hero,
  .faq-hero,
  .vid-hero,
  .dp-hero,
  .app-hero,
  .qc-hero,
  .ob-hero {
    min-height: 620px;
  }

  .about-hero__content,
  .tractors-hero__content,
  .tp-hero__content,
  .f-hero__content,
  .oem-hero__content,
  .news-hero__content,
  .ct-hero__content,
  .sv-hero__content,
  .faq-hero__content,
  .vid-hero__content,
  .dp-hero__content,
  .app-hero__content,
  .qc-hero__content,
  .ob-hero__content {
    padding-top: 32px;
    padding-bottom: 32px;
  }

  .btn {
    max-width: 100%;
    white-space: normal;
    text-align: center;
  }
}

/* --- Final responsive refinements --- */
.pd-actions {
  flex-wrap: wrap;
}

.pd-actions__main {
  min-width: 0;
}

.pd-anchor {
  max-width: 100vw;
  overflow: hidden;
}

.pd-anchor__inner,
.tp-finder__tabs {
  max-width: 100%;
  scrollbar-width: thin;
}

@media (max-width: 767px) {
  .pd-anchor__inner {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding-inline: 18px;
    scroll-padding-inline: 18px;
    overflow: visible;
  }

  .pd-anchor__link {
    padding: 12px 14px;
    font-size: 12px;
    min-width: 0;
    text-align: center;
    white-space: normal;
  }

  .tp-finder__tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-bottom: 0;
    gap: 8px;
    overflow: visible;
  }

  .tp-finder__tab {
    width: 100%;
    min-width: 0;
    margin-bottom: 0;
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    background: var(--color-white);
    white-space: normal;
  }

  .tp-finder__tab--active {
    border-color: var(--color-primary);
    background: rgba(200, 16, 46, 0.06);
  }

  .oem-builder__nav,
  .ob-hero__buttons,
  .ob-products__actions {
    align-items: stretch;
  }

  .oem-builder__nav {
    gap: 10px;
    flex-wrap: wrap;
  }

  .oem-builder__nav .btn,
  .ob-products__actions .btn,
  .ob-hero__buttons .btn {
    width: 100%;
    min-width: 0;
  }
}

@media (max-width: 479px) {
  .pd-anchor__inner {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding-inline: 14px;
  }

  .pd-anchor__link {
    padding-inline: 12px;
  }

  .pd-actions .btn {
    width: 100%;
  }
}

[class*="__honeypot"] {
  left: 0 !important;
  top: 0 !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
}

[class*="__honeypot"] input,
[class*="__honeypot"] textarea,
[class*="__honeypot"] select {
  width: 1px !important;
  min-width: 0 !important;
}

/* --- Final image fill refinements --- */
.app-overview__img-grid,
.app-overview__grid-img,
.qc-overview__img-grid,
.ob-positioning__img-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  align-items: stretch;
}

.app-overview__img-grid img,
.app-overview__grid-img img,
.qc-overview__img-grid img,
.ob-positioning__img-grid img {
  width: 100%;
  height: 100%;
  min-height: 0;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  display: block;
}

.app-products__img,
.dp-overview__images,
.qc-section__img,
.ob-factory__img,
.ob-quality__img,
.ob-parts__img {
  overflow: hidden;
  border-radius: var(--radius-lg);
}

.app-products__img img,
.dp-overview__images img,
.qc-section__img img,
.ob-factory__img img,
.ob-quality__img img,
.ob-parts__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: inherit;
}

.pd-overview__image img,
.pd-details__img img,
.pd-engine__image img,
.pd-trans__image img,
.pd-hydraulics__image img,
.pd-quality__image img,
.pd-system__image img,
.pd-pn__image img,
.pd-photo__image img,
.tp-photo__image img,
.tp-quality__image img,
.tractor-parts-section__image img,
.tractor-quality__image img,
.tractor-oem__visual img,
.f-comp__image img,
.f-chassis__image img,
.f-engine__image img,
.oem-quality__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

@media (max-width: 479px) {
  .app-overview__img-grid,
  .app-overview__grid-img,
  .qc-overview__img-grid,
  .ob-positioning__img-grid {
    grid-template-columns: 1fr;
  }
}