/*
Theme Name: Verus Capital 2.0
Theme URI: http://137.131.193.112/verus/
Description: Tema Premium Completo para Verus Capital, focado em alta performance, estética escura moderna com detalhes em laranja vibrante, CPTs personalizados e integração com Secure Custom Fields (SCF).
Version: 2.0.0
Author: Antigravity
Author URI: http://google.com
Text Domain: verus-capital-2.0
*/

/* ==========================================================================
   DESIGN SYSTEM & DESIGN TOKENS
   ========================================================================== */

:root {
    /* Color Palette (HSL & Hex) */
    --color-orange-hsl: 26, 100%, 50%; /* #FF6E00 */
    --color-orange: hsl(var(--color-orange-hsl));
    --color-orange-hover: hsl(26, 100%, 45%);
    --color-orange-glow: hsla(26, 100%, 50%, 0.15);

    --color-bg-dark-hsl: 0, 0%, 100%; /* #FFFFFF */
    --color-bg-dark: #FFFFFF;
    
    --color-bg-card-hsl: 210, 16%, 98%; /* #F8F9FA */
    --color-bg-card: #F8F9FA;
    --color-bg-card-hover: #F1F3F5;

    --color-text-light-hsl: 210, 10%, 12%; /* #1A1D20 */
    --color-text-light: #1A1D20;
    
    --color-text-gray-hsl: 210, 8%, 35%; /* #495057 */
    --color-text-gray: #495057;
    
    --color-text-muted-hsl: 210, 8%, 45%; /* #6C757D */
    --color-text-muted: #6C757D;

    --color-border-hsl: 210, 10%, 92%; /* #E9ECEF */
    --color-border: #E9ECEF;

    /* Glassmorphism Styles */
    --glass-bg: rgba(255, 255, 255, 0.75);
    --glass-border: rgba(0, 0, 0, 0.06);
    --glass-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);

    /* Fonts & Typography */
    --font-primary: 'Outfit', 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    
    /* Font Sizes */
    --fs-xs: 0.75rem;   /* 12px */
    --fs-sm: 0.875rem;  /* 14px */
    --fs-md: 1rem;      /* 16px */
    --fs-lg: 1.125rem;  /* 18px */
    --fs-xl: 1.25rem;   /* 20px */
    --fs-2xl: 1.5rem;   /* 24px */
    --fs-3xl: 2rem;     /* 32px */
    --fs-4xl: 2.5rem;    /* 40px */
    --fs-5xl: 3.5rem;    /* 56px */

    /* Spacing System */
    --space-2xs: 0.25rem;
    --space-xs: 0.5rem;
    --space-sm: 0.75rem;
    --space-md: 1rem;
    --space-lg: 1.5rem;
    --space-xl: 2rem;
    --space-2xl: 3rem;
    --space-3xl: 4.5rem;

    /* Borders & Border Radius */
    --radius-sm: 6px;
    --radius-md: 12px;
    --radius-lg: 20px;
    --radius-full: 9999px;
    
    /* Transitions */
    --transition-fast: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-smooth: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Reset and Base Styles */
*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
    background-color: var(--color-bg-dark);
}

body {
    font-family: var(--font-primary);
    background-color: var(--color-bg-dark);
    color: var(--color-text-light);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}

img, svg, video {
    max-width: 100%;
    height: auto;
    display: block;
}

a {
    color: inherit;
    text-decoration: none;
    transition: var(--transition-fast);
}

/* ==========================================================================
   UTILITY CLASSES (Design System Tokens)
   ========================================================================== */

/* Layout & Containers */
.container {
    width: 100%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--space-lg);
    padding-right: var(--space-lg);
}

.grid {
    display: grid;
    gap: var(--space-lg);
}
.grid-2 { grid-template-columns: repeat(2, 1fr); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-4 { grid-template-columns: repeat(4, 1fr); }

@media (max-width: 992px) {
    .grid-3, .grid-4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 576px) {
    .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }
}

