.rd-contract-intermediate-form {
	display: grid;
	grid-template-columns: 360px 580px;
	gap: 16px;
	justify-content: center;
}

.rd-contract-inter-packageblock {
	border-radius: var(--rd-borderradius-border-md);
	border: 1px solid #cccccc;
	background: #f7dfe6;
	box-shadow: 0px 1px 3px 0px rgba(15, 15, 16, 0.1), 0px 1px 2px 0px rgba(15, 15, 16, 0.06);
	padding: var(--rd-spacing-xxx-big);
	display: flex;
	flex-direction: column;
	justify-content: center;
}

[data-package="pro"] .rd-contract-inter-packageblock {
	background: #26456d;
}

[data-package="pro"] .rd-contract-inter-packageblock .contractPackagePrice,
[data-package="pro"] .rd-contract-inter-packageblock .contractPackagePriceInfo,
[data-package="pro"] .rd-contract-inter-packageblock .contractPackageLicenseInfo {
	color: var(--rd-font-light);
}

[data-package="livePlus"] .rd-contract-inter-packageblock {
	background: #e7f0d9;
}

.paket_titel {
	margin-bottom: var(--rd-spacing-lg);
}

.pf_block+.rd-secondary-btn-textlink {
	margin-bottom: var(--rd-spacing-xxx-lg);
}

/* The back link is a <button> when it re-submits the form (bestellung.php) and an <a> when it
   navigates by URL (kaufen.php). An inline <a> would drop the margin-bottom above. */
.pf_block+a.rd-secondary-btn-textlink {
	display: inline-block;
}

/* Prefilled, non-editable checkout fields (Vorname/Name on kaufen.php); grey per Figma. */

/* Emoji next to the step headline, by what is switched on: Arbeitsschutz alone gets the star
   face, the bonus system the party face (rule below, same specificity but later), both of them
   the fire. Nothing switched on gets no emoji — for every package, Professionell included. */
[data-is-addon-occupationalsafety-included="true"] h1::after,
[data-is-bonus-included="true"] h1::after {
	content: "";
	display: inline-block;
	background-image: url(/src/img/2024/images/starFace.png);
	background-repeat: no-repeat;
	background-size: 100%;
	background-position: 50%;
	margin-left: 8px;
	height: 40px;
	width: 40px;
	vertical-align: middle;
	align-self: center;
}

[data-is-addon-occupationalsafety-included="true"][data-is-bonus-included="true"] h1::after {
	content: "";
	display: inline-block;
	background-image: url(/src/img/2024/images/feuer.png);
	background-repeat: no-repeat;
	background-size: 100%;
	background-position: 50%;
	margin-left: 8px;
	height: 40px;
	width: 40px;
	vertical-align: middle;
	align-self: center;
}

[data-is-bonus-included="true"] h1::after {
	content: "";
	display: inline-block;
	background-image: url(/src/img/2024/images/partyFace.png);
	background-repeat: no-repeat;
	background-size: 100%;
	background-position: 50%;
	margin-left: 8px;
	height: 40px;
	width: 40px;
	vertical-align: middle;
	align-self: center;
}

.rd-contract-intermediate-page {
	margin-bottom: var(--rd-spacing-x-huge);
}

.rd-contract-inter-packageblock .contractPackageTitle {
	font-size: var(--rd-spacing-xx-big);
	font-weight: var(--rd-fontweights-open-sans-0);
	line-height: var(--rd-lineheights-0);
	letter-spacing: 0.28px;
	color: var(--rd-primary-active);
	margin-bottom: var(--rd-spacing-md);
}

.pricing .rd-contract-inter-packageblock .contractPackageTitle {
	margin-top: 0 !IMPORTANT;
}

.rd-contract-inter-packageblock .contractPackagePrice {
	line-height: var(--rd-lineheights-0);
	letter-spacing: 0.6px;
	margin-bottom: var(--rd-spacing-x-sm);
	margin-top: 0;
}

.rd-contract-inter-packageblock .contractPackageLicenseInfo {
	margin-bottom: 0;
}

.rd-contract-intermediate-page .pricing_intro a {
	font-size: 18px;
	line-height: 29px;
	margin-bottom: 0;
}

.rd-contract-intermediate-page h1 {
	font-size: 38px;
	font-weight: 700;
	line-height: 52px;
	margin-bottom: 24px;
}

.rd-contract-intermediate-form {
	margin-bottom: var(--rd-spacing-lg);
}

.rd-contract-intermediate-form-wrapper {
	text-align: right;
	max-width: 960px;
	margin: auto;
}

.rd-surveyIncludedInProBadge {
	position: absolute;
	left: 179px;
	top: -14px;
	width: 101px;
	height: 57px;
	z-index: 10;
	font-family: Caveat;
	color: var(--rd-primary-active) !important;
	line-height: 28px;
	background: var(--rd-font-light);
	box-shadow: 0px 10px 15px 0px rgba(16, 24, 40, 0.1);
	padding: var(--rd-spacing-md) 24px;
	border-radius: 16px;
	border: 1px solid #d66181;
	text-align: center;
	transform: rotate(-10deg);
	font-weight: var(--rd-fontweights-open-sans-0);
	font-size: 26px;
}

.rd-slider-row-survey-switch.rd-slider-row .rd-input-content,
.rd-slider-row-bonus-switch .rd-input-content,
.rd-contract-inter-surveyblock .rd-input-content {
	width: 56px !important;
}

.rd-contract-inter-surveyblock .rd-label-content.rd-info-label {
	grid-template-columns: auto;
	align-self: center !important;
}

.rd-contract-inter-moduleblocks .rd-slider-row-bonus-switch,
.rd-contract-inter-moduleblocks .rd-slider-row-survey-switch {
	height: 119px;
}

.rd-contract-inter-moduleblocks .rd-slider-row.rd-slider-row-survey-switch {
	margin-bottom: var(--rd-spacing-md) !important;
}

.rd-switch-subinfo a {
	font-size: var(--rd-fontsize-4);
	color: var(--rd-secondary-active);
	line-height: 132%;
	letter-spacing: 0.14px;
	font-weight: var(--rd-fontweights-open-sans-2);
}

.rd-switch-subinfo {
	font-size: var(--rd-fontsize-4);
	color: var(--rd-primary-active);
	line-height: 132%;
	font-weight: var(--rd-fontweights-open-sans-2);
	text-align: left;
}

.rd-surveyIncludedInProBadge+.rd-badgetip-arrow {
	height: 70px;
	background-image: url(/src/img/2023/svg/svg_img/badgeTipArrow.svg);
	background-repeat: no-repeat;
	background-position: left bottom;
	background-size: contain;
	position: absolute;
	width: 40px;
	top: 8px;
	transform: rotate(-39deg);
	right: 115px;
}

body {
	font-family: "Open Sans";
	letter-spacing: 0;
}

.contractPackageTitle {
	color: var(--rd-primary-active) !important;
	font-size: var(--rd-fontsize-9);
	font-weight: var(--rd-fontweights-open-sans-0);
	line-height: var(--rd-lineheights-1);
	text-align: center;
	/* width: 8em; */
	margin: auto;
	text-transform: uppercase;
}

.contractPackagePrice {
	color: var(--rd-font-dark);
	font-size: 60px;
	font-weight: var(--rd-fontweights-open-sans-0);
	line-height: var(--rd-lineheights-0);
	text-align: center;
	margin-top: var(--rd-spacing-md);
	margin-bottom: var(--rd-spacing-xx-sm);
}

[data-isqmgloballyenabled="false"] [data-packagename="pro"] .contractPackagePrice {
	display: block;
	font-size: var(--rd-fontsize-8);
	margin-left: var(--rd-spacing-x-huge);
	margin-bottom: var(--rd-spacing-lg);
	margin-top: var(--rd-spacing-lg);
	padding-top: var(--rd-spacing-big);
	padding-bottom: var(--rd-spacing-big);
	color: var(--rd-primary-active);
	font-weight: var(--rd-fontweights-open-sans-0);
	line-height: 28px;
	text-align: left;
}

.pkgCancelDate {
	margin-top: var(--rd-spacing-md);
	font-weight: var(--rd-fontweights-open-sans-0);
}

.contractChangeFinishedPopup .pcx_success_dialog_closelink {
	display: none;
}

.contractChangeFinishedPopup .btnwrap {
	margin-top: var(--rd-spacing-xxx-big);
	padding-bottom: var(--rd-spacing-xxx-big);
}

.contractChangeFinishedPopup .pcx_success_dialog_title {
	font-size: var(--rd-fontsize-11);
}

.contractChangeFinishedPopup {
	padding: var(--rd-spacing-md) var(--rd-spacing-xx-lg);
}

.contractChangeFinishedPopup.rd-popup-dialog .btnwrap {
	padding-bottom: 0 !important;
	display: flex;
	justify-content: center;
	gap: 16px;
	flex-wrap: wrap;
}

.contractPackagePriceInfo {
	color: #6B7280 !important;
	text-align: center;
	margin-bottom: var(--rd-spacing-xx-sm);
	font-size: 14px;
	font-style: normal;
	font-weight: 400 !important;
	line-height: 120%;
	letter-spacing: 0.14px;
	margin-top: 4px;
}

.contractPackageLicenseInfo {
	font-size: var(--rd-fontsize-5);
	font-weight: var(--rd-fontweights-open-sans-0);
	line-height: 132%;
	letter-spacing: 0.16px;
	text-align: center;
	margin-bottom: var(--rd-spacing-x-lg);
	color: #0D1130;
}

/* Enterprise fee — shown directly below the package price from 150 licences on,
   above the "pro Monat" note. Listed separately and deliberately not included in
   the price above it. Label left, price right, both in the card's own text colour. */
.rd-enterprise-fee {
	display: flex;
	justify-content: space-between;
	margin-top: var(--rd-spacing-x-sm);
	margin-bottom: var(--rd-spacing-x-big);
	color: var(--rd-font-dark);
	font-size: var(--rd-fontsize-4);
	font-weight: var(--rd-fontweights-open-sans-1);
	line-height: normal;
}

/* The package cards carry no horizontal padding of their own — inset the row so
   it lines up with the feature list below it. */
.contractPackage .rd-enterprise-fee {
	padding: 0 var(--rd-spacing-xxx-big);
}

.rd-enterprise-fee-label {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.contractPackage[data-packagename="pro"]>div .rd-enterprise-fee,
[data-package="pro"] .rd-contract-inter-packageblock .rd-enterprise-fee {
	color: var(--rd-font-light);
}

/* One step up from the label, per design. */
.rd-enterprise-fee-price {
	font-size: 15px;
	white-space: nowrap;
}

/* The dark package block colours its price texts individually, so the fee row
   needs the same treatment to stay legible. */
#pc_tooltip_peer_content ul.rd-enterprise-fee-tooltip {
	margin: var(--rd-spacing-x-sm) 0 0;
	padding-left: var(--rd-spacing-md);
}

.contractPackageButtonWrap,
.contractPackageEndTestButtonWrap {
	text-align: center;
	margin-bottom: var(--rd-spacing-x-sm);
}

.contractPackageButtonWrap .button.regular.fill.disabled {
	background: var(--cl-blue-grey);
	filter: unset;
	border: none;
}

.contractPackageEndTestButtonWrap a {
	display: block;
}

.contractPackage[data-isactive="true"] .contractPackageButtonWrap>a.button {
	/* pointer-events: none; */
}

.contractPackageFeature::before {
	content: "";
	display: inline-block;
	/* // NOTE: wrong filename! */
	mask-image: url("/src/img/2024/svg/icons/rd-icon-check-circle-fill.svg");
	-webkit-mask-image: url("/src/img/2024/svg/icons/rd-icon-check-circle-fill.svg");
	background-color: var(--rd-success-default);
	mask-size: contain;
	-webkit-mask-size: contain;
	mask-position: 50%;
	-webkit-mask-position: 50%;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	background-size: 100%;
	background-position: 50%;
	width: 28px;
	height: 28px;
	vertical-align: top;
	flex-shrink: 0;
	/* position: absolute;
	left: 32px; */
}

.contractPackageFeature pc-tooltip.info {
	flex-shrink: 0;
	background-image: unset !important;
	mask-image: url(/src/img/2023/svg/icons/rd-icon-info-circle.svg);
	-webkit-mask-image: url(/src/img/2023/svg/icons/rd-icon-info-circle.svg);
	background-color: #9CA3AF;
}

.contractPackageFeature.contractPackageFeatureMissing::before {
	mask-image: url("/src/img/2024/svg/icons/rd-icon-x-circle-fill.svg");
	-webkit-mask-image: url("/src/img/2024/svg/icons/rd-icon-x-circle-fill.svg");
	background-color: #9CA3AF;
	background-image: none !important;

}

