:root{
  --navy:#071a3a;
  --blue:#0b4dff;
  --sky:#38bdf8;
  --white:#ffffff;
  --yellow:#ffc107;
  --orange:#ffb86b;
  --muted:#6b7a90;

  --glass: rgba(255,255,255,0.08);
  --glass-border: rgba(255,255,255,0.16);
}

*{scroll-behavior:smooth;}
body{
  font-family:"Poppins", sans-serif;
  background:#f7fbff;
  color:#0b1633;
    /* overflow-x: hidden; */
}

a{ text-decoration:none; }
.section-pad{ padding: 90px 0; }
.section-alt{ background: linear-gradient(180deg, #ffffff 0%, #f2fbff 100%); }


.section-pad{ padding: 90px 0; }
@media (max-width: 576px){
  .section-pad{ padding: 52px 0; }
}

/* ===================== TOPBAR ===================== */
.topbar{
  background: linear-gradient(90deg, var(--navy), #0b2b6a);
  color: rgba(255,255,255,0.92);
  font-size: 13px;
}
.topbar .topbar-link{
  color: rgba(255,255,255,0.92);
  font-weight: 500;
}
.topbar .topbar-link:hover{ color: var(--yellow); }

/* ===================== NAVBAR ===================== */
.nav-glass{
  background: linear-gradient(90deg, rgba(7,26,58,0.95), rgba(11,77,255,0.65));
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(255,255,255,0.12);
}
.navbar .nav-link{
  color: rgba(255,255,255,0.92);
  font-weight: 500;
  padding: .7rem .9rem;
  border-radius: 999px;
}
.navbar .nav-link:hover,
.navbar .nav-link.active{
  background: rgba(255,255,255,0.12);
  color: #fff;
}

.brand-badge{
  width:42px;height:42px;border-radius:14px;
  display:grid;place-items:center;
  background: linear-gradient(135deg, var(--sky), var(--blue));
  box-shadow: 0 10px 25px rgba(56,189,248,0.25);
  color:#fff;
}
.brand-title{
  font-family:"Playfair Display", serif;
  font-weight:700;
  letter-spacing:.2px;
  font-size: 18px;
  color:#fff;
}
.brand-subtitle{
  color: rgba(255,255,255,0.8);
}

.navbar-logo {
  height: 75px;
  width: auto;
  object-fit: contain;
}


/* Buttons */
.btn-shine{
  position:relative;
  overflow:hidden;
}
.btn-shine::after{
  content:"";
  position:absolute; top:-20%; left:-60%;
  width:40%; height:140%;
  background: rgba(255,255,255,0.35);
  transform: rotate(20deg);
  filter: blur(1px);
  transition: all .6s ease;
}
.btn-shine:hover::after{
  left:120%;
}
.btn-soft{
  border-color: rgba(255,255,255,0.6);
}
.btn-soft:hover{
  background: rgba(255,255,255,0.12);
  border-color: rgba(255,255,255,0.8);
}
.btn-soft2{
  border-width:2px;
}

/* ===================== HERO ===================== */
.hero{ position:relative; }
.hero-img{
  height: 78vh;
  object-fit: cover;
}
.hero-overlay{
  position:absolute; inset:0;
  background: radial-gradient(900px 400px at 25% 35%, rgba(56,189,248,0.35), transparent 60%),
              linear-gradient(90deg, rgba(7,26,58,0.7), rgba(7,26,58,0.25));
  pointer-events:none;
}
.carousel-caption{
  text-align:left;
  left:0; right:0;
  bottom: 10%;
  z-index:2;
}
.hero-card{
  background: var(--glass);
  border: 1px solid var(--glass-border);
  border-radius: 22px;
  padding: 28px;
  box-shadow: 0 30px 70px rgba(0,0,0,0.25);
}
.hero-pill{
  display:inline-flex; align-items:center;
  background: rgba(255,255,255,0.14);
  border: 1px solid rgba(255,255,255,0.18);
  color:#fff;
  padding: 8px 14px;
  border-radius: 999px;
  font-weight: 600;
  font-size: 13px;
}
.hero-title{
  font-family:"Playfair Display", serif;
  font-weight:700;
  color:#fff;
  font-size: clamp(28px, 4vw, 46px);
  line-height: 1.1;
}
.hero-text{
  color: rgba(255,255,255,0.88);
  font-size: 16px;
  max-width: 560px;
}
.hero-mini{
  display:flex; gap:10px; flex-wrap:wrap;
}
.hero-mini .mini{
  display:flex; align-items:center; gap:8px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.14);
  color: rgba(255,255,255,0.9);
  font-size: 13px;
}
.hero-mini .mini i{ color: var(--yellow); }

/* ===================== SECTION HEAD ===================== */
.section-head .section-tag{
  display:inline-block;
  background: linear-gradient(135deg, rgba(56,189,248,0.18), rgba(11,77,255,0.12));
  border: 1px solid rgba(11,77,255,0.16);
  color: var(--navy);
  padding: 7px 14px;
  border-radius: 999px;
  font-weight: 700;
  letter-spacing: .4px;
  font-size: 12px;
}
.section-title{
  margin-top: 12px;
  font-family:"Playfair Display", serif;
  font-weight:700;
  font-size: clamp(24px, 3vw, 36px);
  color: #071a3a;
}
.section-subtitle{
  color: var(--muted);
  margin-top: 10px;
  line-height: 1.7;
}

/* ===================== ABOUT ===================== */
.info-card{
  display:flex; gap:12px;
  padding: 14px 14px;
  border-radius: 16px;
  background: #fff;
  border: 1px solid rgba(11,77,255,0.10);
  box-shadow: 0 10px 30px rgba(7,26,58,0.05);
  height:100%;
}
.info-card i{
  width:42px;height:42px;border-radius:14px;
  display:grid;place-items:center;
  background: linear-gradient(135deg, var(--sky), var(--blue));
  color:#fff;
}
.info-card h6{ margin:0; font-weight: 700; }
.info-card p{ margin: 3px 0 0; color: var(--muted); font-size: 13px; }

.about-visual{ position:relative; }
.about-glow{
  position:absolute; inset:-20px;
  background: radial-gradient(closest-side, rgba(56,189,248,0.35), transparent 65%);
  filter: blur(10px);
}

/* About Image Right Side */
.about-image-wrap{
  position: relative;
}

.about-image-card{
  position: relative;
  border-radius: 24px;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(11,77,255,0.12);
  box-shadow: 0 22px 70px rgba(7,26,58,0.12);
}

.about-image{
  width: 100%;
  height: 420px;
  object-fit: cover;
  transition: transform .35s ease;
}

.about-image-card:hover .about-image{
  transform: scale(1.05);
}

@media (max-width: 576px){
  .about-image{
    height: 260px;
  }
}

.about-box{
  position:relative;
  background: #fff;
  border: 1px solid rgba(11,77,255,0.12);
  border-radius: 24px;
  padding: 18px;
  box-shadow: 0 20px 60px rgba(7,26,58,0.10);
}
.about-badge{
  display:flex; gap:12px; align-items:center;
  padding: 12px 14px;
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(255,193,7,0.18), rgba(255,184,107,0.16));
  border: 1px solid rgba(255,193,7,0.24);
}
.about-badge i{
  width:44px;height:44px;border-radius:16px;
  display:grid;place-items:center;
  background: linear-gradient(135deg, var(--yellow), var(--orange));
  color:#1a1a1a;
}
.about-img-placeholder{
  margin-top:14px;
  border-radius: 20px;
  overflow:hidden;
  min-height: 260px;
  background:
    radial-gradient(600px 300px at 20% 30%, rgba(56,189,248,0.35), transparent 60%),
    linear-gradient(135deg, rgba(7,26,58,0.95), rgba(11,77,255,0.65));
  position:relative;
}
.about-text-overlay{
  position:absolute; left:16px; right:16px; bottom:16px;
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.16);
  border-radius: 18px;
  padding: 14px;
  color:#fff;
}
.about-stats{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:12px;
}
.stat{
  background: linear-gradient(135deg, rgba(56,189,248,0.14), rgba(11,77,255,0.08));
  border: 1px solid rgba(11,77,255,0.12);
  border-radius: 18px;
  padding: 14px;
  text-align:center;
}
.stat-num{
  font-weight:800;
  font-size: 22px;
  color: var(--navy);
}
.stat-label{
  color: var(--muted);
  font-size: 12px;
}

