.story {
    display: grid;
    grid-template-columns: 1fr 1.05fr;
    gap: 64px;
    align-items: center;
  }
  .story h2 { font-size: clamp(36px, 4.5vw, 52px); margin-bottom: 24px; }
  .story p { color: #3a3a3a; font-size: 17px; margin-bottom: 16px; }
  .badges { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 28px; }
  .badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    background: var(--green-50);
    border: 1px solid var(--green-50);
    color: var(--green);
    border-radius: 999px;
    font-size: 14px;
    font-weight: 600;
  }
  .badge svg { color: var(--cyan); }
  @media (max-width: 880px) { .story { grid-template-columns: 1fr; gap: 40px; } }

  .values-grid {
    margin-top: 56px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
  }
  .value {
    background: var(--white);
    border-radius: var(--radius);
    padding: 36px 32px;
    box-shadow: var(--shadow-sm);
    transition: transform var(--t), box-shadow var(--t), opacity 0.6s ease;
  }
  .value:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); }
  .value .icon {
    width: 56px; height: 56px;
    border-radius: 14px;
    background: var(--green);
    color: var(--white);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
  }
  .value h3 { font-size: 22px; margin-bottom: 12px; }
  .value p { color: var(--muted); }
  @media (max-width: 880px) { .values-grid { grid-template-columns: 1fr; } }

  .stats-row {
    background: #0D2B4D;
    color: var(--white);
    padding: 80px 0;
    position: relative;
    overflow: hidden;
  }
  .stats-row::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at 50% 100%, rgba(76,175,80,0.16), transparent 60%);
    pointer-events: none;
  }
  .stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    text-align: center;
    position: relative;
  }
  .stats-grid > div {
    padding: 8px 12px;
    border-right: 1px solid rgba(255,255,255,0.12);
    min-width: 0;
  }
  .stats-grid > div:last-child { border-right: 0; }
  .stats-grid .num {
    font-size: clamp(34px, 4.6vw, 52px);
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.05;
    color: var(--white);
    white-space: nowrap;
    overflow-wrap: break-word;
  }
  .stats-grid .num em {
    font-style: normal;
    color: var(--white);
  }
  .stats-grid .lbl {
    margin-top: 12px;
    color: rgba(255,255,255,0.72);
    font-size: 14px;
    letter-spacing: 0.02em;
  }
  @media (max-width: 760px) {
    .stats-grid { grid-template-columns: repeat(2, 1fr); gap: 32px 12px; }
    .stats-grid > div { border-right: 0; padding: 0 4px; }
    .stats-grid > div:nth-child(odd) { border-right: 1px solid rgba(255,255,255,0.12); }
    .stats-grid .num { font-size: clamp(24px, 7vw, 32px); white-space: normal; }
  }
  @media (max-width: 400px) {
    .stats-grid { gap: 28px 8px; }
    .stats-grid .num { font-size: clamp(20px, 7vw, 26px); }
    .stats-grid .lbl { font-size: 12.5px; }
  }

  /* Staggered reveal */
  .values-grid > .value:nth-child(2) { transition-delay: 0.1s; }
  .values-grid > .value:nth-child(3) { transition-delay: 0.2s; }