/* ==========================================================================
   Jighyasha Creator — Responsive Rules
   Tested against: 360, 390, 430 (mobile), 768 (tablet), 1024 (laptop),
   1366 / 1920 (desktop). Desktop styles are the default in main.css;
   this file narrows down.
   ========================================================================== */

/* ----- Laptop / small desktop (<=1366px) ----- */
@media (max-width: 1366px) {
	:root { --container-width: 1120px; }
}

/* ----- Tablet (<=1024px) ----- */
@media (max-width: 1024px) {
	.hero__inner,
	.about-intro__inner,
	.page-about__hero { grid-template-columns: 1fr; }
	.hero__media { order: -1; max-width: 420px; margin: 0 auto; }
	.about-intro__media { max-width: 360px; margin: 0 auto; }
	.page-about__portrait { max-width: 360px; margin: 0 auto; }

	.page-contact__inner { grid-template-columns: 1fr; }
	.page-contact__sidebar { border-left: none; border-top: 1px solid var(--color-border); padding-left: 0; padding-top: var(--space-lg); }

	.collab-grid--full .collab-card--detailed { grid-template-columns: 1fr; }

	.gallery-grid { columns: 3 220px; }
	.gallery-grid--masonry { columns: 3 220px; }

	.site-footer__inner { grid-template-columns: 1fr 1fr; }
}

/* ----- Tablet / large mobile (<=768px) ----- */
@media (max-width: 768px) {
	section { padding: var(--space-lg) 0; }

	.primary-nav { display: none; }
	.site-header__social.site-header__social { display: none; }
	.menu-toggle { display: inline-flex; }

	.hero { padding: var(--space-lg) 0 var(--space-xl); }
	.hero__heading { font-size: 40px; }
	.hero__actions .btn { flex: 1; justify-content: center; }

	.social-stats__grid { grid-template-columns: repeat(2, 1fr); gap: var(--space-md); }

	.video-grid, .collab-grid, .journal-grid { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }

	.gallery-grid { columns: 2 180px; }
	.gallery-grid--masonry { columns: 2 180px; }

	.journal-controls { flex-direction: column; align-items: stretch; }
	.journal-search input { min-width: 0; }

	.site-footer__inner { grid-template-columns: 1fr; text-align: center; }
	.site-footer__meta { align-items: center; }
	.footer-socials__inner { flex-direction: column; gap: 10px; }

	.media-kit__header { flex-direction: column; text-align: center; }
	.media-kit__sheet { padding: var(--space-lg); }

	.journey-timeline { padding-left: 24px; }
}

/* ----- Mobile (<=430px) ----- */
@media (max-width: 430px) {
	.container { padding: 0 18px; }
	.hero__heading { font-size: 34px; }
	.hero__subtext { font-size: 16px; }
	.section-heading { flex-direction: column; align-items: flex-start; gap: 10px; }
	.social-stats__grid { grid-template-columns: repeat(2, 1fr); }
	.video-grid, .collab-grid, .journal-grid { grid-template-columns: 1fr; }
	.gallery-grid, .gallery-grid--masonry { columns: 1; }
	.error-404__code { font-size: 70px; }
	.page-header h1 { font-size: 32px; }
	.media-kit__stat-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ----- Very small mobile (<=390px / <=360px): spacing safety net ----- */
@media (max-width: 390px) {
	.btn { padding: 13px 24px; font-size: 13px; }
	.hero__actions { flex-direction: column; }
	.contact-cta__actions { flex-direction: column; align-items: stretch; }
}

/* ----- Prevent any horizontal overflow at the smallest sizes ----- */
@media (max-width: 360px) {
	.hero__heading { font-size: 30px; }
	html, body { overflow-x: hidden; }
}