/* ===================== SERVICES ===================== */
.service-card{
  background:#fff;
  border: 1px solid rgba(11,77,255,0.12);
  border-radius: 22px;
  padding: 22px;
  box-shadow: 0 15px 40px rgba(7,26,58,0.06);
  transition: transform .25s ease, box-shadow .25s ease;
  height: 100%;
}
.service-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 25px 70px rgba(7,26,58,0.10);
}
.service-icon{
  width:56px;height:56px;border-radius:18px;
  display:grid;place-items:center;
  background: linear-gradient(135deg, var(--yellow), var(--orange));
  color:#151515;
  box-shadow: 0 14px 30px rgba(255,193,7,0.25);
  margin-bottom: 12px;
  font-size: 26px;
}
.service-card h5{ font-weight: 800; color: var(--navy); }
.service-card p{ color: var(--muted); margin:0; }

/* === Service Icon Hover Rotation Effect === */
.service-card .service-icon {
  transition: transform 0.5s ease, box-shadow 0.3s ease;
  transform-origin: center;
}

.service-card:hover .service-icon {
  transform: rotate(360deg) scale(1.05);
  box-shadow: 0 18px 35px rgba(255, 193, 7, 0.45);
}

/* Optional: slight icon glow on hover */
.service-card:hover .service-icon i {
  filter: drop-shadow(0 0 6px rgba(255, 193, 7, 0.6));
}

