/* ================================
   PERLA PAINT - DESIGN TOKENS
   Kurumsal kimlik dosyasına göre
   ================================ */

:root {
    /* Brand Colors */
    --perla-bordo: #380a14;
    --perla-bordo-dark: #24060d;
    --perla-bordo-soft: #4a101d;

    --perla-gold: #b3966d;
    --perla-gold-light: #d8c5a8;
    --perla-gold-soft: #eee4d4;

    --perla-antrasit: #222222;
    --perla-grey: #6f6f6f;
    --perla-light: #eae9e5;
    --perla-white: #ffffff;
    --perla-black: #0f0f0f;

    /* Backgrounds */
    --color-body: var(--perla-light);
    --color-dark-section: var(--perla-bordo);
    --color-soft-section: #f4f1ec;

    /* Text Colors */
    --text-dark: var(--perla-antrasit);
    --text-muted: #6c6862;
    --text-light: var(--perla-light);
    --text-gold: var(--perla-gold);

    /* Border Colors */
    --border-light: rgba(34, 34, 34, 0.12);
    --border-gold: rgba(179, 150, 109, 0.42);
    --border-white: rgba(255, 255, 255, 0.16);

    /* Typography */
    --font-body: "Montserrat", Arial, sans-serif;
    --font-heading: var(--font-body);
    --font-display: "Bodoni Moda", "Playfair Display", Georgia, serif;

    /* Font Sizes */
    --fs-xs: 12px;
    --fs-sm: 14px;
    --fs-md: 16px;
    --fs-lg: 18px;
    --fs-xl: 24px;
    --fs-2xl: 34px;
    --fs-3xl: 48px;
    --fs-4xl: 72px;
    --fs-hero: clamp(54px, 8vw, 118px);

    /* Editorial Type Scale */
    --type-page-title: clamp(38px, 4.2vw, 60px);
    --type-section-title: clamp(28px, 3.1vw, 42px);
    --type-feature-title: clamp(24px, 2.45vw, 34px);
    --type-card-title: clamp(20px, 1.8vw, 26px);
    --type-body-lg: clamp(15.5px, 1.08vw, 17px);
    --type-body: 15px;
    --type-body-sm: 13.5px;
    --type-kicker: 11px;

    /* Layout */
    --container: 1180px;
    --container-wide: 1360px;
    --section-padding: 120px;
    --section-padding-mobile: 72px;

    /* Radius */
    --radius-sm: 8px;
    --radius-md: 16px;
    --radius-lg: 28px;
    --radius-full: 999px;

    /* Shadows */
    --shadow-soft: 0 24px 80px rgba(34, 34, 34, 0.08);
    --shadow-dark: 0 28px 90px rgba(0, 0, 0, 0.28);

    /* Transitions */
    --transition-fast: 0.25s ease;
    --transition-med: 0.45s ease;
    --transition-slow: 0.8s cubic-bezier(0.16, 1, 0.3, 1);

    /* Header */
    --header-height: 92px;
}