html,body{width:100%;height:100%}
body.home{overflow:hidden}

.sun-glow{position:fixed;top:15%;left:70%;width:400px;height:400px;border-radius:50%;filter:blur(20px);pointer-events:none;transition:opacity 1.2s ease}
.sun-light{background:radial-gradient(circle,rgba(255,240,180,.6) 0%,rgba(255,220,150,.3) 20%,rgba(255,200,120,.1) 40%,transparent 70%)}
.sun-dark{background:radial-gradient(circle,rgba(120,140,200,.25) 0%,rgba(80,100,160,.15) 20%,rgba(60,80,140,.05) 40%,transparent 70%)}
.dark .sun-light{opacity:0} .dark .sun-dark{opacity:1}
.light .sun-light{opacity:1} .light .sun-dark{opacity:0}

.haze{position:fixed;top:30%;left:0;width:100%;height:20%;background:linear-gradient(to bottom,transparent,rgba(255,255,255,.15),transparent);filter:blur(30px);pointer-events:none;transition:opacity 1.2s ease}
.dark .haze{opacity:.2} .light .haze{opacity:1}

.hills{position:fixed;bottom:0;left:0;width:100%;height:40%;pointer-events:none;transition:opacity 1.2s ease}
.hills-light{background:radial-gradient(ellipse 80% 100% at 30% 100%,#2d5016 0%,#2d5016 40%,transparent 60%),radial-gradient(ellipse 90% 90% at 70% 100%,#3d6b1f 0%,#3d6b1f 40%,transparent 60%),radial-gradient(ellipse 60% 80% at 50% 100%,#4a7c25 0%,#4a7c25 40%,transparent 60%)}
.hills-dark{background:radial-gradient(ellipse 80% 100% at 30% 100%,#050a05 0%,#050a05 40%,transparent 60%),radial-gradient(ellipse 90% 90% at 70% 100%,#080f08 0%,#080f08 40%,transparent 60%),radial-gradient(ellipse 60% 80% at 50% 100%,#0a120a 0%,#0a120a 40%,transparent 60%)}
.dark .hills-light{opacity:0} .dark .hills-dark{opacity:1}
.light .hills-light{opacity:1} .light .hills-dark{opacity:0}

.vertical-line{position:fixed;top:0;left:30%;transform:translateX(-50%);width:6px;height:100%;border-radius:3px;z-index:5;transition:background 1.2s ease,box-shadow 1.2s ease,filter 1.2s ease,opacity 1.2s ease}
.horizontal-line{position:fixed;top:50%;left:0;transform:translateY(-50%);width:100%;height:6px;border-radius:3px;z-index:5;transition:background 1.2s ease,box-shadow 1.2s ease,filter 1.2s ease,opacity 1.2s ease}
.light .vertical-line{background:linear-gradient(to bottom,rgba(168,200,232,0) 0%,rgba(168,200,232,.1) 5%,rgba(192,221,240,.4) 15%,#c0ddf0 30%,#d4eaff 50%,#c0ddf0 70%,rgba(192,221,240,.4) 85%,rgba(168,200,232,.1) 95%,rgba(168,200,232,0) 100%);box-shadow:0 0 15px rgba(176,210,240,.6),0 0 30px rgba(176,210,240,.3);filter:grayscale(1) brightness(.85);opacity:.7}
.light .horizontal-line{background:linear-gradient(to right,rgba(168,200,232,0) 0%,rgba(168,200,232,.1) 5%,rgba(192,221,240,.4) 15%,#c0ddf0 30%,#d4eaff 50%,#c0ddf0 70%,rgba(192,221,240,.4) 85%,rgba(168,200,232,.1) 95%,rgba(168,200,232,0) 100%);box-shadow:0 0 15px rgba(176,210,240,.6),0 0 30px rgba(176,210,240,.3);filter:grayscale(1) brightness(.85);opacity:.7}
.dark .vertical-line,.dark .horizontal-line{background:#d4eaff;box-shadow:0 0 15px rgba(176,210,240,.8),0 0 30px rgba(176,210,240,.5),0 0 50px rgba(176,210,240,.3)}

.text-content{position:fixed;top:calc(50% - 40px);left:30%;transform:translateY(-100%) perspective(500px) rotateY(-25deg) rotateX(15deg);transform-origin:left bottom;margin-left:30px;color:#fff;font-family:Arial,sans-serif;font-size:56px;font-weight:bold;white-space:nowrap;text-shadow:0 0 10px rgba(255,255,255,.8),0 0 20px rgba(200,230,255,.5),0 0 30px rgba(150,200,255,.3),2px 2px 0 rgba(60,100,140,.6),4px 4px 0 rgba(40,80,120,.5),6px 6px 0 rgba(20,60,100,.4);z-index:10}

.menu{position:fixed;top:50%;left:30%;margin-top:50px;margin-left:40px;display:flex;flex-direction:column;gap:25px;z-index:10}
.menu-item{display:flex;align-items:center;gap:18px;padding:8px;border-radius:6px;cursor:pointer;transition:background .2s;text-decoration:none;color:#fff}
.menu-item:hover,.menu-item:active{background:rgba(255,255,255,.1)}
.menu-icon{width:64px;height:64px;border-radius:8px;box-shadow:0 2px 6px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.4);display:flex;align-items:center;justify-content:center;flex-shrink:0;position:relative;overflow:hidden}
.menu-icon::before{content:'';position:absolute;top:0;left:0;right:0;height:50%;background:linear-gradient(to bottom,rgba(255,255,255,.3),rgba(255,255,255,.05));pointer-events:none}
.menu-icon.tools{background:linear-gradient(to bottom,#f5a623 0%,#d68910 50%,#a8690a 100%)}
.menu-icon.research{background:linear-gradient(to bottom,#a8d8ff 0%,#5da5d4 50%,#2a6d9e 100%)}
.icon-svg{width:40px;height:40px;position:relative;z-index:1;filter:drop-shadow(0 1px 2px rgba(0,0,0,.5))}
.menu-text{display:flex;flex-direction:column}
.menu-title{font-size:24px;font-weight:400;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.7);line-height:1.1}
.menu-desc{font-size:13px;color:rgba(255,255,255,.85);text-shadow:0 1px 2px rgba(0,0,0,.6);font-style:italic;margin-top:2px}

@media (max-width:768px){
  body.home{overflow-y:auto;overflow-x:hidden}
  .sun-glow{width:280px;height:280px;top:8%;left:50%;transform:translateX(-50%)}
  .haze{top:25%}
  .vertical-line,.horizontal-line{display:none}
  .text-content{top:37%;left:50%;transform:translate(-50%,-110%);margin-left:0;font-size:44px;text-align:center}
  .menu{top:38%;left:50%;margin-top:30px;margin-left:0;transform:translateX(-50%);gap:18px;width:90%;max-width:340px}
  .menu-item{padding:10px;background:rgba(0,0,0,.25);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.1)}
  .menu-icon{width:52px;height:52px}
  .icon-svg{width:32px;height:32px}
  .menu-title{font-size:20px}
  .menu-desc{font-size:12px}
}
@media (max-width:380px){
  .text-content{font-size:36px}
  .menu{margin-top:24px;gap:14px}
  .menu-icon{width:46px;height:46px}
  .icon-svg{width:28px;height:28px}
  .menu-title{font-size:18px}
}
@media (max-height:500px) and (orientation:landscape){
  .text-content{font-size:32px;top:calc(50% - 20px)}
  .menu{margin-top:20px;gap:10px}
  .menu-icon{width:42px;height:42px}
  .icon-svg{width:26px;height:26px}
  .menu-title{font-size:16px}
  .menu-desc{font-size:11px}
}