@import url(https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,100,0,0);
@font-face {font-family: 'Geist Sans';font-style: normal;font-display: swap;font-weight: 200;src: url(https://cdn.jsdelivr.net/fontsource/fonts/geist-sans@latest/latin-200-normal.woff2) format('woff2'), url(https://cdn.jsdelivr.net/fontsource/fonts/geist-sans@latest/latin-200-normal.woff) format('woff');}
@font-face {font-family: 'Geist Sans';font-style: normal;font-display: swap;font-weight: 500;src: url(https://cdn.jsdelivr.net/fontsource/fonts/geist-sans@latest/latin-500-normal.woff2) format('woff2'), url(https://cdn.jsdelivr.net/fontsource/fonts/geist-sans@latest/latin-500-normal.woff) format('woff');}
@font-face {font-family: 'Geist Sans';font-style: normal;font-display: swap;font-weight: 700;src: url(https://cdn.jsdelivr.net/fontsource/fonts/geist-sans@latest/latin-700-normal.woff2) format('woff2'), url(https://cdn.jsdelivr.net/fontsource/fonts/geist-sans@latest/latin-700-normal.woff) format('woff');}

* { margin:0;padding:0;box-sizing:border-box;}
html{max-height: 100dvh;scroll-behavior:smooth;}
body{font-family: 'Geist Sans', sans-serif; font-size: 16px; }
a{color:inherit;text-decoration:none;font-family:inherit;font-size:inherit;font-weight: 500;}
section{min-height:calc(100dvh - 65px);padding-top:65px;}
nav{overflow-x:auto;width:fit-content;}
nav::-webkit-scrollbar{appearance: none;width:0;height:0}
nav a {white-space: nowrap;}

.menu-section {background-color: #f9f9f911;backdrop-filter: blur(20px);-webkit-backdrop-filter: blur(20px);padding: 1rem;position: sticky;top:0;z-index: 1;}
.hero div:first-child{gap: 2rem}
.wsn {white-space: nowrap;}
.mw100{max-width:100%;}.mw75{max-width:75%;}.mw50{max-width:50%;}.mw25{max-width:25%}
.w100{width:100%;}.w75{width:75%;}.w50{width:50%;}.w25{width:25%}
.h100{height:100%;}.h75{height:75%;}.h50{height:50%;}.h25{height:25%}
.max {max-width: 1400px;width:100%;margin:auto}
.flex {display:flex;flex-direction:row;gap:0.5rem;align-items:center;}
.flex-col {display:flex;flex-direction:column;gap:0.5rem;align-items:center;}
.wrap{flex-wrap:wrap;}
.g0{gap:0}.g2{gap:2rem}.g3{gap:3rem}
.m0{margin:0;}.m1{margin:1rem;}
.p0{padding:0}.p1{padding:1rem;}
.mt1{margin-top:1rem;}.mb1{margin-bottom:1rem;}.ml1{margin-left:1rem;}.mr1{margin-right:1rem;}
.pt1{padding-top:1rem;}.pb1{padding-bottom:1rem;}.pl1{padding-left:1rem;}.pr1{padding-right:1rem;}
.jcfs {justify-content:flex-start;}.jcc {justify-content:center;}.jcfe {justify-content:flex-end;}.jcsb {justify-content: space-between;}
.aifs {align-items:flex-start;}.aic {align-items:center;}.aife {align-items:flex-end;}
.cta { background-color:#f9882e;font-size:1.1rem;min-width:150px;min-height:52px;display:flex;justify-content:center; align-items:center;border-radius:2rem;transition: 300ms ease-in-out;}
button{ border:none; align-self: center; cursor: pointer; min-height: auto !important; min-width: auto !important; padding: 0.5rem 1rem; }
.secondary { background-color:#999}
.cta:hover {background-color: #444; color:#fff}
.img-left{max-width:50%;object-fit:cover;border-radius:50%;border-top-right-radius:0;}
.img-right{max-width:50%;object-fit:cover;border-radius:50%;border-top-left-radius:0;}


f1{margin-top:50px;font-weight:bold;font-size:4.25rem;line-height:1;letter-spacing:-4px;width:100%;color:#444}
f2{font-size: 2rem;font-weight:bold;letter-spacing:-1px;opacity:0.75;}
p1{line-height: 2rem; font-size: 1.2rem; opacity: 0.5;}

grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:2rem;width:100%}
.box {border:1px solid #eee; border-radius:1rem; padding:1rem;box-shadow: 0 0 8px 4px #ddd;transition: background-color 300ms ease-in-out}
.box h2{padding-bottom:1rem;opacity:0.65}
.box p{ opacity:0.75;line-height:1.5rem;margin-right:80px;}
.o0{opacity:0;}.o25{opacity:0.25;}.o5{opacity:0.5;}.o75{opacity:0.75;}.o1{opacity:1;}
.icon{font-size:80px;color:#f9882e}
.box:hover{background-color:#f9882e22;cursor:default;}
.hero-content{align-items: flex-start;}

.show-menu-bar {animation: showmenu 300ms ease-in-out forwards;}
@keyframes showmenu {
    from{top:-50px}
    to{top:0}
}

@media screen and (max-width: 1000px)
{
    .mw75{max-width: unset;}
    section{padding-top:40px}
    grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
    .hero div:first-child { flex-direction: column; gap:1rem;padding:0 }
    .hero div:first-child f1 { font-size: 2.25rem;letter-spacing: -2px; }
    .hero div:first-child .img-left,
    .hero div:first-child .img-right { max-width: 75%; }
    .hero-content{align-items: center;text-align: center;}
}

@media screen and (max-width: 500px)
{
    .mw75{max-width: unset;}
    /* grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}     */
    /* .hero div:first-child { flex-direction: column; gap:1rem} */
    /* .hero div:first-child f1 { font-size: 2.25rem;letter-spacing: -2px; } */
    .hero div:first-child .img-left,
    .hero div:first-child .img-right { max-width: 100%; }
    .menu-section{top:auto}
    .desktop{display:none;}    
    .mw50 {max-width: 100% !important;}
    .mobile-center{text-align: center;}
}