.portfolio-story-hero{--story-cool:var(--color-icon-cyan);--story-warm:var(--color-icon-yellow);--story-color-cyan:var(--story-cool);--story-color-green:color-mix(in srgb, var(--story-cool) 70%, var(--story-warm));--story-color-yellow:var(--story-warm);--story-color-red:color-mix(in srgb, var(--story-warm) 70%, var(--story-cool))}.section-story{pointer-events:none;color:color-mix(in srgb, var(--color-text-primary) 40%, var(--color-background-body));position:absolute;inset:0;overflow:hidden}.portfolio-story-hero:has(.section-story--thinking){--story-cool:var(--color-icon-green)}.portfolio-story-hero:has(.section-story--art){--story-warm:var(--color-icon-red)}.portfolio-story-hero:has(.section-story--library){--story-cool:var(--color-icon-yellow);--story-warm:var(--color-icon-red)}.portfolio-story-hero:has(.section-story--contact){--story-warm:var(--color-icon-red)}.portfolio-story-hero:has(.section-story--projects){--story-color-green:var(--color-icon-green);--story-color-red:var(--color-icon-red)}.section-story [data-story-light]>path:not(.section-story__pulse):not(.section-story__contact-spectrum):not([data-art-loop]){stroke:color-mix(in srgb, var(--story-cool) 38%, currentColor)}.section-story [data-story-surface]{fill:var(--story-cool);fill-opacity:.09}.section-story [data-story-face]{fill:var(--story-color-green);fill-opacity:.12}.section-story [data-face-shade=\.5]{fill:var(--story-cool);fill-opacity:.08}.section-story [data-face-shade=\.75]{fill:var(--story-warm);fill-opacity:.1}.section-story svg{--story-size:min(135vw, 88svh);width:var(--story-size);height:var(--story-size);stroke:currentColor;stroke-width:1px;stroke-linecap:round;stroke-linejoin:round;position:absolute;top:50%;left:50%;overflow:visible;transform:translate(-50%,-50%)}.section-story path{vector-effect:non-scaling-stroke;opacity:1}@media (width>=1024px){.section-story svg{--story-size:min(78vw, 112svh);top:50%}}.section-story--thinking svg{--story-size:min(150vw, 108svh);top:auto;bottom:calc(var(--story-size) * -.110465);transform:translate(-50%)}.section-story .section-story__pulse,.section-story .section-story__contact-spectrum{opacity:0;stroke-width:1.5px;stroke-dasharray:var(--pulse-length) 1}.section-story .section-story__transfer{opacity:0;stroke-width:1.5px}@media (prefers-reduced-motion:no-preference){.section-story__plane{animation:story-plane calc(23s + var(--story-phase) * 3.17s) ease-in-out infinite alternate;animation-delay:calc(var(--story-phase) * -4.3s)}.section-story__page{transform-origin:0 235px;animation:story-page calc(29s + var(--story-phase) * 2.71s) ease-in-out infinite alternate;animation-delay:calc(var(--story-phase) * -3.8s)}.section-story__canopy{transform-origin:890px 740px;animation:31s ease-in-out infinite alternate story-canopy}.section-story__branch{animation:story-branch var(--branch-duration) ease-in-out infinite alternate;animation-delay:var(--branch-delay)}.section-story svg[data-story-paused] *{animation-play-state:paused}}@keyframes story-plane{0%,to{transform:translateY(0)}50%{transform:translateY(-18px)}}@keyframes story-page{0%{transform:rotate(-5deg)}to{transform:rotate(5deg)}}@keyframes story-canopy{0%{transform:rotate(-.5deg)}to{transform:rotate(.6deg)}}@keyframes story-branch{0%{transform:rotate(calc(var(--branch-angle) * -1))}to{transform:rotate(var(--branch-angle))}}.portfolio-section-title{letter-spacing:-.04em;font-size:clamp(3.5rem,7vw,6rem);font-weight:500;line-height:1;display:block}.portfolio-story-hero{isolation:isolate;width:100vw;grid-template-rows:minmax(0,1fr);height:100svh;min-height:100svh;margin-block-start:-96px;margin-inline:calc(50% - 50vw);padding-block-start:calc(var(--spacing-12) + var(--spacing-2) + env(safe-area-inset-top));display:grid;position:relative;overflow:hidden}.portfolio-story-hero>.section-story{min-height:0;position:relative;inset:auto;overflow:visible;container-type:size}.portfolio-story-hero>.section-story svg{--story-size:min(135vw, 100cqh);top:50%;bottom:auto;transform:translate(-50%,-50%)}.portfolio-story-hero>.section-story--thinking{position:absolute;inset:0;container-type:normal}@media (width>=1024px){.portfolio-story-hero{min-height:max(640px,100svh);padding-block-start:96px}.portfolio-story-hero>.section-story svg{--story-size:min(78vw, 110cqh)}}.portfolio-story-hero>.section-story--thinking svg{--story-size:min(150vw, 108svh);top:auto;bottom:calc(var(--story-size) * -.110465);transform:translate(-50%)}.portfolio-story-actions{flex-wrap:wrap;gap:1rem;padding-block:2rem 3rem;display:flex}
