/* =============================================================
   LayerQuestar — 2-Layer AB Blown Film Machine
   Stylesheet: page-2layer-ab.css
   
   Load order: after theme base styles (reset, typography, nav, footer)
   Google Fonts: DM Sans + DM Mono (loaded in theme header)
   
   Token reference → Chapter 20 LayerQuestar Design System
   ============================================================= */


/* ─────────────────────────────────────────────────────────────
   1. GLOBAL PAGE UTILITIES
   ───────────────────────────────────────────────────────────── */

.container {
  max-width: 1160px;
  margin: 0 auto;
  padding: 0 var(--sp-5);
}

.section-light {
  background: var(--gray-50);
}

.section-dark {
  position: relative;
}

.section-dark::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    repeating-linear-gradient(0deg,  transparent, transparent 59px, rgba(255,255,255,0.025) 59px, rgba(255,255,255,0.025) 60px),
    repeating-linear-gradient(90deg, transparent, transparent 59px, rgba(255,255,255,0.025) 59px, rgba(255,255,255,0.025) 60px);
  pointer-events: none;
  z-index: 0;
}

.section-dark > .container {
  position: relative;
  z-index: 1;
}

.section-header {
  text-align: center;
  margin-bottom: var(--sp-5);
}

.section-title {
  display: inline-block;
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--brand);
  margin-bottom: var(--sp-1);
}

.section-header h2 {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-3xl);
  font-weight: 800;
  color: var(--gray-800);
  line-height: 1.15;
  margin: var(--sp-1) 0 var(--sp-2);
  text-wrap: pretty;
}

.section-header h2 em {
  font-style: normal;
  color: var(--brand);
}

.section-sub {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-md);
  color: var(--gray-600);
  max-width: 580px;
  margin: 0 auto;
  line-height: 1.65;
  text-wrap: pretty;
}

.section-header--light .section-title {
  color: var(--brand-mid);
}

.section-header--light h2 {
  color: #FFFFFF;
}

.section-header--light h2 em {
  color: rgba(255,255,255,0.35);
  font-style: normal;
}

.section-header--light .section-sub {
  color: rgba(255,255,255,0.60);
}

.link-arrow {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--brand);
  text-decoration: none;
  transition: gap 0.2s ease, color 0.2s ease;
}

.link-arrow:hover {
  color: var(--brand-dark);
  gap: 8px;
}

.section-dark .link-arrow,
.ab-structure .link-arrow,
.ab-whyfor .link-arrow,
.ab-aftersales .link-arrow,
.ab-faq .link-arrow,
.ab-finalcta .link-arrow {
  color: var(--brand-mid);
}

.section-dark .link-arrow:hover {
  color: #FF6B70;
}

:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 3px;
}


/* ─────────────────────────────────────────────────────────────
   2. BUTTONS
   ───────────────────────────────────────────────────────────── */

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-1);
  font-family: 'DM Sans', system-ui, sans-serif;
  font-weight: 700;
  font-size: var(--text-base);
  line-height: 1;
  padding: 13px var(--sp-3);
  border-radius: var(--r-lg);
  border: 1.5px solid transparent;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease,
              transform 0.2s ease, box-shadow 0.2s ease;
  white-space: nowrap;
}

.btn-lg {
  font-size: var(--text-md);
  padding: 15px var(--sp-4);
}

.btn-sm {
  font-size: var(--text-sm);
  padding: 9px var(--sp-2);
}

.btn-primary {
  background: var(--brand);
  color: #FFFFFF;
  border-color: var(--brand);
}

.btn-primary:hover {
  background: var(--brand-dark);
  border-color: var(--brand-dark);
  transform: translateY(-1px);
  box-shadow: 0 4px 20px rgba(215,25,32,0.40);
}

.btn-primary:active {
  transform: scale(0.98);
  box-shadow: none;
}

.btn-ghost {
  background: transparent;
  color: rgba(255,255,255,0.85);
  border-color: rgba(255,255,255,0.25);
}

.btn-ghost:hover {
  background: rgba(255,255,255,0.07);
  color: #FFFFFF;
  border-color: rgba(255,255,255,0.50);
  transform: translateY(-1px);
}

.btn-ghost:active {
  transform: scale(0.98);
}

.btn-white {
  background: #FFFFFF;
  color: var(--gray-800);
  border-color: #FFFFFF;
}

.btn-white:hover {
  background: var(--gray-50);
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(0,0,0,0.15);
}

.btn-white:active {
  transform: scale(0.98);
}


/* ─────────────────────────────────────────────────────────────
   3. S1 — HERO
   ───────────────────────────────────────────────────────────── */

@keyframes ab-hero-breath {
  0%   { transform: scale(1.00); }
  50%  { transform: scale(1.06); }
  100% { transform: scale(1.00); }
}

.ab-hero {
  position: relative;
  min-height: 620px;
  display: flex;
  align-items: center;
  overflow: hidden;
  background: #fff;
  padding: var(--sp-8) var(--sp-5);
}

.ab-hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.ab-hero__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 30%;
  position: absolute;
  inset: 0;
  display: block;
  animation: ab-hero-breath 12s ease-in-out infinite;
  will-change: transform;
}

/* ★ overlay 减淡：左侧文字区保留遮罩，右侧机器透出来 */
.ab-hero__overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    105deg,
    rgba(11,13,16,0.88) 0%,
    rgba(11,13,16,0.62) 55%,
    rgba(11,13,16,0.28) 100%
  );
}

/* Tech grid — 叠在 overlay 上 */
.ab-hero__overlay::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    repeating-linear-gradient(0deg,  transparent, transparent 59px, rgba(255,255,255,0.025) 59px, rgba(255,255,255,0.025) 60px),
    repeating-linear-gradient(90deg, transparent, transparent 59px, rgba(255,255,255,0.025) 59px, rgba(255,255,255,0.025) 60px);
  pointer-events: none;
}

