/* ==========================================================================
   GIANT OVERSEAS — custom.css
   Paste into WordPress Customizer → Additional CSS after Elementor conversion.
   Design tokens: Navy (#0B1F3A) + Gold (#D4A017) + Teal (#1C6758)
   Display: Fraunces / Body: Work Sans / Utility: IBM Plex Mono
   Signature motif: passport "stamp" badges + dashed flight-route lines +
   a boarding-pass perforated divider between sections.
   ========================================================================== */

:root{
  --navy: #0B1F3A;
  --navy-deep: #071527;
  --navy-light: #12294D;
  --gold: #D4A017;
  --gold-light: #F0C75E;
  --teal: #1C6758;
  --surface: #F6F7F9;
  --ink: #0B1F3A;
  --offwhite: #F5F6F8;
  --line: #E3E6EB;
}

html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important;}
}

body{ font-family:'Work Sans', sans-serif; color:var(--ink); }
.font-display{ font-family:'Fraunces', serif; }
.font-mono{ font-family:'IBM Plex Mono', monospace; }

/* Skip link */
.skip-link{
  position:absolute; left:-999px; top:0; background:var(--gold); color:var(--navy-deep);
  padding:.75rem 1.25rem; z-index:100; font-weight:600; border-radius:0 0 6px 0;
}
.skip-link:focus{ left:0; }

/* Focus states */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible{
  outline:3px solid var(--gold); outline-offset:2px; border-radius:2px;
}

/* ---------------- Header ---------------- */
.site-header{
  background-color: rgba(7, 21, 39, 0.95);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(212, 160, 23, 0.15);
  transition: background-color .35s ease, box-shadow .35s ease, border-color .35s ease;
}
.site-header.is-scrolled{
  background-color: rgba(7, 21, 39, 0.98);
  box-shadow: 0 8px 24px rgba(7, 21, 39, 0.35);
  border-bottom-color: rgba(212, 160, 23, 0.3);
}
.nav-link{
  position:relative; padding-bottom:4px; color: rgba(245, 246, 248, 0.9); transition: color .2s ease;
}
.nav-link:hover, .nav-link.active{
  color: var(--gold) !important;
}
.nav-link::after{
  content:""; position:absolute; left:0; bottom:0; width:0; height:2px; background:var(--gold);
  transition:width .25s ease;
}
.nav-link:hover::after, .nav-link.active::after{ width:100%; }

.mobile-menu{ max-height:0; overflow:hidden; transition:max-height .4s ease; }
.mobile-menu.open{ max-height:640px; }

/* ---------------- Buttons ---------------- */
.btn-gold{
  background:var(--gold); color:var(--navy-deep); font-weight:600;
  transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease;
  box-shadow: 0 6px 18px rgba(212,160,23,.35);
}
.btn-gold:hover{ background:var(--gold-light); transform:translateY(-2px); box-shadow:0 10px 22px rgba(212,160,23,.45); }

.btn-outline-light{
  border:1.5px solid rgba(245,246,248,.55); color:var(--offwhite);
  transition: background-color .2s ease, border-color .2s ease, transform .2s ease;
}
.btn-outline-light:hover{ background:rgba(245,246,248,.1); border-color:var(--offwhite); transform:translateY(-2px); }

.btn-teal{
  background:var(--teal); color:var(--offwhite); font-weight:600;
  transition: transform .2s ease, box-shadow .2s ease;
}
.btn-teal:hover{ transform:translateY(-2px); box-shadow:0 10px 22px rgba(28,103,88,.35); }

/* ---------------- Signature: Stamp badge ---------------- */
.stamp-badge{
  position:relative;
  display:inline-flex; align-items:center; justify-content:center;
  border:2px dashed var(--gold);
  border-radius:50%;
  transform:rotate(-8deg);
  color:var(--gold);
}
.stamp-badge .stamp-inner{
  border:1px solid var(--gold); border-radius:50%;
}
.stamp-badge.teal{ border-color:var(--teal); color:var(--teal); }
.stamp-badge.teal .stamp-inner{ border-color:var(--teal); }

/* ---------------- Signature: dashed flight route ---------------- */
.route-line{
  position:relative;
  height:2px;
  background-image: linear-gradient(to right, var(--gold) 60%, transparent 0%);
  background-position: bottom;
  background-size: 14px 2px;
  background-repeat: repeat-x;
}
.route-line .plane-marker{
  position:absolute; top:50%; transform:translate(-50%,-50%);
  animation: fly-across 6s ease-in-out infinite;
}
@keyframes fly-across{
  0%{ left:0%; }
  50%{ left:100%; }
  100%{ left:0%; }
}
.route-dot{
  width:10px; height:10px; border-radius:50%; background:var(--gold);
  box-shadow:0 0 0 4px rgba(212,160,23,.2);
}

