/* 1. Declarando a fonte      */
@font-face {
    font-family: 'Myriad Web Pro'; /* O nome que você vai usar para chamar a fonte */
    src: url('../fonts/myriad-web-pro-bold.woff2') format('woff2'), /* Caminho para o arquivo */
         url('../fonts/myriad-web-pro-bold.woff') format('woff');   /* Fallback se tiver outro formato */
    font-weight: bold; /* Define que este arquivo representa o negrito */
    font-style: normal;
} 
  
 
 
 .ion-plano i {
  	color: white;
  	font-weight: 800;
  }

  .text-plano {
  	color: #2e2e2e;
  	margin-left: 10px;
  }

    .text-plano-destaque {
  	color: #f7f7f7;
  	margin-left: 6px;
  }
 
  .sobtitulo {
  	font-size: 20px;
  	color: white;
  	border-radius: 20px;

  }

  .card11 {
  	position: relative;
  	width: 270px;
  	height: 200px;
  	border-radius: 20px;
  	overflow: hidden;
  	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
  }


  .card_flex {
  	position: relative;
  	top: -14.99px;
  	width: 280px;
  	height: 235px;
  	left: -15px;
  	border-radius: 20px;
  	overflow: hidden;
  	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);

  	max-width: 300px;
  	display: flex;
  	flex-direction: column;
  }

  .background {
  	width: 100%;
  	height: 100%;
  	object-fit: cover;
  	display: block;
  }

  .overlay {
  	position: absolute;
  	inset: 0;
  	background: linear-gradient(to bottom right, #6a00ffb3, #3300ccb3);
  }

  .content {
  	position: absolute;
  	bottom: 20px;
  	left: 20px;
  	right: 20px;
  	display: flex;
  	justify-content: space-between;
  	align-items: center;
  	color: white;
  }

  .text {
  	font-size: 16px;
  	font-weight: bold;
  }

  .arrow {
  	color: yellow;
  	font-size: 20px;
  }



  .section h2 {
  	font-size: 36px;
  	margin-bottom: 10px;
  }

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

  .card {
  	background: white;
  	border-radius: 12px;
  	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  	overflow: hidden;
  	flex: 1 1 280px;
  	width: 280px;
  	height: 235px;
  	max-width: 300px;
  	display: flex;
  	flex-direction: column;
  }

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

  .card-content {
  	padding: 16px;
  	display: flex;
  	align-items: center;
  }

  .card-content .indicator {
  	width: 8px;
  	height: 8px;
  	background: #4a00e0;
  	border-radius: 50%;
  	margin-right: 10px;
  }

  .card-content p {
  	margin: 0;
  	font-weight: bold;
  	line-height: 1.4;
  }





  .titulo-container {
  	display: inline-block;
  	/* para o sublinhado ter largura apenas do texto */
  }

  .titulo-container h1 {
  	font-family: 'Myriad Web Pro', sans-serif;
  	font-size: 32px;
  	font-weight: 700;
  	/* negrito */
  	color: #343a40;
  	/* cor próxima ao cinza escuro da imagem */
  	margin: 0;
  }

  .underline {
  	margin-top: 8px;
  	width: 150px;
  	height: 10px;
  	background-color: #f1231f;
  	/* vermelho */
  	border-radius: 3px;
  	/* cantos arredondados */
  }

  span {
  	color: #b90000;
  	/* vermelho */
  }


  .col-xl-44 {
  	position: relative;
  	width: 100%;
  	min-height: 1px;
  	/* padding-right: 15px; */
  	/* padding-left: 15px; */
  }






  /***
portifolio  
***/

 @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap');
 
        :root {
            --bg-dark: #2c0000;
            --card-bg: #b70000;
            --text-dim: #9ca3af;
            --border: rgba(255, 255, 255, 0.08);
            --gap: 24px;
            /* Queremos 3 cards inteiros e 30% do quarto aparecendo na direita */
            --items-per-view: 3.3; 
        }

        .port {
            background-color: var(--card-bg);
            color: white;
            font-family: 'Myriad Web Pro', sans-serif;
            margin: 0;
            padding: 60px 0;
            overflow-x: hidden; /* Impede scroll horizontal na página inteira */
        }

       
       
        .container-port {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 20px;
            position: relative;
        }

        .header-port {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 40px;
        }

        .header-port h2 { font-size: 2.5rem; font-weight: 500; margin: 0; letter-spacing: -1px;   color: white;}

        .nav-btns-port { display: flex; gap: 12px; }
        .nav-btns-port button {
            background: rgba(255, 255, 255, 0.3);
            border: 1px solid var(--border);
            color: white; width: 50px; height: 50px;
            border-radius: 50%; cursor: pointer;
            display: flex; align-items: center; justify-content: center;
            transition: 0.3s;
        }
        .nav-btns-port button:disabled { opacity: 0.3; cursor: not-allowed; }

        /* --- O SEGREDO DO POSICIONAMENTO --- */
        .slider-area-port {
            width: 100%;
            /* overflow: visible aqui permite que vejamos o card de 30% na direita, 
               mas o slider-wrapper-port abaixo vai garantir que nada apareça à esquerda do limite */
        }

        .slider-wrapper-port {
            overflow: visible; 
            width: 100%;
        }

        .slider-track-port {
            display: flex;
            gap: var(--gap);
            transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
            width: max-content;
            will-change: transform;
        }

       

        /* Ajuste para garantir que no Desktop o cálculo use os 1200px do container-port */
        @media (min-width: 1200px) {
            .card-port {
                width: calc((1160px - (var(--gap) * 3)) / 3.3);
            }
        }

        @media (max-width: 768px) {
            :root { --items-per-view: 1.3; }
            .card-port { 
                width: calc(85vw); /* No mobile, card quase cheio */
                min-width: auto;
                padding: 30px;
            }
        }
 
 
  /***
fimmmmmmmmmm portifolio 
***/










  /*--------------------------------------------------------------------- 
swiper.js
---------------------------------------------------------------------*/

  * {
  	font-family: 'Myriad Web Pro', sans-serif;
  	margin: 0;
  	padding: 0;
  	box-sizing: border-box;
  }




  .swiper {
  	width: 100%;
  	height: 100%;
  }

  .swiper-slide {
  	text-align: center;
  	font-size: 18px;
  	display: flex;
  	justify-content: center;
  	align-items: center;
  }

  .swiper-slide img {
  	display: block;
  	width: 100%;
  	height: 100%;
  	object-fit: cover;
  }


  #tecnolog {
  	min-height: 50vh;
  	display: flex;
  	align-items: center;
  	justify-content: center;
  	flex-direction: column;
  	gap: 60px;
  	padding: 5% 10% 5% 10%;
  }




  #testimonials {
  	min-height: 100vh;
  	background-color: #f9fafb;
  	display: flex;
  	align-items: center;
  	justify-content: center;
  	flex-direction: column;
  	gap: 60px;
  	padding: 32px 8%;
  }

  #testimonials_header {
  	text-align: center;
  }

  #testimonials_header h1 {
  	font-size: 18px;
  	font-weight: 600;
  	color: #3758f9;
  }

  #testimonials_header h2 {
  	color: #111928;
  	font-size: 40px;
  }

  #testimonials_header p {
  	color: #637381;
  	font-size: 16px;
  	max-width: 485px;
  }



  .swiper_tecnologia {
  	width: 80%;
  	height: 329px;
  	padding-bottom: 60px;
  }


  .swiper-slide {
  	flex-direction: column;
  	gap: 18px;
  	justify-content: center;
  	text-align: center;
  	box-shadow: 0px 0px 20px 0px rgba(92, 115, 160, 0.07);
  	padding: 14px;
  	border-radius: 12px;

  	display: flex;
  	/* altura da div */
  }

  .testimonial-rate {
  	display: flex;
  	gap: 2px;
  }

  .testimonial-rate i {
  	color: #f9b707;
  }

  .testimonial-quote {
  	color: #637381;
  	font-size: 16px;
  }

  .testimonial-author {
  	display: flex;
  	align-items: center;
  	gap: 18px;
  }

  .author-avatar {
  	width: 50px;
  	height: 50px;
  	border-radius: 100%;
  	overflow: hidden;
  }

  .author-avatar img {
  	width: 100%;
  	height: 100%;
  	object-fit: cover;
  }

  .author-info h3 {
  	font-weight: 600;
  	font-size: 14px;
  	color: #111928;
  }

  .author-info p {
  	font-size: 12px;
  	color: #8899a8;
  }

  .swiper-button-prev,
  .swiper-button-next {
  	background-color: #fff;
  	width: 35px;
  	height: 35px;
  	color: #3758f9;
  	border: 1px solid #f9fafb;
  	border-radius: 100%;
  	box-shadow: 0px 0px 20px 0px rgba(92, 115, 160, 0.2);
  }

  .swiper-button-prev::after {
  	content: '\f053';
  	font-family: 'Myriad Web Pro', sans-serif;
  	font-weight: 900;
  	font-size: 14px;
  }

  .swiper-button-next::after {
  	content: '\f054';
  	font-family: 'Myriad Web Pro', sans-serif;
  	font-weight: 900;
  	font-size: 14px;
  }

  .swiper-button-prev {
  	left: 3px;
  }

  .swiper-button-next {
  	right: 3px;
  }

  .swiper-pagination.active {
  	background-color: #3758f9;
  }

  /*--------------------------------------------------------------------- 
swiper.js fim 
---------------------------------------------------------------------*/


  .slider-container {
  	overflow: hidden;
  	position: relative;
  	width: 100%;
  	max-width: 1200px;
  	margin: auto;
  	border-radius: 10px;

  	touch-action: pan-y;
  }

  .slider-track {
  	display: flex;
  	animation: scroll 30s linear infinite;
  	width: calc(250px * 12);
  	overflow-x: scroll;
  	scroll-behavior: smooth;
  }

  .slider-track::-webkit-scrollbar {
  	display: none;
  }

  .slide {
  	width: 100px;
  	flex-shrink: 0;
  	margin: 1px;
  	margin-left: 100px;
  	border-radius: 8px;
  	text-align: center;
  	padding: 11px;
  }

  .slide img {
  	width: 100%;
  	height: auto;
  	border-radius: 6px;
  }

  @keyframes scroll {
  	0% {
  		transform: translateX(0);
  	}

  	100% {
  		transform: translateX(-50%);
  	}
  }

  @media (max-width: 1024px) {
  	.slide {
  		width: 200px;
  	}
  }

  @media (max-width: 768px) {
  	.slide {
  		width: 180px;
  	}
  }

  @media (max-width: 480px) {
  	.slide {
  		width: 150px;
  	}
  }

  /*--------------------------------------------------------------------- 
menu 
---------------------------------------------------------------------*/

  .menu2 {
  	display: flex;
  	gap: 20px;
  }

  .menu2 a {
  	color: white;
  	text-decoration: none;
  	display: flex;
  	align-items: center;
  	gap: 8px;
  	font-size: 18px;
  }

  .menu2 a i {
  	font-size: 20px;
  }

  .menu2 span.separator {
  	color: white;
  	font-size: 18px;
  }

  @media (max-width: 600px) {
  	.menu2 a span {
  		display: none;
  	}

  	.menu2 span.separator {
  		display: none;
  	}
  }

  .menu-service {

  	padding: 1px 0;
  }

  .menu-service ul {
  	list-style-type: none;
  	margin: 0;
  	padding: 0;
  	display: flex;
  	justify-content: center;
  	flex-wrap: wrap;
  }

  .menu-service ul li {
  	margin: 0 10px;
  }

  .menu-service ul li a {
  	display: block;
  	color: #ed1c24;
  	font-size: 16px;
  	text-decoration: none;
  	padding: 12px 12px;
  	border-radius: 25px;
  	transition: all 0.3s ease;
  }

  .menu-service ul li a:hover,
  .menu-service ul li a.active {
  	background: rgba(136, 3, 3, 0.2);
  	transform: scale(1.1);
  }

  .menu-service ul li a.active {
  	background: #ed1c24;
  	color: #ffffff;
  	border-radius: 50px;
  	padding: 12px 22px;
  	box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
  }

  @media screen and (max-width: 600px) {
  	.menu-service ul {
  		flex-direction: row;
  		flex-wrap: wrap;
  		justify-content: center;
  	}

  	.menu-service ul li {
  		margin: 5px;
  	}

  	.card {
  		top: -1.99px;
  		width: 300px;
  		height: 235px;
  		left: -5px;
  	}

  	.card_flex {
  		top: -1.99px;
  		width: 300px;
  		height: 235px;
  		left: -5px;
  	}
  }

  /*--------------------------------------------------------------------- 
fim 
---------------------------------------------------------------------*/


  /*--------------------------------------------------------------------- 
Area de como funciona 
---------------------------------------------------------------------*/


  .como-funciona {
  	text-align: center;
  	padding: 60px 20px;
  }

  .como-funciona h2 {
  	font-size: 28px;
  	margin-bottom: 50px;
  	font-weight: 700;
  	color: #0a0a0a;
  }

  .passos {
  	display: flex;
  	justify-content: center;
  	gap: 60px;
  	flex-wrap: wrap;
  }

  .passo {
  	max-width: 300px;
  }

  .numero {
  	width: 40px;
  	height: 40px;
  	margin: 0 auto 15px;
  	border-radius: 50%;
  	background-color: #e6f0ff;
  	color: #4a90e2;
  	display: flex;
  	align-items: center;
  	justify-content: center;
  	font-weight: bold;
  	font-size: 18px;
  }

  .passo h3 {
  	font-size: 18px;
  	font-weight: 600;
  	margin-bottom: 10px;
  	color: #0a0a0a;
  }

  .passo p {
  	font-size: 14px;
  	color: #666;
  	line-height: 1.5;
  }



  /*--------------------------------------------------------------------- 
fim 
---------------------------------------------------------------------*/









  .custom-btn .gif2 {
  	text-align: center;
  	max-width: 100%;
  	max-height: 100%;
  }


  body {
  	line-height: 1.5;
  	font-family: 'Myriad Web Pro', sans-serif;
  	font-weight: 400;
  	overflow-x: hidden;
  }

  * {
  	margin: 0;
  	box-sizing: border-box;
  }

  :before,
  :after {
  	box-sizing: border-box;
  }

  .container {
  	max-width: 1200px;
  	margin: auto;
  }

  .row {
  	display: flex;
  	flex-wrap: wrap;
  }

  .v-center {
  	align-items: center;
  }

  ul {
  	list-style: none;
  	margin: 0;
  	padding: 0;
  }

  a {
  	text-decoration: none;
  }

  /* header */
  .header1 {
  	display: block;
  	width: 100%;
  	position: relative;
  	z-index: 99;
  }

  .header1 .item-left {
  	flex: 0 0 17%;
  }

  .header1 .logo a {
  	font-size: 30px;
  	color: #000000;
  	font-weight: 700;
  	text-decoration: none;
  }

  .header1 .item-center {
  	flex: 0 0 66%;
  }

  .header1 .item-right {
  	flex: 0 0 17%;
  	display: flex;
  	justify-content: flex-end;
  }





  .header {
  	display: block;
  	width: 100%;
  	position: relative;
  	z-index: 99;
  	padding: 15px;
  }

  .header .item-left {
  	flex: 0 0 17%;
  }

  .header .logo a {
  	font-size: 30px;
  	color: #000000;
  	font-weight: 700;
  	text-decoration: none;
  }

  .header .item-center {
  	flex: 0 0 66%;
  }

  .header .item-right {
  	flex: 0 0 17%;
  	display: flex;
  	justify-content: flex-end;
  }

  .header .item-right a {
  	text-decoration: none;
  	font-size: 16px;
  	color: #555555;
  	display: inline-block;
  	margin-left: 10px;
  	transition: color 0.3s ease;
  }

  .header .menu>ul>li {
  	display: inline-block;
  	line-height: 50px;
  	margin-left: 25px;
  }

  .header .menu>ul>li>a {
  	font-size: 15px;
  	font-weight: 500;
  	color: #000000;
  	position: relative;
  	text-transform: capitalize;
  	transition: color 0.3s ease;
  }

  .header .menu>ul>li .sub-menu {
  	position: absolute;
  	z-index: 500;
  	background-color: #ffffff;
  	box-shadow: -2px 2px 70px -25px rgba(0, 0, 0, 0.3);
  	padding: 20px 30px;
  	transition: all 0.5s ease;
  	margin-top: 25px;
  	opacity: 0;
  	visibility: hidden;
  }

  @media(min-width: 992px) {
  	.header .menu>ul>li.menu-item-has-children:hover .sub-menu {
  		margin-top: 0;
  		visibility: visible;
  		opacity: 1;
  	}
  }

  .header .menu>ul>li .sub-menu>ul>li {
  	line-height: 1;
  }

  .header .menu>ul>li .sub-menu>ul>li>a {
  	display: inline-block;
  	padding: 10px 0;
  	font-size: 15px;
  	color: #555555;
  	transition: color 0.3s ease;
  	text-decoration: none;
  	text-transform: capitalize;
  }

  .header .menu>ul>li .single-column-menu {
  	min-width: 280px;
  	max-width: 350px;
  }

  .header .menu>ul>li .sub-menu.mega-menu>.list-item>ul>li {
  	line-height: 1;
  	display: block;

  }

  .header .menu>ul>li .sub-menu.mega-menu>.list-item>ul>li>a {
  	padding: 10px 0;
  	display: inline-block;
  	font-size: 15px;
  	color: #555555;
  	transition: color 0.3s ease;
  }

  .header .menu>ul>li .sub-menu.mega-menu {
  	left: 50%;
  	transform: translateX(-50%);
  }

  .header .menu>ul>li .sub-menu.mega-menu-column-4 {
  	max-width: 1100px;
  	width: 100%;
  	display: flex;
  	flex-wrap: wrap;
  	padding: 20px 15px;
  }

  .header .menu>ul>li .sub-menu.mega-menu-column-4>.list-item {
  	flex: 0 0 25%;
  	padding: 0 15px;
  }

  .header .menu>ul>li .sub-menu.mega-menu-column-4>.list-item .title {
  	font-size: 16px;
  	color: #b90000;
  	font-weight: 500;
  	line-height: 1;
  	padding: 10px 0;
  }

  .header .menu>ul>li .sub-menu.mega-menu-column-4>.list-item.text-center .title {
  	text-align: center;
  }

  .header .menu>ul>li .sub-menu.mega-menu-column-4>.list-item img {
  	max-width: 100%;
  	width: 100%;
  	vertical-align: middle;
  	margin-top: 10px;
  }

  .header .menu>ul>li .sub-menu.mega-menu>.list-item>ul>li>a:hover,
  .header .menu>ul>li .sub-menu>ul>li>a:hover,
  .header .item-right a:hover,
  .header .menu>ul>li:hover>a {
  	color: #ea4636;
  }

  /* banner section */
  .banner-section {
  	background-image: url('../img/banner.jpg');
  	background-size: cover;
  	background-position: center;
  	height: 700px;
  	width: 100%;
  	display: block;
  }

  .mobile-menu-head,
  .mobile-menu-trigger {
  	display: none;
  }

  .nos {
  	align-items: center;
  	justify-content: center;
  	background-color: #202020 !important;
  	position: relative;
  	border-radius: 10px;
  	background-position: center;
  	width: 100%;
  }


  /*responsive*/
  @media(max-width: 991px) {

  	.header .item-center {
  		order: 3;
  		flex: 0 0 100%;
  	}

  	.header .item-left,
  	.header .item-right {
  		flex: 0 0 auto;
  	}

  	.v-center {
  		justify-content: space-between;
  	}

  	.header .mobile-menu-trigger {
  		display: flex;
  		height: 30px;
  		width: 30px;
  		margin-left: 15px;
  		cursor: pointer;
  		align-items: center;
  		justify-content: center;
  	}

  	.header .mobile-menu-trigger span {
  		display: block;
  		height: 2px;
  		background-color: #333333;
  		width: 24px;
  		position: relative;
  	}

  	.header .mobile-menu-trigger span:before,
  	.header .mobile-menu-trigger span:after {
  		content: '';
  		position: absolute;
  		left: 0;
  		width: 100%;
  		height: 100%;
  		background-color: #333333;
  	}

  	.header .mobile-menu-trigger span:before {
  		top: -6px;
  	}

  	.header .mobile-menu-trigger span:after {
  		top: 6px;
  	}

  	.header .item-right {
  		align-items: center;
  	}

  	.header .menu {
  		position: fixed;
  		width: 320px;
  		background-color: #ffffff;
  		left: 0;
  		top: 0;
  		height: 100%;
  		overflow: hidden;
  		transform: translate(-100%);
  		transition: all 0.5s ease;
  		z-index: 1099;
  	}

  	.header .menu.active {
  		transform: translate(0%);
  	}

  	.header .menu>ul>li {
  		line-height: 1;
  		margin: 0;
  		display: block;
  	}

  	.header .menu>ul>li>a {
  		line-height: 50px;
  		height: 50px;
  		padding: 0 50px 0 15px;
  		display: block;
  		border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  	}

  	.header .menu>ul>li>a i {
  		position: absolute;
  		height: 50px;
  		width: 50px;
  		top: 0;
  		right: 0;
  		text-align: center;
  		line-height: 50px;
  		transform: rotate(-90deg);
  	}

  	.header .menu .mobile-menu-head {
  		display: flex;
  		height: 50px;
  		border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  		justify-content: space-between;
  		align-items: center;
  		position: relative;
  		z-index: 501;
  		position: sticky;
  		background-color: #ffffff;
  		top: 0;
  	}

  	.header .menu .mobile-menu-head .go-back {
  		height: 50px;
  		width: 50px;
  		border-right: 1px solid rgba(0, 0, 0, 0.1);
  		cursor: pointer;
  		line-height: 50px;
  		text-align: center;
  		color: #000000;
  		font-size: 16px;
  		display: none;
  	}

  	.header .menu .mobile-menu-head.active .go-back {
  		display: block;
  	}

  	.header .menu .mobile-menu-head .current-menu-title {
  		font-size: 15px;
  		font-weight: 500;
  		color: #000000;
  	}

  	.header .menu .mobile-menu-head .mobile-menu-close {
  		height: 50px;
  		width: 50px;
  		border-left: 1px solid rgba(0, 0, 0, 0.1);
  		cursor: pointer;
  		line-height: 50px;
  		text-align: center;
  		color: #000000;
  		font-size: 25px;
  	}

  	.header .menu .menu-main {
  		height: 100%;
  		overflow-x: hidden;
  		overflow-y: auto;
  	}

  	.header .menu>ul>li .sub-menu.mega-menu,
  	.header .menu>ul>li .sub-menu {
  		visibility: visible;
  		opacity: 1;
  		position: absolute;
  		box-shadow: none;
  		margin: 0;
  		padding: 15px;
  		top: 0;
  		left: 0;
  		width: 100%;
  		height: 100%;
  		padding-top: 65px;
  		max-width: none;
  		min-width: auto;
  		display: none;
  		transform: translateX(0%);
  		overflow-y: auto;
  	}

  	.header .menu>ul>li .sub-menu.active {
  		display: block;
  	}

  	@keyframes slideLeft {
  		0% {
  			opacity: 0;
  			transform: translateX(100%);
  		}

  		100% {
  			opacity: 1;
  			transform: translateX(0%);
  		}
  	}

  	@keyframes slideRight {
  		0% {
  			opacity: 1;
  			transform: translateX(0%);
  		}

  		100% {
  			opacity: 0;
  			transform: translateX(100%);
  		}
  	}

  	.header .menu>ul>li .sub-menu.mega-menu-column-4>.list-item img {
  		margin-top: 0;
  	}

  	.header .menu>ul>li .sub-menu.mega-menu-column-4>.list-item.text-center .title {
  		margin-bottom: 20px;
  	}

  	.header .menu>ul>li .sub-menu.mega-menu-column-4>.list-item.text-center:last-child .title {
  		margin-bottom: 0px;
  	}

  	.header .menu>ul>li .sub-menu.mega-menu-column-4>.list-item {
  		flex: 0 0 100%;
  		padding: 0px;
  	}

  	.header .menu>ul>li .sub-menu>ul>li>a,
  	.header .menu>ul>li .sub-menu.mega-menu>.list-item>ul>li>a {
  		display: block;
  	}

  	.header .menu>ul>li .sub-menu.mega-menu>.list-item>ul {
  		margin-bottom: 15px;
  	}

  	.menu-overlay {
  		position: fixed;
  		background-color: rgba(0, 0, 0, 0.5);
  		left: 0;
  		top: 0;
  		width: 100%;
  		height: 100%;
  		z-index: 1098;
  		visibility: hidden;
  		opacity: 0;
  		transition: all 0.5s ease;
  	}

  	.menu-overlay.active {
  		visibility: visible;
  		opacity: 1;
  	}
  }

  .card-site:hover {

  	border: 1px solid #e92f0b;
  	cursor: pointer;
  	line-height: 50px;
  	color: #e92f0b;

  	background-color: #dbd9d9;
  }


  /*--------------------------------------------------------------------- 
Icones
---------------------------------------------------------------------*/
  .ion--checkmark {
  	display: inline-block;
  	width: 1em;
  	height: 1em;

  	padding-left: 11px;
  	font-weight: bold;
  	--svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='32' d='M416 128L192 384l-96-96'/%3E%3C/svg%3E");
  	background-color: #b90000;
  	-webkit-mask-image: var(--svg);
  	mask-image: var(--svg);
  	-webkit-mask-repeat: no-repeat;
  	mask-repeat: no-repeat;
  	-webkit-mask-size: 100% 100%;
  	mask-size: 100% 100%;
  }

  .weui--close-filled {
  	display: inline-block;
  	width: 1em;
  	height: 1em;
  	--svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' fill-rule='evenodd' d='m12 10.586l5.657-5.657l1.414 1.414L13.414 12l5.657 5.657l-1.414 1.414L12 13.414l-5.657 5.657l-1.414-1.414L10.586 12L4.929 6.343L6.343 4.93z'/%3E%3C/svg%3E");
  	background-color: #b90000;
  	;
  	-webkit-mask-image: var(--svg);
  	mask-image: var(--svg);
  	-webkit-mask-repeat: no-repeat;
  	mask-repeat: no-repeat;
  	-webkit-mask-size: 100% 100%;
  	mask-size: 100% 100%;
  }



  .ion--desktop {
  	display: inline-block;
  	width: 3em;
  	height: 3em;
  	--svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23000' d='M16 352a48.05 48.05 0 0 0 48 48h133.88l-4 32H144a16 16 0 0 0 0 32h224a16 16 0 0 0 0-32h-49.88l-4-32H448a48.05 48.05 0 0 0 48-48v-48H16Zm240-16a16 16 0 1 1-16 16a16 16 0 0 1 16-16M496 96a48.05 48.05 0 0 0-48-48H64a48.05 48.05 0 0 0-48 48v192h480Z'/%3E%3C/svg%3E");
  	background-color: currentColor;
  	-webkit-mask-image: var(--svg);
  	mask-image: var(--svg);
  	-webkit-mask-repeat: no-repeat;
  	mask-repeat: no-repeat;
  	-webkit-mask-size: 100% 100%;
  	mask-size: 100% 100%;
  }




  .jam--database-f {
  	display: inline-block;

  	padding-right: 35px;
  	width: 1.1em;
  	height: 1.1em;
  	--svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-2 -2 24 24'%3E%3Cpath fill='%23000' d='M3 10a3 3 0 0 1-3-3V3a3 3 0 0 1 3-3h14a3 3 0 0 1 3 3v4a3 3 0 0 1-3 3a3 3 0 0 1 3 3v4a3 3 0 0 1-3 3H3a3 3 0 0 1-3-3v-4a3 3 0 0 1 3-3m5 6a1 1 0 1 0 0-2a1 1 0 0 0 0 2m-3 0a1 1 0 1 0 0-2a1 1 0 0 0 0 2M5 6a1 1 0 1 0 0-2a1 1 0 0 0 0 2m3 0a1 1 0 1 0 0-2a1 1 0 0 0 0 2'/%3E%3C/svg%3E");
  	background-color: currentColor;
  	-webkit-mask-image: var(--svg);
  	mask-image: var(--svg);
  	-webkit-mask-repeat: no-repeat;
  	mask-repeat: no-repeat;
  	-webkit-mask-size: 100% 100%;
  	mask-size: 100% 100%;
  }

  .fluent--phone-desktop-regular {
  	display: inline-block;

  	padding-right: 35px;
  	width: 1.1em;
  	height: 1.1em;
  	--svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'%3E%3Cpath fill='%23000' d='M9.747 10a2.25 2.25 0 0 1 2.244 2.096l.006.154v11.5A2.25 2.25 0 0 1 9.9 25.995L9.747 26H4.25a2.25 2.25 0 0 1-2.245-2.096L2 23.75v-11.5a2.25 2.25 0 0 1 2.096-2.245L4.25 10zm0 1.5H4.25a.75.75 0 0 0-.743.648l-.007.102v11.5c0 .38.282.694.648.743l.102.007h5.497a.75.75 0 0 0 .743-.648l.007-.102v-11.5a.75.75 0 0 0-.649-.743zm-1.997 10a.75.75 0 0 1 .102 1.493L7.75 23H6.249a.75.75 0 0 1-.102-1.493l.102-.007zM23.753 2a2.25 2.25 0 0 1 2.244 2.096l.006.154V15.5a2.25 2.25 0 0 1-2.096 2.245l-.154.005h-4.755v2.75h1.252a.75.75 0 0 1 .102 1.493L20.25 22H13v-1.5h4.498v-2.75H13v-1.5h10.753a.75.75 0 0 0 .743-.648l.007-.102V4.25a.75.75 0 0 0-.649-.743l-.101-.007H7.25a.75.75 0 0 0-.743.648L6.5 4.25V9H5V4.25a2.25 2.25 0 0 1 2.096-2.245L7.25 2z'/%3E%3C/svg%3E");
  	background-color: currentColor;
  	-webkit-mask-image: var(--svg);
  	mask-image: var(--svg);
  	-webkit-mask-repeat: no-repeat;
  	mask-repeat: no-repeat;
  	-webkit-mask-size: 100% 100%;
  	mask-size: 100% 100%;
  }

  .fluent--phone-desktop-filled {
  	display: inline-block;

  	padding-right: 35px;
  	width: 1.1em;
  	height: 1.1em;
  	--svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='%23000' d='M5 5.25A3.25 3.25 0 0 1 8.25 2h18.5A3.25 3.25 0 0 1 30 5.25v12.5A3.25 3.25 0 0 1 26.75 21H22v3h2a1 1 0 1 1 0 2h-9.5v-2H20v-3h-5.5v-5.75a4.75 4.75 0 0 0-4.75-4.75h-4.5a5 5 0 0 0-.25.007zm-3 10A3.25 3.25 0 0 1 5.25 12h4.5A3.25 3.25 0 0 1 13 15.25v11.5A3.25 3.25 0 0 1 9.75 30h-4.5A3.25 3.25 0 0 1 2 26.75zM6 26a1 1 0 0 0 1 1h1a1 1 0 1 0 0-2H7a1 1 0 0 0-1 1'/%3E%3C/svg%3E");
  	background-color: currentColor;
  	-webkit-mask-image: var(--svg);
  	mask-image: var(--svg);
  	-webkit-mask-repeat: no-repeat;
  	mask-repeat: no-repeat;
  	-webkit-mask-size: 100% 100%;
  	mask-size: 100% 100%;
  }

  .fluent--globe-desktop-filled {
  	display: inline-block;

  	padding-right: 35px;
  	width: 1.1em;
  	height: 1.1em;
  	--svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M11 16.5H8.904l.058.295C9.6 19.905 10.803 22 12 22c.495 0 .992-.358 1.449-.999H13a2 2 0 0 1-2-2zm0-1.5H8.674a26 26 0 0 1-.132-4.512L8.576 10h6.849q.076.97.077 2H13a2 2 0 0 0-2 2zm11.002-3h-5q0-.681-.032-1.343L16.932 10h4.87c.13.645.2 1.314.2 1.999m-14.63 4.5l-4.306.001l.146.279a10.03 10.03 0 0 0 5.952 4.814c-.81-1.24-1.428-3.011-1.792-5.093M7.069 10h-4.87a10.05 10.05 0 0 0 .257 5H7.16l-.057-.58A28 28 0 0 1 7.069 10m7.767-7.593l.108.17c.88 1.43 1.522 3.507 1.837 5.923h4.591a10.03 10.03 0 0 0-6.536-6.093m-5.672 0l-.122.037A10.03 10.03 0 0 0 2.628 8.5H7.22l.062-.44c.347-2.324 1.002-4.304 1.883-5.653m6.05 5.778C14.646 4.544 13.32 2.002 12 2.002c-1.356 0-2.721 2.689-3.26 6.498h6.52zM12 14a1 1 0 0 1 1-1h9a1 1 0 0 1 1 1v5a1 1 0 0 1-1 1h-3v2h.5a.5.5 0 0 1 0 1h-4a.5.5 0 0 1 0-1h.5v-2h-3a1 1 0 0 1-1-1z'/%3E%3C/svg%3E");
  	background-color: currentColor;
  	-webkit-mask-image: var(--svg);
  	mask-image: var(--svg);
  	-webkit-mask-repeat: no-repeat;
  	mask-repeat: no-repeat;
  	-webkit-mask-size: 100% 100%;
  	mask-size: 100% 100%;
  }

  .solar--shop-minimalistic-bold-duotone {
  	display: inline-block;

  	padding-right: 35px;
  	width: 1.1em;
  	height: 1.1em;
  	--svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M19 14.25a.75.75 0 0 1 .75.75v6.25H21a.75.75 0 0 1 0 1.5H3a.75.75 0 0 1 0-1.5h1.25V15a.75.75 0 0 1 1.5 0v6.25h12.5V15a.75.75 0 0 1 .75-.75' opacity='0.5'/%3E%3Cpath fill='%23000' d='M16.528 2H7.472c-1.203 0-1.804 0-2.287.299c-.484.298-.753.836-1.29 1.912L2.49 7.76c-.324.82-.608 1.786-.062 2.479A2 2 0 0 0 6 9a2 2 0 1 0 4 0a2 2 0 1 0 4 0a2 2 0 1 0 4 0a2 2 0 0 0 3.571 1.238c.546-.693.262-1.659-.062-2.479l-1.404-3.548c-.537-1.076-.806-1.614-1.29-1.912C18.332 2 17.731 2 16.528 2'/%3E%3C/svg%3E");
  	background-color: currentColor;
  	-webkit-mask-image: var(--svg);
  	mask-image: var(--svg);
  	-webkit-mask-repeat: no-repeat;
  	mask-repeat: no-repeat;
  	-webkit-mask-size: 100% 100%;
  	mask-size: 100% 100%;
  }

  .tabler--world-www {
  	display: inline-block;
  	padding-right: 35px;
  	width: 1.1em;
  	height: 1.1em;
  	--svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M19.5 7A9 9 0 0 0 12 3a8.99 8.99 0 0 0-7.484 4'/%3E%3Cpath d='M11.5 3a17 17 0 0 0-1.826 4M12.5 3a17 17 0 0 1 1.828 4M19.5 17a9 9 0 0 1-7.5 4a8.99 8.99 0 0 1-7.484-4'/%3E%3Cpath d='M11.5 21a17 17 0 0 1-1.826-4m2.826 4a17 17 0 0 0 1.828-4M2 10l1 4l1.5-4L6 14l1-4m10 0l1 4l1.5-4l1.5 4l1-4M9.5 10l1 4l1.5-4l1.5 4l1-4'/%3E%3C/g%3E%3C/svg%3E");
  	background-color: currentColor;
  	-webkit-mask-image: var(--svg);
  	mask-image: var(--svg);
  	-webkit-mask-repeat: no-repeat;
  	mask-repeat: no-repeat;
  	-webkit-mask-size: 100% 100%;
  	mask-size: 100% 100%;
  }

  /*--------------------------------------------------------------------- 
fim area do Plano  plan-price
---------------------------------------------------------------------*/




  p.sub {
  	font-size: 16px;
  	margin-bottom: 40px;
  	color: #666;
  }


  .plano {
		margin-bottom: 40px;
  	background: #fff;
  	border-radius: 12px;
  	padding: 30px 20px;
  	flex: 1 1 300px;
  	box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.08);
  	text-align: left;
  	position: relative;
  	display: flex;
  	flex-direction: column;
  	justify-content: space-between;
  }

  .plano h3 {
  	margin: 0;
  	font-size: 22px;
  	color: #222;
  }

  .plano .preco {
  	font-size: 46px;
  	font-weight: bold;
  	margin: 10px 0;
  	color: #000;
  }

  .plano .preco small {
  	font-size: 18px;
  	color: #666;
  	font-weight: normal;
  }

  .plano ul {
  	padding-left: 20px;
  	margin: 20px 0;
  }

  .plano ul li {
  	margin-bottom: 15px;
  	font-size: 16px;
  	color: #444;
  }

  .btn {
  	display: block;
  	text-align: center;
  	background: #b70000;
  	color: #fff;
  	text-decoration: none;
  	padding: 15px;
  	border-radius: 28px;
  	font-weight: bold;
  	transition: background 0.3s;
  }

  .btn:hover {
  	background: #900000;
  }

  /* Destaque do plano */
  .plano.destacado {
  	background: #b70000;
  	color: #fff;
  }

  .plano.destacado h3,
  .plano.destacado .preco,
  .plano.destacado ul li {
  	color: #fff;
  }

  .plano.destacado .preco small {
  	color: #f1f1f1;
  }

  .plano.destacado .btn {
  	background: #fff;
  	color: #b70000;
  }

  .plano.destacado .btn:hover {
  	background: #f2f2f2;
  }

  .most-popular {
  	position: absolute;
  	top: -12px;
  	left: 50%;
  	transform: translateX(-50%);
  	background: #fff;
  	color: #b70000;
  	padding: 9px 15px;
  	border-radius: 20px;
  	font-size: 14px;
  	font-weight: bold;
  	border: 1px solid #b70000;
  }

  /* Responsivo */
  @media (max-width: 900px) {
  	.planos {
  		flex-direction: column;
  		align-items: center;
  	}
  }


















  @import url(https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css);
  @import url(https://fonts.googleapis.com/css?family=Raleway:400,500,800);
  @import url(https://fonts.googleapis.com/css?family=Montserrat:800);

  /*--------------------------------------------------------------------- 
Card do menu
---------------------------------------------------------------------*/



  .parallax-bg {
  	position: absolute;
  	left: 0;
  	top: 0;
  	width: 130%;
  	height: 100%;
  	-webkit-background-size: cover;
  	background-size: cover;
  	background-position: center;
  }

  .swiper-slide .title {
  	font-size: 41px;
  	font-weight: 300;
  }

  .swiper-slide .subtitle {
  	font-size: 21px;
  }

  .swiper-slide .text {
  	font-size: 14px;
  	max-width: 400px;
  	line-height: 1.3;
  }

  /*--------------------------------------------------------------------- 
Galeria projecto com scroool na imagem
---------------------------------------------------------------------*/

  .gallery2 {
  	display: grid;
  	grid-template-columns: repeat(4, 1fr);
  	gap: 5px;
  	padding: 20px;
  	/* diminui espaço entre imagens */
  	width: 100vw;
  	height: 50vh;
  	/* ocupa toda altura da tela */
  }

  .card2 {
  	position: relative;
  	overflow: hidden;
  	border-radius: 10px;
  }

  .card2 img {
  	width: 100%;
  	height: 100%;
  	object-fit: cover;
  	transition: transform 6s ease;
  	display: block;
  }

  .card2:hover img {
  	transform: translateY(-30%);
  }

  /* Botão ocupa toda a largura embaixo da imagem */
  .card2 .project-btn {
  	position: absolute;
  	bottom: 0;
  	left: 0;
  	width: 100%;
  	background: rgba(0, 0, 0, 0.75);
  	color: #fff;
  	padding: 12px 0;
  	font-size: 15px;
  	text-align: center;
  	text-decoration: none;
  	font-weight: bold;
  	transition: background 0.3s ease;
  }

  .card2 .project-btn:hover {
  	background: #b70000;
  }

  /* Fancybox ocupa toda a tela */
  .fancybox__container {
  	background: #000;
  }

  .fancybox__slide {
  	padding: 0 !important;
  }

  .fancybox__content {
  	width: 100% !important;
  	height: 100% !important;
  	max-width: none !important;
  	max-height: none !important;
  }

  .fancybox__image {
  	object-fit: contain;
  	width: 100% !important;
  	height: 100% !important;
  }

  /* Botão no fullscreen */
  .fancybox__caption {
  	display: flex;
  	justify-content: center;
  	margin-top: 15px;
  }

  .fancybox__caption a {
  	display: inline-block;
  	width: 100%;
  	background: #ff6600;
  	color: #fff;
  	padding: 14px 0;
  	font-size: 16px;
  	font-weight: bold;
  	text-decoration: none;
  	transition: background 0.3s ease;
  	text-align: center;
  }

  .fancybox__caption a:hover {
  	background: #e05500;
  }


  /* RESPONSIVIDADE */
  @media (max-width: 768px) {

  	.gallery2 {
  		display: grid;
  		grid-template-columns: repeat(1, 1fr);
  		gap: 5px;
  		padding: 20px;
  		/* diminui espaço entre imagens */
  		width: 98vw;
  		height: 280px;
  		/* ocupa toda altura da tela */
  	}

  	.card img {
  		height: 200px;
  		/* altura menor para telas pequenas */
  	}
  }

  /*--------------------------------------------------------------------- 
Galeria projecto 
---------------------------------------------------------------------*/
  #gallery {
  	position: relative;
  	width: 100vw;
  	height: 100%;
  	min-height: 100%;
  	display: table;
  	transition: all ease 1s;
  	background-color: #fff;
  	overflow-x: hidden;
  }

  #gallery .item {
  	width: 20%;
  	display: block;
  	float: left;
  	transition: all ease 400ms;
  	background-color: #000;
  	position: relative;
  }

  #gallery .item:hover,
  #gallery .item:focus {
  	transform: scale(1.2);
  	z-index: 50;
  	box-shadow: 0 0 10px black;
  }

  #gallery .item figure {
  	transition: all ease 1s;
  	overflow: hidden;
  	height: 260px;
  	padding: 0;
  	margin: 0;
  	position: relative;
  }

  #gallery .item figure img {
  	transform: scale(1.1);
  	transition: all ease 1s;
  }

  #gallery .item:hover figure,
  #gallery .item:focus figure {
  	transition: all ease 400ms;
  }

  #gallery .item:hover figure img,
  #gallery .item:focus figure img {
  	transform: scale(1.4);
  	transition: all ease 1s;
  }

  #gallery.hover {
  	transition: all ease 1s;
  	/*   opacity:.7; */
  }

  #gallery.hover .item {
  	opacity: .9;
  	filter: blur(1px);
  }

  #gallery.hover .item:hover,
  #gallery.hover .item:focus {
  	opacity: 1;
  	filter: blur(0);
  }

  #gallery .item figcaption {
  	position: absolute;
  	font-size: 18px;
  	color: #fff;
  	width: 100%;
  	height: 100%;
  	padding: 10%;
  	display: flex;
  	justify-content: center;
  	align-items: center;
  	text-align: center;
  	top: 0;
  	left: 0;
  	transform: scale(1.3);
  	filter: blur(4px);
  	opacity: 0;
  	transition: 500ms;
  	background-color: rgba(0, 154, 178, .6);
  	text-transform: uppercase;
  	font-weight: bold;
  }

  #gallery .item:hover figcaption,
  #gallery .item:focus figcaption {
  	transform: scale(1);
  	filter: blur(0);
  	opacity: 1;
  	transition: 300ms;
  }

  @media (max-width:1368px) {
  	#gallery .item {
  		width: 25%;
  	}
  }

  @media (max-width:1080px) {
  	#gallery .item {
  		width: 33.3%;
  	}
  }

  @media (max-width:800px) {
  	#gallery .item {
  		width: 50%;
  	}

  	#gallery .item figure {
  		height: 250px;
  	}

  	#gallery .item figure img {
  		transform: rotate(0) scale(1);
  		transition: all ease 1s;
  		width: auto;
  		min-width: 100%;
  		height: 100%;
  		min-height: 250px;
  	}

  	#gallery .item:hover figure img {
  		transform: rotate(0) scale(1);

  	}
  }

  @media (max-width:500px) {
  	#gallery .item {
  		width: 100%;
  	}

  	#gallery .item figure {
  		height: 250px;
  	}
  }





  /*--------------------------------------------------------------------- 
novo
---------------------------------------------------------------------*/

  /*

TemplateMo 590 topic listing

https://templatemo.com/tm-590-topic-listing

*/

  /*---------------------------------------
  CUSTOM PROPERTIES ( VARIABLES )             
-----------------------------------------*/
  :root {
  	--white-color: #ffffff;
  	--primary-color: #13547a;
  	--section-bg-color: #f0f8ff;
  	--custom-btn-bg-color: rgb(214, 16, 16);
  	--custom-btn-bg-hover-color: #13547a;
  	--dark-color: #000000;
  	--p-color: #717275;
  	--border-color: #7fffd4;
  	--link-hover-color: #13547a;

  	--body-font-family: 'Myriad Web Pro', sans-serif;
  	--title-font-family: 'Myriad Web Pro', sans-serif;

  	--h1-font-size: 58px;
  	--h2-font-size: 46px;
  	--h3-font-size: 32px;
  	--h4-font-size: 28px;
  	--h5-font-size: 24px;
  	--h6-font-size: 15px;
  	--p-font-size: 16px;
  	--menu-font-size: 14px;
  	--btn-font-size: 18px;
  	--copyright-font-size: 16px;

  	--border-radius-large: 100px;
  	--border-radius-medium: 20px;
  	--border-radius-small: 10px;

  	--font-weight-normal: 400;
  	--font-weight-medium: 500;
  	--font-weight-semibold: 600;
  	--font-weight-bold: 700;
  }



  /*---------------------------------------
	TYPOGRAPHY               
  -----------------------------------------*/

  h2,
  h3,
  h4,
  h5,
  h6 {
  	color: var(--dark-color);
  }

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
  	font-family: var(--title-font-family);
  	font-weight: var(--font-weight-semibold);
  }

  h1 {
  	font-size: var(--h1-font-size);
  	font-weight: var(--font-weight-bold);
  }

  h2 {
  	font-size: var(--h2-font-size);
  	font-weight: var(--font-weight-bold);
  }

  h3 {
  	font-size: var(--h3-font-size);
  }

  h4 {
  	font-size: var(--h4-font-size);
  }

  h5 {
  	font-size: var(--h5-font-size);
  }

  h6 {
  	color: var(--primary-color);
  	font-size: var(--h6-font-size);
  }

  p {
  	color: var(--p-color);
  	font-size: var(--p-font-size);
  	font-weight: var(--font-weight-normal);
  }

  ul li {
  	color: var(--p-color);
  	font-size: var(--p-font-size);
  	font-weight: var(--font-weight-normal);
  }

  a,
  button {
  	touch-action: manipulation;
  	transition: all 0.3s;
  }

  a {
  	display: inline-block;
  	color: var(--primary-color);
  	text-decoration: none;
  }

  a:hover {
  	color: var(--link-hover-color);
  }

  b,
  strong {
  	font-weight: var(--font-weight-bold);
  }


  /*---------------------------------------
	SECTION               
  -----------------------------------------*/
  .section-padding {
  	padding-top: 100px;
  	padding-bottom: 100px;
  }

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

  .section-overlay {
  	background-image: linear-gradient(15deg, #000000 0%, #000000 100%);
  	position: absolute;
  	top: 0;
  	left: 0;
  	pointer-events: none;
  	width: 100%;
  	height: 100%;
  	opacity: 0.85;
  }

  .section-overlay2 {
  	background-image: linear-gradient(15deg, #00183b 0%, #00183b 100%);
  	position: absolute;
  	left: 0;
  	pointer-events: none;
  	width: 100%;
  	height: 800px;

  }

  .section-overlay+.container {
  	position: relative;
  }

  .tab-content {
  	background-color: var(--white-color);
  	border-radius: var(--border-radius-medium);
  }

  .nav-tabs {
  	border-bottom: 1px solid #ecf3f2;
  	margin-bottom: 40px;
  	justify-content: center;
  }

  .nav-tabs .nav-link {
  	border-radius: 0;
  	border-top: 0;
  	border-right: 0;
  	border-left: 0;
  	color: var(--p-color);
  	font-family: var(--title-font-family);
  	font-size: var(--btn-font-size);
  	font-weight: var(--font-weight-medium);
  	padding: 15px 25px;
  	transition: all 0.3s;
  }

  .nav-tabs .nav-link:first-child {
  	margin-right: 20px;
  }

  .nav-tabs .nav-item.show .nav-link,
  .nav-tabs .nav-link.active,
  .nav-tabs .nav-link:focus,
  .nav-tabs .nav-link:hover {
  	border-bottom-color: var(--primary-color);
  	color: var(--primary-color);
  }


  /*---------------------------------------
	CUSTOM ICON COLOR               
  -----------------------------------------*/
  .custom-icon {
  	color: var(--secondary-color);
  }


  /*---------------------------------------
	CUSTOM BUTTON               
  -----------------------------------------*/
  .custom-btn {
  	background: var(--custom-btn-bg-color);
  	border: 2px solid transparent;
  	border-radius: var(--border-radius-large);
  	color: var(--white-color);
  	font-size: var(--btn-font-size);
  	font-weight: var(--font-weight-semibold);
  	line-height: normal;
  	transition: all 0.3s;
  	padding: 10px 20px;
  }

  .custom-btn:hover {
  	background: var(--custom-btn-bg-hover-color);
  	color: var(--white-color);
  }

  .custom-border-btn {
  	background: transparent;
  	border: 2px solid var(--custom-btn-bg-color);
  	color: var(--custom-btn-bg-color);
  }

  .custom-border-btn:hover {
  	background: var(--custom-btn-bg-color);
  	border-color: transparent;
  	color: var(--white-color);
  }

  .custom-btn-bg-white {
  	border-color: var(--white-color);
  	color: var(--white-color);
  }


  /*---------------------------------------
	TOPICS              
  -----------------------------------------*/
  .featured-section {
  	background-color: var(--secondary-color);
  	border-radius: 0 0 100px 100px;
  	padding-bottom: 100px;
  }

  .featured-section .row {
  	position: relative;
  	bottom: 100px;
  	margin-bottom: -100px;
  }

  .custom-block {
  	border-radius: var(--border-radius-medium);
  	position: relative;
  	overflow: hidden;
  	padding: 30px;
  	transition: all 0.3s ease;
  	/*height: 100%;*/
  }

  .custom-block:hover {
  	background-color: var(--secondary-color);
  	transform: translateY(-3px);
  }

  .custom-block>a {
  	width: 100%;
  }

  .custom-block-image {
  	display: block;
  	width: 100%;
  	height: 200px;
  	object-fit: cover;
  	margin-top: 35px;
  }

  .custom-block .rounded-pill {
  	border-radius: 5px !important;
  	display: flex;
  	justify-content: center;
  	text-align: center;
  	width: 30px;
  	height: 30px;
  	line-height: 20px;
  }

  .custom-block-overlay {
  	height: 100%;
  	min-height: 350px;
  	padding: 0;
  }

  .custom-block-overlay>a {
  	height: 100%;
  }

  .custom-block-overlay .custom-block-image {
  	border-radius: var(--border-radius-medium);
  	display: block;
  	height: 100%;
  	margin-top: 0;
  }

  .custom-block-overlay-text {
  	position: absolute;
  	z-index: 2;
  	top: 0;
  	right: 0;
  	left: 0;
  	padding: 30px;
  }

  .social-share {
  	position: absolute;
  	bottom: 0;
  	right: 0;
  	left: 0;
  	z-index: 2;
  	padding: 20px 35px;
  }

  .social-share .bi-bookmark {
  	color: var(--white-color);
  	font-size: var(--h5-font-size);
  }

  .social-share .bi-bookmark:hover {
  	color: var(--secondary-color);
  }

  .bg-design {
  	background-color: #00B0FF;
  }

  .bg-graphic {
  	background-color: #00BFA6;
  }

  .bg-advertising {
  	background-color: #F50057;
  }

  .bg-finance {
  	background-color: #536DFE;
  }

  .bg-music {
  	background-color: #F9A826;
  }

  .bg-education {
  	background-color: #00BFA6;
  }






  /*---------------------------------------
	SOCIAL ICON               
  -----------------------------------------*/
  .social-icon {
  	margin: 0;
  	padding: 0;
  }

  .social-icon-item {
  	list-style: none;
  	display: inline-block;
  	vertical-align: top;
  }

  .social-icon-link {
  	background: var(--secondary-color);
  	border-radius: var(--border-radius-large);
  	color: var(--white-color);
  	font-size: var(--copyright-font-size);
  	display: block;
  	margin-right: 10px;
  	text-align: center;
  	width: 35px;
  	height: 35px;
  	line-height: 36px;
  	transition: background 0.2s, color 0.2s;
  }

  .social-icon-link:hover {
  	background: var(--primary-color);
  	color: var(--white-color);
  }


  .escolher {
  	padding-top: 5%;
  }

  /*---------------------------------------
	RESPONSIVE STYLES               
  -----------------------------------------*/
  @media screen and (max-width: 991px) {
  	h1 {
  		font-size: 48px;
  	}

  	h2 {
  		font-size: 36px;
  	}

  	h3 {
  		font-size: 32px;
  	}

  	h4 {
  		font-size: 28px;
  	}

  	h5 {
  		font-size: 20px;
  	}

  	h6 {
  		font-size: 18px;
  	}

  	.section-padding {
  		padding-top: 50px;
  		padding-bottom: 50px;
  	}

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

  	.navbar-nav .dropdown-menu {
  		position: relative;
  		left: 10px;
  		opacity: 1;
  		pointer-events: auto;
  		max-width: 155px;
  		margin-top: 10px;
  		margin-bottom: 15px;
  	}

  	.navbar-expand-lg .navbar-nav {
  		padding-bottom: 20px;
  	}

  	.navbar-expand-lg .navbar-nav .nav-link {
  		padding: 0;
  	}

  	.nav-tabs .nav-link:first-child {
  		margin-right: 5px;
  	}

  	.nav-tabs .nav-link {
  		font-size: var(--copyright-font-size);
  		padding: 10px;
  	}

  	.featured-section {
  		border-radius: 0 0 80px 80px;
  		padding-bottom: 50px;
  	}

  	.custom-block-topics-listing .custom-block-image {
  		width: auto;
  	}

  	.custom-block-topics-listing>.d-flex,
  	.custom-block-topics-listing-info,
  	.custom-block-topics-listing a {
  		flex-direction: column;
  	}

  	.timeline-container .vertical-scrollable-timeline .list-progress {
  		height: 75%;
  	}

  	.timeline-container .vertical-scrollable-timeline li {
  		padding-left: 135px;
  	}

  	.subscribe-form-wrap {
  		padding-top: 30px;
  		padding-bottom: 0;
  	}
  }

  @media screen and (max-width: 480px) {
  	h1 {
  		font-size: 36px;
  	}

  	h2 {
  		font-size: 28px;
  	}

  	h3 {
  		font-size: 26px;
  	}

  	h4 {
  		font-size: 22px;
  	}

  	h5 {
  		font-size: 20px;
  	}

  	.section-overlay2 {

  		width: 100%;
  		height: 1500px;
  		opacity: 0.85;
  	}

  	.escolher {
  		padding-top: 50px;
  	}
  }



  .footer2 {
  	background: #222;
  	color: #ddd;
  	padding: 40px 20px;
  	margin-top: auto;
  }

  .footer-container {
  	display: grid;
  	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  	gap: 20px;
  	max-width: 1200px;
  	margin: auto;
  }

  .footer-col h4 {
  	margin-bottom: 15px;
  	font-size: 18px;
  	color: #fff;
  	border-left: 3px solid #b90000;
  	padding-left: 8px;
  }

  .footer-col p {
  	font-size: 15px;
  	color: #bbb;  
  }

  .footer-col ul {
  	list-style: none;
  	padding: 0;
  }

  .footer-col ul li {
  	margin: 4px 0;
  }

  .footer-col ul li a {
  	text-decoration: none;
  	color: #bbb;
  	transition: 0.3s;
  	font-size: 14px;
  }

  .footer-col ul li a:hover {
  	color: #b90000;
  }

  .social-links a {
  	display: inline-block;
  	margin-right: 10px;
  	font-size: 20px;
  	color: #bbb;
  	transition: 0.3s;
  }

  .social-links a:hover {
  	color: #b90000;
  }

  .footer-bottom {
  	text-align: center;
  	margin-top: 20px;
  	font-size: 14px;
  	color: #aaa;
  	border-top: 1px solid #333;
  	padding-top: 10px;
  }

 

       .lista-limpa {
            list-style: none; /* Remove as bolinhas padrão */
            padding: 0; 
        }

        .lista-limpa li {
            background: #ffffff; 
            display: flex;
            align-items: center;
            transition: transform 0.2s, box-shadow 0.2s;
            cursor: pointer;
        }

        /* Adiciona um ícone antes do texto usando CSS */
        .lista-limpa li::before {
            content: "•";
            color: #b90000;
            font-weight: bold;
            margin-right: 10px;
            font-size: 1.5em;
        }