/* ============================================================================
   HOME TEMPLATE ("LP: Home", inc/home-page.php) — on top of tokens.css only.
   ----------------------------------------------------------------------------
   The front page's top: the hero, the Where / When search, the promo cards, and
   the awards [bjlp_awards] prints in the statement row. Everything below the
   cards is the theme's own rows, so this template does not load components.css
   or lp-wp.css: their reset and body type would restyle those rows. Every rule
   here is scoped to the template's own classes, and sets what the theme's
   section, list and heading rules would otherwise reach (the theme pads every
   section and section > div, sizes every p and li at 21px from 960px).
   Built from the decided mock (mockups/home-search/index.awards-final-2026-11-06.html),
   with its sizes under 14px raised to the plugin's floor.
   ========================================================================== */

.bjlp-home-main{--home-shadow-card:0 12px 36px rgba(46,48,56,.18);--home-shadow-menu:0 14px 40px rgba(46,48,56,.18)}
.bjlp-home-main :is(.homehero,.homesearch,.homepromos,.homeawards),.bjlp-home-main :is(.homehero,.homesearch,.homepromos,.homeawards) *{box-sizing:border-box}
.homevh,.homesearch__status{position:absolute !important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
/* components.css's skip link, which this template does not load */
.bjlp .skip-link{position:absolute;left:-9999px;top:0;z-index:10000;background:var(--charcoal);color:var(--ink-invert);padding:var(--sp-sm) var(--sp-md);font-family:var(--font);font-size:var(--fs-small)}
.bjlp .skip-link:focus{left:0}

/* ---------------------------------------------------------------- hero */
/* One photo at a time, crossfading; no pause button or arrows (Ryan, 2026-10-28). Each photo's
   focus points arrive as --hf (desktop) and --hm (phones, the <picture>'s 699px switch). */
.homehero{position:relative;height:clamp(480px,41vw,640px);margin:0;padding:0;background:var(--charcoal);overflow:hidden;font-family:var(--font)}
.homehero__slides{position:absolute;inset:0;max-width:none;margin:0;padding:0}
.homehero picture{display:contents}
.homehero__img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:var(--hf,50% 40%);opacity:0;transition:opacity 1.4s ease}
@media (max-width:699px){.homehero__img{object-position:var(--hm,var(--hf,50% 40%))}}
.homehero__img.is-on{opacity:1}
/* A light, even shade so white type holds on a bright sky, and a darker band under the
   theme's header; the photo still reads as a photo. */
.homehero__slides::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(rgba(0,0,0,.22),rgba(0,0,0,.14) 55%,rgba(0,0,0,.22));pointer-events:none}
.homehero::after{content:"";position:absolute;inset:0 0 auto 0;height:210px;background:linear-gradient(rgba(0,0,0,.38),rgba(0,0,0,0));pointer-events:none}
@media (prefers-reduced-motion:reduce){.homehero__img{transition:none}}
/* The page's H1, in the theme's homepage-slider headline style (white, bold, uppercase, a
   2px shadow; 24 / 36 at 768 / 48 at 960 / 52 at 1280), centred in the photo below the theme's
   logo badge, which hangs into it before the header pins: 143px under 768px, 184px to 1599px,
   208px from 1600px (measured on the clone), with 28px clear of it. */
.homehero__cap{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:center;max-width:none;margin:0;padding:212px 24px 60px;pointer-events:none}
@media (max-width:767px){.homehero__cap{padding-top:171px}}
@media (min-width:1600px){.homehero__cap{padding-top:236px}}
.bjlp-home-main .homehero__h{max-width:980px;margin:0;padding:0;font-family:var(--font);font-size:24px;line-height:1.05;font-weight:var(--w-bold);letter-spacing:normal;
  text-transform:uppercase;text-align:center;color:var(--ink-invert);text-shadow:0 2px 2px rgba(5,5,5,.65),0 0 24px rgba(0,0,0,.35)}
@media (min-width:768px){.bjlp-home-main .homehero__h{font-size:36px}}
@media (min-width:960px){.bjlp-home-main .homehero__h{font-size:48px}}
@media (min-width:1280px){.bjlp-home-main .homehero__h{font-size:52px}}
/* phones: a shorter photo, the H1 below the logo badge; the search card's top sits 56px into the photo */
@media (max-width:640px){
  .homehero{height:360px}
  .homehero__cap{padding:165px 20px 64px}
  .bjlp-home-main .homehero__h{font-size:22px;line-height:1.15}
}
/* A photo's caption (Ryan, 2026-11-06): a camera icon in the bottom corner, clear of the search
   card's overlap; hovering it, or a click or tap (which keeps it open), shows the caption (.is-open,
   set by home.js with aria-expanded) to its
   left, level with the dot's foot so a two-line caption grows up and never onto the card, a
   link to the tour when one is picked. A 44px target around a 34px dot. */
