/* Createch Negocios - movimiento de landing v1.3.2
   Movimiento limpio sin mantener transforms sobre bloques de texto para conservar nitidez. */

.landing-nav{transition:box-shadow .25s ease,background .25s ease,border-color .25s ease}
.landing-nav.is-scrolled{background:rgba(255,255,255,.985);box-shadow:0 10px 32px rgba(15,23,42,.08);border-color:rgba(226,232,240,.9)}

.hero-pro{position:relative;isolation:isolate}
.hero-pro::after{content:"";position:absolute;z-index:-1;width:360px;height:360px;right:-120px;bottom:-160px;border-radius:50%;background:radial-gradient(circle,rgba(96,165,250,.16),rgba(96,165,250,0) 68%);filter:blur(8px);animation:cn-float-orb 10s ease-in-out infinite alternate;pointer-events:none}
@keyframes cn-float-orb{from{translate:0 0;scale:.94}to{translate:-34px -20px;scale:1.06}}

/* Reveal: el estado final queda en transform:none para que el texto no permanezca rasterizado. */
.cn-reveal{opacity:0;transform:translateY(16px);transition:opacity .52s cubic-bezier(.2,.7,.2,1),transform .52s cubic-bezier(.2,.7,.2,1);transition-delay:var(--cn-delay,0ms)}
.cn-reveal.cn-visible{opacity:1;transform:none}
.cn-reveal-left{transform:translateX(-18px)}
.cn-reveal-right{transform:translateX(18px)}
.cn-reveal-left.cn-visible,.cn-reveal-right.cn-visible{transform:none}

/* El panel demo no rota: un spotlight suave sigue el puntero sin afectar la nitidez del texto. */
.product-showcase{--cn-x:72%;--cn-y:18%;position:relative;transition:box-shadow .28s ease,border-color .28s ease;background-image:radial-gradient(circle at var(--cn-x) var(--cn-y),rgba(96,165,250,.08),transparent 34%)}
.product-showcase::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(circle at var(--cn-x) var(--cn-y),rgba(255,255,255,.055),transparent 26%);opacity:.7;transition:opacity .25s ease}
.product-showcase:hover{box-shadow:0 38px 100px rgba(0,0,0,.42);border-color:#315079}
.product-showcase .showcase-kpis>div,.product-showcase .showcase-chart,.product-showcase .showcase-bottom{transform:none!important}

.live-dot{position:relative;padding-left:12px}
.live-dot::before{content:"";position:absolute;left:0;top:50%;width:6px;height:6px;border-radius:50%;background:#7ee2a8;transform:translateY(-50%);box-shadow:0 0 0 0 rgba(126,226,168,.5);animation:cn-live 2.2s ease-out infinite}
@keyframes cn-live{0%{box-shadow:0 0 0 0 rgba(126,226,168,.48)}70%{box-shadow:0 0 0 8px rgba(126,226,168,0)}100%{box-shadow:0 0 0 0 rgba(126,226,168,0)}}

.showcase-chart .bars i{transform-origin:bottom;animation:cn-bar-rise .8s cubic-bezier(.2,.8,.2,1) both;animation-play-state:paused}
.product-showcase.cn-visible .showcase-chart .bars i{animation-play-state:running}
.showcase-chart .bars i:nth-child(2){animation-delay:.08s}.showcase-chart .bars i:nth-child(3){animation-delay:.16s}.showcase-chart .bars i:nth-child(4){animation-delay:.24s}.showcase-chart .bars i:nth-child(5){animation-delay:.32s}.showcase-chart .bars i:nth-child(6){animation-delay:.40s}.showcase-chart .bars i:nth-child(7){animation-delay:.48s}
@keyframes cn-bar-rise{from{transform:scaleY(.08);opacity:.35}to{transform:scaleY(1);opacity:1}}

/* Mantener tipografia nitida: la tarjeta destacada usa margen, no transform permanente. */
.pricing-card.featured{transform:none!important;margin-top:-8px;margin-bottom:8px}

.pain-grid>div,.sector,.bento>* ,.security-cards>div,.steps>div,.pricing-card,.addon-price-cards>div,.faq-list details{transition:border-color .22s ease,box-shadow .22s ease,background .22s ease}
@media (hover:hover) and (pointer:fine){
  .pain-grid>div:hover,.sector:hover,.steps>div:hover,.pricing-card:not(.featured):hover,.addon-price-cards>div:hover{box-shadow:0 15px 36px rgba(15,23,42,.08);border-color:#cfd9e7}
  .sector:hover .sector-icon{scale:1.04}
  .security-cards>div:hover{border-color:#355071;background:rgba(255,255,255,.055)}
}
.sector-icon{transition:scale .22s ease}

.btn-primary{position:relative;overflow:hidden;transition:box-shadow .2s ease,background .2s ease}
.btn-primary::after{content:"";position:absolute;inset:-2px auto -2px -45%;width:35%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.32),transparent);transform:skewX(-18deg);transition:left .55s ease;pointer-events:none}
@media (hover:hover) and (pointer:fine){.btn-primary:hover{box-shadow:0 10px 22px rgba(37,99,235,.22)}.btn-primary:hover::after{left:120%}}

.steps{position:relative}
.steps::before{content:"";position:absolute;left:4%;right:4%;top:37px;height:1px;background:linear-gradient(90deg,transparent,#d6deea 10%,#d6deea 90%,transparent);transform:scaleX(0);transform-origin:left;transition:transform 1s ease .15s}
.steps.cn-sequence-visible::before{transform:scaleX(1)}
.steps>div{background:#fff;z-index:1}

.faq-list summary{transition:color .2s ease,padding-left .2s ease}
.faq-list details[open] summary{color:#1746a2;padding-left:4px}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .hero-pro::after,.live-dot::before,.showcase-chart .bars i{animation:none!important}
  .cn-reveal,.cn-reveal-left,.cn-reveal-right{opacity:1!important;transform:none!important;transition:none!important}
  .pain-grid>div,.sector,.bento>* ,.security-cards>div,.steps>div,.pricing-card,.addon-price-cards>div,.faq-list details,.btn-primary{transition:none!important}
  .steps::before{transform:scaleX(1)!important;transition:none!important}
}

@media(max-width:900px){.steps::before{display:none}.pricing-card.featured{margin-top:0;margin-bottom:0}}

.capacity-note{margin-top:18px;padding:18px 20px;border:1px solid #dfe5ee;border-radius:16px;background:#f8fafc;display:grid;gap:6px;color:#475467}
.capacity-note b{color:#172033;font-size:14px}.capacity-note p{margin:0 0 8px;font-size:13px;line-height:1.6}
.plan-table td small{display:block;color:#8792a5;font-weight:500;margin-top:3px;white-space:normal}
.addon-price-cards{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))!important}