/*
Theme Name: DJ Eazy SA Hip Hop 3D V7 Safe
Theme URI: https://djeazysa.com/
Author: REmedia
Description: Modern 3D hip-hop DJ theme for DJ Eazy SA.
Version: 7.0.0
Requires at least: 5.8
Requires PHP: 5.6
Text Domain: dj-eazy-sa-clean
*/
:root{--black:#05080b;--cream:#f5f5f2;--lime:#ffd95a;--pink:#b47b19;--grey:#a9a9a9}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--black);color:var(--cream);font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}a{color:inherit;text-decoration:none}.container{width:min(1320px,88%);margin:auto}
.header{height:80px;position:absolute;z-index:20;left:0;right:0;top:0;display:flex;align-items:center;padding:0 5%;border-bottom:1px solid #ffffff25}.logo{display:flex;align-items:center;gap:10px;font-weight:1000;font-size:21px;font-style:italic}.logo b{color:var(--lime)}.disc-logo{width:36px;height:36px;border:3px solid;border-radius:50%;display:grid;place-items:center;box-shadow:3px 3px var(--pink)}.disc-logo:after{content:"";width:7px;height:7px;background:var(--lime);border-radius:50%}.menu{display:flex;list-style:none;gap:28px;margin:0 0 0 auto;padding:0;font-size:11px;font-weight:900;letter-spacing:.15em}.menu a:hover{color:var(--lime)}.book{margin-left:30px;background:var(--lime);color:#080808;padding:14px 19px;font-size:11px;font-weight:1000;box-shadow:6px 6px var(--pink)}.toggle{display:none;background:transparent;border:0;color:#fff;font-size:27px;margin-left:auto}
.hero{height:100vh;min-height:720px;position:relative;display:flex;align-items:center;isolation:isolate;overflow:hidden}.hero-image{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,#050505fc 0%,#050505c4 40%,#05050518 78%),linear-gradient(0deg,#000b,transparent 55%),url("assets/images/hero.png") center/cover no-repeat}.hero:after{content:"";position:absolute;z-index:-1;width:52vw;height:52vw;border:1px solid #caff1835;border-radius:50%;right:-20vw;top:12%;box-shadow:0 0 100px #caff1815,inset 0 0 100px #ff3cab15}.location,.label{font-size:10px;font-weight:900;letter-spacing:.25em}.location:before{content:"";display:inline-block;width:40px;height:4px;background:var(--pink);margin-right:12px;vertical-align:middle}.hero h1{font-size:clamp(95px,17vw,230px);line-height:.7;letter-spacing:-.09em;margin:9vh 0 7vh;font-weight:1000;transform:scaleY(1.12);transform-origin:left;text-shadow:9px 10px #ff3cab35}.hero h1 span{display:block;font-size:.42em;color:transparent;-webkit-text-stroke:2px var(--cream);letter-spacing:.05em;margin-left:7px;margin-bottom:20px}.hero-bottom{display:flex;align-items:center;gap:40px}.tagline{border-left:4px solid var(--lime);padding-left:16px;font-size:13px;font-weight:900;line-height:1.5;text-transform:uppercase;letter-spacing:.08em}.play{width:70px;height:70px;border-radius:50%;background:var(--pink);color:#090909;display:grid;place-items:center;font-size:24px;box-shadow:8px 9px var(--lime);transition:.25s}.play:hover{transform:rotate(-10deg) scale(1.07)}
.ticker{position:relative;z-index:5;background:var(--lime);color:#080808;transform:rotate(-1deg) scale(1.02);box-shadow:0 8px var(--pink);overflow:hidden}.ticker div{padding:18px 0;white-space:nowrap;font-weight:1000;font-size:18px;letter-spacing:.08em;animation:scroll 24s linear infinite}.ticker i{color:var(--pink);font-style:normal;margin:0 25px}@keyframes scroll{to{transform:translateX(-40%)}}
.section{padding:115px 0}.light{background:var(--cream);color:#090909}.section-number{border-top:1px solid #777;padding-top:14px;color:#777;font-size:10px;font-weight:900;letter-spacing:.18em}.about{display:grid;grid-template-columns:.6fr 2.2fr 1fr;gap:6vw}.label{margin:45px 0 20px}.big-title{font-size:clamp(55px,7vw,104px);font-weight:1000;line-height:.82;letter-spacing:-.07em;margin:0}.big-title em{font-style:normal;color:var(--pink)}.copy{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:52px}.copy strong{font-size:22px;line-height:1.3}.copy p{font-size:14px;line-height:1.8;color:#4d4d4d}.three-d-card{min-height:410px;background:#121212;color:#fff;align-self:end;padding:28px;display:flex;align-items:flex-end;position:relative;overflow:hidden;box-shadow:17px 18px var(--lime);transform:perspective(900px) rotateY(-8deg);transition:.35s}.three-d-card:hover{transform:perspective(900px) rotateY(0) translateY(-8px)}.vinyl{position:absolute;width:330px;height:330px;right:-120px;top:-90px;border-radius:50%;background:repeating-radial-gradient(circle,#282828 0 3px,#0c0c0c 4px 8px);border:28px solid #ff3cabaa;animation:spin 16s linear infinite}.three-d-card strong{font-size:28px;line-height:.9}@keyframes spin{to{transform:rotate(360deg)}}
.heading-row{display:flex;align-items:end;justify-content:space-between;margin:35px 0 60px}.heading-row p{max-width:330px;color:var(--grey);line-height:1.7}.outline{color:transparent;-webkit-text-stroke:1px var(--cream)}.cards{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:18px}.card{min-height:380px;padding:28px;position:relative;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;transition:.3s}.card:hover{transform:translateY(-10px)}.card:nth-child(3n+1){background:#1b1b1b}.card:nth-child(3n+2){background:var(--pink);color:#080808;transform:rotate(1deg)}.card:nth-child(3n){background:var(--lime);color:#080808;transform:rotate(-1deg)}.card h3{font-size:34px;line-height:.9;letter-spacing:-.04em;margin:10px 0}.card small{font-weight:900;letter-spacing:.15em}.card-vinyl{position:absolute;width:260px;height:260px;border-radius:50%;right:-55px;top:-65px;background:repeating-radial-gradient(circle,#2a2a2a 0 3px,#090909 4px 7px);box-shadow:-15px 20px 45px #000;animation:spin 17s linear infinite}.read-more{font-size:11px;font-weight:900;margin-top:15px}
.posts{border-top:3px solid;margin-top:55px}.post-row{display:grid;grid-template-columns:.7fr 2fr 1fr;gap:25px;align-items:center;min-height:165px;border-bottom:1px solid #aaa}.post-row time{font-weight:1000;color:var(--pink);font-size:24px}.post-row h3{font-size:28px}.post-row a{font-size:11px;font-weight:900;border:2px solid;padding:15px;text-align:center}.coming{padding:50px 0;font-size:24px;font-weight:1000}
.contact{text-align:center;min-height:650px;display:flex;align-items:center;position:relative;overflow:hidden}.contact:before{content:"";position:absolute;width:520px;height:520px;border:70px double #ff3cab18;border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%)}.contact .container{position:relative}.cta{display:inline-block;margin:48px 8px 0;background:var(--lime);color:#080808;padding:19px 28px;font-size:11px;font-weight:1000;box-shadow:7px 7px var(--pink)}
.footer{padding:42px 6%;border-top:1px solid #252525;display:flex;justify-content:space-between;align-items:center;color:#777;font-size:11px}.page-wrap{padding:145px 0 90px;min-height:80vh}.page-wrap h1{font-size:clamp(48px,8vw,100px);letter-spacing:-.06em}.entry{max-width:850px;font-size:17px;line-height:1.8}.entry img{max-width:100%;height:auto}
@media(max-width:900px){.menu,.book{display:none}.toggle{display:block}.menu.open{display:flex;position:absolute;top:80px;left:0;right:0;background:#090909;padding:30px;flex-direction:column}.about{grid-template-columns:1fr}.three-d-card{min-height:320px;transform:none}.cards{grid-template-columns:1fr 1fr}.card:first-child{grid-column:1/-1}.heading-row{display:block}.post-row{grid-template-columns:1fr 2fr}.post-row a{grid-column:2}.footer{flex-direction:column;gap:20px}}
@media(max-width:560px){.header{height:76px}.official-logo{width:62px;height:62px}.hero h1{font-size:25vw}.hero-image{inset:7% -48% 4% 17%;background-position:center;transform:perspective(900px) rotateY(-5deg);opacity:.82}.section{padding:82px 0}.big-title{font-size:15vw}.copy,.cards{grid-template-columns:1fr}.card:first-child{grid-column:auto}.post-row{grid-template-columns:1fr;padding:28px 0}.post-row a{grid-column:1}.footer{text-align:center}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.ticker div,.vinyl,.card-vinyl{animation:none}}

/* Version 3: official black and gold identity with layered 3D hero */
.header{height:88px;background:linear-gradient(180deg,#000e,transparent);border-bottom-color:#ffd95a44;backdrop-filter:blur(5px)}
.logo{display:flex;align-items:center}
.official-logo{display:block;width:76px;height:76px;object-fit:contain;filter:drop-shadow(0 9px 14px #000) drop-shadow(0 0 1px #ffd95a);transition:transform .3s}
.official-logo:hover{transform:perspective(500px) rotateY(-10deg) translateY(-2px)}
.hero{background:radial-gradient(circle at 72% 40%,#27313a 0,#091017 36%,#020303 72%)}
.hero-image{inset:6% -2% 4% 27%;background:url("assets/images/hero.png") center/cover no-repeat;border:1px solid #ffd95a80;box-shadow:-28px 34px 0 #151719,-45px 55px 85px #000,0 0 0 10px #ffd95a12;transform:perspective(1500px) rotateY(-7deg) rotateX(1deg) scale(1.03);transform-origin:right center;animation:heroFloat 8s ease-in-out infinite alternate}
.hero-image:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#030405f2 0%,#030405a8 25%,transparent 58%),linear-gradient(0deg,#0008,transparent 50%);box-shadow:inset 28px 0 48px #000}
.hero:after{border-color:#ffd95a35;box-shadow:0 0 100px #ffd95a16,inset 0 0 100px #b47b1918}
@keyframes heroFloat{to{transform:perspective(1500px) rotateY(-4deg) rotateX(0deg) translateY(-8px) scale(1.03)}}
.three-d-card{box-shadow:17px 18px #b47b19;background:linear-gradient(145deg,#202020,#050505)}
.ticker{box-shadow:0 8px #b47b19}
.cta{transition:.25s}.cta:hover{transform:translateY(-5px);box-shadow:10px 12px #8a5c10}
@media(max-width:560px){.header{height:76px}.official-logo{width:62px;height:62px}.hero-image{inset:7% -48% 4% 17%;background-position:center;transform:perspective(900px) rotateY(-5deg);opacity:.82}}
.hero .container{display:none}
.hero-image{inset:11% 5% 5%;background-size:contain;background-repeat:no-repeat;background-color:#05080b}
@media(max-width:560px){.hero{min-height:500px;height:70vh}.hero-image{inset:12% 3% 5%;background-size:contain;transform:perspective(900px) rotateY(-3deg);opacity:1}}

/* Facebook timeline */
.facebook-section{background:radial-gradient(circle at 20% 20%,#28323b 0,#080b0e 42%,#020303 78%);position:relative;overflow:hidden}
.facebook-section:before{content:"f";position:absolute;right:-3vw;top:-12vw;font:1000 48vw/1 Arial;color:#ffffff08;transform:rotate(-5deg)}
.facebook-grid{display:grid;grid-template-columns:1fr 560px;align-items:center;gap:8vw;position:relative}
.facebook-copy .big-title em{color:var(--lime)}
.facebook-copy p:not(.label){max-width:490px;color:#bdbdbd;line-height:1.8}
.facebook-link{display:inline-flex;align-items:center;gap:24px;margin-top:25px;border:1px solid var(--lime);padding:16px 20px;color:var(--lime);font-size:11px;font-weight:1000;letter-spacing:.12em;box-shadow:7px 7px #8a5c10;transition:.25s}
.facebook-link:hover{background:var(--lime);color:#080808;transform:translateY(-5px)}
.facebook-frame{width:100%;max-width:560px;min-height:720px;padding:20px;background:linear-gradient(145deg,#252525,#080808);border:1px solid #ffd95a88;box-shadow:-18px 22px 0 #9d6913,0 35px 70px #000;transform:perspective(1200px) rotateY(-5deg);transition:.35s}
.facebook-frame:hover{transform:perspective(1200px) rotateY(0) translateY(-7px)}
.facebook-frame iframe{display:block;width:100%;height:680px;border:0;background:#fff}
@media(max-width:1000px){.facebook-grid{grid-template-columns:1fr}.facebook-frame{margin:20px auto 0;transform:none}}
@media(max-width:560px){.facebook-frame{min-height:590px;padding:10px}.facebook-frame iframe{height:570px}}

/* Hip-hop turntablism feature */
.decks-section{background:linear-gradient(125deg,#050505 0,#111820 48%,#030303 100%);position:relative;overflow:hidden;border-top:1px solid #ffd95a35;border-bottom:1px solid #ffd95a35}
.decks-section:before{content:"HIP HOP";position:absolute;left:-2vw;bottom:-4vw;font:1000 clamp(90px,18vw,280px)/.75 Arial;color:#ffffff05;letter-spacing:-.09em;white-space:nowrap}
.decks-grid{display:grid;grid-template-columns:.8fr 1.4fr;gap:5vw;align-items:center;position:relative}
.genre-pills{display:flex;flex-wrap:wrap;gap:10px;margin:32px 0}
.genre-pills span{padding:11px 15px;border:1px solid #ffd95a70;color:#ffd95a;font-size:10px;font-weight:1000;letter-spacing:.15em;transform:skew(-4deg);background:#0008}
.genre-pills span:nth-child(even){background:#ffd95a;color:#080808}
.deck-copy>p:not(.label){color:#aaa;line-height:1.8;max-width:520px}
.deck-art{position:relative;min-height:560px;display:flex;align-items:center;justify-content:center;perspective:1400px}
.deck-art:before,.deck-art:after{content:"";position:absolute;border-radius:50%;border:1px solid #ffd95a55;box-shadow:0 0 55px #ffd95a20}
.deck-art:before{width:440px;height:440px;right:8%;top:7%;animation:spin 24s linear infinite}
.deck-art:after{width:290px;height:290px;left:1%;bottom:2%;animation:spin 16s linear infinite reverse}
.deck-art img{position:relative;z-index:2;width:115%;max-width:none;height:auto;filter:drop-shadow(0 40px 45px #000);transform:perspective(1400px) rotateY(-7deg) rotateX(4deg);transition:.4s}
.deck-art:hover img{transform:perspective(1400px) rotateY(-1deg) rotateX(1deg) translateY(-10px) scale(1.02)}
.beat-line{height:44px;display:flex;align-items:center;gap:5px;margin-top:28px}
.beat-line i{display:block;width:7px;height:35%;background:#ffd95a;animation:beat .75s ease-in-out infinite alternate}
.beat-line i:nth-child(2n){height:90%;animation-delay:.15s}.beat-line i:nth-child(3n){height:55%;animation-delay:.3s}.beat-line i:nth-child(5n){height:100%;animation-delay:.45s}
@keyframes beat{to{height:18%;opacity:.55}}
@media(max-width:980px){.decks-grid{grid-template-columns:1fr}.deck-art{min-height:430px}.deck-art img{width:100%;transform:none}}
@media(max-width:560px){.deck-art{min-height:300px}.genre-pills span{font-size:9px}.deck-art:before{width:280px;height:280px}.deck-art:after{width:180px;height:180px}}