/* =====================================================================
   CATÁLOGO DE CURSOS
   ===================================================================== */

/* --- Hero --- */
.ct-hero{
  padding:52px 0 56px;
  border-bottom:1px solid var(--rule);
  background:var(--bg);
}
.ct-hero-grid{
  display:grid;
  grid-template-columns: 1.15fr .85fr;
  gap:56px;
  align-items:center;
}
.ct-hero-text{display:flex;flex-direction:column;max-width:580px}
.ct-eyebrow{color:var(--ink-2);margin-bottom:18px}
.ct-title{
  font-family:var(--serif);font-weight:400;
  font-size:50px;line-height:1.1;letter-spacing:-.01em;
  color:var(--navy);margin:0 0 20px;
}
.ct-title .accent{color:var(--insight-2);font-style:italic}
.ct-lede{
  font-size:15.5px;line-height:1.6;color:var(--ink-2);
  max-width:480px;margin:0 0 28px;
}
.ct-hero-actions{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.ct-hero-actions .btn-navy{width:auto}
.ct-hero-stats{
  display:flex;gap:0;margin-top:30px;
  border-top:1px solid var(--rule);
}
.ct-stat{
  display:flex;flex-direction:column;gap:4px;
  padding:16px 26px 0 0;margin-right:26px;
  border-right:1px solid var(--rule);
}
.ct-stat:last-child{border-right:0;margin-right:0;padding-right:0}
.ct-stat-num{
  font-family:var(--serif);font-weight:400;font-size:30px;line-height:1;
  color:var(--navy);
}
.ct-stat-num .u{font-size:15px;color:var(--ink-2);margin-left:3px}
.ct-stat-label{
  font-family:var(--mono);font-size:11px;letter-spacing:.04em;
  color:var(--muted);text-transform:none;
}

/* Hero index card (table of contents by category) */
.ct-index{
  background:var(--paper);
  border:1px solid var(--rule);
  padding:6px 0 4px;
}
.ct-index-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 22px 12px;
  border-bottom:1px solid var(--rule);
}
.ct-index-head .ti{
  font-family:var(--mono);font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--muted);
}
.ct-index-head .tot{
  font-family:var(--serif);font-size:15px;color:var(--navy);
}
.ct-index-row{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  padding:11px 22px;
  border-bottom:1px solid var(--rule);
  cursor:pointer;
  transition:background .15s ease;
}
.ct-index-row:last-child{border-bottom:0}
.ct-index-row:hover{background:var(--tint-hover)}
.ct-index-row .nm{
  font-family:var(--serif);font-size:15.5px;color:var(--ink);
}
.ct-index-row .dots{
  flex:1;height:1px;align-self:center;
  border-bottom:1px dotted var(--rule);
  margin:0 4px;
}
.ct-index-row .ct{
  font-family:var(--mono);font-size:12.5px;color:var(--ink-2);
  min-width:22px;text-align:right;
}

/* --- Section head --- */
.ct-section{padding:64px 0}
.ct-section.tight{padding-top:48px}
.ct-head{
  display:flex;align-items:flex-end;justify-content:space-between;
  gap:24px;margin-bottom:28px;
  padding-bottom:16px;border-bottom:1px solid var(--rule);
}
.ct-head-l{display:flex;flex-direction:column;gap:12px}
.ct-head-eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--sans);font-size:12px;font-weight:700;
  letter-spacing:.22em;text-transform:uppercase;color:var(--ink);
}
.ct-head-eyebrow::after{
  content:"";display:inline-block;width:42px;height:1px;background:var(--insight-2);
}
.ct-head-title{
  font-family:var(--serif);font-weight:400;
  font-size:36px;line-height:1.15;letter-spacing:-.005em;
  color:var(--navy);margin:0;
}
.ct-head-sub{
  font-size:14px;line-height:1.55;color:var(--ink-2);margin:0;max-width:460px;
}

/* --- Toolbar: chips + search --- */
.ct-toolbar{
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  flex-wrap:wrap;
  margin-bottom:24px;
}
.ct-chips{display:flex;flex-wrap:wrap;gap:8px}
.ct-chip{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 14px;
  border:1px solid var(--rule);
  background:var(--paper);
  font-family:var(--sans);font-size:13px;font-weight:600;
  color:var(--ink-2);letter-spacing:.01em;
  cursor:pointer;
  transition:background .15s ease, color .15s ease, border-color .15s ease;
}
.ct-chip:hover{border-color:var(--navy);color:var(--navy)}
.ct-chip .n{
  font-family:var(--mono);font-size:11px;font-weight:500;
  color:var(--muted);
}
.ct-chip.is-on{
  background:var(--ink-block);border-color:var(--ink-block);color:var(--on-ink);
}
.ct-chip.is-on .n{color:var(--insight)}

