/* Aspheera public homepage — visual system 02 */

#hero {
  background:
    linear-gradient(120deg,rgba(61,255,138,.025),transparent 34%),
    radial-gradient(circle at 82% 42%,rgba(77,184,255,.04),transparent 34%),
    var(--bg);
}
#hero::after {
  background:
    linear-gradient(90deg,rgba(8,9,11,.12),transparent 58%),
    radial-gradient(ellipse 100% 78% at 50% 48%,transparent 20%,rgba(8,9,11,.72) 100%);
}
.hero-watermark {
  position:absolute; z-index:1; right:clamp(-3rem,1vw,1rem); top:50%;
  width:clamp(360px,43vw,720px); height:min(74vh,720px);
  transform:translateY(-48%); opacity:.052; pointer-events:none;
}
.hero-watermark img {
  position:absolute; inset:7% 12%; width:76%; height:86%; object-fit:contain;
  filter:grayscale(1) contrast(1.2) drop-shadow(0 0 24px rgba(61,255,138,.2));
}
.hero-watermark-line { position:absolute; left:50%; top:50%; background:linear-gradient(90deg,transparent,var(--green),var(--blue),transparent); opacity:.5; }
.hero-watermark-line.l1 { width:100%; height:1px; transform:translate(-50%,-50%) scaleX(0); }
.hero-watermark-line.l2 { width:1px; height:100%; transform:translate(-50%,-50%) scaleY(0); background:linear-gradient(transparent,var(--green),var(--blue),transparent); }
.home-ready .hero-watermark-line.l1 { animation:heroLineX .9s .25s var(--public-ease) forwards; }
.home-ready .hero-watermark-line.l2 { animation:heroLineY .9s .38s var(--public-ease) forwards; }
.home-ready .hero-watermark img { animation:heroMarkSet .8s .3s backwards var(--public-ease); }
@keyframes heroLineX { to{transform:translate(-50%,-50%) scaleX(1)} }
@keyframes heroLineY { to{transform:translate(-50%,-50%) scaleY(1)} }
@keyframes heroMarkSet { from{opacity:0;transform:translateY(16px) scale(.94)} }
.hero-watermark-code {
  position:absolute; right:4%; bottom:5%; font-family:'Share Tech Mono',monospace;
  font-size:.52rem; line-height:1.7; letter-spacing:.18em; text-align:right; color:var(--white);
}
@media(min-width:1100px){.hero-inner{max-width:min(64vw,980px)}}

#about,#divisions,#access { isolation:isolate; }
#about-field,#division-field,#access-field {
  position:absolute; inset:0; z-index:0; width:100%; height:100%; pointer-events:none;
}
#about::after,#divisions::after,#access::after {
  content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
}
#about::after { background:linear-gradient(90deg,var(--bg2) 0%,transparent 42%,transparent 78%,var(--bg2) 100%); }
#divisions::after { background:linear-gradient(180deg,var(--bg) 0%,transparent 18%,transparent 84%,var(--bg) 100%); }
#access::after { background:linear-gradient(90deg,var(--bg2) 0%,transparent 30%,transparent 72%,var(--bg2) 100%); }
.about-grid,.div-hdr,.div-grid,.access-grid { z-index:2; }

.about-grid { gap:clamp(3rem,7vw,7rem); }
.about-text { padding-top:1rem; }
.about-panel {
  position:relative; overflow:hidden;
  background:linear-gradient(145deg,rgba(19,22,25,.96),rgba(10,13,16,.92));
  box-shadow:22px 22px 0 rgba(0,0,0,.08);
}
.about-panel::before {
  content:'01'; position:absolute; right:1rem; top:.7rem; font-family:'Exo 2',sans-serif;
  font-size:5rem; font-weight:800; line-height:1; color:var(--white); opacity:.025;
}
.about-panel .prow { position:relative; padding:.85rem .4rem; transition:padding-left .28s var(--public-ease),background-color .25s; }
.about-panel .prow:hover { padding-left:.75rem; background:rgba(61,255,138,.018); }

