/**
 * DSICC Theme — Responsive Styles
 *
 * Breakpoints:
 *   Mobile  — default (styles in main.css apply first)
 *   Tablet  — min-width: 768px
 *   Desktop — min-width: 1024px
 *
 * Mobile-first approach: base styles target small screens,
 * then enhance for larger viewports below.
 *
 * @package DSICC
 */

/* ==========================================================================
   Mobile (default — up to 767px)
   ========================================================================== */

@media (max-width: 767px) {
	.hero__bg {
		background-position: center center;
	}

	.hero__recent {
		display: none;
	}

	.hero__social {
		right: 1rem;
		bottom: 1rem;
	}

	.hero__actions .btn {
		min-width: 130px;
		padding: 0.7rem 1.4rem;
		font-size: 0.875rem;
	}

	.about-section {
		padding: 3rem 0;
	}

	.about-section__content h2:not(:first-child) {
		margin-top: 2.5rem;
	}

	.highlights-section {
		padding: 3rem 0;
	}

	.highlights-section__title {
		margin-bottom: 2rem;
	}

	.sponsors-section {
		padding: 3rem 0;
	}

	.sponsors-section__header {
		margin-bottom: 2rem;
	}

	.committee-section {
		padding: 3rem 0;
	}

	.committee-section__title {
		margin-bottom: 2rem;
	}

	.about-us-section {
		min-height: 380px;
	}

	.about-us-section__image {
		object-position: 70% center;
	}

	.page-hero {
		min-height: 200px;
	}

	.page-content {
		padding-top: 2rem;
		padding-bottom: 2.5rem;
	}

	.committee-page-grid {
		padding: 2.5rem 0 3rem;
	}

	.committee-page-grid .committee-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 1.5rem 1rem;
	}

	.news-section {
		padding: 2.5rem 0 3rem;
	}
}

/* ==========================================================================
   Tablet (768px and up)
   ========================================================================== */

@media (min-width: 768px) {
	:root {
		--header-height: 88px;
	}

	.container {
		padding-left: 1.5rem;
		padding-right: 1.5rem;
	}

	.site-branding .custom-logo,
	.site-branding .custom-logo-link img {
		max-height: 64px;
	}

	.hero__inner {
		padding-top: calc(var(--header-height) + 2rem);
		padding-bottom: 5rem;
	}

	.hero__content {
		max-width: 600px;
	}

	.hero__description {
		font-size: 1rem;
		max-width: 520px;
	}

	.hero__recent {
		max-width: 260px;
	}

	.hero__social {
		right: 1.5rem;
		bottom: 2rem;
		gap: 1rem;
	}

	.about-section {
		padding: 5rem 0;
	}

	.about-section__content h2 {
		font-size: 1.5rem;
	}

	.about-section__content p {
		font-size: 1rem;
	}

	.about-section__content h2:not(:first-child) {
		margin-top: 3.5rem;
	}

	.highlights-section {
		padding: 5rem 0;
	}

	.highlights-section__title {
		font-size: 1.75rem;
		margin-bottom: 2.75rem;
	}

	.highlights-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 1.25rem;
	}

	.highlight-card:last-child {
		grid-column: 1 / -1;
		max-width: 280px;
		justify-self: center;
		width: 100%;
	}

	.vision-mission__content {
		padding: 4rem 2.5rem;
	}

	.vision-mission__block + .vision-mission__block {
		margin-top: 3rem;
	}

	.vision-mission__title {
		font-size: 1.5rem;
	}

	.vision-mission__text {
		font-size: 1rem;
	}

	.vision-mission__media,
	.vision-mission__media img {
		min-height: 360px;
	}

	.sponsors-section {
		padding: 5rem 0;
	}

	.sponsors-section__title {
		font-size: 1.75rem;
	}

	.sponsors-section__intro {
		font-size: 1rem;
	}

	.sponsors-section__header {
		margin-bottom: 2.75rem;
	}

	.sponsors-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 1.25rem;
	}

	.committee-section {
		padding: 5rem 0;
	}

	.committee-section__title {
		font-size: 1.75rem;
		margin-bottom: 2.75rem;
	}

	.committee-card {
		flex: 0 0 calc((100% - 2.5rem) / 3);
		max-width: none;
	}

	.committee-progress {
		max-width: 360px;
		margin-top: 2.25rem;
	}

	.about-us-section {
		min-height: 480px;
	}

	.about-us-section__inner {
		padding-top: 4.5rem;
		padding-bottom: 4.5rem;
	}

	.about-us-section__content {
		max-width: 560px;
	}

	.about-us-section__title {
		margin-bottom: 2rem;
	}

	.site-footer__brand {
		padding: 4rem 0 2.25rem;
	}

	.site-footer__bottom-inner {
		flex-direction: row;
		align-items: center;
	}

	.site-footer__copyright {
		text-align: left;
	}

	.page-hero {
		min-height: 260px;
	}

	.page-hero__title-text {
		padding: 0.75rem 1.75rem;
	}

	.page-content {
		padding-top: 3rem;
		padding-bottom: 3.5rem;
	}

	.committee-page-grid {
		padding: 3rem 0 3.5rem;
	}

	.committee-page-grid__title {
		font-size: 1.75rem;
		margin-bottom: 2.75rem;
	}

	.committee-page-grid .committee-grid {
		grid-template-columns: repeat(3, 1fr);
		gap: 1.75rem 1.25rem;
	}

	.news-section {
		padding: 3rem 0 3.5rem;
	}

	.news-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 1.5rem;
	}

	.entry-title {
		font-size: 2rem;
	}

	.page-title {
		font-size: 2.25rem;
	}
}