.homehero__credit{position:absolute;right:14px;bottom:70px;z-index:3;width:44px;height:44px;margin:0;padding:0}
.homehero__credit[hidden]{display:none}
.bjlp-home-main .homehero__ci{display:grid;place-items:center;width:44px;height:44px;margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;cursor:pointer;color:var(--ink-invert);line-height:1}
.bjlp-home-main .homehero__ci::after{content:none}   /* the theme draws an arrow after every button */
.homehero__cdot{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:rgba(18,18,18,.5);box-shadow:inset 0 0 0 1px rgba(255,255,255,.5);transition:background var(--dur-fast)}
.homehero__cdot svg{width:20px;height:20px}
.homehero__ci:hover .homehero__cdot,.homehero__credit.is-open .homehero__cdot{background:rgba(18,18,18,.78)}
.homehero__ci:focus-visible{outline:none}
.homehero__ci:focus-visible .homehero__cdot{box-shadow:0 0 0 2px var(--white),0 0 0 4px var(--red)}
.homehero__ct{position:absolute;right:100%;bottom:5px;margin:0;padding:0 2px 0 0;transform:translateX(6px);opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity var(--dur-fast),transform var(--dur-fast),visibility 0s linear var(--dur-fast)}
.homehero__credit.is-open .homehero__ct{transform:none;opacity:1;visibility:visible;pointer-events:auto;transition-delay:0s}
.bjlp-home-main .homehero__cbox{display:block;width:max-content;max-width:min(460px,calc(100vw - 86px));margin:0;padding:8px 12px;background:rgba(18,18,18,.78);
  font-family:var(--font);font-size:var(--fs-micro);line-height:1.35;font-weight:var(--w-med);letter-spacing:normal;text-transform:none;color:var(--ink-invert);text-decoration:none}
.bjlp-home-main a.homehero__cbox:hover,.bjlp-home-main a.homehero__cbox:focus{color:var(--ink-invert)}
.homehero__cgo{margin-left:10px;font-weight:var(--w-bold);white-space:nowrap}
a.homehero__cbox:hover .homehero__cgo{text-decoration:underline;text-underline-offset:3px}
.homehero__cbox:focus-visible{outline:2px solid var(--white);outline-offset:2px}
@media (prefers-reduced-motion:reduce){.homehero__ct{transition:none}}
@media (max-width:640px){.homehero__credit{right:8px;bottom:60px}}

/* ---------------------------------------------------------------- search */
/* A white card on the photo's bottom edge, overlapping it by 60px: the kicker and heading
   beside the bar from 1061px, above it below that (Ryan, 2026-11-04: more weight on the search). */
.homesearch{position:relative;z-index:20;max-width:1100px;margin:-60px auto 0;padding:0 16px;font-family:var(--font);color:var(--ink)}
.homesearch__card{display:flex;align-items:center;gap:14px 28px;padding:22px 24px;background:var(--white);box-shadow:var(--home-shadow-card)}
.homesearch__head{flex:0 0 auto;min-width:0}
.bjlp-home-main .homesearch__k{margin:0 0 7px;padding:0;font-size:var(--fs-micro);line-height:1;font-weight:var(--w-bold);letter-spacing:.14em;text-transform:uppercase;color:var(--red)}
.bjlp-home-main .homesearch__h{margin:0;padding:0;font-family:var(--font);font-size:27px;line-height:1.1;font-weight:var(--w-bold);letter-spacing:0;text-transform:none;color:var(--charcoal);white-space:nowrap}
.homesearch__bar{position:relative;flex:1 1 auto;min-width:0;display:flex;align-items:stretch;margin:0;background:var(--white);border:1px solid var(--line-input)}
@media (max-width:1060px){.homesearch__card{flex-direction:column;align-items:stretch}.bjlp-home-main .homesearch__h{white-space:normal}}
.homesearch__fld{position:relative;flex:1 1 0;min-width:0;border-right:1px solid var(--line)}
.bjlp-home-main .homesearch__fbtn{display:flex;align-items:center;gap:12px;width:100%;height:68px;margin:0;padding:0 16px;border:0;border-radius:0;background:transparent;
  text-align:left;cursor:pointer;color:var(--charcoal);font:inherit;line-height:1;text-transform:none;letter-spacing:0;box-shadow:none}
