/* ==========================================================================
   Medicell Dental – Mobile Styles
   Breakpoints: 820px (tablet), 600px (phone)
   ========================================================================== */

@media (max-width: 1024px) {
	.primary-menu { gap: 22px; }
	.tour-grid { grid-template-columns: repeat(2, 1fr); }
	.equipment-grid { grid-template-columns: repeat(2, 1fr); }
	.doctor-band-inner { gap: 50px; }
	.philosophy-inner { grid-template-columns: 1fr; gap: 40px; }
	.footer-inner { grid-template-columns: 1fr 1fr; gap: 36px; }
	.post-grid { grid-template-columns: repeat(2, 1fr); gap: 24px; }

	/* Treatments */
	.tx-tabs ul { grid-template-columns: repeat(4, 1fr); gap: 8px; }
	.tx-process-list { grid-template-columns: repeat(2, 1fr); }
	.tx-related-grid { grid-template-columns: repeat(2, 1fr); }

	/* Home treatments: 4 cols → 2 cols on tablet */
	.home-tx-cards { grid-template-columns: repeat(2, 1fr); gap: 18px; }

	/* Magazine */
	.mag-tabs ul { grid-template-columns: repeat(5, 1fr); gap: 6px; }
	.mag-posts { grid-template-columns: repeat(2, 1fr); gap: 22px; }
}

