/* =====================================================================
   SHOP IMPO V100 — Final design consolidation
   Completa las 6 etapas: sistema, header/hero, catálogo, confianza,
   growth, footer + mobile. Capa final no destructiva sobre V98/V99.
   ===================================================================== */

:root{
  --si-accent:#7c3aed;
  --si-accent-soft:#a78bfa;
  --si-bg:#08080a;
  --si-bg-soft:#0d0d10;
  --si-surface:#111114;
  --si-surface-2:#17171b;
  --si-text:#fafafa;
  --si-muted:#a1a1aa;
  --si-subtle:#71717a;
  --si-line:rgba(255,255,255,.10);
  --si-line-strong:rgba(255,255,255,.18);
  --si-radius-xs:8px;
  --si-radius-sm:12px;
  --si-radius-md:16px;
  --si-radius-lg:24px;
  --si-shadow:0 20px 60px rgba(0,0,0,.22);
  --si-container:1240px;
  --si-page-pad:clamp(18px,3vw,34px);
  --si-section:clamp(64px,7vw,104px);
  --si-fast:160ms ease;
}

html{scroll-padding-top:104px;background:var(--si-bg)}
body{background:var(--si-bg)!important;color:var(--si-text);font-family:'Inter','Barlow',system-ui,sans-serif}
.container{width:min(var(--si-container),100%);padding-inline:var(--si-page-pad)!important}
::selection{background:rgba(124,58,237,.36);color:#fff}

/* ---------- ETAPA 1: sistema visual ---------- */
body :where(h1,h2,h3,h4){font-family:'Barlow','Inter',sans-serif}
body :where(p,li,small,label,input,select,textarea,button,a){font-family:'Inter','Barlow',sans-serif}
.eyebrow{color:var(--si-muted)!important;font:800 .66rem/1.2 'Inter',sans-serif!important;letter-spacing:.14em!important;text-transform:uppercase!important}
.section-head{border-bottom:1px solid var(--si-line)!important}
.section-head h2{font-family:'Barlow',sans-serif!important;font-weight:850!important;letter-spacing:-.04em!important;text-transform:none!important}

.btn,
button.btn,
a.btn{
  min-height:44px;
  border-radius:999px!important;
  box-shadow:none!important;
  font-weight:800!important;
  letter-spacing:.01em!important;
  transition:background var(--si-fast),border-color var(--si-fast),color var(--si-fast),transform var(--si-fast)!important;
}
.btn-primary{background:var(--si-accent)!important;border-color:var(--si-accent)!important;color:#fff!important}
.btn-primary:hover{background:#8b5cf6!important;border-color:#8b5cf6!important;transform:translateY(-1px)}
.btn-outline{border-color:var(--si-line-strong)!important;background:transparent!important;color:#fff!important}
.btn-outline:hover{border-color:#fff!important;background:#fff!important;color:#09090b!important}
:where(button,a,input,select,textarea):focus-visible{outline:2px solid var(--si-accent-soft)!important;outline-offset:3px!important}

/* ---------- ETAPA 2: header ---------- */
.premium-topbar{
  min-height:30px!important;
  border-bottom:1px solid var(--si-line)!important;
  background:#050506!important;
}
.premium-topbar-inner{
  max-width:var(--si-container)!important;
  margin:auto!important;
  padding:7px var(--si-page-pad)!important;
  gap:26px!important;
  justify-content:center!important;
  color:#a1a1aa!important;
  font-size:.63rem!important;
  letter-spacing:.045em!important;
}
header{
  position:sticky!important;
  top:0!important;
  z-index:900!important;
  border-bottom:1px solid var(--si-line)!important;
  background:rgba(8,8,10,.88)!important;
  backdrop-filter:blur(22px) saturate(1.15)!important;
  box-shadow:none!important;
}
.nav-inner{
  max-width:var(--si-container)!important;
  min-height:70px!important;
  margin:auto!important;
  padding:12px var(--si-page-pad)!important;
  gap:18px!important;
}
.logo-img{height:36px!important;width:auto!important;object-fit:contain!important}
nav ul{gap:24px!important}
nav a,.shop-ai-nav-link,.nav-dropdown-trigger{
  color:#a1a1aa!important;
  font-size:.72rem!important;
  font-weight:750!important;
  letter-spacing:.03em!important;
}
nav a:hover,.shop-ai-nav-link:hover,.nav-dropdown-trigger:hover{color:#fff!important}
.header-tools{gap:6px!important}
.header-tool-btn,.account-entry,.nav-toggle{
  min-width:40px!important;
  min-height:40px!important;
  border:1px solid transparent!important;
  border-radius:999px!important;
  background:transparent!important;
}
.header-tool-btn:hover,.account-entry:hover,.nav-toggle:hover{border-color:var(--si-line)!important;background:rgba(255,255,255,.05)!important}
.account-entry-label{font-size:.68rem!important}

/* ---------- ETAPA 2: hero ---------- */
.si-exp-hero-v60{
  min-height:auto!important;
  padding:clamp(76px,8vw,120px) 0 clamp(58px,6vw,88px)!important;
  border-bottom:1px solid var(--si-line)!important;
  background:
    radial-gradient(circle at 74% 24%,rgba(124,58,237,.13),transparent 30%),
    linear-gradient(180deg,#09090b 0%,#08080a 100%)!important;
}
.si-exp-hero-v60>.container{
  display:grid!important;
  grid-template-columns:minmax(0,1.02fr) minmax(360px,.98fr)!important;
  gap:clamp(42px,7vw,92px)!important;
  align-items:center!important;
}
.si-exp-hero-copy-v60{max-width:690px!important;padding:0!important}
.si-exp-hero-copy-v60 .eyebrow{display:block!important;margin-bottom:18px!important}
.si-exp-hero-copy-v60 h1{
  margin:0 0 24px!important;
  font-size:clamp(3.6rem,6.6vw,6.8rem)!important;
  line-height:.86!important;
  letter-spacing:-.055em!important;
}
.si-exp-title-violet-v60{color:var(--si-accent-soft)!important}
.si-exp-title-small-v60{
  max-width:520px!important;
  margin-top:22px!important;
  color:#d4d4d8!important;
  font-size:clamp(1rem,1.5vw,1.2rem)!important;
  font-weight:600!important;
  line-height:1.35!important;
  letter-spacing:-.01em!important;
}
.si-exp-hero-copy-v60>p{
  max-width:570px!important;
  margin:0!important;
  color:var(--si-muted)!important;
  font-size:.96rem!important;
  line-height:1.68!important;
}
.si-exp-hero-copy-v60 .btn-row{display:flex!important;gap:10px!important;margin-top:28px!important}
.si-exp-hero-copy-v60 .btn{min-height:46px!important;padding-inline:20px!important}
.si-exp-hero-copy-v60 .shop-ai-hero-btn{
  flex-basis:100%!important;
  width:max-content!important;
  min-height:32px!important;
  margin-top:2px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  color:#a1a1aa!important;
  justify-content:flex-start!important;
  font-size:.7rem!important;
  text-decoration:underline!important;
  text-underline-offset:4px!important;
}
.hero-trust{display:flex!important;gap:0!important;margin-top:30px!important;padding-top:20px!important;border-top:1px solid var(--si-line)!important}
.hero-trust .trust-pill{
  padding:0 13px!important;
  border:0!important;
  border-right:1px solid var(--si-line)!important;
  background:transparent!important;
  color:#8f8f98!important;
  font-size:.65rem!important;
  font-weight:650!important;
  box-shadow:none!important;
}
.hero-trust .trust-pill:first-child{padding-left:0!important}
.hero-trust .trust-pill:last-child{border-right:0!important}
.si-exp-hero-stage-v60{
  width:100%!important;
  max-width:520px!important;
  height:520px!important;
  min-height:520px!important;
  justify-self:end!important;
  border:1px solid var(--si-line)!important;
  border-radius:var(--si-radius-lg)!important;
  background:radial-gradient(circle at 50% 40%,rgba(124,58,237,.14),transparent 43%),#0c0c0f!important;
  clip-path:none!important;
  overflow:hidden!important;
  box-shadow:none!important;
}
.si-exp-hero-stage-v60::before,.si-exp-hero-stage-v60::after{opacity:.35!important}
.si-exp-shirt-v60{border:1px solid rgba(255,255,255,.12)!important;box-shadow:0 18px 46px rgba(0,0,0,.34)!important}
.si-exp-stage-caption-v60{border-radius:999px!important}
.hero-scroll{display:none!important}
.si-exp-marquee-v60{height:44px!important;background:#0b0b0d!important;border-color:var(--si-line)!important}
.si-exp-marquee-track-v60 span{font-size:.68rem!important}

/* Commerce first: los módulos auxiliares quedan secundarios. */
#siAccesoRapido{padding:34px 0 18px!important;background:var(--si-bg)!important}
.si-acceso-head{margin-bottom:20px!important}
.si-acceso-head h2{font-size:clamp(1.7rem,3.2vw,2.5rem)!important;letter-spacing:-.035em!important;text-transform:none!important}
.si-acceso-head p{color:var(--si-muted)!important}
.si-acceso-grid{gap:10px!important}
.si-acceso-grid > *{border:1px solid var(--si-line)!important;border-radius:var(--si-radius-md)!important;background:var(--si-surface)!important;box-shadow:none!important}
.si-acceso-todos{margin-top:14px!important;color:#d4d4d8!important;font-size:.74rem!important}

/* ---------- ETAPA 3: catálogo ---------- */
#productos{padding-top:clamp(46px,5vw,72px)!important}
#productos .section-head{margin-bottom:24px!important}
#productos .grid-productos{gap:14px!important}
#productos .prod-card{border-radius:14px!important}
#productos .prod-info{padding:18px!important}
#productos .prod-info h3{font-size:1.08rem!important}
#productos .prod-desc{margin-bottom:14px!important}
#productos .prod-price{font-size:1.35rem!important}
#productos .prod-actions .model-open{background:var(--si-accent)!important;border-color:var(--si-accent)!important}
#productos .prod-actions .model-open:hover{background:#8b5cf6!important}
#productos .filter-bar{top:78px!important}
#entrega-inmediata{margin:28px 0 24px!important}

/* ---------- ETAPA 4: confianza realmente consolidada ---------- */
#info{padding-bottom:var(--si-section)!important}
.si-v99-trust-hub{grid-template-columns:1.15fr repeat(3,1fr)!important;gap:10px!important}
.si-v99-trust-intro,.si-v99-trust-card{min-height:204px!important;border-radius:14px!important}
.si-v99-trust-intro{background:#f4f4f5!important}
.si-v99-trust-card{background:var(--si-surface)!important}
.si-v99-trust-icon{margin-bottom:24px!important}
.si-v99-trust-details,.si-v100-trust-detail{
  margin-top:10px!important;
  border:1px solid var(--si-line)!important;
  border-radius:14px!important;
  background:var(--si-surface)!important;
  overflow:hidden!important;
}
.si-v100-trust-detail>summary,
.si-v99-trust-details>summary{
  list-style:none!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  min-height:58px!important;
  padding:0 18px!important;
  color:#f4f4f5!important;
  cursor:pointer!important;
  font-size:.75rem!important;
  font-weight:800!important;
}
.si-v100-trust-detail>summary::-webkit-details-marker{display:none}
.si-v100-trust-detail>summary::after{content:'+';color:var(--si-muted);font-size:1.1rem}
.si-v100-trust-detail[open]>summary::after{content:'−'}
.si-v100-trust-detail>section{padding:0!important;background:transparent!important}
.si-v100-trust-detail>section>.container{max-width:none!important;padding:0 18px 18px!important}
.si-v100-trust-detail>section .section-head{display:none!important}
.si-v100-trust-detail #envios .steps-row,
.si-v100-trust-detail #envios .ship-grid{margin-top:18px!important}
.si-v100-trust-detail #cambios .si86-warranty-hero{margin-top:18px!important}

/* ---------- ETAPA 5: growth fusionado ---------- */
.si-v99-growth-hub{padding-block:clamp(56px,6vw,84px)!important;background:#0c0c0f!important}
.si-v99-growth-head{margin-bottom:20px!important}
.si-v99-growth-head h2{font-size:clamp(2.35rem,5vw,4.25rem)!important}
.si-v99-growth-tabs{position:sticky;top:76px;z-index:16;margin-bottom:18px!important;padding:8px 0 10px!important;background:linear-gradient(180deg,#0c0c0f 75%,rgba(12,12,15,0))!important}
.si-v99-growth-tab{min-height:40px!important;padding:0 16px!important}
.si-v99-growth-panels .si-growth-product-card,
.si-v99-growth-panels .si-combo-card,
.si-v99-growth-panels .si-compare-card{border-radius:14px!important}

/* Compra asistida e IA: siguen disponibles, pero no dominan la home. */
#shopSalesFunnel,#shopAiPromo{background:var(--si-bg)!important}
#shopSalesFunnel{padding:var(--si-section) 0!important;border-top:1px solid var(--si-line)!important}
#shopSalesFunnel .shop-sales-head{margin-bottom:22px!important}
#shopSalesFunnel .shop-sales-head h2{font-size:clamp(2rem,4vw,3.4rem)!important;text-transform:none!important;letter-spacing:-.04em!important}
#shopSalesFunnel .shop-sales-paths{gap:10px!important}
#shopSalesFunnel .shop-sales-paths article{border:1px solid var(--si-line)!important;border-radius:14px!important;background:var(--si-surface)!important;box-shadow:none!important}
#shopAiPromo{padding:0 0 var(--si-section)!important}
#shopAiPromo .shop-ai-promo-card{border:1px solid var(--si-line)!important;border-radius:14px!important;background:var(--si-surface)!important;box-shadow:none!important}

/* Historia mantiene valor de marca, ahora después del producto. */
#siStoryV62{border-block:1px solid var(--si-line)!important;background:#070708!important}

/* ---------- ETAPA 6: footer ---------- */
body>footer{padding-top:56px!important;background:#060607!important}
body>footer .footer-inner{gap:28px!important}
body>footer .si-footer-legal{gap:10px 24px!important}
body>footer .si-footer-legal a{padding-block:3px!important}
body>footer .si-v99-footer-social{color:#fff!important;font-weight:750!important}
body>footer .footer-whatsapp-number{color:#d4d4d8!important}

/* ---------- Responsive / mobile ---------- */
@media(max-width:1080px){
  nav ul{gap:16px!important}
  .account-entry-label{display:none!important}
  .si-exp-hero-v60>.container{grid-template-columns:minmax(0,1fr) minmax(320px,.8fr)!important;gap:42px!important}
  .si-exp-hero-stage-v60{height:460px!important;min-height:460px!important}
  .si-v99-trust-hub{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .si-v99-trust-intro{grid-column:1/-1!important;min-height:150px!important}
}

@media(max-width:820px){
  .premium-topbar-inner{justify-content:flex-start!important;overflow:hidden!important;white-space:nowrap!important}
  .premium-topbar-inner span:nth-child(n+3){display:none!important}
  .nav-inner{min-height:62px!important}
  .logo-img{height:32px!important}
  nav{top:62px!important}
  .si-exp-hero-v60{padding-top:58px!important}
  .si-exp-hero-v60>.container{grid-template-columns:1fr!important;gap:32px!important}
  .si-exp-hero-copy-v60{max-width:100%!important}
  .si-exp-hero-stage-v60{justify-self:center!important;max-width:640px!important;height:430px!important;min-height:430px!important}
  .hero-trust{flex-wrap:wrap!important;gap:8px 16px!important}
  .hero-trust .trust-pill{padding:0!important;border:0!important}
  #productos .filter-bar{top:70px!important;grid-template-columns:1fr 1fr!important}
  #productos .grid-productos{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .si-v99-growth-tabs{top:68px!important}
  .si-v99-trust-hub{grid-template-columns:1fr 1fr!important}
  .si-v99-trust-intro{grid-column:1/-1!important}
  #siStoryV62{display:none!important}
}

@media(max-width:560px){
  :root{--si-page-pad:16px;--si-section:58px}
  .premium-topbar{display:none!important}
  html{scroll-padding-top:70px}
  .nav-inner{padding-block:10px!important}
  .header-tools{margin-left:auto!important}
  .header-tool-btn{min-width:36px!important;min-height:36px!important}
  .shop-ai-header-btn{display:none!important}
  .si-exp-hero-v60{padding:44px 0 48px!important}
  .si-exp-hero-copy-v60 h1{font-size:clamp(3.05rem,15.7vw,4.45rem)!important;line-height:.84!important}
  .si-exp-title-small-v60{font-size:.94rem!important}
  .si-exp-hero-copy-v60>p{font-size:.88rem!important}
  .si-exp-hero-copy-v60 .btn-row{display:grid!important;grid-template-columns:1fr!important}
  .si-exp-hero-copy-v60 .btn{width:100%!important;justify-content:center!important}
  .si-exp-hero-copy-v60 .shop-ai-hero-btn{width:auto!important;justify-self:start!important}
  .hero-trust{display:grid!important;grid-template-columns:1fr 1fr!important;padding-top:16px!important}
  .hero-trust .trust-pill{font-size:.61rem!important}
  .si-exp-hero-stage-v60{height:330px!important;min-height:330px!important;border-radius:18px!important}
  .si-exp-marquee-v60{height:38px!important}
  #siAccesoRapido{padding-top:24px!important}
  .si-acceso-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  #productos{padding-top:40px!important}
  #productos .filter-bar{position:static!important;grid-template-columns:1fr!important}
  #productos .grid-productos{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}
  #productos .prod-visual{aspect-ratio:4/5!important}
  #productos .prod-info{padding:12px!important}
  #productos .prod-info h3{font-size:.9rem!important;line-height:1.12!important}
  #productos .prod-desc{display:none!important}
  #productos .prod-price{font-size:1.05rem!important}
  #productos .prod-actions{grid-template-columns:minmax(0,1fr) 48px!important;align-items:stretch!important}
  #productos .prod-actions .btn-sales-assisted{grid-column:1/-1!important;font-size:.57rem!important}
  #productos .prod-actions .model-open{grid-column:1!important;width:100%!important;font-size:.59rem!important;padding-inline:8px!important}
  #productos .prod-actions>a.btn-outline{display:grid!important;grid-column:2!important;align-self:stretch!important;justify-self:end!important;width:46px!important;min-width:46px!important;min-height:46px!important;padding:0!important;border-radius:50%!important;font-size:0!important;place-items:center!important;background:rgba(37,211,102,.10)!important;border-color:rgba(37,211,102,.55)!important;color:#25d366!important;box-shadow:0 10px 24px rgba(0,0,0,.18)!important}
  #productos .prod-actions>a.btn-outline .si-wa-icon{display:grid!important;place-items:center!important;width:20px!important;height:20px!important}
  #productos .prod-actions>a.btn-outline .si-wa-icon svg{display:block!important;width:20px!important;height:20px!important}
  #productos .prod-actions>a.btn-outline .si-wa-label{display:none!important}
  #productos .shop-product-deposit{font-size:.58rem!important}
  #productos .tag-cat,#productos .stock-badge{top:7px!important;padding:5px 6px!important;font-size:.49rem!important}
  #productos .tag-cat{left:7px!important}#productos .stock-badge{right:7px!important}
  #entrega-inmediata{padding:18px!important}
  .si-v99-trust-hub{grid-template-columns:1fr!important}
  .si-v99-trust-intro{grid-column:auto!important;min-height:165px!important}
  .si-v99-trust-card{min-height:180px!important}
  .si-v99-growth-head{display:block!important}
  .si-v99-growth-head p{margin-top:10px!important}
  .si-v99-growth-tabs{position:static!important;margin-inline:-16px!important;padding-inline:16px!important;background:none!important}
  #shopSalesFunnel .shop-sales-head{display:block!important}
  #shopSalesFunnel .shop-sales-head .btn{width:100%!important;margin-top:16px!important}
  #shopSalesFunnel .shop-sales-paths{grid-template-columns:1fr!important}
  #shopAiPromo .shop-ai-promo-card{align-items:flex-start!important;flex-direction:column!important}
  #shopAiPromo .btn{width:100%!important}
  body>footer .si-footer-legal{grid-template-columns:1fr!important}
}

@media(max-width:390px){
  #productos .grid-productos{grid-template-columns:1fr!important}
  #productos .prod-visual{aspect-ratio:1/1!important}
  #productos .prod-desc{display:block!important}
  .si-acceso-grid{grid-template-columns:1fr!important}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

header.si-v100-scrolled{background:rgba(8,8,10,.96)!important;box-shadow:0 10px 30px rgba(0,0,0,.16)!important}


/* CTA de WhatsApp en tarjetas de producto */
#productos .prod-actions>a.btn-outline .si-wa-icon{display:inline-grid;place-items:center;width:18px;height:18px;margin-right:8px;vertical-align:middle}
#productos .prod-actions>a.btn-outline .si-wa-icon svg{width:18px;height:18px;display:block}
#productos .prod-actions>a.btn-outline .si-wa-label{display:inline}
body>footer .si-v99-footer-social{display:inline-flex!important;align-items:center!important;gap:8px!important}
body>footer .si-v99-footer-social svg{width:16px;height:16px;display:block}


@media(max-width:560px){
  #productos .prod-actions>a.btn-outline .si-wa-label{display:none!important}
}