.flex {
    display: flex;
    gap: var(--space-md);
}
.flex-center {
    display: flex;
    align-items: center;
    justify-content: center;
}
.flex-between {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* Typography Helpers */
.text-orange { color: var(--color-orange); }
.text-gray { color: var(--color-text-gray); }
.text-muted { color: var(--color-text-muted); }
.text-center { text-align: center; }

.title-sm { font-size: var(--fs-lg); font-weight: 600; line-height: 1.3; }
.title-md { font-size: var(--fs-2xl); font-weight: 700; line-height: 1.2; }
.title-lg { font-size: var(--fs-4xl); font-weight: 800; line-height: 1.1; letter-spacing: -0.02em; }
.title-hero { font-size: var(--fs-5xl); font-weight: 900; line-height: 1.05; letter-spacing: -0.03em; }

@media (max-width: 768px) {
    .title-hero { font-size: 2.8rem; }
    .title-lg { font-size: 2rem; }
}

/* Badges */
.badge {
    display: inline-block;
    padding: var(--space-2xs) var(--space-sm);
    font-size: var(--fs-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: var(--radius-sm);
    background-color: var(--color-orange-glow);
    color: var(--color-orange);
    border: 1px solid rgba(var(--color-orange-hsl), 0.3);
}

.badge-outline {
    background-color: transparent;
    border: 1px solid var(--color-border);
    color: var(--color-text-gray);
}

/* Section Common Styles */
.section {
    padding-top: var(--space-3xl);
    padding-bottom: var(--space-3xl);
    border-bottom: 1px solid var(--color-border);
}
.section-header {
    margin-bottom: var(--space-2xl);
    text-align: center;
}
.section-subtitle {
    font-size: var(--fs-sm);
    color: var(--color-orange);
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 0.1em;
    margin-bottom: var(--space-xs);
}

/* ==========================================================================
   COMPONENTS
   ========================================================================== */

/* Interactive Buttons */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.8rem 1.8rem;
    font-family: var(--font-primary);
    font-size: var(--fs-md);
    font-weight: 600;
    border-radius: var(--radius-md);
    transition: var(--transition-smooth);
    cursor: pointer;
    border: none;
    gap: var(--space-xs);
}

.btn-primary {
    background-color: var(--color-orange);
    color: #ffffff;
    box-shadow: 0 4px 20px rgba(255, 110, 0, 0.3);
}
.btn-primary:hover {
    background-color: var(--color-orange-hover);
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(255, 110, 0, 0.4);
}

.btn-secondary {
    background: var(--glass-bg);
    border: 1px solid var(--color-border);
    color: var(--color-text-light);
    backdrop-filter: blur(8px);
}
.btn-secondary:hover {
    border-color: var(--color-orange);
    background-color: rgba(255, 110, 0, 0.05);
    transform: translateY(-2px);
}

.btn-full {
    width: 100%;
}

/* Premium Cards */
.card {
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: var(--space-xl);
    transition: var(--transition-smooth);
    display: flex;
    flex-direction: column;
}
.card:hover {
    transform: translateY(-2px);
    border-color: var(--color-orange);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.04);
}

/* Glassmorphism Card style */
.card-glass {
    background: rgba(255, 255, 255, 0.65);
    border: 1px solid rgba(255, 255, 255, 0.65);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border-radius: var(--radius-lg);
    box-shadow: 
        0 4px 30px rgba(0, 0, 0, 0.02),
        inset 0 1px 1px rgba(255, 255, 255, 0.9),
        0 1px 0 rgba(0, 0, 0, 0.01);
    transition: var(--transition-smooth);
}

.card-glass:hover {
    transform: translateY(-2px);
    background: rgba(255, 255, 255, 0.75);
    border-color: rgba(255, 110, 0, 0.25);
    box-shadow: 
        0 10px 40px rgba(0, 0, 0, 0.04),
        inset 0 1px 2px rgba(255, 255, 255, 0.9);
}

/* Form Inputs */
.form-group {
    margin-bottom: var(--space-md);
}
.form-label {
    display: block;
    margin-bottom: var(--space-2xs);
    font-size: var(--fs-sm);
    font-weight: 500;
}
.form-input {
    width: 100%;
    padding: 0.8rem 1rem;
    background-color: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    color: var(--color-text-light);
    font-family: var(--font-primary);
    transition: var(--transition-fast);
}
.form-input:focus {
    outline: none;
    border-color: var(--color-orange);
    box-shadow: 0 0 0 3px rgba(255, 110, 0, 0.15);
}
textarea.form-input {
    resize: vertical;
    min-height: 120px;
}

/* ==========================================================================
   PAGINATION STYLING
   ========================================================================== */
.pagination {
    margin: var(--space-2xl) 0;
    width: 100%;
}

.pagination .screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    word-wrap: normal !important;
}

.pagination .nav-links {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--space-xs);
    flex-wrap: wrap;
}

.pagination .nav-links .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 var(--space-xs);
    font-size: var(--fs-sm);
    font-weight: 700;
    color: var(--color-text-gray);
    background-color: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    transition: var(--transition-fast);
}

.pagination .nav-links a.page-numbers:hover {
    color: var(--color-text-light);
    border-color: var(--color-orange);
    background-color: rgba(255, 110, 0, 0.05);
    transform: translateY(-1px);
}

.pagination .nav-links .page-numbers.current {
    color: #ffffff;
    background-color: var(--color-orange);
    border-color: var(--color-orange);
    box-shadow: 0 4px 15px rgba(255, 110, 0, 0.3);
}

.pagination .nav-links .page-numbers.dots {
    border: none;
    background-color: transparent;
    color: var(--color-text-muted);
}


/* ==========================================================================
   HOMEPAGE
   Movido de front-page.php (bloco <style> inline) sem alteracao de regra,
   para que as secoes da home possam virar partials sem duplicar o CSS.
   ========================================================================== */

/* Estilos específicos da Homepage */

