/* ================================================================
   KOOSHA PIANO — ROBOTS SECTION MOBILE OVERRIDES
   Only max-width queries — zero impact on desktop.
   Note: robots.css already handles @media (max-width: 768px) for
   grid → 1-col. This file fixes visual sizing and touch behavior.
   ================================================================ */

@media (max-width: 768px) {
  .robots-section {
    padding-block: 4rem 3rem;
  }

  /* Card: stack-friendly borders and spacing */
  /* robots-grid is already 1-col at 768px via robots.css */
  .robot-card {
    gap: 2rem;
    padding: 3rem 1.5rem;
    border-right: none;
    border-bottom: 1px solid var(--clr-border);
  }

  .robot-card:last-child {
    border-bottom: none;
  }

  /* Fix visual size: 29.9vw at 375px = only 112px — too small */
  .robot-visual-float {
    width: min(75vw, 280px);
  }

  .robot-visual {
    height: min(65vw, 340px);
  }

  /* Disable 3D tilt on touch devices — no hover support */
  .robot-visual {
    transform: none !important;
    transition: none !important;
  }

  /* Float animation: smaller amplitude on mobile */
  @keyframes robot-float {
    0%, 100% { transform: translateY(0); }
    50%       { transform: translateY(-6px); }
  }

  .robots-section .section-title-lg {
    margin-bottom: 2.5rem;
  }
}

@media (max-width: 480px) {
  .robot-card {
    padding: 2.5rem 1.25rem;
    gap: 1.5rem;
  }

  .robot-visual-float {
    width: min(70vw, 240px);
  }

  .robot-visual {
    height: min(60vw, 300px);
  }

  .robot-title {
    font-size: 1.25rem;
  }

  .robot-desc {
    font-size: 0.875rem;
  }
}