/* Four Dogs Entertainment — Split Brand System
   Loaded last on every page. Visual layer only. No layout, URL, or content changes.
   mode-bar   = navy #011027 base, teal #3BB7C0 + gold #FEA521 neon accents
   mode-event = cream #FDF7E5 base, green #9DC276 + gold #FEA521 soft accents
   Gold #FEA521 is the connective thread across both modes. */

/* ================================================================
   1. TOKEN VALUES — true brand palette, both modes
   ================================================================ */
body.mode-bar{
  --navy:#011027;
  --navy-2:#04203F;
  --panel:#061C36;
  --panel-2:#04182E;
  --cream:#FDF7E5;
  --cream-2:#04182E;            /* tinted sections go dark in bar mode */
  --teal:#3BB7C0;
  --teal-bright:#5FD6DF;
  --gold:#FEA521;
  --gold-soft:#FFC163;
  --ink:#011027;
  --body:#B9C9DC;
  --muted:#8CA2BB;
  --line:rgba(59,183,192,.20);
  --line-dark:rgba(253,247,229,.14);
  --white:#061C36;              /* "white" cards become navy panels */
  --shadow:0 18px 50px -22px rgba(0,0,0,.75);
  --shadow-soft:0 10px 30px -16px rgba(0,0,0,.6);
  --glow-teal:0 0 14px rgba(59,183,192,.45),0 0 42px rgba(59,183,192,.18);
  --glow-gold:0 0 16px rgba(254,165,33,.42),0 0 48px rgba(254,165,33,.16);
  background:var(--navy);
  color:var(--body);
}
body.mode-event{
  --navy:#011027;
  --navy-2:#04203F;
  --panel:#FFFFFF;
  --cream:#FDF7E5;
  --cream-2:#F6EDD6;
  --teal:#5F8A3B;               /* small green text, readable on cream */
  --teal-bright:#9DC276;        /* brand green for fills and borders */
  --green:#9DC276;
  --gold:#C07A00;               /* gold for small text, readable on cream */
  --gold-soft:#FEA521;          /* true brand gold for buttons and rules */
  --ink:#011027;
  --body:#3A4656;
  --muted:#77808D;
  --line:#E8DDC2;
  --line-dark:rgba(253,247,229,.14);
  --white:#FFFFFF;
  background:var(--cream);
  color:var(--body);
}

/* ================================================================
   2. BAR MODE — dark venue energy (Astro pages)
   ================================================================ */
body.mode-bar h1,body.mode-bar h2,body.mode-bar h3,
body.mode-bar .h1,body.mode-bar .h2{color:var(--cream)}

/* Energetic condensed headline type */
body.mode-bar h1,body.mode-bar .h1,
body.mode-bar h2,body.mode-bar .h2{
  font-family:"Barlow Condensed",var(--display,"Fraunces"),sans-serif;
  font-weight:700;text-transform:uppercase;letter-spacing:.015em;line-height:.96;
}
body.mode-bar .h1{font-size:clamp(2.8rem,7vw,5rem)}
body.mode-bar h3{font-family:var(--sans,"Inter",sans-serif);font-weight:800;letter-spacing:0}

