.home-btn-danger{
    background:linear-gradient(135deg, #ff3b3b, #b80000);
    color:#fff;
}

.home-btn-danger:hover{
    transform:translateY(-3px);
    box-shadow:0 12px 35px rgba(255,59,59,0.3);
}
/* =================================
   UNDERSCORE ORCHESTRA - CSS UNIFICATO
   ================================= */

/* --- CSS VARIABLES --- */
:root{
  --bg:#0b0c10;
  --bg-2:#111217;
  --fg:#f4f5f7;
  --fg2:#b3c9f4;
  --muted:#c9c9cf;
  --accent:#d4b36c; /* gold */
  --accent-2:#7a6a3a;
  --card:#14161cdd;
  --shadow: 0 10px 30px rgba(0,0,0,.35);
  --radius: 18px;
  --maxw: 1100px;
}

/* --- BASE STYLES --- */
html,body{height:100%;}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji";
  color:var(--fg);
  background: radial-gradient(1000px 600px at 10% -10%, #22252e 0%, transparent 60%),
              radial-gradient(800px 500px at 90% 10%, #1a1e26 0%, transparent 60%),
              linear-gradient(180deg, var(--bg), var(--bg-2));
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
a{color:var(--fg);text-decoration: none}
a:hover{opacity:.9}

/* --- LAYOUT COMPONENTS --- */
.orchestra-header{display:flex;justify-content:center;align-items:center;padding:24px}
.orchestra-logo{height:144px;max-width:90vw;filter: drop-shadow(0 6px 18px rgba(0,0,0,.45));}
.orchestra-section{max-width:var(--maxw); margin:28px auto; padding:0 18px}
.orchestra-card{background:var(--card); border:1px solid rgba(255,255,255,.06); border-radius:var(--radius); box-shadow:var(--shadow); padding:22px clamp(18px, 2.2vw, 28px)}

/* --- HOME PAGE - SLIDESHOW --- */
.home-slideshow{position:relative;isolation:isolate;max-width:var(--maxw);margin:0 auto; border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow)}
.home-slideshow::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,.25), rgba(0,0,0,.5)); pointer-events:none}
.home-slides{position:relative;height:min(70vh,560px);}
.home-slide{position:absolute; inset:0; opacity:0; transition:opacity .8s ease;}
.home-slide img{width:100%; height:100%; object-fit:cover; display:block}
.home-slide.active{opacity:1}

.home-controls{position:absolute; inset:auto 0 14px; display:flex; gap:10px; justify-content:center; z-index:2}
.home-dot{width:10px;height:10px;border-radius:999px; background:rgba(255,255,255,.5); outline:2px solid transparent; outline-offset:2px; cursor:pointer; border:none}
.home-dot[aria-current="true"]{background:var(--accent)}

