@font-face{font-family:'Fraunces';src:url('fonts/fraunces-latin-400-normal.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Fraunces';src:url('fonts/fraunces-latin-400-italic.woff2') format('woff2');font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:'Inter';src:url('fonts/inter-latin-400-normal.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Inter';src:url('fonts/inter-latin-500-normal.woff2') format('woff2');font-weight:500 700;font-display:swap}
:root{--dark:#141311;--paper:#F4EFE8;--ink:#1E1C19;--soft:#5d574f;--line:#d9d1c5;--accent:#8FA8C0;--accent-h:#A9BED3;--link:#37526f;--on-dark:#F1ECE4;--serif:'Fraunces',Georgia,serif;--sans:'Inter',system-ui,-apple-system,sans-serif}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--dark);color:var(--ink);font:400 17px/1.65 var(--sans);overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--link)}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.wrap{max-width:1100px;margin:0 auto;padding:0 20px}

.adminbar{background:#2b3a4a;color:#fff;font-size:14px;padding:6px 16px;display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.adminbar a{color:#cfe0f2;display:inline-flex;align-items:center;min-height:44px}

/* Kopfbild + Wortmarke */
.hero{position:relative;height:clamp(230px,44vh,480px);background:#1a1b1b;display:flex;align-items:flex-end;isolation:isolate;overflow:hidden}
/* Hero zeigt das ganze Foto in voller Höhe (Katze inkl. Ohren). Dahinter eine unscharfe Kopie, die Fotoränder laufen weich aus. */
.hero::before{content:"";position:absolute;inset:-40px;background:var(--hero-bg) center/cover no-repeat;filter:blur(60px) brightness(.28);z-index:-2}
.hero::after{content:"";position:absolute;top:0;bottom:0;left:50%;transform:translateX(-50%);aspect-ratio:3/2;background:var(--hero-bg) var(--hero-pos,50% 50%)/cover no-repeat;-webkit-mask:linear-gradient(to right,transparent,#000 14%,#000 86%,transparent);mask:linear-gradient(to right,transparent,#000 14%,#000 86%,transparent);z-index:-1}
.hero-shade{position:absolute;inset:0;background:linear-gradient(to top,rgba(20,19,17,.92) 0%,rgba(20,19,17,.35) 38%,rgba(20,19,17,0) 65%)}
.wordmark{position:relative;display:block;width:100%;max-width:1100px;margin:0 auto;padding:0 20px 18px;color:var(--on-dark);text-decoration:none}
.wordmark span{display:block;font:400 clamp(2.1rem,7vw,4.4rem)/1.05 var(--serif);letter-spacing:.005em}
.wordmark small{display:block;margin-top:6px;font-size:clamp(.85rem,2.4vw,1.05rem);opacity:.85}

/* Reiter */
.tabs{background:var(--dark);position:sticky;top:0;z-index:20}
.tabs ul{list-style:none;margin:0 auto;padding:0 20px;max-width:1100px;display:flex;flex-wrap:wrap;gap:4px;align-items:flex-end}
.tabs li{flex:1 1 22%}
.tabs a{display:flex;align-items:center;justify-content:center;min-height:46px;padding:0 10px;color:var(--on-dark);text-decoration:none;font-weight:500;font-size:15px;background:#26241f;border-radius:10px 10px 0 0}
.tabs a:hover{background:#34312a}
.tabs a.on{background:var(--paper);color:var(--ink)}
.tabs a:focus-visible,.btn:focus-visible,.card:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
@media(min-width:760px){.tabs li{flex:0 0 auto}.tabs a{padding:0 26px;font-size:16px}}
/* Handy: gleich breite Reiter im 4er-Raster, Leiste auf der Textkante (27.10.2026) */
@media(max-width:759px){.tabs ul{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}.tabs a{padding:0 4px;font-size:14px;text-align:center}}

.paper{background:var(--paper);min-height:50vh;padding:34px 0 60px}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.2;color:var(--ink)}
h1{font-size:clamp(1.8rem,5vw,2.6rem);margin:0 0 18px}
h2{font-size:clamp(1.35rem,3.6vw,1.8rem);margin:36px 0 14px}
h3{font-size:1.2rem;margin:26px 0 8px}
.lead{font:400 clamp(1.25rem,3.4vw,1.7rem)/1.45 var(--serif);margin:0 0 28px;max-width:34em}
.prose{max-width:46em}
.prose p{margin:0 0 1em}
.muted,.opt{color:var(--soft);font-size:.92em}
.note{background:#fff;border:1px solid var(--line);padding:12px 16px;border-radius:10px}

.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 24px;border-radius:10px;background:var(--accent);color:#141311;font:500 16px var(--sans);text-decoration:none;border:0;cursor:pointer}
.btn:hover{background:var(--accent-h)}
.btn.alt{background:transparent;border:2px solid var(--link);color:var(--link)}

.empty{border:2px dashed var(--line);border-radius:14px;padding:26px 22px;color:var(--soft);text-align:center}
.adminhint{margin:12px 0 28px}
.adminhint .btn{max-width:100%;text-align:center;line-height:1.3;padding:10px 22px}

/* Raster */
.grid{list-style:none;margin:0;padding:0;display:grid;gap:14px;grid-template-columns:repeat(2,minmax(0,1fr))}
@media(min-width:700px){.grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}}
@media(min-width:1000px){.grid{grid-template-columns:repeat(4,minmax(0,1fr))}.grid.cards{grid-template-columns:repeat(3,minmax(0,1fr))}}
.card{display:block;text-decoration:none;color:var(--ink);background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 1px 0 var(--line)}
.card .ph{display:block;aspect-ratio:4/5;background:#e5ddd0}
.card .ph img{width:100%;height:100%;object-fit:cover}
.card .meta{display:block;padding:12px 14px 14px;min-height:64px}
.card small{display:block;color:var(--soft);font-size:.82rem;letter-spacing:.04em}
.card strong{font:400 1.12rem/1.25 var(--serif)}
.card:hover{box-shadow:0 6px 18px rgba(0,0,0,.15)}
.tile{display:block;position:relative;background:#fff;border-radius:10px;overflow:hidden;text-decoration:none;color:var(--ink);box-shadow:0 1px 0 var(--line)}
.tile img{width:100%;aspect-ratio:1/1;object-fit:cover}
.docs .tile img{aspect-ratio:3/4;object-fit:contain;background:#fff;padding:6px}
.tile .cap{display:block;padding:8px 10px 10px;font-size:.88rem;line-height:1.35}
.tile.pdf{min-height:150px;padding:14px;display:flex;flex-direction:column;justify-content:space-between}
.pdfbadge{display:inline-block;background:#b3402f;color:#fff;font-weight:700;border-radius:6px;padding:6px 10px;align-self:flex-start}

.crumb{margin:0 0 12px}.crumb a{display:inline-flex;align-items:center;min-height:44px}
.phead small{display:block;color:var(--soft);letter-spacing:.06em;text-transform:uppercase;font-size:.8rem}
.subtabs{list-style:none;display:flex;flex-wrap:wrap;gap:8px;padding:0;margin:0 0 24px}
.subtabs a{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:999px;border:1.5px solid var(--line);background:#fff;text-decoration:none;color:var(--ink);font-weight:500;font-size:15px}
.subtabs a.on{background:var(--dark);color:var(--on-dark);border-color:var(--dark)}
.profile{display:grid;gap:22px}
@media(min-width:800px){.profile{grid-template-columns:minmax(0,420px) 1fr;align-items:start}}
.mainpic{display:block}.mainpic img{width:auto;max-width:100%;max-height:min(560px,70vh);border-radius:12px;display:block;margin:0 auto}   /* Tina 27.10.2026: Hochformat (Missy) zu gross */

.chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 10px}
.chips a{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:999px;background:#fff;border:1.5px solid var(--line);text-decoration:none;color:var(--ink);font-size:15px}
.wurf{scroll-margin-top:70px;border-top:1px solid var(--line);margin-top:22px}
.wurfmeta{display:flex;flex-wrap:wrap;gap:6px 18px;color:var(--soft);margin:0 0 12px}
.badge{display:inline-block;vertical-align:middle;font:500 .72rem var(--sans);letter-spacing:.05em;text-transform:uppercase;padding:4px 10px;border-radius:999px;background:#e5ddd0;color:var(--ink)}
.b-geplant,.b-reserviert{background:#e9dfb8}.b-aktuell,.b-frei{background:#cfe3cf}.b-vergeben,.b-abgeschlossen{background:#dcd7cf}.b-bleibt{background:#cddbe9}
.kit{margin:0;position:relative}.kit .badge{position:absolute;top:8px;left:8px}

/* Formular */
.contact{display:grid;gap:34px}
@media(min-width:860px){.contact{grid-template-columns:1.4fr 1fr}}
.form label{display:block;font-weight:500;margin:0 0 16px}
.form input,.form textarea{display:block;width:100%;margin-top:6px;padding:12px 14px;min-height:48px;border:1.5px solid #bfb5a5;border-radius:10px;background:#fff;font:400 16px var(--sans);color:var(--ink)}
.form input:focus,.form textarea:focus{outline:3px solid var(--accent);border-color:var(--link)}
.hp{position:absolute;left:-5000px;width:1px;height:1px;overflow:hidden}
.alert{background:#fbeceb;border:1.5px solid #d49b96;color:#6b1f18;border-radius:10px;padding:14px 18px;margin:0 0 22px}
.alert ul{margin:6px 0 0;padding-left:20px}
.thanks{background:#fff;border-radius:14px;padding:26px;border:1px solid var(--line)}
.addr{background:#fff;border-radius:14px;padding:20px 22px;align-self:start}
.addr h2{margin-top:0}

.foot{background:var(--dark);color:var(--on-dark);padding:30px 0 40px;font-size:15px}
.foot p{margin:0 0 6px}.foot a{color:var(--accent);display:inline-flex;align-items:center;min-height:44px}
.foot-small{opacity:.8}

.lb{border:0;padding:0;background:transparent;max-width:96vw;max-height:96vh;overflow:visible}
.lb::backdrop{background:rgba(10,9,8,.9)}
.lb img{max-width:96vw;max-height:92vh;margin:auto;border-radius:6px}
.lb-x{position:fixed;top:8px;right:8px;width:48px;height:48px;border-radius:50%;border:0;background:#fff;font-size:30px;line-height:1;cursor:pointer}
@media(prefers-reduced-motion:no-preference){.card,.btn{transition:box-shadow .2s,background .2s}}

/* Sprachumschalter (Kopfbild, rechts oben) */
.langsw{position:absolute;top:8px;right:12px;z-index:6;display:flex;align-items:center;gap:2px;background:rgba(20,19,17,.6);border-radius:10px;padding:0 4px;color:var(--on-dark)}
.langsw a{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;color:var(--on-dark);text-decoration:none;font-weight:500;font-size:15px;border-radius:8px}
.langsw a.on{background:var(--accent);color:#141311}
.langsw a:focus-visible{outline:3px solid var(--accent);outline-offset:1px}
.hero>.ov-image-btn{right:auto;left:10px}

/* Dokumente (Vorschau + PDF-Download) */
.doc{display:flex;flex-direction:column;gap:6px;min-width:0}
.doc .cap{font-size:.88rem;line-height:1.35;overflow-wrap:anywhere}
.dl{display:inline-flex;align-items:center;min-height:44px;font-size:.9rem;font-weight:500}

/* Testergebnisse */
.tests{margin-top:30px}
.tests h2,.tests h3{font:400 1.25rem/1.3 var(--serif);margin:0 0 10px}
.tests+.grid.docs,.tests+.docs{margin-top:32px}
.subtabs+h2{margin-top:22px}
.ttable{width:100%;border-collapse:collapse;background:#fff;border-radius:10px;overflow:hidden;font-size:.95rem}
.ttable th,.ttable td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top;overflow-wrap:anywhere}
.ttable thead th{font-size:.78rem;letter-spacing:.05em;text-transform:uppercase;color:var(--soft);background:#faf7f2}
.ttable tbody th{font-weight:500}
.ttable tr:last-child th,.ttable tr:last-child td{border-bottom:0}

/* Wurf: Mutter, Storch, Vater */
.parents{display:grid;grid-template-columns:1fr minmax(64px,.45fr) 1fr;gap:10px;align-items:center;margin:0 0 18px;max-width:640px}
.par{margin:0;min-width:0}
.par img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:10px}
.par-storch img{aspect-ratio:1/1;object-fit:contain;background:var(--dark);padding:4px}
.par figcaption{font-size:.85rem;line-height:1.3;margin-top:5px;overflow-wrap:anywhere}
.kh{margin:20px 0 10px}
.capbox{background:#fff;border-radius:10px;padding:10px 12px}
.legal h2{font-size:1.25rem;margin-top:28px}

/* EN-Hinweis im Bearbeitungsmodus */
.ov-enfallback{opacity:.7;font-style:italic;display:block;margin-top:4px}
.ov-enflag{display:inline-block;background:#e9dfb8;color:#1E1C19;border-radius:999px;padding:2px 10px;font:500 .72rem var(--sans);font-style:normal;margin-right:6px}
.kit.nophoto{background:#fff;border-radius:10px;padding:10px 12px}
.kit.nophoto .capbox{background:none;padding:0;display:block}
.kit.nophoto .badge{position:static;display:inline-block;margin-top:8px}
.ttable{font-size:.9rem}
.ttable th:last-child,.ttable td:last-child{white-space:nowrap;width:1%}
.ttable th,.ttable td{padding:10px 9px}

/* 2026-10-23 Bildausschnitt: Kitten- und Eltern-Bilder zentriert auf das Gesicht, egal wie hoch die Originale sind */
.kit .tile img{aspect-ratio:4/5;object-position:50% 25%}
.par img{object-position:50% 30%}
.chips-mum a{gap:10px;padding:4px 16px 4px 5px}
.chips-mum a img{width:40px;height:40px;border-radius:50%;object-fit:cover;object-position:50% 30%;flex:none;background:#e5ddd0}
.chips-mum a:not(:has(img)){padding-left:16px}
/* Ernährungsberatung (27.10.2026) */
.ern{display:grid;gap:28px;align-items:start}
.ern-bild{margin:0}.ern-bild img{width:100%;height:auto;border-radius:12px;display:block}
.ern-fragebogen{margin:0 0 40px;max-width:560px}.ern-fragebogen img{width:100%;height:auto;border-radius:8px;box-shadow:0 2px 14px rgba(0,0,0,.12);display:block}
@media (min-width:900px){.ern{grid-template-columns:minmax(0,1fr) 300px}.ern-bild{order:2;position:sticky;top:24px}}
