/* Fonts: Fira Sans from assets/fonts (weights used in Figma) */
@font-face {
	font-family: 'Fira Sans';
	src: url('assets/fonts/FiraSans-Light.ttf') format('truetype');
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Fira Sans';
	src: url('assets/fonts/FiraSans-Regular.ttf') format('truetype');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Fira Sans';
	src: url('assets/fonts/FiraSans-Medium.ttf') format('truetype');
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Fira Sans';
	src: url('assets/fonts/FiraSans-SemiBold.ttf') format('truetype');
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Fira Sans';
	src: url('assets/fonts/FiraSans-Bold.ttf') format('truetype');
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Fira Sans';
	src: url('assets/fonts/FiraSans-ExtraBold.ttf') format('truetype');
	font-weight: 800;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Fira Sans';
	src: url('assets/fonts/FiraSans-Black.ttf') format('truetype');
	font-weight: 900;
	font-style: normal;
	font-display: swap;
}

/* Fira Sans Condensed */
@font-face {
	font-family: 'Fira Sans Condensed';
	src: url('assets/fonts/FiraSansCondensed-Regular.ttf') format('truetype');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Fira Sans Condensed';
	src: url('assets/fonts/FiraSansCondensed-SemiBold.ttf') format('truetype');
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Fira Sans Condensed';
	src: url('assets/fonts/FiraSansCondensed-Bold.ttf') format('truetype');
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Fira Sans Condensed';
	src: url('assets/fonts/FiraSansCondensed-ExtraBold.ttf') format('truetype');
	font-weight: 800;
	font-style: normal;
	font-display: swap;
}

/* Base layout */
:root {
	--page-max: 2560px;
	--content-max: 1240px; /* unified content max width */
	--content-gutter: 24px; /* horizontal padding for content */
	--cta-width: 1022px; /* header.svg intrinsic width */
	--cta-height: 112px; /* header.svg intrinsic height */
	--hero-cta-mobile-h: 0px; /* runtime-measured height of fixed mobile CTA */
	--brand-orange: #E73900;
	--text-dark: #1E1E1E;
	--muted: #5F6978;
	--chip-bg: #EFEFEF;
	--cta-crop-right: 0px; /* amount to crop Vector.svg on the right in hero CTA */
	--whyus-icon-w: 190px; /* default width for why us SVG icons */
}

body {
	background-color: #fff; /* outer gray like on mock */
	font-family: 'Fira Sans', Arial, sans-serif;
	overflow-x: hidden;
}
.page {
	width: min(var(--page-max), 100%);
	margin: 0 auto;
	background: #FFFFFF;
	position: relative;
}

.container-fluid {
	max-width: min(var(--page-max), 100%);
}

/* Constrain content width consistently (except full-bleed blocks like carousel) */
.site-header .container-fluid,
.sticky-header .container-fluid,
.mobile-sticky .container-fluid,
.hero .container-fluid,
.section-why .container-fluid,
.section-delivery .container-fluid,
.section-features .container-fluid,
.section-map .container-fluid,
.site-footer .container-fluid {
	max-width: var(--content-max);
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--content-gutter);
	padding-right: var(--content-gutter);
}

/* Sticky header: keep container-fluid but don't center it.
   Remove right auto-centering and avoid pushing from the left. */
.sticky-header .container-fluid {
	margin-right: auto !important;
	margin-left: auto !important;
}

/* Utility to make child go full viewport width even inside constrained container */
.full-bleed {
	position: relative;
	left: 50%;
	transform: translateX(-50%);
	/* match the centered page width on large screens, fallback to 100vw on small */
	width: min(100vw, var(--page-max));
	max-width: 100%;
}

/* Utility to align an element's left edge with the content container's left edge,
   without constraining its own width (used for calculator form only). */
.align-left-to-content {
	padding-left: calc((min(100%, var(--page-max)) - var(--content-max)) / 2 + var(--content-gutter));
}
@media (max-width: calc(var(--content-max) + 2 * var(--content-gutter))) {
	.align-left-to-content {
		padding-left: var(--content-gutter);
	}
}

/* HERO */
.hero {
	min-height: 100vh;
	background: #000; /* fallback color only */
	justify-content: flex-start; /* keep content pinned to the left */
}
.hero .container-fluid { margin-left: auto; margin-right: auto; }
.hero .col-lg-8 { max-width: 820px; }

.hero-video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: 0;
}

.hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(0,0,0,0.25) 0%, rgba(0,0,0,0.35) 60%, rgba(0,0,0,0.55) 100%);
	pointer-events: none;
	z-index: 1;
}

.hero .container-fluid,
.hero .hero-cta {
	position: relative;
	z-index: 2; /* keep content above overlay */
}

.text-shadow {
	text-shadow: 0 2px 12px rgba(0, 0, 0, 0.45);
}

/* Bottom CTA with header.svg background */
.hero-cta {
	bottom: -1px;
	right: 0;
	background: none;
	padding: 0;
	display: flex;
	align-items: center;
	overflow: hidden;
}
.hero-cta-shell { display: flex; align-items: stretch; height: var(--cta-height); max-width: 100vw; overflow: hidden; }
.hero-cta-bubble {
	flex: 0 0 100px;
	background: url("assets/images/Vector-cropped.svg") no-repeat left bottom / auto 100%;
}
.hero-cta-content {
	background: #FFFFFF;
	display: flex;
	align-items: center;
	padding: 10px 24px;
	height: 110px;
    margin-top: 2px;
	box-sizing: border-box; /* keep padding inside fixed height to match bubble */
	max-width: calc(100vw - 100px); /* keep content within viewport width accounting for bubble */
}

.hero-cta-inner {
	width: 100%;
	gap: 16px !important;
	justify-content: flex-start;
	flex-wrap: wrap !important; /* allow wrapping to avoid overflow in Safari */
	min-width: 0;
	align-items: center;
}
/* Ensure children don't shrink or wrap independently (Safari stability) */
.hero-cta-inner > * { flex: 0 1 auto; min-width: 0; }

