/* ── About page extras ── */
    .platform-tile {
      display: flex;
      flex-direction: column;
      border-radius: 1.25rem;
      border: 1.5px solid var(--border);
      background: var(--bg);
      padding: 1.75rem;
      transition: transform .25s, box-shadow .25s, border-color .25s;
      text-decoration: none;
      color: inherit;
    }
    html.dark .platform-tile {
      background: var(--bg-d2);
      border-color: var(--border-d);
    }
    .platform-tile:hover {
      transform: translateY(-5px);
      box-shadow: var(--shadow-lg);
      border-color: var(--accent);
    }
    .platform-tile .tag {
      font-size: .7rem;
      font-weight: 700;
      letter-spacing: .08em;
      text-transform: uppercase;
      padding: .2rem .65rem;
      border-radius: 999px;
      display: inline-block;
      margin-bottom: 1rem;
    }
    .tag-blue  { background: rgba(59,130,246,.12); color: #3b82f6; }
    .tag-purple{ background: rgba(139,92,246,.12);  color: #8b5cf6; }
    .tag-orange{ background: rgba(249,115,22,.12);  color: #f97316; }
    .tag-green { background: rgba(16,185,129,.12);  color: #10b981; }
    .value-row {
      display: flex;
      align-items: flex-start;
      gap: 1.25rem;
      padding: 1.5rem;
      border-radius: 1rem;
      background: var(--bg-2);
      border: 1px solid var(--border);
      transition: border-color .2s;
    }
    html.dark .value-row {
      background: var(--bg-d3);
      border-color: var(--border-d);
    }
    .value-row:hover { border-color: var(--accent); }
    .value-icon {
      width: 48px;
      height: 48px;
      border-radius: .875rem;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }
    .section-eyebrow {
      font-size: .75rem;
      font-weight: 700;
      letter-spacing: .1em;
      text-transform: uppercase;
      color: var(--accent);
      margin-bottom: .5rem;
      display: block;
    }
    .about-hero-badge {
      display: inline-flex;
      align-items: center;
      gap: .5rem;
      background: rgba(59,130,246,.1);
      border: 1px solid rgba(59,130,246,.2);
      color: var(--accent);
      font-size: .78rem;
      font-weight: 700;
      padding: .35rem 1rem;
      border-radius: 999px;
      margin-bottom: 1.25rem;
      letter-spacing: .05em;
      text-transform: uppercase;
    }
    html.dark .about-hero-badge {
      background: rgba(59,130,246,.15);
      border-color: rgba(59,130,246,.3);
    }
    .quick-link-card {
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      padding: 1.75rem 1.25rem;
      border-radius: 1.25rem;
      border: 1.5px solid var(--border);
      background: var(--bg);
      text-decoration: none;
      color: inherit;
      transition: transform .25s, box-shadow .25s, border-color .25s;
    }
    html.dark .quick-link-card {
      background: var(--bg-d2);
      border-color: var(--border-d);
    }
    .quick-link-card:hover {
      transform: translateY(-4px);
      box-shadow: var(--shadow);
      border-color: var(--accent);
    }