/* ==========================================================================
   Responsive
   Breakpoints: 1200 (side rail), 1024 (tablet), 767 (mobile), 400 (small)
   ========================================================================== */

/* Wide desktop: show the dot navigation and reserve a rail so it never overlaps content. */
@media (min-width: 1200px) {
	.sf-landing { --sf-rail: 190px; }
	.sf-sidenav:not([hidden]) { display: block; }
	.sf-landing .sf-landing-content { padding-right: var(--sf-rail); }
}
@media (min-width: 1200px) and (max-height: 600px) {
	.sf-sidenav { --row: 48px; }
	.sf-sidenav__title { display: none; }
}

/* Tablet & below: hide header links, show burger. */
@media (max-width: 1024px) {
	.sf-header__nav, .sf-header__cta { display: none; }
	.sf-burger { display: inline-flex; }
	.e-con.sf-grid, .sf-grid > .e-con-inner,
	.e-con.sf-grid--4, .sf-grid--4 > .e-con-inner { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.sf-footer__grid { grid-template-columns: 1fr 1fr; }
	.e-con.sf-timeline, .sf-timeline > .e-con-inner { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 40px; }
	.e-con.sf-timeline::before { display: none; }
}

/* Mobile */
@media (max-width: 767px) {
	:root { --sf-header-h: 68px; --sf-header-h-sm: 60px; }
	.sf-header__inner { width: calc(100% - 32px); padding-top: env(safe-area-inset-top); gap: 12px; }
	.sf-header { height: calc(var(--sf-header-h) + env(safe-area-inset-top)); }
	.sf-header.is-scrolled { height: calc(var(--sf-header-h-sm) + env(safe-area-inset-top)); }
	.sf-logo__mark--desktop { display: none; }
	.sf-logo__mark--mobile { display: inline-flex; }
	.sf-logo__mark svg, .sf-logo__img { width: 38px; height: 38px; }
	.sf-logo__fa { display: none; }

	.e-con.sf-grid, .sf-grid > .e-con-inner,
	.e-con.sf-grid--2, .sf-grid--2 > .e-con-inner,
	.e-con.sf-grid--4, .sf-grid--4 > .e-con-inner { grid-template-columns: minmax(0, 1fr); }

	/* Hero: copy first, photo below, cropped wider. */
	.e-con.sf-hero__content, .e-con.sf-hero__media,
	.e-con.sf-about__media, .e-con.sf-about__content,
	.e-con.sf-contact__info, .e-con.sf-contact__form { flex: 1 1 auto; width: 100%; }
	.sf-hero-photo, .sf-about-photo { max-width: 100%; }
	.sf-hero-photo img, .sf-about-photo img { aspect-ratio: 5 / 4; border-radius: 24px; object-position: var(--sf-face-pos-mobile, 50% 22%); }
	.sf-hero-photo::after { border-radius: 24px; }
	.sf-hero-photo::before { display: none; }
	.sf-hero .sf-btns .sf-btn-w { flex: 1 1 100%; }
	.sf-hero .sf-btns .elementor-button { width: 100%; justify-content: center; }
	.sf-hero .sf-btns .sf-btn-w--link { flex-basis: auto; }

	/* Vertical timeline with the line through the circles. */
	.e-con.sf-timeline, .sf-timeline > .e-con-inner { grid-template-columns: minmax(0, 1fr); row-gap: 30px; }
	/* One segment per step, from this circle to the next — never past the last one. */
	.e-con.sf-timeline::before { display: none; }
	.e-con.sf-step:not(:last-child)::after {
		content: ""; position: absolute; right: 24.5px; left: auto; top: 58px; bottom: -22px; width: 1px; height: auto;
		background: linear-gradient(180deg, var(--sf-primary), var(--sf-line));
	}
	.e-con.sf-step { padding-right: 70px; min-height: 50px; }
	.sf-step .sf-step__num { position: absolute; top: 0; right: 0; }

	.sf-form__row { grid-template-columns: minmax(0, 1fr); }
	.sf-form__foot .sf-btn { width: 100%; }

	.sf-footer { padding: 28px 12px calc(12px + env(safe-area-inset-bottom)); }
	.sf-footer__glass { border-radius: 22px; padding-top: 32px; }
	.sf-footer__grid { grid-template-columns: minmax(0, 1fr); gap: 28px; }
	.sf-footer__bar { flex-direction: column-reverse; align-items: flex-start; }

	.sf-story::after { width: 160px; height: 160px; top: 6%; }
}

@media (max-width: 400px) {
	body .sf-btn-w .elementor-button { padding-inline: 20px; }
	.sf-mobile__panel { width: 88vw; }
}