/* Mobile hero CTA */
.hero-cta-mobile {
	display: none;
	position: fixed;
	left: 0;
	right: 0;
	bottom: 16px;
	z-index: 3;
	display: none;
    bottom: 0;
    background: #E8EEF1;
    padding-top: 20px;
    padding-bottom: 20px;
    border-radius: 22px 22px 0 0;
}
.hero-mobile-title {
	display: none;
	position: absolute;
	left: 16px;
	right: 16px;
	top: 64px;
	color: #FFF;
	text-shadow: 0 4px 4px rgba(0, 0, 0, 0.52);
	font-family: 'Fira Sans Condensed','Fira Sans',Arial,sans-serif;
	font-size: 20px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	text-transform: uppercase;
	z-index: 3;
}
.hero-mobile-btn {
	display: block;
	width: min(92vw, 380px);
	margin: 0 auto 10px auto;
	text-align: center;
	padding: 14px 18px;
	border-radius: 9px;
	color: #FFFFFF;
	text-decoration: none;
	text-transform: uppercase;
	font-family: 'Fira Sans Condensed','Fira Sans',Arial,sans-serif;
	font-weight: 700;
	font-size: 20px;
	letter-spacing: 0.02em;
}
.hero-mobile-btn--orange { background: #E73900; }
.hero-mobile-btn--dark { background: #1E1E1E; }

.hero-primary-btn {
	background-color: var(--brand-orange);
	border: none;
}

.hero-primary-btn:hover,
.hero-primary-btn:focus {
	background-color: #e95f00;
}

/* Social icons and spacing in hero CTA */
.hero-cta .btn {
	padding: 0 14px;
	border-radius: 20px !important;
	/* Responsive sizing to avoid oversized buttons in Safari */
	width: clamp(180px, 16vw, 240px);
	height: clamp(40px, 4vw, 50px);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: clamp(14px, 1.6vw, 18px) !important;
}
.hero-socials { gap: 12px; margin-left: auto; }
.hero-socials img { display: block; }
.wa-icon { width: 32px; height: 32px; }
.tg-icon { width: 38px; height: 32px; }

/* Safari-specific fixes: keep CTA items on one line and avoid overflow */
@supports (-webkit-touch-callout: none) {
	.hero-cta-content { padding: 8px 14px; }
	.hero-cta { left: 0; right: 0; } /* ensure full row anchoring in Safari */
	.hero-cta-shell { width: 100vw; max-width: 100vw; overflow: hidden; }
	.hero-cta-bubble { flex: 0 0 60px; } /* give more room to content */
	.hero-cta-content { width: calc(100vw - 60px); max-width: none; }
	.hero-cta-inner { gap: 8px !important; flex-wrap: nowrap !important; justify-content: space-between; }
	.hero-cta-inner > * { flex: 0 1 auto; min-width: 0; }
	.hero-cta .btn {
		width: auto;
		min-width: 160px;
		height: 46px;
		font-size: clamp(14px, 1.4vw, 17px) !important;
	}
	.hero-socials { margin-left: 12px; gap: 10px; }
	/* Force correct width calculation in Safari */
	.hero-cta-shell { width: -webkit-fill-available; max-width: 100vw; }
	.hero-cta-content { width: -webkit-fill-available; max-width: none; }
}

/* Laptop 1440px: make hero CTA more compact so it fits */
@media (max-width: 1500px) {
	/* Hero CTA shell and bubble */
	.hero-cta-shell { height: 82px; }
	.hero-cta-bubble { flex: 0 0 56px; }
	.hero-cta-content { padding: 6px 12px; height: 82px; margin-top: 0; box-sizing: border-box; }
	.hero-cta-inner { gap: 6px !important; }
	/* Buttons */
	.sticky-cta-btn { width: 125px; height: 25px; font-size: 10px; }
	.sticky-cta-btn { white-space: nowrap; }
	/* Socials spacing and icon sizes */
	.hero-socials { gap: 6px; margin-left: 4px; }
	.wa-icon { width: 26px; height: 26px; }
	.tg-icon { width: 30px; height: 26px; }
	/* Keep sticky CTA visually consistent at this breakpoint */
	.sticky-cta-content { padding: 5px 10px; }
	.sticky-cta-icons { gap: 8px; }
	.sticky-cta-icon { width: 30px; height: 30px; }
}

/* Force white title in hero and keep it left-aligned */
.hero h1 {
	color: #ffffff;
	text-align: left;
	margin-left: 0;
	font-family: 'Fira Sans Condensed', 'Fira Sans', Arial, sans-serif;
}
.hero .row { justify-content: flex-start; }
@media (min-width: 1200px) {
	.hero .col-lg-8 { padding-left: 0; }
}

/* Header styles for visibility over hero */
.nav-pill-bg {
	background: #FFFFFF;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
	border-radius: 10px;
	height: 40px;
	align-items: center;
	display: inline-flex;
	gap: 48px;
	padding: 0 18px !important;
}
.site-header .nav-link {
	color: #1E1E1E;
	text-transform: uppercase;
	font-weight: 700;
	font-size: 14px;
	letter-spacing: 0.02em;
	padding: 8px 0; /* vertical rhythm inside pill */
}
.site-header .nav-link:hover,
.site-header .nav-link:focus {
	color: #000000;
}
.site-header .navbar-brand {
	margin-right: 12px; /* bring menu closer */
}
.phone-icon { width: 18px; height: 18px; display: inline-block; }
.site-header .custom-navbar { display: flex; align-items: center; justify-content: center; gap: 50px; width: 100%; margin: 0 auto; position: relative; }
.site-header .custom-navbar { justify-content: space-between; gap: 24px; }
.site-header .custom-navbar .nav-left,
.site-header .custom-navbar .nav-right { margin-left: 0; flex: 1 1 0; display: flex; align-items: center; }
.site-header .custom-navbar .nav-left { justify-content: flex-start; }
.site-header .custom-navbar .nav-right { justify-content: flex-end; }
.site-header .custom-navbar .nav-center { flex: 0 0 auto; }
.site-header .custom-navbar .navbar-brand { margin: 0 !important; }
.site-header .custom-navbar .navbar-nav { display: flex; flex-direction: row; align-items: center; gap: 40px !important; }
.brand-logo {
	width: 250px;
	height: 55px;
	object-fit: contain;
	display: block;
    margin-right: 16px;
}

/* Responsive adjustments for laptops like 1366x768 */
@media (max-width: 1400px) {
	.brand-logo { width: 200px; height: 44px; }
	.hero h1 { font-size: clamp(28px, 4vw, 42px); }
	.delivery-img { height: 460px; }
	.feature-row { gap: 24px; }
	.feature-chip { padding: 22px 28px; font-size: 20px; }
	.feature-card { padding: 20px 22px; }
	.whyus-icons .whyus-icon { width: 200px; }
	.whyus-icons img[src$="20let.svg"],
	.whyus-icons img[src$="20000clients.svg"] { width: 230px; }
}

/* Improve navbar toggler visibility on dark backdrop */
.navbar-toggler {
	border-color: rgba(255,255,255,0.6);
}
.navbar-toggler-icon {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255,255,255,0.9)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* Ensure header sits above hero overlay */
.site-header {
	z-index: 10;
}

/* Mobile header (hidden on desktop) */
.mobile-header {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: 20;
	display: none;
	padding-top: 20px;
	/* black-to-transparent gradient, top -> bottom */
	background: linear-gradient(180deg, rgba(0,0,0,0.95) 0%, rgba(0,0,0,0.55) 60%, rgba(0,0,0,0.25) 80%, rgba(0,0,0,0.05) 95%, rgba(0,0,0,0) 100%);
	padding-bottom: 40px; /* increase gradient coverage height */
}
.mobile-icons {padding: 7px;}
.mobile-icons img { display: block; }
.mobile-burger { width: 32px; height: 22px; background: transparent; border: 0; padding: 0; display: inline-flex; flex-direction: column; justify-content: space-between; }
.mobile-burger span { display: none; }
.mobile-burger img { display: block; width: 32px; height: 22px; }
.mobile-sticky-cta {
	display: flex;
	align-items: center;
	gap: 0;
	flex: 1 1 auto;        /* занять всю доступную ширину */
	min-width: 0;          /* позволить содержимому ужиматься */
	justify-content: flex-end; /* иконки у правого края */
	width: 100%;
}
.mobile-sticky-bubble {
	flex: 0 0 30px;
	height: 36px;
	background: url("assets/images/Vector-cropped.svg") no-repeat left center / auto 100%;
}
.mobile-sticky .mobile-icons {
	background: #fff;
	padding: 7px 10px;
	flex: 1 1 auto;            /* растягиваем контейнер иконок */
	min-width: 0;
	justify-content: space-between; /* равномерное распределение */
	gap: 0;                    /* без фиксированного зазора */
	align-items: center;
}
.mobile-sticky {
	position: sticky;
	top: 0;
	z-index: 1500;
	background: #D9D9D9;
	display: none;
}
.mobile-sticky .mobile-burger span { background: #1E1E1E; }
/*.mobile-sticky::before {
	content: "";
	position: absolute;
	inset: 0 0 0 0;
	background: url("assets/images/Vector-cropped.svg") no-repeat top center / auto 100%;
	pointer-events: none;
}*/
.mobile-menu {
	position: fixed;
	inset: 0;
	background: #ffffff;
	z-index: 2000;
	display: none;
}
.mobile-menu.open { display: block; }
.mobile-menu-inner { padding: 16px; max-width: 560px; margin: 0 auto; }
.mobile-close { width: 28px; height: 28px; position: relative; border: 0; background: transparent; }
.mobile-close span { position: absolute; left: 2px; right: 2px; top: 13px; height: 2px; background: #1E1E1E; }
.mobile-close span:first-child { transform: rotate(45deg); }
.mobile-close span:last-child { transform: rotate(-45deg); }
.mobile-nav { display: grid; gap: 10px; margin-top: 16px; }
.mobile-nav-link {
	display: block;
	padding: 12px 14px;
	border-radius: 12px;
	background: #F5F5F5;
	color: #1E1E1E;
	text-decoration: none;
	text-transform: uppercase;
	font-family: 'Fira Sans Condensed','Fira Sans',Arial,sans-serif;
	font-weight: 700;
}

/* Mobile splash screen */
.mobile-splash {
	position: fixed;
	inset: 0;
	background: #FFFFFF; 
	z-index: 3000;
	display: none;
	align-items: center;
	justify-content: center;
	opacity: 1;
	transition: opacity .55s ease;
	will-change: opacity;
}
.mobile-splash .splash-center { display: flex; align-items: center; justify-content: center; }
.mobile-splash .splash-svg { display: block; }
.mobile-splash.hide { opacity: 0; visibility: hidden; pointer-events: none; }
@keyframes splash-draw-stroke { from { stroke-dashoffset: var(--d); } to { stroke-dashoffset: 0; } }
.splash-stroke path {
	fill: none;
	stroke: #1E1E1E;
	stroke-width: 1;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-dasharray: var(--d, 1200);
	stroke-dashoffset: var(--d, 1200);
	animation: splash-draw-stroke 2s ease forwards;
}
/* Replace stroke animation with pulsating logo image */
.mobile-splash .splash-svg { display: none; }
.mobile-splash .splash-logo {
	width: 250px;
	height: auto;
	display: block;
	animation: splash-pulse 1.2s ease-in-out infinite;
	transform-origin: center center;
}
@keyframes splash-pulse {
	0% { transform: scale(1); opacity: 1; }
	50% { transform: scale(1.06); opacity: 0.95; }
	100% { transform: scale(1); opacity: 1; }
}

/* Sticky header */
.sticky-header {
	position: sticky;
	top: 0;
	z-index: 1000;
	background: #D9D9D9;
	--sticky-h: 110px;
	/* Smooth reveal: keep in flow with zero height until active */
	display: block;
	height: 0;
	opacity: 0;
	transform: translateY(-10px);
	/* Avoid animating height to prevent Safari jitter; animate only transform/opacity */
	transition: opacity .3s ease, transform .35s ease;
	/* allow submenu to overflow beyond header bounds */
	overflow: visible;
	pointer-events: none;
	/* Safari stability */
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	will-change: transform, opacity;
	contain: paint;
}
.sticky-header.active {
	height: var(--sticky-h);
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}
.sticky-header.active .sticky-right {
	opacity: 1;
	transform: translate(var(--sr-shift-x), 0);
	pointer-events: auto;
}
.sticky-inner { min-height: var(--sticky-h); display: flex; align-items: center; position: relative; z-index: 1; }
.sticky-grid { display: flex; align-items: center; width: 100%; }
.sticky-left { display: flex; align-items: center; gap: 12px; min-width: 0; flex: 1 1 auto; }
.sticky-right {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	padding-left: 24px;
	padding-right: var(--content-gutter);
	display: flex; align-items: center; justify-content: flex-end;
	min-height: var(--sticky-h);
	/* appear slightly after the header */
	opacity: 0;
	/* horizontal visual shift to the viewport edge without affecting layout */
	--sr-shift-x: calc((100vw - min(var(--content-max), 100vw)) / 2);
	transform: translate(var(--sr-shift-x), -6px) translateZ(0);
	transition: opacity .3s ease .12s, transform .35s ease .12s;
	pointer-events: none;
	/* Safari stability */
	-webkit-transform: translate(var(--sr-shift-x), -6px) translateZ(0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	will-change: transform, opacity;
}
.sticky-header::after {
	content: "";
	position: absolute;
	top: 0; right: 0;
	height: 100%;
	width: 100%;
	background: none;
	pointer-events: none;
	z-index: 0;
}
.sticky-right::before {
	display: none; /* replaced by structured bubble + content wrapper */
}
.sticky-right > * {
	position: relative;
	z-index: 1;
}
.sticky-right::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	/* start where white content begins, right of bubble, end at container edge */
	left: 160px;
	right: 0;
	background: #FFFFFF;
	z-index: 0;
}
.sticky-cta-shell { display: flex; align-items: stretch; height: var(--sticky-h); }
.sticky-cta-bubble {
	flex: 0 0 100px;
	background: url("assets/images/Vector-cropped.svg") no-repeat left center / auto 100%;
}
.sticky-cta-content {
	background: #FFFFFF;
	display: flex;
	align-items: center;
	padding: 8px 14px;
	border-top-right-radius: 18px;
	border-bottom-right-radius: 18px;
	min-width: 0;
}
/* Hero/Sticky CTA min-width by resolution */
/* Trigger at >=1920px width (height may be <1080 due to browser chrome) */
@media (min-width: 1920px) and (max-width: 2559.98px) {
	.hero-cta-content,
	.sticky-cta-content { min-width: 950px; }
}
@media (min-width: 2560px) {
	.hero-cta-content,
	.sticky-cta-content { min-width: 1250px; }
}
.sticky-cta { position: static !important; width: auto; padding: 0; background: none; }
.sticky-cta-inner { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.sticky-cta-btn {
	width: 255px; height: 50px; border-radius: 20px;
	display: inline-flex; align-items: center; justify-content: center;
	font-family: 'Fira Sans Condensed','Fira Sans',Arial,sans-serif;
	font-weight: 700; text-transform: uppercase;
	color: #fff; text-decoration: none;
	font-size: 20px;
	white-space: nowrap;
}
.sticky-cta-btn--orange { background: #E73900; }
.sticky-cta-btn--dark { background: #1A1A1A; }
.sticky-cta-icons { display: inline-flex; align-items: center; gap: 12px; }
.sticky-cta-icon { display: block; }
.burger { width: 39px; height: 26px; background: transparent; border: 0; padding: 0; }
.burger span { display: block; height: 4px; background: #ffffff; border-radius: 2px; }
.sticky-burger { position: relative; display: inline-block; }
.sticky-submenu {
	position: absolute;
	top: 100%;
	left: 0;
	margin-top: 8px;
	padding: 8px;
	border-radius: 21px;
	background: rgba(255,255,255,0.57);
	box-shadow: 0 8px 24px rgba(0,0,0,0.08);
	backdrop-filter: blur(4px);
	opacity: 0;
	transform: translateY(6px);
	visibility: hidden;
	pointer-events: none;
	transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s;
	z-index: 1100; /* above sticky-right and other elements */
	min-width: 220px;
}
.sticky-burger:hover .sticky-submenu,
.sticky-submenu:hover {
	opacity: 1;
	transform: translateY(0);
	visibility: visible;
	pointer-events: auto;
	transition-delay: 0s;
}
.sticky-submenu .nav-link {
	color: #1E1E1E;
	text-transform: uppercase;
	font-weight: 700;
	font-size: 14px;
	letter-spacing: 0.02em;
	padding: 8px 12px;
	display: block;
	border-radius: 12px;
	text-decoration: none;
}
.sticky-submenu .nav-link:hover,
.sticky-submenu .nav-link:focus {
	/*background: rgba(255,255,255,0.8);*/
	text-decoration: none;
	color: #E73900;
}
.sticky-pill {
	width: 243px;
	height: 50px;
	border-radius: 20px;
	display: inline-flex; align-items: center; justify-content: center;
	font-family: 'Fira Sans Condensed','Fira Sans',Arial,sans-serif;
	font-weight: 700; text-transform: uppercase;
	color: #fff !important;
}
.sticky-pill--orange { background: #E73900; }
.sticky-pill--dark { background: #1A1A1A; }

/* (CTA follows sticky header was removed per request - CTA remains in hero) */

@media (max-width: 576px) {
	.sticky-inner { min-height: 88px; }
	.sticky-grid { grid-template-columns: 1fr; gap: 8px; }
	.sticky-right { padding-left: 0; --sr-shift-x: 0; right: 0; transform: translate(0, -6px); }
	.sticky-right::before { display: none; }
	.sticky-right::after { display: none; }
	.sticky-right { margin-right: 0; padding-right: 0; }
	.sticky-pill { width: 100%; height: 44px; border-radius: 16px; }
}
/* Sections */
.section-title {
	font-weight: 700;
	font-size: 32px;
	line-height: 38px;
	text-transform: uppercase;
	color: var(--text-dark);
	font-family: 'Fira Sans Condensed', 'Fira Sans', Arial, sans-serif;
}
.section-lead {
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
	color: var(--muted);
}
.text-orange {
	color: var(--brand-orange) !important;
}

/* Почему мы */
.why-metrics .metric {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 4px;
}
.why-item { flex-direction: row; align-items: center; gap: 16px; }
.why-leading .why-v-icon { width: 32px; height: 32px; display: block; }
.why-num { font-weight: 800; font-size: 86px; line-height: 1; }
.why-label { display: flex; flex-direction: column; line-height: 1.1; }
.why-line { display: flex; align-items: center; gap: 8px; }
.why-label span { font-weight: 800; font-size: 29px; color: #1E1E1E; }
.why-check { width: 32px; height: 24px; display: inline-block; }
.why-metrics .metric-value {
	font-weight: 800;
	font-size: 72px;
	line-height: 1;
	color: var(--text-dark);
}
.why-metrics .metric-sub {
	font-weight: 700;
	font-size: 18px;
	text-transform: uppercase;
}
.why-metrics .metric-label {
	font-weight: 600;
	font-size: 20px;
	text-transform: none;
	color: var(--text-dark);
}

/* Как доставляем */
.delivery-card {
	border-radius: 36px;
	overflow: hidden;
	position: relative;
	display: inline-block;
	margin: 0 auto;
}
.delivery-cards > [class^="col-"],
.delivery-cards > [class*=" col-"] {
	text-align: center;
}
.delivery-img {
	width: auto;
	height: auto;
	max-width: 100%;
	display: block;
	margin-left: auto;
	margin-right: auto;
	border-radius: 36px;
}
.delivery-card.with-caption .delivery-caption {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	color: #ffffff;
	font-size: 13px;
	line-height: 1.35;
	padding: 18px 22px 20px 22px;
	background: linear-gradient(180deg, rgba(0,0,0,0.0) 0%, rgba(0,0,0,0.99) 50%);
	border-bottom-left-radius: 36px;
	border-bottom-right-radius: 36px;
	opacity: 0;
	transform: translateY(10px);
	transition: opacity .4s ease, transform .4s ease;
	text-align: left;
}

/* Mobile swipe-only "Как доставляем" */
.section-delivery-mobile { display: none; }
.delivery-mobile-track {
	display: flex;
	gap: 6px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	padding: 0 6vw 12px;
	scroll-padding: 0 6vw;
	-webkit-overflow-scrolling: touch;
}
.delivery-mobile-track::-webkit-scrollbar { display: none; }
.mdelivery-item {
	flex: 0 0 80vw; /* уже, чтобы карточки были ближе и видны "ушки" соседей */
	scroll-snap-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.mdelivery-desc {
	background: #E8EEF2;
	border-radius: 0 0 28px 28px;
	padding: 14px 18px 18px;
	width: 100%;
	box-sizing: border-box;
	margin-top: -3rem;
    padding-top: 3.5rem;
}
.delivery-mobile-title {
	color: #FFFFFF;
	font-family: 'Fira Sans Condensed','Fira Sans',Arial,sans-serif;
	font-style: normal;
	font-weight: 600;
	line-height: normal;
	text-transform: uppercase;
	font-size: 18px;
}

/* Заголовок на градиенте снизу изображения всегда виден в моб. секции */
.section-delivery-mobile .delivery-card.with-caption .delivery-caption {
	opacity: 1;
	transform: none;
	background: linear-gradient(0deg, #000 3.36%, rgba(0, 0, 0, 0.07) 71.85%, rgba(0, 0, 0, 0.00) 90.92%);
	  
}
/* Изображение на мобилке растягивается до ширины карточки,
   чтобы заголовок не выходил за его границы */
.section-delivery-mobile .delivery-img {
	width: 100%;
	height: auto;
}
/* Карточка растягивается по ширине элемента, чтобы текст совпадал по ширине */
.section-delivery-mobile .delivery-card { width: 100%; display: block; }
/* Показывать описание только у активной карточки */
.section-delivery-mobile .mdelivery-item:not(.active) .mdelivery-desc { display: none; }
.section-delivery-mobile .mdelivery-item.active .mdelivery-desc { display: block; }

.delivery-btn {
	display: inline-block;
	min-width: 0;
	padding: 14px 28px;
	border-radius: 16px;
	background: #1E1E1E;
	color: #FFFFFF;
	text-decoration: none;
	text-transform: uppercase;
	font-weight: 700;
}
/* Hide button for the active card */
.delivery-carousel .delivery-item.active .delivery-btn { display: none; }
/* In carousel, make the button as wide as the image and center it */
.delivery-carousel .delivery-btn {
	width: var(--img-w-small);
	max-width: 100%;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

/* Carousel states */
.delivery-carousel {
	position: relative;
	/* центрируем карусель без grid, чтобы не ломать трансформации */
	display: flex;
	align-items: center;
	justify-content: center;
	/* размеры карточек/отступов внутри карусели */
	--card-w: 380px;
	--card-gap: 30px;
	--img-w-small: 305px;
	--img-h-small: 430px;
	--img-w-large: 380px;
	--img-h-large: 520px;
	/* ширина области, чтобы одновременно помещались 3 карточки */
	width: min(calc(3 * var(--card-w) + 2 * var(--card-gap)), var(--content-max));
	max-width: 100%;
	margin-left: auto;
	margin-right: auto;
	min-height: 560px; /* keep area to fit the tallest item */
	overflow: visible;
	/* отключаем отрицательные отступы bootstrap .row */
	--bs-gutter-x: 0;
	padding-left: 0;
	padding-right: 0;
}
/* Neutralize bootstrap column behaviour inside carousel */
.delivery-carousel .delivery-item {
	flex: initial !important;
	max-width: none !important;
	/* кладём элементы друг на друга относительно центра контейнера */
	position: absolute;
	left: 50%;
	top: 0;
	transition: transform .6s ease, opacity .6s ease, filter .6s ease, z-index .6s ease;
	will-change: transform, opacity;
	width: var(--card-w); /* base width for large item so images are not tiny */
	transform: translateX(-50%); /* базовое центрирование */
	cursor: pointer;
}
.delivery-carousel .delivery-item.active { cursor: default; }
/* Убираем внутренние паддинги у колонок bootstrap, чтобы центрирование не смещалось */
.delivery-carousel > [class^="col-"],
.delivery-carousel > [class*=" col-"] { padding-left: 0; padding-right: 0; }
.delivery-carousel .delivery-item .delivery-card { transform-origin: center center; }
.delivery-carousel .delivery-item.prev {
	transform: translateX(calc(-50% - (var(--card-w) + var(--card-gap)))) scale(.9);
	opacity: 1; filter: none;
	z-index: 1;
}
.delivery-carousel .delivery-item.next {
	transform: translateX(calc(-50% + (var(--card-w) + var(--card-gap)))) scale(.9);
	opacity: 1; filter: none;
	z-index: 1;
}
.delivery-carousel .delivery-item.active {
	transform: translateX(-50%) scale(1);
	z-index: 2;
}
.delivery-carousel .delivery-item.active .delivery-caption { opacity: 1; transform: translateY(0); }
.delivery-carousel .delivery-item:not(.active) .delivery-caption { opacity: 0; transform: translateY(10px); }

/* sizes for images: small for side items, large for active */
.delivery-item .delivery-img {
	width: var(--img-w-small);
	height: var(--img-h-small);
	transition: width .6s ease, height .6s ease;
	object-fit: cover;
	display: block;
}
.delivery-item.active .delivery-img {
	width: var(--img-w-large);
	height: var(--img-h-large);
}

/* Why us icons row (SVGs) */
.whyus-icons .whyus-item { text-align: center; }
.whyus-icons .whyus-icon {
	width: var(--whyus-icon-w);
	max-width: 100%;
	height: auto;
	display: block;
	margin-left: auto;
	margin-right: auto;
}
/* Make 20let and 20000clients slightly larger than others */
.whyus-icons img[src$="20let.svg"],
.whyus-icons img[src$="20000clients.svg"] {
	width: calc(var(--whyus-icon-w) * 3.15);
}

/* Для нас нет преград */
.feature-pill {
	background: var(--chip-bg);
	border-radius: 40px;
	padding: 28px 28px;
	box-shadow: inset 0 0 0 1px rgba(0,0,0,0.03);
}
.feature-title {
	font-weight: 700;
	text-transform: uppercase;
	margin-bottom: 8px;
	color: var(--text-dark);
	font-size: 25px;
}

/* New "no barriers" layout like mock */
.feature-row {
	display: flex;
	align-items: stretch;
	gap: 40px;
}
.feature-chip {
	background: var(--chip-bg);
	border-radius: 999px;
	padding: 28px 40px;
	min-height: 112px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 1 1 0;
	font-weight: 800;
	font-size: 24px;
	text-transform: uppercase;
	color: var(--text-dark);
	box-shadow: inset 0 0 0 1px rgba(0,0,0,0.03);
}
.feature-card {
	background: var(--chip-bg);
	border-radius: 28px;
	padding: 24px 28px;
	flex: 1.35 1 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.feature-accent {
	color: var(--brand-orange);
	font-weight: 700;
}
.feature-text {
	color: var(--muted);
	font-size: 14px;
	line-height: 1.35;
}

/* Mobile features accordion */
.section-features-mobile { display: none; }
.features-accordion { display: grid; gap: 10px; }
.feat-acc {
	background: rgba(232, 238, 242, 0.37);
	border-radius: 14px;
	box-shadow: none;
	overflow: hidden;
}
.feat-acc[open] { background: #E8EEF2; }
.feat-acc-summary {
	list-style: none;
	cursor: pointer;
	padding: 12px 14px;
	font-family: 'Fira Sans Condensed','Fira Sans',Arial,sans-serif;
	font-weight: 700;
	text-transform: uppercase;
	color: #1E1E1E;
	position: relative;
}
.feat-acc-summary::-webkit-details-marker { display: none; }
.feat-acc-summary::after {
	content: "▾";
	position: absolute;
	right: 14px;
	top: 50%;
	transform: translateY(-50%) rotate(0deg);
	transition: transform .2s ease;
}
.feat-acc[open] .feat-acc-summary::after { transform: translateY(-50%) rotate(180deg); }
.feat-acc-content {
	padding: 0 14px 12px 14px;
	color: var(--muted);
	font-family: 'Fira Sans', Arial, sans-serif;
	font-size: 14px;
	line-height: 1.35;
}

/* Features carousel (auto-rotating three text cards) */
.features-carousel {
	position: relative;
	display: block; /* override flex in .feature-row */
	gap: 0; /* no visual gap since cards are positioned absolutely */
	/* sizing vars */
	--feat-w: 380px; /* match delivery carousel card width */
	--feat-gap: 30px; /* match delivery carousel gap */
	overflow: hidden; /* prevent overlap with next section during animations */
}
/* Features carousel responsive sizing */
@media (max-width: 1499.98px) {
	.features-carousel { --feat-w: 380px; --feat-gap: 30px; }
}
@media (max-width: 1299.98px) {
	.features-carousel { --feat-w: 380px; --feat-gap: 30px; }
}
@media (max-width: 1099.98px) {
	.features-carousel { --feat-w: 380px; --feat-gap: 30px; }
}
.features-carousel .feature-card .feature-text {
	max-height: 0;
	opacity: 0;
	overflow: hidden;
	transition: max-height .45s ease, opacity .35s ease;
	margin-top: 0;
}
.features-carousel .feature-card.active .feature-text {
	max-height: 1000px; /* large enough to reveal full text */
	opacity: 1;
	margin-top: 6px;
}
.features-carousel .feature-card {
	position: absolute;
	left: 50%;
	top: 0;
	width: var(--feat-w);
	max-width: calc(100vw - 48px);
	transform: translateX(-50%) scale(.9);
	opacity: .9;
	transition: transform .6s ease, opacity .6s ease, filter .6s ease, z-index .6s ease;
	will-change: transform, opacity;
	cursor: pointer;
}
.features-carousel .feature-card.active { cursor: default; }
.features-carousel .feature-card.prev {
	transform: translateX(calc(-50% - (var(--feat-w) + var(--feat-gap)))) scale(.82);
	z-index: 1;
	filter: saturate(.95);
}
.features-carousel .feature-card.next {
	transform: translateX(calc(-50% + (var(--feat-w) + var(--feat-gap)))) scale(.82);
	z-index: 1;
	filter: saturate(.95);
}
.features-carousel .feature-card.active {
	transform: translateX(-50%) scale(1);
	opacity: 1;
	z-index: 2;
}

/* Map section */
.section-map .section-title {
	font-family: 'Fira Sans Condensed', 'Fira Sans', Arial, sans-serif;
	color: #E73900;
	font-size: 48px;
	font-weight: 600;
	line-height: 70px; /* 145.833% */
	text-transform: uppercase;
	letter-spacing: 0.01em;
	white-space: nowrap; /* не переносить */
	margin-bottom: 16px;
}
.map-point-title {
	font-family: 'Fira Sans Condensed', 'Fira Sans', Arial, sans-serif;
	font-weight: 700;
	font-size: 24px;
	line-height: normal;
	text-transform: uppercase;
	color: #1E1E1E;
	margin-bottom: 6px;
	letter-spacing: 0.01em;
}
.map-point-text {
	font-family: 'Fira Sans', Arial, sans-serif;
	color: var(--muted);
	font-size: 14px;
	line-height: 1.35;
}

/* Orange heading fragment in map section (per Figma) */
.section-map .section-title .text-orange {
	color: #E73900;
	font-family: 'Fira Sans Condensed', 'Fira Sans', Arial, sans-serif;
	font-size: 48px;
	font-style: normal;
	font-weight: 600;
	line-height: 70px; /* 145.833% */
	text-transform: uppercase;
	display: inline-block;
}

/* Reduce extra top spacing in map section so tall image doesn't push title too far */
.section-map .container-fluid {
	padding-top: 24px;
	padding-bottom: 24px;
}
.map-img {
	width: 110%;
	height: auto;
	object-fit: contain;
}

/* Mobile map section */
.section-map-mobile { display: none; }
.map-mobile-img {
	margin-top: -2.5rem;
	width: 100%;
	height: auto;
	object-fit: contain;
	display: block;
}
@media (max-width: 424.98px) {
	.map-mobile-img { margin-top: -1.5rem; }
}
.map-accordion { display: grid; gap: 10px; }
.map-acc {
	border-radius: 14px;
	background: rgba(232, 238, 242, 0.37);
	box-shadow: none;
	overflow: hidden;
}
.map-acc[open] { background: #E8EEF2; }
.map-acc-summary {
	list-style: none;
	cursor: pointer;
	padding: 12px 14px;
	font-family: 'Fira Sans Condensed','Fira Sans',Arial,sans-serif;
	font-weight: 700;
	text-transform: uppercase;
	color: #1E1E1E;
	position: relative;
}
.map-acc-summary::-webkit-details-marker { display: none; }
.map-acc-summary::after {
	content: "▾";
	position: absolute;
	right: 14px;
	top: 50%;
	transform: translateY(-50%) rotate(0deg);
	transition: transform .2s ease;
}
.map-acc[open] .map-acc-summary::after { transform: translateY(-50%) rotate(180deg); }
.map-acc-content {
	padding: 0 14px 12px 14px;
	color: var(--muted);
	font-family: 'Fira Sans', Arial, sans-serif;
	font-size: 14px;
	line-height: 1.35;
}
/* Enlarge SVG map on large screens */
@media (min-width: 1400px) {
	.map-img[src$=".svg"] {
		width: 120%;
		margin-top: -3rem;
	}
}

/* Calculator */
.section-calc {
	background: #F1F1F1;
}
.section-calc-mobile { display: none; background: #F1F1F1; }
.calc-mobile-card {
	background: #E8EEF2;
	border-radius: 20px;
}
.calc-mobile-img {
	border-radius: 20px 20px 0 0;
	overflow: hidden;
	width: 100%;
}
.calc-mobile-img img {
	width: 100%;
	height: 100%;
	display: block;
	padding: 0;
	margin: 0;
	object-fit: cover;
}
.calc-mobile-form { 
	padding: 14px 14px 16px 14px; }
.calc-mobile-form .form-label {
	font-family: 'Fira Sans Condensed','Fira Sans',Arial,sans-serif;
	text-transform: uppercase;
	font-weight: 700;
	font-size: 12px;
	letter-spacing: 0.02em;
	color: #1E1E1E;
}
.calc-mobile-btn {
	width: 100%;
	border: none;
	border-radius: 9px;
	background: #E73900;
	color: #fff;
	padding: 14px 16px;
	font-family: 'Fira Sans Condensed','Fira Sans',Arial,sans-serif;
	text-transform: uppercase;
	font-weight: 700;
	font-size: 18px;
}
.calc-panel {
	border-radius: 16px;
	padding: 28px;
}
.calc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px 28px; }
@media (max-width: 768px) { .calc-grid { grid-template-columns: 1fr; } }
.section-calc .section-title {
	font-family: 'Fira Sans Condensed', 'Fira Sans', Arial, sans-serif;
	font-weight: 700;
	text-transform: uppercase;
}
.calc-form .form-label {
	font-family: 'Fira Sans Condensed', 'Fira Sans', Arial, sans-serif;
	text-transform: uppercase;
	font-weight: 400 !important;
	font-size: 20px;
	letter-spacing: 0.02em;
	color: #1E1E1E;
}
.calc-input.form-control {
	background: #FFFFFF;
	border-radius: 18px;
	height: 64px;
	padding: 14px 16px;
	font-family: 'Fira Sans', Arial, sans-serif;
	font-size: 14px;
	border: none;
}
.calc-input.form-control::placeholder {
	color: #A7A7A7;
}
.calc-input.form-control:focus {
	border-color: #E73900;
	box-shadow: 0 0 0 2px rgba(231,57,0,0.15);
	background: #fff;
}
.calc-btn {
	background-color: var(--brand-orange);
	color: #fff;
	border: none;
	width: 100%;
	height: 64px;
	border-radius: 20px;
	font-family: 'Fira Sans Condensed', 'Fira Sans', Arial, sans-serif;
	text-transform: uppercase;
	font-weight: 600;
	font-size: 24px;
	text-align: center;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0 16px;
	white-space: nowrap;
}
.calc-btn:hover,
.calc-btn:focus {
	background-color: #d63300;
	color: #fff;
}
/* Contacts block in calculator */
.calc-contacts-title {
	font-family: 'Fira Sans Condensed', 'Fira Sans', Arial, sans-serif;
	font-weight: 800;
	font-size: 36px;
	line-height: 1.1;
	text-transform: uppercase;
	color: #1E1E1E;
	letter-spacing: 0.01em;
	margin-top: 8px;
}
.calc-contact-label {
	font-family: 'Fira Sans', Arial, sans-serif;
	color: var(--muted);
	font-size: 14px;
	line-height: 1.2;
	margin-bottom: 4px;
}
.calc-contact-value {
	font-family: 'Fira Sans Condensed', 'Fira Sans', Arial, sans-serif;
	font-weight: 800;
	text-transform: uppercase;
	color: #1E1E1E;
	line-height: 1.1;
}
.calc-contact-value--phone { font-size: 28px; }
.calc-contact-value--email { font-size: 24px; }
.calc-contact-link { color: inherit; text-decoration: none; }
.calc-contact-link:hover, .calc-contact-link:focus { text-decoration: underline; }
.object-cover {
	object-fit: cover;
}
.calc-image img {
    border-radius: 62px 0 0 62px;
	object-fit: cover;
	width: 100%;
	height: 100%;
	display: block;
}

/* LK desktop form layout to match mock */
.lk-grid { display: grid; grid-template-columns: 1fr; gap: 16px; }
.lk-submit .calc-mobile-btn { width: 100%; }
@media (min-width: 992px) {
	.lk-grid {
		grid-template-columns: repeat(3, 1fr);
		column-gap: 32px;
		row-gap: 24px;
		align-items: end;
	}
	.lk-submit { justify-self: start; align-self: end; }
	.lk-submit .calc-mobile-btn { width: 320px; }
}

/* Footer */
.site-footer {
	background: #1E1E1E;
	border-top: 1px solid rgba(255,255,255,0.08);
}
.site-footer-mobile { display: none; background: #1E1E1E; border-top: 1px solid rgba(255,255,255,0.08); }
.footer-mobile-nav { }
.footer-mobile-link {
	color: #FFF;
	text-decoration: none;
	font-family: 'Fira Sans', Arial, sans-serif;
	font-size: 12px;
	font-style: normal;
	font-weight: 400;
	line-height: 22px; /* 183.333% */
	text-transform: uppercase;
	display: block;
}
.footer-mobile-link:hover { color: #FFF; opacity: 0.9; text-decoration: underline; }
.footer-mobile-logo img { display: block; }
.footer-mobile-copy {
	color: rgba(255,255,255,0.6);
	font-family: 'Fira Sans', Arial, sans-serif;
	font-size: 12px;
	line-height: 22px;
	text-transform: uppercase;
}
.footer-link {
	color: #EDEDED;
	text-decoration: none;
	font-family: 'Fira Sans Condensed','Fira Sans',Arial,sans-serif;
	text-transform: uppercase;
	font-weight: 700;
	font-size: 12px;
	letter-spacing: 0.04em;
}
.footer-link:hover {
	color: #ffffff;
	text-decoration: underline;
}
.site-footer .footer-nav {
	gap: 32px;
	flex-wrap: wrap;
	justify-content: center;
}
.site-footer .container-fluid {
	padding-top: 16px;
	padding-bottom: 16px;
}
.site-footer p {
	margin-top: 12px;
	font-size: 12px;
}

/* Responsive tweaks */
@media (max-width: 992px) {
	.hero { min-height: 90vh; }
	.delivery-img { height: 380px; }
	.feature-row { gap: 20px; }
	.calc-panel { padding: 20px; }
	/* Hide desktop headers, show mobile header */
	.site-header, .sticky-header { display: none !important; }
	.mobile-header { display: block; }
	.mobile-sticky.active { display: block; }
	/* Show splash only on mobile */
	.mobile-splash { display: flex; }
	/* Show mobile hero headline */
	.hero-mobile-title { display: block; }
	/* Footer: mobile vs desktop */
	.site-footer { display: none !important; }
	.site-footer-mobile { display: block; }
}

@media (max-width: 768px) {
	/* Make hero take full viewport height on mobile */
	.hero { min-height: 100svh; height: 100svh; }
	.hero-cta-mobile { display: block; }
	/* Reserve space at bottom so fixed CTA doesn't overlap footer/content (pure CSS) */
	.site-footer-mobile { padding-bottom: calc(160px + env(safe-area-inset-bottom)); }
	/* Swap to mobile calc */
	.section-calc { display: none; }
	.section-calc-mobile { display: block; }
	/* Mobile calc contacts: two columns under title */
	.section-calc-mobile .calc-mobile-contacts .row {
		display: grid;
		grid-template-columns: auto auto; /* контентной ширины */
		column-gap: 24px;
		align-items: start;
		justify-content: center;          /* центрируем пару блоков */
		margin-left: 0;                    /* убираем отрицательные отступы .row */
		margin-right: 0;
	}
	.section-calc-mobile .calc-mobile-contacts .row > [class^="col-"] {
		width: auto;
		padding: 0;
		justify-self: center;             /* центрируем каждый блок в своей колонке */
	}
	/* Swap to mobile delivery section on phones/tablets */
	.section-delivery { display: none; }
	.section-delivery-mobile { display: block; }
	/* Swap to mobile map section */
	.section-map { display: none; }
	.section-map-mobile { display: block; }
	/* Swap to mobile features section */
	.section-features { display: none; }
	.section-features-mobile { display: block; }
	
	/* Features carousel sizing on mobile */
	.features-carousel { --feat-w: 92vw; --feat-gap: 16px; }
	.features-carousel .feature-card { width: var(--feat-w); }

	/* Typography */
	.section-title { font-size: 26px; line-height: 1.2; }
	.hero h1 { font-size: clamp(22px, 6vw, 30px); line-height: 1.15; }
	.section-map .section-title { font-size: 28px; line-height: 1.2; white-space: normal; }
	.section-map .section-title .text-orange { font-size: inherit; line-height: inherit; }
	/* Base icon size on mobile: fit within 2-column layout */
	.whyus-icons .whyus-icon { width: min(38vw, 180px); }
	.whyus-icons img[src$="20let.svg"],
	.whyus-icons img[src$="20000clients.svg"] { width: min(42vw, 230px); }
	/* Swap order of 70spec and 20000clients on mobile only */
	.whyus-icons > .whyus-item:nth-child(3) { order: 4; } /* 70spec to 4th */
	.whyus-icons > .whyus-item:nth-child(4) { order: 3; padding-top: 10px;} /* 20000clients to 3rd */

	/* Mobile menu look - remove big bubble */
	.nav-pill-bg {
		background: transparent !important;
		box-shadow: none !important;
		border-radius: 0 !important;
		width: 100%;
		margin: 0;
		padding: 8px 0 !important;
	}
	.navbar-nav .nav-item { margin-bottom: 6px; }
	.site-header .nav-link { color: #ffffff !important; padding: 8px 12px; }
	.site-header .nav-link:hover,
	.site-header .nav-link:focus { color: #ffffff !important; opacity: 0.9; }

	/* Hero CTA */
	.hero-cta-bubble { display: none; }
	.hero-cta-content { border-radius: 16px; }
	.hero-cta { width: 95vw; right: 8px; padding: 8px 12px; }
	.hero-primary-btn { padding: 10px 16px; font-size: 14px; }
	/* Hide hero headline and CTA on mobile */
	.hero h1,
	.hero-cta { display: none !important; }

	/* Features strip */
	.feature-row { flex-direction: column; }
	.feature-chip { min-height: unset; padding: 18px 20px; font-size: 18px; }
	.feature-card { padding: 18px; }

	/* Delivery cards */
	.delivery-img { height: 280px; }
	.delivery-btn { width: var(--img-w-small); padding: 12px 20px; border-radius: 14px; margin-left: auto; margin-right: auto; display: block; }

	/* Map section */
	.map-img { margin-top: 8px; }

	/* Calculator */
	.calc-panel { padding: 18px; border-radius: 14px; }
	.calc-input.form-control { height: 52px; border-radius: 14px; }
	.calc-btn { width: 100%; height: 54px; border-radius: 16px; font-size: 20px; }
	.calc-image { margin-top: 12px; }
	.calc-contacts-title { font-size: 28px; }
	.calc-contact-value--phone { font-size: 22px; }
	.calc-contact-value--email { font-size: 18px; }

	/* Header logo */
	.brand-logo { width: 160px; height: 36px; }

	/* Footer */
	.footer-nav { flex-direction: column; gap: 8px; }
}

/* Small phones */
@media (max-width: 576px) {
	.hero {
		min-height: 100svh;
		height: 100svh;
		background-position: center;
		padding-top: 72px; /* room for header */
		padding-bottom: 24px;
	}
	.mobile-header .mobile-logo img { height: 40px; width: auto; }
	.hero h1 {
		font-size: clamp(20px, 6.2vw, 26px);
		margin-bottom: 8px;
	}
	.section-map .section-title { font-size: 24px; line-height: 1.2; white-space: normal; }
	.section-map .section-title .text-orange { font-size: inherit; line-height: inherit; }
	/* Make CTA a centered block below the title */
	.hero-cta {
		position: static !important;
		width: 92vw;
		margin: 10px auto 0;
		padding: 8px 12px;
		background: none !important; /* hide header.svg on phones */
		aspect-ratio: auto;
	}
	.hero-cta-inner {
		justify-content: center;
		gap: 8px;
	}
	.hero-cta .btn {
		padding: 10px 14px;
		font-size: 20px;
		font-family: 'Fira Sans Condensed', 'Fira Sans', Arial, sans-serif;
		font-weight: 700;
		text-transform: uppercase;
		color: #fff;
		text-decoration: none;
	}
}

/* Very small devices: adjust mobile header logo height (override after base rule) */
@media (max-width: 321px) {
	.mobile-header .mobile-logo img { height: 20px !important; width: auto; }
	.calc-contact-value.calc-contact-value--phone > a { font-size: 16px !important; }
	.calc-contact-value.calc-contact-value--email > a { font-size: 16px !important; }
}

/* SMS modal */
.sms-backdrop {
	position: fixed;
	inset: 0;
	background: rgba(0,0,0,0.4);
	display: none;
	align-items: center;
	justify-content: center;
	z-index: 4000;
	opacity: 0;
	transition: opacity .18s ease;
}
.sms-backdrop.open { display: flex; opacity: 1; }
.sms-modal {
	width: min(92vw, 420px);
	background: #fff;
	border-radius: 16px;
	box-shadow: 0 10px 30px rgba(0,0,0,.25);
	transform: translateY(8px);
	opacity: 0.98;
	transition: transform .18s ease, opacity .18s ease;
}
.sms-modal.open { transform: translateY(0); opacity: 1; }
.sms-modal.shake { animation: sms-shake .32s ease; }
@keyframes sms-shake {
	10%, 90% { transform: translateX(-2px); }
	20%, 80% { transform: translateX(4px); }
	30%, 50%, 70% { transform: translateX(-6px); }
	40%, 60% { transform: translateX(6px); }
}
.sms-header { padding: 14px 16px 0 16px; }
.sms-title {
	font-family: 'Fira Sans Condensed','Fira Sans',Arial,sans-serif;
	font-weight: 700;
	text-transform: uppercase;
	font-size: 18px;
	color: #1E1E1E;
}
.sms-body { padding: 8px 16px 0 16px; }
.sms-desc { color: #5F6978; font-size: 14px; margin-bottom: 10px; }
.sms-code-input {
	width: 100%;
	border: 1px solid #E1E5EA;
	border-radius: 10px;
	height: 48px;
	padding: 12px 14px;
	font-size: 16px;
}
.sms-hint { color: #A7A7A7; font-size: 12px; margin-top: 6px; }
.sms-error { color: #E73900; font-size: 13px; margin-top: 8px; }
.sms-actions { display: flex; gap: 8px; padding: 16px; }
.sms-btn {
	flex: 1 1 0;
	height: 44px;
	border-radius: 10px;
	border: 1px solid #E1E1E1;
	background: #fff;
	font-family: 'Fira Sans Condensed','Fira Sans',Arial,sans-serif;
	text-transform: uppercase;
	font-weight: 700;
}
.sms-btn-primary {
	background: #E73900;
	color: #fff;
	border-color: #E73900;
}