.ct-search{
  display:inline-flex;align-items:center;gap:10px;
  padding:9px 14px;
  border:1px solid var(--rule);
  background:var(--paper);
  min-width:230px;
}
.ct-search svg{width:16px;height:16px;stroke:var(--muted);fill:none;stroke-width:1.8;flex:0 0 16px}
.ct-search input{
  border:0;background:transparent;outline:none;
  font-family:var(--sans);font-size:14px;color:var(--ink);
  width:100%;
}
.ct-search input::placeholder{color:var(--muted)}

.ct-count{
  font-family:var(--mono);font-size:12px;color:var(--muted);
  margin-bottom:18px;
}

/* --- Course list --- */
.ct-list{
  border-top:1px solid var(--ink);
  border-bottom:1px solid var(--rule);
}
.ct-list-row-tpl,
.ct-list-head,
.ct-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) 116px 152px 104px 118px;
  align-items:center;
  gap:20px;
}
.ct-list-head{
  padding:11px 12px;
  border-bottom:1px solid var(--rule);
}
.ct-list-head span{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--muted);
}
.ct-list-head .ct-row-link{text-align:right;justify-content:flex-end}

.ct-row{
  padding:16px 12px;
  border-bottom:1px solid var(--rule);
  transition:background .15s ease;
}
.ct-row:last-child{border-bottom:0}
.ct-row:hover{background:var(--tint-hover)}
.ct-row.is-soon{cursor:default}
.ct-row.is-soon:hover{background:transparent}

.ct-row-name{
  display:flex;align-items:baseline;gap:12px;min-width:0;
}
.ct-row-name .t{
  font-family:var(--serif);font-weight:400;font-size:17px;line-height:1.3;
  letter-spacing:-.005em;color:var(--navy);
  text-wrap:pretty;
}
.ct-row:not(.is-soon):hover .ct-row-name .t{color:var(--insight-2)}
.ct-row-new{
  flex:0 0 auto;align-self:center;
  font-family:var(--sans);font-size:9.5px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;
  color:var(--on-amber);background:var(--insight);
  padding:3px 7px;line-height:1;
}
.ct-row-cat{
  font-family:var(--sans);font-size:11px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:var(--amber-2);
}
.ct-row-sub{
  font-family:var(--sans);font-size:13px;font-weight:400;
  color:var(--ink-2);line-height:1.35;
}
.ct-row-tipo{
  display:inline-flex;align-items:center;gap:7px;
  font-family:var(--mono);font-size:11px;letter-spacing:.04em;
  color:var(--ink-2);white-space:nowrap;
}
.ct-row-tipo::before{
  content:"";width:6px;height:6px;flex:0 0 6px;border-radius:50%;
  background:var(--ink-2);
}
.ct-row-tipo.t-online::before{background:var(--insight-2)}
.ct-row-tipo.t-demand::before{background:var(--muted)}
.ct-list-head .ct-row-tipo::before{display:none}
.ct-row-link{
  display:inline-flex;align-items:center;justify-content:flex-end;gap:8px;
  font-family:var(--sans);font-size:13px;font-weight:600;
  color:var(--ink-2);letter-spacing:.01em;white-space:nowrap;
  transition:gap .18s ease, color .18s ease;
}
.ct-row-link svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.8;flex:0 0 14px}
.ct-row:not(.is-soon):hover .ct-row-link{color:var(--navy);gap:12px}
.ct-row-link.is-soon{
  font-family:var(--mono);font-size:11px;font-weight:400;letter-spacing:.04em;
  color:var(--muted);font-style:normal;
}

.ct-empty{
  padding:48px 0;text-align:center;
  font-family:var(--serif);font-style:italic;font-size:18px;color:var(--ink-2);
}

/* --- Acceso: tres vías --- */
.ct-access{
  background:var(--bg-soft);
  border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
}
.ct-tiers{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:20px;
  align-items:stretch;
}
.ct-tier{
  position:relative;
  background:var(--paper);
  border:1px solid var(--rule);
  padding:28px 26px 26px;
  display:flex;flex-direction:column;
}
.ct-tier-num{
  font-family:var(--mono);font-size:12px;letter-spacing:.16em;
  color:var(--muted);margin-bottom:18px;
}
.ct-tier-title{
  font-family:var(--serif);font-weight:400;font-size:23px;line-height:1.2;
  letter-spacing:-.005em;color:var(--navy);margin:0 0 6px;
}
.ct-tier-sub{
  font-family:var(--sans);font-size:11px;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink-2);margin:0 0 14px;
}
.ct-tier-desc{
  font-size:13.5px;line-height:1.6;color:var(--ink-2);margin:0 0 18px;
}
.ct-tier-foot{margin-top:auto}
.ct-tier .arrow-link{align-self:flex-start}