.contractPackageFeature[data-feature-key="aiFeatures"]::before {
	color: var(--rd-font-light);
	mask-image: none !important;
	-webkit-mask-image: none !important;
	content: "NEU";
	background-color: var(--rd-primary-active);
	border-radius: 96px;
	padding: 2px 8px;
	width: auto;
	display: inline-block;
	font-weight: 500;
	line-height: 16px;
	height: auto;
	font-size: var(--rd-fontsize-3);
	margin-top: 0;
}

.contractPackage[data-packagename="livePlus"] .contractPackageFeature[data-feature-key="aiFeatures"] {
	margin-top: 67px;
}

.contractPackage[data-packagename="pro"] .contractPackageFeature[data-feature-key="aiFeatures"] {
	margin-top: 63px;
	font-weight: var(--rd-fontweights-open-sans-0);
	color: var(--rd-font-light);
}

.contractPackageFeature[data-feature-key="aiFeatures"] {
	font-size: var(--rd-fontsize-5);
	font-weight: var(--rd-fontweights-open-sans-0);
	line-height: var(--rd-lineheights-0);
	letter-spacing: 0.16px;
	color: var(--rd-font-dark);
	align-items: center;
	margin-top: var(--rd-spacing-x-lg);
	margin-bottom: var(--rd-spacing-x-big);
}

.contractPackages[data-is-logged-in="false"] .contractPackage {
	display: flex;
	flex-direction: column;
}

.contractPackages[data-is-logged-in="false"] .contractPackageFeatures {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
}

.contractPackages[data-is-logged-in="false"] .contractPackage .contractPackageFeature[data-feature-key="aiFeatures"] {
	margin-top: auto;
	padding-top: var(--rd-spacing-md);
}

.contractPackageFeature:has(.rd-ki-features):before {
	background-image: url('/src/img/2024/svg/icons/rainbow-zauberstab.svg');
	mask-image: none !important;
	-webkit-mask-image: none !important;
	background-color: transparent;
}

.contractPackageFeature:has(.rd-plus-features) {
	margin-top: 0;
	margin-bottom: 0;
}

.contractPackageFeature:not(:has(.rd-plus-features))+.contractPackageFeature:has(.rd-plus-features) {
	margin-top: var(--rd-spacing-x-lg);
	margin-bottom: var(--rd-spacing-md);
}

.contractPackageFeature.contractPackageFeatureMissing {
	color: var(--rd-gray-400);
}


pc-contracts-app[ispluspackagereleased] .contractPackageFeature.feature-disabled:has(.rd-plus-features):before,
.addOns .contractPackageFeature.feature-disabled:before {
	mask-image: url("/src/img/2024/svg/icons/rd-icon-plus-circle-fill.svg");
	-webkit-mask-image: url("/src/img/2024/svg/icons/rd-icon-plus-circle-fill.svg");
	background-color: var(--rd-primary-active);
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	mask-size: contain;
	-webkit-mask-size: contain;
	width: 28px;
	height: 28px;
	background-image: none !important;
}

.contractPackageFeature.feature-disabled::before {
	/* // NOTE: wrong filename! */
	background-image: url(/src/img/2021/svg/contract-enable.svg);
}

.contractPackageSubTitle {
	font-size: 16px;
	font-style: normal;
	font-weight: 500 !important;
	line-height: 150%;
	/* 24px */
	letter-spacing: 0.16px;
	color: #4B5563;
	margin: auto;
	margin-top: 4px !important;
}

.contractPackageSubTitle .rd-icon-zauberstab-verlauf.rd-icon-after:after {
	width: 24px;
	height: 24px;
}

/* [data-packagename="basic"] .contractPackageSubTitle{
	max-width: 200px;
}

[data-packagename="livePlus"] .contractPackageSubTitle{
	max-width: 200px;
} */



pc-admin-app-liveplus {
	margin-left: var(--rd-spacing-xxx-big);
	/* border-left: 3px solid var(--cl-light-grey); */
	padding-left: var(--rd-spacing-md);
	position: relative;
	display: block;
	margin-bottom: var(--rd-spacing-md);
}

pc-admin-app-liveplus ul {
	margin-top: var(--rd-spacing-md);
}

.contractPackageFeatures {
	font-size: var(--rd-fontsize-5);
	line-height: 24px;
	padding: 0 var(--rd-spacing-xxx-big) 0 var(--rd-spacing-xxx-big);
	display: block;
}

.contractPackageAllFeaturesWrap {
	display: none;
}

[data-packagename="basic"] .contractPackageAllFeaturesWrap {
	display: block;
}

.contractPackageAllFeaturesWrap .contractPackageFeatures {
	display: none;
}

.contractPackageAllFeaturesWrap[data-expanded="true"] .contractPackageFeatures {
	display: block;
}

.contractPackageAllFeaturesWrap[data-expanded="true"] .contractPackageShowAllFeaturesLink {
	display: none;
}

.contractPackageFeature {
	margin-bottom: var(--rd-spacing-md);
	display: flex;
	gap: 4px;
	line-height: var(--rd-lineheights-0);
	color: #4B5563;
	font-size: var(--rd-fontsize-4);
	align-items: center;
	letter-spacing: 0.14px;
}

.packageSnipFeatureCardIntro {
	color: var(--rd-font-dark);
	font-weight: var(--rd-fontweights-open-sans-1);
	font-size: var(--rd-fontsize-5);
	margin-top: var(--rd-spacing-x-lg) !important;
	margin-bottom: var(--rd-spacing-x-big);
	font-weight: var(--rd-fontweights-open-sans-0);
	line-height: var(--rd-lineheights-0);
	padding-left: var(--rd-spacing-xxx-big);
}

pc-contracts-app[ispluspackagereleased] .packageSnipFeatureCardIntro {
	font-size: var(--rd-fontsize-5);
}

/* 
.contractPackageFeatureMissing {
	opacity: 0.6;
	color: var(--rd-font-dark);
	font-size: var(--rd-fontsize-4);
	line-height: 24px;
	margin-bottom: var(--rd-spacing-sm);
} */

.contractPackageShowAllFeaturesLink {
	color: var(--rd-font-dark);
	font-size: var(--rd-fontsize-4);
	font-weight: var(--rd-fontweights-open-sans-1);
	line-height: 24px;
	margin-left: var(--rd-spacing-xxx-big);
	display: flex;
}

.contractPackageShowAllFeaturesLink::after {
	content: "";
	margin-left: var(--rd-spacing-x-sm);
	mask-image: url(/src/img/2021/svg/arrow.svg);
	-webkit-mask-image: url(/src/img/2021/svg/arrow.svg);
	mask-size: contain;
	-webkit-mask-size: contain;
	mask-position: 50%;
	-webkit-mask-position: 50%;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	margin-top: var(--rd-spacing-x-sm);
	background-color: var(--rd-font-dark);
	height: 12px;
	width: 13px;
}

pc-contracts-app,
pc-pricing-messe {
	display: inline-block;
	position: relative;
	text-align: center;
}

.customer_package_intro {
	/* border: 1px solid red; */
	text-align: center;
	width: 1142px;
	max-width: 100%;
	margin-bottom: var(--rd-spacing-lg);
}

.customer_package_intro h2 {
	font-size: var(--rd-fontsize-5);
	color: var(--rd-font-dark);
	font-weight: var(--rd-fontweights-open-sans-0);
	line-height: 132%;
}

.customer_package_intro p {
	color: var(--rd-font-dark);
	font-size: var(--rd-fontsize-7);
}

.contractPackage {
	display: block;
	position: relative;
	box-sizing: border-box;
	border: var(--rd-borderwidth-border-default) solid var(--cl-light-grey);
	padding: var(--rd-spacing-xx-lg) 0 var(--rd-spacing-x-lg);
	max-width: 360px;
	border-radius: 20px;
	background-color: var(--rd-font-light);
	box-shadow: 0px 2px 5px rgba(16, 24, 40, 0.1);
}

.contractPackage[data-packagename="pro"] {
	background-color: #26456d;
	color: var(--rd-font-light);
}

.contractPackage[data-packagename="basic"] {
	background-color: #fbeff3;
	grid-area: one;
}

.contractPackage[data-packagename="livePlus"] {
	background-color: #e7f0d9;
	grid-area: two;
}

.contractPackage[data-packagename="pro"]>div {
	color: var(--rd-font-light);
}

.contractPackage[data-packagename="pro"] .contractPackageFeatures>div {
	color: #D1D5DB;
	font-weight: 400;
}

.reminderIcon {
	background: url("/src/img/svg/ic_notifications_empty.svg");
	background-repeat: no-repeat;
	background-size: contain;
	width: 20px;
	height: 23px;
	display: inline-block;
	vertical-align: middle;
	margin-right: var(--rd-spacing-xx-sm);
}

[data-isqmgloballyenabled="false"] [data-packagename="pro"] .contractPackageButtonWrap a.button:hover .reminderIcon {
	background-image: url("/src/img/svg/ic_notifications_gray.svg");
}

[data-iscurrentuseronwaitinglistforprofessional="true"][data-isqmgloballyenabled="false"] [data-packagename="pro"] .contractPackageButtonWrap a.button .reminderIcon {
	background-image: url("/src/img/svg/ic_notifications_active.png");
}

[data-iscurrentuseronwaitinglistforprofessional="true"][data-isqmgloballyenabled="false"] [data-packagename="pro"] .contractPackageButtonWrap a.button {
	pointer-events: none;
}

.proReminderInfo {
	font-size: var(--rd-fontsize-4);
	width: 297px;
	margin: auto;
	margin-top: var(--rd-spacing-x-sm);
	/* background: yellow; */
	font-weight: var(--rd-fontweights-open-sans-2);
	color: var(--rd-font-dark);
}

.features-box {
	width: auto;
	display: flex;
	flex-direction: column;
	margin-top: var(--rd-spacing-big);
}

.features-box table tbody td {
	padding: var(--rd-spacing-md) var(--rd-spacing-sm);
}

/* .contractPackage[data-isactive="true"]::before {
	z-index: 2;
	background: var(--rd-font-light);
	mask-image: url("/src/img/svg/li_check_green.svg");
	-webkit-mask-image: url("/src/img/svg/li_check_green.svg");
	mask-size: contain;
	-webkit-mask-size: 20px;
	mask-position: 50%;
	-webkit-mask-position: 50%;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
} */

.contractPackage[data-isactive="true"]:before {
	content: "Gebuchtes Paket";
	background-color: var(--rd-secondary-active);
	height: 43px;
	width: 100%;
	display: inline-flex;
	margin-bottom: var(--rd-spacing-sm);
	color: #f4f6f8;
	font-size: var(--rd-fontsize-5);
	font-weight: var(--rd-fontweights-open-sans-0);
	line-height: var(--rd-lineheights-1);
	justify-content: center;
	align-items: center;
	border-radius: 19px 19px 0 0;
	z-index: 1;
	position: absolute;
	left: 0;
	top: 0;
}

[data-package-active="pro"] .contractPackage[data-packagename="pro"] .rd-surveyIncludedInProBadge,
[data-package-active="pro"] .contractPackage[data-packagename="pro"] .rd-badgetip-arrow {
	display: none;
}

/* .contractPackage[data-isactive="true"] {
	padding-top: 0;
} */

.contractPackages .button.regular {
	padding: 9px var(--rd-spacing-md) !important;
	width: -webkit-fill-available !important;
	margin-left: var(--rd-spacing-x-lg);
	margin-right: var(--rd-spacing-x-lg);
	line-height: 20px;
}

.contractPackageButtonWrap .button {
	display: block;
}

.features-box .header-tr th {
	background-color: var(--rd-font-light);
	border-top: var(--rd-borderwidth-border-default) solid var(--cl-light-grey);
	border-bottom: var(--rd-borderwidth-border-default) solid var(--cl-light-grey);
	padding: var(--rd-spacing-xx-big) 0 var(--rd-spacing-xx-big);
}

.features-box .big-title {
	font-size: var(--rd-fontsize-8);
	font-weight: var(--rd-fontweights-open-sans-0);
	line-height: 28px;
	color: var(--rd-font-dark);
}

.features-box .btr-title {
	float: left;
	font-size: var(--rd-fontsize-4);
	line-height: 24px;
	color: var(--cl-dark-text);
}

.features-box label {
	font-size: var(--rd-fontsize-4);
	line-height: var(--rd-lineheights-0);
	margin-bottom: var(--rd-spacing-lg);
	/* margin-top: var(--rd-spacing-big); */
	color: var(--rd-secondary-active);
}

