:root {
      /* Paleta base (ajustaremos conforme sua identidade) */
      --brand: #010e2c;
      /* Texto principal - preto grafite */
      --primary: #3173e6;
      /* Vermelho ação (CTA) */
      --primary-600: #3173e6;
      /* Vermelho hover */
      --bg: #010e2c;
      /* Fundo escuro elegante */
      --muted: #adb5c2;
      /* Texto secundário */
      --card: #424a5c;
      /* Cartões/Blocos */
      --stroke: #1f2937;
      /* Bordas sutis */
    }

    body {
      background: linear-gradient(180deg, #0b0f1a, #0e1423 30%, #0b0f1a 100%);
      color: #e5e7eb;
    }

    a {
      color: inherit;
      text-decoration: none
    }

    .navbar {
      backdrop-filter: saturate(1.2) blur(8px);
      background: rgba(11, 15, 26, .55) !important;
      border-bottom: 1px solid var(--stroke)
    }

    .nav-link {
      opacity: .9
    }

    .nav-link:hover,
    .nav-link.active {
      color: #fff
    }

    .btn-brand {
      background: var(--primary);
      color: #fff;
      border: none
    }

    .btn-brand:hover {
      background: var(--primary-600);
      color: #fff
    }

    .btn-ghost {
      background: transparent;
      border: 1px solid var(--stroke);
      color: #e5e7eb
    }

    .btn-ghost:hover {
      border-color: #6b7280
    }

    /* Hero */
    .hero {
      position: relative;
      overflow: hidden
    }

    .hero::after {
      content: "";
      position: absolute;
      inset: -10% -20% auto -20%;
      height: 120%;
      background: radial-gradient(600px 300px at 30% 10%, #3173e626, transparent 70%), radial-gradient(600px 300px at 80% 40%, #3173e61a, transparent 70%);
      pointer-events: none
    }

    .hero h1 {
      letter-spacing: -.02em
    }

    /* Sections */
    section {
      padding: 80px 0
    }

    .section-muted {
      color: var(--muted)
    }

    .card {
      background: var(--card);
      border: 1px solid var(--stroke);
    }

    .icon-badge {
      width: 44px;
      height: 44px;
      display: grid;
      place-items: center;
      border-radius: 12px;
      background: #3173e6;
      color: #fff;
    }

    /* Portfolio grid */
    .work-item {
      border-radius: 16px;
      overflow: hidden;
      border: 1px solid var(--stroke);
      background: #0c1220
    }

    .work-item img {
      width: 100%;
      height: 220px;
      object-fit: cover
    }

    /* Testimonials */
    .avatar {
      width: 48px;
      height: 48px;
      border-radius: 50%;
      object-fit: cover
    }

    /* Footer */
    footer {
      border-top: 1px solid var(--stroke);
    }

    /* Floating Voltar ao Top */
    .top-float {
      position: fixed;
      right: 18px;
      bottom: 18px;
      z-index: 1030
    }

    /* Utilities */
    .max-w-3xl {
      max-width: 900px
    }

    .contact-icon {
      color: #3173e6;
      /* destaque com a cor da marca */
      margin-right: .6rem;
      font-size: 1.5rem;
    }

    .contact-card li {
      font-size: 1rem;
      font-weight: 400;
    }