:root{timeline-scope:--s1,--s2,--s3,--s4,--s5}.hero-wrapper{position:relative}.sticky-visual{float:right;z-index:10;pointer-events:none;place-items:center;width:50%;height:100vh;display:grid;position:sticky;top:0}.sticky-visual:before{content:"";background:linear-gradient(to bottom,transparent,color-mix(in srgb,var(--color-light)10%,transparent)25%,color-mix(in srgb,var(--color-accent)14%,transparent)50%,color-mix(in srgb,var(--color-light)10%,transparent)75%,transparent);width:1px;position:absolute;top:0;bottom:0;left:0}[dir=rtl] .sticky-visual{float:left}[dir=rtl] .sticky-visual:before{left:auto;right:0}.shape-container{opacity:0;direction:ltr;place-items:center;width:400px;height:400px;animation-name:shape-fade;animation-timing-function:cubic-bezier(.4,0,.2,1);animation-fill-mode:both;display:grid;position:absolute}.shape-1{animation-timeline:--s1}.shape-2{animation-timeline:--s2}.shape-3{animation-timeline:--s3}.shape-4{animation-timeline:--s4}.shape-5{animation-timeline:--s5}.visual-browser{border:1px solid color-mix(in srgb,var(--color-light)20%,transparent);background:color-mix(in srgb,var(--color-light)3%,transparent);width:320px;height:220px}.browser-bar{border-bottom:1px solid color-mix(in srgb,var(--color-light)15%,transparent);align-items:center;gap:6px;height:32px;padding-left:12px;display:flex}.browser-bar span{background:color-mix(in srgb,var(--color-light)20%,transparent);border-radius:50%;width:10px;height:10px}.browser-bar span:first-child{background:var(--color-accent)}.browser-content{justify-content:center;align-items:center;padding:20px;display:flex}.pixel-grid{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.pixel-grid span{background:color-mix(in srgb,var(--color-accent)30%,transparent);width:32px;height:32px;animation:2s ease-in-out infinite pixel-pulse}.pixel-grid span:nth-child(odd){animation-delay:.5s}.pixel-grid span:nth-child(3n){background:color-mix(in srgb,var(--color-light)15%,transparent)}@keyframes pixel-pulse{0%,to{opacity:.4}50%{opacity:1}}.visual-stack{perspective:800px;flex-direction:column;gap:16px;display:flex}.stack-layer{letter-spacing:.15em;text-transform:uppercase;border:1px solid color-mix(in srgb,var(--color-light)20%,transparent);justify-content:center;align-items:center;width:260px;height:60px;font-size:.85rem;font-weight:500;display:flex;transform:rotateX(15deg)}.stack-frontend{background:linear-gradient(90deg,color-mix(in srgb,var(--color-accent)20%,transparent),transparent);color:var(--color-accent);border-color:color-mix(in srgb,var(--color-accent)40%,transparent)}.stack-backend{background:color-mix(in srgb,var(--color-light)5%,transparent);color:var(--color-light)}.stack-db{background:color-mix(in srgb,var(--color-light)3%,transparent);color:color-mix(in srgb,var(--color-light)50%,transparent)}.terminal-cursor{animation:1s step-end infinite cursor-blink}@keyframes cursor-blink{0%,to{opacity:1}50%{opacity:0}}.hero-content{z-index:20;width:50%;padding-bottom:20vh;position:relative}[dir=rtl] .hero-content{margin-left:auto}.scroll-section{view-timeline-axis:block;view-timeline-inset:40% 40%;flex-direction:column;justify-content:center;height:100vh;padding-left:10vw;padding-right:2rem;display:flex}[dir=rtl] .scroll-section{padding-left:2rem;padding-right:10vw}.s1{view-timeline-name:--s1}.s2{view-timeline-name:--s2}.s3{view-timeline-name:--s3}.s4{view-timeline-name:--s4}.s5{view-timeline-name:--s5}.chapter-tag{letter-spacing:.4em;color:color-mix(in srgb,var(--color-accent)80%,transparent);align-items:center;gap:1rem;margin:0 0 1.5rem;font-size:.75rem;display:flex;animation:linear both tag-focus!important;animation-timeline:view()!important;animation-range:cover!important}.chapter-tag:after{content:"";background:color-mix(in srgb,var(--color-accent)40%,transparent);width:3.5rem;height:1px}@keyframes tag-focus{0%{opacity:0;filter:blur(8px);transform:translateY(24px)}45%,55%{opacity:1;filter:blur();transform:translateY(0)}to{opacity:0;filter:blur(8px);transform:translateY(-24px)}}.focus-text{color:color-mix(in srgb,var(--color-light)30%,transparent);letter-spacing:-.02em;max-width:500px;margin:0;font-size:3.5rem;font-weight:600;line-height:1.1;animation:linear both content-focus!important;animation-timeline:view()!important;animation-range:cover!important}.description{color:color-mix(in srgb,var(--color-light)50%,transparent);border-left:2px solid var(--color-accent);max-width:420px;margin-top:1.5rem;padding-left:1.5rem;font-size:1.1rem;font-weight:300;line-height:1.7;animation:linear both content-focus!important;animation-timeline:view()!important;animation-range:cover!important}[dir=rtl] .description{border-left:none;border-right:2px solid var(--color-accent);padding-left:0;padding-right:1.5rem}@keyframes shape-fade{entry 0%{opacity:0;transform:translateY(40px)scale(.9)}entry 100%{opacity:1;transform:translateY(0)scale(1)}exit 0%{opacity:1;transform:translateY(0)scale(1)}exit 100%{opacity:0;transform:translateY(-40px)scale(1.1)}}@keyframes content-focus{0%{filter:blur(12px);opacity:0;border-color:#0000;transform:scale(.8)translateY(40px)}45%,55%{filter:blur();opacity:1;color:var(--color-light);border-color:var(--color-accent);transform:scale(1)translateY(0)}to{filter:blur(12px);opacity:0;border-color:#0000;transform:scale(.95)translateY(-40px)}}@media (max-width:1024px){.sticky-visual{display:none}.hero-content{width:100%}.scroll-section,.closing-section{padding-left:1.5rem;padding-right:1.5rem}.focus-text{font-size:2rem}.chapter-tag{margin-bottom:1rem}}