/*
 * PyMESPRESS CMS · FASE5A145
 * Capa consolidada para encabezado, portada, beneficios, tarjetas y pie.
 * Se carga después de app.css para neutralizar reglas heredadas sin reescribir
 * el resto del portal.
 */

/* ===== Encabezado estable en todas las resoluciones ===== */
.topbar{
  min-height:84px!important;
  height:84px!important;
  padding:0!important;
  background:rgba(255,255,255,.97)!important;
  border-bottom:1px solid #dfe7e3!important;
  box-shadow:0 5px 18px rgba(16,24,39,.035)!important;
}
.topbar .container.nav{
  width:100%!important;
  max-width:none!important;
  min-height:84px!important;
  height:84px!important;
  margin:0!important;
  padding:0 24px 0 16px!important;
  display:flex!important;
  align-items:center!important;
  flex-wrap:nowrap!important;
  gap:24px!important;
}
.topbar .nav-logo-link{
  display:flex!important;
  align-items:center!important;
  flex:0 0 auto!important;
  line-height:0!important;
}
.topbar .logo{
  display:block!important;
  width:220px!important;
  height:56px!important;
  max-width:none!important;
  object-fit:contain!important;
  object-position:left center!important;
}
.topbar .menu{
  margin-left:auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:clamp(22px,2.45vw,42px)!important;
  min-width:0!important;
}
.topbar .menu a{
  padding:30px 0 27px!important;
  white-space:nowrap!important;
}
.topbar .mobile-menu-toggle{margin-left:auto!important;flex:0 0 44px!important;}

/* ===== Carrusel principal ===== */
.page-home .home-carousel-hero{
  height:clamp(560px,calc(100svh - 84px),680px)!important;
  min-height:560px!important;
  background:#f7faf8!important;
}
.page-home .home-carousel-track,
.page-home .home-carousel-slide,
.page-home .home-carousel-inner{
  height:100%!important;
  min-height:0!important;
}
.page-home .home-carousel-slide{
  background-position:center right!important;
  background-repeat:no-repeat!important;
  will-change:opacity;
}
.page-home .home-carousel-slide[aria-hidden="true"]{visibility:hidden;}
.page-home .home-carousel-slide.is-active{visibility:visible;}
.page-home .home-carousel-shade{
  background:
    linear-gradient(90deg,rgba(255,255,255,.985) 0%,rgba(255,255,255,.96) 32%,rgba(255,255,255,.78) 53%,rgba(255,255,255,.22) 100%),
    radial-gradient(circle at 20% 55%,rgba(11,138,59,.09),transparent 31%)!important;
}
.page-home .home-carousel-inner{
  width:min(100% - 72px,1320px)!important;
  max-width:1320px!important;
  margin:0 auto!important;
  padding:0!important;
}
.page-home .home-carousel-copy{
  width:min(660px,55vw)!important;
  max-width:660px!important;
  padding:56px 0 100px!important;
}
.page-home .home-carousel-copy h1{
  max-width:650px!important;
  font-size:clamp(48px,5.05vw,76px)!important;
  line-height:.99!important;
  text-wrap:balance;
}
.page-home .home-carousel-copy p{
  max-width:590px!important;
  font-size:clamp(17px,1.35vw,20px)!important;
  line-height:1.55!important;
}
.page-home .home-carousel-actions{gap:14px!important;}
.page-home .home-carousel-btn{
  min-height:54px!important;
  padding:0 26px!important;
  border-radius:10px!important;
}
.page-home .home-carousel-nav{
  width:44px!important;
  height:44px!important;
  background:rgba(255,255,255,.9)!important;
}
.page-home .home-carousel-nav.prev{left:20px!important;}
.page-home .home-carousel-nav.next{right:20px!important;}
.page-home .home-carousel-nav:focus-visible,
.page-home .home-carousel-dots button:focus-visible,
.page-home .home-carousel-btn:focus-visible{
  outline:3px solid rgba(11,138,59,.30)!important;
  outline-offset:3px!important;
}

