/* Scallex final controlled visual correction — release 20260914-final5 */
:root{
  --on-dark-heading:#ffffff;
  --on-dark-body:#e8efff;
  --on-dark-muted:#d8e5ff;
  --on-dark-link:#ffffff;
  --on-dark-eyebrow:#dff8ff;
  --on-dark-border:rgba(255,255,255,.38);
  --visual-icon-tile:#edf8ff;
  --visual-icon-tile-border:rgba(75,126,216,.10);
}

/* Text-only Services / Resources triggers: open state is shown without arrows. */
body.ux-shell-v1 .nav-label--text-only{gap:0;position:relative}
body.ux-shell-v1 .nav-label--text-only[aria-expanded="true"]{color:var(--navy);background:var(--bg)}
body.ux-shell-v1 .nav-label--text-only[aria-expanded="true"]::after{content:"";position:absolute;left:.62rem;right:.62rem;bottom:.34rem;height:2px;border-radius:999px;background:linear-gradient(90deg,var(--blue),var(--cyan))}
body.ux-shell-v1 .ux-services-nav>.nav-label--text-only,
body.ux-shell-v1 .ux-resources-nav>.nav-label--text-only{padding-inline:.62rem}
body.ux-shell-v1 .ux-menu-footer{list-style:none;padding:.28rem .75rem .65rem;border-top:1px solid rgba(223,228,239,.8);margin-top:.2rem}
body.ux-shell-v1 .ux-menu-footer>a{display:inline-flex;padding:.55rem .65rem;color:var(--navy);font-weight:850}

