/* --- 1. CORE & RESET --- */
body {
    margin: 0;
    overflow-x: hidden;
    font-family: 'Montserrat', sans-serif;
    background-color: #020617; /* Slate 950 */
    color: white;
    cursor: none; /* Hides default cursor to show custom one */
}

/* 3D Canvas Background */
#canvas-container {
    position: fixed;
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100vh;
    z-index: -1;
    background: radial-gradient(circle at center, #1e293b 0%, #000000 100%);
}

/* Fonts */
h1, h2, h3, .font-serif {
    font-family: 'Playfair Display', serif;
}

/* --- 2. HERO ANIMATED LOGO (NEW) --- */
.hero-logo-svg {
    width: 100%;
    height: auto;
    overflow: visible;
    max-width: 800px; /* Limits size on large screens */
    display: block;
    margin: 0 auto;
}

/* The Swoosh Line */
.heaven-swoosh {
    fill: none;
    stroke: #fbbf24; /* Amber/Gold */
    stroke-width: 3;
    stroke-dasharray: 600;
    stroke-dashoffset: 600;
    opacity: 0.8;
    filter: drop-shadow(0 0 8px rgba(251, 191, 36, 0.4));
    animation: drawLine 2s ease-in-out forwards;
    animation-delay: 0.5s;
}

/* The Sliding Mask Rect */
.reveal-rect {
    animation: slideReveal 2.2s cubic-bezier(0.65, 0, 0.35, 1) forwards;
    animation-delay: 1.5s; /* Starts after line begins */
    transform-box: fill-box; /* Ensures transform works on SVG rect */
}

/* Text Styling inside SVG */
.logo-text-main {
    font-family: 'Playfair Display', serif;
    font-weight: 700;
    fill: #ffffff;
    font-size: 80px;
    letter-spacing: -0.02em;
}

.logo-text-sub {
    font-family: 'Playfair Display', serif;
    font-weight: 400;
    font-style: italic;
    fill: #fbbf24; /* Amber/Gold */
    font-size: 80px;
    filter: drop-shadow(0 0 20px rgba(251, 191, 36, 0.3));
}

/* Logo Keyframes */
@keyframes drawLine {
    to { stroke-dashoffset: 0; }
}

@keyframes slideReveal {
    from { width: 0; }
    to { width: 100%; }
}

/* --- 3. PRELOADER & ATMOSPHERE --- */
#preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #020617; 
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

#loader-bar {
    background: #fbbf24; /* Amber/Gold */
    position: absolute;
    top: 0;
    left: 0;
    width: 0%;
    /* Gold Glow */
    box-shadow: 0 0 10px #fbbf24, 0 0 5px #fff;
}

/* --- SNOW ANIMATION LOGIC --- */
.snow-layer {
    position: absolute;
    top: -10vh;
    left: 0;
    width: 100%;
    height: 100vh;
    background: transparent;
    will-change: transform;
}

/* Layer 1: FAR Snow (Small, White) */
.layer-far {
    width: 2px; height: 2px; border-radius: 50%; opacity: 0.5;
    box-shadow: 
        10vw 10vh 0px #fff, 55vw 35vh 1px #fff, 23vw 67vh 0px #fff, 89vw 12vh 1px #fff, 
        45vw 88vh 0px #fff, 12vw 45vh 1px #fff, 67vw 23vh 0px #fff, 34vw 78vh 1px #fff,
        92vw 56vh 0px #fff, 78vw 91vh 1px #fff, 5vw 29vh 0px #fff, 41vw 52vh 1px #fff,
        29vw 14vh 0px #fff, 63vw 71vh 1px #fff, 82vw 38vh 0px #fff, 19vw 94vh 1px #fff;
    animation: snowfall-turbulent 25s linear infinite;
}

