:root{--primary-dark:#3a1700;--primary-teal:#004d45;--light-teal:#16766e;--accent-teal:#1f9d92;--white:#ffffff;--light-bg:#f8f9fa;--text-dark:#1a1a1a;--text-gray:#4a5568;--border-light:#e2e8f0;--heading-font:'Rowdies',cursive;--body-font:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,sans-serif}*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth;overflow-x:hidden}body{font-family:var(--body-font);line-height:1.7;color:var(--text-gray);background:var(--white);-webkit-font-smoothing:antialiased;overflow-x:hidden;width:100%}.hero{position:relative;min-height:70vh;display:flex;align-items:center;overflow:hidden;background-attachment:fixed;background-position:center;background-size:cover;background-repeat:no-repeat}.hero::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,rgba(0,77,69,0.95) 0%,rgba(22,118,110,0.9) 100%);z-index:1;pointer-events:none}.hero::after{content:'';position:absolute;bottom:0;left:0;right:0;height:150px;background:linear-gradient(to bottom,transparent,var(--white));z-index:2;pointer-events:none}.hero-content{position:relative;z-index:3;max-width:1200px;width:100%;margin:0 auto;padding:100px 40px 60px;color:var(--white)}.hero-content{position:relative;z-index:2;max-width:1200px;width:100%;margin:0 auto;padding:100px 40px 60px;color:var(--white)}.breadcrumb{display:inline-flex;align-items:center;gap:8px;font-size:0.85rem;margin-bottom:32px;padding:8px 20px;background:rgba(255,255,255,0.1);backdrop-filter:blur(10px);border-radius:50px;border:1px solid rgba(255,255,255,0.2)}.breadcrumb a{color:rgba(255,255,255,0.9);text-decoration:none;transition:color 0.3s ease}.breadcrumb a:hover{color:var(--white)}.breadcrumb-separator{opacity:0.5}.hero-title{font-family:var(--heading-font);font-size:4rem;font-weight:700;line-height:1.15;margin-bottom:28px;letter-spacing:-1.5px;max-width:900px;color:var(--white)}.hero-subtitle{font-size:1.35rem;line-height:1.7;max-width:700px;opacity:0.95;font-weight:400;color:var(--white)}.content-wrapper,.container{max-width:1200px;margin:0 auto;padding:0 40px 100px}.intro-section,.project-info{max-width:800px;margin:-40px auto 100px;padding:50px 60px;background:var(--white);border-radius:20px;box-shadow:0 10px 40px rgba(0,77,69,0.08);position:relative;z-index:3}.intro-text,.intro-description{font-size:1.15rem;line-height:1.9;color:var(--text-dark);margin-bottom:24px}.intro-description{font-size:1.05rem;line-height:1.8;color:var(--text-gray)}.info-item{margin-bottom:16px;font-size:1.05rem;line-height:1.8}.info-item:last-child{margin-bottom:0}.info-label{font-weight:600;color:var(--text-dark)}.info-value{font-weight:700;color:var(--primary-teal)}.section-header{text-align:center;margin-bottom:60px}.section-eyebrow{font-size:0.9rem;font-weight:600;text-transform:uppercase;letter-spacing:2px;color:var(--primary-teal);margin-bottom:16px}.section-number{display:inline-flex;align-items:center;justify-content:center;width:50px;height:50px;background:var(--light-bg);border:2px solid var(--primary-teal);border-radius:50%;color:var(--primary-teal);font-family:var(--heading-font);font-size:1.25rem;margin:0 auto 20px}.section-title{font-family:var(--heading-font);font-size:2.5rem;color:var(--primary-dark);margin-bottom:16px;letter-spacing:-0.5px}.section-subtitle,.section-description{font-size:1.05rem;color:var(--text-gray);font-weight:500;max-width:850px;margin:0 auto;line-height:1.8;text-align:center}.section-text{font-size:1.1rem;line-height:1.9;color:var(--text-dark);text-align:justify;margin-bottom:40px}.section-text strong{color:var(--primary-teal);font-weight:600}.program-section,.content-section{margin-bottom:100px}.what-we-do{padding:100px 20px;background:var(--light-bg);position:relative;overflow:hidden}.what-we-do::before{content:'';position:absolute;top:-50px;right:-50px;width:300px;height:300px;background:radial-gradient(circle,rgba(0,77,69,0.05) 0%,transparent 70%);border-radius:50%;pointer-events:none}.image-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:30px;margin-bottom:30px}.image-grid.single,.image-grid.single-col{grid-template-columns:1fr;max-width:900px;margin-left:auto;margin-right:auto}.image-grid.two-col{grid-template-columns:repeat(2,1fr)}.image-grid.three-col{grid-template-columns:repeat(3,1fr)}.image-grid.grid-4{grid-template-columns:repeat(2,1fr)}.image-item{position:relative;border-radius:16px;overflow:hidden;background:var(--light-bg);transition:all 0.4s cubic-bezier(0.4,0,0.2,1)}.image-item:hover{transform:translateY(-8px);box-shadow:0 20px 50px rgba(0,77,69,0.12)}.image-item img{width:100%;height:100%;object-fit:cover;display:block;aspect-ratio:3/2;transition:transform 0.6s ease}.image-item:hover img{transform:scale(1.08)}.image-overlay{position:absolute;bottom:0;left:0;right:0;padding:24px;background:linear-gradient(to top,rgba(0,0,0,0.8),transparent);transform:translateY(100%);transition:transform 0.4s ease}.image-item:hover .image-overlay{transform:translateY(0)}.image-caption{position:absolute;bottom:0;left:0;right:0;padding:24px;background:linear-gradient(to top,rgba(0,0,0,0.8),transparent);color:var(--white);font-size:0.95rem;font-weight:500;line-height:1.4;font-style:italic;text-align:center;transform:translateY(100%);transition:transform 0.4s ease}.image-item:hover .image-caption{transform:translateY(0)}.map-image,.map-container{max-width:900px;margin:0 auto 40px}.map-container{display:grid;grid-template-columns:1.5fr 1fr;gap:30px}.map-images{display:grid;gap:20px}.programs-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(380px,1fr));gap:40px;margin-top:60px}.program-card{background:var(--white);border-radius:20px;overflow:hidden;box-shadow:0 4px 24px rgba(0,77,69,0.1);transition:all 0.4s cubic-bezier(0.4,0,0.2,1);display:flex;flex-direction:column;opacity:0;transform:translateY(40px);animation:fadeInUp 0.7s ease-out forwards;border:1px solid rgba(0,77,69,0.08)}.program-card:nth-child(1){animation-delay:0.1s}.program-card:nth-child(2){animation-delay:0.2s}.program-card:nth-child(3){animation-delay:0.3s}.program-card:nth-child(4){animation-delay:0.4s}.program-card:nth-child(5){animation-delay:0.5s}.program-card:nth-child(6){animation-delay:0.6s}.program-card:nth-child(7){animation-delay:0.7s}.program-card:nth-child(8){animation-delay:0.8s}.program-card:hover{transform:translateY(-12px);box-shadow:0 20px 56px rgba(0,77,69,0.18)}.program-image{position:relative;width:100%;height:300px;overflow:hidden;background:linear-gradient(135deg,#16766e 0%,#004d45 100%)}.program-image img{width:100%;height:100%;object-fit:cover;transition:transform 0.6s ease}.program-card:hover .program-image img{transform:scale(1.1)}.program-content{padding:40px 36px 44px;flex:1;display:flex;flex-direction:column;background:var(--white)}.program-title{font-family:var(--heading-font);font-size:1.65rem;font-weight:700;color:var(--primary-dark);margin-bottom:20px;line-height:1.25;letter-spacing:-0.3px}.program-description{font-size:1rem;color:var(--text-gray);line-height:1.85;margin-bottom:28px;flex:1;font-weight:400}.projects-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:40px;margin-top:-20px}.project-card{background:var(--white);border-radius:16px;overflow:hidden;box-shadow:0 4px 20px rgba(0,77,69,0.08);transition:all 0.4s cubic-bezier(0.4,0,0.2,1);opacity:0;transform:translateY(30px)}.project-card.visible{opacity:1;transform:translateY(0)}.project-card:hover{transform:translateY(-12px);box-shadow:0 20px 50px rgba(0,77,69,0.15)}.project-image{position:relative;width:100%;height:350px;overflow:hidden}.project-image img{width:100%;height:100%;object-fit:cover;transition:transform 0.5s cubic-bezier(0.4,0,0.2,1)}.project-card:hover .project-image img{transform:scale(1.08)}.project-content{padding:32px}.project-title{font-family:var(--heading-font);font-size:1.75rem;color:var(--primary-teal);margin-bottom:15px;line-height:1.3}.project-description{font-size:1rem;line-height:1.7;color:var(--text-gray)}.program-cta{display:flex;gap:12px;align-items:center;margin-top:auto}.btn{display:inline-flex;align-items:center;gap:8px;padding:14px 28px;border-radius:8px;font-size:0.95rem;font-weight:600;text-decoration:none;transition:all 0.3s ease;cursor:pointer;border:none}.btn-primary{background:var(--primary-teal);color:var(--white)}.btn-primary:hover{background:var(--primary-dark);transform:translateX(4px)}.btn-icon{width:16px;height:16px;transition:transform 0.3s ease}.btn:hover .btn-icon{transform:translateX(4px)}.highlight-box,.highlight-section{background:linear-gradient(135deg,var(--primary-teal) 0%,var(--light-teal) 100%);padding:40px 50px;border-radius:16px;color:var(--white);margin:60px 0;box-shadow:0 10px 40px rgba(0,77,69,0.15);position:relative;overflow:hidden}.highlight-section{padding:80px 60px;border-radius:24px;margin-bottom:120px}.highlight-section::before{content:'';position:absolute;top:-50%;right:-10%;width:500px;height:500px;background:radial-gradient(circle,rgba(255,255,255,0.1) 0%,transparent 70%);border-radius:50%}.highlight-content{position:relative;z-index:1;max-width:800px;margin:0 auto;text-align:center}.highlight-tag{display:inline-block;padding:8px 20px;background:rgba(255,255,255,0.15);backdrop-filter:blur(10px);border-radius:50px;font-size:0.85rem;font-weight:600;text-transform:uppercase;letter-spacing:1px;margin-bottom:24px}.highlight-title{font-family:var(--heading-font);color:var(--white);font-size:2.75rem;margin-bottom:24px;line-height:1.2}.highlight-text,.highlight-box p{font-size:1.15rem;line-height:1.8;opacity:0.95;margin:0}.highlight-box p{font-size:1.1rem}.highlight-box strong{font-weight:600}.festival-info{display:inline-flex;align-items:center;gap:12px;padding:16px 32px;background:rgba(255,255,255,0.2);backdrop-filter:blur(10px);border-radius:50px;font-size:1.05rem;font-weight:600;border:1px solid rgba(255,255,255,0.3)}.stats-section{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin:80px 0;padding:60px 40px;background:var(--light-bg);border-radius:20px}.stat-item{text-align:center}.stat-number{font-family:var(--heading-font);font-size:3rem;color:var(--primary-teal);display:block;margin-bottom:8px;line-height:1}.stat-label{font-size:0.95rem;color:var(--text-gray);font-weight:500}.info-card{background:var(--light-bg);padding:40px;border-radius:16px;margin:40px 0}.info-card h3{font-family:var(--heading-font);color:var(--primary-teal);font-size:1.5rem;margin-bottom:20px}.info-card ul{list-style:none;padding:0}.info-card li{padding:12px 0 12px 32px;position:relative;color:var(--text-gray);font-size:1.05rem}.info-card li::before{content:"→";position:absolute;left:0;color:var(--accent-teal);font-weight:bold;font-size:1.2rem}.timeline-section{margin:80px 0}.timeline-item{display:flex;gap:40px;margin-bottom:50px;align-items:flex-start}.timeline-year{font-family:var(--heading-font);font-size:2rem;color:var(--primary-teal);min-width:120px;text-align:right}.timeline-content{flex:1;padding:30px;background:var(--light-bg);border-radius:16px;border-left:4px solid var(--primary-teal)}.timeline-title{font-family:var(--heading-font);font-size:1.4rem;color:var(--primary-dark);margin-bottom:12px}.timeline-text{font-size:1.05rem;line-height:1.8;color:var(--text-gray)}.barangay-section{margin-bottom:100px}.barangay-title{font-family:var(--heading-font);font-size:2.2rem;color:var(--primary-teal);margin-bottom:40px;padding-bottom:15px;border-bottom:3px solid var(--accent-teal);position:relative}.barangay-title::after{content:'';position:absolute;bottom:-3px;left:0;width:80px;height:3px;background:var(--primary-dark)}@keyframes fadeInUp{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInDown{from{opacity:0;transform:translateY(-30px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:fadeInUp 0.8s ease-out}.content-section,.highlight-box{opacity:0;transform:translateY(30px);transition:all 0.8s ease-out}.content-section.visible,.highlight-box.visible{opacity:1;transform:translateY(0)}@media (min-width:1440px){.container{max-width:1400px}.programs-grid{grid-template-columns:repeat(3,1fr)}}@media (max-width:1439px){.programs-grid{grid-template-columns:repeat(3,1fr);gap:32px}}@media (max-width:1199px){.what-we-do{padding:80px 20px}.programs-grid{grid-template-columns:repeat(2,1fr);gap:32px}.section-title{font-size:2.75rem}}@media (max-width:991px){.hero-title{font-size:3rem}.hero-subtitle{font-size:1.15rem}.intro-section,.project-info{padding:40px}.section-title{font-size:2rem}.highlight-title{font-size:2.25rem}.stats-section{grid-template-columns:repeat(2,1fr);gap:30px}.image-grid.three-col,.image-grid.grid-4{grid-template-columns:repeat(2,1fr)}.map-container{grid-template-columns:1fr}.programs-grid{grid-template-columns:repeat(2,1fr)}.program-image{height:280px}.program-content{padding:36px 32px 40px}.program-title{font-size:1.5rem}.program-description{font-size:0.95rem}.projects-grid{gap:35px}.project-image{height:320px}}@media (max-width:767px){.hero{min-height:60vh;background-attachment:scroll!important}.hero-content{padding:80px 24px 40px}.hero-title{font-size:2.25rem;letter-spacing:-0.5px}.hero-subtitle{font-size:1.05rem}.breadcrumb{font-size:0.85rem;padding:8px 18px;margin-bottom:20px;gap:8px}.content-wrapper,.container{padding:0 24px 80px}.intro-section,.project-info{margin:-30px 16px 80px;padding:35px 28px;border-radius:16px}.intro-text{font-size:1.05rem}.intro-description{font-size:0.95rem}.program-section,.content-section{margin-bottom:80px}.section-title{font-size:1.75rem}.section-eyebrow{font-size:0.85rem;letter-spacing:1.5px}.section-subtitle{font-size:1.05rem}.section-text{font-size:1.05rem;text-align:left;margin-bottom:30px}.image-grid,.image-grid.two-col,.image-grid.three-col,.image-grid.grid-4{grid-template-columns:1fr;gap:20px}.highlight-section{padding:50px 32px;border-radius:16px;margin-bottom:80px}.highlight-title{font-size:1.85rem}.highlight-text{font-size:1rem}.highlight-box{padding:32px 28px;margin:40px 0}.highlight-box p{font-size:1rem}.stats-section{grid-template-columns:1fr;gap:30px;padding:40px 24px}.stat-number{font-size:2.5rem}.info-card{padding:30px 24px}.timeline-item{flex-direction:column;gap:20px}.timeline-year{text-align:left;min-width:auto}.barangay-title{font-size:1.8rem}.what-we-do{padding:60px 16px}.section-header{margin-bottom:40px}.programs-grid{grid-template-columns:1fr;gap:28px}.program-card{max-width:540px;margin:0 auto}.program-image{height:260px}.program-content{padding:32px 28px 36px}.program-title{font-size:1.4rem;margin-bottom:16px}.program-description{font-size:0.95rem;margin-bottom:24px}.program-cta{flex-direction:column;gap:10px}.btn{width:100%;justify-content:center;padding:15px 24px}.projects-grid{grid-template-columns:1fr;gap:30px;margin-top:20px}.project-image{height:280px}.project-content{padding:28px}.project-title{font-size:1.5rem}.project-description{font-size:0.95rem}}@media (max-width:480px){.hero{min-height:48vh}.hero-content{padding:50px 20px 38px}.hero-title{font-size:1.85rem;line-height:1.25}.hero-subtitle{font-size:0.95rem;line-height:1.5}.breadcrumb{font-size:0.8rem;padding:7px 16px;margin-bottom:18px;gap:6px}.content-wrapper,.container{padding:0 16px 50px}.intro-section,.project-info{margin:-25px 8px 50px;padding:28px 24px;border-radius:12px}.intro-text{font-size:0.95rem}.info-item{font-size:0.9rem;margin-bottom:10px}.info-label{display:block;margin-bottom:4px}.section-number{width:40px;height:40px;font-size:1rem}.section-title{font-size:1.5rem}.section-text{font-size:0.95rem}.image-grid{gap:16px;margin-bottom:30px}.image-item{border-radius:12px}.image-caption,.image-overlay{padding:16px;font-size:0.85rem}.highlight-section,.highlight-box{padding:40px 24px;border-radius:12px}.highlight-box{margin:30px 0}.highlight-box p,.highlight-text{font-size:0.9rem;line-height:1.7}.barangay-title{font-size:1.5rem}.what-we-do{padding:50px 16px}.section-header{margin-bottom:35px}.section-eyebrow{font-size:0.8rem}.section-title{font-size:2rem}.section-subtitle{font-size:1rem}.programs-grid{gap:20px}.program-image{height:200px}.program-content{padding:20px}.program-title{font-size:1.25rem;margin-bottom:12px}.program-description{font-size:0.85rem;margin-bottom:16px}.btn{padding:12px 20px;font-size:0.9rem}.projects-grid{gap:25px}.project-image{height:240px}.project-content{padding:22px}.project-title{font-size:1.35rem}.project-description{font-size:0.9rem}}@media (max-width:360px){.hero{min-height:45vh}.hero-content{padding:45px 20px 35px}.hero-title{font-size:1.45rem}.hero-subtitle{font-size:0.85rem}.breadcrumb{font-size:0.75rem;padding:6px 14px}.content-wrapper,.container{padding:0 12px 40px}.intro-section,.project-info{padding:20px 16px}.section-text{font-size:0.9rem}.section-title{font-size:1.85rem}.what-we-do{padding:40px 12px}.program-image{height:180px}.program-title{font-size:1.2rem}.project-content{padding:20px}.project-title{font-size:1.25rem}.project-description{font-size:0.85rem}}@media (max-width:767px) and (orientation:landscape){.what-we-do{padding:40px 16px}.section-header{margin-bottom:30px}.section-title{font-size:2rem}.program-image,.project-image{height:180px}.programs-grid{grid-template-columns:repeat(2,1fr);gap:20px}}.program-card:focus-within,.project-card:focus-within{outline:3px solid var(--primary-teal);outline-offset:4px}.btn:focus-visible{outline:3px solid var(--primary-teal);outline-offset:2px}@media (hover:none) and (pointer:coarse){.program-card:hover,.project-card:hover{transform:none}.program-card:active,.project-card:active{transform:scale(0.98)}.btn{min-height:44px}.program-card:hover .program-image img,.project-card:hover .project-image img,.image-item:hover img{transform:scale(1)}}@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:0.01ms!important;animation-iteration-count:1!important;transition-duration:0.01ms!important}}@media print{.program-card,.project-card{break-inside:avoid;box-shadow:none;border:1px solid #ddd;page-break-inside:avoid}.program-image,.project-image{height:180px}.btn{display:none}.hero{min-height:auto;page-break-after:avoid}}