
/* ============================================================
   CAPTURE BIZARRE MOTION — EXTERNAL CSS
   ============================================================ */

#capture-bizarre-root {
  --cb-motion-accent:#E59781;
}

/* ---------- HERO ---------- */

.cb-motion-line {
  display:block;
  width:max-content;
  max-width:100%;
  transform-origin:left center;
  will-change:transform,text-shadow;
}

.cb-motion-line--1 {
  animation:cbHeroMotion1 3.8s cubic-bezier(.2,.8,.2,1) infinite;
}

.cb-motion-line--2 {
  animation:cbHeroMotion2 3.8s cubic-bezier(.2,.8,.2,1) .12s infinite;
}

.cb-motion-line--3 {
  animation:cbHeroMotion3 3.8s cubic-bezier(.2,.8,.2,1) .24s infinite;
}

@keyframes cbHeroMotion1 {
  0%,100% { transform:translate3d(0,0,0); }
  7%      { transform:translate3d(8px,-3px,0); }
  15%     { transform:translate3d(0,0,0); }
}

@keyframes cbHeroMotion2 {
  0%,100% { transform:translate3d(0,0,0); }
  8%      { transform:translate3d(10px,-3px,0); }
  16%     { transform:translate3d(0,0,0); }
}

@keyframes cbHeroMotion3 {
  0%,100% {
    transform:translate3d(0,0,0) scale(1);
    text-shadow:0 0 0 rgba(229,151,129,0);
  }

  9% {
    transform:translate3d(12px,-4px,0) scale(1.025);
    text-shadow:0 0 28px rgba(229,151,129,.42);
  }

  18% {
    transform:translate3d(0,0,0) scale(1);
    text-shadow:none;
  }
}

/* Ojo base para seguimiento */
.cb-eye-logo-wrap {
  --cb-eye-x:0px;
  --cb-eye-y:0px;
  --cb-eye-rx:0deg;
  --cb-eye-ry:0deg;

  transform:
    translate3d(var(--cb-eye-x),var(--cb-eye-y),0)
    rotateX(var(--cb-eye-ry))
    rotateY(var(--cb-eye-rx)) !important;

  transform-style:preserve-3d;
  will-change:transform;
  transition:transform .16s ease-out !important;
}

.cb-eye-glow {
  --cb-eye-depth-x:0px;
  --cb-eye-depth-y:0px;
  translate:var(--cb-eye-depth-x) var(--cb-eye-depth-y);
  transition:translate .18s ease-out;
}

/* ---------- STATS ---------- */

.cb-stat strong {
  transform-origin:center;
  will-change:transform,text-shadow;
}

.cb-stat:nth-child(1) strong {
  animation:cbStatPulse 3.8s ease-in-out infinite;
}
.cb-stat:nth-child(2) strong {
  animation:cbStatPulse 3.8s ease-in-out .14s infinite;
}
.cb-stat:nth-child(3) strong {
  animation:cbStatPulse 3.8s ease-in-out .28s infinite;
}

@keyframes cbStatPulse {
  0%,100% {
    transform:translateY(0) scale(1);
    text-shadow:none;
  }

  9% {
    transform:translateY(-5px) scale(1.04);
    text-shadow:0 0 24px rgba(229,151,129,.24);
  }

  18% {
    transform:translateY(0) scale(1);
    text-shadow:none;
  }
}

.cb-stats-grid {
  position:relative;
}

.cb-stats-grid::after {
  content:"";
  position:absolute;
  z-index:8;
  top:0;
  bottom:0;
  left:-22%;
  width:11%;
  pointer-events:none;
  transform:skewX(-18deg);
  background:linear-gradient(
    90deg,
    transparent,
    rgba(229,151,129,.02),
    rgba(229,151,129,.22),
    rgba(229,151,129,.02),
    transparent
  );
  animation:cbStatsSweep 6.8s ease-in-out infinite;
}

