/* ── About Hero ── */
    .ab-hero {
      position: relative;
      height: 480px;
      background-image: url(assets/hero/canvas/canvas-2.webp);
      background-size: cover;
      background-position: center;
      display: flex;
      align-items: center;
    }
    .ab-hero::after {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(105deg, rgba(0,0,0,0.72) 0%, rgba(0,0,0,0.3) 60%, rgba(0,0,0,0.05) 100%);
    }
    .ab-hero-content {
      position: relative;
      z-index: 1;
      max-width: 600px;
    }
    .ab-hero-eyebrow {
      display: inline-block;
      font-size: 0.72rem;
      font-weight: 700;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: #e8c870;
      margin-bottom: 16px;
    }
    .ab-hero-content h1 {
      font-family: 'Poppins', sans-serif;
      font-size: clamp(2rem, 5vw, 3.6rem);
      font-weight: 800;
      line-height: 1.1;
      color: #fff;
      margin-bottom: 18px;
    }
    .ab-hero-content h1 em {
      font-style: normal;
      background: var(--s-gradient);
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
    }
    .ab-hero-content p {
      font-size: 1.05rem;
      color: rgba(255,255,255,0.7);
      line-height: 1.7;
      max-width: 480px;
    }

    /* ── Story Section ── */
    .ab-story {
      padding: 88px 0;
    }
    .ab-story-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 64px;
      align-items: center;
    }
    .ab-story-text .ab-eyebrow {
      display: inline-block;
      font-size: 0.7rem;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--s-accent);
      margin-bottom: 14px;
    }
    .ab-story-text h2 {
      font-family: 'Poppins', sans-serif;
      font-size: clamp(1.6rem, 2.8vw, 2.4rem);
      font-weight: 800;
      line-height: 1.2;
      color: var(--s-text);
      margin-bottom: 20px;
    }
    .ab-story-text p {
      font-size: 0.96rem;
      color: var(--s-muted);
      line-height: 1.8;
      margin-bottom: 16px;
    }
    .ab-story-img {
      position: relative;
      border-radius: 20px;
      overflow: hidden;
      aspect-ratio: 4/3;
      box-shadow: var(--s-shadow-lg);
    }
    .ab-story-img img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }
    .ab-story-img::before {
      content: '';
      position: absolute;
      inset: -2px;
      background: var(--s-gradient);
      z-index: -1;
      border-radius: 22px;
    }

    /* ── Stats Bar ── */
    .ab-stats {
      background: linear-gradient(135deg, #0f0a1e 0%, #1a0a2e 50%, #0a1428 100%);
      padding: 60px 0;
      position: relative;
      overflow: hidden;
    }
    .ab-stats::before {
      content: '';
      position: absolute;
      top: -100px;
      right: 15%;
      width: 400px;
      height: 400px;
      background: radial-gradient(circle, rgba(244,63,94,0.15) 0%, transparent 70%);
      pointer-events: none;
    }
    .ab-stats::after {
      content: '';
      position: absolute;
      bottom: -80px;
      left: 20%;
      width: 350px;
      height: 350px;
      background: radial-gradient(circle, rgba(124,58,237,0.12) 0%, transparent 70%);
      pointer-events: none;
    }
    .ab-stats-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 0;
      position: relative;
      z-index: 1;
    }
    .ab-stat-item {
      text-align: center;
      padding: 20px 24px;
      border-right: 1px solid rgba(255,255,255,0.08);
    }
    .ab-stat-item:last-child { border-right: none; }
    .ab-stat-number {
      font-family: 'Poppins', sans-serif;
      font-size: clamp(1.8rem, 3.5vw, 3rem);
      font-weight: 800;
      background: var(--s-gradient);
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
      line-height: 1;
      margin-bottom: 8px;
    }
    .ab-stat-label {
      font-size: 0.82rem;
      color: rgba(255,255,255,0.5);
      font-weight: 500;
      letter-spacing: 0.02em;
    }

    /* ── Values Section ── */
    .ab-values {
      padding: 80px 0;
      background: var(--s-surface);
    }
    .ab-section-header {
      text-align: center;
      margin-bottom: 48px;
    }
    .ab-section-header .ab-eyebrow {
      display: inline-block;
      font-size: 0.7rem;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--s-accent);
      margin-bottom: 12px;
    }
    .ab-section-header h2 {
      font-family: 'Poppins', sans-serif;
      font-size: clamp(1.6rem, 2.8vw, 2.2rem);
      font-weight: 800;
      color: var(--s-text);
    }
    .ab-values-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 24px;
    }
    .ab-value-card {
      background: #fff;
      border-radius: 20px;
      padding: 36px 28px;
      border: 1px solid var(--s-border);
      text-align: center;
      transition: transform 0.28s ease, box-shadow 0.28s ease;
    }
    .ab-value-card:hover {
      transform: translateY(-6px);
      box-shadow: var(--s-shadow-lg);
    }
    .ab-value-icon {
      width: 64px;
      height: 64px;
      border-radius: 16px;
      background: linear-gradient(135deg, rgba(244,63,94,0.12) 0%, rgba(124,58,237,0.08) 100%);
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0 auto 20px;
    }
    .ab-value-icon svg {
      width: 28px;
      height: 28px;
      stroke: var(--s-accent);
      fill: none;
      stroke-width: 1.8;
      stroke-linecap: round;
      stroke-linejoin: round;
    }
    .ab-value-card h3 {
      font-family: 'Poppins', sans-serif;
      font-size: 1.05rem;
      font-weight: 700;
      color: var(--s-text);
      margin-bottom: 10px;
    }
    .ab-value-card p {
      font-size: 0.88rem;
      color: var(--s-muted);
      line-height: 1.7;
    }

    /* ── Manufacturing Section ── */
    .ab-mfg {
      padding: 88px 0;
    }
    .ab-mfg-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 64px;
      align-items: center;
    }
    .ab-mfg-img {
      border-radius: 20px;
      overflow: hidden;
      aspect-ratio: 4/3;
      box-shadow: var(--s-shadow-lg);
    }
    .ab-mfg-img img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }
    .ab-mfg-text .ab-eyebrow {
      display: inline-block;
      font-size: 0.7rem;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--s-accent);
      margin-bottom: 14px;
    }
    .ab-mfg-text h2 {
      font-family: 'Poppins', sans-serif;
      font-size: clamp(1.6rem, 2.8vw, 2.4rem);
      font-weight: 800;
      color: var(--s-text);
      margin-bottom: 20px;
    }
    .ab-mfg-text p {
      font-size: 0.96rem;
      color: var(--s-muted);
      line-height: 1.8;
      margin-bottom: 16px;
    }
    .ab-mfg-features {
      display: flex;
      flex-direction: column;
      gap: 10px;
      margin-top: 24px;
    }
    .ab-mfg-feature {
      display: flex;
      align-items: center;
      gap: 10px;
      font-size: 0.88rem;
      color: var(--s-text);
      font-weight: 500;
    }
    .ab-mfg-feature::before {
      content: '';
      width: 20px;
      height: 20px;
      border-radius: 50%;
      background: rgba(244,63,94,0.12);
      flex-shrink: 0;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23f43f5e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='4 10 8 14 16 6'/%3E%3C/svg%3E");
      background-size: contain;
    }

    /* ── Materials Section ── */
    .ab-materials {
      padding: 80px 0;
      background: var(--s-surface);
    }
    .ab-materials-tabs {
      display: flex;
      gap: 10px;
      justify-content: center;
      margin-bottom: 48px;
    }
    .ab-tab-btn {
      padding: 9px 22px;
      border-radius: 99px;
      border: 1px solid var(--s-border);
      background: #fff;
      color: var(--s-muted);
      font-family: inherit;
      font-size: 0.84rem;
      font-weight: 600;
      cursor: pointer;
      transition: all 0.2s;
    }
    .ab-tab-btn:hover, .ab-tab-btn.is-active {
      background: var(--s-accent);
      border-color: var(--s-accent);
      color: #fff;
    }
    .ab-mat-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 20px;
    }
    .ab-mat-card {
      background: #fff;
      border-radius: 16px;
      overflow: hidden;
      border: 1px solid var(--s-border);
      transition: transform 0.24s, box-shadow 0.24s;
    }
    .ab-mat-card:hover {
      transform: translateY(-4px);
      box-shadow: var(--s-shadow);
    }
    .ab-mat-img {
      aspect-ratio: 16/9;
      overflow: hidden;
    }
    .ab-mat-img img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
      transition: transform 0.4s ease;
    }
    .ab-mat-card:hover .ab-mat-img img { transform: scale(1.05); }
    .ab-mat-body {
      padding: 18px 20px 20px;
    }
    .ab-mat-body h4 {
      font-size: 0.9rem;
      font-weight: 700;
      color: var(--s-text);
      margin-bottom: 6px;
    }
    .ab-mat-body p {
      font-size: 0.8rem;
      color: var(--s-muted);
      line-height: 1.65;
    }
    .ab-mat-tag {
      display: inline-block;
      font-size: 0.66rem;
      font-weight: 700;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: var(--s-accent);
      background: rgba(244,63,94,0.08);
      padding: 3px 9px;
      border-radius: 99px;
      margin-bottom: 8px;
    }

    /* ── CTA Section ── */
    .ab-cta {
      padding: 96px 0;
      text-align: center;
      background: linear-gradient(135deg, #0f0a1e 0%, #1a0a2e 50%, #0a1428 100%);
      position: relative;
      overflow: hidden;
    }
    .ab-cta::before {
      content: '';
      position: absolute;
      top: -120px;
      left: 50%;
      transform: translateX(-50%);
      width: 600px;
      height: 600px;
      background: radial-gradient(circle, rgba(244,63,94,0.18) 0%, transparent 65%);
      pointer-events: none;
    }
    .ab-cta-content {
      position: relative;
      z-index: 1;
    }
    .ab-cta h2 {
      font-family: 'Poppins', sans-serif;
      font-size: clamp(1.8rem, 3.5vw, 2.8rem);
      font-weight: 800;
      color: #fff;
      margin-bottom: 14px;
    }
    .ab-cta p {
      font-size: 1rem;
      color: rgba(255,255,255,0.6);
      line-height: 1.7;
      max-width: 480px;
      margin: 0 auto 36px;
    }
    .ab-cta-btns {
      display: flex;
      gap: 12px;
      justify-content: center;
      flex-wrap: wrap;
    }