/* --- Global Styles --- */

* {

    margin: 0;

    padding: 0;

    box-sizing: border-box;

}



:root {

    --primary-blue: #00607f;

    --secondary-blue: #0089b3;

    --terciary-green: #01ae4f;

    --dark-blue: #003b4d;

    --light-gray: #f5f7f9;

    --medium-gray: #e0e5e9;

    --dark-gray: #828282;

    --gray-border: #d6d6d6;

    --btn-radius: 6px;

    --transition: 0.3s ease;

    --white: #ffffff;

}



html,

body {

    max-width: 100vw;

    overflow-x: hidden;

}



body {

    font-family: 'Lato', 'Montserrat', sans-serif;

    background-color: var(--light-gray);

    color: var(--dark-blue);

    line-height: 1.6;

    font-weight: 400;

}



.container {

    max-width: 1200px;

    margin: 0 auto;

    padding: 0 15px;

}



h1,

h2,

h3 {

    font-family: 'Montserrat', sans-serif;

    font-weight: 700;

    color: var(--primary-blue);

}



a {

    color: var(--primary-blue);

    text-decoration: none;

    transition: color var(--transition);

}



a:hover {

    color: var(--secondary-blue);

}



/* --- Header --- */

header {

    background-color: white;

    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);

    position: sticky;

    top: 0;

    z-index: 10000;

}



.header-container {

    max-width: 1800px;

    margin: 0 auto;

    padding: 0;

    display: flex;

    justify-content: space-between;

    align-items: center;

    position: relative;

    z-index: 1;

}



.logo {

    padding-left: 15px;

}



.logo img {

    max-height: 90px;

    width: auto;

    height: auto;

    transition: max-height 0.3s ease;

}



nav ul#menu {

    list-style: none;

    display: flex;

    flex-direction: row;

    align-items: center;

    gap: 15px;

    padding-right: 15px;

    margin-bottom: 0;

}



nav ul#menu li a.nav-link {

    font-weight: 600;

    padding: 12px 20px;

    display: inline-block;

    transition: background-color var(--transition), color var(--transition);

    border-radius: var(--btn-radius);

    font-size: 1.1rem;

    color: var(--dark-blue);

}



nav ul#menu li a.nav-link:hover,

nav ul#menu li a.nav-link:focus {

    background-color: var(--primary-blue);

    color: white;

}



/* --- Hero Section --- */

.hero {

    background: linear-gradient(rgba(0, 96, 127, 0.85), rgba(0, 96, 127, 0.85)), url('/assets/imagens/Imagem Industria.png') center center/cover no-repeat;

    color: white;

    padding: 50px 15px;

    text-align: center;

}



.hero-content h1 {

    font-size: 3.8rem;

    line-height: 1.2;

    font-weight: 700;

    color: white;

}



.btn-outline-primary {

    border: 2px solid var(--white);

    color: white;

    padding: 10px 25px;

    font-weight: 700;

    border-radius: var(--btn-radius);

    transition: background-color var(--transition), color var(--transition);

}



.btn-outline-primary:hover {

    background-color: var(--primary-blue);

    color: white;

}



/* --- Speaker Bio --- */

.bio-content {

    display: flex;

    flex-wrap: wrap;

    gap: 30px;

    align-items: center;

    justify-content: space-between;

}



.bio-text {

    flex: 1 1 350px;

    text-align: center;

}



.bio-text h2 {

    font-size: 2.5rem;

    margin-bottom: 20px;

}



.bio-text p {

    margin-bottom: 15px;

    font-size: 1.1rem;

    color: var(--dark-blue);
    text-align: justify;

}



.bio-text a.btn {

    background-color: var(--primary-blue);

    color: white;

    padding: 10px 25px;

    border-radius: var(--btn-radius);

    text-decoration: none;

    font-weight: 700;

    transition: background-color var(--transition);

}



.bio-text a.btn:hover {

    background-color: var(--secondary-blue);

}



.bio-image img {

    max-width: 60%;

    border-radius: 10px;

    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.1);

}



