*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    :root {
      --cyan: #00D4FF;
      --cyan-dim: rgba(0,212,255,0.15);
      --cyan-glow: rgba(0,212,255,0.25);
      --gold: #D4AF37;
      --white: #F5F5F0;
      --gray: rgba(245,245,240,0.5);
      --gray-mid: rgba(245,245,240,0.35);
      --dark: #0A0A0A;
      --card-bg: rgba(255,255,255,0.04);
      --card-border: rgba(255,255,255,0.09);
      --radius: 16px;
    }
    html { scroll-behavior: smooth; }
    body { font-family: 'DM Sans', sans-serif; background: var(--dark); color: var(--white); overflow-x: hidden; -webkit-font-smoothing: antialiased; }
    ::-webkit-scrollbar { width: 2px; }
    ::-webkit-scrollbar-track { background: #000; }
    ::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.12); border-radius: 2px; }

    /* KEYFRAMES */
    @keyframes blink { 0%,49%{opacity:1} 50%,100%{opacity:0} }
    @keyframes float { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-8px)} }
    @keyframes float2 { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-6px)} }
    @keyframes data-scroll { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }
    @keyframes fade-up { from{opacity:0;transform:translateY(28px)} to{opacity:1;transform:translateY(0)} }
    @keyframes glow-pulse { 0%,100%{opacity:0.4} 50%{opacity:0.8} }
    @keyframes spin-slow { from{transform:rotate(0deg)} to{transform:rotate(360deg)} }
    @keyframes bar-fill { from{width:0} to{width:var(--w)} }

    /* VIDEO FIXED */
    #hero-video-bg { position:fixed; top:0; left:0; width:100%; height:100%; object-fit:cover; z-index:0; pointer-events:none; }
    #video-veil { position:fixed; inset:0; z-index:1; background:rgba(0,0,0,0.62); pointer-events:none; }

    /* DOT GRID overlay for sections */
    .dot-bg { background-image: radial-gradient(circle, rgba(255,255,255,0.06) 1px, transparent 1px); background-size: 28px 28px; }

    /* NAV */
    nav {
      position:fixed; top:0; left:0; right:0; z-index:900;
      height:80px; display:flex; align-items:center; justify-content:space-between;
      padding:0 48px; transition:background 0.4s,border-color 0.4s; border-bottom:1px solid transparent; overflow:visible;
    }
    nav.scrolled { background:rgba(6,6,8,0.88); backdrop-filter:blur(28px) saturate(160%); -webkit-backdrop-filter:blur(28px) saturate(160%); border-bottom-color:rgba(255,255,255,0.07); }
    .nav-logo-wrap { display:flex; align-items:center; height:100%; flex-shrink:0; }
    .nav-logo-img { height:132px; width:auto; display:block; filter:drop-shadow(0 2px 20px rgba(0,0,0,0.5)); transition:opacity 0.2s,transform 0.3s; }
    .nav-logo-img:hover { opacity:0.82; transform:scale(1.02); }
    .nav-center { display:flex; gap:32px; list-style:none; }
    .nav-link { font-size:13px; font-weight:400; color:rgba(245,245,240,0.58); text-decoration:none; letter-spacing:0.01em; transition:color 0.2s; }
    .nav-link:hover { color:var(--white); }
    .nav-right { display:flex; align-items:center; gap:20px; }
    .nav-lang { font-family:'Space Mono',monospace; font-size:10px; color:rgba(245,245,240,0.35); letter-spacing:0.1em; cursor:pointer; display:flex; align-items:center; gap:4px; }
    .nav-lang span { color:var(--cyan); }
    .nav-badge { font-family:'Space Mono',monospace; font-size:9px; font-weight:700; letter-spacing:0.14em; color:rgba(245,245,240,0.35); display:flex; align-items:center; gap:7px; text-transform:uppercase; }
    .nav-badge::before { content:'●'; color:#22C55E; font-size:8px; animation:blink 1.4s infinite; }
    .nav-cta { font-size:13px; font-weight:500; color:var(--white); background:transparent; border:1px solid rgba(245,245,240,0.28); padding:8px 22px; border-radius:980px; cursor:pointer; text-decoration:none; display:inline-block; letter-spacing:0.02em; transition:all 0.25s; }
    .nav-cta:hover { background:var(--white); color:var(--dark); border-color:var(--white); }

    /* PAGE SECTIONS */
    .page-section { position:relative; z-index:10; }

    /* HERO */
    #hero { position:relative; min-height:100vh; display:flex; align-items:center; z-index:2; padding:0 48px; overflow:hidden; }
    #hero::after { content:''; position:absolute; bottom:0; left:0; right:0; height:260px; background:linear-gradient(to bottom,transparent,rgba(10,10,10,0.95)); z-index:2; pointer-events:none; }
    .hero-cyan-glow { position:absolute; top:-20%; left:-10%; width:70%; height:80%; background:radial-gradient(ellipse at 30% 30%, rgba(0,212,255,0.12) 0%, transparent 65%); pointer-events:none; z-index:1; }
    .hero-grid { position:absolute; inset:0; background-image:radial-gradient(circle, rgba(255,255,255,0.07) 1px, transparent 1px); background-size:32px 32px; z-index:1; pointer-events:none; mask-image:radial-gradient(ellipse 70% 70% at 30% 50%, black 0%, transparent 100%); }
    .hero-inner { position:relative; z-index:5; display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; max-width:1280px; width:100%; margin:0 auto; padding-top:80px; animation:fade-up 1s cubic-bezier(0.22,0.61,0.36,1) 0.1s both; }
    .hero-left { max-width:580px; }
    .hero-eyebrow { font-family:'Space Mono',monospace; font-size:10px; letter-spacing:0.26em; text-transform:uppercase; color:var(--cyan); opacity:0.8; margin-bottom:24px; display:flex; align-items:center; gap:12px; }
    .hero-eyebrow::before { content:''; display:block; width:28px; height:1px; background:var(--cyan); opacity:0.5; }
    .hero-title { font-family:'Space Grotesk',sans-serif; font-size:clamp(48px,6vw,80px); font-weight:700; line-height:1.02; letter-spacing:-0.04em; color:var(--white); margin-bottom:24px; }
    .hero-title .line2 { color:var(--cyan); }
    .hero-sub { font-size:16px; font-weight:300; color:rgba(245,245,240,0.6); line-height:1.7; margin-bottom:44px; max-width:480px; }
    .hero-btns { display:flex; gap:14px; flex-wrap:wrap; }
    .btn-primary { font-size:14px; font-weight:500; color:var(--dark); background:var(--white); border:none; padding:14px 28px; border-radius:980px; cursor:pointer; text-decoration:none; display:inline-flex; align-items:center; gap:8px; transition:all 0.2s; }
    .btn-primary:hover { background:var(--cyan); transform:translateY(-1px); }
    .btn-ghost { font-size:14px; font-weight:400; color:rgba(245,245,240,0.75); background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.14); padding:14px 28px; border-radius:980px; cursor:pointer; text-decoration:none; display:inline-block; backdrop-filter:blur(8px); transition:all 0.2s; }
    .btn-ghost:hover { background:rgba(255,255,255,0.12); border-color:rgba(255,255,255,0.3); }

    /* Hero metric cards */
    .hero-right { display:flex; flex-direction:column; gap:14px; }
    .metric-float-card { background:rgba(14,14,18,0.72); backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px); border:1px solid rgba(255,255,255,0.1); border-radius:14px; padding:22px 26px; transition:transform 0.3s,border-color 0.3s; }
    .metric-float-card:hover { transform:translateX(-4px); border-color:rgba(0,212,255,0.3); }
    .metric-float-card:nth-child(1) { animation:float 6s ease-in-out infinite; }
    .metric-float-card:nth-child(2) { animation:float2 6s ease-in-out 1.5s infinite; }
    .metric-float-card:nth-child(3) { animation:float 6s ease-in-out 3s infinite; }
    .mfc-label { font-family:'Space Mono',monospace; font-size:8px; letter-spacing:0.2em; text-transform:uppercase; color:rgba(245,245,240,0.35); margin-bottom:8px; }
    .mfc-value { font-family:'Space Grotesk',sans-serif; font-size:32px; font-weight:700; color:var(--white); letter-spacing:-0.04em; line-height:1; display:flex; align-items:baseline; gap:8px; }
    .mfc-badge { font-size:12px; font-weight:500; color:#22C55E; background:rgba(34,197,94,0.12); padding:3px 8px; border-radius:20px; }
    .mfc-sub { font-size:12px; color:rgba(245,245,240,0.4); margin-top:6px; }

    /* Data strip */
    .hero-data-strip { position:absolute; bottom:0; left:0; right:0; z-index:6; background:rgba(0,0,0,0.5); backdrop-filter:blur(20px); border-top:1px solid rgba(255,255,255,0.06); overflow:hidden; height:38px; }
    .data-ticker { display:flex; align-items:center; animation:data-scroll 42s linear infinite; white-space:nowrap; height:38px; }
    .data-item { font-family:'Space Mono',monospace; font-size:9px; color:rgba(245,245,240,0.25); padding:0 28px; border-right:1px solid rgba(255,255,255,0.05); height:38px; display:flex; align-items:center; gap:8px; letter-spacing:0.08em; text-transform:uppercase; }
    .d-label { color:rgba(245,245,240,0.18); }
    .d-value { color:var(--cyan); font-weight:700; }

    /* HUD corners */
    .hud { position:absolute; z-index:5; font-family:'Space Mono',monospace; font-size:9px; color:rgba(255,255,255,0.25); letter-spacing:0.1em; pointer-events:none; }
    .hud-tl { top:100px; left:48px; }
    .hud-tr { top:100px; right:48px; text-align:right; }
    .hud-bl { bottom:56px; left:48px; }
    .hud-br { bottom:56px; right:48px; text-align:right; }
    .hud span { display:block; font-size:8px; color:rgba(255,255,255,0.15); margin-bottom:2px; text-transform:uppercase; letter-spacing:0.14em; }

    /* SECTION COMMONS */
    .sec-eyebrow { font-family:'Space Mono',monospace; font-size:9px; letter-spacing:0.24em; text-transform:uppercase; color:var(--cyan); opacity:0.75; margin-bottom:14px; display:block; }
    .sec-title { font-family:'Space Grotesk',sans-serif; font-size:clamp(30px,3.8vw,52px); font-weight:700; letter-spacing:-0.03em; color:var(--white); line-height:1.06; }
    .sec-sub { font-size:15px; font-weight:300; color:rgba(245,245,240,0.55); line-height:1.7; max-width:560px; margin-top:14px; }
    .sec-header-center { text-align:center; margin-bottom:72px; }
    .sec-header-center .sec-sub { margin-left:auto; margin-right:auto; }

    /* REVEAL */
    .reveal { opacity:0; transform:translateY(20px); transition:opacity 0.75s ease,transform 0.75s ease; }
    .reveal.visible { opacity:1; transform:translateY(0); }

    /* ═══ SECCIÓN 02 — ENFOQUE ═══ */
    #enfoque { background:rgba(6,6,10,0.93); backdrop-filter:blur(32px); -webkit-backdrop-filter:blur(32px); padding:120px 48px; border-top:1px solid rgba(255,255,255,0.05); }
    .enfoque-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; max-width:1200px; margin:0 auto; background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.07); border-radius:20px; overflow:hidden; }
    .enfoque-card { background:rgba(10,10,14,0.95); padding:44px 36px; position:relative; overflow:hidden; transition:background 0.25s; }
    .enfoque-card:hover { background:rgba(0,212,255,0.04); }
    .enfoque-card::before { content:''; position:absolute; top:0; left:0; right:0; height:1px; background:linear-gradient(to right,transparent,rgba(0,212,255,0.4),transparent); transform:scaleX(0); transition:transform 0.4s; }
    .enfoque-card:hover::before { transform:scaleX(1); }
    .ec-icon { width:42px; height:42px; background:rgba(0,212,255,0.08); border:1px solid rgba(0,212,255,0.2); border-radius:10px; display:flex; align-items:center; justify-content:center; margin-bottom:20px; color:var(--cyan); }
    .ec-tag { font-family:'Space Mono',monospace; font-size:8px; letter-spacing:0.18em; text-transform:uppercase; color:rgba(245,245,240,0.25); margin-bottom:8px; }
    .ec-title { font-family:'Space Grotesk',sans-serif; font-size:18px; font-weight:600; color:var(--white); margin-bottom:10px; letter-spacing:-0.02em; }
    .ec-desc { font-size:13px; color:rgba(245,245,240,0.45); line-height:1.65; }

    /* ═══ SECCIÓN 03 — SOLUCIONES ═══ */
    #soluciones { background:rgba(240,240,244,0.93); backdrop-filter:blur(32px); -webkit-backdrop-filter:blur(32px); padding:120px 48px; border-top:1px solid rgba(255,255,255,0.6); }
    #soluciones .sec-eyebrow { color:#666; opacity:1; }
    #soluciones .sec-title { color:#111; }
    #soluciones .sec-sub { color:#888; }
    .sol-header-wrap { display:flex; justify-content:space-between; align-items:flex-end; max-width:1200px; margin:0 auto 64px; gap:40px; }
    .sol-header-btns { display:flex; gap:12px; flex-shrink:0; }
    .btn-dark { font-size:13px; font-weight:500; color:#fff; background:#111; border:none; padding:12px 24px; border-radius:980px; cursor:pointer; text-decoration:none; display:inline-flex; align-items:center; gap:7px; transition:all 0.2s; white-space:nowrap; }
    .btn-dark:hover { background:#222; transform:translateY(-1px); }
    .btn-outline-dark { font-size:13px; font-weight:400; color:#555; background:transparent; border:1px solid rgba(0,0,0,0.2); padding:12px 24px; border-radius:980px; cursor:pointer; text-decoration:none; display:inline-block; transition:all 0.2s; white-space:nowrap; }
    .btn-outline-dark:hover { background:rgba(0,0,0,0.06); }
    .sol-modules { display:grid; grid-template-columns:repeat(2,1fr); gap:2px; max-width:1200px; margin:0 auto; }
    .sol-module { background:#fff; padding:52px 48px; border-radius:0; position:relative; overflow:hidden; border:1px solid rgba(0,0,0,0.07); transition:all 0.25s; cursor:pointer; }
    .sol-module:first-child { border-radius:16px 0 0 0; }
    .sol-module:nth-child(2) { border-radius:0 16px 0 0; }
    .sol-module:nth-child(3) { border-radius:0 0 0 16px; }
    .sol-module:last-child { border-radius:0 0 16px 0; }
    .sol-module:hover { background:#f5fffe; z-index:1; box-shadow:0 0 0 2px rgba(0,212,255,0.35); border-color:rgba(0,212,255,0.3); }
    .sol-module:hover .sm-arrow { opacity:1; transform:translateX(0); }
    .sm-num { font-family:'Space Mono',monospace; font-size:9px; color:#bbb; letter-spacing:0.14em; margin-bottom:16px; }
    .sm-icon { width:36px; height:36px; color:#999; margin-bottom:18px; }
    .sm-title { font-family:'Space Grotesk',sans-serif; font-size:22px; font-weight:700; color:#111; margin-bottom:12px; letter-spacing:-0.025em; }
    .sm-desc { font-size:13px; color:#777; line-height:1.68; margin-bottom:20px; }
    .sm-bullets { list-style:none; display:flex; flex-direction:column; gap:6px; margin-bottom:24px; }
    .sm-bullets li { font-size:12px; color:#888; display:flex; align-items:flex-start; gap:8px; }
    .sm-bullets li::before { content:''; width:4px; height:4px; border-radius:50%; background:var(--cyan); flex-shrink:0; margin-top:6px; }
    .sm-arrow { font-size:12px; font-weight:600; color:var(--cyan); display:flex; align-items:center; gap:6px; opacity:0.6; transform:translateX(-4px); transition:all 0.2s; text-decoration:none; }
    .sm-bg-num { position:absolute; bottom:-16px; right:-4px; font-size:120px; font-weight:700; color:rgba(0,0,0,0.03); font-family:'Space Grotesk',sans-serif; pointer-events:none; line-height:1; }

    /* ═══ SECCIÓN 04 — INDUSTRIAS ═══ */
    #industrias { background:rgba(5,5,8,0.92); backdrop-filter:blur(32px); -webkit-backdrop-filter:blur(32px); padding:120px 48px; border-top:1px solid rgba(255,255,255,0.05); }
    .ind-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; max-width:1200px; margin:0 auto; }
    .ind-card { background:var(--card-bg); border:1px solid var(--card-border); border-radius:16px; padding:40px 32px; position:relative; overflow:hidden; transition:all 0.25s; }
    .ind-card:hover { border-color:rgba(0,212,255,0.25); background:rgba(0,212,255,0.04); transform:translateY(-3px); box-shadow:0 8px 40px rgba(0,0,0,0.3); }
    .ind-sector { font-family:'Space Mono',monospace; font-size:8px; letter-spacing:0.2em; text-transform:uppercase; color:rgba(245,245,240,0.25); margin-bottom:10px; }
    .ind-title { font-family:'Space Grotesk',sans-serif; font-size:20px; font-weight:700; color:var(--white); margin-bottom:12px; letter-spacing:-0.02em; }
    .ind-desc { font-size:13px; color:rgba(245,245,240,0.45); line-height:1.65; margin-bottom:20px; }
    .ind-stats { display:flex; flex-direction:column; gap:8px; }
    .ind-stat { display:flex; align-items:center; gap:10px; }
    .ind-stat-val { font-family:'Space Grotesk',sans-serif; font-size:22px; font-weight:700; color:var(--cyan); letter-spacing:-0.03em; min-width:80px; }
    .ind-stat-label { font-size:11px; color:rgba(245,245,240,0.4); line-height:1.4; }
    .ind-case { font-family:'Space Mono',monospace; font-size:8px; letter-spacing:0.14em; text-transform:uppercase; color:var(--gold); opacity:0.7; margin-top:18px; padding-top:18px; border-top:1px solid rgba(255,255,255,0.06); }
    .ind-tags { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:16px; }
    .ind-tag { font-size:10px; color:rgba(245,245,240,0.45); background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.08); padding:3px 10px; border-radius:20px; }

    /* ═══ SECCIÓN 05 — PLATAFORMA ═══ */
    #plataforma { background:rgba(235,235,240,0.93); backdrop-filter:blur(32px); -webkit-backdrop-filter:blur(32px); padding:120px 48px; border-top:1px solid rgba(255,255,255,0.6); }
    #plataforma .sec-eyebrow { color:#666; opacity:1; }
    #plataforma .sec-title { color:#111; }
    #plataforma .sec-sub { color:#888; }
    .plat-inner { max-width:1200px; margin:0 auto; display:grid; grid-template-columns:1fr 1.3fr; gap:80px; align-items:start; }
    .plat-left {}
    .plat-steps { display:flex; flex-direction:column; gap:0; margin-top:48px; position:relative; }
    .plat-steps::before { content:''; position:absolute; left:20px; top:28px; bottom:28px; width:1px; background:linear-gradient(to bottom,rgba(0,212,255,0.3),rgba(0,212,255,0.1)); }
    .plat-step { display:flex; gap:22px; padding:20px 0; position:relative; }
    .plat-step-num { width:40px; height:40px; border-radius:50%; background:#fff; border:1px solid rgba(0,0,0,0.1); display:flex; align-items:center; justify-content:center; font-family:'Space Mono',monospace; font-size:11px; font-weight:700; color:#555; flex-shrink:0; position:relative; z-index:1; }
    .plat-step-body { padding-top:6px; }
    .plat-step-title { font-family:'Space Grotesk',sans-serif; font-size:15px; font-weight:700; color:#111; margin-bottom:4px; letter-spacing:-0.01em; }
    .plat-step-desc { font-size:12px; color:#888; line-height:1.6; }
    .plat-step-tech { font-family:'Space Mono',monospace; font-size:9px; color:var(--cyan); filter:brightness(0.6); margin-top:4px; }

    /* Dashboard card */
    .dash-card { background:#0D0D10; border:1px solid rgba(255,255,255,0.1); border-radius:20px; overflow:hidden; box-shadow:0 24px 80px rgba(0,0,0,0.4); }
    .dash-header { padding:18px 24px; border-bottom:1px solid rgba(255,255,255,0.07); display:flex; justify-content:space-between; align-items:center; }
    .dash-header-title { font-family:'Space Grotesk',sans-serif; font-size:14px; font-weight:600; color:var(--white); }
    .dash-live { font-family:'Space Mono',monospace; font-size:9px; color:rgba(255,255,255,0.35); display:flex; align-items:center; gap:6px; }
    .dash-live::before { content:'●'; color:#22C55E; animation:blink 1.4s infinite; }
    .dash-kpis { display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:rgba(255,255,255,0.05); border-bottom:1px solid rgba(255,255,255,0.07); }
    .dash-kpi { background:#0D0D10; padding:18px 20px; }
    .dash-kpi-label { font-size:10px; color:rgba(255,255,255,0.35); margin-bottom:6px; }
    .dash-kpi-val { font-family:'Space Grotesk',sans-serif; font-size:22px; font-weight:700; color:var(--white); letter-spacing:-0.03em; }
    .dash-kpi-val span { color:var(--cyan); }
    .dash-chart { padding:20px 24px 8px; }
    .dash-chart-label { font-size:10px; color:rgba(255,255,255,0.3); margin-bottom:12px; }
    .dash-chart-bars { display:flex; align-items:flex-end; gap:4px; height:64px; }
    .dash-bar { flex:1; background:rgba(0,212,255,0.15); border-radius:3px 3px 0 0; border-top:1px solid rgba(0,212,255,0.4); position:relative; transition:background 0.2s; }
    .dash-bar:hover { background:rgba(0,212,255,0.3); }
    .dash-table { margin:0 0 0; border-top:1px solid rgba(255,255,255,0.06); }
    .dash-table-header { display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; padding:10px 24px; border-bottom:1px solid rgba(255,255,255,0.05); }
    .dash-th { font-family:'Space Mono',monospace; font-size:8px; color:rgba(255,255,255,0.25); letter-spacing:0.12em; text-transform:uppercase; }
    .dash-row { display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; padding:10px 24px; border-bottom:1px solid rgba(255,255,255,0.04); transition:background 0.2s; }
    .dash-row:hover { background:rgba(255,255,255,0.02); }
    .dash-td { font-size:11px; color:rgba(255,255,255,0.55); display:flex; align-items:center; gap:6px; }
    .dash-td.site { color:rgba(255,255,255,0.8); font-weight:500; }
    .dash-status { width:6px; height:6px; border-radius:50%; flex-shrink:0; }
    .status-ok { background:#22C55E; }
    .status-warn { background:#F59E0B; }
    .dash-alerts { padding:12px 24px 16px; display:flex; flex-direction:column; gap:6px; border-top:1px solid rgba(255,255,255,0.06); }
    .dash-alert { display:flex; align-items:center; gap:10px; padding:8px 12px; border-radius:8px; font-size:11px; }
    .dash-alert.high { background:rgba(239,68,68,0.1); border:1px solid rgba(239,68,68,0.2); color:rgba(245,245,240,0.7); }
    .dash-alert.med { background:rgba(245,158,11,0.08); border:1px solid rgba(245,158,11,0.15); color:rgba(245,245,240,0.6); }
    .alert-dot { width:6px; height:6px; border-radius:50%; flex-shrink:0; }
    .alert-dot.high { background:#EF4444; }
    .alert-dot.med { background:#F59E0B; }
    .alert-time { font-family:'Space Mono',monospace; font-size:9px; color:rgba(255,255,255,0.25); margin-left:auto; }

    /* ═══ SECCIÓN 06 — METODOLOGÍA ═══ */
    #metodologia { background:rgba(4,4,8,0.93); backdrop-filter:blur(32px); -webkit-backdrop-filter:blur(32px); padding:120px 48px; border-top:1px solid rgba(255,255,255,0.05); }
    .met-steps { display:grid; grid-template-columns:repeat(5,1fr); max-width:1200px; margin:0 auto; position:relative; }
    .met-line { position:absolute; top:36px; left:10%; right:10%; height:1px; background:rgba(255,255,255,0.07); z-index:0; }
    .met-line-fill { height:100%; width:0; background:linear-gradient(to right,var(--cyan),rgba(0,212,255,0.3)); transition:width 2s cubic-bezier(0.25,0.46,0.45,0.94); }
    .met-step { display:flex; flex-direction:column; align-items:center; text-align:center; padding:0 12px; position:relative; z-index:1; }
    .met-circle { width:72px; height:72px; border-radius:50%; background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.12); display:flex; align-items:center; justify-content:center; margin-bottom:20px; color:rgba(245,245,240,0.5); transition:all 0.3s; }
    .met-step:hover .met-circle { background:rgba(0,212,255,0.08); border-color:rgba(0,212,255,0.4); color:var(--cyan); box-shadow:0 0 24px rgba(0,212,255,0.15); }
    .met-num { font-family:'Space Mono',monospace; font-size:8px; color:rgba(245,245,240,0.2); letter-spacing:0.16em; margin-bottom:8px; text-transform:uppercase; }
    .met-title { font-family:'Space Grotesk',sans-serif; font-size:15px; font-weight:700; color:var(--white); margin-bottom:8px; letter-spacing:-0.015em; }
    .met-desc { font-size:11px; color:rgba(245,245,240,0.42); line-height:1.6; }
    .met-banner { max-width:1200px; margin:72px auto 0; background:rgba(0,212,255,0.06); border:1px solid rgba(0,212,255,0.2); border-radius:20px; padding:52px 60px; display:flex; justify-content:space-between; align-items:center; gap:40px; }
    .met-banner-text { font-family:'Space Grotesk',sans-serif; font-size:clamp(22px,2.5vw,34px); font-weight:700; color:var(--white); letter-spacing:-0.03em; }
    .met-banner-text span { color:var(--cyan); }

    /* ═══ SECCIÓN 07 — RESULTADOS ═══ */
    #resultados { background:rgba(238,238,242,0.93); backdrop-filter:blur(32px); -webkit-backdrop-filter:blur(32px); padding:120px 48px; border-top:1px solid rgba(255,255,255,0.6); }
    #resultados .sec-eyebrow { color:#666; opacity:1; }
    #resultados .sec-title { color:#111; }
    .res-metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; max-width:1200px; margin:0 auto 72px; background:rgba(0,0,0,0.06); border:1px solid rgba(0,0,0,0.08); border-radius:20px; overflow:hidden; }
    .res-metric { background:#fff; padding:48px 36px; position:relative; overflow:hidden; transition:background 0.2s; }
    .res-metric:hover { background:#f5fffe; }
    .res-metric::before { content:''; position:absolute; top:0; left:0; right:0; height:2px; background:linear-gradient(to right,transparent,var(--cyan),transparent); transform:scaleX(0); transition:transform 0.4s; }
    .res-metric:hover::before { transform:scaleX(1); }
    .res-num { font-family:'Space Grotesk',sans-serif; font-size:clamp(36px,3.5vw,52px); font-weight:700; letter-spacing:-0.04em; color:#111; line-height:1; margin-bottom:8px; }
    .res-num .accent { color:var(--cyan); filter:brightness(0.7); }
    .res-label { font-size:14px; font-weight:500; color:#333; margin-bottom:6px; }
    .res-sublabel { font-size:12px; color:#aaa; line-height:1.55; }
    .res-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; max-width:1200px; margin:0 auto; }
    .res-card { background:rgba(0,0,0,0.04); border:1px solid rgba(0,0,0,0.08); border-radius:16px; padding:40px 32px; transition:all 0.25s; }
    .res-card:hover { box-shadow:0 8px 40px rgba(0,0,0,0.1); transform:translateY(-3px); }
    .res-card-icon { width:40px; height:40px; color:#555; margin-bottom:18px; }
    .res-card-title { font-family:'Space Grotesk',sans-serif; font-size:17px; font-weight:700; color:#111; margin-bottom:10px; letter-spacing:-0.02em; }
    .res-card-desc { font-size:13px; color:#888; line-height:1.65; margin-bottom:18px; }
    .res-card-link { font-size:12px; font-weight:600; color:var(--cyan); filter:brightness(0.7); display:flex; align-items:center; gap:6px; text-decoration:none; transition:gap 0.2s; }
    .res-card-link:hover { gap:10px; }

    /* ═══ SECCIÓN 08 — PROYECTOS ═══ */

    /* ═══ SECCIÓN 09 — CONTACTO ═══ */
    #contacto { background:rgba(6,6,10,0.94); backdrop-filter:blur(32px); -webkit-backdrop-filter:blur(32px); padding:140px 48px; border-top:1px solid rgba(255,255,255,0.05); position:relative; overflow:hidden; }
    .contacto-glow { position:absolute; bottom:-20%; right:-10%; width:50%; height:70%; background:radial-gradient(ellipse at 70% 80%, rgba(0,212,255,0.08) 0%, transparent 70%); pointer-events:none; }
    .contacto-inner { max-width:1200px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:100px; align-items:start; position:relative; z-index:1; }
    .contacto-left { }
    .contacto-pills { display:flex; gap:10px; flex-wrap:wrap; margin-top:32px; margin-bottom:40px; }
    .c-pill { background:rgba(0,212,255,0.08); border:1px solid rgba(0,212,255,0.2); border-radius:20px; padding:8px 16px; display:flex; align-items:center; gap:8px; }
    .c-pill-val { font-family:'Space Grotesk',sans-serif; font-size:15px; font-weight:700; color:var(--cyan); }
    .c-pill-label { font-size:11px; color:rgba(245,245,240,0.5); }
    .contacto-data { display:flex; flex-direction:column; gap:16px; margin-top:auto; }
    .c-data-item { display:flex; align-items:center; gap:12px; font-size:14px; color:rgba(245,245,240,0.55); }
    .c-data-icon { width:36px; height:36px; background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.09); border-radius:8px; display:flex; align-items:center; justify-content:center; flex-shrink:0; color:rgba(245,245,240,0.4); }
    .c-data-item a { color:rgba(245,245,240,0.55); text-decoration:none; transition:color 0.2s; }
    .c-data-item a:hover { color:var(--white); }
    /* Form */
    .contacto-form { display:flex; flex-direction:column; gap:14px; }
    .form-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
    .form-field { display:flex; flex-direction:column; gap:6px; }
    .form-label { font-size:11px; font-weight:500; color:rgba(245,245,240,0.45); letter-spacing:0.05em; }
    .form-input, .form-select, .form-textarea { background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.1); border-radius:10px; padding:12px 16px; font-size:13px; color:var(--white); font-family:'DM Sans',sans-serif; outline:none; transition:border-color 0.2s,background 0.2s; width:100%; }
    .form-input::placeholder, .form-textarea::placeholder { color:rgba(245,245,240,0.25); }
    .form-input:focus, .form-select:focus, .form-textarea:focus { border-color:rgba(0,212,255,0.4); background:rgba(0,212,255,0.04); }
    .form-select { cursor:pointer; color:rgba(245,245,240,0.6); appearance:none; background-image:url("data:image/svg+xml,%3Csvg width='10' height='6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4 4 4-4' stroke='rgba(245,245,240,0.3)' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; padding-right:36px; }
    .form-select option { background:#1a1a1e; color:var(--white); }
    .form-textarea { resize:vertical; min-height:100px; }
    .form-note { font-size:11px; color:rgba(245,245,240,0.3); display:flex; align-items:center; gap:6px; }
    .form-submit { font-size:14px; font-weight:600; color:var(--dark); background:var(--cyan); border:none; padding:16px 32px; border-radius:10px; cursor:pointer; letter-spacing:0.06em; text-transform:uppercase; transition:all 0.2s; margin-top:4px; }
    .form-submit:hover { background:#00EEFF; transform:translateY(-1px); box-shadow:0 8px 30px rgba(0,212,255,0.25); }

    /* FOOTER */
    footer { background:rgba(0,0,0,0.97); backdrop-filter:blur(32px); -webkit-backdrop-filter:blur(32px); padding:80px 48px 40px; border-top:1px solid rgba(255,255,255,0.06); }
    .footer-top { display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:60px; max-width:1200px; margin:0 auto 56px; }
    .footer-logo { font-family:'Space Grotesk',sans-serif; font-size:22px; font-weight:700; color:var(--white); letter-spacing:-0.04em; margin-bottom:12px; display:flex; align-items:center; gap:8px; }
    .footer-logo img { height:28px; width:auto; filter:brightness(0.9); }
    .footer-tagline { font-size:12px; color:rgba(245,245,240,0.28); line-height:1.75; max-width:240px; }
    .footer-badges { display:flex; gap:8px; flex-wrap:wrap; margin-top:20px; }
    .footer-badge { font-family:'Space Mono',monospace; font-size:8px; letter-spacing:0.1em; color:rgba(245,245,240,0.3); border:1px solid rgba(255,255,255,0.1); padding:4px 8px; border-radius:4px; text-transform:uppercase; }
    .footer-col-title { font-family:'Space Mono',monospace; font-size:8px; letter-spacing:0.22em; text-transform:uppercase; color:rgba(245,245,240,0.2); margin-bottom:18px; }
    .footer-links { list-style:none; display:flex; flex-direction:column; gap:10px; }
    .footer-links a { font-size:13px; color:rgba(245,245,240,0.38); text-decoration:none; transition:color 0.2s; }
    .footer-links a:hover { color:rgba(245,245,240,0.8); }
    .footer-bottom { max-width:1200px; margin:0 auto; padding-top:28px; border-top:1px solid rgba(255,255,255,0.06); display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; }
    .footer-copy { font-family:'Space Mono',monospace; font-size:9px; color:rgba(245,245,240,0.18); letter-spacing:0.06em; }
    .footer-social { display:flex; gap:16px; }
    .footer-social a { font-family:'Space Mono',monospace; font-size:9px; color:rgba(245,245,240,0.28); text-decoration:none; letter-spacing:0.1em; transition:color 0.2s; }
    .footer-social a:hover { color:var(--cyan); }
    .footer-status { font-family:'Space Mono',monospace; font-size:9px; color:rgba(245,245,240,0.22); display:flex; align-items:center; gap:6px; }
    .footer-status::before { content:'●'; color:#22C55E; font-size:8px; animation:blink 1.4s infinite; }

    /* ─── LANG TOGGLE HERO ─── */
    .hero-lang-toggle { display:inline-flex; align-items:center; gap:0; margin-top:32px; background:rgba(255,255,255,0.07); border:1px solid rgba(255,255,255,0.14); border-radius:980px; overflow:hidden; backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); }
    .lang-btn { font-family:'Space Mono',monospace; font-size:10px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; padding:9px 18px; cursor:pointer; border:none; background:transparent; color:rgba(245,245,240,0.4); transition:all 0.22s; }
    .lang-btn.active { background:var(--cyan); color:#0A0A0A; }
    .lang-btn:not(.active):hover { color:rgba(245,245,240,0.8); background:rgba(255,255,255,0.06); }
    .lang-divider { width:1px; height:16px; background:rgba(255,255,255,0.12); flex-shrink:0; }

    /* ═══════════════════════════════════════
       CINEMATIC 3D — GLOBAL EFFECTS
    ═══════════════════════════════════════ */

    /* Film grain overlay */
    body::after {
      content:'';
      position:fixed; inset:0; z-index:9997; pointer-events:none;
      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='1'/%3E%3C/svg%3E");
      opacity:0.028; mix-blend-mode:overlay;
    }

    /* 3D Card tilt — applied via JS */
    .tilt-card { transform-style:preserve-3d; will-change:transform; transition:transform 0.12s ease, box-shadow 0.2s ease; }
    .tilt-card:hover { box-shadow:0 24px 80px rgba(0,0,0,0.45), 0 0 0 1px rgba(0,212,255,0.18); }

    /* Holographic shimmer on cyan accents */
    @keyframes holo-shift { 0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%} }
    .holo-text {
      background: linear-gradient(90deg, var(--cyan), #fff, var(--cyan), #7B2FBE, var(--cyan));
      background-size:300% 100%;
      -webkit-background-clip:text; -webkit-text-fill-color:transparent;
      animation:holo-shift 4s linear infinite;
    }

    /* Parallax depth variables */
    .parallax-slow { transform:translateY(var(--py-slow,0px)); will-change:transform; }
    .parallax-mid  { transform:translateY(var(--py-mid,0px));  will-change:transform; }
    .parallax-fast { transform:translateY(var(--py-fast,0px)); will-change:transform; }

    /* Scanline effect for dashboard */
    .scanlines { position:relative; overflow:hidden; }
    .scanlines::before {
      content:'';position:absolute;inset:0;z-index:3;pointer-events:none;
      background:repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(0,0,0,0.04) 2px, rgba(0,0,0,0.04) 4px);
    }

    /* ═══════════════════════════════════════
       3D IMAGE SHOWCASE SECTION
    ═══════════════════════════════════════ */
    #showcase-3d {
      position:relative; z-index:10; overflow:hidden;
      background:#050810;
      padding:140px 48px;
      border-top:1px solid rgba(255,255,255,0.05);
    }
    .showcase-bg-glow {
      position:absolute; inset:0; pointer-events:none;
      background:radial-gradient(ellipse 80% 60% at 50% 50%, rgba(0,212,255,0.06) 0%, transparent 70%);
    }
    .showcase-inner { max-width:1280px; margin:0 auto; position:relative; z-index:2; }
    .showcase-header { text-align:center; margin-bottom:80px; }

    /* 3D perspective image triptych */
    .showcase-triptych {
      display:grid;
      grid-template-columns:1fr 1.35fr 1fr;
      gap:20px;
      align-items:center;
      perspective:1400px;
      perspective-origin:50% 40%;
    }
    .showcase-img-wrap {
      position:relative; border-radius:16px; overflow:hidden;
      border:1px solid rgba(255,255,255,0.1);
      box-shadow:0 40px 120px rgba(0,0,0,0.7), 0 0 0 1px rgba(0,212,255,0.12);
      transition:transform 0.4s cubic-bezier(0.23,1,0.32,1), box-shadow 0.4s;
    }
    .showcase-img-wrap img { width:100%; display:block; }
    .showcase-img-wrap:hover { box-shadow:0 60px 160px rgba(0,0,0,0.8), 0 0 40px rgba(0,212,255,0.2); }

    /* Left card — rotated into depth */
    .showcase-left {
      transform: perspective(1000px) rotateY(22deg) rotateX(2deg) scale(0.92);
      transform-origin:right center;
      opacity:0.82;
    }
    .showcase-left:hover { transform: perspective(1000px) rotateY(12deg) rotateX(0) scale(0.96); opacity:1; }

    /* Center card — hero, elevated */
    .showcase-center {
      transform: perspective(1000px) rotateY(0deg) translateY(-20px);
      z-index:2;
    }
    .showcase-center:hover { transform: perspective(1000px) rotateY(0deg) translateY(-28px); }

    /* Right card — mirror of left */
    .showcase-right {
      transform: perspective(1000px) rotateY(-22deg) rotateX(2deg) scale(0.92);
      transform-origin:left center;
      opacity:0.82;
    }
    .showcase-right:hover { transform: perspective(1000px) rotateY(-12deg) rotateX(0) scale(0.96); opacity:1; }

    /* Overlay badge on showcase images */
    .showcase-badge {
      position:absolute; bottom:16px; left:16px;
      font-family:'Space Mono',monospace; font-size:8px; letter-spacing:0.18em; text-transform:uppercase;
      background:rgba(0,0,0,0.7); backdrop-filter:blur(12px);
      border:1px solid rgba(0,212,255,0.3); color:var(--cyan);
      padding:5px 12px; border-radius:20px;
    }
    .showcase-glow-line {
      position:absolute; bottom:0; left:0; right:0; height:2px;
      background:linear-gradient(to right, transparent, var(--cyan), transparent);
      opacity:0;
      transition:opacity 0.3s;
    }
    .showcase-img-wrap:hover .showcase-glow-line { opacity:1; }

    /* Corner circuit decoration */
    .showcase-corner {
      position:absolute; top:12px; right:12px;
      width:32px; height:32px;
      border-top:1px solid rgba(0,212,255,0.5);
      border-right:1px solid rgba(0,212,255,0.5);
    }

    /* ═══════════════════════════════════════
       CINEMATIC VIDEO BREAK SECTIONS
    ═══════════════════════════════════════ */
    .video-break {
      position:relative; z-index:10; overflow:hidden;
      height:65vh; min-height:440px;
    }
    .video-break video {
      position:absolute; inset:0; width:100%; height:100%;
      object-fit:cover; z-index:0;
    }
    .video-break-veil {
      position:absolute; inset:0; z-index:1;
    }
    .video-break-content {
      position:relative; z-index:2; height:100%;
      display:flex; flex-direction:column;
      align-items:center; justify-content:center;
      text-align:center; padding:0 48px;
    }
    .video-break-eyebrow {
      font-family:'Space Mono',monospace; font-size:9px;
      letter-spacing:0.28em; text-transform:uppercase;
      color:rgba(0,212,255,0.9); margin-bottom:20px;
    }
    .video-break-title {
      font-family:'Space Grotesk',sans-serif;
      font-size:clamp(28px,4.5vw,64px);
      font-weight:700; color:#fff;
      letter-spacing:-0.04em; line-height:1.05;
      max-width:900px;
    }
    .video-break-sub {
      font-size:14px; font-weight:300;
      color:rgba(255,255,255,0.55);
      margin-top:18px; max-width:480px; line-height:1.7;
    }
    .video-break-cta {
      margin-top:36px;
    }

    /* Depth dot grid on video breaks */
    .video-break-grid {
      position:absolute; inset:0; z-index:1; pointer-events:none;
      background-image:radial-gradient(circle, rgba(255,255,255,0.07) 1px, transparent 1px);
      background-size:32px 32px;
      mask-image:radial-gradient(ellipse 70% 70% at 50% 50%, black 0%, transparent 100%);
    }

    /* ═══════════════════════════════════════
       LOGO DARK ADAPTATION
    ═══════════════════════════════════════ */
    .nav-logo-img { transition:filter 0.35s ease, opacity 0.2s, transform 0.3s; }
    nav.logo-dark .nav-logo-img {
      filter: invert(1) brightness(0) saturate(0) !important;
    }

    /* ─── LIGHT THEME OVERRIDES ─── */
    body { background: #F4F4F1; }
    #video-veil { background: rgba(0,0,0,0.36); }

    /* Nav */
    nav.scrolled { background: rgba(248,248,246,0.94); border-bottom-color: rgba(0,0,0,0.08); }
    .nav-link { color: rgba(0,0,0,0.48); }
    .nav-link:hover { color: #111; }
    .nav-lang { color: rgba(0,0,0,0.32); }
    .nav-badge { color: rgba(0,0,0,0.32); }
    .nav-cta { color: #111; border-color: rgba(0,0,0,0.22); }
    .nav-cta:hover { background: #111; color: #fff; border-color: #111; }

    /* Enfoque */
    #enfoque { background: #FAFAF8; border-top-color: rgba(0,0,0,0.06); }
    .enfoque-grid { background: rgba(0,0,0,0.05); border-color: rgba(0,0,0,0.07); }
    .enfoque-card { background: #fff; }
    .enfoque-card:hover { background: rgba(0,212,255,0.03); }
    #enfoque .sec-title { color: #111; }
    .ec-tag { color: rgba(0,0,0,0.3); }
    .ec-title { color: #111; }
    .ec-desc { color: rgba(0,0,0,0.48); }

    /* Industrias */
    #industrias { background: #F2F2F0; border-top-color: rgba(0,0,0,0.06); }
    #industrias .sec-title { color: #111; }
    #industrias .sec-sub { color: rgba(0,0,0,0.48); }
    .ind-card { background: #fff; border-color: rgba(0,0,0,0.08); }
    .ind-card:hover { background: rgba(0,212,255,0.02); border-color: rgba(0,212,255,0.22); transform: translateY(-3px); }
    .ind-sector { color: rgba(0,0,0,0.32); }
    .ind-title { color: #111; }
    .ind-desc { color: rgba(0,0,0,0.48); }
    .ind-stat-label { color: rgba(0,0,0,0.42); }
    .ind-tag { color: rgba(0,0,0,0.48); background: rgba(0,0,0,0.04); border-color: rgba(0,0,0,0.09); }
    .ind-case { color: rgba(0,0,0,0.38); border-top-color: rgba(0,0,0,0.07); }

    /* Metodología */
    #metodologia { background: #FAFAF8; border-top-color: rgba(0,0,0,0.06); }
    #metodologia .sec-title { color: #111; }
    #metodologia .sec-sub { color: rgba(0,0,0,0.48); }
    .met-circle { background: #fff; border-color: rgba(0,0,0,0.1); color: rgba(0,0,0,0.38); }
    .met-step:hover .met-circle { background: rgba(0,212,255,0.06); border-color: rgba(0,212,255,0.35); color: var(--cyan); box-shadow: 0 0 24px rgba(0,212,255,0.12); }
    .met-num { color: rgba(0,0,0,0.22); }
    .met-title { color: #111; }
    .met-desc { color: rgba(0,0,0,0.44); }
    .met-line { background: rgba(0,0,0,0.06); }
    .met-banner { background: rgba(0,212,255,0.05); border-color: rgba(0,212,255,0.15); }
    .met-banner-text { color: #111; }

    /* Proyectos */

    /* Contacto */
    #contacto { background: #FAFAF8; border-top-color: rgba(0,0,0,0.06); }
    #contacto .sec-title { color: #111; }
    #contacto .sec-sub { color: rgba(0,0,0,0.48); }
    .c-pill-label { color: rgba(0,0,0,0.48); }
    .c-data-item { color: rgba(0,0,0,0.5); }
    .c-data-item a { color: rgba(0,0,0,0.5); }
    .c-data-icon { background: rgba(0,0,0,0.04); border-color: rgba(0,0,0,0.08); color: rgba(0,0,0,0.38); }
    .form-input, .form-select, .form-textarea { background: rgba(0,0,0,0.04); border-color: rgba(0,0,0,0.09); color: #111; }
    .form-input::placeholder, .form-textarea::placeholder { color: rgba(0,0,0,0.28); }
    .form-label { color: rgba(0,0,0,0.45); }
    .form-note { color: rgba(0,0,0,0.32); }
    .form-select option { background: #fff; color: #111; }

    /* Footer */
    footer { background: #EDEDEB; border-top-color: rgba(0,0,0,0.08); }
    .footer-logo { color: #111; }
    .footer-tagline { color: rgba(0,0,0,0.38); }
    .footer-badge { color: rgba(0,0,0,0.38); border-color: rgba(0,0,0,0.12); }
    .footer-col-title { color: rgba(0,0,0,0.28); }
    .footer-links a { color: rgba(0,0,0,0.42); }
    .footer-links a:hover { color: #111; }
    .footer-bottom { border-top-color: rgba(0,0,0,0.07); }
    .footer-copy { color: rgba(0,0,0,0.28); }
    .footer-social a { color: rgba(0,0,0,0.32); }
    .footer-social a:hover { color: var(--cyan); }
    .footer-status { color: rgba(0,0,0,0.28); }

    /* RESPONSIVE */
    @media (max-width:1100px) {
      .hero-inner { grid-template-columns:1fr; gap:48px; }
      .hero-right { flex-direction:row; flex-wrap:wrap; }
      .metric-float-card { flex:1; min-width:200px; }
      .enfoque-grid { grid-template-columns:repeat(2,1fr); }
      .ind-grid { grid-template-columns:repeat(2,1fr); }
      .plat-inner { grid-template-columns:1fr; }
      .met-steps { grid-template-columns:repeat(3,1fr); gap:32px; }
      .met-line { display:none; }
      .res-metrics { grid-template-columns:repeat(2,1fr); }
      .res-cards { grid-template-columns:1fr; }
      .contacto-inner { grid-template-columns:1fr; gap:60px; }
      .footer-top { grid-template-columns:1fr 1fr; gap:40px; }
    }
    @media (max-width:768px) {
      nav { padding:0 20px; }
      .nav-center { display:none; }
      .hud { display:none; }
      #hero,#enfoque,#soluciones,#industrias,#plataforma,#metodologia,#resultados,#enerion-live,#contacto { padding-left:20px; padding-right:20px; }
      .sol-modules { grid-template-columns:1fr; }
      .sol-module { border-radius:12px !important; }
      .ind-grid { grid-template-columns:1fr; }
      .res-metrics { grid-template-columns:1fr; }
      .met-steps { grid-template-columns:1fr 1fr; }
      .form-row { grid-template-columns:1fr; }
      .footer-top { grid-template-columns:1fr; }
      .sol-header-wrap { flex-direction:column; align-items:flex-start; }
      .met-banner { flex-direction:column; text-align:center; padding:40px 28px; }
    }

    /* ═══════════════════════════════════════
       V3 — HERO CLAIM
    ═══════════════════════════════════════ */
    .hero-claim {
      display:inline-flex; align-items:center; gap:10px;
      font-family:'Space Mono',monospace; font-size:11px; letter-spacing:0.08em;
      color:rgba(245,245,240,0.75);
      background:rgba(0,212,255,0.08); border:1px solid rgba(0,212,255,0.25);
      border-radius:980px; padding:10px 22px; margin-bottom:36px;
      backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
      box-shadow:0 0 32px rgba(0,212,255,0.08) inset;
    }
    .hero-claim strong { color:var(--cyan); font-weight:700; }
    .hero-btns .btn-ghost { font-family:'DM Sans',sans-serif; }

    /* ═══════════════════════════════════════
       V3 — SOLUCIONES ×12
    ═══════════════════════════════════════ */
    .sol-grid-12 {
      display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
      max-width:1240px; margin:0 auto;
      background:rgba(0,0,0,0.07); border:1px solid rgba(0,0,0,0.08);
      border-radius:20px; overflow:hidden;
    }
    .sol-card { background:#fff; padding:36px 30px; position:relative; overflow:hidden; transition:background 0.25s; }
    .sol-card::before { content:''; position:absolute; top:0; left:0; right:0; height:2px; background:linear-gradient(to right,transparent,var(--cyan),transparent); transform:scaleX(0); transition:transform 0.35s; }
    .sol-card:hover { background:#f4fdff; }
    .sol-card:hover::before { transform:scaleX(1); }
    .sc-icon { width:40px; height:40px; background:rgba(0,212,255,0.07); border:1px solid rgba(0,212,255,0.22); border-radius:10px; display:flex; align-items:center; justify-content:center; margin-bottom:16px; color:#0095b3; }
    .sc-title { font-family:'Space Grotesk',sans-serif; font-size:15px; font-weight:700; color:#111; margin-bottom:8px; letter-spacing:-0.015em; line-height:1.25; }
    .sc-desc { font-size:12px; color:#777; line-height:1.62; }

    /* ═══════════════════════════════════════
       V3 — PROCESO (7 etapas)
    ═══════════════════════════════════════ */
    #proceso { background:rgba(250,250,248,0.95); backdrop-filter:blur(32px); -webkit-backdrop-filter:blur(32px); padding:120px 48px; border-top:1px solid rgba(0,0,0,0.06); }
    #proceso .sec-eyebrow { color:#0095b3; opacity:1; }
    #proceso .sec-title { color:#111; }
    #proceso .sec-sub { color:rgba(0,0,0,0.48); }
    .proc-timeline { max-width:880px; margin:0 auto; position:relative; padding-left:0; }
    .proc-timeline::before {
      content:''; position:absolute; left:35px; top:36px; bottom:36px; width:1px;
      background:linear-gradient(to bottom, rgba(0,212,255,0.55), rgba(0,212,255,0.12));
    }
    .proc-step { display:flex; gap:32px; padding:18px 0; position:relative; }
    .proc-node {
      width:72px; height:72px; border-radius:50%; flex-shrink:0;
      background:#fff; border:1px solid rgba(0,0,0,0.1);
      display:flex; align-items:center; justify-content:center;
      font-family:'Space Mono',monospace; font-size:14px; font-weight:700; color:#555;
      position:relative; z-index:1; transition:all 0.3s;
      box-shadow:0 4px 20px rgba(0,0,0,0.06);
    }
    .proc-step:hover .proc-node { border-color:rgba(0,212,255,0.5); color:#0095b3; box-shadow:0 0 28px rgba(0,212,255,0.2); }
    .proc-card {
      flex:1; background:#fff; border:1px solid rgba(0,0,0,0.07); border-radius:16px;
      padding:30px 36px; transition:all 0.25s; position:relative; overflow:hidden;
    }
    .proc-card:hover { box-shadow:0 12px 48px rgba(0,0,0,0.08); border-color:rgba(0,212,255,0.3); transform:translateX(4px); }
    .proc-tag { font-family:'Space Mono',monospace; font-size:8px; letter-spacing:0.2em; text-transform:uppercase; color:#0095b3; margin-bottom:8px; }
    .proc-title { font-family:'Space Grotesk',sans-serif; font-size:19px; font-weight:700; color:#111; letter-spacing:-0.02em; margin-bottom:10px; }
    .proc-desc { font-size:13px; color:#777; line-height:1.7; }
    .proc-card-link { cursor:pointer; }
    .proc-link { display:inline-block; margin-top:14px; font-size:12px; font-weight:600; color:#0095b3; }

    /* ═══════════════════════════════════════
       V3 — SECTORES (7)
    ═══════════════════════════════════════ */
    #sectores { background:rgba(242,242,240,0.95); backdrop-filter:blur(32px); -webkit-backdrop-filter:blur(32px); padding:120px 48px; border-top:1px solid rgba(0,0,0,0.06); }
    #sectores .sec-eyebrow { color:#0095b3; opacity:1; }
    #sectores .sec-title { color:#111; }
    #sectores .sec-sub { color:rgba(0,0,0,0.48); }
    .sec-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; max-width:1200px; margin:0 auto; }
    .sec-card { background:#fff; border:1px solid rgba(0,0,0,0.08); border-radius:16px; padding:36px 30px; transition:all 0.25s; }
    .sec-card:hover { border-color:rgba(0,212,255,0.25); transform:translateY(-3px); box-shadow:0 12px 48px rgba(0,0,0,0.08); }
    .sec-card-wide { grid-column:span 3; display:grid; grid-template-columns:auto 1fr auto; gap:24px; align-items:center; }
    .sec-card-wide .sec-card-title { margin-bottom:6px; }
    .sec-card-wide .sec-card-desc { margin-bottom:0; }
    .sec-card-icon { width:44px; height:44px; background:rgba(0,212,255,0.07); border:1px solid rgba(0,212,255,0.22); border-radius:12px; display:flex; align-items:center; justify-content:center; margin-bottom:18px; color:#0095b3; }
    .sec-card-wide .sec-card-icon { margin-bottom:0; }
    .sec-card-title { font-family:'Space Grotesk',sans-serif; font-size:18px; font-weight:700; color:#111; letter-spacing:-0.02em; margin-bottom:10px; }
    .sec-card-desc { font-size:13px; color:#777; line-height:1.65; margin-bottom:18px; }
    .sec-card-stat { display:flex; align-items:baseline; gap:10px; padding-top:14px; border-top:1px solid rgba(0,0,0,0.06); }
    .sec-card-wide .sec-card-stat { border-top:none; padding-top:0; flex-direction:column; gap:2px; text-align:right; }
    .sec-card-stat span { font-family:'Space Grotesk',sans-serif; font-size:22px; font-weight:700; color:#0095b3; letter-spacing:-0.03em; }
    .sec-card-stat em { font-style:normal; font-size:11px; color:#999; line-height:1.4; }

    /* ═══════════════════════════════════════
       V3 — REPORTES M&V (visor)
    ═══════════════════════════════════════ */
    /* Reportes: bloque de respaldo. Cede protagonismo a #enerion-live (ago-2026) —
       menos padding, visor más estrecho y cabecera compacta. */
    #reportes { background:#050810; padding:84px 48px 78px; border-top:1px solid rgba(255,255,255,0.05); position:relative; overflow:hidden; }
    .reportes-glow { position:absolute; top:-10%; left:50%; transform:translateX(-50%); width:80%; height:60%; background:radial-gradient(ellipse at 50% 0%, rgba(0,212,255,0.1) 0%, transparent 65%); pointer-events:none; z-index:1; }
    .rep-viewer { max-width:820px; margin:0 auto; }
    #reportes .sec-header-center { margin-bottom:40px; }
    #reportes .sec-title { font-size:clamp(24px,2.7vw,36px); }
    .rep-tabs { display:flex; gap:8px; flex-wrap:wrap; justify-content:center; margin-bottom:28px; }
    .rep-tab {
      font-family:'Space Mono',monospace; font-size:10px; letter-spacing:0.08em; text-transform:uppercase;
      color:rgba(245,245,240,0.45); background:rgba(255,255,255,0.04);
      border:1px solid rgba(255,255,255,0.1); border-radius:980px;
      padding:10px 20px; cursor:pointer; transition:all 0.22s;
    }
    .rep-tab:hover { color:var(--white); border-color:rgba(0,212,255,0.4); }
    .rep-tab.active { color:#06121a; background:var(--cyan); border-color:var(--cyan); font-weight:700; }
    .rep-frame {
      position:relative; border-radius:18px; overflow:hidden; cursor:zoom-in;
      border:1px solid rgba(0,212,255,0.2);
      box-shadow:0 40px 120px rgba(0,0,0,0.7), 0 0 60px rgba(0,212,255,0.1);
      transition:transform 0.35s cubic-bezier(0.23,1,0.32,1), box-shadow 0.35s;
    }
    .rep-frame:hover { transform:translateY(-4px); box-shadow:0 56px 150px rgba(0,0,0,0.8), 0 0 90px rgba(0,212,255,0.18); }
    .rep-frame img { width:100%; display:block; transition:opacity 0.3s; }
    .rep-frame-hint {
      position:absolute; bottom:18px; right:18px;
      font-family:'Space Mono',monospace; font-size:9px; letter-spacing:0.14em; text-transform:uppercase;
      background:rgba(0,0,0,0.7); backdrop-filter:blur(12px);
      border:1px solid rgba(0,212,255,0.35); color:var(--cyan);
      padding:7px 14px; border-radius:20px; pointer-events:none;
      opacity:0; transition:opacity 0.25s;
    }
    .rep-frame:hover .rep-frame-hint { opacity:1; }
    .rep-frame-corner { position:absolute; width:36px; height:36px; pointer-events:none; }
    .rep-frame-corner.tl { top:12px; left:12px; border-top:1px solid rgba(0,212,255,0.6); border-left:1px solid rgba(0,212,255,0.6); }
    .rep-frame-corner.br { bottom:12px; right:12px; border-bottom:1px solid rgba(0,212,255,0.6); border-right:1px solid rgba(0,212,255,0.6); }
    .rep-meta { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; margin-top:28px; background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.08); border-radius:14px; overflow:hidden; }
    .rep-meta-item { background:rgba(5,8,16,0.95); padding:18px 22px; display:flex; flex-direction:column; gap:5px; }
    .rep-meta-label { font-family:'Space Mono',monospace; font-size:8px; letter-spacing:0.18em; text-transform:uppercase; color:rgba(245,245,240,0.3); }
    .rep-meta-val { font-family:'Space Grotesk',sans-serif; font-size:14px; font-weight:600; color:var(--white); letter-spacing:-0.01em; }

    /* ═══════════════════════════════════════
       V3 — PROYECTOS con imagen real
    ═══════════════════════════════════════ */

    /* ═══════════════════════════════════════
       V3 — BOTÓN WHATSAPP
    ═══════════════════════════════════════ */
    .btn-wa {
      display:inline-flex; align-items:center; gap:10px;
      font-size:14px; font-weight:600; color:#fff; text-decoration:none;
      background:#1faa53; border-radius:980px; padding:14px 28px;
      margin-bottom:40px; transition:all 0.22s;
      box-shadow:0 8px 32px rgba(31,170,83,0.3);
    }
    .btn-wa:hover { background:#23c25f; transform:translateY(-2px); box-shadow:0 12px 40px rgba(31,170,83,0.45); }

    /* ═══════════════════════════════════════
       V3 — CALCULADORA (modal)
    ═══════════════════════════════════════ */
    .calc-overlay {
      position:fixed; inset:0; z-index:9998;
      background:rgba(2,4,10,0.82); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
      display:none; align-items:center; justify-content:center; padding:24px;
    }
    .calc-overlay.open { display:flex; animation:fade-up 0.35s cubic-bezier(0.22,0.61,0.36,1) both; }
    .calc-modal {
      position:relative; width:100%; max-width:560px; max-height:92vh; overflow-y:auto;
      background:linear-gradient(160deg, #0a1420 0%, #050a14 100%);
      border:1px solid rgba(0,212,255,0.25); border-radius:24px;
      padding:44px 44px 36px;
      box-shadow:0 40px 140px rgba(0,0,0,0.8), 0 0 80px rgba(0,212,255,0.08);
    }
    .calc-close {
      position:absolute; top:18px; right:18px; width:36px; height:36px;
      background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.12); border-radius:50%;
      color:rgba(245,245,240,0.6); font-size:14px; cursor:pointer; transition:all 0.2s;
    }
    .calc-close:hover { color:#fff; border-color:rgba(0,212,255,0.4); }
    .calc-title { font-family:'Space Grotesk',sans-serif; font-size:28px; font-weight:700; color:var(--white); letter-spacing:-0.03em; margin-bottom:8px; }
    .calc-sub { font-size:12px; color:rgba(245,245,240,0.45); line-height:1.6; margin-bottom:28px; }
    .calc-field { margin-bottom:22px; }
    .calc-field label { display:block; font-size:11px; font-weight:500; color:rgba(245,245,240,0.5); letter-spacing:0.05em; margin-bottom:8px; }
    .calc-input-wrap { display:flex; align-items:center; gap:8px; background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.12); border-radius:12px; padding:0 16px; margin-bottom:10px; transition:border-color 0.2s; }
    .calc-input-wrap:focus-within { border-color:rgba(0,212,255,0.5); }
    .calc-input-wrap span { font-family:'Space Grotesk',sans-serif; font-size:18px; color:var(--cyan); font-weight:700; }
    .calc-input-wrap input {
      flex:1; background:transparent; border:none; outline:none;
      font-family:'Space Grotesk',sans-serif; font-size:24px; font-weight:700;
      color:var(--white); padding:13px 0; letter-spacing:-0.02em; width:100%;
    }
    .calc-input-wrap input::-webkit-outer-spin-button, .calc-input-wrap input::-webkit-inner-spin-button { -webkit-appearance:none; }
    input[type="range"] { width:100%; accent-color:var(--cyan); cursor:pointer; }
    #calc-sector { background-color:rgba(255,255,255,0.05); border-color:rgba(255,255,255,0.12); color:var(--white); }
    #calc-sector option { background:#0a1420; }
    .calc-results { display:grid; grid-template-columns:1fr 1fr 1fr; gap:1px; background:rgba(255,255,255,0.07); border:1px solid rgba(255,255,255,0.09); border-radius:14px; overflow:hidden; margin-bottom:20px; }
    .calc-res { background:#070e18; padding:18px 16px; }
    .calc-res-label { font-size:9px; color:rgba(245,245,240,0.35); text-transform:uppercase; letter-spacing:0.1em; margin-bottom:8px; font-family:'Space Mono',monospace; }
    .calc-res-val { font-family:'Space Grotesk',sans-serif; font-size:16px; font-weight:700; color:var(--white); letter-spacing:-0.02em; line-height:1.2; }
    .calc-res-val.accent { color:var(--cyan); }
    .calc-bar-wrap { margin-bottom:26px; }
    .calc-bar-label { display:flex; justify-content:space-between; font-family:'Space Mono',monospace; font-size:9px; letter-spacing:0.1em; text-transform:uppercase; color:rgba(245,245,240,0.4); margin-bottom:8px; }
    .calc-bar-label span:last-child { color:var(--cyan); font-weight:700; }
    .calc-bar { height:6px; background:rgba(255,255,255,0.07); border-radius:4px; overflow:hidden; }
    .calc-bar-fill { height:100%; background:linear-gradient(to right, rgba(0,212,255,0.4), var(--cyan)); border-radius:4px; transition:width 0.5s cubic-bezier(0.22,0.61,0.36,1); }
    .calc-note { font-size:10px; color:rgba(245,245,240,0.3); line-height:1.6; margin-top:16px; text-align:center; }

    /* ═══════════════════════════════════════
       V3 — LIGHTBOX
    ═══════════════════════════════════════ */
    .lightbox {
      position:fixed; inset:0; z-index:9999;
      background:rgba(2,3,8,0.94); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
      display:none; align-items:center; justify-content:center;
    }
    .lightbox.open { display:flex; animation:fade-up 0.3s ease both; }
    .lightbox img { max-width:92vw; max-height:86vh; border-radius:12px; box-shadow:0 40px 160px rgba(0,0,0,0.9), 0 0 80px rgba(0,212,255,0.12); border:1px solid rgba(0,212,255,0.25); }
    .lb-close {
      position:absolute; top:24px; right:28px; width:44px; height:44px; z-index:2;
      background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.15); border-radius:50%;
      color:#fff; font-size:16px; cursor:pointer; transition:all 0.2s;
    }
    .lb-close:hover { border-color:var(--cyan); color:var(--cyan); }
    .lb-arrow {
      position:absolute; top:50%; transform:translateY(-50%); z-index:2;
      width:52px; height:52px; border-radius:50%;
      background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.15);
      color:#fff; font-size:26px; line-height:1; cursor:pointer; transition:all 0.2s;
      display:flex; align-items:center; justify-content:center; padding-bottom:4px;
    }
    .lb-arrow:hover { border-color:var(--cyan); color:var(--cyan); background:rgba(0,212,255,0.08); }
    .lb-prev { left:28px; }
    .lb-next { right:28px; }
    .lb-caption {
      position:absolute; bottom:26px; left:50%; transform:translateX(-50%);
      font-family:'Space Mono',monospace; font-size:10px; letter-spacing:0.14em; text-transform:uppercase;
      color:rgba(245,245,240,0.55); background:rgba(0,0,0,0.6); backdrop-filter:blur(12px);
      border:1px solid rgba(255,255,255,0.1); padding:8px 18px; border-radius:20px; white-space:nowrap;
    }

    /* ═══════════════════════════════════════
       V3 — RESPONSIVE
    ═══════════════════════════════════════ */
    @media (max-width:1100px) {
      .sol-grid-12 { grid-template-columns:repeat(2,1fr); }
      .sec-grid { grid-template-columns:repeat(2,1fr); }
      .sec-card-wide { grid-column:span 2; grid-template-columns:auto 1fr; }
      .sec-card-wide .sec-card-stat { text-align:left; }
      .rep-meta { grid-template-columns:repeat(2,1fr); }
    }
    @media (max-width:768px) {
      #proceso, #sectores, #reportes { padding-left:20px; padding-right:20px; }
      .sol-grid-12 { grid-template-columns:1fr; }
      .sec-grid { grid-template-columns:1fr; }
      .sec-card-wide { grid-column:span 1; grid-template-columns:1fr; }
      .proc-timeline::before { left:26px; }
      .proc-node { width:54px; height:54px; font-size:12px; }
      .proc-step { gap:18px; }
      .proc-card { padding:24px 22px; }
      .calc-modal { padding:32px 24px 28px; }
      .calc-results { grid-template-columns:1fr; }
      .lb-arrow { width:42px; height:42px; font-size:20px; }
      .lb-prev { left:10px; } .lb-next { right:10px; }
      .hero-claim { font-size:9px; padding:9px 14px; }
    }

    /* Nav con scroll siempre es claro → logo siempre oscuro al hacer scroll */
    nav.scrolled .nav-logo-img { filter:invert(1) brightness(0) saturate(0) !important; }

    /* Legibilidad del hero sobre escenas claras del video */
    #video-veil { background: rgba(0,0,0,0.5); }
    .hero-title { text-shadow: 0 2px 32px rgba(0,0,0,0.55); }
    .hero-sub { color: rgba(245,245,240,0.82); text-shadow: 0 1px 18px rgba(0,0,0,0.6); }
    .hero-claim { background: rgba(2,8,16,0.55); }

    /* ═══════════════════════════════════════
       V4 — PROFUNDIDAD 3D REAL (jul-2026)
       Perspectiva compartida · parallax multicapa · dolly de scroll
       glow volumétrico · bordes luminosos · depth-of-field
    ═══════════════════════════════════════ */
    :root {
      --ease-out-strong: cubic-bezier(0.23, 1, 0.32, 1);
      --ease-in-out-strong: cubic-bezier(0.77, 0, 0.175, 1);
    }

    /* Capas de parallax — el JS escribe la propiedad `translate` (nunca transform,
       para no pisar los hovers CSS que usan transform) */
    .plx { will-change: translate; }

    /* (3-ago-2026: el canvas 3D del hero — núcleo, satélite y polvo — se eliminó) */

    /* Dolly del hero: el JS escribe translate/scale/opacity sobre .hero-inner */
    #hero .hero-inner { will-change: translate, scale; }

    /* Depth of field: la rejilla lejana del hero queda ligeramente fuera de foco */
    .hero-grid { filter: blur(0.6px); }

    /* ── SHOWCASE TRIPTYCH: perspectiva COMPARTIDA real ──
       Antes cada tarjeta llevaba su propio perspective(1000px); ahora las tres
       comparten el punto de fuga del contenedor (perspective:1400px) y se separan
       en Z de verdad: laterales hundidos a -70px, central elevada a +56px.
       El JS además inclina todo el plano (rotateX) según el scroll. */
    /* Nota: los selectores van compuestos (.showcase-img-wrap.showcase-*) para
       ganarle a .reveal.visible — antes ese selector aplastaba la pose 3D
       del tríptico al revelarse y la sección quedaba plana. */
    .showcase-triptych { transform-style: preserve-3d; will-change: transform; }
    .showcase-img-wrap { transition: transform .5s var(--ease-out-strong), box-shadow .5s ease, filter .5s ease, opacity .5s ease; }
    .showcase-img-wrap.showcase-left {
      transform: rotateY(24deg) rotateX(2deg) translateZ(-70px) scale(0.94);
      filter: blur(1.4px) brightness(0.82);
    }
    .showcase-img-wrap.showcase-left:hover { transform: rotateY(11deg) rotateX(0deg) translateZ(-18px) scale(0.97); filter: blur(0) brightness(1); opacity:1; }
    .showcase-img-wrap.showcase-center { transform: translateY(-20px) translateZ(56px); }
    .showcase-img-wrap.showcase-center:hover { transform: translateY(-26px) translateZ(74px); }
    .showcase-img-wrap.showcase-right {
      transform: rotateY(-24deg) rotateX(2deg) translateZ(-70px) scale(0.94);
      filter: blur(1.4px) brightness(0.82);
    }
    .showcase-img-wrap.showcase-right:hover { transform: rotateY(-11deg) rotateX(0deg) translateZ(-18px) scale(0.97); filter: blur(0) brightness(1); opacity:1; }

    /* ── Videos de fondo con plano lejano (headroom para el parallax del JS) ── */
    .video-break video, #video-reel video { will-change: translate, scale; }

    /* ── Entrada de secciones con profundidad: reveal se levanta desde un plano
       inclinado (el estado .visible de la línea 116 sigue mandando al final) ── */
    .reveal {
      transform: perspective(900px) translateY(26px) rotateX(7deg);
      transform-origin: 50% 100%;
      transition: opacity .9s var(--ease-out-strong), transform .9s var(--ease-out-strong);
    }

    /* ── Punto de luz cyan que sigue al cursor dentro de las tarjetas ── */
    @media (hover: hover) and (pointer: fine) {
      .enfoque-card::after, .sol-card::after, .sec-card::after,
      .live-case::after, .live-why-card::after, .res-card::after, .proc-card::after {
        content:''; position:absolute; inset:0; pointer-events:none; z-index:1; border-radius:inherit;
        background: radial-gradient(240px circle at var(--mx,50%) var(--my,50%), rgba(0,212,255,0.13), transparent 65%);
        opacity:0; transition: opacity .35s ease;
      }
      .enfoque-card:hover::after, .sol-card:hover::after, .sec-card:hover::after,
      .live-case:hover::after, .live-why-card:hover::after, .res-card:hover::after, .proc-card:hover::after { opacity:1; }
    }

    /* ── Borde luminoso orbital (beam) en los marcos protagonistas ── */
    @property --beam { syntax: '<angle>'; initial-value: 0deg; inherits: false; }
    @keyframes beam-spin { to { --beam: 360deg; } }
    .rep-frame::after, .dash-card::after, .showcase-center::after, .calc-modal::after {
      content:''; position:absolute; inset:0; border-radius:inherit; padding:1px; pointer-events:none; z-index:4;
      background: conic-gradient(from var(--beam),
        transparent 0deg, transparent 300deg,
        rgba(0,212,255,0.0) 308deg, rgba(0,212,255,0.85) 340deg, transparent 360deg);
      -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
      -webkit-mask-composite: xor;
      mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
      mask-composite: exclude;
      animation: beam-spin 7s linear infinite;
      opacity:.85;
    }
    .calc-modal::after { animation-duration: 9s; opacity:.6; }

    /* ── Tarjetas oscuras: sombra apilada multicapa + filo de luz superior
       (profundidad real: contacto + media distancia + ambiente) ── */
    .enfoque-card { box-shadow: inset 0 1px 0 rgba(255,255,255,0.05); }
    .rep-frame {
      box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.10),
        0 2px 6px rgba(0,0,0,0.5),
        0 18px 44px rgba(0,0,0,0.55),
        0 48px 120px rgba(0,0,0,0.65),
        0 0 60px rgba(0,212,255,0.10);
    }
    .dash-card {
      box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.09),
        0 2px 6px rgba(0,0,0,0.25),
        0 16px 40px rgba(0,0,0,0.30),
        0 40px 90px rgba(0,0,0,0.35);
    }

    /* ── Tarjetas claras: elevación por capas (no una sola sombra plana) ── */
    .sec-card:hover, .res-card:hover, .proc-card:hover {
      box-shadow:
        0 1px 2px rgba(10,20,30,0.05),
        0 6px 16px rgba(10,20,30,0.07),
        0 20px 48px rgba(10,20,30,0.09),
        0 0 0 1px rgba(0,212,255,0.14);
    }
    .proj-card.tilt-card:hover {
      box-shadow:
        0 1px 2px rgba(10,20,30,0.06),
        0 8px 20px rgba(10,20,30,0.08),
        0 28px 64px rgba(10,20,30,0.12),
        0 0 0 1px rgba(0,212,255,0.18);
    }
    .res-metric:hover { box-shadow: inset 0 -1px 0 rgba(0,212,255,0.12); }

    /* ── Iconos con glow volumétrico al hover de su tarjeta ── */
    .ec-icon, .sc-icon, .sec-card-icon { transition: box-shadow .35s ease, background .35s ease; }
    .enfoque-card:hover .ec-icon,
    .sol-card:hover .sc-icon,
    .sec-card:hover .sec-card-icon {
      box-shadow: 0 0 22px rgba(0,212,255,0.30), inset 0 0 12px rgba(0,212,255,0.14);
      background: rgba(0,212,255,0.12);
    }

    /* ── Horizonte cyan en las secciones oscuras (línea de luz + halo) ── */
    #showcase-3d::before, #reportes::before {
      content:''; position:absolute; top:-1px; left:50%; translate:-50% 0; z-index:3;
      width:min(620px, 62%); height:1px; pointer-events:none;
      background: linear-gradient(90deg, transparent, rgba(0,212,255,0.65), transparent);
      filter: drop-shadow(0 0 14px rgba(0,212,255,0.55));
    }
    /* Haz de luz volumétrico cayendo sobre el visor de reportes */
    #reportes::after {
      content:''; position:absolute; top:-120px; left:50%; translate:-50% 0; z-index:1;
      width:540px; height:64%; pointer-events:none;
      background: linear-gradient(to bottom, rgba(0,212,255,0.16), rgba(0,212,255,0.03) 60%, transparent);
      clip-path: polygon(40% 0, 60% 0, 100% 100%, 0 100%);
      filter: blur(26px);
      opacity:.55;
    }

    /* ── Gradiente de profundidad: cada sección clara recibe la sombra
       de la sección anterior, como planos apilados ── */
    #soluciones::before, #proceso::before, #sectores::before,
    #plataforma::before, #resultados::before, #enerion-live::before {
      content:''; position:absolute; top:0; left:0; right:0; height:110px; z-index:0;
      background: linear-gradient(to bottom, rgba(5,10,26,0.06), transparent);
      pointer-events:none;
    }

    /* ── Nav con profundidad al scrollear ── */
    nav.scrolled { box-shadow: 0 18px 48px -14px rgba(5,10,26,0.22); }

    /* ── Micro-feedback de presión (Emil: el botón escucha) ── */
    .btn-primary:active, .btn-ghost:active, .btn-dark:active, .btn-outline-dark:active,
    .form-submit:active, .rep-tab:active, .nav-cta:active, .btn-wa:active,
    .lang-btn:active, .calc-close:active, .lb-close:active, .lb-arrow:active {
      transform: scale(0.97);
    }
    .rep-tab.active { box-shadow: 0 0 24px rgba(0,212,255,0.35); }
    .btn-primary:hover { box-shadow: 0 10px 34px rgba(0,212,255,0.28); }

    /* ── Móvil: triptych apilado y 3D pesado apagado ── */
    @media (max-width: 768px) {
      .showcase-triptych { grid-template-columns: 1fr; perspective: none; gap: 16px; transform: none !important; }
      .showcase-img-wrap.showcase-left, .showcase-img-wrap.showcase-center, .showcase-img-wrap.showcase-right { transform: none; filter: none; opacity: 1; }
      #reportes::after { width: 320px; }
    }

    /* ── Accesibilidad de movimiento: menos y más suave, no cero ── */

    /* ═══════════════════════════════════════
       ENERION LIVE — LA PLATAFORMA (ago-2026)
       Sección oscura para que las pantallas claras de la app floten como
       producto iluminado. Reemplazó a #proyectos (casos OXXO / D1 / MiAmbiente).
    ═══════════════════════════════════════ */
    #enerion-live { background: #04070F; padding: 130px 48px 120px; border-top: 1px solid rgba(255,255,255,0.05); position: relative; overflow: hidden; }
    .live-glow { position: absolute; top: -10%; left: 50%; width: 900px; height: 620px; transform: translateX(-50%); background: radial-gradient(ellipse at 50% 30%, rgba(0,212,255,0.10) 0%, transparent 62%); pointer-events: none; z-index: 1; }

    /* ── El producto: marco de aplicación ── */
    .live-app { position: relative; z-index: 2; max-width: 1180px; margin: 0 auto; background: rgba(255,255,255,0.028); border: 1px solid rgba(255,255,255,0.08); border-radius: 22px; overflow: hidden; box-shadow: 0 30px 90px rgba(0,0,0,0.55), 0 0 0 1px rgba(0,212,255,0.05); }
    .live-chrome { display: flex; align-items: center; gap: 8px; padding: 13px 18px; background: rgba(255,255,255,0.035); border-bottom: 1px solid rgba(255,255,255,0.07); }
    .live-dot { width: 9px; height: 9px; border-radius: 50%; background: rgba(255,255,255,0.14); flex-shrink: 0; }
    .live-chrome-title { margin-left: 12px; font-family: 'Space Grotesk', sans-serif; font-size: 12.5px; color: rgba(245,245,240,0.72); }
    .live-chrome-live { margin-left: auto; display: inline-flex; align-items: center; gap: 7px; font-family: 'Space Mono', monospace; font-size: 10px; color: rgba(245,245,240,0.42); }
    .live-pulse { width: 6px; height: 6px; border-radius: 50%; background: #22C55E; box-shadow: 0 0 8px rgba(34,197,94,0.8); animation: glow-pulse 2s ease-in-out infinite; }

    .live-tabs { display: flex; gap: 4px; padding: 16px 18px 0; flex-wrap: wrap; }
    .live-tab { padding: 10px 20px; border: 1px solid transparent; border-radius: 980px; background: transparent; color: rgba(245,245,240,0.5); font-family: 'DM Sans', sans-serif; font-size: 13.5px; cursor: pointer; transition: color .18s ease, background .18s ease, border-color .18s ease; }
    .live-tab:hover { color: rgba(245,245,240,0.85); background: rgba(255,255,255,0.04); }
    .live-tab.active { color: #06121a; background: var(--cyan); border-color: var(--cyan); font-weight: 500; }

    .live-stage { display: grid; grid-template-columns: 1.45fr 1fr; gap: 34px; padding: 22px 26px 30px; align-items: start; }
    .live-shot { position: relative; border-radius: 14px; overflow: hidden; border: 1px solid rgba(255,255,255,0.1); background: #0b1220; box-shadow: 0 18px 50px rgba(0,0,0,0.5); }
    .live-shot img { display: block; width: 100%; height: auto; opacity: 0; transition: opacity .32s ease; }
    .live-shot img.loaded { opacity: 1; }
    .live-shot-corner { position: absolute; width: 22px; height: 22px; border-color: var(--cyan); opacity: 0.55; pointer-events: none; }
    .live-shot-corner.tl { top: 10px; left: 10px; border-top: 1.5px solid; border-left: 1.5px solid; }
    .live-shot-corner.br { bottom: 10px; right: 10px; border-bottom: 1.5px solid; border-right: 1.5px solid; }

    .live-say { padding-top: 6px; }
    .live-say-num { font-family: 'Space Mono', monospace; font-size: 11px; letter-spacing: 0.2em; color: var(--cyan); opacity: 0.75; margin-bottom: 12px; }
    .live-say-title { font-family: 'Space Grotesk', sans-serif; font-size: clamp(20px, 2vw, 26px); font-weight: 500; line-height: 1.2; margin-bottom: 14px; color: var(--white); }
    .live-say-desc { font-size: 14.5px; line-height: 1.72; color: rgba(245,245,240,0.6); margin-bottom: 20px; }
    .live-say-list { list-style: none; display: flex; flex-direction: column; gap: 10px; }
    .live-say-list li { position: relative; padding-left: 18px; font-size: 13.5px; line-height: 1.5; color: rgba(245,245,240,0.75); }
    .live-say-list li::before { content: ''; position: absolute; left: 0; top: 8px; width: 5px; height: 5px; border-radius: 50%; background: var(--cyan); }

    /* ── Encabezados internos ── */
    .live-h3 { font-family: 'Space Grotesk', sans-serif; font-size: clamp(22px, 2.6vw, 32px); font-weight: 500; line-height: 1.18; color: var(--white); }
    .live-h3-sub { font-size: 14.5px; line-height: 1.6; color: rgba(245,245,240,0.5); margin-top: 10px; }
    .live-flow-head, .live-cases-head { position: relative; z-index: 2; max-width: 1180px; margin: 96px auto 30px; }
    .live-why-head { margin-bottom: 30px; }

    /* ── Recorrido en 4 pasos ── */
    .live-flow { position: relative; z-index: 2; max-width: 1180px; margin: 0 auto; display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.08); border-radius: 18px; overflow: hidden; }
    .live-step { background: #060B15; padding: 30px 26px 32px; transition: background .22s ease; }
    .live-step:hover { background: #0a1220; }
    .live-step-n { font-family: 'Space Mono', monospace; font-size: 11px; color: var(--cyan); opacity: 0.8; margin-bottom: 16px; }
    .live-step-t { font-family: 'Space Grotesk', sans-serif; font-size: 17px; font-weight: 500; color: var(--white); margin-bottom: 9px; }
    .live-step-d { font-size: 13.5px; line-height: 1.66; color: rgba(245,245,240,0.55); }

    /* ── Principios ── */
    .live-why { position: relative; z-index: 2; max-width: 1180px; margin: 96px auto 0; }
    .live-why-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
    .live-why-card { position: relative; background: rgba(255,255,255,0.032); border: 1px solid rgba(255,255,255,0.075); border-radius: 14px; padding: 24px 24px 26px; transition: transform .22s ease, border-color .22s ease, background .22s ease; }
    .live-why-card:hover { transform: translateY(-3px); border-color: rgba(0,212,255,0.28); background: rgba(255,255,255,0.05); }
    .live-why-t { font-family: 'Space Grotesk', sans-serif; font-size: 15.5px; font-weight: 500; color: var(--white); margin-bottom: 10px; line-height: 1.3; }
    .live-why-d { font-size: 13.5px; line-height: 1.66; color: rgba(245,245,240,0.55); }

    /* ── Sectores / implementaciones ── */
    .live-cases { position: relative; z-index: 2; max-width: 1180px; margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
    .live-case { position: relative; background: rgba(255,255,255,0.035); border: 1px solid rgba(255,255,255,0.085); border-radius: 18px; overflow: hidden; transition: border-color .22s ease; }
    .live-case:hover { border-color: rgba(0,212,255,0.3); }
    .live-case-shot { height: 176px; overflow: hidden; background: #0b1220; border-bottom: 1px solid rgba(255,255,255,0.07); }
    .live-case-shot img { width: 100%; height: 100%; object-fit: cover; object-position: top center; transition: transform .5s cubic-bezier(.2,.7,.3,1); }
    .live-case:hover .live-case-shot img { transform: scale(1.04); }
    .live-case-body { padding: 22px 24px 26px; }
    .live-case-badge { display: inline-block; font-family: 'Space Mono', monospace; font-size: 8.5px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--cyan); background: rgba(0,212,255,0.12); border-radius: 20px; padding: 5px 11px; margin-bottom: 14px; }
    .live-case-title { font-family: 'Space Grotesk', sans-serif; font-size: 19px; font-weight: 500; color: var(--white); margin-bottom: 10px; }
    .live-case-desc { font-size: 13.5px; line-height: 1.66; color: rgba(245,245,240,0.55); margin-bottom: 18px; }
    .live-case-stats { display: flex; flex-direction: column; gap: 11px; border-top: 1px solid rgba(255,255,255,0.07); padding-top: 16px; }
    .live-case-row { display: flex; align-items: baseline; gap: 10px; }
    .live-case-val { font-family: 'Space Grotesk', sans-serif; font-size: 15px; font-weight: 500; color: var(--cyan); flex-shrink: 0; min-width: 62px; }
    .live-case-lbl { font-size: 12px; line-height: 1.45; color: rgba(245,245,240,0.48); }

    /* ── CTA de cierre ── */
    .live-cta { position: relative; z-index: 2; max-width: 1180px; margin: 60px auto 0; display: flex; align-items: center; justify-content: space-between; gap: 28px; flex-wrap: wrap; background: linear-gradient(135deg, #06121a 0%, #0a2233 100%); border: 1px solid rgba(0,212,255,0.22); border-radius: 20px; padding: 34px 38px; }
    .live-cta-title { font-family: 'Space Grotesk', sans-serif; font-size: clamp(19px, 2.1vw, 25px); font-weight: 500; color: var(--white); margin-bottom: 8px; }
    .live-cta-desc { font-size: 14px; line-height: 1.6; color: rgba(245,245,240,0.58); max-width: 480px; }
    .live-cta-btns { display: flex; gap: 12px; flex-wrap: wrap; }

    @media (max-width: 1000px) {
      .live-stage { grid-template-columns: 1fr; gap: 26px; }
      .live-flow { grid-template-columns: repeat(2, 1fr); }
      .live-why-grid { grid-template-columns: repeat(2, 1fr); }
      .live-cases { grid-template-columns: 1fr; }
      .live-case-shot { height: 200px; }
    }
    @media (max-width: 768px) {
      #enerion-live { padding: 90px 20px 84px; }
      .live-flow { grid-template-columns: 1fr; }
      .live-why-grid { grid-template-columns: 1fr; }
      .live-flow-head, .live-cases-head { margin-top: 64px; }
      .live-why { margin-top: 64px; }
      .live-stage { padding: 18px 16px 24px; }
      .live-tabs { padding: 14px 14px 0; }
      .live-tab { padding: 9px 15px; font-size: 12.5px; }
      .live-cta { padding: 28px 24px; }
      .live-cta-btns { width: 100%; }
      .live-cta-btns .btn-primary, .live-cta-btns .btn-ghost { flex: 1; justify-content: center; text-align: center; }
    }

    @media (prefers-reduced-motion: reduce) {
      html { scroll-behavior: auto; }
      .holo-text, .data-ticker, .metric-float-card,
      .rep-frame::after, .dash-card::after, .showcase-center::after, .calc-modal::after,
      .nav-badge::before, .dash-live::before, .footer-status::before { animation: none !important; }
      .reveal { transform: none; transition: opacity .4s ease; }
      .reveal.visible { transform: none; }
      .plx { translate: none !important; }
      #hero .hero-inner { translate: none !important; scale: none !important; }
      .tilt-card { transition: box-shadow .2s ease; }
    }