/* Page Tarifs & rendez-vous MEGAPNEUS - mise en page fixe 1000 px */
.mp-rdv-page,
.mp-rdv-page * {
	box-sizing: border-box;
}

.mp-rdv-page {
	width: 1000px;
	margin: 14px auto 38px;
	color: #242424;
	font-family: Arial, Helvetica, sans-serif;
}

.mp-rdv-hero {
	position: relative;
	min-height: 260px;
	padding: 38px 42px 31px;
	overflow: hidden;
	color: #ffffff;
	background: radial-gradient(circle at 86% 22%, rgba(215, 25, 32, .58), transparent 28%),
		linear-gradient(125deg, #090909 0%, #242424 62%, #0b0b0b 100%);
	border: 1px solid #3e3e3e;
	border-radius: 14px;
	box-shadow: 0 16px 38px rgba(0, 0, 0, .34);
}

.mp-rdv-hero:after {
	position: absolute;
	right: -58px;
	top: -95px;
	width: 360px;
	height: 360px;
	content: "";
	border: 48px solid rgba(255, 255, 255, .035);
	border-radius: 50%;
}

.mp-rdv-hero-kicker,
.mp-rdv-section-kicker {
	display: block;
	margin-bottom: 7px;
	color: #ff3b3f;
	font-size: 12px;
	font-weight: 900;
	letter-spacing: 2px;
}

.mp-rdv-hero h1 {
	position: relative;
	z-index: 1;
	max-width: 720px;
	margin: 0;
	color: #ffffff;
	font-size: 38px;
	line-height: 1.08;
	text-transform: uppercase;
}

.mp-rdv-hero > p {
	position: relative;
	z-index: 1;
	max-width: 690px;
	margin: 13px 0 19px;
	color: #dddddd;
	font-size: 15px;
	line-height: 1.55;
}

.mp-rdv-hero-actions {
	position: relative;
	z-index: 2;
	display: flex;
	gap: 10px;
}

.mp-rdv-button {
	display: inline-block;
	padding: 11px 16px;
	color: #ffffff !important;
	font-size: 12px;
	font-weight: 900;
	line-height: 18px;
	text-decoration: none !important;
	background: #2b2b2b;
	border: 1px solid #5b5b5b;
	border-radius: 7px;
	box-shadow: 0 5px 12px rgba(0, 0, 0, .2);
}

.mp-rdv-button-primary {
	background: #d71920;
	border-color: #f03a41;
}

.mp-rdv-button:hover,
.mp-rdv-button:focus {
	color: #ffffff !important;
	background: #ef2b32;
	border-color: #ff555b;
}

.mp-rdv-reassurance {
	position: relative;
	z-index: 1;
	display: flex;
	gap: 28px;
	margin-top: 23px;
	padding-top: 14px;
	color: #cccccc;
	font-size: 12px;
	border-top: 1px solid rgba(255, 255, 255, .16);
}

.mp-rdv-reassurance strong {
	color: #ffffff;
}

.mp-rdv-shortcuts {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 9px;
	margin: 11px 0;
}

.mp-rdv-shortcut {
	position: relative;
	display: block;
	min-height: 78px;
	padding: 15px 12px 13px 52px;
	color: #252525 !important;
	text-align: left;
	text-decoration: none !important;
	background: #ffffff;
	border: 1px solid #d8d8d8;
	border-bottom: 3px solid #d71920;
	border-radius: 9px;
	box-shadow: 0 7px 18px rgba(0, 0, 0, .12);
}

.mp-rdv-shortcut:before {
	position: absolute;
	top: 17px;
	left: 14px;
	width: 27px;
	height: 27px;
	content: "";
	background-color: #d71920;
	background-position: center;
	background-repeat: no-repeat;
	background-size: 17px 17px;
	border-radius: 50%;
}

.mp-rdv-shortcut-store:before,
.mp-rdv-shortcut-outside:before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='7' fill='none' stroke='white' stroke-width='2.2'/%3E%3Ccircle cx='12' cy='12' r='2.5' fill='none' stroke='white' stroke-width='2'/%3E%3Cpath d='M12 5v4M12 15v4M5 12h4M15 12h4' stroke='white' stroke-width='1.8'/%3E%3C/svg%3E");
}

