/* NH LabShack — shop grid, product page, forms, featured carousel.
   Builds on nh-labshack-theme.css tokens/components. */

/* ---------- Featured carousel (black panel, red accents) ---------- */
.nh-carousel { position: relative; background: var(--nh-black); border-top: 6px solid var(--nh-red);
  border-radius: var(--nh-radius-sm); overflow: hidden; }
.nh-carousel__slide { display: none; grid-template-columns: 1.1fr 1fr; align-items: center; gap: 24px;
  min-height: 340px; }
.nh-carousel__slide.is-active { display: grid; }
.nh-carousel__text { padding: 36px 16px 48px 40px; color: #fff; }
.nh-carousel__title { margin: 8px 0 14px; font: 800 clamp(22px, 3.2vw, 36px)/1.05 var(--nh-font-display);
  text-transform: uppercase; color: #fff; }
.nh-carousel__meta { display: flex; align-items: center; gap: 14px; margin: 0 0 20px; flex-wrap: wrap; }
.nh-carousel__cta { display: flex; gap: 12px; flex-wrap: wrap; }
.nh-btn--inverse { background: transparent; border-color: #fff; color: #fff; }
.nh-btn--inverse:hover { background: #fff; border-color: #fff; color: var(--nh-black); }
.nh-carousel__media { display: grid; place-items: center; background: #fff; align-self: stretch;
  min-height: 340px; }
.nh-carousel__media img { width: 100%; height: 100%; max-height: 420px; object-fit: contain; padding: 20px; }
.nh-carousel__arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 2;
  width: 44px; height: 44px; border: 2px solid #fff; border-radius: var(--nh-radius-sm);
  background: rgba(11,11,11,.65); color: #fff; font-size: 18px; cursor: pointer; }
.nh-carousel__arrow:hover { background: var(--nh-red); border-color: var(--nh-red); }
.nh-carousel__arrow--prev { left: 12px; }
.nh-carousel__arrow--next { right: 12px; }
.nh-carousel__dots { position: absolute; left: 40px; bottom: 14px; display: flex; gap: 8px; }
.nh-carousel__dots button { width: 26px; height: 8px; border: 0; border-radius: 2px;
  background: #555; cursor: pointer; }
.nh-carousel__dots button[aria-selected="true"] { background: var(--nh-red-bright); }

/* ---------- Shop grid ---------- */
.nh-shop__intro { max-width: 70ch; color: var(--nh-graphite); }
.nh-shop__controls { display: flex; gap: 12px; flex-wrap: wrap; align-items: center;
  margin: 20px 0 26px; }
.nh-shop__controls input[type="search"] { flex: 1 1 260px; }
.nh-shop__controls input, .nh-shop__controls select {
  min-height: 44px; padding: 0 12px; border: 1px solid var(--nh-line);
  border-radius: var(--nh-radius-sm); background: #fff; font: 400 15px var(--nh-font-body); }
.nh-shop__controls input:focus, .nh-shop__controls select:focus {
  outline: 3px solid var(--nh-red-bright); outline-offset: 1px; }
.nh-shop__count { color: var(--nh-gray); font-size: 14px; }
.nh-shop__grid { margin-bottom: 40px; }
.nh-shop__card .nh-card__media { text-decoration: none; }
.nh-shop__title { margin: 10px 0 4px; font: 800 17px/1.25 var(--nh-font-body); text-transform: none; }
.nh-shop__title a { color: var(--nh-black); text-decoration: none; }
.nh-shop__title a:hover { color: var(--nh-red); }
.nh-shop__cardfoot { display: flex; align-items: center; justify-content: space-between;
  gap: 10px; margin-top: 12px; }

/* ---------- Product page ---------- */
.nh-product { padding-top: 24px; }
.nh-breadcrumb { font-size: 14px; color: var(--nh-gray); }
.nh-product__layout { display: grid; grid-template-columns: minmax(280px, 1fr) 1fr; gap: 36px;
  margin-top: 10px; }
.nh-product__media { background: #fff; border: 1px solid var(--nh-line);
  border-top: 4px solid var(--nh-red); border-radius: var(--nh-radius-sm);
  display: grid; place-items: center; min-height: 320px; }
.nh-product__media img { width: 100%; max-height: 520px; object-fit: contain; padding: 20px; }
.nh-product__title { margin: 6px 0 6px; font: 800 clamp(24px, 3vw, 34px)/1.1 var(--nh-font-display);
  text-transform: uppercase; }
.nh-product__price { margin: 10px 0; font-size: 32px; }

/* ---------- Forms ---------- */
.nh-inquire { margin: 48px 0 56px; }
.nh-form { background: #fff; border: 1px solid var(--nh-line); border-top: 4px solid var(--nh-red);
  border-radius: var(--nh-radius-sm); padding: 26px; max-width: 780px; }
.nh-form label { display: block; font-weight: 700; font-size: 14px; margin-bottom: 4px; }
.nh-form input[type="text"], .nh-form input[type="email"], .nh-form input[type="tel"],
.nh-form input[type="number"], .nh-form input[type="search"], .nh-form textarea {
  width: 100%; min-height: 44px; padding: 8px 12px; margin-top: 4px;
  border: 1px solid var(--nh-line); border-radius: var(--nh-radius-sm);
  font: 400 15px var(--nh-font-body); background: var(--nh-offwhite); }
.nh-form input:focus, .nh-form textarea:focus { outline: 3px solid var(--nh-red-bright);
  outline-offset: 1px; background: #fff; }
.nh-form__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 14px; margin: 16px 0; }
.nh-form__kind { border: 1px solid var(--nh-line); border-radius: var(--nh-radius-sm);
  padding: 14px 16px; margin: 0 0 6px; }
.nh-form__kind legend { font-weight: 800; text-transform: uppercase; font-size: 13px;
  letter-spacing: .05em; padding: 0 6px; }
.nh-form__kind label { display: inline-flex; align-items: center; gap: 8px;
  margin: 6px 22px 2px 0; font-weight: 400; }
.nh-form__msg { margin: 6px 0 14px; }
.nh-form textarea { resize: vertical; }
.nh-form__consent { display: flex; align-items: center; gap: 10px; font-weight: 400;
  margin: 0 0 18px; }
.nh-form__consent input { width: 18px; height: 18px; }
.nh-form__note { margin: 14px 0 0; font-size: 13px; color: var(--nh-gray); }
.nh-form__hp { position: absolute !important; left: -9999px !important; height: 0; overflow: hidden; }
.nh-form__success { background: var(--nh-black); color: #fff; border-left: 8px solid var(--nh-red);
  padding: 16px 20px; margin: 0 0 20px; border-radius: var(--nh-radius-sm); }
[data-offer-only] { opacity: .55; }
[data-offer-only].is-active { opacity: 1; }

@media (max-width: 800px) {
  .nh-carousel__slide { grid-template-columns: 1fr; min-height: 0; }
  .nh-carousel__media { min-height: 240px; order: -1; }
  .nh-carousel__text { padding: 24px 20px 52px; }
  .nh-carousel__dots { left: 20px; }
  .nh-product__layout { grid-template-columns: 1fr; }
}