/* Nova East Hartford preview overrides on top of css/styles.css */
.page-hero--r-trampoline{background-image:url('../assets/fb/trampoline-court-far-2400.webp')}
.page-hero--r-party{background-image:url('../assets/fb/party-purple-room-k-2400.webp');background-position:50% 40%}
.page-hero--r-court{background-image:url('../assets/fb/trampoline-court-green-orange-2400.webp')}
.page-hero--r-climb{background-image:url('../assets/fb/ninja-course-pillars-bikes-2400.webp')}
.page-hero--r-rope{background-image:url('../assets/fb/ropes-course-yellow-green-2400.webp')}
.ph{display:inline-block;background:#fff3a6;color:#8a1c00;border:2px dashed #e0531b;border-radius:6px;padding:0 .4em;font-weight:800;font-family:system-ui,"Microsoft YaHei","PingFang SC",sans-serif;letter-spacing:0;text-transform:none;line-height:1.5;font-size:.95em}
.amt .ph{font-size:.5em;vertical-align:middle}
.rd-preview-bar{position:relative;z-index:200;background:rgba(36,19,10,.92);color:#fff;text-align:center;font:600 12px/1.4 system-ui,sans-serif;padding:5px 12px}
@media (max-width:768px){.rd-preview-bar{font-size:11px}}
.rd-preview-bar .ph{font-size:12px}
.small-note{font-size:.9rem;color:var(--muted)}
/* Hero background video (Vimeo, background mode) — covers the hero like .hero-video */
.hero-vimeo{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;container-type:size}
.hero-vimeo iframe{opacity:0;transition:opacity .8s;position:absolute;top:50%;left:50%;border:0;width:max(100cqw,177.78cqh);height:max(100cqh,56.25cqw);transform:translate(-50%,-50%)}
@media (prefers-reduced-motion:reduce){.hero-vimeo{display:none}}
.hero-vimeo.is-playing iframe{opacity:1}
/* Click-to-watch video section  */
.video-feature .vf-player{position:relative;width:100%;max-width:960px;margin:16px auto 0;aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:#000;box-shadow:var(--shadow)}
.video-feature .vf-poster{all:unset;cursor:pointer;position:absolute;inset:0;display:block}
.video-feature .vf-poster img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--ease),filter .3s}
.video-feature .vf-poster:hover img,.video-feature .vf-poster:focus-visible img{transform:scale(1.03);filter:brightness(.85)}
.video-feature .vf-poster:focus-visible{outline:3px solid var(--plate);outline-offset:-3px}
.video-feature .vf-play{position:absolute;left:50%;top:50%;width:96px;height:96px;margin:-48px 0 0 -48px;border-radius:50%;background:var(--orange);box-shadow:0 0 0 10px rgba(255,255,255,.35),0 12px 30px rgba(0,0,0,.45);display:grid;place-items:center;transition:transform .3s var(--spring)}
.video-feature .vf-poster:hover .vf-play{transform:scale(1.1)}
.video-feature .vf-play svg{width:44px;height:44px;fill:#fff;margin-left:6px}
.video-feature .vf-player iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
/* Attractions video hero  */
.attr-vhero{position:relative;overflow:hidden;min-height:clamp(420px,62vh,600px);display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;background:#111}
.attr-vhero-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.attr-vhero .hero-vimeo{z-index:0}
.attr-vhero::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(0,0,0,.25) 0%,rgba(0,0,0,.45) 100%)}
.attr-vhero .container{position:relative;z-index:2;padding:48px 20px}
.attr-vhero h1{color:#fff;font-size:clamp(2.6rem,7vw,5.6rem);margin:.15em 0 .25em;text-shadow:0 3px 14px rgba(0,0,0,.55)}
.attr-vhero p{color:#fff;max-width:680px;margin:0 auto 1.2em;font-size:clamp(1.05rem,1.6vw,1.22rem);font-weight:600;text-shadow:0 2px 8px rgba(0,0,0,.6)}
.attr-vhero .eyebrow{background:rgba(255,255,255,.92);color:var(--orange-ink)}

/* Parties hero: whole decorated party-table photo (square) shown uncropped on the right at full hero height; title on the orange field at left */
.page-hero--parties-table{background:linear-gradient(90deg,var(--field) 0%,var(--field) 53%,rgba(255,153,28,0) 64%),url('../assets/fb/party-purple-room-k-2400.webp') right center/auto 100% no-repeat,var(--field);min-height:clamp(520px,44vw,680px);padding:0;display:flex;align-items:center;text-align:left}
.page-hero--parties-table .container{width:100%}
.page-hero--parties-table .ph-copy{max-width:min(46%,600px);padding:56px 0 72px}
.page-hero--parties-table h1{font-size:clamp(2.4rem,4.3vw,4.1rem)}
.page-hero--parties-table p{margin:0}
.page-hero--parties-table .btn-row--center{justify-content:flex-start}
.page-hero--parties-table::before{background:radial-gradient(ellipse 45% 70% at 24% 50%,rgba(255,227,192,.7) 0%,rgba(255,205,140,.35) 60%,rgba(255,180,81,0) 100%)}
@media (max-width:900px){
  /* mobile: title on orange, whole square photo full-width underneath (no crop, no zoom) */
  .page-hero--parties-table{background:url('../assets/fb/party-purple-room-k-1600.webp') center bottom/100% auto no-repeat,var(--field);min-height:0;display:block;padding:clamp(48px,12vw,80px) 0 calc(100vw + 10px);text-align:center}
  .page-hero--parties-table .ph-copy{max-width:none;padding:0}
  .page-hero--parties-table p{margin:0 auto}
  .page-hero--parties-table .btn-row--center{justify-content:center}
  .page-hero--parties-table::before{background:linear-gradient(180deg,rgba(255,227,192,.5) 0%,rgba(255,205,140,.25) 40%,rgba(255,180,81,0) 60%)}
}

/* "You are booking at" location label (tickets / book / parties) */
.loc-label{display:flex;align-items:center;gap:12px;max-width:900px;margin:0 auto 18px;padding:14px 20px;background:#fff;border:3px solid var(--ember,#E86A00);border-radius:14px;box-shadow:0 6px 18px rgba(0,0,0,.08);font-size:clamp(1rem,1.5vw,1.15rem);line-height:1.4;color:#2a1205;text-align:left}
.loc-label svg{flex:0 0 28px;width:28px;height:28px;fill:var(--ember,#E86A00)}
.loc-label strong{font-weight:800;color:#2a1205}
.loc-label .loc-addr{white-space:nowrap}
.loc-label--compact{display:inline-flex;margin:1.1em 0 0;padding:10px 16px;font-size:.98rem;border-width:2px;background:rgba(255,255,255,.92)}
.pkg-groups{margin-top:6px}
@media (max-width:900px){.loc-label--compact{margin:1em auto 0}}
@media (max-width:560px){.loc-label .loc-addr{white-space:normal;display:block}}

/* longer EH tagline headline: slightly smaller so it fits the hero card */
.hero-card h1{font-size:clamp(1.75rem,3.3vw,2.85rem);line-height:1.05}


/* Weekday/Weekend package reminder (page-local) */
.page-hero .pkg-day-note{display:flex;align-items:flex-start;gap:14px;max-width:720px;margin:1.4em auto 0;padding:16px 20px;background:#FFFBF4;border:3px solid var(--orange,#FF991C);border-radius:14px;box-shadow:0 10px 26px -12px rgba(120,55,0,.45);text-align:left;color:#2A1A0A;font-size:clamp(.98rem,1.4vw,1.08rem);line-height:1.5;font-weight:500;text-shadow:none}
.page-hero .pkg-day-note .pkg-day-note__icon{flex:0 0 40px;width:40px;height:40px;border-radius:50%;background:var(--orange-tint,#FFF0DD);color:var(--orange-ink,#A24E00);display:flex;align-items:center;justify-content:center}
.page-hero .pkg-day-note .pkg-day-note__icon svg{width:22px;height:22px}
.page-hero .pkg-day-note p{margin:0;max-width:none;font-size:inherit;color:inherit;font-weight:inherit;text-shadow:none}
.page-hero .pkg-day-note strong{font-weight:800;color:var(--orange-ink,#A24E00)}
.page-hero .pkg-day-note .pkg-day-note__lead{color:#2A1A0A}
@media (max-width:600px){.page-hero .pkg-day-note{gap:12px;padding:14px 14px;border-radius:12px;font-size:.97rem}.page-hero .pkg-day-note .pkg-day-note__icon{flex-basis:34px;width:34px;height:34px}.page-hero .pkg-day-note .pkg-day-note__icon svg{width:19px;height:19px}}


/* QA fixes 2026-10-17 */
/* Join form: day/time inputs were truncating the "e.g. 10am–5pm" placeholder */
.join-form .avail-grid input{padding-left:10px;padding-right:8px}
.join-form .avail-grid input::placeholder{font-size:.86em}
/* Join form references: grid areas were declared but never assigned, so "Years Known *" sat in a half-width cell and its label wrapped */
@media (max-width:900px){
  .join-form .ref-row>.ref-num{grid-area:n}
  .join-form .ref-row>div:nth-of-type(1){grid-area:a}
  .join-form .ref-row>div:nth-of-type(2){grid-area:b}
  .join-form .ref-row>div:nth-of-type(3){grid-area:c}
}
@media (min-width:901px){.join-form .avail-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:420px){.join-form .avail-grid{gap:8px}.join-form .avail-grid input{padding-left:8px;padding-right:5px}.join-form .avail-grid input::placeholder{font-size:.76em}}


/* ===== Top CTA bar on landscape phones + tablets (2026-10-17) =====
   Desktop header CTAs hide at <=1200px (hamburger), so the Buy Tickets / Book a Party bar now shows at every
   width up to 1200px (was <=768 only, leaving a 769–1200 gap). Desktop (>=1201) unchanged. */
.site-header{--mcta-h:0px}
@media (max-width:1200px){
  .site-header{--mcta-h:56px}
  .mobile-cta-bar{display:flex;width:100%}
  .mobile-cta-bar .mcta{flex:1 1 50%;min-width:0;height:var(--mcta-h);display:flex;align-items:center;justify-content:center;color:#fff;font-family:var(--font-head);font-weight:800;text-transform:uppercase;letter-spacing:.04em;font-size:1rem;text-decoration:none;text-shadow:0 1px 2px rgba(0,0,0,.35);white-space:nowrap}
  .mobile-cta-bar .mcta::after{content:none}
  .mobile-cta-bar .mcta-tickets{background:#1E6FE0}
  .mobile-cta-bar .mcta-party{background:var(--green)}
  .mobile-cta-bar .mcta:hover,.mobile-cta-bar .mcta:focus-visible{color:#fff;filter:brightness(1.08)}
  .mobile-cta-bar .mcta:focus-visible{outline:3px solid #fff;outline-offset:-5px}
  .main-nav .mobile-ctas{display:none!important}
  /* not-yet-revealed .reveal-right/.reveal-left blocks (translated ±60px) made the page side-scrollable on touch; clip without breaking sticky */
  main{overflow-x:clip}
  /* hamburger menu: fits under header+bar and scrolls on its own when taller than the screen */
  .main-nav{max-height:calc(100vh - var(--header-h) - var(--mcta-h));max-height:calc(100dvh - var(--header-h) - var(--mcta-h));overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
  /* anchor offset = full header + bar + breathing room */
  html{scroll-padding-top:calc(var(--eh-hdr,86px) + 56px + 10px)}
}
@media (min-width:681px) and (max-width:1200px){html{--eh-hdr:86px}}
@media (max-width:680px){html{--eh-hdr:72px}}
/* Short landscape screens (phones sideways): compact header + bar so they don't eat the viewport */
@media (max-width:1200px) and (max-height:500px) and (orientation:landscape){
  .site-header{--mcta-h:40px;--header-h:58px;--header-full:58px}
  .site-header.is-scrolled{--header-h:52px}
  .mobile-cta-bar .mcta{font-size:.9rem;letter-spacing:.05em}
  .nav-toggle{width:42px;height:42px}
  .nav-toggle span{margin:5px 10px}
  .nav-open .nav-toggle span:nth-child(1){transform:translateY(8px) rotate(45deg)}
  .nav-open .nav-toggle span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
  .main-nav{padding:6px 20px 14px}
  .main-nav a{padding:9px 14px;font-size:.95rem}
  html{scroll-padding-top:calc(58px + 40px + 10px)}
}

/* ===== Home hero park video (Instagram reel DX28RvZEr5X, 2026-10-18) =====
   Same treatment as the other Nova hero videos: muted looping <video class="hero-photo hero-video"> covering the hero
   (object-fit:cover) under the usual wash, with the orange hero card + buttons on top. The footage is 16:9 (cut out of the
   reel's 9:16 letterbox), so on wide screens cover only trims the edges; centred instead of the photo's 30% offset.
   Phones / portrait tablets: a full-bleed cover would cut ~75% of the picture (labels/attractions), so there the video is
   shown uncropped as a 16:9 band across the top of the hero (the area above the card) over a blurred still of the footage. */
.hero--reel .hero-photo{object-position:50% 50%;background:#2a1205}
@media (max-width:680px),(orientation:portrait) and (max-width:1024px){
  .hero--reel{background:#2a1205 url('../assets/video/eh-park-backdrop.webp') center/cover no-repeat;padding-top:max(220px,calc(100vw * 1078 / 1920))}
  .hero--reel .hero-photo{inset:0 0 auto 0;height:auto;aspect-ratio:1920/1078;object-fit:cover}
}

/* LilYPad package details (per-card counts, total time, add-ons, allergen) */
.pkg-covers{font-size:.78rem;font-weight:800;color:var(--ink);margin:-6px 0 8px;text-transform:uppercase;letter-spacing:.06em}
.pkg-items{list-style:none;margin:0 0 14px;padding:8px 0 0;border-top:1px dashed #ecd9c8;width:100%;font-size:.8rem;line-height:1.45;color:var(--text);font-weight:600}
.pkg-items li{margin:0;padding:0}
.pkg-total{text-align:center;margin:-4px 0 16px;color:var(--ember-dk,#7a3300);font-size:1.05rem}
.pkg-extras{margin-top:18px;padding-top:16px;border-top:1px dashed #ecd9c8;font-size:.95rem;line-height:1.5}
.pkg-extras p{margin:0 0 6px;max-width:none}
.pkg-extras .pkg-allergen{margin:10px 0 0;padding:10px 14px;background:var(--orange-tint,#FFF0DD);border-left:4px solid var(--orange,#FF991C);border-radius:8px}
@media (max-width:600px){.pkg-includes .pkg-extras{font-size:.92rem}.pkg-items{font-size:.88rem}}
@media (max-width:680px){.pkg-card .pkg-covers{margin:0;text-align:right;font-size:.74rem}.pkg-card .pkg-items{flex:1 0 100%;margin:4px 0 0}}

/* ---- Groups & Events page + EN | ES language toggle ---- */
.group-card{display:flex;flex-direction:column}.group-card .btn{margin-top:auto;align-self:flex-start}
#group-inquiry,#fundraiser-options{scroll-margin-top:110px}
/* EN | ES toggle */
.lang-toggle{display:flex;align-items:center;gap:2px;flex:0 0 auto;margin-left:auto;font-family:var(--font-head);font-weight:800;font-size:.8rem;letter-spacing:.04em}
.lang-toggle span{opacity:.5;color:#2A1A0A}
.lang-toggle button{background:transparent;border:0;padding:8px 6px;min-width:34px;min-height:40px;cursor:pointer;color:#2A1A0A;font:inherit;border-radius:8px}
.lang-toggle button.is-active{background:rgba(255,255,255,.55);color:#A24E00}
.lang-toggle button:focus-visible{outline:3px solid #fff;outline-offset:1px}
.lang-toggle + .nav-toggle{margin-left:6px!important}
.header-ctas + .lang-toggle{margin-left:4px}
/* Google Translate: no banner/toolbar, no layout shift, no hover tooltips */
.skiptranslate iframe,iframe.goog-te-banner-frame,.goog-te-banner-frame,#goog-gt-tt,.goog-te-balloon-frame,.VIpgJd-ZVi9od-ORHb-OEVmcd,.VIpgJd-ZVi9od-aZ2wEe-wOHMyf,.VIpgJd-yAWNEb-L7lbkb{display:none!important;visibility:hidden!important}
html,body{top:0!important}
body>.skiptranslate{display:none!important}
font[style*="background-color"],.VIpgJd-yAWNEb-VIpgJd-fmcmS-sn54Q{background:none!important;box-shadow:none!important}
/* Spanish text runs longer: keep CTAs and nav on one line */
html.lang-es .mcta{font-size:.82rem;letter-spacing:.01em;padding:0 6px}
html.lang-es .main-nav a{letter-spacing:0}
html.lang-es .header-ctas .btn{padding-left:10px;padding-right:10px}
/* Desktop: language switch as a small floating pill (keeps the full nav + CTAs on one row) */
@media (min-width:1061px){
  .lang-toggle{position:fixed;left:16px;bottom:16px;z-index:80;margin:0;background:#fff;border-radius:999px;padding:3px 8px;box-shadow:0 6px 18px -6px rgba(0,0,0,.35)}
  .lang-toggle button{min-height:32px}
  .header-ctas + .lang-toggle{margin-left:0}
  html.lang-es .main-nav a{padding-left:3px;padding-right:3px;font-size:.72rem}
  html.lang-es .header-ctas .btn{padding-left:9px;padding-right:9px}
}
@media (max-width:1060px){.header-inner .lang-toggle{margin-left:auto!important}.header-inner .lang-toggle + .nav-toggle{margin-left:6px!important}}
@media (max-width:680px){html.lang-es main .btn{white-space:normal;max-width:100%;text-align:center}}
/* Desktop header fit (nav + Book/Buy buttons never overlap, EN and ES): wider header row + progressive nav sizing */
@media (min-width:1201px){
  .site-header .header-inner{max-width:min(1480px,100%)}
  .site-header .main-nav{flex:1 1 auto;min-width:0;margin-right:8px}
  .site-header .main-nav ul{justify-content:center}
  .site-header .main-nav a{padding:8px clamp(4px,.45vw,9px);font-size:clamp(.74rem,.62vw,.86rem)}
  .site-header .main-nav a::after{left:clamp(4px,.45vw,9px);right:clamp(4px,.45vw,9px)}
  html.lang-es .site-header .main-nav a{padding-left:clamp(3px,.32vw,7px);padding-right:clamp(3px,.32vw,7px);font-size:clamp(.7rem,.58vw,.82rem)}
  html.lang-es .site-header .header-ctas .btn{padding-left:9px;padding-right:9px;font-size:.74rem}
}