/* 删掉原来的 .ab-hero::before tech grid，现在由 overlay::after 承担 */

.ab-hero__inner {
  position: relative;
  z-index: 2;
  max-width: 720px;
}

.ab-hero__badge {
  display: inline-block;
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.75);
  background: rgba(215,25,32,0.08);
  border: 1px solid rgba(215,25,32,0.35);
  border-radius: 100px;
  padding: 5px 14px;
  margin-bottom: var(--sp-2);
}

.ab-hero__h1 {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-4xl);
  font-weight: 800;
  color: #FFFFFF;
  line-height: 1.1;
  margin: 0 0 var(--sp-2);
  text-wrap: pretty;
}

.ab-hero__subtitle {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-md);
  color: rgba(255,255,255,0.70);
  line-height: 1.65;
  max-width: 560px;
  margin: 0 0 var(--sp-4);
  text-wrap: pretty;
}

/* ★ trust bar 改为半透明毛玻璃，不再是纯黑矩形 */
.ab-hero__trust {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-3);
  margin-bottom: var(--sp-4);
  padding: var(--sp-3) var(--sp-3);
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: var(--r-md);
  width: fit-content;
  max-width: 100%;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.trust-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 120px;
}

.trust-num {
  font-family: 'DM Mono', monospace;
  font-size: var(--text-xl);
  font-weight: 500;
  color: #FFFFFF;
  line-height: 1;
}

.trust-label {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--gray-400);
}

.ab-hero__ctas {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-2);
}


/* ─────────────────────────────────────────────────────────────
   4. S2 — WHAT THIS MACHINE PRODUCES
   ───────────────────────────────────────────────────────────── */

.ab-products {
  padding: var(--sp-7) var(--sp-5);
  background: var(--gray-50);  /* ← 修复：补充 light bg */
}

.ab-products__primary {
  display: flex;
  flex-direction: column;
  gap: var(--sp-6);
  margin-bottom: var(--sp-6);
}

.ab-products__primary-item {
  display: grid;
  grid-template-columns: 420px 1fr;
  gap: var(--sp-6);
  align-items: center;
}

.ab-products__primary-item:nth-child(even) {
  direction: rtl;
}

.ab-products__primary-item:nth-child(even) > * {
  direction: ltr;
}

.ab-products__primary-img {
  border-radius: var(--r-lg);
  overflow: hidden;
  background: var(--gray-100);
  aspect-ratio: 4 / 3;
}

.ab-products__primary-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}

.ab-products__primary-item:hover .ab-products__primary-img img {
  transform: scale(1.03);
}

.ab-products__primary-body h3 {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-xl);
  font-weight: 800;
  color: var(--gray-800);
  margin: 0 0 var(--sp-2);
}

.ab-products__primary-body p {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-base);
  color: var(--gray-600);
  line-height: 1.7;
  margin: 0 0 var(--sp-2);
  text-wrap: pretty;
}

.ab-products__primary-body p:last-child {
  margin-bottom: 0;
}

.ab-products__secondary {
  background: #FFFFFF;
  border: 1px solid var(--gray-100);
  border-radius: var(--r-lg);
  padding: var(--sp-4);
  box-shadow: var(--shadow-card);
  margin-bottom: var(--sp-5);
}

.ab-products__secondary h3 {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-lg);
  font-weight: 800;
  color: var(--gray-800);
  margin: 0 0 var(--sp-2);
}

.ab-products__secondary-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: var(--sp-1) var(--sp-3);
}

.ab-products__secondary-list li {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-base);
  color: var(--gray-600);
  padding-left: 16px;
  position: relative;
  line-height: 1.6;
}

.ab-products__secondary-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 9px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--brand);
}

.ab-products__geo-para {
  border-top: 1px solid var(--gray-100);
  padding-top: var(--sp-4);
}

.ab-products__geo-para p {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-base);
  color: var(--gray-600);
  line-height: 1.75;
  max-width: 820px;
  text-wrap: pretty;
}


/* ─────────────────────────────────────────────────────────────
   5. S3 — LAYER STRUCTURE
   ───────────────────────────────────────────────────────────── */

.ab-structure {
  padding: var(--sp-7) var(--sp-5);
  position: relative;
}

.ab-structure::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    repeating-linear-gradient(0deg,  transparent, transparent 59px, rgba(255,255,255,0.025) 59px, rgba(255,255,255,0.025) 60px),
    repeating-linear-gradient(90deg, transparent, transparent 59px, rgba(255,255,255,0.025) 59px, rgba(255,255,255,0.025) 60px);
  pointer-events: none;
  z-index: 0;
}

.ab-structure > .container {
  position: relative;
  z-index: 1;
}

.ab-structure__diagram {
  text-align: center;
  margin-bottom: var(--sp-5);
}

.ab-structure__diagram img {
  max-width: 100%;
  height: auto;
  border-radius: var(--r-lg);
  border: 1px solid rgba(255,255,255,0.08);
}

.ab-structure__diagram-caption {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-sm);
  color: rgba(255,255,255,0.45);
  margin-top: var(--sp-2);
  line-height: 1.6;
}

.ab-structure__explainer {
  max-width: 780px;
  margin: 0 auto var(--sp-5);
}

.ab-structure__explainer p {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-base);
  color: rgba(255,255,255,0.70);
  line-height: 1.75;
  margin: 0 0 var(--sp-2);
  text-wrap: pretty;
}

.ab-structure__explainer p:last-child {
  margin-bottom: 0;
}

.ab-structure__table-wrap {
  overflow-x: auto;
  margin-bottom: var(--sp-5);
  border-radius: var(--r-lg);
}

