/* =========================================================
   AJUSTES GERAIS ONEUI
   ========================================================= */

#main-container {
    padding: 0;
}

.hero-servicos {
    position: relative;
    margin-top: -90px;
    padding-bottom: 60px;
    z-index: 3;
}

/* Link wrapper */
.service-link {
    display: block;
    height: 100%;
    text-decoration: none;
    color: inherit;
}

/* =========================================================
   SECTION SERVIÇOS
   ========================================================= */

.hero-servicos {
    position: relative;
    margin-top: -90px;
    padding-bottom: 60px;
    z-index: 3;
}

/* =========================================================
   LINK
   ========================================================= */

.service-link {
    display: block;
    height: 100%;
    text-decoration: none;
    color: inherit;
}

/* =========================================================
   SERVICE BOX
   ========================================================= */

.service-box-pro {
    position: relative;
    height: 100%;
    background: #ffffff;
    border-radius: 6px;
    padding: 48px 32px 36px;
    overflow: visible;

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

    transition:
        transform .3s ease,
        box-shadow .3s ease;
}

/* Hover card */
.service-link:hover .service-box-pro {
    transform: translateY(-10px);
    box-shadow: 0 25px 55px rgba(0,0,0,.2);
}

/* =========================================================
   RISCO INFERIOR
   ========================================================= */

.service-box-pro::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;

    width: 100%;
    height: 3px;
    background: var(--bs-primary);
}

/* =========================================================
   BADGE ACOPLADO (CANTO SUPERIOR DIREITO)
   ========================================================= */

.service-badge-attached {
    position: absolute;
    top: -18px;
    right: -18px;

    width: 54px;
    height: 54px;

    background: var(--bs-primary);
    color: #ffffff;

    border-radius: 0 6px 0 50%;

    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 1.35rem;

    box-shadow: 0 10px 25px rgba(0,0,0,.25);

    transition:
        transform .3s ease,
        background .3s ease;
}

/* Hover badge */
.service-link:hover .service-badge-attached {
    transform: scale(1.08);
    background: #00301B;
}

/* =========================================================
   TEXTO
   ========================================================= */

.service-box-pro h5 {
    font-weight: 600;
    margin-bottom: 12px;
    padding-right: 40px;
    transition: color .3s ease;
}

.service-box-pro p {
    font-size: .95rem;
    color: #6c757d;
    line-height: 1.6;
    margin-bottom: 20px;
}

/* Hover texto */
.service-link:hover .service-box-pro h5 {
    color: var(--bs-primary);
}

/* =========================================================
   CTA
   ========================================================= */

.service-cta {
    display: inline-flex;
    align-items: center;
    gap: 6px;

    font-size: .9rem;
    font-weight: 500;
    color: var(--bs-primary);

    transition: gap .3s ease;
}

.service-link:hover .service-cta {
    gap: 10px;
}

/* =========================================================
   RESPONSIVO
   ========================================================= */

@media (max-width: 575px) {
    .service-badge-attached {
        width: 48px;
        height: 48px;
        font-size: 1.2rem;
        top: -14px;
        right: -14px;
    }

    .service-box-pro {
        padding: 42px 24px 30px;
    }
}


/* =========================================================
   SEÇÃO SOBRE
   ========================================================= */

.sobre-thermos {
    position: relative;
    min-height: 700px;
    padding: 70px 0 70px;

    background-color: #1f2f2a; /* cinza escuro institucional */
    overflow: visible;

    transition:
        background 0.3s ease,
        border-radius 0.3s ease,
        opacity 0.3s ease;
}

/* Background mapa */
.about-bg {
    position: absolute;
    inset: 0;

    background-image: url('../img/map_bg2.png');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover; /* ocupa toda a section */

    opacity: 0.1;
    z-index: 0;

    transition:
        background 0.3s ease,
        border-radius 0.3s ease,
        opacity 0.3s ease;
}

/* Texto */
.about-subtitle {
    font-size: .85rem;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #fff;
    margin-bottom: 14px;
    display: inline-block;
}

.about-title {
    font-size: clamp(2.1rem, 3.5vw, 2.9rem);
    font-weight: 700;
    line-height: 1.15;
    margin-bottom: 28px;
	color: #fff;
}

.about-title strong {
    color: #ccc;
}

.about-text {
    font-size: 1rem;
    color: #fff;
    line-height: 1.75;
    max-width: 520px;
}

/* =========================================================
   IMAGEM DIREITA – BORDA EMBAIXO
   ========================================================= */

.about-image {
    position: relative;
    max-width: 560px;
    margin-left: auto;
    margin-top: -200px;
    padding-left: 40px;
    z-index: 2;
}

.about-image img {
    position: relative;
    z-index: 2;

    width: 100%;
    height: 600px;
    object-fit: cover;

    border-radius: 6px;
    box-shadow: 0 30px 70px rgba(0,0,0,.25);
}

/* =========================================================
   BORDA CLEAN E SUTIL (ESTILO ENTERPRISE)
   ========================================================= */

.about-image::after {
    content: "";
    position: absolute;

    bottom: -18px;     /* menos deslocamento */
    left: 12px;        /* leve desalinhamento */

    width: 78%;
    height: 78%;

    background: rgba(0,48,27,.18); /* azul suave */
    border-radius: 6px;

    z-index: 1;
}

.about-image-left {
    margin-left: 0;
    margin-right: auto;
    padding-left: 0;
    padding-right: 40px;
}

/* Ajuste da borda clean para esquerda */
.about-image-left::after {
    left: auto;
    right: 12px;
}

/* =========================================================
   RESPONSIVO
   ========================================================= */

@media (max-width: 991px) {

    /* mantém serviços próximos */
    .hero-servicos {
        margin-top: -60px;
        position: relative;
        z-index: 3;
    }

    .sobre-thermos {
        position: relative;
        z-index: 1;
        min-height: auto;
        padding: 120px 0 70px; /* mais padding no topo */
    }

    /* IMAGEM SOBREPONDO DE VERDADE */
    .about-image {
        position: relative;

        max-width: 92%;
        margin: 0 auto;

        top: -140px;          /* SOBE SOBRE OS SERVIÇOS */
        padding: 0;

        z-index: 4;           /* acima de tudo */
    }

    .about-image img {
        height: 360px;
    }

    /* remove borda decorativa no mobile */
    .about-image::after {
        display: none;
    }
}
@media (max-width: 991px) {

    /* remove o espaço em branco abaixo da imagem */
    .sobre-thermos .col-lg-6:last-child {
        margin-top: -100px;
    }
}

/* =========================================================
   SEÇÃO – NOSSOS TREINAMENTOS
   ========================================================= */

.treinamentos {
    padding: 110px 0;
    background: #f8f9fb;
}

/* TÍTULOS */
.section-subtitle {
    display: inline-block;
    font-size: .85rem;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #fff;
    margin-bottom: 10px;
}

.section-title {
    font-size: clamp(2rem, 3.5vw, 2.8rem);
    font-weight: 700;
    margin-bottom: 16px;
    color: #212529;
}

.section-text {
    max-width: 620px;
    font-size: 1rem;
    color: #6c757d;
    line-height: 1.7;
}

/* =========================================================
   TÍTULOS DA SEÇÃO
   ========================================================= */

.section-subtitle {
    display: inline-block;
    font-size: 0.85rem;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #00301B;
    margin-bottom: 10px;
}

.section-title {
    font-size: clamp(2rem, 3.5vw, 2.8rem);
    font-weight: 700;
    margin-bottom: 16px;
    color: #212529;
}

.section-text {
    max-width: 620px;
    font-size: 1rem;
    color: #6c757d;
    line-height: 1.7;
}

/* =========================================================
   SEÇÃO TREINAMENTOS
   ========================================================= */

.treinamentos {
    padding: 50px 0;
}

/* =========================================================
   TRAINING BOX
   ========================================================= */

.training-box {
    position: relative;
    display: block;
    height: 100%;
    background: #ffffff;
    border-radius: 8px;
    overflow: hidden;
    text-decoration: none;

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

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}

.training-box:hover {
    transform: translateY(-10px);
    box-shadow: 0 25px 55px rgba(0,0,0,.2);
}

/* =========================================================
   IMAGEM + OVERLAY
   ========================================================= */

.training-image {
    position: relative;
    height: 200px;
    overflow: hidden;
}

