/* Miet-Piano look, aligned with piano-schulz.de (loaded by functions.php after the theme). */

:root {
	--mp-navy: #0D3472;
	--mp-navy-dark: #0A2858;
	--mp-gold: #BC9C53;
	--mp-ink: #1F262E;
	--mp-text: #3A4556;
	--mp-warm: #F4F4F3;
	--mp-serif: 'Libre Baskerville', Georgia, serif;
	--mp-sans: 'Raleway', 'Helvetica Neue', Arial, sans-serif;
}

/* Typography */
body, button, input, select, textarea, .elementor-widget-text-editor, .elementor-widget-icon-list .elementor-icon-list-text {
	font-family: var(--mp-sans);
}
body { color: var(--mp-text); }
/* Elementor headings get the serif from the kit's global fonts, so per-widget fonts (e.g. Raleway eyebrows) still win. */
h1, h2, h3, h4, h5, h6,
.woocommerce div.product .product_title,
#content-pro ul.products li.product h2,
#page-title-pro h1 {
	font-family: var(--mp-serif);
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
}
h1, h2, h3, h4, h5, h6, .woocommerce div.product .product_title, #content-pro ul.products li.product h2 { color: var(--mp-navy); }

/* Navigation */
nav#site-navigation .sf-menu > li > a,
ul.mobile-menu-pro li a {
	font-family: var(--mp-sans) !important;
	font-size: 12px !important;
	font-weight: 500 !important;
	letter-spacing: .14em !important;
	text-transform: uppercase !important;
	color: var(--mp-ink);
}
nav#site-navigation .sf-menu > li > a { padding-left: 13px !important; padding-right: 13px !important; }
@media (max-width: 1240px) {
	nav#site-navigation .sf-menu > li > a { padding-left: 10px !important; padding-right: 10px !important; letter-spacing: .1em !important; }
}
nav#site-navigation .sf-menu > li.current-menu-item > a,
nav#site-navigation .sf-menu > li > a:hover { color: var(--mp-gold) !important; }

/* Gold "Jetzt mieten" pill in the main menu (menu item with CSS class mp-nav-cta) */
nav#site-navigation .sf-menu > li.mp-nav-cta > a {
	background: var(--mp-gold); color: #fff !important; border-radius: 999px;
	padding: 11px 20px !important; margin: -21px 0 0 6px !important; line-height: 1 !important; /* theme pulls menu links up 54px; this centres the pill in the 100px row */
}
nav#site-navigation .sf-menu > li.mp-nav-cta > a:hover { background: var(--mp-navy); color: #fff !important; }
nav#site-navigation .sf-menu > li.mp-nav-cta > a::after { display: none !important; }

/* Buttons: rounded pills like piano-schulz.de */
.button, button.button, a.button, input[type="submit"], .wpcf7-submit,
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce #respond input#submit, .woocommerce a.checkout-button, .woocommerce #place_order,
.elementor-button {
	border-radius: 999px !important;
	font-family: var(--mp-sans) !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	letter-spacing: .12em !important;
	text-transform: uppercase !important;
}
.button, button.button, a.button, input[type="submit"], .wpcf7-submit,
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce a.checkout-button, .woocommerce #place_order {
	background: var(--mp-navy) !important; border-color: var(--mp-navy) !important; color: #fff !important;
}
.button:hover, a.button:hover, input[type="submit"]:hover, .wpcf7-submit:hover,
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce a.checkout-button:hover, .woocommerce #place_order:hover {
	background: var(--mp-gold) !important; border-color: var(--mp-gold) !important; color: #fff !important;
}

/* Links and prices */
#content-pro a:not(.button):not(.elementor-button):not(.mp-cat-tabs a) { color: var(--mp-navy); }
#content-pro a:not(.button):not(.elementor-button):hover { color: var(--mp-gold); }
.woocommerce .price, .woocommerce .price .amount, .woocommerce div.product p.price { color: var(--mp-navy) !important; font-family: var(--mp-sans); font-weight: 600; }
.mp-per-month { font-size: .75em; font-weight: 500; color: var(--mp-gold); }
#content-pro ul.products li.product ul.emso-shop-index-category li a,
.posted_in a { color: var(--mp-gold) !important; letter-spacing: .14em; }
#content-pro ul.products li.product { border-radius: 12px; overflow: hidden; }

