/*
Theme Name: Big Keef Official
Theme URI: https://bigkeef.com
Author: 360 Brand Advancement & Management
Description: Official custom WordPress theme for Big Keef.
Version: 1.0.0
Text Domain: big-keef-official
*/

:root { --black:#0a0a0a; --cream:#f5e8ca; --gold:#fdba13; --red:#e21c2a; --white:#fffaf0; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; overflow-x:hidden; background:var(--black); color:var(--cream); font-family:Arial, Helvetica, sans-serif; }
body::selection { background:var(--gold); color:var(--black); }
a { color:inherit; }
img { max-width:100%; display:block; user-select:none; -webkit-user-drag:none; }
.site-header { position:sticky; top:0; z-index:30; min-height:76px; padding:12px clamp(18px,4vw,64px); display:grid; grid-template-columns:170px 1fr auto; gap:30px; align-items:center; background:rgba(10,10,10,.94); border-bottom:1px solid rgba(253,186,19,.32); backdrop-filter:blur(12px); }
.brand img { width:150px; }
nav { display:flex; justify-content:center; gap:clamp(14px,3vw,38px); }
nav a { text-decoration:none; text-transform:uppercase; letter-spacing:.14em; font-size:.72rem; font-weight:900; }
nav a:hover { color:var(--gold); }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:52px; padding:0 25px; border:0; border-radius:3px; background:var(--gold); color:var(--black); font:900 .82rem/1 Arial,sans-serif; text-decoration:none; text-transform:uppercase; letter-spacing:.08em; cursor:pointer; box-shadow:5px 5px 0 var(--red); transition:transform .18s,box-shadow .18s; }
.button:hover { transform:translate(3px,3px); box-shadow:2px 2px 0 var(--red); }
.button-small { min-height:42px; padding:0 18px; font-size:.7rem; }
.hero { min-height:calc(100svh - 76px); display:grid; grid-template-columns:1.05fr .95fr; overflow:hidden; background:radial-gradient(circle at 74% 45%,#282012 0 23%,var(--black) 54%); }
.hero-copy { padding:clamp(70px,10vw,150px) clamp(24px,6vw,96px); display:flex; flex-direction:column; justify-content:center; align-items:flex-start; position:relative; z-index:2; }
.hero-logo { width:min(590px,92%); margin:15px 0 30px; }
.eyebrow { color:var(--gold); text-transform:uppercase; letter-spacing:.25em; font-size:.7rem; font-weight:900; }
h1,h2 { margin:0; text-transform:uppercase; font-family:"Arial Black", Impact, Haettenschweiler, sans-serif; font-weight:900; letter-spacing:-.025em; line-height:.93; }
h1 { max-width:700px; font-size:clamp(3rem,6.2vw,7.2rem); }
h2 { font-size:clamp(3.4rem,7vw,7.6rem); }
.lede { max-width:660px; font-size:clamp(1.05rem,1.6vw,1.35rem); line-height:1.65; color:#e5dbc4; }
.hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:28px; margin-top:18px; }
.text-link { font-weight:900; text-transform:uppercase; letter-spacing:.09em; text-decoration:none; border-bottom:2px solid var(--gold); padding-bottom:7px; }
.hero-portrait { min-height:640px; position:relative; display:flex; align-items:flex-end; justify-content:center; padding-top:30px; }
.hero-portrait::before { content:""; position:absolute; width:70%; aspect-ratio:1; border:8px solid var(--gold); border-radius:50%; top:14%; left:16%; opacity:.58; }
.hero-portrait img { position:relative; z-index:2; width:100%; height:100%; object-fit:cover; object-position:center 18%; filter:drop-shadow(0 30px 35px #000); }
.hero-portrait p { position:absolute; z-index:4; right:5%; bottom:7%; padding:12px 16px; background:var(--red); color:white; transform:rotate(-3deg); font-weight:900; text-transform:uppercase; letter-spacing:.12em; }
.burst { position:absolute; z-index:1; color:var(--gold); font:900 16rem/1 Impact; opacity:.08; }
.burst-one { left:3%; top:3%; transform:rotate(-17deg); }.burst-two { right:2%; top:42%; transform:rotate(18deg); }
.ticker { min-height:58px; display:flex; align-items:center; justify-content:space-around; gap:22px; padding:14px 24px; background:var(--gold); color:var(--black); text-transform:uppercase; font-weight:900; letter-spacing:.12em; overflow:hidden; white-space:nowrap; }
.ticker i { color:var(--red); }
.new-look{display:grid;grid-template-columns:repeat(4,1fr);background:#fff;gap:5px;padding:5px}.new-look figure{position:relative;margin:0;min-height:420px;overflow:hidden;background:#eee}.new-look img{width:100%;height:100%;object-fit:cover;object-position:center top}.new-look figcaption{position:absolute;left:0;bottom:0;padding:14px 18px;background:var(--black);color:var(--gold);font-weight:900;text-transform:uppercase;letter-spacing:.16em;font-size:.68rem}
.section { padding:clamp(80px,10vw,150px) clamp(24px,6vw,96px); }
.split { display:grid; grid-template-columns:.75fr 1.25fr; gap:clamp(40px,8vw,130px); background:var(--cream); color:var(--black); }
.split .eyebrow,.merch .eyebrow { color:var(--red); }
.body-copy { max-width:790px; font-size:clamp(1.1rem,1.7vw,1.45rem); line-height:1.7; }
.stats { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:45px; }
.stats div { padding:24px 15px; border-top:5px solid var(--gold); background:#0a0a0a; color:var(--cream); }
.stats strong,.stats span { display:block; }.stats span { margin-top:8px; font-size:.8rem; opacity:.75; }
.live { display:grid; grid-template-columns:1fr 1fr; gap:0; padding:0; background:var(--red); }
.live-photo { min-height:720px; overflow:hidden; background:var(--white); }
.live-photo img { width:100%; height:100%; object-fit:cover; object-position:center 15%; }
.live-card { padding:clamp(70px,8vw,130px); display:flex; flex-direction:column; justify-content:center; align-items:flex-start; }
.live-card .eyebrow { color:var(--cream); }.live-card p,.live-card li { font-size:1.08rem; line-height:1.7; }.live-card ul { padding-left:20px; margin-bottom:30px; }.live-card .button { background:var(--black); color:var(--cream); box-shadow:5px 5px 0 var(--gold); }
.watch { display:grid; grid-template-columns:.75fr 1.25fr; gap:clamp(40px,7vw,100px); align-items:center; background:linear-gradient(125deg,#070707 0 56%,#191203 56%); }
.watch-copy p:not(.eyebrow) { max-width:620px; line-height:1.7; font-size:1.08rem; }.watch-actions { display:flex; flex-wrap:wrap; align-items:center; gap:28px; margin-top:28px; }
.video-frame { position:relative; aspect-ratio:16/9; border:8px solid var(--cream); box-shadow:16px 16px 0 var(--red); overflow:hidden; }.video-frame iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.gallery-section { background:#101010; }
.section-heading { display:grid; grid-template-columns:1.1fr .9fr; gap:50px; align-items:end; margin-bottom:55px; }.section-heading>p { max-width:600px; line-height:1.7; color:#c8bea9; }
.gallery-grid { height:870px; display:grid; grid-template-columns:1.25fr .85fr .85fr; grid-template-rows:1fr 1fr; gap:14px; }
.gallery-item { border:0; padding:0; cursor:zoom-in; overflow:hidden; background:#222; }.gallery-item img { width:100%; height:100%; object-fit:cover; object-position:center top; transition:transform .5s; }.gallery-item:hover img { transform:scale(1.035); }.item-1 { grid-row:1/3; }.item-2 { grid-column:2/4; }.item-4 { display:none; }
.merch { display:grid; grid-template-columns:.7fr 1.3fr; align-items:center; gap:60px; background:var(--cream); color:var(--black); }.merch p:not(.eyebrow):not(.handle) { font-size:1.15rem; line-height:1.7; }.merch img { border:10px solid var(--black); box-shadow:14px 14px 0 var(--red); }.handle { color:var(--red); font-weight:900; letter-spacing:.16em; }
.booking { display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(45px,8vw,110px); background:linear-gradient(135deg,#111 0 62%,#181202 62%); }
.booking-copy>p { line-height:1.7; max-width:580px; }.management-link { display:block; margin:32px 0 18px; color:var(--gold); font:900 clamp(1.4rem,2.5vw,2.4rem)/1.05 Impact,sans-serif; text-transform:uppercase; text-decoration:none; }.contact-line { display:flex; flex-wrap:wrap; gap:12px; font-weight:800; }.contact-line a { text-decoration:none; }
form { background:var(--cream); color:var(--black); padding:clamp(28px,4vw,56px); box-shadow:12px 12px 0 var(--red); }.field-pair { display:grid; grid-template-columns:1fr 1fr; gap:18px; } label { display:block; font-weight:900; text-transform:uppercase; font-size:.7rem; letter-spacing:.1em; margin-bottom:17px; } input,textarea { width:100%; margin-top:7px; padding:14px; border:2px solid var(--black); background:#fffaf0; color:var(--black); font:1rem Arial; } textarea { resize:vertical; } form small { display:block; margin-top:16px; line-height:1.5; opacity:.7; }
footer { min-height:160px; padding:35px clamp(24px,6vw,96px); display:grid; grid-template-columns:170px 1fr auto; align-items:center; gap:30px; border-top:1px solid #312b1d; font-size:.75rem; color:#b7aa91; } footer>img { width:150px; } footer a { color:var(--gold); }.footer-brands{display:flex;align-items:center;gap:16px}.footer-brands img:first-child{width:76px;border-radius:50%}.footer-brands img:last-child{width:170px;filter:brightness(0) invert(1)}
.lightbox { position:fixed; inset:0; z-index:100; display:flex; align-items:center; justify-content:center; padding:60px; background:rgba(0,0,0,.94); }.lightbox img { max-height:88vh; max-width:84vw; object-fit:contain; }.lightbox-close,.lightbox-arrow { position:absolute; border:0; background:var(--gold); color:var(--black); cursor:pointer; font-weight:900; }.lightbox-close { right:25px; top:20px; width:45px; height:45px; font-size:2rem; }.lightbox-arrow { top:50%; width:50px; height:70px; font-size:3rem; }.previous { left:25px; }.next { right:25px; }

@media(max-width:900px){
  .site-header { grid-template-columns:130px 1fr; }.site-header nav { display:none; }.site-header>.button { justify-self:end; }.brand img { width:125px; }
  .hero { grid-template-columns:1fr; }.hero-copy { padding-bottom:30px; }.hero-portrait { min-height:720px; }.hero-portrait img { max-height:720px; }.new-look{grid-template-columns:1fr 1fr}.new-look figure{min-height:460px}
  .split,.live,.watch,.merch,.booking { grid-template-columns:1fr; }.live-photo { min-height:580px; }.section-heading { grid-template-columns:1fr; }
  .gallery-grid { height:auto; grid-template-columns:1fr 1fr; grid-template-rows:420px 300px 300px; }.item-1 { grid-row:1; grid-column:1/3; }.item-2 { grid-column:1/3; }.item-4 { display:block; }
  footer { grid-template-columns:1fr; text-align:center; justify-items:center; }
}
@media(max-width:560px){
  .site-header { min-height:66px; padding:10px 14px; }.button-small { padding:0 11px; min-height:38px; font-size:.62rem; }
  .hero { min-height:auto; }.hero-copy { padding:65px 22px 25px; }.hero-logo { margin-bottom:20px; }.hero-portrait { min-height:470px; }.hero-portrait p { right:3%; bottom:3%; font-size:.65rem; }
  .ticker { justify-content:flex-start; overflow-x:auto; }.new-look{grid-template-columns:1fr}.new-look figure{min-height:520px}.section { padding:75px 22px; } h2 { font-size:3.5rem; }
  .stats,.field-pair { grid-template-columns:1fr; }.live-photo { min-height:460px; }.live-card { padding:70px 24px; }
  .gallery-grid { grid-template-columns:1fr; grid-template-rows:repeat(5,380px); }.gallery-item,.item-1,.item-2 { grid-column:auto; grid-row:auto; }.item-4 { display:block; }
  .merch { gap:35px; }.booking { padding-bottom:90px; }.lightbox { padding:70px 12px; }.lightbox img { max-width:96vw; }.lightbox-arrow { top:auto; bottom:20px; }
}
@media(prefers-reduced-motion:reduce){ html { scroll-behavior:auto; } * { transition:none !important; } }

.lightbox[hidden] { display: none !important; }
