/*------------------------------------------------------------------
[Table of contents]

1. Import libraries
2. Custom properties
3. General Styles
4. Typography
5. Header and Navbar
6. Buttons and Links
7. Utilities
8. Sections
9. Swiper
10.Boxes and Cards
11.Footer
12.Accordion
13.Error 404
14.Responsive Layouts

-------------------------------------------------------------------*/

/* ---------------------------- */
/* Import libraries             */
/* ---------------------------- */
@import url("https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Source+Sans+3:ital,wght@0,200..900;1,200..900&display=swap");
@import url("../css/vendor/bootstrap.min.css");

/* ---------------------------- */
/* Custom properties            */
/* ---------------------------- */
:root {
  --primary-color: #1747a6;
  --secondary-color: #f291a3;
  --text-color: #191919;
  --text-color-2: #7a7a7a;
  --accent-color: #3b67bf;
  --accent-color-2: #f2bbc5;
  --accent-color-3: #fbeaed;
  --font-1: "Nunito", sans-serif;
  --font-2: "Source Sans 3", sans-serif;
}

/* ---------------------------- */
/* General Styles               */
/* ---------------------------- */
body {
  font-family: var(--font-2);
  color: var(--text-color);
  background-color: #ffffff;
}

.bg-primary-color {
  background-color: var(--primary-color);
}

.bg-primary-color-2 {
  background-color: var(--accent-color);
}

.bg-secondary-color {
  background-color: var(--secondary-color);
}

.bg-secondary-color-2 {
  background-color: var(--accent-color-2);
}

.bg-accent-color {
  background-color: var(--accent-color-2);
}

.bg-accent-color-2 {
  background-color: var(--accent-color-3);
}

