@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&family=Instrument+Serif:ital@0;1&family=Jost:wght@300;400;500;600&display=swap'); 

/* =========================================
   MADANIA REDESIGN COMPONENTS
   ========================================= */

        

        

        

        /* Abstract Background Pattern */
        

        

        

        /* Hero Section Styling */
        .hero {
            display: grid;
            grid-template-columns: 1fr 1.2fr;
            gap: 4rem;
            align-items: center;
            padding: 6rem 0;
            opacity: 0;
            transform: translateY(30px);
            animation: fadeUp 1s ease forwards;
        }

        .hero-image-wrapper {
            position: relative;
            border-radius: var(--mad-radius);
            overflow: hidden;
            box-shadow: 0 20px 40px rgba(30, 122, 126, 0.15);
            aspect-ratio: 4/5;
        }

        .hero-image {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: all 0.4s ease;
        }

        .hero-image-wrapper:hover .hero-image {
            transform: scale(1.05);
        }

        .hero-badge {
            position: absolute;
            bottom: 2rem;
            right: -2rem;
            background: #ffffff;
            padding: 1rem 2rem;
            border-radius: 50px;
            box-shadow: 0 10px 30px rgba(0,0,0,0.1);
            font-family: 'Cinzel', serif;
            font-weight: 700;
            color: var(--mad-primary);
            display: flex;
            align-items: center;
            gap: 0.5rem;
            z-index: 10;
        }

        .hero-content {
            padding-right: 2rem;
        }

        .subtitle {
            text-transform: uppercase;
            letter-spacing: 3px;
            font-size: 0.85rem;
            color: var(--mad-primary);
            font-weight: 600;
            display: block;
            margin-bottom: 1rem;
            display: flex;
            align-items: center;
            gap: 10px;
        }

        .subtitle::before {
            content: '';
            width: 40px;
            height: 2px;
            background: var(--mad-primary);
            display: block;
        }

        .main-title {
            font-family: 'Cinzel', serif;
            font-size: 3.5rem;
            line-height: 1.1;
            color: var(--mad-dark);
            margin-bottom: 1.5rem;
            text-wrap: balance;
        }

        .main-title span {
            color: var(--mad-primary);
            position: relative;
        }

        .main-title span::after {
            content: '';
            position: absolute;
            width: 100%;
            height: 30%;
            bottom: 5px;
            left: 0;
            background: rgba(200, 161, 101, 0.2);
            z-index: -1;
            transform: skewX(-15deg);
        }

        .lead-text {
            font-size: 1.25rem;
            color: var(--mad-text-light);
            margin-bottom: 2rem;
            font-weight: 300;
        }

        /* Stats Grid */
        .stats-container {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 2rem;
            margin: 4rem 0;
        }

        .stat-card {
            background: #ffffff;
            padding: 2rem 1.5rem;
            border-radius: var(--mad-radius);
            box-shadow: 0 10px 30px rgba(0,0,0,0.03);
            text-align: center;
            border-top: 3px solid transparent;
            transition: all 0.4s ease;
        }

        .stat-card:hover {
            transform: translateY(-10px);
            border-color: var(--mad-primary);
            box-shadow: 0 15px 35px rgba(30, 122, 126, 0.1);
        }

        .stat-number {
            font-family: 'Cinzel', serif;
            font-size: 2.5rem;
            font-weight: 700;
            color: var(--mad-primary);
            margin-bottom: 0.5rem;
        }

        .stat-label {
            font-size: 0.9rem;
            color: var(--mad-text-light);
            text-transform: uppercase;
            letter-spacing: 1px;
            font-weight: 500;
        }

        /* Story Section */
        .content-section {
            background: #ffffff;
            border-radius: var(--mad-radius);
            padding: 5rem;
            margin-top: 2rem;
            box-shadow: 0 20px 60px rgba(0,0,0,0.02);
            position: relative;
        }

        .content-section::before {
            content: '“';
            position: absolute;
            top: 20px;
            left: 40px;
            font-family: 'Cinzel', serif;
            font-size: 8rem;
            color: rgba(200, 161, 101, 0.2);
            line-height: 1;
        }

        .two-col-text {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 4rem;
        }

        .text-block p {
            margin-bottom: 1.5rem;
            color: var(--mad-text-light);
            font-size: 1.1rem;
        }

        .text-block p:first-of-type {
            font-weight: 500;
            color: var(--mad-dark);
            font-size: 1.25rem;
        }

        /* Amenities Tags */
        .amenities {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            margin-top: 2rem;
        }

        .amenities span {
            background: rgba(30, 122, 126, 0.08);
            color: var(--mad-primary);
            padding: 8px 16px;
            border-radius: 30px;
            font-size: 0.85rem;
            font-weight: 600;
            transition: all 0.4s ease;
        }

        .amenities span:hover {
            background: var(--mad-primary);
            color: #ffffff;
        }

        /* Animations */
        @keyframes fadeUp {
            from { opacity: 0; transform: translateY(40px); }
            to { opacity: 1; transform: translateY(0); }
        }

        .stagger-1 { animation-delay: 0.2s; }
        .stagger-2 { animation-delay: 0.4s; }
        .stagger-3 { animation-delay: 0.6s; }

        /* Responsive Design */
        @media (max-width: 1024px) {
            .hero {
                grid-template-columns: 1fr;
            }
            .hero-image-wrapper {
                max-width: 600px;
                margin: 0 auto;
                order: -1;
            }
            .two-col-text {
                grid-template-columns: 1fr;
                gap: 2rem;
            }
            .content-section {
                padding: 3rem;
            }
            .main-title {
                font-size: 2.8rem;
            }
            .lead-text { font-size: 1.2rem; }
            .text-block p:first-of-type { font-size: 1.15rem; }
        }

        @media (max-width: 768px) {
            .stats-container {
                grid-template-columns: 1fr;
            }
            .stat-number { font-size: 1.8rem; }
            .main-title {
                font-size: 2.22rem;
            }
            .lead-text { font-size: 1.1rem; }
            .text-block p:first-of-type { font-size: 1.1rem; }
            .hero-badge {
                right: 50%;
                transform: translateX(50%);
                white-space: nowrap;
            }
        }
    