@media (max-width: 820px) {
	:root {
		--header-h: 64px;
		--gutter: 18px;
	}

	/* Hide desktop nav, show mobile toggle */
	.main-navigation { display: none; }
	.menu-toggle { display: inline-flex; }

	/* Header tweaks */
	.header-right .lang-switcher { display: none; }
	.brand-name-line1 { font-size: 16px; }
	.brand-name-line2 { font-size: 8px; }
	.brand-mark { width: 32px; height: 32px; font-size: 16px; }

	/* Hero – mobile skin */
	.hero {
		min-height: 600px;
		min-height: calc(100svh - var(--header-h));
		align-items: flex-end;
		padding: 60px 0 50px;
	}
	.hero-overlay {
		background: linear-gradient(180deg, rgba(26,37,67,0.35) 0%, rgba(26,37,67,0.75) 60%, rgba(26,37,67,0.85) 100%);
	}
	.hero-eyebrow { font-size: 10px; margin-bottom: 18px; padding-bottom: 10px; }
	.hero-title { font-size: clamp(28px, 8vw, 38px); margin-bottom: 18px; }
	.hero-sub { font-size: 14px; line-height: 1.7; margin-bottom: 28px; }
	.hero-cta { flex-direction: column; align-items: stretch; }
	.hero-cta .btn { justify-content: center; width: 100%; }
	.hero-scroll { display: none; }

	/* Story point */
	.story-point { padding: 70px 0; }
	.point-title { font-size: 28px; }
	.point-desc { font-size: 14px; }

	/* Doctor band */
	.doctor-band { padding: 70px 0; }
	.doctor-band-inner { grid-template-columns: 1fr; gap: 30px; }
	.doctor-name { font-size: 36px; }
	.doctor-quote { font-size: 15px; }

	/* Tour */
	.clinic-tour, .equipment, .philosophy, .latest-posts { padding: 70px 0; }
	.tour-grid { gap: 12px; }

	/* Equipment */
	.equipment-item { padding: 28px 22px; }
	.equipment-item h3 { font-size: 20px; }

	/* Philosophy */
	.philosophy-list li { padding: 28px 24px 28px 24px; }
	.philosophy-list .num { position: static; display: block; margin-bottom: 8px; }

	/* Section header */
	.section-header { margin-bottom: 40px; }
	.section-title { font-size: 28px; }
	.section-sub { font-size: 14px; }

	/* Post cards */
	.post-grid { grid-template-columns: 1fr; gap: 20px; }
	.post-card-body { padding: 22px 20px 26px; }
	.post-card-title { font-size: 19px; }

	/* Page hero */
	.page-hero { padding: 60px 0 50px; }
	.page-hero-title { font-size: 32px; }
	.page-hero-sub { font-size: 14px; }

	/* Treatments – index */
	.tx-tabs ul { grid-template-columns: repeat(4, 1fr); gap: 6px; }
	.tx-tab a { padding: 12px 4px; gap: 6px; }
	.tx-tab-icon { width: 44px; height: 44px; }
	.tx-tab-icon svg { width: 24px; height: 24px; }
	.tx-tab-label { font-size: 11px; }

	/* Home treatments: 2 columns on mobile */
	.home-treatments { padding: 60px 0 50px; }
	.home-treatments .tx-tabs { margin-bottom: 30px; }
	.home-tx-cards { grid-template-columns: repeat(2, 1fr); gap: 12px; }
	.home-tx-card-body { padding: 20px 16px 18px; }
	.home-tx-card-num { font-size: 38px; left: 10px; bottom: -4px; }
	.home-tx-card-title { font-size: 17px; }
	.home-tx-card-en { font-size: 12px; }
	.home-tx-card-text { font-size: 12px; line-height: 1.6; }

	/* Magazine – mobile */
	.magazine { padding: 60px 0 70px; }
	.mag-tabs { margin-bottom: 30px; }
	.mag-tabs ul {
		display: flex;
		grid-template-columns: none;
		gap: 6px;
		overflow-x: auto;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
		padding-bottom: 6px;
		margin: 0 -18px;
		padding-left: 18px;
		padding-right: 18px;
	}
	.mag-tabs ul::-webkit-scrollbar { display: none; }
	.mag-tabs li { flex-shrink: 0; }
	.mag-tab {
		flex-direction: row;
		gap: 8px;
		padding: 10px 16px 10px 12px;
		border-radius: 999px;
		background: var(--white);
	}
	.mag-tab-icon { width: 28px; height: 28px; }
	.mag-tab-icon svg { width: 16px; height: 16px; }
	.mag-tab-label { font-size: 13px; }
	.mag-tab.is-active { background: var(--navy); }

	.mag-posts { grid-template-columns: 1fr; gap: 16px; }
	.mag-card-body { padding: 18px 18px 20px; }
	.mag-card-title { font-size: 17px; }

	/* Hide hero image-only on very small screens? keep visible, just contain */
	.hero-imageonly .hero-bg img { max-height: 480px; }

	.tx-cards { grid-template-columns: 1fr; gap: 24px; }
	.tx-cards-section { padding: 50px 0 80px; }
	.tx-card-num { font-size: 56px; left: 18px; bottom: -6px; }
	.tx-card-body { padding: 30px 22px 26px; }
	.tx-card-en { font-size: 15px; }
	.tx-card-title { font-size: 26px; }

	/* Treatments – detail */
	.tx-detail-hero { padding: 50px 0 60px; }
	.tx-detail-hero-inner { grid-template-columns: 1fr; gap: 36px; }
	.tx-detail-num { font-size: 72px; left: 20px; bottom: 12px; }
	.tx-detail-en { font-size: 17px; }
	.tx-detail-title { font-size: 30px; }
	.tx-detail-lead { font-size: 15px; }

	.tx-detail-section { padding: 60px 0; }
	.tx-intro-text { font-size: 15px; }
	.tx-process-list { grid-template-columns: 1fr; }
	.tx-step-title { font-size: 20px; }

	.tx-consider-list li { padding: 16px 20px 16px 50px; font-size: 14px; }
	.tx-consider-list li::before { left: 16px; width: 22px; height: 22px; }

	.tx-faq-item summary { padding: 18px 20px; font-size: 14px; gap: 12px; }
	.tx-faq-q-mark, .tx-faq-a-mark { width: 28px; height: 28px; font-size: 16px; }
	.tx-faq-a { padding: 6px 20px 22px 20px; }
	.tx-faq-a p { font-size: 14px; }

	.tx-related-grid { grid-template-columns: 1fr; gap: 10px; }
	.tx-related-card { padding: 16px 18px; }

	.tx-crumb { padding: 14px 0; font-size: 11px; }

	/* Treatments CTA */
	.treatments-cta { padding: 60px 0; }
	.treatments-cta h2 { font-size: 26px; }
	.cta-actions { flex-direction: column; align-items: stretch; }

	/* Directions */
	.map-section { padding: 60px 0; }
	.map-wrap iframe { height: 340px; }
	.map-info { grid-template-columns: 1fr; gap: 0; }

	/* Article */
	.article-hero { min-height: 360px; padding: 60px 0 50px; }
	.article-title { font-size: 28px; }
	.article-lead { font-size: 15px; }
	.article-body { font-size: 16px; padding: 50px 0 40px; }
	.article-body h2 { font-size: 24px; }
	.article-body h3 { font-size: 20px; }
	.article-author { flex-direction: column; text-align: center; padding: 24px; }
	.article-nav { grid-template-columns: 1fr; }
	.nav-next { text-align: left; }
	.related-posts { padding: 60px 0 80px; }

	/* Footer */
	.site-footer { padding: 50px 0 20px; }
	.footer-inner { grid-template-columns: 1fr; gap: 32px; }

	/* Blog list */
	.blog-list { padding: 50px 0 80px; }
}