/* Hero: fundo de mercado financeiro montado só com CSS -- malha de dados e um
   gráfico de cotação ascendente em SVG inline. Sem arquivo, sem request extra,
   nítido em qualquer densidade de tela. As opacidades são baixas de propósito:
   o fundo é ambiente, o H1 de 80px é que tem de dominar. */
.hero-section {
    padding: var(--space-3xl) 0;
    position: relative;
    isolation: isolate;
    background-color: var(--color-bg-dark);
    min-height: 85vh;
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--color-border);
    overflow: hidden;
}

/* Camada 1: malha de grade, como papel milimetrado de gráfico. */
.hero-section::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -2;
    background-image:
        repeating-linear-gradient(to right, rgba(0, 0, 0, 0.04) 0 1px, transparent 1px 88px),
        repeating-linear-gradient(to bottom, rgba(0, 0, 0, 0.04) 0 1px, transparent 1px 88px);
    /* A grade some para o topo, para não brigar com o header. */
    -webkit-mask-image: linear-gradient(to bottom, transparent, #000 35%, #000);
    mask-image: linear-gradient(to bottom, transparent, #000 35%, #000);
}

/* Camada 2: linha de cotação ancorada na base, mais o brilho laranja. */
.hero-section::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    background-image:
        radial-gradient(circle at top right, rgba(255, 110, 0, 0.12), transparent 50%),
        radial-gradient(circle at bottom left, rgba(0, 0, 0, 0.02), transparent 40%),
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 400' preserveAspectRatio='none'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23FF6E00' stop-opacity='.16'/%3E%3Cstop offset='1' stop-color='%23FF6E00' stop-opacity='0'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M0 322 L100 300 L200 334 L300 252 L400 274 L500 202 L600 226 L700 152 L800 176 L900 112 L1000 134 L1100 68 L1200 92 L1200 400 L0 400 Z' fill='url(%23g)'/%3E%3Cpath d='M0 322 L100 300 L200 334 L300 252 L400 274 L500 202 L600 226 L700 152 L800 176 L900 112 L1000 134 L1100 68 L1200 92' fill='none' stroke='%23FF6E00' stroke-opacity='.42' stroke-width='2' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-position: top right, bottom left, bottom center;
    background-size: auto, auto, 100% 58%;
}

/* O gráfico ficaria atrás da coluna de texto no celular, onde o layout empilha
   e o contraste importa mais. Fica só a grade e o brilho. */
@media (max-width: 992px) {
    .hero-section::after {
        background-image:
            radial-gradient(circle at top right, rgba(255, 110, 0, 0.12), transparent 50%),
            radial-gradient(circle at bottom left, rgba(255, 255, 255, 0.02), transparent 40%);
    }
}

.hero-container {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: var(--space-3xl);
    align-items: center;
}

@media (max-width: 992px) {
    .hero-container {
        grid-template-columns: 1fr;
        text-align: center;
    }
    .hero-buttons {
        justify-content: center;
    }
}

.hero-buttons {
    display: flex;
    gap: var(--space-md);
    margin-top: var(--space-lg);
    flex-wrap: wrap;
}

/* Selos de Certificação Bar */
.certs-bar {
    background-color: #050505;
    border-bottom: 1px solid var(--color-border);
    padding: var(--space-lg) 0;
}

.certs-wrapper {
    display: flex;
    justify-content: space-around;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-lg);
}

.cert-item {
    display: flex;
    align-items: center;
    gap: var(--space-md);
    max-width: 450px;
}

.cert-item img {
    height: 65px;
    width: auto;
}

.cert-text h4 {
    font-size: var(--fs-sm);
    font-weight: 700;
    color: var(--color-text-light);
    margin-bottom: 2px;
}

.cert-text p {
    font-size: var(--fs-xs);
    color: var(--color-text-gray);
    line-height: 1.4;
}

/* Timeline de Eventos Agenda */
.timeline-container {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    margin-top: var(--space-2xl);
}

.timeline-item {
    display: grid;
    grid-template-columns: 120px 1fr 180px;
    align-items: center;
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: var(--space-lg);
    transition: var(--transition-smooth);
}

.timeline-item:hover {
    border-color: var(--color-orange);
    background-color: var(--color-bg-card-hover);
    transform: scale(1.01);
}

.timeline-date {
    text-align: center;
    border-right: 1px solid var(--color-border);
    padding-right: var(--space-md);
}

.timeline-date .day {
    font-size: var(--fs-3xl);
    font-weight: 800;
    color: var(--color-orange);
    line-height: 1;
    display: block;
}

.timeline-date .month {
    font-size: var(--fs-xs);
    font-weight: 700;
    text-transform: uppercase;
    color: var(--color-text-muted);
}

.timeline-details {
    padding-left: var(--space-lg);
}

.timeline-details h3 {
    font-size: var(--fs-md);
    font-weight: 700;
    margin-bottom: 4px;
}

.timeline-details p {
    font-size: var(--fs-sm);
    color: var(--color-text-gray);
}

