/* ═══ RESET & VARIABILI ═══ */
*{margin:0;padding:0;box-sizing:border-box}
:root{
  --bianco:#FFFFFF;--nero:#111010;--blu:#1B3A5C;
  --grigio:#6B6B6B;--grigio-pale:#F5F5F5;--linea:rgba(17,16,16,0.1);
}
html,body{scroll-behavior:smooth;background:var(--bianco);color:var(--nero);font-family:'Lato',sans-serif;overflow-x:hidden;max-width:100%}

/* ═══ ANIMAZIONI ═══ */
@keyframes letterReveal{from{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes lineGrow{from{width:0}to{width:3rem}}
@keyframes scrollPulse{0%,100%{opacity:0.4}50%{opacity:1}}

.reveal{opacity:0;transform:translateY(24px);transition:opacity 0.8s ease,transform 0.8s ease}
.reveal.visible{opacity:1;transform:translateY(0)}
.reveal-delay-1{transition-delay:0.15s}
.reveal-delay-2{transition-delay:0.3s}
.reveal-delay-3{transition-delay:0.45s}

/* ═══ NAV ═══ */
nav{
  position:fixed;top:0;left:0;right:0;
  z-index:1000;
  display:flex;justify-content:space-between;align-items:center;
  padding:0 4rem;height:64px;
  background:transparent;
  transition:background 0.5s,border-color 0.5s;
}
nav.scrolled{
  background:rgba(255,255,255,0.97);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--linea);
}
.nav-name{
  font-family:'Bodoni Moda',serif;font-size:0.85rem;
  letter-spacing:0.18em;text-transform:uppercase;
  color:rgba(255,255,255,0.9);text-decoration:none;
  transition:color 0.5s;
}
nav.scrolled .nav-name{color:var(--nero)}
.nav-links{display:flex;gap:2.2rem;list-style:none}
.nav-links a{
  font-family:'Lato',sans-serif;font-size:0.7rem;
  letter-spacing:0.14em;text-transform:uppercase;
  color:rgba(255,255,255,0.75);text-decoration:none;
  transition:color 0.3s;
}
nav.scrolled .nav-links a{color:var(--grigio)}
.nav-links a:hover{color:var(--bianco)}
nav.scrolled .nav-links a:hover{color:var(--nero)}
.nav-hamburger{display:none}
#google_translate_element{
  display:flex;align-items:center;
  transition:opacity 0.3s ease;
}
#google_translate_element select{
  font-family:'Lato',sans-serif;font-size:0.68rem;
  letter-spacing:0.12em;text-transform:uppercase;
  color:rgba(255,255,255,0.6);
  background:transparent;border:none;
  border-bottom:1px solid rgba(255,255,255,0.3);
  cursor:pointer;outline:none;padding-bottom:0.1rem;
}
nav.scrolled #google_translate_element select{
  color:var(--grigio);
  border-bottom-color:var(--linea);
}

