/* ==========================================================================
   VidyaTech — responsive layouts (mobile-first: base styles are in style.css)
   Breakpoints: 480 · 640 · 768 · 1024 · 1280
   ========================================================================== */

/* Very small phones (≤ 359px, e.g. 320px) */
@media (max-width: 359px) {
  .brand__sub { display: none; }
  .brand img { width: 38px; height: 39px; }
  .brand__name { font-size: 1.15rem; }
  .btn { padding-inline: 16px; }
  .spotlight__facts { grid-template-columns: 1fr; }
  .skill-grid { grid-template-columns: 1fr; }
  .mobile-cta .btn { font-size: 0.8125rem; gap: 6px; }
}

/* Phones: full-width buttons, compact cards, no caption pills over thumbnails */
@media (max-width: 479px) {
  .btn-row > .btn { flex: 1 1 100%; }
  .course-card .chips { display: none; }
  .meta-list { margin-bottom: var(--sp-5); }
  .offer { flex-wrap: wrap; }
  .pill { border-radius: 16px; line-height: 1.4; }
  .slider__caption { display: none; }
  .offer__cta { width: 100%; justify-content: center; }
}

@media (max-width: 639px) {
  .gallery-item .photo__caption { display: none; }
  .hero__float { display: none; }
  .hero__blob { filter: blur(50px); }
}

/* Floating icons: only where there is free space around the content */
@media (min-width: 640px) and (max-width: 1023px) {
  .hero__float--1, .hero__float--3 { display: none; }
}
@media (min-width: 1024px) and (max-width: 1439px) {
  .hero__float--2, .hero__float--3, .hero__float--4 { display: none; }
}

@media (min-width: 480px) {
  .container { padding-inline: 20px; }
  .gallery-grid { gap: var(--sp-4); }
}

@media (min-width: 640px) {
  .course-grid,
  .grid--2,
  .grid--3,
  .grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .highlights__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .placement__steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gallery-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .form-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .form-grid .field--full { grid-column: 1 / -1; }
  .skill-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .footer__main { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lightbox { padding: 20px 24px; }
}

@media (min-width: 768px) {
  .container { padding-inline: 24px; }
  .check-list--grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hero__offer { margin-inline: 28px; }
  .person-card--wide { flex-direction: row; align-items: flex-start; gap: var(--sp-6); }
  .person-card--wide .avatar { width: 120px; height: 120px; font-size: 2.5rem; flex-shrink: 0; }
  .lightbox__nav--prev { left: 8px; }
  .lightbox__nav--next { right: 8px; }
  .lightbox__btn { width: 56px; height: 56px; }
}

/* Desktop header & multi-column layouts */
@media (min-width: 1024px) {
  :root { --header-h: 76px; }

  body { padding-bottom: 0; }
  .mobile-cta { display: none; }
  .float-wa { bottom: 24px; right: 24px; width: 60px; height: 60px; }

  .topbar { display: block; }
  .nav { display: block; }
  .menu-toggle { display: none; }
  .mobile-nav { display: none; }
  .header__cta { display: inline-flex; }
  .header__call { display: inline-flex; }

  .hero__grid { grid-template-columns: 1.25fr 1fr; gap: var(--sp-8); }
  .highlights__grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .highlight { padding: var(--sp-5); }

  .split { grid-template-columns: 1fr 1fr; gap: var(--sp-9); }
  .split--wide-left { grid-template-columns: 1.2fr 1fr; }
  .split--wide-right { grid-template-columns: 1fr 1.2fr; }

  .course-grid,
  .grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .steps { grid-template-columns: repeat(5, minmax(0, 1fr)); }

  .placement__grid { grid-template-columns: 1fr 1.1fr; gap: var(--sp-9); }
  .spotlight { grid-template-columns: 1fr 1fr; gap: var(--sp-8); align-items: center; }

  .gallery-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .gallery-grid--feature .gallery-item:first-child { grid-column: span 2; grid-row: span 2; }
  .gallery-grid--feature .gallery-item:first-child button { aspect-ratio: auto; height: 100%; }

  .course-hero__grid { grid-template-columns: 1.4fr 1fr; gap: var(--sp-8); }
  .course-layout { grid-template-columns: 240px minmax(0, 1fr); gap: var(--sp-8); align-items: start; }
  .toc { display: block; }

  .footer__main { grid-template-columns: 1.4fr 1fr 1fr 1.3fr; }
  .contact-layout { grid-template-columns: 1fr 1.15fr; align-items: start; }
}

@media (min-width: 1280px) {
  .container { padding-inline: 32px; }
  .nav__link { padding-inline: 14px; }
}

/* Tighten nav between 1024 and 1180 so items never wrap */
@media (min-width: 1024px) and (max-width: 1180px) {
  .nav__link { padding-inline: 8px; font-size: 0.875rem; }
  .header__call span { display: none; }
  .brand__sub { display: none; }
  .hero__offer .offer__text strong { font-size: var(--fs-sm); }
}