/* =========================================================================
   Ludic Media Studio — the v2 site (staged in v2/, October 2026)
   Loaded on v2 pages ONLY, after foundation / components / consent and after
   sections.css and audience.css, whose vx- and ax- classes it builds on.

   What lives here: the header's project button, the floating section nav,
   the v2 hero variants, studio cards, numbers band, process, capability
   cards, positioning "angles", the film block, the client band, the work
   cards and portfolio filters, the case-study page, the brief form and
   contact block, the title band, legal pages and the 404.

   Same rules as every stylesheet here: no ID selectors, only the documented
   breakpoints (36 / 48 / 64 / 80rem, plus 47.999 for max-width), every
   colour pair one that checks.py measures, never white on yellow.
   ========================================================================= */

:root {
  --v2-subnav-h: 3.25rem;
  --v2-card-shadow: 0.5rem 0.5rem 0 var(--black);
  --v2-radius-pill: 999px;
}

/* Anchors clear the sticky header AND the floating section nav. */
html { scroll-padding-top: calc(var(--header-h) + var(--v2-subnav-h) + 1rem); }

/* ---------- header: the project button ------------------------------- */
.site-nav__item--cta { padding: var(--space-sm) 0; }
.site-nav__cta.button { padding: 0.375rem 1rem; font-size: var(--text-sm); font-weight: 700; }
@media (min-width: 64rem) {
  .site-nav__item--cta { padding: 0 0 0 var(--space-xs); }
}

