/*
Theme Name: One Learning
Theme URI: https://seusite.com
Author: Thiago Gouveia
Version: 1.0
Description: Tema customizado para o projeto One Learning.
*/

@font-face {
    font-family: 'Altissimo';
    src: url('../fonts/altissimo/Altissimo-Regular.woff2') format('woff2'),
         url('../fonts/altissimo/Altissimo-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
  }
  
  
/* === Root Variables: Cores e Tipografia === */
:root {
    /* Paleta principal */
    --color-primary: #1A073D;
    --color-secondary: #FF3B91;
    --color-accent: #49BFE6;
    --color-accent-secondary: #662B90;
  
    /* Tons neutros */
    --color-light-bg: #FCFAFF;
    --color-dark-bg: #1A073D;
  
    --color-text-light: #F5F5F5;
    --color-text-dark: #3D3D3D;
    --color-heading-dark: #141414;
  
    /* Cores auxiliares */
    --color-success: #4CAF50;
    --color-warning: #FFC107;
    --color-error: #F44336;
  
    /* Tipografia */
    --font-heading: 'Altissimo', sans-serif;
    --font-body: 'Roboto', sans-serif;
  
    /* Breakpoints */
    --break-sm: 640px;
    --break-md: 768px;
    --break-lg: 1024px;
    --break-xl: 1280px;
    --break-2xl: 1536px;
  }
  
  /* === Container e Grid === */
  .container {
    max-width: 1280px;
    margin: 0 auto;
    padding-left: 0px !important;
    padding-right: 0px !important;
  }

  .row>* {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  
  /* === Tipografia === */
  h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    font-weight: 700;
    letter-spacing: 0.03em;
    color: var(--color-heading-dark);
    margin: 0 0 1rem;
  }
  
  h1 {
    font-size: 40px;
    line-height: 48px;
  }
  h3 {
    font-size: 32px;
    line-height: 40px;
  }
  h4 {
    font-size: 24px;
    line-height: 32px;
  }
  h6 {
    font-size: 18px;
    line-height: 26px;
  }
  
  body, p {
    font-family: var(--font-body);
    font-size: 18px;
    line-height: 26px;
    color: var(--color-text-dark);
  }
  
  .small-text {
    font-size: 16px;
    line-height: 24px;
  }
  
  /* === Botões === */
  .btn-general {
    font-family: var(--font-heading);
    font-size: 16px;
    letter-spacing: 0.03em;
    text-align: center;
    padding: 16px;
    border-radius: 8px;
    display: inline-block;
    transition: all 0.3s ease;
    cursor: pointer;
    text-decoration: none;
  }
  
  .btn-primary {
    background-color: var(--color-accent);
    color: var(--color-heading-dark);
    font-weight: 700;
  }
  .btn-primary:hover {
    background-color: var(--color-accent-secondary);
  }
  
  .btn-secondary {
    background-color: #49BFE6;
    color: #141414;
    border: none;
  }
  
  .btn-secondary:hover {
    background-color: #63c9eb;
  }
  
  .btn-tertiary {
    background-color: rgba(6, 6, 10, 0.08);
    color: #49BFE6;
    border: 1px solid #49BFE6;
  }
  .btn-tertiary:hover {
    background-color: rgba(73, 191, 230, 0.15);
    color: #49BFE6 !important;
  }

/* esconde qualquer .btn-geral cujo href esteja vazio ou ausente */
.btn-general[href=""],
.btn-general:not([href]) {
  display: none !important;
}
  
  /* === Seções === */
  .section {
    padding: 120px 0;
  }
  
  .section--dark {
    background-color: var(--color-dark-bg);
    color: var(--color-text-light);
  }
  
  .section--light {
    background-color: var(--color-light-bg);
    color: var(--color-text-dark);
  }
  
  /* === Navegação === */
  .header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 48px;
    padding: 16px 24px;
  }
  
  /* Gap entre botões no menu */
  .header .header-actions {
    display: flex;
    gap: 16px;
  }
  
  /* === Responsividade === */
  @media (max-width: 1280px) {
    .container { padding: 0 32px; }
  }
  @media (max-width: 1024px) {
    .container { padding: 0 24px; }
  }
  @media (max-width: 768px) {
    .container { padding: 0 16px; }
    .section { padding: 80px 0; }
  }
  @media (max-width: 640px) {
    .section { padding: 64px 0; }
  }
  

  /* ========== Estilos para o site ========== */

 /* === Header === */

.site-header {
    background-color: var(--color-primary);
    position: relative;
    z-index: 1000;
    transition: all 0.3s ease-in-out;
    visibility: visible;
  }

  .header-main {
    position: relative;
    z-index: 999 !important;
  }

  #site-header-scroll {
    display: none;
  }
  
  .navbar {
    padding: 0 24px 16px;
    border-radius: 10px;
  }

  
 .navbar-nav {
    gap: 20px;
 }

  .navbar-brand {
    margin-right: 0 !important;
  }

  .navbar .container {
    gap: 48px;
  }
  
  /* ===================== */
  /* ==== MENU PRINCIPAL == */
  /* ===================== */
  
 /* MENU PRINCIPAL */

.navbar-nav .nav-link {
    font-family: var(--font-heading);
    font-size: 16px;
    letter-spacing: 0.03em;
    color: var(--color-text-light) !important;
    position: relative;
    text-decoration: none;
    overflow: hidden;
    transition: color 0.3s ease;
  }
  
  /* UNDERLINE animado via ::before */
  .navbar-nav .nav-link::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0%;
    height: 2px;
    background-color: #FF3B91;
    transition: width 0.3s ease-in-out;
  }
  
  /* Hover ativa o underline */
  .navbar-nav .nav-item:hover > .nav-link::before {
    width: 100%;
  }
  
  /* SETINHA padrão Bootstrap */
  #menu-menu .dropdown .dropdown-toggle, #menu-menu-1 .dropdown .dropdown-toggle {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }

  #menu-menu-1 .dropdown .dropdown-toggle::after {
    color: #141414;
  }

  .navbar-nav .dropdown-toggle::after {
    margin-left: 0.4rem;
    vertical-align: middle;
    border-top: 0.35em solid var(--color-text-light);
    border-right: 0.35em solid transparent;
    border-left: 0.35em solid transparent;
    content: "";
    transition: border-top-color 0.3s ease;
  }
  
  /* Hover: muda cor da setinha */
  .navbar-nav .dropdown:hover > .dropdown-toggle::after {
    border-top-color: #FF3B91;
  }

  /* === Submenu (dropdown) === */

.navbar-nav .dropdown-menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  background-color: #FFFFFF;
  padding: 32px 28px 28px 28px;
  border-radius: 10px;
  min-width: 260px;
  z-index: 1000;
  box-shadow: 0px 2px 8px 2px #1414143D;
  max-height: 400px;
  overflow-y: auto;
  overflow-x: hidden;
  /* Para suavizar a rolagem */
  scrollbar-width: thin;
  scrollbar-color: var(--color-primary) #f0f0f0;
}

  /* Personalização para navegadores WebKit (Chrome, Edge, etc.) */
.navbar-nav .dropdown-menu::-webkit-scrollbar {
  width: 6px;
}

.navbar-nav .dropdown-menu::-webkit-scrollbar-thumb {
  background-color: var(--color-primary);
  border-radius: 3px;
}

.navbar-nav .dropdown-menu::-webkit-scrollbar-track {
  background: #f0f0f0;
}
  
/* Exibe submenu ao hover */
.navbar-nav .dropdown:hover > .dropdown-menu {
  display: block;
}

/* Estilo geral dos itens */
.navbar-nav .dropdown-menu li {
  margin-bottom: 24px;
}

/* Submenu padrão (não botão) */
.navbar-nav .dropdown-menu li:not(.menu-cta) a {
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 24px;
  letter-spacing: 0;
  color: #141414;
  text-decoration: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 0;
}

