/* =============================================
   YI SHIPPING — COMPLETE STYLESHEET v5.0
   Fully responsive · All sections covered
   ============================================= */

@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Rajdhani:wght@400;500;600;700&family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700;1,9..40,400&display=swap');

/* ============================================= 
   CSS VARIABLES
   ============================================= */
:root {
  --primary: #071F38;
  --primary-mid: #0B2A4A;
  --primary-light: #123a5e;
  --red: #A8151F;
  --red-dark: #8A0F18;
  --red-light: #C8202F;
  --red-muted: rgba(168,21,31,0.08);
  --white: #FFFFFF;
  --off-white: #F5F7FA;
  --gray: #6C757D;
  --gray-light: #E4E8EE;
  --dark: #040F1D;
  --text: #1E2D3D;
  --border: rgba(7,31,56,0.10);
  --shadow: 0 20px 60px rgba(7,31,56,0.14);
  --shadow-sm: 0 4px 20px rgba(7,31,56,0.07);
  --shadow-md: 0 10px 34px rgba(7,31,56,0.12);
  --shadow-red: 0 10px 36px rgba(168,21,31,0.22);
  --radius: 12px;
  --radius-lg: 20px;
  --transition: all 0.38s cubic-bezier(0.25,0.46,0.45,0.94);
  --transition-fast: all 0.18s ease;
  --nav-h: 72px;
}

/* ============================================= 
   RESET & BASE
   ============================================= */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; font-size:16px; }
body { font-family:'DM Sans',sans-serif; color:var(--text); background:var(--white); overflow-x:hidden; line-height:1.7; }
h1,h2,h3,h4,h5 { font-family:'Rajdhani',sans-serif; font-weight:700; line-height:1.2; color:var(--primary); }
a { text-decoration:none; color:inherit; transition:var(--transition); }
img { max-width:100%; display:block; }
ul { list-style:none; }
button { cursor:pointer; border:none; background:none; font-family:inherit; }
select { font-family:inherit; }

/* ============================================= 
   ICON GLOW ANIMATION
   ============================================= */
@keyframes iconGlowPulse {
  0%,100% { box-shadow:0 0 12px rgba(168,21,31,0.25),inset 0 0 8px rgba(168,21,31,0.1); }
  50%      { box-shadow:0 0 24px rgba(168,21,31,0.4),inset 0 0 12px rgba(168,21,31,0.15); }
}
.warehouse-icon,.why-card-icon,.feature-icon,.service-icon,.icon-box,
.about-feature-icon,.tracking-info-icon,.tracking-feature-icon {
  animation: iconGlowPulse 2.8s ease-in-out infinite;
}

/* ============================================= 
   PRELOADER
   ============================================= */
#preloader {
  position:fixed; inset:0; background:#fff; z-index:99999;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  transition:opacity 0.9s ease, visibility 0.9s ease;
}
#preloader.hidden { opacity:0; visibility:hidden; pointer-events:none; }

.preloader-ring-wrap { position:relative; width:160px; height:160px; display:flex; align-items:center; justify-content:center; }
.preloader-logo-circle {
  width:108px; height:108px; border-radius:50%; background:var(--primary);
  display:flex; align-items:center; justify-content:center; z-index:2; position:relative;
  animation:preloaderPulse 2s ease-in-out infinite;
}
.preloader-logo-circle img { width:72px; height:72px; object-fit:contain; filter:brightness(0) invert(1); }
.preloader-logo-text-fallback { font-family:'Bebas Neue',cursive; font-size:2.2rem; color:white; }

.preloader-orbit { position:absolute; inset:0; border-radius:50%; animation:orbitSpin 2.2s linear infinite; }
.preloader-orbit-2 { animation:orbitSpin 3.8s linear infinite reverse; }
.preloader-dot {
  position:absolute; width:11px; height:11px; background:var(--red);
  border-radius:50%; box-shadow:0 0 10px rgba(168,21,31,0.65);
}
.preloader-dot:nth-child(1){top:0;left:50%;transform:translateX(-50%);}
.preloader-dot:nth-child(2){top:15%;right:5%;}
.preloader-dot:nth-child(3){top:50%;right:0;transform:translateY(-50%);}
.preloader-dot:nth-child(4){bottom:15%;right:5%;}
.preloader-dot:nth-child(5){bottom:0;left:50%;transform:translateX(-50%);}
.preloader-dot:nth-child(6){bottom:15%;left:5%;}
.preloader-dot:nth-child(7){top:50%;left:0;transform:translateY(-50%);}
.preloader-dot:nth-child(8){top:15%;left:5%;}
.preloader-orbit-2 .preloader-dot { width:7px; height:7px; background:var(--primary); box-shadow:0 0 7px rgba(7,31,56,0.4); }

.preloader-text { margin-top:26px; font-family:'Bebas Neue',cursive; font-size:1.9rem; letter-spacing:7px; color:var(--primary); }
.preloader-text span { color:var(--red); }
.preloader-tagline { font-size:0.68rem; color:var(--gray); letter-spacing:3px; text-transform:uppercase; margin-top:4px; }
.preloader-progress { width:170px; height:3px; background:var(--gray-light); border-radius:99px; margin-top:18px; overflow:hidden; }
.preloader-progress-fill { height:100%; background:linear-gradient(90deg,var(--primary),var(--red)); border-radius:99px; animation:preloaderBar 2.8s ease forwards; }

@keyframes preloaderBar    { from{width:0} to{width:100%} }
@keyframes preloaderPulse  { 0%,100%{transform:scale(1);box-shadow:0 0 0 5px rgba(7,31,56,0.1)} 50%{transform:scale(1.06);box-shadow:0 0 0 10px rgba(7,31,56,0.07),0 0 55px rgba(168,21,31,0.22);} }
@keyframes orbitSpin       { from{transform:rotate(0deg)} to{transform:rotate(360deg)} }

/* Custom Cursor */
.cursor-dot  { width:8px;height:8px;background:var(--red);border-radius:50%;position:fixed;pointer-events:none;z-index:9998;transform:translate(-50%,-50%);transition:transform 0.1s; }
.cursor-ring { width:34px;height:34px;border:2px solid var(--red);border-radius:50%;position:fixed;pointer-events:none;z-index:9998;transform:translate(-50%,-50%);transition:all 0.18s ease;opacity:0.45; }
@media(max-width:768px){ .cursor-dot,.cursor-ring { display:none; } }

/* ============================================= 
   LAYOUT UTILITIES
   ============================================= */
.container   { max-width:1280px; margin:0 auto; padding:0 30px; }
.section-pad { padding:80px 0; }
.section-divider { height:1px; background:linear-gradient(90deg,transparent,var(--border),transparent); margin:0; }

