
                    /* Responsive Design Improvements */
  * {
      box-sizing: border-box;
    }
                    
  :root {
                        --content-max: 1200px;
                        --space-sm: 12px;
                        --space-md: 20px;
                        --space-lg: 40px;
        }
                    
                  
                    
     .container {
        max-width: var(--content-max);
        margin: 0 auto;
        padding: 0 15px;
        }
                    
    .section {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    padding: 0px !important;
            }
                    
                    .section-reverse {
                        flex-direction: row-reverse;
                    }
                    
                    .text-content {
                        flex: 1;
                        min-width: 0;
                    }
                    
                    .text-content h1 {
                        margin-top: 0;
                        margin-bottom: 16px;
                        font-size: 2.25rem;
                        line-height: 1.2;
                    }
                    
                    .image-content {
                        flex: 1;
                        min-width: 0;
                    }
                    
                    .image-content img {
                        max-width: 100%;
                        height: auto;
                        border-radius: 8px;
                        display: block;
                    }
                    
                    .donation-box {
                        display: flex;
                        gap: 16px;
                        margin-top: 18px;
                        align-items: center;
                    }
                    
                    .donation-box img {
                        max-width: 48%;
                        border-radius: 6px;
                    }
                    
                    @media (max-width: 1024px) {
                        .section { gap: 10px; }
                        .text-content h1 { font-size: 1.8rem; }
                    }
                    
                    @media (max-width: 768px) {
                        .section {
                            flex-direction: column !important;
                            gap: 20px;
                        }
                        .section-reverse {
                            flex-direction: column !important;
                        }
                        .text-content h1 {
                            font-size: 1.5rem;
                            margin-bottom: 12px;
                        }
                        .text-content p {
                            font-size: 0.95rem;
                        }
                        .image-content { width: 100%; }
                        .donation-box { flex-direction: column; }
                        .donation-box img { max-width: 100%; }
                        .btn {
                            padding: 10px 16px !important;
                            font-size: 0.9rem !important;
                            width: 100% !important;
                        }
                        .col-md-2 {
                            flex: 0 0 calc(50% - 6px) !important;
                        }
                    }
                    
                    @media (max-width: 480px) {
                        .container { padding: 12px; }
                        .text-content h1 {
                            font-size: 1.25rem;
                            margin-bottom: 10px;
                        }
                        .text-content p {
                            font-size: 0.875rem;
                        }
                        .btn {
                            padding: 8px 12px !important;
                            font-size: 0.85rem !important;
                            width: 100% !important;
                        }
                        .col-6 { flex: 0 0 calc(50% - 6px) !important; }
                        .col-md-2 { flex: 0 0 calc(50% - 6px) !important; }
                    }
                    /* About us background + overlay */
                    .about-us {
                        position: relative;
                        background-image: url('assets/images/20251114_110631.jpg');
                        background-size: cover;
                        background-position: center center;
                        background-repeat: no-repeat;
                        color: #fff;
                        padding: 60px 0;
                        min-height: 360px;
                        display: block;
                    }

                    .about-us::before {
                        content: "";
                        position: absolute;
                        inset: 0;
                        background: rgba(0,0,0,0.6); /* black overlay */
                        z-index: 0;
                    }

                    .about-us > * {
                        position: relative; /* place content above overlay */
                        z-index: 1;
                    }
    /* From Uiverse.io by Fcodingx */ 
   
 / *   R e d u c e   s i z e   o f   c a r d   i m a g e s   ( B o r o   B o s c o ,   e t c . )   * /  
 . c a r d   . i m a g e - w r a p p e r   {  
     m a x - w i d t h :   2 0 0 p x ;  
     m a r g i n :   0   a u t o ;  
 }  
  
 . c a r d   . i m a g e - w r a p p e r   i m g   {  
     m a x - w i d t h :   1 0 0 % ;  
     h e i g h t :   a u t o ;  
     b o r d e r - r a d i u s :   8 p x ;  
 }  
  
 @ m e d i a   ( m a x - w i d t h :   7 6 8 p x )   {  
     . c a r d   . i m a g e - w r a p p e r   {  
         m a x - w i d t h :   1 5 0 p x ;  
     }  
 }  
 