.bg-gradient-primary {
  background: linear-gradient(to bottom, var(--primary-color), #518ef8);
}

.bg-gradient-secondary {
  background: linear-gradient(
    100deg,
    #b8c5ff 0%,
    /* Azul mais vivo/forte no início */ #eaddf5 50%,
    /* Transição para o lilás */ #fce4ec 100% /* Termina no rosa suave */
  ) !important;
  padding: 80px 0;
  border: none;
}
.text-primary-color {
  color: var(--primary-color);
}

.text-black-color-2 {
  color: var(--text-color);
}

.text-secondary {
  text-align: justify;
}

.fw-bolder py-1 {
  font-weight: 700;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  text-align: justify;
  color: #c51515 !important;
}

.crp {
  display: block; /* força ficar embaixo */
  font-size: 14px;
  font-weight: 400;
}

/* .col p{
  font-size: 18px;
  text-align: justify;
  font-weight: 800;
  margin: 0;
} */

.row d-flex flex-column flex-md-row my-2 {
  display: flex;
  flex-direction: row;
  gap: 1rem;
}

.text-secondary-color-2 {
  color: var(--secondary-color);
}

.text-muted-color {
  color: var(--text-color-2);
}

.accent-primary-color {
  color: var(--accent-color);
}

.accent-secondary-color {
  color: var(--accent-color-2);
}

.accent-tertiary-color {
  color: var(--accent-color-3);
}

.font-1 {
  font-family: var(--font-1);
}

.font-2 {
  font-family: var(--font-2);
}

.section {
  padding: 6em 2em 6em 2em;
  overflow: hidden;
  background-size: cover;
  background-position: center;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  border: none;
}

.b-container {
  max-width: 1240px;
  margin-right: auto;
  margin-left: auto;
}

/* ---------------------------- */
/* Typography                   */
/* ---------------------------- */
h1 {
  font-size: 72px;
}

h2 {
  font-size: 48px;
}

h3 {
  font-size: 32px;
}

h4 {
  font-size: 26px;
}

h5 {
  font-size: 22px;
}

h6 {
  font-size: 20px;
}

button,
a {
  font-size: 18px;
  font-family: var(--font-1);
}

ul {
  list-style: none;
}

p,
li {
  font-size: 18px;
}

img {
  object-fit: cover;
}

/* ---------------------------- */
/* Header and Navbar            */
/* ---------------------------- */
.top-bar {
  background-color: var(--primary-color);
  /* padding-block: 1.2rem; */
  min-height: 80px;
}

.social-box {
  display: flex;
  flex-direction: row;
  gap: 1rem;
}

.social-box a {
  background-color: var(--secondary-color);
  text-align: center;
  vertical-align: middle;
  transition: all 0.3s ease-in-out;
}

.social-box a:hover {
  background-color: var(--accent-color-2);
  /* transform: scale(1.1); */
}

.logo-box img {
  max-height: 63px;
}

.navbar-toggler:focus {
  outline: none;
  box-shadow: none;
}

.nav-link {
  font-size: 1.15rem;
  color: var(--text-color);
  font-weight: 600;
  padding-block: 1.85rem;
  padding-inline: 1.5rem;
}

.nav-link:hover {
  color: var(--accent-color) !important;
}

.nav-link.active {
  color: var(--primary-color) !important;
}

.dropdown-menu {
  border: 0;
  border-radius: 0 0 25px 25px;
  padding: 15px 0px;
  width: 220px;
  -webkit-box-shadow: 0px 0px 24px 0px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 0px 0px 24px 0px rgba(0, 0, 0, 0.3);
  box-shadow: 0px 0px 24px 0px rgba(0, 0, 0, 0.3);
}

.dropdown-item {
  color: var(--text-color);
  font-size: 1.15rem;
  padding: 15px;
  font-weight: 600;
  padding-block: 0.75rem;
  padding-inline: 0.75rem;
}

.dropdown-item:hover {
  color: var(--accent-color) !important;
  background-color: transparent;
}

.dropdown-item:focus {
  color: var(--accent-color) !important;
}

.dropdown-item.active {
  color: var(--primary-color) !important;
  background-color: transparent;
}
/* ---------------------------- */
/* Buttons and Links            */
/* ---------------------------- */
.btn-quotes {
  width: 180px;
  background-color: var(--text-color);
  color: #ffffff;
  font-size: 1.15rem;
  font-weight: 600;
  padding: 0.75rem 1.5rem;
  border-radius: 30px;
  border: none;
}

.btn-quotes:hover {
  background-color: var(--primary-color);
  color: #ffffff;
  border: none;
}

.btn-primary-solid {
  background-color: var(--primary-color);
  color: #ffffff;
  font-size: 1.15rem;
  padding: 0.75rem 1.5rem;
  border-radius: 30px;
  font-weight: 600;
  border: none;
  transition:
    transform 0.3s ease,
    background-color 0.3s ease,
    color 0.3s ease,
    border 0.3s ease;
}

.btn-primary-solid:hover {
  background-color: var(--accent-color);
  color: #ffffff;
  border: none;
  transform: scale(1.1);
}

.btn-secondary-solid {
  background-color: var(--secondary-color);
  color: #ffffff;
  font-size: 1.15rem;
  padding: 0.75rem 1.5rem;
  border-radius: 30px;
  font-weight: 600;
  border: none;
  transition:
    transform 0.3s ease,
    background-color 0.3s ease,
    color 0.3s ease,
    border 0.3s ease;
}

.btn-secondary-solid:hover {
  background-color: var(--accent-color-2);
  color: #ffffff;
  border: none;
  transform: scale(1.1);
}

.btn-secondary-solid-2 {
  background-color: var(--secondary-color);
  color: #ffffff;
  font-size: 1.15rem;
  padding: 0.75rem 1.5rem;
  border-radius: 30px;
  font-weight: 600;
  border: none;
  transition:
    transform 0.3s ease,
    background-color 0.3s ease,
    color 0.3s ease,
    border 0.3s ease;
}

.btn-secondary-solid-2:hover {
  background-color: var(--primary-color);
  color: #ffffff;
  border: none;
  transform: scale(1.1);
}

.links-primary {
  font-family: var(--font-2);
  color: var(--text-color);
  font-size: 18px;
  text-decoration: none;
}

.links-primary:hover {
  color: var(--primary-color);
  text-decoration: none;
}

.links-secondary {
  font-family: var(--font-2);
  color: #ffffff;
  font-size: 18px;
  text-decoration: none;
}

.links-secondary:hover {
  color: var(--secondary-color);
  text-decoration: none;
}

.badge-primary-color {
  background-color: var(--primary-color);
  color: #ffffff;
  font-size: 18px;
  padding: 8px 16px;
  border-radius: 30px;
  font-weight: 600;
}

.badge-primary-color:hover {
  background-color: var(--accent-color);
  color: #ffffff;
}

/* ---------------------------- */
/* Utilities                    */
/* ---------------------------- */
.video-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.85);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem;
}