.section-header { text-align:center; margin-bottom:10px; }
.section-tag {
  display:inline-block; font-size:0.75rem; text-transform:uppercase;
  font-weight:700; letter-spacing:2px; color:var(--red);
  padding:6px 12px; background:var(--red-muted); border-radius:99px; margin-bottom:12px;
}
.section-title { font-size:clamp(1.7rem,3.5vw,2.6rem); color:var(--primary); margin-bottom:16px; line-height:1.2; }
.section-desc  { font-size:0.95rem; color:var(--gray); max-width:700px; margin:0 auto 50px; line-height:1.8; }
.separator     { width:60px; height:3px; background:var(--red); margin:16px auto 20px; border-radius:99px; }

.btn-primary-main {
  display:inline-flex; align-items:center; gap:8px;
  padding:10px 22px; background:var(--red); color:white;
  border-radius:8px; font-size:0.88rem; font-weight:700;
  transition:all 0.3s ease; border:none; cursor:pointer;
  box-shadow:0 4px 14px rgba(168,21,31,0.25);
}
.btn-primary-main:hover { background:var(--red-dark); transform:translateY(-2px); box-shadow:0 6px 20px rgba(168,21,31,0.35); }

/* ============================================= 
   SCROLL ANIMATIONS
   ============================================= */
.reveal,.reveal-left,.reveal-right,.reveal-scale,.stagger-item {
  opacity:0; will-change:transform,opacity;
  transition:opacity 0.7s cubic-bezier(0.16,1,0.3,1), transform 0.7s cubic-bezier(0.16,1,0.3,1);
}
.reveal       { transform:translateY(42px); }
.reveal-left  { transform:translateX(-52px); }
.reveal-right { transform:translateX(52px); }
.reveal-scale { transform:scale(0.86) translateY(20px); }
.stagger-item { transform:translateY(38px); }
.reveal.in-view,.reveal-left.in-view,.reveal-right.in-view,
.reveal-scale.in-view,.stagger-item.in-view { opacity:1; transform:none; }

/* ============================================= 
   NAVBAR
   ============================================= */
.navbar { position:fixed; top:0; left:0; right:0; z-index:1000; padding:18px 0; transition:var(--transition); }
.navbar.scrolled { background:var(--primary); padding:12px 0; box-shadow:0 4px 40px rgba(0,0,0,0.28); }

.nav-container {
  max-width:1280px; margin:0 auto; padding:0 30px;
  display:flex; align-items:center; justify-content:space-between;
}
.nav-logo { display:flex; align-items:center; gap:10px; }
.nav-logo-img { height:40px; width:auto; filter:brightness(0) invert(1); transition:var(--transition); }
.nav-logo:hover .nav-logo-img { transform:scale(1.05); }

.nav-menu { display:flex; align-items:center; gap:2px; }
.nav-link {
  color:rgba(255,255,255,0.82); font-weight:400; font-size:0.82rem;text-transform:uppercase;
  padding:7px 13px; border-radius:8px; transition:var(--transition); position:relative;
}
.nav-link::after {
  content:''; position:absolute; bottom:3px; left:50%; right:50%;
  height:2px; background:var(--red); transition:all 0.3s ease; border-radius:2px;
}
.nav-link:hover::after,.nav-link.active::after { left:13px; right:13px; }
.nav-link:hover,.nav-link.active { color:white; }

/* Shop link — no outline */
.nav-shop { border:none !important; }
.nav-shop::after { display:none !important; }
.nav-shop:hover { background:rgba(168,21,31,0.12) !important; }

.nav-cta { background:var(--red) !important; color:white !important; padding:8px 18px !important; border-radius:8px; font-weight:700; }
.nav-cta::after { display:none !important; }
.nav-cta:hover { background:var(--red-dark) !important; transform:translateY(-2px); box-shadow:var(--shadow-red); }

/* Hamburger — darker so icon is visible */
.hamburger {
  display:none; flex-direction:column; gap:5px; cursor:pointer; padding:8px;
  background:rgba(7,31,56,0.75) !important;
  border:1px solid rgba(255,255,255,0.18) !important;
  border-radius:8px;
}
.hamburger span { display:block; width:24px; height:2px; background:white; border-radius:2px; transition:var(--transition); }
.hamburger.open span:nth-child(1) { transform:rotate(45deg) translate(5px,5px); }
.hamburger.open span:nth-child(2) { opacity:0; }
.hamburger.open span:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px); }

@media(max-width:900px) {
  .nav-menu { display:none; }
  .hamburger { display:flex; }
}
@media(max-width:480px) {
  .nav-container { padding:0 16px; }
}

/* ============================================= 
   MOBILE MENU
   ============================================= */
.mobile-menu {
  position:fixed; left:-100%; top:0; width:85%; max-width:340px; height:100vh;
  background:var(--primary); z-index:999;
  transition:left 0.4s cubic-bezier(0.25,0.46,0.45,0.94);
  overflow-y:auto; padding-top:80px; padding-bottom:40px;
  box-shadow:6px 0 30px rgba(0,0,0,0.3);
}
.mobile-menu.open { left:0; }
.mobile-menu-close {
  position:absolute; top:20px; right:20px;
  width:36px; height:36px; background:rgba(255,255,255,0.1);
  border:none; border-radius:50%; font-size:1.2rem; color:white;
  cursor:pointer; display:flex; align-items:center; justify-content:center;
  transition:var(--transition);
}
.mobile-menu-close:hover { transform:rotate(90deg); background:var(--red); }
.mobile-menu .nav-link {
  color:rgba(255,255,255,0.78); padding:14px 24px; display:block;
  border-bottom:1px solid rgba(255,255,255,0.07); font-size:1rem;
  border-radius:0;
}
.mobile-menu .nav-link:hover,.mobile-menu .nav-link.active { background:rgba(255,255,255,0.08); color:white; }
.mobile-menu .nav-link::after { display:none; }

/* ============================================= 
   HERO
   ============================================= */
.hero {
  position:relative; height:100vh; min-height:620px; overflow:hidden;
  display:flex; align-items:center; justify-content:center; background:#071F38;
}

.hero-slides { position:absolute; inset:0; }
.hero-slide {
  position:absolute; inset:0; opacity:0;
  transition:opacity 0.9s ease;
  background-size:cover; background-position:center;
}
.hero-slide.active { opacity:1; }
.hero-slide::before {
  content:''; position:absolute; inset:0;
  background:linear-gradient(135deg,rgba(7,31,56,0.72) 0%,rgba(7,31,56,0.5) 55%,rgba(168,21,31,0.15) 100%);
}

/* Mobile — wider overlay for text readability */
@media(max-width:768px) {
  .hero-slide::before {
    background:linear-gradient(135deg,rgba(7,31,56,0.88) 0%,rgba(7,31,56,0.76) 70%,rgba(7,31,56,0.5) 100%);
  }
}

