/* ==========================================================================
   Camp Nackte — shared brand layer (liquid glass)
   Loaded last on every public page, on top of each page's own <style>.
   It only restyles; layout, content and behavior stay with each page.
   ========================================================================== */
:root{
  --g-blur:blur(24px) saturate(180%);
  --g-line:rgba(255,255,255,.28);
  --g-card:rgba(255,255,255,.55);
  --g-card-line:rgba(255,255,255,.85);
  --g-card-shadow:0 10px 34px rgba(36,70,70,.10),inset 0 1px 0 #fff;
  --g-card-shadow-hover:0 20px 48px rgba(36,70,70,.16),inset 0 1px 0 #fff;
  --g-glow:radial-gradient(600px 400px at 8% 10%,rgba(246,103,107,.14),transparent 70%),
           radial-gradient(700px 500px at 95% 30%,rgba(91,129,255,.10),transparent 70%),
           radial-gradient(600px 500px at 50% 100%,rgba(251,210,97,.16),transparent 70%);
}
[data-theme="night"]{
  --g-card:rgba(32,66,63,.55);
  --g-card-line:rgba(255,255,255,.12);
  --g-card-shadow:0 10px 34px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.08);
  --g-card-shadow-hover:0 20px 48px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.1);
  --g-glow:radial-gradient(600px 400px at 8% 10%,rgba(246,103,107,.12),transparent 70%),
           radial-gradient(700px 500px at 95% 30%,rgba(155,97,242,.14),transparent 70%);
}

/* 0. Fonts: Futura (built into iPhone/Mac), Jost elsewhere. Form controls follow the page font. */
button,input,select,textarea{font-family:inherit}

/* 1. No all-caps labels. Section labels become italic Playfair in brand colors. */
.section-label,.vibe-label,.page-hero-label,.flag-label,.hero-eyebrow,.section-eyebrow,
.acc-feat-kicker,.chooser-label,.privacy-promise-label,.kicker{
  text-transform:none!important;letter-spacing:0!important;font-family:'Playfair Display',serif!important;
  font-style:italic;font-weight:700!important;font-size:20px!important;margin-bottom:6px!important}
.hero-eyebrow{font-size:22px!important;margin-bottom:12px!important}
.kicker{font-size:18px!important}
.arc-label,.priv-label,.tag-label,.acc-cal-lbl{
  text-transform:none!important;letter-spacing:0!important;font-family:'Playfair Display',serif!important;
  font-style:italic;font-weight:700!important;font-size:16px!important}
/* Pills, badges and small print: sentence case, a touch larger */
.event-tag,.event-sponsor,.badge-lbl,.hero-badge,.footer-col h5,.footer-newsletter-text h5,.marquee-track span,
.shop-promo-badge,.hd-pill,.hd-badge-sig,.hd-badge-sponsor,.hd-badge-cls,.acc-feat-pill,.acc-feat-sponsor,
.event-pill,.shop-photo .ph,.header-sub{text-transform:none!important;letter-spacing:.01em!important}
.event-tag,.hd-pill,.acc-feat-pill,.event-pill{font-size:12px!important;border-radius:999px!important;padding:5px 12px!important}
.event-sponsor,.acc-feat-sponsor{font-size:12px!important}
.hd-badge-sig,.hd-badge-sponsor,.hd-badge-cls{font-size:11px!important}
.badge-lbl{font-size:11px!important}
.hero-badge{font-size:13px!important}
.header-sub{font-size:14px!important}
.footer-col h5,.footer-newsletter-text h5{font-size:14px!important;color:rgba(255,255,255,.6)!important}
.marquee-track span{letter-spacing:.02em!important}
/* Taglines: flirty italic instead of shouty caps */
.event-tagline,.hd-tagline,.acc-feat-tagline{text-transform:none!important;letter-spacing:0!important;font-style:italic;font-size:14px!important}
.hd-tagline{font-size:13px!important}
/* Form labels and headings (booking, shop, waiver) */
.field label,.shop-field label,.form-section-title,.site-group-label,.vehicle-label,.selection-summary-label,
.ref-label,.sig-label,.card h3,.dp-weekdays span,
[style*="text-transform:uppercase"]:not(input):not(textarea){text-transform:none!important;letter-spacing:0!important}
.form-section-title{font-size:15px!important}
.card h3{font-size:15px!important}
.ref-label,.selection-summary-label{font-size:12px!important}

