
/* PCenter V10 — global visual refinement */
html{scroll-padding-top:92px}
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
::selection{background:rgba(8,127,229,.16);color:var(--navy,#061A35)}
:focus-visible{outline:3px solid rgba(8,127,229,.28);outline-offset:3px}

header{
  box-shadow:0 8px 32px rgba(6,26,53,.035);
  border-bottom-color:rgba(209,222,235,.82)!important;
}
.nav{height:78px!important}
.brand{flex:0 0 auto}
.brand img{width:172px!important;height:auto}
.navlinks{gap:22px!important;align-items:stretch}
.navlinks a{
  position:relative;display:flex;align-items:center;color:#17263a;
  transition:color .18s ease,opacity .18s ease;
}
.navlinks a:hover{color:var(--blue,#087FE5)}
.navlinks a:after{
  content:"";position:absolute;left:50%;right:50%;bottom:16px;height:2px;border-radius:3px;
  background:linear-gradient(90deg,var(--cyan,#18B8F2),var(--electric,#0867F2));
  transition:left .2s ease,right .2s ease;
}
.navlinks a:hover:after,.navlinks a[aria-current="page"]:after{left:0;right:0}
.navlinks a[aria-current="page"]{color:var(--blue,#087FE5)}
.langs a{transition:background .18s ease,color .18s ease}
.langs a:hover{background:#f2f8fd;color:var(--blue,#087FE5)}

.btn{
  min-height:46px;letter-spacing:-.01em;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease,background .2s ease!important;
}
.btn:hover{transform:translateY(-2px)}
.primary:hover{box-shadow:0 15px 34px rgba(8,127,229,.25)!important}
.outline:hover{border-color:#a9cae5!important;background:#f8fbfe!important;color:var(--navy,#061A35)}
.darkbtn:hover{box-shadow:0 14px 30px rgba(6,26,53,.18)}

h1,h2,h3{text-wrap:balance}
.lead{line-height:1.66}
.eyebrow{line-height:1.35}

.problem-card,.solution-card-link,.scope-card,.support-scope-card,.question-card,.lic-card,
.cloud-card,.layer-card,.m365-cap,.m365-app,.m365-step,.guide-card,.guide-faq-item,
.hosting-card,.backup-native-card,.home-guide-card{
  transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.problem-card:hover,.solution-card-link:hover,.scope-card:hover,.support-scope-card:hover,.question-card:hover,.lic-card:hover,
.cloud-card:hover,.layer-card:hover,.m365-cap:hover,.m365-app:hover,.m365-step:hover,.guide-card:hover,.guide-faq-item:hover,
.hosting-card:hover,.backup-native-card:hover,.home-guide-card:hover{
  transform:translateY(-3px);
  border-color:#c1dced!important;
  box-shadow:0 18px 42px rgba(6,26,53,.065);
}

.hero-visual,.visual-card,.sol-visual,.cloud-visual,.cyber-visual,.care-visual,.lic-visual,.consult-visual{
  box-shadow:0 24px 60px rgba(6,26,53,.09);
}

.footer-main a,.download-grid a,.support-resource a,.legal-links a{
  transition:color .18s ease,background .18s ease,transform .18s ease;
}
.footer-main a:hover,.legal-links a:hover{color:#fff}
.download-grid a:hover,.support-resource a:hover{transform:translateY(-1px)}
.footer-main{padding-top:44px!important;padding-bottom:34px!important}
.footer-bottom{align-items:center;gap:20px;flex-wrap:wrap}
.webcenter-logo{max-height:26px;width:auto}

.site-menu-toggle{
  display:none;flex:0 0 auto;width:44px;height:44px;border:1px solid #d8e4ee;border-radius:13px;
  background:#fff;color:var(--navy,#061A35);align-items:center;justify-content:center;cursor:pointer;
  transition:border-color .18s ease,background .18s ease;
}
.site-menu-toggle:hover{border-color:#a9cae5;background:#f8fbfe}
.site-menu-toggle-bars{width:18px;height:14px;position:relative}
.site-menu-toggle-bars:before,.site-menu-toggle-bars:after,.site-menu-toggle-bars span{
  content:"";position:absolute;left:0;width:18px;height:2px;border-radius:3px;background:currentColor;transition:.2s ease
}
.site-menu-toggle-bars:before{top:0}.site-menu-toggle-bars span{top:6px}.site-menu-toggle-bars:after{top:12px}
.site-menu-toggle[aria-expanded="true"] .site-menu-toggle-bars span{opacity:0}
.site-menu-toggle[aria-expanded="true"] .site-menu-toggle-bars:before{top:6px;transform:rotate(45deg)}
.site-menu-toggle[aria-expanded="true"] .site-menu-toggle-bars:after{top:6px;transform:rotate(-45deg)}

.site-mobile-menu{
  display:none;position:absolute;left:0;right:0;top:100%;background:#fff;
  backdrop-filter:blur(22px);border-top:1px solid #edf2f7;border-bottom:1px solid #dbe6ef;
  box-shadow:0 22px 46px rgba(6,26,53,.12);padding:12px 0 18px
}
.site-mobile-menu-inner{width:min(100% - 32px,1180px);margin:auto}
.site-mobile-links{display:grid}
.site-mobile-links a{
  display:flex;justify-content:space-between;align-items:center;min-height:48px;padding:10px 4px;
  border-bottom:1px solid #edf2f7;font-size:.94rem;font-weight:800;color:#182a40
}
.site-mobile-links a:after{content:"→";color:#8ba1b5;font-weight:700}
.site-mobile-links a[aria-current="page"]{color:var(--blue,#087FE5)}
.site-mobile-meta{display:flex;justify-content:space-between;align-items:center;gap:14px;padding-top:14px}
.site-mobile-langs{display:flex;gap:5px}
.site-mobile-langs a{
  display:flex;align-items:center;justify-content:center;min-width:38px;height:34px;padding:0 9px;
  border:1px solid #dde7f0;border-radius:9px;font-size:.7rem;font-weight:900;color:#294056
}
.site-mobile-langs a.on{background:#edf7ff;color:var(--blue,#087FE5);border-color:#cfe8fa}
.site-mobile-note{font-size:.72rem;color:#7a8ea2}

@media(max-width:1180px) and (min-width:901px){
  .nav{gap:15px!important}
  .brand img{width:154px!important}
  .navlinks{gap:14px!important;font-size:.81rem!important}
  .langs{font-size:.65rem!important}
  .support-top{padding:11px 16px!important;font-size:.82rem}
}
@media(max-width:900px){
  header{overflow:visible}
  .nav{height:72px!important;gap:10px!important}
  .brand img{width:154px!important}
  .site-menu-toggle{display:flex}
  .site-mobile-menu.is-open{display:block;animation:siteMenuIn .16s ease-out}
  .support-top{margin-left:0!important}
  h1{font-size:clamp(3rem,13vw,4.2rem)!important}
  h2{font-size:clamp(2.2rem,9vw,3.35rem)!important}
  .inner-hero,.sol-hero,.cloud-hero,.cyber-hero,.care-hero,.lic-hero,.consult-hero,.about-hero,.guide-hero{padding-top:68px!important}
}
@keyframes siteMenuIn{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:none}}

@media(max-width:620px){
  .nav{height:68px!important}
  .brand img{width:142px!important}
  .site-menu-toggle{width:40px;height:40px;border-radius:12px}
  .support-top{font-size:.74rem!important;padding:9px 11px!important;min-height:40px}
  .hero{padding-top:52px!important}
  h1{font-size:clamp(2.95rem,13.4vw,3.55rem)!important;line-height:1.01!important}
  h2{font-size:clamp(2.15rem,10vw,2.85rem)!important}
  .lead{font-size:1.06rem!important;line-height:1.62}
  .actions{gap:9px}
  .btn{min-height:44px;padding:11px 17px}
  .hero-visual{margin-top:44px!important;border-radius:24px!important}
  .downloads{padding:19px!important;border-radius:20px!important}
  .resource-group{padding:15px!important}
  .footer-main{padding-top:36px!important;padding-bottom:28px!important;gap:28px!important}
  .footer-bottom{padding-top:18px!important}
  .site-mobile-menu-inner{width:min(100% - 28px,1180px)}
}
