.hero-section{background:linear-gradient(184deg,#ffffff,#ffffffeb),url(/back.jpg);padding:calc(var(--header-height) + 1rem) 2rem 4rem 2rem;background-attachment:fixed}.hero-container{display:flex;padding:4rem 1rem;gap:2rem;border-radius:10px;align-items:center;width:100%}.hero-container .content{flex:1.5 1}.hero-container .hero-image-container{flex:1 1}.hero-container .data{grid-area:3/1/4/3}.hero-container .content{display:flex;flex-direction:column;gap:2rem}.hero-container .content h1{font-size:clamp(4rem,5vw,8rem);margin:1rem 0;color:rgb(25 94 171)}.header-container{overflow:hidden;background-color:var(--main-color);background-color:#195eab;background:linear-gradient(45deg,#195eab,#0a97ff);box-shadow:0 2px 4px rgba(0,0,0,.4),0 7px 13px -3px rgba(0,0,0,.3),inset 0 -3px 0 rgba(0,0,0,.2);color:#ffffff;margin:2rem 0}.header-container,.hero-container h2{width:-moz-fit-content;width:fit-content;padding:.4rem 1rem;border-radius:10px}.hero-container h2{display:flex;align-items:center;gap:.6rem;color:#098f3e;font-family:var(--font-mono);font-size:2rem;background:#d7ffee;font-weight:400}.hero-container .content ul{display:flex;flex-direction:column;gap:2rem}.hero-container .content ul li{display:flex;align-items:center;gap:.8rem}.hero-container .content ul li svg{color:var(--main-color)}.hero-container .content button{border-radius:10px;box-shadow:inset 0 13px 27px -5px rgba(255,136,24,.25),inset 0 8px 16px -8px rgba(252,252,252,.5);transition:all .2s}.hero-container .content button:hover{filter:brightness(1.2)}.call-to-action-btns{display:flex;gap:1rem}.call-to-action-btns button{display:flex;gap:.5rem;text-transform:capitalize}.call-to-action-btns button svg{font-size:2.2rem}.hero-container .hero-image-container{padding:1rem;width:min(100%,60rem)}.hero-container .hero-image-container img{position:relative;border-radius:50%}.hero-container .hero-image-container div{position:relative}.hero-container .hero-image-container div span{content:" ";height:100%;width:100%;background:linear-gradient(261deg,#ffad77a3,#ffffff00);position:absolute;left:0;top:-4px;border-radius:63%;box-shadow:0 25px 20px -20px rgba(0,0,0,.45)}@media (max-width:768px){.hero-container{flex-direction:column;gap:4rem}}@media (max-width:480px){.hero-container h2{font-size:1.8rem}.hero-section{padding:2rem}}@media (max-width:410px){.hero-container h2{font-size:1.5rem}}