.video-box {
  width: 100%;
  max-width: 960px;
  height: auto;
}

.video-overlay .ratio {
  width: 100%;
  height: auto;
}

.video-overlay iframe {
  width: 100%;
  height: 100%;
  border: none;
}

.img-container {
  width: 100%;
  max-width: 100%;
  max-width: 1000px;
}

.ratio-wrapper-429 {
  position: relative;
  aspect-ratio: 3 / 4; /* default: portrait */
  overflow: hidden;
}

.img-circle {
  width: 275px;
  height: 275px;
}

.ratio-wrapper-419 {
  position: relative;
  aspect-ratio: 3 / 4; /* default: portrait */
  overflow: hidden;
}

.bg-overlay-secondary {
    background: linear-gradient(
    100deg,
    #b8c5ff 0%,
    /* Azul mais vivo/forte no início */ #eaddf5 50%,
    /* Transição para o lilás */ #fce4ec 100% /* Termina no rosa suave */
  ) !important;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

.transition-hover {
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

.transition-hover:hover {
  transform: translateY(-8px);
  box-shadow: 0 12px 25px rgba(0, 0, 0, 0.2);
}

.scale-hover {
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

.scale-hover:hover {
  transform: scale(1.05);
  box-shadow: 0 12px 25px rgba(0, 0, 0, 0.2);
}

.bg-secondary-gradient {
  background: #ffffff;
}

.breadcrumb {
  font-size: 22px;
}

.breadcrumb-item + .breadcrumb-item::before {
  color: white !important;
}

.breadcrumb-item a:hover,
.breadcrumb-item.active {
  color: white !important;
}

.list-unstyled {
  padding-left: 0;
  margin-bottom: 0;
}

/* ---------------------------- */
/* Sections                     */
/* ---------------------------- */
.banner-section {
  position: relative;
  overflow: hidden;
  padding: 50px 75px 0 75px;
  color: white;
}

.hero-section {
  background-image: url("../image/Homehero.png");
  background-size: cover;
  background-position: center;
  padding-bottom: 80px;
}

/* Ajuste para o título da Hero */
.hero-section h1 {
  letter-spacing: -1px; /* Deixa as letras mais juntinhas como na imagem */
  line-height: 1.1; /* Diminui o espaço entre as duas linhas */
  margin-bottom: 20px;
}

/* ---------------------------- */
/* Swiper                       */
/* ---------------------------- */
.swiper-container-outer {
  position: relative;
  overflow: hidden;
}

.swiper {
  padding: 30px 0;
}

.swiper-slide {
  height: auto;
}

/* ---------------------------- */
/* Boxes and Cards              */
/* ---------------------------- */

.step-box {
  position: relative;
  margin-bottom: 3rem;
}

/* NUMEROS DA SECTION COMO FUNCIONA */
.step-box h1 {
  font-family: var(--font-1);
  font-weight: 900;
  opacity: 0.8;
  margin-bottom: 10px; /* Espaço entre o número e o título */
  z-index: 1;
  background: -webkit-linear-gradient(var(--primary-color), #9abbfd);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.step-box h3 {
  color: #2b3a8c;
  font-weight: 700;
  font-size: 1.4rem;
  margin-bottom: 15px;
}

.step-box p {
  position: relative;
  z-index: 1;
}

.feedback-card {
  background: #fff;
  border: var(--primary-color) 2px solid;
  border-radius: 30px;
  padding: 35px;
}

.quotes-section {
  padding: 6em 2em 6em 2em;
  position: relative;
  overflow: hidden;
}

.quotes-section .card {
    background: #ffffff !important; /* Força o fundo branco no card todo */
    overflow: hidden; /* Garante que o rosa não escape das bordas arredondadas */
    display: flex;
    flex-direction: column;
}

@media (min-width: 992px) {
    .quotes-section .card-body {
        position: relative;
        background: linear-gradient(to right, #ffffff 50%, #f7d7da 50%);
    }
    
    /* Ajusta a cor do texto apenas do lado direito para ficar legível sobre o rosa */
    .quotes-section .col-lg-6.order-lg-2 {
        color: #444; /* Ou a cor que preferir para o texto no lado rosa */
    }
}

.quotes-background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 75%;
  background-image: url("../image/Place-Holder-1920x1280.jpg");
  background-size: cover;
  background-position: center center;
  opacity: 0.8;
  z-index: -1; /* place behind of content */
}

/* BACKGROUNDE DE ENTRE EM CONTATO */

.quotes-background::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    135deg,
    #d1d9ff 0%,
    #f3e5f5 40%,
    #fce4ec 100%
  ) !important;
  opacity: 0.9;
  z-index: 1; /* place in-front of content */
}

.quotes-section > .container {
  position: relative; /* Force container in-front of background */
  z-index: 2;
}

.quotes-section > .card {
  margin-top: 30px; /* Space from heading */
}

.news-card {
  border: 2px solid var(--primary-color);
  border-radius: 15px;
  position: relative;
  overflow: hidden;
}

.news-card .card-title {
  font-family: var(--font-1);
  font-weight: 800;
  text-decoration: none;
}
.news-card .card-title:hover {
  font-family: var(--font-1);
  font-weight: 800;
  /* font-size: 22px; */
  text-decoration: none;
  color: var(--primary-color);
}

/* ---------------------------- */
/* Footer                       */
/* ---------------------------- */
.footer {
  position: relative;
  overflow: hidden;
  color: white;
}

.footer-background {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url("../image/Place-Holder-1920x1280.jpg");
  background-size: cover;
  background-position: center center;
  z-index: -1;
}

.footer-background::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    to bottom,
    rgba(23, 71, 166, 0.9),
    rgba(59, 103, 191, 0.9)
  );
  z-index: 1; /* place in-front of content */
}

