/* fedelissimi.eu — foglio di stile della home.
   Colori: sono i tre del marchio. Non aggiungerne altri senza un motivo. */
:root{
  --paper:#FBFAF7; --ink:#191816; --dim:#5E5952; --rule:#DCD8D0;
  --coral:#F15F5C; --giallo:#EEC220; --azzurro:#20C4F4; --scuro:#151310;
  --serif:'Newsreader',Georgia,'Times New Roman',serif;
  --grot:'Bricolage Grotesque',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,'SF Mono',Menlo,monospace;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--serif);
 font-weight:400;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
h1,h2,h3,h4{text-wrap:balance}
a{color:inherit}
:focus-visible{outline:2px solid var(--azzurro);outline-offset:3px}
.in{max-width:1140px;margin:0 auto;padding:0 30px}
.salta{position:absolute;left:-9999px}
.salta:focus{position:static;display:inline-block;padding:10px;background:var(--giallo)}

/* fascia Venezia */
.news{background:var(--scuro);color:#FBF8F2}
.news .in{display:grid;grid-template-columns:auto 1fr;gap:4px 24px;padding-top:15px;padding-bottom:15px;align-items:baseline}
.news .t{font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--coral)}
.news p{margin:0;font-size:.95rem;max-width:78ch}
.news .w{grid-column:2;font-family:var(--mono);font-size:.74rem;color:#A49C90;padding-top:3px}

/* testata */
header{border-bottom:1px solid var(--rule)}
header .in{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:22px;padding-bottom:22px}
.logo{display:block;line-height:0}
.logo img{width:190px;height:auto}
nav{display:flex;gap:24px;font-family:var(--mono);font-size:.74rem;letter-spacing:.04em}
nav a{color:var(--dim);text-decoration:none}
nav a:hover{color:var(--ink)}

/* apertura */
.hero .in{padding-top:58px;padding-bottom:52px;display:grid;grid-template-columns:1.05fr .95fr;gap:46px;align-items:center}
.hero .kick{font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--coral);margin:0 0 18px}
.hero h1{font-weight:400;font-size:clamp(2.3rem,5.1vw,3.9rem);line-height:1.05;letter-spacing:-.02em;margin:0 0 20px}
.hero .lead{margin:0;font-size:1.13rem;line-height:1.55;color:#2E2A26;max-width:46ch}
.hero .lead::first-letter{float:left;font-family:var(--grot);font-weight:800;font-size:3.2em;line-height:.78;padding:.05em .12em 0 0;color:var(--coral)}
.cats{margin:18px 0 0;padding-top:16px;border-top:1px solid var(--rule);font-family:var(--mono);
 font-size:.76rem;letter-spacing:.03em;color:var(--dim);line-height:1.7}
.hero figure{margin:0}
.hero-im{aspect-ratio:5/4;object-fit:cover;width:100%;height:auto}
.hero figcaption{font-family:var(--mono);font-size:.7rem;color:var(--dim);padding-top:9px;line-height:1.5}

/* opere */
.opere{background:var(--scuro);color:#FBF8F2}
.opere .in{padding-top:52px;padding-bottom:52px}
.op-mark{width:52px;margin:0 0 20px;opacity:.9}
.op-lab{margin:0 0 12px;font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--giallo)}
.opere h2{font-family:var(--grot);font-weight:800;font-size:clamp(1.8rem,4vw,2.7rem);line-height:1.02;letter-spacing:-.035em;margin:0 0 14px}
.op-intro{margin:0 0 38px;color:#B9B1A5;font-size:1.05rem;max-width:58ch}
.op-grid{display:grid;grid-template-columns:1fr 1fr;gap:44px}
.op{display:grid;grid-template-columns:170px 1fr;gap:22px;align-items:start}
.op-im{width:100%;height:auto;object-fit:cover}
.op-txt h3{margin:0 0 5px;font-weight:600;font-size:1.4rem;letter-spacing:-.015em}
.op-meta{margin:0 0 12px;font-family:var(--mono);font-size:.72rem;color:var(--azzurro)}
.op-txt p{margin:0 0 12px;font-size:.99rem;line-height:1.55;color:#CFC7BA}
.op-txt strong{color:#FBF8F2;font-weight:600}
.op-cred{font-family:var(--mono);font-size:.68rem;line-height:1.65;color:#8B8375}
.op-premi{margin:0;font-family:var(--mono);font-size:.7rem;color:var(--giallo)}
.dc{background:var(--giallo);color:#1B1608;padding:1px 6px;margin-left:6px}

/* famiglie */
.fam-band{color:var(--ink)}
.fam-coral .fam-band{background:var(--coral)}
.fam-giallo .fam-band{background:var(--giallo)}
.fam-azzurro .fam-band{background:var(--azzurro)}
.fam-scuro .fam-band{background:var(--scuro);color:#FBF8F2}
.fam-band .in{padding-top:44px;padding-bottom:44px}
.fam-tag{margin:0 0 14px;font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;opacity:.72}
.fam-band h2{font-family:var(--grot);font-weight:800;font-size:clamp(1.9rem,4.3vw,3rem);line-height:1;letter-spacing:-.035em;margin:0 0 18px;max-width:19ch}
.fam-cosa{margin:0 0 14px;font-size:1.08rem;line-height:1.55;max-width:56ch}
.fam-chi{margin:0;font-family:var(--mono);font-size:.76rem;opacity:.75}
.fam-prova{padding:44px 0 10px;border-bottom:1px solid var(--rule)}
.prova-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:42px;align-items:start}
.fam-prova figure{margin:0}
.prova-im{width:100%;aspect-ratio:4/3;object-fit:cover}
.fam-prova figcaption{font-family:var(--mono);font-size:.7rem;color:var(--dim);padding-top:9px;line-height:1.5}
.prova-lab{margin:0 0 10px;font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
.prova-txt h3{font-weight:600;font-size:1.7rem;letter-spacing:-.015em;margin:0 0 12px}
.prova-p{margin:0 0 24px;font-size:1.04rem;line-height:1.6;color:#332F2A;max-width:54ch}
.dati{display:flex;flex-wrap:wrap;border-top:1px solid var(--rule)}
.dati div{padding:14px 24px 6px 0;margin-right:24px;border-right:1px solid var(--rule)}
.dati div:last-child{border-right:0;margin-right:0}
.dati b{display:block;font-family:var(--grot);font-weight:800;font-size:1.7rem;line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.dati span{display:block;font-family:var(--mono);font-size:.68rem;color:var(--dim);padding-top:6px}
.alt-grid{display:flex;flex-wrap:wrap;gap:30px;padding-top:34px;padding-bottom:34px}
.alt{flex:1 1 300px;max-width:560px;display:grid;grid-template-columns:104px 1fr;gap:16px;align-items:start}
.alt-im{width:104px;aspect-ratio:1;object-fit:cover}
.alt h4{margin:0 0 5px;font-weight:600;font-size:1.02rem;letter-spacing:-.01em}
.alt p{margin:0;font-size:.92rem;line-height:1.5;color:var(--dim)}
.alt-cr{font-family:var(--mono);font-size:.66rem;color:#8A857D;padding-top:6px}

/* indice servizi + contatti */
.ix{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;border-top:1px solid var(--rule);margin-top:40px;padding-top:26px}
.ix h4{margin:0 0 12px;font-family:var(--mono);font-size:.72rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;display:flex;align-items:center;gap:8px}
.ix-dot{width:9px;height:9px;flex:none;display:inline-block}
.ix-coral .ix-dot{background:var(--coral)}
.ix-giallo .ix-dot{background:var(--giallo)}
.ix-azzurro .ix-dot{background:var(--azzurro)}
.ix-scuro .ix-dot{background:var(--scuro)}
.ix ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:7px}
.ix li{font-size:.9rem;line-height:1.4;color:var(--dim)}
footer{padding:48px 0 70px}
.fmark{padding-bottom:26px}
.fmark img{width:230px}
footer .cont{display:grid;grid-template-columns:1fr auto;gap:26px;align-items:end}
footer h2{font-family:var(--grot);font-weight:800;font-size:clamp(1.7rem,3.6vw,2.4rem);letter-spacing:-.03em;margin:0 0 10px}
footer p{margin:0;color:var(--dim);font-size:.98rem;max-width:46ch}
.fmail{font-family:var(--mono);font-size:.86rem;text-align:right}
.fmail a{color:var(--ink)}
.legale{border-top:1px solid var(--rule);margin-top:34px;padding-top:16px;font-family:var(--mono);font-size:.7rem;color:var(--dim);line-height:1.7}

@media(max-width:880px){
 .hero .in,.prova-grid,.op-grid,footer .cont{grid-template-columns:1fr;gap:26px}
 .op{grid-template-columns:130px 1fr}
 .ix{grid-template-columns:1fr 1fr;gap:22px}
 .news .in{grid-template-columns:1fr}
 .news .w{grid-column:1}
 nav{display:none}
 .logo img{width:150px}
 .fmark img{width:180px}
 .fmail{text-align:left}
 .dati div{padding-right:16px;margin-right:16px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* ===== pagina progetto ===== */
.pg-top{border-bottom:1px solid var(--rule)}
.pg-top .in{padding-top:56px;padding-bottom:40px}
.pg-back{display:inline-block;margin:0 0 22px;font-family:var(--mono);font-size:.72rem;
 letter-spacing:.1em;text-transform:uppercase;color:var(--coral);text-decoration:none}
.pg-back:hover{text-decoration:underline}
.pg-top h1{font-weight:400;font-size:clamp(2.4rem,6vw,4.4rem);line-height:1;letter-spacing:-.025em;margin:0}
.pg-top h1 span{display:block;color:var(--dim)}
.pg-meta{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:22px;
 border-top:1px solid var(--rule);margin-top:34px;padding-top:20px}
.pg-meta dt{font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin:0 0 6px}
.pg-meta dd{margin:0;font-size:.98rem;line-height:1.45}
.pg-tesi{background:var(--coral)}
.pg-tesi .in{padding-top:52px;padding-bottom:52px}
.pg-tesi p{margin:0;font-family:var(--grot);font-weight:800;font-size:clamp(1.9rem,5vw,3.4rem);
 line-height:1;letter-spacing:-.035em;max-width:16ch;color:var(--ink)}
.pg-testo .in{padding-top:48px;padding-bottom:20px;display:grid;
 grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:40px;max-width:1000px}
.pg-testo p{margin:0;font-size:1.08rem;line-height:1.62;color:#332F2A}
.pg-testo p:first-child::first-letter{float:left;font-family:var(--grot);font-weight:800;
 font-size:3.2em;line-height:.78;padding:.05em .12em 0 0;color:var(--coral)}
.pg-foto .in{padding-top:36px;padding-bottom:20px;display:flex;flex-direction:column;gap:44px}
.pg-foto figure{margin:0}
.pg-foto img{width:100%;height:auto;object-fit:cover}
.pg-foto figcaption{font-family:var(--mono);font-size:.72rem;color:var(--dim);padding-top:10px;line-height:1.5;max-width:60ch}
.pg-chiusura{background:var(--scuro);color:#FBF8F2;margin-top:40px}
.pg-chiusura .in{padding-top:52px;padding-bottom:52px}
.pg-chiusura h2{font-family:var(--grot);font-weight:800;font-size:clamp(1.7rem,4vw,2.6rem);
 letter-spacing:-.035em;line-height:1.05;margin:0 0 12px;max-width:18ch}
.pg-chiusura p{margin:0 0 22px;color:#B9B1A5;max-width:52ch}
.pg-chiusura a{font-family:var(--mono);font-size:.9rem;color:var(--giallo)}
.pg-nav{border-top:1px solid var(--rule)}
.pg-nav .in{display:flex;flex-wrap:wrap;gap:16px 28px;justify-content:space-between;
 padding-top:26px;padding-bottom:26px;font-family:var(--mono);font-size:.78rem}
.pg-nav a{color:var(--dim);text-decoration:none}
.pg-nav a:hover{color:var(--ink)}
.alt a{text-decoration:none}
.alt a:hover h4{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}

/* il nostro ruolo, dentro la scheda di un film che non abbiamo diretto */
.op-ruolo{border-left:2px solid var(--giallo);padding-left:16px;margin:0 0 14px;
 font-size:.97rem;line-height:1.55;color:#DED6C8}
.op-ruolo span{display:block;font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;
 text-transform:uppercase;color:var(--giallo);margin-bottom:7px}

/* quinta famiglia: gli eventi che organizziamo noi — banda di carta, non di colore */
.fam-carta .fam-band{background:var(--paper);border-top:3px solid var(--ink);border-bottom:1px solid var(--rule)}
.fam-carta .fam-tag{color:var(--coral);opacity:1}

/* ===== pagina dirette e convegni ===== */
.st-lead{margin:26px 0 0;font-size:1.12rem;line-height:1.6;max-width:58ch;color:#332F2A}
.st-prove .in{padding-top:48px;padding-bottom:20px}
.st-prove h2,.blk h2,.st-eventi h2{font-family:var(--grot);font-weight:800;font-size:clamp(1.5rem,3.4vw,2.2rem);
 letter-spacing:-.03em;margin:0 0 26px}
.pv-grid{display:flex;flex-wrap:wrap;gap:30px}
.pv{flex:1 1 300px;max-width:560px;display:grid;grid-template-columns:132px 1fr;gap:18px;align-items:start}
.pv img{width:132px;aspect-ratio:4/3;object-fit:cover}
.pv h3{margin:0 0 6px;font-size:1.1rem;font-weight:600;letter-spacing:-.015em}
.pv p{margin:0;font-size:.94rem;line-height:1.5;color:var(--dim)}
.pv-cr{font-family:var(--mono);font-size:.66rem;color:#8A857D;padding-top:6px}
.blk{margin-top:44px}
.blk .in{padding-top:40px;padding-bottom:40px}
.blk-azzurro{background:var(--azzurro)}
.blk-giallo{background:var(--giallo)}
.blk-coral{background:var(--coral)}
.voci{display:flex;flex-wrap:wrap;gap:28px}
.voce{flex:1 1 280px;max-width:520px}
.voce h4{margin:0 0 6px;font-family:var(--mono);font-size:.76rem;letter-spacing:.06em;font-weight:500}
.voce p{margin:0;font-size:.98rem;line-height:1.5}
.st-eventi .in{padding-top:48px;padding-bottom:10px}
.ev{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:10px}
.ev li{font-family:var(--mono);font-size:.78rem;border:1px solid var(--rule);padding:8px 14px}
@media(max-width:700px){.pv{grid-template-columns:96px 1fr}.pv img{width:96px}}

/* link di approfondimento sotto una fascia, indice pagine, pagine film */
.fam-link{margin:16px 0 0}
.fam-link a{font-family:var(--mono);font-size:.78rem;border-bottom:1px solid currentColor;text-decoration:none;padding-bottom:2px}
.pagine{display:flex;flex-wrap:wrap;gap:8px 20px;align-items:baseline;border-top:1px solid var(--rule);
 margin-top:26px;padding-top:18px;font-family:var(--mono);font-size:.76rem}
.pagine span{color:var(--dim);letter-spacing:.12em;text-transform:uppercase;font-size:.66rem}
.pagine a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--rule);padding-bottom:2px}
.pagine a:hover{border-color:var(--ink)}
.op-txt h3 a{text-decoration:none}
.op-txt h3 a:hover{text-decoration:underline;text-underline-offset:3px}
.film-extra{display:flex;flex-wrap:wrap;gap:36px;padding-top:8px;padding-bottom:12px}
.film-ruolo,.film-proiezioni{flex:1 1 320px;max-width:560px}
.film-ruolo h3,.film-proiezioni h3{font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;
 color:var(--coral);margin:0 0 10px;font-weight:500}
.film-ruolo{border-left:2px solid var(--giallo);padding-left:16px}
.film-ruolo p{margin:0;font-size:1rem;line-height:1.55}
.film-proiezioni dl{margin:0;display:flex;flex-direction:column;gap:12px}
.film-proiezioni dt{font-family:var(--mono);font-size:.76rem;color:var(--ink)}
.film-proiezioni dd{margin:2px 0 0;font-size:.95rem;color:var(--dim);line-height:1.45}
.film-crediti{font-family:var(--mono);font-size:.72rem;line-height:1.8;color:var(--dim);
 border-top:1px solid var(--rule);padding-top:18px;margin:26px 0 10px;max-width:82ch}
.film-premi{font-family:var(--mono);font-size:.74rem;color:var(--coral);margin:0;max-width:82ch;line-height:1.7}
.pg-top h1 span{font-size:.52em;letter-spacing:-.015em;padding-top:6px}

/* trailer */
.trailer{padding-top:28px;padding-bottom:8px}
.trailer h3{font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;
 color:var(--coral);margin:0 0 12px;font-weight:500}
.tr-wrap{position:relative;padding-top:56.25%;background:var(--scuro)}
.tr-wrap iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.tr-alt{margin:10px 0 0;font-family:var(--mono);font-size:.72rem;color:var(--dim)}
.tr-alt a{color:var(--ink)}

/* cartoline: i fotogrammi usciti sui social */
.cartoline{border-top:1px solid var(--rule);margin-top:34px}
.cartoline .in{padding-top:34px;padding-bottom:10px}
.cartoline h3{font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;
 color:var(--coral);margin:0 0 8px;font-weight:500}
.ct-intro{margin:0 0 22px;color:var(--dim);max-width:56ch}
.ct-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:20px}
.cartoline figure{margin:0}
.cartoline img{width:100%;aspect-ratio:3/2;object-fit:cover}
.cartoline figcaption{font-family:var(--mono);font-size:.68rem;color:var(--dim);padding-top:8px}
.ct-cr{font-family:var(--mono);font-size:.68rem;color:var(--dim);margin:18px 0 0}

/* ===== biglietto da visita NFC ===== */
.card-body{background:var(--paper)}
.card{max-width:520px;margin:0 auto;padding:38px 24px 60px}
.card-logo{width:220px;height:auto;margin:0 0 22px}
.card-claim{margin:0 0 6px;font-size:1.22rem;line-height:1.4;max-width:26ch}
.card-sede{margin:0 0 22px;font-family:var(--mono);font-size:.74rem;color:var(--dim)}
.card-news{margin:0 0 24px;background:var(--scuro);color:#FBF8F2;padding:16px 18px;font-size:.95rem;line-height:1.5}
.card-news span{display:block;font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--coral);margin-bottom:7px}
.card-news a{color:var(--giallo);font-family:var(--mono);font-size:.82rem;white-space:nowrap}
.btns{display:flex;flex-direction:column;gap:10px;margin-bottom:36px}
.btn{display:block;text-align:center;padding:15px 18px;font-family:var(--mono);font-size:.86rem;
 text-decoration:none;border:1px solid var(--ink);transition:background .15s,color .15s}
.btn-pieno{background:var(--ink);color:var(--paper)}
.btn-pieno:hover{background:var(--coral);border-color:var(--coral);color:var(--ink)}
.btn-vuoto{color:var(--ink)}
.btn-vuoto:hover{background:var(--ink);color:var(--paper)}
.card-h{font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);
 font-weight:500;margin:0 0 14px;padding-top:4px;border-top:1px solid var(--rule)}
.persone{display:flex;flex-direction:column;gap:22px;margin-bottom:34px}
.pers{display:grid;grid-template-columns:52px 1fr;gap:14px;align-items:start}
.ini{display:grid;place-items:center;width:52px;height:52px;background:var(--coral);color:var(--ink);
 font-family:var(--grot);font-weight:800;font-size:1.05rem;letter-spacing:-.02em}
.pers:nth-child(2) .ini{background:var(--azzurro)}
.pers h3{margin:0;font-size:1.15rem;font-weight:600;letter-spacing:-.015em}
.ruolo{margin:2px 0 8px;font-size:.9rem;color:var(--dim)}
.pcontatti{margin:0;display:flex;flex-wrap:wrap;gap:8px 14px;font-family:var(--mono);font-size:.78rem}
.pcontatti a{color:var(--ink);border-bottom:1px solid var(--rule);text-decoration:none;padding-bottom:2px}
.canali{display:flex;flex-wrap:wrap;gap:10px 16px;margin-bottom:30px;font-family:var(--mono);font-size:.8rem}
.canali a{color:var(--ink);border-bottom:1px solid var(--rule);text-decoration:none;padding-bottom:2px}
.card-legale{margin:0;border-top:1px solid var(--rule);padding-top:16px;font-family:var(--mono);
 font-size:.66rem;line-height:1.7;color:var(--dim)}
/* niente sbordi orizzontali sul telefono */
.card-body{overflow-x:hidden}
.card,.card *{min-width:0}
.card-legale,.pcontatti,.canali,.card-news{overflow-wrap:anywhere}
.btn{width:100%;box-sizing:border-box}
.btn-pieno-coral{background:var(--coral);border-color:var(--coral);color:var(--ink)}
.btn-pieno-coral:hover{background:var(--ink);border-color:var(--ink);color:var(--paper)}
