/* ====== Offerten Portal Theme ====== */

*, *::before, *::after { box-sizing: border-box; }
body {
	margin: 0;
	font-family: 'Inter', system-ui, -apple-system, sans-serif;
	color: var(--ot-text);
	background: var(--ot-bg);
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4 { font-family: 'Plus Jakarta Sans', system-ui, sans-serif; color: var(--ot-blue); line-height: 1.2; }
a { color: var(--ot-orange-dark); }
img { max-width: 100%; height: auto; }

.ot-container { max-width: var(--ot-container); margin: 0 auto; padding: 0 20px; }
.ot-skip { position: absolute; left: -9999px; }
.ot-skip:focus { left: 12px; top: 12px; background: #fff; padding: 8px 14px; z-index: 999; border-radius: 8px; }

.ot-notice { background: #fff6ef; border: 1px dashed var(--ot-orange); color: var(--ot-orange-dark); padding: 12px 16px; border-radius: 8px; }

/* Buttons */
.ot-btn {
	display: inline-block; text-decoration: none; font-weight: 700;
	padding: 12px 22px; border-radius: 10px; border: none; cursor: pointer;
	font-size: 1rem; transition: background .15s, transform .05s; font-family: inherit;
}
.ot-btn--cta { background: var(--ot-orange); color: #fff; }
.ot-btn--cta:hover { background: var(--ot-orange-dark); color: #fff; }
.ot-btn--cta:active { transform: translateY(1px); }
.ot-btn--lg { padding: 15px 30px; font-size: 1.1rem; }

/* Topbar */
.ot-topbar { background: var(--ot-blue-dark); color: #cdd8e8; font-size: .85rem; }
.ot-topbar__inner { display: flex; justify-content: space-between; align-items: center; height: 38px; }
.ot-topbar__right { display: flex; align-items: center; gap: 12px; }
.ot-topbar__phone { color: #fff; text-decoration: none; font-weight: 600; }
.ot-topbar__sep { color: #4a5f80; }
.ot-topbar__link { color: #cdd8e8; text-decoration: none; font-weight: 500; }
.ot-topbar__link:hover { color: #fff; }

/* Nav actions */
.ot-nav__actions { display: flex; align-items: center; gap: 12px; }
.ot-nav__login { color: var(--ot-blue); text-decoration: none; font-weight: 600; font-size: .95rem; }
.ot-nav__login:hover { color: var(--ot-orange-dark); }
.ot-btn--outline { background: transparent; color: var(--ot-blue); border: 1.5px solid var(--ot-blue); padding: 10px 18px; }
.ot-btn--outline:hover { background: var(--ot-blue); color: #fff; }

/* Header */
.ot-header { background: #fff; border-bottom: 1px solid var(--ot-line); position: sticky; top: 0; z-index: 50; }
.ot-header__inner { display: flex; align-items: center; justify-content: space-between; height: 74px; gap: 20px; }
.ot-brand__text { font-family: 'Plus Jakarta Sans'; font-weight: 800; font-size: 1.5rem; color: var(--ot-blue); text-decoration: none; }
.custom-logo { max-height: 52px; width: auto; }

.ot-nav { display: flex; align-items: center; gap: 26px; }
.ot-menu { display: flex; gap: 22px; list-style: none; margin: 0; padding: 0; align-items: center; }
.ot-menu a { color: var(--ot-blue); text-decoration: none; font-weight: 600; font-size: .98rem; }
.ot-menu a:hover { color: var(--ot-orange-dark); }
.ot-menu .sub-menu { display: none; }

.ot-burger { display: none; background: none; border: none; flex-direction: column; gap: 5px; cursor: pointer; padding: 8px; }
.ot-burger span { width: 24px; height: 2px; background: var(--ot-blue); border-radius: 2px; transition: .2s; }

/* Hero */
.ot-hero { background: linear-gradient(160deg, var(--ot-blue) 0%, var(--ot-blue-dark) 100%); color: #fff; padding: 56px 0 64px; }
.ot-hero__inner { display: grid; grid-template-columns: 1.05fr .95fr; gap: 48px; align-items: center; }
.ot-hero__title { color: #fff; font-size: 2.6rem; font-weight: 800; margin: 0 0 16px; }
.ot-hero__sub { font-size: 1.15rem; color: #d7e2f2; margin: 0 0 24px; }
.ot-usps { list-style: none; padding: 0; margin: 0 0 28px; display: grid; gap: 10px; }
.ot-usps li { position: relative; padding-left: 30px; color: #eaf1fb; }
.ot-usps li::before { content: '✓'; position: absolute; left: 0; top: 0; width: 20px; height: 20px; background: var(--ot-orange); color: #fff; border-radius: 50%; font-size: .75rem; display: grid; place-items: center; font-weight: 700; }

.ot-hero__panel { background: #fff; border-radius: 16px; padding: 26px; box-shadow: 0 20px 50px rgba(0,0,0,.25); }
.ot-hero__panel-title { font-size: 1.2rem; margin: 0 0 16px; }
.ot-hero__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.ot-hero__tile { display: flex; align-items: center; gap: 10px; padding: 12px; border: 1.5px solid var(--ot-line); border-radius: 10px; text-decoration: none; color: var(--ot-text); font-weight: 600; font-size: .9rem; transition: border-color .15s, background .15s; }
.ot-hero__tile:hover { border-color: var(--ot-orange); background: #fff6ef; }
.ot-hero__tile-ico { font-size: 1.4rem; }
.ot-hero__all { display: inline-block; margin-top: 16px; font-weight: 700; text-decoration: none; color: var(--ot-orange-dark); }

/* Sections */
.ot-section__title { text-align: center; font-size: 1.9rem; margin: 0 0 36px; }
.ot-advantages { padding: 64px 0; }
.ot-advantages__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.ot-advantage { text-align: center; padding: 30px 24px; border: 1px solid var(--ot-line); border-radius: var(--ot-radius); background: #fff; transition: box-shadow .2s, transform .15s; }
.ot-advantage:hover { box-shadow: var(--ot-shadow); transform: translateY(-3px); }
.ot-advantage__ico { width: 58px; height: 58px; margin: 0 auto 16px; background: var(--ot-soft); color: var(--ot-orange); border-radius: 14px; display: grid; place-items: center; font-size: 1.6rem; font-weight: 800; }
.ot-advantage h3 { margin: 0 0 8px; font-size: 1.2rem; }
.ot-advantage p { margin: 0; color: var(--ot-muted); }

/* Steps */
.ot-steps { padding: 40px 0 64px; background: var(--ot-soft); }
.ot-steps__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.ot-step { background: #fff; border-radius: var(--ot-radius); padding: 28px 24px; text-align: center; }
.ot-step__no { display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--ot-blue); color: #fff; font-weight: 800; font-size: 1.2rem; margin-bottom: 14px; }
.ot-step h3 { margin: 0 0 6px; font-size: 1.15rem; }
.ot-step p { margin: 0; color: var(--ot-muted); }

/* Gewerke grid */
.ot-gewerke-section { padding: 64px 0; }
.ot-gewerke-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; }
.ot-gewerk-card { display: flex; align-items: center; gap: 12px; padding: 16px 18px; border: 1px solid var(--ot-line); border-radius: 10px; text-decoration: none; color: var(--ot-blue); font-weight: 600; transition: border-color .15s, box-shadow .15s; }
.ot-gewerk-card:hover { border-color: var(--ot-orange); box-shadow: var(--ot-shadow); }
.ot-gewerk-card__ico { font-size: 1.5rem; }
.ot-gewerk-card__name { flex: 1; }
.ot-gewerk-card__arrow { color: var(--ot-orange); font-weight: 700; }

/* Trust */
.ot-trust { background: var(--ot-blue); color: #fff; padding: 46px 0; }
.ot-trust__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; text-align: center; }
.ot-trust__item strong { display: block; font-size: 2.2rem; font-family: 'Plus Jakarta Sans'; font-weight: 800; color: #fff; }
.ot-trust__item span { color: #cfdaec; font-size: .95rem; }

/* CTA band */
.ot-cta-band { background: var(--ot-orange); color: #fff; padding: 44px 0; }
.ot-cta-band__inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.ot-cta-band h2 { color: #fff; margin: 0 0 6px; font-size: 1.7rem; }
.ot-cta-band p { margin: 0; color: #ffe9d8; }
.ot-cta-band .ot-btn--cta { background: #fff; color: var(--ot-orange-dark); }
.ot-cta-band .ot-btn--cta:hover { background: var(--ot-blue-dark); color: #fff; }

/* Landingpage */
.ot-lp-hero { background: var(--ot-soft); padding: 40px 0; border-bottom: 1px solid var(--ot-line); }
.ot-lp-hero__title { font-size: 2rem; margin: 8px 0 10px; }
.ot-lp-hero__sub { color: var(--ot-muted); margin: 0; max-width: 720px; }
.ot-breadcrumb { font-size: .85rem; color: var(--ot-muted); }
.ot-breadcrumb a { color: var(--ot-muted); text-decoration: none; }
.ot-breadcrumb a:hover { color: var(--ot-orange-dark); }

.ot-lp-body { padding: 44px 0 60px; }
.ot-lp-grid { display: grid; grid-template-columns: 1fr 420px; gap: 40px; align-items: start; }
.ot-lp-side { position: sticky; top: 90px; }
.ot-lp-formbox { background: #fff; border: 1px solid var(--ot-line); border-radius: var(--ot-radius); padding: 24px; box-shadow: var(--ot-shadow); }
.ot-lp-formbox__title { margin: 0 0 16px; font-size: 1.3rem; }

/* Firmen */
.ot-firmen-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 18px; }
.ot-firma-card { border: 1px solid var(--ot-line); border-radius: var(--ot-radius); padding: 20px; background: #fff; transition: box-shadow .15s; }
.ot-firma-card:hover { box-shadow: var(--ot-shadow); }
.ot-firma-card__logo img { border-radius: 8px; margin-bottom: 12px; }
.ot-firma-card__name { margin: 0 0 6px; font-size: 1.1rem; }
.ot-firma-card__name a { color: var(--ot-blue); text-decoration: none; }
.ot-firma-card__meta { margin: 0 0 6px; color: var(--ot-muted); font-size: .9rem; }
.ot-firma-card__tel { color: var(--ot-orange-dark); text-decoration: none; font-weight: 600; }
.ot-firma-single__logo { max-width: 260px; margin-bottom: 20px; }

.ot-tag { display: inline-block; background: var(--ot-soft); color: var(--ot-blue); padding: 5px 12px; border-radius: 99px; text-decoration: none; font-size: .85rem; font-weight: 600; margin: 0 6px 6px 0; }
.ot-tag:hover { background: var(--ot-orange); color: #fff; }
.ot-filter-tags, .ot-firma-tags { margin: 0 0 28px; }
.ot-contact-list { list-style: none; padding: 0; margin: 0 0 18px; display: grid; gap: 10px; }
.ot-contact-list a { color: var(--ot-orange-dark); text-decoration: none; }

/* Prose / single */
.ot-single { padding: 44px 0 60px; }
.ot-single__narrow { max-width: 800px; }
.ot-single__title { font-size: 2.1rem; margin: 10px 0 10px; }
.ot-single__meta { color: var(--ot-muted); font-size: .9rem; }
.ot-single__thumb { margin: 20px 0; border-radius: var(--ot-radius); overflow: hidden; }
.ot-prose { font-size: 1.05rem; }
.ot-prose h2 { font-size: 1.5rem; margin: 32px 0 12px; }
.ot-prose h3 { font-size: 1.25rem; margin: 24px 0 10px; }
.ot-prose img { border-radius: var(--ot-radius); }
.ot-page-content { padding: 40px 0; }

/* Post grid */
.ot-post-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 24px; }
.ot-post-card { border: 1px solid var(--ot-line); border-radius: var(--ot-radius); overflow: hidden; background: #fff; transition: box-shadow .15s, transform .15s; }
.ot-post-card:hover { box-shadow: var(--ot-shadow); transform: translateY(-3px); }
.ot-post-card__thumb img { width: 100%; height: 190px; object-fit: cover; display: block; }
.ot-post-card__body { padding: 20px; }
.ot-post-card__title { font-size: 1.2rem; margin: 0 0 8px; }
.ot-post-card__title a { color: var(--ot-blue); text-decoration: none; }
.ot-post-card__excerpt { color: var(--ot-muted); margin: 0 0 12px; }
.ot-post-card__more { font-weight: 700; text-decoration: none; }

/* Search */
.ot-search { display: flex; gap: 8px; }
.ot-search__field { flex: 1; padding: 11px 14px; border: 1.5px solid var(--ot-line); border-radius: 10px; }
.ot-search__btn { background: var(--ot-blue); color: #fff; border: none; padding: 0 18px; border-radius: 10px; cursor: pointer; font-weight: 600; }

/* Pagination */
.pagination, .nav-links { display: flex; gap: 8px; justify-content: center; margin-top: 36px; flex-wrap: wrap; }
.page-numbers { padding: 9px 14px; border: 1px solid var(--ot-line); border-radius: 8px; text-decoration: none; color: var(--ot-blue); }
.page-numbers.current { background: var(--ot-blue); color: #fff; border-color: var(--ot-blue); }

/* Footer */
.ot-footer { background: var(--ot-blue-dark); color: #b9c6da; padding: 54px 0 0; margin-top: 0; }
.ot-footer__cols { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 32px; padding-bottom: 40px; }
.ot-footer__brand strong { color: #fff; font-size: 1.3rem; font-family: 'Plus Jakarta Sans'; }
.ot-footer__brand p { color: #98a8c0; }
.ot-footer__phone a { color: #fff; text-decoration: none; font-weight: 600; }
.ot-widget__title, .ot-footer h4 { color: #fff; font-size: 1rem; margin: 0 0 14px; }
.ot-footer ul, .ot-footer__menu { list-style: none; padding: 0; margin: 0; display: grid; gap: 9px; }
.ot-footer a { color: #b9c6da; text-decoration: none; }
.ot-footer a:hover { color: #fff; }
.ot-footer__bottom { border-top: 1px solid rgba(255,255,255,.1); padding: 18px 0; font-size: .85rem; color: #8394ad; }

/* Mobile */
@media (max-width: 900px) {
	.ot-hero__inner { grid-template-columns: 1fr; gap: 32px; }
	.ot-hero__title { font-size: 2.1rem; }
	.ot-advantages__grid, .ot-steps__grid { grid-template-columns: 1fr; }
	.ot-trust__grid { grid-template-columns: repeat(2, 1fr); gap: 28px; }
	.ot-lp-grid { grid-template-columns: 1fr; }
	.ot-lp-side { position: static; }
	.ot-footer__cols { grid-template-columns: 1fr 1fr; }

	.ot-burger { display: flex; }
	.ot-nav {
		position: fixed; inset: 74px 0 auto 0; background: #fff; flex-direction: column;
		align-items: stretch; gap: 0; padding: 12px 20px 20px; border-bottom: 1px solid var(--ot-line);
		box-shadow: 0 12px 30px rgba(0,0,0,.12); display: none;
	}
	.ot-nav.is-open { display: flex; }
	.ot-menu { flex-direction: column; align-items: stretch; gap: 0; }
	.ot-menu li { border-bottom: 1px solid var(--ot-line); }
	.ot-menu a { display: block; padding: 14px 0; }
	.ot-nav__actions { flex-direction: column; align-items: stretch; gap: 10px; margin-top: 14px; width: 100%; }
	.ot-nav__actions .ot-btn { text-align: center; }
	.ot-nav__login { padding: 6px 0; }
	.ot-nav__cta { margin-top: 0; text-align: center; }
}
@media (max-width: 520px) {
	.ot-hero__grid { grid-template-columns: 1fr; }
	.ot-footer__cols { grid-template-columns: 1fr; }
	.ot-cta-band__inner { flex-direction: column; text-align: center; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
	* { transition: none !important; animation: none !important; }
}

/* Regionen-Sektion */
.ot-regionen-section { padding: 56px 0; background: var(--ot-soft); }
.ot-region-chips { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.ot-region-chip { background: #fff; border: 1px solid var(--ot-line); color: var(--ot-blue); padding: 9px 18px; border-radius: 99px; text-decoration: none; font-weight: 600; transition: background .15s, color .15s, border-color .15s; }
.ot-region-chip:hover { background: var(--ot-orange); color: #fff; border-color: var(--ot-orange); }

/* ===== Firmenprofil ===== */
.ot-firma-hero__inner { display: flex; align-items: center; gap: 24px; margin-top: 14px; flex-wrap: wrap; }
.ot-firma-hero__logo img { width: 110px; height: 110px; object-fit: cover; border-radius: 14px; border: 1px solid var(--ot-line); background: #fff; }
.ot-firma-hero__name { margin: 0 0 6px; font-size: 2rem; }
.ot-firma-hero__rating { display: flex; align-items: center; gap: 8px; color: var(--ot-muted); font-size: .95rem; margin-bottom: 6px; }
.ot-firma-hero__meta { color: var(--ot-muted); margin: 0 0 10px; }
.ot-firma-hero__badges { display: flex; flex-wrap: wrap; gap: 8px; }
.ot-badge-verif { background: #eaf7ee; color: #15803d; border: 1px solid #bbe6c8; font-size: .8rem; font-weight: 600; padding: 4px 10px; border-radius: 99px; }

.ot-firma-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 14px; margin: 8px 0 28px; }
.ot-firma-facts > div { background: var(--ot-soft); border-radius: 10px; padding: 14px 16px; display: flex; flex-direction: column; gap: 2px; }
.ot-firma-facts span { color: var(--ot-muted); font-size: .8rem; }
.ot-firma-facts strong { color: var(--ot-blue); font-size: 1.05rem; }

.ot-firma-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 10px; margin-bottom: 12px; }
.ot-firma-gallery img { width: 100%; height: 130px; object-fit: cover; border-radius: 10px; display: block; }
.ot-firma-side-hint { background: #eef8f0; border: 1px solid #16a34a; color: #14532d; padding: 10px 12px; border-radius: 8px; font-size: .88rem; font-weight: 600; margin: 0 0 14px; }
.ot-contactbox { margin-top: 18px; }

/* Sterne (falls Plugin-CSS nicht greift) */
.op-stars { display: inline-flex; gap: 1px; }
.op-star { color: #d8dde5; }
.op-star.is-on { color: #f5a623; }

.ot-verzeichnis-filter { margin-bottom: 26px; }
.ot-verzeichnis-filter strong { display: block; margin-bottom: 10px; color: var(--ot-blue); }

/* Konto-Links Feinschliff */
.op-account__links { margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--ot-line); }
.op-account__links .op-btn { margin: 4px 4px 4px 0; }
.op-account__lost { font-size: .9rem; margin-top: 12px; }
@media (max-width: 600px) { .ot-topbar__claim { display: none; } }