/* Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;700&family=Montserrat:wght@500;600;700&family=Cinzel:wght@600;700&display=swap');

:root{
  --lg-navy:#0b2e4e;
  --lg-deep:#072238;
  --lg-gold:#F0C24B; /* lighter corporate gold */
  --lg-green:#0d503a;
  --lg-gray:#6c757d;
  --lg-light:#f8f9fa;
  --lg-soft:#f3f5f7;
  --lg-accent:#ff7a00; /* search icon accent like reference */
  --font-body:'Open Sans', 'Helvetica Neue', Arial, sans-serif;
  --font-heading:'Montserrat', 'Open Sans', Arial, sans-serif;
  --font-hero:'Cinzel', 'Times New Roman', serif;
}

/* Base */
body{
  font-family: var(--font-body);
  color:#222;
  background:#fff;
}
img{max-width:100%;height:auto}

/* Navbar */
.navbar-premium{background:#ffffffcc;backdrop-filter:saturate(140%) blur(6px)}
.navbar-premium .navbar-brand{display:flex; align-items:center; padding:.25rem 0; margin-right:1rem}
/* Make logo slightly smaller so it always stays visible */
.navbar-premium .navbar-brand img{height:36px; width:auto; display:block; object-fit:contain}
@media (min-width:1200px){
  .navbar-premium .navbar-brand img{height:44px}
}
/* Reduce nav font size and spacing for better fit */
.navbar-premium .nav-link{color:var(--lg-navy); font-weight:600; position:relative; text-transform:uppercase; letter-spacing:.03em; font-family:var(--font-heading); font-size:clamp(.8rem, .9vw, .95rem); padding:.5rem .6rem}
.navbar-premium .nav-link:hover{color:var(--lg-gold)}
.navbar-premium .nav-link::before{content:''; position:absolute; left:.5rem; right:.5rem; bottom:.2rem; height:2px; background:var(--lg-gold); opacity:0; transform:translateY(2px); transition:all .2s ease}
.navbar-premium .nav-link:hover::before, .navbar-premium .nav-link.active::before{opacity:1; transform:none}
.navbar-premium .dropdown-menu{border-radius:.75rem; border:0; box-shadow:0 8px 30px rgba(0,0,0,.08); border-top:4px solid var(--lg-gold)}
/* Visible caret for dropdowns */
.navbar-premium .dropdown-toggle::after{content:'\f107'; font-family:'Font Awesome 6 Free'; font-weight:900; border:0; margin-left:.35rem; font-size:.8rem; line-height:1; vertical-align:middle; color:var(--lg-navy); transition:transform .2s ease, color .2s ease}
.navbar-premium .nav-link:hover.dropdown-toggle::after{color:var(--lg-gold)}
.navbar-premium .dropdown.show > .nav-link.dropdown-toggle::after{transform:rotate(180deg); color:var(--lg-gold)}

/* Search bar */
.top-search{background:#fff;border-bottom:1px solid #e5e7eb}
.top-search input{border-radius:999px}
.nav-search-icon{color:var(--lg-accent)}

/* Home icon and spacing */
.navbar-premium .nav-link.nav-home{padding:0; text-transform:none; letter-spacing:0}
.navbar-premium .nav-link.nav-home::before{display:none}
.navbar-premium .nav-link.nav-home i{color:var(--lg-accent); font-size:.95rem}
.navbar-premium .nav-link.nav-home:hover i{color:var(--lg-gold)}
@media (min-width: 992px){
  .navbar-premium .navbar-nav> .nav-item{margin-left:.65rem}
  .navbar-premium .navbar-nav> .nav-item:first-child{margin-left:0}
}

/* Mobile Navbar Improvements */
@media (max-width: 991px){
  .navbar-premium{
    background: rgba(255, 255, 255, 0.98);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(0,0,0,.05);
  }

  .navbar-premium .navbar-brand{
    margin-right: auto;
  }

  .navbar-premium .navbar-brand img{
    height: 50px;
  }

  .navbar-premium .navbar-toggler{
    border: none;
    padding: 0.5rem;
    border-radius: 0.5rem;
    background: rgba(240, 194, 75, 0.1);
    transition: all 0.3s ease;
  }

  .navbar-premium .navbar-toggler:focus{
    box-shadow: 0 0 0 0.2rem rgba(240, 194, 75, 0.25);
  }

  .navbar-premium .navbar-toggler-icon{
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='m4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
    width: 1.2em;
    height: 1.2em;
  }

  .navbar-premium .navbar-collapse{
    background: #ffffff;
    border-radius: 0 0 1rem 1rem;
    box-shadow: 0 8px 30px rgba(0,0,0,.08);
    margin-top: 0.5rem;
    padding: 1rem 0;
    border-top: 3px solid var(--lg-gold);
    text-align: center;
  }

  .navbar-premium .nav-link{
    padding: 0.75rem 1.5rem;
    margin: 0.25rem 1rem;
    border-radius: 0.5rem;
    transition: all 0.3s ease;
    font-size: 0.95rem;
  }

  .navbar-premium .nav-link:hover{
    background: rgba(240, 194, 75, 0.1);
    color: var(--lg-gold);
  }

  .navbar-premium .dropdown-menu{
    background: #ffffff;
    border: none;
    box-shadow: 0 8px 30px rgba(0,0,0,.08);
    border-radius: 0.75rem;
    margin-top: 0.5rem;
    padding: 0.5rem 0;
    border-top: 3px solid var(--lg-gold);
  }

  .navbar-premium .dropdown-item{
    padding: 0.75rem 1.5rem;
    margin: 0 0.5rem;
    border-radius: 0.5rem;
    transition: all 0.3s ease;
    font-size: 0.9rem;
  }

  .navbar-premium .dropdown-item:hover{
    background: rgba(240, 194, 75, 0.1);
    color: var(--lg-gold);
  }

  .navbar-premium .nav-link.nav-home{
    margin: 0.25rem 1rem;
    padding: 0.75rem;
  }

  .navbar-premium .nav-link.nav-home i{
    font-size: 1.1rem;
  }

  /* Center navbar items in mobile menu */
  .navbar-premium .navbar-nav{
    flex-direction: column;
    align-items: center;
    width: 100%;
  }

  .navbar-premium .navbar-nav .nav-item{
    width: 100%;
    text-align: center;
  }

  .navbar-premium .navbar-nav .nav-item .nav-link{
    display: inline-block;
    text-align: center;
    width: auto;
    margin: 0.25rem auto;
  }

  /* Mobile navbar animation */
  .navbar-premium .navbar-collapse{
    animation: slideDown 0.3s ease-out;
  }

  @keyframes slideDown {
    from {
      opacity: 0;
      transform: translateY(-10px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
}

/* Breadcrumb */
.breadcrumb{--bs-breadcrumb-divider: '›'; background:transparent; padding:0; margin-bottom:1rem; font-size:.75rem}
.breadcrumb .breadcrumb-item + .breadcrumb-item::before{color:#9ca3af}
.breadcrumb .breadcrumb-item a{color:#9ca3af; text-decoration:none}
.breadcrumb .breadcrumb-item a:hover{color:var(--lg-navy); text-decoration:none}
.breadcrumb .breadcrumb-item.active{color:var(--lg-accent); font-weight:700}

/* Hero */
.hero-premium{position:relative; min-height:72vh; display:flex; align-items:center; color:#fff;}
.hero-premium .overlay{position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.25));}
.hero-premium .content{position:relative; z-index:2;}
.hero-premium .tagline{letter-spacing:.08em; text-shadow:0 4px 18px rgba(0,0,0,.5); font-family:var(--font-hero); text-transform:uppercase}

/* Internal hero for section pages */
.internal-hero{position:relative; min-height:48vh; display:flex; align-items:center; color:#fff; background-size:cover; background-position:center;}
.internal-hero .overlay{position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.25));}
.internal-hero .headline{position:relative; z-index:2; font-weight:600; letter-spacing:.08em; text-transform:uppercase; text-shadow:0 4px 18px rgba(0,0,0,.5); font-family:var(--font-hero)}
.internal-hero .headline span{display:block; font-size:clamp(22px,3.3vw,40px)}

/* Buttons */
.btn-gold{background:var(--lg-gold); color:#1a1a1a; border:none}
.btn-gold:hover{background:#c5a22f; color:#111}
.btn-outline-gold{border-color:var(--lg-gold); color:#fff}
.btn-outline-gold:hover{background:var(--lg-gold); color:#111}
.btn-corporate{background:var(--lg-navy); color:#fff}
.btn-corporate:hover{background:var(--lg-deep); color:#fff}

/* Cards */
.card{border-radius:1rem; overflow:hidden; border:0; box-shadow:0 6px 24px rgba(7,34,56,.06)}
.card img{object-fit:cover}
.card .card-header, .card .card-title, .card h1, .card h2, .card h3, .card h4, .card h5, .card h6{font-family:var(--font-heading)}

/* Projects Masonry */
.project-masonry{column-count:1; column-gap:1rem}
@media (min-width:768px){.project-masonry{column-count:2}}
@media (min-width:1200px){.project-masonry{column-count:3}}
.project-item{break-inside:avoid; margin-bottom:1rem}
.project-card{position:relative; border-radius:1rem; overflow:hidden}
.project-card img{transition:transform .6s ease}
.project-card .overlay{position:absolute; inset:0; background:linear-gradient(180deg, rgba(11,46,78,.0), rgba(11,46,78,.6)); color:#fff; display:flex; align-items:flex-end; padding:1rem; opacity:0; transition:opacity .3s ease}
.project-card:hover img{transform:scale(1.06)}
.project-card:hover .overlay{opacity:1}

/* Facilities */
.section-alt{background:var(--lg-soft)}
.facility-card .icon{width:48px;height:48px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:rgba(212,175,55,.12);color:var(--lg-gold)}

/* News */
.timeline{position:relative}
.timeline::before{content:''; position:absolute; left:8px; top:0; bottom:0; width:2px; background:#e5e7eb}
.timeline-item{position:relative; padding-left:2rem}
.timeline-item::before{content:''; position:absolute; left:0; top:.6rem; width:12px; height:12px; border-radius:50%; background:var(--lg-gold)}

/* CSR & Awards */
.split-section .left{border-right:1px solid #e5e7eb}
.gallery-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:.75rem}
.gallery-grid img{border-radius:.75rem}

/* Profile Sidebar */
.profile-sidebar .card{border:0}
.profile-sidebar .card-header{background:#fff; border-bottom:2px solid #f3f4f6; font-family:var(--font-heading); letter-spacing:.06em; color:var(--lg-accent); font-weight:700; font-size:1rem}
.profile-sidebar .list-group-item{border:0; padding:1.05rem 1rem; display:flex; align-items:center; justify-content:space-between; text-transform:uppercase; letter-spacing:.06em; font-weight:700; font-size:.8125rem}
.profile-sidebar .list-group-item + .list-group-item{border-top:1px solid #eef2f7}
.profile-sidebar .list-group-item:hover{background:#fffbe6}
.profile-sidebar .list-group-item i{color:#9aa4b2; width:26px; height:26px; border-radius:50%; border:2px solid #e5e7eb; display:inline-flex; align-items:center; justify-content:center; background:#fff}
.profile-sidebar .list-group-item.active{background:var(--lg-gold); color:#111}
.profile-sidebar .list-group-item.active i{color:#fff; background:transparent; border-color:transparent}

/* Footer Modern */
.footer-modern{background:linear-gradient(180deg, #0f1419 0%, #1a1f26 100%); color:#cbd5e1; position:relative}
.footer-modern::before{content:''; position:absolute; top:0; left:0; right:0; height:1px; background:linear-gradient(90deg, transparent, var(--lg-gold), transparent)}

.footer-logo{height:45px}
.company-tagline{color:#9ca3af; font-size:.875rem; font-style:italic}

.contact-info{margin-top:1.5rem}
.contact-item{display:flex; align-items:center; gap:.75rem; margin-bottom:1rem; color:#cbd5e1; font-size:.875rem}
.contact-item i{width:20px; color:var(--lg-gold); text-align:center}

.social-links{display:flex; gap:.75rem}
.social-link{width:40px; height:40px; border:2px solid rgba(240,194,75,.2); border-radius:50%; display:inline-flex; align-items:center; justify-content:center; color:#cbd5e1; transition:all .3s ease}
.social-link:hover{background:var(--lg-gold); border-color:var(--lg-gold); color:#000; transform:translateY(-3px)}

.footer-title{color:var(--lg-gold); font-size:.875rem; font-weight:700; letter-spacing:.1em; margin-bottom:1.25rem; position:relative; padding-bottom:.5rem}
.footer-title::after{content:''; position:absolute; bottom:0; left:0; width:30px; height:2px; background:var(--lg-gold)}

.footer-links{list-style:none; padding:0; margin:0}
.footer-links li{margin-bottom:.75rem}
.footer-links a{color:#9ca3af; font-size:.875rem; transition:all .2s ease; display:inline-block}
.footer-links a:hover{color:var(--lg-gold); text-decoration:none; transform:translateX(5px)}

.newsletter-desc{color:#9ca3af; font-size:.875rem; margin-bottom:1.25rem}
.newsletter-form .input-group{background:#0a0e14; border-radius:50px; overflow:hidden; border:1px solid rgba(240,194,75,.2)}
.newsletter-form .form-control{background:transparent; border:0; color:#fff; padding:.75rem 1.25rem}
.newsletter-form .form-control::placeholder{color:#6b7280}
.newsletter-form .form-control:focus{box-shadow:none; outline:none}
.btn-subscribe{background:var(--lg-gold); color:#000; border:0; padding:.75rem 1.5rem; font-weight:700; transition:all .3s ease}
.btn-subscribe:hover{background:#c5a22f; color:#000}

.footer-badges{display:flex; gap:.75rem}
.badge-img{height:35px; width:auto; opacity:.7; filter:grayscale(1); transition:all .3s ease}
.badge-img:hover{opacity:1; filter:none}

.footer-bottom{background:#0a0e14; border-top:1px solid rgba(255,255,255,.05); padding:1.25rem 0; margin-top:3rem}
.copyright{color:#6b7280; font-size:.813rem; margin:0}
.footer-bottom-links{list-style:none; padding:0; margin:0; display:flex; gap:1.5rem; justify-content:flex-end}
.footer-bottom-links li{display:inline}
.footer-bottom-links a{color:#6b7280; font-size:.813rem; transition:color .2s ease}
.footer-bottom-links a:hover{color:var(--lg-gold); text-decoration:none}

/* WhatsApp floating */
.btn-whatsapp{background:#25D366; color:#fff; border-radius:50px; padding:.75rem 1.25rem; box-shadow:0 4px 12px rgba(37,211,102,.3); transition:all .3s ease; z-index:1000}
.btn-whatsapp:hover{background:#128C7E; color:#fff; transform:translateY(-3px); box-shadow:0 6px 20px rgba(37,211,102,.4)}
.btn-whatsapp i{font-size:1.25rem}

/* Section title */
.section-title{font-family:var(--font-heading); text-transform:uppercase; letter-spacing:.12em; font-weight:700; font-size:1.375rem}
.title-accent{display:block; width:48px; height:3px; background:var(--lg-gold); margin:.5rem 0 1.25rem}

/* Mobile Responsive Hero Content */
@media (max-width: 767px) {
  /* Hero Premium adjustments */
  .hero-premium {
    min-height: 100vh;
    padding: 20px 0;
  }
  
  /* Hero content wrapper */
  .hero-content {
    padding: 0 15px;
  }
  
  /* Glass container on mobile */
  .hero-content .glass {
    padding: 1.5rem 1rem !important;
    margin-bottom: 2rem !important;
    width: 100%;
    display: block !important;
  }
  
  /* Hero title responsive */
  .hero-content .display-3 {
    font-size: clamp(1.75rem, 5vw, 2.5rem) !important;
    line-height: 1.2;
    margin-bottom: 1rem !important;
  }
  
  /* Hero tagline */
  .hero-content .tagline {
    font-size: clamp(1.5rem, 4vw, 2rem) !important;
    letter-spacing: 0.05em;
  }
  
  /* Hero subtitle/lead text */
  .hero-content .lead {
    font-size: clamp(1rem, 3vw, 1.25rem) !important;
    line-height: 1.4;
  }
  
  /* Text gradient optimization */
  .text-gradient {
    display: inline-block;
    word-wrap: break-word;
  }
  
  /* Button group responsive */
  .hero-content .d-flex {
    flex-direction: column !important;
    gap: 0.75rem !important;
    width: 100%;
  }
  
  /* Buttons on mobile */
  .hero-content .btn-lg {
    padding: 0.75rem 1.5rem !important;
    font-size: 1rem !important;
    width: 100%;
    text-align: center;
  }
  
  /* Carousel controls */
  #heroCarousel .carousel-control-prev,
  #heroCarousel .carousel-control-next {
    width: 10%;
    opacity: 0.5;
  }
  
  #heroCarousel .carousel-control-prev-icon,
  #heroCarousel .carousel-control-next-icon {
    width: 2rem;
    height: 2rem;
  }
  
  /* Carousel indicators */
  #heroCarousel .carousel-indicators {
    bottom: 10px;
  }
  
  #heroCarousel .carousel-indicators [data-bs-target] {
    width: 8px;
    height: 8px;
  }
}

/* Tablet responsive adjustments */
@media (min-width: 768px) and (max-width: 991px) {
  .hero-content .display-3 {
    font-size: 2.5rem !important;
  }
  
  .hero-content .lead {
    font-size: 1.25rem !important;
  }
  
  .hero-content .btn-lg {
    padding: 0.625rem 1.25rem !important;
    font-size: 1.125rem !important;
  }
}

/* Profile Overview Hero Content Mobile */
@media (max-width: 767px) {
  /* Overview hero adjustments */
  .overview-hero {
    height: 400px;
    margin-bottom: 40px;
  }
  
  .overview-hero .hero-content {
    padding: 20px;
  }
  
  .overview-hero .hero-title {
    font-size: clamp(2rem, 6vw, 3rem);
    margin-bottom: 15px;
  }
  
  .overview-hero .hero-subtitle {
    font-size: clamp(1rem, 3vw, 1.25rem);
    margin-bottom: 30px;
  }
  
  .overview-hero .hero-badge {
    font-size: 0.875rem;
    padding: 6px 16px;
    margin-bottom: 15px;
  }
  
  /* Hero stats responsive */
  .overview-hero .hero-stats {
    flex-wrap: wrap;
    gap: 30px;
    justify-content: center;
  }
  
  .overview-hero .stat-item {
    min-width: 80px;
  }
  
  .overview-hero .stat-number {
    font-size: clamp(1.5rem, 4vw, 2rem);
    margin-bottom: 5px;
  }
  
  .overview-hero .stat-label {
    font-size: 0.813rem;
  }
}

/* General mobile optimizations */
@media (max-width: 575px) {
  /* Extra small devices */
  .hero-content {
    text-align: center;
  }
  
  .hero-content .glass {
    border-radius: 0.75rem !important;
  }
  
  /* Ensure animations work smoothly on mobile */
  @keyframes fadeInUp {
    from {
      opacity: 0;
      transform: translateY(20px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
}

/* Social Link Cards - Formal Style */
.social-link-formal {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  transform: translateY(0);
  box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

.social-link-formal:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  background-color: #ffffff !important;
  border-color: var(--lg-gold) !important;
}

/* Job Cards Styling */
.job-card {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  border: 1px solid rgba(240, 194, 75, 0.1);
  background: linear-gradient(135deg, #ffffff 0%, #fafafa 100%);
  height: 100%;
}

.job-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 40px rgba(11, 46, 78, 0.15);
  border-color: var(--lg-gold);
}

.job-card .card-title {
  color: var(--lg-navy);
  font-weight: 700;
  letter-spacing: 0.02em;
}

.job-card .badge {
  font-size: 0.75rem;
  padding: 0.5rem 1rem;
  border-radius: 50px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.job-card .btn {
  border-radius: 50px;
  font-weight: 600;
  padding: 0.5rem 1.5rem;
  transition: all 0.3s ease;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 0.875rem;
}

.job-card .btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}

.job-card .btn-outline-primary:hover {
  background-color: var(--lg-navy);
  border-color: var(--lg-navy);
  color: white;
}

.job-card .btn-outline-info:hover {
  background-color: #0dcaf0;
  border-color: #0dcaf0;
  color: white;
}

.job-card .fas {
  transition: all 0.3s ease;
}

.job-card:hover .fas {
  transform: scale(1.1);
}

/* Job card icons */
.job-card .fas.fa-check {
  color: #28a745 !important;
}

.job-card .fas.fa-star {
  color: #ffc107 !important;
}

.job-card .fas.fa-envelope {
  color: #ffffff !important;
}

.job-card .fas.fa-eye {
  color: var(--lg-navy) !important;
}

.job-card .fas.fa-map-marker-alt {
  color: #6c757d !important;
}

.job-card .fas.fa-clock {
  color: #6c757d !important;
}

/* Modern Modal Styling - Matching Home Page */
.modal-content {
  border-radius: 1rem;
  border: none;
  box-shadow: 0 25px 80px rgba(7, 34, 56, 0.15);
  overflow: hidden;
}

.modal-header {
  background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
  color: var(--lg-navy);
  border-bottom: 1px solid rgba(240, 194, 75, 0.1);
  padding: 2rem;
  position: relative;
}

.modal-header::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--lg-gold), #f0c24b);
}

.modal-header .badge {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  font-size: 0.875rem;
  padding: 0.5rem 1rem;
}

.modal-title {
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--lg-navy);
}

.modal-body {
  padding: 2.5rem;
  background: #ffffff;
}

.modal-body h6 {
  color: var(--lg-navy);
  font-weight: 700;
  margin-bottom: 1.5rem;
  font-size: 1.1rem;
  position: relative;
  padding-left: 2rem;
}

.modal-body h6::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 4px;
  height: 20px;
  background: var(--lg-gold);
  border-radius: 2px;
}

.modal-body .icon-wrapper {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: linear-gradient(135deg, rgba(240, 194, 75, 0.1), rgba(240, 194, 75, 0.05));
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid rgba(240, 194, 75, 0.1);
}

.modal-body .bg-light {
  background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%) !important;
  border: 1px solid rgba(240, 194, 75, 0.05);
}

.modal-body .benefit-item {
  transition: all 0.3s ease;
  border: 1px solid rgba(240, 194, 75, 0.05);
}

.modal-body .benefit-item:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(7, 34, 56, 0.1);
  border-color: var(--lg-gold);
}

.modal-body .skill-item {
  transition: all 0.3s ease;
  border: 1px solid rgba(240, 194, 75, 0.05);
}

.modal-body .skill-item:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(7, 34, 56, 0.1);
  border-color: var(--lg-gold);
  background: var(--lg-gold) !important;
}

.modal-body .skill-item:hover .text-dark {
  color: var(--lg-navy) !important;
}

.modal-body .card {
  border: 1px solid rgba(240, 194, 75, 0.08);
  border-radius: 1rem;
  box-shadow: 0 4px 20px rgba(7, 34, 56, 0.08);
}

.modal-body .card .btn {
  border-radius: 0.75rem;
  padding: 1rem 2rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  transition: all 0.3s ease;
}

.modal-body .card .btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(7, 34, 56, 0.15);
}

/* Professional Typography */
.modal-body .text-primary {
  color: var(--lg-navy) !important;
}

.modal-body .fw-bold {
  font-weight: 700 !important;
}

.modal-body .fw-semibold {
  font-weight: 600 !important;
}

/* Responsive Modal */
@media (max-width: 768px) {
  .modal-body {
    padding: 1.5rem;
  }

  .modal-header {
    padding: 1.5rem;
  }

  .modal-body h6 {
    font-size: 1rem;
    padding-left: 1.5rem;
  }

  .modal-body .icon-wrapper {
    width: 50px;
    height: 50px;
  }

  .modal-body .icon-wrapper i {
    font-size: 1.5rem !important;
  }
}

/* Responsive job cards */
@media (max-width: 768px) {
  .job-card {
    margin-bottom: 2rem;
  }

  .job-card .card-body {
    padding: 1.5rem !important;
  }

  .job-card .btn {
    width: 100%;
    margin-top: 0.5rem;
  }

  .modal-body {
    padding: 1.5rem;
  }

  .modal-dialog {
    margin: 0.5rem;
  }
}

/* Career Cards Styling - Matching Home Page Design */
.career-card {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  border: 1px solid rgba(240, 194, 75, 0.1);
  background: #fff;
  height: 100%;
  box-shadow: 0 5px 20px rgba(7, 34, 56, 0.05);
  position: relative;
  overflow: hidden;
}

.career-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 100%;
  background: var(--lg-gold);
  transform: scaleY(0);
  transform-origin: bottom;
  transition: transform 0.3s ease;
}

.career-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 15px 35px rgba(7, 34, 56, 0.15);
  border-color: rgba(240, 194, 75, 0.3);
}

.career-card:hover::before {
  transform: scaleY(1);
}

.career-card .card-title {
  color: var(--lg-navy);
  font-weight: 700;
  letter-spacing: 0.02em;
}

.career-card .badge {
  font-size: 0.75rem;
  padding: 0.5rem 1rem;
  border-radius: 50px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.career-card .btn {
  border-radius: 999px;
  font-weight: 600;
  padding: 0.5rem 1.5rem;
  transition: all 0.3s ease;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 0.875rem;
}

.career-card .btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}

.career-card .btn-outline-primary:hover {
  background-color: var(--lg-navy);
  border-color: var(--lg-navy);
  color: white;
}

.career-card .btn-outline-info:hover {
  background-color: var(--lg-gold);
  border-color: var(--lg-gold);
  color: #000;
}

.career-card .fas {
  transition: all 0.3s ease;
}

.career-card:hover .fas {
  transform: scale(1.1);
}

/* Career card icons */
.career-card .fas.fa-check-circle {
  color: #28a745 !important;
}

.career-card .fas.fa-envelope {
  color: #ffffff !important;
}

.career-card .fas.fa-eye {
  color: var(--lg-navy) !important;
}

.career-card .fas.fa-map-marker-alt {
  color: #6b7280 !important;
}

.career-card .fas.fa-clock {
  color: #6b7280 !important;
}

.career-card .fas.fa-briefcase {
  color: #6b7280 !important;
}

.career-card .fas.fa-drafting-compass {
  color: var(--lg-gold) !important;
}

/* Development Modal Styling */
#developmentModal .modal-content {
  border-radius: 1rem;
  border: none;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);
  overflow: hidden;
}

#developmentModal .modal-header {
  background: linear-gradient(135deg, #ffc107 0%, #ff6b00 100%);
  color: #000;
  border-bottom: none;
  padding: 1.5rem 2rem;
  position: relative;
}

#developmentModal .modal-header::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #000, #fff);
}

#developmentModal .modal-title {
  font-weight: 700;
  letter-spacing: 0.02em;
}

#developmentModal .modal-body {
  padding: 2rem;
  background: #ffffff;
  text-align: center;
}

#developmentModal .modal-body h4 {
  color: var(--lg-navy);
  font-weight: 700;
  margin-bottom: 1rem;
}

#developmentModal .modal-body p {
  color: #6c757d;
  font-size: 1rem;
  line-height: 1.6;
}

#developmentModal .modal-body .fa-cog {
  color: #ffc107;
}

#developmentModal .modal-body .bg-light {
  background: rgba(240, 194, 75, 0.1) !important;
  border: 1px solid rgba(240, 194, 75, 0.2);
}

#developmentModal .modal-body .btn-primary {
  background: var(--lg-navy);
  border-color: var(--lg-navy);
  border-radius: 0.75rem;
  padding: 0.75rem 2rem;
  font-weight: 600;
  transition: all 0.3s ease;
}

#developmentModal .modal-body .btn-primary:hover {
  background: var(--lg-gold);
  border-color: var(--lg-gold);
  color: #000;
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}

/* Clean layout improvements */
.section-title {
  position: relative;
  padding-bottom: 1rem;
}

.section-title::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 60px;
  height: 3px;
  background: linear-gradient(90deg, var(--lg-gold), #f0c24b);
  border-radius: 2px;
}

/* Utilities */
.rounded-4{border-radius:1rem!important}
h1,h2,h3,h4,h5,h6{font-family:var(--font-heading)}
.content-typography{font-size:.875rem}
.content-typography p{line-height:1.9; text-align:justify}
.lazy{filter:blur(8px)}
.lazy.loaded{filter:blur(0); transition:filter .3s ease}

/* ===============================================
   COMPREHENSIVE NAVBAR BLUE BACKGROUND FIX
   Override all Bootstrap default active/focus states
   =============================================== */

/* Override Bootstrap default focus/active states to prevent blue background */
.navbar-premium .navbar-nav .nav-link:focus,
.navbar-premium .navbar-nav .nav-link:active,
.navbar-premium .navbar-nav .nav-link.active,
.navbar-premium .navbar-nav .nav-link.show,
.navbar-premium .navbar-nav .nav-link[aria-expanded="true"] {
  background-color: transparent !important;
  color: var(--lg-gold) !important;
  box-shadow: none !important;
  outline: none !important;
  border: none !important;
  -webkit-tap-highlight-color: transparent !important;
}

/* Override any potential Bootstrap blue background on selection */
.navbar-premium .navbar-nav .nav-link::selection,
.navbar-premium .navbar-nav .nav-link::-moz-selection,
.navbar-premium .navbar-nav .nav-link::-webkit-selection {
  background-color: transparent !important;
  color: var(--lg-gold) !important;
}

/* Ensure no blue background on hover states */
.navbar-premium .navbar-nav .nav-link:hover:focus,
.navbar-premium .navbar-nav .nav-link:hover:active {
  background-color: transparent !important;
  color: var(--lg-gold) !important;
}

/* Force remove any Bootstrap active state styling */
.navbar-premium .navbar-nav .nav-link:focus-visible,
.navbar-premium .navbar-nav .nav-link:focus-within,
.navbar-premium .navbar-nav .nav-link:target {
  background-color: transparent !important;
  color: var(--lg-gold) !important;
  outline: none !important;
  box-shadow: none !important;
  border: none !important;
}

/* Override Bootstrap dropdown active states */
.navbar-premium .dropdown-toggle:focus,
.navbar-premium .dropdown-toggle:active,
.navbar-premium .dropdown-toggle.active,
.navbar-premium .dropdown-toggle.show {
  background-color: transparent !important;
  color: var(--lg-gold) !important;
  box-shadow: none !important;
  outline: none !important;
  border: none !important;
}

/* Mobile specific overrides */
@media (max-width: 991px) {
  .navbar-premium .navbar-nav .nav-link:focus,
  .navbar-premium .navbar-nav .nav-link:active,
  .navbar-premium .navbar-nav .nav-link.active,
  .navbar-premium .navbar-nav .nav-link.show {
    background-color: rgba(240, 194, 75, 0.15) !important;
    color: var(--lg-gold) !important;
    box-shadow: none !important;
    outline: none !important;
    border: none !important;
    -webkit-tap-highlight-color: transparent !important;
  }

  .navbar-premium .dropdown-toggle:focus,
  .navbar-premium .dropdown-toggle:active,
  .navbar-premium .dropdown-toggle.active,
  .navbar-premium .dropdown-toggle.show {
    background-color: rgba(240, 194, 75, 0.15) !important;
    color: var(--lg-gold) !important;
    box-shadow: none !important;
    outline: none !important;
    border: none !important;
  }
}

/* Additional Bootstrap override for all possible active states */
.navbar-premium .nav-link[aria-current="page"],
.navbar-premium .nav-link.active,
.navbar-premium .nav-link:active,
.navbar-premium .nav-link:focus,
.navbar-premium .nav-link:hover {
  background-color: transparent !important;
  box-shadow: none !important;
  outline: none !important;
  border: none !important;
}

/* Override Bootstrap's default active link styling */
.navbar-premium .nav-link.active {
  color: var(--lg-gold) !important;
  background-color: transparent !important;
}

/* Ensure dropdown items don't have blue background */
.navbar-premium .dropdown-item:focus,
.navbar-premium .dropdown-item:active,
.navbar-premium .dropdown-item:hover {
  background-color: rgba(240, 194, 75, 0.1) !important;
  color: var(--lg-gold) !important;
}

/* Override Bootstrap button focus states */
.navbar-premium .navbar-toggler:focus {
  background-color: rgba(240, 194, 75, 0.1) !important;
  box-shadow: 0 0 0 0.2rem rgba(240, 194, 75, 0.25) !important;
  outline: none !important;
  border: none !important;
}

/* Ensure no blue outline appears */
.navbar-premium *:focus {
  outline: none !important;
  box-shadow: none !important;
}

/* Override any remaining Bootstrap focus styles */
.navbar-premium .nav-link:focus,
.navbar-premium .dropdown-toggle:focus {
  --bs-navbar-active-color: var(--lg-gold) !important;
  --bs-navbar-hover-color: var(--lg-gold) !important;
}