/* SKBSST 2026 Custom Styles — used alongside Tailwind CDN */

@font-face {
    font-family: 'Noto Sans Gujarati';
    src: url('../fonts/NotoSansGujarati-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Noto Sans Gujarati';
    src: url('../fonts/NotoSansGujarati-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

:root {
    --navy: #1e3a5f;
    --accent-blue: #3b6eb5;
    --gold: #d4a843;
    --saffron: #f59e0b;
    --cream: #fef7e8;
    --dark-text: #1a1a2e;
    --body-text: #4a4a68;
}

html { scroll-behavior: smooth; }
body {
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
    -webkit-font-smoothing: antialiased;
    color: var(--body-text);
}

:lang(gu), .font-gujarati {
    font-family: 'Noto Sans Gujarati', 'Inter', sans-serif;
}

.font-heading {
    font-family: 'Playfair Display', Georgia, serif;
}

[x-cloak] { display: none !important; }

/* Section Divider */
.section-divider {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem 0;
    gap: 1rem;
}
.section-divider::before,
.section-divider::after {
    content: '';
    flex: 1;
    height: 1px;
}
.section-divider::before {
    background: linear-gradient(to right, transparent, rgba(212, 168, 67, 0.4));
}
.section-divider::after {
    background: linear-gradient(to right, rgba(212, 168, 67, 0.4), transparent);
}
.section-divider .diamond {
    width: 8px;
    height: 8px;
    background: var(--gold);
    transform: rotate(45deg);
    flex-shrink: 0;
}

/* Cards */
.card {
    background: white;
    border-radius: 0.75rem;
    box-shadow: 0 1px 3px rgba(0,0,0,0.08);
    overflow: hidden;
    transition: all 0.3s ease;
}
.card:hover {
    box-shadow: 0 10px 25px rgba(0,0,0,0.1);
    transform: translateY(-4px);
}

/* Portrait Frame */
.portrait-frame {
    border-radius: 9999px;
    box-shadow: 0 0 0 4px white, 0 0 0 8px rgba(212, 168, 67, 0.3);
}

/* Buttons */
.btn-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.75rem 1.5rem;
    background: var(--accent-blue);
    color: white;
    font-weight: 600;
    border-radius: 0.5rem;
    transition: background-color 0.2s;
    text-decoration: none;
}
.btn-primary:hover { background: #2a5a9e; }

.btn-gold {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.75rem 1.5rem;
    background: var(--saffron);
    color: white;
    font-weight: 600;
    border-radius: 0.5rem;
    transition: background-color 0.2s;
    text-decoration: none;
}
.btn-gold:hover { background: #d97706; }

/* Hero Slider */
.hero-slide {
    position: relative;
    background-size: cover;
    background-position: center;
    min-height: 500px;
}
.hero-slide::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(30,58,95,0.85) 0%, rgba(30,58,95,0.4) 100%);
}
.hero-slide .hero-content {
    position: relative;
    z-index: 1;
}

/* Counter Animation */
@keyframes countUp {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}
.stat-number {
    animation: countUp 0.6s ease-out forwards;
}

/* Smooth scroll reveal */
.reveal {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}
.reveal.visible {
    opacity: 1;
    transform: translateY(0);
}

/* Custom scrollbar */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #f1f1f1; }
::-webkit-scrollbar-thumb { background: var(--accent-blue); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--navy); }

/* WordPress admin bar fix */
body.admin-bar header.sticky {
    top: 32px;
}
@media screen and (max-width: 782px) {
    body.admin-bar header.sticky {
        top: 46px;
    }
}