/**
 * my-fish Theme: Bänder der Startseite nach Entwurf V11.
 * Wird nur auf der Startseite geladen. Werte kommen über die Kurznamen aus theme.css.
 */

.about__head { max-width:68ch;margin-bottom:var(--s-6); }
.about__head p { margin-top:var(--s-3); }
.about__grid { display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-5); }
.about__cell { background:var(--stone-50);border:var(--line);border-radius:var(--r-lg);padding:var(--s-5); }
.about__cell h3 { font-family:var(--font-display);font-weight:500;font-size:20px;line-height:26px;margin:0 0 var(--s-2); }
.about__cell p { margin:0; }
.about__cell .arrowlink { margin-top:var(--s-3); }
.media__cover { position:relative;border-radius:var(--r-md);overflow:hidden;background:var(--petrol-200);aspect-ratio:16/9;align-self:center;margin:0;box-shadow:var(--shadow-1); }
.media__cover img { width:100%;height:100%;object-fit:cover; }
.media__play { position:absolute;left:var(--s-3);bottom:var(--s-3); width:56px;height:56px;border-radius:var(--r-full);border:0;cursor:pointer; background:rgba(252,253,253,.94);color:var(--petrol-700);font-size:18px; display:flex;align-items:center;justify-content:center; box-shadow:0 4px 12px rgba(11,37,48,.28); }
.media__cover:hover .media__play,.media__play:hover { background:var(--paper); }
.media__copy { display:flex;flex-direction:column;gap:var(--s-2);align-items:flex-start; }
.media__copy a { text-decoration:none; }
.media__copy a:hover { text-decoration:underline;text-underline-offset:4px; }
.media__meta { display:flex;align-items:baseline;gap:var(--s-3);flex-wrap:wrap; }
.media__no { font-family:var(--font-display);font-weight:500;font-size:28px;line-height:35px;color:var(--petrol-700);font-variant-numeric:tabular-nums;margin:0; }
.media__date { font-size:15px;line-height:22px;color:var(--petrol-600);font-variant-numeric:tabular-nums;margin:0; }
.media__ep { display:grid;grid-template-columns:auto 1fr;gap:var(--s-3);align-items:baseline;padding-block:var(--s-2);border-bottom:1px solid var(--petrol-200);font-size:15px;line-height:22px;text-decoration:none; }
.media__ep:first-of-type { padding-top:0; }
.media__ep:hover span { text-decoration:underline;text-underline-offset:3px; }
.media__ep b { font-weight:600;font-variant-numeric:tabular-nums;color:var(--petrol-700); }
.platforms { display:flex;flex-wrap:wrap;gap:var(--s-2);margin-top:var(--s-2); }
.platforms a { display:inline-flex;align-items:center;font-size:15px;line-height:22px;font-weight:500; color:var(--petrol-700);text-decoration:none; border:1px solid var(--petrol-300);border-radius:var(--r-full);padding:var(--s-1) var(--s-3); background:var(--paper);transition:background 120ms linear; }
.platforms a:hover { background:var(--petrol-50);border-color:var(--petrol-500); }
.finder__go { display:inline-flex;align-items:center;justify-content:center;gap:var(--s-2);height:48px;padding-inline:var(--s-5); font-family:var(--font-text);font-size:16px;line-height:24px;font-weight:600; background:var(--paper);color:var(--petrol-700);border:0;border-radius:var(--r-md);cursor:pointer; transition:background 120ms linear; }
.finder__go:hover { background:var(--petrol-100); }
.mediabox { grid-column:span 6;background:var(--petrol-100);border-radius:var(--r-lg);padding:var(--s-6);display:flex;flex-direction:column;gap:var(--s-4); }
.mediabox .media__cover { align-self:stretch; }
.mediabox .media__copy { gap:var(--s-2); }
.mediabox__list { display:flex;flex-direction:column;padding-top:var(--s-3);border-top:1px solid var(--petrol-200);margin-top:auto; }
.mediabox__list .t-kicker { margin-bottom:var(--s-2); }
.mediabox__list .arrowlink { margin-top:var(--s-3); }
.finder-big { margin-top:var(--s-3);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s-2); }
.finder-big input { width:100%;font-family:var(--font-text);font-size:16px;line-height:24px;font-weight:300;color:var(--ink-950); height:56px;padding-left:var(--s-7);padding-right:var(--s-3);border:1px solid var(--stone-300);border-radius:var(--r-md);background:var(--paper); }
.finder-big input::placeholder { color:var(--petrol-600); }
.finder-big input:focus { outline:2px solid var(--petrol-500);outline-offset:1px; }
.finder-big label { position:relative;display:block; }
.finder-big label svg { position:absolute;left:var(--s-3);top:50%;transform:translateY(-50%);pointer-events:none; }
.finder-big .btn { height:56px;padding-inline:var(--s-5); }
.paths { background:var(--stone-50);padding-block:var(--s-9); }
.paths .band-head { margin-bottom:var(--s-7); }
.path { position:relative;overflow:hidden;grid-column:span 3;display:flex;flex-direction:column;gap:var(--s-3);padding:var(--s-5);border:var(--line);border-radius:var(--r-lg);background:var(--paper);box-shadow:var(--shadow-1);transition:transform 200ms var(--ease-out),box-shadow 120ms linear; }
.path__motiv { position:absolute;right:var(--s-3);top:var(--s-2);width:84px;height:84px;object-fit:contain;opacity:1;pointer-events:none;user-select:none; }
.path > *:not(.path__motiv) { position:relative;z-index:1; }
.path:hover { transform:translateY(-2px);box-shadow:var(--shadow-2); }
.path__no { font-family:var(--font-display);font-weight:500;font-size:36px;line-height:42px;color:var(--petrol-600);font-variant-numeric:tabular-nums;margin:0; }
.path h3 { margin:0; }
.path .arrowlink { margin-top:auto;padding-top:var(--s-3); }
.scroller { display:grid;grid-auto-flow:column;grid-auto-columns:392px;gap:var(--s-4);overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--pad-page);padding-bottom:var(--s-3);margin-inline:calc(-1 * var(--pad-page));padding-inline:var(--pad-page);scrollbar-width:none; }
.scroller::-webkit-scrollbar { display:none; }
.scroller > * { scroll-snap-align:start; }
.scroller .species .figure { height:200px; }
.scroller-foot { display:flex;align-items:center;gap:var(--s-4);margin-top:var(--s-5);padding-top:var(--s-4);border-top:var(--line); }
.scroller-foot .t-klein { margin:0; }
.scroller-foot .arrowlink { margin-left:auto; }
.scroller-nav { display:flex;gap:var(--s-2); }
.scroller-nav button { width:44px;height:44px;border-radius:var(--r-full);border:1px solid var(--stone-300);background:var(--paper);color:var(--petrol-700);cursor:pointer;font-size:18px;display:flex;align-items:center;justify-content:center; }
.scroller-nav button:hover { background:var(--petrol-50);border-color:var(--petrol-300); }
.layout { display:flex;flex-direction:column;gap:var(--s-2);text-decoration:none; }
.layout .figure { aspect-ratio:4/3;border-radius:var(--r-md); }
.layout .figure img { transition:transform 400ms var(--ease-out); }
.layout:hover .figure img { transform:scale(1.03); }
.layout p { margin:0; }
.layout:hover .t-zeile { text-decoration:underline;text-underline-offset:3px; }
.news-band { padding-top:var(--s-6); }
.cover { grid-column:1 / -1;display:grid;grid-template-columns:repeat(12,1fr);gap:var(--s-6);align-items:center; }
.cover__media { grid-column:span 7;margin:0;border-radius:var(--r-lg);overflow:hidden;background:var(--petrol-100);box-shadow:var(--shadow-2); }
.cover__media img { display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;transition:transform 500ms var(--ease-out); }
.cover:hover .cover__media img { transform:scale(1.03); }
.cover__copy { grid-column:span 5;display:flex;flex-direction:column;align-items:flex-start;gap:var(--s-3); }
.cover__copy h2 { margin:0; }
.cover__copy h2 a { text-decoration:none; }
.cover__copy h2 a:hover { text-decoration:underline;text-underline-offset:4px; }
.cover__copy .t-klein { max-width:46ch; }
.reihe2 { margin-top:var(--s-8);padding-top:var(--s-6);border-top:1px solid var(--petrol-300); }
.halb { grid-column:span 6;display:grid;grid-template-columns:296px minmax(0,1fr);gap:var(--s-4);align-items:center;text-decoration:none; }
.halb figure { margin:0;border-radius:var(--r-md);overflow:hidden;background:var(--petrol-100); }
.halb img { display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;transition:transform 500ms var(--ease-out); }
.halb:hover img { transform:scale(1.04); }
.halb__copy { display:flex;flex-direction:column;gap:var(--s-1); }
.halb h3 { font-family:var(--font-display);font-weight:500;font-size:24px;line-height:30px;margin:var(--s-1) 0 var(--s-1);text-wrap:balance; }
.halb:hover h3 { text-decoration:underline;text-underline-offset:4px; }
.halb p { margin:0; }
.newsfoot { display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);margin-top:var(--s-6);padding-top:var(--s-4);border-top:1px solid var(--petrol-300); }
.katalog__top { margin-bottom:var(--s-6); }
.suche { grid-column:span 7;display:flex;flex-direction:column;gap:var(--s-4); }
.sammlungen { display:flex;flex-wrap:wrap;gap:var(--s-2);align-items:center;margin:0; }
.sammlungen span { font-size:14px;line-height:20px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--petrol-600);margin-right:var(--s-1); }
.tank { grid-column:span 5;background:var(--petrol-900);border-radius:var(--r-lg);padding:var(--s-5);display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-3);align-content:start;box-shadow:var(--shadow-2); }
.tank__head { grid-column:1 / -1;display:flex;align-items:baseline;justify-content:space-between;gap:var(--s-3); }
.tank__head p { margin:0; }
.tank__head .t-kicker { color:var(--petrol-200); }
.tank__head button { background:none;border:0;padding:0;font-family:var(--font-text);font-size:14px;line-height:20px;font-weight:600;color:var(--petrol-200);cursor:pointer;text-decoration:underline;text-underline-offset:3px; }
.tank label { display:flex;flex-direction:column;gap:var(--s-2);font-size:14px;line-height:20px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--petrol-200); }
.tank select { font-family:var(--font-text);font-size:16px;line-height:24px;font-weight:300;color:var(--ink-950); height:48px;padding-inline:var(--s-3) var(--s-6);border:1px solid var(--petrol-700);border-radius:var(--r-md);background-color:var(--paper);appearance:none;cursor:pointer; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23265769' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat;background-position:right 12px center; }
.tank select:focus { outline:2px solid var(--petrol-400);outline-offset:1px; }
.tank__foot { grid-column:1 / -1;display:flex;flex-direction:column;align-items:stretch;gap:var(--s-3);padding-top:var(--s-3);border-top:1px solid var(--petrol-800); }
.tank__status { margin:0;min-height:44px;font-size:15px;line-height:22px;color:var(--paper); }
.tank__status b { font-weight:600; }
.tank__ziele { display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-3) var(--s-5); }
.tank__ziele .finder__go:disabled { opacity:.55;cursor:not-allowed; }
.tank__neben { font-size:16px;line-height:24px;font-weight:600;color:var(--paper);text-decoration:underline;text-underline-offset:3px; }
.tank__neben:hover { color:var(--petrol-100); }
.tank__neben[hidden] { display:none; }
.legende { display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-2) var(--s-5);margin:0 0 var(--s-4);padding:var(--s-3) 0;border-top:var(--line);border-bottom:var(--line); }
.legende > span:first-child { font-size:14px;line-height:20px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--petrol-600); }
.legende li { display:inline-flex;align-items:center;gap:var(--s-2);font-size:15px;line-height:22px; }
.legende ul { display:contents;list-style:none;margin:0;padding:0; }
.legende svg { width:20px;height:20px;flex:none;color:var(--petrol-600); }
.species .card__body { gap:var(--s-1); }
.schau { background:var(--petrol-950);padding-block:var(--s-9); }
.schau .band-head { margin-bottom:var(--s-6); }
.schau__big { grid-column:span 8;margin:0;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-3); }
.schau__big img { width:100%;height:100%;object-fit:cover;aspect-ratio:16/9; }
.schau__info { grid-column:span 4;display:flex;flex-direction:column;gap:var(--s-3);padding:var(--s-2) 0; }
.schau__info h3 { margin:0; }
.schau__info h3 a { text-decoration:none; }
.schau__info h3 a:hover { text-decoration:underline;text-underline-offset:4px; }
.schau__info dl { margin:0;display:grid;grid-template-columns:auto 1fr;gap:var(--s-1) var(--s-3);font-size:15px;line-height:22px; }
.schau__info dt { color:var(--petrol-200);font-weight:600; }
.schau__info dd { margin:0; }
.besatz { display:flex;flex-wrap:wrap;gap:var(--s-2);margin:0;padding:0;list-style:none; }
.besatz a { display:inline-flex;align-items:center;gap:var(--s-2);font-size:15px;line-height:22px;font-weight:500;color:var(--paper);text-decoration:none;border:1px solid var(--petrol-700);border-radius:var(--r-full);padding:var(--s-1) var(--s-3);transition:background 120ms linear; }
.besatz a:hover { background:var(--petrol-800);border-color:var(--petrol-500); }
.besatz a::before { content:"";width:8px;height:8px;border-radius:var(--r-full);background:var(--petrol-400); }
.schau__info .btn { align-self:flex-start;margin-top:var(--s-2); }
.schau__row { margin-top:var(--s-6); }
.schau__row .layout { grid-column:span 3; }
.schau__row .layout .t-zeile { color:var(--paper); }
.schau__row .layout .t-kicker { color:var(--petrol-200); }
.schau__cta { display:flex;align-items:center;justify-content:space-between;gap:var(--s-5);margin-top:var(--s-7);padding-top:var(--s-5);border-top:1px solid var(--petrol-800); }
.schau__cta p { margin:0;max-width:60ch; }