/* ---------- the floating section nav ---------------------------------- */
.v2-subnav {
  position: sticky;
  top: var(--header-h);
  z-index: 40;
  background: var(--yellow);
  border-bottom: 2px solid var(--black);
}
.v2-subnav__inner { display: flex; align-items: center; gap: var(--space-sm); min-height: var(--v2-subnav-h); }
.v2-subnav__label {
  display: none;
  flex: none;
  font-size: var(--text-xs);
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
@media (min-width: 80rem) { .v2-subnav__label { display: block; } }
.v2-subnav__list {
  display: flex;
  flex: 1;
  gap: 0.25rem;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: none;
  padding-block: 0.5rem;
}
.v2-subnav__list::-webkit-scrollbar { display: none; }
.v2-subnav__link {
  display: block;
  padding: 0.3125rem 0.75rem;
  border-radius: var(--v2-radius-pill);
  color: var(--black);
  font-size: var(--text-sm);
  font-weight: 700;
  white-space: nowrap;
  text-decoration: none;
  transition: background-color var(--duration) var(--ease), color var(--duration) var(--ease);
}
.v2-subnav__link:hover { color: var(--black); box-shadow: inset 0 0 0 2px var(--black); }
.v2-subnav__link[aria-current="true"] { background: var(--black); color: var(--yellow); }
.v2-subnav__cta {
  display: none;
  flex: none;
  padding: 0.3125rem 0.875rem;
  background: var(--black);
  color: var(--white);
  font-size: var(--text-sm);
  font-weight: 700;
  text-decoration: none;
  border: 2px solid var(--black);
}
.v2-subnav__cta:hover { background: transparent; color: var(--black); }
@media (min-width: 48rem) { .v2-subnav__cta { display: inline-block; } }
.v2-subnav__progress {
  position: absolute;
  left: 0;
  bottom: -2px;
  height: 3px;
  width: 100%;
  background: var(--black);
  transform-origin: left;
  transform: scaleX(var(--v2-progress, 0));
}

/* ---------- hero variants --------------------------------------------- */
.v2-hero__art--solo { padding-bottom: 0; }
.v2-hero--statement .vx-hero__inner { grid-template-columns: minmax(0, 1fr); }
.v2-hero--statement .vx-hero__copy { max-width: 62rem; }
.v2-hero--statement .vx-hero__lede { max-width: 46rem; }

/* ---------- studios ----------------------------------------------------- */
.v2-studios { display: grid; gap: var(--space-md); }
@media (min-width: 36rem) { .v2-studios { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 64rem) { .v2-studios { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-lg) var(--space-md); } }
@media (min-width: 64rem) { .v2-studios--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.v2-studio {
  position: relative;
  display: flex;
  flex-direction: column;
  background: var(--white);
  color: var(--black);
  border: 3px solid var(--black);
  transition: transform var(--duration) var(--ease), box-shadow var(--duration) var(--ease);
}
.v2-studio:hover,
.v2-studio:focus-within { transform: translate(-0.25rem, -0.25rem); box-shadow: var(--v2-card-shadow); }
.section[data-tone="black"] .v2-studio:hover,
.section[data-tone="black"] .v2-studio:focus-within { box-shadow: 0.5rem 0.5rem 0 var(--yellow); }
.v2-studio__media img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-bottom: 3px solid var(--black); }
.v2-studio__text { display: grid; gap: 0.625rem; align-content: start; flex: 1; padding: var(--space-sm) var(--space-sm) var(--space-md); }
.v2-studio__n { justify-self: start; padding: 0 0.4rem; background: var(--yellow); font-size: var(--text-xs); font-weight: 900; }
.v2-studio__name { font-size: var(--text-lg); font-weight: 800; line-height: var(--leading-snug); }
.v2-studio__link { color: inherit; text-decoration: none; }
.v2-studio__link::after { content: ""; position: absolute; inset: 0; }
.v2-studio__link:hover { color: inherit; }
.v2-studio__promise { line-height: var(--leading-mid); color: var(--ink-muted); }
.v2-studio__makes { display: flex; flex-wrap: wrap; gap: 0.375rem; }
.v2-studio__makes li { padding: 0.125rem 0.5rem; border: 1.5px solid var(--black); font-size: 0.8125rem; font-weight: 600; }
.v2-studio__go { display: inline-flex; align-items: center; gap: 0.5rem; margin-top: auto; padding-top: 0.25rem; font-size: var(--text-sm); font-weight: 700; }

/* ---------- numbers ----------------------------------------------------- */
.v2-numbers { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-lg) var(--space-md); }
@media (min-width: 64rem) { .v2-numbers { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 64rem) { .v2-numbers--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.v2-number { border-top: 4px solid var(--black); padding-top: var(--space-xs); }
.v2-number__big { font-size: clamp(2.5rem, 5vw, 4rem); font-weight: 900; line-height: 1; letter-spacing: -0.03em; font-variant-numeric: tabular-nums; }
.v2-number__label { margin-top: 0.5rem; font-weight: 600; line-height: var(--leading-mid); }
.v2-number__src { margin-top: 0.375rem; font-size: var(--text-xs); }

/* ---------- process ------------------------------------------------------ */
.v2-steps { --n: 4; display: grid; gap: var(--space-lg) var(--space-md); }
@media (min-width: 48rem) { .v2-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 64rem) { .v2-steps { grid-template-columns: repeat(var(--n), minmax(0, 1fr)); } }
.v2-step { border-top: 3px solid var(--yellow); padding-top: var(--space-sm); }
.v2-step__n { color: var(--yellow); font-size: var(--text-2xl); font-weight: 900; line-height: 1; letter-spacing: -0.03em; }
.v2-step__title { margin-top: var(--space-xs); font-size: var(--text-lg); font-weight: 800; line-height: var(--leading-snug); }
.v2-step__body { margin-top: 0.5rem; line-height: var(--leading-mid); }
.section[data-tone="black"] .v2-step__body { color: var(--white); }
.v2-step__makes { display: flex; flex-wrap: wrap; gap: 0.375rem; margin-top: var(--space-xs); }
.v2-step__makes li { padding: 0.125rem 0.5rem; border: 1.5px solid currentColor; font-size: 0.8125rem; font-weight: 600; }
.section[data-tone="black"] .v2-step__makes li { color: var(--yellow); }

/* ---------- capability cards -------------------------------------------- */
.v2-caps { display: grid; gap: var(--space-lg) var(--space-md); }
@media (min-width: 36rem) { .v2-caps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 64rem) {
  .v2-caps--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .v2-caps--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.v2-cap { display: flex; flex-direction: column; gap: 0.5rem; }
.v2-cap__media img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border: 2px solid var(--black); box-shadow: 0.375rem 0.375rem 0 var(--yellow); }
.section[data-tone="black"] .v2-cap__media img { border-color: var(--yellow); box-shadow: none; }
.section[data-tone="yellow"] .v2-cap__media img { box-shadow: 0.375rem 0.375rem 0 var(--black); }
.v2-cap__title { margin-top: var(--space-xs); font-size: var(--text-md); font-weight: 800; line-height: var(--leading-snug); }
.v2-cap__body { line-height: var(--leading-mid); color: var(--ink-muted); }
.section[data-tone="black"] .v2-cap__body { color: var(--white); }
.section[data-tone="yellow"] .v2-cap__body { color: var(--black); }
.v2-cap__uses { display: grid; gap: 0.25rem; font-size: var(--text-sm); }
.v2-cap__uses li { position: relative; padding-left: 1rem; }
.v2-cap__uses li::before { content: ""; position: absolute; left: 0; top: 0.7em; width: 0.5rem; height: 2px; background: currentColor; }
.v2-cap__more { margin-top: auto; padding-top: 0.25rem; }
.section[data-tone="black"] .v2-cap__more .arrow-link,
.section[data-tone="black"] .v2-cap__more .arrow-link:hover { color: var(--yellow); }

/* ---------- angles: where the studio is different ------------------------ */
.v2-angles { display: grid; gap: var(--space-lg) var(--space-xl); }
@media (min-width: 64rem) { .v2-angles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.v2-angle { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0 var(--space-sm); border-top: 3px solid var(--black); padding-top: var(--space-sm); }
.section[data-tone="black"] .v2-angle { border-top-color: var(--yellow); }
.v2-angle__n { grid-row: span 3; font-size: var(--text-xl); font-weight: 900; line-height: 1; background: var(--yellow); color: var(--black); padding: 0.25rem 0.375rem; align-self: start; }
.v2-angle__title { font-size: var(--text-lg); font-weight: 800; line-height: var(--leading-snug); }
.v2-angle__body { margin-top: 0.5rem; line-height: var(--leading-mid); }
.v2-angle__proof { margin-top: 0.5rem; font-size: var(--text-sm); color: var(--ink-muted); }
.section[data-tone="black"] .v2-angle__proof { color: var(--white); }
.section[data-tone="yellow"] .v2-angle__proof { color: var(--black); }

/* ---------- film ------------------------------------------------------------ */
.v2-film { display: grid; gap: var(--space-lg); align-items: center; }
@media (min-width: 64rem) { .v2-film { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); } }
.v2-film__media { border: 3px solid var(--yellow); }
.v2-film__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* ---------- clients ----------------------------------------------------------- */
.v2-clients { display: grid; gap: var(--space-md); }
@media (min-width: 64rem) { .v2-clients { grid-template-columns: 12rem minmax(0, 1fr); align-items: center; } }
.v2-clients__title { font-size: var(--text-sm); font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.v2-clients__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-md) var(--space-sm); align-items: center; }
@media (min-width: 48rem) { .v2-clients__list { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
.v2-client img { max-height: 2.25rem; width: auto; margin-inline: auto; filter: grayscale(1); transition: filter var(--duration) var(--ease); }
.v2-client:hover img { filter: none; }

/* ---------- statement -------------------------------------------------------- */
.v2-statement { max-width: 56rem; font-size: clamp(1.75rem, 3.6vw, 3rem); font-weight: 800; line-height: 1.15; letter-spacing: -0.02em; }
.v2-statement__by { margin-top: var(--space-sm); font-weight: 600; }

/* ---------- work cards ---------------------------------------------------- */
.v2-work { display: grid; gap: var(--space-md); }
@media (min-width: 36rem) { .v2-work { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 64rem) { .v2-work { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-lg) var(--space-md); } }
.v2-work + .button-group { margin-top: var(--space-lg); }
.v2-card { position: relative; }
.v2-card__inner {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: var(--white);
  border: 3px solid var(--black);
  transition: transform var(--duration) var(--ease), box-shadow var(--duration) var(--ease);
}
.v2-card:hover .v2-card__inner,
.v2-card:focus-within .v2-card__inner { transform: translate(-0.25rem, -0.25rem); box-shadow: var(--v2-card-shadow); }
.v2-card__media { overflow: hidden; border-bottom: 3px solid var(--black); background: var(--cream); }
.v2-card__media img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform 0.6s var(--ease); }
.v2-card:hover .v2-card__media img { transform: scale(1.04); }
.v2-card__text { display: grid; gap: 0.5rem; align-content: start; flex: 1; padding: var(--space-sm) var(--space-sm) var(--space-md); }
.v2-card__cat { justify-self: start; padding: 0.0625rem 0.5rem; background: var(--yellow); font-size: var(--text-xs); font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase; }
.v2-card__title { font-size: var(--text-md); font-weight: 800; line-height: var(--leading-snug); }
.v2-card__link { color: inherit; text-decoration: none; }
.v2-card__link::after { content: ""; position: absolute; inset: 0; }
.v2-card__link:hover { color: inherit; }
.v2-card__blurb {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: var(--text-sm);
  line-height: var(--leading-mid);
  color: var(--ink-muted);
}
.v2-card__go { display: inline-flex; align-items: center; gap: 0.5rem; margin-top: auto; padding-top: 0.25rem; font-size: var(--text-sm); font-weight: 700; }
.v2-card--featured .v2-card__inner { background: var(--black); color: var(--white); border-color: var(--black); }
@media (min-width: 64rem) {
  .v2-card--featured .v2-card__inner { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); }
  .v2-card--featured .v2-card__media { border-bottom: 0; border-right: 3px solid var(--black); }
  .v2-card--featured .v2-card__media img { height: 100%; aspect-ratio: auto; min-height: 22rem; }
}
.v2-card--featured .v2-card__text { padding: var(--space-md); align-content: center; gap: var(--space-xs); }
.v2-card--featured .v2-card__title { font-size: clamp(1.5rem, 2.6vw, 2.25rem); line-height: 1.1; }
.v2-card--featured .v2-card__blurb { color: var(--white); -webkit-line-clamp: 5; font-size: var(--text-base); }
.v2-card--featured .v2-card__go { color: var(--yellow); }
.v2-card--featured:hover .v2-card__inner { box-shadow: 0.5rem 0.5rem 0 var(--yellow); }
.v2-card--featured :focus-visible { outline-color: var(--white); }

/* ---------- the portfolio ------------------------------------------------- */
.v2-feature { margin-bottom: var(--space-xl); }
.v2-feature__list { display: block; }
.v2-filters {
  position: sticky;
  top: var(--header-h);
  z-index: 30;
  display: grid;
  gap: var(--space-xs) var(--space-md);
  margin: 0 calc(-1 * var(--space-xs)) var(--space-md);
  padding: var(--space-sm) var(--space-xs);
  background: var(--white);
  border-bottom: 3px solid var(--black);
}
@media (min-width: 64rem) {
  .v2-filters { grid-template-columns: auto minmax(0, 18rem) minmax(0, 1fr); align-items: center; }
  .v2-filters__status { grid-column: 1 / -1; }
}
.v2-filters__title { font-size: var(--text-xl); font-weight: 800; line-height: 1; }
.v2-filters__input {
  width: 100%;
  padding: 0.5rem 0.875rem;
  border: 2px solid var(--black);
  border-radius: var(--v2-radius-pill);
  background: var(--white);
  font: inherit;
  font-size: var(--text-sm);
}
.v2-chips { display: flex; flex-wrap: wrap; gap: 0.375rem; }
.v2-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.3125rem 0.75rem;
  border: 2px solid var(--black);
  border-radius: var(--v2-radius-pill);
  background: var(--white);
  color: var(--black);
  font: inherit;
  font-size: var(--text-sm);
  font-weight: 700;
  cursor: pointer;
}
.v2-chip:hover { background: var(--yellow); }
.v2-chip[aria-pressed="true"] { background: var(--black); color: var(--yellow); }
.v2-chip__n { font-size: var(--text-xs); font-weight: 600; }
.v2-filters__status { display: flex; align-items: center; gap: var(--space-sm); font-size: var(--text-sm); }
.v2-filters__count { font-weight: 700; }
.v2-empty { margin-top: var(--space-lg); font-size: var(--text-md); }

