
:root { color-scheme: light; --paper:#f2f3f5; --ink:#232523; --muted:#6a6d69; --line:#d7d9d8; --edge:clamp(24px,4.4vw,72px); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Arial,Helvetica,sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
a:focus-visible, button:focus-visible { outline:2px solid #9b7c35; outline-offset:7px; }
.hero-runway { height:135vh; height:135svh; }
.hero { height:100vh; height:100svh; min-height:560px; position:sticky; top:0; overflow:hidden; isolation:isolate; }
.masthead { position:absolute; top:34px; left:var(--edge); right:var(--edge); display:flex; align-items:baseline; justify-content:space-between; z-index:3; }
.identity { display:flex; flex-direction:column; align-items:flex-start; gap:5px; }
.wordmark { font-size:24px; font-weight:700; letter-spacing:-.9px; line-height:1.15; }
.descriptor { font-size:12px; letter-spacing:.015em; color:var(--muted); }
.hero-copy { position:absolute; top:17.5%; left:var(--edge); right:var(--edge); text-align:center; z-index:1; pointer-events:none; }
h1 { margin:0; font-size:clamp(40px,5.5vw,88px); font-weight:500; line-height:1.08; letter-spacing:-.055em; }

h1 span { display:block; }
#stage { position:absolute; inset:0; z-index:2; pointer-events:none; }
#stage canvas { position:absolute; inset:0; width:100%; height:100%; display:block; }
#hit { position:absolute; display:none; border:0; padding:0; background:transparent; cursor:pointer; pointer-events:auto; border-radius:45%; -webkit-tap-highlight-color:transparent; }
.hero-foot { position:absolute; bottom:33px; left:var(--edge); right:var(--edge); display:flex; justify-content:flex-end; align-items:end; z-index:3; font-size:13px; line-height:1.5; }
.hero-foot p { margin:0; color:var(--muted); }
.scroll-link { display:flex; gap:30px; align-items:center; padding:10px 0; border-bottom:1px solid var(--ink); }
.scroll-link .arrow { font-size:20px; line-height:1; transition:transform .2s; }
.scroll-link:hover .arrow { transform:translateY(4px); }
.next { min-height:65vh; min-height:65svh; padding:31px var(--edge) 80px; border-top:1px solid var(--line); background:#e9ebe8; position:relative; }
.section-label { margin:0; color:var(--muted); font-size:11px; letter-spacing:.08em; text-transform:uppercase; }
h2 { font-size:clamp(36px,4.6vw,70px); font-weight:400; line-height:1.05; letter-spacing:-.055em; margin:70px 0 0; }
.about-role { margin:14px 0 0; font-size:clamp(19px,2.4vw,34px); line-height:1.2; letter-spacing:-.025em; }
.about-copy { max-width:660px; margin-top:32px; color:var(--muted); font-size:clamp(16px,1.3vw,19px); line-height:1.65; }
.about-copy p { margin:0 0 16px; }
::selection { background:#dfd4ac; }
@media(min-width:1600px) { .hero-copy { top:16%; } }
@media(max-width:700px) {
 .masthead { top:24px; } .wordmark { font-size:24px; } .descriptor { font-size:11px; }
 .hero-copy { top:18%; } h1 { font-size:clamp(26px,7.4vw,46px); line-height:1.08; letter-spacing:-.05em; } 
 .hero-foot { bottom:24px; font-size:11px; } .scroll-link { gap:14px; }
 h2 { margin-top:55px; } .next { min-height:55svh; }
}
@media(max-height:650px) and (min-width:701px) { .hero-copy { top:17%; } h1 { font-size:min(4.8vw,54px); }  .hero { min-height:460px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } * { transition:none !important; } }

/* Introduction: text and scroll-revealed portrait. */
.next { overflow:hidden; padding-bottom:0; }
.about-layout { display:grid; grid-template-columns:minmax(0,1.12fr) minmax(0,1fr); align-items:center; gap:clamp(24px,4vw,72px); max-width:1500px; margin:0 auto; }
.about-text { padding:60px 0 80px; position:relative; z-index:1; }
.about-text h2 { margin:0; font-size:clamp(36px,4.1vw,65px); }
.about-role { font-size:clamp(19px,2vw,29px); }
.portrait { margin:40px calc(-1 * var(--edge)) 0 0; align-self:end; }
.portrait img { display:block; width:100%; max-height:750px; height:auto; object-fit:contain; object-position:center bottom; }
.portrait.reveal-ready { transform:translateX(110%) rotate(5deg); opacity:0; transition:transform 950ms cubic-bezier(.22,1,.36,1),opacity 450ms ease; }
.portrait.reveal-ready.is-visible { transform:translateX(0) rotate(0); opacity:1; }
@media(max-width:700px) {
 .about-layout { grid-template-columns:1fr; gap:0; }
 .about-text { padding:45px 0 12px; }
 .about-text h2 { font-size:clamp(34px,8vw,48px); }
 .portrait { width:min(95%,420px); margin:12px calc(-1 * var(--edge)) 0 auto; }
 .portrait img { max-height:520px; }
}
@media(prefers-reduced-motion:reduce) { .portrait.reveal-ready { transform:none; opacity:1; transition:none; } }

/* Imported isolated animation from Claude Design. */
.lo-scene {
  position: relative;
  width: min(100%, 720px);
  margin: 0 auto;
  aspect-ratio: 600 / 975;
  overflow: hidden;
  background: transparent;
  -webkit-user-select: none; user-select: none;
}
.lo-world {
  position: absolute; left: 0; top: 0;
  width: 1000px; height: 1040px;
  transform-origin: 0 0;
  transform: scale(var(--lo-k, 0.72)) translate(-160px, -65px);
}
.lo-world img { position: absolute; display: block; max-width: none; pointer-events: none; }

/* Ritratto: 1086×1448 → 570×760 nel mondo */
.lo-portrait {
  position: absolute; left: 175px; top: 280px;
  width: 570px; height: 760px;
  opacity: 0; will-change: transform, opacity;
}
.lo-luca { left: 0; top: 0; width: 100%; height: 100%; }
/* Patch sguardo: ritaglio (380,215)-(640,475) del ritratto */
.lo-gaze img {
  left: calc(380 / 1086 * 100%); top: calc(215 / 1448 * 100%);
  width: calc(260 / 1086 * 100%); height: calc(260 / 1448 * 100%);
  visibility: hidden;
}
.lo-gaze img.is-on { visibility: visible; }

/* Oca: contenitore a dimensione zero, origine = punto a terra; unità interne = pixel degli asset */
.lo-goose, .lo-rig, .lo-leg, .lo-upper { position: absolute; left: 0; top: 0; width: 0; height: 0; }
.lo-goose { transform-origin: 0 0; opacity: 0; will-change: transform; }
.lo-leg-back  { left: -60px; top: -57px; transform-origin: -72px -108px; }
.lo-leg-front { left: 10px;  top: -57px; transform-origin: -72px -108px; }
.lo-shank { left: -37px; top: -220px; transform-origin: 37px 220px; transform: rotate(-33.42deg); }
.lo-foot  { left: -68px; top: -16px; }
.lo-body  { left: -357px; top: -575px; }
.lo-head  { left: 40px; top: -798px; transform-origin: 95px 283px; }
.lo-sit   { left: -356px; top: -636px; opacity: 0; }

.lo-shadow {
  position: absolute; left: 0; top: 0; width: 150px; height: 22px;
  margin: -11px 0 0 -75px;
  border-radius: 50%;
  background: radial-gradient(closest-side, rgba(40, 32, 24, .22), rgba(40, 32, 24, 0));
  opacity: 0; will-change: transform, opacity;
}


.about-layout .lo-scene { width:calc(100% + var(--edge)); align-self:end; margin:0 calc(-1 * var(--edge)) 0 0; }

@media (max-width:700px) { .about-layout .lo-scene { width:100%; max-width:560px; margin:0 auto; } }

/* The departing goose leaves the clipped portrait scene. */
.lo-flight { position:fixed; left:0; top:0; width:0; height:0; z-index:30; pointer-events:none; transform-origin:0 0; }
.lo-flight img { position:absolute; display:block; max-width:none; pointer-events:none; }
.lo-flight-wing { width:620px; height:auto; left:-465px; top:-730px; transform-origin:87% 86%; }
.lo-flight-wing.far { filter:brightness(.88); }

/* What I do: editorial list and a quiet, persistent doorway scene. */
.services { background:var(--paper); padding:36px var(--edge) 100px; border-top:1px solid var(--line); }
.services-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.12fr); gap:clamp(40px,7vw,110px); margin-top:66px; align-items:start; }
.services-aside { position:sticky; top:60px; }
.services-aside h2 { margin:0; font-size:clamp(44px,5.4vw,80px); }
.services-lead { margin:20px 0 0; font-size:16px; color:var(--muted); line-height:1.5; }
.services-list { list-style:none; padding:0; margin:0; }
.services-list li { display:grid; grid-template-columns:28px 1fr; gap:15px; padding:27px 0 29px; border-top:1px solid var(--line); }
.service-number { font-size:11px; color:var(--muted); padding-top:7px; }
.services-list h3 { margin:0 0 10px; font-size:clamp(22px,2.1vw,31px); font-weight:400; letter-spacing:-.035em; }
.services-list p { margin:0; max-width:530px; color:var(--muted); font-size:16px; line-height:1.6; }
.door-scene { position:relative; height:280px; margin-top:24px; overflow:hidden; }
.door-floor { position:absolute; bottom:26px; left:0; right:0; height:1px; background:var(--line); }
.little-door { position:absolute; width:112px; height:174px; right:28px; bottom:27px; background:#171916; border:7px solid #b7b8b0; border-bottom:0; border-radius:58px 58px 0 0; box-shadow:inset 7px 0 10px #080908, 2px 0 0 #d7d8d0; }
.door-eyes { position:absolute; top:57px; left:22px; display:flex; gap:9px; opacity:0; transition:opacity .3s; transform:translate(var(--gaze-x,0px),var(--gaze-y,0px)); }
.door-eye { display:block; width:19px; height:24px; border-radius:50%; background:#f5f1db; transform:scaleY(var(--blink,1)); }
.door-eye i { position:absolute; width:8px; height:10px; top:8px; margin-left:7px; border-radius:50%; background:#171916; transform:translate(var(--pupil-x,0px),var(--pupil-y,0px)); }
.door-scene.is-inside .door-eyes { opacity:1; }
.door-walk-clip { position:absolute; inset:0 47px 0 0; overflow:hidden; pointer-events:none; }
.door-goose { position:absolute; left:0; bottom:28px; width:0; height:0; transform-origin:0 0; opacity:0; }
.door-goose img { position:absolute; max-width:none; display:block; }
.dg-body { left:-357px; top:-575px; width:573px; height:470px; }
.dg-head { left:40px; top:-798px; width:317px; height:261px; }
.dg-foot { left:-68px; top:-61px; width:174px; height:77px; transform-origin:68px 10px; }
.dg-foot.back { filter:brightness(.8); }
@media(max-width:700px) {
 .services { padding-bottom:60px; }
 .services-layout { grid-template-columns:1fr; gap:25px; margin-top:40px; }
 .services-aside { display:contents; }
 .services-aside h2 br { display:none; }
 .services-aside h2 { font-size:42px; }
 .services-lead { margin:0; }
 .door-scene { position:sticky; top:0; height:195px; margin:0; z-index:5; background:var(--paper); }
 .little-door { height:145px; width:100px; }
 .door-eyes { left:17px; top:48px; }
 .services-list li { padding:23px 0; }
}
@media(prefers-reduced-motion:reduce) { .door-eyes { transition:none; } }

.door-eye i { transition:transform .22s ease; }
@media(prefers-reduced-motion:reduce) { .door-eye i { transition:none; } }

.little-door { border:0; border-radius:0; background:none; box-shadow:none; width:122px; height:195px; }
.door-art { position:absolute; width:100%; height:134%; left:0; top:-21%; }
.door-eyes { left:34px; top:74px; }
.contact-intro { min-height:85svh; padding:38px var(--edge) 100px; border-top:1px solid var(--line); background:#e9ebe8; }
.contact-intro h2 { max-width:1000px; }
.contact-intro > p:last-child { font-size:20px; color:var(--muted); margin-top:28px; }
.door-runner { position:fixed; left:0; top:0; width:0; height:0; transform-origin:0 0; z-index:40; pointer-events:none; }
.door-runner img { position:absolute; max-width:none; }
.door-runner .run-wing { width:620px; height:auto; left:-465px; top:-730px; transform-origin:87% 86%; }
.door-runner .run-wing.far { filter:brightness(.85); }
.run-quack { position:fixed; z-index:41; pointer-events:none; font-size:19px; font-style:italic; color:var(--ink); }
@media(max-width:700px) { .little-door { width:100px; height:160px; } .door-eyes { left:24px; top:58px; } .contact-intro h2 { font-size:42px; } }

/* Paint the near jamb above the walking sprite; clip at its inner edge. */
.door-walk-clip { z-index:2; }
.door-frame-front { clip-path:inset(0 0 0 76%); z-index:3; pointer-events:none; }
.door-eyes { z-index:4; }

/* Complete legs, with feet and shanks moving as one articulated unit. */
.dg-leg { position:absolute; left:0; top:0; width:0; height:0; }
.dg-leg.back { filter:brightness(.82); }
.dg-shank { left:-37px; top:-277px; width:67px; height:249px; }
.dg-leg .dg-foot { left:-68px; top:-73px; width:174px; height:77px; }

.story-section { padding:38px var(--edge) 100px; border-top:1px solid var(--line); min-height:85svh; }
.meta-help { background:#e9ebe8; }
.work-method { background:var(--paper); }
.story-layout { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(0,1fr); gap:clamp(35px,5vw,90px); align-items:center; margin-top:65px; }
.story-copy h2 { margin:0 0 32px; font-size:clamp(36px,4.4vw,66px); line-height:1.08; }
.story-copy > p { font-size:clamp(17px,1.4vw,20px); line-height:1.65; color:var(--muted); max-width:640px; margin:0 0 22px; }
.story-copy .story-closing { color:var(--ink); margin-top:34px; }
.platform-list { list-style:none; padding:0; margin:24px 0 34px; display:flex; flex-wrap:wrap; gap:10px 0; max-width:620px; font-size:14px; line-height:1.6; }
.platform-list li:not(:last-child)::after { content:'·'; margin:0 12px; color:var(--muted); }
.motion-slot { min-width:0; width:100%; aspect-ratio:1; }
@media(max-width:700px) { .story-section { padding-bottom:65px; min-height:auto; } .story-layout { grid-template-columns:1fr; margin-top:40px; gap:0; } .story-copy h2 { font-size:clamp(32px,7.5vw,48px); } .motion-slot:empty { display:none; } .story-section .section-label { line-height:1.6; max-width:270px; } }

/* Scena "oca e cancello" — nessuno sfondo: la scena è trasparente */
.gg-scene {
  position: relative;
  width: 100%; max-width: 600px; min-width: 280px;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  -webkit-user-select: none; user-select: none;
}
.gg-world {
  position: absolute; left: 0; top: 0; width: 600px; height: 600px;
  transform-origin: 0 0; transform: scale(var(--gg-k, 1.2)) translate(0, -130px); /* inquadratura: x 0–500, y 130–630 del mondo */
}
.gg-world img { position: absolute; display: block; max-width: none; pointer-events: none; }
.gg-world div { position: absolute; }

/* Cancello: terreno a y = 540 */
.gg-gate-shadow {
  left: 0px; top: 528px; width: 270px; height: 24px; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(60, 44, 28, .22), rgba(60, 44, 28, 0));
}
.gg-posts { left: 10px; top: 248px; }
.gg-door  { left: 58px; top: 300px; width: 170px; height: 240px; transform-origin: 0 120px; }
.gg-door img { left: 0; top: 0; }
.gg-lock  { left: 189px; top: 316px; width: 70px; height: 110px; transform-origin: 35px 14px; }
.gg-lock img { left: 0; top: 0; }

/* Oca: contenitore a dimensione zero, origine = punto a terra, unità = pixel degli asset */
.gg-goose, .gg-rig, .gg-leg, .gg-upper { width: 0; height: 0; left: 0; top: 0; }
.gg-goose { transform-origin: 0 0; opacity: 0; will-change: transform, opacity; }
.gg-leg-back  { left: -60px !important; top: -57px !important; transform-origin: -72px -108px; }
.gg-leg-front { left: 10px !important;  top: -57px !important; transform-origin: -72px -108px; }
.gg-shank { left: -37px; top: -220px; transform-origin: 37px 220px; transform: rotate(-33.42deg); }
.gg-foot  { left: -68px; top: -16px; }
.gg-upper { transform-origin: -40px -150px; }
.gg-body  { left: -357px; top: -575px; }
.gg-hs    { left: 40px; top: -798px; transform-origin: 95px 283px; }
/* testa frontale (asset originale front_head) innestata sul perno della testa laterale */
.gg-hf    { left: 46px; top: -826px; transform-origin: 89px 311px; opacity: 0; }

.gg-goose-shadow {
  left: 0; top: 0; width: 150px; height: 22px; margin: -11px 0 0 -75px; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(60, 44, 28, .24), rgba(60, 44, 28, 0));
  opacity: 0; will-change: transform, opacity;
}

/* Scena "oca e ingranaggi" — nessuno sfondo: la scena è trasparente */
.gm-scene {
  position: relative;
  width: 100%; max-width: 600px; min-width: 280px;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  -webkit-user-select: none; user-select: none;
}
.gm-world {
  position: absolute; left: 0; top: 0; width: 600px; height: 600px;
  transform-origin: 0 0; transform: scale(var(--gm-k, 1)) translate(0, 20px); /* terreno a y = 540 nella cornice */
}
.gm-world img { position: absolute; display: block; max-width: none; pointer-events: none; }
.gm-world div { position: absolute; }

/* Meccanismo (disegnato a scala 1, ingrandito ×1.35 dal gruppo): terreno a y = 520 */
.gm-mech { left: 0; top: 0; width: 600px; height: 600px; transform-origin: 20px 520px; transform: scale(1.35); }
.gm-mech-shadow {
  left: 10px; top: 508px; width: 310px; height: 24px; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(60, 44, 28, .22), rgba(60, 44, 28, 0));
}
.gm-stand { left: 20px; top: 360px; width: 290px; height: 165px; }
.gm-gear img { left: 0; top: 0; width: 100%; height: 100%; }
.gm-g1 { left: 41.10px; top: 338.00px; width: 128px; height: 128px; transform-origin: 64.0px 64.0px; }
.gm-g2 { left: 145.00px; top: 336.00px; width: 80px; height: 80px; transform-origin: 40.0px 40.0px; }
.gm-g3 { left: 188.20px; top: 374.00px; width: 92px; height: 92px; transform-origin: 46.0px 46.0px; }

/* Oca: contenitore a dimensione zero, origine = punto a terra, unità = pixel degli asset */
.gm-goose, .gm-rig, .gm-leg, .gm-upper { width: 0; height: 0; left: 0; top: 0; }
.gm-goose { transform-origin: 0 0; opacity: 0; will-change: transform, opacity; }
.gm-leg-back  { left: -60px !important; top: -57px !important; transform-origin: -72px -108px; }
.gm-leg-front { left: 10px !important;  top: -57px !important; transform-origin: -72px -108px; }
.gm-shank { left: -37px; top: -220px; transform-origin: 37px 220px; transform: rotate(-33.42deg); }
.gm-foot  { left: -68px; top: -16px; }
.gm-upper { transform-origin: -40px -150px; }
.gm-body  { left: -357px; top: -575px; }
.gm-hs    { left: 40px; top: -798px; transform-origin: 95px 283px; }

.gm-goose-shadow {
  left: 0; top: 0; width: 150px; height: 22px; margin: -11px 0 0 -75px; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(60, 44, 28, .24), rgba(60, 44, 28, 0));
  opacity: 0; will-change: transform, opacity;
}

/* Imported story animations remain confined to their own layout slots. */
.motion-slot .gg-scene, .motion-slot .gm-scene { min-width:0; max-width:none; }
.motion-slot { align-self:center; }

@media(max-width:700px) { .story-layout { gap:25px; } .motion-slot { max-width:460px; margin:0 auto; } }

.portfolio { background:#e9ebe8; padding:38px 0 65px; border-top:1px solid var(--line); overflow:hidden; }
.portfolio-heading { padding:0 var(--edge); }
.portfolio h2 { margin-top:50px; font-size:clamp(38px,4.8vw,72px); }
/* Scena 5 — oca scatenata sui loghi. Classi con prefisso gl-. Sfondo trasparente. */
.gl-scene {
  position: relative;
  width: 100%;
  height: calc(450px * var(--gl-k, 1));
  overflow: hidden;
  -webkit-user-select: none; user-select: none;
}
.gl-world {
  position: absolute; left: 0; top: 0; height: 450px;
  transform-origin: 0 0; transform: scale(var(--gl-k, 1));
}
.gl-world img { position: absolute; display: block; max-width: none; pointer-events: none; }
.gl-world div { position: absolute; }

/* Loghi: ogni .gl-logo ha la dimensione del CONTENUTO VISIBILE; il PNG quadrato sborda (trasparente) */
.gl-track { left: 0; top: 0; will-change: transform; }
.gl-logo { overflow: visible; }
.gl-list { margin: 0; padding: 0; list-style: none; }

/* Oca: contenitore a dimensione zero, origine = punto d'appoggio dei piedi, unità = pixel degli asset */
.gl-goose, .gl-pitch, .gl-leg, .gl-upper, .gl-wingwrap { width: 0; height: 0; left: 0; top: 0; }
.gl-goose { transform-origin: 0 0; will-change: transform; }
.gl-pitch { transform-origin: -40px -330px; }
.gl-leg-back  { left: -60px !important; top: -57px !important; transform-origin: -72px -108px; }
.gl-leg-front { left: 10px !important;  top: -57px !important; transform-origin: -72px -108px; }
.gl-shank { left: -37px; top: -220px; transform-origin: 37px 220px; transform: rotate(-33.42deg); }
.gl-foot  { left: -68px; top: -16px; }
.gl-body, .gl-body-fold { left: -357px; top: -575px; }
.gl-head  { left: 40px; top: -798px; transform-origin: 95px 283px; }
/* Ala unica (wing.png 1330×1182, scala 0.45): cerniera alla spalla (60,-450) = punto (1230,960) dell'immagine */
.gl-wing  { left: -493.5px; top: -882px; width: 598.5px; height: 531.9px; transform-origin: 553.5px 432px; }

/* Controllo discreto Pausa/Riprendi */
.gl-toggle {
  position: absolute; right: 10px; top: 10px; z-index: 2;
  width: 44px; height: 44px; border-radius: 22px;
  display: grid; place-items: center;
  border: 1px solid rgba(20, 20, 19, .14);
  background: rgba(255, 255, 255, .7); color: #3a3a38; cursor: pointer;
}
.gl-toggle:hover { background: rgba(255, 255, 255, .95); }
.gl-toggle:focus-visible { outline: 2px solid #3a6ea5; outline-offset: 2px; }
.gl-toggle svg { width: 18px; height: 18px; fill: currentColor; }
.gl-toggle .gl-i-play { display: none; }
.gl-toggle[aria-pressed="true"] .gl-i-play { display: block; }
.gl-toggle[aria-pressed="true"] .gl-i-pause { display: none; }

/* Reduced motion: loghi statici leggibili, niente oca né scorrimento */
.gl-static { display: none; }
.gl-scene.is-static { height: auto; overflow: visible; }
.gl-scene.is-static .gl-world, .gl-scene.is-static .gl-toggle { display: none; }
.gl-scene.is-static .gl-static {
  display: flex; flex-wrap: wrap; justify-content: center; align-items: center;
  gap: 24px 40px; margin: 0; padding: 16px; list-style: none;
}
.gl-static li { position: relative; overflow: hidden; }
.gl-static img { position: absolute; max-width: none; }

.gl-goose { visibility:hidden; }
.gl-scene { margin-top:15px; }
.gl-exit { position:fixed; inset:0; z-index:40; pointer-events:none; overflow:visible; }
.gl-exit .gl-goose { visibility:visible; }
.limone-section { background:var(--bg,#f2f3f5); min-height:85svh; }
.limone-section .story-layout { grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); }
@media(max-width:700px) { .limone-section .story-layout { grid-template-columns:1fr; } }

/* Scena 6 — l'oca trascina e becca il logo Limone Blu. Classi con prefisso gb-. Scena trasparente. */
.gb-scene {
  position: relative;
  width: 100%; max-width: 800px; min-width: 320px;
  margin: 0 auto;
  aspect-ratio: 800 / 550;
  overflow: hidden;
  -webkit-user-select: none; user-select: none;
}
.gb-world {
  position: absolute; left: 0; top: 0; width: 800px; height: 550px;
  transform-origin: 0 0; transform: scale(var(--gb-k, 1));
}
.gb-world img, .gb-world canvas { position: absolute; display: block; max-width: none; pointer-events: none; }
.gb-world div { position: absolute; }

/* Logo: canvas alla risoluzione di lavoro (608×505 px), portato nel mondo con una matrice */
.gb-logo { left: 0; top: 0; transform-origin: 0 0; will-change: transform; }
.gb-logo-shadow, .gb-goose-shadow {
  left: 0; top: 0; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(60, 50, 30, .20), rgba(60, 50, 30, 0));
  will-change: transform;
}
.gb-logo-shadow { width: 320px; height: 22px; margin: -11px 0 0 -160px; }
.gb-goose-shadow { width: 170px; height: 22px; margin: -11px 0 0 -85px; }

/* Frammenti (pool fisso) */
.gb-frag { left: 0; top: 0; width: 6px; height: 5px; opacity: 0;
  clip-path: polygon(0 20%, 60% 0, 100% 45%, 70% 100%, 10% 85%); will-change: transform, opacity; }

/* Oca: contenitore a dimensione zero, origine = punto a terra, unità = pixel degli asset */
.gb-goose, .gb-leg, .gb-upper { width: 0; height: 0; left: 0; top: 0; }
.gb-goose { transform-origin: 0 0; will-change: transform; }
.gb-leg-back  { left: -60px !important; top: -57px !important; transform-origin: -72px -108px; }
.gb-leg-front { left: 10px !important;  top: -57px !important; transform-origin: -72px -108px; }
.gb-shank { left: -37px; top: -220px; transform-origin: 37px 220px; transform: rotate(-33.42deg); }
.gb-foot  { left: -68px; top: -16px; }
.gb-upper { transform-origin: -40px -150px; }
.gb-body  { left: -357px; top: -575px; }
.gb-head  { left: 40px; top: -798px; transform-origin: 95px 283px; }

#limone-animation { width:100%; }
#limone-animation .gb-scene { min-width:0; max-width:none; }
.limone-section .story-layout { grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); }
@media(max-width:700px) { .limone-section .story-layout { grid-template-columns:1fr; } }

/* Temporarily hidden; markup and scene retained for restoration. */
#come-lavoro[hidden] { display:none!important; }
.limone-section .story-layout { grid-template-columns:minmax(0,.85fr) minmax(0,1.5fr); gap:clamp(20px,3vw,48px); }
#limone-animation { max-width:none; }
.contacts-section { padding:38px var(--edge) 26px; border-top:1px solid var(--line); min-height:85svh; display:flex; flex-direction:column; position:relative; overflow:hidden; }
.contacts-layout { display:grid; grid-template-columns:1.2fr 1fr; align-items:center; flex:1; min-height:490px; gap:32px; }
.contacts-copy { position:relative; z-index:2; padding:50px 0; }
.contacts-copy h2 { margin:0 0 28px; font-size:clamp(44px,5.7vw,86px); }
.contacts-copy p { font-size:clamp(17px,1.4vw,21px); line-height:1.65; color:var(--muted); }
.contact-links:empty { display:none; }
.contact-links { margin-top:35px; }
.contact-links a { display:inline-block; padding:12px 0; border-bottom:1px solid currentColor; font-size:clamp(19px,2vw,28px); }
.contacts-footer { display:flex; justify-content:space-between; gap:24px; padding-top:24px; color:var(--muted); font-size:13px; }
@media(max-width:700px) {
 .limone-section .story-layout { grid-template-columns:1fr; }
 #limone-animation { width:calc(100% + 2 * var(--edge)); margin-left:calc(-1 * var(--edge)); }
 .contacts-layout { grid-template-columns:1fr; min-height:420px; gap:0; }
 .contacts-section { min-height:75svh; }
 .contacts-copy h2 { font-size:clamp(42px,10vw,65px); }
}

/* Alternating visible sections, including the temporarily removed method section. */
.hero,.services,.portfolio,.contacts-section { background:var(--paper); }
.next,.meta-help,.limone-section { background:#e9ebe8; }
.services-list li { grid-template-columns:52px minmax(0,1fr); gap:18px; }
.service-egg { display:block; width:52px; height:84px; position:relative; overflow:hidden; }
.service-egg img { position:absolute; width:700%; max-width:none; height:auto; top:50%; transform:translateY(-50%); }
@media(max-width:700px) { .services-list li { grid-template-columns:42px minmax(0,1fr); gap:14px; } .service-egg { width:42px; height:70px; } }

/* Goose starts inside the enlarged, centered coop. */
.door-scene { height:365px; margin-top:30px; }
.door-scene .little-door { width:122px; height:195px; left:50%; right:auto; margin-left:-61px; bottom:28px; transform:scale(1.6); transform-origin:50% 100%; }
.door-scene .door-eyes { left:34px; top:74px; }
@media(max-width:700px) {
 .door-scene { height:280px; margin-top:20px; }
 .door-scene .little-door { transform:scale(1.25); }
}

.goose-easter-egg { margin:48px auto 0; max-width:570px; text-align:center; font-size:12px; line-height:1.7; color:var(--muted); font-weight:400; }

/* Scena finale Contatti — oca in primissimo piano. Classi con prefisso gq-.
   Il componente si sovrappone alla sezione ospite (che deve avere position: relative),
   è trasparente e non intercetta clic: solo il pulsante sulla testa è cliccabile. */
.gq-scene {
  position: absolute; inset: 0;
  overflow: hidden;
  pointer-events: none;
  contain: layout paint;
}
.gq-scene * { box-sizing: border-box; }
.gq-rig { position: absolute; left: 0; top: 0; width: 0; height: 0; visibility: hidden; --u: calc(1px * var(--gq-s, 1)); }
/* niente scale() sul gruppo: le misure sono moltiplicate per --gq-s, così il browser disegna le immagini
   ad alta risoluzione alla dimensione finale invece di ingrandire un livello già rasterizzato */
.gq-scene.is-ready .gq-rig { visibility: visible; }
.gq-sway, .gq-head { position: absolute; left: 0; top: 0; width: 0; height: 0; }
.gq-sway { transform-origin: calc(900 * var(--u)) calc(470 * var(--u)); }
.gq-head { transform-origin: calc(129 * var(--u)) calc(235 * var(--u)); }
.gq-rig img { position: absolute; left: 0; top: 0; display: block; max-width: none; pointer-events: none; -webkit-user-drag: none; user-select: none; }
.gq-neck { width: calc(960 * var(--u)); height: calc(560 * var(--u)); }
.gq-face { width: calc(266 * var(--u)); height: calc(330 * var(--u)); visibility: hidden; }
.gq-face.is-on { visibility: visible; }

/* Palpebre: cerchi ritagliati sui bulbi oculari, dentro le lenti */
.gq-lid { position: absolute; width: calc(53 * var(--u)); height: calc(53 * var(--u)); border-radius: 50%; overflow: hidden; }
.gq-lid-l { left: calc(58.5 * var(--u)); top: calc(62 * var(--u)); }
.gq-lid-r { left: calc(159.5 * var(--u)); top: calc(56.8 * var(--u)); }
.gq-lid img { width: 100%; height: 100%; transform: translateY(-101%); }
.gq-rig img { image-rendering: auto; }

/* Pulsante trasparente sulla testa (clic, tap, tastiera) */
.gq-hit {
  position: absolute; left: calc(40 * var(--u)); top: calc(18 * var(--u)); width: calc(190 * var(--u)); height: calc(225 * var(--u));
  border: 0; padding: 0; margin: 0; background: transparent; border-radius: 45% 45% 40% 40%;
  cursor: pointer; pointer-events: auto; -webkit-tap-highlight-color: transparent;
}
.gq-hit:focus { outline: none; }
.gq-hit:focus-visible { outline: 4px solid #2f6fb0; outline-offset: 4px; }

/* «quaaaaaa» */
.gq-say {
  position: absolute; left: 0; top: 0; white-space: nowrap;
  font: 800 1em/1 "Baloo 2", "Arial Rounded MT Bold", "Trebuchet MS", system-ui, sans-serif;
  letter-spacing: .01em; color: #e87422;
  text-shadow: 0 2px 0 #fff6e8, 0 -2px 0 #fff6e8, 2px 0 0 #fff6e8, -2px 0 0 #fff6e8, 0 4px 10px rgba(80, 40, 10, .18);
  transform-origin: 100% 60%; opacity: 0; pointer-events: none; will-change: transform, opacity;
}
.gq-say span { display: inline-block; will-change: transform; }

/* Confine the final goose to the contact composition, above the footer. */
.contacts-layout { position:relative; display:block; min-height:540px; margin-right:calc(-1 * var(--edge)); }
.contacts-copy { width:49%; padding:70px 0; }
.contacts-copy h2 { font-size:clamp(40px,4.7vw,72px); }
@media(max-width:699px) {
 .contacts-layout { min-height:700px; padding-bottom:330px; }
 .contacts-copy { width:100%; padding:40px var(--edge) 20px 0; }
 .contacts-copy h2 { font-size:clamp(38px,8.5vw,58px); }
 .contacts-layout .gq-scene { top:auto; height:330px; }
}

/* Anchor the frontal neck inside the shoulder, including the puzzled tilt. */
.gg-hf { left:46px; top:-806px; transform-origin:89px 249px; -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 90%,transparent 100%); mask-image:linear-gradient(to bottom,#000 0%,#000 90%,transparent 100%); }

/* A handwritten correction, timed with the goose's arrival. */
.name-correction { position:relative; display:inline-block; white-space:nowrap; }
.name-strike { position:absolute; width:110%; height:.48em; left:-5%; top:.35em; overflow:visible; pointer-events:none; }
.name-strike path { fill:none; stroke:#9b5438; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:250; stroke-dashoffset:250; transition:stroke-dashoffset .55s ease-out; }
.goose-name { position:absolute; left:0; bottom:88%; font-family:"Bradley Hand","Segoe Print","Comic Sans MS",cursive; font-size:.72em; font-weight:400; letter-spacing:-.045em; line-height:1; color:#9b5438; transform:translateY(7px) rotate(-7deg); opacity:0; pointer-events:none; transition:opacity .25s ease .4s,transform .3s ease .4s; }
.is-goose-name .name-strike path { stroke-dashoffset:0; }
.is-goose-name .goose-name { opacity:1; transform:translateY(0) rotate(-7deg); }
@media(prefers-reduced-motion:reduce) { .name-strike path,.goose-name { transition:none; } }
