
:root{--gold:#c7a15a;--gold2:#e5c77c;--white:#f5efe6;--muted:#c8beb1;--bg:#030303;--line:rgba(199,161,90,.28)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#030303;color:var(--white);font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;z-index:50;pointer-events:none;background:radial-gradient(circle at 50% 50%,transparent 42%,rgba(0,0,0,.62)),repeating-linear-gradient(0deg,rgba(255,255,255,.018) 0 1px,transparent 1px 5px);opacity:.55}
a{text-decoration:none;color:inherit}.nav{height:76px;position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:0 7%;background:rgba(0,0,0,.84);backdrop-filter:blur(14px);border-bottom:1px solid rgba(199,161,90,.16)}
.logo{color:var(--gold);font-family:Georgia,'Times New Roman',serif;font-size:46px;line-height:.75;min-width:140px}.logo span{display:block;color:#e8ded0;font-family:Arial,sans-serif;font-size:10px;letter-spacing:1.8px;text-transform:uppercase;margin-top:13px}
.menu{display:flex;gap:26px}.menu a{color:#fff;text-transform:uppercase;letter-spacing:1px;font-size:12px;padding:30px 0 24px;border-bottom:2px solid transparent}.menu a.active,.menu a:hover{color:var(--gold);border-bottom-color:var(--gold)}
.lang{display:flex;gap:18px;font-size:12px}.lang b{color:var(--gold);border:1px solid rgba(199,161,90,.65);padding:6px 14px;font-weight:400}
.hero{min-height:62vh;position:relative;display:flex;align-items:center;padding:115px 7% 120px;background:linear-gradient(90deg,rgba(0,0,0,.92) 0%,rgba(0,0,0,.62) 38%,rgba(0,0,0,.20) 70%,rgba(0,0,0,.78) 100%),url('img/hero-cinema.jpg') center/cover no-repeat;border-bottom:1px solid rgba(255,255,255,.18);overflow:hidden}
.hero.page{min-height:48vh}.hero:before{content:"";position:absolute;inset:-20%;background:radial-gradient(circle at 70% 20%,rgba(199,161,90,.24),transparent 24%);animation:lightMove 13s ease-in-out infinite alternate}.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent,rgba(0,0,0,.73))}
@keyframes lightMove{from{transform:translate(-25px,-10px) scale(1)}to{transform:translate(55px,35px) scale(1.08)}}.hero-inner{position:relative;z-index:2;max-width:850px}.hero h1{margin:0 0 14px;font-family:Georgia,'Times New Roman',serif;font-size:82px;line-height:.94;text-transform:uppercase;font-weight:400;letter-spacing:2px}.hero h2{margin:0 0 28px;color:var(--gold2);font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:25px;text-transform:uppercase;letter-spacing:1.2px}.hero p{max-width:690px;color:#eee7dd;font-size:16px;line-height:1.7;text-shadow:0 3px 16px rgba(0,0,0,.85)}
.actions{display:flex;gap:24px;margin-top:32px}.btn{height:56px;min-width:230px;display:inline-flex;align-items:center;justify-content:center;text-transform:uppercase;font-size:12px;letter-spacing:1.2px;border:1px solid rgba(255,255,255,.65);background:rgba(0,0,0,.28);color:white}.btn.primary{background:linear-gradient(180deg,#dfc27b,#b58e49);color:#070707;border-color:var(--gold);font-weight:bold}
.grid{display:grid;grid-template-columns:1.08fr 1.08fr 1.42fr;border-bottom:1px solid rgba(255,255,255,.18)}.tile{min-height:235px;position:relative;padding:38px 7%;background:#070707;border-right:1px solid rgba(255,255,255,.16);overflow:hidden}.tile:last-child{border-right:0}.tile:after{content:"";position:absolute;inset:0;opacity:.30;filter:grayscale(1) contrast(1.1);background:url('img/hero-cinema.jpg') center/cover}.tile .tile-inner{position:relative;z-index:2;max-width:430px}
h3.gold,.tile h3,.album-copy h3{margin:0 0 24px;color:var(--gold);font-family:Georgia,'Times New Roman',serif;text-transform:uppercase;font-size:28px;font-weight:400;letter-spacing:.5px}.tile h3:after,h3.gold:after,.album-copy h3:after{content:"";display:block;width:34px;height:1px;background:var(--gold);margin-top:12px}
.tile p,.content p{margin:0 0 20px;color:#e4ddd2;font-family:Georgia,'Times New Roman',serif;font-size:16px;line-height:1.7}.more{display:inline-block;margin-top:28px;color:var(--gold);text-transform:uppercase;font-size:12px;letter-spacing:1.1px}
.album{display:grid;grid-template-columns:44% 56%;background:#050606;border-bottom:1px solid rgba(255,255,255,.18)}.album-info{display:grid;grid-template-columns:220px 1fr;gap:38px;align-items:center;padding:42px 7%}.cover{width:220px;height:220px;object-fit:cover;border:1px solid rgba(255,255,255,.18);box-shadow:0 0 60px rgba(199,161,90,.14)}.album-copy .label{color:var(--gold);text-transform:uppercase;letter-spacing:1.2px;font-size:13px;margin-bottom:12px}.album-copy h3{font-size:31px;margin-bottom:16px}.album-copy p{color:#ded7cc;font-family:Georgia,'Times New Roman',serif;font-size:15px;line-height:1.6}
.player{padding:34px 7%;border-left:1px solid rgba(255,255,255,.16)}.playlist{border:1px solid rgba(199,161,90,.25);background:#090a0a;overflow:hidden}.track{display:grid;grid-template-columns:38px 1fr 78px;gap:12px;align-items:center;padding:11px 18px;border-bottom:1px solid rgba(255,255,255,.08);color:#d7d0c5;font-family:Georgia,'Times New Roman',serif;font-size:14px;cursor:pointer}.track.active{background:rgba(199,161,90,.17);color:white}.num{color:var(--gold)}
.controls{border:1px solid rgba(199,161,90,.25);border-top:0;background:#111;padding:18px}.control-line{display:flex;justify-content:center;align-items:center;gap:25px}.mini{background:none;border:0;color:#ded7cb;font-size:18px}.round{width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.55);background:linear-gradient(180deg,#c8a968,#8f6c28);color:white;font-size:20px}.progress{margin-top:16px;display:grid;grid-template-columns:48px 1fr 48px;gap:12px;align-items:center;color:#d7d0c5;font-size:12px}.bar{height:4px;background:#303030;position:relative}.fill{position:absolute;left:0;top:0;bottom:0;width:0;background:var(--gold)}.knob{position:absolute;left:0;top:50%;width:8px;height:8px;border-radius:50%;background:var(--gold);transform:translate(-50%,-50%)}
.content{max-width:1080px;margin:0 auto;padding:80px 7%}.content-card{border:1px solid rgba(199,161,90,.22);background:rgba(8,8,8,.86);padding:38px;margin:24px 0}.heroes{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.hero-card{border:1px solid rgba(199,161,90,.2);background:#090909;padding:24px}.hero-card strong{color:var(--gold);font-family:Georgia,serif;font-size:20px}.quote{min-height:96px;padding:28px 7%;display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center;background:linear-gradient(180deg,rgba(0,0,0,.70),rgba(0,0,0,.90)),url('img/hero-cinema.jpg') center bottom/cover no-repeat}.quote p{margin:0;text-align:center;color:var(--gold2);font-family:Georgia,'Times New Roman',serif;font-style:italic;font-size:19px}.support{border:1px solid var(--gold);padding:16px 30px;color:var(--gold);text-transform:uppercase;font-size:12px;letter-spacing:1.1px}footer{padding:28px 7%;color:#8b8378;font-size:12px;text-align:center;border-top:1px solid rgba(255,255,255,.12)}
@media(max-width:1050px){.menu{display:none}.hero h1{font-size:50px}.grid,.album,.heroes{grid-template-columns:1fr}.album-info{grid-template-columns:1fr}.player{border-left:0}.quote{grid-template-columns:1fr}.actions{flex-direction:column}.btn{width:100%}.nav{padding:0 24px}.hero{padding-left:7%;padding-right:7%}}
