/* Bakersfield Fall Home Show 2026 — page-scoped additions.
   Loaded only on the Fall Show Page template, on top of bmh-styles.css.
   Reuses the existing design tokens (--accent, --forest, --cream, --sand, --line, --muted)
   defined in bmh-styles.css so this page stays visually consistent with the rest of the site. */

/* Warm neutral backgrounds/borders for this page only. The compound selector
   (body + two classes) outranks brand-color-lock.php's `.bmh-modern-home` rule
   regardless of stylesheet load order, so the homepage's cool-toned tokens are untouched. */
body.bmh-modern-home.bmh-fall-2026{
  --cream:#FBF8F2;
  --sand:#F1EAD9;
  --line:#E6DFD1;
}

/* Hero art-direction: <picture> wrapper is fully transparent to layout so the
   nested <img>'s existing absolute-position/object-fit rules keep working unchanged. */
.bmh-fall-2026 .hero picture{display:contents}

/* The base stylesheet's mobile object-position:64% was tuned for the old single
   wide crop. Our dedicated portrait crop is already subject-centered, so reset it. */
@media(max-width:900px){
  .bmh-fall-2026 .hero-image{object-position:center top}
}

/* ---------- 2. Project-category strip ---------- */
.category-strip{background:#fff;border-bottom:1px solid var(--line)}
.category-strip-inner{display:flex;gap:10px;overflow-x:auto;padding:20px 0;scrollbar-width:none}
.category-strip-inner::-webkit-scrollbar{display:none}
.category-chip{flex:0 0 auto;padding:10px 20px;border:1px solid var(--line);border-radius:999px;font:700 14px "DM Sans",sans-serif;color:var(--forest);white-space:nowrap;transition:.2s}
.category-chip:hover,.category-chip:focus-visible{background:var(--accent);border-color:var(--accent);color:#fff}
.category-chip:focus-visible{outline:3px solid var(--accent);outline-offset:2px}

/* ---------- 3. Attraction cards ---------- */
.attractions-section{background:var(--cream)}
.attraction-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.attraction-card{display:block;background:#fff;border:1px solid var(--line);overflow:hidden;transition:transform .25s,box-shadow .25s}
.attraction-card:hover,.attraction-card:focus-visible{transform:translateY(-6px);box-shadow:var(--shadow)}
.attraction-card:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.attraction-art,.attraction-photo{height:150px;width:100%;object-fit:cover}
.attraction-art-1{background:linear-gradient(135deg,#eaf0ff,#fff6ea)}
.attraction-art-2{background:linear-gradient(145deg,#fff3e6,#e8ecff)}
.attraction-art-3{background:linear-gradient(#f3e9da 0 58%,#e3e9f7 58%)}
.attraction-art-4{background:linear-gradient(135deg,#edebfb,#fbefe3)}
.attraction-body{padding:20px}
.attraction-body h3{font:800 17px "Manrope",sans-serif;letter-spacing:-.02em;margin:0}
.attraction-badge{display:inline-block;margin-top:9px;padding:5px 10px;background:var(--sand);color:var(--forest);font:800 11px "Manrope",sans-serif;text-transform:uppercase;letter-spacing:.08em}

/* ---------- 4. Golden Empire Gleaners ---------- */
.gleaners-band{background:linear-gradient(135deg,#fff6ea,#eaf0ff);color:var(--forest);padding:66px 0;text-align:center}
.gleaners-inner .eyebrow{color:var(--accent);margin-bottom:16px}
.gleaners-message{display:flex;flex-wrap:wrap;justify-content:center;gap:0 16px;margin:0;font:800 clamp(28px,4vw,44px)/1.2 "Manrope",sans-serif;letter-spacing:-.03em;color:var(--forest)}
.gleaners-message span:nth-child(2){color:var(--accent)}
.gleaners-copy{margin:18px 0 0;font-size:16px;line-height:1.6;color:#596277}

/* ---------- 5. Ticket pricing ---------- */
.pricing-section{background:#fff}
.pricing-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:44px}
.pricing-card{text-align:center;padding:34px 16px;border:1px solid var(--line);background:var(--cream)}
.pricing-card strong{display:block;font:800 34px "Manrope",sans-serif;color:var(--forest);letter-spacing:-.03em}
.pricing-card span{display:block;margin-top:8px;font-size:14px;color:var(--muted)}
.pricing-disclaimer{text-align:center;margin:22px 0 0;font-size:13px;color:var(--muted)}
.pricing-cta{display:flex;justify-content:center;margin-top:34px}

/* ---------- 6. Map / directions / venue ---------- */
.venue-section{background:var(--cream)}
.venue-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.venue-copy h2{font:800 clamp(30px,3.4vw,42px)/1.12 "Manrope",sans-serif;letter-spacing:-.03em;margin:0 0 18px}
.venue-address{font-size:16px;line-height:1.6;color:#596277;margin:0 0 26px}
.venue-hours{margin:0 0 30px;padding-top:22px;border-top:1px solid var(--line)}
.venue-hours p{display:flex;justify-content:space-between;gap:20px;margin:0 0 10px;font-size:14px}
.venue-hours strong{color:var(--forest)}
.venue-hours span{color:var(--muted)}
.venue-map{position:relative;padding-top:75%;border:1px solid var(--line);overflow:hidden}
.venue-map iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

@media(max-width:900px){
  .attraction-grid{grid-template-columns:repeat(2,1fr)}
  .pricing-grid{grid-template-columns:repeat(2,1fr)}
  .venue-grid{grid-template-columns:1fr;gap:32px}
  .venue-map{padding-top:65%}
}

@media(max-width:620px){
  .category-strip-inner{padding:16px 0}
  .attraction-grid{grid-template-columns:1fr 1fr;gap:12px}
  .attraction-art,.attraction-photo{height:110px}
  .attraction-body{padding:14px}
  .attraction-body h3{font-size:15px}
  .gleaners-band{padding:48px 0}
  .gleaners-message{flex-direction:column;gap:4px}
  .pricing-grid{grid-template-columns:1fr 1fr;gap:12px;margin-top:32px}
  .pricing-card{padding:24px 12px}
  .pricing-card strong{font-size:28px}
  .venue-hours p{flex-direction:column;gap:2px}
}
