@charset "UTF-8"; 

@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400..900&display=swap'); 

@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');


:root { 

    /*COLORS*/

    --background-main: #121417; 
    --background-soft: #1a1d21; 
    --background-card: #20242a;
    
    --beige-main: #f5f1ea;
    --beige-soft: #ebe4d8;
    --beige-dark: #d8cfc0;

    --cream-light: #faf7f2;
    --warm-white: #f8f5ef;

    --gold: #c6a46c; 
    --gold-soft: #a88b5c; 
    --gold-light: #e0c48a; 
    
    --blue-deep: #1e3a8a; 
    --red-accent: #b91c1c; 
    
    --text-main: #f5f5f5; 
    --text-soft: #b0b3b8; 

    --text-dark: #1b1b1b;
    --text-brown: #5f5648;

    --border-light: rgba(255, 255, 255, 0.08);
    --border-soft: rgba(255,255,255,0.04);
    --gold-border: 1px solid rgba(198,164,108,0.25);
    --beige-border: 1px solid rgba(198,164,108,0.18);

    --overlay-dark: rgba(0,0,0,0.72);
    --overlay-light: rgba(0,0,0,0.3);
    --overlay-beige:
    linear-gradient(
        to bottom,
        rgba(245,241,234,0.88),
        rgba(245,241,234,0.96)
    );

    /*TYPOGRAPHY*/

    --font-title: "Cinzel", serif;
    --font-body: "Inter", sans-serif;

    --title-big: 5.5rem;
    --title-medium: 3rem;
    --title-small: 1.5rem;

    --text-large: 1.15rem;
    --text-normal: 1rem;
    --text-small: 0.9rem;

    --letter-spacing-title: 2px;

    /*SPACING*/

    --section-padding: 9rem;
    --container-width: 1280px;

    --content-width: 550px;


    --card-padding: 2.5rem;

    --button-padding: 1rem 2.2rem;

    /*EFFECTS*/
    
    --radius: 14px;
    --radius-small: 8px;
    --radius-large: 24px;

    --shadow-soft: 0 10px 30px rgba(0,0,0,0.25);
    --shadow-medium: rgba(0,0px,60px,0.35);
    --shadow-heavy: rgba(0,30px,100px,0.45);

    --gradient-dark:
    linear-gradient(
    to right,
    rgba(0,0,0,0.88),
    rgba(0,0,0,0.3)
);

    --gradient-soft:
    linear-gradient(
    to bottom,
    rgba(0,0,0,0.2),
    rgba(0,0,0,0.75)
);

--gradient-beige:
    linear-gradient(
        135deg,
        #faf7f2,
        #ebe4d8
    );

    --blur-light: blur(8px);
    --blur-medium: blur(14px);
    --blur-heavy: blur(24px);

    --gold-glow: 0 0 30px rgba(198,164,108,0.08);

    --gold-strong: #c3bf76;

    --transition-slow: 1s ease;
    --transition-medium: 0.6s ease;
    --transition-fast: 0.3s ease;

    --luxury-transition: cubic-bezier(0.19,1,0.22,1);
    
} 

* { 
    margin: 0px; 
    padding: 0px; 
    box-sizing: border-box; 
} 

html {
    scroll-behavior: smooth;
}


body { 
    font-family: "Inter", sans-serif; 

    color: var(--text-main);
    
    background: linear-gradient(to bottom, rgba(0,0,0,0.2),
    rgba(0,0,0,0.9)
    );

    background-color: var(--background-main);
    line-height: 1.7; 

    overflow-x: hidden;
    position: relative;
} 

body::before {
    content: "";
    position: fixed;

    inset: 0;

    background-image: radial-gradient(rgba(255,255,255,0.08) 0.5px,
    transparent 0.05px
    );

    background-size: 4px 4px;

    opacity: 0.03;

    pointer-events: none;
    
    z-index: 9999;
}

h1, h2, h3 { 
    font-family: "Cinzel", serif; 
    letter-spacing: var(--letter-spacing-title); 
    line-height: 1.1;
    font-weight: 600;
} 

p { 
    color: var(--text-soft); 
    font-size: var(--text-normal);
} 

a { 
    text-decoration: none; 
    color: inherit; 
}

.container {
    width: 90%;
    max-width: var(--container-width);
    margin: 0px auto;
}

section {
    padding: var(--section-padding) 0;
    position: relative;
}