/* =============================================================
   Flex 'N' Eat — responsive rules
   Single source of truth for breakpoints. template.css stays
   breakpoint-free; every @media rule for this theme lives here,
   loaded last so it wins the cascade.

   Bakery responsive is enabled — these rules only patch spacing,
   overflow, type, and layout gaps Bakery does not cover.
============================================================= */

/* ---------- Large desktop / laptop ---------- */
@media (max-width: 1599px) {
	:root{ --font-size: 16px; --global-font-size-html: 16px; }
	body .container{ max-width: 1550px; }
}
@media (max-width: 1499px) {
	:root{ --font-size: 15px; --global-font-size-html: 15px; }
	body .container{ max-width: 1400px; }
}
@media (max-width: 1399px) {
	:root{ --font-size: 14px; --global-font-size-html: 14px; }
	body .container{ max-width: 1250px; }
}
@media (max-width: 1299px) {
	body .container{ max-width: 1125px; }
}
@media (max-width: 1199px) {
	body .container{ max-width: 1025px; }

	header#masthead .header-main ul.menu-wrapper{ gap: 0 24px; }
	header#masthead .header-main ul.menu-wrapper li.menu-item a{ font-size: 0.875rem; }

	body .container-page{ padding-left: 20px; padding-right: 20px; }
}

@media (max-width: 1099px) {
	body .container{ max-width: 950px; }
}

/* ---------- Tablet ---------- */
@media (max-width: 1024px) {
	body .container{ max-width: initial; }
	body .container-page{ padding-left: 20px; padding-right: 20px; }

	#content{ padding-top: 120px; }
	.section-y{ padding: 4.5rem 0; }
	.section-y-sm{ padding: 2.75rem 0; }

	:root{ --heading: 2.5rem; --heading-xl: clamp(2.5rem, 5vw, 3.25rem); }

	/* Hero */
	body #content .hero-home{ padding: 5rem 0 4rem; }
	body #content .hero-home .hero-home-copy .display-xl,
	body #content .hero-home .hero-home-copy h1.display-xl,
	body #content .hero-home .hero-home-copy .vc_custom_heading.display-xl{ font-size: var(--heading-xl); }
	body #content .hero-home .hero-home-media img{ width: 100%; height: auto; }

	/* Feature strip — keep Bakery columns; tighten gaps */
	body #content .feature-strip .feature-strip-item{ margin-bottom: 1.25rem; }
	body #content .feature-strip .feature-strip-item > .vc_column-inner > .wpb_wrapper{ gap: 0.75rem; }

	/* Meals */
    body #content .meals-section .meals-grid{ grid-template-columns: repeat(2, 1fr); gap: 1.35rem; }
    body #content .meals-section .meals-header-action{ text-align: left; }
    body #content .meals-section .meals-header-action p{ text-align: left; }
    body #content .meals-section .meal-modal-macros{ grid-template-columns: repeat(4, 1fr); }

	/* Steps */
	body #content .steps-section .steps-grid{ margin-top: 2.5rem !important; }
	body #content .steps-section .step-num{ font-size: 2.35rem; }
	body #content .steps-section .step-item{ margin-bottom: 1.5rem; }
	body #content .steps-section .step-text{ max-width: none; }

	/* Split / about / delivery / referral — reset desktop side padding */
	body #content .split-feature .split-feature-copy > .vc_column-inner,
	body #content .split-feature.split-feature-alt .split-feature-copy > .vc_column-inner,
	body #content .about-section .about-copy > .vc_column-inner,
	body #content .story-section .story-copy > .vc_column-inner,
	body #content .story-section .story-media > .vc_column-inner,
	body #content .delivery-section .delivery-copy > .vc_column-inner,
	body #content .delivery-section .split-feature-copy > .vc_column-inner,
	body #content .referral-banner .referral-banner-copy > .vc_column-inner{
		padding-left: 15px !important;
		padding-right: 15px !important;
	}
	body #content .split-feature .split-feature-copy .display-lg,
	body #content .split-feature .split-feature-copy h2.display-lg,
	body #content .about-section .about-copy .display-lg,
	body #content .story-section .story-copy .display-lg,
	body #content .delivery-section .display-lg,
	body #content .referral-banner .referral-banner-copy .display-lg{ max-width: none; }

	body #content .split-feature .split-feature-media,
	body #content .about-section .about-media,
	body #content .story-section .story-media,
	body #content .delivery-section .delivery-media{ margin-top: 1rem; margin-bottom: 1.5rem; }
	body #content .split-feature .split-feature-media img,
	body #content .about-section .about-media img,
	body #content .story-section .story-media img,
	body #content .delivery-section .delivery-media img{ width: 100%; height: auto; }

	body #content .delivery-section .delivery-rates .wpb_wrapper > ul,
	body #content .delivery-section .delivery-rates ul{ grid-template-columns: repeat(3, minmax(0, 1fr)); }

	body #content .referral-banner .referral-banner-copy{ margin-bottom: 1.75rem; }
	body #content .referral-banner .referral-steps .wpb_wrapper > ol,
	body #content .referral-banner .referral-steps ol{ padding: 1.5rem; }

	body #content .faq-section .faq-intro{ margin-bottom: 1.75rem; }
	body #content .faq-section .faq-card .wpb_wrapper{ padding: 1.35rem; }

	/* Delivery page */
	body #content .delivery-details .delivery-details-copy > .vc_column-inner,
	body #content .faq-section.faq-split .faq-split-intro > .vc_column-inner{
		padding-right: 15px !important;
	}
	body #content .delivery-details .display-lg,
	body #content .faq-section.faq-split .faq-split-intro .display-lg{ max-width: none; }
	body #content .delivery-details .delivery-details-side{ margin-top: 1.5rem; }
	body #content .delivery-details .delivery-areas .wpb_wrapper > ul,
	body #content .delivery-details .delivery-areas ul{ grid-template-columns: 1fr 1fr; }
	body #content .allergen-section .lead{ margin-bottom: 1.5rem; }
	body #content .faq-section.faq-split .faq-split-intro{ margin-bottom: 1.5rem; }

	/* Enquire page */
	body #content .enquire-section .enquire-form-col > .vc_column-inner{ padding-right: 15px !important; }
	body #content .enquire-section .enquire-side{ margin-top: 1.5rem; }

	body #content .contact-cta .display-lg,
	body #content .contact-cta h2.display-lg{ max-width: 22ch; }

	body #content .ig-strip .ig-strip-item{ padding: 0.25rem; }

	body footer#colophon .footer-grid{ grid-template-columns: 1fr 1fr; gap: 2.5rem 2rem; }
	body footer#colophon .footer-brand{ grid-column: 1 / -1; }
	body footer#colophon .footer-brand .footer-headline,
	body footer#colophon .footer-brand .widget-title.footer-headline{ font-size: 1.85rem; max-width: 18ch; }
}

