/* Planes v2 (21-oct-2026) · se carga después de styles.css y home.css */
.p-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.p-chips a{border:1px solid #333;border-radius:50px;padding:9px 18px;font-size:14px;font-weight:700;color:var(--blanco);background:rgba(255,255,255,.03);transition:border-color .2s,color .2s}
.p-chips a:hover{border-color:var(--naranja);color:var(--naranja)}
.p-sec{scroll-margin-top:90px}
.h-planes.cuatro{grid-template-columns:repeat(4,1fr);gap:16px}
.h-planes.dos{grid-template-columns:repeat(2,1fr);max-width:820px;margin-left:auto;margin-right:auto}
.h-plan .precio .desde{display:block;font-size:12px;font-weight:800;letter-spacing:1.5px;color:var(--gris);text-transform:uppercase;margin-bottom:4px}
.h-plan .extra{font-size:13px;color:var(--gris);margin:-12px 0 18px}
.h-plan .extra b{color:var(--blanco)}
.h-plan li.star{font-weight:700}
.h-plan li{font-size:14.5px}
.h-plan.top.tag-pop::before{content:"MÁS PEDIDO"}
.h-plan.top.tag-ideal::before{content:"EL MÁS COMPLETO"}

/* Vitrina con ejemplo real */
.p-show{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center;margin-top:52px;background:radial-gradient(circle at 0% 0%,rgba(255,107,26,.16),transparent 55%),var(--carbon);border:1px solid var(--borde);border-radius:28px;padding:44px}
.p-show.inv{grid-template-columns:.9fr 1.1fr}
.p-show .lbl{font-size:12px;font-weight:900;letter-spacing:2px;color:var(--cyan);text-transform:uppercase;margin-bottom:12px}
.p-show h3{font-size:clamp(24px,3vw,34px);font-weight:900;line-height:1.1;margin-bottom:14px}
.p-show p{color:var(--gris);font-size:15px;margin-bottom:12px}
.p-show ul{list-style:none;margin:16px 0 0}
.p-show li{padding:6px 0;font-size:14.5px;display:flex;gap:10px;color:var(--blanco)}
.p-show li::before{content:"→";color:var(--naranja);font-weight:900}
.p-link{display:inline-flex;margin-top:18px;color:var(--naranja);font-weight:800;font-size:14px}

/* Navegador */
.p-browser{border-radius:16px;overflow:hidden;border:1px solid #333;box-shadow:0 30px 80px rgba(0,0,0,.55);background:#1b1b1b}
.p-browser .bar{display:flex;align-items:center;gap:7px;padding:11px 14px;background:#1f1f1f;border-bottom:1px solid #2c2c2c}
.p-browser .bar i{width:11px;height:11px;border-radius:50%;background:#444;display:block}
.p-browser .bar i:nth-child(1){background:#ff5f57}.p-browser .bar i:nth-child(2){background:#febc2e}.p-browser .bar i:nth-child(3){background:#28c840}
.p-browser .bar span{flex:1;margin-left:10px;background:#2a2a2a;border-radius:8px;padding:5px 12px;font-size:12px;color:var(--gris)}
.p-browser img{display:block;width:100%;height:auto}

/* Celulares */
.p-phones{position:relative;display:flex;justify-content:center;align-items:center;min-height:520px}
.p-phone{width:230px;aspect-ratio:9/19.5;border-radius:34px;padding:9px;background:#0b0b0b;border:2px solid #2e2e2e;box-shadow:0 30px 70px rgba(0,0,0,.6);overflow:hidden;position:relative;flex:none}
.p-phone>*{width:100%;height:100%;border-radius:26px;object-fit:cover;display:block}
.p-phone .scroll{overflow:hidden;position:relative;background:#f5efe6}
.p-phone .scroll img{width:100%;height:auto;display:block;border-radius:0}
@media (prefers-reduced-motion:no-preference){.p-phone .scroll img{animation:pscroll 38s ease-in-out infinite alternate}}
@keyframes pscroll{0%,4%{transform:translateY(0)}100%{transform:translateY(calc(-100% + 460px))}}
.p-phones .side{position:absolute;width:190px;opacity:.95}
.p-phones .side.l{left:2%;transform:rotate(-8deg) translateY(20px)}
.p-phones .side.r{right:2%;transform:rotate(8deg) translateY(20px)}
.p-phones .main{z-index:2}
.p-phones.duo{gap:22px}
.p-phones.duo .p-phone:first-child{transform:translateY(-14px)}
.p-phones.duo .p-phone:last-child{transform:translateY(14px)}
.p-cap{position:absolute;bottom:-12px;left:50%;transform:translateX(-50%);background:rgba(10,10,10,.85);border:1px solid #333;border-radius:50px;padding:5px 12px;font-size:12px;font-weight:800;white-space:nowrap;z-index:3}
.p-cap span{color:var(--gris);font-weight:600}
.p-phone-wrap{position:relative}

/* Extras */
.p-extras{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:44px}
.p-extra{background:var(--carbon);border:1px solid var(--borde);border-radius:20px;padding:24px 22px;display:flex;flex-direction:column;transition:border-color .25s,transform .25s}
.p-extra:hover{border-color:var(--naranja);transform:translateY(-3px)}
.p-extra h4{font-size:16px;font-weight:800;line-height:1.25;margin-bottom:10px}
.p-extra .pr{font-size:30px;font-weight:900;color:var(--naranja);line-height:1;margin-bottom:12px}
.p-extra .pr small{font-size:13px;color:var(--gris);font-weight:600}
.p-extra p{font-size:13.5px;color:var(--gris)}
.p-mini{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:22px}
.p-mini div{border:1px dashed #3a3a3a;border-radius:16px;padding:16px 18px;font-size:14px;color:var(--gris)}
.p-mini b{display:block;color:var(--blanco);font-size:15px;margin-bottom:2px}
.p-mini b span{color:var(--naranja)}

@media (max-width:1100px){
  .h-planes.cuatro{grid-template-columns:repeat(2,1fr)}
  .h-planes.cuatro .h-plan.top{transform:none}
  .p-extras{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:960px){
  .h-planes.dos{grid-template-columns:1fr}
  .p-show,.p-show.inv{grid-template-columns:1fr;padding:28px 22px;gap:34px}
  .p-show.inv .p-phones{order:-1}
  .p-mini{grid-template-columns:1fr}
}
@media (max-width:640px){
  .h-planes.cuatro{grid-template-columns:1fr}
  .p-extras{grid-template-columns:1fr}
  .p-phones{min-height:440px}
  .p-phone{width:200px}
  .p-phones .side{width:150px}
  .p-phones .side.l{left:-6%}.p-phones .side.r{right:-6%}
  .p-phones.duo .p-phone{width:46%}
}
.h-plan .precio.medida{font-size:38px;letter-spacing:-1px}

/* Pestañas (planes y servicios) */
.p-panel{display:none}
.p-panel.on{display:block;animation:pfade .35s ease}
@keyframes pfade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.p-tabs a{cursor:pointer}
.p-tabs a.on{background:var(--grad);color:var(--negro);border-color:transparent}
.p-panel .p-show{margin-top:36px}
#ejemplos .p-chips{margin-top:26px}

/* Servicios: pestañas + subpestañas */
#servicios .p-chips{margin-top:26px}
.s-tit{font-size:clamp(22px,2.6vw,30px);font-weight:900;margin:44px 0 6px}
.s-subtabs{display:flex;flex-wrap:wrap;gap:4px 22px;border-bottom:1px solid var(--borde);margin-bottom:28px}
.s-subtabs a{padding:12px 2px;font-size:15px;font-weight:700;color:var(--gris);border-bottom:2px solid transparent;margin-bottom:-1px;transition:color .2s,border-color .2s}
.s-subtabs a:hover{color:var(--blanco)}
.s-subtabs a.on{color:var(--naranja);border-color:var(--naranja);background:none;border-radius:0}
.s-subtabs a{border-top:0;border-left:0;border-right:0;border-radius:0;background:none}
.s-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.s-grid.solo{grid-template-columns:1fr;max-width:640px}
.s-card{background:radial-gradient(circle at 0% 0%,rgba(255,107,26,.14),transparent 60%),var(--carbon);border:1px solid var(--borde);border-radius:24px;padding:34px 30px}
.s-card h3{font-size:26px;font-weight:900;margin-bottom:8px}
.s-card p{color:var(--gris);font-size:15.5px;margin-bottom:16px}
.s-card ul{list-style:none;margin-bottom:24px}
.s-card li{padding:8px 0;border-bottom:1px solid #1e1e1e;display:flex;gap:10px;font-size:15px}
.s-card li::before{content:"✓";color:var(--naranja);font-weight:900}
.s-cta{display:flex;gap:12px;flex-wrap:wrap}
.s-cta .btn,.s-cta .btn-ghost{padding:14px 22px;font-size:14px}
.s-vis{display:flex;flex-direction:column;align-items:center;gap:14px}
.s-vis .lbl{font-size:12px;font-weight:900;letter-spacing:2px;color:var(--cyan);text-transform:uppercase}
.s-vis .p-browser{width:100%}
.s-vis .p-phones{width:100%;min-height:500px}
@media (max-width:960px){.s-grid{grid-template-columns:1fr}.s-vis{order:-1}}