.scroll-reveal-text{margin:20px 0;font-size:clamp(1.6rem,4vw,3rem);font-weight:600;line-height:1.5}.word,span.char{display:inline-block}.skills-showcase-panels{flex-direction:column;gap:4rem;display:flex}@media (width>=768px){.skills-showcase-panels{gap:10rem}}.showcase-panel{grid-template-columns:1fr;align-items:center;gap:2.5rem;display:grid}@media (width>=768px){.showcase-panel{grid-template-columns:1fr 1fr;gap:4rem}}@media (width>=1024px){.showcase-panel{gap:5rem}}@media (width>=768px){.showcase-panel--reversed .panel-device-wrap{order:-1}}.panel-category-title{text-transform:uppercase;letter-spacing:-.02em;color:var(--color-foreground);-webkit-user-select:none;user-select:none;margin-bottom:0;font-family:Anton,Bebas Neue,sans-serif;font-size:clamp(2.2rem,5vw,4.5rem);line-height:.95}:is(.dark *) .panel-category-title{color:#fff}.panel-skills-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(.85rem,2vw,1.4rem) clamp(1.25rem,3.5vw,2.75rem);display:grid}.skill-badge{cursor:pointer;-webkit-user-select:none;user-select:none;opacity:0;border-radius:0;align-items:center;gap:12px;padding:6px 0;transition:opacity .55s,transform .4s cubic-bezier(.22,1,.36,1);display:flex;transform:translateY(18px);box-shadow:none!important;background:0 0!important;border:none!important}.skill-badge:hover{box-shadow:none!important;background:0 0!important;border:none!important;transform:translateY(-2px)!important}:is(.dark *) .skill-badge,:is(.dark *) .skill-badge:hover{box-shadow:none!important;background:0 0!important;border:none!important}.showcase-panel.in-view .skill-badge{opacity:1;transition-delay:calc(.25s + var(--i,0) * 55ms);transform:translateY(0)}.skill-badge-icon{object-fit:contain;pointer-events:none;filter:drop-shadow(0 2px 6px #0000001f);flex-shrink:0;width:32px;height:32px;transition:transform .35s cubic-bezier(.22,1,.36,1)}.skill-badge:hover .skill-badge-icon{transform:scale(1.15)}@media (width>=640px){.skill-badge-icon{width:38px;height:38px}}.skill-badge-name{font-family:var(--font-sans);color:#000000d1;white-space:nowrap;text-overflow:ellipsis;font-size:clamp(1.05rem,1.8vw,1.35rem);font-weight:500;transition:color .25s;overflow:hidden}.skill-badge:hover .skill-badge-name{color:var(--primary,#0f172a)}:is(.dark *) .skill-badge-name{color:#ffffffd9}:is(.dark *) .skill-badge:hover .skill-badge-name{color:#fff}.panel-device-wrap{opacity:0;justify-content:center;align-items:center;transition:opacity .9s .1s,transform 1.1s cubic-bezier(.22,1,.36,1) .1s;display:flex;transform:translateY(24px)}@media (width>=768px){.panel-device-wrap{transform:translate(50px)translateY(16px)}.showcase-panel--reversed .panel-device-wrap{transform:translate(-50px)translateY(16px)}}.showcase-panel.in-view .panel-device-wrap{opacity:1;transform:translate(0)translateY(0)}.device-float{position:relative}@keyframes float-phone{0%,to{transform:translate(0)rotate(-1.5deg)}50%{transform:translateY(-18px)rotate(2deg)}}@keyframes float-browser{0%,to{transform:translate(0)rotate(.8deg)}50%{transform:translateY(-14px)rotate(-1deg)}}@keyframes float-database{0%,to{transform:translate(0)rotate(0)}33%{transform:translateY(-12px)rotate(1.2deg)}66%{transform:translateY(-6px)rotate(-.8deg)}}@keyframes float-cloud{0%,to{transform:translate(0)rotate(0)}50%{transform:translateY(-14px)rotate(1deg)}}@keyframes float-ai{0%,to{transform:translate(0)rotate(0)}50%{transform:translateY(-15px)rotate(-1.2deg)}}.device-float--phone{animation:6s ease-in-out infinite float-phone}.device-float--browser{animation:7s ease-in-out infinite float-browser}.device-float--database{animation:5.5s ease-in-out infinite float-database}.device-float--cloud{animation:6.5s ease-in-out infinite float-cloud}.device-float--ai{animation:6.2s ease-in-out infinite float-ai}.device-float svg{width:100%;height:auto;display:block}.device-float--phone{width:clamp(160px,30vw,220px)}.device-float--browser{width:clamp(260px,45vw,420px)}.device-float--database{width:clamp(160px,30vw,220px)}.device-float--cloud{width:clamp(220px,36vw,320px)}.device-float--ai{width:clamp(200px,34vw,290px)}.device-float svg{color:#0000008c;transition:color .3s}.showcase-panel:hover .device-float svg{color:#000000b3}:is(.dark *) .device-float svg{color:#ffffff40}:is(.dark *) .showcase-panel:hover .device-float svg{color:#fff6}:is(.dark *) .device-float--phone{filter:drop-shadow(0 0 30px #788cff0f)}:is(.dark *) .device-float--browser{filter:drop-shadow(0 0 30px #64c8a00d)}:is(.dark *) .device-float--database{filter:drop-shadow(0 0 30px #c8a0640f)}.device-float--database svg{--db-fill:#fff}:is(.dark *) .device-float--database svg{--db-fill:#070709}@media (width<=767px){.panel-device-wrap{order:-1;transform:translateY(24px)}.showcase-panel--reversed .panel-device-wrap{transform:translateY(24px)}.showcase-panel.in-view .panel-device-wrap{transform:translateY(0)}.device-float--phone{width:140px}.device-float--browser{width:240px}.device-float--database{width:140px}.device-float--cloud{width:200px}.device-float--ai{width:190px}.panel-category-title{text-align:center}.skill-badge{gap:10px;padding:6px 0}}@media (prefers-reduced-motion:reduce){.device-float--phone,.device-float--browser,.device-float--database,.device-float--cloud,.device-float--ai{animation:none}.panel-device-wrap{transition-duration:10ms;transition-delay:0s!important;animation:none!important}}.showcase-panel:not(.in-view) .device-float{animation-play-state:paused!important}.tech-text{touch-action:pan-y;-webkit-user-select:none;user-select:none;width:100%;height:100%;position:relative;cursor:none!important}.tech-text-canvas{width:100%;height:100%;display:block;cursor:none!important}
