/* BASE85 · propuesta de rediseño (prototipo)
   Identidad respetada: rojo #E72600, negro, blanco, logo itálico, tipografía grotesca (Acumin Pro en la web real; aquí Archivo como sustituto libre),
   y el "badge" negro inclinado del contador de streams como recurso gráfico. */
:root{
  --red:#e72600; --red-d:#c92000; --ink:#0a0a0a; --white:#fff; --paper:#f6f3ef; --muted:#6b6b6b; --line:#ffffff33;
  --f:"Archivo",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --gutter:clamp(16px,4vw,56px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{font:400 16px/1.55 var(--f);color:var(--ink);background:var(--red);-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
.wrap{width:min(1320px,100% - 2*var(--gutter));margin-inline:auto}
.up{text-transform:uppercase}
.k{font-stretch:88%;font-weight:900;letter-spacing:-.01em;text-transform:uppercase;line-height:.92}
.eyebrow{font:700 12px/1 var(--f);letter-spacing:.16em;text-transform:uppercase}
.badge{display:inline-flex;align-items:center;gap:10px;background:var(--ink);color:#fff;padding:9px 18px 9px 16px;transform:skewX(-12deg);font-style:italic;font-weight:800}
.badge>*{transform:skewX(12deg)}
.btn{display:inline-flex;align-items:center;gap:10px;font:800 13px/1 var(--f);letter-spacing:.08em;text-transform:uppercase;padding:15px 22px;border-radius:999px;background:var(--ink);color:#fff;border:2px solid var(--ink);transition:.2s}
.btn:hover{background:transparent;color:var(--ink)}
.btn.w{background:#fff;color:var(--ink);border-color:#fff}
.btn.w:hover{background:transparent;color:#fff}
.btn.o{background:transparent;color:#fff;border-color:#fff}
.btn.o:hover{background:#fff;color:var(--ink)}
.arrow::after{content:"→";font-weight:400}

/* ===== Header ===== */
.hdr{position:sticky;top:0;z-index:50;background:var(--red);border-bottom:1px solid var(--line);transition:background .2s}
.hdr .wrap{display:flex;align-items:center;gap:28px;height:72px}
.hdr .logo img{height:34px;width:auto}
.hdr nav{display:flex;gap:22px;margin-left:12px}
.hdr nav a{font:700 13px/1 var(--f);letter-spacing:.06em;text-transform:uppercase;color:#fff;opacity:.9;padding:6px 0;border-bottom:2px solid transparent}
.hdr nav a:hover,.hdr nav a.on{opacity:1;border-color:#fff}
.hdr .right{margin-left:auto;display:flex;align-items:center;gap:16px}
.hdr .lang{font:700 12px var(--f);color:#fff;letter-spacing:.06em}
.hdr .lang b{text-decoration:underline;text-underline-offset:4px}
.hdr .count{font-size:15px}
.hdr .count small{display:block;font:700 9px/1 var(--f);letter-spacing:.14em;color:var(--red);font-style:italic}
.hdr .count span{display:block}
.hdr .count .num{font-variant-numeric:tabular-nums}
.burger{display:none;background:none;border:0;color:#fff;font-size:26px;cursor:pointer}
@media (max-width:1180px){.hdr nav{gap:16px}.hdr nav a{font-size:12px}}
@media (max-width:1040px){.hdr nav{display:none}.burger{display:block}.hdr.open nav{display:flex;position:absolute;top:72px;left:0;right:0;flex-direction:column;background:var(--ink);padding:20px var(--gutter);gap:4px;margin:0}.hdr.open nav a{padding:12px 0;font-size:16px}}
@media (max-width:560px){.hdr .count small{display:none}.hdr .count{font-size:13px;padding:7px 12px}.hdr .lang{display:none}.hdr .logo img{height:28px}}

/* ===== Hero ===== */
.hero{color:#fff;padding:clamp(48px,8vw,110px) 0 0;overflow:hidden}
.hero .eyebrow{opacity:.85;margin-bottom:22px;display:block}
.hero h1{font-size:clamp(46px,9.4vw,150px)}
.hero h1 em{font-style:italic;-webkit-text-stroke:2px #fff;color:transparent}
.hero .lead{max-width:640px;font-size:clamp(17px,1.6vw,21px);line-height:1.45;margin:28px 0 34px;opacity:.95}
.hero .ctas{display:flex;flex-wrap:wrap;gap:12px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);margin-top:clamp(48px,7vw,90px)}
.stats>div{padding:26px 22px 30px 0;border-right:1px solid var(--line)}
.stats>div+div{padding-left:22px}
.stats>div:last-child{border-right:0}
.stats b{display:block;font:900 clamp(36px,4.6vw,64px)/1 var(--f);font-stretch:88%;font-style:italic}
.stats span{font:600 13px/1.3 var(--f);letter-spacing:.04em;text-transform:uppercase;opacity:.85}
@media (max-width:760px){.stats{grid-template-columns:1fr 1fr}.stats>div:nth-child(2){border-right:0}.stats>div:nth-child(3){padding-left:0}.stats>div:nth-child(n+3){border-top:1px solid var(--line)}}

/* marquee de nombres */
.marquee{background:var(--ink);color:#fff;overflow:hidden;white-space:nowrap;padding:16px 0;transform:skewY(-1.2deg);margin:40px 0 -10px}
.marquee .track{display:inline-flex;gap:40px;animation:mq 30s linear infinite;font:900 28px/1 var(--f);font-stretch:88%;font-style:italic;text-transform:uppercase}
.marquee .track span::after{content:"✦";margin-left:40px;color:var(--red);font-style:normal}
@keyframes mq{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marquee .track{animation:none}}

/* ===== Secciones ===== */
.sec{padding:clamp(70px,9vw,120px) 0}
.sec.paper{background:var(--paper)}
.sec.black{background:var(--ink);color:#fff}
.sec.white{background:#fff}
.shead{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:clamp(30px,4vw,50px);flex-wrap:wrap}
.shead h2{font-size:clamp(40px,6.4vw,92px)}
.shead p{max-width:440px;color:var(--muted)}
.black .shead p{color:#ffffffb3}
.shead .eyebrow{display:block;margin-bottom:12px;color:var(--red)}

/* ===== Roster ===== */
.roster{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.artist{position:relative;display:block;aspect-ratio:3/4;overflow:hidden;background:var(--red);color:#fff;isolation:isolate}
.artist img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.1);mix-blend-mode:multiply;transition:filter .5s,transform .6s,mix-blend-mode .5s}
.artist::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 45%,#000000c0);z-index:1}
.artist:hover img{filter:none;mix-blend-mode:normal;transform:scale(1.04)}
.artist .info{position:absolute;left:18px;right:18px;bottom:18px;z-index:2}
.artist h3{font-size:clamp(28px,2.8vw,40px)}
.artist .meta{display:flex;justify-content:space-between;align-items:center;margin-top:10px;font:600 12px/1 var(--f);letter-spacing:.08em;text-transform:uppercase}
.artist .meta i{font-style:normal;opacity:0;transform:translateX(-8px);transition:.3s}
.artist:hover .meta i{opacity:1;transform:none}
.artist .tag{position:absolute;top:16px;left:16px;z-index:2}
.artist .tag .badge{font-size:11px;padding:6px 12px;letter-spacing:.08em}
@media (max-width:1000px){.roster{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.roster{gap:10px}.artist .info{left:12px;right:12px;bottom:12px}}

/* ===== Productores ===== */
.prod{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(30px,5vw,70px);align-items:center}
.prod .img{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--red)}
.prod .img img{width:100%;height:100%;object-fit:cover}
.prod .img .badge{position:absolute;left:18px;bottom:18px;background:var(--red)}
.prod h3{font-size:clamp(34px,4vw,56px);margin:10px 0 18px}
.prod p{color:#ffffffcc;margin-bottom:14px}
.big{display:flex;gap:36px;margin:28px 0;flex-wrap:wrap}
.big b{display:block;font:900 clamp(40px,4.4vw,60px)/1 var(--f);font-stretch:88%;font-style:italic;color:var(--red)}
.big span{font:600 12px/1.3 var(--f);letter-spacing:.06em;text-transform:uppercase;color:#ffffffb3}
.credits{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 30px}
.credits span{border:1px solid #ffffff40;border-radius:999px;padding:7px 13px;font:600 13px/1 var(--f)}
@media (max-width:900px){.prod{grid-template-columns:1fr}}

/* ===== Lanzamientos ===== */
.rail{display:grid;grid-auto-flow:column;grid-auto-columns:clamp(200px,22vw,280px);gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:18px;scrollbar-width:thin}
.rel{scroll-snap-align:start}
.rel .cover{position:relative;aspect-ratio:1;overflow:hidden;background:#e8e3dc;margin-bottom:12px}
.rel .cover img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.rel:hover .cover img{transform:scale(1.05)}
.rel .play{position:absolute;right:12px;bottom:12px;width:46px;height:46px;border-radius:50%;background:var(--red);color:#fff;display:grid;place-items:center;font-size:16px;opacity:0;transform:translateY(8px);transition:.3s}
.rel:hover .play{opacity:1;transform:none}
.rel h3{font:800 18px/1.15 var(--f);text-transform:uppercase;font-stretch:92%}
.rel p{font-size:14px;color:var(--muted)}
.rel .new{position:absolute;top:10px;left:10px}
.rel .new .badge{font-size:10px;padding:5px 10px;background:var(--red)}
.railnav{display:flex;gap:8px}
.railnav button{width:46px;height:46px;border-radius:50%;border:2px solid var(--ink);background:none;font-size:18px;cursor:pointer}
.railnav button:hover{background:var(--ink);color:#fff}

/* ===== Agenda ===== */
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:26px}
.tabs button{font:700 13px/1 var(--f);letter-spacing:.06em;text-transform:uppercase;padding:11px 16px;border-radius:999px;border:2px solid #fff;background:none;color:#fff;cursor:pointer}
.tabs button.on{background:#fff;color:var(--red)}
.gigs{border-top:2px solid #fff}
.gig{display:grid;grid-template-columns:120px 1.2fr 1fr 1fr auto;gap:20px;align-items:center;padding:20px 0;border-bottom:1px solid var(--line);color:#fff}
.gig .d{font:900 30px/1 var(--f);font-stretch:88%;font-style:italic}
.gig .d small{display:block;font:700 12px/1.2 var(--f);font-style:normal;letter-spacing:.1em;opacity:.85}
.gig .a{font:800 18px/1.2 var(--f);text-transform:uppercase}
.gig .c,.gig .v{font-size:15px;opacity:.95}
.gig .btn{padding:12px 18px;font-size:12px}
.gig .btn.sold{background:transparent;border-color:#ffffff66;color:#ffffffaa;pointer-events:none}
.edit{display:inline-block;background:#ffe14d;color:var(--ink);font:700 11px/1.3 var(--f);padding:2px 6px;border-radius:3px;font-style:normal;letter-spacing:0;vertical-align:middle}
.empty{padding:30px 0;color:#fff;opacity:.9}
@media (max-width:820px){.gig{grid-template-columns:84px 1fr auto;row-gap:4px}.gig .c{grid-column:2}.gig .v{grid-column:2;grid-row:3;font-size:13px}.gig .btn{grid-column:3;grid-row:1/4}.gig .a{grid-column:2;grid-row:1}.gig .d{grid-row:1/4}}

/* ===== Qué hacemos ===== */
.svc{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#0000001a;border:1px solid #0000001a}
.svc a{background:#fff;padding:34px 30px 30px;min-height:230px;display:flex;flex-direction:column;transition:.25s}
.svc a:hover{background:var(--ink);color:#fff}
.svc .n{font:900 15px/1 var(--f);font-style:italic;color:var(--red)}
.svc h3{font:900 28px/1 var(--f);font-stretch:88%;text-transform:uppercase;margin:18px 0 10px}
.svc p{color:var(--muted);font-size:15px;flex:1}
.svc a:hover p{color:#ffffffb3}
.svc .go{font:800 12px/1 var(--f);letter-spacing:.08em;text-transform:uppercase;margin-top:18px}
@media (max-width:900px){.svc{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.svc{grid-template-columns:1fr}.svc a{min-height:0}}

/* ===== Noticias ===== */
.news{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:24px}
.post .img{aspect-ratio:16/10;overflow:hidden;background:#e8e3dc;margin-bottom:16px}
.post .img img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.post:hover .img img{transform:scale(1.04)}
.post .eyebrow{color:var(--red);font-size:11px}
.post h3{font:800 22px/1.15 var(--f);margin:10px 0 8px}
.post:first-child h3{font-size:clamp(24px,2.4vw,32px)}
.post p{color:var(--muted);font-size:15px}
@media (max-width:900px){.news{grid-template-columns:1fr 1fr}.post:first-child{grid-column:1/-1}}
@media (max-width:560px){.news{grid-template-columns:1fr}}

/* ===== Nosotros ===== */
.about{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,6vw,90px);color:#fff}
.about h2{font-size:clamp(38px,5.4vw,76px)}
.about p{font-size:18px;line-height:1.55;margin-bottom:16px;opacity:.95}
.about .founders{display:flex;gap:28px;margin-top:26px;flex-wrap:wrap}
.about .founders b{display:block;font:800 18px/1.2 var(--f);text-transform:uppercase}
.about .founders span{font-size:13px;opacity:.8}
@media (max-width:900px){.about{grid-template-columns:1fr}}

/* ===== Contacto ===== */
.contact{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,80px)}
.cards{display:grid;gap:12px}
.card{display:grid;grid-template-columns:1fr auto;align-items:center;gap:12px;padding:22px 24px;border:2px solid var(--ink);transition:.2s}
.card:hover{background:var(--ink);color:#fff}
.card small{display:block;font:700 11px/1 var(--f);letter-spacing:.14em;text-transform:uppercase;color:var(--red);margin-bottom:8px}
.card b{font:800 20px/1.2 var(--f)}
.card span{display:block;font-size:14px;color:var(--muted)}
.card:hover span{color:#ffffffb3}
.card i{font-style:normal;font-size:22px}
.demo{background:var(--red);color:#fff;padding:clamp(28px,4vw,44px)}
.demo h3{font-size:clamp(30px,3.4vw,46px);margin:12px 0}
.demo p{opacity:.95;margin-bottom:22px}
.addr{margin-top:22px;font-size:14px;color:var(--muted)}
@media (max-width:900px){.contact{grid-template-columns:1fr}}

/* ===== Newsletter ===== */
.nl{background:var(--ink);color:#fff;padding:clamp(50px,6vw,80px) 0}
.nl .wrap{display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:center}
.nl h2{font-size:clamp(32px,4.2vw,58px)}
.nl h2 em{color:var(--red);font-style:italic}
.nl form{display:grid;gap:10px}
.nl .row1{display:flex;gap:8px;background:#fff;border-radius:999px;padding:6px}
.nl input[type=email]{flex:1;min-width:0;border:0;outline:0;font:500 16px var(--f);padding:0 16px;background:transparent}
.nl .btn{background:var(--red);border-color:var(--red)}
.nl .btn:hover{background:var(--ink);color:#fff}
.nl label{display:flex;gap:8px;align-items:center;font-size:13px;opacity:.85}
.nl label a{text-decoration:underline}
.nl label input{accent-color:var(--red)}
@media (max-width:820px){.nl .wrap{grid-template-columns:1fr}}

/* ===== Footer ===== */
footer{background:var(--red);color:#fff;padding:60px 0 30px}
footer .top{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:30px}
footer .logo img{height:58px;width:auto;margin-bottom:16px}
footer h4{font:800 12px/1 var(--f);letter-spacing:.14em;text-transform:uppercase;margin-bottom:14px;opacity:.75}
footer ul{list-style:none;display:grid;gap:8px;font-size:15px}
footer a:hover{text-decoration:underline}
.social{display:flex;gap:10px;margin-top:6px}
.social a{width:40px;height:40px;border-radius:50%;border:1.5px solid #fff;display:grid;place-items:center;font:800 12px var(--f)}
.social a:hover{background:#fff;color:var(--red);text-decoration:none}
footer .bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:50px;padding-top:20px;border-top:1px solid var(--line);font-size:13px;opacity:.85}
@media (max-width:820px){footer .top{grid-template-columns:1fr 1fr}}

/* ===== Página de artista ===== */
.ahero{position:relative;min-height:min(88vh,860px);display:flex;align-items:flex-end;color:#fff;overflow:hidden;background:var(--ink)}
.ahero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 25%}
.ahero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#0000 35%,#000000d0),linear-gradient(90deg,#e7260055,#0000 60%)}
.ahero .wrap{position:relative;z-index:1;padding:0 0 clamp(40px,6vw,70px)}
.ahero h1{font-size:clamp(64px,13vw,210px)}
.ahero .row{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:22px}
.crumbs{font:700 12px/1 var(--f);letter-spacing:.12em;text-transform:uppercase;margin-bottom:18px;opacity:.9}
.crumbs a:hover{text-decoration:underline}
.astats{background:var(--red);color:#fff}
.astats .stats{margin-top:0;border-top:0}
.bio{display:grid;grid-template-columns:1fr 340px;gap:clamp(30px,5vw,80px)}
.bio .text p{font-size:18px;line-height:1.65;margin-bottom:18px}
.bio .text p:first-child{font-size:clamp(21px,2vw,26px);line-height:1.4;font-weight:600}
.bio .more{display:none}
.bio.open .more{display:block}
.bio .toggle{background:none;border:0;font:800 13px/1 var(--f);letter-spacing:.08em;text-transform:uppercase;border-bottom:2px solid;padding:6px 0;cursor:pointer;margin-top:4px}
.side{display:grid;gap:14px;align-content:start;position:sticky;top:96px}
.side .box{border:2px solid var(--ink);padding:22px}
.side .box small{display:block;font:700 11px/1 var(--f);letter-spacing:.14em;text-transform:uppercase;color:var(--red);margin-bottom:10px}
.side .box b{display:block;font:800 18px/1.2 var(--f)}
.side .box a{display:block;margin-top:6px;text-decoration:underline}
.side .btn{justify-content:center}
.timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:#ffffff26}
.timeline div{background:var(--ink);padding:26px 22px}
.timeline b{display:block;font:900 34px/1 var(--f);font-style:italic;color:var(--red);font-stretch:88%}
.timeline h4{font:800 17px/1.2 var(--f);text-transform:uppercase;margin:12px 0 6px}
.timeline p{font-size:14px;color:#ffffffb3}
@media (max-width:900px){.bio{grid-template-columns:1fr}.side{position:static}.timeline{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.timeline{grid-template-columns:1fr}}
.player{aspect-ratio:auto;border-radius:12px;overflow:hidden;background:#181818;color:#fff;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;padding:18px}
.player img{width:84px;height:84px;object-fit:cover}
.player b{display:block;font:800 18px/1.2 var(--f)}
.player span{font-size:14px;color:#ffffffaa}
.player .pbtn{width:52px;height:52px;border-radius:50%;background:#1ed760;color:#000;display:grid;place-items:center;font-size:18px}
.note{font-size:13px;color:var(--muted);margin-top:10px}
.nl .wrap>*,footer .top>*,.contact>*,.about>*,.prod>*,.bio>*{min-width:0}
.nl .btn{padding:14px 18px}
@media (max-width:480px){footer .top{grid-template-columns:1fr}.nl h2{font-size:30px}.hero h1{font-size:44px}}
.k{overflow-wrap:anywhere}
.nl form{grid-template-columns:minmax(0,1fr)}.nl .wrap{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}@media (max-width:820px){.nl .wrap{grid-template-columns:minmax(0,1fr)}}