/* KALĀH PUBLIC · PORTADAS OFICIALES SHOPIFY v2 · 2026-10-04 */
.kalahHero{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(300px,.78fr);
  gap:42px;
  align-items:center;
}
.kalahHeroCovers{
  display:flex;
  align-items:flex-end;
  justify-content:center;
  gap:12px;
  padding:22px;
  border:1px solid rgba(213,175,69,.55);
  border-radius:24px;
  background:
    radial-gradient(circle at 50% 16%,rgba(241,217,150,.12),transparent 30%),
    rgba(7,18,28,.38);
  box-shadow:0 24px 60px rgba(0,0,0,.28);
}
.kalahHeroCovers img{
  width:28%;
  aspect-ratio:2/3;
  object-fit:cover;
  border-radius:9px;
  border:1px solid rgba(241,217,150,.72);
  box-shadow:0 16px 30px rgba(0,0,0,.34);
}
.kalahHeroCovers img:nth-child(2){
  width:33%;
  transform:translateY(-8px);
}
.kalahBooks{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:20px;
  margin-top:34px;
}
.kalahBook{
  padding:14px 14px 22px;
  border:1px solid rgba(213,175,69,.54);
  border-radius:22px;
  background:rgba(255,255,255,.045);
  box-shadow:0 18px 44px rgba(0,0,0,.18);
}
.kalahBook img{
  display:block;
  width:100%;
  aspect-ratio:2/3;
  object-fit:cover;
  border-radius:10px;
  border:1px solid rgba(241,217,150,.58);
}
.kalahBookBody{padding:16px 8px 0}
.kalahBook .num{
  margin-bottom:10px;
}
.kalahBook h3{
  margin:0 0 10px;
  color:#fff1c9;
  font-size:clamp(26px,2.8vw,36px);
  line-height:1.03;
}
.kalahBook p{
  margin:0;
  color:#e4d9d0;
  font:14px/1.6 Arial,sans-serif;
}
@media(max-width:900px){
  .kalahHero{grid-template-columns:1fr}
  .kalahHeroCovers{max-width:680px}
  .kalahBooks{grid-template-columns:1fr}
  .kalahBook{
    display:grid;
    grid-template-columns:minmax(120px,210px) minmax(0,1fr);
    gap:18px;
    align-items:center;
  }
  .kalahBookBody{padding:4px 6px}
}
@media(max-width:620px){
  .kalahHeroCovers{padding:18px 14px;gap:8px}
  .kalahHeroCovers img{width:29%}
  .kalahHeroCovers img:nth-child(2){width:34%}
  .kalahBook{
    grid-template-columns:112px minmax(0,1fr);
    padding:12px;
    gap:14px;
  }
  .kalahBook h3{font-size:24px}
  .kalahBook p{font-size:12.5px;line-height:1.5}
}
/* Ajuste móvil de contención */
html,body{max-width:100%;overflow-x:hidden}
.kalahHero>*{min-width:0}
.kalahHeroCovers{max-width:100%;overflow:hidden}
@media(max-width:520px){
  .top{align-items:center!important;overflow:hidden}
  .topnav{min-width:0;margin-left:auto}
  .topnav .primary{font-size:10px!important;padding:0 10px!important;white-space:nowrap}
  .hero{padding-left:18px!important;padding-right:18px!important}
  .hero h1{font-size:42px!important;max-width:100%!important;overflow-wrap:anywhere}
  .kalahHero{width:100%!important;max-width:100%!important}
  .kalahHeroCovers{width:100%!important}
}