/* Explain: Base reset, typography defaults, and animation utilities */
* {
    box-sizing: border-box;
}

html {
    background-color: var(--background-color);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 800'%3E%3Cpath fill='%230284c7' fill-opacity='0.02' d='M0,150 L60,130 C120,110,240,70,360,75 C480,80,600,130,720,140 C840,150,960,120,1080,105 C1200,90,1320,90,1380,90 L1440,90 L1440,800 L1380,800 C1320,800,1200,800,1080,800 C960,800,840,800,720,800 C600,800,480,800,360,800 C240,800,120,800,60,800 L0,800 Z'/%3E%3Cpath fill='%230284c7' fill-opacity='0.03' d='M0,350 L48,340 C96,330,192,310,288,320 C384,330,480,370,576,375 C672,380,768,350,864,325 C960,300,1056,280,1152,280 C1248,280,1344,300,1392,310 L1440,320 L1440,800 L1392,800 C1344,800,1248,800,1152,800 C1056,800,960,800,864,800 C768,800,672,800,576,800 C480,800,384,800,288,800 C192,800,96,800,48,800 L0,800 Z'/%3E%3Cpath fill='%230284c7' fill-opacity='0.04' d='M0,550 L80,560 C160,570,320,590,480,580 C640,570,800,530,960,515 C1120,500,1280,510,1360,515 L1440,520 L1440,800 L1360,800 C1280,800,1120,800,960,800 C800,800,640,800,480,800 C320,800,160,800,80,800 L0,800 Z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    background-position: center bottom;
    scroll-behavior: smooth;
}

body {
    overflow-x: hidden;
    background: transparent !important;
}

/* Premium advanced CSS classes */
.glass-panel {
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.4);
    box-shadow: 0 20px 40px -15px rgba(0,0,0,0.1);
}

.glass-textured {
    background: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.07'/%3E%3C/svg%3E"), rgba(255, 255, 255, 0.4);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    box-shadow: 0 20px 40px -15px rgba(0,0,0,0.1);
}

.animate-fade-in-up {
    animation: fadeInUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

.scroll-reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}
.scroll-reveal-visible {
    opacity: 1;
    transform: translateY(0);
}

.fancy-pin {
    border-radius: 50% 50% 50% 0;
    border: 3px solid white;
    width: 36px;
    height: 36px;
    transform: rotate(-45deg);
    box-shadow: -2px 4px 10px rgba(0,0,0,0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    cursor: pointer;
}
.fancy-pin:hover {
    transform: rotate(-45deg) scale(1.15) translateY(-2px);
    box-shadow: -4px 6px 12px rgba(0,0,0,0.3);
    z-index: 1000 !important;
}
.fancy-pin i {
    transform: rotate(45deg);
    color: white;
    font-size: 15px;
}