/* --- Títulos e Separadores --- */

.section-title {

    text-align: center;

    margin-bottom: 40px;

}



.section-title h2 {

    font-size: 2.8rem;

    color: var(--primary-blue);

    position: relative;

    display: inline-block;

    padding-bottom: 20px;

}



.section-title h2::after {

    content: '';

    position: absolute;

    width: 100px;

    height: 4px;

    background-color: var(--secondary-blue);

    bottom: 0;

    left: 50%;

    transform: translateX(-50%);

}



.bio-text .section-title h2 {

    text-align: left;

    display: block;

}



.bio-text .section-title h2::after {

    left: 0;

    transform: none;

}



.section-title p {

    font-size: 1.1rem;

    color: var(--dark-blue);

    max-width: 700px;

    margin-bottom: 25px;

    margin-left: auto;

    margin-right: auto;

}



/* --- Purpose Section --- */

.destaque-proposito {

    color: var(--dark-blue);

    font-weight: 700;

    font-size: 1.2rem;

    margin-top: 20px;

}


.destaque-palestras{
        color: var(--dark-blue);

    font-weight: 700;

    font-size: 1.0rem;

    margin-top: 20px;
}
/* --- Cards (Missão, Visão, Valores) --- */

.services-grid {

    display: grid;

    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

    gap: 25px;

    margin-top: 30px;

}



.service-card {

    background-color: var(--white);

    border-radius: 12px;

    overflow: hidden;

    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);

    transition: transform var(--transition), box-shadow var(--transition);

    display: flex;

    flex-direction: column;

    padding: 0;

}



.service-card:hover {

    transform: translateY(-10px);

    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.12);

}



.service-icon {

    background-color: var(--terciary-green);

    height: 80px;

    display: flex;

    align-items: center;

    justify-content: center;

    width: 100%;

}



.service-icon img {

    width: 50px;

    height: auto;

    filter: brightness(0) invert(1);

}



.service-content {

    padding: 30px;

    flex: 1;

    text-align: center;

}



.service-content h3 {

    font-size: 1.5rem;

    color: var(--primary-blue);

    margin-bottom: 15px;

}



.service-content p {

    font-size: 1.1rem;

    color: var(--dark-blue);

    line-height: 1.6;

}



/* --- Seção de Serviços --- */

.secao-servicos {

    padding: 60px 0;

}



.section-title {

    text-align: center;

    margin-bottom: 40px;

}



.section-title h2 {

    font-size: 2.8rem;

    color: var(--primary-blue);

    position: relative;

    display: inline-block;

    padding-bottom: 20px;

}



.section-title h2::after {

    content: '';

    position: absolute;

    width: 100px;

    height: 4px;

    background-color: var(--secondary-blue);

    bottom: 0;

    left: 50%;

    transform: translateX(-50%);

}



.section-title p {

    font-size: 1.1rem;

    color: var(--dark-blue);

    max-width: 900px;

    margin-bottom: 25px;

    margin-left: auto;

    margin-right: auto;
    text-align: center;

}



/* --- Contêiner do Carrossel --- */

.carousel-wrapper {

    position: relative;

    display: flex;

    flex-direction: column;
    /* Organiza os elementos em coluna */

    align-items: center;

    justify-content: center;

}



.carousel-container {

    width: 100%;

    max-width: 800px;
    /* Largura máxima do carrossel visível */

    overflow: hidden;

    position: relative;

}



.carousel-track {

    display: flex;

    transition: transform var(--transition);
    /* Adiciona a animação de deslize */

}



.servico-item {

    flex-shrink: 0;
    /* Impede que os itens encolham */

    width: 400px;
    /* Largura base do card */

    margin: 0 15px;
    /* Espaçamento entre os cards */

    background: var(--white);

    border-radius: 10px;

    padding: 0;
    /* Removido o padding para o cabeçalho ficar rente à borda */

    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);

    transition: all var(--transition);

    text-align: left;

    transform: scale(0.9);
    /* Escala padrão para os cards laterais */

    opacity: 0.5;
    /* Opacidade padrão para os cards laterais */

    overflow: hidden;
    /* Garante que o cabeçalho respeite o border-radius */

}



