/* Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600;700&family=Inter:wght@300;400;500;600;700&display=swap');
:root {--dark-green: #1b4d3e;--medium-green: #0b3d2e;--light-green: #4a7c4a;--off-white: #FAF9F6;--cream: #F5F5DC;--gold: #c9a227;--text-dark: #1a1a1a;--text-gray: #4a4a4a;--white: #FFFFFF;--border-gray: #e0e0e0;--font-display: 'Playfair Display', serif;--font-body: 'Inter', sans-serif;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1);--radius-sm: 0.375rem;--radius-md: 0.625rem;--radius-lg: 0.75rem;--radius-xl: 1rem;--radius-2xl: 1.5rem;--radius-3xl: 2rem;}
/* Reset & Base */
*, *::before, *::after {box-sizing: border-box;margin: 0;padding: 0;}
html {scroll-behavior: smooth;}
body {font-family: var(--font-body);background-color: var(--off-white);color: var(--text-dark);line-height: 1.6;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
h1, h2, h3, h4, h5, h6 {font-family: var(--font-display);font-weight: 700;line-height: 1.2;}
.logo-text {line-height:24px;font-size:17px; font-family: var(--font-display);font-weight: 700;}

a {text-decoration: none;color: inherit;}
section a:hover {color: var(--light-green);}
img {max-width: 100%;height: auto;display: block;}
button {cursor: pointer;border: none;background: none;font-family: inherit;}

/* Container */
/* ============================================
Top Bar
============================================ */
.top-bar {background: linear-gradient(to right, var(--dark-green), var(--medium-green));color: var(--white);padding: 0.625rem 0;}
.top-bar-content {display: flex;flex-direction: column;align-items: center;gap: 0.5rem;}
@media (min-width: 640px) {.top-bar-content {flex-direction: row;justify-content: space-between;}
}
.top-bar-contact {display: flex;flex-wrap: wrap;align-items: center;justify-content: center;gap: 1rem;font-size: 0.875rem;}
.top-bar-contact a {display: flex;align-items: center;gap: 0.5rem;transition: color 0.3s;}
.top-bar-contact a:hover {color: var(--gold);}
.top-bar-social {display: flex;align-items: center;gap: 0.75rem;}
.social-icon {width: 2rem;height: 2rem;background: rgba(255, 255, 255, 0.1);border-radius: 9999px;display: flex;align-items: center;justify-content: center;transition: all 0.3s;}
.social-icon:hover {background: var(--gold);transform: scale(1.1);}
.social-icon svg {width: 1rem;height: 1rem;}
/* ============================================
Navigation
============================================ */
.navbar {position: sticky;top: 0;z-index: 50;transition: all 0.3s;padding: 1.25rem 0;}
.navbar.scrolled {background: rgba(250, 249, 246, 0.95);backdrop-filter: blur(12px);box-shadow: var(--shadow-lg);padding: 0.75rem 0;}
.navbar-content {display: flex;align-items: center;justify-content: space-between;}
.logo {display: flex;align-items: center;gap: 0.75rem;}
.logo-icon {width: 3rem;height: 3rem;background: var(--dark-green);border-radius: var(--radius-lg);display: flex;align-items: center;justify-content: center;transition: transform 0.3s;}
.logo:hover .logo-icon {transform: scale(1.05);}
.logo-icon span {color: var(--white);font-weight: 700;font-size: 1.25rem;}
.logo-text {display: none;}


@media (min-width: 640px) {
.logo-text {display: block;}
#navbar-content-button {border:0px brown solid;display: flex;align-items: left;}
}
.logo-text p:first-child {font-size: 0.75rem;color: var(--text-gray);line-height: 1;}
.logo-text p:last-child {font-size: 0.875rem;font-weight: 700;color: var(--dark-green);line-height: 1;}
/* Desktop Navigation */
.nav-desktop {display: none;}

@media (min-width: 1024px) {
.nav-desktop {display: flex;align-items: center;gap: 1.5rem;}
}

.nav-item {position: relative;}
.nav-link {display: flex;align-items: center;gap: 0.25rem;padding: 0.5rem 0;font-size: 0.875rem;font-weight: 500;color: var(--text-dark);transition: color 0.3s;position: relative;}
.nav-link::after {content: '';position: absolute;bottom: 0;left: 50%;width: 0;height: 2px;background: var(--dark-green);transition: all 0.3s;transform: translateX(-50%);}
.nav-link:hover {color: var(--dark-green);}
.nav-link:hover::after {width: 100%;}
.nav-link.active {color: var(--dark-green);}
.nav-link svg {width: 1rem;height: 1rem;}
/* Dropdown */
.dropdown {position: absolute;top: 100%;left: 0;margin-top: 0.5rem;width: 16rem;background: var(--white);border-radius: var(--radius-md);box-shadow: var(--shadow-xl);border: 1px solid var(--border-gray);overflow: hidden;opacity: 0;visibility: hidden;transform: translateY(-10px);transition: all 0.3s;}
.nav-item:hover .dropdown {opacity: 1;visibility: visible;transform: translateY(0);}
.dropdown a {display: block;padding: 0.75rem 1rem;font-size: 0.875rem;color: var(--text-gray);transition: all 0.2s;}
.dropdown a:hover {background: var(--dark-green);color: var(--white);}
/* CTA Button */

.btn-primary2 {display: inline-flex;align-items: center;gap: 0.5rem;background: var(--dark-green);color: var(--white);padding: 0.75rem 1.5rem;border-radius: var(--radius-lg);font-weight: 500;transition: all 0.3s;}
.btn-primary2:hover {background: var(--medium-green);transform: translateY(-2px);box-shadow: var(--shadow-lg);color:#FFF;}
.btn-secondary2 {display: inline-flex;align-items: center;gap: 0.5rem;background: transparent;border: 2px solid var(--dark-green);color: var(--dark-green);padding: 0.75rem 1.5rem;border-radius: var(--radius-lg);font-weight: 500;transition: all 0.3s;}
.btn-secondary2:hover {background: var(--dark-green);color: var(--white);}


/* Mobile Menu Button */
.mobile-menu-btn {padding: 0.5rem;border-radius: var(--radius-lg);transition: background 0.3s;}
.mobile-menu-btn:hover {background: rgba(0, 100, 0, 0.1);}
.mobile-menu-btn svg {width: 1.5rem;height: 1.5rem;color: var(--dark-green);}
@media (min-width: 1024px) {
.mobile-menu-btn {display: none;}
}



/* Mobile Menu */
.mobile-menu {width:100%!important;display: none;margin-top: 0;padding-top: 1rem;border-top: 1px solid var(--border-gray);}

.mobile-menu.open {display: block;}

.mobile-nav-link {display: block;padding: 0.75rem 1rem;border-radius: var(--radius-lg);font-weight: 500;transition: all 0.3s;}

.mobile-nav-link:hover,.mobile-nav-link.active {background: var(--dark-green);color: var(--white);}
.mobile-dropdown {position: relatives;margin-left: 1rem;margin-top: 0.25rem;}

.mobile-dropdown a {display: block;padding: 0.5rem 1rem;font-size: 0.875rem;color: var(--text-gray);}
.mobile-dropdown a:hover {color: var(--dark-green);}


/* ============================================
Hero Section
============================================ */
.hero {position: relative;height: 100vh;min-height: 600px;overflow: hidden;display: flex;align-items: center;justify-content: center;}
.hero-bg {position: absolute;inset: 0;z-index: 0;}
.hero-bg img {width: 100%;height: 100%;object-fit: cover;transform: scale(1.1);}
.hero-overlay {position: absolute;inset: 0;background: linear-gradient(to bottom, rgba(0,0,0,0.5), rgba(0,0,0,0.4), rgba(0,0,0,0.6));z-index: 1;}
.hero-content {position: relative;z-index: 10;text-align: center;padding: 0 1rem;max-width: 900px;}
.hero-eyebrow {color: rgba(255, 255, 255, 0.9);font-size: 0.875rem;text-transform: uppercase;letter-spacing: 0.3em;margin-bottom: 1rem;}
.hero-title {color: var(--white);font-size: 2.25rem;margin-bottom: 1.5rem;line-height: 1.1;}
@media (min-width: 640px) {.hero-title {font-size: 3rem;}
}
@media (min-width: 768px) {.hero-title {font-size: 3.75rem;}
}
@media (min-width: 1024px) {.hero-title {font-size: 4.5rem;}
}
.hero-subtitle {color: rgba(255, 255, 255, 0.9);font-size: 1.125rem;max-width: 600px;margin: 0 auto 2.5rem;}
.hero-buttons {display: flex;flex-direction: column;align-items: center;gap: 1rem;}
@media (min-width: 640px) {.hero-buttons {flex-direction: row;justify-content: center;}
}

.hero-scroll {position: absolute;bottom: 2.5rem;left: 50%;transform: translateX(-50%);z-index: 10;color: rgba(255, 255, 255, 0.8);text-align: center;animation: bounce 2s infinite;}
.hero-scroll span {font-size: 0.75rem;text-transform: uppercase;letter-spacing: 0.1em;}
@keyframes bounce {0%, 100% { transform: translateX(-50%) translateY(0);}
50% { transform: translateX(-50%) translateY(10px);}
}
/* ============================================
Section Styles
============================================ */
.section {padding: 1rem 0;}
@media (min-width: 768px) {.section {padding: 5rem 0;}
}
.section-header {text-align: center;margin-bottom: 4rem;}
.section-title {font-size: 2.25rem;color: var(--text-dark);margin-bottom: 2px;}
@media (min-width: 768px) {.section-title {font-size: 3rem;}
}
.section-subtitle {font-size: 1.125rem;color: var(--text-gray);margin:0 0 20px 0;}
/* ============================================
Leadership Cards
============================================ */
.leadership-grid {display: grid;grid-template-columns: repeat(1, 1fr);gap: 1.5rem;}
@media (min-width: 640px) {.leadership-grid {grid-template-columns: repeat(2, 1fr);}
}
@media (min-width: 1024px) {.leadership-grid {grid-template-columns: repeat(4, 1fr);}
}
.leader-card {background: var(--white);border-radius: var(--radius-md);overflow: hidden;box-shadow: var(--shadow-md);transition: all 0.3s;}
.leader-card:hover {transform: translateY(-8px);box-shadow: var(--shadow-xl);}
.leader-card:nth-child(2),.leader-card:nth-child(4) {transform: translateY(-12px);}
.leader-card:nth-child(2):hover,.leader-card:nth-child(4):hover {transform: translateY(-20px);}
.leader-image {position: relative;height: 19.5rem;overflow: hidden;}
.leader-image img {width: 100%;height: 100%;object-fit: cover;transition: transform 0.5s;}
.leader-card:hover .leader-image img {transform: scale(1.05);}
.leader-overlay {position: absolute;inset: 0;background: linear-gradient(to top, rgba(0,0,0,0.6), transparent);}
.leader-quote-icon {position: absolute;top: 1rem;right: 1rem;width: 2.5rem;height: 2.5rem;background: var(--dark-green);border-radius: 9999px;display: flex;align-items: center;justify-content: center;opacity: 0;transition: opacity 0.3s;}
.leader-card:hover .leader-quote-icon {opacity: 1;}
.leader-quote-icon svg {width: 1.25rem;height: 1.25rem;color: var(--white);}
.leader-info {position: absolute;bottom: 1rem;left: 1rem;right: 1rem;}
.leader-info h3 {color: var(--white);font-size: 1.125rem;margin-bottom: 0.25rem;}
.leader-info p {color: rgba(255, 255, 255, 0.8);font-size: 0.875rem;}
.leader-content {padding: 1.25rem;}
.leader-content p {color: var(--text-gray);font-size: 0.875rem;line-height: 1.6;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;overflow: hidden;}
.leader-link {display: inline-flex;align-items: center;gap: 0.5rem;margin-top: 1rem;color: var(--dark-green);font-weight: 500;font-size: 0.875rem;transition: gap 0.3s;}
.leader-link:hover {gap: 0.75rem;}
.leader-link svg {width: 1rem;height: 1rem;}
/* ============================================
Statistics Section
============================================ */
.stats-section {background: var(--dark-green);position: relative;overflow: hidden;padding: 4rem 0;}
.stats-pattern {position: absolute;inset: 0;opacity: 0.05;background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='1'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");}
.stats-grid {display: grid;grid-template-columns: repeat(2, 1fr);gap: 2rem;position: relative;z-index: 1;}
@media (min-width: 1024px) {.stats-grid {grid-template-columns: repeat(4, 1fr);}
}
.stat-item {text-align: center;}
.stat-icon {width: 4rem;height: 4rem;background: rgba(255, 255, 255, 0.1);border-radius: var(--radius-md);display: flex;align-items: center;justify-content: center;margin: 0 auto 1rem;}
.stat-icon svg {width: 2rem;height: 2rem;color: var(--gold);}
.stat-value {font-size: 2.5rem;font-weight: 700;color: var(--white);margin-bottom: 0;}
.stat-label {color: rgba(255, 255, 255, 0.8);font-size: 1.375rem;}
/* ============================================
Services Grid
============================================ */
.services-grid {display: grid;grid-template-columns: repeat(1, 1fr);gap: 1.5rem;}
@media (min-width: 640px) {.services-grid {grid-template-columns: repeat(2, 1fr);}
}
@media (min-width: 1024px) {.services-grid {grid-template-columns: repeat(3, 1fr);}
}
.service-card {background: var(--white);border-radius: var(--radius-md);padding: 1.5rem;box-shadow: var(--shadow-md);border: 1px solid var(--border-gray);transition: all 0.3s;}
.service-card:hover {transform: translateY(-8px);box-shadow: 0 20px 40px rgba(0, 100, 0, 0.15);}
.service-icon {width: 3.5rem;height: 3.5rem;background: rgba(0, 100, 0, 0.1);border-radius: var(--radius-md);display: flex;align-items: center;justify-content: center;margin-bottom: 1.25rem;transition: all 0.3s;}
.service-card:hover .service-icon {background: var(--dark-green);transform: scale(1.1) rotate(5deg);}
.service-icon svg {width: 1.75rem;height: 1.75rem;color: var(--dark-green);transition: color 0.3s;}
.service-card:hover .service-icon svg {color: var(--white);}
.service-card h3 {font-size: 1.25rem;margin-bottom: 0.75rem;transition: color 0.3s;}
.service-card:hover h3 {color: var(--dark-green);}
.service-card p {color: var(--text-gray);font-size: 0.875rem;margin-bottom: 1rem;}
.service-link {display: inline-flex;align-items: center;gap: 0.5rem;color: var(--dark-green);font-weight: 500;font-size: 0.875rem;}
.service-link svg {width: 1rem;height: 1rem;transition: transform 0.3s;}
.service-card:hover .service-link svg {transform: translateX(4px);}
/* ============================================
Projects Section
============================================ */
.projects-section {background: var(--cream);}
.project-item_x, .project-item {display: grid;grid-template-columns: 1fr;gap: 2rem;margin-bottom: 5rem;align-items: center;}
@media (min-width: 1024px) {

.project-item_x {grid-template-columns: 20% 90%;grid-auto-flow: column;gap: 4rem;}

.project-item {grid-template-columns: repeat(2, 1fr);gap: 4rem;}
.project-item.reverse .project-image {order: 2;}
.project-item.reverse .project-content {order: 1;}
}
.project-image {position: relative;border-radius: var(--radius-md);overflow: hidden;box-shadow: var(--shadow-xl);}
.project-image img {aspect-ratio: 4/3;width: 100%;object-fit: cover;transition: transform 0.7s;}
.project-image:hover img {transform: scale(1.03);}
.project-badge {position: absolute;top: 1rem;left: 1rem;background: var(--dark-green);color: var(--white);padding: 0.5rem 1rem;border-radius: var(--radius-lg);display: flex;align-items: center;gap: 0.5rem;font-size: 0.875rem;font-weight: 500;}
.project-badge svg {width: 1.25rem;height: 1.25rem;}
.project-meta {display: flex;align-items: center;gap: 0.75rem;margin-bottom: 1rem;}
.project-icon {width: 3rem;height: 3rem;background: rgba(0, 100, 0, 0.1);border-radius: var(--radius-md);display: flex;align-items: center;justify-content: center;}
.project-icon svg {width: 1.5rem;height: 1.5rem;color: var(--dark-green);}
.project-number {font-size: 0.875rem;color: var(--text-gray);text-transform: uppercase;letter-spacing: 0.05em;}
.project-content h3 {font-size: 1.5rem;margin-bottom: 1rem;line-height: 1.3;}
@media (min-width: 768px) {.project-content h3 {font-size: 1.875rem;}
}
.project-content p {color: var(--text-gray);line-height: 1.7;margin-bottom: 1.5rem;}
.project-link {display: inline-flex;align-items: center;gap: 0.5rem;color: var(--dark-green);font-weight: 500;}
.project-link svg {width: 1.25rem;height: 1.25rem;transition: transform 0.3s;}
.project-link:hover svg {transform: translateX(4px);}
/* ============================================
News Section
============================================ */
.news-grid {display: grid;grid-template-columns: repeat(1, 1fr);gap: 1.5rem;margin-bottom: 3rem;}
@media (min-width: 768px) {.news-grid {grid-template-columns: repeat(2, 1fr);}
}
@media (min-width: 1024px) {.news-grid {grid-template-columns: repeat(3, 1fr);}
}

.news-card-box {background: var(--white);border-radius: var(--radius-md);overflow: hidden;box-shadow: var(--shadow-md);transition: all 0.3s;}

.news-card {background: var(--white);border-radius: var(--radius-md);overflow: hidden;box-shadow: var(--shadow-md);transition: all 0.3s;}
.news-card:hover {transform: translateY(-8px);box-shadow: var(--shadow-xl);}
.news-image {position: relative;height: 18rem;overflow: hidden;}
.news-image img {width: 100%;height: 100%;object-fit: cover;transition: transform 0.5s;}
.news-card:hover .news-image img {transform: scale(1.05);}

.news-category {
  position: absolute;
  top: 1rem;
  left: 1rem;
  background: var(--dark-green);
  color: var(--white);
  padding: 0.25rem 0.75rem;
  border-radius: 4px;
  font-size: 0.75rem;
  font-weight: 500;
}

.news-content {padding: 1.5rem;}
.news-date {display: flex;align-items: center;gap: 0.5rem;color: var(--text-gray);font-size: 0.875rem;margin-bottom: 0.75rem;}
.news-date svg {width: 1rem;height: 1rem;}
.news-content h3 {font-size: 1.125rem;margin-bottom: 0.75rem;line-height: 1.4;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;transition: color 0.3s;}
.news-card:hover .news-content h3 {color: var(--dark-green);}
.news-content p {color: var(--text-gray);font-size: 0.875rem;line-height: 1.6;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;margin-bottom: 1rem;}
.news-link {display: inline-flex;align-items: center;gap: 0.5rem;color: var(--dark-green);font-weight: 500;font-size: 0.875rem;}
.news-link svg {width: 1rem;height: 1rem;transition: transform 0.3s;}
.news-card:hover .news-link svg {transform: translateX(4px);}
/* News Ticker */
.news-ticker {background: var(--dark-green);overflow: hidden;}
.ticker-label {background: var(--medium-green);padding: 1rem 1.5rem;display: flex;align-items: center;gap: 0.5rem;color: var(--white);font-weight: 500;}
.ticker-label svg {width: 1.25rem;height: 1.25rem;color: var(--gold);}
.ticker-content {padding: 1rem;overflow: hidden;}
.ticker-track {display: flex;gap: 3rem;animation: ticker-scroll 30s linear infinite;white-space: nowrap;}
.ticker-track:hover {animation-play-state: paused;}
.ticker-item {display: flex;align-items: center;gap: 0.75rem;color: rgba(255, 255, 255, 0.9);font-size: 0.875rem;}
.ticker-dot {width: 0.5rem;height: 0.5rem;background: var(--gold);border-radius: 9999px;flex-shrink: 0;}
@keyframes ticker-scroll {0% { transform: translateX(0);}
100% { transform: translateX(-50%);}
}
/* ============================================
CTA Section
============================================ */
.cta-section {background: var(--dark-green);position: relative;overflow: hidden;padding: 5rem 0;}
.cta-decoration {position: absolute;border-radius: 9999px;background: rgba(255, 255, 255, 0.05);}
.cta-decoration-1 {width: 16rem;height: 16rem;top: 0;left: 0;transform: translate(-50%, -50%);}
.cta-decoration-2 {width: 24rem;height: 24rem;bottom: 0;right: 0;transform: translate(33%, 33%);}
.cta-content {position: relative;z-index: 1;text-align: center;max-width: 800px;margin: 0 auto;}
.cta-icon {width: 4rem;height: 4rem;background: var(--gold);border-radius: var(--radius-md);display: flex;align-items: center;justify-content: center;margin: 0 auto 2rem;}
.cta-icon svg {width: 2rem;height: 2rem;color: var(--white);}
.cta-title {color: var(--white);font-size: 2rem;margin-bottom: 1rem;}
@media (min-width: 768px) {.cta-title {font-size: 2.5rem;}
}
.cta-description {color: rgba(255, 255, 255, 0.8);font-size: 1.125rem;margin-bottom: 2.5rem;}
.cta-buttons {display: flex;flex-direction: column;align-items: center;gap: 1rem;}
@media (min-width: 640px) {.cta-buttons {flex-direction: row;justify-content: center;}
}

.btn-white {background: rgba(255, 255, 255, 0.1);backdrop-filter: blur(4px);color: var(--white);border: 2px solid rgba(255, 255, 255, 0.3);padding: 1rem 2rem;border-radius: var(--radius-lg);font-weight: 500;font-size: 1.125rem;transition: all 0.3s;}
.btn-white:hover {background: var(--white);color: var(--dark-green);}

.btn-gold {background: var(--gold);color: var(--white);padding: 1rem 2rem;border-radius: var(--radius-md);font-weight: 500;font-size: 1.125rem;display: inline-flex;align-items: center;gap: 0.5rem;transition: all 0.3s;}
.btn-gold:hover {background: #b89420;transform: translateY(-2px);box-shadow: 0 10px 25px rgba(201, 162, 39, 0.3);}
/* ============================================
Footer
============================================ */
.footer {background: var(--dark-green);color: var(--white);}
.footer-main {padding: 4rem 0;}
.footer-grid {display: grid;grid-template-columns: repeat(1, 1fr);gap: 2.5rem;}
@media (min-width: 640px) {.footer-grid {grid-template-columns: repeat(2, 1fr);}
}
@media (min-width: 1024px) {.footer-grid {grid-template-columns: repeat(4, 1fr);}
}
.footer-brand {grid-column: span 1;}
@media (min-width: 1024px) {.footer-brand {grid-column: span 1;}
}
.footer-logo {display: flex;align-items: center;gap: 0.75rem;margin-bottom: 1.5rem;}
.footer-logo-icon {padding:12px 7px;width: 7rem;background: rgba(255, 255, 255, 0.1);border-radius: var(--radius-lg);display: flex;align-items: center;justify-content: center;}
.footer-logo-icon span {font-weight: 700;font-size: 1.25rem;}
.footer-logo-text p:first-child {font-size: 0.75rem;opacity: 0.7;line-height: 1;}
.footer-logo-text p:last-child {font-size: 0.875rem;font-weight: 700;line-height: 1;}
.footer-brand p {color: rgba(255, 255, 255, 0.8);font-size: 0.875rem;line-height: 1.7;margin-bottom: 1.5rem;}
.footer-social {display: flex;gap: 0.75rem;}
.footer-social a {width: 2.25rem;height: 2.25rem;background: rgba(255, 255, 255, 0.1);border-radius: 9999px;display: flex;align-items: center;justify-content: center;transition: all 0.3s;}
.footer-social a:hover {background: var(--gold);transform: scale(1.1);}
.footer-social svg {width: 1rem;height: 1rem;}
.footer-column h3 {font-size: 1.125rem;margin-bottom: 1.5rem;}
.footer-links {display: flex;flex-direction: column;gap: 0.75rem;}
.footer-links a {display: flex;align-items: center;gap: 0.5rem;color: rgba(255, 255, 255, 0.8);font-size: 0.875rem;transition: all 0.3s;}
.footer-links a:hover {color: var(--gold);}
.footer-links a::before {content: '';width: 0.375rem;height: 0.375rem;background: rgba(255, 255, 255, 0.4);border-radius: 9999px;transition: background 0.3s;}
.footer-links a:hover::before {background: var(--gold);}
.footer-contact {display: flex;flex-direction: column;gap: 1rem;}
.footer-contact-item {display: flex;align-items: flex-start;gap: 0.75rem;color: rgba(255, 255, 255, 0.8);font-size: 0.875rem;}
.footer-contact-item svg {width: 1.25rem;height: 1.25rem;color: var(--gold);flex-shrink: 0;margin-top: 0.125rem;}
.footer-contact-item a:hover {color: var(--gold);}
.footer-bottom {border-top: 1px solid rgba(255, 255, 255, 0.1);padding: 1.5rem 0;}
.footer-bottom-content {display: flex;flex-direction: column;align-items: center;gap: 1rem;}
@media (min-width: 640px) {.footer-bottom-content {flex-direction: row;justify-content: space-between;}
}
.footer-bottom p {color: rgba(255, 255, 255, 0.6);font-size: 0.875rem;text-align: center;}
.footer-bottom-links {color: rgba(255, 255, 255, 0.6);display: flex;font-size: 0.875rem;padding:0;}
.footer-bottom-links a {transition: color 0.3s;}
.footer-bottom-links a:hover {color: var(--gold);}
/* ============================================
Page Header (for inner pages)
============================================ */
.page-header {padding-top: 2rem;padding-bottom: 3rem;}
.breadcrumb {display: flex;align-items: center;gap: 0.5rem;font-size: 0.875rem;color: var(--text-gray);margin-bottom: 2rem;}
.breadcrumb a:hover {color: var(--dark-green);}
.breadcrumb-current {color: var(--dark-green);}
.back-link {display: inline-flex;align-items: center;gap: 0.5rem;color: var(--dark-green);font-weight: 500;margin-bottom: 1rem;}
.back-link:hover {text-decoration: underline;}
.back-link svg {width: 1rem;height: 1rem;}
.page-title {font-size: 2.25rem;margin-bottom: 1rem;}
@media (min-width: 768px) {.page-title {font-size: 3rem;}
}
.page-description {font-size: 1.125rem;color: var(--text-gray);}
/* ============================================
Cards
============================================ */
.card {background: var(--white);border-radius: var(--radius-md);box-shadow: var(--shadow-md);overflow: hidden;}
.card-hover {transition: all 0.3s;}
.card-hover:hover {transform: translateY(-8px);box-shadow: var(--shadow-xl);}
/* ============================================
Tables
============================================ */
.table-container {background: var(--white);border-radius: var(--radius-md);box-shadow: var(--shadow-lg);overflow: hidden;}
.table-responsive {overflow-x: auto;}
table {width: 100%;border-collapse: collapse;}
thead {background: var(--dark-green);}
th {color: var(--white);font-weight: 500;text-align: left;padding: 1rem 1.5rem;}
td {padding: 1rem 1.5rem;border-bottom: 1px solid var(--border-gray);}
tbody tr:hover {background: rgba(245, 245, 220, 0.5);}
/* ============================================
Progress Bar
============================================ */
.progress-bar {height: 0.5rem;background: #e5e7eb;border-radius: 9999px;overflow: hidden;}
.progress-fill {height: 100%;background: var(--dark-green);border-radius: 9999px;transition: width 1s ease-out;}
/* ============================================
Forms
============================================ */
.form-group {margin-bottom: 1.25rem;}
.form-label {display: block;font-size: 0.875rem;font-weight: 500;color: var(--text-gray);margin-bottom: 0.5rem;}
.form-input,.form-select,.form-textarea {width: 100%;padding: 0.75rem 1rem;border: 1px solid var(--border-gray);border-radius: var(--radius-md);font-family: inherit;font-size: 1rem;transition: all 0.3s;}
.form-input:focus,.form-select:focus,.form-textarea:focus {outline: none;border-color: var(--dark-green);box-shadow: 0 0 0 3px rgba(0, 100, 0, 0.1);}
.form-textarea {resize: vertical;min-height: 100px;}
/* ============================================
Badges
============================================ */
.badge {display: inline-flex;align-items: center;padding: 0.25rem 0.75rem;border-radius: 9999px;font-size: 0.75rem;font-weight: 500;}
.badge-green {background: #dcfce7;color: #166534;}
.badge-blue {background: #dbeafe;color: #1e40af;}
.badge-yellow {background: #fef9c3;color: #854d0e;}
.badge-red {background: #fee2e2;color: #991b1b;}
/* ============================================
Utility Classes
============================================ */
.text-center { text-align: center;}
.text-left { text-align: left;}
.text-right { text-align: right;}
.font-bold { font-weight: 700;}
.font-medium { font-weight: 500;}
.text-green { color: var(--dark-green);}
.text-gray { color: var(--text-gray);}
.text-white { color: var(--white);}
.bg-green { background-color: var(--dark-green);}
.bg-cream { background-color: var(--cream);}
.bg-white { background-color: var(--white);}
.mt-4 { margin-top: 1rem;}
.mt-8 { margin-top: 2rem;}
.mb-4 { margin-bottom: 1rem;}
.mb-8 { margin-bottom: 2rem;}
.py-4 { padding-top: 1rem;padding-bottom: 1rem;}
.py-8 { padding-top: 2rem;padding-bottom: 2rem;}
.px-4 { padding-left: 1rem;padding-right: 1rem;}
.flex { display: flex;}
.items-center { align-items: center;}
.justify-between { justify-content: space-between;}
.gap-4 { gap: 1rem;}
.grid { display: grid;}
.grid-cols-2 { grid-template-columns: repeat(2, 1fr);}
.grid-cols-3 { grid-template-columns: repeat(3, 1fr);}
.grid-cols-4 { grid-template-columns: repeat(4, 1fr);}
.hidden { display: none;}
/* ============================================
Animations
============================================ */
@keyframes fadeIn {from { opacity: 0;}
to { opacity: 1;}
}
@keyframes slideUp {from {opacity: 0;transform: translateY(30px);}
to {opacity: 1;transform: translateY(0);}
}
@keyframes scaleIn {from {opacity: 0;transform: scale(0.9);}
to {opacity: 1;transform: scale(1);}
}
.animate-fade-in {animation: fadeIn 0.6s ease-out forwards;}
.animate-slide-up {animation: slideUp 0.6s ease-out forwards;}
.animate-scale-in {animation: scaleIn 0.5s ease-out forwards;}
/* Scroll reveal */
.reveal {opacity: 0;transform: translateY(20px);transition: all 0.6s ease-out;}
.reveal.active {opacity: 1;transform: translateY(0);}
/* ============================================
Scrollbar
============================================ */
::-webkit-scrollbar {width: 8px;}
::-webkit-scrollbar-track {background: var(--cream);}
::-webkit-scrollbar-thumb {background: var(--dark-green);border-radius: 4px;}
::-webkit-scrollbar-thumb:hover {background: var(--medium-green);}
/* ============================================
Print Styles
============================================ */
@media print {.navbar,.top-bar,.footer,.hero-scroll,.mobile-menu-btn {display: none !important;}
body {background: white;}
.hero {height: auto;min-height: auto;padding: 2rem 0;}
.hero-bg,.hero-overlay {display: none;}
.hero-content {position: static;color: black;}
.hero-title,.hero-subtitle,.hero-eyebrow {color: black;}
}



.cxx-section {width:100%!important;background: var(--dark-green);border-radius: var(--radius-md);box-shadow: var(--shadow-md);transition: all 0.3s; padding: 3rem 4rem;}
.cxx-title {color: var(--white);font-size: 2rem;margin-bottom: 1rem;}
@media (min-width: 768px) {.cxx-title {font-size: 2.5rem;}
}
.cxx-description {color: rgba(255, 255, 255, 0.8);font-size: 1.125rem;margin-bottom: 2.5rem;}


.carousel-item{height:500px;}
.carousel-item img {object-fit: cover;}

div.x_pagination {display: flex; justify-content: center; gap: 0.5rem; margin-top: 2rem;}
div.x_pagination a {padding: 0.5rem 1rem; border: 1px solid var(--border-gray); border-radius: var(--radius-md);background: white;}
div.x_pagination a:hover,div.x_pagination a.active {background: var(--dark-green); color: white;}

a.green_box {color: var(--light-green); font-weight: 700; }
a.green_box:hover {color: var(--dark-green);}


a.filter-btn {padding: 0.625rem 1.25rem; border-radius: var(--radius-xl); font-weight: 500;background: white; color: var(--text-gray); border: 1px solid var(--border-gray);}
a.filter-btn:hover, a.filter-btn.active{background: var(--dark-green); color: white; border: 1px solid var(--dark-green);}






#carousel_y .item{display: flex; justify-content: center; align-items: center;border:0px red solid;height:200px;}
#carousel_y.owl-theme .owl-next, #carousel_y.owl-theme .owl-prev {width: 22px;height: 40px;margin-top: -30px;position: absolute;top: 50%;}
#carousel_y.owl-theme .owl-prev {left: -10px;}
#carousel_y.owl-theme .owl-next {right: -10px;}

.text_justify{text-align:justify;}


a.bxnn:hover { text-decoration: none; color:#FFFFFF;}
#main_disdk{display:none;}