  :root {
      --cetys-yellow: #FFDD00;
      --cetys-black: #111111;
      --cetys-grey: #E8E8E8;
      --cetys-mid-grey: #999;
      --tab-active-bg: #111111;
      --tab-inactive-bg: #DADADA;
  }

  .banner-academic-programs {
      background-color: #FFDD00;
      height: 300px;
      display: flex;
      align-items: center;
  }

  .titulo-banner {
      border-bottom: 2px solid #000;
      width: 100%;
  }

  #build-future {
      background-color: #E9E9E9;
  }

  /* ── Main Tab Switcher ── */
  .level-tabs {
      display: flex;
      border-radius: 0;
      overflow: hidden;
      max-width: 820px;
      margin: 0 auto 2.5rem;
      border-top-left-radius: 15px;
      border-top-right-radius: 15px;
  }

  .level-tabs .tab-btn {
      flex: 1;
      border: none;
      padding: 14px 0;
      font-size: 1.15rem;
      font-weight: 700;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      cursor: pointer;
      transition: background 0.2s, color 0.2s;
      background: var(--tab-inactive-bg);
      color: var(--cetys-black);
  }

  .tab-izquierda {
      border-top-right-radius: 15px;
  }

  .tab-derecha {
      border-top-left-radius: 15px;
  }

  .level-tabs .tab-btn.active {
      background: var(--tab-active-bg);
      color: #fff;
  }

  /* ── Subnivel heading ── */
  .subnivel-title {
      font-weight: 700;
      font-size: 1.25rem;
      text-transform: uppercase;
      letter-spacing: 0.03em;
      display: block;
      background: var(--cetys-yellow);
      padding: 3px 10px;
      margin-bottom: 0.6rem;
      position: relative;
      text-align: center;
      width: fit-content;
      margin-left: auto;
      margin-right: auto;
  }

  @media (min-width: 768px) {
      .subnivel-title {
          display: inline-block;
          text-align: left;
      }
  }

  /* ── Program row ── */
  .program-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 10px 0;
      border-bottom: 1px solid #E0E0E0;
      gap: 1rem;
  }

  .program-name {
      font-size: 0.95rem;
      font-weight: 400;
      flex: 1;
      min-width: 0;
  }

  .program-name a {
      color: var(--cetys-black);
      text-decoration: none;
  }

  .program-name a:hover {
      text-decoration: underline;
      color: #444;
  }

  /* ── Campus badges ── */
  .campus-list {
      display: flex;
      gap: 6px;
      flex-shrink: 0;
  }

  .campus-badge {
      font-size: 0.78rem;
      font-weight: 600;
      letter-spacing: 0.03em;
      padding: 3px 10px;
      border-radius: 999px;
      background: var(--cetys-yellow);
      color: var(--cetys-black);
      white-space: nowrap;
  }

  .campus-badge.invisible-badge {
      visibility: hidden;
  }

  /* ── Subnivel block ── */
  .subnivel-block {
      margin-bottom: 2.5rem;
  }

  /* ── Tab content ── */
  .tab-content-panel {
      display: none;
  }

  .tab-content-panel.active {
      display: block;
  }

  .programs-wrapper {
      max-width: 820px;
      margin: 0 auto;
  }