/* ======================================================================
   WWHO 2026 — Internal Pages Redesign v2
   A deliberately different visual system from the legacy site:
   editorial page bands, flatter geometry, split cards, stronger typography,
   asymmetric grids and unified forms/payment/profile surfaces.
   Loaded ONLY on non-home pages, after all legacy/page CSS.
   ====================================================================== */

:root {
    --ir-blue: #0758bd;
    --ir-blue-deep: #073a82;
    --ir-navy: #0a2347;
    --ir-ink: #13243b;
    --ir-copy: #45566f;
    --ir-muted: #738197;
    --ir-line: #d9e4f0;
    --ir-line-strong: #c7d7e8;
    --ir-surface: #ffffff;
    --ir-canvas: #f3f7fb;
    --ir-canvas-blue: #eaf2fb;
    --ir-accent: #27a4d8;
    --ir-warm: #f6b640;
    --ir-success: #2a9f68;
    --ir-shadow: 0 22px 55px rgba(10,35,71,.10);
    --ir-shadow-soft: 0 10px 30px rgba(10,35,71,.07);
    --ir-radius: 14px;
}

.site-inner-v2 {
    background:
        linear-gradient(180deg, #eef4fa 0, #f7f9fc 250px, #fff 680px) !important;
    color: var(--ir-copy);
}

.site-inner-v2 .wwho-inner-ribbon {
    height: 8px;
    display: grid;
    grid-template-columns: 1fr 1.45fr .55fr;
    overflow: hidden;
    background: var(--ir-blue);
}
.site-inner-v2 .wwho-inner-ribbon span:nth-child(1) { background: var(--ir-blue-deep); }
.site-inner-v2 .wwho-inner-ribbon span:nth-child(2) { background: var(--ir-blue); }
.site-inner-v2 .wwho-inner-ribbon span:nth-child(3) { background: var(--ir-accent); }

.site-inner-v2 .site-header {
    border-bottom: 0 !important;
    box-shadow: 0 3px 18px rgba(10,35,71,.06) !important;
}

.site-inner-v2 h1,
.site-inner-v2 h2,
.site-inner-v2 h3,
.site-inner-v2 h4,
.site-inner-v2 h5,
.site-inner-v2 h6 {
    color: var(--ir-navy) !important;
}

.site-inner-v2 main,
.site-inner-v2 .inner-page,
.site-inner-v2 .page-content {
    position: relative;
}

.site-inner-v2 main::before,
.site-inner-v2 .inner-page::before {
    content: "";
    position: absolute;
    width: 320px;
    height: 320px;
    right: -190px;
    top: 60px;
    border: 52px solid rgba(7,88,189,.04);
    border-radius: 50%;
    pointer-events: none;
    z-index: 0;
}
html[dir="rtl"] .site-inner-v2 main::before,
html[dir="rtl"] .site-inner-v2 .inner-page::before {
    right: auto;
    left: -190px;
}

.site-inner-v2 .container,
.site-inner-v2 .main-container,
.site-inner-v2 .program-container,
.site-inner-v2 .sp-container {
    position: relative;
    z-index: 1;
}

/* ---------- Common editorial language ---------- */
.site-inner-v2 .campaign-hero,
.site-inner-v2 .ym-blog-head,
.site-inner-v2 .events-index-hero,
.site-inner-v2 .gallery-hero-box,
.site-inner-v2 .album-show-header,
.site-inner-v2 .faq-hero,
.site-inner-v2 .ways-hero,
.site-inner-v2 .contact-hero,
.site-inner-v2 .static-page-hero,
.site-inner-v2 .ig-hero,
.site-inner-v2 .sp-hero {
    position: relative !important;
    overflow: hidden !important;
    background: var(--ir-navy) !important;
    border: 0 !important;
    border-radius: 0 0 34px 34px !important;
    box-shadow: none !important;
    color: #fff !important;
}

.site-inner-v2 .campaign-hero::after,
.site-inner-v2 .ym-blog-head::after,
.site-inner-v2 .events-index-hero::after,
.site-inner-v2 .gallery-hero-box::after,
.site-inner-v2 .faq-hero::after,
.site-inner-v2 .ways-hero::after,
.site-inner-v2 .contact-hero::after,
.site-inner-v2 .static-page-hero::after,
.site-inner-v2 .ig-hero::after,
.site-inner-v2 .sp-hero::after {
    content: "";
    position: absolute;
    width: 240px;
    height: 240px;
    border: 42px solid rgba(255,255,255,.08);
    border-radius: 50%;
    right: -80px;
    top: -100px;
    pointer-events: none;
}

.site-inner-v2 .campaign-hero h1,
.site-inner-v2 .campaign-hero h2,
.site-inner-v2 .ym-blog-title,
.site-inner-v2 .events-index-hero h1,
.site-inner-v2 .gallery-hero-box h1,
.site-inner-v2 .faq-hero h1,
.site-inner-v2 .ways-hero h1,
.site-inner-v2 .contact-hero h1,
.site-inner-v2 .static-page-heading,
.site-inner-v2 .ig-hero h1,
.site-inner-v2 .sp-hero h1 {
    color: #fff !important;
    font-weight: 900 !important;
    letter-spacing: -.03em !important;
}

.site-inner-v2 .campaign-hero .small-muted,
.site-inner-v2 .ym-blog-subtitle,
.site-inner-v2 .events-index-hero p,
.site-inner-v2 .gallery-hero-box p,
.site-inner-v2 .faq-hero p,
.site-inner-v2 .ways-hero p,
.site-inner-v2 .contact-hero p,
.site-inner-v2 .static-page-hero p,
.site-inner-v2 .ig-hero p,
.site-inner-v2 .sp-hero p {
    color: rgba(255,255,255,.78) !important;
}

.site-inner-v2 .main-title-big {
    font-size: clamp(1.9rem, 3.5vw, 3rem) !important;
    letter-spacing: -.035em !important;
}

.site-inner-v2 .btn,
.site-inner-v2 button,
.site-inner-v2 .main-btn,
.site-inner-v2 .default-btn,
.site-inner-v2 .program-btn,
.site-inner-v2 .ap-btn-primary,
.site-inner-v2 .way-action {
    border-radius: 8px !important;
}

.site-inner-v2 .btn-primary,
.site-inner-v2 .btn-brand,
.site-inner-v2 .main-btn,
.site-inner-v2 .default-btn,
.site-inner-v2 .program-btn.primary,
.site-inner-v2 .ap-btn-primary,
.site-inner-v2 .way-action {
    background: var(--ir-blue) !important;
    border-color: var(--ir-blue) !important;
    color: #fff !important;
    box-shadow: none !important;
}
.site-inner-v2 .btn-primary:hover,
.site-inner-v2 .btn-brand:hover,
.site-inner-v2 .main-btn:hover,
.site-inner-v2 .default-btn:hover,
.site-inner-v2 .program-btn.primary:hover,
.site-inner-v2 .ap-btn-primary:hover,
.site-inner-v2 .way-action:hover {
    background: var(--ir-blue-deep) !important;
    border-color: var(--ir-blue-deep) !important;
}

.site-inner-v2 .form-control,
.site-inner-v2 .form-select,
.site-inner-v2 textarea,
.site-inner-v2 input[type="text"],
.site-inner-v2 input[type="email"],
.site-inner-v2 input[type="password"],
.site-inner-v2 input[type="number"],
.site-inner-v2 input[type="tel"] {
    min-height: 48px;
    border: 1px solid var(--ir-line-strong) !important;
    border-radius: 8px !important;
    background: #fff !important;
    color: var(--ir-ink) !important;
    box-shadow: none !important;
}
.site-inner-v2 .form-control:focus,
.site-inner-v2 .form-select:focus,
.site-inner-v2 textarea:focus,
.site-inner-v2 input:focus {
    border-color: var(--ir-blue) !important;
    box-shadow: 0 0 0 3px rgba(7,88,189,.09) !important;
}

.site-inner-v2 .card,
.site-inner-v2 .soft-card,
.site-inner-v2 .glass {
    border-color: var(--ir-line) !important;
    border-radius: var(--ir-radius) !important;
    box-shadow: var(--ir-shadow-soft) !important;
}

/* ---------- Campaigns + Appeals listing: horizontal editorial cards ---------- */
.route-campaigns-index .container.py-4,
.route-campaigns-program .container.py-4,
.route-appeals-index .main-container,
.route-appeals-program .main-container {
    width: min(1260px, calc(100% - 34px)) !important;
    max-width: none !important;
    padding-top: 42px !important;
    padding-bottom: 80px !important;
}

.route-campaigns-index .campaign-hero,
.route-campaigns-program .campaign-hero {
    padding: 42px 46px !important;
    margin: 0 0 28px !important;
}

.route-campaigns-index .container.py-4 > .row,
.route-campaigns-program .container.py-4 > .row,
.route-appeals-index .main-container > .row,
.route-appeals-program .main-container > .row {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 18px !important;
}

.route-campaigns-index .container.py-4 > .row > [class*="col-lg-3"],
.route-campaigns-program .container.py-4 > .row > [class*="col-lg-3"],
.route-appeals-index .main-container > .row > [class*="col-lg-3"],
.route-appeals-program .main-container > .row > [class*="col-lg-3"] {
    width: 100% !important;
    max-width: none !important;
    order: 0 !important;
}
.route-campaigns-index .container.py-4 > .row > [class*="col-lg-9"],
.route-campaigns-program .container.py-4 > .row > [class*="col-lg-9"],
.route-appeals-index .main-container > .row > [class*="col-lg-9"],
.route-appeals-program .main-container > .row > [class*="col-lg-9"] {
    width: 100% !important;
    max-width: none !important;
    order: 1 !important;
}

.site-inner-v2 .sidebar-card,
.site-inner-v2 .campaigns-sidebar {
    position: static !important;
    padding: 14px !important;
    border: 1px solid var(--ir-line) !important;
    border-radius: 12px !important;
    background: #fff !important;
    box-shadow: none !important;
}
.site-inner-v2 .sidebar-card h5,
.site-inner-v2 .campaigns-sidebar .sidebar-title {
    display: none !important;
}
.site-inner-v2 .sidebar-card .d-grid,
.site-inner-v2 .sidebar-category-list {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin: 0 !important;
}
.site-inner-v2 .category-link,
.site-inner-v2 .sidebar-category-list a {
    min-height: 38px !important;
    padding: 8px 13px !important;
    border: 1px solid var(--ir-line) !important;
    border-radius: 999px !important;
    background: #fff !important;
    color: var(--ir-ink) !important;
    font-size: .8rem !important;
    font-weight: 800 !important;
}
.site-inner-v2 .category-link.active,
.site-inner-v2 .sidebar-category-list a.active,
.site-inner-v2 .category-link:hover,
.site-inner-v2 .sidebar-category-list a:hover {
    background: var(--ir-navy) !important;
    border-color: var(--ir-navy) !important;
    color: #fff !important;
}

.site-inner-v2 .filter-card,
.site-inner-v2 .campaigns-header {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 6px 0 14px !important;
}

.route-campaigns-index .col-lg-9 > .row.g-3,
.route-campaigns-program .col-lg-9 > .row.g-3,
.route-appeals-index .col-lg-9 > .row.g-4,
.route-appeals-program .col-lg-9 > .row.g-4 {
    --bs-gutter-x: 18px;
    --bs-gutter-y: 18px;
}
.route-campaigns-index .col-lg-9 > .row.g-3 > [class*="col-"],
.route-campaigns-program .col-lg-9 > .row.g-3 > [class*="col-"],
.route-appeals-index .col-lg-9 > .row.g-4 > [class*="col-"],
.route-appeals-program .col-lg-9 > .row.g-4 > [class*="col-"] {
    width: 50% !important;
}

.site-inner-v2 .campaign-card,
.site-inner-v2 .campaign-card-link .campaign-card {
    display: grid !important;
    grid-template-columns: 43% 57% !important;
    min-height: 250px !important;
    height: 100% !important;
    border: 1px solid var(--ir-line) !important;
    border-radius: 12px !important;
    background: #fff !important;
    box-shadow: none !important;
    overflow: hidden !important;
    transform: none !important;
}
.site-inner-v2 .campaign-card:hover {
    border-color: #b8cee5 !important;
    box-shadow: var(--ir-shadow-soft) !important;
    transform: translateY(-2px) !important;
}
.site-inner-v2 .campaign-img-link,
.site-inner-v2 .campaign-card-img-wrap {
    width: 100% !important;
    height: 100% !important;
    min-height: 250px !important;
}
.site-inner-v2 .campaign-img,
.site-inner-v2 .campaign-card-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}
.site-inner-v2 .campaign-card-body {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    padding: 23px !important;
}
.site-inner-v2 .campaign-card-body h3,
.site-inner-v2 .campaign-card h3,
.site-inner-v2 .campaign-card h5 {
    font-size: 1.15rem !important;
    line-height: 1.35 !important;
    margin-bottom: 10px !important;
}
.site-inner-v2 .badge-category,
.site-inner-v2 .campaign-card-country-badge {
    border-radius: 4px !important;
    background: rgba(7,35,72,.88) !important;
}
.site-inner-v2 .btn-primary-soft {
    border-radius: 7px !important;
    background: var(--ir-canvas-blue) !important;
    color: var(--ir-blue-deep) !important;
    border: 1px solid #cfe0f3 !important;
}