@media (max-width: 480px) {
	.hero-title { font-size: 26px; }
	.btn { padding: 12px 22px; font-size: 13px; }
	.tx-points li { font-size: 13px; }
}

/* Touch-only behavior */
@media (hover: none) {
	.post-card:hover { transform: none; }
	.tour-item:hover img { transform: none; }
}

/* =========================================================================
   DIRECTIONS PAGE – Responsive
   ========================================================================= */
@media (max-width: 1024px) {
	.dir-info-grid { grid-template-columns: 1fr; gap: 50px; }
}

@media (max-width: 820px) {
	.dir-info { padding: 60px 0 50px; }
	.dir-info-title { font-size: 32px; letter-spacing: -.03em; }
	.dir-info-intro { font-size: 14.5px; line-height: 1.8; }
	.dir-info-right { grid-template-columns: 1fr; gap: 14px; }
	.dir-card { padding: 24px 22px; }
	.dir-card-title { font-size: 17px; }
	.dir-hours-list li { grid-template-columns: 78px 1fr; padding: 12px 0; gap: 12px; }
	.dir-hours-day { font-size: 12.5px; }
	.dir-hours-time { font-size: 12.5px; }
	.dir-access-list li { font-size: 13px; gap: 10px; }
	.dir-pill { padding: 12px 22px; font-size: 13px; }

	.dir-map { padding: 50px 0 70px; }
	.dir-map-head { margin-bottom: 28px; }
	.dir-map-title { font-size: 24px; }
	.dir-map-address { font-size: 13.5px; }
	.dir-map-wrap iframe { height: 340px; }
}

/* =========================================================================
   STORY + DIRECTIONS DARK MAP – Responsive
   ========================================================================= */
@media (max-width: 1024px) {
	.story-doctor-grid { grid-template-columns: 1fr; gap: 40px; }
	.story-clinic-grid { grid-template-columns: repeat(2, 1fr); }
	.story-equip-grid { grid-template-columns: repeat(2, 1fr); }
	.story-philo-list { grid-template-columns: 1fr; gap: 14px; }
}