@media (max-width: 768px) {
    .timeline-item {
        grid-template-columns: 1fr;
        text-align: center;
        gap: var(--space-md);
    }
    .timeline-date {
        border-right: none;
        border-bottom: 1px solid var(--color-border);
        padding-right: 0;
        padding-bottom: var(--space-sm);
    }
    .timeline-details {
        padding-left: 0;
    }
}

/* Slider depoimentos simples */
.testimonial-slide {
    display: none;
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
    padding: 0 var(--space-xl);
}
.testimonial-slide.active {
    display: block;
    animation: fadeIn 0.5s ease;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* Placeholder de mídia
   Generaliza os dois blocos de gradiente que estavam inline em front-page.php
   (capa de curso e capa de livro). Usado quando não há imagem cadastrada, em
   vez de apontar para um arquivo default que não existe. */
.media-placeholder {
    width: 100%;
    height: 100%;
    min-height: 120px;
    background: linear-gradient(135deg, #1f1f1f 0%, #0a0a0a 100%);
    border-bottom: 1px solid var(--color-border);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-orange);
    font-family: var(--font-display, inherit);
    font-size: var(--fs-3xl);
    font-weight: 800;
    text-transform: uppercase;
}

/* ==========================================================================
   SEÇÕES NOVAS DA HOME
   Classes de Ativos, Serviços e Carteiras. Reaproveitam .section,
   .section-header, .card e .grid; abaixo só o que é específico delas.
   ========================================================================== */

/* Classes de ativos: grade compacta, mais densa que .grid-4 no desktop */
.asset-class-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-md);
    margin-top: var(--space-2xl);
}

.asset-class-card {
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-left: 3px solid var(--color-orange);
    border-radius: var(--radius-md);
    padding: var(--space-lg);
    text-align: left;
    transition: var(--transition-smooth);
}

.asset-class-card:hover {
    background-color: var(--color-bg-card-hover);
    transform: translateY(-3px);
}

.asset-class-card h3 {
    font-size: var(--fs-md);
    font-weight: 700;
    color: var(--color-text-light);
    margin-bottom: 4px;
}

.asset-class-card p {
    font-size: var(--fs-xs);
    color: var(--color-text-gray);
    line-height: 1.4;
}

@media (max-width: 992px) {
    .asset-class-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 480px) {
    .asset-class-grid { grid-template-columns: 1fr; }
}

/* Serviços: o link fica sempre rente ao rodapé do cartão, para que cartões de
   alturas diferentes alinhem os CTAs entre si */
.service-card {
    display: flex;
    flex-direction: column;
    text-align: left;
}

.service-card-link {
    margin-top: auto;
    padding-top: var(--space-md);
    font-size: var(--fs-xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--color-orange);
}

.service-card-link:hover {
    text-decoration: underline;
}

/* Carteiras: cartão numerado */
.differential-card {
    display: flex;
    gap: var(--space-md);
    align-items: flex-start;
    text-align: left;
}

.differential-number {
    font-size: var(--fs-2xl);
    font-weight: 800;
    line-height: 1;
    color: var(--color-orange);
    opacity: 0.4;
    flex-shrink: 0;
}

/* ==========================================================================
   DETALHE DO CURSO
   Formato das aulas, datas da turma, bônus e certificado.
   ========================================================================== */
.course-check-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
    margin-top: var(--space-md);
}

.course-check-list li {
    position: relative;
    padding-left: 28px;
    font-size: var(--fs-sm);
    line-height: 1.6;
    color: var(--color-text-gray);
}

.course-check-list li::before {
    content: '✓';
    position: absolute;
    left: 0;
    top: 0;
    color: var(--color-orange);
    font-weight: 800;
}

.class-dates {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
    margin-top: var(--space-md);
}

.class-date-row {
    display: flex;
    align-items: center;
    gap: var(--space-md);
    flex-wrap: wrap;
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-left: 3px solid var(--color-orange);
    border-radius: var(--radius-sm);
    padding: var(--space-sm) var(--space-md);
}

.class-date-label {
    font-weight: 700;
    font-size: var(--fs-sm);
    color: var(--color-text-light);
    flex-grow: 1;
}

.class-date-time {
    font-size: var(--fs-sm);
    color: var(--color-text-gray);
}

.course-certificate {
    display: flex;
    gap: var(--space-lg);
    align-items: center;
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--space-lg);
    margin-top: var(--space-md);
}

.course-certificate img {
    width: 120px;
    height: auto;
    flex-shrink: 0;
}

@media (max-width: 600px) {
    .course-certificate { flex-direction: column; text-align: center; }
}

/* ==========================================================================
   CANAIS DE COMPRA DO LIVRO
   ========================================================================== */
.purchase-channels {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
    margin-top: var(--space-md);
}

.purchase-channel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-md);
    flex-wrap: wrap;
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    padding: var(--space-sm) var(--space-md);
    transition: var(--transition-fast);
}

.purchase-channel:hover {
    border-color: var(--color-orange);
}

