/* ───────────────────────────────────────────────────────────────
   DeftBid — Marketing Landing Page ("Ink" direction)
   A4 · Icon set — 24×24 stroke, ~2px, round caps/joins.

   The paths live in assets/icons.svg as <symbol>s that set no color/stroke, so
   these two are effectively props on .icon:
     • color        → CSS `color` (icons stroke with currentColor)
     • stroke width  → --icon-stroke  (default 2)
   Usage:
     <svg class="icon" aria-hidden="true"><use href="assets/icons.svg#i-bolt"/></svg>
   Size with a modifier (.icon--18) or set width/height directly. Give an
   accessible name with role="img" + <title>, or aria-hidden when decorative.
   ─────────────────────────────────────────────────────────────── */

.icon {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  display: inline-block;
  vertical-align: middle;
  fill: none;
  stroke: currentColor;
  stroke-width: var(--icon-stroke, 2);
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Size modifiers (stroke stays visually consistent via slight scaling). */
.icon--16 { width: 16px; height: 16px; --icon-stroke: 2.1; }
.icon--18 { width: 18px; height: 18px; --icon-stroke: 2; }
.icon--20 { width: 20px; height: 20px; --icon-stroke: 2; }
.icon--28 { width: 28px; height: 28px; --icon-stroke: 1.9; }
.icon--32 { width: 32px; height: 32px; --icon-stroke: 1.8; }
.icon--40 { width: 40px; height: 40px; --icon-stroke: 1.6; }