/* Mr. Newberger's AI Funnies — the mrnewberger category archive.
   Page-specific; enqueued only on is_product_category('mrnewberger').

   The hero rules here are deliberately a full independent copy of the
   homepage hero's construction (repo/README.md: "same construction as the
   homepage hero... but the media is a looping video, not a photo") rather
   than a shared include — home.css only loads on the home template, and
   this page needed its own class names (bkc-nb-hero*) so the two hero
   builds don't depend on each other's stylesheet being present. */

.bkc-nb-hero{position:relative;background:var(--surface-inverse);background-image:var(--grime-noise),var(--grime-blotch),var(--grime-soot);color:var(--text-inverse);border-bottom:var(--border-hair) solid var(--line-strong);overflow:hidden}
.bkc-nb-hero__photo{position:absolute;inset:0;left:42%;background-size:cover;background-position:center right;-webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.22) 22%,rgba(0,0,0,.72) 46%,#000 68%);mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.22) 22%,rgba(0,0,0,.72) 46%,#000 68%)}
.bkc-nb-hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:20% center;filter:var(--filter-photo)}
.bkc-nb-hero__scrim{position:absolute;inset:0;background:linear-gradient(90deg,var(--surface-inverse) 0%,rgba(42,44,41,.92) 26%,rgba(42,44,41,.55) 46%,transparent 66%);pointer-events:none}
.bkc-nb-hero__inner{position:relative;max-width:var(--container-max);margin:0 auto;padding:var(--space-13) var(--gutter-page-lg);min-height:520px;display:flex;align-items:flex-end}
.bkc-nb-hero__copy{max-width:min(600px,54%)}
.bkc-nb-hero__eyebrow{color:var(--ash-500)}
.bkc-nb-hero__title{font:var(--fw-bold) clamp(40px,4.6vw,76px)/0.98 var(--font-display);letter-spacing:var(--ls-display);text-transform:uppercase;color:var(--ash-050);margin:var(--space-6) 0 var(--space-7)}
.bkc-nb-hero__lede{font:var(--type-body);color:var(--ash-300);max-width:44ch}
.bkc-nb-hero__actions{margin-top:var(--space-9)}

@media (max-width: 780px){
	.bkc-nb-hero__photo{left:0;opacity:.35}
	.bkc-nb-hero__copy{max-width:100%}
	.bkc-nb-hero__inner{min-height:420px;padding:var(--space-10) var(--gutter-page)}
}

/* ===== merch grid ===== */

.bkc-newberger-merch{max-width:var(--container-max);margin:0 auto;padding:var(--space-12) var(--gutter-page-lg) 0}
.bkc-newberger-merch__head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:var(--space-8);padding-bottom:var(--space-6);border-bottom:var(--border-hair) solid var(--line-hairline)}
.bkc-newberger-merch__head h2{text-transform:uppercase}

/* Client-specified 3-up row, distinct from the shop archive's own column
   cap — same "override Woo's own grid" approach as woo-bridge.css. */
@media (min-width: 900px){
	.bkc-newberger-merch ul.products{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* ===== lower panels ===== */

.bkc-newberger-panels{max-width:var(--container-max);margin:0 auto;padding:var(--space-12) var(--gutter-page-lg) var(--space-13);display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-8);align-items:stretch}

/* Plain ash panel per the real prototype (repo/design/Bankrupt & Co
   Site.dc.html, "How this works"/"GO FULLY BANKRUPT" cards: background
   #E7E3DC, border #B6B2A8, no texture) — corrected 2026-08-30 from an
   earlier build that wrongly reused the steel-plate+hatch treatment (that
   texture belongs to the About page's sidebar cards, a different section). */
.bkc-newberger-card{background:var(--surface-panel);border:var(--border-hair) solid var(--line-hairline);padding:var(--space-10);display:flex;flex-direction:column}
.bkc-newberger-card--span2{grid-column:span 2}
.bkc-newberger-card__body{font:var(--type-body);color:var(--text-body);margin-top:var(--space-7)}

.bkc-newberger-signup{margin-top:var(--space-7);display:grid;grid-template-columns:minmax(0,260px) minmax(0,1fr);gap:var(--space-8);align-items:start}
.bkc-newberger-signup .bkc-newberger-card__body{margin-top:0}

/* bkc_newsletter_form()'s shared markup (inc/newsletter.php) ships no layout
   of its own — home.css and content.css each style .bkc-signup-form for
   their own context, this page needs the same treatment. Missing here meant
   the email input and button fell back to stacked, unstyled block elements. */
.bkc-newberger-signup .bkc-signup-form{display:flex;gap:var(--space-4)}
.bkc-newberger-signup .bkc-signup-form__input,
.bkc-newberger-signup .bkc-input{flex:1;min-width:0}
.bkc-newberger-signup .bkc-signup__message{font:var(--type-body-sm);color:var(--status-ok)}
.bkc-newberger-signup .bkc-signup__message--error{color:var(--status-bad)}

@media (max-width: 480px){
	.bkc-newberger-signup .bkc-signup-form{flex-direction:column}
}

@media (max-width: 900px){
	.bkc-newberger-panels{grid-template-columns:1fr;padding:var(--space-10) var(--gutter-page) var(--space-11)}
	.bkc-newberger-card--span2{grid-column:auto}
	.bkc-newberger-signup{grid-template-columns:1fr}
}