.purchase-channel-name {
    font-weight: 700;
    font-size: var(--fs-sm);
    color: var(--color-text-light);
}

.purchase-channel-note {
    font-size: var(--fs-xs);
    color: var(--color-text-muted);
    display: block;
}

/* ==========================================================================
   ARQUIVO DE DEPOIMENTOS
   ========================================================================== */
.depoimentos-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-lg);
    margin-top: var(--space-2xl);
}

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

.depoimento-card {
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--space-xl);
    text-align: left;
}

.depoimento-card blockquote {
    font-size: var(--fs-md);
    font-style: italic;
    line-height: 1.8;
    color: var(--color-text-light);
    margin: 0 0 var(--space-md) 0;
}

.depoimento-card cite {
    display: block;
    font-style: normal;
    font-weight: 700;
    color: var(--color-orange);
}

.depoimento-card .depoimento-local {
    font-size: var(--fs-xs);
    color: var(--color-text-muted);
}

/* Chamada curta acima da citação (campo depoimento_headline). */
.depoimento-chamada {
    font-weight: 800;
    font-size: var(--fs-sm);
    color: var(--color-text-light);
    margin: 0 0 var(--space-xs) 0;
}

/* Foto do aluno: imagem destacada do depoimento, recortada em círculo. */
.depoimento-autor {
    display: flex;
    align-items: center;
    gap: var(--space-md);
}

.depoimento-foto {
    flex: 0 0 auto;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    overflow: hidden;
    border: 2px solid var(--color-orange);
    background-color: var(--color-bg-card-hover);
}

.depoimento-foto img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Sem foto, a inicial do nome ocupa o lugar -- evita um buraco no cartão. */
.depoimento-foto--vazia {
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: var(--fs-lg);
    color: var(--color-orange);
}

.depoimento-foto--pequena {
    width: 44px;
    height: 44px;
}

/* Home: depoimentos ganham mais destaque na foto e no nome do que o padrão
   usado no arquivo de depoimentos (onde vários cartões aparecem juntos). */
.testimonials-layout .depoimento-foto {
    width: 76px;
    height: 76px;
    border-width: 3px;
    box-shadow: 0 0 0 6px var(--color-orange-glow);
}

.testimonials-layout .depoimento-foto--vazia {
    font-size: var(--fs-2xl);
}

.testimonials-layout .depoimento-autor h4 {
    font-size: var(--fs-xl) !important;
}

.testimonials-layout .depoimento-autor span {
    font-size: var(--fs-sm) !important;
}

@media (max-width: 900px) {
    .testimonials-layout .depoimento-foto {
        width: 60px;
        height: 60px;
        box-shadow: 0 0 0 4px var(--color-orange-glow);
    }
}

/* Página /depoimentos/: acervo completo, foto ainda maior que na home. */
.depoimentos-archive-page .depoimento-foto {
    width: 110px;
    height: 110px;
    border-width: 3px;
    box-shadow: 0 0 0 6px var(--color-orange-glow);
}

.depoimentos-archive-page .depoimento-foto--vazia {
    font-size: var(--fs-2xl);
}

@media (max-width: 600px) {
    .depoimentos-archive-page .depoimento-foto {
        width: 80px;
        height: 80px;
        box-shadow: 0 0 0 4px var(--color-orange-glow);
    }
}

/* ==========================================================================
   RODAPÉ LEGAL
   Conformidade CVM/APIMEC: razão social, itens numerados e link do manual.
   ========================================================================== */
.footer-legal {
    border-top: 1px solid var(--color-border);
    padding-top: var(--space-md);
    margin-top: var(--space-lg);
    font-size: 11px;
    line-height: 1.6;
    color: var(--color-text-muted);
    text-align: justify;
}

.footer-legal p {
    margin-bottom: var(--space-xs);
}

.footer-legal-company {
    font-weight: 700;
    color: var(--color-text-gray);
}

.footer-legal-list {
    margin: var(--space-sm) 0 var(--space-sm) 1.25rem;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.footer-legal-list li::marker {
    color: var(--color-orange);
    font-weight: 700;
}

.footer-legal-list strong {
    color: var(--color-text-gray);
}

.footer-legal a {
    color: var(--color-orange);
    text-decoration: underline;
}

/* ==========================================================================
   LISTAGEM DE CURSOS
   Card resume, single detalha. Filtros por query param, sem JS.
   ========================================================================== */
.courses-hero {
    padding: var(--space-3xl) 0 var(--space-xl) 0;
    background: radial-gradient(circle at top right, rgba(255, 110, 0, 0.08), transparent 45%);
    border-bottom: 1px solid var(--color-border);
}

/* Etiquetas */
.course-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: var(--space-md);
}

.course-badge {
    display: inline-block;
    padding: 3px 10px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-full, 999px);
    font-size: var(--fs-xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--color-text-gray);
    white-space: nowrap;
}

