/* ============================================================
   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);
  --nav-h:72px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;overflow-x:hidden;}
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;}

.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);}

.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 1.1s cubic-bezier(0.16,1,0.3,1),transform 1.1s cubic-bezier(0.16,1,0.3,1);
}
.reveal{transform:translateY(60px);}
.reveal-left{transform:translateX(-70px);}
.reveal-right{transform:translateX(70px);}
.reveal-scale{transform:scale(0.86) translateY(20px);}
.stagger-item{transform:translateY(50px) scale(0.95);transition:opacity 0.95s cubic-bezier(0.16,1,0.3,1),transform 0.95s cubic-bezier(0.16,1,0.3,1);}
.reveal.in-view,.reveal-left.in-view,.reveal-right.in-view,.reveal-scale.in-view,.stagger-item.in-view{opacity:1;transform:none;}

/* ============================================================
   PRELOADER — uses logo image
============================================================ */
#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:180px;height:180px;display:flex;align-items:center;justify-content:center;}
.preloader-logo-circle{
  width:110px;height:110px;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;
  border:3px solid rgba(168,21,31,0.4);
}
.preloader-logo-circle img{width:72px;height:72px;object-fit:contain;}
.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-tagline{font-size:0.68rem;color:var(--gray);letter-spacing:3px;text-transform:uppercase;margin-top:14px;}
.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 12px 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;}}

/* ============================================================
   NAVBAR — caps lock text, slightly larger, real logo
============================================================ */
.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:42px;width:auto;transition:var(--transition);}
.nav-logo:hover .nav-logo-img{transform:scale(1.05);}
.nav-logo-text-fallback{font-family:'Bebas Neue',cursive;font-size:1.6rem;letter-spacing:3px;color:white;}
.nav-logo-text-fallback span{color:var(--red);}
.nav-menu{display:flex;align-items:center;gap:2px;}
/* CAPS text, slightly larger */
.nav-link{
  color:rgba(255,255,255,0.85);
  font-weight:400;
  font-size:0.82rem;
  letter-spacing:1.5px;
  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;}
.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;box-shadow:0 4px 16px rgba(168,21,31,0.35);}
.nav-cta::after{display:none!important;}
.nav-cta:hover{background:var(--red-dark)!important;transform:translateY(-2px);}
.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);}
@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:0.82rem;letter-spacing:1.5px;text-transform:uppercase;border-radius:0;}
.mobile-menu .nav-link:hover{background:rgba(255,255,255,0.08);color:white;}
.mobile-menu .nav-link.active{background:rgba(168,21,31,0.18);color:white;border-left:3px solid var(--red);}
.mobile-menu .nav-link::after{display:none;}
.mobile-menu-quote{display:block;margin:20px 16px 0;padding:13px;background:var(--red);color:white;text-align:center;border-radius:8px;font-weight:700;font-size:0.95rem;}
.mobile-menu-quote:hover{background:var(--red-dark);color:white;}

/* ============================================================
   PAGE HERO — image more visible, massive shimmer animation
============================================================ */
.page-hero{position:relative;height:480px;display:flex;align-items:center;overflow:hidden;background:var(--primary);padding-top:var(--nav-h);}
.page-hero-bg{
  position:absolute;inset:0;
  background-image:url('../imgs/services/sea-shipping.jpg');
  background-size:cover;background-position:center;
  opacity:0.42; /* More visible */
  transition:transform 0.1s linear;
  transform:scale(1.08);
}
/* Lighter overlay so bg image shows through */
.page-hero::before{
  content:'';position:absolute;inset:0;z-index:1;
  background:linear-gradient(135deg,rgba(7,31,56,0.68) 0%,rgba(7,31,56,0.42) 55%,rgba(168,21,31,0.12) 100%);
}
/* MASSIVE shimmer animation */
.page-hero::after{
  content:'';position:absolute;inset:0;z-index:2;
  background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,0.18) 40%,rgba(255,255,255,0.32) 50%,rgba(255,255,255,0.18) 60%,transparent 100%);
  animation:heroShimmerMassive 3.5s ease-in-out infinite;
  pointer-events:none;
}
@keyframes heroShimmerMassive{
  0%{transform:translateX(-150%) skewX(-12deg);opacity:0;}
  20%{opacity:1;}
  80%{opacity:1;}
  100%{transform:translateX(250%) skewX(-12deg);opacity:0;}
}
.page-hero-content{position:relative;z-index:5;}
.breadcrumb{display:flex;align-items:center;gap:8px;font-size:0.82rem;color:rgba(255,255,255,0.55);margin-bottom:14px;}
.breadcrumb a{color:rgba(255,255,255,0.55);transition:color 0.3s;}
.breadcrumb a:hover{color:var(--red);}
.breadcrumb span{color:rgba(255,255,255,0.4);}
.page-title{font-family:'Bebas Neue',cursive;font-size:clamp(2.5rem,7vw,5rem);color:white;line-height:1;letter-spacing:2px;animation:pageTitleIn 1s cubic-bezier(0.16,1,0.3,1) 0.3s both;}
@keyframes pageTitleIn{from{opacity:0;transform:translateY(50px) skewY(3deg)}to{opacity:1;transform:translateY(0) skewY(0)}}
.page-subtitle{font-size:1.05rem;color:rgba(255,255,255,0.82);margin-top:14px;max-width:500px;line-height:1.7;animation:pageTitleIn 1s cubic-bezier(0.16,1,0.3,1) 0.5s both;}
.hero-shape{position:absolute;bottom:0;left:0;right:0;z-index:5;width:100%;height:60px;pointer-events:none;}