/* ═══ HERO — DESKTOP ═══ */
.hero{
  position:relative;
  height:100vh;min-height:600px;
  overflow:hidden;
}
.hero-photo{
  position:absolute;inset:0;
  background-image:url('http://www.fabriziobastianini.it/img/Bastianini_FotoHero.jpg');
  background-size:cover;
  background-position:right center;
  transform:scale(1.06);
  will-change:transform;
  pointer-events:none;
}
.hero-photo-mobile{display:none}
.hero-overlay{
  position:absolute;inset:0;
  background:linear-gradient(to bottom,
    rgba(8,6,6,0.3) 0%,
    rgba(8,6,6,0.1) 25%,
    rgba(8,6,6,0.2) 55%,
    rgba(8,6,6,0.82) 80%,
    rgba(8,6,6,0.95) 100%);
  pointer-events:none;
}
.hero-overlay-side{
  position:absolute;inset:0;
  background:linear-gradient(to right,rgba(8,6,6,0.35) 0%,rgba(8,6,6,0.05) 45%,transparent 100%);
  pointer-events:none;
}
.hero-content{
  position:absolute;bottom:0;left:0;right:0;
  padding:0 5rem 4.5rem;
  z-index:2;
}
.hero-rule{
  height:1px;background:rgba(255,255,255,0.3);
  margin-bottom:2rem;width:0;
  animation:lineGrow 1s ease 0.3s forwards;
}
.hero-logo{
  margin-bottom:1.2rem;height:56px;
  display:flex;align-items:center;
  opacity:0;animation:fadeIn 0.8s ease 0.5s forwards;
}
.hero-logo img{height:56px;width:auto}
.hero-eyebrow{
  font-family:'Cormorant Garamond',serif;font-size:0.82rem;
  letter-spacing:0.45em;text-transform:uppercase;
  color:rgba(255,255,255,0.55);margin-bottom:0.8rem;
  opacity:0;animation:fadeIn 0.8s ease 0.7s forwards;
}
.hero-name{
  font-family:'Bodoni Moda',serif;
  font-size:clamp(3.5rem,9vw,7.5rem);font-weight:900;
  line-height:0.92;letter-spacing:0.03em;
  color:var(--bianco);margin-bottom:1.8rem;
  text-shadow:0 2px 40px rgba(0,0,0,0.4);
}
.hero-name .line{display:block;overflow:visible}
.hero-name span{display:inline-block;opacity:1;transform:none}
.hero-bottom{
  display:flex;align-items:flex-end;justify-content:space-between;gap:3rem;
  opacity:0;animation:fadeUp 0.8s ease 2s forwards;
}
.hero-role{
  font-family:'Cormorant Garamond',serif;font-style:italic;
  font-size:clamp(1rem,2vw,1.4rem);color:rgba(255,255,255,0.7);line-height:1.7;
}
.hero-role strong{color:rgba(255,255,255,0.95);font-style:normal;font-weight:400;letter-spacing:0.02em}
.hero-actions{display:flex;gap:1rem;align-items:center;flex-shrink:0}
.hero-scroll{
  position:absolute;bottom:2rem;right:4rem;z-index:2;
  display:flex;flex-direction:column;align-items:center;gap:0.5rem;
  opacity:0;animation:fadeIn 1s ease 2.5s forwards;
}
.hero-scroll-line{width:1px;height:3rem;background:linear-gradient(to bottom,transparent,rgba(255,255,255,0.5));animation:scrollPulse 2s ease 3s infinite}
.hero-scroll-label{font-family:'Cormorant Garamond',serif;font-size:0.62rem;letter-spacing:0.3em;text-transform:uppercase;color:rgba(255,255,255,0.4);writing-mode:vertical-rl}

/* ═══ PULSANTI ═══ */
.btn-white{font-family:'Lato',sans-serif;font-size:0.72rem;letter-spacing:0.14em;text-transform:uppercase;padding:0.8rem 1.8rem;border:1px solid rgba(255,255,255,0.7);color:var(--bianco);text-decoration:none;transition:background 0.25s,border-color 0.25s}
.btn-white:hover{background:rgba(255,255,255,0.12);border-color:rgba(255,255,255,1)}
.btn-white-solid{font-family:'Lato',sans-serif;font-size:0.72rem;letter-spacing:0.14em;text-transform:uppercase;padding:0.8rem 1.8rem;background:var(--bianco);color:var(--nero);text-decoration:none;font-weight:700;transition:background 0.25s,transform 0.2s}
.btn-white-solid:hover{background:rgba(255,255,255,0.88);transform:translateY(-2px)}
.btn-outline{font-family:'Lato',sans-serif;font-size:0.72rem;letter-spacing:0.12em;text-transform:uppercase;padding:0.7rem 1.4rem;border:1px solid var(--linea);color:var(--grigio);text-decoration:none;display:inline-block;transition:all 0.25s}
.btn-outline:hover{border-color:var(--blu);color:var(--blu)}
.btn-submit{font-family:'Lato',sans-serif;font-size:0.75rem;letter-spacing:0.14em;text-transform:uppercase;padding:0.85rem 2rem;background:var(--nero);color:var(--bianco);border:none;font-weight:700;cursor:pointer;transition:background 0.25s,transform 0.2s;width:100%;margin-top:0.5rem}
.btn-submit:hover{background:var(--blu);transform:translateY(-2px)}

