
:root{
 --bg:#070914;--surface:#0f1425;--surface2:#151b30;--text:#f7f9ff;--muted:#9aa5bd;
 --border:rgba(255,255,255,.09);--nav:rgba(7,9,20,.86);
 --grad:linear-gradient(120deg,#19d7ff 0%,#1478ff 52%,#7928ff 100%);
 --shadow:0 24px 70px rgba(0,0,0,.28);--max:1180px
}
body.light{--bg:#f7f8fc;--surface:#fff;--surface2:#eef2f8;--text:#111525;--muted:#687188;
 --border:rgba(15,20,40,.10);--nav:rgba(247,248,252,.91);--shadow:0 24px 60px rgba(30,40,80,.10)}
*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}
body{min-height:100vh;font-family:Inter,"Segoe UI",Arial,sans-serif;background:var(--bg);color:var(--text);transition:.25s}
a{color:inherit}.container{width:min(var(--max),88%);margin:auto}
.navbar{height:78px;position:sticky;top:0;z-index:100;background:var(--nav);backdrop-filter:blur(18px);border-bottom:1px solid var(--border)}
.nav-inner{height:100%;width:min(var(--max),90%);margin:auto;display:flex;align-items:center;justify-content:space-between;gap:18px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}.brand img{width:46px;height:46px;object-fit:contain}
.brand-name{font-size:24px;font-weight:850;letter-spacing:-1px}.brand-name .core-word{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.nav-links{display:flex;gap:28px;align-items:center}.nav-links a{text-decoration:none;color:var(--muted);font-size:14px;font-weight:550;position:relative}
.nav-links a:hover,.nav-links a.active{color:var(--text)}.nav-links a.active:after{content:"";position:absolute;left:0;right:0;bottom:-12px;height:2px;border-radius:2px;background:var(--grad)}
.actions{display:flex;gap:10px;align-items:center}.theme,.menu{width:42px;height:42px;border:1px solid var(--border);border-radius:10px;background:var(--surface);color:var(--text);cursor:pointer}.menu{display:none}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 21px;border-radius:10px;text-decoration:none;font-size:14px;font-weight:700;border:1px solid var(--border);cursor:pointer}
.primary{background:var(--grad);border:0;color:#fff}.secondary{background:var(--surface)}
.hero{min-height:calc(100vh - 78px);display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:60px;width:min(var(--max),88%);margin:auto;padding:70px 0}
.badge,.eyebrow{color:var(--muted);font-size:12px;letter-spacing:1.5px;text-transform:uppercase}.eyebrow{display:block;margin-bottom:16px;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:800}
.hero h1,.page-hero h1{font-size:clamp(52px,7vw,88px);line-height:.98;letter-spacing:-4px;margin:22px 0}.gradient{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.desc{color:var(--muted);line-height:1.75;font-size:17px;max-width:700px}.hero-buttons{display:flex;gap:12px;margin-top:30px;flex-wrap:wrap}
.visual{min-height:470px;display:grid;place-items:center}.orbit{width:430px;height:430px;border:1px solid var(--border);border-radius:50%;display:grid;place-items:center;position:relative}
.orbit:before,.orbit:after{content:"";position:absolute;border:1px solid var(--border);border-radius:50%}.orbit:before{inset:65px}.orbit:after{inset:130px}
.hero-logo{width:205px;height:205px;object-fit:contain;position:relative;z-index:2;filter:drop-shadow(0 25px 40px rgba(35,90,255,.28))}
.page-hero{min-height:430px;display:flex;align-items:center;border-bottom:1px solid var(--border)}.page-hero>div{width:min(var(--max),88%);margin:auto}
.section{padding:95px 0}.section-head{max-width:760px;margin-bottom:45px}.title{font-size:clamp(38px,5vw,58px);letter-spacing:-2px;margin-bottom:15px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:28px;min-height:230px;transition:.2s}.card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.icon{width:52px;height:52px;border-radius:14px;background:var(--surface2);display:grid;place-items:center;font-size:23px;margin-bottom:22px}.card h3{margin-bottom:10px}.card p{color:var(--muted);line-height:1.65;font-size:14px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:20px}.cta{text-align:center;padding:100px 0;border-top:1px solid var(--border)}.cta h2{font-size:clamp(40px,6vw,65px);letter-spacing:-3px;margin-bottom:18px}.cta .desc{margin:0 auto 28px}
.contact{display:grid;grid-template-columns:.85fr 1.15fr;gap:60px}.form{background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:30px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.full{grid-column:1/-1}
label{display:block;color:var(--muted);font-size:12px;margin-bottom:7px}.control{width:100%;padding:13px;border:1px solid var(--border);border-radius:10px;background:var(--bg);color:var(--text)}textarea.control{min-height:130px}
.footer{border-top:1px solid var(--border);padding:30px 0;color:var(--muted);font-size:12px}.footer-row{display:flex;align-items:center;justify-content:space-between;gap:20px}.footer-brand{display:flex;align-items:center;gap:9px}.footer-brand img{width:34px;height:34px;object-fit:contain}
.socials{display:flex;align-items:center;gap:10px}.social{width:38px;height:38px;display:grid;place-items:center;border-radius:10px;border:1px solid var(--border);background:var(--surface);text-decoration:none;color:var(--text);font-weight:800;font-size:13px;transition:.2s}.social:hover{transform:translateY(-2px);border-color:rgba(80,100,255,.45)}
.whatsapp-float{position:fixed;right:24px;bottom:24px;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;text-decoration:none;background:#25D366;color:white;font-weight:900;font-size:15px;box-shadow:0 15px 40px rgba(0,0,0,.3);z-index:90}
@media(max-width:850px){.nav-links{display:none;position:absolute;top:78px;left:5%;right:5%;background:var(--surface);border:1px solid var(--border);padding:22px;border-radius:14px;flex-direction:column;align-items:flex-start}.nav-links.open{display:flex}.menu{display:block}.actions .primary{display:none}.hero{grid-template-columns:1fr;text-align:center}.hero .desc{margin:auto}.hero-buttons{justify-content:center}.visual{display:none}.grid{grid-template-columns:repeat(2,1fr)}.two,.contact{grid-template-columns:1fr}}
@media(max-width:560px){.grid,.form-grid{grid-template-columns:1fr}.full{grid-column:auto}.brand-name{font-size:20px}.brand img{width:38px;height:38px}.section{padding:70px 0}.footer-row{flex-direction:column;text-align:center}.whatsapp-float{right:16px;bottom:16px}}


/* ===== AnnCore capability orbit ===== */
.orbit-system{
  position:relative;
  width:470px;
  height:470px;
  border:0;
  isolation:isolate;
}
.orbit-system:before,.orbit-system:after{display:none}
.orbit-ring{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  border:2px solid var(--border);border-radius:50%;pointer-events:none;
}
.ring-1{width:190px;height:190px}
.ring-2{width:330px;height:330px}
.ring-3{width:465px;height:465px}
.orbit-system .hero-logo{width:190px;height:190px;z-index:4}
.orbit-badge{
  position:absolute;z-index:8;display:flex;align-items:center;gap:7px;
  padding:9px 13px;border-radius:999px;border:1px solid var(--border);
  background:color-mix(in srgb,var(--surface) 88%,transparent);
  color:var(--text);font-size:12px;font-weight:700;white-space:nowrap;
  box-shadow:0 12px 35px rgba(0,0,0,.14);backdrop-filter:blur(12px);
  animation:orbitFloat 4.8s ease-in-out infinite;
}
.orbit-badge span{font-size:13px}
.badge-secure{left:16px;top:95px}
.badge-cloud{right:-2px;top:88px;animation-delay:-1s}
.badge-prem{right:-20px;bottom:105px;animation-delay:-2s}
.badge-api{left:12px;bottom:92px;animation-delay:-3s}
.badge-modular{left:174px;top:-2px;animation-delay:-1.6s}
.badge-scale{left:185px;bottom:-3px;animation-delay:-3.6s}
@keyframes orbitFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-7px)}
}
body.light .orbit-badge{box-shadow:0 12px 32px rgba(35,50,90,.10)}
@media(max-width:1000px){
 .orbit-system{transform:scale(.88)}
}
@media(max-width:850px){
 .orbit-system{display:none}
}
@media(prefers-reduced-motion:reduce){
 .orbit-badge{animation:none}
}


/* ===== V5: stronger floating motion + AnnCore-colored capability icons ===== */
.orbit-badge{
  animation-duration:4.8s;
}
.orbit-badge span{
  width:24px;
  height:24px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:7px;
  font-size:14px;
  font-weight:900;
  color:#ffffff;
  background:linear-gradient(135deg,#19d7ff 0%,#1478ff 55%,#7928ff 100%);
  box-shadow:0 5px 15px rgba(20,120,255,.28);
}

/* Larger, smoother travel distance */
@keyframes orbitFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-16px)}
}

