/* Motion is added progressively; all content remains readable without JavaScript. */
.hero picture{transform-origin:50% 60%}
.motion-enabled .hero img{animation:hero-arrive 1.65s cubic-bezier(.16,1,.3,1) both}
.motion-enabled .site-header{animation:header-arrive .85s .35s both}
.motion-enabled .hero picture{transform:translate3d(0,var(--hero-drift,0px),0);will-change:transform}
.motion-enabled .marble-panel{transform:translate3d(0,var(--panel-drift,0px),0);transition:transform 1s cubic-bezier(0,.33,.07,1.03)}
.motion-enabled .reveal-item{opacity:0;translate:var(--reveal-x,0px) var(--reveal-y,48px);scale:var(--reveal-scale,1);transition:opacity .85s cubic-bezier(.22,1,.36,1) var(--reveal-delay,0ms),translate .95s cubic-bezier(.22,1,.36,1) var(--reveal-delay,0ms),scale .95s cubic-bezier(.22,1,.36,1) var(--reveal-delay,0ms),transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.motion-enabled .reveal-item[data-reveal="left"]{--reveal-x:-55px;--reveal-y:0px}
.motion-enabled .reveal-item[data-reveal="right"]{--reveal-x:55px;--reveal-y:0px}
.motion-enabled .reveal-item[data-reveal="zoom"]{--reveal-y:25px;--reveal-scale:.91}
.motion-enabled .reveal-item.is-visible{opacity:1;translate:0 0;scale:1}
.page-sections{overflow:clip}
.outlined-card,.experience-card,.education-list article,.process-list li{transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s,border-color .35s}
.skill-circle{position:relative;transition:transform .35s,box-shadow .35s}
.skill-circle.has-motion-ring{border-color:transparent}
.skill-ring{position:absolute;inset:-7px;width:calc(100% + 14px);height:calc(100% + 14px);overflow:visible;pointer-events:none;transform:rotate(-90deg)}
.skill-ring circle{fill:none;stroke-width:5.5}
.skill-ring .ring-track{stroke:#dedede}
.skill-ring .ring-line{stroke:#111;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:0}
.motion-enabled .reveal-item:not(.is-visible) .ring-line{stroke-dashoffset:100}
.motion-enabled .reveal-item.is-visible .ring-line{animation:ring-draw 1.6s var(--reveal-delay,0ms) cubic-bezier(.25,.8,.25,1) both}
.black-button,.floating-whatsapp{transition:transform .3s,background .3s,color .3s,box-shadow .3s}
.menu-lines,.menu-lines::before,.menu-lines::after{transition:transform .25s,top .25s,background .2s}
.site-header nav a[aria-current="location"]::after{transform:scaleX(1)}
.contact-form input,.contact-form select,.contact-form textarea{transition:box-shadow .25s,border-color .25s}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{box-shadow:0 4px 15px #00000015;border-color:#000}
@media(hover:hover) and (pointer:fine){
  .outlined-card:hover{transform:translateX(9px);box-shadow:0 10px 24px #00000014}
  .experience-card:hover,.education-list article:hover{transform:translateY(-7px);box-shadow:0 14px 25px #00000019}
  .process-list li:hover{transform:translateX(7px);box-shadow:0 7px 18px #00000012}
  .skill-circles li:hover .skill-circle{transform:translateY(-7px) scale(1.06);box-shadow:0 10px 22px #0002}
  .black-button:hover{transform:translateY(-3px);box-shadow:0 8px 16px #0002}
  .floating-whatsapp:hover{transform:translateY(-5px) rotate(-8deg);box-shadow:0 9px 20px #0003}
}
@keyframes hero-arrive{from{opacity:.25;transform:scale(1.13);filter:blur(5px)}to{opacity:1;transform:scale(1);filter:blur(0)}}
@keyframes header-arrive{from{opacity:0;translate:0 -20px}to{opacity:1;translate:0 0}}
@keyframes ring-draw{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}
@keyframes menu-arrive{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:767px){
  .motion-enabled .reveal-item{--reveal-y:30px}
  .motion-enabled .reveal-item[data-reveal="left"]{--reveal-x:-26px}
  .motion-enabled .reveal-item[data-reveal="right"]{--reveal-x:26px}
  .motion-enabled .site-header nav.is-open{animation:menu-arrive .25s ease-out both}
  .skill-ring{inset:-6px;width:calc(100% + 12px);height:calc(100% + 12px)}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .motion-enabled .reveal-item{opacity:1;translate:0 0;scale:1}
  .motion-enabled .hero picture,.hero img{transform:none!important;filter:none!important}
  .motion-enabled .marble-panel{transform:none!important}
  .motion-enabled .reveal-item .ring-line{stroke-dashoffset:0}
}