/* Ícone SVG à direita */
.navbar-nav .dropdown-menu li:not(.menu-cta) a::after {
  content: "";
  display: inline-block;
  width: 12px;
  height: 12px;
  background-image: url('../img/arrow-vert-1.svg'); /* AJUSTE O CAMINHO AQUI */
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* Botão final */
.navbar-nav .dropdown-menu .menu-cta {
  margin-top: 12px;
}

.navbar-nav .dropdown-menu .menu-cta a {
  display: block;
  background-color: #662B90;
  color: #FFFFFF !important;
  padding: 12px 20px;
  border-radius: 8px;
  font-family: var(--font-heading);
  font-size: 16px;
  letter-spacing: 0.03em;
  text-align: center;
  text-decoration: none;
  transition: all 0.3s ease;
}

.navbar-nav .dropdown-menu .menu-cta a:hover {
  background-color: #1A073D;
}

/* ========================= */
/* ====== BOTÕES HEADER ==== */
/* ========================= */

.btn-outline-info {
  color: var(--color-accent);
  border-color: var(--color-accent);
}

.btn-outline-info:hover {
  background-color: rgba(73, 191, 230, 0.15);
  color: var(--color-accent-secondary);
}
  
/* === Letreiro animado (ticker) === */
.ticker-bar {
    background-color: #FF3B91;
    padding: 12px 0;
    overflow: hidden;
    position: relative;
  }
  
  .ticker-wrapper {
    display: flex;
    white-space: nowrap;
  }
  
  .ticker-content {
    display: inline-flex;
    animation: scroll-left 20s linear infinite;
    gap: 64px;
    min-width: max-content;
  }
  
  /* Textos */
  .ticker-content span {
    font-family: 'Altissimo', sans-serif;
    font-weight: 700;
    font-size: 16px;
    line-height: 120%;
    letter-spacing: 0.03em;
    color: #141414;
  }
  
  /* Animação contínua (sem cortes) */
  @keyframes scroll-left {
    0% {
      transform: translateX(0%);
    }
    100% {
      transform: translateX(-50%);
    }
  }
  

/* Header Secundário */
.secondary-header {
  background-color: #FCFAFF !important;
  color: #141414 !important;
  position: relative;
  z-index: 1000;
}

.secondary-header .navbar-nav .nav-link {
  color: #141414 !important;
}

.secondary-header .btn-outline-info {
  color: #662B90;
  border-color: #662B90;
}

.secondary-header .btn-outline-info:hover {
  background-color: rgba(102, 43, 144, 0.15);
  color: #662B90;
}

.secondary-header .btn-secondary {
  background-color: #662B90;
  color: #F5F5F5 !important;
}

.secondary-header .btn-secondary:hover {
  background-color: #1A073D;
}

/* Header secundário quando fixado no scroll */
.secondary-header.scrolled {
  position: fixed;
  top: 48px;
  left: 0;
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  justify-self: anchor-center;
  border: 1px solid #E4E1EB;
  border-radius: 24px;
  padding: 20px 40px;
  backdrop-filter: blur(8px);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.05);
  transition: top 0.3s ease, padding 0.3s ease, background-color 0.3s ease, box-shadow 0.3s ease;
}

/* Header principal fixado que se transforma em secundário */
.site-header.fixed-secondary {
  background-color: #FCFAFF !important;
  color: #141414 !important;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1050;
  border: 1px solid #E4E1EB;
  border-radius: 24px;
  padding: 20px 40px;
  backdrop-filter: blur(8px);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.05);
}

/* Textos e botões atualizados após scroll */
.fixed-secondary .navbar-nav .nav-link {
  color: #141414 !important;
}

.fixed-secondary .btn-outline-info {
  color: #662B90 !important;
  border-color: #662B90;
}
.fixed-secondary .btn-outline-info:hover {
  background-color: rgba(102, 43, 144, 0.15);
}

.fixed-secondary .btn-secondary {
  background-color: #662B90;
  color: #F5F5F5 !important;
}

.header-tertiary {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding: 12px 0;
  z-index: 1000;
  box-shadow: none; /* opcional: sem sombra */
}

@media (max-width: 768px) {
  /* Header secundário quando fixado no scroll */
.secondary-header.scrolled {
  top: 0;
  border-radius: 0;
  }
}

  
/* ========================= */
  /* ====== HOME ==== */
  /* ========================= */

  /* === Hero === */

  .hero-onelearning {
    background: 
      linear-gradient(90deg, #1A073D 24%, rgba(59, 16, 81, 0.88) 100%),
      linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
      url('../img/bg-hero.jpg') no-repeat center center / cover;
    padding-top: 30px;
    position: relative;
    overflow: hidden;
  }
  
  
  .hero-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 48px;
  }
  
  .hero-content {
    flex: 1;
    max-width: 600px;
  }
  
  .hero-content h6 {
    font-family: 'Altissimo', sans-serif;
    font-size: 14px;
    font-weight: 700;
    color: #49BFE6;
    margin-bottom: 24px;
  }
  
  .hero-content h1 p {
    font-family: 'Altissimo', sans-serif;
    font-size: 48px;
    font-weight: 700;
    line-height: 120%;
    color: #F5F5F5;
    margin-bottom: 32px;
  }

  .hero-content h1 .highlight {
    color: #FFFFFF;
    background-color: #FF3B91;
    padding: 4px 8px;
    border-radius: 4px;
    display: inline-block;
  }
  
  .hero-content h4 {
    font-family: 'Roboto', sans-serif;
    font-size: 20px;
    color: #F5F5F5;
    margin-bottom: 48px;
  }
  
  .hero-image {
    flex: 1;
    max-width: 520px;
    animation: fadeInRight 1s ease-in-out forwards;
  }
  
  @keyframes fadeInRight {
    from {
      opacity: 0;
      transform: translateX(24px);
    }
    to {
      opacity: 1;
      transform: translateX(0);
    }
  }
  
  /* Botão primário padrão já está no seu CSS como .btn-general .btn-primary */
  
  /* Ícone de rolagem */
  .hero-scroll-indicator {
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    animation: bounce 2s infinite;
  }
  
  @keyframes bounce {
    0%, 100% {
      transform: translate(-50%, 0);
    }
    50% {
      transform: translate(-50%, 8px);
    }
  }
  
    /* === Vitrine === */

  /* Wrapper com fundo primário (embaixo da seção) */
  .cursos-bg-wrapper {
    position: relative;
    z-index: 1;
    background: 
      linear-gradient(90deg, #1A073D 24%, rgba(59, 16, 81, 0.88) 100%),
      linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, transparent 100%),
      #1A073D;
    position: relative;
    padding-bottom: 0px;
  }

  .cursos-bg-wrapper::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 200px; /* ajuste conforme necessário */
    background-color: #1A073D;
    z-index: 0;
  }
  