.features-box .afc-title {
	font-size: var(--rd-fontsize-11);
	font-weight: var(--rd-fontweights-open-sans-0);
	line-height: 38px;
	text-align: center;
	color: var(--rd-font-dark);
	margin-bottom: var(--rd-spacing-x-sm);
}

.features-box .afc-sub-title {
	font-size: var(--rd-fontsize-5);
	line-height: 24px;
	text-align: center;
	color: var(--cl-asphalt-blue);
}

.features-box table {
	width: 100%;
	display: block;
	background-color: var(--rd-font-light);
	border: var(--rd-borderwidth-border-default) solid var(--cl-light-grey);
	border-radius: var(--rd-borderradius-border-md);
	border-top: none;
	border-bottom: none;
}

.features-box .body-tr {
	border-bottom: none !important;
}

.features-box .btr-title {
	padding-left: 0;
}

.features-box .padbox {
	padding: var(--rd-spacing-md) !important;
}

.features-box table tbody td:nth-child(1) {
	margin-left: var(--rd-spacing-x-big);
	text-align: left;
	/* white-space: nowrap; */
}

.features-box .header-tr .big-title {
	padding-left: var(--rd-spacing-x-big);
	width: 30%;
}

.features-box td a {
	color: var(--rd-primary-active);
	font-size: var(--rd-fontsize-5);
	font-weight: var(--rd-fontweights-open-sans-1);
	line-height: 24px;
}

.features-box tbody td:nth-child(3) {
	background-color: var(--cl-olive);
}

.features-box .small-title {
	text-align: center;
	font-size: var(--rd-fontsize-5);
	font-weight: var(--rd-fontweights-open-sans-1);
	line-height: 28px;
	color: var(--rd-font-dark);
	width: 285px !important;
}

.btr-enable,
.btr-disabled {
	display: inline-block;
	background-image: url(/src/img/2021/svg/contract-disabled.svg);
	background-size: 100%;
	background-position: 50%;
	width: 24px;
	height: 24px;
}

.btr-disabled {
	background-image: url(/src/img/2021/svg/contract-enable.svg);
}

.btr-text {
	font-weight: var(--rd-fontweights-open-sans-1);
	color: var(--rd-font-dark);
	font-size: var(--rd-fontsize-4);
}

.btr-add-on {
	background-image: url("/src/img/2024/svg/icons/rd-icon-plus-circle-fill.svg");
}

/* [data-packagename="pro"]::after {
	content: "";
	position: absolute;
	right: -24px;
	top: -24px;
	background-image: url(/src/img/2021/svg/SleeveNew.svg);
	background-position: 50%;
	height: 125px;
	width: 125px;
} */

.features-box tr.footer-tr {
	border-top: var(--rd-borderwidth-border-default) solid var(--cl-light-grey);
}

/* .features-box .footer-tr td{
    padding-top:31.5px;
    padding-bottom:48px
} */

[data-isqmgloballyenabled="false"] [data-packagename="pro"] .contractPackagePrice::before {
	content: "";
	display: inline-block;
	background-image: url(/src/img/2021/svg/Flying-Objects.svg);
	background-size: 100%;
	/* background-position: 50%; */
	width: 40px;
	height: 111px;
	vertical-align: middle;
	position: absolute;
	left: 64px;
	top: 80px;
}

.mainframe.customer_package_wrap>section {
	overflow: visible;
}

.mainframe.customer_package_wrap .features-box .help_bullet {
	background-position: center;
}

.mainframe.customer_package_wrap .cont_body {
	background-color: transparent;
	border: none;
}

.footer-tr td:nth-child(3) {
	background-color: var(--rd-font-light) !important;
}

[data-isqmgloballyenabled="false"] [data-packagename="pro"] .contractPackageLicenseInfo {
	display: none;
}

.features-box label::after {
	content: "";
	margin-left: var(--rd-spacing-x-sm);
	mask-image: url(/src/img/2021/svg/arrow.svg);
	-webkit-mask-image: url(/src/img/2021/svg/arrow.svg);
	mask-size: contain;
	-webkit-mask-size: contain;
	mask-position: 50%;
	-webkit-mask-position: 50%;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	background-color: var(--rd-secondary-active);
	height: 15.17px;
	width: 16px;
	display: inline-block;
	vertical-align: middle;
	transition: all 0.2s linear;
	transform: rotate(180deg);
}

input#all-fetures:checked~label[for="all-fetures"]:after {
	transform: rotate(0deg);
}

#all-fetures-content label::after {
	transform: rotate(0deg);
}

.features-box table tbody tr {
	border-bottom: var(--rd-borderwidth-border-default) solid var(--cl-light-grey);
}

/* NEW CUSTOMER */

.contractPackages {
	display: flex;
	/* grid-template-columns: 1fr 1fr 1fr; */
	justify-content: center;
	flex-wrap: wrap;
	gap: 16px;
	margin-top: 24px;
}

/* TODO merge this with regular contractPackages when needed */
pc-pricing-messe .contractPackages {
	margin-top: var(--rd-spacing-xxx-lg);

}

pc-contracts-app {
	margin-top: var(--rd-spacing-x-big);
}

.customer_package_wrap .rd-bonus-switch-wrap {
	margin-bottom: var(--rd-spacing-xx-lg);
}

.rd-bonus-switch-wrap .rd-slider-row {
	flex-direction: row;
	gap: 20px;
}

.contractPackage {
	width: auto;
}

.rd-bonus-switch-wrap .rd-label-content.rd-info-label {
	grid-template-columns: auto;
}

.rd-bonus-switch-wrap .rd-slider-row .rd-label-content {
	margin-top: 0;
	align-self: start;
}

/* .rd-bonus-switch-wrap .rd-label-content.rd-info-label {
	grid-template-columns: 220px 30px;
} */

.rd-bonus-switch-wrap .rd-slider-row {
	border: 1px solid var(--Gray-Dark-Gray-400, #ccc);
	background: var(--rd-font-light);
	box-shadow: 0px 1px 2px 0px rgba(15, 15, 16, 0.05);
	padding: var(--rd-spacing-md) var(--rd-spacing-x-big);
	align-items: center;
	justify-content: end;
	margin-bottom: 0;
	position: relative;
}

.rd-bonus-switch-wrap {
	display: grid;
	grid-template-columns: 49% 49%;
	gap: 24px;
	justify-content: center;
}

.rd-bonus-switch-wrap .rd-slider-row .rd-input-content {
	width: 56px !important;
}

/* Framework add-on switch modifier */
.rd-slider-row-addon-switch .rd-label-content {
	flex: 1;
}

.rd-contract-inter-surveyblock .rd-slider-row-addon-switch .rd-switch-subinfo {
	color: var(--rd-primary-active) !important;
	text-align: left;
	font-size: var(--rd-fontsize-4) !important;

	line-height: 132%;
}

.contractPackages .rd_text_info_caveat_box {
	width: 274px;
	border: 1px solid #eaecf0;
	transform: rotate(-7.521deg);
	top: -55px;
	left: calc(100% - 315px);
	z-index: 10;
	text-align: center;
}

.contractPackages .rd_text_info_caveat_pfeil {
	z-index: 1;
	position: absolute;
	left: calc(100% - 180px);
	top: -10px;
}

.contractPackage[data-isactive="true"] .rd_text_info_caveat_box,
.contractPackage[data-isactive="true"] .rd_text_info_caveat_pfeil {
	display: none;
}

.contractPackage[data-packagename="pro"][data-isactive="true"] {
	background-color: #26456d;
}

.customer_package_wrap .rd_text_info_caveat_box {
	border: none;
}

.contractPackageFeature,
.packageSnipFeatureCardIntro {
	text-align: left;
}

.contractPackages .help_bullet,
#all-fetures-content .help_bullet {
	margin-bottom: var(--rd-spacing-x-sm);
	background-position: 50%;
	background-image: url(/src/img/2021/svg/Tooltip_Info.svg);
	background-size: 100%;
}

.footer-tr .features-box table tbody td {
	padding: 0;
}

.many_user,
.one_user {
	display: none !important;
}

input[type="range"]#users_input {
	-webkit-appearance: none;
	margin: var(--rd-spacing-md) 0;
	width: 100%;
}

input[type="range"]#users_input:focus {
	outline: none;
}

.slider-outdiv {
	display: inline-block;
	position: relative;
	width: 50%;
}

#users_input_text {
	position: absolute;
	top: -30px;
	margin-left: var(--rd-spacing-xx-sm);
	font-size: var(--rd-fontsize-8);
	font-weight: var(--rd-fontweights-open-sans-0);
	color: var(--rd-primary-active);
}

input[type="range"]#users_input,
input[type="range"]#users_input::-webkit-slider-runnable-track {
	width: 100%;
	height: 12px;
	border-radius: var(--rd-borderradius-border-md);
}

input[type="range"]#users_input::-webkit-slider-thumb {
	height: 36px;
	width: 36px;
	border-radius: 50%;
	background-image: radial-gradient(var(--rd-primary-active) 40%, var(--rd-font-light) 50%);
	margin-top: -12px;
	border: var(--rd-borderwidth-border-default) solid var(--cl-light-grey);
}

input[type="range"]#users_input::-moz-range-thumb {
	height: 36px;
	width: 36px;
	border-radius: 50%;
	background-image: radial-gradient(var(--rd-primary-active) 40%, var(--rd-font-light) 50%);
	margin-top: -12px;
	border: var(--rd-borderwidth-border-default) solid var(--cl-light-grey);
}

.how_meny_users {
	font-size: var(--rd-fontsize-7);
	font-weight: var(--rd-fontweights-open-sans-0);
	color: var(--rd-font-dark);
	line-height: 26px;
	margin-bottom: var(--rd-spacing-x-lg);
	text-align: center !important;
	padding-bottom: 0;
}

.slider-outdiv:before {
	bottom: 0;
}

.pricing h1 {
	margin-bottom: var(--rd-spacing-md) !important;
}

.pricing_intro a {
	color: var(--rd-primary-active);
	font-weight: var(--rd-fontweights-open-sans-1);
}

.pricing_intro a:hover {
	color: var(--rd-primary-hover);
}

.pricing_intro a:focus {
	color: var(--rd-primary-pressed) !important;
	text-decoration: none !important;
}

.pricing_intro p {
	color: #374551;
	font-size: var(--rd-fontsize-6);
	line-height: 29px;
	margin-bottom: var(--rd-spacing-lg);
}

.pricing_intro+div {
	padding-bottom: var(--rd-spacing-lg);
	text-align: left;
	max-width: 960px;
	margin: auto;
}

#agb_accept_border .rd-checkbox {
	margin-left: 0;
	width: 18px !important;
	display: inline-block !important;
}

.agb_block #agb_accept_border {
	text-align: left;
	display: grid;
	grid-template-columns: 30px auto;
	align-items: center;
}

.agb_block #agb_accept_border label a {
	color: var(--rd-secondary-active);
}