.mp-rdv-shortcut-services:before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 18l8-8M9 5l2 2-4 4-2-2zM14 13l5 5M16 9l3-3' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.mp-rdv-shortcut-mechanic:before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 16l2-6h12l2 6v3H4zM8 10l2-3h4l2 3M7 16h.01M17 16h.01' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.mp-rdv-shortcut strong,
.mp-rdv-shortcut span {
	display: block;
}

.mp-rdv-shortcut strong {
	margin-bottom: 5px;
	color: #171717;
	font-size: 13px;
}

.mp-rdv-shortcut span {
	color: #686868;
	font-size: 10px;
	line-height: 1.35;
}

.mp-rdv-shortcut:hover,
.mp-rdv-shortcut:focus {
	border-color: #d71920;
	box-shadow: 0 9px 22px rgba(0, 0, 0, .18);
}

.mp-rdv-booking,
.mp-rdv-tariff-section,
.mp-rdv-footer-cta {
	background: #f4f4f4;
	border: 1px solid #d7d7d7;
	border-radius: 12px;
	box-shadow: 0 12px 29px rgba(0, 0, 0, .2);
}

.mp-rdv-booking {
	margin-top: 12px;
	padding: 27px 30px 25px;
}

.mp-rdv-section-heading {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 13px;
	padding-bottom: 15px;
	border-bottom: 1px solid #d9d9d9;
}

.mp-rdv-section-heading h2,
.mp-rdv-footer-cta h2 {
	margin: 0 0 5px;
	color: #171717;
	font-size: 26px;
	line-height: 1.15;
}

.mp-rdv-section-heading p,
.mp-rdv-footer-cta p {
	margin: 0;
	color: #5f5f5f;
	font-size: 12px;
	line-height: 1.5;
}

.mp-rdv-calendar-icon {
	position: relative;
	width: 48px;
	height: 44px;
	margin-right: 4px;
	background: #ffffff;
	border: 2px solid #d71920;
	border-radius: 7px;
}

.mp-rdv-calendar-icon:before {
	position: absolute;
	top: 8px;
	left: 0;
	width: 100%;
	height: 7px;
	content: "";
	background: #d71920;
}

.mp-rdv-calendar-icon:after {
	position: absolute;
	left: 13px;
	top: 22px;
	width: 7px;
	height: 7px;
	content: "";
	background: #d71920;
	border-radius: 50%;
	box-shadow: 14px 0 0 #d71920;
}

.mp-booking-list {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0 7px;
}

.mp-booking-row td {
	padding: 10px 12px;
	color: #333333;
	font-size: 12px;
	background: #ffffff;
	border-top: 1px solid #dddddd;
	border-bottom: 1px solid #dddddd;
}

.mp-booking-row td:first-child {
	border-left: 4px solid #d71920;
	border-radius: 7px 0 0 7px;
}

.mp-booking-row td:last-child {
	border-right: 1px solid #dddddd;
	border-radius: 0 7px 7px 0;
}

.mp-booking-name {
	line-height: 1.35;
}

.mp-booking-price {
	width: 125px;
	color: #b51218 !important;
	font-size: 13px !important;
	text-align: right;
}

.mp-booking-action {
	width: 105px;
	text-align: right;
}

.mp-booking-action form {
	margin: 0;
}

.mp-booking-button {
	width: 88px;
	padding: 8px 8px;
	color: #ffffff;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: 900;
	background: #d71920;
	border: 1px solid #ef343b;
	border-radius: 6px;
	cursor: pointer;
}