.training-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .5s ease;
}

.training-box:hover .training-image img {
    transform: scale(1.08);
}

/* Overlay sutil */
.training-image::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to bottom,
        rgba(0,0,0,.1),
        rgba(0,0,0,.35)
    );
}

/* =========================================================
   BADGE NR
   ========================================================= */

.training-badge {
    position: absolute;
    top: 14px;
    left: 14px;
    z-index: 2;

    background: var(--bs-primary);
    color: #fff;

    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .5px;

    padding: 6px 10px;
    border-radius: 4px;
}

/* =========================================================
   CONTEÚDO
   ========================================================= */

.training-content {
    padding: 26px 24px 30px;
    text-align: center;
}

.training-content h5 {
    font-weight: 600;
    margin-bottom: 8px;
    color: #111827;
    transition: color .3s ease;
}

.training-content p {
    font-size: .95rem;
    color: #6b7280;
    margin: 0;
    line-height: 1.6;
    transition: color .3s ease;
}

.training-box:hover .training-content h5 {
    color: var(--bs-primary);
}

.training-box:hover .training-content p {
    color: #374151;
}

/* =========================================================
   RISCO INFERIOR
   ========================================================= */

.training-box::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 3px;
    background: var(--bs-primary);
}

/* =========================================================
   RESPONSIVO
   ========================================================= */

@media (max-width: 991px) {
    .training-image {
        height: 180px;
    }
}

.card-hover:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(0,0,0,.25);
}

/* =========================================================
   HERO VIDEO SLIDE
   ========================================================= */

.hero-video-slide {
    position: relative;
    height: 100vh;
    min-height: 600px;
    overflow: hidden;
}

.hero-video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}

/* Conteúdo acima do vídeo */
.hero-mask {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.65);
    z-index: 1;
}

.hero-content {
    position: relative;
    z-index: 2;
}

/* =========================================================
   SECTION – FALE CONOSCO
   ========================================================= */

.contact-safety {
    position: relative;
    padding: 30px 0;
    background-color: #00301B;
    overflow: hidden;
}

/* Fundo sutil (mapa / textura) */
.contact-bg {
    position: absolute;
    inset: 0;
    background-image: url('../img/map_bg2.png');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover; /* faz a imagem preencher toda a section */
    opacity: .12;
    z-index: 0;
}

/* Conteúdo acima */
.contact-safety .container {
    position: relative;
    z-index: 2;
}

/* =========================================================
   BOX DO FORMULÁRIO
   ========================================================= */

.contact-box {
    background: #ffffff;
    padding: 40px 36px;
    border-radius: 6px;
    box-shadow: 0 20px 50px rgba(0,0,0,.35);
}

/* Inputs */
.contact-box .form-control {
    border-radius: 4px;
    padding: 12px 14px;
    font-size: .95rem;
}

/* Remove sombra padrão */
.contact-box .form-control:focus {
    box-shadow: 0 0 0 3px rgba(var(--bs-primary-rgb), .25);
    border-color: var(--bs-primary);
}

/* =========================================================
   FOOTER – THERMOSSEG
   ========================================================= */

.footer {
    background-color: #335948;
    color: #ffffff;
    padding: 70px 0 30px;
}

/* Títulos */
.footer-title {
    font-size: 1.05rem;
    font-weight: 600;
    margin-bottom: 18px;
    color: #ffffff;
}

/* Texto */
.footer-text {
    font-size: .95rem;
    line-height: 1.6;
    color: #f8fafc;
}

.footer-text.small {
    font-size: .85rem;
}

/* Links */
.footer-links,
.footer-contact {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-links li {
    margin-bottom: 10px;
}

.footer-links a,
.footer-contact a {
    color: #f1f5f9;
    text-decoration: none;
    transition: opacity .3s ease;
}

.footer-links a:hover,
.footer-contact a:hover {
    opacity: .7;
}

/* Contato */
.footer-contact li {
    display: flex;
    gap: 10px;
    font-size: .95rem;
    margin-bottom: 12px;
    align-items: flex-start;
}

.footer-contact i {
    margin-top: 4px;
    color: #e5e7eb;
}

/* Credenciados */
.footer-credenciados {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.footer-credenciados img {
    max-height: 45px;
    background: #ffffff;
    padding: 6px;
    border-radius: 6px;
}

/* Social */
.footer-social a {
    width: 38px;
    height: 38px;
    background: rgba(255,255,255,.08);
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-right: 8px;
    color: #ffffff;
    transition: transform .3s ease, background .3s ease;
}

.footer-social a:hover {
    background: var(--bs-primary);
    transform: translateY(-3px);
}

/* Bottom */
.footer-bottom {
    border-top: 1px solid rgba(255,255,255,.08);
    text-align: center;
}

.footer-bottom p {
    font-size: .85rem;
    color: #e5e7eb;
    margin: 0;
}

/* Responsivo */
@media (max-width: 767px) {
    .footer {
        padding: 50px 0 25px;
    }
}

/* ======================================================
   SECTION SUPORTE - THERMOSSEG
====================================================== */

.suporte-section{
  background: linear-gradient(135deg,#1f6f43,#0f3b26);
  padding: 60px 0;
  color:#fff;
  position: relative;
  overflow:hidden;
}

/* glow suave */
.suporte-section::before{
  content:'';
  position:absolute;
  width:500px;
  height:500px;
  background: radial-gradient(circle, rgba(255,255,255,.12), transparent 70%);
  top:-150px;
  right:-150px;
}

.suporte-title{
  font-weight:900;
  font-size: clamp(1.6rem, 2.5vw, 2.2rem);
  margin-bottom:10px;
}

.suporte-text{
  opacity:.95;
  font-size:1.05rem;
  max-width:640px;
}

.suporte-btn{
  border-radius:12px;
  font-weight:800;
  padding:10px 18px;
  transition:.25s;
}

.suporte-btn:hover{
  transform: translateY(-2px);
}

/* Responsivo */
@media(max-width:991px){
  .suporte-section{
    text-align:center;
  }
}


/* =========================================================
   CLIENTES – BORDA FULL (ESTILO HERO-SERVICES)
   ========================================================= */

.clients-carousel {
    position: relative;
    padding: 50px 0 70px;
    background: #f8f9fb;
    overflow: hidden;
}

/* Wrapper */
.clients-track-wrapper {
    width: 100%;
    overflow: hidden;
}

/* Track */
.clients-track {
    display: flex;
    align-items: center;
    gap: 40px;
    width: max-content;

    animation: clients-scroll 40s linear infinite;
}

/* Box */
.client-logo {
    width: 260px;
    height: 140px;

    position: relative;
    overflow: hidden;

    border-radius: 8px;
   border: 1px solid rgba(0,0,0,.12);

    background: #000;
    box-shadow: 0 10px 28px rgba(0,0,0,.12);
	}

	.client-logo {
		border-color: transparent;
	}

	.client-logo:hover {
		border-color: var(--bs-primary);
	}

/* Imagem FULL */
.client-logo img {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;
    object-fit: cover;

    filter: grayscale(100%);
    opacity: .85;

    transition: filter .3s ease, opacity .3s ease;
}

/* Hover clean */
.client-logo:hover img {
    filter: grayscale(0%);
    opacity: 1;
}

/* Animação */
@keyframes clients-scroll {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}

/* Pausa no hover */
.clients-track-wrapper:hover .clients-track {
    animation-play-state: paused;
}

/* =========================================================
   RESPONSIVO
   ========================================================= */

@media (max-width: 991px) {
    .client-logo {
        width: 220px;
        height: 120px;
    }
}

@media (max-width: 575px) {
    .client-logo {
        width: 180px;
        height: 100px;
    }
}

/* =========================================================
   BOTÕES FIXOS – WHATSAPP & SCROLL UP
   ========================================================= */

/* Base comum */
.whatsapp-float,
.back-to-top {
    position: fixed;
    right: 20px;
    width: 56px;
    height: 56px;

    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;

    color: #ffffff;
    text-decoration: none;
    cursor: pointer;

    box-shadow: 0 12px 28px rgba(0,0,0,.25);
    transition: 
        background .3s ease,
        transform .3s ease,
        bottom .3s ease,
        opacity .3s ease,
        visibility .3s ease;
}

/* =========================================================
   WHATSAPP
   ========================================================= */

.whatsapp-float {
    bottom: 20px;
    background: #25d366;
    font-size: 28px;
    z-index: 9999;
}

/* =========================================================
   SCROLL UP
   ========================================================= */

.back-to-top {
    bottom: 20px;
    background: var(--bs-primary);
    font-size: 18px;
    border: none;

    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    z-index: 9998;
}

/* Estado visível */
.back-to-top.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* =========================================================
   HOVER UNIFICADO
   ========================================================= */

.whatsapp-float:hover,
.back-to-top:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 40px rgba(0,0,0,.3);
}

/* Cores específicas no hover */
.whatsapp-float:hover {
    background: #1ebe5d;
}

.back-to-top:hover {
    background: #00301B;
}

/* =========================================================
   QUANDO SCROLL UP APARECE
   ========================================================= */

.whatsapp-float.whatsapp-up {
    bottom: 90px;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 575px) {

    .whatsapp-float,
    .back-to-top {
        right: 16px;
        width: 52px;
        height: 52px;
    }

    .whatsapp-float {
        bottom: 16px;
        font-size: 26px;
    }

    .whatsapp-float.whatsapp-up {
        bottom: 80px;
    }

    .back-to-top {
        bottom: 16px;
        font-size: 16px;
    }
}


/* =========================================================
   PAGE HERO
   ========================================================= */

.page-hero {
    position: relative;
    width: 100%;
    height: 70vh;
    min-height: 320px;
    max-height: 400px;
    display: flex;
    align-items: center;
    overflow: hidden;
    background: #000;
}

/* Background */
.page-hero-bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    transform: scale(1.05);
}

/* Overlay */
.page-hero-overlay {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.65);
    z-index: 1;
}

