/* ============================================================
   SITIO FINAL · navegación y orden de la información (se carga al final)
   Brief: _briefs/BRIEF-SITIO-FINAL.md §4 (navegación) y §5 (reglas de diseño)
   Menú de 6 + «Hablemos» · barra de 7 segmentos · menú móvil a pantalla completa
   · índice de página · migas · paginador «Paso X de 7» · pie con mapa
   Un solo tema (claro): data-theme="light" en <html> apaga el modo oscuro de comercial.css
   ============================================================ */

/* ---------- cabecera ---------- */
.top{border-bottom:0}
.top .wrap{gap:12px;min-height:64px}
.top .brand{min-height:44px}
.top .brand img.wm{height:30px}
.snav{display:flex;align-items:stretch;margin-left:auto}
.snav a{display:flex;align-items:center;gap:7px;min-height:64px;padding:0 13px;font:800 15px/1 var(--display);text-transform:uppercase;color:var(--gris);text-decoration:none;white-space:nowrap;border-bottom:4px solid transparent;margin-bottom:-4px}
.snav a i{font:700 11px/1 var(--mono);font-style:normal;color:var(--g4)}
.snav a:hover{color:var(--naranja)}
.snav a[aria-current]{color:var(--naranja);border-bottom-color:var(--naranja)}
.snav a[aria-current] i{color:var(--naranja)}
.top .cta{min-height:44px;padding:0 18px;font-size:15px;box-shadow:3px 3px 0 var(--gris);margin-left:8px;white-space:nowrap}
.top .cta[aria-current]{outline:3px solid var(--gris);outline-offset:2px}
.menu-btn{display:none;align-items:center;gap:8px;min-height:44px;min-width:44px;padding:0 12px;background:none;border:2px solid var(--g2);color:var(--gris);font:800 14px/1 var(--display);text-transform:uppercase;cursor:pointer;border-radius:var(--r1)}
.menu-btn svg{width:20px;height:20px}
.menu-btn .i-cerrar,.menu-btn .t-cerrar{display:none}
.menu-btn[aria-expanded="true"] .i-cerrar,.menu-btn[aria-expanded="true"] .t-cerrar{display:inline}
.menu-btn[aria-expanded="true"] .i-abrir,.menu-btn[aria-expanded="true"] .t-abrir{display:none}
.top .modo-btn{margin-left:4px}

/* barra de 7 segmentos: hechos en naranja oscuro, el actual en naranja */
.avance{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;height:5px;background:var(--negro)}
.avance i{background:var(--g2)}
.avance i.hecho{background:#8a3a14}
.avance i.ahora{background:var(--naranja)}

/* menú móvil: hoja a pantalla completa, nunca carrusel */
.cajon{display:none}
@media (max-width:1060px){
  .snav{display:none}
  .menu-btn{display:inline-flex}
  .top .cta{margin-left:auto;padding:0 14px}
  html.menu-abierto{overflow:hidden}
  html.menu-abierto .cajon{display:block}
  .cajon{position:fixed;inset:69px 0 0 0;z-index:39;background:var(--negro);color:var(--gris);overflow-y:auto;padding:8px 0 40px}
  .cajon ol{list-style:none;margin:0;padding:0}
  .cajon li a{display:grid;grid-template-columns:36px 1fr;gap:2px 10px;align-items:baseline;padding:14px var(--gut);text-decoration:none;color:inherit;border-bottom:1px solid var(--g1);min-height:44px}
  .cajon li a i{grid-row:span 2;font:700 15px/1.6 var(--mono);font-style:normal;color:var(--naranja)}
  .cajon li a b{font:900 26px/1.05 var(--display);text-transform:uppercase}
  .cajon li a span{font-size:14px;color:var(--g4)}
  .cajon li a[aria-current] b{color:var(--naranja)}
  .cajon .cajon-cta{padding:22px var(--gut) 0;display:grid;gap:10px}
  .cajon .cajon-cta .btn{width:100%}
  .cajon .cajon-cta p{margin:0;font:700 13px/1.4 var(--mono);color:var(--g4)}
}
@media (max-width:420px){
  .menu-btn .t-abrir,.menu-btn .t-cerrar{display:none!important}
  .top .cta{padding:0 12px;font-size:14px;box-shadow:2px 2px 0 var(--gris)}
  .top .brand img.wm{height:24px}
}

/* ---------- encabezado de página ---------- */
.paso{display:inline-flex;align-items:center;gap:10px;font:700 12px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--naranja-texto);margin-bottom:14px}
.paso b{background:var(--naranja);color:var(--negro);padding:5px 8px;font-weight:700}
.phead.dark .paso{color:var(--naranja)}
.phead .lede{margin-bottom:0}
.phead h1{margin-bottom:16px}
@media (max-width:760px){
  .phead{padding:24px 0 28px}
  .phead .ph-in{gap:12px}
  .phead .ph-img{max-height:150px;width:auto;margin:0 auto}
  .phead h1{font-size:clamp(40px,11vw,56px)}
}

