/* ============================================================
   PowerBIConsultantUSA.com — style.css v9
   Mobile-first, fully responsive, tested 320px → 1400px
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Sora:wght@400;600;700;800&family=DM+Sans:wght@400;500;600&display=swap');

/* ── Reset ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{font-family:'DM Sans',sans-serif;color:#1a2235;background:#fff;line-height:1.7;overflow-x:hidden;min-width:320px}
img{max-width:100%;height:auto;display:block}
a{text-decoration:none;color:inherit}
ul,ol{list-style:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;padding:0}
input,select,textarea{font-family:inherit;font-size:16px}/* 16px prevents iOS zoom */

/* ── Variables ── */
:root{
  --b:#0078D4;--bd:#005A9E;--b2:#003F73;--bl:#EBF4FF;
  --t:#00B4D8;--n:#0D1B2A;--nm:#152540;
  --g:#F7F9FC;--br:#DDE4EE;
  --tx:#1a2235;--t2:#3d4f6b;--t3:#6b7c9a;
  --ok:#107C10;--go:#F4B942;--red:#dc2626;
  --fh:'Sora',sans-serif;--fb:'DM Sans',sans-serif;
  --r:8px;--rm:14px;--rl:20px;
  --sh:0 2px 12px rgba(0,0,0,.07),0 1px 3px rgba(0,0,0,.04);
  --shm:0 8px 32px rgba(0,0,0,.11),0 2px 8px rgba(0,0,0,.06);
  --shb:0 8px 32px rgba(0,120,212,.28);
  --tr:all .2s cubic-bezier(.4,0,.2,1);
  --mw:1200px;
}

/* ── Typography ── */
h1,h2,h3,h4,h5,h6{font-family:var(--fh);line-height:1.2;color:var(--n);font-weight:700}
h1{font-size:clamp(1.65rem,5vw,3.1rem);line-height:1.15}
h2{font-size:clamp(1.3rem,3.5vw,2.2rem)}
h3{font-size:clamp(.98rem,2vw,1.2rem)}
h4{font-size:.98rem;font-weight:700}
p{color:var(--t2);line-height:1.75}

/* ── Layout ── */
.wrap{max-width:var(--mw);margin:0 auto;padding:0 clamp(16px,4vw,32px)}
.sec{padding:clamp(48px,8vw,88px) 0}
.sec-alt{background:var(--g)}
.sec-dk{background:var(--n)}
.tc{text-align:center}
.sh{text-align:center;max-width:660px;margin:0 auto clamp(32px,5vw,52px)}
.sh h2{margin-bottom:10px}

