/*
Theme Name: Fresh Unit Entertainment
Theme URI: https://freshunitworldballer.com
Author: BrandEngine
Author URI: https://brandengineworks.com
Description: Custom theme for Fresh Unit Entertainment Ltd. Includes an Events manager (dates, flyers, venues, lineups) that sorts events into Upcoming, Regular nights and Past automatically, plus Customizer settings for contact details.
Version: 1.1.0
Requires at least: 6.2
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: fresh-unit
*/

/* Brand-card look: black ground, royal-blue brush slashes, chrome type */
:root{
  --black:#07090f; --ink-2:#0e1320; --panel:#141b2d; --line:#26324d;
  --white:#f4f7ff; --muted:#a3b0cc; --blue:#2f6bff; --blue-2:#1546c9; --sky:#8fb3ff;
  --chrome:linear-gradient(180deg,#ffffff 0%,#c9d6f2 45%,#7f93bd 55%,#e8eeff 100%);
  --display:"Big Shoulders Display","Impact","Arial Narrow",sans-serif;
  --body:"Work Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--black);color:var(--white);font-family:var(--body);font-size:16px;line-height:1.6;margin:0}
a{color:inherit}
img,video{max-width:100%;height:auto;display:block}
:focus-visible{outline:2px solid var(--sky);outline-offset:3px}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}
.fu-wrap{max-width:1180px;margin:0 auto;padding-inline:20px}
.fu h1,.fu h2,.fu h3{font-family:var(--display);text-transform:uppercase;line-height:.95;margin:0;text-wrap:balance;letter-spacing:.01em}
.fu h2{font-size:clamp(2.6rem,6vw,4.4rem);font-weight:900}
.fu-h2-sm{font-size:clamp(2rem,4.5vw,3rem)!important}
.eyebrow{font-size:.78rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--sky);margin:0 0 .6rem}
.fu section{padding-block:76px}
.lede{color:var(--muted);max-width:60ch;margin:1rem 0 0}
.chrome{background:var(--chrome);-webkit-background-clip:text;background-clip:text;color:transparent}
.slash{height:14px;background:repeating-linear-gradient(-55deg,var(--blue) 0 22px,transparent 22px 34px,var(--white) 34px 40px,transparent 40px 58px)}

/* header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(7,9,15,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.admin-bar .site-header{top:32px}
@media (max-width:782px){.admin-bar .site-header{top:46px}}
@media (max-width:600px){.admin-bar .site-header{top:0}}
.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:10px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand img{height:54px;width:auto}
.brand b{font-family:var(--display);font-weight:900;font-size:1.35rem;text-transform:uppercase;line-height:1;display:block}
.brand small{display:block;font-size:.62rem;letter-spacing:.22em;color:var(--muted);text-transform:uppercase}
.nav ul{display:flex;gap:22px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.nav ul a{text-decoration:none;font-size:.9rem;font-weight:500;color:var(--muted)}
.nav ul a:hover,.nav ul .current-menu-item a{color:var(--white)}
.btn{display:inline-flex;align-items:center;gap:8px;background:var(--blue);color:#fff;font-weight:600;text-decoration:none;padding:12px 22px;border-radius:6px;font-size:.95rem;border:0;cursor:pointer;transform:skewX(-8deg)}
.btn > span{transform:skewX(8deg);display:inline-block}
.btn:hover{background:var(--blue-2);color:#fff}
.btn.ghost{background:transparent;border:1px solid var(--line)}
.btn.ghost:hover{border-color:var(--sky)}

/* hero */
.hero{position:relative;overflow:hidden;padding-block:56px 48px!important;isolation:isolate}
.hero::before{content:"";position:absolute;inset:-20% -10%;z-index:-1;background:repeating-linear-gradient(-55deg,transparent 0 60px,rgba(47,107,255,.35) 60px 130px,transparent 130px 170px,rgba(244,247,255,.12) 170px 186px,transparent 186px 260px);filter:blur(1.5px);opacity:.8}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,var(--black) 30%,rgba(7,9,15,.5))}
.hero-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:40px;align-items:center}
.fu .hero h1{font-size:clamp(3.2rem,8.5vw,6.8rem);font-weight:900}
.hero h1 .o{display:block;-webkit-text-stroke:2px var(--sky);color:transparent}
.hero p{color:var(--muted);max-width:48ch;font-size:1.08rem;margin:22px 0 0}
.ctas{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.hero-logo{width:min(100%,360px);justify-self:center;filter:drop-shadow(0 20px 50px rgba(47,107,255,.45))}
.since{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:.8rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);border-top:1px solid var(--line);padding-top:14px;margin-top:44px}