.layer-table {
  width: 100%;
  border-collapse: collapse;
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-sm);
  background: rgba(255,255,255,0.04);
  border-radius: var(--r-lg);
  overflow: hidden;
}

.ab-whyfor__decision-table-wrap .layer-table {
  background: #FFFFFF;
  box-shadow: var(--shadow-card);
}

.layer-table thead {
  background: var(--charcoal);
}

.ab-whyfor__decision-table-wrap .layer-table thead {
  background: var(--graphite);
}

.layer-table th {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--gray-400);
  padding: 12px var(--sp-2);
  text-align: left;
  white-space: nowrap;
}

.layer-table td {
  padding: 14px var(--sp-2);
  color: rgba(255,255,255,0.75);
  border-bottom: 1px solid rgba(255,255,255,0.06);
  vertical-align: top;
  line-height: 1.6;
}

.ab-whyfor__decision-table-wrap .layer-table td {
  color: var(--gray-600);
  border-bottom: 1px solid var(--gray-100);
}

.ab-whyfor__decision-table-wrap .layer-table th {
  color: var(--gray-400);
}

.layer-table tbody tr:last-child td {
  border-bottom: none;
}

.layer-table tbody tr:hover td {
  background: rgba(255,255,255,0.03);
}

.ab-whyfor__decision-table-wrap .layer-table tbody tr:hover td {
  background: var(--brand-subtle);
}

.layer-table__layer-badge {
  font-family: 'DM Mono', monospace;
  font-size: var(--text-base);
  font-weight: 500;
  color: var(--brand-mid) !important;
  text-align: center;
  width: 40px;
}

.layer-table__highlight {
  background: rgba(215,25,32,0.08);
  color: rgba(255,255,255,0.90) !important;
  font-weight: 600;
}

.ab-whyfor__decision-table-wrap .layer-table__highlight {
  background: var(--brand-tint);
  color: var(--brand-dark) !important;
}

.ab-structure__geo-para {
  border-top: 1px solid rgba(255,255,255,0.08);
  padding-top: var(--sp-4);
  margin-bottom: var(--sp-5);
}

.ab-structure__geo-para p {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-base);
  color: rgba(255,255,255,0.55);
  line-height: 1.75;
  max-width: 820px;
  text-wrap: pretty;
}

.ab-structure__aba-bridge {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: var(--r-lg);
  padding: var(--sp-4);
}

.ab-structure__aba-bridge h3 {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-lg);
  font-weight: 800;
  color: #FFFFFF;
  margin: 0 0 var(--sp-2);
}

.ab-structure__aba-bridge p {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-base);
  color: rgba(255,255,255,0.65);
  line-height: 1.7;
  margin: 0 0 var(--sp-2);
  text-wrap: pretty;
}

.ab-structure__aba-bridge p:last-of-type {
  margin-bottom: var(--sp-3);
}


/* ─────────────────────────────────────────────────────────────
   6. S4 — TECHNICAL SPECIFICATIONS
   ───────────────────────────────────────────────────────────── */

.ab-specs {
  padding: var(--sp-7) var(--sp-5);
  background: #FFFFFF;
}

.ab-specs__tabs {
  display: flex;
  gap: 4px;
  border-bottom: 2px solid var(--gray-100);
  margin-bottom: var(--sp-4);
  overflow-x: auto;
  scrollbar-width: none;
}

.ab-specs__tabs::-webkit-scrollbar {
  display: none;
}

.ab-specs__tab {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--gray-600);
  background: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  padding: 10px var(--sp-3);
  cursor: pointer;
  white-space: nowrap;
  border-radius: var(--r-md) var(--r-md) 0 0;
  transition: color 0.2s ease, background 0.2s ease, border-color 0.2s ease;
}

.ab-specs__tab:hover {
  color: var(--gray-800);
  background: var(--gray-50);
}

.ab-specs__tab--active {
  color: var(--brand);
  border-bottom-color: var(--brand);
  background: #FFFFFF;
}

.ab-specs__tab--active:hover {
  background: #FFFFFF;
}

.ab-specs__panel {
  margin-bottom: var(--sp-5);
}

.ab-specs__series-note {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-base);
  color: var(--gray-800);
  font-weight: 600;
  margin-bottom: var(--sp-3);
  line-height: 1.6;
}

.ab-specs__series-note span {
  font-weight: 400;
  color: var(--gray-600);
}

.ab-specs__bio-note {
  display: block;
  margin-top: var(--sp-1);
  font-size: var(--text-sm);
  font-weight: 400;
  color: var(--amber-fg);
  background: var(--amber-bg);
  border-radius: var(--r-md);
  padding: 10px var(--sp-2);
  line-height: 1.6;
}

.ab-specs__bio-note a {
  color: var(--amber-fg);
  font-weight: 600;
}

.ab-specs__table-wrap {
  overflow-x: auto;
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-card);
  border: 1px solid var(--gray-100);
}

.perf-table {
  width: 100%;
  border-collapse: collapse;
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-sm);
  background: #FFFFFF;
  min-width: 760px;
}

.perf-table thead {
  background: var(--charcoal);
}

.perf-table th {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--gray-400);
  padding: 12px var(--sp-2);
  text-align: left;
  white-space: nowrap;
}

.perf-table td {
  padding: 13px var(--sp-2);
  color: var(--gray-600);
  border-bottom: 1px solid var(--gray-100);
  font-family: 'DM Mono', monospace;
  font-size: var(--text-sm);
  white-space: nowrap;
}

.perf-table tbody tr:last-child td {
  border-bottom: none;
}

.perf-table tbody tr:hover td {
  background: var(--brand-subtle);
}

.perf-table__model {
  font-family: 'DM Mono', monospace;
  font-weight: 500;
  color: var(--gray-800) !important;
}