/* Conteúdo */
.page-hero .container {
    position: relative;
    z-index: 2;
}

/* Textos */
.page-hero-subtitle {
    display: block;
    font-size: .85rem;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: rgba(255,255,255,.7);
    margin-bottom: 16px;
}

.page-hero-title {
    font-size: clamp(2.6rem, 4vw, 3.6rem);
    font-weight: 700;
    color: #fff;
    margin-bottom: 20px;
}

.page-hero-text {
    font-size: 1.05rem;
    line-height: 1.7;
    color: rgba(255,255,255,.85);
    max-width: 680px;
    margin: 0 auto;
}

/* =========================================================
   RESPONSIVO
   ========================================================= */

@media (max-width: 991px) {
    .page-hero {
        height: 60vh;
        min-height: 360px;
    }
}

@media (max-width: 575px) {
    .page-hero-title {
        font-size: 2.2rem;
    }

    .page-hero-text {
        font-size: .95rem;
    }
}

/* =========================================================
   BREADCRUMB – PAGE HERO
   ========================================================= */

.page-hero-breadcrumb {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin-bottom: 18px;
    font-size: .85rem;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: rgba(255,255,255,.65);
}

.page-hero-breadcrumb a {
    color: rgba(255,255,255,.75);
    text-decoration: none;
    transition: opacity .2s ease;
}

.page-hero-breadcrumb a:hover {
    opacity: .85;
}

.page-hero-breadcrumb span {
    color: rgba(255,255,255,.55);
}

/* =========================================================
   SECTION – FAQ / DÚVIDAS FREQUENTES
   ========================================================= */

.faq-section {
    padding: 30px 0;
    background: #f8f9fb;
}

/* =========================================================
   TÍTULOS DA SEÇÃO
   ========================================================= */

.faq-section .section-subtitle {
    display: inline-block;
    font-size: .85rem;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--bs-primary);
    margin-bottom: 10px;
}

.faq-section .section-title {
    font-size: clamp(2rem, 3.5vw, 2.8rem);
    font-weight: 700;
    margin-bottom: 16px;
    color: #212529;
}

.faq-section .section-text {
    max-width: 620px;
    font-size: 1rem;
    color: #6c757d;
    line-height: 1.7;
    margin: 0 auto 50px;
}

/* =========================================================
   ACCORDION BASE
   ========================================================= */

.faq-accordion {
    max-width: 920px;
    margin: 0 auto;
}

.faq-accordion .accordion-item {
    position: relative;
    border: none;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 16px;

    background: #ffffff;
    box-shadow: 0 12px 30px rgba(0,0,0,.08);
}

/* =========================================================
   RISCO LATERAL (DESATIVADO)
   ========================================================= */

.faq-accordion .accordion-item::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;

    width: 4px;
    height: 100%;

    background: var(--bs-primary);
    opacity: 0;
    transform: scaleY(0.4);

    transition: opacity .3s ease, transform .3s ease;
}

/* Hover leve */
.faq-accordion .accordion-item:hover::before {
    opacity: .35;
    transform: scaleY(0.8);
}

/* =========================================================
   RISCO ATIVO (ACCORDION ABERTO)
   ========================================================= */

.faq-accordion .accordion-item:has(.accordion-button:not(.collapsed))::before {
    opacity: 1;
    transform: scaleY(1);
}

/* =========================================================
   HEADER
   ========================================================= */

.faq-accordion .accordion-header {
    margin: 0;
}

.faq-accordion .accordion-button {
    background: transparent;
    padding: 22px 26px 22px 32px;

    font-size: 1.05rem;
    font-weight: 600;
    color: #212529;

    box-shadow: none;
    border: none;

    transition: color .3s ease;
}

/* Remove seta padrão */
.faq-accordion .accordion-button::after {
    display: none;
}

/* Estado ativo */
.faq-accordion .accordion-button:not(.collapsed) {
    color: var(--bs-primary);
}

/* =========================================================
   ÍCONE CUSTOM (PLUS / MINUS)
   ========================================================= */

.faq-accordion .accordion-button::before {
    content: '+';
    position: absolute;
    right: 26px;
    top: 50%;
    transform: translateY(-50%);

    font-size: 1.4rem;
    font-weight: 400;
    color: var(--bs-primary);

    transition: transform .3s ease;
}

/* Quando ativo vira "-" */
.faq-accordion .accordion-button:not(.collapsed)::before {
    content: '–';
}

/* =========================================================
   BODY
   ========================================================= */

.faq-accordion .accordion-body {
    padding: 0 32px 26px;
    font-size: .95rem;
    line-height: 1.7;
    color: #6c757d;
}

/* =========================================================
   RESPONSIVO
   ========================================================= */

@media (max-width: 767px) {

    .faq-section {
        padding: 70px 0;
    }

    .faq-accordion .accordion-button {
        padding: 20px 22px 20px 28px;
        font-size: 1rem;
    }

    .faq-accordion .accordion-body {
        padding: 0 28px 24px;
    }

    .faq-accordion .accordion-button::before {
        right: 20px;
    }
}

/* =========================================================
   HERO / BREADCRUMB – ABOUT
   ========================================================= */

.about-hero {
    position: relative;
    min-height: 420px;

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

    display: flex;
    align-items: center;
}

/* Overlay escuro */
.about-hero-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
}

/* Conteúdo */
.about-hero .container {
    position: relative;
    z-index: 2;
}

.about-hero-content {
    color: #ffffff;
}

/* =========================================================
   BREADCRUMB
   ========================================================= */

.breadcrumb-custom {
    font-size: .9rem;
    margin-bottom: 16px;
    color: rgba(255,255,255,.8);
}

.breadcrumb-custom a {
    color: rgba(255,255,255,.9);
    text-decoration: none;
    transition: color .3s ease;
}

.breadcrumb-custom a:hover {
    color: #ccc; /* verde Thermosseg */
}

.breadcrumb-custom span {
    margin: 0 6px;
}

/* =========================================================
   TEXTO
   ========================================================= */

.about-hero h1 {
    font-size: clamp(2.2rem, 4vw, 3rem);
    font-weight: 700;
    margin-bottom: 16px;
    line-height: 1.2;
}

.about-hero p {
    font-size: 1.05rem;
    line-height: 1.7;
    max-width: 640px;
    color: #e9ecef;
}

/* =========================================================
   RESPONSIVO
   ========================================================= */

@media (max-width: 767px) {

    .about-hero {
        min-height: 360px;
        padding: 20px 0;
    }

    .about-hero h1 {
        font-size: 2rem;
    }

    .about-hero p {
        font-size: 1rem;
    }
}

/* =========================================================
   TREINAMENTOS – UPGRADE VISUAL (SEM PERDER BORDA VERDE)
   ========================================================= */

