/* SHOP IMPO · V81 — FIRST IMPRESSION / CONVERSION TUNNEL
   Capa visual aislada: mejora la entrada, la película y el acceso rápido sin tocar carrito/checkout. */

:root{
  --si81-violet:#a967ff;
  --si81-violet-hot:#7c2cff;
  --si81-line:rgba(211,174,255,.20);
  --si81-soft:rgba(176,118,255,.12);
}

/* ---------- Entrada: más clara, premium y con dos caminos ---------- */
.si-exp-intro-v60{
  background:
    radial-gradient(circle at 50% 18%,rgba(160,82,255,.18),transparent 25%),
    radial-gradient(circle at 12% 82%,rgba(102,34,196,.18),transparent 27%),
    radial-gradient(circle at 88% 75%,rgba(78,18,151,.17),transparent 28%),
    linear-gradient(180deg,#040207 0%,#07030d 46%,#020103 100%)!important;
}
.si-exp-intro-v60:before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.48;
  background:
    linear-gradient(90deg,transparent 0 11%,rgba(255,255,255,.025) 11.15% 11.3%,transparent 11.45% 88.55%,rgba(255,255,255,.025) 88.7% 88.85%,transparent 89%),
    repeating-linear-gradient(90deg,transparent 0 76px,rgba(184,129,255,.024) 76px 77px),
    linear-gradient(180deg,transparent 0 63%,rgba(147,71,255,.045) 100%);
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.35),#000 45%,rgba(0,0,0,.35));
}
.si-exp-intro-beam-v60{
  width:min(84vw,1120px)!important;height:128vh!important;max-width:none!important;max-height:none!important;border-radius:0!important;
  border:0!important;box-shadow:none!important;opacity:.86;transform-origin:center top;
  background:
    linear-gradient(90deg,transparent 0 24%,rgba(167,95,255,.035) 24% 24.2%,transparent 24.4% 75.6%,rgba(167,95,255,.035) 75.8% 76%,transparent 76%),
    linear-gradient(180deg,rgba(180,111,255,.11),rgba(125,49,231,.025) 42%,transparent 76%);
  clip-path:polygon(43% 0,57% 0,92% 100%,8% 100%);
  filter:blur(.2px);animation:si81TunnelBreath 5.2s ease-in-out infinite alternate!important;
}
.si-exp-intro-beam-v60:before,.si-exp-intro-beam-v60:after{border-radius:0!important;border:0!important}
.si-exp-intro-beam-v60:before{inset:0!important;background:linear-gradient(90deg,transparent 49.8%,rgba(220,190,255,.14) 50%,transparent 50.2%)}
.si-exp-intro-beam-v60:after{inset:auto 10% 6vh!important;height:1px;background:linear-gradient(90deg,transparent,rgba(190,135,255,.26),transparent)}

