/* Beer Finder (page-finder-template.php) + Sell Cinderlands Beer (page-sell-template.php), 2026-10-05.
 * Loads on top of cbco-location.css: hero, facts strip, sections, buttons and the closing duo are the
 * location page's; this file adds the finder frame, the can cards, the distributor cards with the
 * county lookup, and the Gravity Forms band (same treatment as the private events / job pages). */

.cbco-loc h1.cbco-trade__h1 { max-width: 13ch; }
.cbco-trade .cbco-loc__hero-in, body .container-wrap.cbco-trade .cbco-loc__hero-in { padding-top: 96px !important; padding-bottom: 96px !important; min-height: 600px; }
.cbco-bf img.cbco-loc__hero-img { object-position: 70% 40%; }
.cbco-sell img.cbco-loc__hero-img { object-position: 50% 30%; }
/* 1714 is portrait with the bartender left of centre: on wide screens the photo takes the right 60% of the
   header and the navy panel the left, so her face and the tap handle stay clear of the headline */
@media (min-width: 761px) {
	.cbco-sell .cbco-loc__hero { background: var(--lp-deep); }
	.cbco-sell img.cbco-loc__hero-img { left: auto; right: 0; width: 60%; object-position: 50% 32%; opacity: 1; }
	.cbco-sell .cbco-loc__hero-shade { background: linear-gradient(90deg, rgba(var(--lp-shade), 1) 0%, rgba(var(--lp-shade), 1) 40%, rgba(var(--lp-shade), .55) 46%, rgba(var(--lp-shade), 0) 58%); }
}
@media (max-width: 760px) {
	.cbco-trade .cbco-loc__hero-in, body .container-wrap.cbco-trade .cbco-loc__hero-in { padding-top: 64px !important; padding-bottom: 56px !important; }
	.cbco-bf img.cbco-loc__hero-img { object-position: 70% 20%; }
	.cbco-sell img.cbco-loc__hero-img { object-position: 35% 18%; }
}
.cbco-trade .cbco-loc__fact small { display: block; font-size: 13px; color: var(--lp-muted); }

/* ---------- Beer Finder: the "Where to find" list (cbco-finder.php) sits in a template section ---------- */
.cbco-bf__where { padding-top: clamp(36px, 5vw, 64px); }
.cbco-bf .cbco-fl { margin: 0; }
.cbco-bf .cbco-fl .cbco-fl__eyebrow { font-family: 'Oswald', Arial, sans-serif; font-weight: 500; font-size: 13px; letter-spacing: .14em; color: var(--lp-ember); }
.cbco-bf .cbco-fl .cbco-fl__title { font-weight: 700; font-size: clamp(30px, 3.6vw, 46px); letter-spacing: .01em; color: var(--lp-ink); }
.cbco-bf .cbco-fl .cbco-fl__lede { font-size: 17px; color: var(--lp-muted); }
.cbco-bf .cbco-fl .cbco-fl__map { border-radius: 12px; border: 1px solid var(--lp-line); }
.cbco-bf .cbco-fl .cbco-fl__card { border-color: var(--lp-line); border-radius: 10px; }
.cbco-bf .cbco-fl .cbco-fl__type { color: var(--lp-navy); font-family: 'Oswald', Arial, sans-serif; font-weight: 500; letter-spacing: .1em; font-size: 12px; }
.cbco-bf .cbco-fl .cbco-fl__type--store { color: var(--lp-ember-deep); }
.cbco-bf .cbco-fl .cbco-fl__more { background: var(--lp-navy); border-color: var(--lp-navy); font-family: 'Oswald', Arial, sans-serif; font-weight: 500; font-size: 14px; letter-spacing: .08em; }
.cbco-bf .cbco-fl .cbco-fl__more:hover { background: var(--lp-ember); border-color: var(--lp-ember); }
.cbco-bf h2.cbco-fl__sub { display: none; } /* the finder section below carries its own "Search another area" heading */