.home-nav-btn{position:absolute; top:50%; transform:translateY(-50%); border:none; background:rgba(0,0,0,.35); padding:10px 12px; border-radius:999px; cursor:pointer; backdrop-filter: blur(4px);}
.home-nav-btn:hover{background:rgba(0,0,0,.5)}
.home-nav-btn svg{display:block; width:22px; height:22px; fill: #fff}
.home-nav-btn.prev{left:12px}
.home-nav-btn.next{right:12px}

/* --- HOME PAGE - HERO BUTTONS --- */
.home-hero-buttons{margin-top:0; margin-bottom:20px}
.home-button-container{display:flex; justify-content:center; gap:20px; flex-wrap:wrap}
.home-fancy-btn{
  display:flex;
  align-items:center;
  gap:12px;
  padding:16px 28px;
  font-size:1.1rem;
  font-weight:600;
  border:none;
  border-radius:50px;
  text-decoration:none;
  cursor:pointer;
  transition:all 0.3s ease;
  box-shadow:0 8px 25px rgba(0,0,0,0.3);
  position:relative;
  overflow:hidden;
  min-width:180px;
  justify-content:center;
}

.home-fancy-btn::before{
  content:'';
  position:absolute;
  top:0;
  left:-100%;
  width:100%;
  height:100%;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
  transition:left 0.5s;
}

.home-fancy-btn:hover::before{
  left:100%;
}

.home-btn-primary{
  background:linear-gradient(135deg, var(--accent), #e6c878);
  color:#1a1a1a;
}

.home-btn-primary:hover{
  transform:translateY(-3px);
  box-shadow:0 12px 35px rgba(212,179,108,0.4);
}

.home-btn-secondary{
  background:linear-gradient(135deg, #4a5568, #718096);
  color:#fff;
}

.home-btn-secondary:hover{
  transform:translateY(-3px);
  box-shadow:0 12px 35px rgba(74,85,104,0.4);
}

.home-btn-icon{
  font-size:1.4rem;
}

.home-btn-text{
  font-weight:600;
  letter-spacing:0.5px;
}

/* --- HOME PAGE - INTERPRETI --- */
.home-interpreti-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(250px, 1fr));
  gap:20px;
  margin-top:20px;
}

.home-interprete{
  background:rgba(255,255,255,0.03);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:12px;
  padding:20px;
  transition:transform 0.3s ease, box-shadow 0.3s ease;
}

.home-interprete:hover{
  transform:translateY(-5px);
  box-shadow:0 10px 30px rgba(0,0,0,0.2);
}

.home-interprete h3{
  color:var(--accent);
  margin:0 0 10px 0;
  font-size:1.2rem;
}

.home-interprete p{
  margin:0;
  line-height:1.6;
  color:var(--muted);
}

/* --- HOME PAGE - CONTENT ELEMENTS --- */
.home-tag{display:inline-block; letter-spacing:.12em; text-transform:uppercase; font-size:.73rem; color:#fff; background: linear-gradient(145deg, var(--accent), #b48935); padding:.35rem .6rem; border-radius:999px; margin-bottom:.5rem}
.home-lead{font-size: clamp(1.05rem, 2.2vw, 1.25rem); line-height:1.65;}
.home-lead strong{color:var(--accent)}

/* --- HOME PAGE - SOCIAL LINKS --- */
.home-socials{display:flex; flex-wrap:wrap; gap:14px; align-items:center; margin-top:14px}
.home-socials a{display:flex; align-items:center; gap:10px; padding:10px 14px; background:#0f1117; border:1px solid rgba(255,255,255,.08); border-radius:999px}
.home-socials svg{width:20px;height:20px; fill:#fff}

/* --- CANTA CON NOI PAGE --- */
.canzoni-page-header {
    text-align: center;
    margin-bottom: 40px;
}

.canzoni-page-title {
    font-size: 2.5rem;
    margin: 0 0 16px 0;
    background: linear-gradient(135deg, var(--accent), #e6c878);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 700;
}

.canzoni-page-subtitle {
    font-size: 1.2rem;
    color: var(--muted);
    margin: 0 0 24px 0;
    line-height: 1.6;
}

.canzoni-back-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 20px;
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 25px;
    color: var(--fg);
    text-decoration: none;
    transition: all 0.3s ease;
    font-weight: 500;
}

.canzoni-back-btn:hover {
    background: rgba(255,255,255,0.1);
    transform: translateX(-5px);
}

.canzoni-container {
    display: flex;
    flex-direction: column;
    gap: 24px;
    max-width: 800px;
    margin: 0 auto;
}

.canzone-item {
    background: var(--card);
    border: 1px solid rgba(255,255,255,0.06);
    border-radius: var(--radius);
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    box-shadow: var(--shadow);
}

.canzone-item:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(0,0,0,0.4);
}

.canzone-link {
    display: block;
    text-decoration: none;
    color: inherit;
}

.canzone-image-wrapper {
    position: relative;
    height: 100%;
    overflow: hidden;
}

.canzone-number {
    position: absolute;
    top: 10px;
    left: 10px;
    background: rgba(218, 165, 32, 0.9);
    color: white;
    font-size: 24px;
    font-weight: bold;
    padding: 8px 16px;
    border-radius: 50%;
    min-width: 40px;
    text-align: center;
    z-index: 10;
    box-shadow: 0 2px 8px rgba(0,0,0,0.3);
    backdrop-filter: blur(4px);
}

.canzone-image {
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 0.3s ease;
}

.canzone-item:hover .canzone-image {
    transform: scale(1.05);
}

.canzone-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.7);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 8px;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.canzone-item:hover .canzone-overlay {
    opacity: 1;
}

.canzone-play-icon {
    font-size: 2.5rem;
    color: var(--accent);
    animation: canzone-pulse 2s infinite;
}

.canzone-action {
    color: white;
    font-weight: 600;
    font-size: 1.1rem;
    letter-spacing: 0.5px;
}

.canzone-title {
    padding: 20px 24px;
    margin: 0;
    font-size: 1.3rem;
    font-weight: 600;
    color: var(--fg);
    border-top: 1px solid rgba(255,255,255,0.08);
}

.canzoni-no-songs {
    text-align: center;
    padding: 60px 20px;
    color: var(--muted);
}

.canzoni-no-songs p {
    font-size: 1.2rem;
    margin: 16px 0;
}

@keyframes canzone-pulse {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.1);
    }
}

