/* Estilos Personalizados para o Site da Morpho Evolution */
 .banner-about {
     position: relative;
     width: 100%;
     height: 600px;
     background: linear-gradient(135deg, #0f0c29 0%, #1a1a3e 50%, #24243e 100%);
     overflow: hidden;
     display: flex;
     align-items: center;
     justify-content: center;
 }

 /* Elementos 3D de fundo */
 .tech-background {
     position: absolute;
     width: 100%;
     height: 100%;
     perspective: 1000px;
     overflow: hidden;
 }

 /* Cubos 3D flutuantes */
 .cube {
     position: absolute;
     width: 100px;
     height: 100px;
     transform-style: preserve-3d;
     animation: float 20s infinite ease-in-out;
 }

 .cube-face {
     position: absolute;
     width: 100px;
     height: 100px;
     background: rgba(79, 172, 254, 0.1);
     border: 1px solid rgba(79, 172, 254, 0.3);
     backdrop-filter: blur(10px);
 }

 .cube-face.front {
     transform: rotateY(0deg) translateZ(50px);
 }

 .cube-face.back {
     transform: rotateY(180deg) translateZ(50px);
 }

 .cube-face.right {
     transform: rotateY(90deg) translateZ(50px);
 }

 .cube-face.left {
     transform: rotateY(-90deg) translateZ(50px);
 }

 .cube-face.top {
     transform: rotateX(90deg) translateZ(50px);
 }

 .cube-face.bottom {
     transform: rotateX(-90deg) translateZ(50px);
 }

 .cube:nth-child(1) {
     left: 10%;
     top: 20%;
     animation-delay: 0s;
 }

 .cube:nth-child(2) {
     right: 15%;
     top: 60%;
     animation-delay: -5s;
 }

 .cube:nth-child(3) {
     left: 70%;
     top: 30%;
     animation-delay: -10s;
 }

 /* Circuitos tecnológicos */
 .circuit {
     position: absolute;
     width: 100%;
     height: 100%;
     opacity: 0.3;
 }

 .circuit-line {
     position: absolute;
     background: linear-gradient(90deg, transparent, #4facfe, transparent);
     height: 2px;
     animation: circuit-flow 4s infinite linear;
 }

 .circuit-line:nth-child(1) {
     width: 40%;
     left: 5%;
     top: 25%;
     animation-delay: 0s;
 }

 .circuit-line:nth-child(2) {
     width: 50%;
     right: 10%;
     top: 50%;
     animation-delay: 1s;
 }

 .circuit-line:nth-child(3) {
     width: 35%;
     left: 20%;
     bottom: 30%;
     animation-delay: 2s;
 }

 /* Código flutuante */
 .code-particles {
     position: absolute;
     width: 100%;
     height: 100%;
 }

 .code-line {
     position: absolute;
     color: #4facfe;
     font-family: 'Courier New', monospace;
     font-size: 14px;
     opacity: 0;
     animation: code-float 15s infinite ease-in-out;
 }

 .code-line:nth-child(1) {
     left: 5%;
     top: 15%;
     animation-delay: 0s;
 }

 .code-line:nth-child(2) {
     right: 10%;
     top: 40%;
     animation-delay: 3s;
 }

 .code-line:nth-child(3) {
     left: 15%;
     bottom: 20%;
     animation-delay: 6s;
 }

 .code-line:nth-child(4) {
     right: 20%;
     top: 70%;
     animation-delay: 9s;
 }

 /* Conteúdo principal */
 .banner-content {
     position: relative;
     z-index: 10;
     text-align: center;
     max-width: 900px;
     padding: 40px;
 }

 .banner-title {
     font-size: 64px;
     font-weight: 700;
     background: linear-gradient(135deg, #4facfe 0%, #00f2fe 50%, #a78bfa 100%);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
     margin-bottom: 20px;
     text-shadow: 0 0 40px rgba(79, 172, 254, 0.5);
     animation: title-glow 3s ease-in-out infinite;
 }

 .banner-subtitle {
     font-size: 24px;
     color: #a0aec0;
     margin-bottom: 30px;
     font-weight: 300;
     letter-spacing: 2px;
 }

 .banner-description {
     font-size: 18px;
     color: #cbd5e0;
     line-height: 1.8;
     margin-bottom: 40px;
 }

 /* Botão CTA */
 .cta-button {
     display: inline-block;
     padding: 18px 50px;
     background: linear-gradient(135deg, #4facfe 0%, #0abdc7ce 100%);
     color: #fff;
     text-decoration: none;
     font-size: 18px;
     font-weight: 600;
     border-radius: 10px;
     position: relative;
     overflow: hidden;
     transition: all 0.4s ease;
     box-shadow: 0 10px 40px rgba(79, 172, 254, 0.4);
 }

 .cta-button::before {
     content: '';
     position: absolute;
     top: 0;
     left: -100%;
     width: 100%;
     height: 100%;
     background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
     transition: left 0.6s;
 }

 .cta-button:hover::before {
     left: 100%;
 }

 .cta-button:hover {
     transform: translateY(-3px);
     box-shadow: 0 15px 50px rgba(79, 172, 254, 0.6);
 }

 /* Partículas luminosas */
 .light-particle {
     position: absolute;
     width: 4px;
     height: 4px;
     background: #4facfe;
     border-radius: 50%;
     box-shadow: 0 0 20px #4facfe;
     animation: particle-move 10s infinite ease-in-out;
 }

 .light-particle:nth-child(1) {
     left: 20%;
     top: 30%;
     animation-delay: 0s;
 }

 .light-particle:nth-child(2) {
     right: 25%;
     top: 50%;
     animation-delay: 2s;
 }

 .light-particle:nth-child(3) {
     left: 60%;
     bottom: 30%;
     animation-delay: 4s;
 }

 /* Holographic grid */
 .holo-grid {
     position: absolute;
     width: 100%;
     height: 100%;
     background-image:
         linear-gradient(rgba(79, 172, 254, 0.05) 1px, transparent 1px),
         linear-gradient(90deg, rgba(79, 172, 254, 0.05) 1px, transparent 1px);
     background-size: 50px 50px;
     transform: perspective(500px) rotateX(60deg);
     transform-origin: bottom;
     opacity: 0.3;
 }

 /* Animações */
 @keyframes float {

     0%,
     100% {
         transform: translateY(0) rotateX(0deg) rotateY(0deg);
     }

     25% {
         transform: translateY(-30px) rotateX(180deg) rotateY(90deg);
     }

     50% {
         transform: translateY(0) rotateX(360deg) rotateY(180deg);
     }

     75% {
         transform: translateY(30px) rotateX(540deg) rotateY(270deg);
     }
 }

 @keyframes circuit-flow {
     0% {
         transform: translateX(-100%);
         opacity: 0;
     }

     50% {
         opacity: 1;
     }

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

 @keyframes code-float {

     0%,
     100% {
         transform: translateY(0);
         opacity: 0;
     }

     10%,
     90% {
         opacity: 0.6;
     }

     50% {
         transform: translateY(-50px);
         opacity: 1;
     }
 }

 @keyframes title-glow {

     0%,
     100% {
         text-shadow: 0 0 40px rgba(79, 172, 254, 0.5);
     }

     50% {
         text-shadow: 0 0 60px rgba(79, 172, 254, 0.8);
     }
 }

 @keyframes particle-move {

     0%,
     100% {
         transform: translate(0, 0);
         opacity: 0.5;
     }

     50% {
         transform: translate(100px, -100px);
         opacity: 1;
     }
 }

 /* Responsive */
 @media (max-width: 768px) {
     .banner-about {
         height: 500px;
     }

     .banner-title {
         font-size: 42px;
     }

     .banner-subtitle {
         font-size: 18px;
     }

     .banner-description {
         font-size: 16px;
     }

     .cube {
         width: 60px;
         height: 60px;
     }

     .cube-face {
         width: 60px;
         height: 60px;
     }
 }

 /* personalizar os ícones da segunda seção */
 .service-card {
     text-align: center;
     padding: 20px;
     transition: transform 0.3s;
 }

 .icon-container {
     color: #00ffcc;
     /* Cor verde-água dos ícones */
     margin-bottom: 15px;
 }

 /* Ajuste focado no tamanho do ícone */
 .icon-container svg,
 .icon-container i {
     width: 50px;
     height: 50px;
     stroke-width: 1.5;
     /* Mantém as linhas finas e elegantes mesmo em tamanho grande */
 }

 .service-title {
     font-size: 1.1rem;
     font-weight: 300;
 }

 /* terceira sessao */
 :root {
     --line-color: #ccc;
     --text-muted: #666;
 }


 .header-section {
     text-align: center;
     margin-bottom: 60px;
     margin-top: 22px;
 }

 .header-section h2 {
     letter-spacing: 5px;
     font-weight: 300;
     font-size: 30px;
     text-transform: uppercase;
 }



 /* Contentor da Linha Horizontal */
 .process-wrapper {
     position: relative;
     padding-top: 20px;
 }

 /* A Linha Reta Horizontal */
 .process-wrapper::before {
     content: '';
     position: absolute;
     top: 60px;
     /* Alinhada ao centro do círculo */
     left: 10%;
     right: 10%;
     height: 1px;
     border-top: 1px dashed var(--line-color);
     z-index: 1;
 }

 .process-step {
     text-align: center;
     position: relative;
     z-index: 2;
 }

 /* Círculo do Ícone */
 .icon-circle {
     width: 80px;
     height: 80px;
     background: white;
     border: 1px dashed var(--line-color);
     border-radius: 50%;
     display: flex;
     justify-content: center;
     align-items: center;
     margin: 0 auto 25px auto;
     transition: all 0.3s ease;
 }

 .icon-circle i {
     width: 30px;
     height: 30px;
     color: #333;
 }

 .process-step h4 {
     font-size: 1rem;
     font-weight: 600;
     text-transform: uppercase;
     letter-spacing: 1px;
     margin-bottom: 15px;
     min-height: 40px;
     /* Garante alinhamento se o título quebrar */
 }

 .process-step p {
     font-size: 0.85rem;
     color: var(--text-muted);
     line-height: 1.5;
     padding: 0 10px;
 }

 .make {
     font-family: 'Segoe UI', sans-serif;
     color: black;
     font-weight: 400;
 }



 /* Ajuste para Mobile (volta a ser vertical para caber no ecrã) */
 @media (max-width: 768px) {
     .process-wrapper::before {
         display: none;
     }

     .process-step {
         margin-bottom: 40px;
     }
 }

 .banner-about {
     margin: 0;
     padding: 0;
 }

 .banner-about img {
     display: block;
     /* remove espaço fantasma */
 }




 /* BANNER 3D - Hero Section */
 .services-hero {
     position: relative;
     width: 100%;
     height: 350px;
     background: linear-gradient(135deg, #0a1628 0%, #1a2740 50%, #0f1c3a 100%);
     overflow: hidden;
     display: flex;
     align-items: center;
     justify-content: center;
 }

 /* Elementos 3D de fundo */
 .tech-grid {
     position: absolute;
     width: 100%;
     height: 100%;
     opacity: 0.2;
     background-image:
         linear-gradient(rgba(79, 172, 254, 0.1) 1px, transparent 1px),
         linear-gradient(90deg, rgba(79, 172, 254, 0.1) 1px, transparent 1px);
     background-size: 60px 60px;
     transform: perspective(600px) rotateX(60deg);
     transform-origin: center center;
     animation: grid-move 20s infinite linear;
 }

 /* Cubos 3D flutuantes */
 .cube-3d {
     position: absolute;
     width: 120px;
     height: 120px;
     transform-style: preserve-3d;
     animation: cube-rotate 20s infinite ease-in-out;
 }

 .cube-face {
     position: absolute;
     width: 120px;
     height: 120px;
     background: rgba(79, 172, 254, 0.08);
     border: 2px solid rgba(79, 172, 254, 0.4);
     backdrop-filter: blur(5px);
     box-shadow: 0 0 30px rgba(79, 172, 254, 0.3);
 }

 .cube-face.front {
     transform: rotateY(0deg) translateZ(60px);
 }

 .cube-face.back {
     transform: rotateY(180deg) translateZ(60px);
 }

 .cube-face.right {
     transform: rotateY(90deg) translateZ(60px);
 }

 .cube-face.left {
     transform: rotateY(-90deg) translateZ(60px);
 }

 .cube-face.top {
     transform: rotateX(90deg) translateZ(60px);
 }

 .cube-face.bottom {
     transform: rotateX(-90deg) translateZ(60px);
 }

 .cube-3d:nth-child(1) {
     left: 8%;
     top: 15%;
     animation-delay: 0s;
 }

 .cube-3d:nth-child(2) {
     right: 12%;
     top: 60%;
     animation-delay: -7s;
     width: 90px;
     height: 90px;
 }

 .cube-3d:nth-child(2) .cube-face {
     width: 90px;
     height: 90px;
 }

 /* Circuitos digitais */
 .circuit-lines {
     position: absolute;
     width: 100%;
     height: 100%;
     opacity: 0.4;
 }

 .circuit {
     position: absolute;
     height: 2px;
     background: linear-gradient(90deg, transparent, #00d4ff, transparent);
     animation: circuit-flow 5s infinite linear;
 }

 .circuit:nth-child(1) {
     width: 35%;
     left: 10%;
     top: 30%;
 }

 .circuit:nth-child(2) {
     width: 45%;
     right: 8%;
     top: 55%;
     animation-delay: -2s;
 }

 .circuit:nth-child(3) {
     width: 30%;
     left: 25%;
     bottom: 25%;
     animation-delay: -4s;
 }


 /* Partículas luminosas */
 .light-dots {
     position: absolute;
     width: 5px;
     height: 5px;
     background: #00d4ff;
     border-radius: 50%;
     box-shadow: 0 0 20px #00d4ff;
     animation: dot-float 15s infinite ease-in-out;
 }

 .light-dots:nth-child(1) {
     left: 25%;
     top: 25%;
     animation-delay: 0s;
 }

 .light-dots:nth-child(2) {
     right: 30%;
     top: 45%;
     animation-delay: -3s;
 }

 .light-dots:nth-child(3) {
     left: 55%;
     bottom: 35%;
     animation-delay: -6s;
 }

 .light-dots:nth-child(4) {
     right: 18%;
     bottom: 25%;
     animation-delay: -9s;
 }

 /* Conteúdo do Hero */
 .hero-content {
     position: relative;
     z-index: 10;
     text-align: center;
     max-width: 900px;
     padding: 0 30px;
 }

 .hero-subtitle {
     font-size: 16px;
     color: #00d4ff;
     letter-spacing: 3px;
     font-weight: 600;
     margin-bottom: 20px;
     text-transform: uppercase;
 }

 .hero-title {
     font-size: 68px;
     font-weight: 800;
     background: linear-gradient(135deg, #ffffff 0%, #00d4ff 50%, #a78bfa 100%);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
     margin-bottom: 25px;
     line-height: 1.1;
     text-shadow: 0 0 60px rgba(0, 212, 255, 0.4);
 }

 .hero-description {
     font-size: 20px;
     color: #cbd5e0;
     line-height: 1.7;
     max-width: 750px;
     margin: 0 auto;
 }



 .service-icon-wrapper {
     width: 90px;
     height: 90px;
     margin: 0 auto 30px;
     background: linear-gradient(135deg, #4facfe 0%, #00d4ff 100%);
     border-radius: 20px;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 42px;
     box-shadow: 0 10px 30px rgba(79, 172, 254, 0.3);
     transition: all 0.4s ease;
 }

 .service-card:hover .service-icon-wrapper {
     transform: rotateY(360deg) scale(1.1);
     box-shadow: 0 15px 40px rgba(79, 172, 254, 0.5);
 }

 .service-features {
     list-style: none;
     padding: 0;
     margin-top: 25px;
 }

 .service-features li {
     font-size: 15px;
     color: #4b5563;
     padding: 10px 0;
     padding-left: 30px;
     position: relative;
 }

 .service-features li::before {
     content: '✓';
     position: absolute;
     left: 0;
     color: #4facfe;
     font-weight: bold;
     font-size: 18px;
 }



 /* list about - valores */
 .about-features {
     list-style: none;
     padding: 0;
 }

 .about-features li {
     font-size: 15px;
     color: #4b5563;
     padding: 10px 0;
     position: relative;
 }

 .about-features li::before {
     position: absolute;
     left: 0;
     color: #4facfe;
     font-weight: bold;
     font-size: 18px;
 }

 /* Animações */
 @keyframes grid-move {
     0% {
         background-position: 0 0;
     }

     100% {
         background-position: 60px 60px;
     }
 }

 @keyframes cube-rotate {

     0%,
     100% {
         transform: rotateX(0deg) rotateY(0deg);
     }

     33% {
         transform: rotateX(180deg) rotateY(180deg);
     }

     66% {
         transform: rotateX(360deg) rotateY(90deg);
     }
 }

 @keyframes circuit-flow {
     0% {
         transform: translateX(-100%);
         opacity: 0;
     }

     50% {
         opacity: 1;
     }

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

 @keyframes code-drift {

     0%,
     100% {
         transform: translateY(0);
         opacity: 0;
     }

     15%,
     85% {
         opacity: 0.7;
     }

     50% {
         transform: translateY(-60px);
         opacity: 1;
     }
 }

 @keyframes dot-float {

     0%,
     100% {
         transform: translate(0, 0);
         opacity: 0.6;
     }

     50% {
         transform: translate(80px, -80px);
         opacity: 1;
     }
 }

 /* Animações dos efeitos de fundo dos serviços */
 @keyframes sphere-drift {

     0%,
     100% {
         transform: translateY(0) translateX(0);
     }

     50% {
         transform: translateY(-60px) translateX(40px);
     }
 }

 @keyframes geometric-float {

     0%,
     100% {
         transform: translateY(0) rotate(0deg);
         opacity: 0.3;
     }

     50% {
         transform: translateY(-50px) rotate(180deg);
         opacity: 0.6;
     }
 }

 @keyframes ring-expand {

     0%,
     100% {
         transform: translate(-50%, -50%) scale(1);
         opacity: 0.5;
     }

     50% {
         transform: translate(-50%, -50%) scale(1.2);
         opacity: 0.8;
     }
 }

 @keyframes connector-pulse {

     0%,
     100% {
         opacity: 0.2;
         transform: scaleX(1);
     }

     50% {
         opacity: 0.6;
         transform: scaleX(1.1);
     }
 }

 @keyframes dot-pulse {

     0%,
     100% {
         transform: scale(1);
         opacity: 0.4;
     }

     50% {
         transform: scale(1.5);
         opacity: 0.8;
     }
 }

 /* Responsive */
 @media (max-width: 768px) {
     .services-hero {
         height: 400px;
     }

     .hero-title {
         font-size: 42px;
     }

     .hero-description {
         font-size: 17px;
     }

     .section-title {
         font-size: 36px;
     }

     .services-grid {
         grid-template-columns: 1fr;
         gap: 30px;
     }

     .cube-3d {
         width: 80px;
         height: 80px;
     }

     .cube-face {
         width: 80px;
         height: 80px;
     }

     .bg-sphere.large {
         width: 300px;
         height: 300px;
     }

     .bg-sphere.medium {
         width: 250px;
         height: 250px;
     }

     .bg-sphere.small {
         width: 180px;
         height: 180px;
     }
 }



 /* Grid de Projetos */
 .portfolio-grid-custom {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
     gap: 25px;
     max-width: 1200px;
     margin: 0 auto;
     padding: 20px;
 }

 /* Card do Projeto */
 .project-card-custom {
     position: relative;
     height: 350px;
     overflow: hidden;
     cursor: pointer;
     background-color: #000;
     /* Fundo para a imagem */
 }

 /* Imagem de Fundo */
 .img-wrapper-custom {
     width: 100%;
     height: 100%;
 }

 .img-wrapper-custom img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     display: block;
     transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
 }

 /* Overlay que aparece no Hover */
 .project-overlay-custom {
     position: absolute;
     inset: 0;
     background: rgba(0, 0, 0, 0.75);
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     opacity: 0;
     transition: opacity 0.4s ease;
     padding: 20px;
     text-align: center;
     backdrop-filter: blur(3px);
     /* Leve desfoque no fundo */
 }

 /* Interações ao passar o mouse */
 .project-card-custom:hover .img-wrapper-custom img {
     transform: scale(1.1);
 }

 .project-card-custom:hover .project-overlay-custom {
     opacity: 1;
 }

 /* Textos dentro do Overlay */
 .project-overlay-custom h4 {
     color: #fff;
     margin: 0;
     font-size: 1.6rem;
     font-weight: 700;
     transform: translateY(20px);
     transition: transform 0.4s ease;
 }

 .project-overlay-custom span {
     color: #f2184f;
     /* Cor de destaque */
     text-transform: uppercase;
     font-size: 0.85rem;
     letter-spacing: 2px;
     margin-top: 10px;
     font-weight: 600;
     transform: translateY(20px);
     transition: transform 0.4s ease 0.1s;
 }

 .project-card-custom:hover h4,
 .project-card-custom:hover span {
     transform: translateY(0);
 }

 /* ============================================================
           ESTILOS DA MODAL E SLIDER
           ============================================================ */

 #modalPortfolio {
     display: none;
     position: fixed;
     inset: 0;
     z-index: 999999;
     /* Garantir que fique acima de tudo */
     background: rgba(0, 0, 0, 0.97);
     align-items: center;
     justify-content: center;
     padding: 20px;
 }

 #modalPortfolio.active {
     display: flex;
 }

 .modal-content-custom {
     width: 100%;
     max-width: 1100px;
     position: relative;
     text-align: center;
 }

 .modal-close-custom {
     position: absolute;
     top: -50px;
     right: 0;
     color: #fff;
     font-size: 45px;
     background: none;
     border: none;
     cursor: pointer;
     line-height: 1;
 }

 .slider-container-custom {
     width: 100%;
     height: 65vh;
     display: flex;
     align-items: center;
     justify-content: center;
     position: relative;
 }

 .slide-img-custom {
     display: none;
     max-width: 100%;
     max-height: 100%;
     border-radius: 10px;
     box-shadow: 0 0 30px rgba(0, 0, 0, 0.5);
     object-fit: contain;
 }

 .slide-img-custom.active {
     display: block;
     animation: fadeInScale 0.5s ease-out;
 }

 @keyframes fadeInScale {
     from {
         opacity: 0;
         transform: scale(0.95);
     }

     to {
         opacity: 1;
         transform: scale(1);
     }
 }

 /* Navegação do Slider */
 .nav-btn-custom {
     position: absolute;
     top: 50%;
     transform: translateY(-50%);
     background: rgba(255, 255, 255, 0.1);
     color: white;
     border: none;
     width: 60px;
     height: 60px;
     border-radius: 50%;
     cursor: pointer;
     font-size: 24px;
     transition: all 0.3s;
     z-index: 10;
 }

 .nav-btn-custom:hover {
     background: rgba(255, 255, 255, 0.25);
 }

 .prev-custom {
     left: -80px;
 }

 .next-custom {
     right: -80px;
 }

 .slide-counter-custom {
     color: #888;
     margin-top: 25px;
     font-family: monospace;
     font-size: 1rem;
 }

 /* Ajustes para Telas Pequenas */
 @media (max-width: 1024px) {
     .prev-custom {
         left: 10px;
     }

     .next-custom {
         right: 10px;
     }

     .nav-btn-custom {
         width: 45px;
         height: 45px;
         background: rgba(0, 0, 0, 0.5);
     }
 }

 @media (max-width: 768px) {
     .portfolio-grid-custom {
         grid-template-columns: 1fr;
     }

     .slider-container-custom {
         height: 50vh;
     }

     .modal-close-custom {
         right: 10px;
         top: -50px;
     }
 }



 /* Estilos da Seção */
 .banner_cta {
     padding: 150px 0;
     background-attachment: fixed;
     /* Efeito Parallax */
     background-position: center;
     background-repeat: no-repeat;
     background-size: cover;
     position: relative;
 }

 .cta_content h2 {
     text-transform: uppercase;
     letter-spacing: 2px;
 }

 /* Botões Personalizados */
 .btn-primary-custom {
     background-color: #f2184f;
     color: white;
     border: none;
     padding: 12px 30px;
     font-weight: bold;
     text-transform: uppercase;
     transition: 0.3s;
 }

 .btn-primary-custom:hover {
     background-color: #d11443;
     color: white;
     transform: translateY(-3px);
 }

 .btn-secondary-custom {
     background-color: transparent;
     color: white;
     border: 2px solid #f2184f;
     padding: 12px 30px;
     font-weight: bold;
     text-transform: uppercase;
     transition: 0.3s;
 }

 .btn-secondary-custom:hover {
     background-color: #f2184f;
     color: white;
     transform: translateY(-3px);
 }

 /* Responsividade */
 @media (max-width: 768px) {
     .banner_cta {
         padding: 80px 0;
         background-attachment: scroll;
         /* Desativa parallax em mobile para melhor performance */
     }

     .btn-primary-custom,
     .btn-secondary-custom {
         margin-bottom: 15px;
         display: block;
         width: 100%;
     }
 }

 /* Contentor do Selo Dourado */
 .badge-container {
     width: 150px;
     height: 150px;
     margin: 0 auto 20px;
     border: 4px double #0abdc7ce;
     /* Cor dourada do ícone original */
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     position: relative;
     background: #fff;
     transition: transform 0.3s ease;
 }

 /* Adicionando as "abas" laterais do selo (efeito ribbon) */
 .badge-container::before,
 .badge-container::after {
     content: '★';
     position: absolute;
     top: 50%;
     transform: translateY(-50%);
     background: #0abdc7ce;
     color: white;
     padding: 0 5px;
     font-size: 10px;
     z-index: 1;
 }

 .badge-container::before {
     left: -10px;
 }

 .badge-container::after {
     right: -10px;
 }

 /* Ícone interno */
 .icon-img {
     width: 60px;
     height: 60px;
     filter: grayscale(100%);
     /* Garante que o ícone fique preto */
 }

 /* Título do item */
 .competency-title {
     font-size: 0.95rem;
     color: #444;
     font-weight: 500;
     line-height: 1.4;
     max-width: 180px;
     margin: 0 auto;
 }

 /* Efeito Hover */
 .competency-item:hover .badge-container {
     transform: scale(1.05);
     border-color: #0abdc7ce;
 }

 /* Ajustes Mobile */
 @media (max-width: 768px) {
     .badge-container {
         width: 120px;
         height: 120px;
     }

     .icon-img {
         width: 50px;
         height: 50px;
     }

     .competency-title {
         font-size: 0.85rem;
     }
 }

 /* 5. Secção Blog (blog.PNG) */
 .blog-section {
     padding: 80px 0;
 }

 .blog-sidebar {
     border-left: 1px solid #eee;
     padding-left: 20px;
 }

 /* tamanho icon */
 .icon-large svg {
     width: 48px;
     height: 48px;
     color: #f2184f;
     /* color: #0abdc7ce; */
 }

 .icon-med svg {
     width: 32px;
     height: 32px;
     color: #f2184f;
     /* color: #0abdc7ce; */
 }

 .coment_conteudo {
     margin-left: 15px;
     margin-top: 10px;
 }

 .privacy-note {
     font-size: 16px;
     color: #04d1dbce;
     /* azul suave para destaque */
     font-weight: 500;
     background-color: #f0f4ff;
     /* leve fundo azul para chamar atenção */
     padding: 15px 20px;
     border-left: 4px solid #04d1dbce;
     border-radius: 4px;
     margin-top: 30px;
 }