@media (max-width:900px) {
	.cover { grid-template-columns:1fr;gap:var(--s-4); }
	.cover__media,.cover__copy { grid-column:1 / -1; }
	.halb { grid-column:1 / -1;grid-template-columns:240px minmax(0,1fr); }
	.suche,.tank { grid-column:1 / -1; }
	.tank { grid-template-columns:repeat(3,1fr); }
	.mediabox { grid-column:1 / -1; }
	.path { grid-column:span 3; }
	.schau__big,.schau__info { grid-column:1 / -1; }
	.schau__row .layout { grid-column:span 3; }
	.about__grid { grid-template-columns:1fr 1fr; }
	.scroller { grid-auto-columns:330px; }
	.finder-big { grid-template-columns:1fr; }
	.finder-big .btn { justify-content:center; }
}

@media (max-width:640px) {
	.halb { grid-template-columns:1fr;gap:var(--s-3); }
	.cover__copy { padding:0; }
	.cover__media { border-radius:var(--r-md); }
	.reihe2 { margin-top:var(--s-6);padding-top:var(--s-5); }
	.newsfoot { margin-top:var(--s-5); }
	.tank { grid-template-columns:1fr; }
	.tank__foot .finder__go { width:100%; }
	.tank__ziele { justify-content:center; }
	.scroller { grid-auto-columns:82vw; }
	.scroller-foot { flex-wrap:wrap; }
	.scroller-foot .arrowlink { margin-left:0;width:100%; }
	.legende { gap:var(--s-2) var(--s-4); }
	.path,.schau__row .layout { grid-column:1 / -1; }
	.mediabox { padding:var(--s-4); }
	.path { grid-column:1 / -1; }
	.path__motiv { width:64px;height:64px; }
	.schau { padding-block:var(--s-7); }
	.schau__row .layout { grid-column:1 / -1; }
	.schau__cta { flex-direction:column;align-items:flex-start; }
	.about__grid { grid-template-columns:1fr; }
}

@media (prefers-reduced-motion:reduce) {
	.layout .figure img,.path { transition:none; }
	.cover__media img,.halb img { transition:none; }
}

/* ---------- Ergänzungen für WordPress ---------- */

/* "Mein Becken" färbt die geprüften Pass-Werte, wie in V11. */
.pass li { white-space:nowrap; }
.pass li.ok,.pass li.ok svg { color:var(--moss-600);font-weight:600; }
.pass li.warn,.pass li.warn svg { color:var(--coral-600);font-weight:600; }
.pass li.note,.pass li.note svg { color:var(--ocker-600);font-weight:600; }

/* Die Bänder schließen ohne Abstand aneinander an, wie in V11. */
.startseite > * { margin-block:0; }
/* Der Abspielknopf ist ein Link zur Folge, solange es keinen eigenen Player gibt. */
a.media__play { text-decoration:none; }