/* --- TESTO PAGE --- */
.testo-header {
    text-align: center;
    margin-bottom: 40px;
}

.testo-title {
    font-size: 2.2rem;
    margin: 20px 0 16px 0;
    background: linear-gradient(135deg, var(--accent), #e6c878);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 700;
    line-height: 1.3;
}

.testo-info {
    display: flex;
    justify-content: center;
    gap: 24px;
    flex-wrap: wrap;
    margin-top: 16px;
}

.testo-info-item {
    background: rgba(255,255,255,0.05);
    padding: 8px 16px;
    border-radius: 20px;
    border: 1px solid rgba(255,255,255,0.1);
    font-size: 0.95rem;
    color: var(--muted);
}

.testo-content {
    max-width: 900px;
    margin: 0 auto;
}

.testo-box, .testo-pdf-box {
    background: var(--card);
    border: 1px solid rgba(255,255,255,0.06);
    border-radius: var(--radius);
    padding: 30px;
    margin-bottom: 30px;
    box-shadow: var(--shadow);
}

.testo-box h3, .testo-pdf-box h3 {
    color: var(--accent);
    margin: 0 0 20px 0;
    font-size: 1.4rem;
    font-weight: 600;
}

.testo-lyrics {
    font-size: 1.1rem;
    line-height: 1.8;
    color: var(--fg);
    white-space: pre-line;
}

.testo-pdf-embed {
    width: 100%;
    min-height: 600px;
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 8px;
    background: rgba(255,255,255,0.02);
}

/* --- TESTO PAGE - ERROR STATES --- */
.testo-not-available {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 60vh;
}

.testo-sorry-message {
    background: var(--card);
    border: 1px solid rgba(255,255,255,0.06);
    border-radius: var(--radius);
    padding: 40px 30px;
    text-align: center;
    max-width: 600px;
    box-shadow: var(--shadow);
}

.testo-sorry-message h2 {
    color: var(--accent);
    margin: 0 0 20px 0;
    font-size: 1.8rem;
}

.testo-sorry-message p {
    margin: 16px 0;
    line-height: 1.6;
    color: var(--muted);
    font-size: 1.1rem;
}

.testo-sorry-message strong {
    color: var(--fg);
}

.testo-coming-soon {
    margin: 30px 0;
    padding: 25px;
    background: rgba(212,179,108,0.05);
    border: 1px solid rgba(212,179,108,0.2);
    border-radius: 12px;
}

.testo-coming-soon h3 {
    color: var(--accent);
    margin: 0 0 15px 0;
    font-size: 1.3rem;
}

.testo-coming-soon ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.testo-coming-soon li {
    padding: 8px 0;
    color: var(--fg);
    font-size: 1rem;
}

.testo-contact-info {
    margin-top: 30px;
    padding-top: 25px;
    border-top: 1px solid rgba(255,255,255,0.1);
}

.testo-social-links {
    display: flex;
    justify-content: center;
    gap: 16px;
    margin-top: 16px;
}

.testo-social-link {
    display: inline-flex;
    align-items: center;
    padding: 10px 20px;
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 25px;
    color: var(--fg);
    text-decoration: none;
    transition: all 0.3s ease;
    font-weight: 500;
}

.testo-social-link:hover {
    background: rgba(255,255,255,0.1);
    transform: translateY(-2px);
}

.testo-social-link.facebook:hover {
    border-color: #1877f2;
    box-shadow: 0 5px 15px rgba(24,119,242,0.2);
}

.testo-social-link.instagram:hover {
    border-color: #e4405f;
    box-shadow: 0 5px 15px rgba(228,64,95,0.2);
}

.testo-not-found {
    text-align: center;
    padding: 60px 20px;
    min-height: 50vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.testo-not-found h1 {
    color: #ff6b6b;
    font-size: 2rem;
    margin-bottom: 20px;
}

.testo-not-found p {
    color: var(--muted);
    font-size: 1.2rem;
    margin-bottom: 30px;
}

/* --- FOOTER --- */
.orchestra-footer{max-width:var(--maxw); margin:52px auto 28px; padding:0 18px; color:var(--muted); font-size:.95rem}
.orchestra-fine{opacity:.7}

/* --- SONG PAGE STYLES --- */

/* Placeholder sections for song development */
.placeholder-section {
    background: rgba(255, 193, 7, 0.1);
    border: 2px dashed var(--accent);
    border-radius: var(--radius);
    padding: 30px;
    margin: 20px 0;
    text-align: center;
}

.placeholder-title {
    color: var(--accent);
    font-size: 1.3rem;
    font-weight: 600;
    margin-bottom: 10px;
}

.placeholder-text {
    color: var(--muted);
    font-size: 1rem;
    line-height: 1.6;
}

/* Lyrics sections */
.lyrics-section {
    background: var(--card);
    border-radius: var(--radius);
    /* padding: 40px; */
    padding: 10px;
    margin: 30px 0; 
    border: 1px solid rgba(255,255,255,0.08);
    box-shadow: var(--shadow);
}

.lyrics-title {
    color: var(--accent);
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 25px;
    text-align: center;
    padding-bottom: 15px;
    border-bottom: 2px solid rgba(255,193,7,0.3);
}

.lyrics-content {
    font-size: 1.1rem;
    line-height: 2;
    color: var(--fg);
    white-space: pre-line;
    font-family: 'Georgia', serif;
}

/* Verse and chorus styling */
.verse2 {
    margin-bottom: 25px;
    padding: 20px;
    /* background: rgba(255,255,255,0.02); */
    background: rgba(146, 90, 38, 0.02);
    border-radius: 8px;
    border-left: 4px solid var(--accent);
    /* font-size: 1.4rem; */
    font-size: 1.4rem;
    line-height: 1.8;
    color: var(--fg);
}

.chorus {
    background: rgba(255,193,7,0.05);
    color: var(--fg2);
    border-left-color: var(--accent);
    font-weight: 500;
    font-size: 1.5rem;
}

.bridge {
    background: rgba(138,43,226,0.05);
    border-left-color: #8a2be2;
    font-size: 1.4rem;
}

.instrumental {
    background: rgba(30,144,255,0.05);
    border-left-color: #1e90ff;
    font-style: italic;
    color: var(--muted);
}

/* Notes sections */
.notes-section {
    background: rgba(255,255,255,0.02);
    border-radius: var(--radius);
    padding: 25px;
    margin: 20px 0;
    border: 1px solid rgba(255,255,255,0.05);
}

.notes-title {
    color: var(--accent);
    font-size: 1.2rem;
    font-weight: 600;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Special tribute section for composers */
.morricone-tribute {
    background: linear-gradient(135deg, rgba(255,193,7,0.1), rgba(255,165,0,0.1));
    border: 1px solid rgba(255,193,7,0.3);
    padding: 25px;
    border-radius: var(--radius);
    margin: 25px 0;
    text-align: center;
}

.tribute-text {
    font-size: 1.1rem;
    color: var(--fg);
    font-style: italic;
    margin-bottom: 10px;
}

.tribute-signature {
    color: var(--accent);
    font-weight: 600;
    font-size: 0.9rem;
}

/* Fullscreen hint for mobile */
.fullscreen-hint {
    position: fixed;
    bottom: 20px;
    right: 20px;
    background: rgba(212,179,108,0.9);
    color: #1a1a1a;
    padding: 8px 12px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    z-index: 1000;
    animation: fadeInOut 4s ease-in-out;
    pointer-events: none;
}

@keyframes fadeInOut {
    0%, 100% { opacity: 0; transform: translateY(10px); }
    20%, 80% { opacity: 1; transform: translateY(0); }
}

/* --- RESPONSIVE DESIGN --- */

/* Mobile optimizations for slideshow */
@media (max-width: 480px) {
    .canzone-image-wrapper {
        height: 250px;
    }
    
    .canzone-number {
        font-size: 18px;
        padding: 6px 12px;
        top: 8px;
        left: 8px;
        min-width: 32px;
    }
    
    /* Song page mobile optimizations */
    .verse {
        font-size: 1.8rem;
        line-height: 2.2;
        padding: 30px 20px;
    }
    
    .chorus {
        font-size: 1.9rem;
        font-weight: 700;
    }
    
    .bridge {
        font-size: 1.8rem;
    }
    
    .fullscreen-hint {
        display: block;
    }
}

@media (min-width: 481px) and (max-width: 767px) {
    .canzone-image-wrapper {
        height: 300px;
    }
    
    .canzone-number {
        font-size: 20px;
        padding: 7px 14px;
        min-width: 36px;
    }
    
    /* Song page tablet optimizations */
    .verse {
        font-size: 1.6rem;
        line-height: 2;
        padding: 25px 20px;
    }
    
    .chorus {
        font-size: 1.7rem;
        font-weight: 600;
    }
    
    .bridge {
        font-size: 1.6rem;
    }
}

@media (min-width: 768px) {
    .canzone-image-wrapper {
        height: 350px;
    }
    
    .canzoni-page-title {
        font-size: 3rem;
    }
    
    .testo-title {
        font-size: 1.8rem;
    }
    
    .testo-info {
        gap: 12px;
    }
    
    .testo-info-item {
        font-size: 0.85rem;
        padding: 6px 12px;
    }
    
    .testo-sorry-message {
        padding: 30px 20px;
    }
    
    .testo-social-links {
        flex-direction: column;
        align-items: center;
    }
    
    /* Hide fullscreen hint on desktop */
    .fullscreen-hint {
        display: none;
    }
}

@media (min-width: 840px){
    .orchestra-header{padding:30px}
    .orchestra-logo{height:184px}
    .home-slides{height:min(74vh,620px)}
    .orchestra-card{padding:28px 32px}
}

@media (min-width: 1024px) {
    .canzone-image-wrapper {
        height: 400px;
    }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
    .home-slide{transition:none}
}

/* --- SONG NAVIGATION STYLES --- */
.song-navigation {
    background: var(--card);
    margin: 40px 0 0 0;
    padding: 30px 0;
    border-top: 1px solid rgba(255,255,255,0.1);
}

.nav-container {
    display: flex;
    gap: 20px;
    max-width: 800px;
    margin: 0 auto;
    padding: 0 20px;
}

.nav-button {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 20px;
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: var(--radius);
    color: var(--fg);
    text-decoration: none;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.nav-button:hover {
    background: rgba(255,255,255,0.1);
    border-color: var(--accent);
    transform: translateY(-2px);
}

.nav-button.prev-song::before {
    content: "←";
    position: absolute;
    top: 50%;
    left: 15px;
    transform: translateY(-50%);
    font-size: 20px;
    color: var(--accent);
}

.nav-button.next-song::after {
    content: "→";
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
    font-size: 20px;
    color: var(--accent);
}

.nav-button.back-to-list::before {
    content: "↑";
    position: absolute;
    top: 50%;
    left: 15px;
    transform: translateY(-50%);
    font-size: 20px;
    color: var(--accent);
}

.nav-label {
    font-size: 0.9rem;
    color: var(--muted);
    margin-bottom: 5px;
    font-weight: 500;
}

.nav-title {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--fg);
    text-align: center;
    line-height: 1.3;
}

.nav-number {
    font-size: 0.8rem;
    color: var(--accent);
    margin-top: 5px;
    font-weight: bold;
}

@media (max-width: 768px) {
    .nav-container {
        flex-direction: column;
        gap: 15px;
    }
    
    .nav-button {
        padding: 15px;
    }
    
    .nav-title {
        font-size: 1rem;
    }
}