/* ---------- Header / nav collapse to hamburger ---------- */
@media (max-width: 900px) {
	header#masthead .header-main .main-menu{ display: none !important; }
	header#masthead .header-main .header-cta{ display: none; }
	header#masthead .header-main .mobile-menu-link{ display: block !important; }

	header#masthead .header-main .header-inner{ gap: 12px; }
	header#masthead div.mob-flex{ display: flex; align-items: center; justify-content: space-between; width: 100%; }
	header#masthead .mob-flex .logo-mark{ width: 40px; height: 40px; }
	header#masthead .mob-flex .logo-name{ font-size: 1rem; }
	header#masthead .mob-flex .logo-tagline{ font-size: 0.5625rem; letter-spacing: 0.1em; }

	#content{ padding-top: 112px; }
}

/* ---------- Mobile ---------- */
@media (max-width: 768px) {
	:root{
		--font-size: 15px;
		--global-font-size-html: 15px;
		--heading: 2.25rem;
		--heading-xl: clamp(2.15rem, 8vw, 2.75rem);
	}

	html, body{ overflow-x: clip; }
	body .container-page{ padding-left: 16px; padding-right: 16px; width: 100%; max-width: 100%; box-sizing: border-box; }
	body .flex-row{ flex-direction: column; }
	body .flex-row .col-1,
	body .flex-row .col-2,
	body .flex-row .col-3,
	body .flex-row .col-4,
	body .flex-row .col-5,
	body .flex-row .col-6,
	body .flex-row .col-7,
	body .flex-row .col-8,
	body .flex-row .col-9,
	body .flex-row .col-10,
	body .flex-row .col-11,
	body .flex-row .col-12{ flex: 0 0 100%; width: 100%; }

	body .desk-hidden{ display: block !important; }
	body .mob-hidden{ display: none; }

	img, .wpb_single_image img, .border-img img, .full-img img{ max-width: 100%; height: auto; }

	.display-xl{ font-size: var(--heading-xl); }
	.display-lg{ font-size: var(--heading); }

	.section-y{ padding: 3.25rem 0; }
	.section-y-sm{ padding: 2.25rem 0; }

	/* Header / announcement */
	.announcement-bar{ max-height: 4.5rem; }
	.announcement-bar .announcement-inner{
		font-size: 0.75rem;
		row-gap: 0.375rem;
		padding: 0.5rem 0;
		gap: 0.375rem 0.75rem;
		justify-content: center;
		text-align: center;
	}
	.announcement-bar .announcement-msg{ justify-content: center; flex-wrap: wrap; text-align: center; }

	header#masthead .header-main{ padding: 14px 0; }
	header#masthead .header-main .logo-mark{ width: 40px; height: 40px; }
	header#masthead .header-main .logo-name{ font-size: 1rem; }
	header#masthead .header-main .logo-tagline{ font-size: 0.5625rem; letter-spacing: 0.1em; }

	#content{ padding-top: 108px; }
	#content .page-header{ padding: 4.5rem 0 2.25rem; }
	#content .page-header .page-header-inner .page-title{ font-size: var(--heading); }
	#content .vc_section{ margin-bottom: 0; }

	#content .btn-flex{ flex-direction: column; gap: 0.85rem; align-items: stretch; }
	#content .btn-flex.justify-center{ align-items: stretch; }
	#content .btn-flex .wpb_wrapper > p{
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 0.85rem;
		width: 100%;
	}
	#content .btn-flex a,
	#content .btn-flex .btn-lime,
	#content .btn-flex .btn-outline,
	#content .btn-flex .btn-outline-light,
	#content .btn-flex .btn-dark{
		width: 100%;
		justify-content: center;
		box-sizing: border-box;
	}

	/* Hero */
	body #content .hero-home{ padding: 3.5rem 0 3rem; }
	body #content .hero-home .hero-home-copy .display-xl,
	body #content .hero-home .hero-home-copy h1.display-xl,
	body #content .hero-home .hero-home-copy .vc_custom_heading.display-xl{ font-size: var(--heading-xl); }
	body #content .hero-home .hero-home-copy .lead{ max-width: none; }
	body #content .hero-home .hero-home-copy .btn-flex{ margin-bottom: 1.5rem; }
	body #content .hero-home .hero-home-media{ margin-top: 1.75rem; }
	body #content .hero-home .hero-home-media .hero-home-badge{
		left: 0.85rem;
		bottom: 0.85rem;
		right: auto;
		max-width: min(11.5rem, calc(100% - 1.7rem));
		padding: 0.75rem 0.9rem;
	}

	/* Feature strip */
	body #content .feature-strip .feature-strip-item{ margin-bottom: 1.15rem; }
	body #content .feature-strip .feature-strip-item > .vc_column-inner > .wpb_wrapper{ gap: 0.75rem; }
	body #content .feature-strip .feature-label{ font-size: 1rem; }
	body #content .feature-strip .feature-sub{ font-size: 0.875rem; }

	/* Meals */
	body #content .meals-section .meals-grid{ grid-template-columns: 1fr; gap: 1.25rem; }
	body #content .meals-section .meals-header{ flex-direction: column; align-items: flex-start; gap: 1rem; }
	body #content .meals-section .meals-header-action{ text-align: left; margin-top: 0.25rem; }
	body #content .meals-section .meals-header-action p{ text-align: left; }
	body #content .meals-section .meal-card-cta .meal-card-cta-inner{ padding: 2rem 1.5rem; min-height: 0; }
	body #content .meals-section .meal-card-cta .meal-cta-title{ font-size: var(--heading); }
	body #content .meals-section .meal-card-cta .meal-cta-text{ max-width: none; }
	body #content .meals-section .meal-title-row{ flex-wrap: wrap; gap: 0.5rem; }

	body .meal-modal{ padding: 12px; align-items: flex-end; }
	body .meal-modal-panel{ max-height: min(92vh, 820px); border-radius: 12px 12px 0 0; }
	body .meal-modal-body{ padding: 22px 18px 28px; }
	body .meal-modal-title{ font-size: 1.375rem; }
	body .meal-modal-macros{ grid-template-columns: repeat(2, 1fr); gap: 8px; }
	body .meal-modal-cols{ grid-template-columns: 1fr; gap: 18px; }
	body .meal-modal-cols-lower{ margin-top: 18px; padding-top: 18px; }

	/* Steps */
	body #content .steps-section .steps-grid{ margin-top: 2rem !important; }
	body #content .steps-section .step-num{ font-size: 2.25rem; margin-bottom: 0.85rem; }
	body #content .steps-section .step-item{ margin-bottom: 1.75rem; }
	body #content .steps-section .step-item > .vc_column-inner{ padding-top: 1.1rem !important; }
	body #content .steps-section .step-text{ max-width: none; }

	/* Split / about / story / delivery */
	body #content .split-feature .split-feature-media,
	body #content .about-section .about-media,
	body #content .story-section .story-media,
	body #content .delivery-section .delivery-media,
	body #content .delivery-section .split-feature-media{ margin-bottom: 1.5rem; }
	body #content .split-feature .split-feature-copy > .vc_column-inner,
	body #content .split-feature.split-feature-alt .split-feature-copy > .vc_column-inner,
	body #content .about-section .about-copy > .vc_column-inner,
	body #content .story-section .story-copy > .vc_column-inner,
	body #content .story-section .story-media > .vc_column-inner,
	body #content .delivery-section .delivery-copy > .vc_column-inner,
	body #content .delivery-section .split-feature-copy > .vc_column-inner{
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
	body #content .split-feature .split-feature-copy .display-lg,
	body #content .split-feature .split-feature-copy h2.display-lg,
	body #content .about-section .about-copy .display-lg,
	body #content .story-section .story-copy .display-lg,
	body #content .delivery-section .display-lg{ max-width: none; }
	body #content .split-feature-alt .split-feature-media{ order: -1; }
	body #content .story-section .story-ba-item img{ aspect-ratio: 3 / 4; }

	body #content .delivery-section .delivery-area{ max-width: 100%; white-space: normal; }
	body #content .delivery-section .delivery-rates .wpb_wrapper > ul,
	body #content .delivery-section .delivery-rates ul{ grid-template-columns: 1fr; gap: 0.55rem; }

	/* Referral */
	body #content .referral-banner .referral-banner-copy{ margin-bottom: 1.75rem; }
	body #content .referral-banner .referral-banner-copy > .vc_column-inner{ padding-left: 0 !important; padding-right: 0 !important; }
	body #content .referral-banner .referral-banner-copy .display-lg{ max-width: none; }
	body #content .referral-banner .referral-steps .wpb_wrapper > ol,
	body #content .referral-banner .referral-steps ol{ padding: 1.25rem 1.15rem; gap: 1.15rem; }
	body #content .referral-banner .referral-steps li{ padding-left: 2.75rem; }

	/* FAQ */
	body #content .faq-section .faq-intro{ margin-bottom: 1.5rem; }
	body #content .faq-section .faq-grid > .wpb_column{ margin-bottom: 0.85rem; }
	body #content .faq-section .faq-card .wpb_wrapper{ padding: 1.2rem 1.15rem; }

	/* Delivery page */
	body #content .delivery-details .delivery-details-copy > .vc_column-inner,
	body #content .faq-section.faq-split .faq-split-intro > .vc_column-inner{
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
	body #content .delivery-details .delivery-facts li{
		flex-wrap: wrap;
		gap: 0.35rem 1rem;
	}
	body #content .delivery-details .delivery-facts .fact-value{ text-align: left; }
	body #content .delivery-details .delivery-areas .wpb_wrapper > ul,
	body #content .delivery-details .delivery-areas ul{ grid-template-columns: 1fr; gap: 0.65rem; }
	body #content .delivery-details .delivery-details-side{ margin-top: 1.75rem; }
	body #content .delivery-details .delivery-mini-steps{ margin-top: 0.25rem; }
	body #content .allergen-section .allergen-table{ min-width: 560px; }
	body #content .allergen-section .allergen-table th,
	body #content .allergen-section .allergen-table td{ padding: 0.9rem 1rem; font-size: 0.9375rem; }
	body #content .faq-section.faq-split .faq-split-intro{ margin-bottom: 1.25rem; }
	body #content .faq-section.faq-split .faq-accordion .vc_tta-panel-heading .vc_tta-panel-title > a{
		font-size: 1.05rem;
		padding: 1.1rem 0 !important;
	}

	/* Enquire page */
	body #content .enquire-section .enquire-form-col > .vc_column-inner{
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
	body #content .enquire-section .enquire-side{ margin-top: 2rem; gap: 1rem; }
	body #content .enquire-section .enquire-card{ padding: 1.25rem 1.2rem; }
	body #content .enquire-section form .form-group.col-6{ width: 100% !important; }

	/* Contact CTA */
	body #content .contact-cta .display-lg,
	body #content .contact-cta h2.display-lg{ max-width: none; margin-left: auto; margin-right: auto; }
	body #content .contact-cta .lead{ margin-bottom: 1.5rem; }
	body #content .contact-cta .btn-flex{
		flex-direction: column;
		align-items: stretch;
		gap: 0.75rem;
	}
	body #content .contact-cta .btn-flex .wpb_wrapper > p{
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 0.75rem;
		width: 100%;
	}
	body #content .contact-cta .btn-flex a{
		width: 100%;
		justify-content: center;
		box-sizing: border-box;
	}

	/* Footer */
	body footer#colophon .footer-main{ padding: 3.25rem 0 2.5rem; }
	body footer#colophon .footer-grid{ grid-template-columns: 1fr; gap: 2.25rem; }
	body footer#colophon .footer-brand{ grid-column: auto; }
	body footer#colophon .footer-brand .footer-headline,
	body footer#colophon .footer-brand .widget-title.footer-headline{
		font-size: 1.65rem;
		max-width: none;
	}
	body footer#colophon .footer-brand .footer-logo-link{ margin-bottom: 1.25rem; }
	body footer#colophon .footer-nav,
	body footer#colophon .footer-contact{ padding-top: 0; }
	body footer#colophon .footer-bottom{ padding: 1.15rem 0 1.5rem; }
	body footer#colophon .footer-bottom-inner{
		flex-direction: column;
		align-items: flex-start;
		gap: 0.75rem;
	}
	body footer#colophon .footer-bottom .cancellation-note,
	body footer#colophon .footer-bottom .footer-bottom-note{
		text-align: left;
		max-width: none;
	}

	.mobile-sticky-cta{ display: block; }

	form .interval-radio .wpcf7-list-item{ min-width: 100%; }

	body #content .service-single-sec .service-single-row > .col-8,
	body #content .service-single-sec .service-single-row > .col-4{ flex: 0 0 100%; width: 100%; }
	body #content .service-single-sec .service-single-content .service-title{ font-size: 2rem; }
	body #content .service-single-sec .service-single-sidebar{ margin-top: 2rem; }
	body #content .service-single-sec .service-single-sidebar .service-sidebar-inner{ position: static; top: auto; }
}

