/* ============================================================
   Mi moto — páginas (Compra segura + Políticas)
   TODO va scopeado bajo .mm-cs / .mm-pol para NO afectar el tema.
   Sin resets globales (*), sin tocar header/footer.
   ============================================================ */

.mm-cs, .mm-pol{
  --ink:#17171B; --paper:#F7F6F2; --card:#FFFFFF;
  --red:#DA291C; --red-d:#A11A12; --steel:#2C5F8A; --steel-l:#E8EEF4;
  --t1:#1A1A1E; --t2:#5B5B60; --t3:#8A8A90;
  --green:#128C4A; --line:#E4E2DB; --line-d:#CFCCC3;
  --disp:'Barlow Condensed',system-ui,sans-serif; --body:'Barlow',system-ui,sans-serif;
  --ease:cubic-bezier(.2,.7,.3,1);
  font-family:var(--body); color:var(--t1); line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
/* ANCHO COMPLETO: rompe la columna central del tema (full-bleed) para que las
   bandas (hero, idbar, polbar) lleguen de borde a borde, como en la maqueta.
   El contenido legible sigue centrado por .wrap (máx 1080px). */
.mm-cs{
  position:relative;
  width:100vw;
  max-width:100vw !important;
  margin-left:calc(50% - 50vw) !important;
  margin-right:calc(50% - 50vw) !important;
  left:0;
  overflow-x:hidden;
}
/* Recorta el sobrante horizontal que deja el ancho de la barra de scroll
   (la franja blanca / el desplazamiento). Solo en páginas con nuestra portada.
   'clip' no crea contenedor de scroll, así que NO rompe headers sticky. */
body:has(.mm-cs){ overflow-x:hidden; overflow-x:clip; }
.mm-cs .polbar{background:#F1EFE8;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
/* reset acotado (solo dentro de nuestros contenedores) */
.mm-cs *, .mm-pol *{box-sizing:border-box;}
.mm-cs :where(h1,h2,h3,h4,p,ul,li,figure){margin:0;padding:0;}
.mm-cs ul, .mm-pol ul{list-style:none;}
.mm-cs a, .mm-pol a{color:inherit;text-decoration:none;}
.mm-cs .wrap, .mm-pol .wrap{max-width:1080px;margin:0 auto;padding:0 22px;}
.mm-cs .eyebrow{font-family:var(--disp);text-transform:uppercase;letter-spacing:.14em;font-size:12px;font-weight:600;color:var(--t3);}
.mm-cs .chip{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:23px;background:var(--steel-l);color:var(--steel);flex:none;}
.mm-cs .btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--disp);text-transform:uppercase;letter-spacing:.04em;font-weight:600;font-size:16px;padding:12px 24px;border-radius:6px;cursor:pointer;border:1.5px solid transparent;}
.mm-cs .btn-green{background:var(--green);color:#fff;}
.mm-cs :focus-visible, .mm-pol :focus-visible{outline:3px solid var(--steel);outline-offset:2px;}

/* HERO */
.mm-cs .hero{background:var(--ink);color:#fff;position:relative;overflow:hidden;border-bottom:4px solid var(--red);padding:0;}
.mm-cs .hero::before{content:"";position:absolute;inset:0;background-image:repeating-linear-gradient(125deg,rgba(255,255,255,.06) 0 1px,transparent 1px 15px),repeating-linear-gradient(55deg,rgba(218,41,28,.09) 0 1px,transparent 1px 22px);-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,1),rgba(0,0,0,.55));mask-image:linear-gradient(180deg,rgba(0,0,0,1),rgba(0,0,0,.55));}
.mm-cs .hero::after{content:"";position:absolute;top:-40%;right:-10%;width:420px;height:420px;background:radial-gradient(circle,rgba(218,41,28,.22),transparent 70%);}
.mm-cs .hero .wrap{position:relative;padding:52px 22px;}
.mm-cs .tag{display:inline-flex;align-items:center;gap:8px;background:rgba(218,41,28,.2);color:#F3A79F;border:1px solid rgba(218,41,28,.5);font-family:var(--disp);text-transform:uppercase;letter-spacing:.1em;font-size:12px;font-weight:600;padding:6px 13px;border-radius:20px;}
.mm-cs .hero h1{font-family:var(--disp);text-transform:uppercase;font-weight:700;font-size:clamp(32px,5vw,52px);margin:14px 0 8px;max-width:20ch;}
.mm-cs .hero h1 em{font-style:normal;color:#EE2A1E;}
.mm-cs .hero p{color:#B9B9B4;font-size:18px;max-width:56ch;}

.mm-cs section{padding:46px 0;}
.mm-cs .sec-head{margin-bottom:22px;}
.mm-cs .sec-head h2{font-family:var(--disp);text-transform:uppercase;font-weight:700;font-size:30px;}
.mm-cs .sec-head p{color:var(--t2);font-size:16px;margin-top:4px;max-width:70ch;}

/* Tips */
.mm-cs .tips{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.mm-cs .tip{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:22px;position:relative;overflow:hidden;transition:transform .2s var(--ease),box-shadow .2s var(--ease),border-color .18s;}
.mm-cs .tip::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:0;background:var(--steel);transition:width .28s var(--ease);}
.mm-cs .tip:hover{transform:translateY(-5px);box-shadow:0 14px 30px rgba(20,20,25,.1);border-color:var(--line-d);}
.mm-cs .tip:hover::after{width:100%;}
.mm-cs .tip .chip{margin-bottom:12px;}
.mm-cs .tip h3{font-family:var(--disp);text-transform:uppercase;font-weight:600;font-size:19px;line-height:1.1;}
.mm-cs .tip p{color:var(--t2);font-size:14.5px;margin-top:6px;}

/* Never */
.mm-cs .never{background:var(--ink);color:#fff;border-radius:16px;padding:30px 32px;margin-top:12px;}
.mm-cs .never .eyebrow{color:#9EC2E2;}
.mm-cs .never h3{font-family:var(--disp);text-transform:uppercase;font-weight:700;font-size:26px;margin:6px 0 14px;}
.mm-cs .never ul{display:grid;grid-template-columns:1fr 1fr;gap:10px 26px;}
.mm-cs .never li{display:flex;align-items:flex-start;gap:10px;color:#CFCFCA;font-size:15px;}
.mm-cs .never li .x{color:var(--red);font-weight:700;flex:none;}

/* Identidad / datos */
.mm-cs .idbar{background:var(--steel-l);border-top:1px solid #D4E0EC;border-bottom:1px solid #D4E0EC;}
.mm-cs .idgrid{display:grid;grid-template-columns:1.2fr 1fr;gap:18px;}
.mm-cs .idcard{background:#fff;border:1px solid var(--line);border-radius:14px;padding:24px;}
.mm-cs .idcard h3{font-family:var(--disp);text-transform:uppercase;font-weight:700;font-size:22px;margin-bottom:14px;}
.mm-cs .idrow{display:flex;align-items:flex-start;gap:12px;padding:10px 0;border-top:1px solid var(--line);}
.mm-cs .idrow:first-of-type{border-top:none;}
.mm-cs .idrow .chip{width:38px;height:38px;font-size:18px;border-radius:9px;}
.mm-cs .idrow .k{font-family:var(--disp);text-transform:uppercase;letter-spacing:.06em;font-size:12px;color:var(--t3);}
.mm-cs .idrow .v{font-size:15.5px;color:var(--t1);font-weight:500;}
.mm-cs .idrow .v a{color:var(--steel);}
.mm-cs .pays h3{font-family:var(--disp);text-transform:uppercase;font-weight:700;font-size:22px;margin-bottom:6px;}
.mm-cs .pays p{color:var(--t2);font-size:14px;margin-bottom:14px;}
.mm-cs .paylogos{display:flex;flex-wrap:wrap;gap:10px;}
.mm-cs .paylogos span{background:#fff;border:1px solid var(--line);border-radius:9px;padding:12px 14px;font-family:var(--disp);text-transform:uppercase;letter-spacing:.03em;font-weight:600;font-size:14px;color:var(--t1);display:flex;align-items:center;gap:7px;}
.mm-cs .paylogos span i{color:var(--green);font-style:normal;}
.mm-cs .sslnote{margin-top:14px;color:var(--t2);font-size:13.5px;display:flex;align-items:center;gap:8px;}

/* WhatsApp band */
.mm-cs .wa{background:var(--green);color:#fff;border-radius:14px;padding:24px 30px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;}
.mm-cs .wa h3{font-family:var(--disp);text-transform:uppercase;font-weight:600;font-size:24px;}
.mm-cs .wa p{color:#D6F0E0;font-size:15px;}
.mm-cs .wa .btn{background:#fff;color:var(--green);}

/* ============================================================
   POLÍTICAS (shortcode reutilizable [mimoto_politicas])
   ============================================================ */
.mm-pol{padding:8px 0;}
.mm-pol .polbar{background:#F1EFE8;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.mm-pol .sec-head{margin-bottom:22px;}
.mm-pol .sec-head h2{font-family:var(--disp);text-transform:uppercase;font-weight:700;font-size:30px;color:var(--t1);}
.mm-pol .sec-head p{color:var(--t2);font-size:16px;margin-top:4px;}
.mm-pol .pols{display:grid;grid-template-columns:repeat(var(--cols,4),1fr);gap:14px;}
.mm-pol .pol{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:20px;display:block;position:relative;overflow:hidden;transition:transform .2s var(--ease),box-shadow .2s var(--ease),border-color .18s;}
.mm-pol .pol::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:0;background:var(--red);transition:width .28s var(--ease);}
.mm-pol .pol:hover{transform:translateY(-5px);box-shadow:0 14px 30px rgba(20,20,25,.1);border-color:var(--line-d);}
.mm-pol .pol:hover::after{width:100%;}
.mm-pol .pol .chip{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:22px;margin-bottom:12px;background:#FCEBEB;color:var(--red);flex:none;}
.mm-pol .pol h4{font-family:var(--disp);text-transform:uppercase;font-weight:600;font-size:18px;color:var(--t1);}
.mm-pol .pol .go{font-family:var(--disp);text-transform:uppercase;letter-spacing:.05em;font-weight:600;font-size:13px;color:var(--red);margin-top:8px;display:inline-block;}

@media(max-width:900px){
  .mm-cs .tips{grid-template-columns:1fr 1fr;}
  .mm-pol .pols{grid-template-columns:1fr 1fr;}
  .mm-cs .never ul{grid-template-columns:1fr;}
  .mm-cs .idgrid{grid-template-columns:1fr;}
}
@media(max-width:560px){
  .mm-cs .tips{grid-template-columns:1fr;}
  .mm-pol .pols{grid-template-columns:1fr;}
  .mm-cs .hero h1{font-size:32px;}
}
@media(prefers-reduced-motion:reduce){
  .mm-cs *, .mm-pol *{transition:none!important;}
}