/* Estilo para o card ativo (no centro) */

.servico-item.active {

    transform: scale(1);

    opacity: 1;

    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);

}



/* --- Estilos Corrigidos para o Cabeçalho --- */

.service-header-servicos {

    background-color: var(--primary-blue);

    padding: 25px;
    /* Padding interno para o conteúdo do cabeçalho */

    margin-bottom: 25px;
    /* Espaço entre o cabeçalho e o conteúdo */

    width: 100%;
    /* Ocupa a largura total do card */


}

.sipat1 {

    background-color: var(--terciary-green);

    padding: 25px;  
    /* Padding interno para o conteúdo do cabeçalho */

    margin-bottom: 25px;
    /* Espaço entre o cabeçalho e o conteúdo */

    width: 100%;
    /* Ocupa a largura total do card */


}

.service-header-servicos h3 {

    color: var(--white);

    font-weight: 700;

    margin-bottom: 0;

    text-align: center;


}



.service-content-servicos {

    padding: 0 25px 25px 25px;
    /* Adicionado padding para o conteúdo */

}



.service-content-servicos p {

    color: var(--dark-blue);

    margin-bottom: 12px;

    font-size: 1rem;

    text-align: justify;

}
.service-content-servicosd p {
        color: var(--dark-blue);

    margin-bottom: 12px;

    font-size: 1rem;

    text-align: center;

}


.destaque {

    color: var(--terciary-green);

    font-weight: 700;

    font-size: 1.1rem;

    margin-top: 5px;

}
.destaque2 {
        color: var(--terciary-green);

    font-weight: 700;

    font-size: 1.1rem;

    margin-top: -9px;

}

.sipatimg {

    margin-top: 50px;

    width: 55%;

    height: auto;

    display: block;

    margin-left: auto;

    margin-right: auto;

}

.mentoria-item img {

    margin-top: -40px;

    width: 85%;

    height: auto;

    display: block;

    margin-left: auto;

    margin-right: auto;

}



/* --- Botões de Navegação --- */

.carousel-button {
    position: static;
    transform: none;
    background-color: var(--primary-blue);
    color: var(--white);
    border: none;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    cursor: pointer;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
    transition: background-color var(--transition), transform var(--transition);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
        transform: translateY(-15px); /* sobe levemente */
}

.carousel-controls {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 25px; /* Espaço entre os itens */
    margin: 30px 0;
}


.carousel-button:hover {

    background-color: var(--secondary-blue);

    transform: translateY(-50%) scale(1.1);

}



.carousel-button:disabled {

    background-color: #ccc;

    cursor: not-allowed;

    opacity: 0.5;

}



.carousel-prev {

    left: 0;

    margin-left: 15px;

}



.carousel-next {

    right: 0;

    margin-right: 15px;

}



/* --- Paginação (Bolinhas) --- */

.carousel-pagination {
    display: flex;
    justify-content: center;
    margin-bottom: 30px; /* Espaço entre as bolinhas e os cards */
}


.dot {
    height: 10px;
    width: 10px;
    margin: 0 5px;
    background-color: #bbb;
    border-radius: 50%;
    display: inline-block;
    cursor: pointer;
    transition: background-color var(--transition);
}


.dot.active {
    background-color: var(--primary-blue);
}


/* Media queries para responsividade */

@media (max-width: 768px) {

    .servico-item {

        width: 300px;

    }



    .carousel-container {

        max-width: 400px;

    }

}



/* --- Portfolio Section --- */

.portfolio-section {

    padding: 60px 0;

}



.portfolio-content {

    text-align: center;

}



.portfolio-content p {

    font-size: 1.1rem;

    color: var(--dark-blue);

    margin-bottom: 20px;

    max-width: 700px;

    margin-left: auto;

    margin-right: auto;

}



