/* Prevent unexpected overflow */
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html,
body {
  font-family: "Inter", sans-serif !important;
  max-width: 100%;
  overflow-x: hidden;
}
body {
  font-family:
    "Inter",
    system-ui,
    -apple-system,
    BlinkMacMacSystemFont,
    "Segoe UI",
    Roboto,
    Helvetica,
    Arial,
    sans-serif;
  padding-top: 80px;
}

:root {
  --primary-color: #002762;
  --span-color: #93c5fd;
}

.whatsapp-float {
  position: fixed;
  bottom: 20px;
  right: 20px;
  background-color: #25d366;
  color: white;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);
  z-index: 1000;
  cursor: pointer;
  transition: transform 0.2s ease;
  text-decoration: none;
}
.whatsapp-float:hover {
  transform: scale(1.1);
  color: white;
  text-decoration: none;
}

/*======================== NAVBAR ==================================== */
.navbar {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 9999;
}
.custom-navbar {
  background: var(--primary-color);
  /* padding: 15px 0; */
}

.nav-logo {
  height: 60px;
  width: auto;
}

.navbar-nav .nav-link {
  color: #cbd5f1;
  margin: 0 14px;
  font-size: 15px;
}

.navbar-nav .nav-link.active {
  color: white;
  font-weight: 600;
}

.partner-btn {
  border: 1px solid white;
  color: white;
  padding: 8px 18px;
  border-radius: 6px;
}

.partner-btn:hover {
  background: white;
  color: var(--primary-color);
}

.navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='white' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}

.navbar-toggler {
  border: none !important;
}

.navbar-toggler:focus,
.navbar-toggler:active,
.navbar-toggler:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}
/*================================ HERO SECTION ===================================*/
.hero {
  height: 60vh;
  background: url("Assets/Images/hero_banner.png") center/cover no-repeat;
  position: relative;
  display: flex;
  align-items: center;
}
/* Dark overlay */
.overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;

  background: rgba(0, 0, 0, 0.45);
}
/* HERO CONTENT */
.hero-content {
  position: relative;
  z-index: 2;
  color: white;
}
.hero h1 {
  font-weight: 600;
  margin-bottom: 20px;
  /* max-width: 550px; */
}
.hero p {
  font-size: 18px;
  margin-bottom: 25px;
  color: #e2e8f0;
}
.book-btn {
  background: transparent;
  color: white;
  border: 3px solid white;
  padding: 10px 20px;
  border-radius: 6px;
  font-weight: 700;
}
.book-btn:hover {
  background: white;
  color: #1e293b;
}

