/* InfinityIT consolidated final overrides v8. Load last.
   Reduced to nav/header/mobile-menu chrome only (global, every page) -
   every page-specific block that used to live here (home, why, team,
   service/industry/location, printer) has moved to that page's own
   CSS file. See features/home.css, partner.css, features/case-studies.css,
   team-contact.css, features/detail-related.css, printers.css. */
body{overflow-x:hidden}.navrow>*{min-width:0}

/* Header and desktop navigation */
.top{height:78px}.navrow{position:relative;height:100%;display:flex;align-items:center;gap:clamp(.75rem,1.25vw,1.35rem)}
.logo-link{display:flex;align-items:center;flex:0 0 auto}
.site-logo{display:block;width:clamp(170px,15vw,210px);height:auto}
.nav{display:flex;align-items:center;gap:clamp(.1rem,.55vw,.55rem);margin-left:auto}.nav>a,.group>
.navdrop{display:inline-flex;align-items:center;gap:.38rem;min-height:44px;padding:.52rem .58rem;border:0;background:transparent;color:inherit;font:inherit;font-weight:750;cursor:pointer;white-space:nowrap}.group{position:relative}
.nav-chevron,.chevron{display:block;width:15px;height:15px;flex:0 0 15px;transition:transform .2s ease}.navdrop[aria-expanded=true]
.nav-chevron,.navdrop[aria-expanded=true] .chevron{transform:rotate(180deg)}

/* ============================================================
   DESKTOP HEADER CALL ACTION

   Matches the existing markup:

   <a class="header-phone">
     [phone icon] 0800 00 22 66
   </a>

   Mobile navigation actions are controlled separately below.
   ============================================================ */

.header-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  margin-left: .3rem;
}

/* Desktop phone button */
.header-actions .header-phone {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;

  width: auto;
  min-width: 158px;
  height: 46px;
  min-height: 46px;
  padding: 0 .85rem;

  border: 1px solid
    color-mix(
      in srgb,
      var(--teal) 42%,
      var(--line)
    );

  border-radius: 13px;

  background:
    color-mix(
      in srgb,
      var(--teal) 6%,
      var(--surface)
    );

  color: var(--text);

  font-size: .87rem;
  font-weight: 800;
  line-height: 1;
  letter-spacing: .005em;

  text-decoration: none;
  white-space: nowrap;

  transition:
    transform .18s ease,
    border-color .18s ease,
    background .18s ease,
    color .18s ease,
    box-shadow .18s ease;
}

/* Phone icon */
.header-actions .header-phone svg {
  display: block;
  flex: 0 0 19px;

  width: 19px;
  height: 19px;

  color: var(--teal);
  stroke: currentColor;
}

/* Hover and keyboard focus */
.header-actions .header-phone:hover,
.header-actions .header-phone:focus-visible {
  transform: translateY(-2px);

  border-color: var(--teal);

  background:
    color-mix(
      in srgb,
      var(--teal) 11%,
      var(--surface)
    );

  color: var(--teal);

  box-shadow:
    0 10px 25px
    rgba(9, 93, 98, .13);
}

.header-actions .header-phone:focus-visible {
  outline: 3px solid
    color-mix(
      in srgb,
      var(--teal) 24%,
      transparent
    );

  outline-offset: 3px;
}

/* ============================================================
   MEDIUM DESKTOP

   Keep the full number visible, but save a little horizontal
   space for the main navigation.
   ============================================================ */

@media (min-width: 1081px) and (max-width: 1180px) {
  .site-logo {
    width: 172px;
  }

  .nav > a,
  .group > .navdrop {
    padding: .48rem .4rem;
    font-size: .91rem;
  }

  .header-actions .header-phone {
    min-width: 146px;
    padding-inline: .7rem;
    font-size: .81rem;
  }

  .header-actions .header-phone svg {
    flex-basis: 18px;
    width: 18px;
    height: 18px;
  }

  .mega-services {
    width:
      min(
        1000px,
        calc(100vw - 32px)
      ) !important;
  }
}

/* ============================================================
   NARROW DESKTOP

   Hide the text node by setting font-size to zero. The SVG
   remains visible and the aria-label retains the accessible
   phone-number description.
   ============================================================ */

@media (min-width: 951px) and (max-width: 1080px) {
  .site-logo {
    width: 166px;
  }

  .nav > a,
  .group > .navdrop {
    padding: .46rem .34rem;
    font-size: .88rem;
  }

  .header-actions .header-phone {
    width: 46px;
    min-width: 46px;
    height: 46px;
    padding: 0;
    font-size: 0;
  }

  .header-actions .header-phone svg {
    flex-basis: 20px;
    width: 20px;
    height: 20px;
  }
}

/* ============================================================
   MOBILE

   Hide only the desktop phone action. The existing mobile
   Call InfinityIT and Book a Call buttons remain unchanged.
   ============================================================ */

@media (max-width: 950px) {
  .header-actions {
    display: none !important;
  }
}


.mobile-nav-actions{display:none}.hamb{display:none;place-items:center;width:46px;height:46px;flex:0 0 46px;margin-left:auto;padding:0;border:1px solid var(--line);border-radius:13px;background:var(--surface);color:var(--text)}.hamb svg{display:block;width:22px;height:22px;margin:auto}