.btn-download {

    background-color: var(--primary-blue);

    color: white !important;

    padding: 10px 20px;

    border-radius: var(--btn-radius);

    display: inline-flex;

    align-items: center;

    gap: 10px;

    font-weight: 700;

    text-decoration: none;

    transition: background-color var(--transition);

}



.btn-download:hover {

    background-color: var(--secondary-blue);

}


/* Estilos para a seção de Frase e Assinatura */
.motivacional-quote {
    background-color: var(--light-gray); /* Cor de fundo cinza claro */
    color: var(--dark-blue); /* Cor do texto */
    padding: 3rem 0;
}

.motivacional-quote .blockquote {
    font-size: 1.5rem; /* Aumenta o tamanho da fonte da citação */
    line-height: 1.6;
    margin-bottom: 1rem;
    margin-left: -20px;
}


/* Efeitos de sombra na imagem para navegadores diferentes */
.motivacional-quote .img-fluid.shadow {
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}

/* Opcional: Adiciona um efeito de transição ao passar o mouse sobre a imagem */
.motivacional-quote .img-fluid.rounded-circle {
    transition: transform 0.3s ease-in-out;
}

.motivacional-quote .img-fluid.rounded-circle:hover {
    transform: scale(1.05); /* Aumenta o tamanho da imagem em 5% ao passar o mouse */
}

.destaque-top {
    color: var(--primary-color); /* Use a cor principal da sua paleta */
    font-weight: bold;
}
/* --- Call to Action --- */

.cta {

    background-color: var(--primary-blue);

    color: white;

    padding: 60px 0;

    text-align: center;

}



.cta-content h2 {

    font-size: 2.0rem;

    margin-bottom: 10px;

    color: white;

}



.cta-content p {

    font-size: 1.1rem;

    margin-bottom: 25px;

    color: var(--white);

}



.btn2 {

    background-color: var(--terciary-green);

    border: none;

    color: white;

    padding: 12px 30px;

    border-radius: var(--btn-radius);

    font-weight: 700;

    text-decoration: none;

    display: inline-flex;

    align-items: center;

    gap: 10px;

    transition: background-color var(--transition);

    cursor: pointer;

}



.btn2:hover {

    background-color: #018c3e;

}



.btn2 img {

    max-height: 20px;

}



/* --- Contact Form --- */

.contact-form-container {

    background: white;

    padding: 30px;

    border-radius: 12px;

    box-shadow: 0 8px 25px rgb(0 0 0 / 0.1);

    max-width: 700px;

    margin: 0 auto;

}



.contact-form-header {

    text-align: center;

}



.contact-form-header h2 {

    font-size: 2.5rem;

    color: var(--primary-blue);

    margin-bottom: 10px;

}



.contact-form-header p {

    color: var(--dark-blue);

    margin-bottom: 20px;

    font-size: 1.1rem;

}



.contact-form-grid input,

.contact-form-grid textarea {

    width: 100%;

    padding: 10px 15px;

    margin-bottom: 15px;

    border-radius: var(--btn-radius);

    border: 1px solid var(--gray-border);

    font-size: 1.1rem;

    font-family: inherit;

    resize: vertical;

    transition: border-color var(--transition);

    color: var(--dark-blue);

}



.contact-form-grid input:focus,

.contact-form-grid textarea:focus {

    outline: none;

    border-color: var(--primary-blue);

}



.btn2-white {

    background-color: white;

    color: var(--primary-blue);

    border: 2px solid var(--primary-blue);

    padding: 12px 30px;

    border-radius: var(--btn-radius);

    font-weight: 700;

    transition: background-color var(--transition), color var(--transition);

    cursor: pointer;

    width: 100%;

}



.btn2-white:hover {

    background-color: var(--primary-blue);

    color: white;

}



/* --- Footer --- */

footer {

    background-color: var(--dark-blue);

    padding: 40px 0 20px 0;

    text-align: center;

    color: var(--white);

    font-size: 0.95rem;

}