/* Layer 2: MID Snow (Medium, White) */
.layer-mid {
    width: 3px; height: 3px; border-radius: 50%; opacity: 0.7; filter: blur(1px);
    box-shadow: 
        25vw 18vh 1px #fff, 85vw 42vh 1px #fff, 45vw 75vh 1px #fff, 15vw 92vh 1px #fff,
        65vw 25vh 1px #fff, 35vw 58vh 1px #fff, 95vw 83vh 1px #fff, 55vw 12vh 1px #fff;
    animation: snowfall-turbulent 14s linear infinite;
    animation-delay: -5s;
}

/* Layer 3: NEAR Snow (Large, White) */
.layer-near {
    width: 4px; height: 4px; border-radius: 50%; opacity: 0.9; filter: blur(2px);
    box-shadow: 
        30vw 22vh 2px #fff, 70vw 48vh 2px #fff, 10vw 85vh 2px #fff, 
        90vw 15vh 2px #fff, 50vw 65vh 2px #fff, 20vw 35vh 2px #fff;
    animation: snowfall-windy 8s linear infinite;
}

@keyframes snowfall-turbulent {
    0% { transform: translateY(0) translateX(0) rotate(0deg); }
    50% { transform: translateY(55vh) translateX(-20vw) rotate(180deg); }
    100% { transform: translateY(110vh) translateX(0) rotate(360deg); }
}

@keyframes snowfall-windy {
    0% { transform: translateY(0) translateX(0) scale(1); }
    100% { transform: translateY(110vh) translateX(-40vw) scale(1.2); }
}

/* --- 4. CUSTOM CURSOR (SNOWFLAKE EDITION) --- */
#cursor-dot, #cursor-circle {
    display: none; opacity: 0; position: fixed; top: 0; left: 0; pointer-events: none; z-index: 9999;
}

@media (min-width: 1024px) {
    #cursor-dot, #cursor-circle { display: block; opacity: 1; }

    /* The Center Snowflake */
    #cursor-dot {
        width: 30px; height: 30px;
        background-color: transparent;
        color: #fbbf24; /* Gold Color */
        display: flex; justify-content: center; align-items: center;
        font-size: 24px; line-height: 1;
        filter: drop-shadow(0 0 5px #fbbf24);
        transform: translate(-50%, -50%); 
    }

    /* Insert Snowflake Symbol */
    #cursor-dot::after {
        content: '❄'; 
        animation: spin-cursor 8s linear infinite;
    }

    /* The Trailing Ring */
    #cursor-circle {
        width: 40px; height: 40px;
        border: 1px solid rgba(255, 255, 255, 0.4);
        border-radius: 50%;
        box-shadow: 0 0 10px rgba(251, 191, 36, 0.2); /* Faint gold glow */
        transition: width 0.3s, height 0.3s, border-color 0.3s;
        transform: translate(-50%, -50%);
    }
}

@keyframes spin-cursor {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* --- 5. GLASSMORPHISM CARDS --- */
.glass-card {
    background: rgba(255, 255, 255, 0.02);
    backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.05);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.2);
    transition: all 0.4s ease;
}

.glass-card:hover {
    transform: translateY(-5px);
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(251, 191, 36, 0.4); /* Gold Border on Hover */
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4), 0 0 20px rgba(251, 191, 36, 0.1);
}

/* --- 6. INTERACTION STATES --- */
.modal-active { opacity: 1 !important; pointer-events: auto !important; }
.modal-active #modal-content { transform: scale(1) !important; }

#mobile-menu { transition: opacity 0.3s ease, pointer-events 0.3s ease; opacity: 0; pointer-events: none; }
.menu-open { opacity: 1 !important; pointer-events: auto !important; }

/* --- 7. UTILITIES --- */
.parallax-img { will-change: transform; }

::selection {
    background: #fbbf24; /* Gold Selection */
    color: #000;
}

::-webkit-calendar-picker-indicator {
    filter: invert(1); opacity: 0.5; cursor: pointer;
}

::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #020617; }
::-webkit-scrollbar-thumb { background: #334155; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #fbbf24; }

/* Lenis Scroll */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-stopped { overflow: hidden; }

