/**
 * responsive.css — Every @media breakpoint override, gathered here regardless of where its base rule lives — loaded LAST so it always wins the cascade.
 *
 * Part of the KWL360 split stylesheet. Load order lives in
 * functions.php; responsive.css loads next-to-last so its rules
 * reliably win the cascade against every file before it.
 * @package KWL360
 */

@media (prefers-reduced-motion: reduce){
	html{ scroll-behavior: auto; }
	*, *::before, *::after{ animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; }
}

@media (max-width: 700px){
	.kwl-static-banner{ padding: 20px 0; text-align: center; min-height: 90px; }
	.kwl-static-banner--has-image{ padding: 40px 0 28px; min-height: 220px; }
	.kwl-static-banner-inner{ max-width: 100%; }
	.kwl-utility-bar-inner{ flex-direction: column; align-items: center; gap: 6px; padding: 8px 16px; }
	.kwl-utility-pages, .kwl-utility-extras{ justify-content: center; }
}

@media (max-width: 992px){
	.kwl-channels-menu-list{ flex-wrap: wrap; justify-content: flex-start; }
	.kwl-channels-menu-item{ flex: 0 0 auto; }
	.kwl-channels-dropdown{ inset-inline-start: 0; transform: translateY(6px); }
	.kwl-channels-menu-item:hover .kwl-channels-dropdown,
	.kwl-channels-menu-item:focus-within .kwl-channels-dropdown{ transform: translateY(0); }
}

