/**
 * Sonnex Theme - Premium Visual System
 * Clean, minimal, and valid CSS.
 */

/* ==========================================================================
   DESIGN TOKENS
   ========================================================================== */

:root {
    /* Colors */
    --color-primary: #0a0a0a;
    --color-secondary: #1a1a1a;
    --color-accent: #E85D04;
    --color-accent-light: #F48C06;

    /* Surfaces */
    --surface-primary: #ffffff;
    --surface-secondary: #fafafa;
    --surface-dark: #0a0a0a;

    /* Text */
    --text-primary: #0a0a0a;
    --text-secondary: #525252;
    --text-tertiary: #737373;
    --text-inverse: #ffffff;

    /* Borders */
    --border-subtle: rgba(0, 0, 0, 0.08);
    --border-medium: rgba(0, 0, 0, 0.12);

    /* Typography */
    --font-heading: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    --font-mono: 'JetBrains Mono', 'Courier New', monospace;
    --text-sm: 0.875rem;
    --text-base: 1rem;
    --text-lg: 1.25rem;
    --text-xl: 2rem;

    /* Motion */
    --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-elastic: cubic-bezier(0.34, 1.56, 0.64, 1);
    --duration-fast: 200ms;
    --duration-normal: 400ms;

    /* Depth */
    --blur-md: 16px;
    --shadow-soft: 0 10px 30px -10px rgba(0, 0, 0, 0.08);
    --shadow-hover: 0 20px 40px -15px rgba(0, 0, 0, 0.12);
}

/* ==========================================================================
   GLOBAL STYLES
   ========================================================================== */

body {
    background-color: var(--surface-secondary);
    color: var(--text-primary);
    -webkit-font-smoothing: antialiased;
}

/* ==========================================================================
   HEADER (Frosted Glass)
   ========================================================================== */

.site-header {
    background: rgba(255, 255, 255, 0.85) !important;
    backdrop-filter: blur(var(--blur-md));
    -webkit-backdrop-filter: blur(var(--blur-md));
    border-bottom: 1px solid var(--border-subtle);
    position: sticky;
    top: 0;
    z-index: 1000;
}

/* Navigation */
.main-navigation ul li a {
    color: var(--text-primary) !important;
    font-weight: 500;
    font-size: var(--text-sm);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    text-decoration: none;
    transition: color var(--duration-fast) ease;
}

.main-navigation ul li a:hover {
    color: var(--color-accent) !important;
}

/* Header Actions (Search/Cart Icons) */
.header-actions a {
    color: var(--text-primary) !important;
    transition: transform var(--duration-fast) var(--ease-elastic);
}

.header-actions a:hover {
    transform: scale(1.1);
    color: var(--color-accent) !important;
}

/* Hide Ghost Search Block */
.wp-block-search {
    display: none !important;
}

/* ==========================================================================
   BUTTONS
   ========================================================================== */

.sonnex-btn,
.button,
button,
input[type="submit"] {
    background: var(--color-primary);
    color: white !important;
    border-radius: 4px;
    padding: 0.875rem 1.75rem;
    font-weight: 600;
    font-size: var(--text-sm);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border: none;
    cursor: pointer;
    transition: all var(--duration-normal) var(--ease-out-expo);
    box-shadow: var(--shadow-soft);
}

.sonnex-btn:hover,
.button:hover,
button:hover,
input[type="submit"]:hover {
    background: var(--color-accent);
    transform: translateY(-2px);
    box-shadow: var(--shadow-hover);
}

/* ==========================================================================
   FOOTER
   ========================================================================== */

.site-footer {
    background: var(--color-primary);
    color: var(--text-inverse);
    padding: 4rem 0;
}

.site-footer a {
    color: rgba(255, 255, 255, 0.7);
    text-decoration: none;
    transition: color var(--duration-fast) ease;
}

.site-footer a:hover {
    color: white;
}