/* migas (reportes) */
.migas{font:700 13px/1.4 var(--mono);color:var(--g4);margin-bottom:18px;display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center}
.migas a{color:var(--gris);text-decoration:none;border-bottom:2px solid var(--naranja);min-height:44px;display:inline-flex;align-items:center}
.migas a:hover{color:var(--naranja)}
.migas span[aria-hidden]{color:var(--naranja)}

/* ---------- índice de la página: fijo en escritorio; en el celular, en dos líneas y no fijo ---------- */
.indice{position:sticky;top:69px;z-index:30;background:var(--surface);border-bottom:3px solid var(--line)}
.indice .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px;min-height:52px;padding-block:4px}
.indice .lbl{font:700 11px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);white-space:nowrap;margin-right:6px}
.indice a{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;font:800 14px/1 var(--display);text-transform:uppercase;white-space:nowrap;text-decoration:none;color:inherit;border:2px solid transparent;border-radius:999px}
.indice a:hover{border-color:var(--line)}
.indice a.on{background:var(--negro);color:var(--naranja);border-color:var(--negro)}
[id]{scroll-margin-top:130px}
@media (max-width:760px){.indice{position:static}.indice .lbl{width:100%;margin:6px 0 0}[id]{scroll-margin-top:80px}}

/* ---------- paginador del recorrido ---------- */
.recorrido{border-top:3px solid var(--line);margin-top:clamp(32px,5vw,64px);padding-top:24px}
.recorrido .pager{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;padding-block:0 8px}
.recorrido .pg.prev{justify-self:start}
.recorrido .pg.next{justify-self:end}
.recorrido .donde{margin:0;text-align:center;font:700 13px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
@media (max-width:640px){
  .recorrido .pager{grid-template-columns:1fr 1fr}
  .recorrido .donde{grid-column:1/-1;grid-row:1}
  .recorrido .pg{min-width:0;padding:12px 14px}
}

/* ---------- pie con mapa ---------- */
.foot{margin-top:0}
.foot .wrap.mapa-pie{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px;align-items:start}
.mapa-pie h2{font:700 12px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--naranja);margin:0 0 6px}
.mapa-pie ul{list-style:none;margin:0;padding:0;display:grid}
.mapa-pie li a{display:flex;align-items:center;min-height:44px;color:var(--gris);text-decoration:none}
.mapa-pie li a:hover{color:var(--naranja)}
.mapa-pie li.nota{min-height:44px;display:flex;align-items:center;color:var(--g4)}
.mapa-pie .sign{margin-bottom:14px}
.mapa-pie .pie-meta{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;justify-content:space-between;border-top:1px solid var(--g2);padding-top:16px;font-size:13px}
.mapa-pie .arriba{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border:2px solid var(--g2);color:var(--gris);text-decoration:none;font:800 14px/1 var(--display);text-transform:uppercase}
.mapa-pie .arriba:hover{border-color:var(--naranja);color:var(--naranja)}
@media (max-width:860px){.foot .wrap.mapa-pie{grid-template-columns:1fr 1fr}.mapa-pie > div:first-child{grid-column:1/-1}}

