
/* ============================================================
   LYCEUM — CURSO / INDEX MATCH
   Referencia maestra: index.php actual
   Objetivo: misma casa visual, sin alterar lógica del curso.
   ============================================================ */

:root{
  --navy:#03192e;
  --navy2:#06233e;
  --gold:#e5a936;
  --gold2:#f4c45c;
  --ivory:#f4eee4;
  --ivory2:#fbf8f2;
  --ink:#0a2036;
  --muted:#66717c;
  --line:rgba(8,31,52,.13);
  --serif:"Playfair Display",Georgia,serif;
  --sans:"Inter",system-ui,sans-serif;
}

body.ly-page{
  background:var(--ivory2)!important;
  color:var(--ink)!important;
  font-family:var(--sans)!important;
  -webkit-font-smoothing:antialiased;
}
main{overflow:hidden}
.ly-container{
  width:min(calc(100% - 44px),1180px)!important;
  max-width:1180px!important;
  margin-inline:auto!important;
  padding-inline:0!important;
}

/* ============================================================
   NAVBAR — mismas proporciones del Index
   ============================================================ */
.ly-page .ly-nav{
  position:fixed!important;
  z-index:800!important;
  top:14px!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  width:min(calc(100% - 58px),1180px)!important;
  max-width:1180px!important;
  min-height:62px!important;
  height:62px!important;
  padding:0 24px!important;
  border:1px solid rgba(255,255,255,.20)!important;
  border-radius:17px!important;
  background:linear-gradient(180deg,rgba(10,38,66,.70),rgba(5,27,49,.58))!important;
  box-shadow:0 16px 45px rgba(0,0,0,.18)!important;
  backdrop-filter:blur(18px) saturate(135%)!important;
  -webkit-backdrop-filter:blur(18px) saturate(135%)!important;
  color:#fff!important;
}
.ly-page .ly-nav .ly-brand{gap:12px!important;color:#fff!important}
.ly-page .ly-nav .ly-brand img{height:36px!important;width:auto!important}
.ly-page .ly-nav .ly-brand__name{
  font-family:var(--serif)!important;
  letter-spacing:2.4px!important;
  font-size:1rem!important;
  color:#fff!important;
}
.ly-page .ly-nav .ly-brand__sub{
  font-size:.43rem!important;
  letter-spacing:2px!important;
  color:rgba(255,255,255,.55)!important;
}
.ly-page .ly-nav__links{gap:30px!important}
.ly-page .ly-nav__link{
  font-size:.68rem!important;
  color:rgba(255,255,255,.90)!important;
}
.ly-page .ly-nav__link:hover,
.ly-page .ly-nav__link.is-active{color:var(--gold2)!important}
.ly-page .ly-nav .ly-btn--primary{
  min-height:36px!important;
  padding:0 13px!important;
  border-radius:6px!important;
  border:1px solid rgba(229,169,54,.58)!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#fff!important;
  font-size:.64rem!important;
}

/* ============================================================
   HERO — más compacto, misma escala y sobriedad del Index
   ============================================================ */
.ly-course-hero{
  position:relative!important;
  padding:96px 0 34px!important;
  min-height:350px!important;
  color:#fff!important;
  background:var(--navy)!important;
  border:0!important;
  overflow:hidden!important;
}
.ly-course-hero::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  pointer-events:none!important;
  background:
    linear-gradient(90deg,transparent 0%,transparent 64%,rgba(255,255,255,.018) 64%,rgba(255,255,255,.018) 100%)!important;
  border-radius:0!important;
  box-shadow:none!important;
  width:auto!important;height:auto!important;
  right:auto!important;top:auto!important;
}
.ly-course-hero::after{
  content:""!important;
  position:absolute!important;
  right:0!important;bottom:0!important;
  width:82px!important;height:82px!important;
  background:linear-gradient(145deg,var(--gold2),var(--gold))!important;
  clip-path:polygon(100% 0,100% 100%,0 100%)!important;
  opacity:1!important;
}
.ly-course-hero__grid{
  position:relative!important;
  z-index:2!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.45fr) minmax(260px,.55fr)!important;
  gap:44px!important;
  align-items:center!important;
}
.ly-course-hero .ly-eyebrow,
.ly-page .ly-eyebrow,
.ly-page .ly-kicker{
  color:var(--gold)!important;
}
.ly-course-hero .ly-display{
  max-width:720px!important;
  margin-top:10px!important;
  font-family:var(--serif)!important;
  font-weight:500!important;
  font-size:clamp(3.1rem,5.5vw,5.15rem)!important;
  line-height:.93!important;
  letter-spacing:-.04em!important;
  color:#fff!important;
}
.ly-course-hero__promise{
  max-width:650px!important;
  margin-top:15px!important;
  font-family:var(--serif)!important;
  font-size:1.02rem!important;
  line-height:1.34!important;
  color:var(--gold2)!important;
}
.ly-course-hero .ly-lead{
  max-width:620px!important;
  margin-top:12px!important;
  color:rgba(255,255,255,.72)!important;
  font-size:.74rem!important;
  line-height:1.62!important;
}
.ly-course-hero__meta{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:7px!important;
  margin-top:15px!important;
}
.ly-course-hero .ly-badge{
  min-height:26px!important;
  padding:0 9px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.035)!important;
  border:1px solid rgba(255,255,255,.13)!important;
  color:rgba(255,255,255,.76)!important;
  font-size:.55rem!important;
  backdrop-filter:none!important;
}
.ly-course-hero .ly-badge--gold{
  border-color:rgba(229,169,54,.45)!important;
  color:var(--gold2)!important;
  background:rgba(229,169,54,.06)!important;
}
.ly-course-hero__actions{
  display:flex!important;
  gap:14px!important;
  flex-wrap:wrap!important;
  margin-top:18px!important;
}
.ly-course-hero .ly-btn,
.ly-course-final .ly-btn{
  min-height:40px!important;
  padding:0 23px!important;
  border-radius:0!important;
  font-size:.64rem!important;
  font-weight:600!important;
}
.ly-course-hero .ly-btn--primary,
.ly-course-final .ly-btn--primary{
  background:linear-gradient(180deg,var(--gold2),var(--gold))!important;
  color:#172330!important;
  border:1px solid rgba(255,255,255,.12)!important;
  box-shadow:0 10px 24px rgba(229,169,54,.18)!important;
}
.ly-course-hero .ly-btn--secondary,
.ly-course-final .ly-btn--secondary{
  border:1px solid rgba(229,169,54,.72)!important;
  color:var(--gold2)!important;
  background:rgba(255,255,255,.025)!important;
  backdrop-filter:blur(9px)!important;
}
.ly-guest-hint,
.ly-course-back{
  font-size:.58rem!important;
  color:rgba(255,255,255,.50)!important;
}
.ly-course-back{margin-top:14px!important}
.ly-course-back:hover{color:var(--gold2)!important}