/* ═══ SEZIONI ═══ */
section{padding:6rem 5rem}
.s-label{font-family:'Cormorant Garamond',serif;font-size:0.72rem;letter-spacing:0.4em;text-transform:uppercase;color:var(--blu);margin-bottom:0.8rem;display:flex;align-items:center;gap:1rem}
.s-label::before{content:'';display:block;width:2rem;height:1px;background:var(--blu)}
.s-title{font-family:'Bodoni Moda',serif;font-size:clamp(1.8rem,3.5vw,2.8rem);font-weight:700;line-height:1.1;color:var(--nero);margin-bottom:2rem}

/* BIO */
.bio-section{background:var(--bianco);border-bottom:1px solid var(--linea)}
.bio-grid{display:grid;grid-template-columns:1fr 1fr;gap:6rem;align-items:start}
.bio-text p{font-size:1rem;line-height:2;color:var(--grigio);margin-bottom:1.4rem}
.bio-text p strong{color:var(--nero)}
.bio-text em{color:var(--blu);font-style:italic}
.bio-pull{font-family:'Bodoni Moda',serif;font-style:italic;font-size:1.5rem;line-height:1.5;color:var(--nero);padding-left:2rem;border-left:2px solid var(--blu);margin-bottom:2.5rem}

/* ATTIVITÀ */
.attivita-section{background:var(--grigio-pale);border-bottom:1px solid var(--linea)}
.att-grid{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--linea)}
.att-card{padding:2.5rem 2rem;border-right:1px solid var(--linea);position:relative;overflow:hidden;transition:background 0.3s}
.att-card:last-child{border-right:none}
.att-card::after{content:'';position:absolute;bottom:0;left:0;height:2px;width:0;background:var(--blu);transition:width 0.4s ease}
.att-card:hover::after{width:100%}
.att-card:hover{background:var(--bianco)}
.att-icon{font-family:'Cormorant Garamond',serif;font-size:2.5rem;color:rgba(27,58,92,0.15);margin-bottom:1.2rem}
.att-title{font-family:'Bodoni Moda',serif;font-size:1.2rem;font-weight:700;color:var(--nero);margin-bottom:0.6rem}
.att-body{font-size:0.88rem;line-height:1.78;color:var(--grigio)}

/* PRODUZIONI */
/* ═══ CONCERTI — STILE UNIFORMATO ═══ */

.sezione-concerti {
  margin-top: 2rem;
  padding: 0;
}

.concerti-list {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  margin-top: 1.5rem;
}

/* Singolo concerto */
.concerto-item {
  display: grid;
  grid-template-columns: 90px 1fr auto;
  gap: 2rem;
  align-items: start;
  padding: 1.8rem 0;
  border-bottom: 1px solid var(--linea);
  transition: background 0.2s ease;
}

.concerto-item:first-child {
  border-top: 1px solid var(--linea);
}

.concerto-item:hover {
  background: var(--grigio-pale);
}

/* Testi */
.concerto-anno {
  font-family: 'Cormorant Garamond', serif;
  font-size: 0.78rem;
  letter-spacing: 0.15em;
  color: var(--blu);
  text-transform: uppercase;
}

.concerto-data {
  font-family: 'Cormorant Garamond', serif;
  font-size: 0.72rem;
  color: rgba(27,58,92,0.5);
  margin-top: 0.3rem;
  letter-spacing: 0.08em;
}