/* Desktop Services mega menu */
.mega-services{position:fixed!important;top:78px!important;left:50vw!important;right:auto!important;width:min(1080px,calc(100vw - 48px))!important;max-width:none!important;max-height:calc(100dvh - 94px);overflow-y:auto;transform:translateX(-50%)!important;border-radius:0 0 24px 24px}.mega-services .mega-intro{display:grid;grid-template-columns:auto minmax(0,1fr);gap:1rem;padding:1rem 1.25rem}.mega-services .mega-mark{width:50px;height:50px}.mega-services .mega-intro h2{font-size:clamp(1.4rem,2vw,1.9rem);margin:.1rem 0}.mega-services .mega-intro p:last-child{margin:.3rem 0 0}.mega-services .mega-service-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.15rem;padding:.55rem .8rem}.mega-services .mega-service{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:.65rem;align-items:start;min-height:124px;padding:.75rem;border-radius:13px}.mega-services .mega-icon{width:40px;height:40px;border-radius:11px}.mega-service-copy{min-width:0}.mega-services .mega-service small{font-size:.66rem}.mega-services .mega-service strong{display:block;font-size:.96rem;line-height:1.25;overflow-wrap:anywhere}.mega-services .mega-service em{display:block;margin-top:.25rem;font-size:.76rem;line-height:1.38}.mega-services .mega-footer{padding:.75rem 1rem}

@media(max-width:1180px) and (min-width:951px){.site-logo{width:172px}.nav>a,.group>.navdrop{padding:.48rem .4rem;font-size:.91rem}.mega-services{width:min(1000px,calc(100vw - 32px))!important}}

@media(max-width:950px){
  html,body{max-width:100%;overflow-x:hidden}.top{height:70px}.navrow{height:70px}.site-logo{width:158px}.hamb{display:grid!important}.header-actions{display:none!important}
  .nav{position:fixed!important;top:70px!important;left:0!important;right:0!important;bottom:0!important;z-index:70;display:none!important;grid-auto-rows:max-content;align-content:start;align-items:stretch;width:100%!important;height:calc(100dvh - 70px)!important;max-height:calc(100dvh - 70px)!important;margin:0!important;padding:.75rem 1rem max(1.25rem,env(safe-area-inset-bottom));overflow-x:hidden!important;overflow-y:scroll!important;overscroll-behavior-y:contain;background:var(--bg);border-top:1px solid var(--line);-webkit-overflow-scrolling:touch;touch-action:pan-y}.nav.open{display:grid!important}.nav>a,.group>.navdrop{justify-content:space-between;width:100%;min-height:46px;padding:.7rem .75rem;border-radius:10px}.group{position:static;width:100%}
  .mega{position:static!important;inset:auto!important;top:auto!important;left:auto!important;right:auto!important;width:100%!important;max-width:none!important;max-height:none!important;height:auto!important;margin:.2rem 0 .5rem!important;overflow:visible!important;transform:none!important;border:1px solid var(--line)!important;border-radius:14px!important;box-shadow:none!important;background:var(--surface)!important}
  .mega-services .mega-intro,.mega-services .mega-footer,.mega-industry .mega-footer{display:none!important}
  .mega-services .mega-service-grid,.mega-industry .industry-menu-grid{display:grid!important;grid-template-columns:1fr!important;gap:.2rem!important;padding:.3rem!important;background:transparent!important}
  .mega-services .mega-service,.mega-industry .industry-menu-grid>a{display:grid!important;grid-template-columns:38px minmax(0,1fr) auto!important;gap:.65rem!important;align-items:center!important;min-height:64px!important;margin:0!important;padding:.58rem!important;border:0!important;border-radius:11px!important;background:transparent!important}
  .mega-services .mega-icon,.mega-industry .industry-menu-grid>a>span:first-child{display:grid!important;place-items:center!important;width:38px!important;height:38px!important;min-width:38px!important;border-radius:11px!important;background:color-mix(in srgb,var(--teal) 12%,transparent)!important;color:var(--teal)!important}
  .mega-services .mega-service em,.mega-industry .industry-menu-grid small{display:none!important}.mega-services .mega-service small{display:block!important;font-size:.63rem!important;letter-spacing:.1em!important;color:var(--teal)!important}.mega-services .mega-service strong,.mega-industry .industry-menu-grid strong{display:block!important;font-size:.93rem!important;line-height:1.25!important;color:var(--text)!important}.mega-services .mega-service>b,.mega-industry .industry-menu-grid>a>b{display:block!important;color:var(--teal)!important}.mega-industry .industry-menu-grid>a>div{min-width:0!important}
  .mobile-nav-actions{display:grid!important;grid-template-columns:1fr 1fr;gap:.6rem;margin-top:.65rem;padding-bottom:1rem}.mobile-nav-actions .button{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;min-height:48px;width:100%}.mobile-call{border:1px solid var(--line);background:var(--surface);color:var(--teal)}.mobile-call svg{width:19px;height:19px}
}

@media(max-width:600px){.nav{padding-inline:.75rem}.mobile-nav-actions{grid-template-columns:1fr}.site-logo{width:150px}}
