/**
 * Design Tokens - Executive-Grade
 * Paleta institucional, silenciosamente sofisticada
 */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;550;600;700&display=swap');

:root {
    /* ===== CORES EXECUTIVE-GRADE ===== */
    --green-base: #1B5E2A;
    --green-action: #27AE60;
    
    /* Dark Theme */
    --bg-dark: #0F1316;
    --surface-dark: #151A1E;
    --text-on-dark: #F4F6F3;
    --muted-on-dark: #B6BEB6;
    --border-dark: rgba(244, 246, 243, 0.10);
    
    /* Light Theme */
    --bg-light: #F7F8F6;
    --surface-light: #FFFFFF;
    --text: #0E1112;
    --muted: #58605D;
    --border-light: rgba(14, 17, 18, 0.10);
    
    /* ===== TIPOGRAFIA ===== */
    --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    
    --fw-h1: 600;
    --fw-h2: 600;
    --fw-h3: 550;
    --fw-body: 400;
    
    --fs-h1: clamp(2.1rem, 3.2vw, 3.2rem);
    --fs-h2: clamp(1.45rem, 2.1vw, 2.05rem);
    --fs-h3: clamp(1.1rem, 1.3vw, 1.25rem);
    --fs-body: 1rem;
    --fs-small: 0.95rem;
    --fs-micro: 0.85rem;
    
    --lh-head: 1.12;
    --lh-body: 1.65;
    
    /* ===== LAYOUT / ESPAÇAMENTO ===== */
    --container-max: 1200px;
    --gutter: 24px;
    
    --section-py: clamp(64px, 7vw, 104px);
    --stack-1: 10px;
    --stack-2: 16px;
    --stack-3: 24px;
    --stack-4: 32px;
    --stack-5: 48px;
    
    /* ===== RAIOS / SOMBRAS (SILENCIOSAS) ===== */
    --radius-sm: 10px;
    --radius-md: 12px;
    
    --shadow-light: 0 10px 26px rgba(14, 17, 18, 0.07);
    --shadow-dark: 0 14px 32px rgba(0, 0, 0, 0.45);
    
    /* ===== FOCUS / INTERAÇÃO ===== */
    --focus: 0 0 0 3px rgba(39, 174, 96, 0.22);
    
    /* ===== COMPATIBILIDADE (mantidas para não quebrar código existente) ===== */
    --verde-primario: var(--green-base);
    --verde-acao: var(--green-action);
    --texto-primario: var(--text);
    --texto-secundario: var(--muted);
    --texto-branco: var(--text-on-dark);
    --fundo-branco: var(--surface-light);
    --fundo-cinza: var(--bg-light);
    --font-family-base: var(--font-sans);
    --font-weight-normal: var(--fw-body);
    --font-weight-semibold: var(--fw-h2);
    --font-weight-bold: var(--fw-h1);
    --font-size-base: var(--fs-body);
    --font-size-lg: var(--fs-h3);
    --font-size-xl: clamp(1.2rem, 1.5vw, 1.35rem);
    --font-size-2xl: var(--fs-h3);
    --font-size-3xl: var(--fs-h2);
    --font-size-4xl: var(--fs-h2);
    --font-size-5xl: var(--fs-h1);
    --font-size-6xl: var(--fs-h1);
    --line-height-tight: var(--lh-head);
    --line-height-normal: var(--lh-body);
    --line-height-relaxed: 1.75;
    --spacing-xs: var(--stack-1);
    --spacing-sm: var(--stack-2);
    --spacing-md: var(--stack-3);
    --spacing-lg: var(--stack-4);
    --spacing-xl: var(--stack-5);
    --spacing-2xl: 64px;
    --spacing-3xl: 96px;
    --radius-xs: var(--radius-sm);
    --radius-sm: var(--radius-sm);
    --radius-md: var(--radius-md);
    --radius-lg: var(--radius-md);
    --shadow-md: var(--shadow-light);
    --shadow-premium: var(--shadow-light);
    --shadow-xl: var(--shadow-light);
    --container-xl: var(--container-max);
    --transition-base: 0.2s ease;
}

/* ===== RESET E BASE ===== */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    font-size: 16px;
}

html, body {
    min-height: 100%;
}

body {
    font-family: var(--font-sans);
    color: var(--text);
    line-height: var(--lh-body);
    background: var(--bg-light);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    padding-top: 0;
}

/* ===== ACESSIBILIDADE ===== */
:focus-visible {
    outline: none;
    box-shadow: var(--focus);
    border-radius: 6px;
}

/* ===== RESPONSIVO ===== */
@media (max-width: 768px) {
    :root {
        --section-py: clamp(48px, 6vw, 64px);
        --gutter: 20px;
    }
}
