#navbar {
    background-color: #050B47;
}

#hero {
    height: 88vh;
    background-image: url("assets/img/opacity.svg"), url("assets/img/hero-cover.jpg");
    background-position: center;
    object-fit: cover;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: #ffffff;
}

#history {
    height: 80vh;
    background-image: url("assets/img/opacity.svg"), url("assets/img/history-cover.jpg");
    background-position: center;
    object-fit: cover;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: #ffffff;
}

#footer {
    background-color: #050B47;
    color: #ffffff;
}

#copyright {
    background-color: #000854;
    color: #ffffff;
}

@media (max-width: 600px) {
    #card {
        height: 15rem !important;
    }
}

/* ============================================
   TIPOGRAFIA - HEADINGS
   Tamanhos responsivos para melhor leitura
   IMPORTANTE: Sobrescreve todos os estilos padrão
   ============================================ */

/* Mobile First - Tamanhos base */
h1,
.h1,
.wp-block-heading,
.single-post h1,
.page h1,
article h1,
.entry-title,
.post-title {
    font-size: 2rem !important;        /* 32px */
    font-weight: 700 !important;
    line-height: 1.2 !important;
    margin-top: 2.5rem !important;
    margin-bottom: 1rem !important;
}

/* H1 no topo do conteúdo sem margem superior */
article > h1:first-child,
.entry-content > h1:first-child,
.page-content > h1:first-child {
    margin-top: 0 !important;
}

h2,
.h2,
.single-post h2,
.page h2,
article h2 {
    font-size: 1.75rem !important;     /* 28px */
    font-weight: 700 !important;
    line-height: 1.3 !important;
    margin-top: 2rem !important;
    margin-bottom: 0.875rem !important;
}

h3,
.h3,
.single-post h3,
.page h3,
article h3 {
    font-size: 1.5rem !important;      /* 24px */
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin-top: 1.75rem !important;
    margin-bottom: 0.75rem !important;
}

h4,
.h4,
.single-post h4,
.page h4,
article h4 {
    font-size: 1.25rem !important;     /* 20px */
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin-top: 1.5rem !important;
    margin-bottom: 0.625rem !important;
}

h5,
.h5,
.single-post h5,
.page h5,
article h5 {
    font-size: 1.125rem !important;    /* 18px */
    font-weight: 700 !important;
    line-height: 1.5 !important;
    margin-top: 1.25rem !important;
    margin-bottom: 0.5rem !important;
}

h6,
.h6,
.single-post h6,
.page h6,
article h6 {
    font-size: 1rem !important;        /* 16px */
    font-weight: 600 !important;
    line-height: 1.5 !important;
    margin-top: 1rem !important;
    margin-bottom: 0.5rem !important;
}

/* ============================================
   TIPOGRAFIA - PARÁGRAFOS E TEXTOS
   ============================================ */

p,
.single-post p,
.page p,
article p,
.entry-content p {
    font-size: 1rem;           /* 16px */
    line-height: 1.75;         /* 28px - ótimo para leitura */
    margin-bottom: 1.25rem;
    color: #333;
}

/* Parágrafo de introdução maior */
.entry-content > p:first-of-type,
article > p:first-of-type {
    font-size: 1.125rem;       /* 18px */
    line-height: 1.7;
    margin-bottom: 1.5rem;
    color: #444;
}

/* Listas */
ul, ol {
    margin-bottom: 1.25rem;
    padding-left: 1.5rem;
}

li {
    line-height: 1.75;
    margin-bottom: 0.5rem;
}

/* Blockquotes */
blockquote {
    border-left: 4px solid #0d6efd;
    padding-left: 1.5rem;
    margin: 1.5rem 0;
    font-style: italic;
    color: #555;
}

/* ============================================
   TABELAS - Estilização profissional
   ============================================ */

table,
.wp-block-table table,
.single-post table,
.page table,
article table {
    width: 100%;
    margin: 1.5rem 0 2rem 0;
    border-collapse: collapse;
    font-size: 0.9375rem;      /* 15px */
    background-color: #fff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    overflow: hidden;
}

