/* =========================================================
   Bright Future Computer Academy - Public Site Styles
   Colors: Primary #0F4C81, Secondary #00A8E8, Accent #FFD166
========================================================= */
:root {
  --bfca-primary: #0F4C81;
  --bfca-primary-dark: #0a3660;
  --bfca-secondary: #00A8E8;
  --bfca-accent: #FFD166;
  --bfca-light-bg: #f5f9fc;
  --bfca-radius: 16px;
}

* { scroll-behavior: smooth; }

body {
  font-family: 'Inter', sans-serif;
  color: #29323b;
  padding-top: 76px;
}

h1, h2, h3, h4, h5, h6, .brand-name {
  font-family: 'Poppins', sans-serif;
}

.skip-link { position: absolute; top: -40px; left: 0; background: var(--bfca-primary); color: #fff; padding: 8px 16px; z-index: 2000; }
.skip-link:focus { top: 0; }

/* Navbar */
#mainNavbar { transition: box-shadow .3s ease; padding: .6rem 0; }
.brand-logo { display: flex; align-items: center; gap: .6rem; text-decoration: none; }
.brand-icon { width: 44px; height: 44px; border-radius: 12px; background: linear-gradient(135deg, var(--bfca-primary), var(--bfca-secondary)); color:#fff; display:flex; align-items:center; justify-content:center; font-size:1.2rem; }
.brand-text { display: flex; flex-direction: column; line-height: 1.1; }
.brand-name { font-weight: 800; color: var(--bfca-primary); font-size: 1.15rem; }
.brand-sub { font-size: .62rem; letter-spacing: .12em; color: var(--bfca-secondary); font-weight: 600; }
.nav-link { font-weight: 500; color: #29323b !important; }
.nav-link:hover { color: var(--bfca-secondary) !important; }
.btn-accent { background: var(--bfca-accent); color: #593c00; font-weight: 600; border: none; }
.btn-accent:hover { background: #ffc23d; color: #402b00; }

/* Hero */
.hero-section { position: relative; }
.hero-slide { height: 640px; background-size: cover; background-position: center; position: relative; display:flex; align-items:center; }
.hero-overlay { position: absolute; inset: 0; background: linear-gradient(120deg, rgba(15,76,129,.88), rgba(0,168,232,.55)); }
.hero-content { position: relative; z-index: 2; color: #fff; max-width: 700px; }
.hero-eyebrow { display:inline-block; background: rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.35); padding: .35rem 1rem; border-radius: 30px; font-size: .8rem; margin-bottom: 1rem; backdrop-filter: blur(4px); }
.hero-content h1 { font-size: 3rem; font-weight: 800; margin-bottom: 1rem; }
.hero-content p { font-size: 1.1rem; margin-bottom: 1.8rem; color: #e9f4fb; }
.heroSwiper .swiper-button-next, .heroSwiper .swiper-button-prev { color: #fff; }
.heroSwiper .swiper-pagination-bullet-active { background: var(--bfca-accent); }

/* Sections */
.section-padding { padding: 90px 0; }
.bg-light-soft { background: var(--bfca-light-bg); }
.section-tag { display:inline-block; color: var(--bfca-secondary); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; font-size: .8rem; margin-bottom: .6rem; }
.section-tag.light { color: var(--bfca-accent); }
.section-title { font-weight: 800; color: #16222e; margin-bottom: 1rem; }

/* About */
.mission-box, .about-icon-card { background:#fff; border-radius: var(--bfca-radius); padding: 1.3rem; box-shadow: 0 8px 24px rgba(15,76,129,.08); height:100%; }
.mission-box i, .about-icon-card i { font-size: 1.6rem; margin-bottom: .5rem; color: var(--bfca-primary); }

/* Courses */
.course-card { background:#fff; border-radius: var(--bfca-radius); padding: 1.8rem 1.5rem; box-shadow: 0 8px 24px rgba(15,76,129,.08); transition: transform .3s ease, box-shadow .3s ease; }
.course-card:hover { transform: translateY(-8px); box-shadow: 0 16px 32px rgba(15,76,129,.18); }
.course-icon { width: 56px; height: 56px; border-radius: 14px; background: linear-gradient(135deg, var(--bfca-primary), var(--bfca-secondary)); color:#fff; display:flex; align-items:center; justify-content:center; font-size: 1.4rem; margin-bottom: 1rem; }
.course-meta { color:#7a8894; font-size:.85rem; }

/* Why Us */
.why-us-box { background: #fff; border-radius: var(--bfca-radius); padding: 2rem 1rem; box-shadow: 0 8px 24px rgba(15,76,129,.08); }
.why-us-box i { font-size: 2rem; color: var(--bfca-secondary); margin-bottom: .8rem; }

/* Certificate Verification */
.verify-section { background: linear-gradient(135deg, var(--bfca-primary), var(--bfca-primary-dark)); position: relative; }
.verify-form .form-control { border: none; }
.verify-form .form-control:focus { box-shadow: none; }

.certificate-result-card { background:#fff; border-radius: var(--bfca-radius); padding: 2.5rem; box-shadow: 0 20px 50px rgba(0,0,0,.12); }
.certificate-result-card.verified { border-top: 6px solid #1ca24c; }
.certificate-result-card.invalid { border-top: 6px solid #dc3545; }
.badge-verified { background:#1ca24c; color:#fff; padding:.5rem 1.2rem; border-radius: 30px; font-weight:700; letter-spacing:.05em; }
.badge-invalid { background:#dc3545; color:#fff; padding:.5rem 1.2rem; border-radius: 30px; font-weight:700; letter-spacing:.05em; }
.cert-photo { width: 140px; height: 140px; object-fit: cover; border-radius: 12px; border: 3px solid var(--bfca-light-bg); }
.cert-qr { width: 120px; height: 120px; }
.cert-table th { width: 40%; color:#7a8894; font-weight:600; }
.institute-seal { width: 110px; opacity: .9; }

/* Testimonials */
.testimonial-card { background:#fff; border-radius: var(--bfca-radius); padding: 2rem; box-shadow: 0 8px 24px rgba(15,76,129,.08); margin: 0 8px; height: 100%; }
.testimonial-avatar { width: 50px; height: 50px; border-radius: 50%; object-fit: cover; }

/* Gallery */
.gallery-masonry { column-count: 4; column-gap: 12px; }
.gallery-item { break-inside: avoid; margin-bottom: 12px; position: relative; border-radius: 12px; overflow: hidden; }
.gallery-item img { width: 100%; display:block; transition: transform .4s ease; }
.gallery-item:hover img { transform: scale(1.08); }
.gallery-overlay { position:absolute; inset:0; background: rgba(15,76,129,.5); display:flex; align-items:center; justify-content:center; color:#fff; opacity:0; transition: opacity .3s ease; font-size:1.4rem; }
.gallery-item:hover .gallery-overlay { opacity: 1; }
@media (max-width: 992px) { .gallery-masonry { column-count: 2; } }
@media (max-width: 576px) { .gallery-masonry { column-count: 1; } }

/* Contact */
.contact-info-list { list-style:none; padding:0; }
.contact-info-list li { display:flex; gap: .8rem; margin-bottom: 1rem; color:#495765; }
.contact-info-list i { color: var(--bfca-secondary); margin-top:.2rem; }
.contact-form { border-radius: var(--bfca-radius) !important; }

/* Footer */
.site-footer { background: #0b2338; color: #cfe0ee; }
.footer-brand .brand-name { color:#fff; }
.text-light-50 { color: rgba(255,255,255,.6) !important; }
.footer-heading { color:#fff; font-weight:700; margin-bottom: 1rem; }
.footer-links { list-style:none; padding:0; }
.footer-links li { margin-bottom: .6rem; }
.footer-links a { color: rgba(255,255,255,.7); text-decoration:none; }
.footer-links a:hover { color: var(--bfca-accent); }
.social-icons a { display:inline-flex; width:36px; height:36px; border-radius:50%; background: rgba(255,255,255,.1); color:#fff; align-items:center; justify-content:center; margin-right:.5rem; text-decoration:none; }
.social-icons a:hover { background: var(--bfca-secondary); }
.footer-bottom { background: #081b2c; font-size:.85rem; }
.map-placeholder { background: rgba(255,255,255,.05); }

/* Scroll to top */
.scroll-top-btn { position: fixed; bottom: 24px; right: 24px; width: 46px; height:46px; border-radius:50%; background: var(--bfca-primary); color:#fff; border:none; display:none; align-items:center; justify-content:center; box-shadow: 0 6px 16px rgba(0,0,0,.2); z-index: 1000; }
.scroll-top-btn.show { display:flex; }

/* Loader */
.page-loader { position: fixed; inset:0; background:#fff; display:flex; align-items:center; justify-content:center; z-index: 3000; transition: opacity .3s ease; }
.page-loader.hide { opacity:0; pointer-events:none; }

@media (max-width: 768px) {
  .hero-slide { height: 520px; }
  .hero-content h1 { font-size: 2.1rem; }
  .section-padding { padding: 60px 0; }
}
