/*
Theme Name: Star Music
Theme URI: https://example.com/star-music
Author: OpenAI
Description: قالب ستار ميوزك مطابق للتصميم الأصلي المرفق.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
Text Domain: star-music
*/

@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;500;600;700;800&family=Playfair+Display:wght@600;700&display=swap');
:root{
 --bg:#0b0b0e;--panel:#121217;--panel2:#17171d;--gold:#d7ad62;--gold2:#f0d69b;
 --text:#f7f4ed;--muted:#aaa7a0;--line:rgba(255,255,255,.09);
 --radius:22px;--shadow:0 20px 60px rgba(0,0,0,.32);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Cairo,system-ui,sans-serif;background:var(--bg);color:var(--text);line-height:1.8}
a{text-decoration:none;color:inherit}
img{display:block;width:100%;object-fit:cover}
.container{width:min(1180px,92%);margin:auto}
.topbar{background:#070708;border-bottom:1px solid var(--line);font-size:13px;color:#b9b5ae}
.topbar .container{display:flex;justify-content:space-between;gap:20px;padding:8px 0}
header{position:sticky;top:0;z-index:50;background:rgba(11,11,14,.88);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
.nav{height:78px;display:flex;align-items:center;justify-content:space-between;gap:25px}
.logo{display:flex;align-items:center;gap:12px;font-weight:800;font-size:22px}
.logo-mark{width:44px;height:44px;border:1px solid rgba(215,173,98,.55);border-radius:50%;display:grid;place-items:center;color:var(--gold);position:relative}
.logo-mark:before{content:"♪";font-family:Georgia;font-size:23px}
.logo small{display:block;color:var(--gold);font-size:10px;letter-spacing:2px;font-weight:600}
nav{display:flex;gap:24px;color:#d5d1c9;font-size:14px}
nav a:hover{color:var(--gold2)}
.actions{display:flex;gap:10px;align-items:center}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 19px;border-radius:12px;border:1px solid var(--line);font-weight:700;font-size:14px;cursor:pointer;transition:.25s}
.btn-gold{background:var(--gold);color:#17120b;border-color:var(--gold)}
.btn-gold:hover{background:var(--gold2);transform:translateY(-2px)}
.btn-dark:hover{border-color:rgba(215,173,98,.55);color:var(--gold2)}
.menu{display:none;background:none;color:white;border:0;font-size:26px}
.hero{min-height:690px;display:grid;place-items:center;position:relative;overflow:hidden;background:
linear-gradient(90deg,rgba(8,8,10,.96) 10%,rgba(8,8,10,.65) 50%,rgba(8,8,10,.72)),
url('https://images.unsplash.com/photo-1519167758481-83f550bb49b3?auto=format&fit=crop&w=2000&q=85') center/cover}
.hero:after{content:"";position:absolute;inset:auto 0 0;height:180px;background:linear-gradient(transparent,var(--bg))}
.hero-content{position:relative;z-index:2;width:min(780px,92%);margin-right:auto;margin-left:auto;text-align:center;padding:80px 0}
.kicker{color:var(--gold);font-size:13px;font-weight:800;letter-spacing:2px;margin-bottom:14px}
h1{font-family:'Playfair Display',serif;font-size:clamp(48px,7vw,84px);line-height:1.05;margin-bottom:20px}
.hero p{color:#d5d1c9;font-size:18px;max-width:650px;margin:0 auto 28px}
.hero-buttons{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}
.section{padding:90px 0}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:34px}
.section-head h2{font-family:'Playfair Display',serif;font-size:42px;line-height:1.2}
.section-head p{color:var(--muted);max-width:520px}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:.3s;box-shadow:0 0 0 rgba(0,0,0,0)}
.card:hover{transform:translateY(-7px);box-shadow:var(--shadow);border-color:rgba(215,173,98,.25)}
.card-img{height:220px;position:relative}
.card-img:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 45%,rgba(0,0,0,.65))}
.badge{position:absolute;z-index:2;top:14px;right:14px;background:rgba(10,10,12,.8);border:1px solid rgba(255,255,255,.12);padding:5px 10px;border-radius:20px;font-size:11px;color:var(--gold2)}
.card-body{padding:19px}
.card h3{font-size:18px;margin-bottom:6px}
.card p{font-size:13px;color:var(--muted)}
.price{color:var(--gold2);font-weight:800;margin-top:13px}
.service-grid{grid-template-columns:repeat(3,1fr)}
.service{padding:28px;background:linear-gradient(145deg,#15151a,#0f0f13);border:1px solid var(--line);border-radius:var(--radius);min-height:220px}
.icon{width:48px;height:48px;border-radius:14px;background:rgba(215,173,98,.1);border:1px solid rgba(215,173,98,.22);display:grid;place-items:center;color:var(--gold);font-size:22px;margin-bottom:18px}
.service h3{font-size:20px;margin-bottom:8px}.service p{color:var(--muted);font-size:14px}
.band{background:linear-gradient(110deg,#19140d,#0d0d10);border-block:1px solid rgba(215,173,98,.15)}
.band-grid{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:center}
.band h2{font-family:'Playfair Display',serif;font-size:45px;line-height:1.2;margin-bottom:15px}
.band p{color:var(--muted);margin-bottom:22px}
.steps{display:grid;gap:15px}
.step{display:flex;gap:15px;padding:16px;border:1px solid var(--line);background:rgba(255,255,255,.025);border-radius:15px}
.step b{width:34px;height:34px;flex:0 0 34px;border-radius:50%;display:grid;place-items:center;background:var(--gold);color:#18130b}
.step span{font-size:14px;color:#d7d3cb}
.art{border-radius:30px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow)}
.art img{height:500px}
.art{position:relative}.art-caption{position:absolute;right:25px;left:25px;bottom:25px;background:rgba(7,7,9,.78);backdrop-filter:blur(12px);padding:18px;border:1px solid var(--line);border-radius:18px}
.art-caption strong{color:var(--gold2)}
.art-caption small{display:block;color:#c4c0b8}
.artist-grid{grid-template-columns:repeat(5,1fr)}
.artist img{height:240px;filter:saturate(.8);transition:.3s}.artist:hover img{filter:saturate(1)}
.artist .card-body{padding:15px}.artist h3{font-size:16px}
.testimonials{grid-template-columns:repeat(3,1fr)}
.quote{padding:26px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius)}
.stars{color:var(--gold);letter-spacing:3px;margin-bottom:10px}.quote p{color:#d3d0ca;font-size:14px}.quote strong{display:block;margin-top:15px;font-size:13px}
.cta{padding:55px;border-radius:30px;background:
linear-gradient(100deg,rgba(215,173,98,.15),rgba(215,173,98,.02)),
url('https://images.unsplash.com/photo-1492684223066-81342ee5ff30?auto=format&fit=crop&w=1800&q=80') center/cover;
border:1px solid rgba(215,173,98,.2);text-align:center}
.cta h2{font-family:'Playfair Display',serif;font-size:43px}.cta p{color:#d2cec6;margin:8px auto 20px;max-width:650px}
footer{background:#070708;border-top:1px solid var(--line);padding:55px 0 25px;color:#aaa69f}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:35px}
footer h3{color:#fff;font-size:16px;margin-bottom:15px}footer p,footer a{font-size:13px;color:#9e9b95;display:block;margin:6px 0}footer a:hover{color:var(--gold)}
.copy{border-top:1px solid var(--line);margin-top:35px;padding-top:18px;display:flex;justify-content:space-between;font-size:12px}
.float-wa{position:fixed;bottom:20px;left:20px;z-index:70;width:58px;height:58px;border-radius:50%;background:#25d366;color:white;display:grid;place-items:center;font-size:28px;box-shadow:0 12px 30px rgba(0,0,0,.4)}
.search{position:fixed;inset:0;background:rgba(0,0,0,.8);backdrop-filter:blur(12px);display:none;z-index:100;padding:12vh 20px}
.search.open{display:block}.search-box{width:min(720px,100%);margin:auto}.search input{width:100%;padding:18px;border-radius:16px;background:#15151a;border:1px solid var(--line);color:#fff;font:inherit;font-size:18px}
@media(max-width:1000px){.grid{grid-template-columns:repeat(2,1fr)}.artist-grid{grid-template-columns:repeat(3,1fr)}.band-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:repeat(2,1fr)}nav{display:none}.menu{display:block}}
@media(max-width:620px){.topbar .container{flex-direction:column;text-align:center;gap:0}.nav{height:68px}.actions .btn-dark{display:none}.hero{min-height:600px}.hero p{font-size:15px}.section{padding:65px 0}.section-head{display:block}.section-head h2{font-size:34px;margin-bottom:8px}.grid,.service-grid,.testimonials{grid-template-columns:1fr}.artist-grid{grid-template-columns:repeat(2,1fr)}.artist img{height:210px}.band h2,.cta h2{font-size:34px}.art img{height:390px}.footer-grid{grid-template-columns:1fr}.copy{display:block}.copy span{display:block;margin-top:7px}}