/* =========================================
   Home Page Redesign Styles
   ========================================= */

:root {
    --brand-teal: #004d40;
    --brand-orange: #ff9f43;
    --brand-yellow: #feca57;
    /* Matches the buttons */
    --brand-cyan: #48dbfb;
    --brand-green: #1dd1a1;
    --brand-dark: #1a1a1a;
    --btn-yellow: #ffc107;
    /* Bootstrap warning approx */
}

/* Typography Overrides for this design */
.ls-2 {
    letter-spacing: 2px;
}

.fw-bold {
    font-weight: 700 !important;
}

.text-justify {
    text-align: justify;
}

/*--------------------------------------------------------------
# Hero Section
--------------------------------------------------------------*/
.home-hero {
    height: 90vh;
    min-height: 700px;
    display: flex;
    flex-direction: column;
    border-radius: 20px;
    overflow: hidden;
}

.hero-swiper {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    
}

.swiper-slide {
    background-size: cover;
    background-position: center;
}

.hero-bg-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* background: linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.6) 50%, rgba(0, 0, 0, 0.1) 100%); */
    z-index: 0;
}

.home-hero .container {
    /* padding-top: 100px; */
    /* Adjust for header height */
    /* padding-bottom: 150px; */
    /* Space for bottom elements */
}

.text-body-lead.with-yellow-bar {
    position: relative;
    padding-left: 25px;
}

.text-body-lead.with-yellow-bar::before {
    content: '';
    position: absolute;
    left: 0;
    top: 5px;
    bottom: 5px;
    width: 4px;
    background-color: var(--warning-color);
}

.hero-bottom-elements {
    margin-top: auto;
    padding-bottom: var(--spacing-xl);
}

.hero-action-box .search-group {
    max-width: 450px;
}

.hero-action-box .form-select {
    height: 50px;
    border-radius: 8px 0 0 8px;
    border-right: none;
}

.hero-action-box .btn {
    height: 50px;
    border-radius: 0 8px 8px 0;
    margin: 0;
    font-weight: 500;
}

.hero-pagination-tabs {
    display: flex;
    margin-top: 0;
    /* border-top: 1px solid rgba(255, 255, 255, 0.2); */
    padding-top: var(--spacing-md);
    position: absolute;
    bottom: 40px;
    left: 0;
    right: 0;
    gap: 15px;
}

.swiper-pagination-custom-tab {
    color: #879497;
    cursor: pointer;
    padding: 10px 0;
    margin-right: var(--spacing-xl);
    position: relative;
    transition: color 0.3s ease;
    font-size: var(--font-size-lg);
    flex: 1 1 38%;
    border-top: 2px solid rgba(255, 255, 255, 0.2);
    font-weight: 400;
}

.swiper-pagination-custom-tab:hover,
.swiper-pagination-custom-tab.active {
    color: white;
}

.swiper-pagination-custom-tab.active::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: auto;
    width: 60%;
    height: 2px;
    background-color: var(--warning-color);
    top: -2px;
}

/*--------------------------------------------------------------
# Intro Section
--------------------------------------------------------------*/

/* 2. Services Cards - Colors */
.bg-orange {
    background-color: var(--brand-orange);
    color: #2d3436;
}

.bg-yellow {
    background-color: var(--brand-yellow);
    color: #2d3436;
}

.bg-cyan {
    background-color: var(--brand-cyan);
    color: #2d3436;
}

.bg-green {
    background-color: var(--brand-green);
    color: #2d3436;
}

.bg-teal {
    background-color: var(--brand-teal);
}

.service-card {
    transition: transform 0.3s ease;
    border-radius: 20px;
    /* More rounded */
}

.service-card:hover {
    transform: translateY(-5px);
    z-index: 2;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}

/* Specific Card Colors from the design */
/* Orange/Coral */
.bg-orange {
    background-color: #ff835b;
    color: #1a1a1a;
}

/* Yellow */
.bg-yellow {
    background-color: #ffe02e;
    color: #1a1a1a;
}

.services-outer .col-md-6:nth-child(2) .service-card.bg-orange {
    background-color: #ffd51d;
}

.services-outer .col-md-6:nth-child(3) .service-card.bg-orange {
    background-color: #00d8ff;
}

.services-outer .col-md-6:nth-child(4) .service-card.bg-orange {
    background-color: #00ff91;
}


/* Cyan/Blue */
.bg-cyan {
    background-color: #00d6ef;
    color: #1a1a1a;
}

/* Green */
.bg-green {
    background-color: #00fa9a;
    color: #1a1a1a;
}

/* Icon button in cards */
.service-card .bg-white {
    /* Styles for the white arrow box in cards */
    transition: 0.3s;
}

.service-card:hover .bg-white {
    transform: translate(2px, -2px);
}

/* 3. Impact Section */
.impact-section {
    /* No bg here, moved to card */
    /* padding: 50px 100px 80px; */
}

.impact-card {
    background-color: var(--brand-teal);
    border-radius: 2rem;
    overflow: hidden;
    position: relative;
    padding: 50px 100px 50px;
}

.impact-map-bg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url('https://placehold.co/1200x600/00332c/ffffff?text=World+Map+Watermark');
    /* Replace with actual map */
    background-size: cover;
    background-position: center;
    opacity: 0.1;
    pointer-events: none;
}

.stat-item {
    padding: 2rem;
    position: relative;
}

.stat-item small {
    line-height: 1.3 !important;
    display: block;
}

/* Grid Borders - Applied universally as the layout is always 2x2 */
.border-end-lg-1 {
    border-right: 1px solid rgba(255, 255, 255, 0.1);
}

