/* Additive motion studies, scoped away from original homepage scenes. */
.motion-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.type-scene{height:250svh;background:#ece4c3;color:#3e168b;position:relative;margin:80px 0}
.type-stage{height:100svh;position:sticky;top:0;overflow:hidden;display:flex;align-items:center;justify-content:center;perspective:1100px}
.type-label{position:absolute;top:100px;left:5vw;font:700 11px/1.5 sans-serif;letter-spacing:.16em;text-transform:uppercase}
.type-foot{position:absolute;bottom:28px;left:5vw;right:5vw;display:flex;justify-content:space-between;font:700 11px/1.4 sans-serif;letter-spacing:.1em}
.type-cylinder{position:relative;width:100%;height:1px;transform-style:preserve-3d}
.type-cylinder span{position:absolute;left:0;top:0;width:100%;text-align:center;backface-visibility:hidden;font:700 clamp(80px,15vw,220px)/.9 'New Title',sans-serif;white-space:nowrap}
.type-cylinder span:nth-child(3n+2){color:#c64c38}.type-cylinder span:nth-child(3n){color:#157941}
.type-ticker{width:max-content;display:flex;gap:.22em;white-space:nowrap;font:700 clamp(100px,24vw,360px)/.95 'New Title',sans-serif;position:absolute;left:0}
.type-ticker .type-word{display:inline-flex}.type-ticker .type-char{display:inline-block;transform-origin:50% 90%}.type-word:nth-last-child(-n+2){color:#c64c38}
.trial-page{cursor:auto}.trial-nav{position:relative;z-index:3;display:flex;justify-content:space-between;gap:24px;padding:28px 5vw;border-bottom:1px solid #ece4c350;font-size:13px}.trial-nav a{color:inherit;text-decoration:none}.trial-head{padding:70px 5vw 50px}.trial-head h1{font:700 clamp(76px,14vw,180px)/.9 'New Title',sans-serif}.trial-head p{max-width:580px;margin-top:28px;line-height:1.7}.trial-links{padding:20px 5vw 80px;display:grid;grid-template-columns:1fr 1fr;gap:24px}.trial-links a{display:block;padding:32px;border:2px solid #ece4c3;border-radius:22px;color:inherit;text-decoration:none;transition:background .25s,color .25s,translate .25s}.trial-links a:hover{background:#ece4c3;color:#3e168b;translate:0 -5px}.trial-links h2{font:700 65px/1 'New Title';margin:14px 0}.trial-links p{line-height:1.6}
.orbit-item{height:135svh;position:relative}.orbit-stage{height:100svh;position:sticky;top:0;display:flex;align-items:center;justify-content:center;perspective:1000px;overflow:hidden}.orbit-rotor{width:min(46vw,540px);height:min(65svh,630px);position:relative;transform-style:preserve-3d}.orbit-card{display:block;width:100%;height:100%;border:4px solid #0a0907;border-radius:28px;overflow:hidden;background:var(--card-color,#ece4c3);color:#0a0907;box-shadow:0 30px 70px #16072d60;position:relative;text-decoration:none;transform:rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition:transform .25s ease;isolation:isolate}.orbit-card:focus-visible{outline:5px solid #f7d247;outline-offset:8px}.orbit-card .work-card-img{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.85;scale:1.06;transition:scale .4s}.orbit-card:hover .work-card-img{scale:1.13}.orbit-card::after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 40%,#0a0907a0);z-index:-1}.orbit-card .work-card-img{z-index:-2}.orbit-card .orbit-name{position:absolute;bottom:25px;left:24px;right:24px;font:700 clamp(52px,7vw,95px)/.9 'New Title';color:#fff2cc;text-shadow:0 2px 20px #0006}.orbit-card .orbit-tag{position:absolute;top:20px;left:20px;padding:10px 14px;background:#ece4c3;color:#0a0907;border-radius:50px;font-size:11px;font-weight:700}.orbit-card .orbit-open{position:absolute;right:20px;top:20px;background:#ece4c3;border-radius:50%;padding:10px 14px;color:#0a0907;transition:rotate .3s}.orbit-card:hover .orbit-open{rotate:45deg}.orbit-backword{position:absolute;font:700 clamp(90px,22vw,330px)/.9 'New Title';white-space:nowrap;opacity:.22;pointer-events:none}.orbit-count{position:absolute;bottom:32px;left:5vw;font-size:12px;letter-spacing:.15em}
.story-scene{min-height:150svh;padding:12svh 5vw}.story-surface{position:relative;padding:30px 0}.story-text{font:700 clamp(60px,10vw,150px)/.97 'New Title',sans-serif;text-transform:uppercase;position:relative;max-width:1200px}.story-text span{display:block}.story-surface canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.story-surface.is-webgl .story-text{opacity:0}.story-note{max-width:570px;font-size:15px;line-height:1.8;margin-top:45px}.story-end{font:700 clamp(100px,20vw,260px)/1 'New Title';color:#f7d247;padding:5vw}
@media(max-width:700px){.type-scene{height:220svh;margin:45px 0}.type-label{top:85px;left:24px}.type-foot{left:24px;right:24px;font-size:9px}.type-cylinder span{font-size:18vw}.type-ticker{font-size:36vw}.trial-links{grid-template-columns:1fr}.orbit-rotor{width:72vw;height:58svh}.orbit-item{height:115svh}.orbit-card{border-radius:22px}.orbit-card .orbit-name{font-size:65px}.story-text{font-size:13vw}.trial-nav{font-size:12px}}
@media(prefers-reduced-motion:reduce){.type-scene{height:auto}.type-stage{position:relative;height:auto;min-height:70svh;padding:130px 24px 90px}.type-cylinder{height:auto;transform:none!important}.type-cylinder span{position:static;display:block;transform:none!important;white-space:normal;margin:15px 0;font-size:clamp(52px,12vw,150px)}.type-cylinder span:nth-child(n+4){display:none}.type-ticker{position:static;transform:none!important;white-space:normal;width:auto;flex-wrap:wrap;font-size:clamp(65px,14vw,170px)}.type-char{transform:none!important}.orbit-item{height:auto}.orbit-stage{position:relative}.orbit-rotor,.orbit-card{transform:none!important}.story-surface canvas{display:none}.story-surface.is-webgl .story-text{opacity:1}}

/* Revision 02: portfolio palette, tighter cylinder and hidden entry state. */
.project-palette{transition:background-color .12s linear,color .12s linear}
.project-palette .type-scene{background:transparent;color:var(--fg)}
.project-palette .type-cylinder span{color:inherit;font-size:clamp(115px,21vw,300px);line-height:.82}
.project-palette .type-stage{perspective:1300px}
.project-palette .type-word:nth-last-child(-n+2){color:inherit}
.type-char{opacity:0;visibility:hidden}
.project-palette .life-build{background:transparent;color:var(--fg)}
.project-palette .pj-hero{background:transparent}
@media(max-width:700px){.project-palette .type-cylinder span{font-size:38vw}.project-palette .type-stage{perspective:900px}}
@media(prefers-reduced-motion:reduce){.type-char{opacity:1!important;visibility:visible!important}.project-palette{transition:none}}
/* Cards reproduce the unframed portrait images and black hover label in home. */
.orbit-rotor{width:min(43vw,440px);height:auto;aspect-ratio:var(--orbit-ratio,1 / 1.55)}
.orbit-card{border:0;border-radius:0;box-shadow:none;background:#291355}
.orbit-card .work-card-img{opacity:1;scale:1;transition:filter .3s,scale .4s}
.orbit-card::after{display:none}.orbit-card:hover .work-card-img{scale:1.015;filter:brightness(.62)}
.orbit-card .orbit-name,.orbit-card .orbit-tag,.orbit-card .orbit-open{display:none}
.orbit-label{position:absolute;z-index:4;pointer-events:none;left:var(--label-x,55%);top:var(--label-y,50%);opacity:0;transition:opacity .2s;background:#0a0907;color:#eee4bf;padding:14px 20px;border-radius:8px;min-width:145px}
.orbit-label small{display:block;font-size:11px;font-weight:700;letter-spacing:.12em;opacity:.6;text-transform:uppercase;margin-bottom:4px}.orbit-label strong{display:block;font:700 22px/1 'New Title';margin-bottom:6px}.orbit-label span{font-size:12px;opacity:.7;letter-spacing:.08em}
.orbit-rotor:hover .orbit-label,.orbit-rotor:focus-within .orbit-label{opacity:1}
@media(max-width:700px){.orbit-rotor{width:min(70vw,37svh);height:auto}.orbit-label{opacity:1;top:calc(100% + 18px);left:0;padding:0;background:none}.orbit-label strong{font-size:27px}.orbit-label span{display:none}.orbit-stage{padding-bottom:70px}}
@media(hover:none){.orbit-label{opacity:1}}
.story-page{--bg:#191919;--fg:#FF87C3;background:#191919;color:#FF87C3}
.story-page .trial-nav{border-color:#FF87C340}.story-page .story-scene{min-height:100svh;padding:16svh 5vw;display:flex;flex-direction:column;align-items:center;justify-content:center}
.story-page .story-surface{width:100%;padding:30px 0}.story-page .story-text{text-align:center;max-width:none;font-size:clamp(70px,13vw,190px);line-height:.9}.story-page .story-note{color:#FF87C3;text-align:center}
.story-page .story-scene:first-child .story-text{font-size:clamp(130px,24vw,330px)}
@media(max-width:700px){.story-page .story-text{font-size:15vw}.story-page .story-scene:first-child .story-text{font-size:30vw}.story-page .story-scene{padding:14svh 20px;min-height:90svh}}

.project-palette{--bg:#FF87C3;--fg:#3e168b}
@media(prefers-reduced-motion:reduce){.type-cylinder span:nth-child(n+4){display:block}.type-cylinder span.is-repeat{display:none}}

/* Integrated homepage: isolated palette, original logo mask and navigation. */
#personal-story{position:relative;background:#191919;color:#FF87C3;margin:0;isolation:isolate}
#personal-story .story-scene{min-height:95svh}
#personal-story .story-scene:first-child .story-text{font-size:clamp(70px,13vw,190px)}
nav.on-story .n-logo{background-color:#FF87C3}
nav.on-story .n-links a{color:#FF87C3}
nav.on-story .n-dot{color:#FF87C3}
@media(max-width:700px){#personal-story .story-scene:first-child .story-text{font-size:15vw}#personal-story .story-scene{min-height:85svh}}

/* Shared page surface fades through the story, without a hard section edge. */
#personal-story{background:transparent;padding-block:25svh}
@media(max-width:700px){#personal-story{padding-block:18svh}}

/* Paint the story itself: homepage pin wrappers have their own purple surface. */
#personal-story{background:var(--story-surface,#191919);color:#FF87C3;padding-block:50svh}
#personal-story .story-text,#personal-story .story-note{color:#FF87C3}
@media(max-width:700px){#personal-story{padding-block:40svh}}

/* About and story now share the actual opaque main surface. */
#personal-story{background:transparent;padding-block:20svh}
@media(max-width:700px){#personal-story{padding-block:20svh}}

/* Card di Work senza cover: resta il colore della card, niente foto presa
   da un servizio esterno. Il nome non serve ripeterlo qui — sta gia'
   gigante dietro (.orbit-backword) e torna al passaggio del mouse
   (.orbit-label) — quindi la tessera e' solo un blocco di colore. */
.orbit-card.senza-cover{background:var(--card-color)}
.orbit-card.senza-cover .work-card-img{background:none}
.orbit-card.senza-cover:hover .work-card-img{filter:none;scale:1}