/* ============================================================
   OVY AYVU — shared design system
   ============================================================ */

:root{
  --black:#0a0a0a;
  --off-black:#141414;
  --card:#171717;
  --red:#c8102e;
  --red-dim:#8c0c20;
  --cream:#f2ede6;
  --cream-dim:#c9c2b6;
  --cream-faint:#8a847a;
  --line:rgba(242,237,230,0.14);
  --line-strong:rgba(242,237,230,0.28);
  --max:1180px;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--black);
  color:var(--cream);
  font-family:'Inter', sans-serif;
  font-weight:300;
  line-height:1.6;
  overflow-x:hidden;
}
::selection{background:var(--red); color:var(--cream);}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
ul{list-style:none;}

.wrap{max-width:var(--max); margin:0 auto; padding:0 28px;}

h1,h2,h3{font-family:'Fraunces', serif; font-weight:400; letter-spacing:-0.01em;}

.eyebrow{
  font-family:'Inter', sans-serif;
  font-size:0.72rem;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--red);
  font-weight:600;
  display:flex;
  align-items:center;
  gap:10px;
}
.eyebrow::before{content:""; width:26px; height:1px; background:var(--red); display:inline-block; flex-shrink:0;}
.eyebrow.no-line::before{display:none;}

/* ---------- NAV ---------- */
header{
  position:fixed; top:0; left:0; right:0; z-index:100;
  background:rgba(10,10,10,0.85);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
nav{
  max-width:var(--max); margin:0 auto; padding:18px 28px;
  display:flex; align-items:center; justify-content:space-between; gap:20px;
}
.logo{
  font-family:'Archivo Black', sans-serif;
  font-size:1.05rem;
  letter-spacing:0.02em;
  white-space:nowrap;
}
.logo .oa{color:var(--red);}
.navlinks{display:none; gap:28px; font-size:0.82rem; letter-spacing:0.02em; flex-wrap:wrap;}
.navlinks a{color:var(--cream-dim); transition:color .2s; white-space:nowrap;}
.navlinks a:hover, .navlinks a.active{color:var(--red);}
@media(min-width:920px){.navlinks{display:flex;}}
.navcta{
  border:1px solid var(--red); color:var(--red);
  padding:9px 16px; font-size:0.75rem; letter-spacing:0.05em;
  text-transform:uppercase; transition:all .2s; white-space:nowrap;
}
.navcta:hover{background:var(--red); color:var(--cream);}

/* mobile nav (simple horizontal scroll strip under header) */
.subnav{
  display:flex; gap:22px; overflow-x:auto; padding:14px 28px;
  border-bottom:1px solid var(--line);
  font-size:0.78rem; letter-spacing:0.04em; text-transform:uppercase;
  color:var(--cream-dim);
}
.subnav a.active{color:var(--red);}
@media(min-width:920px){.subnav{display:none;}}

main{padding-top:64px;}
.subnav + main, header + .subnav + main{padding-top:0;}

/* ---------- SECTION GENERIC ---------- */
section{padding:96px 0; position:relative;}
.section-head{margin-bottom:50px; max-width:720px;}
.section-head h1, .section-head h2{font-size:clamp(2rem, 4.5vw, 3.2rem); margin-top:16px;}
.section-head p{color:var(--cream-dim); margin-top:18px; font-size:1.02rem; max-width:600px;}
.divider{border-top:1px solid var(--line);}
.bg-alt{background:var(--off-black);}

/* ---------- PAGE HERO (interior pages) ---------- */
.page-hero{padding:150px 0 60px; border-bottom:1px solid var(--line);}
.page-hero h1{font-size:clamp(2.4rem, 6vw, 4.2rem); margin:18px 0 22px; line-height:1.02;}
.page-hero p{color:var(--cream-dim); max-width:640px; font-size:1.05rem;}

/* ---------- ARTIST HERO (foto grande, sangria até a borda) ---------- */
.artist-hero{position:relative; overflow:hidden;}
.artist-hero .wrap{position:relative; z-index:2;}
.artist-hero-photo{display:none;}
.artist-hero.has-photo{padding-bottom:0;}
.artist-hero.has-photo .wrap{
  min-height:86vh; display:flex; flex-direction:column; justify-content:center;
  padding-top:150px; padding-bottom:64px;
}
.artist-hero.has-photo h1{
  max-width:56%;
}
.artist-hero.has-photo .artist-hero-photo{
  display:block; position:absolute; top:0; right:0; bottom:0; width:36%; z-index:1;
  background:var(--off-black);
}
.artist-hero.has-photo .artist-hero-photo img{
  width:100%; height:100%; object-fit:cover; object-position:50% 18%; display:block; filter:saturate(0.92) contrast(1.03);
}
.artist-hero.has-photo .artist-hero-photo::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(90deg, var(--black) 0%, rgba(10,10,10,0.15) 26%, rgba(10,10,10,0) 46%);
}
.artist-hero.has-photo .artist-hero-photo::before{
  content:""; position:absolute; inset:0; z-index:2;
  background:linear-gradient(0deg, rgba(10,10,10,0.55) 0%, rgba(10,10,10,0) 30%);
}
@media(max-width:860px){
  .artist-hero.has-photo{display:flex; flex-direction:column; padding-top:0; padding-bottom:0;}
  .artist-hero.has-photo .wrap{min-height:auto; padding-top:36px; padding-bottom:32px;}
  .artist-hero.has-photo h1{max-width:100%;}
  .artist-hero.has-photo .artist-hero-photo{
    position:relative; width:100%; height:62vh; order:-1; margin-bottom:0;
    top:auto; right:auto; bottom:auto;
  }
}
.breadcrumb{
  font-size:0.75rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--cream-faint);
  margin-bottom:18px; display:flex; gap:8px; flex-wrap:wrap;
}
.breadcrumb a{color:var(--cream-dim);}
.breadcrumb a:hover{color:var(--red);}

