/* ============================================================
   sanjayajmera.com — Responsive layer
   Breakpoints: 1280 · 1080 · 900 · 720 · 560 · 380
   ============================================================ */

/* ---------- Large desktop refinements ---------- */
@media (min-width: 1600px) {
  :root { --gutter: 4rem; }
}

/* ---------- Laptop ---------- */
@media (max-width: 1280px) {
  .brand__role { display: none; }
  .nav-list { gap: clamp(0.85rem, 0.1rem + 1.2vw, 1.6rem); }
}

/* ---------- Small laptop / large tablet: switch to drawer nav ---------- */
@media (max-width: 1080px) {
  .kit { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nav-list { display: none; }
  .nav-toggle { display: inline-flex; }

  .hero__grid { grid-template-columns: minmax(0, 1fr); gap: 2.5rem; align-items: start; }
  .hero__aside { max-width: 460px; }
  .hero__name .l2 { padding-left: 3rem; }

  .split, .split--reverse, .split--even { grid-template-columns: minmax(0, 1fr); }

  .entry { grid-template-columns: 3.25rem minmax(0, 1fr); }
  .entry__body { grid-column: 2; }

  .principle { grid-template-columns: minmax(0, 1fr); }
  .principle__head { position: static; }

  .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-brand { grid-column: 1 / -1; }
}

/* ---------- Tablet ---------- */
@media (max-width: 900px) {
  .figure-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tl-item { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
  .tl-item__year { font-size: var(--step-2); }
  .tl-item__year small { display: inline-block; margin-top: 0; margin-left: 0.9rem; }
  .tl-item--role { background: linear-gradient(to right, var(--bg-secondary), transparent 96%); padding-left: 1rem; margin-left: -1rem; }

  .domain { grid-template-columns: minmax(0, 1fr); gap: 0.9rem; }
  .facts > div { grid-template-columns: minmax(0, 1fr); gap: 0.35rem; }
  .contact-line { grid-template-columns: minmax(0, 1fr); gap: 0.5rem; align-items: start; }
  .hero__role { grid-template-columns: minmax(0, 1fr); gap: 0.5rem; }
}

/* ---------- Large phone / small tablet ---------- */
@media (max-width: 720px) {
  :root { --nav-h: 66px; }

  .hero__name .l2 { padding-left: 1.5rem; }
  .hero__index .spacer { display: none; }
  .hero__index { flex-wrap: wrap; gap: 0.6rem 1rem; }

  .entry { grid-template-columns: minmax(0, 1fr); gap: 0.85rem; }
  .entry__num { padding-top: 0; }
  .entry__body { grid-column: 1; }

  .pageturn { grid-template-columns: minmax(0, 1fr); }
  .pageturn a:last-child { text-align: left; }

  .footer-grid { grid-template-columns: minmax(0, 1fr); }
  .footer-base { flex-direction: column; align-items: flex-start; }

  .kit { grid-template-columns: minmax(0, 1fr); }
  .statement { max-width: none; }
}

/* ---------- Phone ---------- */
@media (max-width: 560px) {
  :root { --measure: 100%; }

  .masthead__row { flex-direction: column; align-items: flex-start; gap: 0.75rem; }
  .plate { padding: 0.5rem; }
  .plate__caption { flex-direction: column; gap: 0.25rem; }
  .figure-row { grid-template-columns: minmax(0, 1fr); }
  .socials { gap: 0.5rem; }
  .social { width: 44px; height: 44px; }
  .contact-line a, .contact-line strong { font-size: var(--step-1); }
}

/* ---------- Very small phone (320–380) ---------- */
@media (max-width: 380px) {
  :root { --gutter: 1.05rem; }
  .brand__name { font-size: 0.95rem; }
  .brand__mark { width: 27px; height: 27px; }
  .nav-toggle span:not(.nav-toggle__bars) { display: none; }
  .hero__name .l2 { padding-left: 0.75rem; }
  .hero__facts div { flex-direction: column; gap: 0.15rem; }
  .hero__facts dd { text-align: left; }
}

/* ---------- Short landscape phones ---------- */
@media (max-height: 480px) and (orientation: landscape) {
  .nav-drawer a { font-size: 1.25rem; padding: 0.7rem 0; }
  .nav-drawer__foot { padding-top: 1.5rem; }
}

/* ---------- Pointer-coarse tap targets ---------- */
@media (pointer: coarse) {
  .nav-drawer a { padding-block: 1.15rem; }
  .footer-nav a { padding-block: 0.35rem; }
}