/* Final scoped finish: one-line mobile hero question, simplified Collection
   labels, and warmer textile display grounds beneath the locked garments. */
@media (max-width: 760px) {
  :root:root:root body:has(.hero) .copy .question {
    width: max-content !important;
    max-width: calc(100vw - 46px) !important;
    margin: 0 !important;
    font-size: clamp(11px, 3.35vw, 14px) !important;
    line-height: 1.1 !important;
    letter-spacing: .01em !important;
    white-space: nowrap !important;
    text-wrap: nowrap !important;
  }

  :root:root:root body:has(.hero) .copy .question span {
    display: inline !important;
    white-space: nowrap !important;
  }
}

:root:root:root body.collection-home.shirt-page .shirt-options {
  background:
    radial-gradient(circle at 12% 18%, rgba(242, 218, 169, .16) 0 1px, transparent 1.8px) 0 0 / 21px 21px,
    linear-gradient(138deg, #556552 0%, #788069 38%, #90775d 72%, #5d6c58 100%) !important;
  border-color: rgba(204, 177, 119, .72) !important;
  box-shadow:
    0 17px 38px rgba(28, 39, 30, .22),
    inset 0 0 0 1px rgba(242, 224, 187, .22) !important;
}

:root:root:root body.collection-home.shirt-page .shirt-options-intro {
  margin-bottom: 16px !important;
  border-radius: 3px !important;
  background: rgba(246, 239, 223, .91) !important;
  box-shadow: 0 7px 20px rgba(30, 41, 32, .13) !important;
}

:root:root:root body.collection-home.shirt-page #shirt-interest-form .shirt-card {
  border-color: rgba(99, 78, 49, .46) !important;
  box-shadow:
    0 8px 18px rgba(29, 37, 29, .18),
    inset 0 0 0 1px rgba(255, 246, 224, .32) !important;
}

:root:root:root body.collection-home.shirt-page #shirt-interest-form .shirt-card:has(input[value^="LOVE tee"]) {
  background:
    repeating-linear-gradient(90deg, transparent 0 31px, rgba(66, 87, 77, .22) 31px 33px, transparent 33px 66px),
    repeating-linear-gradient(0deg, transparent 0 31px, rgba(174, 132, 73, .23) 31px 33px, transparent 33px 66px),
    linear-gradient(145deg, #c6c9bd, #b8aa8d) !important;
}

:root:root:root body.collection-home.shirt-page #shirt-interest-form .shirt-card:has(input[value^="JOY tee"]) {
  background:
    repeating-linear-gradient(135deg, rgba(255, 246, 219, .1) 0 2px, transparent 2px 14px),
    linear-gradient(145deg, #b4aa79, #879078 56%, #9a8061) !important;
}

:root:root:root body.collection-home.shirt-page #shirt-interest-form .shirt-card:has(input[value^="PEACE tee"]) {
  background:
    repeating-linear-gradient(90deg, transparent 0 27px, rgba(57, 75, 62, .23) 27px 29px, transparent 29px 58px),
    repeating-linear-gradient(0deg, transparent 0 27px, rgba(195, 157, 91, .22) 27px 29px, transparent 29px 58px),
    linear-gradient(145deg, #abb8ba, #8e9a8f 57%, #a58c79) !important;
}

:root:root:root body.collection-home.shirt-page #shirt-interest-form .sweatshirt-card {
  background:
    repeating-linear-gradient(90deg, transparent 0 34px, rgba(221, 190, 126, .23) 34px 36px, transparent 36px 70px),
    repeating-linear-gradient(0deg, transparent 0 34px, rgba(72, 50, 42, .2) 34px 36px, transparent 36px 70px),
    linear-gradient(145deg, #64715a, #9c835e) !important;
}

:root:root:root body.collection-home.shirt-page #shirt-interest-form .shirt-card-copy {
  margin-top: 7px !important;
  border-top-color: rgba(109, 86, 50, .3) !important;
  border-radius: 2px !important;
  background: rgba(248, 242, 228, .87) !important;
}

@media (max-width: 760px) {
  :root:root:root body.collection-home.shirt-page .shirt-options {
    background:
      radial-gradient(circle at 14% 18%, rgba(242, 218, 169, .14) 0 1px, transparent 1.8px) 0 0 / 21px 21px,
      linear-gradient(145deg, #596954, #81795f 58%, #5f6e59) !important;
  }
}