/* Featured subscription tier */
.ct-tier.feat{
  background:var(--ink-block);
  border:1.5px solid var(--ink-block);
  box-shadow:0 18px 40px -18px rgba(11,29,58,.55);
  transform:translateY(-10px);
  padding-top:34px;
}
.ct-ribbon{
  position:absolute;top:0;right:24px;transform:translateY(-50%);
  display:inline-flex;align-items:center;gap:7px;
  background:var(--insight);color:var(--on-amber);
  font-family:var(--sans);font-size:10.5px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;
  padding:6px 12px;
}
.ct-tier.feat .ct-tier-num{color:var(--insight)}
.ct-tier.feat .ct-tier-title{color:#fff}
.ct-tier.feat .ct-tier-sub{color:var(--on-ink-2)}
.ct-tier.feat .ct-tier-desc{color:var(--on-ink-2)}
.ct-price{
  display:flex;align-items:baseline;gap:8px;
  margin:2px 0 16px;white-space:nowrap;
}
.ct-price .per{white-space:nowrap}
.ct-price .amt{
  font-family:var(--serif);font-weight:400;font-size:46px;line-height:1;
  color:var(--insight);
}
.ct-price .per{
  font-family:var(--sans);font-size:13px;font-weight:600;color:var(--on-ink-2);
}
.ct-tier-list{
  list-style:none;padding:0;margin:0 0 22px;
  display:flex;flex-direction:column;gap:11px;
}
.ct-tier-list li{
  display:flex;align-items:flex-start;gap:11px;
  font-size:13.5px;line-height:1.4;color:var(--on-ink);
}
.ct-tier-list .ck{
  width:18px;height:18px;flex:0 0 18px;margin-top:1px;
  display:grid;place-items:center;
}
.ct-tier-list .ck svg{width:13px;height:13px;stroke:var(--insight);fill:none;stroke-width:2.4}
.ct-tier.feat .btn-primary{align-self:stretch;justify-content:center}

/* Schools wordmarks inside tier 03 */
.ct-schools{
  display:flex;flex-wrap:wrap;gap:10px 8px;
  margin:0 0 16px;
}
.ct-school{
  font-family:var(--sans);font-weight:700;font-size:13px;
  letter-spacing:.01em;color:var(--navy);
  padding:6px 11px;border:1px solid var(--rule);
  background:var(--bg);
}
.ct-school.it{font-style:italic;letter-spacing:0}
.ct-schools-foot{
  font-family:var(--serif);font-style:italic;font-size:13px;
  color:var(--ink-2);margin:0 0 18px;
}

/* --- Contact strip --- */
.ct-contact{
  background:var(--bg);
  border-bottom:1px solid var(--rule);
  padding:30px 0;
}
.ct-contact-inner{
  display:grid;grid-template-columns:auto 1fr auto;gap:26px;align-items:center;
}
.ct-contact-ic{
  width:48px;height:48px;border-radius:50%;
  display:grid;place-items:center;flex:0 0 48px;
  border:1.5px solid #E69020;
}
.ct-contact-ic svg{width:24px;height:24px;stroke:#E69020;fill:none;stroke-width:1.6}
.ct-contact-text{
  font-family:var(--serif);font-size:19px;line-height:1.35;color:var(--navy);
  font-weight:400;letter-spacing:-.005em;margin:0;
}

/* --- Responsive --- */
@media (max-width: 980px){
  .ct-hero-grid{grid-template-columns:1fr;gap:36px}
  .ct-title{font-size:40px}
  .ct-tiers{grid-template-columns:1fr}
  .ct-tier.feat{transform:none;order:-1}
  .ct-ribbon{right:auto;left:24px}
  .ct-list-head,
  .ct-row{grid-template-columns:minmax(0,1fr) 100px 96px 104px;gap:14px}
  .ct-list-head .ct-row-sub,
  .ct-row-sub{display:none}
}
@media (max-width: 720px){
  .ct-head{flex-direction:column;align-items:flex-start}
  .ct-toolbar{flex-direction:column;align-items:stretch}
  .ct-search{min-width:0;width:100%}
  .ct-head-title{font-size:30px}
  .ct-hero-stats{flex-wrap:wrap;gap:0}
  .ct-list-head{display:none}
  .ct-row{
    grid-template-columns:1fr auto;
    grid-template-areas:
      "name link"
      "cat  link"
      "tipo link";
    gap:7px 16px;
  }
  .ct-row-name{grid-area:name}
  .ct-row-cat{grid-area:cat;align-self:start;justify-self:start}
  .ct-row-tipo{grid-area:tipo;align-self:start;justify-self:start}
  .ct-row-link{grid-area:link;align-self:center}
  .ct-row-link .lbl{display:none}
}
@media (max-width: 480px){
  .ct-contact-inner{grid-template-columns:1fr;text-align:center;gap:16px}
  .ct-contact-ic{margin:0 auto}
}
