/* VENDORED from design-concepts/APPROVED/shared/sets/C2.css by scripts/gen/vendor-board.mjs. Do not edit: check-vendored-board.mjs
   re-derives this file and FAILS on drift. Transforms: board font folder -> /fonts/; board set assets -> /images/. */
/* APPROVED copy (TASK-CO1, 2026-10-16) of design-concepts/round-2/C2/modules/C2.css: the frozen design reference for Phase 2 ([R25], GATE 1.5 R-24). Edit nothing here; a change is a new ruling. */
/* C* "Conditions, photorealistic figure" (R-21), module id C2, prefix r2c- (TASK-R2, GATE 1.5 round 2, 2026-10-16).
   Set C's body map (numbered pins, hover / focus links between a region and its conditions, the breathing rings), now on a
   photorealistic generated figure (candidate 1, approved at GATE 4a, R-25; the only figure) inside a double-bezel studio plate. Pins sit only where
   the figure can show the region: hair and scalp, face and skin, shoulders and joints, the lower torso side for the back (with a
   "Back" tag), hips and mobility, knees. Peyronie's disease and the whole-body concerns are a linked list beside the figure.
   Every selector is scoped to [data-variant="C2"]; no @keyframes, no animation; motion is GSAP (C2.js). */

[data-variant="C2"].r2c-map-sec { background: var(--cream-hi); padding-block: var(--sp-open); overflow-x: clip; }
[data-variant="C2"]:is(.li-motion *) [data-r2c-reveal] { opacity: 0; }

/* ---------- head (set C's) ---------- */
[data-variant="C2"] .r2c-head { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: clamp(2.5rem, 6vw, 6rem); align-items: end; }
[data-variant="C2"] .r2c-head .li-eyebrow { grid-column: 1 / -1; justify-self: start; }
[data-variant="C2"] .r2c-cond-h { font-size: var(--s-4); line-height: 1.04; letter-spacing: -.012em; max-width: 15ch; margin-top: .9rem; }
[data-variant="C2"] .r2c-head > p:not(.li-eyebrow) { color: var(--ink-72); line-height: 1.75; max-width: 60ch; }

/* ---------- the map: plate | lists ---------- */
[data-variant="C2"] .r2c-map { margin-top: clamp(2.6rem, 5vw, 4rem); display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 5vw, 5rem); align-items: start; }
[data-variant="C2"] .r2c-stage { min-width: 0; }
[data-variant="C2"] .r2c-plate { position: relative; margin: 0 auto; max-width: 470px; padding: 8px; border-radius: var(--r-xl); background: var(--cream);
  border: 1px solid var(--ink-09); box-shadow: var(--sh-1); }
[data-variant="C2"] .r2c-plate-in { position: relative; border-radius: calc(var(--r-xl) - 8px); overflow: hidden; background: var(--r2c-bg, #EEE4D6);
  box-shadow: inset 0 1px 0 rgba(252,250,244,.7); }
[data-variant="C2"] .r2c-fig { position: relative; width: 100%; aspect-ratio: 2 / 3; }
[data-variant="C2"] .r2c-fig-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transform-origin: 50% 60%; }
[data-variant="C2"] .r2c-tint { position: absolute; inset: 0; background: rgba(207,220,236,.32); opacity: 0; pointer-events: none; transition: opacity .5s var(--ease); }
[data-variant="C2"] .r2c-map.is-whole .r2c-tint { opacity: 1; }
[data-variant="C2"] .r2c-mock { position: absolute; left: 20px; bottom: 20px; z-index: 3; padding: .38rem .7rem; border-radius: var(--r-pill); background: rgba(252,250,244,.9);
  border: 1px solid var(--ink-16); font-size: .62rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-72); }

/* PINS:BEGIN (generated by src/build.mjs from FIG) */
[data-variant="C2"] .r2c-map { --head-x: 47%; --head-y: 6.5%; --face-x: 52%; --face-y: 13.4%; --joints-x: 33.4%; --joints-y: 21.2%; --back-x: 66%; --back-y: 40%; --hips-x: 37%; --hips-y: 46.5%; --knee1-x: 41%; --knee1-y: 68.6%; --knee2-x: 55.6%; --knee2-y: 68.6%; }
/* PINS:END */

/* pins (set C's anatomy) */
[data-variant="C2"] .r2c-pin { position: absolute; z-index: 2; width: 44px; height: 44px; margin: -22px 0 0 -22px; display: grid; place-items: center; cursor: pointer;
  -webkit-tap-highlight-color: transparent; transition: opacity .45s var(--ease); }
