/* ========================================
   UK MARRIAGE BUREAU - CORE VARIABLES
======================================== */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600;700;800;900&family=Figtree:wght@300;400;500;600;700;800;900&display=swap');

:root {

    /* Brand Core */
    --emerald: #0E4A44;
    --emerald-soft: #136158;
    --emerald-light: #1A6E64;
    --emerald-dark: #0B3B36;
    --emerald-deep: #072B28;

    --luxury-gold: #C8A96B;
    --highlight-gold: #D4AF37;
    --dark-gold: #B8894D;
    --light-gold: #E6C878;

    --warm-ivory: #F7F2E8;
    --ivory-dark: #EBE4D8;
    --ivory-soft: #F5EFE5;

    --white: #FFFFFF;
    --white-soft: rgba(255,255,255,.88);
    --white-muted: rgba(255,255,255,.70);

    --whatsapp-green: #25D366;
    --whatsapp-dark: #128C7E;

    /* Compatibility Aliases (important) */
    --gold: var(--highlight-gold);
    --gold-light: var(--light-gold);
    --gold-dark: var(--dark-gold);

    --bg-light: var(--warm-ivory);
    --bg-dark: var(--emerald);

    --text-dark: var(--emerald-deep);
    --text-light: var(--white);

    --border-light: rgba(200,169,107,.25);

    /* Gradients */
    --gold-gradient: linear-gradient(
        135deg,
        #D4AF37 0%,
        #C8A96B 30%,
        #F5E6B8 50%,
        #C8A96B 70%,
        #D4AF37 100%
    );

    --gold-gradient-solid: linear-gradient(
        135deg,
        #D4AF37 0%,
        #C8A96B 40%,
        #B8894D 100%
    );

    --gold-gradient-solid-hover: linear-gradient(
        135deg,
        #E6C878 0%,
        #D4AF37 50%,
        #C8A96B 100%
    );

    --emerald-gradient-dark: linear-gradient(
        135deg,
        #0E4A44 0%,
        #0B3B36 100%
    );

    --emerald-gradient-soft: linear-gradient(
        135deg,
        #136158 0%,
        #0E4A44 100%
    );

    --ivory-gradient: linear-gradient(
        135deg,
        #F7F2E8 0%,
        #EBE4D8 100%
    );

    --whatsapp-gradient: linear-gradient(
        135deg,
        #25D366,
        #128C7E
    );

    --whatsapp-gradient-hover: linear-gradient(
        135deg,
        #30e374,
        #159c8a
    );

    /* Shadows */
    --shadow-sm: 0 8px 20px rgba(0,0,0,.08);
    --shadow-md: 0 15px 30px rgba(0,0,0,.12);
    --shadow-lg: 0 25px 45px rgba(0,0,0,.15);

    --shadow-gold: 0 8px 20px rgba(200,169,107,.25);
    --shadow-gold-hover: 0 12px 28px rgba(200,169,107,.35);
    --shadow-gold-glow: 0 0 20px rgba(200,169,107,.20);

    /* Borders */
    --border-gold-light: 1px solid rgba(200,169,107,.3);
    --border-gold-medium: 1px solid rgba(200,169,107,.45);
    --border-gold-strong: 1px solid rgba(200,169,107,.6);
    --border-gold-solid: 2px solid #C8A96B;
    --border-gold-solid-light: 2px solid rgba(200,169,107,.7);

    /* Spacing */
    --section-spacing-lg: 80px;
    --section-spacing-md: 70px;
    --section-spacing-sm: 60px;
    --section-spacing-xs: 40px;

    --card-padding-lg: 35px;
    --card-padding-md: 30px;

    --grid-gap-lg: 28px;
    --grid-gap-md: 24px;
    --grid-gap-sm: 20px;

    /* Radius */
    --radius-sm: 10px;
    --radius-md: 16px;
    --radius-lg: 20px;
    --radius-xl: 28px;
    --radius-2xl: 36px;
    --radius-full: 60px;

    /* Transition */
    --transition-fast: all .2s ease;
    --transition-default: all .3s ease;
    --transition-slow: all .4s ease;

    --transition-bounce: all .4s cubic-bezier(
        0.175,
        0.885,
        0.32,
        1.275
    );
}