/* ---------- utilidades de orden ---------- */
.sec-t{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:12px 24px;margin-bottom:28px}
.sec-t h2{font-size:clamp(34px,4.6vw,60px)}
.sec-t .lede{margin:0;max-width:46ch}
.mas-link{display:inline-flex;align-items:center;min-height:44px;font:800 15px/1 var(--display);text-transform:uppercase;color:var(--naranja-texto);text-decoration:none;border-bottom:3px solid currentColor;white-space:nowrap}
.dark .mas-link,.phead.dark .mas-link{color:var(--naranja)}
.mas-link:hover{color:var(--naranja)}
.sello{font-size:12px}
.sello a{color:inherit;display:inline-flex;align-items:center;min-height:44px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- 1 · Inicio ---------- */
.pbhero .hero-l{font:600 clamp(19px,1.8vw,24px)/1.4 var(--body);color:var(--g5);margin:0}
.como{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:clamp(24px,5vw,64px);align-items:center}
.como h2{font-size:clamp(36px,5vw,64px);margin-bottom:12px}
.como .kicker{margin:0 0 22px}
.como .pasos3{margin-bottom:22px}
.como-vid .vid{max-width:300px;margin-inline:auto}
.rep-minis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.rep-mini{display:grid;gap:4px;padding:22px;background:#222;border:3px solid var(--g2);color:var(--gris);text-decoration:none;transition:transform .12s}
.rep-mini:hover{transform:translate(-3px,-3px);border-color:var(--naranja)}
.rep-mini .mk{background:var(--gris);padding:10px 14px;justify-self:start;margin-bottom:10px}
.rep-mini .mk img{height:30px;width:auto}
.rep-mini b{font:900 clamp(40px,4.4vw,60px)/1 var(--display);color:var(--naranja)}
.rep-mini span{font-weight:600}
.rep-mini em{font:800 14px/1 var(--display);font-style:normal;text-transform:uppercase;color:var(--naranja);margin-top:12px}
.desde-blq{display:grid;grid-template-columns:minmax(0,1.1fr) auto auto;gap:24px 40px;align-items:center}
.desde-blq h2{font-size:clamp(32px,4vw,52px)}
.desde-n{display:flex;gap:28px}
.desde-n div{display:grid;gap:2px}
.desde-n span{font:700 12px/1 var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--naranja-texto)}
.desde-n b{font:900 clamp(30px,3vw,42px)/1 var(--display);white-space:nowrap}
.desde-n small{color:var(--muted)}
.xstep{position:relative;min-height:150px;justify-content:flex-end}
.xstep .xn{position:absolute;top:14px;right:18px;font:900 54px/1 var(--display);color:var(--naranja)}
#recorre .explora{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:900px){.como{grid-template-columns:1fr}.rep-minis{grid-template-columns:1fr}.desde-blq{grid-template-columns:1fr}#recorre .explora{grid-template-columns:1fr 1fr}}
@media (max-width:560px){#recorre .explora{grid-template-columns:1fr}.xstep{min-height:96px}.rep-mini{grid-template-columns:auto 1fr;align-items:center;gap:4px 14px}.rep-mini .mk{grid-row:span 3;margin:0}.rep-mini b{font-size:36px}}
@media (max-width:760px){.pbhero .logo-madre{display:none}.pbhero .sl-vis img{max-height:220px;width:auto;margin-inline:auto}}

/* ---------- 2 · El Leoncito ---------- */
.subgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.subcard{display:flex;flex-direction:column;gap:10px;padding:clamp(18px,2.4vw,28px);background:var(--surface);border:3px solid var(--line);box-shadow:6px 6px 0 var(--line)}
.subcard .sc-logo{height:60px;width:auto;max-width:200px;object-fit:contain;object-position:left}
.subcard .sc-ico{display:flex;align-items:center;gap:10px;height:60px}
.subcard .sc-ico b{font:900 26px/1 var(--display);text-transform:uppercase}
.subcard .sc-tag{font:700 17px/1.35 var(--body);color:var(--muted);margin:0}
.subcard .sc-n b{display:block;font:900 clamp(30px,3vw,40px)/1 var(--display);color:var(--naranja-texto)}
.subcard .sc-n span{font-weight:600;font-size:14px}
.subcard .sello{margin:0}
.subcard .where{margin:0}
.subcard .mas-link{align-self:flex-start;margin-top:auto}
.medida{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin:28px 0 0;padding:16px 20px;border:3px dashed var(--line)}
.medida span{flex:1;min-width:220px}
.leyes p{font-weight:600}
@media (max-width:900px){.subgrid{grid-template-columns:1fr}}
@media (max-width:640px){
  .leyes > div{display:grid;grid-template-columns:40px 1fr;gap:12px;align-items:center;padding:14px 16px}
  .leyes .ico.lg{width:36px;height:36px}
  .leyes p{margin:0}
  #rendimiento .grid.g4{grid-template-columns:1fr 1fr}
  #rendimiento .grid.g4 > *{border-right:3px solid var(--line)!important;padding:16px}
  #rendimiento .grid.g4 > :nth-child(2n){border-right:0!important}
  #rendimiento .stat-n{font-size:34px}
  #rendimiento .card p{font-size:13px}
  #rendimiento .card .ico{display:none}
}

/* ---------- 3 · Formatos ---------- */
.esp-grid.cuatro{grid-template-columns:repeat(4,minmax(0,1fr))}
.prueba-g{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:clamp(24px,4vw,56px);align-items:center}
.tl-seg small{display:none}
@media (max-width:1100px){.esp-grid.cuatro{grid-template-columns:1fr 1fr}}
@media (max-width:760px){.prueba-g{grid-template-columns:1fr}}
@media (max-width:640px){
  .esp-grid.cuatro{grid-template-columns:1fr}
  /* la línea de tiempo pasa a vertical con alturas proporcionales a su % del video */
  .tl .tl-bar{flex-direction:column;height:520px}
  .tl .tl-seg{flex:var(--f) 1 0!important;min-height:0;border-right:0;border-bottom:2px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 12px;font-size:12px}
  .tl .tl-seg small{display:inline;font:700 11px/1 var(--mono)}
  .tl .tl-axis{display:none}
}

/* ---------- 4 · Casos ---------- */
.medimos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin:0}
.medimos div{padding:18px;background:var(--surface);border:3px solid var(--line)}
.medimos dt{font:900 22px/1 var(--display);text-transform:uppercase;color:var(--naranja-texto);margin-bottom:8px}
.medimos dd{margin:0;font-size:15px}
.caso-head .sello{margin-top:10px}
@media (max-width:980px){.medimos{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.medimos{grid-template-columns:1fr}}

/* ---------- 6 · Precios ---------- */
.arbol2{margin:0;display:grid;gap:14px}
.a2-q,.a2-q2{display:flex;align-items:center;gap:10px;font:900 20px/1.1 var(--display);text-transform:uppercase}
.a2-q2{font-size:15px;margin:10px 0 8px}
.a2-n{display:grid;place-items:center;width:30px;height:30px;background:var(--negro);color:var(--naranja);font:900 16px/1 var(--display);flex:none}
.a2-ramas{display:grid;grid-template-columns:1fr 1fr .7fr;gap:14px}
.a2-rama{padding:14px;background:var(--surface);border:3px solid var(--line)}
.a2-r{font:900 20px/1 var(--display);text-transform:uppercase;color:var(--naranja-texto)}
.a2-r small{display:block;font:700 11px/1.4 var(--mono);color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.a2-hojas{display:grid;gap:8px}
.a2-hojas.uno{margin-top:44px}
.a2-hojas small{display:block;font:700 11px/1.4 var(--mono);color:var(--muted);text-transform:uppercase;margin-bottom:2px}
.hoja{display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:44px;padding:8px 12px;background:var(--naranja);color:var(--negro);border:2px solid var(--negro);text-decoration:none;box-shadow:3px 3px 0 var(--negro)}
.hoja b{font:900 16px/1 var(--display);text-transform:uppercase}
.hoja span{font:700 12px/1 var(--mono);white-space:nowrap}
.hoja:hover{transform:translate(-2px,-2px)}
.tar-guia{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(24px,4vw,48px);align-items:start}
.tabla-carta{overflow-x:auto;border:3px solid var(--line);background:var(--surface);max-width:860px}
table.carta{width:100%;border-collapse:collapse;font-size:16px}
table.carta th,table.carta td{padding:12px 16px;border-bottom:2px solid var(--g5);text-align:left}
table.carta td{font:900 20px/1 var(--display);white-space:nowrap}
table.carta thead th{font:700 12px/1.2 var(--mono);text-transform:uppercase;letter-spacing:.06em;background:var(--negro);color:var(--gris)}
table.carta tr.grupo th{font:700 12px/1.2 var(--mono);text-transform:uppercase;letter-spacing:.06em;background:var(--gris);color:var(--naranja-texto)}
table.carta tbody th{font-weight:600}
.disp{display:grid;grid-template-columns:auto 1fr;gap:24px 36px;align-items:center;margin-top:36px;padding:24px;border:3px solid var(--g2)}
.disp .parrilla{margin:0}
.disp-t{font:900 clamp(24px,2.6vw,34px)/1.1 var(--display);text-transform:uppercase;margin:0 0 8px}
.disp-t b{color:var(--naranja)}
.disp .btn{margin-top:14px}
@media (max-width:1100px){.tar-guia{grid-template-columns:1fr}}
@media (max-width:760px){.a2-ramas{grid-template-columns:1fr}.a2-hojas.uno{margin-top:8px}.disp{grid-template-columns:1fr}}

/* ---------- 7 · Hablemos ---------- */
.hablemos .ph-in{align-items:start}
.vias{display:grid;gap:12px;margin:24px 0 18px}
.via{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;padding:14px 16px;border:2px solid var(--g2)}
.via .eyebrow{width:100%;margin:0}
.via-a{display:inline-flex;align-items:center;min-height:44px;font:900 clamp(18px,2vw,24px)/1.1 var(--display);color:var(--naranja);text-decoration:none;overflow-wrap:anywhere}
.via-a:hover{text-decoration:underline}
.copiar{min-height:44px;padding:0 14px;background:none;border:2px solid var(--g2);color:var(--gris);font:800 13px/1 var(--display);text-transform:uppercase;cursor:pointer}
.copiar:hover,.copiar.ok{border-color:var(--naranja);color:var(--naranja)}
.disp-l{display:flex;align-items:center;gap:10px;font-weight:600;color:var(--g5)}
.disp-l .ico{color:var(--naranja)}
.ph-img.mini{max-height:220px;width:auto;margin-top:12px}
.brief-form{display:grid;gap:16px;padding:clamp(18px,3vw,30px);background:var(--surface);color:var(--text);border:3px solid var(--line);box-shadow:8px 8px 0 var(--naranja)}
.brief-form .eyebrow{margin:0;color:var(--naranja-texto)}
.fl{display:grid;gap:8px;border:0;margin:0;padding:0;min-width:0}
.fl > span,.fl legend{font:700 13px/1.2 var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--naranja-texto);padding:0;margin-bottom:6px}
.fl input[type=text],.fl select{font:500 16px/1.3 var(--body);min-height:48px;padding:10px 12px;border:2px solid var(--negro);background:var(--gris);color:var(--negro);border-radius:var(--r1);width:100%}
.fl input:focus-visible,.fl select:focus-visible{outline:3px solid var(--naranja);outline-offset:2px}
.rchips{display:flex;flex-wrap:wrap;gap:8px}
.rchip{position:relative}
.rchip input{position:absolute;opacity:0;inset:0;cursor:pointer}
.rchip span{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border:2px solid var(--negro);font:600 14px/1.2 var(--body);cursor:pointer;color:var(--negro);background:var(--surface)}
.rchip input:checked + span{background:var(--naranja);color:var(--negro);border-color:var(--negro)}
.rchip input:focus-visible + span{outline:3px solid var(--naranja);outline-offset:2px}
.brief-form .btn{justify-self:start}
.brief-form .small{margin:0;color:#555}
@media (max-width:860px){.hablemos .ph-img.mini{display:none}}

/* flujo de 4 pasos ocupa todo el ancho */
@media (min-width:1101px){.flow:has(> li:nth-child(4):last-child){grid-template-columns:repeat(4,1fr)}}

/* ---------- móvil: menos scroll ---------- */
@media (max-width:640px){
  .vids{grid-template-columns:1fr 1fr;gap:10px}
  .vids .meta b{font-size:13px}
  #videos .vids > :nth-child(n+5){display:none}
}

@media print{.indice,.recorrido,.cajon,.menu-btn,.avance,.top .cta{display:none!important}}
.como-vis{display:grid;gap:12px;align-content:center;padding:24px;background:var(--negro);color:var(--gris);border:3px solid var(--negro);box-shadow:8px 8px 0 var(--naranja)}
.como-cita{font:600 clamp(18px,1.6vw,22px)/1.45 var(--body);margin:0}
.como-cita b{color:var(--naranja)}
.como-vis .mas-link{color:var(--naranja)}

/* ============================================================
   COMPACTACIÓN · topes de largo del brief (§5.1): interiores ≤ 5 pantallas, Casos ≤ 2.5, Hablemos ≤ 1.5
   ============================================================ */
body.multi .sl.full,body.multi .sl{padding:clamp(36px,4.5vw,60px) 0}
.phead{padding:clamp(28px,4vw,52px) 0 clamp(24px,3vw,40px)}
.ph-img{max-height:300px}
.sec-t{margin-bottom:22px}
.recorrido{margin-top:clamp(20px,3vw,36px);padding-top:16px}
.foot{padding:30px 0 18px}
.mapa-pie .sign{font-size:clamp(24px,2.4vw,32px)}
@media (min-width:861px){.mapa-pie li a,.mapa-pie li.nota{min-height:30px}}
.mapa-pie div:nth-child(2) ul{grid-template-columns:1fr 1fr;column-gap:16px}
.migas a{min-width:44px;justify-content:center;padding:0 4px}

/* Formatos: 6 tarjetas en 3 columnas, mapa más bajo */
.fmt-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.fmt-big{grid-template-columns:96px 1fr;gap:14px;padding:14px}
.fmt-big h3{font-size:clamp(20px,1.7vw,24px)}
.fmt-big>div>.ico.xl{width:40px;height:40px}
.fmt-big p{font-size:14px}
.mp-area{height:330px}
@media (max-width:1100px){.fmt-list{grid-template-columns:1fr 1fr}}
@media (max-width:640px){
  .fmt-list{grid-template-columns:1fr}.fmt-big{grid-template-columns:84px 1fr}
  .mp-area{height:400px}
  .tl .tl-bar{height:420px}
  .sl .rundown{grid-template-columns:1fr 1fr}
  .sl .rundown > div{padding:12px}
  .sl .rundown h4{font-size:15px}
  .sl .rundown p{font-size:13px}
  .esp-grid.cuatro{grid-template-columns:1fr 1fr;gap:10px}
  .esp-grid.cuatro .card{padding:14px}
  .esp-grid.cuatro .ico.xl{width:36px;height:36px}
  .esp-grid.cuatro p{font-size:13px}
}

/* Precios: la carta en dos tablas lado a lado */
.carta2{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}
.carta2 .tabla-carta{max-width:none}
@media (max-width:860px){.carta2{grid-template-columns:1fr}}
@media (max-width:640px){
  .pcard{padding:18px}
  .pcard .price{font-size:40px}
  .pcard ul{font-size:14px}
  .pcard li{padding:4px 0}
  .tar3 .card{padding:16px}
  .tar3 .inc li{font-size:14px;padding:3px 0}
}

/* Casos: tarjetas más compactas */
.card.hubc .c2-big{font-size:clamp(48px,4.6vw,72px)}
@media (max-width:640px){
  .card.hubc{padding:16px}
  .card.hubc .c2-big{font-size:48px}
  .medimos{grid-template-columns:1fr 1fr;gap:10px}
  .medimos div{padding:12px}
  .medimos dt{font-size:18px}
  .medimos dd{font-size:13px}
}

/* ---------- ajuste de largos, ronda 2 ---------- */
body.multi #prueba{min-height:auto}               /* playbook.css lo dejaba a pantalla completa */
.prueba-g .big-x{flex-direction:column;align-items:flex-start;gap:8px}
.prueba-g .big-x span{max-width:22ch}
.card.hubc{gap:4px}
.card.hubc p{margin:4px 0}
@media (max-width:640px){
  /* Precios: el árbol en tres columnas por rama; la ecuación se queda en escritorio */
  #tu-paquete .tar-guia > div{display:none}
  .a2-hojas{grid-template-columns:repeat(3,minmax(0,1fr))}
  .a2-hojas.uno{grid-template-columns:1fr}
  .hoja{flex-direction:column;align-items:flex-start;gap:4px;padding:8px}
  .hoja b{font-size:14px}
  .a2-rama{padding:12px}
  .tar3{grid-template-columns:1fr 1fr!important;gap:10px}
  .tar3 .card:last-child{grid-column:1/-1}
  .tar3 .inc li{font-size:13px}
  .tar3 h4{font-size:16px}
  table.carta td{font-size:17px}
  table.carta th,table.carta td{padding:9px 10px}
  /* pie compacto: firma, y luego recorrido | casos, y contacto abajo */
  .foot .wrap.mapa-pie{grid-template-columns:1fr 1fr;gap:16px}
  .mapa-pie > div:first-child p:not(.sign){display:none}
  .mapa-pie .sign{margin:0}
  .mapa-pie > div:nth-child(2) ul{grid-template-columns:1fr}
  .mapa-pie > div:nth-child(4){grid-column:1/-1}
  .mapa-pie > div:nth-child(4) ul{grid-template-columns:1fr 1fr;column-gap:12px}
  .mapa-pie .pie-meta{padding-top:12px}
  /* Casos: tarjetas de reporte más bajas */
  .card.hubc .c2-top{margin-bottom:6px}
  .casos-mini .caso3{padding:12px}
}
/* ronda 3: últimos píxeles para los topes por página */
body.multi .sl.full,body.multi .sl{padding:clamp(28px,3.6vw,52px) 0}
.ph-img{max-height:260px}
@media (max-width:760px){.phead .ph-img{max-height:120px}}
@media (min-width:1101px){#videos .vids{grid-template-columns:repeat(6,minmax(0,1fr))}}
.disp > .parrilla{width:min(300px,100%)}
.subcard .sc-nom{margin:0}