/* ── Labels ── */
.lbl{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--b);background:var(--bl);padding:4px 14px;border-radius:40px;margin-bottom:14px}
.lbl.lt{color:var(--t);background:rgba(0,180,216,.15)}
.lbl.gn{color:#065f46;background:#d1fae5}

/* ── Buttons ── */
.btn-p,.btn-s,.btn-g{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:var(--fb);font-size:.9rem;font-weight:700;
  padding:13px 24px;border-radius:var(--r);border:2px solid transparent;
  cursor:pointer;transition:var(--tr);white-space:nowrap;line-height:1;
  text-decoration:none;
}
.btn-p{background:var(--b);color:#fff;border-color:var(--b)}
.btn-p:hover{background:var(--bd);border-color:var(--bd);transform:translateY(-2px);box-shadow:var(--shb)}
.btn-s{background:transparent;color:var(--b);border-color:var(--b)}
.btn-s:hover{background:var(--bl);transform:translateY(-2px)}
.btn-g{background:rgba(255,255,255,.13);color:#fff;border-color:rgba(255,255,255,.35)}
.btn-g:hover{background:rgba(255,255,255,.22);transform:translateY(-2px)}
.btn-lg{padding:15px 32px;font-size:1rem}
.btn-sm{padding:8px 16px;font-size:.8rem}
.btn-pulse{animation:pulse-cta 2.5s infinite}
@keyframes pulse-cta{0%,100%{box-shadow:0 0 0 0 rgba(0,120,212,.4)}50%{box-shadow:0 0 0 12px rgba(0,120,212,0)}}

/* ══════════════════════════════════
   SCARCITY BAR
══════════════════════════════════ */
.scarcity-bar{
  background:linear-gradient(90deg,#b91c1c,#dc2626);
  color:#fff;text-align:center;
  padding:9px 40px 9px 16px;
  font-size:.78rem;font-weight:700;letter-spacing:.01em;
  position:relative;line-height:1.4;
}
.scarcity-bar a{color:#fde68a;text-decoration:underline}
.scarcity-bar a:hover{color:#fff}

/* ══════════════════════════════════
   TOP BAR
══════════════════════════════════ */
#topbar{
  background:var(--n);color:rgba(255,255,255,.8);
  padding:8px 16px;position:relative;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.tbw{
  display:flex;align-items:center;justify-content:center;
  gap:12px;flex-wrap:nowrap;
  max-width:var(--mw);margin:0 auto;
  font-size:.74rem;font-weight:500;
  overflow:hidden;
}
.tbb{
  display:inline-flex;align-items:center;gap:5px;flex-shrink:0;
  background:rgba(0,120,212,.3);border:1px solid rgba(0,120,212,.5);
  color:#7ec8f7;padding:2px 10px;border-radius:20px;
  font-size:.67rem;font-weight:700;letter-spacing:.04em;white-space:nowrap;
}
.tbt{color:rgba(255,255,255,.65);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tbp{color:var(--t);font-weight:700;white-space:nowrap;flex-shrink:0}
.tbp:hover{color:#fff}
.tbc{
  position:absolute;right:12px;top:50%;transform:translateY(-50%);
  color:rgba(255,255,255,.3);font-size:.9rem;line-height:1;
  padding:5px;transition:color .15s;cursor:pointer;flex-shrink:0;
}
.tbc:hover{color:rgba(255,255,255,.7)}

/* ══════════════════════════════════
   HEADER
══════════════════════════════════ */
#hdr{
  position:sticky;top:0;z-index:1000;
  background:#fff;border-bottom:1px solid var(--br);
  transition:box-shadow .25s;
}
#hdr.sc{box-shadow:0 2px 24px rgba(0,0,0,.1);border-bottom-color:transparent}

.hi{
  max-width:var(--mw);margin:0 auto;
  padding:0 clamp(16px,3vw,28px);
  height:64px;
  display:flex;align-items:center;gap:8px;
}

/* Logo */
.logo{
  display:flex;align-items:center;gap:9px;
  text-decoration:none;flex-shrink:0;margin-right:auto;
  min-width:0;
}
.logo-ic{
  width:34px;height:34px;background:var(--b);border-radius:7px;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.logo-ic svg{width:19px;height:19px;color:#fff}
.logo-t{display:flex;flex-direction:column;min-width:0}
.logo-m{
  font-family:var(--fh);font-size:.85rem;font-weight:400;
  color:var(--n);line-height:1.2;letter-spacing:-.01em;
  white-space:nowrap;
}
.logo-m strong{font-weight:800}
.logo-usa{color:var(--b)}
.logo-s{font-size:.54rem;color:var(--t3);font-weight:500;letter-spacing:.015em;white-space:nowrap}

/* Nav */
.nav{display:flex;align-items:center;margin-left:16px}
.ni{position:relative}
.nl{
  display:flex;align-items:center;gap:3px;
  padding:7px 11px;font-size:.81rem;font-weight:600;
  color:var(--t2);border-radius:var(--r);
  transition:var(--tr);white-space:nowrap;cursor:pointer;
}
.nl:hover,.ni:hover>.nl{color:var(--b);background:var(--bl)}
.nl svg{width:10px;height:10px;opacity:.55;transition:transform .2s;flex-shrink:0}
.ni:hover>.nl svg{transform:rotate(180deg);opacity:1}

/* Dropdowns */
.dd{
  position:absolute;top:calc(100% + 6px);left:-12px;
  background:#fff;border:1px solid var(--br);border-radius:var(--rm);
  box-shadow:0 20px 60px rgba(0,0,0,.13),0 4px 16px rgba(0,0,0,.07);
  opacity:0;visibility:hidden;pointer-events:none;
  transform:translateY(-8px);
  transition:opacity .17s,transform .17s,visibility .17s;
  z-index:999;
}
.dd-sm{min-width:220px}
.dd-lg{min-width:660px}
.ni:hover .dd{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}
.ddi{display:flex;padding:18px}
.dc{flex:1;padding:0 13px;border-right:1px solid var(--br)}
.dc:last-child{border-right:none}
.dd-sm .dc{border-right:none;padding:0 8px}
.dh{font-size:.62rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--t3);margin-bottom:8px;padding-bottom:6px;border-bottom:1px solid var(--br)}
.dl{display:block;padding:5px 8px;font-size:.79rem;color:var(--t2);border-radius:5px;transition:all .12s;margin-bottom:2px;font-weight:500}
.dl:hover{background:var(--bl);color:var(--b);padding-left:13px}
.fsa{color:var(--b)!important;font-weight:600!important;margin-top:4px}
.dc-cta{flex:0 0 190px}
.cta-box{background:linear-gradient(135deg,var(--n),var(--b2));border-radius:var(--r);padding:16px;margin-top:8px}
.cta-box-t,.cta-box p{font-size:.74rem;color:#fff;margin-bottom:10px;line-height:1.5}
.cta-box-btn{display:block;background:var(--b);color:#fff;padding:8px 10px;border-radius:5px;font-size:.74rem;font-weight:700;text-align:center;transition:var(--tr)}
.cta-box-btn:hover{background:var(--t)}

/* Header right */
.ha{display:flex;align-items:center;gap:8px;flex-shrink:0;margin-left:8px}
.hph{display:flex;align-items:center;gap:5px;font-size:.79rem;font-weight:700;color:var(--t2);transition:var(--tr);white-space:nowrap}
.hph:hover{color:var(--b)}
.hph svg{width:12px;height:12px;flex-shrink:0}

/* Hamburger */
.ham{
  display:none;flex-direction:column;justify-content:center;align-items:center;
  gap:5px;width:40px;height:40px;
  cursor:pointer;border-radius:var(--r);
  transition:var(--tr);flex-shrink:0;
}
.ham:hover{background:var(--g)}
.ham span{
  display:block;width:20px;height:2px;
  background:var(--n);border-radius:2px;
  transition:var(--tr);
}
.ham.active span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.ham.active span:nth-child(2){opacity:0;transform:scaleX(0)}
.ham.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* Mobile menu */
.mob{
  display:none;
  position:fixed;inset:0;
  background:#fff;z-index:998;
  flex-direction:column;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
}
.mob.open{display:flex}
.mob-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:18px clamp(16px,4vw,24px) 14px;
  border-bottom:1px solid var(--br);
  flex-shrink:0;
}
.mob-close{
  width:36px;height:36px;border-radius:50%;
  border:1.5px solid var(--br);background:none;
  display:flex;align-items:center;justify-content:center;
  font-size:1.1rem;color:var(--t2);cursor:pointer;
  transition:var(--tr);flex-shrink:0;
}
.mob-close:hover{background:var(--g)}
.mob-links{
  display:flex;flex-direction:column;
  padding:8px clamp(16px,4vw,24px);flex:1;
}
.mob-link{
  display:flex;align-items:center;gap:12px;
  font-size:.95rem;font-weight:600;color:var(--tx);
  padding:13px 14px;border-radius:var(--r);
  border-bottom:1px solid var(--br);
  transition:var(--tr);text-decoration:none;
}
.mob-link:last-child{border-bottom:none}
.mob-link:hover{background:var(--bl);color:var(--b);padding-left:18px}
.mob-link-icon{
  width:30px;height:30px;background:var(--bl);border-radius:6px;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.mob-link-icon svg{width:15px;height:15px;color:var(--b)}
.mob-ctas{
  padding:16px clamp(16px,4vw,24px) 24px;
  display:flex;flex-direction:column;gap:10px;
  border-top:1px solid var(--br);flex-shrink:0;
}
.mob-ctas .btn-p,.mob-ctas .btn-s{
  justify-content:center;font-size:.95rem;
  padding:15px 24px;width:100%;
}

/* ══════════════════════════════════
   TRUST BAR
══════════════════════════════════ */
.trust-bar{
  background:#fff;
  border-bottom:2px solid var(--bl);
  padding:10px clamp(16px,3vw,24px);
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}
.trust-bar-inner{
  max-width:var(--mw);margin:0 auto;
  display:flex;align-items:center;justify-content:center;
  gap:0;min-width:max-content;
}
.tb-item{
  display:flex;align-items:center;gap:6px;
  padding:5px 16px;font-size:.75rem;font-weight:700;color:var(--n);
  border-right:1px solid var(--br);white-space:nowrap;
}
.tb-item:last-child{border-right:none}
.tb-ms{
  background:#0078D4;border-radius:4px;
  width:20px;height:20px;display:flex;align-items:center;justify-content:center;flex-shrink:0;
}

/* ══════════════════════════════════
   HERO
══════════════════════════════════ */
.hero{
  position:relative;
  min-height:clamp(520px,80vh,900px);
  background:var(--n);
  display:flex;align-items:center;
  overflow:hidden;
  padding:clamp(64px,10vw,100px) 0 clamp(48px,8vw,72px);
}
.hbg{
  position:absolute;inset:0;
  background:
    radial-gradient(ellipse 80% 70% at 65% 40%,rgba(0,120,212,.2) 0%,transparent 70%),
    radial-gradient(ellipse 50% 50% at 85% 75%,rgba(0,180,216,.12) 0%,transparent 65%),
    linear-gradient(150deg,#0D1B2A 0%,#0f2035 40%,#0D1B2A 100%);
}
.hgrid{
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(0,120,212,.07) 1px,transparent 1px),
    linear-gradient(90deg,rgba(0,120,212,.07) 1px,transparent 1px);
  background-size:60px 60px;
  -webkit-mask-image:radial-gradient(ellipse 80% 80% at 55% 50%,black 20%,transparent 80%);
  mask-image:radial-gradient(ellipse 80% 80% at 55% 50%,black 20%,transparent 80%);
}
.hin{
  position:relative;z-index:2;
  display:grid;grid-template-columns:1fr 1fr;
  gap:clamp(24px,4vw,52px);align-items:center;
}
.hc{max-width:600px}
.hbadge{
  display:inline-flex;align-items:center;gap:7px;
  background:rgba(0,120,212,.18);border:1px solid rgba(0,120,212,.4);
  border-radius:40px;padding:5px 14px 5px 9px;
  margin-bottom:clamp(16px,3vw,24px);
  font-size:.76rem;font-weight:600;color:#7ec8f7;
}
.dot{width:7px;height:7px;background:var(--t);border-radius:50%;animation:pd 2s infinite;flex-shrink:0}
@keyframes pd{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.4)}}
.hero h1{color:#fff;margin-bottom:clamp(12px,2vw,18px);line-height:1.13}
.hl{
  background:linear-gradient(90deg,var(--t) 0%,#7ec8f7 100%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  background-clip:text;
}
.hdesc{
  color:rgba(255,255,255,.72);
  font-size:clamp(.9rem,2vw,1.04rem);
  margin-bottom:clamp(20px,3vw,32px);line-height:1.75;
}
.hacts{
  display:flex;gap:10px;flex-wrap:wrap;
  margin-bottom:clamp(20px,3vw,32px);
  align-items:center;
}
.htrust{display:flex;align-items:center;gap:clamp(10px,2vw,18px);flex-wrap:wrap}
.ti{display:flex;align-items:center;gap:6px;font-size:.76rem;color:rgba(255,255,255,.48);font-weight:500}
.tc2{color:var(--t);font-weight:700}

/* Dashboard mockup */
.hv{position:relative;padding:clamp(10px,3vw,20px) clamp(10px,3vw,20px) clamp(20px,4vw,30px)}
.dm{
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.14);
  border-radius:14px;overflow:hidden;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  animation:fl 4.5s ease-in-out infinite;
  box-shadow:0 20px 70px rgba(0,0,0,.3);
}
@keyframes fl{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.dh2{background:rgba(0,0,0,.22);padding:9px 13px;display:flex;align-items:center;gap:9px;border-bottom:1px solid rgba(255,255,255,.08)}
.dots{display:flex;gap:5px}
.dots span{width:9px;height:9px;border-radius:50%}
.dots span:nth-child(1){background:#ff5f57}
.dots span:nth-child(2){background:#febc2e}
.dots span:nth-child(3){background:#28c840}
.dt{font-size:.68rem;color:rgba(255,255,255,.4);margin-left:4px;font-family:var(--fh)}
.krow{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,.07);margin-bottom:1px}
.kc{background:rgba(255,255,255,.05);padding:11px 12px}
.kl{font-size:.58rem;color:rgba(255,255,255,.36);text-transform:uppercase;letter-spacing:.06em;margin-bottom:3px}
.kv{font-family:var(--fh);font-size:1.1rem;font-weight:700;color:#fff;line-height:1}
.ku{font-size:.61rem;color:#4ade80;margin-top:3px}
.kd{font-size:.61rem;color:#f87171;margin-top:3px}
.ca{padding:12px;background:rgba(255,255,255,.02)}
.cbs{display:flex;align-items:flex-end;gap:4px;height:52px}
.cb{flex:1;background:rgba(0,180,216,.25);border-radius:3px 3px 0 0}
.cb.hi{background:linear-gradient(to top,#0078D4,var(--t))}
.prow{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(255,255,255,.07)}
.pc{background:rgba(255,255,255,.05);padding:11px 12px;display:flex;align-items:center;gap:9px}
.pr{width:38px;height:38px;border-radius:50%;flex-shrink:0}
.pr.c1{background:conic-gradient(var(--t) 68%,rgba(255,255,255,.1) 0)}
.pr.c2{background:conic-gradient(#7c3aed 83%,rgba(255,255,255,.1) 0)}
.pl{font-size:.59rem;color:rgba(255,255,255,.36);margin-bottom:2px}
.pv{font-family:var(--fh);font-size:.92rem;font-weight:700;color:#fff}
.fc{position:absolute;background:#fff;border-radius:10px;padding:10px 14px;box-shadow:0 10px 36px rgba(0,0,0,.22);border:1px solid rgba(0,0,0,.05)}
.fc1{bottom:10px;left:0;animation:fl 4.5s ease-in-out infinite .9s}
.fc2{top:10px;right:0;animation:fl 4.5s ease-in-out infinite 1.6s}
.fs{font-family:var(--fh);font-size:1.05rem;font-weight:800;color:var(--b)}
.fl2{font-size:.61rem;color:var(--t3);margin-top:2px;white-space:nowrap}

/* Client logos */
.ls{padding:clamp(18px,3vw,26px) 0;border-top:1px solid var(--br);border-bottom:1px solid var(--br);background:#fff}
.ls-l{text-align:center;font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--t3);margin-bottom:clamp(10px,2vw,16px)}
.ls-r{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;padding:0 16px}
.li{font-size:.68rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--t3);padding:6px 13px;background:var(--g);border:1px solid var(--br);border-radius:5px;transition:var(--tr)}
.li:hover{border-color:var(--b);color:var(--b)}

/* Stats */
.sg{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--br);border:1px solid var(--br);border-radius:var(--rm);overflow:hidden}
.sb{background:#fff;padding:clamp(20px,4vw,34px) clamp(12px,2vw,22px);text-align:center;transition:var(--tr)}
.sb:hover{background:var(--bl)}
.sn{font-family:var(--fh);font-size:clamp(1.8rem,4vw,2.4rem);font-weight:800;color:var(--b);line-height:1;margin-bottom:7px}
.sl{font-size:clamp(.75rem,1.5vw,.85rem);font-weight:600;color:var(--t3)}

/* Service cards */
.svgr{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,22px)}
.svc{
  background:#fff;border:1px solid var(--br);border-radius:var(--rm);
  padding:clamp(18px,3vw,28px);transition:var(--tr);display:block;
  position:relative;overflow:hidden;
}
.svc::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--b),var(--t));transform:scaleX(0);transition:transform .28s;transform-origin:left}
.svc:hover::before{transform:scaleX(1)}
.svc:hover{transform:translateY(-4px);box-shadow:var(--shm);border-color:rgba(0,120,212,.2)}
.svi{width:46px;height:46px;border-radius:var(--r);display:flex;align-items:center;justify-content:center;margin-bottom:16px;background:var(--bl);flex-shrink:0}
.svi svg{width:22px;height:22px;color:var(--b)}
.svc h3{margin-bottom:7px;font-size:clamp(.9rem,1.8vw,1rem)}
.svc p{font-size:clamp(.8rem,1.5vw,.86rem);margin-bottom:13px;line-height:1.62}
.sla{font-size:.8rem;font-weight:700;color:var(--b);display:flex;align-items:center;gap:4px;transition:gap .2s}

/* Why us */
.wl{display:flex;flex-direction:column;gap:10px;margin-top:18px}
.wi{display:flex;align-items:flex-start;gap:11px;padding:13px 15px;background:#fff;border:1px solid var(--br);border-radius:var(--r);transition:var(--tr)}
.wi:hover{border-color:var(--b);background:var(--bl)}
.wck{width:22px;height:22px;background:var(--ok);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:2px}
.wck svg{width:12px;height:12px;color:#fff}
.wt strong{display:block;font-size:.88rem;color:var(--n);margin-bottom:2px;font-family:var(--fh)}
.wt span{font-size:.8rem;color:var(--t3);line-height:1.6}

/* Industries */
.igr{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(10px,1.5vw,14px)}
.ic{background:#fff;border:1px solid var(--br);border-radius:var(--rm);padding:clamp(14px,2vw,22px) clamp(12px,2vw,16px);text-align:center;transition:var(--tr);display:block}
.ic:hover{background:var(--b);border-color:var(--b);transform:translateY(-3px);box-shadow:var(--shb)}
.ic:hover .ii{background:rgba(255,255,255,.2)}
.ic:hover .ii svg{color:#fff}
.ic:hover h4,.ic:hover p{color:#fff}
.ii{width:42px;height:42px;background:var(--bl);border-radius:var(--r);display:flex;align-items:center;justify-content:center;margin:0 auto 11px;transition:var(--tr)}
.ii svg{width:20px;height:20px;color:var(--b);transition:var(--tr)}
.ic h4{font-size:.86rem;margin-bottom:3px;transition:var(--tr);line-height:1.3}
.ic p{font-size:.7rem;color:var(--t3);transition:var(--tr);line-height:1.4}

/* Process */
.pr2{display:grid;grid-template-columns:repeat(3,1fr);gap:0;position:relative}
.pr2::before{content:'';position:absolute;top:33px;left:calc(100%/6);right:calc(100%/6);height:2px;background:linear-gradient(90deg,var(--b),var(--t));z-index:0}
.ps{text-align:center;padding:0 clamp(10px,2vw,20px);position:relative;z-index:1}
.pn{width:66px;height:66px;border-radius:50%;background:var(--b);display:flex;align-items:center;justify-content:center;margin:0 auto 18px;font-family:var(--fh);font-size:1.2rem;font-weight:800;color:#fff;box-shadow:var(--shb);transition:var(--tr)}
.ps:hover .pn{background:var(--n);transform:scale(1.08)}
.ps h3{margin-bottom:7px}
.ps p{font-size:.85rem}

/* Case studies */
.cgr{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,22px)}
.cc{background:#fff;border:1px solid var(--br);border-radius:var(--rm);overflow:hidden;transition:var(--tr)}
.cc:hover{transform:translateY(-4px);box-shadow:var(--shm)}
.cct{height:5px;background:linear-gradient(90deg,var(--b),var(--t))}
.ccb{padding:clamp(16px,2.5vw,24px)}
.ctag{display:inline-block;font-size:.66rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--b);background:var(--bl);padding:3px 9px;border-radius:40px;margin-bottom:10px}
.cc h3{font-size:.92rem;margin-bottom:7px;line-height:1.4;font-family:var(--fh)}
.cc p{font-size:.82rem;margin-bottom:13px;line-height:1.65}
.cm{display:flex;align-items:center;gap:9px;background:var(--g);border-radius:var(--r);padding:9px 12px;margin-bottom:13px;border:1px solid var(--br)}
.cmv{font-family:var(--fh);font-size:1.25rem;font-weight:800;color:var(--ok)}
.cml{font-size:.72rem;color:var(--t3);line-height:1.4}

/* Testimonials */
.tw{position:relative;overflow:hidden}
.ttr{display:flex;transition:transform .55s cubic-bezier(.4,0,.2,1)}
.ts{min-width:100%;padding:0 clamp(8px,2vw,20px)}
.tc3{
  max-width:760px;margin:0 auto;
  background:#fff;border:1px solid var(--br);border-radius:var(--rl);
  padding:clamp(24px,4vw,44px) clamp(18px,4vw,52px);
  text-align:center;box-shadow:0 4px 22px rgba(0,0,0,.07);
}
.st{display:flex;justify-content:center;gap:3px;margin-bottom:16px}
.st svg{width:16px;height:16px;color:var(--go)}
.tq{font-size:clamp(.88rem,2vw,1.02rem);font-style:italic;color:var(--t2);line-height:1.8;margin-bottom:22px}
.ta{font-weight:700;color:var(--n);font-size:.88rem;font-family:var(--fh)}
.tr2{font-size:.79rem;color:var(--t3);margin-top:3px}
.tctl{display:flex;justify-content:center;align-items:center;gap:12px;margin-top:clamp(16px,3vw,26px)}
.tb{width:40px;height:40px;border-radius:50%;border:1.5px solid var(--br);background:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:var(--tr);flex-shrink:0}
.tb:hover{background:var(--b);border-color:var(--b)}
.tb:hover svg{color:#fff}
.tb svg{width:15px;height:15px;color:var(--t2)}
.td-wrap{display:flex;gap:6px;align-items:center}
.td{width:8px;height:8px;border-radius:50%;background:var(--br);cursor:pointer;transition:var(--tr);border:none;padding:0;flex-shrink:0}
.td.on{background:var(--b);width:22px;border-radius:4px}
.tav{width:44px;height:44px;background:linear-gradient(135deg,var(--b),var(--t));border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--fh);font-weight:800;font-size:.92rem;color:#fff;flex-shrink:0}

/* Lead form */
.lfw{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,56px);align-items:start}
.fg{margin-bottom:14px}
.fg label{display:block;font-size:.8rem;font-weight:700;color:var(--n);margin-bottom:5px}
.fg input,.fg select,.fg textarea{
  width:100%;padding:11px 13px;
  border:1.5px solid var(--br);border-radius:var(--r);
  font-family:var(--fb);font-size:16px;color:var(--tx);
  background:#fff;transition:var(--tr);outline:none;
  -webkit-appearance:none;appearance:none;
}
.fg input:focus,.fg select:focus,.fg textarea:focus{border-color:var(--b);box-shadow:0 0 0 3px rgba(0,120,212,.09)}
.fg select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7c9a' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;background-size:16px;padding-right:36px;
}
.fg textarea{resize:vertical;min-height:92px;line-height:1.6}
.fr{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fci h2{margin-bottom:9px}
.fci>p{margin-bottom:18px}
.wact{display:flex;align-items:center;gap:11px;background:#e8f9ee;border:1px solid #a8ddb7;border-radius:var(--r);padding:12px 15px;margin-top:16px;transition:var(--tr)}
.wact:hover{background:#d0f2de}
.wact svg{width:20px;height:20px;color:#25D366;flex-shrink:0}
.wact span{font-size:.85rem;font-weight:700;color:#1a6e35}
.urg{display:flex;align-items:center;gap:7px;background:#FEF3C7;border:1px solid #F59E0B;border-radius:var(--r);padding:9px 12px;margin-bottom:14px;font-size:.8rem;font-weight:600;color:#92400E}
.ty{text-align:center;padding:clamp(28px,5vw,40px) 20px}
.ty-icon{width:58px;height:58px;background:#d1fae5;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 14px;font-size:1.5rem;color:#059669}
.ty h3{font-family:var(--fh);font-size:1.25rem;margin-bottom:9px}

/* Blog */
.bgr{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,24px)}
.bc2{background:#fff;border:1px solid var(--br);border-radius:var(--rm);overflow:hidden;transition:var(--tr)}
.bc2:hover{transform:translateY(-4px);box-shadow:var(--shm)}
.bth{height:clamp(130px,18vw,170px);background:linear-gradient(135deg,var(--b2),var(--b));position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}
.bcat{position:absolute;top:10px;left:10px;font-size:.64rem;font-weight:700;text-transform:uppercase;color:var(--t);background:rgba(0,0,0,.4);padding:3px 8px;border-radius:40px}
.bti{opacity:.12}
.bti svg{width:64px;height:64px;color:#fff}
.bb{padding:clamp(14px,2.5vw,20px)}
.bm{display:flex;gap:8px;font-size:.71rem;color:var(--t3);margin-bottom:7px}
.bc2 h3{font-size:.9rem;line-height:1.45;margin-bottom:6px;font-family:var(--fh)}
.bc2 p{font-size:.8rem;margin-bottom:11px;line-height:1.62}
.bla{font-size:.79rem;font-weight:700;color:var(--b);display:flex;align-items:center;gap:4px}

/* CTA band */
.ctab{background:linear-gradient(135deg,var(--b2) 0%,var(--b) 100%);padding:clamp(48px,7vw,76px) 0;text-align:center;position:relative;overflow:hidden}
.ctab::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:48px 48px}
.ctab h2{color:#fff;margin-bottom:10px;position:relative}
.ctab>div>p{color:rgba(255,255,255,.75);margin-bottom:26px;position:relative;font-size:.98rem}
.ctab .bg{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;position:relative}

/* Breadcrumb */
.bc{display:flex;align-items:center;gap:6px;font-size:.76rem;color:var(--t3);padding:9px 0;flex-wrap:wrap}
.bc a{color:var(--b)}
.bc svg{width:10px;height:10px;opacity:.6}

/* Page hero */
.ph{background:var(--n);padding:clamp(72px,10vw,100px) 0 clamp(40px,6vw,56px);position:relative;overflow:hidden}
.ph::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 65% 85% at 80% 50%,rgba(0,120,212,.16) 0%,transparent 70%)}
.ph::after{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(0,120,212,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(0,120,212,.05) 1px,transparent 1px);background-size:52px 52px}
.phi{position:relative;z-index:2}
.ph h1{color:#fff;margin-bottom:12px}
.ph>div>p{color:rgba(255,255,255,.68);font-size:clamp(.9rem,2vw,1rem);max-width:660px;line-height:1.76}

/* Partner badges */
.badges-section{background:#fff;border-top:1px solid var(--br);border-bottom:1px solid var(--br);padding:clamp(28px,4vw,40px) 0}
.badges-grid{display:flex;align-items:stretch;justify-content:center;gap:clamp(8px,1.5vw,16px);flex-wrap:wrap}
.badge-card{display:flex;flex-direction:column;align-items:center;gap:7px;padding:clamp(12px,2vw,18px) clamp(14px,2vw,22px);background:#fff;border:1.5px solid var(--br);border-radius:13px;min-width:clamp(110px,14vw,140px);text-align:center;transition:var(--tr)}
.badge-card:hover{border-color:var(--b);transform:translateY(-2px);box-shadow:var(--sh)}
.badge-icon{width:50px;height:50px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-family:var(--fh);font-weight:900}
.badge-icon.ms{background:#0078D4}
.badge-icon.cert{background:var(--bl);color:var(--b);font-size:.95rem}
.badge-icon.star{background:#FEF3C7;font-size:1.35rem}
.badge-name{font-size:.74rem;font-weight:800;color:var(--n);line-height:1.3}
.badge-sub{font-size:.62rem;color:var(--t3);line-height:1.3}

/* Why us grid */
.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,20px)}
.why-card{background:#fff;border:1px solid var(--br);border-radius:var(--rm);padding:clamp(18px,2.5vw,24px);transition:var(--tr)}
.why-card:hover{border-color:rgba(0,120,212,.3);transform:translateY(-3px);box-shadow:var(--sh)}
.why-icon{font-size:1.75rem;margin-bottom:12px;display:block;line-height:1}
.why-card h3{font-size:.96rem;margin-bottom:7px}
.why-card p{font-size:.83rem;line-height:1.7}

/* Pricing */
.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,22px)}
.price-card{background:#fff;border:1.5px solid var(--br);border-radius:var(--rm);padding:clamp(22px,3vw,32px) clamp(18px,2.5vw,26px);text-align:center;transition:var(--tr);position:relative}
.price-card:hover{border-color:var(--b);transform:translateY(-4px);box-shadow:var(--shm)}
.price-card.featured{border-color:var(--b);border-width:2px;box-shadow:var(--shb)}
.price-badge{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:var(--b);color:#fff;font-size:.68rem;font-weight:800;letter-spacing:.07em;text-transform:uppercase;padding:4px 16px;border-radius:20px;white-space:nowrap}
.price-name{font-size:.78rem;font-weight:700;color:var(--t3);text-transform:uppercase;letter-spacing:.08em;margin-bottom:13px}
.price-from{font-size:.7rem;color:var(--t3);margin-bottom:4px}
.price-amount{font-family:var(--fh);font-size:clamp(1.8rem,3.5vw,2.4rem);font-weight:800;color:var(--n);line-height:1;margin-bottom:5px}
.price-period{font-size:.74rem;color:var(--t3);margin-bottom:18px}
.price-features{list-style:none;display:flex;flex-direction:column;gap:8px;margin-bottom:24px;text-align:left}
.price-features li{display:flex;align-items:flex-start;gap:8px;font-size:.83rem;color:var(--t2)}
.price-features li::before{content:"✓";color:var(--ok);font-weight:700;flex-shrink:0;margin-top:1px}

/* Press */
.press-section{background:var(--g);padding:clamp(24px,4vw,36px) 0;border-top:1px solid var(--br);border-bottom:1px solid var(--br)}
.press-logos{display:flex;align-items:center;justify-content:center;gap:clamp(8px,1.5vw,24px);flex-wrap:wrap}
.press-item{font-size:.73rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--t3);padding:8px 16px;background:#fff;border:1.5px solid var(--br);border-radius:8px;transition:var(--tr)}
.press-item:hover{border-color:var(--b);color:var(--b)}

/* Footer */
.ft{background:var(--n);padding:clamp(40px,6vw,60px) 0 clamp(32px,5vw,48px)}
.fg2{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1.1fr;gap:clamp(18px,2.5vw,28px)}
.fd{font-size:.8rem;color:rgba(255,255,255,.5);line-height:1.76;margin:12px 0 14px}
.ftr{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:12px}
.ftb{font-size:.62rem;font-weight:700;background:rgba(0,120,212,.2);border:1px solid rgba(0,120,212,.4);color:#7ec8f7;padding:3px 8px;border-radius:20px}
.frat{display:flex;align-items:center;gap:7px}
.fst{color:var(--go);font-size:.86rem;letter-spacing:.04em}
.frt{font-size:.7rem;color:rgba(255,255,255,.36)}
.fh{font-family:var(--fh);font-size:.65rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.4);margin-bottom:12px;padding-bottom:6px;border-bottom:1px solid rgba(255,255,255,.07)}
.fl{list-style:none;display:flex;flex-direction:column;gap:7px}
.fl a{font-size:.78rem;color:rgba(255,255,255,.47);transition:var(--tr)}
.fl a:hover{color:var(--t);padding-left:4px}
.fsa{color:var(--t)!important;font-weight:600;margin-top:3px}
.fph{display:flex;align-items:center;gap:7px;font-size:1rem;font-weight:800;color:#fff;text-decoration:none;margin-bottom:9px;font-family:var(--fh);transition:var(--tr)}
.fph:hover{color:var(--t)}
.fph svg{width:14px;height:14px;flex-shrink:0}
.fadr{font-size:.76rem;color:rgba(255,255,255,.4);line-height:1.8;margin-bottom:12px}
.fwa{display:flex;align-items:center;gap:7px;background:#25D366;color:#fff;padding:9px 13px;border-radius:8px;font-size:.78rem;font-weight:700;transition:var(--tr);margin-bottom:4px}
.fwa:hover{background:#1da851}
.fbot{background:#0A1521;border-top:1px solid rgba(255,255,255,.05);padding:14px 0}
.fbi{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;font-size:.7rem;color:rgba(255,255,255,.55)}
.fbi a{color:rgba(255,255,255,.55)}
.fbi a:hover{color:var(--t)}
.fbl{display:flex;align-items:center;gap:12px;flex-wrap:wrap}

/* Floating elements */
.waf{position:fixed;bottom:clamp(72px,12vw,88px);right:16px;z-index:990;width:52px;height:52px;background:#25D366;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 18px rgba(37,211,102,.4);transition:var(--tr)}
.waf:hover{transform:scale(1.1)}
.waf svg{width:24px;height:24px;color:#fff}

#mbar{display:none;position:fixed;bottom:0;left:0;right:0;z-index:989;background:var(--n);border-top:2px solid var(--b);padding:7px 10px;gap:7px}
.mb{flex:1;text-align:center;padding:11px 5px;border-radius:7px;font-weight:700;font-size:.74rem;text-decoration:none;transition:var(--tr);line-height:1.3}
.mb.call{background:var(--b);color:#fff}
.mb.wa{background:#25D366;color:#fff}
.mb.qt{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.17)}

/* Social proof popup */
.sp-float{position:fixed;bottom:clamp(130px,20vw,164px);right:16px;z-index:988;background:#fff;border:1px solid var(--br);border-radius:12px;padding:12px 15px;box-shadow:var(--shm);max-width:220px;font-size:.74rem;animation:slideup .5s ease}
@keyframes slideup{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.sp-float strong{display:block;color:var(--n);font-size:.77rem;margin-bottom:2px}

/* Live chat */
.live-chat-btn{position:fixed;bottom:clamp(72px,12vw,88px);left:16px;z-index:990;background:#fff;border:1.5px solid var(--br);border-radius:var(--rm);padding:9px 15px;box-shadow:var(--shm);display:flex;align-items:center;gap:7px;font-size:.77rem;font-weight:700;color:var(--n);transition:var(--tr)}
.live-chat-btn:hover{border-color:var(--b);color:var(--b)}
.live-dot{width:8px;height:8px;background:#25D366;border-radius:50%;flex-shrink:0;animation:ld 2s infinite}
@keyframes ld{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.3)}}

/* Exit popup */
#eo{display:none;position:fixed;inset:0;background:rgba(0,0,0,.65);z-index:9998;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
#ep{display:none;align-items:center;justify-content:center;position:fixed;inset:0;z-index:9999;padding:16px}
#ep-inner{background:#fff;border-radius:18px;padding:clamp(28px,5vw,40px) clamp(22px,4vw,36px);max-width:440px;width:100%;position:relative;box-shadow:0 20px 60px rgba(0,0,0,.24)}
#ec{position:absolute;top:13px;right:13px;color:var(--t3);cursor:pointer;padding:6px;line-height:1;font-size:1rem;border-radius:50%;transition:var(--tr)}
#ec:hover{background:var(--g)}

/* FAQ */
.faq-item{border:1.5px solid var(--br);border-radius:var(--r);margin-bottom:8px;overflow:hidden;transition:border-color .2s}
.faq-item:hover{border-color:rgba(0,120,212,.3)}
.faq-q{width:100%;text-align:left;padding:14px 18px;background:#fff;cursor:pointer;font-family:var(--fh);font-size:.9rem;font-weight:600;color:var(--n);display:flex;justify-content:space-between;align-items:center;gap:10px;transition:var(--tr)}
.faq-q:hover{background:var(--bl);color:var(--b)}
.faq-q svg{width:15px;height:15px;flex-shrink:0;transition:transform .22s;color:var(--t3)}
.faq-q.open{background:var(--bl);color:var(--b)}
.faq-q.open svg{transform:rotate(180deg);color:var(--b)}
.faq-a{display:none;padding:0 18px 14px;font-size:.86rem;color:var(--t2);line-height:1.75}

/* ROI range input */
input[type=range]{-webkit-appearance:none;appearance:none;height:6px;border-radius:3px;outline:none;cursor:pointer;width:100%}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:var(--b);box-shadow:0 2px 8px rgba(0,120,212,.4);cursor:pointer;border:3px solid #fff}
input[type=range]::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--b);border:3px solid #fff;cursor:pointer}

/* Animations */
.fu{opacity:0;transform:translateY(20px);transition:opacity .55s ease,transform .55s ease}
.fu.vis{opacity:1;transform:none}
section[id]{scroll-margin-top:80px}



/* ════════════════════════════════════════════════════════
   RESPONSIVE — MOBILE FIRST — ALL BREAKPOINTS
════════════════════════════════════════════════════════ */

/* ── 1200px: Wide tablet / small desktop ── */
@media(max-width:1200px){
  .fg2{grid-template-columns:1fr 1fr 1fr}
  .fg2>*:first-child{grid-column:1/-1}
  .pricing-grid{grid-template-columns:1fr 1fr 1fr}
}

/* ── 960px: Tablet / Large mobile ── */
@media(max-width:960px){
  /* Header */
  .nav,.ha{display:none!important}
  .ham{display:flex!important}
  .logo{margin-right:0}
  #hdr .hi{padding:0 16px}

  /* Body */
  body{padding-bottom:66px}

  /* Mobile bar always visible on mobile */
  #mbar{display:flex!important}
  .waf{bottom:76px;right:16px}
  .live-chat-btn{display:none}
  .sp-float{display:none}

  /* Trust bar — scrollable on mobile */
  .trust-bar{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .trust-bar-inner{justify-content:flex-start;min-width:max-content;padding:0 4px}
  .tb-item{padding:6px 14px;font-size:.73rem;flex-shrink:0}

  /* Scarcity bar */
  .scarcity-bar{font-size:.73rem;padding:8px 38px 8px 12px}

  /* Hero */
  .hin{grid-template-columns:1fr}
  .hv{display:none}
  .hero{min-height:auto;padding:48px 0 44px}
  .hc{max-width:100%}

  /* Grids: 2 col */
  .svgr,.cgr,.bgr{grid-template-columns:1fr 1fr}
  .igr{grid-template-columns:repeat(2,1fr)}
  .sg{grid-template-columns:repeat(2,1fr)}
  .why-grid{grid-template-columns:1fr 1fr}
  .pricing-grid{grid-template-columns:1fr}

  /* Process */
  .pr2{grid-template-columns:1fr;gap:28px}
  .pr2::before{display:none}

  /* Form */
  .lfw{grid-template-columns:1fr}
  .fci{border-top:1px solid var(--br);padding-top:28px;margin-top:8px}

  /* Footer */
  .fg2{grid-template-columns:1fr 1fr}
  .fg2>*:first-child{grid-column:1/-1}

  /* Sticky sidebar non-sticky on tablet */
  .sticky-cta{position:static}

  /* Blog 2-col layout */
  .blog-layout{grid-template-columns:1fr}

  /* Testimonial */
  .tc3{padding:28px 24px}

  /* Badges */
  .badges-grid{gap:10px}
  .badge-card{min-width:calc(33% - 8px);padding:14px 10px}

  /* Comparison layout */
  .comp-layout{grid-template-columns:1fr}
}

/* ── 640px: Mobile ── */
@media(max-width:640px){
  :root{--mw:100%}
  .wrap{padding:0 16px}
  .sec{padding:40px 0}

  /* Top bar */
  #topbar{padding:7px 36px 7px 14px}
  .tbw{font-size:.7rem;gap:8px}
  .tbt{display:none}
  .tbsep{display:none}

  /* Scarcity bar */
  .scarcity-bar{font-size:.68rem;padding:7px 34px 7px 12px;line-height:1.4}
  .scarcity-bar a{display:none}

  /* Header */
  .logo-s{display:none}
  .logo-ic{width:30px;height:30px}
  .logo-m{font-size:.82rem}
  #hdr .hi{height:58px;padding:0 14px}

  /* Trust bar — hide some items */
  .trust-bar{padding:0}
  .trust-bar-inner{padding:8px 14px;gap:0;overflow-x:auto}
  .tb-item{padding:5px 10px;font-size:.68rem;border-right:none;border-bottom:none}
  .tb-ms{width:18px;height:18px}
  .tb-item:nth-child(n+4){display:none}

  /* Hero */
  .hero{padding:36px 0 40px}
  h1{font-size:clamp(1.6rem,7vw,2.2rem)}
  .hdesc{font-size:.93rem}
  .hbadge{font-size:.68rem;padding:4px 12px 4px 8px}
  .hacts{flex-direction:column;gap:9px}
  .hacts .btn-p,.hacts .btn-g{width:100%;justify-content:center;font-size:.92rem;padding:14px 20px}
  .htrust{justify-content:center;gap:8px}
  .ti{font-size:.72rem}

  /* Stats */
  .sg{grid-template-columns:1fr 1fr;gap:1px}
  .sn{font-size:1.9rem}
  .sb{padding:22px 14px}

  /* Grids: single col */
  .svgr,.cgr,.bgr{grid-template-columns:1fr}
  .igr{grid-template-columns:1fr 1fr}
  .why-grid{grid-template-columns:1fr}
  .pricing-grid{grid-template-columns:1fr}
  .badges-grid{grid-template-columns:repeat(2,1fr);display:grid}
  .badge-card{min-width:auto;padding:12px 10px}

  /* Form */
  .fr{grid-template-columns:1fr}
  .fg input,.fg select,.fg textarea{font-size:16px}/* Prevents iOS zoom */

  /* Footer */
  .fg2{grid-template-columns:1fr}
  .fbi{flex-direction:column;text-align:center;gap:8px}
  .fbl{justify-content:center;flex-wrap:wrap}
  .fph{font-size:.95rem}

  /* Mobile bar */
  #mbar{padding:6px 10px;gap:6px}
  .mb{font-size:.7rem;padding:10px 4px}

  /* WhatsApp float */
  .waf{width:48px;height:48px;bottom:74px;right:14px}
  .waf svg{width:22px;height:22px}

  /* Process */
  .ps{padding:0 8px}
  .pn{width:56px;height:56px;font-size:1.1rem}

  /* Testimonial */
  .tc3{padding:22px 16px}
  .tq{font-size:.9rem;line-height:1.7}
  .tav{width:38px;height:38px;font-size:.85rem}

  /* Lead form */
  .lfw{gap:28px}
  .urg{font-size:.76rem}

  /* Blog layout */
  .blog-layout{display:block}
  .blog-layout>aside{display:none}

  /* Case study grid */
  .cc .ccb{padding:18px}

  /* Comparison tables */
  .comp-cards{grid-template-columns:1fr}
  .comp-table{font-size:.78rem}
  .comp-table td,.comp-table th{padding:8px 10px}

  /* Pricing */
  .price-card{padding:24px 18px}
  .price-amount{font-size:2rem}

  /* Section headers */
  .sh{margin-bottom:32px}
  h2{font-size:clamp(1.25rem,5vw,1.8rem)}
  h3{font-size:1rem}

  /* Page hero */
  .ph{padding:72px 0 36px}

  /* Breadcrumb */
  .bc{font-size:.72rem;gap:5px}
}

/* ── 400px: Small phones ── */
@media(max-width:400px){
  .wrap{padding:0 12px}
  h1{font-size:1.55rem}
  .igr{grid-template-columns:1fr 1fr}
  .sg{grid-template-columns:1fr 1fr}
  .badges-grid{grid-template-columns:1fr 1fr}
  .mb{font-size:.65rem;padding:9px 3px}
  .hacts .btn-p,.hacts .btn-g{font-size:.85rem;padding:12px 16px}
  .tb-item{font-size:.65rem;padding:5px 8px}
  .price-amount{font-size:1.8rem}
}

/* ── Touch / hover states ── */
@media(hover:none){
  .svc:hover,.ic:hover,.wi:hover,.cc:hover,.bc2:hover{transform:none}
  .btn-p:hover,.btn-s:hover,.btn-g:hover{transform:none}
}

/* ── Topbar text/sep classes ── */
.tbt{color:rgba(255,255,255,.65);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tbsep{color:rgba(255,255,255,.2);flex-shrink:0}

/* ── Mobile menu close X ── */
.mob.open~#mob-close,.mob.open+#mob-close{display:flex!important}
#mob-close:hover{background:var(--g)}

/* ── Blog 2-col layout ── */
.blog-layout{display:grid;grid-template-columns:1fr 300px;gap:40px;align-items:start}

/* ── Comparison table ── */
.comp-table{width:100%;border-collapse:collapse;font-size:.86rem}
.comp-table td,.comp-table th{padding:11px 16px}
.comp-cards{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:40px}

/* ── Section container max-width guard ── */
.wrap{max-width:var(--mw);margin:0 auto;padding:0 clamp(14px,4vw,28px);width:100%}

/* ── Prevent any element exceeding viewport ── */
img,video,iframe,table,pre,code{max-width:100%}
input,select,textarea,button{max-width:100%}

/* ── Mobile CTA bar fix ── */
#mbar{
  display:none;
  position:fixed;bottom:0;left:0;right:0;z-index:989;
  background:var(--n);border-top:2px solid var(--b);
  padding:8px 10px;gap:8px;
  /* safe area for iPhone notch */
  padding-bottom:calc(8px + env(safe-area-inset-bottom,0px));
}
.mb{
  flex:1;text-align:center;
  padding:10px 4px;
  border-radius:7px;font-weight:700;
  font-size:clamp(.64rem,.8rem + .2vw,.75rem);
  text-decoration:none;transition:var(--tr);
  line-height:1.25;white-space:nowrap;
  display:flex;align-items:center;justify-content:center;gap:4px;
}
.mb.call{background:var(--b);color:#fff}
.mb.wa{background:#25D366;color:#fff}
.mb.qt{background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.2)}

/* ── Hero text safe on mobile ── */
.hero h1 .hl{word-break:break-word}
.hdesc{max-width:100%}
.hacts{width:100%}

/* ── Tables overflow ── */
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;width:100%}
table{min-width:500px}
.comp-table{min-width:auto}

/* ── Pricing on mobile ── */
@media(max-width:640px){
  .price-card.featured{order:-1}
  .blog-layout{display:block}
  .blog-layout aside{display:none}
  .comp-cards{grid-template-columns:1fr}
  .fg2{grid-template-columns:1fr}
  .fg2>*{grid-column:auto}
  /* Ensure grids stack */
  div[style*="grid-template-columns:1fr 1fr"]{display:block!important}
  div[style*="grid-template-columns:1.1fr"]{display:block!important}
  div[style*="grid-template-columns:1.2fr"]{display:block!important}
  div[style*="grid-template-columns:1.5fr"]{display:block!important}
  /* Fix gaps on stacked */
  div[style*="display:grid"]{gap:20px!important}
}