*{box-sizing:border-box}
body{margin:0;font-family:Arial,sans-serif;background:#081122;color:#fff;overflow-x:hidden}

.nav{
position:fixed;top:0;width:100%;
padding:14px 30px;
display:flex;justify-content:space-between;align-items:center;
background:rgba(8,15,35,.35);
backdrop-filter:blur(18px);
z-index:100;
}

.brand{display:flex;gap:14px;align-items:center}
.brand img{height:50px}
.links a{margin-left:22px;color:white;text-decoration:none}

.hero{
min-height:100vh;
background:url(hero-bg.png) center center/cover no-repeat;
position:relative;
display:flex;
justify-content:center;
align-items:center;
overflow:hidden;
}

.overlay{
position:absolute;
inset:0;
background:linear-gradient(rgba(0,0,0,.18),rgba(0,0,0,.55));
}

/* LEFT ADJUSTED */
.jagannath-overlay{
position:absolute;
right:11%;
top:18%;
width:285px;
z-index:2;
animation:float 7s ease-in-out infinite;
filter:
drop-shadow(0 0 30px rgba(255,209,102,.45))
drop-shadow(0 12px 35px rgba(0,0,0,.35));
}

.jagannath-overlay img{
width:100%;
opacity:.94;
border-radius:28px;
mask-image:radial-gradient(circle,rgba(0,0,0,1) 58%,rgba(0,0,0,.15) 85%,transparent 100%);
-webkit-mask-image:radial-gradient(circle,rgba(0,0,0,1) 58%,rgba(0,0,0,.15) 85%,transparent 100%);
}

.hero-content{
position:relative;
z-index:5;
max-width:980px;
margin-left:14%;
margin-right:14%;
padding:120px 20px 80px;
text-align:center;
}

.hero-logo{width:125px;animation:pulse 3s infinite}

h1{
font-size:4.2rem;
line-height:1.08;
margin-bottom:20px;
}

.sub{font-size:1.1rem;margin-bottom:28px}

.cta{margin:30px 0 42px}

.btn{
display:inline-block;
padding:15px 24px;
margin:8px;
border-radius:42px;
font-weight:bold;
text-decoration:none;
color:white;
transition:.35s;
}

.btn:hover{transform:translateY(-6px) scale(1.04)}

.yt{background:#ff4d4d}
.ig{background:#ffb347}
.fb{background:#1877f2}

.wisdom-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:18px;
}

.card{
background:rgba(255,255,255,.10);
backdrop-filter:blur(18px);
padding:22px;
border-radius:22px;
box-shadow:0 15px 35px rgba(0,0,0,.22);
animation:float 6s ease-in-out infinite;
}

.card:nth-child(2){animation-delay:.6s}
.card:nth-child(3){animation-delay:1.2s}
.card:nth-child(4){animation-delay:1.8s}

footer{
text-align:center;
padding:44px;
background:#081020;
}
footer img{width:90px}

@keyframes float{
0%,100%{transform:translateY(0)}
50%{transform:translateY(-10px)}
}

@keyframes pulse{
0%,100%{transform:scale(1)}
50%{transform:scale(1.06)}
}

@media(max-width:1200px){
.hero-content{margin:0 8%}
.wisdom-grid{grid-template-columns:repeat(2,1fr)}
.jagannath-overlay{right:8%;width:220px}
}

@media(max-width:768px){
.links{display:none}
h1{font-size:2.3rem}
.wisdom-grid{grid-template-columns:1fr}
.hero-content{margin:0 5%}
.jagannath-overlay{
position:relative;
right:auto;
top:auto;
width:170px;
margin:100px auto 0;
}
}