/* ---------- BUTTONS ---------- */
.btn{
  display:inline-block; padding:15px 30px; font-size:0.82rem;
  letter-spacing:0.08em; text-transform:uppercase; transition:all .25s; border:1px solid transparent;
}
.btn-primary{background:var(--red); color:var(--cream);}
.btn-primary:hover{background:#a30d26;}
.btn-ghost{border:1px solid var(--line); color:var(--cream);}
.btn-ghost:hover{border-color:var(--red); color:var(--red);}
.btn-sm{padding:10px 20px; font-size:0.72rem;}
.btn[disabled], .btn.disabled{opacity:0.35; pointer-events:none;}
.btn-row{display:flex; gap:14px; flex-wrap:wrap;}

/* ---------- TAGS / BADGES ---------- */
.tag{
  font-family:'Inter',sans-serif; font-size:0.65rem; letter-spacing:0.1em;
  text-transform:uppercase; padding:3px 9px; border-radius:100px;
  border:1px solid var(--red); color:var(--red); display:inline-block; white-space:nowrap;
}
.tag.done{color:var(--cream-dim); border-color:var(--line);}
.tag.upcoming{color:var(--black); background:var(--red); border-color:var(--red);}
.tag-line{
  font-size:0.62rem; letter-spacing:0.08em; text-transform:uppercase;
  color:var(--cream-faint); border:1px solid var(--line); padding:3px 8px; border-radius:3px;
}

/* ---------- CARD GRID (hub pages) ---------- */
.card-grid{display:grid; grid-template-columns:1fr; gap:1px; background:var(--line); border:1px solid var(--line);}
@media(min-width:640px){.card-grid.cols-2{grid-template-columns:repeat(2,1fr);}}
@media(min-width:860px){.card-grid.cols-3{grid-template-columns:repeat(3,1fr);}}
.card{
  background:var(--black); padding:32px 28px; transition:background .25s;
  display:flex; flex-direction:column; gap:14px;
}
.card:hover{background:var(--off-black);}
.card .card-media{
  aspect-ratio:4/3; background:linear-gradient(135deg, var(--off-black), var(--card));
  border:1px solid var(--line); display:flex; align-items:center; justify-content:center;
  position:relative; overflow:hidden;
}
.card .card-media img{width:100%; height:100%; object-fit:cover;}
.card .card-media .mono{
  font-family:'Archivo Black',sans-serif; font-size:2.4rem; color:rgba(242,237,230,0.08);
}
.card h3{font-size:1.4rem; font-weight:400;}
.card .meta{font-size:0.82rem; color:var(--cream-dim);}
.card .top-row{display:flex; justify-content:space-between; align-items:flex-start; gap:10px;}

/* ---------- ARTIST / EVENT ROW LIST ---------- */
.row-list{margin-top:10px;}
.row-item{
  display:flex; align-items:baseline; justify-content:space-between; gap:20px;
  padding:24px 0; border-bottom:1px solid var(--line); transition:padding-left .25s;
}
.row-item:first-child{border-top:1px solid var(--line);}
.row-item:hover{padding-left:14px; border-bottom-color:var(--red);}
.row-name{
  font-family:'Fraunces', serif; font-size:clamp(1.2rem, 2.6vw, 1.7rem);
  display:flex; align-items:baseline; gap:14px; flex-wrap:wrap;
}
.row-meta{font-size:0.82rem; color:var(--cream-dim); text-align:right; white-space:nowrap;}

/* ---------- NEXT / HIGHLIGHT BANNER ---------- */
.next-banner{
  border:1px solid var(--red); padding:28px 34px; margin:44px 0 0;
  display:flex; flex-wrap:wrap; gap:18px; align-items:center; justify-content:space-between;
}
.next-banner h3{font-size:1.4rem; font-weight:400;}
.next-banner .date{font-family:'Fraunces',serif; font-style:italic; color:var(--red); font-size:1.05rem;}

/* ---------- THREE FRENTES (home) ---------- */
.frentes-grid{display:grid; grid-template-columns:1fr; gap:1px; background:var(--line); border:1px solid var(--line); margin-top:50px;}
@media(min-width:860px){.frentes-grid{grid-template-columns:repeat(3,1fr);}}
.frente-card{background:var(--black); padding:38px 32px; display:flex; flex-direction:column; gap:16px; transition:background .25s;}
.frente-card:hover{background:var(--off-black);}
.frente-card .num{font-family:'Fraunces',serif; font-style:italic; color:var(--red); font-size:1.3rem;}
.frente-card h3{font-size:1.5rem; font-weight:400;}
.frente-card p{color:var(--cream-dim); font-size:0.92rem; flex-grow:1;}
.frente-card .go{font-size:0.75rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--red);}