/* ---------- Small phones ---------- */
@media (max-width: 480px) {
	body .container-page{ padding-left: 14px; padding-right: 14px; }

	.announcement-bar .announcement-inner{ font-size: 0.6875rem; gap: 8px; padding: 0.45rem 0; }
	header#masthead .header-main .logo-name{ font-size: 0.9375rem; }
	header#masthead .header-main .logo-tagline{ letter-spacing: 0.08em; }
	header#masthead .mob-flex .logo-mark{ width: 36px; height: 36px; }

	#content{ padding-top: 104px; }

	.hero-home{ padding: 3rem 0 2.5rem; }
	.hero-home .hero-home-media .hero-home-badge{
		font-size: 0.95rem;
		padding: 0.65rem 0.75rem;
		max-width: min(10.5rem, calc(100% - 1.5rem));
	}

	.meals-section .meal-card-cta .meal-cta-title{ font-size: 1.85rem; }
	.meals-section .meal-card-body{ padding: 1.15rem 1.1rem 1.25rem; }

	.steps-section .step-num{ font-size: 2rem; }

	.referral-banner .referral-steps .wpb_wrapper > ol,
	.referral-banner .referral-steps ol{ padding: 1.1rem 1rem; }

	.contact-cta .btn-flex a{ padding-left: 1.15rem; padding-right: 1.15rem; }

	footer#colophon .footer-brand .footer-headline,
	footer#colophon .footer-brand .widget-title.footer-headline{ font-size: 1.45rem; }
	footer#colophon .footer-logo-name{ font-size: 1.1rem; }
}

@media (max-width: 767px) {

    html,
    body {
        max-width: 100%;
        overflow-x: hidden;
    }
}