.si-exp-intro-center-v60{width:min(980px,91vw)!important;padding:18px 0 20px}
.si-exp-intro-logo-v60{height:72px!important;margin-bottom:14px!important}
.si-exp-intro-kicker-v60{margin-bottom:15px!important;color:#c09aff!important;font-size:9px!important;letter-spacing:.24em!important}
.si-exp-intro-center-v60 h1{font-size:clamp(3.35rem,9.1vw,8.3rem)!important;line-height:.78!important;letter-spacing:-.055em!important}
.si-exp-intro-center-v60 h1 span:first-child{filter:drop-shadow(0 0 28px rgba(190,133,255,.14))}
.si-exp-intro-center-v60 h1 span:last-child{-webkit-text-stroke:1px rgba(221,193,255,.82)!important}
.si-exp-intro-center-v60>p{
  max-width:690px;margin:20px auto 22px!important;color:#c7bdcf!important;font-size:clamp(.88rem,1.55vw,1.05rem)!important;
  line-height:1.62!important;text-wrap:balance
}
.si-exp-intro-actions-v60{gap:9px!important;flex-wrap:wrap;justify-content:center}
.si-exp-enter-v60{
  min-width:310px!important;padding:14px 16px 14px 22px!important;background:linear-gradient(120deg,#6d1bd7 0%,#9c4dff 58%,#b478ff 100%)!important;
  border-color:rgba(225,198,255,.54)!important;box-shadow:0 18px 62px rgba(115,33,221,.34),inset 0 1px 0 rgba(255,255,255,.15)!important;
}
body.si81-entry-ready .si-exp-enter-v60{animation:si81EnterPulse 2.4s ease-in-out infinite}
.si-exp-sound-v60{padding:13px 14px!important;background:rgba(13,8,18,.74)!important;backdrop-filter:blur(12px)}
.si-exp-skip-v60{
  margin-top:12px!important;padding:11px 18px!important;border:1px solid rgba(208,170,255,.16)!important;border-radius:999px!important;
  background:rgba(9,6,12,.58)!important;color:#c2b6c9!important;text-decoration:none!important;font:900 8px/1 ui-monospace,monospace!important;
  letter-spacing:.14em!important;transition:.25s ease!important;backdrop-filter:blur(10px)
}
.si-exp-skip-v60:hover,.si-exp-skip-v60:focus-visible{color:#fff!important;border-color:rgba(208,170,255,.46)!important;background:rgba(117,49,205,.14)!important;transform:translateY(-1px)}
.si-exp-intro-meta-v60{color:#7e7386!important;font-size:8px!important}
.si-exp-loader-v60{z-index:5!important}.si-exp-loader-v60 small{white-space:nowrap}
.si-v61-volume-hint{margin-top:9px!important;opacity:.78}

.si78-intro-runtime{margin-top:10px!important;color:#8f8498!important}
.si81-entry-signals{
  display:flex;align-items:stretch;justify-content:center;gap:13px;margin-top:15px;padding:10px 14px;border:1px solid rgba(213,177,255,.12);
  border-radius:16px;background:linear-gradient(180deg,rgba(12,8,17,.62),rgba(8,5,11,.36));backdrop-filter:blur(14px);opacity:0;
  animation:siExpRevealV60 .7s 1s var(--si-exp-ease) forwards
}
.si81-entry-signals>span{display:grid;gap:3px;min-width:108px;text-align:left}
.si81-entry-signals b{color:#f7f2fa;font:950 8px/1 ui-monospace,monospace;letter-spacing:.1em}
.si81-entry-signals small{color:#817788;font:750 7px/1.35 ui-monospace,monospace;letter-spacing:.03em;white-space:nowrap}
.si81-entry-signals>i{width:1px;background:linear-gradient(transparent,rgba(201,160,255,.18),transparent)}
.si81-entry-signals .si81-signal-price small{color:#c79cff;font-weight:900}

/* ---------- Film: progreso manda la voz real ---------- */
.si81-film-progressbar{position:absolute;z-index:35;left:0;right:0;top:0;height:2px;background:rgba(255,255,255,.045);pointer-events:none;overflow:hidden}
.si81-film-progressbar i{display:block;width:0;height:100%;background:linear-gradient(90deg,#7d29e8,#c587ff,#fff);box-shadow:0 0 18px rgba(191,126,255,.58);transition:width .08s linear}
.si81-film-clock{display:inline-flex;align-items:center;gap:7px;padding:0 8px;color:#9d90a6;font:900 7px/1 ui-monospace,monospace;letter-spacing:.08em;white-space:nowrap}
.si81-film-clock i{width:5px;height:5px;border-radius:50%;background:#b879ff;box-shadow:0 0 10px rgba(184,121,255,.72);animation:si78Pulse 1.3s ease-in-out infinite}
.si81-film-clock b{font-weight:900;color:#cfc4d6}
.si-v64-film-controls .si-v64-skip{color:#d2c2df!important;border-color:rgba(195,145,255,.24)!important}
.si-v69-mobile-skip{letter-spacing:.08em!important}

/* ---------- Portal: 5 rutas, incluida la nueva oferta de pantalones ---------- */
.si81-route-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important}
.si81-route-grid .si78-route{min-height:198px;padding:17px 15px}
.si81-route-grid .si78-route strong{font-size:clamp(1.25rem,2.05vw,1.9rem)}
.si81-route-grid .si78-route em{font-size:.68rem}
.si81-route-grid .si78-route-foot{font-size:7px}
.si81-route-price{border-color:rgba(196,132,255,.34)!important;background:linear-gradient(160deg,rgba(43,23,63,.84),rgba(10,6,15,.9))!important}
.si81-route-price:after{content:"35K";position:absolute;right:-7px;top:35px;font:950 4rem/.8 Anton,Impact,sans-serif;color:rgba(211,174,255,.045);transform:rotate(-7deg);z-index:-1}
.si81-route-price .si78-route-foot span{color:#d5b3ff}

/* ---------- Precio pantalones: que el cambio se note donde vende ---------- */
.prod-card.si81-price-drop{border-color:rgba(178,105,255,.28)!important;box-shadow:0 24px 65px rgba(60,20,94,.12)}
.si81-new-price-badge{display:inline-flex;width:max-content;margin-bottom:9px;padding:6px 9px;border-radius:999px;border:1px solid rgba(196,136,255,.28);background:rgba(151,73,243,.09);color:#c89dff;font:950 7px/1 ui-monospace,monospace;letter-spacing:.14em}
.si81-price-context{display:flex;align-items:center;gap:8px;margin:12px 0 -2px;color:#756b7d;font-size:.72rem}
.si81-price-context span{text-decoration:line-through;text-decoration-thickness:1px}.si81-price-context b{color:#b98bec;font-size:.64rem;letter-spacing:.12em}
.prod-card.si81-price-drop .prod-price{color:#fff!important;text-shadow:0 0 22px rgba(178,103,255,.25)}

@keyframes si81TunnelBreath{0%{opacity:.66;transform:scaleX(.97)}100%{opacity:.94;transform:scaleX(1.04)}}
@keyframes si81EnterPulse{0%,100%{box-shadow:0 18px 62px rgba(115,33,221,.34),inset 0 1px 0 rgba(255,255,255,.15)}50%{box-shadow:0 22px 82px rgba(142,61,241,.46),0 0 0 5px rgba(167,95,255,.035),inset 0 1px 0 rgba(255,255,255,.18)}}

@media(max-width:1150px){
  .si81-route-grid{grid-template-columns:repeat(3,1fr)!important}
  .si81-route-grid .si78-route:nth-child(4),.si81-route-grid .si78-route:nth-child(5){min-height:160px}
}
@media(max-width:760px){
  .si-exp-intro-center-v60{width:min(94vw,560px)!important;padding:8px 0 54px}
  .si-exp-intro-logo-v60{height:55px!important;margin-bottom:10px!important}
  .si-exp-intro-kicker-v60{font-size:7px!important;margin-bottom:12px!important}
  .si-exp-intro-center-v60 h1{font-size:clamp(3rem,15.6vw,5.15rem)!important;line-height:.8!important}
  .si-exp-intro-center-v60>p{max-width:345px;margin:16px auto 18px!important;font-size:.81rem!important;line-height:1.48!important}
  .si-exp-enter-v60{width:min(100%,340px);min-width:0!important;padding:12px 13px 12px 19px!important;font-size:10px!important}
  .si-exp-enter-v60 b{width:31px!important;height:31px!important}
  .si-exp-sound-v60{padding:11px 12px!important;font-size:8px!important}
  .si-exp-skip-v60{margin-top:9px!important;padding:9px 14px!important;font-size:7px!important}
  .si78-intro-runtime{font-size:6px!important;gap:6px!important;margin-top:8px!important}
  .si78-intro-runtime i{width:16px!important}
  .si81-entry-signals{width:min(100%,355px);gap:7px;margin-top:10px;padding:8px 9px;border-radius:12px;overflow:hidden}
  .si81-entry-signals>span{min-width:0;flex:1;text-align:center}.si81-entry-signals b{font-size:6px}.si81-entry-signals small{font-size:5.5px;white-space:normal}
  .si-exp-intro-meta-v60{top:13px!important;left:14px!important;right:14px!important;font-size:6px!important}.si-exp-intro-meta-v60 span:nth-child(2){display:none}
  .si-exp-loader-v60{left:14px!important;bottom:12px!important;grid-template-columns:auto minmax(70px,105px) auto!important;font-size:6px!important}.si-exp-intro-corner-v60{right:14px!important;bottom:12px!important;font-size:6px!important}
  .si-v61-volume-hint{font-size:6px!important}
  .si81-route-grid{grid-template-columns:1fr 1fr!important}
  .si81-route-grid .si78-route{min-height:144px!important;padding:14px!important}.si81-route-grid .si78-route strong{margin-top:17px!important;font-size:1.35rem!important}.si81-route-grid .si78-route em{font-size:.62rem!important}.si81-route-grid .si78-route-foot{margin-top:12px!important}
  .si81-route-grid .si78-route:last-child{grid-column:1/-1;min-height:128px!important}
  .si81-film-clock{display:none}
}
@media(max-width:420px){
  .si-exp-intro-center-v60{padding-bottom:60px}
  .si-exp-intro-center-v60 h1{font-size:clamp(2.85rem,15vw,4.45rem)!important}
  .si-exp-intro-center-v60>p{max-width:315px;font-size:.76rem!important}
  .si81-entry-signals{display:grid;grid-template-columns:1fr 1fr;max-width:330px}.si81-entry-signals>i{display:none}
  .si81-entry-signals>span{padding:2px 3px}
  .si81-route-grid{grid-template-columns:1fr!important}.si81-route-grid .si78-route:last-child{grid-column:auto}
}
@media(prefers-reduced-motion:reduce){
  .si-exp-intro-beam-v60,body.si81-entry-ready .si-exp-enter-v60,.si81-film-clock i{animation:none!important}
}

/* V81 mobile polish: lectura limpia y cero ruido visual en el primer toque */
@media(max-width:760px){
  .si78-portal::before{filter:saturate(.5) contrast(1.12) brightness(.34)!important}
  .si78-portal::after{background:
    radial-gradient(circle at 20% 14%,rgba(139,57,239,.26),transparent 30%),
    radial-gradient(circle at 82% 72%,rgba(85,28,160,.20),transparent 34%),
    linear-gradient(180deg,rgba(5,3,8,.30),rgba(5,3,8,.72))!important;
    mask-image:none!important
  }
  .si78-portal-shell{max-width:100%;overflow-x:clip}
  .si78-route{max-width:100%}
}
@media(prefers-reduced-motion:reduce){
  .si78-portal,.si78-route,.si81-film-progressbar i{transition:none!important}
}
