/* 1.09 — bayi paneli kategori kartları. Mevcut akış ve veri alanları değişmez. */
.category-card {
  position: relative;
  isolation: isolate;
  min-height: 134px;
  gap: 8px;
  border: 1px solid #d8e5f2;
  background: linear-gradient(160deg, #fff 0%, #f7fbff 62%, #edf5ff 100%);
  box-shadow: 0 8px 0 -5px #bfd2e7, 0 12px 22px -16px rgba(17, 62, 112, .5), inset 0 1px 0 #fff;
  transform: translateY(0);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease,
              background .22s ease, color .22s ease;
}
.category-card:not(:disabled) { cursor: pointer; }
.category-card:hover:not(:disabled),
.category-card:focus-visible {
  transform: translateY(-5px);
  border-color: #77b5f3;
  background: linear-gradient(155deg, #fff, #e8f4ff);
  box-shadow: 0 12px 0 -7px #81b1e2, 0 24px 30px -19px rgba(11, 77, 153, .55), inset 0 1px 0 #fff;
  color: #0757a9;
}
.category-card:active:not(:disabled) {
  transform: translateY(-1px);
  box-shadow: 0 4px 0 -2px #81b1e2, 0 7px 16px -12px rgba(11, 77, 153, .5);
}
.category-card .category-symbol {
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  border-radius: 16px;
  background: radial-gradient(circle at 36% 23%, #fff, #e9f5ff 72%, #dbeaff);
  box-shadow: inset 0 1px 1px #fff, inset 0 -2px 5px rgba(25, 82, 154, .09), 0 5px 10px rgba(24, 98, 179, .12);
  transition: background-color .22s ease, transform .22s ease;
}
.category-card:hover:not(:disabled) .category-symbol,
.category-card:focus-visible .category-symbol {
  background: radial-gradient(circle at 36% 23%, #fff, #d8edff 80%);
  transform: translateY(-2px) scale(1.045);
}
.category-card .part-visual { width: 58px; height: 58px; overflow: visible; filter: drop-shadow(0 3px 2px rgba(18, 64, 120, .16)); }
.part-visual .part-shadow { fill: none; stroke: #bad2e8; stroke-width: 3; opacity: .55; }
.part-visual .part-side { fill: #7198c8; stroke: #416899; stroke-width: 1.3; }
.part-visual .part-face { fill: #d8ebff; stroke: #4e80b9; stroke-width: 1.5; }
.part-visual .part-detail { fill: #8dbde9; stroke: #4e80b9; stroke-width: 1; }
.part-visual .part-lens { fill: #284c7d; stroke: #afd5f8; stroke-width: 1.4; }
.part-visual .part-spark { fill: #f7ffff; }
.part-visual .part-highlight { fill: none; stroke: #fff; stroke-width: 1.5; stroke-linecap: round; opacity: .82; }
.part-visual .part-terminal { fill: #abc4d9; stroke: #567eab; stroke-width: 1.3; }
.part-visual .part-glyph { fill: #2794d6; }
.part-visual .part-screen { fill: #2375c6; stroke: #164b88; stroke-width: 1.4; }
.part-visual .part-screen-glow { fill: #71c9f0; opacity: .75; }
.part-visual .part-frame { fill: #b3d2eb; stroke: #4676a6; stroke-width: 1; }
.part-visual .part-buttons { fill: none; stroke: #426ca0; stroke-width: 2; }
.part-visual .part-flex-side { fill: #9a7e4c; }
.part-visual .part-flex { fill: #dfbb72; stroke: #9f7b42; stroke-width: 1.2; }
.part-visual .part-pins { fill: none; stroke: #8e6f39; stroke-width: 1; }
.category-card:focus-visible { outline: 3px solid #1c75d4; outline-offset: 2px; }
.technical-button small { display: none; }
.step-heading .back-button { margin-left: auto; white-space: nowrap; }
.step-heading .back-button + .text-button { margin-left: 12px; }
.results-actions { display: flex; align-items: center; justify-content: flex-end; gap: 14px; }
.results-actions .text-button { margin-left: 0; cursor: pointer; }
@media (max-width: 620px) {
  .step-heading { flex-wrap: wrap; }
  .step-heading .back-button { order: 3; margin-left: 48px; }
  .results-header { align-items: flex-start; gap: 10px; }
  .results-actions { flex-direction: column-reverse; align-items: flex-end; gap: 8px; }
}
@media (hover: none) {
  .category-card:hover:not(:disabled) { transform: none; }
  .category-card:hover:not(:disabled) .category-symbol { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .category-card, .category-card .category-symbol { transition: none; }
}