.training-box-pro {
  border: 1px solid rgba(15, 23, 42, .08);
  box-shadow: 0 10px 28px rgba(0,0,0,.10);
}

.training-box-pro:hover {
  border-color: rgba(var(--bs-primary-rgb), .35);
}

/* Imagem um pouco mais alta e “clean” */
.training-box-pro .training-image {
  height: 210px;
}

.training-box-pro .training-image::after {
  /* overlay mais elegante */
  background: linear-gradient(
    to bottom,
    rgba(2, 6, 23, .05),
    rgba(2, 6, 23, .45)
  );
}

/* Conteúdo com alinhamento melhor */
.training-box-pro .training-content {
  text-align: left;         /* mais “enterprise” que centralizado */
  padding: 22px 22px 26px;
}

/* Título */
.training-box-pro .training-title {
  font-size: 1.02rem;
  line-height: 1.25;
  margin-bottom: 10px;
}

/* Descrição com limite de linhas (fica sempre alinhado) */
.training-box-pro .training-desc {
  margin: 0 0 16px;
  display: -webkit-box;
  -webkit-line-clamp: 3;     /* 3 linhas */
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: calc(1.6em * 3); /* mantém altura “reta” no grid */
}

/* CTA */
.training-cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: .92rem;
  font-weight: 600;
  color: var(--bs-primary);
  transition: gap .25s ease, opacity .25s ease;
  opacity: .95;
}

.training-box:hover .training-cta {
  gap: 12px;
  opacity: 1;
}

/* Badge mais “premium” */
.training-badge {
  border: 1px solid rgba(255,255,255,.22);
  backdrop-filter: blur(6px);
}

/* Responsivo */
@media (max-width: 991px) {
  .training-box-pro .training-image {
    height: 190px;
  }
}

/* Remove shadow no hover dos cards de treinamentos */
.training-box:hover,
.training-box-pro:hover{
  box-shadow: none !important;
}

/* =========================================================
   SWIPER - BASE (setas e wrappers)
========================================================= */

.swiper-wrap-full{
  position: relative;
  width: 100%;
  padding: 0 70px; /* espaço para as setas */
}

.swiper-full{
  width: 100%;
}

.swiper-full .swiper-slide{
  height: auto;
}

/* Setas custom (base) */
.swiper-btn{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 46px;
  height: 46px;
  border-radius: 50%;
  border: none;
  background: #fff;
  color: var(--bs-primary);
  font-size: 28px;
  font-weight: bold;
  cursor: pointer;
  box-shadow: 0 10px 25px rgba(0,0,0,.15);
  z-index: 10;
  transition: .2s;
}

.swiper-btn:hover{
  background: var(--bs-primary);
  color: #fff;
}

/* Mobile - evita setas sobre cards */
@media (max-width: 767px){
  .swiper-wrap-full{
    padding: 0 40px;
  }
  .swiper-btn{
    width: 38px;
    height: 38px;
    font-size: 22px;
  }
}

/* =========================================================
   TREINAMENTOS - ajustes extras
========================================================= */

.treinamentos-swiper{
  padding-bottom: 60px;
}

/* =========================================================
   SERVIÇOS - ajustes de badge e hover
========================================================= */

/* Remove shadow/transform no hover (como você pediu) */
.service-box-pro:hover{
  box-shadow: none !important;
  transform: none !important;
}

/* badge - não cortar ícone */
.service-badge-attached{
  padding: 12px;
  min-width: 46px;
  min-height: 46px;
  overflow: visible !important;
  line-height: normal !important;
}

.service-badge-attached i{
  font-size: 19px;
  display: inline-block;
  line-height: normal !important;
  vertical-align: middle;
}

/* Coloca o badge um pouco mais para dentro do card do carrossel */
.servicos-swiper .service-badge-attached{
  top: 10px !important;
  right: 10px !important;
}

/* =========================================================
   FIX SETAS SWIPER (SERVIÇOS + TREINAMENTOS)
   Cole no FINAL do custom_thermos.css
   ========================================================= */

/* wrapper full */
.swiper-wrap-full{
  position: relative;
  width: 100%;
  padding: 0 70px; /* espaço pras setas fora */
}

/* o swiper ocupa toda a largura interna */
.swiper-full{
  width: 100%;
}

/* botão padrão */
.swiper-wrap-full .swiper-btn{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 46px;
  height: 46px;
  border-radius: 50%;
  border: none;
  background: #fff;
  color: var(--bs-primary);
  font-size: 28px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 10px 25px rgba(0,0,0,.15);
  z-index: 20;
  transition: .2s;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.swiper-wrap-full .swiper-btn:hover{
  background: var(--bs-primary);
  color: #fff;
}

/* posições - SERVIÇOS */
.swiper-wrap-full .servicos-prev{ left: 15px; }
.swiper-wrap-full .servicos-next{ right: 15px; }

/* posições - TREINAMENTOS */
.swiper-wrap-full .treinos-prev{ left: 15px; }
.swiper-wrap-full .treinos-next{ right: 15px; }

/* mobile: menos padding e botões menores */
@media (max-width: 767px){
  .swiper-wrap-full{ padding: 0 40px; }

  .swiper-wrap-full .swiper-btn{
    width: 38px;
    height: 38px;
    font-size: 22px;
  }

  .swiper-wrap-full .servicos-prev,
  .swiper-wrap-full .treinos-prev{ left: 8px; }

  .swiper-wrap-full .servicos-next,
  .swiper-wrap-full .treinos-next{ right: 8px; }
}
/* =========================
   CLIENTES - SWIPER
========================= */
.clients-carousel{
  padding: 70px 0;
  background: #fff;
}

.clients-swiper-wrap{
  position: relative;
  width: 100%;
  padding: 0 70px;
}

.clients-swiper{
  width: 100%;
  overflow: hidden;
}

.clients-swiper .swiper-wrapper{
  align-items: stretch;
}

.clients-swiper .swiper-slide{
  height: auto;
}

/* CARD DO CLIENTE – 2:1 (200x100) */
.client-card{
  background: #fff;
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 14px;

  aspect-ratio: 2 / 1;
  width: 100%;

  overflow: hidden;
  box-shadow: none;
}

/* imagem ocupa o card + PB */
.client-card img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;

  filter: grayscale(100%);
  opacity: .85;
  transition: filter .25s ease, opacity .25s ease, transform .25s ease;
}

/* hover colorido */
.client-card:hover img{
  filter: grayscale(0%);
  opacity: 1;
  transform: scale(1.03);
}

/* SETAS (garante clique e ficar por cima) */
.clients-prev,
.clients-next{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 50;
  pointer-events: auto;
}
.clients-prev{ left: 15px; }
.clients-next{ right: 15px; }

/* RESPONSIVO */
@media (max-width: 767px){
  .clients-swiper-wrap{ padding: 0 40px; }
}

/* =========================
   MENU MOBILE FUNDO VERDE THERMOSSEG
========================= */

@media (max-width: 991.98px){

  /* Fundo do dropdown */
  #page-header .dropdown-menu{
    background: #1f6f43 !important;
    border-color: rgba(255,255,255,.15) !important;
  }

  /* Cabeçalho "Menu Principal" */
  #page-header .dropdown-menu .bg-body-light{
    background: rgba(0,0,0,.15) !important;
    color: #fff !important;
  }

  /* Texto menu */
  #page-header .dropdown-menu .nav-main-link{
    color: rgba(255,255,255,.95) !important;
  }

  /* Hover */
  #page-header .dropdown-menu .nav-main-link:hover{
    background: rgba(255,255,255,.12) !important;
    color: #fff !important;
  }

  /* Active */
  #page-header .dropdown-menu .nav-main-link.active{
    background: rgba(255,255,255,.18) !important;
    color: #fff !important;
  }

  /* Divisor */
  #page-header .dropdown-divider{
    border-color: rgba(255,255,255,.2) !important;
  }

}

/* =========================
   CONTATO – LAYOUT
========================= */
.contact-page{
  padding: 30px 0;
  background: #f8f9fb;
}

.contact-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 28px;
  align-items: start;
}

@media (max-width: 991px){
  .contact-grid{ grid-template-columns: 1fr; }
}

/* Card */
.contact-card{
  background: #fff;
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 16px;
  padding: 26px;
}

