/* SOGANET Section 04 - two-column eye layout */

body.sgx-plse3w-homepage .sgx-s04{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:100vh;
  display:flex;
  align-items:center;
  background:
    radial-gradient(circle at 20% 34%, rgba(103, 88, 255, .14), transparent 24%),
    radial-gradient(circle at 84% 18%, rgba(72, 181, 255, .13), transparent 26%),
    radial-gradient(circle at 50% 52%, rgba(93, 164, 255, .08), transparent 52%),
    linear-gradient(180deg, #040814 0%, #040712 48%, #050915 100%);
}

body.sgx-plse3w-homepage .sgx-s04:before{
  content:"";
  position:absolute;
  inset:-12%;
  background:
    radial-gradient(circle at 44% 42%, rgba(122, 228, 255, .07), transparent 18%),
    radial-gradient(circle at 52% 48%, rgba(88, 121, 255, .10), transparent 34%),
    radial-gradient(circle at 50% 50%, rgba(44, 38, 132, .12), transparent 58%);
  filter:blur(22px);
  pointer-events:none;
}

body.sgx-plse3w-homepage .sgx-s04__container{
  position:relative;
  z-index:2;
  width:min(100% - 72px, 1360px);
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(420px,.95fr);
  align-items:center;
  gap:clamp(64px, 7vw, 128px);
}

body.sgx-plse3w-homepage .sgx-s04__visual{
  position:relative;
  min-height:560px;
  pointer-events:none;
  justify-self:center;
  width:100%;
  overflow:visible;
}

body.sgx-plse3w-homepage .sgx-s04__eye-fx{
  position:absolute;
  left:var(--s04-eye-center-x, 50%);
  top:var(--s04-eye-center-y, 50%);
  width:min(96%, 650px);
  aspect-ratio:1.72 / 1;
  transform:translate(-50%, -50%) scale(calc(.90 + var(--s04-eye-fx-progress, 0) * .10));
  opacity:var(--s04-eye-fx-progress, 0);
  transition:opacity .24s linear, transform .24s cubic-bezier(.22,.7,.2,1);
  will-change:opacity, transform;
}

body.sgx-plse3w-homepage .sgx-s04__eye-fx:before,
body.sgx-plse3w-homepage .sgx-s04__eye-fx:after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  border-radius:50%;
  transform:translate(-50%, -50%);
  pointer-events:none;
}

body.sgx-plse3w-homepage .sgx-s04__eye-fx:before{
  width:60%;
  aspect-ratio:1;
  background:radial-gradient(circle, rgba(92, 207, 255, .16) 0%, rgba(72, 122, 255, .07) 32%, transparent 68%);
  filter:blur(18px);
}

body.sgx-plse3w-homepage .sgx-s04__eye-fx:after{
  width:18%;
  aspect-ratio:1;
  box-shadow:0 0 45px rgba(104, 221, 255, .18), inset 0 0 22px rgba(104, 221, 255, .08);
}

body.sgx-plse3w-homepage .sgx-s04__scan-ring{
  position:absolute;
  left:50%;
  top:50%;
  border:1px solid rgba(104, 220, 255, .16);
  border-radius:50%;
  transform:translate(-50%, -50%);
  box-shadow:inset 0 0 18px rgba(87, 166, 255, .035), 0 0 20px rgba(87, 166, 255, .025);
}

body.sgx-plse3w-homepage .sgx-s04__scan-ring--one{
  width:67%;
  height:76%;
  animation:sgx-s04-ring-one 22s linear infinite;
}

body.sgx-plse3w-homepage .sgx-s04__scan-ring--two{
  width:87%;
  height:94%;
  border-style:dashed;
  border-color:rgba(123, 218, 255, .11);
  animation:sgx-s04-ring-two 31s linear infinite reverse;
}

body.sgx-plse3w-homepage .sgx-s04__scan-line{
  position:absolute;
  left:10%;
  right:10%;
  top:50%;
  height:1px;
  background:linear-gradient(90deg, transparent 0%, rgba(103, 218, 255, .10) 20%, rgba(121, 228, 255, .75) 50%, rgba(103, 218, 255, .10) 80%, transparent 100%);
  box-shadow:0 0 16px rgba(106, 220, 255, .32);
  opacity:.75;
  animation:sgx-s04-scan 6.8s ease-in-out infinite;
}

body.sgx-plse3w-homepage .sgx-s04__focus-core{
  position:absolute;
  left:50%;
  top:50%;
  width:13px;
  height:13px;
  border-radius:50%;
  transform:translate(-50%, -50%);
  border:1px solid rgba(155, 239, 255, .78);
  box-shadow:0 0 0 7px rgba(104, 219, 255, .04), 0 0 22px rgba(104, 219, 255, .52);
  opacity:.88;
  animation:sgx-s04-core-breathe 7.2s ease-in-out infinite;
}