.ab-specs__common {
  background: #FFFFFF;
  border: 1px solid var(--gray-100);
  border-radius: var(--r-lg);
  padding: var(--sp-4);
  box-shadow: var(--shadow-card);
  margin-bottom: var(--sp-4);
}

.ab-specs__common h3 {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-lg);
  font-weight: 800;
  color: var(--gray-800);
  margin: 0 0 var(--sp-3);
}

.ab-specs__common-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: var(--sp-2);
}

.ab-specs__common-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  background: var(--gray-50);
  border: 1px solid var(--gray-100);
  border-radius: var(--r-md);
  padding: 10px 12px;
}

.ab-specs__common-label {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--gray-400);
}

.ab-specs__common-value {
  font-family: 'DM Mono', monospace;
  font-size: var(--text-md);
  font-weight: 500;
  color: var(--brand);
}

.ab-specs__facility {
  background: #FFFFFF;
  border: 1px solid var(--gray-100);
  border-radius: var(--r-lg);
  padding: var(--sp-4);
  box-shadow: var(--shadow-card);
  margin-bottom: var(--sp-4);
}

.ab-specs__facility h3 {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-lg);
  font-weight: 800;
  color: var(--gray-800);
  margin: 0 0 var(--sp-3);
}

.ab-specs__facility-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: var(--sp-2);
}

.ab-specs__facility-item {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 12px var(--sp-2);
  border-bottom: 1px solid var(--gray-100);
}

.ab-specs__facility-item:last-child {
  border-bottom: none;
}

.ab-specs__facility-label {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--gray-400);
}

.ab-specs__facility-value {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-sm);
  color: var(--gray-600);
  line-height: 1.6;
}

.ab-specs__facility-value--pending {
  color: var(--gray-400);
  font-style: italic;
}

.ab-specs__investment {
  background: var(--brand-subtle);
  border: 1px solid rgba(215,25,32,0.12);
  border-radius: var(--r-lg);
  padding: var(--sp-4);
}

.ab-specs__investment h3 {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-lg);
  font-weight: 800;
  color: var(--gray-800);
  margin: 0 0 var(--sp-1);
}

.ab-specs__investment p {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-base);
  color: var(--gray-600);
  line-height: 1.65;
  margin: 0 0 var(--sp-3);
  text-wrap: pretty;
}


/* ─────────────────────────────────────────────────────────────
   7. S5 — WHO THIS IS RIGHT FOR
   ───────────────────────────────────────────────────────────── */

.ab-whyfor {
  padding: var(--sp-7) var(--sp-5);
  position: relative;
}

.ab-whyfor::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    repeating-linear-gradient(0deg,  transparent, transparent 59px, rgba(255,255,255,0.025) 59px, rgba(255,255,255,0.025) 60px),
    repeating-linear-gradient(90deg, transparent, transparent 59px, rgba(255,255,255,0.025) 59px, rgba(255,255,255,0.025) 60px);
  pointer-events: none;
  z-index: 0;
}

.ab-whyfor > .container {
  position: relative;
  z-index: 1;
}

.ab-whyfor__profile {
  margin-bottom: var(--sp-6);
}

.ab-whyfor__profile-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-3);
}

.why-card {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: var(--r-lg);
  padding: var(--sp-4);
  transition: background 0.25s ease, border-color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
}

.why-card:hover {
  background: rgba(255,255,255,0.08);
  border-color: rgba(215,25,32,0.35);
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.30);
}

.why-card h3 {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-lg);
  font-weight: 800;
  color: #FFFFFF;
  margin: 0 0 var(--sp-2);
}

.why-card p {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-base);
  color: rgba(255,255,255,0.60);
  line-height: 1.7;
  margin: 0;
  text-wrap: pretty;
}

.ab-whyfor__firsttime {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: var(--r-lg);
  padding: var(--sp-4);
  margin-bottom: var(--sp-6);
}

.ab-whyfor__firsttime h3 {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-lg);
  font-weight: 800;
  color: #FFFFFF;
  margin: 0 0 var(--sp-3);
}

.ab-whyfor__firsttime-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-3);
}

.ab-whyfor__firsttime-item {
  display: flex;
  gap: var(--sp-2);
  align-items: flex-start;
}

.ab-whyfor__firsttime-icon {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  background: rgba(215,25,32,0.15);
  border-radius: var(--r-md);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--brand-mid);
}

.ab-whyfor__firsttime-item strong {
  display: block;
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-base);
  font-weight: 700;
  color: #FFFFFF;
  margin-bottom: 4px;
}

.ab-whyfor__firsttime-item p {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-sm);
  color: rgba(255,255,255,0.55);
  line-height: 1.65;
  margin: 0;
}

.ab-whyfor__decision {
  margin-bottom: var(--sp-6);
}

.ab-whyfor__decision h3 {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-xl);
  font-weight: 800;
  color: #FFFFFF;
  margin: 0 0 var(--sp-1);
}

.ab-whyfor__decision-intro {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-base);
  color: rgba(255,255,255,0.55);
  margin: 0 0 var(--sp-3);
}

.ab-whyfor__decision-table-wrap {
  overflow-x: auto;
  border-radius: var(--r-lg);
  margin-bottom: var(--sp-3);
}

.ab-whyfor__decision-note {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-sm);
  color: rgba(255,255,255,0.50);
  line-height: 1.65;
  padding: var(--sp-2) var(--sp-3);
  background: rgba(255,255,255,0.04);
  border-radius: var(--r-md);
  text-wrap: pretty;
}

.ab-whyfor__decision-note strong {
  color: rgba(255,255,255,0.75);
}

