/**
 * Flavor Starter — CSS Custom Properties
 *
 * All theme colors, spacing, and layout variables.
 * Overridden by Customizer values via wp_head inline style.
 *
 * @package Flavor_Starter
 */

:root {
    /* Background colors */
    --flavor-bg-primary: #0d1527;
    --flavor-bg-secondary: #111d35;
    --flavor-bg-bottom: #1a234010;
    --flavor-bg-card: rgba(13, 21, 39, 0.5);
    --flavor-bg-card-hover: #222e4a;
    --flavor-bg-nav: rgba(13, 21, 39, 0.1);
    --flavor-bg-nav-dark: rgba(13, 21, 39, 0.85);

    /* Text colors */
    --flavor-text-primary: #ffffff;
    --flavor-text-secondary: #8892a8;
    --flavor-text-muted: #5a6478;

    /* Accent colors */
    --flavor-accent-primary: #e84393;
    --flavor-accent-primary-light: #fd79a8;
    --flavor-accent-gradient: linear-gradient(135deg, var(--flavor-accent-primary), var(--flavor-accent-primary-light));
    --flavor-accent-hot: #ff6b6b;

    /* Layout */
    --flavor-nav-height: 5.14286rem;  /* 72px */
    --flavor-grid-gap: 1.14286rem;  /* 16px */
    --flavor-section-gap: 3.42857rem;  /* 48px */
    --flavor-container-max: 85.71429rem;  /* 1200px at 14px base — matches SinarTek */
    --flavor-container-padding: 1.71429rem;  /* 24px */

    /* Cards */
    --flavor-card-radius: 1rem;  /* 14px */
    --flavor-grid-columns: 5;

    /* Decorative blob */
    --flavor-blob-color-1: rgba(232, 67, 147, 0.35);
    --flavor-blob-color-2: rgba(108, 42, 75, 0.4);

    /* Transitions */
    --flavor-transition-fast: 0.2s ease;
    --flavor-transition-med: 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}