/* ============================================================
   WHO WE ARE — round image with expanding rings & year orbiter
============================================================ */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;}
/* Round image container with rings */
.about-image-round-wrap{
  position:relative;
  display:flex;align-items:center;justify-content:center;
  padding:60px;
}
.about-round-rings{
  position:absolute;top:50%;left:50%;
  transform:translate(-50%,-50%);
  pointer-events:none;
  z-index:1;
}
.about-ring{
  position:absolute;border-radius:50%;
  border:2px solid rgba(7,31,56,0.2);
  top:50%;left:50%;
  transform:translate(-50%,-50%);
  animation:ringPulse 3s ease-out infinite;
}
.about-ring:nth-child(1){width:320px;height:320px;animation-delay:0s;}
.about-ring:nth-child(2){width:380px;height:380px;animation-delay:1s;border-color:rgba(168,21,31,0.15);}
.about-ring:nth-child(3){width:440px;height:440px;animation-delay:2s;border-color:rgba(7,31,56,0.1);}
@keyframes ringPulse{
  0%{opacity:0.8;transform:translate(-50%,-50%) scale(0.85);}
  50%{opacity:0.4;}
  100%{opacity:0;transform:translate(-50%,-50%) scale(1.05);}
}

/* Round image itself */
.about-img-round{
  width:260px;height:260px;
  border-radius:50%;
  object-fit:cover;
  position:relative;z-index:2;
  box-shadow:0 20px 60px rgba(7,31,56,0.3),0 0 0 6px rgba(168,21,31,0.2);
  border:4px solid white;
  transition:transform 0.7s ease;
}
.about-image-round-wrap:hover .about-img-round{transform:scale(1.04);}

/* Year counter that orbits */
.about-year-orbiter{
  position:absolute;
  top:50%;left:50%;
  width:300px;height:300px;
  margin-left:-150px;margin-top:-150px;
  animation:yearOrbit 8s linear infinite;
  pointer-events:none;
  z-index:3;
}
.about-year-badge{
  position:absolute;
  top:-26px;left:50%;transform:translateX(-50%);
  background:var(--red);
  color:white;
  border-radius:12px;
  padding:10px 16px;
  text-align:center;
  box-shadow:0 6px 24px rgba(168,21,31,0.4);
  white-space:nowrap;
  animation:yearOrbitCounter 8s linear infinite; /* counter-rotate so text stays upright */
}
@keyframes yearOrbit{
  from{transform:rotate(0deg);}
  to{transform:rotate(360deg);}
}
@keyframes yearOrbitCounter{
  from{transform:translateX(-50%) rotate(0deg);}
  to{transform:translateX(-50%) rotate(-360deg);}
}
.about-year-badge .ynum{font-family:'Bebas Neue',cursive;font-size:1.9rem;line-height:1;display:block;}
.about-year-badge .ylbl{font-size:0.62rem;letter-spacing:1.5px;text-transform:uppercase;opacity:0.85;}

/* Secondary badge */
.about-img-badge-bottom{
  position:absolute;bottom:10px;right:20px;
  background:var(--primary);color:white;
  padding:10px 16px;border-radius:12px;
  font-weight:700;font-size:0.84rem;text-align:center;
  box-shadow:0 10px 30px rgba(7,31,56,0.35);
  z-index:4;
}
.about-img-badge-bottom .num{font-family:'Bebas Neue',cursive;font-size:1.8rem;line-height:1;}
.about-img-badge-bottom .lbl{font-size:0.66rem;opacity:0.78;}
.img-tag-top{position:absolute;top:16px;left:20px;z-index:4;background:rgba(7,31,56,0.88);backdrop-filter:blur(8px);color:white;padding:7px 13px;border-radius:8px;font-size:0.72rem;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;border:1px solid rgba(255,255,255,0.12);}

.about-tag{margin-bottom:6px;}
.about-title{font-size:clamp(1.5rem,2.8vw,2.1rem);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:18px;margin:22px 0 26px;}
.about-feature{display:flex;align-items:flex-start;gap:16px;}
.about-feature-icon{width:48px;height:48px;background:var(--red-muted);border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all 0.3s ease;}
.about-feature:hover .about-feature-icon{background:var(--red);transform:scale(1.08);}
.about-feature-icon i{color:var(--red);font-size:1.1rem;transition:color 0.3s;}
.about-feature:hover .about-feature-icon i{color:white;}
.about-feature-text h4{font-size:0.96rem;color:var(--primary);margin-bottom:3px;}
.about-feature-text p{font-size:0.8rem;color:var(--gray);line-height:1.55;}
.stat-mini-row{display:flex;gap:20px;margin-top:28px;flex-wrap:wrap;}
.stat-mini{text-align:center;padding:18px 24px;background:var(--off-white);border-radius:14px;border:1px solid var(--border);transition:all 0.3s ease;}
.stat-mini:hover{background:var(--primary);transform:translateY(-4px);box-shadow:var(--shadow);}
.stat-mini:hover .stat-mini-num,.stat-mini:hover .stat-mini-lbl{color:white!important;}
.stat-mini-num{font-family:'Bebas Neue',cursive;font-size:2.4rem;color:var(--red);line-height:1;}
.stat-mini-lbl{font-size:0.72rem;color:var(--gray);text-transform:uppercase;letter-spacing:1px;margin-top:4px;}
@media(max-width:900px){
  .about-grid{grid-template-columns:1fr;gap:36px;}
  .about-ring:nth-child(1){width:260px;height:260px;}
  .about-ring:nth-child(2){width:310px;height:310px;}
  .about-ring:nth-child(3){width:360px;height:360px;}
  .about-year-orbiter{width:240px;height:240px;margin-left:-120px;margin-top:-120px;}
}

