/* slider */
/* ----------------------------------------------------
   1. MAIN CONTAINER (FULL SCREEN SAFE)
---------------------------------------------------- */
.rj-focus-container {
    position: relative;
    width: 100%;
    height: 100vh;
    min-height: 600px;
    overflow: hidden;
    background: #1a0505;
}

/* ----------------------------------------------------
   2. SLIDE BASE
---------------------------------------------------- */
.rj-focus-slide {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    opacity: 0;
    will-change: transform, opacity, filter;
    animation: rjEtherealAscend 18s infinite ease-in-out;
}

/* ----------------------------------------------------
   3. IMAGES & TIMING
---------------------------------------------------- */
.rj-img-1 {
    background-image: url('https://rajgopalmandir.in/wp-content/uploads/2025/12/Untitled-design-41.png');
    animation-delay: 0s;
}

.rj-img-2 {
    background-image: url('https://rajgopalmandir.in/wp-content/uploads/2025/12/Untitled-design-42.png');
    animation-delay: 6s;
}

.rj-img-3 {
    background-image: url('https://rajgopalmandir.in/wp-content/uploads/2025/12/Untitled-design-43.png');
    animation-delay: 12s;
}

/* ----------------------------------------------------
   4. CINEMATIC OVERLAYS
---------------------------------------------------- */
.rj-focus-overlay {
    position: absolute;
    inset: 0;
    z-index: 3;
    background: radial-gradient(
        circle at center,
        transparent 35%,
        rgba(0,0,0,0.65) 100%
    );
    pointer-events: none;
}

.rj-focus-light {
    position: absolute;
    inset: 0;
    z-index: 2;
    background: radial-gradient(
        circle at center,
        rgba(255,255,255,0.08) 0%,
        rgba(255,255,255,0.03) 30%,
        transparent 65%
    );
    animation: rjLightPulse 6s infinite alternate ease-in-out;
    pointer-events: none;
}

/* ----------------------------------------------------
   5. SLIDE TRANSITION ANIMATION
---------------------------------------------------- */
@keyframes rjEtherealAscend {
    0% {
        opacity: 0;
        transform: scale(1.03) translateY(14px);
        filter: brightness(0.85) blur(2px);
    }

    8% {
        opacity: 1;
        transform: scale(1.03) translateY(0);
        filter: brightness(0.95) blur(0);
    }

    30% {
        opacity: 1;
        transform: scale(1.08) translateY(-8px);
        filter: brightness(1.05);
    }

    45% {
        opacity: 0;
        transform: scale(1.12) translateY(-16px);
        filter: brightness(1.15) blur(1.5px);
    }

    100% {
        opacity: 0;
        transform: scale(1.12) translateY(-16px);
        filter: brightness(1.15) blur(1.5px);
    }
}

/* ----------------------------------------------------
   6. LIGHT BREATHING EFFECT
---------------------------------------------------- */
@keyframes rjLightPulse {
    from { opacity: 0.3; }
    to   { opacity: 0.7; }
}

/* ----------------------------------------------------
   7. MOBILE OPTIMIZATION
---------------------------------------------------- */
@media (max-width: 768px) {
    .rj-focus-container {
        height: 80vh;
        min-height: 500px;
    }
}