/* ---------- Beer Finder: VIP's map in a framed card ---------- */
.cbco-trade__frame { background: #fff; border: 1px solid var(--lp-line); border-radius: 14px; overflow: hidden; box-shadow: 0 14px 34px rgba(1, 32, 127, .07); }
.cbco-trade__frame iframe { display: block; width: 100%; height: 900px; border: 0; }
@media (max-width: 760px) { .cbco-trade__frame iframe { height: 820px; } .cbco-trade__frame { border-radius: 10px; } }

/* ---------- can cards (both pages) ---------- */
.cbco-loc ul.cbco-trade__cans { display: grid; grid-template-columns: repeat(auto-fill, minmax(178px, 1fr)); gap: 16px; }
.cbco-loc a.cbco-trade__can { height: 100%; display: flex; flex-direction: column; gap: 4px; background: #fff; border: 1px solid var(--lp-line); border-radius: 12px; padding: 14px 16px 16px; color: var(--lp-ink); text-decoration: none; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.cbco-loc a.cbco-trade__can:hover { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(1, 32, 127, .12); border-color: var(--lp-navy); color: var(--lp-ink); }
.cbco-loc a.cbco-trade__can.is-current { border-color: var(--lp-ember); box-shadow: 0 0 0 2px var(--lp-ember); }
.cbco-trade__can-ph { display: block; aspect-ratio: 1; margin: -4px -6px 8px; }
.cbco-trade__can-ph img, .cbco-loc .cbco-trade__can-ph img { width: 100%; height: 100%; object-fit: contain; transition: transform .25s ease; }
.cbco-loc a.cbco-trade__can:hover .cbco-trade__can-ph img { transform: scale(1.04); }
.cbco-trade__can b { font-family: 'Oswald', Arial, sans-serif; text-transform: uppercase; font-weight: 600; font-size: 18px; line-height: 1.1; color: var(--lp-navy); }
.cbco-trade__can small { font-size: 13px; color: var(--lp-muted); }
.cbco-trade__can-go { margin-top: auto; padding-top: 10px; font-family: 'Oswald', Arial, sans-serif; text-transform: uppercase; letter-spacing: .1em; font-size: 12px; font-weight: 500; color: var(--lp-ember-deep); }
.cbco-loc p.cbco-trade__more { margin-top: 24px; }
.cbco-trade__more a { font-family: 'Oswald', Arial, sans-serif; text-transform: uppercase; letter-spacing: .1em; font-size: 13px; font-weight: 500; color: var(--lp-navy); text-decoration: none; }
.cbco-trade__more a:hover { color: var(--lp-ember-deep); text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 480px) { .cbco-loc ul.cbco-trade__cans { grid-template-columns: 1fr 1fr; gap: 10px; } .cbco-loc a.cbco-trade__can { padding: 10px 12px 12px; } .cbco-trade__can b { font-size: 16px; } }

/* ---------- closing duo: navy card (ember stays the CTA colour) ---------- */
.cbco-loc .cbco-trade__navy { background: var(--lp-navy); }
.cbco-loc .cbco-trade__navy p { color: var(--lp-on-dark-text); }
.cbco-loc .cbco-trade__navy .cbco-loc__eyebrow { color: var(--lp-on-dark-accent); }
.cbco-loc .cbco-trade__navy a.cbco-loc__btn--white { color: var(--lp-navy); }
.cbco-loc .cbco-trade__navy a.cbco-loc__btn--white:hover { color: #fff; }
.cbco-loc .cbco-trade__navy a.cbco-loc__btn--ghostw:hover { color: var(--lp-navy); }
.cbco-loc .cbco-trade__visit { grid-template-columns: 1fr; }

/* ---------- Sell: heading + county lookup ---------- */
.cbco-trade__dhead { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr); gap: 40px; align-items: end; margin-bottom: 40px; }
.cbco-trade__lookup { background: var(--lp-cream); border-radius: 12px; padding: 22px 24px; display: flex; flex-direction: column; gap: 10px; }
.cbco-trade__lookup label { font-family: 'Oswald', Arial, sans-serif; text-transform: uppercase; letter-spacing: .12em; font-size: 12px; font-weight: 500; color: var(--lp-ember-deep); }
.cbco-loc .cbco-trade__lookup select { width: 100%; height: 50px; border: 1px solid var(--lp-line); border-radius: 10px; background: #fff; padding: 0 14px; font-family: 'Open Sans', Arial, sans-serif; font-size: 16px; color: var(--lp-ink); }
.cbco-loc p.cbco-trade__answer { font-size: 14px; color: var(--lp-muted); min-height: 2.9em; }
.cbco-trade__answer b { color: var(--lp-ink); }
.cbco-trade__answer a { color: var(--lp-navy); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 860px) { .cbco-trade__dhead { grid-template-columns: 1fr; gap: 24px; } }

/* ---------- Sell: distributors by state ---------- */
.cbco-trade__state + .cbco-trade__state { margin-top: 44px; }
.cbco-loc h3.cbco-trade__state-h { display: flex; align-items: baseline; gap: 14px; font-size: 26px; font-weight: 700; color: var(--lp-navy); padding-bottom: 12px; margin-bottom: 18px; border-bottom: 2px solid var(--lp-navy); }
.cbco-trade__state-h small { font-size: 12px; letter-spacing: .12em; font-weight: 500; color: var(--lp-muted); }
.cbco-trade__dists { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 18px clamp(18px, 2.4vw, 32px); }
.cbco-trade__dist { position: relative; background: #fff; border: 1px solid var(--lp-line); border-top: 6px solid var(--lp-navy); border-radius: 10px; padding: 20px 22px 22px; display: flex; flex-direction: column; gap: 10px; transition: border-color .2s ease, box-shadow .2s ease; }
.cbco-trade__dist.is-self { border-top-color: var(--lp-ember); background: linear-gradient(180deg, #fff 0%, #fff 60%, var(--lp-paper) 100%); }
.cbco-trade__dist.is-match { border-color: var(--lp-ember); border-top-color: var(--lp-ember); box-shadow: 0 0 0 2px var(--lp-ember), 0 14px 30px rgba(1, 32, 127, .12); }
.cbco-trade__dist-tag { font-family: 'Oswald', Arial, sans-serif; text-transform: uppercase; letter-spacing: .12em; font-size: 11px; font-weight: 500; color: var(--lp-muted); }
.cbco-trade__dist.is-self .cbco-trade__dist-tag { color: var(--lp-ember-deep); }
.cbco-loc .cbco-trade__dist h4 { margin: 0; padding: 0; font-family: 'Oswald', Arial, sans-serif; text-transform: uppercase; font-weight: 600; font-size: 21px; line-height: 1.1; color: var(--lp-ink); }
.cbco-loc p.cbco-trade__addr { font-size: 14.5px; color: var(--lp-ink); }
.cbco-loc p.cbco-trade__note { font-size: 14px; color: var(--lp-muted); }
.cbco-loc ul.cbco-trade__counties { display: flex; flex-wrap: wrap; gap: 6px; }
.cbco-loc ul.cbco-trade__counties li { font-size: 12px; line-height: 1; padding: 6px 9px; border-radius: 999px; background: var(--lp-paper); border: 1px solid var(--lp-line); color: var(--lp-muted); transition: background .15s, color .15s; }
.cbco-loc ul.cbco-trade__counties li.is-match { background: var(--lp-ember); border-color: var(--lp-ember); color: #fff; }
.cbco-trade__dist-acts { margin-top: auto; padding-top: 6px; display: flex; flex-wrap: wrap; gap: 8px; }

/* ---------- Sell: the form band (Gravity Forms 5 in a white card on navy) ---------- */
.cbco-trade__form-band { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(28px, 5vw, 64px); align-items: start; }
.cbco-trade__form-copy { display: flex; flex-direction: column; gap: 14px; position: sticky; top: 110px; }
.cbco-trade__form-copy p { color: var(--lp-on-dark-text); font-size: 17px; }
.cbco-loc ul.cbco-trade__direct { display: grid; gap: 10px; margin-top: 10px; padding-top: 18px; border-top: 1px solid rgba(255, 255, 255, .2); }
.cbco-trade__direct li { display: flex; gap: 14px; align-items: baseline; }
.cbco-trade__direct b { width: 52px; font-family: 'Oswald', Arial, sans-serif; text-transform: uppercase; letter-spacing: .12em; font-size: 12px; font-weight: 500; color: var(--lp-on-dark-accent); }
.cbco-trade__direct a { color: #fff; font-size: 17px; text-decoration: underline; text-underline-offset: 3px; }
.cbco-trade__direct a:hover { color: var(--lp-on-dark-accent); }
.cbco-trade__form { background: #fff; border-radius: 16px; padding: clamp(22px, 3vw, 36px); color: var(--lp-ink); box-shadow: 0 20px 50px rgba(0, 0, 0, .18); }
@media (max-width: 860px) { .cbco-trade__form-band { grid-template-columns: 1fr; } .cbco-trade__form-copy { position: static; } }
.cbco-trade .gform_wrapper.gform-theme { --gf-color-primary: #01207f; --gf-color-primary-rgb: 1, 32, 127; --gf-color-primary-darker: #010f52; --gf-color-primary-lighter: #0233cb; --gf-color-in-ctrl-primary: #01207f; --gf-color-in-ctrl-primary-rgb: 1, 32, 127; --gf-color-in-ctrl-primary-darker: #010f52; --gf-color-in-ctrl-primary-lighter: #0233cb; --gf-ctrl-border-color: #dcd7c9; --gf-ctrl-radius: 10px; --gf-ctrl-size: 50px; --gf-form-gap-y: 20px; --gf-form-gap-x: 18px; --gf-font-size-primary: 16px; --gf-color-danger: #b3261e; --gf-color-out-ctrl-dark: #5f6472; --gf-color-in-ctrl-contrast: #1c1f2a; }
.cbco-trade .gform_wrapper.gform-theme .gfield .gfield_label, .cbco-trade .gform_wrapper.gform-theme .gfield legend.gfield_label { font-family: 'Oswald', Arial, sans-serif !important; text-transform: uppercase; letter-spacing: .08em !important; font-size: 13px !important; font-weight: 500 !important; color: var(--lp-navy) !important; margin-bottom: 8px !important; }
.cbco-trade .gform_wrapper.gform-theme .gfield .gfield_required { font-size: 11px !important; color: var(--lp-ember-deep) !important; letter-spacing: .04em; }
.cbco-trade .gform_wrapper.gform-theme .gfield .ginput_complex label, .cbco-trade .gform_wrapper.gform-theme .gfield .ginput_container_name label { font-size: 12px !important; color: var(--lp-muted) !important; font-family: 'Open Sans', Arial, sans-serif; }
.cbco-trade .gform_wrapper.gform-theme input[type=text], .cbco-trade .gform_wrapper.gform-theme input[type=email], .cbco-trade .gform_wrapper.gform-theme input[type=tel], .cbco-trade .gform_wrapper.gform-theme select, .cbco-trade .gform_wrapper.gform-theme textarea { font-family: 'Open Sans', Arial, sans-serif; font-size: 16px; color: var(--lp-ink); background: #fff; }
.cbco-trade .gform_wrapper.gform-theme .gform_footer, .cbco-trade .gform_wrapper.gform-theme .gform-footer { margin-top: 8px; padding: 0; }
.cbco-trade .gform_wrapper.gform-theme .gform_footer .gform_button, .cbco-trade .gform_wrapper.gform-theme .gform-footer .gform_button, .cbco-trade .gform_wrapper.gform-theme .gfield#field_submit .gform-button { background: var(--lp-ember) !important; border: 2px solid var(--lp-ember) !important; color: #fff !important; border-radius: 999px !important; padding: .9em 2.2em !important; font-family: 'Oswald', Arial, sans-serif !important; text-transform: uppercase; letter-spacing: .08em !important; font-size: 15px !important; font-weight: 500 !important; line-height: 1.2 !important; height: auto !important; cursor: pointer; transition: background .15s, transform .15s; }
.cbco-trade .gform_wrapper.gform-theme .gform_footer .gform_button:hover, .cbco-trade .gform_wrapper.gform-theme .gform-footer .gform_button:hover { background: var(--lp-ember-deep) !important; border-color: var(--lp-ember-deep) !important; transform: translateY(-1px); }
.cbco-trade .gform_wrapper.gform-theme .gform_validation_errors { border-radius: 10px; }
.cbco-trade .gform_confirmation_message, .cbco-trade .gform_confirmation_wrapper { font-size: 18px; line-height: 1.5; color: var(--lp-ink); }

@media (prefers-reduced-motion: reduce) {
	.cbco-loc a.cbco-trade__can, .cbco-trade__can-ph img, .cbco-trade__dist { transition: none; }
	.cbco-loc a.cbco-trade__can:hover { transform: none; }
}

/* Form 5 carries per-form plugin CSS for a dark background (white labels, `body #gform_wrapper_5 … !important`);
   inside the white card it needs the ink colours back, at one more level of specificity. */
body .cbco-trade #gform_wrapper_5 .gform_body .gform_fields .gfield .gfield_label { font-family: 'Oswald', Arial, sans-serif !important; text-transform: uppercase; letter-spacing: .08em !important; font-size: 13px !important; font-weight: 500 !important; color: var(--lp-navy) !important; }
body .cbco-trade #gform_wrapper_5 .gform_body .gform_fields .gfield .gfield_label .gfield_required { color: var(--lp-ember-deep) !important; font-size: 11px !important; }
body .cbco-trade #gform_wrapper_5 .gform_body .gform_fields .gfield .gfield_description { color: var(--lp-muted) !important; font-size: 13px !important; }
body .cbco-trade #gform_wrapper_5 .gform_body .gform_fields .gfield .ginput_complex .ginput_left label,
body .cbco-trade #gform_wrapper_5 .gform_body .gform_fields .gfield .ginput_complex .ginput_right label,
body .cbco-trade #gform_wrapper_5 .gform_body .gform_fields .gfield .name_first label,
body .cbco-trade #gform_wrapper_5 .gform_body .gform_fields .gfield .name_last label,
body .cbco-trade #gform_wrapper_5 .gform_body .gform_fields .gfield .ginput_container_email label { color: var(--lp-muted) !important; font-size: 12px !important; font-family: 'Open Sans', Arial, sans-serif; }

/* Sell: WV + NC (one statewide distributor each) sit side by side under Pennsylvania */
.cbco-trade__states { display: grid; grid-template-columns: 1fr 1fr; gap: 44px 28px; }
.cbco-trade__states > .cbco-trade__state { grid-column: 1 / -1; }
.cbco-trade__states > .cbco-trade__state--one { grid-column: auto; }
.cbco-trade__state + .cbco-trade__state { margin-top: 0; }
.cbco-trade__state--one .cbco-trade__dists { grid-template-columns: 1fr; }
@media (max-width: 760px) { .cbco-trade__states { grid-template-columns: 1fr; } }
/* Sell lineup: eight cans = two even rows of four */
@media (min-width: 861px) { .cbco-sell ul.cbco-trade__cans { grid-template-columns: repeat(4, minmax(0, 1fr)); } .cbco-sell .cbco-trade__can-ph { aspect-ratio: 4 / 3; } }

/* Odd fact count (Sell: three facts) — last fact spans both tablet columns, no empty cell */
@media (min-width: 481px) and (max-width: 860px) {
	.cbco-trade .cbco-loc__fact:last-child:nth-child(odd) { grid-column: 1 / -1; }
}