/* ============================================================
   COMPANY PROFILE — white overlay, static bg, black text/icons,
   round profile image, left-to-right color sweep on bg
============================================================ */
.profile-section{
  position:relative;
  overflow:hidden;
}
/* Static background image */
.profile-section-bg{
  position:absolute;inset:0;
  background-image:url('https://images.unsplash.com/photo-1578575437130-527eed3abbec?w=1600&q=60');
  background-size:cover;
  background-position:center;
  background-attachment:fixed; /* static / parallax scroll */
  z-index:0;
}
/* White overlay — lighter so image shows through */
.profile-section-bg::after{
  content:'';
  position:absolute;inset:0;
  background:rgba(250, 250, 250, 0.99);
}
/* Left-to-right color sweep animation on the bg */
.profile-bg-sweep{
  position:absolute;inset:0;z-index:1;
  background:linear-gradient(90deg,transparent 0%,rgba(168,21,31,0.1) 50%,transparent 100%);
  animation:bgSweep 5s ease-in-out infinite;
  pointer-events:none;
}
@keyframes bgSweep{
  0%{transform:translateX(-100%);}
  100%{transform:translateX(100%);}
}
.profile-section .container{position:relative;z-index:2;}
.profile-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;}

/* Black text / icons on light bg */
.profile-text .section-tag{background:var(--red-muted);color:var(--red);}
.profile-text .section-title{color:var(--primary);}
.profile-text .separator{background:var(--red);}
.profile-para{color:var(--text);font-size:0.92rem;line-height:1.82;margin-bottom:14px;}
.profile-highlights{display:flex;flex-direction:column;gap:14px;margin-top:28px;}
/* Mirror containers with box-shadow, black content */
.profile-highlight{
  display:flex;align-items:center;gap:14px;
  background:rgba(255,255,255,0.88);
  border:1px solid rgba(7,31,56,0.1);
  border-radius:10px;padding:14px 18px;
  box-shadow:0 4px 20px rgba(7,31,56,0.1),0 1px 4px rgba(7,31,56,0.06);
  backdrop-filter:blur(4px);
  transition:all 0.3s ease;
}
.profile-highlight:hover{
  background:rgba(255,255,255,0.98);
  box-shadow:0 8px 32px rgba(7,31,56,0.16),0 2px 8px rgba(7,31,56,0.08);
  transform:translateX(6px);
}
.profile-highlight i{color:var(--primary);font-size:1.1rem;width:22px;flex-shrink:0;}
.profile-highlight span{color:var(--text);font-size:0.86rem;font-weight:500;}

/* Round profile image */
.profile-img-wrap{
  position:relative;
  display:flex;align-items:center;justify-content:center;
  padding:40px;
}
.profile-img-round{
  width:300px;height:300px;
  border-radius:50%;
  object-fit:cover;
  border:5px solid white;
  box-shadow:0 20px 60px rgba(7,31,56,0.25),0 0 0 8px rgba(168,21,31,0.12);
  position:relative;z-index:2;
}
.profile-img-ring{
  position:absolute;border-radius:50%;
  border:2px solid rgba(7,31,56,0.15);
  top:50%;left:50%;
  transform:translate(-50%,-50%);
  animation:ringPulse 3s ease-out infinite;
}
.profile-img-ring:nth-child(1){width:360px;height:360px;animation-delay:0s;}
.profile-img-ring:nth-child(2){width:420px;height:420px;animation-delay:1s;border-color:rgba(168,21,31,0.1);}

@media(max-width:900px){
  .profile-grid{grid-template-columns:1fr;gap:36px;}
  .profile-img-round{width:220px;height:220px;}
  .profile-img-ring:nth-child(1){width:280px;height:280px;}
  .profile-img-ring:nth-child(2){width:340px;height:340px;}
}

/* ============================================================
   WHY CHOOSE — rings around the numbers (shrinking/expanding)
============================================================ */
.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;
}
.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:hover{transform:translateY(-7px);}
.why-card>*{position:relative;z-index:2;}

/* Number with rings */
.why-card-num-wrap{position:relative;display:inline-flex;align-items:center;justify-content:center;margin-bottom:12px;}
.why-card-num{
  font-family:'Bebas Neue',cursive;font-size:3rem;line-height:1;
  color:var(--gray-light);letter-spacing:-1px;transition:color 0.3s;
  position:relative;z-index:1;
}
.why-card:hover .why-card-num{color:rgba(255,255,255,0.1);}
/* Rings around the number */
.why-num-ring{
  position:absolute;top:50%;left:50%;
  border-radius:50%;border:2px solid rgba(168,21,31,0.25);
  animation:numRing 2.5s ease-out infinite;
  opacity:0;
}
.why-num-ring:nth-child(1){width:55px;height:55px;margin-top:-27px;margin-left:-27px;animation-delay:0s;}
.why-num-ring:nth-child(2){width:72px;height:72px;margin-top:-36px;margin-left:-36px;animation-delay:0.8s;}
.why-num-ring:nth-child(3){width:90px;height:90px;margin-top:-45px;margin-left:-45px;animation-delay:1.6s;}
@keyframes numRing{
  0%{opacity:0;transform:scale(0.7);}
  30%{opacity:0.6;}
  100%{opacity:0;transform:scale(1.2);}
}
.why-card:hover .why-num-ring{border-color:rgba(255,255,255,0.2);}

