/* ─────────────────────────────────────────────────────────────────────────
   Controluce · serata del 23 ottobre — stile condiviso
   Palette, caratteri e "materiali" (carta, pellicola, luce) dell'anteprima
   pubblica del sito, così sala d'attesa, presentazione e sito parlano la
   stessa lingua visiva.
   ───────────────────────────────────────────────────────────────────────── */
:root{
  --paper:#f4efe7;
  --paper-deep:#ece4d5;
  --paper-soft:#fbf8f2;
  --paper-edge:#ddd2bd;
  --ink:#1f1b17;
  --ink-soft:#4a423a;
  --ink-muted:#7f756a;
  --green:#2f4f32;
  --green-strong:#233a25;
  --sage:#c8d8c5;
  --sage-soft:#e0e8dc;
  --earth:#9a7650;
  --brown:#5c3a1e;
  --gold:#b9914f;
  --gold-light:#e9c87b;
  --red-pencil:#c8442e;
  --safelight:#b3261e;
  --white:#fffaf2;
  --night:#161209;
  --night-2:#1f1b17;
  --night-3:#2b2620;
  --glass-bg:linear-gradient(135deg,rgba(255,250,242,.82),rgba(244,239,231,.58));
  --glass-border:rgba(221,210,189,.74);
  --font-display:'Cormorant Garamond',Georgia,serif;
  --font-body:'Public Sans',system-ui,-apple-system,sans-serif;
  --font-hand:'Caveat',cursive;
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-back:cubic-bezier(.2,1.25,.4,1);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html,body{height:100%;}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:var(--font-body);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{display:block;max-width:100%;}
button{font:inherit;color:inherit;}

/* ── Grana carta su tutto ── */
.grain{
  position:fixed;inset:0;pointer-events:none;z-index:90;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.1, 0 0 0 0 0.08, 0 0 0 0 0.06, 0 0 0 0.08 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  opacity:.4;mix-blend-mode:multiply;
}
.is-dark .grain{opacity:.16;mix-blend-mode:screen;}

/* ── Fascio di luce che respira ── */
.light-leak{
  position:fixed;inset:-20%;pointer-events:none;z-index:1;
  background:
    radial-gradient(ellipse 50% 38% at 78% 18%,rgba(185,145,79,.22),transparent 70%),
    radial-gradient(ellipse 42% 32% at 18% 86%,rgba(200,216,197,.5),transparent 70%);
  animation:leak 18s ease-in-out infinite alternate;
}
@keyframes leak{
  0%{transform:translate3d(-2%,-1%,0) scale(1);opacity:.85;}
  100%{transform:translate3d(2%,2%,0) scale(1.06);opacity:1;}
}

/* ── Pulviscolo nel fascio di luce ── */
.dust{position:absolute;inset:0;pointer-events:none;overflow:hidden;}
.dust i{
  position:absolute;display:block;width:5px;height:5px;border-radius:50%;
  background:rgba(255,248,226,.85);filter:blur(1px);
  animation:float var(--fd,11s) linear infinite;
  left:var(--fx);top:110%;opacity:0;
}
@keyframes float{
  0%{transform:translateY(0) translateX(0);opacity:0;}
  12%{opacity:var(--fo,.7);}
  88%{opacity:var(--fo,.7);}
  100%{transform:translateY(-120vh) translateX(40px);opacity:0;}
}

/* ── Iride dell'otturatore ── */
.iris{
  position:fixed;left:50%;top:50%;width:0;height:0;border-radius:50%;
  z-index:95;pointer-events:none;transform:translate(-50%,-50%);
  box-shadow:0 0 0 220vmax var(--night);
  animation:irisOpen 1.7s cubic-bezier(.55,.06,.28,.99) .25s forwards;
}
@keyframes irisOpen{
  0%{width:0;height:0;opacity:1;}
  82%{opacity:1;}
  100%{width:300vmax;height:300vmax;opacity:0;}
}
.iris.closing{
  animation:irisClose .9s cubic-bezier(.6,.04,.4,1) forwards;
}
@keyframes irisClose{
  0%{width:300vmax;height:300vmax;opacity:1;}
  100%{width:0;height:0;opacity:1;}
}

/* ── Nastro di pellicola con scritta che scorre ── */
.film-badge{
  position:relative;display:inline-block;overflow:hidden;
  width:min(300px,40vw);
  background:linear-gradient(160deg,#2b261e,#211c15);
  border:1px solid rgba(233,200,123,.28);
  border-radius:9px;padding:14px 0;
  box-shadow:0 12px 30px rgba(31,27,23,.32);
  transform:rotate(-.6deg);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);
}
.film-badge::before,.film-badge::after{
  content:'';position:absolute;left:7px;right:7px;height:5px;z-index:2;
  background-image:radial-gradient(circle,rgba(244,239,231,.5) 1.6px,transparent 1.8px);
  background-size:13px 5px;
}
.film-badge::before{top:4px;}
.film-badge::after{bottom:4px;}
.film-badge .reel{display:flex;white-space:nowrap;width:max-content;animation:reel 16s linear infinite;}
.film-badge .reel span{font-size:11px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-light);padding-right:8px;}
.film-badge .reel i{font-style:normal;color:rgba(244,239,231,.45);padding-right:8px;}
@keyframes reel{to{transform:translateX(-50%);}}

/* ── Marchio istituzionale ── */
.brand{display:flex;align-items:center;gap:13px;}
.brand .stemma{height:46px;width:auto;filter:drop-shadow(0 2px 6px rgba(31,27,23,.25));}
.brand .sep{width:1px;height:34px;background:var(--paper-edge);}
.brand .logo-cl{height:44px;width:44px;border-radius:50%;box-shadow:0 4px 14px rgba(31,27,23,.18);}
.brand-text{display:flex;flex-direction:column;line-height:1.15;}
.brand-text strong{font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;}
.brand-text span{font-size:11px;color:var(--ink-muted);letter-spacing:.06em;}
.is-dark .brand-text strong{color:var(--paper-soft);}
.is-dark .brand-text span{color:rgba(244,239,231,.62);}
.is-dark .brand .sep{background:rgba(244,239,231,.25);}

.eyebrow{
  color:var(--green);font-size:13px;font-weight:700;
  letter-spacing:.22em;text-transform:uppercase;
}
.logotype i,.logotype em{font-style:italic;color:var(--green);}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.2s !important;}
  .iris{display:none;}
}