.ab-whyfor__solutions h3 {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-lg);
  font-weight: 800;
  color: #FFFFFF;
  margin: 0 0 var(--sp-3);
}

.ab-whyfor__solution-cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-3);
}

.solution-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--sp-2);
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: var(--r-lg);
  padding: var(--sp-3);
  text-decoration: none;
  transition: background 0.25s ease, border-color 0.25s ease, transform 0.25s ease;
}

.solution-card:hover {
  background: rgba(255,255,255,0.09);
  border-color: rgba(215,25,32,0.35);
  transform: translateY(-2px);
}

.solution-card h4 {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-base);
  font-weight: 700;
  color: #FFFFFF;
  margin: 0 0 6px;
}

.solution-card p {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-sm);
  color: rgba(255,255,255,0.55);
  line-height: 1.6;
  margin: 0;
}


/* ─────────────────────────────────────────────────────────────
   8. S6 — RUNNING THIS LINE
   ───────────────────────────────────────────────────────────── */

.ab-running {
  padding: var(--sp-7) var(--sp-5);
  background: var(--gray-50);  /* ← 修复：补充 light bg */
}

.ab-running__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-4);
}

.ab-running__block {
  background: #FFFFFF;
  border: 1px solid var(--gray-100);
  border-radius: var(--r-lg);
  padding: var(--sp-4);
  box-shadow: var(--shadow-card);
  transition: box-shadow 0.25s ease, transform 0.25s ease, border-color 0.25s ease;
}

.ab-running__block:hover {
  box-shadow: var(--shadow-lift);
  transform: translateY(-2px);
  border-color: rgba(215,25,32,0.20);
}

.ab-running__block h3 {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-lg);
  font-weight: 800;
  color: var(--gray-800);
  margin: 0 0 var(--sp-2);
}

.ab-running__block p {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-base);
  color: var(--gray-600);
  line-height: 1.7;
  margin: 0 0 var(--sp-2);
  text-wrap: pretty;
}

.ab-running__block p:last-of-type {
  margin-bottom: 0;
}

.ab-running__compat-list,
.ab-running__cost-list {
  margin: var(--sp-2) 0 var(--sp-2) var(--sp-2);
  padding: 0;
  list-style: none;
}

.ab-running__compat-list li,
.ab-running__cost-list li {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-sm);
  color: var(--gray-600);
  line-height: 1.65;
  padding-left: 14px;
  position: relative;
  margin-bottom: 6px;
}

.ab-running__compat-list li::before,
.ab-running__cost-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 8px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--brand);
}


/* ─────────────────────────────────────────────────────────────
   9. S7 — BUILD STANDARD
   ───────────────────────────────────────────────────────────── */

.ab-build {
  padding: var(--sp-7) var(--sp-5);
  background: #FFFFFF;
}

.ab-build__specs {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: var(--sp-3);
  margin-bottom: var(--sp-4);
}

.ab-build__spec-card {
  background: var(--gray-50);
  border: 1px solid var(--gray-100);
  border-radius: var(--r-lg);
  padding: var(--sp-3);
  transition: box-shadow 0.25s ease, transform 0.25s ease, border-color 0.25s ease;
}

.ab-build__spec-card:hover {
  box-shadow: var(--shadow-lift);
  transform: translateY(-3px);
  border-color: rgba(215,25,32,0.20);
}

.ab-build__spec-img {
  border-radius: var(--r-md);
  overflow: hidden;
  background: var(--gray-200);
  aspect-ratio: 4 / 3;
  margin-bottom: var(--sp-2);
}

.ab-build__spec-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.ab-build__spec-label {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--gray-400);
  margin-bottom: 4px;
}

.ab-build__spec-value {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-base);
  font-weight: 800;
  color: var(--gray-800);
  margin-bottom: var(--sp-1);
}

.ab-build__spec-detail {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-sm);
  color: var(--gray-600);
  line-height: 1.65;
  text-wrap: pretty;
}

.ab-build__gearbox-note {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-sm);
  color: var(--gray-600);
  line-height: 1.65;
  background: var(--gray-50);
  border: 1px solid var(--gray-100);
  border-radius: var(--r-md);
  padding: var(--sp-2) var(--sp-3);
  margin-bottom: var(--sp-5);
}

.ab-build__gearbox-note strong {
  color: var(--gray-800);
}

.ab-build__fat {
  display: flex;
  gap: var(--sp-3);
  align-items: flex-start;
  background: var(--gray-50);
  border: 1px solid var(--gray-100);
  border-radius: var(--r-lg);
  padding: var(--sp-4);
  margin-bottom: var(--sp-5);
}

.ab-build__fat-icon {
  flex-shrink: 0;
  width: 56px;
  height: 56px;
  background: var(--brand-tint);
  border-radius: var(--r-md);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--brand);
}

.ab-build__fat-body h3 {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-lg);
  font-weight: 800;
  color: var(--gray-800);
  margin: 0 0 var(--sp-1);
}

.ab-build__fat-body p {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-base);
  color: var(--gray-600);
  line-height: 1.7;
  margin: 0 0 var(--sp-2);
  text-wrap: pretty;
}

.ab-build__cert h3 {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-lg);
  font-weight: 800;
  color: var(--gray-800);
  margin: 0 0 var(--sp-3);
}

.ab-build__cert-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-3);
}

.ab-build__cert-item {
  display: flex;
  gap: var(--sp-2);
  align-items: flex-start;
  background: var(--gray-50);
  border: 1px solid var(--gray-100);
  border-radius: var(--r-lg);
  padding: var(--sp-3);
}

.ab-build__cert-badge {
  flex-shrink: 0;
  font-family: 'DM Mono', monospace;
  font-size: var(--text-xs);
  font-weight: 700;
  color: var(--brand);
  background: var(--brand-tint);
  border-radius: var(--r-sm);
  padding: 4px 8px;
  letter-spacing: 0.5px;
  white-space: nowrap;
}

