/* CSS específico para página de consulta de marca */

/* Botão vermelho no header */
.cta-button {
    margin-left: 20px;
}

.btn-consulta {
    background: linear-gradient(135deg, #D12929, #B91C1C);
    color: white;
    padding: 12px 24px;
    border-radius: 25px;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(209, 41, 41, 0.3);
    border: none;
    cursor: pointer;
    display: inline-block;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.btn-consulta:hover {
    background: linear-gradient(135deg, #B91C1C, #991B1B);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(209, 41, 41, 0.4);
}

.btn-consulta:active {
    transform: translateY(0);
}

/* Responsivo para o botão */
@media (max-width: 768px) {
    .cta-button { margin-left: 0; margin-top: 10px; }
    .btn-consulta { padding: 10px 20px; font-size: 12px; }
}

/* Estilos para breadcrumb (se usado) */
.breadcrumb {
    background: #f8f9fa;
    padding: 15px 0;
    border-bottom: 1px solid #e9ecef;
}
.breadcrumb nav { display: flex; align-items: center; gap: 10px; font-size: 14px; }
.breadcrumb a { color: #052044; text-decoration: none; }
.breadcrumb a:hover { text-decoration: underline; }
.breadcrumb span { color: #6c757d; }

/* ===== HERO / Banner superior ===== */
.consultation-hero {
    background: linear-gradient(135deg, #052044, #0a2d5c);
    color: white;
    padding: 80px 0;
    text-align: center;

    /* centralização perfeita (faltava no arquivo antigo) */
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 400px;
}
.consultation-hero .container{
    max-width:1200px; margin:0 auto; padding:0 20px;
    display:flex; align-items:center; justify-content:center;
}
.consultation-hero .hero-content,
.consultation-hero .hero-content-centered{
    width:100%; max-width:800px; margin:0 auto; padding:0;
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    text-align:center;
}
.consultation-hero h1 {
    font-size: 3rem;
    margin-bottom: 20px;
    font-weight: 700;
}
.consultation-hero p {
    font-size: 1.2rem;
    margin-bottom: 40px;
    opacity: 0.9;
}
.hero-benefits {
    display: flex;
    justify-content: center;
    gap: 40px;
    flex-wrap: wrap;
}
.benefit { display: flex; align-items: center; gap: 10px; font-size: 16px; }
.benefit i { color: #D12929; font-size: 20px; }

/* ===== Bloco do formulário + coluna de informações ===== */
.consultation-form { padding: 80px 0; background: #f8f9fa; }
.form-wrapper {
    display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: start;
}
.form-info h2 { color: #052044; margin-bottom: 30px; font-size: 2rem; }
.info-items { display: flex; flex-direction: column; gap: 30px; }
.info-item { display: flex; gap: 20px; align-items: flex-start; }
.info-item i { color: #D12929; font-size: 24px; margin-top: 5px; flex-shrink: 0; }
.info-item h3 { color: #052044; margin-bottom: 10px; font-size: 1.1rem; }
.info-item p { color: #6c757d; line-height: 1.6; }

/* Cartão do formulário */
.form-container {
    background: white;
    padding: 40px;
    border-radius: 15px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}
.form-container h2 { color: #052044; margin-bottom: 30px; text-align: center; }

/* (novas) regras de grid/campos/foco – eram do arquivo corrigido-nova */
.form-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-bottom:20px;
}
.form-group{ display:flex; flex-direction:column; }
.form-group.full-width{ grid-column:1 / -1; }
.form-group label{ margin-bottom:8px; font-weight:600; color:#052044; }
.form-group input, .form-group textarea, .form-group select{
  padding:12px; border:2px solid #e9ecef; border-radius:8px; font-size:16px; transition:border-color .3s ease;
}
.form-group input:focus, .form-group textarea:focus, .form-group select:focus{
  outline:none; border-color:#D12929;
}
.form-privacy{ margin:20px 0; display:flex; align-items:flex-start; gap:10px; }
.form-privacy input[type="checkbox"]{ margin-top:3px; }
.form-privacy label{ font-size:14px; line-height:1.5; color:#6c757d; }
.form-privacy a{ color:#D12929; text-decoration:none; }
.form-privacy a:hover{ text-decoration:underline; }

/* Integra a mensagem de sucesso com o cartão */
.form-container .success-message{ margin-top: 8px; }

/* ===== Seção “Processo” ===== */
.process { padding: 80px 0; background: white; }
.process .section-title{
    text-align:center; color:#052044; margin-bottom:50px; font-size:2.5rem;
}
.process-steps {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 40px; margin-top: 50px;
}
.step { text-align: center; position: relative; }
.step-number {
    width: 60px; height: 60px; background: linear-gradient(135deg, #D12929, #B91C1C);
    color: white; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 24px; font-weight: 700; margin: 0 auto 20px;
}
.step h3 { color: #052044; margin-bottom: 15px; font-size: 1.2rem; }
.step p { color: #6c757d; line-height: 1.6; }

/* ===== Responsivo ===== */
@media (max-width: 768px) {
    .consultation-hero { padding: 60px 0; min-height: 300px; }
    .consultation-hero h1 { font-size: 2rem; margin-bottom: 15px; }
    .consultation-hero p { font-size: 1rem; margin-bottom: 30px; }
    .hero-benefits { gap: 20px; }
    .form-wrapper { grid-template-columns: 1fr; gap: 40px; }
    .form-container { padding: 30px 20px; }
    .form-grid { grid-template-columns: 1fr; gap: 15px; }
    .process-steps { grid-template-columns: 1fr; gap: 30px; }
}
@media (max-width: 480px) {
    .consultation-hero h1 { font-size: 1.8rem; }
    .consultation-hero p { font-size: 0.9rem; }
}
