/* ===========================================
   Empress Unlimited – Custom Styles
   Wird NACH theme.css und helper.css geladen
   =========================================== */

/* Sekundärlinks im Overlay-Menü (Kontakt/Impressum/Datenschutz)
   ============================================================ */
.empress-secondary-links {
	margin: 50px 0 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 24px;
	font-family: 'Poppins', sans-serif;
	font-size: 13px;
	letter-spacing: 0.05em;
	opacity: 0.55;
}

.empress-secondary-links li {
	margin: 0;
}

.empress-secondary-links a {
	color: inherit;
	text-decoration: none;
	transition: opacity 0.3s ease;
}

.empress-secondary-links a:hover {
	opacity: 1;
}


/* Logo-Slider (Kund:innen, durchlaufend)
   ====================================== */
.empress-logo-slider {
	width: 100%;
	overflow: hidden;
	-webkit-mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
	mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
}

.empress-logo-slider .swiper-wrapper {
	transition-timing-function: linear !important;
	align-items: center;
}

.empress-logo-slider .swiper-slide {
	width: auto;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 50px;
	flex-shrink: 0;
}

.empress-logo-slider .swiper-slide img {
	max-height: 56px;
	max-width: 180px;
	width: auto;
	height: auto;
	opacity: 0.7;
	transition: opacity 0.3s ease;
	filter: grayscale(100%);
}

.empress-logo-slider .swiper-slide img:hover {
	opacity: 1;
	filter: grayscale(0%);
}

@media (max-width: 768px) {
	.empress-logo-slider .swiper-slide {
		padding: 0 30px;
	}
	.empress-logo-slider .swiper-slide img {
		max-height: 40px;
		max-width: 130px;
	}
}


/* Hero: Bild im Hintergrund, Text darüber
   ======================================= */
#page-header .ph-image {
	z-index: 0;
}

#page-header .ph-caption {
	position: relative;
	z-index: 5;
}


/* Hero-Subline: 30px Abstand zur H1
   ================================== */
.empress-hero-subline {
	margin-top: 30px;
}


/* Logo: Empress-Höhe (überschreibt Tank-Default 96px / 42px mobile)
   ================================================================ */
.tt-logo img {
	max-height: 100px;
}

@media (max-width: 768px) {
	.tt-logo img {
		max-height: 70px;
	}
}


/* Services-Seite: Service-Blöcke
   ============================== */
.empress-service-block {
	margin-bottom: 0;
}

.empress-service-title {
	font-family: 'Noto Serif JP', serif;
	font-weight: 400;
	font-size: clamp(36px, 5vw, 64px);
	line-height: 1.15;
	margin: 0 0 30px;
}

.empress-service-intro {
	font-size: 18px;
	line-height: 1.7;
	max-width: 780px;
	margin: 0 0 50px;
	opacity: 0.92;
}

.empress-service-list-title {
	font-family: 'Poppins', sans-serif;
	font-weight: 500;
	font-size: 13px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	margin: 0 0 20px;
	opacity: 0.55;
}

.empress-service-list {
	list-style: none;
	margin: 0;
	padding: 0;
	max-width: 780px;
}

.empress-service-list li {
	position: relative;
	padding: 8px 0 8px 32px;
	font-size: 17px;
	line-height: 1.5;
}

.empress-service-list li:before {
	content: '—';
	position: absolute;
	left: 0;
	top: 8px;
	opacity: 0.5;
}

/* CTA unter jedem Service-Block */
.empress-service-cta {
	margin-top: 36px;
}


/* Counter-Nummer rechts (blog-interactive-Pattern) heller setzen
   ============================================================ */
.blog-interactive-item::before {
	opacity: 0.3;
}


/* Tools-Grid: Beschreibung unter dem Titel (shop-list-Pattern adaptiert)
   ===================================================================== */
.empress-tools-grid .tt-product-categories {
	margin-bottom: 8px;
}

