/* =====================================================
   HERO SECTION – COMPACT & PREMIUM
===================================================== */
.hero-apple{
  position:relative;
  padding:90px 0 60px;
  background:
    url("https://sastitaxi.com/public/IMG_20250922_102734_296.jpg")
    center / cover no-repeat;
}

.hero-light-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(
    180deg,
    rgba(255,255,255,.97),
    rgba(255,255,255,.88)
  );
}

.hero-content{
  position:relative;
  z-index:2;
}

.hero-intro{
  text-align:center;
  max-width:720px;
  margin:0 auto;
}

.hero-intro h1{
  font-size:34px;
  font-weight:800;
  line-height:1.2;
  margin-bottom:10px;
}

.hero-intro h1 span{
  color:var(--accent);
}

.hero-intro p{
  font-size:15px;
  color:#475569;
  margin-bottom:16px;
}

.hero-badges{
  display:flex;
  justify-content:center;
  gap:12px;
  flex-wrap:wrap;
}

.hero-badges span{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.75);
  backdrop-filter:blur(10px);
  font-size:12px;
  font-weight:600;
}

.hero-badges i{
  color:var(--accent);
}

/* =====================================================
   INFO SECTIONS
===================================================== */
.info-sections{
  padding:80px 0;
  background:linear-gradient(180deg,#f8fafc,#ffffff);
}

.info-block{
  margin-bottom:90px;
}

.info-block h2{
  font-size:32px;
  font-weight:800;
  margin-bottom:14px;
}

.info-block h2 span{
  color:var(--accent);
}

.info-block p.lead{
  font-size:16px;
  color:#334155;
  margin-bottom:12px;
}

.info-block p{
  font-size:15px;
  color:#475569;
}

/* =====================================================
   INFO POINTS
===================================================== */
.info-points{
  list-style:none;
  padding:0;
  margin:18px 0 24px;
}

.info-points li{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:10px;
  font-size:14px;
  font-weight:600;
}

.info-points i{
  color:var(--accent);
  font-size:16px;
}

/* =====================================================
   GLASS IMAGE CARD
===================================================== */
.glass-image-card{
  border-radius:26px;
  overflow:hidden;
  background:rgba(255,255,255,.6);
  backdrop-filter:blur(14px);
  box-shadow:var(--shadow-soft);
  transition:.4s ease;
}

.glass-image-card:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow-deep);
}

.glass-image-card img{
  width:100%;
  height:100%;
  object-fit:cover;
}

/* =====================================================
   MISSION & VISION – INLINE ICON + TITLE
===================================================== */
.mission-vision{
  margin-top:80px;
}

.mv-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:28px;
}

.mv-card{
  position:relative;
  padding:34px 32px 38px;
  border-radius:28px;

  background:linear-gradient(
    180deg,
    rgba(255,255,255,.82),
    rgba(255,255,255,.62)
  );
  backdrop-filter:blur(26px) saturate(160%);
  border:1px solid var(--glass-border);

  box-shadow:var(--shadow-soft);
  transition:.45s cubic-bezier(.2,.8,.2,1);
}

.mv-card::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  padding:1px;
  background:linear-gradient(
    135deg,
    rgba(48,104,124,.55),
    rgba(96,165,250,.35),
    transparent 60%
  );
  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;
          mask-composite:exclude;
}

.mv-card:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow-deep);
}

/* HEADER ROW */
.mv-head{
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:14px;
}

/* ICON */
.mv-icon{
  width:50px;
  height:50px;
  border-radius:16px;
  background:var(--accent-grad);
  color:#fff;

  display:flex;
  align-items:center;
  justify-content:center;

  font-size:22px;
  flex-shrink:0;

  box-shadow:0 12px 26px rgba(48,104,124,.45);
}

/* TITLE */
.mv-head h3{
  font-size:22px;
  font-weight:800;
  margin:0;
  line-height:1.2;
}

.mv-head h3 span{
  color:var(--accent);
}

/* TEXT */
.mv-card p{
  font-size:15px;
  line-height:1.7;
  color:#475569;
}

/* TAG */
.mv-tag{
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin-top:18px;
  padding:6px 14px;
  border-radius:999px;
  font-size:12px;
  font-weight:700;
  background:rgba(48,104,124,.1);
  color:var(--accent);
}

