
/* SWEATQUITY V16 — ONLY agreed targeted hero and headwear corrections. */

/* Full approved hero images stay intact. Their overall display width is modestly
   reduced on large screens instead of cropping models, ancestors, or garment art. */
.v10-hero .v10-hero-art,
.v10-drop-top .v16-drop-frame {
  position: relative;
  display: block;
  width: min(88%, 1490px) !important;
  max-width: 1490px;
  margin-left: auto;
  margin-right: auto;
  overflow: hidden;
  isolation: isolate;
}
.v10-hero .v10-hero-art > img,
.v10-drop-top .v16-drop-frame > img {
  display: block;
  width: 100%;
  max-height: none;
  height: auto;
  object-fit: contain;
}

/* These anchors precisely cover the buttons drawn into the approved photographs.
   Appearance is unchanged; mouse/touch/keyboard activation is now real. */
.v16-image-cta {
  position: absolute;
  display: block;
  z-index: 5;
  cursor: pointer;
  background: transparent;
  border: 0;
  border-radius: 3px;
  text-decoration: none;
  -webkit-tap-highlight-color: rgba(255, 189, 67, .30);
}
.v16-home-cta { left: 2.20%; top: 73.70%; width: 17.05%; height: 10.75%; }
.v16-drop-cta { left: 2.03%; top: 72.74%; width: 18.30%; height: 11.60%; }
.v16-image-cta:focus-visible {
  outline: 3px solid #ffcf59;
  outline-offset: 2px;
}
.v16-mobile-art {position: relative;}

/* Activate the already-existing headwear choice labels without redesigning them. */
.option-pills button.v16-headwear-mark {
  display:inline-flex;
  align-items:center;
  padding:.55rem .75rem;
  border:1px solid var(--line);
  border-radius:999px;
  background:color-mix(in srgb, var(--bg) 72%, transparent);
  font-family:"Barlow Condensed",sans-serif;
  font-size:inherit;
  font-weight:800;
  letter-spacing:.05em;
  line-height:inherit;
  text-transform:uppercase;
  color:var(--soft);
  cursor:pointer;
}
.option-pills button.v16-headwear-mark[aria-pressed="true"],
.option-pills button.v16-headwear-mark:focus-visible{
  border-color:var(--accent-2);
  box-shadow:inset 0 -2px 0 var(--accent-2);
  color:var(--text);
}
.v16-headwear-piece {
  margin-top:.9rem;
  padding:.6rem .9rem;
  border:1px solid var(--line);
  background:transparent;
  font:800 1rem "Barlow Condensed",sans-serif;
  text-transform:uppercase;
  color:var(--soft);
  cursor:pointer;
}
.v16-headwear-piece[aria-pressed="true"]{
  color:var(--text);
  border-color:var(--accent-2);
  box-shadow:inset 0 -3px 0 var(--accent-2);
}
.v16-headwear-selection {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap: .8rem 1rem;
  margin-top:1.1rem;
}
.v16-headwear-selection p {margin:0;font-weight:700;color:var(--text);}
.v16-headwear-selection small {color:var(--muted);}
.v16-headwear-continue {
  display:inline-flex;
  align-items:center;
  padding:.7rem 1rem;
  border:1px solid var(--accent);
  color:var(--bg);
  background:var(--accent);
  text-decoration:none;
  text-transform:uppercase;
  font:800 1rem "Barlow Condensed",sans-serif;
}
.v16-headwear-continue:focus-visible,
.v16-headwear-piece:focus-visible {outline:3px solid var(--accent-2); outline-offset:3px;}
.v16-headwear-interest-note {font-weight:700; margin:.5rem 0; color:var(--text);}

/* Existing mobile hero behavior is retained; the clickable photo remains usable. */
@media (max-width:560px) {
  .v10-hero .v10-hero-art {display:none !important;}
  .v10-hero .v16-mobile-art {display:block; position:relative; width:100%;}
  .v10-drop-top .v16-drop-frame {display:none !important;}
  .v16-headwear-selection{align-items:flex-start; flex-direction:column;}
}
/* Do not impose black behind selected controls in the white/cosmic themes. */
html[data-theme="light"] .v16-headwear-continue { color:#211710; }
html[data-theme="cosmic"] .v16-headwear-continue { color:#2c124e; }