/* ---------------- Signature: boarding-pass divider ---------------- */
.ticket-divider{
  position:relative;
  height:34px;
}
.ticket-divider svg{ display:block; width:100%; height:100%; }
.ticket-divider .notch{
  position:absolute; top:-17px; width:34px; height:34px; border-radius:50%; background:var(--surface);
}
.ticket-divider .notch.left{ left:-17px; }
.ticket-divider .notch.right{ right:-17px; }
.ticket-divider.on-navy .notch{ background:var(--navy); }

/* ---------------- Cards ---------------- */
.service-card{
  background:#fff; border:1px solid var(--line);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.service-card:hover{
  transform:translateY(-6px);
  box-shadow: 0 18px 40px rgba(11,31,58,.12);
  border-color: var(--gold);
}
.service-card .icon-wrap{
  transition: background-color .25s ease, color .25s ease, transform .25s ease;
}
.service-card:hover .icon-wrap{
  background:var(--gold); color:var(--navy-deep); transform:scale(1.08) rotate(-4deg);
}

.process-step{
  position:relative;
}
.process-step .step-num{
  font-family:'IBM Plex Mono', monospace;
  -webkit-text-stroke: 1.5px var(--gold);
  color:transparent;
}

.testimonial-card{
  background:var(--navy-light); border:1px solid rgba(245,246,248,.08);
}
.quote-mark{
  font-family:'Fraunces', serif; color:var(--gold); opacity:.5; line-height:1;
}

.faq-item{ border-bottom:1px solid var(--line); }
.faq-item button[aria-expanded="true"] .faq-icon{ transform:rotate(45deg); }
.faq-icon{ transition:transform .25s ease; }
.faq-answer{ max-height:0; overflow:hidden; transition:max-height .35s ease; }

.blog-card img{ transition:transform .5s ease; }
.blog-card:hover img{ transform:scale(1.06); }

/* Stat counters */
.stat-number{ font-family:'IBM Plex Mono', monospace; }

/* Marquee for destination flags/strip */
.marquee-track{
  display:flex; width:max-content; animation: marquee 28s linear infinite;
}
.marquee-track:hover{ animation-play-state: paused; }
@keyframes marquee{
  from{ transform:translateX(0); }
  to{ transform:translateX(-50%); }
}

/* Reveal on scroll */
.reveal{ opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease; }
.reveal.in-view{ opacity:1; transform:translateY(0); }

/* Form (static/dummy — becomes Text Editor widget in Elementor) */
/* Form inputs (human-crafted styling) */
.dummy-input{
  background:#fff; border:1px solid var(--line); color:var(--navy-deep);
  transition:border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}
.dummy-input:focus{ border-color:var(--gold); box-shadow:0 0 0 3.5px rgba(212,160,23,.18); outline:none; }

/* Dark surface inputs for Employer panel */
.dummy-input-dark {
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.16);
  color: var(--offwhite);
  transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}
.dummy-input-dark::placeholder {
  color: rgba(245, 246, 248, 0.45);
}
.dummy-input-dark:focus {
  background: rgba(255, 255, 255, 0.12);
  border-color: var(--teal);
  box-shadow: 0 0 0 3.5px rgba(28, 103, 88, 0.35);
  outline: none;
}
.dummy-input-dark option {
  background: var(--navydeep);
  color: var(--offwhite);
}

/* Utility hairline section rule */
.hairline{ border-top:1px solid var(--line); }
.hairline-dark{ border-top:1px solid rgba(245,246,248,.12); }

/* ==========================================================================
   HUMAN TOUCH ENHANCEMENTS
   ========================================================================== */