@media (max-width: 820px) {
	.story-section { padding: 60px 0; }
	.story-section-head { margin-bottom: 30px; }
	.story-section-title { font-size: 26px; }
	.story-doctor-content .story-section-title { font-size: 30px; }
	.story-doctor-quote { font-size: 14.5px; padding-left: 14px; }
	.story-clinic-grid { grid-template-columns: 1fr 1fr; gap: 14px; }
	.story-equip-grid { grid-template-columns: 1fr; }
	.story-equip-item { padding: 26px 22px; }
	.story-philo-list li { padding: 26px 22px; }

	/* Dark map hero */
	.dir-map-hero { padding: 60px 0 70px; }
	.dir-map-hero .dir-map-title { font-size: 26px; }
	.dir-map-frame iframe { height: 320px; }
	.dir-map-buttons {
		grid-template-columns: 1fr;
		gap: 8px;
		max-width: 360px;
	}
	.dir-map-btn { padding: 13px 18px; font-size: 13px; }
}

/* =========================================================================
   404 + JOURNAL – Responsive
   ========================================================================= */
@media (max-width: 820px) {
	.notfound-hero { padding: 70px 0 60px; }
	.notfound-num { font-size: 90px; }
	.notfound-title { font-size: 26px; }
	.notfound-sub { font-size: 13.5px; }
	.notfound-suggest { padding: 60px 0 80px; }
	.notfound-cards { grid-template-columns: 1fr; gap: 10px; }
	.notfound-card { padding: 18px 20px; gap: 14px; }
	.notfound-card-ico { width: 40px; height: 40px; }
	.notfound-card-ico svg { width: 20px; height: 20px; }
	.notfound-card-title { font-size: 15.5px; }

	.journal-magazine { padding: 50px 0 70px; }
}

/* =========================================================================
   SCHEDULE + LANG SWITCHER – Responsive
   ========================================================================= */
@media (max-width: 1024px) {
	.dir-schedule-grid { grid-template-columns: 1fr; gap: 40px; }
}

@media (max-width: 820px) {
	.dir-schedule { padding: 50px 0; }
	.dir-schedule-title { font-size: 26px; }
	.dir-schedule-cells { gap: 10px; }
	.dir-schedule-cell-head { padding: 10px 10px; font-size: 11.5px; }
	.dir-schedule-cell-body { padding: 18px 8px 14px; }
	.dir-schedule-day { font-size: 40px; }
	.dir-schedule-dow { font-size: 11px; }
	.dir-schedule-cell-foot { padding: 10px 8px; font-size: 11px; }

	/* Header language switcher hidden on mobile (visible in drawer) */
	/* but flags should still show if visible */
	.lang-btn { gap: 5px; padding: 6px 10px; }
	.lang-flag { font-size: 13px; }
	.lang-code { font-size: 11px; }

	/* Treatments – overlap card responsive */
	.tx-cards { gap: 36px 0; grid-template-columns: 1fr; }
	.tx-card-thumb { margin-bottom: -50px; }
	.tx-card-num { font-size: 44px; }
	.tx-card-title { font-size: 21px; }
	.tx-card-body { padding: 22px 22px 24px; }
}

/* =========================================================================
   FRONT PAGE – Responsive
   ========================================================================= */
@media (max-width: 1024px) {
	.front-tips-grid { grid-template-columns: repeat(2, 1fr); }
	.front-column-grid { grid-template-columns: 1fr 1fr; gap: 18px; }
	.front-column-card.is-featured { grid-column: 1 / -1; }
	.front-column-card.is-featured .front-column-thumb { aspect-ratio: 16/8; }
}

@media (max-width: 820px) {
	.front-about { padding: 60px 0; }
	.front-about-title { font-size: 26px; }
	.front-about-text { font-size: 14.5px; }
	.front-about-cta { padding: 14px 24px 14px 28px; font-size: 13.5px; }

	.front-section-head { margin-bottom: 30px; }
	.front-section-title { font-size: 26px; }
	.front-section-sub { font-size: 13.5px; }

	.front-tips { padding: 60px 0; }
	.front-tips-grid { grid-template-columns: 1fr; gap: 16px; }

	.front-column { padding: 60px 0; }
	.front-column-grid { grid-template-columns: 1fr; gap: 14px; }
	.front-column-card.is-featured .front-column-body { padding: 22px 22px 24px; }
	.front-column-card.is-featured .front-column-title { font-size: 20px; }
	.front-column-title { font-size: 17px; }

	.front-magazine { padding: 60px 0 70px; }
}