.course-badge.is-highlight {
    border-color: var(--color-orange);
    background-color: var(--color-orange);
    color: #000;
}

/* Filtros */
.course-filters {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-xs);
    justify-content: center;
    margin-bottom: var(--space-2xl);
}

.course-filter {
    padding: 0.5rem 1.25rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-full, 999px);
    font-size: var(--fs-sm);
    font-weight: 700;
    color: var(--color-text-gray);
    transition: var(--transition-fast);
}

.course-filter:hover {
    border-color: var(--color-orange);
    color: var(--color-text-light);
}

.course-filter.is-active {
    background-color: var(--color-orange);
    border-color: var(--color-orange);
    color: #000;
}

/* Card */
.course-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: var(--space-lg);
    text-align: left;
    padding: var(--space-xl);
}

.course-card-title {
    font-size: var(--fs-lg);
    font-weight: 800;
    line-height: 1.25;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    color: var(--color-text-light);
    margin-bottom: var(--space-sm);
}

.course-card-price {
    margin-bottom: var(--space-md);
}

/* price_sub e o valor COM desconto, entao nunca vai riscado -- riscar
   inverteria o sentido e faria a promocao parecer cancelada. */
.course-price {
    display: block;
    font-size: var(--fs-xl);
    font-weight: 800;
    color: var(--color-orange);
    line-height: 1.2;
}

.course-price-sub {
    display: block;
    font-size: var(--fs-xs);
    color: var(--color-text-gray);
    margin-top: 2px;
}

.course-card-summary {
    font-size: var(--fs-sm);
    line-height: 1.6;
    color: var(--color-text-gray);
}

.course-card-next {
    font-size: var(--fs-xs);
    color: var(--color-text-muted);
    margin-bottom: var(--space-sm);
}

/* Destaque */
.course-featured {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: var(--space-2xl);
    align-items: center;
    background: linear-gradient(135deg, #141414 0%, #080808 100%);
    border: 1px solid var(--color-orange);
    border-radius: var(--radius-lg);
    padding: var(--space-2xl);
    text-align: left;
    color: #ffffff;
}

.course-featured h2,
.course-featured .title-md {
    color: #ffffff !important;
}

.course-featured p,
.course-featured .text-gray,
.course-featured .course-check-list li,
.course-featured .course-price-sub {
    color: #b3b3b3 !important;
}

.course-featured .course-price {
    color: var(--color-orange) !important;
}

.course-featured-main .course-check-list {
    margin-top: var(--space-lg);
}

.course-featured-aside {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
    align-items: stretch;
    border-left: 1px solid var(--color-border);
    padding-left: var(--space-2xl);
}

.course-featured-aside .course-price {
    font-size: var(--fs-3xl);
}

.course-featured-aside .course-price-sub {
    margin-bottom: var(--space-md);
}

@media (max-width: 900px) {
    .course-featured {
        grid-template-columns: 1fr;
        gap: var(--space-xl);
        padding: var(--space-xl);
    }
    .course-featured-aside {
        border-left: none;
        border-top: 1px solid var(--color-border);
        padding-left: 0;
        padding-top: var(--space-lg);
    }
}

/* ==========================================================================
   HOME — ESCALA E ILUSTRAÇÃO
   Hero maior, faixa de credenciais e as fotos institucionais nas seções que
   têm assunto de imagem. Valores, Classes de Ativos e Serviços seguem sem
   foto de propósito: são conceitos, e a imagem viraria enfeite.
   ========================================================================== */

/* Escala fluida: 2.8rem no celular, até 5rem no desktop, sem media query.
   Vem depois da regra base e do @media de 768px, então vence os dois. */
.hero-section .title-hero {
    font-size: clamp(2.8rem, 6.5vw, 5rem);
}

/* Credenciais do hero */
.hero-credentials {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-xs) var(--space-lg);
    margin-top: var(--space-lg);
    padding: 0;
}

.hero-credentials li {
    position: relative;
    padding-left: 20px;
    font-size: var(--fs-sm);
    font-weight: 600;
    color: var(--color-text-gray);
}

.hero-credentials li::before {
    content: '✓';
    position: absolute;
    left: 0;
    top: 0;
    color: var(--color-orange);
    font-weight: 800;
}

@media (max-width: 992px) {
    .hero-credentials { justify-content: center; }
}

/* Faixa de imagem da seção */
.section-banner {
    margin: 0 0 var(--space-2xl) 0;
    border-radius: var(--radius-lg);
    overflow: hidden;
    border: 1px solid var(--color-border);
    position: relative;
}

.section-banner img {
    display: block;
    width: 100%;
    height: 260px;
    object-fit: cover;
}

.section-banner.is-wide img {
    height: 320px;
}

.section-banner figcaption {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: var(--space-md) var(--space-lg);
    background: linear-gradient(to top, rgba(0, 0, 0, 0.85), transparent);
    font-size: var(--fs-xs);
    color: var(--color-text-gray);
    text-align: left;
}