/* Timeline Styling - GUARENTEED VISIBILITY */
        .timeline {
            position: relative;
            padding: 4rem 0;
            margin-bottom: 4rem;
        }

        /* The Vertical Line */
        .timeline::after {
            content: '';
            position: absolute;
            width: 4px;
            background: linear-gradient(to bottom, var(--mad-gold), var(--mad-primary), var(--mad-gold));
            top: 0; bottom: 0; left: 50%;
            margin-left: -2px;
            border-radius: 5px;
            z-index: 1;
        }

        .timeline-item {
            padding: 2rem 0;
            position: relative;
            width: 50%;
            opacity: 1 !important; /* Forces visibility */
            visibility: visible !important;
            transition: all 0.4s ease;
        }

        .timeline-item:nth-child(even) { left: 50%; padding-left: 60px; }
        .timeline-item:nth-child(odd) { left: 0; padding-right: 60px; text-align: right; }

        /* Marker Circle */
        .timeline-marker {
            position: absolute;
            width: 20px; height: 20px;
            right: -10px; top: 50%;
            transform: translateY(-50%);
            background: #fcf8f2;
            border: 5px solid var(--mad-primary);
            border-radius: 50%;
            z-index: 10;
            transition: all 0.4s ease;
        }

        .timeline-item:nth-child(even) .timeline-marker { left: -10px; }

        .timeline-item:hover .timeline-marker {
            background: var(--mad-gold);
            border-color: var(--mad-gold);
            transform: translateY(-50%) scale(1.4);
        }

        /* Content Card */
        .timeline-content {
            background: #ffffff;
            padding: 2.5rem;
            border-radius: var(--mad-radius);
            box-shadow: 0 10px 40px rgba(0,0,0,0.04);
            position: relative;
            transition: all 0.4s ease;
            border: 1px solid rgba(200, 161, 101, 0.1);
        }

        .timeline-item:hover .timeline-content {
            transform: translateY(-8px);
            box-shadow: 0 20px 60px rgba(30, 122, 126, 0.12);
            border-color: var(--mad-gold);
        }

        .year-tag {
            font-family: 'Cinzel', serif;
            color: var(--mad-gold);
            font-size: 1.6rem;
            font-weight: 700;
            margin-bottom: 0.5rem;
            display: block;
        }

        .timeline-content h3 {
            font-family: 'Cinzel', serif;
            font-size: 1.3rem;
            color: var(--accent);
            margin-bottom: 1rem;
        }

        .timeline-content p {
            font-size: 1.05rem;
            color: var(--mad-text-light);
            line-height: 1.7;
        }

        /* Incident Fire Highlight */
        .incident-fire { border-left: 6px solid #d94e4e !important; }
        .timeline-item:nth-child(odd).incident-fire { border-left: none !important; border-right: 6px solid #d94e4e !important; }
        .incident-fire .year-tag { color: #d94e4e; }

        /* Curriculum Section */
        .curriculum-section {
            margin-top: 6rem;
            background: #ffffff;
            border-radius: var(--mad-radius);
            padding: 5rem;
            box-shadow: 0 30px 90px rgba(0,0,0,0.04);
            text-align: center;
            border: 1px solid rgba(200, 161, 101, 0.1);
        }

        .gender-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 4rem;
            margin-top: 3.5rem;
            text-align: left;
        }

        .gender-card h4 {
            font-family: 'Cinzel', serif;
            color: var(--mad-primary);
            font-size: 1.8rem;
            margin-bottom: 1.5rem;
            display: flex;
            align-items: center;
            gap: 20px;
        }

        .gender-card h4::after {
            content: ''; flex: 1; height: 1px; background: var(--mad-gold); opacity: 0.4;
        }

        .course-list { list-style: none; }
        .course-list li {
            padding: 12px 0;
            border-bottom: 1px solid rgba(0,0,0,0.06);
            display: flex; align-items: center; gap: 12px;
            color: var(--mad-text-light);
            font-size: 1.1rem;
        }
        .course-list li::before { content: '✓'; color: var(--mad-primary); font-weight: bold; }

        

 /* ===== MADANIA-RESTORE-V1 (re-skin by Claude) ===== */ h1,h2,h3,h4,h5,h6,.elementor-heading-title,.elementor-widget-heading .elementor-heading-title{font-family:'Cormorant Garamond','Instrument Serif',Georgia,serif!important;font-weight:600!important;letter-spacing:.3px!important} h1{line-height:1.07!important} body,p,li,.elementor-widget-text-editor,.elementor-nav-menu,.elementor-nav-menu a,.elementor-button,input,button,select,textarea{font-family:'Jost',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif!important} body{color:#1d1d1d} .elementor-widget-text-editor{line-height:1.85} .elementor-widget-text-editor p{margin-bottom:1.1em} .elementor-widget-text-editor a,.entry-content a{color:#1B4D3E;text-decoration:underline;text-underline-offset:3px} .elementor-widget-text-editor a:hover{color:#B5952F} .elementor-widget-text-editor ul{list-style:none;padding-left:0} .elementor-widget-text-editor ul li{position:relative;padding-left:1.5em;margin-bottom:.5em} .elementor-widget-text-editor ul li:before{content:'';position:absolute;left:0;top:.62em;width:7px;height:7px;background:#D4AF37;border-radius:50%} .elementor-button,a.elementor-button,.wp-block-button__link{border-radius:50px!important;font-weight:500!important;letter-spacing:.4px!important;padding:14px 34px!important;transition:all .25s ease!important} .site-header img,header img,a[rel=home] img{max-height:78px!important;height:auto!important;width:auto!important} /* ===== MADANIA-MOBILE-MENU-FIX (Claude): one tap shows all items ===== */ .madania-nav-container.is-open .sub-menu{display:block !important;position:static !important;opacity:1 !important;visibility:visible !important;max-height:none !important;transform:none !important;box-shadow:none !important;background:transparent !important;border:0 !important;padding-left:1.1rem !important;} .madania-nav-container.is-open .sub-menu .sub-menu{padding-left:1rem !important;} .madania-nav-container.is-open .sub-menu-toggle{display:none !important;} .madania-nav-container.is-open .sub-menu a{font-size:.95rem !important;opacity:.9;} .madania-hamburger.is-active{background:transparent !important;} .madania-hamburger.is-active span,.madania-hamburger.is-active .bar{background:#1B4D3E !important;} /* prayer iqamah line (Claude) */ .mad-prayer__iqama{font-size:.78rem;color:#B5952F;margin-top:.35rem;font-weight:600;letter-spacing:.4px;text-transform:uppercase;} /* ===== MADANIA-CLOSER-V1 (Claude) ===== */ .mad-hero h1,.mds-hero h1,.mad-phero h1,.mds-pagehead h1{font-family:'Instrument Serif','Cormorant Garamond',Georgia,serif!important;font-weight:400!important;letter-spacing:.5px!important;} .mad-hero{background-color:transparent!important;background-blend-mode:normal!important;} .mad-hero::before{content:''!important;position:absolute!important;inset:0!important;background:linear-gradient(rgba(17,50,40,.40),rgba(17,50,40,.66))!important;z-index:0!important;} .mad-hero__inner{position:relative!important;z-index:1!important;} /* category tiles (Claude) */ .mad-tiles-section{padding:3.5rem 0 1rem} .mad-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem} .mad-tile{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:300px;border-radius:8px;overflow:hidden;background-size:cover;background-position:center;text-decoration:none;box-shadow:0 10px 30px rgba(0,0,0,.12)} .mad-tile::after{content:'';position:absolute;inset:0;background:linear-gradient(rgba(17,50,40,.34),rgba(17,50,40,.82));transition:all .3s ease} .mad-tile:hover::after{background:linear-gradient(rgba(27,77,62,.3),rgba(17,50,40,.86))} .mad-tile__label{position:relative;z-index:1;color:#fff;font-family:'Instrument Serif','Cormorant Garamond',serif;font-size:2.1rem;line-height:1.1;padding:0 1.6rem} .mad-tile__more{position:relative;z-index:1;color:#D4AF37;font-family:'Jost',sans-serif;font-weight:600;letter-spacing:1px;text-transform:uppercase;font-size:.8rem;padding:.5rem 1.6rem 1.6rem} @media(max-width:860px){.mad-tiles{grid-template-columns:1fr}.mad-tile{min-height:220px}}
/* ===== MADANIA-MOBILE-HARDEN-V1 (Claude) ===== */
@media (max-width:900px){html,body{overflow-x:hidden!important;max-width:100%!important}img,svg,video,iframe,embed,object{max-width:100%!important;height:auto}iframe{width:100%!important}table{display:block;width:100%!important;max-width:100%!important;overflow-x:auto}.mad-container,.mad-section,.entry-content,.page-content{padding-left:16px!important;padding-right:16px!important}}
@media (max-width:820px){.mad-container{grid-template-columns:1fr!important;display:block!important}}
@media (max-width:768px){.mad-hero h1,.mds-hero h1,.mad-phero h1,.mds-pagehead h1{font-size:2rem!important;line-height:1.15!important;letter-spacing:0!important}.mad-hero p,.mds-hero p{font-size:1rem!important}h2{font-size:1.6rem!important}.mad-prayer{grid-template-columns:repeat(2,1fr)!important;gap:.6rem!important}.mad-prayer__item{padding:.7rem .5rem!important}.mad-tiles,.mad-prog-grid,.mad-news-grid,.mad-quick{grid-template-columns:1fr!important}.mad-tile{min-height:220px!important}}
@media (max-width:480px){.mad-hero h1,.mds-hero h1{font-size:1.7rem!important}}

/* ===== MADANIA-GALLERY-V1 (Claude) ===== */
.mad-gallery__intro{max-width:780px;margin:0 auto 2rem;text-align:center;font-size:1.05rem;color:#4a5a52}
.mad-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;max-width:1200px;margin:0 auto 3rem}
.mad-gallery__item{margin:0;overflow:hidden;border-radius:8px;aspect-ratio:4/3;background:#0e2a22;box-shadow:0 2px 10px rgba(0,0,0,.12)}
.mad-gallery__item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .45s ease}
.mad-gallery__item:hover img{transform:scale(1.07)}
@media(max-width:768px){.mad-gallery{grid-template-columns:repeat(2,1fr);gap:10px}}
@media(max-width:480px){.mad-gallery{grid-template-columns:1fr}}

/* cachebust 1782850208141 */

/* MADANIA-FIX-QUOTE: remove garbled decorative quote watermark */
.content-section::before,.content-section::after{content:none !important;}

/* MADANIA-MDS-SIDEBAR (Claude) */
.mds-container{max-width:1180px;margin:0 auto;padding:0 20px}
.mds-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:2.6rem;align-items:start}
.mds-side{margin-top:0 !important;position:sticky;top:100px}
.mds-widget{background:#fff;border:1px solid #eae6dd;border-radius:12px;padding:1.5rem 1.6rem;margin-bottom:1.6rem;box-shadow:0 3px 14px rgba(17,50,40,.06)}
.mds-widget h4{margin:0 0 1rem;font-family:'Cormorant Garamond',Georgia,serif;font-size:1.4rem;font-weight:700;color:#1B4D3E;border-bottom:2px solid #D4AF37;padding-bottom:.55rem}
.mds-widget ul{list-style:none;margin:0;padding:0}
.mds-widget li a{display:block;padding:.55rem 0;color:#333;text-decoration:none;border-bottom:1px solid #f1f1f1;transition:color .2s ease,padding-left .2s ease}
.mds-widget li a:hover{color:#B5952F;padding-left:.4rem}
.mds-widget li:last-child a{border-bottom:none}
.mds-widget--cta{background:#1B4D3E;color:#fff;text-align:center;border-color:#1B4D3E}
.mds-widget--cta h4{color:#fff;border-color:rgba(212,175,55,.6)}
.mds-widget--cta p{color:rgba(255,255,255,.9);font-size:.95rem;margin:.4rem 0 1rem}
.mds-btn,.mds-btn--light{display:inline-block;background:#D4AF37;color:#1B4D3E !important;padding:.7rem 1.7rem;border-radius:50px;font-weight:600;text-decoration:none}
.mds-btn:hover,.mds-btn--light:hover{background:#e6c34d}
@media(max-width:900px){.mds-layout{grid-template-columns:1fr;gap:2rem}.mds-side{position:static;margin-top:2rem !important}}

/* MADANIA-HIST-TIMELINE (Claude) */
.hist-intro{margin-bottom:2.5rem}
.hist-eyebrow{color:#B5952F;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;font-size:.8rem}
.hist-intro h2{font-family:'Instrument Serif','Cormorant Garamond',Georgia,serif;font-size:2.6rem;font-weight:400;color:#1B4D3E;margin:.3rem 0 1rem;line-height:1.15}
.hist-lead{font-size:1.12rem;color:#4a5a52;line-height:1.75}
.hist-intro img{width:100%;height:300px;object-fit:cover;border-radius:14px;margin-top:1.6rem;box-shadow:0 6px 22px rgba(17,50,40,.12)}
.hist-timeline{position:relative;padding-left:2.6rem;margin-top:2.4rem}
.hist-timeline::before{content:'';position:absolute;left:9px;top:6px;bottom:6px;width:2px;background:linear-gradient(180deg,#D4AF37,#1B4D3E)}
.hist-item{position:relative;margin-bottom:1.8rem}
.hist-item::before{content:'';position:absolute;left:-2.6rem;top:7px;width:20px;height:20px;border-radius:50%;background:#D4AF37;border:3px solid #fff;box-shadow:0 0 0 2px #D4AF37}
.hist-card{background:#fff;border:1px solid #eae6dd;border-radius:12px;padding:1.3rem 1.5rem;box-shadow:0 3px 14px rgba(17,50,40,.05);transition:transform .2s ease,box-shadow .2s ease}
.hist-card:hover{transform:translateX(4px);box-shadow:0 6px 20px rgba(17,50,40,.1)}
.hist-year{display:inline-block;background:#1B4D3E;color:#D4AF37;font-weight:700;padding:.22rem .85rem;border-radius:50px;font-size:.82rem;letter-spacing:.5px;margin-bottom:.5rem}
.hist-card h3{margin:.35rem 0 .5rem;font-family:'Cormorant Garamond',Georgia,serif;font-size:1.42rem;font-weight:700;color:#1B4D3E}
.hist-card p{margin:0;color:#4a5a52;line-height:1.65}
@media(max-width:600px){.hist-intro h2{font-size:2.05rem}.hist-intro img{height:210px}.hist-timeline{padding-left:2.1rem}.hist-item::before{left:-2.1rem;width:16px;height:16px}}

/* MADANIA-ABOUT-GRID (Claude) */
.mad-about-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem;margin-top:1.4rem}
@media(max-width:768px){.mad-about-grid{grid-template-columns:1fr}}

/* MADANIA-SIDEBAR-UNIVERSAL (Claude) */
.mds-layout{display:block}
:has(> .mds-side){display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:0 2.4rem;align-items:start}
:has(> .mds-side) > .mds-side{grid-column:2;grid-row:1 / span 99}
:has(> .mds-side) > :not(.mds-side){grid-column:1}
@media(max-width:900px){:has(> .mds-side){display:block}}