.empress-tools-grid .tt-product-category {
	font-family: 'Poppins', sans-serif;
	font-size: 12px;
	letter-spacing: 0.08em;
	text-transform: none;
	opacity: 0.6;
}

.empress-tools-grid .tt-product-title {
	margin-bottom: 12px;
}

.empress-tool-description {
	font-size: 15px;
	line-height: 1.55;
	margin: 0;
	opacity: 0.8;
}

/* Tools-Übersicht: alle Bilder gleich groß (3:2 Ratio, einheitlicher Cover-Crop) */
.empress-tools-grid .tt-product-image-wrap {
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	overflow: hidden;
	padding-bottom: 0 !important;
}

.empress-tools-grid .tt-product-image {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
}

.empress-tools-grid .tt-product-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}


/* ============================================
   Tool-Landingpage (Set Your Sales & Folgende)
   ============================================ */

/* Eyebrow über dem Hero-Titel */
.empress-tool-eyebrow {
	font-family: 'Poppins', sans-serif;
	font-size: 12px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	opacity: 0.6;
	margin-bottom: 24px;
}

/* Hero-CTA-Container */
.empress-hero-cta {
	margin-top: 50px;
}

/* Plattform-Visual (großes Hero-Bild unter dem Hero) */
.empress-platform-visual {
	margin: 0;
	padding: 0;
}

.empress-platform-visual img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 4px;
}

.empress-platform-visual figcaption {
	margin-top: 12px;
	text-align: center;
	font-size: 13px;
}


/* Numbered List (Problem / Lösung)
   ================================ */
.empress-numbered-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.empress-numbered-list li {
	display: flex;
	gap: 30px;
	padding: 28px 0;
	border-top: 1px solid rgb(255 255 255 / 12%);
}

.empress-numbered-list li:last-child {
	border-bottom: 1px solid rgb(255 255 255 / 12%);
}

.empress-numbered-list .enl-num {
	font-family: 'Poppins', sans-serif;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.15em;
	opacity: 0.4;
	flex-shrink: 0;
	padding-top: 4px;
	min-width: 36px;
}

.empress-numbered-list .enl-text {
	flex: 1;
}

.empress-numbered-list h4 {
	font-family: 'Noto Serif JP', serif;
	font-weight: 400;
	font-size: clamp(20px, 2vw, 28px);
	margin: 0 0 8px;
	line-height: 1.3;
}

.empress-numbered-list p {
	font-size: 16px;
	line-height: 1.6;
	margin: 0;
	opacity: 0.8;
	max-width: 720px;
}

@media (max-width: 600px) {
	.empress-numbered-list li {
		gap: 20px;
		padding: 22px 0;
	}
}


/* Tab-Bereich (Empress-Stil über Tank-Default)
   ============================================ */
.empress-tool-tabs.tt-tabs .tt-tabs-buttons {
	border-bottom: 1px solid rgb(255 255 255 / 15%);
	margin-bottom: 60px;
}

.empress-tool-tabs.tt-tabs .tt-tab-btn {
	font-family: 'Poppins', sans-serif;
	font-size: 14px;
	letter-spacing: 0.04em;
	padding: 18px 6px;
	background: transparent;
	color: inherit;
	opacity: 0.55;
	border: none;
	border-bottom: 2px solid transparent;
	cursor: pointer;
	transition: opacity 0.3s ease, border-color 0.3s ease;
}

.empress-tool-tabs.tt-tabs .tt-tab-btn:hover {
	opacity: 0.85;
}

.empress-tool-tabs.tt-tabs .tt-tab-btn.active {
	opacity: 1;
	border-bottom-color: #fff;
}

.empress-tool-tabs.tt-tabs .tt-tab-content {
	padding-top: 20px;
}


/* Cards-Grid (Features / Marketingprodukte / Vorteile)
   ==================================================== */
.empress-cards-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 30px;
}

.empress-cards-grid-tight {
	grid-template-columns: repeat(5, 1fr);
	gap: 24px;
}