[data-variant="C2"] .r2c-pin-ring { position: absolute; left: 50%; top: 50%; width: 26px; height: 26px; margin: -13px 0 0 -13px; border-radius: 50%; border: 1.5px solid var(--ink); opacity: 0; pointer-events: none; }
[data-variant="C2"] .r2c-pin-core { position: relative; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; background: var(--cream-hi);
  border: 1.5px solid var(--ink); color: var(--ink); font-size: .68rem; font-weight: 700; line-height: 1; box-shadow: 0 2px 8px rgba(29,56,91,.16);
  transition: background-color .5s var(--ease), color .5s var(--ease), transform .5s var(--eout); }
[data-variant="C2"] .r2c-pin:hover .r2c-pin-core,
[data-variant="C2"] .r2c-pin.is-on .r2c-pin-core { background: var(--ink); color: var(--cream-hi); transform: scale(1.2); }
[data-variant="C2"] .r2c-pin--head { left: var(--head-x); top: var(--head-y); }
[data-variant="C2"] .r2c-pin--face { left: var(--face-x); top: var(--face-y); }
[data-variant="C2"] .r2c-pin--joints { left: var(--joints-x); top: var(--joints-y); }
[data-variant="C2"] .r2c-pin--back { left: var(--back-x); top: var(--back-y); }
[data-variant="C2"] .r2c-pin--hips { left: var(--hips-x); top: var(--hips-y); }
[data-variant="C2"] .r2c-pin--knee1 { left: var(--knee1-x); top: var(--knee1-y); }
[data-variant="C2"] .r2c-pin--knee2 { left: var(--knee2-x); top: var(--knee2-y); }

/* tags in the plate's side margins (left column 3% to 26%, right column 74% to 97%) with a hairline leader to the pin */
[data-variant="C2"] .r2c-tag { position: absolute; z-index: 2; width: 23%; transform: translateY(-50%); font-size: .64rem; font-weight: 700; letter-spacing: .13em;
  text-transform: uppercase; line-height: 1.3; color: var(--ink); transition: color .4s var(--ease), opacity .45s var(--ease); }
[data-variant="C2"] .r2c-tag--l { left: 3%; text-align: right; }
[data-variant="C2"] .r2c-tag--r { left: 74%; text-align: left; }
[data-variant="C2"] .r2c-lead { position: absolute; z-index: 1; height: 1px; background: var(--ink-40); transition: background-color .4s var(--ease), opacity .45s var(--ease); }
[data-variant="C2"] .r2c-lead--l { left: 27%; width: calc(var(--x) - 27% - 14px); transform-origin: 100% 50%; }
[data-variant="C2"] .r2c-lead--r { left: calc(var(--x) + 14px); width: calc(73% - var(--x) - 14px); transform-origin: 0 50%; }
[data-variant="C2"] .r2c-tag--head, [data-variant="C2"] .r2c-lead--head { top: var(--head-y); --x: var(--head-x); }
[data-variant="C2"] .r2c-tag--face, [data-variant="C2"] .r2c-lead--face { top: var(--face-y); --x: var(--face-x); }
[data-variant="C2"] .r2c-tag--joints, [data-variant="C2"] .r2c-lead--joints { top: var(--joints-y); --x: var(--joints-x); }
[data-variant="C2"] .r2c-tag--back, [data-variant="C2"] .r2c-lead--back { top: var(--back-y); --x: var(--back-x); }
[data-variant="C2"] .r2c-tag--hips, [data-variant="C2"] .r2c-lead--hips { top: var(--hips-y); --x: var(--hips-x); }
[data-variant="C2"] .r2c-tag--knees, [data-variant="C2"] .r2c-lead--knees { top: var(--knee2-y); --x: var(--knee2-x); }

/* active region (C2.js toggles .is-on / .has-on / .is-whole) */
[data-variant="C2"] .r2c-map.has-on .r2c-pin:not(.is-on),
[data-variant="C2"] .r2c-map.has-on .r2c-tag:not(.is-on),
[data-variant="C2"] .r2c-map.has-on .r2c-lead:not(.is-on) { opacity: .3; }
[data-variant="C2"] .r2c-tag.is-on { color: var(--bronze-dk); }
[data-variant="C2"] .r2c-lead.is-on { background: var(--bronze); }