/* Filled/duotone pictograms stay subordinate to text. */
.ux-service-symbol{width:46px;height:46px;border-radius:13px;background:linear-gradient(145deg,#f1f8ff,#e6f6fb);box-shadow:inset 0 0 0 1px var(--visual-icon-tile-border);color:#315fc3}
.ux-service-symbol svg{width:26px;height:26px;display:block}
.ux-service-symbol--managed{color:#315fc3}.ux-service-symbol--m365{color:#3176ce}.ux-service-symbol--network{color:#0b899a}.ux-service-symbol--cyber{color:#315cc9}.ux-service-symbol--backup{color:#12877e}.ux-service-symbol--ai{color:#635ed0}.ux-service-symbol--strategy{color:#314b99}
body.ux-shell-v1 .ux-services-menu .ux-service-symbol--managed,.ux-prototype-v1 .ux-service-link .ux-service-symbol--managed,.ux-prototype-v1 .ux-service-title-row .ux-service-symbol--managed{color:#315fc3}
body.ux-shell-v1 .ux-services-menu .ux-service-symbol--m365,.ux-prototype-v1 .ux-service-link .ux-service-symbol--m365,.ux-prototype-v1 .ux-service-title-row .ux-service-symbol--m365{color:#3176ce}
body.ux-shell-v1 .ux-services-menu .ux-service-symbol--network,.ux-prototype-v1 .ux-service-link .ux-service-symbol--network,.ux-prototype-v1 .ux-service-title-row .ux-service-symbol--network{color:#0b899a}
body.ux-shell-v1 .ux-services-menu .ux-service-symbol--cyber,.ux-prototype-v1 .ux-service-link .ux-service-symbol--cyber,.ux-prototype-v1 .ux-service-title-row .ux-service-symbol--cyber{color:#315cc9}
body.ux-shell-v1 .ux-services-menu .ux-service-symbol--backup,.ux-prototype-v1 .ux-service-link .ux-service-symbol--backup,.ux-prototype-v1 .ux-service-title-row .ux-service-symbol--backup{color:#12877e}
body.ux-shell-v1 .ux-services-menu .ux-service-symbol--ai,.ux-prototype-v1 .ux-service-link .ux-service-symbol--ai,.ux-prototype-v1 .ux-service-title-row .ux-service-symbol--ai{color:#635ed0}
body.ux-shell-v1 .ux-services-menu .ux-service-symbol--strategy,.ux-prototype-v1 .ux-service-link .ux-service-symbol--strategy,.ux-prototype-v1 .ux-service-title-row .ux-service-symbol--strategy{color:#314b99}
body.scallex-interior-brand-v1 .sv-concept-icon,body.scallex-interior-brand-v1 .sv-icon-tile{color:#315fc3}
body.ux-shell-v1 .ux-services-menu .ux-service-menu-link{grid-template-columns:40px minmax(0,1fr);column-gap:.72rem;align-items:start;padding:.62rem .68rem}
body.ux-shell-v1 .ux-services-menu .ux-service-symbol{width:40px;height:40px;border-radius:11px;margin-top:.02rem}
body.ux-shell-v1 .ux-services-menu .ux-service-symbol svg{width:21px;height:21px}
body.ux-shell-v1 .ux-service-menu-copy{display:grid;grid-template-columns:minmax(0,1fr);gap:.13rem;min-width:0}
body.ux-shell-v1 .ux-service-menu-copy strong{display:block;line-height:1.28;color:var(--ink)}
body.ux-shell-v1 .ux-service-menu-copy>span{display:block;line-height:1.35;color:var(--muted)}
.ux-prototype-v1 .ux-service-link{grid-template-columns:46px minmax(0,1fr);column-gap:.82rem;align-items:start}
.ux-prototype-v1 .ux-service-link .ux-service-symbol{width:46px;height:46px;border-radius:13px;margin-top:.02rem}
.ux-prototype-v1 .ux-service-link .ux-service-symbol svg{width:26px;height:26px}
.ux-prototype-v1 .ux-service-title-row .ux-service-symbol{width:46px;height:46px;border-radius:13px}
.ux-prototype-v1 .ux-service-title-row .ux-service-symbol svg{width:26px;height:26px}
.sv-icon-tile{width:44px;height:44px;border-radius:13px;background:linear-gradient(145deg,#f1f8ff,#e6f6fb);box-shadow:inset 0 0 0 1px var(--visual-icon-tile-border);color:#315fc3}
.sv-icon-tile svg{width:24px;height:24px}
body.scallex-interior-brand-v1 .info-icon.sv-concept-icon svg,
body.scallex-interior-brand-v1 .service-icon.sv-concept-icon svg,
.sv-concept-icon svg{width:24px;height:24px}

/* Current homepage structure stays intact; only the hero visual surface changes. */
body.scallex-home-brand-v1 .home-hero.ux-home-hero{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:
    radial-gradient(circle at 17% 18%,rgba(95,171,255,.12),transparent 34%),
    radial-gradient(circle at 86% 15%,rgba(0,180,216,.10),transparent 31%),
    linear-gradient(135deg,#ffffff 0%,#f8fbff 42%,#eef7ff 100%);
  color:var(--brand-ink);
}
body.scallex-home-brand-v1 .home-hero.ux-home-hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  pointer-events:none;
  background:url("/assets/img/home-hero-regional.svg?v=20260914-final5") center bottom/cover no-repeat;
  opacity:1;
}
body.scallex-home-brand-v1 .home-hero.ux-home-hero::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(ellipse at 50% 43%,rgba(255,255,255,.985) 0%,rgba(255,255,255,.94) 31%,rgba(255,255,255,.55) 53%,rgba(255,255,255,.08) 76%,transparent 88%),
    linear-gradient(180deg,rgba(255,255,255,.08),rgba(236,246,255,.18));
}
body.scallex-home-brand-v1 .home-hero.ux-home-hero>.container{position:relative;z-index:1}
body.scallex-home-brand-v1 .home-hero.ux-home-hero h1{color:var(--brand-primary-dark)}
body.scallex-home-brand-v1 .home-hero.ux-home-hero .hero-copy{color:var(--brand-muted)}
body.scallex-home-brand-v1 .home-hero.ux-home-hero .eyebrow.light{
  color:var(--brand-primary-mid);
  background:rgba(62,100,200,.08);
  border-color:rgba(62,100,200,.16);
}
body.scallex-home-brand-v1 .home-hero.ux-home-hero .btn-white{
  color:#fff;
  background:linear-gradient(135deg,var(--brand-primary-dark),var(--brand-primary-light));
  border:1px solid transparent;
  box-shadow:0 10px 26px rgba(29,52,147,.18);
}
body.scallex-home-brand-v1 .home-hero.ux-home-hero .btn-white:hover,
body.scallex-home-brand-v1 .home-hero.ux-home-hero .btn-white:focus-visible{
  color:#fff;
  background:linear-gradient(135deg,#172b7f,#3159bb);
  box-shadow:0 14px 30px rgba(29,52,147,.22);
}
body.scallex-home-brand-v1 .home-hero.ux-home-hero .btn-ghost-light{
  color:var(--brand-primary-dark);
  background:rgba(255,255,255,.78);
  border-color:rgba(29,52,147,.35);
}
body.scallex-home-brand-v1 .home-hero.ux-home-hero .btn-ghost-light:hover,
body.scallex-home-brand-v1 .home-hero.ux-home-hero .btn-ghost-light:focus-visible{
  color:var(--brand-primary-dark);
  background:#fff;
  border-color:var(--brand-primary-light);
}
body.scallex-home-brand-v1 .home-hero.ux-home-hero .ux-hero-context{color:#465872}
body.scallex-home-brand-v1 .home-hero.ux-home-hero .ux-hero-context span:before{
  background:linear-gradient(135deg,var(--brand-accent),var(--brand-primary-light));
  box-shadow:0 0 0 3px rgba(0,180,216,.10);
}
/* High-contrast dark-surface tokens loaded last so rendered output cannot fall back to blue-on-blue. */
body.ux-prototype-v1 .ux-no-chase-panel,
body.ux-prototype-v1 .ux-final-cta,
body.scallex-home-brand-v1 .brand-dark-section,
body.scallex-interior-brand-v1 .brand-dark-section{color:var(--on-dark-body)}
body.ux-prototype-v1 .ux-no-chase-panel h2,
body.ux-prototype-v1 .ux-final-cta h2,
body.scallex-home-brand-v1 .brand-dark-section h2,
body.scallex-home-brand-v1 .brand-dark-section h3,
body.scallex-interior-brand-v1 .brand-dark-section h2,
body.scallex-interior-brand-v1 .brand-dark-section h3{color:var(--on-dark-heading)}
body.ux-prototype-v1 .ux-no-chase-panel p:not(.eyebrow),
body.ux-prototype-v1 .ux-no-chase-panel li,
body.ux-prototype-v1 .ux-final-cta p:not(.eyebrow),
body.scallex-home-brand-v1 .brand-dark-section p:not(.eyebrow),
body.scallex-interior-brand-v1 .brand-dark-section p:not(.eyebrow){color:var(--on-dark-body)}
body.ux-prototype-v1 .ux-no-chase-panel .eyebrow,
body.ux-prototype-v1 .ux-final-cta .eyebrow,
body.scallex-home-brand-v1 .brand-dark-section .eyebrow,
body.scallex-interior-brand-v1 .brand-dark-section .eyebrow{color:var(--on-dark-eyebrow);border-color:var(--on-dark-border);background:rgba(255,255,255,.12)}
body.ux-prototype-v1 .ux-no-chase-panel>a,
body.ux-prototype-v1 .ux-final-cta>a,
body.scallex-home-brand-v1 .brand-dark-section a:not(.btn),
body.scallex-interior-brand-v1 .brand-dark-section a:not(.btn){color:var(--on-dark-link)}
body .hero h1,body .page-hero h1,body .cta-section .cta-content h2{color:var(--on-dark-heading)}
body .hero .hero-copy,body .page-hero .hero-copy,body .cta-section .cta-content>p:not(.eyebrow){color:var(--on-dark-body)}
body .page-hero .breadcrumb,body .page-hero .breadcrumb a,body .page-hero .breadcrumb span{color:var(--on-dark-muted)}
body .page-hero .eyebrow,body .hero .eyebrow.light,body .cta-section .eyebrow.light{color:var(--on-dark-eyebrow)}
body.ux-shell-v1 .site-footer .footer-heading{color:var(--on-dark-heading)}
body.ux-shell-v1 .site-footer .footer-brand p,body.ux-shell-v1 .site-footer .office-note,body.ux-shell-v1 .site-footer .footer-bottom{color:var(--on-dark-muted)}
body.ux-shell-v1 .site-footer a{color:#eef4ff}

@media(max-width:900px){
  body.ux-shell-v1 .ux-services-menu .ux-service-menu-link{grid-template-columns:38px minmax(0,1fr);column-gap:.68rem;align-items:start}
  body.ux-shell-v1 .ux-services-menu .ux-service-symbol{width:38px;height:38px;border-radius:11px}
  body.ux-shell-v1 .ux-services-menu .ux-service-symbol svg{width:21px;height:21px}
  .ux-prototype-v1 .ux-service-link{grid-template-columns:44px minmax(0,1fr)}
  .ux-prototype-v1 .ux-service-link .ux-service-symbol{width:44px;height:44px}
  .ux-prototype-v1 .ux-service-title-row .ux-service-symbol{width:44px;height:44px}
  .ux-prototype-v1 .ux-service-link .ux-service-symbol svg,.ux-prototype-v1 .ux-service-title-row .ux-service-symbol svg{width:24px;height:24px}
}
@media(max-width:620px){
  body.scallex-home-brand-v1 .home-hero.ux-home-hero::before{background-position:center bottom;background-size:auto 108%;opacity:.24}
  body.scallex-home-brand-v1 .home-hero.ux-home-hero::after{background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(245,250,255,.92))}
  .sv-icon-tile{width:42px;height:42px}.sv-icon-tile svg{width:23px;height:23px}
}
@media(prefers-reduced-motion:reduce){
  body.ux-shell-v1 .nav-label--text-only[aria-expanded="true"]::after{transition:none}
}

/* Preserve compact service icons/copy inside the existing mobile drawer rule that hides generic menu descriptions. */
@media(max-width:900px){
  body.ux-shell-v1 .ux-services-menu .ux-service-menu-link>.ux-service-symbol{display:inline-grid}
  body.ux-shell-v1 .ux-services-menu .ux-service-menu-link>.ux-service-menu-copy{display:grid}
  body.ux-shell-v1 .ux-services-menu .ux-service-menu-copy>span{display:block}
}