/* =========================================================================
   Schedule modal – Responsive
   ========================================================================= */
@media (max-width: 820px) {
	.dir-schedule-trigger { padding: 30px 0; }
	.schedule-trigger-btn { padding: 16px 18px; gap: 14px; }
	.schedule-trigger-ico { width: 44px; height: 44px; }
	.schedule-trigger-ico svg { width: 22px; height: 22px; }
	.schedule-trigger-title { font-size: 15px; }
	.schedule-trigger-eyebrow { font-size: 10.5px; }

	.schedule-modal { padding: 0; align-items: flex-end; }
	.schedule-modal-panel {
		padding: 32px 22px 24px;
		max-height: 90vh;
		border-radius: 18px 18px 0 0;
		transform: translateY(40px);
	}
	.schedule-modal.is-open .schedule-modal-panel { transform: translateY(0); }
	.schedule-modal-title { font-size: 22px; }

	.schedule-cal { padding: 16px 14px 14px; }
	.schedule-cal-grid { gap: 4px; }
	.schedule-cal-dow { font-size: 10px; padding: 6px 0; }
	.schedule-cal-num { font-size: 13px; }
	.schedule-cal-tag { font-size: 8px; margin-top: 2px; }

	.schedule-list-row { padding: 14px; gap: 14px; }
	.schedule-list-num { font-size: 26px; }
	.schedule-list-info strong { font-size: 14px; }
}

/* =========================================================================
   MOBILE OPTIMIZATION – Readability + 2-column grids
   Final overrides for mobile (820px and below).
   ========================================================================= */