/* ---------- the lists: six pinned regions, then the whole-body list ---------- */
[data-variant="C2"] .r2c-lists { min-width: 0; }
[data-variant="C2"] .r2c-groups { columns: 2; column-gap: clamp(1.6rem, 3vw, 2.6rem); }
[data-variant="C2"] .r2c-group { break-inside: avoid; padding: 1.2rem 1.2rem 1.3rem; margin: 0 0 .6rem; border-radius: var(--r-l); transition: background-color .5s var(--ease); }
[data-variant="C2"] .r2c-group.is-on, [data-variant="C2"] .r2c-whole.is-on { background: rgba(207,220,236,.55); }
[data-variant="C2"] .r2c-group-k { display: flex; align-items: center; gap: .7rem; font-size: .72rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-72); }
[data-variant="C2"] .r2c-group-n { flex: none; width: 1.6rem; height: 1.6rem; border-radius: 50%; border: 1.5px solid var(--ink); display: grid; place-items: center;
  font-size: .68rem; letter-spacing: 0; color: var(--ink); }
[data-variant="C2"] .r2c-group-h { margin-top: .85rem; font-size: clamp(1.6rem, 1.3rem + .9vw, 2.1rem); line-height: 1.06; }
[data-variant="C2"] .r2c-group-h a { transition: color .3s var(--ease); }
[data-variant="C2"] .r2c-group-h a:hover { color: var(--teal); }
[data-variant="C2"] .r2c-group-t { margin-top: .6rem; color: var(--ink-72); line-height: 1.7; font-size: .97rem; }
[data-variant="C2"] .r2c-group-list { list-style: none; margin: .55rem 0 0; padding: 0; }
[data-variant="C2"] .r2c-group-list a { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .62rem 0; border-bottom: 1px solid var(--ink-16);
  font-weight: 600; color: var(--ink); transition: color .3s var(--ease); }
[data-variant="C2"] .r2c-group-list a svg { flex: none; width: 18px; height: 18px; color: var(--ink-40); transition: transform .4s var(--eout), color .3s var(--ease); }
[data-variant="C2"] .r2c-group-list a:hover { color: var(--teal); }
[data-variant="C2"] .r2c-group-list a:hover svg { transform: translate(3px, -3px); color: var(--ink); }
[data-variant="C2"] .r2c-whole { margin-top: .8rem; padding: 1.5rem 1.5rem 1.4rem; border-radius: var(--r-l); background: var(--cream); border: 1px solid var(--ink-09);
  transition: background-color .5s var(--ease); }
[data-variant="C2"] .r2c-whole-k::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--bronze); box-shadow: 0 0 0 4px rgba(183,139,91,.22); flex: none; }
[data-variant="C2"] .r2c-whole-list { columns: 2; column-gap: clamp(1.4rem, 2.6vw, 2.2rem); }
[data-variant="C2"] .r2c-whole-list li { break-inside: avoid; }
[data-variant="C2"] .r2c-all { margin-top: clamp(2rem, 3.6vw, 3rem); }

@media (min-width: 1024px) {
  [data-variant="C2"] .r2c-stage { position: sticky; top: calc(var(--li-head-clear) + 1rem); }
}
@media (max-width: 1023.98px) {
  [data-variant="C2"] .r2c-head { grid-template-columns: minmax(0, 1fr); }
  [data-variant="C2"] .r2c-head > p:not(.li-eyebrow) { margin-top: 1.2rem; }
  [data-variant="C2"] .r2c-map { grid-template-columns: minmax(0, 1fr); }
  [data-variant="C2"] .r2c-plate { max-width: 420px; }
}
@media (max-width: 767.98px) {
  [data-variant="C2"] .r2c-plate { max-width: min(100%, 340px); padding: 6px; }
  [data-variant="C2"] .r2c-plate-in { border-radius: calc(var(--r-xl) - 6px); }
  [data-variant="C2"] .r2c-pin { width: 36px; height: 36px; margin: -18px 0 0 -18px; }
  [data-variant="C2"] .r2c-pin-core { width: 21px; height: 21px; font-size: .62rem; }
  [data-variant="C2"] .r2c-pin-ring { width: 22px; height: 22px; margin: -11px 0 0 -11px; }
  [data-variant="C2"] .r2c-tag:not(.r2c-tag--keep) { display: none; }
  [data-variant="C2"] .r2c-lead:not(.r2c-lead--back) { display: none; }
  [data-variant="C2"] .r2c-tag { font-size: .6rem; }
  [data-variant="C2"] .r2c-mock { left: 14px; bottom: 14px; font-size: .56rem; }
  [data-variant="C2"] .r2c-groups { columns: 1; }
  [data-variant="C2"] .r2c-group { padding: 1rem .9rem 1.1rem; margin-inline: -.9rem; scroll-margin-top: calc(var(--li-head-clear) + 1rem); }
  [data-variant="C2"] .r2c-whole { padding: 1.3rem 1.1rem 1.2rem; }
  [data-variant="C2"] .r2c-whole-list { columns: 1; }
}