/* ================================================================
   PADMA  Brand Theme
   Primary:  #0d9488  (teal-600)
   Accent:   #22d3ee  (cyan-400)
   Dark:     #0f4c59  (deep teal)
   Light bg: #f0fdfa  (teal-50)
   Button:   #dc2626  (red-600)
================================================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=Poppins:ital,wght@0,400;0,600;0,700;0,800;1,400&display=swap');

/* CSS Variables */
:root {
    --clr-primary:       #0d9488;
    --clr-primary-dk:    #0f766e;
    --clr-accent:        #22d3ee;
    --clr-dark:          #0f4c59;
    --clr-darker:        #0b3a43;
    --clr-light:         #f0fdfa;
    --clr-light-mid:     #ccfbf1;
    --clr-text:          #1e293b;
    --clr-text-muted:    #64748b;
    --clr-white:         #ffffff;
    --clr-btn:           #dc2626;
    --clr-btn-dk:        #b91c1c;
    --font-body:         'Inter', sans-serif;
    --font-heading:      'Poppins', sans-serif;
    --radius-lg:         16px;
    --radius-md:         10px;
    --radius-sm:         6px;
    --shadow-sm:         0 2px 8px rgba(13,148,136,.12);
    --shadow-md:         0 6px 24px rgba(13,148,136,.18);
    --shadow-lg:         0 12px 40px rgba(13,148,136,.22);
    --transition:        .25s ease;
}

/* Base reset */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; padding: 0; }
a { text-decoration: none; }
ul { list-style: none; margin-bottom: 0; }