.concerto-titolo {
  font-family: 'Bodoni Moda', serif;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--nero);
  font-style: italic;
  margin-bottom: 0.3rem;
}

.concerto-dettaglio {
  font-size: 0.85rem;
  color: var(--grigio);
  line-height: 1.6;
  margin-bottom: 0.3rem;
}

.concerto-note {
  font-size: 0.78rem;
  color: rgba(27,58,92,0.7);
  font-style: italic;
}

.concerto-luogo {
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--grigio);
  text-align: right;
  min-width: 160px;
  padding-top: 0.2rem;
  line-height: 1.6;
}

/* ═══ SEZIONE CONCERTI — STRUTTURA GENERALE ═══ */

.sezione-concerti {
  margin-top: 2rem;
  padding: 0;
}

/* ═══ LISTA CONCERTI — SEMPRE UNA COLONNA ═══ */

.concerti-list {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  margin-top: 2rem;
}

/* ═══ BLOCCO CONCERTO ═══ */

.concerto-item {
  display: grid;
  grid-template-columns: 90px 1fr auto;
  gap: 2rem;
  align-items: start;
  padding: 1.8rem 1rem;
  border: 1px solid var(--linea);
  border-radius: 4px;
  background: var(--bianco);
  transition: background 0.25s ease;
}

.concerto-item:hover {
  background: var(--grigio-pale);
}

/* ═══ TESTI ═══ */

.concerto-anno {
  font-family: 'Cormorant Garamond', serif;
  font-size: 0.78rem;
  letter-spacing: 0.15em;
  color: var(--blu);
  text-transform: uppercase;
}

.concerto-data {
  font-family: 'Cormorant Garamond', serif;
  font-size: 0.72rem;
  color: rgba(27,58,92,0.5);
  margin-top: 0.3rem;
  letter-spacing: 0.08em;
}

.concerto-titolo {
  font-family: 'Bodoni Moda', serif;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--nero);
  font-style: italic;
  margin-bottom: 0.3rem;
}

.concerto-dettaglio {
  font-size: 0.85rem;
  color: var(--grigio);
  line-height: 1.6;
  margin-bottom: 0.3rem;
}

.concerto-note {
  font-size: 0.78rem;
  color: rgba(27,58,92,0.7);
  font-style: italic;
}

.concerto-luogo {
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--grigio);
  text-align: right;
  min-width: 160px;
  padding-top: 0.2rem;
  line-height: 1.6;
}

/* ═══ CONCERTO PROSSIMO — GRAFICA DIFFERENZIATA ═══ */

.concerto-item.prossimo {
  background: rgba(27,58,92,0.06);
  border-left: 3px solid var(--blu);
  padding-left: 1.8rem;
  border-radius: 4px;
  position: relative;
}

.concerto-item.prossimo:hover {
  background: rgba(27,58,92,0.10);
}

/* Badge */
.concerto-item.prossimo::before {
  content: "IN ARRIVO";
  position: absolute;
  top: -0.9rem;
  left: 1.8rem;
  background: var(--blu);
  color: white;
  font-size: 0.62rem;
  letter-spacing: 0.15em;
  padding: 0.2rem 0.5rem;
  border-radius: 3px;
}

/* ═══ MOBILE ═══ */

@media (max-width: 768px) {

  .concerto-item {
    grid-template-columns: 60px 1fr;
    gap: 1rem;
    padding: 1.2rem 1rem;
  }

  .concerto-luogo {
    display: none;
  }

  .concerto-item.prossimo {
    padding-left: 1.2rem;
    border-left-width: 2px;
  }

  .concerto-item.prossimo::before {
    left: 1.2rem;
    top: -0.7rem;
  }
}


/* ═══ COMPOSIZIONI — VERSIONE HOME CON SFONDO BLU ═══ */

