
: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 — exact uploaded Bakgrund.png */
.zx-hero{
  position:relative;
  min-height:var(--zx-hero-min-height,390px);
  overflow:hidden;
  background-color:#eef6fb;
  background-image:
    image-set(
      url("../images/Bakgrund.webp") type("image/webp"),
      url("../images/Bakgrund.png") type("image/png")
    );
  background-repeat:no-repeat;
  background-position:center center;
  background-size:cover;
  border-bottom:1px solid #d8e6ef;
}
.zx-hero-inner{
  position:relative;
  min-height:var(--zx-hero-min-height,390px);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:34px;
  padding-block:38px;
}
.zx-hero-brand{
  width:min(610px,48vw);
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}
.zx-hero-logo{
  display:block;
  width:min(600px,100%);
  height:auto;
  filter:drop-shadow(0 2px 2px rgba(255,255,255,.35));
}
.zx-hero-extra{
  width:min(480px,36vw);
  margin-left:auto;
  padding:20px 22px;
  border:1px solid rgba(255,255,255,.72);
  border-radius:14px;
  background:rgba(255,255,255,.66);
  box-shadow:0 12px 32px rgba(22,51,82,.07);
  backdrop-filter:blur(4px);
}
.zx-hero-extra h1,
.zx-hero-extra h2,
.zx-hero-extra h3{
  margin-top:0;
  color:#0b1d34;
}
.zx-hero-extra p{
  color:#405267;
}
.zx-hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:20px;
}
.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:58% center}
  .zx-hero-inner{padding-block:30px}
  .zx-hero-brand{width:min(560px,64vw)}
  .zx-hero-extra{display:none}
  .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:280px!important;
    background-position:61% center;
  }
  .zx-hero-inner{
    min-height:280px!important;
    align-items:center;
    padding:24px 0;
  }
  .zx-hero-brand{
    width:min(420px,82vw);
  }
  .zx-hero-extra{display:none}
  .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;
  }
}


/* =========================================================
   ZOXALITY v1.1 — public landing-page cleanup
   ========================================================= */

/* Joomla article chrome should not make the homepage look like a blog post */
.zx-content .article-info,
.zx-content .article-info-term,
.zx-content .article-info dd,
.zx-content .article-info dt,
.zx-content .icons,
.zx-content .icons .btn-group,
.zx-content .pagination,
.zx-content .pager,
.zx-content .pagenavigation,
.zx-content nav[aria-label="Pagination"],
.zx-content nav[aria-label="Page navigation"],
.zx-content .com-content-article__navigation {
  display:none !important;
}

/* Hide generic Details captions from article metadata renderers */
.zx-content .article-info + *[class*="article-info"],
.zx-content .article-info-term {
  display:none !important;
}

/* Landing-page article should blend into the site instead of looking like a CMS card */
.zx-content .item-page {
  border:0;
  box-shadow:none;
  padding:8px 4px 18px;
  background:transparent;
}

/* Stronger page rhythm */
.zx-content .item-page > h1:first-child,
.zx-content .item-page > h2:first-child {
  margin-top:0;
}

.zx-content .item-page h2 {
  margin-top:2.4rem;
  margin-bottom:.7rem;
}

.zx-content .item-page ul {
  columns:2;
  column-gap:38px;
  padding-left:1.25rem;
}

.zx-content .item-page li {
  break-inside:avoid;
  margin:.45rem 0;
}

/* Make module groups feel like the reference design */
.zx-projects,
.zx-repositories,
.zx-contact {
  margin-top:24px;
}

.zx-projects .zx-card,
.zx-repositories .zx-card,
.zx-contact .zx-card {
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.zx-projects .zx-card:hover,
.zx-repositories .zx-card:hover,
.zx-contact .zx-card:hover {
  transform:translateY(-2px);
  border-color:#c9dce9;
  box-shadow:0 14px 34px rgba(22,51,82,.08);
}

/* Contact list: visually separate label and address */
.contact-list li {
  display:grid;
  grid-template-columns:minmax(110px,145px) minmax(0,1fr);
  align-items:center;
  gap:14px;
  padding:.65rem 0;
}
.contact-list strong {
  margin:0;
}
.contact-list a {
  overflow-wrap:anywhere;
}

/* Footer tightening */
.zx-footer-grid {
  align-items:start;
}
.zx-footer-brand {
  padding-right:18px;
}

/* Desktop landing page gets a little more air */
@media (min-width:821px){
  .zx-main {
    padding-top:54px;
  }
  .zx-content .item-page {
    max-width:880px;
  }
}

/* Mobile fixes */
@media (max-width:700px){
  .zx-content .item-page ul {
    columns:1;
  }
  .contact-list li {
    grid-template-columns:1fr;
    gap:2px;
  }
}

/* Prevent Joomla-generated heading wrappers from creating double spacing */
.zx-content .page-header {
  margin-bottom:18px;
}
