/* ═══════════════════════════════════════════════════════════════
   GLOBALEXPRESSINC — COMPREHENSIVE RESPONSIVE STYLES
   Mobile-first responsive fixes for all pages
   ═══════════════════════════════════════════════════════════════ */

/* ── BASE MOBILE FIXES ── */
html { font-size: 16px; -webkit-text-size-adjust: 100%; }
body { overflow-x: hidden; width: 100%; position: relative; }
img, video, svg, canvas { max-width: 100%; height: auto; }

/* ── HERO SECTION MOBILE FIXES ── */
@media (max-width: 767px) {
  section.relative.min-h-\[700px\] { min-height: 100vh !important; min-height: 100dvh !important; }
  section.relative.min-h-\[640px\] { min-height: 480px !important; padding-top: 5rem !important; padding-bottom: 3rem !important; }
  section.relative.min-h-\[620px\] { min-height: 460px !important; padding-top: 5rem !important; padding-bottom: 3rem !important; }
  section.relative.min-h-\[580px\] { min-height: 420px !important; padding-top: 5rem !important; padding-bottom: 3rem !important; }
  .hero-content h1, h1.text-5xl, h1.text-5xl.md\:text-7xl { font-size: 2.2rem !important; line-height: 1.15 !important; }
  .hero-content p.text-lg { font-size: 0.95rem !important; }
  .hero-content .flex-wrap.gap-4 { flex-direction: column; width: 100%; }
  .hero-content .flex-wrap.gap-4 a { width: 100%; justify-content: center; }
}

/* ── NAVBAR MOBILE FIXES ── */
@media (max-width: 1023px) {
  header#navbar, header#navbar.navbar-scrolled { top: 0 !important; }
}
@media (max-width: 480px) {
  header#navbar .h-16 { height: 3.5rem !important; }
  header#navbar a span.text-xl { font-size: 1rem !important; }
  #announce-bar { padding-top: 0.4rem !important; padding-bottom: 0.4rem !important; font-size: 0.65rem !important; }
  #announce-bar .inline-flex { gap: 0.25rem !important; }
}

/* ── MOBILE MENU ── */
@media (max-width: 767px) {
  #mobileMenu { gap: 1.25rem !important; padding: 1rem; }
  #mobileMenu a.text-xl { font-size: 1.25rem !important; }
}

/* ── TRACKING SECTION ── */
@media (max-width: 767px) {
  .track-tab { padding: 0.5rem 0.75rem !important; }
  .track-tab span { font-size: 0.7rem !important; }
  form.flex-col.sm\:flex-row { flex-direction: column !important; }
  form.flex-col.sm\:flex-row button { width: 100%; }
  .flex-wrap.gap-6.mt-6 { gap: 0.75rem !important; }
  .flex-wrap.gap-6.mt-6 > div { font-size: 0.65rem !important; }
}

/* ── INFO STRIP ── */
@media (max-width: 767px) {
  .grid-cols-1.md\:grid-cols-3 .p-6 { padding: 1rem !important; }
  .grid-cols-1.md\:grid-cols-3 .p-6 p.text-xl { font-size: 1rem !important; }
  .grid-cols-1.md\:grid-cols-3 .w-14.h-14 { width: 2.75rem !important; height: 2.75rem !important; }
}

/* ── ABOUT SECTION ── */
@media (max-width: 1023px) {
  .grid.lg\:grid-cols-2.gap-16 { gap: 2rem !important; }
  .absolute.-top-6.-left-6.w-32.h-32,
  .absolute.-bottom-6.-right-6.w-40.h-40 { display: none !important; }
  img.w-full.h-\[550px\] { height: 300px !important; }
  .absolute.bottom-10.-right-10 { position: relative !important; bottom: auto !important; right: auto !important; margin-top: -2rem !important; margin-left: 1rem !important; margin-right: 1rem !important; padding: 1rem !important; }
  .absolute.bottom-10.-right-10 .text-4xl { font-size: 1.75rem !important; }
}
@media (max-width: 767px) {
  h2.text-4xl.md\:text-5xl.lg\:text-6xl { font-size: 1.75rem !important; }
  .grid-cols-1.sm\:grid-cols-2.gap-8 { gap: 0.75rem !important; }
  .grid-cols-1.sm\:grid-cols-2.gap-8 .p-4 { padding: 0.75rem !important; }
}