/* ===================== WHY CHOOSE ===================== */
.choose-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap: 12px;
}
.choose-item{
  display:flex; gap:12px;
  background:#fff;
  border: 1px solid rgba(11,77,255,0.10);
  border-radius: 18px;
  padding: 14px;
  box-shadow: 0 10px 30px rgba(7,26,58,0.05);
}
.choose-item i{
  color: var(--blue);
  font-size: 22px;
  margin-top: 2px;
}
.choose-item h6{ margin:0; font-weight: 800; }
.choose-item p{ margin:4px 0 0; color: var(--muted); font-size: 13px; }

.why-card{
  border-radius: 26px;
  overflow:hidden;
  box-shadow: 0 25px 70px rgba(7,26,58,0.10);
  border: 1px solid rgba(255,255,255,0.2);
}
.why-top{
  padding: 22px;
  background: linear-gradient(135deg, rgba(7,26,58,0.98), rgba(11,77,255,0.75));
  color:#fff;
}
.why-badge{
  display:inline-flex; align-items:center; gap:8px;
  background: rgba(255,255,255,0.12);
  border: 1px solid rgba(255,255,255,0.16);
  border-radius: 999px;
  padding: 8px 12px;
  font-weight: 700;
  font-size: 13px;
  margin-bottom: 12px;
}
.why-badge i{ color: var(--yellow); }
.why-bottom{
  padding: 22px;
  background: #fff;
}
.why-progress{ margin-bottom: 14px; }
.progress{
  height: 10px;
  border-radius: 999px;
  background: rgba(11,77,255,0.10);
}
.progress-bar{
  border-radius: 999px;
  background: linear-gradient(90deg, var(--sky), var(--blue));
}