.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;}
.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;}
.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;}
.why-card p{color:var(--gray);font-size:0.82rem;line-height:1.65;transition:color 0.3s;}
.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;}}

/* ============================================================
   FACILITIES — new UI, static bg image, white counter containers
   3-per-row on smaller screens
============================================================ */
.warehouse-section{
  position:relative;overflow:hidden;
  background:var(--primary);
}
.warehouse-bg{
  position:absolute;inset:0;z-index:0;
  background-image:url('https://images.unsplash.com/photo-1586528116311-ad8dd3c8310d?w=1600&q=70');
  background-size:cover;background-position:center;
  background-attachment:fixed;
  opacity:0.18;
}
.warehouse-section .container{position:relative;z-index:2;}
.warehouse-section .section-tag{background:rgba(168,21,31,0.25);color:#ff8f96;}
.warehouse-section .section-title{color:white;}
.warehouse-section .separator{background:var(--red);}
.warehouse-section .section-desc{color:rgba(255,255,255,0.7);}

/* New facility cards — glass/dark style */
.warehouse-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:42px;}
.wh-card{
  background:rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.12);
  border-radius:16px;padding:28px 22px;
  position:relative;overflow:hidden;
  transition:all 0.4s cubic-bezier(0.34,1.56,0.64,1);
  backdrop-filter:blur(8px);
}
.wh-card::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(168,21,31,0.15) 0%,transparent 60%);
  opacity:0;transition:opacity 0.4s;border-radius:16px;
}
.wh-card:hover::before{opacity:1;}
.wh-card:hover{transform:translateY(-8px);box-shadow:0 20px 50px rgba(0,0,0,0.4);border-color:rgba(168,21,31,0.4);}
.wh-num{font-family:'Bebas Neue',cursive;font-size:3rem;color:rgba(255,255,255,0.08);line-height:1;margin-bottom:4px;}
.wh-icon{width:50px;height:50px;background:rgba(255,255,255,0.1);border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:14px;font-size:1.4rem;}
.wh-card h4{font-size:1rem;color:white;margin-bottom:6px;}
.wh-card p{font-size:0.82rem;color:rgba(255,255,255,0.6);line-height:1.6;}

/* Stats row — WHITE containers */
.wh-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:50px;}
.wh-stat{
  text-align:center;padding:24px 16px;
  background:white; /* Changed to white */
  border-radius:14px;
  transition:transform 0.3s ease;
  box-shadow:0 4px 20px rgba(0,0,0,0.15);
}
.wh-stat:hover{transform:translateY(-5px);}
.wh-stat-num{font-family:'Bebas Neue',cursive;font-size:2.2rem;color:var(--red);line-height:1;}
.wh-stat-lbl{font-size:0.7rem;color:var(--primary);text-transform:uppercase;letter-spacing:1px;margin-top:4px;font-weight:600;}

/* Timeline */
.wh-timeline{display:flex;align-items:center;justify-content:center;gap:0;margin-top:48px;flex-wrap:wrap;}
.wh-tl-item{display:flex;flex-direction:column;align-items:center;gap:10px;position:relative;}
.wh-tl-item:not(:last-child)::after{content:'';position:absolute;right:-60px;top:22px;width:120px;height:2px;background:linear-gradient(90deg,var(--red),rgba(255,255,255,0.2));}
.wh-tl-dot{width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,0.1);border:3px solid rgba(255,255,255,0.3);display:flex;align-items:center;justify-content:center;font-family:'Bebas Neue',cursive;font-size:1rem;color:white;transition:all 0.4s cubic-bezier(0.34,1.56,0.64,1);}
.wh-tl-item:hover .wh-tl-dot{background:var(--red);border-color:var(--red);transform:scale(1.2);}
.wh-tl-label{font-size:0.8rem;font-weight:700;color:rgba(255,255,255,0.7);white-space:nowrap;}
.wh-tl-gap{width:80px;}

/* Mobile: 3 per row for stat counters */
@media(max-width:900px){
  .warehouse-grid{grid-template-columns:repeat(2,1fr);}
  .wh-stats{grid-template-columns:repeat(3,1fr);}
  .wh-timeline{gap:8px;}
  .wh-tl-item:not(:last-child)::after{display:none;}
  .wh-tl-gap{display:none;}
}
@media(max-width:560px){
  .warehouse-grid{grid-template-columns:1fr 1fr;}
  .wh-stats{grid-template-columns:repeat(3,1fr);} /* 3 per row on small */
}
@media(max-width:420px){
  .wh-stats{grid-template-columns:repeat(2,1fr);} /* 2 per row extra small */
}

