

/* =========================================================
   HOME PAGE ONLY  (enqueued only on the Homepage template)
   ========================================================= */

/* =========================================================
   HERO
   ========================================================= */
.mb-hero{position:relative;overflow:hidden;background:#0d1626;}
.mb-hero-track{display:flex;transition:transform .6s cubic-bezier(.65,.05,.36,1);}
.mb-slide{position:relative;min-width:100%;height:640px;display:flex;align-items:center;}
.mb-slide-bg{position:absolute;inset:0;background-size:cover;background-position:center;z-index:0;}
.mb-slide-bg::after{content:'';position:absolute;inset:0;background:linear-gradient(100deg,rgba(255,255,255,.96) 0%,rgba(255,255,255,.85) 32%,rgba(255,255,255,.35) 60%,rgba(255,255,255,0) 82%);}
.mb-slide-inner{position:relative;z-index:2;}
.mb-slide-content{max-width:700px;}
.mb-slide-content h1{font-family:var(--serif);font-size:clamp(2.2rem,4vw,3.5rem);font-weight:800;line-height:1.08;color:var(--navy);letter-spacing:-.5px;margin-bottom:18px;}
.mb-slide-desc{font-size:1rem;color:#39404f;line-height:1.65;max-width:430px;margin-bottom:28px;font-weight:500;}
.mb-slide-btns{display:flex;gap:14px;flex-wrap:wrap;}
.mb-hero-arrow{
  position:absolute;
  top:75%;
  transform:translateY(-50%);
  width:46px;height:46px;
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;z-index:5;

  /* translucent glass fill */
  background:rgba(255,255,255,.18);
  /* the key: frosted backdrop blur (Safari/iOS need -webkit-) */
  -webkit-backdrop-filter:blur(14px) saturate(180%);
  backdrop-filter:blur(14px) saturate(180%);

  /* thin light edge + layered glass shadows */
  border:1px solid rgba(255,255,255,.35);
  box-shadow:
    0 4px 18px rgba(0,0,0,.18),                /* outer soft drop */
    inset 0 1px 1px rgba(255,255,255,.55),     /* top inner highlight */
    inset 0 -2px 6px rgba(255,255,255,.12);    /* bottom inner glow */

  transition:background .25s ease, box-shadow .25s ease, transform .25s ease;
}

/* glossy specular sheen on top */
.mb-hero-arrow::before{
  content:"";
  position:absolute;inset:0;
  border-radius:50%;
  background:linear-gradient(160deg,rgba(255,255,255,.45) 0%,rgba(255,255,255,0) 42%);
  pointer-events:none;
}

/* keep the icon readable on glass */
.mb-hero-arrow svg,
.mb-hero-arrow i{
  position:relative;z-index:1;
  color:#fff;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.35));
}

/* hover: brighten the glass slightly */
.mb-hero-arrow:hover{
  background:rgba(255,255,255,.28);
  transform:translateY(-50%) scale(1.05);
  box-shadow:
    0 6px 22px rgba(0,0,0,.22),
    inset 0 1px 1px rgba(255,255,255,.65),
    inset 0 -2px 6px rgba(255,255,255,.15);
}
.mb-hero-prev{left:24px;}.mb-hero-next{right:24px;}
.mb-hero-dots{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);display:flex;gap:9px;z-index:5;}
.mb-dot{width:10px;height:10px;border-radius:50%;background:rgba(22,36,63,.28);border:none;cursor:pointer;transition:.25s;}
.mb-dot.active{background:var(--red);width:28px;border-radius:5px;}
.mb-hero.is-single .mb-hero-arrow,.mb-hero.is-single .mb-hero-dots{display:none;}

/* =========================================================
   SEARCH BAR
   ========================================================= */
.mb-search{position:relative;z-index:20;margin-top:-113px;overflow:hidden;}
.mb-search-tabs{display:inline-flex;padding:0 24px;background:var(--navy); }
.mb-search-tab{background:none;border:none;border-bottom:3px solid transparent;color:rgba(255,255,255,.55);font-family:inherit;font-weight:700;font-size:.82rem;letter-spacing:.6px;padding:15px 16px;cursor:pointer;transition:all .2s;}
.mb-search-tab:hover{color:#fff;}
.mb-search-tab.active{color:#fff;border-bottom-color:var(--red);}
.mb-search-wrap{padding:20px 24px;  background:var(--navy); }
.mb-search-inner{display:flex;gap:12px;}
.mb-search-field{flex:1;min-width:0;background:#fff;border-radius:6px;padding:8px 14px;}
.mb-search-field label{display:block;font-size:.7rem;color:#888;font-weight:600;margin-bottom:1px;}
.mb-sel{position:relative;}
.mb-sel select{appearance:none;-webkit-appearance:none;background:none;border:none;width:100%;font-family:inherit;font-size:.9rem;font-weight:600;color:#222;outline:none;cursor:pointer;padding:4px 28px 4px 6px;}
.mb-sel::after{content:'';position:absolute;right:12px;top:48%;width:7px;height:7px;border-right:2px solid #aaa;border-bottom:2px solid #aaa;transform:translateY(-50%) rotate(45deg);pointer-events:none;}
.mb-search-btn{background:var(--red);color:#fff;border:none;padding:14px 26px;font-size:.8rem;font-weight:700;letter-spacing:.6px;text-transform:uppercase;border-radius:6px;cursor:pointer;display:flex;align-items:center;gap:9px;white-space:nowrap;transition:background .2s;}
.mb-search-btn:hover{background:var(--red-dark);}
.mb-search-btn svg{width:16px;height:16px;}

/* =========================================================
   FEATURES STRIP
   ========================================================= */
.mb-features{
  display:flex;
  background:#fff;
  border:1px solid var(--line);              /* --line: #ECECEC */
  border-radius:12px;
  margin-top:36px;
  box-shadow:0 10px 40px rgba(0,0,0,.06);     /* soft, wide shadow (same as ref) */
  overflow:hidden;
}
.mb-feature{
  position:relative;
  flex:1;
  text-align:center;
  padding:34px 18px;
}
/* the divider line — inset, does NOT touch top/bottom edges */
.mb-feature::before{
  content:"";
  position:absolute;
  left:0;
  top:30px;
  bottom:30px;
  width:1px;
  background:var(--line);                      /* same faint #ECECEC */
}
.mb-feature:first-child::before{display:none;} /* no line before the first item */

.mb-feature-ic{
  margin-bottom:14px;
  display:flex;
  justify-content:center;
  color:var(--red);                            /* --red: #E1485A → makes the icons red */
}
.mb-feature-ic svg,
.mb-feature-ic img{width:40px;height:40px;}

.mb-feature h3{font-size:1.15rem;font-weight:700;color:var(--ink);margin:0 0 6px;}
.mb-feature p{font-size:.95rem;color:var(--gray);line-height:1.5;margin:0;}

/* =========================================================
   SERVICES
   ========================================================= */
.mb-services{padding:60px 0;}
.mb-services-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:22px;}
.mb-service-card{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;transition:transform .2s,box-shadow .2s;}
.mb-service-card:hover{transform:translateY(-5px);box-shadow:0 16px 40px rgba(0,0,0,.1);}
.mb-service-img{position:relative;height:150px;overflow:hidden;}
.mb-service-img img{width:100%;height:100%;object-fit:cover;}
.mb-service-ic{position:absolute;left:18px;top: -26px;z-index:2;width:46px;height:46px;border-radius:50%;background:var(--red);display:flex;align-items:center;justify-content:center;box-shadow:0 6px 16px rgba(192,57,43,.4);}
.mb-service-body{padding:30px 20px 22px; position: relative; }
.mb-service-body h3{font-size:1.4rem;font-weight:700;color:var(--ink);margin-bottom:8px;}
.mb-service-body p{font-size:1rem;color:var(--gray);line-height:1.6;margin-bottom:14px;min-height:62px;}
.mb-learn{display:inline-flex;align-items:center;gap:6px;font-size:.74rem;font-weight:700;letter-spacing:.6px;color:var(--red);transition:gap .2s;}
.mb-learn:hover{gap:11px;}

/* =========================================================
   ABOUT
   ========================================================= */
.mb-about{padding:64px 0;}
.mb-about-grid{display:grid;grid-template-columns:1fr 1.05fr .85fr;gap:36px;align-items:center;}

.mb-about-left h2{font-family:var(--serif);font-size:1.9rem;font-weight:800;color:var(--navy);line-height:1.15;margin-bottom:14px;}
.mb-about-left > p{font-size:.88rem;color:var(--gray);line-height:1.7;margin-bottom:18px;}

.mb-about-mid img{border-radius:12px;width:100%;height:340px;object-fit:cover;box-shadow:0 14px 40px rgba(0,0,0,.14);}
.mb-about-right{background:var(--soft);border-radius:12px;padding:30px 26px;}
.mb-about-right h3{font-size:1.1rem;font-weight:800;color:var(--navy);margin-bottom:18px;}
.mb-why{display:flex;flex-direction:column;gap:14px;margin-bottom:18px;}
.mb-why li{display:flex;align-items:center;gap:12px;font-size:.86rem;font-weight:500;color:var(--ink);}
.mb-why-ic{width:34px;height:34px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(0,0,0,.06);flex-shrink:0;}
.mb-why-tagline{font-size:.95rem;font-weight:700;color:var(--red);}

.mb-slide-tag{display:inline-block;font-size:.82rem;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--red);margin:0 0 12px;}

/* ---- HOME RESPONSIVE ---- */
@media(max-width:1100px){
  .mb-services-grid{grid-template-columns:repeat(3,1fr);}
  .mb-about-grid{grid-template-columns:1fr 1fr;}
  .mb-about-right{grid-column:1/-1;}
}
@media(max-width:820px){
  .mb-search {     margin-top: -100px; }
  .mb-features{flex-wrap:wrap;}
  .mb-feature{flex:0 0 50%;border-bottom:1px solid var(--line);}
  .mb-feature:nth-child(2n){border-right:none;}
  .mb-services-grid{grid-template-columns:repeat(2,1fr);}
  .mb-about-grid{grid-template-columns:1fr;}
  .mb-search-inner{flex-wrap:wrap;}
  .mb-search-field{flex:0 0 47%;}
  .mb-search-btn{width:100%;justify-content:center;}
  .mb-slide{height:auto;min-height:530px;padding:50px 0; align-items: start;}
  .mb-slide-bg::after{background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(255,255,255,.7));}
}
@media(max-width:540px){
  .mb-service-body p{min-height:auto;}
  .mb-services-grid{grid-template-columns:1fr;}
  .mb-feature{flex:0 0 100%;border-right:none;}
}

/* =========================================================
   LARGE SCREENS 1600px → 1920px — bigger, more readable type.
   NOTE: the hero/banner (.mb-hero / .mb-slide*) is intentionally
   left out so its design is not affected at all.
   ========================================================= */
@media(min-width:1600px){
  /* Section headings */
  .mb-home .mb-sec-head h2{font-size:2.4rem;}

  /* Features strip */
  .mb-feature h3{font-size:1.38rem;}
  .mb-feature p{font-size:1.12rem;}

  /* Services cards */
  .mb-service-body h3{font-size:1.62rem;}
  .mb-service-body p{font-size:1.12rem;}
  .mb-learn{font-size:.82rem;}

  /* About block */
  .mb-about-left h2{font-size:2.3rem;}
  .mb-about-left > p{font-size:1.02rem;}
  .mb-about-right h3{font-size:1.28rem;}
  .mb-why li{font-size:.98rem;}
  .mb-why-tagline{font-size:1.08rem;}
}