/* ===================== ACHIEVEMENTS ===================== */
.achievements{
  position:relative;
  background:
    radial-gradient(900px 450px at 20% 30%, rgba(56,189,248,0.35), transparent 60%),
    linear-gradient(135deg, rgba(7,26,58,1), rgba(11,77,255,0.85));
  overflow:hidden;
}
.ach-overlay{
  position:absolute; inset:0;
  background: radial-gradient(600px 300px at 80% 40%, rgba(255,193,7,0.25), transparent 60%);
  pointer-events:none;
}
.ach-card{
  position:relative;
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.16);
  border-radius: 20px;
  padding: 18px;
  text-align:center;
  color:#fff;
  backdrop-filter: blur(10px);
}
.ach-card i{
  font-size: 28px;
  color: var(--yellow);
}
.ach-num{
  font-weight: 900;
  font-size: 26px;
  margin-top: 8px;
}
.ach-label{
  color: rgba(255,255,255,0.85);
  font-size: 12px;
}



/* ===================== FAQ ===================== */
.faq-side-card{
  background:#fff;
  border: 1px solid rgba(11,77,255,0.12);
  border-radius: 24px;
  padding: 22px;
  box-shadow: 0 18px 60px rgba(7,26,58,0.08);
  height: 100%;
}

.faq-side-icon{
  width: 58px;
  height: 58px;
  border-radius: 20px;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, var(--yellow), var(--orange));
  color: #111;
  font-size: 26px;
  box-shadow: 0 18px 40px rgba(255,193,7,0.25);
  margin-bottom: 12px;
}

.faq-accordion-wrap{
  background:#fff;
  border: 1px solid rgba(11,77,255,0.10);
  border-radius: 24px;
  padding: 12px;
  box-shadow: 0 18px 60px rgba(7,26,58,0.08);
}

.faq-item{
  border: 0 !important;
  border-radius: 18px !important;
  overflow: hidden;
  margin-bottom: 10px;
  background: linear-gradient(135deg, rgba(56,189,248,0.10), rgba(11,77,255,0.06));
}

.accordion-button{
  font-weight: 800;
  border-radius: 18px !important;
  background: transparent !important;
  color: var(--navy) !important;
  padding: 16px 16px;
  box-shadow: none !important;
}

.accordion-button:not(.collapsed){
  background: linear-gradient(135deg, rgba(7,26,58,0.92), rgba(11,77,255,0.78)) !important;
  color: #fff !important;
}

.accordion-button::after{
  filter: brightness(0.2);
}
.accordion-button:not(.collapsed)::after{
  filter: brightness(2);
}

.accordion-body{
  color: var(--muted);
  line-height: 1.75;
  background: rgba(255,255,255,0.75);
}

.faq-bottom-note{
  background: linear-gradient(135deg, rgba(255,193,7,0.20), rgba(255,184,107,0.18));
  border: 1px solid rgba(255,193,7,0.22);
  color: #1a1a1a;
  border-radius: 18px;
  padding: 12px 14px;
  font-weight: 600;
}



/* ===================== GALLERY ===================== */
.gallery-item{
  position:relative;
  border-radius: 18px;
  overflow:hidden;
  border: 1px solid rgba(11,77,255,0.10);
  box-shadow: 0 16px 40px rgba(7,26,58,0.08);
  background:#fff;
}
.gallery-item img{
  width:100%;
  height: 210px;
  object-fit: cover;
  transition: transform .35s ease;
}
.gallery-item:hover img{ transform: scale(1.06); }
.gallery-cap{
  position:absolute;
  inset:auto 12px 12px 12px;
  background: rgba(7,26,58,0.78);
  border: 1px solid rgba(255,255,255,0.16);
  color:#fff;
  padding: 10px 12px;
  border-radius: 14px;
  display:flex; align-items:center; justify-content:space-between;
  gap: 10px;
}
.gallery-cap small{
  color: rgba(255,255,255,0.8);
}