@media (max-width: 820px) {

	/* ----- Base typography readability ----- */
	html, body {
		font-size: 15px;
		line-height: 1.65;
	}
	body {
		-webkit-text-size-adjust: 100%;
	}

	/* ----- Container padding ----- */
	.container { padding-left: 20px; padding-right: 20px; }
	.container.narrow { padding-left: 20px; padding-right: 20px; }

	/* ----- Section heads (front page sections 3 & 4) ----- */
	.front-section-head {
		flex-direction: column;
		align-items: flex-start;
		gap: 16px;
		margin-bottom: 24px;
	}
	.front-section-eyebrow { font-size: 10.5px; letter-spacing: .25em; }
	.front-section-title { font-size: 22px; line-height: 1.3; }
	.front-section-sub { font-size: 13.5px; line-height: 1.7; }
	.front-section-link { font-size: 13px; padding: 6px 0; }

	/* ----- Front-page magazine sections: 2-COLUMN on mobile ----- */
	.front-tips-grid {
		grid-template-columns: 1fr 1fr;
		gap: 12px;
	}
	.front-tips { padding: 48px 0; }

	/* Magazine cards – tighter on mobile 2-col */
	.mag-card-thumb { aspect-ratio: 4/3; }
	.mag-card-body { padding: 14px 14px 16px; }
	.mag-card-cat {
		font-size: 9.5px;
		padding: 3px 8px;
		left: 10px; top: 10px;
		letter-spacing: .02em;
	}
	.mag-card-title {
		font-size: 14px;
		line-height: 1.45;
		margin-bottom: 6px;
		-webkit-line-clamp: 3;
	}
	.mag-card-excerpt {
		font-size: 11.5px;
		line-height: 1.6;
		margin-bottom: 10px;
		-webkit-line-clamp: 2;
	}
	.mag-card-meta {
		padding-top: 8px;
	}
	.mag-card-date { font-size: 10.5px; }
	.mag-card-more { font-size: 10.5px; }

	/* ----- Doctor's column: 2-col on mobile ----- */
	.front-column { padding: 48px 0; }
	.front-column-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
	/* Featured card spans both columns */
	.front-column-card.is-featured {
		grid-column: 1 / -1;
	}
	.front-column-card.is-featured .front-column-thumb {
		aspect-ratio: 16/9;
	}
	.front-column-card.is-featured .front-column-body {
		padding: 20px 18px 22px;
	}
	.front-column-card.is-featured .front-column-title {
		font-size: 17px;
		-webkit-line-clamp: 2;
	}
	.front-column-card.is-featured .front-column-excerpt {
		font-size: 12.5px;
		-webkit-line-clamp: 2;
	}
	/* Regular cards in 2-col */
	.front-column-card .front-column-thumb { aspect-ratio: 4/3; }
	.front-column-body { padding: 14px 14px 16px; }
	.front-column-tag {
		font-size: 9px;
		padding: 3px 7px;
		letter-spacing: .1em;
		margin-bottom: 8px;
	}
	.front-column-title {
		font-size: 13.5px;
		line-height: 1.4;
		margin-bottom: 6px;
		-webkit-line-clamp: 3;
	}
	.front-column-excerpt {
		font-size: 11.5px;
		line-height: 1.6;
		-webkit-line-clamp: 2;
		margin-bottom: 10px;
	}
	.front-column-meta {
		gap: 8px;
		padding-top: 10px;
		flex-wrap: wrap;
	}
	.front-column-author { font-size: 10.5px; }
	.front-column-date { font-size: 10px; }

	/* ----- Treatment magazine grid: 2-col on mobile ----- */
	.front-magazine { padding: 48px 0 60px; }
	.front-magazine .mag-posts { grid-template-columns: 1fr 1fr; gap: 12px; }

	/* ----- Treatment cards (treatments page): 1-col with text-overlap intact ----- */
	.tx-cards { grid-template-columns: 1fr; gap: 32px; }

	/* ----- Section header on magazine (centered) ----- */
	.section-title { font-size: 22px; line-height: 1.3; }
	.section-eyebrow { font-size: 10.5px; letter-spacing: .25em; }
	.section-sub { font-size: 13px; line-height: 1.7; }

	/* ----- About banner readability ----- */
	.front-about { padding: 50px 0 56px; }
	.front-about-title { font-size: 24px; line-height: 1.3; }
	.front-about-text { font-size: 14px; line-height: 1.85; margin-bottom: 28px; }
	.front-about-cta { padding: 13px 22px 13px 26px; font-size: 13px; }

	/* ----- Body text readability ----- */
	.article-body p {
		font-size: 15.5px;
		line-height: 1.85;
	}
	.article-body h2 { font-size: 22px; line-height: 1.35; }
	.article-body h3 { font-size: 18px; line-height: 1.4; }
	.article-body ul, .article-body ol { font-size: 15px; line-height: 1.85; }

	/* ----- Header height tweak for mobile ----- */
	.site-header { padding: 14px 0; }
	.site-branding .site-title { font-size: 17px; }
	.site-branding .site-tagline { font-size: 10px; }

	/* ----- Footer readability ----- */
	.footer-inner { grid-template-columns: 1fr; gap: 28px; padding: 50px 0; }
	.footer-col h4 { font-size: 14px; margin-bottom: 14px; }
	.footer-hours li,
	.footer-address,
	.footer-tel { font-size: 13.5px; }

	/* ----- 404 mobile ----- */
	.notfound-num { font-size: 80px; }
	.notfound-title { font-size: 22px; }
	.notfound-sub { font-size: 13px; }
}

/* Extra small phones (under 380px) */
@media (max-width: 380px) {
	.front-tips-grid,
	.front-column-grid,
	.front-magazine .mag-posts {
		grid-template-columns: 1fr;
		gap: 14px;
	}
	.mag-card-title { font-size: 16px; -webkit-line-clamp: 2; }
	.front-column-title { font-size: 15.5px; -webkit-line-clamp: 2; }
	.front-column-card.is-featured .front-column-title { font-size: 18px; }
}