/*========================= WHY CHOOSE SECTION============================== */
.whychoose-section {
  background: #f7f9fc;
}
.whychoose-title {
  font-size: 32px;
  font-weight: 700;
  color: #1e2a5a;
}
.whychoose-subtitle {
  color: #6b7280;
  max-width: 600px;
  margin: 10px auto 0;
}
/* FEATURE CARD */
.whychoose-card {
  text-align: center;
  transition: 0.3s;
  border: 1px solid transparent;
  border-radius: 14px;
  padding: 10px;
  background:
    linear-gradient(white, white) padding-box,
    linear-gradient(#8d96eb, #181b50) border-box;
}
.whychoose-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
}
.whychoose-card-title {
  font-weight: 600;
  margin-top: 15px;
}
.whychoose-card-text {
  color: #6b7280;
  font-size: 14px;
}
/* ICON CIRCLE */
.whychoose-icon {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 15px;
  position: relative;
}
/* GREEN */
.whychoose-icon-green {
  background: linear-gradient(135deg, #edf8de, #e0f0db);
}

/* ORANGE */
.whychoose-icon-orange {
  background: linear-gradient(135deg, #fff5ec, #ffdfbf);
}

/* BLUE */
.whychoose-icon-blue {
  background: linear-gradient(135deg, #e9ecff, #c9d0ff);
}

/* YELLOW */
.whychoose-icon-yellow {
  background: linear-gradient(135deg, #fff9ee, #ffd68d);
}
.whychoose-icon img {
  width: 40px;
  height: 40px;
  object-fit: contain;
}
.vehicle-truck {
  position: absolute;
  width: 60px !important;
  bottom: 22px;
  left: 25px;
}
.vehicle-scooty {
  position: absolute;
  width: 40px;
  bottom: 18px;
  left: 10px;
}

/*========================= STATS SECTION =========================*/
.stats-section {
  padding: 30px 0;
  background: radial-gradient(
    circle at bottom,
    #354a8a 0%,
    #1b2259 45%,
    #131a45 100%
  );
  color: white;
  position: relative;
}

/* TITLE */

.stats-title {
  font-size: 36px;
  font-weight: 700;
  margin-bottom: 12px;
}

/* SUBTITLE */

.stats-subtitle {
  color: #cbd5f1;
  font-size: 15px;
  line-height: 1.6;
  margin-bottom: 50px;
}

/* STATS BOX */

.stats-box {
  display: grid;
  grid-template-columns: repeat(4, 1fr);

  border-radius: 14px;
  overflow: hidden;

  border: 1px solid rgba(115, 156, 255, 0.6);

  background: rgba(255, 255, 255, 0.02);

  backdrop-filter: blur(10px);
}

/* EACH ITEM */

.stats-item {
  padding: 35px 20px;
  text-align: center;
  position: relative;
}

/* DIVIDER LINES */
.stats-item:not(:last-child)::after {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
  width: 1px;
  background: linear-gradient(
    transparent,
    rgba(255, 255, 255, 0.35),
    transparent
  );
}

/* NUMBER */

.stats-item h3 {
  font-size: 36px;
  font-weight: 700;
  margin-bottom: 6px;
}

/* TEXT */

.stats-item p {
  font-size: 14px;
  color: #e2e8f0;
}
.stats-section::after {
  content: "";
  position: absolute;
  bottom: -40px;
  left: 50%;
  transform: translateX(-50%);
  width: 600px;
  height: 150px;
  background: radial-gradient(circle, #5c7cff55, transparent 70%);
  filter: blur(50px);
}

/*====================== SERVICES SECTION ======================*/
.services-section {
  padding: 40px 0 10px;
  background: #f7f9fc;
}
.services-row {
  margin-bottom: 30px;
  margin-top: 0 !important;
  padding-top: 0;
}
.services-title {
  font-size: 30px;
  font-weight: 700;
  color: #1b2259;
  margin-bottom: 20px;
  padding-left: 25px;
}
.services-list {
  padding-left: 30px;
}
.services-list li {
  margin-bottom: 16px;
  color: #6b7280;
  line-height: 1.7;
  font-size: 14px;
}
/* LOGISTICS IMAGE GRID */
.logistics-images {
  display: grid;
  grid-template-columns: 260px 260px;
  grid-template-rows: 260px 220px;
  gap: 24px;
  /* padding-left: 15%; */
}

/* image style */
.logistics-images img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 16px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
}
/* scooter (top left) */
.logistics-images img:nth-child(1) {
  grid-column: 1;
  grid-row: 1;
  max-height: 250px;
}

/* auto cargo (top right) */
.logistics-images img:nth-child(2) {
  grid-column: 2;
  grid-row: 1;
  max-height: 230px;
}

/* mini truck (bottom left) */
.logistics-images img:nth-child(3) {
  grid-column: 1;
  grid-row: 2;
  object-fit: cover;
  object-position: center 100%;
  height: 190px;
}

/* big truck (bottom right) */
.logistics-images img:nth-child(4) {
  grid-column: 2;
  grid-row: 2;
  object-fit: cover;
}

/* PASSENGER IMAGES */
.mobility-images {
  display: flex;
  gap: 15px;
  align-items: flex-start;
  object-fit: cover;
  margin-top: 0 !important;
}

.mobility-images img {
  border-radius: 16px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
}

.mobility-images img:first-child {
  width: 220px;
  height: 220px;
}

.mobility-images img:last-child {
  width: 240px;
  margin-top: 120px;
}

/*=================== DRIVER SECTION ===================*/

.driver-section {
  background: var(--primary-color);
}

/* LEFT SIDE */

.driver-content {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px 20px;
  color: white;
}

.driver-text {
  max-width: 420px;
}

.driver-title {
  font-size: 36px;
  font-weight: 700;
  margin-bottom: 20px;
}

.driver-desc {
  font-size: 15px;
  color: #cbd5f1;
  line-height: 1.7;
  margin-bottom: 30px;
}

/* BUTTONS */

.driver-buttons {
  display: flex;
  gap: 15px;
}

/* PRIMARY BUTTON */

.driver-btn-primary {
  background: #f5c84c;
  color: #111;
  padding: 12px 22px;
  border-radius: 8px;
  font-weight: 500;
}

.driver-btn-primary:hover {
  background: #f3b800;
}

/* OUTLINE BUTTON */

.driver-btn-outline {
  border: 1px solid rgba(255, 255, 255, 0.4);
  color: white;
  padding: 12px 22px;
  border-radius: 8px;
}

.driver-btn-outline:hover {
  background: rgba(255, 255, 255, 0.1);
}

/* RIGHT IMAGE */

.driver-image img {
  width: 760px;
  height: 430px;
  object-fit: cover;
}

/*=================== What Makes Us Different ===================*/

.difference-section {
  padding: 30px 0;
  background: #f7f9fc;
  text-align: center;
}

.difference-title {
  font-size: 34px;
  font-weight: 700;
  color: #1b2259;
}

.difference-subtitle {
  color: #6b7280;
  margin-top: 10px;
}

.difference-card {
  border: 1px solid transparent;
  border-radius: 14px;
  padding: 30px;
  background:
    linear-gradient(white, white) padding-box,
    linear-gradient(#8d96eb, #181b50) border-box;
}

.difference-icon {
  width: 70px;
  height: 70px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: auto;
  margin-bottom: 15px;
  font-size: 26px;
}
.difference-icon img {
  width: 32px;
  height: 32px;
  object-fit: contain;
}

.difference-green {
  background: #eaf6e7;
  color: #4caf50;
}
.difference-orange {
  background: #fff2e0;
  color: #ff9800;
}
.difference-yellow {
  background: #fff5d8;
  color: #ffc107;
}

.difference-buttons {
  margin-top: 35px;
  display: flex;
  justify-content: center;
  gap: 15px;
}

.difference-primary {
  background: var(--primary-color);
  color: white;
  padding: 10px 20px;
  border-radius: 8px;
}

.difference-outline {
  border: 1px solid var(--primary-color);
  color: var(--primary-color);
  padding: 10px 20px;
  border-radius: 8px;
}
.difference-outline:hover {
  border: 1px solid var(--primary-color);
  color: white;
  background: var(--primary-color);
}
/*=================== DOWNLOAD APP ===================*/

.app-section {
  background: radial-gradient(
    circle at 30% 50%,
    #3d4cb5 0%,
    var(--primary-color) 45%,
    #161a48 100%
  );
  color: white;
  position: relative;
  overflow: hidden;
  padding-top: 30px;
}

/* PHONE IMAGE */

.app-phone {
  width: 340px;
  height: 400px;
  display: block;
  margin: auto;
}

/* TEXT AREA */

.app-small {
  letter-spacing: 3px;
  font-size: 14px;
  color: #7fc2ff;
  margin-bottom: 10px;
  font-weight: 500;
}

.app-title {
  font-size: 42px;
  font-weight: 700;
  margin-bottom: 25px;
  line-height: 1.2;
}

/* STORE BUTTONS */

.app-buttons {
  display: flex;
  gap: 15px;
}

.app-buttons img {
  height: 50px;
  cursor: pointer;
  transition: transform 0.2s ease;
}

.app-buttons img:hover {
  transform: translateY(-3px);
}

/*========================== FAQ ================================*/

.faq-section {
  padding: 50px 0;
  background: #f7f9fc;
}

.faq-title {
  font-size: 34px;
  font-weight: 700;
  color: var(--primary-color);
}

.faq-subtitle {
  color: #6b7280;
  margin-top: 10px;
}

.faq-item {
  border: 1px solid #cfd7ff;
  border-radius: 10px;
  padding: 14px 18px;
  display: flex;
  flex-direction: column;

  justify-content: space-between;
  align-items: center;
  font-size: 14px;
  background: white;
  cursor: pointer;
  transition: 0.2s;
}

.faq-item:hover {
  border-color: #7a8cff;
}

.faq-item span {
  font-size: 18px;
  color: var(--primary-color);
}

.faq-question {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  font-size: 18px;
}

.faq-answer {
  display: none;
  font-size: 16px;
  color: #6b7280;
  padding-top: 10px;
  line-height: 1.6;
}

.faq-item.active .faq-answer {
  display: block;
}

/*================================= FOOTER======================= */

.footer-section {
  background: var(--primary-color);
  color: white;
  padding: 50px 0 35px;
  font-size: 14px;
}
.footer-social-link{
    text-decoration: none;
}
.footer-logo {
  width: 120px;
  margin-bottom: 15px;
}

.footer-desc {
  color: #cbd5f1;
  max-width: 420px;
  margin-bottom: 25px;
}
.footer-subtext {
  font-size: 12px;
  color: #cbd5f1;
  margin-top: 5px;
  opacity: 0.8;
}

/* CONTACT LAYOUT */

.footer-contact-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px 40px;
  margin-top: 10px;
}

.footer-contact-item {
  display: flex;
  gap: 10px;
  align-items: flex-start;
}

.footer-contact-item i {
  color: #cbd5f1;
  margin-top: 3px;
  font-size: 14px;
}

.footer-contact-item span {
  font-weight: 600;
  display: block;
  font-size: 13px;
}

.footer-contact-item p {
  margin: 0;
  font-size: 12px;
  color: #cbd5f1;
}
.footer-contact-item a {
  color: #cbd5f1;
  text-decoration: none;
}

.footer-contact-item a:hover {
  color: white;
  text-decoration: none;
}

/* LINKS */

.footer-links h6 {
  font-weight: 600;
  margin-bottom: 15px;
}

.footer-links ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer-links li {
  margin-bottom: 8px;
  color: #cbd5f1;
  cursor: pointer;
  font-size: 13px;
}

.footer-links li:hover {
  color: white;
}

.footer-links a {
  color: rgb(203, 213, 241);
  text-decoration: none;
  transition: 0.3s;
}

.footer-links a:hover {
  color: white;
}
/* BOTTOM */

.footer-bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  margin-top: 40px;
  padding-top: 15px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.footer-bottom p {
  margin: 0;
  font-size: 12px;
  color: #cbd5f1;
}

/* SOCIAL */

.footer-social i {
  margin-left: 15px;
  cursor: pointer;
  font-size: 16px;
  color: white;
}

.footer-social i:hover {
  color: #7a8cff;
}

/*========================  Privacy Policy / Terms Page ===================== */

/* HERO */

.privacy-hero {
  background: white;
  color: black;
  padding: 30px 0;
}

.privacy-hero h1 {
  font-size: 48px;
  font-weight: 700;
}

.privacy-hero p {
  margin-top: 10px;
  color: #131a45;
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
}

/* CONTENT AREA */

.privacy-content {
  background: #f3f4f6;
  padding: 10px 0;
}

/* MAIN SECTION HEADINGS */

.privacy-content h2 {
  margin-top: 40px;
  font-weight: 700;
  color: #1f2758;
  border-bottom: 3px solid #d4a017;
  padding-bottom: 10px;
  font-size: 28px;
}

/* SUB HEADINGS */

.privacy-content h5 {
  margin-top: 20px;
  font-weight: 600;
  color: #1f2758;
  font-size: 18px;
}

/* PARAGRAPH TEXT */

.privacy-content p {
  color: #6b7280;
  font-size: 15px;
  line-height: 1.7;
  margin-bottom: 12px;
}

/* LISTS */

.privacy-content ul {
  margin-left: 25px;
  margin-bottom: 20px;
  color: #6b7280;
}

.privacy-content li {
  margin-bottom: 8px;
  font-size: 15px;
}

/* ROYAL PROMISE / CONTACT BOX */

.privacy-contact {
  background: var(--primary-color);
  padding: 25px;
  border-radius: 15px;
  margin-top: 30px;
  margin-bottom: 30px;
  color: #111;
}

.privacy-contact p {
  color: #f6f6f6;
  margin: 0;
}

/* ICON STYLE FOR PROMISE BOX */

.privacy-contact strong {
  font-size: 22px;
  display: block;
  margin-bottom: 8px;
  color: white;
}

/*=======================ABOUT US PAGE====================*/
.about-page-who {
  padding: 20px 0;
  padding-bottom: 30px;
}

.about-page-who--light {
  background-color: #f6f6f6;
}
/* SECTION */
.about-page-section {
  padding: 20px 0;
  padding-bottom: 30px;
}

.about-page-section--light {
  background-color: #f6f6f6;
}

/* TEXT */
.about-page-heading {
  font-size: 52px;
  font-weight: 700;
  text-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
}
.about-page-heading span {
  color: var(--span-color);
}
.about-page-hero-subtext {
  font-size: 17px;
  color: white;
}

.about-page-subtext {
  font-size: 18px;
  color: grey;
}

.about-page-offer-subtext {
  font-size: 18px;
  color: grey;
  text-align: center;
}

.about-page-title {
  font-size: 32px;
  font-weight: 600;
  margin-bottom: 15px;
}

.about-page-text {
  color: #555;
}

/* HERO */
.about-page-hero {
  height: 30vh;
  background:
    linear-gradient(rgba(20, 25, 80, 0.7), rgba(20, 25, 80, 0.7)),
    url("./Assets/Images/hero_aboutus.jpg") center/cover no-repeat;
}

/* IMAGE */
.about-page-image {
  border-radius: 15px;
  width: 600px;
  height: 250px;
}

/* ICONS */
.about-page-icon {
  font-size: 28px;
  margin-bottom: 10px;
  color: #1e235c;
}

.about-page-icon--white {
  font-size: 28px;
  margin-bottom: 10px;
  color: #fff;
}

.about-page-icon--large {
  font-size: 40px;
  margin-bottom: 15px;
  color: #1e235c;
}

/* OFFER */
.about-page-offer-card {
  background: #f6f6f6;
  padding: 25px;
  border-radius: 12px;
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
  transition: 0.3s;
}

.about-page-offer-card:hover {
  transform: translateY(-8px);
}

/* FEATURES */
.about-page-feature-box {
  color: #fff;
  padding: 20px;
  border-radius: 10px;
  background: linear-gradient(135deg, #2a2f6e, #1b2259);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
}

/* MISSION */
.about-page-mission-card {
  padding: 30px;
  border-radius: 15px;
  background: white;
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
}

/* HOVER */
.about-page-mission-card:hover,
.about-page-offer-card:hover {
  transform: translateY(-5px);
  transition: 0.3s;
}

/* CONTENT SECTION */
.about-page-content-section {
  padding: 20px 0;
  background: #f6f6f6;
}

.about-page-content-title {
  font-size: 34px;
  font-weight: 700;
  margin-bottom: 20px;
}

.about-page-content-text {
  color: #6b7280;
  line-height: 1.7;
  margin-bottom: 15px;
}

.about-page-powered span {
  color: #2f6fed;
  font-weight: 600;
}

/* CARDS */
.about-page-card {
  text-align: center;
  padding: 25px;
  border-radius: 14px;
  transition: 0.3s;
  border: 1px solid transparent;
  background:
    linear-gradient(white, white) padding-box,
    linear-gradient(#6f7cff, #181b50) border-box;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
}

.about-page-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
}

.about-page-card-icon {
  font-size: 30px;
  color: var(--primary-color);
  margin-bottom: 10px;
}

/* HIGHLIGHT SECTION */
.about-page-highlight-section {
  padding: 100px 0;
  background: linear-gradient(180deg, #f7f9fc, #ffffff);
}

.about-page-highlight-card {
  background: #fff;
  padding: 40px;
  border-radius: 16px;
  text-align: center;

  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
  transition: 0.3s;

  border: 1px solid transparent;

  background:
    linear-gradient(white, white) padding-box,
    linear-gradient(#8d96eb, #181b50) border-box;
}

.about-page-highlight-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.1);
}

.about-page-highlight-card i {
  font-size: 36px;
  color: var(--primary-color);
  margin-bottom: 15px;
}

.about-page-highlight-card h3 {
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 10px;
}

.about-page-highlight-card p {
  color: #6b7280;
  line-height: 1.6;
}

/* NETWORK */
.about-network-section {
  background: #f7f9fc;
  padding-bottom: 30px;
}

.about-title {
  font-size: 34px;
  font-weight: 700;
  color: #1b2259;
}

.about-subtext {
  max-width: 600px;
  color: #6b7280;
  font-size: 15px;
}

/* CARD */
.network-card {
  padding: 10px;
  width: 100%;
  border-radius: 14px;
  background: white;
  transition: 0.3s;
  border: 1px solid transparent;
  background:
    linear-gradient(white, white) padding-box,
    linear-gradient(#8d96eb, #181b50) border-box;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.06);
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 200px;
}

.network-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.1);
}

/* ICON */
.network-icon {
  width: 70px;
  height: 70px;
  margin: 0 auto 15px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #eef2ff;
  font-size: 26px;
  color: #181b50;
}

/* WHY EXISTS */
.about-exist-section {
  background: white;
}

/* CARD */
.exist-card {
  padding: 10px;
  border-radius: 14px;
  transition: 0.3s;
  border: 1px solid transparent;
  background:
    linear-gradient(white, white) padding-box,
    linear-gradient(#8d96eb, #181b50) border-box;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.06);
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 200px;
}

.exist-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.1);
}

/* ICON */
.exist-icon {
  width: 70px;
  height: 70px;
  margin: 0 auto 15px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #eef2ff;
  font-size: 26px;
  color: #181b50;
}

/* TAGLINE */
.exist-tagline {
  font-size: 16px;
  color: #6b7280;
  font-weight: 500;
}
/* LEADERSHIP  */

.about-page-leadership-section {
  padding: 20px 0;
  background: #f7f9fc;
}

/* CARD */
.about-page-leader-card {
  padding: 15px 15px;
  border-radius: 16px;

  background:
    linear-gradient(white, white) padding-box,
    linear-gradient(#8d96eb, #181b50) border-box;

  border: 1px solid transparent;

  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
  transition: 0.3s;
}

.about-page-leader-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.1);
}

/* ICON */
.about-page-leader-icon {
  width: 70px;
  height: 70px;
  margin: 0 auto 20px;
  border-radius: 50%;

  display: flex;
  align-items: center;
  justify-content: center;

  background: #eef2ff;
  color: var(--primary-color);

  font-size: 28px;
}

/* NAME */
.about-page-leader-name {
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 5px;
}

/* ROLE */
.about-page-leader-role {
  color: #7c3aed;
  font-weight: 500;
  margin-bottom: 20px;
}

/* TEXT */
.about-page-leader-desc {
  color: #6b7280;
  line-height: 1.7;
}

/* CTA SECTION */
.about-page-cta-section {
  position: relative;
  z-index: 2;
  margin-bottom: -100px; /* THIS creates overlap */
}
.about-page-cta-section .container {
  background:
    linear-gradient(rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.3)),
    url("./Assets/Images/about-cta.jpg") center/cover no-repeat;
  border-radius: 20px;
  padding: 60px 30px;
  max-width: 1000px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);
}

