.og-rec{--rec-ink:#050507;--rec-coal:#0c0c0f;--rec-bone:#f3efe8;--rec-ash:#8d8b88;--rec-line:#f3efe81f;--rec-grad:linear-gradient(95deg, #ff3131 0%, #ff914d 100%);background:var(--rec-ink);min-height:100svh;color:var(--rec-bone);font-family:var(--font-inter-sans), system-ui, sans-serif;overflow-x:clip}.og-rec ::selection{color:#050507;background:#ff5a2a}.rec-display{font-family:var(--font-bricolage-g), sans-serif;letter-spacing:-.045em;text-transform:uppercase;font-weight:900;line-height:.88}.rec-serif{font-family:var(--font-og-serif), Georgia, serif;letter-spacing:-.01em;text-transform:none;font-style:italic;font-weight:400}.rec-eyebrow{letter-spacing:.28em;text-transform:uppercase;color:var(--rec-ash);font-size:11px;font-weight:600;line-height:1}.rec-grad-text{background-image:var(--rec-grad);-webkit-text-fill-color:transparent;color:#0000;-webkit-background-clip:text;background-clip:text}.rec-outline{color:#f3efe817}.rec-grain:after{content:"";pointer-events:none;z-index:1;opacity:.08;mix-blend-mode:overlay;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");position:absolute;inset:0}.rec-btn{letter-spacing:.16em;text-transform:uppercase;border-radius:9999px;align-items:center;gap:12px;height:52px;padding:0 26px;font-size:12px;font-weight:600;transition:transform .4s cubic-bezier(.22,1,.36,1),background-color .3s,color .3s,border-color .3s;display:inline-flex}.rec-btn:hover{transform:translateY(-2px)}.rec-btn--primary{background-image:var(--rec-grad);color:#050507}.rec-btn--ghost{color:var(--rec-bone);border:1px solid #f3efe847}.rec-btn--ghost:hover{border-color:var(--rec-bone);background:var(--rec-bone);color:#050507}.rec-focus:focus-visible{outline-offset:3px;outline:2px solid #ff7a1a}.rec-hero-wash{filter:blur(70px)saturate(1.2)brightness(.45);background-position:50% 30%;background-size:cover;position:absolute;inset:-10%;transform:scale(1.1)}.rec-vinyl{aspect-ratio:1;background:radial-gradient(circle,#050507 0 2.4%,#0000 2.5%),repeating-radial-gradient(circle,#222227 0 1px,#0b0b0d 1px 3.2px);border-radius:9999px;width:90%;transition:right 1.2s cubic-bezier(.22,1,.36,1);animation:9s linear infinite rec-spin;position:absolute;top:5%;right:-10%;box-shadow:0 30px 80px -20px #000000e6,inset 0 0 0 2px #ffffff12,0 0 0 1px #ffffff1a}.rec-vinyl:before{content:"";border-radius:inherit;background:conic-gradient(from 0deg, transparent 0 18%, #ffffff21 24%, transparent 31% 68%, #ffffff17 75%, transparent 82%);position:absolute;inset:0}.rec-vinyl__label{border-radius:9999px;position:absolute;inset:33%;overflow:hidden;box-shadow:0 0 0 5px #0c0c0f}.rec-sleeve-wrap:hover .rec-vinyl{right:-22%}@keyframes rec-spin{to{transform:rotate(360deg)}}.rec-marquee{width:max-content;animation:48s linear infinite rec-marquee;display:flex}.rec-marquee:hover{animation-play-state:paused}@keyframes rec-marquee{to{transform:translate(-50%)}}.rec-card__img{filter:grayscale(.35)brightness(.92);transition:transform .9s cubic-bezier(.22,1,.36,1),filter .6s}.rec-card:hover .rec-card__img,.rec-card:focus-visible .rec-card__img{filter:none;transform:scale(1.05)}.rec-card__play{opacity:0;transition:opacity .4s,transform .5s cubic-bezier(.22,1,.36,1);transform:translateY(8px)scale(.92)}.rec-card:hover .rec-card__play,.rec-card:focus-visible .rec-card__play{opacity:1;transform:none}.rec-portrait img{filter:grayscale()contrast(1.08)brightness(.92);transition:filter 1s,transform 1.4s cubic-bezier(.22,1,.36,1)}.rec-portrait:hover img{filter:grayscale(0)contrast(1.02);transform:scale(1.03)}.rec-eq span{background:var(--rec-grad);transform-origin:bottom;border-radius:2px;width:3px;animation:1.1s ease-in-out infinite rec-eq;display:block}.rec-eq span:nth-child(2){animation-delay:-.3s}.rec-eq span:nth-child(3){animation-delay:-.6s}.rec-eq span:nth-child(4){animation-delay:-.9s}@keyframes rec-eq{0%,to{transform:scaleY(.3)}50%{transform:scaleY(1)}}.rec-row{transition:background-color .3s}.rec-row:hover{background-color:#f3efe80a}.rec-rise{animation:1s cubic-bezier(.22,1,.36,1) both rec-rise}@keyframes rec-rise{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}.og-rec[data-paused] *,.og-rec[data-paused] :before,.og-rec[data-paused] :after{animation-play-state:paused!important}@media (prefers-reduced-motion:reduce){.og-rec *,.og-rec :before,.og-rec :after{transition:none!important;animation:none!important}}
