:root {
    --portal-ink: #17352d;
    --portal-green: #1e6b50;
    --portal-cream: #f7f5ec;
    --portal-white: #fff;
    --portal-muted: #66736e;
    --portal-line: #dde3df;
}

/* Contact page content is data-driven; keep its original presentation rules independent of the values. */
.contact-page-temp .contact-info-content p{overflow-wrap:anywhere}.contact-page-temp .contact-info-item .icon-box i{position:relative;z-index:1;display:block;width:50px;color:var(--primary-color);font-size:42px;line-height:50px;text-align:center}.contact-page-temp .map-placeholder{min-height:100%;display:flex;align-items:center;justify-content:center;padding:40px;background:linear-gradient(135deg,rgba(6,102,65,.92),rgba(6,102,65,.72)),url('/theme/lenity/images/lala-mosque-hero.png') center/cover;color:#fff;text-align:center}.contact-page-temp .map-card{max-width:360px;padding:28px;border-radius:20px;background:rgba(255,255,255,.96);color:var(--text-color);box-shadow:0 15px 35px #0003}.contact-page-temp .map-card i{color:var(--accent-color);font-size:34px}.contact-page-temp .contact-form label{display:block;margin-bottom:8px;font-weight:600}.contact-page-temp .form-group{margin-bottom:22px}.contact-page-temp textarea.form-control{min-height:150px;resize:vertical}.contact-page-temp .form-control:focus{border-color:var(--accent-color);box-shadow:0 0 0 .2rem rgba(200,155,60,.2)}.contact-page-temp .honeypot{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}html[dir=rtl] .contact-page-temp .contact-info-item .icon-box{margin-left:20px;margin-right:0}html[dir=rtl] .contact-page-temp .contact-info-item:before{left:-50px;right:auto}html[dir=rtl] .contact-page-temp .contact-form,html[dir=rtl] .contact-page-temp .contact-info-content{text-align:right}@media(max-width:767px){html[dir=rtl] .contact-page-temp .contact-info-item:before{left:0;right:0}.contact-page-temp .contact-info-item .icon-box i{width:40px;font-size:36px;line-height:40px}}@media(prefers-reduced-motion:reduce){.contact-page-temp *{animation-duration:.01ms!important;transition-duration:.01ms!important}}
.contact-page-temp .contact-form-section .contact-form-box{padding:100px 12%;}.contact-page-temp .contact-form-section .contact-form .row{display:flex;flex-wrap:wrap;margin:0 -10px}.contact-page-temp .contact-form-section .contact-form .form-group{padding:0 10px;width:50%}.contact-page-temp .contact-form-section .contact-form .form-group.col-12{width:100%}.contact-page-temp .contact-form-section .contact-form .form-control{display:block;width:100%;min-height:54px;padding:14px 24px;border:1px solid #e2e6e4;border-radius:14px;background:#fff;color:var(--text-color)}.contact-page-temp .contact-form-section .contact-form textarea.form-control{min-height:150px}.contact-page-temp .contact-form-section .contact-form .col-12{width:100%;padding:0 10px}@media(max-width:991px){.contact-page-temp .contact-form-section .contact-form-box{padding:60px 24px}.contact-page-temp .contact-form-section .contact-form .form-group{width:100%}}
.contact-page-temp .contact-info-item:nth-child(1) .icon-box i:empty::before{content:'\f095';font-family:'Font Awesome 6 Free';font-weight:900}.contact-page-temp .contact-info-item:nth-child(2) .icon-box i:empty::before{content:'\f232';font-family:'Font Awesome 6 Brands';font-weight:400}.contact-page-temp .contact-info-item:nth-child(3) .icon-box i:empty::before{content:'\f0e0';font-family:'Font Awesome 6 Free';font-weight:900}

/* Home: redesigned How We Work and community values sections. */
.lala-how-it-work { background: var(--portal-cream); }
.lala-how-it-work .section-title { max-width: 760px; margin-inline: auto; text-align: center; }
.lala-how-it-work .section-title h3, .lala-community-values .section-title h3 { color: #a27a32; }
.lala-how-it-work .how-it-work-list { gap: 24px; }
.lala-how-it-work .how-it-work-item { width: calc(25% - 18px); gap: 24px; }
.lala-how-it-work .how-it-work-image, .lala-how-it-work .how-it-work-content { aspect-ratio: 1 / .92; }
.lala-how-it-work .how-it-work-image figure, .lala-how-it-work .how-it-work-image img { width: 100%; height: 100%; border-radius: 22px; }
.lala-how-it-work .how-it-work-image img { display: block; object-fit: cover; }
.lala-how-it-work .how-it-work-content { display: flex; flex-direction: column; justify-content: center; box-sizing: border-box; padding: clamp(20px,2vw,32px); border: 1px solid #d9d0ba; border-radius: 22px; background: #fff; box-shadow: none; }
.lala-how-it-work .icon-box { display:grid; place-items:center; width:52px; height:52px; margin:0 auto 18px; padding:0; border:1px solid #b08a42; border-radius:50%; color:#8d6a2b; }
.lala-how-it-work .icon-box::before { display:none; }
.lala-how-it-work .icon-box svg, .community-values-logo-card svg, .community-value-icon svg { fill:none; stroke:#9c7733; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.lala-how-it-work .icon-box svg { width:27px; height:27px; }
.lala-how-it-work .how-it-work-body h3 { color:var(--portal-ink); text-transform:none; }
.lala-how-it-work .how-it-work-body p { color:var(--portal-muted); }
.lala-community-values { background: var(--portal-cream); padding:100px 0; }
.lala-community-values .community-values-media { order:2; }
.lala-community-values .community-values-content { order:1; }
.lala-community-values .testimonials-image { padding-right:78px; }
.lala-community-values .testimonials-img figure, .lala-community-values .testimonials-img img { width:100%; height:100%; border-radius:24px; }
.lala-community-values .testimonials-img img { display:block; aspect-ratio:.86 / 1; object-fit:cover; object-position:center; }
.community-values-badge { position:absolute; top:42px; right:0; display:grid; place-items:center; width:144px; aspect-ratio:1; padding:18px; border:1px solid #b08a42; border-radius:50%; background:var(--portal-green); color:#f7e7b6; text-align:center; z-index:1; }
.community-values-badge span { font-size:13px; font-weight:700; line-height:1.7; }
.community-values-logo-card { position:absolute; right:0; bottom:38px; display:grid; justify-items:center; gap:5px; min-width:138px; padding:15px 19px; border:1px solid #d9d0ba; border-radius:14px; background:#fff; box-shadow:0 12px 28px rgb(23 53 45 / 12%); color:var(--portal-ink); text-align:center; z-index:1; }
.community-values-logo-card svg { width:26px; height:26px; }
.community-values-logo-card span { font-size:14px; font-weight:700; }
.lala-community-values .testimonials-content { margin-left:0; }
.lala-community-values .testimonial-item { min-height:274px; padding:42px; border-color:#ded6c4; border-radius:24px; box-shadow:0 14px 34px rgb(23 53 45 / 6%); }
.community-value-icon { display:grid; place-items:center; width:58px; height:58px; margin-bottom:25px; border:1px solid #c5a45e; border-radius:50%; background:#fbf5e6; }
.community-value-icon svg { width:30px; height:30px; }
.community-value-copy h3 { color:var(--portal-ink); font-size:24px; margin-bottom:12px; }
.community-value-copy p { color:var(--portal-muted); font-size:16px; line-height:1.9; }
html[dir="rtl"] .lala-how-it-work .how-it-work-content, html[dir="rtl"] .lala-community-values .testimonial-item { text-align:right; }
html[dir="rtl"] .lala-community-values .community-values-media { order:1; }
html[dir="rtl"] .lala-community-values .community-values-content { order:2; }
html[dir="rtl"] .lala-community-values .testimonials-image { padding-right:0; padding-left:78px; }
html[dir="rtl"] .lala-community-values .community-values-badge, html[dir="rtl"] .lala-community-values .community-values-logo-card { right:auto; left:0; }
@media (max-width:991px) { .lala-how-it-work .how-it-work-item, .lala-how-it-work .how-it-work-item:nth-child(even) { width:100%; flex-direction:row; } .lala-how-it-work .how-it-work-image, .lala-how-it-work .how-it-work-content { width:calc(50% - 12px); min-height:300px; aspect-ratio:auto; } .lala-community-values .community-values-media, .lala-community-values .community-values-content, html[dir="rtl"] .lala-community-values .community-values-media, html[dir="rtl"] .lala-community-values .community-values-content { order:initial; } .lala-community-values .community-values-content { margin-bottom:48px; } }
@media (max-width:767px) { .lala-how-it-work .how-it-work-item, .lala-how-it-work .how-it-work-item:nth-child(even) { flex-direction:column-reverse; gap:16px; } .lala-how-it-work .how-it-work-image, .lala-how-it-work .how-it-work-content { width:100%; min-height:0; } .lala-how-it-work .how-it-work-image { aspect-ratio:1 / .72; } .lala-community-values { padding:64px 0; } .lala-community-values .testimonials-image { padding-right:28px; } html[dir="rtl"] .lala-community-values .testimonials-image { padding-right:0; padding-left:28px; } .community-values-badge { top:24px; width:112px; padding:12px; } .community-values-badge span { font-size:11px; } .community-values-logo-card { bottom:24px; min-width:116px; padding:12px; } .lala-community-values .testimonial-item { min-height:0; padding:30px 24px; } }

/* Home: static community gallery, ready for later content binding. */
.lala-community-gallery { background: var(--portal-cream); padding-bottom: 92px; }
.lala-community-gallery .section-title { max-width: 790px; margin-inline: auto; text-align: center; }
.lala-community-gallery .section-title h3 { color: #a27a32; }
.lala-community-gallery .section-title p { color: var(--portal-muted); }
.lala-community-gallery .our-gallery-nav { margin-bottom: 42px; }
.lala-community-gallery .our-gallery-nav ul { gap: 10px 34px; }
.lala-community-gallery .our-gallery-nav ul li a { color: var(--portal-ink); }
.lala-community-gallery .our-gallery-nav ul li a::before { right: -21px; background: #c5a45e; width: 5px; height: 5px; }
.lala-community-gallery .gallery-item-boxes { width: min(1480px, calc(100% - 40px)); margin: 0 auto; }
.lala-community-gallery .gallery-item-box { box-sizing: border-box; padding: 8px; }
.lala-community-gallery .gallery-item-1, .lala-community-gallery .gallery-item-3 { width: 50%; }
.lala-community-gallery .gallery-item-2, .lala-community-gallery .gallery-item-4 { width: 25%; }
.lala-community-gallery .gallery-item-box a { position: relative; display: block; overflow: hidden; border-radius: 20px; background: var(--portal-ink); }
.lala-community-gallery .gallery-item-box figure { margin: 0; }
.lala-community-gallery .gallery-item-1 figure, .lala-community-gallery .gallery-item-3 figure { aspect-ratio: 16 / 10; }
.lala-community-gallery .gallery-item-2 figure, .lala-community-gallery .gallery-item-4 figure { aspect-ratio: 3 / 4; }
.lala-community-gallery .gallery-item-box img { display: block; width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; transition: transform .5s ease; }
.lala-community-gallery .gallery-item-overlay { position: absolute; inset: auto 0 0; display: grid; gap: 3px; padding: 38px 22px 20px; background: linear-gradient(transparent, rgb(14 42 34 / 88%)); color: #fff; opacity: 0; transform: translateY(8px); transition: opacity .28s ease, transform .28s ease; }
.lala-community-gallery .gallery-item-overlay strong { font-size: 18px; line-height: 1.4; }
.lala-community-gallery .gallery-item-overlay small { color: #f2d99a; font-size: 13px; }
.lala-community-gallery .gallery-item-box a:hover img, .lala-community-gallery .gallery-item-box a:focus img { transform: scale(1.045); }
.lala-community-gallery .gallery-item-box a:hover .gallery-item-overlay, .lala-community-gallery .gallery-item-box a:focus .gallery-item-overlay { opacity: 1; transform: translateY(0); }
@media (max-width: 767px) { .lala-community-gallery { padding-bottom: 56px; } .lala-community-gallery .our-gallery-nav { margin-bottom: 24px; } .lala-community-gallery .our-gallery-nav ul { gap: 10px 24px; } .lala-community-gallery .gallery-item-boxes { width: calc(100% - 24px); } .lala-community-gallery .gallery-item-box { padding: 5px; } .lala-community-gallery .gallery-item-1, .lala-community-gallery .gallery-item-3 { width: 100%; } .lala-community-gallery .gallery-item-2, .lala-community-gallery .gallery-item-4 { width: 50%; } .lala-community-gallery .gallery-item-1 figure, .lala-community-gallery .gallery-item-3 figure { aspect-ratio: 1.45 / 1; } .lala-community-gallery .gallery-item-overlay { opacity: 1; transform: none; padding: 30px 16px 14px; } .lala-community-gallery .gallery-item-overlay strong { font-size: 15px; } }

/* Home: news and activities — static cards ready for later data binding. */
.lala-news-activities { background: #fff; padding: 86px 0; }
.lala-news-activities .section-title { max-width: 840px; margin-inline: auto; text-align: center; }
.lala-news-activities .section-title h3 { color: #a27a32; }
.lala-news-activities .section-title > p { color: var(--portal-muted); }
.news-hadith-callout { max-width: 670px; margin: 25px auto 0; padding: 14px 22px; border-inline: 2px solid #b08a42; color: var(--portal-ink); background: #fbf8ef; text-align: center; }
.news-hadith-callout span, .news-hadith-callout strong, .news-hadith-callout cite { display: block; }
.news-hadith-callout span, .news-hadith-callout cite { color: #8d6a2b; font-size: 13px; font-style: normal; }
.news-hadith-callout strong { margin: 4px 0; font-size: 17px; line-height: 1.7; }
.lala-news-track { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.lala-news-card { display: flex; flex-direction: column; height: 100%; min-height: 100%; margin: 0; padding: 20px; border: 1px solid #ded6c4; border-radius: 22px; box-shadow: 0 12px 30px rgb(23 53 45 / 7%); }
.lala-news-card .post-featured-image { margin: 0 0 20px; }
.lala-news-card .post-featured-image a, .lala-news-card .post-featured-image figure { border-radius: 15px; }
.lala-news-card .post-featured-image figure { margin: 0; aspect-ratio: 4 / 3; }
.lala-news-card .post-featured-image img { display: block; width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; }
.lala-news-card .post-item-header { margin: 0; }
.lala-news-card .post-item-meta { margin-bottom: 9px; }
.lala-news-card .post-item-meta span { color: #96742f; font-size: 14px; font-weight: 700; }
.lala-news-card .post-item-content h2 { color: var(--portal-ink); font-size: 21px; line-height: 1.45; margin-bottom: 10px; }
.lala-news-card .post-item-content p { color: var(--portal-muted); font-size: 15px; line-height: 1.75; margin: 0; }
.lala-news-card .blog-item-btn { margin-top: auto; padding-top: 18px; }
.lala-news-card .readmore-btn { color: var(--portal-ink); }
@media (max-width: 767px) { .lala-news-activities { padding: 62px 0; } .lala-news-track { display: flex; gap: 16px; overflow-x: auto; padding: 0 20px 12px; margin: 0 -20px; scroll-snap-type: x mandatory; scrollbar-width: none; } .lala-news-track::-webkit-scrollbar { display: none; } .lala-news-card { flex: 0 0 min(82vw, 350px); scroll-snap-align: start; } .news-hadith-callout { margin-top: 20px; padding: 12px 16px; } }

/* Public footer: static center information, ready for future content binding. */
.lala-site-footer { position: relative; isolation: isolate; overflow: hidden; padding: 48px 0 0; background: #0B5D3B; color: #f9f4e8; }
.lala-site-footer::before { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; opacity: .16; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cg fill='none' stroke='%23fffdf6' stroke-opacity='.7' stroke-width='1.25'%3E%3Cpath d='M90 0C90 49.7 130.3 90 180 90 130.3 90 90 130.3 90 180 90 130.3 49.7 90 0 90 49.7 90 90 49.7 90 0Z'/%3E%3Cpath d='M0 0C49.7 0 90 40.3 90 90 90 40.3 130.3 0 180 0M0 180c49.7 0 90-40.3 90-90 0 49.7 40.3 90 90 90'/%3E%3C/g%3E%3C/svg%3E"); background-size: 180px 180px; }
.lala-site-footer > .container, .lala-site-footer > .footer-copyright { position: relative; z-index: 1; }
.lala-site-footer .lala-footer-grid { display: grid; grid-template-columns: minmax(240px, 1.35fr) repeat(2, minmax(130px, .7fr)) minmax(180px, .9fr) minmax(230px, 1.05fr); gap: 28px; align-items: start; padding-bottom: 38px; }
.lala-site-footer .lala-footer-identity { display: flex; align-items: flex-start; gap: 14px; }
.lala-site-footer .lala-footer-logo { display: block; flex: 0 0 auto; width: 82px; height: 82px; object-fit: contain; border-radius: 12px; background: #fffdf6; padding: 7px; }
.lala-site-footer h2, .lala-site-footer h3 { color: #fffdf6; }
.lala-site-footer h2 { font-size: 21px; line-height: 1.45; margin: 0 0 5px; }
.lala-site-footer h3 { font-size: 17px; margin: 0 0 14px; }
.lala-site-footer p { color: #f3eee0; line-height: 1.7; margin: 0 0 5px; }
.lala-site-footer .lala-footer-mosque { color: #C89B3C; font-weight: 800; }
.lala-site-footer .lala-footer-location { margin-top: 9px; }
.lala-site-footer .lala-footer-location i, .lala-site-footer .lala-footer-contact-row i { color: #C89B3C; margin-inline-end: 7px; }
.lala-site-footer ul { list-style: none; padding: 0; margin: 0; }
.lala-site-footer li { color: #f3eee0; margin-bottom: 9px; line-height: 1.5; }
.lala-site-footer a { color: #fffdf6; transition: color .2s ease; }
.lala-site-footer .lala-footer-links a:hover { color: #C89B3C; }
.lala-site-footer .lala-footer-contact-row { display: flex; align-items: baseline; gap: 6px; margin-bottom: 12px; color: #f3eee0; line-height: 1.6; }
.lala-site-footer .lala-footer-contact-row i { width: 16px; margin-inline-end: 0; }
.lala-site-footer .lala-footer-feedback { padding: 17px; border: 1px solid rgb(200 155 60 / 58%); border-radius: 14px; background: rgb(3 52 31 / 22%); }
.lala-site-footer .lala-footer-feedback h3 { color: #C89B3C; margin-bottom: 8px; }
.lala-site-footer .lala-footer-feedback p { font-size: 14px; margin-bottom: 13px; }
.lala-feedback-button { width: 100%; padding: 10px 13px; border: 1px solid #C89B3C; border-radius: 999px; background: rgb(200 155 60 / 12%); color: #f8edd1; font: inherit; font-weight: 800; cursor: not-allowed; opacity: .82; }
.lala-footer-socials { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 14px; }
.lala-footer-socials a, .lala-footer-socials span { display: grid; place-items: center; width: 31px; height: 31px; border: 1px solid rgb(255 253 246 / 45%); border-radius: 50%; color: #fffdf6; }
.lala-footer-socials a:hover { color: #0B5D3B; border-color: #C89B3C; background: #C89B3C; }
.lala-footer-socials span { opacity: .48; cursor: default; }
.lala-site-footer .footer-copyright { margin-top: 0; border-top: 1px solid rgb(255 253 246 / 22%); background: rgb(0 42 25 / 24%); }
.lala-site-footer .copyright-text { padding: 15px 0; text-align: center; }
.lala-site-footer .copyright-text p { margin: 0; color: #eee8da; font-size: 13px; }
html[dir="rtl"] .lala-site-footer { text-align: right; }
@media (max-width: 1199px) { .lala-site-footer .lala-footer-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .lala-site-footer .lala-footer-feedback { grid-column: span 2; } }
@media (max-width: 767px) { .lala-site-footer { padding-top: 36px; text-align: center; } .lala-site-footer .lala-footer-grid { grid-template-columns: 1fr; gap: 25px; padding-bottom: 30px; } .lala-site-footer .lala-footer-identity { flex-direction: column; align-items: center; } .lala-site-footer .lala-footer-logo { width: 88px; height: 88px; } .lala-site-footer .lala-footer-feedback { grid-column: auto; max-width: 430px; width: 100%; margin-inline: auto; } .lala-site-footer .lala-footer-contact-row { justify-content: center; } .lala-site-footer .lala-footer-socials { justify-content: center; } }

/* Shared website footer: layout-only overrides for the database-driven footer content. */
.public-website .main-footer .main-footer-box {
    display: grid;
    grid-template-columns: minmax(300px, .92fr) minmax(0, 1.38fr);
    gap: clamp(34px, 5vw, 76px);
    align-items: start;
}

.public-website .main-footer .footer-about {
    width: auto;
    padding-inline-end: clamp(34px, 4vw, 62px);
}

.public-website .main-footer .footer-about::before {
    inset-inline-end: 0;
    right: auto;
    top: 0;
    bottom: 0;
    height: auto;
}

.public-website .main-footer .footer-logo {
    margin-bottom: 30px;
}

.public-website .main-footer .footer-brand-social {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: clamp(20px, 4vw, 42px);
    margin-bottom: 30px;
}

.public-website .main-footer .footer-brand-social .footer-logo {
    flex: 0 0 auto;
    margin-bottom: 0;
}

.public-website .main-footer .footer-brand-social .footer-social-links {
    flex: 1 1 auto;
    min-width: 0;
    margin-top: 0;
}

.public-website .main-footer .footer-quick-links {
    margin-bottom: 30px;
}

.public-website .main-footer .footer-quick-links ul {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 20px;
}

.public-website .main-footer .footer-contact-detail {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px clamp(22px, 3vw, 40px);
}

.public-website .main-footer .footer-links-contact-grid {
    margin-bottom: 30px;
}

.public-website .main-footer .footer-contact-item {
    width: auto;
}

.public-website .main-footer .footer-social-links {
    margin-top: 34px;
}

.public-website .main-footer .footer-social-links ul {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.public-website .main-footer .footer-social-links ul li,
.public-website .main-footer .footer-social-links ul li:last-child {
    margin: 0;
}

.public-website .main-footer .footer-links-box {
    width: auto;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 34px clamp(24px, 4vw, 56px);
    align-items: start;
}

.public-website .main-footer .newsletter-form {
    grid-column: 1 / -1;
    margin-bottom: 8px;
}

.public-website .main-footer .footer-links,
.public-website .main-footer .footer-links.footer-service-links {
    width: auto;
    min-width: 0;
}

.public-website .main-footer .footer-links h3 {
    margin-bottom: 20px;
}

.public-website .main-footer .footer-copyright {
    margin-top: 58px;
}

@media (max-width: 991px) {
    .public-website .main-footer .main-footer-box {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .public-website .main-footer .footer-about {
        padding-inline-end: 0;
        padding-bottom: 36px;
        border-bottom: 1px solid var(--dark-divider-color);
    }

    .public-website .main-footer .footer-about::before {
        display: none;
    }
}

@media (max-width: 767px) {
    .public-website .main-footer .main-footer-box {
        gap: 30px;
    }

    .public-website .main-footer .footer-links-contact-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 20px;
        align-items: start;
        margin-bottom: 26px;
    }

    .public-website .main-footer .footer-quick-links {
        margin-bottom: 0;
    }

    .public-website .main-footer .footer-quick-links ul {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .public-website .main-footer .footer-contact-detail {
        grid-template-columns: 1fr;
        gap: 18px;
        padding-top: 44px;
    }

    .public-website .main-footer .footer-brand-social {
        align-items: center;
        gap: 18px;
        margin-bottom: 26px;
    }

    .public-website .main-footer .footer-brand-social .footer-social-links h3 {
        margin-bottom: 12px;
    }

    .public-website .main-footer .footer-brand-social .footer-social-links ul {
        gap: 8px;
    }

    .public-website .main-footer .footer-quick-links h3 {
        margin-bottom: 12px;
    }

    .public-website .main-footer .footer-links-box {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 28px 24px;
    }

    .public-website .main-footer .newsletter-form {
        margin-bottom: 0;
    }

    .public-website .main-footer .footer-copyright {
        margin-top: 38px;
    }
}

/* Public website: phone-sized layout resilience, including iPhone safe areas. */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
.public-mobile-menu-backdrop { display: none; }

@media only screen and (max-width: 767px) {
    .public-website { padding-inline: env(safe-area-inset-left) env(safe-area-inset-right); }
    .public-website img, .public-website svg, .public-website video, .public-website iframe { max-width: 100%; }
    .public-website .container, .public-website .container-fluid, .public-website .row > * { min-width: 0; }

    .main-header .navbar { padding-top: max(12px, env(safe-area-inset-top)); }
    .main-header .navbar-brand img { width: clamp(66px, 19vw, 88px); height: auto; }
    .responsive-menu { position: relative; z-index: 1002; }
    .responsive-menu .slicknav_btn { display: grid; place-items: center; min-width: 44px; min-height: 44px; margin: 0; padding: 10px; }
    .responsive-menu .slicknav_icon { margin: 0; }
    .responsive-menu .slicknav_nav { max-height: calc(100dvh - 84px - env(safe-area-inset-top)); overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
    .responsive-menu .slicknav_nav a, .responsive-menu .slicknav_nav button { min-height: 44px; }
    .responsive-menu .slicknav_nav .header-language-action { margin: 0; }
    .responsive-menu .language-menu-form { display: block; width: 100%; }
    .responsive-menu .language-menu-link {
        display: block;
        box-sizing: border-box;
        width: 100%;
        margin: 0;
        padding: 8px 20px;
        border: 0;
        background: transparent;
        color: var(--white-color);
        font: inherit;
        font-weight: 500;
        line-height: normal;
        text-align: start;
    }
    .public-mobile-menu-backdrop { position: fixed; z-index: 1001; inset: 0; width: 100%; height: 100dvh; margin: 0; padding: 0; border: 0; background: rgba(2,13,25,.46); opacity: 0; pointer-events: none; transition: opacity .2s ease; }
    .public-mobile-menu-backdrop.is-visible { display: block; opacity: 1; pointer-events: auto; }

    .hero.hero-slider-layout .hero-slide { min-height: 100svh; min-height: 100dvh; padding-top: max(112px, calc(84px + env(safe-area-inset-top))); padding-bottom: max(42px, calc(24px + env(safe-area-inset-bottom))); }
    .hero.hero-slider-layout .hero-content { max-width: min(100%, 34rem); margin-inline: 0; }
    .hero.hero-slider-layout .hero-body h1, .page-header .page-header-box h1 { font-size: clamp(2rem, 9vw, 3rem); line-height: 1.12; overflow-wrap: anywhere; }
    .hero.hero-slider-layout .hero-body p, .hero.hero-slider-layout .hero-list { max-width: 100%; }
    .hero.hero-slider-layout .hero-footer { gap: 12px; flex-wrap: wrap; }
    .hero.hero-slider-layout .hero-btn .btn-default { min-height: 46px; }
    .hero.hero-slider-layout .hero-pagination { inset-inline: auto 16px; }
    html[dir="rtl"] .hero.hero-slider-layout .hero-pagination { inset-inline: 16px auto; }
    .page-header { min-height: min(42svh, 310px); padding-top: max(110px, calc(82px + env(safe-area-inset-top))); padding-bottom: 48px; }

    .quran-verse-separator, .quran-donation-separator, .quran-relief-donation-separator { padding-inline: 16px; }
    .quran-verse-copy, .quran-donation-copy, .quran-relief-donation-verse { max-width: 100%; overflow-wrap: anywhere; }
    .quran-verse-ornament { width: clamp(54px, 16vw, 82px); }
    .quran-verse-ornament-left { inset-inline-start: 0; }
    .quran-verse-ornament-right { inset-inline-end: 0; }

    .home-programs-grid, .donation-opportunities-grid { row-gap: 20px; }
    .home-program-column, .donation-opportunity-column { display: flex; }
    .home-program-column > *, .donation-opportunity-column > *, .program-item, .causes-item, .post-item, .team-item, .service-item { width: 100%; }
    .program-image img, .causes-image img, .post-featured-image img, .service-image img, .team-image img { width: 100%; height: auto; object-fit: cover; }
    .participation-section .what-we-do-images, .about-us-images, .why-choose-images, .our-approach-image, .our-features-image, .faqs-image { max-width: min(100%, 32rem); margin-inline: auto; }
    .participation-section .what-we-do-img-1, .participation-section .what-we-do-img-2, .about-img-1, .about-img-2, .why-choose-image-1, .why-choose-image-2 { max-width: 100%; }

    .scrolling-ticker-box, .quran-giving-ticker { max-width: 100%; }
    .scrolling-content { white-space: nowrap; }
    .swiper, .swiper-wrapper, .swiper-slide { min-width: 0; }
    .testimonial-slider .swiper-slide, .donar-company-slider .swiper-slide { height: auto; }

    .contact-page-temp .contact-form-section .contact-form-box { padding: clamp(36px, 9vw, 56px) clamp(16px, 5vw, 24px); }
    .contact-page-temp .contact-form-section .contact-form .row { margin-inline: -6px; }
    .contact-page-temp .contact-form-section .contact-form .form-group, .contact-page-temp .contact-form-section .contact-form .col-12 { padding-inline: 6px; }
    .contact-page-temp .contact-form-section .contact-form .form-control { min-height: 48px; padding: 12px 16px; font-size: 16px; }
    .contact-page-temp .contact-form-section .contact-form textarea.form-control { min-height: 132px; }
    .contact-page-temp .map-placeholder { min-height: 300px; padding: 24px 16px; }
    .contact-page-temp .map-card { width: min(100%, 360px); padding: 22px 18px; }
    .contact-page-temp .contact-info-item { align-items: flex-start; }
    .contact-page-temp .contact-info-content { min-width: 0; }
    .contact-page-temp .contact-info-content p, .main-footer .footer-contact-content { overflow-wrap: anywhere; }

    .main-footer .footer-about, .main-footer .footer-links-box, .main-footer .footer-contact-box, .main-footer .footer-contact-content { min-width: 0; }
    .main-footer .footer-contact-item { align-items: flex-start; }
    .main-footer .footer-links a { display: inline-flex; min-height: 32px; align-items: center; }
    .main-footer .footer-social-links a { width: 44px; height: 44px; }

    .wow { visibility: visible; }
}

@media (min-width: 768px) and (max-width: 1199px) {
    /* iPad: keep the shared footer in normal document flow and fully visible. */
    .public-website .main-footer {
        position: relative;
        z-index: 1;
        display: block;
        clear: both;
        overflow: visible;
    }

    .public-website .main-footer .main-footer-box {
        grid-template-columns: 1fr;
        gap: 42px;
    }

    .public-website .main-footer .footer-about {
        padding-bottom: 36px;
        border-bottom: 1px solid var(--dark-divider-color);
    }

    .public-website .main-footer .footer-about::before { display: none; }

    .public-website .main-footer .footer-links-box {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media only screen and (max-width: 767px) and (orientation: landscape) {
    .hero.hero-slider-layout .hero-slide { min-height: 100svh; min-height: 100dvh; padding-top: max(88px, calc(64px + env(safe-area-inset-top))); }
    .hero.hero-slider-layout .hero-body h1 { font-size: clamp(1.8rem, 5vw, 2.6rem); }
    .page-header { min-height: 240px; padding-top: max(88px, calc(64px + env(safe-area-inset-top))); }
}

@media only screen and (max-width: 767px) {
    /* Programs: use a deliberate touch carousel rather than clipped cards. */
    .home-programs .home-programs-grid { flex-wrap: nowrap; gap: 16px; margin-inline: -20px; padding: 0 20px 12px; overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: inline mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
    .home-programs .home-programs-grid::-webkit-scrollbar { display: none; }
    .home-programs .home-program-column { flex: 0 0 min(82vw, 350px); width: min(82vw, 350px); max-width: min(82vw, 350px); padding-inline: 0; scroll-snap-align: start; }
    .home-programs .service-item { margin-bottom: 0; }

    /* Arabic hero slides: align the action row and checklist to the RTL edge. */
    html[dir="rtl"] .hero.hero-slider-layout .hero-content { text-align: right; }

    html[dir="rtl"] .hero.hero-slider-layout .video-play-button p {
        margin: 0 0 0 10px;
    }

    html[dir="rtl"] .hero.hero-slider-layout .hero-list ul li {
        background-position: right center;
        padding-right: 35px;
        padding-left: 0;
        text-align: right;
    }
}

@media only screen and (max-width: 767px) {
    /* About: preserve the desktop collage proportions on a phone. */
    .about-page-temp .about-us-images,
    .public-website main .about-us-images { max-width: 100%; padding: 0 0 125px 70px; margin-inline: 0; }
    .about-page-temp .about-img-1,
    .public-website main .about-us .about-img-1 { width: 100%; }
    .about-page-temp .about-img-2,
    .public-website main .about-us .about-img-2 { width: min(58%, 210px); max-width: 210px; border-width: 5px; }

    /* Home participation: keep the two photos as a compact overlap. */
    .participation-section .what-we-do-images {
        display: block;
        position: relative;
        padding-left: 70px;
    }

    .participation-section .what-we-do-img-1 { width: 100%; }

    .participation-section .what-we-do-img-1 img {
        aspect-ratio: 1 / 1.5;
        border-radius: 20px;
    }

    .participation-section .what-we-do-img-2 {
        position: absolute;
        bottom: 30px;
        left: 0;
        width: min(38vw, 140px);
        max-width: 140px;
        margin: 0;
        border-width: 5px;
        border-radius: 50%;
    }

    /* Programs: use a deliberate touch carousel rather than clipped cards. */
    .home-programs .home-programs-grid {
        flex-wrap: nowrap;
        gap: 16px;
        margin-inline: -20px;
        padding: 0 20px 12px;
        overflow-x: auto;
        overscroll-behavior-inline: contain;
        scroll-snap-type: inline mandatory;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    .home-programs .home-programs-grid::-webkit-scrollbar { display: none; }

    .home-programs .home-program-column {
        flex: 0 0 min(82vw, 350px);
        width: min(82vw, 350px);
        max-width: min(82vw, 350px);
        padding-inline: 0;
        scroll-snap-align: start;
    }

    .home-programs .service-item { margin-bottom: 0; }
}

@media only screen and (max-width: 767px) {
    /* About: preserve the desktop collage proportions on a phone. */
    .about-page-temp .about-us-images {
        max-width: 100%;
        padding: 0 0 125px 70px;
        margin-inline: 0;
    }

    .about-page-temp .about-img-1 { width: 100%; }

    .about-page-temp .about-img-2 {
        width: min(58%, 210px);
        max-width: 210px;
        border-width: 5px;
    }
}

@media only screen and (max-width: 767px) {
    /* About: each impact card is a centered mobile composition in both languages. */
    .about-page-temp .our-features .our-features-list,
    .about-page-temp .our-features .our-features-item,
    .about-page-temp .our-features .our-features-content,
    .about-page-temp .our-features .our-features-body {
        text-align: center;
    }

    .about-page-temp .our-features .our-features-image,
    .about-page-temp .our-features .icon-box {
        margin-inline: auto;
    }
}

@media (prefers-reduced-motion: reduce) { .public-mobile-menu-backdrop { transition: none; } }

@media (max-width: 480px) {
    .public-website .main-footer .footer-links-box {
        grid-template-columns: 1fr;
    }
}

/* Public website brand palette. Kept on the website body so administration pages retain their own styling. */
.public-website,
body:has(> .main-header) {
    --brand-primary: #0B5D3B;
    --brand-secondary: #6F8F72;
    --brand-accent: #C89B3C;
    --brand-ivory: #F7F4EC;
    --brand-text: #17211B;
    --brand-card: #FFFFFF;

    --primary-color: var(--brand-primary);
    --secondary-color: var(--brand-ivory);
    --accent-color: var(--brand-accent);
    --white-color: var(--brand-card);
    --text-color: var(--brand-text);
    --divider-color: #0B5D3B1A;
    --dark-divider-color: #FFFFFF2B;
    --portal-ink: var(--brand-text);
    --portal-green: var(--brand-primary);
    --portal-cream: var(--brand-ivory);
    --portal-white: var(--brand-card);
    --portal-muted: var(--brand-secondary);
}

:is(.public-website, body:has(> .main-header)) .main-header .header-sticky {
    background-color: transparent;
}

:is(.public-website, body:has(> .main-header)) .main-header .header-sticky.active {
    background-color: var(--brand-primary);
}

/* The membership registration page starts on a light surface, so its shared header
   uses the website's green and gold palette until the sticky header activates. */
.public-website.membership-workflow-page .main-header .header-sticky:not(.active) {
    background-color: var(--brand-ivory);
    border-bottom-color: color-mix(in srgb, var(--brand-primary) 16%, transparent);
}

.public-website.membership-workflow-page main .membership-shell {
    padding-top: 150px;
}

.public-website.membership-workflow-page .main-header .header-sticky:not(.active) .main-menu > .nav-menu-wrapper > .navbar-nav > li > a,
.public-website.membership-workflow-page .main-header .header-sticky:not(.active) .main-menu .language-menu-link {
    color: var(--brand-primary);
}

.public-website.membership-workflow-page .main-header .header-sticky:not(.active) .main-menu > .nav-menu-wrapper > .navbar-nav > li > a:hover,
.public-website.membership-workflow-page .main-header .header-sticky:not(.active) .main-menu > .nav-menu-wrapper > .navbar-nav > li > a:focus,
.public-website.membership-workflow-page .main-header .header-sticky:not(.active) .main-menu .language-menu-link:hover,
.public-website.membership-workflow-page .main-header .header-sticky:not(.active) .main-menu .language-menu-link:focus {
    color: var(--brand-accent);
}

@media (min-width: 992px) {
    .public-website.membership-workflow-page .main-header .header-sticky:not(.active) .main-menu .header-login-action .nav-link {
        color: var(--brand-primary);
    }

    .public-website.membership-workflow-page .main-header .header-sticky:not(.active) .main-menu .header-login-action .nav-link:hover,
    .public-website.membership-workflow-page .main-header .header-sticky:not(.active) .main-menu .header-login-action .nav-link:focus {
        color: var(--brand-text);
    }
}

@media (max-width: 991px) {
    .public-website.membership-workflow-page main .membership-shell {
        padding-top: 130px;
    }
}

:is(.public-website, body:has(> .main-header)) .main-menu ul ul {
    background-color: var(--brand-primary);
}
/* Dropdown labels stay readable against the shared emerald menu surface. */
:is(.public-website, body:has(> .main-header)) .main-header .main-menu ul ul li > a {
    color: #fff;
}

:is(.public-website, body:has(> .main-header)) .main-header .main-menu ul ul li > a:hover,
:is(.public-website, body:has(> .main-header)) .main-header .main-menu ul ul li > a:focus {
    color: #f5d889;
}

:is(.public-website, body:has(> .main-header)) .section-title h3 {
    padding-left: 42px;
}

:is(.public-website, body:has(> .main-header)) .section-title h3::before {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--brand-ivory) url('../theme/lenity/images/lala-islamic-center-logo.png') center / 22px no-repeat;
}

html[dir="rtl"] :is(.public-website, body:has(> .main-header)) .section-title h3 {
    padding-right: 42px;
    padding-left: 0;
}

html[dir="rtl"] :is(.public-website, body:has(> .main-header)) .section-title h3::before {
    right: 0;
    left: auto;
}

:is(.public-website, body:has(> .main-header)) .navbar-brand,
:is(.public-website, body:has(> .main-header)) .footer-logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    padding: 6px 10px;
    background-color: var(--brand-ivory);
    border-radius: 10px;
}

:is(.public-website, body:has(> .main-header)) .navbar-brand img {
    display: block;
    width: auto;
    height: 62px;
    max-width: 120px;
    object-fit: contain;
}

:is(.public-website, body:has(> .main-header)) .footer-logo img {
    display: block;
    width: auto;
    height: 122px;
    max-width: 122px;
    object-fit: contain;
}

:is(.public-website, body:has(> .main-header)) .website-auth-btn-solid,
:is(.public-website, body:has(> .main-header)) .btn-default,
:is(.public-website, body:has(> .main-header)) .newsletter-btn,
:is(.public-website, body:has(> .main-header)) .slicknav_btn {
    color: var(--brand-text);
}

:is(.public-website, body:has(> .main-header)) .website-auth-btn-solid:hover,
:is(.public-website, body:has(> .main-header)) .btn-default:hover,
:is(.public-website, body:has(> .main-header)) .slicknav_btn:hover {
    color: var(--brand-card);
    background-color: var(--brand-primary);
}

html { scroll-behavior: smooth; }
html[dir="rtl"] body {
    font-family: "Noto Sans Arabic", sans-serif;
    text-align: right;
}
html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3,
html[dir="rtl"] h4,
html[dir="rtl"] h5,
html[dir="rtl"] h6 {
    font-family: "Noto Sans Arabic", sans-serif;
}
html[dir="rtl"] .navbar-brand { margin-right: 0; margin-left: 1rem; }
html[dir="rtl"] .hero-content { margin-right: 0; margin-left: 100px; }

@media (min-width: 992px) {
    .main-header .navbar > .container {
        flex-wrap: nowrap;
    }

    .main-header .navbar-brand,
    .main-header .contact-now-box {
        flex: 0 0 auto;
    }

    .main-header .main-menu {
        min-width: 0;
    }

    .main-header .contact-now-box-content p,
    .main-header .contact-now-box-content h3 {
        white-space: nowrap;
    }
}

.language-menu-form { margin: 0; }

.main-menu .language-menu-link {
    border: 0;
    background: transparent;
    color: var(--white-color);
    font-size: 16px;
    font-weight: 500;
    line-height: 1.4em;
    padding: 14px 20px !important;
    text-transform: capitalize;
    transition: all 0.3s ease-in-out;
}

.main-menu .language-menu-link:hover,
.main-menu .language-menu-link:focus { color: var(--accent-color); }

@media (min-width: 992px) {
    .public-website .main-menu .header-language-action,
    .public-website .main-menu .header-login-action,
    .public-website .main-menu .header-signup-action {
        margin-inline-start: 8px;
    }

    .public-website .main-menu .header-login-action .nav-link,
    .public-website .main-menu .header-signup-action .nav-link {
        min-width: 128px;
        padding: 13px 23px;
        border-radius: 999px;
        text-align: center;
        line-height: 1.2;
        transition: color .25s ease, background-color .25s ease, border-color .25s ease;
    }

    .public-website .main-menu .header-login-action .nav-link {
        border: 1px solid var(--accent-color);
        color: var(--white-color);
        background: transparent;
    }

    .public-website .main-menu .header-login-action .nav-link:hover,
    .public-website .main-menu .header-login-action .nav-link:focus {
        color: var(--brand-text);
        background-color: var(--accent-color);
    }

    .public-website .main-menu .header-signup-action .nav-link {
        border: 1px solid var(--accent-color);
        color: var(--brand-text);
        background-color: var(--accent-color);
    }

    .public-website .main-menu .header-signup-action .nav-link:hover,
    .public-website .main-menu .header-signup-action .nav-link:focus {
        color: var(--white-color);
        background-color: transparent;
    }
}

/* The home slider uses content cards over its images; do not dim the page with the theme's full-slider or slide overlay. */
.hero.hero-slider-layout::before,
.hero.hero-slider-layout .hero-slide::before {
    display: none;
}

html[dir="rtl"] .hero.hero-slider-layout .hero-pagination {
    text-align: right;
    padding-left: 0;
    padding-right: calc(((100vw - 1300px) / 2) + 15px);
}

.hero.hero-slider-layout .hero-slide {
    min-height: 100vh;
}

html[dir] .hero.hero-slider-layout .mosque-hero-slide::before {
    background: linear-gradient(90deg, rgba(11, 93, 59, 0.08) 0%, rgba(11, 93, 59, 0.46) 47%, rgba(11, 93, 59, 0.92) 100%),
        linear-gradient(0deg, rgba(11, 93, 59, 0.34) 0%, rgba(11, 93, 59, 0) 48%);
}

.hero.hero-slider-layout .mosque-hero-slide .hero-slider-image img {
    object-position: left top;
}

.mosque-hero-slide .hero-content {
    direction: rtl;
    text-align: right;
}

.public-website .hero-content[dir="ltr"] {
    direction: ltr;
    text-align: left;
}

.mosque-hero-slide .hero-content .section-title h1 span {
    color: #C89B3C;
}

html[dir="ltr"] .mosque-hero-slide .row {
    justify-content: flex-end;
}

html[dir] .hero.hero-slider-layout .quran-hero-slide::before {
    background: linear-gradient(90deg, rgba(11, 93, 59, 0.08) 0%, rgba(11, 93, 59, 0.44) 48%, rgba(11, 93, 59, 0.9) 100%),
        linear-gradient(0deg, rgba(11, 93, 59, 0.32) 0%, rgba(11, 93, 59, 0) 50%);
}

.quran-verse-separator {
    background: var(--brand-ivory);
    padding: 64px 0 68px;
    overflow: hidden;
}

.quran-verse-separator-inner {
    position: relative;
    display: grid;
    grid-template-columns: minmax(86px, 1fr) auto minmax(86px, 1fr);
    align-items: center;
    gap: 28px;
    max-width: 720px;
    margin: 0 auto;
    text-align: center;
}

.quran-verse-copy {
    position: relative;
    z-index: 1;
}

.quran-verse-copy::before,
.quran-verse-copy::after {
    content: "";
    display: block;
    width: 58px;
    height: 1px;
    margin: 0 auto;
    background: linear-gradient(90deg, transparent, rgba(200, 155, 60, 0.52), transparent);
}

.quran-verse-copy::before {
    margin-bottom: 18px;
}

.quran-verse-copy::after {
    margin-top: 16px;
}

.quran-verse-image {
    display: block;
    width: min(100%, 456px);
    height: auto;
    max-height: 62px;
    margin: 0 auto;
    object-fit: contain;
}

.quran-verse-reference {
    margin: 14px 0 0;
    color: rgba(23, 33, 27, 0.68);
    font-family: "Noto Sans Arabic", sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.7;
}

.quran-verse-ornament {
    display: block;
    width: 86px;
    height: auto;
    object-fit: contain;
    opacity: 0.7;
}

@media (max-width: 1199px) {
    .quran-verse-image {
        width: min(100%, 424px);
    }
}

@media (max-width: 991px) {
    .quran-verse-separator {
        padding: 54px 0 58px;
    }

    .quran-verse-separator-inner {
        grid-template-columns: minmax(58px, 0.35fr) minmax(0, 1fr) minmax(58px, 0.35fr);
        gap: 18px;
    }

    .quran-verse-image {
        width: min(100%, 380px);
    }

    .quran-verse-ornament {
        width: 64px;
    }
}

@media (max-width: 767px) {
    .quran-verse-separator-inner {
        grid-template-columns: 1fr;
    }

    .quran-verse-ornament {
        display: none;
    }
}

/* Participation section: isolated from the shared What We Do component styles. */
.participation-section {
    background: var(--brand-ivory);
}

.participation-section .section-title h2,
.participation-section .what-we-item-content h3 {
    color: var(--brand-primary);
}

.participation-section .participation-introduction {
    max-width: 590px;
    margin: 18px 0 34px;
    color: var(--brand-text);
}

.participation-section .what-we-item .icon-box {
    display: grid;
    width: 72px;
    min-width: 72px;
    height: 72px;
    place-items: center;
}

.participation-section .what-we-item .icon-box i {
    position: relative;
    z-index: 1;
    color: var(--brand-primary);
    font-size: 34px;
    line-height: 1;
}

.participation-section .what-we-do-img-1 img {
    object-position: center 44%;
}

.participation-section .what-we-do-img-2 img {
    object-position: center 42%;
}

.participation-section .donate-now-box a {
    background: var(--brand-accent);
}

.participation-section .donate-now-box a:hover {
    background: var(--brand-primary);
}

@media (max-width: 991px) {
    .participation-section .participation-introduction {
        margin-bottom: 28px;
    }

    .participation-section .what-we-item .icon-box {
        width: 60px;
        min-width: 60px;
        height: 60px;
    }

    .participation-section .what-we-item .icon-box i {
        font-size: 29px;
    }
}

@media (max-width: 767px) {
    .participation-section .what-we-do-content {
        margin-bottom: 34px;
    }

    .participation-section .participation-introduction {
        margin: 14px 0 28px;
    }

    .participation-section .what-we-item .icon-box {
        width: 50px;
        min-width: 50px;
        height: 50px;
    }

    .participation-section .what-we-item .icon-box::before {
        width: 31px;
        height: 31px;
    }

    .participation-section .what-we-item .icon-box i {
        font-size: 24px;
    }

    .participation-section .what-we-do-images {
        display: grid;
        gap: 20px;
        padding-left: 0;
    }

    .participation-section .what-we-do-img-1,
    .participation-section .what-we-do-img-2,
    .participation-section .donate-now-box {
        position: static;
        width: 100%;
        max-width: none;
        transform: none;
    }

    .participation-section .what-we-do-img-1 img {
        aspect-ratio: 4 / 5;
        border-radius: 20px;
    }

    .participation-section .what-we-do-img-2 {
        width: min(220px, 68vw);
        margin-inline: auto;
        border-width: 5px;
    }

    .participation-section .donate-now-box {
        writing-mode: initial;
    }

    .participation-section .donate-now-box a {
        width: fit-content;
        margin-inline: auto;
        padding: 13px 20px;
    }

.participation-section .donate-now-box a img {
        transform: none;
    }
}

/* Compact Quran separator and donation opportunities on the homepage. */
.quran-donation-separator {
    background: var(--brand-ivory);
    padding: 34px 0 40px;
    overflow: hidden;
}

.quran-donation-separator-inner {
    display: grid;
    grid-template-columns: 86px minmax(0, 1fr) 86px;
    align-items: center;
    gap: 24px;
    max-width: 1220px;
    margin: 0 auto;
    text-align: center;
}

.quran-donation-ornament {
    display: block;
    width: 86px;
    height: auto;
    object-fit: contain;
    opacity: 0.7;
}

.quran-donation-copy {
    min-width: 0;
}

.quran-donation-verse {
    margin: 0;
    color: var(--brand-primary);
    font-family: "Amiri Quran", "Noto Sans Arabic", serif;
    font-size: clamp(27px, 2.5vw, 39px);
    font-weight: 400;
    line-height: 1.75;
    letter-spacing: 0;
    white-space: nowrap;
}

.quran-donation-reference {
    margin: 6px 0 0;
    color: rgba(23, 33, 27, 0.68);
    font-family: "Noto Sans Arabic", sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.7;
}

.donation-opportunities {
    background-color: var(--brand-ivory);
    padding: 0 0 70px;
}

.donation-opportunities .section-row {
    margin-bottom: 48px;
}

.donation-opportunities .section-title h2,
.donation-opportunities .causes-content h3,
.donation-opportunities .causes-content h3 a {
    color: var(--brand-primary);
}

.donation-hadith {
    position: relative;
    max-width: 640px;
    margin: 24px auto 0;
    padding: 13px 32px;
    color: var(--brand-text);
    font-family: "Noto Sans Arabic", sans-serif;
    font-size: 15px;
    font-style: normal;
    line-height: 1.9;
}

.donation-hadith::before,
.donation-hadith::after {
    content: "";
    position: absolute;
    top: 14px;
    bottom: 14px;
    width: 2px;
    background: var(--brand-accent);
    opacity: 0.72;
}

.donation-hadith::before {
    right: 0;
}

.donation-hadith::after {
    left: 0;
}

.donation-hadith span,
.donation-hadith strong,
.donation-hadith cite {
    display: block;
}

.donation-hadith strong {
    color: var(--brand-primary);
    font-weight: 700;
}

.donation-hadith cite {
    color: var(--brand-accent);
    font-size: 13px;
    font-style: normal;
}

.donation-opportunities-grid {
    align-items: stretch;
}

.donation-opportunities .donation-opportunity-column {
    display: flex;
}

.donation-opportunities .causes-item {
    display: flex;
    width: 100%;
    height: auto;
    min-height: 470px;
    flex-direction: column;
    border-radius: 20px;
    transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
}

.donation-opportunities .causes-item:hover {
    transform: translateY(-7px);
    border-color: rgba(200, 155, 60, 0.42);
    box-shadow: 0 18px 42px rgba(12, 77, 51, 0.1);
}

.donation-opportunities .causes-image {
    margin-bottom: 24px;
}

.donation-opportunities .causes-image figure {
    overflow: hidden;
    border-radius: 14px;
}

.donation-opportunities .causes-image img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 10;
    border-radius: 14px;
    object-fit: cover;
}

.donation-opportunities .causes-content {
    min-height: 116px;
    margin-bottom: 24px;
}

.donation-opportunities .causes-content h3 {
    min-height: 54px;
    margin-bottom: 10px;
}

.donation-opportunities .causes-content p {
    min-height: 52px;
}

.donation-opportunities .causes-button {
    margin-top: auto;
}

.donation-opportunities .causes-button .btn-default {
    background: var(--brand-accent);
    color: var(--brand-card);
}

.donation-opportunities .causes-button .btn-default:hover {
    background: var(--brand-primary);
}

@media (min-width: 768px) and (max-width: 991px) {
    .donation-opportunities .donation-opportunity-column:last-child {
        margin-inline: auto;
    }
}

@media (max-width: 991px) {
    .quran-donation-separator-inner {
        grid-template-columns: 64px minmax(0, 1fr) 64px;
        gap: 16px;
    }

    .quran-donation-ornament {
        width: 64px;
    }

    .quran-donation-verse {
        font-size: clamp(24px, 3.4vw, 32px);
    }

    .donation-opportunities .causes-item {
        min-height: 445px;
    }
}

@media (max-width: 767px) {
    .quran-donation-separator {
        padding: 28px 0 34px;
    }

    .quran-donation-separator-inner {
        grid-template-columns: 1fr;
    }

    .quran-donation-ornament {
        display: none;
    }

    .quran-donation-verse {
        font-size: clamp(23px, 7vw, 30px);
        line-height: 1.85;
        white-space: normal;
    }

    .quran-donation-reference {
        margin-top: 4px;
    }

    .donation-opportunities {
        padding-bottom: 50px;
    }

    .donation-opportunities .section-row {
        margin-bottom: 32px;
    }

    .donation-hadith {
        padding: 11px 24px;
        font-size: 14px;
    }

    .donation-opportunities .donation-opportunity-column {
        width: 100%;
    }

    .donation-opportunities .causes-item,
    .donation-opportunities .causes-content,
    .donation-opportunities .causes-content h3,
    .donation-opportunities .causes-content p {
        min-height: 0;
    }
}

/* Lala Islamic Center Why Choose Us section. */
.lala-why-choose {
    background: var(--brand-ivory);
}

.lala-news-activities {
    background: var(--brand-ivory);
}

.lala-why-choose .why-choose-images {
    padding: 0 78px 46px 0;
}

.lala-why-choose .why-choose-image-1 figure {
    aspect-ratio: 4 / 5;
    overflow: hidden;
    border-radius: 50% 50% 18px 18px / 22% 22% 18px 18px;
}

.lala-why-choose .why-choose-image-1 img {
    display: block;
    width: 100%;
    height: 100%;
    aspect-ratio: auto;
    border-radius: inherit;
    object-fit: cover;
    object-position: center 57%;
}

.lala-why-choose .why-choose-image-2 {
    right: 0;
    bottom: 0;
    max-width: 245px;
    border: 5px solid var(--brand-card);
    box-shadow: 0 12px 28px rgba(12, 77, 51, 0.12);
}

.lala-why-choose .why-choose-image-2 img {
    object-position: center 50%;
}

.lala-why-choose .section-title h2 {
    color: var(--brand-primary);
}

.lala-why-choose .why-choose-list ul {
    gap: 18px 24px;
}

.lala-why-choose .why-choose-list ul li {
    display: flex;
    align-items: center;
    gap: 10px;
    width: calc(50% - 12px);
    padding-left: 0;
    background: none;
    color: var(--brand-primary);
    font-weight: 600;
}

.lala-why-choose .why-choose-list ul li i {
    flex: 0 0 auto;
    color: var(--brand-accent);
    font-size: 16px;
}

.lala-why-choose .why-choose-pillars {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    border-top: 1px solid var(--divider-color);
    margin-top: 34px;
    padding-top: 28px;
}

.lala-why-choose .why-choose-pillar {
    display: grid;
    min-width: 0;
    justify-items: center;
    gap: 9px;
    color: var(--brand-primary);
    text-align: center;
}

.lala-why-choose .why-choose-pillar i {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border: 1px solid rgba(200, 155, 60, 0.38);
    border-radius: 50%;
    color: var(--brand-accent);
    font-size: 18px;
}

.lala-why-choose .why-choose-pillar p {
    margin: 0;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.55;
}

@media (max-width: 991px) {
    .lala-why-choose .why-choose-images {
        padding-right: 65px;
    }

    .lala-why-choose .why-choose-image-2 {
        max-width: 205px;
    }
}

@media (max-width: 767px) {
    .lala-why-choose .why-choose-images {
        display: grid;
        gap: 20px;
        max-width: 100%;
        padding: 0;
    }

    .lala-why-choose .why-choose-image-2 {
        position: static;
        width: min(210px, 65vw);
        max-width: none;
        margin-inline: auto;
    }

    .lala-why-choose .why-choose-list ul li {
        width: 100%;
    }

    .lala-why-choose .why-choose-pillars {
        gap: 10px;
        margin-top: 26px;
        padding-top: 22px;
    }

    .lala-why-choose .why-choose-pillar p {
        font-size: 12px;
    }
}

/* Homepage lessons and events section. */
.lala-events-section {
    background-image: url('../theme/lenity/images/lala-mosque-lessons-events.png');
    background-position: center center;
    background-size: cover;
}

.lala-events-section::before {
    background: linear-gradient(180deg, rgba(11, 93, 59, 0.86) 0%, rgba(11, 93, 59, 0.72) 60%, rgba(247, 244, 236, 0.97) 100%);
}

.lala-events-section .section-title {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
}

.lala-events-section .section-title h3,
.lala-events-section .section-title h2,
.lala-events-section .section-title p {
    color: var(--brand-card);
}

.events-hadith {
    max-width: 720px;
    margin: 20px auto 0;
    color: rgba(255, 255, 255, 0.94) !important;
    font-family: "Noto Sans Arabic", sans-serif;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.9;
}

.lala-event-card {
    display: flex;
    min-height: 270px;
    margin-bottom: 0;
    padding: 38px;
    border-radius: 20px;
    text-align: center;
}

.lala-event-card .program-body {
    display: flex;
    width: 100%;
    flex-direction: column;
}

.lala-event-card .program-content {
    margin-bottom: 24px;
}

.lala-event-card .program-meta {
    display: grid;
    gap: 4px;
    margin-bottom: 18px;
    color: var(--brand-accent);
}

.lala-event-card .program-meta span {
    font-size: 14px;
    font-weight: 700;
}

.lala-event-card .program-meta strong {
    color: var(--brand-primary);
    font-size: 16px;
    font-weight: 700;
}

.lala-event-card .program-content h3 {
    color: var(--brand-primary);
    font-size: 24px;
}

.lala-event-card .program-content h3 a {
    color: inherit;
}

.lala-event-card .program-button {
    margin-top: auto;
}

.lala-event-card .readmore-btn {
    color: var(--brand-accent);
}

/* Seamlessly moving Quran verse banner. */
.quran-giving-ticker {
    background: var(--portal-cream);
}

.quran-giving-ticker .scrolling-ticker-box {
    --gap: 34px;
}

.quran-giving-ticker .scrolling-content {
    align-items: center;
    animation-direction: reverse;
}

.quran-giving-ticker .scrolling-content .quran-giving-ticker-verse {
    display: block;
    flex: 0 0 auto;
    min-width: max-content;
    color: #C89B3C;
    background: none;
    -webkit-text-fill-color: #C89B3C;
    -webkit-text-stroke: 0;
    font-family: "Amiri Quran", "Noto Sans Arabic", serif;
    font-size: clamp(28px, 3.5vw, 52px);
    font-weight: 400;
    line-height: 1.75;
    letter-spacing: 0;
    text-align: start;
    text-transform: none;
    white-space: nowrap;
}

.quran-giving-ticker-ornament {
    flex: 0 0 auto;
    color: #C89B3C;
    font-size: clamp(17px, 1.6vw, 24px);
}

@media (max-width: 767px) {
    .lala-events-section {
        background-position: 55% center;
    }

    .events-hadith {
        font-size: 14px;
    }

    .lala-event-card {
        min-height: 0;
        padding: 28px 22px;
    }

    .lala-event-card .program-content h3 {
        font-size: 21px;
    }

    .quran-giving-ticker .scrolling-ticker-box {
        --gap: 22px;
    }

    .quran-giving-ticker .scrolling-content .quran-giving-ticker-verse {
        font-size: clamp(25px, 7vw, 34px);
        line-height: 1.8;
    }
}

/* Featured impact section for Lala Islamic Center. */
.featured-impact-section {
    background: var(--brand-ivory);
}

.featured-impact-section .section-row {
    margin-bottom: 62px;
}

.featured-impact-section .section-title {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
}

.featured-impact-section .section-title h2,
.featured-impact-section .our-features-body h3 {
    color: var(--brand-primary);
}

.featured-impact-hadith {
    position: relative;
    max-width: 660px;
    margin: 22px auto 0;
    padding: 12px 28px;
    color: var(--brand-text);
    font-family: "Noto Sans Arabic", sans-serif;
    font-size: 15px;
    font-style: normal;
    line-height: 1.85;
}

.featured-impact-hadith::before,
.featured-impact-hadith::after {
    content: "";
    position: absolute;
    top: 14px;
    bottom: 14px;
    width: 2px;
    background: var(--brand-accent);
}

.featured-impact-hadith::before {
    right: 0;
}

.featured-impact-hadith::after {
    left: 0;
}

.featured-impact-hadith strong,
.featured-impact-hadith cite {
    display: block;
}

.featured-impact-hadith strong {
    color: var(--brand-primary);
    font-weight: 700;
}

.featured-impact-hadith cite {
    color: var(--brand-accent);
    font-size: 13px;
    font-style: normal;
}

.featured-impact-section .our-features-list {
    align-items: stretch;
    gap: 30px;
}

.featured-impact-section .our-features-item {
    width: calc(33.333% - 20px);
    min-width: 0;
    gap: 34px;
}

.featured-impact-section .our-features-image figure {
    overflow: hidden;
    border-radius: 18px;
}

.featured-impact-section .our-features-image img {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    border-radius: 18px;
    object-fit: cover;
    object-position: center;
}

.featured-impact-section .our-features-content {
    align-items: flex-start;
}

.featured-impact-section .our-features-body {
    width: calc(100% - 64px);
}

.featured-impact-index {
    display: block;
    margin-bottom: 14px;
    color: var(--brand-accent);
    font-size: 16px;
    font-weight: 800;
    line-height: 1;
}

.featured-impact-section .our-features-body h3 {
    min-height: 56px;
    text-transform: none;
}

.featured-impact-section .our-features-body p {
    margin: 0;
}

.featured-impact-icon {
    display: grid;
    width: 48px;
    min-width: 48px;
    height: 48px;
    place-items: center;
    border: 1px solid rgba(200, 155, 60, 0.42);
    border-radius: 50%;
    color: var(--brand-accent);
    font-size: 20px;
}

@media (max-width: 991px) {
    .featured-impact-section .section-row {
        margin-bottom: 44px;
    }

    .featured-impact-section .our-features-item {
        width: 100%;
    }

    .featured-impact-section .our-features-item:nth-child(even) {
        flex-direction: row-reverse;
    }
}

@media (max-width: 767px) {
    .featured-impact-section .section-row {
        margin-bottom: 32px;
    }

    .featured-impact-hadith {
        padding: 10px 22px;
        font-size: 14px;
    }

    .featured-impact-section .our-features-item,
    .featured-impact-section .our-features-item:nth-child(even) {
        flex-direction: column;
    }

    .featured-impact-section .our-features-image,
    .featured-impact-section .our-features-content {
        width: 100%;
    }

    .featured-impact-section .our-features-body h3 {
        min-height: 0;
    }
}

/* Homepage programs: scoped so shared service cards elsewhere retain their layout. */
.home-programs {
    background-color: var(--brand-ivory);
}

.home-programs .section-row {
    margin-bottom: 56px;
}

.home-programs .section-title h2,
.home-programs .service-content h3 {
    color: var(--brand-primary);
}

.home-programs-grid {
    align-items: stretch;
}

.home-programs .home-program-column {
    display: flex;
}

.home-programs .service-item {
    display: flex;
    width: 100%;
    height: auto;
    min-height: 550px;
    flex-direction: column;
    margin-bottom: 30px;
    transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
}

.home-programs .service-item:hover {
    transform: translateY(-7px);
    border-color: rgba(196, 151, 45, 0.38);
    box-shadow: 0 18px 42px rgba(12, 77, 51, 0.1);
}

.home-programs .service-content {
    min-height: 112px;
    margin-bottom: 24px;
}

.home-programs .service-content h3 {
    min-height: 32px;
    text-transform: none;
}

.home-programs .service-content p {
    min-height: 58px;
}

.home-programs .service-image {
    margin-bottom: 28px;
}

.home-programs .service-image figure {
    width: min(220px, 100%);
    max-width: none;
    aspect-ratio: 1;
    overflow: hidden;
    border: 3px solid rgba(196, 151, 45, 0.18);
}

.home-programs .service-image img {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

.home-programs .service-btn {
    margin-top: auto;
}

.home-programs .readmore-btn {
    color: var(--brand-accent);
}

@media (min-width: 768px) and (max-width: 991px) {
    .home-programs .home-program-column:last-child {
        margin-inline: auto;
    }
}

@media (max-width: 991px) {
    .home-programs .section-row {
        margin-bottom: 42px;
    }

    .home-programs .service-item {
        min-height: 500px;
    }

    .home-programs .service-image figure {
        width: min(190px, 100%);
    }
}

@media (max-width: 767px) {
    .home-programs .section-row {
        margin-bottom: 30px;
    }

    .home-programs .home-program-column {
        width: 100%;
    }

    .home-programs .service-item {
        min-height: 0;
    }

    .home-programs .service-content,
    .home-programs .service-content h3,
    .home-programs .service-content p {
        min-height: 0;
    }

    .home-programs .service-image figure {
        width: min(180px, 72vw);
    }
}

@media (max-width: 575px) {
    .quran-verse-separator {
        padding: 44px 0 48px;
    }

    .quran-verse-copy::before {
        margin-bottom: 14px;
    }

    .quran-verse-copy::after {
        margin-top: 12px;
    }

    .quran-verse-image {
        width: min(100%, 304px);
        max-height: none;
    }

    .quran-verse-reference {
        margin-top: 12px;
        font-size: 14px;
    }
}

.hero.hero-slider-layout .quran-hero-slide .hero-slider-image img {
    object-position: left center;
}

.quran-hero-slide .hero-content {
    direction: rtl;
    text-align: right;
}

.quran-hero-slide .hero-content .section-title h1 span {
    color: #C89B3C;
}

.quran-hero-slide .quran-hero-quote {
    margin-bottom: 4px;
}

.quran-hero-slide .quran-hero-source {
    display: block;
    color: var(--brand-ivory);
    font-size: 13px;
    line-height: 1.4;
    margin-bottom: 10px;
}

.quran-hero-slide .quran-hero-supporting {
    margin: 0;
}

html[dir="ltr"] .quran-hero-slide .row {
    justify-content: flex-end;
}

html[dir] .hero.hero-slider-layout .giving-hero-slide::before {
    background: linear-gradient(90deg, rgba(11, 93, 59, 0.04) 0%, rgba(11, 93, 59, 0.35) 48%, rgba(11, 93, 59, 0.88) 100%),
        linear-gradient(0deg, rgba(11, 93, 59, 0.24) 0%, rgba(11, 93, 59, 0) 50%);
}

.hero.hero-slider-layout .giving-hero-slide .hero-slider-image img {
    object-position: center center;
}

.giving-hero-slide .hero-content {
    direction: rtl;
    text-align: right;
}

.giving-hero-slide .hero-content .section-title h1 span {
    color: #C89B3C;
}

.giving-hero-slide .giving-hero-quote h3,
.giving-hero-slide .giving-hero-quote p,
.giving-hero-slide .giving-hero-quote span {
    color: var(--brand-card);
}

.giving-hero-slide .giving-hero-quote h3 {
    font-size: 20px;
    margin-bottom: 8px;
}

.giving-hero-slide .giving-hero-quote p {
    line-height: 1.5;
    margin: 0 0 4px;
}

.giving-hero-slide .giving-hero-quote span {
    display: block;
    font-size: 13px;
    line-height: 1.4;
}

html[dir="ltr"] .giving-hero-slide .row {
    justify-content: flex-end;
}

html[dir="rtl"] .fa-arrow-right { transform: scaleX(-1); }
.validation-summary-errors, .field-validation-error { color: #b42318; }
.input-validation-error { border-color: #b42318 !important; }

/* Generator Service: UI-only prototype. Real tariffs, contacts, and records are intentionally absent. */
.generator-service-nav .nav-link i{margin-inline-end:7px;color:#c89b3c}.generator-hero{padding:150px 0 94px;background:radial-gradient(circle at 82% 16%,rgba(200,155,60,.26),transparent 27%),linear-gradient(135deg,#063c29,#0b5d3b);color:#fff}.generator-hero .container{max-width:960px;text-align:center}.generator-kicker{display:inline-flex;align-items:center;gap:8px;color:#e9ca78;font-size:14px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.generator-hero h1{margin:15px 0 16px;color:#fff;font-size:clamp(38px,6vw,68px)}.generator-hero p{max-width:630px;margin:0 auto;color:#f6f1e5;font-size:20px;line-height:1.75}.generator-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:16px;margin-top:32px}.generator-button{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:12px 21px;border:1px solid #c89b3c;border-radius:999px;background:#c89b3c;color:#12352a!important;font:inherit;font-weight:800;text-decoration:none;cursor:pointer}.generator-button:hover,.generator-button:focus{background:#f3d68d;border-color:#f3d68d}.generator-link{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:10px 15px;color:inherit;font-weight:800;text-decoration:underline;text-underline-offset:4px}.generator-demo-note{margin-top:28px!important;color:#d6e6dd!important;font-size:14px!important}.generator-section{padding:94px 0;background:#fff}.generator-section-heading{text-align:center;margin-bottom:38px}.generator-section-heading>span{color:#9b752c;font-weight:800}.generator-section h2{margin-top:8px;color:#17352d;font-size:clamp(29px,4vw,44px)}.generator-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.generator-card{padding:31px;border:1px solid #dfdfd1;border-radius:20px;background:#fff;box-shadow:0 10px 27px rgb(23 53 45 / 5%)}.generator-card>i{display:grid;place-items:center;width:52px;height:52px;margin-bottom:23px;border-radius:15px;background:#edf6f1;color:#0b5d3b;font-size:23px}.generator-card h3{color:#17352d;font-size:23px}.generator-card p,.generator-steps p,.generator-panel p{color:#66736e;line-height:1.8}.generator-card a{color:#0b5d3b;font-weight:800}.generator-placeholder{display:inline-block;margin-top:8px;color:#9b752c;font-size:14px;font-weight:700}.generator-soft{background:#f7f5ec}.generator-steps{display:grid;grid-template-columns:1.05fr .95fr;gap:60px;align-items:center}.generator-steps ol{display:grid;gap:12px;list-style:none;padding:0;margin:0}.generator-steps li{display:flex;gap:15px;align-items:center;padding:16px 19px;border:1px solid #ded6c4;border-radius:14px;background:#fff;color:#17352d;font-weight:700}.generator-steps strong{color:#b1852f;font-size:17px}.generator-bill-page{min-height:70vh;padding:140px 0 90px;background:#f7f5ec}.generator-back{display:inline-flex;gap:8px;align-items:center;margin-bottom:22px;color:#0b5d3b;font-weight:800}.generator-demo-ribbon{margin-bottom:16px;color:#76591f;font-size:14px;font-weight:800;text-align:center}.generator-invoice{max-width:740px;margin:auto;overflow:hidden;border:1px solid #d9dfd8;border-radius:23px;background:#fff;box-shadow:0 20px 48px rgb(23 53 45 / 10%)}.generator-invoice>header{display:flex;justify-content:space-between;gap:20px;padding:34px 38px 27px;background:#0b5d3b;color:#fff}.generator-invoice header span:not(.generator-status){color:#e9ca78;font-weight:800}.generator-invoice h1{margin:7px 0;color:#fff;font-size:30px}.generator-invoice header p{margin:0;color:#e8f1ed}.generator-status{align-self:flex-start;padding:7px 12px;border-radius:999px;font-size:14px;font-weight:800}.generator-status.unpaid{background:#fff1e9;color:#a44714}.generator-status.partial{background:#fff8d9;color:#725604}.generator-status.paid{background:#dff5e8;color:#12643d}.generator-bill-total{padding:29px 38px;border-bottom:1px solid #e2e7e3}.generator-bill-total span,.generator-bill-total small{display:block;color:#66736e}.generator-bill-total strong{display:block;margin:6px 0;color:#17352d;font-size:42px;line-height:1.15}.generator-bill-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding:25px 38px;margin:0}.generator-bill-meta dt{margin-bottom:5px;color:#66736e;font-size:13px}.generator-bill-meta dd{margin:0;color:#17352d;font-weight:800}.generator-invoice details{margin:0 38px 26px;padding:17px 0;border-top:1px solid #e2e7e3}.generator-invoice summary{color:#17352d;font-weight:800;cursor:pointer}.generator-charge{display:flex;justify-content:space-between;gap:15px;padding:13px 0 5px;color:#52605b}.generator-charge b{color:#17352d;white-space:nowrap}.generator-invoice details p{margin:14px 0 0;color:#66736e;font-size:14px}.generator-invoice footer{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:22px 38px;border-top:1px solid #e2e7e3}.generator-unavailable{max-width:600px;margin:55px auto;text-align:center}.generator-unavailable>i{font-size:46px;color:#b1852f}.generator-unavailable h1{margin:17px 0 9px;color:#17352d}.generator-unavailable p{margin-bottom:22px;color:#66736e;line-height:1.8}.generator-workspace{min-height:72vh;padding:135px 0 85px;background:#f7f5ec}.generator-workspace-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:24px}.generator-workspace-head span{color:#9b752c;font-weight:800}.generator-workspace-head h1{margin:5px 0 0;color:#17352d}.generator-workspace-nav{display:flex;gap:25px;overflow:auto;padding-bottom:13px;border-bottom:1px solid #dce3de;color:#66736e;font-weight:700}.generator-workspace-nav .active{color:#0b5d3b}.generator-workspace-nav .active::after{display:block;height:3px;margin-top:13px;background:#c89b3c;content:""}.generator-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:27px 0}.generator-metrics article,.generator-panel{padding:24px;border:1px solid #dce3de;border-radius:17px;background:#fff}.generator-metrics span,.generator-metrics small{display:block;color:#66736e}.generator-metrics b{display:block;margin:8px 0;color:#17352d;font-size:30px}.generator-workspace-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:18px}.generator-panel h2{margin-bottom:8px;color:#17352d;font-size:24px}.generator-search{display:flex;gap:10px;margin:22px 0}.generator-search input{min-width:0;flex:1;padding:12px 14px;border:1px solid #cbd7d0;border-radius:11px;font:inherit}.generator-search button,.generator-quick-actions button{min-height:44px;padding:10px 15px;border:0;border-radius:11px;background:#0b5d3b;color:#fff;font:inherit;font-weight:800}.generator-offline{margin:0!important;padding-top:15px;border-top:1px solid #e3e8e4;font-size:14px}.generator-offline i{color:#13814f}.generator-quick-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:21px 0}.generator-quick-actions button{display:flex;flex-direction:column;align-items:center;gap:9px;min-height:92px;background:#edf6f1;color:#0b5d3b}.generator-quick-actions i{font-size:22px}@media print{.main-header,.main-footer,.generator-back,.generator-demo-ribbon,.generator-invoice footer{display:none!important}.generator-bill-page{padding:0;background:#fff}.generator-invoice{box-shadow:none}}@media(max-width:767px){.generator-hero{padding:126px 0 65px}.generator-hero p{font-size:17px}.generator-section{padding:62px 0}.generator-grid,.generator-steps,.generator-workspace-grid{grid-template-columns:1fr;gap:18px}.generator-steps{gap:28px}.generator-bill-page,.generator-workspace{padding:116px 0 55px}.generator-invoice>header,.generator-invoice footer,.generator-workspace-head{align-items:flex-start;flex-direction:column}.generator-invoice>header,.generator-bill-total,.generator-bill-meta,.generator-invoice footer{padding-left:22px;padding-right:22px}.generator-bill-meta,.generator-metrics{grid-template-columns:1fr}.generator-invoice details{margin-left:22px;margin-right:22px}.generator-bill-total strong{font-size:35px}.generator-workspace-nav{gap:18px}.generator-workspace-nav span{white-space:nowrap}.generator-search{flex-direction:column}}

.generator-loading,.generator-empty,.generator-receipt{max-width:680px;margin:55px auto;padding:42px 28px;border:1px solid #dce3de;border-radius:20px;background:#fff;text-align:center}.generator-loading>i,.generator-empty>i,.generator-receipt>i{color:#b1852f;font-size:42px}.generator-loading h1,.generator-loading h2,.generator-empty h2,.generator-receipt h2{margin:15px 0 8px;color:#17352d}.generator-loading p,.generator-empty p,.generator-receipt p{color:#66736e;line-height:1.8}.generator-workspace-nav a{color:inherit;white-space:nowrap;text-decoration:none}.generator-workspace-nav a:hover{color:#0b5d3b}.generator-state-links,.generator-flow-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}.generator-state-links a{padding:9px 13px;border:1px solid #d5dfd8;border-radius:10px;color:#0b5d3b;font-weight:700}.generator-flow-panel{max-width:760px;margin:30px auto}.generator-service-summary{position:relative;max-width:760px;margin:30px auto}.generator-service-summary>div>span{color:#9b752c;font-weight:800}.generator-service-summary> .generator-status{position:absolute;top:24px;inset-inline-end:24px}.generator-service-summary dl,.generator-receipt dl{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:25px 0}.generator-service-summary dl div,.generator-receipt dl div{padding:14px;border-radius:11px;background:#f7f5ec}.generator-service-summary dt,.generator-receipt dt{color:#66736e;font-size:13px}.generator-service-summary dd,.generator-receipt dd{margin:5px 0 0;color:#17352d;font-weight:800}.generator-field{display:grid;gap:8px;margin:23px 0}.generator-field span{color:#17352d;font-weight:800}.generator-field input{max-width:370px;padding:13px;border:1px solid #cbd7d0;border-radius:11px;font:inherit;font-size:18px}.generator-field small{color:#66736e;line-height:1.6}.generator-payment-preview{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:24px 0}.generator-payment-preview div{padding:15px;border-radius:11px;background:#f7f5ec}.generator-payment-preview span{display:block;color:#66736e;font-size:13px}.generator-payment-preview b{display:block;margin-top:5px;color:#17352d}.generator-offline-state{display:flex;align-items:flex-start;gap:18px;max-width:820px;margin:30px auto;padding:22px;border:1px solid #ead398;border-radius:16px;background:#fff9e8}.generator-offline-state>i{color:#9b752c;font-size:25px}.generator-offline-state strong{color:#17352d}.generator-offline-state p{margin:5px 0 0;color:#66736e;line-height:1.65}.generator-offline-state a{margin-inline-start:auto;color:#0b5d3b;font-weight:800;white-space:nowrap}@media(max-width:767px){.generator-service-summary> .generator-status{position:static;margin:15px 0}.generator-service-summary dl,.generator-payment-preview{grid-template-columns:1fr}.generator-offline-state{flex-direction:column}.generator-offline-state a{margin-inline-start:0}}

.generator-demo-tools,.generator-demo-actions{display:flex;align-items:center;flex-wrap:wrap;gap:10px}.generator-demo-tools label{color:#17352d;font-weight:700}.generator-demo-tools select,.generator-demo-actions input,.generator-demo-actions select{min-height:40px;padding:8px 10px;border:1px solid #cbd7d0;border-radius:9px;background:#fff;font:inherit}.generator-workspace-nav button{border:0;background:transparent;color:inherit;font:inherit;font-weight:700;white-space:nowrap;cursor:pointer}.generator-demo-panel{margin-top:28px}.generator-panel-title{display:flex;justify-content:space-between;gap:16px;align-items:center}.generator-demo-list{display:grid;gap:10px;margin-top:20px}.generator-demo-list>div{display:grid;grid-template-columns:minmax(150px,1fr) 2fr auto auto;gap:12px;align-items:center;padding:15px;border:1px solid #e0e6e1;border-radius:12px}.generator-demo-list span{color:#66736e}.generator-demo-list button,.generator-demo-actions button{padding:8px 12px;border:1px solid #0b5d3b;border-radius:9px;background:#fff;color:#0b5d3b;font:inherit;font-weight:700;cursor:pointer}.generator-demo-journey{display:flex;flex-wrap:wrap;gap:10px;list-style:none;padding:0}.generator-demo-journey li{padding:9px 12px;border-radius:999px;background:#edf6f1;color:#0b5d3b;font-weight:700}.generator-qr-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin:20px 0}.generator-qr-grid>div{display:grid;justify-items:center;gap:8px;text-align:center}.generator-fake-qr{display:grid;place-items:center;width:170px;height:170px;background:repeating-conic-gradient(#111 0 25%,#fff 0 50%) 50%/18px 18px;color:#0b5d3b;font-size:11px;font-weight:900;line-height:1.2;text-align:center;mix-blend-mode:normal}.generator-fake-qr::first-line{background:#fff}.generator-qr-grid code{max-width:100%;overflow-wrap:anywhere;color:#66736e}@media(max-width:767px){.generator-demo-tools{align-items:flex-start;flex-direction:column}.generator-demo-list>div{grid-template-columns:1fr}.generator-qr-grid{grid-template-columns:1fr}.generator-demo-actions{align-items:stretch}.generator-demo-actions input,.generator-demo-actions select{width:100%}}

.website-auth-actions {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-left: 28px;
}

.website-auth-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 104px;
    min-height: 48px;
    padding: 13px 22px;
    border-radius: 100px;
    border: 1px solid var(--accent-color);
    font-size: 16px;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    transition: all 0.25s ease;
}

.website-auth-btn-outline {
    color: var(--white-color);
    background: transparent;
}

.website-auth-btn-solid {
    color: var(--white-color);
    background: var(--accent-color);
}

.website-auth-btn:hover {
    color: var(--white-color);
    background: var(--primary-color);
    border-color: var(--primary-color);
}

html[dir="rtl"] .website-auth-actions {
    margin-left: 0;
    margin-right: 28px;
}

.contact-page-image {
    height: 100%;
    min-height: 680px;
}

.contact-page-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Legacy application pages that have not yet been moved to the Lenity layout. */
.page-hero {
    padding: 100px 7vw;
    background: var(--portal-ink);
    color: var(--portal-white);
    text-align: center;
}

.page-hero h1 { color: inherit; }
.section { max-width: 1500px; margin: 0 auto; padding: 95px 7vw; }
.prose p { color: var(--portal-muted); font-size: 18px; line-height: 1.8; }
.cards, .stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }

.card, .stats article {
    padding: 30px;
    border: 1px solid var(--portal-line);
    border-radius: 24px;
    background: var(--portal-white);
}

.stats article { display: flex; flex-direction: column; background: var(--portal-cream); }
.stats b { font-size: 40px; }
.form-wrap { max-width: 800px; }

.form-card {
    display: grid;
    gap: 20px;
    padding: 38px;
    border: 1px solid var(--portal-line);
    border-radius: 24px;
}

.form-card label { display: grid; gap: 8px; font-weight: 700; }

.form-card input, .form-card textarea, .form-card select {
    width: 100%;
    padding: 14px 16px;
    border: 1px solid #ccd6d0;
    border-radius: 12px;
}

.primary {
    display: inline-block;
    padding: 12px 18px;
    border: 0;
    border-radius: 99px;
    background: var(--accent-color);
    color: var(--primary-color);
    font-weight: 700;
    cursor: pointer;
}

.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 14px; border-bottom: 1px solid var(--portal-line); text-align: start; }
.badge { padding: 6px 10px; border-radius: 99px; background: #e7f3ed; }
.inline { display: inline; }

/* Keep the imported testimonial badge's center artwork still while its ring rotates. */
.helthcare-support-circle a {
    position: relative;
    line-height: 0;
}

.helthcare-support-circle a::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 54%;
    aspect-ratio: 1;
    border-radius: 50%;
    background: #fff url('../theme/lenity/images/healthcare-support-circle.svg') center / 185.2% no-repeat;
    transform: translate(-50%, -50%);
    pointer-events: none;
}

.about-us .about-us-images .need-fund-box {
    right: 0;
    bottom: 15px;
    width: 180px;
    height: 180px;
    min-width: 180px;
    min-height: 180px;
    max-width: 180px;
    max-height: 180px;
    padding: 22px 16px 16px;
    border-radius: 16px;
    box-sizing: border-box;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 7px;
}

.about-us .about-us-images .need-fund-box img {
    display: block;
    width: 60px;
    max-width: 60px;
    height: auto;
    margin: 0;
    position: relative;
    z-index: 1;
}

.about-us .about-us-images .need-fund-box .need-fund-title {
    position: relative;
    z-index: 1;
    margin: 0;
    width: 100%;
    max-height: 46px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.45;
    text-align: center;
}

.about-us .about-us-images .need-fund-box .need-fund-description {
    position: relative;
    z-index: 1;
    display: -webkit-box;
    width: 100%;
    max-height: 38px;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    color: #fff;
    font-size: 12px;
    line-height: 1.45;
    text-align: center;
}

.about-us .about-img-1 img {
    object-position: center 52%;
}

.about-us .about-img-2 img {
    object-position: center 70%;
}

.about-us .helped-fund-img figure {
    background: var(--brand-ivory);
}

.about-us .helped-fund-img img {
    object-fit: contain;
    object-position: center;
    padding: 8px;
}

@media (max-width: 991px) {
    html[dir="rtl"] .hero-content { margin-left: 0; }
    html[dir="rtl"] .hero.hero-slider-layout .hero-pagination { padding-right: 15px; }
    .mosque-hero-slide .hero-content {
        margin-right: 0;
        margin-left: 0;
    }

    .quran-hero-slide .hero-content {
        margin-right: 0;
        margin-left: 0;
    }

    .giving-hero-slide .hero-content {
        margin-right: 0;
        margin-left: 0;
    }

    .hero.hero-slider-layout .mosque-hero-slide .hero-slider-image img {
        object-position: left center;
    }

    html[dir] .hero.hero-slider-layout .quran-hero-slide::before {
        background: linear-gradient(90deg, rgba(11, 93, 59, 0.36) 0%, rgba(11, 93, 59, 0.78) 50%, rgba(11, 93, 59, 0.95) 100%),
            linear-gradient(0deg, rgba(11, 93, 59, 0.48) 0%, rgba(11, 93, 59, 0.16) 100%);
    }

    .hero.hero-slider-layout .quran-hero-slide .hero-slider-image img {
        object-position: left center;
    }

    html[dir] .hero.hero-slider-layout .giving-hero-slide::before {
        background: linear-gradient(90deg, rgba(11, 93, 59, 0.28) 0%, rgba(11, 93, 59, 0.7) 50%, rgba(11, 93, 59, 0.94) 100%),
            linear-gradient(0deg, rgba(11, 93, 59, 0.42) 0%, rgba(11, 93, 59, 0.14) 100%);
    }
    .cards, .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .contact-page-image { min-height: 420px; }
    .website-auth-actions {
        margin: 20px 0 0;
        justify-content: center;
    }

    :is(.public-website, body:has(> .main-header)) .navbar-brand img {
        height: 52px;
        max-width: 100px;
    }

    :is(.public-website, body:has(> .main-header)) .footer-logo img {
        height: 108px;
        max-width: 108px;
    }

    .about-us .about-us-images .need-fund-box {
        right: 0;
        bottom: 10px;
        width: 150px;
        height: 150px;
        min-width: 150px;
        min-height: 150px;
        max-width: 150px;
        max-height: 150px;
        padding: 15px;
        border-radius: 14px;
    }

    .about-us .about-us-images .need-fund-box img {
        width: 50px;
        max-width: 50px;
    }

    .about-us .about-us-images .need-fund-box .need-fund-title {
        max-height: 41px;
        font-size: 14px;
        line-height: 1.45;
    }

    .about-us .about-us-images .need-fund-box .need-fund-description {
        max-height: 34px;
        font-size: 11px;
    }
}

@media (max-width: 767px) {
    .section { padding: 65px 20px; }
    .cards, .stats { grid-template-columns: 1fr; }

    :is(.public-website, body:has(> .main-header)) .navbar-brand {
        padding: 5px 8px;
    }

    :is(.public-website, body:has(> .main-header)) .navbar-brand img {
        height: 44px;
        max-width: 86px;
    }

    .about-us .about-us-images .need-fund-box {
        right: 0;
        bottom: 5px;
        width: 120px;
        height: 120px;
        min-width: 120px;
        min-height: 120px;
        max-width: 120px;
        max-height: 120px;
        padding: 10px;
        border-radius: 12px;
    }

    .about-us .about-us-images .need-fund-box img {
        width: 35px;
        max-width: 35px;
    }

    .about-us .about-us-images .need-fund-box .need-fund-title {
        max-height: 33px;
        font-size: 12px;
        line-height: 1.35;
    }

    .about-us .about-us-images .need-fund-box .need-fund-description {
        max-height: 29px;
        font-size: 10px;
        line-height: 1.35;
    }
}

/* Keep the final mobile rules after the approved desktop/tablet presentation rules. */
@media only screen and (max-width: 767px) {
    .hero.hero-slider-layout .hero-slide { min-height: 100svh; min-height: 100dvh; padding-top: max(112px, calc(84px + env(safe-area-inset-top))); padding-bottom: max(42px, calc(24px + env(safe-area-inset-bottom))); }
    .hero.hero-slider-layout .hero-content { max-width: min(100%, 34rem); margin-inline: 0; }
    .hero.hero-slider-layout .hero-body h1, .page-header .page-header-box h1 { font-size: clamp(2rem, 9vw, 3rem); line-height: 1.12; overflow-wrap: anywhere; }
    .hero.hero-slider-layout .hero-pagination { inset-inline: auto 16px; }
    html[dir="rtl"] .hero.hero-slider-layout .hero-pagination { inset-inline: 16px auto; }
    .page-header { min-height: min(42svh, 310px); padding-top: max(110px, calc(82px + env(safe-area-inset-top))); padding-bottom: 48px; }
    .contact-page-temp .contact-form-section .contact-form-box { padding: clamp(36px, 9vw, 56px) clamp(16px, 5vw, 24px); }
    .contact-page-temp .contact-form-section .contact-form .form-control { min-height: 48px; padding: 12px 16px; font-size: 16px; }
    .contact-page-temp .map-placeholder { min-height: 300px; padding: 24px 16px; }
    .main-header .navbar-brand img { width: clamp(66px, 19vw, 88px); height: auto; }
    .wow { visibility: visible; }
}

@media only screen and (max-width: 767px) and (orientation: landscape) {
    .hero.hero-slider-layout .hero-slide { min-height: 100svh; min-height: 100dvh; padding-top: max(88px, calc(64px + env(safe-area-inset-top))); }
    .hero.hero-slider-layout .hero-body h1 { font-size: clamp(1.8rem, 5vw, 2.6rem); }
    .page-header { min-height: 240px; padding-top: max(88px, calc(64px + env(safe-area-inset-top))); }
}

/* News and Events keep readable shared navigation above their light page content. */
.public-website:is(.news-reader-page,.events-reader-page,:has(.ln-page > .ln[data-mode]),:has(> main > .events-page-intro)) .main-header {
    position: relative;
    background: #f5f7f3;
    border-bottom: 1px solid #dce5dc;
}
.public-website:is(.news-reader-page,.events-reader-page,:has(.ln-page > .ln[data-mode]),:has(> main > .events-page-intro)) .main-header .header-sticky {
    background: #f5f7f3f5;
}
.public-website:is(.news-reader-page,.events-reader-page,:has(.ln-page > .ln[data-mode]),:has(> main > .events-page-intro)) .main-header .nav-link {
    color: #174c38;
}
.public-website:is(.news-reader-page,.events-reader-page,:has(.ln-page > .ln[data-mode]),:has(> main > .events-page-intro)) .main-header .nav-link:hover {
    color: #087451;
}
.public-website:is(.news-reader-page,.events-reader-page,:has(.ln-page > .ln[data-mode]),:has(> main > .events-page-intro)) .main-header .main-menu ul ul .nav-link {
    color: #fff;
}
.public-website:is(.news-reader-page,.events-reader-page,:has(.ln-page > .ln[data-mode]),:has(> main > .events-page-intro)) .main-header .slicknav_icon-bar {
    background: #174c38;
}

/* Light headings stay readable over the shared photographic page banners. */
.public-website .page-header .page-header-box h1,
.public-website .page-header .page-header-box h1 span {
    color: var(--brand-card, #FFFFFF);
    text-shadow: 0 2px 12px rgb(0 0 0 / 35%);
}

.public-website .services-page-header .services-banner-eyebrow,
.public-website .causes-page-header .causes-banner-eyebrow,
.public-website .team-page-header .team-banner-eyebrow,
.public-website .gallery-page-header .gallery-banner-eyebrow,
.public-website .news-page-header .news-banner-eyebrow {
    display:block; margin-bottom:12px; color:var(--brand-card,#FFFFFF);
}
.public-website .services-page-header .page-header-box p,
.public-website .causes-page-header .page-header-box p,
.public-website .team-page-header .page-header-box p,
.public-website .gallery-page-header .page-header-box p,
.public-website .news-page-header .page-header-box p {
    max-width:760px; margin:12px 0 0; color:var(--brand-card,#FFFFFF);
}

.public-website .events-page-intro { background:var(--brand-ivory,#F7F4EC); }
.public-website .events-page-intro a { color:var(--brand-primary,#0B5D3B); text-underline-offset:4px; }

.public-website:is(.news-reader-page,.events-reader-page,:has(.ln-page > .ln[data-mode]),:has(> main > .events-page-intro)):has(> main > .events-page-intro) .main-header,
.public-website:is(.news-reader-page,.events-reader-page,:has(.ln-page > .ln[data-mode]),:has(> main > .events-page-intro)):has(> main > .events-page-intro) .main-header .header-sticky {
    background:var(--brand-ivory,#F7F4EC);
}

.public-website .team-page-content .cards { grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr)); }

/* Illustrated service cards keep participation actions aligned in both languages. */
.public-website .services-page-content .card { display:flex; flex-direction:column; padding:0; overflow:hidden; transition:transform .25s ease,box-shadow .25s ease; }
.public-website .services-page-content .card:hover { transform:translateY(-5px); box-shadow:0 18px 42px #163e2914; }
.public-website .service-program-image { width:100%; aspect-ratio:16/10; overflow:hidden; background:var(--brand-primary,#0B5D3B); }
.public-website .service-program-image img { display:block; width:100%; height:100%; object-fit:cover; }
.public-website .service-program-copy { padding:30px; display:flex; flex-direction:column; align-items:flex-start; flex:1; width:100%; }
.public-website .services-page-content .service-participate-link { margin-top:auto; }
.public-website .services-page-content .card p { margin-bottom:24px; }
@media (max-width:767px) { .public-website .service-program-copy { padding:24px; } }
@media (prefers-reduced-motion:reduce) { .public-website .services-page-content .card { transition:none; } .public-website .services-page-content .card:hover { transform:none; } }
.public-website #donate-us { scroll-margin-top:120px; }

/* Keep the verse on one continuous moving line with room for diacritics. */
.public-website .quran-giving-ticker { padding:32px 24px; }
.public-website .quran-giving-ticker .scrolling-ticker-box { overflow:hidden; }
.public-website .quran-giving-ticker .scrolling-content { flex-wrap:nowrap; animation-duration:var(--marquee-duration,50000ms); }
.public-website .quran-giving-ticker .scrolling-ticker-box[data-direction="left"] .scrolling-content { animation-direction:normal; }
.public-website .quran-giving-ticker .scrolling-ticker-box[data-direction="right"] .scrolling-content { animation-direction:reverse; }
.public-website .quran-giving-ticker .scrolling-ticker-box[data-pause-on-hover="true"]:hover .scrolling-content { animation-play-state:paused; }
.public-website .quran-giving-ticker .scrolling-content .quran-giving-ticker-verse { padding-block:.35em; line-height:2.3; white-space:nowrap; }
@media (prefers-reduced-motion:reduce) {
    .public-website .quran-giving-ticker .scrolling-ticker-box { overflow-x:auto; }
    .public-website .quran-giving-ticker .scrolling-content { animation:none; }
    .public-website .quran-giving-ticker .scrolling-content[aria-hidden="true"] { display:none; }
}

/* About approach keeps a plain cream background without the cross motif. */
.public-website .about-page-temp .our-approach { background-image:none; }

/* Home news previews use the same wide image-and-story shape as the news feed. */
.public-website .home-news-stories { display:grid; grid-template-columns:minmax(0,1fr); gap:28px; overflow:visible; margin:0; padding:0; }
.home-news-story-link { display:block; color:inherit; text-decoration:none; border-radius:28px; }
.home-news-story-card { display:grid; grid-template-columns:1.15fr 1fr; overflow:hidden; border:1px solid #dfe7df; border-radius:28px; background:#fff; box-shadow:0 12px 36px #18352a06; transition:box-shadow .25s ease; }
.home-news-story-link:hover .home-news-story-card { box-shadow:0 18px 42px #18352a14; }
.home-news-story-image { margin:0; aspect-ratio:16/10; min-width:0; height:100%; overflow:hidden; }
.home-news-story-image img { display:block; width:100%; height:100%; object-fit:cover; }
.home-news-story-copy { min-width:0; padding:clamp(26px,3.5vw,56px); display:flex; flex-direction:column; justify-content:center; gap:22px; }
.home-news-story-category { color:#72836f; font-size:13px; font-weight:600; }
.home-news-story-copy h3 { margin:0; color:#143f30; font-size:clamp(25px,3vw,44px); line-height:1.4; overflow-wrap:anywhere; }
.home-news-story-copy p { margin:0; color:#65756b; font-size:17px; line-height:1.85; }
.home-news-story-action { display:flex; justify-content:space-between; align-items:center; gap:20px; padding-top:20px; border-top:1px solid #e3e9e1; color:#143f30; font-weight:650; }
.home-news-story-arrow { display:grid; place-items:center; width:46px; height:46px; border:1px solid #dfe7dc; border-radius:50%; background:#edf3e8; font-size:25px; flex:none; }
.home-news-story-link:focus-visible { outline:3px solid var(--brand-accent,#C89B3C); outline-offset:5px; }
@media(max-width:767px) { .home-news-story-card { grid-template-columns:minmax(0,1fr); border-radius:22px; } .home-news-story-image { height:auto; aspect-ratio:16/10; } .home-news-story-copy { padding:25px; gap:16px; } .home-news-story-copy p { font-size:15px; } }
@media(prefers-reduced-motion:reduce) { .home-news-story-card { transition:none; } }