/* ---------- STATS ---------- */
.stats-row{display:grid; grid-template-columns:repeat(2,1fr); gap:24px; margin-top:56px;}
@media(min-width:640px){.stats-row{grid-template-columns:repeat(4,1fr);}}
.stat{border-top:1px solid var(--line); padding-top:16px;}
.stat .n{font-family:'Fraunces',serif; font-size:2.2rem; color:var(--red); line-height:1;}
.stat .l{font-size:0.76rem; color:var(--cream-dim); margin-top:8px;}

/* ---------- ARTIST / EVENT DETAIL PAGE ---------- */
.detail-grid{display:grid; grid-template-columns:1fr; gap:48px;}
@media(min-width:900px){.detail-grid{grid-template-columns:1.15fr 0.85fr;}}
.media-block{
  aspect-ratio:16/10; background:linear-gradient(135deg, var(--off-black), var(--card));
  border:1px solid var(--line); display:flex; align-items:center; justify-content:center;
  position:relative; overflow:hidden; margin-bottom:20px;
}
.media-block .mono{font-family:'Archivo Black',sans-serif; font-size:4rem; color:rgba(242,237,230,0.06);}
.media-block iframe, .media-block video, .media-block img{width:100%; height:100%; object-fit:cover; border:none;}
.media-note{font-size:0.78rem; color:var(--cream-faint); font-style:italic;}

