/* ══════════════════════════════════════════
   LINEIGE — RESPONSIVE (mobile-first breakpoints)
══════════════════════════════════════════ */

/* ── Laptops & Tablets (≤ 1150px) ── */
@media (max-width: 1300px) {

  /* Nav — hide desktop links, show burger to prevent overlap */
  .nav-links {
    display: none;
  }

  .nav-right .btn-pri {
    display: none;
  }

  .nav-burger {
    display: flex;
  }

  .nav-drawer {
    display: block;
  }
}

/* ── Tablet & below (≤ 1024px) ── */
@media (max-width: 1024px) {
  :root {
    --section-pad-x: 2.5rem;
    --section-pad-y: 5.5rem;
  }

  .skills-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* ── Mobile (≤ 768px) ── */
@media (max-width: 768px) {
  :root {
    --section-pad-x: 1.4rem;
    --section-pad-y: 4rem;
  }

  nav {
    padding: 0 1.4rem;
  }

  /* Hero */
  #hero {
    padding: 8rem 1.4rem 4rem;
  }

  .h-name {
    font-size: clamp(2.5rem, 12vw, 4.5rem);
  }

  .h-term-body {
    font-size: 0.66rem;
  }

  .h-scroll {
    display: none;
  }

  /* Grids → single column */
  .about-grid,
  .proj-grid,
  .skills-grid,
  .edu-grid,
  .awards-grid,
  .contact-wrap {
    grid-template-columns: 1fr;
    gap: 1.4rem;
  }

  /* Span overrides */
  .proj-card.wide,
  .edu-card.main {
    grid-column: span 1;
  }

  /* Timeline */
  .tl {
    padding-left: 2rem;
  }

  .tl-dot {
    left: -2.3rem;
  }

  /* Footer */
  footer {
    flex-direction: column;
    gap: 0.6rem;
    text-align: center;
    padding: 1.4rem;
  }

  /* Disable custom cursor on touch devices */
  #cursor {
    display: none;
  }

  * {
    cursor: auto !important;
  }
}

/* ── Small phones (≤ 400px) ── */
@media (max-width: 400px) {
  .h-name {
    font-size: clamp(2rem, 10vw, 3rem);
  }

  .h-btns {
    flex-direction: column;
  }

  .h-btns .btn-pri,
  .h-btns .btn-out {
    width: 100%;
    justify-content: center;
  }
}

/* ── Reduced motion ── */
@media (prefers-reduced-motion: reduce) {

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

  .reveal,
  .reveal-left,
  .reveal-right {
    opacity: 1 !important;
    transform: none !important;
  }
}