.hero-content {
  position:relative; z-index:10; max-width:860px; text-align:center;
  padding:60px 24px; animation:heroFadeIn 1s ease forwards;
}
@keyframes heroFadeIn { from{opacity:0;transform:translateY(30px)} to{opacity:1;transform:translateY(0)} }

.hero-title {
  font-family:'Bebas Neue',cursive;
  font-size:clamp(2rem,6vw,4rem);
  color:white; line-height:1.12; margin-bottom:20px;
  text-shadow:0 4px 20px rgba(0,0,0,0.4);
  animation:heroTitleIn 0.9s ease 0.2s both;
}
@keyframes heroTitleIn { from{opacity:0;transform:translateY(-40px)} to{opacity:1;transform:translateY(0)} }

.hero-subtitle {
  font-size:clamp(0.9rem,1.8vw,1.1rem);
  color:rgba(255,255,255,0.88); line-height:1.8; margin-bottom:36px;
  max-width:640px; margin-left:auto; margin-right:auto;
  text-shadow:0 2px 10px rgba(0,0,0,0.3);
  animation:heroSubIn 0.8s ease 0.45s both;
}
@keyframes heroSubIn { from{opacity:0} to{opacity:1} }

.hero-buttons { animation:heroBtnIn 0.8s cubic-bezier(0.34,1.56,0.64,1) 0.6s both; }
@keyframes heroBtnIn { from{opacity:0;transform:scale(0.75) translateY(20px)} to{opacity:1;transform:scale(1) translateY(0)} }

.hero-buttons .btn-primary-main {
  padding:13px 30px; font-size:0.92rem;
  box-shadow:0 12px 40px rgba(168,21,31,0.35);
}
.hero-buttons .btn-primary-main:hover { transform:translateY(-4px); box-shadow:0 16px 48px rgba(168,21,31,0.45); }

.hero-dots {
  position:absolute; bottom:36px; left:50%; transform:translateX(-50%);
  z-index:20; display:flex; gap:10px;
}
.hero-dot {
  width:10px; height:10px; border-radius:50%;
  background:rgba(255,255,255,0.38); cursor:pointer; transition:all 0.3s ease;
}
.hero-dot.active { background:var(--red); width:30px; border-radius:99px; }

.hero-shape {
  position:absolute; bottom:0; left:0; right:0; z-index:5;
  width:100%; height:70px; pointer-events:none;
}

@media(max-width:768px) {
  .hero { min-height:540px; }
  .hero-content { padding:40px 20px; }
  .hero-title { font-size:clamp(1.8rem,8vw,2.8rem); }
}
@media(max-width:480px) {
  .hero-title { font-size:clamp(1.6rem,9vw,2.2rem); }
  .hero-subtitle { font-size:0.88rem; }
}

/* ============================================= 
   TICKER
   ============================================= */
.ticker-section { background:var(--primary); overflow:hidden; padding:18px 0; }
.ticker-inner {
  display:flex; align-items:center; gap:64px;
  animation:tickerScroll 24s linear infinite; white-space:nowrap;
}
@keyframes tickerScroll { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }
.ticker-item {
  font-family:'Bebas Neue',cursive; font-size:clamp(0.95rem,2.5vw,1.3rem);
  color:white; text-transform:uppercase; letter-spacing:2px;
  display:flex; align-items:center; gap:14px; flex-shrink:0;
}
.ticker-item span { color:var(--red); }
.ticker-dot { width:5px; height:5px; border-radius:50%; background:rgba(255,255,255,0.3); flex-shrink:0; }

/* ============================================= 
   QUICK FEATURES (4 boxes after hero)
   ============================================= */
.features-section {
  background:var(--off-white);
  padding:0;
  border-bottom:1px solid var(--border);
}
.features-row {
  max-width:1280px; margin:0 auto; padding:0 30px;
  display:grid; grid-template-columns:repeat(4,1fr);
}
.feature-item {
  display:flex; flex-direction:column; align-items:center; text-align:center;
  padding:30px 20px; gap:12px;
  border-right:1px solid var(--border);
  transition:all 0.35s ease;
}
.feature-item:last-child { border-right:none; }
.feature-item:hover { background:var(--white); }
.feature-svg { width:52px; height:52px; flex-shrink:0; }
.feature-item h3 { font-size:0.92rem; color:var(--primary); margin-bottom:4px; }
.feature-item p  { font-size:0.78rem; color:var(--gray); line-height:1.55; }

@media(max-width:900px) {
  .features-row { grid-template-columns:repeat(2,1fr); }
  .feature-item:nth-child(2) { border-right:none; }
  .feature-item:nth-child(1),
  .feature-item:nth-child(2) { border-bottom:1px solid var(--border); }
}
@media(max-width:480px) {
  .features-row { grid-template-columns:1fr; padding:0 16px; }
  .feature-item { border-right:none !important; border-bottom:1px solid var(--border); }
  .feature-item:last-child { border-bottom:none; }
}

/* ============================================= 
   ABOUT
   ============================================= */
.about-grid { display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; }
.about-image-wrap { position:relative; border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow); }
.about-img-main { width:100%; display:block; }
.about-img-badge {
  position:absolute; bottom:20px; right:20px;
  background:var(--red); color:white; padding:14px 22px;
  border-radius:12px; font-weight:700; font-size:0.9rem; text-align:center;
  box-shadow:0 10px 40px rgba(168,21,31,0.35);
}
.about-img-badge .num { font-family:'Bebas Neue',cursive; font-size:2.2rem; line-height:1; }
.about-img-badge .lbl { font-size:0.72rem; opacity:0.85; }

.about-tag { margin-bottom:4px; }
.about-title { font-size:clamp(1.5rem,2.8vw,2rem); color:var(--primary); margin-bottom:16px; }
.about-text  { color:var(--gray); font-size:0.92rem; line-height:1.78; margin-bottom:14px; }

.about-features { display:flex; flex-direction:column; gap:20px; margin:24px 0 28px; }
.about-feature  { display:flex; align-items:flex-start; gap:16px; }
.about-feature-icon {
  width:50px; height:50px; background:var(--red-muted);
  border-radius:12px; display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
}
.about-feature-text h4 { font-size:0.96rem; color:var(--primary); margin-bottom:4px; }
.about-feature-text p  { font-size:0.8rem; color:var(--gray); line-height:1.55; }

@media(max-width:900px) {
  .about-grid { grid-template-columns:1fr; gap:36px; }
  .about-img-badge { right:12px; bottom:12px; }
}
@media(max-width:480px) {
  .about-grid { gap:24px; }
}

/* ============================================= 
   SERVICES
   ============================================= */
.services { background:var(--off-white); }
.services-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }

