/* Explain: Defines color palettes, typography, and design tokens for the website. */
:root {
    /* Marca PRESENCIA DIGITAL 360° — Cinematic Experience */
    --primary-color: #071B30;
    --primary-hover: #04111E;
    --secondary-color: #143B60;
    --accent-color: #FFC857;
    --accent-hover: #EBB64D;
    --accent-strong: #D1A142;
    --whatsapp-color: #25d366;
    --whatsapp-hover: #1eb45a;
    --navy-deep: #051426;
    --navy-soft: #143B60;
    --sky-color: #15D6D1;
    --turquoise-color: #15D6D1;
    --cyan-color: #12B8B3;

    /* Iluminación ambiental */
    --glow-turquoise: rgba(21, 214, 209, 0.45);
    --glow-yellow: rgba(255, 200, 87, 0.4);
    --glow-sky: rgba(20, 59, 96, 0.6);

    /* Degradados premium */
    --grad-band: linear-gradient(135deg, #071B30 0%, #143B60 45%, #0B243E 100%);
    --grad-gold: linear-gradient(100deg, #FFE199, #FFC857 45%, #EBB64D);

    /* Neutros */
    --background-color: #F7F9FC;
    --surface-color: #ffffff;
    --surface-alt: #EBF1F7;
    --text-color: #071B30;
    --text-muted: #4B6075;
    --border-color: #D3E0EE;

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

    /* Sombras y radios */
    --shadow-sm: 0 2px 4px rgba(7, 27, 48, 0.08);
    --shadow-md: 0 16px 32px -12px rgba(7, 27, 48, 0.25);
    --shadow-lg: 0 32px 64px -20px rgba(7, 27, 48, 0.45);
    --shadow-glow: 0 26px 64px -30px rgba(21, 214, 209, 0.65);
    --radius: 20px;
}