/* balldrop.com footer v2 (includes/footer-v2.php), 2026-11-12. Colours from the header (phone-nav.css tokens),
   fonts = the PN faces phone-nav.css loads on every page. One card system: photo card, mini card, fact tile, pill. */
#ft2-host { background: #0e0c14; clear: both; }
#ft2 { --ft2-bg: #0e0c14; --ft2-tile: #17141f; --ft2-line: #2a2539; --ft2-text: #d6d0e2; --ft2-muted: #a59fb8; --ft2-gold: #e9c134; --ft2-r: 12px;
  background: var(--ft2-bg); color: var(--ft2-text); font: 14px/1.6 "PN Open Sans", "Open Sans", Arial, sans-serif; text-align: left; }
#ft2 *, #ft2 *::before, #ft2 *::after { box-sizing: border-box; }
#ft2 a { color: inherit; text-decoration: none; }
#ft2 a:hover { text-decoration: underline; text-underline-offset: 3px; }
#ft2 a:focus-visible { outline: 2px solid var(--ft2-gold); outline-offset: 2px; border-radius: 4px; }
#ft2 ul, #ft2 ol { list-style: none; margin: 0; padding: 0; }
#ft2 p { margin: 0; }
#ft2 .ft2-ic { width: 1em; height: 1em; flex: none; fill: currentColor; vertical-align: -.14em; }
#ft2 .ft2-w { max-width: 1180px; margin: 0 auto; padding-inline: 24px; }
#ft2 .ft2-lab { font: 800 13px/1.2 "PN Roboto Condensed", "Roboto Condensed", "Arial Narrow", sans-serif; letter-spacing: .09em; text-transform: uppercase; color: #fff; margin: 0 0 12px; }
#ft2 .ft2-grid { display: grid; grid-template-columns: minmax(0, 280px) minmax(0, 1fr); gap: 40px; padding-block: 44px 36px; }
#ft2 .ft2-left { display: flex; flex-direction: column; gap: 26px; }

/* about */
#ft2 .ft2-about { font-size: 13.5px; line-height: 1.65; }
#ft2 .ft2-about p { margin: 0 0 12px; }
#ft2 .ft2-about p a { color: #fff; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2px; }
#ft2 .ft2-about img { height: 32px; width: auto; display: block; margin: 0 0 16px; }
#ft2 .ft2-spec { display: grid; gap: 7px; padding-top: 14px; border-top: 1px solid var(--ft2-line); }
#ft2 .ft2-spec a { color: #fff; font-weight: 700; display: inline-flex; gap: 8px; align-items: center; }
#ft2 .ft2-spec .ft2-ic, #ft2 .ft2-plan .ft2-ic, #ft2 .ft2-pills .ft2-ic { color: var(--ft2-gold); }
#ft2 .ft2-plan { display: grid; gap: 8px; }
#ft2 .ft2-plan a { display: flex; align-items: center; gap: 9px; font-size: 13.5px; }
#ft2 .ft2-plan a:hover { color: #fff; }

/* heading row */
#ft2 .ft2-hd { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 18px; }
#ft2 .ft2-hd h2 { font: 800 34px/1 "PN Roboto Condensed", "Roboto Condensed", "Arial Narrow", sans-serif; color: #fff; margin: 0; letter-spacing: -.01em; text-transform: none; background: none; padding: 0; }
#ft2 .ft2-hd h2 em { font-style: normal; color: var(--ft2-gold); }
#ft2 .ft2-cd { display: flex; gap: 10px; align-items: center; }
#ft2 .ft2-days { display: flex; align-items: baseline; gap: 7px; border: 1px solid #3a3350; border-radius: 8px; padding: 6px 12px; font: 700 11px "PN Roboto Condensed", "Roboto Condensed", sans-serif; letter-spacing: .08em; text-transform: uppercase; }
#ft2 .ft2-days b { font: 800 22px/1 "PN Roboto Condensed", "Roboto Condensed", sans-serif; color: var(--ft2-gold); letter-spacing: 0; }
#ft2 .ft2-cta { display: inline-flex; align-items: center; gap: 8px; background: linear-gradient(90deg, #d0205d, #eb752c); color: #fff; font: 700 14px "PN Open Sans", "Open Sans", sans-serif; padding: 11px 18px; border-radius: 8px; white-space: nowrap; }
#ft2 .ft2-cta:hover { text-decoration: none; filter: brightness(1.07); }

/* photo cards: one size everywhere, the count badge sits on the photo so the caption has the full width */
#ft2 .ft2-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
#ft2 .ft2-pc { position: relative; display: block; border-radius: var(--ft2-r); overflow: hidden; aspect-ratio: 16 / 10; background: #241f31; isolation: isolate; }
#ft2 .ft2-pc img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform .5s cubic-bezier(.2, .7, .2, 1); }
#ft2 .ft2-pc::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(14, 12, 20, 0) 30%, rgba(14, 12, 20, .55) 58%, rgba(14, 12, 20, .94) 100%); }
#ft2 .ft2-pc:hover { text-decoration: none; }
#ft2 .ft2-pc:hover img { transform: scale(1.045); }
#ft2 .ft2-cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 14px 16px; display: grid; gap: 3px; }
#ft2 .ft2-t { display: flex; align-items: center; gap: 8px; font: 800 20px/1.1 "PN Roboto Condensed", "Roboto Condensed", "Arial Narrow", sans-serif; color: #fff; white-space: nowrap; overflow: hidden; }
#ft2 .ft2-t .ft2-ic { color: var(--ft2-gold); }
#ft2 .ft2-s { font-size: 12.5px; color: #e4dfee; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#ft2 .ft2-n { position: absolute; top: 12px; right: 12px; font: 700 12px "PN Open Sans", "Open Sans", sans-serif; color: #17141f; background: var(--ft2-gold); border-radius: 999px; padding: 5px 10px; white-space: nowrap; }

