/* This CSS file is for the hero section of the Inceptonix website. It includes styles for the navbar, hero content, and responsive design. The styles are designed to create a modern and visually appealing hero section with animations and interactive elements. */
    /* ===== SECTION ===== */
    .partners-section {
      position: relative;
      padding: 60px 0 50px;
      background: linear-gradient(180deg, #0a0e27 0%, #0d1135 50%, #0a0e27 100%);
      overflow: hidden;
    }

    /* Top divider glow */
    .partners-section::before {
      content: '';
      position: absolute;
      top: 0;
      left: 50%;
      transform: translateX(-50%);
      width: 60%;
      height: 1px;
      background: linear-gradient(90deg, transparent, rgba(249, 115, 22, 0.3), transparent);
    }

    /* Bottom divider glow */
    .partners-section::after {
      content: '';
      position: absolute;
      bottom: 0;
      left: 50%;
      transform: translateX(-50%);
      width: 60%;
      height: 1px;
      background: linear-gradient(90deg, transparent, rgba(249, 115, 22, 0.15), transparent);
    }

    .partners-header {
      text-align: center;
      margin-bottom: 40px;
      position: relative;
      z-index: 2;
    }

    .partners-label {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      font-size: 12px;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.15em;
      color: #f97316;
      margin-bottom: 8px;
    }

    .partners-label .label-dot {
      width: 6px;
      height: 6px;
      background: #f97316;
      border-radius: 50%;
      animation: pulse 2s ease-in-out infinite;
    }

    .partners-title {
      font-size: 28px;
      font-weight: 700;
      color: rgba(255, 255, 255, 0.9);
      letter-spacing: -0.02em;
    }

    .partners-title span {
      color: rgba(255, 255, 255, 0.4);
      font-weight: 400;
    }

    /* ===== MARQUEE CONTAINER ===== */
    .marquee-container {
      position: relative;
      width: 100%;
      overflow: hidden;
    }

    /* Fade edges */
    .marquee-fade-left,
    .marquee-fade-right {
      position: absolute;
      top: 0;
      bottom: 0;
      width: 120px;
      z-index: 5;
      pointer-events: none;
    }

    .marquee-fade-left {
      left: 0;
      background: linear-gradient(90deg, #0d1135 0%, transparent 100%);
    }

    .marquee-fade-right {
      right: 0;
      background: linear-gradient(-90deg, #0d1135 0%, transparent 100%);
    }

    /* ===== MARQUEE TRACK ===== */
    .marquee-track {
      display: flex;
      align-items: center;
      width: max-content;
      animation: scroll 30s linear infinite;
    }

    .marquee-track:hover {
      animation-play-state: paused;
    }

    /* ===== LOGO CARD ===== */
    .logo-card {
      flex-shrink: 0;
      margin: 0 20px;
      padding: 24px 44px;
      background: rgba(255, 255, 255, 0.03);
      border: 1px solid rgba(255, 255, 255, 0.06);
      border-radius: 16px;
      display: flex;
      align-items: center;
      justify-content: center;
      min-width: 260px;
      height: 100px;
      transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
      cursor: default;
      position: relative;
      overflow: hidden;
    }

    .logo-card::before {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(135deg, rgba(249, 115, 22, 0.05), transparent);
      opacity: 0;
      transition: opacity 0.4s;
    }

    .logo-card:hover {
      border-color: rgba(249, 115, 22, 0.25);
      background: rgba(255, 255, 255, 0.06);
      transform: translateY(-4px);
      box-shadow: 0 12px 40px rgba(249, 115, 22, 0.08);
    }

    .logo-card:hover::before {
      opacity: 1;
    }

    .logo-inner {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 6px;
      position: relative;
      z-index: 2;
    }

    .logo-name {
      font-size: 22px;
      font-weight: 700;
      color: rgba(255, 255, 255, 0.85);
      letter-spacing: -0.01em;
      transition: color 0.3s;
    }

    .logo-card:hover .logo-name {
      color: #ffffff;
    }

    .logo-tagline {
      font-size: 9.5px;
      font-weight: 400;
      color: rgba(255, 255, 255, 0.3);
      text-transform: uppercase;
      letter-spacing: 0.1em;
      white-space: nowrap;
      transition: color 0.3s;
    }

    .logo-card:hover .logo-tagline {
      color: rgba(255, 255, 255, 0.5);
    }

    /* Brand-specific colors */
    .logo-card[data-brand="naico"] .logo-name {
      color: #5eead4;
    }
    .logo-card[data-brand="naico"]:hover .logo-name {
      color: #5eead4;
      text-shadow: 0 0 20px rgba(94, 234, 212, 0.3);
    }

    .logo-card[data-brand="logicplum"] .logo-name {
      color: #a78bfa;
    }
    .logo-card[data-brand="logicplum"]:hover .logo-name {
      color: #a78bfa;
      text-shadow: 0 0 20px rgba(167, 139, 250, 0.3);
    }

    .logo-card[data-brand="dns"] .logo-name {
      color: #60a5fa;
    }
    .logo-card[data-brand="dns"]:hover .logo-name {
      color: #60a5fa;
      text-shadow: 0 0 20px rgba(96, 165, 250, 0.3);
    }

    .logo-card[data-brand="nuventure"] .logo-name {
      color: #fbbf24;
    }
    .logo-card[data-brand="nuventure"]:hover .logo-name {
      color: #fbbf24;
      text-shadow: 0 0 20px rgba(251, 191, 36, 0.3);
    }

    .logo-card[data-brand="nuvento"] .logo-name {
      color: #fb923c;
    }
    .logo-card[data-brand="nuvento"]:hover .logo-name {
      color: #fb923c;
      text-shadow: 0 0 20px rgba(251, 146, 60, 0.3);
    }

    .logo-card[data-brand="panapps"] .logo-name {
      color: #f472b6;
    }
    .logo-card[data-brand="panapps"]:hover .logo-name {
      color: #f472b6;
      text-shadow: 0 0 20px rgba(244, 114, 182, 0.3);
    }

    /* ===== SECOND ROW (reverse scroll) ===== */
    .marquee-track-reverse {
      display: flex;
      align-items: center;
      width: max-content;
      animation: scrollReverse 35s linear infinite;
      margin-top: 16px;
    }

    .marquee-track-reverse:hover {
      animation-play-state: paused;
    }

    /* ===== ANIMATIONS ===== */
    @keyframes scroll {
      0% {
        transform: translateX(0);
      }
      100% {
        transform: translateX(-50%);
      }
    }

    @keyframes scrollReverse {
      0% {
        transform: translateX(-50%);
      }
      100% {
        transform: translateX(0);
      }
    }

    @keyframes pulse {
      0%, 100% {
        opacity: 1;
        transform: scale(1);
      }
      50% {
        opacity: 0.4;
        transform: scale(0.8);
      }
    }

    /* ===== RESPONSIVE ===== */
    @media (max-width: 768px) {
      .partners-section {
        padding: 40px 0 35px;
      }

      .partners-title {
        font-size: 20px;
      }

      .logo-card {
        margin: 0 12px;
        padding: 18px 28px;
        min-width: 200px;
        height: 80px;
        border-radius: 12px;
      }

      .logo-name {
        font-size: 17px;
      }

      .logo-tagline {
        font-size: 8px;
      }

      .marquee-fade-left,
      .marquee-fade-right {
        width: 60px;
      }

      .marquee-track {
        animation-duration: 22s;
      }

      .marquee-track-reverse {
        animation-duration: 26s;
      }
    }

    @media (max-width: 480px) {
      .logo-card {
        margin: 0 8px;
        padding: 14px 20px;
        min-width: 170px;
        height: 72px;
      }

      .logo-name {
        font-size: 15px;
      }

      .logo-tagline {
        display: none;
      }
    }