/* =========================================================================
   Hero image — collapse only when truly empty (PHP already omits empty hero)
   ========================================================================= */
.hero-imageonly .hero-bg img[src=""],
.hero-imageonly .hero-bg img:not([src]) {
	display: none;
}


/* =========================================================================
   FORCE: main content starts right after header on mobile
   No empty whitespace between header and first section.
   ========================================================================= */
@media (max-width: 820px) {
	.site-main.front-main {
		padding-top: 0 !important;
		margin-top: 0 !important;
	}
	.site-main.front-main > *:first-child {
		margin-top: 0 !important;
		padding-top: 0 !important;
	}
	/* If first child is empty/hidden hero, ensure next-of-type displays at the top */
	.site-main.front-main .hero-imageonly + .front-schedule-bar,
	.site-main.front-main .hero-imageonly + .front-about {
		margin-top: 0 !important;
	}

	/* Absolute fallback: if first child is just an empty box, give it 0 height */
	.site-main > section:first-child:empty,
	.site-main > section:first-child:has(.hero-bg:empty) {
		display: none !important;
		height: 0 !important;
	}
}

/* =========================================================================
   MOBILE DRAWER FIX – ensure menu items don't get cut off by header
   ========================================================================= */
@media (max-width: 820px) {
	.site-header {
		height: 60px;
		padding: 0;
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		z-index: 100;
		background: var(--white);
		box-shadow: 0 1px 0 var(--border-light);
	}
	.site-branding .site-title { font-size: 16px; }
	.site-branding .site-tagline { font-size: 9.5px; letter-spacing: .15em; }

	/* Push body content below fixed header */
	body {
		padding-top: 60px;
	}

	/* Mobile drawer — start below header, give breathing room */
	.mobile-drawer {
		top: 60px !important;
		padding: 30px 24px 40px !important;
		z-index: 99 !important;
		min-height: calc(100vh - 60px);
		background: var(--white);
	}
	.mobile-menu {
		margin: 0 0 24px !important;
	}
	.mobile-menu li a {
		padding: 16px 0;
		font-family: var(--font-display);
		font-size: 18px;
		font-weight: 600;
		letter-spacing: -.015em;
	}
	.mobile-menu li:first-child a {
		padding-top: 8px;
	}
	.mobile-menu li:last-child a {
		border-bottom: 1px solid var(--border-light);
	}

	/* Hide desktop language switcher on mobile (drawer has its own) */
	.site-header .lang-switcher { display: none; }

	/* Menu toggle button positioning */
	.menu-toggle {
		width: 44px;
		height: 44px;
	}
}

/* Schedule modal panel mobile fix - prevent header overlap */
@media (max-width: 820px) {
	body.no-scroll {
		padding-top: 0 !important;
	}
	body.no-scroll .site-header { display: none; }
}

/* =========================================================================
   HERO – mobile gap removal (visibility handled in main.css media queries)
   ========================================================================= */
@media (max-width: 820px) {
	.hero-imageonly {
		margin: 0 !important;
		padding: 0 !important;
		font-size: 0 !important;
		line-height: 0 !important;
		display: block !important;
	}
	.hero-imageonly .hero-bg {
		margin: 0 !important;
		padding: 0 !important;
		font-size: 0 !important;
		line-height: 0 !important;
		display: block !important;
	}
	.hero-imageonly .hero-bg img {
		margin: 0 !important;
		padding: 0 !important;
		vertical-align: top !important;
		max-height: none !important;
		width: 100% !important;
		height: auto !important;
	}
	/* CRITICAL: hide desktop image, show mobile image */
	.hero-imageonly .hero-img-desktop { display: none !important; }
	.hero-imageonly .hero-img-mobile  { display: block !important; }
	/* The schedule section right after hero should sit flush */
	.hero-imageonly + .hero-schedule,
	.hero-imageonly + .front-schedule-bar,
	.hero-imageonly + .front-about {
		margin-top: 0 !important;
	}
}