@keyframes cbStatsSweep {
  0%,16% { left:-22%; }
  74%,100% { left:112%; }
}

/* ---------- MARCAS ---------- */

.cb-brand:hover,
.cb-brand:focus-within {
  background:#E59781 !important;
  background-color:#E59781 !important;
}

/* ---------- PROCESO ---------- */

.cb-process-step:nth-child(1) {
  animation:cbProcessCard 6s linear infinite;
  animation-delay:0s;
}
.cb-process-step:nth-child(2) {
  animation:cbProcessCard 6s linear infinite;
  animation-delay:2s;
}
.cb-process-step:nth-child(3) {
  animation:cbProcessCard 6s linear infinite;
  animation-delay:4s;
}

@keyframes cbProcessCard {
  0%,15% {
    border-color:rgba(229,151,129,.8);
    background:#1c1817;
  }
  24%,100% {
    border-color:#2c2c2c;
    background:#151515;
  }
}

/* ---------- FORBES ---------- */

.cb-press-side img {
  transition:
    transform .5s cubic-bezier(.16,1,.3,1),
    filter .45s ease !important;
}

.cb-press-side:hover img {
  transform:scale(1.035);
  filter:grayscale(1) contrast(1.08) brightness(1.12);
}

/* ---------- WIKIPEDIA ---------- */

.cb-wiki-link {
  --cb-wiki-y:0px;
}

.cb-wiki-link::before {
  transform:translate3d(0,var(--cb-wiki-y),0) !important;
  will-change:transform;
}

/* ---------- CTA ---------- */

.cb-cta-box::after {
  animation:cbSmileMotion 18s linear infinite alternate !important;
  will-change:transform;
}

@keyframes cbSmileMotion {
  from { transform:translate3d(4vw,0,0); }
  to   { transform:translate3d(-12vw,0,0); }
}

.cb-motion-arrow {
  display:inline-block;
  transition:transform .22s cubic-bezier(.2,.8,.2,1);
}

.cb-cta .cb-btn:hover .cb-motion-arrow {
  transform:translate(4px,-4px);
}

/* ---------- HEADER ---------- */

.cb-header,
.cb-nav,
.cb-logo,
.cb-header .cb-btn--dark {
  transition:
    min-height .28s cubic-bezier(.2,.8,.2,1),
    width .28s cubic-bezier(.2,.8,.2,1),
    padding .28s ease,
    background .28s ease,
    box-shadow .28s ease !important;
}

.cb-header.cb-motion-compact {
  background:rgba(10,10,10,.975);
  box-shadow:0 10px 30px rgba(0,0,0,.14);
}

.cb-header.cb-motion-compact .cb-nav {
  min-height:62px;
}

.cb-header.cb-motion-compact .cb-logo {
  width:108px;
}

.cb-header.cb-motion-compact .cb-btn--dark {
  min-height:41px;
  padding-inline:16px;
}

/* ---------- CURSOR OJO ---------- */

#capture-bizarre-root.cb-eye-cursor-active,
#capture-bizarre-root.cb-eye-cursor-active * {
  cursor:none !important;
}

.cb-eye-cursor {
  position:fixed;
  z-index:2147483000;
  top:0;
  left:0;
  width:38px;
  height:38px;
  pointer-events:none;
  opacity:0;
  will-change:transform;
  transition:opacity .15s ease;
}

.cb-eye-cursor.is-visible {
  opacity:1;
}

.cb-eye-cursor img {
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
  filter:
    drop-shadow(0 4px 8px rgba(0,0,0,.28))
    drop-shadow(0 0 8px rgba(97,212,238,.12));
}

@media (hover:none), (pointer:coarse), (max-width:899px) {
  #capture-bizarre-root.cb-eye-cursor-active,
  #capture-bizarre-root.cb-eye-cursor-active * {
    cursor:auto !important;
  }

  .cb-eye-cursor {
    display:none !important;
  }
}
