/*
Theme Name: NEEDDAT
Author: NEEDDAT LTD
Description: Custom NEEDDAT landing page.
Version: 1.0
*/

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{background:#000;color:#fff;font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.navbar{position:fixed;top:0;left:0;width:100%;height:78px;padding:0 5%;display:flex;align-items:center;justify-content:space-between;background:rgba(0,0,0,.88);border-bottom:1px solid rgba(165,92,255,.22);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);z-index:1000}
.logo{flex-shrink:0}.logo img{width:145px;transition:transform .3s ease,filter .3s ease}.logo:hover img{transform:scale(1.03);filter:drop-shadow(0 0 12px rgba(160,90,255,.45))}
.nav-links{display:flex;align-items:center;gap:34px}.nav-links a{position:relative;font-size:14px;font-weight:700;transition:color .25s ease}.nav-links a::after{content:"";position:absolute;left:0;bottom:-7px;width:0;height:1px;background:#a56aff;transition:width .25s ease}.nav-links a:hover{color:#b98aff}.nav-links a:hover::after{width:100%}
.hero{min-height:100vh;padding:140px 10% 100px;display:flex;align-items:center;position:relative;overflow:hidden;background:radial-gradient(circle at 80% 50%,rgba(113,45,190,.16),transparent 38%),#000}
.hero::before{content:"";position:absolute;width:500px;height:500px;right:-180px;top:20%;background:rgba(120,50,220,.08);filter:blur(100px);pointer-events:none}
.hero-content{position:relative;z-index:1;max-width:1000px;animation:heroReveal .9s ease both}
.eyebrow{margin-bottom:24px;color:#ad75ff;font-size:13px;font-weight:800;letter-spacing:.3em}
h1{max-width:1000px;font-size:clamp(3.5rem,8vw,8rem);line-height:.9;letter-spacing:-.055em;font-weight:800}
h1 span,h2 span{background:linear-gradient(110deg,#d0b0ff,#8c45ff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hero-text{max-width:650px;margin-top:38px;color:#a9a9a9;font-size:20px;line-height:1.6}
.button{display:inline-flex;align-items:center;justify-content:center;margin-top:38px;padding:16px 25px;border:1px solid #9c5cff;border-radius:4px;color:#fff;font-size:12px;font-weight:800;letter-spacing:.12em;background:linear-gradient(135deg,rgba(145,75,255,.18),rgba(145,75,255,.04));box-shadow:0 0 25px rgba(145,75,255,.08);transition:transform .25s ease,box-shadow .25s ease,background .25s ease}.button:hover{transform:translateY(-3px);background:linear-gradient(135deg,rgba(145,75,255,.35),rgba(145,75,255,.08));box-shadow:0 0 30px rgba(145,75,255,.25)}
.section{padding:140px 10%;position:relative;border-top:1px solid rgba(165,92,255,.12);background:radial-gradient(circle at 90% 20%,rgba(110,40,180,.07),transparent 35%),#000}
.section-label{margin-bottom:28px;color:#a66cff;font-size:12px;font-weight:800;letter-spacing:.28em}
h2{max-width:900px;font-size:clamp(3rem,6vw,6.5rem);line-height:.95;letter-spacing:-.05em;font-weight:800}
.section-text{max-width:700px;margin-top:35px;color:#999;font-size:20px;line-height:1.65}
.concept-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin-top:75px}.concept-card{min-height:280px;padding:54px;border:1px solid rgba(166,108,255,.28);border-radius:10px;background:radial-gradient(circle at 90% 0%,rgba(130,60,220,.14),transparent 45%),#050505;transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease}.concept-card:hover{transform:translateY(-7px);border-color:rgba(166,108,255,.65);box-shadow:0 15px 45px rgba(100,30,190,.12)}.concept-card h3{margin-bottom:22px;font-size:31px;line-height:1.1}.concept-card p{color:#999;font-size:17px;line-height:1.7}
.location-content,.contact-layout{display:grid;gap:80px;margin-top:75px}.location-content{grid-template-columns:.9fr 1.1fr}.contact-layout{grid-template-columns:.85fr 1.15fr}.location-points{display:flex;flex-direction:column;gap:35px}.location-point{display:grid;grid-template-columns:45px 1fr;column-gap:18px;padding-bottom:30px;border-bottom:1px solid rgba(255,255,255,.08)}.location-point:last-child{border-bottom:none}.location-point>span{color:#a66cff;font-size:13px;font-weight:800}.location-point h3{font-size:23px}.location-point p{grid-column:2;margin-top:10px;color:#888;font-size:16px;line-height:1.6}
.contact-details{padding:55px 60px;border:1px solid rgba(166,108,255,.55);border-radius:10px;background:radial-gradient(circle at 100% 0%,rgba(125,58,220,.18),transparent 45%),rgba(5,5,5,.75);box-shadow:0 0 60px rgba(110,40,190,.08)}.contact-label{margin-bottom:35px;color:#a66cff;font-size:12px;font-weight:800;letter-spacing:.28em}.contact-item{display:flex;align-items:center;gap:20px;width:fit-content;margin-bottom:25px;font-size:31px;font-weight:700;transition:color .25s ease,transform .25s ease}.contact-item:hover{color:#b98aff;transform:translateX(5px)}.contact-icon{width:58px;height:58px;display:flex;align-items:center;justify-content:center;flex-shrink:0;border:1px solid rgba(166,108,255,.55);border-radius:50%;color:#a66cff;font-size:18px}.contact-note{max-width:600px;margin-top:35px;color:#777;font-size:15px;line-height:1.6}
footer{padding:30px 10%;border-top:1px solid rgba(165,92,255,.12);color:#666;font-size:12px}
@keyframes heroReveal{from{opacity:0;transform:translateY(25px)}to{opacity:1;transform:translateY(0)}}
@media (max-width:900px){.navbar{padding:0 5%}.nav-links{gap:20px}.hero,.section{padding-left:7%;padding-right:7%}.location-content,.contact-layout{grid-template-columns:1fr;gap:55px}}
@media (max-width:768px){html{scroll-padding-top:75px}.navbar{height:72px;padding:0 18px;gap:10px}.logo img{width:118px}.nav-links{gap:12px;flex-shrink:1}.nav-links a{font-size:10px;white-space:nowrap}.nav-links a::after{display:none}.hero{min-height:auto;padding:145px 24px 100px;align-items:flex-start}.eyebrow{margin-bottom:20px;font-size:10px;letter-spacing:.22em}h1{font-size:clamp(3rem,15vw,5rem);line-height:.92}.hero-text{margin-top:30px;font-size:17px}.button{width:100%;padding:16px 18px}.section{padding:95px 24px}.section-label{margin-bottom:22px;font-size:10px;letter-spacing:.22em}h2{font-size:clamp(3rem,14vw,5rem)}.section-text{margin-top:28px;font-size:17px}.concept-grid{grid-template-columns:1fr;gap:16px;margin-top:50px}.concept-card{min-height:auto;padding:38px 30px}.concept-card h3{margin-bottom:17px;font-size:28px}.concept-card p{font-size:16px}.location-content{margin-top:50px;gap:50px}.location-point{grid-template-columns:35px 1fr;column-gap:12px}.location-point h3{font-size:21px}.location-point p{font-size:15px}.contact-layout{margin-top:50px;gap:45px}.contact-details{padding:38px 28px}.contact-label{margin-bottom:28px;font-size:10px;line-height:1.5}.contact-item{gap:14px;width:100%;font-size:clamp(17px,5vw,25px);overflow-wrap:anywhere}.contact-icon{width:48px;height:48px;font-size:15px}.contact-note{margin-top:30px;font-size:14px}footer{padding:28px 24px;text-align:center}}
@media (max-width:380px){.navbar{padding:0 12px}.logo img{width:100px}.nav-links{gap:8px}.nav-links a{font-size:8px}.hero,.section{padding-left:20px;padding-right:20px}.contact-details{padding:34px 22px}.contact-item{font-size:16px}.contact-icon{width:44px;height:44px}}