/* ===== Escaparate de conceptos de diseño ===== */
.showcase{display:grid;grid-template-columns:240px minmax(0,1fr);gap:56px;align-items:start}
.sc-tabs{display:flex;flex-direction:column;gap:.7rem;position:sticky;top:6rem}
.sc-tabs button{all:unset;box-sizing:border-box;cursor:pointer;display:grid;grid-template-columns:auto 1fr;column-gap:.9rem;align-items:baseline;padding:1.1rem 1.2rem;border:1px solid #2c2c2c;transition:border-color .2s,background .2s,transform .2s}
.sc-tabs button:hover{border-color:var(--lime)}
.sc-tabs button:focus-visible{outline:2px solid var(--lime);outline-offset:3px}
.sc-tabs .n{font-size:.8rem;color:var(--mut);font-weight:700;letter-spacing:.08em}
.sc-tabs .t{font-size:1.2rem;font-weight:700;letter-spacing:-.02em;line-height:1.15}
.sc-tabs small{grid-column:2;color:var(--mut);font-size:.85rem;margin-top:.25rem}
.sc-tabs button[aria-selected="true"]{background:var(--lime);border-color:var(--lime);color:var(--ink);transform:translateX(8px)}
.sc-tabs button[aria-selected="true"] .n,.sc-tabs button[aria-selected="true"] small{color:#2a3a00}

.sc-stage{position:relative;padding-bottom:3.2rem}
.sc-frame{border:3px solid var(--paper);background:#fff;box-shadow:14px 14px 0 var(--red);color:var(--ink)}
.sc-frame .bar{display:flex;align-items:center;gap:6px;padding:10px 14px;border-bottom:3px solid var(--paper);background:var(--paper)}
.sc-frame .bar i{width:10px;height:10px;border-radius:50%;background:var(--red);display:block}
.sc-frame .bar i:nth-child(2){background:var(--lime);border:1px solid #0B0B0C}
.sc-frame .bar i:nth-child(3){background:#0B0B0C}
.sc-frame .bar span{margin-left:12px;font-size:.78rem;color:#6d6a63;background:#fff;border-radius:99px;padding:.18rem .9rem;min-width:11rem}
.sc-view{position:relative;overflow:hidden;background:#fff;height:520px}

.vsite{position:absolute;left:0;top:0;width:1200px;transform-origin:0 0;transform:scale(var(--s,.7));background:var(--bg);color:var(--ink);font-family:'Space Grotesk',system-ui,sans-serif;opacity:0;visibility:hidden;transition:opacity .55s ease,visibility .55s}
.vsite.on{opacity:1;visibility:visible}
.vs-inner{will-change:transform}
.vsite.on .vs-inner{animation:vscroll 26s ease-in-out 1.4s infinite alternate}
@keyframes vscroll{0%,6%{transform:translateY(0)}94%,100%{transform:translateY(calc(var(--travel,1200px) * -1))}}

.t1{--bg:#f4f7fc;--ink:#0c2340;--acc:#1b5cff;--acc2:#e1ebff;--mut:#5b6b85;--card:#fff;--line:#d9e1ef;--r:10px}
.t2{--bg:#f4efe6;--ink:#1d2a24;--acc:#9a7636;--acc2:#e9dfca;--mut:#6b6a5f;--card:#fbf8f2;--line:#d8cfbd;--r:0px}
.t3{--bg:#fbf4ee;--ink:#2b2540;--acc:#d9774f;--acc2:#e6dff5;--mut:#6e6785;--card:#fff;--line:#ecdfd3;--r:999px}

.ic{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}
.vs-nav{display:flex;align-items:center;justify-content:space-between;padding:0 72px;height:92px;border-bottom:1px solid var(--line)}
.vs-logo{display:flex;align-items:center;gap:12px;font-weight:700;font-size:24px;letter-spacing:-.02em}
.vs-logo i{width:38px;height:38px;border-radius:11px;background:var(--acc);display:grid;place-items:center}
.vs-links{display:flex;gap:38px;font-size:17px;color:var(--mut)}
.vs-btn{display:inline-block;padding:16px 28px;font-weight:700;font-size:16px;background:var(--ink);color:var(--bg);border-radius:var(--r,8px);border:2px solid transparent}
.vs-btn.alt{background:transparent;color:var(--ink);border-color:var(--ink)}
.vs-hero{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center;padding:60px 72px 76px}
.vs-eyebrow{font-size:14px;letter-spacing:.16em;text-transform:uppercase;color:var(--acc);font-weight:700;margin-bottom:22px}
.vs-h{font-size:78px;line-height:.98;letter-spacing:-.035em;font-weight:700;margin:0 0 26px}
.vs-p{font-size:21px;line-height:1.5;color:var(--mut);max-width:520px;margin:0 0 36px}
.vs-row{display:flex;gap:14px}
.vs-art{position:relative}
.vs-art>svg{width:100%;height:auto;display:block}
.vs-chip{position:absolute;background:#fff;color:#0c2340;border-radius:14px;padding:14px 20px;font-weight:700;font-size:16px;box-shadow:0 16px 36px rgba(12,35,64,.2);display:flex;gap:10px;align-items:center}
.vs-band{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:0 72px}
.vs-band div{display:flex;gap:14px;align-items:center;padding:28px 24px;font-size:17px;font-weight:500}
.vs-band div+div{border-left:1px solid var(--line)}
.vs-sec{padding:96px 72px 20px}
.vs-sec h3{font-size:46px;letter-spacing:-.03em;margin:0 0 14px;line-height:1.05}
.vs-sec .sub{font-size:19px;color:var(--mut);max-width:560px;margin:0 0 44px}
.vs-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.vs-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r,14px);padding:34px 30px 38px}
.t1 .vs-card{border-radius:16px}
.t3 .vs-card{border-radius:30px}
.vs-card .ib{width:58px;height:58px;border-radius:16px;display:grid;place-items:center;background:var(--acc2);color:var(--ink);margin-bottom:26px}
.t3 .vs-card .ib{border-radius:50%}
.vs-card h4{font-size:24px;margin:0 0 10px;letter-spacing:-.02em}
.vs-card p{font-size:17px;line-height:1.55;color:var(--mut);margin:0}
.vs-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;padding:80px 72px 20px}
.vs-steps b{display:block;font-size:68px;line-height:1;letter-spacing:-.04em;color:var(--acc);margin-bottom:16px}
.vs-steps h5{font-size:24px;margin:0 0 8px;letter-spacing:-.02em}
.vs-steps p{font-size:17px;color:var(--mut);line-height:1.5;margin:0}
.vs-quote{margin:80px 72px 0;padding:56px 64px;background:var(--card);border:1px solid var(--line);border-radius:var(--r,14px);font-size:30px;line-height:1.3;letter-spacing:-.02em}
.t1 .vs-quote{border-radius:16px}
.t3 .vs-quote{border-radius:36px}
.vs-quote small{display:block;margin-top:18px;font-size:16px;color:var(--mut);letter-spacing:0}
.vs-cta{margin:70px 72px 0;padding:72px 64px;background:var(--ink);color:var(--bg);display:flex;justify-content:space-between;align-items:center;border-radius:18px}
.t2 .vs-cta{border-radius:0}
.t3 .vs-cta{border-radius:44px;background:var(--acc2);color:var(--ink)}
.vs-cta h3{font-size:52px;line-height:1;letter-spacing:-.03em;margin:0}
.vs-cta .vs-btn{background:var(--acc);color:#fff}
.vs-foot{display:flex;justify-content:space-between;padding:46px 72px 60px;color:var(--mut);font-size:16px}

/* Despacho: tipografía serif, listado editorial en lugar de tarjetas */
.t2 .vs-h,.t2 .vs-sec h3,.t2 .vs-cta h3,.t2 .vs-steps b,.t2 .vs-quote{font-family:'Instrument Serif',serif;font-weight:400}
.t2 .vs-h{font-size:96px;line-height:.9;letter-spacing:-.03em}
.t2 .vs-sec h3{font-size:58px}
.t2 .vs-cta h3{font-size:64px}
.t2 .vs-quote{font-size:38px;font-style:italic}
.t2 .vs-cards{grid-template-columns:1fr;gap:0}
.t2 .vs-card{display:grid;grid-template-columns:72px 1fr 40px;align-items:center;gap:26px;padding:30px 0;border:0;border-top:1px solid var(--line);background:none;border-radius:0}
.t2 .vs-card:last-child{border-bottom:1px solid var(--line)}
.t2 .vs-card .ib{margin:0;border-radius:50%;background:transparent;border:1px solid var(--acc);color:var(--acc)}
.t2 .vs-card h4{font-family:'Instrument Serif',serif;font-weight:400;font-size:36px;margin:0 0 4px}
.t2 .vs-card .arr{font-size:26px;color:var(--acc)}
.t2 .vs-btn{border-radius:0}
.t2 .vs-steps b{font-size:80px}
/* Psicología: formas suaves */
.t3 .vs-h{font-weight:500}
.t3 .vs-sec h3,.t3 .vs-cta h3{font-weight:500}
.t3 .vs-quote{font-weight:500}
.t3 .vs-steps b{font-family:'Instrument Serif',serif;font-weight:400;font-style:italic}

/* Móvil dentro del escaparate */
.sc-phone{position:absolute;right:-30px;bottom:-12px;width:196px;border:3px solid var(--paper);border-radius:30px;background:#0B0B0C;padding:8px;box-shadow:8px 8px 0 var(--lime);z-index:3}
.sc-pview{position:relative;overflow:hidden;border-radius:21px;background:#fff;height:392px}
.vphone{position:absolute;left:0;top:0;width:390px;transform-origin:0 0;transform:scale(var(--ps,.48));background:var(--bg);color:var(--ink);font-family:'Space Grotesk',system-ui,sans-serif;opacity:0;visibility:hidden;transition:opacity .55s ease,visibility .55s}
.vphone.on{opacity:1;visibility:visible}
.vphone.on .vp-inner{animation:vpscroll 22s ease-in-out 2s infinite alternate}
@keyframes vpscroll{0%,8%{transform:translateY(0)}92%,100%{transform:translateY(calc(var(--ptravel,500px) * -1))}}
.vp-nav{display:flex;justify-content:space-between;align-items:center;padding:0 24px;height:78px;border-bottom:1px solid var(--line);font-size:22px}
.vp-hero{padding:34px 24px 26px}
.vp-hero h1{font-size:46px;line-height:1;letter-spacing:-.035em;margin:0 0 16px;font-weight:700}
.vp-hero p{font-size:19px;line-height:1.45;color:var(--mut);margin:0 0 24px}
.vp-art{padding:0 24px 24px}
.vp-art svg{width:100%;height:auto;display:block}
.vp-card{margin:0 24px 14px;padding:22px 22px;background:var(--card);border:1px solid var(--line);border-radius:var(--r,14px);display:grid;gap:4px}
.t3 .vp-card{border-radius:26px}
.vp-card b{font-size:20px;letter-spacing:-.02em}
.vp-card span{font-size:16px;color:var(--mut)}

.sc-cap{margin:1.2rem 0 0;color:var(--mut);font-size:.95rem;max-width:44rem}

@media(max-width:1000px){
  .showcase{grid-template-columns:1fr;gap:1.6rem}
  .sc-tabs{flex-direction:row;overflow-x:auto;position:static;padding-bottom:.4rem;gap:.6rem;scrollbar-width:thin}
  .sc-tabs button{flex:none;grid-template-columns:auto;padding:.8rem 1rem}
  .sc-tabs small{display:none}
  .sc-tabs .n{display:none}
  .sc-tabs button[aria-selected="true"]{transform:none}
  .sc-phone{right:-6px;bottom:-10px;width:128px;border-radius:22px;padding:6px;border-width:2px}
  .sc-pview{border-radius:16px}
}
@media(prefers-reduced-motion:reduce){
  .vsite.on .vs-inner,.vphone.on .vp-inner{animation:none}
  .vsite,.vphone{transition:none}
}
@media(max-width:560px){.sc-phone{width:98px;right:-4px;bottom:-8px;padding:5px;border-radius:18px}.sc-pview{border-radius:13px}.sc-stage{padding-bottom:2.4rem}}