/*
Theme Name: Grambangla Foundation
Theme URI: https://grambangla.org
Author: Grambangla Team
Author URI: https://grambangla.org
Description: A premium, modern, mobile-first WordPress theme specifically designed for Grambangla Unnayan Foundation, Cumilla. Features a custom Tailwind CSS integration and high-end glassmorphism design.
Version: 1.0.0
Requires at least: 5.8
Tested up to: 6.4
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: grambangla
*/

/* Note: Since we are using Tailwind CSS via CDN (or built via PostCSS later) 
for the core styling, this file is primarily used by WordPress just to 
register the theme. Any custom raw CSS can be added below if needed.
*/

html {
    scroll-behavior: smooth;
}

/* Glassmorphism Navigation (Updated to Premium Dark) */
.glass-nav {
    background: rgba(5, 11, 9, 0.95) !important;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5) !important;
}

/* Premium Hero Background */
.hero-bg {
    background: url('https://images.unsplash.com/photo-1589133887019-218a4be46261?ixlib=rb-4.0.3&auto=format&fit=crop&w=1920&q=80') center/cover no-repeat;
}

@keyframes gradientShift {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

.hero-overlay {
    background: linear-gradient(-45deg, rgba(5, 38, 30, 0.98), rgba(2, 15, 10, 0.95), rgba(10, 50, 40, 0.95), rgba(3, 25, 18, 0.98));
    background-size: 400% 400%;
    animation: gradientShift 15s ease infinite;
}

/* Premium Glass Card */
.glass-card {
    background: rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.15);
    box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.3);
    position: relative;
    overflow: hidden;
}

/* Glass Card Sweep Animation */
@keyframes glassSweep {
    0% { left: -100%; }
    20% { left: 200%; }
    100% { left: 200%; }
}
.glass-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 50%;
    height: 100%;
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.15) 50%, rgba(255,255,255,0) 100%);
    transform: skewX(-25deg);
    animation: glassSweep 6s infinite ease-in-out;
    z-index: 10;
    pointer-events: none;
}

/* Metallic Orange Text with Shimmer Animation */
@keyframes shimmerText {
    0% { background-position: -200% center; }
    100% { background-position: 200% center; }
}
.text-gold-metallic {
    background: linear-gradient(to right, #D87740, #FFE6D5, #C4622D, #FFE6D5, #A64E20);
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    text-shadow: 0px 2px 10px rgba(229, 138, 85, 0.2);
    animation: shimmerText 4s linear infinite;
}

/* Glossy Buttons */
.btn-glossy-gold {
    background: linear-gradient(135deg, #E58A55 0%, #C4622D 100%);
    border: 1px solid rgba(255, 255, 255, 0.4);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), 0 10px 20px rgba(229, 138, 85, 0.3);
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
}
.btn-glossy-gold:hover {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6), 0 15px 25px rgba(229, 138, 85, 0.5);
    transform: translateY(-2px);
}

.btn-glossy-emerald {
    background: linear-gradient(135deg, #0A4D3C 0%, #05261E 100%);
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 10px 20px rgba(10, 77, 60, 0.3);
}
.btn-glossy-emerald:hover {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 15px 25px rgba(10, 77, 60, 0.5);
    transform: translateY(-2px);
}

/* Creative Hero Background Animations */
@keyframes float {
    0%, 100% { transform: translateY(0) scale(1); }
    50% { transform: translateY(-40px) scale(1.05); }
}
@keyframes float-delayed {
    0%, 100% { transform: translateY(0) scale(1); }
    50% { transform: translateY(40px) scale(0.95); }
}
.animate-float {
    animation: float 10s ease-in-out infinite;
}
.animate-float-delayed {
    animation: float-delayed 12s ease-in-out infinite;
}