/* events */
.ev-head{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap}
.ev-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:36px}
.ev{background:var(--panel);border:1px solid var(--line);border-radius:10px;overflow:hidden;display:flex;flex-direction:column;min-width:0;text-decoration:none;color:inherit}
.ev .pic{aspect-ratio:4/5;overflow:hidden;background:var(--ink-2);position:relative}
.ev .pic img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .4s}
.ev:hover .pic img{transform:scale(1.04)}
.ev .nopic{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--display);font-size:1.6rem;color:var(--line);text-transform:uppercase}
.date{position:absolute;left:10px;top:10px;background:var(--blue);color:#fff;border-radius:6px;padding:6px 10px;text-align:center;font-family:var(--display);line-height:1;box-shadow:0 6px 18px rgba(0,0,0,.4)}
.date b{display:block;font-size:1.7rem;font-weight:900}
.date small{font-size:.75rem;font-weight:800;letter-spacing:.12em}
.ev .body{padding:16px 16px 18px;display:flex;flex-direction:column;gap:6px;flex:1}
.fu .ev h3{font-size:1.5rem;font-weight:800}
.ev .meta{font-size:.85rem;color:var(--muted);margin:0}
.ev .meta strong{color:var(--white);font-weight:600}
.ev .lineup{font-size:.8rem;color:var(--sky);margin:4px 0 0}
.pill{align-self:flex-start;font-size:.68rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;padding:4px 10px;border-radius:999px;border:1px solid var(--line);color:var(--muted)}
.pill.soon{border-color:var(--blue);color:#fff;background:var(--blue-2)}
.empty{color:var(--muted);margin-top:24px}
.weekly{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:22px}
.wk{display:grid;grid-template-columns:130px 1fr;gap:18px;background:var(--panel);border:1px solid var(--line);border-radius:10px;overflow:hidden;min-width:0;text-decoration:none;color:inherit}
.wk img{width:100%;height:100%;object-fit:cover;object-position:top;aspect-ratio:4/5}
.wk > div{padding:16px 16px 16px 0;min-width:0}
.fu .wk h3{font-size:1.5rem;font-weight:800;margin:6px 0}
.wk p{margin:0;font-size:.88rem;color:var(--muted)}
.past{background:var(--ink-2)}
.past .ev-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
.fu .past .ev h3{font-size:1.15rem}
.past .ev .body{padding:12px}
.past .date{transform:scale(.8);transform-origin:top left}
.all-link{margin-top:28px}

/* services */
.svc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:40px}
.svc{background:var(--black);padding:28px 24px;display:flex;flex-direction:column;gap:10px;min-width:0}
.fu .svc h3{font-size:1.7rem;font-weight:800}
.svc p{margin:0;color:var(--muted);font-size:.95rem}
.tag{font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--sky);font-weight:600}
.occ{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.occ span{border:1px solid var(--line);border-radius:999px;padding:8px 16px;font-size:.9rem;background:var(--panel)}

/* about */
.about{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.about p{color:var(--muted);margin:0 0 1rem;max-width:60ch}
.photos{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.photos figure{margin:0;border-radius:10px;overflow:hidden;border:1px solid var(--line);min-width:0}
.photos figure:first-child{grid-column:1/-1}
.photos img{width:100%;height:100%;object-fit:cover}
.photos figcaption{font-size:.75rem;color:var(--muted);padding:8px 12px;background:var(--panel)}
.people{display:grid;gap:12px;margin-top:24px}
.person{display:flex;gap:16px;align-items:center;border-top:1px solid var(--line);padding-top:14px}
.person .init{width:52px;height:52px;border-radius:50%;background:var(--blue);display:grid;place-items:center;font-family:var(--display);font-weight:900;font-size:1.3rem;flex:none}
.person b{display:block;font-size:1.05rem}
.person small{color:var(--muted);font-size:.82rem;letter-spacing:.06em;text-transform:uppercase}

/* video */
.vid{display:grid;grid-template-columns:auto 1fr;gap:48px;align-items:center}
.vid video{width:min(320px,100%);border-radius:14px;border:1px solid var(--line);background:#000}
.played{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.played span{font-size:.85rem;padding:6px 12px;border-left:3px solid var(--blue);background:var(--panel)}

/* booking */
.book{background:var(--blue-2);position:relative;overflow:hidden}
.book::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(-55deg,rgba(255,255,255,.06) 0 30px,transparent 30px 80px)}
.book .fu-wrap{position:relative}
.book .eyebrow{color:#dbe5ff}
.fu .book h2{font-size:clamp(3rem,9vw,6.5rem)}
.book-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:40px;border-top:2px solid rgba(255,255,255,.5);padding-top:24px}
.book-grid div{min-width:0}
.book-grid h4{margin:0 0 6px;font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;color:#dbe5ff}
.book-grid p{margin:0;font-weight:600;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.book-grid a{text-decoration:none}
.book .btn{background:#fff;color:var(--blue-2);margin-top:32px}

.site-footer{padding-block:28px;font-size:.85rem;color:var(--muted)}
.site-footer .fu-wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:center}

/* single event + regular pages */
.ev-single{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:48px;align-items:start}
.ev-single .flyer{border-radius:12px;overflow:hidden;border:1px solid var(--line)}
.fu .ev-single h1{font-size:clamp(2.8rem,7vw,5rem);font-weight:900;margin:10px 0 24px}
.facts{display:grid;gap:14px;margin:0}
.facts div{border-top:1px solid var(--line);padding-top:10px}
.facts dt{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.facts dd{margin:2px 0 0;font-weight:600;font-size:1.05rem}
.entry{max-width:760px}
.entry a{color:var(--sky)}
.entry h1{font-size:clamp(2.6rem,6vw,4rem);font-weight:900;margin-bottom:24px}
.entry h2,.entry h3{margin:1.6em 0 .5em}
.pagination{display:flex;gap:10px;margin-top:32px}
.pagination a,.pagination span{padding:8px 14px;border:1px solid var(--line);border-radius:6px;text-decoration:none}

@media (max-width:1000px){.ev-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:820px){
  .hero-grid,.about,.vid,.weekly,.ev-single{grid-template-columns:1fr}
  .hero-logo{width:220px;justify-self:start;order:-1}
  .ev-grid,.svc-grid{grid-template-columns:repeat(2,1fr)}
  .book-grid{grid-template-columns:repeat(2,1fr)}
  .vid video{width:100%;max-width:360px}
}
@media (max-width:520px){
  .svc-grid,.book-grid{grid-template-columns:1fr}
  .past .ev-grid{grid-template-columns:repeat(2,1fr)}
  .nav ul{gap:14px}
  .fu section{padding-block:56px}
  .wk{grid-template-columns:100px 1fr}
}
@media (max-width:600px){.nav > .btn{display:none}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.ev .pic img{transition:none}}
