/* ForgeCut — página del programa. Todo lo visual es CSS animado (sin imágenes). */
:root {
  --fc-ink: #07080b;
  --fc-ink-2: #0e1016;
  --fc-card: #13161e;
  --fc-line: rgba(255, 255, 255, 0.08);
  --fc-text: #f3f4f7;
  --fc-muted: #9aa1b1;
  --fc-orange: #ff6a00;
  --fc-orange-2: #ff9a3c;
  --fc-amber: #ffc46b;
  --fc-violet: #8b5cf6;
  --fc-cyan: #38d6ff;
  --fc-green: #3fe8a7;
  --fc-display: 'Bebas Neue', 'Montserrat', system-ui, sans-serif;
  --fc-body: 'Montserrat', 'Montserrat-Fallback', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --fc-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

.fc { background: var(--fc-ink); color: var(--fc-text); font-family: var(--fc-body); overflow: hidden; }
.fc *, .fc *::before, .fc *::after { box-sizing: border-box; }
.fc-wrap { max-width: 1180px; margin: 0 auto; padding: 0 20px; }
.fc a { color: inherit; }
.fc [hidden] { display: none !important; }
.fc-paused *, .fc-paused *::before, .fc-paused *::after { animation-play-state: paused !important; }

/* ---------- Botones ---------- */
.fc-btn { display: inline-flex; align-items: center; gap: 10px; padding: 15px 26px; border-radius: 14px; font-weight: 800; font-size: 1rem; text-decoration: none; transition: transform .25s var(--fc-ease), box-shadow .25s var(--fc-ease), background .25s; }
.fc-btn-main { background: linear-gradient(135deg, var(--fc-orange), var(--fc-orange-2)); color: #160800 !important; box-shadow: 0 14px 40px -12px rgba(255, 106, 0, .7); position: relative; overflow: hidden; }
.fc-btn-main::after { content: ""; position: absolute; inset: 0; background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.55) 50%, transparent 70%); transform: translateX(-120%); animation: fc-shine 3.2s 1s infinite; }
.fc-btn-main:hover { transform: translateY(-2px); box-shadow: 0 20px 50px -12px rgba(255, 106, 0, .85); }
.fc-btn-ghost { border: 1.5px solid var(--fc-line); color: var(--fc-text); background: rgba(255,255,255,.03); }
.fc-btn-ghost:hover { border-color: var(--fc-orange); background: rgba(255,106,0,.08); }
.fc-btn:focus-visible { outline: 3px solid var(--fc-amber); outline-offset: 3px; }
@keyframes fc-shine { 0% { transform: translateX(-120%); } 35%, 100% { transform: translateX(120%); } }

/* ---------- Encabezados de sección ---------- */
.fc-sec { padding: 110px 0; position: relative; }
.fc-eyebrow { display: inline-flex; align-items: center; gap: 8px; font: 700 .78rem/1 var(--fc-body); letter-spacing: .14em; text-transform: uppercase; color: var(--fc-orange-2); padding: 8px 14px; border: 1px solid rgba(255,106,0,.3); border-radius: 999px; background: rgba(255,106,0,.07); }
.fc-h2 { font: 400 clamp(2.6rem, 6vw, 4.4rem)/.95 var(--fc-display); letter-spacing: .01em; margin: 18px 0 14px; }
.fc-h2 em { font-style: normal; color: var(--fc-orange); }
.fc-lead { color: var(--fc-muted); font-size: 1.08rem; line-height: 1.7; max-width: 640px; margin: 0; }
.fc-center { text-align: center; } .fc-center .fc-lead { margin: 0 auto; }

/* Aparición al hacer scroll */
.fc-reveal { opacity: 0; transform: translateY(28px); transition: opacity .8s var(--fc-ease), transform .8s var(--fc-ease); transition-delay: var(--d, 0s); }
.fc-reveal.is-in { opacity: 1; transform: none; }

/* =====================================================================
   HERO
   ===================================================================== */
.fc-hero { position: relative; padding: 130px 0 90px; min-height: 760px; }
.fc-hero::before { content: ""; position: absolute; inset: 0; background:
  radial-gradient(60% 50% at 75% 30%, rgba(255,106,0,.22), transparent 70%),
  radial-gradient(40% 40% at 10% 80%, rgba(139,92,246,.16), transparent 70%); pointer-events: none; }
