/* ===== Lyrics Page — Non-Critical Styles (loaded deferred) ===== */

/* Lyrics content */
.lyrics{font-size:1.25rem;line-height:2;font-weight:500;color:var(--text)}@media(min-width:768px){.lyrics{font-size:1.5rem}}
.lyrics-line{margin-bottom:.5rem}
.chorus-box{background:#f5f7ff;border-left:4px solid var(--brand);padding:1.5rem;margin:2rem 0;font-style:italic;box-shadow:0 1px 2px 0 rgba(0,0,0,.05)}

/* Video section */
.video-section{margin-top:4rem}
.section-title{font-size:1.5rem;font-weight:700;margin-bottom:1.5rem;display:flex;align-items:center;gap:.75rem}
.icon-box{width:2rem;height:2rem;background:#fee2e2;color:#dc2626;display:flex;align-items:center;justify-content:center;border-radius:50%}
.icon-box svg{width:1rem;height:1rem}
.video-container{width:100%;aspect-ratio:16/9;border-radius:1rem;overflow:hidden;box-shadow:0 20px 25px -5px rgba(0,0,0,.1)}
.video-container iframe{width:100%;height:100%;border:none}

/* Sidebar card internals */
.card h3{margin-bottom:1rem;font-size:1.125rem;color:#111827;display:flex;align-items:center;gap:.5rem}
.card h3 svg{width:1.25rem;height:1.25rem;color:var(--brand)}
.detail-row{display:flex;justify-content:space-between;font-size:.875rem;margin-bottom:.75rem}
.detail-row:last-child{margin-bottom:0}
.detail-row dt{color:var(--text-muted);font-weight:600}
.detail-row dd{font-weight:700;text-align:right}

/* Link lists */
.link-list{list-style:none;display:flex;flex-direction:column;gap:.75rem}
.link-list li{border-bottom:1px solid var(--border);padding-bottom:.75rem}
.link-list li:last-child{border-bottom:none;padding-bottom:0}
.link-list a{display:flex;align-items:center;gap:.5rem;font-size:.875rem;font-weight:600;color:var(--text-muted)}
.link-list a:hover{color:var(--brand)}
.link-list a svg{width:1rem;height:1rem;flex-shrink:0;color:#9ca3af}

/* Tag cloud */
.tag-cloud{display:flex;flex-wrap:wrap;gap:.5rem}
.tag{background:var(--hover);color:var(--text-muted);padding:.25rem .75rem;border-radius:99px;font-size:.75rem;font-weight:600;border:1px solid var(--border)}
.tag:hover{background:var(--brand);color:var(--white);border-color:var(--brand)}

/* Footer */
.footer{background:#111827;color:#9ca3af;padding:4rem 1rem;margin-top:5rem}
.footer-grid{max-width:80rem;margin:0 auto;display:grid;grid-template-columns:1fr;gap:3rem}@media(min-width:768px){.footer-grid{grid-template-columns:2fr 1fr 1fr}}
.footer h4{color:var(--white);font-weight:700;margin-bottom:1rem;font-size:1rem}
.footer p{margin-top:1rem;max-width:24rem;font-size:.875rem;line-height:1.6}
.footer ul{list-style:none;display:flex;flex-direction:column;gap:.5rem;font-size:.875rem}
.footer ul a:hover{color:var(--white)}
.newsletter-form{display:flex;margin-top:1rem}
.newsletter-form input{flex:1;background:#1f2937;color:var(--white);border:none;padding:.5rem 1rem;border-radius:.5rem 0 0 .5rem;outline:0}
.newsletter-form input:focus{box-shadow:inset 0 0 0 2px var(--brand)}
.newsletter-form button{background:var(--brand);color:var(--white);border:none;padding:.5rem 1rem;border-radius:0 .5rem .5rem 0;cursor:pointer;transition:background .2s}
.newsletter-form button:hover{background:#4338ca}

/* Search dropdown (hidden until interaction) */
.search-results{position:absolute;top:100%;left:0;right:0;margin-top:.375rem;background:var(--white);border:1px solid var(--border);border-radius:.75rem;box-shadow:0 10px 25px rgba(0,0,0,.1);overflow:hidden;display:none;z-index:100}
.search-results--visible{display:block}
.search-result-item{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;font-size:.875rem;color:var(--text);transition:background .15s;text-decoration:none}
.search-result-item:hover,.search-result-item--highlighted{background:var(--hover)}
.search-result-item svg{width:1rem;height:1rem;flex-shrink:0;color:var(--text-muted)}
.search-result-item .result-title{font-weight:500}
.search-result-item .result-artist{font-size:.75rem;color:var(--text-muted)}
.search-all-link{display:block;text-align:center;padding:.625rem;font-size:.8125rem;font-weight:600;color:var(--brand);border-top:1px solid var(--border);transition:background .15s}
.search-all-link:hover{background:var(--hover)}
.search-no-results{padding:1rem;text-align:center;font-size:.875rem;color:var(--text-muted)}