.agb_block {
	border-radius: var(--x-sm, 8px);
	border: 1px solid var(--Primary-Inactive, #ccc);
	background: var(--Base-Colors-fg-bg, #f2f6fa);
	padding: 40px;
	text-align: center;
}

.btn-label-short {
	display: none;
}

.btn-label-mid {
	display: block;
}

.proPackageNote {
	color: var(--rd-primary-active);
	font-size: var(--rd-fontsize-5);
	font-weight: var(--rd-fontweights-open-sans-1);
	line-height: 24px;
	text-align: center;
}

.features-box-desktop+label {
	font-size: var(--rd-fontsize-4);
	font-weight: var(--rd-fontweights-open-sans-1);
}

.features-box-desktop+label::after {
	height: 12px;
	width: 13px;
}

.largeClientPrice {
	font-size: var(--rd-fontsize-8);
	font-weight: var(--rd-fontweights-open-sans-0);
	line-height: 28px;
	text-align: center;
	color: var(--rd-primary-active);
	margin-top: 60px;
	margin-bottom: 74px;
}

/* features-box-mobile */
.features-box-mobile {
	display: none;
}

.features-box-desktop {
	display: block;
	margin-top: var(--rd-spacing-xxx-big);
}

.features-box-mobile table {
	border: none;
}

.features-box-mobile .features-box-section-head {
	display: block;
	padding: var(--rd-spacing-x-big) 0 var(--rd-spacing-md) var(--rd-spacing-xx-sm);
	cursor: pointer;
	font-size: var(--rd-fontsize-7);
	font-weight: var(--rd-fontweights-open-sans-0);
	line-height: 26px;
	border-bottom: var(--rd-borderwidth-border-default) solid var(--cl-light-grey);
	text-align: left;
}

.features-box-mobile .features-box-section[data-section-state="closed"] .features-box-section-features {
	display: none;
}

.features-box-mobile table,
.features-box-mobile tbody {
	width: 100%;
	display: table;
}

.features-box-mobile .btr-title,
.features-box-mobile .btr-cont {
	border: none;
}

.features-box-mobile table tbody td:nth-child(1) {
	white-space: normal;
	margin-left: var(--rd-spacing-xx-sm);
	/* width: 295px; */
}

.features-box-mobile .filter_tabs {
	text-align: left;
}

.features-box-mobile .tab_filter ul {
	box-shadow: none;
	border-bottom: var(--rd-borderwidth-border-default) solid var(--cl-light-grey);
	padding: 0;
	display: flex;
}

.features-box-mobile .tab_filter ul li a {
	font-weight: var(--rd-fontweights-open-sans-0);
}

.features-box-mobile .aktiv a:after,
.features-box-mobile .tab_filter ul li a:hover:after {
	background-color: var(--rd-primary-active);
}

.features-box-mobile .tab_filter ul li {
	flex: 1;
	font-weight: var(--rd-fontweights-open-sans-0);
	text-align: center;
	margin-right: 0;
}

.features-box-buyButtonWrap {
	text-align: left;
}

.features-box-mobile .features-box-section-head-label::after {
	content: "";
	display: inline-flex;
	height: 20px;
	width: 20px;
	background-image: url(/src/img/2021/svg/Arrow_down.svg);
	background-size: 100%;
	float: right;
	margin-right: var(--rd-spacing-md);
	margin-top: var(--rd-spacing-x-sm);
	transition: transform 0.2s ease;
}

.features-box-mobile .features-box-section[data-section-state="closed"] .features-box-section-head-label::after {
	transform: rotate(180deg);
}

.slider-outdiv:after {
	background-repeat: no-repeat;
}

input#all-fetures:checked~#all-fetures-content {
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.contractPackages[data-is-new-customer="false"] {
	justify-content: flex-start;
}

.contractPackages[data-is-new-customer="false"]+.features-box {
	width: 1100px;
}

/* .rd-bonus-switch-wrap .rd-slider-row.rd-slider-row-survey-switch label {
	color: var(--rd-font-dark);
} */



.contractPackages[data-is-logged-in="true"] .packageSnipFeatureCardIntro {
	display: none;
}

.contractPackages[data-is-logged-in="true"] .contractPackageFeature[data-feature-key="basicFeaturesIntro"] {
	font-size: var(--rd-fontsize-5);
	font-weight: var(--rd-fontweights-open-sans-0);
	line-height: var(--rd-lineheights-0);
	letter-spacing: 0.16px;
	margin-top: var(--rd-spacing-x-lg);
	margin-bottom: var(--rd-spacing-x-big);
	color: var(--rd-font-dark);
}

.contractPackages[data-is-logged-in="true"] .contractPackageFeature[data-feature-key="basicFeaturesIntro"]::before {
	display: none;

}

.contractPackages[data-is-logged-in="true"] .contractPackageFeature[data-feature-key="aiFeatures"] {
	margin-top: var(--rd-spacing-x-lg) !important;


}

.contractPackages[data-is-logged-in="true"] [data-packagename="livePlus"] .contractPackageFeature:not(:has(.rd-plus-features))+.contractPackageFeature:has(.rd-plus-features) {
	margin-top: var(--rd-spacing-xx-lg);
	margin-bottom: var(--rd-spacing-md);
}

.contractPackages[data-is-logged-in="true"] [data-packagename="pro"] .contractPackageFeature:not(:has(.rd-plus-features))+.contractPackageFeature:has(.rd-plus-features) {
	margin-top: var(--rd-spacing-xx-lg);
	margin-bottom: var(--rd-spacing-md);
}

.contractPackages[data-is-logged-in="true"] [data-packagename="pro"] .contractPackageFeature[data-feature-key="basicFeaturesIntro"] {
	font-size: var(--rd-fontsize-5);
	font-weight: var(--rd-fontweights-open-sans-0);
	line-height: var(--rd-lineheights-0);
	letter-spacing: 0.16px;
	color: var(--rd-font-light);
}

section.container-fluid.costCutting {
	margin-bottom: var(--rd-spacing-xxx-lg);
}


@media screen and (max-width: 1200px) {
	.btn-label-short {
		display: block;
	}

	.btn-label-mid {
		display: none;
	}

	.contractPackageButtonWrap .proReminderInfo {
		display: none;
	}

	.packageSnipFeatureCardIntro {
		padding-right: var(--rd-spacing-x-big);
	}

	[data-isqmgloballyenabled="false"] [data-packagename="pro"] .contractPackagePrice {
		margin-left: 100px;
	}

	[data-isqmgloballyenabled="false"] [data-packagename="pro"] .contractPackagePrice::before {
		left: 44px;
	}

	.features-box .header-tr .big-title {
		width: 35%;
	}

	.contractPackages {
		display: grid;
		grid-template-areas: "one two" "three three" !important;
		justify-content: center !important;
	}

	.kaufen2022 pc-contracts-app {
		display: grid;
	}

	.rd-contract-intermediate-form {
		grid-template-columns: 1fr 2fr;
	}

}

@media screen and (max-width: 990px) {
	[data-isqmgloballyenabled="false"] [data-packagename="pro"] .contractPackagePrice {
		margin-left: var(--rd-spacing-xxx-lg);
	}

	[data-isqmgloballyenabled="false"] [data-packagename="pro"] .contractPackagePrice::before {
		left: 34px;
	}

	.features-box .header-tr .big-title {
		width: 40%;
	}

	.contractPackages[data-is-new-customer="false"] {
		justify-content: center;
	}

	.contractPackages[data-is-new-customer="false"]+.features-box {
		width: auto;
	}

	.contractPackages {
		margin-top: var(--rd-spacing-lg);
	}

	.costCutting p {
		margin-top: 0 !important;
	}

	.rd-contract-inter-packageblock .contractPackagePrice {
		font-size: var(--rd-fontsize-14);
	}
}

@media screen and (max-width: 900px) {
	.contractPackages[data-is-new-customer="true"] {
		grid-template-columns: 1fr;
		justify-items: center;
	}

	.contractPackages .button.regular {
		width: fit-content !important;
		margin: auto;
		padding: var(--rd-spacing-x-sm) 72px !important;
	}

	.contractPackageFeature {
		padding-left: 0;
		display: flex;
		margin-bottom: var(--rd-spacing-x-sm);
		margin-right: var(--rd-spacing-xxx-big);
		gap: 16px;
	}

	.contractPackageFeature::before {
		position: initial;
		left: 0;
		margin-right: var(--rd-spacing-x-sm);
	}

	[data-isqmgloballyenabled="false"] [data-packagename="pro"] .contractPackagePrice {
		margin-left: var(--rd-spacing-x-big);
		text-align: center;
	}

	[data-isqmgloballyenabled="false"] [data-packagename="pro"] .contractPackagePrice::before {
		left: 241px;
		top: 98px;
	}

	.features-box {
		width: auto;
	}

	.features-box table {
		display: inline-table;
	}

	.features-box .small-title {
		width: unset !important;
		text-align: center;
	}

	.contractPackagePrice span {
		position: relative;
		padding-left: var(--rd-spacing-x-big);
	}

	[data-isqmgloballyenabled="false"] [data-packagename="pro"] .contractPackagePrice span::before {
		content: "";
		display: inline-block;
		background-image: url(/src/img/2021/svg/Flying-Objects.svg);
		background-size: 100%;
		width: 40px;
		height: 111px;
		vertical-align: top;
		position: absolute;
		left: -35px;
		top: -25px;
	}

	[data-isqmgloballyenabled="false"] [data-packagename="pro"] .contractPackagePrice::before {
		display: none;
	}

	.features-box-mobile table {
		display: table;
	}

	.features-box .proReminderInfo {
		display: none;
	}

	.features-box .header-tr .big-title {
		width: unset !important;
	}

	.contractPackageButtonWrap .proReminderInfo {
		display: block;
	}

	.contractPackage:nth-child(3) .button {
		padding: var(--rd-spacing-x-sm) var(--rd-spacing-xxx-lg) !important;
	}

	.pricing_intro {
		margin-bottom: var(--rd-spacing-lg);
	}

	.contractPackages[data-is-new-customer="false"]+.features-box {
		width: auto;
	}

	.contractChangeFinishedPopup.rd-popup-dialog {
		width: auto !important;
		padding: 0;
	}
}

@media screen and (max-width: 800px) {
	.rd-slider-row-survey-switch {
		margin-right: 0 !important;
	}

	.rd-bonus-switch-wrap {
		flex-direction: column;
	}

	.contractPackages {
		display: grid;
		grid-template-areas: "one" "two" "three" !important;
		justify-content: center !important;
	}

	.contractPackage[data-packagename="livePlus"] {
		margin-top: var(--rd-spacing-xx-lg);
	}
}

@media screen and (max-width: 767px) {
	.slider-outdiv {
		width: 65%;
	}

	.rd-contract-intermediate-form {
		flex-direction: column-reverse;
		/* grid-template-columns: 1fr; */
		display: flex;
	}

	.pricing h1 {
		margin-top: var(--rd-spacing-xx-lg) !important;
		margin-bottom: var(--rd-spacing-x-big) !important;
		font-size: 32px !important;
		line-height: 45px !important;
	}

	.features-box-buyButtonWrap {
		padding-top: var(--rd-spacing-md);
		text-align: center;
	}

	.features-box table tbody td {
		padding-right: 0 !important;
		padding-left: 0 !important;
	}

	.features-box-mobile .features-box-section-head-label::after {
		margin-right: var(--rd-spacing-x-sm);
	}

	.features-box .body-tr {
		display: grid;
		grid-template-columns: auto 36px;
	}

}

@media screen and (max-width: 700px) {
	.rd-bonus-switch-wrap {
		grid-template-columns: 100% !important;
	}

	pc-contracts-app {
		display: block;
	}

	.rd-bonus-switch-wrap .rd-slider-row .rd-label-content {
		justify-items: flex-end;
	}
}

@media screen and (max-width: 640px) {


	.costCutting div {
		font-size: var(--rd-fontsize-6) !important;
	}

	.costCutting p {
		font-size: var(--rd-fontsize-5) !important;
	}
}

@media screen and (max-width: 500px) {
	/* .contractPackageFeature table tbody td[data-tooltip].hb_right:hover::before,
	.contractPackageFeature th[data-tooltip].hb_right:hover::before,
	.contractPackageFeature span[data-tooltip].hb_right:hover::before {
		right: 100%;
		top: -10% !important;
		left: unset;
	}

	.contractPackageFeature table tbody td[data-tooltip].hb_right:hover::after,
	.contractPackageFeature th[data-tooltip].hb_right:hover::after,
	.contractPackageFeature span[data-tooltip].hb_right:hover::after {
		left: -5px !important;
		right: unset !important;
	} */

	/* .features-box-mobile table tbody td:nth-child(1) {
		width: 240px;
	} */

	.features-box {
		display: grid;
	}

	.contractPackages .button.regular {
		padding: var(--rd-spacing-x-sm) !important;
		width: unset !important;
		margin-left: var(--rd-spacing-xxx-big);
		margin-right: var(--rd-spacing-xxx-big);
	}

	.contractPackages .button+.button+.button {
		padding: var(--rd-spacing-x-sm) var(--rd-spacing-xxx-lg);
	}

	.contractPackageFeatures {
		display: block;
		margin: 0;
		padding: 0 var(--rd-spacing-big) 0 var(--rd-spacing-x-big);
	}

	.contractPackageButtonWrap {
		margin-bottom: var(--rd-spacing-xx-lg);
	}

	.features-box-buyButtonWrap {
		border-top: var(--rd-borderwidth-border-default) solid var(--cl-light-grey) !important;

	}

	/* The !important margin wins over any margin-top/-right here, so the button stays centered */
	.features-box-buyButtonWrap a {
		width: 100%;
		margin: auto !important;
		text-align: center;
		display: inline-block;
	}

	.features-box table {
		width: 100%;
	}

	.slider-outdiv {
		width: 100%;
	}

	.features-box label {
		margin-bottom: var(--rd-spacing-xx-lg);
		margin-top: var(--rd-spacing-sm);
	}

	.pricing_intro {
		margin-bottom: var(--rd-spacing-xx-lg);
	}

	.pagePopupWaitingListPro .formfields {
		padding: 0;
		grid-gap: 2em !important;
	}

	.pagePopupWaitingListPro .modal_dialog_mid {
		flex: unset !important;
	}

	.rd-contract-inter-buttons a {
		width: 100%;
	}

	.rd-contract-inter-surveyblock .rd-label-content.rd-info-label {
		align-self: flex-start !important;
	}

	.rd-slider-row-addon-switch .rd-slider-inner,
	.rd-slider-row-bonus-switch .rd-slider-inner {
		flex-direction: column-reverse;
		gap: 8px !important;
	}

	.rd-slider-row-survey-switch.rd-slider-row .rd-input-content,
	.rd-slider-row-bonus-switch .rd-input-content {
		align-self: self-end;

	}
}

/* pricing popup */
.pagePopupWaitingListPro .modal_dialog_top_title {
	font-size: var(--rd-fontsize-11);
	margin-top: var(--rd-spacing-xxx-lg);
}

.pagePopupWaitingListPro .modal_dialog_mid {
	padding-top: var(--rd-spacing-x-sm) !important;
	padding-bottom: var(--rd-spacing-x-sm) !important;
	line-height: 29px;
}

.pagePopupWaitingListPro label.formlabel {
	display: none !important;
}

.pagePopupWaitingListPro .litui.modal_ground .formfieldrow .form_kv_key {
	margin: 0;
}

.pagePopupWaitingListPro .litui.modal_ground .formfieldrow .form_kv_value {
	margin-bottom: var(--rd-spacing-x-sm);
}

.pagePopupWaitingListPro .formfields {
	padding-top: var(--rd-spacing-x-big) !important;
}

.pagePopupWaitingListPro .formfields .formfieldrow.form_kv input[type="email"] {
	height: 54px;
	padding: 0 0 0 var(--rd-spacing-md);
}

.pagePopupWaitingListPro [data-key="close"].button {
	display: none;
}

.pagePopupWaitingListPro>div.modal_dialog_bottom {
	margin: 0 var(--rd-spacing-md) var(--rd-spacing-md) var(--rd-spacing-md) !important;
}

.pagePopupWaitingListPro .modal_dialog_bottom>a {
	width: 100%;
	margin: 0;
}

.pagePopupWaitingListPro .button+.button {
	margin-left: 0;
}

.pagePopupWaitingListPro .modal_dialog_closelink {
	right: 41.5px;
	top: 40px;
	background-image: url(/src/img/2021/svg/close.svg);
	background-repeat: no-repeat;
	background-position: 50%;
	background-size: 100%;
}

.kaufen2022 .remainingDemoInfo {
	background-color: var(--rd-font-light);
	border: var(--rd-borderwidth-border-default) solid var(--cl-light-grey);
	padding: var(--rd-spacing-x-big) var(--rd-spacing-md);
	font-size: var(--rd-fontsize-5);
	line-height: 24px;
	width: 100%;
	max-width: 1133px;
	border-radius: var(--rd-borderradius-border-md);
}

.kaufen2022 .pricing_intro_headline {
	text-align: center;
	color: var(--rd-font-dark);
	font-size: var(--rd-fontsize-11);
	font-weight: var(--rd-fontweights-open-sans-0);
	line-height: 30px;
	padding-top: var(--rd-spacing-x-big);
	padding-bottom: var(--rd-spacing-x-sm);
	width: 100%;
	max-width: 1133px;
}

.kaufen2022 .pricing_intro {
	color: var(--cl-dark-text);
	margin-bottom: var(--rd-spacing-md);
	font-size: var(--rd-fontsize-5);
	line-height: 24px;
	text-align: center;
	width: 100%;
	/* max-width: 1133px; */
}

.kaufen2022 .features-box label {
	font-size: var(--rd-fontsize-4);
	margin-top: var(--rd-spacing-md);
}

.kaufen2022 .pcBuyUserCountWrap {
	background-color: var(--rd-font-light);
	padding-top: var(--rd-spacing-x-big);
	text-align: center;
	min-height: 217px;
	width: 100%;
	border-radius: var(--rd-borderradius-border-md);
	border: var(--rd-borderwidth-border-default) solid var(--cl-light-grey);
	max-width: 1112px;
}

.kaufen2022 .features-box {
	width: 100%;
}

.kaufen2022 .contractPackages[data-is-new-customer="true"] {
	margin-top: var(--rd-spacing-x-big);
	justify-items: center;
}

/* .kaufen2022 .mainframe>section .center{
	padding-left: 15px;
	padding-right: 22px;
}
*/

.kaufen2022 .container {
	margin-left: 0 !important;
}

.kaufen2022 .contractPackageFeature {
	font-size: var(--rd-fontsize-4);
	line-height: 24px;
	color: var(--rd-font-dark);
	padding-left: var(--rd-spacing-xxx-big);
}

.kaufen2022 .contractPackage {
	padding-bottom: var(--rd-spacing-lg);
}

.kaufen2022 .contractPackageLicenseInfo {
	margin-bottom: var(--rd-spacing-lg);
}

.kaufen2022 .packageSnipFeatureCardIntro {
	margin-top: var(--rd-spacing-x-lg) !important;
	padding-left: var(--rd-spacing-xxx-big);
}

.kaufen2022 .contractPackages .button.regular {
	margin: 0 var(--rd-spacing-xxx-big) 0;
}

.kaufen2022 .contractPackageFeatures {
	padding: 0 var(--rd-spacing-xxx-big) 0;
}

.kaufen2022 .contractPackageFeature::before {
	left: 31px;
	margin-top: var(--rd-spacing-xx-sm);
}

.kaufen2022 [data-packagename="pro"]::after {
	background-image: url(/src/img/2021/svg/Sleeve_New_3D.svg);
	right: -26px;
	top: -26px;
}

.kaufen2022 [data-packagename="basic"] .button {
	/* background-color: var(--rd-font-light ); */
	border: var(--rd-borderwidth-border-default) solid var(--rd-primary-active);
	color: var(--rd-font-light);
}

.kaufen2022 .button:hover {
	background: var(--cl-asphalt-blue) !important;
	border: var(--rd-borderwidth-border-default) solid var(--cl-asphalt-blue) !important;
}

.kaufen2022 img {
	width: 100%;
}

/* ===========================================================================
   Checkout steps hosted inside the logged-in app frame (/kaufen, steps 2 and 3).

   The app already paints the grey content background, so each step sits on a white
   card built exactly like the package-selection card above it (.pcBuyUserCountWrap):
   same white, same 1px light-grey border, same radius, same 1112px max width. Headings
   and the back link stay outside the card on the grey background.

   Scoped to the .rd-app-checkout body class so the public hosts
   (/pricing-intermediate and /bestellung) keep their centered layout unchanged.
   =========================================================================== */
.rd-app-checkout .container {
	margin-left: 0;
	max-width: 100%;
}

/* The app frame paints the grey content background. style20200508.css gives every <section>
   a white background, so the step's own section has to opt out of it or it covers the grey. */
.rd-app-checkout .rd-order-page,
.rd-app-checkout .pricing {
	background-color: transparent;
}

.rd-app-checkout .rd-contract-intermediate-form-wrapper,
.rd-app-checkout .rd-order-page .bestelen_flex {
	background-color: var(--rd-font-light);
	border-radius: var(--rd-borderradius-border-md);
	border: var(--rd-borderwidth-border-default) solid var(--cl-light-grey);
	padding: var(--rd-spacing-x-big);
	width: 100%;
	max-width: 1112px;
	margin: 0 0 var(--rd-spacing-xxx-lg) 0;
	box-sizing: border-box;
}

/* The form is only a wrapper here — the card is .bestelen_flex, so the back link above it
   sits on the grey background like its counterpart on the intermediate step. */
.rd-app-checkout .rd-order-page .rd-order-form {
	padding: 0;
	margin-bottom: 0;
	max-width: 1112px;
}

/* Left-align the back link with the heading and the card. Its base rule centers it in a
   960px box, which in the wider app frame leaves it floating 90px in from the heading. */
.rd-app-checkout .rd-checkout-backlink {
	max-width: 1112px;
	margin-left: 0;
}

/* The demo conversion runs inside the app frame, which paints its content area grey — the
   animation with the transparent background shows as a white box on it, so use the variant
   that carries the app's background. */
.rd-app-checkout .gif_bot {
	background-image: url("/src/img/2024/gifs/campusAnimation_blue_bg.gif");
}

/* Left-align the package grid in the wider card instead of centering it in the 960px one */
.rd-app-checkout .rd-contract-intermediate-form {
	justify-content: start;
}

/* The intro paragraph is centered and 600px wide on the public page, which reads as
   misaligned next to a left-aligned heading */
.rd-app-checkout .rd-order-page p {
	width: auto;
	max-width: 600px;
	text-align: left;
	margin-bottom: var(--rd-spacing-x-big);
}

.rd-contract-intermediate-page h1,
.rd-order-page h1 {
	margin-top: var(--rd-spacing-x-big) !important;
}

/* ===========================================================================
   Order page — /bestellung and the /kaufen order step, hosting
   <pc-contracts-app-order>. Layout per Figma Pricing-Update-AI node 5153:17091:
   a single column of .rd-input-content fields (Form.css) with inline placeholder
   labels, pink group headings, and two two-field rows for Straße/Nr. and PLZ/Ort.

   Everything this component needs lives in this block. It used to be spread over
   the whitelabel style.css (as ".bestellung"), MobileStyle20200429.css (the
   snake_case legacy rules) and landingpages.css (the mobile overrides).
   =========================================================================== */
.rd-order-page h1 {
	margin-bottom: 0;
}

/* .gifed-titel is inline-flex, so unlike the intermediate step's block heading its top margin
   does not collapse with the back link's bottom margin — the two would add up to 40px instead
   of 24px. The heading's own top margin sets the gap for both steps. */
.rd-order-page .rd-checkout-backlink {
	margin-bottom: 0;
}

.rd-order-page p {
	width: 600px;
	color: var(--cl-dark-text);
	display: inline-block;
	font-size: var(--rd-fontsize-5);
	letter-spacing: 0;
	line-height: 29px;
	text-align: center;
	margin-bottom: 79px;
}

/* Headline with the animated campus logo next to it. The empty <div> the component
   renders between the h1 and the paragraph is what .gifed-titel+div+p selects. */
.gifed-titel {
	display: inline-flex;
	align-items: end;
	margin-bottom: var(--rd-spacing-x-lg) !important;
}

.gifed-titel+div+p {
	font-size: 16px;
	font-weight: 400;
	line-height: 29px;
	color: #374551;
	margin-bottom: 48px;
}

.gif_bot {
	display: inline-block;
	width: 54px;
	height: 81px;
	background-size: 100px;
	background-repeat: no-repeat;
	background-image: url("/src/img/2024/gifs/campusAnimation.gif");
	background-position: 50%;
	/* The animation is half again as tall as the heading's line box (81px vs 1.32em = 52.8px at
	   40px). Left to stretch the heading, it pushes the bottom-aligned text down and opens a gap
	   under the back link above it. Pulling it up by the difference keeps it where it is relative
	   to the text while the heading keeps the height of its text — same as the headings that carry
	   no animation. 1.32em tracks --rd-lineheights-0, so this holds at every heading size. */
	margin-top: calc(1.32em - 81px);
}

.rd-order-page .rd-order-form {
	width: 100%;
	text-align: left;
	padding: 40px 55px;
	margin-bottom: 120px;
}

/* The back link of both checkout steps ("Paketauswahl ändern" on the intermediate step,
   "Paketoptionen anpassen" on the order step), above the step heading.
   Deliberately not the .rd-breadcrumb markup: its mobile rule shows only the second-to-last
   item, which would leave a single back link invisible below 640px. Spacing follows
   .rd-breadcrumb (Breadcrumb.css) so it sits where a breadcrumb would. */
.rd-checkout-backlink {
	text-align: left;
	max-width: 960px;
	margin: var(--rd-spacing-lg) auto var(--rd-spacing-md);
}

/* Two columns: the form on the left, the order summary on the right.
   1fr 1fr rather than 50% 50%: with the 64px gap on top, two 50% tracks overflow the
   container — visible as the summary sticking out past the card border on /kaufen. */
.bestelen_flex {
	gap: 64px;
	display: inline-grid;
	width: 100%;
	grid-template-areas: "LEFT RIGHT";
	grid-template-columns: 1fr 1fr;
}

.ihre_daten {
	background-color: #f2f6fa;
	padding: 40px;
	border-radius: 8px;
	background-image: var(--magenta-dashed-border);
}

.bestelen_flex .label {
	color: var(--rd-primary-active);
	font-size: var(--rd-fontsize-8);
	font-weight: var(--rd-fontweights-open-sans-1);
	line-height: var(--rd-lineheights-0);
	background-color: transparent;
	padding: 0;
	text-shadow: unset !important;
}

.bestelen_flex .rd-order-fields {
	display: flex;
	flex-direction: column;
	gap: var(--rd-spacing-md, 16px);
}

.bestelen_flex .rd-order-fields .rd-order-form-title {
	color: var(--rd-primary-active, #d66181);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.32;
	margin: 0;
}

/* 40px between the field groups: 16px column gap + 24px margin */
.bestelen_flex .rd-order-fields .rd-order-form-title:not(:first-child) {
	margin-top: 24px;
}

.rd-order-field-row {
	display: flex;
	gap: var(--rd-spacing-md, 16px);
}

/* Figma widths: Straße wide / Nr. narrow, Postleitzahl narrow / Ort wide */
.rd-order-row-street .rd-input-content:first-child {
	flex: 2.5 1 0;
}

.rd-order-row-street .rd-input-content:last-child {
	flex: 1 1 0;
}

.rd-order-row-city .rd-input-content:first-child {
	flex: 1 1 0;
}

.rd-order-row-city .rd-input-content:last-child {
	flex: 2.5 1 0;
}

/* Identity fields a logged-in session already knows: readonly instead of disabled so the
   values still POST, styled like disabled inputs. No hover/focus feedback — not editable. */
.bestelen_flex .rd-order-fields .rd-input-content>input[readonly] {
	background-color: var(--rd-input-disabled);
	color: #a6b0bd;
	cursor: default;
}

.bestelen_flex .rd-order-fields .rd-input-content>input[readonly]:hover,
.bestelen_flex .rd-order-fields .rd-input-content>input[readonly]:focus {
	border: var(--rd-borderwidth-border-default) solid var(--rd-input-default);
	outline: none;
}

/* --- Order summary column (.ihr_paket): one .pf_block card per position --- */
.pf_block {
	padding: 16px 24px;
	border-radius: 4px;
	border: var(--rd-borderwidth-border-default) solid #ccc;
	background: var(--rd-font-light);
	box-shadow: 0px 1px 2px 0px rgba(15, 15, 16, 0.05);
	margin-bottom: 16px;
}

.packet_label {
	overflow: hidden;
	color: var(--rd-font-dark);
	font-feature-settings: "liga" off;
	text-overflow: ellipsis;
	font-size: 18px;
	font-weight: 700;
	line-height: 132%;
	letter-spacing: 0.18px;
}

.packet_preis {
	color: var(--rd-primary-active);
	font-size: 14px;
	font-weight: 400;
	line-height: 170%;
}

.packet_preis span {
	color: var(--rd-font-dark);
}

.packet_info {
	overflow: hidden;
	color: #64646a;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 14px;
	font-weight: 400;
	line-height: 170%;
	margin-top: 12px;
}

/* --- Total price block --- */
.gesamt_preis_block {
	display: flex;
	justify-content: space-between;
	margin-bottom: 32px;
}

.gesamt_preis_block .label {
	color: var(--rd-font-dark);
	text-align: center;
	font-size: 18px;
	font-weight: 700;
	line-height: 132%;
	letter-spacing: 0.18px;
}

.gesamt_preis_block .preis {
	display: grid;
	grid-template-areas:
		"PREIS TEXT"
		"INFO INFO";
	text-align: right;
	font-size: 18px;
	font-weight: 700;
	line-height: 132%;
	letter-spacing: 0.18px;
	gap: 4px;
}

.gesamt_preis_block .preis .summe {
	grid-area: PREIS;
	color: var(--rd-primary-active);
}

.gesamt_preis_block .preis .text {
	grid-area: TEXT;
	color: var(--rd-font-dark);
}

.gesamt_preis_block .preis .info {
	grid-area: INFO;
	color: #64646a;
	text-align: right;
	font-size: 14px;
	font-weight: 400;
	line-height: 170%;
}

.info_preis3 {
	color: var(--rd-font-dark, #0d1130);
	font-size: 14px;
	font-weight: 400;
	line-height: normal;
	margin-bottom: 16px;
	text-align: left;
}

/* --- Order page responsive. These must stay after the base rules above: same
       specificity, so the later declaration is the one that wins. --- */
@media screen and (max-width: 1200px) {

	/* Stack the form and the summary instead of showing them side by side */
	.bestelen_flex {
		grid-template-areas:
			"LEFT"
			"RIGHT";
		grid-template-columns: 1fr;
	}
}

@media screen and (max-width: 991px) {
	.rd-order-page .rd-order-form {
		padding: 13px;
	}

	.rd-order-page .rd-order-form button {
		width: 100%;
	}
}

@media screen and (max-width: 575px) {
	.rd-order-page p {
		width: 100%;
		margin-bottom: 24px;
	}

	.ihre_daten {
		padding: 20px;
	}

	.gesamt_preis_block .preis {
		display: block;
	}
}

@media screen and (max-width: 500px) {

	/* !important on line-height beats .rd-sub-homepage .container h1 in
	   homepage-subpages.css, which also declares it !important */
	.rd-order-page h1 {
		margin-bottom: var(--rd-spacing-x-sm);
		line-height: 45px !important;
	}
}



.kaufen2022 .user_return {
	font-weight: var(--rd-fontweights-open-sans-0);
}

.kaufen2022 .contractPackage[data-packagename="pro"][data-isactive="false"] {
	background-color: #26456d;
}

.kaufen2022 .contractPackage[data-packagename="pro"] {
	background-color: #26456d;
}

.kaufen2022 .contractPackage[data-packagename="pro"]>div,
.kaufen2022 .contractPackage[data-packagename="pro"] .contractPackageFeatures>div {
	color: white;
}

#test_tage {
	color: var(--rd-primary-active);
}

#agb_accept_border input,
#agb_accept_border label {
	display: inline;
	width: auto;
}

#agb_accept_border label a {
	color: var(--rd-primary-active);
}

#agb_accept_border {
	margin-bottom: var(--rd-spacing-xxx-big);
}