.gallery-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:20px;}
.gallery-grid .g-item{
  aspect-ratio:1; background:var(--off-black); border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center;
}
.gallery-grid .g-item .mono{font-family:'Archivo Black',sans-serif; font-size:1.2rem; color:rgba(242,237,230,0.08);}
.gallery-grid img{width:100%; height:100%; object-fit:cover; cursor:pointer; transition:opacity .2s ease;}
.gallery-grid img:hover{opacity:0.82;}

/* -------- lightbox -------- */
.lightbox-overlay{
  position:fixed; inset:0; background:rgba(10,10,10,0.96); z-index:1000;
  display:flex; align-items:center; justify-content:center;
  opacity:0; visibility:hidden; transition:opacity .25s ease;
}
.lightbox-overlay.open{opacity:1; visibility:visible;}
.lightbox-overlay .lightbox-img{max-width:88vw; max-height:86vh; object-fit:contain; box-shadow:0 20px 60px rgba(0,0,0,0.6);}
.lightbox-close, .lightbox-prev, .lightbox-next{
  position:absolute; background:rgba(10,10,10,0.6); border:1px solid var(--line-strong); color:var(--cream);
  cursor:pointer; font-family:'Inter',sans-serif; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
}
.lightbox-close:hover, .lightbox-prev:hover, .lightbox-next:hover{border-color:var(--red); color:var(--red);}
.lightbox-close{top:24px; right:24px; width:44px; height:44px; font-size:1.6rem; line-height:1;}
.lightbox-prev, .lightbox-next{top:50%; transform:translateY(-50%); width:52px; height:52px; font-size:1.8rem;}
.lightbox-prev{left:24px;}
.lightbox-next{right:24px;}
.lightbox-counter{
  position:absolute; bottom:22px; left:50%; transform:translateX(-50%);
  font-size:0.78rem; color:var(--cream-faint); letter-spacing:0.05em;
}
@media (max-width:640px){
  .lightbox-prev, .lightbox-next{width:40px; height:40px; font-size:1.4rem;}
  .lightbox-close{top:12px; right:12px;}
  .lightbox-prev{left:8px;} .lightbox-next{right:8px;}
}

/* ---------- MÚSICOS: link + modal de mini bio ---------- */
.musicos-list{display:flex; flex-direction:column;}
.musico-link{
  display:block; width:100%; text-align:left; background:none; border:none; cursor:pointer;
  font-family:'Inter',sans-serif; color:var(--cream); font-size:0.92rem; padding:7px 0;
  border-bottom:1px solid var(--line); transition:color .2s, padding-left .2s;
}
.musico-link:last-child{border-bottom:none;}
.musico-link:hover{color:var(--red); padding-left:6px;}
.musico-inst{color:var(--cream-faint); font-size:0.85rem;}

.musico-overlay{
  position:fixed; inset:0; background:rgba(10,10,10,0.88); z-index:1000;
  display:flex; align-items:center; justify-content:center; padding:24px;
  opacity:0; visibility:hidden; transition:opacity .25s ease;
}
.musico-overlay.open{opacity:1; visibility:visible;}
.musico-card{
  background:var(--off-black); border:1px solid var(--line-strong); max-width:440px; width:100%;
  display:flex; flex-direction:column; position:relative; overflow:hidden;
  max-height:86vh; overflow-y:auto;
}
.musico-photo{
  aspect-ratio:4/3; background:var(--card); display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.musico-photo img{width:100%; height:100%; object-fit:cover; display:block;}
.musico-photo .mono{font-family:'Archivo Black',sans-serif; font-size:3rem; color:rgba(242,237,230,0.08);}
.musico-info{padding:28px 30px 32px;}
.musico-inst-tag{font-size:0.72rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--red); margin-bottom:8px; min-height:1em;}
.musico-nome{font-family:'Fraunces',serif; font-size:1.5rem; font-weight:400; margin-bottom:12px;}
.musico-bio{font-size:0.9rem; color:var(--cream-dim); line-height:1.6;}
.musico-bio.empty{color:var(--cream-faint); font-style:italic;}
.musico-close{
  position:absolute; top:14px; right:14px; width:36px; height:36px; border-radius:50%;
  background:rgba(10,10,10,0.55); border:1px solid var(--line-strong); color:var(--cream);
  cursor:pointer; font-size:1.3rem; line-height:1; display:flex; align-items:center; justify-content:center; z-index:2;
}
.musico-close:hover{border-color:var(--red); color:var(--red);}