/* =====================================================
   TRUST / COMPANY BANNER
===================================================== */
.driver-banner{
  background:linear-gradient(135deg,#0f172a,#1e293b);
  color:#fff;
  padding:80px 0;
  text-align:center;
}

.driver-banner h2{
  font-size:34px;
  font-weight:800;
  margin-bottom:16px;
}

.hinglish-text{
  font-size:16px;
  max-width:780px;
  margin:0 auto 26px;
  line-height:1.7;
  opacity:.95;
}

/* =====================================================
   BUTTON
===================================================== */
.btn-driver{
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:#22c55e;
  color:#fff;
  padding:14px 30px;
  border-radius:999px;
  font-weight:800;
  text-decoration:none;
  box-shadow:0 14px 30px rgba(34,197,94,.35);
  transition:.25s ease;
}

.btn-driver:hover{
  opacity:.95;
  transform:translateY(-1px);
}

/* =====================================================
   RESPONSIVE
===================================================== */
@media(max-width:991px){
  .hero-intro h1{font-size:30px}
  .info-block h2{font-size:28px}
  .driver-banner h2{font-size:28px}
}

@media(max-width:768px){
  .hero-apple{padding:70px 0 46px}
  .hero-intro h1{font-size:26px}
  .info-sections{padding:70px 0}
  .info-block{margin-bottom:70px}

  .mv-grid{
    grid-template-columns:1fr;
    gap:22px;
  }

  .mv-card{
    padding:28px 24px 32px;
  }
}

@media(max-width:420px){
  .hero-intro h1{font-size:24px}
  .driver-banner h2{font-size:24px}
  .mv-head h3{font-size:20px}
}
/* =====================================================
   MISSION & VISION – APPLE PREMIUM
===================================================== */

.mission-vision{
  margin-top:90px;
}

/* GRID */
.mv-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:32px;
}

/* CARD */
.mv-card{
  position:relative;
  padding:34px 32px 36px;
  border-radius:26px;

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.86),
      rgba(255,255,255,.68)
    );

  backdrop-filter:blur(28px) saturate(160%);
  -webkit-backdrop-filter:blur(28px) saturate(160%);

  border:1px solid rgba(255,255,255,.45);

  box-shadow:
    0 32px 80px rgba(0,0,0,.14),
    inset 0 1px 0 rgba(255,255,255,.65);

  transition:
    transform .4s cubic-bezier(.2,.8,.2,1),
    box-shadow .4s ease;
}

/* SOFT GRADIENT EDGE */
.mv-card::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  padding:1px;

  background:linear-gradient(
    135deg,
    rgba(48,104,124,.55),
    rgba(96,165,250,.35),
    transparent 65%
  );

  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;
          mask-composite:exclude;

  pointer-events:none;
}

/* HOVER (DESKTOP ONLY) */
@media (hover:hover){
  .mv-card:hover{
    transform:translateY(-5px);
    box-shadow:
      0 50px 120px rgba(0,0,0,.18),
      inset 0 1px 0 rgba(255,255,255,.75);
  }
}

/* =====================================================
   HEADER ROW (ICON + TITLE INLINE)
===================================================== */

.mv-head{
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:14px;
}

/* ICON */
.mv-icon{
  width:48px;
  height:48px;
  border-radius:14px;

  background:var(--accent-grad);
  color:#fff;

  display:flex;
  align-items:center;
  justify-content:center;

  font-size:21px;
  flex-shrink:0;

  box-shadow:
    0 10px 24px rgba(48,104,124,.45),
    inset 0 1px 0 rgba(255,255,255,.35);
}

/* TITLE */
.mv-head h3{
  font-size:22px;
  font-weight:800;
  line-height:1.25;
  margin:0;
  letter-spacing:-.2px;
}

.mv-head h3 span{
  color:var(--accent);
}

/* =====================================================
   TEXT
===================================================== */

.mv-card p{
  font-size:15px;
  line-height:1.75;
  color:#475569;
  margin:0;
}

/* =====================================================
   TAG (OPTIONAL)
===================================================== */

.mv-tag{
  display:inline-flex;
  align-items:center;
  gap:6px;

  margin-top:18px;
  padding:6px 14px;

  border-radius:999px;
  font-size:12px;
  font-weight:700;

  background:rgba(48,104,124,.1);
  color:var(--accent);
}

/* =====================================================
   RESPONSIVE
===================================================== */

@media(max-width:991px){
  .mv-grid{
    gap:26px;
  }
}

@media(max-width:768px){

  .mv-grid{
    grid-template-columns:1fr;
    gap:22px;
  }

  .mv-card{
    padding:30px 26px 32px;
  }

  .mv-head h3{
    font-size:20px;
  }

}

@media(max-width:420px){

  .mv-icon{
    width:44px;
    height:44px;
    font-size:20px;
  }

  .mv-head{
    gap:12px;
  }

}