/* =========================================================
   IMPRENTA BUIN — TIPS MÓVIL
   Base limpia: lectura compacta + CTA estilo Home 2026
   Reemplaza COMPLETO assets/front/tips-mobile.css
   ========================================================= */

.ibnp-cta-mobile-banner{display:none}

@media (max-width:760px){

  /* -------------------------------------------------------
     CONTENEDOR
     ------------------------------------------------------- */
  body.ibnp-guide-single .site-content{
    padding-left:0!important;
    padding-right:0!important;
  }

  body.ibnp-guide-single #primary.ibnp-single{
    width:100%!important;
    max-width:none!important;
    margin:14px auto 64px!important;
    padding:0 18px calc(116px + env(safe-area-inset-bottom))!important;
    box-sizing:border-box!important;
  }

  body.ibnp-guide-single .ibnp-article,
  body.ibnp-guide-single .ibnp-reading-layout,
  body.ibnp-guide-single .ibnp-reading{
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    box-sizing:border-box!important;
  }

  /* -------------------------------------------------------
     HERO
     ------------------------------------------------------- */
  body.ibnp-guide-single .ibnp-hero{
    grid-template-columns:1fr!important;
    overflow:hidden!important;
    border-radius:16px!important;
  }

  body.ibnp-guide-single .ibnp-hero__copy{
    padding:22px 18px 20px!important;
  }

  body.ibnp-guide-single .ibnp-kicker{
    margin-bottom:9px!important;
    font-size:9px!important;
    line-height:1.2!important;
  }

  body.ibnp-guide-single .ibnp-hero h1{
    font-size:clamp(26px,7.2vw,30px)!important;
    line-height:1.07!important;
    letter-spacing:-.035em!important;
  }

  body.ibnp-guide-single .ibnp-hero__meta{
    margin-top:11px!important;
    font-size:12px!important;
  }

  body.ibnp-guide-single .ibnp-hero__media img{
    min-height:0!important;
    max-height:none!important;
    aspect-ratio:16/9!important;
    object-fit:cover!important;
  }

  /* Índice lateral fuera en teléfono. */
  body.ibnp-guide-single .ibnp-rail{display:none!important}

  body.ibnp-guide-single .ibnp-reading-layout{
    display:block!important;
    margin-top:24px!important;
  }

  /* -------------------------------------------------------
     LECTURA — MENOS PESADA Y MEJOR SEPARADA
     ------------------------------------------------------- */
  body.ibnp-guide-single .ibnp-reading{
    color:#43516a!important;
    font-size:15.5px!important;
    line-height:1.62!important;
  }

  body.ibnp-guide-single .ibnp-reading p,
  body.ibnp-guide-single .ibnp-reading>p:first-child{
    margin:0 0 15px!important;
    color:inherit!important;
    font-size:15.5px!important;
    line-height:1.62!important;
  }

  /* Cada H2 marca visualmente una nueva sección. */
  body.ibnp-guide-single .ibnp-reading h2{
    margin:30px 0 10px!important;
    padding-top:26px!important;
    border-top:1px solid #eceff2!important;
    color:#17191c!important;
    font-size:21px!important;
    line-height:1.18!important;
    font-weight:700!important;
    letter-spacing:-.024em!important;
    text-wrap:balance!important;
  }

  body.ibnp-guide-single .ibnp-reading h3{
    margin:22px 0 8px!important;
    color:#17191c!important;
    font-size:17px!important;
    line-height:1.25!important;
    font-weight:600!important;
  }

  body.ibnp-guide-single .ibnp-reading ul,
  body.ibnp-guide-single .ibnp-reading ol{
    margin:0 0 19px!important;
    padding-left:20px!important;
  }

  body.ibnp-guide-single .ibnp-reading li{
    margin-bottom:6px!important;
    font-size:15px!important;
    line-height:1.52!important;
  }

  /* -------------------------------------------------------
     RESPUESTA RÁPIDA
     ------------------------------------------------------- */
  body.ibnp-guide-single .ibnp-answer{
    margin:0 0 24px!important;
    padding:15px 16px!important;
    border-radius:12px!important;
    box-shadow:none!important;
  }

  body.ibnp-guide-single .ibnp-answer p,
  body.ibnp-guide-single .ibnp-answer p:first-child{
    margin:0!important;
    font-size:15px!important;
    line-height:1.56!important;
  }

  /* -------------------------------------------------------
     KEYPOINTS — 2 x 2 COMPACTO
     ------------------------------------------------------- */
  body.ibnp-guide-single .ibnp-keypoints{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    margin:18px 0 26px!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
  }

  body.ibnp-guide-single .ibnp-keypoints>div{
    min-width:0!important;
    padding:12px!important;
    border:1px solid #dfe3e8!important;
    border-radius:11px!important;
    background:#f7f8fa!important;
  }

  body.ibnp-guide-single .ibnp-keypoints>div>strong{
    display:block!important;
    margin:0 0 3px!important;
    color:#17191c!important;
    font-size:13.5px!important;
    line-height:1.3!important;
    font-weight:750!important;
  }

  body.ibnp-guide-single .ibnp-keypoints>div>span{
    display:block!important;
    min-width:0!important;
    color:#536078!important;
    font-size:12.5px!important;
    line-height:1.35!important;
    overflow-wrap:anywhere!important;
  }

  /* -------------------------------------------------------
     CARDS / COMPARE / CHECKS
     ------------------------------------------------------- */
  body.ibnp-guide-single .ibnp-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    margin:18px 0 26px!important;
  }

  body.ibnp-guide-single .ibnp-card-grid>div{
    padding:13px!important;
    border-radius:11px!important;
  }

  body.ibnp-guide-single .ibnp-card-grid strong{
    font-size:13.5px!important;
    line-height:1.3!important;
  }

  body.ibnp-guide-single .ibnp-card-grid p{
    margin-top:5px!important;
    font-size:12.5px!important;
    line-height:1.42!important;
  }

  body.ibnp-guide-single div.ibnp-compare{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
    width:100%!important;
    min-width:0!important;
    margin:18px 0 26px!important;
  }

  body.ibnp-guide-single div.ibnp-compare>div{
    width:100%!important;
    min-width:0!important;
    padding:14px!important;
    border-radius:11px!important;
  }

  body.ibnp-guide-single .ibnp-reading div.ibnp-checks>ul,
  body.ibnp-guide-single .ibnp-reading ul.ibnp-checks{
    grid-template-columns:1fr!important;
    gap:6px!important;
    margin:18px 0 26px!important;
  }

  body.ibnp-guide-single .ibnp-reading .ibnp-checks li{
    margin:0!important;
    font-size:14.5px!important;
    line-height:1.5!important;
  }

  /* -------------------------------------------------------
     TABLAS — 2 COLUMNAS COMO FILAS/CARDS, SIN DESBORDE
     ------------------------------------------------------- */
  body.ibnp-guide-single .ibnp-table-wrap,
  body.ibnp-guide-single .ibnp-reading .wp-block-table,
  body.ibnp-guide-single .ibnp-faq-table-wrap{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:18px 0 26px!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
  }

  /* Tablas exactamente de 2 columnas. */
  body.ibnp-guide-single .ibnp-table-wrap table:has(>thead>tr:first-child>*:nth-child(2):last-child),
  body.ibnp-guide-single .ibnp-table-wrap table:has(>tbody>tr:first-child>*:nth-child(2):last-child){
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
    border:0!important;
    background:transparent!important;
  }

  body.ibnp-guide-single .ibnp-table-wrap table:has(>thead>tr:first-child>*:nth-child(2):last-child) thead,
  body.ibnp-guide-single .ibnp-table-wrap table:has(>tbody>tr:first-child>*:nth-child(2):last-child) thead{
    display:none!important;
  }

  body.ibnp-guide-single .ibnp-table-wrap table:has(>thead>tr:first-child>*:nth-child(2):last-child) tbody,
  body.ibnp-guide-single .ibnp-table-wrap table:has(>tbody>tr:first-child>*:nth-child(2):last-child) tbody{
    display:grid!important;
    gap:7px!important;
    width:100%!important;
  }

  body.ibnp-guide-single .ibnp-table-wrap table:has(>thead>tr:first-child>*:nth-child(2):last-child) tbody tr,
  body.ibnp-guide-single .ibnp-table-wrap table:has(>tbody>tr:first-child>*:nth-child(2):last-child) tbody tr{
    display:grid!important;
    grid-template-columns:minmax(82px,30%) minmax(0,1fr)!important;
    width:100%!important;
    overflow:hidden!important;
    border:1px solid #dfe3e8!important;
    border-radius:10px!important;
    background:#fff!important;
  }

  body.ibnp-guide-single .ibnp-table-wrap table:has(>thead>tr:first-child>*:nth-child(2):last-child) tbody td,
  body.ibnp-guide-single .ibnp-table-wrap table:has(>tbody>tr:first-child>*:nth-child(2):last-child) tbody td{
    display:block!important;
    min-width:0!important;
    padding:10px 11px!important;
    border:0!important;
    color:#43516a!important;
    font-size:13.5px!important;
    line-height:1.4!important;
    text-align:left!important;
    white-space:normal!important;
    word-break:normal!important;
    overflow-wrap:anywhere!important;
    hyphens:none!important;
  }

  body.ibnp-guide-single .ibnp-table-wrap table:has(>thead>tr:first-child>*:nth-child(2):last-child) tbody td:first-child,
  body.ibnp-guide-single .ibnp-table-wrap table:has(>tbody>tr:first-child>*:nth-child(2):last-child) tbody td:first-child{
    background:#f5f6f7!important;
    color:#17191c!important;
    font-weight:750!important;
  }

  /* 3+ columnas: scroll SOLO dentro del bloque, ancho moderado. */
  body.ibnp-guide-single .ibnp-table-wrap:has(table tr:first-child>*:nth-child(3)){
    overflow-x:auto!important;
    overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    border:1px solid #dfe3e8!important;
    border-radius:11px!important;
    background:#fff!important;
  }

  body.ibnp-guide-single .ibnp-table-wrap table:has(tr:first-child>*:nth-child(3)){
    width:100%!important;
    min-width:520px!important;
    margin:0!important;
    border-collapse:collapse!important;
    table-layout:auto!important;
  }

  body.ibnp-guide-single .ibnp-table-wrap table:has(tr:first-child>*:nth-child(3)) th,
  body.ibnp-guide-single .ibnp-table-wrap table:has(tr:first-child>*:nth-child(3)) td{
    padding:10px 11px!important;
    font-size:13px!important;
    line-height:1.4!important;
    vertical-align:top!important;
  }

  /* -------------------------------------------------------
     NOTAS / ADVERTENCIAS
     ------------------------------------------------------- */
  body.ibnp-guide-single .ibnp-note,
  body.ibnp-guide-single .ibnp-warning,
  body.ibnp-guide-single .ibnp-stat,
  body.ibnp-guide-single .ibnp-related,
  body.ibnp-guide-single .ibnp-sources{
    margin:18px 0 24px!important;
    padding:14px 15px!important;
    border-radius:11px!important;
  }

  body.ibnp-guide-single .ibnp-note p,
  body.ibnp-guide-single .ibnp-warning p,
  body.ibnp-guide-single .ibnp-stat p,
  body.ibnp-guide-single .ibnp-related p,
  body.ibnp-guide-single .ibnp-sources p{
    font-size:14.5px!important;
    line-height:1.52!important;
  }

  /* -------------------------------------------------------
     IMÁGENES DE LECTURA
     ------------------------------------------------------- */
  body.ibnp-guide-single .ibnp-feature-repeat{display:none!important}

  body.ibnp-guide-single .ibnp-reading figure.wp-block-image,
  body.ibnp-guide-single .ibnp-reading .wp-block-image{
    width:100%!important;
    margin:20px 0 26px!important;
  }

  body.ibnp-guide-single .ibnp-reading img{
    max-width:100%!important;
    height:auto!important;
  }

  /* -------------------------------------------------------
     CTA FINAL — MISMO LENGUAJE DEL HOME 2026
     ------------------------------------------------------- */

  /* La imagen destacada se mantiene como banner superior. */
  body.ibnp-guide-single .ibnp-cta-mobile-banner{
    display:block!important;
    width:calc(100% + 36px)!important;
    margin:28px 0 0 -18px!important;
    padding:0!important;
    overflow:hidden!important;
    border:0!important;
    border-radius:0!important;
    background:#e7e9ec!important;
  }

  body.ibnp-guide-single .ibnp-cta-mobile-banner img{
    display:block!important;
    width:100%!important;
    height:118px!important;
    margin:0!important;
    object-fit:cover!important;
    object-position:center!important;
    border:0!important;
    border-radius:0!important;
  }

  body.ibnp-guide-single .ibnp-cta{
    position:relative!important;
    display:block!important;
    width:calc(100% + 36px)!important;
    margin:0 0 34px -18px!important;
    padding:42px 24px!important;
    box-sizing:border-box!important;
    border:0!important;
    border-radius:0!important;
    background:#191c21!important;
    color:#fff!important;
    box-shadow:none!important;
  }

  /* Eyebrow del Home. */
  body.ibnp-guide-single .ibnp-cta::before{
    content:"TIENDA Y COTIZACIÓN"!important;
    display:block!important;
    margin:0 0 14px!important;
    color:#9ca3ad!important;
    font-size:10px!important;
    line-height:1.2!important;
    font-weight:800!important;
    letter-spacing:.16em!important;
    text-transform:uppercase!important;
  }

  body.ibnp-guide-single .ibnp-cta>div:first-child{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    text-align:left!important;
  }

  body.ibnp-guide-single .ibnp-cta strong{
    display:block!important;
    max-width:330px!important;
    margin:0!important;
    color:#fff!important;
    font-size:clamp(25px,7.5vw,31px)!important;
    line-height:1.08!important;
    font-weight:800!important;
    letter-spacing:-.035em!important;
    text-align:left!important;
    text-wrap:balance!important;
  }

  body.ibnp-guide-single .ibnp-cta p{
    max-width:340px!important;
    margin:14px 0 0!important;
    color:#b9c0c8!important;
    font-size:14px!important;
    line-height:1.6!important;
    text-align:left!important;
  }

  body.ibnp-guide-single .ibnp-cta__actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    width:100%!important;
    margin:26px 0 0!important;
    padding:0!important;
    gap:9px!important;
  }

  body.ibnp-guide-single .ibnp-cta__actions .ibnp-btn,
  body.ibnp-guide-single .ibnp-cta__actions a{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    height:48px!important;
    min-height:48px!important;
    margin:0!important;
    /* Safari/iOS: 2px extra abajo corrigen ópticamente la métrica de la fuente
       sin envolver el texto en spans ni alterar el HTML del Tip. */
    padding:0 18px 2px!important;
    box-sizing:border-box!important;
    border:1px solid #e4003a!important;
    border-radius:9px!important;
    background:#e4003a!important;
    color:#fff!important;
    font-family:inherit!important;
    font-size:13px!important;
    line-height:1!important;
    font-weight:800!important;
    white-space:normal!important;
    text-align:center!important;
    text-decoration:none!important;
    box-shadow:none!important;
    transform:none!important;
  }

  body.ibnp-guide-single .ibnp-cta__actions .ibnp-btn--secondary{
    border-color:rgba(255,255,255,.30)!important;
    background:transparent!important;
    color:#fff!important;
  }

  /* -------------------------------------------------------
     FAQ
     ------------------------------------------------------- */
  body.ibnp-guide-single .ibnp-faq,
  body.ibnp-guide-single .ibnp-reading .ib-faq-producto{
    margin-top:28px!important;
  }

  body.ibnp-guide-single .ibnp-faq details,
  body.ibnp-guide-single .ibnp-reading .ib-faq-producto details{
    margin-inline:0!important;
    padding-inline:0!important;
    border-radius:0!important;
  }

  body.ibnp-guide-single .ibnp-faq summary,
  body.ibnp-guide-single .ibnp-reading .ib-faq-producto summary{
    padding:14px 34px 14px 0!important;
    font-size:14.5px!important;
    line-height:1.38!important;
  }
}

@media (max-width:390px){
  body.ibnp-guide-single #primary.ibnp-single{
    padding-left:16px!important;
    padding-right:16px!important;
  }

  body.ibnp-guide-single .ibnp-hero h1{font-size:26px!important}
  body.ibnp-guide-single .ibnp-reading h2{font-size:20px!important}

  body.ibnp-guide-single .ibnp-keypoints{
    grid-template-columns:1fr 1fr!important;
  }

  body.ibnp-guide-single .ibnp-card-grid{
    grid-template-columns:1fr!important;
  }

  body.ibnp-guide-single .ibnp-cta-mobile-banner{
    width:calc(100% + 32px)!important;
    margin-left:-16px!important;
  }

  body.ibnp-guide-single .ibnp-cta-mobile-banner img{
    height:108px!important;
  }

  body.ibnp-guide-single .ibnp-cta{
    width:calc(100% + 32px)!important;
    margin-left:-16px!important;
    padding:38px 20px!important;
  }

  body.ibnp-guide-single .ibnp-cta strong{
    font-size:25px!important;
  }
}
