/*
 * IT24 / Cassiopeia
 * Version: 1.4
 */

:root{
  --it24-navy:#0b2d4d;
  --it24-navy-2:#10456f;
  --it24-blue:#1687ff;
  --it24-cyan:#56c5ff;
  --it24-text:#172033;
  --it24-muted:#667085;
  --it24-bg:#f5f8fc;
  --it24-card:#ffffff;
  --it24-border:#dce6f2;
  --it24-radius:18px;
  --it24-shadow:0 14px 36px rgba(11,45,77,.09);
}

/* Base */
body{
  background:var(--it24-bg);
  color:var(--it24-text);
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
a{transition:color .15s ease, background-color .15s ease, border-color .15s ease}

/* Header */
.container-header{
  background:linear-gradient(110deg,var(--it24-navy),#123f67);
  box-shadow:0 8px 24px rgba(7,31,53,.14);
  position:sticky;
  top:0;
  z-index:1000;
}
.container-header .grid-child{
  max-width:1200px;
  margin-inline:auto;
  width:100%;
}
.container-header .navbar-brand{
  padding-top:1rem;
  padding-bottom:.65rem;
}
.container-header .brand-logo{
  display:inline-flex;
  align-items:center;
  text-decoration:none;
}
.container-header .brand-logo img{display:none!important}
.container-header .brand-logo::before{
  content:"IT24";
  color:#fff;
  font-size:2rem;
  line-height:1;
  font-weight:800;
  letter-spacing:-.04em;
}
.container-header .brand-logo::after{
  content:"  •  IT-рішення для бізнесу";
  white-space:pre;
  color:#b9d6ec;
  font-size:.95rem;
  font-weight:500;
  margin-left:.7rem;
}
.container-header .container-nav{
  padding-bottom:.8rem;
}
.container-header .mod-menu{
  display:flex;
  align-items:center;
  gap:.25rem;
}
.container-header .mod-menu>li>a{
  color:#fff!important;
  font-weight:700;
  padding:.72rem .95rem;
  border-radius:10px;
}
.container-header .mod-menu>li>a:hover,
.container-header .mod-menu>li.active>a{
  background:rgba(255,255,255,.10);
}

/* Dropdown */
.container-header .mod-menu .metismenu.mod-menu .mm-collapse,
.container-header .mod-menu .mod-menu__sub{
  background:#fff;
  border:1px solid var(--it24-border);
  border-radius:14px;
  box-shadow:var(--it24-shadow);
  padding:.5rem;
}
.container-header .mod-menu .mod-menu__sub a{
  color:var(--it24-text)!important;
  border-radius:8px;
}
.container-header .mod-menu .mod-menu__sub a:hover{
  background:#eef6ff;
  color:var(--it24-blue)!important;
}

/* Top bar */
.container-topbar{
  max-width:none!important;
  padding:.36rem max(1rem, calc((100vw - 1200px)/2))!important;
  background:#081f35;
  display:flex!important;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  min-height:38px;
}
.it24-contactbar{
  display:flex;
  align-items:center;
  gap:1rem;
  font-size:.9rem;
}
.it24-contactbar a{
  color:#e2eef8!important;
  text-decoration:none;
}
.it24-contactbar a:hover{color:#fff!important}
.mod-languages{margin-left:auto}
.mod-languages ul{margin:0!important;display:flex;gap:.25rem}
.mod-languages li{margin:0!important}
.mod-languages a{
  display:block;
  padding:.28rem .55rem;
  border-radius:7px;
  color:#dceaf5!important;
  font-size:.82rem;
  font-weight:700;
  text-decoration:none;
}
.mod-languages li.lang-active a,
.mod-languages a:hover{
  background:rgba(255,255,255,.12);
  color:#fff!important;
}

/* Main shell */
.site-grid{background:var(--it24-bg)}
.container-component{padding-top:1.2rem}
.breadcrumb{
  background:transparent;
  color:var(--it24-muted);
}

/* Article card on normal pages */
.com-content-article{
  background:#fff;
  border:1px solid var(--it24-border);
  border-radius:18px;
  padding:clamp(1.2rem,3vw,2rem);
  box-shadow:var(--it24-shadow);
}
.com-content-article img{max-width:100%;height:auto;border-radius:12px}
.com-content-article table{width:100%;border-collapse:collapse}
.com-content-article td,.com-content-article th{
  padding:.75rem;
  border:1px solid var(--it24-border);
}

/* Home: remove Cassiopeia article chrome */
.itemid-107 .container-component,
.itemid-105 .container-component{
  max-width:none!important;
  padding:0!important;
}
.itemid-107 .com-content-article,
.itemid-105 .com-content-article{
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
  padding:0;
}
.itemid-107 .page-header,
.itemid-105 .page-header,
.itemid-107 .mod-breadcrumbs__wrapper,
.itemid-105 .mod-breadcrumbs__wrapper{
  display:none!important;
}
.itemid-107 .container-component>main,
.itemid-105 .container-component>main{
  margin:0!important;
}

/* Hero */
.it24-hero{
  background:
    radial-gradient(circle at 80% 18%,rgba(86,197,255,.20),transparent 27%),
    linear-gradient(115deg,#08243e 0%,#0c3358 48%,#0f4775 100%);
  color:#fff;
  overflow:hidden;
  margin:0 0 2.5rem;
}
.it24-hero__inner{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);
  gap:2.5rem;
  align-items:center;
  max-width:1200px;
  margin:auto;
  padding:5.4rem 1.25rem 4.8rem;
}
.it24-hero h1{
  color:#fff;
  font-size:clamp(2.45rem,5vw,4.65rem);
  line-height:1.02;
  margin:0 0 1.2rem;
  font-weight:850;
  letter-spacing:-.045em;
}
.it24-hero p{
  font-size:1.16rem;
  line-height:1.6;
  max-width:700px;
  color:#dcecf8;
  margin:0;
}
.it24-btns{
  display:flex;
  gap:.85rem;
  flex-wrap:wrap;
  margin-top:1.6rem;
}
.it24-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:.8rem 1.2rem;
  border-radius:12px;
  font-weight:800;
  text-decoration:none!important;
  border:1px solid transparent;
}
.it24-btn--primary{background:var(--it24-blue);color:#fff!important}
.it24-btn--primary:hover{background:#0877e8}
.it24-btn--secondary{
  border-color:rgba(255,255,255,.38);
  color:#fff!important;
  background:rgba(255,255,255,.03);
}
.it24-btn--secondary:hover{background:rgba(255,255,255,.10)}
.it24-hero__visual{min-height:340px;position:relative}
.it24-hero__orb{
  position:absolute;
  inset:8% 4%;
  border-radius:28px;
  background:
    linear-gradient(140deg,rgba(255,255,255,.08),rgba(255,255,255,.02)),
    url('/media/templates/site/cassiopeia/images/it24-hero-tech.svg') center/82% no-repeat;
  border:1px solid rgba(255,255,255,.10);
  box-shadow:inset 0 0 80px rgba(86,197,255,.08);
}

/* Sections */
.it24-section{
  max-width:1200px;
  margin:0 auto;
  padding:1rem 1.25rem 3.8rem;
}
.it24-section h2{
  font-size:clamp(1.8rem,3vw,2.55rem);
  margin:0 0 1.4rem;
  color:var(--it24-navy);
  letter-spacing:-.025em;
}
.it24-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1rem;
}
.it24-card{
  background:var(--it24-card);
  border:1px solid var(--it24-border);
  border-radius:var(--it24-radius);
  padding:1.45rem;
  box-shadow:var(--it24-shadow);
  transition:transform .18s ease,box-shadow .18s ease;
}
.it24-card:hover{
  transform:translateY(-3px);
  box-shadow:0 18px 44px rgba(11,45,77,.13);
}
.it24-icon{
  width:52px;
  height:52px;
  border-radius:15px;
  display:grid;
  place-items:center;
  background:#eaf5ff;
  color:var(--it24-blue);
  margin-bottom:.95rem;
  font-size:.92rem;
  font-weight:900;
}
.it24-card h3{margin:.1rem 0 .6rem;color:var(--it24-navy)}
.it24-card p{color:var(--it24-muted);margin:0 0 .8rem}
.it24-card a{font-weight:800;text-decoration:none;color:var(--it24-blue)}
.it24-why{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1rem;
}
.it24-cta{
  background:linear-gradient(100deg,#092b49,#104976);
  color:#fff;
  border-radius:24px;
  padding:2.1rem;
  display:flex;
  gap:1.5rem;
  align-items:center;
  justify-content:space-between;
}
.it24-cta h2{color:#fff;margin:0 0 .4rem}
.it24-cta p{margin:0;color:#d8e7f5}

/* Footer */
.container-footer{
  background:#081f35;
  color:#d8e7f5;
  margin-top:3rem;
}
.container-footer .grid-child{
  max-width:1200px;
  margin:auto;
  padding:2.4rem 1.25rem;
}
.it24-footer__grid{
  width:100%;
  display:grid;
  grid-template-columns:2fr 1fr 1fr;
  gap:2rem;
}
.it24-footer h3{color:#fff;margin-top:0}
.it24-footer a{color:#fff!important;text-decoration:none}
.it24-footer p{margin:.35rem 0;color:#c5d8e7}
.it24-footer small{color:#88a8c0}

/* Hide module edit labels from affecting layout for logged-in admins */
.jmodedit{z-index:1200}

/* Responsive */
@media (max-width:900px){
  .container-header .brand-logo::after{display:none}
  .it24-hero__inner{grid-template-columns:1fr;padding-top:3.5rem}
  .it24-hero__visual{min-height:250px}
  .it24-grid{grid-template-columns:1fr 1fr}
  .it24-why{grid-template-columns:1fr 1fr}
  .it24-footer__grid{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .container-topbar{align-items:flex-start;flex-direction:column}
  .mod-languages{margin-left:0}
  .it24-contactbar{flex-wrap:wrap;gap:.5rem 1rem}
  .it24-grid,.it24-why,.it24-footer__grid{grid-template-columns:1fr}
  .it24-cta{flex-direction:column;align-items:flex-start}
  .it24-hero__visual{display:none}
  .it24-hero__inner{padding:3rem 1rem}
  .container-header .brand-logo::before{font-size:1.7rem}
}


/* IT24 v1.4: reliable topbar contacts */
.container-topbar .it24-contactbar{
  display:flex!important;
  align-items:center;
  gap:1rem;
  margin-right:auto;
}
.container-topbar .it24-contactbar a{
  color:#dceaf5!important;
  text-decoration:none!important;
  font-size:.88rem;
  font-weight:600;
}
.container-topbar .it24-contactbar a:hover{color:#fff!important}

/* IT24 v1.4: reliable services dropdown */
.container-header .mod-menu > li.it24-has-submenu{
  position:relative;
}
.container-header .it24-services-submenu{
  display:none;
  position:absolute;
  left:0;
  top:100%;
  z-index:3000;
  min-width:300px;
  margin:0;
  padding:.5rem;
  list-style:none;
  background:#fff;
  border:1px solid var(--it24-border);
  border-radius:14px;
  box-shadow:0 18px 42px rgba(11,45,77,.16);
}
.container-header .it24-has-submenu:hover > .it24-services-submenu,
.container-header .it24-has-submenu:focus-within > .it24-services-submenu{
  display:block;
}
.container-header .it24-services-submenu li{
  display:block;
  margin:0;
  padding:0;
}
.container-header .it24-services-submenu a{
  display:block;
  padding:.68rem .8rem!important;
  color:var(--it24-text)!important;
  font-weight:650!important;
  border-radius:9px;
  white-space:normal;
}
.container-header .it24-services-submenu a:hover{
  background:#edf6ff!important;
  color:var(--it24-blue)!important;
}
.container-header .it24-has-submenu > a::after{
  content:" ▾";
  font-size:.72em;
  opacity:.8;
}
@media (max-width:900px){
  .container-header .it24-services-submenu{
    position:static;
    min-width:0;
    width:100%;
    box-shadow:none;
    margin-top:.3rem;
  }
  .container-header .it24-has-submenu.it24-submenu-open > .it24-services-submenu{
    display:block;
  }
}



/* IT24 v1.5 additions */
.it24-contactbar{display:flex;align-items:center;gap:1rem;margin-right:auto}
.it24-contactbar a{color:#dceaf5!important;text-decoration:none!important;font-size:.88rem;font-weight:600}
.it24-contactbar a:hover{color:#fff!important}

.container-header .mod-menu>li.it24-has-submenu{position:relative}
.container-header .it24-services-submenu{
  display:none;position:absolute;left:0;top:100%;z-index:3000;min-width:300px;
  margin:0;padding:.5rem;list-style:none;background:#fff;border:1px solid #dce6f2;
  border-radius:14px;box-shadow:0 18px 42px rgba(11,45,77,.16)
}
.container-header .it24-has-submenu:hover>.it24-services-submenu,
.container-header .it24-has-submenu:focus-within>.it24-services-submenu{display:block}
.container-header .it24-services-submenu li{display:block;margin:0;padding:0}
.container-header .it24-services-submenu a{
  display:block;padding:.68rem .8rem!important;color:#172033!important;font-weight:650!important;
  border-radius:9px;white-space:normal
}
.container-header .it24-services-submenu a:hover{background:#edf6ff!important;color:#1687ff!important}
.container-header .it24-has-submenu>a::after{content:" ▾";font-size:.72em;opacity:.8}

.it24-site-footer{
  margin-top:3.5rem;background:#081f35;color:#d8e7f5;border-top:1px solid rgba(255,255,255,.06)
}
.it24-footer__inner{
  max-width:1200px;margin:0 auto;padding:2.6rem 1.25rem;
  display:grid;grid-template-columns:2fr 1fr 1fr;gap:2rem
}
.it24-site-footer h3{margin:0 0 .85rem;color:#fff;font-size:1.05rem}
.it24-site-footer p{margin:.35rem 0;color:#bfd3e4}
.it24-site-footer a{color:#fff!important;text-decoration:none!important}
.it24-site-footer a:hover{color:#56c5ff!important}
.it24-site-footer small{color:#7f9eb7}

.com-content-article a[href*="task=article.edit"]{float:right;margin:.2rem 0 .7rem 1rem;font-size:.85rem}

@media (max-width:900px){
  .container-header .it24-services-submenu{position:static;min-width:0;width:100%;box-shadow:none;margin-top:.3rem}
}
@media (max-width:700px){
  .it24-footer__inner{grid-template-columns:1fr}
}



/*
 * IT24 visual polish
 * Version: 1.6
 */

/* ---------- Topbar + header ---------- */
.container-topbar{
  min-height:34px!important;
  padding-top:.25rem!important;
  padding-bottom:.25rem!important;
}
.container-topbar .it24-contactbar{
  gap:1.15rem;
}
.container-topbar .it24-contactbar a{
  font-size:.82rem!important;
}
.container-header .navbar-brand{
  padding-top:.8rem!important;
  padding-bottom:.45rem!important;
}
.container-header .brand-logo::before{
  font-size:1.8rem!important;
}
.container-header .brand-logo::after{
  font-size:.88rem!important;
  margin-left:.55rem!important;
}
.container-header .container-nav{
  padding-bottom:.6rem!important;
}
.container-header .mod-menu>li>a{
  padding:.62rem .85rem!important;
}

/* ---------- Home hero: slightly more compact ---------- */
.it24-hero__inner{
  padding-top:4.25rem!important;
  padding-bottom:4.1rem!important;
}
.it24-hero h1{
  font-size:clamp(2.35rem,4.6vw,4.15rem)!important;
  max-width:720px;
}
.it24-hero p{
  font-size:1.08rem!important;
  max-width:650px!important;
}
.it24-hero__visual{
  min-height:300px!important;
}
.it24-section{
  padding-bottom:3.2rem!important;
}

/* ---------- Inner page typography ---------- */
.com-content-article{
  position:relative;
  line-height:1.7;
  font-size:1rem;
}
.com-content-article h1,
.com-content-article h2,
.com-content-article h3{
  color:var(--it24-navy);
  letter-spacing:-.02em;
}
.com-content-article h1{
  font-size:clamp(2rem,3.5vw,3rem);
  margin-bottom:1.25rem;
}
.com-content-article h2{
  margin-top:2rem;
  margin-bottom:.8rem;
}
.com-content-article h3{
  margin-top:1.6rem;
}
.com-content-article p{
  margin-bottom:1rem;
}
.com-content-article ul,
.com-content-article ol{
  padding-left:1.25rem;
}
.com-content-article li{
  margin-bottom:.35rem;
}

/* Neutralize old inline typography from the legacy articles */
.com-content-article span[style*="font-size"]{
  font-size:inherit!important;
}
.com-content-article p[style*="text-align: justify"],
.com-content-article ul[style*="text-align: justify"],
.com-content-article ol[style*="text-align: justify"]{
  text-align:left!important;
}

/* Old floated images become cleaner */
.com-content-article img[align="right"]{
  float:right;
  margin:.25rem 0 1rem 1.4rem;
}
.com-content-article img[align="left"]{
  float:left;
  margin:.25rem 1.4rem 1rem 0;
}

/* Old fixed-width tables become responsive */
.com-content-article table{
  display:block;
  max-width:100%;
  overflow-x:auto;
  width:100%!important;
  margin:1.2rem 0;
  background:#fff;
}
.com-content-article td,
.com-content-article th{
  vertical-align:top;
  min-width:140px;
}

/* ---------- About page ---------- */
.it24-about-hero{
  display:grid;
  grid-template-columns:minmax(0,1.4fr) minmax(280px,.6fr);
  gap:2rem;
  align-items:center;
  margin:-.25rem 0 2rem;
  padding:2rem;
  border-radius:20px;
  color:#fff;
  background:
    radial-gradient(circle at 85% 15%,rgba(86,197,255,.24),transparent 28%),
    linear-gradient(115deg,#0a2d4d,#104b79);
}
.it24-about-hero h1{
  color:#fff!important;
  margin:0 0 .8rem!important;
}
.it24-about-hero p{
  color:#d8e9f7;
  font-size:1.08rem;
  margin:0;
}
.it24-about-badge{
  justify-self:end;
  min-width:200px;
  aspect-ratio:1;
  border-radius:24px;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  color:#fff;
  font-weight:900;
  font-size:2.2rem;
}
.it24-about-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1rem;
  margin:1rem 0 2rem;
}
.it24-about-card{
  background:#fff;
  border:1px solid var(--it24-border);
  border-radius:16px;
  padding:1.2rem;
}
.it24-about-card h3{
  margin:.1rem 0 .5rem!important;
}
.it24-about-card p{
  color:var(--it24-muted);
  margin:0;
}

/* ---------- Front-end admin edit controls ---------- */
.com-content-article a[href*="task=article.edit"]{
  position:absolute!important;
  top:.7rem;
  right:.8rem;
  float:none!important;
  margin:0!important;
  padding:.28rem .5rem;
  border-radius:7px;
  background:#eef4fb;
  color:#48657e!important;
  font-size:.74rem!important;
  text-decoration:none!important;
}
.jmodedit{
  opacity:.22;
  transition:opacity .15s ease;
}
.jmodedit:hover{
  opacity:1;
}

/* ---------- Footer spacing ---------- */
.it24-site-footer{
  margin-top:2.8rem!important;
}
.it24-footer__inner{
  padding-top:2.2rem!important;
  padding-bottom:2.2rem!important;
}

/* ---------- Mobile ---------- */
@media (max-width:900px){
  .it24-about-hero{
    grid-template-columns:1fr;
  }
  .it24-about-badge{
    display:none;
  }
  .it24-about-grid{
    grid-template-columns:1fr 1fr;
  }
  .com-content-article img[align="right"],
  .com-content-article img[align="left"]{
    float:none;
    display:block;
    margin:1rem auto;
  }
}
@media (max-width:640px){
  .container-topbar{
    gap:.35rem!important;
  }
  .container-topbar .it24-contactbar{
    width:100%;
    gap:.35rem .9rem!important;
  }
  .container-header .brand-logo::before{
    font-size:1.6rem!important;
  }
  .it24-hero__inner{
    padding-top:2.8rem!important;
    padding-bottom:2.8rem!important;
  }
  .it24-about-grid{
    grid-template-columns:1fr;
  }
  .it24-about-hero{
    padding:1.4rem;
  }
  .com-content-article{
    padding:1.15rem!important;
  }
}



/*
 * IT24 final polish
 * Version: 1.8
 */

/* Hero title contrast fix */
.it24-hero h1,
.itemid-107 .it24-hero h1,
.itemid-105 .it24-hero h1{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  opacity:1!important;
  filter:none!important;
  text-shadow:0 2px 18px rgba(0,0,0,.12);
}

/* Slightly tighter and cleaner hero */
.it24-hero__inner{
  max-width:1180px!important;
  gap:2.2rem!important;
}
.it24-hero__visual{
  min-height:280px!important;
}
.it24-hero__orb{
  inset:10% 6%!important;
}
.it24-btn{
  box-shadow:0 8px 18px rgba(0,0,0,.10);
}
.it24-btn:hover{
  transform:translateY(-1px);
}

/* Main content width */
.container-component{
  max-width:1220px;
  margin-inline:auto;
}
body:not(.itemid-107):not(.itemid-105) .container-component{
  width:min(1220px,calc(100% - 2rem));
}

/* Inner pages */
body:not(.itemid-107):not(.itemid-105) .com-content-article{
  padding:clamp(1.5rem,3vw,2.4rem)!important;
}
body:not(.itemid-107):not(.itemid-105) .com-content-article > h1:first-child,
body:not(.itemid-107):not(.itemid-105) .com-content-article .page-header + h1{
  margin-top:0!important;
}
.com-content-article > p:first-of-type{
  font-size:1.04rem;
  color:#2f3e52;
}

/* Better section rhythm in legacy service pages */
.com-content-article p + ul,
.com-content-article p + ol{
  margin-top:.35rem;
}
.com-content-article ul,
.com-content-article ol{
  margin-bottom:1.25rem;
}
.com-content-article li::marker{
  color:#1687ff;
}
.com-content-article blockquote{
  margin:1.4rem 0;
  padding:1rem 1.2rem;
  border-left:4px solid #1687ff;
  background:#f3f8fe;
  border-radius:0 12px 12px 0;
}

/* Old "For reference" tables become callout-like */
.com-content-article table{
  border-radius:14px;
}
.com-content-article table td,
.com-content-article table th{
  background:#fbfdff;
}

/* Breadcrumbs */
.mod-breadcrumbs{
  margin-top:.2rem;
}
.breadcrumb{
  font-size:.92rem;
  padding:.55rem 0!important;
}
.breadcrumb a{
  color:#315f8a;
}
.breadcrumb-item + .breadcrumb-item::before{
  color:#9aa9b8;
}

/* Service cards */
.it24-card{
  min-height:100%;
}
.it24-card h3{
  line-height:1.2;
}
.it24-card a{
  display:inline-flex;
  align-items:center;
  gap:.25rem;
}
.it24-card a::after{
  content:"→";
}

/* Footer polish */
.it24-site-footer{
  box-shadow:0 -8px 30px rgba(11,45,77,.06);
}
.it24-site-footer p{
  line-height:1.55;
}

/* Desktop header alignment */
@media (min-width:901px){
  .container-header .grid-child{
    padding-left:1rem;
    padding-right:1rem;
  }
  .container-header .container-nav{
    align-items:center;
  }
}

/* Tablet */
@media (max-width:900px){
  .it24-hero__inner{
    gap:1.25rem!important;
  }
  body:not(.itemid-107):not(.itemid-105) .container-component{
    width:min(100% - 1.25rem,1220px);
  }
}

/* Mobile */
@media (max-width:640px){
  .container-topbar{
    padding-left:.75rem!important;
    padding-right:.75rem!important;
  }
  .container-topbar .it24-contactbar{
    font-size:.78rem;
  }
  .container-topbar .it24-contactbar a{
    font-size:.78rem!important;
  }
  .container-header .navbar-brand{
    padding-left:.75rem!important;
    padding-right:.75rem!important;
  }
  .container-header .container-nav{
    padding-left:.5rem!important;
    padding-right:.5rem!important;
  }
  .container-header .mod-menu{
    gap:.1rem!important;
  }
  .container-header .mod-menu>li>a{
    padding:.55rem .65rem!important;
    font-size:.92rem;
  }
  .it24-hero{
    margin-bottom:1.7rem!important;
  }
  .it24-hero__inner{
    padding:2.35rem .9rem!important;
  }
  .it24-hero h1{
    font-size:clamp(2rem,11vw,3rem)!important;
  }
  .it24-hero p{
    font-size:1rem!important;
  }
  .it24-btns{
    gap:.6rem!important;
  }
  .it24-btn{
    width:100%;
  }
  .it24-section{
    padding-left:.9rem!important;
    padding-right:.9rem!important;
    padding-bottom:2.3rem!important;
  }
  body:not(.itemid-107):not(.itemid-105) .container-component{
    width:calc(100% - .9rem);
  }
  body:not(.itemid-107):not(.itemid-105) .com-content-article{
    padding:1rem!important;
    border-radius:14px!important;
  }
  .com-content-article h1{
    font-size:2rem!important;
  }
  .breadcrumb{
    font-size:.82rem;
  }
}



/*
 * IT24 service pages
 * Version: 1.9
 */
.it24-service-hero{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr);
  gap:2rem;
  align-items:center;
  padding:2rem;
  margin:0 0 1.8rem;
  border-radius:20px;
  background:
    radial-gradient(circle at 85% 18%,rgba(86,197,255,.22),transparent 28%),
    linear-gradient(115deg,#0a2d4d,#104b79);
  color:#fff;
}
.it24-service-hero h1{
  color:#fff!important;
  margin:0 0 .8rem!important;
  font-size:clamp(2rem,4vw,3.4rem)!important;
}
.it24-service-hero p{
  margin:0;
  color:#d8e9f7!important;
  font-size:1.08rem;
  line-height:1.65;
}
.it24-service-badge{
  justify-self:end;
  min-width:190px;
  aspect-ratio:1;
  border-radius:24px;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.12);
  color:#fff;
  font-weight:900;
  font-size:1.65rem;
  text-align:center;
  padding:1rem;
}
.it24-service-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1rem;
  margin:1rem 0 2rem;
}
.it24-service-card{
  padding:1.2rem;
  border:1px solid var(--it24-border);
  border-radius:16px;
  background:#fff;
}
.it24-service-card h3{
  margin:.1rem 0 .55rem!important;
}
.it24-service-card p{
  margin:0;
  color:var(--it24-muted);
}
.it24-checklist{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.65rem 1rem;
  padding:0!important;
  margin:1rem 0 2rem!important;
  list-style:none!important;
}
.it24-checklist li{
  position:relative;
  padding:.8rem .9rem .8rem 2.1rem;
  margin:0!important;
  border:1px solid var(--it24-border);
  border-radius:12px;
  background:#fbfdff;
}
.it24-checklist li::before{
  content:"✓";
  position:absolute;
  left:.8rem;
  top:.77rem;
  color:#1687ff;
  font-weight:900;
}
.it24-process{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1rem;
  margin:1rem 0 2rem;
}
.it24-step{
  padding:1rem;
  border-radius:14px;
  background:#f6faff;
  border:1px solid var(--it24-border);
}
.it24-step strong{
  display:block;
  margin-bottom:.35rem;
  color:var(--it24-navy);
}
.it24-step span{
  color:var(--it24-muted);
}
.it24-service-cta{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:1rem;
  padding:1.5rem;
  margin-top:2rem;
  border-radius:18px;
  background:linear-gradient(110deg,#0b2d4d,#104b79);
  color:#fff;
}
.it24-service-cta h2{
  color:#fff!important;
  margin:0 0 .35rem!important;
}
.it24-service-cta p{
  margin:0;
  color:#d7e8f6!important;
}
@media (max-width:900px){
  .it24-service-hero{grid-template-columns:1fr}
  .it24-service-badge{display:none}
  .it24-service-grid{grid-template-columns:1fr 1fr}
  .it24-process{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .it24-service-grid,.it24-process,.it24-checklist{grid-template-columns:1fr}
  .it24-service-hero{padding:1.35rem}
  .it24-service-cta{flex-direction:column;align-items:flex-start}
}



/*
 * IT24 conversion + SEO polish
 * Version: 2.0
 */

/* Home sections */
.it24-home-section{
  max-width:1180px;
  margin:0 auto;
  padding:3rem 1rem;
}
.it24-home-section--soft{
  background:#f7fbff;
  border-radius:24px;
}
.it24-kicker{
  color:#1687ff;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:.78rem;
}
.it24-lead{
  font-size:1.08rem;
  color:#536579;
  max-width:760px;
}
.it24-feature-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1rem;
  margin-top:1.4rem;
}
.it24-feature{
  background:#fff;
  border:1px solid var(--it24-border);
  border-radius:16px;
  padding:1.2rem;
}
.it24-feature h3{margin:.15rem 0 .5rem!important}
.it24-feature p{margin:0;color:var(--it24-muted)}
.it24-feature strong{
  display:inline-grid;
  place-items:center;
  min-width:42px;
  height:42px;
  padding:0 .55rem;
  border-radius:12px;
  background:#eaf4ff;
  color:#1687ff;
  margin-bottom:.7rem;
}
.it24-home-services{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:.9rem;
  margin-top:1.3rem;
}
.it24-home-service{
  display:flex;
  flex-direction:column;
  gap:.5rem;
  min-height:190px;
  padding:1rem;
  background:#fff;
  border:1px solid var(--it24-border);
  border-radius:16px;
  text-decoration:none!important;
  transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease;
}
.it24-home-service:hover{
  transform:translateY(-3px);
  box-shadow:0 14px 28px rgba(11,45,77,.10);
  border-color:#bdd8ef;
}
.it24-home-service b{font-size:1.02rem;color:var(--it24-navy)}
.it24-home-service span{color:var(--it24-muted);font-size:.92rem}
.it24-home-service em{
  margin-top:auto;
  font-style:normal;
  color:#1687ff;
  font-weight:700;
}
.it24-process-wide{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1rem;
  margin-top:1.3rem;
}
.it24-process-wide .it24-step{
  min-height:150px;
}
.it24-faq{
  display:grid;
  gap:.7rem;
  margin-top:1.2rem;
}
.it24-faq details{
  background:#fff;
  border:1px solid var(--it24-border);
  border-radius:14px;
  padding:1rem 1.1rem;
}
.it24-faq summary{
  cursor:pointer;
  font-weight:800;
  color:var(--it24-navy);
}
.it24-faq p{
  margin:.7rem 0 0;
  color:var(--it24-muted);
}
.it24-contact-panel{
  display:grid;
  grid-template-columns:1.25fr .75fr;
  gap:1.2rem;
  align-items:center;
  background:linear-gradient(115deg,#0a2d4d,#104b79);
  border-radius:22px;
  padding:2rem;
  color:#fff;
}
.it24-contact-panel h2{color:#fff!important;margin:0 0 .55rem!important}
.it24-contact-panel p{color:#d7e8f6;margin:.3rem 0}
.it24-contact-actions{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:.7rem;
}
.it24-contact-actions a{
  color:#fff!important;
  text-decoration:none!important;
  font-weight:800;
}
.it24-contact-actions .it24-btn{width:100%;justify-content:center}

/* Topbar usability */
.container-topbar .it24-contactbar a{
  white-space:nowrap;
}

/* Better language switch visibility */
.container-topbar .mod-languages a{
  border-radius:8px;
  padding:.35rem .5rem;
}
.container-topbar .mod-languages .lang-active a,
.container-topbar .mod-languages .active a{
  background:#fff;
  color:#0b2d4d!important;
}

/* Prevent tiny admin controls from affecting layout */
.jmodedit,
a.jmodedit{
  position:absolute!important;
  z-index:999;
}

/* Accessibility */
.it24-btn:focus-visible,
.container-header a:focus-visible,
.it24-site-footer a:focus-visible,
.it24-home-service:focus-visible{
  outline:3px solid #56c5ff!important;
  outline-offset:3px;
}

/* Mobile */
@media (max-width:1000px){
  .it24-home-services{grid-template-columns:repeat(2,minmax(0,1fr))}
  .it24-feature-grid{grid-template-columns:1fr 1fr}
  .it24-contact-panel{grid-template-columns:1fr}
}
@media (max-width:700px){
  .it24-feature-grid,
  .it24-home-services,
  .it24-process-wide{grid-template-columns:1fr}
  .it24-home-section{padding:2.2rem .85rem}
  .it24-home-section--soft{border-radius:16px}
  .it24-contact-panel{padding:1.35rem}
  .container-topbar .it24-contactbar{
    overflow-x:auto;
    max-width:100%;
  }
}



/* IT24 maintenance UX - Version 2.5 */
.it24-404{max-width:900px;margin:3rem auto;padding:4rem 1.2rem;text-align:center}
.it24-404__code{font-size:clamp(4rem,14vw,8rem);line-height:.9;font-weight:900;letter-spacing:-.06em;color:#1687ff}
.it24-404 h1{margin:.9rem 0 .7rem;color:#0b2d4d}
.it24-404 p{max-width:620px;margin:0 auto 1.4rem;color:#617287}
.it24-404 .it24-btns{justify-content:center}



/*
 * IT24 major maintenance & UX
 * Version: 3.0
 */
.it24-skip-link{
  position:fixed;
  left:1rem;
  top:-80px;
  z-index:99999;
  background:#fff;
  color:#0b2d4d!important;
  padding:.7rem 1rem;
  border-radius:10px;
  box-shadow:0 8px 24px rgba(0,0,0,.18);
  font-weight:800;
  text-decoration:none!important;
  transition:top .15s ease;
}
.it24-skip-link:focus{top:1rem}

.it24-backtop{
  position:fixed;
  right:1rem;
  bottom:1rem;
  width:44px;
  height:44px;
  border:0;
  border-radius:50%;
  background:#0b2d4d;
  color:#fff;
  font-size:1.3rem;
  font-weight:900;
  box-shadow:0 8px 22px rgba(11,45,77,.25);
  cursor:pointer;
  opacity:0;
  pointer-events:none;
  transform:translateY(8px);
  transition:.18s ease;
  z-index:999;
}
.it24-backtop.is-visible{
  opacity:1;
  pointer-events:auto;
  transform:none;
}
.it24-backtop:hover{background:#1687ff}

.it24-mobile-call{
  display:none;
}

@media (max-width:700px){
  body{padding-bottom:64px}
  .it24-mobile-call{
    display:flex;
    position:fixed;
    left:.7rem;
    right:.7rem;
    bottom:.65rem;
    z-index:1200;
    min-height:48px;
    align-items:center;
    justify-content:center;
    border-radius:14px;
    background:#1687ff;
    color:#fff!important;
    text-decoration:none!important;
    font-weight:900;
    box-shadow:0 10px 28px rgba(22,135,255,.30);
  }
  .it24-backtop{
    bottom:4.4rem;
  }
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    scroll-behavior:auto!important;
    animation-duration:.001ms!important;
    transition-duration:.001ms!important;
  }
}



/*
 * IT24 final package
 * Version: 4.0
 */

/* Keep content readable on very wide displays */
.com-content-article > *:not(.it24-service-hero):not(.it24-service-grid):not(.it24-service-cta):not(.it24-about-hero):not(.it24-about-grid){
  max-width:980px;
}

/* Service/about landing blocks still use the wider article width */
.com-content-article .it24-service-grid,
.com-content-article .it24-about-grid{
  max-width:none;
}

/* Footer contact links remain easy to hit */
.it24-site-footer a{
  min-height:28px;
  display:inline-flex;
  align-items:center;
}

/* Ensure sticky call control never overlaps iPhone safe area */
@media (max-width:700px){
  .it24-mobile-call{
    bottom:max(.65rem,env(safe-area-inset-bottom));
  }
  body{
    padding-bottom:calc(64px + env(safe-area-inset-bottom));
  }
}

/* Print: remove navigation / interactive controls */
@media print{
  .container-topbar,.container-header,.it24-site-footer,
  .it24-mobile-call,.it24-backtop,.it24-btns,.jmodedit{
    display:none!important;
  }
  body,.site-grid,.com-content-article{
    background:#fff!important;
    color:#000!important;
    box-shadow:none!important;
  }
}



/*
 * IT24 homepage geometry hotfix
 * Version: 4.1
 *
 * Fixes v4.0 rule that unintentionally capped the homepage hero at 980px.
 */

/* Homepage large sections must use the intended full content width */
.itemid-107 .com-content-article > .it24-hero,
.itemid-105 .com-content-article > .it24-hero,
.itemid-107 .com-content-article > .it24-home-section,
.itemid-105 .com-content-article > .it24-home-section{
  max-width:none!important;
  width:100%!important;
}

/* Center the hero as one balanced block */
.itemid-107 .it24-hero,
.itemid-105 .it24-hero{
  width:min(1180px,calc(100% - 2rem))!important;
  max-width:1180px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

.itemid-107 .it24-hero__inner,
.itemid-105 .it24-hero__inner{
  width:100%!important;
  max-width:none!important;
  grid-template-columns:minmax(0,1.15fr) minmax(330px,.85fr)!important;
  align-items:center!important;
  padding-left:2.2rem!important;
  padding-right:2.2rem!important;
}

/* Keep the text column readable */
.itemid-107 .it24-hero__inner > div:first-child,
.itemid-105 .it24-hero__inner > div:first-child{
  min-width:0;
  max-width:650px;
}

/* Correct visual alignment and image sizing */
.itemid-107 .it24-hero__visual,
.itemid-105 .it24-hero__visual{
  min-width:0!important;
  min-height:300px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0!important;
}

.itemid-107 .it24-hero__orb,
.itemid-105 .it24-hero__orb{
  position:relative!important;
  inset:auto!important;
  width:min(100%,410px)!important;
  height:auto!important;
  aspect-ratio:1.45/1!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  margin:0 auto!important;
}

.itemid-107 .it24-hero__orb img,
.itemid-105 .it24-hero__orb img{
  display:block!important;
  width:78%!important;
  height:auto!important;
  max-width:320px!important;
  margin:0 auto!important;
  object-fit:contain!important;
}

/* The secondary button was too dark after the accumulated CSS layers */
.itemid-107 .it24-hero .it24-btn:not(.it24-btn--primary),
.itemid-105 .it24-hero .it24-btn:not(.it24-btn--primary){
  color:#fff!important;
  border-color:rgba(255,255,255,.38)!important;
  background:rgba(255,255,255,.04)!important;
}

.itemid-107 .it24-hero .it24-btn:not(.it24-btn--primary):hover,
.itemid-105 .it24-hero .it24-btn:not(.it24-btn--primary):hover{
  background:rgba(255,255,255,.12)!important;
  border-color:rgba(255,255,255,.65)!important;
}

/* Center homepage sections under the hero */
.itemid-107 .it24-home-section,
.itemid-105 .it24-home-section{
  width:min(1180px,calc(100% - 2rem))!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* Tablet */
@media (max-width:900px){
  .itemid-107 .it24-hero__inner,
  .itemid-105 .it24-hero__inner{
    grid-template-columns:1fr!important;
    padding-left:1.35rem!important;
    padding-right:1.35rem!important;
  }

  .itemid-107 .it24-hero__inner > div:first-child,
  .itemid-105 .it24-hero__inner > div:first-child{
    max-width:none;
  }

  .itemid-107 .it24-hero__visual,
  .itemid-105 .it24-hero__visual{
    min-height:230px!important;
  }

  .itemid-107 .it24-hero__orb,
  .itemid-105 .it24-hero__orb{
    width:min(100%,460px)!important;
  }
}

/* Mobile */
@media (max-width:640px){
  .itemid-107 .it24-hero,
  .itemid-105 .it24-hero,
  .itemid-107 .it24-home-section,
  .itemid-105 .it24-home-section{
    width:calc(100% - 1rem)!important;
  }

  .itemid-107 .it24-hero__visual,
  .itemid-105 .it24-hero__visual{
    min-height:190px!important;
  }

  .itemid-107 .it24-hero__orb img,
  .itemid-105 .it24-hero__orb img{
    width:72%!important;
  }
}



/*
 * IT24 homepage full-width fix
 * Version: 4.2
 *
 * v4.1 depended on itemid-* body classes which are not present on this site.
 * These selectors target the actual homepage structure instead.
 */

/* Undo v4.0's generic 980px cap specifically for homepage blocks */
.com-content-article > .it24-hero,
.com-content-article > .it24-home-section{
  max-width:none!important;
}

/* The page containing the IT24 hero must not be squeezed by the article container */
.container-component:has(.it24-hero){
  width:100%!important;
  max-width:none!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:0!important;
  padding-right:0!important;
}

.com-content-article:has(> .it24-hero){
  width:100%!important;
  max-width:none!important;
  padding-left:0!important;
  padding-right:0!important;
  background:transparent!important;
  box-shadow:none!important;
  border:0!important;
}

/* Full, centered homepage hero */
.com-content-article > .it24-hero{
  box-sizing:border-box!important;
  width:min(1240px,calc(100vw - 48px))!important;
  max-width:1240px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* Same alignment for all homepage sections below */
.com-content-article > .it24-home-section{
  box-sizing:border-box!important;
  width:min(1180px,calc(100vw - 48px))!important;
  max-width:1180px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* Balanced two-column hero */
.com-content-article > .it24-hero .it24-hero__inner{
  width:100%!important;
  max-width:none!important;
  grid-template-columns:minmax(0,1.12fr) minmax(360px,.88fr)!important;
  gap:3rem!important;
  align-items:center!important;
  padding-left:3rem!important;
  padding-right:3rem!important;
}

/* Text shouldn't become overly narrow */
.com-content-article > .it24-hero .it24-hero__inner > div:first-child{
  max-width:680px!important;
  min-width:0!important;
}

/* Fix the right illustration position */
.com-content-article > .it24-hero .it24-hero__visual{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  min-width:0!important;
  min-height:330px!important;
  padding:0!important;
  margin:0!important;
}

.com-content-article > .it24-hero .it24-hero__orb{
  position:relative!important;
  inset:auto!important;
  width:min(100%,440px)!important;
  height:270px!important;
  aspect-ratio:auto!important;
  margin:0 auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
}

/* The source SVG has generous empty space, so scale it slightly */
.com-content-article > .it24-hero .it24-hero__orb img{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  height:auto!important;
  margin:0!important;
  transform:scale(1.28)!important;
  transform-origin:center center!important;
  object-fit:contain!important;
}

/* Secondary hero button contrast */
.com-content-article > .it24-hero .it24-btn:not(.it24-btn--primary){
  color:#fff!important;
  border-color:rgba(255,255,255,.42)!important;
  background:rgba(255,255,255,.045)!important;
}
.com-content-article > .it24-hero .it24-btn:not(.it24-btn--primary):hover{
  color:#fff!important;
  border-color:rgba(255,255,255,.7)!important;
  background:rgba(255,255,255,.12)!important;
}

/* Tablet */
@media (max-width:1000px){
  .com-content-article > .it24-hero{
    width:calc(100vw - 28px)!important;
  }

  .com-content-article > .it24-home-section{
    width:calc(100vw - 28px)!important;
  }

  .com-content-article > .it24-hero .it24-hero__inner{
    grid-template-columns:1fr!important;
    gap:1.5rem!important;
    padding-left:1.5rem!important;
    padding-right:1.5rem!important;
  }

  .com-content-article > .it24-hero .it24-hero__inner > div:first-child{
    max-width:none!important;
  }

  .com-content-article > .it24-hero .it24-hero__visual{
    min-height:250px!important;
  }

  .com-content-article > .it24-hero .it24-hero__orb{
    width:min(100%,500px)!important;
    height:245px!important;
  }
}

/* Mobile */
@media (max-width:640px){
  .com-content-article > .it24-hero,
  .com-content-article > .it24-home-section{
    width:calc(100vw - 16px)!important;
  }

  .com-content-article > .it24-hero .it24-hero__inner{
    padding-left:1rem!important;
    padding-right:1rem!important;
  }

  .com-content-article > .it24-hero .it24-hero__visual{
    min-height:190px!important;
  }

  .com-content-article > .it24-hero .it24-hero__orb{
    height:190px!important;
  }
}



/*
 * IT24 homepage universal width fix
 * Version: 4.3
 *
 * IMPORTANT:
 * Do not depend on itemid classes or direct-child selectors.
 * Target the actual IT24 homepage classes themselves.
 */

/* Override v4.0 generic article child cap */
.it24-hero{
  box-sizing:border-box!important;
  width:calc(100% - 2rem)!important;
  max-width:1240px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* All homepage content blocks align to the same centered grid */
.it24-home-section{
  box-sizing:border-box!important;
  width:calc(100% - 2rem)!important;
  max-width:1180px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* Hero internal geometry */
.it24-hero .it24-hero__inner{
  width:100%!important;
  max-width:none!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.12fr) minmax(360px,.88fr)!important;
  gap:3rem!important;
  align-items:center!important;
  padding-left:3rem!important;
  padding-right:3rem!important;
}

/* Text column */
.it24-hero .it24-hero__inner > div:first-child{
  max-width:680px!important;
  min-width:0!important;
}

/* Right visual column */
.it24-hero .it24-hero__visual{
  width:100%!important;
  min-width:0!important;
  min-height:320px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0!important;
  margin:0!important;
}

/* Visual card */
.it24-hero .it24-hero__orb{
  position:relative!important;
  inset:auto!important;
  width:100%!important;
  max-width:430px!important;
  height:270px!important;
  margin:0 auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
}

/* Scale the network illustration itself */
.it24-hero .it24-hero__orb img{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  height:auto!important;
  margin:0!important;
  object-fit:contain!important;
  transform:scale(1.22)!important;
  transform-origin:center center!important;
}

/* Secondary hero CTA */
.it24-hero .it24-btn:not(.it24-btn--primary){
  color:#fff!important;
  border-color:rgba(255,255,255,.45)!important;
  background:rgba(255,255,255,.045)!important;
}

.it24-hero .it24-btn:not(.it24-btn--primary):hover{
  color:#fff!important;
  border-color:rgba(255,255,255,.72)!important;
  background:rgba(255,255,255,.12)!important;
}

@media (max-width:1000px){
  .it24-hero .it24-hero__inner{
    grid-template-columns:1fr!important;
    gap:1.5rem!important;
    padding-left:1.5rem!important;
    padding-right:1.5rem!important;
  }

  .it24-hero .it24-hero__inner > div:first-child{
    max-width:none!important;
  }

  .it24-hero .it24-hero__visual{
    min-height:240px!important;
  }

  .it24-hero .it24-hero__orb{
    max-width:500px!important;
    height:240px!important;
  }
}

@media (max-width:640px){
  .it24-hero,
  .it24-home-section{
    width:calc(100% - 1rem)!important;
  }

  .it24-hero .it24-hero__inner{
    padding-left:1rem!important;
    padding-right:1rem!important;
  }

  .it24-hero .it24-hero__visual{
    min-height:185px!important;
  }

  .it24-hero .it24-hero__orb{
    height:185px!important;
  }
}



/*
 * IT24 viewport-width homepage fix
 * Version: 4.4
 *
 * Root cause:
 * .it24-hero width was percentage-based, so it could never become wider
 * than Joomla's narrow component column. Use viewport units instead.
 */

/* Hero may intentionally exceed Joomla's component-column width */
.it24-hero{
  box-sizing:border-box!important;
  width:min(1240px,calc(100vw - 48px))!important;
  min-width:0!important;
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
  overflow:visible!important;
}

/* Homepage sections also stop inheriting the narrow component width */
.it24-home-section{
  box-sizing:border-box!important;
  width:min(1180px,calc(100vw - 48px))!important;
  min-width:0!important;
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
}

/* Hero grid */
.it24-hero .it24-hero__inner{
  box-sizing:border-box!important;
  width:100%!important;
  max-width:none!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.05fr) minmax(390px,.95fr)!important;
  gap:3.4rem!important;
  align-items:center!important;
  padding-left:3rem!important;
  padding-right:3rem!important;
}

/* Left text: let the headline breathe */
.it24-hero .it24-hero__inner > div:first-child{
  width:100%!important;
  max-width:690px!important;
  min-width:0!important;
}

.it24-hero h1{
  max-width:690px!important;
}

/* Right illustration */
.it24-hero .it24-hero__visual{
  box-sizing:border-box!important;
  width:100%!important;
  min-width:0!important;
  min-height:330px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0!important;
  margin:0!important;
}

.it24-hero .it24-hero__orb{
  position:relative!important;
  inset:auto!important;
  box-sizing:border-box!important;
  width:100%!important;
  max-width:450px!important;
  height:280px!important;
  margin:0 auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
}

.it24-hero .it24-hero__orb img{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  height:auto!important;
  margin:0!important;
  transform:scale(1.16)!important;
  transform-origin:center!important;
}

/* Keep the hero CTA readable */
.it24-hero .it24-btn:not(.it24-btn--primary){
  color:#fff!important;
  border-color:rgba(255,255,255,.44)!important;
  background:rgba(255,255,255,.045)!important;
}

@media (max-width:1300px){
  .it24-hero{
    width:calc(100vw - 32px)!important;
  }

  .it24-home-section{
    width:calc(100vw - 32px)!important;
  }

  .it24-hero .it24-hero__inner{
    grid-template-columns:minmax(0,1fr) minmax(340px,.85fr)!important;
    gap:2rem!important;
    padding-left:2rem!important;
    padding-right:2rem!important;
  }
}

@media (max-width:1000px){
  .it24-hero,
  .it24-home-section{
    width:calc(100vw - 24px)!important;
  }

  .it24-hero .it24-hero__inner{
    grid-template-columns:1fr!important;
    gap:1.5rem!important;
  }

  .it24-hero .it24-hero__inner > div:first-child{
    max-width:none!important;
  }

  .it24-hero .it24-hero__visual{
    min-height:240px!important;
  }

  .it24-hero .it24-hero__orb{
    max-width:520px!important;
    height:240px!important;
  }
}

@media (max-width:640px){
  .it24-hero,
  .it24-home-section{
    width:calc(100vw - 12px)!important;
  }

  .it24-hero .it24-hero__inner{
    padding-left:1rem!important;
    padding-right:1rem!important;
  }

  .it24-hero .it24-hero__visual{
    min-height:185px!important;
  }

  .it24-hero .it24-hero__orb{
    height:185px!important;
  }
}



/*
 * IT24 Cassiopeia grid fix
 * Version: 4.5
 *
 * Confirmed DOM:
 * body.itemid-107/105
 *   .site-grid
 *     .grid-child.container-component
 *       main
 *         .com-content-article.item-page
 *           .com-content-article__body
 *             .it24-hero
 *
 * Root cause: Cassiopeia's site-grid was keeping container-component
 * inside the component grid area instead of spanning the full page grid.
 */

/* Home UA + RU: make Joomla component span the full site grid */
body.itemid-107 .site-grid > .container-component,
body.itemid-105 .site-grid > .container-component{
  grid-column:1 / -1!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  margin:0!important;
  padding-left:0!important;
  padding-right:0!important;
}

/* Remove all inherited width caps from the actual article wrappers */
body.itemid-107 .container-component > main,
body.itemid-105 .container-component > main,
body.itemid-107 .com-content-article,
body.itemid-105 .com-content-article,
body.itemid-107 .com-content-article__body,
body.itemid-105 .com-content-article__body{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  margin-left:0!important;
  margin-right:0!important;
}

/* Home article should behave as a transparent full-width canvas */
body.itemid-107 .com-content-article,
body.itemid-105 .com-content-article{
  padding-left:0!important;
  padding-right:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}

/* Center hero inside the now-full-width Joomla component */
body.itemid-107 .it24-hero,
body.itemid-105 .it24-hero{
  box-sizing:border-box!important;
  width:calc(100% - 32px)!important;
  max-width:1240px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* Align all homepage sections with the hero */
body.itemid-107 .it24-home-section,
body.itemid-105 .it24-home-section{
  box-sizing:border-box!important;
  width:calc(100% - 32px)!important;
  max-width:1180px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* Balanced hero columns */
body.itemid-107 .it24-hero__inner,
body.itemid-105 .it24-hero__inner{
  box-sizing:border-box!important;
  width:100%!important;
  max-width:none!important;
  grid-template-columns:minmax(0,1.08fr) minmax(380px,.92fr)!important;
  gap:3rem!important;
  align-items:center!important;
  padding-left:3rem!important;
  padding-right:3rem!important;
}

/* Text */
body.itemid-107 .it24-hero__inner > div:first-child,
body.itemid-105 .it24-hero__inner > div:first-child{
  min-width:0!important;
  max-width:690px!important;
}

/* Visual */
body.itemid-107 .it24-hero__visual,
body.itemid-105 .it24-hero__visual{
  width:100%!important;
  min-width:0!important;
  min-height:320px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  margin:0!important;
  padding:0!important;
}

body.itemid-107 .it24-hero__orb,
body.itemid-105 .it24-hero__orb{
  position:relative!important;
  inset:auto!important;
  width:100%!important;
  max-width:450px!important;
  height:280px!important;
  margin:0 auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
}

body.itemid-107 .it24-hero__orb img,
body.itemid-105 .it24-hero__orb img{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  height:auto!important;
  margin:0!important;
  transform:scale(1.13)!important;
  transform-origin:center!important;
}

/* Admin edit control should not influence layout */
body.itemid-107 .com-content-article > a[href*="task=article.edit"],
body.itemid-105 .com-content-article > a[href*="task=article.edit"]{
  position:absolute!important;
  right:1rem!important;
  top:.5rem!important;
  z-index:20!important;
}

/* Tablet */
@media (max-width:1000px){
  body.itemid-107 .it24-hero,
  body.itemid-105 .it24-hero,
  body.itemid-107 .it24-home-section,
  body.itemid-105 .it24-home-section{
    width:calc(100% - 20px)!important;
  }

  body.itemid-107 .it24-hero__inner,
  body.itemid-105 .it24-hero__inner{
    grid-template-columns:1fr!important;
    gap:1.4rem!important;
    padding-left:1.5rem!important;
    padding-right:1.5rem!important;
  }

  body.itemid-107 .it24-hero__inner > div:first-child,
  body.itemid-105 .it24-hero__inner > div:first-child{
    max-width:none!important;
  }

  body.itemid-107 .it24-hero__visual,
  body.itemid-105 .it24-hero__visual{
    min-height:240px!important;
  }
}

/* Mobile */
@media (max-width:640px){
  body.itemid-107 .it24-hero,
  body.itemid-105 .it24-hero,
  body.itemid-107 .it24-home-section,
  body.itemid-105 .it24-home-section{
    width:calc(100% - 12px)!important;
  }

  body.itemid-107 .it24-hero__inner,
  body.itemid-105 .it24-hero__inner{
    padding-left:1rem!important;
    padding-right:1rem!important;
  }

  body.itemid-107 .it24-hero__orb,
  body.itemid-105 .it24-hero__orb{
    height:190px!important;
  }
}


/*
 * IT24 hero refinement
 * Version: 4.6
 *
 * Fixes:
 * 1) clean hero SVG without duplicated labels;
 * 2) more compact, nicer homepage H1.
 */

/* Compact homepage hero heading */
body.itemid-107 .it24-hero h1,
body.itemid-105 .it24-hero h1{
  font-size:clamp(3.1rem,4.35vw,4.85rem)!important;
  line-height:.94!important;
  letter-spacing:-.03em!important;
  max-width:11.2ch!important;
  margin-bottom:1rem!important;
  text-wrap:balance!important;
}

body.itemid-107 .it24-hero p,
body.itemid-105 .it24-hero p{
  max-width:33rem!important;
}

/* Cleaner visual block for the new SVG */
body.itemid-107 .it24-hero__orb,
body.itemid-105 .it24-hero__orb{
  max-width:430px!important;
  height:268px!important;
}

body.itemid-107 .it24-hero__orb img,
body.itemid-105 .it24-hero__orb img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  transform:none!important;
  margin:0!important;
}

@media (max-width:1000px){
  body.itemid-107 .it24-hero h1,
  body.itemid-105 .it24-hero h1{
    font-size:clamp(2.6rem,7vw,4rem)!important;
    max-width:none!important;
  }
}

@media (max-width:640px){
  body.itemid-107 .it24-hero h1,
  body.itemid-105 .it24-hero h1{
    font-size:clamp(2.25rem,10vw,3rem)!important;
    line-height:.98!important;
  }

  body.itemid-107 .it24-hero__orb,
  body.itemid-105 .it24-hero__orb{
    height:190px!important;
  }
}



/*
 * IT24 hero final cleanup
 * Version: 4.7
 */

/* Shorter headline = less visual mass */
body.itemid-107 .it24-hero h1,
body.itemid-105 .it24-hero h1{
  font-size:clamp(3rem,4vw,4.45rem)!important;
  line-height:.96!important;
  letter-spacing:-.035em!important;
  max-width:11.5ch!important;
  margin:0 0 1rem!important;
  text-wrap:balance!important;
}

body.itemid-107 .it24-hero p,
body.itemid-105 .it24-hero p{
  max-width:34rem!important;
}

/* New SVG is already correctly composed; do not scale it */
body.itemid-107 .it24-hero__orb img,
body.itemid-105 .it24-hero__orb img{
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  object-fit:contain!important;
  transform:none!important;
}

@media (max-width:1000px){
  body.itemid-107 .it24-hero h1,
  body.itemid-105 .it24-hero h1{
    max-width:none!important;
    font-size:clamp(2.6rem,7vw,3.8rem)!important;
  }
}

@media (max-width:640px){
  body.itemid-107 .it24-hero h1,
  body.itemid-105 .it24-hero h1{
    font-size:clamp(2.2rem,10vw,2.9rem)!important;
    line-height:.98!important;
  }
}


/*
 * IT24 hero asset hard switch
 * Version: 4.8
 */
body.itemid-107 .it24-hero h1,
body.itemid-105 .it24-hero h1{
  font-size:clamp(2.9rem,3.7vw,4.15rem)!important;
  max-width:12.2ch!important;
}
body.itemid-107 .it24-hero__orb img,
body.itemid-105 .it24-hero__orb img{
  transform:none!important;
  filter:none!important;
}



/*
 * IT24 hero definitive cleanup
 * Version: 4.9
 */

/* Remove any legacy decorative layers from earlier hero versions. */
body.itemid-107 .it24-hero__visual,
body.itemid-105 .it24-hero__visual{
  background:none!important;
  box-shadow:none!important;
  border:0!important;
}

body.itemid-107 .it24-hero__visual::before,
body.itemid-107 .it24-hero__visual::after,
body.itemid-105 .it24-hero__visual::before,
body.itemid-105 .it24-hero__visual::after,
body.itemid-107 .it24-hero__orb::before,
body.itemid-107 .it24-hero__orb::after,
body.itemid-105 .it24-hero__orb::before,
body.itemid-105 .it24-hero__orb::after{
  content:none!important;
  display:none!important;
  background:none!important;
}

/* Exactly one visible card: the orb itself. SVG contains no outer card. */
body.itemid-107 .it24-hero__orb,
body.itemid-105 .it24-hero__orb{
  width:100%!important;
  max-width:430px!important;
  height:270px!important;
  padding:18px!important;
  border-radius:28px!important;
  border:1px solid rgba(255,255,255,.12)!important;
  background:
    radial-gradient(circle at 50% 18%,rgba(70,183,255,.18),transparent 42%),
    linear-gradient(135deg,rgba(255,255,255,.055),rgba(255,255,255,.018))!important;
  box-shadow:none!important;
  overflow:hidden!important;
}

body.itemid-107 .it24-hero__orb img,
body.itemid-105 .it24-hero__orb img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  object-fit:contain!important;
  margin:0!important;
  padding:0!important;
  transform:none!important;
  filter:none!important;
  opacity:1!important;
}

/* More compact headline: intentionally two lines. */
body.itemid-107 .it24-hero h1,
body.itemid-105 .it24-hero h1{
  font-size:clamp(2.9rem,3.45vw,3.65rem)!important;
  line-height:1.02!important;
  letter-spacing:-.035em!important;
  max-width:680px!important;
  margin:0 0 1rem!important;
}

body.itemid-107 .it24-hero h1 br,
body.itemid-105 .it24-hero h1 br{
  display:block!important;
}

body.itemid-107 .it24-hero p,
body.itemid-105 .it24-hero p{
  max-width:36rem!important;
}

@media (max-width:1000px){
  body.itemid-107 .it24-hero h1,
  body.itemid-105 .it24-hero h1{
    font-size:clamp(2.55rem,6vw,3.35rem)!important;
  }
}

@media (max-width:640px){
  body.itemid-107 .it24-hero h1,
  body.itemid-105 .it24-hero h1{
    font-size:clamp(2.15rem,9vw,2.75rem)!important;
  }

  body.itemid-107 .it24-hero__orb,
  body.itemid-105 .it24-hero__orb{
    height:205px!important;
    padding:10px!important;
  }
}


/*
 * IT24 hero compact arrows v4.11
 */

/* Home hero: reduce overall height and keep a balanced two-column layout. */
body.itemid-107 .it24-hero,
body.itemid-105 .it24-hero{
  padding:36px 44px!important;
  min-height:auto!important;
}

body.itemid-107 .it24-hero__inner,
body.itemid-105 .it24-hero__inner{
  align-items:center!important;
  gap:clamp(1.25rem,2vw,2.5rem)!important;
}

body.itemid-107 .it24-hero h1,
body.itemid-105 .it24-hero h1{
  font-size:clamp(2.5rem,3vw,3.15rem)!important;
  line-height:1.02!important;
  letter-spacing:-.035em!important;
  max-width:540px!important;
  margin:0 0 .85rem!important;
}

body.itemid-107 .it24-hero p,
body.itemid-105 .it24-hero p{
  max-width:31rem!important;
  margin:0 0 1rem!important;
}

body.itemid-107 .it24-hero__visual,
body.itemid-105 .it24-hero__visual{
  min-height:0!important;
  align-self:center!important;
}

body.itemid-107 .it24-hero__orb,
body.itemid-105 .it24-hero__orb{
  width:100%!important;
  max-width:414px!important;
  height:244px!important;
  padding:16px!important;
  border-radius:28px!important;
  border:1px solid rgba(255,255,255,.12)!important;
  background:
    radial-gradient(circle at 50% 18%,rgba(70,183,255,.16),transparent 42%),
    linear-gradient(135deg,rgba(255,255,255,.055),rgba(255,255,255,.018))!important;
  overflow:hidden!important;
}

body.itemid-107 .it24-hero__orb img,
body.itemid-105 .it24-hero__orb img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  object-fit:contain!important;
  margin:0!important;
  padding:0!important;
  transform:none!important;
  filter:none!important;
  opacity:1!important;
}

@media (max-width:1000px){
  body.itemid-107 .it24-hero,
  body.itemid-105 .it24-hero{
    padding:32px 28px!important;
  }

  body.itemid-107 .it24-hero h1,
  body.itemid-105 .it24-hero h1{
    font-size:clamp(2.25rem,5vw,2.85rem)!important;
    max-width:520px!important;
  }

  body.itemid-107 .it24-hero__orb,
  body.itemid-105 .it24-hero__orb{
    max-width:380px!important;
    height:224px!important;
  }
}

@media (max-width:640px){
  body.itemid-107 .it24-hero,
  body.itemid-105 .it24-hero{
    padding:24px 20px!important;
  }

  body.itemid-107 .it24-hero h1,
  body.itemid-105 .it24-hero h1{
    font-size:clamp(2rem,8vw,2.45rem)!important;
  }

  body.itemid-107 .it24-hero__orb,
  body.itemid-105 .it24-hero__orb{
    height:195px!important;
    padding:10px!important;
  }
}


/*
 * IT24 hero compact spacing v4.12
 */

/* Home hero: make the blue block ~20%% shorter by trimming top/bottom spacing. */
body.itemid-107 .it24-hero,
body.itemid-105 .it24-hero{
  padding:24px 44px!important;
  min-height:auto!important;
}

body.itemid-107 .it24-hero__inner,
body.itemid-105 .it24-hero__inner{
  align-items:center!important;
  gap:clamp(1rem,1.8vw,2rem)!important;
}

body.itemid-107 .it24-hero h1,
body.itemid-105 .it24-hero h1{
  margin:0 0 .6rem!important;
}

body.itemid-107 .it24-hero p,
body.itemid-105 .it24-hero p{
  margin:0 0 .75rem!important;
}

body.itemid-107 .it24-btns,
body.itemid-105 .it24-btns{
  margin-top:.1rem!important;
}

body.itemid-107 .it24-hero__visual,
body.itemid-105 .it24-hero__visual{
  min-height:0!important;
  align-self:center!important;
}

body.itemid-107 .it24-hero__orb,
body.itemid-105 .it24-hero__orb{
  width:100%!important;
  max-width:414px!important;
  height:220px!important;
  padding:14px!important;
  border-radius:28px!important;
}

body.itemid-107 .it24-hero__orb img,
body.itemid-105 .it24-hero__orb img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  object-fit:contain!important;
  margin:0!important;
  padding:0!important;
}

@media (max-width:1000px){
  body.itemid-107 .it24-hero,
  body.itemid-105 .it24-hero{
    padding:20px 28px!important;
  }

  body.itemid-107 .it24-hero__inner,
  body.itemid-105 .it24-hero__inner{
    gap:1rem!important;
  }

  body.itemid-107 .it24-hero__orb,
  body.itemid-105 .it24-hero__orb{
    max-width:380px!important;
    height:204px!important;
    padding:12px!important;
  }
}

@media (max-width:640px){
  body.itemid-107 .it24-hero,
  body.itemid-105 .it24-hero{
    padding:16px 20px!important;
  }

  body.itemid-107 .it24-hero__orb,
  body.itemid-105 .it24-hero__orb{
    height:176px!important;
    padding:10px!important;
  }
}


/*
 * IT24 hero vertical spacing fix v4.13
 *
 * Root cause found in an old CSS layer:
 * .it24-hero__inner had padding-top:4.25rem and padding-bottom:4.1rem !important.
 * This override removes that legacy vertical padding.
 */

body.itemid-107 .it24-hero,
body.itemid-105 .it24-hero{
  padding-top:0!important;
  padding-bottom:0!important;
  min-height:0!important;
}

body.itemid-107 .it24-hero__inner,
body.itemid-105 .it24-hero__inner{
  padding-top:1.75rem!important;
  padding-bottom:1.75rem!important;
  padding-left:3rem!important;
  padding-right:3rem!important;
  min-height:0!important;
  align-items:center!important;
}

body.itemid-107 .it24-hero__visual,
body.itemid-105 .it24-hero__visual{
  min-height:0!important;
}

body.itemid-107 .it24-hero__orb,
body.itemid-105 .it24-hero__orb{
  height:220px!important;
}

body.itemid-107 .it24-hero h1,
body.itemid-105 .it24-hero h1{
  margin-top:0!important;
  margin-bottom:.55rem!important;
}

body.itemid-107 .it24-hero p,
body.itemid-105 .it24-hero p{
  margin-top:0!important;
  margin-bottom:.75rem!important;
}

body.itemid-107 .it24-btns,
body.itemid-105 .it24-btns{
  margin-top:0!important;
  margin-bottom:0!important;
}

@media (max-width:1000px){
  body.itemid-107 .it24-hero__inner,
  body.itemid-105 .it24-hero__inner{
    padding-top:1.4rem!important;
    padding-bottom:1.4rem!important;
    padding-left:1.75rem!important;
    padding-right:1.75rem!important;
  }
}

@media (max-width:640px){
  body.itemid-107 .it24-hero__inner,
  body.itemid-105 .it24-hero__inner{
    padding-top:1rem!important;
    padding-bottom:1rem!important;
    padding-left:1rem!important;
    padding-right:1rem!important;
  }
}