/* =========================================================================
   TOWN & TAILGATE — responsive.css
   Desktop-first overrides. Loaded after main.css.
   ========================================================================= */

/* ---- Large desktop / small desktop ---------------------------------- */
@media (max-width: 1100px) {
	.tnt-latest-grid { grid-template-columns: 1.2fr 1fr; }
	.tnt-carousel__track { grid-auto-columns: calc((100% - 2 * 22px) / 3); }
}

/* ---- Tablet landscape ----------------------------------------------- */
@media (max-width: 960px) {
	.tnt-board-grid { grid-template-columns: 1fr; }
	.tnt-board-grid__aside { max-width: 420px; }
	.tnt-card-grid--board { grid-template-columns: repeat(2, 1fr); }
	.tnt-playbooks-grid { grid-template-columns: 1fr; }
	.tnt-playbooks-grid__aside { max-width: 420px; }
	.tnt-carousel__track { grid-auto-columns: calc((100% - 22px) / 2); }
	.tnt-carousel__arrow { top: 32%; }
}

/* ---- Mobile nav (triggers before the desktop bar can crowd) --------- */
@media (max-width: 1100px) {
	.tnt-menu-toggle { display: block; }
	.tnt-nav {
		position: fixed; inset: 80px 0 auto 0; z-index: 90;
		background: var(--tnt-black); border-bottom: 1px solid var(--tnt-line);
		transform: translateY(-12px); opacity: 0; pointer-events: none;
		transition: transform .22s var(--tnt-ease), opacity .22s var(--tnt-ease);
		max-height: calc(100vh - 80px); overflow-y: auto;
	}
	.tnt-nav.is-open { transform: translateY(0); opacity: 1; pointer-events: auto; }
	.tnt-nav__list { flex-direction: column; align-items: stretch; gap: 0; padding: 8px var(--tnt-gut) 16px; }
	.tnt-nav__list li { border-bottom: 1px solid var(--tnt-line); }
	.tnt-nav__list a { display: block; padding: 16px 0; font-size: .95rem; }
	.tnt-nav__list a::after { display: none; }
	.tnt-nav__list .sub-menu { position: static; display: flex; border: none; box-shadow: none; padding: 0 0 8px 14px; background: transparent; }
	.tnt-subscribe { display: none; }
}

/* ---- Mobile --------------------------------------------------------- */
@media (max-width: 720px) {
	body { font-size: 16px; }
	.tnt-header__inner { min-height: 76px; gap: 12px; }
	.tnt-nav { inset: 76px 0 auto 0; max-height: calc(100vh - 76px); }
	.tnt-wordmark { font-size: 1.5rem; }
	.tnt-brand__tagline { font-size: .56rem; letter-spacing: .16em; }

	.tnt-hero { min-height: 460px; }
	.tnt-hero__inner { padding-block: 64px 56px; }
	.tnt-hero__cta { flex-direction: column; align-items: stretch; }
	.tnt-hero__cta .tnt-btn { width: 100%; }

	.tnt-card-grid--board { grid-template-columns: 1fr; }
	.tnt-card-grid--3 { grid-template-columns: 1fr; }
	.tnt-latest-grid { grid-template-columns: 1fr; }

	.tnt-carousel__track { grid-auto-columns: 78%; }
	.tnt-carousel__arrow--prev { left: -6px; }
	.tnt-carousel__arrow--next { right: -6px; }

	.tnt-fourth__options { grid-template-columns: 1fr 1fr; }

	.tnt-footer__cols { grid-template-columns: 1fr 1fr; gap: 28px; }
	.tnt-footer__about { grid-column: 1 / -1; }

	.tnt-section-head { align-items: flex-start; }
	.tnt-section-head--latest { flex-direction: column; gap: 14px; }
	.tnt-tabs__btn.is-active::after { bottom: -8px; }
}

/* ---- Small mobile --------------------------------------------------- */
@media (max-width: 460px) {
	.tnt-hero__title { font-size: clamp(2.6rem, 13vw, 3.4rem); }
	.tnt-fourth__options { grid-template-columns: 1fr; }
	.tnt-footer__cols { grid-template-columns: 1fr; }
	.tnt-latest__item { flex-direction: row; }
	.tnt-latest__thumb { flex-basis: 72px; width: 72px; height: 72px; }
	.tnt-tabs { gap: 16px; flex-wrap: wrap; }
}