.user_return {
	font-size: var(--rd-fontsize-11);
	font-weight: var(--rd-fontweights-open-sans-1);
	letter-spacing: 0;
	line-height: 31px;
	text-align: center;
	color: var(--rd-font-dark);
	margin-bottom: var(--rd-spacing-md);
	margin-top: var(--rd-spacing-sm);
}

.user_return #user_count {
	padding: 0;
	border: 0;
	background-image: none;
	color: var(--rd-primary-active);
}

.preis_return {
	margin-bottom: var(--rd-spacing-x-big);
}

.preis_return>span:nth-child(1) {
	font-size: var(--rd-fontsize-8);
	font-weight: var(--rd-fontweights-open-sans-1);
	letter-spacing: 0;
	line-height: 36px;
	text-align: center;
	color: var(--rd-font-dark);
}

.preis_return #gesamt_summe {
	color: var(--rd-primary-active);
}

.preis_return>span:nth-child(2) {
	font-size: var(--rd-fontsize-7);
	font-weight: var(--rd-fontweights-open-sans-1);
	letter-spacing: 0;
	line-height: 27px;
	color: var(--cl-dark-text);
}

/* @media screen and (max-width: 1200px) {
  .kaufen2022 .mainframe > section .center {
    padding-right: 30px !important;
  }
} */

