/* ============================================================
   PROPUESTA · sitio de varias páginas (se carga después de playbook.css)
   ============================================================ */
body.multi .sl{min-height:auto}
body.multi .sl.full,body.multi .sl{padding:clamp(56px,7vw,96px) 0}

/* navegación de páginas */
.top .wrap{gap:14px}
.pnav{display:flex;gap:2px;flex:1;overflow-x:auto;scrollbar-width:none}
.pnav::-webkit-scrollbar{display:none}
.pnav a{display:flex;align-items:center;min-height:44px;padding:0 12px;font:800 14px/1 var(--display);text-transform:uppercase;color:var(--gris);text-decoration:none;white-space:nowrap;border-bottom:3px solid transparent}
.pnav a:hover{color:var(--naranja)}
.pnav a[aria-current]{color:var(--naranja);border-bottom-color:var(--naranja)}
.foot-links a{color:var(--naranja)}

/* encabezado de página */
.phead{background:var(--surface);border-bottom:4px solid var(--line);padding:clamp(40px,6vw,80px) 0 clamp(28px,4vw,56px)}
.phead.dark{background:var(--negro);color:var(--gris);--muted:var(--g4);--line:var(--g2);--naranja-texto:var(--naranja)}
.ph-in{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(24px,5vw,64px);align-items:center}
.phead h1{font-size:clamp(46px,6.4vw,96px);margin-bottom:20px}
.ph-img{width:100%;max-height:440px;object-fit:contain;filter:drop-shadow(0 18px 30px rgba(0,0,0,.2))}

/* inicio: recorre la propuesta */
.explora{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.xcard{display:flex;flex-direction:column;gap:6px;padding:20px;background:var(--surface);border:3px solid var(--line);box-shadow:6px 6px 0 var(--line);text-decoration:none;color:inherit;transition:transform .12s}
.xcard:hover{transform:translate(-3px,-3px);box-shadow:9px 9px 0 var(--naranja)}
.xcard img{height:170px;width:100%;object-fit:contain;margin-bottom:8px}
.xcard .eyebrow{margin:0}
.xcard b{font:900 26px/1 var(--display);text-transform:uppercase}
.go{font:800 14px/1 var(--display);text-transform:uppercase;color:var(--naranja-texto);margin-top:auto;padding-top:8px}
.sl.dark .go,.phead.dark .go{color:var(--naranja)}

/* espacios */
.tl-legend i{display:inline-block;width:14px;height:14px;border:2px solid var(--line);vertical-align:-2px;margin-right:6px}
.esp3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:28px}
.pct{display:block;font:900 clamp(36px,4vw,56px)/1 var(--display);color:var(--naranja);margin-bottom:8px}
.esp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card.esp{position:relative;display:flex;flex-direction:column;gap:6px}
.card.esp .ico{color:var(--naranja)}
.card.esp p{margin:0;font-size:15px}
.ideal{display:flex;gap:6px;align-items:flex-start;font:700 12px/1.35 var(--mono);color:var(--naranja-texto);margin-top:6px!important}
.ideal .ico{width:14px;height:14px;flex:none;margin-top:1px}
.desde{position:absolute;top:18px;right:18px;font:900 18px/1 var(--display);background:var(--negro);color:var(--gris);padding:6px 9px}
.parrilla.big .cas{max-width:720px;gap:10px}
.sl .rundown{display:grid;grid-template-columns:repeat(5,1fr);gap:0;border:3px solid var(--g2)}
.sl .rundown>div{padding:18px;border-right:3px solid var(--g2)}
.sl .rundown>div:last-child{border-right:0}
.sl .rundown .t{font:700 12px/1 var(--mono);color:var(--naranja)}
.sl .rundown h4{margin:8px 0;font-size:20px;color:var(--gris)}
.sl .rundown .ad{font-size:14px;color:var(--g4);margin:0}