/* ===== Beneficios bajo el carrusel ===== */
.page-home .features-overlap{
  position:relative!important;
  z-index:5!important;
  margin-top:-46px!important;
  padding-bottom:18px!important;
}
.page-home .features-overlap>.container{
  width:min(100% - 72px,1320px)!important;
  max-width:1320px!important;
}
.page-home .features-shell{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:var(--feature-gap,14px)!important;
  padding:var(--feature-shell-padding,14px)!important;
  background:rgba(255,255,255,.94)!important;
  border:var(--feature-border-width,1.4px) solid var(--feature-border-color,#d7e3dd)!important;
  border-radius:calc(var(--feature-radius,16px) + 4px)!important;
  box-shadow:0 18px 44px rgba(16,24,39,.09)!important;
}
.page-home .feature-yellow{
  min-height:var(--feature-min-height,200px)!important;
  padding:var(--feature-padding-y,20px) var(--feature-padding-x,20px)!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-start!important;
  background:var(--feature-card-bg,#fff)!important;
  border:var(--feature-border-width,1.4px) solid var(--feature-border-color,#d7e3dd)!important;
  border-radius:var(--feature-radius,16px)!important;
  box-shadow:none!important;
}
.page-home .feature-yellow .feature-icon{
  min-height:36px!important;
  margin:0 0 12px!important;
  color:var(--feature-icon-color,#0b8a3b)!important;
  font-size:var(--feature-icon-size,30px)!important;
  line-height:1!important;
}
.page-home .feature-yellow .feature-icon svg,
.page-home .feature-yellow .feature-icon img{
  width:var(--feature-icon-size,30px)!important;
  height:var(--feature-icon-size,30px)!important;
}
.page-home .feature-yellow h3{
  margin:0 0 8px!important;
  color:var(--feature-title-color,#122037)!important;
  font-size:var(--feature-title-size,17px)!important;
  line-height:1.24!important;
  font-weight:800!important;
}
.page-home .feature-yellow p{
  margin:0!important;
  color:var(--feature-text-color,#526174)!important;
  font-size:var(--feature-text-size,14px)!important;
  line-height:1.46!important;
}

/* ===== Catálogo y tarjetas ===== */
.page-home .catalog-reference{
  padding-top:38px!important;
}
.page-home .catalog-reference-head{
  margin-bottom:26px!important;
}
.page-home .catalog-tools{
  margin-bottom:26px!important;
}
.page-home .first-course-row,
.page-home .rest-course-grid,
.page-home .related-course-grid{
  align-items:stretch!important;
}
.page-home .course-card.ref-card{
  display:flex!important;
  flex-direction:column!important;
  height:100%!important;
  border-radius:18px!important;
  overflow:hidden!important;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease!important;
}
.page-home .course-card.ref-card:hover{
  transform:translateY(-3px)!important;
  border-color:#cbdcd4!important;
}
.page-home .course-card.ref-card .thumb{
  display:block!important;
  width:100%!important;
  aspect-ratio:16/10!important;
  height:auto!important;
  background:#eef2f1!important;
}
.page-home .course-card.ref-card .thumb img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
}
.page-home .course-card.ref-card .course-body{
  display:flex!important;
  flex-direction:column!important;
  flex:1 1 auto!important;
  min-height:250px!important;
  padding:21px 21px 18px!important;
  gap:10px!important;
}
.page-home .course-card.ref-card .course-type{
  align-self:flex-start!important;
  margin:0 0 2px!important;
  padding:5px 10px!important;
  border:1px solid #d6ecdf!important;
  border-radius:999px!important;
  background:#eef8f2!important;
  color:#087b35!important;
  line-height:1.1!important;
}
.page-home .course-card.ref-card h3{
  margin:0!important;
  min-height:0!important;
  display:-webkit-box!important;
  -webkit-box-orient:vertical!important;
  -webkit-line-clamp:3!important;
  overflow:hidden!important;
  text-wrap:balance;
}
.page-home .course-card.ref-card .course-card-text{
  display:-webkit-box!important;
  -webkit-box-orient:vertical!important;
  -webkit-line-clamp:3!important;
  overflow:hidden!important;
}
.page-home .course-card.ref-card .card-bottom{
  margin-top:auto!important;
}
.page-home .course-subtitle{display:none!important;}

/* ===== Pie: separar la llamada de WhatsApp ===== */
.footer-modern-v77 .footer-v77-whatsapp{
  margin-top:28px!important;
  margin-bottom:16px!important;
}

/* ===== Portátiles y tabletas ===== */
@media (max-width:1180px){
  .topbar .container.nav{gap:18px!important;padding-right:18px!important;}
  .topbar .logo{width:205px!important;}
  .topbar .menu{gap:20px!important;}
  .page-home .home-carousel-inner,
  .page-home .features-overlap>.container{width:min(100% - 48px,1240px)!important;}
  .page-home .home-carousel-copy{width:min(610px,59vw)!important;}
  .page-home .home-carousel-copy h1{font-size:clamp(46px,5.5vw,68px)!important;}
}

@media (max-width:900px){
  .topbar{
    height:72px!important;
    min-height:72px!important;
  }
  .topbar .container.nav{
    height:72px!important;
    min-height:72px!important;
    padding:0 14px 0 12px!important;
    gap:10px!important;
  }
  .topbar .logo{width:190px!important;height:48px!important;}
  .topbar .mobile-menu-toggle{display:inline-flex!important;}
  .topbar .menu{
    display:none!important;
    position:absolute!important;
    top:72px!important;
    left:10px!important;
    right:10px!important;
    width:auto!important;
    max-height:calc(100svh - 90px)!important;
    overflow:auto!important;
    padding:8px!important;
    border:1px solid #dfe7e3!important;
    border-radius:0 0 16px 16px!important;
    background:#fff!important;
    box-shadow:0 18px 38px rgba(16,24,39,.14)!important;
  }
  body.menu-open .topbar .menu{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:0!important;}
  .topbar .menu a{padding:14px 15px!important;border-bottom:1px solid #eef2f0!important;}
  .topbar .menu a:last-child{border-bottom:0!important;}

  .page-home .home-carousel-hero{
    height:620px!important;
    min-height:620px!important;
  }
  .page-home .home-carousel-slide{background-position:center center!important;}
  .page-home .home-carousel-shade{
    background:linear-gradient(180deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.94) 52%,rgba(255,255,255,.72) 100%)!important;
  }
  .page-home .home-carousel-inner{
    width:min(100% - 36px,760px)!important;
    align-items:flex-start!important;
  }
  .page-home .home-carousel-copy{
    width:min(650px,100%)!important;
    max-width:650px!important;
    padding:46px 0 150px!important;
  }
  .page-home .home-carousel-copy h1{font-size:clamp(40px,8vw,56px)!important;}
  .page-home .home-carousel-copy p{font-size:17px!important;}
  .page-home .home-carousel-nav{display:none!important;}
  .page-home .features-overlap{margin-top:18px!important;}
  .page-home .features-overlap>.container{width:min(100% - 32px,760px)!important;}
  .page-home .features-shell{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .page-home .feature-yellow{min-height:auto!important;}
  .page-home .course-card.ref-card .course-body{min-height:230px!important;}
}

@media (max-width:640px){
  .page-home .home-carousel-hero{
    height:590px!important;
    min-height:590px!important;
  }
  .page-home .home-carousel-inner{width:calc(100% - 28px)!important;}
  .page-home .home-carousel-copy{padding:38px 0 120px!important;}
  .page-home .home-carousel-copy h1{
    margin:16px 0 14px!important;
    font-size:clamp(36px,11vw,48px)!important;
    line-height:1.01!important;
  }
  .page-home .home-carousel-copy p{font-size:16px!important;line-height:1.5!important;margin-bottom:22px!important;}
  .page-home .home-carousel-actions{display:grid!important;grid-template-columns:1fr!important;max-width:350px!important;gap:10px!important;}
  .page-home .home-carousel-btn{width:100%!important;min-height:50px!important;padding:0 18px!important;}
  .page-home .home-carousel-dots{bottom:18px!important;}
  .page-home .features-overlap>.container{width:calc(100% - 24px)!important;}
  .page-home .features-shell{grid-template-columns:1fr!important;padding:10px!important;gap:10px!important;}
  .page-home .feature-yellow{
    padding:16px!important;
    display:grid!important;
    grid-template-columns:42px minmax(0,1fr)!important;
    column-gap:12px!important;
  }
  .page-home .feature-yellow .feature-icon{grid-row:1/3!important;margin:2px 0 0!important;}
  .page-home .feature-yellow h3{margin-bottom:5px!important;}
  .page-home .course-card.ref-card .course-body{min-height:0!important;}
}

@media (max-width:400px){
  .topbar .logo{width:172px!important;}
  .page-home .home-carousel-hero{height:565px!important;min-height:565px!important;}
  .page-home .home-carousel-copy h1{font-size:34px!important;}
}

@media (prefers-reduced-motion:reduce){
  .page-home .home-carousel-slide,
  .page-home .home-carousel-btn,
  .page-home .course-card.ref-card{transition:none!important;}
  .page-home .course-card.ref-card:hover{transform:none!important;}
}


/* ===== FASE5A147C: tarjetas de beneficios en blanco ===== */
.page-home .feature-yellow{
  background:#ffffff!important;
  border-color:#dfe7e2!important;
  box-shadow:0 10px 24px rgba(16,24,40,.045)!important;
}


/* ===== FASE5A147D: compactación de beneficios y jerarquía del bloque de catálogo ===== */
.page-home .feature-yellow{
  min-height:0!important;
  padding:14px 18px!important;
}
.page-home .feature-yellow .feature-icon{margin-bottom:8px!important;min-height:30px!important;}
.page-home .feature-yellow h3{margin-bottom:5px!important;}
.page-home .catalog-reference-head h2{font-size:clamp(48px,6.8vw,92px)!important;line-height:1.04!important;}
.page-home .catalog-reference-head p{font-size:clamp(26px,2.6vw,36px)!important;line-height:1.3!important;max-width:1080px!important;}
.page-home .course-card.ref-card .interest{font-family:var(--ui)!important;font-weight:850!important;}
@media(max-width:900px){
  .page-home .catalog-reference-head h2{font-size:clamp(40px,8vw,62px)!important;}
  .page-home .catalog-reference-head p{font-size:clamp(21px,4vw,28px)!important;}
}
@media(max-width:640px){
  .page-home .feature-yellow{min-height:auto!important;padding:13px 14px!important;}
  .page-home .catalog-reference-head h2{font-size:36px!important;}
  .page-home .catalog-reference-head p{font-size:20px!important;}
}


/* ===== FASE5A147D1: cierre real de ajustes omitidos ===== */
.page-home .features-shell{align-items:stretch!important;}
.page-home .feature-yellow{min-height:0!important;height:auto!important;padding:14px 18px!important;}
.page-home .feature-yellow .feature-icon{margin-bottom:7px!important;min-height:28px!important;}
.page-home .feature-yellow h3{margin-bottom:4px!important;}
.page-home #cursos .catalog-reference-head h2{font-size:clamp(64px,8vw,112px)!important;line-height:1.02!important;}
.page-home #cursos .catalog-reference-head p{font-size:clamp(30px,3vw,36px)!important;line-height:1.25!important;max-width:1120px!important;}
@media(max-width:900px){
  .page-home #cursos .catalog-reference-head h2{font-size:clamp(44px,8vw,72px)!important;}
  .page-home #cursos .catalog-reference-head p{font-size:clamp(22px,4vw,30px)!important;}
}
@media(max-width:640px){
  .page-home .feature-yellow{padding:12px 14px!important;}
  .page-home #cursos .catalog-reference-head h2{font-size:40px!important;}
  .page-home #cursos .catalog-reference-head p{font-size:21px!important;}
}

/* ===== FASE5A148A1: reducción real del bloque promocional solicitado ===== */
.page-home #cursos .catalog-reference-head h2{
  font-size:clamp(32px,4vw,56px)!important;
  line-height:1.08!important;
  max-width:1120px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
.page-home #cursos .catalog-reference-head p{
  font-size:clamp(15px,1.5vw,18px)!important;
  line-height:1.45!important;
  max-width:900px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
@media(max-width:900px){
  .page-home #cursos .catalog-reference-head h2{font-size:clamp(28px,5.5vw,36px)!important;}
  .page-home #cursos .catalog-reference-head p{font-size:15px!important;}
}
@media(max-width:640px){
  .page-home #cursos .catalog-reference-head h2{font-size:24px!important;line-height:1.15!important;}
  .page-home #cursos .catalog-reference-head p{font-size:14px!important;}
}