/* Seção com fundo claro e bordas arredondadas (exceto bottom-left) */
.cursos-categorias {
  background-color: #FCFAFF;
  border-top-left-radius: 240px;
  border-top-right-radius: 240px;
  border-bottom-right-radius: 240px;
  border-bottom-left-radius: 0;
  padding: 100px 0;
  position: relative;
  z-index: 2;
}
  
  .header-categorias {
    display: flex;
    position: relative;
    justify-content: space-between;
    align-items: flex-end;
    flex-wrap: wrap;
    margin-bottom: 40px;
    gap: 24px;
  }
  
  .header-categorias > .titulos {
    flex: 1 1 50%;
    min-width: 280px;
    gap: 24px;
    display: flex;
    flex-direction: column;

  }
  
  .header-categorias > .texto-direita {
    flex: 1 1 30%;
    min-width: 240px;
  }
  
  .header-categorias .titulos h6 {
    font-family: 'Altissimo', sans-serif;
    font-size: 18px;
    color: #FF3B91;
    font-weight: 700;
  }
  
  .header-categorias .titulos h1 p {
    font-family: 'Altissimo', sans-serif;
    font-size: 36px;
    color: #141414;
    line-height: 120%;
    margin-bottom: 0;
  }
  
  .header-categorias .titulos h1 .highlight {
    background-color: #FF3B91;
    color: #fff;
    padding: 0 6px;
    border-radius: 4px;
  }

  .swiper-slide {
    margin-right: 0 !important;
    width: auto !important;
  }
  
  .header-categorias .texto-direita p {
    font-family: 'Roboto', sans-serif;
    color: #3D3D3D;
    font-size: 16px;
    margin-bottom: 0px;
    max-width: 360px;
  }
  
  .header-categorias > .swiper-nav {
    position: relative;
    display: flex;
    gap: 30px;
    z-index: 10;
  }
  
  .swiper-button-prev,
  .swiper-button-next {
    width: 48px !important;
    height: 48px !important;
    border: 1px solid #7A7A7A !important;
    color: #7A7A7A !important;
    background: rgba(254, 255, 250, 0.08) !important;
    backdrop-filter: blur(40px) !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.3s ease !important;
    position: relative !important;
  }

  .swiper-button-prev::after,
  .swiper-button-next::after {
    font-size: 18px !important;
  }
  
  .swiper-button-prev:hover,
  .swiper-button-next:hover {
    background-color: #662B90 !important;
    color: #fff !important;
    border-color: #662B90 !important;
  }
  
  .categoriaSwiper .swiper-slide {
    width: 240px;
  }
  
  .card-categoria {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 440px;
    width: 300px;
    border-radius: 8px;
    padding: 16px;
    background-size: cover !important;
    background-position: center;
    text-decoration: none;
    position: relative;
    color: #fff;
    background: linear-gradient(180deg, rgba(59, 16, 81, 0) 0%, #3B1051 100%);
  }
  
  .card-categoria .tarja {
    background-color: #49BFE6;
    color: #141414;
    font-weight: bold;
    font-size: 14px;
    padding: 4px 8px;
    border-radius: 4px;
    position: absolute;
    top: 16px;
    left: 16px;
  }
  
  .card-categoria h5 {
    font-size: 18px;
    font-family: 'Altissimo', sans-serif;
    color: #fff;
    margin-top: auto;
  }

  /* Letreiro animado - segunda barra */
.second-ticker .ticker-content {
  animation: scroll-left 20s linear infinite;
  display: inline-flex;
  gap: 64px;
  min-width: max-content;
}

.second-ticker span {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  white-space: nowrap;
}

.second-ticker .highlight-number {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 60px;
  line-height: 140%;
  color: #C70058;
}

.second-ticker .highlight-text {
  font-family: 'Altissimo', sans-serif;
  font-weight: 300;
  font-size: 30px;
  line-height: 140%;
  letter-spacing: 0.03em;
  color: #141414;
}

/* Por padrão, esconder os bullets */
.categoriaSwiper .swiper-pagination {
    display: none;
}

/* Mostrar os bullets a partir de 768px */
@media (max-width: 768px) {

  .categoriaSwiper .swiper-pagination {
      display: flex;
      justify-content: center;
  }

  .swiper-nav {
      display: none !important;
  }

  .categoriaSwiper .swiper-wrapper {
    padding-bottom: 40px;
  }

  .categoriaSwiper .swiper-wrapper .card-categoria {
    max-height: 320px;
  }

  .second-ticker {
    margin-top: 40px !important;
  }

  .highlight-number {
    font-size: 40px !important;
  }

  .highlight-text {
    font-size: 18px !important;
  }
}


  /* === Planos e Preços === */
  
.planos-wrapper {
  background-color: #FCFAFF; /* Cor de fundo geral */
  position: relative;
}

.planos-precos {
  background-color: #1A073D;
  border-top-left-radius: 240px;
  border-bottom-right-radius: 240px;
  border-bottom-left-radius: 240px;
  padding: 100px 0;
}

.subtitulo-planos {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 26px;
  letter-spacing: 0.03em;
  text-align: center;
  color: #49BFE6;
  margin-bottom: 24px;
}

.titulo-planos p {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 48px;
  letter-spacing: 0.03em;
  text-align: center;
  color: #fff;
  margin-bottom: 64px;
}

.titulo-planos .highlight {
  background-color: #FF3B91;
  padding: 0 6px;
  border-radius: 4px;
  color: #fff;
}

.planos-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 48px;
  align-items: flex-start;
  justify-content: space-between;
}

.col-info {
  flex: 1 1 20%;
}

.info-complemento {
  font-family: Roboto;
  font-weight: 700;
  font-size: 16px;
  color: #F5F5F5;
  align-self: baseline;
}

.info-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-bottom: 24px;
}

.info-item p {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 28px;
  letter-spacing: 0%;
  color: #fff;
}

.planos-legenda p {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 20px;
  letter-spacing: 0%;
  color: #ccc;
}

.col-planos {
  flex: 1 1 60%;
  display: flex;
  flex-direction: row;
  gap: 32px;
}

/* === Card Base === */
.plano-card {
  border-radius: 12px;
  padding: 40px 60px;
  color: #fff;
  display: flex;
  gap: 24px;
  flex-direction: column;
  align-items: center;
  position: relative;
  background-color: rgba(26, 7, 61, 0.12);
  backdrop-filter: blur(8px);
}

.plano-destaque {
  border: 2px solid #FF3B91;
  backdrop-filter: blur(8px);
  flex: 50%;
}

.plano-simples {
  border: 1px solid #A3A3A3;
  flex: 50%;
  height: max-content;
}

.plano-card h5 {
  font-family: 'Altissimo', sans-serif;
  font-size: 24px;
  color: #CCCCCC;
  letter-spacing: 0.03em;
}

.parcelamento {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  text-align: left;
  border-bottom: 1px solid #3B1051;
  padding-bottom: 24px;
}

.parcelamento .parcelas {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 22px;
  line-height: 100%;
  letter-spacing: 0%;
  color: #fff;
}

.parcelamento .valor, .mensalidade {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 60px;
  line-height: 100%;
  letter-spacing: 0%;
  color: #fff;
}

.mensalidade {
  margin-bottom: 0;
  margin-top: 25px;
  border-bottom: 1px solid #3B1051;
  padding-bottom: 24px;
}

.lista-beneficios {
  list-style: none;
  padding: 0;
}

.lista-beneficios li {
  font-family: 'Roboto', sans-serif;
  font-size: 16px;
  margin-bottom: 12px;
  padding-left: 36px;
  position: relative;
}

/* Ícones por ordem */
.lista-beneficios li:nth-child(1)::before {
  content: '';
  background-image: url('../img/infinite.svg');
  background-size: 16px;
  width: 16px;
  height: 16px;
  position: absolute;
  left: 0;
  top: 4px;
  background-repeat: no-repeat;
}

.lista-beneficios li:nth-child(2)::before {
  content: '';
  background-image: url('../img/screen.svg');
  background-size: 16px;
  width: 16px;
  height: 16px;
  position: absolute;
  left: 0;
  top: 4px;
  background-repeat: no-repeat;
}

.lista-beneficios li:nth-child(3)::before {
  content: '';
  background-image: url('../img/sign.svg');
  background-size: 16px;
  width: 16px;
  height: 16px;
  position: absolute;
  left: 0;
  top: 4px;
  background-repeat: no-repeat;
}

/* Badge de destaque */
.plano-destaque .badge {
  position: absolute;
  top: -18px;
  left: 50%;
  transform: translateX(-50%);
  background-color: #FF3B91;
  padding: 8px 28px;
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 14px;
  color: #141414;
}

/* Botão dentro do card */
.plano-card .btn-primary {
  padding: 12px 24px;
  display: inline-block;
  font-weight: bold;
  background-color: #49BFE6;
  color: #141414;
  border-radius: 8px;
  transition: all 0.3s ease;
}

.plano-card .btn-primary:hover {
  background-color: #662B90;
  color: #fff;
}

.plano-card .legenda {
  font-size: 12px;
  color: #aaa;
  font-family: 'Roboto', sans-serif;
  line-height: 18px;
}

/* Ícone de selo giratório */
.plano-destaque::before {
  content: '';
  position: absolute;
  top: -40px;
  left: -40px;
  width: 100px;
  height: 100px;
  background-image: url('../img/Offer-Seal.svg'); /* ajuste o caminho se necessário */
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  z-index: 0; /* atrás do conteúdo do card */
  animation: girar-selo 20s linear infinite;
}