/* TEXT */
.about-page-cta-section h2 {
  font-size: 36px;
  font-weight: 700;
}
.about-page-cta-section p {
  color: white;
  margin-bottom: 25px;
}
.about-page-cta-section .btn {
  padding: 12px 22px;
  border-radius: 8px;
  font-weight: 600;
}
/*FOOTER*/
.about-footer-section {
  background: var(--primary-color);
  color: white;
  padding: 10% 0 3%;
  font-size: 14px;
}

/* ======================= WHY PAGE HERO ======================= */
.why-page-hero {
  height: 30vh;
  background:
    linear-gradient(rgba(20, 25, 80, 0.7), rgba(20, 25, 80, 0.7)),
    url("./Assets/Images/hero_aboutus.jpg") center/cover no-repeat;
}

.why-page-heading {
  font-size: 52px;
  font-weight: 700;
}
.why-page-heading span {
  color: var(--span-color);
}
.why-page-heading-subtext {
  font-size: 18px;
  color: white;
}

/* ======================= SECTION BASE ======================= */
.why-page-section {
  padding: 30px 0;
}

.why-page-title {
  font-size: 34px;
  font-weight: 700;
  color: #1b2259;
}

/* ======================= CARDS ======================= */
.why-page-card {
  padding: 30px;
  border-radius: 16px;

  background:
    linear-gradient(white, white) padding-box,
    linear-gradient(#8d96eb, #181b50) border-box;

  border: 1px solid transparent;

  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.06);
  transition: 0.3s;
}