/* ==========================================================================
   Desktop (1024px and up)
   ========================================================================== */

@media (min-width: 1024px) {
	:root {
		--header-height: 96px;
		--container-max: 1280px;
	}

	.container {
		padding-left: 2rem;
		padding-right: 2rem;
	}

	/* Desktop: inline navigation, hide toggle */
	.menu-toggle {
		display: none;
	}

	.main-navigation {
		position: static;
		width: auto;
		height: auto;
		padding: 0;
		background-color: transparent;
		transform: none;
		overflow: visible;
	}

	.main-navigation .menu {
		flex-direction: row;
		flex-wrap: wrap;
		align-items: center;
		justify-content: flex-end;
		gap: 0.25rem 1.25rem;
	}

	.main-navigation a {
		padding: 0.35rem 0;
		font-size: 0.875rem;
		font-weight: 500;
		white-space: nowrap;
	}

	.site-branding .custom-logo,
	.site-branding .custom-logo-link img {
		max-height: 72px;
	}

	/* Hero: two-column layout */
	.hero__inner {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		gap: 2rem;
		padding-top: calc(var(--header-height) + 1rem);
		padding-bottom: 4rem;
		min-height: 100vh;
	}

	.hero__content {
		flex: 1 1 auto;
		max-width: 580px;
	}

	.hero__title {
		margin-bottom: 1rem;
	}

	.hero__subtitle {
		margin-bottom: 1.25rem;
	}

	.hero__description {
		margin-bottom: 2rem;
	}

	.hero__recent {
		flex: 0 0 auto;
		align-self: center;
		margin-top: 2rem;
		max-width: 280px;
	}

	.hero__bg {
		background-position: center center;
	}

	.hero__social {
		right: 2rem;
		bottom: 2.5rem;
	}

	.about-section {
		padding: 6rem 0;
	}

	.about-section__content h2 {
		font-size: 1.625rem;
	}

	.about-section__content h2:not(:first-child) {
		margin-top: 4rem;
	}

	.highlights-section {
		padding: 5.5rem 0;
	}

	.highlights-section__title {
		font-size: 1.875rem;
		margin-bottom: 3rem;
	}

	.highlights-grid {
		grid-template-columns: repeat(5, 1fr);
		gap: 1.25rem;
	}

	.highlight-card:last-child {
		grid-column: auto;
		max-width: none;
	}

	.highlight-card {
		padding: 1.75rem 0.75rem 1.5rem;
	}

	.highlight-card__value {
		font-size: 1.375rem;
	}

	.vision-mission__grid {
		grid-template-columns: 1fr 1fr;
		min-height: 520px;
	}

	.vision-mission__content {
		padding: 4rem 4rem 4rem 3rem;
		justify-content: flex-end;
	}

	.vision-mission__inner {
		margin-right: 0;
		max-width: 460px;
	}

	.vision-mission__block + .vision-mission__block {
		margin-top: 3.5rem;
	}

	.vision-mission__title {
		font-size: 1.625rem;
	}

	.vision-mission__media {
		min-height: 100%;
	}

	.vision-mission__media img {
		position: absolute;
		inset: 0;
		min-height: 100%;
	}

	.sponsors-section {
		padding: 5.5rem 0;
	}

	.sponsors-section__title {
		font-size: 1.875rem;
	}

	.sponsors-section__header {
		margin-bottom: 3rem;
	}

	.sponsors-grid {
		grid-template-columns: repeat(4, 1fr);
		gap: 1.5rem;
	}

	.sponsor-card {
		min-height: 130px;
	}

	.committee-section {
		padding: 5.5rem 0;
	}

	.committee-section__title {
		font-size: 1.875rem;
		margin-bottom: 3rem;
	}

	.committee-carousel {
		gap: 1.5rem;
	}

	.committee-card {
		flex: 0 0 calc((100% - 6rem) / 5);
	}

	.committee-card__name {
		font-size: 1.0625rem;
	}

	.committee-progress {
		max-width: 420px;
		margin-top: 2.5rem;
	}

	.about-us-section {
		min-height: 560px;
	}

	.about-us-section__image {
		object-position: center right;
	}

	.about-us-section__inner {
		padding-top: 5.5rem;
		padding-bottom: 5.5rem;
	}

	.about-us-section__content {
		max-width: 580px;
	}

	.entry-title {
		font-size: 2.25rem;
	}

	.page-title {
		font-size: 2.5rem;
	}

	.site-footer__brand {
		padding: 4.5rem 0 2.5rem;
	}

	.site-footer__logo {
		max-height: 90px;
	}

	.footer-navigation .menu,
	.footer-navigation .footer-menu {
		gap: 0.5rem 1.75rem;
	}

	.footer-navigation a {
		font-size: 0.9375rem;
	}

	.site-footer__bottom-inner {
		flex-direction: row;
		align-items: center;
	}

	.site-footer__copyright {
		text-align: left;
	}

	.page-hero {
		min-height: 300px;
	}

	.page-content {
		padding-top: 3.5rem;
		padding-bottom: 4rem;
	}

	.committee-page-grid {
		padding: 3.5rem 0 4.5rem;
	}

	.committee-page-grid__title {
		font-size: 1.875rem;
		margin-bottom: 3rem;
	}

	.committee-page-grid .committee-grid {
		grid-template-columns: repeat(5, minmax(0, 1fr));
		gap: 1.75rem 1rem;
	}

	.committee-page-grid .committee-card--grid {
		flex: none;
		max-width: none;
		width: auto;
	}

	.news-section {
		padding: 3.5rem 0 4.5rem;
	}

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

	.news-card__body {
		padding: 1.5rem 1.5rem 1.75rem;
	}

	.news-card__title {
		font-size: 1.375rem;
	}
}

/* ==========================================================================
   Large Desktop (1280px and up)
   ========================================================================== */

@media (min-width: 1280px) {
	:root {
		--container-max: 1320px;
	}

	.main-navigation .menu {
		gap: 0.25rem 1.75rem;
	}

	.main-navigation a {
		font-size: 0.9375rem;
	}

	.hero__content {
		max-width: 640px;
	}

	.hero__recent {
		max-width: 300px;
		margin-right: 1rem;
	}

	.highlight-card__value {
		font-size: 1.5rem;
	}

	.highlight-card {
		padding: 2rem 1rem 1.75rem;
	}

	.vision-mission__grid {
		min-height: 560px;
	}

	.vision-mission__content {
		padding: 5rem 5rem 5rem 4rem;
	}

	.vision-mission__inner {
		max-width: 500px;
	}

	.vision-mission__block + .vision-mission__block {
		margin-top: 4rem;
	}

	.about-us-section {
		min-height: 600px;
	}

	.about-us-section__content {
		max-width: 620px;
	}
}