:root{--orange:#e8470a;--orange-light:#ff6b35;--orange-glow:#e8470a4d;--orange-glow-strong:#e8470a80;--black:#080808;--black-mid:#111;--black-card:#0a0a0abf;--white:#fff;--white-dim:#a0a0a0;--glass-bg:#0a0a0a99;--glass-border:#e8470a33;--font-display:"Space Grotesk", sans-serif;--font-body:"Inter", sans-serif;--ease-out:cubic-bezier(.16, 1, .3, 1);--ease-in-out:cubic-bezier(.65, 0, .35, 1)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-body);background:var(--black);color:var(--white);line-height:1.7;overflow-x:hidden}a{color:inherit;text-decoration:none;transition:color .3s}ul,ol{list-style:none}img{max-width:100%;display:block}button{cursor:pointer;font-family:var(--font-body);border:none;outline:none}input,textarea{font-family:var(--font-body);outline:none}.frame-canvas-container{z-index:0;width:100%;height:100%;position:fixed;top:0;left:0}.frame-canvas-container canvas{object-fit:cover;width:100%;height:100%;display:block}.vignette-overlay{pointer-events:none;z-index:1;background:radial-gradient(#0000 30%,#000000b3 100%);width:100%;height:100%;position:fixed;top:0;left:0}.atmospheric-haze{pointer-events:none;z-index:1;background:linear-gradient(#0000,#e8470a14);width:100%;height:25%;position:fixed;bottom:0;left:0}.top-haze{pointer-events:none;z-index:1;background:linear-gradient(#08080880,#0000);width:100%;height:15%;position:fixed;top:0;left:0}.ember-container{pointer-events:none;z-index:2;width:100%;height:100%;position:fixed;top:0;left:0;overflow:hidden}.ember{background:var(--orange);opacity:0;border-radius:50%;width:3px;height:3px;animation:linear infinite emberFloat;position:absolute}@keyframes emberFloat{0%{opacity:0;transform:translateY(0)translate(0)}10%{opacity:.8}90%{opacity:.4}to{opacity:0;transform:translateY(-100vh)translate(50px)}}.scroll-progress{background:linear-gradient(90deg, var(--orange), var(--orange-light));z-index:999;will-change:width;height:3px;position:fixed;top:0;left:0}.scroll-container{z-index:5;width:100%;position:relative;overflow-x:hidden}.eyebrow{font-family:var(--font-display);letter-spacing:3px;color:var(--orange);text-transform:uppercase;margin-bottom:16px;font-size:11px;font-weight:700}.section-heading{font-family:var(--font-display);color:var(--white);margin-bottom:40px;padding-bottom:12px;font-size:clamp(36px,5vw,64px);font-weight:700;line-height:1.1;display:inline-block;position:relative}.section-heading:after{content:"";background:linear-gradient(90deg, var(--orange), transparent);width:50px;height:3px;transition:width .5s var(--ease-out);position:absolute;bottom:0;left:0}.section-heading:hover:after{width:150px}.body-text{font-family:var(--font-body);color:var(--white-dim);font-size:16px;font-weight:400;line-height:1.7}.glass-card{-webkit-backdrop-filter:blur(20px);background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:16px;padding:48px;position:relative;overflow:hidden}.glass-card:before{content:"";background:linear-gradient(90deg,#0000,#e8470a59,#0000);height:1px;position:absolute;top:0;left:0;right:0}.btn{font-family:var(--font-display);transition:all .3s var(--ease-out);letter-spacing:.5px;text-transform:uppercase;cursor:pointer;border-radius:8px;align-items:center;gap:8px;padding:14px 32px;font-size:14px;font-weight:700;display:inline-flex}.btn-filled{background:var(--orange);color:#000;border:2px solid var(--orange)}.btn-filled:hover{box-shadow:0 0 30px var(--orange-glow), 0 0 60px #e8470a26;transform:scale(1.04)}.btn-outlined{color:var(--orange);border:2px solid var(--orange);background:0 0}.btn-outlined:hover{box-shadow:0 0 30px var(--orange-glow);background:#e8470a14;transform:scale(1.04)}.section{z-index:5;justify-content:center;align-items:flex-start;min-height:100vh;padding:80px 24px;display:flex;position:relative}.section-inner{width:100%;max-width:1100px}.navbar{z-index:100;justify-content:space-between;align-items:center;width:100%;height:80px;padding:0 40px;transition:all .4s;display:flex;position:fixed;top:0;left:0}.navbar.scrolled{-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--orange-glow);background:#080808d9}.navbar-logo img{width:auto;height:64px;transition:transform .3s var(--ease-out)}.navbar-logo img:hover{transform:scale(1.05)}.navbar-links{gap:36px;display:flex}.navbar-links a{font-family:var(--font-display);letter-spacing:1px;text-transform:uppercase;color:var(--white);padding-bottom:4px;font-size:13px;font-weight:600;position:relative}.navbar-links a:after{content:"";background:var(--orange);width:0;height:2px;transition:width .3s var(--ease-out);position:absolute;bottom:0;left:0}.navbar-links a:hover{color:var(--orange)}.navbar-links a:hover:after{width:100%}.hamburger{cursor:pointer;z-index:200;background:0 0;border:none;flex-direction:column;gap:6px;padding:8px;display:none}.hamburger span{background:var(--white);width:28px;height:2px;transition:all .3s;display:block}.hamburger.active span:first-child{transform:rotate(45deg)translate(5px,6px)}.hamburger.active span:nth-child(2){opacity:0}.hamburger.active span:nth-child(3){transform:rotate(-45deg)translate(5px,-6px)}.mobile-menu{-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);z-index:150;opacity:0;pointer-events:none;background:#080808f7;flex-direction:column;justify-content:center;align-items:center;gap:32px;width:100%;height:100%;transition:opacity .4s;display:flex;position:fixed;top:0;left:0}.mobile-menu.active{opacity:1;pointer-events:all}.mobile-close-btn{color:var(--white);cursor:pointer;transition:transform .3s var(--ease-out), color .3s ease;z-index:10;background:0 0;border:none;justify-content:center;align-items:center;padding:12px;display:flex;position:absolute;top:16px;right:20px}.mobile-close-btn:hover{color:var(--orange);transform:rotate(90deg)scale(1.15)}.mobile-menu a{font-family:var(--font-display);color:var(--white);text-transform:uppercase;letter-spacing:4px;opacity:0;font-size:32px;font-weight:700;transition:all .4s,color .3s;transform:translateY(30px)}.mobile-menu.active a{opacity:1;transform:translateY(0)}.mobile-menu a:hover{color:var(--orange)}.hero{z-index:5;text-align:center;flex-direction:column;justify-content:flex-end;align-items:center;height:100vh;padding:0 24px 2vh;display:flex;position:relative}.hero-label{font-family:var(--font-display);letter-spacing:5px;color:var(--orange);text-transform:uppercase;margin-bottom:2px;font-size:12px;font-weight:700}.hero-name{font-family:var(--font-display);text-transform:uppercase;color:var(--white);text-shadow:0 0 80px #e8470a33;margin-bottom:0;font-size:clamp(64px,10vw,130px);font-weight:800;line-height:.92}.hero-name-stroke{font-family:var(--font-display);text-transform:uppercase;-webkit-text-stroke:2px var(--orange);color:#0000;margin-bottom:28px;font-size:clamp(64px,10vw,130px);font-weight:800;line-height:.92}.text-wave span{animation:3.5s ease-in-out infinite textSineWave;animation-delay:calc(var(--char-index) * .12s);will-change:transform;display:inline-block}@keyframes textSineWave{0%,to{transform:translateY(0)rotate(0)}50%{text-shadow:0 0 35px var(--orange-glow-strong);transform:translateY(-15px)rotate(1deg)}}.hero-tagline{font-family:var(--font-body);color:var(--white-dim);letter-spacing:2px;text-transform:uppercase;margin-bottom:44px;font-size:14px}.hero-cta{flex-wrap:wrap;justify-content:center;gap:16px;display:flex}.scroll-indicator{flex-direction:column;align-items:center;gap:8px;animation:2s ease-in-out infinite bounceArrow;display:flex;position:absolute;bottom:40px;left:50%;transform:translate(-50%)}.scroll-indicator span{letter-spacing:3px;text-transform:uppercase;color:var(--white-dim);font-size:10px;font-family:var(--font-display)}.scroll-indicator svg{width:20px;height:20px;stroke:var(--orange);stroke-width:2px;fill:none}@keyframes bounceArrow{0%,to{transform:translate(-50%)translateY(0)}50%{transform:translate(-50%)translateY(14px)}}.about-card{max-width:800px;margin:0 auto}.stats-grid{grid-template-columns:repeat(4,1fr);gap:20px;margin-top:40px;display:grid}.stat-item{text-align:center;background:#e8470a0a;border:1px solid #e8470a1a;border-radius:12px;padding:24px 12px;transition:border-color .3s,transform .3s}.stat-item:hover{border-color:var(--orange-glow-strong);transform:translateY(-4px)}.stat-number{font-family:var(--font-display);color:var(--orange);margin-bottom:8px;font-size:40px;font-weight:800;line-height:1}.stat-label{color:var(--white-dim);text-transform:uppercase;letter-spacing:1.5px;font-size:11px;font-weight:600}.skills-grid{grid-template-columns:1fr 1fr;gap:48px;display:grid}.skill-bar-wrapper{margin-bottom:18px}.skill-bar-header{justify-content:space-between;margin-bottom:6px;display:flex}.skill-bar-name{color:var(--white);font-size:14px;font-weight:500}.skill-bar-percent{color:var(--orange);font-size:14px;font-weight:600;font-family:var(--font-display)}.skill-bar-track{background:#1a1a1a;border-radius:3px;width:100%;height:6px;overflow:hidden}.skill-bar-fill{background:linear-gradient(90deg, var(--orange), var(--orange-light));will-change:width;border-radius:3px;width:0%;height:100%}.chip-group{margin-bottom:20px}.chip-group-title{color:var(--white-dim);text-transform:uppercase;letter-spacing:1px;margin-bottom:10px;font-size:12px;font-weight:600}.chip-row{flex-wrap:wrap;gap:8px;display:flex}.chip{border:1px solid var(--glass-border);background:var(--glass-bg);color:var(--white-dim);white-space:nowrap;border-radius:99px;padding:8px 16px;font-size:13px;transition:all .3s}.chip:hover{border-color:var(--orange);color:var(--orange);background:#e8470a0f}.timeline{padding:20px 0;position:relative}.timeline:before{content:"";background:linear-gradient(to bottom, var(--orange-glow), transparent);width:2px;height:100%;position:absolute;top:0;left:50%;transform:translate(-50%)}.timeline-item{width:50%;padding-bottom:48px;position:relative}.timeline-item:nth-child(odd){text-align:right;padding-right:50px}.timeline-item:nth-child(2n){text-align:left;margin-left:50%;padding-left:50px}.timeline-dot{background:var(--orange);border:3px solid var(--black);z-index:2;width:14px;height:14px;box-shadow:0 0 12px var(--orange-glow), 0 0 24px #e8470a26;border-radius:50%;position:absolute;top:10px}.timeline-item:nth-child(odd) .timeline-dot{right:-7px}.timeline-item:nth-child(2n) .timeline-dot{left:-7px}.timeline-card{padding:28px}.timeline-company{font-family:var(--font-display);color:var(--orange);margin-bottom:2px;font-size:18px;font-weight:700}.timeline-company a{color:var(--orange);transition:opacity .3s}.timeline-company a:hover{opacity:.7}.timeline-role{color:var(--white);margin-bottom:4px;font-size:15px;font-weight:600}.timeline-period{color:var(--white-dim);margin-bottom:14px;font-size:13px;font-style:italic}.timeline-bullets li{color:var(--white-dim);padding:3px 0;font-size:14px;line-height:1.7;position:relative}.timeline-item:nth-child(2n) .timeline-bullets li{padding-left:18px}.timeline-item:nth-child(2n) .timeline-bullets li:before{content:"▸";color:var(--orange);position:absolute;left:0}.timeline-item:nth-child(odd) .timeline-bullets li{padding-right:18px}.timeline-item:nth-child(odd) .timeline-bullets li:after{content:"◂";color:var(--orange);position:absolute;right:0}.portfolio-tabs{flex-wrap:wrap;gap:12px;margin-bottom:40px;display:flex}.portfolio-tab{font-family:var(--font-display);border:1px solid var(--orange);color:var(--orange);cursor:pointer;text-transform:uppercase;letter-spacing:1px;background:0 0;border-radius:8px;padding:10px 24px;font-size:13px;font-weight:600;transition:all .3s}.portfolio-tab.active{background:var(--orange);color:#000}.portfolio-tab:hover:not(.active){background:#e8470a1a}.portfolio-grid{grid-template-columns:repeat(3,1fr);gap:20px;display:grid}.project-card{cursor:default;transition:all .4s var(--ease-out);will-change:transform;padding:28px 24px;position:relative}.project-card *{z-index:2;position:relative}.project-card:after{content:"";border-radius:inherit;background:radial-gradient(400px circle at var(--mouse-x,0px) var(--mouse-y,0px), #e8470a26, transparent 50%);z-index:1;pointer-events:none;opacity:0;transition:opacity .5s;position:absolute;inset:0}.project-card:hover{border-color:var(--orange);box-shadow:0 20px 60px #e8470a33;transform:translateY(-8px)!important}.project-card:hover:after{opacity:1}.project-badge{text-transform:uppercase;letter-spacing:1.5px;border-radius:4px;margin-bottom:14px;padding:4px 12px;font-size:10px;font-weight:700;display:inline-block}.project-badge.shopify{color:var(--orange);background:#e8470a26}.project-badge.wordpress{color:#7eaad0;background:#648cb426}.project-badge.corporate{color:var(--white-dim);background:#ffffff14}.project-name{font-family:var(--font-display);color:var(--white);word-break:break-word;margin-bottom:12px;font-size:15px;font-weight:600}.project-link{color:var(--orange);align-items:center;gap:6px;font-size:13px;font-weight:600;transition:gap .3s;display:inline-flex}.project-link:hover{gap:12px}.contact-grid{grid-template-columns:1fr 1fr;gap:48px;display:grid}.contact-info-item{border-left:2px solid var(--orange);align-items:flex-start;gap:16px;margin-bottom:12px;padding:16px 0 16px 20px;display:flex}.contact-icon{width:20px;height:20px;color:var(--orange);flex-shrink:0}.contact-info-text{color:var(--white-dim);font-size:15px}.contact-info-text a{color:var(--white)}.contact-info-text a:hover{color:var(--orange)}.availability-note{color:var(--white-dim);background:#e8470a08;border:1px solid #e8470a1a;border-radius:12px;margin-top:24px;padding:20px;font-size:14px;line-height:1.7}.contact-ctas{flex-direction:column;justify-content:center;gap:20px;display:flex}.contact-cta-card{color:var(--white);transition:all .4s var(--ease-out);background:#e8470a08;border:1px solid #e8470a26;border-radius:16px;align-items:center;gap:24px;padding:28px;display:flex;position:relative;overflow:hidden}.contact-cta-card:before{content:"";opacity:0;background:linear-gradient(135deg,#e8470a1a,#0000);width:100%;height:100%;transition:opacity .4s;position:absolute;top:0;left:0}.contact-cta-card:hover{border-color:var(--orange);box-shadow:0 12px 30px var(--orange-glow);transform:translateY(-4px)scale(1.02)}.contact-cta-card:hover:before{opacity:1}.cta-icon-wrapper{width:60px;height:60px;color:var(--orange);transition:all .4s var(--ease-out);background:#e8470a14;border-radius:12px;justify-content:center;align-items:center;display:flex}.contact-cta-card:hover .cta-icon-wrapper{background:var(--orange);color:#000;box-shadow:0 0 20px var(--orange-glow);transform:rotate(5deg)scale(1.1)}.cta-icon{width:28px;height:28px}.cta-content{text-align:left;flex-direction:column;flex-grow:1;gap:4px;display:flex}.cta-label{font-family:var(--font-display);letter-spacing:1px;text-transform:uppercase;color:var(--orange);font-size:12px;font-weight:700}.cta-value{font-family:var(--font-body);color:var(--white);font-size:16px;font-weight:600}.cta-arrow{color:var(--orange);transition:transform .4s var(--ease-out);font-size:24px}.contact-cta-card:hover .cta-arrow{transform:translate(6px)}.languages-section{border-top:1px solid #e8470a1a;margin-top:32px;padding-top:32px}.footer{z-index:5;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);text-align:center;background:#050505f2;border-top:1px solid #1a1a1a;padding:40px 24px;position:relative}.footer-logo{margin-bottom:16px}.footer-logo img{height:60px;margin:0 auto}.footer-copy{color:var(--white-dim);font-size:13px}.page-loader{z-index:10000;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:fixed;top:0;left:0;overflow:hidden}.page-loader-left,.page-loader-right{background:var(--black);z-index:1;width:50%;height:100%;position:absolute;top:0}.page-loader-left{left:0}.page-loader-right{right:0}.loader-content{z-index:2;flex-direction:column;align-items:center;gap:28px;display:flex;position:relative}.loader-logo img{width:auto;height:48px;animation:1s forwards logoFadeIn}@keyframes logoFadeIn{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}.loader-bar{background:#1a1a1a;border-radius:2px;width:200px;height:2px;overflow:hidden}.loader-bar-fill{background:linear-gradient(90deg, var(--orange), var(--orange-light));border-radius:2px;width:0%;height:100%;transition:width .3s}.loader-text{font-family:var(--font-display);letter-spacing:4px;color:var(--white-dim);text-transform:uppercase;font-size:11px}@media (width<=1024px){.portfolio-grid{grid-template-columns:repeat(2,1fr)}.navbar{padding:0 24px}}@media (width<=768px){.navbar{height:70px}.navbar-logo img{height:48px}.mobile-close-btn{top:11px;right:20px}.hamburger{display:flex}.navbar-links{display:none}.hero-name,.hero-name-stroke{font-size:clamp(48px,14vw,80px)}.hero-tagline{letter-spacing:1px;margin-bottom:24px;padding:0 10px;font-size:11px}.glass-card{padding:24px 18px}.stats-grid{grid-template-columns:repeat(2,1fr);gap:12px}.skills-grid{grid-template-columns:1fr;gap:32px}.timeline:before{left:16px}.timeline-item,.timeline-item:nth-child(odd),.timeline-item:nth-child(2n){text-align:left;width:100%;margin-left:0;padding-left:48px;padding-right:0}.timeline-item:nth-child(odd) .timeline-dot,.timeline-item:nth-child(2n) .timeline-dot{left:9px;right:auto}.timeline-item:nth-child(odd) .timeline-bullets li{padding-left:18px;padding-right:0}.timeline-item:nth-child(odd) .timeline-bullets li:after{display:none}.timeline-item:nth-child(odd) .timeline-bullets li:before{content:"▸";color:var(--orange);position:absolute;left:0}.portfolio-tabs{justify-content:center}.portfolio-grid{grid-template-columns:1fr}.contact-grid{grid-template-columns:1fr;gap:32px}.contact-cta-card{gap:16px;padding:20px}.cta-icon-wrapper{width:48px;height:48px}.cta-icon{width:22px;height:22px}.cta-value{word-break:break-all;font-size:clamp(12px,3.5vw,15px)}.section{padding:60px 16px}.section-heading{margin-bottom:24px}}