#divisions { padding-top:8rem; padding-bottom:8rem; }
.div-hdr { display:grid; grid-template-columns:180px 1fr; align-items:end; gap:2rem; }
.div-hdr .s-label { align-self:start; }
.div-grid { gap:12px; background:transparent; }
.dc {
  min-height:430px; border:1px solid rgba(238,242,240,.07);
  background:linear-gradient(145deg,rgba(13,15,19,.96),rgba(8,9,11,.9));
  transition:transform .42s var(--public-ease),border-color .3s,background-color .3s;
}
.dc::before {
  content:attr(data-division); position:absolute; right:1.1rem; top:.7rem;
  font-family:'Exo 2',sans-serif; font-weight:800; font-size:clamp(5rem,10vw,8.5rem);
  line-height:1; letter-spacing:-.08em; color:var(--white); opacity:.024;
  transition:opacity .35s,transform .5s var(--public-ease);
}
.dc:hover,.dc:focus-visible { transform:translateY(-6px); border-color:rgba(238,242,240,.16); }
.dc:hover::before,.dc:focus-visible::before { opacity:.055; transform:translate(-5px,5px); }
.dc-icon { position:relative; overflow:hidden; }
.dc-icon::after {
  content:''; position:absolute; inset:-40%; background:linear-gradient(115deg,transparent 38%,rgba(255,255,255,.16),transparent 62%);
  transform:translateX(-80%); transition:transform .65s var(--public-ease);
}
.dc:hover .dc-icon::after,.dc:focus-visible .dc-icon::after { transform:translateX(80%); }
.dc-title { font-size:1.35rem; }
.dc-tartarus { min-height:500px; background:linear-gradient(125deg,rgba(10,22,15,.88),rgba(10,13,16,.96) 48%,rgba(8,14,17,.94)); }
.dc-tartarus::before { font-size:12rem; }
.dc-g:not(.dc-tartarus) { background:linear-gradient(145deg,rgba(25,20,16,.52),rgba(13,15,19,.96) 52%); }
.dc-b { background:linear-gradient(145deg,rgba(10,21,26,.7),rgba(16,12,25,.78)); }
.dc-n { background:linear-gradient(135deg,rgba(8,22,27,.68),rgba(10,16,23,.92)); }
.dc-n .dc-bar { background:linear-gradient(90deg,#5ccfe0,#397eb8)!important; }
.dc-n .dc-spec::before { background:#69c9d8; }

.access-grid { align-items:center; }
.login-box {
  position:relative; overflow:hidden;
  background:linear-gradient(150deg,rgba(8,9,11,.98),rgba(10,17,19,.94));
  box-shadow:-22px 22px 0 rgba(0,0,0,.07);
}
.login-box::before {
  content:''; position:absolute; right:-70px; top:-70px; width:170px; height:170px;
  border:1px solid rgba(77,184,255,.09); transform:rotate(45deg); pointer-events:none;
}
.finput { transition:border-color .25s,background-color .25s,box-shadow .25s; }
.finput:focus { border-color:rgba(77,184,255,.38); box-shadow:inset 2px 0 0 var(--blue); }

[data-theme="light"] #hero {
  background:
    linear-gradient(120deg,rgba(0,125,65,.04),transparent 36%),
    radial-gradient(circle at 82% 42%,rgba(0,105,180,.055),transparent 34%),
    #f0f3f5;
}
[data-theme="light"] #hero::after {
  background:radial-gradient(ellipse 105% 82% at 50% 48%,transparent 24%,rgba(232,237,240,.72) 100%);
}
[data-theme="light"] .hero-watermark { opacity:.065; }
[data-theme="light"] .about-panel,
[data-theme="light"] .dc,
[data-theme="light"] .login-box {
  background:linear-gradient(145deg,rgba(250,252,253,.96),rgba(222,228,232,.9));
  box-shadow:18px 18px 0 rgba(40,58,68,.045);
}
[data-theme="light"] .dc-tartarus { background:linear-gradient(125deg,rgba(220,239,228,.96),rgba(239,243,245,.94) 52%,rgba(222,236,242,.92)); }
[data-theme="light"] .dc-g:not(.dc-tartarus) { background:linear-gradient(145deg,rgba(242,232,222,.9),rgba(235,240,242,.96)); }
[data-theme="light"] .dc-b { background:linear-gradient(145deg,rgba(218,241,240,.88),rgba(231,224,241,.84)); }
[data-theme="light"] .dc-n { background:linear-gradient(135deg,rgba(216,239,242,.9),rgba(224,235,242,.94)); }
[data-theme="light"] .login-box { background:linear-gradient(145deg,rgba(247,250,251,.98),rgba(220,234,237,.94)); }

@media(max-width:900px){
  .hero-watermark{right:-34%;width:78vw;opacity:.025}
  .hero-watermark-code{display:none}
  .div-hdr{grid-template-columns:1fr;gap:.5rem}
  .div-grid{gap:8px}.dc{min-height:0}.dc-tartarus{min-height:0}
}
@media(max-width:620px){.hero-watermark{display:none}.div-grid{gap:6px}}
@media(prefers-reduced-motion:reduce){
  .hero-watermark-line.l1{transform:translate(-50%,-50%) scaleX(1)}
  .hero-watermark-line.l2{transform:translate(-50%,-50%) scaleY(1)}
  .hero-watermark img{animation:none!important}
}