/* ---------- Campaign / Appeal detail: gallery + sticky action panel ---------- */
.route-campaigns-show .campaign-show-page,
.route-appeals-show .campaign-show-page {
    padding: 42px 0 90px !important;
    background: transparent !important;
}
.route-campaigns-show .main-container,
.route-appeals-show .main-container {
    width: min(1260px, calc(100% - 34px)) !important;
}
.site-inner-v2 .campaign-card-style.campaign-details-layout {
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}
.site-inner-v2 .campaign-details-layout > .row {
    align-items: start !important;
}
.site-inner-v2 .campaign-gallery-main,
.site-inner-v2 .campaign-gallery-main.campaign-gallery-disabled-full {
    border-radius: 12px !important;
    box-shadow: var(--ir-shadow) !important;
    overflow: hidden !important;
}
.site-inner-v2 .project-desktop-title,
.site-inner-v2 .project-mobile-title {
    font-size: clamp(2rem, 4vw, 3.7rem) !important;
    line-height: 1.02 !important;
    letter-spacing: -.04em !important;
    margin-bottom: 18px !important;
}
.site-inner-v2 .project-place {
    display: inline-flex !important;
    width: auto !important;
    padding: 7px 10px !important;
    border-radius: 6px !important;
    background: var(--ir-canvas-blue) !important;
    color: var(--ir-blue-deep) !important;
    font-size: .78rem !important;
    font-weight: 800 !important;
}
.site-inner-v2 .share-btn {
    width: 42px !important;
    height: 42px !important;
    border: 1px solid var(--ir-line) !important;
    border-radius: 8px !important;
    background: #fff !important;
}
.site-inner-v2 .campaign-description-prices,
.site-inner-v2 .campaign-price-card,
.site-inner-v2 .campaign-donation-disabled-card,
.site-inner-v2 .donation-box,
.site-inner-v2 .donation-card {
    border: 1px solid var(--ir-line) !important;
    border-radius: 12px !important;
    background: #fff !important;
    box-shadow: var(--ir-shadow-soft) !important;
}
.site-inner-v2 .campaign-description-prices {
    border-inline-start: 5px solid var(--ir-blue) !important;
}
.site-inner-v2 .content-styled {
    color: var(--ir-copy) !important;
    font-size: 1.02rem !important;
    line-height: 1.95 !important;
}
.site-inner-v2 .content-styled h2,
.site-inner-v2 .content-styled h3 {
    margin-top: 2em !important;
    padding-top: .35em;
    border-top: 1px solid var(--ir-line);
}

