/* Caminho no servidor: /home/usuario_hostgator/public_html/assets/css/tokens.css
   Tokens da marca Teto Livre. Variaveis CSS oficiais. */

:root {
    /* Cores primarias */
    --tl-terracota: #C4633B;
    --tl-pergaminho: #F5F0E8;
    --tl-carvao: #2D2D2D;

    /* Secundarias */
    --tl-mostarda: #E8A93D;
    --tl-bordo: #8B3A1F;

    /* Neutros */
    --tl-pedra: #6B7280;
    --tl-areia: #E5DED1;
    --tl-carvao-suave: #4A4A4A;

    /* Semanticas */
    --tl-verde: #5C8A4E;
    --tl-ambar: #D97706;
    --tl-vermelho: #B91C1C;

    /* Cores das intencoes */
    --tl-intencao-morar: var(--tl-terracota);
    --tl-intencao-curtir: var(--tl-mostarda);
    --tl-intencao-empreender: var(--tl-bordo);
    --tl-intencao-conquistar: var(--tl-verde);

    /* Tipografia */
    --tl-font-display: 'Fraunces', Georgia, serif;
    --tl-font-ui: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

    /* Espacamento (base 8) */
    --tl-space-1: 8px;
    --tl-space-2: 16px;
    --tl-space-3: 24px;
    --tl-space-4: 32px;
    --tl-space-6: 48px;
    --tl-space-8: 64px;
    --tl-space-12: 96px;

    /* Radius */
    --tl-radius-sm: 8px;
    --tl-radius-md: 16px;
    --tl-radius-pill: 999px;

    /* Sombras */
    --tl-shadow-soft: 0 4px 12px rgba(45, 45, 45, 0.06);
    --tl-shadow-hover: 0 8px 24px rgba(45, 45, 45, 0.10);
    --tl-shadow-modal: 0 24px 48px rgba(45, 45, 45, 0.16);

    /* Container */
    --tl-container: 1280px;

    /* Transicoes */
    --tl-transition-fast: 150ms ease-out;
    --tl-transition-base: 250ms ease-out;
}