/* ── SERVICES SECTION ── */
@media (max-width: 767px) {
  .py-24 { padding-top: 3rem !important; padding-bottom: 3rem !important; }
  h2.text-4xl.md\:text-5xl { font-size: 1.75rem !important; }
  .card-hover .h-56 { height: 12rem !important; }
  .card-hover .p-8 { padding: 1.25rem !important; }
  .card-hover h3.text-2xl { font-size: 1.25rem !important; }
}

/* ── PROCESS SECTION ── */
@media (max-width: 767px) {
  .grid-cols-1.md\:grid-cols-4.gap-8 { gap: 1.5rem !important; }
  .grid-cols-1.md\:grid-cols-4.gap-8 .w-24.h-24 { width: 4.5rem !important; height: 4.5rem !important; }
  .grid-cols-1.md\:grid-cols-4.gap-8 h4.text-xl { font-size: 1.1rem !important; }
}

/* ── CALCULATOR SECTION ── */
@media (max-width: 1023px) {
  .bg-orange-500.rounded-3xl .p-10.md\:p-16 { padding: 1.5rem !important; }
  .bg-orange-500.rounded-3xl h2.text-4xl.md\:text-5xl { font-size: 1.75rem !important; }
}
@media (max-width: 767px) {
  .grid.grid-cols-2.gap-6 { grid-template-columns: 1fr !important; gap: 0.75rem !important; }
  .grid.grid-cols-3.gap-6 { grid-template-columns: 1fr 1fr !important; gap: 0.75rem !important; }
}

/* ── TESTIMONIALS ── */
@media (max-width: 767px) {
  .grid-cols-1.md\:grid-cols-3.gap-8 { gap: 1rem !important; }
  .bg-white.rounded-2xl.p-8 { padding: 1.25rem !important; }
}

/* ── STATS COUNTERS ── */
@media (max-width: 767px) {
  .grid-cols-2.md\:grid-cols-4.gap-12 { gap: 1.5rem !important; }
  .grid-cols-2.md\:grid-cols-4.gap-12 .text-5xl.md\:text-6xl { font-size: 2.25rem !important; }
  .grid-cols-2.md\:grid-cols-4.gap-12 i.h-12.w-12 { width: 2rem !important; height: 2rem !important; }
}

/* ── NEWS SECTION ── */
@media (max-width: 767px) {
  .relative.h-64 { height: 12rem !important; }
}

/* ── FOOTER ── */
@media (max-width: 767px) {
  .grid-cols-1.md\:grid-cols-2.lg\:grid-cols-5.gap-10 { gap: 1.5rem !important; }
  .pt-16 { padding-top: 2.5rem !important; }
  .pb-8 { padding-bottom: 1.5rem !important; }
  .border-t.border-slate-800.pt-6 { flex-direction: column !important; text-align: center !important; }
  .flex.gap-5 { flex-wrap: wrap !important; justify-content: center !important; gap: 0.75rem !important; }
}

/* ── NEWSLETTER ── */
@media (max-width: 767px) {
  .flex.gap-2.w-full.md\:w-auto { flex-direction: column !important; width: 100% !important; }
  .flex.gap-2.w-full.md\:w-auto input,
  .flex.gap-2.w-full.md\:w-auto button { width: 100% !important; }
}

/* ── TRUST BADGES ── */
@media (max-width: 767px) {
  .flex-wrap.items-center.justify-center.gap-8 { gap: 0.5rem !important; }
  .flex-wrap.items-center.justify-center.gap-8 > div { font-size: 0.55rem !important; }
}

/* ═══════════════════
   ABOUT PAGE SPECIFIC
   ═══════════════════ */