.info-panel{background:var(--off-black); border:1px solid var(--line); padding:32px;}
.info-panel h4{
  font-size:0.78rem; text-transform:uppercase; letter-spacing:0.1em; color:var(--red);
  font-family:'Inter',sans-serif; margin-bottom:18px;
}
.info-panel + .info-panel{margin-top:24px;}
.appearance-item{padding:14px 0; border-bottom:1px solid var(--line); font-size:0.88rem;}
.appearance-item:last-child{border-bottom:none; padding-bottom:0;}
.appearance-item:first-child{padding-top:0;}
.appearance-item .a-label{color:var(--cream); display:block; margin-bottom:4px;}
.appearance-item .a-date{color:var(--cream-dim); font-size:0.78rem;}
.credit-row{display:flex; justify-content:space-between; gap:12px; padding:10px 0; border-bottom:1px solid var(--line); font-size:0.85rem;}
.credit-row:last-child{border-bottom:none;}
.credit-row .k{color:var(--cream-faint);}

.bio-text{color:var(--cream-dim); font-size:1.02rem; max-width:640px;}
.bio-text.empty{font-style:italic; color:var(--cream-faint);}

.lineup-grid{display:grid; grid-template-columns:1fr; gap:1px; background:var(--line); border:1px solid var(--line); margin-top:24px;}
@media(min-width:640px){.lineup-grid{grid-template-columns:repeat(2,1fr);}}
.lineup-item{background:var(--black); padding:20px 24px; display:flex; align-items:center; justify-content:space-between; transition:background .2s;}
.lineup-item:hover{background:var(--off-black);}
.lineup-item a{font-family:'Fraunces',serif; font-size:1.05rem; font-style:italic;}
.lineup-item a:hover{color:var(--red);}

/* ---------- CONTATO ---------- */
.contato-inner{display:grid; grid-template-columns:1fr; gap:56px;}
@media(min-width:860px){.contato-inner{grid-template-columns:1fr 1fr;}}
.contato-big{font-family:'Fraunces', serif; font-size:clamp(1.8rem, 4.5vw, 3rem); line-height:1.15;}
.contato-big em{font-style:italic; color:var(--red);}
.contact-list{margin-top:30px;}
.contact-item{display:flex; align-items:center; justify-content:space-between; padding:20px 0; border-bottom:1px solid var(--line);}
.contact-item .k{font-size:0.72rem; letter-spacing:0.15em; text-transform:uppercase; color:var(--cream-dim);}
.contact-item .v{font-family:'Fraunces',serif; font-size:1.1rem; font-style:italic; transition:color .2s;}
.contact-item a.v:hover{color:var(--red);}

/* ---------- FOOTER ---------- */
footer{border-top:1px solid var(--line); padding:36px 0; margin-top:0;}
.footer-inner{display:flex; flex-wrap:wrap; justify-content:space-between; gap:16px; font-size:0.76rem; color:var(--cream-dim);}
.footer-inner .logo{font-size:0.9rem;}
.footer-links{display:flex; gap:18px;}
.footer-links a:hover{color:var(--red);}

/* ---------- MISC ---------- */
.empty-state{
  border:1px dashed var(--line); padding:40px; text-align:center;
  color:var(--cream-faint); font-style:italic; font-size:0.92rem;
}
.reveal{transition:opacity .7s ease, transform .7s ease;}
.reveal.reveal-init{opacity:0; transform:translateY(24px);}
.reveal.reveal-init.in{opacity:1; transform:translateY(0);}

.hero-bg-mono{
  position:absolute; top:0; left:50%; transform:translateX(-50%);
  font-family:'Archivo Black', sans-serif; font-size:min(50vw, 560px); line-height:1;
  color:transparent; -webkit-text-stroke:1px rgba(242,237,230,0.05);
  z-index:0; pointer-events:none; user-select:none; white-space:nowrap; top:-4vw;
}