/* ==========================================================================
   FSP Sprout — responsive layer
   Breakpoints (synthesized from every prototype's inline @media rules):
     ≤1100 — three-column post body tightens
     ≤1000 — content+sidebar layouts collapse to single column
     ≤  980 — desktop nav hides; mobile drawer takes over
     ≤  920 — resources & courses grids drop to 2-up
     ≤  900 — overview pages tighten to 2-up
     ≤  880 — testimonials grid collapses
     ≤  860 — feature spotlights, missions, contact stack
     ≤  820 — campaign landing pieces stack
     ≤  760 — tip band, lead-magnet, what-you-get stack
     ≤  720 — hero art hides, topbar hides, footer CTA single-column
     ≤  680 — filter sort hides
     ≤  620 — about big-number / lp-proof collapse to 1-col
     ≤  580 — overview pages 1-col
     ≤  560 — newsletter form stacks
     ≤  540 — landing form stacks
     ≤  520 — narrow mobile final-cleanup
     ≤  480 — tiny phones; mobile preview frame shrinks
   ========================================================================== */

/* ----- 1100px ------------------------------------------------------------- */
@media (max-width:1100px){
	.post-body{ grid-template-columns: 48px minmax(0,1fr) 320px; gap:28px; }
}

/* ----- 1000px ------------------------------------------------------------- */
@media (max-width:1000px){
	.with-sidebar{ grid-template-columns:1fr; gap:48px; }
	.arch-body{ grid-template-columns:1fr; }
	.arch-side{ order:2; }
}

/* ----- 980px (the big breakpoint — mobile chrome begins) ----------------- */
@media (max-width:980px){
	.nav__menu{ display:none; }
	.nav__actions .btn{ display:none; }
	.burger{ display:grid; }
	.cols-4{ grid-template-columns: repeat(2,1fr); }
	.cols-3{ grid-template-columns: repeat(2,1fr); }
	.post-body{ grid-template-columns: 1fr; gap:40px; }
	.share-rail{ display:none; }
	.cat-grid{ grid-template-columns: repeat(2,1fr); }
}

/* ----- 920px ------------------------------------------------------------- */
@media (max-width:920px){
	.res-grid{ grid-template-columns:repeat(2,1fr); }
	.co-grid{ grid-template-columns:repeat(2,1fr); }
}

/* ----- 880px ------------------------------------------------------------- */
@media (max-width:880px){
	.tst-grid{ grid-template-columns:1fr; }
}

/* ----- 860px ------------------------------------------------------------- */
@media (max-width:860px){
	.feat-grid{ grid-template-columns:1fr; }
	.feat-lead{ min-height:340px; }
	.blog-feat{ grid-template-columns:1fr; }
	.blog-feat__lead{ min-height:320px; }
	.feat-course{ grid-template-columns:1fr; }
	.feat-course__media{ min-height:240px; }
	.course-incl{ grid-template-columns:1fr; }
	.footer-grid{ grid-template-columns: 1fr 1fr; gap:32px; }
	.ct-grid{ grid-template-columns:1fr; gap:32px; }
}

/* ----- 820px ------------------------------------------------------------- */
@media (max-width:820px){
	.mission{ grid-template-columns:1fr; gap:32px; }
	.values{ grid-template-columns:1fr; }
	.team{ grid-template-columns:repeat(2,1fr); }
	.promo__grid{ grid-template-columns:1fr; }
	.steps{ grid-template-columns:repeat(2,1fr); }
}

/* ----- 760px ------------------------------------------------------------- */
@media (max-width:760px){
	.tip__grid{ grid-template-columns:1fr; }
	.tip__art{ order:-1; }
	.lp-get{ grid-template-columns:1fr; }
	.lp-get__art{ order:-1; }
	.lm-form{ flex-direction:column; border-radius:var(--r-lg); }
	.lm-form .btn{ width:100%; }
	.lead-magnet__grid{ grid-template-columns:1fr; }
	.lm-art{ order:-1; }
}

