/* Estilos para scroll infinito */
@font-face {
  font-family: 'Inter Variable';
  src: url('fonts/Inter-VariableFont_opsz,wght.ttf') format('truetype-variations');
  font-weight: 100 900;
  font-style: normal;
}

:root {
  --color-primary: #F00D00;
  --color-secondary: #0901F0;
  --color-black: #000000;
  --color-white: #ffffff;
}

*{box-sizing:border-box}
html,body{height:100%;margin:0;font-family:'Inter Variable', sans-serif;color:#000000;background:#F00D00}

.scroller{
	height:100vh;
	overflow-y:auto;
	-webkit-overflow-scrolling:touch;
	scroll-behavior:auto; /* no smooth reset */
	padding:24px 0;
}

.content, #content-clone{
	position:relative; /* contiene capas absolutas */
}

.video-item{
  position:absolute;
  width:auto; /* allow canvas children to define visual size */
  transform:translateY(0);
  transition:transform 0.1s linear;
  pointer-events:none;
  will-change:transform;
  z-index:1;
}

.video-item video{
  width:100%;
  height:auto;
  display:block;
  object-fit:cover;
  filter: contrast(1.1);
  transform: scale(1.01); /* evita bordes blancos */
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
}/* Estilos para las capas de texto */
.text-item{
  position:absolute;
  font-family: 'Inter Variable', sans-serif;
  font-variation-settings: 'opsz' var(--opsz, 24);
  white-space:nowrap;
  pointer-events:none;
  user-select:none;
  mix-blend-mode:normal;
  opacity:0.95;
  transform:translateY(0);
  transition:transform 0.1s linear;
  will-change:transform;
  z-index:2;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  letter-spacing: -0.02em;
}

/* Estilos específicos para textos grandes */
.text-item[style*="font-size: 2"] {
  letter-spacing: -0.04em;
  font-weight: 800 !important;
  opacity: 0.9;
  z-index:3;
}.text-item[data-speed="1"]{opacity:0.95}


/* Opcional: punto de referencia para probar posiciones */
.gif-item::after{content:'';display:block;height:6px;width:6px;background:transparent}

/* Pequeña ayuda visual fija */
.note{
	position:fixed;
	left:12px;
	top:12px;
	background:rgba(2,6,23,0.7);
	color:#fff;
	padding:8px 10px;
	border-radius:8px;
	font-size:13px;

.video-canvas{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}