/**
 * ARANOX Home — CTA Executivo Super Premium
 * Release: AW3_024 REV01
 */

.arx24-cta{
  --arx24-x:72%;
  --arx24-y:34%;
  position:relative;
  isolation:isolate;
  overflow:hidden;
  color:#071623;
  background:
    radial-gradient(circle at var(--arx24-x) var(--arx24-y),rgba(55,190,228,.18),transparent 28%),
    radial-gradient(circle at 16% 82%,rgba(39,208,165,.11),transparent 30%),
    radial-gradient(circle at 88% 18%,rgba(120,104,255,.10),transparent 27%),
    linear-gradient(132deg,#ffffff 0%,#f5fafc 48%,#eef7fa 100%);
  padding:clamp(110px,11vw,180px) 0 clamp(90px,8vw,130px);
}

.arx24-cta__grid,
.arx24-cta__aurora,
.arx24-cta__noise,
.arx24-cta__light{
  position:absolute;
  inset:0;
  pointer-events:none;
}

.arx24-cta__grid{
  opacity:.58;
  background-image:
    linear-gradient(rgba(12,76,106,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(12,76,106,.045) 1px,transparent 1px);
  background-size:64px 64px;
  mask-image:linear-gradient(to bottom,transparent 0%,#000 18%,#000 82%,transparent 100%);
}

.arx24-cta__aurora{
  inset:-28%;
  opacity:.56;
  filter:blur(90px);
  background:
    conic-gradient(
      from 170deg at 50% 50%,
      transparent,
      rgba(36,185,238,.12),
      transparent 34%,
      rgba(90,73,255,.08),
      transparent 66%,
      rgba(26,216,178,.09),
      transparent
    );
  animation:arx24Aurora 28s linear infinite;
}

.arx24-cta__noise{
  opacity:.028;
  mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.9'/%3E%3C/svg%3E");
}

.arx24-cta__light{
  background:
    linear-gradient(
      115deg,
      transparent 22%,
      rgba(255,255,255,.78) 44%,
      transparent 64%
    );
  transform:translateX(-120%);
  animation:arx24Light 9s ease-in-out infinite;
}

.arx24-cta__shell{
  position:relative;
  z-index:3;
  display:grid;
  grid-template-columns:minmax(0,1.04fr) minmax(420px,.96fr);
  align-items:center;
  gap:clamp(52px,8vw,128px);
}

.arx24-cta__content{
  max-width:860px;
}

.arx24-cta__eyebrow{
  display:inline-flex;
  align-items:center;
  gap:11px;
  margin:0 0 28px;
  padding:9px 14px;
  border:1px solid rgba(14,114,153,.14);
  border-radius:999px;
  color:#0a6489;
  background:rgba(255,255,255,.64);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
  backdrop-filter:blur(14px);
  font-size:clamp(.72rem,.9vw,.82rem);
  font-weight:850;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.arx24-cta__status{
  width:8px;
  height:8px;
  border-radius:50%;
  background:#15b892;
  box-shadow:
    0 0 0 6px rgba(21,184,146,.10),
    0 0 22px rgba(21,184,146,.42);
  animation:arx24Status 2.2s ease-in-out infinite;
}

.arx24-cta__title{
  margin:0;
  max-width:13ch;
  color:#071623;
  font-size:clamp(3.6rem,6.2vw,7.2rem);
  font-weight:880;
  line-height:.92;
  letter-spacing:-.067em;
  text-wrap:balance;
}

.arx24-cta__title span{
  display:block;
  margin-top:.12em;
  color:transparent;
  background:linear-gradient(108deg,#071623 3%,#0d749d 44%,#17a886 74%,#574dc6);
  -webkit-background-clip:text;
  background-clip:text;
  font-size:.62em;
  line-height:1.08;
  letter-spacing:-.052em;
}

.arx24-cta__lead{
  max-width:66ch;
  margin:32px 0 0;
  color:#4c6678;
  font-size:clamp(1.04rem,1.3vw,1.22rem);
  line-height:1.76;
}

.arx24-cta__actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:38px;
}

.arx24-button{
  position:relative;
  overflow:hidden;
  display:inline-flex;
  min-height:58px;
  align-items:center;
  justify-content:center;
  gap:14px;
  padding:0 25px;
  border:1px solid transparent;
  border-radius:999px;
  font-size:.94rem;
  font-weight:850;
  text-decoration:none;
  transition:
    transform .28s ease,
    border-color .28s ease,
    background .28s ease,
    box-shadow .28s ease;
}

.arx24-button--primary{
  color:#fff;
  background:linear-gradient(110deg,#0d6f96,#0e9b78);
  box-shadow:
    0 18px 52px rgba(8,112,143,.20),
    inset 0 1px 0 rgba(255,255,255,.22);
}

.arx24-button--primary::before{
  content:"";
  position:absolute;
  inset:-2px;
  background:linear-gradient(110deg,transparent 28%,rgba(255,255,255,.68) 48%,transparent 68%);
  transform:translateX(-120%);
  transition:transform .8s ease;
}

.arx24-button--primary:hover::before{
  transform:translateX(120%);
}

.arx24-button--ghost{
  color:#0a5d7e;
  border-color:rgba(10,93,126,.18);
  background:rgba(255,255,255,.66);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.96);
  backdrop-filter:blur(14px);
}

.arx24-button:hover{
  transform:translateY(-3px);
}

.arx24-button--ghost:hover{
  border-color:rgba(10,93,126,.36);
  background:rgba(255,255,255,.94);
  box-shadow:0 18px 44px rgba(14,85,112,.10);
}

.arx24-cta__assurance{
  display:flex;
  flex-wrap:wrap;
  gap:12px 24px;
  margin-top:34px;
  color:#6d8290;
  font-size:.79rem;
  font-weight:740;
}

.arx24-cta__assurance span{
  display:inline-flex;
  align-items:center;
  gap:8px;
}

.arx24-cta__assurance i{
  width:5px;
  height:5px;
  border-radius:50%;
  background:#0d8f72;
  box-shadow:0 0 12px rgba(13,143,114,.46);
}

.arx24-cta__visual{
  position:relative;
  min-height:580px;
  display:grid;
  place-items:center;
  perspective:1200px;
}

.arx24-core{
  position:relative;
  width:min(100%,590px);
  aspect-ratio:1;
  display:grid;
  place-items:center;
  transform-style:preserve-3d;
}

.arx24-core__halo{
  position:absolute;
  inset:17%;
  border-radius:50%;
  background:
    radial-gradient(circle,rgba(40,185,219,.17),rgba(95,82,220,.07) 44%,transparent 72%);
  filter:blur(14px);
  animation:arx24Breath 5.8s ease-in-out infinite;
}

.arx24-core__ring{
  position:absolute;
  border:1px solid rgba(20,114,150,.18);
  border-radius:50%;
  box-shadow:inset 0 0 30px rgba(38,166,204,.035);
}

.arx24-core__ring::before,
.arx24-core__ring::after{
  content:"";
  position:absolute;
  width:7px;
  height:7px;
  border-radius:50%;
  background:#149cc6;
  box-shadow:0 0 18px rgba(20,156,198,.55);
}

.arx24-core__ring::before{
  top:8%;
  left:24%;
}

.arx24-core__ring::after{
  right:10%;
  bottom:25%;
  background:#18b48f;
  box-shadow:0 0 18px rgba(24,180,143,.55);
}

.arx24-core__ring--one{
  inset:7%;
  animation:arx24Spin 36s linear infinite;
}

.arx24-core__ring--two{
  inset:18%;
  border-style:dashed;
  animation:arx24SpinReverse 26s linear infinite;
}

.arx24-core__ring--three{
  inset:30%;
  animation:arx24Spin 18s linear infinite;
}

.arx24-core__axis{
  position:absolute;
  left:50%;
  top:50%;
  width:74%;
  height:1px;
  transform-origin:center;
  background:linear-gradient(90deg,transparent,rgba(17,112,147,.22),transparent);
}

.arx24-core__axis--one{
  transform:translate(-50%,-50%) rotate(30deg);
}

.arx24-core__axis--two{
  transform:translate(-50%,-50%) rotate(-34deg);
}

.arx24-core__brand{
  position:relative;
  z-index:4;
  width:43%;
  aspect-ratio:1;
  display:grid;
  place-items:center;
  align-content:center;
  gap:13px;
  padding:27px;
  border:1px solid rgba(19,106,140,.16);
  border-radius:50%;
  background:
    radial-gradient(circle at 38% 30%,rgba(255,255,255,.98),transparent 30%),
    linear-gradient(145deg,rgba(255,255,255,.94),rgba(224,241,247,.88));
  box-shadow:
    0 0 0 12px rgba(255,255,255,.52),
    0 32px 90px rgba(24,90,117,.16),
    inset 0 1px 0 rgba(255,255,255,.95),
    0 0 100px rgba(44,186,232,.12);
  backdrop-filter:blur(24px);
}

.arx24-core__logo{
  display:block;
  width:92%;
  max-width:230px;
  height:auto;
  object-fit:contain;
  object-position:center;
}

.arx24-core__node{
  position:absolute;
  z-index:5;
  min-width:112px;
  display:grid;
  gap:3px;
  padding:11px 14px;
  border:1px solid rgba(14,102,138,.14);
  border-radius:14px;
  color:#071623;
  background:rgba(255,255,255,.78);
  box-shadow:
    0 14px 40px rgba(23,86,112,.12),
    inset 0 1px 0 rgba(255,255,255,.92);
  backdrop-filter:blur(14px);
  transition:
    transform .3s ease,
    border-color .3s ease,
    background .3s ease,
    box-shadow .3s ease;
}

.arx24-core__node:hover{
  z-index:8;
  transform:translateY(-4px) scale(1.035);
  border-color:rgba(14,102,138,.34);
  background:rgba(255,255,255,.98);
  box-shadow:0 20px 48px rgba(23,86,112,.16);
}

.arx24-core__node strong{
  font-size:.76rem;
  letter-spacing:.05em;
}

.arx24-core__node small{
  color:#6b8290;
  font-size:.63rem;
}

.arx24-core__node--tes{left:2%;top:23%}
.arx24-core__node--agrion{right:0;top:19%}
.arx24-core__node--sentrix{right:-3%;bottom:24%}
.arx24-core__node--vitalis{left:4%;bottom:18%}
.arx24-core__node--cyrius{left:37%;top:1%}
.arx24-core__node--cyrion{left:36%;bottom:0}

.arx24-core__telemetry{
  position:absolute;
  inset:0;
  pointer-events:none;
}

.arx24-core__telemetry span{
  position:absolute;
  width:3px;
  height:3px;
  border-radius:50%;
  background:#0e789f;
  box-shadow:0 0 18px rgba(14,120,159,.55);
  animation:arx24Telemetry 4.8s ease-in-out infinite;
}

.arx24-core__telemetry span:nth-child(1){left:14%;top:47%}
.arx24-core__telemetry span:nth-child(2){right:18%;top:43%;animation-delay:1s}
.arx24-core__telemetry span:nth-child(3){left:44%;top:11%;animation-delay:2s}
.arx24-core__telemetry span:nth-child(4){left:50%;bottom:12%;animation-delay:3s}
.arx24-core__telemetry span:nth-child(5){right:9%;bottom:45%;animation-delay:1.5s}

.arx24-cta__capabilities{
  position:relative;
  z-index:4;
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:14px 34px;
  margin-top:clamp(68px,8vw,110px);
  padding-top:30px;
  border-top:1px solid rgba(12,76,106,.10);
}

.arx24-cta__capabilities span{
  position:relative;
  color:#5d7686;
  font-size:.69rem;
  font-weight:850;
  letter-spacing:.13em;
  text-transform:uppercase;
}

.arx24-cta__capabilities span:not(:last-child)::after{
  content:"";
  position:absolute;
  top:50%;
  right:-19px;
  width:4px;
  height:4px;
  border-radius:50%;
  background:#0f8eb5;
  transform:translateY(-50%);
}

.arx24-cta [data-arx24-reveal]{
  opacity:0;
  transform:translateY(24px);
  transition:
    opacity .78s ease,
    transform .78s cubic-bezier(.2,.7,.2,1);
}

.arx24-cta.is-ready [data-arx24-reveal]{
  opacity:1;
  transform:translateY(0);
}

.arx24-cta.is-ready .arx24-cta__visual{
  transition-delay:.08s;
}

.arx24-cta.is-ready .arx24-cta__capabilities{
  transition-delay:.16s;
}

@keyframes arx24Aurora{
  to{transform:rotate(360deg)}
}

@keyframes arx24Light{
  0%,66%,100%{transform:translateX(-120%)}
  84%{transform:translateX(120%)}
}

@keyframes arx24Spin{
  to{transform:rotate(360deg)}
}

@keyframes arx24SpinReverse{
  to{transform:rotate(-360deg)}
}

@keyframes arx24Breath{
  50%{transform:scale(1.08);opacity:.74}
}

@keyframes arx24Status{
  50%{
    opacity:.52;
    box-shadow:
      0 0 0 10px rgba(21,184,146,0),
      0 0 26px rgba(21,184,146,.34);
  }
}

@keyframes arx24Telemetry{
  50%{transform:scale(4);opacity:.15}
}

@media(max-width:1100px){
  .arx24-cta__shell{
    grid-template-columns:minmax(0,1fr) minmax(360px,.82fr);
    gap:36px;
  }

  .arx24-cta__title{
    font-size:clamp(3.3rem,6vw,5.6rem);
  }

  .arx24-cta__visual{
    min-height:520px;
  }

  .arx24-core__node{
    min-width:96px;
    padding:9px 11px;
  }
}

@media(max-width:900px){
  .arx24-cta__shell{
    grid-template-columns:1fr;
  }

  .arx24-cta__content{
    max-width:760px;
  }

  .arx24-cta__visual{
    min-height:520px;
  }

  .arx24-core{
    width:min(100%,530px);
  }
}

@media(max-width:680px){
  .arx24-cta{
    padding-top:96px;
  }

  .arx24-cta__title{
    max-width:100%;
    font-size:clamp(2.9rem,13vw,4.4rem);
  }

  .arx24-cta__title span{
    font-size:.56em;
  }

  .arx24-cta__lead{
    font-size:1rem;
  }

  .arx24-cta__actions{
    display:grid;
  }

  .arx24-button{
    width:100%;
  }

  .arx24-cta__assurance{
    display:grid;
  }

  .arx24-cta__visual{
    min-height:400px;
  }

  .arx24-core{
    width:370px;
    max-width:100%;
  }

  .arx24-core__brand{
    width:48%;
  }

  .arx24-core__node{
    min-width:80px;
    padding:8px 9px;
  }

  .arx24-core__node strong{
    font-size:.61rem;
  }

  .arx24-core__node small{
    font-size:.54rem;
  }

  .arx24-cta__capabilities{
    display:grid;
    justify-content:start;
    gap:12px;
  }

  .arx24-cta__capabilities span::after{
    display:none;
  }
}

@media(prefers-reduced-motion:reduce){
  .arx24-cta__aurora,
  .arx24-cta__light,
  .arx24-core__ring,
  .arx24-core__halo,
  .arx24-core__telemetry span,
  .arx24-cta__status{
    animation:none!important;
  }

  .arx24-cta [data-arx24-reveal]{
    opacity:1!important;
    transform:none!important;
    transition:none!important;
  }
}
