@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400&family=Merriweather:wght@300;400;700;900&family=Source+Serif+4:ital,opsz,wght@0,8..60,300..900;1,8..60,300..900&display=swap');

:root {
    --background: #F9F6EB;
    --foreground: #1C1917;
    --card: #ffffff;
    --card-foreground: #1C1917;
    --popover: #ffffff;
    --popover-foreground: #1C1917;
    --primary: #F26B3A;
    --primary-foreground: #ffffff;
    --secondary: #F7EBE0;
    --secondary-foreground: #1C1917;
    --muted: #F7EBE0;
    --muted-foreground: #6B5B4F;
    --accent: #F7EBE0;
    --accent-foreground: #1C1917;
    --destructive: #B91C1C;
    --destructive-foreground: #ffffff;
    --border: #E8D9CB;
    --input: #E8D9CB;
    --ring: #F26B3A;
    --dark-section: #0F1E3D;
    --dark-section-foreground: #F9F6EB;

    --radius: 0.75rem;
    --font-sans: 'Merriweather', serif;
    --font-serif: 'Source Serif 4', serif;
    --font-mono: 'JetBrains Mono', monospace;
}

body {
    background-color: var(--background);
    color: var(--foreground);
    font-family: var(--font-sans);
    margin: 0;
    padding: 0;
}

.font-sans {
    font-family: var(--font-sans);
}

.font-serif {
    font-family: var(--font-serif);
}

.glass-nav {
    background-color: color-mix(in oklch, var(--background), transparent 20%);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--border);
}

@keyframes scroll {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

.animate-scroll {
    animation: scroll 40s linear infinite;
    display: flex;
    width: max-content;
}

.animate-scroll:hover {
    animation-play-state: paused;
}

.scrollbar-hide::-webkit-scrollbar {
    display: none;
}

.scrollbar-hide {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* Vinyl spinning animation for audio player */
@keyframes vinyl-spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.vinyl-spin {
    animation: vinyl-spin 8s linear infinite;
}

.vinyl-paused {
    animation-play-state: paused;
}

/* Swiper pagination color */
.swiper-pagination-bullet-active {
    background: var(--primary) !important;
}

/* FAQ accordion - hide default marker */
details > summary {
    list-style: none;
}
details > summary::-webkit-details-marker {
    display: none;
}