#composizioni-home {
  background: var(--blu);
  padding: 5rem 5rem;
  border-bottom: 1px solid rgba(255,255,255,0.15);
}

/* Etichetta */
#composizioni-home .s-label {
  font-family: 'Cormorant Garamond', serif;
  font-size: 0.72rem;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.55);
  margin-bottom: 0.8rem;
  display: flex;
  align-items: center;
  gap: 1rem;
}

#composizioni-home .s-label::before {
  content: '';
  display: block;
  width: 2rem;
  height: 1px;
  background: rgba(255,255,255,0.35);
}

/* Titolo */
#composizioni-home .s-title {
  font-family: 'Bodoni Moda', serif;
  font-size: clamp(1.6rem, 3vw, 2.4rem);
  font-weight: 700;
  line-height: 1.1;
  color: #fff;
  margin-bottom: 2rem;
}

/* Griglia */
#composizioni-home .comp-grid-full {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5rem;
  margin-top: 1rem;
}

/* Card */
#composizioni-home .comp-card {
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.18);
  padding: 2rem;
  border-radius: 4px;
  transition: background 0.3s, border-color 0.3s;
}

#composizioni-home .comp-card:hover {
  background: rgba(255,255,255,0.14);
  border-color: rgba(255,255,255,0.28);
}

/* Anno */
#composizioni-home .comp-anno {
  font-family: 'Cormorant Garamond', serif;
  font-size: 0.7rem;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.55);
  margin-bottom: 0.5rem;
}

/* Titolo */
#composizioni-home .comp-titolo {
  font-family: 'Bodoni Moda', serif;
  font-size: 1.1rem;
  font-weight: 700;
  font-style: italic;
  color: #fff;
  margin-bottom: 0.4rem;
}

/* Organico */
#composizioni-home .comp-organico {
  font-size: 0.82rem;
  color: rgba(255,255,255,0.75);
  line-height: 1.6;
}

/* Note (contrasto corretto) */
#composizioni-home .comp-note {
  font-size: 0.78rem;
  font-style: italic;
  color: rgba(255,255,255,0.65);
  margin-top: 0.6rem;
}

/* Link (contrasto corretto) */
#composizioni-home a {
  color: rgba(255,255,255,0.85);
  text-decoration: underline;
  transition: color 0.2s;
}

#composizioni-home a:hover {
  color: #fff;
}

/* MOBILE */
@media (max-width: 768px) {
  #composizioni-home {
    padding: 4rem 1.8rem;
  }

  #composizioni-home .comp-grid-full {
    grid-template-columns: 1fr;
    gap: 1.2rem;
  }

  #composizioni-home .comp-card {
    padding: 1.5rem;
  }
}

/* MEDIA */
.media-section {
  background: var(--nero);
  position: relative;
}

/* STRISCIA ORIZZONTALE SCORREVOLE */
.media-strip {
  display: flex;
  gap: 0.5rem;
  margin-top: 1rem;
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: 0.5rem;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch; /* scroll fluido */
}

.media-strip::-webkit-scrollbar {
  height: 0;
}

.media-thumb {
  flex: 0 0 auto;
  width: 180px;
  position: relative;
  overflow: hidden;
  aspect-ratio: 3/4;
  cursor: pointer; /* IL CLICK È QUI */
  scroll-snap-align: start;
}

/* L’IMMAGINE DEVE AVERE pointer-events: auto */
.media-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: grayscale(40%) brightness(0.85);
  transition: filter 0.5s, transform 0.5s;
  pointer-events: auto; /* RIPRISTINA LE DIMENSIONI E IL CLICK */
}

.media-thumb:hover img {
  filter: grayscale(0%) brightness(1);
  transform: scale(1.05);
}

.media-thumb-label {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 1rem 0.8rem 0.8rem;
  background: linear-gradient(to top, rgba(10,8,8,0.8), transparent);
  font-family: 'Cormorant Garamond', serif;
  font-size: 0.7rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.7);
  opacity: 0;
  transition: opacity 0.3s;
}