.border-bottom-lg-1 {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

/* Mobile adjustments if needed */
@media (max-width: 767px) {
    /* If we wanted to stack 1 column on very small screens, we would need to reset these, 
       but for now we keep col-6 (2 cols) even on mobile as per common patterns. */
}

/* =========================================
   Footer Elements (Strict Design Match)
   ========================================= */
.site-footer {
    background-color: #011f0d;
    color: var(--text-white-80);
    padding: var(--spacing-xxl) 0;
    font-family: var(--font-family-inter);
    margin: 10px;
    border-radius: 20px;
    padding: 100px 0 30px;
}

/* Section 1: Newsletter */
.footer-newsletter-section {
    text-align: center;
    padding-bottom: var(--spacing-xl);
}

.footer-newsletter-section .text-label {
    font-size: var(--font-size-sm);
    letter-spacing: 1px;
    text-transform: uppercase;
}

.footer-newsletter-section .section-title {
    font-family: var(--font-family-playfair);
    font-size: 2.5rem;
    /* Approx 40px */
}

.newsletter-form {
    position: relative;
    max-width: 800px;
    margin-top: var(--spacing-lg);
    display: flex;
    gap: 5px;
}

.newsletter-form .form-control {
    height: 60px;
    border-radius: 12px;
    padding-left: 30px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    background-color: #fff;
    color: #000;
}

.newsletter-form .form-control::placeholder {
    color: rgba(255, 255, 255, 0.5);
    color: #000;
}

.newsletter-form .btn {
    /* position: absolute; */
    right: 5px;
    top: 5px;
    bottom: 5px;
    border-radius: 12px;
    padding: 0 25px;
    font-weight: 400;
    margin: 0;
}

/* Main Divider */
.footer-main-divider {
    border-color: rgba(255, 255, 255, 0.5);
    margin: 0 0 var(--spacing-xl) 0;
}

/* Section 2: Footer Columns */
.footer-col-brand {
    padding-right: var(--spacing-xl);
}

.footer-logo {
    max-width: 180px;
}

.footer-brand-description {
    color: #fff;
    font-size: 16px;
    line-height: 1.8;
    margin-bottom: var(--spacing-lg);
}

.btn-footer-support {
    display: inline-flex;
    align-items: center;
    background-color: var(--brand-teal);
    color: white;
    padding: 12px 20px;
    border-radius: 5px;
    text-decoration: none;
    font-weight: 600;
    font-size: var(--font-size-sm);
    transition: background-color 0.3s ease;
}

.btn-footer-support:hover {
    background-color: #007a70;
    /* Slightly lighter teal */
    color: white;
}

.btn-footer-support .icon-box {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 3px;
    margin-left: 12px;
}

.footer-col-links .footer-divider {
    border-left: 1px solid rgba(255, 255, 255, 0.1);
    padding-left: var(--spacing-lg);
    height: 100%;
}

.footer-heading {
    font-family: var(--font-family-playfair);
    color: white;
    font-size: var(--font-size-28);
    /* Approx 24px */
    margin-bottom: var(--spacing-md);
}

.footer-links li {
    margin-bottom: 12px;
}

.footer-links a {
    color: #fff;
    text-decoration: none;
    font-size: 16px;
    transition: color 0.3s ease;
    font-weight: 400;
}

.footer-links a:hover {
    color: var(--warning-color);
}

/* Contact List */
.footer-contact-list li {
    display: flex;
    align-items: flex-start;
    margin-bottom: var(--spacing-md);
}

.footer-contact-list i {
    color: var(--warning-color);
    font-size: 1rem;
    margin-right: 15px;
    margin-top: 5px;
}

.footer-contact-list div span {
    display: block;
    color: #fff;
    font-size: 16px;
    margin-bottom: 2px;
    opacity: 0.5;
}

.footer-contact-list div a {
    color: #fff;
    font-weight: 500;
    text-decoration: none;
    font-size: 16px;
}

.footer-contact-list div a:hover {
    text-decoration: underline;
    color: var(--warning-color);
}

/* Social Pills */
.footer-social-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.social-pill {
    display: inline-flex;
    align-items: center;
    background-color: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    padding: 8px 15px;
    border-radius: 20px;
    color: #fff;
    text-decoration: none;
    font-size: 16px;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.social-pill:hover {
    background-color: var(--warning-color);
    color: var(--footer-bg);
}

.social-pill i {
    margin-right: 8px;
    font-size: 0.9rem;
}

/* Section 3: Footer Bottom */
.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding-top: var(--spacing-lg);
    margin-top: var(--spacing-xl);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.copyright-text {
    font-size: 16px;
    color: #fff;
    margin: 0;
}

.footer-bottom-links a {
    color: #fff;
    text-decoration: none;
    font-size: 16px;
    margin: 0 10px;
    font-weight: 400;
}

.footer-bottom-links a:hover {
    color: var(--warning-color);
}

.footer-bottom-links span {
    color: #fff;
}

/* Responsive Adjustments */
@media (max-width: 991.98px) {
    .footer-col-links .footer-divider {
        border-left: none;
        padding-left: 0;
        margin-top: var(--spacing-xl);
    }

    .footer-col-brand {
        padding-right: 0;
    }

    .footer-bottom {
        flex-direction: column;
        text-align: center;
    }

    .copyright-text {
        margin-bottom: var(--spacing-md);
    }
}

/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
.site-header {
    position: relative;
    z-index: 1000;
    background-color: white;
}

/* 1. Top Announcement Bar */
.top-announcement-bar {
    background-color: #000000;
    color: white;
    padding: 10px 0;
    font-size: var(--font-size-sm);
}

.announcement-content {
    display: flex;
    justify-content: center;
    align-items: center;
}

.announcement-content span {
    margin: 0 20px;
}

.announcement-content .arrow-link {
    color: white;
    text-decoration: none;
    font-size: 0.8rem;
}

/* 2. Main Header */
.main-header-content {
    padding: 10px 0;
    padding: 0px 0;
    border-bottom: 1px solid #e9ecef;
}

.site-branding img {
         max-height: 150px;
    /*margin: -12px 0;*/
    /*position: relative;*/
    /*z-index: -1;*/
}

/* Main Navigation */
.main-navigation ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
}

.main-navigation ul li {
    margin: 0 15px;
}

.main-navigation ul li a {
    color: #000;
    text-decoration: none;
    font-weight: 500;
    font-size: var(--font-size-base);
    transition: color 0.3s ease;
}

.main-navigation ul li a:hover {
    color: var(--brand-teal);
}

.main-navigation .menu-item-has-children>a {
    position: relative;
    padding-right: 15px;
}

.main-navigation .menu-item-has-children>a::after {
    content: '\f078';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    font-size: 0.7rem;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}

/* Dropdown Menu Styles */
.main-navigation ul .sub-menu {
    display: none;
    position: absolute;
    background-color: white;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
    padding: 10px 0;
    list-style: none;
    min-width: 200px;
    z-index: 1001;
    border-radius: 8px;
    border: 1px solid #f0f0f0;
}

.main-navigation ul li:hover>.sub-menu {
    display: block;
}

.main-navigation ul .sub-menu li {
    margin: 0;
}

.main-navigation ul .sub-menu li a {
    padding: 10px 20px;
    display: block;
    white-space: nowrap;
    color: #000;
    border-left: 5px solid #fff;
}

.main-navigation ul .sub-menu li a:hover {
    background-color: var(--brand-teal);
    color: #fff;
    border-color: var(--warning-color);
}

/* Header Actions */
.header-actions .header-social-icons a {
    color: #000;
    margin: 0 1px;
    font-size: 1rem;
    transition: color 0.3s ease;
    display: inline-block;
    width: 50px;
    height: 50px;
    border: 1px solid #ddd;
    text-align: center;
    line-height: 50px;
    border-radius: 50%;
}

.header-actions .header-social-icons a:hover {
    color: #000;
    background-color: #ffd51d;
    border-color: #ffd51d;
}

.header-actions .btn-contact {
    border-radius: 8px;
    padding: 12px 25px;
    /* font-weight: bold; */
    margin-left: 10px;
    margin-top: 0;
}

/* Hide menu toggle on desktop */
.main-navigation .menu-toggle {
    display: none;
}

/*--------------------------------------------------------------
# Mobile Navigation
--------------------------------------------------------------*/
.mobile-menu-toggle {
    background: none;
    border: 2px solid #ffd51d;
    border-radius: 8px;
    width: 44px;
    height: 44px;
    color: #000;
    font-size: 1.2rem;
    background-color: #ffd51d;
}

.mobile-nav-panel {
    position: fixed;
    top: 0;
    right: 0;
    width: 320px;
    height: 100%;
    background-color: white;
    z-index: 1050;
    transform: translateX(100%);
    transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1);
    display: flex;
    flex-direction: column;
}

