/* ========================================
   CLEAN MODERN INTERACTIONS
   Theme: Crisp, Professional, Fast
   ======================================== */

/* 1. BUTTON INTERACTIONS */
.hero-btn,
.lang-select {
    transition: all 0.2s ease-in-out;
    position: relative;
    overflow: hidden;
}

.hero-btn:active,
.lang-select:active {
    transform: translateY(1px);
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* Ripple Effect for Buttons */
.hero-btn::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    transition: width 0.3s, height 0.3s;
}

.hero-btn:hover::after {
    width: 200%;
    height: 200%;
}

/* 2. CARD HOVER EFFECTS (Stats, Members, Schemes) */
.stats-card,
.member-card,
.scheme-card-box {
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.stats-card:hover,
.member-card:hover,
.scheme-card-box:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    border-color: #D4AF37;
    /* Gold Accent on Hover */
}

/* 3. LEADER AVATAR HOVER */
.leader-img {
    transition: transform 0.3s ease, border-color 0.3s ease;
}

.leader-item:hover .leader-img {
    transform: scale(1.1);
    border-color: #800000;
    /* Maroon Accent */
}

/* 4. LOGO ROTATION (Subtle) */
@keyframes subtle-spin {
    0% {
        transform: rotate(0deg);
    }

    25% {
        transform: rotate(5deg);
    }

    75% {
        transform: rotate(-5deg);
    }

    100% {
        transform: rotate(0deg);
    }
}

.gp-logo:hover {
    animation: subtle-spin 1s ease-in-out;
}

/* 5. SMOOTH PAGE LOAD */
@keyframes fade-in-up {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.hero-section,
.stats-row,
.gp-members-home-grid,
.schemes-row {
    animation: fade-in-up 0.6s ease-out forwards;
}

.stats-row {
    animation-delay: 0.1s;
}

.gp-members-home-grid {
    animation-delay: 0.2s;
}

.schemes-row {
    animation-delay: 0.3s;
}

/* 6. SCROLLBAR STYLING */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
    /* For horizontal scroll */
}

::-webkit-scrollbar-track {
    background: #F3F4F6;
}

::-webkit-scrollbar-thumb {
    background: #D1D5DB;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #9CA3AF;
}

/* 7. UTILITY ANIMATIONS */
.animate-spin {
    animation: spin 1s linear infinite;
}

@keyframes spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

/* 8. FOCUS STATES (Accessibility) */
*:focus-visible {
    outline: 2px solid #800000;
    outline-offset: 2px;
}

/* 9. MEDIA GRID (Tourism & Videos) */
.media-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1.5rem;
    margin-top: 1.5rem;
}

.media-grid .media-img, 
.media-grid iframe {
    width: 100%;
    height: 250px;
    object-fit: cover;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
    transition: transform 0.3s ease;
}

.media-grid .media-img:hover {
    transform: scale(1.02);
}

.media-grid h3 {
    margin-top: 1rem;
    font-size: 1.1rem;
    color: #333;
    text-align: center;
}

/* ==================== Grid Responsiveness for Media (Tourism & Videos) ==================== */
@media (max-width: 992px) {
    .tourism-grid, .video-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 15px !important;
    }
}

@media (max-width: 768px) {
    .tourism-grid, .video-grid {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
        padding: 10px !important;
    }
    
    .tourism-card, .video-card {
        margin-bottom: 10px !important;
    }
    
    .tourism-card img, .video-container iframe {
        border-radius: 8px 8px 0 0 !important;
    }
    
    .video-container {
        padding-bottom: 56.25% !important; /* 16:9 ratio */
        height: 0 !important;
    }
    
    .tourism-info h3, .video-info h3 {
        font-size: 1.1rem !important;
    }
    
    .tourism-info p, .video-info p {
        font-size: 0.9rem !important;
        line-height: 1.4 !important;
    }
}

/* ============================================
   VARKHEDI BU. - SUPPLEMENTAL COMPONENT STYLES
   ============================================ */

/* Slideshow images */
.slideshow-image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    transition: opacity 1.2s ease-in-out;
}
.slideshow-image.active { opacity: 1; }

/* Fade animation */
@keyframes animFade { from { opacity:0; transform:translateY(20px); } to { opacity:1; transform:translateY(0); } }
.animate-fade { animation: animFade 0.7s ease-out forwards; }