.footer-grid {

    display: flex;

    flex-wrap: wrap;

    gap: 30px;

    justify-content: space-between;

    max-width: 1140px;

    margin: 0 auto;

}



.footer-column {
    flex: 1 1 auto;
    text-align: left;

}
.no-wrap {
    white-space: nowrap;
}

.footer-slogan {
    display: inline-block;      /* mantém todos os <span> tratados como bloco em linha */
    white-space: normal;        /* só a .no-wrap que precisa nowrap */
    overflow: visible;          /* garante que nada seja cortado */
    max-width: 100%;            /* usa toda a largura disponível */
}
.footer-column h3 {

    font-weight: 700;

    margin-bottom: 15px;

    color: var(--white);

}



.footer-column p {

    line-height: 1.4;

    color: var(--white);

}



.footer-column ul {

    list-style: none;

    padding-left: 0;

}



.footer-column ul li {

    margin-bottom: 10px;

}



.footer-column ul li a {

    color: var(--white);

    transition: color var(--transition);

}



.footer-column ul li a:hover {

    color: var(--secondary-blue);

}



.social-links {
    display: flex;
    gap: 15px;
    margin-top: 15px;
    justify-content: flex-start;
}


.social-links a {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    width: 45px;

    height: 45px;

    background-color: rgba(255, 255, 255, 0.1);

    border-radius: 50%;

    color: var(--white);

    transition: var(--transition);

    font-size: 18px;

}



.social-links a:hover {

    background-color: var(--secondary-blue);

    transform: translateY(-5px);

}



.contact-info .contact-item {

    display: flex;

    align-items: center;

    gap: 10px;

    margin-bottom: 10px;

}



.contact-info .contact-item i {

    font-size: 1.1rem;

    color: var(--secondary-blue);

    font-size: 20px;

    margin-top: 0;

}



/* Copyright */

.copyright {

    margin-top: 20px;

    text-align: center;

    color: var(--medium-gray);

}



/* WhatsApp Float Button */

.whatsapp-float {

    background-color: var(--terciary-green);

    color: white !important;

    width: 50px;

    height: 50px;

    border-radius: 50%;

    display: flex !important;

    justify-content: center;

    align-items: center;

    box-shadow: 0 6px 10px rgba(0, 0, 0, 0.15);

    transition: background-color var(--transition);

    position: fixed;

    bottom: 20px;

    right: 20px;

    cursor: pointer;

    z-index: 11000;

}



.whatsapp-float:hover {

    background-color: #018c3e;

    color: white !important;

}



/* --- Responsive Adjustments --- */

@media (max-width: 767.98px) {

    .logo img {

        max-height: 60px;

    }



    .services-grid,

    .servicos-grid {

        grid-template-columns: 1fr;

        gap: 20px;

    }



    .service-card,

    .servico-item {

        width: 100%;

    }



    .bio-content {

        flex-direction: column;

    }



    .bio-image {

        width: 80%;

        margin-top: 30px;

    }



    .bio-text {

        order: 2;

        text-align: left;

    }



    .hero-content h1 {

        font-size: 2.5rem;

    }



    .service-card {

        flex-direction: column;

        align-items: center;

        text-align: center;

    }



    .service-icon {

        margin-bottom: 15px;

    }



    .services-grid {

        flex-direction: column;

    }



    .servicos-grid {

        flex-direction: column;

    }



    #navbarMenu {

        position: absolute;

        top: 100%;

        left: 0;

        width: 100%;

        background-color: #fff;

        z-index: 10001;

        padding: 1rem 0;

        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);

        border-radius: 0 0 var(--btn-radius) var(--btn-radius);

    }



    nav ul#menu {

        flex-direction: column;

        gap: 0;

    }



    nav ul#menu li a.nav-link {

        padding: 15px 20px;

        display: block;

        border-radius: 0;

        color: var(--dark-blue);

    }



    nav ul#menu li a.nav-link:hover,

    nav ul#menu li a.nav-link:focus {

        background-color: var(--primary-blue);

        color: white;

    }

}