/* Control Center 8.6.0 PREMIUM READY
   Pulido final visual, mobile, catálogo, botones y secciones.
   No modifica precios ni seguridad.
*/

:root{
  --cc-premium-border: rgba(118, 235, 255, .18);
  --cc-premium-soft: rgba(125, 239, 255, .08);
  --cc-premium-blue: #0d8198;
  --cc-premium-blue2: #0a3e74;
  --cc-premium-text: #e9f6fb;
  --cc-premium-muted: #9fb5c5;
}

/* HERO MÁS PREMIUM, MENOS ALTO */
.hero.container{
  position:relative!important;
  overflow:hidden!important;
  border-color:var(--cc-premium-border)!important;
  box-shadow:0 26px 90px rgba(0,0,0,.28), inset 0 0 0 1px rgba(255,255,255,.025)!important;
}
.hero.container::before{
  content:"";
  position:absolute;
  inset:-40% -20% auto auto;
  width:520px;
  height:520px;
  background:radial-gradient(circle, rgba(12,128,180,.17), transparent 62%);
  pointer-events:none;
}
.hero.container::after{
  content:"";
  position:absolute;
  inset:auto auto -35% -18%;
  width:440px;
  height:440px;
  background:radial-gradient(circle, rgba(125,239,255,.08), transparent 62%);
  pointer-events:none;
}
.hero-grid{
  position:relative!important;
  z-index:1!important;
}
.logo-panel-final,
.logo-panel{
  background:linear-gradient(180deg, rgba(255,255,255,.025), rgba(0,0,0,.12))!important;
  border:1px solid rgba(125,239,255,.08)!important;
}
.logo-panel-final img,
.logo-panel img{
  border-radius:10px!important;
  transform:translateZ(0);
}

/* TIPOGRAFÍA / JERARQUÍA */
.hero .kicker{
  color:#dce7ed!important;
  opacity:.98!important;
}
.hero h1{
  color:#edf8fc!important;
  filter:drop-shadow(0 12px 22px rgba(0,0,0,.16));
}
.hero-grid > div > p:not(.kicker){
  color:#adc2cf!important;
}

/* BOTONES */
.primary-cta,
.secondary-cta,
.service-order-btn,
button[data-service-order],
button[data-whatsapp-lite]{
  border-radius:18px!important;
  font-weight:900!important;
  letter-spacing:.01em!important;
  transition:transform .16s ease, filter .16s ease, border-color .16s ease, box-shadow .16s ease!important;
}
.primary-cta:hover,
.secondary-cta:hover,
.service-order-btn:hover,
button[data-service-order]:hover,
button[data-whatsapp-lite]:hover{
  transform:translateY(-1px)!important;
  filter:brightness(1.08)!important;
}
.primary-cta,
.service-order-btn,
button[data-service-order]{
  box-shadow:0 14px 32px rgba(0,110,180,.18)!important;
}
.secondary-cta{
  border-color:rgba(125,239,255,.20)!important;
}

/* ACCESOS RÁPIDOS */
.trust-row span{
  background:rgba(255,255,255,.045)!important;
  border:1px solid rgba(125,239,255,.14)!important;
  color:#d5e4ec!important;
}

/* BLOQUES SIGUIENTES SIN DUPLICAR Y MÁS COMPACTOS */
.showcase,
.combo-offers,
.cc78-intent,
.catalog{
  scroll-margin-top:92px!important;
}
.showcase.container{
  border-color:rgba(125,239,255,.13)!important;
}
.showcase-head h2,
.combo-head h2,
.cc78-intent h2{
  font-family:Rajdhani,Inter,system-ui,sans-serif!important;
  font-weight:850!important;
  letter-spacing:-.02em!important;
}

/* BÚSQUEDAS RÁPIDAS */
.cc78-intent{
  padding:14px!important;
  border-radius:24px!important;
}
.cc78-intent-grid{
  gap:8px!important;
}
.cc78-intent-grid button,
.quick-filter-bar button{
  border-radius:999px!important;
  transition:transform .14s ease, background .14s ease, border-color .14s ease!important;
}
.cc78-intent-grid button:hover,
.quick-filter-bar button:hover{
  transform:translateY(-1px)!important;
  border-color:rgba(125,239,255,.28)!important;
}

