/* Manuel Nappa: a quiet identity, with the work doing the talking. */
:root { --paper: #F4F3EB; --ink: #171914; --orange: #F05A28; }
.signature-edition .header { background: var(--paper); }
.reading-progress { position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--orange); transform: scaleX(0); transform-origin: 0 50%; pointer-events: none; }
.hero { padding-top: 28px; }
.hero-top { align-items: center; }
.hero-top > p { color: var(--muted); font-size: .6875rem; letter-spacing: .10em; }
.hero-tools > span { display: none; }
.hero-composition { grid-template-columns: minmax(0, 1.32fr) minmax(0, 1fr); align-items: center; gap: 4%; padding: 24px 0 40px; }
.hero h1 { font-size: clamp(5rem, 10.5vw, 10.1rem); line-height: .91; letter-spacing: -.072em; }
.title-line { animation: signature-title .85s cubic-bezier(.16,1,.3,1) both; }
.title-line + .title-line { margin-top: 5px; animation-delay: .12s; }
.name-trigger { cursor: default; }
.signature-edition .name-letter { animation: none; transform: none; }

.ambient-motion .signature-edition .name-trigger.is-in-view.is-replaying .name-letter { animation: signature-ink 1s ease both; animation-delay: calc(var(--letter-index) * .042s); }
.hero-intro { gap: 0; margin-top: 32px; }
.intro-line { display: none; }
.hero-intro p { max-width: 450px; font-size: 1rem; line-height: 1.65; }
.hero-intro .primary-link { display: inline-flex; align-items: center; justify-content: space-between; gap: 44px; min-height: 57px; background: var(--orange); color: var(--ink); padding: 16px 22px; margin-top: 25px; border: 1px solid var(--orange); transition: background .22s,color .22s; }
.hero-intro .primary-link:hover { background: var(--ink); border-color: var(--ink); color: var(--paper); }
.hero-intro .hero-reassurance { font-size: .75rem; margin-top: 13px; color: var(--muted); }
.hero-signature { width: 100%; max-width: 500px; margin: 0 0 0 auto; align-self: end; }
.signature-scene { display: block; position: relative; perspective: 1000px; isolation: isolate; outline-offset: 2px; }
.signature-art { position: relative; transform-origin: 50% 85%; transform: translate3d(0,var(--signature-y,0px),0) rotateX(var(--signature-rx,0deg)) rotateY(var(--signature-ry,0deg)); transition: transform .75s cubic-bezier(.18,.7,.2,1); }
.signature-art img { width: 100%; height: auto; object-fit: contain; filter: drop-shadow(0 14px 12px #282a2509); }
.hero-signature figcaption { display: flex; align-items: center; justify-content: space-between; gap: 20px; border-top: 1px solid var(--line); padding: 15px 0 0; margin: 4px 10% 0; font-size: .75rem; }
.hero-signature figcaption > span { color: var(--muted); }
.hero-signature figcaption a { display: inline-flex; align-items: center; gap: 18px; padding: 5px 0; }
.hero-signature figcaption a:hover { color: #ad3715; }
.hero-signature.is-entered .signature-scene { animation: signature-arrival 1s cubic-bezier(.16,1,.3,1) both; }
.hero-bottom { font-size: .8125rem; padding: 21px 0 25px; }
.hero-bottom > span { font-size: .6875rem; letter-spacing: .06em; }
.work-section { padding-top: 80px; }
.work-section .section-heading { margin-bottom: 47px; }
.project-image { border-radius: 0; }
.project-image img { transition: transform .8s cubic-bezier(.2,.65,.2,1); }
.project-image:hover img { transform: scale(1.022); }
.image-link { background: none; } /* solo scritta sottolineata sulla foto (vedi styles.css) */
.image-link > span, .underlined-link > span { transition: transform .25s; }
.project-word { display: none; }
.project-split .split-copy h3 > span { color: inherit; }
.project-split .underlined-link { border-color: #6b6e61; }
.project-split .underlined-link:hover { border-color: var(--orange); }
.industrial-project { background: transparent; }
.industrial-project:before { display: none; }
.about-section { background: #e9e8df; padding: 85px 0; }
.signature-edition .about-inner { grid-template-columns: minmax(0,1fr) minmax(0,2.1fr); gap: 50px; align-items: start; }
.about-person { display: flex; flex-direction: column; align-items: flex-start; }
.personal-mark { display: flex; align-items: baseline; margin-top: 65px; font-family: var(--display); font-size: clamp(4rem,8.4vw,8rem); font-weight: 700; line-height: 1; letter-spacing: -.12em; }
.personal-mark > span { font-family: var(--body); font-weight: 400; color: var(--orange); margin-left: .08em; }
.personal-role { margin-top: 22px; font-size: .75rem; line-height: 1.65; color: #5c5c54; }
.about-copy h2 { font-size: clamp(2.5rem,4.1vw,4rem); }
.about-copy h2 > span { color: #797b70; }
.about-copy .about-bottom { gap: 36px; margin-top: 35px; }
.contact h2 { font-size: clamp(3rem,7.7vw,7.4rem); }
.contact h2 > span { color: var(--ink); }
.contact-arrow { border-radius: 0; width: clamp(82px,10vw,140px); }
.contact-arrow:hover { transform: none; }
.motion-ready .reveal { transition-duration: .65s,.85s; }
.motion-ready .reveal:not(.is-visible) { transform: translateY(22px); }
@keyframes signature-title { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
@keyframes signature-arrival { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: none; } }
@keyframes signature-ink { 0%,100% { color: var(--letter-color); } 38% { color: var(--orange); } }
@media (min-width:1600px) { .hero h1 { font-size: 10.8rem; } .hero-composition { padding-top: 37px; padding-bottom: 53px; } }
@media (max-width:1100px) {
  .hero-composition { grid-template-columns: minmax(0,1.3fr) minmax(0,1fr); gap: 2%; padding-top: 26px; }
  .hero h1 { font-size: 10.9vw; }
  .hero-intro .primary-link { gap: 25px; }
  .hero-signature figcaption { margin-inline: 4%; gap: 10px; }
  .hero-signature figcaption > span { font-size: .6875rem; }
  .signature-edition .about-inner { gap: 35px; }
}
@media (max-width:760px) {
  .hero { padding-top: 16px; }
  .hero-top > p { font-size: .625rem; letter-spacing: .065em; }
  .hero-composition { grid-template-columns: 1fr; gap: 0; padding-top: 20px; padding-bottom: 18px; }
  .hero h1 { font-size: clamp(3.5rem,17.8vw,7.5rem); line-height: .94; }
  .title-line + .title-line { margin-top: 1px; }
  .hero-intro { margin-top: 25px; }
  .hero-intro p { font-size: .9375rem; line-height: 1.65; }
  .hero-intro .primary-link { min-height: 54px; margin-top: 22px; padding: 14px 18px; font-size: .875rem; gap: 32px; }
  .hero-intro .hero-reassurance { font-size: .6875rem; margin-top: 11px; }
  .hero-signature { width: 100%; max-width: 370px; margin: 20px auto 0; }
  .signature-scene { width: 280px; max-width: 83%; margin: 0 auto; }
  .hero-signature figcaption { margin: 0 4%; padding-top: 10px; font-size: .75rem; }
  .hero-bottom { margin-top: 0; padding: 17px 0 20px; font-size: .75rem; }
  .hero-bottom > span { display: none; }
  .work-section { padding-top: 52px; }
  .work-section .section-heading { margin-bottom: 32px; }
  .signature-edition .about-inner { grid-template-columns: 1fr; gap: 29px; }
  .about-section { padding: 50px 0; }
  .about-person { flex-direction: row; justify-content: space-between; align-items: center; }
  .personal-mark { margin: 0; font-size: 3.8rem; }
  .personal-role { display: none; }
  .about-copy h2 { font-size: clamp(2.1rem,7.8vw,3.2rem); }
  .about-copy .about-bottom { gap: 18px; margin-top: 24px; }
  .contact h2 { font-size: clamp(2.5rem,10vw,4.4rem); }
  .contact-arrow { width: 62px; }
  .signature-edition .hero-tools { gap: 0; }
}
@media(max-width:380px) {
  .hero h1 { font-size: 17.5vw; }
  .hero-top > p { font-size: .5625rem; }
  .hero-intro .primary-link { gap: 24px; }
  .hero-signature { margin-top: 17px; }
  .signature-scene { width: 244px; }
  .contact-title-row { flex-wrap: nowrap; }
  .contact h2 { font-size: 9.5vw; }
  .contact-arrow { width: 53px; }
}
html:not(.ambient-motion) .signature-art { transform: none!important; transition: none; }
html:not(.ambient-motion) .signature-edition .reveal { opacity: 1; transform: none; transition: none; }
html:not(.ambient-motion) .signature-edition .title-line,
html:not(.ambient-motion) .signature-edition .signature-scene { animation: none; }
@media(prefers-reduced-motion:reduce) {
  .signature-art,.title-line,.signature-scene { transform: none!important; animation: none!important; transition: none!important; }
  .reading-progress { display: none; }
}
@media print { .reading-progress { display: none; } .signature-art { transform: none!important; } }