/* 2. Nav: always a floating frosted-teal glass pill */
nav,nav.nav-scrolled{top:12px!important;left:20px!important;right:20px!important;border-radius:999px!important;
  background:rgba(26,51,51,.42)!important;backdrop-filter:var(--g-blur)!important;-webkit-backdrop-filter:var(--g-blur)!important;
  border:1px solid var(--g-line)!important;box-shadow:0 12px 36px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.18)!important;
  padding:8px 10px 8px 22px!important}
nav.nav-scrolled{background:rgba(26,51,51,.66)!important}
.nav-links a{border-radius:999px}
.nav-links a::after{display:none}
.nav-links a:hover,.nav-links a.active{background:rgba(255,255,255,.16)}

/* 3. Hero: headline and copy sit on a light glass panel. The video should stay clearly visible through it. */
.hero-content{background:rgba(12,28,28,.16);backdrop-filter:blur(4px) saturate(130%);-webkit-backdrop-filter:blur(4px) saturate(130%);
  border:1px solid rgba(255,255,255,.18);border-radius:36px;box-shadow:0 24px 60px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.14);
  padding:28px 40px 32px!important;max-width:780px;margin:104px auto 48px}
.hero-content .hero-headline,.hero-content .hero-sub,.hero-content h1,.hero-content p{text-shadow:0 2px 14px rgba(0,0,0,.45),0 1px 3px rgba(0,0,0,.35)}
.hero-logo{display:block!important;margin:0 auto 12px!important;height:88px!important}
/* Private events hero is shorter, so the panel sits a little tighter */
.hero-video~.hero-content{margin:90px 24px 40px}
/* Inner page heroes: soft brand light behind the headline */
.page-hero,.page-header{background-image:radial-gradient(520px 320px at 12% 20%,rgba(246,103,107,.16),transparent 70%),
  radial-gradient(560px 360px at 90% 80%,rgba(251,210,97,.12),transparent 70%)}

/* 4. Buttons: glass sheen and a springy press */
.btn-primary,.hero-cta,.nav-book,.mobile-book-cta,.form-submit,.event-ticket-btn,.event-btn-primary,.btn-priv-p,
.phone-btn-book,.btn-select,.btn-insta,.footer-newsletter-form button{position:relative;overflow:hidden}
.btn-primary,.hero-cta,.form-submit,.event-ticket-btn,.event-btn-primary,.btn-priv-p,.phone-btn-book,.btn-select,.btn-insta{
  transition:transform .15s cubic-bezier(.3,1.6,.5,1),box-shadow .25s,filter .2s,background .2s}
.btn-primary::before,.hero-cta::before,.nav-book::before,.mobile-book-cta::before,.form-submit::before,.event-ticket-btn::before,
.event-btn-primary::before,.btn-priv-p::before,.phone-btn-book::before,.btn-select::before,.btn-insta::before,
.footer-newsletter-form button::before{content:'';position:absolute;inset:0;border-radius:inherit;
  background:linear-gradient(180deg,rgba(255,255,255,.32),rgba(255,255,255,0) 55%);pointer-events:none}
.btn-primary:active:not(:disabled),.hero-cta:active,.nav-book:active,.mobile-book-cta:active,.form-submit:active:not(:disabled),
.event-ticket-btn:active,.event-btn-primary:active,.btn-priv-p:active,.phone-btn-book:active,.btn-select:active,.btn-insta:active,
.footer-newsletter-form button:active:not(:disabled){transform:scale(.95)!important}