/* ----- 720px ------------------------------------------------------------- */
@media (max-width:720px){
	.topbar{ display:none; }
	.hero__grid{ grid-template-columns:1fr; }
	.hero__art{ display:none; }
	.arch-hero__grid{ grid-template-columns:1fr; }
	.arch-ic{ display:none; }
	.statbar__grid{ grid-template-columns:1fr 1fr; }
	.statbar__item:nth-child(2){ border-right:0; }
	.statbar__item:nth-child(1), .statbar__item:nth-child(2){ border-bottom:1px solid var(--line); }
	.ftcta-grid{ grid-template-columns:1fr !important; }
	.resultcount{ display:none; }
}

/* ----- 680px ------------------------------------------------------------- */
@media (max-width:680px){
	.sortsel{ display:none; }
}

/* ----- 620px ------------------------------------------------------------- */
@media (max-width:620px){
	.bignum{ grid-template-columns:1fr 1fr; }
	.bignum > div:nth-child(2){ border-right:0; }
	.bignum > div:nth-child(1), .bignum > div:nth-child(2){ border-bottom:1px solid var(--line); }
	.lp-proof{ grid-template-columns:1fr; }
	.lp-proof > div{ border-right:0; border-bottom:1px solid var(--line); }
	.lp-proof > div:last-child{ border-bottom:0; }
	.cols-4, .cols-3, .cols-2{ grid-template-columns:1fr; }
	.res-grid{ grid-template-columns:1fr; }
	.co-grid{ grid-template-columns:1fr; }
}

/* ----- 580px ------------------------------------------------------------- */
@media (max-width:580px){
	.team{ grid-template-columns:1fr; }
}

/* ----- 560px ------------------------------------------------------------- */
@media (max-width:560px){
	.news form{ flex-direction:column; border-radius:var(--r-lg); }
	.news form .btn{ width:100%; }
	.search-overlay{ padding-top: 64px; }
	.search-overlay__panel{ width:94vw; padding:14px; }
	.search-overlay__form{ flex-direction:column; }
	.search-overlay__form .btn{ width:100%; }
}

/* ----- 540px ------------------------------------------------------------- */
@media (max-width:540px){
	.lp-form{ flex-direction:column; border-radius:var(--r-lg); }
	.lp-form .btn{ width:100%; }
	.lp-hero h1{ font-size:36px; }
}

/* ----- 520px ------------------------------------------------------------- */
@media (max-width:520px){
	.footer-grid{ grid-template-columns:1fr; }
	.steps{ grid-template-columns:1fr; }
	.ct-row{ grid-template-columns:1fr; }
	.cat-grid{ grid-template-columns:1fr 1fr; gap:12px; }
	.cat-card{ padding:18px 12px; }
	.brand small{ display:none; }
	.hero h1{ font-size:32px; line-height:1.1; }
	.h1{ font-size:30px; }
	.h2{ font-size:24px; }
	.section{ padding-block:48px; }
	.section-sm{ padding-block:36px; }
}

/* ----- 480px ------------------------------------------------------------- */
@media (max-width:480px){
	.nav{ height:62px; gap:10px; }
	.brand{ font-size:18px; }
	.brand__mark{ width:36px; height:36px; }
	.brand__mark svg{ width:22px; height:22px; }
	.icon-btn{ width:38px; height:38px; }
	.filterbar .container{ padding-block:10px; }
	.btn--lg{ padding:14px 22px; font-size:15.5px; }
	.btn{ font-size:15px; padding:12px 22px; }
	.float-card{ display:none; }
	.tst{ padding:22px; }
	.feat-lead__body{ padding:22px; }
	.blog-feat__lead .b{ padding:22px; }
	.callout{ padding:18px 20px; gap:12px; }
	.callout .il{ width:42px; height:42px; }
	.prose{ font-size:17px; line-height:1.7; }
	.prose > p:first-of-type::first-letter{ font-size:50px; padding:4px 9px 0 0; }
	.post-head h1{ font-size:28px; }
}

/* ----- Print --------------------------------------------------------------*/
@media print{
	.site-header, .topbar, .site-footer, .footer-cta,
	.share-rail, .filterbar, .drawer, .search-overlay,
	.float-card, .blob, .post-progress, .pagination, .arch-side{
		display:none !important;
	}
	body{ background:#fff; color:#000; }
	a{ color:#000; text-decoration:underline; }
	.container{ max-width:none; padding:0; }
	.prose{ font-size:12pt; line-height:1.5; }
	.section, .section-sm{ padding-block:18px; }
}