/* Títulos */
.contact-card h2{
  font-size: 22px;
  margin: 0 0 8px 0;
  font-weight: 800;
  color: #111827;
}
.contact-card p{
  margin: 0 0 16px 0;
  color: #4b5563;
  line-height: 1.7;
  font-size: 15px;
}

/* Infos */
.contact-info{
  display: grid;
  gap: 12px;
  margin-top: 14px;
  margin-bottom: 18px;
}
.contact-info .info-item{
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 12px;
  align-items: start;
}
.contact-info .info-ico{
  width: 34px;
  height: 34px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(31,111,67,.10);
  color: #1f6f43;
  font-weight: 900;
}
.contact-info .info-text strong{
  display: block;
  font-size: 14px;
  color: #111827;
  margin-bottom: 2px;
}
.contact-info .info-text span,
.contact-info .info-text a{
  display: block;
  font-size: 14px;
  color: #4b5563;
  text-decoration: none;
}
.contact-info .info-text a:hover{
  color: #1f6f43;
  text-decoration: underline;
}

/* Mapa */
.map-wrap{
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid rgba(0,0,0,.06);
}
.map-wrap iframe{
  width: 100%;
  height: 320px;
  border: 0;
  display: block;
}

/* Form */
.contact-form .form-label{
  font-weight: 700;
  color: #111827;
  font-size: 13px;
  margin-bottom: 6px;
}
.contact-form .form-control{
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,.12);
  padding: 12px 12px;
}
.contact-form .form-control:focus{
  border-color: rgba(31,111,67,.45);
  box-shadow: 0 0 0 .2rem rgba(31,111,67,.12);
}

.contact-actions{
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 10px;
}

.contact-note{
  font-size: 13px;
  color: #6b7280;
  margin-top: 10px;
}

/* =========================
   MAPA FULL FOOTER (PREMIUM)
========================= */
.footer-map{
  position: relative;
  width: 100%;
  background: #0b1220;
  overflow: hidden;
  border-top-left-radius: 28px;
  border-top-right-radius: 28px;
}

.footer-map iframe{
  width: 100%;
  height: 460px;
  border: 0;
  display: block;
  filter: saturate(1.05) contrast(1.02);
}

.footer-map::before{
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(10,15,25,.70) 0%, rgba(10,15,25,.15) 55%, rgba(31,111,67,.18) 100%);
  pointer-events: none;
  z-index: 1;
}

.footer-map .map-overlay{
  position: absolute;
  left: 0;
  right: 0;
  top: 22px;
  z-index: 2;
}

.footer-map .map-overlay .container{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.footer-map .map-title{
  margin: 0;
  color: #fff;
  font-size: 20px;
  font-weight: 800;
  letter-spacing: .2px;
}

.footer-map .map-subtitle{
  margin: 4px 0 0 0;
  color: rgba(255,255,255,.85);
  font-size: 13px;
  line-height: 1.4;
}

.footer-map .map-cta{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.08);
  color: #fff;
  text-decoration: none;
  font-weight: 700;
  font-size: 13px;
  backdrop-filter: blur(10px);
}

.footer-map .map-cta:hover{
  background: rgba(255,255,255,.14);
  color: #fff;
}

@media (max-width: 768px){
  .footer-map iframe{ height: 340px; }
  .footer-map .map-overlay .container{
    flex-direction: column;
    align-items: flex-start;
  }
  .footer-map{ border-top-left-radius: 18px; border-top-right-radius: 18px; }
}

/* =========================================================
   eSOCIAL – COMPACT V2 (CARD ESTILO TREINAMENTOS)
   Imagem esquerda / texto direita + highlights enterprise
   ========================================================= */

.esocial-compact-v2{
  padding: 0 0 100px 0;
  background: #f8f9fb;
}

/* card horizontal (usa training-box como base) */
.esocial-card-v2{
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  align-items: stretch;
  overflow: hidden;
}

/* thumb (imagem) */
.esocial-thumb-v2{
  height: 100%;
  min-height: 290px;
}

.esocial-thumb-v2 img{
  height: 100%;
  object-fit: cover;
  object-position: center 18%; /* top soft */
}

/* conteúdo */
.esocial-content-v2{
  text-align: left;
  padding: 26px 28px 28px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* linha superior: kicker + chip */
.esocial-topline{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.esocial-kicker-v2{
  display: inline-block;
  font-size: .82rem;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-weight: 800;
  color: #00301B;
}

.esocial-chip-v2{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 7px 10px;
  border-radius: 999px;
  font-size: .82rem;
  font-weight: 700;
  color: #1f6f43;
  background: rgba(31,111,67,.10);
  border: 1px solid rgba(31,111,67,.14);
  white-space: nowrap;
}

/* título + texto */
.esocial-title-v2{
  font-weight: 900;
  color: #111827;
  font-size: 1.35rem;
  line-height: 1.2;
  margin: 0 0 10px;
}

.esocial-text-v2{
  margin: 0 0 16px;
  font-size: .98rem;
  line-height: 1.7;
  color: #6b7280;
  max-width: 520px;
}

/* =========================================================
   HIGHLIGHTS (substitui os mini cards)
   ========================================================= */

.esocial-highlights-v2{
  display: grid;
  gap: 10px;
  margin: 0 0 16px;
}

/* linha highlight */
.esocial-highlight{
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 12px;
  align-items: start;

  padding: 12px 14px;

  background: #ffffff;
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 12px;

  position: relative;
  transition: all .25s ease;
}

/* risquinho lateral verde Thermos */
.esocial-highlight::before{
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 3px;
  height: 100%;
  background: var(--bs-primary);
  border-top-left-radius: 12px;
  border-bottom-left-radius: 12px;
  opacity: .85;
}

/* hover leve padrão */
.esocial-highlight:hover{
  border-color: rgba(var(--bs-primary-rgb), .25);
  box-shadow: 0 12px 30px rgba(0,0,0,.10);
  transform: translateY(-2px);
}

/* ícone */
.hl-icon{
  width: 34px;
  height: 34px;
  border-radius: 10px;

  display: flex;
  align-items: center;
  justify-content: center;

  background: rgba(31,111,67,.10);
  color: #1f6f43;
  font-weight: 900;
  font-size: 15px;
}

/* textos */
.esocial-highlight strong{
  display: block;
  font-size: .95rem;
  color: #111827;
  margin-bottom: 2px;
}

.esocial-highlight p{
  margin: 0;
  font-size: .9rem;
  color: #6b7280;
  line-height: 1.5;
}

/* CTAs */
.esocial-actions-v2{
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 2px;
}

/* rodapé */
.esocial-footnote-v2{
  margin-top: 12px;
  font-size: .9rem;
  color: #6b7280;
}

/* animação leve */
.esocial-anim{
  animation: esocialFadeUp .6s ease both;
}
@keyframes esocialFadeUp{
  from{ opacity: 0; transform: translateY(14px); }
  to{ opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce){
  .esocial-anim{ animation: none !important; }
}

/* responsivo */
@media (max-width: 991px){
  .esocial-compact-v2{ padding: 45px 0; }

  .esocial-card-v2{
    grid-template-columns: 1fr;
  }

  .esocial-thumb-v2{
    min-height: 230px;
  }

  .esocial-thumb-v2 img{
    object-position: center 14%;
  }

  .esocial-content-v2{
    padding: 22px;
  }

  .esocial-topline{
    flex-wrap: wrap;
    justify-content: flex-start;
  }
}
/* =========================================================
   FOOTER PRO – acabamento premium
   Cole no FINAL do custom_thermos.css
========================================================= */

.footer.footer-pro{
  position: relative;
  background:
    radial-gradient(900px 480px at 15% 10%, rgba(255,255,255,.08), transparent 60%),
    radial-gradient(700px 420px at 90% 0%, rgba(31,111,67,.18), transparent 55%),
    #335948;
}

/* linha de separação superior sutil */
.footer.footer-pro::before{
  content: "";
  position: absolute;
  left: 0; right: 0; top: 0;
  height: 1px;
  background: rgba(255,255,255,.08);
}

/* Links com “risquinho” e alinhamento */
.footer-links-pro li{
  margin-bottom: 10px;
}
.footer-links-pro a{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  position: relative;
  padding-left: 14px;
}
.footer-links-pro a::before{
  content: "";
  width: 6px;
  height: 2px;
  background: rgba(255,255,255,.40);
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  transition: width .25s ease, opacity .25s ease, background .25s ease;
  opacity: .65;
}
.footer-links-pro a:hover::before{
  width: 10px;
  opacity: 1;
  background: #fff;
}

/* Credenciados com visual mais “clean” */
.footer-credenciados-pro img{
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(0,0,0,.06);
  box-shadow: 0 10px 22px rgba(0,0,0,.10);
  transition: transform .25s ease, opacity .25s ease;
  opacity: .95;
}
.footer-credenciados-pro img:hover{
  transform: translateY(-2px);
  opacity: 1;
}

/* CTA mini */
.footer-mini-cta{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.08);
  color: #fff;
  text-decoration: none;
  font-weight: 700;
  font-size: 13px;
  width: fit-content;
  backdrop-filter: blur(8px);
}
.footer-mini-cta:hover{
  background: rgba(255,255,255,.14);
  color: #fff;
}

/* Bottom mais alinhado */
.footer-bottom-pro{
  border-top: 1px solid rgba(255,255,255,.10);
}

/* =========================================================
   BOTÃO ADMIN – bem discreto, mas acessível
========================================================= */

.footer-admin-wrap{
  display: flex;
  justify-content: flex-start;
}

.footer-admin-btn{
  display: inline-flex;
  align-items: center;
  gap: 8px;

  padding: 8px 10px;
  border-radius: 999px;

  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.06);

  color: rgba(255,255,255,.55);
  text-decoration: none;

  font-size: 12px;
  font-weight: 700;
  letter-spacing: .2px;

  opacity: .55;
  transition: opacity .2s ease, transform .2s ease, background .2s ease, border-color .2s ease, color .2s ease;
}

.footer-admin-btn i{
  font-size: 12px;
}

/* some o texto no desktop, fica só o ícone (super discreto) */
@media (min-width: 992px){
  .footer-admin-btn span{ display: none; }
  .footer-admin-btn{ padding: 8px 9px; }
}

/* aparece mais no hover e no foco (teclado) */
.footer-admin-btn:hover{
  opacity: 1;
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.18);
  color: #fff;
  transform: translateY(-1px);
}

