/* Start:/local/templates/votkinsk/css/rumles-delivery.css?17938321558400*/
/* Страница «Доставка» Румлеса — в стиле главной (UI Kit «Румлес · Дизайн») */
.rdl {
	--g: #148636; --g-dark: #007222; --g-soft: #76af65; --g-pale: #e3f0dc; --g-deep: #173a36;
	--ink: #1e1e1e; --muted: #5d5d5d; --grey: #85889e; --bg: #f5f6f6; --line: #e7e7e7; --r: 12px;
	font-family: 'IBM Plex Sans', system-ui, sans-serif; color: var(--ink); padding-bottom: 24px;
}
.rdl a { text-decoration: none; }
.rdl svg { width: 22px; height: 22px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }

.rdl-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 0 26px; border-radius: 8px; font-weight: 600; font-size: 16px; border: 1px solid transparent; white-space: nowrap; }
.rdl .rdl-btn-light { background: #fff; color: var(--g); }
.rdl .rdl-btn-light:hover { background: #f4faf1; color: var(--g-dark); }
.rdl .rdl-btn-ghost { background: transparent; color: #fff; border-color: rgba(255,255,255,.55); }
.rdl .rdl-btn-ghost:hover { background: rgba(255,255,255,.12); color: #fff; }
.rdl .rdl-btn-brand { background: var(--g); color: #fff; }
.rdl .rdl-btn-brand:hover { background: var(--g-dark); color: #fff; }

/* первый экран */
.rdl-hero { position: relative; display: grid; grid-template-columns: 1.1fr 1fr; align-items: stretch; min-height: 400px; border-radius: 12px; overflow: hidden;
	background: linear-gradient(100deg, var(--g-dark) 0%, var(--g) 38%, #5e9f55 62%, #76af65 80%); color: #fff; margin-top: 8px; }
.rdl-hero::before { content: ''; position: absolute; right: -120px; top: -160px; width: 520px; height: 520px; border-radius: 50%; background: rgba(255,255,255,.06); }
.rdl-hero-text { position: relative; z-index: 1; padding: 56px 0 56px 56px; display: flex; flex-direction: column; gap: 22px; }
.rdl-hero-title { font-size: 44px; line-height: 1.1; font-weight: 600; margin: 0; color: #fff; }
.rdl-hero-lead { font-size: 18px; line-height: 1.45; margin: 0; max-width: 520px; color: rgba(255,255,255,.88); }
.rdl-facts { display: flex; flex-wrap: wrap; gap: 12px; list-style: none; margin: 4px 0 0; padding: 0; }
.rdl-facts li { display: flex; flex-direction: column; gap: 2px; padding: 12px 16px; border-radius: 8px; background: rgba(255,255,255,.12); backdrop-filter: blur(4px); min-width: 150px; }
.rdl-facts b { font-size: 20px; font-weight: 600; }
.rdl-facts span { font-size: 13px; color: rgba(255,255,255,.8); }
.rdl-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 6px; }
.rdl-hero-art { position: relative; display: flex; align-items: flex-end; justify-content: flex-end; }
.rdl-hero-art img { width: 100%; height: 100%; object-fit: cover; object-position: left center;
	-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 30%); mask-image: linear-gradient(90deg, transparent 0, #000 30%); }

/* секции */
.rdl-section { margin-top: 72px; }
.rdl-section-tint { background: var(--g-pale); border-radius: 12px; padding: 48px; }
.rdl-head { margin-bottom: 28px; }
.rdl-h2 { font-size: 34px; line-height: 1.15; font-weight: 600; margin: 0 0 8px; }
.rdl-sub { font-size: 17px; color: var(--muted); margin: 0; }

/* услуги */
.rdl-services { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.rdl-service { background: #fff; border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; display: flex; flex-direction: column; transition: transform .2s, box-shadow .2s; }
.rdl-service:hover { transform: translateY(-3px); box-shadow: 0 12px 30px rgba(20,134,54,.12); }
.rdl-service-img { aspect-ratio: 443 / 300; background: var(--g-soft); }
.rdl-service-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.rdl-service-body { padding: 22px 24px 26px; }
.rdl-service-head { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; font-size: 22px; font-weight: 600; margin-bottom: 8px; }
.rdl-service-head b { color: var(--g); white-space: nowrap; font-size: 20px; }
.rdl-service-body p { margin: 0; color: var(--muted); font-size: 15px; line-height: 1.45; }
.rdl-note { display: flex; align-items: center; gap: 12px; margin-top: 20px; padding: 16px 20px; border-radius: 8px; background: #f7f7f5; color: var(--muted); font-size: 15px; }
.rdl-note svg { color: var(--g); }

/* тарифы */
.rdl-tariffs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.rdl-tariff { position: relative; background: #fff; border-radius: var(--r); padding: 28px 24px; display: flex; flex-direction: column; gap: 16px; border: 2px solid transparent; }
.rdl-tariff.is-accent { border-color: var(--g); box-shadow: 0 14px 34px rgba(20,134,54,.16); }
.rdl-badge { position: absolute; top: -13px; left: 24px; padding: 4px 12px; border-radius: 999px; background: #ffc107; color: var(--ink); font-size: 13px; font-weight: 600; }
.rdl-tariff-name { font-size: 20px; font-weight: 600; }
.rdl-tariff-price { font-size: 32px; line-height: 1; font-weight: 700; color: var(--g); margin-top: -6px; padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.rdl-tariff-row { display: flex; gap: 12px; font-size: 14px; line-height: 1.45; }
.rdl-tariff-row svg { color: var(--g); margin-top: 1px; }
.rdl-label { font-size: 12px; font-weight: 600; color: var(--grey); text-transform: uppercase; letter-spacing: .04em; margin-bottom: 4px; }
.rdl-tariff-weight { margin-top: auto; padding-top: 14px; border-top: 1px dashed var(--line); color: var(--muted); }

/* районы */
.rdl-zones { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.rdl-zone { background: #fff; border: 1px solid var(--line); border-radius: var(--r); padding: 28px; display: grid; grid-template-columns: 1fr auto; gap: 18px 24px; align-items: start; }
.rdl-zone-places { display: flex; gap: 12px; font-size: 19px; line-height: 1.35; font-weight: 600; }
.rdl-zone-places svg { color: var(--g); width: 26px; height: 26px; }
.rdl-zone-price { font-size: 26px; font-weight: 700; color: var(--g); white-space: nowrap; }
.rdl-zone-meta { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 10px; }
.rdl-zone-meta div { display: flex; align-items: center; gap: 8px; padding: 10px 14px; border-radius: 8px; background: var(--g-pale); font-size: 14px; font-weight: 500; }
.rdl-zone-meta svg { color: var(--g); width: 18px; height: 18px; }

/* призыв */
.rdl-cta { margin-top: 56px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 32px 40px; border-radius: 12px; background: var(--g-deep); color: #fff; }
.rdl-cta-title { font-size: 24px; font-weight: 600; margin-bottom: 6px; }
.rdl-cta-text { color: rgba(255,255,255,.75); font-size: 16px; }

@media (max-width: 1199.98px) {
	.rdl-tariffs { grid-template-columns: repeat(2, 1fr); row-gap: 28px; }
	.rdl-hero-title { font-size: 38px; }
}
@media (max-width: 991.98px) {
	.rdl-hero { grid-template-columns: 1fr; }
	.rdl-hero-text { padding: 40px 32px 8px; }
	.rdl-hero-art { height: 260px; }
	.rdl-hero-art img { -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 25%); mask-image: linear-gradient(180deg, transparent 0, #000 25%); object-position: center; }
	.rdl-services { grid-template-columns: 1fr 1fr; }
	.rdl-zones { grid-template-columns: 1fr; }
}
@media (max-width: 767.98px) {
	.rdl-hero { border-radius: 12px; min-height: 0; }
	.rdl-hero-text { padding: 28px 20px 4px; gap: 16px; }
	.rdl-hero-title { font-size: 28px; }
	.rdl-hero-lead { font-size: 16px; }
	.rdl-facts li { min-width: 0; flex: 1 1 40%; padding: 10px 12px; }
	.rdl-facts b { font-size: 17px; }
	.rdl-actions .rdl-btn { width: 100%; }
	.rdl-hero-art { height: 200px; }
	.rdl-section { margin-top: 48px; }
	.rdl-section-tint { padding: 28px 16px; border-radius: 12px; margin-left: -15px; margin-right: -15px; }
	.rdl-h2 { font-size: 26px; }
	.rdl-services, .rdl-tariffs { grid-template-columns: 1fr; }
	.rdl-zone { grid-template-columns: 1fr; padding: 22px; }
	.rdl-cta { flex-direction: column; align-items: stretch; padding: 24px 20px; }
	.rdl-cta .rdl-btn { width: 100%; }
}
@media (max-width: 767.98px) {
	/* на телефоне машина уже есть в первой карточке услуг — в баннере не повторяем */
	.rdl-hero-art { display: none; }
	.rdl-hero-text { padding-bottom: 28px; }
}

/* End */
/* /local/templates/votkinsk/css/rumles-delivery.css?17938321558400 */