.empress-card {
	padding: 32px 28px;
	border: 1px solid rgb(255 255 255 / 14%);
	border-radius: 6px;
	background: rgb(255 255 255 / 3%);
}

.empress-card h4 {
	font-family: 'Noto Serif JP', serif;
	font-weight: 400;
	font-size: 20px;
	line-height: 1.3;
	margin: 0 0 12px;
}

.empress-card p {
	font-size: 14px;
	line-height: 1.55;
	margin: 0;
	opacity: 0.82;
}

@media (max-width: 991px) {
	.empress-cards-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.empress-cards-grid-tight {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 600px) {
	.empress-cards-grid,
	.empress-cards-grid-tight {
		grid-template-columns: 1fr;
		gap: 20px;
	}
	.empress-card {
		padding: 24px 22px;
	}
}


/* KPIs-Grid
   ========= */
.empress-kpi-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 40px 30px;
	margin-bottom: 30px;
}

.empress-kpi {
	padding: 20px 0;
	border-top: 1px solid rgb(255 255 255 / 12%);
}

.empress-kpi .ekpi-num {
	font-family: 'Noto Serif JP', serif;
	font-weight: 300;
	font-size: clamp(40px, 4.5vw, 64px);
	line-height: 1;
	margin-bottom: 12px;
}

.empress-kpi .ekpi-label {
	font-family: 'Poppins', sans-serif;
	font-size: 13px;
	letter-spacing: 0.05em;
	opacity: 0.7;
}

@media (max-width: 768px) {
	.empress-kpi-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}


/* Tab-Hilfsklassen
   ================ */
.empress-tab-intro {
	font-size: 17px;
	line-height: 1.65;
	max-width: 780px;
	margin: 0 0 40px;
	opacity: 0.9;
}

.empress-tab-note {
	margin-top: 20px;
	font-size: 13px;
}


/* Schnittstellen-Tab
   ================== */
.empress-schnittstellen-list {
	list-style: none;
	margin: 0 0 50px;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

.empress-schnittstellen-list li {
	padding: 24px 0;
	border-top: 1px solid rgb(255 255 255 / 14%);
}

.empress-schnittstellen-list h4 {
	font-family: 'Noto Serif JP', serif;
	font-weight: 400;
	font-size: 22px;
	margin: 0 0 10px;
}

.empress-schnittstellen-list p {
	font-size: 14px;
	line-height: 1.55;
	margin: 0;
	opacity: 0.8;
}

.empress-schnittstellen-cta {
	padding: 36px 32px;
	border: 1px solid rgb(255 255 255 / 14%);
	border-radius: 6px;
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
	align-items: center;
	justify-content: space-between;
}

.empress-schnittstellen-cta p {
	margin: 0;
	max-width: 520px;
	font-size: 16px;
	line-height: 1.55;
}

@media (max-width: 768px) {
	.empress-schnittstellen-list {
		grid-template-columns: 1fr;
	}
}


/* Social-Proof
   ============ */
.empress-social-proof {
	display: grid;
	gap: 60px;
	max-width: 900px;
	margin: 0 auto;
}

.empress-sp-logos {
	min-height: 80px;
	border: 1px dashed rgb(255 255 255 / 18%);
	border-radius: 6px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 30px;
	font-size: 14px;
	text-align: center;
}

.empress-sp-quote {
	margin: 0;
	padding: 0;
	text-align: center;
}

.empress-sp-quote p {
	font-family: 'Noto Serif JP', serif;
	font-weight: 300;
	font-size: clamp(20px, 2.2vw, 28px);
	line-height: 1.4;
	margin: 0 0 16px;
	font-style: italic;
}

.empress-sp-quote cite {
	font-family: 'Poppins', sans-serif;
	font-size: 13px;
	font-style: normal;
	opacity: 0.7;
}


/* Booking-Note
   ============ */
.empress-booking-note {
	margin-top: 30px;
	font-size: 13px;
	text-align: center;
}


/* Tank tt-Tabs (shop-single-Pattern): Empress-Blau-Töne überschreiben Default-Grau
   =============================================================================== */
.tt-tab-btn {
	background-color: #04048d;
	color: #FFF;
}

.tt-tab-btn:hover {
	background-color: #0000b4;
	color: #FFF;
}

.tt-tab-btn.active {
	background-color: #0000b4;
	color: #FFF;
}


/* Section-Lead (Definitionsähnlicher Einstieg, GEO-tauglich)
   ========================================================== */
.empress-section-lead {
	font-size: 18px;
	line-height: 1.65;
	max-width: 820px;
	margin: 0 0 60px;
	opacity: 0.92;
}


/* KPI-Highlights über Business Impact Cards
   ========================================= */
.empress-kpi-highlights {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 30px;
	margin-bottom: 70px;
	padding-bottom: 60px;
	border-bottom: 1px solid rgb(255 255 255 / 12%);
}

.empress-kpi-highlights .empress-kpi {
	border-top: none;
	padding: 0;
}

@media (max-width: 768px) {
	.empress-kpi-highlights {
		grid-template-columns: 1fr;
		gap: 30px;
	}
}


/* KPI-Tab: Liste der Hersteller/Händler, die das Tool einsetzen
   ============================================================= */
.empress-kpi-clients {
	margin-top: 50px;
	padding-top: 50px;
	border-top: 1px solid rgb(255 255 255 / 12%);
}

.empress-kpi-clients-title {
	font-family: 'Poppins', sans-serif;
	font-size: 13px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	margin: 0 0 24px;
	opacity: 0.65;
}

.empress-kpi-clients-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 12px 30px;
}