.footer-logo > img {
  max-height: 65px;
}

/* ---------------------------- */
/* Accordion                    */
/* ---------------------------- */
.accordion .accordion-item {
  border: none;
  margin-bottom: 1rem;
  border-radius: 1.5rem;
  overflow: hidden;
  background-color: transparent;
}

.accordion .accordion-button {
  font-size: large;
  font-weight: 700;
  color: #fff;
  background-color: var(--accent-color); /* Default blue */
  border-radius: 1.5rem;
  padding: 1rem 1.5rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  box-shadow: none;
}

.accordion .accordion-button.collapsed {
  background-color: var(--accent-color); /* Blue for collapsed */
  color: #fff;
}

.accordion .accordion-button:not(.collapsed) {
  background-color: var(--accent-color-2); /* Pink for expanded */
  color: #000;
}

.accordion .accordion-button:focus {
  box-shadow: none;
}

.accordion i {
  font-size: 1.2rem;
}

.accordion .accordion-collapse {
  margin-top: 0.5rem; /* Gap between header and body */
}

.accordion .accordion-body {
  font-size: large;
  background-color: #f5f5f5;
  padding: 1.5rem;
  border-radius: 1rem;
  /* margin-top: 0.5rem; */
  color: #333;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
}

/* ---------------------------- */
/* Error 404                    */
/* ---------------------------- */
.error-code {
  font-size: 18rem;
  font-weight: 900;
  line-height: 1;
  display: flex;
  justify-content: center;
  gap: 1rem;
}