.ab-build__cert-item strong {
  display: block;
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-base);
  font-weight: 700;
  color: var(--gray-800);
  margin-bottom: 4px;
}

.ab-build__cert-item p {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-sm);
  color: var(--gray-600);
  line-height: 1.6;
  margin: 0;
  text-wrap: pretty;
}


/* ─────────────────────────────────────────────────────────────
   10. S8 — AFTER-SALES & SPARE PARTS
   ───────────────────────────────────────────────────────────── */

.ab-aftersales {
  padding: var(--sp-7) var(--sp-5);
  position: relative;
}

.ab-aftersales::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    repeating-linear-gradient(0deg,  transparent, transparent 59px, rgba(255,255,255,0.025) 59px, rgba(255,255,255,0.025) 60px),
    repeating-linear-gradient(90deg, transparent, transparent 59px, rgba(255,255,255,0.025) 59px, rgba(255,255,255,0.025) 60px);
  pointer-events: none;
  z-index: 0;
}

.ab-aftersales > .container {
  position: relative;
  z-index: 1;
}

.ab-aftersales__warranty {
  margin-bottom: var(--sp-6);
}

.ab-aftersales__warranty h3 {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-xl);
  font-weight: 800;
  color: #FFFFFF;
  margin: 0 0 var(--sp-3);
}

.ab-aftersales__warranty-grid {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: var(--sp-3);
}

.ab-aftersales__warranty-card {
  border-radius: var(--r-lg);
  padding: var(--sp-4);
  border: 1px solid rgba(255,255,255,0.10);
}

.ab-aftersales__warranty-card--major {
  background: rgba(215,25,32,0.12);
  border-color: rgba(215,25,32,0.25);
  text-align: center;
}

.ab-aftersales__warranty-card--wear {
  background: rgba(255,255,255,0.05);
}

.ab-aftersales__warranty-period {
  font-family: 'DM Mono', monospace;
  font-size: var(--text-4xl);
  font-weight: 500;
  color: var(--brand-mid);
  line-height: 1;
  margin-bottom: 4px;
}

.ab-aftersales__warranty-unit {
  font-size: var(--text-lg);
  color: rgba(255,255,255,0.50);
}

.ab-aftersales__warranty-label {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-sm);
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.60);
  margin-bottom: var(--sp-2);
}

.ab-aftersales__warranty-card ul {
  list-style: none;
  padding: 0;
  margin: 0;
  text-align: left;
}

.ab-aftersales__warranty-card ul li {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-sm);
  color: rgba(255,255,255,0.70);
  padding: 5px 0 5px 16px;
  position: relative;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  line-height: 1.5;
}

.ab-aftersales__warranty-card ul li:last-child {
  border-bottom: none;
}

.ab-aftersales__warranty-card ul li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 11px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--brand-mid);
}

.ab-aftersales__warranty-card--wear p {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-base);
  color: rgba(255,255,255,0.60);
  line-height: 1.7;
  margin: 0;
  text-wrap: pretty;
}

.ab-aftersales__spares {
  margin-bottom: var(--sp-6);
}

.ab-aftersales__spares h3 {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-xl);
  font-weight: 800;
  color: #FFFFFF;
  margin: 0 0 var(--sp-1);
}

.ab-aftersales__spares-intro {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-base);
  color: rgba(255,255,255,0.55);
  line-height: 1.65;
  margin: 0 0 var(--sp-3);
  max-width: 680px;
  text-wrap: pretty;
}

.ab-aftersales__spares-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 2px;
  background: rgba(255,255,255,0.06);
  border-radius: var(--r-lg);
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.08);
}

.ab-aftersales__spare-item {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  background: rgba(255,255,255,0.03);
  padding: 14px var(--sp-3);
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-sm);
  color: rgba(255,255,255,0.70);
  line-height: 1.5;
  transition: background 0.2s ease;
}

.ab-aftersales__spare-item:hover {
  background: rgba(255,255,255,0.07);
}

.ab-aftersales__spare-icon {
  flex-shrink: 0;
  color: var(--brand-mid);
  opacity: 0.85;
}

.ab-aftersales__supply h3 {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-xl);
  font-weight: 800;
  color: #FFFFFF;
  margin: 0 0 var(--sp-3);
}

.ab-aftersales__supply-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-3);
  margin-bottom: var(--sp-5);
}

.ab-aftersales__supply-item {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: var(--r-lg);
  padding: var(--sp-3);
  transition: background 0.25s ease, border-color 0.25s ease;
}

.ab-aftersales__supply-item:hover {
  background: rgba(255,255,255,0.08);
  border-color: rgba(215,25,32,0.25);
}

.ab-aftersales__supply-img {
  border-radius: var(--r-md);
  overflow: hidden;
  background: rgba(255,255,255,0.08);
  aspect-ratio: 16 / 9;
  margin-bottom: var(--sp-2);
}

.ab-aftersales__supply-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.ab-aftersales__supply-item strong {
  display: block;
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-base);
  font-weight: 700;
  color: #FFFFFF;
  margin-bottom: var(--sp-1);
}

.ab-aftersales__supply-item p {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-sm);
  color: rgba(255,255,255,0.55);
  line-height: 1.65;
  margin: 0 0 var(--sp-1);
  text-wrap: pretty;
}

.ab-aftersales__kit-list {
  list-style: none;
  padding: 0;
  margin: var(--sp-1) 0 0;
}

.ab-aftersales__kit-list li {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-sm);
  color: rgba(255,255,255,0.55);
  padding: 4px 0 4px 14px;
  position: relative;
  border-bottom: 1px solid rgba(255,255,255,0.05);
  line-height: 1.5;
}