#ft2 .ft2-block { margin-top: 30px; }

/* booking fast: full-width row under both columns (room for the longest one-line name), five equal mini cards */
#ft2 .ft2-top5 { padding-bottom: 36px; }
#ft2 .ft2-lab-row { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
#ft2 .ft2-lab-row p:last-child { font-size: 12px; color: var(--ft2-muted); margin: 0 0 12px; }
#ft2 .ft2-row5 { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
#ft2 .ft2-mini { position: relative; display: flex; flex-direction: column; height: 100%; border: 1px solid var(--ft2-line); border-radius: var(--ft2-r); background: var(--ft2-tile); overflow: hidden; transition: border-color .2s; }
#ft2 .ft2-mini:hover { border-color: var(--ft2-gold); text-decoration: none; }
#ft2 .ft2-mini img { width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; display: block; }
#ft2 .ft2-rk { position: absolute; top: 8px; left: 8px; font: 800 11.5px/1 "PN Roboto Condensed", "Roboto Condensed", sans-serif; letter-spacing: .06em; text-transform: uppercase; color: #17141f; background: var(--ft2-gold); border-radius: 999px; padding: 5px 8px; }
#ft2 .ft2-mini b { font: 700 13.5px/1.3 "PN Open Sans", "Open Sans", sans-serif; color: #fff; padding: 10px 10px 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#ft2 .ft2-mini span:last-child { font-size: 12px; color: var(--ft2-muted); line-height: 1.3; padding: 2px 10px 12px; }

/* image skeletons: the site's tile shimmer (css/tile-fix.css, 2026-10-07) in the footer's dark tones. The inline script in
   site-header.php adds .is-loaded on load or error, which stops it; the boxes already have a fixed 16:10 shape. */
@keyframes ft2-skeleton { from { background-position: 150% 0; } to { background-position: -50% 0; } }
#ft2 .ft2-pc img:not(.is-loaded), #ft2 .ft2-mini img:not(.is-loaded) {
  background: #241f31 linear-gradient(100deg, #241f31 30%, #322b44 50%, #241f31 70%); background-size: 200% 100%;
  animation: ft2-skeleton 1.3s linear infinite; }

/* quick answers: one fact per tile */
#ft2 .ft2-row4 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
#ft2 .ft2-fact { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0 12px; align-items: center; padding: 14px; border: 1px solid var(--ft2-line); border-radius: var(--ft2-r); background: var(--ft2-tile); }
#ft2 .ft2-fact:hover { border-color: #5b5175; text-decoration: none; }
#ft2 .ft2-fact .ft2-ic { grid-row: 1 / 4; font-size: 26px; color: var(--ft2-gold); }
#ft2 .ft2-q, #ft2 .ft2-x { font-size: 12px; color: var(--ft2-muted); }
#ft2 .ft2-v { font: 800 24px/1.1 "PN Roboto Condensed", "Roboto Condensed", sans-serif; color: #fff; }

/* other party types */
#ft2 .ft2-pills { display: flex; flex-wrap: wrap; gap: 8px; }
#ft2 .ft2-pills a { display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--ft2-line); border-radius: 999px; padding: 7px 13px; color: #fff; font-weight: 600; font-size: 13px; white-space: nowrap; transition: border-color .2s, background .2s; }
#ft2 .ft2-pills a:hover { border-color: var(--ft2-gold); background: var(--ft2-tile); text-decoration: none; }

/* bottom bar */
#ft2 .ft2-bottom { border-top: 1px solid var(--ft2-line); padding-block: 18px 24px; display: flex; flex-wrap: wrap; gap: 12px 28px; justify-content: space-between; align-items: center; font-size: 12.5px; color: var(--ft2-muted); }
#ft2 .ft2-legal { display: flex; flex-wrap: wrap; gap: 6px 18px; align-items: center; }
#ft2 .ft2-sis a { color: #fff; font-weight: 600; }

@media (max-width: 1100px) { #ft2 .ft2-row5 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 1000px) { #ft2 .ft2-grid { grid-template-columns: minmax(0, 1fr); } #ft2 .ft2-left { order: 2; } }
@media (max-width: 760px) { #ft2 .ft2-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } #ft2 .ft2-row5 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) {
  #ft2 .ft2-w { padding-inline: 16px; }
  #ft2 .ft2-cards, #ft2 .ft2-row4 { grid-template-columns: minmax(0, 1fr); }
  #ft2 .ft2-pc { aspect-ratio: 2.2 / 1; }
  #ft2 .ft2-hd h2 { font-size: 28px; }
}
@media (prefers-reduced-motion: reduce) { #ft2 * { transition: none !important; animation: none !important; } }