:root{--bg:#02040a;--ink:#f3f6fb;--soft:rgba(243,246,251,.66)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--ink)}
body.stratgik-front{overflow:hidden;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.sg-shell{position:relative;width:100vw;height:100svh;min-height:620px;overflow:hidden;isolation:isolate;background:
radial-gradient(circle at 50% 55%,rgba(47,68,113,.10),transparent 34%),
radial-gradient(circle at 76% 18%,rgba(54,75,130,.08),transparent 22%),#02040a}
#sg-stars{position:absolute;inset:0;width:100%;height:100%;z-index:-5}
.sg-nebula{position:absolute;border-radius:50%;filter:blur(58px);opacity:.25;mix-blend-mode:screen;pointer-events:none;z-index:-4}
.sg-a{width:48vw;height:26vw;left:9vw;top:9vh;background:radial-gradient(ellipse at center,rgba(86,126,255,.25),rgba(40,58,120,.02) 68%,transparent 72%);animation:da 18s ease-in-out infinite alternate}
.sg-b{width:34vw;height:22vw;right:4vw;bottom:6vh;background:radial-gradient(ellipse at center,rgba(255,185,130,.12),rgba(109,68,120,.02) 68%,transparent 72%);animation:db 24s ease-in-out infinite alternate}
.sg-entry,.sg-panel{position:absolute;inset:0}
.sg-entry{display:grid;place-items:center;padding:6vh 6vw;transition:opacity 1.7s ease,transform 2s cubic-bezier(.2,.7,.2,1),filter 1.7s ease}
.sg-copy{text-align:center;width:min(920px,92vw);z-index:3;transform:translateY(2vh)}
.sg-kicker,.sg-ai small{letter-spacing:.32em;text-transform:uppercase;font-size:clamp(.58rem,.72vw,.80rem);color:var(--soft)}
.sg-copy h1{margin:.65rem 0 .15rem;font-family:Georgia,"Times New Roman",serif;font-weight:400;letter-spacing:.19em;font-size:clamp(4rem,11vw,10rem);line-height:.88;text-shadow:0 0 24px rgba(255,255,255,.08),0 0 70px rgba(140,175,255,.10)}
.sg-copy p{margin:.8rem 0 2rem;color:rgba(240,245,255,.80);letter-spacing:.18em;font-size:24px}
#sg-enter{appearance:none;border:1px solid rgba(229,238,255,.50);color:var(--ink);background:rgba(8,14,28,.28);backdrop-filter:blur(10px);border-radius:999px;padding:1rem 1.6rem;min-width:120px;letter-spacing:.36em;text-indent:.36em;font-size:.78rem;cursor:pointer;transition:.35s ease}
#sg-enter:hover{transform:translateY(-2px);background:rgba(18,28,50,.52);box-shadow:0 0 60px rgba(135,175,255,.16)}
.sg-mark{position:absolute;left:50%;top:16%;width:min(15vw,150px);aspect-ratio:1;transform:translateX(-50%) rotate(45deg);opacity:.42}
.sg-mark span{position:absolute;background:linear-gradient(90deg,transparent,rgba(221,235,255,.82),transparent)}
.sg-mark span:nth-child(1),.sg-mark span:nth-child(3){left:0;right:0;height:1px}.sg-mark span:nth-child(2),.sg-mark span:nth-child(4){top:0;bottom:0;width:1px}
.sg-mark span:nth-child(1){top:0}.sg-mark span:nth-child(2){right:0}.sg-mark span:nth-child(3){bottom:0}.sg-mark span:nth-child(4){left:0}
.sg-panel{opacity:0;pointer-events:none;transform:scale(.90);transition:opacity 1.8s ease 1s,transform 3s cubic-bezier(.18,.72,.2,1) .8s}
.sg-shell.is-open .sg-entry{opacity:0;transform:scale(1.08);filter:blur(12px);pointer-events:none}
.sg-shell.is-open .sg-panel{opacity:1;transform:scale(1);pointer-events:auto}
.sg-core{position:absolute;left:50%;top:46%;width:min(44vw,560px);aspect-ratio:1;transform:translate(-50%,-50%)}
.sg-d{position:absolute;inset:50%;border:1px solid rgba(219,231,255,.22);transform:translate(-50%,-50%) rotate(45deg);animation:b 7s ease-in-out infinite}
.d1{width:34%;height:34%}.d2{width:58%;height:58%;opacity:.65;animation-delay:-2.2s}.d3{width:82%;height:82%;opacity:.32;animation-delay:-4.4s}
.sg-light{position:absolute;left:50%;top:50%;width:12%;aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(255,250,235,.96) 0 12%,rgba(189,215,255,.82) 25%,rgba(84,132,255,.15) 55%,transparent 72%);box-shadow:0 0 48px rgba(255,250,235,.48),0 0 120px rgba(105,156,255,.16);animation:p 8.5s ease-in-out infinite}
.sg-nav{position:absolute;inset:0;pointer-events:none}.n{position:absolute;text-decoration:none;color:rgba(240,245,255,.82);font-size:20px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;pointer-events:auto;line-height:1.5;transition:color .35s ease,text-shadow .35s ease}
.n:before{content:"";display:inline-block;width:7px;height:7px;margin-right:.75rem;border-radius:50%;background:#e8eefc;box-shadow:0 0 15px rgba(183,210,255,.75);vertical-align:middle}
.n:hover,.n:focus-visible{color:rgba(255,255,255,.98);text-shadow:0 0 18px rgba(185,211,255,.28)}
.n-with-reveal{min-width:230px}
.n-with-reveal .n-main{display:inline-block}
.n-reveal{display:block;margin:.42rem 0 0 1.2rem;max-width:220px;color:rgba(235,242,255,.60);font-size:clamp(.58rem,.68vw,.72rem);letter-spacing:.08em;text-transform:none;white-space:nowrap;opacity:0;transform:translateY(4px);transition:opacity .35s ease,transform .35s ease}
.n-with-reveal:hover .n-reveal,.n-with-reveal:focus-visible .n-reveal{opacity:1;transform:translateY(0)}

.n1{left:12%;top:28%}.n2{left:18%;bottom:24%}.n3{right:10%;top:30%}.n4{right:17%;bottom:22%}
.sg-ai{position:absolute;left:50%;top:70%;width:min(760px,82vw);transform:translateX(-50%);text-align:center}.sg-ai h2{margin:.55rem 0 .3rem;font-family:Georgia,"Times New Roman",serif;font-size:clamp(2rem,4.5vw,4.5rem);font-weight:400;letter-spacing:.16em}@keyframes p{0%,100%{transform:translate(-50%,-50%) scale(.94);opacity:.82}50%{transform:translate(-50%,-50%) scale(1.08);opacity:1}}
@keyframes b{0%,100%{transform:translate(-50%,-50%) rotate(45deg) scale(.96)}50%{transform:translate(-50%,-50%) rotate(45deg) scale(1.04)}}
@keyframes da{from{transform:translate3d(-2%,0,0) rotate(-1deg)}to{transform:translate3d(4%,2%,0) rotate(1deg)}}
@keyframes db{from{transform:translate3d(2%,2%,0) rotate(1deg)}to{transform:translate3d(-3%,-2%,0) rotate(-1deg)}}
@media(max-width:760px){
  .sg-mark{top:13%;width:110px}
  .sg-copy h1{font-size:clamp(3.2rem,17vw,6.2rem);letter-spacing:.11em}
  .sg-core{width:82vw;top:43%}
  .sg-ai{top:68%}
  .n{font-size:.55rem;letter-spacing:.12em}
  .n1{left:6%;top:24%;max-width:43vw}
  .n2{left:7%;bottom:28%}
  .n3{right:5%;top:26%;max-width:42vw;text-align:right}
  .n4{right:6%;bottom:27%}
  .n-with-reveal{min-width:190px}
  .n-reveal{white-space:normal;max-width:180px}
}
@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important}
  .sg-entry,.sg-panel{transition:none!important}
  .n-reveal{transition:none!important}
}