.service-card {
  background:var(--white); border-radius:var(--radius-lg); overflow:hidden;
  box-shadow:var(--shadow-sm); border:1px solid var(--border); position:relative;
  transition:transform 0.32s cubic-bezier(0.34,1.56,0.64,1), box-shadow 0.32s ease !important;
}
.service-card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg,var(--red),var(--primary)); transform:scaleX(0); transition:transform 0.4s ease;
}
.service-card:hover::before { transform:scaleX(1); }
.service-card:hover { transform:translateY(-7px) !important; box-shadow:var(--shadow) !important; }

.service-card-img-wrap { overflow:hidden; height:185px; position:relative; }
.service-card-img      { width:100%; height:100%; object-fit:cover; transition:transform 0.5s ease; }
.service-card:hover .service-card-img { transform:scale(1.08); }

/* Image wipe effect */
.service-card-img-wrap::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,0.4) 50%,transparent 100%);
  opacity:0; pointer-events:none;
}
.service-card:hover .service-card-img-wrap::after {
  animation:imageWipe 0.8s ease forwards;
}
@keyframes imageWipe { from{opacity:0;transform:translateX(-100%)} to{opacity:1;transform:translateX(100%)} }

.service-card-body { padding:20px; }
.service-card-body h3 { font-size:1rem; color:var(--primary); margin-bottom:8px; }
.service-card-body p  { color:var(--gray); font-size:0.82rem; line-height:1.63; margin-bottom:12px; }
.service-link { display:inline-flex; align-items:center; gap:6px; color:var(--red); font-weight:700; font-size:0.8rem; transition:var(--transition); }
.service-link:hover { gap:10px; }

@media(max-width:900px) { .services-grid { grid-template-columns:1fr 1fr; } }
@media(max-width:560px) { .services-grid { grid-template-columns:1fr; } }

/* ============================================= 
   SHOP PREVIEW
   ============================================= */
.shop-preview { background:var(--white); }
.shop-preview-grid { display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:center; }
.shop-preview-left h2 { font-size:clamp(1.4rem,2.5vw,2rem); color:var(--primary); margin-bottom:12px; }
.shop-preview-left p  { color:var(--gray); line-height:1.78; margin-bottom:12px; font-size:0.92rem; }

.shop-feature-list { display:flex; flex-direction:column; gap:8px; margin:16px 0 24px; }
.shop-feature-item { display:flex; align-items:center; gap:9px; font-size:0.85rem; color:var(--text); }
.shop-feature-item i { color:var(--red); font-size:0.85rem; width:16px; }

.shop-carousel { position:relative; border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow); }
.carousel-track { display:flex; transition:transform 0.55s cubic-bezier(0.25,0.46,0.45,0.94); }
.carousel-slide { min-width:100%; height:360px; object-fit:cover; }

.carousel-arrows {
  position:absolute; top:50%; transform:translateY(-50%); width:100%;
  display:flex; justify-content:space-between; padding:0 12px; pointer-events:none;
}
.carousel-btn {
  width:38px; height:38px; border-radius:50%;
  background:rgba(255,255,255,0.92); font-size:0.9rem; cursor:pointer;
  color:var(--primary); display:flex; align-items:center; justify-content:center;
  pointer-events:all; transition:var(--transition); box-shadow:var(--shadow-sm);
}
.carousel-btn:hover { background:var(--red); color:white; transform:scale(1.1); }

.carousel-dots { position:absolute; bottom:12px; left:50%; transform:translateX(-50%); display:flex; gap:7px; }
.carousel-dot { width:7px; height:7px; border-radius:50%; background:rgba(255,255,255,0.5); cursor:pointer; transition:var(--transition); }
.carousel-dot.active { background:white; transform:scale(1.3); }

@media(max-width:900px) {
  .shop-preview-grid { grid-template-columns:1fr; gap:32px; }
  .carousel-slide { height:260px; }
}
@media(max-width:480px) {
  .carousel-slide { height:220px; }
}

/* ============================================= 
   WAREHOUSE / FACILITIES — LIGHT THEME
   ============================================= */
.warehouse-section { position:relative; overflow:hidden; background:var(--off-white); }
.warehouse-bg {
  position:absolute; inset:0;
  background-image:url('imgs/facilities.jpg');
  background-size:cover; background-position:center;
  background-attachment:fixed; opacity:0.15;
}
.warehouse-section > .container { position:relative; z-index:2; }

.warehouse-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:42px; }
.warehouse-card {
  background:rgba(255,255,255,0.9) !important;
  border:1px solid rgba(7,31,56,0.10) !important;
  backdrop-filter:blur(10px);
  border-radius:16px; padding:28px 20px; text-align:center;
  box-shadow:0 4px 24px rgba(7,31,56,0.07) !important;
  transition:transform 0.35s cubic-bezier(0.34,1.56,0.64,1), box-shadow 0.35s ease !important;
}
.warehouse-card:hover { transform:translateY(-8px) !important; box-shadow:var(--shadow) !important; }
.warehouse-card h4 { font-size:1rem; color:var(--primary) !important; margin:10px 0 8px; }
.warehouse-card p  { font-size:0.8rem; color:var(--gray) !important; line-height:1.6; }

.warehouse-icon {
  width:56px; height:56px;
  background:rgba(168,21,31,0.10) !important;
  border:1px solid rgba(168,21,31,0.2) !important;
  border-radius:50%; display:flex; align-items:center; justify-content:center;
  margin:0 auto; font-size:1.6rem;
}

.warehouse-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:48px; }
.warehouse-stat {
  text-align:center; padding:24px 16px;
  background:rgba(255,255,255,0.95) !important;
  border:1px solid rgba(7,31,56,0.09) !important;
  border-radius:14px; box-shadow:0 4px 18px rgba(7,31,56,0.05) !important;
  transition:transform 0.3s ease;
}
.warehouse-stat:hover { transform:translateY(-4px); }
.warehouse-stat .number { font-family:'Bebas Neue',cursive; font-size:2.2rem; color:var(--red); }
.warehouse-stat .label  { font-size:0.7rem; color:var(--gray) !important; text-transform:uppercase; letter-spacing:1px; margin-top:4px; }

@media(max-width:900px) {
  .warehouse-grid  { grid-template-columns:repeat(2,1fr); }
  .warehouse-stats { grid-template-columns:repeat(2,1fr); }
  .warehouse-bg    { background-attachment:scroll; }
}
@media(max-width:480px) {
  .warehouse-grid  { grid-template-columns:1fr; }
  .warehouse-stats { grid-template-columns:repeat(2,1fr); }
}

/* ============================================= 
   COUNTERS
   ============================================= */
