@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800;900&family=Inter:wght@400;500;600;700&display=swap');

:root {
    /* Colores primarios */
    --tt-primary:        #ffc000;
    --tt-primary-dark:   #d8a200;
    --tt-primary-light:  #ffd04d;
    --tt-green:          #25d366;
    --tt-green-dark:     #1db958;

    /* Fondos */
    --tt-bg:         #050505;
    --tt-bg-alt:     #0a0a0a;
    --tt-bg-soft:    #111111;
    --tt-bg-card:    rgba(255, 255, 255, 0.034);
    --tt-bg-glass:   rgba(255, 255, 255, 0.05);
    --tt-bg-glass-strong: rgba(255, 255, 255, 0.08);

    /* Bordes */
    --tt-border:        rgba(255, 255, 255, 0.09);
    --tt-border-mid:    rgba(255, 255, 255, 0.16);
    --tt-border-strong: rgba(255, 192, 0, 0.28);
    --tt-border-gold:   rgba(255, 192, 0, 0.5);

    /* Texto */
    --tt-text:      #ffffff;
    --tt-muted:     rgba(255, 255, 255, 0.65);
    --tt-subtle:    rgba(255, 255, 255, 0.4);
    --tt-dark-text: #080808;

    /* Tipografía */
    --tt-font-heading: 'Outfit', Arial, sans-serif;
    --tt-font-body:    'Inter', Arial, sans-serif;
    --tt-font:         'Outfit', 'Inter', Arial, sans-serif;

    /* Layout */
    --tt-container: 1200px;
    --tt-gutter:    clamp(18px, 4vw, 48px);
    --tt-header:    76px;

    /* Radios */
    --tt-radius-sm: 8px;
    --tt-radius:    12px;
    --tt-radius-lg: 18px;
    --tt-radius-xl: 26px;

    /* Sombras */
    --tt-shadow:       0 24px 70px rgba(0, 0, 0, 0.45);
    --tt-shadow-sm:    0 8px 30px rgba(0, 0, 0, 0.3);
    --tt-shadow-card:  0 2px 24px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(255,255,255,0.05);

    /* Glow dorado */
    --tt-glow:       0 0 50px rgba(255, 192, 0, 0.22), 0 0 100px rgba(255, 192, 0, 0.1);
    --tt-glow-sm:    0 4px 20px rgba(255, 192, 0, 0.25);
    --tt-glow-btn:   0 8px 32px rgba(255, 192, 0, 0.35), 0 2px 8px rgba(255, 192, 0, 0.2);

    /* Gradientes */
    --tt-gold-gradient: linear-gradient(135deg, #ffc000 0%, #ffdd66 50%, #ffc000 100%);
    --tt-dark-gradient: linear-gradient(180deg, #050505 0%, #0a0a0a 100%);

    /* Espaciado de sección */
    --tt-section: clamp(72px, 9vw, 120px);

    /* Transiciones */
    --tt-transition: 220ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
    --tt-transition-slow: 380ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