/* Mission / Vision / Values */
.mvv-section{background:var(--off-white);}
.mvv-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:48px;}
.mv-card{border-radius:20px;padding:48px 40px;position:relative;overflow:hidden;}
.mv-card.mission{background:linear-gradient(135deg,var(--primary),#0d3460);}
.mv-card.vision{background:linear-gradient(135deg,var(--red-dark),var(--red));}
.mv-card-icon{width:64px;height:64px;border-radius:16px;background:rgba(255,255,255,0.12);display:flex;align-items:center;justify-content:center;margin-bottom:22px;}
.mv-card-icon i{font-size:1.6rem;color:rgba(255,255,255,0.9);}
.mv-card h3{font-size:1.5rem;color:white;margin-bottom:14px;}
.mv-card p{color:rgba(255,255,255,0.75);font-size:0.9rem;line-height:1.82;}
.mv-card::after{content:'';position:absolute;bottom:-30px;right:-30px;width:120px;height:120px;border-radius:50%;background:rgba(255,255,255,0.04);pointer-events:none;}
.mv-card::before{content:'';position:absolute;top:-20px;right:-20px;width:80px;height:80px;border-radius:50%;background:rgba(255,255,255,0.06);pointer-events:none;}
.values-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:28px;}
.val-card{background:var(--white);border:1px solid var(--border);border-radius:14px;padding:28px 22px;transition:all 0.38s cubic-bezier(0.34,1.56,0.64,1);}
.val-card:hover{background:var(--primary);transform:translateY(-8px);box-shadow:var(--shadow);}
.val-card:hover .val-card-title,.val-card:hover .val-card-desc{color:rgba(255,255,255,0.9)!important;}
.val-card:hover .val-icon{background:rgba(255,255,255,0.15);}
.val-card:hover .val-icon i{color:#ff8f96;}
.val-icon{width:46px;height:46px;border-radius:11px;background:var(--red-muted);display:flex;align-items:center;justify-content:center;margin-bottom:14px;transition:all 0.3s;}
.val-icon i{color:var(--red);font-size:1.1rem;transition:color 0.3s;}
.val-card-title{font-size:1rem;color:var(--primary);margin-bottom:7px;transition:color 0.3s;}
.val-card-desc{font-size:0.82rem;color:var(--gray);line-height:1.65;transition:color 0.3s;}
@media(max-width:900px){.mvv-grid{grid-template-columns:1fr;}.values-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:560px){.values-grid{grid-template-columns:1fr;}}

/* ============================================================
   TEAM — old style, always-visible Read About button
   Socials: Instagram, WhatsApp, Email only
============================================================ */
.team-section{background:var(--white);}
.team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:42px;}
.team-card{
  background:var(--off-white);border:1px solid var(--border);
  border-radius:var(--radius-lg);overflow:hidden;
  transition:all 0.38s cubic-bezier(0.34,1.56,0.64,1);
}
.team-card:hover{transform:translateY(-10px);box-shadow:var(--shadow);}
.team-img-wrap{height:220px;overflow:hidden;position:relative;}
.team-img{width:100%;height:100%;object-fit:cover;transition:transform 0.6s ease;}
.team-card:hover .team-img{transform:scale(1.06);}
.team-body{padding:18px;}
.team-name{font-size:1rem;color:var(--primary);margin-bottom:4px;}
.team-role{font-size:0.76rem;color:var(--red);font-weight:700;text-transform:uppercase;letter-spacing:1px;margin-bottom:12px;}
/* Always-visible Read About button */
.team-read-btn{
  display:inline-flex;align-items:center;gap:6px;
  background:var(--red);color:white;
  padding:7px 14px;border-radius:7px;
  font-size:0.76rem;font-weight:700;
  transition:all 0.3s ease;
  margin-bottom:10px;
  cursor:pointer;border:none;font-family:inherit;
}
.team-read-btn:hover{background:var(--red-dark);transform:translateY(-2px);}
.team-socials{display:flex;gap:8px;margin-top:8px;}
.team-social{width:32px;height:32px;border-radius:8px;background:var(--gray-light);display:flex;align-items:center;justify-content:center;color:var(--gray);font-size:0.8rem;transition:var(--transition);}
.team-social:hover{background:var(--red);color:white;transform:scale(1.1);}
@media(max-width:900px){.team-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:480px){.team-grid{grid-template-columns:1fr 1fr;}}

/* Team Modal */
.team-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);}
.team-modal-overlay.active{opacity:1;visibility:visible;}
.team-modal-box{background:var(--white);border-radius:var(--radius-lg);max-width:820px;width:100%;max-height:88vh;overflow:hidden;display:grid;grid-template-columns:1fr 1.4fr;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)}}
.team-modal-img-wrap{overflow:hidden;position:relative;}
.team-modal-img{width:100%;height:100%;object-fit:cover;min-height:300px;}
.team-modal-content{padding:40px 36px;overflow-y:auto;position:relative;}
.team-modal-close{position:absolute;top:16px;right:16px;width:36px;height:36px;background:#071F38;color:white;border:none;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1rem;transition:all 0.3s;}
.team-modal-close:hover{background:var(--red);transform:rotate(90deg);}
.team-modal-name{font-size:1.7rem;color:var(--primary);margin-bottom:4px;margin-top:16px;}
.team-modal-role{font-size:0.82rem;color:var(--red);font-weight:700;text-transform:uppercase;letter-spacing:1.5px;margin-bottom:20px;}
.team-modal-desc{font-size:0.9rem;color:var(--gray);line-height:1.82;margin-bottom:22px;}
.team-modal-socials{display:flex;gap:10px;}
.team-modal-social{width:36px;height:36px;border-radius:10px;background:var(--off-white);display:flex;align-items:center;justify-content:center;color:var(--gray);font-size:0.9rem;transition:var(--transition);}
.team-modal-social:hover{background:var(--red);color:white;}
@media(max-width:640px){.team-modal-box{grid-template-columns:1fr;}.team-modal-img{height:220px;}}

/* Partners Ticker */
.partners-section{background:var(--off-white);}
.partners-track-wrap{overflow:hidden;margin-top:40px;}
.partners-track-wrap:hover .partners-track{animation-play-state:paused;}
.partners-track{display:flex;gap:20px;animation:partnerScroll 22s linear infinite;width:max-content;}
.partner-card{flex-shrink:0;padding:18px 28px;background:var(--white);border:1px solid var(--border);border-radius:12px;display:flex;align-items:center;justify-content:center;min-width:160px;transition:all 0.3s ease;}
.partner-card:hover{border-color:var(--red);box-shadow:0 4px 20px rgba(168,21,31,0.12);transform:translateY(-3px);}
.partner-name{font-family:'Rajdhani',sans-serif;font-weight:700;font-size:0.9rem;color:var(--primary);letter-spacing:1px;text-align:center;}
@keyframes partnerScroll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* CTA Banner */
.cta-banner{background:var(--off-white);padding:70px 0;border-top:1px solid var(--border);}
.cta-inner{display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap;}
.cta-text h2{font-size:clamp(1.6rem,3vw,2.2rem);color:var(--primary);margin-bottom:8px;}
.cta-text p{color:var(--gray);font-size:0.9rem;}
.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;box-shadow:0 8px 28px rgba(168,21,31,0.35);}
.btn-cta-primary:hover{background:var(--red-dark);transform:translateY(-3px);box-shadow:0 12px 36px rgba(168,21,31,0.5);}
@media(max-width:768px){.cta-inner{flex-direction:column;text-align:center;}}

