/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Apr 02 2026 | 08:26:28 */
/* ═══════════════════════════════════════════
RESET & BASE
═══════════════════════════════════════════ */
*,*::before,*::after{
	box-sizing:border-box;
	margin:0;
	padding:0}
html{
	scroll-behavior:smooth;
	overflow-x:hidden}
body{
	font-family:'DM Sans',sans-serif;
	color:#1A1E5A;
	background:#fff;
	font-size:16px;
	line-height:1.65;
	-webkit-font-smoothing:antialiased;
	overflow-x:hidden;
	word-break:break-word;
	overflow-wrap:break-word}
:root{
	--max:1100px}
.container{
	max-width:var(--max);
	margin:0 auto;
	padding:0 48px}
@media(max-width:768px){
	.container{
		padding:0 20px}
}
.label{
	display:inline-flex;
	align-items:center;
	gap:8px;
	font-size:11px;
	font-weight:700;
	letter-spacing:.15em;
	text-transform:uppercase;
	color:var(--nv-primary-accent);
	margin-bottom:14px}
.label::before{
	content:'';
	display:block;
	width:20px;
	height:2px;
	background:var(--nv-primary-accent)}
h1,h2,h3{
	font-family:'DM Serif Display',serif;
	line-height:1.1;
	letter-spacing:-.02em}
h1{
	font-size:clamp(28px,5vw,52px)}
h2{
	font-size:clamp(22px,3.5vw,38px)}
h3{
	font-size:clamp(17px,2.2vw,22px)}
em{
	font-style:italic;
	color:var(--nv-primary-accent);
	-webkit-text-fill-color:var(--nv-primary-accent)}
.lead{
	font-size:17px;
	color:var(--muted);
	line-height:1.75}
.btn{
	display:inline-flex;
	align-items:center;
	gap:8px;
	font-family:'DM Sans',sans-serif;
	font-weight:700;
	font-size:12px;
	letter-spacing:.1em;
	text-transform:uppercase;
	text-decoration:none;
	padding:14px 24px;
	border:none;
	cursor:pointer;
	transition:transform .15s,box-shadow .15s,background .15s,color .15s;
	white-space:nowrap}
.btn-primary{
	background:var(--nv-primary-accent);
	color:var(--navy);
	box-shadow:0 4px 18px rgba(0,217,176,.25)}
.btn-primary:hover{
	transform:translateY(-2px);
	box-shadow:0 8px 28px rgba(0,217,176,.4)}
.btn-outline{
	background:transparent;
	color:var(--navy);
	border:2px solid var(--navy)}
