@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

:root {
    --color-princeton-orange: 241, 133, 34;
    --color-princeton-orange-hover: 230, 120, 20;
    --color-blue-magenta-violet: 90, 67, 148;
    --color-blue-magenta-violet-hover: 75, 55, 130;
    --color-grey-dark: 30, 30, 30;
    --color-grey-light: 224, 224, 224;

    --wp--preset--color--princeton-orange: rgb(var(--color-princeton-orange));
    --wp--preset--color--princeton-orange-hover: rgb(var(--color-princeton-orange-hover));
    --wp--preset--color--blue-magenta-violet: rgb(var(--color-blue-magenta-violet));
    --wp--preset--color--blue-magenta-violet-hover: rgb(var(--color-blue-magenta-violet-hover));
    --wp--preset--color--grey-dark: rgb(var(--color-grey-dark));
    --wp--preset--color--grey-light: rgb(var(--color-grey-light));
    
    --font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    --font-size-base: 1rem;        /* 16px (padrão) */
    --line-height-base: 1.5;       /* 1.5x o tamanho da fonte */
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
}

/* =============================================
   BASE TYPOGRAPHY - INTER FONT
   ============================================= */

/* 2. Reset da fonte em todos os elementos */
*,
html,
body {
    font-family: var(--font-primary);
}

/* 3. Configuração global do texto */
html {
    /* Tamanho de fonte base para dispositivos móveis (14px) */
    font-size: 87.5%; /* 14px (assumindo 16px como 100%) */
    -webkit-text-size-adjust: 100%;  /* Impede zoom do texto no iOS quando orientação muda */
    text-size-adjust: 100%;
    font-synthesis: none;            /* Evita negrito/oblíquo sintéticos (usar fonte real) */
    scroll-behavior: smooth;
}

/* 4. Ajuste responsivo do tamanho base */
@media (min-width: 768px) {
    html {
        font-size: 100%; /* 16px em tablets/desktop */
    }
}

@media (min-width: 1200px) {
    html {
        font-size: 112.5%; /* 18px em telas muito grandes (opcional) */
    }
}

/* 5. Estilização do body para melhor legibilidade */
body {
    font-family: var(--font-primary);
    font-size: var(--font-size-base);
    line-height: var(--line-height-base);
    font-weight: var(--font-weight-normal);
    color: #1a1e24;                 /* Cor de texto escura, suave (não preto puro) */
    background-color: #ffffff;
    -webkit-font-smoothing: antialiased;   /* Suaviza fontes no macOS/iOS */
    -moz-osx-font-smoothing: grayscale;    /* Suaviza no Firefox macOS */
    font-kerning: normal;                  /* Melhora o espaçamento entre letras */
    text-rendering: optimizeLegibility;    /* Prioriza legibilidade sobre velocidade */
}

/* 6. Headings e elementos de texto com pesos apropriados */
h1, h2, h3, h4, h5, h6 {
    font-weight: var(--font-weight-semibold);
    line-height: 1.2;               /* Mais justo para títulos */
    margin-top: 0;
    margin-bottom: 0.5em;
    letter-spacing: -0.02em;        /* Leve redução para títulos (estética moderna) */
}

/* 7. Parágrafos e textos longos */
p, li, figcaption, blockquote {
    margin-bottom: 1.25rem;
}

/* 8. Textos pequenos (captions, small) */
small, .text-small, .caption {
    font-size: 0.875rem;            /* 14px no desktop, 12px no mobile? Mas relativo ao root */
    line-height: 1.4;
    font-weight: var(--font-weight-normal);
}

/* 9. Ajuste de dispositivos de alta densidade (Retina, etc.) */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    body {
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }
}

/* 11. Correção para inputs, botões, selects (herdam fonte corretamente) */
input, button, textarea, select {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}

/* 12. Acessibilidade: reduzir movimento se preferência do sistema */
@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
}

/* 
 * Classes utilitárias geradas dinamicamente para a tag principal (main) 
 * ou qualquer container onde o bloco do WordPress injetar estilos
 */
.has-princeton-orange-color { color: rgb(var(--color-princeton-orange)) !important; }
.has-princeton-orange-background-color { background-color: rgb(var(--color-princeton-orange)) !important; }

.has-princeton-orange-hover-color { color: rgb(var(--color-princeton-orange-hover)) !important; }
.has-princeton-orange-hover-background-color { background-color: rgb(var(--color-princeton-orange-hover)) !important; }

.has-blue-magenta-violet-color { color: rgb(var(--color-blue-magenta-violet)) !important; }
.has-blue-magenta-violet-background-color { background-color: rgb(var(--color-blue-magenta-violet)) !important; }

.has-blue-magenta-violet-hover-color { color: rgb(var(--color-blue-magenta-violet-hover)) !important; }
.has-blue-magenta-violet-hover-background-color { background-color: rgb(var(--color-blue-magenta-violet-hover)) !important; }