/* formatos */
.fmt-list{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.fmt-big{display:grid;grid-template-columns:150px 1fr;gap:20px;align-items:start;padding:18px;background:var(--surface);border:3px solid var(--line);box-shadow:6px 6px 0 var(--line)}
.fmt-big .vid.mini .meta{display:none}
.fmt-big .vid.mini .frame{aspect-ratio:9/16}
.fmt-big>div>.ico{color:var(--naranja);margin-bottom:8px}
.fmt-big h3{font-size:clamp(24px,2.4vw,32px);margin-bottom:8px;text-transform:uppercase}
.fmt-big p{margin:0 0 6px}
.mas{margin-top:30px}

/* casos: hub */
.hub-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card.hubc{display:flex;flex-direction:column;gap:8px;text-decoration:none;color:inherit;transition:transform .12s}
.card.hubc:hover{transform:translate(-3px,-3px)}
.card.hubc .c2-top{margin:calc(-1 * var(--cp)) calc(-1 * var(--cp)) 10px;width:auto}
.card.hubc .c2-big{font-size:clamp(56px,6vw,88px)}

/* caso: reporte */
.caso-head .ph-in{grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr)}
.ch-logo{background:var(--gris);display:inline-flex;padding:14px 18px;margin:6px 0 22px;border:3px solid var(--naranja)}
.ch-logo .mk img{height:52px;max-width:220px;filter:none}
.ch-vid{max-width:300px;justify-self:center;width:100%}
.ch-vid .vid{box-shadow:10px 10px 0 var(--naranja)}
.caso-head .hero-stats{margin-top:clamp(28px,4vw,48px)}
.rep3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.big{font-size:clamp(18px,1.6vw,22px);line-height:1.45;margin:0}
.card.quote{background:var(--naranja);color:var(--negro);border-color:var(--negro)}
.card.quote .eyebrow{color:var(--negro)}
.card.quote .big{font-weight:600}
.rep-ent{margin-top:28px;max-width:900px}
.rep2{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.rep2 h4{margin-bottom:6px}
.rep-top{display:flex;gap:8px;align-items:center;margin-top:20px;font-size:17px}
.rep-top .ico{color:var(--naranja)}
.rep-vids{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.rep-fin{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,56px);align-items:start}
.rep-fin h4{display:flex;gap:8px;align-items:center;margin-bottom:14px}
.rep-fin h4 .ico{color:var(--naranja)}

/* tarifario */
.tar3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.tar3 h4{display:flex;gap:8px;align-items:center;margin-bottom:14px}
.tar3 h4 .ico{color:var(--naranja)}
table.tar{width:100%;border-collapse:collapse;font-size:15px}
table.tar th,table.tar td{padding:9px 6px;border-bottom:1px solid var(--g5);text-align:left}
table.tar td{font:900 18px/1 var(--display);text-align:right}
table.tar thead th{font:700 11px/1 var(--mono);text-transform:uppercase;color:var(--muted);text-align:right}
table.tar thead th:first-child{text-align:left}
.sl.dark .sueltos>div,.sl.dark table.tar th,.sl.dark table.tar td{border-color:var(--g2)}
.tar-cond{margin-top:24px}

/* recorrido anterior / siguiente */
.pager{display:flex;justify-content:space-between;gap:16px;padding-block:28px}
.pg{display:flex;flex-direction:column;gap:4px;padding:16px 22px;min-width:220px;border:3px solid var(--line);background:var(--surface);text-decoration:none;color:inherit;box-shadow:5px 5px 0 var(--line)}
.pg.next{text-align:right;background:var(--naranja);color:var(--negro);border-color:var(--negro)}
.pg span{font:700 12px/1 var(--mono);text-transform:uppercase}
.pg b{font:900 22px/1 var(--display);text-transform:uppercase}

/* anexo en modo cliente */
.aviso{padding:80px 0}
.solo-cliente{display:block}
[data-modo="vendedor"] .solo-cliente{display:none}

@media (max-width:1100px){
  .explora,.hub-grid,.esp-grid,.tar3,.rep3{grid-template-columns:1fr 1fr}
  .sl .rundown{grid-template-columns:1fr 1fr}
}
@media (max-width:860px){
  .ph-in,.caso-head .ph-in,.fmt-list,.rep2,.rep-fin{grid-template-columns:1fr}
  .ph-img{max-height:280px}
  .esp3{grid-template-columns:1fr}
}
@media (max-width:640px){
  .explora,.hub-grid,.esp-grid,.tar3,.rep3,.sl .rundown{grid-template-columns:1fr}
  .fmt-big{grid-template-columns:110px 1fr}
  .pg{min-width:0;flex:1}
  .pg b{font-size:17px}
}
@media print{.pager,.pnav{display:none!important}}
.ch-vid .vid .meta{display:none}

/* =================== esquemas didácticos =================== */
.esq{margin:0}
.esq>.eyebrow{margin-bottom:16px}
/* flujo */
.flow{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:34px;counter-reset:f}
.flow li{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:20px 14px;background:var(--surface);border:3px solid var(--line);box-shadow:5px 5px 0 var(--line);counter-increment:f}
.flow li::before{content:counter(f);position:absolute;top:-14px;left:-14px;width:28px;height:28px;display:grid;place-items:center;background:var(--negro);color:var(--gris);font:900 14px/1 var(--display);border:2px solid var(--naranja)}
.flow li:not(:last-child)::after{content:"";position:absolute;right:-31px;top:50%;width:24px;height:24px;transform:translateY(-50%);background:var(--naranja);clip-path:polygon(0 30%,55% 30%,55% 0,100% 50%,55% 100%,55% 70%,0 70%)}
.flow li.hi{background:var(--naranja);color:var(--negro);border-color:var(--negro)}
.flow li.hi .ico{color:var(--negro)}
.fn-i .ico{color:var(--naranja)}
.flow b{font:900 19px/1.05 var(--display);text-transform:uppercase}
.flow span:not(.fn-i){font-size:14px;line-height:1.35}
.esq.mec{margin:32px 0 8px}
.sl.dark .flow li{background:#222}
.sl.dark .flow li.hi{background:var(--naranja)}

/* ojo con este dato */
.ojo{display:flex;gap:16px;align-items:flex-start;margin-top:28px;padding:18px 22px;background:var(--negro);color:var(--gris);border-left:8px solid var(--naranja);max-width:900px}
.ojo .ico{color:var(--naranja);flex:none}
.ojo b{font:900 16px/1 var(--display);text-transform:uppercase;color:var(--naranja)}
.ojo p{margin:6px 0 0;font-size:16px}
.ojo b+p b{color:var(--gris);font:inherit;font-weight:700;text-transform:none}
.ojo .sello{color:var(--g4)}
.sl.dark .ojo{background:#262626}

/* mapa radial del ecosistema */
.hubmap{position:relative;display:grid;grid-template-columns:1fr 1.1fr 1fr;grid-template-rows:auto auto auto;gap:22px 30px;align-items:center;justify-items:center;max-width:980px;margin:0 auto}
.hb-lines{position:absolute;inset:0;width:100%;height:100%;z-index:0}
.hb-lines line{stroke:var(--naranja);stroke-width:.6;stroke-dasharray:2 1.5}
.hb-c{grid-column:2;grid-row:2;z-index:1;display:flex;flex-direction:column;align-items:center;gap:6px;background:var(--bg);border:4px solid var(--naranja);border-radius:50%;width:min(300px,60vw);aspect-ratio:1;justify-content:center;padding:18px;box-shadow:0 0 0 10px var(--n10)}
.hb-c img{max-height:62%;width:auto}
.hb-c b{font:900 18px/1 var(--display);text-transform:uppercase}
.hb{z-index:1;display:flex;flex-direction:column;align-items:center;gap:4px;padding:16px 20px;background:var(--surface);border:3px solid var(--line);box-shadow:5px 5px 0 var(--naranja);min-width:200px;text-align:center}
.hb img{height:46px;width:auto;max-width:160px;object-fit:contain}
.hb-name{font:900 20px/1 var(--display);text-transform:uppercase;min-height:46px;display:flex;align-items:center}
.hb-num{font:900 34px/1 var(--display);color:var(--naranja)}
.hb-da{font:700 12px/1.2 var(--mono);text-transform:uppercase}
.hb-n{grid-column:2;grid-row:1}
.hb-e{grid-column:3;grid-row:2}
.hb-s{grid-column:2;grid-row:3}
.hb-w{grid-column:1;grid-row:2}

/* mapa de formatos */
.mapa{max-width:1000px;margin:0 auto}
.mp-area{position:relative;height:440px;border-left:4px solid var(--line);border-bottom:4px solid var(--line);background:linear-gradient(var(--g6) 1px,transparent 1px) 0 0/100% 25%,linear-gradient(90deg,var(--g6) 1px,transparent 1px) 0 0/25% 100%;margin-left:28px}
.sl.dark .mp-area{background:linear-gradient(#2a2a2a 1px,transparent 1px) 0 0/100% 25%,linear-gradient(90deg,#2a2a2a 1px,transparent 1px) 0 0/25% 100%}
.mp-zone{position:absolute;left:32%;bottom:52%;width:30%;height:42%;border:3px dashed var(--naranja);background:var(--n10);border-radius:50%}
.mp-zone span{position:absolute;top:-12px;left:50%;transform:translateX(-50%);font:700 11px/1 var(--mono);text-transform:uppercase;background:var(--bg);color:var(--naranja-texto);padding:3px 6px;white-space:nowrap}
.mp-dot{position:absolute;transform:translate(-50%,50%);display:flex;align-items:center;gap:8px;font:800 15px/1.1 var(--display);text-transform:uppercase;white-space:nowrap;background:var(--surface);border:2px solid var(--line);padding:8px 10px;box-shadow:3px 3px 0 var(--line)}
.mp-dot i{width:12px;height:12px;border-radius:50%;background:var(--g3);flex:none}
.mp-dot.hi{background:var(--naranja);color:var(--negro);border-color:var(--negro)}
.mp-dot.hi i{background:var(--negro)}
.mp-y{position:absolute;left:-28px;font:700 11px/1 var(--mono);text-transform:uppercase;writing-mode:vertical-rl;transform:rotate(180deg);color:var(--muted)}
.mp-y.top{top:0}
.mp-y.bot{bottom:0}
.mp-x{display:flex;justify-content:space-between;margin:10px 0 0 28px;font:700 12px/1 var(--mono);text-transform:uppercase;color:var(--muted)}

/* árbol de decisión */
.tar-guia{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(24px,4vw,56px);align-items:start}
.arbol ol{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.arbol li{display:grid;grid-template-columns:minmax(0,1.3fr) auto minmax(0,1fr);gap:10px;align-items:center}
.tq{padding:14px 16px;background:var(--surface);border:3px solid var(--line);font-weight:700;font-size:16px}
.ty{font:900 14px/1 var(--display);color:var(--naranja-texto);text-transform:uppercase}
.ta{display:flex;flex-direction:column;gap:3px;padding:12px 14px;background:var(--naranja);color:var(--negro);border:3px solid var(--negro);text-decoration:none;box-shadow:4px 4px 0 var(--negro)}
.ta b{font:900 18px/1 var(--display);text-transform:uppercase}
.ta span{font:700 12px/1 var(--mono)}
.tn{grid-column:1;justify-self:center;font:900 13px/1 var(--display);color:var(--muted);padding:4px 0}

/* ecuación */
.ecuacion{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:6px}
.eq-b{display:flex;flex-direction:column;gap:4px;padding:12px 14px;background:var(--surface);border:3px solid var(--line);min-width:120px}
.eq-b span{font:700 11px/1.2 var(--mono);text-transform:uppercase;color:var(--muted)}
.eq-b b{font:900 18px/1.05 var(--display)}
.eq-b.hi{background:var(--negro);color:var(--gris);border-color:var(--naranja)}
.eq-b.hi b{color:var(--naranja)}
.eq-op{font:900 30px/1 var(--display);color:var(--naranja)}

/* carriles tú / nosotros */
.carriles{display:grid;grid-template-columns:110px 1fr 1fr;border:3px solid var(--line);background:var(--surface)}
.carriles>div{padding:14px 16px;border-bottom:2px solid var(--g5);font-size:15px}
.cr-h{font:900 18px/1 var(--display);text-transform:uppercase;display:flex;gap:8px;align-items:center;border-bottom:3px solid var(--line)!important}
.cr-h.tu{background:var(--gris)}
.cr-h.no{background:var(--naranja);color:var(--negro)}
.cr-h .ico{width:20px;height:20px}
.cr-d{font:700 12px/1.2 var(--mono);text-transform:uppercase;color:var(--naranja-texto);background:var(--bg)}
.cr-no{background:var(--n10);font-weight:600}

/* glosario */
.glosario{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:0}
.gl{padding:20px;background:var(--surface);border:3px solid var(--line);box-shadow:5px 5px 0 var(--line)}
.gl dt{font:900 22px/1 var(--display);text-transform:uppercase;color:var(--naranja-texto);margin-bottom:8px}
.gl dd{margin:0;font-size:15px}

@media (max-width:1100px){
  .flow{grid-template-columns:repeat(3,1fr)}
  .flow li:nth-child(3)::after{display:none}
  .glosario{grid-template-columns:1fr 1fr}
  .tar-guia{grid-template-columns:1fr}
}
@media (max-width:760px){
  .flow{grid-template-columns:1fr;gap:30px}
  .flow li:not(:last-child)::after{display:block;right:auto;left:50%;top:auto;bottom:-29px;transform:translateX(-50%) rotate(90deg)}
  .hubmap{grid-template-columns:1fr 1fr;grid-template-rows:auto}
  .hb-c{grid-column:1/-1;grid-row:1;width:220px}
  .hb-n,.hb-e,.hb-s,.hb-w{grid-column:auto;grid-row:auto;min-width:0;width:100%}
  .hb-lines{display:none}
  .mp-area{height:520px}
  .mp-dot{font-size:12px;padding:6px 8px;white-space:normal;max-width:130px}
  .glosario{grid-template-columns:1fr}
  .arbol li{grid-template-columns:1fr;gap:6px}
  .ty{justify-self:start}
  .carriles{grid-template-columns:80px 1fr 1fr;font-size:13px}
}
.mp-area{margin-left:44px}
.mp-y{left:-40px;background:none}
.mp-x{margin-left:44px}
.hb img[src*="rd-roarderick"]{height:70px}