.mobile-nav-panel.is-open {
    transform: translateX(0);
    box-shadow: -5px 0 25px rgba(0, 0, 0, 0.1);
}

.mobile-nav-header {
    display: flex;
    justify-content: flex-end;
    padding: 15px;
    border-bottom: 1px solid #e9ecef;
}

.mobile-menu-close {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #000;
}

.mobile-navigation {
    flex-grow: 1;
    overflow-y: auto;
    padding: 20px;
}

.mobile-navigation ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.mobile-navigation ul li a {
    display: block;
    padding: 12px 0;
    color: #000;
    font-weight: 500;
    text-decoration: none;
    border-bottom: 1px solid #f0f0f0;
}

.mobile-navigation .sub-menu {
    padding-left: 15px;
    display: none;
    /* Hidden by default */
}

.mobile-navigation .menu-item-has-children>a {
    position: relative;
}

.mobile-navigation .menu-item-has-children>a::after {
    content: '\f078';
    /* Font Awesome down arrow */
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    transition: transform 0.3s ease;
}

.mobile-navigation .menu-item-has-children.open>a::after {
    transform: translateY(-50%) rotate(180deg);
}

.mobile-nav-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1040;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.4s ease, visibility 0.4s;
}

.mobile-nav-overlay.is-open {
    opacity: 1;
    visibility: visible;
}

/* Responsive */
@media (max-width: 991.98px) {

    .main-header-content .main-navigation,
    .main-header-content .header-actions {
        display: none;
    }

    .main-header-content .mobile-menu-toggle {
        display: block;
    }
}

/* Common Components */
.object-fit-cover {
    object-fit: cover;
}

.grayscale {
    filter: grayscale(100%);
    transition: 0.3s;
}

.grayscale:hover {
    filter: grayscale(0%);
    opacity: 1 !important;
}

.btn-warning {
    background-color: #ffd51d;
    border-color: #ffd51d;
    color: #000;
}

.btn-warning:hover {
    background-color: #ffd51d;
    border-color: #ffc720;
    color: #000;
}

/* =========================================
   Typography & Spacing Overrides (Variable Based)
   ========================================= */

/* Typography */
.hero-title {
    font-size: var(--font-size-4xl);
    /* Was display-3 */
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-one);
}

.section-title {
    font-size: var(--font-size-4xl);
    /* Was display-4/5 */
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-tight);
}

.card-title-custom {
    font-size: var(--font-size-2xl);
    font-weight: 500 !important;
}

.intro-text {
    font-size: var(--font-size-36);
    /* Was fs-3 */
    line-height: var(--line-height-tight);
    color: #000;
    font-weight: 400;
    max-width: 1200px;
    margin: 0 auto;
}

.text-body-lead {
    font-size: var(--font-size-lg);
    line-height: var(--line-height-normal);
}

.text-label {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    letter-spacing: 2px;
    text-transform: uppercase;
}

/* Spacing */
.section-space {
    padding-top: var(--spacing-5xl);
    padding-bottom: var(--spacing-5xl);
}

.section-space-t {
    padding-top: var(--spacing-5xl);
}

.section-space-b {
    padding-bottom: var(--spacing-5xl);
}

.title-space-t {
    padding-top: var(--spacing-3xl);
}

.title-space-b {
    padding-bottom: var(--spacing-3xl);
}

.mb-var-sm {
    margin-bottom: var(--spacing-sm);
}

.mb-var-md {
    margin-bottom: var(--spacing-md);
}

.mb-var-lg {
    margin-bottom: var(--spacing-lg);
}

.mb-var-xl {
    margin-bottom: var(--spacing-xl);
}

.gap-var {
    gap: var(--spacing-md);
}

/* Specific Component Overrides */
.accordion-arrow-btn {
    width: 32px;
    height: 32px;
}

