/* biotask – Joomla 6 site template
 * Angelehnt an das frühere YOOtheme "Sync" (Stil "green"), modernisiert & responsiv.
 */

:root {
	--green: #207c57;
	--green-light: #238960;
	--green-dark: #1c6f4e;
	--green-border: #1b694a;
	--leaf: #8dc059;
	--accent: #c2187e;           /* Magenta aus dem Limbach-Logo */
	--text: #444;
	--text-muted: #777;
	--heading: #555;
	--headline: #999;
	--box-bg: #fafafa;
	--box-border: #dcdcdc;
	--page-bg: #f4f4f4;
	--radius: 6px;
	--shadow: 0 1px 2px rgba(0, 0, 0, .06), 0 2px 8px rgba(0, 0, 0, .04);
	--font: "Trebuchet MS", "Segoe UI", system-ui, -apple-system, Helvetica, Arial, sans-serif;
	--wrap: 1040px;
}

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
	margin: 0;
	font: 15px/1.6 var(--font);
	color: var(--text);
	/* dezentes Karomuster wie früher ("light squares") */
	background-color: var(--page-bg);
	background-image:
		linear-gradient(rgba(0, 0, 0, .025) 1px, transparent 1px),
		linear-gradient(90deg, rgba(0, 0, 0, .025) 1px, transparent 1px);
	background-size: 4px 4px;
}

img { max-width: 100%; height: auto; }

a { color: var(--green); text-decoration: none; transition: color .15s; }
a:hover, a:focus-visible { color: var(--accent); text-decoration: underline; }
:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; }