.media-thumb:hover .media-thumb-label {
  opacity: 1;
}

/* Frecce */
.media-arrow-left,
.media-arrow-right {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-size: 2.8rem;
  color: rgba(255,255,255,0.6);
  cursor: pointer;
  z-index: 10;
  transition: color 0.2s;
  user-select: none;
}

.media-arrow-left { left: 1rem; }
.media-arrow-right { right: 1rem; }

.media-arrow-left:hover,
.media-arrow-right:hover {
  color: rgba(255,255,255,0.9);
}

/* MODAL */
#media-modal {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.85);
  display: none;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

#media-modal img {
  max-width: 90%;
  max-height: 90%;
  border-radius: 6px;
  box-shadow: 0 0 20px rgba(0,0,0,0.4);
}

#media-close {
  position: absolute;
  top: 2rem;
  right: 2rem;
  font-size: 2.5rem;
  color: white;
  cursor: pointer;
  font-weight: 300;
  transition: opacity 0.2s;
}

#media-close:hover {
  opacity: 0.7;
}

@media (max-width: 768px) {
  #media-close {
    top: 1rem;
    right: 1rem;
    font-size: 2rem;
  }
}







/* CONTATTI */
.contatti-section{background:var(--grigio-pale);border-top:1px solid var(--linea)}
.contatti-grid{display:grid;grid-template-columns:1fr 1fr;gap:6rem;align-items:start}
.contatti-text p{font-size:0.95rem;line-height:1.9;color:var(--grigio);margin-bottom:0.8rem}
.contatti-text a{color:var(--blu);text-decoration:none;transition:color 0.2s}
.contatti-text a:hover{color:var(--nero)}
.contatti-form{display:flex;flex-direction:column;gap:1rem}
.form-field{display:flex;flex-direction:column;gap:0.4rem}
.form-label{font-size:0.7rem;letter-spacing:0.15em;text-transform:uppercase;color:var(--grigio)}
.form-input,.form-textarea{font-family:'Lato',sans-serif;font-size:0.9rem;padding:0.75rem 0;border:none;border-bottom:1px solid var(--linea);background:transparent;color:var(--nero);outline:none;transition:border-color 0.2s}
.form-input:focus,.form-textarea:focus{border-color:var(--blu)}
.form-textarea{resize:vertical;min-height:100px}
.form-success{display:none;padding:1rem;background:rgba(27,58,92,0.08);border-left:2px solid var(--blu);font-size:0.88rem;color:var(--blu);margin-top:0.5rem}

/* FOOTER */
footer{padding:2rem 5rem;display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--linea);background:var(--bianco)}
.foot-copy{font-size:0.72rem;color:var(--grigio)}
.foot-social{display:flex;gap:1.2rem}
.foot-social a{font-size:0.7rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--grigio);text-decoration:none;transition:color 0.2s}
.foot-social a:hover{color:var(--blu)}