.services-outer {
    padding: 50px 75px 50px 100px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.services-col {
    padding-bottom: 80px;
}


.stat-item .section-title {
    line-height: 1;
}

.card-yellow h2 {
    font-family: var(--font-2);
    font-size: var(--font-size-6xl);
}

.card-yellow {
    height: 100%;
}

.card-yellow p {
    font-weight: 500;
    color: #000;
}

.card-alpha .card-img {
    aspect-ratio: 1150/560;
}

.card-alpha .play-btn {
    position: absolute;
    bottom: 50px;
    right: 80px;
}

.card-alpha .card-img-overlay {
    padding: 40px 70px;
    padding-right: 20%;
}

.card-alpha h3 {
    font-size: var(--font-size-50);
    margin-bottom: 15px;
}

.card-alpha span.badge {
    padding: 12px 20px !important;
}

.stories-section {
    padding-top: 150px;
    padding-bottom: 150px;
    background-position: center center;
    background-size: 112% 100%;
}

.card-green .card-img {
    aspect-ratio: 543/639;
    width: 100%;
    height: 100%;
}

.card-green h3 {
    font-size: var(--font-size-36);
}

.card-green .card-img-overlay {
    padding: 40px 35px;
}

.card-green .card-img-overlay {
    padding: 40px 35px;
}

.card-rating {
    padding: 40px 70px;
    display: flex;
    justify-content: center;
    padding-right: 18%;
}

.card-rating h3 {
    font-size: var(--font-size-3xl);
}

.card-rating p {
    font-size: var(--font-size-2xl);
}

.card-rating h6 {
    font-size: 30px;
    font-weight: 500 !important;
}

.card-rating small {
    font-size: 16px;
}

.partner-slider p {
    font-size: 19px;
    color: #000;
    font-weight: 600;
}

.partner-slider,
.page-template-home .partnership-section {
    position: relative;
}

.partner-slider::before {
    content: '';
    position: absolute;
    width: 2px;
    height: 50px;
    background-color: #ca5151;
    top: -80px;
    left: 50%;
}

.inb-wrap {
    background-position: center;
    background-repeat: no-repeat;
    padding: 110px 0 120px;
    background-size: cover;
}

.inb-wrap h1,
.inb-wrap p {
    max-width: 540px;
}

/*--------------------------------------------------------------
# Meet Our Team Section
--------------------------------------------------------------*/
.meet-our-team-section .intro-text {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.team-member-card .team-member-img {
    border-radius: 35px;
    overflow: hidden;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
    padding: 0;
}

.team-member-card .team-member-name {
    /* font-weight: bold; */
    margin-bottom: 0.25rem;
}

.team-member-card .team-member-title {
    font-size: 14px;
    margin: 0;
}

.team-member-card .team-member-img img {
    width: 100%;
    height: auto;
}

/*--------------------------------------------------------------
# IDVAs Section
--------------------------------------------------------------*/
.idvas-container {
    border-top: 5px solid #e2e2e2;

}


.team-member-card>* {
    padding: 0 50px;
}

.idvas-section .section-title {
    font-size: var(--font-size-3xl);
}

/*--------------------------------------------------------------
# How We Work Section
--------------------------------------------------------------*/
.how-we-work-section .work-item-icon {
    position: relative;
    /* width: 120px; */
    /* height: 120px; */
    /* border-radius: 50%; */
    /* border: 2px solid var(--brand-teal); */
    /* display: flex; */
    /* align-items: center; */
    justify-content: center;
    /* background-color: #fff; */
}

.how-we-work-section .work-item-icon img {
    /* max-width: 50px; */
    margin-left: 20px;
}

.how-we-work-section .work-item-number {
    position: absolute;
    top: 10px;
    right: -10px;
    background-color: var(--brand-teal);
    color: #fff;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    font-size: 0.9rem;
    display: none;
}

.how-we-work-section .work-item-title {
    margin-bottom: 0.5rem;
    font-size: var(--font-size-36);
}

/*--------------------------------------------------------------
# Partnership Section
--------------------------------------------------------------*/
.partnership-section .partner-logo {
    /* max-height: 60px; */
    /* filter: grayscale(100%); */
    /* opacity: 0.7; */
    transition: all 0.3s ease;
    width: auto;
    height: auto;
}

.partnership-section .partner-logo:hover {
    /* filter: grayscale(0%); */
    /* opacity: 1; */
}

.partnership-section .section-title {
    font-size: var(--font-size-50);
}

.how-we-work-arrow {
    position: absolute;
    width: auto;
    top: 90px;
}

.how-we-work-row {
    position: relative;
}

/*--------------------------------------------------------------
# Who We Are Section
--------------------------------------------------------------*/
.video-image-container {
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
}

.video-image-container .play-btn-overlay {
    position: absolute;
    bottom: 40px;
    left: 70px;
    display: flex;
    align-items: center;
    gap: 10px;
    color: #fff;
    text-decoration: none;
    /* background-color: rgba(0,0,0,0.5); */
    padding: 0;
    border-radius: 50px;
    transition: background-color 0.3s ease;
}

.who-we-are-section .play-btn-overlay:hover {
    /* background-color: rgba(0,0,0,0.8); */
}

.video-image-container .play-icon-wrapper {
    /* width: 40px; */
    /* height: 40px; */
    /* background-color: #fff; */
    /* border-radius: 50%; */
    /* display: flex; */
    /* align-items: center; */
    justify-content: center;
    /* color: var(--brand-dark); */
}

.who-we-are-section .mission-box {
    border-left: 4px solid var(--brand-yellow);
    padding-left: 20px;
}

.who-we-are-section .mission-title {
    font-weight: 400;
    font-size: var(--font-size-3xl);
}

/* Modal video stop on close */
#videoModal .btn-close {
    position: absolute;
    top: -6px;
    right: -5px;
    background-color: white;
    border-radius: 50%;
    opacity: 1;
}

.modal-content {
    background-color: transparent;
    border: 0;
}

.modal-header {
    border-bottom: 0;
    padding: 0;
}

.modal-header .modal-title {
    display: none;
}

.video-image-container .play-btn-overlay span {
    width: 120px;
    line-height: 1;
    font-size: 21px;
    font-weight: 400;
    margin-left: 12px;
}


.video-image-container>img {
    aspect-ratio: 786/930;
}

.video-image-container>img {
    aspect-ratio: 786/930;
}

.about-video-section .video-image-container>img {
    aspect-ratio: 1682/915;
    object-fit: cover;
    object-position: center;
}

section.about-video-section .video-image-container .play-btn-overlay {
    left: 50%;
    transform: translateX(-50%);
    background-color: #fff;
    padding: 6px;
    border-radius: 80px;
}

section.about-video-section .video-image-container .play-btn-overlay span {
    color: #000 !important;
    font-size: 18px;
    display: block;
}



/*--------------------------------------------------------------
# traineeship Section
--------------------------------------------------------------*/
.process-row {
    background-color: transparent;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    gap: 15px;
}

.traineeship .activity {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 375px;
    margin: 00px 0px 00px;
    background-color: transparent;
    -webkit-box-shadow: 0 2px 6px 0 rgba(0, 0, 0, .1);
    box-shadow: unset;
    cursor: pointer;
    -webkit-transition: .3s;
    transition: .3s;
    overflow: hidden;
    background-color: transparent;
    border-radius: 12px;
}

.animate-from-bottom__0 {
    -webkit-animation-name: from-left;
    animation-name: from-left;
    -webkit-animation-duration: .5s;
    animation-duration: .5s;
}

.animate-from-bottom__1 {
    -webkit-animation-name: from-left;
    animation-name: from-left;
    -webkit-animation-duration: .8s;
    animation-duration: .8s;
}

.animate-from-bottom__2 {
    -webkit-animation-name: from-left;
    animation-name: from-left;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
}

.animate-from-bottom__3 {
    -webkit-animation-name: from-left;
    animation-name: from-left;
    -webkit-animation-duration: 1.2s;
    animation-duration: 1.2s
}

.animate-from-bottom__4 {
    -webkit-animation-name: from-left;
    animation-name: from-left;
    -webkit-animation-duration: 1.2s;
    animation-duration: 1.2s
}

.traineeship .activity .relative-block {
    width: 100%;
    min-height: 522px;
}

@-webkit-keyframes from-left {
    from {
        -webkit-transform: translateY(50px);
        transform: translateY(50px)
    }

    to {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

@keyframes from-left {
    from {
        -webkit-transform: translateY(50px);
        transform: translateY(50px)
    }

    to {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

.relative-block {
    position: relative;
}

.activity-icon {
    position: absolute;
    bottom: 0;
    right: 0;
    top: 0;
    left: 0;
    z-index: -1;
}

.activity-icon img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: grayscale(1) brightness(0.5);
    transition: all 0.3s linear;
}

.traineeship .inactive {
    padding: 25px 30px 50px;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: end;
}

.traineeship .inactive .title {
    /* border-bottom: 3px solid #f5ca2a; */
    padding-bottom: 14px;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    color: #fff;
    font-size: var(--font-size-30);
    font-weight: 400;
    line-height: 28px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
}

.traineeship .activity .active {
    display: none;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    height: auto;
    min-height: 100%;
    padding: 25px 30px 50px;
    justify-content: flex-end;
}

.traineeship .activity .active .title {
    color: #fff;
    font-size: 22px;
    font-weight: 600;
    line-height: 32px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
    font-size: var(--font-size-30);
}

.traineeship .activity .active .sub-title {
    margin-top: 10px;
    color: #fff;
    font-size: 19px;
    line-height: 28px;
    text-align: left;
}

.traineeship .activity .active .ul {
    margin-bottom: 45px;
    margin-top: 10px;
}

.traineeship .activity .active .li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-left: 30px;
    color: #616161;
    font-size: 16px;
    line-height: 26px;
}

.traineeship .activity .active .li:before {
    position: absolute;
    content: "\f00c";
    color: #e2b921;
    font-family: FontAwesome;
    display: inline-block;
    margin-left: -1.6em;
    width: 22px;
}

.traineeship .activity:hover {
    width: 1000px;
    background-color: #000;
    background: #000;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.41) 65%, rgba(0, 0, 0, 0.62) 100%);
}

.traineeship .activity:hover .inactive {
    display: none;
}

.traineeship .activity:hover .active {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    justify-content: flex-end;
}

.traineeship .read-more-link {
    font-weight: 400;
    color: #fff;
}

.traineeship .inactive .sub-title {
    color: #fff;
    font-size: 16px;
    letter-spacing: 2px;
}

.traineeship .activity .active p {
    width: 600px;
    color: #fff;
}

.traineeship .activity:hover .activity-icon img {
    filter: grayscale(0);
}

.blog-card {
    background-color: #fff;
    border: unset;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    padding: 15px;
    border-radius: 20px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
}

.blog-card .card-img-top {
    border-radius: 8px;
}

.blog-card .card-title a {
    color: #000;
    font-weight: 400;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
    display: block;
    margin-bottom: 15px;
}

.blog-card .read-more-link {
    color: #000;
    font-weight: 400;
}

.blog-card .card-title .card-title {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
}

.blog-card .card-body {
    padding: 15px 8px 0;
}

.blog-card .card-meta {
    border-bottom: 1px solid #ddd;
    padding-bottom: 15px;
    margin-bottom: 15px !IMPORTANT;
}

.section-title-wrap .slider-button-next,
.section-title-wrap .slider-button-prev {
    padding: 0;
    border: unset;
    background-color: unset;
    margin: 0 8px;
}

.latest-news-slider {
    padding: 5px;
}

.news-card-large img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.news-card-large {
    width: 100%;
    height: 100%;
    border-radius: 12px;
    overflow: hidden;
}

.media-info-section .blog-card {
    box-shadow: unset;
}

.media-info-section .blog-card .card-meta {
    margin-bottom: 0 !important;
    border: unset;
}

.think-pieces-section .blog-card .card-body {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0;
}

.think-pieces-section .blog-card .card-img-top {
    aspect-ratio: 480/332;
    border-radius: 30px;
}

.section-title-wrap {
    border-top: 1px solid #dddd;
    padding-top: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid #ddd;
}

.media-info-section {
    background: #f7f7f7;
}

.volunteer-inner {
    background-color: #1c283a;
    padding: 25px 35px;
    border-radius: 50px;
}

.btn-dark {
    background-color: #000;
    color: #fff;
    border: 1px solid #000;
}

.btn-dark:hover {
    background-color: #000;
    color: #fff;
}

.volunteer-inner .btn-dark {
    background-color: #fff;
    color: #000;
}

.volunteer-inner .btn-dark:hover {
    background-color: #fff;
    color: #000;
}

.volunteer-inner .btn-dark img {
    filter: invert(1);
}

.zigzag-content li::before {
    content: "\f058";
    font-family: "Font Awesome 6 Free";
    color: #00ba00;
    --bs-text-opacity: 1;
    font-weight: 900;
    margin-right: 15px;
    position: absolute;
    left: 0;
}

.zigzag-content li {
    position: relative;
    padding-left: 30px;
    line-height: var(--line-height-tight);
}

.zigzag-content ul {
    padding: 0;
    list-style: none;
}

.zigzag-content p em {
    border-top: 1px dashed;
    padding-top: 15px;
    margin-top: 15px;
    display: block;
    font-style: normal;
    margin-right: 60px;
}

.topic-card {
    height: 100%;
    border-radius: 20px;
}

.topic-card .card-img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: center;
}

.card-img-overlay {
    justify-content: space-between;
    gap: 15px;
    align-items: end;
    padding: 30px 40px;
}

.card-img-overlay>a {
    flex: 0 0 53px;
    margin-bottom: 10px;
}

span.policy-number {
    font-size: var(--font-size-30);
    border: 1px solid #ddd;
    font-family: var(--font-1);
    width: 55px;
    height: 55px;
    display: block;
    line-height: 55px;
    text-align: center;
    border-radius: 50%;
    font-weight: 400;
}

.policy-title-wrapper {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 15px;
    border-top: 1px solid #ddd;
    padding-top: 25px;
    margin-top: 25px;
}

h3.policy-title {
    margin: 0;
}

.policy-item h5 {
    font-size: var(--font-size-28);
    border-top: 1px solid #ddd;
    padding-top: 25px;
    margin-top: 25px;
}

.publications-accordion .accordion-button {
    background-color: transparent;
}

.publications-accordion .accordion-button:not(.collapsed) {
    background-color: #f3f3f3;
    border: unset !important;
}

.publications-accordion .accordion-item {
    margin-bottom: 25px;
}

.publications-accordion .accordion-item {
    border: 1px solid #f3f3f3 !important;
    border-radius: 8px;
    overflow: hidden;
}

.publications-accordion .accordion-header {
    border-bottom: unset !important;
}

.publications-accordion .accordion-item:first-of-type .accordion-button {
    border: unset !important;
    box-shadow: unset;
}

.publications-accordion .accordion-body {
    background-color: #f3f3f3;
    padding-top: 0;
}

.publications-accordion .accordion-body li {
    padding: 15px;
    background-color: #fff;
    margin-bottom: 5px;
    border-radius: 6px;
}

.publications-accordion .accordion-body li:last-child {
    margin-bottom: 0 !important;
}

.publications-accordion .accordion-body ul {
    margin: 0;
}

.publications-accordion .accordion-body li a {
    color: #000;
    font-weight: 400;
}

.publications-accordion .accordion-item .accordion-button {
    font-size: var(--font-size-28);
    color: #000;
    padding: 22px 20px;
}

.zigzag-content blockquote {
    border-top: 1px dashed;
    padding-top: 15px;
    margin-top: 15px;
    display: block;
    font-style: normal;
    /* border-left: 5px solid #ffd51d; */
}

.zigzag-content blockquote p {
    border-left: 5px solid #ffd51d;
    padding-left: 20px;
}

.zigzag-content blockquote p strong {
    font-weight: 900;
}

/*--------------------------------------------------------------
# Self Referral Section
--------------------------------------------------------------*/
.self-referral-section .check-list {
    list-style: none;
    padding-left: 0;
}

.self-referral-section .check-list li {
    margin-bottom: 0.75rem;
    display: flex;
    align-items: center;
    font-weight: 500;
}

.self-referral-section .check-list .fa-check-circle {
    color: #28a745;
    margin-right: 0.75rem;
    font-size: 1.2rem;
}

.self-referral-form-wrap {
    background-color: #f8f9fa;
    padding: 2rem;
    border-radius: 0.5rem;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1);
}

.self-referral-form-wrap .form-control,
.self-referral-form-wrap .form-select {
    background-color: #efefef;
    border: none;
    padding: 0.75rem 1rem;
}

.self-referral-form-wrap .form-check-input:checked {
    background-color: #002A52;
    border-color: #002A52;
}

.contact-info-box {
    margin-top: 2rem;
    /* padding-top: 2rem; */
    /* border-top: 1px solid #e0e0e0; */
}

.contact-info-box .contact-number {
    font-size: var(--font-size-2xl);
    font-weight: bold;
    color: #005952;
    font-family: var(--font-1);
    margin: 0;
}

.contact-info-box .contact-number i,
.contact-info-box .contact-email i {
    font-size: 20px;
}

.contact-info-box .contact-email {
    font-size: var(--font-size-2xl);
    font-weight: bold;
    color: #005952;
    font-family: var(--font-1);
}

.page-template-get-support .zigzag-content p em,
.page-template-get-support_original .zigzag-content blockquote,
.page-template-get-support-agency .zigzag-content p em,
.self-referral-section .zigzag-content blockquote,
.self-referral-section .zigzag-content p em {
    border: unset;
}

.page-template-get-support .zigzag-content h2,
.page-template-get-support_original .zigzag-content h2,
.page-template-get-support-agency .zigzag-content h2,
.self-referral-section .zigzag-content h2 {
    font-size: var(--font-size-3xl);
    line-height: var(--line-height-tight);
}

.self-referral-section .zigzag-content h3 {
    font-size: var(--font-size-30);
}

.get-involved.self-referral-section .zigzag-content p a {
    font-size: var(--font-size-3xl) !important;
    font-weight: 600 !important;
}

.zigzag-border {
    border-top: 1px solid #e3e3e3;
    margin-top: 30px;
}

.self-referral-form-wrap label {
    width: 100%;
}

.self-referral-form-wrap label br {
    display: none;
}

/*--------------------------------------------------------------
# Yes/No Button Styles
--------------------------------------------------------------*/
.safe-to-leave-message {
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
}

.yes-no-options .wpcf7-list-item {
    display: inline-block;
    margin: 0 0.5rem 0 0;
}

.yes-no-options .wpcf7-list-item-label {
    display: inline-block;
    padding: 0.5rem 1rem;
    border: 2px solid transparent;
    border-radius: 0.25rem;
    cursor: pointer;
    font-weight: bold;
    transition: all 0.3s ease;
}

/* Style for "No" */
.yes-no-options input[type="radio"][value="No"]+.wpcf7-list-item-label {
    border-color: #dc3545;
    color: #dc3545;
    background-color: #fff;
}

/* Style for "Yes" */
.yes-no-options input[type="radio"][value="Yes"]+.wpcf7-list-item-label {
    border-color: #28a745;
    color: #fff;
    background-color: #28a745;
}

/* Style when checked */
.yes-no-options input[type="radio"]:checked+.wpcf7-list-item-label {
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.6);
}