::selection { background: var(--green); color: #fff; }

h1, h2, h3, h4 { color: var(--heading); font-weight: normal; line-height: 1.25; margin: 1.2em 0 .5em; }
h1 { font-size: 1.75rem; }
h2 { font-size: 1.35rem; }
h3 { font-size: 1.15rem; }

hr { border: 0; border-top: 1px solid var(--box-border); margin: 1.5em 0; }

.skip-link { position: absolute; left: -9999px; top: 0; background: var(--green); color: #fff; padding: .5em 1em; z-index: 100; }
.skip-link:focus { left: 1rem; }

.wrapper { max-width: var(--wrap); margin: 0 auto; padding: 0 16px 24px; }

/* ------------------------------------------------------------ Header */
.header-top {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem 1.5rem;
	padding: 16px 4px;
}
.logo { display: block; flex: 0 1 434px; line-height: 0; }
.logo img { width: 100%; max-width: 434px; height: auto; }

.toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem 1rem; font-size: .8rem; color: var(--text-muted); }

/* Menüs als Zeile (Toolbar / Footer) */
.toolbar ul, .site-footer ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; }
.toolbar li + li, .site-footer li + li { border-left: 1px solid #ddd; }
.toolbar li a { padding: 0 .55em; }
.toolbar li:first-child a { padding-left: 0; }

/* ------------------------------------------------------------ Menubar */
.menubar {
	position: relative;
	display: flex; align-items: stretch; justify-content: space-between; gap: 1rem;
	background: linear-gradient(#fff, #efefef);
	border: 1px solid var(--box-border);
	border-radius: var(--radius);
	box-shadow: var(--shadow);
	min-height: 52px;
}

.menubar { z-index: 10; }
.mainnav ul { list-style: none; margin: 0; padding: 0; }
.mainnav > ul { display: flex; height: 100%; }
.mainnav > ul > li { position: relative; display: flex; align-items: stretch; border-right: 1px solid #e2e2e2; }
.mainnav > ul > li:first-child { border-radius: var(--radius) 0 0 var(--radius); }
.mainnav > ul > li > a,
.mainnav > ul > li > span {
	display: flex; align-items: center;
	padding: 0 1.05rem; color: #444; font-size: 1rem; text-decoration: none;
}
.mainnav > ul > li:hover { background: rgba(255, 255, 255, .7); }
.mainnav > ul > li:hover > a { color: var(--green); text-decoration: none; }
.mainnav > ul > li.active,
.mainnav > ul > li.current {
	background: linear-gradient(var(--green-light), var(--green-dark));
	box-shadow: inset 0 0 0 1px var(--green-border), inset 1px 0 0 2px rgba(141, 192, 89, .35);
}
.mainnav > ul > li.active > a,
.mainnav > ul > li.active > .mod-menu__toggle-sub,
.mainnav > ul > li.active:hover > a { color: #fff; }

/* Aufklapp-Button, den Joomla 6 bei Menüpunkten mit Unterseiten ausgibt */
.mainnav .mod-menu__toggle-sub {
	display: flex; align-items: center; margin-left: -.55rem; padding: 0 .8rem 0 .2rem;
	border: 0; background: none; color: #888; cursor: pointer; font: inherit;
}
.mainnav .mod-menu__toggle-sub .icon-chevron-down {
	display: block; width: .45em; height: .45em; margin: -.2em 0 0;
	border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
	transform: rotate(45deg); transition: transform .2s;
}
.mainnav .mod-menu__toggle-sub[aria-expanded="true"] .icon-chevron-down { transform: translateY(.2em) rotate(-135deg); }

/* Dropdowns – Joomlas menu.js setzt aria-hidden; sichtbar über Hover, Tastatur oder Button */
.mainnav .mod-menu__sub,
.mainnav .mod-menu__sub[aria-hidden="true"] {
	display: block;
	position: absolute; left: -1px; top: 100%; z-index: 20;
	min-width: 250px; padding: 6px;
	background: #fff; border: 1px solid var(--box-border); border-radius: 0 0 var(--radius) var(--radius);
	box-shadow: 0 8px 20px rgba(0, 0, 0, .1);
	opacity: 0; visibility: hidden; transform: translateY(4px);
	transition: opacity .15s, transform .15s, visibility .15s;
}
.mainnav li:hover > .mod-menu__sub,
.mainnav li:focus-within > .mod-menu__sub:not([aria-hidden="true"]),
.mainnav .mod-menu__sub[aria-hidden="false"] { opacity: 1; visibility: visible; transform: none; }
.mainnav .mod-menu__sub a {
	display: block; padding: .5rem .75rem; border-radius: 4px; color: #444; font-size: .93rem;
}
.mainnav .mod-menu__sub a:hover { background: #f2f7f4; color: var(--green); text-decoration: none; }
.mainnav .mod-menu__sub .current > a { background: linear-gradient(var(--green-light), var(--green-dark)); color: #fff; }

/* Suche */
.search { display: flex; align-items: center; padding: 0 10px; }
.search form { margin: 0; }
.search label { position: absolute; left: -9999px; }
.search .input-group { display: flex; }
.search input[type="search"], .search input[type="text"] {
	width: 190px; padding: .4rem .7rem .4rem 2rem;
	border: 1px solid #ccc; border-radius: 4px; font: inherit; font-size: .9rem; color: #555;
	background: #fff url("../images/search.svg") no-repeat .6rem center / 14px;
	box-shadow: inset 0 1px 2px rgba(0, 0, 0, .06);
}
.search input:focus { border-color: var(--green); outline: none; box-shadow: 0 0 0 3px rgba(32, 124, 87, .15); }
.search button, .search .btn { display: none; }

/* Mobile Navigation */
.nav-toggle {
	display: none; align-items: center; gap: .6rem;
	padding: 0 1rem; border: 0; background: none; font: inherit; color: #444; cursor: pointer;
}
.nav-toggle-icon, .nav-toggle-icon::before, .nav-toggle-icon::after {
	display: block; width: 20px; height: 2px; background: currentColor; border-radius: 1px; position: relative; transition: transform .2s;
}
.nav-toggle-icon::before, .nav-toggle-icon::after { content: ""; position: absolute; left: 0; }
.nav-toggle-icon::before { top: -6px; }
.nav-toggle-icon::after { top: 6px; }
.nav-toggle[aria-expanded="true"] .nav-toggle-icon { background: transparent; }
.nav-toggle[aria-expanded="true"] .nav-toggle-icon::before { transform: translateY(6px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] .nav-toggle-icon::after { transform: translateY(-6px) rotate(-45deg); }

@media (max-width: 860px) {
	.menubar { flex-wrap: wrap; }
	.nav-toggle { display: flex; min-height: 50px; }
	.search { flex: 1; justify-content: flex-end; }
	.search input[type="search"], .search input[type="text"] { width: 100%; max-width: 220px; }
	.mainnav { display: none; flex-basis: 100%; order: 3; border-top: 1px solid var(--box-border); }
	.mainnav.is-open { display: block; }
	.mainnav > ul { flex-direction: column; }
	.mainnav > ul > li { display: block; border-right: 0; border-bottom: 1px solid #e8e8e8; border-radius: 0 !important; }
	.mainnav > ul > li:last-child { border-bottom: 0; }
	.mainnav > ul > li > a { padding: .8rem 1rem; }
	.mainnav .mod-menu__toggle-sub { display: none; }
	/* Unterpunkte auf dem Handy immer ausgeklappt */
	.mainnav .mod-menu__sub,
	.mainnav .mod-menu__sub[aria-hidden="true"] {
		position: static; opacity: 1; visibility: visible; transform: none;
		border: 0; box-shadow: none; padding: 0 0 .4rem 1rem; min-width: 0; background: transparent;
	}
	.mainnav > ul > li.active .mod-menu__sub a { color: #fff; }
	.mainnav > ul > li.active .mod-menu__sub a:hover { background: rgba(255, 255, 255, .15); }
}

/* ------------------------------------------------------------ Slideshow (top-a) */
.top-a { margin-top: 20px; }
.bt-slideshow {
	position: relative; overflow: hidden;
	border-radius: var(--radius); box-shadow: var(--shadow); background: #ddd;
	aspect-ratio: 880 / 296;
}
.bt-slideshow .slide {
	position: absolute; inset: 0; margin: 0;
	opacity: 0; transition: opacity .9s ease;
}
.bt-slideshow .slide.is-active { opacity: 1; }
.bt-slideshow .slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bt-slideshow .slide-btn {
	position: absolute; top: 50%; translate: 0 -50%;
	width: 36px; height: 36px; border: 0; border-radius: 50%;
	background: rgba(255, 255, 255, .8); color: #555; font-size: 20px; line-height: 1; cursor: pointer;
	opacity: 0; transition: opacity .2s;
}
.bt-slideshow:hover .slide-btn, .bt-slideshow .slide-btn:focus-visible { opacity: 1; }
.bt-slideshow .prev { left: 12px; }
.bt-slideshow .next { right: 12px; }
.bt-slideshow .dots { position: absolute; right: 14px; bottom: 12px; display: flex; gap: 8px; margin: 0; padding: 0; list-style: none; }
.bt-slideshow .dots button {
	width: 14px; height: 14px; padding: 0; border: 1px solid rgba(0, 0, 0, .2); border-radius: 3px;
	background: rgba(255, 255, 255, .6); cursor: pointer;
}
.bt-slideshow .dots button[aria-current="true"] { background: #fff; }
@media (prefers-reduced-motion: reduce) { .bt-slideshow .slide { transition: none; } }

/* ------------------------------------------------------------ Headlines & Teaser (top-b / innertop) */
.bt-headline {
	text-align: center; color: var(--headline); font-size: clamp(1.35rem, 3.2vw, 2rem);
	font-weight: normal; margin: 1.3em 0 .6em;
}
.bt-teasers {
	display: grid; grid-template-columns: repeat(3, 1fr);
	background: linear-gradient(#fff, var(--box-bg));
	border: 1px solid var(--box-border); border-radius: var(--radius); box-shadow: var(--shadow);
}
.bt-teaser { padding: 20px 20px 22px; text-align: center; }
.bt-teaser + .bt-teaser { border-left: 1px solid var(--box-border); }
.bt-teaser h2 { margin: 0 0 .7rem; font-size: 1.3rem; color: var(--heading); }
.bt-teaser img { display: block; margin: 0 auto; width: 100%; max-width: 250px; border-radius: 6px; }
@media (max-width: 640px) {
	.bt-teasers { grid-template-columns: 1fr; }
	.bt-teaser + .bt-teaser { border-left: 0; border-top: 1px solid var(--box-border); }
}

/* ------------------------------------------------------------ Content */
.breadcrumbs-wrap { margin: 18px 4px -6px; font-size: .85rem; color: var(--text-muted); }
.breadcrumbs-wrap ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; }
.breadcrumbs-wrap li:not(:last-child)::after { content: "›"; margin: 0 .5em; color: #aaa; }
.breadcrumbs-wrap .divider, .breadcrumbs-wrap .icon-location, .breadcrumbs-wrap .float-start { display: none; }

.main-grid { display: grid; grid-template-columns: 1fr; gap: 20px; margin-top: 20px; }
.has-sidebar .main-grid { grid-template-columns: minmax(0, 1fr) 260px; }
@media (max-width: 860px) { .has-sidebar .main-grid { grid-template-columns: 1fr; } }

.content-box, .sidebar .card {
	background: linear-gradient(#fff, var(--box-bg));
	border: 1px solid var(--box-border); border-radius: var(--radius); box-shadow: var(--shadow);
	padding: 22px 28px 26px;
	min-width: 0;
}
@media (max-width: 640px) { .content-box { padding: 18px 16px 20px; } }
.content-box > :first-child, .content-box .item-page > :first-child { margin-top: 0; }
.content-box .page-header h1, .content-box .page-header h2 { margin-top: 0; font-size: 1.6rem; color: var(--heading); }
.content-box .page-header { margin-bottom: .8em; }

.content-box table { border-collapse: collapse; max-width: 100%; }
.content-box ul { padding-left: 1.3em; }
.content-box li { margin: .25em 0; }

/* Startseite: Haken-Liste */
.bt-checklist { list-style: none; padding: 0 !important; margin: 0; }
.bt-checklist li { position: relative; padding-left: 2rem; margin: .9em 0; }
.bt-checklist li::before {
	content: ""; position: absolute; left: 0; top: .2em; width: 1.2rem; height: 1.2rem; border-radius: 50%;
	background: var(--green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.5l2.5 2.5L12 5.5' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 80% no-repeat;
}

/* Layout-Helfer für Inhalte */
.bt-center { text-align: center; }
.bt-float-right { float: right; margin: 0 0 20px 24px; border-radius: var(--radius); max-width: 45%; }
@media (max-width: 640px) { .bt-float-right { float: none; display: block; margin: 0 auto 1rem; max-width: 100%; } }

.bt-split { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1.5rem 2rem; align-items: start; margin: 1rem 0; }
.bt-split--media-left { grid-template-columns: auto minmax(0, 1fr); }
.bt-split-media { display: flex; flex-direction: column; gap: 1rem; align-items: center; }
.bt-split-media img { border-radius: var(--radius); }
@media (max-width: 700px) {
	.bt-split, .bt-split--media-left { grid-template-columns: 1fr; }
	.bt-split-media { flex-direction: row; flex-wrap: wrap; justify-content: center; }
}

.bt-button {
	display: inline-block; padding: .55rem 1.1rem; border-radius: 4px;
	background: linear-gradient(var(--green-light), var(--green-dark)); color: #fff !important;
	border: 1px solid var(--green-border); text-decoration: none !important;
}
.bt-button:hover { filter: brightness(1.08); }

.bt-downloads { padding-left: 1.3em; }
.bt-downloads li { margin: .9em 0; }

/* Team */
.bt-team { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 16px; margin: 1rem 0; }
.bt-person {
	display: flex; gap: 14px; align-items: center;
	padding: 12px; background: #fff; border: 1px solid #e6e6e6; border-radius: var(--radius);
	font-size: .93rem; line-height: 1.5;
}
.bt-person img { width: 100px; height: 120px; object-fit: cover; border-radius: 4px; flex-shrink: 0; }
.bt-person a { word-break: break-word; }

/* Publikationen */
.bt-pubhead { display: flex; align-items: center; gap: 1rem; }
.bt-pubhead img { width: 40px; }

/* Anfahrt-Akkordeon */
.bt-accordion { border: 1px solid #e3e3e3; border-radius: var(--radius); background: #fff; margin: .5rem 0; }
.bt-accordion summary {
	cursor: pointer; padding: .7rem 1rem; font-size: 1.05rem; color: var(--heading); list-style: none;
	display: flex; justify-content: space-between; align-items: center;
}
.bt-accordion summary::-webkit-details-marker { display: none; }
.bt-accordion summary::after { content: "+"; font-size: 1.3rem; color: var(--green); transition: transform .2s; }
.bt-accordion[open] summary::after { transform: rotate(45deg); }
.bt-accordion[open] summary { border-bottom: 1px solid #eee; color: var(--green); }
.bt-accordion p { margin: 0; padding: .8rem 1rem 1rem; }

/* Joomla-Systemelemente */
.visually-hidden, .sr-only { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.article-info, .icons { display: none; }
#system-message-container joomla-alert, #system-message-container .alert {
	display: block; padding: .8rem 1rem; margin-bottom: 1rem; border-radius: var(--radius); background: #eef6f1; border: 1px solid #cfe5d8;
}

/* Suchergebnisse (Smart Search) */
.com-finder .result__item { margin: 1rem 0; padding-bottom: 1rem; border-bottom: 1px solid #eee; list-style: none; }
.com-finder .search-results { padding: 0; }
.com-finder input[type="text"], .com-finder input[type="search"] { padding: .45rem .7rem; border: 1px solid #ccc; border-radius: 4px; font: inherit; }
.com-finder button, .com-finder .btn { padding: .45rem .9rem; border-radius: 4px; border: 1px solid var(--green-border); background: var(--green); color: #fff; font: inherit; cursor: pointer; }
.com-finder .result__taxonomy, .com-finder .result__date { display: none; }

/* ------------------------------------------------------------ Footer */
.site-footer { position: relative; text-align: center; padding: 22px 50px 8px; font-size: .95rem; }
.site-footer ul { justify-content: center; }
.site-footer li a { padding: 0 .6em; }
.site-footer .copyright { margin: .6rem 0 0; font-size: .8rem; color: #999; }
.totop {
	position: absolute; right: 0; top: 20px; width: 28px; height: 28px; display: grid; place-items: center;
	border: 1px solid #ddd; border-radius: 4px; background: #fff; color: #999; font-size: .85rem;
}
.totop:hover { color: var(--green); text-decoration: none; }

/* Fehlerseite */
.error-page .main { margin-top: 24px; }

@media print {
	body { background: none; }
	.menubar, .toolbar, .top-a, .top-b, .search, .site-footer ul, .totop, .breadcrumbs-wrap { display: none !important; }
	.content-box { border: 0; box-shadow: none; padding: 0; }
}