* { margin:0; padding:0; box-sizing:border-box; }
    body {
   
      background:#0f172a; color:#f8fafc;
      transition:background 0.5s, color 0.5s;
    }
    body.light { background:#f9fafb; color:#0f172a; }

    /* NAVBAR */
    .soteco-navbar {
      display:flex; justify-content:space-between; align-items:center;
      padding:18px 40px;
      position:fixed; top:0; left:0; width:100%;
      background:rgba(15,23,42,0.25); backdrop-filter:blur(18px);
      border:1px solid rgba(0,255,200,0.15); border-radius:0 0 18px 18px;
      box-shadow:0 8px 25px rgba(0,255,200,0.08);
      z-index:1000;
      opacity:0; transform:translateY(-100%);
      animation:fadeSlide 1.2s ease forwards;
    }
    @keyframes fadeSlide { to {opacity:1; transform:translateY(0);} }
    .soteco-navbar.scrolled {
      background:rgba(15,23,42,0.85);
      border-color:rgba(0,255,200,0.3);
      box-shadow:0 8px 32px rgba(0,255,200,0.25);
    }

    /* LOGO */
    .soteco-logo h1 {
      font-size:22px; font-weight:700; letter-spacing:2px;
      background:linear-gradient(90deg,#00f5a0,#00d9f5,#0061ff,#8B5CF6,#00f5a0);
      -webkit-background-clip:text; -webkit-text-fill-color:transparent;
      background-size:300% 300%; animation:gradientFlow 6s ease infinite;
      text-shadow:0 0 25px rgba(0,255,200,0.3);
      cursor:pointer;
    }
    @keyframes gradientFlow {
      0%,100%{background-position:0% 50%;}
      50%{background-position:100% 50%;}
    }

    /* LINKS */
    .soteco-links { list-style:none; display:flex; gap:30px; align-items:center; }
    .soteco-links li { position:relative; }
    .soteco-links a {
      position:relative; text-decoration:none; color:#cbd5e1;
      font-size:15px; font-weight:500; padding:8px 12px;
      transition:color 0.3s ease;
    }

    /* Subrayado líquido */
    .soteco-links a::after {
      content:""; position:absolute; left:0; bottom:-6px;
      width:100%; height:3px;
      background:linear-gradient(90deg,#00f5a0,#00d9f5,#8B5CF6,#00f5a0);
      background-size:300% 300%;
      border-radius:4px;
      transform:scaleX(0);
      transform-origin:right;
      transition:transform 0.5s ease;
    }
    .soteco-links a:hover::after {
      transform:scaleX(1);
      transform-origin:left;
      animation:liquidMove 3s linear infinite;
    }
    .soteco-links a.active::after {
      transform:scaleX(1);
      animation:liquidMove 3s linear infinite;
    }
    @keyframes liquidMove {
      0%{background-position:0% 50%;}
      50%{background-position:100% 50%;}
      100%{background-position:0% 50%;}
    }

    .soteco-links a:hover { color:#fff; text-shadow:0 0 8px #00f5a0; }
    .soteco-links a.active { color:#00f5a0; }

    /* DARK MODE TOGGLE */
    .soteco-dark-toggle {
      display:flex; align-items:center; gap:8px;
      cursor:pointer; padding:6px 12px;
      border-radius:20px;
      background:rgba(255,255,255,0.08);
      transition:0.3s;
      display: none;
    }
    .soteco-dark-toggle:hover { background:rgba(0,255,200,0.25); }
    #sotecoIconoModo { font-size:18px; color:#00f5a0; }

    /* HAMBURGER */
    .soteco-menu-toggle { display:none; width:28px; height:22px; position:relative; cursor:pointer; z-index:1002; }
    .soteco-menu-toggle span {
      position:absolute; height:3px; width:100%; background:#00f5a0;
      border-radius:3px; transition:0.4s;
    }
    .soteco-menu-toggle span:nth-child(1){top:0;}
    .soteco-menu-toggle span:nth-child(2){top:9px;}
    .soteco-menu-toggle span:nth-child(3){top:18px;}
    .soteco-menu-toggle.active span:nth-child(1){transform:rotate(45deg); top:9px;}
    .soteco-menu-toggle.active span:nth-child(2){opacity:0;}
    .soteco-menu-toggle.active span:nth-child(3){transform:rotate(-45deg); top:9px;}

    /* RESPONSIVE */
    @media(max-width:1024px){
      .soteco-links {
        display:none; flex-direction:column; justify-content:center; align-items:center;
        background:rgba(10,15,30,0.95);
        position:fixed; top:0; left:0; width:100%; height:100vh;
        gap:30px; z-index:999;
      }
      .soteco-links.show { display:flex; animation:menuFade 0.5s ease; }
      @keyframes menuFade { from{opacity:0; transform:translateY(-20px);} to{opacity:1; transform:translateY(0);} }
      .soteco-menu-toggle { display:block; }
    }
   @media (max-width: 360px) {
    
  /* NAVBAR más compacto */
  .soteco-navbar {
    padding: 12px 18px; /* menos espacio a los lados */
    border-radius: 0 0 12px 12px;
  }

  /* LOGO más pequeño */
  .soteco-logo h1 {
    font-size: 18px; /* antes 22px */
    letter-spacing: 1px;
    text-shadow: 0 0 12px rgba(0,255,200,0.25);
  }

  /* Enlaces de menú */
  .soteco-links a {
    font-size: 14px; /* antes 15px */
    padding: 6px 10px;
  }

  /* Ícono dark/light más compacto */
  .soteco-dark-toggle {
    padding: 4px 8px;
    gap: 6px;
  }
  #sotecoIconoModo {
    font-size: 16px; /* antes 18px */
  }

  /* Menú hamburguesa más chico */
  .soteco-menu-toggle {
    width: 24px;
    height: 20px;
  }
  .soteco-menu-toggle span {
    height: 2px;
  }
  .soteco-menu-toggle span:nth-child(2) {
    top: 8px;
  }
  .soteco-menu-toggle span:nth-child(3) {
    top: 16px;
  }
}