body{
margin:0;
font-family:'Poppins',sans-serif;
}

/* NAV */
.navbar{
display:flex;
justify-content:space-between;
padding:15px 40px;
background:#000;
color:white;
}

/* HERO */
.hero{
height:100vh;
background:url('static/images/hero.jpg') center/cover;
position:relative;
}

.overlay{
position:absolute;
width:100%;
height:100%;
background:rgba(0,0,0,0.6);
}

.hero-content{
position:absolute;
top:30%;
left:10%;
color:white;
}

/* BG */
.bg-page{
background:url('static/images/bhutan.jpg') center/cover;
min-height:100vh;
}

/* GLASS */
.glass-box{
background:rgba(0,0,0,0.6);
padding:30px;
margin:60px auto;
width:60%;
border-radius:10px;
color:white;
}

/* IKIGAI */
.ikigai{
display:flex;
justify-content:center;
gap:20px;
}

.circle{
width:120px;
height:120px;
border-radius:50%;
background:linear-gradient(#00ffcc,#0077ff);
display:flex;
align-items:center;
justify-content:center;
color:white;
cursor:pointer;
}

.circle:hover{
transform:scale(1.1);
}

/* CARDS */
.cards{
display:flex;
justify-content:center;
gap:20px;
flex-wrap:wrap;
}

.card{
background:white;
padding:10px;
width:200px;
border-radius:10px;
text-align:center;
}

.card img{
width:100%;
}

/* BAR */
.bar{
background:#ccc;
height:20px;
border-radius:10px;
}

#fill{
background:#00ffcc;
height:100%;
width:50%;
}

/* BOX */
.insight-box{
background:#ffcc33;
padding:10px;
margin-top:10px;
border-radius:10px;
}

/* SECTION */
.section{
padding:50px;
text-align:center;
}

.section.dark{
background:linear-gradient(#0f2027,#2c5364);
color:white;
}