.fc-hero::after { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px); background-size: 56px 56px; mask-image: radial-gradient(70% 60% at 50% 40%, #000, transparent); pointer-events: none; }
.fc-hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 1.1fr; gap: 50px; align-items: center; }
.fc-badge { display: inline-flex; align-items: center; gap: 10px; padding: 7px 14px 7px 8px; border-radius: 999px; background: rgba(255,255,255,.05); border: 1px solid var(--fc-line); font-size: .85rem; color: var(--fc-muted); }
.fc-badge b { background: var(--fc-orange); color: #160800; padding: 3px 10px; border-radius: 999px; font-size: .75rem; letter-spacing: .04em; }
.fc-title { font: 400 clamp(4.4rem, 11vw, 8.6rem)/.85 var(--fc-display); margin: 22px 0 0; letter-spacing: .01em; }
.fc-title span { background: linear-gradient(100deg, var(--fc-orange) 0%, var(--fc-amber) 40%, var(--fc-orange) 80%); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: fc-flow 6s linear infinite; }
@keyframes fc-flow { to { background-position: -200% 0; } }
.fc-tagline { font-size: clamp(1.15rem, 2.2vw, 1.45rem); font-weight: 700; margin: 18px 0 14px; line-height: 1.35; }
.fc-tagline .fc-rot { display: inline-grid; color: var(--fc-orange-2); vertical-align: bottom; }
.fc-tagline .fc-rot > span { grid-area: 1 / 1; opacity: 0; transform: translateY(60%); animation: fc-rot 10s infinite; }
.fc-tagline .fc-rot > span:nth-child(2) { animation-delay: 2.5s; }
.fc-tagline .fc-rot > span:nth-child(3) { animation-delay: 5s; }
.fc-tagline .fc-rot > span:nth-child(4) { animation-delay: 7.5s; }
@keyframes fc-rot { 0% { opacity: 0; transform: translateY(60%); } 4%, 22% { opacity: 1; transform: none; } 26%, 100% { opacity: 0; transform: translateY(-60%); } }
.fc-hero p.fc-lead { margin-bottom: 30px; }
.fc-cta-row { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.fc-meta { margin-top: 18px; color: var(--fc-muted); font-size: .85rem; display: flex; flex-wrap: wrap; gap: 6px 16px; }
.fc-meta i { color: var(--fc-orange-2); margin-right: 5px; }

/* --- Ventana del editor (maqueta animada) --- */
.fc-app { position: relative; aspect-ratio: 16 / 11; border-radius: 18px; background: #0b0c10; border: 1px solid rgba(255,255,255,.1); box-shadow: 0 40px 100px -30px rgba(255,106,0,.45), 0 0 0 1px rgba(255,106,0,.08); transform: perspective(1400px) rotateY(-9deg) rotateX(4deg); transition: transform .8s var(--fc-ease); display: grid; grid-template-rows: 30px 1fr 42%; overflow: hidden; }
.fc-app:hover { transform: perspective(1400px) rotateY(-3deg) rotateX(1deg); }
.fc-app-bar { display: flex; align-items: center; gap: 7px; padding: 0 12px; background: #111318; border-bottom: 1px solid var(--fc-line); font-size: 11px; color: var(--fc-muted); }
.fc-app-bar i { width: 10px; height: 10px; border-radius: 50%; background: #2a2d36; }
.fc-app-bar i:first-child { background: var(--fc-orange); }
.fc-app-bar .fc-rec { margin-left: auto; display: flex; align-items: center; gap: 6px; color: #ff5470; font-weight: 700; letter-spacing: .08em; }
.fc-app-bar .fc-rec::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #ff3355; animation: fc-blink 1.2s infinite; }
@keyframes fc-blink { 50% { opacity: .2; } }

.fc-monitor { position: relative; margin: 10px 12px 6px; border-radius: 8px; overflow: hidden; background: linear-gradient(#1b1030, #3b1640 45%, #ff6a00 46%, #ff9a3c 52%, #2a1426 53%); }
.fc-monitor .sun { position: absolute; width: 22%; aspect-ratio: 1; left: 39%; top: 18%; border-radius: 50%; background: radial-gradient(circle, #ffe2a8, #ff8a2a 70%); box-shadow: 0 0 60px 10px rgba(255,138,42,.5); animation: fc-sun 8s ease-in-out infinite alternate; }
@keyframes fc-sun { to { transform: translateY(18%); } }
.fc-monitor .mt { position: absolute; bottom: 0; left: -10%; width: 220%; height: 55%; background:
  linear-gradient(135deg, transparent 49.5%, #170a1c 50%) 0 100% / 18% 100% repeat-x,
  linear-gradient(225deg, transparent 49.5%, #170a1c 50%) 9% 100% / 18% 100% repeat-x; animation: fc-pan 14s linear infinite; }
.fc-monitor .mt.b { height: 38%; opacity: .9; filter: brightness(.6); animation-duration: 9s; background-size: 12% 100%, 12% 100%; }
@keyframes fc-pan { to { transform: translateX(-45%); } }
.fc-monitor .cap { position: absolute; left: 50%; bottom: 10%; transform: translateX(-50%); font: 400 clamp(14px, 2.2vw, 26px)/1 var(--fc-display); letter-spacing: .04em; color: #fff; text-shadow: 0 3px 0 #000, 0 0 18px rgba(0,0,0,.6); white-space: nowrap; }
.fc-monitor .cap span { display: inline-block; margin: 0 .14em; opacity: .35; animation: fc-karaoke 4s infinite; }
.fc-monitor .cap span:nth-child(2) { animation-delay: .6s; } .fc-monitor .cap span:nth-child(3) { animation-delay: 1.2s; } .fc-monitor .cap span:nth-child(4) { animation-delay: 1.8s; }
@keyframes fc-karaoke { 0%, 8% { opacity: .35; transform: none; } 12%, 40% { opacity: 1; color: var(--fc-amber); transform: scale(1.12); } 55%, 100% { opacity: 1; color: #fff; transform: none; } }
.fc-monitor .tc { position: absolute; top: 8px; right: 10px; font: 600 10px/1 ui-monospace, monospace; color: rgba(255,255,255,.75); background: rgba(0,0,0,.45); padding: 4px 6px; border-radius: 4px; }

.fc-tl { position: relative; padding: 8px 12px 12px; background: #0e1015; border-top: 1px solid var(--fc-line); display: grid; gap: 6px; grid-template-rows: 10px repeat(4, 1fr); }
.fc-ruler { background: repeating-linear-gradient(90deg, rgba(255,255,255,.18) 0 1px, transparent 1px 20px); opacity: .6; }
.fc-track { position: relative; border-radius: 5px; background: rgba(255,255,255,.03); overflow: hidden; }
.fc-clip { position: absolute; top: 2px; bottom: 2px; border-radius: 4px; }
.fc-track.v .fc-clip { background: linear-gradient(90deg, #ff6a00, #ff8f3a); box-shadow: inset 0 0 0 1px rgba(255,255,255,.25); }
.fc-track.v .fc-clip::after { content: ""; position: absolute; inset: 3px; border-radius: 2px; background: repeating-linear-gradient(90deg, rgba(0,0,0,.25) 0 18%, transparent 18% 20%); }
.fc-track.v .c2 { animation: fc-slide 6s var(--fc-ease) infinite; }
@keyframes fc-slide { 0%, 30% { transform: translateX(0); } 45%, 80% { transform: translateX(-14px); } 95%, 100% { transform: translateX(0); } }
.fc-track.t .fc-clip { background: rgba(139,92,246,.75); }
.fc-track.a .fc-clip { background: rgba(63,232,167,.12); box-shadow: inset 0 0 0 1px rgba(63,232,167,.4); display: flex; align-items: center; gap: 2px; padding: 0 4px; }
.fc-track.a .fc-clip i { flex: 1; background: var(--fc-green); border-radius: 2px; height: 30%; animation: fc-wave 1.1s ease-in-out infinite alternate; animation-delay: calc(var(--i) * -.13s); }
.fc-track.m .fc-clip { background: rgba(56,214,255,.12); box-shadow: inset 0 0 0 1px rgba(56,214,255,.4); display: flex; align-items: center; gap: 2px; padding: 0 4px; }
.fc-track.m .fc-clip i { flex: 1; background: var(--fc-cyan); border-radius: 2px; height: 30%; animation: fc-wave 1.4s ease-in-out infinite alternate; animation-delay: calc(var(--i) * -.21s); }
@keyframes fc-wave { to { height: 90%; } }
.fc-playhead { position: absolute; top: 4px; bottom: 6px; left: 12px; width: 2px; background: var(--fc-amber); box-shadow: 0 0 10px var(--fc-amber); animation: fc-play 8s linear infinite; z-index: 2; }
.fc-playhead::before { content: ""; position: absolute; top: -4px; left: -5px; border: 6px solid transparent; border-top: 8px solid var(--fc-amber); }
@keyframes fc-play { from { left: 12px; } to { left: calc(100% - 14px); } }

.fc-float { position: absolute; z-index: 3; padding: 10px 14px; border-radius: 12px; background: rgba(17,19,24,.85); border: 1px solid var(--fc-line); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); font-size: .8rem; font-weight: 700; display: flex; align-items: center; gap: 8px; box-shadow: 0 18px 40px -16px rgba(0,0,0,.8); animation: fc-bob 5s ease-in-out infinite; }
.fc-float i { color: var(--fc-orange-2); }
.fc-float.f1 { top: 12%; left: -22px; }
.fc-float.f2 { bottom: 34%; right: -18px; animation-delay: -2s; }
.fc-float.f3 { bottom: -18px; left: 18%; animation-delay: -3.5s; }
@keyframes fc-bob { 50% { transform: translateY(-10px); } }
.fc-stage { position: relative; }

/* ---------- Franja de datos ---------- */
.fc-strip { border-block: 1px solid var(--fc-line); background: var(--fc-ink-2); }
.fc-strip-grid { display: grid; grid-template-columns: repeat(5, 1fr); }
.fc-stat { padding: 26px 16px; text-align: center; border-right: 1px solid var(--fc-line); }
.fc-stat:last-child { border-right: 0; }
.fc-stat b { display: block; font: 400 2.2rem/1 var(--fc-display); color: var(--fc-text); letter-spacing: .02em; }
.fc-stat small { color: var(--fc-muted); font-size: .82rem; }

/* =====================================================================
   FUNCIONES (bento con mini animaciones)
   ===================================================================== */
.fc-bento { display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; margin-top: 54px; }
.fc-card { grid-column: span 2; position: relative; padding: 26px; border-radius: 22px; background: var(--fc-card); border: 1px solid var(--fc-line); overflow: hidden; transition: transform .5s var(--fc-ease), border-color .4s; display: flex; flex-direction: column; }
.fc-card:hover { transform: translateY(-6px); border-color: rgba(255,106,0,.45); }
.fc-card.w3 { grid-column: span 3; } .fc-card.w4 { grid-column: span 4; }
.fc-card h3 { font: 400 1.9rem/1 var(--fc-display); letter-spacing: .02em; margin: 18px 0 8px; }
.fc-card p { color: var(--fc-muted); margin: 0; line-height: 1.6; font-size: .95rem; }
.fc-card ul { margin: 12px 0 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 6px; }
.fc-card li { font-size: .75rem; font-weight: 700; padding: 5px 10px; border-radius: 999px; background: rgba(255,255,255,.05); border: 1px solid var(--fc-line); color: #d6d9e0; }
.fc-viz { height: 150px; border-radius: 14px; background: #0b0c10; border: 1px solid var(--fc-line); position: relative; overflow: hidden; }

/* Editor: cortes */
.viz-cut .fc-clip { top: 30%; height: 40%; background: linear-gradient(90deg, #ff6a00, #ff9a3c); border-radius: 6px; }
.viz-cut .k1 { left: 8%; width: 38%; } .viz-cut .k2 { left: 46%; width: 46%; animation: fc-gap 4s var(--fc-ease) infinite; }
@keyframes fc-gap { 0%, 30% { transform: none; } 45%, 70% { transform: translateX(12px); } 85%, 100% { transform: none; } }
.viz-cut .blade { position: absolute; top: 18%; bottom: 18%; left: 46%; width: 2px; background: #fff; box-shadow: 0 0 12px #fff; animation: fc-blade 4s infinite; }
.viz-cut .blade::before { content: "\2702"; position: absolute; top: -20px; left: -8px; color: #fff; font-size: 16px; }
@keyframes fc-blade { 0%, 20% { opacity: 0; transform: translateY(-10px); } 28%, 40% { opacity: 1; transform: none; } 50%, 100% { opacity: 0; } }

/* Música: medidores y perillas */
.viz-mix { display: flex; align-items: flex-end; justify-content: center; gap: 10px; padding: 18px; }
.viz-mix .ch { width: 14px; height: 100%; border-radius: 4px; background: rgba(255,255,255,.05); position: relative; overflow: hidden; }
.viz-mix .ch::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 40%; background: linear-gradient(to top, var(--fc-green) 0 60%, var(--fc-amber) 60% 85%, #ff4d4d 85%); animation: fc-meter 1s ease-in-out infinite alternate; animation-delay: calc(var(--i) * -.17s); animation-duration: calc(.6s + var(--i) * .09s); }
@keyframes fc-meter { to { height: 92%; } }
.viz-mix .knob { width: 34px; height: 34px; border-radius: 50%; align-self: center; margin-left: 10px; background: conic-gradient(var(--fc-orange) 0 70%, rgba(255,255,255,.08) 0); position: relative; animation: fc-knob 5s ease-in-out infinite alternate; }
.viz-mix .knob::after { content: ""; position: absolute; inset: 6px; border-radius: 50%; background: #14161d; }
@keyframes fc-knob { to { transform: rotate(120deg); } }

/* Captura: pantalla, cursor y zoom automático */
.viz-cap .screen { position: absolute; inset: 14px; border-radius: 8px; background: #161922; border: 1px solid var(--fc-line); animation: fc-zoom 6s var(--fc-ease) infinite; transform-origin: 70% 60%; }
.viz-cap .screen::before { content: ""; position: absolute; inset: 10px 10px auto; height: 10px; border-radius: 4px; background: rgba(255,255,255,.08); box-shadow: 0 20px 0 rgba(255,255,255,.05), 0 36px 0 rgba(255,255,255,.05); }
.viz-cap .btn { position: absolute; left: 62%; top: 52%; width: 20%; height: 18%; border-radius: 5px; background: var(--fc-violet); }
@keyframes fc-zoom { 0%, 30% { transform: scale(1); } 45%, 75% { transform: scale(1.7); } 90%, 100% { transform: scale(1); } }
.viz-cap .cursor { position: absolute; width: 0; height: 0; border-left: 7px solid transparent; border-right: 7px solid transparent; border-bottom: 16px solid #fff; transform: rotate(-30deg); animation: fc-cursor 6s var(--fc-ease) infinite; filter: drop-shadow(0 2px 3px #000); }
@keyframes fc-cursor { 0% { left: 20%; top: 25%; } 25%, 80% { left: 72%; top: 62%; } 100% { left: 20%; top: 25%; } }
.viz-cap .ring { position: absolute; left: 70%; top: 58%; width: 30px; height: 30px; margin: -15px; border-radius: 50%; border: 2px solid var(--fc-amber); opacity: 0; animation: fc-ring 6s infinite; }
@keyframes fc-ring { 0%, 26% { opacity: 0; transform: scale(.3); } 30% { opacity: 1; } 42%, 100% { opacity: 0; transform: scale(2); } }
.viz-cap .rec { position: absolute; top: 10px; right: 12px; font: 800 10px/1 var(--fc-body); color: #ff5470; letter-spacing: .1em; display: flex; gap: 5px; align-items: center; z-index: 2; }
.viz-cap .rec::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #ff3355; animation: fc-blink 1.2s infinite; }

/* Subtítulos IA */
.viz-sub { display: grid; place-items: center; padding: 16px; }
.viz-sub .line { font: 400 clamp(1.4rem, 3vw, 2.1rem)/1 var(--fc-display); letter-spacing: .03em; text-align: center; }
.viz-sub .line span { display: inline-block; margin: 0 3px; animation: fc-slam 4.8s var(--fc-ease) infinite; opacity: 0; }
.viz-sub .line span:nth-child(2) { animation-delay: .35s; } .viz-sub .line span:nth-child(3) { animation-delay: .7s; color: var(--fc-orange); } .viz-sub .line span:nth-child(4) { animation-delay: 1.05s; }
@keyframes fc-slam { 0% { opacity: 0; transform: scale(2.4); } 8% { opacity: 1; transform: scale(.92); } 12%, 70% { opacity: 1; transform: scale(1); } 80%, 100% { opacity: 0; transform: translateY(-8px); } }
.viz-sub .ai { position: absolute; bottom: 10px; left: 12px; font-size: 10px; font-weight: 800; letter-spacing: .1em; color: var(--fc-green); display: flex; align-items: center; gap: 6px; }
.viz-sub .ai::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--fc-green); animation: fc-blink 1.6s infinite; }

/* Shorts 9:16 */
.viz-short { display: grid; place-items: center; }
.viz-short .frame { width: 70%; height: 62%; border-radius: 8px; border: 2px solid var(--fc-orange); background: linear-gradient(135deg, rgba(255,106,0,.25), rgba(139,92,246,.25)); animation: fc-vert 5s var(--fc-ease) infinite; position: relative; }
.viz-short .frame::after { content: "9:16"; position: absolute; inset: auto 0 6px; text-align: center; font: 800 10px/1 var(--fc-body); color: #fff; opacity: 0; animation: fc-vert-t 5s infinite; }
@keyframes fc-vert { 0%, 25% { width: 70%; height: 62%; } 45%, 80% { width: 26%; height: 84%; border-color: var(--fc-violet); } 100% { width: 70%; height: 62%; } }
@keyframes fc-vert-t { 0%, 35% { opacity: 0; } 45%, 80% { opacity: 1; } 90%, 100% { opacity: 0; } }

/* Color y máscaras */
.viz-color { background: linear-gradient(120deg, #ff6a00, #8b5cf6, #38d6ff, #3fe8a7, #ff6a00); background-size: 300% 300%; animation: fc-hue 8s linear infinite; }
@keyframes fc-hue { to { background-position: 300% 0; } }
.viz-color .mask { position: absolute; width: 90px; height: 90px; border-radius: 50%; border: 2px dashed #fff; box-shadow: 0 0 0 999px rgba(7,8,11,.65); animation: fc-track 7s ease-in-out infinite; }
@keyframes fc-track { 0% { left: 10%; top: 20%; } 33% { left: 58%; top: 10%; } 66% { left: 45%; top: 40%; } 100% { left: 10%; top: 20%; } }

/* Exportación */
.viz-exp { padding: 20px; display: flex; flex-direction: column; justify-content: center; gap: 14px; }
.viz-exp .bar { height: 12px; border-radius: 999px; background: rgba(255,255,255,.06); overflow: hidden; }
.viz-exp .bar i { display: block; height: 100%; width: 0; border-radius: 999px; background: linear-gradient(90deg, var(--fc-orange), var(--fc-amber)); animation: fc-exp 4.5s var(--fc-ease) infinite; }
@keyframes fc-exp { 0% { width: 0; } 80%, 100% { width: 100%; } }
.viz-exp .codecs { display: flex; flex-wrap: wrap; gap: 6px; }
.viz-exp .codecs span { font: 800 11px/1 var(--fc-body); padding: 6px 9px; border-radius: 6px; background: rgba(255,106,0,.12); color: var(--fc-orange-2); animation: fc-pop 4.5s infinite; animation-delay: calc(var(--i) * .25s); }
@keyframes fc-pop { 0%, 10% { opacity: .35; } 20%, 100% { opacity: 1; } }

/* =====================================================================
   VIDEOS
   ===================================================================== */
.fc-videos { background: var(--fc-ink-2); }
.fc-vtabs { display: flex; justify-content: center; gap: 8px; margin: 36px 0 28px; flex-wrap: wrap; }
.fc-vtabs button { font: 700 .9rem/1 var(--fc-body); padding: 10px 18px; border-radius: 999px; border: 1px solid var(--fc-line); background: transparent; color: var(--fc-muted); cursor: pointer; }
.fc-vtabs button[aria-pressed="true"] { background: var(--fc-orange); border-color: var(--fc-orange); color: #160800; }
.fc-vgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.fc-video { border-radius: 18px; overflow: hidden; background: var(--fc-card); border: 1px solid var(--fc-line); }
.fc-video .ph { position: relative; aspect-ratio: 16 / 9; background: #000 center / cover no-repeat; border: 0; width: 100%; padding: 0; cursor: pointer; display: block; }
.fc-video .ph::after { content: ""; position: absolute; left: 50%; top: 50%; width: 64px; height: 64px; margin: -32px; border-radius: 50%; background: rgba(255,106,0,.92) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 5v14l11-7z' fill='%23160800'/%3E%3C/svg%3E") center / 28px no-repeat; box-shadow: 0 10px 30px -8px rgba(255,106,0,.8); transition: transform .3s var(--fc-ease); }
.fc-video .ph:hover::after { transform: scale(1.1); }
.fc-video iframe { width: 100%; aspect-ratio: 16 / 9; border: 0; display: block; }
.fc-video .vt { padding: 14px 16px 18px; }
.fc-video .vt small { color: var(--fc-orange-2); font-weight: 800; font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; }
.fc-video .vt h3 { margin: 6px 0 0; font-size: 1rem; line-height: 1.4; }
.fc-vsoon { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.fc-vsoon > div { aspect-ratio: 16 / 10; border-radius: 18px; border: 1px dashed rgba(255,255,255,.14); display: grid; place-items: center; text-align: center; color: var(--fc-muted); font-size: .9rem; padding: 20px; position: relative; overflow: hidden; }
.fc-vsoon > div::before { content: ""; position: absolute; inset: 0; background: linear-gradient(100deg, transparent 30%, rgba(255,106,0,.07) 50%, transparent 70%); background-size: 250% 100%; animation: fc-flow 3s linear infinite; }
.fc-vsoon b { display: block; font: 400 1.5rem/1 var(--fc-display); color: var(--fc-text); letter-spacing: .03em; margin: 10px 0 4px; }
.fc-vsoon .play { width: 54px; height: 54px; border-radius: 50%; border: 2px solid var(--fc-orange); display: grid; place-items: center; margin: 0 auto; animation: fc-pulse 2s infinite; color: var(--fc-orange); }
@keyframes fc-pulse { 0% { box-shadow: 0 0 0 0 rgba(255,106,0,.5); } 70% { box-shadow: 0 0 0 16px rgba(255,106,0,0); } 100% { box-shadow: 0 0 0 0 rgba(255,106,0,0); } }

/* =====================================================================
   NOVEDADES (registro de cambios)
   ===================================================================== */
.fc-log-grid { display: grid; grid-template-columns: 1fr 1.5fr; gap: 50px; align-items: start; }
.fc-log-aside { position: sticky; top: 90px; }
.fc-log { position: relative; padding-left: 30px; }
.fc-log::before { content: ""; position: absolute; left: 7px; top: 8px; bottom: 8px; width: 2px; background: linear-gradient(var(--fc-orange), rgba(255,106,0,.05)); }
.fc-rel { position: relative; padding: 0 0 26px; }
.fc-rel::before { content: ""; position: absolute; left: -30px; top: 6px; width: 16px; height: 16px; border-radius: 50%; background: var(--fc-ink); border: 3px solid var(--fc-orange); }
.fc-rel.latest::before { background: var(--fc-orange); box-shadow: 0 0 0 6px rgba(255,106,0,.18); animation: fc-pulse 2s infinite; }
.fc-rel-head { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.fc-rel-head b { font: 400 1.7rem/1 var(--fc-display); letter-spacing: .03em; }
.fc-rel-head time { color: var(--fc-muted); font-size: .82rem; }
.fc-rel-head .tag { font-size: .68rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; padding: 4px 8px; border-radius: 6px; background: rgba(63,232,167,.12); color: var(--fc-green); }
.fc-rel h4 { margin: 6px 0 6px; font-size: 1rem; color: var(--fc-orange-2); }
.fc-rel ul { margin: 0; padding-left: 18px; color: #c9ccd4; line-height: 1.65; font-size: .93rem; }
.fc-log-more { margin-top: 6px; }
.fc-log-more[hidden] { display: none; }

/* =====================================================================
   LO QUE VIENE
   ===================================================================== */
.fc-next { background: var(--fc-ink-2); }
.fc-road { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 50px; }
.fc-road > div { padding: 24px; border-radius: 20px; background: var(--fc-card); border: 1px solid var(--fc-line); position: relative; overflow: hidden; }
.fc-road > div::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: linear-gradient(90deg, var(--fc-orange), var(--fc-violet)); transform: scaleX(0); transform-origin: left; transition: transform .8s var(--fc-ease); }
.fc-road > div.is-in::after { transform: none; }
.fc-road .ic { width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center; background: rgba(255,106,0,.12); color: var(--fc-orange-2); font-size: 1.15rem; }
.fc-road h3 { margin: 16px 0 6px; font-size: 1.05rem; }
.fc-road p { margin: 0; color: var(--fc-muted); font-size: .9rem; line-height: 1.6; }
.fc-road .st { display: inline-block; margin-top: 14px; font-size: .7rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--fc-amber); }

/* =====================================================================
   DESCARGA FINAL + FAQ
   ===================================================================== */
.fc-final { text-align: center; position: relative; }
.fc-final::before { content: ""; position: absolute; left: 50%; top: 50%; width: 720px; height: 720px; transform: translate(-50%, -50%); border-radius: 50%; background: conic-gradient(from 0deg, rgba(255,106,0,.25), transparent 30%, rgba(139,92,246,.2) 60%, transparent 80%, rgba(255,106,0,.25)); filter: blur(60px); animation: fc-spin 18s linear infinite; pointer-events: none; }
@keyframes fc-spin { to { transform: translate(-50%, -50%) rotate(360deg); } }
.fc-final .fc-wrap { position: relative; }
.fc-final .fc-cta-row { justify-content: center; margin-top: 30px; }
.fc-req { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.fc-req > span { font-size: .82rem; padding: 8px 14px; border-radius: 999px; background: rgba(255,255,255,.04); border: 1px solid var(--fc-line); color: #d6d9e0; }
.fc-req i { color: var(--fc-orange-2); margin-right: 6px; }
.fc-faq { max-width: 820px; margin: 70px auto 0; text-align: left; }
.fc-faq details { border-bottom: 1px solid var(--fc-line); padding: 18px 4px; }
.fc-faq summary { cursor: pointer; font-weight: 700; list-style: none; display: flex; justify-content: space-between; gap: 16px; }
.fc-faq summary::-webkit-details-marker { display: none; }
.fc-faq summary::after { content: "+"; color: var(--fc-orange); font-size: 1.4rem; line-height: 1; transition: transform .3s; }
.fc-faq details[open] summary::after { transform: rotate(45deg); }
.fc-faq p { color: var(--fc-muted); line-height: 1.7; margin: 12px 0 0; }
.fc-donate { margin-top: 50px; color: var(--fc-muted); font-size: .95rem; }
.fc-donate a { color: var(--fc-orange-2); font-weight: 700; }

/* ---------- Responsive ---------- */
@media (max-width: 1024px) {
  .fc-hero-grid, .fc-log-grid { grid-template-columns: 1fr; }
  .fc-hero { padding-top: 110px; min-height: 0; }
  .fc-app { transform: none; max-width: 640px; margin: 20px auto 0; width: 100%; }
  .fc-app:hover { transform: none; }
  .fc-card, .fc-card.w3, .fc-card.w4 { grid-column: span 3; }
  .fc-road { grid-template-columns: repeat(2, 1fr); }
  .fc-strip-grid { grid-template-columns: repeat(3, 1fr); }
  .fc-stat:nth-child(3) { border-right: 0; }
  .fc-log-aside { position: static; }
  .fc-vgrid, .fc-vsoon { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .fc-sec { padding: 80px 0; }
  .fc-wrap { padding: 0 16px; }
  .fc-card, .fc-card.w3, .fc-card.w4 { grid-column: 1 / -1; }
  .fc-road, .fc-vgrid, .fc-vsoon { grid-template-columns: 1fr; }
  .fc-strip-grid { grid-template-columns: repeat(2, 1fr); }
  .fc-stat { border-bottom: 1px solid var(--fc-line); }
  .fc-stat:nth-child(2n) { border-right: 0; } .fc-stat:nth-child(3) { border-right: 1px solid var(--fc-line); }
  .fc-float.f1 { left: 4px; } .fc-float.f2 { right: 4px; } .fc-float.f3 { display: none; }
  .fc-btn { width: 100%; justify-content: center; }
}
@media (prefers-reduced-motion: reduce) {
  .fc *, .fc *::before, .fc *::after { animation: none !important; transition: none !important; }
  .fc-reveal { opacity: 1; transform: none; }
  .fc-tagline .fc-rot > span:first-child { opacity: 1; transform: none; }
}

/* Versión actual, grande bajo el título */
.fc-version { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 14px; margin: 14px 0 0; }
.fc-version small { font-size: .8rem; letter-spacing: .14em; text-transform: uppercase; color: var(--fc-muted); }
.fc-version strong { font: 400 clamp(2.6rem, 6vw, 4rem)/1 var(--fc-display); color: var(--fc-amber); letter-spacing: .03em; }