.hero{background:0 0;align-items:center;min-height:100vh;padding-top:80px;display:flex;position:relative;overflow:hidden}.hero__content{z-index:1;grid-template-columns:1fr auto;place-items:flex-start stretch;gap:clamp(2rem,8vw,10rem);display:grid;position:relative}.hero__intro{align-items:center;gap:var(--spacing-lg);margin-bottom:var(--spacing-lg);display:flex}.hero__intro-content{flex:1}.hero__greeting{margin-bottom:var(--spacing-xs)}.hero__greeting-text{color:var(--accent-primary);font-family:var(--font-mono);font-size:1.1rem}.hero__name{margin-bottom:var(--spacing-sm);background:linear-gradient(135deg,var(--text-primary)0%,var(--accent-primary)100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:clamp(1.75rem,3.5vw,2.5rem);font-weight:700}.hero__title{color:var(--text-secondary);margin-bottom:var(--spacing-lg);font-size:clamp(1rem,2vw,1.5rem)}.hero__title-highlight{color:var(--accent-primary)}.hero__bio{color:var(--text-secondary);margin-bottom:var(--spacing-xl);max-width:500px;font-size:1.1rem;line-height:1.7}.hero__cta{gap:var(--spacing-md);margin-bottom:var(--spacing-2xl);display:flex}.hero__social{gap:var(--spacing-md);display:flex}.hero__social-link{border:1px solid var(--border-color);border-radius:var(--border-radius-md);width:44px;height:44px;color:var(--text-secondary);transition:all var(--transition-fast);justify-content:center;align-items:center;display:flex}.hero__social-link:hover{color:var(--accent-primary);border-color:var(--accent-primary);background:var(--theme-light-glow)}.hero__visual{justify-content:flex-end;align-items:flex-start;display:flex}.hero__visual--3d{perspective:1000px;perspective-origin:50%}.hero__code{-webkit-backdrop-filter:blur(40px)saturate(150%);border:1px solid rgba(var(--primary-rgb),.2);box-shadow:0 25px 70px #0009,0 0 0 1px rgba(var(--primary-rgb),.25),inset 0 1px 0 #ffffff0a,0 0 120px rgba(var(--primary-rgb),.15);background:linear-gradient(135deg,#05050cd9 0%,#0a0a12eb 100%);border-radius:12px;width:clamp(300px,35vw,420px);min-height:240px;position:relative;overflow:hidden}.hero__code:before{content:"";background:linear-gradient(135deg,rgba(var(--primary-rgb),.4)0%,rgba(var(--primary-rgb),.15)50%,rgba(var(--primary-rgb),.1)100%);-webkit-mask-composite:xor;pointer-events:none;opacity:.8;border-radius:12px;padding:2px;animation:3s ease-in-out infinite borderPulse;position:absolute;inset:-2px;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}@keyframes borderPulse{0%,to{opacity:.6}50%{opacity:1}}.hero__code:after{content:"";pointer-events:none;z-index:10;opacity:.25;background:repeating-linear-gradient(0deg,#0000001f,#0000001f 1px,#0000 1px 2px);border-radius:12px;width:100%;height:100%;position:absolute;top:0;left:0}.hero__code--3d{transform-style:preserve-3d;will-change:transform;backface-visibility:visible;transition:transform .2s ease-out,box-shadow .2s ease-out,filter .2s ease-out;overflow:hidden}.hero__code-header{background:linear-gradient(180deg,rgba(var(--primary-rgb),.06)0%,transparent 100%);padding:12px var(--spacing-md);align-items:center;gap:var(--spacing-sm);border-bottom:1px solid rgba(var(--primary-rgb),.12);transform-style:preserve-3d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:11;display:flex;position:relative}.hero__code-dots{gap:8px;display:flex}.hero__code-dots span{border-radius:50%;width:10px;height:10px;transition:all .3s;position:relative}.hero__code-dots span:after{content:"";opacity:.6;filter:blur(3px);border-radius:50%;width:100%;height:100%;transition:all .3s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.hero__code-dots span:hover{cursor:pointer;transform:scale(1.15)}.hero__code-dots span:hover:after{opacity:1;filter:blur(5px)}.hero__code-dots span:first-child{background:#ff5f57;box-shadow:0 0 10px #ff5f5780}.hero__code-dots span:first-child:after{background:#ff5f57}.hero__code-dots span:nth-child(2){background:#ffbd2e;box-shadow:0 0 10px #ffbd2e80}.hero__code-dots span:nth-child(2):after{background:#ffbd2e}.hero__code-dots span:nth-child(3){background:#28ca42;box-shadow:0 0 10px #28ca4280}.hero__code-dots span:nth-child(3):after{background:#28ca42}.hero__code-title{color:rgba(var(--primary-rgb),.85);font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.5px;opacity:.8;font-size:.7rem;font-weight:500}.hero__code-content{padding:var(--spacing-xl)var(--spacing-lg);font-family:var(--font-mono);text-align:left;width:100%;min-height:180px;transform-style:preserve-3d;z-index:11;background:linear-gradient(#0000000d 0%,#0000 100%);font-size:.88rem;line-height:1.7;position:relative}.hero__code-line{margin-bottom:var(--spacing-sm);text-align:left;transform-style:preserve-3d}.hero__code-line--indent{padding-left:var(--spacing-lg)}.hero__code-line--indent-extra{padding-left:calc(var(--spacing-lg)*3.5)}.hero__code-keyword{color:var(--syntax-keyword)}.hero__code-variable{color:var(--syntax-variable)}.hero__code-property{color:var(--syntax-property)}.hero__code-string{color:var(--syntax-string)}.hero__code-operator{color:var(--syntax-operator)}.hero__code-bracket{color:var(--text-primary)}.hero__code-prompt{color:#00d9ff;text-shadow:0 0 10px #00d9ff4d;font-weight:700}.hero__code-arrow{color:#7c3aed;text-shadow:0 0 10px #7c3aed4d;font-weight:700}.hero__code-text--command{color:#00d9ff;font-weight:500}.hero__code-text--output{color:#e2e8f0;font-weight:400}.hero__code-text--json{color:#10b981;font-weight:400}.hero__code-text--bracket{color:#f59e0b;font-weight:600}.hero__code-text--success{color:#6bcf7f;font-weight:500}.hero__code-text--empty{height:.5em;display:block}.hero__code-cursor{vertical-align:middle;background:linear-gradient(#00d9ff 0%,#7c3aed 100%);width:2px;height:1em;margin-left:2px;animation:.8s step-end infinite cursorBlink;display:inline-block;box-shadow:0 0 8px #00d9ff80}@keyframes cursorBlink{0%,50%{opacity:1}51%,to{opacity:0}}.hero__code-dots{color:#00d9ff;text-shadow:0 0 12px #00d9ff66;font-size:1.5rem;font-weight:700;animation:1.5s ease-in-out infinite dotsPulse;display:inline-block}@keyframes dotsPulse{0%,to{opacity:.4;text-shadow:0 0 8px #00d9ff33}50%{opacity:1;text-shadow:0 0 16px #00d9ff99}}.hero__image-container{justify-content:center;align-items:center;display:flex;position:relative}.hero__image-frame{background:linear-gradient(135deg,var(--accent-primary)0%,var(--accent-secondary)100%);width:120px;height:120px;box-shadow:0 8px 24px var(--theme-light-glow);cursor:pointer;border-radius:50%;flex-shrink:0;padding:3px;transition:box-shadow .8s;position:relative}.hero__image{object-fit:cover;border:3px solid var(--bg-primary);width:100%;height:100%;transition:transform var(--transition-normal);border-radius:50%}.hero__image-container:hover .hero__image{transform:scale(1.05)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInLeft{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}@keyframes fadeInRight{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:translate(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes slideInBottom{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes pulseGlow{0%,to{box-shadow:0 8px 24px var(--theme-light-glow)}50%{box-shadow:0 8px 32px var(--theme-light-glow)}}@keyframes dotPulse{0%,to{opacity:.6;transform:scale(1)}50%{opacity:1;transform:scale(1.2)}}.hero__image-container--animate{animation:.8s ease-out .2s both scaleIn}.hero__image-frame{animation:2s ease-in-out infinite pulseGlow}.hero__intro-content--animate{animation:.8s ease-out .3s both fadeInLeft}.hero__name--animate{animation:.8s ease-out .4s both fadeInUp}.hero__title--animate{animation:.8s ease-out .5s both fadeInUp}.hero__bio--animate{animation:.8s ease-out .6s both fadeInUp}.hero__cta--animate{animation:.8s ease-out .7s both fadeInUp}.hero__social--animate{animation:.8s ease-out .8s both fadeInUp}.hero__social-link{animation:.6s ease-out both slideInBottom}.hero__visual--animate{animation:1s ease-out .4s both fadeInRight}.hero__code--animate{animation:.8s ease-out .5s both scaleIn}.hero__code-dots span{opacity:.6;animation:1.5s ease-in-out infinite dotPulse}.hero__code-line--animate{animation:.6s ease-out both fadeInLeft}@keyframes typewriter{0%{opacity:1;width:0}99%{border-right:2px solid var(--accent-primary)}to{opacity:1;border-right:none;width:100%}}@media (max-width:1024px){.hero__content{gap:var(--spacing-xl);text-align:center;grid-template-columns:1fr;align-items:center}.hero__intro{align-items:center;gap:var(--spacing-lg);margin-bottom:var(--spacing-xl);flex-direction:column}.hero__intro-content{text-align:center}.hero__bio{max-width:600px;margin:0 auto var(--spacing-xl)auto}.hero__visual,.hero__code,.hero__code-header,.hero__code-content,.hero__code-title{visibility:hidden!important;opacity:0!important;height:0!important;display:none!important;overflow:hidden!important}}@media (max-width:768px){.hero{padding:80px 0 var(--spacing-lg)0;justify-content:center;align-items:center;display:flex}.hero__content{gap:var(--spacing-lg);width:100%}.hero__intro{gap:var(--spacing-md);margin-bottom:var(--spacing-lg)}.hero__name{margin-bottom:var(--spacing-xs);font-size:clamp(1.5rem,6vw,2.2rem)}.hero__title{margin-bottom:var(--spacing-md);font-size:clamp(.9rem,3vw,1.3rem)}.hero__bio{max-width:100%;margin-bottom:var(--spacing-lg);font-size:1rem}.hero__cta{align-items:center;gap:var(--spacing-sm);flex-direction:column}.hero__cta .btn{width:100%;max-width:280px}.hero__social{margin-top:var(--spacing-md);justify-content:center}.hero__image-frame{width:100px;height:100px}.hero__visual,.hero__code,.hero__code-header,.hero__code-content,.hero__code-title{visibility:hidden!important;opacity:0!important;height:0!important;display:none!important;overflow:hidden!important}.hero__code-content{padding:var(--spacing-md);text-align:left;font-size:.8rem}}@media (max-width:480px){.hero{padding:70px 0 var(--spacing-md)0;justify-content:center;align-items:center;display:flex}.hero__content{width:100%}.hero__intro{gap:var(--spacing-sm)}.hero__name{font-size:clamp(1.4rem,8vw,2rem)}.hero__title{font-size:clamp(.8rem,4vw,1.2rem)}.hero__bio{font-size:.95rem;line-height:1.6}.hero__image-frame{width:80px;height:80px}.hero__visual,.hero__code,.hero__code-header,.hero__code-content,.hero__code-title{visibility:hidden!important;opacity:0!important;height:0!important;display:none!important;overflow:hidden!important}.hero__code-content{padding:var(--spacing-sm);text-align:left}.hero__social-link{width:40px;height:40px}}[data-color-theme=dark] .hero__image-frame{box-shadow:0 8px 24px var(--theme-dark-glow);animation:2s ease-in-out infinite pulseGlowRed}@keyframes pulseGlowRed{0%,to{box-shadow:0 8px 24px var(--theme-dark-glow)}50%{box-shadow:0 8px 32px var(--theme-dark-glow)}}[data-color-theme=dark] .hero__social-link:hover{background:var(--theme-dark-glow)}.speech-bubble{color:var(--text-primary);padding:var(--spacing-md)var(--spacing-lg);border-radius:var(--border-radius-lg);border:1px solid var(--accent-primary);white-space:nowrap;z-index:10;margin-bottom:var(--spacing-md);box-shadow:0 8px 32px var(--theme-light-glow);-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);text-align:center;background:#111111f2;min-width:180px;font-size:1rem;font-weight:500;animation:.6s cubic-bezier(.68,-.55,.265,1.55) bubbleAppear;position:absolute;bottom:100%;left:50%;transform:translate(-50%)}.speech-bubble:after{content:"";border:8px solid #0000;border-top-color:var(--accent-primary);position:absolute;top:100%;left:50%;transform:translate(-50%)}.speech-bubble:before{content:"";z-index:1;border:7px solid #0000;border-top-color:#111111f2;margin-top:-1px;position:absolute;top:100%;left:50%;transform:translate(-50%)}@keyframes bubbleAppear{0%{opacity:0;transform:translate(-50%)translateY(20px)scale(.3)rotate(-5deg)}50%{opacity:.8;transform:translate(-50%)translateY(-5px)scale(1.1)rotate(2deg)}to{opacity:1;transform:translate(-50%)translateY(0)scale(1)rotate(0)}}[data-color-theme=dark] .speech-bubble{border-color:var(--theme-dark-primary);box-shadow:0 8px 32px var(--theme-dark-glow)}[data-color-theme=dark] .speech-bubble:after{border-top-color:var(--theme-dark-primary)}