/* Add icons */
.yes-no-options input[type="radio"][value="No"]+.wpcf7-list-item-label::before {
    font-family: "Font Awesome 5 Free";
    content: "\f00d";
    /* fa-times */
    margin-right: 0.5rem;
}

.yes-no-options input[type="radio"][value="Yes"]+.wpcf7-list-item-label::before {
    font-family: "Font Awesome 5 Free";
    content: "\f00c";
    /* fa-check */
    margin-right: 0.5rem;
}

/* Hide the actual radio button */
.yes-no-options input[type="radio"] {
    display: none;
}

/*--------------------------------------------------------------
# Feedback Page
--------------------------------------------------------------*/
.learn-more-card {
    background-color: #f8f9fa;
    padding: 2rem;
    border-radius: 0.5rem;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.05);
}

.learn-more-card h3 {
    margin-bottom: 1.5rem;
}

.learn-more-card ul {
    list-style: none;
    padding-left: 0;
}

.learn-more-card li {
    margin-bottom: 1rem;
}

.learn-more-card a {
    text-decoration: none;
    color: #333;
    font-weight: 500;
    display: flex;
    align-items: center;
}

.learn-more-card a:hover {
    color: #002A52;
}

.learn-more-card .fa-arrow-right {
    background-color: #ffc107;
    color: #333;
    padding: 0.4rem;
    border-radius: 50%;
    margin-right: 0.75rem;
    font-size: 0.8rem;
}

