
:root{
  --zx-navy:#07182e;
  --zx-navy-2:#102c50;
  --zx-blue:#0758df;
  --zx-blue-2:#1383ec;
  --zx-cyan:#12c4ee;
  --zx-bg:#f7f9fb;
  --zx-surface:#ffffff;
  --zx-text:#122033;
  --zx-muted:#607083;
  --zx-border:#dfe7ee;
  --zx-soft:#eef6fb;
  --zx-radius:14px;
  --zx-shadow:0 12px 32px rgba(22,51,82,.08);
  --zx-max:1240px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--zx-bg);
  color:var(--zx-text);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;height:auto}
a{color:var(--zx-blue);text-decoration:none}
a:hover{color:#0347b7}
.zx-container{width:min(var(--zx-max),calc(100% - 40px));margin-inline:auto}
.zx-skip{position:absolute;left:-9999px;top:0}
.zx-skip:focus{left:12px;top:12px;z-index:99999;padding:10px 14px;background:#fff;border-radius:8px}

/* HEADER */
.zx-header{
  position:sticky;
  top:0;
  z-index:1000;
  background:rgba(255,255,255,.97);
  box-shadow:0 1px 12px rgba(10,32,58,.07);
  backdrop-filter:saturate(140%) blur(10px);
}
.zx-top{border-bottom:1px solid rgba(215,225,234,.82)}
.zx-top-inner{
  min-height:105px;
  display:flex;
  align-items:center;
  gap:30px;
}
.zx-brand{
  display:flex;
  align-items:flex-end;
  gap:20px;
  min-width:0;
}
.zx-logo{
  display:block;
  height:78px;
  width:auto;
  max-width:min(620px,70vw);
  object-fit:contain;
}
.zx-tagline{
  display:none; /* tagline is already present in the supplied new logo */
}
.zx-topbar{
  margin-left:auto;
  color:var(--zx-muted);
  font-size:.9rem;
}
.zx-nav{background:#fff}
.zx-nav .mod-menu{
  list-style:none;
  display:flex;
  align-items:center;
  gap:3px;
  padding:0;
  margin:0;
}
.zx-nav .mod-menu > li{position:relative}
.zx-nav .mod-menu > li > a{
  display:block;
  padding:15px 16px 13px;
  color:#26374c;
  font-size:.94rem;
  font-weight:650;
  border-bottom:3px solid transparent;
}
.zx-nav .mod-menu > li.active > a,
.zx-nav .mod-menu > li > a:hover{
  color:var(--zx-blue);
  border-bottom-color:var(--zx-blue);
}
.zx-nav-toggle{
  display:none;
  margin-left:auto;
  width:45px;height:42px;
  border:1px solid var(--zx-border);
  border-radius:10px;
  background:#fff;
  padding:8px 10px;
}
.zx-nav-toggle span{
  display:block;
  height:2px;
  background:#142d4a;
  margin:5px 0;
  border-radius:2px;
}

/* HERO: actual selected background image */
.zx-hero{
  position:relative;
  min-height:var(--zx-hero-min-height,390px);
  overflow:hidden;
  background-image:
    image-set(
      url("../images/zoxality-header.webp") type("image/webp"),
      url("../images/zoxality-header.jpg") type("image/jpeg")
    );
  background-position:center center;
  background-size:cover;
  border-bottom:1px solid #d8e6ef;
}
.zx-hero-overlay{
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,
      rgba(255,255,255,.18) 0%,
      rgba(255,255,255,.10) 38%,
      rgba(255,255,255,.05) 60%,
      rgba(255,255,255,.02) 100%);
}
.zx-hero-inner{
  position:relative;
  z-index:2;
  min-height:var(--zx-hero-min-height,390px);
  display:flex;
  align-items:center;
  padding-block:56px;
}
.zx-hero-copy{
  width:min(620px,70%);
  padding:28px 32px;
  border-radius:18px;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(255,255,255,.76);
  box-shadow:0 18px 48px rgba(27,66,102,.10);
  backdrop-filter:blur(5px);
}
.zx-eyebrow{
  color:var(--zx-blue);
  font-size:.76rem;
  font-weight:850;
  letter-spacing:.09em;
}
.zx-hero h1{
  margin:.5rem 0 .85rem;
  font-size:clamp(2.15rem,4.8vw,4rem);
  line-height:1.04;
  letter-spacing:-.045em;
  color:#0b1d34;
}
.zx-hero p{
  margin:.7rem 0;
  color:#3f5064;
  font-size:1.07rem;
}
.zx-hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:23px;
}
.zx-hero-actions p{display:flex;flex-wrap:wrap;gap:12px;margin:0}
.zx-hero-actions a,
.zx-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:10px 18px;
  border-radius:8px;
  font-weight:750;
  transition:.18s ease;
}
.zx-hero-actions a:first-child,.zx-btn-primary{
  background:linear-gradient(135deg,var(--zx-blue),var(--zx-blue-2));
  color:#fff;
  box-shadow:0 6px 18px rgba(7,88,223,.18);
}
.zx-hero-actions a:not(:first-child){
  background:rgba(255,255,255,.92);
  border:1px solid #9cbbe2;
  color:var(--zx-blue);
}
.zx-hero-actions a:hover{transform:translateY(-1px)}

