/* Certification page — redesign */

.cert-page {
    --cert-cells: #00ebff;
    --cert-ops: #fbbf24;
    --cert-care: #4ade80;
    --cert-font-serif: 'IBM Plex Serif', serif;
    --cert-font-mono: 'JetBrains Mono', monospace;
    --cert-max-w: 1200px;
    --cert-section-gap: 120px;
    --cert-bg-surface: rgba(255,255,255,0.02);
    --cert-bg-elevated: rgba(255,255,255,0.04);
    --cert-text-secondary: rgba(255,255,255,0.55);
    --cert-text-tertiary: rgba(255,255,255,0.32);
    --cert-text-disabled: rgba(255,255,255,0.18);
    --cert-border-subtle: rgba(255,255,255,0.10);
    --cert-border-mid: rgba(255,255,255,0.25);
}

/* ── DISCIPLINE COLOR CUSTOM PROPERTIES ── */
.cert-role-page--cells { --cert-discipline-color: #00ebff; }
.cert-role-page--ops   { --cert-discipline-color: #fbbf24; }
.cert-role-page--care  { --cert-discipline-color: #4ade80; }

/* ── SECTION LABEL ── */
.cert-section-label {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.16em;
    color: var(--cert-text-tertiary);
    text-transform: uppercase;
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
}

.cert-section-label::before {
    content: '';
    width: 24px;
    height: 1px;
    background: var(--cert-border-subtle);
}

/* ── SHARED HEADING ── */
.cert-page h2 {
    font-family: var(--cert-font-serif);
    font-size: clamp(32px, 5vw, 48px);
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -0.03em;
    margin-bottom: 48px;
}

/* ── BUTTONS ── */
.cert-btn {
    padding: 14px 28px;
    border-radius: 4px;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    transition: opacity 0.2s, border-color 0.2s, color 0.2s;
    border: 1px solid transparent;
    cursor: pointer;
    display: inline-block;
    text-align: center;
}

.cert-btn-primary {
    background: #fff;
    color: #000;
    border-color: var(--color-text-primary);
}

.cert-btn-primary:hover {
    opacity: 0.9;
}

.cert-btn-cyan-ghost {
    background: transparent;
    color: var(--cert-cells);
    border: 1px solid var(--cert-cells);
}

.cert-btn-cyan-ghost:hover {
    background: rgba(0,235,255,0.08);
}

.cert-btn-discipline-ghost {
    background: transparent;
    color: var(--cert-discipline-color, var(--cert-cells));
    border: 1px solid var(--cert-discipline-color, var(--cert-cells));
}

.cert-btn-discipline-ghost:hover {
    background: rgba(255,255,255,0.04);
}

.cert-btn-full {
    width: 100%;
}

/* ── HERO ── */
.cert-hero {
    position: relative;
    /* Previously 160px top / 120px bottom which created a huge vertical
       void above the h1 on the /certification overview (and role/path
       pages that reuse these classes). Dropped to match .hero spacing
       used throughout the rest of the site. */
    padding: var(--space-xl) 48px var(--space-xl);
    max-width: var(--cert-max-w);
    margin: 0 auto;
    text-align: left;
}

/* Split cert-hero layout: left body column + right Freepik illustration. */
.cert-hero--split {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-xl);
    flex-wrap: nowrap;
}

.cert-hero__body {
    flex: 2 1 0;
    min-width: 0;
}

.cert-hero__illustration {
    flex: 0 0 auto;
    color: var(--cert-cells);
    width: 360px;
    height: 360px;
}

@media (max-width: 1100px) {
    .cert-hero__illustration {
        width: 280px;
        height: 280px;
    }
}

@media (max-width: 860px) {
    .cert-hero--split {
        flex-direction: column;
        align-items: flex-start;
    }
    .cert-hero__illustration {
        align-self: center;
        width: 280px;
        height: 280px;
    }
}

.cert-hero-orb {
    position: absolute;
    top: -30%;
    left: 50%;
    transform: translateX(-50%);
    width: 900px;
    height: 900px;
    background: radial-gradient(ellipse at center, rgba(0,120,255,0.10) 0%, rgba(0,80,200,0.04) 35%, transparent 70%);
    pointer-events: none;
    z-index: -1;
}

.cert-hero h1 {
    /* Fallback chain: use the cert-page local if present, otherwise the
       global --font-serif, otherwise IBM Plex Serif directly. This keeps
       the title serif on both the original .cert-page-wrapped templates
       and the newer .cert-theme-wrapped path/role templates. */
    font-family: var(--cert-font-serif, var(--font-serif, 'IBM Plex Serif', serif));
    font-size: clamp(44px, 7vw, 68px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -0.04em;
    margin-bottom: 20px;
    max-width: 800px;
}

.cert-hero-subtitle {
    font-size: 18px;
    color: var(--cert-text-secondary);
    max-width: 560px;
    margin-bottom: 40px;
    line-height: 1.7;
}

.cert-hero-ctas {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}

/* ── JENSEN HUANG QUOTE BOX ── */
.cert-quote-box {
    max-width: var(--cert-max-w);
    margin: 0 auto;
    padding: 0 48px 80px;
}

.cert-quote-box--main {
    padding-bottom: var(--cert-section-gap);
}

.cert-quote-box blockquote {
    background: rgba(255,255,255,0.04);
    border-left: 4px solid #00ebff;
    border-radius: 4px;
    padding: 40px 48px;
    margin: 0;
}

.cert-quote-box blockquote p {
    font-family: 'IBM Plex Serif', serif;
    font-style: italic;
    font-size: clamp(18px, 2.5vw, 24px);
    line-height: 1.6;
    color: var(--color-text-secondary);
    margin: 0 0 16px;
}

.cert-quote-box blockquote cite {
    display: block;
    font-family: inherit;
    font-style: normal;
    font-size: 14px;
    color: var(--color-text-secondary);
}

/* ── DISCIPLINES ── */
.cert-disciplines {
    padding: 0 48px var(--cert-section-gap);
    max-width: var(--cert-max-w);
    margin: 0 auto;
}

/* Discipline card: full width, colored left border */
.cert-discipline-card {
    background: var(--cert-bg-surface);
    border-radius: 4px;
    border-left: 4px solid #fff;
    padding: 32px;
    margin-bottom: 32px;
}

.cert-discipline-card:last-child {
    margin-bottom: 0;
}

.cert-discipline-cells { border-left-color: var(--cert-cells); }
.cert-discipline-ops   { border-left-color: var(--cert-ops); }
.cert-discipline-care  { border-left-color: var(--cert-care); }

.cert-discipline-header {
    margin-bottom: 28px;
}

.cert-discipline-name {
    font-size: 28px;
    font-weight: 700;
    letter-spacing: -0.03em;
    margin-bottom: 6px;
}

.cert-color-cells { color: var(--cert-cells); }
.cert-color-ops   { color: var(--cert-ops); }
.cert-color-care  { color: var(--cert-care); }
.cert-color-dev   { color: #a78bfa; }

.cert-discipline-tagline {
    font-size: 14px;
    color: var(--cert-text-secondary);
    margin: 0;
}

/* Roles grid */
.cert-roles-grid {
    display: grid;
    gap: 16px;
}

.cert-roles-3col { grid-template-columns: repeat(3, 1fr); }
.cert-roles-2col { grid-template-columns: repeat(2, 1fr); }

.cert-role-card {
    background: var(--cert-bg-elevated);
    border: 1px solid var(--cert-border-subtle);
    border-radius: 4px;
    padding: 20px;
    display: flex;
    gap: 16px;
    align-items: flex-start;
    transition: border-color 0.2s;
}

.cert-role-card:hover.cert-role-cells { border-color: var(--cert-cells); }
.cert-role-card:hover.cert-role-ops   { border-color: var(--cert-ops); }
.cert-role-card:hover.cert-role-care  { border-color: var(--cert-care); }

.cert-role-icon {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    margin-top: 2px;
}

.cert-role-icon svg {
    display: block;
}

.cert-role-name {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: var(--color-text-primary);
    margin-bottom: 4px;
}

.cert-role-zone {
    display: block;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.08em;
    color: var(--cert-text-tertiary);
    text-transform: uppercase;
    margin-bottom: 8px;
}

.cert-role-desc {
    font-size: 13px;
    color: var(--cert-text-secondary);
    line-height: 1.5;
    margin: 0;
}

a.cert-role-card {
    text-decoration: none;
    color: inherit;
    cursor: pointer;
}

.cert-role-link {
    display: block;
    font-size: 13px;
    font-weight: 500;
    margin-top: 12px;
    transition: opacity 0.2s;
}

.cert-role-cells .cert-role-link { color: var(--cert-cells); }
.cert-role-ops .cert-role-link   { color: var(--cert-ops); }
.cert-role-care .cert-role-link  { color: var(--cert-care); }

a.cert-role-card:hover .cert-role-link {
    opacity: 0.8;
}

/* ── CROSS-REFERENCE COMPARISON TABLE ── */
.cert-comparison {
    padding: 0 48px var(--cert-section-gap);
    max-width: var(--cert-max-w);
    margin: 0 auto;
}

.cert-table-wrapper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.cert-comparison-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.cert-comparison-table thead th {
    text-align: left;
    padding: 14px 16px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--cert-text-tertiary);
    border-bottom: 1px solid var(--cert-border-mid);
    white-space: nowrap;
}

.cert-comparison-table tbody td {
    padding: 16px;
    border-bottom: 1px solid var(--cert-border-subtle);
    color: var(--cert-text-secondary);
    vertical-align: middle;
}

.cert-comparison-table tbody tr:hover {
    background: var(--cert-bg-surface);
}

.cert-comparison-table tbody td:first-child {
    font-weight: 600;
    color: var(--color-text-primary);
}

.cert-comparison-table tbody td:first-child a {
    color: var(--color-text-primary);
    text-decoration: none;
}

.cert-comparison-table tbody td:first-child a:hover {
    color: var(--cert-cells);
}

.cert-table-discipline {
    font-weight: 600;
    font-size: 13px;
    text-decoration: none;
}

a.cert-table-discipline:hover {
    text-decoration: underline;
}

/* ── CERTIFICATION PRICING ── */
.cert-pricing {
    padding: 0 48px var(--cert-section-gap);
    max-width: var(--cert-max-w);
    margin: 0 auto;
}

.cert-pricing-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.cert-pricing-card {
    background: var(--cert-bg-surface);
    border: 1px solid var(--cert-border-subtle);
    border-radius: 4px;
    padding: 32px;
    display: flex;
    flex-direction: column;
}

.cert-pricing-card--featured {
    border-color: var(--cert-cells);
    background: var(--cert-bg-elevated);
}

.cert-pricing-card h3 {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 16px;
    letter-spacing: -0.02em;
}

.cert-pricing-amount {
    font-family: var(--cert-font-serif);
    font-size: 36px;
    font-weight: 700;
    letter-spacing: -0.03em;
    margin-bottom: 8px;
}

.cert-pricing-amount span {
    font-size: 16px;
    font-weight: 400;
    color: var(--cert-text-secondary);
}

.cert-pricing-plus {
    font-size: 16px;
    color: var(--cert-text-secondary);
    margin-bottom: 8px;
}

.cert-pricing-desc {
    font-size: 14px;
    color: var(--cert-text-secondary);
    line-height: 1.6;
    margin-bottom: 24px;
}

.cert-pricing-features {
    list-style: none;
    padding: 0;
    margin: 0 0 24px;
    flex: 1;
}

.cert-pricing-features li {
    padding: 6px 0;
    font-size: 14px;
    color: var(--cert-text-secondary);
    padding-left: 20px;
    position: relative;
}

.cert-pricing-features li::before {
    content: '\2713';
    position: absolute;
    left: 0;
    color: var(--cert-cells);
    font-weight: 600;
}

.cert-pricing-card .cert-btn {
    margin-top: auto;
}

/* ── HOW IT WORKS ── */
.cert-process {
    padding: 0 48px var(--cert-section-gap);
    max-width: var(--cert-max-w);
    margin: 0 auto;
}

.cert-process-track {
    display: flex;
    align-items: flex-start;
    gap: 0;
}

.cert-process-step {
    flex: 1;
    text-align: left;
    padding: 0 16px;
}

.cert-process-circle {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 1.5px solid var(--cert-border-mid);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 600;
    color: var(--color-text-primary);
    margin-bottom: 16px;
}

.cert-process-step h4 {
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 8px;
    letter-spacing: -0.02em;
}

.cert-process-step p {
    font-size: 13px;
    color: var(--cert-text-secondary);
    line-height: 1.6;
    max-width: 200px;
    margin: 0;
}

.cert-process-line {
    width: 60px;
    height: 1px;
    background: var(--cert-border-mid);
    flex-shrink: 0;
    margin-top: 24px;
}

/* ── METRICS ── */
.cert-metrics {
    padding: 0 48px var(--cert-section-gap);
    max-width: var(--cert-max-w);
    margin: 0 auto;
    display: flex;
    justify-content: center;
    gap: 32px;
}

.cert-metric-card {
    border: 1px solid var(--cert-border-subtle);
    border-radius: 4px;
    background: var(--cert-bg-surface);
    padding: 40px 56px;
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.cert-metric-number {
    font-family: var(--cert-font-serif);
    font-size: 48px;
    font-weight: 700;
    letter-spacing: -0.04em;
    color: var(--color-text-primary);
}

.cert-metric-label {
    font-size: 13px;
    color: var(--cert-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

/* ── ENROLLMENT FORM ── */
.cert-enrollment {
    padding: 0 48px var(--cert-section-gap);
    max-width: var(--cert-max-w);
    margin: 0 auto;
}

.cert-form-wrapper {
    max-width: 480px;
}

.cert-form-group {
    margin-bottom: 20px;
}

.cert-form-group label {
    display: block;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.12em;
    color: var(--cert-text-tertiary);
    text-transform: uppercase;
    margin-bottom: 8px;
}

.cert-form-group input {
    width: 100%;
    background: var(--color-bg, #000);
    border: 1px solid var(--cert-border-subtle);
    border-radius: 4px;
    padding: 12px 14px;
    color: var(--color-text-primary);
    font-family: inherit;
    font-size: 14px;
    transition: border-color 0.2s;
    box-sizing: border-box;
}

.cert-form-group input:focus {
    outline: none;
    border-color: var(--cert-border-mid);
}

.cert-form-group input::placeholder {
    color: var(--cert-text-disabled);
}

.cert-form-success {
    display: none;
    padding: 24px;
    background: var(--cert-bg-elevated);
    border: 1px solid var(--cert-border-subtle);
    border-radius: 4px;
    text-align: left;
    color: var(--cert-care);
    font-weight: 500;
}

.cert-form-alt {
    margin-top: 20px;
    font-size: 13px;
    color: var(--cert-text-tertiary);
}

.cert-form-alt a {
    color: var(--cert-cells);
    text-decoration: none;
}

.cert-form-alt a:hover {
    text-decoration: underline;
}

/* ── FAQ ── */
.cert-faq {
    padding: 0 48px var(--cert-section-gap);
    max-width: var(--cert-max-w);
    margin: 0 auto;
}

.cert-faq-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.cert-faq-item {
    border-bottom: 1px solid var(--cert-border-subtle);
    padding: 24px 0;
}

.cert-faq-item:first-child {
    border-top: 1px solid var(--cert-border-subtle);
}

.cert-faq-question {
    background: none;
    border: none;
    color: var(--color-text-primary);
    font-family: inherit;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 0;
    text-align: left;
    transition: color 0.2s;
}

.cert-faq-question:hover {
    color: var(--cert-cells);
}

.cert-faq-toggle {
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    flex-shrink: 0;
    transition: transform 0.2s;
}

.cert-faq-item.open .cert-faq-toggle {
    transform: rotate(45deg);
}

.cert-faq-answer {
    display: none;
    color: var(--cert-text-secondary);
    font-size: 14px;
    margin-top: 16px;
    line-height: 1.8;
}

.cert-faq-item.open .cert-faq-answer {
    display: block;
}

/* ── FINAL CTA ── */
.cert-final-cta {
    padding: 0 48px var(--cert-section-gap);
    max-width: var(--cert-max-w);
    margin: 0 auto;
    text-align: left;
}

.cert-final-cta h2 {
    margin-bottom: 32px;
}

.cert-final-cta .cert-hero-ctas {
    justify-content: flex-start;
}

/* ══════════════════════════════════════════════════
   INDIVIDUAL ROLE PAGE STYLES
   ══════════════════════════════════════════════════ */

.cert-role-page {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 48px;
}

.cert-role-hero {
    padding: 160px 0 80px;
    position: relative;
}

.cert-role-hero .cert-hero-orb {
    position: absolute;
    top: -30%;
    left: 50%;
    transform: translateX(-50%);
    width: 900px;
    height: 900px;
    background: radial-gradient(ellipse at center, rgba(0,120,255,0.10) 0%, rgba(0,80,200,0.04) 35%, transparent 70%);
    pointer-events: none;
    z-index: -1;
}

.cert-role-discipline-badge {
    display: inline-block;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 4px 12px;
    border-radius: 4px;
    margin-bottom: 16px;
}

.cert-role-hero-title-row {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 16px;
}

.cert-role-hero-icon {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
}

.cert-role-hero-icon svg {
    display: block;
    width: 48px;
    height: 48px;
}

.cert-role-hero h1 {
    font-family: 'IBM Plex Serif', serif;
    font-size: clamp(36px, 5vw, 56px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -0.03em;
    margin-bottom: 0;
    max-width: 800px;
}

.cert-role-hero-tagline {
    font-size: 18px;
    color: var(--color-text-secondary);
    max-width: 560px;
    line-height: 1.7;
}

/* Role page quote box (inside role-page container) */
.cert-role-page .cert-quote-box {
    padding: 0 0 80px;
}

.cert-role-section {
    margin-bottom: 80px;
}

.cert-role-section-label {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.16em;
    color: var(--color-text-tertiary);
    text-transform: uppercase;
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
}

.cert-role-section-label::before {
    content: '';
    width: 24px;
    height: 1px;
    background: rgba(255,255,255,0.10);
}

.cert-role-section h2 {
    font-family: 'IBM Plex Serif', serif;
    font-size: clamp(24px, 4vw, 36px);
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -0.03em;
    margin-bottom: 24px;
    padding-left: 16px;
    border-left: 3px solid var(--cert-discipline-color, rgba(255,255,255,0.10));
}

.cert-role-overview {
    font-size: 16px;
    color: var(--color-text-secondary);
    line-height: 1.8;
    max-width: 720px;
}

.cert-role-overview p {
    margin-bottom: 16px;
}

.cert-role-context {
    max-width: 720px;
}

.cert-role-context-text {
    font-size: 15px;
    color: var(--color-text-secondary);
    line-height: 1.8;
    margin-bottom: 24px;
}

.cert-role-quote {
    border-left: 3px solid;
    padding-left: 24px;
    margin: 0;
}

.cert-role-quote p {
    font-family: 'IBM Plex Serif', serif;
    font-size: 18px;
    font-style: italic;
    line-height: 1.7;
    color: var(--color-text-primary);
    margin: 0 0 8px;
}

.cert-role-quote cite {
    font-size: 14px;
    font-style: normal;
    color: var(--color-text-secondary);
}

/* Skills list with discipline-colored bullets */
.cert-role-skills-list {
    list-style: none;
    padding: 0;
    max-width: 600px;
}

.cert-role-skills-list li {
    padding: 8px 0;
    font-size: 15px;
    color: var(--color-text-secondary);
    padding-left: 24px;
    position: relative;
}

.cert-role-skills-list li::before {
    content: '\2713';
    position: absolute;
    left: 0;
    font-weight: 600;
    color: var(--cert-discipline-color, rgba(255,255,255,0.55));
}

/* Cross-reference cards with top border in discipline color */
.cert-role-crossref-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    max-width: 720px;
}

.cert-role-crossref-card {
    background: rgba(255,255,255,0.02);
    border: 1px solid rgba(255,255,255,0.10);
    border-top: 3px solid var(--cert-discipline-color, rgba(255,255,255,0.10));
    border-radius: 4px;
    padding: 20px;
}

.cert-role-crossref-name {
    font-size: 15px;
    font-weight: 600;
    color: var(--color-text-primary);
    margin-bottom: 6px;
}

.cert-role-crossref-relevance {
    font-size: 13px;
    color: var(--color-text-secondary);
    line-height: 1.6;
}

.cert-role-modules-list {
    list-style: none;
    padding: 0;
    max-width: 600px;
    counter-reset: module;
}

.cert-role-modules-list li {
    padding: 12px 0;
    font-size: 15px;
    color: var(--color-text-secondary);
    border-bottom: 1px solid rgba(255,255,255,0.06);
    counter-increment: module;
    padding-left: 36px;
    position: relative;
}

.cert-role-modules-list li::before {
    content: counter(module, decimal-leading-zero);
    position: absolute;
    left: 0;
    font-family: 'JetBrains Mono', monospace;
    font-size: 13px;
    font-weight: 500;
    color: var(--color-text-tertiary);
}

.cert-role-exam-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 16px;
    max-width: 600px;
}

.cert-role-exam-card {
    background: rgba(255,255,255,0.02);
    border: 1px solid rgba(255,255,255,0.10);
    border-radius: 4px;
    padding: 20px;
}

.cert-role-exam-value {
    display: block;
    font-family: 'IBM Plex Serif', serif;
    font-size: 32px;
    font-weight: 700;
    color: var(--color-text-primary);
    margin-bottom: 4px;
}

.cert-role-exam-label {
    display: block;
    font-size: 12px;
    color: var(--color-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

/* Pricing callout on role pages */
.cert-role-pricing-callout {
    background: var(--cert-bg-elevated);
    border: 1px solid var(--cert-border-subtle);
    border-left: 4px solid var(--cert-discipline-color, var(--cert-cells));
    border-radius: 4px;
    padding: 32px;
    max-width: 600px;
}

.cert-role-pricing-included {
    font-size: 16px;
    color: var(--color-text-primary);
    line-height: 1.7;
    margin-bottom: 8px;
}

.cert-role-pricing-included strong {
    color: var(--color-text-primary);
}

.cert-role-pricing-individual {
    font-size: 15px;
    color: var(--color-text-secondary);
    margin-bottom: 24px;
}

.cert-role-pricing-individual strong {
    color: var(--color-text-primary);
}

.cert-role-cta {
    padding: 60px 0 120px;
}

.cert-role-cta h2 {
    margin-bottom: 24px;
}

.cert-role-cta-actions {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}

/* ── RESPONSIVE: TABLET ── */
@media (max-width: 1024px) {
    .cert-page {
        --cert-section-gap: 80px;
    }

    .cert-roles-3col {
        grid-template-columns: 1fr;
    }

    .cert-roles-2col {
        grid-template-columns: 1fr;
    }

    .cert-process-track {
        flex-direction: column;
        align-items: center;
    }

    .cert-process-line {
        width: 1px;
        height: 32px;
        margin-top: 0;
    }

    .cert-metrics {
        flex-direction: column;
        align-items: center;
    }

    .cert-metric-card {
        width: 100%;
        max-width: 360px;
    }

    .cert-pricing-grid {
        grid-template-columns: 1fr;
        max-width: 480px;
    }
}

/* ── RESPONSIVE: MOBILE ── */
@media (max-width: 768px) {
    .cert-hero {
        padding: var(--space-lg) 24px var(--space-lg);
    }

    .cert-hero-ctas {
        flex-direction: column;
    }

    .cert-btn {
        width: 100%;
    }

    .cert-disciplines,
    .cert-process,
    .cert-metrics,
    .cert-enrollment,
    .cert-faq,
    .cert-final-cta,
    .cert-comparison,
    .cert-pricing,
    .cert-methodology,
    .cert-ailabs,
    .cert-quote-box {
        padding-left: 24px;
        padding-right: 24px;
    }

    .cert-discipline-card {
        padding: 24px;
    }

    .cert-metric-card {
        padding: 32px;
    }

    .cert-role-page {
        padding: 0 24px;
    }

    .cert-role-hero {
        padding: 120px 0 60px;
    }

    .cert-role-hero-title-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .cert-role-section {
        margin-bottom: 60px;
    }

    .cert-role-cta-actions {
        flex-direction: column;
    }

    .cert-role-cta-actions .cert-btn {
        width: 100%;
    }

    .cert-quote-box blockquote {
        padding: 24px;
    }
}

@media (max-width: 480px) {
    .cert-page {
        --cert-section-gap: 60px;
    }

    .cert-hero {
        padding: var(--space-md) 16px var(--space-lg);
    }

    .cert-disciplines,
    .cert-process,
    .cert-metrics,
    .cert-enrollment,
    .cert-faq,
    .cert-final-cta,
    .cert-comparison,
    .cert-pricing,
    .cert-methodology,
    .cert-ailabs,
    .cert-quote-box {
        padding-left: 16px;
        padding-right: 16px;
    }

    .cert-hero h1 {
        font-size: 32px;
    }

    .cert-discipline-name {
        font-size: 22px;
    }

    .cert-role-page {
        padding: 0 16px;
    }

    .cert-role-hero {
        padding: 100px 0 48px;
    }
}

/* ══════════════════════════════════════════════════
   DISCIPLINE PATH PAGE STYLES
   ══════════════════════════════════════════════════ */

.cert-path-subtitle {
    font-family: var(--cert-font-serif);
    font-size: clamp(20px, 3vw, 28px);
    color: var(--color-text-secondary);
    margin-bottom: 24px;
    font-style: italic;
}

.cert-path-description {
    font-size: 16px;
    color: var(--color-text-secondary);
    line-height: 1.8;
    max-width: 720px;
    margin-bottom: 24px;
    white-space: pre-line;
}

.cert-path-tagline-short {
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0.04em;
    margin-bottom: 0;
}

/* Path role cards */
.cert-path-roles-grid {
    display: grid;
    gap: 20px;
    max-width: 800px;
}

.cert-path-role-card {
    background: var(--cert-bg-elevated);
    border: 1px solid var(--cert-border-subtle);
    border-radius: 4px;
    padding: 28px;
    display: flex;
    gap: 20px;
    align-items: flex-start;
    text-decoration: none;
    color: inherit;
    transition: border-color 0.2s;
}

.cert-path-role-card:hover.cert-role-cells { border-color: var(--cert-cells); }
.cert-path-role-card:hover.cert-role-ops   { border-color: var(--cert-ops); }
.cert-path-role-card:hover.cert-role-care  { border-color: var(--cert-care); }

.cert-path-role-icon {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    margin-top: 4px;
}

.cert-path-role-icon svg {
    display: block;
    width: 32px;
    height: 32px;
}

.cert-path-role-title {
    font-size: 18px;
    font-weight: 700;
    color: var(--color-text-primary);
    margin-bottom: 8px;
    letter-spacing: -0.02em;
}

.cert-path-role-desc {
    font-size: 14px;
    color: var(--color-text-secondary);
    line-height: 1.7;
    margin: 0 0 12px;
}

.cert-path-role-meta {
    display: flex;
    gap: 20px;
    margin-bottom: 12px;
}

.cert-path-role-duration,
.cert-path-role-exam {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.06em;
    color: var(--color-text-tertiary);
    text-transform: uppercase;
}

.cert-path-progression-text {
    font-size: 16px;
    color: var(--color-text-secondary);
    line-height: 1.8;
    max-width: 720px;
    white-space: pre-line;
}

/* Discipline name as link */
a.cert-discipline-name {
    text-decoration: none;
    transition: opacity 0.2s;
}

a.cert-discipline-name:hover {
    opacity: 0.8;
    text-decoration: underline;
}

/* Discipline badge as link */
a.cert-role-discipline-badge {
    text-decoration: none;
    transition: opacity 0.2s;
}

a.cert-role-discipline-badge:hover {
    opacity: 0.8;
}

@media (max-width: 768px) {
    .cert-path-role-card {
        flex-direction: column;
        gap: 12px;
    }

    .cert-path-role-meta {
        flex-direction: column;
        gap: 4px;
    }
}

/* ===== Discipline-themed cert page (generic, parameterized by --cert-accent) ===== */
/* Each discipline's template sets --cert-accent on a wrapper element. */
.cert-theme {
    --cert-accent: var(--cert-accent, #a78bfa); /* fallback */
}

/* Per-discipline defaults if the template doesn't set --cert-accent inline. */
.cert-theme--cells { --cert-accent: #00ebff; }
.cert-theme--ops   { --cert-accent: #fbbf24; }
.cert-theme--care  { --cert-accent: #4ade80; }
.cert-theme--dev   { --cert-accent: var(--cert-accent, #a78bfa); }

.eyebrow--dev { color: var(--cert-accent); }

.cert-role-page--dev { --cert-discipline-color: var(--cert-accent, #a78bfa); }

/* Transparent background + z-index layering for the hero. The base
   .cert-hero rule at the top of this file controls padding + size.
   The !important on padding is defensive: prior iterations of this
   file set padding: 160px 48px var(--cert-section-gap) (200px+ of
   vertical dead-space). This clamps it regardless of cascade order. */
.cert-hero {
    background: transparent;
    padding: var(--space-xl) 48px var(--space-xl) !important;
}

.cert-hero > * {
    position: relative;
    z-index: 1;
}

.cert-stats {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-md);
    margin-top: var(--space-lg);
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
}

.cert-stat {
    padding: var(--space-sm) var(--space-md);
    background: var(--color-surface-2);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
}

.cert-stat strong {
    color: var(--color-text-primary);
    font-weight: 600;
    margin-right: 4px;
}

.cert-level-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--space-lg);
}

.cert-level-card {
    padding: var(--space-lg);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-surface-1);
    display: flex;
    flex-direction: column;
}

.cert-level-card--dev {
    border-color: rgba(167, 139, 250, 0.3);
}

.cert-level-card--dev:hover {
    border-color: var(--cert-accent, #a78bfa);
}

.cert-level-card__icon {
    margin-bottom: var(--space-md);
}

.cert-level-card h3 {
    font-size: var(--text-xl);
    color: var(--color-text-primary);
    margin-bottom: 4px;
}

.cert-level-card__level {
    font-size: var(--text-xs);
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--cert-accent, #a78bfa);
    margin-bottom: var(--space-xs);
}

.cert-level-card__duration {
    font-size: var(--text-sm);
    color: var(--color-text-tertiary);
    margin-bottom: var(--space-md);
}

.cert-level-card p {
    color: var(--color-text-secondary);
    line-height: 1.6;
    margin-bottom: var(--space-md);
    flex: 1;
}

.cert-level-card .btn {
    align-self: flex-start;
}

/* Learning path visualization */
.learning-path {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-sm);
    max-width: 520px;
    margin: 0 auto;
}

.learning-path__step {
    width: 100%;
    padding: var(--space-md) var(--space-lg);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-surface-1);
    display: flex;
    align-items: center;
    gap: var(--space-md);
}

.learning-path__step--dev {
    border-color: rgba(167, 139, 250, 0.4);
}

.learning-path__step--master {
    border-color: var(--color-accent-cyan);
    background: var(--color-accent-cyan-muted);
}

.learning-path__node {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    font-family: var(--font-serif);
    font-weight: 700;
    color: var(--color-bg);
    background: var(--cert-accent, #a78bfa);
    border-radius: 50%;
    flex-shrink: 0;
}

.learning-path__step--master .learning-path__node {
    background: var(--color-accent-cyan);
}

.learning-path__step strong {
    font-size: var(--text-base);
    color: var(--color-text-primary);
    display: block;
}

.learning-path__detail {
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
}

.learning-path__arrow {
    color: var(--color-text-tertiary);
    font-size: var(--text-xl);
}

.learning-path__timeline {
    text-align: center;
    margin-top: var(--space-lg);
    font-size: var(--text-sm);
    color: var(--color-text-tertiary);
    font-style: italic;
}

/* Overview grid */
.cert-overview-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--space-md);
    padding: var(--space-lg);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-surface-1);
}

.cert-overview__item {
    display: flex;
    flex-direction: column;
}

.cert-overview__label {
    font-size: var(--text-xs);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--color-text-tertiary);
    margin-bottom: 4px;
}

.cert-overview__value {
    font-family: var(--font-serif);
    font-size: var(--text-lg);
    font-weight: 500;
    color: var(--color-text-primary);
}

/* Outcomes list */
.outcomes-list {
    list-style: none;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--space-md);
}

.outcomes-list li {
    position: relative;
    padding: var(--space-md) var(--space-md) var(--space-md) var(--space-xl);
    background: var(--color-surface-1);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    color: var(--color-text-secondary);
    line-height: 1.6;
}

.outcomes-list li::before {
    content: "✓";
    position: absolute;
    left: var(--space-md);
    top: var(--space-md);
    color: var(--cert-accent, #a78bfa);
    font-weight: 700;
}

/* Module timeline */
.module-timeline {
    max-width: 640px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.module-timeline__item {
    display: flex;
    align-items: center;
    gap: var(--space-md);
    padding: var(--space-md);
    background: var(--color-surface-1);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
}

.module-timeline__item--exam {
    border-color: var(--color-accent-cyan);
    background: var(--color-accent-cyan-muted);
}

.module-timeline__number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    font-family: var(--font-mono);
    font-weight: 600;
    color: var(--cert-accent, #a78bfa);
    background: var(--color-surface-3);
    border-radius: 50%;
    flex-shrink: 0;
}

.module-timeline__item--exam .module-timeline__number {
    color: var(--color-bg);
    background: var(--color-accent-cyan);
}

.module-timeline__body {
    display: flex;
    justify-content: space-between;
    flex: 1;
    gap: var(--space-md);
}

.module-timeline__body strong {
    color: var(--color-text-primary);
    font-weight: 500;
}

.module-timeline__body span {
    color: var(--color-text-tertiary);
    font-size: var(--text-sm);
}

.exam-details {
    list-style: none;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.exam-details li {
    padding: var(--space-md);
    background: var(--color-surface-1);
    border-left: 3px solid var(--cert-accent, #a78bfa);
    border-radius: var(--radius-sm);
    color: var(--color-text-secondary);
    line-height: 1.6;
}

.exam-details strong {
    color: var(--color-text-primary);
    margin-right: var(--space-sm);
}

.section__sub {
    font-size: var(--text-xl);
    color: var(--color-text-primary);
    margin-top: var(--space-lg);
    margin-bottom: var(--space-md);
}

.section__prose {
    color: var(--color-text-secondary);
    line-height: 1.8;
}

/* ══════════════════════════════════════════════════
   HERO APPLY FORM (replaces hero illustration)
   ══════════════════════════════════════════════════ */

.cert-hero__apply {
    flex: 1 1 0;
    max-width: 360px;
    min-width: 280px;
}

.cert-apply-card {
    position: relative;
    background:
        linear-gradient(180deg, rgba(0,235,255,0.05) 0%, rgba(255,255,255,0.015) 100%),
        rgba(6,12,18,0.55);
    border: 1px solid var(--cert-border-subtle);
    border-radius: 10px;
    padding: 26px 26px 22px;
    overflow: hidden;
    box-shadow:
        0 24px 50px -20px rgba(0,0,0,0.55),
        0 0 0 1px rgba(0,235,255,0.03) inset;
}

.cert-apply-card::before {
    content: '';
    position: absolute;
    inset: -1px;
    border-radius: 10px;
    background: linear-gradient(140deg, rgba(0,235,255,0.35), rgba(167,139,250,0.22) 55%, transparent 100%);
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
            mask-composite: exclude;
    padding: 1px;
    pointer-events: none;
}

.cert-apply-card__head {
    margin-bottom: 18px;
}

.cert-apply-card__eyebrow {
    display: inline-block;
    font-size: 9.5px;
    font-weight: 600;
    letter-spacing: 0.18em;
    color: var(--cert-cells);
    text-transform: uppercase;
    padding: 3px 9px;
    border: 1px solid rgba(0,235,255,0.30);
    border-radius: 2px;
    margin-bottom: 12px;
}

.cert-apply-card__title {
    font-family: var(--cert-font-serif);
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.2;
    margin: 0 0 6px;
    color: var(--color-text-primary);
}

.cert-apply-card__subtitle {
    font-size: 12.5px;
    line-height: 1.55;
    color: var(--cert-text-secondary);
    margin: 0;
}

.cert-apply-form .cert-form-group {
    margin-bottom: 11px;
}

.cert-apply-form .cert-form-group label {
    font-size: 9.5px;
    letter-spacing: 0.14em;
    margin-bottom: 5px;
}

.cert-apply-form input,
.cert-apply-form select {
    width: 100%;
    background: rgba(0,0,0,0.35);
    border: 1px solid var(--cert-border-subtle);
    border-radius: 5px;
    padding: 10px 12px;
    color: var(--color-text-primary);
    font-family: inherit;
    font-size: 13.5px;
    line-height: 1.3;
    transition: border-color 0.18s, background 0.18s, box-shadow 0.18s;
    box-sizing: border-box;
    appearance: none;
}

.cert-apply-form select {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'><path d='M2 3.5l3 3 3-3' stroke='%2300ebff' stroke-width='1.2' fill='none' stroke-linecap='round'/></svg>");
    background-repeat: no-repeat;
    background-position: right 12px center;
    padding-right: 32px;
}

.cert-apply-form input:hover,
.cert-apply-form select:hover {
    border-color: rgba(255,255,255,0.20);
}

.cert-apply-form input:focus,
.cert-apply-form select:focus {
    outline: none;
    border-color: var(--cert-cells);
    background: rgba(0,0,0,0.45);
    box-shadow: 0 0 0 3px rgba(0,235,255,0.10);
}

.cert-apply-form input::placeholder {
    color: var(--cert-text-disabled);
}

.cert-apply-form .cert-btn {
    margin-top: 8px;
    padding: 12px 22px;
    font-size: 13.5px;
    border-radius: 5px;
    letter-spacing: 0.01em;
    transition: opacity 0.18s, transform 0.18s, box-shadow 0.18s;
}

.cert-apply-form .cert-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 18px -6px rgba(0,235,255,0.35);
}

.cert-apply-card__foot {
    margin: 12px 0 0;
    font-size: 11.5px;
    color: var(--cert-text-tertiary);
    text-align: center;
}

.cert-apply-card__foot a {
    color: var(--cert-cells);
    text-decoration: none;
}

.cert-apply-card__foot a:hover {
    text-decoration: underline;
}

/* On narrower desktops keep the 1/3 feel but shrink the card so the
   left body copy still breathes. */
@media (max-width: 1100px) {
    .cert-hero__apply {
        max-width: 320px;
        min-width: 260px;
    }
    .cert-apply-card {
        padding: 22px 22px 20px;
    }
}

@media (max-width: 960px) {
    .cert-hero--split {
        flex-direction: column;
        align-items: stretch;
    }
    .cert-hero__apply {
        flex: 0 0 auto;
        max-width: 480px;
        min-width: 0;
        width: 100%;
        align-self: flex-start;
    }
}

/* ══════════════════════════════════════════════════
   TEACHING METHODOLOGY
   ══════════════════════════════════════════════════ */

.cert-methodology {
    padding: 0 48px var(--cert-section-gap);
    max-width: var(--cert-max-w);
    margin: 0 auto;
}

.cert-methodology__lede {
    font-size: 16px;
    line-height: 1.75;
    color: var(--cert-text-secondary);
    max-width: 760px;
    margin: -24px 0 48px;
}

.cert-methodology__lede strong {
    color: var(--color-text-primary);
    font-weight: 600;
}

.cert-methodology__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

.cert-method-card {
    position: relative;
    background: var(--cert-bg-surface);
    border: 1px solid var(--cert-border-subtle);
    border-radius: 4px;
    padding: 28px;
    transition: border-color 0.2s, transform 0.2s;
}

.cert-method-card:hover {
    border-color: var(--cert-border-mid);
    transform: translateY(-2px);
}

.cert-method-card--featured {
    background:
        linear-gradient(180deg, rgba(0,235,255,0.05) 0%, rgba(255,255,255,0.02) 100%),
        var(--cert-bg-elevated);
    border-color: rgba(0,235,255,0.35);
}

.cert-method-card--featured:hover {
    border-color: var(--cert-cells);
}

.cert-method-card__badge {
    position: absolute;
    top: 14px;
    right: 14px;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #000;
    background: var(--cert-cells);
    padding: 3px 8px;
    border-radius: 2px;
}

.cert-method-card__icon {
    width: 44px;
    height: 44px;
    border-radius: 6px;
    background: rgba(0,235,255,0.08);
    color: var(--cert-cells);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 18px;
}

.cert-method-card--featured .cert-method-card__icon {
    background: rgba(0,235,255,0.14);
}

.cert-method-card h3 {
    font-family: var(--cert-font-serif);
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -0.02em;
    margin: 0 0 10px;
    color: var(--color-text-primary);
}

.cert-method-card p {
    font-size: 13.5px;
    line-height: 1.7;
    color: var(--cert-text-secondary);
    margin: 0;
}

/* ══════════════════════════════════════════════════
   AI-DRIVEN LABS SHOWCASE
   ══════════════════════════════════════════════════ */

.cert-ailabs {
    position: relative;
    padding: 0 48px var(--cert-section-gap);
    max-width: var(--cert-max-w);
    margin: 0 auto;
    overflow: hidden;
}

.cert-ailabs__glow {
    position: absolute;
    top: 10%;
    right: -10%;
    width: 620px;
    height: 620px;
    background: radial-gradient(circle at center, rgba(0,235,255,0.10) 0%, rgba(167,139,250,0.06) 40%, transparent 70%);
    pointer-events: none;
    z-index: 0;
}

.cert-ailabs__inner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 56px;
    align-items: center;
}

.cert-ailabs__copy h2 {
    margin-bottom: 24px;
}

.cert-ailabs__lede {
    font-size: 16px;
    line-height: 1.75;
    color: var(--cert-text-secondary);
    margin: 0 0 28px;
}

.cert-ailabs__points {
    list-style: none;
    padding: 0;
    margin: 0 0 32px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.cert-ailabs__points li {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    font-size: 14px;
    line-height: 1.65;
    color: var(--cert-text-secondary);
}

.cert-ailabs__points li strong {
    color: var(--color-text-primary);
    font-weight: 600;
}

.cert-ailabs__tick {
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: rgba(0,235,255,0.12);
    color: var(--cert-cells);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 1px;
}

.cert-ailabs__stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-top: 28px;
    padding-top: 28px;
    border-top: 1px solid var(--cert-border-subtle);
}

.cert-ailabs__stats > div {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 16px 18px;
    background: rgba(0, 235, 255, 0.04);
    border: 1px solid rgba(0, 235, 255, 0.14);
    border-left: 3px solid var(--cert-cells);
    border-radius: 8px;
}

.cert-ailabs__stat-num {
    font-family: var(--cert-font-serif);
    font-size: 38px;
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1;
    color: var(--cert-cells);
}

.cert-ailabs__stat-label {
    font-size: 11px;
    color: var(--cert-text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    line-height: 1.4;
}

/* ── GENERATIVE LABS SHOWCASE ── */
.cert-ailabs-gen {
    position: relative;
    padding: 80px 64px;
    background:
        radial-gradient(ellipse at 20% 0%, rgba(167, 139, 250, 0.08), transparent 55%),
        linear-gradient(180deg, #0b0f16 0%, #090c12 100%);
    border-top: 1px solid var(--cert-border-subtle);
    border-bottom: 1px solid var(--cert-border-subtle);
    overflow: hidden;
}

.cert-ailabs-gen__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    max-width: 1240px;
    margin: 0 auto;
    align-items: center;
}

.cert-ailabs-gen__copy h2 {
    font-family: var(--cert-font-serif);
    font-size: 44px;
    line-height: 1.1;
    letter-spacing: -0.02em;
    margin: 12px 0 20px;
}

.cert-ailabs-gen__lede {
    color: var(--cert-text-secondary);
    font-size: 17px;
    line-height: 1.6;
    margin-bottom: 26px;
}

.cert-ailabs-gen__points {
    list-style: none;
    padding: 0;
    margin: 0 0 32px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.cert-ailabs-gen__points li {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    color: var(--cert-text-secondary);
    line-height: 1.55;
    font-size: 15px;
}

.cert-ailabs-gen__points li strong {
    color: #fff;
    font-weight: 600;
}

.cert-ailabs-gen__tick {
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: rgba(167, 139, 250, 0.16);
    border: 1px solid rgba(167, 139, 250, 0.38);
    color: #c4b5fd;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 2px;
}

/* Design-system mock (right column) */
.cert-ailabs-gen__mock {
    background: #0a0e14;
    border: 1px solid var(--cert-border-subtle);
    border-radius: 10px;
    overflow: hidden;
    box-shadow:
        0 30px 60px -20px rgba(0, 0, 0, 0.6),
        0 0 0 1px rgba(167, 139, 250, 0.08) inset;
}

.cert-ds-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 18px;
    background: rgba(255, 255, 255, 0.03);
    border-bottom: 1px solid var(--cert-border-subtle);
    font-size: 12px;
}

.cert-ds-head__title {
    color: #fff;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
}

.cert-ds-head__badge {
    background: rgba(167, 139, 250, 0.16);
    color: #c4b5fd;
    border: 1px solid rgba(167, 139, 250, 0.32);
    padding: 3px 8px;
    border-radius: 4px;
    font-size: 10px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.cert-ds-head__meta {
    color: var(--cert-text-tertiary);
    font-family: var(--cert-font-mono, 'SFMono-Regular', Menlo, monospace);
    font-size: 11px;
}

.cert-ds-body {
    padding: 20px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.cert-ds-block {
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid var(--cert-border-subtle);
    border-radius: 6px;
    padding: 14px;
}

.cert-ds-block__title {
    font-size: 10px;
    color: var(--cert-text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 10px;
}

.cert-ds-swatches {
    display: flex;
    gap: 6px;
}

.cert-ds-swatch {
    flex: 1;
    height: 28px;
    border-radius: 4px;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.cert-ds-type {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.cert-ds-type__lg {
    font-family: var(--cert-font-serif);
    font-size: 20px;
    color: #fff;
    line-height: 1;
}

.cert-ds-type__md {
    font-size: 13px;
    color: var(--cert-text-secondary);
    line-height: 1.2;
}

.cert-ds-type__sm {
    font-size: 11px;
    color: var(--cert-text-tertiary);
    line-height: 1.2;
}

.cert-ds-scale {
    display: flex;
    align-items: flex-end;
    gap: 4px;
    height: 36px;
}

.cert-ds-scale > span {
    flex: 1;
    background: linear-gradient(180deg, #a78bfa, rgba(167, 139, 250, 0.2));
    border-radius: 2px;
}

.cert-ds-command {
    display: flex;
    gap: 8px;
    align-items: center;
    padding: 10px 12px;
    background: rgba(0, 0, 0, 0.35);
    border: 1px solid var(--cert-border-subtle);
    border-radius: 6px;
    font-family: var(--cert-font-mono, monospace);
    font-size: 12px;
    color: #e5e7eb;
}

.cert-ds-command__prompt {
    color: #a78bfa;
}

.cert-ds-result {
    padding: 16px 20px;
    border-top: 1px solid var(--cert-border-subtle);
    background: rgba(167, 139, 250, 0.04);
}

.cert-ds-result__head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 12px;
}

.cert-ds-result__status {
    color: #4ade80;
    font-weight: 600;
    font-size: 14px;
}

.cert-ds-result__score {
    font-family: var(--cert-font-serif);
    font-size: 22px;
    font-weight: 700;
    color: #fff;
}

.cert-ds-result__next {
    font-size: 12px;
    color: var(--cert-text-tertiary);
    line-height: 1.5;
}

.cert-ds-result__next strong {
    color: #c4b5fd;
    font-weight: 600;
    display: block;
    margin-bottom: 4px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 10px;
}

/* ── SPECIALIZED PROGRAMS ── */
.cert-programs {
    padding: 80px 64px;
    max-width: 1240px;
    margin: 0 auto;
}

.cert-programs__head {
    text-align: center;
    margin-bottom: 44px;
}

.cert-programs__head h2 {
    font-family: var(--cert-font-serif);
    font-size: 44px;
    letter-spacing: -0.02em;
    margin: 12px 0 16px;
}

.cert-programs__lede {
    color: var(--cert-text-secondary);
    max-width: 720px;
    margin: 0 auto;
    line-height: 1.6;
}

.cert-programs__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
}

.cert-program-card {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(255, 255, 255, 0.005));
    border: 1px solid var(--cert-border-subtle);
    border-radius: 12px;
    padding: 28px;
    display: flex;
    flex-direction: column;
    transition: border-color 0.15s ease, transform 0.15s ease;
}

.cert-program-card:hover {
    border-color: rgba(0, 235, 255, 0.28);
    transform: translateY(-2px);
}

.cert-program-card--series {
    grid-column: span 2;
}

.cert-program-card__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--cert-cells);
    font-weight: 600;
    margin-bottom: 10px;
}

.cert-program-card__pill {
    background: rgba(0, 235, 255, 0.1);
    border: 1px solid rgba(0, 235, 255, 0.28);
    color: var(--cert-cells);
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 10px;
    letter-spacing: 0.06em;
}

.cert-program-card__pill--series {
    background: rgba(167, 139, 250, 0.1);
    border-color: rgba(167, 139, 250, 0.32);
    color: #c4b5fd;
}

.cert-program-card h3 {
    font-family: var(--cert-font-serif);
    font-size: 26px;
    letter-spacing: -0.015em;
    margin: 0 0 12px;
    line-height: 1.2;
}

.cert-program-card__desc {
    color: var(--cert-text-secondary);
    font-size: 15px;
    line-height: 1.6;
    margin: 0 0 20px;
}

.cert-program-card__subs {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    margin: 4px 0 20px;
}

.cert-program-card__sub {
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid var(--cert-border-subtle);
    border-left: 2px solid rgba(167, 139, 250, 0.5);
    border-radius: 6px;
    padding: 12px 14px;
}

.cert-program-card__sub-label {
    font-size: 10px;
    color: var(--cert-text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 4px;
}

.cert-program-card__sub-title {
    font-size: 14px;
    color: #fff;
    font-weight: 600;
    line-height: 1.3;
}

.cert-program-card__sub-desc {
    font-size: 12px;
    color: var(--cert-text-tertiary);
    line-height: 1.45;
    margin-top: 4px;
}

.cert-program-card__industries {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 4px 0 20px;
}

.cert-program-card__industry {
    background: rgba(0, 235, 255, 0.06);
    border: 1px solid rgba(0, 235, 255, 0.2);
    color: #67e8f9;
    padding: 6px 12px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 500;
}

.cert-program-card__industry--more {
    background: transparent;
    border-style: dashed;
    color: var(--cert-text-tertiary);
}

.cert-program-card__foot {
    margin-top: auto;
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
}

.cert-program-card__meta {
    font-size: 12px;
    color: var(--cert-text-tertiary);
}

/* ── FEATURED / INCLUDED CALLOUT ──
   Amber-accented panel used for free add-on certifications (e.g. Monetization
   Master now lives inside /certification/path/cells). Promoted from inline
   brrain-skills scoped CSS into the shared cert stylesheet so any path can
   render the same treatment. */
.bs-featured {
    padding: 2rem;
    border: 1px solid rgba(200, 162, 71, 0.4);
    border-radius: var(--radius-lg, 12px);
    background: rgba(200, 162, 71, 0.05);
    margin: 2rem 0;
}

.bs-featured__badge {
    display: inline-block;
    padding: 4px 12px;
    background: #c8a247;
    color: #000;
    font-weight: 700;
    border-radius: 999px;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.bs-featured__title {
    font-family: var(--cert-font-serif, Georgia, serif);
    font-size: 28px;
    margin: 1rem 0 0.75rem;
    color: #c8a247;
    letter-spacing: -0.02em;
}

.bs-featured__list {
    list-style: none;
    padding: 0;
    margin: 1rem 0 0;
    display: grid;
    gap: 6px;
}

.bs-featured__list li {
    padding: 10px 14px;
    background: var(--color-surface-2, #0f1219);
    border-radius: var(--radius-sm, 4px);
    font-size: 14px;
    color: var(--color-text-secondary, #b4b9c7);
}

.bs-featured__list li::before {
    content: "\2192  ";
    color: var(--color-accent-cyan, #00ebff);
    font-weight: 600;
}

/* ── bR2bR COMPLIANCE OFFICERS ── */
.cert-compliance {
    padding: 80px 64px;
    background:
        radial-gradient(ellipse at 80% 0%, rgba(74, 222, 128, 0.06), transparent 55%),
        linear-gradient(180deg, #090c12 0%, #0b0f16 100%);
    border-top: 1px solid var(--cert-border-subtle);
    border-bottom: 1px solid var(--cert-border-subtle);
}

.cert-compliance__inner {
    max-width: 1240px;
    margin: 0 auto;
}

.cert-compliance__head {
    text-align: center;
    margin-bottom: 36px;
}

.cert-compliance__head h2 {
    font-family: var(--cert-font-serif);
    font-size: 44px;
    letter-spacing: -0.02em;
    margin: 12px 0 16px;
}

.cert-compliance__lede {
    color: var(--cert-text-secondary);
    max-width: 760px;
    margin: 0 auto;
    line-height: 1.65;
}

.cert-compliance__lede em {
    color: #86efac;
    font-style: normal;
    font-weight: 600;
}

/* bR2bR flow diagram — shows customer → session → auditor → report. */
.cert-compliance__flow {
    margin: 36px auto 48px;
    max-width: 980px;
    background: rgba(74, 222, 128, 0.04);
    border: 1px solid rgba(74, 222, 128, 0.22);
    border-radius: 12px;
    padding: 26px 20px;
    display: grid;
    grid-template-columns: 1fr auto 1fr auto 1fr;
    gap: 16px;
    align-items: center;
}

.cert-compliance__node {
    text-align: center;
    padding: 14px 16px;
    background: #0a0e14;
    border: 1px solid var(--cert-border-subtle);
    border-radius: 8px;
}

.cert-compliance__node--you {
    border-left: 3px solid var(--cert-cells);
}

.cert-compliance__node--auditor {
    border-left: 3px solid #4ade80;
}

.cert-compliance__node--report {
    border-left: 3px solid #a78bfa;
}

.cert-compliance__node-label {
    font-size: 10px;
    color: var(--cert-text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-bottom: 6px;
}

.cert-compliance__node-title {
    font-size: 14px;
    color: #fff;
    font-weight: 600;
    line-height: 1.25;
}

.cert-compliance__node-sub {
    font-size: 11px;
    color: var(--cert-text-tertiary);
    margin-top: 4px;
    line-height: 1.4;
}

.cert-compliance__arrow {
    color: #4ade80;
    font-size: 18px;
    line-height: 1;
    font-weight: 700;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
}

.cert-compliance__arrow-label {
    font-size: 9px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #86efac;
    font-weight: 600;
}

/* Industry grid */
.cert-compliance__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    margin-top: 8px;
}

.cert-compliance-card {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(255, 255, 255, 0.005));
    border: 1px solid var(--cert-border-subtle);
    border-left: 3px solid #4ade80;
    border-radius: 10px;
    padding: 24px;
    transition: border-color 0.15s ease, transform 0.15s ease;
}

.cert-compliance-card:hover {
    border-color: rgba(74, 222, 128, 0.35);
    transform: translateY(-2px);
}

.cert-compliance-card__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #86efac;
    font-weight: 600;
    margin-bottom: 8px;
}

.cert-compliance-card__pill {
    background: rgba(74, 222, 128, 0.1);
    border: 1px solid rgba(74, 222, 128, 0.3);
    color: #86efac;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 10px;
    letter-spacing: 0.06em;
}

.cert-compliance-card h3 {
    font-family: var(--cert-font-serif);
    font-size: 24px;
    letter-spacing: -0.015em;
    margin: 0 0 10px;
    line-height: 1.2;
}

.cert-compliance-card__desc {
    color: var(--cert-text-secondary);
    font-size: 14px;
    line-height: 1.6;
    margin: 0 0 14px;
}

.cert-compliance-card__frameworks {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 12px 0 16px;
}

.cert-compliance-card__fw {
    background: rgba(74, 222, 128, 0.08);
    border: 1px solid rgba(74, 222, 128, 0.22);
    color: #86efac;
    padding: 3px 10px;
    border-radius: 4px;
    font-size: 11px;
    font-family: var(--cert-font-mono, 'SFMono-Regular', Menlo, monospace);
    font-weight: 500;
}

.cert-compliance-card__meta {
    font-size: 12px;
    color: var(--cert-text-tertiary);
    margin-top: 8px;
}

.cert-compliance__foot {
    text-align: center;
    margin-top: 36px;
    color: var(--cert-text-tertiary);
    font-size: 13px;
}

@media (max-width: 960px) {
    .cert-compliance {
        padding-left: 24px;
        padding-right: 24px;
    }
    .cert-compliance__flow {
        grid-template-columns: 1fr;
        grid-auto-rows: auto;
    }
    .cert-compliance__arrow {
        transform: rotate(90deg);
        justify-content: center;
        flex-direction: row;
        gap: 8px;
    }
    .cert-compliance__grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .cert-compliance__head h2 {
        font-size: 32px;
    }
}

/* ── LAB CHAT MOCKUP ── */
.cert-ailabs__mockup {
    position: relative;
    background: #0a0e14;
    border: 1px solid var(--cert-border-subtle);
    border-radius: 10px;
    overflow: hidden;
    box-shadow:
        0 30px 60px -20px rgba(0,0,0,0.6),
        0 0 0 1px rgba(0,235,255,0.08) inset;
}

.cert-lab-chrome {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 10px 14px;
    background: rgba(255,255,255,0.03);
    border-bottom: 1px solid var(--cert-border-subtle);
}

.cert-lab-chrome__dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: rgba(255,255,255,0.14);
}

.cert-lab-chrome__dot:nth-child(1) { background: #ff5f56; }
.cert-lab-chrome__dot:nth-child(2) { background: #ffbd2e; }
.cert-lab-chrome__dot:nth-child(3) { background: #27c93f; }

.cert-lab-chrome__url {
    margin-left: 10px;
    font-family: var(--cert-font-mono);
    font-size: 11px;
    color: var(--cert-text-tertiary);
    letter-spacing: 0.02em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cert-lab-header {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    padding: 18px 22px;
    border-bottom: 1px solid var(--cert-border-subtle);
    background: rgba(0,235,255,0.025);
}

.cert-lab-badge {
    flex-shrink: 0;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.16em;
    color: #000;
    background: var(--cert-cells);
    padding: 4px 8px;
    border-radius: 2px;
    align-self: center;
}

.cert-lab-header h3 {
    font-family: var(--cert-font-serif);
    font-size: 16px;
    font-weight: 700;
    margin: 0 0 2px;
    color: var(--color-text-primary);
}

.cert-lab-header p {
    font-size: 12px;
    color: var(--cert-text-tertiary);
    margin: 0;
}

.cert-lab-log {
    padding: 20px 22px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-height: 340px;
    overflow: hidden;
    position: relative;
}

.cert-lab-log::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 40px;
    background: linear-gradient(180deg, transparent, #0a0e14);
    pointer-events: none;
}

.cert-lab-msg {
    max-width: 85%;
    padding: 11px 14px;
    border-radius: 10px;
    font-size: 13px;
    line-height: 1.55;
}

.cert-lab-msg--assistant {
    align-self: flex-start;
    background: rgba(255,255,255,0.04);
    border: 1px solid var(--cert-border-subtle);
    color: var(--cert-text-secondary);
    border-top-left-radius: 2px;
}

.cert-lab-msg--assistant em {
    color: var(--cert-text-tertiary);
    font-style: italic;
}

.cert-lab-msg--user {
    align-self: flex-end;
    background: rgba(0,235,255,0.10);
    border: 1px solid rgba(0,235,255,0.25);
    color: var(--color-text-primary);
    border-top-right-radius: 2px;
}

.cert-lab-typing {
    align-self: flex-start;
    display: inline-flex;
    gap: 4px;
    padding: 10px 12px;
    background: rgba(255,255,255,0.04);
    border: 1px solid var(--cert-border-subtle);
    border-radius: 10px;
    border-top-left-radius: 2px;
}

.cert-lab-typing span {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--cert-cells);
    opacity: 0.4;
    animation: certLabTyping 1.2s infinite ease-in-out;
}

.cert-lab-typing span:nth-child(2) { animation-delay: 0.15s; }
.cert-lab-typing span:nth-child(3) { animation-delay: 0.30s; }

@keyframes certLabTyping {
    0%, 60%, 100% { opacity: 0.25; transform: translateY(0); }
    30%           { opacity: 1;    transform: translateY(-3px); }
}

.cert-lab-result {
    border-top: 1px solid var(--cert-border-subtle);
    background: rgba(0,0,0,0.3);
    padding: 18px 22px;
}

.cert-lab-result__head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 14px;
}

.cert-lab-result__status {
    font-size: 12px;
    font-weight: 600;
    color: var(--cert-care);
    letter-spacing: 0.04em;
}

.cert-lab-result__score {
    font-family: var(--cert-font-serif);
    font-size: 26px;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--color-text-primary);
}

.cert-lab-result__rows {
    display: flex;
    flex-direction: column;
    gap: 9px;
}

.cert-lab-result__rows > div {
    display: grid;
    grid-template-columns: 160px 1fr;
    gap: 14px;
    align-items: center;
    font-size: 11.5px;
    color: var(--cert-text-secondary);
}

.cert-lab-bar {
    display: block;
    height: 6px;
    background: rgba(255,255,255,0.06);
    border-radius: 3px;
    overflow: hidden;
}

.cert-lab-bar > span {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, var(--cert-cells), #a78bfa);
    border-radius: 3px;
}

/* ── AI LABS + METHODOLOGY — RESPONSIVE ── */
@media (max-width: 960px) {
    .cert-methodology__grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .cert-ailabs__inner {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    .cert-ailabs__glow {
        width: 400px;
        height: 400px;
    }
}

@media (max-width: 768px) {
    .cert-methodology,
    .cert-ailabs {
        padding-left: 24px;
        padding-right: 24px;
    }
    .cert-methodology__grid {
        grid-template-columns: 1fr;
    }
    .cert-methodology__lede {
        margin-top: 0;
    }
    .cert-ailabs__stats {
        grid-template-columns: 1fr;
        gap: 14px;
    }
    .cert-lab-result__rows > div {
        grid-template-columns: 130px 1fr;
    }
    .cert-apply-card {
        padding: 24px;
    }
}

@media (max-width: 480px) {
    .cert-methodology,
    .cert-ailabs {
        padding-left: 16px;
        padding-right: 16px;
    }
    .cert-lab-result__rows > div {
        grid-template-columns: 110px 1fr;
        font-size: 11px;
    }
    .cert-lab-chrome__url {
        font-size: 10px;
    }
}

/* ── GENERATIVE LABS + PROGRAMS — RESPONSIVE ── */
@media (max-width: 960px) {
    .cert-ailabs-gen,
    .cert-programs {
        padding-left: 24px;
        padding-right: 24px;
    }
    .cert-ailabs-gen__inner {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    .cert-programs__grid {
        grid-template-columns: 1fr;
    }
    .cert-program-card--series {
        grid-column: auto;
    }
}

@media (max-width: 640px) {
    .cert-ailabs-gen__copy h2,
    .cert-programs__head h2 {
        font-size: 32px;
    }
    .cert-ds-body {
        grid-template-columns: 1fr;
    }
    .cert-program-card__subs {
        grid-template-columns: 1fr;
    }
    .cert-ailabs__stats {
        grid-template-columns: 1fr;
    }
}