/*
Theme Name: Romarix
Theme URI: https://romarix.com
Author: Romarix Technology & Business Operations
Author URI: https://romarix.com
Description: Custom WordPress theme for Romarix — Technology & Business Operations. Executive-grade, system-first, dark aesthetic with advanced animations.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 8.0
License: Proprietary
Text Domain: romarix
*/

/* ============================================================
   CSS CUSTOM PROPERTIES — Design Tokens
   ============================================================ */
:root {
    /* Colors */
    --color-black:        #0a0d0a;
    --color-dark:         #0a0d0a;
    --color-dark-2:       #212421;
    --color-dark-3:       #1a1d1a;
    --color-dark-4:       #1e221e;
    --color-border:       rgba(255, 255, 255, 0.08);
    --color-border-hover: rgba(255, 255, 255, 0.2);
    --color-white:        #FFFFFF;
    --color-white-60:     rgba(255, 255, 255, 0.6);
    --color-white-30:     rgba(255, 255, 255, 0.3);
    --color-white-10:     rgba(255, 255, 255, 0.07);
    --color-accent:       #57fafa;
    --color-accent-dim:   rgba(87, 250, 250, 0.12);
    --color-accent-glow:  rgba(87, 250, 250, 0.4);

    /* Typography */
    --font-display:  'Syne', sans-serif;
    --font-body:     'DM Sans', sans-serif;

    /* Sizes */
    --size-nav-h:    80px;
    --size-nav-h-sm: 64px;

    /* Spacing */
    --space-xs:  0.5rem;
    --space-sm:  1rem;
    --space-md:  2rem;
    --space-lg:  4rem;
    --space-xl:  6rem;
    --space-xxl: 9rem;

    /* Transitions */
    --ease-smooth:  cubic-bezier(0.25, 0.46, 0.45, 0.94);
    --ease-bounce:  cubic-bezier(0.34, 1.56, 0.64, 1);
    --ease-sharp:   cubic-bezier(0.77, 0, 0.175, 1);
    --trans-fast:   0.2s var(--ease-smooth);
    --trans-med:    0.4s var(--ease-smooth);
    --trans-slow:   0.7s var(--ease-sharp);

    /* Border radius */
    --radius-sm:   8px;
    --radius-md:   14px;
    --radius-lg:   18px;
    --radius-xl:   24px;
    --radius-pill: 999px;

    /* Shadows */
    --shadow-card:  0 0 40px rgba(0, 0, 0, 0.6);
    --shadow-glow:  0 0 30px var(--color-accent-glow);
    --shadow-text:  0 0 60px rgba(197, 240, 0, 0.2);
}