/* PREFIX: tjr_iso_ 
     THEME: Divine Light (White Background) ganeshay namah
    */

    /* Main Container */
    .tjr_iso_header {
        position: relative;
        z-index: 99;
        text-align: center;
        padding: 50px 20px;
        max-width: 900px;
        margin: 0 auto;
        font-family: 'Mukta', sans-serif;
        background-color: transparent; 
    }

    /* Image Wrapper */
    .tjr_iso_img_wrap {
        text-align: center;
        margin-bottom: 15px;
        display: block;
    }

    /* The Ganpati Icon */
    .tjr_iso_icon {
        width: 90px !important;
        height: 90px !important;
        border-radius: 50% !important;
        border: 2px solid #DAA520 !important; 
        box-shadow: 0 4px 10px rgba(139, 69, 19, 0.2) !important; 
        object-fit: cover !important;
        display: inline-block !important;
        margin: 0 auto !important;
        padding: 0 !important;
        background: #fff !important;
    }

    /* "Shri Ganeshay Namah" Script */
    .tjr_iso_script {
        display: block;
        font-family: 'Psinyon Script', cursive !important;
        font-size: 2.2rem !important;
        color: #700808 !important; /* Antique Gold */
        margin: 0 0 5px 0 !important;
        line-height: 1.2;
        font-weight: 500 !important;
    }

    /* Main Title H1 */
    .tjr_iso_h1 {
        font-family: 'Cinzel', serif !important;
        font-weight: 800 !important;
        font-size: clamp(1.1rem, 5vw, 3.8rem) !important;
        color: #B8860B !important; /* Deep Maroon */
        text-transform: uppercase !important;
        letter-spacing: 1px !important;
        line-height: 1.1 !important;
        margin: 5px 0 20px 0 !important;
        padding-bottom: 20px !important;
        border-bottom: 2px solid rgba(184, 134, 11, 0.3);
        display: inline-block;
    }

    /* Subtitle / Location */
    .tjr_iso_sub {
        font-family: 'Mukta', sans-serif !important;
        font-size: 1.15rem !important;
        color: #5D4037 !important; /* Warm Brown */
        text-transform: uppercase !important;
        letter-spacing: 3px !important;
        font-weight: 700 !important;
        margin-top: 5px !important;
    }

    /* --- NEW BUTTON STYLES --- */
    .tjr_iso_btn {
        display: inline-block !important;
        margin-top: 35px !important;
        padding: 14px 42px !important;
        
        /* Deep Maroon Background */
        background-color: #700808 !important;
        
        /* Gold Text */
        color: #FFD700 !important;
        
        font-family: 'Cinzel', serif !important;
        font-weight: 700 !important;
        text-transform: uppercase !important;
        letter-spacing: 1.5px !important;
        text-decoration: none !important;
        border-radius: 50px !important;
        border: 2px solid #700808 !important;
        transition: all 0.3s ease !important;
        box-shadow: 0 5px 15px rgba(112, 8, 8, 0.2) !important;
    }

    .tjr_iso_btn:hover {
        /* On Hover: White Background, Maroon Text */
        background-color: transparent !important;
        color: #700808 !important;
        border-color: #700808 !important;
        transform: translateY(-2px);
        box-shadow: 0 8px 20px rgba(112, 8, 8, 0.3) !important;
    }