@media (max-width: 768px) {
    .section-banner img { height: 180px; }
    .section-banner.is-wide img { height: 200px; }
}

/* Foto na coluna da trajetória do analista */
.analyst-photo {
    margin: 0;
    border-radius: var(--radius-lg);
    overflow: hidden;
    border: 1px solid var(--color-border);
}

.analyst-photo img {
    display: block;
    width: 100%;
    height: 200px;
    object-fit: cover;
}

/* Depoimentos com foto ao lado */
.testimonials-layout {
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: var(--space-2xl);
    align-items: start;
}

.testimonials-photo {
    margin: 0;
    border-radius: var(--radius-lg);
    overflow: hidden;
    border: 1px solid var(--color-border);
}

.testimonials-photo img {
    display: block;
    width: 100%;
    height: 340px;
    object-fit: cover;
}

/* O slider centraliza o texto; com a foto ao lado o padding lateral sobra. */
.testimonials-layout .testimonial-slide {
    padding: 0;
    max-width: none;
}

@media (max-width: 900px) {
    .testimonials-layout { grid-template-columns: 1fr; }
    .testimonials-photo img { height: 220px; }
}

/* Clickable card utility */
.stretched-link::after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    content: "";
}

.card, .link-box-card, .event-list-row, .timeline-item {
    position: relative;
}

.stretched-link-target {
    position: relative;
    z-index: 2;
}

/* Dark section styling overrides */
.dark-section,
.certs-bar,
#analista,
.apimec-section {
    background-color: #050505 !important;
}

.dark-section h1,
.dark-section h2,
.dark-section h3,
.dark-section h4,
.dark-section h5,
.dark-section h6,
.dark-section .title-md,
.dark-section .title-sm,
.dark-section .section-subtitle,
.certs-bar h1,
.certs-bar h2,
.certs-bar h3,
.certs-bar h4,
.certs-bar h5,
.certs-bar h6,
#analista h1,
#analista h2,
#analista h3,
#analista h4,
#analista h5,
#analista h6,
#analista .title-md,
#analista .title-sm,
#analista .section-subtitle,
.apimec-section h1,
.apimec-section h2,
.apimec-section h3,
.apimec-section h4,
.apimec-section h5,
.apimec-section h6 {
    color: var(--color-orange) !important;
}

.dark-section p,
.dark-section span,
.dark-section li,
.dark-section .text-gray,
.dark-section .text-muted,
.dark-section .form-label,
.certs-bar p,
.certs-bar span,
#analista p,
#analista span,
#analista li,
#analista .text-gray,
#analista .text-muted,
.apimec-section p,
.apimec-section span {
    color: #ffffff !important;
}

.dark-section .btn-primary {
    background: linear-gradient(135deg, #FF6E00 0%, #FF4500 100%) !important;
    color: #ffffff !important;
    border: none !important;
    box-shadow: 0 4px 15px rgba(255, 110, 0, 0.4) !important;
}

.dark-section .btn-primary:hover {
    background: linear-gradient(135deg, #FF8522 0%, #FF5A18 100%) !important;
    box-shadow: 0 6px 20px rgba(255, 110, 0, 0.5) !important;
    transform: translateY(-2px) !important;
}

.dark-section .btn-secondary {
    background: transparent !important;
    border: 2px solid var(--color-orange) !important;
    color: var(--color-orange) !important;
}

.dark-section .btn-secondary:hover {
    background: rgba(255, 110, 0, 0.1) !important;
    transform: translateY(-2px) !important;
}

.dark-section .service-card-link {
    color: var(--color-orange) !important;
    font-weight: 800;
}

.dark-section .card {
    background-color: #121212 !important;
    border-color: #222222 !important;
}

.dark-section .card:hover {
    border-color: var(--color-orange) !important;
}

/* Ensure buttons inside dark containers (enroll-box and course-featured-aside) have correct hover states */
.enroll-box .btn-secondary,
.course-featured-aside .btn-secondary {
    background: rgba(255, 255, 255, 0.1) !important;
    border: 1px solid rgba(255, 255, 255, 0.25) !important;
    color: #ffffff !important;
}

.enroll-box .btn-secondary:hover,
.course-featured-aside .btn-secondary:hover {
    background: var(--color-orange) !important;
    border-color: var(--color-orange) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 15px rgba(255, 110, 0, 0.4) !important;
}

.enroll-box .btn-primary,
.course-featured-aside .btn-primary {
    background: var(--color-orange) !important;
    color: #ffffff !important;
}

.enroll-box .btn-primary:hover,
.course-featured-aside .btn-primary:hover {
    background: var(--color-orange-hover) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 15px rgba(255, 110, 0, 0.4) !important;
}

/* Dark glassmorphism overrides for dark sections */
.dark-section .card-glass,
#analista .card-glass {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15) !important;
}

.dark-section .card-glass h4,
#analista .card-glass h4 {
    color: var(--color-orange) !important;
}

.dark-section .card-glass p,
#analista .card-glass p {
    color: #e0e0e0 !important;
}