/* 5. Light sections get soft coral, blue and yellow light behind them */
body{background:var(--g-glow),var(--cream,var(--bg-warm,#FBF8F3));background-attachment:fixed}
.amenities,.events,#events,.story,.community-section,.audience,.details,
section[style*="background:var(--cream)"],section[style*="background:var(--warm)"]{
  position:relative;background:var(--g-glow),var(--cream,var(--bg-warm,#FBF8F3))!important}

/* 6. Cards become translucent glass */
.amenity-card,.event-card,.value-card,.stat,.hours-card,.acc-feat-card,.acc-row,.project-card,.form-block,.chooser-card,
.shop-card,.audience-card,.waiver-notice-light{
  border-radius:26px!important;background:var(--g-card)!important;backdrop-filter:var(--g-blur);-webkit-backdrop-filter:var(--g-blur);
  border:1px solid var(--g-card-line)!important;box-shadow:var(--g-card-shadow)!important}
.chooser-card:hover{border-color:var(--coral)!important}
.event-card,.acc-feat-card,.acc-row{position:relative;overflow:hidden}
/* Accent bar: teal for regular events, coral-to-yellow for signature weekends */
.event-card::before,.acc-feat-card::before,.acc-row::before{content:'';position:absolute;left:0;top:18px;bottom:18px;width:4px;border-radius:4px;background:var(--teal);z-index:1}
.event-card.signature::before,.acc-feat-card-sig::before,.acc-row.acc-sig::before{background:linear-gradient(var(--coral),var(--yellow,#FBD261))}
.event-card.closed::before,.acc-row.acc-cls::before{background:#bbb}
[data-theme="night"] .event-card::before,[data-theme="night"] .acc-feat-card::before,[data-theme="night"] .acc-row::before{background:#7FD1C7}
[data-theme="night"] .event-card.signature::before,[data-theme="night"] .acc-feat-card-sig::before,[data-theme="night"] .acc-row.acc-sig::before{background:linear-gradient(var(--coral),var(--yellow,#FFDD85))}
.audience-card{border-top:1px solid var(--g-card-line)!important;position:relative;overflow:hidden}
.audience-card::before{content:'';position:absolute;left:24px;right:24px;top:0;height:4px;border-radius:0 0 4px 4px;background:var(--teal)}
[data-theme="night"] .audience-card::before{background:#7FD1C7}
.event-card:hover,.amenity-card:hover{transform:translateY(-5px);box-shadow:var(--g-card-shadow-hover)!important}
.event-card-flier{border-radius:18px!important}
[data-theme="night"] .event-sponsor,[data-theme="night"] .acc-feat-sponsor,[data-theme="night"] .hd-badge-sponsor{color:#7FD1C7!important;background:rgba(127,209,199,.12)!important}
/* Booking and waiver cards: glass in day mode only, their night styling stays as is */
:root:not([data-theme="night"]) .site-card,:root:not([data-theme="night"]) .site-card-tent,
:root:not([data-theme="night"]) .card,:root:not([data-theme="night"]) .progress-wrap{
  background:rgba(255,255,255,.62);backdrop-filter:var(--g-blur);-webkit-backdrop-filter:var(--g-blur)}
:root:not([data-theme="night"]) .card{border:1px solid var(--g-card-line);border-radius:26px;box-shadow:var(--g-card-shadow)}

/* Night: smoky-teal glass for the booking strip and waiver cards, with readable labels */
[data-theme="night"] .progress-wrap{background:rgba(26,51,51,.55);backdrop-filter:var(--g-blur);-webkit-backdrop-filter:var(--g-blur);border-bottom-color:rgba(255,255,255,.08)}
[data-theme="night"] .prog-step.active .prog-dot,[data-theme="night"] .prog-step.done .prog-dot{background:#7FD1C7;border-color:#7FD1C7;color:#122A29}
[data-theme="night"] .prog-step.done:not(:last-child)::after{background:#7FD1C7}
[data-theme="night"] .prog-label{color:#9FC2BD}
[data-theme="night"] .prog-step.active .prog-label{color:#F3EDE0}
[data-theme="night"] .field label,[data-theme="night"] .form-section-title,
[data-theme="night"] [style*="color:var(--teal)"]:not(input):not(button):not(a){color:#9FC2BD!important}
[data-theme="night"] .card{background:var(--g-card);backdrop-filter:var(--g-blur);-webkit-backdrop-filter:var(--g-blur);
  border:1px solid var(--g-card-line);border-radius:26px;box-shadow:var(--g-card-shadow)}
[data-theme="night"] .card h1,[data-theme="night"] .card h2{color:var(--heading)}
[data-theme="night"] .card .field input,[data-theme="night"] .card .date-part,[data-theme="night"] .card input[type="text"],
[data-theme="night"] .card input[type="email"],[data-theme="night"] .card input[type="tel"]{
  background:rgba(255,255,255,.08);color:var(--text);border-color:rgba(255,255,255,.22)}
[data-theme="night"] .card input::placeholder{color:rgba(243,237,224,.45)}

/* Readability: text that used fixed dark colors and vanished in night mode, plus faint footer print */
.insta-sub{color:var(--text-mid)!important}
.footer-copy{color:rgba(255,255,255,.6)!important}
.faq-a a{color:var(--accent-text);font-weight:600}
[data-theme="night"] .shop-err{color:#FFA69E}
/* Night keeps the day coral on buttons and pills so their white text stays crisp */
[data-theme="night"] :is(.btn-primary,.hero-cta,.nav-book,.mobile-book-cta,.form-submit,.event-ticket-btn,.event-btn-primary,.btn-priv-p,
  .phone-btn-book,.footer-newsletter-form button,.shop-promo-badge,.event-card.signature .event-tag,.hd-pill-sig,.acc-feat-pill-sig,.cn-tabbar .book){--coral:#F6676B}

/* 7. Pillars, reviews and vibe bubbles: frosted tiles on teal */
.pillars-inner{gap:14px}
.pillar{border-radius:24px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.14)}
.review-card{border-radius:24px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:inset 0 1px 0 rgba(255,255,255,.14)}
.vibe-bullet{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:inset 0 1px 0 rgba(255,255,255,.18)}

/* 8. Phones: glass tab bar (markup added by brand.js), one-column vibe */
.cn-tabbar{display:none}
@media(max-width:768px){
  /* Anything the browser scrolls into view (a focused field, an opened popup) stops above the tab bar (D151) */
  html{scroll-padding-bottom:calc(110px + env(safe-area-inset-bottom,0px))}
  nav,nav.nav-scrolled{left:10px!important;right:10px!important;top:10px!important;padding:6px 8px 6px 16px!important}
  .hero-content{margin:92px 14px 36px;padding:20px 18px 24px!important;border-radius:28px}
  .hero-logo{height:68px!important}
  .hero-video~.hero-content{margin:80px 14px 30px}
  .vibe-bullets{grid-template-columns:1fr;gap:10px}.vibe-bullet{border-radius:20px}
  .cn-tabbar{display:flex;position:fixed;z-index:210;left:12px;right:12px;bottom:calc(14px + env(safe-area-inset-bottom,0px));border-radius:28px;padding:7px;
    justify-content:space-around;align-items:center;
    background:rgba(26,51,51,.66);backdrop-filter:var(--g-blur);-webkit-backdrop-filter:var(--g-blur);border:1px solid var(--g-line);
    box-shadow:0 12px 36px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.14)}
  .cn-tabbar a{display:flex;flex-direction:column;align-items:center;gap:2px;font:600 10.5px Futura,'Jost',sans-serif;color:rgba(255,255,255,.75);
    text-decoration:none;padding:6px 8px;border-radius:18px;min-width:54px;-webkit-tap-highlight-color:transparent;transition:transform .15s cubic-bezier(.3,1.6,.5,1)}
  .cn-tabbar a:active{transform:scale(.92)}
  .cn-tabbar a.on,.cn-tabbar a.more.open{color:#fff;background:rgba(255,255,255,.14)}
  .cn-tabbar a i{font-style:normal;font-size:19px;line-height:1.1}
  .cn-tabbar .book{position:relative;overflow:hidden;background:var(--coral);color:#fff;width:56px;height:56px;min-width:56px;border-radius:50%;justify-content:center;
    margin-top:-24px;box-shadow:0 10px 24px rgba(246,103,107,.5);font-size:12px}
  .cn-tabbar .book::before{content:'';position:absolute;inset:0;border-radius:inherit;background:linear-gradient(180deg,rgba(255,255,255,.32),rgba(255,255,255,0) 55%);pointer-events:none}
  .cn-tabbar .book.on{background:var(--coral);box-shadow:0 0 0 3px rgba(255,255,255,.35),0 10px 24px rgba(246,103,107,.5)}
  /* One persistent bar on phones: the top nav scrolls away with the page, the tab bar stays */
  nav,nav.nav-scrolled{position:absolute!important}
  /* Open menu: clear the nav and tab bar, scroll if it's taller than the screen */
  .mobile-menu{justify-content:flex-start!important;overflow-y:auto;-webkit-overflow-scrolling:touch;gap:2px!important;
    padding:92px 20px calc(118px + env(safe-area-inset-bottom,0px))!important}
  .mobile-menu::before,.mobile-menu::after{content:'';flex:1 0 0}
  .mobile-menu>*{flex-shrink:0}
  .mobile-menu a{font-size:23px!important;padding:8px 24px!important}
  .mobile-menu .mobile-book-cta{margin-top:12px;padding:13px 40px!important}
  .mobile-menu .menu-divider{margin:8px 0}
  .mobile-menu .mobile-lantern-toggle{margin-top:14px}
  .story-badge{right:4px!important}
  footer{padding-bottom:110px!important}
  body.cn-no-footer{padding-bottom:100px}
}
/* Shorter phones (and in-app browsers): tighter menu so everything fits without scrolling */
@media(max-width:768px) and (max-height:760px){
  .mobile-menu a{font-size:20px!important;padding:6px 20px!important}
  .mobile-menu .mobile-book-cta{padding:11px 34px!important;margin-top:8px}
  .mobile-menu{padding-top:80px!important}
}
@media(prefers-reduced-motion:reduce){
  .btn-primary:active,.hero-cta:active,.nav-book:active,.form-submit:active,.cn-tabbar a:active{transform:none!important}
}
/* Waiver: the nav starts over the light page, so give it a touch more tint there */
body:has(.header-sub) nav:not(.nav-scrolled){background:rgba(26,51,51,.66)!important}