.feedback-flowchart {
    max-width: 100%;
    height: auto;
    border: 1px solid #eee;
    border-radius: 0.5rem;
    margin-bottom: 1rem;
}

.sidebar-box h4 {
    font-size: var(--font-size-28);
    margin-top: 15px;
    margin-bottom: 32px !important;
}

.sidebar-box {
    border-radius: 18px !important;
    overflow: hidden;
}

.sidebar-box ul li a {
    color: #000;
    font-weight: 400;
    display: block;
}

.sidebar-box ul li a img {
    margin-right: 15px;
}

.sidebar-box ul li {
    margin-bottom: 8px;
    border-bottom: 1px solid #e3e3e3;
    padding: 8px 10px;
}

.sidebar-box ul li:last-child {
    border: unset;
}

.support-content .info-box {
    padding: 40px;
    box-shadow: rgba(0, 0, 0, 0.09) 0px 3px 12px;
    border-radius: 30px;
    padding-right: 50px;
    height: 100%;
}

.support-content .info-box i,
.support-content .info-box h5 {
    /* display: inline-block; */
}

.support-content .info-box img {
    margin-bottom: 25px;
}

.support-content .info-box p {
    margin: 0;
}

.support-content h2 {
    font-size: var(--font-size-3xl);
}

.form-box {
    padding: 40px;
    box-shadow: rgba(0, 0, 0, 0.09) 0px 3px 12px;
    border-radius: 30px;
    padding-right: 50px;
    margin-bottom: 15px;
}