/* Cabeçalho da tabela */
table thead,
.wp-block-table thead {
    background: linear-gradient(135deg, #050B47 0%, #192278 100%);
    color: #fff;
}

table thead th,
.wp-block-table thead th {
    padding: 1rem;
    text-align: left;
    font-weight: 600;
    font-size: 0.875rem;       /* 14px */
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-bottom: 2px solid #0d6efd;
}

/* Corpo da tabela */
table tbody tr,
.wp-block-table tbody tr {
    border-bottom: 1px solid #e9ecef;
    transition: background-color 0.2s ease;
}

table tbody tr:hover,
.wp-block-table tbody tr:hover {
    background-color: #f8f9fa;
}

table tbody tr:last-child {
    border-bottom: none;
}

table tbody td,
.wp-block-table tbody td {
    padding: 0.875rem 1rem;
    color: #333;
    vertical-align: top;
}

/* Células de destaque */
table tbody td:first-child,
.wp-block-table tbody td:first-child {
    font-weight: 500;
}

/* Tabela zebrada (alternativa) */
table.striped tbody tr:nth-child(even),
.wp-block-table.is-style-stripes tbody tr:nth-child(even) {
    background-color: #f8f9fa;
}

/* Tabela responsiva */
@media (max-width: 768px) {
    table,
    .wp-block-table table {
        font-size: 0.875rem;   /* 14px */
        box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
    }
    
    table thead th,
    .wp-block-table thead th {
        padding: 0.75rem 0.5rem;
        font-size: 0.8125rem;  /* 13px */
    }
    
    table tbody td,
    .wp-block-table tbody td {
        padding: 0.625rem 0.5rem;
    }
    
    /* Scroll horizontal em tabelas grandes */
    .table-responsive {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}

/* Wrapper para scroll em mobile */
.entry-content table,
.page-content table,
article table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

@media (min-width: 768px) {
    .entry-content table,
    .page-content table,
    article table {
        display: table;
    }
}

/* Tablet - Médio (≥768px) */
@media (min-width: 768px) {
    h1, .h1, .wp-block-heading, .single-post h1, .page h1, article h1, .entry-title, .post-title {
        font-size: 2.5rem !important;      /* 40px */
    }
    
    h2, .h2, .single-post h2, .page h2, article h2 {
        font-size: 2rem !important;        /* 32px */
    }
    
    h3, .h3, .single-post h3, .page h3, article h3 {
        font-size: 1.75rem !important;     /* 28px */
    }
    
    h4, .h4, .single-post h4, .page h4, article h4 {
        font-size: 1.5rem !important;      /* 24px */
    }
    
    h5, .h5, .single-post h5, .page h5, article h5 {
        font-size: 1.25rem !important;     /* 20px */
    }
    
    h6, .h6, .single-post h6, .page h6, article h6 {
        font-size: 1.0625rem !important;   /* 17px */
    }
}

/* Desktop - Grande (≥992px) */
@media (min-width: 992px) {
    h1, .h1, .wp-block-heading, .single-post h1, .page h1, article h1, .entry-title, .post-title {
        font-size: 2.25rem !important;     /* 36px */
    }
    
    h2, .h2, .single-post h2, .page h2, article h2 {
        font-size: 1.875rem !important;    /* 30px */
    }
    
    h3, .h3, .single-post h3, .page h3, article h3 {
        font-size: 1.625rem !important;    /* 26px */
    }
    
    h4, .h4, .single-post h4, .page h4, article h4 {
        font-size: 1.375rem !important;    /* 22px */
    }
    
    h5, .h5, .single-post h5, .page h5, article h5 {
        font-size: 1.125rem !important;    /* 18px */
    }
    
    h6, .h6, .single-post h6, .page h6, article h6 {
        font-size: 1rem !important;        /* 16px */
    }
}

/* Desktop XL (≥1200px) - mantém mesmos tamanhos */
@media (min-width: 1200px) {
    h1, .h1, .wp-block-heading, .single-post h1, .page h1, article h1, .entry-title, .post-title {
        font-size: 2.25rem !important;     /* 36px */
    }
    
    h2, .h2, .single-post h2, .page h2, article h2 {
        font-size: 1.875rem !important;    /* 30px */
    }
}

.mt-4 .col-md-12 .mx-auto{font-size:23px;}
