:root { 
	--semae-deep: #002d5a; 
	--semae-cyan: #00d4ff; 
	--semae-light: #f8f9fa;
	--tech-gradient: linear-gradient(135deg, #002d5a 0%, #0056b3 100%);
}

/* Custom Scrollbar - Global */
::-webkit-scrollbar {
    width: 10px; /* Largura da barra vertical */
    height: 10px; /* Altura da barra horizontal */
}

::-webkit-scrollbar-track {
    background: var(--semae-deep); /* Fundo da trilha (Azul Profundo) */
}

::-webkit-scrollbar-thumb {
    background: #0056b3; /* Cor do cursor (Azul Intermediário) */
    border-radius: 10px;
    border: 2px solid var(--semae-deep); /* Cria um respiro ao redor do cursor */
}

::-webkit-scrollbar-thumb:hover {
    background: var(--semae-cyan); /* Cor de destaque ao passar o mouse */
    box-shadow: 0 0 10px var(--semae-cyan); /* Efeito de brilho neon */
}

/* Para Firefox */
* {
    scrollbar-width: thin;
    scrollbar-color: #0056b3 var(--semae-deep);
}

/* Cor de seleção de texto */
::selection {
    background-color: var(--semae-cyan);
    color: var(--semae-deep);
}

/* Ajuste de foco em campos de entrada e botões */
.form-control:focus, .form-select:focus {
    border-color: var(--semae-cyan);
    box-shadow: 0 0 0 0.25 margin rgba(0, 212, 255, 0.25);
    background-color: #ffffff;
}

/* Padronização de Cards e Transições */
.vaga-card, .bolsa-card {
    transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), box-shadow 0.3s ease;
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: 80px; /* Evita que a Navbar cubra o título da seção */
}

body { 
	font-family: 'Plus Jakarta Sans', sans-serif; 
	background-color: #ffffff; 
	color: #1a1a1a; 
	overflow-x: hidden; 
}

/* Navbar Efeito Glass */
.navbar { 
	background: rgba(255, 255, 255, 0.8) !important; 
	backdrop-filter: blur(15px); 
	border-bottom: 1px solid rgba(0, 212, 255, 0.2);
	transition: 0.3s;
}
.navbar-brand { color: var(--semae-deep) !important; font-weight: 800; }

/* Hero Moderno */
.hero {
	min-height: 85vh;
	background: var(--tech-gradient);
	display: flex; align-items: center; position: relative;
	color: white; padding-top: 80px;
	clip-path: polygon(0 0, 100% 0, 100% 90%, 0% 100%);
}
.hero::before {
	content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%;
	background: url('https://www.transparenttextures.com/patterns/cubes.png'); opacity: 0.1;
}

/* Cards de Benefícios (Bolsas) */
.bolsa-card {
	background: white; border-radius: 20px; padding: 25px;
	border: 1px solid #eee; transition: 0.4s;
	box-shadow: 0 10px 30px rgba(0,0,0,0.03);
	height: 100%;
}
.bolsa-card:hover { transform: translateY(-10px); border-color: var(--semae-cyan); }
.bolsa-card h4 { color: var(--semae-deep); font-weight: 700; font-size: 1.1rem; }
.bolsa-card .price { color: var(--semae-cyan); font-weight: 800; font-size: 1.4rem; }

/* Estilo Tech Buttons */
.btn-tech {
	background: var(--semae-cyan); color: var(--semae-deep);
	padding: 15px 35px; border-radius: 12px; font-weight: 700;
	border: none; transition: 0.3s; text-decoration: none; display: inline-block;
}
.btn-tech:hover { 
	background: var(--semae-deep); color: white;
	box-shadow: 0 0 20px rgba(0, 212, 255, 0.4);
}

/* Timeline de Como Funciona */
.step-icon {
	width: 60px; height: 60px; background: var(--semae-cyan);
	border-radius: 15px; display: flex; align-items: center; justify-content: center;
	font-size: 1.5rem; color: var(--semae-deep); margin-bottom: 20px;
}

.accent-text { color: var(--semae-cyan); }
.section-title { font-weight: 800; color: var(--semae-deep); position: relative; margin-bottom: 40px; }
.section-title::after { content: ""; position: absolute; left: 0; bottom: -10px; width: 50px; height: 4px; background: var(--semae-cyan); }

.text-muted { text-align: justify; }

/* Localize a classe que envolve o ícone (ex: .step-number ou .icon-circle) */
.step-icon {
    width: 60px;           /* Largura fixa */
    height: 60px;          /* Altura fixa igual à largura */
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;    /* Garante o círculo perfeito */
    background: var(--semae-cyan);
    color: var(--semae-deep);
    font-size: 1.5rem;
    flex-shrink: 0;        /* Impede que o círculo amasse em telas menores */
    margin: 0 auto 15px;   /* Centraliza horizontalmente */
}

/* Estilização Customizada do FAQ */
.custom-accordion .accordion-item {
    border: 1px solid rgba(0, 212, 255, 0.1);
    border-radius: 12px !important;
    overflow: hidden;
    transition: 0.3s;
}

.custom-accordion .accordion-button {
    background-color: #ffffff;
    color: var(--semae-deep);
    font-weight: 600;
    padding: 20px;
    box-shadow: none !important;
}

.custom-accordion .accordion-button:not(.collapsed) {
    color: var(--semae-cyan);
    background-color: rgba(0, 212, 255, 0.05);
}

.custom-accordion .accordion-button::after {
    filter: grayscale(1) brightness(0.5); /* Ajusta ícone para combinar */
}

.custom-accordion .accordion-body {
    background-color: #ffffff;
    color: #555;
    line-height: 1.6;
    font-size: 0.95rem;
    border-top: 1px solid rgba(0, 212, 255, 0.05);
}

.text-deep {
    color: var(--semae-deep);
}

.fw-800 {
    font-weight: 800;
}

/* Banner de Alerta de Comunicação */
.alert-comunicacao {
    background: var(--semae-deep);
    color: white;
    border-left: 5px solid var(--semae-cyan);
    padding: 25px;
    border-radius: 15px;
    box-shadow: 0 10px 30px rgba(0, 45, 90, 0.15);
}

.alert-comunicacao .icon-wrapper {
    color: var(--semae-cyan);
    background: rgba(0, 212, 255, 0.1);
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
}

.text-cyan {
    color: var(--semae-cyan);
}

/* Ajuste para que a âncora não fique por baixo da navbar fixa 
#faq {
    scroll-margin-top: 80px; /* Ajuste esse valor de acordo com a altura da sua navbar */
}
*/

/* Card de Vagas Dinâmico */
.vaga-card {
    background: #ffffff;
    border: 1px solid rgba(0, 45, 90, 0.08);
    border-radius: 20px;
    padding: 30px;
    transition: all 0.3s ease;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.vaga-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 35px rgba(0, 45, 90, 0.1);
    border-color: var(--semae-cyan);
}

.vaga-card h4 {
    color: var(--semae-deep);
    font-weight: 700;
    margin-bottom: 15px;
}

.status-vaga {
    font-size: 0.75rem;
    text-transform: uppercase;
    font-weight: 700;
    color: #28a745; /* Verde para 'Aberta' */
}

.vaga-card .badge {
    font-size: 0.7rem;
    padding: 6px 12px;
    border-radius: 8px;
    letter-spacing: 0.5px;
}