/* CSS Document Perfecto2025 */
@charset "UTF-8";

/* Estilos para as páginas de pagamento */
body{background:#fff;}
.page-wrap{max-width:1140px;}
/* topo */
.page-header-min{border-bottom:1px solid #eee; background:#f8f9fb;}
.brand-left img{height:50px}
.brand-left span{
    margin-left:8px;
    font-family: Montserrat, sans-serif;
    font-weight:600;
    color:#1a3b5d;
    font-size: clamp(0.9rem, 0.7rem + 1vw, 1.2rem); 
}
b {
    font-weight: 500; /* semibold */
}  

/* hero */
.produto-hero img{
width: 100%;
height: auto;    /* mantém a proporção vertical */
display: block;  /* evita “gap” abaixo da imagem */
border-radius: 12px;
}
/* Cresce suavemente do mobile ao desktop */
.produto-titulo{
font-family: Montserrat, sans-serif;
font-weight: 600;
line-height:1.15;
color:#343434;
font-size: clamp(1.75rem, 1rem + 2vw, 2.4rem); /* ~28px → 48px */
}

.produto-intro em{font-style:italic; font-weight:600; color:#484848;}
.produto-intro {
font-weight:400;
line-height:1.5;
color:#484848;
font-size: clamp(0.9rem, 0.7rem + 1vw, 1rem); 
}

/* container da linha de preço */
.price-line{ align-items: baseline; }
.price-box{
font-family: Montserrat, sans-serif;
font-weight: 600; color:#6c757d;
font-size: clamp(1.5rem, 0.7rem + 1vw, 1rem); 
line-height: 1;       /* evita “sobras” que deslocam a baseline */
padding-top: 20px;
padding-bottom: 10px;
}
/* tag ao lado do preço */
.tag-preco{
display: inline-block;  /* ou inline-flex; align-items:center; */
padding: .25rem .6rem;
border-radius: 10px;
background: #fff3e6;
color: #ff7a00;
font-size: 1rem;
line-height: 1;         /* casa com a baseline do preço */
}

/* base (como você definiu) */
.btn-comprar{
padding: 1rem 2.5rem;
border-radius: 999px;
font-weight: 600;
background: #2f66ff;
border: 0;

/* melhorias de UX */
color: #fff;                 /* garante contraste */
text-decoration: none;       /* remove sublinhado em <a> */
display: inline-flex;        /* p/ transform ficar estável */
align-items: center;
gap: .5rem;
transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
will-change: transform;
transform-origin: center;
}

/* hover/focus: zoom leve e sombra */
.btn-comprar:hover,
.btn-comprar:focus{
transform: scale(1.04);
filter: brightness(1.02);
}

/* clique: “aperta” um pouco */
.btn-comprar:active{
transform: scale(0.98);
box-shadow: 0 4px 12px rgba(0,0,0,.16);
}

/* acessibilidade */
.btn-comprar:focus-visible{
outline: 3px solid #cbd5ff;
outline-offset: 2px;
}

/* Abas (somente “Descrição”, no estilo das tabs do Bootstrap) */
.tab-nav .nav-link{
font-weight:600;
font-size: clamp(1rem, .9rem + .6vw, 1.15rem); /* maior */
color:#495057;
border-top-left-radius: .50rem;
    border-top-right-radius: .50rem;
}

/* Aba ativa: cinza só na ABA */
.tab-nav .nav-link.active{
color:#484848 !important;
background:#f5f6f8;
border-color:#dee2e6 #dee2e6 #fff;
padding: 20px;
}

/* Conteúdo da aba: branco */
.descricao-pane{
background:#fff;                     /* deixa o bloco em branco */
border:1px solid #dee2e6;
border-top:0;
border-radius:0 0 .5rem .5rem;
}

/* Texto interno */
.tab-pane p{margin-bottom:.5rem; color:#484848;}
.tab-pane strong{font-weight:700;}

.descricao-title{
font-weight: 400;              /* mais leve: 400=normal, 500=medium, 600=semibold */
font-size: clamp(1.1rem, 1.2rem + 0.8vw, 2rem);
color: #1a3b5d;
letter-spacing: .2px;          /* opcional */
padding-top: 0.5rem;
padding-bottom: 0.5rem;           /* já tem mb-3; ajuste se quiser */
}

.descricao-text {
font-family: 'Poppins', sans-serif;
font-weight: 300;
font-size: 16px;
}

.footer-text {
    font-size: clamp(0.8rem, 0.7rem + 0.4vw, 0.9rem);
    color:rgb(255, 255, 255);
}
/* Footer interno (sem include) */
.footer-area{background:#0f1b27; color:#dbe2ea;}
.footer-area a{color:#ffb35a;}
.footer-area h4{color:#fff; font-weight:700; font-size:1.05rem;}
.footer-logo img{height:48px;}
.footer-logos img{height:26px; margin-right:10px; opacity:.9}
.footer-bottom{border-top:1px solid rgba(255,255,255,.08); color:#cfd8e3;}
.footer-separator{opacity:.5}

/* Footer largura total e altura confortável */
.pe-footer-minimal{
background:#0f1b27;
padding: 2rem 0;     /* ↑ AQUI aumenta a “altura”: 3.5rem, 4rem, etc. */
}

.pe-footer-wrap{
display:flex;
align-items:center;
gap:32px;
justify-content:flex-start;
min-height: 180px;     /* ↑ Garante uma base mais alta (ajuste se quiser) */
}

/* Opcional: maior impacto visual via logo */
.pe-footer-logo img{
width: 150px;          /* antes 150px; use 220–250px se preferir */
height: auto;
display: block;
}

@media (max-width: 768px){
/* altura um pouco menor no mobile */
.pe-footer-minimal{ 
    padding: 2.25rem 0; 
}

/* centraliza o layout no mobile */
.pe-footer-wrap{ 
    flex-direction: column;       /* já empilha */
    align-items: center;          /* centra horizontalmente */
    justify-content: center;      /* centra verticalmente dentro do padding */
    text-align: center;           /* texto centralizado */
    gap: 16px; 
}

/* garante que o texto do bloco fique centralizado */
.pe-footer-info{ 
    text-align: center; 
}

/* pequena margem lateral no container do footer (respira nas bordas) */
.pe-footer-minimal .container{
    padding-left: 18px;
    padding-right: 18px;
}

/* largura do logo no mobile */
.pe-footer-logo img{ 
    width: 170px;    /* ajuste fino (antes 180px) */
    height: auto;
}
}
.footer-text {
    font-size: clamp(0.8rem, 0.7rem + 0.4vw, 0.9rem);
    color:rgb(255, 255, 255);
    white-space: normal;
    margin-top: 20px;
    padding-left: 20px;
    padding-right: 20px;
}