/* Neon eyebrow labels */
body.mode-bar .eyebrow{color:var(--teal-bright);text-shadow:0 0 12px rgba(59,183,192,.55);letter-spacing:.2em}
body.mode-bar .kicker{color:var(--gold)}
body.mode-bar .lead{color:#C6D5E7}
body.mode-bar .sub{color:var(--muted)}

/* Sections */
body.mode-bar .section{background:var(--navy)}
body.mode-bar .section.tint{background:var(--panel-2)}
body.mode-bar .section.dark{background:#000B18;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
body.mode-bar .section.dark .h2,body.mode-bar .section.dark h3{color:var(--cream)}
body.mode-bar .section.dark .sub{color:var(--muted)}

/* Cards as lit panels with bold borders */
body.mode-bar .card{background:var(--panel);border:2px solid rgba(59,183,192,.26);box-shadow:var(--shadow-soft)}
body.mode-bar .card:hover{border-color:var(--teal);box-shadow:var(--glow-teal)}
body.mode-bar .card h3{color:var(--cream)}
body.mode-bar .card p{color:var(--body)}
body.mode-bar .card .tag{color:var(--gold)}
body.mode-bar .text-link{color:var(--teal-bright)}

/* Neon signage buttons */
body.mode-bar .btn-primary{
  background:linear-gradient(135deg,#F09312,var(--gold) 55%,var(--gold-soft));
  color:#241500;box-shadow:var(--glow-gold);border:2px solid rgba(255,214,140,.55);
}
body.mode-bar .btn-primary:hover{box-shadow:0 0 22px rgba(254,165,33,.6),0 0 64px rgba(254,165,33,.24);transform:translateY(-2px)}
body.mode-bar .btn-gold{background:linear-gradient(135deg,#F09312,var(--gold-soft));color:#241500;box-shadow:var(--glow-gold);border:2px solid rgba(255,214,140,.5)}
body.mode-bar .btn-ghost,body.mode-bar .btn-outline{
  background:rgba(59,183,192,.07);border:2px solid var(--teal);color:var(--teal-bright);
  box-shadow:inset 0 0 12px rgba(59,183,192,.12),var(--glow-teal);text-shadow:0 0 8px rgba(95,214,223,.5);
}
body.mode-bar .btn-ghost:hover,body.mode-bar .btn-outline:hover{background:rgba(59,183,192,.16);box-shadow:inset 0 0 16px rgba(59,183,192,.2),0 0 20px rgba(59,183,192,.55)}

/* Events list */
body.mode-bar .event{background:var(--panel);border:1px solid var(--line);border-left:4px solid var(--teal)}
body.mode-bar .event.bingo{border-left-color:var(--gold)}
body.mode-bar .event .what b{color:var(--cream)}
body.mode-bar .event .when{color:var(--teal-bright)}

/* FAQ */
body.mode-bar .faq details{border-bottom:1px solid var(--line-dark)}
body.mode-bar .faq summary{color:var(--cream)}
body.mode-bar .faq summary:after{color:var(--gold)}
body.mode-bar .faq p{color:var(--body)}

/* Feature list bullets */
body.mode-bar .feature-list li{color:var(--body)}

/* Header and nav — navy with gold thread */
body.mode-bar .hdr{background:rgba(1,16,39,.94);border-bottom:1px solid var(--line)}
body.mode-bar .nav-menu{background:var(--navy-2);border-color:var(--line)}
body.mode-bar .links a:hover,body.mode-bar .nav-group-trigger:hover{color:var(--gold)}
body.mode-bar .brand-txt small{color:var(--teal-bright)}

/* Footer */
body.mode-bar .ftr{background:#000B18;border-top:1px solid var(--line)}
body.mode-bar .ftr a:hover{color:var(--gold)}

/* Proof band + testimonial cards
   (!important needed: page CSS uses higher-specificity [data-astro-cid] attribute selectors) */
body.mode-bar .proof-band{background:var(--panel-2)!important;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
body.mode-bar .proof-band blockquote,body.mode-bar .proof-grid blockquote{color:var(--cream)!important}
body.mode-bar .proof-grid .who{color:var(--cream)!important}
body.mode-bar .proof-grid .who span{color:var(--gold)!important}
body.mode-bar .proof-grid .proof-line{color:var(--body)!important}
body.mode-bar .tcard{background:var(--panel)!important;border-color:var(--line)!important}
body.mode-bar .tcard blockquote{color:var(--cream)!important}
body.mode-bar .tcard figcaption{color:var(--muted)!important}
body.mode-bar .tcard .tag{color:var(--teal-bright)!important}

/* Interior page heroes (.hero3d loads no background outside the homepage) */
body.mode-bar .hero3d{
  background:
    radial-gradient(560px 340px at 82% 0%,rgba(59,183,192,.16),transparent 70%),
    radial-gradient(460px 300px at 8% 100%,rgba(254,165,33,.10),transparent 70%),
    var(--navy-2);
  border-bottom:1px solid var(--line);
}

/* Forms (booking) */
body.mode-bar input,body.mode-bar select,body.mode-bar textarea{
  background:var(--panel)!important;color:var(--cream)!important;border:1px solid rgba(59,183,192,.35)!important;border-radius:10px;
}
body.mode-bar input::placeholder,body.mode-bar textarea::placeholder{color:var(--muted)}
body.mode-bar input:focus,body.mode-bar select:focus,body.mode-bar textarea:focus{outline:none;border-color:var(--teal)!important;box-shadow:var(--glow-teal)}
body.mode-bar label{color:var(--cream)!important}

/* ---- Homepage premium sections (home-premium.css overrides) ---- */
body.mode-bar .premium-muted{background:linear-gradient(180deg,var(--panel-2),#020F1F)}
body.mode-bar .path-card{background:var(--panel);border:2px solid rgba(59,183,192,.24);box-shadow:var(--shadow-soft)}
body.mode-bar .path-card:hover{border-color:var(--teal);box-shadow:var(--glow-teal)}
body.mode-bar .path-card h3{color:var(--cream)}
body.mode-bar .path-card .tag{color:var(--gold)}
body.mode-bar .experience-list h3{color:var(--cream)}
body.mode-bar .weekly-strip{background:var(--panel-2);border-color:var(--line)}
body.mode-bar .weekly-item{background:var(--panel);border:1px solid var(--line)}
body.mode-bar .weekly-item b{color:var(--cream)}
body.mode-bar .weekly-item span:first-child{color:var(--gold)}
body.mode-bar .review-card{background:var(--panel);border:1px solid var(--line)}
body.mode-bar .review-card blockquote{color:var(--cream)}
body.mode-bar .review-card figcaption{color:var(--muted)}
body.mode-bar .review-card .tag{color:var(--gold)}
body.mode-bar .reviews-premium .review-grid{grid-template-columns:repeat(3,1fr)}
@media (max-width:1050px){body.mode-bar .reviews-premium .review-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){body.mode-bar .reviews-premium .review-grid{grid-template-columns:1fr}}
body.mode-bar .step-card .number{background:linear-gradient(135deg,#F09312,var(--gold-soft));box-shadow:var(--glow-gold)}

/* ---- Guide pages (site.css system) ---- */
body.mode-bar .topbar{background:#000B18;color:var(--cream)}
body.mode-bar .topbar a{color:var(--gold)}
body.mode-bar .nav{background:rgba(1,16,39,.94);border-bottom:1px solid var(--line)}
body.mode-bar .nav .links a,body.mode-bar .brand b{color:var(--cream)}
body.mode-bar .nav .links a:hover{color:var(--gold)}
body.mode-bar .brand small{color:var(--teal-bright)}
body.mode-bar .hamb{color:var(--cream);border-color:var(--line)}
body.mode-bar .section.alt{background:var(--panel-2)}
body.mode-bar .badge{background:var(--panel);border-color:var(--line);color:var(--gold)}
body.mode-bar .stat{background:var(--panel);border-color:var(--line)}
body.mode-bar .stat strong{color:var(--cream)}
body.mode-bar .notice{background:var(--panel);border-color:var(--line);color:var(--body)}
body.mode-bar .cta-panel{background:var(--panel-2);border:2px solid rgba(59,183,192,.26)}
body.mode-bar .cta-panel h2,body.mode-bar .cta-panel .h2{color:var(--cream)}
body.mode-bar .proof{background:var(--panel);border-color:var(--line)}
body.mode-bar .proof strong{color:var(--cream)}
body.mode-bar .host-card{background:var(--panel);border-color:var(--line)}
body.mode-bar .host-card h3{color:var(--cream)}
body.mode-bar .faq-item,body.mode-bar .faq details{background:transparent;border-color:var(--line-dark)}
body.mode-bar article,body.mode-bar article p,body.mode-bar article li{color:var(--body)}
body.mode-bar blockquote{color:var(--cream)}

/* ================================================================
   3. EVENT MODE — cream editorial upscale (weddings, private, corporate)
   ================================================================ */
body.mode-event h1,body.mode-event h2,body.mode-event h3,
body.mode-event .h1,body.mode-event .h2{color:var(--ink);font-family:"Fraunces",Georgia,serif;font-weight:500;letter-spacing:-.01em}
body.mode-event .h1{line-height:1.04}
body.mode-event .eyebrow{color:var(--teal);letter-spacing:.24em}
body.mode-event .kicker,body.mode-event .card .tag{color:var(--gold)}

/* Editorial gold hairline over section headings — the connective gold thread */
body.mode-event .section-head h2:before,body.mode-event .section-head .h2:before{
  content:"";display:block;width:46px;height:2px;background:var(--gold-soft);margin-bottom:18px;
}

/* Sections stay airy cream */
body.mode-event .section{background:var(--cream)}
body.mode-event .section.tint{background:var(--cream-2)}
body.mode-event .section.dark{background:var(--navy)}
body.mode-event .section.dark .h2,body.mode-event .section.dark h3{color:var(--cream);font-weight:500}

/* Soft cards */
body.mode-event .card{background:var(--white);border:1px solid var(--line);box-shadow:0 8px 26px -18px rgba(1,16,39,.25)}
body.mode-event .card:hover{border-color:var(--green);box-shadow:0 14px 34px -18px rgba(157,194,118,.55)}
body.mode-event .card h3{font-family:"Fraunces",Georgia,serif;font-weight:600}

/* Buttons: green primary, gold secondary — soft, no neon */
body.mode-event .btn-primary{background:linear-gradient(135deg,#7FA85B,var(--green));color:#15230A;box-shadow:0 10px 24px -12px rgba(122,158,84,.6);border:1px solid rgba(157,194,118,.6)}
body.mode-event .btn-primary:hover{box-shadow:0 14px 30px -12px rgba(122,158,84,.75)}
body.mode-event .btn-gold{background:linear-gradient(135deg,var(--gold-soft),#FFC163);color:#2E1D00;border:1px solid rgba(254,165,33,.45);box-shadow:0 10px 24px -12px rgba(254,165,33,.5)}
body.mode-event .btn-ghost{border:1px solid rgba(253,247,229,.6);color:var(--cream)}
body.mode-event .btn-outline{border:1px solid var(--ink);color:var(--ink)}
body.mode-event .btn-outline:hover{background:var(--ink);color:var(--cream)}

/* Details */
body.mode-event .text-link{color:var(--teal)}
body.mode-event .feature-list li:before{background:radial-gradient(circle at 30% 30%,#B8D69A,var(--green))}
body.mode-event .event{border-left-color:var(--green)}
body.mode-event .event .when{color:var(--gold)}
body.mode-event .faq summary:after{color:var(--gold)}
body.mode-event .proof-band{background:var(--cream-2)!important}
body.mode-event .proof-grid blockquote{font-weight:500;font-style:italic}
body.mode-event .proof-grid .who span{color:var(--gold)}

/* Interior hero: cream editorial band. Overrides the inline white text the
   template hard-codes for a dark hero that never loads outside the homepage. */
body.mode-event .hero3d{
  background:linear-gradient(180deg,#FFFDF6,var(--cream));
  border-bottom:1px solid var(--line);
}
body.mode-event .hero3d .h1,body.mode-event .hero3d h1{color:var(--ink)!important}
body.mode-event .hero3d .lead{color:var(--body)!important}
body.mode-event .hero3d .sub{color:var(--muted)!important}
body.mode-event .hero3d p{color:var(--body)}
body.mode-event .hero3d .eyebrow{color:var(--teal)!important}

/* Header stays navy on event pages too — same navigation system, gold thread */
body.mode-event .hdr{background:rgba(1,16,39,.96);border-bottom:2px solid var(--gold-soft)}
body.mode-event .links a:hover,body.mode-event .nav-group-trigger:hover{color:var(--gold-soft)}
body.mode-event .nav-menu{background:var(--navy-2)}
body.mode-event .brand-txt small{color:var(--green)}
body.mode-event .ftr{background:var(--navy)}
body.mode-event .ftr a:hover{color:var(--gold-soft)}

/* Guide pages in event mode (site.css system) */
body.mode-event .topbar{background:var(--navy)}
body.mode-event .topbar a{color:var(--gold-soft)}
body.mode-event .nav{background:rgba(253,247,229,.95);border-bottom:2px solid var(--gold-soft)}
body.mode-event .section.alt{background:var(--cream-2)}
body.mode-event .cta-panel{background:var(--cream-2);border:1px solid var(--line)}
body.mode-event .badge{color:var(--teal);background:#F1F5E7;border-color:#DCE8C9}

/* Forms on event pages */
body.mode-event input:focus,body.mode-event select:focus,body.mode-event textarea:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(157,194,118,.3)}

/* ================================================================
   4. HOMEPAGE ADDITIONS — video hero + audience CTA row
   ================================================================ */
.home-hero .hero-bg-video{
  position:absolute;inset:0;z-index:-3;width:100%;height:100%;
  object-fit:cover;object-position:center 48%;filter:saturate(.98) contrast(1.03);
}
@media (max-width:700px){.home-hero .hero-bg-video{display:none}}
@media (prefers-reduced-motion:reduce){.home-hero .hero-bg-video{display:none}}

.audience-cta{background:#000B18;border-top:1px solid rgba(59,183,192,.2);border-bottom:1px solid rgba(59,183,192,.2);padding:30px 0}
.audience-cta-label{margin:0 0 14px;text-align:center;color:#8CA2BB;font-weight:800;font-size:.76rem;letter-spacing:.2em;text-transform:uppercase}
.audience-cta-row{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
.aud-btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:13px 22px;border-radius:999px;font-weight:800;font-size:.94rem;line-height:1.1;
  border:2px solid #3BB7C0;color:#5FD6DF;background:rgba(59,183,192,.06);
  box-shadow:inset 0 0 10px rgba(59,183,192,.1),0 0 12px rgba(59,183,192,.3);
  transition:transform .15s ease,box-shadow .15s ease,background .15s ease,color .15s ease;
}
.aud-btn:hover{transform:translateY(-2px);background:rgba(59,183,192,.16);box-shadow:0 0 18px rgba(59,183,192,.55)}
.aud-btn.aud-gold{border-color:#FEA521;color:#FFC163;background:rgba(254,165,33,.06);box-shadow:inset 0 0 10px rgba(254,165,33,.1),0 0 12px rgba(254,165,33,.3)}
.aud-btn.aud-gold:hover{background:rgba(254,165,33,.16);box-shadow:0 0 18px rgba(254,165,33,.55)}
.aud-btn.aud-cream{border-color:rgba(253,247,229,.55);color:#FDF7E5;background:rgba(253,247,229,.05);box-shadow:none}
.aud-btn.aud-cream:hover{background:rgba(253,247,229,.14)}
@media (max-width:560px){.audience-cta-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.aud-btn{font-size:.86rem;padding:12px 10px}.audience-cta-row .aud-btn:last-child{grid-column:1/-1}}

/* ================================================================
   5. GUIDE-PAGE LAYOUT FIXES (both modes, preexisting quirks)
   ================================================================ */
/* Brand name text (plain span, not matched by site.css selectors) */
body.mode-bar .nav .brand>span{color:var(--cream)}
body.mode-event .nav .brand>span{color:var(--ink)}

/* Keep the guide nav on one row at desktop */
@media (min-width:981px){
  .nav .nav-inner{flex-wrap:nowrap;gap:14px}
  .nav .links{gap:14px;font-size:.85rem;flex-wrap:nowrap}
  .nav .nav-cta{gap:8px}
  .nav .nav-cta .btn{padding:10px 15px;font-size:.84rem;white-space:nowrap}
  .nav .brand small{white-space:nowrap}
}

/* Quick-links sidebar: stacked links instead of run-together inline text */
.article-sidebar .card a{display:block;padding:9px 0;font-weight:700;border-bottom:1px solid var(--line)}
.article-sidebar .card a:last-child{border-bottom:0}
body.mode-bar .article-sidebar .card a{color:var(--cream)}
body.mode-bar .article-sidebar .card a:hover{color:var(--gold)}
body.mode-event .article-sidebar .card a:hover{color:var(--teal)}
.article-sidebar .kicker{margin-bottom:6px}

/* Quality floor */
body.mode-bar a:focus-visible,body.mode-event a:focus-visible,
body.mode-bar button:focus-visible,body.mode-event button:focus-visible{outline:3px solid #FEA521;outline-offset:2px}
@media (prefers-reduced-motion:reduce){
  body.mode-bar .btn-primary:hover,body.mode-bar .card:hover,.aud-btn:hover{transform:none}
}