/* Smart Doctor Pro premium icon placement
   Add after the existing redesign2 CSS so these rules override old icon sizing. */

.device-entry .dev-ico,
.intent-grid .intent-ico,
.repair-menu-icon,
.menu-card img,
.repair-card img {
  display: block;
  width: 76px;
  height: 76px;
  object-fit: contain;
  flex: 0 0 auto;
  filter: drop-shadow(0 10px 18px rgb(48 40 41 / 9%));
}

.device-entry nav a,
.intent-grid a,
.repair-grid a,
.menu-card,
.repair-card {
  position: relative;
}

.device-entry .dev-ico,
.intent-grid .intent-ico {
  margin-bottom: 10px;
}

.repair-grid a {
  min-height: 158px;
}

.repair-menu-icon {
  margin: 0 0 12px;
}

.repair-grid a:hover .repair-menu-icon,
.intent-grid a:hover .intent-ico,
.device-entry nav a:hover .dev-ico,
.menu-card:hover img,
.repair-card:hover img {
  transform: translateY(-2px) scale(1.03);
}

.repair-menu-icon,
.intent-grid .intent-ico,
.device-entry .dev-ico,
.menu-card img,
.repair-card img {
  transition: transform .2s cubic-bezier(.22, 1, .36, 1), filter .2s;
}

.symptom-grid a.symptom-with-icon,
.symptom-grid a:has(.symptom-icon) {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-height: 74px;
  line-height: 1.45;
}

.symptom-grid a.symptom-with-icon::before,
.symptom-grid a:has(.symptom-icon)::before {
  content: none;
  display: none;
}

.symptom-icon {
  display: block;
  width: 44px;
  height: 44px;
  object-fit: contain;
  filter: drop-shadow(0 7px 13px rgb(48 40 41 / 8%));
}

.symptom-grid a:hover .symptom-icon {
  transform: rotate(3deg) scale(1.05);
}

.symptom-icon {
  transition: transform .2s cubic-bezier(.22, 1, .36, 1);
}

@media (max-width: 736px) {
  .device-entry .dev-ico,
  .intent-grid .intent-ico,
  .repair-menu-icon,
  .menu-card img,
  .repair-card img {
    width: 64px;
    height: 64px;
  }

  .repair-grid a {
    min-height: 148px;
  }

  .symptom-grid a.symptom-with-icon,
  .symptom-grid a:has(.symptom-icon) {
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 8px;
    min-height: 68px;
  }

  .symptom-icon {
    width: 40px;
    height: 40px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .repair-menu-icon,
  .intent-grid .intent-ico,
  .device-entry .dev-ico,
  .menu-card img,
  .repair-card img,
  .symptom-icon {
    transition: none;
  }

  .repair-grid a:hover .repair-menu-icon,
  .intent-grid a:hover .intent-ico,
  .device-entry nav a:hover .dev-ico,
  .menu-card:hover img,
  .repair-card:hover img,
  .symptom-grid a:hover .symptom-icon {
    transform: none;
  }
}


/* intent-grid 重なり修正: 絶対配置レイアウト(padding-left:86px)に合わせ76px→52pxへ戻す 2026-06-26 */
.intent-grid .intent-ico{width:52px !important;height:52px !important;}
@media (max-width:736px){.intent-grid .intent-ico{width:44px !important;height:44px !important;}}


/* intent-grid ホバーの縦ずれ修正: アイコンは絶対配置+translateY(-50%)で中央化しているため、ホバーtransformで中央化を保持(下にずれ落ちる不具合) 2026-06-26 */
.intent-grid a:hover .intent-ico{transform:translateY(-50%) scale(1.04) !important}
@media (prefers-reduced-motion:reduce){.intent-grid a:hover .intent-ico{transform:translateY(-50%) !important}}