/* Quote Modal */
.quote-modal-overlay{position:fixed;inset:0;background:rgba(4,15,29,0.72);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:560px){.quote-modal{padding:28px 20px;}.quote-form-row{grid-template-columns:1fr;}}

/* 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-btn{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-btn: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;}

/* 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;}
.footer-logo-text-fallback{font-family:'Bebas Neue',cursive;font-size:1.8rem;letter-spacing:3px;color:white;}
.footer-logo-text-fallback span{color:var(--red);}
.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;}
.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);cursor:pointer;}
.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;}}
@media(max-width:768px){.section-pad{padding:56px 0;}}
@media(max-width:480px){.container{padding:0 14px;}}
  


/* ============================================================
   YI SHIPPING — OVERRIDE CSS
   Paste this inside a <style> tag or link as a stylesheet
   AFTER your main stylesheet so it takes priority.
============================================================ */

/* ============================================================
   1. WHO WE ARE — Bigger round image
============================================================ */
.about-img-round {
  width: 350px;   /* was 260px — increase further if needed */
  height: 350px;
}

/* Push the rings out to match the bigger image */
.about-ring:nth-child(1) { width: 390px; height: 390px; }
.about-ring:nth-child(2) { width: 460px; height: 460px; }
.about-ring:nth-child(3) { width: 530px; height: 530px; }

/* Expand the orbiter radius to match */
.about-year-orbiter {
  width: 380px;
  height: 380px;
  margin-left: -190px;
  margin-top: -190px;
}

/* Give the wrap enough room */
.about-image-round-wrap {
  padding: 80px;
}

/* ============================================================
   2. COMPANY PROFILE — Bigger round image
============================================================ */
.profile-img-round {
  width: 380px;   /* was 300px */
  height: 380px;
}

/* Expand rings to match */
.profile-img-ring:nth-child(1) { width: 450px; height: 450px; }
.profile-img-ring:nth-child(2) { width: 520px; height: 520px; }

/* Give wrap enough breathing room */
.profile-img-wrap {
  padding: 60px;
}

/* ============================================================
   3. COMPANY PROFILE — White overlay options
   Option A = slightly more visible image (overlay at ~0.75)
   Option B = even more visible image (overlay at ~0.65)
   Uncomment the one you prefer, or adjust the value.
============================================================ */

/* --- Option A: overlay at 0.75 (subtle increase) --- */
.profile-section-bg::after {
  background: rgba(255, 255, 255, 0.75);
}

/* --- Option B: overlay at 0.65 (image more visible) ---
.profile-section-bg::after {
  background: rgba(255, 255, 255, 0.65);
}
*/

/* ============================================================
   4. FACILITIES — Background image less visible (toned down)
      + All card text white
============================================================ */

/* Reduce how much the bg image shows — lower opacity */
.warehouse-bg {
  opacity: 0.10;  /* was 0.18 — lower = less visible */
}

/* Make ALL text inside facility cards white */
.wh-card h4,
.wh-card p,
.wh-card .wh-num {
  color: #ffffff;
}

/* Icon emoji stays visible — no change needed */
/* If you want the icon wrapper brighter: */
.wh-card .wh-icon {
  background: rgba(255, 255, 255, 0.15);
}

/* ============================================================
   5. MEET OUR TEAM — Centered name/role, Read About at bottom center
      Socials stay left-aligned (or remove socials from HTML if desired)
============================================================ */

/* Center the card body content */
.team-body {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 16px;
}

/* Name centered */
.team-name {
  text-align: center;
}

/* Role centered */
.team-role {
  text-align: center;
  margin-bottom: 10px;
}