.bjlp-home-main .homesearch__fbtn::after{content:none}   /* the theme draws an arrow after every button */
.homesearch__fbtn:hover,.homesearch__fld[data-open] .homesearch__fbtn{background:var(--stone)}
.homesearch__fbtn:focus-visible{outline:none;box-shadow:inset 0 0 0 2px var(--red)}
.homesearch__ico{flex:0 0 22px;width:22px;height:22px;color:var(--red)}
.homesearch__ftext{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.homesearch__fcap{font-size:var(--fs-micro);font-weight:var(--w-bold);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);line-height:1}
.homesearch__fval{font-size:19px;font-weight:var(--w-bold);line-height:1.2;color:var(--charcoal);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.homesearch__chev{flex:0 0 16px;width:16px;height:16px;color:var(--ink-soft);transition:transform var(--dur-fast)}
.homesearch__fld[data-open] .homesearch__chev{transform:rotate(180deg);color:var(--red)}
.bjlp-home-main .homesearch__go{flex:0 0 auto;margin:-1px -1px -1px 0;padding:0 30px;border:0;border-radius:0;background:var(--red);color:var(--ink-invert);
  font-family:var(--font);font-size:16px;line-height:1;font-weight:var(--w-bold);letter-spacing:.08em;text-transform:uppercase;cursor:pointer;white-space:nowrap}
.bjlp-home-main .homesearch__go::after{content:none}
.bjlp-home-main .homesearch__go:hover{background:var(--red-deep)}
.homesearch__go:focus-visible{outline:none;box-shadow:inset 0 0 0 3px rgba(255,255,255,.65)}
/* the menus */
.homesearch__menu{position:absolute;left:-1px;top:calc(100% + 8px);z-index:60;min-width:calc(100% + 2px);padding:12px;background:var(--white);border:1px solid var(--line);
  box-shadow:var(--home-shadow-menu);max-height:min(560px,calc(100vh - 140px));overflow:auto}
.homesearch__menu[hidden]{display:none}
.homesearch__menu:focus{outline:none}
.homesearch__menu--where{width:440px}
.homesearch__menu--where:not([hidden]){display:grid;grid-template-columns:1fr 1fr;gap:6px 8px}
.homesearch__menu--where .homesearch__o[data-v="any"]{grid-column:1 / -1}
.homesearch__menu--when{width:800px}
/* opens upward over the photo when there is no room below the bar (home.js) */
.homesearch__menu.is-up{top:auto;bottom:calc(100% + 8px);box-shadow:0 -10px 36px rgba(46,48,56,.22)}
.homesearch__o{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:46px;padding:8px 12px;font-size:18px;font-weight:var(--w-bold);color:var(--charcoal);cursor:pointer;line-height:1.2}
.homesearch__o em{display:block;font-style:normal;font-weight:var(--w-med);font-size:15px;color:var(--ink-soft)}
.homesearch__o small{font-size:var(--fs-micro);font-weight:var(--w-bold);color:var(--ink-soft);background:var(--stone);padding:3px 9px;min-width:32px;text-align:center;line-height:1.2}
.homesearch__o:hover,.homesearch__o.is-active{background:var(--red-tint)}
.homesearch__o.is-active{box-shadow:inset 0 0 0 2px var(--red)}
.homesearch__o[aria-selected="true"]{color:var(--red)}
.homesearch__o[aria-selected="true"] small{background:var(--red);color:var(--ink-invert)}
/* a pairing with no group departure: "Custom" in place of a zero */
.homesearch__o small.is-custom{min-width:0;padding:3px 6px;background:var(--white);border:1px solid var(--line-input);color:var(--charcoal);letter-spacing:.02em}
.homesearch__o[aria-selected="true"] small.is-custom{background:var(--red);border-color:var(--red);color:var(--ink-invert)}
.bjlp-home-main .homesearch__note{margin:10px 4px 2px;padding:0;font-size:var(--fs-micro);line-height:1.35;font-weight:var(--w-med);color:var(--ink-soft)}
.homesearch__note b{color:var(--charcoal)}
.homesearch__menu--where .homesearch__note{grid-column:1 / -1}
.homesearch__row2{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:6px}
.homesearch__row2 .homesearch__o{border:1px solid var(--line)}
.homesearch__grp{display:grid;grid-template-columns:48px repeat(6,minmax(0,1fr));gap:8px;margin-top:8px}
.bjlp-home-main .homesearch__grp-h{grid-column:1;grid-row:1 / span var(--span,1);margin:0;padding:16px 0 0 4px;font-size:var(--fs-micro);line-height:1.2;font-weight:var(--w-bold);letter-spacing:.08em;color:var(--ink-soft)}
.homesearch__months{display:contents}
.homesearch__o--m{grid-column:var(--c);grid-row:var(--r);min-width:0;border:1px solid var(--line);font-size:17px}
.homesearch__o--m small{flex-shrink:0}
.homesearch__o--m .homesearch__ol{white-space:nowrap}
@media (max-width:900px){.homesearch__menu--when{width:min(800px,calc(100vw - 32px))}}
/* phones: the bar stacks inside the card (Where, When, a full-width button); menus open in place */
@media (max-width:640px){
  .homesearch{margin-top:-56px}
  .homesearch__card{padding:16px 14px 14px;gap:12px;box-shadow:0 8px 24px rgba(46,48,56,.18)}
  .bjlp-home-main .homesearch__h{font-size:23px}
  .homesearch__bar{flex-direction:column;gap:10px;padding:0;border:0}
  .homesearch__fld{border:1px solid var(--line-input)}
  .bjlp-home-main .homesearch__fbtn{height:62px}
  .homesearch__menu,.homesearch__menu--where,.homesearch__menu--when{position:static;width:auto;min-width:0;max-height:none;margin:0;border:0;border-top:1px solid var(--line);box-shadow:none;padding:8px}
  .homesearch__menu--where:not([hidden]){display:block}
  .homesearch__grp{display:block;margin-top:0}
  .bjlp-home-main .homesearch__grp-h{margin:10px 0 6px;padding:0 4px;letter-spacing:.14em}
  .homesearch__months{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  /* name over its count or Custom tag: three across fit a phone */
  .homesearch__o--m{grid-column:auto;grid-row:auto;flex-direction:column;align-items:flex-start;justify-content:center;gap:6px;padding:8px 8px 8px 10px}
  .homesearch__o--m small{min-width:26px;padding:3px 6px}
  .homesearch__row2{grid-template-columns:1fr}
  .bjlp-home-main .homesearch__go{margin:0;height:58px;width:100%}
}

/* ---------------------------------------------------------------- promo cards */
.bjlp-home-main .homepromos{margin:0;padding:34px 16px 40px;background:var(--white);font-family:var(--font);color:var(--charcoal)}
/* the theme pads every div directly inside a section; the grid lines up with the search instead */
.bjlp-home-main .homepromos > .homepromos__grid{max-width:1180px;margin:0 auto;padding:0}
.homepromos__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.homepromos__grid--2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:790px}
.homepromos__grid--1{grid-template-columns:minmax(0,1fr);max-width:400px}
.bjlp-home-main .homepromo{display:flex;flex-direction:column;min-width:0;background:var(--white);box-shadow:0 2px 14px rgba(46,48,56,.10);color:var(--charcoal);text-decoration:none;
  transition:box-shadow var(--dur-fast),transform var(--dur-fast)}
.bjlp-home-main .homepromo:hover{box-shadow:0 10px 28px rgba(46,48,56,.14);transform:translateY(-2px);color:var(--charcoal);text-decoration:none}
.homepromo__img{display:block;aspect-ratio:16 / 9;overflow:hidden;background:var(--line)}
.homepromo__img img{display:block;width:100%;height:100%;max-width:none;object-fit:cover}
.homepromo__body{display:flex;flex-direction:column;gap:4px;flex:1;padding:14px 18px 18px}
.homepromo__k{font-size:var(--fs-micro);line-height:1.2;font-weight:var(--w-bold);letter-spacing:.14em;text-transform:uppercase;color:var(--red)}
.homepromo__t{font-size:21px;line-height:1.2;font-weight:var(--w-bold)}
.homepromo__s{font-size:var(--fs-small);line-height:1.35;font-weight:var(--w-light);color:var(--ink-soft)}
.homepromo__cta{margin-top:auto;padding-top:12px;font-size:var(--fs-micro);line-height:1.2;font-weight:var(--w-bold);letter-spacing:.06em;text-transform:uppercase;color:var(--red)}
.homepromo__cta::after{content:" \2192"}
.homepromo:hover .homepromo__cta{text-decoration:underline}
@media (prefers-reduced-motion:reduce){.bjlp-home-main .homepromo{transition:none}.bjlp-home-main .homepromo:hover{transform:none}}
@media (max-width:900px){.homepromo__t{font-size:19px}.homepromos__grid{gap:16px}}
/* phones: rows, a small photo beside the words, no foot line */
@media (max-width:640px){
  .bjlp-home-main .homepromos{padding:24px 16px 28px}
  .homepromos__grid,.homepromos__grid--2,.homepromos__grid--1{grid-template-columns:minmax(0,1fr);gap:12px;max-width:none}
  .bjlp-home-main .homepromo{flex-direction:row;align-items:center;gap:12px;padding:8px;box-shadow:none;border:1px solid var(--line)}
  .homepromo__img{flex:0 0 112px;width:112px;aspect-ratio:4 / 3}
  .homepromo__body{padding:0 4px 0 0;gap:2px}
  .homepromo__t{font-size:18px}
  .homepromo__s{font-size:15px}
  .homepromo__cta{display:none}
}

/* ---------------------------------------------------------------- awards */
/* [bjlp_awards] in the statement row (Ryan, 2026-11-06, option D): the three awards under the
   paragraph, before "So, what are you in the mood for?". No band, no lines. From 900px one row,
   logo beside its words, spread across the text column; 641-899px three columns, logo above;
   phones one column, each logo in a fixed box beside its words. Seals 72px tall, the wide
   badge 42px (phones 60 / 34). The theme sizes every ul and li; these rules answer it, and the
   display has !important for the sitewide `main ul li{display:list-item !important}` this
   site's Additional CSS once carried (lp-wp.css). */
/* From 900px the row is up to 1000px wide, centred on the statement: its text column is 856px at
   1440, which squeezed each award's words onto a third line. */
.bjlp-home-main .homeawards{margin:0;padding:8px 0 34px;font-family:var(--font)}
@media (min-width:900px){.bjlp-home-main .homeawards{margin:0 calc(50% - min(500px, 50vw - 24px))}}
.bjlp-home-main .homeawards__list{display:flex;align-items:center;justify-content:space-between;gap:18px 28px;margin:0;padding:0;list-style:none}
.bjlp-home-main .homeawards__i{display:flex !important;align-items:center;gap:16px;flex:0 1 auto;min-width:0;margin:0;padding:0;list-style:none;background:none;text-align:left;font-size:15px}
.bjlp-home-main .homeawards__i::before{content:none}
.homeawards__logo{display:flex;align-items:center;justify-content:center;flex:0 0 auto;height:72px}
.bjlp-home-main .homeawards__logo img{display:block;width:auto;max-width:none;margin:0;object-fit:contain}
.bjlp-home-main .homeawards__i--badge img{height:72px}
.bjlp-home-main .homeawards__i--mark img{height:42px}
.homeawards__txt{display:flex;flex-direction:column;gap:4px;min-width:0;width:190px}
.homeawards__h{display:block;margin:0;font-size:15px;line-height:1.25;font-weight:var(--w-bold);letter-spacing:.04em;text-transform:uppercase;color:var(--charcoal)}
.homeawards__t{display:block;margin:0;font-size:15px;line-height:1.35;font-weight:var(--w-med);color:var(--ink-soft)}
@media (max-width:899px){
  .bjlp-home-main .homeawards__list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;gap:18px 20px}
  .bjlp-home-main .homeawards__i{flex-direction:column;gap:10px;text-align:center}
  .homeawards__txt{width:auto;align-items:center}
}
@media (max-width:640px){
  .bjlp-home-main .homeawards{padding:4px 0 28px}
  .bjlp-home-main .homeawards__list{grid-template-columns:minmax(0,1fr);gap:16px}
  .bjlp-home-main .homeawards__i{flex-direction:row;gap:16px;text-align:left}
  .homeawards__logo{width:118px;height:60px}   /* the ATTA badge is 117px wide at 34px tall */
  .bjlp-home-main .homeawards__i--badge img{height:60px}
  .bjlp-home-main .homeawards__i--mark img{height:34px}
  .homeawards__txt{align-items:flex-start}
}

/* ---------------------------------------------------------------- the theme rows */
/* The statement's own H1 is printed as <h2 class="h1 bjlp-h1"> (one H1 per page: the hero's).
   The theme's .h1 gives it the h1 look; on wide screens the theme styles the statement's h1 by
   element (.centered-content h1), so that rule is repeated here for it. */
@media only screen and (min-width:66.3125em){.bjlp-home-main .centered-content h2.bjlp-h1{font-weight:var(--w-med);font-size:28px;line-height:1.4;margin:0 0 26px}}

/* A password-protected front page: the form on plain white. */
.homelocked{max-width:var(--wrap-narrow);margin:0 auto;padding:200px var(--gutter-sm) 80px;font-family:var(--font)}
.homelocked .homehero__h{color:var(--ink-strong);text-shadow:none;margin-bottom:var(--sp-md)}