/* Title bar on shop/category pages (none above single products) */
#page-title-pro { background-color: var(--mp-navy) !important; }
body.woocommerce #page-title-overlay-image { display: none; }
body.woocommerce #progression-studios-page-title-container { padding-top: 34px; padding-bottom: 30px; }
body.single-product #page-title-pro { display: none; }

/* Klavier / Flügel tabs above the product grid */
.mp-cat-tabs { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 28px; }
.mp-cat-tabs a {
	padding: 9px 22px; border: 1px solid rgba(13, 52, 114, .2); border-radius: 999px;
	color: var(--mp-navy) !important; font-weight: 600; font-size: 13px; text-decoration: none;
}
.mp-cat-tabs a.is-active, .mp-cat-tabs a:hover { background: var(--mp-navy); border-color: var(--mp-navy); color: #fff !important; }

/* "Inklusive" box above the rent button */
.mp-incl { margin: 0 0 18px; padding: 16px 20px; background: var(--mp-warm); border-left: 2px solid var(--mp-gold); border-radius: 4px; }
.mp-incl strong { display: block; margin-bottom: 6px; font-family: var(--mp-serif); font-weight: 400; color: var(--mp-navy); }
.mp-incl ul { margin: 0; padding: 0; list-style: none; }
.mp-incl li { padding: 3px 0 3px 26px; position: relative; color: var(--mp-ink); }
.mp-incl li::before { content: "✓"; position: absolute; left: 4px; color: var(--mp-gold); font-weight: 700; }
.mp-delivery { margin: 14px 0 0; font-size: .9em; color: #5b6575; }

/* !important: the theme styles this button through inline #boxed-layout-pro selectors */
body.single-product form.cart .single_add_to_cart_button.button {
	background: var(--mp-navy) !important; border-color: var(--mp-navy) !important; color: #fff !important;
	font-size: 13px !important; padding: 17px 38px !important;
}
body.single-product form.cart .single_add_to_cart_button.button:hover { background: var(--mp-gold) !important; border-color: var(--mp-gold) !important; }

/* One-tap call button on phones */
.mp-call { display: none; }
@media (max-width: 767px) {
	.mp-call {
		display: flex; align-items: center; justify-content: center; position: fixed; left: 16px; bottom: 16px; z-index: 9990;
		width: 52px; height: 52px; border-radius: 50%; background: var(--mp-navy); color: #fff;
		box-shadow: 0 4px 14px rgba(13, 52, 114, .3);
	}
	.mp-call svg { width: 22px; height: 22px; fill: currentColor; }

	/* Two products per row instead of one */
	#content-pro ul.products li.product {
		width: 48% !important; float: left !important; clear: none !important; margin: 0 4% 24px 0 !important;
	}
	#content-pro ul.products li.product:nth-child(2n) { margin-right: 0 !important; }
	#content-pro ul.products li.product:nth-child(2n+1) { clear: left !important; }
	#content-pro ul.products li.product h2 { font-size: 15px !important; line-height: 1.35; }
	#content-pro ul.products li.product .price { font-size: 14px; }
}

/* Checkout summary: subtotal row repeats the total */
.woocommerce-checkout-review-order-table .cart-subtotal { display: none; }

/* Footer (Elementor template 42): dark navy body like the strip above it */
.elementor-42 .elementor-element-3d11970b,
.elementor-42 .elementor-element-4025bbe8 { background: var(--mp-navy-dark) !important; }
.elementor-42 .elementor-element-4025bbe8 { border-top: 1px solid rgba(255, 255, 255, .08); }
.elementor-42 .elementor-element-3d11970b,
.elementor-42 .elementor-element-3d11970b .elementor-widget-text-editor,
.elementor-42 .elementor-element-3d11970b .elementor-icon-list-text { color: rgba(255, 255, 255, .72) !important; }
.elementor-42 .elementor-element-3d11970b a,
.elementor-42 .elementor-element-3d11970b a[style] { color: rgba(255, 255, 255, .85) !important; }
.elementor-42 .elementor-element-3d11970b a:hover,
.elementor-42 .elementor-element-3d11970b a:hover .elementor-icon-list-text { color: var(--mp-gold) !important; }
.elementor-42 .elementor-element-3d11970b .elementor-icon-list-icon i,
.elementor-42 .elementor-element-3d11970b .elementor-icon-list-icon svg { color: var(--mp-gold) !important; fill: var(--mp-gold) !important; }
.elementor-42 .elementor-element-3d11970b h6.elementor-heading-title { color: #fff !important; }
.elementor-42 .elementor-element-3d11970b h2.elementor-heading-title,
.elementor-42 .elementor-element-11aff3de .elementor-heading-title,
.elementor-42 .elementor-element-1d58b1e9 .elementor-heading-title,
.elementor-42 .elementor-element-a1d886f .elementor-heading-title,
.elementor-42 .elementor-element-abadce5 .elementor-heading-title { color: var(--mp-gold) !important; }
.elementor-42 .elementor-element-4025bbe8 .elementor-heading-title { color: rgba(255, 255, 255, .55) !important; }

/* Testimonial cards (inner sections holding a star rating): equal height, name at the bottom */
.elementor-top-section .elementor-container:has(.elementor-widget-star-rating) { align-items: stretch; }
.elementor-column > .elementor-widget-wrap > .elementor-inner-section:has(.elementor-widget-star-rating) {
	height: 100%; border-radius: 14px; overflow: hidden;
	box-shadow: 0 10px 34px rgba(13, 52, 114, .07); border: 1px solid rgba(13, 52, 114, .06);
}
.elementor-inner-section:has(.elementor-widget-star-rating) > .elementor-container,
.elementor-inner-section:has(.elementor-widget-star-rating) .elementor-column,
.elementor-inner-section:has(.elementor-widget-star-rating) .elementor-widget-wrap { height: 100%; }
.elementor-inner-section:has(.elementor-widget-star-rating) .elementor-widget-wrap { display: flex; flex-direction: column; }
.elementor-inner-section:has(.elementor-widget-star-rating) .elementor-widget-divider { margin-top: auto; }
.elementor-inner-section:has(.elementor-widget-star-rating) .elementor-widget-text-editor { font-size: 15px; line-height: 1.75; }

/* Product cards */
#content-pro ul.products li.product {
	background: #fff; border: 1px solid rgba(13, 52, 114, .08); border-radius: 14px; overflow: hidden;
	box-shadow: 0 8px 26px rgba(13, 52, 114, .06); transition: transform .25s ease, box-shadow .25s ease;
}
#content-pro ul.products li.product:hover { transform: translateY(-4px); box-shadow: 0 16px 38px rgba(13, 52, 114, .12); }
#content-pro ul.products li.product .progression-studios-store-product-image-container img {
	width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 0;
}
#content-pro ul.products li.product .progression-studios-shop-index-text { padding: 18px 18px 20px; text-align: center; }
#content-pro ul.products li.product h2.woocommerce-loop-product__title {
	font-size: 18px !important; line-height: 1.35 !important; margin: 6px 0 10px;
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.7em; max-height: 2.7em; padding: 0 !important;
}
#content-pro ul.products li.product .emso-shop-index-category li a { font-size: 11px; font-family: var(--mp-sans); font-weight: 600; }
#content-pro ul.products li.product .wc-gzd-additional-info-loop,
#content-pro ul.products li.product .progression-studios-shop-overlay-buttons { text-align: center; font-size: 12px; color: #8a93a3; margin: 4px 0 0; padding: 0; }
@media (prefers-reduced-motion: reduce) { #content-pro ul.products li.product { transition: none; } }

/* Theme defaults that still use the old orange */
h2.progression-blog-title a:hover, .progression-blog-content a.more-link { color: var(--mp-gold) !important; }
.progression-blog-content a.more-link:hover { border-color: var(--mp-gold) !important; }
#pro-scroll-top { background: var(--mp-navy) !important; color: #fff !important; }
#pro-scroll-top:hover { background: var(--mp-gold) !important; color: #fff !important; }
.elementor-custom-embed-play i, .elementor-custom-embed-play svg { color: var(--mp-gold) !important; fill: var(--mp-gold) !important; }

/* Flip boxes (Boosted Elements, home + landing pages): the back text overflowed the fixed 190px card. */
.boosted-elements-flip-box-flip-card { height: 270px !important; }
.boosted-elements-flip-box-rear-container .boosted-elements-flip-box-heading { font-size: 18px !important; line-height: 1.3 !important; margin-bottom: 10px !important; }
.boosted-elements-flip-box-rear-container .boosted-elements-flip-box-content { font-size: 15px !important; line-height: 1.55 !important; }
@media (min-width: 768px) and (max-width: 1024px) {
	.elementor-column:has(> .elementor-widget-wrap > .elementor-widget-boosted-elements-flip-box) { width: 50% !important; margin-bottom: 20px; }
}