.footer-admin-btn:focus-visible{
  outline: none;
  opacity: 1;
  color: #fff;
  box-shadow: 0 0 0 3px rgba(255,255,255,.18);
}
/* =========================================
   Footer bottom com admin inline
========================================= */

.footer-bottom-admin{
  border-top: 1px solid rgba(255,255,255,.10);
}

.footer-bottom-flex{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

/* Texto */
.footer-copy{
  font-size: 13px;
  color: rgba(255,255,255,.75);
}

/* Botão ADMIN discreto */
.footer-admin-inline{
  display: inline-flex;
  align-items: center;
  gap: 6px;

  font-size: 12px;
  font-weight: 700;

  color: rgba(255,255,255,.45);
  text-decoration: none;

  padding: 6px 10px;
  border-radius: 999px;

  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.04);

  opacity: .55;

  transition: all .25s ease;
}

.footer-admin-inline i{
  font-size: 11px;
}

/* Desktop → só ícone (ultra discreto) */
@media (min-width: 992px){
  .footer-admin-inline span{
    display: none;
  }
  .footer-admin-inline{
    padding: 6px 8px;
  }
}

/* Hover */
.footer-admin-inline:hover{
  opacity: 1;
  color: #fff;
  border-color: rgba(255,255,255,.18);
  background: rgba(255,255,255,.10);
  transform: translateY(-1px);
}

/* Focus acessibilidade */
.footer-admin-inline:focus-visible{
  outline: none;
  box-shadow: 0 0 0 3px rgba(255,255,255,.18);
  opacity: 1;
}

/* =========================================================
   BLOG HOME v3 – 1 destaque grande + 1 menor (premium)
========================================================= */
.blog-home-v3{
  position: relative;
  padding: 78px 0;
  background: #0b1220;
  overflow: hidden;
}
.blog-home-v3::before{
  content:"";
  position:absolute;
  inset:-2px;
  background:
    radial-gradient(780px 420px at 14% 22%, rgba(31,111,67,.38), transparent 62%),
    radial-gradient(560px 360px at 92% 72%, rgba(31,111,67,.20), transparent 62%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0));
  pointer-events:none;
}
.blog-home-v3 .container{
  position: relative;
  z-index: 2;
  max-width: 1180px;
}

/* header */
.blog-v3-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap: 16px;
  flex-wrap:wrap;
  margin-bottom: 22px;
}
.blog-v3-kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(31,111,67,.14);
  border: 1px solid rgba(31,111,67,.28);
  color: #b7f7d7;
  font-weight: 900;
  letter-spacing: .2px;
  font-size: 12px;
}
.blog-v3-title{
  margin: 10px 0 0;
  color:#fff;
  font-weight: 900;
  font-size: clamp(1.6rem, 2.5vw, 2.2rem);
  line-height: 1.12;
}
.blog-v3-desc{
  margin: 10px 0 0;
  color: rgba(255,255,255,.78);
  line-height: 1.7;
  max-width: 760px;
}
.blog-v3-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.blog-v3-actions .btn{
  border-radius: 14px;
  font-weight: 900;
}

/* grid */
.blog-v3-grid{
  display:grid;
  grid-template-columns: 1.35fr .65fr;
  gap: 18px;
  align-items:start;
}

/* base card */
.blog-v3-card{
  display:block;
  text-decoration:none;
  color: inherit;
  border-radius: 20px;
  overflow:hidden;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  box-shadow: 0 18px 45px rgba(0,0,0,.38);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.blog-v3-card:hover{
  transform: translateY(-8px);
  box-shadow: 0 28px 70px rgba(0,0,0,.48);
  border-color: rgba(31,111,67,.46);
}

/* thumb */
.blog-v3-thumb{
  position: relative;
  background:#0b1220;
  overflow:hidden;
}
.blog-v3-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  transform: scale(1.06);
  filter: blur(14px);
  transition: filter .35s ease, transform .6s ease;
}
.blog-v3-thumb img.is-loaded{
  filter: blur(0);
  transform: scale(1);
}
.blog-v3-card:hover .blog-v3-thumb img.is-loaded{
  transform: scale(1.08);
}
.blog-v3-thumb::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 18% 10%, rgba(31,111,67,.22), transparent 55%),
    linear-gradient(180deg, rgba(0,0,0,.04) 0%, rgba(0,0,0,.68) 100%);
}

/* badge */
.blog-v3-badge{
  position:absolute;
  left: 14px;
  top: 14px;
  z-index: 2;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding: 7px 11px;
  border-radius: 999px;
  background: rgba(31,111,67,.18);
  border: 1px solid rgba(31,111,67,.35);
  color:#d8ffe9;
  font-weight: 900;
  font-size: 12px;
  backdrop-filter: blur(8px);
}

/* meta */
.blog-v3-meta{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
  color: rgba(255,255,255,.74);
  font-weight: 900;
  font-size: 12px;
}
.blog-v3-meta .dot{ opacity:.5; }

/* featured */
.blog-v3-featured .blog-v3-thumb{ height: 360px; }
.blog-v3-featured .blog-v3-body{
  padding: 18px 18px 20px;
}
.blog-v3-featured h3{
  margin: 10px 0 10px;
  color:#fff;
  font-weight: 950;
  font-size: 20px;
  line-height: 1.22;
}
.blog-v3-featured p{
  margin: 0 0 14px;
  color: rgba(255,255,255,.78);
  line-height: 1.65;
  font-size: 14px;
}
.blog-v3-more{
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:#b7f7d7;
  font-weight: 950;
  font-size: 13px;
  transition: gap .25s ease;
}
.blog-v3-more i{
  font-size: 12px;
  transition: transform .25s ease;
}
.blog-v3-card:hover .blog-v3-more{ gap: 14px; }
.blog-v3-card:hover .blog-v3-more i{ transform: translateX(4px); }

/* side column */
.blog-v3-side{
  display:flex;
  flex-direction:column;
  gap: 14px;
}

/* small card */
.blog-v3-small .blog-v3-thumb{ height: 160px; }
.blog-v3-small .blog-v3-body{ padding: 14px 14px 16px; }
.blog-v3-small h4{
  margin: 10px 0 8px;
  color:#fff;
  font-weight: 950;
  font-size: 15.5px;
  line-height: 1.25;
}
.blog-v3-small p{
  margin: 0 0 10px;
  color: rgba(255,255,255,.78);
  font-size: 13.5px;
  line-height: 1.55;
}

