:root{--page:#f8f8f6;--paper:#fff;--ink:#171717;--muted:#70706c;--line:#deded9;--font:Inter,Arial,sans-serif;--gutter:clamp(20px,5vw,72px)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--page);color:var(--ink);font-family:var(--font);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline;text-underline-offset:5px}a:focus-visible{outline:2px solid var(--ink);outline-offset:6px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip{position:fixed;top:-70px;left:20px;padding:14px;background:var(--ink);color:white;z-index:20}.skip:focus{top:10px}.header{padding:26px var(--gutter);display:flex;align-items:center;gap:36px;border-bottom:1px solid var(--line)}.identity{font-size:12px;font-weight:700;letter-spacing:-.2px}nav{margin-left:auto;display:flex;gap:28px;font-size:11px}.header-store{font-size:11px;display:flex;gap:13px;color:var(--muted)}main,footer{max-width:1280px;margin:auto;padding-inline:var(--gutter)}.hero{padding:60px 0 52px}h1{font-size:clamp(34px,5.7vw,76px);line-height:1.05;letter-spacing:-.06em;font-weight:600;margin:0}.hero-description{font-size:12px;color:var(--muted);margin:17px 0 0}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:18px}h2{margin:0;font-size:13px;font-weight:500;letter-spacing:-.1px}.text-link{display:inline-flex;gap:12px;font-size:10px;color:var(--muted)}.player-shell{background:var(--paper);border:1px solid var(--line);overflow:hidden}.beatstars-player{display:block;border:0;width:100%;height:850px;background:var(--paper)}.licenses{display:grid;grid-template-columns:120px 1fr auto;gap:30px;align-items:baseline;padding:32px 0;margin-top:30px;border-bottom:1px solid var(--line)}.licenses p{font-size:11px;line-height:1.7;color:var(--muted);margin:0;max-width:440px}footer{display:flex;align-items:center;gap:30px;padding-top:26px;padding-bottom:28px;font-size:9px;color:var(--muted)}.preview-note{margin-left:auto}footer a{display:flex;gap:12px}@media(max-width:600px){.header{padding:22px var(--gutter);gap:18px;flex-wrap:wrap}.identity{font-size:11px}.header-store{margin-left:auto;font-size:10px}nav{order:3;width:100%;margin:0;gap:24px;font-size:10px}.hero{padding:40px 0 34px}h1{font-size:clamp(30px,8vw,48px)}.hero-description{font-size:11px;margin-top:12px}.section-heading{margin-bottom:14px}.player-shell{margin-inline:-8px}.beatstars-player{height:760px}.licenses{grid-template-columns:1fr;gap:13px;padding:27px 0;margin-top:15px}.licenses p{max-width:300px}footer{font-size:8px;gap:15px;flex-wrap:wrap}footer a{width:100%}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.catalog{padding-top:28px}.section-title h1{margin:0;font-size:13px;letter-spacing:-.1px;line-height:1.4;font-weight:500}footer{margin-top:28px}
@media(min-width:900px){.catalog{width:calc(100vw - 2 * var(--gutter));margin-left:calc(50% - 50vw + var(--gutter))}}

/* La fotografía ocupa todo el ancho desde el borde inferior de la barra superior. */
:root{--page:#fff}
.portrait-header{height:420px;position:relative;overflow:hidden;width:100%;background:var(--page)}
.portrait-header img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 34%;-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 48%,transparent 100%);mask-image:linear-gradient(to bottom,#000 0%,#000 48%,transparent 100%)}
@media(min-width:900px){
  .portrait-header{height:clamp(460px,39vw,540px)}
  .portrait-header::after{content:"";position:absolute;inset:auto 0 0;height:36%;background:linear-gradient(to bottom,transparent,#fff);pointer-events:none}
  .portrait-header img{
    position:absolute;
    top:-20px;
    left:clamp(20px,5vw,88px);
    width:clamp(650px,57vw,820px);
    height:auto;
    object-fit:contain;
    -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 65%,transparent 100%),linear-gradient(to right,transparent 0%,#000 8%,#000 68%,transparent 100%);
    mask-image:linear-gradient(to bottom,#000 0%,#000 65%,transparent 100%),linear-gradient(to right,transparent 0%,#000 8%,#000 68%,transparent 100%);
    -webkit-mask-composite:source-in;
    mask-composite:intersect;
  }
}
@media(max-width:600px){.portrait-header{height:310px}.portrait-header img{object-position:center 30%}.catalog{padding-top:8px}}
.simple-section{display:grid;grid-template-columns:1fr 2fr;gap:30px;border-top:1px solid var(--line);padding:30px 0;scroll-margin-top:20px}.simple-section h2{font-size:13px}.simple-section p{margin:0;color:var(--muted);font-size:11px;line-height:1.6}
@media(max-width:600px){.simple-section{grid-template-columns:1fr;gap:14px;padding:24px 0}}

.player-shell{min-height:760px;position:relative}
[hidden]{display:none!important}
.player-fallback{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;padding:32px;background:#fff;text-align:center;font-size:14px}
.player-fallback p{margin:0;color:var(--muted)}
.player-fallback-actions{display:flex;justify-content:center;gap:20px;flex-wrap:wrap}
.player-fallback-actions button,.player-fallback-actions a{border:0;background:none;padding:8px 0;color:var(--ink);font:inherit;text-decoration:underline;text-underline-offset:5px;cursor:pointer}
.file-player-note{min-height:760px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:32px;text-align:center;font-size:14px}
.file-player-note p{margin:0;color:var(--muted)}
.file-player-note a{text-decoration:underline;text-underline-offset:5px}
@media(max-width:600px){.file-player-note{min-height:680px}}

.socials{display:flex;justify-content:center;margin-top:0;padding:38px 18px;background:#fff}
.social-links{display:flex;align-items:center;justify-content:center;gap:clamp(12px,1.5vw,20px);flex-wrap:wrap}
.social-link{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;color:#000}
.social-link:hover{opacity:.58}
.social-link svg{width:25px;height:25px;flex:none}
.social-link span{display:none}
.discography{width:calc(100vw - 32px);margin:56px 0 0 calc(50% - 50vw + 16px);border-top:1px solid var(--line);padding:28px 0 48px;scroll-margin-top:20px}
.discography-heading{margin-bottom:22px}
.discography-heading h2{font-size:13px}
.carousel-controls{display:flex;gap:7px}
.carousel-arrow{width:34px;height:34px;border:1px solid var(--line);border-radius:50%;background:#fff;color:var(--ink);font-size:17px;line-height:1;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.carousel-arrow:hover:not(:disabled){background:var(--ink);color:#fff;border-color:var(--ink)}
.carousel-arrow:disabled{opacity:.32;cursor:default}
.release-track{display:grid;grid-auto-flow:column;grid-auto-columns:clamp(250px,29vw,340px);gap:22px;overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:#c6c6c2 transparent;padding:0 0 17px;outline-offset:4px}
.release-card{display:block;min-width:0;scroll-snap-align:start}
.release-cover{display:block;aspect-ratio:1;overflow:hidden;background:#f0f0ee}
.release-cover img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .55s cubic-bezier(.2,.75,.2,1)}
.release-title{display:block;margin-top:14px;font-size:13px;line-height:1.35;font-weight:500}
.release-card:hover{text-decoration:none}
.release-card:hover .release-title{text-decoration:underline;text-underline-offset:4px}
@media(hover:hover){.release-card:hover .release-cover img{transform:scale(1.075)}}
.discography-all{display:inline-flex;gap:12px;margin-top:20px;font-size:11px;color:var(--muted)}
@media(max-width:600px){.socials{padding:28px 8px}.social-links{gap:12px}.social-link{width:30px;height:30px}.social-link svg{width:25px;height:25px}.discography{width:calc(100vw - 24px);margin:38px 0 0 calc(50% - 50vw + 12px);padding:22px 0 38px}.release-track{grid-auto-columns:min(78vw,320px);gap:14px}.release-title{font-size:12px}.player-shell{min-height:680px}}
@media(prefers-reduced-motion:reduce){.release-cover img,.carousel-arrow{transition:none}}
.catalog-heading,.discography-heading{justify-content:flex-end}
.beatstars-player{height:850px}
.player-shell{min-height:850px}
footer{min-height:65px}
button,input,select,textarea{font-family:var(--font)}
.identity{font-size:clamp(16px,1.4vw,22px)}
nav{font-size:clamp(14px,1.1vw,17px)}
.social-links{gap:clamp(16px,2vw,28px)}
.social-link{width:52px;height:52px}
.social-link svg{width:42px;height:42px}
@media(max-width:600px){
  .identity{font-size:16px}
  nav{font-size:14px}
  .social-links{gap:8px}
  .social-link{width:clamp(32px,9vw,40px);height:clamp(32px,9vw,40px)}
  .social-link svg{width:clamp(28px,8vw,36px);height:clamp(28px,8vw,36px)}
}
