/* ── Page hero ── */
    .page-hero {
      margin-top: var(--header-h);
      background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);
      padding: var(--space-16) 0 var(--space-12);
      position: relative;
      overflow: hidden;
    }
    .page-hero::before {
      content: '';
      position: absolute;
      inset: 0;
      background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    }
    .page-hero__inner { position: relative; z-index: 1; }

    .breadcrumb {
      display: flex;
      align-items: center;
      gap: var(--space-2);
      font-size: var(--text-sm);
      color: rgba(255,255,255,0.65);
      margin-bottom: var(--space-6);
      flex-wrap: wrap;
    }
    .breadcrumb a { color: rgba(255,255,255,0.65); transition: color var(--transition-fast); }
    .breadcrumb a:hover { color: var(--clr-white); }
    .breadcrumb__sep { color: rgba(255,255,255,0.35); }
    .breadcrumb__current { color: rgba(255,255,255,0.90); font-weight: 500; }

    .page-hero__tag {
      display: inline-block;
      background: rgba(255,255,255,0.12);
      color: var(--clr-white);
      font-size: var(--text-xs);
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.1em;
      padding: var(--space-1) var(--space-3);
      border-radius: var(--radius-full);
      margin-bottom: var(--space-4);
      border: 1px solid rgba(255,255,255,0.18);
    }
    .page-hero__title {
      font-size: clamp(var(--text-3xl), 5vw, var(--text-5xl));
      font-weight: 800;
      color: var(--clr-white);
      letter-spacing: -0.02em;
      line-height: 1.15;
      margin-bottom: var(--space-4);
    }
    .page-hero__desc {
      font-size: clamp(var(--text-base), 2vw, var(--text-lg));
      color: rgba(255,255,255,0.78);
      max-width: 580px;
      line-height: 1.7;
      margin-bottom: var(--space-8);
    }
    .page-hero__actions { display: flex; flex-wrap: wrap; gap: var(--space-3); }

    /* ── Topics nav ── */
    .topics-nav {
      background: var(--clr-white);
      border-bottom: 1px solid var(--clr-border);
      position: sticky;
      top: var(--header-h);
      z-index: 90;
      box-shadow: var(--shadow-sm);
    }
    .topics-nav__inner {
      display: flex;
      gap: var(--space-2);
      overflow-x: auto;
      scrollbar-width: none;
      padding: var(--space-3) 0;
      -webkit-overflow-scrolling: touch;
    }
    .topics-nav__inner::-webkit-scrollbar { display: none; }
    .topic-pill {
      display: inline-flex;
      align-items: center;
      gap: var(--space-2);
      padding: var(--space-2) var(--space-4);
      font-size: var(--text-sm);
      font-weight: 500;
      color: var(--clr-muted);
      background: var(--clr-bg);
      border: 1px solid var(--clr-border);
      border-radius: var(--radius-full);
      white-space: nowrap;
      transition: background var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast);
      text-decoration: none;
      flex-shrink: 0;
    }
    .topic-pill:hover, .topic-pill.is-active {
      background: var(--clr-primary);
      color: var(--clr-white);
      border-color: var(--clr-primary);
    }

    /* ── Course block ── */
    .course-block {
      scroll-margin-top: calc(var(--header-h) + 56px);
    }

    .course-hero {
      display: flex;
      flex-direction: column;
      gap: var(--space-8);
    }
    @media (min-width: 900px) {
      .course-hero { flex-direction: row; align-items: flex-start; gap: var(--space-12); }
      .course-hero__content { flex: 1; }
      .course-hero__card { flex-shrink: 0; width: 300px; }
    }

    /* ── Course header band ── */
    .course-band {
      display: inline-flex;
      align-items: center;
      gap: var(--space-3);
      border-radius: var(--radius-xl);
      padding: var(--space-3) var(--space-5);
      margin-bottom: var(--space-5);
      font-weight: 800;
      font-size: var(--text-xl);
      color: var(--clr-white);
    }
    .course-band--cap     { background: linear-gradient(135deg, #1a56db, #3b82f6); }
    .course-band--adr     { background: linear-gradient(135deg, #dc2626, #f87171); }
    .course-band--moto    { background: linear-gradient(135deg, #7c3aed, #a78bfa); }
    .course-band--puntos  { background: linear-gradient(135deg, #f97316, #fb923c); }
    .course-band--maquina { background: linear-gradient(135deg, #16a34a, #4ade80); }
    .course-band--otros   { background: linear-gradient(135deg, #0d9488, #2dd4bf); }

    .course-title {
      font-size: clamp(var(--text-2xl), 3.5vw, var(--text-4xl));
      font-weight: 800;
      color: var(--clr-dark);
      letter-spacing: -0.02em;
      line-height: 1.2;
      margin-bottom: var(--space-4);
    }
    .course-lead {
      font-size: var(--text-lg);
      color: var(--clr-muted);
      line-height: 1.75;
      margin-bottom: var(--space-6);
    }
    .course-body {
      font-size: var(--text-base);
      color: var(--clr-muted);
      line-height: 1.8;
    }
    .course-body p { margin-bottom: var(--space-4); }
    .course-body p:last-child { margin-bottom: 0; }
    .course-body strong { color: var(--clr-dark); font-weight: 600; }

    /* ── Summary card ── */
    .summary-card {
      background: var(--clr-white);
      border: 1px solid var(--clr-border);
      border-radius: var(--radius-xl);
      overflow: hidden;
      box-shadow: var(--shadow);
    }
    .summary-card__header {
      padding: var(--space-5) var(--space-6);
      font-size: var(--text-sm);
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      color: var(--clr-white);
    }
    .summary-card__header--cap     { background: linear-gradient(135deg, #1a56db, #3b82f6); }
    .summary-card__header--adr     { background: linear-gradient(135deg, #dc2626, #f87171); }
    .summary-card__header--moto    { background: linear-gradient(135deg, #7c3aed, #a78bfa); }
    .summary-card__header--puntos  { background: linear-gradient(135deg, #f97316, #fb923c); }
    .summary-card__header--maquina { background: linear-gradient(135deg, #16a34a, #4ade80); }
    .summary-card__header--otros   { background: linear-gradient(135deg, #0d9488, #2dd4bf); }

    .summary-card__body { padding: var(--space-5) var(--space-6); }
    .summary-row {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      gap: var(--space-3);
      padding: var(--space-3) 0;
      border-bottom: 1px solid var(--clr-border);
      font-size: var(--text-sm);
    }
    .summary-row:last-child { border-bottom: none; padding-bottom: 0; }
    .summary-row__label { color: var(--clr-muted); font-weight: 500; flex-shrink: 0; }
    .summary-row__value { color: var(--clr-dark); font-weight: 600; text-align: right; }
    .summary-card__cta { padding: 0 var(--space-6) var(--space-6); }
    .summary-card__cta .btn { width: 100%; text-align: center; }

    /* ── Highlight box ── */
    .highlight-box {
      background: var(--clr-primary-light);
      border-left: 4px solid var(--clr-primary);
      border-radius: 0 var(--radius) var(--radius) 0;
      padding: var(--space-5) var(--space-6);
      margin: var(--space-6) 0;
      font-size: var(--text-sm);
      color: var(--clr-text);
      line-height: 1.7;
    }
    .highlight-box strong { display: block; font-size: var(--text-base); font-weight: 700; color: var(--clr-primary); margin-bottom: var(--space-2); }
    .highlight-box--warning { background: #fff8e8; border-left-color: var(--clr-accent); }
    .highlight-box--warning strong { color: var(--clr-accent-dark); }
    .highlight-box--green { background: #e8f5e9; border-left-color: var(--clr-green); }
    .highlight-box--green strong { color: var(--clr-green); }

    /* ── Step list ── */
    .step-list { display: flex; flex-direction: column; gap: var(--space-4); margin: var(--space-6) 0; }
    .step-item { display: flex; gap: var(--space-4); align-items: flex-start; }
    .step-item__num {
      width: 32px; height: 32px;
      border-radius: var(--radius-full);
      background: var(--clr-primary);
      color: var(--clr-white);
      font-size: var(--text-sm); font-weight: 700;
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0; margin-top: 2px;
    }
    .step-item__text { font-size: var(--text-sm); color: var(--clr-muted); line-height: 1.7; }
    .step-item__text strong { display: block; color: var(--clr-dark); font-weight: 600; margin-bottom: 2px; }

    /* ── Module grid (CAP) ── */
    .module-grid {
      display: grid;
      grid-template-columns: 1fr;
      gap: var(--space-3);
      margin: var(--space-5) 0;
    }
    @media (min-width: 640px) { .module-grid { grid-template-columns: repeat(2, 1fr); } }

    .module-item {
      display: flex;
      align-items: flex-start;
      gap: var(--space-3);
      background: var(--clr-white);
      border: 1px solid var(--clr-border);
      border-radius: var(--radius);
      padding: var(--space-4);
    }
    .module-item__icon {
      width: 36px; height: 36px;
      border-radius: var(--radius-sm);
      background: var(--clr-primary-light);
      color: var(--clr-primary);
      font-size: 1.1rem;
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }
    .module-item__text { font-size: var(--text-sm); color: var(--clr-muted); line-height: 1.55; }
    .module-item__text strong { display: block; color: var(--clr-dark); font-weight: 600; margin-bottom: 1px; }

    /* ── ADR classes table ── */
    .table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: var(--radius-lg); margin: var(--space-6) 0; }
    .info-table { width: 100%; border-collapse: collapse; font-size: var(--text-sm); border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-sm); }
    .info-table thead { background: var(--clr-primary); color: var(--clr-white); }
    .info-table th { padding: var(--space-3) var(--space-4); text-align: left; font-weight: 600; font-size: var(--text-xs); text-transform: uppercase; letter-spacing: 0.06em; }
    .info-table td { padding: var(--space-3) var(--space-4); border-bottom: 1px solid var(--clr-border); color: var(--clr-text); vertical-align: top; }
    .info-table tbody tr:last-child td { border-bottom: none; }
    .info-table tbody tr:nth-child(even) { background: var(--clr-bg); }
    .info-table tbody tr:hover { background: var(--clr-primary-light); }

    /* ── Other courses mini-grid ── */
    .other-grid {
      display: grid;
      grid-template-columns: 1fr;
      gap: var(--space-4);
      margin: var(--space-6) 0;
    }
    @media (min-width: 640px) { .other-grid { grid-template-columns: repeat(2, 1fr); } }
    @media (min-width: 1024px) { .other-grid { grid-template-columns: repeat(3, 1fr); } }

    .other-card {
      background: var(--clr-white);
      border: 1px solid var(--clr-border);
      border-radius: var(--radius-lg);
      padding: var(--space-6);
      transition: box-shadow var(--transition), transform var(--transition);
    }
    .other-card:hover { box-shadow: var(--shadow-lg); transform: translateY(-2px); }
    .other-card__icon { font-size: 2rem; margin-bottom: var(--space-3); }
    .other-card__title { font-size: var(--text-base); font-weight: 700; color: var(--clr-dark); margin-bottom: var(--space-2); }
    .other-card__desc { font-size: var(--text-sm); color: var(--clr-muted); line-height: 1.6; }

    /* ── Block divider ── */
    .block-divider { height: 1px; background: var(--clr-border); margin: var(--space-16) 0; }

    /* ── CTA section ── */
    .cta-section {
      background: linear-gradient(135deg, var(--clr-primary) 0%, var(--clr-primary-dark) 100%);
      border-radius: var(--radius-xl);
      padding: var(--space-12) var(--space-8);
      text-align: center;
      color: var(--clr-white);
      position: relative;
      overflow: hidden;
    }
    .cta-section::before {
      content: '';
      position: absolute;
      inset: 0;
      background: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Cpath d='M0 40L40 0H20L0 20M40 40V20L20 40'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    }
    .cta-section > * { position: relative; z-index: 1; }
    .cta-section__icon { font-size: 3rem; margin-bottom: var(--space-4); }
    .cta-section__title { font-size: clamp(var(--text-2xl), 4vw, var(--text-3xl)); font-weight: 800; letter-spacing: -0.02em; margin-bottom: var(--space-3); }
    .cta-section__desc { color: rgba(255,255,255,0.82); font-size: var(--text-base); max-width: 480px; margin-inline: auto; line-height: 1.7; margin-bottom: var(--space-8); }
    .cta-section__actions { display: flex; flex-wrap: wrap; gap: var(--space-3); justify-content: center; }
    .btn--white { background: var(--clr-white); color: var(--clr-primary); font-weight: 700; }
    .btn--white:hover { background: rgba(255,255,255,0.92); transform: translateY(-1px); box-shadow: 0 8px 24px rgba(0,0,0,.20); }

    @media (min-width: 1024px) { .page-hero { padding: var(--space-20) 0 var(--space-16); } }