/* info box */
.blog-v3-infobox{
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.10);
  background:
    radial-gradient(520px 260px at 15% 20%, rgba(31,111,67,.22), transparent 62%),
    rgba(255,255,255,.04);
  box-shadow: 0 18px 45px rgba(0,0,0,.38);
  padding: 16px;
}
.blog-v3-infobox h5{
  margin: 0 0 8px;
  color:#fff;
  font-weight: 950;
  font-size: 15.5px;
}
.blog-v3-infobox p{
  margin: 0 0 12px;
  color: rgba(255,255,255,.78);
  line-height: 1.7;
  font-size: 13.5px;
}
.blog-v3-infobox ul{
  margin: 0;
  padding-left: 18px;
  color: rgba(255,255,255,.78);
  line-height: 1.8;
  font-size: 13.5px;
}
.blog-v3-note{
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed rgba(255,255,255,.16);
  color: rgba(255,255,255,.66);
  font-weight: 900;
  font-size: 12.5px;
}

/* empty state */
.blog-v3-empty{
  padding: 18px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  color: rgba(255,255,255,.78);
  box-shadow: 0 18px 45px rgba(0,0,0,.38);
}

/* responsive */
@media (max-width: 991px){
  .blog-home-v3{ padding: 56px 0; }
  .blog-v3-grid{ grid-template-columns: 1fr; }
  .blog-v3-featured .blog-v3-thumb{ height: 240px; }
  .blog-v3-small .blog-v3-thumb{ height: 210px; }
}

/* =========================================================
   HERO V2 (SWIPER) – CSS COMPLETO
========================================================= */

.hero-thermos-v2{
  position: relative;
  width: 100%;
  overflow: hidden;
  background: #0b1412;

  /* altura do hero */
  height: 78vh;
  min-height: 520px;
  max-height: 860px;
}

@media (max-width: 991.98px){
  .hero-thermos-v2{
    height: 72vh;
    min-height: 520px;
  }
}
@media (max-width: 575.98px){
  .hero-thermos-v2{
    height: 66vh;
    min-height: 500px;
  }
}

/* garante 100% de altura em toda cadeia do Swiper */
.hero-thermos-v2 .hero-v2-swiper-wrap,
.hero-thermos-v2 .hero-v2-swiper,
.hero-thermos-v2 .swiper-wrapper,
.hero-thermos-v2 .swiper-slide{
  height: 100%;
}

/* slide com background cobrindo tudo */
.hero-thermos-v2 .hero-v2-slide{
  position: relative;
  height: 100%;
  min-height: 0;

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

  display: flex;
  align-items: center;
}

/* máscara */
.hero-thermos-v2 .hero-v2-mask{
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      90deg,
      rgba(5, 15, 12, .88) 0%,
      rgba(8, 25, 20, .72) 45%,
      rgba(10, 35, 28, .55) 100%
    ),
    linear-gradient(
      180deg,
      rgba(15, 70, 55, .18) 0%,
      rgba(0, 0, 0, .05) 60%
    );
}

/* conteúdo */
.hero-thermos-v2 .hero-v2-content{
  position: relative;
  z-index: 2;
  width: 100%;
  padding: 90px 0;
}

@media (max-width: 575.98px){
  .hero-thermos-v2 .hero-v2-content{
    padding: 72px 0;
  }
}

.hero-thermos-v2 .hero-v2-subtitle{
  display: inline-block;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: .85rem;
  color: rgba(255,255,255,.92);
  margin-bottom: 14px;
}

.hero-thermos-v2 .hero-v2-title{
  color: #fff;
  font-weight: 800;
  line-height: 1.05;
  font-size: clamp(2rem, 3.2vw, 3.4rem);
  margin: 0 0 14px;
}

.hero-thermos-v2 .hero-v2-text{
  color: rgba(255,255,255,.92);
  font-size: 1.05rem;
  line-height: 1.55;
  max-width: 56ch;
  margin: 0 0 22px;
}

/* ===== animação estável (transição) ===== */
.hero-thermos-v2 .hero-v2-subtitle,
.hero-thermos-v2 .hero-v2-title,
.hero-thermos-v2 .hero-v2-text,
.hero-thermos-v2 .hero-v2-btn{
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .55s ease, transform .55s ease;
  will-change: opacity, transform;
}

/* quando o slide ativo recebe hero-v2-anim via JS */
.hero-thermos-v2 .hero-v2-anim .hero-v2-subtitle{ opacity:1; transform:none; transition-delay: .00s; }
.hero-thermos-v2 .hero-v2-anim .hero-v2-title   { opacity:1; transform:none; transition-delay: .10s; }
.hero-thermos-v2 .hero-v2-anim .hero-v2-text    { opacity:1; transform:none; transition-delay: .22s; }
.hero-thermos-v2 .hero-v2-anim .hero-v2-btn     { opacity:1; transform:none; transition-delay: .34s; }

@media (prefers-reduced-motion: reduce){
  .hero-thermos-v2 .hero-v2-subtitle,
  .hero-thermos-v2 .hero-v2-title,
  .hero-thermos-v2 .hero-v2-text,
  .hero-thermos-v2 .hero-v2-btn{
    transition: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

/* ===== setinhas discretas ===== */
.hero-thermos-v2 .hero-v2-arrow{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);

  width: 44px;
  height: 44px;
  border-radius: 999px;

  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  color: rgba(255,255,255,.88);

  display: grid;
  place-items: center;

  opacity: .55;
  transition: opacity .18s ease, background .18s ease, transform .18s ease;
  z-index: 10;
  backdrop-filter: blur(6px);
  cursor: pointer;
  user-select: none;
}

.hero-thermos-v2 .hero-v2-prev{ left: 14px; }
.hero-thermos-v2 .hero-v2-next{ right: 14px; }

.hero-thermos-v2:hover .hero-v2-arrow{
  opacity: .85;
}

.hero-thermos-v2 .hero-v2-arrow:hover{
  background: rgba(255,255,255,.12);
  transform: translateY(-50%) scale(1.02);
}

.hero-thermos-v2 .hero-v2-arrow:focus-visible{
  outline: none;
  box-shadow: 0 0 0 3px rgba(255,255,255,.18);
}


@media (max-width: 575.98px){
  .hero-thermos-v2 .hero-v2-arrow{
    width: 40px;
    height: 40px;
    opacity: .45;
  }
  .hero-thermos-v2 .hero-v2-prev{ left: 10px; }
  .hero-thermos-v2 .hero-v2-next{ right: 10px; }
}

/* =========================================================
   HERO V2 (SWIPER) – NOVO
========================================================= */

.hero-thermos-v2{
  position: relative;
  width: 100%;
  overflow: hidden;
  background: #0b1412; /* fallback */
}

.hero-v2-swiper-wrap{
  position: relative;
}

.hero-v2-swiper{
  width: 100%;
}

.hero-v2-slide{
  position: relative;
  min-height: 520px;
  height: 78vh;
  max-height: 860px;

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

  display: flex;
  align-items: center;
}

@media (max-width: 991.98px){
  .hero-v2-slide{
    height: 72vh;
    min-height: 520px;
  }
}
@media (max-width: 575.98px){
  .hero-v2-slide{
    height: 66vh;
    min-height: 500px;
  }
}

.hero-v2-mask{
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(0,0,0,.62) 0%, rgba(0,0,0,.35) 52%, rgba(0,0,0,.20) 100%);
}

/* conteúdo */
.hero-v2-content{
  position: relative;
  z-index: 2;
  width: 100%;
  padding: 90px 0;
}

.hero-v2-subtitle{
  display: inline-block;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: .85rem;
  color: rgba(255,255,255,.9);
  margin-bottom: 14px;
}

.hero-v2-title{
  color: #fff;
  font-weight: 800;
  line-height: 1.05;
  font-size: clamp(2rem, 3.2vw, 3.4rem);
  margin: 0 0 14px;
}

.hero-v2-text{
  color: rgba(255,255,255,.9);
  font-size: 1.05rem;
  line-height: 1.55;
  max-width: 56ch;
  margin: 0 0 22px;
}

/* ===== animação do texto (estável) ===== */
.hero-v2-subtitle,
.hero-v2-title,
.hero-v2-text,
.hero-v2-btn{
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .55s ease, transform .55s ease;
  will-change: opacity, transform;
}