.form-box h5 i {
    color: #00ba00 !important;
}

.form-box a {
    color: #000;
    font-weight: 500;
}

.referral-forms h2 {
    font-size: var(--font-size-3xl);
}

/* =========================================
   Volunteer Application Form Styles
   ========================================= */

.volunteer-application-form {
    /* background-color: #f8f9fa; */
    padding: 0;
    border-radius: 0;
}

.volunteer-application-form .form-main-title {
    font-size: var(--font-size-3xl);
    font-weight: 400;
    margin-bottom: 10px;
}

.volunteer-application-form p {
    color: #000;
    margin-bottom: 0;
    margin-top: 0;
}

.volunteer-type-selection .wpcf7-list-item {
    display: inline-block;
    margin-right: 10px;
}

.volunteer-type-selection .wpcf7-list-item-label {
    background-color: #ffd51d;
    color: #000;
    padding: 15px 25px;
    border-radius: 30px;
    cursor: pointer;
    font-weight: 500;
    display: inline-block;
}

.volunteer-type-selection input[type="radio"] {
    display: none;
}

.volunteer-type-selection input[type="radio"]:checked+.wpcf7-list-item-label {
    background-color: #e0a800;
}

.form-info-box {
    background-color: #fff;
    border-left: 4px solid #ffc107;
    padding: 20px;
    margin: 30px 0;
    border-radius: 0 8px 8px 0;
}

.form-section {
    margin-bottom: 40px;
}

.form-section h3 {
    font-size: var(--font-size-36);
    font-weight: 400;
    margin-top: 25px;
    border-top: 2px solid #dee2e6;
    padding-top: 25px;
    margin-bottom: 25px;
}