@media screen and (max-width: 900px) {
	.kaufen2022 .contractPackages .button.regular {
		margin: auto;
	}

	.kaufen2022 .contractPackageFeature {
		line-height: 28px;
	}
}

@media screen and (max-width: 750px) {
	.features-box-mobile {
		display: block;
	}

	.features-box .afc-title,
	.features-box .afc-sub-title {
		display: none;
	}

	.features-box-desktop {
		display: none;
	}
}

@media screen and (max-width: 500px) {
	.kaufen2022 .slider-outdiv {
		width: 90%;
	}

	.kaufen2022 .contractPackageFeature {
		padding-left: 0;
	}

	.kaufen2022 .contractPackages .button.regular {
		margin: 0 var(--rd-spacing-xxx-big) 0;
	}

	.kaufen2022 .mainframe>section .center {
		padding: 0 var(--rd-spacing-sm) !important;
	}
}

.rd-slider-info-arrow {
	position: absolute;
	top: -111px;
	right: -80px;
}

.rd-slider-info-arrow .rd_text_info_caveat_box {
	display: inline-block;
	width: auto;
	white-space: nowrap;
	z-index: 1;
	position: relative;
}

.rd-slider-info-arrow .rd_text_info_caveat_pfeil {
	top: 60px;
	left: 24px;
	position: absolute;
	z-index: 0;
}

.contractPackageProLabel.Pink {
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	background-color: var(--rd-secondary-active);
	color: var(--rd-list-default-light);
	padding: var(--rd-spacing-sm);
	z-index: 0;
	height: 47px;
	display: none;
}

/* .rd-slider-row.rd-slider-row-survey-switch label {
	color: rgba(13, 17, 48, 0.3);
} */

.rd-slider-row-survey-switch .rd-label-content {
	margin-top: 2px !important;
}

.rd-slider-row-survey-switch .rd-checkbox.disabeld {
	opacity: 0.5;
}

.costCutting h1 {
	margin-top: var(--rd-spacing-xx-big) !important;
	margin-bottom: var(--rd-spacing-md) !important;
	font-size: var(--rd-fontsize-11) !important;
	line-height: var(--rd-lineheights-0) !important;
}

.costCutting div {
	font-size: var(--rd-fontsize-7);
	font-weight: var(--rd-fontweights-open-sans-2);
	line-height: var(--rd-lineheights-0);
	letter-spacing: 0.22px;
	color: var(--rd-font-dark);
}

.costCutting .semibold {
	font-weight: var(--rd-fontweights-open-sans-1);
	margin-bottom: 0;
}

.costCutting p {
	font-size: var(--rd-fontsize-6);
	line-height: 29px;
	color: var(--rd-font-dark);
	margin-bottom: var(--rd-spacing-xxx-big);
	margin-top: var(--rd-spacing-huge);
	font-weight: var(--rd-fontweights-open-sans-2);
}

.costCutting img {
	width: 100%;
}

.costCutting span {
	color: var(--rd-primary-active);
}

.costCutting {
	margin-bottom: var(--rd-spacing-xx-huge);
}

.costCutting .grid {
	display: grid;
	gap: 80px;
	grid-template-columns: 60% 40%;
	width: calc(100% - 80px);
	text-align: left;
	margin-bottom: 0;
	margin-top: var(--rd-spacing-xx-lg);
}

.costCutting a {
	margin-top: 40px !important;

	&.rd-icon-document-download {
		font-size: 18px;
		font-style: normal;
		font-weight: 400;
		line-height: 132%;
		/* 23.76px */
		color: #4073B6;
		display: flex;
		justify-self: center;
		justify-content: center;
	}
}

.costCutting a:after {
	background-color: #4073B6;
}

.rd-slider-row.rd-slider-row-bonus-switch,
.rd-slider-row.rd-slider-row-survey-switch,
.rd-slider-row.rd-slider-row-addon-switch {
	border: 1px solid var(--rd-gray-300);
	background: var(--rd-font-light);
	box-shadow: 0 1px 2px 0 rgba(15, 15, 16, 0.05);
	padding: var(--rd-spacing-x-big);
	align-items: center;
	justify-content: space-between;
	margin-bottom: 0 !important;
	position: relative;
	gap: 24px !important;
	border-radius: 20px;
}

.rd-bonus-switch-wrap+.rd-infobar {
	margin-top: var(--rd-spacing-md);
}

.rd-switch-info:after {
	color: var(--rd-font-light);
	mask-image: none !important;
	-webkit-mask-image: none !important;
	content: "NEU";
	background-color: var(--rd-primary-active);
	border-radius: 96px;
	padding: 2px 8px;
	width: auto;
	display: inline-block;
	font-weight: 500;
	line-height: 16px;
	height: auto;
	font-size: var(--rd-fontsize-3);
	margin-top: 0;
	margin-left: 8px;
}

.rd-bonus-switch-wrap pc-tooltip.info {
	margin-left: var(--rd-spacing-xx-sm);
}

.rd-bonus-switch-wrap .rd-label-content label {
	font-size: var(--rd-fontsize-6);
	font-weight: var(--rd-fontweights-open-sans-0);
	line-height: var(--rd-lineheights-0);
	letter-spacing: 0.18px;
	text-align: left;
}