/* MAIN */
.zx-breadcrumbs{
  background:#fff;
  border-bottom:1px solid var(--zx-border);
  padding:10px 0;
  font-size:.88rem;
}
.zx-main{padding:46px 0 70px}
.zx-layout{display:grid;grid-template-columns:1fr;gap:30px}
.zx-layout.zx-has-sidebar{grid-template-columns:minmax(0,1fr) 315px}
.zx-content{min-width:0}
.zx-content .item-page,
.zx-content .blog,
.zx-content .category-list,
.zx-content .contact,
.zx-content .login,
.zx-content .registration,
.zx-content .profile{
  background:#fff;
  border:1px solid var(--zx-border);
  border-radius:var(--zx-radius);
  box-shadow:0 6px 22px rgba(20,46,75,.045);
  padding:34px;
}
.zx-content h1,.zx-content h2,.zx-content h3{
  color:#112b49;
  letter-spacing:-.02em;
}
.zx-content h1{font-size:clamp(2rem,4vw,3rem)}
.zx-content h2{margin-top:2rem}
.zx-content .lead{font-size:1.12rem;color:#44566b}

.zx-zone{margin-top:30px}
.zx-card{
  position:relative;
  overflow:hidden;
  background:#fff;
  border:1px solid var(--zx-border);
  border-radius:var(--zx-radius);
  box-shadow:0 6px 22px rgba(20,46,75,.045);
  padding:27px;
  margin-bottom:24px;
}
.zx-card::before{
  content:"";
  position:absolute;
  left:0;top:0;bottom:0;
  width:4px;
  background:linear-gradient(180deg,var(--zx-blue),var(--zx-cyan));
}
.zx-module-title{
  margin:0 0 15px;
  color:#173959;
  font-size:1.1rem;
}
.zx-sidebar .zx-card{padding:23px}
.zx-card ul{padding-left:1.2rem}
.zx-card li{margin:.32rem 0}
.contact-list{list-style:none;padding:0!important;margin:0}
.contact-list li{padding:.48rem 0;border-bottom:1px solid #edf1f4}
.contact-list li:last-child{border-bottom:0}
.contact-list strong{
  display:block;
  text-transform:uppercase;
  letter-spacing:.045em;
  font-size:.72rem;
  color:#627487;
}
.status-row{display:flex;align-items:center;gap:9px}
.status-dot{
  width:9px;height:9px;border-radius:50%;
  background:#24a163;
  box-shadow:0 0 0 3px rgba(36,161,99,.12);
}

/* FOOTER */
.zx-footer{
  background:#edf3f7;
  border-top:1px solid #d8e2ea;
  color:#526477;
}
.zx-footer-grid{
  padding:42px 0 34px;
  display:grid;
  grid-template-columns:1.45fr repeat(3,1fr);
  gap:34px;
}
.zx-footer-logo{height:54px;width:auto}
.zx-footer h3{
  margin-top:0;
  color:#154177;
  text-transform:uppercase;
  letter-spacing:.065em;
  font-size:.76rem;
}
.zx-footer ul{list-style:none;padding:0;margin:0}
.zx-footer li{margin:.4rem 0}
.zx-footer-bottom{
  border-top:1px solid #d8e2ea;
  color:#788796;
  font-size:.84rem;
}
.zx-footer-bottom-inner{
  min-height:58px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}

/* SPECIAL */
.zx-component-only{background:#fff;padding:28px}
.zx-component-wrap{max-width:1000px}
.zx-special-page{
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:24px;
  background:linear-gradient(135deg,#fff,#eaf5fb);
}
.zx-special-card{
  width:min(640px,100%);
  padding:42px;
  background:#fff;
  border:1px solid var(--zx-border);
  border-radius:18px;
  box-shadow:var(--zx-shadow);
  text-align:center;
}
.zx-special-card img{max-height:95px;width:auto}
.zx-error-code{
  margin-top:22px;
  font-size:5rem;
  line-height:1;
  font-weight:850;
  color:var(--zx-blue);
}

/* TABLET */
@media (max-width:1024px){
  .zx-layout.zx-has-sidebar{grid-template-columns:minmax(0,1fr) 280px}
  .zx-footer-grid{grid-template-columns:1.3fr 1fr 1fr}
  .zx-footer-grid > :last-child{grid-column:2/4}
  .zx-hero-copy{width:min(640px,76%)}
}

/* MOBILE NAV + TABLET */
@media (max-width:820px){
  .zx-header{position:relative}
  .zx-top-inner{min-height:88px}
  .zx-logo{height:62px;max-width:78vw}
  .zx-topbar{display:none}
  .zx-nav-toggle{display:block}
  .zx-nav{display:none;border-top:1px solid var(--zx-border)}
  .zx-nav.zx-open{display:block}
  .zx-nav .mod-menu{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    padding:10px 0;
  }
  .zx-nav .mod-menu > li > a{
    border-bottom:0;
    border-left:3px solid transparent;
    padding:11px 14px;
  }
  .zx-nav .mod-menu > li.active > a,
  .zx-nav .mod-menu > li > a:hover{
    border-left-color:var(--zx-blue);
    background:#f2f7fb;
  }
  .zx-hero{background-position:62% center}
  .zx-hero-inner{padding-block:38px}
  .zx-hero-copy{width:min(620px,84%)}
  .zx-layout.zx-has-sidebar{grid-template-columns:1fr}
  .zx-footer-grid{grid-template-columns:1fr 1fr}
  .zx-footer-brand{grid-column:1/-1}
}

/* PHONE */
@media (max-width:560px){
  .zx-container{width:min(var(--zx-max),calc(100% - 24px))}
  .zx-top-inner{min-height:76px}
  .zx-logo{height:52px;max-width:78vw}
  .zx-hero{
    min-height:340px!important;
    background-position:67% center;
  }
  .zx-hero-inner{
    min-height:340px!important;
    align-items:flex-end;
    padding:28px 0;
  }
  .zx-hero-copy{
    width:100%;
    padding:21px 20px;
    background:rgba(255,255,255,.84);
    border-radius:14px;
  }
  .zx-hero h1{font-size:2.05rem}
  .zx-hero p{font-size:.98rem}
  .zx-main{padding:28px 0 48px}
  .zx-content .item-page,
  .zx-content .blog,
  .zx-content .category-list,
  .zx-content .contact,
  .zx-content .login,
  .zx-content .registration,
  .zx-content .profile{
    padding:22px;
    border-radius:12px;
  }
  .zx-card{padding:21px}
  .zx-footer-grid{grid-template-columns:1fr;gap:20px}
  .zx-footer-brand{grid-column:auto}
  .zx-footer-bottom-inner{
    min-height:72px;
    align-items:flex-start;
    justify-content:center;
    flex-direction:column;
  }
}