.btn-outline:hover{
	background:var(--navy);
	color:#fff}
.reveal{
	opacity:0;
	transform:translateY(16px);
	transition:opacity .6s ease,transform .6s ease}
.reveal.visible{
	opacity:1;
	transform:none}
/* Breadcrumb */
.breadcrumb{
	background:var(--offwhite);
	border-bottom:1px solid var(--border);
	padding:10px 0}
.breadcrumb-inner{
	display:flex;
	align-items:center;
	gap:6px;
	font-size:12px;
	color:var(--muted);
	flex-wrap:wrap}
.breadcrumb-inner a{
	color:var(--muted);
	text-decoration:none;
	transition:color .15s}
.breadcrumb-inner a:hover{
	color:var(--nv-primary-accent)}
.breadcrumb-sep{
	color:var(--border)}
.breadcrumb-current{
	color:var(--navy);
	font-weight:500}
/* ═══════════════════════════════════════════
HERO
═══════════════════════════════════════════ */
.hero{
	background:#fff;
	padding:64px 0 72px;
	position:relative;
	overflow:hidden}
.hero::after{
	content:'';
	position:absolute;
	inset:0;
	background:radial-gradient(ellipse 50% 70% at 100% 40%,#DFF7F2 0%,transparent 55%),radial-gradient(ellipse 25% 40% at 0% 90%,#EEF0FA 0%,transparent 50%);
	pointer-events:none;
	z-index:0}
.hero-inner{
	position:relative;
	z-index:2;
	display:grid;
	grid-template-columns:1fr 380px;
	gap:60px;
	align-items:center}
/* Keyword badge */
.kw-badge{
	display:inline-flex;
	align-items:center;
	gap:6px;
	font-size:10px;
	font-weight:700;
	letter-spacing:.12em;
	text-transform:uppercase;
	background:var(--teal-soft);
	border:1px solid rgba(0,217,176,.3);
	color:var(--nv-primary-accent);
	padding:5px 12px;
	margin-bottom:14px}
.kw-badge::before{
	content:'';
	width:6px;
	height:6px;
	border-radius:50%;
	background:var(--nv-primary-accent);
	display:block}
.hero h1{
	margin-bottom:18px}
.hero .lead{
	margin-bottom:28px;
	max-width:480px}
/* Trust pills */
.trust-pills{
	display:flex;
	flex-wrap:wrap;
	gap:8px;
	margin-bottom:28px}
.tp{
	display:flex;
	align-items:center;
	gap:6px;
	font-size:12px;
	font-weight:500;
	color:var(--muted);
	background:var(--offwhite);
	border:1px solid var(--border);
	padding:5px 12px}
.tp svg{
	stroke:var(--nv-primary-accent);
	flex-shrink:0}
.hero-cta{
	display:flex;
	gap:12px;
	flex-wrap:wrap;
	margin-bottom:32px}
/* Trust bar */
.trust-bar{
	display:flex;
	flex-wrap:wrap;
	gap:0;
	padding-top:24px;
	border-top:1px solid var(--border)}
.tb-item{
	display:flex;
	align-items:center;
	gap:7px;
	font-size:12px;
	font-weight:500;
	color:var(--muted);
	padding-right:20px;
	margin-right:20px;
	border-right:1px solid var(--border)}
.tb-item:last-child{
	border-right:none;
	padding-right:0;
	margin-right:0}
.tb-dot{
	width:5px;
	height:5px;
	border-radius:50%;
	background:var(--nv-primary-accent);
	flex-shrink:0}
/* Hero right: Booking card */
.booking-card{
	background:var(--navy);
	padding:32px;
	position:relative;
	overflow:hidden}
.booking-card::before{
	content:'';
	position:absolute;
	right:-40px;
	top:-40px;
	width:180px;
	height:180px;
	border-radius:50%;
	border:1px solid rgba(0,217,176,.18)}
.bc-label{
	font-size:10px;
	font-weight:700;
	letter-spacing:.12em;
	text-transform:uppercase;
	color:var(--nv-primary-accent);
	margin-bottom:8px;
	display:flex;
	align-items:center;
	gap:6px;
	position:relative;
	z-index:2}
.bc-label::before{
	content:'';
	display:block;
	width:12px;
	height:2px;
	background:var(--nv-primary-accent)}
.bc-title{
	font-family:'DM Serif Display',serif;
	font-size:20px;
	color:#fff;
	margin-bottom:8px;
	position:relative;
	z-index:2;
	line-height:1.2}
.bc-sub{
	font-size:13px;
	color:rgba(255,255,255,.55);
	margin-bottom:20px;
	position:relative;
	z-index:2;
	line-height:1.55}
.bc-checks{
	list-style:none;
	display:flex;
	flex-direction:column;
	gap:8px;
	margin-bottom:24px;
	position:relative;
	z-index:2}
.bc-checks li{
	display:flex;
	align-items:flex-start;
	gap:8px;
	font-size:13px;
	color:rgba(255,255,255,.75);
	line-height:1.45}
.bc-checks li::before{
	content:'';
	flex-shrink:0;
	width:16px;
	height:16px;
	border-radius:50%;
	background:rgba(0,217,176,.2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2300D9B0' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/9px no-repeat;
	margin-top:2px}
.bc-btn{
	width:100%;
	text-align:center;
	justify-content:center;
	position:relative;
	z-index:2;
	display:flex;
	margin-bottom:12px}
.bc-btn a{
	width:100%;
	justify-content:center}
.bc-phone{
	display:flex;
	align-items:center;
	justify-content:center;
	gap:8px;
	font-size:13px;
	color:rgba(255,255,255,.45);
	text-decoration:none;
	position:relative;
	z-index:2;
	transition:color .15s}
.bc-phone:hover{
	color:var(--nv-primary-accent)}
.bc-phone svg{
	stroke:var(--nv-primary-accent)}
@media(max-width:900px){
	.hero-inner{
		grid-template-columns:1fr;
		gap:36px}
	.hero{
		padding:48px 0 56px}
}
@media(max-width:600px){
	.hero-cta{
		flex-direction:column}
	.hero-cta .btn{
		justify-content:center}
}
/* ═══════════════════════════════════════════
PAIN / NUTZEN
═══════════════════════════════════════════ */
.pain-section{
	background:var(--offwhite);
	padding:72px 0}
.pain-inner{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:48px;
	align-items:start}
.pain-col h3{
	font-size:16px;
	font-weight:700;
	font-family:'DM Sans',sans-serif;
	margin-bottom:16px;
	color:var(--navy)}
.pain-list{
	list-style:none;
	display:flex;
	flex-direction:column;
	gap:0}
.pain-item{
	display:flex;
	align-items:flex-start;
	gap:12px;
	padding:13px 0;
	border-bottom:1px solid var(--border);
	font-size:14px;
	line-height:1.55}
.pain-item:last-child{
	border-bottom:none}
.pi-icon{
	width:22px;
	height:22px;
	border-radius:50%;
	flex-shrink:0;
	display:flex;
	align-items:center;
	justify-content:center;
	margin-top:1px}
.pi-x{
	background:#FEE8E8}
.pi-x svg{
	stroke:#C0392B}
.pi-ok{
	background:var(--teal-soft)}
.pi-ok svg{
	stroke:var(--nv-primary-accent)}
.pain-item.before{
	color:var(--muted)}
.pain-item.after{
	color:var(--navy);
	font-weight:500}
@media(max-width:700px){
	.pain-inner{
		grid-template-columns:1fr;
		gap:28px}
	.pain-section{
		padding:56px 0}
}
/* ═══════════════════════════════════════════
LEISTUNGEN (keyword-spezifisch)
═══════════════════════════════════════════ */
.leistungen-section{
	padding:72px 0}
.leistungen-inner{
	display:grid;
	grid-template-columns:1fr 1fr 1fr;
	gap:24px;
	margin-top:48px}
.lk-card{
	background:#fff;
	border:1px solid var(--border);
	padding:32px;
	position:relative;
	overflow:hidden;
	transition:transform .2s,box-shadow .2s}
.lk-card:hover{
	transform:translateY(-4px);
	box-shadow:0 12px 36px rgba(26,30,90,.09)}
.lk-card::before{
	content:'';
	position:absolute;
	top:0;
	left:0;
	right:0;
	height:3px;
	background:var(--nv-primary-accent)}
.lk-num{
	font-family:'DM Serif Display',serif;
	font-size:40px;
	background:linear-gradient(135deg,#00D9B0,#00B8E6);
	-webkit-background-clip:text;
	-webkit-text-fill-color:transparent;
	background-clip:text;
	line-height:1;
	margin-bottom:16px}
.lk-card h3{
	font-size:19px;
	margin-bottom:10px}
.lk-card p{
	font-size:14px;
	color:var(--muted);
	line-height:1.65;
	margin-bottom:14px}
.lk-tags{
	display:flex;
	flex-wrap:wrap;
	gap:6px}
.lk-tag{
	font-size:10px;
	font-weight:600;
	letter-spacing:.06em;
	background:var(--offwhite);
	border:1px solid var(--border);
	padding:3px 9px;
	color:var(--muted)}
@media(max-width:820px){
	.leistungen-inner{
		grid-template-columns:1fr 1fr}
}
@media(max-width:520px){
	.leistungen-inner{
		grid-template-columns:1fr}
}
/* ═══════════════════════════════════════════
ONLINE SECTION (mit City-Platzhalter, kein "Wien")
═══════════════════════════════════════════ */
.online-section{
	background:var(--navy);
	padding:64px 0;
	position:relative;
	overflow:hidden}
.online-section::before{
	content:'';
	position:absolute;
	right:-80px;
	top:-80px;
	width:380px;
	height:380px;
	border-radius:50%;
	border:1px solid rgba(0,217,176,.12)}
.online-inner{
	position:relative;
	z-index:2;
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:56px;
	align-items:center}
.online-text h2{
	color:#fff;
	margin-bottom:14px}
.online-text .lead{
	color:rgba(255,255,255,.55);
	margin-bottom:24px}
.online-list{
	list-style:none;
	display:flex;
	flex-direction:column;
	gap:10px}
.online-list li{
	display:flex;
	align-items:flex-start;
	gap:10px;
	font-size:14px;
	color:rgba(255,255,255,.7);
	line-height:1.5}
.online-list li::before{
	content:'';
	flex-shrink:0;
	width:18px;
	height:18px;
	border-radius:50%;
	background:rgba(0,217,176,.2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2300D9B0' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/10px no-repeat;
	margin-top:2px}
.online-facts{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:16px}
.of-card{
	background:rgba(255,255,255,.06);
	border:1px solid rgba(255,255,255,.1);
	padding:20px}
.of-val{
	font-family:'DM Serif Display',serif;
	font-size:28px;
	color:var(--nv-primary-accent);
	-webkit-text-fill-color:var(--nv-primary-accent);
	line-height:1;
	margin-bottom:4px}
.of-label{
	font-size:12px;
	color:rgba(255,255,255,.45);
	line-height:1.4}
@media(max-width:768px){
	.online-inner{
		grid-template-columns:1fr;
		gap:36px}
	.online-section{
		padding:56px 0}
}
/* ═══════════════════════════════════════════
ÜBER MICH (kompakt)
═══════════════════════════════════════════ */
.about-section{
	background:var(--offwhite);
	padding:72px 0}
.about-inner{
	display:grid;
	grid-template-columns:280px 1fr;
	gap:56px;
	align-items:start}
.about-photo{
	width:100%;
	aspect-ratio:3/4;
	object-fit:cover;
	object-position:center top;
	border-top:4px solid var(--nv-primary-accent)}
.about-text h2{
	margin-bottom:14px}
.about-text .lead{
	margin-bottom:24px}
.cred-grid{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:12px;
	margin-bottom:24px}
.cred-item{
	background:#fff;
	border:1px solid var(--border);
	padding:14px 16px}
.cred-item .ci-label{
	font-size:9px;
	font-weight:700;
	letter-spacing:.12em;
	text-transform:uppercase;
	color:var(--nv-primary-accent);
	margin-bottom:4px}
.cred-item .ci-val{
	font-size:13px;
	font-weight:600;
	color:var(--navy);
	line-height:1.35}
@media(max-width:768px){
	.about-inner{
		grid-template-columns:1fr;
		gap:28px}
	.about-section{
		padding:56px 0}
	.about-photo{
		max-width:240px}
}
/* ═══════════════════════════════════════════
FAQ
═══════════════════════════════════════════ */
.faq-section{
	padding:72px 0}
.faq-list{
	margin-top:40px;
	display:flex;
	flex-direction:column;
	gap:0;
	border:1px solid var(--border);
	overflow:hidden}
.faq-item{
	border-bottom:1px solid var(--border)}
.faq-item:last-child{
	border-bottom:none}
.faq-q{
	display:flex;
	align-items:flex-start;
	justify-content:space-between;
	gap:16px;
	padding:18px 22px;
	cursor:pointer;
	transition:background .15s}
.faq-q:hover{
	background:var(--offwhite)}
.faq-item.open .faq-q{
	background:var(--teal-soft)}
.faq-q-text{
	font-size:15px;
	font-weight:600;
	color:var(--navy);
	line-height:1.4;
	flex:1}
.faq-icon{
	font-size:20px;
	color:var(--muted);
	flex-shrink:0;
	transition:transform .25s;
	line-height:1;
	margin-top:1px}
.faq-item.open .faq-icon{
	transform:rotate(45deg);
	color:var(--nv-primary-accent)}
.faq-a{
	display:none;
	padding:4px 22px 18px;
	font-size:14px;
	color:var(--muted);
	line-height:1.7}
.faq-item.open .faq-a{
	display:block}
@media(max-width:600px){
	.faq-q{
		padding:15px 18px}
	.faq-a{
		padding:4px 18px 15px}
}
/* ═══════════════════════════════════════════
REFERENZEN (3 cards)
═══════════════════════════════════════════ */
.ref-section{
	background:var(--offwhite);
	padding:72px 0}
.ref-grid{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:24px;
	margin-top:40px}
.ref-card{
	background:#fff;
	border:1px solid var(--border);
	padding:28px;
	position:relative;
	transition:transform .2s,box-shadow .2s}
.ref-card:hover{
	transform:translateY(-3px);
	box-shadow:0 10px 28px rgba(26,30,90,.08)}
.ref-card::before{
	content:'';
	position:absolute;
	top:0;
	left:0;
	right:0;
	height:3px;
	background:var(--nv-primary-accent)}
.ref-tag{
	font-size:10px;
	font-weight:700;
	letter-spacing:.1em;
	text-transform:uppercase;
	background:var(--offwhite);
	padding:3px 9px;
	display:inline-block;
	margin-bottom:12px;
	color:var(--navy)}
.ref-client{
	font-size:11px;
	font-weight:700;
	letter-spacing:.08em;
	text-transform:uppercase;
	color:var(--nv-primary-accent);
	margin-bottom:6px}
.ref-card h3{
	font-size:16px;
	margin-bottom:8px}
.ref-card p{
	font-size:13px;
	color:var(--muted);
	line-height:1.65}
@media(max-width:820px){
	.ref-grid{
		grid-template-columns:1fr 1fr}
}
@media(max-width:520px){
	.ref-grid{
		grid-template-columns:1fr}
	.ref-section{
		padding:56px 0}
}
/* ═══════════════════════════════════════════
CTA DARK
═══════════════════════════════════════════ */
.cta-dark{
	background:var(--navy);
	padding:72px 0;
	position:relative;
	overflow:hidden}
.cta-dark::before{
	content:'';
	position:absolute;
	right:-80px;
	top:-80px;
	width:400px;
	height:400px;
	border-radius:50%;
	border:1px solid rgba(0,217,176,.12)}
.cta-inner{
	position:relative;
	z-index:2;
	display:grid;
	grid-template-columns:1fr 280px;
	gap:56px;
	align-items:center}
.cta-dark h2{
	color:#fff;
	margin-bottom:10px}
.cta-dark .sub{
	font-size:15px;
	color:rgba(255,255,255,.5);
	margin-bottom:24px;
	line-height:1.7}
.cta-check{
	list-style:none;
	display:flex;
	flex-direction:column;
	gap:8px}
.cta-check li{
	display:flex;
	align-items:flex-start;
	gap:9px;
	font-size:14px;
	color:rgba(255,255,255,.7);
	line-height:1.45}
.cta-check li::before{
	content:'';
	flex-shrink:0;
	width:17px;
	height:17px;
	border-radius:50%;
	background:rgba(0,217,176,.2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2300D9B0' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/9px no-repeat;
	margin-top:2px}
.cta-right{
	display:flex;
	flex-direction:column;
	gap:12px}
.cta-right .btn-primary{
	justify-content:center;
	text-align:center;
	padding:17px}
.cta-tel{
	display:flex;
	align-items:center;
	justify-content:center;
	gap:9px;
	background:rgba(255,255,255,.06);
	border:1px solid rgba(255,255,255,.12);
	padding:14px;
	text-decoration:none;
	font-size:13px;
	font-weight:600;
	color:rgba(255,255,255,.6);
	transition:background .15s}
.cta-tel:hover{
	background:rgba(255,255,255,.1);
	color:#fff}
.cta-tel svg{
	stroke:var(--nv-primary-accent)}
@media(max-width:768px){
	.cta-inner{
		grid-template-columns:1fr;
		gap:36px}
	.cta-right .btn-primary,.cta-tel{
		width:100%}
	.cta-dark{
		padding:56px 0}
}
/* end */