/* Push Read About button to bottom center */
.team-read-btn {
  margin-top: auto;
  align-self: center;
  margin-bottom: 12px;
  /* If the card has fixed height, this pushes it down:
     add min-height to .team-card if you want strict bottom alignment */
}

/* Keep socials centered too */
.team-socials {
  justify-content: center;
}

/* Optional: give cards a min-height so the button truly sits at the bottom */
.team-card {
  display: flex;
  flex-direction: column;
}
.team-body {
  flex: 1;
}

/* ============================================================
   MOBILE ADJUSTMENTS for the bigger images
============================================================ */
@media (max-width: 900px) {
  .about-img-round       { width: 240px; height: 240px; }
  .about-ring:nth-child(1){ width: 300px; height: 300px; }
  .about-ring:nth-child(2){ width: 360px; height: 360px; }
  .about-ring:nth-child(3){ width: 420px; height: 420px; }
  .about-year-orbiter    { width: 280px; height: 280px; margin-left:-140px; margin-top:-140px; }
  .about-image-round-wrap{ padding: 50px; }

  .profile-img-round     { width: 260px; height: 260px; }
  .profile-img-ring:nth-child(1){ width: 320px; height: 320px; }
  .profile-img-ring:nth-child(2){ width: 380px; height: 380px; }
  .profile-img-wrap      { padding: 40px; }
}


/* ============================================================
   FACILITIES SECTION - SMALL SCREEN TEXT PADDING OVERRIDE
   Reduces description padding on smaller screens to prevent
   text from looking too long and stretched
============================================================ */

/* Target the facility cards in the warehouse/facilities section */
@media (max-width: 768px) {
  .wh-card {
    padding: 20px 16px;  /* Reduced from 28px 22px */
  }
  
  /* Specifically target the paragraph/description text */
  .wh-card p {
    font-size: 0.78rem;  /* Slightly smaller text for better fit */
    line-height: 1.5;    /* Tighter line height */
    margin-bottom: 0;     /* Remove extra bottom margin */
  }
  
  /* Adjust heading spacing as well */
  .wh-card h4 {
    margin-bottom: 4px;   /* Reduced from default */
    font-size: 0.95rem;   /* Slightly smaller on mobile */
  }
  
  /* Reduce number size on mobile */
  .wh-card .wh-num {
    font-size: 2.5rem;    /* Reduced from 3rem */
    margin-bottom: 0;
  }
  
  /* Reduce icon size/spacing */
  .wh-card .wh-icon {
    width: 40px;
    height: 40px;
    margin-bottom: 10px;
    font-size: 1.2rem;
  }
}

/* For very small screens (phones under 480px) */
@media (max-width: 480px) {
  .wh-card {
    padding: 16px 12px;  /* Even tighter padding */
  }
  
  .wh-card p {
    font-size: 0.75rem;
    line-height: 1.45;
  }
  
  .wh-card h4 {
    font-size: 0.88rem;
  }
  
  .wh-card .wh-num {
    font-size: 2.2rem;
  }
}

/* For landscape orientation on small phones */
@media (max-width: 768px) and (orientation: landscape) {
  .wh-card {
    padding: 14px 16px;
  }
  
  .wh-card p {
    font-size: 0.75rem;
    line-height: 1.4;
  }
}


/* ============================================================
   YI SHIPPING — OVERRIDE CSS
   Larger round images & rings for Who We Are + Profile sections
   All other functionality remains intact
============================================================ */

/* ============================================================
   1. WHO WE ARE — Larger round image & rings (Desktop)
============================================================ */
@media (min-width: 901px) {
  /* Main image - larger */
  .about-img-round {
    width: 380px !important;
    height: 380px !important;
  }

  /* Rings expanded to match larger image */
  .about-ring:nth-child(1) { 
    width: 450px !important; 
    height: 450px !important; 
  }
  .about-ring:nth-child(2) { 
    width: 530px !important; 
    height: 530px !important; 
  }
  .about-ring:nth-child(3) { 
    width: 610px !important; 
    height: 610px !important; 
  }

  /* Orbiting year counter - larger radius */
  .about-year-orbiter {
    width: 430px !important;
    height: 430px !important;
    margin-left: -215px !important;
    margin-top: -215px !important;
  }

  /* Year badge slightly larger */
  .about-year-badge {
    padding: 12px 20px !important;
    top: -30px !important;
  }
  .about-year-badge .ynum {
    font-size: 2.2rem !important;
  }
  .about-year-badge .ylbl {
    font-size: 0.7rem !important;
  }

  /* Wrap container has enough space */
  .about-image-round-wrap {
    padding: 80px 50px !important;
  }

  /* Top tag adjustment */
  .img-tag-top {
    top: 24px !important;
    left: 28px !important;
    font-size: 0.78rem !important;
    padding: 8px 16px !important;
  }
}

/* ============================================================
   WHO WE ARE — Extra Large Screens (1600px+)
============================================================ */
@media (min-width: 1600px) {
  .about-img-round {
    width: 460px !important;
    height: 460px !important;
  }

  .about-ring:nth-child(1) { 
    width: 540px !important; 
    height: 540px !important; 
  }
  .about-ring:nth-child(2) { 
    width: 630px !important; 
    height: 630px !important; 
  }
  .about-ring:nth-child(3) { 
    width: 720px !important; 
    height: 720px !important; 
  }

  .about-year-orbiter {
    width: 520px !important;
    height: 520px !important;
    margin-left: -260px !important;
    margin-top: -260px !important;
  }

  .about-year-badge .ynum {
    font-size: 2.6rem !important;
  }
  
  .about-image-round-wrap {
    padding: 100px 70px !important;
  }
}

