/**
 * Wake Forest Magazine — mobile stylesheet.
 *
 * Loads after the section stylesheets and layers phone-width rules
 * (≤560px, plus a ≤400px tier for small phones) on top of the 900px
 * tablet rules that already live in each section's own file. Only
 * overrides — no new components.
 */

@media (max-width: 560px) {

	/* ---- Rhythm: tighten the big vertical gaps ---- */
	.wfm-band {
		margin-top: 56px;
		padding: 26px 22px;
		flex-direction: column;
		align-items: flex-start;
		gap: 20px;
	}

	.wfm-band__actions {
		width: 100%;
		display: flex;
		flex-direction: column;
		gap: 10px;
	}

	.wfm-band__btn {
		display: block;
		width: 100%;
		text-align: center;
	}

	.wfm-footer {
		margin-top: 56px;
	}

	/* ---- Pills (nav chips + filters) ---- */
	.wfm-pill {
		padding: 6px 11px;
		font-size: 11.5px;
	}

	/* ---- Home ---- */
	.wfm-hero__title {
		font-size: clamp(38px, 11vw, 52px);
	}

	.wfm-hero__lede {
		font-size: 17px;
	}

	.wfm-hero__img {
		height: 220px;
		margin-top: 24px;
	}

	.wfm-stats,
	.wfm-trending {
		grid-template-columns: 1fr;
	}

	.wfm-stat__num {
		font-size: 36px;
	}

	.wfm-sect__title,
	.wfm-findband__title,
	.wfm-getlisted__title {
		font-size: 30px;
	}

	/* ---- Directory: category / town / combo pages ---- */
	.wfm-dir__title {
		font-size: clamp(34px, 10.5vw, 46px);
	}

	.wfm-filterbar__pills {
		gap: 8px;
	}

	.wfm-filterbar__meta {
		flex-wrap: wrap;
		gap: 8px 18px;
	}

	.wfm-dirrow {
		grid-template-columns: 1fr;
		gap: 6px;
	}

	.wfm-dirrow__side {
		display: flex;
		flex-direction: row;
		gap: 12px;
		text-align: left;
	}

	.wfm-dirfeatured__grid {
		gap: 22px;
	}

	.wfm-crumb {
		font-size: 13px;
	}

	/* ---- Single article / spotlight ---- */
	.wfm-single__title {
		font-size: clamp(30px, 9.5vw, 40px);
	}

	.wfm-article__dek {
		font-size: 18px;
		line-height: 1.45;
	}

	.wfm-article__body p:first-of-type::first-letter {
		font-size: 60px;
		margin: 6px 8px 0 0;
	}

	.wfm-article__body h2 {
		margin: 34px 0 12px;
		font-size: 25px;
	}

	.wfm-article__body blockquote {
		margin: 30px 0;
		padding: 22px 0;
	}

	.wfm-article__toc,
	.wfm-guide__toc {
		padding: 18px;
	}

	/* ---- Guides ---- */
	.wfm-guide__title {
		font-size: clamp(32px, 10vw, 44px);
	}

	/* Resource tables scroll sideways instead of crushing */
	.wfm-guide__body table {
		display: block;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}

	/* ---- Single listing ---- */
	.wfm-spotcall {
		margin-top: 40px;
		padding: 22px 20px;
	}

	/* ---- Events ---- */
	.wfm-evday {
		padding: 18px 0;
	}

	.wfm-evrow {
		grid-template-columns: 1fr;
		gap: 4px;
	}

	.wfm-evrow__time {
		font-size: 13px;
	}

	.wfm-evrow__free {
		justify-self: start;
	}

	/* ---- Forms: 16px inputs stop iOS zoom-on-focus ---- */
	.wfm-nf input[type="text"],
	.wfm-nf input[type="email"],
	.wfm-nf input[type="tel"],
	.wfm-nf textarea,
	.wfm-nf select {
		font-size: 16px;
	}

	/* ---- Safety: media never overflows the viewport ---- */
	.wfm-article__body img,
	.wfm-guide__body img {
		max-width: 100%;
		height: auto;
	}
}

@media (max-width: 400px) {

	:root {
		--wfm-pad: 16px;
	}

	.wfm-hero__title {
		font-size: 34px;
	}

	.wfm-dir__title {
		font-size: 30px;
	}

	.wfm-single__title {
		font-size: 28px;
	}

	.wfm-guide__title {
		font-size: 29px;
	}

	.wfm-band {
		padding: 22px 18px;
	}

	.wfm-dirfeat__name {
		font-size: 21px;
	}
}