.rd-bonus-switch-wrap .rd-label-content label ul {
	margin: var(--rd-spacing-md) 0 0 0;
	color: var(--rd-font-dark);

	li {
		list-style: none;
		padding-left: 28px;
		position: relative;
		margin-bottom: var(--rd-spacing-xx-sm);
	}

	li::before {
		content: "";
		display: inline-block;
		mask-image: url(/src/img/2024/svg/icons/rd-icon-check-circle-fill.svg);
		-webkit-mask-image: url(/src/img/2024/svg/icons/rd-icon-check-circle-fill.svg);
		background-color: var(--rd-success-default);
		mask-size: contain;
		-webkit-mask-size: contain;
		mask-repeat: no-repeat;
		-webkit-mask-repeat: no-repeat;
		width: 20px;
		height: 20px;
		position: absolute;
		left: 0;
		top: 1px;
	}
}


.rd-bonus-switch-wrap .rd-label-content {
	align-items: start;
}

.contractPackageFeature.rd-icon-zauberstab::before {
	background-image: none;
	background-color: #8F9DAE;
}

/* .contractPackage[data-packagename="basic"] .contractPackageFeature:nth-child(8)::before {
	mask-image: url(/src/img/2024/svg/icons/rd-icon-zauberstab.svg);
	-webkit-mask-image: url(/src/img/2024/svg/icons/rd-icon-zauberstab.svg);
	background-color: var(--cl-deep-green);
	background-image: none;
} */


pc-contracts-app[ispluspackagereleased] .rd-bonus-switch-wrap {
	display: block;
}


pc-contracts-app[ispluspackagereleased] .rd-slider-row.rd-slider-row-bonus-switch,
pc-contracts-app[ispluspackagereleased] .rd-slider-row.rd-slider-row-addon-switch {
	width: 100%;
	margin: auto;
	margin-bottom: 24px;
	margin-top: 24px;
}

[data-package-active="livePlus"] [data-packagename="livePlus"] .rd-surveyIncludedInProBadge,
[data-package-active="livePlus"] [data-packagename="livePlus"] .rd-badgetip-arrow,
[data-package-active="basic"] [data-packagename="pro"] .rd-surveyIncludedInProBadge,
[data-package-active="basic"] [data-packagename="pro"] .rd-badgetip-arrow {
	display: none !important;
}

[data-package-active="none"] [data-packagename="pro"] .rd-surveyIncludedInProBadge,
[data-package-active="none"] [data-packagename="pro"] .rd-badgetip-arrow,
[data-package-active="pro"] [data-packagename="livePlus"] .rd-surveyIncludedInProBadge,
[data-package-active="pro"] [data-packagename="livePlus"] .rd-badgetip-arrow {
	display: none;
}

/* [data-package-active="basic"] .contractPackage[data-packagename="basic"]:before,
[data-package-active="pro"] .contractPackage[data-packagename="pro"]:before,
[data-package-active="livePlus"] .contractPackage[data-packagename="livePlus"]:before{
	content: "Gebuchtes Paket";
	font-size: 16px;
	font-weight: 700;
	line-height: 147%;
	display: inline-block  !important;
	position: absolute;
	top: 0;
	background-color: var(--rd-secondary-active);
} */

[data-packagename="livePlus"] .rd-surveyIncludedInProBadge {
	width: 100%;
	max-width: 247px;
	left: 58px;
	top: -40px;
}

[data-packagename="livePlus"] .rd-badgetip-arrow {

	top: -14px;

	right: 137px;
}

[data-packagename="pro"] .rd-surveyIncludedInProBadge {
	width: 100%;
	max-width: 247px;
	left: 58px;
	top: -40px;
}

[data-packagename="pro"] .rd-badgetip-arrow {

	top: -14px;

	right: 137px;
}

pc-contracts-app:has([data-package-active="livePlus"]) .rd-bonus-switch-wrap,
pc-contracts-app:has([data-package-active="pro"]) .rd-bonus-switch-wrap,
pc-contracts-app:has([data-package-active="basic"]) .rd-bonus-switch-wrap {
	display: block !important;
}

pc-contracts-app:has([data-package-active="none"]) .rd-bonus-switch-wrap {
	display: none !important;
}





/* pc-contracts-app:has([data-package-active="livePlus"]) .contractPackage[data-packagename="pro"] .contractPackageTitle::before {
  content: "Unsere Empfehlung";
  position: absolute;
    top: -82px;
    right: 95px;
  background: white;
  color: #d85d87;
  font-size: 28px;
  font-weight: bold;
  padding: 10px 25px;
  border: 1px solid #d85d87;
  border-radius: 20px / 40%;
  transform: rotate(-10deg);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
      z-index: 10;
	  font-family: var(--font-family-Font-2, Caveat);
}

pc-contracts-app:has([data-package-active="livePlus"]) .contractPackage[data-packagename="pro"] .contractPackageTitle::after {
	 content: "";
  position: absolute;
height: 70px;
    background-image: url(/src/img/2023/svg/svg_img/badgeTipArrow.svg);
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: contain;
    position: absolute;
    width: 40px;
    top: -50px;
    transform: rotate(-39deg);
    right: 115px;
}

pc-contracts-app:has([data-package-active="livePlus"]) .contractPackage[data-packagename="pro"] .contractPackageTitle{
	position: relative;
} */


pc-contracts-app-intermediate[ispluspackagereleased] .rd-contract-inter-moduleblock,
pc-contracts-app-intermediate[ispluspackagereleased] .rd-slider-row.rd-slider-row-bonus-switch,
pc-contracts-app-intermediate[ispluspackagereleased] .rd-slider-row.rd-slider-row-addon-switch {
	height: 100%;
}

pc-contracts-app-intermediate[ispluspackagereleased] .rd-contract-inter-moduleblock .rd-slider-row {
	display: block !important;
}

pc-contracts-app-intermediate[ispluspackagereleased] .rd-contract-inter-moduleblocks {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.rd-contract-inter-moduleblock .rd-slider-inner {
	display: flex !important;
	align-items: center;
	gap: 24px;
	margin-bottom: var(--rd-spacing-x-sm);
}

pc-contracts-app-intermediate[ispluspackagereleased] .rd-contract-inter-moduleblock .rd-slider-inner {
	justify-content: space-between;
}

pc-contracts-app-intermediate[ispluspackagereleased] .contractPackageFeature {
	margin-bottom: var(--rd-spacing-x-sm) !important;
}

pc-contracts-app-intermediate[ispluspackagereleased] .rd-contract-inter-moduleblock .rd-label-content label {
	font-size: var(--rd-fontsize-6);
	font-weight: var(--rd-fontweights-open-sans-0);
	line-height: var(--rd-lineheights-0);
	letter-spacing: 0.18px;
	text-align: left;
}





@media screen and (max-width: 750px) {
	.costCutting .grid {
		grid-template-columns: 100%;
		width: 100%;
		gap: 40px;
	}

	.rd-bonus-switch-wrap .rd-label-content label {
		font-size: var(--rd-fontsize-4);
		font-weight: var(--rd-fontweights-open-sans-1);
	}

	.rd-slider-row.rd-slider-row-bonus-switch,
	.rd-slider-row.rd-slider-row-survey-switch {
		padding: 16px !important;
	}

	.costCutting a {
		margin: auto !important;
		margin-top: 40px !important;
	}

	.contractPackage {
		max-width: 90%;
	}

	.costCutting h1 {
		font-size: var(--rd-fontsize-9);
	}

	.costCutting {
		margin-bottom: 64px !important;
	}
}

@media screen and (max-width: 500px) {

	.rd-slider-row.rd-slider-row-bonus-switch,
	.rd-slider-row.rd-slider-row-survey-switch {
		justify-content: space-between !important;
	}
}

.rd-slider-row-addon-switch .rd-label-content.rd-info-label {
	flex: 1;
	padding-left: 64px;
	position: relative;
}

.rd-contract-inter-surveyblock .rd-slider-row-addon-switch .rd-label-content.rd-info-label::before,
.rd-contract-inter-surveyblock .rd-slider-row-addon-switch .rd-label-content.rd-info-label::after {
	display: none;
}

.rd-contract-inter-surveyblock .rd-slider-row-addon-switch .rd-label-content.rd-info-label {
	padding-left: 0;
}

.rd-slider-row-addon-switch .rd-label-content.rd-info-label::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 48px;
	height: 48px;
	border-radius: 12px;
	background-color: #fbe8ee;
}

.rd-slider-row-addon-switch .rd-label-content.rd-info-label::after {
	content: "";
	position: absolute;
	left: 7px;
	top: 50%;
	transform: translateY(-50%);
	width: 35px;
	height: 35px;
	mask-image: url("/src/img/2024/svg/icons/rd-icon-shield.svg");
	-webkit-mask-image: url("/src/img/2024/svg/icons/rd-icon-shield.svg");
	mask-size: contain;
	-webkit-mask-size: contain;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	mask-position: center;
	-webkit-mask-position: center;
	background-color: var(--rd-primary-active);
}

/* Addon blocks on intermediate page */
pc-contracts-app-intermediate[ispluspackagereleased] .rd-slider-row-addon-switch {
	display: block !important;
	height: 100%;
}

.rd-slider-row-addon-switch .rd-slider-inner,
.rd-slider-row-bonus-switch .rd-slider-inner {
	display: flex !important;
	align-items: center;
	gap: 24px;
	margin-bottom: 20px;
}

.customer_package_wrap .rd-slider-row-addon-switch .rd-switch-subinfo {
	font-size: var(--rd-fontsize-5);
	line-height: var(--rd-lineheights-0);
	/* 21.12px */
	letter-spacing: 0.16px;
	color: var(--rd-font-dark);
}

.rd-addon-badge {
	display: inline-block;
	background-color: var(--rd-primary-active);
	color: var(--rd-font-light);
	font-size: var(--rd-fontsize-2);
	font-weight: 600;
	line-height: 1;
	border-radius: 96px;
	margin-left: 8px;
	vertical-align: middle;
	height: 25px;
	padding: 7px 9px;
	width: 42px;
}

.rd-addon-title {
	vertical-align: middle;
}

.rd-slider-row-addon-switch label {
	white-space: nowrap;
}

.rd-contract-inter-buttons {
	display: flex;
	justify-content: flex-end;
	gap: 16px;
	margin-top: var(--rd-spacing-x-lg);

	flex-wrap: wrap-reverse;
}

/* ========== Addon Purchase Popup ========== */

.rd-addon-purchase-popup {
	max-width: 960px;
}

.rd-addon-purchase-popup-header {
	margin-bottom: var(--rd-spacing-lg);
}

.rd-addon-purchase-popup-header h1 {
	font-size: var(--rd-fontsize-8);
	font-weight: var(--rd-fontweights-open-sans-1);
	line-height: 29px;
	color: var(--rd-font-dark);
	text-align: left;
	margin-bottom: var(--rd-spacing-xx-sm);
}

.rd-addon-purchase-popup-header p {
	font-size: var(--rd-fontsize-4);
	line-height: 29px;
	color: var(--rd-font-dark);
	margin: 0;
	text-align: left;
}

/* Two-column layout: cards left, summary right */
.rd-addon-purchase-popup-body {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
	align-items: start;
}

/* Cards column */
.rd-addon-purchase-popup-cards {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.rd-addon-purchase-card {
	background: var(--rd-font-light);
	border-radius: 12px;
	padding: var(--rd-spacing-x-big);
	border: 1px solid var(--rd-input-default);
	box-shadow: 0 1px 2px 0 rgba(15, 15, 16, 0.05);
}

.rd-addon-purchase-card--disabled {
	opacity: 0.6;
}

.rd-addon-purchase-card-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.rd-addon-purchase-card-info {
	flex: 1;
}

.rd-addon-purchase-card-title {
	font-size: var(--rd-fontsize-5);
	font-weight: var(--rd-fontweights-open-sans-0);
	color: var(--rd-font-dark);
	margin-bottom: var(--rd-spacing-x-sm);
	line-height: 120%;
	letter-spacing: 0.16px;
	text-align: left;
}

.rd-addon-purchase-card-price {
	font-size: var(--rd-fontsize-4);
	color: var(--rd-primary-active);
	font-weight: var(--rd-fontweights-open-sans-2);
	line-height: 18.48px;
	letter-spacing: 0.14px;
	text-align: left;
}

.rd-addon-purchase-card-head .rd-input-content {
	width: 56px
}

.rd-addon-purchase-card-features {
	display: flex;
	flex-direction: column;
	margin-top: var(--rd-spacing-x-sm);
}

.rd-addon-purchase-card-features .contractPackageFeature {
	margin-bottom: var(--rd-spacing-x-sm);
	color: var(--rd-font-dark);
}

.rd-addon-purchase-card-features .contractPackageFeature::before {
	width: 20px;
	height: 20px;
}

.rd-addon-purchase-booked-label {
	margin-top: 8px;
	font-size: var(--rd-fontsize-3);
	color: var(--rd-secondary-active);
	font-weight: 600;
}

/* Summary column */
.rd-addon-purchase-popup-summary {
	position: sticky;
	top: 0;
}

.rd-addon-purchase-summary-block {
	background: var(--rd-base-fg-bg);
	border-radius: 12px;
	padding: var(--rd-spacing-x-big);
}

.rd-addon-purchase-summary-section {
	margin-bottom: var(--rd-spacing-x-big);
	text-align: left;
}

.rd-addon-purchase-summary-label {
	font-size: var(--rd-fontsize-3);
	font-weight: var(--rd-fontweights-open-sans-0);
	line-height: 170%;
	text-transform: uppercase;
	color: var(--rd-gray);
	margin-bottom: var(--rd-spacing-xx-sm);
}

.rd-addon-purchase-summary-row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;

	gap: 24px;
}

