/* ==========================================================================
   Hero-Slider der Startseite (Shortcode [urban_hero_slider]).
   Schrift: Jost (serifenlos, geometrisch) – lokal eingebunden.
   ========================================================================== */


/* ==========================================================================
   Hero: Elementor-Pro-Widget „Slides“ (im Editor bearbeitbar), nur Optik hier.
   ========================================================================== */

.uhs-native {
	--uhs-light: #fff;
	--uhs-ink: #051f34;
	--uhs-accent: #cfa47e;
	--uhs-font: "Jost", "Montserrat", system-ui, sans-serif;
}

.uhs-native .elementor-slides,
.uhs-native .swiper-slide-inner { font-family: "Montserrat", system-ui, sans-serif; }

/* Ganze Slide ist ein Link – keine Unterstreichung. */
.uhs-native a.swiper-slide-inner,
.uhs-native a.swiper-slide-inner:hover,
.uhs-native a.swiper-slide-inner * { text-decoration: none !important; }

/* Verlauf links für bessere Lesbarkeit des Textes. */
.elementor-widget-slides.uhs-native .elementor-background-overlay {
	background: linear-gradient(90deg, rgba(5, 20, 33, .78) 0%, rgba(5, 20, 33, .45) 45%, rgba(5, 20, 33, .05) 80%) !important;
	opacity: 1 !important;
}

/* Text */
.elementor-widget-slides.uhs-native .elementor-slide-heading {
	position: relative;
	max-width: 14ch;
	margin-bottom: 26px;
	padding-bottom: 26px;
	font-family: var(--uhs-font);
	font-size: clamp(2.6rem, 5.6vw, 5rem) !important;
	font-weight: 500 !important;
	line-height: 1.02;
	letter-spacing: -.02em;
	color: var(--uhs-light) !important;
	text-shadow: 0 2px 24px rgba(5, 20, 33, .35);
}
/* Goldene Linie unter der Überschrift */
.elementor-widget-slides.uhs-native .elementor-slide-heading::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 72px;
	height: 3px;
	background: var(--uhs-accent);
}
.elementor-widget-slides.uhs-native .elementor-slide-description {
	max-width: 42ch;
	margin-bottom: 36px;
	font-size: clamp(1.1rem, 1.5vw, 1.4rem) !important;
	font-weight: 400 !important;
	line-height: 1.55;
	color: rgba(255, 255, 255, .95) !important;
	text-shadow: 0 1px 12px rgba(5, 20, 33, .4);
}

/* Button */
.elementor-widget-slides.uhs-native .elementor-slide-button,
.elementor-widget-slides.uhs-native .elementor-slide-button:visited {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 20px 38px;
	border: 1.5px solid var(--uhs-accent);
	border-radius: 0;
	background: var(--uhs-accent);
	color: var(--uhs-ink);
	font-size: .92rem !important;
	font-weight: 500;
	letter-spacing: .14em;
	line-height: 1;
	text-transform: uppercase;
	transition: background-color .3s, color .3s, border-color .3s;
}
.uhs-native .elementor-slide-button::after { content: "→"; font-size: 1.1rem; line-height: 0; transition: transform .3s; }
.uhs-native .swiper-slide-inner:hover .elementor-slide-button::after { transform: translateX(5px); }
.uhs-native .swiper-slide-inner:hover .elementor-slide-button,
.uhs-native .elementor-slide-button:hover {
	background: var(--uhs-light);
	border-color: var(--uhs-light);
	color: var(--uhs-ink);
}

/* Pfeile */
.elementor-widget-slides.uhs-native .elementor-swiper-button {
	display: grid;
	place-items: center;
	width: 58px;
	height: 58px;
	border: 1.5px solid rgba(255, 255, 255, .7);
	border-radius: 50%;
	background: rgba(5, 20, 33, .35);
	backdrop-filter: blur(4px);
	color: #fff;
	font-size: 22px;
	transition: background-color .3s, color .3s, border-color .3s;
}
.uhs-native .elementor-swiper-button:hover { background: #fff; border-color: #fff; color: var(--uhs-ink); }
/* Pfeile unten rechts, damit sie nicht über Text und Button liegen. */
.elementor-widget-slides.uhs-native .elementor-swiper-button {
	top: auto;
	bottom: clamp(20px, 4vh, 40px);
	transform: none;
}
.elementor-widget-slides.uhs-native .elementor-swiper-button-prev { left: auto; right: calc(clamp(14px, 3vw, 38px) + 70px); }
.elementor-widget-slides.uhs-native .elementor-swiper-button-next { right: clamp(14px, 3vw, 38px); }

/* Punkte */
/* Sichtbarer Strich 5px, Klickfläche 25px hoch (transparenter Rahmen). */
.elementor-widget-slides.uhs-native .swiper-pagination-bullet {
	width: 56px !important;
	height: 25px !important;
	margin: 0 6px !important;
	border: 10px solid transparent;
	border-width: 10px 0;
	border-radius: 0;
	background: rgba(255, 255, 255, .4);
	background-clip: padding-box;
	opacity: 1;
	cursor: pointer;
	transition: background-color .3s;
}
.elementor-widget-slides.uhs-native .swiper-pagination-bullet:hover { background-color: rgba(255, 255, 255, .75); }
.elementor-widget-slides.uhs-native .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: var(--uhs-gold, #cfa47e); }
.elementor-widget-slides.uhs-native .swiper-pagination {
	left: clamp(20px, 5vw, 72px);
	width: auto;
	bottom: calc(clamp(20px, 4vh, 40px) + 16px);
	text-align: left;
}

@media (max-width: 767px) {
	.elementor-widget-slides.uhs-native .elementor-slide-description { margin-bottom: 24px; }
	.uhs-native .elementor-slide-button { padding: 17px 28px; font-size: .85rem; }
	.elementor-widget-slides.uhs-native .elementor-swiper-button { width: 48px; height: 48px; font-size: 19px; }
	.elementor-widget-slides.uhs-native .swiper-pagination-bullet { width: 40px !important; }
}