/* ============ Bangla Typography ============ */
html, body { font-family: "Noto Sans Bengali", "Noto Sans", sans-serif; }

:root{
  --navy:#061b3a;
  --blue:#087df2;
  --cyan:#19c9ff;
  --text:#16365f;
  --muted:#68809f;
  --line:#dce8f5;
  --soft:#f4f9ff;
  --white:#fff;
  --shadow:0 18px 50px rgba(6,44,94,.10);
}

*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; scroll-padding-top:115px; }
body{
  font-family:Inter, Arial, sans-serif;
  color:var(--text);
  background:#fff;
  line-height:1.55;
  font-size:16px;
  word-break:normal;
  overflow-wrap:anywhere;
  overflow-x:hidden;
}
a{ text-decoration:none; color:inherit; }
button, input, select{ font:inherit; }
.container{ width:min(1160px,92%); margin:auto; }

/* ============ HEADER / NAV ============ */
.site-header{ position:sticky; top:0; z-index:100; background:#fff; box-shadow:0 6px 25px rgba(4,32,68,.08); }
.top-link-bar{ background:#03152f; color:#bcd4ef; font-size:12px; }
.top-link-inner{ min-height:36px; display:flex; align-items:center; justify-content:space-between; }
.top-links{ display:flex; gap:25px; }
.top-links a{ padding:9px 0; opacity:.8; }
.top-links a:hover, .top-links a.active{ color:#fff; opacity:1; }
.top-info{ display:flex; gap:18px; }
.top-info span{ display:flex; align-items:center; gap:6px; }
.main-nav-row{ background:rgba(255,255,255,.98); }
.nav-wrap{ height:76px; display:flex; align-items:center; gap:34px; }
.brand{ display:flex; align-items:center; gap:10px; margin-right:auto; min-width:250px; }
.brand img{ width:54px; height:54px; object-fit:contain; }
.brand strong{ display:block; color:var(--navy); font-size:14px; letter-spacing:.2px; }
.brand span{ display:block; color:#7790ad; font-size:10px; margin-top:2px; }
.main-nav{ display:flex; align-items:center; gap:28px; font-size:13px; font-weight:700; }
.main-nav a{ position:relative; padding:29px 0; }
.main-nav a:after{
  content:""; position:absolute; left:0; right:0; bottom:20px;
  height:2px; background:var(--blue); transform:scaleX(0); transition:.2s;
}
.main-nav a:hover:after, .main-nav a.active:after{ transform:scaleX(1); }
.nav-actions{ margin-left:5px; display:flex; align-items:center; gap:10px; }
.nav-login{ font-size:12px; font-weight:800; color:var(--navy); padding:10px 8px; white-space:nowrap; }
.nav-login:hover{ color:var(--blue); }
.menu-btn{
  display:none; border:0; background:#edf6ff; color:var(--blue);
  width:40px; height:40px; border-radius:12px; cursor:pointer;
}

/* ============ BUTTONS ============ */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  border:1px solid transparent; border-radius:12px;
  padding:11px 18px; font-size:13px; font-weight:800;
  cursor:pointer; transition:.2s;
}
.btn-primary{ background:var(--blue); color:#fff; box-shadow:0 10px 24px rgba(8,125,242,.23); }
.btn-primary:hover{ transform:translateY(-2px); box-shadow:0 14px 30px rgba(8,125,242,.3); }
.btn-white{ background:#fff; color:var(--blue); }
.btn-outline{ border-color:#b9d4ef; background:#fff; color:var(--blue); }
.btn-small{ padding:10px 15px; }
.btn-lg{ padding:14px 21px; }

/* ============ HERO BANNER + SEARCH WRAP ============ */
.hero-banner-wrap{
  position:relative;
  background:#fff;
  padding-bottom:30px;
}

.hero-banner{
  position:relative;
  width:100%;
  overflow:hidden;
  line-height:0;
}

.hero-banner-img{
  display:block;
  width:100%;
  height:auto;
  max-height:600px;
  object-fit:cover;
  object-position:center;
}

/* Search panel OVERLAPS the bottom of the banner */
.search-section{
  position:relative;
  z-index:20;
  margin-top:-70px;
}

.search-panel{
  display:grid;
  grid-template-columns:31% 1fr;
  gap:24px;
  align-items:center;
  background:#fff;
  border:1px solid #dce9f7;
  border-radius:20px;
  padding:22px 25px;
  box-shadow:0 20px 55px rgba(6,44,94,.18);
}
.search-intro h2{ font-size:22px; line-height:1.2; color:var(--navy); }
.search-intro p{ font-size:12px; color:var(--muted); margin-top:5px; }
.search-kicker{ font-size:10px; letter-spacing:1.4px; color:var(--blue); font-weight:800; }

.search-form{
  display:grid;
  grid-template-columns:1fr 170px 160px 100px;
  gap:9px;
  position:relative;
}
.search-field, .select-field{
  height:48px; border:1px solid #d5e4f3; border-radius:11px;
  display:flex; align-items:center; background:#fbfdff;
}
.search-field > i, .select-field > i{ color:#6f91b5; margin:0 12px; }
.search-field input, .select-field select{
  border:0; outline:0; background:transparent; width:100%;
  color:var(--text); font-size:12px;
}
.select-field select{ padding-right:10px; }
.search-field button{
  border:0; background:none; color:#91a8c1; cursor:pointer; padding:0 13px;
}
.search-field button[hidden]{ display:none; }
.search-submit{ border-radius:11px; }
.search-status{ grid-column:1/-1; color:#5d7797; font-size:11px; min-height:15px; margin-top:6px; }

/* ============ CATEGORY ICON STRIP ============ */
.category-strip-wrap{
  position:relative;
  margin-top:22px;
  display:flex;
  align-items:center;
  gap:10px;
}

.category-strip{
  flex:1;
  display:flex;
  gap:12px;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-behavior:smooth;
  scroll-snap-type:x proximity;
  padding:6px 4px 14px;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
.category-strip::-webkit-scrollbar{ display:none; }

.cat-chip{
  flex:0 0 auto;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-width:110px;
  padding:14px 10px;
  border:1px solid var(--line);
  background:#fff;
  border-radius:16px;
  cursor:pointer;
  color:var(--text);
  transition:.2s;
  scroll-snap-align:start;
}
.cat-chip:hover{
  transform:translateY(-3px);
  border-color:#b9daf6;
  box-shadow:0 12px 25px rgba(8,52,99,.10);
  color:var(--blue);
}
.cat-chip.active{
  background:linear-gradient(135deg,#eaf6ff,#f8fcff);
  border-color:#8fc7f7;
  color:var(--blue);
  box-shadow:0 10px 22px rgba(8,125,242,.12);
}
.cat-icon{
  display:grid;
  place-items:center;
  width:46px; height:46px;
  border-radius:14px;
  background:linear-gradient(135deg,#eaf6ff,#f8fcff);
  color:var(--blue);
  font-size:19px;
  transition:.2s;
}
.cat-chip.active .cat-icon{
  background:var(--blue);
  color:#fff;
  box-shadow:0 8px 18px rgba(8,125,242,.3);
}
.cat-label{
  font-size:12px;
  font-weight:800;
  font-family:"Noto Sans Bengali", "Noto Sans", sans-serif;
  white-space:nowrap;
  text-align:center;
}

.cat-arrow{
  flex:0 0 auto;
  width:40px; height:40px;
  border-radius:50%;
  border:1px solid var(--line);
  background:#fff;
  color:var(--blue);
  cursor:pointer;
  display:grid;
  place-items:center;
  box-shadow:0 8px 18px rgba(8,52,99,.10);
  transition:.2s;
}
.cat-arrow:hover{
  background:var(--blue);
  color:#fff;
  border-color:var(--blue);
  transform:scale(1.06);
}
.cat-arrow:disabled{
  opacity:.35;
  cursor:not-allowed;
  transform:none;
}

/* ============ SECTIONS ============ */
.section{ padding:78px 0; }
.section-head{
  display:flex; justify-content:space-between; align-items:end;
  gap:30px; margin-bottom:27px;
}
.section-head h2, .section > .container > h2{
  font-size:34px; line-height:1.18; color:var(--navy); letter-spacing:-.8px;
}
.section-head p:last-child, .stats > .container > p:not(.eyebrow){
  font-size:14px; color:var(--muted); margin-top:7px; max-width:650px;
}
.eyebrow{ font-size:11px; letter-spacing:1.6px; font-weight:800; color:var(--blue); margin-bottom:7px; }
.eyebrow.light{ color:#b9ecff; }
.text-link{ color:var(--blue); font-size:13px; font-weight:800; white-space:nowrap; }

/* ============ SERVICE GRID ============ */
.service-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:17px; }
.service-card{
  position:relative; min-height:290px;
  border:1px solid var(--line); border-radius:18px;
  background:#fff; overflow:hidden; padding:0 17px 18px;
  box-shadow:0 8px 26px rgba(8,52,99,.055);
  transition:.25s;
}
.service-card:hover{
  transform:translateY(-5px);
  border-color:#b9daf6;
  box-shadow:0 18px 35px rgba(8,52,99,.11);
}
.service-card[hidden]{ display:none; }

/* ============ SERVICE IMAGE (with photo) ============ */
.service-img{
  position:relative;
  height:150px;
  margin:0 -17px 16px;
  overflow:hidden;
  background:linear-gradient(135deg,#eaf6ff,#f8fcff);
}
.service-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
  transition:transform .4s ease;
}
.service-card:hover .service-img img{
  transform:scale(1.06);
}

/* Small icon badge in bottom-right of the image */
.service-img-icon{
  position:absolute;
  bottom:10px;
  right:10px;
  display:grid;
  place-items:center;
  width:36px;
  height:36px;
  border-radius:50%;
  background:rgba(8,125,242,.92);
  color:#fff;
  font-size:14px;
  box-shadow:0 6px 14px rgba(8,52,99,.30);
  backdrop-filter:blur(4px);
  pointer-events:none;
}

.service-card .num{
  position:absolute; top:12px; left:13px;
  background:rgba(255,255,255,.92); padding:3px 8px;
  border-radius:20px; color:#557596; font-size:10px; font-weight:800;
  z-index:2;
}
.service-card h3{ font-size:16px; color:var(--navy); margin-bottom:7px; }
.service-card p{ font-size:12px; line-height:1.55; color:#7187a2; min-height:38px; }
.service-card > a{
  display:inline-flex; align-items:center; gap:7px;
  margin-top:17px; color:var(--blue); font-size:11px; font-weight:800;
}
.service-card > a i{ font-size:9px; }

.empty-state{
  text-align:center; padding:45px 15px;
  border:1px dashed #c8daeb; border-radius:18px; margin-top:18px;
}
.empty-state i{ font-size:28px; color:#8ca7c4; }
.empty-state h3{ margin:10px 0 3px; color:var(--navy); }
.empty-state p{ font-size:12px; color:var(--muted); margin-bottom:14px; }

/* ============ TRUST ============ */
.trust{ background:#f5faff; }
.trust-box{ display:grid; grid-template-columns:36% 1fr; gap:50px; align-items:center; }
.trust-intro h2{ font-size:30px; color:var(--navy); line-height:1.2; }
.trust-intro p:last-child{ font-size:13px; color:var(--muted); margin-top:9px; }
.trust-items{ display:grid; grid-template-columns:repeat(2,1fr); gap:13px; }
.trust-items > div{
  background:#fff; border:1px solid #e1edf8; border-radius:15px;
  padding:18px; display:grid; grid-template-columns:44px 1fr; column-gap:11px;
}
.trust-items span{
  grid-row:span 2; display:grid; place-items:center;
  width:42px; height:42px; border-radius:12px;
  background:#e9f5ff; color:var(--blue);
}
.trust-items b{ font-size:13px; color:var(--navy); }
.trust-items small{ font-size:10px; color:var(--muted); }

/* ============ HOW IT WORKS ============ */
.how{
  padding:75px 0;
  background:linear-gradient(120deg,#06204a,#073d82 55%,#087fdc);
  color:#fff;
}
.how-inner{ display:grid; grid-template-columns:34% 1fr; gap:60px; align-items:center; }
.how-copy h2{ font-size:31px; line-height:1.2; }
.how-copy > p:not(.eyebrow){ font-size:13px; color:#c9e2ff; margin:10px 0 22px; }
.steps{
  display:grid;
  grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;
  align-items:center; gap:12px;
}
.step{ text-align:center; }
.step > span{ display:block; color:#83b9e8; font-size:10px; font-weight:800; margin-bottom:8px; }
.step > i{
  display:grid; place-items:center;
  width:48px; height:48px; border-radius:15px;
  background:rgba(255,255,255,.1); margin:0 auto 10px; color:#55dcff;
}
.step b{ display:block; font-size:13px; }
.step small{ display:block; color:#b9d8f5; font-size:10px; margin-top:3px; }
.steps em{ font-style:normal; color:#55cfff; }

/* ============ STATS ============ */
.stats{ text-align:left; }
.stats-grid{
  display:grid; grid-template-columns:repeat(4,1fr);
  margin-top:32px; border:1px solid var(--line);
  border-radius:18px; overflow:hidden;
}
.stats-grid div{
  padding:27px 20px; text-align:center;
  border-right:1px solid var(--line);
}
.stats-grid div:last-child{ border-right:0; }
.stats-grid b{ display:block; font-size:30px; color:var(--blue); }
.stats-grid span{ font-size:11px; color:var(--muted); }

/* ============ REVIEWS ============ */
.reviews{ background:#f7fbff; }
.review-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:17px; margin-top:25px; }
.review-grid article{
  background:#fff; border:1px solid var(--line); border-radius:16px;
  padding:20px; box-shadow:0 8px 24px rgba(8,52,99,.045);
}
.avatar{
  float:left; width:42px; height:42px; border-radius:50%;
  display:grid; place-items:center; background:#e4f3ff;
  color:var(--blue); font-weight:800; margin-right:10px;
}
.review-grid article > b{ font-size:12px; color:var(--navy); }
.stars{ color:#f0a600; font-size:11px; margin-top:1px; }
.review-grid p{ clear:both; padding-top:15px; color:#617996; font-size:12px; line-height:1.7; }

/* ============ CTA ============ */
.cta{ padding:25px 0; background:linear-gradient(90deg,#063779,#087fe1,#0caadf); color:#fff; }
.cta-inner{ display:flex; align-items:center; gap:16px; }
.cta-icon{
  display:grid; place-items:center;
  width:48px; height:48px; border-radius:14px;
  background:rgba(255,255,255,.12); font-size:20px;
}
.cta-inner h2{ font-size:21px; }
.cta-inner p{ font-size:12px; color:#d7efff; }
.cta-inner .btn{ margin-left:auto; }

/* ============ FOOTER ============ */
footer{ background:#02162f; color:#fff; padding:45px 0 16px; }
.footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1.2fr 1.35fr .8fr; gap:30px; }
.footer-brand{ display:flex; align-items:center; gap:9px; }
.footer-brand img{ width:64px; height:64px; object-fit:contain; }
.footer-brand h3{ font-size:15px; }
.footer-brand p{ font-size:10px; color:#a9c5e4; }
.footer-grid h4{ font-size:12px; margin-bottom:12px; }
.footer-grid a, .footer-grid p{ display:block; font-size:11px; color:#aac6e5; margin:6px 0; }
.footer-grid a:hover{ color:#fff; }
.footer-grid p i{ width:18px; }
.socials{ display:flex; gap:7px; }
.socials a{
  display:grid; place-items:center; width:30px; height:30px;
  border-radius:9px; background:#fff; color:#07376f; margin:0;
}
.copyright{
  border-top:1px solid #17365a; margin-top:28px; padding-top:13px;
  display:flex; justify-content:space-between; font-size:10px; color:#89a8ca;
}

/* ============ CUSTOM DROPDOWNS ============ */
.category-dropdown{ position:relative; min-width:0; }
.category-trigger{
  width:100%; height:48px; border:1px solid #d5e4f3; border-radius:11px;
  background:#fbfdff; color:var(--text);
  display:flex; align-items:center; gap:9px;
  padding:0 12px; cursor:pointer; text-align:left; transition:.2s;
}
.category-trigger:hover,
.category-dropdown.open .category-trigger{
  border-color:#8fc7f7; background:#fff;
  box-shadow:0 0 0 4px rgba(8,125,242,.07);
}
.category-trigger-icon{ color:#6f91b5; }
.category-current{
  font-size:12px; font-weight:700; flex:1;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.category-chevron{ font-size:10px; color:#7995b2; transition:.2s; }
.category-dropdown.open .category-chevron{ transform:rotate(180deg); color:var(--blue); }
.category-menu{
  position:absolute; z-index:50; top:calc(100% + 8px); left:0; right:0;
  background:#fff; border:1px solid #dce8f5; border-radius:15px;
  padding:7px; box-shadow:0 22px 50px rgba(8,52,99,.16);
  display:none; max-height:330px; overflow:auto;
}
.category-dropdown.open .category-menu{ display:block; animation:dropIn .16s ease; }
.category-menu button{
  width:100%; display:grid;
  grid-template-columns:30px 1fr auto; grid-template-rows:auto auto;
  column-gap:8px; align-items:center;
  border:0; background:#fff; padding:9px 8px; border-radius:10px;
  text-align:left; cursor:pointer; color:var(--text);
}
.category-menu button:hover,
.category-menu button[aria-selected="true"]{ background:#edf7ff; color:var(--blue); }
.category-menu button > i{
  grid-row:1/3; display:grid; place-items:center;
  width:28px; height:28px; border-radius:8px;
  background:#f1f7fc; font-size:12px;
}
.category-menu button span{ font-size:11px; font-weight:800; line-height:1.25; }
.category-menu button small{ font-size:9px; color:#849ab3; margin-top:2px; }
.category-menu button[aria-selected="true"] > i{ background:#dff1ff; }
@keyframes dropIn{
  from{ opacity:0; transform:translateY(-5px); }
  to{ opacity:1; transform:translateY(0); }
}

/* ============================================================
   USER MENU (logged-in navbar dropdown)
   ============================================================ */
.user-menu{
  position:relative;
}

.user-trigger{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 12px 6px 6px;
  border:1px solid #d5e4f3;
  border-radius:40px;
  background:#fbfdff;
  color:var(--navy);
  font-weight:700;
  font-size:13px;
  cursor:pointer;
  transition:.2s;
  font-family:"Noto Sans Bengali", "Noto Sans", sans-serif;
}
.user-trigger:hover,
.user-menu.open .user-trigger{
  border-color:#8fc7f7;
  background:#fff;
  box-shadow:0 0 0 4px rgba(8,125,242,.08);
}

.user-avatar{
  width:32px;
  height:32px;
  border-radius:50%;
  background:linear-gradient(135deg,#0b5b9e,#1a7bc4);
  color:#fff;
  display:grid;
  place-items:center;
  font-size:13px;
  overflow:hidden;
  flex-shrink:0;
}
.user-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.user-name{
  max-width:110px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.user-chevron{
  font-size:9px;
  color:#7995b2;
  transition:.2s;
}
.user-menu.open .user-chevron{
  transform:rotate(180deg);
  color:var(--blue);
}

/* Dropdown panel */
.user-dropdown{
  position:absolute;
  top:calc(100% + 10px);
  right:0;
  width:280px;
  background:#fff;
  border:1px solid #dce8f5;
  border-radius:16px;
  box-shadow:0 22px 50px rgba(8,52,99,.18);
  padding:0;
  opacity:0;
  visibility:hidden;
  transform:translateY(-6px);
  transition:.2s ease;
  z-index:150;
  overflow:hidden;
}
.user-menu.open .user-dropdown{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}

/* Dropdown header */
.user-dd-header{
  display:flex;
  align-items:center;
  gap:10px;
  padding:14px 16px;
  background:linear-gradient(135deg,#eef6ff,#f8fcff);
  border-bottom:1px solid #e5eef7;
}
.user-dd-avatar{
  width:44px;
  height:44px;
  border-radius:50%;
  background:linear-gradient(135deg,#0b5b9e,#1a7bc4);
  color:#fff;
  display:grid;
  place-items:center;
  font-weight:800;
  font-size:16px;
  flex-shrink:0;
  overflow:hidden;
}
.user-dd-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.user-dd-info{
  min-width:0;
  flex:1;
}
.user-dd-info strong{
  display:block;
  font-size:13px;
  color:var(--navy);
  font-weight:800;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.user-dd-info small{
  display:block;
  font-size:11px;
  color:var(--muted);
  margin-top:2px;
}
.dd-verified{
  display:inline-flex;
  align-items:center;
  gap:4px;
  font-size:10px;
  color:#1b5e20;
  background:#e8f5e9;
  padding:1px 8px;
  border-radius:20px;
  margin-top:4px;
  font-weight:700;
}

/* Dropdown items */
.user-dd-body{
  padding:6px;
  display:flex;
  flex-direction:column;
}
.dd-item{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:10px;
  color:var(--text);
  font-size:13px;
  font-weight:600;
  text-decoration:none;
  transition:.15s;
  font-family:"Noto Sans Bengali", "Noto Sans", sans-serif;
}
.dd-item i{
  width:18px;
  text-align:center;
  color:#5c7ba0;
  font-size:14px;
}
.dd-item:hover{
  background:#edf7ff;
  color:var(--blue);
}
.dd-item:hover i{
  color:var(--blue);
}

/* Logout item */
.dd-logout{
  border-top:1px solid #eef3fc;
  margin-top:4px;
  padding-top:12px;
  color:#b71c1c;
}
.dd-logout i{
  color:#b71c1c;
}
.dd-logout:hover{
  background:#ffebee;
  color:#b71c1c;
}
.dd-logout:hover i{
  color:#b71c1c;
}

/* Bangla font overrides */
.btn, .nav-login, .top-links a, .main-nav a,
.category-current, .category-menu button span,
.service-card h3, .section-head h2, .cat-label,
.user-trigger, .dd-item{
  font-family:"Noto Sans Bengali", "Noto Sans", sans-serif;
}

/* ============ RESPONSIVE ============ */
@media(max-width:1050px){
  .main-nav{ gap:17px; }
  .nav-wrap{ gap:18px; }
  .nav-actions{ margin-left:auto; }
  .nav-login{ padding-left:4px; padding-right:4px; }
  .service-grid{ grid-template-columns:repeat(3,1fr); }
  .footer-grid{ grid-template-columns:repeat(3,1fr); }
  .search-form{ grid-template-columns:1fr 160px 150px 95px; }
  .hero-banner-img{ max-height:520px; }
  .search-section{ margin-top:-60px; }
  .cat-chip{ min-width:104px; padding:13px 9px; }
  .cat-icon{ width:44px; height:44px; font-size:18px; }
  .service-img{ height:140px; }
}

@media(max-width:900px){
  .top-link-inner{ justify-content:center; }
  .top-info{ display:none; }
  .main-nav{
    display:none; position:absolute; left:4%; right:4%; top:112px;
    background:#fff; border:1px solid var(--line); border-radius:14px;
    padding:7px 15px; box-shadow:0 18px 35px rgba(0,0,0,.12);
    flex-direction:column; gap:0;
  }
  .main-nav.open{ display:flex; }
  .main-nav a{ padding:12px 3px; border-bottom:1px solid #edf3f8; }
  .main-nav a:last-child{ border-bottom:0; }
  .main-nav a:after{ display:none; }
  .menu-btn{ display:block; }
  .nav-actions{ display:flex; }
  .nav-wrap{ height:72px; }
  .search-panel{ grid-template-columns:1fr; }
  .search-form{ grid-template-columns:1fr 1fr 1fr 100px; }
  .search-status{ grid-column:1/-1; }
  .trust-box, .how-inner{ grid-template-columns:1fr; gap:30px; }
  .steps{ max-width:760px; }
  .footer-grid{ grid-template-columns:repeat(2,1fr); }
  .hero-banner-img{ max-height:420px; }
  .search-section{ margin-top:-50px; }
  .cat-chip{ min-width:98px; padding:12px 8px; }
  .cat-icon{ width:42px; height:42px; font-size:17px; }
  .service-img{ height:135px; }

  /* User menu: compact on tablet */
  .user-trigger .user-name{ display:none; }
  .user-trigger{ padding:5px 10px 5px 5px; }
}

@media(max-width:700px){
  .nav-wrap{ height:68px; }
  .brand img{ width:45px; height:45px; }
  .brand strong{ font-size:12px; }
  .brand span{ font-size:8px; }
  .nav-login{ font-size:11px; }
  .nav-actions .btn-small{ padding:9px 11px; font-size:11px; }
  .menu-btn{ width:38px; height:38px; }
  .main-nav{ left:4%; right:4%; top:100px; }

  .hero-banner-img{ max-height:340px; }
  .search-section{ margin-top:-40px; }

  .search-panel{ padding:18px; }
  .search-form{ grid-template-columns:1fr; gap:10px; }
  .search-submit{ width:100%; }
  .search-status{ grid-column:1/-1; }
  .section{ padding:58px 0; }
  .section-head{ display:block; }
  .section-head h2, .section > .container > h2{ font-size:28px; }
  .text-link{ display:inline-flex; margin-top:12px; }
  .service-grid{ grid-template-columns:repeat(2,1fr); gap:11px; }
  .service-card{ min-height:255px; padding:0 12px 15px; }
  .service-img{ height:120px; margin:0 -12px 14px; }
  .service-img-icon{ width:32px; height:32px; font-size:12px; bottom:8px; right:8px; }
  .service-card h3{ font-size:14px; }
  .service-card p{ font-size:11px; min-height:44px; }
  .service-card > a{ font-size:10px; margin-top:13px; }
  .trust-items{ grid-template-columns:1fr; }
  .how{ padding:60px 0; }
  .steps{ grid-template-columns:repeat(2,1fr); gap:25px 12px; }
  .steps em{ display:none; }
  .stats-grid{ grid-template-columns:repeat(2,1fr); }
  .stats-grid div:nth-child(2){ border-right:0; }
  .stats-grid div{ padding:20px 10px; }
  .stats-grid b{ font-size:25px; }
  .review-grid{ grid-template-columns:1fr; }
  .cta-inner{ display:grid; grid-template-columns:45px 1fr; }
  .cta-inner .btn{ grid-column:1/-1; margin:5px 0 0; }
  .footer-grid{ grid-template-columns:1fr 1fr; gap:25px 16px; }
  .copyright{ display:block; }
  .copyright span{ display:block; margin:5px 0; }
  .category-menu{ position:fixed; left:4%; right:4%; top:96px; max-height:70vh; }

  /* Category strip: smaller chips, keep arrows visible */
  .category-strip-wrap{ margin-top:16px; gap:6px; }
  .cat-chip{ min-width:88px; padding:11px 7px; border-radius:14px; }
  .cat-icon{ width:40px; height:40px; font-size:16px; border-radius:12px; }
  .cat-label{ font-size:11px; }
  .cat-arrow{ width:34px; height:34px; font-size:12px; }
}

@media(max-width:520px){
  .top-links{ gap:13px; }
  .top-links a:nth-child(n+5){ display:none; }
  .nav-wrap{ gap:8px; }
  .brand{ gap:7px; }
  .brand strong{ font-size:11px; }
  .nav-actions{ gap:3px; }
  .nav-login{ font-size:10px; padding:8px 4px; }
  .nav-login i{ display:none; }
  .nav-actions .btn-small{ font-size:10px; padding:8px 10px; }
  .menu-btn{ width:36px; height:36px; }

  .hero-banner-img{ max-height:260px; }
  .search-section{ margin-top:-30px; }

  .category-trigger{ height:50px; }
  .category-menu{ top:88px; }
  .category-menu button{
    grid-template-columns:28px 1fr; grid-template-rows:auto auto;
    padding:8px 7px;
  }
  .category-menu button small{ grid-column:2; }
  .search-intro h2{ font-size:20px; }
  .service-grid{ grid-template-columns:1fr; }
  .service-card{ min-height:240px; }
  .service-img{ height:180px; }
  .footer-grid{ grid-template-columns:1fr; }

  /* Strip: hide arrows, allow touch scroll */
  .cat-arrow{ display:none; }
  .category-strip{ padding:4px 2px 12px; gap:10px; }
  .cat-chip{ min-width:82px; padding:10px 6px; border-radius:12px; }
  .cat-icon{ width:38px; height:38px; font-size:15px; border-radius:11px; }
  .cat-label{ font-size:10px; }

  /* User dropdown: full-width on mobile */
  .user-dropdown{
    position:fixed;
    top:100px;
    right:4%;
    left:4%;
    width:auto;
    max-height:70vh;
    overflow-y:auto;
  }
}

@media(max-width:380px){
  .brand img{ width:39px; height:39px; }
  .brand strong{ font-size:10px; }
  .nav-actions .btn-small{ padding:7px 8px; }
  .nav-login{ display:none; }
  .menu-btn{ width:34px; height:34px; }
  .hero-banner-img{ max-height:220px; }
  .search-section{ margin-top:-25px; }
  .top-links a:nth-child(n+4){ display:none; }

  .cat-chip{ min-width:76px; padding:9px 5px; }
  .cat-icon{ width:34px; height:34px; font-size:14px; }
  .cat-label{ font-size:9px; }

  .service-img{ height:150px; }
}

/* ============ v18 Typography refinement ============ */
.container{ width:min(94%,1380px); }
body{ font-size:17px; }
.top-link-bar{ font-size:13px; }
.main-nav{ font-size:14px; }
.nav-login{ font-size:13px; }
.btn{ font-size:14px; }
.eyebrow{ font-size:12px; }
.search-intro h2{ font-size:24px; }
.search-intro p{ font-size:13px; }
.search-field input, .category-current{ font-size:14px; }
.search-status{ font-size:13px; }
.section-head h2, .section > .container > h2{ font-size:38px; }
.section-head p:last-child, .stats > .container > p:not(.eyebrow){ font-size:15px; }
.service-card h3{ font-size:18px; }
.service-card p{ font-size:13px; }
.service-card > a{ font-size:12px; }
.trust-intro h2{ font-size:33px; }
.trust-intro p:last-child{ font-size:14px; }
.trust-items b{ font-size:14px; }
.trust-items small{ font-size:11px; }
.how-copy h2{ font-size:34px; }
.how-copy > p:not(.eyebrow){ font-size:14px; }
.footer-grid h4{ font-size:13px; }
.footer-grid a, .footer-grid p{ font-size:12px; }

@media(max-width:1050px){
  .container{ width:min(95%,1200px); }
}
@media(max-width:900px){
  .container{ width:94%; }
}
@media(max-width:700px){
  .container{ width:95%; }
  body{ font-size:16px; }
  .section-head h2, .section > .container > h2{ font-size:31px; }
  .service-card h3{ font-size:16px; }
  .service-card p{ font-size:12px; }
  .search-intro h2{ font-size:22px; }
}
@media(max-width:520px){
  .container{ width:96%; }
  .section-head h2, .section > .container > h2{ font-size:29px; }
}
@media(max-width:380px){
  .container{ width:96%; }
}

/* ============ v19 Navbar + Footer typography boost ============ */
.top-link-bar{ font-size:15px; }
.top-links{ gap:30px; }
.main-nav{ font-size:16px; gap:30px; }
.nav-login{ font-size:15px; }
.nav-actions .btn{ font-size:15px; }
.brand strong{ font-size:16px; }
.brand span{ font-size:12px; }
.footer-brand h3{ font-size:18px; }
.footer-brand p{ font-size:12px; }
.footer-grid h4{ font-size:16px; margin-bottom:14px; }
.footer-grid a, .footer-grid p{ font-size:14px; margin:8px 0; }
.copyright{ font-size:12px; }

@media(max-width:900px){
  .main-nav{ font-size:16px; }
  .main-nav a{ padding:14px 4px; }
}
@media(max-width:700px){
  .top-link-bar{ font-size:12px; }
  .main-nav{ font-size:16px; }
  .nav-login{ font-size:12px; }
  .nav-actions .btn-small{ font-size:12px; }
  .brand strong{ font-size:13px; }
  .brand span{ font-size:9px; }
  .footer-grid h4{ font-size:15px; }
  .footer-grid a, .footer-grid p{ font-size:13px; }
  .copyright{ font-size:11px; }
}
@media(max-width:520px){
  .top-links{ gap:16px; }
  .nav-login{ font-size:11px; }
  .nav-actions .btn-small{ font-size:11px; }
  .brand strong{ font-size:12px; }
}
@media(max-width:380px){
  .brand strong{ font-size:11px; }
  .footer-grid a, .footer-grid p{ font-size:12px; }
}