.counters { background:var(--white); }
.counters-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:22px; margin-top:42px; }
.counter-card {
  background:var(--off-white); border:1px solid var(--border);
  border-radius:var(--radius-lg); padding:30px 16px; text-align:center;
  box-shadow:var(--shadow-sm); position:relative; overflow:hidden;
  transition:transform 0.35s cubic-bezier(0.34,1.56,0.64,1), box-shadow 0.35s ease !important;
}
.counter-card::before {
  content:''; position:absolute; bottom:0; left:0; right:0; height:4px;
  background:linear-gradient(90deg,var(--red),var(--red-dark)); transform:scaleX(0); transition:transform 0.4s ease;
}
.counter-card:hover::before { transform:scaleX(1); }
.counter-card:hover { transform:translateY(-6px) !important; box-shadow:var(--shadow) !important; }
.counter-number { font-family:'Bebas Neue',cursive; font-size:2.8rem; color:var(--red); line-height:1; }
.counter-label  { color:var(--gray); font-size:0.76rem; margin-top:6px; text-transform:uppercase; letter-spacing:1px; }

@media(max-width:768px) { .counters-grid { grid-template-columns:repeat(2,1fr); gap:16px; } }
@media(max-width:480px) { .counters-grid { grid-template-columns:repeat(2,1fr); gap:12px; } .counter-card { padding:22px 12px; } }

/* ============================================= 
   WHY CHOOSE US
   ============================================= */
.why-section { background:var(--off-white); }
.why-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:42px; }

.why-card {
  background:var(--white); border-radius:16px; padding:32px 24px 26px;
  border:1px solid var(--border); position:relative; overflow:hidden;
  box-shadow:0 2px 16px rgba(7,31,56,0.05); text-align:left;
  transition:transform 0.32s cubic-bezier(0.34,1.56,0.64,1), box-shadow 0.32s ease !important;
}
.why-card::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(135deg,var(--primary) 0%,#0d3460 100%);
  opacity:0; transition:opacity 0.38s ease; border-radius:16px;
}
.why-card:hover::after { opacity:1; }
.why-card > * { position:relative; z-index:2; }
.why-card:hover { transform:translateY(-7px) !important; }

.why-card-num {
  font-family:'Bebas Neue',cursive; font-size:3.2rem; line-height:1;
  color:var(--gray-light); margin-bottom:12px; transition:color 0.3s ease; letter-spacing:-1px;
}
.why-card:hover .why-card-num { color:rgba(255,255,255,0.08); }