/* ===================== CONTACT ===================== */
.contact-cards{ display:grid; gap:12px; }

.contact-card{
  display:flex;
  gap:12px;
  align-items:flex-start;              /* ✅ important: keep icon aligned to top */
  background:#fff;
  border: 1px solid rgba(11,77,255,0.10);
  border-radius: 18px;
  padding: 14px;
  box-shadow: 0 12px 30px rgba(7,26,58,0.05);
}

.contact-card i{
  width:46px;
  height:46px;
  min-width:46px;                      /* ✅ prevents shrinking */
  flex: 0 0 46px;                      /* ✅ fixed size always */
  border-radius:16px;
  display:grid;
  place-items:center;
  background: linear-gradient(135deg, var(--sky), var(--blue));
  color:#fff;
  font-size: 20px;
  margin-top: 2px;                     /* ✅ small optical alignment */
}

.contact-card h6{
  margin: 0 0 4px;
}

.contact-card a{
  color: var(--navy);
  font-weight: 700;
}

.contact-card p{
  color: var(--muted);
  margin: 0;
  line-height: 1.6;                    /* ✅ better readability for address */
  word-break: break-word;              /* ✅ avoids overflow on small screens */
}
@media (max-width: 576px){
  .contact-card{
    padding: 12px;
    gap: 10px;
  }
  .contact-card i{
    width:44px; height:44px; min-width:44px; flex:0 0 44px;
  }
}


.form-wrap{
  background:#fff;
  border: 1px solid rgba(11,77,255,0.12);
  border-radius: 24px;
  padding: 22px;
  box-shadow: 0 18px 60px rgba(7,26,58,0.08);
}
.form-control, .form-select{
  border-radius: 14px;
  padding: 12px 14px;
  border: 1px solid rgba(11,77,255,0.15);
}
.form-control:focus, .form-select:focus{
  box-shadow: 0 0 0 .2rem rgba(56,189,248,0.22);
  border-color: rgba(56,189,248,0.65);
}

/* ===================== MAP ===================== */
.map-wrap iframe{
  width:100%;
  height: 420px;
  border: 0;
  display:block;
}
.map-wrap{
  background: #f8fbff;
  /* padding: 80px 0 0; */
}

.map-wrap iframe{
  width: 100%;
  height: 420px;
  border: none;
  margin-top: 20px;
  border-radius: 0;
}

/* ===================== FOOTER ===================== */
.footer{
  background: linear-gradient(135deg, rgba(7,26,58,1), rgba(11,77,255,0.7));
  color:#fff;
}
.footer-title{
  font-weight: 800;
  margin-bottom: 14px;
}
.footer-links{ list-style:none; padding:0; margin:0; display:grid; gap:10px; }
.footer-links a{
  color: rgba(255,255,255,0.82);
}
.footer-links a:hover{ color: var(--yellow); }
.footer-contact{ list-style:none; padding:0; margin:0; display:grid; gap:10px; }
.footer-contact li{ display:flex; gap:10px; align-items:flex-start; color: rgba(255,255,255,0.85); }
.footer-contact i{ color: var(--yellow); margin-top: 2px; }
.footer-contact a{ color: rgba(255,255,255,0.9); }
.social{
  width:42px;height:42px;border-radius:16px;
  display:grid;place-items:center;
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.16);
  color:#fff;
  transition: transform .2s ease;
}
.social:hover{ transform: translateY(-3px); color: var(--yellow); }
.footer-bottom{
  border-top: 1px solid rgba(255,255,255,0.12);
}

