.certs-section {
        --text-primary: #1a1a1a;
        --text-secondary: #6b6b6b;
        --text-muted: #9a9a9a;
        --surface-page: #f7f7f5;
        --surface-card: #ffffff;
        --border: #e5e3dd;
        --border-strong: #d3d1c7;
        --accent-bg: #e6f1fb;
        --accent-text: #0c447c;
        --accent-icon: #185fa5;
        --success-bg: #eaf3de;
        --success-text: #27500a;
        --success-icon: #3b6d11;
      }

      .certs-section {
        max-width: 1200px;
        margin: 0 auto;
        padding: 4rem 2rem;
        background: #f8fafc;
        color: var(--text-primary);
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
      }

      .certs-header {
        text-align: center;
        margin-bottom: 3rem;
        animation: certRise 0.5s ease both;
      }

      .certs-header h2 {
        font-size: 32px;
        font-weight: 600;
        margin: 0 0 8px;
        letter-spacing: -0.02em;
      }

      .certs-header p {
        font-size: 16px;
        color: var(--text-secondary);
        margin: 0;
      }

      .certs-scene {
        perspective: 1000px;
      }

      .certs-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 32px;
        align-items: stretch;
      }

      .certs-box {
        background: #f9fcff;
    border: 1px solid #b2c3ff;
        border-radius: 16px;
        padding: 2rem;
        display: flex;
        flex-direction: column;
        animation: certRise 0.5s ease both;
      }

      .certs-box:nth-child(1) { animation-delay: 0.05s; }
      .certs-box:nth-child(2) { animation-delay: 0.1s; }

      .certs-box-title {
        display: flex;
        align-items: center;
        gap: 12px;
        margin-bottom: 6px;
      }

      .certs-box-icon {
        width: 48px;
        height: 48px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
      }

      .certs-box-icon.success { background: var(--success-bg); }
      .certs-box-icon.accent { background: var(--accent-bg); }
      .certs-box-icon i { font-size: 26px; font-weight: 600; }
      .certs-box-icon i.success { color: var(--success-icon); }
      .certs-box-icon i.accent { color: var(--accent-icon); }

      .certs-box-title h3 {
        font-size: 19px;
        font-weight: 600;
        margin: 0;
      }

      .certs-box-desc {
        font-size: 14px;
        color: var(--text-secondary);
        margin: 0 0 1.5rem;
      }

      .certs-box-body {
        flex: 1;
        display: flex;
        align-items: center;
      }
/* Separate background colors for each certification card */

.employee-grid .cert-card:nth-child(1) {
    background: #e8f1ff;
}

.employee-grid .cert-card:nth-child(2) {
    background: #e9f9f0;
}

.employee-grid .cert-card:nth-child(3) {
    background: #fff3e6;
}

.employee-grid .cert-card:nth-child(4) {
    background: #f2eaff;
}

.employee-grid .cert-card:nth-child(5) {
    background: #e8f8ff;
}

.employee-grid .cert-card:nth-child(6) {
    background: #fff0f3;
}

.employee-grid .cert-card:nth-child(7) {
    background: #eef8e8;
}

.employee-grid .cert-card:nth-child(8) {
    background: #fff8df;
}
      /* Card base */
      .certs-section .cert-card {
        background: var(--surface-card);
        border: 1px solid var(--border);
        border-radius: 12px;
        transform-style: preserve-3d;
        transition: transform 0.15s ease, box-shadow 0.2s ease, border-color 0.2s ease;
        box-shadow: 0 1px 2px rgba(0,0,0,0.05), 0 6px 16px rgba(0,0,0,0.05);
        will-change: transform;
        animation: certRise 0.6s ease both;
      }

      .certs-section .cert-card:hover {
        border-color: var(--border-strong);
        box-shadow: 0 4px 10px rgba(0,0,0,0.08), 0 18px 34px rgba(0,0,0,0.10);
      }

      .cert-icon-3d {
        transition: transform 0.2s ease;
        transform: translateZ(20px);
      }

      .cert-badge-3d {
        transform: translateZ(28px);
      }

      /* Company card (single, large) */
      .company-card {
        width: 100%;
        display: flex;
        align-items: center;
        gap: 18px;
        padding: 24px;
      }

      .company-badge {
        width: 60px;
        height: 60px;
        border-radius: 50%;
        background: #ffffff;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
      }

      .company-badge i { font-size: 36px; color: var(--success-icon); }

      .company-card-text p:first-child {
        font-weight: 600;
        font-size: 18px;
        margin: 0;
        transform: translateZ(10px);
      }

      .company-card-text p:last-child {
        font-size: 13px;
        color: var(--text-secondary);
        margin: 4px 0 0;
      }

      /* Employee grid */
      .employee-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 12px;
        width: 100%;
      }

      .employee-card {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 10px;
        padding: 16px 8px;
        text-align: center;
      }

      .employee-card i {
        font-size: 28px;
        color: var(--accent-icon);
      }

      .employee-card p {
        font-weight: 600;
        font-size: 13px;
        margin: 0;
        transform: translateZ(10px);
      }

      @keyframes certRise {
        from { opacity: 0; transform: translateY(24px) rotateX(8deg); }
        to { opacity: 1; transform: translateY(0) rotateX(0); }
      }

      /* Responsive */
      @media (max-width: 900px) {
        .certs-grid { grid-template-columns: 1fr; }
        .certs-section { padding: 3rem 1.5rem; }
      }

      @media (max-width: 600px) {
        .employee-grid { grid-template-columns: repeat(2, 1fr); }
        .certs-header h2 { font-size: 26px; }
        .company-card { flex-direction: column; text-align: center; }
      }