.why-page-card:hover {
  transform: translateY(-8px);
}

.why-page-card i {
  font-size: 28px;
  color: var(--primary-color);
  margin-bottom: 10px;
}

/* ======================= HIGHLIGHT ======================= */
.why-page-highlight {
  padding: 40px 0;
  background: radial-gradient(circle, #2c3e80, #181b50);
  color: white;
}

.why-page-highlight h3 {
  font-size: 32px;
  font-weight: 700;
}

.why-page-highlight p {
  color: #cbd5f1;
}

/* ======================= COMPARE ======================= */

.why-page-compare-v2 {
  padding: 30px 0;
  background: #f7f9fc;
}

/* HEADER */
.why-page-compare-header {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;

  background: var(--primary-color);
  color: white;

  padding: 18px 25px;
  border-radius: 14px;
  margin-bottom: 15px;

  text-align: center;
  font-weight: 600;
}

/* Highlight Roundz in header */
.why-page-compare-header .why-compare-highlight {
  background: linear-gradient(135deg, #4f6cff, #2f6fed);
  border-radius: 8px;
  padding: 6px 15px;
}

/* BODY */
.why-page-compare-body {
  margin-top: -10px; /* pulls body up */
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  box-shadow:
    0 20px 40px rgba(0, 0, 0, 0.08),
    0 5px 15px rgba(0, 0, 0, 0.03);
}

/* ROW */
.why-page-compare-row {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  border-left: 3px solid transparent;
  column-gap: 20px;
  padding: 18px 25px;
  border-bottom: 1px dashed #e5e7eb;

  align-items: center;
  transition: 0.3s;
}

/* REMOVE LAST BORDER */
.why-page-compare-row:last-child {
  border-bottom: none;
}

/* HOVER EFFECT */
.why-page-compare-row:hover {
  background: #f1f5f9;
  transform: scale(1.01);
  border-left: 3px solid #4f6cff;
}

/* ROUNDZ COLUMN */

.roundz-col {
  color: #16a34a;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 6px;
}

/* GREEN ICON */
.roundz-col i {
  color: #16a34a;
  font-size: 16px;
}

/* OTHERS (BAD) */
.others-col {
  color: #ef4444;
  display: flex;
  align-items: center;
  gap: 6px;
}
/* TEXT */
.why-page-subtext {
  color: grey;
  margin-top: 8px;
}

/* ======================= PARTNER PAGE ======================= */

/* HERO */
.partner-page-hero {
  padding: 20px 0;
  background: linear-gradient(135deg, #1e235c, #3b82f6);
  color: white;
}

.partner-page-title {
  font-size: 48px;
  font-weight: 700;
}

.partner-page-title span {
  color: var(--span-color);
}

.partner-page-subtext {
  margin: 20px 0;
  color: black;
}
.partner-hero-page-subtext {
  margin: 20px 0;
  color: white;
}
.partner-page-buttons {
  display: flex;
  gap: 15px;
}

.partner-page-buttons a {
  text-decoration: none;
}
.partner-page-btn-primary {
  background: #3b82f6;
  color: white;
  padding: 12px 22px;
  border-radius: 8px;
  border: none;
}

.partner-page-btn-outline {
  border: 1px solid white;
  background: transparent;
  color: white;
  padding: 12px 22px;
  border-radius: 8px;
}

/* STATS */
.partner-page-stats-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}

.partner-page-stat-card {
  background: rgba(255, 255, 255, 0.1);
  padding: 15px;
  border-radius: 16px;
  text-align: center;
  backdrop-filter: blur(10px);
}

.partner-page-stat-card i {
  font-size: 28px;
  margin-bottom: 10px;
}

/* BENEFITS */
.partner-page-benefits {
  padding: 30px 0;
  background: #f7f9fc;
}

.partner-page-heading {
  font-size: 34px;
  font-weight: 700;
}

.partner-page-benefit-card {
  background: white;
  padding: 25px;
  border-radius: 14px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
  transition: 0.3s;
}

.partner-page-benefit-card:hover {
  transform: translateY(-8px);
}

/* BENEFIT CARD ICON - CLEAN MODERN UI */
.partner-page-benefit-icon {
  width: 65px;
  height: 65px;

  display: flex;
  align-items: center;
  justify-content: center;

  margin: 0 auto 20px;

  border-radius: 50%;

  background: linear-gradient(135deg, #4f6cff, #1e235c);

  box-shadow:
    0 10px 25px rgba(79, 108, 255, 0.25),
    inset 0 2px 6px rgba(255, 255, 255, 0.2);

  transition: 0.3s ease;
}

/* ICON */
.partner-page-benefit-icon i {
  font-size: 24px;
  color: white;

  display: flex;
  align-items: center;
  justify-content: center;

  line-height: 1;
}

/* HOVER EFFECT (premium feel) */
.partner-page-benefit-card:hover .partner-page-benefit-icon {
  transform: translateY(-4px) scale(1.05);
  box-shadow: 0 15px 35px rgba(79, 108, 255, 0.35);
}

/* STEPS */
.partner-page-steps {
  padding: 30px 0;
  background: linear-gradient(180deg, #f7f9fc, #ffffff);
}

/* GRID */
.partner-page-steps-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  margin-top: 60px;
  position: relative;
}

/* CONNECTING LINE */
.partner-page-steps-grid::before {
  content: "";
  position: absolute;
  top: 40px;
  left: 10%;
  width: 80%;
  height: 3px;
  background: linear-gradient(to right, #4f6cff, #93c5fd);
  z-index: 0;
}

/* EACH STEP */
.partner-page-step {
  text-align: center;
  position: relative;
  z-index: 1;
}

/* CIRCLE NUMBER */
.step-number {
  width: 80px;
  height: 80px;

  margin: 0 auto 20px;

  border-radius: 50%;

  display: flex;
  align-items: center;
  justify-content: center;

  background: linear-gradient(135deg, #4f6cff, #1e235c);

  box-shadow: 0 10px 30px rgba(79, 108, 255, 0.3);

  transition: 0.3s;
}

/* ICON PERFECT CENTER */
.step-number i {
  font-size: 26px;
  color: white;

  display: flex;
  align-items: center;
  justify-content: center;

  line-height: 1;
}

/* TEXT CARD BELOW */
.partner-page-step h5 {
  font-weight: 600;
  margin-bottom: 8px;
}

.partner-page-step p {
  color: #6b7280;
  font-size: 14px;
  max-width: 200px;
  margin: auto;
}

/* ================= REQUIREMENTS ================= */

.partner-page-requirements {
  padding: 30px 0;
  background: linear-gradient(180deg, #f7f9fc, #ffffff);
}

/* CARD */
.partner-req-modern-card {
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(12px);

  padding: 25px;
  border-radius: 18px;

  border: 1px solid rgba(99, 102, 241, 0.15);

  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.05);

  transition: 0.3s;
  text-align: left;
}

/* HOVER EFFECT */
.partner-req-modern-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 50px rgba(79, 108, 255, 0.15);
}

/* TITLE */
.req-title {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 20px;

  display: flex;
  align-items: center;
  gap: 10px;
}

/* ICON IN TITLE */
.req-title i {
  color: #4f6cff;
  font-size: 26px;
}

/* LIST */
.req-list {
  list-style: none;
  padding: 0;
}

/* LIST ITEM */
.req-list li {
  display: flex;
  align-items: center;
  gap: 12px;

  padding: 10px 0;

  font-size: 15px;
  color: #374151;

  border-bottom: 1px dashed #e5e7eb;
}

/* REMOVE LAST BORDER */
.req-list li:last-child {
  border-bottom: none;
}

/* CHECK ICON */
.req-list li i {
  width: 26px;
  height: 26px;

  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 50%;

  background: linear-gradient(135deg, #4f6cff, #1e235c);
  color: white;

  font-size: 12px;
  /* 
  box-shadow: 0 5px 15px rgba(79, 108, 255, 0.3); */
}
/* CTA FOOTER*/
.partner-footer-section {
  background: var(--primary-color);
  color: white;
  padding: 10% 0 3%;
  font-size: 14px;
}

/* ================= CONTACT PAGE ================= */

/* HERO
.contact-page-hero {
  padding: 80px 0;
  background: linear-gradient(135deg, #1e235c, #3b82f6);
  color: white;
} 

.contact-page-hero h1 {
  font-size: 48px;
  font-weight: 700;
}

.contact-page-hero span {
  color: #93c5fd;
}
  */
/* -----------------*/
.contact-page-hero {
  height: 30vh;
  background:
    linear-gradient(rgba(20, 25, 80, 0.7), rgba(20, 25, 80, 0.7)),
    url("./Assets/Images/hero_aboutus.jpg") center/cover no-repeat;
}

/* TEXT */
.contact-page-heading {
  font-size: 52px;
  font-weight: 700;
  text-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
}

.contact-page-hero-subtext {
  font-size: 20px;
  color: white;
}

.contact-page-heading span {
  color: var(--span-color);
}

/*--------------*/

/* INFO CARDS */
.contact-info-section {
  padding: 30px 0;
  background: #f7f9fc;
}

.contact-card {
  background: white;
  padding: 30px;
  border-radius: 16px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
  transition: 0.3s;
  height: 100%;
}

.contact-card:hover {
  transform: translateY(-6px);
}

.contact-card i {
  font-size: 28px;
  color: white;

  width: 70px;
  height: 70px;

  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;

  background: linear-gradient(135deg, #4f6cff, #1e235c);
  border-radius: 50%;
  margin: 0 auto 15px;
  margin-bottom: 15px;
}
.contact-card a {
  color: black;
  text-decoration: none;
  font-weight: 500;
}

.contact-card a:hover {
  color: var(--primary-color);
  text-decoration: none;
}
/* =================  CONTACT FORM SECTION ================= */

.contact-form-section {
  display: block;
  /* padding: 30px 0; */
  position: relative;
  background: linear-gradient(180deg, #f7f9fc, #ffffff);
  overflow: hidden;
}

/* BACKGROUND GLOW */
.contact-form-section::before {
  content: "";
  position: absolute;
  top: 0;
  right: -100px;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, #4f6cff33, transparent 70%);
  filter: blur(80px);
  z-index: 0;
}

/* LEFT SIDE */
.contact-form-section .col-lg-5 {
  position: relative;
  z-index: 1;
}

/* TITLE */
.contact-form-section h2 {
  font-size: 42px;
  font-weight: 700;
  margin-bottom: 15px;
}

/* TEXT */
.contact-form-section p {
  color: #6b7280;
  font-size: 16px;
  max-width: 420px;
}

/* ICON LIST */
.contact-extra {
  margin-top: 25px;
}

.contact-extra p {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
  font-weight: 500;
}

/* ICON STYLE */
.contact-extra i {
  width: 36px;
  height: 36px;

  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 50%;

  background: linear-gradient(135deg, #4f6cff, #1e235c);
  color: white;

  box-shadow: 0 8px 20px rgba(79, 108, 255, 0.3);
}

/* FORM SIDE */
/* FORM CARD */
.contact-form-card {
  background: white;
  padding: 30px;
  border-radius: 16px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}

/* INPUTS */
.roundz-input {
  border-radius: 10px;
  padding: 12px 14px;
  border: 1px solid #d1d5db;
  font-size: 14px;
  transition: 0.3s;
}

.roundz-input:focus {
  border-color: #1e235c;
  box-shadow: 0 0 0 2px rgba(30, 35, 92, 0.1);
}

/* TEXTAREA FIX */
textarea.roundz-input {
  resize: none;
}

/* CHECKBOX */
.roundz-checkbox {
  margin-top: 10px;
  font-size: 14px;
}

.roundz-checkbox a {
  color: black;
  font-weight: 700;
  text-decoration: none;
}

.roundz-checkbox a:hover {
  color: var(--primary-color);
  text-decoration: underline;
}

/* BUTTON */
.contact-submit-btn {
  background: #1e235c;
  color: white;
  padding: 12px;
  border-radius: 10px;
  border: none;
  font-weight: 500;
  transition: 0.3s;
}

.contact-submit-btn:hover {
  background: #2c3180;
}

/*================================ SERVICE PAGE =================================*/
.service-page-hero {
  height: 30vh;
  background:
    linear-gradient(rgba(20, 25, 80, 0.7), rgba(20, 25, 80, 0.7)),
    url("./Assets/Images/hero_aboutus.jpg") center/cover no-repeat;
}

/* TEXT */
.service-page-heading {
  font-size: 52px;
  font-weight: 700;
  text-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
}

.service-page-hero-subtext {
  font-size: 16px;
  color: white;
}

.service-page-heading span {
  color: var(--span-color);
}

.rz-services-section {
  padding: 30px 0;
  background: linear-gradient(180deg, #f7f9fc, #ffffff);
}

.rz-services-title {
  color: var(--primary-color);
  font-size: 42px;
  font-weight: 700;
}

.rz-services-title span {
  color: #4f6cff;
}

.rz-services-sub {
  font-size: 20px;
  color: #6b7280;
  margin-top: 10px;
}

/* CARD */
.rz-service-card {
  padding: 30px;
  border-radius: 18px;

  background:
    linear-gradient(white, white) padding-box,
    linear-gradient(135deg, #4f6cff, #1e235c) border-box;

  border: 1px solid transparent;

  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
  transition: 0.3s;
}

.rz-service-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 40px rgba(79, 108, 255, 0.2);
}

/* HEADER */
.rz-service-header {
  display: flex;
  align-items: center;
  gap: 15px;
  margin-bottom: 15px;
}

.rz-service-header i {
  width: 55px;
  height: 55px;
  border-radius: 12px;

  display: flex;
  align-items: center;
  justify-content: center;

  background: linear-gradient(135deg, #4f6cff, #1e235c);
  color: white;
  font-size: 22px;
}

.rz-service-header h5 {
  margin: 0;
  font-weight: 600;
}

.rz-service-header span {
  font-size: 13px;
  color: #6b7280;
}

/* TEXT */
.rz-service-desc {
  font-size: 14px;
  color: #374151;
  margin-bottom: 15px;
}

/* LIST */
.rz-service-card ul {
  list-style: none;
  padding: 0;
}

.rz-service-card li {
  margin-bottom: 8px;
  font-size: 14px;
  color: #4b5563;
}

.rz-service-card li::before {
  content: "✔";
  color: #4f6cff;
  margin-right: 8px;
}

/* ================= CTA ================= */
.service-footer-section {
  background: var(--primary-color);
  color: white;
  padding: 10% 0 3%;
  font-size: 14px;
}
/* ================= RESPONSIVE ================= */

/* ================= 1024px ================= */
@media (max-width: 1024px) {
  /*===========================HOME PAGE=======================*/
  /* Reduce logo size */
  .nav-logo {
    height: 60px;
  }

  /* Make text single line */
  .navbar-nav .nav-link {
    white-space: nowrap;
  }

  /* Reduce button size */
  .partner-btn {
    padding: 6px 12px;
    font-size: 13px;
  }
  .hero {
    height: 50vh;
  }

  .hero h1 {
    font-size: 32px;
  }

  .stats-box {
    grid-template-columns: repeat(2, 1fr);
  }

  /* .logistics-images {
    padding-left: 5%;
  } */

  .driver-image img {
    width: 100%;
    height: auto;
  }
}

@media (max-width: 765px) {
  /*===========================HOME PAGE=======================*/
  /* NAVBAR */
  .navbar-nav {
    text-align: left;
    align-items: flex-start;
  }

  .partner-btn {
    margin-top: 10px;
  }

  /* HERO */
  .hero {
    height: auto;
    padding: 60px 0;
    text-align: center;
  }

  .hero-content {
    text-align: center;
  }

  /* DRIVER */
  .driver-content {
    padding: 40px 20px;
    text-align: center;
  }

  .driver-buttons {
    justify-content: center;
    flex-wrap: wrap;
  }

  /* HERO */
  .hero h1 {
    font-size: 26px;
  }

  .hero p {
    font-size: 14px;
  }

  /* WHY CHOOSE */
  .whychoose-title {
    font-size: 24px;
  }

  /* STATS */
  .stats-box {
    grid-template-columns: 1fr;
  }

  .stats-item {
    padding: 20px;
  }

  /* SERVICES */
  .services-title {
    font-size: 24px;
  }

  .services-list li {
    font-size: 13px;
  }

  .logistics-images {
    display: grid !important;
    grid-template-columns: 1fr 1fr; /* 2 per row */
    grid-template-rows: auto !important; /* override fixed rows */
    gap: 12px;
    padding-left: 0 !important;
  }

  .logistics-images img {
    width: 100% !important;
    height: 140px !important; /* equal size */
    object-fit: cover;
    grid-column: auto !important; /* remove nth-child layout */
    grid-row: auto !important;
  }

  .mobility-images {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }

  .mobility-images img {
    width: 100% !important;
    height: 140px !important;
    margin: 0 !important;
  }

  .services-row {
    display: flex;
    flex-direction: column;
  }

  /* Passenger section specifically */
  .services-row:nth-of-type(2) > div:first-child {
    order: 2; /* images go DOWN */
  }

  .services-row:nth-of-type(2) > div:last-child {
    order: 1; /* text goes UP */
  }
  .services-row {
    display: flex;
    flex-direction: column;
  }
  /* DRIVER */
  .driver-title {
    font-size: 26px;
  }

  /* DIFFERENCE */
  .difference-title {
    font-size: 24px;
  }

  /* APP */
  .app-title {
    font-size: 26px;
  }

  .app-buttons {
    flex-direction: column;
    align-items: center;
    padding-bottom: 30px;
  }
  .app-phone {
    width: 250px;
    height: auto;
    padding-bottom: 20px;
  }

  .app-section .col-lg-6.d-flex.align-items-center {
    justify-content: center;
    text-align: center;
  }

  /* FAQ */
  .faq-question {
    font-size: 16px;
  }

  .faq-answer {
    font-size: 14px;
  }

  /* CONTACT */
  .contact-form-section h2 {
    font-size: 28px;
  }

  .contact-form-card {
    padding: 20px;
  }
  .whatsapp-float {
    width: 40px;
    height: 40px;
  }

  /*=========================== ABOUT PAGE =====================*/
  .about-page-section .row.mt-4 {
    row-gap: 15px; /* vertical space between cards */
  }
  .about-page-section .row.text-center {
    row-gap: 15px;
  }

  /* MAIN CARD */
  .about-page-cta-section .container {
    padding: 30px 20px;
    border-radius: 10px;
    text-align: center;
  }

  /* HEADING */
  .about-page-cta-section h2 {
    font-size: 26px;
    line-height: 1.3;
  }

  /* SUBTEXT */
  .about-page-cta-section p {
    font-size: 14px;
    line-height: 1.6;
  }

  /* BUTTONS STACK */
  .about-page-cta-section .btn {
    margin-bottom: 12px;
  }

  /* BUTTON CONTAINER */
  .about-page-cta-section .d-flex {
    flex-direction: column;
    align-items: center;
  }
  .about-page-cta-section {
    margin-bottom: 10px; /* remove overlap */
  }

  .about-footer-section {
    padding-top: 20px; /* give space above footer */
  }
  /* FOOTER */
  .footer-bottom {
    flex-direction: column;
    gap: 10px;
    text-align: center;
  }

  /*==========================  WHY ROUNDZ PAGE =====================*/
  .why-page-heading {
    font-size: 28px;
    line-height: 1.3;
  }

  .why-page-heading-subtext {
    font-size: 14px;
  }

  .why-page-hero {
    height: auto;
    padding: 50px 0;
    text-align: center;
  }

  /*==========================PARTNERS PAGE ============*/
  /* ================= HERO ================= */
  .partner-page-title {
    font-size: 30px;
    text-align: center;
  }

  .partner-hero-page-subtext {
    text-align: center;
    font-size: 14px;
  }
  .partner-page-stats-grid {
    padding-top: 30px;
  }

  .partner-page-buttons {
    flex-direction: column;
    align-items: center;
  }

  .partner-page-buttons a {
    width: 100%;
    text-align: center;
  }

  /* ================= STATS ================= */
  .partner-page-stats-grid {
    grid-template-columns: 1fr; /* stack */
    gap: 12px;
  }

  .partner-page-stat-card {
    padding: 12px;
  }

  /* ================= BENEFITS ================= */
  .partner-page-benefits .row {
    flex-direction: column;
  }

  .partner-page-benefit-card {
    margin-bottom: 15px;
  }

  /* ================= STEPS ================= */
  .partner-page-steps-grid {
    grid-template-columns: 1fr; /* stack vertically */
    gap: 30px;
  }

  /* REMOVE LINE */
  .partner-page-steps-grid::before {
    display: none;
  }

  .step-number {
    width: 70px;
    height: 70px;
  }

  /* ================= REQUIREMENTS ================= */
  .partner-page-requirements .row {
    flex-direction: column;
  }

  .partner-req-modern-card {
    margin-bottom: 15px;
  }

  /* ================= CTA ================= */
  .about-page-cta-section .container {
    padding: 30px 15px;
  }

  .about-page-cta-section h2 {
    font-size: 22px;
  }

  /* ================= GENERAL FIX ================= */
  h2 {
    font-size: 24px !important;
  }

  h5 {
    font-size: 16px;
  }

  p {
    font-size: 13px;
  }
}

/* ================= 576px ================= */
@media (max-width: 576px) {
  /*===========================HOME PAGE=======================*/
  /* HERO */
  .hero {
    padding: 50px 15px;
  }

  .hero h1 {
    font-size: 22px;
  }

  /* BUTTON */
  .book-btn {
    width: 100%;
  }

  /* WHY CHOOSE */
  .whychoose-card {
    padding: 20px;
  }

  /* STATS */
  .stats-title {
    font-size: 22px;
  }

  /* SERVICES */
  .services-title {
    text-align: center;
  }

  /* DRIVER */
  .driver-buttons {
    flex-direction: column;
  }

  /* DIFFERENCE */
  .difference-buttons {
    flex-direction: column;
  }

  /* FOOTER */
  .footer-contact-row {
    grid-template-columns: 1fr;
  }

  .footer-links {
    /* text-align: center; */
    margin-top: 20px;
  }

  /* CONTACT */
  .contact-card {
    padding: 20px;
  }
}

/* ================= 425px ================= */
@media (max-width: 425px) {
  /*===========================HOME PAGE=======================*/
  .hero h1 {
    font-size: 20px;
  }

  .hero p {
    font-size: 13px;
  }

  .app-title {
    font-size: 22px;
  }

  .contact-page-heading {
    font-size: 30px;
  }

  .service-page-heading {
    font-size: 30px;
  }

  .about-page-heading {
    font-size: 30px;
  }
}

/* ================= 375px ================= */
@media (max-width: 375px) {
  /*===========================HOME PAGE=======================*/
  .hero h1 {
    font-size: 18px;
  }

  .stats-item h3 {
    font-size: 24px;
  }

  .contact-form-section h2 {
    font-size: 24px;
  }

  /* HEADER FIX */
  .why-page-compare-header {
    grid-template-columns: 1fr; /* stack */
    text-align: center;
    gap: 10px;
  }
  /* ==================WHY ROUNDZ PAGE ===========================*/
  /* ROW FIX */
  .why-page-compare-row {
    display: flex;
    flex-direction: column;
    gap: 10px;
    text-align: center;
    padding: 15px;
  }

  /* EACH COLUMN FULL WIDTH */
  .why-page-compare-row span {
    width: 100%;
    display: block;
  }

  /* FEATURE TITLE */
  .why-page-compare-row span:first-child {
    font-weight: 600;
    color: #1b2259;
    margin-bottom: 5px;
  }

  /* ROUNDZ & OTHERS ALIGN CENTER */
  .roundz-col,
  .others-col {
    justify-content: center;
  }
}

/* ================= 320px ================= */
@media (max-width: 320px) {
  /*===========================HOME PAGE=======================*/
  .hero h1 {
    font-size: 16px;
  }

  .book-btn {
    font-size: 12px;
    padding: 8px;
  }

  .partner-btn {
    font-size: 12px;
    padding: 6px 10px;
  }

  .contact-submit-btn {
    font-size: 14px;
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  .services-section .container {
    max-width: 770px;
  }
  .services-list {
    max-width: 90%;
  }
  .services-row {
    display: flex;
    flex-direction: row;
  }
  .services-section .col-lg-5 {
    padding-right: 0;
  }
  .services-section .col-lg-7 {
    padding-left: 0;
  }
  .logistics-images {
    padding-left: 0;
  }
  .services-row > div {
    width: 50%;
  }

  .logistics-images {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    padding-left: 0;
  }

  .logistics-images img {
    height: 100% !important;
  }

  .mobility-images {
    display: flex;
    flex-direction: column; /* STACK */
    gap: 16px;
    flex-direction: column;
    align-items: center;
  }

  .mobility-images img {
    margin: 0 !important;
  }
  .mobility-images img:first-child {
    width: 220px;
    height: 200px;
  }
  .mobility-images img:last-child {
    width: 220px;
    height: 200px;
  }

  /* FULL SECTION CONTROL */
  .driver-section {
    overflow: hidden;
  }

  .driver-section .row {
    display: flex;
    align-items: stretch;
  }

  /* LEFT SIDE (TEXT) */
  .driver-content {
    width: 50%;
    padding: 20px 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  /* RIGHT SIDE (IMAGE) */
  .driver-image {
    width: 50%;
    padding: 0;
    height: auto;
  }

  .driver-image img {
    width: 105%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  .app-section .col-lg-6.d-flex.align-items-center {
    justify-content: center;
    text-align: center;
  }
  .app-buttons {
    padding-bottom: 20px;
  }
  .app-small {
    padding-top: 20px;
  }
  .whatsapp-float {
    width: 35px;
    height: 35px;
  }
  /*=========================== ABOUT US PAGE ==========================*/
  .about-page-who .row {
    display: flex;
    flex-direction: row;
    align-items: center;
  }

  .about-page-who .row > div {
    width: 50%;
  }

  /* Move image to right */
  .about-page-who .col-lg-6:last-child {
    display: flex;
    justify-content: flex-end;
  }

  .about-page-image {
    width: 100%;
    max-width: 400px;
    height: 230px;
    object-fit: cover;
    border-radius: 16px;
  }
  .about-page-offer-card {
    padding: 10px;
  }
  .about-page-feature-box {
    width: 100%;
    height: 100%; /* same height */
    min-height: 140px;

    display: flex;
    flex-direction: column;
    justify-content: center; /* vertical center */
    align-items: center;

    text-align: center;
    padding: 20px;
  }

  /* Make cards equal */
  .exist-card {
    width: 100%;
    height: 100%;
    min-height: 240px;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    text-align: center;
    padding: 20px;
  }
  .about-page-mission-card {
    width: 100%;
    height: 100%;
    min-height: 240px;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    text-align: center;
    padding: 20px;
  }

  /* Make footer row behave like desktop */
  .about-footer-section .footer-top {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  /* Left section */
  .about-footer-section .col-lg-6 {
    width: 50%;
  }

  /* Right sections (Company + Quick Links) */
  .about-footer-section .col-lg-3 {
    width: 25%;
  }

  /* Align properly */
  .footer-links {
    margin-top: 0;
  }

  /* Reduce spacing */
  .footer-desc {
    max-width: 100%;
  }

  /* Keep contact compact */
  .footer-contact-row {
    gap: 12px;
  }
  .about-footer-section {
    padding-top: 15%;
  }
  .footer-social {
    margin-right: 30px;
  }

  /*============================ SERVICE PAGE=================== */
  /* Make footer row behave like desktop */
  .service-footer-section .footer-top {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  /* Left section */
  .service-footer-section .col-lg-6 {
    width: 50%;
  }

  /* Right sections (Company + Quick Links) */
  .service-footer-section .col-lg-3 {
    width: 25%;
  }

  /* Align properly */
  .footer-links {
    margin-top: 0;
  }

  /* Reduce spacing */
  .footer-desc {
    max-width: 100%;
  }

  /* Keep contact compact */
  .footer-contact-row {
    gap: 12px;
  }
  .service-footer-section {
    padding-top: 15%;
  }
  .footer-social {
    margin-right: 30px;
  }
  /*============================ WHY ROUNDZ PAGE=================== */
  .why-page-section .row {
    display: flex;
    flex-wrap: wrap;
  }

  .why-page-section .col-md-4 {
    display: flex;
  }

  .why-page-card {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    width: 100%;
    height: 100%;
    min-height: 220px;
    text-align: center;
  }
  /* FOOTER */
  /* Make footer row behave like desktop */
  .footer-section .footer-top {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  /* Left section */
  .footer-section .col-lg-6 {
    width: 50%;
  }

  /* Right sections (Company + Quick Links) */
  .footer-section .col-lg-3 {
    width: 25%;
  }

  /* Align properly */
  .footer-links {
    margin-top: 0;
  }

  /* Reduce spacing */
  .footer-desc {
    max-width: 100%;
  }

  /* Keep contact compact */
  .footer-contact-row {
    gap: 12px;
  }

  .footer-social {
    margin-right: 30px;
  }

  /*==========================PARTNERS PAGE ============*/
  /* ================= HERO LAYOUT ================= */
  .partner-page-hero .row {
    display: flex;
    align-items: center;
  }

  .partner-page-hero .col-lg-6 {
    width: 50%;
  }

  /* ================= TEXT SIDE ================= */
  .partner-page-title {
    font-size: 38px;
  }

  .partner-hero-page-subtext {
    font-size: 15px;
    max-width: 90%;
  }

  /* ================= BUTTONS ================= */
  .partner-page-buttons {
    flex-direction: row;
    gap: 15px;
  }

  /* ================= STATS GRID ================= */
  .partner-page-stats-grid {
    grid-template-columns: repeat(2, 1fr); /* same as desktop */
    gap: 16px;
  }

  .partner-page-stat-card {
    padding: 18px;
  }
  .partner-page-benefits .row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }

  .partner-page-benefits .col-md-3 {
    width: 50%; /* 2 cards per row */
    margin-bottom: 20px;
  }

  .partner-page-benefit-card {
    height: 100%; /* equal height */
    padding: 25px 20px;
    text-align: center;
  }
  /* Make footer row behave like desktop */
  .partner-footer-section .footer-top {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  /* Left section */
  .partner-footer-section .col-lg-6 {
    width: 50%;
  }

  /* Right sections (Company + Quick Links) */
  .partner-footer-section .col-lg-3 {
    width: 25%;
  }

  /* Align properly */
  .footer-links {
    margin-top: 0;
  }

  /* Reduce spacing */
  .footer-desc {
    max-width: 100%;
  }

  /* Keep contact compact */
  .footer-contact-row {
    gap: 12px;
  }
  .partner-footer-section {
    padding-top: 15%;
  }
  .footer-social {
    margin-right: 30px;
  }
}
