.elementor-kit-87{--e-global-color-primary:#003366;--e-global-color-secondary:#800000;--e-global-color-text:#000000;--e-global-color-accent:#FF4500;--e-global-color-background:#FFFFFF;--e-global-color-backgroundAccent:#F0F0F0;--e-global-color-transparent:#00000000;--e-global-typography-primary-font-family:"Poppins";--e-global-typography-primary-font-size:24px;--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Poppins";--e-global-typography-secondary-font-size:20px;--e-global-typography-secondary-font-weight:600;--e-global-typography-text-font-family:"Figtree";--e-global-typography-text-font-size:16px;--e-global-typography-text-font-weight:400;--e-global-typography-text-line-height:1.5em;--e-global-typography-accent-font-family:"Figtree";--e-global-typography-accent-font-size:16px;--e-global-typography-accent-font-weight:400;--e-global-typography-accent-line-height:1.5em;--e-global-typography-heading-xl-font-family:"Poppins";--e-global-typography-heading-xl-font-size:56px;--e-global-typography-heading-xl-font-weight:600;--e-global-typography-heading-xl-line-height:1.2em;--e-global-typography-heading-l-font-family:"Poppins";--e-global-typography-heading-l-font-size:48px;--e-global-typography-heading-l-font-weight:600;--e-global-typography-heading-l-line-height:1.2em;--e-global-typography-heading-m-font-family:"Poppins";--e-global-typography-heading-m-font-size:40px;--e-global-typography-heading-m-font-weight:600;--e-global-typography-heading-m-line-height:1.2em;--e-global-typography-heading-s-font-family:"Poppins";--e-global-typography-heading-s-font-size:18px;--e-global-typography-heading-s-font-weight:500;--e-global-typography-body-s-font-family:"Figtree";--e-global-typography-body-s-font-size:14px;--e-global-typography-body-s-font-weight:400;--e-global-typography-body-s-line-height:1.5em;background-color:var( --e-global-color-background );}.elementor-kit-87 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-kit-87{--e-global-typography-primary-font-size:22px;--e-global-typography-secondary-font-size:18px;--e-global-typography-heading-xl-font-size:48px;--e-global-typography-heading-l-font-size:40px;--e-global-typography-heading-m-font-size:32px;--e-global-typography-heading-s-font-size:18px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-87{--e-global-typography-primary-font-size:18px;--e-global-typography-secondary-font-size:16px;--e-global-typography-heading-xl-font-size:40px;--e-global-typography-heading-l-font-size:32px;--e-global-typography-heading-m-font-size:32px;--e-global-typography-heading-s-font-size:16px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */<!-- FONTES (pode ir no header global) -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap" rel="stylesheet">

<style>
  :root {
    --alx-blue: #012b5b;
    --alx-red:  #7b0022;
    --alx-white:#ffffff;
    --alx-dark: #111111;
    --alx-gray: #f4f5f7;
    --alx-gray-mid: #7b8495;
    --container-width: 1380px; /* 1180 + 200 (100px para cada lado) */
    --radius-lg: 16px;
    --shadow-soft: 0 18px 40px rgba(0,0,0,0.08);
    --transition-fast: 0.2s ease;
  }

  * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
  }

  body {
    font-family: "Poppins", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    background: #ffffff;
    color: var(--alx-dark);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
  }

  a {
    color: inherit;
    text-decoration: none;
  }

  img {
    max-width: 100%;
    display: block;
  }

  .container {
    max-width: var(--container-width);
    margin: 0 auto;
    padding: 0 30px;
  }

  /* HEADER / NAV */
  header.alx-header {
    position: sticky;
    top: 0;
    z-index: 20;
    backdrop-filter: blur(12px);
    background: rgba(255,255,255,0.96);
    border-bottom: 1px solid rgba(0,0,0,0.05);
  }

  .nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 0;
  }

  .nav-left {
    display: flex;
    align-items: center;
    gap: 12px;
  }

  .logo-mark {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--alx-blue), var(--alx-red));
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 23px;
    color: #ffffff;
  }

  .brand-text {
    display: flex;
    flex-direction: column;
  }

  .brand-title {
    font-weight: 600;
    font-size: 21px;
    letter-spacing: 0.08em;
    color: var(--alx-blue);
  }

  .brand-subtitle {
    font-size: 14px;
    text-transform: uppercase;
    color: var(--alx-gray-mid);
    letter-spacing: 0.18em;
  }

  .nav-links {
    display: flex;
    gap: 28px;
    font-size: 17px;
  }

  .nav-links a {
    color: var(--alx-dark);
    position: relative;
    padding-bottom: 3px;
  }

  .nav-links a:hover {
    color: var(--alx-blue);
  }

  .nav-links a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 2px;
    background: linear-gradient(90deg,var(--alx-blue),var(--alx-red));
    transition: width var(--transition-fast);
  }

  .nav-links a:hover::after {
    width: 100%;
  }

  .nav-cta {
    display: flex;
    gap: 12px;
  }

  .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    font-size: 17px;
    padding: 11px 22px;
    border: 1px solid transparent;
    cursor: pointer;
    background: transparent;
    color: var(--alx-dark);
    transition: all var(--transition-fast);
    white-space: nowrap;
  }

  .btn-primary {
    background: linear-gradient(135deg,var(--alx-blue),var(--alx-red));
    box-shadow: var(--shadow-soft);
    color: #ffffff;
  }

  .btn-primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 24px 40px rgba(0,0,0,0.24);
  }

  .btn-outline {
    border-color: rgba(0,0,0,0.14);
    background: rgba(1,43,91,0.03);
    color: var(--alx-blue);
  }

  .btn-outline:hover {
    color: var(--alx-red);
    border-color: rgba(0,0,0,0.4);
  }

  /* HERO */
  .hero {
    padding: 70px 0 40px;
    background:
      radial-gradient(circle at top left, rgba(1,43,91,0.12), transparent 55%),
      radial-gradient(circle at top right, rgba(123,0,34,0.1), transparent 55%),
      linear-gradient(#ffffff, #f7f8fb);
  }

  .hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(0, 1.3fr);
    gap: 40px;
    align-items: center;
  }

  .eyebrow {
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: var(--alx-gray-mid);
    margin-bottom: 12px;
  }

  .hero h1 {
    font-size: 41px;
    line-height: 1.15;
    margin-bottom: 16px;
    color: var(--alx-dark);
  }

  .hero h1 span {
    background: linear-gradient(135deg,var(--alx-blue),var(--alx-red));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
  }

  .hero-sub {
    font-size: 18px;
    color: var(--alx-gray-mid);
    max-width: 520px;
    margin-bottom: 22px;
  }

  .hero-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 22px;
  }

  .tag {
    border-radius: 999px;
    border: 1px solid rgba(0,0,0,0.1);
    padding: 5px 12px;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--alx-gray-mid);
    background: #ffffff;
  }

  .hero-metric-row {
    display: flex;
    flex-wrap: wrap;
    gap: 26px;
    margin-top: 18px;
  }

  .hero-metric {
    min-width: 110px;
  }

  .hero-metric strong {
    display: block;
    font-size: 23px;
    color: var(--alx-blue);
  }

  .hero-metric span {
    font-size: 14px;
    color: var(--alx-gray-mid);
  }

  .hero-card {
    background: #ffffff;
    border-radius: 24px;
    padding: 24px 22px;
    border: 1px solid rgba(1,43,91,0.12);
    box-shadow: var(--shadow-soft);
  }

  .hero-card h3 {
    font-size: 18px;
    margin-bottom: 8px;
    color: var(--alx-dark);
  }

  .hero-card p {
    font-size: 16px;
    color: var(--alx-gray-mid);
    margin-bottom: 10px;
  }

  .hero-card-list {
    margin-top: 12px;
    display: grid;
    gap: 9px;
    font-size: 16px;
  }

  .hero-level-pill {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    font-size: 14px;
    color: var(--alx-gray-mid);
  }

  .dot-blue, .dot-red, .dot-white {
    width: 9px;
    height: 9px;
    border-radius: 50%;
  }

  .dot-blue { background: var(--alx-blue); }
  .dot-red { background: var(--alx-red); }
  .dot-white { background: var(--alx-dark); }

  /* GENERIC SECTION */
  section.alx-section {
    padding: 52px 0;
  }

  .section-header {
    margin-bottom: 30px;
    max-width: 720px;
  }

  .section-kicker {
    font-size: 14px;
    text-transform: uppercase;
    color: var(--alx-gray-mid);
    letter-spacing: 0.16em;
    margin-bottom: 8px;
  }

  .section-title {
    font-size: 27px;
    margin-bottom: 8px;
    color: var(--alx-dark);
  }

  .section-sub {
    font-size: 17px;
    color: var(--alx-gray-mid);
  }

  /* PROBLEMAS */
  .block-problems {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(240px,1fr));
    gap: 20px;
  }

  .problem-card {
    background: #ffffff;
    border-radius: var(--radius-lg);
    padding: 20px 18px;
    border: 1px solid rgba(0,0,0,0.06);
    box-shadow: 0 10px 25px rgba(0,0,0,0.03);
  }

  .problem-card h3 {
    font-size: 18px;
    margin-bottom: 6px;
    color: var(--alx-dark);
  }

  .problem-card p {
    font-size: 16px;
    color: var(--alx-gray-mid);
  }

  /* ESCADA */
  .ladder-grid {
    display: grid;
    grid-template-columns: minmax(0,1.4fr) minmax(0,1.6fr);
    gap: 30px;
    align-items: flex-start;
  }

  .ladder-main {
    background: linear-gradient(135deg, rgba(1,43,91,0.05), rgba(123,0,34,0.05));
    border-radius: 22px;
    padding: 20px 22px;
    border: 1px solid rgba(0,0,0,0.07);
  }

  .ladder-main h3 {
    font-size: 19px;
    margin-bottom: 9px;
    color: var(--alx-dark);
  }

  .ladder-main p {
    font-size: 16px;
    color: var(--alx-gray-mid);
  }

  .ladder-steps {
    margin-top: 14px;
    display: grid;
    gap: 9px;
    font-size: 16px;
  }

  .ladder-step-title {
    font-weight: 500;
    font-size: 16px;
    color: var(--alx-dark);
  }

  .ladder-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    font-size: 14px;
    margin-top: 14px;
  }

  .ladder-pill {
    border-radius: 999px;
    background: #ffffff;
    border: 1px solid rgba(0,0,0,0.12);
    padding: 5px 13px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-size: 13px;
    color: var(--alx-gray-mid);
  }

  .ladder-list {
    display: grid;
    gap: 12px;
    font-size: 16px;
  }

  .ladder-list-item strong {
    display: block;
    font-size: 17px;
    color: var(--alx-blue);
  }

  /* NÍVEIS */
  .levels-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(270px,1fr));
    gap: 22px;
  }

  .level-card {
    background: #ffffff;
    border-radius: 22px;
    padding: 20px 20px 18px;
    border: 1px solid rgba(0,0,0,0.08);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: transform var(--transition-fast), box-shadow var(--transition-fast), border-color var(--transition-fast);
    box-shadow: 0 12px 32px rgba(0,0,0,0.04);
  }

  .level-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow-soft);
    border-color: rgba(1,43,91,0.2);
  }

  .level-badge {
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: var(--alx-gray-mid);
    margin-bottom: 5px;
  }

  .level-title {
    font-size: 20px;
    margin-bottom: 5px;
    color: var(--alx-dark);
  }

  .level-subtitle {
    font-size: 15px;
    color: var(--alx-gray-mid);
    margin-bottom: 10px;
  }

  .level-tagline {
    font-size: 15px;
    color: var(--alx-gray-mid);
    margin-bottom: 12px;
  }

  .level-block {
    margin-bottom: 11px;
  }

  .level-block strong {
    display: block;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 3px;
    color: rgba(0,0,0,0.7);
  }

  .level-block ul {
    list-style: none;
    font-size: 15px;
    color: var(--alx-gray-mid);
  }

  .level-block ul li + li {
    margin-top: 3px;
  }

  .level-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 12px;
    font-size: 14px;
    color: var(--alx-gray-mid);
  }

  .pill-small {
    border-radius: 999px;
    padding: 4px 11px;
    border: 1px solid rgba(0,0,0,0.15);
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    background: #f7f8fb;
  }

  /* COMPARATIVO */
  .compare-table-wrapper {
    overflow-x: auto;
    border-radius: 18px;
    border: 1px solid rgba(0,0,0,0.08);
    background: #ffffff;
    box-shadow: 0 14px 34px rgba(0,0,0,0.04);
  }

  table.alx-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 15px;
    min-width: 650px;
    background: #ffffff;
  }

  table.alx-table thead {
    background: linear-gradient(90deg,rgba(1,43,91,0.95),rgba(123,0,34,0.95));
    color: #ffffff;
  }

  table.alx-table th,
  table.alx-table td {
    padding: 12px 14px;
    text-align: left;
    border-bottom: 1px solid rgba(0,0,0,0.06);
  }

  table.alx-table th {
    font-weight: 500;
    font-size: 15px;
    white-space: nowrap;
  }

  table.alx-table tbody tr:nth-child(even) {
    background: #f7f8fb;
  }

  /* DIAGNÓSTICO */
  .diagnostic-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(240px,1fr));
    gap: 18px;
  }

  .diagnostic-step {
    background: #ffffff;
    border-radius: var(--radius-lg);
    padding: 16px 16px 13px;
    border: 1px solid rgba(0,0,0,0.08);
    font-size: 16px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.03);
  }

  .step-tag {
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: var(--alx-gray-mid);
    margin-bottom: 5px;
  }

  .diagnostic-step h3 {
    font-size: 18px;
    margin-bottom: 6px;
    color: var(--alx-dark);
  }

  .diagnostic-step p {
    color: var(--alx-gray-mid);
    font-size: 16px;
  }

  /* FAQ */
  .faq-grid {
    display: grid;
    grid-template-columns: minmax(0,1.2fr) minmax(0,1.8fr);
    gap: 28px;
    align-items: flex-start;
  }

  .faq-list {
    display: grid;
    gap: 12px;
    font-size: 16px;
  }

  .faq-item {
    background: #ffffff;
    border-radius: 14px;
    padding: 12px 14px;
    border: 1px solid rgba(0,0,0,0.07);
    box-shadow: 0 8px 22px rgba(0,0,0,0.03);
  }

  .faq-item h3 {
    font-size: 17px;
    margin-bottom: 6px;
    color: var(--alx-dark);
  }

  .faq-item p {
    color: var(--alx-gray-mid);
    font-size: 16px;
  }

  /* CTA */
  .cta-section {
    padding: 56px 0 46px;
    border-top: 1px solid rgba(0,0,0,0.06);
    background: radial-gradient(circle at center, rgba(1,43,91,0.08), #ffffff);
  }

  .cta-box {
    max-width: 760px;
    margin: 0 auto;
    text-align: center;
  }

  .cta-box h2 {
    font-size: 27px;
    margin-bottom: 8px;
    color: var(--alx-dark);
  }

  .cta-box p {
    font-size: 17px;
    color: var(--alx-gray-mid);
    margin-bottom: 22px;
  }

  .cta-form {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(230px,1fr));
    gap: 14px;
    margin-top: 12px;
  }

  .cta-form input,
  .cta-form select,
  .cta-form textarea {
    width: 100%;
    border-radius: 999px;
    border: 1px solid rgba(0,0,0,0.16);
    background: rgba(255,255,255,0.9);
    padding: 11px 15px;
    font-size: 16px;
    color: var(--alx-dark);
    outline: none;
  }

  .cta-form textarea {
    border-radius: 18px;
    min-height: 90px;
    resize: vertical;
  }

  .cta-form input::placeholder,
  .cta-form textarea::placeholder {
    color: rgba(0,0,0,0.45);
  }

  .cta-footer-note {
    font-size: 14px;
    color: var(--alx-gray-mid);
    margin-top: 12px;
  }

  /* FOOTER */
  footer.alx-footer {
    border-top: 1px solid rgba(0,0,0,0.06);
    padding: 16px 0 20px;
    font-size: 14px;
    color: var(--alx-gray-mid);
    background: #f5f7fb;
  }

  .footer-row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: space-between;
    align-items: center;
  }

  /* RESPONSIVO */
  @media (max-width: 900px) {
    .hero-grid,
    .ladder-grid,
    .faq-grid {
      grid-template-columns: 1fr;
    }

    .nav-links {
      display: none;
    }

    .nav-cta .btn-outline {
      display: none;
    }

    .hero {
      padding-top: 40px;
    }
  }

  @media (max-width: 600px) {
    .hero h1 {
      font-size: 35px;
    }

    .container {
      padding: 0 18px;
    }
  }
</style>/* End custom CSS */