.ab-aftersales__kit-list li:last-child {
  border-bottom: none;
}

.ab-aftersales__kit-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 10px;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--brand-mid);
  opacity: 0.70;
}

.ab-aftersales__cta {
  text-align: center;
  padding-top: var(--sp-3);
  border-top: 1px solid rgba(255,255,255,0.08);
}


/* ─────────────────────────────────────────────────────────────
   11. S9 — RELATED CONFIGURATIONS
   ───────────────────────────────────────────────────────────── */

.ab-related {
  padding: var(--sp-7) var(--sp-5);
  background: var(--gray-50);
}

.ab-related__nav {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-4);
}

.ab-related__nav-card {
  background: #FFFFFF;
  border: 1px solid var(--gray-100);
  border-radius: var(--r-lg);
  padding: var(--sp-4);
  box-shadow: var(--shadow-card);
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
  transition: box-shadow 0.25s ease, transform 0.25s ease, border-color 0.25s ease;
}

.ab-related__nav-card:hover {
  box-shadow: var(--shadow-lift);
  transform: translateY(-3px);
  border-color: rgba(215,25,32,0.20);
}

.ab-related__nav-direction {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--gray-400);
}

.ab-related__nav-img {
  border-radius: var(--r-md);
  overflow: hidden;
  background: var(--gray-100);
  aspect-ratio: 16 / 9;
}

.ab-related__nav-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}

.ab-related__nav-card:hover .ab-related__nav-img img {
  transform: scale(1.04);
}

.ab-related__nav-badge {
  display: inline-block;
  font-family: 'DM Mono', monospace;
  font-size: var(--text-xs);
  font-weight: 700;
  color: var(--brand);
  background: var(--brand-tint);
  border-radius: var(--r-sm);
  padding: 3px 8px;
  letter-spacing: 0.5px;
  margin-bottom: 4px;
}

.ab-related__nav-body h3 {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-lg);
  font-weight: 800;
  color: var(--gray-800);
  margin: 0 0 var(--sp-1);
}

.ab-related__nav-body p {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-sm);
  color: var(--gray-600);
  line-height: 1.65;
  margin: 0;
  text-wrap: pretty;
}

.ab-related__nav-card .btn-ghost {
  background: transparent;
  color: var(--gray-800);
  border-color: var(--gray-200);
  align-self: flex-start;
  margin-top: auto;
}

.ab-related__nav-card .btn-ghost:hover {
  background: var(--gray-50);
  color: var(--brand);
  border-color: var(--brand);
}


/* ─────────────────────────────────────────────────────────────
   12. S10 — FAQ
   ───────────────────────────────────────────────────────────── */

.ab-faq {
  padding: var(--sp-7) var(--sp-5);
  position: relative;
}

.ab-faq::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    repeating-linear-gradient(0deg,  transparent, transparent 59px, rgba(255,255,255,0.025) 59px, rgba(255,255,255,0.025) 60px),
    repeating-linear-gradient(90deg, transparent, transparent 59px, rgba(255,255,255,0.025) 59px, rgba(255,255,255,0.025) 60px);
  pointer-events: none;
  z-index: 0;
}

.ab-faq > .container {
  position: relative;
  z-index: 1;
}

.ab-faq__list {
  max-width: 820px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.ab-faq__item {
  border-radius: var(--r-lg);
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.04);
  transition: border-color 0.2s ease;
}

.ab-faq__item:has(.ab-faq__q--open) {
  border-color: rgba(215,25,32,0.30);
  background: rgba(255,255,255,0.06);
}

.ab-faq__q {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-3);
  text-align: left;
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-base);
  font-weight: 600;
  color: rgba(255,255,255,0.85);
  background: transparent;
  border: none;
  padding: var(--sp-3) var(--sp-4);
  cursor: pointer;
  line-height: 1.5;
  transition: color 0.2s ease, background 0.2s ease;
  min-height: 44px;
}

.ab-faq__q:hover {
  color: #FFFFFF;
  background: rgba(255,255,255,0.04);
}

.ab-faq__q--open {
  color: #FFFFFF;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

.ab-faq__chevron {
  flex-shrink: 0;
  color: var(--gray-400);
  transition: transform 0.25s ease, color 0.2s ease;
}

.ab-faq__q--open .ab-faq__chevron {
  transform: rotate(180deg);
  color: var(--brand-mid);
}

.ab-faq__a {
  padding: var(--sp-3) var(--sp-4);
}

.ab-faq__a p {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-base);
  color: rgba(255,255,255,0.60);
  line-height: 1.75;
  margin: 0 0 var(--sp-2);
  text-wrap: pretty;
}

.ab-faq__a p:last-child {
  margin-bottom: 0;
}

.ab-faq__a em {
  font-style: italic;
  color: rgba(255,255,255,0.75);
}


/* ─────────────────────────────────────────────────────────────
   13. S11 — FINAL CTA
   ───────────────────────────────────────────────────────────── */

.ab-finalcta {
  padding: var(--sp-8) var(--sp-5);
  position: relative;
}

.ab-finalcta::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    repeating-linear-gradient(0deg,  transparent, transparent 59px, rgba(255,255,255,0.025) 59px, rgba(255,255,255,0.025) 60px),
    repeating-linear-gradient(90deg, transparent, transparent 59px, rgba(255,255,255,0.025) 59px, rgba(255,255,255,0.025) 60px);
  pointer-events: none;
  z-index: 0;
}

.ab-finalcta > .container {
  position: relative;
  z-index: 1;
}

.ab-finalcta__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-6);
  max-width: 960px;
  margin: 0 auto;
}

.ab-finalcta__body {
  flex: 1;
}

