/* ── RESET & BASE ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Raleway',sans-serif;font-weight:400;color:#1c1c1c;background:#fff}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
:root{--gold:#c9a84b;--dark:#111;--light:#f9f7f4;--border:#e8e3db;--mid:#666;--green:#355E3B}

/* ── NAV ── */
.nav{position:sticky;top:0;z-index:200;background:#fff;border-bottom:1px solid var(--border);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 2.5rem;height:64px}
.nav-logo{display:flex;align-items:center;gap:0.5rem}
.nav-logo img{height:34px;width:auto}
.nav-logo-text{font-family:'Cormorant Garamond',serif;font-size:1.5rem;font-weight:700;letter-spacing:0.05em;color:var(--dark)}
.nav-logo-text em{color:var(--gold);font-style:normal}
.nav-links{display:flex;gap:2rem;list-style:none;justify-self:center;align-items:center}
.nav-links a{font-size:0.76rem;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;color:#444;transition:color 0.2s}
.nav-links a:hover{color:var(--gold)}
.nav-ctas{display:flex;gap:0.6rem;justify-self:end;align-items:center}
.nbtn{font-family:'Raleway',sans-serif;font-size:0.72rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;padding:0.48rem 1.1rem;border:1.5px solid var(--dark);cursor:pointer;background:transparent;color:var(--dark);transition:all 0.2s;display:inline-block}
.nbtn:hover{background:var(--dark);color:#fff}
.nbtn.fill{background:var(--dark);color:#fff}
.nbtn.fill:hover{background:#2a2a2a}
.nav-hamburger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:4px}
.nav-hamburger span{display:block;width:22px;height:2px;background:var(--dark);transition:all 0.2s}
.mobile-nav{display:none;position:fixed;top:64px;left:0;right:0;background:#fff;border-bottom:1px solid var(--border);z-index:199;padding:1.5rem 2.5rem}
.mobile-nav.open{display:block}
.mobile-nav ul{list-style:none;display:flex;flex-direction:column;gap:1.2rem}
.mobile-nav a{font-size:0.88rem;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;color:#444}

/* ── BUTTONS ── */
.btn-white{background:#fff;color:var(--dark);font-family:'Raleway',sans-serif;font-size:0.78rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;padding:0.85rem 2.2rem;border:none;cursor:pointer;transition:background 0.2s;display:inline-block}
.btn-white:hover{background:#f0ece4}
.btn-dark{background:var(--dark);color:#fff;font-family:'Raleway',sans-serif;font-size:0.78rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;padding:0.85rem 2.2rem;border:none;cursor:pointer;transition:background 0.2s;display:inline-block}
.btn-dark:hover{background:#2a2a2a}
.btn-outline-dark-link{border:1.5px solid var(--dark);color:var(--dark);font-family:'Raleway',sans-serif;font-size:0.78rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;padding:0.82rem 2rem;display:inline-block;transition:all 0.2s}
.btn-outline-dark-link:hover{background:var(--dark);color:#fff}

/* ── HERO (homepage) ── */
.hero{position:relative;overflow:hidden;min-height:90vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}
.hero-bg{position:absolute;inset:0;background:url('https://images.unsplash.com/photo-1415201364774-f6f0bb35f28f?w=1800&q=85') center 30%/cover no-repeat;filter:brightness(0.38)}
.hero-content{position:relative;z-index:1;padding:5rem 2rem 0;max-width:780px}
.hero h1{font-family:'Cormorant Garamond',serif;font-size:clamp(2.8rem,5.5vw,4.6rem);font-weight:700;line-height:1.1;color:#fff;margin-bottom:1rem}
.hero-sub{font-size:1rem;color:rgba(255,255,255,0.65);margin-bottom:2.2rem;line-height:1.65}
.hero-stats{position:relative;z-index:1;display:flex;justify-content:center;width:100%;max-width:620px;border-top:1px solid rgba(255,255,255,0.15);margin-top:3.5rem;padding:2.5rem 0 4rem}
.hstat{flex:1;text-align:center;padding:0 1.5rem}
.hstat+.hstat{border-left:1px solid rgba(255,255,255,0.15)}
.hstat-label{font-size:0.65rem;font-weight:600;letter-spacing:0.18em;text-transform:uppercase;color:rgba(255,255,255,0.38);display:block;margin-bottom:0.4rem}
.hstat-num{font-family:'Cormorant Garamond',serif;font-size:2.6rem;font-weight:700;color:var(--gold);line-height:1;display:block}

/* ── PAGE HERO ── */
.page-hero{position:relative;overflow:hidden;min-height:52vh;display:flex;align-items:flex-end;justify-content:center;text-align:center}
.page-hero-short{min-height:38vh}
.page-hero-bg{position:absolute;inset:0;background-size:cover;background-position:center 30%;filter:brightness(0.35)}
.page-hero-content{position:relative;z-index:1;padding:4rem 2rem 4rem;max-width:720px}
.page-hero-content h1{font-family:'Cormorant Garamond',serif;font-size:clamp(2.4rem,5vw,4rem);font-weight:700;color:#fff;margin-bottom:0.8rem;line-height:1.1}
.page-hero-content p{font-size:0.97rem;color:rgba(255,255,255,0.6);line-height:1.65}

/* ── UNLOCK ── */
.unlock{background:var(--light);padding:5.5rem 2rem;text-align:center;border-bottom:1px solid var(--border)}
.unlock h2{font-family:'Cormorant Garamond',serif;font-size:clamp(1.9rem,3.5vw,2.8rem);font-weight:700;color:var(--dark);max-width:680px;margin:0 auto 1rem;line-height:1.25}
.unlock p{font-size:0.96rem;color:var(--mid);max-width:480px;margin:0 auto 2.2rem;line-height:1.75}

/* ── FEATURE SPLIT ── */
.feat-split{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--border)}
.fp{padding:4rem 3.5rem;display:flex;flex-direction:column;gap:1.2rem;border-right:1px solid var(--border)}
.fp:last-child{border-right:none}
.fp-img{width:100%;height:260px;object-fit:cover}
.fp-accent{width:2.4rem;height:3px;background:var(--gold)}
.fp h3{font-family:'Cormorant Garamond',serif;font-size:1.5rem;font-weight:700;color:var(--dark)}
.fp p{font-size:0.91rem;color:var(--mid);line-height:1.75}

/* ── LAPTOP ── */
.laptop-wrap{width:100%;height:260px;display:flex;align-items:center;justify-content:center;background:var(--light)}
.laptop{width:280px;position:relative}
.laptop-screen{background:#1a1a2e;border-radius:8px 8px 0 0;border:3px solid #333;padding:14px;box-shadow:0 4px 20px rgba(0,0,0,0.3)}
.laptop-screen::before{content:'';width:8px;height:8px;border-radius:50%;background:#444;display:block;margin:0 auto 10px}
.screen-inner{background:#fff;border-radius:3px;padding:10px;min-height:130px}
.screen-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;padding-bottom:6px;border-bottom:1px solid #eee}
.screen-logo-text{font-family:'Cormorant Garamond',serif;font-size:0.85rem;font-weight:700;color:#111}
.screen-logo-text em{color:var(--gold);font-style:normal}
.screen-dot{width:6px;height:6px;border-radius:50%;background:var(--gold)}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-top:6px}
.cal-day-header{font-size:0.38rem;font-weight:700;text-align:center;color:#999;padding:1px}
.cal-day{font-size:0.4rem;text-align:center;padding:2px 1px;color:#555;border-radius:2px}
.cal-day.has-gig{background:var(--gold);color:#fff;font-weight:700}
.cal-day.today{border:1px solid var(--dark);color:var(--dark);font-weight:700}
.laptop-base{background:linear-gradient(to bottom,#c8c8c8,#b0b0b0);height:12px;border-radius:0 0 4px 4px;border:2px solid #bbb;border-top:none;position:relative}
.laptop-base::after{content:'';position:absolute;bottom:-8px;left:50%;transform:translateX(-50%);width:80px;height:6px;background:linear-gradient(to bottom,#b0b0b0,#999);border-radius:0 0 4px 4px}

/* ── PROCESS ── */
.process{padding:6rem 0;background:#fff;border-bottom:1px solid var(--border);overflow:hidden}
.process-header{padding:0 3.5rem;margin-bottom:3.5rem;display:flex;justify-content:space-between;align-items:flex-end}
.sec-eyebrow{font-size:0.68rem;font-weight:700;letter-spacing:0.22em;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:0.5rem}
.process-header h2{font-family:'Cormorant Garamond',serif;font-size:clamp(1.8rem,3vw,2.4rem);font-weight:700;color:var(--dark)}
.process-nav{display:flex;gap:0.5rem}
.pnav-btn{width:42px;height:42px;border:1.5px solid var(--border);background:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1rem;color:var(--dark);transition:all 0.2s}
.pnav-btn:hover{background:var(--dark);color:#fff;border-color:var(--dark)}
.pnav-btn:disabled{opacity:0.3;cursor:default}
.process-slider-wrap{overflow:hidden}
.process-slider{display:flex;transition:transform 0.45s cubic-bezier(0.4,0,0.2,1)}
.process-step{min-width:50%;padding:0 3.5rem 3.5rem;flex-shrink:0;border-right:1px solid var(--border)}
.process-step:last-child{border-right:none}
.ps-img{width:100%;height:200px;object-fit:cover;margin-bottom:2rem}
.ps-tag{font-size:0.65rem;font-weight:700;letter-spacing:0.18em;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:0.5rem}
.process-step h4{font-family:'Cormorant Garamond',serif;font-size:1.2rem;font-weight:700;color:var(--dark);margin-bottom:0.7rem}
.process-step p{font-size:0.88rem;color:var(--mid);line-height:1.75}
.step-cta{margin-top:1.4rem;display:inline-block;font-size:0.74rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--dark);border-bottom:1.5px solid var(--gold);padding-bottom:0.15rem;transition:color 0.2s}
.step-cta:hover{color:var(--gold)}

/* ── PERKS ── (gradient matched to closing-cta v3.14) */
.perks{background:
    linear-gradient(rgba(17,17,17,0.55), rgba(17,17,17,0.75)),
    radial-gradient(circle at 30% 50%, var(--green) 0%, var(--dark) 70%);
  padding:5rem 2rem;border-bottom:1px solid rgba(0,0,0,0.15)}
.perks-inner{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(255,255,255,0.16);border:1px solid rgba(255,255,255,0.16)}
.perk-cell{background:transparent;padding:3rem 2.8rem}
.perk-cell h4{font-family:'Cormorant Garamond',serif;font-size:1.3rem;font-weight:700;color:var(--gold);margin-bottom:0;min-height:1.4em}
.perk-cell .pk-sub{font-size:0.7rem;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:var(--light);margin-top:0.6rem;margin-bottom:0.9rem;display:block;opacity:0.85}
.perk-cell p{font-size:0.87rem;color:rgba(249,247,244,0.78);line-height:1.75}

/* ── LOGOS ── */
.logos{padding:3.5rem 2rem;background:var(--light);border-bottom:1px solid var(--border)}
.logos-inner{max-width:1100px;margin:0 auto}
.logos-label{font-size:0.67rem;font-weight:700;letter-spacing:0.2em;text-transform:uppercase;color:#bbb;text-align:center;margin-bottom:2.2rem}
.logos-row{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:1rem}
.logo-box{height:52px;width:150px;border:1px solid var(--border);background:#fff;display:flex;align-items:center;justify-content:center;transition:border-color 0.2s;padding:0.5rem}
.logo-box:hover{border-color:#bbb}
.logo-box img{max-height:100%;width:auto;object-fit:contain;filter:grayscale(100%) opacity(0.5);transition:filter 0.2s}
.logo-box:hover img{filter:grayscale(60%) opacity(0.8)}
.logo-box span{font-family:'Cormorant Garamond',serif;font-size:0.88rem;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:#bbb}

/* ── TESTIMONIALS ── */
.testimonials{padding:6rem 2rem;background:#fff;border-bottom:1px solid var(--border)}
.testimonials-inner{max-width:1100px;margin:0 auto}
.t-header{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:3rem;flex-wrap:wrap;gap:1.5rem}
.t-header h2{font-family:'Cormorant Garamond',serif;font-size:clamp(1.8rem,3vw,2.4rem);font-weight:700;color:var(--dark);margin-bottom:0.6rem}
.t-header p{font-size:0.92rem;color:var(--mid);max-width:560px;line-height:1.7}
.t-more{font-size:0.76rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--dark);border-bottom:1.5px solid var(--gold);padding-bottom:0.15rem;white-space:nowrap}
.t-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.t-card{border:1px solid var(--border);padding:2rem;background:#fff;display:flex;flex-direction:column;gap:1rem;transition:box-shadow 0.2s}
.t-card:hover{box-shadow:0 4px 24px rgba(0,0,0,0.07)}
.t-person{display:flex;align-items:center;gap:0.9rem}
.t-avatar{width:46px;height:46px;border-radius:50%;overflow:hidden;flex-shrink:0;background:var(--light)}
.t-avatar img{width:100%;height:100%;object-fit:cover}
.t-name{font-size:0.88rem;font-weight:600;color:var(--dark)}
.t-venue{font-size:0.77rem;color:var(--mid)}
.t-stars{color:var(--gold);font-size:0.85rem;letter-spacing:0.05em}
.t-body{font-size:0.9rem;color:#444;line-height:1.75;font-style:italic}
.t-body::before{content:'\201C'}
.t-body::after{content:'\201D'}

/* ── CLOSING STATS ── */
.closing{background:#111;padding:5rem 2rem;text-align:center;border-top:1px solid #1e1e1e}
.closing-enjoy{font-family:'Cormorant Garamond',serif;font-size:1rem;font-style:italic;color:rgba(255,255,255,0.25);letter-spacing:0.1em;margin-bottom:3rem;display:block}
.closing-grid{display:flex;justify-content:center;border-top:1px solid rgba(255,255,255,0.07);padding-top:3rem;max-width:720px;margin:0 auto}
.cstat{flex:1;padding:0 2rem}
.cstat+.cstat{border-left:1px solid rgba(255,255,255,0.08)}
.cstat-label{font-size:0.65rem;font-weight:700;letter-spacing:0.18em;text-transform:uppercase;color:rgba(255,255,255,0.3);display:block;margin-bottom:0.5rem}
.cstat-num{font-family:'Cormorant Garamond',serif;font-size:3rem;font-weight:700;color:var(--gold);line-height:1}

/* ── TRUMP CARDS ── */
.lineup-intro{padding:2.5rem 2rem 0;text-align:center;background:var(--light);border-bottom:1px solid var(--border)}
.lineup-intro-inner{max-width:600px;margin:0 auto;padding-bottom:2.5rem}
.lineup-intro p{font-size:0.92rem;color:var(--mid);line-height:1.7}
.cards-section{background:var(--light);padding:3rem 2.5rem 5rem}
.cards-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.6rem;max-width:1200px;margin:0 auto}
.card-wrap{perspective:1000px;height:440px;cursor:pointer;position:relative}
.card-inner{position:relative;width:100%;height:100%;transition:transform 0.7s cubic-bezier(0.4,0,0.2,1);transform-style:preserve-3d}
.card-wrap.flipped .card-inner{transform:rotateY(180deg)}
.card-front,.card-back{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:6px;overflow:hidden;box-shadow:0 4px 20px rgba(0,0,0,0.12)}
/* Card front — LineUp branded back */
.card-front{background:var(--dark);display:flex;flex-direction:column;align-items:center;justify-content:center;border:2px solid rgba(201,168,76,0.3)}
.card-front-pattern{position:absolute;inset:0;opacity:0.06;background-image:repeating-linear-gradient(45deg,var(--gold) 0,var(--gold) 1px,transparent 0,transparent 50%);background-size:8px 8px}
.card-front-logo{font-family:'Cormorant Garamond',serif;font-size:1.8rem;font-weight:700;color:#fff;letter-spacing:0.08em;position:relative;z-index:1;text-align:center}
.card-front-logo em{color:var(--gold);font-style:normal}
.card-front-bottom{font-family:'Cormorant Garamond',serif;font-size:0.9rem;font-weight:700;color:rgba(255,255,255,0.25);letter-spacing:0.12em;position:absolute;bottom:1.2rem;transform:rotate(180deg)}
.card-front-bottom em{color:rgba(201,168,76,0.4);font-style:normal}
/* Gold border glow on hover */
.card-wrap:hover .card-front{border-color:rgba(201,168,76,0.7);box-shadow:0 8px 32px rgba(0,0,0,0.2),0 0 0 1px rgba(201,168,76,0.2)}
/* Card back */
.card-back{transform:rotateY(180deg);background:#fff;display:flex;flex-direction:column}
.card-photo{width:100%;height:52%;background-size:cover;background-position:center top;flex-shrink:0}
.card-info{padding:0.9rem;flex:1;display:flex;flex-direction:column;gap:0.55rem;overflow:hidden}
.card-name-row{display:flex;justify-content:space-between;align-items:flex-start;gap:0.5rem}
.card-name{font-family:'Cormorant Garamond',serif;font-size:1rem;font-weight:700;color:var(--dark);line-height:1.2}
.card-type{font-size:0.62rem;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;color:var(--gold);margin-top:0.15rem}
.card-play-btn{width:28px;height:28px;border-radius:50%;background:var(--dark);color:#fff;display:flex;align-items:center;justify-content:center;font-size:0.55rem;flex-shrink:0;transition:background 0.2s;padding-left:1px}
.card-play-btn:hover{background:var(--gold)}
.card-stats{display:flex;flex-direction:column;gap:0.22rem;flex:1}
.cs-row{display:flex;justify-content:space-between;align-items:center}
.cs-label{font-size:0.56rem;font-weight:600;letter-spacing:0.08em;text-transform:uppercase;color:#888}
.cs-stars{font-size:0.58rem;color:var(--gold);letter-spacing:0.05em}
.card-meta-row{display:flex;justify-content:space-between;border-top:1px solid var(--border);padding-top:0.5rem;margin-top:auto}
.card-meta-item{text-align:center;flex:1}
.cmi-val{font-family:'Cormorant Garamond',serif;font-size:1rem;font-weight:700;color:var(--dark);display:block;line-height:1}
.cmi-label{font-size:0.52rem;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;color:#aaa}
/* Placeholder cards */
.card-placeholder{cursor:default}
.card-placeholder .card-front{opacity:0.45}
.card-coming-soon{display:none;position:absolute;bottom:-2rem;left:0;right:0;text-align:center;font-size:0.7rem;color:#aaa;font-weight:600;letter-spacing:0.1em;text-transform:uppercase}
.lineup-cta{background:var(--dark);padding:5rem 2rem;text-align:center}
.lineup-cta h2{font-family:'Cormorant Garamond',serif;font-size:clamp(1.8rem,3vw,2.6rem);font-weight:700;color:#fff;margin-bottom:0.8rem}
.lineup-cta p{font-size:0.95rem;color:rgba(255,255,255,0.5);margin-bottom:2.2rem;line-height:1.7}

/* ── ABOUT PAGE ── */
.about-body{padding:4rem 2rem;background:#fff;border-bottom:1px solid var(--border)}
.about-inner{max-width:1100px;margin:0 auto}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:6rem;align-items:center}
.about-left h2{font-family:'Cormorant Garamond',serif;font-size:clamp(1.9rem,3vw,2.6rem);font-weight:700;color:var(--dark);margin-bottom:1rem;line-height:1.2}
.about-rule{width:3rem;height:3px;background:var(--gold);margin:1.2rem 0}
.about-left p{font-size:0.92rem;color:var(--mid);line-height:1.8;margin-bottom:1rem}
.about-dark{background:var(--green);padding:6rem 2rem;border-bottom:1px solid rgba(0,0,0,0.12)}
.about-dark-inner{max-width:1100px;margin:0 auto}
.about-dark-grid{display:grid;grid-template-columns:1fr 1fr;gap:6rem;align-items:center}
.about-stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(0,0,0,0.2);border:1px solid rgba(0,0,0,0.2)}
.about-stat{background:var(--dark);padding:2.2rem 2rem;text-align:center}
.as-num{font-family:'Cormorant Garamond',serif;font-size:2.8rem;font-weight:700;color:var(--gold);line-height:1;display:block;margin-bottom:0.3rem}
.as-label{font-size:0.68rem;font-weight:700;letter-spacing:0.16em;text-transform:uppercase;color:rgba(255,255,255,0.35)}
.about-values{padding:6rem 2rem;background:var(--light);border-bottom:1px solid var(--border)}
.about-values-inner{max-width:1100px;margin:0 auto}
.about-values h2{font-family:'Cormorant Garamond',serif;font-size:clamp(1.9rem,3vw,2.6rem);font-weight:700;color:var(--dark);margin:0.8rem 0 3rem}
.values-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.value-card{padding:2rem;border:1px solid var(--border);background:#fff;transition:border-color 0.2s}
.value-card:hover{border-color:var(--gold)}
.vc-icon{font-size:1.2rem;color:var(--gold);margin-bottom:0.8rem}
.value-card h4{font-family:'Cormorant Garamond',serif;font-size:1.1rem;font-weight:700;color:var(--dark);margin-bottom:0.4rem}
.value-card p{font-size:0.86rem;color:var(--mid);line-height:1.7}
.about-cta{background:#fff;padding:5rem 2rem;text-align:center;border-top:1px solid var(--border)}
.about-cta h2{font-family:'Cormorant Garamond',serif;font-size:clamp(1.8rem,3vw,2.6rem);font-weight:700;color:var(--dark);margin-bottom:0.8rem}
.about-cta p{font-size:0.95rem;color:var(--mid);margin-bottom:2.2rem}

/* ── CONTACT PAGE ── */
.contact-section{padding:6rem 2rem;background:#fff;border-bottom:1px solid var(--border)}
.contact-inner{max-width:1100px;margin:0 auto}
.contact-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:6rem;align-items:start}
.contact-left h2{font-family:'Cormorant Garamond',serif;font-size:clamp(1.8rem,3vw,2.4rem);font-weight:700;color:var(--dark);margin-bottom:1rem;line-height:1.2}
.contact-rule{width:3rem;height:3px;background:var(--gold);margin:1.2rem 0}
.contact-left p{font-size:0.92rem;color:var(--mid);line-height:1.8;margin-bottom:1.8rem}
.contact-details{display:flex;flex-direction:column;gap:1.2rem}
.cd-item{display:flex;flex-direction:column;gap:0.2rem}
.cd-label{font-size:0.68rem;font-weight:700;letter-spacing:0.16em;text-transform:uppercase;color:#aaa}
.cd-item a{font-size:0.92rem;color:var(--dark);transition:color 0.2s}
.cd-item a:hover{color:var(--gold)}

/* ── FORMS ── */
.lineup-form,.artist-form{display:flex;flex-direction:column;gap:1.2rem}
.form-group{display:flex;flex-direction:column;gap:0.35rem}
.form-row-2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.form-group label{font-size:0.72rem;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:#555}
.req{color:var(--gold)}
input[type="text"],input[type="email"],input[type="url"],input[type="tel"],textarea,select{background:#f9f7f4;border:1px solid var(--border);color:#1c1c1c;padding:0.82rem 1rem;font-family:'Raleway',sans-serif;font-size:0.9rem;font-weight:400;outline:none;transition:border-color 0.2s;-webkit-appearance:none;border-radius:0;width:100%}
input:focus,textarea:focus,select:focus{border-color:var(--gold);background:#fff}
input::placeholder,textarea::placeholder{color:#aaa}
textarea{resize:vertical}
.radio-row{display:flex;flex-wrap:wrap;gap:0.6rem;margin-top:0.2rem}
.radio-opt{display:flex;align-items:center;gap:0.4rem;cursor:pointer;padding:0.45rem 0.9rem;border:1.5px solid var(--border);background:#fff;transition:all 0.2s;font-size:0.8rem;font-weight:600}
.radio-opt:hover{border-color:var(--gold)}
.radio-opt input{display:none}
.radio-opt input:checked+span{color:var(--gold)}
.radio-opt:has(input:checked){border-color:var(--gold);background:#fffbf0}
.form-submit-btn{background:var(--dark);color:#fff;padding:0.95rem 2rem;border:none;cursor:pointer;font-family:'Raleway',sans-serif;font-size:0.82rem;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;transition:background 0.2s;width:100%;margin-top:0.5rem}
.form-submit-btn:hover{background:#2a2a2a}
.form-submit-btn:disabled{background:#aaa;cursor:default}
.form-success{display:flex;align-items:center;gap:0.8rem;background:#f0fff4;border:1px solid #7ec87e;color:#2a7a2a;padding:1rem 1.2rem;font-size:0.88rem;font-weight:600;margin-top:0.5rem}

/* ── ARTIST FORM SPECIFIC ── */
.artist-form-section{padding:5rem 2rem;background:var(--light);border-bottom:1px solid var(--border)}
.artist-form-inner{max-width:860px;margin:0 auto}
.af-intro{margin-bottom:3rem}
.af-intro h2{font-family:'Cormorant Garamond',serif;font-size:2rem;font-weight:700;color:var(--dark);margin-bottom:0.6rem}
.af-intro p{font-size:0.93rem;color:var(--mid);line-height:1.75}
.af-section{background:#fff;border:1px solid var(--border);padding:2.5rem;margin-bottom:1.5rem}
.af-section-title{font-family:'Cormorant Garamond',serif;font-size:1.3rem;font-weight:700;color:var(--dark);margin-bottom:1.4rem;padding-bottom:0.8rem;border-bottom:1px solid var(--border)}
.af-section-sub{font-size:0.86rem;color:var(--mid);line-height:1.7;margin-bottom:1.2rem}
.af-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}
.af-grid-1{display:flex;flex-direction:column;gap:1rem}
.af-col-2{grid-column:span 2}
.checkbox-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:0.5rem;margin-top:0.4rem}
.checkbox-grid-sm{grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}
.checkbox-opt{display:flex;align-items:center;gap:0.5rem;cursor:pointer;padding:0.5rem 0.8rem;border:1.5px solid var(--border);background:#f9f7f4;transition:all 0.2s;font-size:0.8rem;font-weight:500;min-width:0}
.checkbox-opt span{white-space:normal;word-break:keep-all;hyphens:none;line-height:1.2;min-width:0}
.checkbox-opt:hover{border-color:var(--gold)}
.checkbox-opt input{width:14px;height:14px;accent-color:var(--gold);flex-shrink:0}
.checkbox-opt input:checked~span{color:var(--dark);font-weight:600}
.checkbox-opt:has(input:checked){border-color:var(--gold);background:#fffbf0}
.af-video-note{background:#fffbf0;border:1px solid rgba(201,168,76,0.3);padding:1rem 1.2rem;font-size:0.82rem;color:#666;line-height:1.65;margin-top:1rem}
.af-submit-row{padding:0 0 2rem}

/* ── FOOTER ── */
.site-footer{background:var(--dark);border-top:1px solid #1e1e1e;padding:4.5rem 2rem 2.5rem}
.footer-inner{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:3rem;padding-bottom:3rem;border-bottom:1px solid rgba(255,255,255,0.07);margin-bottom:2rem}
.f-logo{font-family:'Cormorant Garamond',serif;font-size:1.4rem;font-weight:700;letter-spacing:0.05em;color:#fff;display:block;margin-bottom:1rem}
.f-logo em{color:var(--gold);font-style:normal}
.f-logo img{height:36px;width:auto;margin-bottom:0.8rem}
.f-brand p{font-size:0.85rem;color:rgba(255,255,255,0.35);line-height:1.75;max-width:260px}
.f-col h5{font-size:0.67rem;font-weight:700;letter-spacing:0.2em;text-transform:uppercase;color:rgba(255,255,255,0.5);margin-bottom:1.2rem}
.f-col ul{list-style:none;display:flex;flex-direction:column;gap:0.65rem}
.f-col a{font-size:0.84rem;color:rgba(255,255,255,0.32);transition:color 0.2s}
.f-col a:hover{color:var(--gold)}
.footer-bottom{max-width:1100px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;font-size:0.75rem;color:rgba(255,255,255,0.2);flex-wrap:wrap;gap:0.5rem}

/* ── SCROLL REVEAL ── */
.r{opacity:0;transform:translateY(18px);transition:opacity 0.65s ease,transform 0.65s ease}
.r.in{opacity:1;transform:none}
.d1{transition-delay:.08s}.d2{transition-delay:.16s}.d3{transition-delay:.24s}

/* ── RESPONSIVE ── */
@media(max-width:960px){
  .nav{display:flex;justify-content:space-between;padding:0 1.5rem}
  .nav-links{display:none}
  .nav-ctas{display:flex;gap:0.4rem;align-items:center}
  .nbtn{font-size:0.62rem;padding:0.38rem 0.75rem;letter-spacing:0.08em}
  .nav-hamburger{display:flex}
  .feat-split,.about-grid,.about-dark-grid,.contact-grid{grid-template-columns:1fr}
  .fp{border-right:none;border-bottom:1px solid var(--border)}
  .process-step{min-width:100%}
  .perks-inner,.values-grid{grid-template-columns:1fr}
  .t-grid{grid-template-columns:1fr}
  .footer-inner{grid-template-columns:1fr 1fr;gap:2rem}
  .closing-grid{flex-direction:column;gap:2rem}
  .cstat{border-left:none!important}
  .cards-grid{grid-template-columns:repeat(2,1fr)}
  .af-grid-2{grid-template-columns:1fr}
  .af-col-2{grid-column:span 1}
  .about-stats-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:600px){
  .hero-content{padding:3rem 1.5rem 0}
  .hero-sub{font-size:0.88rem}
  .hero-stats{flex-direction:row;gap:0.8rem;margin-top:2rem;padding:1.5rem 0.6rem 2.5rem;flex-wrap:nowrap}
  .hstat{border-left:1px solid rgba(255,255,255,0.1);border-top:none;padding:0.6rem 0.4rem;flex:1 1 0;min-width:0;text-align:center}
  .hstat:first-child{border-left:none}
  .hstat-num{font-size:clamp(1.5rem,7vw,2.2rem)}
  .hstat-label{font-size:0.66rem;letter-spacing:0.08em;line-height:1.3}
  .footer-inner{grid-template-columns:1fr}
  .cards-grid{grid-template-columns:1fr 1fr}
  .card-wrap{height:400px}
  .cards-section{padding:2rem 1.2rem 4rem}
  .form-row-2{grid-template-columns:1fr}
}
@media(max-width:480px){
  .cards-grid{grid-template-columns:1fr}
  .card-wrap{height:460px}
  .card-photo{height:48%}
}

/* ── FILE UPLOAD UI ── */
.file-upload-wrap { position: relative; }
.file-upload-ui {
  display: flex; align-items: center; gap: 1rem;
  padding: 0.85rem 1rem;
  border: 1.5px dashed var(--border);
  background: #f9f7f4; cursor: pointer;
  transition: border-color 0.2s, background 0.2s;
}
.file-upload-ui:hover { border-color: var(--gold); background: #fffbf0; }
.file-icon { font-size: 1.1rem; color: var(--gold); flex-shrink: 0; }
.file-label { font-size: 0.86rem; color: #888; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.file-btn {
  font-size: 0.7rem; font-weight: 700; letter-spacing: 0.1em;
  text-transform: uppercase; padding: 0.35rem 0.8rem;
  border: 1.5px solid var(--dark); color: var(--dark);
  background: #fff; flex-shrink: 0; transition: all 0.2s;
}
.file-upload-ui:hover .file-btn { background: var(--dark); color: #fff; }
.has-file .file-upload-ui { border-color: var(--gold); border-style: solid; background: #fffbf0; }
.has-file .file-label { color: var(--dark); font-weight: 500; }
.has-error .file-upload-ui { border-color: #e05252; border-style: solid; background: #fff8f8; }
.file-error { font-size: 0.78rem; color: #c0392b; margin-top: 0.35rem; font-weight: 500; }
.file-progress { margin-top: 0.5rem; height: 4px; background: #e8e3db; border-radius: 2px; overflow: hidden; }
.file-progress-bar { height: 100%; background: var(--gold); width: 0%; transition: width 0.3s; }

/* ── OVERALL UPLOAD PROGRESS ── */
.upload-overall-progress {
  background: var(--dark); color: #fff;
  padding: 1.2rem 1.5rem; margin-bottom: 1rem;
}
.oop-label { font-size: 0.82rem; font-weight: 600; letter-spacing: 0.06em; margin-bottom: 0.6rem; color: rgba(255,255,255,0.75); }
.oop-bar-wrap { height: 4px; background: rgba(255,255,255,0.15); border-radius: 2px; overflow: hidden; }
.oop-bar { height: 100%; background: var(--gold); width: 0%; transition: width 0.2s; border-radius: 2px; }

/* ── FORM ERROR MESSAGE ── */
.form-error-msg {
  background: #fff8f8; border: 1px solid #e05252;
  color: #c0392b; padding: 1rem 1.2rem;
  font-size: 0.86rem; font-weight: 500; line-height: 1.6;
  margin-top: 0.5rem;
}

/* ── LINEUP SEARCH BAR ── */
.lineup-search-bar{padding:2rem 2.5rem 0;max-width:1200px;margin:0 auto}
/* v3.36 — Search bar styling moved to bottom of file (single clean source). */


/* ── CARD DIMMED (search non-match) ── */
.card-dimmed{opacity:0.15;pointer-events:none;transition:opacity 0.25s}

/* ── STAR RATING INPUT (artist form) ── */
.star-rating-grid{display:flex;flex-direction:column;gap:0;margin-top:1rem;border:1px solid var(--border)}
.sr-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.2rem;border-bottom:1px solid var(--border);transition:background 0.15s}
.sr-row:last-child{border-bottom:none}
.sr-row:hover{background:#fffbf0}
.sr-row.has-error{background:#fff8f8}
.sr-label-wrap{flex:1}
.sr-label{font-size:0.78rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:#444;display:block}
.sr-desc{font-size:0.74rem;color:#aaa;margin-top:0.15rem;display:block}
.star-pick{display:flex;gap:0.25rem;flex-shrink:0}
.star{font-size:1.55rem;color:#ddd;cursor:pointer;transition:color 0.1s;user-select:none;line-height:1}
.star.filled{color:var(--gold)}
.star.hover{color:var(--gold)}

@media(max-width:600px){
  .sr-row{flex-direction:column;align-items:flex-start;gap:0.6rem}
  .star{font-size:1.8rem}
  .lineup-search-bar{padding:1.5rem 1.2rem 0}
}

/* ── REVENUE CALCULATOR ── */
.rev-calc{padding:6rem 2rem;background:var(--light);border-bottom:1px solid var(--border)}
.rev-calc-inner{max-width:1100px;margin:0 auto}
.rev-calc-header{text-align:center;margin-bottom:3rem;max-width:680px;margin-left:auto;margin-right:auto}
.rev-calc-header h2{font-family:'Cormorant Garamond',serif;font-size:clamp(1.9rem,3.5vw,2.8rem);font-weight:700;color:var(--dark);margin:0.6rem 0 1rem;line-height:1.2}
.rev-calc-header p{font-size:0.95rem;color:var(--mid);line-height:1.7}
.rev-calc-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:3rem;align-items:start}

.rc-inputs{background:#fff;border:1px solid var(--border);padding:2.4rem}
.rc-input{margin-bottom:1.8rem}
.rc-input:last-of-type{margin-bottom:1rem}
.rc-input label{display:block;font-size:0.72rem;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:#555;margin-bottom:0.7rem}
.rc-slider-wrap{display:flex;align-items:center;gap:1.2rem}
.rc-slider-wrap input[type=range]{flex:1;-webkit-appearance:none;appearance:none;height:4px;background:var(--border);border-radius:2px;outline:none}
.rc-slider-wrap input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:22px;border-radius:50%;background:var(--gold);cursor:pointer;border:3px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,0.2)}
.rc-slider-wrap input[type=range]::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:var(--gold);cursor:pointer;border:3px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,0.2)}
.rc-val{font-family:'Cormorant Garamond',serif;font-size:1.4rem;font-weight:700;color:var(--dark);min-width:120px;text-align:right;line-height:1}
.rc-val small{font-size:0.7rem;font-weight:500;color:#888;font-family:'Raleway',sans-serif;letter-spacing:0.05em}

.rc-assumptions{background:var(--light);padding:1.2rem 1.4rem;border-left:3px solid var(--gold);margin-top:1.5rem}
.rc-assumptions strong{font-size:0.7rem;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:0.6rem}
.rc-assumptions ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:0.45rem}
.rc-assumptions li{font-size:0.82rem;color:#555;line-height:1.5;padding-left:1rem;position:relative}
.rc-assumptions li::before{content:'·';position:absolute;left:0;color:var(--gold);font-weight:700;font-size:1.2rem;top:-0.25rem}

.rc-output{display:flex;flex-direction:column;gap:1rem}
.rc-result-card{background:#fff;border:1px solid var(--border);padding:1.8rem}
.rc-result-label{font-size:0.7rem;font-weight:700;letter-spacing:0.16em;text-transform:uppercase;color:#888;margin-bottom:0.5rem}
.rc-result-num{font-family:'Cormorant Garamond',serif;font-size:3.4rem;font-weight:700;color:var(--gold);line-height:1}
.rc-result-num-sm{font-size:2rem;color:var(--dark)}
.rc-result-sub{font-size:0.78rem;color:#888;margin-top:0.5rem}
.rc-headline{background:var(--dark);border-color:var(--dark);text-align:center;padding:2.4rem 1.8rem}
.rc-headline .rc-result-label{color:rgba(255,255,255,0.55)}
.rc-headline .rc-result-num{color:var(--gold);font-size:3.8rem}
.rc-headline .rc-result-sub{color:rgba(255,255,255,0.4)}
.rc-result-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.rc-breakdown-row{display:flex;justify-content:space-between;padding:0.6rem 0;border-top:1px solid var(--border);font-size:0.86rem;color:#444}
.rc-breakdown-row:first-of-type{border-top:none;padding-top:0.4rem}
.rc-breakdown-row span:last-child{font-weight:600;color:var(--dark)}
.rc-cta{margin-top:0.6rem;text-align:center;align-self:stretch}

@media(max-width:960px){
  .rev-calc-grid{grid-template-columns:1fr}
  .rc-headline .rc-result-num{font-size:3rem}
}
@media(max-width:600px){
  .rev-calc{padding:4rem 1.2rem}
  .rc-inputs{padding:1.6rem}
  .rc-result-row{grid-template-columns:1fr}
  .rc-val{font-size:1.15rem;min-width:95px}
}

/* venue form anchor scroll offset */
#venue-form-section{scroll-margin-top:80px}

/* ── LINEUP CONTROLS BAR (search + flip toggle) ── */
.lineup-controls{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding:2rem 2.5rem 0;flex-wrap:wrap}
/* v3.36 — .lineup-controls .search-wrap styling lives in end-of-file consolidated block */

/* ── FLIP ALL TOGGLE ── */
.flip-all-wrap{display:flex;align-items:center;gap:0.75rem;flex-shrink:0}
.flip-all-label{font-size:0.7rem;font-weight:700;letter-spacing:0.16em;text-transform:uppercase;color:var(--mid);user-select:none}
.flip-all-switch{width:52px;height:30px;border-radius:15px;background:var(--border);border:none;cursor:pointer;position:relative;transition:background 0.3s cubic-bezier(0.4,0,0.2,1);padding:0;outline:none;flex-shrink:0}
.flip-all-switch:focus-visible{box-shadow:0 0 0 3px rgba(201,168,75,0.35)}
.flip-all-switch.active{background:var(--gold)}
.flip-all-knob{position:absolute;top:4px;left:4px;width:22px;height:22px;border-radius:50%;background:#fff;transition:transform 0.3s cubic-bezier(0.4,0,0.2,1);box-shadow:0 1px 5px rgba(0,0,0,0.22);pointer-events:none}
.flip-all-switch.active .flip-all-knob{transform:translateX(22px)}

/* ── MOBILE CARD COUNTER ── */
.mobile-card-counter{display:none;text-align:center;padding:1rem 0 0;font-size:0.78rem;font-weight:700;letter-spacing:0.16em;text-transform:uppercase;color:rgba(255,255,255,0.5)}
.mcc-sep{color:rgba(255,255,255,0.25)}

/* ── MOBILE CAROUSEL ── */
@media(max-width:768px){
  .lineup-controls{padding:1.5rem 1.2rem 0;gap:1rem}
  /* v3.36 — mobile .search-wrap sizing lives in end-of-file consolidated block */
  .flip-all-label{display:none}

  .cards-section{
    background:var(--green);
    padding:2rem 0 3rem;
    position:relative;
  }

  /* Green felt texture */
  .cards-section::before{
    content:'';
    position:absolute;
    inset:0;
    background-image:
      radial-gradient(circle at 1px 1px, rgba(0,0,0,0.06) 1px, transparent 0);
    background-size:18px 18px;
    pointer-events:none;
    z-index:0;
  }

  .cards-grid{
    display:flex;
    overflow-x:scroll;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    gap:1rem;
    padding:1.5rem 10vw;
    align-items:center;
    position:relative;
    z-index:1;
  }
  .cards-grid::-webkit-scrollbar{display:none}

  .card-wrap{
    flex:0 0 78vw;
    height:520px;
    scroll-snap-align:center;
    transition:transform 0.35s cubic-bezier(0.4,0,0.2,1), opacity 0.35s;
    opacity:0.55;
    transform:scale(0.93);
  }
  .card-wrap.carousel-active{
    opacity:1;
    transform:scale(1);
  }
  /* Frosted glass edge overlays */
  .cards-section::after{
    content:'';
    position:absolute;
    inset:0;
    background:
      linear-gradient(to right,
        var(--green) 0%,
        rgba(53,94,59,0.75) 6%,
        transparent 18%,
        transparent 82%,
        rgba(53,94,59,0.75) 94%,
        var(--green) 100%
      );
    pointer-events:none;
    z-index:2;
  }

  .card-placeholder{opacity:0.3 !important;transform:scale(0.88) !important}
  .card-dimmed{opacity:0.15 !important}

  .mobile-card-counter{display:block;background:var(--green);padding-bottom:1.5rem}

  /* Card back photo taller on mobile */
  .card-photo{height:48%}
}

@media(max-width:480px){
  .card-wrap{flex:0 0 84vw;height:500px}
}

/* ===========================================================
   v2.5 — Venue page rewrite (page-contact.php)
   New sections: pitch, curation, benefits, trial, rev-teaser
   =========================================================== */

/* What We Do */
.pitch-section { padding: 6rem 2rem 2rem; background: var(--light); }
.pitch-inner { max-width: 900px; margin: 0 auto; }
.pitch-intro { text-align: center; }
.pitch-intro h2 { font-family: 'Cormorant Garamond', serif; font-size: clamp(1.8rem, 3.5vw, 2.6rem); font-weight: 600; margin: 0.6rem 0 1.2rem; line-height: 1.15; }
.pitch-intro p { font-size: 1.05rem; line-height: 1.7; color: var(--mid); max-width: 700px; margin: 0 auto; }

/* Curation */
.curation-section { padding: 5rem 2rem; background: var(--light); }
.curation-inner { max-width: 1200px; margin: 0 auto; }
.curation-grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: 4rem; align-items: center; }
.curation-text h2 { font-family: 'Cormorant Garamond', serif; font-size: clamp(2rem, 4vw, 3rem); font-weight: 600; margin: 0.6rem 0 1.5rem; line-height: 1.1; }
.curation-text p { font-size: 1.02rem; line-height: 1.7; color: var(--mid); margin-bottom: 1.2rem; }
.curation-text .btn-outline { margin-top: 0.8rem; }
.curation-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.cstat { background: #fff; border: 1px solid var(--border); padding: 2rem 1.5rem; text-align: center; border-radius: 4px; }
.cstat-num { font-family: 'Cormorant Garamond', serif; font-size: clamp(2.2rem, 4vw, 3rem); font-weight: 700; color: var(--gold); line-height: 1; }
.cstat-lbl { font-size: 0.78rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--mid); margin-top: 0.8rem; font-weight: 500; }

/* Benefits */
.benefits-section { padding: 6rem 2rem; background: #fff; }
.benefits-inner { max-width: 1200px; margin: 0 auto; }
.benefits-header { text-align: center; margin-bottom: 4rem; }
.benefits-header h2 { font-family: 'Cormorant Garamond', serif; font-size: clamp(2rem, 4vw, 3rem); font-weight: 600; margin: 0.6rem 0 0; }
.benefits-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2rem; }
.benefit-card { background: var(--light); padding: 2.5rem 2rem; border: 1px solid var(--border); }
.benefit-num { font-family: 'Cormorant Garamond', serif; font-size: 1.2rem; color: var(--gold); font-weight: 600; letter-spacing: 0.1em; margin-bottom: 0.6rem; }
.benefit-card h3 { font-family: 'Cormorant Garamond', serif; font-size: 1.6rem; font-weight: 600; margin: 0 0 0.8rem; }
.benefit-card p { font-size: 0.98rem; line-height: 1.65; color: var(--mid); margin: 0; }

/* Trial / Guarantee */
.trial-section { padding: 6rem 2rem; background: var(--dark); color: #fff; }
.trial-inner { max-width: 800px; margin: 0 auto; text-align: center; }
.trial-inner .sec-eyebrow { color: var(--gold); }
.trial-inner h2 { font-family: 'Cormorant Garamond', serif; font-size: clamp(1.8rem, 3.5vw, 2.6rem); font-weight: 600; margin: 0.6rem 0 1.5rem; color: #fff; line-height: 1.2; }
.trial-inner p { font-size: 1.02rem; line-height: 1.7; color: rgba(255,255,255,0.8); margin-bottom: 1.5rem; }
.trial-quote { font-family: 'Cormorant Garamond', serif; font-style: italic; font-size: 1.2rem !important; color: rgba(255,255,255,0.9) !important; border-top: 1px solid rgba(201,168,75,0.4); padding-top: 1.5rem; margin-top: 2rem !important; }

/* Revenue Calculator Teaser */
.rev-teaser {
  padding: 5rem 2rem;
  background:
    linear-gradient(rgba(17,17,17,0.55), rgba(17,17,17,0.75)),
    radial-gradient(circle at 30% 50%, var(--green) 0%, var(--dark) 70%);
  border-top: 1px solid rgba(0,0,0,0.15);
}
.rev-teaser-inner { max-width: 700px; margin: 0 auto; text-align: center; }
.rev-teaser-inner .sec-eyebrow { color: var(--gold); }
.rev-teaser-inner h2 {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(1.8rem, 3.5vw, 2.4rem);
  font-weight: 600;
  margin: 0.6rem 0 1rem;
  line-height: 1.2;
  color: var(--gold);
}
.rev-teaser-inner p {
  font-size: 1.02rem;
  line-height: 1.7;
  color: rgba(255,255,255,0.82);
  margin-bottom: 1.8rem;
}
/* btn-outline on dark — flip border and text colour */
.rev-teaser-inner .btn-outline {
  color: #fff;
  border-color: rgba(255,255,255,0.5);
}
.rev-teaser-inner .btn-outline:hover {
  background: var(--gold);
  color: var(--dark);
  border-color: var(--gold);
}

/* btn-outline (used on venue page) */
.btn-outline { display: inline-block; padding: 0.9rem 2rem; border: 1px solid var(--gold); color: var(--gold); background: transparent; font-size: 0.8rem; letter-spacing: 0.15em; text-transform: uppercase; font-weight: 500; text-decoration: none; transition: all 0.2s ease; }
.btn-outline:hover { background: var(--gold); color: #fff; }

@media (max-width: 768px) {
  .curation-grid { grid-template-columns: 1fr; gap: 2.5rem; }
  .benefits-grid { grid-template-columns: 1fr; gap: 1.2rem; }
  .pitch-section, .curation-section, .benefits-section, .trial-section, .rev-teaser { padding: 4rem 1.2rem; }
  .benefit-card { padding: 2rem 1.5rem; }
}

/* ===========================================================
   v2.5 — Artist form polish (page-artists.php)
   Tighter rhythm, no emojis, professional aesthetic
   =========================================================== */
.af-section-title { font-family: 'Cormorant Garamond', serif; font-size: 1.5rem; font-weight: 600; letter-spacing: 0.01em; color: var(--dark); padding-bottom: 0.6rem; border-bottom: 1px solid rgba(201,168,75,0.25); margin-bottom: 1.4rem; }
.af-photo-pack { padding: 1rem 0 0; }
.af-photo-pack-intro { font-size: 0.95rem; line-height: 1.6; color: var(--mid); margin: 0 0 1.4rem; }
.af-photo-slot { margin-bottom: 0.9rem; }

/* PA system field */
.af-pa-row { display: grid; grid-template-columns: repeat(5, 1fr); gap: 0.6rem; margin-bottom: 0.8rem; }
@media (max-width: 640px) { .af-pa-row { grid-template-columns: repeat(2, 1fr); } }

/* ===========================================================
   v2.6 — Inline YouTube playback on card flip
   =========================================================== */
.card-video-mount { position: absolute; top: 0; left: 0; right: 0; height: 52%; z-index: 1; pointer-events: none; background: #000; overflow: hidden; }
.card-video-mount iframe { width: 100%; height: 100%; display: block; pointer-events: auto; border: 0; }

/* When a card is actively playing, push the card-info to overlay the video at the bottom */
.card-wrap.yt-playing .card-photo { opacity: 0; transition: opacity 0.2s ease; }
.card-wrap.yt-playing .card-video-mount { z-index: 1; }
.card-wrap.yt-playing .card-info { background: #fff; z-index: 2; }

/* Unmute button (shows only when a card is playing) */
.card-unmute-btn { position: absolute; top: 12px; right: 12px; z-index: 3; width: 38px; height: 38px; border: none; border-radius: 50%; background: rgba(0,0,0,0.62); color: #fff; font-size: 16px; cursor: pointer; display: none; align-items: center; justify-content: center; backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); transition: background 0.15s ease, transform 0.15s ease; }
.card-unmute-btn:hover { background: rgba(0,0,0,0.85); transform: scale(1.05); }
.card-unmute-btn.is-unmuted { background: var(--gold); }
.card-wrap.yt-playing .card-unmute-btn { display: flex; }
.cu-icon { line-height: 1; }

/* ===========================================================
   v2.6 — Genre system (page-artists.php)
   =========================================================== */
.genre-grid { transition: background 0.2s ease; padding: 6px; border-radius: 4px; }
.genre-grid.genre-overflow { background: rgba(220, 53, 69, 0.08); animation: genreShake 0.4s ease; }
@keyframes genreShake {
  0%, 100% { transform: translateX(0); }
  25%      { transform: translateX(-3px); }
  75%      { transform: translateX(3px); }
}
#genre-other-wrap input[type="text"] { width: 100%; }

/* ===========================================================
   v2.7 — Play-button overlay (replaces autoplay-on-flip from v2.6)
   =========================================================== */
.card-play-overlay {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  z-index: 4;
  display: none;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  background: rgba(0,0,0,0.55);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  color: #fff;
  border: 1.5px solid rgba(255,255,255,0.85);
  border-radius: 50%;
  width: 88px;
  height: 88px;
  cursor: pointer;
  transition: transform 0.18s ease, background 0.18s ease, border-color 0.18s ease;
}
.card-play-overlay:hover {
  transform: translate(-50%, -50%) scale(1.06);
  background: rgba(0,0,0,0.75);
  border-color: var(--gold);
}
.cpo-icon { font-size: 24px; line-height: 1; padding-left: 4px; /* visual centre */ }
.cpo-label { font-size: 9px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600; }

/* Show overlay only when card is flipped and not currently playing */
.card-wrap.flipped .card-play-overlay,
.card-wrap.auto-flipped .card-play-overlay { display: flex; }
.card-wrap.yt-playing .card-play-overlay { display: none; }

/* ===========================================================
   v2.7 — Card visual fixes (mobile bleed-through, contrast, flash)
   =========================================================== */

/* (1) Loading flash fix — hide card back until DOM is ready.
       JS adds .lineup-ready to <body> on DOMContentLoaded. */
.card-inner { transition: transform 0.7s ease; }
body:not(.lineup-ready) .cards-grid { opacity: 0; }
body.lineup-ready  .cards-grid { opacity: 1; transition: opacity 0.25s ease 0.05s; }

/* (2) Bleed-through fix — explicit opaque backgrounds + force backface hidden */
.card-front,
.card-back {
  background: var(--dark);              /* fallback if photo URL fails */
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.card-back { background: #111; }        /* solid base so green felt never bleeds through */
.card-front { background: var(--dark); }

/* (3) Card-info panel — REVERTED v3.9: back to the v2.3 white background,
       dark name, gold type. The earlier dark-gradient override is removed.
       The bleed-through bug it was masking is now properly fixed by
       backface-visibility rules above + the v3.3 visibility belt-and-braces. */
.card-info {
  background: #fff;
}
.card-name {
  color: var(--dark);
  font-weight: 700;
  text-shadow: none;
}
.card-type {
  color: var(--gold);
  text-shadow: none;
}

/* ===========================================================
   v2.7 — Mobile responsiveness fixes (artist form)
   =========================================================== */
@media (max-width: 640px) {
  /* Lock the form to viewport — nothing can overflow */
  .artist-form,
  .artist-form-inner,
  .af-section,
  .af-grid-2,
  .form-group,
  .checkbox-grid,
  .file-upload-wrap,
  .file-upload-ui,
  .star-rating-grid,
  .sr-row {
    max-width: 100%;
    box-sizing: border-box;
  }
  .artist-form-section { padding: 2rem 1rem; overflow-x: hidden; }
  .artist-form-inner   { padding: 0; }
  .af-section          { padding: 1.5rem 1rem; }

  /* Single-column grid on mobile */
  .af-grid-2 { grid-template-columns: 1fr !important; }

  /* All inputs/textareas/selects fill width */
  .artist-form input[type="text"],
  .artist-form input[type="email"],
  .artist-form input[type="tel"],
  .artist-form input[type="url"],
  .artist-form input[type="number"],
  .artist-form select,
  .artist-form textarea {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    font-size: 16px;  /* prevents iOS auto-zoom on focus */
  }

  /* Checkbox grids stack tighter on mobile */
  .checkbox-grid    { grid-template-columns: 1fr 1fr !important; gap: 0.5rem; }
  .checkbox-grid-sm { grid-template-columns: repeat(2, 1fr) !important; }

  /* File upload UI shouldn't overflow */
  .file-upload-ui {
    flex-wrap: wrap;
    padding: 0.9rem;
    gap: 0.4rem;
  }
  .file-label {
    flex: 1 1 100%;
    word-break: break-word;
  }

  /* Star rating rows stack */
  .sr-row { flex-direction: column; align-items: flex-start; gap: 0.4rem; padding: 0.9rem 0; }
  .sr-label-wrap { width: 100%; }
  .star-pick     { font-size: 1.4rem; }

  /* Submit button full width */
  .form-submit-btn { width: 100%; }

  /* PA-system 5-col grid wraps */
  .af-pa-row { grid-template-columns: 1fr 1fr !important; gap: 0.4rem; }
}

/* v3.15 — Removed `html, body { overflow-x: hidden }` from v2.7.
   It was silently breaking the sticky nav on mobile. The box-sizing rules
   in the form mobile block above are sufficient to prevent horizontal scroll
   on their own. */

/* ===========================================================
   v2.8 — Form restructure: dropdowns, LineUp Card section, subsections
   =========================================================== */

/* Three-dropdown primary-genre row */
.af-genre-dropdowns {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.6rem;
}
.af-genre-dropdowns select {
  width: 100%;
  box-sizing: border-box;
}
@media (max-width: 640px) {
  .af-genre-dropdowns { grid-template-columns: 1fr; }
}

/* "Your LineUp Card" highlighted section — subtle gold-accented panel */
.af-section-card {
  background: linear-gradient(180deg, #fbf9f3 0%, #f7f3e8 100%);
  border-left: 3px solid var(--gold);
  padding-left: calc(1.5rem - 3px);
}
@media (max-width: 640px) {
  .af-section-card { padding-left: calc(1rem - 3px); }
}

/* Subsection titles within "Your LineUp Card" — smaller than section titles */
.af-subsection-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.15rem;
  font-weight: 600;
  color: var(--dark);
  letter-spacing: 0.01em;
  margin-bottom: 0.4rem;
  padding-top: 0.2rem;
  border-top: 1px solid rgba(201,168,75,0.18);
  padding-top: 1.2rem;
}
.af-section-card > .af-subsection-title:first-of-type { border-top: none; padding-top: 0; }

/* Years-experience parity — make sure all text-style inputs in About You share styling.
   The form already styles inputs uniformly; this just guarantees no number-input chrome leaks. */
.artist-form input[type="number"],
.artist-form input[inputmode="numeric"] {
  -moz-appearance: textfield;
  appearance: textfield;
}
.artist-form input[type="number"]::-webkit-outer-spin-button,
.artist-form input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* ===========================================================
   v2.9 — Homepage rebuild
   =========================================================== */

/* Hero — text-style stat (for "Money-Back Guaranteed") */
.hstat-num-text {
  font-size: clamp(1rem, 1.6vw, 1.4rem) !important;
  line-height: 1.15;
  letter-spacing: 0.01em;
}

/* Image fallback if Unsplash fails for any reason */
.fp-img-fallback {
  background: linear-gradient(135deg, var(--dark) 0%, var(--green) 100%);
  min-height: 320px;
}

/* ===========================================================
   Process section — rebuild matching rostarlive's layout pattern
   4-column desktop grid → 2-up tablet → stacked mobile.
   =========================================================== */
.process {
  padding: 6rem 2rem;
  background: var(--light);
  border-top: 1px solid var(--border);
}
.process-header {
  max-width: 800px;
  margin: 0 auto 4rem;
  text-align: center;
}
.process-header h2 {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 600;
  margin: 0.6rem 0 1rem;
  line-height: 1.1;
}
.process-intro {
  font-size: 1.02rem;
  line-height: 1.65;
  color: var(--mid);
  max-width: 600px;
  margin: 0 auto;
}
.process-grid {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2rem;
}
.process-step {
  background: #fff;
  border: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.process-step:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 30px rgba(17, 17, 17, 0.08);
}
.ps-step-num {
  position: absolute;
  top: 1rem;
  right: 1.2rem;
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--gold);
  letter-spacing: 0.12em;
  z-index: 2;
}
.process-step .ps-img {
  width: 100%;
  height: 200px;
  object-fit: cover;
  display: block;
}
.process-step .ps-tag {
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--green);
  padding: 1.6rem 1.6rem 0.3rem;
}
.process-step h4 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.4rem;
  font-weight: 600;
  margin: 0;
  padding: 0 1.6rem 0.7rem;
  line-height: 1.2;
}
.process-step > p {
  font-size: 0.92rem;
  line-height: 1.6;
  color: var(--mid);
  margin: 0;
  padding: 0 1.6rem 1.8rem;
}

@media (max-width: 960px) {
  .process-grid { grid-template-columns: repeat(2, 1fr); gap: 1.4rem; }
}
@media (max-width: 580px) {
  .process { padding: 4rem 1.2rem; }
  .process-header { margin-bottom: 2.5rem; }
  .process-grid { grid-template-columns: 1fr; gap: 1.2rem; }
  .process-step .ps-img { height: 180px; }
}

/* ===========================================================
   Closing CTA — replaces the old 2023/16/40+ stats block
   Uses green to reinforce brand colour balance (Tristan's note)
   =========================================================== */
.closing-cta {
  background:
    linear-gradient(rgba(17,17,17,0.55), rgba(17,17,17,0.75)),
    radial-gradient(circle at 30% 50%, var(--green) 0%, var(--dark) 70%);
  padding: 6rem 2rem;
  text-align: center;
  color: #fff;
}
.closing-cta-inner { max-width: 820px; margin: 0 auto; }
.closing-cta .closing-enjoy {
  display: block;
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: 1.1rem;
  color: var(--gold);
  margin-bottom: 0.8rem;
  letter-spacing: 0.02em;
}
.closing-cta h2 {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(1.8rem, 4vw, 2.8rem);
  font-weight: 600;
  color: var(--gold);
  margin: 0 0 1rem;
  line-height: 1.15;
}
.closing-cta p {
  font-size: 1.05rem;
  line-height: 1.6;
  color: rgba(255,255,255,0.85);
  margin: 0 0 2rem;
}
.closing-cta .btn-white {
  background: var(--gold);
  color: var(--dark);
  padding: 1rem 2.6rem;
  font-weight: 800;
}
.closing-cta .btn-white:hover {
  background: #d8b659;
}

/* ===========================================================
   v2.9 — More green / less white space (Tristan's note)
   Subtle green accent rules across the homepage to break up
   the run of white sections without changing core layout.
   =========================================================== */
.unlock {
  background:
    linear-gradient(180deg, #fff 0%, #fbf9f3 100%);
  position: relative;
}
.unlock::after {
  /* Thin green divider rule under the unlock section */
  content: '';
  display: block;
  width: 80px;
  height: 2px;
  background: var(--green);
  margin: 2.5rem auto 0;
  opacity: 0.55;
}

/* Perks section — background set by v3.11 (.perks{background:var(--green)}) above.
   The v2.9 cream-gradient override has been removed in v3.12. */

/* sec-eyebrow on homepage uses green (was gold) to bring colour in
   without overdoing the gold */
.process .sec-eyebrow,
.unlock + * .sec-eyebrow {
  color: var(--green);
}

/* ===========================================================
   v2.9 — Mobile responsiveness pass (homepage)
   =========================================================== */
@media (max-width: 768px) {
  /* Hero stats horizontal layout handled in earlier mobile breakpoint (~line 330) */
  .hstat-num-text {
    font-size: clamp(0.8rem, 3.4vw, 1rem) !important;
  }

  /* Feat-split: symmetric padding on mobile + kill desktop side-borders that look weird stacked */
  .feat-split { padding: 0; }
  .fp { padding: 3rem 1.5rem; border-right: none; border-bottom: 1px solid var(--border); }
  .fp:last-child { border-bottom: none; }
  .fp-img { max-width: 100%; height: auto; }
  .laptop-wrap { max-width: 100%; }

  /* Perks stack */
  .perks-inner { grid-template-columns: 1fr; }

  /* Logos row scrolls horizontally without breaking layout */
  .logos-row {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .logos-row::-webkit-scrollbar { display: none; }
  .logo-box { flex: 0 0 auto; min-width: 110px; }

  /* Testimonials grid stacks */
  .t-grid { grid-template-columns: 1fr; }
  .t-header { flex-direction: column; align-items: flex-start; gap: 1rem; }
}

/* ===========================================================
   v3.0 — Card video sizing: match mobile photo heights + reset
   =========================================================== */
@media (max-width: 480px) {
  .card-video-mount { height: 48%; }
}
/* Carousel-active state on mobile also uses card-photo height 48% — match */
.card-wrap.carousel-active .card-video-mount { height: 48%; }

/* ===========================================================
   v3.1 — MOBILE LINEUP PAGE REDESIGN
   Wheel-carousel + glass search bar + immersive green felt
   Mobile-only — desktop layout completely unchanged
   =========================================================== */
@media (max-width: 768px) {

  /* ── Page hero: compressed, cards visible above fold ── */
  .page-template-page-lineup .page-hero,
  body.page-lineup .page-hero {
    min-height: 28vh;
  }
  .page-template-page-lineup .page-hero-content,
  body.page-lineup .page-hero-content {
    padding: 2.5rem 1.5rem 2rem;
  }
  .page-template-page-lineup .page-hero-content h1,
  body.page-lineup .page-hero-content h1 {
    font-size: clamp(2rem, 8vw, 2.6rem);
    margin-bottom: 0.4rem;
  }
  .page-template-page-lineup .page-hero-content p,
  body.page-lineup .page-hero-content p {
    font-size: 0.88rem;
  }

  /* ── Green felt extends through the controls + cards area ── */
  .lineup-controls {
    background: var(--green);
    margin: 0;
    padding: 1.2rem 1.2rem 0.8rem;
    max-width: none;
    position: relative;
    z-index: 3;
  }

  /* Hide "Reveal All" toggle — meaningless in one-at-a-time carousel */
  .lineup-controls .flip-all-wrap { display: none; }

  /* v3.36 — search bar styling consolidated to single block at file end */

  /* ── Cards section: green felt, no break from controls ── */
  .cards-section {
    background: var(--green);
    padding: 0.5rem 0 3rem;
    position: relative;
  }

  /* ── "Wheel" carousel — peek at neighbours, larger active card ── */
  .cards-grid {
    display: flex;
    overflow-x: scroll;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    gap: 0.6rem;
    padding: 1.5rem 18vw;  /* 18vw side padding = neighbours peek ~18vw into view */
    align-items: center;
  }
  .cards-grid::-webkit-scrollbar { display: none; }

  .card-wrap {
    flex: 0 0 64vw;        /* Card width: 64vw (was 78vw) — more peek at sides */
    height: 480px;          /* Slightly shorter than before — fits better above fold */
    scroll-snap-align: center;
    transition:
      transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),
      opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1),
      filter 0.4s ease;
    opacity: 0.42;
    transform: scale(0.86);
    filter: saturate(0.6) brightness(0.85);
  }
  .card-wrap.carousel-active {
    opacity: 1;
    transform: scale(1);
    filter: saturate(1) brightness(1);
  }

  /* Active card's video mount: match new height % */
  .card-wrap.carousel-active .card-video-mount,
  .card-wrap .card-video-mount {
    height: 52%;
  }

  /* Card-photo height stays the same — confirms what video-mount matches */
  .card-photo { height: 52%; }

  /* Soft edge gradient — fades to felt, creates depth illusion */
  .cards-section::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(
      to right,
      var(--green) 0%,
      rgba(53, 94, 59, 0.6) 5%,
      transparent 16%,
      transparent 84%,
      rgba(53, 94, 59, 0.6) 95%,
      var(--green) 100%
    );
    pointer-events: none;
    z-index: 2;
  }

  /* Card counter — repositioned to bottom, lighter on green */
  .card-counter {
    background: rgba(255, 255, 255, 0.12);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.18);
  }

  /* Wider mobile breakpoint override — kill old 78vw card width
     (was set in 480px breakpoint, now superseded) */
}

@media (max-width: 480px) {
  /* Override the previous card-photo 48% from earlier batches —
     keep wheel carousel cards at 52% (consistent with video mount above) */
  .card-photo { height: 52%; }
  .card-wrap.carousel-active .card-video-mount,
  .card-wrap .card-video-mount { height: 52%; }
  .card-wrap { height: 460px; }
}

/* ===========================================================
   v3.1 — Auto-flip wheel behaviour
   When a card becomes "active" (centred), it auto-flips to back.
   When a card loses "active", it auto-flips back to front.
   .auto-flipped is a CSS-tracked variant so the JS can distinguish
   from user-initiated .flipped (which it still toggles).
   =========================================================== */
@media (max-width: 768px) {
  /* Cards that the wheel has auto-flipped — same visual as .flipped */
  .card-wrap.auto-flipped .card-inner { transform: rotateY(180deg); }
}

/* ===========================================================
   v3.2 — Card mobile bug fixes (photo + bleed-through)
   =========================================================== */

/* (1) Photo visible BEFORE video plays — empty mount must be transparent.
       Only when YouTube iframe is actually inside does the black bg make sense. */
.card-video-mount { background: transparent; }
.card-video-mount:has(iframe) { background: #000; }
/* Fallback for browsers without :has() — black bg only when card is actively playing */
.card-wrap.yt-playing .card-video-mount { background: #000; }

/* (2) iOS Safari backface bleed fix — explicitly hide backfaces on EVERY
       child of .card-front and .card-back, not just the parents. Safari's
       'preserve-3d' implementation otherwise renders absolute-positioned
       children through the flipped face. */
.card-front *,
.card-back * {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
/* The card-photo background-image rule needs to survive — it's an
   inline style on a div, no descendant text, so backface-hidden is harmless. */

/* (3) Ensure .card-front is fully behind when .card-inner is flipped.
       Some Android browsers don't respect backface — force opacity transition. */
.card-wrap.flipped .card-front,
.card-wrap.auto-flipped .card-front {
  visibility: hidden;
  transition: visibility 0s 0.35s; /* hide after flip completes */
}
.card-wrap .card-front { transition: visibility 0s 0.35s; }


/* ===========================================================
   v3.4 — Process section: 2-panel-per-page carousel with arrows
   Brand-aligned (Cormorant headline, Raleway body, gold accents)
   Light on text; 4 steps split across 2 pages
   =========================================================== */
.process-v34 {
  padding: 6rem 2rem;
  background: var(--light);
  border-top: 1px solid var(--border);
}
.process-v34-inner {
  max-width: 1100px;
  margin: 0 auto;
}
.process-v34-header {
  text-align: center;
  margin-bottom: 3.5rem;
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
}
.process-v34-header h2 {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(2rem, 4vw, 2.8rem);
  font-weight: 600;
  margin: 0.6rem 0 0;
  line-height: 1.15;
}
.process-v34-header .sec-eyebrow { color: var(--green); }

/* Stage = viewport + controls */
.process-v34-stage { position: relative; }

.process-v34-viewport {
  overflow: hidden;
  /* Vertical inset only so card shadows aren't clipped top/bottom.
     Horizontal margin removed in v3.16 — it was overflowing viewport
     and breaking mobile pinch-zoom behaviour. */
  padding: 6px 0;
  margin: -6px 0;
}
.process-v34-track {
  display: flex;
  gap: 2rem;
  transition: transform 0.45s cubic-bezier(0.4, 0, 0.2, 1);
  will-change: transform;
}
.proc-card {
  flex: 0 0 calc((100% - 2rem) / 2);    /* 2 cards visible per "page" */
  background: #fff;
  border: 1px solid var(--border);
  padding: 2.4rem 2rem;
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}
.proc-card:hover {
  transform: translateY(-4px);
  border-color: rgba(201, 168, 75, 0.4);
  box-shadow: 0 12px 30px rgba(17, 17, 17, 0.08);
}
.proc-card-icon {
  width: 48px;
  height: 48px;
  color: var(--gold);
  margin-bottom: 0.4rem;
}
.proc-card-icon svg { width: 100%; height: 100%; display: block; }
.proc-card h4 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.5rem;
  font-weight: 600;
  margin: 0;
  line-height: 1.2;
  color: var(--dark);
}
.proc-card p {
  margin: 0;
  font-size: 0.96rem;
  line-height: 1.6;
  color: var(--mid);
}

/* Controls row */
.process-v34-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.8rem;
  margin-top: 2.5rem;
}
.proc-arrow {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: transparent;
  border: 1.5px solid var(--gold);
  color: var(--gold);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background 0.18s ease, color 0.18s ease, opacity 0.18s ease;
  padding: 0;
}
.proc-arrow:hover:not(:disabled) {
  background: var(--gold);
  color: #fff;
}
.proc-arrow:disabled {
  opacity: 0.3;
  cursor: not-allowed;
}
.proc-arrow svg { display: block; }

.proc-dots {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
}
.proc-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--border);
  display: inline-block;
  transition: background 0.2s ease, transform 0.2s ease;
}
.proc-dot.is-active {
  background: var(--gold);
  transform: scale(1.25);
}

/* v3.37/v3.38 — Mobile: native scroll-snap inside contained section.
   Critical: parent .process-v34 must have overflow-x: hidden to prevent
   the inner horizontal scroller from leaking and making the whole page scroll. */
@media (max-width: 768px) {
  .process-v34 {
    padding: 4rem 0;
    overflow-x: hidden; /* contains the inner horizontal scroller */
  }
  .process-v34-header { margin-bottom: 2.5rem; padding: 0 1.2rem; }
  .process-v34-stage { padding: 0; }

  /* Viewport is the native horizontal scroller */
  .process-v34-viewport {
    overflow-x: auto;
    overflow-y: visible;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    /* Internal padding so first/last cards have breathing room.
       No negative margins - we keep the scroller fully inside its parent. */
    padding: 6px 1.2rem 1rem;
  }
  .process-v34-viewport::-webkit-scrollbar { display: none; }

  /* Track: width sized to content, JS transforms disabled */
  .process-v34-track {
    transform: none !important;
    transition: none;
    gap: 1rem;
    width: max-content;
  }
  .proc-card {
    /* Each card ~ viewport width minus internal padding, so one card visible at a time */
    flex: 0 0 calc(100vw - 4rem);
    max-width: 380px; /* prevent on tablets-in-portrait from going too wide */
    scroll-snap-align: center;
    padding: 2rem 1.5rem;
  }
  .proc-card h4 { font-size: 1.35rem; }

  /* Hide arrows + dots - native scroll IS the affordance */
  .process-v34-controls { display: none; }
}

/* ===========================================================
   v3.5 / v3.6 — Bottom stats block (rostar-style closing)
   "Enjoy the music" eyebrow above three-stat row, light bg, footer follows
   =========================================================== */
.bottom-stats {
  background: var(--light);
  padding: 5rem 2rem 6rem;
  border-top: 1px solid var(--border);
  text-align: center;
}
.bottom-stats-inner {
  max-width: 1100px;
  margin: 0 auto;
}
.bottom-stats-inner .closing-enjoy {
  display: block;
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: clamp(1.4rem, 2.4vw, 1.8rem);
  color: var(--gold);
  margin-bottom: 2.5rem;
  letter-spacing: 0.01em;
}
.bottom-stats-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem 3rem;
}
.bstat {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.5rem;
  position: relative;
}
.bstat:not(:last-child)::after {
  content: '';
  position: absolute;
  right: -1.5rem;
  top: 20%;
  bottom: 20%;
  width: 1px;
  background: var(--border);
}
.bstat-label {
  font-family: 'Raleway', sans-serif;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--mid);
  order: 1;
}
.bstat-num {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(2.6rem, 5vw, 3.8rem);
  font-weight: 700;
  color: var(--gold);
  line-height: 1;
  order: 2;
}
.bstat-num sup {
  font-size: 0.6em;
  font-weight: 600;
  margin-left: 0.06em;
  vertical-align: top;
}

@media (max-width: 768px) {
  .bottom-stats { padding: 3.5rem 1.2rem 4.5rem; }
  .bottom-stats-inner .closing-enjoy { margin-bottom: 2rem; }
  .bottom-stats-grid { grid-template-columns: 1fr; gap: 2.5rem; }
  .bstat:not(:last-child)::after {
    right: auto;
    top: auto;
    bottom: -1.2rem;
    left: 30%;
    right: 30%;
    width: auto;
    height: 1px;
  }
}

/* ===========================================================
   v3.9 — Green felt EXTENDED to desktop on /lineup/
   The v3.1 rules below are mobile-only inside @media (max-width: 768px).
   These rules apply everywhere on the lineup page so desktop matches.
   Scoped to .page-template-page-lineup so it can't leak elsewhere.
   =========================================================== */

/* Cards section + controls bar wear the green felt on every viewport */
.page-template-page-lineup .lineup-controls {
  background: var(--green);
  position: relative;
  z-index: 3;
}
.page-template-page-lineup .cards-section {
  background: var(--green);
  position: relative;
}

/* Page hero — keep dark photo + content visible (don't change) */
/* but the controls bar transitions cleanly from hero → felt */

/* v3.36 — search bar styling consolidated to single block at file end */


/* "Reveal All" toggle — restyle for green background.
   Still visible on desktop; was hidden in mobile-only v3.1 carousel block. */
.page-template-page-lineup .lineup-controls .flip-all-label {
  color: rgba(255, 255, 255, 0.85);
}
.page-template-page-lineup .lineup-controls .flip-all-switch {
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.25);
}
.page-template-page-lineup .lineup-controls .flip-all-switch[aria-checked="true"] {
  background: var(--gold);
  border-color: var(--gold);
}
.page-template-page-lineup .lineup-controls .flip-all-knob {
  background: #fff;
}

/* Card counter (mobile-only element, but defensively style for green) */
.page-template-page-lineup .card-counter {
  background: rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.18);
}

/* Cards grid on desktop sits on the green felt with a little breathing room */
@media (min-width: 769px) {
  .page-template-page-lineup .cards-section {
    padding: 3rem 2rem 5rem;
  }
}

/* ===========================================================
   v3.10 — Perks section polish (visual coherence)
   Adds section header, icons, equal-height cells with flex layout
   =========================================================== */
.perks {
  padding: 5rem 2rem 6rem;  /* slightly more bottom breathing room */
}
.perks-header {
  max-width: 800px;
  margin: 0 auto 3.5rem;
  text-align: center;
}
.perks-header .sec-eyebrow {
  color: var(--gold);
}
.perks-header h2 {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(1.8rem, 3.5vw, 2.6rem);
  font-weight: 600;
  color: #fff;
  margin: 0.5rem 0 0;
  line-height: 1.15;
}

/* Equal-height cells via flex layout inside the grid */
.perk-cell {
  display: flex;
  flex-direction: column;
  min-height: 280px;
}
.perk-icon {
  width: 38px;
  height: 38px;
  color: var(--gold);
  margin-bottom: 1.4rem;
}
.perk-icon svg {
  width: 100%;
  height: 100%;
  display: block;
}
/* v3.20 — Removed `margin-top: auto` on perk-cell p.
   Body text now flows naturally beneath the subline, avoiding the
   floating-in-empty-space look with shorter copy. Cells still equal-height
   via min-height on .perk-cell; trailing space goes to the bottom of each cell. */

@media (max-width: 768px) {
  .perks {
    padding: 4rem 1.2rem 4.5rem;
  }
  .perks-header {
    margin-bottom: 2.5rem;
  }
  .perk-cell {
    min-height: auto;
    padding: 2.4rem 2rem;
  }
}

/* ===========================================================
   v3.17 — Desktop hover-to-flip on lineup cards
   Mobile keeps tap-to-flip + carousel auto-flip. Desktop adds hover.
   Scoped via min-width and hover capability to avoid touch-device misfires.
   =========================================================== */
@media (min-width: 769px) and (hover: hover) {
  /* Hover flips the card — UNLESS:
     - it's a placeholder
     - the user has clicked play (yt-playing) — never interrupt an active video
     - the card has been clicked/flipped explicitly (preserves clicked state) */
  .card-wrap:not(.card-placeholder):not(.yt-playing):not(.flipped):hover .card-inner {
    transform: rotateY(180deg);
  }
  /* Show play overlay on hover (matches the flipped state) */
  .card-wrap:not(.card-placeholder):not(.yt-playing):not(.flipped):hover .card-play-overlay {
    display: flex;
  }
}

/* ===========================================================
   v3.18 — Tablet breakpoint for 4-panel perks grid
   Between 769-1024px, 4 columns become 2x2 for legibility
   =========================================================== */
@media (min-width: 769px) and (max-width: 1024px) {
  .perks-inner { grid-template-columns: repeat(2, 1fr); }
}

/* ===========================================================
   v3.23 — Tighter About Us vertical rhythm
   =========================================================== */
.page-template-page-about .page-hero-short {
  min-height: 28vh;
}
.page-template-page-about .page-hero-content {
  padding: 2.5rem 2rem 2.5rem;
}
.page-template-page-about .about-body {
  padding: 3rem 2rem;
}

/* ===========================================================
   v3.32 — About Us "Our Story" oversized gold hero
   =========================================================== */
.page-hero.page-hero-textonly {
  min-height: auto;
  background: #fff;
  display: block;
  text-align: center;
  padding: 6rem 2rem 4rem;
}
.page-hero.page-hero-textonly .page-hero-content {
  padding: 0;
  max-width: 1400px;
  margin: 0 auto;
}
.page-hero.page-hero-textonly h1 {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(4rem, 12vw, 9rem);
  font-weight: 700;
  color: var(--gold);
  line-height: 1.0;
  margin: 0;
  letter-spacing: -0.015em;
  font-style: italic;
}

@media (max-width: 768px) {
  .page-hero.page-hero-textonly {
    padding: 3.5rem 1.2rem 2.5rem;
  }
  .page-hero.page-hero-textonly h1 {
    font-size: clamp(3rem, 16vw, 5rem);
  }
}

/* Dual-action CTA closer (about page) */
.about-closer .closing-cta-inner .sec-eyebrow {
  margin-bottom: 0.5rem;
  display: block;
}
.about-closer-actions {
  display: flex;
  gap: 1rem;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 0.5rem;
}
.btn-outline-cta {
  background: transparent;
  color: var(--gold);
  border: 1.5px solid var(--gold);
  font-family: 'Raleway', sans-serif;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 1rem 2.6rem;
  display: inline-block;
  transition: background 0.18s ease, color 0.18s ease;
}
.btn-outline-cta:hover {
  background: var(--gold);
  color: var(--dark);
}
@media (max-width: 480px) {
  .about-closer-actions { flex-direction: column; align-items: center; }
  .about-closer-actions a { width: 100%; max-width: 280px; }
}

/* ===========================================================
   v3.30 — Awards dynamic inputs container
   =========================================================== */
.af-awards-inputs {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}
.af-awards-inputs input[type="text"] {
  width: 100%;
}

/* ===========================================================================
   v3.36 — SEARCH BAR (single source of truth, end of file = highest precedence)
   ---------------------------------------------------------------------------
   Critical: the global rule `input[type="text"] { background:#f9f7f4 }` at
   ~line 251 has higher specificity (attr selector + element) than a plain
   `.search-input` class selector. Compound `input.search-input` selector
   matches that specificity AND wins via source order.
   =========================================================================== */

/* Layout wrap */
.search-wrap {
  position: relative;
  max-width: 460px;
  width: 100%;
}
.lineup-controls .search-wrap {
  flex: 1;
  max-width: 420px;
  min-width: 200px;
}

/* Input — glass effect, pill shape, magnifying glass space on left, × space on right */
input.search-input {
  width: 100%;
  padding: 0.95rem 2.8rem 0.95rem 2.8rem;
  border: 1px solid rgba(255,255,255,0.35);
  font-family: 'Raleway', sans-serif;
  font-size: 0.92rem;
  background: rgba(255,255,255,0.18);
  backdrop-filter: blur(20px) saturate(140%);
  -webkit-backdrop-filter: blur(20px) saturate(140%);
  outline: none;
  border-radius: 9999px;
  -webkit-appearance: none;
  color: #fff;
  box-shadow:
    0 2px 14px rgba(0,0,0,0.08),
    inset 0 1px 0 rgba(255,255,255,0.2);
  transition: border-color 0.18s, background 0.18s;
}
input.search-input:focus {
  border-color: rgba(255,255,255,0.7);
  background: rgba(255,255,255,0.26);
}
input.search-input::placeholder {
  color: rgba(255,255,255,0.75);
}

/* Magnifying glass — always visible on LEFT */
.search-wrap .search-icon {
  position: absolute;
  left: 1.05rem;
  top: 50%;
  transform: translateY(-50%);
  width: 17px;
  height: 17px;
  color: rgba(255,255,255,0.85);
  pointer-events: none;
}

/* × clear button — visible only when input has value, on RIGHT */
.search-wrap .search-clear {
  position: absolute;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  cursor: pointer;
  font-size: 1.5rem;
  color: rgba(255,255,255,0.85);
  display: none;
  line-height: 1;
  padding: 0 0.2rem;
  transition: color 0.15s;
}
.search-wrap .search-clear:hover { color: #fff; }
.search-wrap.has-value .search-clear { display: block; }

/* Suggestions dropdown — dark glass to match input */
.search-wrap .search-dropdown {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  background: rgba(17, 17, 17, 0.92);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 12px;
  z-index: 50;
  display: none;
  box-shadow: 0 12px 28px rgba(0,0,0,0.28);
  overflow: hidden;
}
.search-wrap .search-dropdown.open { display: block; }
.search-wrap .search-suggestion {
  padding: 0.7rem 1.1rem;
  font-size: 0.85rem;
  cursor: pointer;
  transition: background 0.12s;
  text-transform: capitalize;
  color: rgba(255,255,255,0.9);
}
.search-wrap .search-suggestion:hover {
  background: rgba(255,255,255,0.08);
}
.search-wrap .search-suggestion em {
  color: var(--gold);
  font-style: normal;
  font-weight: 700;
}

/* Mobile */
@media (max-width: 768px) {
  .lineup-controls .search-wrap {
    max-width: 100%;
    flex: 1;
  }
  input.search-input {
    font-size: 0.9rem;
    padding: 0.85rem 2.6rem 0.85rem 2.6rem;
  }
}

/* ===========================================================
   v3.38 — Role slots (I am a... multi-select via add-another)
   =========================================================== */
.role-slots {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  max-width: 420px;
}
.role-slots .role-select {
  width: 100%;
}
.role-slots .role-select option:disabled {
  color: #c7c2b8;
}
#role-other-input {
  max-width: 420px;
}

/* ===========================================================
   v3.40 — Stronger mobile horizontal-leak guard (page-swipe fix)
   ---------------------------------------------------------------------------
   Three layers of defense, because v3.39's single-layer guard wasn't enough:

   1. html/body get both `clip` (modern, doesn't break sticky) AND `hidden`
      (fallback for iOS Safari <16). Later declaration wins on supporting
      browsers. The `hidden` on html historically broke sticky nav, but
      applying it to `html` is safer than `body` since sticky positions
      relative to the nearest scrolling ancestor.
   2. Touch-action: pan-y on body so iOS recognises the page as vertically-
      scrolling, preventing carousel swipe momentum from bubbling.
   3. Carousel viewport gets touch-action: pan-x so swipes there stay there.
   =========================================================== */
@media (max-width: 768px) {
  html { overflow-x: clip; overflow-x: hidden; }
  body { overflow-x: clip; overflow-x: hidden; touch-action: pan-y; }
  .process-v34-viewport { touch-action: pan-x; }
}