@media (max-width: 900px){
	.kwl-category-cards{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 500px){
	.kwl-category-cards{ grid-template-columns: 1fr; }
}
@media (max-width: 900px){
	.kwl-grid12 > [class*="kwl-col-"]{ grid-column: span 12; }
}

@media (max-width: 992px){
	.kwl-cats-grid{ grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 992px){
	.kwl-ai-col, .kwl-ai-stories-col{ height: auto; min-height: 260px; }
}

@media (max-width: 992px){
	.kwl-cat-hero-main, .kwl-cat-news-side, .kwl-cat-about-main, .kwl-cat-about-side,
	.kwl-cat-top-three, .kwl-cat-top-row .kwl-ad-zone,
	.kwl-cat-tail-row .kwl-ad-zone, .kwl-cat-tail-mini, .kwl-cat-tail-list{ grid-column: span 12; }
	.kwl-cat-strip{ grid-template-columns: repeat(3, 1fr); }
	.kwl-cat-about-main{ flex-direction: column; align-items: stretch; }
	.kwl-cat-about-image{ flex-basis: auto; }
}
@media (max-width: 600px){
	.kwl-cat-top-three{ grid-template-columns: 1fr; }
	.kwl-cat-strip{ grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 860px){
	.kwl-showcase-main-row{ grid-template-columns: 1fr; height: auto; }
	.kwl-showcase-featured{ height: 280px; }
	.kwl-showcase-list-col{ height: auto; max-height: 320px; }
}
@media (max-width: 992px){
	.kwl-showcase-cardrow{ grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 600px){
	.kwl-showcase{ padding: 16px; }
	.kwl-showcase-cardrow{ grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 992px){
	.kwl-custom-tabs-grid{ grid-template-columns: repeat(2, 1fr); }
	.kwl-custom-columns{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px){
	.kwl-custom-tabs-grid{ grid-template-columns: 1fr; }
	.kwl-custom-columns{ grid-template-columns: 1fr; }
}

@media (max-width: 992px){
	.kwl-islamic-trio .kwl-col-5, .kwl-islamic-trio .kwl-col-4, .kwl-islamic-trio .kwl-col-3{ height: auto; min-height: 220px; }
}
@media (max-width: 900px){
	.kwl-latest-trending-main, .kwl-latest-trending-side{ grid-column: span 12; }
}
@media (min-width: 1100px){
	.kwl-share--has-sticky .kwl-share-row{
		position: fixed; top: 50%; inset-inline-start: 24px; transform: translateY(-50%);
		flex-direction: column; z-index: 40; background: var(--kwl-white); padding: 10px;
		border-radius: 999px; box-shadow: var(--kwl-shadow-md); border: 1px solid var(--kwl-border);
	}
}

@media (max-width: 992px){
	.kwl-teacher-redesign .kwl-col-3, .kwl-teacher-redesign .kwl-col-6{ min-height: 0; }
	.kwl-teacher-matrix{ grid-template-columns: repeat(4, 1fr); }
}

@media (max-width: 900px){
	.kwl-teacher-mag-main, .kwl-teacher-mag-side{ grid-column: span 12; }
	.kwl-teacher-mag-main{ grid-template-columns: 1fr; }
	.kwl-teacher-mag-small{ flex-direction: row; overflow-x: auto; }
	.kwl-teacher-mag-item{ flex-direction: column; width: 140px; flex-shrink: 0; }
	.kwl-highlight-strip{ grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 500px){
	.kwl-highlight-strip{ grid-template-columns: repeat(2, 1fr); }
	.kwl-dual-box-thumb{ width: 90px; }
	.kwl-dual-box-item{ height: 90px; }
}/* -----------------------------------------------------------------------
   16. Responsive
   -------------------------------------------------------------------- */
@media (max-width: 900px){
	.kwl-hero-grid{ grid-template-columns: 1fr; height: auto; width: auto; gap: var(--kwl-gutter); }
	.kwl-hero-right, .kwl-hero-left{ height: auto; max-height: none; }
	.kwl-hero-right{ order: 2; }
	.kwl-hero-left{ order: 3; }
	.kwl-hero-slider{ order: 1; width: 100%; }
}
@media (max-width: 640px){
	/* Phones specifically: showing all 9 stacked article cards made the
	   "compact hero" spec meaningless (multiple screens of scrolling
	   before the next section) — so on a real phone only the slider
	   shows; the same articles are one tap away in the Dynamic Showcase
	   section directly below the hero, nothing is actually lost. */
	.kwl-hero-right, .kwl-hero-left{ display: none; }
}
@media (max-width: 1080px){
	.kwl-footer-grid{ grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px){
	.kwl-slide-title{ font-size: 22px; }
}

@media (max-width: 860px){
	.kwl-primary-nav{ display: none; }
	.kwl-mobile-toggle{ display: flex; }
	.kwl-header-brand{ gap: 6px; }
	.kwl-ai-btn span{ display: none; }
	.kwl-ai-btn{ padding: 9px; }
}

@media (max-width: 700px){
	.kwl-split-grid{ grid-template-columns: 1fr; gap: 30px; }
	.kwl-video-pair-grid{ grid-template-columns: 1fr; gap: 30px; }
	.kwl-video-pair-list .kwl-youtube-thumb{ width: 110px; }
	.kwl-journey-adjacent{ grid-template-columns: 1fr; }
	.kwl-journey-related-grid{ grid-template-columns: repeat(2, 1fr); }
	.kwl-reader-journey{ padding: 22px; }
	.kwl-youtube-grid{ grid-template-columns: 1fr; }
	.kwl-tab-grid{ grid-template-columns: repeat(2, 1fr); }
	.kwl-shroohat-list{ grid-template-columns: repeat(2, 1fr); }
	:root{ --kwl-header-h: 64px; }
	.kwl-slide-content{ padding: 20px; }
	.kwl-resource-grid, .kwl-editorial-grid{ grid-template-columns: repeat(2,1fr); }
	.kwl-footer-grid{ grid-template-columns: 1fr; }
	.kwl-newsletter-form{ flex-direction: column; }
	.kwl-glass-card{ padding: 36px 22px; }
	.kwl-section{ padding: 32px 0; }
}

@media (max-width: 480px){
	.kwl-container{ padding: 0 16px; }
	.kwl-resource-grid, .kwl-editorial-grid{ grid-template-columns: 1fr; }
	.kwl-404-code{ font-size: 3.6rem; }
}
@media (max-width: 600px){
	.kwl-showcase-chooser{ grid-template-columns: 1fr; }
	.kwl-showcase-chooser-visual{ min-height: 160px; }
	.kwl-showcase-filtered-grid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 860px){
	.kwl-showcase-random-grid{ grid-template-columns: repeat(4, 1fr); }
}