/* ===================== FLOATING BUTTONS (FIX MOBILE OVERFLOW) ===================== */
.float-btn{
  position: fixed;
  right: 18px;
  z-index: 999;
  display:flex;
  align-items:center;
  gap:10px;
  padding: 12px 14px;
  border-radius: 999px;
  color:#fff;
  font-weight: 800;
  box-shadow: 0 18px 45px rgba(0,0,0,0.22);
  border: 1px solid rgba(255,255,255,0.22);
  backdrop-filter: blur(8px);
  overflow:hidden;
  max-width: calc(100vw - 24px);  /* ✅ prevents overflow */
}

.float-btn i{ font-size: 20px; }
.float-text{ font-size: 13px; white-space: nowrap; }

.float-whatsapp{
  bottom: 56px;
  background: linear-gradient(135deg, #25D366, #128C7E);
}
.float-call{
  bottom: 122px;
  background: linear-gradient(135deg, var(--blue), var(--sky));
}

.float-btn::before{
  content:"";
  position:absolute; inset:-50%;
  background: conic-gradient(from 90deg, rgba(255,255,255,0.0), rgba(255,255,255,0.35), rgba(255,255,255,0.0));
  animation: spin 2.6s linear infinite;
  opacity: .55;
}
.float-btn > *{ position:relative; z-index:1; }

/* ✅ MOBILE MODE: Make them compact circles (no text, no overflow) */
@media (max-width: 576px){
  .float-btn{
    right: 12px;              /* closer to edge */
    padding: 0;               /* remove padding */
    width: 52px;
    height: 52px;
    border-radius: 50%;
    justify-content: center;
    gap: 0;
  }

  .float-text{ display:none; } /* hide text to avoid width issues */

  .float-whatsapp{ bottom: 18px; }
  .float-call{ bottom: 100px; }

  .float-btn i{ font-size: 22px; }
}


@keyframes spin{
  to{ transform: rotate(360deg); }
}

/* Responsive */
@media (max-width: 991px){
  .hero-img{ height: 72vh; }
  .carousel-caption{ bottom: 7%; }
}
@media (max-width: 576px){
  .hero-img{ height: 70vh; }
  .hero-card{ padding: 18px; border-radius: 18px; }
  .float-text{ display:none; } /* compact on mobile */
  .about-stats{ grid-template-columns: 1fr; }
  .gallery-item img{ height: 180px; }
}














/* ===================== COUNTRIES WE OFFER ===================== */
.country-card{
  background:#fff;
  border: 1px solid rgba(11,77,255,0.12);
  border-radius: 22px;
  padding: 18px 14px;
  box-shadow: 0 15px 40px rgba(7,26,58,0.06);
  text-align: center;
  height: 100%;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  position: relative;
  overflow: hidden;
}

.country-card::before{
  content:"";
  position:absolute;
  inset:-2px;
  background: radial-gradient(500px 220px at 50% 0%, rgba(56,189,248,0.25), transparent 60%);
  opacity: 0;
  transition: opacity .25s ease;
  pointer-events:none;
}

.country-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 25px 70px rgba(7,26,58,0.10);
  border-color: rgba(56,189,248,0.45);
}

.country-card:hover::before{
  opacity: 1;
}

.country-flag{
  width: 82px;
  height: 82px;
  margin: 0 auto 10px;
  border-radius: 22px;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, rgba(255,193,7,0.18), rgba(255,184,107,0.16));
  border: 1px solid rgba(255,193,7,0.22);
  box-shadow: 0 14px 30px rgba(255,193,7,0.18);
  transition: transform .25s ease;
}

.country-card:hover .country-flag{
  transform: rotate(-3deg) scale(1.05);
}

.country-flag img{
  width: 52px;
  height: 52px;
  object-fit: contain;
}

.country-name{
  margin: 0;
  font-weight: 800;
  color: var(--navy);
  font-size: 14px;
  line-height: 1.2;
}

/* Mobile tuning */
@media (max-width: 576px){
  .country-flag{
    width: 74px;
    height: 74px;
    border-radius: 20px;
  }
  .country-flag img{
    width: 48px;
    height: 48px;
  }
  .country-card{
    padding: 16px 12px;
    border-radius: 18px;
  }
  .country-name{
    font-size: 13px;
  }
}