/* Give alternate badges a slightly different movement so it feels organic */
.badge-cloud,.badge-api,.badge-scale{
  animation-name:orbitFloatAlt;
}
@keyframes orbitFloatAlt{
  0%,100%{transform:translateY(5px)}
  50%{transform:translateY(-13px)}
}

body.light .orbit-badge span{
  box-shadow:0 5px 14px rgba(20,90,220,.20);
}


/* ===== V6: extended navigation, bilingual UI, contact info, social media ===== */
.nav-links{gap:19px}
.nav-links a{font-size:13px}
.lang-switch{
  min-width:46px;height:42px;padding:0 10px;border:1px solid var(--border);
  border-radius:10px;background:var(--surface);color:var(--text);cursor:pointer;
  font-weight:800;text-decoration:none;display:inline-flex;align-items:center;justify-content:center
}
.info-strip{border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:var(--surface)}
.info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px}
.info-item{display:flex;align-items:center;gap:14px;padding:24px 18px}
.info-icon{width:42px;height:42px;flex:0 0 42px;border-radius:12px;display:grid;place-items:center;color:#fff;background:var(--grad);font-size:18px}
.info-item small{display:block;color:var(--muted);margin-bottom:4px}.info-item strong{font-size:14px}
.social svg{width:17px;height:17px;fill:currentColor}
.social-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
.news-meta{font-size:12px;color:var(--muted);margin-bottom:10px}
.partner-placeholder{font-weight:850;font-size:18px;letter-spacing:-.5px}
.job-tag{display:inline-flex;padding:6px 9px;border:1px solid var(--border);border-radius:999px;color:var(--muted);font-size:11px;margin-top:14px}
[dir="rtl"] body{text-align:right}
[dir="rtl"] .brand,[dir="rtl"] .footer-brand,[dir="rtl"] .info-item{direction:rtl}
[dir="rtl"] .nav-inner,[dir="rtl"] .footer-row{direction:rtl}
[dir="rtl"] .hero-buttons{justify-content:flex-start}
@media(max-width:1080px){.nav-links{gap:13px}.nav-links a{font-size:12px}.actions .primary{display:none}}
@media(max-width:850px){.info-grid{grid-template-columns:1fr}.info-item{border-bottom:1px solid var(--border)}[dir="rtl"] .nav-links{align-items:flex-end}}
@media(max-width:560px){.lang-switch{min-width:40px;padding:0 8px}}

/* ===== V4.1 Responsive Layer â€” preserves AnnCore V4 visual identity ===== */
html,body{max-width:100%;overflow-x:hidden}
img,svg,video{max-width:100%}

@media(max-width:1080px){
  .container,.hero,.page-hero>div{width:min(94%,var(--max))}
  .nav-inner{width:94%}
  .hero{gap:28px}
  .orbit-system{transform:scale(.78)}
}

@media(max-width:850px){
  .navbar{height:68px}
  .nav-inner{width:94%;gap:8px;position:relative}
  .brand{min-width:0}.brand img{width:40px;height:40px}.brand-name{font-size:21px}
  .actions{gap:6px}.theme,.menu,.lang-switch{height:40px;min-width:40px}
  .menu{display:inline-grid;place-items:center;font-size:20px}
  .nav-links{display:none;position:fixed;top:76px;left:3%;right:3%;max-height:calc(100dvh - 92px);overflow-y:auto;background:color-mix(in srgb,var(--surface) 96%,transparent);border:1px solid var(--border);padding:12px;border-radius:18px;flex-direction:column;align-items:stretch!important;gap:4px!important;box-shadow:var(--shadow);backdrop-filter:blur(22px)}
  .nav-links.open{display:flex}
  .nav-links a{font-size:15px!important;padding:13px 14px;border-radius:10px;color:var(--text)}
  .nav-links a:hover,.nav-links a.active{background:var(--surface2)}
  .nav-links a.active:after{display:none}
  .actions .primary{display:none}

  .hero{min-height:auto;grid-template-columns:1fr;text-align:center;padding:58px 0 52px;gap:20px}
  .hero h1,.page-hero h1{font-size:clamp(44px,12vw,66px);letter-spacing:-2.5px;margin:18px 0}
  .hero .desc{margin-inline:auto;font-size:16px}.hero-buttons{justify-content:center}
  .visual{display:grid;min-height:360px;margin-top:6px}
  .orbit-system{display:block;width:420px;height:420px;transform:scale(.76);transform-origin:center}
  .page-hero{min-height:340px;text-align:center}.page-hero .desc{margin-inline:auto}
  .section{padding:70px 0}.section-head{text-align:center;margin:0 auto 34px}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.two,.contact{grid-template-columns:1fr}
  .info-grid{grid-template-columns:1fr}.info-item{border-bottom:1px solid var(--border)}
  .footer-row{flex-direction:column;text-align:center}.socials{justify-content:center;flex-wrap:wrap}
  [dir="rtl"] .hero-buttons{justify-content:center}
}

@media(max-width:560px){
  .container,.hero,.page-hero>div{width:92%}
  .navbar{height:64px}.nav-links{top:70px}
  .brand img{width:36px!important;height:36px!important;max-width:36px!important;object-fit:contain}.brand-name{font-size:19px}
  .theme,.menu,.lang-switch{height:38px;min-width:38px}.lang-switch{padding:0 7px;font-size:12px}
  .hero{padding:42px 0 36px}.hero h1,.page-hero h1{font-size:clamp(39px,13vw,54px);line-height:1.01;letter-spacing:-2px}.badge{font-size:10px}.desc{font-size:15px;line-height:1.65}
  .hero-buttons{display:grid;grid-template-columns:1fr;width:100%;gap:9px}.hero-buttons .btn{width:100%}
  .visual{min-height:300px;margin-top:-8px}
  .orbit-system{width:390px;height:390px;transform:scale(.64)}
  .section{padding:56px 0}.title{font-size:clamp(32px,10vw,44px);letter-spacing:-1.5px}.grid,.form-grid{grid-template-columns:1fr}.card{min-height:0;padding:22px}.full{grid-column:auto}
  .cta{padding:64px 0}.cta h2{font-size:38px;letter-spacing:-1.5px}
  .form{padding:20px}.info-item{padding:18px 4px}.info-icon{width:38px;height:38px;flex-basis:38px}
  .footer{padding:24px 0}.footer-brand{flex-direction:column}.social{width:40px;height:40px}
  .whatsapp-float{right:14px;bottom:14px;width:52px;height:52px}
}

@media(max-width:390px){
  .brand-name{font-size:17px}.brand{gap:6px}.brand img{width:33px;height:33px}
  .actions{gap:4px}.theme,.menu,.lang-switch{width:36px;min-width:36px;height:36px}
  .hero h1{font-size:40px}.visual{min-height:270px}.orbit-system{transform:scale(.57)}
}

/* V4.3 Corporate CMS */
.cms-card{position:relative;display:flex;flex-direction:column;gap:12px}.cms-card .btn{align-self:flex-start;margin-top:auto}.cms-status{display:inline-flex;width:max-content;padding:5px 9px;border:1px solid var(--border);border-radius:999px;font-size:12px;opacity:.85}.cms-features{margin:0;padding-left:20px;display:grid;gap:6px;color:var(--muted)}[dir="rtl"] .cms-features{padding-left:0;padding-right:20px}.cms-band{padding:28px;border:1px solid var(--border);border-radius:24px;background:linear-gradient(135deg,rgba(100,90,255,.08),rgba(0,180,255,.04));margin-top:24px}.cms-band h3{margin-top:0}.cms-split{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.cms-split .card{height:100%}@media(max-width:760px){.cms-split{grid-template-columns:1fr}}

/* V4.3.1 product grid consistency */
[data-cms-list="products"].grid,[data-cms-list="services"].grid{grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch}
[data-cms-list="products"] .cms-card,[data-cms-list="services"] .cms-card{min-width:0;height:100%}
@media(max-width:850px){[data-cms-list="products"].grid,[data-cms-list="services"].grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){[data-cms-list="products"].grid,[data-cms-list="services"].grid{grid-template-columns:1fr}}

/* ===== V4.3.1 FINAL PRODUCT GRID FIX ===== */

[data-cms-list="products"],
[data-cms-list="services"]{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:20px !important;
    align-items:stretch !important;
}

[data-cms-list="products"] .cms-card,
[data-cms-list="services"] .cms-card{
    width:100% !important;
    min-width:0 !important;
    height:100% !important;

    display:flex !important;
    flex-direction:column !important;
}

.cms-card .cms-features{
    margin-bottom:20px;
}

.cms-card .btn{
    margin-top:auto;
}

@media(max-width:1000px){

    [data-cms-list="products"],
    [data-cms-list="services"]{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    }
}

@media(max-width:640px){

    [data-cms-list="products"],
    [data-cms-list="services"]{
        grid-template-columns:1fr !important;
    }
}


/* ===== V4.4 CORPORATE CMS ===== */

[data-cms-list="products"],
[data-cms-list="services"],
[data-cms-list="entities"]{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:22px;
    align-items:stretch;
}

.cms-card{
    display:flex;
    flex-direction:column;
    height:100%;
    min-width:0;
}

.cms-card h3{
    margin-top:12px;
}

.cms-card p{
    line-height:1.7;
}

/* same tight check-mark list as the deployment cards (.compare-col) */
.cms-features,
[dir="rtl"] .cms-features{
    list-style:none;
    margin:6px 0 20px;
    padding:0;
    display:grid;
    gap:9px;
}

.cms-features li{
    display:flex;
    gap:10px;
    margin:0;
    line-height:1.5;
    color:var(--text);
}

.cms-features li:before{
    content:"✓";
    flex:0 0 20px;
    height:20px;
    border-radius:6px;
    display:grid;
    place-items:center;
    font-size:12px;
    font-weight:900;
    color:#fff;
    background:var(--grad);
}

.cms-card-cta{
    margin-top:auto;
    align-self:flex-start;
}

.cms-entity-logo{
    display:block;
    width:auto;
    max-width:160px;
    height:64px;
    object-fit:contain;
    margin-bottom:16px;
}

html[dir="rtl"] .cms-card-cta{
    align-self:flex-start;
}

@media(max-width:1000px){
    [data-cms-list="products"],
    [data-cms-list="services"],
    [data-cms-list="entities"]{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media(max-width:650px){
    [data-cms-list="products"],
    [data-cms-list="services"],
    [data-cms-list="entities"]{
        grid-template-columns:1fr;
    }
}

/* ===== V4.4 DEAD LINK GUARD ===== */
.social[href="#"],
.whatsapp-float[href="#"]{
  display:none;
}

/* ===== ANNCORE V4.17 ENTERPRISE FOOTER ===== */

.anncore-enterprise-footer{
    width:min(1180px,92%);
    margin:0 auto;
    padding:58px 0 24px;
}

.anncore-footer-grid{
    display:grid;
    grid-template-columns:1.6fr 1fr 1.25fr 1fr 1.35fr;
    gap:34px;
}

.anncore-footer-grid h4{
    margin:0 0 16px;
    font-size:14px;
}

.anncore-footer-grid > div:not(.anncore-footer-brand){
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:10px;
}

.anncore-footer-grid a,
.anncore-footer-grid span{
    font-size:13px;
    line-height:1.6;
}

.anncore-footer-grid a{
    color:var(--muted);
    text-decoration:none;
}

.anncore-footer-grid a:hover{
    color:var(--text);
}

.anncore-footer-brand p{
    color:var(--muted);
    line-height:1.7;
    max-width:330px;
    font-size:14px;
}

.anncore-footer-social{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:18px;
}

.anncore-footer-disabled{
    color:var(--muted);
    opacity:.55;
    cursor:default;
}

.anncore-footer-bottom{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
    margin-top:42px;
    padding-top:22px;
    border-top:1px solid var(--border);
    color:var(--muted);
    font-size:12px;
}

.anncore-footer-bottom > div{
    display:flex;
    gap:18px;
}

html[dir="rtl"]
.anncore-footer-grid > div:not(.anncore-footer-brand){
    align-items:flex-start;
}

@media(max-width:1000px){

    .anncore-footer-grid{
        grid-template-columns:2fr 1fr 1fr;
    }

}

@media(max-width:700px){

    .anncore-enterprise-footer{
        padding-top:42px;
    }

    .anncore-footer-grid{
        grid-template-columns:1fr 1fr;
        gap:30px 22px;
    }

    .anncore-footer-brand{
        grid-column:1/-1;
    }

    .anncore-footer-bottom{
        flex-direction:column;
        align-items:flex-start;
    }

}

@media(max-width:430px){

    .anncore-footer-grid{
        grid-template-columns:1fr;
    }

    .anncore-footer-brand{
        grid-column:auto;
    }

}

/* ===== END ANNCORE V4.17 ENTERPRISE FOOTER ===== */

/* =========================================================
   V5: styles previously injected at runtime by jsmain.js.
   Moved here unchanged (same order) so pages render without a
   flash and without script-generated <style> tags.
   ========================================================= */

/* ----- moved from jsmain.js: social icon centering ----- */
    /* Footer social buttons */
    .social{
      width:40px !important;
      height:40px !important;
      min-width:40px !important;
      min-height:40px !important;

      display:inline-flex !important;
      align-items:center !important;
      justify-content:center !important;

      padding:0 !important;
      margin:0 !important;

      line-height:1 !important;
      text-align:center !important;
      vertical-align:middle !important;

      box-sizing:border-box !important;
    }

    /* Center everything inside the square */
    .social > *,
    .social svg,
    .social i,
    .social span{
      display:flex !important;
      align-items:center !important;
      justify-content:center !important;

      margin:0 !important;
      padding:0 !important;

      line-height:1 !important;
      vertical-align:middle !important;
    }

    /* SVG icons */
    .social svg{
      width:17px !important;
      height:17px !important;
      flex:0 0 17px !important;
    }

    /* Font/text based icons */
    .social i,
    .social span{
      width:18px !important;
      height:18px !important;
      font-size:17px !important;
    }

    /* Disabled placeholders stay perfectly centered */
    .social-disabled,
    .social[aria-disabled="true"]{
      display:inline-flex !important;
      align-items:center !important;
      justify-content:center !important;
    }

    /* Footer group alignment */
    .socials,
    .social-links,
    .footer-socials,
    .footer-social-links{
      display:flex !important;
      align-items:center !important;
      gap:10px !important;
    }

/* ----- moved from jsmain.js: social placeholder ----- */
    .social-disabled,
    .social[aria-disabled="true"]{
      display:inline-flex !important;
      opacity:.45 !important;
      cursor:default !important;
      pointer-events:none !important;
    }

    .social[href]{
      display:inline-flex !important;
      opacity:1 !important;
      pointer-events:auto !important;
      cursor:pointer !important;
    }

/* ----- moved from jsmain.js: news cards V4.9 ----- */
 [data-news-list]{
   align-items:stretch;
 }

 .news-card{
   overflow:hidden;
   display:flex;
   flex-direction:column;
   height:100%;
 }

 .news-card-body{
   display:flex;
   flex-direction:column;
   flex:1;
 }

 .news-image{
   width:100%;
   aspect-ratio:16/9;
   overflow:hidden;
   border-radius:14px;
   margin-bottom:16px;
   background:rgba(127,127,127,.08);
 }

 .news-image img{
   width:100%;
   height:100%;
   object-fit:cover;
   display:block;
 }

 .news-meta{
   display:flex;
   align-items:center;
   justify-content:space-between;
   gap:10px;
   flex-wrap:wrap;
   margin-bottom:10px;
   font-size:12px;
   font-weight:750;
   letter-spacing:.04em;
 }

 .news-category{
   text-transform:uppercase;
 }

 .news-date{
   opacity:.7;
   font-weight:600;
   letter-spacing:0;
 }

 .news-card h3{
   margin-top:0;
 }

 .news-card.featured{
   position:relative;
 }

 .news-empty{
   text-align:center;
   padding:30px 10px;
 }

 @media(max-width:700px){
   .news-meta{
     align-items:flex-start;
     flex-direction:column;
   }
 }

/* ----- moved from jsmain.js: public responsive polish V4.13 ----- */

/* ---------------------------------------------------------
   HERO GRADIENT TEXT — DESCENDER / CLIPPING FIX
--------------------------------------------------------- */

.hero-gradient-text{
    display:inline-block !important;

    /*
      Extra bottom space prevents gradient text glyphs
      from being clipped by line boxes.
    */
    line-height:1.08 !important;
    padding-bottom:.10em !important;
    margin-bottom:-.10em !important;

    -webkit-box-decoration-break:clone;
    box-decoration-break:clone;
}


/* ---------------------------------------------------------
   DESKTOP SAFETY
--------------------------------------------------------- */

html,
body{
    max-width:100%;
    overflow-x:hidden;
}

img,
svg{
    max-width:100%;
}

.hero-copy,
.visual{
    min-width:0;
}


/* ---------------------------------------------------------
   TABLET
--------------------------------------------------------- */

@media(max-width:1000px){

    .container{
        width:min(92%,100%) !important;
    }

    .hero{
        min-height:auto !important;
    }

    .hero-grid{
        grid-template-columns:1fr !important;
        gap:42px !important;
        padding-top:58px !important;
        padding-bottom:58px !important;
    }

    .hero-copy{
        max-width:760px;
        margin-inline:auto;
        text-align:center;
    }

    .hero-copy .eyebrow{
        justify-content:center;
    }

    .hero-copy p{
        margin-left:auto;
        margin-right:auto;
    }

    .hero-buttons{
        justify-content:center;
    }

    .visual{
        width:min(620px,100%);
        margin-inline:auto;
        min-height:440px;
    }

    .hero-title{
        font-size:clamp(54px,8vw,78px) !important;
        line-height:.98 !important;
    }

    header .container,
    .nav-wrap{
        min-width:0;
    }
}


/* ---------------------------------------------------------
   MOBILE
--------------------------------------------------------- */

@media(max-width:700px){

    .container{
        width:calc(100% - 32px) !important;
    }

    .hero-grid{
        padding-top:38px !important;
        padding-bottom:42px !important;
        gap:30px !important;
    }

    .hero-title{
        font-size:clamp(42px,13vw,62px) !important;
        line-height:.98 !important;
        letter-spacing:-.045em !important;
    }

    .hero-gradient-text{
        line-height:1.10 !important;
        padding-bottom:.12em !important;
        margin-bottom:-.12em !important;
    }

    .hero-copy p{
        font-size:16px !important;
        line-height:1.7 !important;
    }

    .hero-buttons{
        display:grid !important;
        grid-template-columns:1fr !important;
        width:100%;
        gap:10px !important;
    }

    .hero-buttons .btn,
    .hero-buttons a{
        width:100%;
        justify-content:center;
        text-align:center;
        min-height:48px;
    }

    .visual{
        min-height:330px !important;
        transform:none !important;
    }

    .section{
        padding-top:58px !important;
        padding-bottom:58px !important;
    }

    .section-head h2,
    .page-hero h1{
        font-size:clamp(34px,10vw,48px) !important;
        line-height:1.05 !important;
    }

    .section-head p,
    .page-hero p{
        font-size:15px !important;
        line-height:1.7 !important;
    }

    .grid,
    .cards,
    .solutions-grid,
    .services-grid,
    .platform-grid,
    .entities-grid,
    [data-cms-list],
    [data-news-list]{
        grid-template-columns:1fr !important;
    }

    .card{
        min-width:0;
    }

    footer .container{
        min-width:0;
    }

    .social{
        flex:0 0 40px !important;
    }

    .whatsapp-float{
        right:16px !important;
        bottom:16px !important;
    }
}


/* ---------------------------------------------------------
   SMALL MOBILE
--------------------------------------------------------- */

@media(max-width:420px){

    .container{
        width:calc(100% - 24px) !important;
    }

    .hero-title{
        font-size:clamp(38px,12.5vw,52px) !important;
    }

    .hero-grid{
        padding-top:30px !important;
    }

    .visual{
        min-height:285px !important;
    }

    .page-hero{
        padding-top:48px !important;
        padding-bottom:48px !important;
    }
}


/* ----- moved from jsmain.js: consolidated portrait layer V4.13.3/V4.13.5 ----- */

/* =========================================================
   ANNCORE PORTRAIT MOBILE — SINGLE FINAL LAYER
   ========================================================= */

@media (max-width:700px) and (orientation:portrait){

    html,
    body{
        width:100% !important;
        max-width:100% !important;
        min-width:0 !important;
        overflow-x:hidden !important;
    }

    *,
    *::before,
    *::after{
        box-sizing:border-box;
    }


    /* =========================
       GLOBAL CONTAINER
       ========================= */

    .container{
        width:100% !important;
        max-width:100% !important;

        padding-left:18px !important;
        padding-right:18px !important;

        margin-left:auto !important;
        margin-right:auto !important;
    }


    /* =========================
       HEADER
       ========================= */

    header{
        width:100% !important;
        max-width:100% !important;
    }

    header .container,
    .nav-wrap{
        width:100% !important;
        max-width:100% !important;
        min-width:0 !important;

        padding-left:14px !important;
        padding-right:14px !important;
    }

    .brand,
    .logo{
        min-width:0 !important;
        max-width:150px !important;
    }

    .brand img,
    .logo img{
        display:block;
        width:auto;
        max-width:145px !important;
        height:auto !important;
    }


    /* =========================
       HERO
       ========================= */

    .hero{
        width:100% !important;
        max-width:100% !important;

        min-height:auto !important;

        overflow:hidden !important;
    }

    .hero .container{
        width:100% !important;
        max-width:100% !important;

        padding-left:18px !important;
        padding-right:18px !important;
    }

    .hero-grid{
        display:grid !important;
        grid-template-columns:minmax(0,1fr) !important;

        width:100% !important;
        max-width:100% !important;
        min-width:0 !important;

        gap:28px !important;

        margin:0 !important;

        padding:
            36px
            0
            42px !important;
    }


    /* =========================
       HERO COPY
       ========================= */

    .hero-copy{
        width:100% !important;
        max-width:100% !important;
        min-width:0 !important;

        margin:0 auto !important;

        text-align:center !important;

        overflow:visible !important;
    }

    .hero-copy .eyebrow{
        width:100% !important;
        max-width:100% !important;

        justify-content:center !important;

        white-space:normal !important;
        overflow-wrap:break-word !important;

        text-align:center !important;
    }

    .hero-title{
        width:100% !important;
        max-width:100% !important;

        margin-left:auto !important;
        margin-right:auto !important;

        font-size:clamp(40px,12vw,54px) !important;
        line-height:1.02 !important;
        letter-spacing:-.04em !important;

        text-align:center !important;

        overflow:visible !important;
        word-break:normal !important;
    }

    .hero-gradient-text{
        display:inline-block !important;

        line-height:1.12 !important;

        padding:
            .02em
            .04em
            .13em !important;

        margin:
            -.02em
            -.04em
            -.10em !important;

        overflow:visible !important;
    }

    .hero-copy p{
        display:block !important;

        width:100% !important;
        max-width:520px !important;

        margin-left:auto !important;
        margin-right:auto !important;

        padding-left:0 !important;
        padding-right:0 !important;

        font-size:15px !important;
        line-height:1.7 !important;

        text-align:center !important;

        white-space:normal !important;
        overflow-wrap:break-word !important;
        word-break:normal !important;

        overflow:visible !important;
    }


    /* =========================
       HERO BUTTONS
       ========================= */

    .hero-buttons{
        display:grid !important;
        grid-template-columns:minmax(0,1fr) !important;

        width:100% !important;
        max-width:420px !important;

        margin-left:auto !important;
        margin-right:auto !important;

        padding:0 !important;

        gap:10px !important;
    }

    .hero-buttons > *,
    .hero-buttons .btn,
    .hero-buttons a,
    .hero-buttons button{
        width:100% !important;
        max-width:100% !important;
        min-width:0 !important;

        min-height:48px !important;

        margin:0 !important;

        padding-left:16px !important;
        padding-right:16px !important;

        display:flex !important;
        align-items:center !important;
        justify-content:center !important;

        text-align:center !important;
        white-space:normal !important;
    }


    /* =========================
       HERO VISUAL / ORBIT
       ========================= */

    .visual{
        position:relative !important;

        width:100% !important;
        max-width:390px !important;
        min-width:0 !important;

        min-height:330px !important;

        margin:
            0
            auto !important;

        display:flex !important;
        align-items:center !important;
        justify-content:center !important;

        overflow:visible !important;

        transform:none !important;
    }

    .orbit-system{
        position:relative !important;

        left:auto !important;
        right:auto !important;
        top:auto !important;
        bottom:auto !important;

        margin:
            0
            auto !important;

        transform:
            scale(.72) !important;

        transform-origin:
            center center !important;
    }


    /*
       Do not apply max-width:100% to the orbit itself.
       Its own scale controls its mobile size.
    */

    .visual > .orbit-system{
        max-width:none !important;
    }


    /* =========================
       INNER PAGE HERO
       ========================= */

    .page-hero{
        width:100% !important;
        max-width:100% !important;

        padding-top:44px !important;
        padding-bottom:44px !important;

        overflow-x:hidden !important;
    }

    .page-hero h1{
        max-width:100% !important;

        font-size:clamp(34px,10vw,46px) !important;
        line-height:1.07 !important;

        overflow-wrap:anywhere !important;
    }

    .page-hero p{
        max-width:100% !important;

        font-size:15px !important;
        line-height:1.7 !important;
    }


    /* =========================
       CONTENT
       ========================= */

    .section{
        padding-top:52px !important;
        padding-bottom:52px !important;
    }

    .section-head{
        max-width:100% !important;
    }

    .section-head h2{
        font-size:clamp(30px,9vw,42px) !important;
        line-height:1.08 !important;
    }

    .grid,
    .cards,
    .solutions-grid,
    .services-grid,
    .platform-grid,
    .entities-grid,
    [data-cms-list],
    [data-news-list]{
        display:grid !important;
        grid-template-columns:minmax(0,1fr) !important;

        width:100% !important;
        max-width:100% !important;

        gap:16px !important;
    }

    .card{
        width:100% !important;
        max-width:100% !important;
        min-width:0 !important;
    }


    /* =========================
       PAGE WIDTH SAFETY
       ========================= */

    main,
    section,
    .section,
    .page-hero,
    footer{
        width:100% !important;
        max-width:100% !important;

        overflow-x:hidden !important;
    }

}



/* =========================================================
   V4.13.5 — REAL HOME HERO SELECTORS
   Portrait only
   ========================================================= */

@media (max-width:700px) and (orientation:portrait){

    /*
       HOME HERO WIDTH
    */

    .hero{
        width:calc(100% - 32px) !important;
        max-width:calc(100% - 32px) !important;

        margin-left:auto !important;
        margin-right:auto !important;

        padding-left:0 !important;
        padding-right:0 !important;

        overflow:visible !important;
    }

    .hero > div:first-child{
        width:100% !important;
        max-width:100% !important;
        min-width:0 !important;

        margin-left:auto !important;
        margin-right:auto !important;
    }


    /*
       DESCRIPTION
    */

    .hero .desc{
        width:100% !important;
        max-width:560px !important;

        margin-left:auto !important;
        margin-right:auto !important;

        padding-left:0 !important;
        padding-right:0 !important;

        text-align:center !important;

        white-space:normal !important;
        overflow-wrap:normal !important;
        word-break:normal !important;
    }


    /*
       REAL BUTTON CONTAINER
    */

    .hero-buttons{
        display:grid !important;
        grid-template-columns:minmax(0,1fr) !important;

        width:100% !important;
        max-width:430px !important;

        margin:
            28px
            auto
            0 !important;

        padding:0 !important;

        gap:10px !important;
    }

    .hero-buttons .btn{
        width:100% !important;
        max-width:100% !important;
        min-width:0 !important;

        min-height:50px !important;

        margin:0 !important;

        padding:
            13px
            18px !important;

        display:flex !important;
        align-items:center !important;
        justify-content:center !important;

        text-align:center !important;
    }


    /*
       REAL VISUAL CONTAINER
    */

    .visual{
        position:relative !important;

        display:flex !important;
        align-items:center !important;
        justify-content:center !important;

        width:100% !important;
        max-width:100% !important;

        min-height:330px !important;

        margin:
            12px
            auto
            0 !important;

        padding:0 !important;

        overflow:visible !important;

        transform:none !important;
    }


    /*
       Orbit stays mathematically centered.

       Original orbit:
       470 x 470

       We keep its original coordinate system and only scale it.
       Therefore rings, logo and badges remain aligned.
    */

    .visual .orbit-system{
        display:grid !important;
        place-items:center !important;

        position:relative !important;

        width:470px !important;
        height:470px !important;

        min-width:470px !important;
        min-height:470px !important;

        max-width:none !important;

        margin:
            -58px
            auto !important;

        left:auto !important;
        right:auto !important;
        top:auto !important;
        bottom:auto !important;

        transform:
            scale(.68) !important;

        transform-origin:
            center center !important;
    }


    /*
       AC logo exactly at orbit center.
       Do not use offsets.
    */

    .visual .orbit-system .hero-logo{
        position:absolute !important;

        left:50% !important;
        top:50% !important;

        width:190px !important;
        height:190px !important;

        margin:0 !important;

        transform:
            translate(-50%,-50%) !important;

        object-fit:contain !important;

        z-index:4 !important;
    }


    /*
       Rings share exactly the same center.
    */

    .visual .orbit-ring{
        position:absolute !important;

        left:50% !important;
        top:50% !important;

        margin:0 !important;

        transform:
            translate(-50%,-50%) !important;

        transform-origin:center !important;
    }

}


/* Extra-small portrait */

@media (max-width:420px) and (orientation:portrait){

    .hero{
        width:calc(100% - 28px) !important;
        max-width:calc(100% - 28px) !important;
    }

    .hero-buttons{
        max-width:100% !important;
    }

    .visual{
        min-height:300px !important;
    }

    .visual .orbit-system{
        transform:
            scale(.61) !important;

        margin:
            -78px
            auto !important;
    }

}

/* =========================================================
   SMALL PORTRAIT PHONES
   ========================================================= */

@media (max-width:420px) and (orientation:portrait){

    .container,
    .hero .container{
        padding-left:16px !important;
        padding-right:16px !important;
    }

    .hero-title{
        font-size:clamp(38px,11.8vw,48px) !important;
    }

    .visual{
        max-width:350px !important;
        min-height:300px !important;
    }

    .orbit-system{
        transform:
            scale(.64) !important;
    }

}


/* ----- moved from jsmain.js: WhatsApp/footer collision V4.13.4 ----- */

.whatsapp-float{
    transition:
        opacity .20s ease,
        visibility .20s ease,
        transform .20s ease !important;
}

.whatsapp-float.anncore-wa-footer-visible{
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;

    transform:
        translateY(12px)
        scale(.92) !important;
}



/* =========================================================
   V5 COMPONENTS — built on the existing AnnCore tokens
   (--grad, --surface, --border, --muted...). No new palette.
   ========================================================= */

/* Theme applied on <html> before paint (see inline head script) */
html.light{--bg:#f7f8fc;--surface:#fff;--surface2:#eef2f8;--text:#111525;--muted:#687188;
 --border:rgba(15,20,40,.10);--nav:rgba(247,248,252,.91);--shadow:0 24px 60px rgba(30,40,80,.10)}

/* Accessibility */
.skip-link{position:absolute;inset-inline-start:12px;top:8px;z-index:200;padding:10px 14px;border-radius:10px;background:var(--surface);border:1px solid var(--border);transform:translateY(-150%);opacity:0}
.skip-link:focus{transform:none;opacity:1}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,.step:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Header: 9 links + actions */
.nav-links{gap:18px}
.nav-links a{white-space:nowrap}
.actions .theme{display:inline-grid;place-items:center;font-size:17px}
@media(max-width:1240px) and (min-width:851px){.nav-links{gap:13px}.nav-links a{font-size:12.5px}}
@media(max-width:1080px) and (min-width:851px){.nav-links{gap:11px}.nav-links a{font-size:12px}.brand-name{font-size:21px}}
@media(max-width:850px){.nav-mobile-only{display:block!important}}
.nav-mobile-only{display:none!important}

/* Hero */
.hero{padding-top:56px;padding-bottom:56px}
.hero-points{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.hero-points span{font-size:12px;color:var(--muted);border:1px solid var(--border);border-radius:999px;padding:6px 11px;background:color-mix(in srgb,var(--surface) 70%,transparent)}
@media(max-width:850px){.hero-points{justify-content:center}}
.orbit-badge{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.orbit-badge:hover{border-color:rgba(80,120,255,.55);box-shadow:0 14px 38px rgba(20,120,255,.22)}

/* Section helpers */
.section-alt{background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--surface) 55%,transparent) 30%,transparent)}
.section-head.center{margin-inline:auto;text-align:center}
.section-head.center .desc{margin-inline:auto}
.subhead{font-size:14px;letter-spacing:1.2px;text-transform:uppercase;color:var(--muted);margin:34px 0 14px}
.cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.section-head.center + .cta-row,.cta-row.center{justify-content:center}

/* Generic page-item cards */
.pi-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.pi-grid.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.pi-grid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.pi-card{position:relative;display:flex;flex-direction:column;gap:10px;background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:26px;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;min-width:0}
.pi-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:rgba(80,110,255,.35)}
.pi-card .icon{margin-bottom:6px}
.pi-card h3{font-size:18px;margin:0}
.pi-card p{color:var(--muted);line-height:1.65;font-size:14px;margin:0}
.pi-card ul{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:7px}
.pi-card li{position:relative;padding-inline-start:20px;font-size:14px;line-height:1.5}
.pi-card li:before{content:"";position:absolute;inset-inline-start:0;top:.55em;width:8px;height:8px;border-radius:3px;background:var(--grad)}
.pi-card .pi-link{margin-top:auto;padding-top:12px;font-weight:700;font-size:14px;text-decoration:none;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;align-self:flex-start}
.pi-card.compact{padding:20px;flex-direction:row;align-items:flex-start;gap:14px}
.pi-card.compact .icon{flex:0 0 44px;width:44px;height:44px;font-size:19px;margin:0}
.pi-card.compact h3{font-size:16px;margin-bottom:4px}
.pi-card.is-soon{opacity:.78}
.pi-card.is-soon:hover{transform:none}
.badge-soon{display:inline-flex;align-self:flex-start;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;border:1px dashed rgba(121,40,255,.55);color:var(--text);background:rgba(121,40,255,.08)}
.pi-card .badge-soon{position:absolute;top:18px;inset-inline-end:18px}
@media(max-width:1000px){.pi-grid,.pi-grid.cols-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.pi-grid,.pi-grid.cols-4,.pi-grid.cols-2{grid-template-columns:1fr}}

/* Pillars (What We Do) */
.pillars .pi-card{padding:30px;border-radius:22px}
/* Gradient accent on every public card: a 2px gradient border that follows the card's rounded corners
   and fades out down the sides (ring = border-box minus padding-box, faded by a vertical mask) */
.pi-card,.cms-card,.news-card,.compare-col,.demo-card,.product-features{position:relative}
.pi-card:before,.cms-card:before,.news-card:before,.compare-col:before,.demo-card:before,.product-features:before{
 content:"";position:absolute;inset:-1px;border-radius:inherit;border:2px solid transparent;
 background:var(--grad) border-box;pointer-events:none;z-index:1;opacity:.9;
 -webkit-mask:linear-gradient(#000 0,#000 18px,transparent 70px) border-box,linear-gradient(#000 0 0) padding-box;
 -webkit-mask-composite:source-out;
 mask:linear-gradient(#000 0,#000 18px,transparent 70px) border-box,linear-gradient(#000 0 0) padding-box;
 mask-composite:subtract}

/* Deploy comparison */
.compare{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:10px}
.compare-col{background:var(--surface);border:1px solid var(--border);border-radius:20px;padding:26px}
.compare-col h4{font-size:20px;margin:0 0 6px}
.compare-col p{color:var(--muted);font-size:14px;line-height:1.65;margin:0 0 14px}
.compare-col ul{list-style:none;padding:0;margin:0;display:grid;gap:9px}
.compare-col li{display:flex;gap:10px;font-size:14px;line-height:1.5}
.compare-col li:before{content:"✓";flex:0 0 20px;height:20px;border-radius:6px;display:grid;place-items:center;font-size:12px;font-weight:900;color:#fff;background:var(--grad)}
.compare-tag{display:inline-block;font-size:11px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
@media(max-width:760px){.compare{grid-template-columns:1fr}}

/* Split feature band (custom development, managed HR) */
.band{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:40px;align-items:start;padding:40px;border:1px solid var(--border);border-radius:26px;background:linear-gradient(135deg,rgba(25,215,255,.06),rgba(121,40,255,.07))}
.band h2{font-size:clamp(30px,4vw,44px);letter-spacing:-1.5px;line-height:1.08;margin:0 0 14px}
@media(max-width:900px){.band{grid-template-columns:1fr;padding:26px;gap:24px}}

.notice{display:flex;gap:12px;align-items:flex-start;padding:16px 18px;border:1px solid var(--border);border-radius:14px;background:var(--surface);color:var(--muted);font-size:14px;line-height:1.6;margin-top:18px}
.notice strong{color:var(--text)}

/* Product detail blocks */
.product-block{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:34px;align-items:start;padding:34px;border:1px solid var(--border);border-radius:24px;background:var(--surface);margin-bottom:22px;scroll-margin-top:100px}
.product-block .icon{width:60px;height:60px;font-size:28px}
.product-block h2{font-size:clamp(30px,4vw,42px);letter-spacing:-1.2px;margin:0 0 12px}
.module-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.module{display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px solid var(--border);border-radius:12px;background:var(--bg);font-size:14px;font-weight:600}
.module:before{content:"";width:8px;height:8px;border-radius:3px;background:var(--grad);flex:0 0 8px}
@media(max-width:860px){.product-block{grid-template-columns:1fr;padding:24px}}
@media(max-width:420px){.module-grid{grid-template-columns:1fr}}

/* Resource / legal pages */
.prose{max-width:820px}
.prose h2{font-size:26px;letter-spacing:-.5px;margin:34px 0 10px}
.prose h3{font-size:18px;margin:22px 0 8px}
.prose p,.prose li{color:var(--muted);line-height:1.8;font-size:15.5px}
.prose ul{padding-inline-start:22px;display:grid;gap:6px}
.prose .updated{font-size:13px;color:var(--muted)}
.todo-list li{color:var(--muted)}

/* Footer V5 */
.anncore-footer-grid.v5{grid-template-columns:1.5fr repeat(6,minmax(0,1fr));gap:26px}
.anncore-footer-grid.v5 h4{font-size:13px;letter-spacing:.3px}
.anncore-footer-grid .soon{font-size:10px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;opacity:.75;margin-inline-start:4px}
.footer-social-icons{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.anncore-footer-bottom .legal-links{display:flex;flex-wrap:wrap;gap:16px}
.anncore-footer-bottom a{color:var(--muted);text-decoration:none}
.anncore-footer-bottom a:hover{color:var(--text)}
@media(max-width:1100px){.anncore-footer-grid.v5{grid-template-columns:repeat(4,minmax(0,1fr))}.anncore-footer-grid.v5 .anncore-footer-brand{grid-column:1/-1}}
@media(max-width:640px){.anncore-footer-grid.v5{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:380px){.anncore-footer-grid.v5{grid-template-columns:1fr}}
footer.footer{padding:0}

/* Forms (demo / contact) */
.form-note{font-size:12px;color:var(--muted);margin-top:6px}
.field-error{color:#ff6b86;font-size:12px;margin-top:6px;min-height:0}
.control[aria-invalid="true"]{border-color:#ff6b86!important}
.status-msg{margin-top:14px;font-weight:700;font-size:14px}
.status-msg.ok{color:#16a34a}.status-msg.err{color:#ef4444}
.req{color:#ff5b7d}

/* 404 */
.error-page{min-height:calc(100vh - 78px);display:grid;place-items:center;text-align:center;padding:60px 0}
.error-code{font-size:clamp(90px,16vw,170px);font-weight:900;letter-spacing:-6px;line-height:1;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ===================== CAREERS ===================== */
.careers-toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:22px}
.careers-toolbar .control{width:auto;min-width:170px;flex:1 1 170px;max-width:260px;padding:11px 12px}
.careers-toolbar .count{margin-inline-start:auto;color:var(--muted);font-size:13px}
.job-list{display:grid;gap:16px}
.job-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:22px;align-items:center;padding:24px 26px;border:1px solid var(--border);border-radius:20px;background:var(--surface);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.job-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:rgba(80,110,255,.35)}
.job-card h3{font-size:20px;margin:0 0 8px}
.job-card p{color:var(--muted);font-size:14px;line-height:1.6;margin:10px 0 0}
.chips{display:flex;flex-wrap:wrap;gap:7px}
.chip{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;border:1px solid var(--border);background:var(--bg);font-size:12px;color:var(--muted);white-space:nowrap}
.chip b{color:var(--text);font-weight:700}
.chip.closed{border-color:rgba(255,91,125,.45);color:#ff7a93}
.chip.open{border-color:rgba(34,197,94,.45);color:#22c55e}
.job-dates{font-size:12px;color:var(--muted);margin-top:10px}
@media(max-width:700px){.job-card{grid-template-columns:1fr}.job-card .btn{width:100%}}
.empty-state{text-align:center;padding:48px 24px;border:1px dashed var(--border);border-radius:22px;background:var(--surface)}
.empty-state .icon{margin:0 auto 16px}
.empty-state h3{margin-bottom:8px}
.empty-state p{color:var(--muted);max-width:520px;margin:0 auto 18px;line-height:1.7}

.job-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:26px;align-items:start}
.job-main{min-width:0}
.job-hero{padding:32px;border:1px solid var(--border);border-radius:24px;background:var(--surface);margin-bottom:20px}
.job-hero h1{font-size:clamp(32px,4.4vw,52px);letter-spacing:-1.8px;line-height:1.05;margin:10px 0 16px}
.job-section{padding:26px 30px;border:1px solid var(--border);border-radius:20px;background:var(--surface);margin-bottom:16px}
.job-section h2{font-size:19px;margin:0 0 12px}
.job-section p{color:var(--muted);line-height:1.8;margin:0 0 8px}
.job-section ul{margin:0;padding-inline-start:20px;display:grid;gap:8px;color:var(--muted);line-height:1.7}
.job-aside{position:sticky;top:96px;padding:24px;border:1px solid var(--border);border-radius:20px;background:var(--surface);display:grid;gap:14px}
.job-aside dl{display:grid;gap:12px;margin:0}
.job-aside dt{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--muted)}
.job-aside dd{margin:2px 0 0;font-weight:700;font-size:14px}
.job-aside .btn{width:100%}
@media(max-width:960px){.job-layout{grid-template-columns:1fr}.job-aside{position:static;order:-1}}

/* Upload component */
.dropzone{position:relative;border:1.5px dashed color-mix(in srgb,var(--muted) 45%,transparent);border-radius:16px;padding:22px;text-align:center;background:var(--bg);transition:border-color .2s,background .2s;cursor:pointer}
.dropzone:hover,.dropzone.drag{border-color:#3b82f6;background:color-mix(in srgb,#3b82f6 7%,var(--bg))}
.dropzone input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.dropzone .dz-icon{width:46px;height:46px;border-radius:14px;margin:0 auto 10px;display:grid;place-items:center;font-size:20px;color:#fff;background:var(--grad)}
.dropzone .dz-title{font-weight:700}
.dropzone .dz-hint{font-size:12px;color:var(--muted);margin-top:6px}
.dz-file{display:none;align-items:center;gap:12px;padding:14px 16px;border:1px solid var(--border);border-radius:14px;background:var(--bg);text-align:start}
.dz-file.on{display:flex}
.dz-file .dz-meta{flex:1;min-width:0}
.dz-file .dz-name{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dz-file .dz-size{font-size:12px;color:var(--muted)}
.dz-file .dz-status{font-size:12px;font-weight:700;color:#22c55e}
.dz-file .dz-status.err{color:#ff6b86}
.dz-file button{border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:9px;padding:7px 11px;cursor:pointer;font:inherit;font-size:12px}

/* Application success */
.success-card{max-width:760px;margin:0 auto;padding:40px;border:1px solid var(--border);border-radius:26px;background:var(--surface);text-align:center}
.success-icon{width:74px;height:74px;margin:0 auto 18px;border-radius:50%;display:grid;place-items:center;font-size:34px;color:#fff;background:var(--grad);box-shadow:0 18px 40px rgba(20,120,255,.28)}
.success-card h1{font-size:clamp(28px,4vw,40px);letter-spacing:-1px;margin:0 0 10px}
.success-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:26px 0;text-align:start}
.success-grid div{padding:14px 16px;border:1px solid var(--border);border-radius:14px;background:var(--bg)}
.success-grid small{display:block;color:var(--muted);font-size:11px;letter-spacing:.8px;text-transform:uppercase;margin-bottom:4px}
.success-grid strong{overflow-wrap:anywhere}
.next-steps{text-align:start;display:grid;gap:12px;margin:8px 0 26px;padding:0;list-style:none;counter-reset:s}
.next-steps li{counter-increment:s;display:flex;gap:12px;align-items:flex-start;color:var(--muted);line-height:1.6}
.next-steps li:before{content:counter(s);flex:0 0 28px;height:28px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:13px;color:#fff;background:var(--grad)}
@media(max-width:560px){.success-card{padding:24px}.success-grid{grid-template-columns:1fr}}

/* Book a Demo (moved from the page; --panel was undefined in V4) */
.demo-page{width:min(1180px,92%);margin:0 auto;padding:64px 0 90px}
.demo-layout{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:42px;align-items:start}
.demo-copy{position:sticky;top:110px}
.demo-copy h1{font-size:clamp(42px,5vw,68px);line-height:1.02;letter-spacing:-2px;margin:14px 0 20px}
.demo-benefits{display:grid;gap:12px;margin-top:28px}
.demo-benefit{display:grid;gap:4px;padding:15px 17px;border:1px solid var(--border);border-radius:15px;background:var(--surface)}
.demo-benefit .desc{font-size:14px}
.demo-card{border:1px solid var(--border);border-radius:24px;padding:28px;background:var(--surface)}
.demo-card textarea.control{min-height:120px}
.demo-success{text-align:center;padding:30px 10px}
.demo-reference{display:inline-block;margin:14px 0;padding:10px 15px;border-radius:10px;background:var(--surface2);font-weight:800;letter-spacing:.04em}
@media(max-width:850px){.demo-page{padding:40px 0 70px}.demo-layout{grid-template-columns:1fr;gap:26px}.demo-copy{position:static}}
@media(max-width:600px){.demo-card{padding:18px;border-radius:18px}}
[data-cms-list][data-variant="detail"] .cms-card{padding:32px;scroll-margin-top:100px}
@media(max-width:850px){[data-cms-list][data-variant="detail"]{grid-template-columns:1fr!important}}
[hidden]{display:none!important}

/* Hero gradient word (was inline in the V4 index page) + spacing/header refinements */
.hero-gradient-text{display:inline-block;background:linear-gradient(90deg,#16c7f3 0%,#1677ff 48%,#7437ff 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.hero{min-height:min(calc(100vh - 78px),780px)}
.actions .btn{white-space:nowrap}
@media(max-width:1180px) and (min-width:851px){.navbar .brand-name{display:none}.actions .btn{padding:12px 16px}}

/* products page: 2 detailed cards per row (overrides the V4.3.1 3-column !important rule) */
[data-cms-list="products"][data-variant="detail"]{grid-template-columns:repeat(2,minmax(0,1fr))!important}
@media(max-width:850px){[data-cms-list="products"][data-variant="detail"]{grid-template-columns:1fr!important}}

/* ===== Orbit: badges revolve around the logo on the outer ring (replaces the up/down float) =====
   Each badge is pinned to the orbit centre, pushed out by --orbit-r and turned by
   --orbit-start + --orbit-a; the counter-rotation keeps the label upright. */
@property --orbit-a{syntax:"<angle>";inherits:false;initial-value:0deg}
.orbit-system .orbit-badge{
  --orbit-r:232px;
  left:50%;top:50%;right:auto;bottom:auto;margin:0;
  transform-origin:0 0;
  transform:rotate(calc(var(--orbit-start) + var(--orbit-a))) translateX(var(--orbit-r)) rotate(calc(-1 * (var(--orbit-start) + var(--orbit-a)))) translate(-50%,-50%);
  animation:orbitRevolve 60s linear infinite;
  animation-delay:0s;
}
.orbit-system .badge-modular{--orbit-start:-90deg}
.orbit-system .badge-cloud{--orbit-start:-30deg}
.orbit-system .badge-prem{--orbit-start:30deg}
.orbit-system .badge-scale{--orbit-start:90deg}
.orbit-system .badge-api{--orbit-start:150deg}
.orbit-system .badge-secure{--orbit-start:210deg}
.orbit-system:hover .orbit-badge{animation-play-state:paused}
@keyframes orbitRevolve{to{--orbit-a:360deg}}
@media(prefers-reduced-motion:reduce){.orbit-system .orbit-badge{animation:none}}

/* V5.2 clickable product cards: a stretched link covers the card, buttons stay clickable above it */
.cms-card.is-link{cursor:pointer}
.cms-card .card-link{position:absolute;inset:0;z-index:2;border-radius:inherit}
.cms-card .card-link:focus-visible{outline:2px solid #19d7ff;outline-offset:3px}
.cms-card.is-link .btn{position:relative;z-index:3}
.cms-card.is-link:hover{border-color:rgba(25,215,255,.35)}

/* V5.2 product page */
.product-hero .container{max-width:900px}
.product-back{display:inline-block;margin-bottom:22px;color:var(--muted);text-decoration:none;font-size:14px;font-weight:600}
.product-back:hover{color:var(--text)}
.product-head{display:flex;align-items:center;gap:18px;margin-bottom:14px}
.product-head .icon{flex:0 0 64px;width:64px;height:64px;font-size:30px;margin:0}
.product-head h1{margin:4px 0 0}
.product-hero .desc{max-width:720px}
.product-hero .cta-row{margin-top:22px}
.product-shots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.product-shots.single{grid-template-columns:minmax(0,960px);justify-content:center}
.product-shot{display:block;border:1px solid var(--border);border-radius:18px;overflow:hidden;background:var(--surface);box-shadow:var(--shadow);transition:transform .2s ease}
.product-shot:hover{transform:translateY(-3px)}
.product-shot img{display:block;width:100%;height:auto}
.product-features{position:relative;max-width:900px;margin:auto;padding:30px;border:1px solid var(--border);border-radius:22px;background:var(--surface)}
.product-features h2{font-size:24px;margin:0 0 16px}
.product-features .cms-features{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px;margin:0}
@media(max-width:760px){
 .product-shots{grid-template-columns:1fr}
 .product-head .icon{flex-basis:52px;width:52px;height:52px;font-size:24px}
 .product-features{padding:22px}
 .product-features .cms-features{grid-template-columns:1fr}
}