/* CATÁLOGO */
.catalog.container{
  gap:16px!important;
}
.tools{
  gap:10px!important;
}
.tools input,
.tools select{
  border-radius:16px!important;
  min-height:46px!important;
  border-color:rgba(125,239,255,.14)!important;
}
.product-card,
.card,
.combo-card{
  border-color:rgba(125,239,255,.12)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.018))!important;
}
.product-card:hover{
  box-shadow:0 18px 46px rgba(0,0,0,.22),0 0 0 1px rgba(125,239,255,.14)!important;
}

/* CARRITO */
.cart-drawer{
  border-left-color:rgba(125,239,255,.16)!important;
}
.cart-item{
  border-radius:18px!important;
}

/* MAYORISTA: sin revelar reglas internas */
.mayorista-secure-banner{
  border-color:rgba(125,239,255,.16)!important;
}

/* MOBILE FINO */
@media(max-width:860px){
  .hero.container{
    border-radius:26px!important;
  }
  .hero-grid{
    gap:14px!important;
  }
  .logo-panel-final,
  .logo-panel{
    min-height:200px!important;
  }
  .logo-panel-final img,
  .logo-panel img{
    max-height:190px!important;
  }
  .catalog.container{
    gap:12px!important;
  }
  .tools{
    grid-template-columns:1fr!important;
  }
  .quick-filter-bar{
    overflow-x:auto!important;
    padding-bottom:4px!important;
  }
  .quick-filter-bar button{
    white-space:nowrap!important;
  }
}
@media(max-width:560px){
  .hero.container{
    padding-left:12px!important;
    padding-right:12px!important;
  }
  .hero h1{
    font-size:clamp(36px,11.5vw,48px)!important;
  }
  .hero-grid > div > p:not(.kicker){
    font-size:10px!important;
  }
  .trust-row{
    display:grid!important;
    grid-template-columns:1fr!important;
  }
  .catalog.container{
    margin-top:10px!important;
  }
}

/* 8.6.1 Hero typography and CTA color refinement */
.hero h1{
  font-family:Rajdhani, Inter, system-ui, sans-serif!important;
  font-weight:800!important;
  font-size:clamp(28px,6vw,62px)!important;
  line-height:.93!important;
  letter-spacing:-.032em!important;
  color:#eef7fb!important;
}
.hero-grid > div > p:not(.kicker){
  font-size:clamp(13px,1.55vw,18px)!important;
  line-height:1.38!important;
  color:#c6d8e2!important;
  max-width:760px!important;
}
.hero .kicker{
  font-family:Orbitron, Rajdhani, sans-serif!important;
  font-size:clamp(12px,1.2vw,15px)!important;
  letter-spacing:.22em!important;
  color:#d5e7ef!important;
}
.primary-cta,
.service-order-btn,
button[data-service-order]{
  background:linear-gradient(135deg,#0d6f86,#11466f)!important;
  border-color:rgba(138,219,235,.16)!important;
  box-shadow:0 12px 28px rgba(5,52,88,.20)!important;
  color:#f3fbfe!important;
}
.primary-cta:hover,
.service-order-btn:hover,
button[data-service-order]:hover{
  background:linear-gradient(135deg,#11809a,#165688)!important;
  box-shadow:0 16px 34px rgba(5,52,88,.26)!important;
}
.secondary-cta,
button[data-whatsapp-lite]{
  background:linear-gradient(180deg,rgba(8,31,51,.92),rgba(8,24,40,.96))!important;
  border:1px solid rgba(133,214,231,.16)!important;
  color:#e6f4f8!important;
}
.secondary-cta:hover,
button[data-whatsapp-lite]:hover{
  background:linear-gradient(180deg,rgba(11,43,70,.96),rgba(9,32,54,.98))!important;
  border-color:rgba(133,214,231,.28)!important;
}
.trust-row span{
  background:linear-gradient(180deg,rgba(8,28,45,.86),rgba(6,20,34,.92))!important;
  border-color:rgba(124,208,225,.14)!important;
}
@media(max-width:700px){
  .hero h1{font-size:clamp(26px,10.2vw,46px)!important;}
  .hero-grid > div > p:not(.kicker){font-size:13px!important;}
}
