/* ==========================================================================
   CJ for Secretary of State — Responsive Stylesheet
   Mobile-first. Base in main.css, breakpoints add and override.
   Breakpoints: sm 480 | md 768 | lg 1024 | xl 1200
   ========================================================================== */


/* ==========================================================================
   sm — 480px+
   ========================================================================== */

@media (min-width: 480px) {

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

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

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


/* ==========================================================================
   md — 768px+
   ========================================================================== */

@media (min-width: 768px) {

	/* Typography */
	h1 { font-size: var(--text-5xl); }
	h2 { font-size: var(--text-4xl); }

	.container {
		padding-left: var(--space-8);
		padding-right: var(--space-8);
	}

	/* Hero */
	.hero {
		min-height: 560px;
	}

	.hero__name {
		font-size: clamp(var(--text-5xl), 8vw, 5.5rem);
	}



	/* About */
	.about-section__inner {
		grid-template-columns: 380px 1fr;
	}

	/* Priorities */
	.priorities__grid {
		grid-template-columns: repeat(3, 1fr);
	}

	/* News + Events */
	.news-events__inner {
		grid-template-columns: 1fr 1fr;
	}

	/* CTA */
	.cta-section__inner {
		grid-template-columns: repeat(2, 1fr);
	}

	/* Footer: 2-col */
	.footer-main {
		grid-template-columns: 1fr 1fr;
	}

	/* Footer bottom: row */
	.footer-bottom {
		flex-direction: row;
		justify-content: center;
		gap: var(--space-4);
		text-align: left;
	}

	/* Page content with sidebar */
	.page-content__inner {
		grid-template-columns: 1fr 280px;
		align-items: start;
	}

	/* Post nav */
	.post-navigation {
		grid-template-columns: 1fr 1fr;
	}

	/* Posts grid: 2 columns */
	.posts-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	/* Section header */
	.section-header__title {
		font-size: var(--text-4xl);
	}
}


/* ==========================================================================
   lg — 1024px+
   ========================================================================== */

@media (min-width: 1024px) {

	/* Show desktop nav, hide toggle */
	.nav-primary {
		display: block;
	}

	.nav-toggle {
		display: none;
	}

	.mobile-menu {
		display: none !important;
	}

	/* Show header CTA */
	.site-header__cta {
		display: flex;
		align-items: center;
		gap: var(--space-2);
		flex-shrink: 0;
	}

	/* Hero */
	.hero {
		min-height: 600px;
	}

	/* About: give image a fixed width */
	.about-section__inner {
		grid-template-columns: 400px 1fr;
		gap: var(--space-16);
	}

	/* Footer: 4 columns */
	.footer-main {
		grid-template-columns: 1.6fr 1fr 1fr 1fr;
	}

	/* Page content */
	.page-content__inner {
		grid-template-columns: 1fr 300px;
	}

	/* Posts grid: 3 columns */
	.posts-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}


/* ==========================================================================
   xl — 1200px+
   ========================================================================== */

@media (min-width: 1200px) {

	.hero {
		min-height: 640px;
	}

	.hero__name {
		font-size: 6rem;
	}

	.about-section__inner {
		grid-template-columns: 420px 1fr;
	}
}


/* ==========================================================================
   Print
   ========================================================================== */

@media print {

	.site-header,
	.site-footer,
	.sidebar,
	.nav-toggle,
	.cta-section {
		display: none !important;
	}

	body { font-size: 12pt; color: #000; }
	a { color: #000; text-decoration: underline; }

	.hero {
		min-height: auto;
		padding: 1rem 0;
		background: none;
		color: #000;
	}

	.hero__name,
	.hero__office,
	.hero__tagline {
		color: #000;
	}
}