.rd-addon-purchase-summary-row span {
	font-size: var(--rd-fontsize-4);
	color: var(--rd-font-dark);
	line-height: 19px
}

.rd-addon-purchase-summary-row-sub {
	font-size: var(--rd-fontsize-4);
	color: var(--rd-font-light-grey, #888);
	padding: 2px 0;

}

.rd-addon-purchase-summary-row>span:last-child {
	white-space: nowrap;
	font-size: var(--rd-fontsize-4);
	font-weight: var(--rd-fontweights-open-sans-1);
	line-height: 20px;
	letter-spacing: -0.15px;
}

.rd-addon-purchase-summary-section:nth-child(2) .rd-addon-purchase-summary-row>span:last-child {
	font-weight: var(--rd-fontweights-open-sans-0);
}

.rd-addon-purchase-summary-addon-price {
	white-space: nowrap;
	text-align: right;
	flex-shrink: 0;
	color: var(--rd-primary-active);
	font-weight: 700;
}

.rd-addon-purchase-summary-total {
	border-top: 1px solid var(--rd-gray);
	padding-top: var(--rd-spacing-sm);
	margin-top: var(--rd-spacing-x-big);
}

.rd-addon-purchase-summary-total-value {
	text-align: right;
}

.rd-addon-purchase-summary-total-price {
	font-size: var(--rd-fontsize-8) !important;
	font-weight: var(--rd-fontweights-open-sans-0);
	color: var(--rd-primary-active) !important;
	display: block;
	line-height: 120%;
	/* 26.4px */
	letter-spacing: 0.22px;
}

.rd-addon-purchase-summary-total-vat {
	font-size: var(--rd-fontsize-3);
	color: var(--rd-font-light-grey, #888);
}

.rd-addon-purchase-summary-terms {
	margin-top: var(--rd-spacing-x-sm);
	font-size: var(--rd-fontsize-3);
	font-weight: 400;
	line-height: 132%;
	/* 15.84px */
	letter-spacing: 0.12px;
	color: var(--rd-gray);
}

/* Buttons */
.rd-addon-purchase-popup-buttons {
	display: flex;
	justify-content: center;
	gap: 16px;
	margin-top: var(--rd-spacing-lg);
}

.rd-addon-purchase-popup-buttons button:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

/* Loading/Error states */
.rd-addon-purchase-popup-loading,
.rd-addon-purchase-popup-error {
	padding: 40px;
	text-align: center;
	font-size: var(--rd-fontsize-5);
	color: var(--rd-font-dark);
}

@media screen and (max-width: 700px) {
	.rd-addon-purchase-popup-body {
		grid-template-columns: 1fr;
	}

	.rd-addon-purchase-popup {
		padding: 20px;
	}
}

/* ===== Skeletons of the contract steps =====
   Shapes and shimmer come from the .rd-skeleton primitives in shared.css; everything here is
   layout: where the bars sit and how much room each step reserves. The reserved heights are the
   rendered steps as measured — re-measure if their layout changes materially. */

/* --- Step 2, the intermediate step: package card next to its module blocks --- */
.rd-contract-inter-skeleton {
	display: grid;
	gap: var(--rd-spacing-md);
	align-content: start;
	min-height: 770px;
}

.rd-contract-inter-skeleton-head {
	display: grid;
	gap: var(--rd-spacing-md);
	justify-items: center;
	/* Width of the form below (360 + 580 + gap), so the back link lines up with the card */
	max-width: 956px;
	width: 100%;
	margin: 0 auto var(--rd-spacing-md);
}

.rd-contract-inter-skeleton-h1 {
	width: 55%;
}

.rd-contract-inter-skeleton-sub {
	width: 40%;
}

/* "Paketauswahl ändern", above the heading and left-aligned by .rd-checkout-backlink.
   That container centres itself with auto margins, which inside this grid would shrink it to
   the bar's width and centre it — so keep it full width and let its max-width do the centring. */
.rd-contract-inter-skeleton .rd-checkout-backlink {
	width: 100%;
}

.rd-contract-inter-skeleton-backlink {
	width: 160px;
}

.rd-contract-inter-skeleton-form {
	display: grid;
	grid-template-columns: 360px 580px;
	gap: var(--rd-spacing-md);
	justify-content: center;
}

/* Mirrors .rd-contract-inter-packageblock */
.rd-contract-inter-skeleton-card {
	display: grid;
	align-content: center;
	justify-items: center;
	gap: var(--rd-spacing-md);
	min-height: 470px;
	padding: var(--rd-spacing-xxx-big);
	border: var(--rd-borderwidth-border-default) solid var(--rd-gray-200);
	border-radius: var(--rd-borderradius-border-md);
	background-color: var(--rd-font-light);
}

.rd-contract-inter-skeleton-package {
	width: 60%;
}

.rd-contract-inter-skeleton-price {
	width: 75%;
}

.rd-contract-inter-skeleton-fee {
	width: 85%;
}

.rd-contract-inter-skeleton-priceinfo {
	width: 55%;
}

.rd-contract-inter-skeleton-licence {
	width: 70%;
}

.rd-contract-inter-skeleton-modules {
	display: grid;
	grid-template-rows: 1fr 1fr;
	gap: var(--rd-spacing-md);
}

/* Mirrors .rd-contract-inter-moduleblock: the add-on and bonus boxes with their switch */
.rd-contract-inter-skeleton-module {
	display: grid;
	align-content: start;
	gap: var(--rd-spacing-md);
	padding: var(--rd-spacing-xxx-big);
	border: var(--rd-borderwidth-border-default) solid var(--rd-gray-200);
	border-radius: var(--rd-borderradius-border-xl);
	background-color: var(--rd-font-light);
}

.rd-contract-inter-skeleton-module-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--rd-spacing-md);
}

.rd-contract-inter-skeleton-module-title {
	width: 45%;
}

.rd-contract-inter-skeleton-module-price {
	width: 30%;
}

.rd-contract-inter-skeleton-feature {
	width: 80%;
}

.rd-contract-inter-skeleton-feature:nth-of-type(even) {
	width: 65%;
}

/* "Abbrechen" and "Weiter zur Bestellübersicht" */
.rd-contract-inter-skeleton-buttons {
	display: flex;
	justify-content: flex-end;
	gap: var(--rd-spacing-md);
}

@media screen and (max-width: 1000px) {
	.rd-contract-inter-skeleton-form {
		grid-template-columns: 1fr;
	}

	.rd-contract-inter-skeleton-card {
		min-height: 240px;
	}

	.rd-contract-inter-skeleton-modules {
		min-height: 460px;
	}
}

/* Skeleton of the package cards, shown while <pc-contracts-app> loads its contract info. It
   borrows .contractPackage so it has the real card's box, and only lays out the bars inside. */
.rd-contract-skeleton-card {
	/* The box is reserved, not derived from the bars: every bar is sized in %, which contributes
	   nothing to intrinsic width, and .contractPackages shrink-wraps its content — without a
	   definite width the whole row collapses. 360 x 1270 is what a rendered package card measures,
	   so the cards wrap at the same points and the content below keeps its place when the real
	   ones arrive. Re-measure both if the card layout or the feature lists change materially. */
	flex: 0 0 auto;
	width: 360px;
	max-width: 100%;
	min-height: 1270px;
	padding-left: var(--rd-spacing-xxx-big);
	padding-right: var(--rd-spacing-xxx-big);
}

.rd-contract-skeleton-bar {
	height: 16px;
	margin: 0 auto var(--rd-spacing-md);
}

.rd-contract-skeleton-title {
	height: 28px;
	width: 55%;
}

.rd-contract-skeleton-subtitle {
	height: 40px;
	width: 80%;
}

.rd-contract-skeleton-price {
	height: 52px;
	width: 65%;
	margin-top: var(--rd-spacing-xxx-big);
}

.rd-contract-skeleton-priceinfo {
	height: 14px;
	width: 45%;
}

.rd-contract-skeleton-licenceinfo {
	height: 14px;
	width: 55%;
}

.rd-contract-skeleton-button {
	height: 44px;
	width: 60%;
	border-radius: 40px;
	margin-top: var(--rd-spacing-xxx-big);
	margin-bottom: var(--rd-spacing-xxx-big);
}

.rd-contract-skeleton-heading {
	height: 18px;
	width: 60%;
	margin-left: 0;
	margin-bottom: var(--rd-spacing-x-big);
}

.rd-contract-skeleton-feature {
	height: 14px;
	margin-left: 0;
}

.rd-contract-skeleton-feature:nth-child(even) {
	width: 75%;
	margin-right: auto;
}

/* Stands in for a feature that wraps onto two lines, as several of them do */
.rd-contract-skeleton-feature-tall {
	height: 38px;
}


/* Checkout steps 2 and 3 are rendered client side: between HTML parse and the moment the
   ContractsApp bundle upgrades these elements they are empty, and the step is a blank gap even
   though its data was posted along. :not(:defined) matches exactly that window and stops
   applying the instant the element upgrades. Heights are measured on the rendered steps —
   re-measure if their layout changes materially. */
pc-contracts-app-intermediate:not(:defined),
pc-contracts-app-order:not(:defined) {
	display: grid;
	gap: var(--rd-spacing-md);
	margin-top: var(--rd-spacing-x-big);
}

pc-contracts-app-intermediate:not(:defined) {
	/* Headline row, then the package card next to its module blocks */
	grid-template-columns: 360px 580px;
	grid-template-rows: 150px 1fr;
	justify-content: center;
	min-height: 770px;
}

pc-contracts-app-intermediate:not(:defined)::before {
	grid-column: 1 / -1;
	justify-self: center;
	width: 60%;
}

pc-contracts-app-intermediate:not(:defined)::after {
	grid-column: 1 / -1;
}

pc-contracts-app-order:not(:defined) {
	/* The two columns of .bestelen_flex: order form and order summary */
	grid-template-columns: 1fr 1fr;
	gap: 64px;
	min-height: 1100px;
}

/* The summary column is shorter than the form next to it */
pc-contracts-app-order:not(:defined)::after {
	align-self: start;
	height: 620px;
}

/* Pseudo-elements cannot carry the .rd-skeleton class, so the primitive's paint is repeated
   here — same token, same keyframes. Coarse panels rather than bars for the same reason: there
   is no markup to put bars into before the element upgrades. */
pc-contracts-app-intermediate:not(:defined)::before,
pc-contracts-app-intermediate:not(:defined)::after,
pc-contracts-app-order:not(:defined)::before,
pc-contracts-app-order:not(:defined)::after {
	content: "";
	display: block;
	border-radius: var(--rd-borderradius-border-xl);
	background-color: var(--rd-gray-100);
	background-image: var(--rd-skeleton-paint);
	background-size: 300% 100%;
	animation: rd-skeleton-shimmer 1.4s ease-in-out infinite;
}

@media (prefers-reduced-motion: reduce) {

	pc-contracts-app-intermediate:not(:defined)::before,
	pc-contracts-app-intermediate:not(:defined)::after,
	pc-contracts-app-order:not(:defined)::before,
	pc-contracts-app-order:not(:defined)::after {
		animation: none;
	}
}

@media screen and (max-width: 1000px) {

	pc-contracts-app-intermediate:not(:defined),
	pc-contracts-app-order:not(:defined) {
		grid-template-columns: 1fr;
	}

	pc-contracts-app-intermediate:not(:defined) {
		min-height: 860px;
	}

	pc-contracts-app-order:not(:defined) {
		min-height: 1700px;
	}
}