.form-row {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 15px;
}

.form-full {
    flex: 0 0 100%;
}

.form-half {
    flex: 1 1 calc(50% - 10px);
}

.volunteer-application-form .form-control,
.volunteer-application-form .wpcf7-form-control.wpcf7-text,
.volunteer-application-form .wpcf7-form-control.wpcf7-textarea,
.volunteer-application-form .wpcf7-form-control.wpcf7-email,
.volunteer-application-form .wpcf7-form-control.wpcf7-tel,
.volunteer-application-form .wpcf7-form-control.wpcf7-date {
    width: 100%;
    padding: 15px;
    border: 1px solid #efefef;
    border-radius: 8px;
    background-color: #fff;
    background-color: #efefef;
}

.volunteer-application-form textarea.wpcf7-form-control.wpcf7-textarea {
    height: 175px;
}

.volunteer-application-form .form-row>label {
    width: 100%;
    font-weight: 500;
    margin-bottom: 5px;
}

.volunteer-application-form .wpcf7-radio .wpcf7-list-item {
    margin-right: 20px;
}

.disclosure-notice {
    font-style: italic;
    font-size: 0.9rem;
}

.form-submission {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 20px;
}

.form-submission .attachment-btn {
    background-color: #6c757d;
    color: #fff;
    padding: 10px 20px;
    border-radius: 8px;
    cursor: pointer;
}

.form-submission .wpcf7-submit {
    background-color: #ffc107;
    color: #000;
    padding: 15px 30px;
    border: none;
    border-radius: 8px;
    font-weight: bold;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.form-submission .wpcf7-submit:after {
    content: '→';
    font-size: 1.5rem;
}

.page-template-privacy-policy .zigzag-content p a {
    font-size: 16px !important;
    color: #000;
}

.blog-single h2 {
    font-size: var(--font-size-3xl);
}

.blog-single h3 {
    font-size: var(--font-size-36);
}

.blog-single hr {
    display: none;
}

.blog-single h2,
.blog-single h3,
.blog-single h4,
.blog-single h5 {
    margin-top: 15px;
}

.blog-single a {
    color: #000;
    font-weight: 500;
    text-decoration: underline;
}

.volunteer-application-form .wpcf7-form-control-wrap[data-name="volunteer_type"] {
    margin-top: 40px;
    display: block;
}

.volunteer-application-form .form-row p {
    width: 100%;
}

.volunteer-application-form .disclosure-notice {
    margin-bottom: 15px;
}

.volunteer-application-form h4 {
    text-decoration: underline;
}

.volunteer-application-form .wpcf7-form-control-wrap[data-name="apply-to-become"]>span>span {
    display: block;
    margin: 0;
}

.volunteer-application-form .wpcf7-form-control-wrap[data-name="apply-to-become"]>span {
    margin-top: 15px;
    display: block;
}

.volunteer-application-form .wpcf7-form-control-wrap[data-name="mental-illness"],
.volunteer-application-form .wpcf7-form-control-wrap[data-name="precludes-working"],
.volunteer-application-form .wpcf7-form-control-wrap[data-name="disability"],
.volunteer-application-form .wpcf7-form-control-wrap[data-name="driving-license"] {
    display: block;
    /* margin-bottom: 15px; */
}

.volunteer-application-form .form-submission p {
    display: flex;
    align-items: center;
    justify-content: end;
}

.volunteer-application-form .form-submission p button {
    margin: 0;
    margin-left: 15px;
}

.volunteer-application-form .form-submission input[type="file"] {
    width: 250px;
}

.volunteer-application-form .form-row p label {
    margin-bottom: 8px;
}

.page-id-236 .zigzag-content ul {
    padding: 15px;
    background-color: #f0f0f0;
    border-radius: 8px;
}

.newsletter-form>div {
    width: 100%;
}

.newsletter-form p {
    display: flex;
    gap: 3px;
    align-items: start;
}

.newsletter-form p>span {
    flex: 1 1 auto;
}

.newsletter-form button {
    height: 60px;
}

section.inner-banner {
    border-radius: 30px;
    overflow: hidden;

}

.trusted-star span.text-dark.small {
    color: #000;
    font-weight: 500;
}

.trusted-star span.small {
    font-weight: 500;
}

.topic-card .card-title {
    font-size: var(--font-size-36);
}

.page-template-home .partnership-section .section-title {
    font-size: 19px;
    font-weight: 500;
    letter-spacing: 0;
}

.page-template-home .partnership-section {
    padding-top: 0;
    padding-bottom: 0;
}

.page-template-all-sections section.inner-banner.position-relative {
    display: none;
}

/*******************************
    Donate Page
********************************/

.donate-section {
    background: #fff;
}

.donate-intro {
    max-width: 780px;
    margin: 0 auto;
}

.donate-intro h1 {
    font-size: 48px;
    margin-bottom: 20px;
}

.donate-intro p {
    font-size: 20px;
    line-height: 1.6;
}

.donate-card {
    height: 100%;
    background: #f8f8f5;
    border-radius: 24px;
    padding: 35px;
    border-left: 6px solid #ffd51b;
    transition: all 0.25s ease;
}

.donate-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 35px rgba(0,0,0,0.08);
}

.donate-card h3 {
    font-size: 26px;
    margin-bottom: 15px;
}

.donate-card p {
    font-size: 17px;
    line-height: 1.6;
}

.donate-btn {
    display: inline-block;
    margin-top: 15px;
    background: #ffd51b;
    color: #000;
    font-weight: 700;
    padding: 14px 24px;
    border-radius: 8px;
    text-decoration: none;
}

.donate-btn:hover {
    background: #e8c300;
    color: #000;
}

.qr-placeholder {
    margin-top: 20px;
    background: #fff;
    border: 2px dashed #ccc;
    border-radius: 16px;
    padding: 40px;
    text-align: center;
    font-weight: 700;
    color: #777;
}

@media (max-width: 768px) {
    .donate-intro h1 {
        font-size: 34px;
    }

    .donate-card {
        padding: 25px;
    }
}