body {
    font-family: var(--font-body);
    color: var(--clr-text);
    background: var(--clr-white);
    -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5, h6 { font-family: var(--font-heading); }

/* Scrollbar */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #f1f5f9; }
::-webkit-scrollbar-thumb { background: var(--clr-primary); border-radius: 3px; }

/*  BUTTONS  */
.btn-logo {
    background-color: var(--clr-btn) !important;
    color: #fff !important;
    border: none !important;
    transition: background-color var(--transition), transform var(--transition), box-shadow var(--transition) !important;
}
.btn-logo:hover, .btn-logo:focus, .btn-logo:active {
    background-color: var(--clr-btn-dk) !important;
    color: #fff !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 24px rgba(220,38,38,.28) !important;
}
.btn-teal {
    background-color: var(--clr-btn) !important;
    border: none; color: white !important;
    transition: background-color var(--transition), transform var(--transition);
}
.btn-teal:hover { background-color: var(--clr-btn-dk) !important; color: white !important; transform: translateY(-2px); }

/*  NAVBAR  */
.site-navbar {
    background: var(--clr-white) !important;
    border-bottom: 3px solid var(--clr-accent);
    box-shadow: 0 2px 16px rgba(13,148,136,.1);
}
.site-navbar .nav-link { color: var(--clr-text) !important; font-weight: 600; letter-spacing: .4px; position: relative; transition: color var(--transition); }
.site-navbar .nav-link::after { content: ''; position: absolute; left: 50%; bottom: 0; right: 50%; height: 2px; background: var(--clr-primary); transition: left var(--transition), right var(--transition); border-radius: 2px; }
.site-navbar .nav-link:hover::after, .site-navbar .nav-link.active::after { left: .75rem; right: .75rem; }
.site-navbar .nav-link:hover, .site-navbar .nav-link.active { color: var(--clr-primary) !important; }
.site-navbar .dropdown-menu { border: none; border-top: 3px solid var(--clr-primary); border-radius: 0 0 var(--radius-md) var(--radius-md); box-shadow: var(--shadow-md); padding: .5rem 0; }
.site-navbar .dropdown-item { color: var(--clr-text); font-weight: 500; padding: .6rem 1.25rem; transition: background var(--transition), color var(--transition), padding-left var(--transition); }
.site-navbar .dropdown-item:hover { background: var(--clr-light); color: var(--clr-primary); padding-left: 1.6rem; }

#logo { height: 64px; width: auto; max-width: 220px; object-fit: contain; display: block; }
@media (max-width: 992px) { #logo { height: 50px; } }
@media (max-width: 600px)  { #logo { height: 45px; } }

/*  BACK-TO-TOP  */
.back-to-top { position: fixed; bottom: 55px; right: 15px; width: 45px; height: 45px; display: flex; align-items: center; justify-content: center; border-radius: 50%; z-index: 1000; background: var(--clr-btn) !important; color: #fff !important; box-shadow: 0 6px 24px rgba(220,38,38,.28); transition: transform var(--transition), background var(--transition); }
.back-to-top:hover { background: var(--clr-btn-dk) !important; transform: translateY(-3px); }

/*  FOOTER SOCIAL  */
.footer-social { transition: color var(--transition), transform var(--transition); }
.footer-social:hover { color: #f87171 !important; transform: translateY(-2px); }

/*  SECTIONS  */
section { padding: 60px 0; overflow: hidden; position: relative; }
.section-title { text-align: center; padding-bottom: 30px; position: relative; }
.section-title h2 { font-size: 32px; font-weight: 800; text-transform: uppercase; margin-bottom: 20px; padding-bottom: 20px; position: relative; font-family: var(--font-heading); }
.section-title h2::after { content: ""; position: absolute; display: block; width: 50px; height: 3px; background: var(--clr-primary); bottom: 0; left: calc(50% - 25px); border-radius: 2px; }
.section-title p { margin-bottom: 0; }
.text-primary-teal { color: var(--clr-primary) !important; }
.text-accent { color: var(--clr-accent) !important; }
.bg-primary-teal { background-color: var(--clr-primary) !important; }
.bg-light-teal { background-color: var(--clr-light) !important; }

/*  BREADCRUMBS  */
.breadcrumbs { padding: 20px 0 !important; background: linear-gradient(135deg, var(--clr-dark) 0%, var(--clr-primary) 100%); min-height: auto !important; max-height: 120px !important; display: flex; align-items: center; justify-content: center; flex-direction: column; color: #fff; text-align: center; }
.breadcrumbs h2 { font-size: 1.5rem !important; font-weight: 700; text-transform: uppercase; margin: 0 !important; font-family: var(--font-heading); }
.breadcrumbs ol { display: flex; justify-content: center; flex-wrap: wrap; list-style: none; padding: 0 !important; margin: 0; font-size: 0.85rem !important; font-weight: 500; }
.breadcrumbs ol a { color: var(--clr-light-mid); transition: color var(--transition); }
.breadcrumbs ol a:hover { color: #fff; text-decoration: underline; }
.breadcrumbs ol li+li { padding-left: 10px; }
.breadcrumbs ol li+li::before { display: inline-block; padding-right: 10px; color: var(--clr-accent); content: "/"; }

/*  CARDS & HOVER  */
.hover-float { transition: transform var(--transition), box-shadow var(--transition); }
.hover-float:hover { transform: translateY(-8px); box-shadow: var(--shadow-md) !important; }
.hover-lift { transition: transform .3s ease, box-shadow .3s ease; }
.hover-lift:hover { transform: translateY(-5px); box-shadow: 0 10px 20px rgba(13,148,136,.12) !important; }
.program-card { transition: transform var(--transition), box-shadow var(--transition); border-radius: var(--radius-lg) !important; overflow: hidden; }
.program-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg) !important; }
.card-teal-hover { border: 1px solid #e2e8f0; transition: border-color var(--transition), box-shadow var(--transition), transform var(--transition); }
.card-teal-hover:hover { border-color: var(--clr-primary); box-shadow: var(--shadow-md); transform: translateY(-4px); }

/*  OVERLAY & IMAGE  */
.featuredImage img { width: 100%; height: 300px; }
.featuredImage { position: relative; width: 100%; overflow: hidden; }
.featuredImage .overlay { position: absolute; bottom: 0; padding-left: 25px; padding-top: 15px; width: 100%; color: white; font-size: 20px; z-index: 5; }
.featuredImage .overlay::before { content: ""; background: #090909; height: 100%; width: 100%; position: absolute; left: 0; bottom: -150px; z-index: -2; opacity: 0.8; transition: all 0.3s ease-out; }
.featuredImage:hover .overlay::before { bottom: 0; }
.overlay-gradient { position: absolute; bottom: 0; left: 0; width: 100%; height: 50%; background: linear-gradient(to top, rgba(15,76,89,.75), transparent); pointer-events: none; }
.card .overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(13,148,136,.35); opacity: 0; transition: opacity var(--transition); }
.card:hover .overlay { opacity: 1; }
.textmuted { color: #f8f8f8; font-weight: 200; font-size: 15px; text-transform: capitalize; }
.transition-opacity { transition: opacity var(--transition); }
.cursor-pointer { cursor: pointer; }

/*  TESTIMONIALS / STORIES  */
.stories-testimonial { background-position: center; background-size: cover; }
.stories-testimonial .story-avatar { width: 130px !important; height: 130px !important; aspect-ratio: 1/1; display: block; object-fit: cover !important; border-radius: 50% !important; border: 6px solid var(--clr-accent); }
.stories-testimonial .carousel-control-prev, .stories-testimonial .carousel-control-next { width: 12%; }
.stories-testimonial .carousel-control-prev-icon, .stories-testimonial .carousel-control-next-icon { width: 3rem; height: 3rem; filter: drop-shadow(2px 2px 8px rgba(0,0,0,.6)); }

/*  PARTNER MARQUEE  */
@keyframes partners-scroll { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }
.partners-marquee { animation: partners-scroll var(--speed, 35s) linear infinite; white-space: nowrap; width: max-content; }
.partners-marquee-wrapper:hover .partners-marquee { animation-play-state: paused; }

/*  IMPACT CARDS  */
.impact-card { background: rgba(255,255,255,.08); backdrop-filter: blur(12px); border: 1px solid rgba(255,255,255,.15); border-radius: var(--radius-lg); padding: 28px 20px 22px; text-align: center; height: 100%; transition: transform var(--transition), background var(--transition), border-color var(--transition); }
.impact-card:hover { transform: translateY(-6px); background: rgba(34,211,238,.15); border-color: rgba(34,211,238,.45); }
.impact-card .impact-icon-wrap { width: 52px; height: 52px; background: rgba(34,211,238,.18); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 14px; }
.impact-card .impact-number { font-size: 2.4rem; font-weight: 800; color: #fff; line-height: 1.1; letter-spacing: -1px; }
.impact-card .impact-unit { font-size: 1.1rem; color: #fbbf24; font-weight: 700; vertical-align: super; }
.impact-card .impact-label { margin-top: 8px; font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; color: rgba(255,255,255,.6); line-height: 1.4; }
.impact-divider { width: 48px; height: 3px; background: var(--clr-accent); border-radius: 2px; margin: 10px auto 0; }

/*  PADMA BRAND ANIMATION  */
.padma-letters { display: flex; gap: 2px; align-items: baseline; }
.padma-l { font-size: 3.6rem; font-weight: 900; color: var(--clr-text); display: inline-block; animation: padmaLetterIn .5s cubic-bezier(.34,1.56,.64,1) backwards; animation-delay: var(--d); transition: color var(--transition), transform var(--transition); cursor: default; line-height: 1; }
.padma-l:hover { color: var(--clr-accent); transform: translateY(-5px) scale(1.12); }
@keyframes padmaLetterIn { from { opacity: 0; transform: translateY(-22px) scale(.8); } to { opacity: 1; transform: translateY(0) scale(1); } }
.padma-fullform { font-size: 1.05rem; font-weight: 700; line-height: 1.5; animation: padmaFadeUp .7s ease backwards; animation-delay: var(--d); }
.padma-fullform .hl { color: var(--clr-primary); }
.padma-tagline { animation: padmaFadeUp .7s ease backwards; animation-delay: .9s; }
@keyframes padmaFadeUp { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

/*  GALLERY  */
.carousel-item img { height: 50vh !important; object-fit: cover !important; }

/*  FOOTER  */
footer a { transition: color var(--transition); }
footer a:hover { color: var(--clr-accent) !important; }

/*  NAVBAR RESPONSIVE  */
@media all and (min-width: 992px) {
    .navbar .nav-item .dropdown-menu { display: none; }
    .navbar .nav-item:hover .dropdown-menu { display: block; }
    .navbar .nav-item .dropdown-menu { margin-top: 0; }
}
.navbar { padding-top: 0 !important; padding-bottom: 0 !important; }
.navbar-brand img { max-height: 50px !important; }

/*  SELECTION  */
::selection { background: var(--clr-accent); color: #fff; }