/* ═══ MOBILE ═══ */
@media (max-width: 768px) {

  body { padding-top: 56px; }

  nav {
    padding: 0 1.5rem;
    height: 56px;
    background: rgba(10,9,7,0.96);
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  nav.scrolled {
    background: rgba(10,9,7,0.96);
  }
  .nav-name { color: rgba(255,255,255,0.9); flex: 1; }

  .nav-hamburger {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 24px; height: 18px;
    background: none; border: none;
    cursor: pointer; padding: 0;
    z-index: 1001; position: relative;
    pointer-events: all;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    order: 3;
  }
  .nav-hamburger span {
    display: block; width: 100%; height: 1.5px;
    background: rgba(255,255,255,0.8);
    transition: all 0.3s ease;
  }
  nav.menu-open .nav-hamburger span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
  nav.menu-open .nav-hamburger span:nth-child(2) { opacity: 0; }
  nav.menu-open .nav-hamburger span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

  #google_translate_element {
    order: 2;
    margin: 0 0.8rem;
  }

  .nav-links {
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 56px; left: 0; right: 0;
    width: 100%;
    background: rgba(255,255,255,0.98);
    backdrop-filter: blur(10px);
    padding: 1.5rem 1.8rem;
    gap: 0;
    border-bottom: 1px solid var(--linea);
    transform: translateY(-110%);
    opacity: 0;
    transition: transform 0.35s ease, opacity 0.35s ease;
    pointer-events: none;
    z-index: 999;
    box-sizing: border-box;
  }
  nav.menu-open .nav-links {
    transform: translateY(0);
    opacity: 1;
    pointer-events: all;
  }
  .nav-links li { border-bottom: 1px solid var(--linea); }
  .nav-links li:last-child { border-bottom: none; }
  .nav-links a {
    color: var(--nero);
    font-size: 0.88rem;
    padding: 0.8rem 0;
    display: block;
    width: 100%;
  }

  /* HERO */
  .hero { height: auto; min-height: unset; }
  .hero-photo { display: none; }
  .hero-overlay { display: none; }
  .hero-overlay-side { display: none; }
  .hero-photo-mobile {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
    object-position: center top;
  }
  .hero-content {
    position: relative;
    padding: 2rem 1.8rem;
    background: rgba(10,9,7,0.97);
  }
  .hero-name {
    font-size: clamp(1.8rem, 8.5vw, 4.5rem);
    margin-bottom: 1.4rem;
    white-space: nowrap;
  }
  .hero-rule { margin-bottom: 1.4rem; }
  .hero-logo { height: 44px; margin-bottom: 1rem; }
  .hero-logo img { height: 44px; }
  .hero-eyebrow { font-size: 0.7rem; letter-spacing: 0.28em; margin-bottom: 0.6rem; }
  .hero-bottom { flex-direction: column; align-items: flex-start; gap: 1.5rem; }
  .hero-role { font-size: 1rem; }
  .hero-actions { flex-direction: column; width: 100%; }
  .btn-white, .btn-white-solid { text-align: center; width: 100%; }
  .hero-scroll { display: none; }

  /* SEZIONI */
  section { padding: 4rem 1.8rem; }
  .bio-grid { grid-template-columns: 1fr; gap: 2.5rem; }
  .bio-pull { font-size: 1.2rem; padding-left: 1.2rem; }
  .att-grid { grid-template-columns: 1fr; border: none; }
  .att-card { border-right: none; border-bottom: 1px solid var(--linea); }
  .att-card:last-child { border-bottom: none; }
  .prod-item { grid-template-columns: 60px 1fr; gap: 1rem; }
  .prod-teatro { display: none; }
  .prod-item:hover { padding-left: 0; padding-right: 0; margin: 0; }
  .comp-grid { grid-template-columns: 1fr; }
  .media-strip { grid-template-columns: 1fr 1fr; gap: 0.4rem; }
  .contatti-grid { grid-template-columns: 1fr; gap: 3rem; }
  footer { padding: 1.5rem 1.8rem; flex-direction: column; gap: 1rem; text-align: center; }
  .foot-social { justify-content: center; }
}

/* ═══ TABLET ═══ */
@media (min-width: 769px) and (max-width: 1024px) {
  nav { padding: 0 2rem; }
  .nav-links { gap: 1.2rem; }
  section { padding: 5rem 2.5rem; }
  .hero-content { padding: 0 3rem 4rem; }
  .bio-grid { gap: 3rem; }
  .att-grid { grid-template-columns: 1fr 1fr; }
  .att-card:nth-child(2) { border-right: none; }
  .att-card:nth-child(3) { border-top: 1px solid var(--linea); border-right: none; grid-column: span 2; }
  .contatti-grid { gap: 3rem; }
  footer { padding: 1.5rem 2.5rem; }
}
