:root {
    --glow-color: rgba(56, 189, 248, 0.3);
    --gold-glow: rgba(241, 191, 0, 0.4);
}

body {
    font-family: "Public Sans", sans-serif;
    background-color: #ffffff;
    color: #0f172a;
}

.material-symbols-outlined {
    font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 24;
}

.neo-bento-card {
    @apply bg-white border border-gray-100 transition-all duration-300 hover:border-primary/30 hover:shadow-[0_20px_40px_rgba(30, 58, 138, 0.08)];
}

.glass-panel {
    background: rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.blue-tint {
    mix-blend-mode: multiply;
    background-color: rgba(10, 132, 255, 0.2);
}

.spanish-motif {
    background-image: radial-gradient(circle at 100% 100%, rgba(245, 158, 11, 0.08) 0%, rgba(255, 255, 255, 0) 60%);
}

.glowing-btn-gold {
    box-shadow: 0 0 20px var(--gold-glow);
    border: 1px solid rgba(241, 191, 0, 0.5);
}

.glowing-btn-gold:hover {
    box-shadow: 0 0 35px var(--gold-glow);
    background-color: #f7ce3e;
}

details>summary {
    list-style: none;
}

details>summary::-webkit-details-marker {
    display: none;
}

details[open] summary .expand-icon {
    transform: rotate(180deg);
}