/* V191 · Home responsive + hero corto + plantillas 3x3 */
.ab188-hero{
  min-height:calc(100svh - 74px);
  display:flex!important;
  align-items:center!important;
  padding:clamp(34px,5vw,70px) 18px clamp(44px,6vw,76px)!important;
}
.ab188-hero-grid{
  width:min(1120px,92vw)!important;
  grid-template-columns:minmax(0,.9fr) minmax(300px,.62fr)!important;
  gap:clamp(24px,5vw,72px)!important;
}
.ab188-hero-copy{
  max-width:620px!important;
}
.ab188-kicker{
  font-size:11px!important;
  padding:7px 12px!important;
  letter-spacing:.075em!important;
}
.ab188-hero h1{
  max-width:620px!important;
  margin:16px 0 14px!important;
  font-size:clamp(48px,6.2vw,76px)!important;
  line-height:.92!important;
  letter-spacing:-.065em!important;
  text-wrap:balance!important;
}
.ab188-hero-copy>p{
  max-width:560px!important;
  font-size:clamp(16px,1.45vw,19px)!important;
  line-height:1.55!important;
  margin:0!important;
  color:rgba(255,239,247,.88)!important;
}
.ab188-hero-actions{
  margin:24px 0 0!important;
}
.ab188-preview-card{
  min-height:420px!important;
  max-width:390px!important;
  justify-self:center!important;
}
.ab188-heart-ring{
  width:160px!important;
  font-size:62px!important;
  margin:42px auto 22px!important;
}
.ab188-preview-card h2{
  font-size:clamp(36px,4.6vw,48px)!important;
}
.ab188-preview-card p{
  font-size:16px!important;
  line-height:1.55!important;
}
.ab188-preview-card::after{
  content:"Música propia · QR · Enlace"!important;
}
.ab188-featured{
  width:min(1120px,92vw)!important;
  padding-top:clamp(46px,6vw,76px)!important;
}
.ab188-featured .ab188-section-head{
  margin-bottom:24px!important;
}
.ab188-featured .ab188-section-head h2{
  font-size:clamp(34px,4.6vw,50px)!important;
  text-wrap:balance!important;
}
.ab188-featured .ab188-section-head p{
  max-width:520px!important;
  font-size:16px!important;
  line-height:1.55!important;
}
.ab188-featured-grid,
.grid.featured-grid.home-featured-grid-v61.home-featured-grid-v65.ab188-featured-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:18px!important;
  align-items:stretch!important;
}
.ab188-featured-grid .template-card{
  width:100%!important;
  height:100%!important;
  display:flex!important;
  flex-direction:column!important;
  border-radius:24px!important;
  overflow:hidden!important;
}
.ab188-featured-grid .thumb{
  height:170px!important;
  margin:10px 10px 0!important;
  border-radius:18px!important;
  overflow:hidden!important;
}
.ab188-featured-grid .card-body{
  flex:1!important;
  display:flex!important;
  flex-direction:column!important;
  gap:9px!important;
  padding:14px!important;
}
.ab188-featured-grid .card-topline{
  min-height:52px!important;
  align-items:flex-start!important;
}
.ab188-featured-grid .card-topline h3{
  font-size:clamp(18px,1.55vw,24px)!important;
  line-height:1!important;
  margin:0!important;
}
.ab188-featured-grid .card-body p{
  min-height:54px!important;
  max-height:58px!important;
  overflow:hidden!important;
  font-size:13.5px!important;
  line-height:1.42!important;
  margin:0!important;
}
.ab188-featured-grid .mini-benefits{
  min-height:24px!important;
  margin:4px 0!important;
}
.ab188-featured-grid .card-meta{
  font-size:13px!important;
  line-height:1.4!important;
}
.ab188-featured-grid .card-actions{
  margin-top:auto!important;
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:8px!important;
}
.ab188-featured-grid .card-actions .btn{
  min-height:44px!important;
  padding:10px 12px!important;
  border-radius:16px!important;
}
.ab188-featured-grid .share-actions{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:7px!important;
}
.ab188-featured-grid .share-actions a,
.ab188-featured-grid .share-actions button{
  min-height:32px!important;
  padding:7px 10px!important;
  font-size:11px!important;
  border-radius:12px!important;
}
@media(max-width:1024px){
  .ab188-hero{min-height:auto!important;}
  .ab188-hero-grid{grid-template-columns:1fr!important;}
  .ab188-hero-copy{max-width:760px!important;}
  .ab188-hero h1{max-width:760px!important;font-size:clamp(44px,8.7vw,68px)!important;}
  .ab188-preview-card{max-width:500px!important;justify-self:start!important;}
  .ab188-featured-grid,
  .grid.featured-grid.home-featured-grid-v61.home-featured-grid-v65.ab188-featured-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
@media(max-width:640px){
  .ab188-hero{
    padding:26px 14px 42px!important;
  }
  .ab188-hero-grid,
  .ab188-featured{
    width:min(100% - 20px,520px)!important;
  }
  .ab188-hero-copy{
    text-align:left!important;
  }
  .ab188-kicker{
    width:100%!important;
    justify-content:center!important;
    text-align:center!important;
    font-size:10px!important;
  }
  .ab188-hero h1{
    font-size:clamp(38px,12vw,54px)!important;
    line-height:.94!important;
    max-width:100%!important;
  }
  .ab188-hero-copy>p{
    font-size:15.5px!important;
    line-height:1.5!important;
    max-width:100%!important;
  }
  .ab188-hero-actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
  }
  .ab188-hero-actions .ab188-btn{
    width:100%!important;
    min-height:50px!important;
  }
  .ab188-preview-card{
    width:100%!important;
    max-width:100%!important;
    min-height:330px!important;
    padding:22px!important;
    border-radius:28px!important;
  }
  .ab188-phone-top b{font-size:13px!important;}
  .ab188-heart-ring{width:128px!important;font-size:50px!important;margin:44px auto 18px!important;}
  .ab188-preview-card h2{font-size:38px!important;}
  .ab188-preview-card p{font-size:15px!important;}
  .ab188-featured .ab188-section-head{
    display:grid!important;
    gap:14px!important;
    text-align:left!important;
  }
  .ab188-featured .ab188-section-head .ab188-btn{
    width:100%!important;
  }
  .ab188-featured-grid,
  .grid.featured-grid.home-featured-grid-v61.home-featured-grid-v65.ab188-featured-grid{
    grid-template-columns:1fr!important;
    gap:16px!important;
  }
  .ab188-featured-grid .thumb{height:190px!important;}
  .ab188-featured-grid .card-topline{min-height:auto!important;}
  .ab188-featured-grid .card-body p{min-height:auto!important;max-height:60px!important;}
  .ab188-featured-grid .card-actions{grid-template-columns:1fr 1fr!important;}
}
@media(max-width:390px){
  .ab188-hero h1{font-size:36px!important;}
  .ab188-featured-grid .card-actions{grid-template-columns:1fr!important;}
}