/* ===== Fundación Formando Futuro — Página individual de curso ===== */

.breadcrumb{
  padding-block: 14px;
  font-size: .85rem;
  color: var(--color-ink-soft);
}
.breadcrumb .container{ display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.breadcrumb a:hover{ color: var(--color-primary); }
.breadcrumb .is-current{ color: var(--color-ink); font-weight: 600; }

/* ---------- Hero ---------- */
.curso-hero{
  position: relative;
  overflow: hidden;
  background: radial-gradient(120% 140% at 85% 0%, #7d1c9c 0%, var(--color-primary-dark) 45%, #24052f 100%);
  color: #fff;
  padding-block: clamp(48px, 7vw, 80px);
}
.curso-hero::before, .curso-hero::after{
  content: "";
  position: absolute;
  border-radius: 50%;
  filter: blur(60px);
  z-index: 0;
}
.curso-hero::before{
  width: 380px; height: 380px;
  background: var(--color-accent);
  top: -140px; right: 10%;
  opacity: .3;
}
.curso-hero::after{
  width: 300px; height: 300px;
  background: #b45cff;
  bottom: -160px; left: -60px;
  opacity: .3;
}
.curso-hero__inner{
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  gap: 44px;
  align-items: center;
}
.curso-hero__media{
  border-radius: var(--radius);
  overflow: hidden;
  aspect-ratio: 4/3;
  background: rgba(255,255,255,.08);
  box-shadow: var(--shadow-lift);
}
.curso-hero__media img{ width: 100%; height: 100%; object-fit: cover; }
.curso-hero .eyebrow{ background: rgba(255,255,255,.14); color: #fff; }
.curso-hero h1{ color: #fff; margin-top: 16px; font-size: clamp(1.9rem, 3.6vw, 2.7rem); }
.curso-hero__lead{ margin-top: 14px; color: rgba(255,255,255,.82); font-size: 1.05rem; max-width: 46ch; }
.curso-hero__actions{ display: flex; gap: 14px; flex-wrap: wrap; margin-top: 28px; }

@media (max-width: 820px){
  .curso-hero__inner{ grid-template-columns: 1fr; }
}

/* ---------- Layout ---------- */
.curso-layout{
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 48px;
}
@media (max-width: 900px){
  .curso-layout{ grid-template-columns: 1fr; }
}

.curso-sobre h2{ font-size: clamp(1.3rem, 2.4vw, 1.6rem); margin-bottom: 18px; }

.prose{ color: var(--color-ink-soft); font-size: 1.02rem; line-height: 1.8; }
.prose p{ margin: 0 0 16px; }
.prose ul, .prose ol{ margin: 0 0 16px; padding-left: 22px; }
.prose li{ margin-bottom: 6px; }
.prose strong{ color: var(--color-ink); }
.prose a{ color: var(--color-primary); text-decoration: underline; text-underline-offset: 2px; }
.prose > *:last-child{ margin-bottom: 0; }

/* ---------- Temario ---------- */
.curso-temario{ margin-top: 48px; margin-bottom: clamp(32px, 6vw, 64px); }
.curso-temario h2{ font-size: clamp(1.3rem, 2.4vw, 1.6rem); margin-bottom: 18px; }

.temario-modulo{
  background: #fff;
  border: 1px solid var(--color-line);
  border-radius: var(--radius-sm);
  margin-bottom: 12px;
  overflow: hidden;
  transition: box-shadow .2s ease, border-color .2s ease;
}
.temario-modulo[open]{ box-shadow: var(--shadow-soft); border-color: rgba(99,0,131,.18); }
.temario-modulo summary{
  list-style: none;
  cursor: pointer;
  padding: 16px 20px;
  display: flex;
  align-items: center;
  gap: 16px;
}
.temario-modulo summary::-webkit-details-marker{ display: none; }
.temario-modulo__num{
  flex-shrink: 0;
  width: 34px; height: 34px;
  border-radius: 10px;
  background: rgba(99,0,131,.08);
  color: var(--color-primary);
  font-family: var(--font-heading);
  font-weight: 700;
  font-size: .82rem;
  display: grid;
  place-items: center;
}
.temario-modulo__titulo{ font-family: var(--font-heading); font-weight: 600; flex-grow: 1; }
.temario-modulo__icon{
  flex-shrink: 0;
  width: 26px; height: 26px;
  border-radius: 50%;
  border: 1.5px solid var(--color-primary);
  position: relative;
}
.temario-modulo__icon::before, .temario-modulo__icon::after{
  content: "";
  position: absolute;
  background: var(--color-primary);
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  transition: transform .2s ease, opacity .2s ease;
}
.temario-modulo__icon::before{ width: 12px; height: 2px; }
.temario-modulo__icon::after{ width: 2px; height: 12px; }
.temario-modulo[open] .temario-modulo__icon::after{ transform: translate(-50%, -50%) rotate(90deg); opacity: 0; }
.temario-modulo__body{ padding: 0 20px 20px 70px; }
.temario-tema + .temario-tema{ margin-top: 14px; padding-top: 14px; border-top: 1px dashed var(--color-line); }

/* ---------- Sidebar de precios ---------- */
.curso-precios{
  position: sticky;
  top: calc(var(--header-h) + 20px);
  background: #fff;
  border-radius: var(--radius);
  padding: 26px;
  box-shadow: var(--shadow-lift);
  border-top: 4px solid var(--color-primary);
}
@media (min-width: 901px){
  /* La superpone sobre el borde inferior del hero para integrar mejor las dos secciones */
  .curso-layout__aside{ margin-top: -170px; }
  .curso-precios{ top: calc(var(--header-h) + 24px); }
}
.curso-precios .eyebrow{ margin-bottom: 10px; }
.curso-precios h3{ font-size: 1.1rem; }
.curso-precio-item{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 0;
  border-bottom: 1px solid var(--color-line);
}
.curso-precio-item:last-of-type{ border-bottom: none; }
.curso-precio-item__icon{
  flex-shrink: 0;
  width: 38px; height: 38px;
  border-radius: 10px;
  background: rgba(99,0,131,.08);
  color: var(--color-primary);
  display: grid;
  place-items: center;
}
.curso-precio-item__icon svg{ width: 18px; height: 18px; }
.curso-precio-item__info{ flex-grow: 1; display: flex; flex-direction: column; }
.curso-precio-item__label{ font-size: .92rem; font-weight: 600; color: var(--color-ink); }
.curso-precio-item__info small{ font-size: .76rem; color: var(--color-ink-soft); }
.curso-precio-item strong{ font-size: 1.1rem; color: var(--color-primary); white-space: nowrap; }
.curso-precios .btn{ margin-top: 18px; width: 100%; }
.curso-precios__nota{
  margin-top: 12px;
  text-align: center;
  font-size: .78rem;
  color: var(--color-ink-soft);
}