/* ============================================================
   2. COMPANY PROFILE — Larger round image & rings (Desktop)
============================================================ */
@media (min-width: 901px) {
  /* Profile image - larger */
  .profile-img-round {
    width: 320px !important;
    height: 320px !important;
  }

  /* Profile rings expanded */
  .profile-img-ring:nth-child(1) { 
    width: 500px !important; 
    height: 500px !important; 
  }
  .profile-img-ring:nth-child(2) { 
    width: 580px !important; 
    height: 580px !important; 
  }

  /* Profile wrap container */
  .profile-img-wrap {
    padding: 70px 50px !important;
  }
}

/* ============================================================
   COMPANY PROFILE — Extra Large Screens (1600px+)
============================================================ */
@media (min-width: 1600px) {
  .profile-img-round {
    width: 500px !important;
    height: 500px !important;
  }

  .profile-img-ring:nth-child(1) { 
    width: 590px !important; 
    height: 590px !important; 
  }
  .profile-img-ring:nth-child(2) { 
    width: 680px !important; 
    height: 680px !important; 
  }

  .profile-img-wrap {
    padding: 90px 70px !important;
  }
}

/* ============================================================
   3. COMPANY PROFILE — White overlay (more image visible)
============================================================ */
.profile-section-bg::after {
  background: rgba(255, 255, 255, 0.89) !important;
}

/* ============================================================
   4. FACILITIES — Background less visible + all card text white
============================================================ */
.warehouse-bg {
  opacity: 0.10 !important;
}

/* Force all text inside facility cards to white */
.wh-card h4,
.wh-card p,
.wh-card .wh-num {
  color: #ffffff !important;
}

/* Icon wrapper brighter for better visibility */
.wh-card .wh-icon {
  background: rgba(255, 255, 255, 0.15) !important;
}

/* ============================================================
   5. MEET OUR TEAM — Centered name/role & Read About button
============================================================ */
/* Center card body content */
.team-body {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
}

/* Name centered */
.team-name {
  text-align: center !important;
}

/* Role centered */
.team-role {
  text-align: center !important;
  margin-bottom: 10px !important;
}

/* Read About button centered at bottom */
.team-read-btn {
  margin-top: auto !important;
  align-self: center !important;
  margin-bottom: 12px !important;
}

/* Socials centered */
.team-socials {
  justify-content: center !important;
}

/* Card uses flex column to push button to bottom */
.team-card {
  display: flex !important;
  flex-direction: column !important;
}
.team-body {
  flex: 1 !important;
}

/* ============================================================
   MOBILE & TABLET — Keep smaller sizes (responsive)
   ============================================================ */
@media (max-width: 900px) {
  /* WHO WE ARE - Mobile sizes */
  .about-img-round { 
    width: 240px !important; 
    height: 240px !important; 
  }
  .about-ring:nth-child(1){ 
    width: 280px !important; 
    height: 280px !important; 
  }
  .about-ring:nth-child(2){ 
    width: 340px !important; 
    height: 340px !important; 
  }
  .about-ring:nth-child(3){ 
    width: 400px !important; 
    height: 400px !important; 
  }
  .about-year-orbiter { 
    width: 260px !important; 
    height: 260px !important; 
    margin-left: -130px !important; 
    margin-top: -130px !important; 
  }
  .about-image-round-wrap {
    padding: 40px !important;
  }
  .about-year-badge {
    padding: 8px 14px !important;
    top: -24px !important;
  }
  .about-year-badge .ynum {
    font-size: 1.7rem !important;
  }
  .about-year-badge .ylbl {
    font-size: 0.55rem !important;
  }

  /* COMPANY PROFILE - Mobile sizes */
  .profile-img-round { 
    width: 250px !important; 
    height: 250px !important; 
  }
  .profile-img-ring:nth-child(1){ 
    width: 310px !important; 
    height: 310px !important; 
  }
  .profile-img-ring:nth-child(2){ 
    width: 370px !important; 
    height: 370px !important; 
  }
  .profile-img-wrap {
    padding: 40px !important;
  }
}

/* ============================================================
   FACILITIES SECTION - Mobile text padding & sizing
   ============================================================ */
@media (max-width: 768px) {
  .wh-card {
    padding: 18px 14px !important;
  }
  .wh-card p {
    font-size: 0.75rem !important;
    line-height: 1.45 !important;
  }
  .wh-card h4 {
    font-size: 0.88rem !important;
    margin-bottom: 4px !important;
  }
  .wh-card .wh-num {
    font-size: 2.2rem !important;
  }
  .wh-card .wh-icon {
    width: 38px !important;
    height: 38px !important;
    font-size: 1rem !important;
  }
}

/* Very small screens (under 480px) */
@media (max-width: 480px) {
  .wh-card {
    padding: 14px 10px !important;
  }
  .wh-card p {
    font-size: 0.7rem !important;
    line-height: 1.4 !important;
  }
  .wh-card h4 {
    font-size: 0.82rem !important;
  }
  .wh-card .wh-num {
    font-size: 1.8rem !important;
  }
}

/* Landscape orientation adjustment */
@media (max-width: 768px) and (orientation: landscape) {
  .wh-card {
    padding: 12px 14px !important;
  }
  .wh-card p {
    font-size: 0.7rem !important;
    line-height: 1.35 !important;
  }
}