/* Estilos de aprende (del prototipo aprende.html) */
.ahero{position:relative;overflow:hidden;border-bottom:1px solid var(--linea)}
.ahero .letras{justify-content:flex-end;padding-bottom:10px}
.ahero .wrap{position:relative;padding-top:28px;padding-bottom:76px}
.ahero .crumbs{font-size:14px;color:var(--texto-2);margin-bottom:56px}
.ahero .crumbs a{text-decoration:none}
.ahero .lock{margin-bottom:22px}
.ahero .lock i{font-size:clamp(28px,3vw,42px)}
.ahero .lock b{font-size:clamp(56px,8vw,124px);line-height:.88}
.ahero p{color:#d6d6d6;font-size:19px;max-width:44ch}
.jump{display:flex;gap:8px;flex-wrap:wrap;margin-top:28px}
.jump a{border:1px solid #3a3a3a;border-radius:20px;padding:8px 16px;text-decoration:none;font-size:15px;background:rgba(0,0,0,.6)}
.jump a span{color:var(--texto-2);margin-left:6px}
.jump a:hover{border-color:#fff}
.linea{padding:96px 0 0;scroll-margin-top:90px}
.linea + .linea{padding-top:110px}
.lhead{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:36px;border-bottom:2px solid #fff;padding-bottom:18px}
.lhead .lock{margin:0}
.lhead > a{font-size:14px;text-decoration:none;border-bottom:1px solid var(--rojo);padding-bottom:2px;white-space:nowrap}
.guias{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.guia{display:grid;grid-template-columns:42% 1fr;background:var(--grafito);border:1px solid var(--linea);border-radius:var(--radio);overflow:hidden;text-decoration:none;transition:border-color .2s}
.guia:hover{border-color:#666}
.guia img{width:100%;height:100%;object-fit:cover;min-height:220px}
.guia div{padding:26px 24px;display:flex;flex-direction:column;gap:10px}
.guia h3{font-size:24px}
.guia p{color:var(--texto-2);font-size:15px}
.guia span{margin-top:auto;font-size:14px;border-bottom:1px solid var(--rojo);align-self:flex-start;padding-bottom:2px}
.pteaser{display:grid;grid-template-columns:5fr 7fr;gap:56px;align-items:center}
.pteaser img.logo{width:min(380px,100%);height:auto}
.pteaser p{color:#d6d6d6;font-size:18px;max-width:40ch;margin:22px 0 26px}
.pteaser .ep b{display:block;margin-top:14px;font-weight:500}
.pteaser .ep small{color:var(--texto-2);font-size:13px;letter-spacing:.14em;text-transform:uppercase}
@media (max-width:960px){
  .ahero .wrap{padding-bottom:48px}
  .ahero .crumbs{margin-bottom:32px}
  .ahero p{font-size:17px}
  .linea{padding-top:64px}
  .linea + .linea{padding-top:72px}
  .lhead{flex-direction:column;align-items:flex-start;gap:14px}
  .guias{grid-template-columns:1fr}
  .guia{grid-template-columns:38% 1fr}
  .guia img{min-height:180px}
  .guia div{padding:18px 16px}
  .guia h3{font-size:19px}
  .pteaser{grid-template-columns:1fr;gap:28px}
}
@media (max-width:640px){ .guia p{display:none} }