.hero-v2-anim .hero-v2-subtitle{ opacity:1; transform:none; transition-delay: .00s; }
.hero-v2-anim .hero-v2-title   { opacity:1; transform:none; transition-delay: .10s; }
.hero-v2-anim .hero-v2-text    { opacity:1; transform:none; transition-delay: .22s; }
.hero-v2-anim .hero-v2-btn     { opacity:1; transform:none; transition-delay: .34s; }

@media (prefers-reduced-motion: reduce){
  .hero-v2-subtitle,
  .hero-v2-title,
  .hero-v2-text,
  .hero-v2-btn{
    transition: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

/* setinhas: usa o MESMO estilo base .swiper-btn do seu site */
.hero-v2-prev{ left: 14px; }
.hero-v2-next{ right: 14px; }

@media (max-width: 575.98px){
  .hero-v2-prev{ left: 10px; }
  .hero-v2-next{ right: 10px; }
}
/* ==========================================================
   FIX DEFINITIVO: remover overlay/gradiente “passando”
   Cole no FINAL do custom_thermos.css (últimas linhas)
========================================================== */

.training-image::before,
.training-image::after,
.training-box-pro .training-image::before,
.training-box-pro .training-image::after,
.esocial-thumb-v2::before,
.esocial-thumb-v2::after{
  content: "" !important;
  background: none !important;
  background-image: none !important;
  opacity: 0 !important;
  display: none !important;
  animation: none !important;
  transition: none !important;
}

/* (opcional) se também tiver zoom/transform gerando efeito estranho */
.training-image img,
.esocial-thumb-v2 img{
  transform: none !important;
  transition: none !important;
  filter: none !important;
}
/* FIX: evita slide ficar sem altura (imagem some) */
.clients-swiper .swiper-slide{
  height: auto;
  display: flex;
}

.clients-swiper .client-card{
  width: 100%;
  height: 110px;      /* fallback forte */
  aspect-ratio: auto; /* evita depender do aspect-ratio no swiper */
}

@media (min-width: 768px){
  .clients-swiper .client-card{ height: 120px; }
}
@media (min-width: 1200px){
  .clients-swiper .client-card{ height: 130px; }
}

.clients-swiper .client-card img{
  width: 100%;
  height: 100%;
  object-fit: contain; /* melhor pra logo (não corta) */
  display: block;
}
/* =================================================
   REMOVE OVERLAY / SHINE / GRADIENT ANIMADO
================================================= */

/* Clients carousel */
.clients-carousel::before,
.clients-carousel::after,
.clients-swiper::before,
.clients-swiper::after,
.client-card::before,
.client-card::after{
  display: none !important;
  content: none !important;
  background: none !important;
  background-image: none !important;
  animation: none !important;
}

/* Training / imagens gerais */
.training-image::before,
.training-image::after,
.training-box-pro .training-image::before,
.training-box-pro .training-image::after{
  display: none !important;
  content: none !important;
  background: none !important;
  background-image: none !important;
  animation: none !important;
}

/* Segurança extra (caso venha de CSS global) */
.clients-carousel *::before,
.clients-carousel *::after{
  animation: none !important;
  background-image: none !important;
}
/* TREINAMENTOS: não cortar card quando ele "sobe" */
section.treinamentos{
  background: #f8f9fb; /* seu fundo */
  overflow: visible;   /* permite passar pra fora */
}

/* espaço extra em cima/baixo pro hover não bater */
.treinamentos .swiper-wrapper{
  padding: 18px 0 0px;
}

/* se o card sobe com translateY, garante que fica por cima */
.treinamentos .swiper-slide{
  overflow: visible;
}

.treinamentos .training-box{
  position: relative;
  z-index: 1;
}

.treinamentos .swiper-slide:hover .training-box{
  z-index: 5;
}

/* =========================
   TREINAMENTOS – remover shadow
========================= */

/* card normal */
.training-box,
.training-box-pro{
  box-shadow: none !important;
}

/* remove também no hover (se existir regra antiga) */
.treinamentos .training-box:hover,
.treinamentos .training-box-pro:hover{
  box-shadow: none !important;
}
/* Remove shadow/transform no hover (somente fora do carrossel de serviços) */
.service-box-pro:hover{
  box-shadow: none !important;
}

/* no carrossel de serviços, libera transform */
.hero-servicos .service-box-pro:hover{
  transform: translateY(-10px) !important;
  box-shadow: 0 18px 45px rgba(0,0,0,.15);
}

section.hero-servicos{ overflow: visible; }


.hero-servicos .swiper-wrapper{ padding: 18px 0 0px; }
.hero-servicos .swiper-slide{ overflow: visible; }

.hero-servicos .service-box-pro{
  position: relative;
  z-index: 1;
  transition: transform .25s ease, box-shadow .25s ease;
  will-change: transform;
}

.hero-servicos .swiper-slide:hover .service-box-pro{ z-index: 5; }

.hero-servicos .service-box-pro{
  box-shadow: none;
}

.hero-servicos .swiper-slide:hover .service-box-pro{
  transform: translateY(-10px);
  box-shadow: 0 18px 45px rgba(0,0,0,.15);
}

/* =========================
   TOPBAR GLASS (premium + discreta)
========================= */
.header-topbar-glass{
  position: relative;
  z-index: 101; /* acima do fundo do header, abaixo de modais */
  border-bottom: 1px solid rgba(17,24,39,.08);

  /* glass */
  background: rgba(255,255,255,.62);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}

.header-topbar-glass-inner{
  height: 32px;      /* bem fino */
  min-height: 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* grupos */
.topbar-glass-left,
.topbar-glass-right{
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

/* links (tel/email) */
.topbar-glass-link{
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #556070;
  font-size: 12px;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
}

.topbar-glass-link i{
  font-size: 12px;
  opacity: .8;
}

.topbar-glass-link:hover{
  color: #0f2f2a;
  text-decoration: none;
}

/* separadores */
.topbar-glass-dot{
  width: 4px;
  height: 4px;
  border-radius: 999px;
  background: rgba(17,24,39,.22);
  opacity: .4;
}

.topbar-glass-sep{
  width: 1px;
  height: 14px;
  background: rgba(17,24,39,.10);
}

/* ícones sociais */
.topbar-glass-icon{
  width: 22px;
  height: 22px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #667085;
  text-decoration: none;
  border: 1px solid rgba(17,24,39,.08);
  background: rgba(255,255,255,.35);
}

.topbar-glass-icon i{
  font-size: 12px;
  opacity: .9;
}

.topbar-glass-icon:hover{
  color: #0f2f2a;
  border-color: rgba(15,47,42,.20);
  background: rgba(15,47,42,.05);
  text-decoration: none;
}

/* WhatsApp pill (desktop) */
.topbar-glass-whats{
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 12px;
  line-height: 1;
  color: #0f2f2a;
  text-decoration: none;
  background: rgba(15,47,42,.06);
  border: 1px solid rgba(15,47,42,.10);
}

.topbar-glass-whats i{ font-size: 13px; }

.topbar-glass-whats:hover{
  background: rgba(15,47,42,.10);
  border-color: rgba(15,47,42,.18);
  text-decoration: none;
}

/* mobile: mais compacto */
@media (max-width: 575.98px){
  .header-topbar-glass-inner{
    height: 30px;
    min-height: 30px;
  }
  .topbar-glass-link{
    font-size: 11px;
    gap: 6px;
  }
  .topbar-glass-icon{
    width: 21px;
    height: 21px;
  }
}

/* opcional: compactar um pouco o header principal */
#page-header .content-header{
  padding-top: 12px;
  padding-bottom: 12px;
}
/* remove “linha”/gap embaixo do thumb */
.blog-v3-thumb{
  line-height: 0;          /* mata o baseline gap */
  font-size: 0;            /* reforço */
  transform: translateZ(0);/* força composição */
  backface-visibility: hidden;
}

.blog-v3-thumb img{
  display: block;          /* evita 1px de baseline */
  width: 100%;
  height: 100%;
  transform: translateZ(0) scale(1.06); /* evita seam com blur/transform */
  backface-visibility: hidden;
}

/* overlay não pode interferir nem “criar borda” */
.blog-v3-thumb::after{
  pointer-events: none;
  transform: translateZ(0);
}