/* ---------- the case-study page ------------------------------------------- */
.v2-case__head { background: var(--black); color: var(--white); padding-block: var(--space-lg) var(--space-xl); }
.v2-case__head .vx-eyebrow { background: var(--yellow); color: var(--black); }
.v2-crumbs ol { display: flex; flex-wrap: wrap; gap: 0.25rem 0.5rem; margin-bottom: var(--space-md); font-size: var(--text-xs); }
.v2-crumbs li + li::before { content: "/"; margin-right: 0.5rem; color: var(--yellow); }
.v2-crumbs a { color: var(--white); }
.v2-crumbs a:hover { color: var(--yellow); }
.v2-case__title { max-width: 24ch; font-size: clamp(2rem, 4.4vw, 3.75rem); font-weight: 900; line-height: 1.02; letter-spacing: -0.025em; }
.v2-case__blurb { max-width: 44rem; margin-top: var(--space-sm); font-size: var(--text-md); line-height: var(--leading-mid); }
.v2-case__hero { margin-top: calc(-1 * var(--space-lg)); border: 3px solid var(--black); box-shadow: 0.75rem 0.75rem 0 var(--yellow); background: var(--cream); }
.v2-case__hero img { width: 100%; max-height: 44rem; object-fit: cover; }
.v2-case__body { display: grid; gap: var(--space-lg); padding-block: var(--space-xl); }
@media (min-width: 64rem) { .v2-case__body { grid-template-columns: 16rem minmax(0, 44rem); gap: var(--space-xl); justify-content: center; } }
@media (min-width: 64rem) { .v2-case__aside { position: sticky; top: calc(var(--header-h) + var(--space-md)); align-self: start; } }
.v2-case__meta { display: grid; gap: var(--space-xs); padding-top: var(--space-xs); border-top: 3px solid var(--black); }
.v2-case__meta-row dt { font-size: var(--text-xs); font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.v2-case__meta-row dd { margin: 0; font-weight: 600; }
.v2-case__cta { margin-top: var(--space-md); width: 100%; }
.v2-case__prose { font-size: 1.0625rem; line-height: var(--leading-body); }
.v2-case__prose p { margin-bottom: var(--space-xs); }
.v2-case__prose .v2-case__h {
  margin: var(--space-lg) 0 var(--space-xs);
  padding-top: var(--space-xs);
  border-top: 3px solid var(--black);
  font-size: var(--text-lg);
  font-weight: 800;
  line-height: var(--leading-snug);
}
.v2-case__prose .v2-case__h:first-child { margin-top: 0; }
.v2-case__prose em { font-style: italic; }
.v2-case__films { display: grid; gap: var(--space-md); padding-bottom: var(--space-xl); }
.v2-case__films .v2-case__h { font-size: var(--text-lg); font-weight: 800; padding-top: var(--space-xs); border-top: 3px solid var(--black); }
.v2-case__gallery { padding-bottom: var(--space-xl); }
.v2-case__gallery-title { margin-bottom: var(--space-md); font-size: var(--text-xl); font-weight: 800; }
.v2-gallery { display: grid; gap: var(--space-sm); }
@media (min-width: 48rem) { .v2-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.v2-gallery li:first-child { grid-column: 1 / -1; }
.v2-gallery img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border: 2px solid var(--black); background: var(--cream); }
.v2-pager { display: grid; gap: var(--space-sm); padding-bottom: var(--space-xl); }
@media (min-width: 48rem) { .v2-pager { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.v2-pager__link { display: grid; gap: 0.25rem; padding: var(--space-sm); border: 3px solid var(--black); text-decoration: none; color: var(--black); }
.v2-pager__link:hover { background: var(--yellow); color: var(--black); }
.v2-pager__link--next { text-align: right; }
@media (min-width: 48rem) { .v2-pager__link--next:only-child { grid-column: 2; } }
.v2-pager__label { font-size: var(--text-xs); font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.v2-pager__title { font-weight: 700; line-height: var(--leading-snug); }

/* ---------- contact: the brief ------------------------------------------- */
.v2-contact { background: var(--black); color: var(--white); }
.v2-contact--page { padding-block: var(--space-xl) var(--space-2xl); }
.v2-contact__inner { display: grid; gap: var(--space-xl); }
@media (min-width: 64rem) { .v2-contact__inner { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); align-items: start; } }
.v2-contact .vx-eyebrow { background: var(--yellow); color: var(--black); }
.v2-contact__title { font-size: clamp(2.25rem, 5vw, 4rem); font-weight: 900; line-height: 1; letter-spacing: -0.03em; }
.v2-contact__title--page { font-size: clamp(2.5rem, 6vw, 4.75rem); }
.v2-contact__lede { margin-top: var(--space-sm); max-width: 32rem; font-size: var(--text-md); line-height: var(--leading-mid); }
.v2-next__head { margin-top: var(--space-lg); font-size: var(--text-sm); font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--yellow); }
.v2-next { display: grid; gap: var(--space-sm); margin-top: var(--space-sm); }
.v2-next__step { display: grid; grid-template-columns: 2.25rem minmax(0, 1fr); gap: 0 var(--space-xs); }
.v2-next__n {
  grid-row: span 2;
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background: var(--yellow);
  color: var(--black);
  font-weight: 900;
}
.v2-next__title { font-size: var(--text-base); font-weight: 800; }
.v2-next__body { font-size: var(--text-sm); line-height: var(--leading-mid); }
.v2-direct { display: grid; gap: 0.375rem; margin-top: var(--space-lg); padding-top: var(--space-sm); border-top: 1px solid var(--dark-grey); }
.v2-direct li { display: grid; grid-template-columns: 3.5rem minmax(0, 1fr); font-size: var(--text-sm); }
.v2-direct span { font-weight: 800; color: var(--yellow); }
.v2-direct a { color: var(--white); }
.v2-direct a:hover { color: var(--yellow); }
.v2-address { display: grid; grid-template-columns: 3.5rem minmax(0, 1fr); margin-top: var(--space-sm); font-size: var(--text-sm); }
.v2-address span { font-weight: 800; color: var(--yellow); }

.v2-form-card { background: var(--white); color: var(--black); padding: var(--space-md); border: 3px solid var(--yellow); }
@media (min-width: 48rem) { .v2-form-card { padding: var(--space-lg); } }
.v2-form-card :focus-visible { outline-color: var(--black); }
.v2-form { display: grid; gap: var(--space-sm); }
.v2-form__set { margin: 0; padding: 0; border: 0; }
.v2-form__legend { padding: 0; margin-bottom: var(--space-xs); font-size: var(--text-md); font-weight: 800; }
.v2-pick { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.v2-pick li { position: relative; }
.v2-pick__input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.v2-pick__label {
  display: inline-block;
  padding: 0.375rem 0.875rem;
  border: 2px solid var(--black);
  border-radius: var(--v2-radius-pill);
  font-size: var(--text-sm);
  font-weight: 700;
  cursor: pointer;
  user-select: none;
}
.v2-pick__label:hover { background: var(--yellow); }
.v2-pick__input:checked + .v2-pick__label { background: var(--black); color: var(--yellow); }
.v2-pick__input:focus-visible + .v2-pick__label { outline: 3px solid var(--black); outline-offset: 2px; }
.v2-form__row { display: grid; gap: var(--space-sm); }
@media (min-width: 48rem) { .v2-form__row { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.v2-form__field { display: grid; gap: 0.375rem; }
.v2-form__label { font-size: var(--text-sm); font-weight: 700; }
.v2-form__opt { font-weight: 400; color: var(--ink-muted); }
.v2-form__input {
  width: 100%;
  padding: 0.6875rem 0.875rem;
  border: 2px solid var(--black);
  background: var(--white);
  color: var(--black);
  font: inherit;
  font-size: var(--text-base);
}
.v2-form__input:focus-visible { outline: 3px solid var(--yellow); outline-offset: 0; box-shadow: 0 0 0 5px var(--black); }
.v2-form__area { min-height: 8rem; resize: vertical; }
.v2-form__check { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0.625rem; align-items: start; font-size: var(--text-sm); }
.v2-form__box { width: 1.125rem; height: 1.125rem; margin-top: 0.2rem; accent-color: var(--black); }
.v2-form__send { display: grid; gap: var(--space-xs); }
.v2-form__send .button { justify-self: start; padding-inline: 2rem; font-weight: 700; }
.v2-form__legal { font-size: var(--text-xs); line-height: var(--leading-mid); color: var(--ink-muted); }

/* ---------- title band, legal, 404 ---------------------------------------- */
.v2-band { background: var(--black); color: var(--white); padding-block: var(--space-xl); }
.v2-band .vx-eyebrow { background: var(--yellow); color: var(--black); }
.v2-band__title { max-width: 20ch; font-size: clamp(2.5rem, 6vw, 4.75rem); font-weight: 900; line-height: 1; letter-spacing: -0.03em; }
.v2-band__lede { max-width: 40rem; margin-top: var(--space-sm); font-size: var(--text-md); line-height: var(--leading-mid); }
.v2-legal { padding-block: var(--space-xl); }
.v2-legal__updated { margin-bottom: var(--space-md); padding-left: var(--space-xs); border-left: 4px solid var(--yellow); font-weight: 600; }
.v2-legal__prose h2 { margin: var(--space-lg) 0 var(--space-xs); font-size: var(--text-lg); font-weight: 800; }
.v2-legal__prose h3 { margin: var(--space-md) 0 0.5rem; font-size: var(--text-md); font-weight: 800; }
.v2-404 { padding-block: var(--space-2xl); }
.v2-404__code { color: var(--yellow); font-size: clamp(5rem, 16vw, 12rem); font-weight: 900; line-height: 0.85; letter-spacing: -0.05em; }
.v2-404__sub { margin-top: var(--space-xl); font-size: var(--text-sm); font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--yellow); }
.v2-404__links { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: var(--space-xs); }
.v2-404__links a { display: inline-block; padding: 0.375rem 0.875rem; border: 2px solid var(--yellow); color: var(--white); text-decoration: none; font-weight: 700; }
.v2-404__links a:hover { background: var(--yellow); color: var(--black); }

/* The portfolio's "Featured story" label is the section's first heading. */
.v2-feature__title { margin-top: 0; line-height: 1.4; }

/* A case study's published figure, on its card (v2site.METRICS). */
.v2-card__media { position: relative; }
.v2-metric {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 1;
  display: grid;
  max-width: calc(100% - 1rem);
  margin: 0;
  padding: 0.5rem 0.75rem;
  background: var(--black);
  color: var(--white);
}
.v2-metric strong { color: var(--yellow); font-size: clamp(1.375rem, 2vw, 1.75rem); font-weight: 900; line-height: 1; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.v2-metric span { margin-top: 0.25rem; font-size: var(--text-xs); font-weight: 700; line-height: var(--leading-snug); }

/* On black bands: the secondary button is an outline, so a pair reads as
   first and second choice (foundation.css paints every button yellow there);
   arrow links stay yellow on hover; quote credits stay legible. */
.section[data-tone="black"] .button--secondary { background: transparent; border-color: var(--white); color: var(--white); }
.section[data-tone="black"] .button--secondary:hover,
.section[data-tone="black"] .button--secondary:focus-visible { background: var(--white); border-color: var(--white); color: var(--black); }
.section[data-tone="black"] .arrow-link:hover { color: var(--yellow); }
.section[data-tone="black"] .vx-story__quote footer { color: var(--white); }
.v2-card--featured .v2-card__cat { color: var(--black); }