/* Left Side Language Dropdown Menu */
.lang-dropdown-wrap {
  position: relative;
  display: inline-block;
}
.lang-dropdown-btn {
  background: rgba(7, 21, 39, 0.85);
  border: 1px solid rgba(212, 160, 23, 0.4);
  border-radius: 9999px;
  padding: 0.35rem 0.85rem;
  color: #F5F6F8;
  font-size: 0.75rem;
  font-family: var(--font-sans, sans-serif);
  font-weight: 600;
  cursor: pointer;
  transition: all 0.25s ease;
  box-shadow: 0 4px 12px rgba(7, 21, 39, 0.15);
}
.lang-dropdown-btn:hover,
.lang-dropdown-btn[aria-expanded="true"] {
  border-color: var(--gold);
  background: rgba(7, 21, 39, 0.95);
  box-shadow: 0 4px 16px rgba(212, 160, 23, 0.25);
}
.lang-dropdown-btn[aria-expanded="true"] .dropdown-arrow {
  transform: rotate(180deg);
}
.lang-dropdown-menu {
  display: none;
  position: absolute;
  right: 0;
  top: calc(100% + 0.5rem);
  width: 10.5rem;
  max-height: 18rem;
  overflow-y: auto;
  background: var(--navydeep, #071527);
  border: 1px solid rgba(212, 160, 23, 0.4);
  border-radius: 0.875rem;
  padding: 0.375rem;
  box-shadow: 0 15px 35px rgba(7, 21, 39, 0.6);
  z-index: 999;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-8px);
  transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
}
.lang-dropdown-menu::-webkit-scrollbar {
  width: 4px;
}
.lang-dropdown-menu::-webkit-scrollbar-thumb {
  background: rgba(212, 160, 23, 0.5);
  border-radius: 9999px;
}
.lang-dropdown-menu.open {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0) !important;
}


.lang-option-btn {
  width: 100%;
  text-align: left;
  padding: 0.5rem 0.75rem;
  border-radius: 0.5rem;
  font-size: 0.75rem;
  font-weight: 500;
  color: rgba(245, 246, 248, 0.85);
  background: transparent;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: background 0.15s ease, color 0.15s ease;
}
.lang-option-btn:hover {
  background: rgba(212, 160, 23, 0.15);
  color: var(--gold);
}
.lang-option-btn.selected {
  background: var(--gold) !important;
  color: var(--navydeep) !important;
  font-weight: 700;
}


/* Language Toggle Pill */
.lang-toggle{
  display:inline-flex; align-items:center; background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.2); border-radius:9999px; padding:2px; font-size:12px; font-weight:600;
}
.lang-btn{
  padding:3px 10px; border-radius:9999px; color:var(--offwhite); transition:all .2s ease; cursor:pointer;
}
.lang-btn.active{
  background:var(--gold); color:var(--navy-deep); box-shadow:0 2px 8px rgba(212,160,23,.4);
}

/* Floating Human Support Advisor Widget */
.advisor-widget{
  position:fixed; bottom:24px; right:24px; z-index:90; display:flex; flex-direction:column; align-items:flex-end;
}
.advisor-btn{
  display:flex; align-items:center; gap:12px; background:var(--navy-deep); color:var(--offwhite);
  border:1px solid var(--gold); padding:8px 16px 8px 8px; border-radius:9999px;
  box-shadow:0 12px 30px rgba(7,21,39,.35); cursor:pointer;
  transition:transform .25s ease, box-shadow .25s ease;
}
.advisor-btn:hover{
  transform:translateY(-3px) scale(1.02); box-shadow:0 16px 36px rgba(7,21,39,.45);
}
.advisor-avatar-wrap{ position:relative; width:40px; height:40px; }
.advisor-avatar{ width:100%; height:100%; border-radius:50%; object-fit:cover; border:2px solid var(--gold); }
.advisor-pulse-ring{
  position:absolute; inset:-4px; border-radius:50%; border:2px solid var(--gold);
  animation: pulse-ring 2s cubic-bezier(0.45, 0, 0.55, 1) infinite;
}
@keyframes pulse-ring{
  0%{ transform:scale(0.9); opacity:0.8; }
  100%{ transform:scale(1.35); opacity:0; }
}
.advisor-badge-dot{
  position:absolute; bottom:0; right:0; width:10px; height:10px; background:#10B981;
  border:2px solid var(--navy-deep); border-radius:50%;
}
.advisor-popup{
  max-width:320px; background:#fff; border:1px solid var(--line); border-radius:16px;
  box-shadow:0 20px 45px rgba(11,31,58,.2); margin-bottom:12px; padding:20px;
  opacity:0; transform:translateY(12px) scale(0.95); pointer-events:none;
  transition:opacity .3s ease, transform .3s ease;
}
.advisor-popup.open{
  opacity:1; transform:translateY(0) scale(1); pointer-events:auto;
}