/* 
HOME SECTIONS */

    /* --- SCOPED WRAPPER (Royal Chronicle Extended) --- */
    #rj-home-wrapper {
        font-family: 'Mukta', sans-serif;
        color: #333;
        background-color: #fffbf5; /* Royal Parchment */
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        overflow-x: hidden;
        line-height: 1.9;
    }
    #rj-home-wrapper * { box-sizing: border-box; }

    /* PALETTE */
    :root {
        --rj-maroon: #5E0B0B;
        --rj-gold: #C5A059;
        --rj-gold-light: #e6dac8;
        --rj-cream: #FFF9F0;
    }

    /* TYPOGRAPHY */
    h2, h3 { 
        font-family: 'Cinzel', serif; 
        color: var(--rj-maroon); 
        margin-top: 0;
        line-height: 1.3;
        letter-spacing: 0.5px;
    }
    
    .rj-script {
        font-family: 'Cormorant Garamond', cursive;
        color: var(--rj-gold);
        font-size: 2.2rem;
        display: block;
        margin-bottom: 10px;
        line-height: 1;
    }

    .rj-section-title {
        font-size: 2.2rem;
        font-weight: 700;
        margin-bottom: 25px;
        position: relative;
        display: inline-block;
    }
    
    .rj-text {
        font-size: 1.1rem;
        color: #555;
        text-align: justify;
        margin-bottom: 20px;
    }

    /* --- 1. HEADER (Simple & Divine) --- */
    .rj-header-simple {
        text-align: center;
        padding: 70px 20px 50px 20px;
        border-bottom: 1px solid var(--rj-gold-light);
        background: #fff;
        background-image: radial-gradient(circle at center, #fffbf5 0%, #fff 70%);
    }
    .rj-ganpati-icon {
        width: 90px; height: 90px; border-radius: 50% !important;
        box-shadow: 0 0 0 4px var(--rj-gold), 0 10px 20px rgba(0,0,0,0.1) !important; 
        padding: 4px; margin-bottom: 20px; background: #fff !important;
    }
    .rj-main-h1 {
        font-size: clamp(2.2rem, 5vw, 3.5rem);
        color: var(--rj-maroon);
        font-weight: 800;
        margin-bottom: 10px;
        text-transform: uppercase;
        letter-spacing: 2px;
        text-shadow: 0 2px 10px rgba(94, 11, 11, 0.1);
    }
    .rj-sub-h1 {
        font-size: 1.1rem; letter-spacing: 4px; color: #888;
        text-transform: uppercase; font-weight: 600;
    }

    /* --- LAYOUT UTILITIES --- */
    .rj-section { padding: 35px 20px; }
    .rj-bg-white { background-color: #ffffff; border-top: 1px solid #f4efe6; border-bottom: 1px solid #f4efe6; }
    .rj-container { max-width: 1100px; margin: 0 auto; }

    /* ZIG-ZAG LAYOUT */
    .rj-split {
        display: flex;
        align-items: center;
        gap: 70px;
    }
    .rj-split.reverse { flex-direction: row-reverse; }

    .rj-col-text { flex: 1; min-width: 300px; }
    .rj-col-img { flex: 1; min-width: 300px; display: flex; justify-content: center; }

    /* --- IMAGE STYLING (Soft & Framed) --- */
    .rj-framed-img {
        width: 100% !important;
        max-width: 480px !important; /* Constrained Size */
        height: auto !important;
        border-radius: 16px !important;
        display: block !important;
        /* Double Border Effect */
        box-shadow: 
            0 0 0 6px #fff,  
            0 0 0 9px var(--rj-gold), 
            0 20px 40px rgba(94, 11, 11, 0.15) !important;
        transition: all 0.4s ease-in-out !important;
    }
    .rj-framed-img:hover {
        transform: translateY(-8px);
        box-shadow: 
            0 0 0 6px #fff, 
            0 0 0 9px var(--rj-gold), 
            0 30px 60px rgba(94, 11, 11, 0.25);
    }

    /* --- DONATION SECTION --- */
    .rj-donate-section {
        background-color: var(--rj-maroon);
        background-image: url('https://www.transparenttextures.com/patterns/black-linen.png');
        color: #fff;
        padding: 100px 20px;
        text-align: center;
        margin-top: 50px;
        border-top: 5px solid var(--rj-gold);
    }
    .rj-donate-card {
        background: rgba(255,255,255,0.08);
        border: 1px solid rgba(197, 160, 89, 0.5);
        max-width: 700px;
        margin: 40px auto;
        padding: 50px;
        border-radius: 16px;
        backdrop-filter: blur(5px);
    }
    .rj-bank-row {
        display: flex; justify-content: space-between;
        padding: 15px 0; border-bottom: 1px dashed rgba(255,255,255,0.15);
        font-size: 1.1rem;
    }
    .rj-bank-row:last-child { border-bottom: none; }
    .rj-val { color: #FFD700; font-weight: 700; letter-spacing: 0.5px; }

    .rj-donate-btn {
        display: inline-block;
        background: linear-gradient(to bottom, #FFD700, #E5C100);
        color: #5C0A0A !important;
        font-family: 'Cinzel', serif; font-weight: 800;
        padding: 18px 50px; border-radius: 50px;
        text-decoration: none !important; text-transform: uppercase; letter-spacing: 1px;
        margin-top: 40px; box-shadow: 0 10px 30px rgba(255, 215, 0, 0.3);
        transition: all 0.3s ease;
    }
    .rj-donate-btn:hover { transform: translateY(-3px); box-shadow: 0 15px 40px rgba(255, 215, 0, 0.5); background: #fff; }

    /* --- GALLERY GRID (4 COLUMNS) --- */
    .rj-gallery-grid {
        display: grid;
        /* Forced 4 Columns */
        grid-template-columns: repeat(4, 1fr); 
        gap: 20px;
        margin-top: 50px;
    }
    .rj-gallery-item {
        border-radius: 12px;
        overflow: hidden;
        box-shadow: 0 10px 25px rgba(0,0,0,0.1);
        border: 4px solid #fff;
        transition: all 0.4s ease;
    }
    .rj-gallery-item img {
        width: 100%; height: 220px; object-fit: cover;
        display: block;
        transition: transform 0.5s ease;
    }
    .rj-gallery-item:hover { transform: translateY(-5px); border-color: var(--rj-gold); }
    .rj-gallery-item:hover img { transform: scale(1.05); }

    /* RESPONSIVE */
    @media (max-width: 900px) {
        .rj-split, .rj-split.reverse { flex-direction: column; gap: 40px; }
        .rj-gallery-grid { grid-template-columns: repeat(2, 1fr); } /* 2 Col on tablet */
        .rj-bank-row { flex-direction: column; text-align: center; gap: 8px; }
    }
    @media (max-width: 500px) {
        .rj-gallery-grid { grid-template-columns: 1fr; } /* 1 Col on mobile */
    }


    /* --- SCOPED WRAPPER (Royal Chronicle Extended) --- */
    #rj-home-wrapper {
        font-family: 'Mukta', sans-serif;
        color: #333;
        background-color: #fffbf5; /* Royal Parchment */
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        overflow-x: hidden;
        line-height: 1.9;
    }
    #rj-home-wrapper * { box-sizing: border-box; }

    
    /* PALETTE */
    :root {
        --rj-maroon: #5E0B0B;
        --rj-gold: #C5A059;
        --rj-gold-light: #e6dac8;
        --rj-cream: #FFF9F0;
    }

    /* TYPOGRAPHY */
    h2, h3 { 
        font-family: 'Cinzel', serif; 
        color: var(--rj-maroon); 
        margin-top: 0;
        line-height: 1.3;
        letter-spacing: 0.5px;
    }
    
    .rj-script {
        font-family: 'Cormorant Garamond', cursive;
        color: var(--rj-gold);
        font-size: 2.2rem;
        display: block;
        margin-bottom: 10px;
        line-height: 1;
    }

    .rj-section-title {
        font-size: 2.2rem;
        font-weight: 700;
        margin-bottom: 25px;
        position: relative;
        display: inline-block;
    }
    
    .rj-text {
        font-size: 1.1rem;
        color: #555;
        text-align: justify;
        margin-bottom: 20px;
    }

    /* --- 1. HEADER (Simple & Divine) --- */
    .rj-header-simple {
        text-align: center;
        padding: 70px 20px 50px 20px;
        border-bottom: 1px solid var(--rj-gold-light);
        background: #fff;
        background-image: radial-gradient(circle at center, #fffbf5 0%, #fff 70%);
    }
    .rj-ganpati-icon {
        width: 90px; height: 90px; border-radius: 50% !important;
        box-shadow: 0 0 0 4px var(--rj-gold), 0 10px 20px rgba(0,0,0,0.1) !important; 
        padding: 4px; margin-bottom: 20px; background: #fff !important;
    }
    .rj-main-h1 {
        font-size: clamp(2.2rem, 5vw, 3.5rem);
        color: var(--rj-maroon);
        font-weight: 800;
        margin-bottom: 10px;
        text-transform: uppercase;
        letter-spacing: 2px;
        text-shadow: 0 2px 10px rgba(94, 11, 11, 0.1);
    }
    .rj-sub-h1 {
        font-size: 1.1rem; letter-spacing: 4px; color: #888;
        text-transform: uppercase; font-weight: 600;
    }

    /* --- LAYOUT UTILITIES --- */
    .rj-section { padding: 35px 20px; }
    .rj-bg-white { background-color: #ffffff; border-top: 1px solid #f4efe6; border-bottom: 1px solid #f4efe6; }
    .rj-container { max-width: 1100px; margin: 0 auto; }

    /* ZIG-ZAG LAYOUT */
    .rj-split {
        display: flex;
        align-items: center;
        gap: 70px;
    }
    .rj-split.reverse { flex-direction: row-reverse; }

    .rj-col-text { flex: 1; min-width: 300px; }
    .rj-col-img { flex: 1; min-width: 300px; display: flex; justify-content: center; }

    /* --- IMAGE STYLING (Soft & Framed) --- */
    .rj-framed-img {
        width: 100% !important;
        max-width: 480px !important; /* Constrained Size */
        height: auto !important;
        border-radius: 16px !important;
        display: block !important;
        /* Double Border Effect */
        box-shadow: 
            0 0 0 6px #fff,  
            0 0 0 9px var(--rj-gold), 
            0 20px 40px rgba(94, 11, 11, 0.15) !important;
        transition: all 0.4s ease-in-out !important;
    }
    .rj-framed-img:hover {
        transform: translateY(-8px);
        box-shadow: 
            0 0 0 6px #fff, 
            0 0 0 9px var(--rj-gold), 
            0 30px 60px rgba(94, 11, 11, 0.25);
    }

    /* --- DONATION SECTION --- */
    .rj-donate-section {
        background-color: var(--rj-maroon);
        background-image: url('https://www.transparenttextures.com/patterns/black-linen.png');
        color: #fff;
        padding: 100px 20px;
        text-align: center;
        margin-top: 50px;
        border-top: 5px solid var(--rj-gold);
    }
    .rj-donate-card {
        background: rgba(255,255,255,0.08);
        border: 1px solid rgba(197, 160, 89, 0.5);
        max-width: 700px;
        margin: 40px auto;
        padding: 50px;
        border-radius: 16px;
        backdrop-filter: blur(5px);
    }
    .rj-bank-row {
        display: flex; justify-content: space-between;
        padding: 15px 0; border-bottom: 1px dashed rgba(255,255,255,0.15);
        font-size: 1.1rem;
    }
    .rj-bank-row:last-child { border-bottom: none; }
    .rj-val { color: #FFD700; font-weight: 700; letter-spacing: 0.5px; }

    .rj-donate-btn {
        display: inline-block;
        background: linear-gradient(to bottom, #FFD700, #E5C100);
        color: #5C0A0A !important;
        font-family: 'Cinzel', serif; font-weight: 800;
        padding: 18px 50px; border-radius: 50px;
        text-decoration: none !important; text-transform: uppercase; letter-spacing: 1px;
        margin-top: 40px; box-shadow: 0 10px 30px rgba(255, 215, 0, 0.3);
        transition: all 0.3s ease;
    }
    .rj-donate-btn:hover { transform: translateY(-3px); box-shadow: 0 15px 40px rgba(255, 215, 0, 0.5); background: #fff; }

    /* --- GALLERY GRID (4 COLUMNS) --- */
    .rj-gallery-grid {
        display: grid;
        /* Forced 4 Columns */
        grid-template-columns: repeat(4, 1fr); 
        gap: 20px;
        margin-top: 50px;
    }
    .rj-gallery-item {
        border-radius: 12px;
        overflow: hidden;
        box-shadow: 0 10px 25px rgba(0,0,0,0.1);
        border: 4px solid #fff;
        transition: all 0.4s ease;
    }
    .rj-gallery-item img {
        width: 100%; height: 220px; object-fit: cover;
        display: block;
        transition: transform 0.5s ease;
    }
    .rj-gallery-item:hover { transform: translateY(-5px); border-color: var(--rj-gold); }
    .rj-gallery-item:hover img { transform: scale(1.05); }

    /* RESPONSIVE */
    @media (max-width: 900px) {
        .rj-split, .rj-split.reverse { flex-direction: column; gap: 40px; }
        .rj-gallery-grid { grid-template-columns: repeat(2, 1fr); } /* 2 Col on tablet */
        .rj-bank-row { flex-direction: column; text-align: center; gap: 8px; }
    }
    @media (max-width: 500px) {
        .rj-gallery-grid { grid-template-columns: 1fr; } /* 1 Col on mobile */
    }


/* 1. Hide the banner frame itself */
.goog-te-banner-frame.skiptranslate,
.goog-te-banner-frame,
.skiptranslate > iframe {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    width: 0 !important;
}

/* 2. Prevent Google from shifting your site content down */
body {
    top: 0px !important;
    position: static !important;
}

/* 3. Hide the blue 'Highlighter' tooltip when hovering over translated text */
#goog-gt-tt, 
.goog-te-balloon-frame,
.VIpgJd-yAWNEb-VIpgJd-fmcmS-sn54Q {
    display: none !important;
    pointer-events: none !important; /* Allows clicks to pass through hidden layers */
}