/* HERO */
      .hero {
        min-height: 100vh;
        padding: 180px 20px 140px;
        justify-content: center;
        position: relative;
      }

@property --g1 {
  syntax: "<number>";
  inherits: false;
  initial-value: 0.5;
}

@property --g2 {
  syntax: "<number>";
  inherits: false;
  initial-value: 0.35;
}

@keyframes glow1 {
  0%   { --g1: 0.3; }
  50%  { --g1: 0.7; }
  100% { --g1: 0.3; }
}

@keyframes glow2 {
  0%   { --g2: 0.2; }
  50%  { --g2: 0.5; }
  100% { --g2: 0.2; }
}

      .hero-bg {
        position: absolute;
        inset: 0;
        background: radial-gradient(
            circle at 15% 25%,
            rgba(84, 75, 255, var(--g1)),
            transparent 55%
          ),
          radial-gradient(
            circle at 85% 75%,
            rgba(126, 131, 255, var(--g2)),
            transparent 60%
          );
          animation:
    glow1 4.7s ease-in-out infinite,
    glow2 5.3s ease-in-out infinite;
        filter: blur(120px);
        z-index: -1;
      }

      .hero-inner {
        max-width: 1500px;
        width: 100%;
      }
      .hero-card {
        padding: 110px;
        align-items: center;
        text-align: center;
        gap: 100px;
      }
      .hero h1 {
        font-size: 4.2rem;
        line-height: 1.03;
        margin-bottom: 30px;
      }
      .hero h1 span {
        color: var(--c-main);
      }
      .hero p {
        font-size: 1.25rem;
        opacity: 0.85;
        margin-bottom: 54px;
      }
      .actions {
        gap: 20px;
        display: flex;
        justify-content: center;
      }

      section {
        padding: 180px 20px;
        display: flex;
        justify-content: center;
      }
      .inner {
        max-width: 1500px;
        width: 100%;
      }
      .section-title {
        font-size: 2.9rem;
        margin-bottom: 22px;
      }
      .section-desc {
        opacity: 0.75;
        max-width: 760px;
        margin-bottom: 110px;
        font-size: 1.05rem;
      }

      /* HOSTING */
      .hosting {
        display: grid;
      }
      .hosting div {
        padding: 40px;
      }
      .hosting i {
        font-size: 2rem;
        color: var(--c-main);
        margin-bottom: 24px;
      }

      .hosting h3 {
        margin-bottom: 16px;
      }

      .hosting p {
        opacity: 0.85;
        line-height: 1.7;
      }

      /* MANIFESTO */
      .manifesto {
        display: grid;
        grid-template-columns: 1.2fr 0.8fr;
        gap: 100px;
      }
      .manifesto p {
        opacity: 0.85;
        line-height: 1.8;
        font-size: 1.05rem;
      }

      .manifesto h3 {
        margin-bottom: 34px;
      }

      .manifesto li {
        margin-bottom: 10px;
      }

      /* TRUST */
      .trust {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
        gap: 46px;
      }
      .trust div {
        padding: 56px;
        text-align: center;
      }
      .trust i {
        font-size: 2.2rem;
        color: var(--c-main);
        margin-bottom: 22px;
      }

      /* HOSTING */
      .hosting {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
        gap: 46px;
      }
      .host {
        padding: 66px;
        position: relative;
        overflow: hidden;
      }
      .host::before {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(
          135deg,
          rgba(255, 75, 75, 0.3),
          transparent 65%
        );
      }
      .host i {
        font-size: 2.2rem;
        color: var(--c-main);
        margin-bottom: 22px;
      }

      /* SECURITY */
      .security {
        display: grid;
      }
      .security div {
        padding: 40px;
      }
      .security i {
        font-size: 2rem;
        color: var(--c-main);
        margin-bottom: 24px;
      }

      .security h3 {
        margin-bottom: 16px;
      }

      .security p {
        opacity: 0.85;
        line-height: 1.7;
      }

      /* MAP */
      .map {
        height: 420px;
        border-radius: var(--r-xl);
        background: radial-gradient(
            circle at 30% 40%,
            rgba(255, 75, 75, 0.4),
            transparent 45%
          ),
          radial-gradient(
            circle at 70% 60%,
            rgba(255, 147, 147, 0.3),
            transparent 50%
          ),
          #111;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.1rem;
        opacity: 0.85;
      }

      /* TABLE */
      .compare {
        overflow-x: auto;
      }
      table {
        width: 100%;
        border-collapse: collapse;
        font-size: 0.95rem;
      }
      th,
      td {
        padding: 18px 20px;
        text-align: left;
      }
      th {
        color: var(--c-main);
      }
      tr {
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
      }

      /* FAQ */
      .faq {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 26px;
      }

@media (max-width: 800px) {
  .faq {
    grid-template-columns: 1fr;
  }
}

      details {
      margin-bottom: 16px;
      padding: 40px;
      cursor: pointer;
    }
    
    details p {
      opacity: 0.85;
      line-height: 1.6;
      margin-top: 12px;
    }

    details summary {
      font-size: 1.1rem;
      color: var(--c-main);
      font-weight: 600;
      list-style: none;
    }

      /* PARTNERS */
      .partners {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
        gap: 40px;
        opacity: 0.8;
      }
      .partners div {
        padding: 36px;
        text-align: center;
        font-weight: 600;
      }

      marquee {
        color: #94a3b8;
        justify-content: center;
        align-items: center;
        display: flex;
      }

      marquee img {
        justify-content: center;
        align-items: center;
        align-self: center;
      }

      .brandlogos {
        display: flex;
      }

      .brandlogo {
        height: 150px;
        margin-right: 180px;
      }

      /* CTA */
      .cta {
        padding: 140px;
        text-align: center;
      }
      .cta h2 {
        font-size: 3rem;
        margin-bottom: 30px;
      }

      @media (max-width: 900px) {
        .hero-card,
        .manifesto {
          grid-template-columns: 1fr;
          padding: 70px;
        }
        .hero h1 {
          font-size: 3.1rem;
        }
        .footer-inner {
          grid-template-columns: 1fr 1fr;
        }
      }

      .stars i {
        color: gold;
      }

    @media (max-width: 530px) {
        .hero-card,
        .manifesto {
          padding: 35px;
          padding-top: 50px;
        }
        .hero h1 {
          font-size: 2rem;
        }
        .footer-inner {
          grid-template-columns: 1fr 1fr;
        }

        .hero p {
          font-size: 1rem;
        }

        .cta {
        padding: 50px;
      }
      .cta h2 {
        font-size: 1.5rem;
      }
      .tech {
        display: none;
      }
      }

    @media (max-width: 400px) {
        .hero-card,
        .manifesto {
          padding: 20px;
          padding-top: 35px;
        }
        .hero h1 {
          font-size: 1.5rem;
        }
        .footer-inner {
          grid-template-columns: 1fr 1fr;
        }

        .hero p {
          font-size: 0.9rem;
        }

        .cta {
        padding: 50px;
      }
      .cta h2 {
        font-size: 1rem;
      }
      }

      .hero-card {
  animation: heroFade 1s ease forwards;
}

@keyframes heroFade {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

.testemonial-featured {
  border: 2px solid var(--c-main);
  padding: 30px;
}