/* AXISBRIDGE_VISUAL_FINAL_20260818
   Final desktop normalization layer.
   Loaded AFTER all legacy/shared styles so it is the single source of truth
   for the remaining desktop visual corrections. Mobile/tablet <=1050px is unchanged. */

@media (min-width:1051px){

  /* HEADER LOCKUP --------------------------------------------------------- */
  #ab-site-header .ab-shell-header-inner{
    grid-template-columns:285px minmax(0,1fr) 70px !important;
    column-gap:14px !important;
  }

  #ab-site-header .ab-shell-brand{
    width:285px !important;
    max-width:285px !important;
    height:64px !important;
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
    overflow:visible !important;
    white-space:nowrap !important;
  }

  #ab-site-header img.ab-shell-logo{
    display:block !important;
    flex:0 0 58px !important;
    width:58px !important;
    max-width:58px !important;
    height:50px !important;
    max-height:50px !important;
    object-fit:contain !important;
    object-position:left center !important;
    margin:0 !important;
  }

  #ab-site-header .ab-shell-brand-name{
    display:block !important;
    flex:0 0 auto !important;
    color:#163B63 !important;
    font-family:Inter,Arial,sans-serif !important;
    font-size:18px !important;
    line-height:1.1 !important;
    font-weight:700 !important;
    letter-spacing:-.025em !important;
    white-space:nowrap !important;
    margin:0 !important;
    padding:0 !important;
  }

  /* TOP UTILITY BANNER ---------------------------------------------------- */
  .ab-shell-utility{
    height:auto !important;
    min-height:48px !important;
    overflow:visible !important;
  }

  .ab-shell-utility-inner{
    height:auto !important;
    min-height:48px !important;
    padding:7px 0 8px !important;
    box-sizing:border-box !important;
    overflow:visible !important;
    align-items:center !important;
  }

  .ab-shell-tagline{
    display:block !important;
    height:auto !important;
    min-height:0 !important;
    margin:0 !important;
    padding:0 0 2px !important;
    overflow:visible !important;
    text-overflow:clip !important;
    white-space:nowrap !important;
    font-size:13px !important;
    line-height:1.4 !important;
  }

  .ab-shell-portal-wrap{
    height:auto !important;
    min-height:34px !important;
    align-items:center !important;
  }

  /* SECTION SPACING ------------------------------------------------------- */
  main#main > section:not([data-preserve-spacing]){
    margin-top:0 !important;
    margin-bottom:0 !important;
  }

  main#main > section.section:not(.cta-section){
    padding-top:12px !important;
    padding-bottom:12px !important;
  }

  main#main > section.page-hero{
    padding-top:16px !important;
    padding-bottom:14px !important;
    margin-top:0 !important;
    margin-bottom:0 !important;
  }

  main#main > section.services-intro-strip{
    padding-top:6px !important;
    padding-bottom:6px !important;
    margin-top:0 !important;
    margin-bottom:0 !important;
  }

  main#main > section.cta-section{
    padding-top:20px !important;
    padding-bottom:20px !important;
  }

  .section-header{
    margin-bottom:8px !important;
  }

  /* HERO GRID ALIGNMENT --------------------------------------------------- */
  .page-hero-grid,
  .about-hero-grid,
  .framework-hero-grid,
  .insights-hero-grid,
  .industries-hero-grid{
    align-items:center !important;
  }

  .page-hero-grid > :first-child,
  .about-hero-grid > :first-child,
  .framework-hero-grid > :first-child,
  .insights-hero-grid > :first-child,
  .industries-hero-grid > :first-child{
    align-self:center !important;
  }

  /* All image-based dark hero panels are centered and own no artificial height. */
  .hr-hero-image-panel,
  .payroll-hero-image-panel,
  .hris-hero-image-panel,
  .managed-hero-image-panel,
  .process-hero-panel-image,
  .fractional-hero-panel-image,
  .framework-hero-image-panel,
  .insights-hero-image-panel,
  .about-name-panel-image{
    min-height:0 !important;
    height:auto !important;
    width:100% !important;
    max-width:520px !important;
    padding:0 !important;
    margin:0 auto !important;
    align-self:center !important;
    justify-self:center !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    overflow:hidden !important;
  }

  .hr-hero-image-panel::before,.hr-hero-image-panel::after,
  .payroll-hero-image-panel::before,.payroll-hero-image-panel::after,
  .hris-hero-image-panel::before,.hris-hero-image-panel::after,
  .managed-hero-image-panel::before,.managed-hero-image-panel::after,
  .process-hero-panel-image::before,.process-hero-panel-image::after,
  .fractional-hero-panel-image::before,.fractional-hero-panel-image::after,
  .framework-hero-image-panel::before,.framework-hero-image-panel::after,
  .insights-hero-image-panel::before,.insights-hero-image-panel::after,
  .about-name-panel-image::before,.about-name-panel-image::after{
    content:none !important;
    display:none !important;
  }

  /* 4:3 hero artwork.  The wrapper itself is 4:3; the image fills it with
     object-fit:contain so CSS cannot stretch the artwork vertically. */
  .hr-hero-image-panel,
  .payroll-hero-image-panel,
  .hris-hero-image-panel,
  .process-hero-panel-image,
  .fractional-hero-panel-image,
  .framework-hero-image-panel,
  .insights-hero-image-panel,
  .about-name-panel-image{
    aspect-ratio:4 / 3 !important;
  }

  .hr-hero-image-panel img,
  .payroll-hero-image-panel img,
  .hris-hero-image-panel img,
  .process-hero-panel-image img,
  .fractional-hero-panel-image img,
  .framework-hero-image-panel img,
  .insights-hero-image-panel img,
  .about-name-panel-image img{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    height:100% !important;
    max-height:100% !important;
    aspect-ratio:4 / 3 !important;
    object-fit:contain !important;
    object-position:center center !important;
    margin:0 !important;
    transform:none !important;
    filter:none !important;
    image-rendering:auto !important;
  }

  /* Managed Services artwork is square. */
  .managed-hero-image-panel{
    max-width:470px !important;
    aspect-ratio:1 / 1 !important;
  }

  .managed-hero-image-panel img{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    height:100% !important;
    max-height:100% !important;
    aspect-ratio:1 / 1 !important;
    object-fit:contain !important;
    object-position:center center !important;
    margin:0 !important;
    transform:none !important;
    filter:none !important;
    image-rendering:auto !important;
  }

  /* Industries uses a separate figure element. */
  .industry-aware-graphic-replacement{
    width:100% !important;
    max-width:520px !important;
    margin:0 auto !important;
    align-self:center !important;
    justify-self:center !important;
    transform:none !important;
  }

  .industry-aware-graphic-replacement img{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    height:auto !important;
    object-fit:contain !important;
    object-position:center center !important;
    margin:0 auto !important;
    transform:none !important;
    filter:none !important;
  }

  /* Other newer dark graphics in two-column sections. */
  .framework-diagram-image,
  .framework-connection-image{
    align-self:center !important;
    justify-self:center !important;
    margin-inline:auto !important;
  }

  .framework-diagram-image img,
  .framework-connection-image img{
    display:block !important;
    width:min(100%,520px) !important;
    height:auto !important;
    object-fit:contain !important;
    object-position:center center !important;
    margin:0 auto !important;
    transform:none !important;
    filter:none !important;
  }

  .about-reach-section .service-area-panel h3{
    word-spacing:.18em !important;
    letter-spacing:.01em !important;
  }
}

