/* ==========================================================================
   Ballyliffin Child Theme — Responsive CSS
   Breakpoints:
     Mobile : < 640 px
     Tablet : 641 – 1024 px
     Desktop: > 1024 px (default)
   Version: 1.0.0
   ========================================================================== */

/* ---------------------------------------------------------------------------
   Mobile-first: below 640 px (default styles already cover this group)
   Nothing to add here — all desktop styles assume the base mobile view.
   --------------------------------------------------------------------------- */

/* ---------------------------------------------------------------------------
   Mobile font-size overrides — WCAG 2.2 SC 1.4.4 (min 16px body, 14px small)
   --------------------------------------------------------------------------- */
@media (max-width: 640px) {
	:root {
		--fs-sm:  1rem;      /* 16px — labels, excerpts, body text in cards */
		--fs-xs:  0.875rem;  /* 14px — meta, dates, roles — minimum for small text */
	}
}

/* ---------------------------------------------------------------------------
   Tablet — 641 px to 1024 px
   --------------------------------------------------------------------------- */
@media (min-width: 641px) and (max-width: 1024px) {
	/* Typography */
	:root {
		--fs-4xl: 2.25rem;
		--fs-5xl: 3rem;
	}

	/* Grid layouts */
	.bally-course-facts {
		grid-template-columns: repeat(2, 1fr);
		gap: var(--sp-4);
	}

	.bally-grid-2 {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: var(--sp-6);
	}

	.bally-grid-3 {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: var(--sp-5);
	}

	.bally-grid-4 {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: var(--sp-4);
	}

	/* Section padding */
	.bally-section {
		padding-block: var(--sp-7);
	}

	/* CTA Banner — stack text above button */
	.bally-cta-banner {
		flex-direction: column;
		text-align: center;
	}

	.bally-cta-banner__actions {
		justify-content: center;
	}

	/* Testimonial grid */
	.bally-testimonial-grid {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: var(--sp-5);
	}
}

/* ---------------------------------------------------------------------------
   Desktop — > 1024 px
   --------------------------------------------------------------------------- */
@media (min-width: 1025px) {
	:root {
		--fs-5xl: 3.75rem;
		--w-content: 1280px;
	}

	/* Grid: 2-col */
	.bally-grid-2 {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: var(--sp-6);
	}

	/* Grid: 3-col */
	.bally-grid-3 {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: var(--sp-5);
	}

	/* Grid: 4-col */
	.bally-grid-4 {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		gap: var(--sp-4);
	}

	/* Nuevo: 6-col — reservado para scorecard o similar */
	.bally-grid-6 {
		display: grid;
		grid-template-columns: repeat(6, 1fr);
		gap: var(--sp-3);
	}

	/* Course Facts — full 4-column */
	.bally-course-facts {
		grid-template-columns: repeat(4, 1fr);
		gap: var(--sp-4);
	}

	/* Widening test pattern map to md-885 + fk-908 mirror */
	.bally-course-details {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: var(--sp-8);
	}

	/* Testimonial grid */
	.bally-testimonial-grid {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: var(--sp-5);
	}

	/* News grid */
	.bally-news-grid {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: var(--sp-5);
	}

	/* Section spacing */
	.bally-section {
		padding-block: var(--sp-8);
	}

	/* CTA Banner — horizontal keep */
	.bally-cta-banner--sticky-mobile {
		position: relative;
	}
}

/* ---------------------------------------------------------------------------
   Large screens — >= 1440 px
   --------------------------------------------------------------------------- */
@media (min-width: 1440px) {
	:root {
		--w-content: 1440px;
		--fs-4xl:  3rem;
		--fs-5xl:  4rem;
	}

	.bally-grid-4,
	.bally-news-grid {
		grid-template-columns: repeat(4, 1fr);
		gap: var(--sp-5);
	}
}