*{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;-webkit-font-smoothing:antialiased}.hero-page{background:#000;min-height:100vh}.nav{background:#fff;box-shadow:0 10px 15px -3px rgba(0,0,0,.1);left:0;position:fixed;right:0;top:0;z-index:1}.nav-inner{align-items:center;display:flex;height:4rem;justify-content:space-between;margin:0 auto;max-width:80rem;padding:0 1rem}.logo{cursor:pointer;height:2.5rem;width:auto}.nav-desktop{align-items:center;display:none;gap:2rem}.nav-btn{background:none;border:none;color:#374151;cursor:pointer;font-weight:500;padding:.5rem 1rem;transition:color .15s}.nav-btn:hover{color:#111827}.btn-primary{background:linear-gradient(90deg,#9333ea,#2563eb);border:none;border-radius:.5rem;color:#fff;cursor:pointer;font-weight:600;padding:.625rem 1.5rem;transition:all .2s}.btn-primary:hover{background:linear-gradient(90deg,#7e22ce,#1d4ed8)}.menu-btn{background:none;border:none;cursor:pointer;display:block;padding:.5rem}@media (min-width:1024px){.menu-btn{display:none!important}}.mobile-menu{background:#fff;box-shadow:0 20px 25px -5px rgba(0,0,0,.1);padding:1rem}.mobile-link{background:none;border:none;color:#374151;cursor:pointer;display:block;font:inherit;padding:.5rem 0;text-align:left;width:100%}.mobile-link:hover{color:#111827}.hero-container{height:100vh;position:relative}.hero-container,.hero-mobile{display:flex;flex-direction:column}.hero-mobile{flex:1}.hero-desktop{display:none}.visually-hidden{height:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;width:1px!important;clip:rect(0,0,0,0)!important;border:0!important;white-space:nowrap!important}.section{background:#000;flex:1;min-height:400px}.section,.section-desktop{cursor:pointer;overflow:hidden;position:relative}.section-desktop{height:100%;transition:width .7s;width:33.333%}.section-desktop.hovered{width:60%}.section-desktop.compressed{width:20%}.section-img{height:100%;object-fit:cover;width:100%}.overlay,.section-img{inset:0;position:absolute}.overlay{opacity:.9;transition:opacity .3s}.overlay-blue{background:linear-gradient(90deg,#2563eb,#1d4ed8)}.overlay-green{background:linear-gradient(90deg,#16a34a,#15803d)}.overlay-purple{background:linear-gradient(90deg,#9333ea,#7e22ce)}.section-desktop:hover .overlay{opacity:.85}.section-content{color:#fff;flex-direction:column;height:100%;padding:2rem;position:relative;text-align:center}.icon-container,.section-content{align-items:center;display:flex;justify-content:center}.icon-container{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:hsla(0,0%,100%,.2);border-radius:1.5rem;height:4rem;margin:0 auto 1rem;transition:all .7s;width:4rem}.icon-container svg{height:2rem;transition:all .7s;width:2rem}.title-container{margin-bottom:1rem;transition:all .7s}.section-title{font-size:1.875rem;font-weight:700;text-align:center;transition:all .7s}.section-subtitle{font-size:.875rem;margin-bottom:1rem;opacity:.9}.section-description{font-size:1.125rem;margin-left:auto;margin-right:auto;max-width:28rem;text-align:center}.section-description,.section-features{margin-bottom:2rem;max-height:0;opacity:0;overflow:hidden;transition:all .7s}.features-grid{display:grid;gap:1rem;grid-template-columns:1fr 1fr;margin:0 auto;max-width:28rem}.feature-item{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:hsla(0,0%,100%,.1);border-radius:.5rem;font-size:.875rem;gap:.5rem;padding:.5rem 1rem}.feature-item,.section-buttons{align-items:center;display:flex}.section-buttons{flex-direction:column;gap:.75rem;justify-content:center;max-width:320px;width:100%}.section-btn{align-items:center;background:#fff;border:none;border-radius:.5rem;color:#111827;cursor:pointer;display:flex;font-weight:600;gap:.5rem;padding:.75rem 1.5rem;transition:all .7s}.section-btn:hover{background:#f3f4f6}.section-btn-secondary{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:hsla(0,0%,100%,.1);border:2px solid hsla(0,0%,100%,.3);border-radius:.5rem;color:#fff;cursor:pointer;font-weight:600;opacity:0;padding:.75rem 1.5rem;transform:translateY(1rem);transition:all .7s}.section-btn-secondary:hover{background:hsla(0,0%,100%,.2);border-color:hsla(0,0%,100%,.5)}@media (min-width:640px){.nav-inner{padding:0 1.5rem}}@media (min-width:1024px){.nav-inner{height:5rem;padding:0 2rem}.logo{height:3.5rem}.nav-desktop{display:flex}.hero-mobile{display:none}.hero-desktop{display:flex;flex:1}.hero-container{height:100vh}.section-buttons{flex-direction:row;gap:1rem;max-width:480px;opacity:0;transform:translateY(1rem);transition:all .7s}}.section-desktop.hovered .title-container{margin-bottom:2rem}.section-desktop.hovered .icon-container{height:5rem;margin-bottom:1rem;width:5rem}.section-desktop.hovered .icon-container svg{height:2.5rem;width:2.5rem}.section-desktop.hovered .section-title{font-size:3rem}.section-desktop.hovered .section-subtitle{font-size:1.5rem;font-weight:300}.section-desktop.hovered .section-description{max-height:200px;opacity:1}.section-desktop.hovered .section-features{max-height:400px;opacity:1}.section-desktop.hovered .section-btn-secondary,.section-desktop.hovered .section-buttons{opacity:1;transform:translateY(0)}.section-desktop.compressed .icon-container{height:4rem;width:4rem}.section-desktop.compressed .icon-container svg{height:2rem;width:2rem}.section-desktop.compressed .section-title{font-size:1.5rem}.section-desktop.compressed .section-btn,.section-desktop.compressed .section-btn-secondary,.section-desktop.compressed .section-buttons{opacity:0;transform:translateY(1rem)}