/* Status = glass estratégico, no tarjeta gigante */
.ly-course-status{
  min-height:216px!important;
  padding:22px!important;
  border-radius:11px!important;
  border:1px solid rgba(255,255,255,.16)!important;
  background:rgba(255,255,255,.055)!important;
  box-shadow:0 12px 28px rgba(0,0,0,.13)!important;
  backdrop-filter:blur(13px) saturate(115%)!important;
  -webkit-backdrop-filter:blur(13px) saturate(115%)!important;
}
.ly-course-status__value{
  margin:10px 0 8px!important;
  font-family:var(--serif)!important;
  color:#fff!important;
  font-size:2.55rem!important;
  line-height:1!important;
}
.ly-course-status__note{
  color:rgba(255,255,255,.62)!important;
  font-size:.68rem!important;
  line-height:1.5!important;
}
.ly-course-status .ly-progress{
  height:4px!important;
  background:rgba(255,255,255,.10)!important;
}
.ly-course-status .ly-progress__bar{
  background:linear-gradient(90deg,var(--gold),var(--gold2))!important;
}

/* ============================================================
   SECCIONES — ritmo más compacto y alternancia Index
   ============================================================ */
.ly-section{
  position:relative!important;
  padding:48px 0!important;
  background:linear-gradient(90deg,#f2ebe0,#faf6ef)!important;
  border-top:1px solid var(--line)!important;
  border-bottom:0!important;
  color:var(--ink)!important;
}
.ly-section:nth-of-type(3){
  background:linear-gradient(90deg,var(--navy),#05233e)!important;
  color:#fff!important;
  border-color:rgba(255,255,255,.09)!important;
}
.ly-course-copy{max-width:820px!important}
.ly-title{
  font-family:var(--serif)!important;
  font-weight:500!important;
  font-size:clamp(2rem,3.5vw,3.15rem)!important;
  line-height:1.03!important;
  letter-spacing:-.03em!important;
  color:var(--ink)!important;
}
.ly-gradient-text{
  background:none!important;
  -webkit-text-fill-color:initial!important;
  color:var(--gold)!important;
}
.ly-section .ly-lead{
  max-width:720px!important;
  margin-top:13px!important;
  color:var(--muted)!important;
  font-size:.72rem!important;
  line-height:1.62!important;
}

/* Índices: misma escala compacta del Home */
.ly-section-label{
  display:grid!important;
  grid-template-columns:auto 48px auto!important;
  gap:9px!important;
  align-items:center!important;
  width:max-content!important;
  margin-bottom:18px!important;
}
.ly-section-label__num{
  font-family:var(--serif)!important;
  color:var(--gold)!important;
  font-size:1.65rem!important;
  line-height:1!important;
}
.ly-section-label__line{
  width:48px!important;
  height:1px!important;
  background:rgba(8,31,52,.32)!important;
}
.ly-section-label__text{
  color:var(--ink)!important;
  font-size:.55rem!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
  font-weight:600!important;
}

/* ============================================================
   01 · RECORRIDO — editorial, plano, sin muro de glass
   ============================================================ */
.ly-course-journey{
  display:grid!important;
  grid-template-columns:repeat(3,1fr)!important;
  gap:0!important;
  margin-top:25px!important;
  border-top:1px solid var(--line)!important;
  border-left:1px solid var(--line)!important;
}
.ly-course-step{
  min-height:126px!important;
  padding:18px 20px!important;
  border-radius:0!important;
  border:0!important;
  border-right:1px solid var(--line)!important;
  border-bottom:1px solid var(--line)!important;
  background:rgba(255,255,255,.30)!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}
.ly-course-step:hover{
  transform:none!important;
  background:rgba(255,255,255,.55)!important;
}
.ly-course-step__num{
  font-family:var(--serif)!important;
  color:var(--gold)!important;
  font-size:1.4rem!important;
}
.ly-course-step__title{
  margin-top:15px!important;
  font-family:var(--serif)!important;
  color:var(--ink)!important;
  font-size:1rem!important;
  line-height:1.06!important;
  font-weight:500!important;
}
.ly-course-step__source{
  margin-top:6px!important;
  color:#737d86!important;
  font-size:.58rem!important;
  line-height:1.4!important;
}

/* ============================================================
   02 · PROGRAMA — navy limpio como las secciones oscuras Home
   ============================================================ */
#programa{
  background:linear-gradient(90deg,var(--navy),#05233e)!important;
  color:#fff!important;
  border-color:rgba(255,255,255,.09)!important;
}
#programa .ly-title{color:#fff!important}
#programa .ly-lead,
#programa .ly-program-note{color:rgba(255,255,255,.66)!important}
#programa .ly-section-label__text{color:rgba(255,255,255,.78)!important}
#programa .ly-section-label__line{background:rgba(255,255,255,.24)!important}
.ly-curriculum{
  margin-top:24px!important;
  border-top:1px solid rgba(255,255,255,.14)!important;
}
.ly-module{
  border:0!important;
  border-bottom:1px solid rgba(255,255,255,.14)!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.ly-module summary{
  min-height:58px!important;
  padding:14px 2px!important;
  background:transparent!important;
}
.ly-module__num{
  min-width:82px!important;
  color:var(--gold)!important;
  font-size:.57rem!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}
.ly-module__title{
  font-family:var(--serif)!important;
  color:#fff!important;
  font-size:1rem!important;
  font-weight:500!important;
}
.ly-module__count{
  color:rgba(255,255,255,.47)!important;
  font-size:.56rem!important;
}
.ly-module__chevron{
  color:var(--gold2)!important;
  font-size:1rem!important;
}
.ly-module__body{
  padding:0 2px 14px!important;
  border-top:1px solid rgba(255,255,255,.06)!important;
  background:transparent!important;
}
.ly-module__description{
  max-width:760px!important;
  padding-top:13px!important;
  color:rgba(255,255,255,.62)!important;
  font-size:.68rem!important;
  line-height:1.58!important;
}
.ly-lesson{
  min-height:42px!important;
  padding:9px 0!important;
  border-color:rgba(255,255,255,.08)!important;
}
.ly-lesson__title{
  color:rgba(255,255,255,.84)!important;
  font-size:.66rem!important;
}
.ly-lesson__meta{
  color:rgba(255,255,255,.43)!important;
  font-size:.55rem!important;
}
.ly-lesson__dot{
  width:4px!important;height:4px!important;
  background:var(--gold)!important;
}
.ly-program-note{
  margin-top:18px!important;
  font-size:.58rem!important;
  line-height:1.55!important;
}

/* ============================================================
   03 · MÉTODO — copiar lógica de columnas del manifiesto Home
   ============================================================ */
.ly-section:has(.ly-method-grid){
  background:linear-gradient(90deg,#f2ebe0,#faf6ef)!important;
  color:var(--ink)!important;
}
.ly-section:has(.ly-method-grid) .ly-title{color:var(--ink)!important}
.ly-method-grid{
  display:grid!important;
  grid-template-columns:repeat(4,1fr)!important;
  gap:0!important;
  margin-top:26px!important;
}
.ly-method-card{
  min-height:125px!important;
  padding:4px 22px 0!important;
  border-radius:0!important;
  border:0!important;
  border-right:1px solid var(--line)!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}
.ly-method-card:first-child{padding-left:0!important}
.ly-method-card:last-child{border-right:0!important}
.ly-method-card:hover{transform:none!important}
.ly-method-card__num{
  margin-bottom:7px!important;
  font-family:var(--serif)!important;
  color:var(--gold)!important;
  font-size:1.55rem!important;
}
.ly-method-card h3{
  font-family:var(--serif)!important;
  color:var(--ink)!important;
  font-weight:500!important;
  font-size:1.03rem!important;
  line-height:1.06!important;
}
.ly-method-card p{
  max-width:155px!important;
  margin-top:7px!important;
  color:var(--muted)!important;
  font-size:.58rem!important;
  line-height:1.45!important;
}

/* ============================================================
   CTA FINAL — compacta como el cierre del Index
   ============================================================ */
.ly-course-final{
  position:relative!important;
  overflow:hidden!important;
  padding:44px max(22px,calc((100vw - 1180px)/2))!important;
  background:var(--navy)!important;
  color:#fff!important;
  text-align:center!important;
  border-top:1px solid rgba(255,255,255,.08)!important;
}
.ly-course-final::after{
  content:""!important;
  position:absolute!important;
  right:-28px!important;
  bottom:-46px!important;
  width:130px!important;height:130px!important;
  border:1px solid rgba(229,169,54,.30)!important;
  border-radius:50%!important;
  box-shadow:0 0 0 24px rgba(229,169,54,.02)!important;
}
.ly-course-final .ly-title{
  width:min(840px,94vw)!important;
  max-width:840px!important;
  margin:12px auto 0!important;
  color:#fff!important;
  font-size:clamp(2rem,3.6vw,3.3rem)!important;
  line-height:1.02!important;
  text-wrap:balance!important;
}
.ly-course-final .ly-lead{
  max-width:620px!important;
  margin:15px auto 0!important;
  color:rgba(255,255,255,.63)!important;
  font-size:.68rem!important;
  line-height:1.58!important;
}
.ly-course-final .ly-row{margin-top:20px!important}

/* ============================================================
   FOOTER
   ============================================================ */
.ly-page .ly-footer,
.ly-page footer{
  background:var(--navy)!important;
  color:rgba(255,255,255,.68)!important;
  border-top:1px solid rgba(255,255,255,.08)!important;
}
.ly-page .ly-footer a,
.ly-page footer a{color:rgba(255,255,255,.72)!important}
.ly-page .ly-footer a:hover,
.ly-page footer a:hover{color:var(--gold2)!important}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media(max-width:980px){
  .ly-course-hero{padding-top:112px!important}
  .ly-course-hero__grid{grid-template-columns:1fr!important;gap:24px!important}
  .ly-course-status{min-height:180px!important}
  .ly-method-grid{grid-template-columns:repeat(2,1fr)!important}
  .ly-method-card:nth-child(2){border-right:0!important}
  .ly-method-card:nth-child(-n+2){border-bottom:1px solid var(--line)!important;padding-bottom:20px!important}
  .ly-method-card:nth-child(n+3){padding-top:20px!important}
}
@media(max-width:760px){
  .ly-container{width:min(calc(100% - 28px),1180px)!important}
  .ly-page .ly-nav{
    top:8px!important;
    width:calc(100% - 20px)!important;
    padding:0 14px!important;
  }
  .ly-page .ly-nav__links{gap:12px!important}
  .ly-course-hero{padding:96px 0 28px!important}
  .ly-course-hero .ly-display{font-size:3.1rem!important}
  .ly-course-journey{grid-template-columns:repeat(2,1fr)!important}
}
@media(max-width:560px){
  .ly-course-journey{grid-template-columns:1fr!important}
  .ly-method-grid{grid-template-columns:1fr!important}
  .ly-method-card{
    padding:18px 0!important;
    border-right:0!important;
    border-bottom:1px solid var(--line)!important;
  }
  .ly-method-card:first-child{padding-top:0!important}
  .ly-method-card:last-child{border-bottom:0!important}
  .ly-course-final{padding-top:38px!important;padding-bottom:38px!important}
}