/* ===================== MOBILE COMPACT MODE ===================== */
@media (max-width: 576px){

  /* Reduce overall section spacing */
  .section-pad{ padding: 52px 0; }

  /* Reduce navbar height */
  .navbar-logo{ height: 48px; }

  /* Hero smaller */
  .hero-img{ height: 58vh; }
  .carousel-caption{ bottom: 5%; }
  .hero-card{ padding: 16px; }
  .hero-text{ font-size: 14px; }

  /* Reduce card padding a bit */
  .service-card{ padding: 16px; border-radius: 18px; }
  .faq-side-card{ padding: 16px; border-radius: 18px; }
  .faq-accordion-wrap{ padding: 10px; border-radius: 18px; }
  .form-wrap{ padding: 16px; border-radius: 18px; }

  /* Reduce headings spacing */
  .section-title{ margin-top: 8px; }
  .section-subtitle{ margin-top: 8px; line-height: 1.6; }

  /* Map smaller height */
  .map-wrap iframe{ height: 320px; margin-top: 12px; }

  /* Gallery image height already 180px (OK) */
}




/* ===================== FIX HORIZONTAL OVERFLOW (MOBILE) ===================== */
html, body{
  width: 100%;
  max-width: 100%;
  overflow-x: hidden !important;
}

/* Prevent any media from pushing width */
img, svg, video, canvas, iframe{
  max-width: 100%;
}

/* Carousel overflow fix */
.hero,
.carousel,
.carousel-inner,
.carousel-item{
  overflow: hidden;
}

/* Caption padding on very small screens */
@media (max-width: 576px){
  .carousel-caption{
    left: 0 !important;
    right: 0 !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  /* hero card should never exceed screen */
  .hero-card{
    width: 100%;
    max-width: 100%;
  }
}

/* Stop glow elements from causing overflow */
.about-visual,
.about-image-wrap{
  overflow: hidden;
}

/* Reduce glow spread on small screens */
@media (max-width: 576px){
  .about-glow{
    inset: -6px;   /* was -20px */
  }
}
@media (max-width: 576px){
  .float-btn::before{
    inset: -10%;   /* was -50% */
  }
}


/* ===================== HERO BANNER MOBILE FIX ===================== */
@media (max-width: 576px){

  /* Bring caption higher & add side padding */
  .carousel-caption{
    bottom: 4% !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  /* Make hero card compact */
  .hero-card{
    padding: 14px !important;
    border-radius: 16px !important;
    max-width: 100%;
  }

  /* Smaller pill */
  .hero-pill{
    padding: 6px 10px !important;
    font-size: 12px !important;
  }

  /* Reduce title size */
  .hero-title{
    font-size: 26px !important;
    line-height: 1.15 !important;
    margin-bottom: 8px !important;
  }

  /* Reduce paragraph */
  .hero-text{
    font-size: 13px !important;
    line-height: 1.55 !important;
    margin-bottom: 0 !important;
  }

  /* Buttons full width for clean alignment */
  .hero-card .btn{
    width: 100%;
    justify-content: center;
    padding: 10px 14px !important;
    font-size: 14px !important;
  }

  /* Reduce top margin for buttons */
  .hero-card .mt-4{
    margin-top: 12px !important;
  }

  /* Mini features: stack neatly */
  .hero-mini{
    margin-top: 12px !important;
    gap: 8px !important;
    flex-direction: column;
  }

  .hero-mini .mini{
    width: 100%;
    justify-content: flex-start;
    padding: 10px 12px !important;
    border-radius: 14px !important;
    font-size: 13px !important;
  }

  /* Reduce hero image height slightly for better content fit */
  .hero-img{
    height: 62vh !important;
  }
}
@media(max-width:768px)
{
	.cu-mb-ds-nn{
		display:none!important
	}
}