/* ---------- About page: editorial manifesto style ---------- */
.route-about-show .ap {
    background: #fff !important;
}
.route-about-show .ap-hero {
    min-height: 590px !important;
    margin: 0 !important;
    border-radius: 0 !important;
}
.route-about-show .ap-hero-overlay {
    background: linear-gradient(90deg, rgba(5,28,58,.92), rgba(5,28,58,.58) 46%, rgba(5,28,58,.08)) !important;
}
html[dir="rtl"] .route-about-show .ap-hero-overlay {
    background: linear-gradient(270deg, rgba(5,28,58,.92), rgba(5,28,58,.58) 46%, rgba(5,28,58,.08)) !important;
}
.route-about-show .ap-hero-content {
    max-width: 700px !important;
    margin: 0 !important;
}
.route-about-show .ap-hero-content h1,
.route-about-show .ap-hero-content h2 { color: #fff !important; }
.route-about-show .ap-section {
    padding: 86px 0 !important;
}
.route-about-show .ap-section.soft {
    background: var(--ir-canvas) !important;
}
.route-about-show .ap-intro-grid {
    gap: 70px !important;
    align-items: center !important;
}
.route-about-show .ap-image-main {
    border-radius: 8px !important;
    box-shadow: 28px 28px 0 var(--ir-canvas-blue) !important;
}
.route-about-show .ap-image-badge {
    border-radius: 8px !important;
    background: var(--ir-blue) !important;
    color: #fff !important;
}
.route-about-show .ap-vmv-grid > *,
.route-about-show .ap-values-grid > *,
.route-about-show .ap-stat-card {
    border: 1px solid var(--ir-line) !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: none !important;
}

/* ---------- Program detail: magazine-like split layout ---------- */
.route-programs-show .program-human-page {
    background: #fff !important;
}
.route-programs-show .program-hero-new {
    min-height: 560px !important;
    display: flex !important;
    align-items: end !important;
    padding: 74px 0 !important;
    border-radius: 0 !important;
}
.route-programs-show .program-hero-new::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(5,28,58,.94), rgba(5,28,58,.48) 54%, transparent) !important;
    z-index: 0;
}
html[dir="rtl"] .route-programs-show .program-hero-new::after {
    background: linear-gradient(270deg, rgba(5,28,58,.94), rgba(5,28,58,.48) 54%, transparent) !important;
}
.route-programs-show .program-hero-content { position: relative; z-index: 1; max-width: 720px !important; }
.route-programs-show .program-hero-title { color: #fff !important; font-size: clamp(2.8rem,5vw,5.3rem) !important; }
.route-programs-show .program-hero-lead { color: rgba(255,255,255,.85) !important; }
.route-programs-show .floating-impact-strip {
    margin-top: -36px !important;
    position: relative !important;
    z-index: 4 !important;
}
.route-programs-show .impact-strip-card {
    border: 0 !important;
    border-radius: 10px !important;
    background: var(--ir-navy) !important;
    color: #fff !important;
    box-shadow: var(--ir-shadow) !important;
}
.route-programs-show .impact-strip-card h3,
.route-programs-show .impact-strip-card strong { color: #fff !important; }
.route-programs-show .program-section-new { padding: 86px 0 !important; }
.route-programs-show .human-split { gap: 64px !important; }
.route-programs-show .human-image { border-radius: 8px !important; }
.route-programs-show .human-note { border-radius: 8px !important; border-inline-start: 5px solid var(--ir-blue) !important; }

/* ---------- Blog/news: featured story becomes editorial strip ---------- */
.route-blogs-index .ym-blog-listing-section,
.route-blogs-category .ym-blog-listing-section {
    padding: 0 0 88px !important;
    background: transparent !important;
}
.route-blogs-index .ym-blog-head,
.route-blogs-category .ym-blog-head {
    margin: 0 calc(50% - 50vw) 34px !important;
    padding: 64px max(calc((100vw - 1180px)/2), 24px) !important;
    width: 100vw !important;
    border-radius: 0 0 36px 36px !important;
}
.site-inner-v2 .ym-blog-eyebrow,
.site-inner-v2 .ym-blog-badge,
.site-inner-v2 .blog-category-badge { color: var(--ir-accent) !important; }
.site-inner-v2 .content-hub-tabs {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin-bottom: 28px !important;
}
.site-inner-v2 .hub-tab {
    border-radius: 999px !important;
    box-shadow: none !important;
}
.site-inner-v2 .hub-featured-card {
    border: 0 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    background: var(--ir-navy) !important;
    box-shadow: var(--ir-shadow) !important;
}
.site-inner-v2 .hub-featured-card .hub-featured-content {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    padding: clamp(28px,5vw,60px) !important;
}
.site-inner-v2 .hub-featured-card h2,
.site-inner-v2 .hub-featured-card h3 { color: #fff !important; }
.site-inner-v2 .hub-featured-card p,
.site-inner-v2 .hub-featured-card .hub-date { color: rgba(255,255,255,.72) !important; }
.site-inner-v2 .ym-blog-card,
.site-inner-v2 .related-blog-card {
    border-radius: 10px !important;
    border: 1px solid var(--ir-line) !important;
    box-shadow: none !important;
}
.site-inner-v2 .ym-blog-card:hover,
.site-inner-v2 .related-blog-card:hover { box-shadow: var(--ir-shadow-soft) !important; }

.route-blogs-show .blog-cover-hero {
    width: 100% !important;
    max-width: none !important;
    min-height: 640px !important;
    margin: 0 !important;
    border-radius: 0 0 42px 42px !important;
    box-shadow: none !important;
}
.route-blogs-show .blog-cover-overlay {
    background: linear-gradient(0deg, rgba(5,28,58,.94), rgba(5,28,58,.22) 72%) !important;
}
.route-blogs-show .blog-cover-content {
    width: min(1040px, calc(100% - 40px)) !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    bottom: 62px !important;
}
.route-blogs-show .blog-article-shell {
    width: min(900px, calc(100% - 34px)) !important;
    margin-top: -26px !important;
    position: relative !important;
    z-index: 3 !important;
    border-radius: 10px !important;
    border-top: 6px solid var(--ir-blue) !important;
}

/* ---------- Events / webinars ---------- */
.route-events-index .events-index-page {
    padding: 0 0 88px !important;
    background: transparent !important;
}
.route-events-index .events-index-hero {
    margin: 0 calc(50% - 50vw) 36px !important;
    padding: 62px max(calc((100vw - 1180px)/2), 24px) !important;
    width: 100vw !important;
    border-radius: 0 0 36px 36px !important;
}
.site-inner-v2 .event-featured-cover {
    height: clamp(430px,62vh,700px) !important;
    border-radius: 12px !important;
}
.site-inner-v2 .poster-event-card {
    border-radius: 10px !important;
    border: 1px solid var(--ir-line) !important;
    box-shadow: none !important;
}
.site-inner-v2 .poster-event-card:hover { box-shadow: var(--ir-shadow-soft) !important; transform: translateY(-2px); }
.route-events-show .event-show-page { padding: 0 0 90px !important; background: transparent !important; }
.route-events-show .event-cover-hero {
    width: 100% !important;
    max-width: none !important;
    height: clamp(520px,68vh,720px) !important;
    margin: 0 !important;
    border-radius: 0 0 42px 42px !important;
}
.route-events-show .event-content {
    margin-top: -34px !important;
    position: relative;
    z-index: 3;
    border-radius: 10px !important;
    border-top: 6px solid var(--ir-accent) !important;
}

/* ---------- Photo albums: masonry-ish visual grid ---------- */
.route-photo-albums-index .gallery-index-page {
    padding: 0 0 90px !important;
    background: transparent !important;
}
.route-photo-albums-index .gallery-hero-box {
    margin: 0 calc(50% - 50vw) 34px !important;
    padding: 62px max(calc((100vw - 1180px)/2), 24px) !important;
    width: 100vw !important;
    border-radius: 0 0 36px 36px !important;
}
.site-inner-v2 .gallery-albums-grid {
    display: grid !important;
    grid-template-columns: repeat(12, minmax(0,1fr)) !important;
    grid-auto-rows: 115px !important;
    gap: 14px !important;
}
.site-inner-v2 .gallery-album-card {
    grid-column: span 4 !important;
    grid-row: span 3 !important;
    border-radius: 10px !important;
    box-shadow: none !important;
}
.site-inner-v2 .gallery-album-card.featured {
    grid-column: span 8 !important;
    grid-row: span 4 !important;
}
.site-inner-v2 .gallery-album-overlay { background: linear-gradient(0deg,rgba(5,28,58,.88),rgba(5,28,58,.05) 70%) !important; }
.route-photo-albums-show .album-show-section { padding: 46px 0 90px !important; background: transparent !important; }
.route-photo-albums-show .album-show-header {
    padding: 42px !important;
    border-radius: 12px !important;
    background: var(--ir-navy) !important;
}
.route-photo-albums-show .album-show-header h1,
.route-photo-albums-show .album-show-header .main-title-big { color: #fff !important; }
.site-inner-v2 .album-show-image,
.site-inner-v2 .album-card { border-radius: 8px !important; }

/* ---------- Islamic giving ---------- */
.route-islamic-giving-index .ig-page,
.route-islamic-giving-kind .ig-page,
.route-islamic-giving-show .ig-page {
    background: transparent !important;
}
.route-islamic-giving-index .ig-hero,
.route-islamic-giving-kind .ig-hero,
.route-islamic-giving-show .ig-hero {
    padding: 64px 0 !important;
    border-radius: 0 0 38px 38px !important;
}
.site-inner-v2 .ig-kind-pills {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}
.site-inner-v2 .ig-kind-pill {
    border-radius: 999px !important;
    border: 1px solid rgba(255,255,255,.25) !important;
}
.site-inner-v2 .ig-kind-pill.active { background: #fff !important; color: var(--ir-navy) !important; }
.site-inner-v2 .ig-grid {
    gap: 16px !important;
}
.site-inner-v2 .ig-card {
    border: 1px solid var(--ir-line) !important;
    border-radius: 10px !important;
    box-shadow: none !important;
    overflow: hidden;
}
.site-inner-v2 .ig-card:hover { box-shadow: var(--ir-shadow-soft) !important; transform: translateY(-2px); }
.site-inner-v2 .ig-content-card,
.site-inner-v2 .ig-donate-frame {
    border: 1px solid var(--ir-line) !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: var(--ir-shadow-soft) !important;
}
.site-inner-v2 .ig-donate-frame { border-top: 6px solid var(--ir-blue) !important; }

/* ---------- Sponsorship pages ---------- */
.route-sponsorships-index .sp-page { background: transparent !important; }
.route-sponsorships-index .sp-hero {
    padding: 72px 0 !important;
    border-radius: 0 0 40px 40px !important;
}
.site-inner-v2 .sp-quick {
    border-radius: 10px !important;
    border: 1px solid rgba(255,255,255,.2) !important;
    background: rgba(255,255,255,.10) !important;
    color: #fff !important;
    backdrop-filter: blur(9px);
}
.site-inner-v2 .sp-section { padding: 68px 0 88px !important; }
.site-inner-v2 .sp-filter {
    display: grid !important;
    grid-template-columns: repeat(5,minmax(0,1fr)) !important;
    gap: 10px !important;
    padding: 16px !important;
    border: 1px solid var(--ir-line) !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: none !important;
}
.site-inner-v2 .sp-grid { gap: 16px !important; }
.site-inner-v2 .sp-person-card,
.site-inner-v2 .sp-card {
    border: 1px solid var(--ir-line) !important;
    border-radius: 10px !important;
    box-shadow: none !important;
    overflow: hidden !important;
}
.site-inner-v2 .sp-person-card:hover,
.site-inner-v2 .sp-card:hover { box-shadow: var(--ir-shadow-soft) !important; }
.route-sponsorships-show .sp-profile { padding: 58px 0 90px !important; background: transparent !important; }
.site-inner-v2 .sp-profile-card {
    display: grid !important;
    grid-template-columns: minmax(260px,.8fr) minmax(0,1.2fr) !important;
    border: 0 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    background: #fff !important;
    box-shadow: var(--ir-shadow) !important;
}
.site-inner-v2 .sp-profile-photo { min-height: 560px !important; border-radius: 0 !important; }
.site-inner-v2 .sp-profile-summary,
.site-inner-v2 .sp-profile-content { padding: 34px !important; }
.site-inner-v2 .sp-donate-panel {
    border-radius: 10px !important;
    border: 1px solid var(--ir-line) !important;
    border-top: 6px solid var(--ir-blue) !important;
    box-shadow: var(--ir-shadow-soft) !important;
}

/* ---------- Contact / FAQ / Ways / Static / Search ---------- */
.route-contact-show .contact-page,
.route-faqs-index .faq-center,
.route-ways-to-donate .ways-page,
.route-static-pages-show .static-page-shell {
    padding: 0 0 88px !important;
    background: transparent !important;
}
.route-contact-show .contact-hero,
.route-faqs-index .faq-hero,
.route-ways-to-donate .ways-hero,
.route-static-pages-show .static-page-hero {
    margin-inline: calc(50% - 50vw) !important;
    width: 100vw !important;
    padding: 62px max(calc((100vw - 1180px)/2),24px) !important;
    border-radius: 0 0 36px 36px !important;
}
.site-inner-v2 .contact-layout {
    display: grid !important;
    grid-template-columns: .78fr 1.22fr !important;
    gap: 0 !important;
    margin-top: 34px !important;
    border: 1px solid var(--ir-line) !important;
    border-radius: 12px !important;
    overflow: hidden;
    background: #fff;
    box-shadow: var(--ir-shadow-soft);
}
.site-inner-v2 .contact-info {
    padding: 36px !important;
    background: var(--ir-navy) !important;
    color: #fff !important;
}
.site-inner-v2 .contact-info h2,
.site-inner-v2 .contact-info h3,
.site-inner-v2 .contact-info strong { color: #fff !important; }
.site-inner-v2 .contact-info p,
.site-inner-v2 .contact-info a { color: rgba(255,255,255,.78) !important; }
.site-inner-v2 .contact-item { border-color: rgba(255,255,255,.13) !important; }
.site-inner-v2 .contact-form-card {
    padding: 36px !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}
.site-inner-v2 .faq-category {
    margin: 18px 0 28px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}
.site-inner-v2 .faq-category-title {
    padding: 0 0 12px !important;
    border-bottom: 2px solid var(--ir-navy) !important;
}
.site-inner-v2 .accordion-item {
    border: 0 !important;
    border-bottom: 1px solid var(--ir-line) !important;
    border-radius: 0 !important;
    background: transparent !important;
}
.site-inner-v2 .accordion-button {
    padding: 22px 4px !important;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--ir-navy) !important;
    font-weight: 800 !important;
}
.site-inner-v2 .ways-grid {
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 16px !important;
    margin-top: 34px !important;
}
.site-inner-v2 .way-card {
    display: grid !important;
    grid-template-columns: 74px 1fr auto !important;
    align-items: center !important;
    gap: 20px !important;
    border: 1px solid var(--ir-line) !important;
    border-radius: 10px !important;
    box-shadow: none !important;
}
.site-inner-v2 .way-icon {
    width: 62px !important;
    height: 62px !important;
    border-radius: 8px !important;
    background: var(--ir-canvas-blue) !important;
    color: var(--ir-blue) !important;
}
.site-inner-v2 .static-page-card {
    margin-top: 34px !important;
    border: 1px solid var(--ir-line) !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: var(--ir-shadow-soft) !important;
    overflow: hidden !important;
}
.site-inner-v2 .static-page-content { padding: clamp(28px,5vw,62px) !important; max-width: 920px; }

.route-search .container.py-5 {
    width: min(1180px,calc(100% - 34px)) !important;
    padding-top: 52px !important;
    padding-bottom: 88px !important;
}
.route-search .container.py-5 > h1,
.route-search .container.py-5 > h2 {
    font-size: clamp(2.3rem,4vw,3.8rem) !important;
    margin-bottom: 18px !important;
}
.route-search .container.py-5 > form,
.route-search .container.py-5 .mb-5:first-of-type {
    padding: 18px !important;
    border: 1px solid var(--ir-line) !important;
    border-radius: 10px !important;
    background: #fff !important;
}
.route-search .card {
    border-radius: 10px !important;
    box-shadow: none !important;
    overflow: hidden;
}
.route-search .card:hover { box-shadow: var(--ir-shadow-soft) !important; }

/* ---------- Authentication ---------- */
.route-login .user-area,
.route-register .user-area,
.route-password-request .user-area,
.route-password-reset .user-area,
.route-verification-notice .user-area {
    min-height: calc(100vh - 180px) !important;
    padding: 72px 0 92px !important;
    display: grid !important;
    place-items: center !important;
    background:
        linear-gradient(110deg, var(--ir-navy) 0 38%, transparent 38%),
        linear-gradient(180deg, var(--ir-canvas), #fff) !important;
}
.site-inner-v2 .user-form-content {
    width: min(620px, calc(100% - 32px)) !important;
    margin: 0 auto !important;
    padding: clamp(30px,5vw,54px) !important;
    border: 1px solid var(--ir-line) !important;
    border-radius: 12px !important;
    background: #fff !important;
    box-shadow: var(--ir-shadow) !important;
}
.site-inner-v2 .user-form-content::before {
    content: "";
    display: block;
    width: 56px;
    height: 6px;
    margin-bottom: 28px;
    background: var(--ir-blue);
}
.site-inner-v2 .user-form { padding: 0 !important; box-shadow: none !important; border: 0 !important; }
.site-inner-v2 .login-action { align-items: center !important; }
.site-inner-v2 .forgot-login { color: var(--ir-blue) !important; }

/* ---------- Cart, checkout and thank-you: transaction workspace ---------- */
.route-cart-index .cart-hero,
.route-checkout-index .checkout-hero,
.route-donations-thankyou .thanks-hero,
.route-subscriptions-thankyou .thanks-hero {
    padding: 54px 0 88px !important;
    background:
        linear-gradient(180deg, var(--ir-navy) 0 250px, var(--ir-canvas) 250px 100%) !important;
}
.route-cart-index .cart-hero > .container > .d-flex:first-child h1,
.route-cart-index .cart-hero > .container > .d-flex:first-child h2,
.route-checkout-index .checkout-hero > .container > .d-flex:first-child h1,
.route-checkout-index .checkout-hero > .container > .d-flex:first-child h2,
.route-donations-thankyou .thanks-hero > .container > .d-flex:first-child h1,
.route-subscriptions-thankyou .thanks-hero > .container > .d-flex:first-child h1 {
    color: #fff !important;
}
.route-cart-index .cart-hero > .container > .d-flex:first-child p,
.route-checkout-index .checkout-hero > .container > .d-flex:first-child p,
.route-donations-thankyou .thanks-hero > .container > .d-flex:first-child p,
.route-subscriptions-thankyou .thanks-hero > .container > .d-flex:first-child p,
.route-cart-index .cart-hero .breadcrumb,
.route-checkout-index .checkout-hero .breadcrumb {
    color: rgba(255,255,255,.72) !important;
}
.site-inner-v2 .wwho-journey {
    border: 0 !important;
    border-radius: 8px !important;
    box-shadow: none !important;
}
.site-inner-v2 .soft-card.card {
    border-radius: 10px !important;
    box-shadow: none !important;
}
.site-inner-v2 .soft-card.card .card-header {
    background: #fff !important;
    border-bottom: 1px solid var(--ir-line) !important;
    padding: 22px 24px !important;
}
.site-inner-v2 .summary-sticky {
    top: 112px !important;
    border-top: 6px solid var(--ir-blue) !important;
}
.site-inner-v2 .pill {
    border-radius: 6px !important;
    background: var(--ir-canvas-blue) !important;
    color: var(--ir-blue-deep) !important;
}
.site-inner-v2 .icon-badge {
    border-radius: 10px !important;
    background: var(--ir-success) !important;
    color: #fff !important;
}

/* ---------- Donor profile ---------- */
.route-donor-dashboard .donor-profile {
    padding: 46px 0 90px !important;
    background: transparent !important;
}
.site-inner-v2 .dp-hero {
    min-height: 210px;
    display: flex;
    align-items: end;
    padding: 36px !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: var(--ir-navy) !important;
    color: #fff !important;
    box-shadow: var(--ir-shadow) !important;
}
.site-inner-v2 .dp-hero h1,
.site-inner-v2 .dp-hero h2,
.site-inner-v2 .dp-hero .fw-bold { color: #fff !important; }
.site-inner-v2 .dp-hero p,
.site-inner-v2 .dp-eyebrow { color: rgba(255,255,255,.72) !important; }
.site-inner-v2 .dp-avatar { border-radius: 10px !important; background: #fff !important; color: var(--ir-blue) !important; }
.site-inner-v2 .dp-stat,
.site-inner-v2 .dp-card,
.site-inner-v2 .dp-panel,
.site-inner-v2 .tab-content {
    border: 1px solid var(--ir-line) !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: none !important;
}
.site-inner-v2 .dp-stat__icon { border-radius: 8px !important; }
.site-inner-v2 .nav-pills .nav-link,
.site-inner-v2 .dp-tabs .nav-link {
    border-radius: 7px !important;
}
.site-inner-v2 .nav-pills .nav-link.active,
.site-inner-v2 .dp-tabs .nav-link.active {
    background: var(--ir-navy) !important;
}

/* ---------- Error page / miscellaneous ---------- */
.site-inner-v2 .alert { border-radius: 8px !important; }
.site-inner-v2 .pagination { justify-content: center; margin-top: 34px; }
.site-inner-v2 .page-link { border-radius: 6px !important; }

/* ---------- RTL ---------- */
html[dir="rtl"] .site-inner-v2 .campaign-hero::after,
html[dir="rtl"] .site-inner-v2 .ym-blog-head::after,
html[dir="rtl"] .site-inner-v2 .events-index-hero::after,
html[dir="rtl"] .site-inner-v2 .gallery-hero-box::after,
html[dir="rtl"] .site-inner-v2 .faq-hero::after,
html[dir="rtl"] .site-inner-v2 .ways-hero::after,
html[dir="rtl"] .site-inner-v2 .contact-hero::after,
html[dir="rtl"] .site-inner-v2 .static-page-hero::after,
html[dir="rtl"] .site-inner-v2 .ig-hero::after,
html[dir="rtl"] .site-inner-v2 .sp-hero::after {
    right: auto;
    left: -80px;
}

/* ---------- Responsive ---------- */
@media (max-width: 1199.98px) {
    .route-campaigns-index .col-lg-9 > .row.g-3 > [class*="col-"],
    .route-campaigns-program .col-lg-9 > .row.g-3 > [class*="col-"],
    .route-appeals-index .col-lg-9 > .row.g-4 > [class*="col-"],
    .route-appeals-program .col-lg-9 > .row.g-4 > [class*="col-"] { width: 100% !important; }
    .site-inner-v2 .sp-filter { grid-template-columns: repeat(3,minmax(0,1fr)) !important; }
}

@media (max-width: 991.98px) {
    .site-inner-v2 main::before,
    .site-inner-v2 .inner-page::before { display: none; }
    .site-inner-v2 .campaign-card { grid-template-columns: 40% 60% !important; }
    .site-inner-v2 .gallery-albums-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; grid-auto-rows: auto !important; }
    .site-inner-v2 .gallery-album-card,
    .site-inner-v2 .gallery-album-card.featured { grid-column: auto !important; grid-row: auto !important; min-height: 330px; }
    .site-inner-v2 .sp-profile-card { grid-template-columns: 1fr !important; }
    .site-inner-v2 .sp-profile-photo { min-height: 430px !important; }
    .site-inner-v2 .contact-layout { grid-template-columns: 1fr !important; }
    .site-inner-v2 .ways-grid { grid-template-columns: 1fr !important; }
    .route-login .user-area,
    .route-register .user-area,
    .route-password-request .user-area,
    .route-password-reset .user-area,
    .route-verification-notice .user-area {
        background: linear-gradient(180deg,var(--ir-canvas-blue),#fff) !important;
    }
}

@media (max-width: 767.98px) {
    .site-inner-v2 .campaign-hero,
    .route-campaigns-index .campaign-hero,
    .route-campaigns-program .campaign-hero { padding: 32px 22px !important; border-radius: 0 0 24px 24px !important; }
    .site-inner-v2 .campaign-card { display: block !important; }
    .site-inner-v2 .campaign-img-link,
    .site-inner-v2 .campaign-card-img-wrap { min-height: 230px !important; height: 230px !important; }
    .site-inner-v2 .sp-filter { grid-template-columns: 1fr !important; }
    .site-inner-v2 .gallery-albums-grid { grid-template-columns: 1fr !important; }
    .site-inner-v2 .gallery-album-card,
    .site-inner-v2 .gallery-album-card.featured { min-height: 300px; }
    .site-inner-v2 .way-card { grid-template-columns: 58px 1fr !important; }
    .site-inner-v2 .way-action { grid-column: 1 / -1; }
    .route-blogs-show .blog-cover-hero { min-height: 520px !important; border-radius: 0 0 28px 28px !important; }
    .route-events-show .event-cover-hero { height: 520px !important; border-radius: 0 0 28px 28px !important; }
    .route-about-show .ap-hero { min-height: 520px !important; }
    .route-programs-show .program-hero-new { min-height: 520px !important; }
}

@media (max-width: 575.98px) {
    .route-campaigns-index .container.py-4,
    .route-campaigns-program .container.py-4,
    .route-appeals-index .main-container,
    .route-appeals-program .main-container,
    .route-campaigns-show .main-container,
    .route-appeals-show .main-container,
    .route-search .container.py-5 { width: min(100% - 22px,1260px) !important; }
    .site-inner-v2 .campaign-card-body { padding: 19px !important; }
    .site-inner-v2 .contact-info,
    .site-inner-v2 .contact-form-card { padding: 26px 20px !important; }
    .site-inner-v2 .sp-profile-summary,
    .site-inner-v2 .sp-profile-content { padding: 24px 20px !important; }
    .site-inner-v2 .wwho-inner-ribbon { height: 6px; }
}

/* ---------- Email verification / confirm password ---------- */
.route-verification-notice .email-verification-page {
    padding: 70px 0 92px !important;
    background: linear-gradient(180deg,var(--ir-canvas-blue),#fff 72%) !important;
}
.route-verification-notice .email-verification-card {
    max-width: 1040px !important;
    border: 1px solid var(--ir-line) !important;
    border-radius: 12px !important;
    box-shadow: var(--ir-shadow) !important;
}
.route-verification-notice .email-verification-visual {
    background: var(--ir-navy) !important;
    border-radius: 0 !important;
}
.route-verification-notice .email-verification-icon,
.route-verification-notice .email-verification-step-number {
    border-radius: 8px !important;
}
.route-verification-notice .email-verification-primary,
.route-verification-notice .email-verification-secondary {
    border-radius: 8px !important;
}
.route-password-confirm .confirm-password-page {
    min-height: calc(100vh - 180px);
    display: grid;
    place-items: center;
    padding: 70px 16px 92px;
    background: linear-gradient(135deg,var(--ir-canvas-blue),#fff 58%);
}
.route-password-confirm .confirm-password-card {
    width: min(560px,100%);
    padding: clamp(28px,5vw,50px);
    border: 1px solid var(--ir-line);
    border-top: 6px solid var(--ir-blue);
    border-radius: 12px;
    background: #fff;
    box-shadow: var(--ir-shadow);
}
.route-password-confirm .confirm-password-card h1 { font-size: 2rem; }
.route-password-confirm .confirm-password-icon {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    margin-bottom: 20px;
    border-radius: 8px;
    background: var(--ir-canvas-blue);
    color: var(--ir-blue);
    font-size: 1.35rem;
}

/* ---------- Zakat calculator ---------- */
.route-zakat-calculator .zc-page { padding: 0 0 90px !important; background: transparent !important; }
.route-zakat-calculator .zc-hero {
    padding: 66px 0 78px !important;
    margin-bottom: 0 !important;
    border-radius: 0 0 38px 38px !important;
    background: var(--ir-navy) !important;
    color: #fff !important;
}
.route-zakat-calculator .zc-hero h1,
.route-zakat-calculator .zc-hero h2 { color: #fff !important; }
.route-zakat-calculator .zc-hero p { color: rgba(255,255,255,.76) !important; }
.route-zakat-calculator .zc-wrap { margin-top: -34px !important; position: relative; z-index: 3; }
.route-zakat-calculator .zc-card {
    border: 1px solid var(--ir-line) !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: var(--ir-shadow-soft) !important;
}
.route-zakat-calculator .zc-summary { border-top: 6px solid var(--ir-blue) !important; }
.route-zakat-calculator .zc-result { border-radius: 8px !important; background: var(--ir-navy) !important; color: #fff !important; }
.route-zakat-calculator .zc-result * { color: #fff !important; }
.route-zakat-calculator .zc-nisab-toggle button { border-radius: 7px !important; }

/* ---------- Manual recurring/sponsorship installment checkout ---------- */
.route-donor-sponsorships-installment-show .py-5.bg-light.min-vh-100,
.route-donor-subscriptions-installment-show .py-5.bg-light.min-vh-100 {
    padding: 58px 0 90px !important;
    background: linear-gradient(180deg,var(--ir-canvas-blue),#fff) !important;
}
.route-donor-sponsorships-installment-show .card,
.route-donor-subscriptions-installment-show .card {
    max-width: 920px;
    margin-inline: auto;
    border: 1px solid var(--ir-line) !important;
    border-top: 6px solid var(--ir-blue) !important;
    border-radius: 10px !important;
    box-shadow: var(--ir-shadow) !important;
}
.route-donor-sponsorships-installment-show .border.rounded-3,
.route-donor-subscriptions-installment-show .border.rounded-3 {
    border-color: var(--ir-line) !important;
    border-radius: 8px !important;
    background: var(--ir-canvas) !important;
}

/* ---------- 404 / simple error pages ---------- */
.site-inner-v2 .error-page,
.site-inner-v2 .not-found-page {
    min-height: 70vh;
    display: grid;
    place-items: center;
    padding: 70px 20px;
    background: linear-gradient(180deg,var(--ir-canvas-blue),#fff);
}