body.sgx-plse3w-homepage .sgx-s04__signal{
  position:absolute;
  display:flex;
  align-items:center;
  gap:8px;
  white-space:nowrap;
  font-size:12px;
  line-height:1;
  font-weight:600;
  letter-spacing:.035em;
  color:rgba(224, 242, 255, .82);
  opacity:var(--s04-signal-progress, 0);
  transform:translateY(calc((1 - var(--s04-signal-progress, 0)) * 12px));
  transition:opacity .25s linear, transform .25s ease-out;
}

body.sgx-plse3w-homepage .sgx-s04__signal span{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#79e0ff;
  box-shadow:0 0 12px rgba(121, 224, 255, .78);
}

body.sgx-plse3w-homepage .sgx-s04__signal--query{left:8%; top:21%;}
body.sgx-plse3w-homepage .sgx-s04__signal--behavior{right:4%; top:30%;}
body.sgx-plse3w-homepage .sgx-s04__signal--context{left:19%; bottom:13%;}

@keyframes sgx-s04-ring-one{
  from{transform:translate(-50%, -50%) rotate(0deg) scaleX(1);}
  50%{transform:translate(-50%, -50%) rotate(180deg) scaleX(.94);}
  to{transform:translate(-50%, -50%) rotate(360deg) scaleX(1);}
}

@keyframes sgx-s04-ring-two{
  from{transform:translate(-50%, -50%) rotate(-13deg) scaleY(.92);}
  50%{transform:translate(-50%, -50%) rotate(167deg) scaleY(1);}
  to{transform:translate(-50%, -50%) rotate(347deg) scaleY(.92);}
}

@keyframes sgx-s04-scan{
  0%,100%{transform:translateY(-118px); opacity:0;}
  14%,86%{opacity:.72;}
  50%{transform:translateY(118px); opacity:.95;}
}

@keyframes sgx-s04-core-breathe{
  0%,100%{transform:translate(-50%, -50%) scale(.92); opacity:.66;}
  50%{transform:translate(-50%, -50%) scale(1.12); opacity:1;}
}

body.sgx-plse3w-homepage .sgx-s04__content{
  position:relative;
  z-index:3;
  max-width:560px;
  opacity:var(--s04-content-progress, 0);
  transform:translate3d(calc((1 - var(--s04-content-progress, 0)) * 40px), 0, 0);
  transition:opacity .24s linear, transform .24s cubic-bezier(.22,.7,.2,1);
  will-change:opacity, transform;
  justify-self:end;
}

body.sgx-plse3w-homepage .sgx-s04__eyebrow{
  margin-bottom:16px;
  font-size:13px;
  font-weight:600;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:rgba(112, 221, 255, .92);
}

body.sgx-plse3w-homepage .sgx-s04__title{
  margin:0;
  font-size:clamp(42px, 3.8vw, 64px);
  line-height:1.02;
  letter-spacing:-.04em;
  color:#f4f8ff;
  max-width:13ch;
}

body.sgx-plse3w-homepage .sgx-s04__description{
  margin:24px 0 0;
  max-width:48ch;
  font-size:17px;
  line-height:1.75;
  color:rgba(225, 235, 255, .72);
}

body.sgx-plse3w-homepage .sgx-s04__benefits{
  margin:28px 0 0;
  padding:0;
  list-style:none;
  display:grid;
  gap:14px;
}

body.sgx-plse3w-homepage .sgx-s04__benefits li{
  position:relative;
  padding-left:22px;
  color:rgba(241, 247, 255, .9);
}

body.sgx-plse3w-homepage .sgx-s04__benefits li:before{
  content:"";
  position:absolute;
  left:0;
  top:.65em;
  width:7px;
  height:7px;
  border-radius:999px;
  background:#67d9ff;
  transform:translateY(-50%);
  box-shadow:0 0 12px rgba(103, 217, 255, .35);
}

@media (max-width: 899px){
  body.sgx-plse3w-homepage .sgx-s04{
    min-height:115vh;
    align-items:stretch;
  }

  body.sgx-plse3w-homepage .sgx-s04__container{
    width:min(100% - 32px, 680px);
    grid-template-columns:1fr;
    gap:24px;
    padding:12vh 0 10vh;
  }

  body.sgx-plse3w-homepage .sgx-s04__visual{
    min-height:42vh;
  }

  body.sgx-plse3w-homepage .sgx-s04__eye-fx{
    width:min(108%, 620px);
  }

  body.sgx-plse3w-homepage .sgx-s04__signal{
    font-size:10px;
  }

  body.sgx-plse3w-homepage .sgx-s04__content{
    max-width:none;
    text-align:left;
  }

  body.sgx-plse3w-homepage .sgx-s04__title{
    font-size:clamp(34px, 10vw, 48px);
  }
}