.why-card-icon {
  width:46px; height:46px; border-radius:11px;
  background:var(--red-muted); display:flex; align-items:center; justify-content:center;
  margin-bottom:14px; transition:background 0.3s ease;
}
.why-card:hover .why-card-icon { background:rgba(255,255,255,0.15); }
.why-card-icon i { font-size:1.1rem; color:var(--red); transition:color 0.3s ease; }
.why-card:hover .why-card-icon i { color:#ff8f96; }

.why-card h3 { font-size:1rem; color:var(--primary); margin-bottom:8px; transition:color 0.3s ease; }
.why-card p  { color:var(--gray); font-size:0.82rem; line-height:1.65; transition:color 0.3s ease; }
.why-card:hover h3,.why-card:hover p { color:rgba(255,255,255,0.9); }

@media(max-width:900px) { .why-grid { grid-template-columns:1fr 1fr; } }
@media(max-width:560px) { .why-grid { grid-template-columns:1fr; } }

/* ============================================= 
   PROCESS
   ============================================= */
.process { background:var(--white); }
.process-steps {
  display:grid; grid-template-columns:repeat(4,1fr); gap:26px;
  text-align:center; position:relative; margin-top:50px;
}
.process-steps::before {
  content:''; position:absolute; top:40px; left:12%; width:76%; height:2px;
  background:linear-gradient(90deg,var(--red),rgba(7,31,56,0.25)); z-index:0;
}
.process-step { position:relative; z-index:1; }

.step-number {
  width:80px; height:80px; border-radius:50%;
  background:var(--off-white); border:3px solid var(--gray-light);
  display:flex; align-items:center; justify-content:center;
  font-family:'Bebas Neue',cursive; font-size:1.8rem; color:var(--primary);
  margin:0 auto 20px; box-shadow:0 0 0 8px var(--white);
  transition:all 0.4s cubic-bezier(0.34,1.56,0.64,1); position:relative; z-index:1;
}
.process-step:hover .step-number {
  background:var(--red); color:white; border-color:var(--red);
  transform:scale(1.15) rotate(-5deg);
  box-shadow:0 0 0 8px rgba(168,21,31,0.1),0 10px 30px rgba(168,21,31,0.3);
}
.process-step h3 { font-size:0.96rem; margin-bottom:8px; color:var(--primary); transition:color 0.3s; }
.process-step p  { color:var(--gray); font-size:0.8rem; max-width:200px; margin:0 auto; line-height:1.6; }
.process-step:hover h3 { color:var(--red); }

@media(max-width:768px) { .process-steps { grid-template-columns:1fr 1fr; gap:30px; } .process-steps::before { display:none; } }
@media(max-width:480px) { .process-steps { grid-template-columns:1fr; } }

/* ============================================= 
   REVIEWS / TESTIMONIALS
   ============================================= */
.reviews-section { position:relative; overflow:hidden; background:#040F1D; }
.reviews-bg {
  position:absolute; inset:0;
  background-image:url('https://images.unsplash.com/photo-1552664730-d307ca884978?w=1600&q=60');
  background-size:cover; background-position:center 30%;
  background-attachment:fixed; opacity:0.09;
}
@media(max-width:768px) { .reviews-bg { background-attachment:scroll; } }
.reviews-section > .container { position:relative; z-index:2; }
.reviews-section .section-tag   { background:rgba(168,21,31,0.2); color:#ff8f96; }
.reviews-section .section-title { color:white; }
.reviews-section .separator     { background:var(--red); }

.reviews-grid {
  display:grid; grid-template-columns:1fr 1.6fr; gap:40px; align-items:start; margin-top:48px;
}
.reviews-left {
  background:rgba(255,255,255,0.05) !important;
  border:1px solid rgba(255,255,255,0.1);
  border-radius:16px; padding:32px 28px;
  backdrop-filter:blur(10px);
}
.reviews-left h3 { color:white !important; font-size:1.3rem; margin-bottom:12px; }
.reviews-left p  { color:rgba(255,255,255,0.72) !important; font-size:0.85rem; line-height:1.7; margin-bottom:20px; }

.reviews-stars-row { display:flex; gap:4px; margin-bottom:14px; }
.reviews-stars-row span { color:#FFD700; font-size:1.4rem; }

.stat-row { display:flex; gap:16px; margin-bottom:24px; }
.stat-item { flex:1; text-align:center; background:rgba(255,255,255,0.07); border-radius:10px; padding:12px 8px; }
.stat-num  { font-family:'Bebas Neue',cursive; font-size:1.6rem; color:var(--red); }
.stat-lbl  { font-size:0.68rem; color:rgba(255,255,255,0.5); text-transform:uppercase; letter-spacing:1px; }

.rate-btn {
  display:inline-flex; align-items:center; gap:8px;
  background:white; color:var(--primary); padding:10px 20px;
  border-radius:8px; font-weight:700; font-size:0.84rem;
  transition:var(--transition);
}
.rate-btn:hover { background:var(--red); color:white; transform:translateY(-2px); }

/* Testimonial slider */
.testi-slider { position:relative; }
.testi-slide  { display:none; }
.testi-slide.active { display:block; animation:tFadeIn 0.6s ease; }
@keyframes tFadeIn { from{opacity:0;transform:translateY(16px)} to{opacity:1;transform:translateY(0)} }

.testi-card-v2 {
  background:rgba(255,255,255,0.07) !important;
  border:1px solid rgba(255,255,255,0.12) !important;
  backdrop-filter:blur(10px); border-radius:16px; padding:28px;
}
.testi-stars-v2 { color:#FFD700; font-size:1.1rem; margin-bottom:14px; }
.testi-text-v2  { color:rgba(255,255,255,0.75) !important; font-size:0.88rem; line-height:1.75; margin-bottom:20px; font-style:italic; }

.testi-author-v2 { display:flex; align-items:center; gap:14px; }
.testi-avatar-v2 { width:46px; height:46px; border-radius:50%; object-fit:cover; border:2px solid rgba(255,255,255,0.2); }
.testi-name-v2   { font-weight:700; font-size:0.9rem; color:white !important; }
.testi-role-v2   { font-size:0.76rem; color:rgba(255,255,255,0.5); }

.testi-nav { display:flex; gap:8px; margin-top:18px; }
.testi-nav-btn {
  width:10px; height:10px; border-radius:50%;
  background:rgba(255,255,255,0.25); border:none; cursor:pointer; transition:all 0.3s ease;
}
.testi-nav-btn.active { background:var(--red); width:28px; border-radius:99px; }

@media(max-width:900px) { .reviews-grid { grid-template-columns:1fr; gap:28px; } }

/* ============================================= 
   TRACKING INFO SECTION (replaces form)
   ============================================= */
.tracking-info-section { background:var(--off-white); }

.tracking-info-grid {
  display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:start; margin-top:50px;
}
.tracking-info-features { display:flex; flex-direction:column; gap:28px; }
.tracking-info-feature  { display:flex; align-items:flex-start; gap:18px; }

.tracking-info-icon {
  width:54px; height:54px; background:var(--red-muted); border-radius:14px;
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0; color:var(--red); font-size:1.3rem;
}
.tracking-info-feature h4 { font-size:0.98rem; color:var(--primary); margin-bottom:5px; }
.tracking-info-feature p  { font-size:0.82rem; color:var(--gray); line-height:1.6; }

.tracking-info-visual {
  background:var(--white); border-radius:20px; padding:36px 28px;
  border:1px solid var(--border); box-shadow:0 8px 40px rgba(7,31,56,0.08);
  text-align:center; position:sticky; top:100px;
}
.track-icon-main { font-size:3.2rem; color:var(--red); margin-bottom:18px; display:block; }
.tracking-info-visual h3 { font-size:1.2rem; color:var(--primary); margin-bottom:10px; }
.tracking-info-visual > p { font-size:0.85rem; color:var(--gray); line-height:1.7; margin-bottom:22px; }

.track-steps { display:flex; flex-direction:column; gap:10px; margin-bottom:26px; text-align:left; }
.track-step-item {
  display:flex; align-items:center; gap:12px;
  background:var(--off-white); border-radius:10px; padding:10px 14px;
  font-size:0.82rem; color:var(--text);
}
.track-step-item i { color:var(--red); width:18px; text-align:center; flex-shrink:0; }

.btn-track-cta {
  display:inline-flex; align-items:center; gap:9px;
  background:var(--primary); color:white;
  padding:12px 26px; border-radius:10px; font-weight:700; font-size:0.88rem;
  transition:all 0.3s ease;
}
.btn-track-cta:hover { background:var(--primary-light); transform:translateY(-2px); box-shadow:0 8px 24px rgba(7,31,56,0.25); }

@media(max-width:900px) {
  .tracking-info-grid { grid-template-columns:1fr; gap:36px; }
  .tracking-info-visual { position:static; }
}
@media(max-width:480px) {
  .tracking-info-visual { padding:24px 18px; }
}

/* ============================================= 
   BLOG
   ============================================= */
.blog { background:var(--white); }
.blog-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; margin-top:48px; }

.blog-card {
  background:var(--white); border-radius:var(--radius-lg); overflow:hidden;
  box-shadow:var(--shadow-sm); border:1px solid var(--border); cursor:pointer;
  transition:transform 0.32s cubic-bezier(0.34,1.56,0.64,1), box-shadow 0.32s ease !important;
}
.blog-card:hover { transform:translateY(-8px) scale(1.01) !important; box-shadow:var(--shadow) !important; }

.blog-img-wrap { height:200px; overflow:hidden; position:relative; }
.blog-img { width:100%; height:100%; object-fit:cover; transition:transform 0.5s ease; }
.blog-card:hover .blog-img { transform:scale(1.08); }

/* Blog wipe effect */
.blog-img-wrap::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,0.45) 50%,transparent 100%);
  opacity:0; pointer-events:none;
}
.blog-card:hover .blog-img-wrap::after { animation:imageWipe 0.8s ease forwards; }

.blog-body { padding:16px; }
.blog-cat  { display:inline-block; font-size:0.68rem; text-transform:uppercase; font-weight:700; color:var(--red); letter-spacing:1px; margin-bottom:8px; }

.blog-title {
  font-size:1rem; color:var(--primary); margin-bottom:8px; line-height:1.4;
  transition:color 0.3s; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
.blog-card:hover .blog-title { color:var(--red); }

.blog-excerpt { font-size:0.82rem; color:var(--gray); line-height:1.6; margin-bottom:12px; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }

.blog-meta { font-size:0.76rem; color:var(--gray); display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:6px; }
.blog-meta span { display:flex; align-items:center; gap:5px; }
.blog-read-more { color:var(--red); font-weight:700; display:flex; align-items:center; gap:4px; }

@media(max-width:900px) { .blog-grid { grid-template-columns:1fr 1fr; } }
@media(max-width:560px) { .blog-grid { grid-template-columns:1fr; } }

/* ============================================= 
   BLOG MODAL
   ============================================= */
.modal-overlay {
  position:fixed; inset:0; background:rgba(4,15,29,0.75);
  z-index:2000; display:flex; align-items:center; justify-content:center;
  opacity:0; visibility:hidden; transition:all 0.4s ease; padding:20px;
  backdrop-filter:blur(4px);
}
.modal-overlay.active { opacity:1; visibility:visible; }

.modal-box {
  background:var(--white); border-radius:var(--radius-lg);
  max-width:860px; width:100%; max-height:90vh; overflow-y:auto;
  animation:modalIn 0.5s cubic-bezier(0.34,1.56,0.64,1);
}
@keyframes modalIn { from{opacity:0;transform:scale(0.85) translateY(30px)} to{opacity:1;transform:scale(1) translateY(0)} }

/* FIX: Close button — dark blue/navy */
.modal-close {
  background:#071F38 !important; color:white !important;
  width:36px; height:36px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  border:none; cursor:pointer; font-size:1rem;
  position:absolute; top:16px; right:16px;
  transition:all 0.3s ease; z-index:10;
}
.modal-close:hover { background:#A8151F !important; transform:rotate(90deg); }

.modal-header-img { width:100%; height:280px; object-fit:cover; border-radius:var(--radius-lg) var(--radius-lg) 0 0; }
.modal-content-area { padding:30px 36px 36px; }
.modal-cat   { font-size:0.72rem; text-transform:uppercase; font-weight:700; color:var(--red); letter-spacing:1px; margin-bottom:10px; }
.modal-title { font-size:clamp(1.3rem,3vw,1.8rem); color:var(--primary); margin-bottom:10px; line-height:1.3; }
.modal-meta  { font-size:0.82rem; color:var(--gray); margin-bottom:22px; }
.modal-body  { font-size:0.92rem; color:var(--text); line-height:1.8; }
.modal-body h4 { font-size:1.1rem; color:var(--primary); margin:22px 0 10px; }
.modal-body p  { margin-bottom:14px; }

.modal-cta-area {
  margin-top:24px; padding-top:18px; border-top:1px solid var(--border);
  display:flex; gap:12px; flex-wrap:wrap; align-items:center;
}
.modal-cta-btn-wa {
  display:inline-flex; align-items:center; gap:8px;
  background:#25d366; color:white; padding:10px 20px;
  border-radius:8px; font-weight:700; font-size:0.84rem; transition:var(--transition);
}
.modal-cta-btn-wa:hover { background:#128C7E; transform:translateY(-2px); }

@media(max-width:600px) {
  .modal-content-area { padding:20px 20px 28px; }
  .modal-header-img { height:200px; }
}

/* ============================================= 
   CTA BANNER — NAVY, ONE BUTTON
   ============================================= */
.cta-banner { background:var(--primary); padding:68px 0; }
.cta-inner  {
  display:flex; align-items:center; justify-content:space-between;
  gap:30px; flex-wrap:wrap;
}
.cta-text h2 { font-size:clamp(1.5rem,3vw,2.1rem); color:white; margin-bottom:8px; }
.cta-text p  { color:rgba(255,255,255,0.6); font-size:0.9rem; }
.cta-actions { display:flex; gap:12px; flex-wrap:wrap; align-items:center; }

.btn-cta-primary {
  display:inline-flex; align-items:center; gap:8px;
  background:var(--red); color:white;
  padding:13px 28px; border-radius:10px; font-weight:700; font-size:0.9rem;
  transition:all 0.3s ease; border:none; cursor:pointer;
}
.btn-cta-primary:hover { background:var(--red-dark); transform:translateY(-2px); box-shadow:0 8px 24px rgba(168,21,31,0.35); }

@media(max-width:768px) { .cta-inner { flex-direction:column; text-align:center; } .cta-actions { justify-content:center; } }

/* ============================================= 
   QUOTE MODAL
   ============================================= */
.quote-modal-overlay {
  position:fixed; inset:0; background:rgba(4,15,29,0.75);
  z-index:2100; display:flex; align-items:center; justify-content:center;
  opacity:0; visibility:hidden; transition:all 0.4s ease;
  padding:20px; backdrop-filter:blur(5px);
}
.quote-modal-overlay.active { opacity:1; visibility:visible; }

.quote-modal {
  background:var(--white); border-radius:20px;
  width:100%; max-width:680px; padding:44px 40px;
  box-shadow:0 40px 80px rgba(0,0,0,0.18);
  animation:quoteModalIn 0.5s cubic-bezier(0.34,1.56,0.64,1);
  position:relative; max-height:90vh; overflow-y:auto;
}
@keyframes quoteModalIn { from{opacity:0;transform:scale(0.82) translateY(40px)} to{opacity:1;transform:scale(1) translateY(0)} }

.quote-modal-close-btn {
  position:absolute; top:18px; right:18px;
  width:38px; height:38px; background:var(--gray-light);
  border:none; border-radius:50%; display:flex; align-items:center; justify-content:center;
  cursor:pointer; font-size:1rem; color:var(--primary); transition:all 0.3s ease;
}
.quote-modal-close-btn:hover { background:var(--red); color:white; transform:rotate(90deg); }

.quote-modal h2 { font-size:1.7rem; color:var(--primary); margin-bottom:6px; }
.quote-modal-subtitle { color:var(--gray); margin-bottom:24px; font-size:0.88rem; }

.quote-form-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:14px; }
.quote-form-row.full { grid-template-columns:1fr; }
.quote-form-row label { display:block; font-size:0.8rem; font-weight:600; color:var(--primary); margin-bottom:5px; }

.quote-form-row input,
.quote-form-row textarea,
.quote-form-row select {
  width:100%; padding:10px 13px; border:1px solid var(--border);
  border-radius:8px; font-family:inherit; font-size:0.88rem;
  transition:all 0.3s ease; background:var(--off-white); color:var(--text);
}
.quote-form-row input:focus,
.quote-form-row textarea:focus,
.quote-form-row select:focus {
  outline:none; background:var(--white); border-color:var(--red);
  box-shadow:0 0 0 3px rgba(168,21,31,0.08);
}
.quote-form-row textarea { resize:vertical; min-height:90px; }

.quote-submit-btn {
  width:100%; padding:13px; background:var(--red); color:white;
  border:none; border-radius:9px; font-weight:700; font-size:0.92rem;
  cursor:pointer; transition:all 0.3s cubic-bezier(0.34,1.56,0.64,1); margin-top:8px;
}
.quote-submit-btn:hover { background:var(--red-dark); transform:translateY(-2px); box-shadow:0 8px 24px rgba(168,21,31,0.3); }
.quote-submit-btn:disabled { opacity:0.6; cursor:not-allowed; transform:none; }

@media(max-width:640px) {
  .quote-modal { padding:28px 20px 32px; }
  .quote-form-row { grid-template-columns:1fr; }
  .quote-modal h2 { font-size:1.4rem; }
}

/* ============================================= 
   POLICY MODALS
   ============================================= */
.policy-modal-overlay {
  position:fixed; inset:0; background:rgba(0,0,0,0.65); z-index:2050;
  display:flex; align-items:center; justify-content:center;
  opacity:0; visibility:hidden; transition:all 0.35s ease; padding:20px;
}
.policy-modal-overlay.active { opacity:1; visibility:visible; }

.policy-modal-box {
  background:var(--white); border-radius:var(--radius-lg);
  max-width:680px; width:100%; max-height:88vh; overflow-y:auto;
  box-shadow:0 30px 70px rgba(0,0,0,0.18); animation:modalIn 0.45s ease;
}
.policy-modal-header {
  display:flex; align-items:center; justify-content:space-between;
  padding:24px 30px; border-bottom:1px solid var(--border); position:sticky; top:0; background:var(--white); z-index:2;
}
.policy-modal-header h2 { font-size:1.3rem; color:var(--primary); }
.policy-modal-close {
  width:34px; height:34px; border-radius:50%; background:var(--gray-light);
  border:none; cursor:pointer; font-size:1rem; color:var(--primary);
  display:flex; align-items:center; justify-content:center; transition:var(--transition);
}
.policy-modal-close:hover { background:var(--red); color:white; transform:rotate(90deg); }

.policy-modal-body { padding:24px 30px; }
.policy-modal-body h3 { font-size:1rem; color:var(--primary); margin:18px 0 8px; }
.policy-modal-body p  { font-size:0.88rem; color:var(--gray); line-height:1.7; margin-bottom:10px; }

@media(max-width:480px) { .policy-modal-header,.policy-modal-body { padding-left:18px; padding-right:18px; } }

/* ============================================= 
   FOOTER
   ============================================= */
#site-footer { background:var(--primary); padding:64px 0 0; }
.footer-grid {
  display:grid; grid-template-columns:2fr 1fr 1fr 1.4fr; gap:40px;
  padding-bottom:48px;
}

.footer-brand-logo { margin-bottom:16px; }
.footer-logo-img   { height:44px; width:auto; filter:brightness(0) invert(1); }
.footer-desc { font-size:0.84rem; color:rgba(255,255,255,0.6); line-height:1.75; margin-bottom:20px; }

.footer-socials { display:flex; gap:10px; }
.social-btn {
  width:38px; height:38px; border-radius:50%;
  background:rgba(255,255,255,0.1); color:white !important;
  display:flex; align-items:center; justify-content:center; font-size:0.88rem;
  transition:all 0.3s ease;
}
.social-btn:hover { background:var(--red); transform:translateY(-3px); }

.footer-col h4 { color:white; margin-bottom:18px; font-size:0.96rem; letter-spacing:0.5px; }
.footer-col ul { display:flex; flex-direction:column; gap:10px; }
.footer-col ul a { color:rgba(255,255,255,0.6); font-size:0.84rem; display:flex; align-items:center; gap:7px; transition:var(--transition); }
.footer-col ul a:hover { color:var(--red); padding-left:4px; }
.footer-col ul a i { font-size:0.65rem; opacity:0.5; }

/* FIX: footer contact icons white */
.footer-contact-item { display:flex; align-items:flex-start; gap:12px; margin-bottom:14px; }
.footer-contact-icon { width:32px; flex-shrink:0; padding-top:2px; }
.footer-contact-icon i { color:rgba(255,255,255,0.7) !important; font-size:0.9rem; }
.footer-contact-icon .fa-whatsapp { color:#25d366 !important; }
.footer-contact-text { font-size:0.83rem; color:rgba(255,255,255,0.6); line-height:1.6; }
.footer-contact-text a { color:rgba(255,255,255,0.7); }
.footer-contact-text a:hover { color:var(--red); }

.footer-bottom {
  border-top:1px solid rgba(255,255,255,0.08);
  padding:22px 0; display:flex; align-items:center;
  justify-content:space-between; flex-wrap:wrap; gap:12px;
}
.footer-bottom p { font-size:0.78rem; color:rgba(255,255,255,0.45); }
.footer-bottom-links { display:flex; gap:20px; }
.footer-bottom-links a { font-size:0.78rem; color:rgba(255,255,255,0.45); }
.footer-bottom-links a:hover { color:var(--red); }

@media(max-width:1024px) {
  .footer-grid { grid-template-columns:1fr 1fr; gap:32px; }
}
@media(max-width:600px) {
  .footer-grid { grid-template-columns:1fr; gap:28px; }
  #site-footer { padding:44px 0 0; }
  .footer-bottom { flex-direction:column; text-align:center; }
}

/* ============================================= 
   FLOATING BUTTONS
   ============================================= */
.whatsapp-float {
  position:fixed; bottom:88px; right:24px; z-index:998;
  width:54px; height:54px; border-radius:50%; background:#25d366;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 24px rgba(37,211,102,0.4);
  transition:all 0.3s cubic-bezier(0.34,1.56,0.64,1);
}
.whatsapp-float:hover { transform:scale(1.12) translateY(-3px); box-shadow:0 10px 32px rgba(37,211,102,0.5); }

.back-to-top {
  position:fixed; bottom:24px; right:24px; z-index:998;
  width:46px; height:46px; border-radius:50%; background:var(--primary);
  display:flex; align-items:center; justify-content:center;
  color:white; font-size:1rem; cursor:pointer;
  box-shadow:0 6px 20px rgba(7,31,56,0.3);
  opacity:0; visibility:hidden; transition:all 0.3s ease; border:none;
}
.back-to-top.show { opacity:1; visibility:visible; }
.back-to-top:hover { background:var(--red); transform:translateY(-3px); }

@media(max-width:480px) {
  .whatsapp-float { width:48px; height:48px; bottom:78px; right:16px; }
  .back-to-top { width:42px; height:42px; bottom:20px; right:16px; }
}

/* ============================================= 
   FAQ (for tracking page compatibility)
   ============================================= */
.faq-question { cursor:pointer; padding:18px 0; display:flex; align-items:center; justify-content:space-between; font-size:0.96rem; font-weight:600; color:var(--primary); border-bottom:1px solid var(--border); }
.faq-answer   { display:none; padding:16px 0; font-size:0.88rem; color:var(--gray); line-height:1.75; }
.faq-question.open + .faq-answer,
.faq-answer.open { display:block; }

/* ============================================= 
   GLOBAL RESPONSIVE TWEAKS
   ============================================= */
@media(max-width:1024px) {
  .container   { padding:0 24px; }
  .section-pad { padding:64px 0; }
}
@media(max-width:768px) {
  .container   { padding:0 18px; }
  .section-pad { padding:52px 0; }
  .section-title { font-size:1.7rem; }
  .section-desc  { font-size:0.88rem; margin-bottom:36px; }
}
@media(max-width:480px) {
  .container   { padding:0 14px; }
  .section-pad { padding:44px 0; }
  .section-title { font-size:1.5rem; }
  .btn-primary-main { padding:10px 18px; font-size:0.84rem; }
}
/* ── GLOBAL: prevent iOS Safari zoom on input focus (font-size must be >=16px) ── */
@media (max-width: 900px) {
  input, select, textarea, button {
    font-size: 16px !important;
    touch-action: manipulation;
  }
}
/* Prevent double-tap zoom and pinch zoom on interactive elements globally */
a, button, [role="button"], label {
  touch-action: manipulation;
}