.empress-kpi-clients-list li {
	font-size: 16px;
	line-height: 1.5;
}

.empress-kpi-clients-list a {
	color: inherit;
	text-decoration: underline;
	text-decoration-color: rgb(255 255 255 / 30%);
	text-underline-offset: 4px;
	transition: text-decoration-color 0.3s ease;
}

.empress-kpi-clients-list a:hover {
	text-decoration-color: rgb(255 255 255 / 100%);
}

@media (max-width: 600px) {
	.empress-kpi-clients-list {
		grid-template-columns: 1fr;
	}
}


/* Tools-Teaser am Ende von Tool-Landingpages (Cross-Sell)
   ======================================================= */
.empress-tools-teaser {
	list-style: none;
	margin: 0;
	padding: 0;
	border-top: 1px solid rgb(255 255 255 / 12%);
}

.empress-tools-teaser li {
	border-bottom: 1px solid rgb(255 255 255 / 12%);
}

.empress-tools-teaser a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 30px;
	padding: 28px 0;
	color: inherit;
	text-decoration: none;
	transition: padding 0.4s ease;
}

.empress-tools-teaser a:hover {
	padding-left: 16px;
}

.empress-tools-teaser .ett-text {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.empress-tools-teaser .ett-title {
	font-family: 'Noto Serif JP', serif;
	font-weight: 400;
	font-size: clamp(20px, 2vw, 28px);
	line-height: 1.3;
}

.empress-tools-teaser .ett-desc {
	font-size: 14px;
	line-height: 1.55;
	opacity: 0.75;
	max-width: 720px;
}

.empress-tools-teaser .ett-arrow {
	font-family: 'Poppins', sans-serif;
	font-size: 28px;
	font-weight: 300;
	opacity: 0.5;
	flex-shrink: 0;
	transition: opacity 0.3s ease, transform 0.3s ease;
}

.empress-tools-teaser a:hover .ett-arrow {
	opacity: 1;
	transform: translateX(8px);
}

@media (max-width: 600px) {
	.empress-tools-teaser a {
		padding: 22px 0;
		gap: 16px;
	}
	.empress-tools-teaser .ett-arrow {
		font-size: 22px;
	}
}


/* Services-Seite: Logo-Wand mit Filter
   ==================================== */
.empress-logo-filter-wrap {
	width: 100%;
	max-width: 1300px;
	margin: 0 auto;
}

.empress-filter-buttons {
	list-style: none;
	margin: 0 0 60px;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px 12px;
}

.empress-filter-buttons li {
	padding: 9px 20px;
	font-family: 'Poppins', sans-serif;
	font-size: 13px;
	letter-spacing: 0.05em;
	color: inherit;
	border: 1px solid rgb(255 255 255 / 30%);
	border-radius: 100px;
	cursor: pointer;
	transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease;
	user-select: none;
}

.empress-filter-buttons li:hover {
	border-color: rgb(255 255 255 / 75%);
}

.empress-filter-buttons li.active {
	background-color: #fff;
	color: #0000d6;
	border-color: #fff;
}

.empress-logo-grid {
	margin: 0 -10px;
}

.empress-logo-grid:after {
	content: '';
	display: block;
	clear: both;
}

.empress-logo-item {
	float: left;
	width: 25%;
	padding: 30px 10px;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
}

.empress-logo-item img {
	max-height: 60px;
	max-width: 100%;
	width: auto;
	height: auto;
	opacity: 0.65;
	filter: grayscale(100%);
	transition: opacity 0.3s ease, filter 0.3s ease;
}

.empress-logo-item img:hover {
	opacity: 1;
	filter: grayscale(0%);
}

@media (max-width: 991px) {
	.empress-logo-item {
		width: 33.333%;
	}
}

@media (max-width: 600px) {
	.empress-logo-item {
		width: 50%;
		padding: 20px 10px;
	}
	.empress-filter-buttons li {
		padding: 7px 14px;
		font-size: 12px;
	}
}


/* Services-Subnav (vertikal, sticky am rechten Rand)
   ================================================== */
.empress-services-subnav {
	position: fixed;
	right: 30px;
	top: 50%;
	transform: translateY(-50%);
	z-index: 90;
	pointer-events: none;
}

.empress-services-subnav ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.empress-services-subnav li {
	margin: 4px 0;
	pointer-events: auto;
}

.empress-services-subnav a {
	display: flex;
	align-items: center;
	text-decoration: none;
	color: inherit;
	padding: 8px 0;
	position: relative;
	white-space: nowrap;
}

.empress-services-subnav a:before {
	content: '';
	display: block;
	width: 24px;
	height: 1px;
	background: currentColor;
	opacity: 0.4;
	margin-right: 14px;
	transition: width 0.4s ease, opacity 0.4s ease;
}

.empress-services-subnav .snn-num {
	font-family: 'Poppins', sans-serif;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.15em;
	opacity: 0.6;
	margin-right: 12px;
	transition: opacity 0.3s ease;
}

.empress-services-subnav .snn-label {
	font-family: 'Poppins', sans-serif;
	font-size: 13px;
	letter-spacing: 0.03em;
	opacity: 0;
	max-width: 0;
	overflow: hidden;
	transform: translateX(-8px);
	transition: opacity 0.4s ease, max-width 0.4s ease, transform 0.4s ease;
}

.empress-services-subnav a:hover:before,
.empress-services-subnav a.active:before {
	width: 50px;
	opacity: 1;
}

.empress-services-subnav a:hover .snn-num,
.empress-services-subnav a.active .snn-num {
	opacity: 1;
}

.empress-services-subnav a:hover .snn-label,
.empress-services-subnav a.active .snn-label {
	opacity: 1;
	max-width: 260px;
	transform: translateX(0);
}

@media (max-width: 991px) {
	.empress-services-subnav {
		display: none;
	}
}


/* Platzhalter-Markierung (für noch nicht gelieferte Texte)
   ======================================================== */
.empress-placeholder {
	opacity: 0.4;
	font-style: italic;
}

.empress-placeholder:before {
	content: '⚠ ';
	font-style: normal;
	margin-right: 4px;
}


/* Tools-Seite: Workflow (Tool 6 — Vom Lieferanten zum Katalog)
   ============================================================ */
.empress-workflow {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 50px 40px;
	margin-top: 60px;
}

.empress-workflow-step {
	position: relative;
}

.empress-workflow-icon {
	width: 80px;
	height: 80px;
	border: 1px dashed rgb(255 255 255 / 30%);
	border-radius: 12px;
	margin-bottom: 24px;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
}

.empress-workflow-icon:before {
	content: attr(data-step);
	font-family: 'Poppins', sans-serif;
	font-size: 11px;
	letter-spacing: 0.18em;
	opacity: 0.4;
}

.empress-workflow-title {
	font-family: 'Noto Serif JP', serif;
	font-weight: 400;
	font-size: 22px;
	margin: 0 0 12px;
}

.empress-workflow-text {
	font-size: 15px;
	line-height: 1.6;
	opacity: 0.8;
	margin: 0;
}

@media (max-width: 991px) {
	.empress-workflow {
		grid-template-columns: repeat(2, 1fr);
		gap: 40px 30px;
	}
}

@media (max-width: 600px) {
	.empress-workflow {
		grid-template-columns: 1fr;
		gap: 35px;
	}
	.empress-workflow-icon {
		width: 64px;
		height: 64px;
	}
}


/* ============================================
   Tools-Teaser-Carousel: Zoom-In statt Farbwechsel
   ============================================ */

.tt-related-products-carousel .tt-product-image-holder {
	overflow: hidden;
}

.tt-related-products-carousel .tt-product-image {
	transition: transform 0.7s cubic-bezier(0.2, 0.8, 0.2, 1);
	will-change: transform;
}

.tt-related-products-carousel .tt-product:hover .tt-product-image,
.tt-related-products-carousel .tt-product-image-holder:hover .tt-product-image {
	transform: scale(1.06);
	opacity: 1;
	visibility: visible;
}

/* Title-Farbe konsistent halten — kein blauer visited-Default */
.tt-related-products-carousel .tt-product-title a,
.tt-related-products-carousel .tt-product-title a:visited,
.tt-related-products-carousel .tt-product-title a:hover,
.tt-related-products-carousel .tt-product-title a:focus {
	color: currentColor;
	opacity: 1;
}


/* Workflow-Flow (horizontale Prozess-Visualisierung)
   ================================================== */
.empress-workflow-flow {
	display: flex;
	align-items: stretch;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: nowrap;
}

.empress-workflow-flow .ewf-stage {
	flex: 1 1 0;
	min-width: 0;
	padding: 32px 24px;
	border: 1px solid rgb(255 255 255 / 14%);
	border-radius: 6px;
	background: rgb(255 255 255 / 3%);
	text-align: center;
}

.empress-workflow-flow .ewf-icon {
	font-size: 28px;
	margin-bottom: 18px;
	opacity: 0.7;
}

.empress-workflow-flow .ewf-stage h4 {
	font-family: 'Noto Serif JP', serif;
	font-weight: 400;
	font-size: 18px;
	line-height: 1.3;
	margin: 0 0 10px;
}

.empress-workflow-flow .ewf-stage p {
	font-size: 13px;
	line-height: 1.55;
	margin: 0;
	opacity: 0.78;
}

.empress-workflow-flow .ewf-arrow {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 16px;
	opacity: 0.4;
	padding: 0 4px;
}

@media (max-width: 991px) {
	.empress-workflow-flow {
		flex-wrap: wrap;
		justify-content: center;
	}
	.empress-workflow-flow .ewf-stage {
		flex: 1 1 calc(50% - 12px);
		min-width: 220px;
	}
	.empress-workflow-flow .ewf-arrow {
		transform: rotate(90deg);
		flex-basis: 100%;
		padding: 6px 0;
	}
}

@media (max-width: 600px) {
	.empress-workflow-flow .ewf-stage {
		flex-basis: 100%;
	}
}


/* Card-Icon (Icon oben in Empress-Card)
   ===================================== */
.empress-card-icon {
	font-size: 24px;
	opacity: 0.7;
	margin-bottom: 18px;
	line-height: 1;
}