:root {
  --black: #000000;
  --near-black: #0b0b0c;
  --white: #f5f5f5;
  --paper: #f4f4f4;
  --muted: #919195;
  --line: rgba(255, 255, 255, 0.14);
  --accent: #ffffff;
  --pad: clamp(1.25rem, 4.5vw, 5.5rem);
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
}

* { box-sizing: border-box; }
html { overflow-x:hidden; scroll-behavior:smooth; background:var(--black); }
body {
  margin: 0;
  overflow-x: hidden;
  color: var(--white);
  background: var(--black);
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  line-height: 1.5;
}
body.menu-open, body.modal-open { overflow: hidden; }
::selection { color: var(--black); background: var(--accent); }
a { color: inherit; text-decoration: none; }
button, input, textarea { color: inherit; font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
.skip-link {
  position:fixed; z-index:120; top:.75rem; left:.75rem; padding:.7rem 1rem;
  color:var(--black); background:var(--white); font-size:.7rem; letter-spacing:.12em;
  text-transform:uppercase; transform:translateY(-180%); transition:transform .2s;
}
.skip-link:focus { transform:none; }
:focus-visible { outline:2px solid currentColor; outline-offset:5px; }

.site-header {
  position: fixed; z-index: 50; top: 0; left: 0; width: 100%;
  display: flex; align-items: center; justify-content: space-between;
  padding: 1.25rem var(--pad); border-bottom: 1px solid transparent;
  opacity:0; pointer-events:none;
  transition: padding .35s var(--ease), background .35s, border-color .35s,opacity .35s;
}
.section-view-open .site-header { opacity:1; pointer-events:auto; }
.section-view-open.section-light .site-header {
  color:var(--black);
  border-color:rgba(5,5,5,.14);
  background:rgba(244,244,244,.96);
}
.section-light .brand-logo .mini-logo :is(.logo-flow,.logo-point) use { stroke:var(--black); }
.section-light .brand-logo .mini-logo .logo-point use { filter:drop-shadow(0 0 2px rgba(5,5,5,.58)); }
.site-header.is-scrolled {
  padding-top: .75rem; padding-bottom: .75rem; border-color: var(--line);
  background: rgba(5,5,5,.96);
}
.svg-sprite { position:absolute; width:0; height:0; overflow:hidden; }
.brand { display: inline-flex; align-items: center; gap: .8rem; font-size: .62rem; letter-spacing: .28em; text-transform: uppercase; }
.brand-logo { display:grid; width:4.65rem; height:3.9rem; place-items:center; padding:0; border:0; cursor:pointer; background:transparent; }
.brand-logo:focus-visible { outline:none; }
.brand-title { white-space:nowrap; }
.mini-logo {
  width:4.25rem;
  height:3.6rem;
  overflow:visible;
  transform:translateZ(0) scale(1);
  transform-origin:center;
  transition:transform .48s var(--ease), filter .48s ease;
}
.section-view-open .brand-logo:hover .mini-logo,
.section-view-open .brand-logo:focus-visible .mini-logo {
  filter:drop-shadow(0 0 .65rem rgba(255,255,255,.2));
  transform:translateZ(0) scale(1.24);
}
.mini-logo,.main-logo,.n-menu-map { shape-rendering:geometricPrecision; text-rendering:geometricPrecision; }
.mini-logo,.main-logo { backface-visibility:hidden; }
.mini-logo :is(path,use) { fill:none; stroke-linecap:round; stroke-linejoin:round; stroke-miterlimit:2; vector-effect:non-scaling-stroke; }
.mini-logo .logo-base use { stroke:currentColor; stroke-width:1; }
.site-footer .brand { gap:0; }
.site-footer .brand-title { font-size:.64rem; font-weight:500; letter-spacing:.26em; }
.mini-logo .logo-flow use { stroke:var(--accent); stroke-width:1.4; stroke-dasharray:120 880; animation:flow 6.5s linear infinite; }
.mini-logo .logo-point use {
  stroke:var(--accent); stroke-width:7; stroke-dasharray:.01 999.99;
  filter:drop-shadow(0 0 2px rgba(255,255,255,.86));
  animation:point-flow 6.5s linear infinite;
}
.brand-logo .mini-logo .logo-base use { stroke-width:5.8; }
.brand-logo .mini-logo .logo-flow use {
  stroke-width:6.4;
  animation-name:flow-attention;
  animation-duration:8.2s;
}
.brand-logo .mini-logo .logo-flow use:nth-child(2) { animation-name:flow-distraction; animation-duration:7.3s; animation-delay:-1.5s; }
.brand-logo .mini-logo .logo-flow use:nth-child(3) { animation-name:flow-hyperfocus; animation-duration:9.1s; animation-delay:-3s; }
.brand-logo .mini-logo .logo-flow use:nth-child(4) { animation-name:flow-stop-go; animation-duration:7.6s; animation-delay:-4.5s; }
.brand-logo .mini-logo .logo-point { opacity:1; }
.brand-logo .mini-logo .logo-point use {
  stroke-width:9;
  animation-name:point-attention;
  animation-duration:8.2s;
}
.brand-logo .mini-logo .logo-point use:nth-child(2) { animation-name:point-distraction; animation-duration:7.3s; animation-delay:-1.5s; }
.brand-logo .mini-logo .logo-point use:nth-child(3) { animation-name:point-hyperfocus; animation-duration:9.1s; animation-delay:-3s; }
.brand-logo .mini-logo .logo-point use:nth-child(4) { animation-name:point-stop-go; animation-duration:7.6s; animation-delay:-4.5s; }
.brand-logo:hover .logo-flow use { opacity:1; }
.main-nav { display: none; align-items: center; gap: clamp(1.5rem, 3.4vw, 3.8rem); }
.main-nav a { position: relative; padding: .5rem 0; color: #bebec1; font-size: .62rem; letter-spacing: .22em; text-transform: uppercase; }
.main-nav a::after { position: absolute; bottom: .15rem; left: 0; width: 100%; height: 1px; content: ""; background: var(--accent); transform: scaleX(0); transform-origin: right; transition: transform .35s var(--ease); }
.main-nav a:hover::after, .main-nav a.is-active::after { transform: scaleX(1); transform-origin: left; }
.main-nav a span { color: var(--accent); }
.menu-toggle { display: none; border: 0; background: transparent; }

.hero {
  position:relative; min-height:100vh; min-height:100svh; display:grid; place-items:center;
  padding:clamp(2rem,5vw,5rem); overflow:hidden;
  background:radial-gradient(circle at 50% 48%,rgba(72,74,85,.16),transparent 35rem);
}
.hero-invitation {
  position:absolute; z-index:21; left:50%; bottom:max(1.25rem,env(safe-area-inset-bottom));
  display:inline-flex; min-height:2.75rem; align-items:center; gap:.8rem; padding:.45rem .75rem;
  border:0; color:var(--site-muted); background:transparent; cursor:pointer;
  font-size:.58rem; letter-spacing:.2em; text-transform:uppercase;
  transform:translateX(-50%);
  transition:color .3s ease,opacity .35s ease,transform .35s var(--ease);
}
.hero-invitation > span { width:1.75rem; height:1px; background:currentColor; transition:width .35s var(--ease); }
.hero-invitation b { font-weight:500; white-space:nowrap; }
.hero-invitation:hover,.hero-invitation:focus-visible {
  color:var(--site-fg); outline:none; transform:translateX(-50%) translateY(-2px);
}
.hero-invitation:hover > span,.hero-invitation:focus-visible > span { width:2.4rem; }
.n-menu-open .hero-invitation,.section-view-open .hero-invitation { opacity:0; pointer-events:none; }
@media (min-width:721px) {
  .hero-invitation { bottom:max(3rem,env(safe-area-inset-bottom)); }
}
@media (min-width:721px) and (max-height:850px) {
  .hero .logo-wrap { width:min(84vh,52rem); max-width:92vw; }
}
.hero-copy { position: relative; z-index: 2; max-width: 44rem; }
.kicker { display: flex; align-items: center; gap: .7rem; margin: 0 0 1.7rem; color: #aaaab0; font-size: .61rem; letter-spacing: .24em; text-transform: uppercase; }
.kicker > span { width: 1.8rem; height: 1px; background: var(--accent); }
h1,h2,h3,p { margin-top: 0; }
h1,h2 { font-weight: 300; letter-spacing: -.055em; }
h1 { max-width: 12ch; margin-bottom: 1.7rem; font-size: clamp(3.45rem, 6.2vw, 7.5rem); line-height: .92; }
h1 em { color: var(--accent); font-family: Georgia, serif; font-weight: 400; }
.hero-text { max-width: 35rem; margin-bottom: 2.4rem; color: var(--muted); font-size: clamp(.95rem,1.2vw,1.15rem); line-height: 1.75; }
.hero-actions { display: flex; align-items: center; gap: 2rem; }
.pill { display: inline-flex; align-items: center; justify-content: space-between; gap: 2.5rem; min-height: 3.65rem; padding: 0 1.45rem; border: 1px solid transparent; border-radius: 999px; font-size: .65rem; letter-spacing: .17em; text-transform: uppercase; transition: transform .35s var(--ease), background .35s, color .35s; }
.external-link-icon { display:block; flex:0 0 auto; width:1rem; height:1rem; overflow:visible; }
.external-link-icon path { fill:none; stroke:currentColor; stroke-width:1.75; stroke-linecap:round; stroke-linejoin:round; vector-effect:non-scaling-stroke; }
.pill:hover { transform: translateY(-3px); }
.pill-light { color: var(--black); background: var(--white); }
.pill-light:hover { background: var(--accent); }
.under-link { padding: .6rem 0; border-bottom: 1px solid var(--line); color: #c1c1c4; font-size: .65rem; letter-spacing: .16em; text-transform: uppercase; }
.under-link span { display: inline-block; margin-left: .45rem; color: var(--accent); transition: transform .3s var(--ease); }
.under-link:hover span { transform: translate(.2rem,-.2rem); }

.logo-wrap { position: relative; z-index: 20; width:min(92vw,52rem); }
.logo-stage { position: relative; z-index:2; display: block; width: 100%; aspect-ratio: 1.15; padding: 0; border: 0; outline: none; cursor: pointer; background: transparent; }
.logo-stage::before { position: absolute; inset: 12%; content: ""; border-radius: 50%; background:radial-gradient(circle,var(--site-fg-8,rgba(255,255,255,.08)),transparent 69%); opacity:.65; transition:opacity .4s; }
.logo-stage:hover::before { opacity: 1; }
.logo-stage:focus-visible { outline:none; }
.logo-stage:focus-visible .main-logo { opacity:1; }
.main-logo { position:relative; width:100%; overflow:visible; }
.logo-motion { transform-box:fill-box; transform-origin:center; }
.logo-base :is(path,use),.logo-flow :is(path,use),.logo-point :is(path,use) { fill:none; stroke-linecap:round; stroke-linejoin:round; stroke-miterlimit:2; vector-effect:non-scaling-stroke; }
.main-logo .logo-base use { --rest-opacity:1; stroke:rgba(245,244,241,.94); stroke-width:2.3; pointer-events:fill; }
.main-logo .logo-base use:nth-child(2) { --rest-opacity:.88; opacity: .88; }
.main-logo .logo-base use:nth-child(3) { --rest-opacity:.78; opacity: .78; }
.main-logo .logo-base use:nth-child(4) { --rest-opacity:.68; opacity: .68; }
.main-logo .logo-flow use {
  stroke:var(--accent); stroke-width:2.3; stroke-dasharray:118 882;
  animation:flow-attention 8.2s linear infinite;
  transition:stroke .4s,opacity .35s;
}
.main-logo .logo-flow use:nth-child(2) { animation-name:flow-distraction; animation-duration: 7.3s; animation-delay: -1.5s; }
.main-logo .logo-flow use:nth-child(3) { animation-name:flow-hyperfocus; animation-duration: 9.1s; animation-delay: -3s; }
.main-logo .logo-flow use:nth-child(4) { animation-name:flow-stop-go; animation-duration: 7.6s; animation-delay: -4.5s; }
.main-logo .logo-flow { opacity:1; transition:opacity .8s ease-out; }
.main-logo .logo-point use {
  stroke:var(--accent); stroke-width:8; stroke-dasharray:.01 999.99;
  opacity:.96;
  filter:drop-shadow(0 0 3px rgba(255,255,255,.88));
  animation:point-attention 8.2s linear infinite;
}
.main-logo .logo-point use:nth-child(2) { animation-name:point-distraction; animation-duration:7.3s; animation-delay:-1.5s; }
.main-logo .logo-point use:nth-child(3) { animation-name:point-hyperfocus; animation-duration:9.1s; animation-delay:-3s; }
.main-logo .logo-point use:nth-child(4) { animation-name:point-stop-go; animation-duration:7.6s; animation-delay:-4.5s; }
html[data-theme="light"] body :is(.main-logo,.mini-logo) .logo-flow use { filter:none; }
html[data-theme="light"] body :is(.main-logo,.mini-logo) .logo-point use {
  filter:drop-shadow(0 0 3px rgba(5,5,5,.7));
}
html[data-theme="light"] body.section-light .brand-logo .mini-logo .logo-flow use { filter:none; }
html[data-theme="light"] body.section-light .brand-logo .mini-logo .logo-point use {
  filter:drop-shadow(0 0 2px rgba(5,5,5,.58));
}
.n-menu-open .main-logo :is(.logo-base,.logo-flow,.logo-point) use { transition:opacity .35s,stroke-width .35s; }
.n-menu-open .logo-stage[data-menu-line="1"] :is(.logo-base,.logo-flow,.logo-point) use:nth-child(1),
.n-menu-open .logo-stage[data-menu-line="2"] :is(.logo-base,.logo-flow,.logo-point) use:nth-child(2),
.n-menu-open .logo-stage[data-menu-line="3"] :is(.logo-base,.logo-flow,.logo-point) use:nth-child(3),
.n-menu-open .logo-stage[data-menu-line="4"] :is(.logo-base,.logo-flow,.logo-point) use:nth-child(4) { opacity:1 !important; animation-play-state:running; }
.n-menu-open .logo-stage[data-menu-line="1"] :is(.logo-base,.logo-flow) use:nth-child(1),
.n-menu-open .logo-stage[data-menu-line="2"] :is(.logo-base,.logo-flow) use:nth-child(2),
.n-menu-open .logo-stage[data-menu-line="3"] :is(.logo-base,.logo-flow) use:nth-child(3),
.n-menu-open .logo-stage[data-menu-line="4"] :is(.logo-base,.logo-flow) use:nth-child(4) { stroke-width:4; }
.logo-stage:hover .logo-flow use { opacity:.72; }
.logo-stage.is-syncing .logo-flow use,
.brand-logo.is-syncing .logo-flow use,
.logo-stage.is-syncing .logo-point use,
.brand-logo.is-syncing .logo-point use { opacity:1; }
.n-menu { position:absolute; z-index:3; inset:0; pointer-events:none; }
.n-menu-item {
  --menu-x:0; --menu-y:0; position:absolute; display:flex; align-items:center; gap:.7rem;
  min-width:7.7rem; padding:.8rem 1rem; border:1px solid rgba(255,255,255,.28); border-radius:999px;
  color:var(--white); background:rgba(5,5,5,.9);
  font-size:.63rem; letter-spacing:.2em; text-transform:uppercase; opacity:0;
  transform:translate(var(--menu-x),var(--menu-y)) scale(.65); transition:opacity .35s,transform .65s var(--ease),background .3s,color .3s;
}
.n-menu-item::before { position:absolute; top:50%; width:clamp(2.5rem,7vw,5.5rem); height:1px; content:""; background:linear-gradient(90deg,transparent,rgba(255,255,255,.75)); transform:scaleX(0); transition:transform .55s .15s var(--ease); }
.n-menu-item span { color:#777; font-size:.5rem; }
.n-menu-item:hover,.n-menu-item:focus-visible { color:var(--black); background:var(--white); outline:none; }
.n-menu-foto { top:8%; left:-3%; --menu-x:13rem; --menu-y:9rem; }
.n-menu-post { top:14%; right:-3%; --menu-x:-13rem; --menu-y:7rem; }
.n-menu-lavori { bottom:13%; left:-1%; --menu-x:14rem; --menu-y:-7rem; }
.n-menu-cv { right:0; bottom:7%; --menu-x:-14rem; --menu-y:-9rem; }
.n-menu-foto::before,.n-menu-lavori::before { left:100%; transform-origin:left; }
.n-menu-post::before,.n-menu-cv::before { right:100%; background:linear-gradient(90deg,rgba(255,255,255,.75),transparent); transform-origin:right; }
.n-menu-open .n-menu { pointer-events:none; }
.n-menu-open .logo-wrap { pointer-events:none; }
.n-menu-open .logo-stage,
.n-menu-open .n-menu-flow text,
.n-menu-open .n-menu-label-hit { pointer-events:auto; }
.n-menu-open .n-menu-item { opacity:1; transform:none; }
.n-menu-open .n-menu-item::before { transform:scaleX(1); }
.n-menu-open .n-menu-item:nth-child(2) { transition-delay:.06s; }
.n-menu-open .n-menu-item:nth-child(3) { transition-delay:.12s; }
.n-menu-open .n-menu-item:nth-child(4) { transition-delay:.18s; }
.n-menu-map { position:absolute; inset:0; width:100%; height:100%; overflow:visible; opacity:0; transition:opacity .4s var(--ease); }
.n-menu-map a { cursor:pointer; outline:none; }
.n-menu-hit { fill:none; stroke:transparent; stroke-width:28; pointer-events:none; vector-effect:non-scaling-stroke; }
.n-menu-label-hit { fill:transparent; stroke:none; pointer-events:none; cursor:pointer; }
.n-menu-flow text { fill:white; stroke:#050505; stroke-width:5; paint-order:stroke fill; pointer-events:visiblePainted; cursor:pointer; font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; font-size:15px; font-weight:500; letter-spacing:2.35px; opacity:0; transform:translateY(6px) scale(.97); transform-origin:center; transition:opacity .42s ease,transform .62s var(--ease),font-size .32s var(--ease),letter-spacing .32s var(--ease); }
.n-menu-open .n-menu-map { opacity:1; }
.n-menu-open .n-menu-flow text { opacity:.76; transform:translateY(0) scale(1); }
.n-menu-open .n-menu-map a:nth-child(2) text { transition-delay:.08s; }
.n-menu-open .n-menu-map a:nth-child(3) text { transition-delay:.16s; }
.n-menu-open .n-menu-map a:nth-child(4) text { transition-delay:.24s; }
.n-menu[data-active-line] .n-menu-map a text { opacity:.08; }
.n-menu[data-active-line="1"] a[data-line="1"] text,
.n-menu[data-active-line="2"] a[data-line="2"] text,
.n-menu[data-active-line="3"] a[data-line="3"] text,
.n-menu[data-active-line="4"] a[data-line="4"] text { opacity:1; font-size:20px; letter-spacing:2.9px; }
.is-entering-flow .n-menu-map { opacity:0; transition-duration:.2s; }
.n-menu-open :is(.logo-flow,.logo-point) use { opacity:1; }
.radial-backdrop { position:fixed; z-index:10; inset:0; visibility:hidden; padding:0; border:0; opacity:0; background:rgba(0,0,0,.9); transition:opacity .4s,visibility .4s; }
.n-menu-open .radial-backdrop { visibility:visible; opacity:1; }
.n-menu-open { overflow:hidden; }
.n-menu-open .logo-stage { opacity:.42; transition:opacity .4s; }
.section-view-open .hero { min-height:0; height:0; padding:0; overflow:visible; }
.section-view-open .hero .logo-wrap { visibility:hidden; }
.section-view-open.is-preparing-home .hero { min-height:100vh; min-height:100svh; height:auto; padding:clamp(2rem,5vw,5rem); overflow:hidden; }
.section-view-open.is-preparing-home .hero .logo-wrap { visibility:visible; }
.is-preparing-home .flow-transition { background:#050505; }
.is-preparing-home .site-header { opacity:0 !important; pointer-events:none; transition:none; }
.is-preparing-home .is-section-active { display:none !important; }
.is-return-home-ready .logo-wrap {
  visibility:visible;
  opacity:1 !important;
  transform:none !important;
  transition:none !important;
}
body.is-return-canvas-active .hero .logo-wrap {
  visibility:hidden !important;
  opacity:0 !important;
}
body.is-return-canvas-active.is-handoff-fading .hero .logo-wrap {
  visibility:visible !important;
  opacity:1 !important;
}
.section-view-open.n-menu-open .hero .logo-wrap { position:fixed; z-index:20; inset:4.8rem 0 0; display:grid; visibility:visible; width:100%; height:calc(100vh - 4.8rem); height:calc(100svh - 4.8rem); padding:1rem; place-items:center; }
.section-view-open.n-menu-open .hero .logo-stage { width:min(82vw,44rem); }
.logo-wrap[data-enter-line="1"] { --flow-x:18%; --flow-y:48%; --dive-x:20%; --dive-y:2%; }
.logo-wrap[data-enter-line="2"] { --flow-x:37%; --flow-y:39%; --dive-x:7%; --dive-y:8%; }
.logo-wrap[data-enter-line="3"] { --flow-x:61%; --flow-y:59%; --dive-x:-8%; --dive-y:-7%; }
.logo-wrap[data-enter-line="4"] { --flow-x:80%; --flow-y:47%; --dive-x:-20%; --dive-y:3%; }
.is-entering-flow .logo-wrap { pointer-events:none; }
.is-entering-flow .n-menu-item { opacity:0; transform:scale(.75); transition-duration:.2s; }
.is-entering-flow .radial-backdrop { background:#050505; backdrop-filter:none; }
.is-entering-flow .logo-stage :is(.logo-base,.logo-flow,.logo-point) use { opacity:.025 !important; }
.is-entering-flow .logo-stage[data-enter-line="1"] :is(.logo-base,.logo-flow,.logo-point) use:nth-child(1),
.is-entering-flow .logo-stage[data-enter-line="2"] :is(.logo-base,.logo-flow,.logo-point) use:nth-child(2),
.is-entering-flow .logo-stage[data-enter-line="3"] :is(.logo-base,.logo-flow,.logo-point) use:nth-child(3),
.is-entering-flow .logo-stage[data-enter-line="4"] :is(.logo-base,.logo-flow,.logo-point) use:nth-child(4) { opacity:1 !important; stroke-width:5; }
.flow-transition { position:fixed; z-index:80; inset:0; display:grid; visibility:hidden; overflow:hidden; place-items:center; pointer-events:none; opacity:0; background:#050505; }
.flow-transition { contain:strict; }
.flow-transition canvas { width:100%; height:100%; backface-visibility:hidden; transform:translateZ(0); }
.is-return-launching .flow-transition {
  visibility:visible;
  opacity:1;
  transition:opacity .16s cubic-bezier(.2,.7,.25,1);
}
.is-entering-flow .flow-transition { visibility:visible; opacity:1; }
.is-return-canvas-active .flow-transition { visibility:visible; opacity:1; }
.is-return-launching:is(.is-entering-flow,.is-return-canvas-active) .flow-transition { opacity:1; }
.is-entering-flow .flow-transition,
.is-return-launching .flow-transition,
.is-return-canvas-active .flow-transition { will-change:opacity; }
.is-entering-flow .main-logo :is(.logo-flow,.logo-point) use { animation-play-state:paused !important; }
.is-entering-flow.is-preparing-home .main-logo :is(.logo-flow,.logo-point) use { animation-play-state:running !important; }
.section-view-open:not(.n-menu-open) .main-logo :is(.logo-flow,.logo-point) use,
body:not(.section-view-open) .mini-logo :is(.logo-flow,.logo-point) use,
body.modal-open :is(.main-logo,.mini-logo) :is(.logo-flow,.logo-point) use,
.is-page-hidden * { animation-play-state:paused !important; }
body.modal-open main .art-contours span,
body.modal-open main .art-orbit span,
.works:not(.is-section-active) :is(.art-contours,.art-orbit) span { animation-play-state:paused !important; }
.photos,.posts,.works,.cv-callout { display:none; }
.section-view-open .section.is-section-active { display:block; }
.section-view-open .cv-callout.is-section-active { display:grid; }
.site-footer { display:none; }
.logo-caption { position: absolute; right: 3%; bottom: 4%; display: flex; align-items: center; gap: .6rem; margin: 0; color: #7c7c81; font-size: .54rem; letter-spacing: .21em; text-transform: uppercase; }
.logo-caption i { width: .32rem; height: .32rem; border-radius: 50%; background: var(--accent); box-shadow: 0 0 .7rem var(--accent); animation: blink 1.7s ease-in-out infinite; }
.hero-bottom { position: absolute; left: var(--pad); right: var(--pad); bottom: 1.5rem; display: flex; justify-content: space-between; color: #77777c; font-size: .56rem; letter-spacing: .23em; text-transform: uppercase; }
.hero-bottom b { display: inline-block; margin-left: .4rem; color: var(--accent); animation: down 1.7s ease-in-out infinite; }

.ticker { overflow: hidden; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: #09090a; }
.ticker > div { display: flex; width: max-content; animation: ticker 28s linear infinite; }
.ticker span { padding: 1rem 0; white-space: nowrap; color: #aaaab0; font-size: .62rem; letter-spacing: .23em; text-transform: uppercase; }
.ticker i { margin: 0 2rem; color: var(--accent); font-size: .45rem; font-style: normal; }

.section {
  position:relative;
  padding:clamp(7.5rem,10vw,10rem) var(--pad) clamp(6rem,9vw,9rem);
}
.section::before {
  position:absolute; top:clamp(5.6rem,7vw,7rem); right:var(--pad);
  color:var(--muted); font-size:.55rem; letter-spacing:.2em;
}
.photos::before { content:"01 / 04"; }
.posts::before { content:"02 / 04"; }
.works::before { content:"03 / 04"; }
.cv-callout::before { content:"04 / 04"; color:#77777c; }
.section-head {
  display:grid; grid-template-columns:minmax(0,1.45fr) minmax(18rem,.55fr);
  align-items:end; gap:clamp(2rem,6vw,8rem);
  margin-bottom:clamp(3.5rem,6vw,6rem); padding-top:1.25rem;
  border-top:1px solid var(--line);
}
.section-head h2,.cv-copy h2 {
  max-width:9ch; margin:0; font-size:clamp(3.8rem,7vw,7.8rem);
  font-weight:300; line-height:.82; letter-spacing:-.075em;
}
.section-head .kicker { margin-bottom:clamp(1.5rem,3vw,2.5rem); }
.section-head > p {
  max-width:26rem; margin:0; padding-bottom:.35rem;
  color:var(--muted); font-size:clamp(.88rem,1.05vw,1rem); line-height:1.75;
}
.empty-state {
  display:grid; grid-template-columns:minmax(17rem,.78fr) minmax(0,1.22fr);
  min-height:clamp(26rem,38vw,35rem);
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
}
.empty-mark {
  position:relative; display:grid; min-width:0; place-items:center; overflow:hidden;
  border-right:1px solid var(--line);
}
.empty-mark::before {
  position:absolute; width:min(72%,24rem); aspect-ratio:1; content:"";
  border:1px solid var(--line); border-radius:50%; opacity:.55;
}
.empty-mark::after {
  position:absolute; inset:-20%; content:""; pointer-events:none;
  background:linear-gradient(105deg,transparent 42%,currentColor 50%,transparent 58%);
  opacity:.035; transform:translateX(-70%);
  animation:empty-scan 7s var(--ease) infinite;
}
.empty-mark svg {
  position:relative; z-index:1; width:min(68%,20rem); overflow:visible;
  transform:rotate(3deg);
}
.empty-mark use {
  fill:none; stroke:currentColor; stroke-width:5; stroke-linecap:round;
  stroke-dasharray:1 11; opacity:.68;
  animation:empty-dots 16s linear infinite;
}
.empty-mark b {
  position:absolute; top:1.4rem; left:1.4rem; z-index:2;
  font-size:.58rem; font-weight:500; letter-spacing:.18em;
}
.empty-copy {
  display:flex; min-width:0; flex-direction:column; justify-content:center;
  padding:clamp(2.5rem,7vw,7rem);
}
.empty-status {
  display:flex; align-items:center; gap:.75rem; margin:0 0 clamp(2rem,4vw,3.5rem);
  color:var(--muted); font-size:.57rem; letter-spacing:.19em; text-transform:uppercase;
}
.empty-status span { width:2rem; height:1px; background:currentColor; }
.empty-status b { font-weight:600; }
.empty-copy h3 {
  max-width:14ch; margin:0 0 1.5rem;
  font-size:clamp(2.6rem,5vw,5.5rem); font-weight:300;
  line-height:.94; letter-spacing:-.06em;
}
.empty-copy > p:not(.empty-status,.empty-meta) {
  max-width:37rem; margin:0; color:var(--muted);
  font-size:clamp(.92rem,1.1vw,1.05rem); line-height:1.75;
}
.empty-meta {
  margin:auto 0 0; padding-top:2.5rem; color:var(--muted);
  font-size:.55rem; letter-spacing:.18em; text-transform:uppercase;
}

.photos { background: var(--black); }
.photo-grid {
  display:grid; grid-template-columns:repeat(12,minmax(0,1fr));
  gap:clamp(1.5rem,3vw,3.5rem); align-items:start;
  counter-reset:photo;
}
.photo {
  position:relative; min-width:0; grid-column:span 5; margin:0; cursor:zoom-in;
  counter-increment:photo;
}
.photo::before {
  position:absolute; z-index:2; top:1rem; left:1rem;
  display:grid; width:2.3rem; height:2.3rem; place-items:center;
  border:1px solid rgba(255,255,255,.24); border-radius:50%;
  color:#fff; background:rgba(0,0,0,.28); backdrop-filter:blur(8px);
  content:"0" counter(photo); font-size:.52rem; letter-spacing:.08em;
}
.photo:focus-visible { outline-offset:.7rem; }
.photo-tall { grid-column:span 7; grid-row:span 2; }
.photo-wide { grid-column:3 / -1; margin-top:clamp(1rem,4vw,4rem); }
.photo-image {
  position:relative; min-height:clamp(22rem,38vw,39rem); overflow:hidden;
  content-visibility:auto; contain-intrinsic-size:auto 39rem; contain:paint style;
  border:1px solid var(--line); background:#111;
  transition:border-color .4s,transform .7s var(--ease),filter .5s;
}
.photo:not(.photo-tall):not(.photo-wide) .photo-image { min-height:clamp(17rem,22vw,24rem); }
.photo-wide .photo-image { min-height:clamp(20rem,28vw,29rem); }
.photo-image::after { position: absolute; inset: 0; content: ""; opacity: .12; background: linear-gradient(110deg,transparent 35%,white 49%,transparent 63%); transform: translateX(-100%); transition: transform 1.2s var(--ease); }
.photo:hover .photo-image::after { transform: translateX(100%); }
.photo:hover .photo-image { border-color:var(--site-line-strong,rgba(255,255,255,.36)); transform:translateY(-.35rem); }
figcaption {
  display:flex; justify-content:space-between; gap:1rem; padding:1rem 0;
  border-bottom:1px solid var(--line); color:#929297;
  font-size:.56rem; letter-spacing:.16em; text-transform:uppercase;
}
figcaption > span:first-child { color:currentColor; font-weight:600; }
figcaption > span { min-width:0; }
.image-mountain { background:linear-gradient(165deg,#575757 0%,#242526 50%,#080808 100%); }
.sun { position: absolute; top: 13%; right: 15%; width: 5rem; height: 5rem; border-radius: 50%; background: #ddd; box-shadow: 0 0 6rem #ddd; }
.ridge { position: absolute; left: -10%; bottom: -14%; width: 120%; height: 70%; background: #17191b; clip-path: polygon(0 80%,15% 42%,27% 62%,43% 12%,58% 55%,69% 29%,84% 64%,100% 35%,100% 100%,0 100%); }
.ridge-two { bottom: -27%; opacity: .88; background: #050506; transform: scaleX(-1); }
.image-city { background: linear-gradient(145deg,#d6d6d6,#777); }
.building { position: absolute; bottom: -4%; background: #151617; transform: skewY(-8deg); }
.b-one { left: 4%; width: 31%; height: 76%; }
.b-two { left: 39%; width: 25%; height: 52%; background: #353737; }
.b-three { right: -4%; width: 35%; height: 88%; background: #0a0b0b; }
.image-sea { background: linear-gradient(#aaa 0 44%,#505050 45%,#111 100%); }
.horizon { position: absolute; left: 0; top: 45%; width: 100%; height: 1px; background: rgba(255,255,255,.6); }
.moon { position: absolute; top: 17%; left: 19%; width: 2.8rem; height: 2.8rem; border-radius: 50%; background: #e9e5dc; box-shadow: 0 0 3rem rgba(255,255,255,.5); }
.image-road { background: linear-gradient(#707070,#333 52%,#111); }
.road { position: absolute; left: 28%; bottom: -5%; width: 44%; height: 100%; background: #111213; clip-path: polygon(42% 0,58% 0,100% 100%,0 100%); }
.road-line { position: absolute; left: 49.8%; bottom: 0; width: .25%; height: 58%; background: repeating-linear-gradient(white 0 1.6rem,transparent 1.6rem 3.2rem); transform: perspective(200px) rotateX(18deg); transform-origin: bottom; }

.posts { color: var(--black); background: var(--paper); }
.posts .kicker { color: #5d5d62; }
.posts .kicker > span { background:var(--black); }
.posts .section-head > p { color: #5f5f64; }
.post-list {
  display:grid; grid-template-columns:1.2fr 1fr 1fr;
  border-top:1px solid rgba(5,5,5,.2); counter-reset:post;
}
.post-row {
  position:relative; display:flex; min-width:0; min-height:clamp(25rem,34vw,34rem);
  flex-direction:column; align-items:stretch; gap:0;
  padding:clamp(1.5rem,2.5vw,2.5rem);
  border-right:1px solid rgba(5,5,5,.2); border-bottom:1px solid rgba(5,5,5,.2);
  counter-increment:post; transition:background-color .35s;
}
.post-row:last-child { border-right:0; }
.post-row::before {
  position:absolute; right:clamp(1.5rem,2.5vw,2.5rem); top:clamp(1.5rem,2.5vw,2.5rem);
  content:"0" counter(post); color:var(--site-muted); font-size:.55rem; letter-spacing:.18em;
}
.post-row:hover { background:var(--site-fg-4,rgba(255,255,255,.04)); }
.post-meta {
  display:flex; flex-direction:row; gap:.7rem; color:#6e6e72;
  font-size:.57rem; letter-spacing:.18em; text-transform:uppercase;
}
.post-meta span + span::before { margin-right:.7rem; content:"·"; }
.post-copy { margin:auto 0 2.5rem; }
.post-copy h3 {
  max-width:13ch; margin:0 0 1.1rem;
  font-size:clamp(2rem,3.1vw,3.65rem); font-weight:300;
  line-height:.98; letter-spacing:-.055em;
}
.post-copy p { max-width:32rem; margin:0; color:#65656a; font-size:.9rem; line-height:1.7; }
.post-row .round-link { align-self:flex-end; }
.round-link { display: grid; width: 3.8rem; height: 3.8rem; place-items: center; border: 1px solid rgba(5,5,5,.3); border-radius: 50%; cursor: pointer; background: transparent; transition: color .3s, background .3s, transform .35s var(--ease); }
.round-link:hover { color: white; background: var(--black); transform: rotate(45deg); }

.works { background: var(--black); }
.work-grid {
  display:grid; grid-template-columns:repeat(12,minmax(0,1fr));
  gap:clamp(2rem,4vw,5rem) clamp(1.5rem,3vw,3.5rem);
  counter-reset:work;
}
.work-card.work-main { grid-column:span 7; }
.work-card {
  --tx:0deg; --ty:0deg; position:relative; min-width:0; grid-column:span 5;
  cursor:pointer; counter-increment:work;
  transform:perspective(1100px) rotateX(var(--tx)) rotateY(var(--ty));
  transition:transform .18s linear;
}
.work-card:last-child { grid-column:4 / span 7; }
.work-card::before {
  position:absolute; z-index:2; top:1.2rem; left:1.2rem;
  display:grid; width:2.45rem; height:2.45rem; place-items:center;
  border:1px solid rgba(255,255,255,.25); border-radius:50%;
  color:#fff; background:rgba(0,0,0,.22); backdrop-filter:blur(8px);
  content:"0" counter(work); font-size:.52rem; letter-spacing:.08em;
}
.work-card:focus-visible { outline-offset:.7rem; }
.work-art {
  position:relative; min-height:clamp(26rem,40vw,42rem); overflow:hidden;
  content-visibility:auto; contain-intrinsic-size:auto 42rem; contain:paint style;
  border:1px solid var(--line); background:#111;
  transition:border-color .4s,transform .7s var(--ease);
}
.work-card:not(.work-main) .work-art { min-height:clamp(24rem,34vw,36rem); }
.work-card:hover .work-art { border-color:var(--site-line-strong,rgba(255,255,255,.36)); transform:translateY(-.35rem); }
.work-info { display:flex; align-items:center; justify-content:space-between; padding:1.25rem 0 1rem; border-bottom:1px solid var(--line); }
.work-info p { margin-bottom: .2rem; color: #86868b; font-size: .56rem; letter-spacing: .18em; text-transform: uppercase; }
.work-info h3 { margin:0; font-size:clamp(1.7rem,2.5vw,2.7rem); font-weight:300; letter-spacing:-.04em; }
.work-info::after { content:"↗"; color:var(--muted); font-size:1.1rem; transition:transform .35s var(--ease),color .35s; }
.work-card:hover .work-info::after { color:currentColor; transform:translate(.2rem,-.2rem); }
.work-info > span { color: #747479; font-size: .58rem; letter-spacing: .18em; }
.art-contours { display: grid; place-items: center; background: radial-gradient(circle,#373b3e,#0d0e0f 62%); }
.art-contours span { --contour-scale:1; position: absolute; width: min(58vw,38rem); aspect-ratio: 1.6; border: 1px solid rgba(255,255,255,.75); border-radius: 48% 52% 62% 38% / 53% 36% 64% 47%; animation:contour-drift 7s ease-in-out infinite alternate; }
.art-contours span:nth-child(2) { --contour-scale:.78; opacity: .75; animation-delay: -1.5s; }
.art-contours span:nth-child(3) { --contour-scale:.56; opacity: .55; animation-delay: -3s; }
.art-contours span:nth-child(4) { --contour-scale:.34; border-color: var(--accent); animation-delay: -4.5s; }
.art-contours b { position: absolute; left: 1.5rem; bottom: 1.3rem; color: #838388; font-size: .57rem; font-weight: 400; letter-spacing: .18em; }
.art-type { display: grid; place-items: center; color: var(--black); background: var(--white); }
.art-type b { font-size: clamp(3.2rem,7vw,7rem); line-height: .78; letter-spacing: -.07em; transform: rotate(-5deg); }
.art-orbit { background: radial-gradient(circle at center,rgba(141,156,255,.2),transparent 25%),#0d0d0e; }
.art-orbit span { position: absolute; inset: 16%; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; animation: orbit 14s linear infinite; }
.art-orbit span:nth-child(2) { inset: 30%; border-style: dashed; animation-direction: reverse; animation-duration: 10s; }
.art-orbit i { position: absolute; top: 50%; left: 50%; width: 1rem; height: 1rem; border-radius: 50%; background: var(--accent); box-shadow: 0 0 2rem var(--accent); transform: translate(-50%,-50%); }

.cv-callout { display:none; grid-template-columns:minmax(10rem,.42fr) minmax(0,1.58fr); align-items:start; gap:clamp(3rem,7vw,8rem); color:var(--black); background:var(--white); }
.cv-symbol {
  max-width:none; margin-top:clamp(5rem,10vw,9rem);
  font-size:clamp(3rem,4.5vw,4.5rem); font-weight:700;
  line-height:.9; letter-spacing:-.065em; white-space:nowrap; opacity:.46;
}
.cv-symbol.reveal.is-visible { opacity:.46; }
.cv-copy {
  display:grid; grid-template-columns:minmax(0,1fr) auto;
  column-gap:clamp(1.5rem,4vw,4rem);
}
.cv-copy > .kicker { grid-column:1; grid-row:1; align-self:center; }
.cv-copy > .cv-actions {
  grid-column:2; grid-row:1; align-self:start; justify-self:end; margin:0;
}
.cv-copy > h2 { grid-column:1 / -1; grid-row:2; }
.cv-copy > .cv-about-story { grid-column:1 / -1; grid-row:3; }
.cv-copy .kicker { color: rgba(5,5,5,.62); }
.cv-copy .kicker span { background: var(--black); }
.cv-copy h2 {
  max-width:none;
  margin-bottom:clamp(2.5rem,4vw,3.75rem);
  line-height:.96;
}
.cv-copy h2 span { display:inline-block; white-space:nowrap; }
html[lang="en"] .cv-copy h2 {
  max-width:none;
  font-size:clamp(3.5rem,6.3vw,7.1rem);
}
.cv-about-story { max-width:70rem; margin:0 0 clamp(2.5rem,5vw,4.5rem); }
.cv-about-lead {
  max-width:39rem; margin:0 0 clamp(1.75rem,3vw,2.5rem);
  color:var(--site-fg); font-size:clamp(1.25rem,2vw,1.8rem); line-height:1.45;
  letter-spacing:-.02em;
}
.cv-about-support {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(2rem,5vw,5rem);
}
.cv-about-support article { padding-top:1.3rem; border-top:1px solid rgba(5,5,5,.22); }
.cv-detail-label { margin:0 0 1.5rem; color:#77777c; font-size:.56rem; letter-spacing:.18em; text-transform:uppercase; }
.cv-about-support h3 {
  max-width:15ch; margin:0 0 1rem;
  font-size:clamp(1.5rem,2.2vw,2.3rem); font-weight:400;
  line-height:1.08; letter-spacing:-.035em;
}
.cv-about-support article > p:last-child {
  max-width:32rem; margin:0; color:#67676c; font-size:.9rem; line-height:1.75;
}
.cv-actions { display:flex; align-items:center; margin:0 0 clamp(3rem,5vw,4.5rem); }
.pill-dark { color: white; background: var(--black); }
.pill-dark:hover { color: white; background: var(--black); transform: none; }
.pill-dark:active { transform: scale(1.04); }

.site-footer { display:none; grid-template-columns: repeat(3,1fr); align-items: center; gap: 2rem; padding: 3rem var(--pad); border-top: 1px solid var(--line); }
.section-view-open .site-footer { display:grid; }
.site-footer > p,.footer-sections { margin: 0; color: #747479; font-size: .56rem; letter-spacing: .2em; text-align: center; text-transform: uppercase; }
.footer-sections { display:flex; align-items:center; justify-content:center; gap:.65rem; }
.footer-sections a { position:relative; padding:.35rem .05rem; transition:color .25s ease,opacity .25s ease; }
.footer-sections a::after {
  position:absolute; right:0; bottom:0; left:0; height:1px;
  content:""; background:currentColor;
  transform:scaleX(0); transform-origin:right;
  transition:transform .3s var(--ease);
}
.footer-sections a:hover::after,.footer-sections a:focus-visible::after {
  transform:scaleX(1); transform-origin:left;
}
.footer-sections a:focus-visible { outline:none; }
.site-footer > p:last-child { text-align: right; }

.post-modal { position: fixed; z-index: 90; inset: 0; display: grid; place-items: center; padding: 1rem; visibility: hidden; opacity: 0; background: rgba(0,0,0,.88); transition: opacity .35s,visibility .35s; }
.post-modal.is-open { visibility: visible; opacity: 1; }
.post-modal-card { position: relative; width: min(100%,52rem); max-height: min(88vh,50rem); overflow-y: auto; padding: clamp(2.2rem,6vw,5.5rem); border: 1px solid var(--line); background: #101011; transform: translateY(1.5rem) scale(.98); transition: transform .45s var(--ease); }
.post-modal.is-open .post-modal-card { transform: none; }
.post-modal-card h2 { margin-bottom: 2.2rem; font-size: clamp(2.5rem,5vw,5rem); line-height: .96; }
.post-modal-card [data-modal-body] { color: #b0b0b4; font-family: Georgia,serif; font-size: clamp(1rem,1.5vw,1.18rem); line-height: 1.85; }
.post-modal-card [data-modal-body] p { margin-bottom: 1.4rem; }
.modal-close { position: absolute; top: 1rem; right: 1rem; display: grid; width: 2.8rem; height: 2.8rem; place-items: center; border: 1px solid var(--line); border-radius: 50%; cursor: pointer; background: transparent; font-size: 1.25rem; }

.detail-modal {
  position:fixed; z-index:90; inset:0; display:grid; place-items:center; padding:1rem;
  visibility:hidden; opacity:0; background:rgba(0,0,0,.92);
  transition:opacity .35s,visibility .35s;
}
.detail-modal.is-open { visibility:visible; opacity:1; }
.detail-modal-card {
  position:relative; width:min(100%,72rem); max-height:min(92vh,58rem); max-height:min(92svh,58rem); display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(20rem,.95fr); overflow:auto;
  border:1px solid var(--line); background:#0d0d0e;
  transform:translateY(1.5rem) scale(.985); transition:transform .45s var(--ease);
}
.detail-modal.is-open .detail-modal-card { transform:none; }
.detail-visual { min-height:36rem; border-right:1px solid var(--line); background:#111; }
.detail-visual :is(.photo-image,.work-art) { width:100%; height:100%; min-height:36rem; border:0; }
.detail-visual .photo-image::after { display:none; }
.detail-content { align-self:center; padding:clamp(2.5rem,5vw,5rem); }
.detail-content h2 { margin:0 0 1.5rem; font-size:clamp(3rem,6vw,6rem); line-height:.9; }
.detail-lead { margin:0 0 2.5rem; color:#b1b1b5; font-size:clamp(1rem,1.3vw,1.12rem); line-height:1.75; }
.detail-facts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); margin:0 0 2.5rem; border-top:1px solid var(--line); }
.detail-facts div { padding:1rem 0; border-bottom:1px solid var(--line); }
.detail-facts div:nth-child(odd) { padding-right:1rem; }
.detail-facts dt { margin-bottom:.3rem; color:#7f7f84; font-size:.54rem; letter-spacing:.18em; text-transform:uppercase; }
.detail-facts dd { margin:0; font-size:.78rem; }
.detail-body { color:#a3a3a8; font-family:Georgia,serif; font-size:1rem; line-height:1.8; }
.detail-body p:last-child { margin-bottom:0; }
.noscript-note {
  position:fixed; z-index:150; right:1rem; bottom:1rem; max-width:28rem; padding:1rem 1.2rem;
  border:1px solid var(--line); color:var(--white); background:var(--black); font-size:.78rem;
}

.reveal { opacity: 0; transform: translateY(2rem); transition: opacity .9s var(--ease),transform .9s var(--ease); }
.reveal.is-visible { opacity: 1; transform: none; }

@keyframes flow { to { stroke-dashoffset: -1000; } }
@keyframes point-flow {
  from { stroke-dashoffset:-120; }
  to { stroke-dashoffset:-1120; }
}
@keyframes point-attention {
  0% { stroke-dashoffset:-118; }
  28% { stroke-dashoffset:-368; }
  54% { stroke-dashoffset:-638; }
  76% { stroke-dashoffset:-888; }
  100% { stroke-dashoffset:-1118; }
}
@keyframes point-distraction {
  0% { stroke-dashoffset:0; }
  26% { stroke-dashoffset:235; }
  39% { stroke-dashoffset:350; }
  54% { stroke-dashoffset:500; }
  76% { stroke-dashoffset:735; }
  100% { stroke-dashoffset:1000; }
}
@keyframes point-hyperfocus {
  0% { stroke-dashoffset:-72; }
  30% { stroke-dashoffset:-340; }
  58% { stroke-dashoffset:-710; }
  80% { stroke-dashoffset:-935; }
  100% { stroke-dashoffset:-1072; }
}
@keyframes point-stop-go {
  from { stroke-dashoffset:-118; }
  to { stroke-dashoffset:-1118; }
}
@keyframes flow-attention {
  0% { stroke-dashoffset:0; opacity:.62; }
  28% { stroke-dashoffset:-250; opacity:.75; }
  54% { stroke-dashoffset:-520; opacity:1; }
  76% { stroke-dashoffset:-770; opacity:.88; }
  100% { stroke-dashoffset:-1000; opacity:.62; }
}
@keyframes flow-distraction {
  0% { stroke-dashoffset:0; opacity:.68; }
  26% { stroke-dashoffset:235; opacity:.82; }
  39% { stroke-dashoffset:350; opacity:.35; }
  54% { stroke-dashoffset:500; opacity:.72; }
  76% { stroke-dashoffset:735; opacity:1; }
  100% { stroke-dashoffset:1000; opacity:.7; }
}
@keyframes flow-hyperfocus {
  0% { stroke-dashoffset:0; stroke-dasharray:72 928; opacity:.48; }
  30% { stroke-dashoffset:-250; stroke-dasharray:90 910; opacity:.62; }
  58% { stroke-dashoffset:-560; stroke-dasharray:150 850; opacity:1; }
  80% { stroke-dashoffset:-800; stroke-dasharray:135 865; opacity:.95; }
  100% { stroke-dashoffset:-1000; stroke-dasharray:72 928; opacity:.45; }
}
@keyframes flow-stop-go {
  from { stroke-dashoffset:0; }
  to { stroke-dashoffset:-1000; }
}
@keyframes blink { 0%,100% { opacity:.35; transform:scale(.8); } 50% { opacity:1; transform:scale(1.3); } }
@keyframes down { 0%,100% { transform:translateY(-.12rem); } 50% { transform:translateY(.3rem); } }
@keyframes ticker { to { transform:translateX(-50%); } }
@keyframes contour-drift {
  from { transform:translate3d(-1.2%,.8%,0) scale(var(--contour-scale)) rotate(-3deg); }
  to { transform:translate3d(1.2%,-.8%,0) scale(var(--contour-scale)) rotate(4deg); }
}
@keyframes orbit { to { transform:rotate(360deg); } }
@keyframes empty-dots { to { stroke-dashoffset:-120; } }
@keyframes empty-scan {
  0%,18% { transform:translateX(-70%); }
  62%,100% { transform:translateX(70%); }
}

@media (max-width: 960px) {
  .n-menu-flow text { font-size:16px; letter-spacing:2.25px; }
  .hero { min-height:100vh; min-height:100svh; padding:2rem; }
  .hero-copy { max-width:48rem; }
  .logo-wrap { width:min(100%,39rem); margin-top:-1rem; }
  .hero-bottom { position:relative; left:auto; right:auto; bottom:auto; grid-column:1; margin-top:-2rem; }
  .photo-grid { grid-template-columns:1fr 1fr; }
  .photo,.photo-tall { grid-column:auto; grid-row:auto; }
  .photo-wide { grid-column:1 / -1; margin-top:0; }
  .photo-tall .photo-image { min-height:70vw; }
  .post-list { grid-template-columns:1fr 1fr; }
  .post-row:first-child { grid-column:1 / -1; min-height:24rem; }
  .post-row:nth-child(2) { border-left:0; }
  .post-row:last-child { border-right:0; }
  .work-card.work-main { grid-column:1 / -1; }
  .work-card:not(.work-main) { grid-column:span 6; }
  .work-card:last-child { grid-column:span 6; }
  .cv-callout { grid-template-columns:minmax(8rem,.32fr) minmax(0,1.68fr); }
}

@media (max-width: 720px) {
  .main-logo,
  .n-menu-map {
    transform:translateX(1.25rem);
  }
  .hero-invitation {
    top:min(
      calc(50% + clamp(9.75rem,43vw,11.25rem)),
      calc(100svh - max(4.25rem,calc(env(safe-area-inset-bottom) + 3rem)))
    );
    bottom:auto;
  }
  .n-menu-flow text {
    font-size:17px;
    stroke-width:6;
    letter-spacing:2.2px;
  }
  .n-menu-open .n-menu-flow text { opacity:.86; }
  .n-menu-map a:hover text,.n-menu-map a:focus-visible text {
    font-size:21px;
    letter-spacing:2.7px;
  }
  .site-header { padding-top:1rem; padding-bottom:1rem; }
  .menu-toggle { display:none; }
  .menu-toggle i,.menu-toggle i::before { display:block; width:1.4rem; height:1px; content:""; background:currentColor; transition:transform .35s var(--ease); }
  .menu-toggle i::before { transform:translateY(-.32rem); }
  .menu-open .menu-toggle i { transform:rotate(45deg); }
  .menu-open .menu-toggle i::before { transform:rotate(-90deg); }
  .main-nav { position:fixed; z-index:1; inset:0; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:1rem; padding:var(--pad); visibility:hidden; opacity:0; background:rgba(5,5,5,.98); transition:opacity .35s,visibility .35s; }
  .menu-open .main-nav { visibility:visible; opacity:1; }
  .main-nav a { font-size:clamp(3rem,15vw,5.5rem); font-weight:300; letter-spacing:-.06em; text-transform:none; transform:translateY(1rem); transition:transform .45s var(--ease); }
  .menu-open .main-nav a { transform:none; }
  .hero { height:100vh; height:100svh; min-height:100vh; min-height:100svh; padding:1rem; }
  .logo-wrap { width:min(calc(100vw - 2rem),32rem); margin:0; }
  .section-view-open.is-preparing-home .hero { padding:1rem; }
  h1 { font-size:clamp(3.35rem,15vw,5rem); }
  .hero-actions { align-items:flex-start; flex-direction:column; gap:1.1rem; }
  .logo-caption { display:none; }
  .n-menu-open .logo-wrap { position:fixed; z-index:20; inset:4.8rem 0 0; display:grid; width:100%; height:calc(100vh - 4.8rem); height:calc(100svh - 4.8rem); margin:0; padding:1rem; place-items:center; }
  body:not(.section-view-open).n-menu-open .logo-wrap { inset:0; height:100vh; height:100svh; }
  .n-menu-open .logo-stage { width:min(calc(100vw - 2rem),32rem); opacity:.35; transition:opacity .4s; }
  .n-menu { inset:7% 0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.65rem; }
  .n-menu { display:block; }
  .n-menu-map { inset:0; }
  .n-menu-item,.n-menu-foto,.n-menu-post,.n-menu-lavori,.n-menu-cv { position:relative; inset:auto; min-width:8.5rem; justify-content:center; --menu-x:0; --menu-y:2rem; }
  .n-menu-item::before { display:none; }
  .hero-bottom { justify-content:flex-end; }
  .hero-bottom > span { display:none; }
  .section {
    padding-top:7rem;
    text-align:center;
  }
  .section::before { top:5.15rem; }
  .section-head {
    grid-template-columns:1fr; align-items:start; justify-items:center; gap:1.5rem;
  }
  .section-head > div { display:grid; justify-items:center; }
  .section-head .kicker,.cv-copy .kicker { justify-content:center; }
  .section-head h2,.cv-copy h2 {
    max-width:10ch; margin-inline:auto;
    font-size:clamp(3.25rem,14.5vw,5.25rem);
  }
  .cv-copy h2 {
    max-width:none;
    font-size:clamp(1.85rem,8.6vw,4.25rem);
    line-height:1;
  }
  .section-head > p { max-width:31rem; margin-inline:auto; }
  .empty-state { width:min(100%,34rem); grid-template-columns:1fr; margin-inline:auto; }
  .empty-mark {
    min-height:clamp(15rem,62vw,21rem);
    border-right:0; border-bottom:1px solid var(--line);
  }
  .empty-mark::before { width:min(62%,18rem); }
  .empty-mark svg { width:min(56%,15rem); }
  .empty-copy { align-items:center; padding:clamp(2.5rem,9vw,4.5rem) 1.5rem; }
  .empty-status { justify-content:center; }
  .empty-copy h3 { max-width:12ch; text-align:center; }
  .empty-copy > p:not(.empty-status,.empty-meta) { max-width:29rem; text-align:center; }
  .empty-meta { margin-top:2rem; }
  .photo-grid,.work-grid,.cv-callout { grid-template-columns:1fr; }
  .photo,.photo-tall,.photo-wide,.work-card.work-main,.work-card:not(.work-main),.work-card:last-child { grid-column:auto; }
  .photo,.work-card { width:min(100%,34rem); margin-inline:auto; }
  .photo-image,.photo-tall .photo-image,.photo:not(.photo-tall):not(.photo-wide) .photo-image,.photo-wide .photo-image {
    min-height:min(112vw,35rem);
  }
  figcaption { justify-content:center; text-align:center; }
  .post-list { grid-template-columns:1fr; }
  .post-row,.post-row:first-child {
    grid-column:auto; min-height:21rem; align-items:center;
    padding:clamp(1.5rem,6vw,2.25rem); border-right:0;
  }
  .post-row::before { right:50%; transform:translateX(50%); }
  .post-meta { justify-content:center; padding-top:1.5rem; }
  .post-copy { margin:auto 0 2rem; }
  .post-copy h3 {
    max-width:15ch; margin-inline:auto;
    font-size:clamp(2rem,8.5vw,3.2rem);
  }
  .post-copy p { max-width:30rem; margin-inline:auto; }
  .post-row .round-link { align-self:center; }
  .work-art,.work-card:not(.work-main) .work-art { min-height:min(108vw,34rem); }
  .work-info { justify-content:center; gap:1rem; }
  .work-info h3 { font-size:clamp(1.75rem,8vw,2.4rem); }
  .cv-symbol {
    position:static; grid-column:1; max-width:none; margin:0 auto -1rem;
    font-size:.55rem; line-height:1; letter-spacing:.18em;
    text-align:center; text-transform:uppercase; opacity:.82;
  }
  .cv-symbol.reveal.is-visible { opacity:.82; }
  .cv-copy {
    position:relative; z-index:1; grid-template-columns:1fr;
    column-gap:0; justify-items:center;
  }
  .cv-copy > .kicker,
  .cv-copy > h2,
  .cv-copy > .cv-about-story {
    grid-column:1; grid-row:auto;
  }
  .cv-copy > .cv-about-story { grid-row:3; padding-top:0; }
  .cv-copy > .cv-actions {
    grid-column:1; grid-row:4; justify-self:center;
    margin:3.5rem 0 0;
  }
  .cv-about-story { max-width:34rem; margin:0 auto 2.5rem; }
  .cv-about-lead { max-width:29rem; margin:0 auto 1.75rem; }
  .cv-about-support { grid-template-columns:1fr; gap:2.5rem; }
  .cv-about-support article { max-width:31rem; width:100%; margin-inline:auto; }
  .cv-about-support h3 { margin-inline:auto; }
  .cv-actions { justify-content:center; margin-bottom:3.5rem; }
  .site-footer { grid-template-columns:1fr; justify-items:center; gap:1rem; text-align:center; }
  .footer-sections { flex-wrap:wrap; row-gap:.25rem; }
  .site-footer > p:last-child { text-align:center; }
  .detail-modal { padding:0; }
  .detail-modal-card { width:100%; max-height:100vh; max-height:100svh; grid-template-columns:1fr; border:0; }
  .detail-visual { min-height:44vh; min-height:44svh; border-right:0; border-bottom:1px solid var(--line); }
  .detail-visual :is(.photo-image,.work-art) { min-height:44vh; min-height:44svh; }
  .detail-content { padding:2.5rem 1.25rem 3.5rem; text-align:center; }
  .detail-content .kicker { justify-content:center; }
  .detail-facts dd { overflow-wrap:anywhere; }
  .detail-facts { grid-template-columns:1fr 1fr; }
}

@media (max-width: 460px) {
  .n-menu-flow text {
    font-size:18px;
    letter-spacing:1.9px;
  }
  .n-menu-map a:hover text,.n-menu-map a:focus-visible text {
    font-size:22px;
    letter-spacing:2.3px;
  }
  .site-header .brand-title { display:none; }
  .mini-logo { width:3.95rem; }
  .main-logo { transform:scaleX(1.06) rotate(3deg) rotateX(var(--rx)) rotateY(var(--ry)); }
  figcaption { flex-direction:column; gap:.35rem; }
  .section { padding-inline:max(1.15rem,env(safe-area-inset-left)); }
  .section-head h2 { font-size:clamp(3rem,14vw,4.15rem); }
  .cv-copy h2,
  html[lang="en"] .cv-copy h2 { font-size:clamp(1.85rem,8.6vw,3.9rem); }
  .photo-image,.photo-tall .photo-image,.photo:not(.photo-tall):not(.photo-wide) .photo-image,.photo-wide .photo-image {
    min-height:min(106vw,30rem);
  }
  .work-art,.work-card:not(.work-main) .work-art { min-height:min(102vw,29rem); }
  .art-type b { font-size:clamp(2.75rem,16vw,4.7rem); }
  .detail-facts { grid-template-columns:1fr; }
  .detail-facts div:nth-child(odd) { padding-right:0; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { scroll-behavior:auto !important; animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  .hero-invitation > span { width:2.4rem; }
}

@media (hover:none) {
  .photo-image::after { display:none; }
  .photo,.work-card { cursor:pointer; }
  .round-link,.modal-close,.brand-logo { min-width:44px; min-height:44px; }
}