.ab-finalcta__body h2 {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-3xl);
  font-weight: 800;
  color: #FFFFFF;
  margin: 0 0 var(--sp-2);
  line-height: 1.15;
  text-wrap: pretty;
}

.ab-finalcta__body p {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: var(--text-md);
  color: rgba(255,255,255,0.60);
  line-height: 1.7;
  margin: 0 0 var(--sp-2);
  max-width: 560px;
  text-wrap: pretty;
}

.ab-finalcta__tagline {
  font-family: 'DM Mono', monospace;
  font-size: var(--text-sm) !important;
  color: rgba(255,255,255,0.35) !important;
  letter-spacing: 0.3px;
}

.ab-finalcta__ctas {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
  flex-shrink: 0;
}


/* ─────────────────────────────────────────────────────────────
   14. REDUCED MOTION
   ───────────────────────────────────────────────────────────── */

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}


/* ─────────────────────────────────────────────────────────────
   15. RESPONSIVE — 1100px
   ───────────────────────────────────────────────────────────── */

@media (max-width: 1100px) {
  .ab-build__specs {
    grid-template-columns: repeat(3, 1fr);
  }

  .ab-hero__h1 {
    font-size: var(--text-3xl);
  }

  .section-header h2 {
    font-size: var(--text-2xl);
  }

  .ab-finalcta__body h2 {
    font-size: var(--text-2xl);
  }
}


/* ─────────────────────────────────────────────────────────────
   16. RESPONSIVE — 960px
   ───────────────────────────────────────────────────────────── */

@media (max-width: 960px) {
  .container {
    padding: 0 var(--sp-3);
  }

  .ab-hero {
    padding: var(--sp-7) var(--sp-3);
    min-height: auto;
  }

  .ab-hero__h1 {
    font-size: var(--text-2xl);
  }

  .ab-hero__trust {
    gap: var(--sp-2);
  }

  .trust-num {
    font-size: var(--text-lg);
  }

  .ab-products {
    padding: var(--sp-6) var(--sp-3);
  }

  .ab-products__primary-item {
    grid-template-columns: 1fr;
  }

  .ab-products__primary-item:nth-child(even) {
    direction: ltr;
  }

  .ab-products__primary-img {
    aspect-ratio: 16 / 9;
  }

  .ab-structure {
    padding: var(--sp-6) var(--sp-3);
  }

  .ab-specs {
    padding: var(--sp-6) var(--sp-3);
  }

  .ab-whyfor {
    padding: var(--sp-6) var(--sp-3);
  }

  .ab-whyfor__profile-grid {
    grid-template-columns: 1fr;
  }

  .ab-whyfor__firsttime-grid {
    grid-template-columns: 1fr;
  }

  .ab-whyfor__solution-cards {
    grid-template-columns: 1fr;
  }

  .ab-running {
    padding: var(--sp-6) var(--sp-3);
  }

  .ab-running__grid {
    grid-template-columns: 1fr;
  }

  .ab-build {
    padding: var(--sp-6) var(--sp-3);
  }

  .ab-build__specs {
    grid-template-columns: repeat(2, 1fr);
  }

  .ab-build__cert-grid {
    grid-template-columns: 1fr;
  }

  .ab-build__fat {
    flex-direction: column;
  }

  .ab-aftersales {
    padding: var(--sp-6) var(--sp-3);
  }

  .ab-aftersales__warranty-grid {
    grid-template-columns: 1fr;
  }

  .ab-aftersales__supply-grid {
    grid-template-columns: 1fr;
  }

  .ab-related {
    padding: var(--sp-6) var(--sp-3);
  }

  .ab-related__nav {
    grid-template-columns: 1fr;
  }

  .ab-faq {
    padding: var(--sp-6) var(--sp-3);
  }

  .ab-finalcta {
    padding: var(--sp-7) var(--sp-3);
  }

  .ab-finalcta__inner {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--sp-4);
  }

  .ab-finalcta__ctas {
    flex-direction: row;
    flex-wrap: wrap;
  }

  .section-header h2 {
    font-size: var(--text-2xl);
  }

  .section-header {
    text-align: left;
  }

  .section-sub {
    margin: 0;
  }
}


/* ─────────────────────────────────────────────────────────────
   17. RESPONSIVE — 600px
   ───────────────────────────────────────────────────────────── */

@media (max-width: 600px) {
  .ab-hero__h1 {
    font-size: var(--text-xl);
  }

  .ab-hero__subtitle {
    font-size: var(--text-base);
  }

  .ab-hero__trust {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }

  .ab-hero__ctas {
    flex-direction: column;
  }

  .ab-hero__ctas .btn {
    width: 100%;
    justify-content: center;
  }

  .ab-specs__tabs {
    flex-direction: column;
    border-bottom: none;
    gap: 2px;
  }

  .ab-specs__tab {
    border-bottom: none;
    border-radius: var(--r-md);
    border: 1px solid var(--gray-100);
    background: #FFFFFF;
    margin-bottom: 0;
    text-align: left;
  }

  .ab-specs__tab--active {
    background: var(--brand-tint);
    color: var(--brand);
    border-color: rgba(215,25,32,0.25);
  }

  .ab-build__specs {
    grid-template-columns: 1fr;
  }

  .ab-specs__common-grid {
    grid-template-columns: 1fr;
  }

  .ab-specs__facility-grid {
    grid-template-columns: 1fr;
  }

  .ab-aftersales__spares-grid {
    grid-template-columns: 1fr;
  }

  .ab-finalcta__ctas {
    flex-direction: column;
    width: 100%;
  }

  .ab-finalcta__ctas .btn {
    width: 100%;
    justify-content: center;
  }

  .section-header h2 {
    font-size: var(--text-xl);
  }

  .ab-finalcta__body h2 {
    font-size: var(--text-xl);
  }
}