/* Human Promise Cards */
.promise-card{
  background:#fff; border:1px solid var(--line); border-top:4px solid var(--teal);
  transition:transform .25s ease, box-shadow .25s ease;
}
.promise-card:hover{
  transform:translateY(-4px); box-shadow:0 14px 30px rgba(11,31,58,.08);
}
.promise-card.gold-top{ border-top-color:var(--gold); }

/* Bangla Font Styling */
.bn-text{ font-family: 'Noto Sans Bengali', 'Work Sans', sans-serif; }

/* Dynamic Contact Form Segmented Control */
.contact-tab-btn {
  color: var(--navy);
  background: transparent;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}
.contact-tab-btn:hover {
  color: var(--navy-deep);
  background: rgba(7, 21, 39, 0.06);
}
.contact-tab-btn.active-js {
  background: var(--gold) !important;
  color: var(--navy-deep) !important;
  box-shadow: 0 4px 16px rgba(212, 160, 23, 0.4);
}
.contact-tab-btn.active-em {
  background: var(--teal) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 16px rgba(28, 103, 88, 0.4);
}
.contact-form-panel.active-panel {
  display: block !important;
  animation: fadeInForm 0.4s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
@keyframes fadeInForm {
  from { opacity: 0; transform: translateY(12px) scale(0.99); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

/* ==========================================================================
   HUMAN DESIGN SYSTEM TOKENS & MICRO-INTERACTIONS
   ========================================================================== */

:root {
  --navy: #0B1F3A;
  --navydeep: #071527;
  --navy-light: #12294D;
  --gold: #D4A017;
  --gold-light: #F0C75E;
  --gold-bg: rgba(212, 160, 23, 0.08);
  --teal: #1C6758;
  --surface: #FAF9F6;
  --surface-card: #FFFDF7;
  --ink: #0B1F3A;
  --offwhite: #F5F6F8;
  --line: #E8E6E1;
  --text-secondary: #6B7280;
  --shadow-sm: 0 2px 8px rgba(11, 31, 58, 0.04);
  --shadow-md: 0 10px 25px -5px rgba(11, 31, 58, 0.06), 0 8px 10px -6px rgba(11, 31, 58, 0.04);
  --shadow-lg: 0 20px 35px -10px rgba(11, 31, 58, 0.08), 0 10px 15px -5px rgba(11, 31, 58, 0.04);
  --shadow-gold: 0 12px 28px -6px rgba(212, 160, 23, 0.35);
}

body {
  font-family: 'Work Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  color: #1F2937;
  background-color: var(--surface);
  line-height: 1.6;
}

.font-display { font-family: 'Fraunces', Georgia, serif; }
.font-mono { font-family: 'IBM Plex Mono', monospace; }

/* Human Card Aesthetics */
.human-card {
  background: var(--surface-card);
  border: 1px solid var(--line);
  border-radius: 1.25rem;
  padding: 2rem;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  box-shadow: var(--shadow-sm);
  position: relative;
  overflow: hidden;
}

.human-card:hover {
  transform: translateY(-3px);
  border-color: rgba(212, 160, 23, 0.25);
  box-shadow: var(--shadow-md);
}

/* Feature Badge Accents */
.badge-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.375rem 0.875rem;
  border-radius: 9999px;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.025em;
  transition: all 0.2s ease;
}

.badge-pill-gold {
  background: rgba(212, 160, 23, 0.12);
  color: #B3830F;
  border: 1px solid rgba(212, 160, 23, 0.3);
}

.badge-pill-navy {
  background: rgba(11, 31, 58, 0.08);
  color: var(--navy);
  border: 1px solid rgba(11, 31, 58, 0.15);
}

.badge-pill-emerald {
  background: rgba(16, 185, 129, 0.1);
  color: #059669;
  border: 1px solid rgba(16, 185, 129, 0.25);
}

/* Status Indicator (Static — no animation) */
.pulse-dot {
  width: 8px;
  height: 8px;
  background-color: var(--gold);
  border-radius: 50%;
  position: relative;
  display: inline-block;
}

/* Typographic Number Badge — replaces emoji icons */
.number-badge {
  font-family: 'Fraunces', Georgia, serif;
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--gold);
  letter-spacing: -0.02em;
  line-height: 1;
}

/* Testimonial Gold Left Border Accent */
.testimonial-accent-border {
  border-left: 3px solid var(--gold);
  padding-left: 1.25rem;
}

/* Human Service Cards */
.service-human-card {
  background: #FFFFFF;
  border: 1px solid #E5E7EB;
  border-radius: 1.25rem;
  padding: 2.25rem 1.75rem;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.service-human-card:hover {
  transform: translateY(-3px);
  border-color: rgba(212, 160, 23, 0.25);
  box-shadow: 0 16px 28px -8px rgba(11, 31, 58, 0.06);
}

.service-human-card .icon-wrap {
  width: 3.25rem;
  height: 3.25rem;
  border-radius: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  margin-bottom: 1.25rem;
  transition: transform 0.3s ease;
}

.service-human-card:hover .icon-wrap {
  transform: scale(1.1) rotate(-3deg);
}

/* Testimonial Human Card */
.testimonial-card-human {
  background: #FFFFFF !important;
  border: 1px solid #E5E7EB;
  border-radius: 1.25rem;
  padding: 2rem;
  box-shadow: 0 8px 24px rgba(11, 31, 58, 0.04);
  transition: all 0.3s ease;
}

.testimonial-card-human:hover {
  border-color: rgba(212, 160, 23, 0.35);
  box-shadow: 0 16px 32px rgba(11, 31, 58, 0.08);
}

/* Section Dividers & Soft Gradients */
.section-ambient-bg {
  background: linear-gradient(180deg, #F8F9FA 0%, #FFFFFF 100%);
}

.section-dark-ambient {
  background: radial-gradient(circle at 50% 0%, #0D2648 0%, #071527 100%);
}


/* Icon Badge Variants */
.icon-badge {
  width: 3.25rem;
  height: 3.25rem;
  border-radius: 0.875rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s ease;
}
.feature-card:hover .icon-badge,
.service-card:hover .icon-badge {
  transform: scale(1.08);
}

.icon-badge-pink { background: rgba(236, 72, 153, 0.12); color: #ec4899; }
.icon-badge-amber { background: rgba(245, 158, 11, 0.12); color: #d97706; }
.icon-badge-purple { background: rgba(139, 92, 246, 0.12); color: #7c3aed; }
.icon-badge-teal { background: rgba(20, 184, 166, 0.12); color: #0d9488; }
.icon-badge-rose { background: rgba(244, 63, 94, 0.12); color: #e11d48; }
.icon-badge-emerald { background: rgba(16, 185, 129, 0.12); color: #059669; }

/* Service Cards System */
.service-card {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 1.25rem;
  padding: 2.25rem 1.75rem;
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  box-shadow: 0 4px 20px rgba(11, 31, 58, 0.03);
}
.service-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 28px -8px rgba(11, 31, 58, 0.06);
  border-color: rgba(212, 160, 23, 0.25);
}

/* Image Card Hover Zoom Effect */
.card-img-zoom {
  overflow: hidden;
  border-radius: 1.25rem;
}
.card-img-zoom img {
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.card-img-zoom:hover img {
  transform: scale(1.06);
}

/* Stat Box Component */
.stat-box {
  text-align: center;
  padding: 1.5rem 1rem;
}
.stat-number {
  font-family: var(--font-display, 'Fraunces', serif);
  font-size: 2.75rem;
  font-weight: 700;
  color: var(--navy-deep);
  line-height: 1;
  letter-spacing: -0.02em;
}

/* Premium FAQ Accordion */
.faq-accordion-item {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 1rem;
  overflow: hidden;
  transition: border-color 0.25s ease, box-shadow 0.25s ease;
}
.faq-accordion-item:hover {
  border-color: rgba(11, 31, 58, 0.2);
}
.faq-accordion-btn {
  width: 100%;
  padding: 1.25rem 1.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  text-align: left;
  font-weight: 600;
  color: var(--navy-deep);
  cursor: pointer;
}
.faq-accordion-btn[aria-expanded="true"] {
  color: var(--gold);
}
.faq-accordion-btn .icon-plus {
  transition: transform 0.3s ease;
}
.faq-accordion-btn[aria-expanded="true"] .icon-plus {
  transform: rotate(45deg);
}

/* Testimonial Quote Card */
.testimonial-card {
  background: #ffffff !important;
  border: 1px solid var(--line);
  border-radius: 1.5rem;
  padding: 2.25rem 1.75rem;
  box-shadow: 0 15px 35px rgba(7, 21, 39, 0.08);
  position: relative;
  color: var(--navydeep);
}
.testimonial-card p,
.testimonial-card h3,
.testimonial-card h4,
.testimonial-card span:not(.stamp-inner) {
  color: var(--navydeep);
}
.testimonial-card .quote-text {
  color: rgba(7, 21, 39, 0.8) !important;
}
.testimonial-card .author-role {
  color: rgba(7, 21, 39, 0.55) !important;
}
.testimonial-quote-mark {
  font-family: serif;
  font-size: 4.5rem;
  line-height: 1;
  color: rgba(212, 160, 23, 0.25) !important;
  position: absolute;
  top: 1.25rem;
  right: 1.75rem;
  pointer-events: none;
}


/* Badge Highlight Border Frame for Images */
.img-badge-frame {
  position: relative;
}
.img-badge-frame::before {
  content: '';
  position: absolute;
  inset: -12px;
  border: 2px solid var(--gold);
  border-radius: 1.5rem;
  z-index: 0;
  pointer-events: none;
  opacity: 0.6;
}

/* ==========================================================================
   ELEMENTOR & WORDPRESS COMPATIBILITY UTILITIES (FULL MASTER PACK)
   ========================================================================== */

/* 1. Dark Background Sections (Header, Hero, Stats, CTA) */
.bg-navydeep, 
.bg-navydeep\/95,
section.bg-navydeep,
section[data-id="71003b6d"],
section[data-id="49b921a4"],
section[data-id="sec_cta"],
section[data-id="sec_stats"],
section[data-id="sec_testimonials"] {
  background-color: #071527 !important;
  color: #F5F6F8 !important;
}

.bg-navy, .bg-navy\/80 {
  background-color: #0B1F3A !important;
}

.bg-navylight {
  background-color: #12294D !important;
}

/* 2. Text Colors for Dark Sections */
section.bg-navydeep .elementor-heading-title,
section[data-id="71003b6d"] .elementor-heading-title,
section[data-id="49b921a4"] .elementor-heading-title,
section[data-id="sec_cta"] .elementor-heading-title,
.text-offwhite, .text-offwhite\/85, .text-offwhite\/90, .text-offwhite\/60 {
  color: #F5F6F8 !important;
}

.text-gold, span.text-gold {
  color: #D4A017 !important;
}

.border-gold\/30 {
  border-color: rgba(212, 160, 23, 0.3) !important;
}

/* 3. Text & Heading Colors for Light Sections (About Us, Services) */
.elementor-widget-heading .elementor-heading-title,
h1.elementor-heading-title, 
h2.elementor-heading-title, 
h3.elementor-heading-title {
  color: #0B1F3A;
}

/* 4. Stat Counter Numbers */
.stat-number {
  font-family: 'IBM Plex Mono', monospace !important;
  color: #0B1F3A !important;
  font-weight: 700 !important;
}

/* 5. Buttons Override */
.btn-gold, a.btn-gold {
  background-color: #D4A017 !important;
  color: #071527 !important;
  font-weight: 700 !important;
  border-radius: 9999px !important;
  padding: 12px 28px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-decoration: none !important;
  box-shadow: 0 6px 20px rgba(212, 160, 23, 0.35) !important;
  transition: all 0.25s ease !important;
}

.btn-gold:hover, a.btn-gold:hover {
  background-color: #F0C75E !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 25px rgba(212, 160, 23, 0.45) !important;
}

.btn-outline-light, a.btn-outline-light {
  border: 1.5px solid rgba(245, 246, 248, 0.5) !important;
  color: #F5F6F8 !important;
  font-weight: 600 !important;
  border-radius: 9999px !important;
  padding: 12px 28px !important;
  display: inline-flex !important;
  align-items: center !important;
  text-decoration: none !important;
  transition: all 0.25s ease !important;
}

.btn-outline-light:hover, a.btn-outline-light:hover {
  background-color: rgba(245, 246, 248, 0.1) !important;
  border-color: #F5F6F8 !important;
  transform: translateY(-2px) !important;
}

/* 6. Feature & Service Cards */
.feature-card-widget, .elementor-widget-icon-box {
  background: #ffffff !important;
  border: 1px solid #E3E6EB !important;
  border-radius: 16px !important;
  padding: 24px !important;
  box-shadow: 0 10px 25px rgba(11, 31, 58, 0.05) !important;
}

.feature-card-widget .elementor-icon-box-title span,
.feature-card-widget h3 {
  color: #0B1F3A !important;
  font-weight: 700 !important;
}

.feature-card-widget .elementor-icon-box-description {
  color: #4B5563 !important;
}

.elementor-icon-box-icon span.elementor-icon svg {
  fill: #D4A017 !important;
}

.max-w-7xl {
  max-width: 80rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.backdrop-blur-md {
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
}