.error-code span:nth-child(2) {
  background: linear-gradient(180deg, var(--primary-color), #ffc2b3);
  color: white;
  padding: 20px 0;
  border-radius: 1.5rem;
}
/* ---------------------------- */
/* Responsive Layouts           */
/* ---------------------------- */
@media only screen and (max-width: 1199.98px) {
  .ratio-wrapper-429 {
    aspect-ratio: 3 / 2;
  }

  .ratio-wrapper-419 {
    aspect-ratio: 1 / 1;
  }

  .step-box h1 {
    left: 17%;
  }
}

@media only screen and (max-width: 991.98px) {
  /* ---------------------------- */
  /* Typography                   */
  /* ---------------------------- */
  h1 {
    font-size: 56px;
  }

  h2 {
    font-size: 40px;
  }

  h3 {
    font-size: 24px;
  }

  h4 {
    font-size: 22px;
  }

  h5 {
    font-size: 20px;
  }

  h6 {
    font-size: 18px;
  }

  button,
  a {
    font-size: 17px;
  }

  p {
    font-size: 16px;
  }

  /* ---------------------------- */
  /* Header and Navbar            */
  /* ---------------------------- */
  /* padding: 4em 2em 4em 2em; */
  .section {
    padding: 4em 1em;
  }

  .top-bar {
    display: none;
  }

  .logo-box img {
    max-height: 86px;
  }

  .logo-drawer img {
    max-height: 60px;
  }

  .nav-link {
    font-size: 1rem;
    padding-block: 0.5rem;
    padding-inline: 0.5rem;
  }

  .nav-link.active,
  .nav-link:hover,
  .nav-link:focus {
    color: var(--primary-color) !important;
  }

  .navbar-nav .nav-link {
    padding-block: 0.5rem;
    padding-inline: 0.5rem;
  }

  .dropdown-menu {
    border-radius: 0;
    width: 100%;
    padding: 5px 0px 5px 0px;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
  }

  .dropdown-item {
    font-size: 1rem;
    padding-block: 0.5rem;
    padding-inline: 0.5rem;
  }

  .btn-quotes {
    display: none;
  }

  .img-circle {
    width: 275px;
    height: 275px;
  }

  .step-box h1 {
    left: 5%;
  }

  .feedback-slide {
    width: 33.333%; /* 3 slides per-row for desktop */
  }

  .bg-secondary-gradient {
    background: linear-gradient(
      135deg,
      #f8dae0 0%,
      #f1e4ff 50%,
      #e2f2ff 100%
    ) !important;
  }

  /* 2. O "quadrado" translúcido que envolve os 3 itens */
  .step-container-bg {
    background-color: rgba(255, 255, 255, 0.45); /* Branco com transparência */
    border-radius: 20px;
    padding: 60px 40px;
    margin-top: 40px;
    border: 1px solid rgba(255, 255, 255, 0.5);
  }

  .quotes-section {
    position: relative; /* Force container in-front of background */
    overflow: hidden;
    padding: 0;
  }

  .quotes-section > .container {
    position: relative; /* Force container in-front of background */
    z-index: 2;
    padding: 0;
  }

  .quotes-section > .card {
    margin-top: 70px;
  }

  .img-container {
    width: 90%;
  }

  .ratio-wrapper-429 {
    aspect-ratio: 16 / 9;
  }

  .img-circle {
    width: 300px;
    height: 300px;
  }

  .footer-logo {
    text-align: center;
    padding: 0 4rem;
  }

  .footer-logo > img {
    max-height: 85px;
  }

  .error-code {
    font-size: 15rem;
  }
}

@media only screen and (max-width: 767.98px) {
  .btn-play {
    width: 80%;
  }

  .badge-cta {
    display: none;
  }

  .bg-secondary-gradient {
    background: linear-gradient(
      to top,
      white 0%,
      white 61%,
      #f8dae0 61%,
      #f7d9df 100%
    );
  }

  .img-container {
    width: 85%;
  }

  .ratio-wrapper-429 {
    aspect-ratio: 1 / 1;
  }

  .img-circle {
    width: 300px;
    height: 300px;
  }

  .step-box h1 {
    font-weight: 900;
    font-size: 3.5rem;
    margin-bottom: 10px;
    background: -webkit-linear-gradient(#2b3a8c, #9abbfd);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    opacity: 0.8;
  }
  .footer-logo > img {
    max-height: 65px;
  }
}

@media only screen and (max-width: 576.98px) {
  .ratio-wrapper-429 {
    aspect-ratio: 3 / 4;
  }

  .img-circle {
    width: 185px;
    height: 185px;
  }

  .step-box h1 {
    left: 8%;
  }

  .error-code {
    font-size: 10rem;
  }
}
@media (max-width: 768px) {
  .badge-cta {
    display: none !important;
  }
}
@media (max-width: 768px) {
  h1.display-md-4 {
    font-size: 2rem;
  }

  h2.display-5 {
    font-size: 1.8rem;
  }

  .font-1 {
    text-align: center;
  }
}
@media (max-width: 768px) {
  .section {
    padding-left: 15px;
    padding-right: 15px;
  }
}
@media (max-width: 768px) {
  .card {
    margin-bottom: 20px;
  }
}
@media (max-width: 768px) {
  /* empilha ícone + texto */
  .d-flex.align-items-center {
    flex-direction: column !important;
    text-align: center;
    gap: 10px;
  }

  /* reduz tamanho dos ícones */
  .rounded-circle {
    width: 50px !important;
    height: 50px !important;
  }

  /* reduz fonte do texto longo */
  h5 {
    font-size: 1rem !important;
    word-break: break-word;
  }

  /* remove qualquer altura fixa */
  .section,
  .card {
    height: auto !important;
  }

  /* evita sobreposição */
  .position-absolute {
    position: static !important;
  }
}
.contact-item {
  display: flex;
  align-items: center;
  gap: 15px;
}

@media (max-width: 768px) {
  .contact-item {
    flex-direction: column;
    text-align: center;
  }
}
.bg-rosa {
  background: #d9bcbc; /* use a cor que você quiser */
  border-radius: 30px;
  overflow: hidden;
}
.card-principios {
  font-family: sans-serif;
  max-width: 400px;
  padding: 20px;
}

.card-principios h2 {
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 20px;
  color: #000;
}

.card-principios ul {
  list-style: none; /* Remove as bolinhas padrão */
  padding: 0;
}

.card-principios li {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  color: #000;
}

/* Estilização do Checkmark (Visto) */
.card-principios li::before {
  content: "✔"; /* Ou use um ícone de biblioteca externa */
  margin-right: 12px;
  font-size: 20px;
}

.container-atendimento {
  font-family: sans-serif;
  color: #000;
  max-width: 400px;
}

.container-atendimento h3 {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 15px;
}

.item-opcao {
  display: flex;
  align-items: center;
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 10px;
  cursor: pointer;
  user-select: none;
}

/* Estilização do parênteses/círculo */
.item-opcao input {
  margin-right: 10px;
  width: 18px;
  height: 18px;
  cursor: pointer;
}

.card-principios h2,
.card-principios ul {
  text-align: left !important;
}

/* --- LINHA VERTICAL ENTRE OS BLOCOS --- */

/* Cria a borda direita apenas em telas grandes (Desktop) */
/* 1. Deixa a linha vertical mais forte e visível */
@media (min-width: 992px) {
  .border-end-fiel {
    border-right: 2px solid rgba(43, 58, 140, 0.4) !important;
  }
}
/* Garante que no celular (telas pequenas) a linha não fique estranha */
@media (max-width: 991px) {
  .border-end-fiel {
    border-bottom: 1px solid rgba(43, 58, 140, 0.1) !important;
    margin-bottom: 30px;
    padding-bottom: 30px;
  }
}

/* --- FORTALECER O HR HORIZONTAL --- */

hr.border-white.solid.border-2.my-5 {
  border-top: 5px solid rgba(253, 253, 253, 0.4) !important; /* Deixa a linha azulada e mais grossa */
  opacity: 3 !important; /* Tira a transparência para ela aparecer bem */
  height: 0px;
}

/* Ajuste das cores e do fundo translúcido */
.step-container-bg {
  background-color: rgba(255, 255, 255, 0.5) !important;
  border-radius: 20px;
  padding: 60px 20px;
  border: 1px solid rgba(255, 255, 255, 0.6);
}

.text-primary-color {
  color: #2b3a8c !important;
  font-weight: 700 !important;
  margin-bottom: 15px;
}

/* Cor azul para os textos de apoio e parágrafos */
.text-description {
  color: #4a558a !important; /* Azul escuro suave para leitura */
  opacity: 0.9;
}

.step-box h1 {
  font-size: 3.5rem !important;
  font-weight: 900 !important;
  background: -webkit-linear-gradient(#2b3a8c, #9abbfd);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-bottom: 10px;
}

/* --- AUMENTAR ALTURA DOS CARDS E IMAGENS --- */

.service-card {
  border: none !important;
  border-radius: 40px !important; /* Arredondamento mais suave */
  background-color: rgba(255, 255, 255, 0.45) !important;
  overflow: hidden;
  height: 100%;
  min-height: 650px; /* FORÇA O CARD A FICAR MAIS ALTO */
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.05) !important;
  display: flex;
  flex-direction: column;
}

.card-img-top-fiel {
  width: 100%;
  height: 300px; /* AUMENTEI A ALTURA DA IMAGEM (era 250px) */
  object-fit: cover;
}

.card-body {
  padding: 2.5rem 2rem !important; /* MAIS ESPAÇO INTERNO */
  flex-grow: 1;
}

.icon-original-position {
  position: absolute;
  bottom: -40px; /* Ajuste para o ícone maior */
  left: 30px;
  z-index: 5;
}

/* Título maior e com mais destaque */
.card-title-fiel {
  color: #2b3a8c !important;
  font-weight: 800;
  font-size: 1.6rem;
  margin-top: 45px;
  line-height: 1.2;
}

/* Texto de descrição um pouco maior para preencher o card alto */
.text-description {
  color: #555c81 !important;
  font-size: 1.05rem;
  line-height: 1.7;
}

.hr-service {
  border: 0;
  border-top: 2px solid rgba(43, 58, 140, 0.2) !important;
  margin: 25px 0;
  opacity: 1;
  width: 100%;
}

/* --- CSS DE ALTO CONTRASTE --- */

/* Faz o texto branco saltar do fundo lilás/rosa */
.text-fiel-white {
  color: #ffffff !important;
  opacity: 1 !important;
  font-weight: 600 !important;
  text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.45) !important;
}

/* Remove a barra branca entre essa seção e a próxima */
.section,
section {
  margin: 0 !important;
  border: none !important;
}

/* Corrigindo a cor dos ícones de check para azul escuro (melhor leitura) */
.text-primary-color {
  color: #2b3a8c !important;
}

/* --- CORREÇÃO FINAL PARA O QUADRADO ROSA --- */

/* Remove qualquer padding residual do card-body */
.card-body.p-0 {
  padding: 0 !important;
}

/* Faz a metade rosa ocupar toda a altura e largura da coluna */
.bg-light-pink {
  background-color: #fce4ec !important;
  margin: 0 !important;
  display: flex;
  flex-direction: column;
  height: 100%; /* Garante que preencha de cima a baixo */
}

/* Garante que o fundo branco do lado esquerdo também seja limpo */
.bg-white {
  background-color: #ffffff !important;
}

/* --- REMOVE ÍCONE DUPLICADO E CENTRALIZA --- */

/* Garante que o ícone fique centralizado no círculo branco */
.icon-fix-container {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
}

.icon-fix-container i {
  line-height: 1 !important;
  margin: 0 !important;
}

/* --- DEVOLVENDO O HOVER NOS LINKS --- */
/* Cor base para todos os links (idêntica à imagem) */
.navbar-nav .nav-link {
  color: #4b5981 !important; /* Esse é o tom de azul da sua imagem */
  font-weight: 500;
  transition: all 0.3s ease;
}

/* Garante que mesmo o link "ativo" tenha a mesma cor */
.navbar-nav .nav-link.active {
  color: #4b5981 !important;
}

/* Efeito de Hover (quando passa o mouse) */
.navbar-nav .nav-link:hover {
  color: #2b3a8c !important; /* Um azul um pouco mais escuro no hover */
  opacity: 1;
  transform: translateY(-2px);
}
/* Ajuste do título para ficar igual à imagem */
.custom-main-title {
  font-size: 1.55rem !important; /* Tamanho menor e mais elegante */
  color: #333333 !important; /* Cinza bem escuro (quase preto) */
  font-weight: 400 !important; /* Fonte mais fina no início */
  letter-spacing: -0.5px;
}

.custom-main-title span {
  color: #2b3a8c !important; /* Azul do destaque */
  font-weight: 700 !important; /* Negrito apenas no azul */
}

/* Ajuste fino dos textos dentro dos cards */
.section p {
  font-size: 0.95rem;
  line-height: 1.6;
  opacity: 0.9;
}

/* Saiba mais discreto como na imagem */
.opacity-75:hover {
  opacity: 1 !important;
}

/* Estilo do H1 igual à imagem */
.main-title {
  color: #2b3a8c !important; /* Azul escuro */
  font-weight: 500;
}

.main-title span {
  color: #0d47a1 !important; /* Azul mais forte da imagem */
  font-weight: 800 !important; /* Negrito pesado */
}

/* Ajuste para alinhar o Saiba Mais no rodapé do card */
.d-flex.flex-column {
  display: flex !important;
  flex-direction: column !important;
}

.flex-grow-1 {
  flex-grow: 1 !important;
}



/* --- FOOTER FINAL PADRONIZADO --- */
.footer-principal {
    background-color: #3b63a8 !important; /* Azul da imagem */
    color: white !important;
    font-family: 'Poppins', sans-serif;
}

/* Títulos Salmão */
.footer-principal .titulo-footer {
    color: #f18795 !important; 
    font-weight: bold !important;
    font-size: 1.1rem !important;
    margin-bottom: 1.5rem !important;
    white-space: nowrap;
}

/* Fontes padrão 14px para todo o footer */
.footer-principal p, 
.footer-principal li, 
.footer-principal a,
.footer-principal .form-control::placeholder {
    font-size: 0.875rem !important;
    line-height: 1.6 !important;
}

/* Links sem quebra e sem sublinhado */
.footer-principal a {
    color: white !important;
    text-decoration: none !important;
    white-space: nowrap;
    transition: 0.3s;
    opacity: 0.9;
}

.footer-principal a:hover {
    color: #f18795 !important;
    opacity: 1;
}

/* Instagram Salmão */
.instagram-box {
    background-color: #f18795 !important;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 10px;
}

/* Botão de Inscrição */
.btn-inscrever {
    background-color: #f18795 !important;
    color: white !important;
    border: none !important;
    border-radius: 50px !important;
    padding: 10px !important;
    font-weight: bold !important;
    font-size: 0.875rem !important;
}

/* Input do Footer */
.footer-principal .form-control {
    border-radius: 50px !important;
    border: none !important;
    padding: 10px 20px !important;
    font-size: 0.875rem !important;
}


/* --- SEÇÃO DE CONTATO: FUNDO COM MAIS DEGRADÊ --- */
.quotes-section {
    /* Degradê idêntico ao solicitado */
    background: linear-gradient(
        100deg,
        #b8c5ff 0%, 
        #eaddf5 50%, 
        #fce4ec 100%
    );
    /* Aumentado para 75% para ter MAIS degradê do que branco */
    background-size: 100% 75%; 
    background-repeat: no-repeat;
    background-color: #ffffff; /* Fundo branco no restante */
    
    padding: 100px 0;
    width: 100%;
}

/* Card Principal: Bordas de 40px e Sombra */
.contato-card {
    border-radius: 40px !important;
    overflow: hidden !important;
    border: none !important;
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.1) !important;
}

/* Lado Rosa do Card (Direita) */
.bg-rosa-card {
    background-color: #fce4e8 !important;
}

/* Inputs Padronizados 14px */
.form-control-contato {
    border-radius: 15px !important;
    border: 1px solid #e0e0e0 !important;
    padding: 12px 18px !important;
    font-size: 0.875rem !important;
}

/* Botão Azul Marinho */
.btn-enviar-azul {
    background-color: #1a4da1 !important;
    color: white !important;
    border-radius: 15px !important;
    font-weight: bold !important;
    padding: 15px !important;
    border: none !important;
    font-size: 0.875rem !important;
    transition: 0.3s;
}

/* Ícones Circulares */
.circulo-contato {
    width: 50px;
    height: 50px;
    background-color: #1a4da1 !important;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white !important;
}