.has-grey-dark-color { color: rgb(var(--color-grey-dark)) !important; }
.has-grey-dark-background-color { background-color: rgb(var(--color-grey-dark)) !important; }

.has-grey-light-color { color: rgb(var(--color-grey-light)) !important; }
.has-grey-light-background-color { background-color: rgb(var(--color-grey-light)) !important; }

.btn, .wp-element-button, .btn-menu .nav-link { border: 2px solid currentColor; border-bottom-width: 5px !important; box-sizing: border-box; }

.btn:hover, .wp-element-button:hover { transform: translateY(2px); box-shadow: 0 0 0 0.25rem rgba(var(--color-grey-dark), 0.25) !important; }

.btn:focus, .btn:active, .wp-element-button:focus, .wp-element-button:active, .btn-menu .nav-link:focus, .btn-menu .nav-link:active { transform: translateY(4px); border-bottom-width: 2px !important; border-top-width: 5px !important; }

.btn-menu .nav-link {border-radius: 0.5rem; color:#fff !important; padding-top: 0.35rem; padding-bottom: 0.35rem;}

.btn-default, .btn-menu .nav-link { font-weight: bolder; color: rgb(var(--color-grey-light)); background-color: rgb(var(--color-princeton-orange)); border-color: rgb(var(--color-blue-magenta-violet)); }

.btn-default:hover, .btn-menu .nav-link:hover { color: #fff; background-color: rgb(var(--color-princeton-orange-hover)); border-color: rgb(var(--color-blue-magenta-violet-hover)); }

.btn-default:focus, .btn-default:active, .btn-menu .nav-link:focus, .btn-menu .nav-link:active { color: #fff !important; background-color: rgb(var(--color-princeton-orange-hover)) !important; border-color: rgb(var(--color-blue-magenta-violet-hover)) !important; }

.btn-outline-default { color: rgb(var(--color-princeton-orange)); background-color: transparent; border: 1px solid rgb(var(--color-princeton-orange)); }

.btn-outline-default:hover, .btn-outline-default:focus,
.btn-outline-default:active, .btn-outline-default:checked,
.btn-check:hover + .btn-outline-default, .btn-check:checked + .btn-outline-default { color: #fff; background-color: rgb(var(--color-princeton-orange)); border-color: rgb(var(--color-princeton-orange)); }

.btn-auxiliary { color: #fff; background-color: rgb(var(--color-blue-magenta-violet)); border: 1px solid rgb(var(--color-princeton-orange)); }

.btn-auxiliary:hover, .btn-auxiliary:focus { background-color: rgb(var(--color-blue-magenta-violet-hover)); border-color: rgb(var(--color-blue-magenta-violet-hover)); }

.btn-outline-auxiliary { color: rgb(var(--color-blue-magenta-violet)); background-color: transparent; border: 1px solid rgb(var(--color-blue-magenta-violet)); }

.btn-outline-auxiliary:hover, .btn-outline-auxiliary:focus { color: #fff; background-color: rgb(var(--color-blue-magenta-violet)); border-color: rgb(var(--color-blue-magenta-violet)); }


/* MENU DO FOOTER */
/* ==========================================================================
   Estilização Clean para Listas de Páginas Nativas do WP no Footer
   ========================================================================== */

/* Remove os marcadores e zera os recuos nativos da lista */
.site-footer .wp-block-page-list {
    list-style: none !important;
    padding-left: 0 !important;
    margin-bottom: 0 !important;
}

/* Formata o item da lista (li) */
.site-footer .wp-block-pages-list__item {
    padding: 0;
    margin-bottom: 0.5rem; /* Espaçamento equilibrado entre os links */
}

/* Remove a margem do último item para não quebrar o alinhamento vertical */
.site-footer .wp-block-pages-list__item:last-child {
    margin-bottom: 0;
}

/* Formata o link em si (a) */
.site-footer .wp-block-pages-list__item__link {
    color: rgba(255, 255, 255, 0.65) !important; /* Branco fosco elegante para o fundo dark */
    text-decoration: none !important;
    display: inline-block;
    font-size: 0.9rem; /* Tamanho levemente menor para rodapé */
    font-weight: 400;
    transition: all 0.2s ease-in-out;
}

/* Efeito Hover usando sua cor Princeton Orange */
.site-footer .wp-block-pages-list__item__link:hover {
    color: rgb(var(--color-princeton-orange)) !important;
    transform: translateX(4px); /* Sutil empurrão para a direita ao passar o mouse */
}

/* Estilo para a página atual se estiver listada (Active) */
.site-footer .wp-block-pages-list__item.current-menu-item .wp-block-pages-list__item__link {
    color: rgb(var(--color-princeton-orange)) !important;
    font-weight: 600;
}