/* Forbes Editorial Portal Layout */
.forbes-grid {
    display: grid;
    grid-template-columns: 2.2fr 1fr;
    gap: var(--space-2xl);
    margin-bottom: var(--space-3xl);
}

.forbes-left-column {
    display: flex;
    flex-direction: column;
    gap: var(--space-2xl);
}

.forbes-right-column {
    display: flex;
    flex-direction: column;
    gap: var(--space-lg);
    border-left: 1px solid var(--color-border);
    padding-left: var(--space-xl);
}

/* Manchete Principal (Texto Puro) */
.forbes-main-headline {
    border-bottom: 1px solid var(--color-border);
    padding-bottom: var(--space-lg);
}

.forbes-main-headline .editoria {
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 800;
    color: var(--color-orange);
    letter-spacing: 0.1em;
    display: block;
    margin-bottom: var(--space-xs);
}

.forbes-main-headline h2 {
    font-size: 2.8rem;
    line-height: 1.1;
    font-weight: 800;
    margin-bottom: var(--space-xs);
    letter-spacing: -0.02em;
}

.forbes-main-headline h2 a {
    color: #000000;
    text-decoration: none;
}

.forbes-main-headline h2 a:hover {
    color: var(--color-orange);
}

.forbes-main-headline .excerpt {
    font-size: 1.05rem;
    line-height: 1.5;
    color: var(--color-text-gray);
    margin-top: var(--space-sm);
}

/* Subgrid de Notícias Intermediárias */
.forbes-subgrid {
    display: grid;
    grid-template-columns: 1fr 1.1fr;
    gap: var(--space-xl);
    align-items: flex-start;
}

/* Notícias com Marcadores (Bullets Laranjas) */
.forbes-bullet-list {
    margin-top: var(--space-md);
    padding-top: var(--space-md);
    border-top: 1px dashed var(--color-border);
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.forbes-bullet-list li {
    position: relative;
    padding-left: 18px;
    font-size: var(--fs-sm);
    line-height: 1.4;
    font-weight: 700;
}

.forbes-bullet-list li::before {
    content: "•";
    color: var(--color-orange);
    font-size: 1.5rem;
    position: absolute;
    left: 0;
    top: -4px;
}

.forbes-bullet-list li a {
    color: inherit;
    text-decoration: none;
}

.forbes-bullet-list li a:hover {
    color: var(--color-orange);
}

/* Card de Imagem Widescreen Roger Federer */
.forbes-image-card {
    display: flex;
    flex-direction: column;
}

.forbes-image-card .image-wrapper {
    width: 100%;
    height: 220px;
    border-radius: var(--radius-sm);
    overflow: hidden;
    margin-bottom: var(--space-xs);
    border: 1px solid var(--color-border);
}

.forbes-image-card .image-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: var(--transition-smooth);
}

.forbes-image-card:hover .image-wrapper img {
    transform: scale(1.02);
}

.forbes-image-card h3 {
    font-size: var(--fs-md);
    line-height: 1.3;
    font-weight: 800;
}

.forbes-image-card h3 a {
    color: inherit;
    text-decoration: none;
}

.forbes-image-card h3 a:hover {
    color: var(--color-orange);
}

/* Feed Lateral de Miniaturas Horizontais (Coluna Direita) */
.forbes-thumb-item {
    display: flex !important;
    flex-direction: row !important;
    gap: var(--space-md) !important;
    align-items: center !important;
    border-bottom: 1px solid var(--color-border) !important;
    padding-bottom: var(--space-md) !important;
    width: 100% !important;
}

.forbes-thumb-item:last-child {
    border-bottom: none !important;
    padding-bottom: 0 !important;
}

.forbes-thumb-item .thumb-wrapper {
    width: 130px !important;
    height: 85px !important;
    border-radius: var(--radius-sm) !important;
    overflow: hidden !important;
    flex-shrink: 0 !important;
    border: 1px solid var(--color-border) !important;
    display: block !important;
}

.forbes-thumb-item .thumb-wrapper a {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
}

.forbes-thumb-item .thumb-wrapper img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

.forbes-thumb-item .content-wrapper {
    flex-grow: 1 !important;
    text-align: left !important;
}

.forbes-thumb-item h3 {
    font-size: var(--fs-sm);
    line-height: 1.3;
    font-weight: 700;
    margin: 0;
}

.forbes-thumb-item h3 a {
    color: inherit;
    text-decoration: none;
}

.forbes-thumb-item h3 a:hover {
    color: var(--color-orange);
}

@media (max-width: 900px) {
    .forbes-grid {
        grid-template-columns: 1fr;
    }
    .forbes-right-column {
        border-left: none;
        padding-left: 0;
        border-top: 1px solid var(--color-border);
        padding-top: var(--space-xl);
    }
    .forbes-subgrid {
        grid-template-columns: 1fr;
        gap: var(--space-xl);
    }
    .forbes-main-headline h2 {
        font-size: 2rem;
    }
}