/* V9 FORM — the three symbols become the site's sculptural vocabulary: bigger, bleeding, echoed. */
.wh-forms { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin: 0 0 26px; }
.wf { display: grid; gap: 10px; color: var(--ink); }
.wf svg { width: 100%; aspect-ratio: 1; fill: none; stroke: currentColor; stroke-width: 1.4; overflow: visible; opacity: .9; transition: color .4s, transform .6s var(--ease); }
.wf svg .fl { fill: transparent; stroke: none; transition: fill .5s; }
.wf svg circle, .wf svg rect, .wf svg path { vector-effect: non-scaling-stroke; }
.wf:hover svg, .wf:focus-visible svg { color: var(--c); transform: translateY(-4px); } .wf:hover svg .fl, .wf:focus-visible svg .fl { fill: var(--c); }
.wf .lb { font-size: 10.5px; color: var(--mute); letter-spacing: .1em; }
@media (min-width: 900px) {
  .wh-forms { gap: 24px; margin-bottom: 36px; }
  .wk-aurore .ax-fig { left: calc(var(--gut) - 72px); width: min(52vw, 740px); top: 12px; }
  .wk-aurore .ax-no, .wk-aurore .ax-note { left: calc(var(--gut) - 72px + min(52vw, 740px) + 6px); } .wk-aurore .ax-note { width: min(17vw, 244px); }
  .wk-aurore .ax-ring { stroke-width: 1.1; }
  .wk-clarte .cx-fig-wrap { left: calc(100% - var(--ph) - 262px); width: 214px; bottom: 112px; }
  .wk-hangyeol .hx-frame { width: min(54vw, calc(100% - 8px)); right: -5vw; }
}
.hx-e { position: absolute; left: 50%; top: 50%; border: 1px solid var(--w-accent); transform: translate(-50%, -50%) rotate(45deg); pointer-events: none; }
.hx-e.e1 { width: 52%; height: 52%; opacity: .55; } .hx-e.e2 { width: 63%; height: 63%; opacity: .3; }
.hx-diamond { inset: 13%; }
@media (prefers-reduced-motion: reduce) { .wf svg { transition: none; } }