/* Portada 2026-10: aviso superior, hero con celular, banda de confianza, producto en vivo y barra fija en celular.
   Se carga solo en la portada, después de site.css y animaciones.css. */

/* aviso superior */
.ann{background:var(--blue);color:var(--white);font:500 14px/1.4 var(--body);text-align:center;padding:9px 20px}
.ann a{color:var(--white);font-weight:600;text-underline-offset:3px;white-space:nowrap}

/* botón principal en menta */
.btn-mint{background:var(--mint);border-color:var(--mint);color:var(--ink)}
.btn-mint:hover{background:#5cf0d6;border-color:#5cf0d6}

/* hero */
.hero-v2 .hero-in{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:40px;padding-block:64px 0;align-items:end}
.hero-v2 .hero-copy{padding-bottom:64px}
.hero-v2 h1{font-size:clamp(34px,4.4vw,54px)}
.hero-v2 .eyebrow{display:block;font:600 14px var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--mint);margin-bottom:16px}
.hero-v2 .hero-sub{margin-block:20px 28px}
.hero-v2 .hero-cta{align-items:center}
.hero-link{color:#c3cdf5;font-weight:500;text-underline-offset:4px;padding:8px 4px}
.hero-link:hover{color:var(--white)}
.hero-price{margin-top:22px;color:#aab6ea;font-size:15px}
.hero-price b{color:var(--mint);font-weight:600}

/* celular ilustrativo */
.tel{position:relative;justify-self:center;width:280px;max-width:100%;background:#1b2566;border-radius:38px 38px 0 0;padding:12px 12px 0;box-shadow:0 30px 60px rgba(0,0,0,.35)}
.tel-in{background:#f5f7fc;border-radius:28px 28px 0 0;overflow:hidden;color:#161b3d;font-size:13px}
.tel-top{display:flex;justify-content:space-between;padding:10px 18px 6px;font:600 11px var(--body);color:#525a7c}
.tel-head{padding:4px 18px 12px}
.tel-head small{display:block;color:#525a7c;font-size:11.5px}
.tel-head b{font:700 18px var(--display);color:#070b2e}
.tel-map{position:relative;margin:0 12px;height:150px;border-radius:14px;overflow:hidden;background:#dfe6f7}
.tel-map svg{display:block;width:100%;height:100%}
.tel-card{margin:12px;background:#fff;border:1px solid #dde2f1;border-radius:14px;padding:12px;display:grid;grid-template-columns:auto 1fr;gap:4px 10px;align-items:center}
.tel-ok{grid-row:span 2;width:34px;height:34px;border-radius:50%;background:#dcf7f1;color:#0e9d85;display:grid;place-items:center}
.tel-ok svg{width:18px;height:18px}
.tel-card b{font-size:13.5px;color:#070b2e}
.tel-card span{font-size:12px;color:#525a7c}
.tel-row{display:flex;gap:8px;margin:0 12px}
.tel-row div{flex:1;background:#fff;border:1px solid #dde2f1;border-radius:10px;padding:8px 10px;font-size:11px;color:#525a7c}
.tel-row div b{display:block;font-size:13px;color:#070b2e}
.tel-btn{margin:12px 12px 0;background:#0028d0;color:#fff;text-align:center;font-weight:600;border-radius:12px 12px 0 0;padding:14px 10px 18px}
.tel-nota{position:absolute;left:0;right:0;top:-24px;text-align:center;font-size:12px;color:#8e9de0}

/* banda de confianza */
.trust{background:var(--white);border-bottom:1px solid var(--line)}
.trust-in{display:grid;grid-template-columns:repeat(4,1fr)}
.trust-in>div{padding:26px 22px;display:flex;flex-direction:column;gap:4px;border-left:1px solid var(--line)}
.trust-in>div:first-child{border-left:0;padding-left:0}
.trust strong{font:700 26px/1.1 var(--display);color:var(--ink);letter-spacing:-.01em}
.trust strong em{font-style:normal;color:var(--mint-d)}
.trust span{font-size:14.5px;color:var(--muted)}

/* perfiles dentro de sectores */
.pf{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:36px}
.pf a{display:flex;flex-direction:column;gap:4px;padding:18px 20px;border:1px solid var(--line);border-radius:var(--r);background:var(--white);text-decoration:none;color:var(--text);transition:border-color .15s,transform .15s}
.pf a:hover{border-color:var(--blue);transform:translateY(-2px)}
.pf b{font:600 17px var(--display);color:var(--ink)}
.pf span{font-size:14.5px;color:var(--muted)}

/* producto: operación en vivo + módulos */
.prod{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:40px;align-items:start}
.prod .of{margin-top:0}
.mlist{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.mlist li{display:grid;grid-template-columns:auto 1fr;gap:2px 14px;padding:12px 0;border-bottom:1px solid var(--line)}
.mlist li:last-child{border-bottom:0}
.mlist .ic{grid-row:span 2;width:24px;height:24px;color:var(--blue);margin-top:2px}
.mlist b{font:600 16.5px var(--display);color:var(--ink)}
.mlist span{font-size:14.5px;color:var(--muted)}

/* cumplimiento + reforma en fondo claro */
.comp .rf-grid{margin-block:36px 28px}
.comp .rf-card{background:var(--white);border-color:var(--line)}
.comp .rf-card:hover{border-color:var(--blue)}
.comp .rf-card b{color:var(--blue)}
.comp .rf-card span{color:var(--muted)}
.comp .pain h3{font-size:18px}

/* barra fija en celular */
.mbar{display:none}

@media (max-width:1020px){
  .hero-v2 .hero-in{grid-template-columns:1fr;padding-top:52px}
  .hero-v2 .hero-copy{padding-bottom:20px}
  .prod{grid-template-columns:1fr}
  .trust-in{grid-template-columns:repeat(2,1fr)}
  .trust-in>div:nth-child(3){border-left:0;padding-left:0}
  .trust-in>div:nth-child(n+3){border-top:1px solid var(--line)}
}
@media (max-width:620px){
  .ann{font-size:13px;padding-inline:16px}
  .hero-v2 .hero-cta .btn{width:100%}
  .hero-link{width:100%;text-align:center}
  .tel{width:250px}
  .pf{grid-template-columns:1fr}
  .trust-in>div{padding:18px 12px}
  .trust strong{font-size:21px}
  .mbar{display:flex;gap:8px;position:fixed;left:0;right:0;bottom:0;z-index:70;background:rgba(255,255,255,.97);border-top:1px solid var(--line);padding:10px max(12px,env(safe-area-inset-right,0px)) calc(10px + env(safe-area-inset-bottom,0px)) max(12px,env(safe-area-inset-left,0px));box-shadow:0 -6px 20px rgba(7,11,46,.08)}
  .mbar a{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:12px;border-radius:9px;font:600 15px var(--body);text-decoration:none}
  .mbar .m1{background:var(--blue);color:var(--white)}
  .mbar .m2{background:#1faa59;color:var(--white)}
  .mbar .ic{width:20px;height:20px}
  .has-mbar .wa-float{display:none}
  .has-mbar .foot{padding-bottom:80px}
}

/* Banda de clientes (herramientas-seo/clientes.py) */
.clientes{background:var(--white);border-bottom:1px solid var(--line)}
.clientes-in{display:flex;align-items:center;gap:36px;padding:22px 0}
.clientes p{margin:0;font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);max-width:190px;line-height:1.35}
.clientes ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:20px 44px}
.clientes li{display:flex;align-items:center;gap:14px}
.clientes li a{display:block;opacity:.85;transition:opacity .2s}
.clientes li a:hover{opacity:1}
.clientes img{display:block;height:auto}
.clientes li span{font-size:13.5px;color:var(--muted);max-width:150px;line-height:1.3}
@media (max-width:720px){
  .clientes-in{flex-direction:column;align-items:flex-start;gap:14px;padding:18px 0}
  .clientes p{max-width:none}
  .clientes ul{gap:16px 28px}
}