/* ============================================================
   Quick Junk Dubai — Homepage Specific Styles
   ============================================================ */

/* ── TOP BAR ── */
.topbar {
  background: #1A5C35;
  color: rgba(255,255,255,.92);
  padding: 9px 0;
  font-size: 0.8125rem;
}
.topbar-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
}
.topbar-left {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  flex-wrap: wrap;
}
.topbar-item {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  color: rgba(255,255,255,.9);
  white-space: nowrap;
}
.topbar-item svg { flex-shrink: 0; opacity: .85; }
.topbar-item a { color: inherit; }
.topbar-item a:hover { color: #fff; }
.topbar-divider { color: rgba(255,255,255,.3); }
.topbar-right {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-shrink: 0;
}
.topbar-follow-label {
  font-weight: 600;
  color: rgba(255,255,255,.8);
  white-space: nowrap;
}
.topbar-socials {
  display: flex;
  gap: 0.4rem;
}
.topbar-socials a {
  width: 26px;
  height: 26px;
  background: rgba(255,255,255,.15);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  transition: background .2s;
}
.topbar-socials a:hover { background: rgba(255,255,255,.35); }

/* ── HEADER (new) ── */
.header-new {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: #fff;
  border-bottom: 1px solid #E2E8F0;
  box-shadow: 0 2px 12px rgba(0,0,0,.06);
}
.header-new-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 82px;
  gap: 1.5rem;
}
.logo-link {
  display: block;
  flex-shrink: 0;
  line-height: 0;
  text-decoration: none;
}
.logo-link img {
  height: 130px;
  width:  130px;
  object-fit: contain;
  display: block;
}
.nav-new {
  display: flex;
  align-items: center;
  gap: 0.125rem;
  flex: 1;
  justify-content: center;
}
.nav-new a {
  padding: 0.5rem 0.875rem;
  font-weight: 500;
  font-size: 0.9375rem;
  color: #1E293B;
  border-radius: 6px;
  transition: color .2s, background .2s;
  white-space: nowrap;
}
.nav-new a:hover, .nav-new a.active { color: #16A34A; }
.nav-new a.active { font-weight: 700; border-bottom: 2px solid #16A34A; border-radius: 0; }
.nav-dropdown-new { position: relative; }
.nav-dropdown-new > a::after { content: ' ▾'; font-size: .65em; }
.nav-dropdown-new:hover .dropdown-new {
  display: block;
  animation: fadeIn .15s ease;
}
.dropdown-new {
  display: none;
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  min-width: 240px;
  background: #fff;
  border: 1px solid #E2E8F0;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0,0,0,.1);
  padding: 0.5rem;
  z-index: 200;
}
.dropdown-new a {
  display: block !important;
  padding: 0.625rem 1rem !important;
  border-radius: 6px !important;
  font-size: 0.875rem !important;
  color: #374151 !important;
  font-weight: 500 !important;
  border-bottom: none !important;
}
.dropdown-new a:hover { background: #DCFCE7 !important; color: #16A34A !important; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: translateY(0); } }
.header-cta-btn {
  background: #F97316;
  color: #fff;
  padding: 0.7rem 1.5rem;
  border-radius: 8px;
  font-weight: 700;
  font-size: 0.9375rem;
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 0.4rem;
  transition: background .2s, transform .2s;
  flex-shrink: 0;
}
.header-cta-btn:hover { background: #EA6C0A; transform: translateY(-1px); }
.hamburger-new {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 40px; height: 40px;
  padding: 8px;
  border: 1px solid #E2E8F0;
  border-radius: 8px;
  background: none;
  cursor: pointer;
}
.hamburger-new span { display: block; height: 2px; background: #1E293B; border-radius: 2px; transition: .25s; }
.hamburger-new.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hamburger-new.open span:nth-child(2) { opacity: 0; }
.hamburger-new.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.mobile-nav-new {
  display: none;
  padding: 1rem 1.25rem 1.5rem;
  border-top: 1px solid #E2E8F0;
  background: #fff;
}
.mobile-nav-new.open { display: block; }
.mobile-nav-new a {
  display: block;
  padding: 0.75rem 0;
  border-bottom: 1px solid #F1F5F9;
  font-weight: 500;
  color: #1E293B;
  font-size: 0.9375rem;
}
.mobile-nav-new .cta-mobile {
  display: block;
  margin-top: 1rem;
  background: #F97316;
  color: #fff;
  text-align: center;
  padding: 0.875rem;
  border-radius: 8px;
  font-weight: 700;
}

/* ════════════ HERO (premium redesign) ════════════ */
:root{
  --h-green:#38761D;
  --h-green-d:#2c5d16;
  --h-cream:#FFF6D9;
  --h-navy:#1E293B;
  --h-orange:#F97316;
  --h-orange-d:#EA6C0A;
  --h-wa:#25D366;
}
.hero-new{
  position:relative;
  padding:3.5rem 0 0;
  background:#eef2f5 url('../images/hero-scene.webp') center bottom / cover no-repeat;
  overflow:hidden;
}
/* left white fade so text stays readable over skyline */
.hero-new::before{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(90deg,#ffffff 0%,rgba(255,255,255,.92) 26%,rgba(255,255,255,.45) 44%,rgba(255,255,255,0) 60%);
  z-index:0;
}
.hero-new .container{position:relative;z-index:2;max-width:100%;padding-left:clamp(1.5rem,4vw,4rem);padding-right:0;}
.hero-new-grid{
  display:grid;
  grid-template-columns:46% 54%;
  gap:1.5%;
  align-items:center;
  max-width:100%;
  margin:0;
  min-height:540px;
}
.hero-content{max-width:600px;margin-left:0;}

/* entrance animation states */
.anim-left{opacity:0;transform:translateX(-40px);transition:opacity .7s ease,transform .7s ease;}
.anim-right{opacity:0;transform:translateX(48px);transition:opacity .8s ease .1s,transform .8s ease .1s;}
.anim-up{opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .6s ease;}
.is-in.anim-left,.is-in.anim-right,.is-in.anim-up{opacity:1;transform:none;}

/* top label */
.hero-top-label{
  display:inline-flex;align-items:center;gap:.5rem;
  color:var(--h-green);
  font-size:.8125rem;font-weight:600;letter-spacing:.08em;
  text-transform:uppercase;
  background:var(--h-cream);
  padding:.4rem .9rem;border-radius:50px;
  margin-bottom:1.4rem;
}
.hero-top-label svg{color:var(--h-green);}

/* headline */
.hero-headline{
  font-size:clamp(2.25rem,5vw,3.75rem);   /* up to 60px */
  font-weight:800;
  line-height:1.08;
  color:var(--h-navy);
  letter-spacing:-1px;
  margin-bottom:1.25rem;
}
.hero-headline .hl{color:var(--h-green);}

.hero-desc{
  color:#475569;
  font-size:1.05rem;
  line-height:1.75;
  max-width:540px;
  margin-bottom:1.75rem;
}

/* feature cards */
.feature-cards{
  display:flex;flex-wrap:wrap;gap:.875rem;
  margin-bottom:2rem;
}
.feature-card{
  display:flex;align-items:center;gap:.65rem;
  background:#fff;
  border:1px solid #eef2ee;
  border-radius:14px;
  padding:.7rem 1.05rem;
  box-shadow:0 4px 14px rgba(16,40,20,.06);
  transition:transform .3s ease,box-shadow .3s ease;
}
.feature-card:hover{transform:translateY(-4px);box-shadow:0 10px 26px rgba(16,40,20,.12);}
.feature-card .fc-icon{
  width:40px;height:40px;flex-shrink:0;
  border-radius:50%;
  background:rgba(56,118,29,.12);
  color:var(--h-green);
  display:flex;align-items:center;justify-content:center;
}
.feature-card span{font-size:.9rem;font-weight:700;color:var(--h-navy);line-height:1.2;}

/* CTA buttons */
.hero-cta-row{display:flex;gap:.875rem;flex-wrap:wrap;}
.btn-call{
  display:inline-flex;align-items:center;gap:.55rem;
  background:var(--h-orange);color:#fff;
  padding:.95rem 1.6rem;border-radius:10px;
  font-weight:700;font-size:1rem;
  box-shadow:0 6px 18px rgba(249,115,22,.32);
  transition:background .3s,transform .3s,box-shadow .3s;
}
.btn-call:hover{background:var(--h-orange-d);transform:translateY(-2px);box-shadow:0 10px 24px rgba(249,115,22,.42);}
.btn-whatsapp-hero{
  display:inline-flex;align-items:center;gap:.55rem;
  background:var(--h-wa);color:#fff;
  padding:.95rem 1.6rem;border-radius:10px;
  font-weight:700;font-size:1rem;
  box-shadow:0 6px 18px rgba(37,211,102,.3);
  transition:background .3s,transform .3s,box-shadow .3s;
}
.btn-whatsapp-hero:hover{background:#1da851;transform:translateY(-2px);box-shadow:0 10px 24px rgba(37,211,102,.42);}

/* right side — truck sits on the road (skyline+road is the hero background) */
.hero-right{
  position:relative;
  align-self:stretch;
  min-height:500px;
}
/* sharp truck foreground, bottom-aligned on the road */
.hero-truck-fg{
  position:absolute;
  right:-10px;
  bottom:6px;
  width:118%;
  max-width:720px;
  height:auto;
  display:block;
  z-index:2;
  filter:drop-shadow(0 16px 14px rgba(0,0,0,.28));
}

/* quote card */
.quote-float-card{
  position:absolute;bottom:14px;right:0;
  width:300px;max-width:82%;
  background:#fff;border-radius:20px;
  padding:1.4rem 1.55rem;
  box-shadow:0 20px 55px rgba(16,40,20,.22);
  z-index:10;
  transition:transform .3s ease,box-shadow .3s ease;
}
.quote-float-card:hover{transform:translateY(-4px);box-shadow:0 26px 64px rgba(16,40,20,.28);}
.quote-float-card h4{font-size:1.3rem;font-weight:800;color:var(--h-navy);margin-bottom:.2rem;}
.quote-float-card .response-tag{font-size:.85rem;color:var(--h-green);font-weight:600;margin-bottom:1rem;}
.quote-card-row{display:flex;flex-direction:column;gap:1rem;}
.quote-checklist{list-style:none;display:flex;flex-direction:column;gap:.45rem;}
.quote-checklist li{display:flex;align-items:center;gap:.5rem;font-size:.875rem;color:#374151;font-weight:500;}
.quote-checklist li::before{content:'✔';color:var(--h-green);font-weight:800;font-size:.9rem;}
.btn-quote-card{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;width:100%;
  background:var(--h-orange);color:#fff;
  padding:.85rem 1.4rem;border-radius:10px;
  font-weight:700;font-size:.92rem;
  transition:background .3s,transform .3s;
}
.btn-quote-card:hover{background:var(--h-orange-d);transform:translateY(-1px);}

/* ── SECTION HELPERS ── */
.sec-label {
  font-size: 0.8125rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: #16A34A;
  text-align: center;
  margin-bottom: 0.5rem;
}
.sec-title {
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 800;
  color: #0F172A;
  text-align: center;
  margin-bottom: 2.5rem;
}

/* ── SERVICES 6-GRID ── */
/* ── SERVICES CONTINUOUS SLIDER (marquee) ── */
.svc-slider {
  position: relative;
  overflow: hidden;
  padding: 0.5rem 0 1.5rem;
  /* fade edges */
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 4%, #000 96%, transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0, #000 4%, #000 96%, transparent 100%);
}
.services-6-grid {
  display: flex;
  width: max-content;
  will-change: transform;
}

.svc-card {
  flex: 0 0 320px;
  margin-right: 1.5rem;
  background: #fff;
  border: 1px solid #E2E8F0;
  border-radius: 18px;
  overflow: visible;
  text-align: left;
  transition: border-color .25s, box-shadow .25s, transform .25s;
  display: block;
  text-decoration: none;
}
.svc-card:hover {
  border-color: #16A34A;
  box-shadow: 0 12px 32px rgba(22,163,74,.16);
  transform: translateY(-5px);
}
/* service image */
.svc-img {
  position: relative;
  aspect-ratio: 8 / 5;
  overflow: hidden;
  background: #eef2f5;
  border-radius: 18px 18px 0 0;
}
.svc-img img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .4s ease;
}
.svc-card:hover .svc-img img { transform: scale(1.06); }
/* icon badge overlapping image/body boundary (fully visible) */
.svc-body { position: relative; padding: 2rem 1.25rem 1.4rem; }
.svc-badge {
  position: absolute;
  left: 1.1rem; top: -1.4rem;
  width: 52px; height: 52px;
  background: #16A34A;
  color: #fff;
  border-radius: 13px;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 6px 16px rgba(22,163,74,.4);
  border: 3px solid #fff;
  z-index: 2;
}
.svc-card h3 { font-size: 1rem; font-weight: 700; color: #0F172A; margin-bottom: 0.4rem; }
.svc-card p  { font-size: 0.85rem; color: #64748B; margin-bottom: 0.85rem; line-height: 1.55; }
.learn-more-link { font-size: 0.8125rem; font-weight: 700; color: #16A34A; transition: gap .2s; }
.svc-card:hover .learn-more-link { color: #15803D; }

/* ── AREAS WE SERVE ── */
.areas-section { background: #F4FAF6; }
.areas-sub {
  text-align: center;
  max-width: 640px;
  margin: -1.5rem auto 2.5rem;
  color: #64748B;
  font-size: 1rem;
  line-height: 1.7;
}
.areas-grid-new {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0.65rem;
  max-width: 1080px;
  margin: 0 auto;
}
.area-card-new {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  background: #fff;
  border: 1.5px solid #cfe8d4;
  border-radius: 9px;
  padding: 0.6rem 0.75rem;
  min-height: 46px;
  font-size: 0.82rem;
  font-weight: 600;
  color: #243b29;
  line-height: 1.25;
  text-decoration: none;
  transition: border-color .2s, box-shadow .2s, transform .2s, background .2s;
}
.area-card-new:hover {
  border-color: #16A34A;
  background: #f3fbf5;
  box-shadow: 0 5px 14px rgba(22,163,74,.14);
  transform: translateY(-2px);
}
/* featured (first) card */
.area-card-new.featured {
  background: #1f7a34;
  border-color: #1f7a34;
  color: #fff;
}
.area-card-new.featured:hover { background: #1a6b2d; transform: translateY(-2px); }
/* small inline pin */
.area-pin {
  flex-shrink: 0;
  color: #16A34A;
  display: inline-flex;
  align-items: center;
}
.area-card-new.featured .area-pin { color: #fff; }
.areas-note {
  text-align: center;
  margin-top: 2.25rem;
  font-size: 0.9375rem;
  color: #64748B;
}
.areas-note a { color: #16A34A; font-weight: 700; }
.areas-note a:hover { text-decoration: underline; }
.areas-note strong { color: #1E293B; }

@media (max-width: 900px) {
  .areas-grid-new { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 680px) {
  .areas-grid-new { grid-template-columns: repeat(3, 1fr); gap: 0.5rem; }
  .area-card-new { font-size: 0.78rem; padding: 0.55rem 0.6rem; }
}
@media (max-width: 460px) {
  .areas-grid-new { grid-template-columns: repeat(2, 1fr); }
}

/* ── WHY CHOOSE US ── */
.why-section-new { background: #F8FAF9; padding: 5rem 0; }
.why-6-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 1.25rem;
}
.why-card-new {
  background: #fff;
  border-radius: 14px;
  padding: 1.5rem 1rem 1.25rem;
  text-align: center;
  box-shadow: 0 2px 8px rgba(0,0,0,.05);
  transition: box-shadow .25s, transform .25s;
}
.why-card-new:hover { box-shadow: 0 8px 24px rgba(0,0,0,.09); transform: translateY(-4px); }
.why-icon-circle {
  width: 58px; height: 58px;
  background: #DCFCE7;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 0.875rem;
  color: #16A34A;
}
.why-card-new h4 { font-size: 0.9rem; font-weight: 700; color: #0F172A; margin-bottom: 0.35rem; }
.why-card-new p  { font-size: 0.775rem; color: #64748B; line-height: 1.55; }

/* ── GOOGLE REVIEWS ── */
.reviews-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}
.google-card {
  background: #fff;
  border: 1px solid #E2E8F0;
  border-radius: 14px;
  padding: 1.5rem;
  box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
.google-card-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.75rem;
}
.review-stars-row { color: #F59E0B; font-size: 1.1rem; letter-spacing: 2px; }
.google-logo-svg { width: 28px; height: 28px; }
.google-card blockquote {
  font-size: 0.9375rem;
  color: #374151;
  line-height: 1.7;
  margin-bottom: 1.25rem;
  font-style: italic;
}
.review-author strong { display: block; font-size: 0.9375rem; color: #0F172A; font-weight: 700; }
.review-author span   { font-size: 0.8125rem; color: #64748B; }

/* ── FOOTER NEW ── */
.footer-new-wrap { background: #0F172A; color: rgba(255,255,255,.7); }
.footer-new-grid {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1.4fr 1.4fr 1.3fr;
  gap: 2.5rem;
  padding: 4rem 0 3rem;
}
.footer-brand-col .footer-logo-link {
  display: block;
  line-height: 0;
  margin-bottom: 1rem;
}
.footer-brand-col .footer-logo-link img {
  width: 240px;
  max-width: 75%;
  height: auto;
  object-fit: contain;
  display: block;
}
.footer-brand-col p {
  font-size: 0.875rem;
  line-height: 1.7;
  color: rgba(255,255,255,.6);
  margin-bottom: 1.5rem;
}
.footer-social-row { display: flex; gap: 0.6rem; }
.footer-social-row a {
  width: 34px; height: 34px;
  background: rgba(255,255,255,.08);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,.75);
  transition: background .2s, color .2s;
}
.footer-social-row a:hover { background: #16A34A; color: #fff; }
.footer-col-title {
  font-size: 0.8125rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: #fff;
  margin-bottom: 1.25rem;
}
.footer-col-links { list-style: none; }
.footer-col-links li { margin-bottom: 0.6rem; }
.footer-col-links a {
  font-size: 0.875rem;
  color: rgba(255,255,255,.6);
  transition: color .2s;
}
.footer-col-links a:hover { color: #4ADE80; }
.footer-contact-col { list-style: none; }
.footer-contact-col li {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  margin-bottom: 0.875rem;
  font-size: 0.875rem;
  color: rgba(255,255,255,.65);
}
.footer-contact-col svg { color: #16A34A; flex-shrink: 0; margin-top: 2px; }
.footer-contact-col a { color: rgba(255,255,255,.65); }
.footer-contact-col a:hover { color: #fff; }
.footer-quote-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #F97316;
  color: #fff;
  padding: 0.875rem 1.25rem;
  border-radius: 8px;
  font-weight: 700;
  font-size: 0.9375rem;
  margin-top: 1.25rem;
  transition: background .2s;
}
.footer-quote-btn:hover { background: #EA6C0A; }
.footer-new-bottom {
  border-top: 1px solid rgba(255,255,255,.1);
  padding: 1.25rem 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.75rem;
  font-size: 0.8125rem;
  color: rgba(255,255,255,.5);
}
.footer-new-bottom a { color: rgba(255,255,255,.5); transition: color .2s; }
.footer-new-bottom a:hover { color: #fff; }
.footer-bottom-links { display: flex; gap: 1.5rem; }

/* ── FLOATING BUTTONS ── */
.phone-float-btn {
  position: fixed;
  bottom: 1.75rem;
  left:  1.75rem;
  z-index: 9999;
  width: 54px; height: 54px;
  background: #16A34A;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: #fff;
  box-shadow: 0 4px 18px rgba(22,163,74,.45);
  transition: transform .2s, box-shadow .2s;
}
.phone-float-btn:hover { transform: scale(1.1); box-shadow: 0 6px 24px rgba(22,163,74,.6); }
.wa-float-btn {
  position: fixed;
  bottom: 1.75rem;
  right: 1.75rem;
  z-index: 9999;
  display: flex; align-items: center; gap: 0.625rem;
  background: #25D366;
  color: #fff;
  padding: 0.875rem 1.25rem;
  border-radius: 50px;
  font-weight: 700;
  font-size: 0.9375rem;
  box-shadow: 0 4px 18px rgba(37,211,102,.45);
  transition: transform .2s, box-shadow .2s;
}
.wa-float-btn:hover { transform: scale(1.05); box-shadow: 0 6px 24px rgba(37,211,102,.6); }
.wa-float-btn svg { width: 22px; height: 22px; }

/* ── RESPONSIVE ── */
@media (max-width: 1200px) {
  .why-6-grid       { grid-template-columns: repeat(3, 1fr); }
  .footer-new-grid  { grid-template-columns: 1fr 1fr 1fr; }
}
/* mobile hero truck image (hidden on desktop) */
.hero-mobile-img{ display:none; }

@media (max-width: 1024px) {
  .footer-new-grid { grid-template-columns: 1fr 1fr; }
  /* hero: image is the BACKGROUND LAYER behind the content, text on top */
  .hero-new{
    position:relative;
    background:
      linear-gradient(180deg, rgba(255,255,255,.55) 0%, rgba(255,255,255,.28) 45%, rgba(255,255,255,.36) 100%),
      url('../images/hero-mobile3.webp') center center / cover no-repeat,
      #e8f2fb;
    padding:1.75rem 0 1.25rem;
    overflow:hidden;
  }
  .hero-new::before{ display:none; }
  .hero-new .container{ position:relative; z-index:2; padding-left:1.25rem; padding-right:1.25rem; }
  .hero-new-grid{ grid-template-columns:1fr; gap:1rem; min-height:auto; align-items:start; }
  .hero-content{ max-width:100%; }
  .hero-content .feature-cards{ display:none; }   /* hide 3 cards on mobile so truck stays clear */
  /* make text pop over the truck/skyline image */
  .hero-headline{ color:#0b1220; text-shadow:0 1px 12px rgba(255,255,255,.95), 0 0 4px rgba(255,255,255,.9); }
  .hero-headline .hl{ color:#1f7a14; }
  .hero-desc{ color:#0b1220; font-weight:600; text-shadow:0 1px 10px rgba(255,255,255,1), 0 1px 4px rgba(255,255,255,.95); }
  .hero-top-label{ background:#fff7d9; box-shadow:0 2px 10px rgba(0,0,0,.12); }
  .hero-mobile-img{ display:none; }
}
@media (max-width: 768px) {
  .topbar { display: none; }
  .nav-new, .header-cta-btn { display: none; }
  .hamburger-new { display: flex; }
  .header-new-inner { height: 66px; }
  .logo-link img { height: 92px; width: 92px; }
  .svc-card { flex: 0 0 270px; margin-right: 1rem; border-radius: 16px; }
  .svc-img { border-radius: 16px 16px 0 0; }
  .svc-badge { width: 46px; height: 46px; }
  .svc-body { padding: 1.75rem 1rem 1.2rem; }
  .why-6-grid       { grid-template-columns: repeat(2, 1fr); }
  .reviews-grid     { grid-template-columns: 1fr; }
  .footer-new-grid  { grid-template-columns: 1fr; }
  .footer-brand-col .footer-logo-link img { width: 220px; height: auto; }
  .wa-float-btn span { display: none; }
  .wa-float-btn { padding: 0.9rem; border-radius: 50%; }
  /* hero mobile */
  .feature-card { flex: 1 1 100%; }
  .hero-cta-row { flex-direction: column; }
  .btn-call, .btn-whatsapp-hero { width: 100%; justify-content: center; }
}
@media (max-width: 480px) {
  .hero-headline { font-size: 2rem; line-height:1.12; }
  .hero-desc{ font-size:.95rem; }
}