/* Animação de rotação */
@keyframes girar-selo {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

  /* === Destaques === */

/* === Seção Destaques === */
.secao-destaques {
  background-color: #FCFAFF;
  padding: 100px 0;
}

.destaques-header {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 32px;
  margin-bottom: 64px;
  align-items: flex-end;
}

.destaques-titulos {
  flex: 1 1 50%;
  min-width: 280px;
  max-width: 500px;
}

.destaques-titulos h6 {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 26px;
  letter-spacing: 0.03em;
  color: #FF3B91;
  margin-bottom: 16px;
}

.destaques-titulos h1 {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 48px;
  letter-spacing: 0.03em;
  color: #141414;
}

.destaques-descricao {
  flex: 1 1 40%;
  min-width: 260px;
  max-width: 500px;
}

.destaques-descricao p {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 28px;
  letter-spacing: 0%;
  color: #3D3D3D;
  margin: 0;
}

/* Tabs das categorias */
.destaques-tabs .nav-tabs {
  border: none;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 48px;
}

.destaques-tabs .nav-link {
  border-radius: 8px;
  background-color: #662B90;
  color: #F5F5F5;
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 100%;
  letter-spacing: 0.03em;
  padding: 15px 20px;
  border: none;
  transition: 0.3s ease;
}

.destaques-tabs .nav-link.active,
.destaques-tabs .nav-link:hover {
  background-color: #FF3B91;
  color: #fff;
}

/* === Cards de Curso - Destaques === */

.card-destaque {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 400px;
  padding: 24px;
  border-radius: 8px;
  color: #F5F5F5;
  text-decoration: none;
  background-size: cover;
  background-position: center;
  overflow: hidden;
  transition: all 0.3s ease;
}

/* Ícone no topo direito */
.card-destaque .card-icon {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 24px;
  height: 24px;
}

/* Título */
.card-destaque h5 {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 116%;
  letter-spacing: 0.03em;
  margin-top: auto;
  color: #F5F5F5;
}

/* Botão Saiba mais */
.card-destaque .card-btn {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 12px;
  line-height: 116%;
  letter-spacing: 0.03em;
  color: #F5F5F5;
  text-decoration: none;
  margin-top: 16px;
  display: inline-flex;
  align-items: center;
}

.card-destaque .card-btn:hover {
  color: #FF3B91;
}

.card-destaque:hover .card-btn {
  color: #FF3B91;
}

.cards-flex-container {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  justify-content: flex-start;
}

/* Garante 4 por linha no desktop, 2 no tablet, 1 no mobile */
.cards-flex-container .card-destaque {
  flex: 1 1 calc(25% - 18px); /* 4 por linha com gap */
  max-width: calc(25% - 18px);
}

@media (max-width: 991px) {
  .cards-flex-container .card-destaque {
    flex: 1 1 calc(50% - 12px); /* 2 por linha */
    max-width: calc(50% - 12px);
  }
}

@media (max-width: 575px) {
  .cards-flex-container .card-destaque {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.destaques-tabs {
  flex: 1;
  overflow: hidden;
}

.destaques-tabs .swiper-wrapper {
  display: flex;
  gap: 12px;
  margin-right: 10px;
  position: relative;
}

/* Gradiente sobreposto no final */
.destaques-tabs::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 20px; /* ajuste conforme necessário */
  height: 100%;
  pointer-events: none;
  background: linear-gradient(270deg, #FCFAFF 33.96%, rgba(252, 250, 255, 0.56) 55.79%, rgba(252, 250, 255, 0) 100%);
  z-index: 5;
}

.destaques-tabs .swiper-slide {
  width: auto !important;
  margin-right: 0 !important;
}

.destaques-tabs .nav-link {
  border-radius: 8px;
  background-color: #662B90;
  color: #F5F5F5;
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 100%;
  letter-spacing: 0.03em;
  padding: 15px 20px;
  border: none;
  transition: 0.3s ease;
  white-space: nowrap;
}

.destaques-tabs .nav-link.active,
.destaques-tabs .nav-link:hover {
  background-color: #FF3B91;
  color: #fff;
}

.destaques-tabs-wrapper {
  display: flex;
  align-items: center;
  gap: 10px;
  position: relative;
}

.tabs-button-next {
  background: rgba(254, 255, 250, 0.08);
  border: 1px solid #7A7A7A;
  border-radius: 8px;
  padding: 8px;
  cursor: pointer;
  transition: all 0.3s ease;
  backdrop-filter: blur(40px);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 0 !important;
}

.tabs-button-next:hover {
  background-color: #662B90;
  border-color: #662B90;
}

@media (max-width: 425px) {

  .tabs-button-next {
    display: none !important;
  }

  .cards-flex-container {
    flex-wrap: nowrap;
    overflow-x: auto;
  }

  .cards-flex-container .card-destaque {
    min-width: 100%;
  }

}

/* === Seção Trial === */
.secao-trial {
  background: linear-gradient(180deg, #E4E1EB 0%, #FCFAFF 100%);
  padding: 100px 0;
}

.trial-container {
  display: flex;
  flex-wrap: wrap;
  gap: 64px;
  align-items: flex-start;
  justify-content: space-between;
}

.trial-col-texto {
  flex: 1 1 50%;
  min-width: 300px;
  max-width: 520px;
}

.trial-col-texto h6 {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 26px;
  letter-spacing: 0.03em;
  color: #FF3B91;
  margin-bottom: 24px;
}

.trial-col-texto h1 p {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 48px;
  letter-spacing: 0.03em;
  color: #141414;
  margin-bottom: 34px;
}

.trial-col-texto .highlight {
  background-color: #FF3B91;
  color: #FCFAFF;
  padding: 0 6px;
  border-radius: 4px;
}

.trial-col-texto p {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 28px;
  letter-spacing: 0%;
  margin-bottom: 40px;
  max-width: 600px;
}

.trial-col-texto h4 {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 32px;
  letter-spacing: 0.03em;
  margin-bottom: 24px;
}

.trial-topicos {
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin-bottom: 40px;
}

.trial-topicos .topico {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 28px;
  letter-spacing: 0%;
  color: #141414;
  position: relative;
  padding-left: 36px;
}

.trial-topicos .topico::before {
  content: '';
  position: absolute;
  left: 0;
  top: 5px;
  width: 20px;
  height: 20px;
  background-image: url('../img/checkbox-planos.svg');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.trial-col-texto .btn-general {
  background-color: #662B90;
  color: #F5F5F5;
  padding: 16px 32px;
  border-radius: 8px;
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: 0.03em;
  transition: all 0.3s ease;
  text-decoration: none;
}

.trial-col-texto .btn-general:hover {
  background-color: #49BFE6;
  color: #fff;
}

/* Coluna de Cards */
.trial-cards-col {
  flex: 1 1 40%;
  display: flex;
  flex-direction: column;
  gap: 24px;
  max-width: 500px;
}

.trial-card {
  background-color: #FCFAFF;
  border: 1px solid #E4E1EB;
  border-radius: 8px;
  padding: 24px;
  display: flex;
  align-items: flex-start;
  gap: 28px;
}

.trial-card .icone {
  width: 40px;
  height: 40px;
  flex-shrink: 0;
}

.trial-card-content {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.trial-card-content .titulo {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 28px;
  letter-spacing: 0%;
  color: #141414;
}

.trial-card-content .texto {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: 0%;
  color: #3D3D3D;
}

/* === Wrapper da seção Conheça === */

.conheca-wrapper {
  background-color: #FCFAFF;
  position: relative;
}

/* Seção com fundo de imagem + gradiente */
.secao-conheca {
  background: 
    linear-gradient(181.96deg, rgba(102, 43, 144, 0.4) 12.74%, rgba(80, 30, 113, 0.7) 41.6%, rgba(68, 21, 94, 0.9) 66.47%, #3C1051 90.45%),
    url('../img/bg-conheca.png'); /* ajuste o caminho se necessário */
  background-size: cover;
  background-position: center;
  border-top-left-radius: 240px;
  border-top-right-radius: 240px;
  padding: 240px 0 80px;
  text-align: center;
  color: #F5F5F5;
}

/* Título principal */
.secao-conheca h1 p {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 48px;
  letter-spacing: 0.03em;
  margin-bottom: 24px;
  color: #FCFAFF;
}

.secao-conheca h1 .highlight {
  background-color: #FF3B91;
  padding: 0 6px;
  border-radius: 4px;
}

/* Subtítulo */
.secao-conheca h5 {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 28px;
  letter-spacing: 0.03em;
  margin-bottom: 40px;
}

/* Botão de play */
.conheca-play-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 84px;
  height: 84px;
  border-radius: 50%;
  border: 1px solid #F5F5F5;
  transition: all 0.4s ease;
  margin: 0 auto 12px;
}

.conheca-play-button img {
  width: 32px;
  height: 32px;
  transition: transform 0.6s ease, filter 0.3s ease;
  filter: brightness(0) saturate(100%) invert(72%) sepia(34%) saturate(406%) hue-rotate(151deg) brightness(100.03em) contrast(101%);
}

/* Hover animado */
.conheca-play-button:hover {
  background-color: #49BFE6;
  border-color: transparent;
}

.conheca-play-button:hover img {
  transform: rotateX(180deg);
  filter: brightness(0) saturate(100%) invert(100%); /* #F5F5F5 */
}

/* Texto abaixo do play */
.conheca-play-text {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.03em;
  color: #F5F5F5;
}

/* Corrige overlay fantasma no topo */
body > .fancybox-container:first-of-type {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 9999 !important;
  pointer-events: none;
  opacity: 0;
}

@media (max-width: 425px) {
  .secao-conheca .container {
    display: flex;
    flex-direction: column-reverse;
    gap: 20px;
  }

  .conheca-txt {
    display: flex;
    text-align: center;
    flex-direction: column;
  }
}
/* === Seção Universo === */

.secao-universo {
  background: linear-gradient(180deg, #3B1051 0%, #1A073D 100%);
  border-bottom-right-radius: 240px;
  position: relative;
  padding: 100px 0 0;
  overflow: hidden;
}

.secao-universo h6.universo-badge {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 26px;
  letter-spacing: 0.03em;
  text-align: center;
  color: #49BFE6;
  margin-bottom: 16px;
}

.secao-universo h1 p {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 48px;
  letter-spacing: 0.03em;
  text-align: center;
  color: #FFFFFF;
  margin-bottom: 64px;
}

.universo-title .highlight {
  background-color: #FF3B91;
  color: #FCFAFF;
  padding: 0 6px;
  border-radius: 4px;
}

/* Abas */
.universo-tabs-wrapper {
  margin-top: 40px;
}

.universo-tabs {
  border: none !important;
  gap: 12px;
  flex-wrap: wrap;
  padding: 20px;
  border-radius: 12px;
}

.universo-tabs .nav-link {
  border-radius: 8px;
  background-color: rgba(255, 255, 255, 0.08); /* cor translúcida */
  backdrop-filter: blur(40px);
  -webkit-backdrop-filter: blur(40px);
  border: 1px solid #FFFFFF !important;
  color: #FFFFFF;
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 100%;
  letter-spacing: 0.03em;
  padding: 15px 20px;
  transition: all 0.3s ease;
  white-space: nowrap;
}

.universo-tabs .nav-link.active,
.universo-tabs .nav-link:hover {
  background-color: #FFFFFF;
  color: #141414;
}

/* Conteúdo das abas */
.universo-tab-conteudo {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 130px; /* distância entre texto e imagem */
  padding: 80px 0px 0 100px;
  background: linear-gradient(180deg, #3B1051 0%, rgba(26, 7, 61, 0.8) 100%);
  backdrop-filter: blur(16px);
  border: 1px solid #3B1051;
  border-top-left-radius: 24px;
  border-top-right-radius: 24px;
  z-index: 2;
}

.universo-tab-conteudo .conteudo-texto {
  flex: 1 1 50%;
  min-width: 280px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
}

.universo-tab-badge {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 26px;
  letter-spacing: 0.03em;
  color: #FF3B91;
  margin-bottom: 12px;
}

.universo-tab-title p {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 32px;
  line-height: 40px;
  letter-spacing: 0.03em;
  margin-bottom: 24px;
  color: #FFFFFF;
}


.conteudo-texto .highlight {
  color: #FFFFFF;
  background-color: #FF3B91;
  padding: 4px 8px;
  border-radius: 4px;
  display: inline-block;
}

.universo-tab-texto p {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 26px;
  letter-spacing: 0%;
  margin-bottom: 32px;
  color: #F5F5F5;
}

.universo-tab-conteudo .btn-general {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.03em;
  padding: 12px 24px;
  border-radius: 8px;
  transition: all 0.3s ease;
  text-decoration: none;
  display: inline-block;
}

.universo-tab-conteudo .btn-primary {
  background-color: #49BFE6;
  color: #141414;
}

.universo-tab-conteudo .btn-primary:hover {
  background-color: #662B90;
  color: #fff;
}

.universo-tab-conteudo .btn-tertiary {
  background-color: rgba(6, 6, 10, 0.08);
  color: #49BFE6;
  border: 1px solid #49BFE6;
}

.universo-tab-conteudo .btn-tertiary:hover {
  background-color: rgba(73, 191, 230, 0.15);
  color: #49BFE6;
}

.universo-tab-conteudo .conteudo-imagem {
  flex: 1 1 40%;
  max-height: 580px;
}

.universo-tab-conteudo .conteudo-imagem img {
  width: 100%;
  height: auto;
  max-height: 580px;
  border-top-left-radius: 24px;
  object-fit: cover;
}


/* Decorativos */
.secao-universo .decor, .secao-instituicoes .decor{
  position: absolute;
  z-index: 0;
  width: auto;
  height: auto;
}

.decor-top-left {
  top: 0;
  left: 0;
}

.decor-top-right {
  top: 40px;
  right: 0;
}

.decor-bottom-left {
  bottom: 0;
  left: 12%;
}

.decor-bottom-right {
  bottom: 0;
  right: 0;
}

@media (max-width: 425px) {
  .universo-tabs-wrapper {
    padding: 40px 20px;
    margin-top: 0 !important;
  }

  .universo-title p {
    margin-bottom: 0 !important;
  }
 
}

/* === Seção Depoimentos === */
.secao-depoimentos {
  background: #FCFAFF;
  border-top-left-radius: 240px;
  padding: 100px 0;
}

.depoimentos-badge {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: 0.03em;
  color: #C70058;
  margin-bottom: 16px;
}

.depoimentos-title p {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 48px;
  letter-spacing: 0.03em;
  color: #141414;
  margin-bottom: 0;
}

.depoimentos-title .highlight {
  color: #FFFFFF;
  background-color: #FF3B91;
  padding: 4px 8px;
  border-radius: 4px;
  display: inline-block;
}

/* === Swiper === */
.depoimentosSwiper {
  margin-top: 64px;
}

.swiper-slide {
  height: 100%;
}

/* === Card Base === */
.card-depoimento {
  border-radius: 8px;
  padding: 40px 48px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  position: relative;
  background-size: cover;
  background-position: center;
  width: 400px;
}

/* === Card de Vídeo === */
.card-video {
  background-color: rgba(26, 7, 61, 0.64);
  background-blend-mode: overlay;
  color: #F5F5F5;
}

.icone-play {
  width: 100px;
  height: 100px;
  border: 1.25px solid #F5F5F5;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
  cursor: pointer;
  transition: all 0.3s ease;
}

.icone-play:hover {
  background-color: #49BFE6;
  border-color: transparent;
}

.icone-play:hover img {
  filter: brightness(0) invert(1);
  transform: rotate(360deg);
  transition: transform 0.4s ease;
}

.icone-play img {
  width: 32px;
  height: 32px;
  transition: transform 0.4s ease;
}

/* === Card de Texto === */
.card-texto {
  background: linear-gradient(164.97deg, #FCFAFF 46.34%, #E4E1EB 99.98%);
  color: #3D3D3D;
}

.icone-citacao img {
  width: 24px;
  height: 24px;
  margin-bottom: 24px;
}

.depoimento-texto {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 28px;
  color: #141414;
  margin-bottom: 32px;
}

/* === Autor (foto, nome, profissão) === */
.autor {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: auto;
}

.autor .foto {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 2px solid #FF3B91;
  object-fit: cover;
}

.autor .info .nome {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 140%;
  color: #F5F5F5;
}

.card-texto .autor .info .nome {
  color: #141414;
}

.autor .info .profissao {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 20px;
  color: #CCCCCC;
}

.card-texto .autor .info .profissao {
  color: #3D3D3D;
}

/* === Swiper Ajustado === */
.depoimentosSwiper {
  margin-top: 64px;
}

.swiper-wrapper {
  gap: 24px; /* garantido via JS com spaceBetween, mas mantido aqui se necessário */
}

/* === Navegação e Paginação Posicionados === */

.depoimentosSwiper .swiper-pagination {
  display: flex !important;
  justify-content: flex-start !important;
  align-items: center;
  flex: 1;
}

.depoimentosSwiper .depoimentos-nav {
  display: flex;
  justify-content: flex-end;
  gap: 32px;
  flex: 1;
}

/* === Bullets === */
.swiper-pagination-bullet {
  background: #CCCCCC !important;
  opacity: 1;
  margin: 0 4px !important;
}

.swiper-pagination-bullet-active {
  background: #FF3B91 !important;
}

/* === Setas de Navegação === */
.swiper-button-prev,
.swiper-button-next {
  width: 40px;
  height: 40px;
  background: #1A073D;
  border-radius: 8px;
  color: #fff;
  font-size: 20px;
  transition: all 0.3s ease;
}

.swiper-button-prev:hover,
.swiper-button-next:hover {
  background-color: #49BFE6;
}


/* === Lightbox Vídeo === */
.lightbox-video {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0,0,0,0.8);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
}

.lightbox-video .overlay {
  position: absolute;
  width: 100%;
  height: 100%;
}

.lightbox-video .video-wrapper {
  position: relative;
  width: 90%;
  max-width: 960px;
  z-index: 10000;
}

.lightbox-video iframe {
  width: 100%;
  height: 540px;
  border-radius: 8px;
}

.lightbox-video .close {
  position: absolute;
  top: -40px;
  right: -10px;
  font-size: 36px;
  color: #fff;
  background: none;
  border: none;
  cursor: pointer;
}

@media (max-width: 768px) {
  .card-depoimento {
    padding: 30px;
  }

  .depoimentos-nav {
    display: none !important;
  }

  .depoimentosSwiper .depoimentos-pagination {
    width: auto;
    display: flex !important;
    justify-content: center !important;
    border: 8px;
    position: relative;
  }
}

/* === Seção Blog === */
.secao-blog {
  background-color: #E4E1EB;
  padding: 100px 0;
}

.blog-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  flex-wrap: wrap;
  gap: 24px;
  margin-bottom: 64px;
}

.blog-header .titulos {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.blog-header h6 {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 32px;
  letter-spacing: 0.03em;
  color: #C70058;
  margin: 0;
}

.blog-header h1 {
  margin-bottom: 0;
}

.blog-header h1 p {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 48px;
  letter-spacing: 0.03em;
  color: #141414 !important;
  margin: 0;
}

.btn-blog {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: 0.03em;
  color: #662B90;
  border: 1px solid #662B90;
  padding: 12px 24px;
  border-radius: 8px;
  background: transparent;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: all 0.3s ease;
  text-decoration: none;
  position: relative;
}

.btn-blog::after {
  content: "→";
  font-size: 18px;
  transition: transform 0.3s ease;
  display: inline-block;
}

.btn-blog:hover {
  background-color: #662B90;
  color: #fff;
}

.btn-blog:hover::after {
  transform: translateX(4px);
}

.blog-cards {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
}

.card-blog {
  border-radius: 8px;
  background-size: cover;
  background-position: center;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  height: 380px;
  color: #fff;
  padding: 24px;
  text-decoration: none;
  background-image: linear-gradient(180deg, rgba(26, 7, 61, 0) 24%, #1A073D 92%);
  background-blend-mode: multiply;
  transition: ease-in-out .3s;
}

.card-blog:hover, .card-destaque:hover, .card-categoria:hover {
  box-shadow: 0 12px 24px rgba(26, 7, 61, 0.35);
}

.card-blog,
.card-destaque,
.card-categoria {
  transition: box-shadow 0.3s ease, transform 0.3s ease;
}

.card-blog-content {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.card-blog-content .titulo {
  font-family: 'Altissimo', sans-serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 130%;
}

.card-blog-content .meta {
  display: flex;
  gap: 24px;
  align-items: center;
  font-family: 'Roboto', sans-serif;
  font-size: 14px;
  line-height: 20px;
  color: #F5F5F5;
}

.card-blog-content .meta img {
  width: 16px;
  height: 16px;
  object-fit: contain;
  margin-right: 6px;
}

.card-blog.card-blog-maior {
  flex: 1 1 calc(40% - 12px);
}

.card-blog.card-blog-menor {
  flex: 1 1 calc(25% - 12px);
}

.botao-blog-mobile {
  display: none;
}

@media (max-width: 991px) {
  .card-blog.card-blog-maior,
  .card-blog.card-blog-menor {
    flex: 1 1 100%;
  }

  .blog-header {
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 40px;
  }

  .blog-cards {
    flex-direction: column;
  }

  .card-blog.card-blog-maior {
    min-height: 480px;
  }

  .card-blog.card-blog-menor {
    min-height: 240px;
  }

  .botao-blog-desktop {
    display: none;
  }

  .botao-blog-mobile {
    display: block;
    margin-top: 48px;
    width: 100%;
  }
}

/* ========================= */
  /* ====== Fale Conosco ==== */
  /* ========================= */

.secao-fale-conosco {
  display: flex;
  justify-content: center;
  background: 
  linear-gradient(90deg, rgba(59, 16, 81, 0.5) 0%, #1A073D 76%),
  linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
  linear-gradient(to top, 
      #1A073D 0px, 
      #1A073D 80px, 
      rgba(26, 7, 61, 0) 160px
    ),
  url('../img/bg-form.jpg') no-repeat center top;
  background-size: cover;
}

.fale-wrapper .container {
  display: flex;
  flex-direction: row;
  gap: 80px;
  align-items: flex-start;
}

.fale-col-texto {
  flex: 1 1 45%;
  color: #FCFAFF;
  padding: 80px 0;
}

.fale-badge {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 26px;
  letter-spacing: 0.03em;
  color: #49BFE6;
  margin-bottom: 24px;
}

.fale-title p {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 48px;
  letter-spacing: 0.03em;
  color: #FCFAFF;
  margin-bottom: 40px;
}

.fale-desc {
  font-family: 'Roboto', sans-serif;
  font-size: 18px;
  line-height: 28px;
  color: #F5F5F5;
  max-width: 540px;
}

.fale-form-col {
  flex: 1 1 50%;
  background: linear-gradient(287.96deg, rgba(26, 7, 61, 0.92) 0%, rgba(26, 7, 61, 0) 110.74%);
  padding: 80px 100px;
  border-radius: 12px;
}

.fale-form-col form {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.fale-form-col input,
.fale-form-col textarea {
  font-family: 'Roboto', sans-serif;
  font-size: 16px;
  padding: 15px;
  border: 1px solid #A3A3A3;
  border-radius: 8px;
  background-color: transparent;
  color: #A3A3A3;
}

.fale-form-col textarea {
  resize: none;
}

.fale-form-col .btn-general.btn-primary {
  padding: 16px;
  font-size: 16px;
  border: none;
  width: fit-content;
}

.form-privacidade {
  font-size: 12px;
  color: #ccc;
  font-family: 'Roboto', sans-serif;
  line-height: 18px;
}

.form-privacidade a {
  color: #49BFE6;
  text-decoration: underline;
}

/* === Seção Instituições de Referência === */
.secao-instituicoes {
  background-color: #FCFAFF;
  border-top-left-radius: 240px;
  border-top-right-radius: 240px;
  padding: 100px 0;
}

.instituicoes-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 24px;
  flex-wrap: wrap;
}

.instituicoes-col-texto {
  flex: 1 1 55%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 24px;
}

.instituicoes-badge {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 26px;
  letter-spacing: 0.03em;
  color: #C70058;
}

.instituicoes-title p {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 48px;
  letter-spacing: 0.03em;
  color: #141414;
}

.instituicoes-descricao {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 28px;
  color: #3D3D3D;
  max-width: 600px;
}

.instituicoes-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px 40px;
  margin-top: 40px;
}

.item-instituicao h3 {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 32px;
  line-height: 40px;
  letter-spacing: 0.03em;
  color: #C70058;
  margin-bottom: 16px;
}

.item-instituicao p {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: #3D3D3D;
}

.instituicoes-col-imagem {
  flex: 1 1 40%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.instituicoes-col-imagem img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* Responsivo */
@media (max-width: 991px) {
  .instituicoes-wrapper {
    flex-direction: column;
  }

  .instituicoes-grid {
    grid-template-columns: 1fr;
  }

  .instituicoes-col-texto,
  .instituicoes-col-imagem {
    flex: 1 1 100%;
  }

  .instituicoes-title {
    font-size: 32px;
    line-height: 40px;
  }
}

/* ========================= */
  /* ====== Política de privacidade ==== */
  /* ========================= */

.secao-politica-privacidade {
  background-color: #FCFAFF;
  padding: 100px 0;
}

.politica-wrapper {
  display: flex;
  gap: 80px;
  flex-wrap: wrap;
}

.politica-col-esquerda {
  flex: 1 1 30%;
}

.politica-titulo {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 48px;
  letter-spacing: 0.03em;
  color: #3D3D3D;
  margin-bottom: 16px;
}

.politica-data {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: #7A7A7A;
}

.politica-col-direita {
  flex: 1 1 60%;
}

.politica-intro {
  font-family: 'Roboto', sans-serif;
  font-size: 18px;
  line-height: 26px;
  color: #141414;
  margin-bottom: 40px;
}

/* === Accordion === */
.politica-accordion .accordion-item {
  background-color: #E4E1EB;
  border-radius: 8px;
  margin-bottom: 16px;
  overflow: hidden;
  transition: all 0.3s ease;
}

.accordion-header {
  padding: 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 140%;
  color: #141414;
  background: none;
  border: none;
  width: 100%;
  text-align: left;
}

.accordion-icon {
  font-size: 20px;
  transition: transform 0.3s ease;
}

.accordion-body {
  padding: 0 24px;
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: #3D3D3D;
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transition: max-height 0.4s ease, opacity 0.4s ease, padding 0.4s ease;
}

.accordion-item.open .accordion-body {
  padding: 24px;
  max-height: 800px;
  opacity: 1;
}

.accordion-item.open .accordion-header {
  border-bottom: 1px solid #FCFAFF;
}

.accordion-item.open .accordion-icon {
  transform: rotate(180deg);
}

/* Texto final */
.politica-final {
  margin-top: 40px;
  font-family: 'Roboto', sans-serif;
  font-size: 16px;
  line-height: 24px;
  color: #141414;
}

/* ========================= */
  /* ====== Assinatura (ver página para css complementar) ==== */
  /* ========================= */

  /* === Seção Assinatura Geral === */

.assinatura-planos {
  background-color: #FCFAFF;
  border-top-left-radius: 240px;
  border-bottom-right-radius: 240px;
  border-bottom-left-radius: 240px;
}
.assinatura-planos .wrapper-assinatura{
  display: flex;
  flex-direction: column;
  padding: 120px 0 64px 0;
  gap: 64px;
}

/* === Slider Assinatura === */
.assinaturaSwiper {
    width: 100%;
}

.assinaturaSwiper .swiper-wrapper {
    display: flex;
}

.assinaturaSwiper .swiper-slide {
    flex-shrink: 0;
    max-width: 300px;
    height: auto;
}


/* === Card padrão da assinatura === */
.assinatura-card {
  background-color: #FCFAFF;
  border: 1px solid #E4E1EB;
  border-radius: 8px;
  padding: 24px;
  display: flex;
  align-items: flex-start;
  gap: 28px;
  flex-direction: column;
  height: 100%;
}

.assinatura-card .icone {
  width: 40px;
  height: 40px;
  flex-shrink: 0;
}

.assinatura-card .trial-card-content {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.assinatura-card .titulo {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 28px;
  color: #141414;
}

.assinatura-card .texto {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: #3D3D3D;
}

/* === Bloco Sobreposição === */


.container-sobreposicao {
  height: 280px;
  padding: 100px;
  background:
    linear-gradient(0deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    linear-gradient(180deg, rgba(26, 7, 61, 0) 0%, #3B1051 85%),
    url('../img/bloco-img.jpg');
  /* ajuste o caminho se necessário */
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  border-radius: 8px;
}

.chamada-sobreposicao {
  color: #fff;
  font-weight: 700;
  font-size: 40px;
  letter-spacing: 0.03em;
  margin: 0;
  text-align: left;
}

/* === Cards Sobrepostos === */
.cards-sobreposicao {
  padding: 0 100px;
  margin-top: -150px;
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: row;
  gap: 24px;
}

.cards-sobreposicao .trial-card {
  background-color: #FCFAFF;
  border: 1px solid #E4E1EB;
  border-radius: 8px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  height: auto;
  flex: 1;
}

.cards-sobreposicao .icone {
  width: 40px;
  height: 40px;
}

.cards-sobreposicao .titulo {
  font-size: 20px;
  color: #141414;
}

.cards-sobreposicao .texto {
  font-size: 16px;
  color: #3D3D3D;
}

.cta-sobreposicao {
  font-weight: 700;
}

/* === Seção Comparativo === */

.comparativo-wrapper {
  padding: 100px 0;
}

.comparativo-content {
  background: linear-gradient(180deg, #1A073D 0%, #19073D 50%);
  border-bottom-right-radius: 240px;
  padding: 60px 40px;
  max-width: 1200px;
  margin: 0 auto;
  color: #F5F5F5;
}

.comparativo-badge {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 26px;
  letter-spacing: 0.03em;
  text-align: center;
  color: #FF3B91;
  display: block;
  margin-bottom: 16px;
}

.comparativo-title {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 48px;
  letter-spacing: 0.03em;
  text-align: center;
  color: #F5F5F5;
  margin-bottom: 48px;
}

.comparativo-tabela-linhas {
  display: flex;
  flex-direction: column;
  border: 2px solid #3B1051;
  border-radius: 16px;
  overflow: auto;
  font-family: 'Altissimo', sans-serif;
}

.linha-cabecalho,
.linha-beneficio,
.linha-preco {
  display: flex;
}

.coluna {
  flex: 1;
  padding: 24px;
  text-align: center;
}

.linha-cabecalho {
display: flex;
border-bottom: 1px solid #3B1051;
}

.linha-cabecalho .coluna {
  font-weight: 700;
  font-size: 24px;
  line-height: 32px;
  letter-spacing: 0.03em;
  text-align: center;
  color: #F5F5F5;
}

.coluna.beneficio-title {
  color: #FF3B91;
  font-weight: 700;
  font-size: 20px;
  line-height: 28px;
  letter-spacing: 0.03em;
}

.coluna.beneficio {
  text-align: left;
  color: #F5F5F5;
  font-size: 16px;
}

.plano.avulso {
  background-color: #3B1051;
}

.plano.anual {
  background-color: #3B1051;
}

.avulso, .mensal, .anual {
  padding: 24px 8px;
}

.linha-preco .coluna {
  border-top: 1px solid #3B1051;
}

.linha-preco .btn-comparativo {
  margin-top: 12px;
  width: 100%;
}

.parcela-prefixo {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 26px;
  letter-spacing: 0.03em;
  vertical-align: middle;
}

.parcela-valor {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 36px;
  line-height: 44px;
  letter-spacing: 0.03em;
  vertical-align: middle;
  display: inline-block;
  margin-left: 4px;
}


/* === Página 404 === */
.pagina-404 {
  background-color: #FCFAFF;
  padding: 100px 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.container-404 {
  display: flex;
  flex-direction: row;
  gap: 40px;
  max-width: 1200px;
  width: 100%;
  padding: 0 24px;
  align-items: center;
  justify-content: space-between;
}

.imagem-404 img {
  max-width: 100%;
  height: auto;
  display: block;
}

.conteudo-404 {
  display: flex;
  flex-direction: column;
  gap: 24px;
  max-width: 540px;
}

.conteudo-404 h1 {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 48px;
  letter-spacing: 0.03em;
  color: #141414;
}

.conteudo-404 p {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 26px;
  letter-spacing: 0%;
  color: #3D3D3D;
}

.botoes-404 {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: 16px;
}

.btn-primary-404 {
  background-color: #662B90;
  color: #F5F5F5;
  padding: 12px 24px;
  border-radius: 8px;
  font-weight: 600;
  text-decoration: none;
  border: none;
  transition: background 0.3s;
}

.btn-primary-404:hover {
  background-color: #551f79;
}

.btn-tertiary-404 {
  border: 2px solid #662B90;
  color: #662B90;
  background-color: transparent;
  padding: 12px 24px;
  border-radius: 8px;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.3s;
}

.btn-tertiary-404:hover {
  background-color: #f3ebfa;
}

.secao-blog-relacionado {
  background: linear-gradient(180deg, #FFFFFF 0%, #FCFAFF 100%);
  border-top: 1px solid #E4E1EB;
  padding: 100px 0;
}

.blog-badge {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 26px;
  letter-spacing: 0.03em;
  color: #FF3B91;
  margin-bottom: 8px;
}

.blog-title {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 48px;
  letter-spacing: 0.03em;
  color: #141414;
  margin-bottom: 48px;
}

.blog-cards {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 32px;
}

.blog-card {
  max-width: 340px;
  border-radius: 12px;
  overflow: hidden;
  text-align: left;
  transition: box-shadow 0.3s ease;
}

.blog-card:hover {
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
}

.blog-card-link {
  display: block;
  color: inherit;
  text-decoration: none;
}

.blog-card-thumb img {
  width: 100%;
  height: auto;
  display: block;
}

.blog-card-content {
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.blog-card-cat {
  font-size: 14px;
  font-weight: 500;
  color: #7B7B7B;
  display: inline-block;
}

.blog-card-title {
  font-size: 16px;
  font-weight: 700;
  color: #141414;
  line-height: 1.4;
}

.blog-card-meta {
  font-size: 14px;
  color: #7B7B7B;
  display: flex;
  gap: 16px;
  align-items: center;
}

.blog-card-meta span {
  display: flex;
  gap: 8px;
  align-items: center;
}

.blog-card-meta img {
  width: 16px;
  height: 16px;
  margin-right: 4px;
  vertical-align: middle;
}


/* ========================= */
  /* ====== Blog (ver página para css complementar) ==== */
  /* ========================= */

  /* === TOPO === */
  .blog-topo {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin: 40px 0 40px;
}

.blog-topo .btn-voltar {
    color: #662B90;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
    background: transparent;
    backdrop-filter: blur(40px);
    padding: 8px 16px;
    border-radius: 8px;
    border: 1px solid transparent;
    transition: all ease-in-out .3s;
    width: auto;
}

.blog-topo .btn-voltar:hover {
    background: rgba(102, 43, 144, 0.1);
}

.blog-topo .logo-central {
    max-width: 180px;
    height: auto;
}

.blog-topo .btn-terciary.btn-general {
    display: flex;
    align-items: center;
    gap: 8px;
    background: transparent;
    border: 1px solid #662B90;
    color: #662B90;
    padding: 12px 46px;
    border-radius: 8px;
    font-weight: 700;
    text-decoration: none;
    width: fit-content;
    text-align: center;
}

.blog-topo .btn-terciary.btn-general:hover {
    background: rgba(102, 43, 144, 0.1);
}

/* === TÍTULO === */
.blog-titulo {
  text-align: left;
  margin-bottom: 48px;
}

.blog-titulo h1 {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 48px;
  letter-spacing: 0.03em;
  color: #141414;
}

/* === DESTAQUES === */
.blog-destaques {
  display: flex;
  gap: 32px;
  margin-bottom: 64px;
  align-items: stretch;
}

/* Coluna da esquerda */
.blog-destaques .coluna-destaque {
  flex: 55%;
  display: flex;
  flex-direction: column;
  justify-content: stretch;
}

/* Coluna da direita */
.blog-destaques .coluna-secundaria {
  flex: 45%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  /* distribuir igualmente */
  gap: 16px;
}

/* Card maior (post destaque) */
.blog-destaques .card-blog {
  height: 100%;
  min-height: 500px;
  background-size: cover;
  background-position: center;
  border-radius: 8px;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
  text-decoration: none;
  transition: transform 0.3s ease;
  transition: box-shadow 0.3s ease;

}

.card-blog-maior .card-blog-content {
  color: #fff;
}

.card-blog-maior .titulo {
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 16px;
}

/* === Cards menores (coluna à direita) === */
.blog-card {
  display: flex;
  flex: 1;
  max-width: unset;
  /* cada card ocupa 1/3 da coluna */
  background: #fff;
  border-radius: 8px;
  overflow: hidden;
  text-decoration: none;
  transition: box-shadow 0.3s ease;
}

.blog-card:hover {
  box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.08);
}

.blog-card-link {
  display: flex;
  gap: 16px;
  color: #141414;
  width: 100%;
}

.blog-card-thumb {
  flex-shrink: 0;
  width: 240px;
  height: 100%;
  border-radius: 12px;
  overflow: hidden;
  transition: ease-in-out .3s;
}

.blog-card:hover .blog-card-thumb {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.blog-card-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Conteúdo dos cards menores */
.blog-card-content {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
}

.blog-card-cat {
  font-size: 12px;
  font-weight: 600;
  color: #7B7B7B;
  text-transform: uppercase;
}

.blog-card-title {
  font-size: 16px;
  font-weight: 700;
  margin: 0;
  color: #141414;
  line-height: 1.3;
}

.blog-card-meta {
  display: flex;
  gap: 12px;
  font-size: 13px;
  color: #7B7B7B;
}

.blog-card-meta img {
  width: 16px;
  height: 16px;
  margin-right: 4px;
}

.web-stories-wrapper {
  background-color: #FCFAFF;
}

.web-stories-container {
  background-color: #1A073D;
  border-top-left-radius: 240px;
  border-top-right-radius: 240px;
  border-bottom-right-radius: 240px;
  padding: 80px 0;
}

.web-stories-title {
  font-family: 'Altissimo', sans-serif;
  font-weight: 700;
  font-size: 32px;
  line-height: 40px;
  color: #F5F5F5;
  margin-bottom: 40px;
}

.web-stories-grid {
  display: flex;
  overflow-x: auto;
  gap: 32px;
  padding-bottom: 16px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  /* Firefox */
}

.web-stories-grid.active .story-card {
  transform: scale(1.02);
  transition: transform 0.3s ease;
}

.web-stories-grid::-webkit-scrollbar {
  display: none;
  /* Chrome, Safari e Edge */
}

.story-card {
  background: linear-gradient(180deg, rgba(26, 7, 61, 0.12) 0%, rgba(26, 7, 61, 0.92) 80%);
  border-radius: 8px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 400px;

  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;

  flex: 0 0 240px;
  scroll-snap-align: start;
  user-select: none;
  /* Impede seleção ao arrastar */
  cursor: grab;
  transition: transform 0.3s ease;
}

.story-card-content {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 24px;
}

.badge-story {
  font-size: 14px;
  color: #49BFE6;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.story-title {
  font-size: 20px;
  font-weight: 700;
  color: #F5F5F5;
  margin: 0;
}

/* Grid de posts */
.blog-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 24px;
}

.blog-noticias {
  flex-direction: column;
  padding-bottom: 24px;
}

.blog-noticias .blog-card-thumb {
  max-height: 220px;
  width: 100%;
  transition: ease-in-out .3s;
}

.blog-noticias:hover .blog-card-thumb {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.blog-load-more-wrapper {
  text-align: center;
  margin-top: 48px;
}

.btn-load-more {
  background: transparent;
  border: 1px solid #662B90;
  color: #662B90;
  padding: 12px 36px;
  font-weight: 700;
  font-size: 16px;
  border-radius: 50px;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  transition: all 0.3s ease;
}

.btn-load-more:hover {
  background: #662B90;
  color: #F5F5F5;
  border: none;
}

.plus-icon {
  display: inline-block;
  transition: transform 0.6s ease;
}

.rotate {
  transform: rotate(360deg);
}

 .hero-mentoria, .hero-futuro-certo {
    padding-top: 120px;
    background: linear-gradient(10deg, #1A073D 24%, rgba(59, 16, 81, 0.88) 100%), linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), url(../img/bg-hero.jpg) no-repeat center center / cover;
}

/* Remove o comportamento padrão de colapso até 1024px */
/* Colapsa por padrão */
.navbar-expand-1024 .navbar-collapse {
  display: none;
}

.navbar-expand-1024 .navbar-toggler {
  display: block;
}

/* A partir de 1025px, expande */
@media (min-width: 1025px) {
  .navbar-expand-1024 .navbar-collapse {
    display: flex !important;
  }

  .navbar-expand-1024 .navbar-toggler {
    display: none;
  }
}

 @media (max-width: 1440px) {
  
  .cursos-categorias, .web-stories-container {
    border-bottom-right-radius: 48px;
    border-top-left-radius: 48px;
    border-top-right-radius: 48px;
  }

  .planos-precos {
    border-bottom-left-radius: 48px;
    border-bottom-right-radius: 48px;
    border-top-left-radius: 48px;
  }

  .secao-conheca {
    border-top-left-radius: 48px;
    border-top-right-radius: 48px;
  }

  .secao-universo {
    border-bottom-right-radius: 48px;
  }

  .secao-depoimentos {
    border-top-left-radius: 48px;
  }

  .universo-tab-conteudo .conteudo-texto {
    padding-bottom: 40px;
  }

}

@media (max-width: 768px) {

  .hero-onelearning {
    padding: 40px 20px;
  }

  .hero-content {
    padding: 32px 0;
  }

  .hero-wrapper {
    flex-direction: column !important;
    align-items: flex-start;

  }

  .hero-image {
    display: none !important;
  }

  .hero-scroll-indicator {
    padding: 50px 0 0;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  h1 p, h1 {
    font-size: 32px !important;
  }

  
  .decor {
    max-width: 48px;
  }

  .secao-destaques, .planos-precos, .secao-trial, 
  .secao-conheca, .secao-universo, .secao-depoimentos, 
  .secao-blog, .faq-footer, .cursos-categorias, 
  .hero-onelearning, header {
    padding: 40px 0;
  }

  .universo-tab-conteudo {
    flex-direction: column-reverse;
    gap: 24px;
    padding: 0;
  }

  .universo-tab-conteudo .conteudo-texto {
    padding: 20px;
  }

  .conteudo-imagem {
    width: 100%;
  }

  .conteudo-imagem img {
    border-radius: 24px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    max-height: 240px !important;
  }

  .parcelamento .valor, .mensalidade {
    font-size: 32px;
  }

  .planos-grid {
    flex-direction: column;
  }

  .plano-card {
    padding: 40px 20px;
  }

  .info-item {
    margin-bottom: 0;
  }

  .tabs-btns {
    width: 100%;
  }
  
  .tabs-btns a {
    width: 100%;
  }

}

@media (max-width: 425px) {
  .btn-general, .btn-blog {
    width: 100%;
    display: flex !important;
    align-items: center;
    justify-content: center;
  }

  .col-planos {
    flex-direction: column;
  }

  .secao-destaques, .planos-precos, .secao-trial, 
  .secao-conheca, .secao-depoimentos, 
  .secao-blog, .faq-footer, .cursos-categorias, 
  .hero-onelearning, header {
    padding: 40px 20px;
  }

  .secao-universo {
    padding: 40px 0;
  }

  .card-blog-content {
    padding: 0 !important;
  }

  .tabs-btns {
    flex-direction: column;
  }

  .coluna-secundaria .blog-card .blog-card-link {
    border-bottom: 1px solid #662B90;
  }

  .pagina-404 {
    padding: 40px 0;
  }

  .container-404 {
    flex-direction: column;
  }

  .conteudo-404 {
    padding: 20px;
  }
}

@media (max-width: 991px) {
  .navbar-nav .dropdown-menu {
    display: none;
    position: static;
    background-color: #fff;
    padding: 20px;
    margin-top: 10px;
    border-radius: 8px;
    box-shadow: none;
  }

  .navbar-nav .dropdown.show .dropdown-menu {
    display: block;
  }
}