@media (min-width:1051px) and (max-width:1180px){
  #ab-site-header .ab-shell-header-inner{
    grid-template-columns:245px minmax(0,1fr) 64px !important;
    column-gap:9px !important;
  }

  #ab-site-header .ab-shell-brand{
    width:245px !important;
    max-width:245px !important;
    gap:8px !important;
  }

  #ab-site-header img.ab-shell-logo{
    flex-basis:50px !important;
    width:50px !important;
    max-width:50px !important;
    height:44px !important;
    max-height:44px !important;
  }

  #ab-site-header .ab-shell-brand-name{
    font-size:16px !important;
  }
}


/* AXISBRIDGE_LINKEDIN_UTILITY_MOVE_20260818 */
.ab-shell-portal-wrap{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
}
.ab-shell-linkedin{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;
  min-height:34px !important;
  padding:7px 12px !important;
  border:1px solid rgba(255,255,255,.42) !important;
  border-radius:8px !important;
  background:rgba(255,255,255,.08) !important;
  color:#fff !important;
  font-size:12px !important;
  line-height:1 !important;
  font-weight:700 !important;
  text-decoration:none !important;
  white-space:nowrap !important;
  box-sizing:border-box !important;
}
.ab-shell-linkedin:hover,
.ab-shell-linkedin:focus-visible{
  background:rgba(255,255,255,.16) !important;
  border-color:rgba(255,255,255,.68) !important;
  color:#fff !important;
}
.ab-shell-linkedin svg{
  width:15px !important;
  height:15px !important;
  flex:0 0 15px !important;
  fill:currentColor !important;
}
@media (max-width:860px){
  .ab-shell-portal-wrap{gap:6px !important}
  .ab-shell-linkedin{padding:6px 8px !important;font-size:11px !important}
  .ab-shell-linkedin svg{width:13px !important;height:13px !important;flex-basis:13px !important}
}