@media (max-width: 767px) {
  .relative.max-w-5xl.mx-auto .mb-12 { margin-bottom: 1rem !important; }
  .relative.max-w-5xl.mx-auto .bg-slate-50.border.border-slate-100.rounded-2xl.p-6 { padding: 1rem !important; }
  .relative.max-w-5xl.mx-auto h3.text-xl { font-size: 1.1rem !important; }
  .hidden.md\:flex.w-\[10\%\] { display: none !important; }
  .relative.flex.flex-col.md\:flex-row.items-center.gap-0.mb-12 { padding-left: 2rem !important; position: relative !important; }
  .relative.flex.flex-col.md\:flex-row.items-center.gap-0.mb-12::before {
    content: ''; position: absolute; left: 0.5rem; top: 0.5rem;
    width: 0.75rem; height: 0.75rem; border-radius: 50%;
    background: #f97316; border: 2px solid #fff;
    box-shadow: 0 2px 8px rgba(249,115,22,0.3); z-index: 1;
  }
  .relative.flex.flex-col.md\:flex-row.items-center.gap-0.mb-12::after {
    content: ''; position: absolute; left: 0.85rem; top: 1.5rem;
    bottom: -1rem; width: 2px;
    background: linear-gradient(to bottom, #f97316, rgba(249,115,22,0.1));
  }
  .relative.flex.flex-col.md\:flex-row.items-center.gap-0.mb-12:last-child::after { display: none; }
  .grid-cols-2.md\:grid-cols-4.gap-6 { gap: 0.75rem !important; }
  .grid-cols-2.md\:grid-cols-4.gap-6 .p-6 { padding: 1rem !important; }
  .flex.flex-wrap.gap-4.justify-center a { width: 100%; justify-content: center; }
}

/* ═══════════════════════
   SERVICES PAGE SPECIFIC
   ═══════════════════════ */
@media (max-width: 1023px) {
  .grid.lg\:grid-cols-2.gap-16 img.w-full.h-\[460px\] { height: 280px !important; }
  .grid.lg\:grid-cols-2.gap-16 h2.text-4xl.md\:text-5xl { font-size: 1.75rem !important; }
}
@media (max-width: 767px) {
  .grid-cols-1.md\:grid-cols-3.gap-8 .p-8 { padding: 1.25rem !important; }
  .transform.md\:-translate-y-4 { transform: none !important; }
  .grid-cols-2.md\:grid-cols-4.gap-5 { gap: 0.5rem !important; }
  .grid-cols-2.md\:grid-cols-4.gap-5 .p-6 { padding: 0.75rem !important; }
  .grid-cols-2.md\:grid-cols-4.gap-5 .w-14.h-14 { width: 2.5rem !important; height: 2.5rem !important; }
  .grid-cols-2.md\:grid-cols-4.gap-5 h4 { font-size: 0.7rem !important; }
  .absolute.bottom-6.left-6.bg-white\/95 {
    position: relative !important; bottom: auto !important; left: auto !important;
    margin-top: -2.5rem !important; margin-left: 0.5rem !important;
    margin-right: 0.5rem !important; padding: 0.5rem 0.75rem !important;
  }
  .flex.flex-wrap.gap-3 a.px-4.py-2 { padding: 0.35rem 0.65rem !important; font-size: 0.7rem !important; }
  .flex.flex-wrap.gap-10 { gap: 1rem !important; }
  .flex.flex-wrap.gap-10 .text-3xl { font-size: 1.5rem !important; }
}

/* ═══════════════════════
   CONTACT PAGE SPECIFIC
   ═══════════════════════ */
@media (max-width: 767px) {
  .grid-cols-1.md\:grid-cols-4.gap-5 { gap: 0.75rem !important; }
  .grid-cols-1.md\:grid-cols-4.gap-5 .p-6 { padding: 0.75rem !important; }
  .grid-cols-1.md\:grid-cols-4.gap-5 .w-12.h-12 { width: 2.5rem !important; height: 2.5rem !important; }
  .p-10 { padding: 1.25rem !important; }
  .grid.md\:grid-cols-2.gap-5 { gap: 0.75rem !important; }
  h3.text-2xl { font-size: 1.25rem !important; }
  .grid-cols-1.md\:grid-cols-3.gap-8 .p-8 { padding: 1rem !important; }
  .w-full.h-\[460px\] { height: 280px !important; }
  .px-7.py-5 { padding: 0.75rem 1rem !important; }
  .faq-item button span { font-size: 0.85rem !important; }
  .space-y-3 a.flex.items-center.gap-4 { padding: 0.75rem !important; }
  .bg-slate-900.rounded-2xl.p-6 { padding: 1rem !important; }
  .bg-slate-900.rounded-2xl.p-6 p.text-4xl { font-size: 1.75rem !important; }
}

/* ═══════════════════════
   TRACK PAGE SPECIFIC
   ═══════════════════════ */
@media (max-width: 767px) {
  .flex.items-center.justify-between.mb-8 { flex-direction: column !important; align-items: flex-start !important; gap: 0.75rem !important; }
  .p-6.lg\:p-8 { padding: 1rem !important; }
  h2.text-3xl.lg\:text-4xl { font-size: 1.25rem !important; word-break: break-all !important; }
  .grid.lg\:grid-cols-3.gap-6 { gap: 0.75rem !important; }
  .grid.grid-cols-2.gap-3 { gap: 0.5rem !important; }
  .grid.grid-cols-2.gap-3 .p-3 { padding: 0.5rem !important; }
  .grid.grid-cols-2.gap-3 .rounded-xl.p-3 p.text-xs { font-size: 0.55rem !important; }
  .grid.grid-cols-2.gap-3 .rounded-xl.p-3 p.text-sm { font-size: 0.7rem !important; }
  .grid.grid-cols-4.divide-x .px-4.py-3 { padding: 0.5rem !important; }
  .grid.grid-cols-4.divide-x p.text-xs { font-size: 0.6rem !important; }
  .grid.sm\:grid-cols-2.gap-4 { gap: 0.75rem !important; }
  .grid.sm\:grid-cols-2.gap-4 .p-5 { padding: 0.75rem !important; }
  .h-60 { height: 12rem !important; }
  .px-6.py-4 { padding: 0.65rem 0.75rem !important; }
  .bg-gradient-to-br.from-orange-500.to-orange-600.p-6 { padding: 1rem !important; }
  .bg-slate-50.rounded-2xl.p-5 { padding: 0.75rem !important; }
  .relative.pl-8 { padding-left: 1.75rem !important; }
  .relative.pl-8 span.text-sm { font-size: 0.8rem !important; }
  .max-w-6xl.mx-auto.px-4.sm\:px-6.lg\:px-8.py-8 { padding-top: 1rem !important; padding-bottom: 1rem !important; padding-left: 0.75rem !important; padding-right: 0.75rem !important; }
  .max-w-lg.mx-auto.mt-20 { margin-top: 2rem !important; }
  .max-w-lg.mx-auto.mt-20 .p-10 { padding: 1.25rem !important; }
  .flex.justify-center.gap-3 { flex-direction: column !important; gap: 0.5rem !important; }
  .flex.justify-center.gap-3 a { width: 100% !important; justify-content: center !important; }
  .grid.sm\:grid-cols-2.gap-6.items-center { grid-template-columns: 1fr !important; }
}

/* ── FLOATING LANGUAGE WIDGET ── */
@media (max-width: 480px) {
  #float-lang-wrap { bottom: 0.75rem !important; left: 0.75rem !important; }
  #float-lang-btn { padding: 0.5rem 0.65rem !important; border-radius: 10px !important; }
  #float-lang-panel { width: calc(100vw - 1.5rem) !important; max-width: 300px !important; border-radius: 14px !important; }
}

/* ── BACK TO TOP ── */
@media (max-width: 480px) {
  #back-to-top { width: 2.5rem !important; height: 2.5rem !important; bottom: 1rem !important; right: 1rem !important; }
}

/* ── SAFE AREA PADDING ── */
@supports (padding: env(safe-area-inset-bottom)) {
  #float-lang-wrap { bottom: calc(1.25rem + env(safe-area-inset-bottom)) !important; left: calc(1.25rem + env(safe-area-inset-left)) !important; }
  #back-to-top { bottom: calc(2rem + env(safe-area-inset-bottom)) !important; right: calc(2rem + env(safe-area-inset-right)) !important; }
}

/* ── TOUCH TARGET IMPROVEMENTS ── */
@media (max-width: 767px) {
  a, button, .cursor-pointer { min-height: 44px; display: inline-flex; align-items: center; }
  input, select, textarea { font-size: 16px !important; }
}

/* ── MARQUEE ── */
@media (max-width: 767px) {
  .animate-marquee .text-2xl { font-size: 1rem !important; }
  .animate-marquee .gap-16 { gap: 2rem !important; }
  .animate-marquee i.h-8.w-8 { width: 1.25rem !important; height: 1.25rem !important; }
}

/* ── DECORATIVE BG ── */
@media (max-width: 767px) {
  .absolute.top-0.right-0.w-1\/2.h-full { width: 100% !important; border-radius: 0 !important; opacity: 0.3 !important; }
}

/* ── TABLET NAV DROPDOWN ── */
@media (min-width: 768px) and (max-width: 1023px) {
  .nav-dropdown { min-width: 180px; }
}

/* ── HERO SLIDER CONTROLS ── */
@media (max-width: 767px) {
  .absolute.bottom-8.left-4.right-4 { bottom: 1rem !important; }
  .absolute.bottom-8.left-4.right-4 button.p-4 { padding: 0.65rem !important; }
  .absolute.bottom-8.left-4.right-4 button.p-4 i { width: 1rem !important; height: 1rem !important; }
}

/* ── TRACKING SECTION CONTAINER ── */
@media (max-width: 767px) {
  .p-8.md\:p-12 { padding: 1rem !important; }
  .flex-col.md\:flex-row.md\:items-center.justify-between.gap-4.mb-8 { gap: 0.5rem !important; }
  .flex-col.md\:flex-row.md\:items-center.justify-between.gap-4.mb-8 h2.text-2xl { font-size: 1.25rem !important; }
  .bg-slate-800.p-1.rounded-xl.w-fit.mb-8 { margin-bottom: 1rem !important; }
  .flex.gap-1.bg-slate-800.p-1.rounded-xl { flex-wrap: wrap; }
}

/* ── VISION/MISSION ── */
@media (max-width: 767px) {
  .grid.md\:grid-cols-2.gap-8 .p-10 { padding: 1.25rem !important; }
  .grid.md\:grid-cols-2.gap-8 h2.text-3xl { font-size: 1.25rem !important; }
}

/* ── CORE VALUES ── */
@media (max-width: 767px) {
  .grid-cols-1.md\:grid-cols-3.gap-8 .p-8 { padding: 1rem !important; }
  .grid-cols-1.md\:grid-cols-3.gap-8 h3.text-xl { font-size: 1rem !important; }
  .grid-cols-1.md\:grid-cols-3.gap-8 .w-14.h-14 { width: 2.5rem !important; height: 2.5rem !important; margin-bottom: 0.75rem !important; }
}

/* ── TRACKING MAP PINS ── */
@media (max-width: 767px) {
  .absolute.top-\[72\%\].left-\[6\%\] { top: 70% !important; left: 4% !important; }
  .absolute.top-\[45\%\].left-\[52\%\] { top: 42% !important; left: 50% !important; }
  .absolute.top-\[38\%\].left-\[94\%\] { top: 35% !important; left: 92% !important; }
  .absolute .px-2.py-1 { font-size: 0.55rem !important; padding: 0.2rem 0.4rem !important; }
}

/* ── CONTACT MAP PINS ── */
@media (max-width: 767px) {
  .absolute.top-\[38\%\].left-\[22\%\] { top: 35% !important; left: 20% !important; }
  .absolute.top-\[28\%\].left-\[47\%\] { top: 25% !important; left: 45% !important; }
  .absolute.top-\[35\%\].left-\[55\%\] { top: 32% !important; left: 53% !important; }
  .absolute.top-\[38\%\].left-\[62\%\] { top: 35% !important; left: 60% !important; }
  .absolute.top-\[52\%\].left-\[75\%\] { top: 50% !important; left: 73% !important; }
  .absolute.top-\[58\%\].left-\[30\%\] { top: 55% !important; left: 28% !important; }
  .w-4.h-4 { width: 0.6rem !important; height: 0.6rem !important; }
}

/* ── TRACKING TOAST ── */
@media (max-width: 767px) {
  #toast { top: 1rem !important; left: 0.5rem !important; right: 0.5rem !important; transform: none !important; }
  #toast > div { padding: 0.75rem 1rem !important; font-size: 0.8rem !important; }
}

/* ── PRINT OPTIMIZATION ── */
@media print {
  .no-print { display: none !important; }
  .print-area { display: block !important; }
  body { background: #fff !important; }
}