/* NGI V16.1.2 — Mobile-first shell and branch gateway polish */

/* Branch gateway: compact executive cards instead of tall desktop blocks */
.gatewayhero{max-width:920px;margin:0 auto 16px;padding:14px 2px 10px}
.gatewayhero .eyebrow{letter-spacing:1.2px}
.gatewayhero h1{font-size:clamp(26px,4vw,36px)!important;line-height:1.25;margin:7px 0 8px!important}
.gatewayhero p{max-width:720px;margin:0;color:var(--muted);line-height:1.7}
.branchgrid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px!important;align-items:stretch}
.branchcard,.branchcard.shebin,.branchcard.sadat,.branchcard.central{
  min-height:0!important;padding:17px!important;border-radius:18px!important;
  display:grid!important;grid-template-columns:68px minmax(0,1fr);grid-template-rows:auto auto;
  column-gap:14px;row-gap:8px;align-items:center;justify-content:initial!important;
  box-shadow:0 4px 16px rgba(18,49,66,.07)!important;transform:none!important;
}
.branchcard.shebin{border-top:3px solid #169b7a!important}
.branchcard.sadat{border-top:3px solid #6d7fd6!important}
.branchcard.central{grid-column:auto!important;border-top:3px solid #7fc64f!important}
.branchcard .branchicon{
  grid-row:1/3;width:68px;height:68px;border-radius:16px;display:grid;place-items:center;
  padding:7px;background:var(--surface2)!important;border:1px solid var(--line);
  font-size:25px!important;overflow:hidden
}
.branchcard .branchicon img{display:block;width:100%;height:100%;object-fit:contain;border-radius:10px}
.branchcard>div{min-width:0;align-self:center}
.branchcard em{font-size:8px!important;letter-spacing:1.15px!important;display:block;margin-bottom:2px}
.branchcard h2{font-size:21px!important;line-height:1.25;margin:2px 0 4px!important}
.branchcard p{font-size:9.5px!important;line-height:1.55;margin:0 0 6px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.branchcard small{font-size:8.5px!important;display:flex;align-items:center;gap:7px;min-height:16px}
.branchcard small .statusdot{position:static!important;display:inline-block;flex:0 0 8px;width:8px!important;height:8px!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 12%,transparent)!important}
.branchcard>b{
  grid-column:2;justify-self:start;align-self:end;font-size:9.5px!important;line-height:1;
  padding:8px 11px;border-radius:9px;background:var(--soft);text-decoration:none
}
.branchcard.central>b{background:rgba(255,255,255,.1)}
.branchcard.central .branchicon{border-color:rgba(255,255,255,.12)!important}

/* Mobile shell */
@media(max-width:900px){
  .branch-gateway .wrap{padding:14px 14px 22px!important}
  .branch-gateway .mobile-dock{display:none!important}
  .branch-gateway .workspace>header{height:56px!important;padding:0 12px!important;border-bottom:1px solid var(--line);box-shadow:none}
  .branch-gateway .workspace>header .global-search{display:none!important}
  .branch-gateway .workspace>header .themes{display:none!important}
  .branch-gateway .workspace>header .user{margin-inline-start:auto!important}
  .branch-gateway .workspace>header .user>a{background:var(--surface2);border:1px solid var(--line);padding:7px 10px!important;border-radius:9px}
  .branch-gateway .nav-toggle{width:40px;height:40px;padding:0;border-radius:10px;background:var(--surface2);color:var(--ink);border:1px solid var(--line);font-size:20px}
  .branchgrid{grid-template-columns:1fr!important;gap:10px!important;max-width:720px;margin:0 auto}
  .gatewayhero{max-width:720px;margin:0 auto 12px;padding:6px 2px 8px}
  .gatewayhero h1{font-size:28px!important}
  .gatewayhero p{font-size:11px!important}
  .branchcard,.branchcard.shebin,.branchcard.sadat,.branchcard.central{
    grid-template-columns:74px minmax(0,1fr) auto!important;grid-template-rows:1fr!important;
    padding:13px 14px!important;column-gap:12px!important;border-radius:16px!important;
  }
  .branchcard .branchicon{grid-row:1!important;width:74px;height:74px;border-radius:15px;padding:6px}
  .branchcard>div{grid-column:2;grid-row:1}
  .branchcard>b{grid-column:3;grid-row:1;align-self:center!important;justify-self:end!important;white-space:nowrap;padding:9px 10px!important}
  .branchcard p{font-size:9px!important;margin-bottom:5px!important}
}

@media(max-width:620px){
  /* Header: less chrome, more content */
  .workspace>header{height:58px!important;padding:0 10px!important;gap:8px!important}
  .nav-toggle{width:40px;height:40px;padding:0!important;border-radius:10px!important}
  .global-search{margin:0!important;min-width:0!important;flex:1 1 auto!important}
  .global-search input{height:38px!important;font-size:10.5px!important;padding-inline:10px 42px!important}
  .global-search button{width:34px!important;height:32px!important}
  .user>a{padding:7px 9px!important;font-size:9px!important}
  .wrap{padding:14px 12px 86px!important}
  .mobile-dock{right:8px!important;left:8px!important;bottom:7px!important;height:58px!important;border-radius:17px!important;padding:4px 7px!important}
  .mobile-dock a,.mobile-dock button{height:47px!important}
  .mobile-dock .dock-main{height:52px!important;margin-top:-12px!important;border-radius:15px!important}
  .mobile-dock span{font-size:16px!important}.mobile-dock b{font-size:7.5px!important}

  .branch-gateway .wrap{padding:10px 10px 18px!important}
  .branch-gateway .workspace>header{height:52px!important}
  .branch-gateway .nav-toggle{width:38px;height:38px}
  .gatewayhero{padding:5px 2px 7px!important;margin-bottom:7px!important;text-align:right}
  .gatewayhero .eyebrow{font-size:8px!important;letter-spacing:.85px}
  .gatewayhero h1{font-size:24px!important;margin:5px 0 5px!important}
  .gatewayhero p{font-size:10px!important;line-height:1.6!important;margin:0!important}
  .branchgrid{gap:8px!important}
  .branchcard,.branchcard.shebin,.branchcard.sadat,.branchcard.central{
    grid-template-columns:64px minmax(0,1fr) auto!important;padding:10px 11px!important;
    column-gap:10px!important;border-radius:14px!important;box-shadow:0 3px 12px rgba(18,49,66,.055)!important
  }
  .branchcard .branchicon{width:64px;height:64px;border-radius:13px;padding:5px}
  .branchcard em{font-size:7px!important;margin:0}
  .branchcard h2{font-size:19px!important;margin:1px 0 3px!important}
  .branchcard p{font-size:8px!important;margin:0 0 4px!important}
  .branchcard small{font-size:7.5px!important;gap:5px}
  .branchcard>b{font-size:0!important;width:34px;height:34px;padding:0!important;border-radius:10px;display:grid;place-items:center}
  .branchcard>b:after{content:'←';font-size:17px;font-weight:900}
}

@media(max-width:390px){
  .branchcard,.branchcard.shebin,.branchcard.sadat,.branchcard.central{grid-template-columns:56px minmax(0,1fr) 32px!important;padding:9px!important;column-gap:8px!important}
  .branchcard .branchicon{width:56px;height:56px}
  .branchcard h2{font-size:17px!important}.branchcard p{display:none}.branchcard small{font-size:7px!important}
  .gatewayhero h1{font-size:22px!important}
}