/* Member phone */
.member-phone { font-size:0.9rem; color:#2563EB; margin-top:0.35rem; }
.member-phone a { color:#2563EB; text-decoration:none; }
.member-phone a:hover { text-decoration:underline; }

/* Member image circular (home grid) */
.gp-members-home-grid .member-img {
    width: 120px; height: 120px; border-radius: 50%;
    object-fit: cover; object-position: top;
    border: 4px solid #D4AF37;
    margin: 1.2rem auto 0.5rem; display: block;
}
.gp-members-home-grid .member-card {
    display: flex; flex-direction: column; align-items: center;
    text-align: center; padding: 1rem 0.8rem 1.4rem;
    background: white; border-radius: 16px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08);
    border: 1px solid #f0e8d0; transition: transform 0.28s ease, box-shadow 0.28s ease;
}
.gp-members-home-grid .member-card:hover { transform:translateY(-7px); box-shadow:0 14px 36px rgba(0,0,0,0.15); }

/* Scheme detail box */
.scheme-detail-box { background:white; border-radius:16px; padding:2rem; box-shadow:0 4px 20px rgba(0,0,0,0.07); border:1px solid #f0e8d0; margin-bottom:2rem; }
.scheme-detail-box h3 { color:#800000; margin-bottom:1rem; }
.scheme-detail-box h4, .detail-subtitle { color:#800000; margin:1.5rem 0 0.75rem; font-size:1.1rem; }
.detail-list { padding-left:1.5rem; display:flex; flex-direction:column; gap:0.5rem; }
.detail-list li { line-height:1.65; }
.procedure-text { margin-top:1rem; font-style:italic; color:#555; font-size:0.95rem; }
.scheme-link-external { display:inline-block; margin-top:1.5rem; padding:11px 28px; background:#800000; color:white; border-radius:8px; font-weight:600; font-size:0.95rem; transition:background 0.2s,transform 0.2s; text-decoration:none; }
.scheme-link-external:hover { background:#600000; transform:translateY(-2px); }

/* Revenue table */
.revenue-table-container { overflow-x:auto; margin-top:1rem; }
.revenue-services-table { width:100%; border-collapse:collapse; font-size:0.9rem; }
.revenue-services-table th { background:#800000; color:white; padding:10px 12px; text-align:left; white-space:nowrap; }
.revenue-services-table td { padding:9px 12px; border-bottom:1px solid #eee; }
.revenue-services-table tr:nth-child(even) td { background:#fafaf8; }
.revenue-services-table tr:hover td { background:#fffbf0; }

/* Contact cards */
.contact-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:1.8rem; margin-top:1.5rem; }
.contact-card { background:white; border-radius:16px; padding:1.8rem 1.5rem; box-shadow:0 4px 20px rgba(0,0,0,0.07); border:1px solid #f0e8d0; text-align:center; transition:transform 0.25s ease,box-shadow 0.25s ease; }
.contact-card:hover { transform:translateY(-6px); box-shadow:0 12px 32px rgba(0,0,0,0.13); }
.contact-icon { font-size:2.5rem; margin-bottom:0.7rem; display:block; }
.contact-role { color:#800000; font-size:1.1rem; font-weight:700; margin-bottom:0.8rem; }
.contact-name, .contact-mobile { font-size:0.95rem; margin:0.3rem 0; }
.contact-mobile a { color:#2563EB; text-decoration:none; }
.contact-mobile a:hover { text-decoration:underline; }
.office-address-box { padding:1.2rem; background:#fffbf0; border-radius:10px; border:1px solid #D4AF37; }

/* Emergency helpline */
.emergency-helpline-container { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:1.5rem; margin-top:1rem; }
.emergency-helpline-card { background:white; border-radius:14px; padding:1.5rem; box-shadow:0 4px 18px rgba(0,0,0,0.07); display:flex; align-items:center; gap:1.2rem; border-left:4px solid #800000; transition:transform 0.22s ease; }
.emergency-helpline-card:hover { transform:translateY(-4px); }
.emergency-icon { font-size:2.2rem; flex-shrink:0; }
.emergency-service { font-size:1rem; font-weight:700; color:#800000; margin:0 0 0.3rem; }
.emergency-number { font-size:1.5rem; font-weight:800; color:#1F2937; margin:0; }

/* Certificates grid */
.certificates-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:1.8rem; margin-top:1.5rem; }
.cert-card { background:white; border-radius:16px; padding:2rem 1.5rem; box-shadow:0 4px 20px rgba(0,0,0,0.07); border:1px solid #f0e8d0; display:flex; flex-direction:column; align-items:center; gap:1.2rem; text-align:center; transition:transform 0.25s ease,box-shadow 0.25s ease; }
.cert-card:hover { transform:translateY(-6px); box-shadow:0 12px 32px rgba(0,0,0,0.13); }
.cert-title { font-size:1rem; font-weight:700; color:#800000; margin:0; }
.btn-download-outline { display:inline-block; padding:10px 24px; border:2px solid #800000; color:#800000; border-radius:8px; font-weight:700; font-size:0.9rem; cursor:pointer; transition:all 0.2s ease; text-decoration:none; }
.btn-download-outline:hover { background:#800000; color:white; transform:translateY(-2px); }
.page-container { max-width:1280px; margin:2.5rem auto; padding:0 2rem; }
.page-title { color:#800000; font-size:2rem; font-weight:800; margin-bottom:1.5rem; }

/* Gallery */
.gallery-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:1.2rem; margin-top:1.2rem; }
.gallery-card { border-radius:12px; overflow:hidden; box-shadow:0 4px 16px rgba(0,0,0,0.1); cursor:pointer; position:relative; }
.gallery-card img { width:100%; height:190px; object-fit:cover; display:block; transition:transform 0.4s ease; }
.gallery-card:hover img { transform:scale(1.08); }
.gallery-lightbox { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.92); z-index:9999; align-items:center; justify-content:center; flex-direction:column; }
.lightbox-img { max-width:90vw; max-height:85vh; border-radius:8px; object-fit:contain; }
.close-lightbox { position:fixed; top:20px; right:28px; font-size:2.8rem; color:white; cursor:pointer; line-height:1; z-index:10000; }

/* Schemes list */
.schemes-list { display:flex; flex-direction:column; gap:1rem; }
.scheme-link { display:block; background:white; padding:1.2rem 1.5rem; border-radius:12px; border-left:4px solid #800000; box-shadow:0 3px 12px rgba(0,0,0,0.06); font-size:1.05rem; font-weight:600; color:#1F2937; transition:all 0.22s ease; }
.scheme-link:hover { background:#fffbf0; transform:translateX(6px); border-left-color:#D4AF37; }

/* Main content grid - give inner sections proper padding */
.main-content-grid > div { max-width:1280px; margin:2.5rem auto; padding:0 2rem; }