.mp-booking-button:hover,
.mp-booking-button:focus {
	background: #ef2b32;
}

.mp-rdv-tariff-section {
	margin-top: 12px;
	overflow: hidden;
}

.mp-rdv-tariff-heading {
	position: relative;
	padding: 23px 28px 19px 78px;
	background: linear-gradient(120deg, #141414, #2a2a2a);
	border-bottom: 3px solid #d71920;
}

.mp-rdv-tariff-heading:before {
	position: absolute;
	top: 25px;
	left: 27px;
	width: 34px;
	height: 34px;
	content: "";
	background-color: #d71920;
	background-position: center;
	background-repeat: no-repeat;
	background-size: 21px 21px;
	border-radius: 50%;
}

.mp-rdv-section-store .mp-rdv-tariff-heading:before,
.mp-rdv-section-outside .mp-rdv-tariff-heading:before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='7' fill='none' stroke='white' stroke-width='2.2'/%3E%3Ccircle cx='12' cy='12' r='2.5' fill='none' stroke='white' stroke-width='2'/%3E%3Cpath d='M12 5v4M12 15v4M5 12h4M15 12h4' stroke='white' stroke-width='1.8'/%3E%3C/svg%3E");
}

.mp-rdv-section-services .mp-rdv-tariff-heading:before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 18l8-8M9 5l2 2-4 4-2-2zM14 13l5 5M16 9l3-3' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.mp-rdv-section-mechanic .mp-rdv-tariff-heading:before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 16l2-6h12l2 6v3H4zM8 10l2-3h4l2 3M7 16h.01M17 16h.01' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.mp-rdv-tariff-heading > span {
	display: block;
	margin-bottom: 4px;
	color: #ff3b3f;
	font-size: 10px;
	font-weight: 900;
	letter-spacing: 1.7px;
}

.mp-rdv-tariff-heading h2 {
	margin: 0 0 5px;
	color: #ffffff;
	font-size: 24px;
	line-height: 1.15;
}

.mp-rdv-tariff-heading p {
	margin: 0;
	color: #cccccc;
	font-size: 12px;
	line-height: 1.45;
}

.mp-rdv-tariff-list {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
	padding: 15px;
	background: #eeeeee;
}

.mp-rdv-subgroup {
	grid-column: 1 / -1;
	margin: 5px 0 0;
	padding: 8px 11px;
	color: #a90e14;
	font-size: 13px;
	line-height: 18px;
	text-transform: uppercase;
	background: #fff0f0;
	border-left: 4px solid #d71920;
	border-radius: 5px;
}

.mp-rdv-tariff-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 60px;
	padding: 11px 12px;
	background: #ffffff;
	border: 1px solid #d9d9d9;
	border-radius: 7px;
	box-shadow: 0 4px 10px rgba(0, 0, 0, .05);
}

.mp-rdv-tariff-name {
	max-width: 315px;
	padding-right: 10px;
	color: #333333;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.35;
}

.mp-rdv-tariff-name small {
	display: block;
	margin-top: 4px;
	color: #777777;
	font-size: 10px;
	font-weight: 400;
}

.mp-rdv-tariff-price {
	min-width: 100px;
	color: #b51218;
	font-size: 13px;
	font-weight: 900;
	line-height: 1.3;
	text-align: right;
}

.mp-rdv-notice {
	grid-column: 1 / -1;
	padding: 12px 14px;
	color: #5a4800;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.45;
	background: #fff5c9;
	border: 1px solid #eed77b;
	border-left: 4px solid #d71920;
	border-radius: 6px;
}

.mp-rdv-footer-cta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 25px;
	margin-top: 12px;
	padding: 24px 29px;
	background: #ffffff;
}

.mp-rdv-footer-cta .mp-rdv-button {
	flex: 0 0 auto;
}

#reservation,
#pneus-magasin,
#pneus-exterieurs,
#prestations-pneus,
#mecanique {
	scroll-margin-top: 12px;
}
