/* Plasvio: Gestaltung für alle Seiten */

/* Schrift: DM Sans, vom eigenen Server (Datei in assets/fonts, SIL Open Font License).
   Fehlt die Datei, greift die Systemschrift. */
@font-face { font-family:"DM Sans"; src:url("../fonts/dm-sans-latin-wght-normal.woff2") format("woff2"); font-weight:100 1000; font-style:normal; font-display:swap; }

:root { --petrol:#0B4F5C; --tint:#DCEAEB; --blue-soft:#9CCBD2; --paper:#F7F8F7; --ink:#12201F; --muted:#4E5B5A; --line:rgba(18,32,31,.14); --focus:#0B4F5C; --sun:#F2B705; --sun-deep:#C99700; --sun-soft:#F9E5A0; }
* { box-sizing:border-box; }
html, body { margin:0; }
html { overflow-y:scroll; } /* Scrollleiste immer sichtbar: kein Springen zwischen kurzen und langen Seiten */
body { font-family:"DM Sans","Helvetica Neue",Arial,sans-serif; color:var(--ink); background:var(--paper); -webkit-font-smoothing:antialiased; min-height:100vh; display:flex; flex-direction:column; }
main { flex:1 0 auto; }
body:has(#phbar) footer { padding-bottom:90px; } /* Platz für die Entwurfsleiste, entfällt mit ihr */
@media (max-width:760px) { body:has(#phbar) footer { padding-bottom:150px; } }
a { color:inherit; }
[tabindex="-1"]:focus { outline:none; }
button:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible { outline:3px solid var(--focus); outline-offset:3px; }
.nowrap { white-space:nowrap; }

/* Sprunglink für Tastatur und Screenreader */
.skip { position:absolute; left:16px; top:-60px; z-index:100; background:var(--petrol); color:#fff; padding:10px 16px; border-radius:8px; font-weight:700; text-decoration:none; }
.skip:focus { top:12px; }

/* Kopfzeile */
.top { position:sticky; top:0; z-index:10; background:var(--paper); display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px max(20px, calc((100% - 1100px) / 2)); border-bottom:1px solid var(--line); }
.brand { font-weight:700; font-size:24px; letter-spacing:-.03em; text-decoration:none; color:var(--petrol); }
.nav { display:flex; gap:18px; align-items:center; font-size:15px; flex-wrap:wrap; }
.nav a { text-decoration:none; padding:4px 0; border-bottom:2px solid transparent; color:var(--ink); transition:color .15s, border-color .15s; }
.nav a:hover, .nav a:focus-visible { color:var(--petrol); border-color:var(--blue-soft); }
.nav a[aria-current="page"] { border-color:var(--petrol); color:var(--petrol); }
.lang { display:flex; border:1px solid var(--line); border-radius:999px; overflow:hidden; }
.lang a { font-size:14px; padding:6px 12px; text-decoration:none; color:var(--ink); transition:background-color .2s, color .2s; }
.lang a[aria-current="true"] { background:var(--petrol); color:#fff; }
.lang a:not([aria-current]):hover, .lang a:not([aria-current]):focus-visible { background:var(--tint); color:var(--petrol); }
.lang a[aria-current="true"]:hover { background:#0A434E; }
.lang a:focus-visible { outline-offset:-3px; }

/* Platzhalter: bewusst auffällig */
.ph { background:#FFF200; color:#B00020; font-weight:700; padding:1px 5px; outline:2px dashed #B00020; border-radius:3px; font-style:normal; }
.phbar { position:fixed; left:0; right:0; bottom:0; z-index:9; background:#B00020; color:#fff; padding:12px 20px; font-size:15px; font-weight:700; text-align:center; }
.phbar span { background:#FFF200; color:#B00020; padding:2px 8px; border-radius:999px; margin:0 6px; }

/* Startseite: Kopfbereich */
.hero { background:var(--petrol); color:#fff; padding:clamp(26px,3.5vw,42px) clamp(20px,5vw,64px); }
.wrap { max-width:1100px; margin:0 auto; }
.hero .slogan { margin:0 0 10px; font-size:clamp(17px,1.8vw,22px); font-weight:700; letter-spacing:-.01em; color:var(--blue-soft); }
.hero h1 { font-size:clamp(28px,3.8vw,48px); line-height:1.05; letter-spacing:-.03em; margin:0 0 12px; max-width:24em; }
.hero-values { list-style:none; margin:18px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:8px 30px; font-size:clamp(15px,1.4vw,17px); font-weight:600; color:#fff; }
.hero-values li { display:flex; align-items:center; gap:8px; }
.hero-values svg { color:var(--blue-soft); flex:none; }

/* Bereich Eimer: gelbe Akzente */
body[data-area="eimer"] .pagehero { background:var(--sun); }
body[data-area="eimer"] { --accent-ink:var(--ink); --focus:var(--sun); }
body[data-area="eimer"] .shape, body[data-area="eimer"] .pagehero, body[data-area="eimer"] .status, body[data-area="eimer"] .detail { color:var(--ink); --accent-ink:var(--ink); }
body[data-area="eimer"] .shape svg { opacity:1 !important; }
body[data-area="eimer"] .callout { border-left-color:var(--sun); }
.callout .infoicon { flex:none; color:var(--petrol); margin-top:2px; }
body[data-area="eimer"] .callout .infoicon { color:var(--ink); }
body[data-area="eimer"] .submit { background:var(--sun); color:var(--ink); }
body[data-area="eimer"] .submit:hover, body[data-area="eimer"] .submit:focus-visible { background:#fff; color:var(--ink); box-shadow:inset 0 0 0 2px var(--sun-deep); }
body[data-area="eimer"] form.inquiry input:focus, body[data-area="eimer"] form.inquiry textarea:focus { border-color:var(--sun); }

/* Unterseiten */
.detail { padding:clamp(32px,4vw,56px) clamp(20px,5vw,64px) clamp(28px,5vw,64px); max-width:1228px; margin:0 auto; --accent:var(--tint); --accent-ink:var(--petrol); }
.pagehero { background:var(--petrol); color:#fff; padding:clamp(26px,3.5vw,42px) clamp(20px,5vw,64px); }
.pagehero > .wrap { width:100%; position:relative; }
@media (min-width:761px) { .pagehero { min-height:200px; display:flex; flex-direction:column; justify-content:center; box-sizing:border-box; } .pagehero:has(.eyebrow) { min-height:331px; } }
.heroimg { display:none; }
@media (min-width:1100px) {
  .pagehero:has(.heroimg) h1 { max-width:14em; }
  .pagehero:has(.heroimg) p { max-width:38em; }
  .pagehero:has(.heroimg) > .wrap { display:grid; grid-template-columns:minmax(0,38em) minmax(0,1fr); column-gap:24px; align-items:start; }
  .pagehero:has(.heroimg) > .wrap > * { grid-column:1; }
  .pagehero:has(.heroimg) .status { justify-self:start; }
  .heroimg { display:block; grid-column:2 !important; grid-row:1 / span 6; align-self:center; justify-self:center; max-height:173px; max-width:100%; width:auto; height:auto; filter:drop-shadow(0 8px 12px rgba(0,0,0,.28)); pointer-events:none; }
}
.pagehero h1, .pagehero h2 { font-size:clamp(28px,3.8vw,48px); line-height:1.05; margin:0; letter-spacing:-.03em; max-width:24em; }
.pagehero .eyebrow { font-size:clamp(17px,1.8vw,22px); font-weight:700; letter-spacing:-.01em; margin-bottom:10px; color:var(--blue-soft); }
body[data-area="eimer"] .pagehero .eyebrow { color:var(--ink); }
.pagehero p { margin:12px 0 0; font-size:clamp(15px,1.4vw,17px); line-height:1.5; max-width:46em; color:inherit; }
.status { display:inline-block; margin-top:18px; font-size:14px; font-weight:700; padding:6px 12px; border-radius:999px; background:#fff; color:var(--petrol); }
h3[id] { scroll-margin-top:96px; }
h3 { font-size:22px; margin:0 0 14px; letter-spacing:-.01em; }
.grid { display:grid; gap:18px; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); margin-bottom:40px; }
.grid.half { grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),calc(50% - 9px))); }
.card { border:1px solid var(--line); border-radius:16px; padding:22px; background:#fff; }
.card .size { font-size:26px; font-weight:700; letter-spacing:-.02em; margin-bottom:6px; }
.card p, .note { color:var(--muted); font-size:16px; line-height:1.6; }
.card p { margin:0 0 8px; }
.photo-box { height:260px; margin-bottom:14px; border-radius:10px; background:var(--paper); display:flex; align-items:center; justify-content:center; padding:12px; box-sizing:border-box; }
.photo-box img { max-width:100%; max-height:100%; width:auto; height:auto; display:block; }
.shape { color:var(--petrol); height:110px; margin-bottom:12px; display:flex; align-items:flex-end; }
.shape svg { flex:0 1 auto; min-width:0; shape-rendering:geometricPrecision; }
.spec { margin:10px 0 14px; display:grid; gap:6px; font-size:15px; }
.spec div { display:flex; justify-content:space-between; gap:12px; border-top:1px solid var(--line); padding-top:6px; }
.spec dt { color:var(--muted); } .spec dd { margin:0; font-weight:600; text-align:right; }
.callout { display:flex; gap:14px; align-items:flex-start; border-left:4px solid var(--petrol); background:#fff; padding:18px 22px; border-radius:0 14px 14px 0; max-width:46em; margin:0 0 36px; font-size:18px; line-height:1.55; }
.note { max-width:46em; margin:0 0 36px; }
ul.facts { max-width:46em; margin:0 0 40px; padding-left:22px; color:var(--muted); font-size:16px; line-height:1.7; }
ul.facts li { padding-left:4px; }
ul.facts li::marker { color:var(--ink); }

/* Galerie und Bildansicht */
.gallery { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:14px; margin-bottom:40px; }
@media (max-width:960px) { .gallery { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:560px) { .gallery { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; } }
.gallery figure { display:flex; flex-direction:column; margin:0; border:1px solid var(--line); border-radius:16px; background:#fff; overflow:hidden; }
.gallery img { width:100%; aspect-ratio:4/3; object-fit:cover; display:block; background:var(--paper); }
.gallery figcaption { padding:10px 12px 12px; font-size:14px; line-height:1.4; color:var(--ink); font-weight:600; background:var(--sun); flex:1; }
.gbtn { display:block; width:100%; padding:0; border:0; background:none; cursor:zoom-in; position:relative; }
.gbtn:focus-visible { outline:3px solid var(--sun-deep); outline-offset:-3px; }
.gbtn::after { content:''; position:absolute; right:10px; bottom:10px; width:32px; height:32px; border-radius:50%; background:rgba(255,255,255,.92) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23123' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6'/%3E%3Cpath d='M20 20l-4.5-4.5M11 8.5v5M8.5 11h5'/%3E%3C/svg%3E") center/18px no-repeat; box-shadow:0 1px 4px rgba(0,0,0,.25); }
.lb { position:fixed; inset:0; z-index:1000; background:rgba(10,20,20,.88); display:none; flex-direction:column; align-items:center; justify-content:center; padding:56px 16px 24px; }
.lb.open { display:flex; }
.lb img { max-width:100%; max-height:calc(100vh - 140px); object-fit:contain; border-radius:8px; background:#fff; }
.lb .lbcap { color:#fff; margin-top:14px; font-size:16px; text-align:center; }
.lb button { position:absolute; width:44px; height:44px; border-radius:50%; border:0; background:#fff; color:var(--ink); font-size:24px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.lb button:focus-visible { outline:3px solid var(--sun); outline-offset:2px; }
.lb .lbx { top:8px; right:12px; } .lb .lbp { left:12px; top:50%; } .lb .lbn { right:12px; top:50%; }

/* Karte (Über uns) */
.mapbox { margin-bottom:28px; border:1px solid var(--line); border-radius:16px; overflow:hidden; background:#fff; max-width:720px; }
.mapgate { padding:26px; display:grid; gap:14px; justify-items:start; min-height:200px; align-content:center; }
.mapgate p { margin:0; color:var(--muted); line-height:1.5; max-width:34em; }
.mapbox iframe { display:block; width:100%; height:360px; border:0; }
.maplink { display:inline-flex; align-items:center; gap:10px; margin:14px 0 28px; padding:14px 22px; border-radius:999px; background:var(--petrol); color:#fff; font-weight:700; text-decoration:none; transition:background-color .2s, color .2s, box-shadow .2s; }
.maplink:hover, .maplink:focus-visible { background:#fff; color:var(--petrol); box-shadow:inset 0 0 0 2px var(--petrol); }
.maplink svg, .mapgate .submit svg { flex:none; }
.mapbtns { display:flex; flex-wrap:wrap; gap:12px; }
.mapbtns .maplink { margin:0; }
.mapgate .submit { display:inline-flex; align-items:center; gap:10px; }
h3.withicon { display:flex; align-items:center; gap:12px; color:var(--petrol); }
h3.withicon svg { flex:none; color:var(--petrol); }
.locaddr { padding-left:38px; }
.legal h3 { margin-top:28px; }
.legal p, .legal li { line-height:1.6; max-width:46em; }

/* Anfrageformular */
form.inquiry { display:grid; grid-template-columns:1fr 1fr; gap:28px 18px; max-width:720px; }
form.inquiry .full { grid-column:1 / -1; }
form.inquiry label { position:relative; display:grid; gap:6px; font-size:15px; font-weight:500; align-content:space-between; }
form.inquiry .hint { display:block; font-weight:400; color:var(--muted); font-size:13px; line-height:1.4; margin-top:2px; }
form.inquiry .opt { font-weight:400; color:var(--muted); }
form.inquiry input:not([type=checkbox]), form.inquiry textarea { font:inherit; font-size:16px; padding:12px 14px; border:1px solid #bdb8ae; border-radius:10px; background:#fff; color:var(--ink); width:100%; }
form.inquiry .hint-abs { position:absolute; left:0; right:0; top:100%; margin-top:4px; }
form.inquiry label:has([aria-invalid]) .hint-abs, form.inquiry .hint-abs[hidden] { display:none; }
form.inquiry input[type=number] { -moz-appearance:textfield; appearance:textfield; }
form.inquiry input[type=number]::-webkit-outer-spin-button, form.inquiry input[type=number]::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }
form.inquiry textarea { min-height:130px; resize:vertical; }
form.inquiry input, form.inquiry textarea { scroll-margin-top:110px; }
form.inquiry button.submit { display:inline-flex; align-items:center; gap:10px; }
form.inquiry button.submit svg { flex:none; }
form.inquiry button.submit[disabled] { opacity:.6; cursor:wait; }
form.inquiry .check { display:flex; gap:10px; align-items:flex-start; font-weight:400; line-height:1.4; }
.field-err { position:absolute; left:0; right:0; top:100%; margin-top:4px; color:#B00020; font-size:14px; font-weight:600; line-height:1.35; }
form.inquiry [aria-invalid="true"]:not([type=checkbox]) { border-color:#B00020 !important; }
.hp { position:absolute; left:-9999px; }
/* Auswahlmenü mit Icons */
form.inquiry label.vsel { align-content:start; }
form.inquiry label input.vsel-input { position:absolute; left:0; bottom:0; width:1px; height:1px; padding:0; border:0; opacity:0; pointer-events:none; }
.vsel-btn { font:inherit; font-size:16px; display:flex; align-items:center; gap:12px; width:100%; min-height:46px; padding:6px 40px 6px 14px; box-sizing:border-box; border:1px solid #bdb8ae; border-radius:10px; color:var(--ink); text-align:left; cursor:pointer;
  background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1.5l6 6 6-6' fill='none' stroke='%230B4F5C' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 14px center; }
.vsel-btn:focus-visible, .vsel-btn[aria-expanded="true"] { border-color:var(--focus); }
.vsel-input[aria-invalid] + .vsel-btn { border-color:#B00020; }
.vsel-cur { display:flex; align-items:center; gap:12px; }
.vsel-ico { flex:none; width:32px; height:32px; display:flex; align-items:center; justify-content:center; color:var(--petrol); }
.vsel-ico svg { width:30px; height:30px; opacity:1; }
body[data-area="eimer"] .vsel-ico { color:var(--ink); }
.vsel-list { position:absolute; z-index:20; left:0; right:0; top:100%; margin:4px 0 0; padding:6px; list-style:none; background:#fff; border:1px solid #bdb8ae; border-radius:12px; box-shadow:0 10px 28px rgba(18,32,31,.16); }
.vsel-list[hidden] { display:none; }
.vsel-list li { display:flex; align-items:center; gap:12px; min-height:48px; box-sizing:border-box; padding:8px 14px; border-radius:8px; cursor:pointer; font-weight:400; font-size:16px; }
.vsel-list li:hover, .vsel-list li:focus { background:var(--tint); outline:none; }
body[data-area="eimer"] .vsel-list li:hover, body[data-area="eimer"] .vsel-list li:focus { background:var(--sun-soft); }
.vsel-list li[aria-selected="true"] { background:var(--tint); }
body[data-area="eimer"] .vsel-list li[aria-selected="true"] { background:var(--sun-soft); }
.vsel-list:focus { outline:none; }

/* Buttons und Meldungen */
.submit { transition:background-color .2s, color .2s, box-shadow .2s; font:inherit; font-weight:700; padding:14px 22px; border:0; border-radius:999px; cursor:pointer; background:var(--petrol); color:#fff; justify-self:start; }
.submit:hover, .submit:focus-visible { background:#fff; color:var(--petrol); box-shadow:inset 0 0 0 2px var(--petrol); }
.msg { padding:16px 18px; border-radius:12px; background:var(--accent); color:var(--accent-ink); max-width:560px; }
.msg.err { background:#fff; border:2px solid #B00020; color:#B00020; }

/* Kontaktseite */
address.contactdata { padding-left:38px; font-style:normal; display:grid; gap:22px; font-size:17px; line-height:1.5; margin:0 0 40px; }
address.contactdata div { display:grid; gap:2px; }
address.contactdata b { font-size:inherit; }
address.contactdata span { color:var(--muted); }
.card.contact { display:flex; flex-direction:column; align-items:flex-start; }
.card.contact p { margin-bottom:20px; }
.card.contact .submit { margin-top:auto; display:inline-flex; align-items:center; gap:10px; align-self:flex-start; text-decoration:none; }
.card.contact .submit svg { flex:none; }

/* Fußzeile */
footer { background:var(--petrol); padding:36px max(20px, calc((100% - 1100px) / 2)) 26px; display:grid; gap:28px; font-size:15px; line-height:1.6; color:#fff; }
footer .fcontact { display:grid; gap:4px; font-style:normal; }
footer .fcontact b { font-size:17px; margin-bottom:2px; }
footer .fbottom { display:flex; gap:20px; flex-wrap:wrap; padding-top:20px; border-top:1px solid rgba(255,255,255,.25); }

/* Textlinks: ohne Unterstreichung, durch Farbe gekennzeichnet */
main a:not(.submit):not(.maplink), .legal a, address.contactdata a { color:#0891B2; text-decoration:none; transition:color .15s; }
main a:not(.submit):not(.maplink):hover, .legal a:hover, address.contactdata a:hover { color:#2EB0D0; }
footer a { color:var(--blue-soft); text-decoration:none; transition:color .15s; }
footer a:hover { color:#7FDCF2; }
footer a:focus-visible { outline-color:#fff; }

/* Startseite: zwei Farbflächen mit Text, Bild und Button */
.intro { width:min(1100px, calc(100% - 2 * clamp(20px,5vw,64px))); margin:0 auto; padding:clamp(28px,4vw,44px) 0 0; }
.intro p { margin:0; max-width:46em; font-size:clamp(18px,1.6vw,20px); line-height:1.6; }
.entries { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:18px; width:min(1100px, calc(100% - 2 * clamp(20px,5vw,64px))); margin:0 auto; padding:clamp(28px,4vw,48px) 0 clamp(12px,2vw,20px); }
.intro + .entries { padding-top:clamp(20px,3vw,32px); }
.panel { position:relative; display:flex; flex-direction:column; gap:22px; min-width:0; background:#7DB4BF; color:var(--ink); --pad:clamp(24px,3.4vw,44px); --gh:clamp(14px,1.8vw,22px); padding:var(--pad); transition:transform .2s, box-shadow .2s; overflow:hidden; container-type:inline-size; cursor:pointer; }
.panel.is-eimer { background:var(--sun); }
.panel h2 { font-size:clamp(30px,3.6vw,46px); line-height:1.1; letter-spacing:-.025em; margin:0 0 8px; }
.panel p { margin:0; font-size:18px; line-height:1.5; max-width:30em; }
.panel .photo { position:relative; display:flex; align-items:center; justify-content:center; height:38cqw; margin-top:max(0px, calc(var(--gh) - var(--pad) + 6px)); box-sizing:border-box; }
.panel .photo img { max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain; filter:drop-shadow(0 8px 10px rgba(18,32,31,.22)); }
.panel:not(.is-eimer) .photo img { height:100%; width:auto; max-width:100%; }
.panel.is-eimer .photo img { width:87.6%; height:auto; }
.infobox { position:relative; z-index:2; isolation:isolate; display:flex; flex-direction:column; gap:22px; flex:1; margin:0 calc(-1 * var(--pad)) calc(-1 * var(--pad)); padding:22px var(--pad) var(--pad); }
.infobox::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(to bottom, rgba(247,248,247,0) 0, var(--paper) calc(100% - 112px), var(--paper) 100%); transition:opacity .2s; }
.infobox::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(to bottom, rgba(255,255,255,0) 0, rgba(255,255,255,.4) calc(100% - 112px), rgba(255,255,255,.4) 100%); opacity:0; transition:opacity .25s; }
.infobox h2 { margin-top:0; }
.panel.is-eimer .infobox::after { background:linear-gradient(to bottom, rgba(235,245,255,0) 0, rgba(235,245,255,.42) calc(100% - 112px), rgba(235,245,255,.42) 100%); }
.panel:hover .infobox::before { opacity:0; }
.panel:hover .infobox::after { opacity:1; }
.panel:hover { transform:scale(1.015); z-index:3; box-shadow:0 16px 36px rgba(18,32,31,.35); }
@media (prefers-reduced-motion:reduce) { .panel:hover { transform:none; } }
.entrygo { align-self:center; margin-top:auto; display:inline-flex; align-items:center; gap:12px; white-space:nowrap; padding:14px 24px; border-radius:999px; background:var(--petrol); color:#fff; font-weight:700; font-size:17px; text-decoration:none; transition:color .2s; }
main a.entrygo.entrygo.entrygo { color:#fff; transition:background-color .2s, color .2s, box-shadow .2s; }
.panel:hover a.entrygo.entrygo.entrygo, a.entrygo.entrygo.entrygo:focus-visible { background:#fff; color:var(--petrol); box-shadow:inset 0 0 0 2px var(--petrol); }
main .panel.is-eimer a.entrygo.entrygo.entrygo { background:var(--sun); color:var(--ink); }
main .panel.is-eimer:hover a.entrygo.entrygo.entrygo, main .panel.is-eimer a.entrygo.entrygo.entrygo:focus-visible { background:#fff; color:var(--ink); box-shadow:inset 0 0 0 2px var(--sun-deep); }
.entrygo svg { transition:transform .2s; }
.panel:hover .entrygo svg, .entrygo:focus-visible svg { transform:translateX(5px); }
.entrygo:focus-visible { outline:3px solid var(--ink); outline-offset:3px; }

/* Startseite: weitere Bereiche */
.home { width:min(1100px, calc(100% - 2 * clamp(20px,5vw,64px))); margin:0 auto; padding-bottom:clamp(40px,6vw,80px); }
.homesec { margin:clamp(32px,5vw,64px) 0; }
.home > .homesec:first-child { margin-top:0; }
.homesec h2 { font-size:clamp(26px,3vw,36px); letter-spacing:-.02em; margin:0 0 20px; }
.card3 h3 { margin:0 0 6px; font-size:20px; }
.card3 p { margin:0; color:var(--muted); line-height:1.5; }
.cards3 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.cards3.four { grid-template-columns:repeat(2,minmax(0,1fr)); margin-bottom:36px; }
.card3 { border-top:4px solid var(--sun); background:#fff; padding:22px 22px 24px; border-radius:0 0 12px 12px; box-shadow:0 1px 0 rgba(18,32,31,.08); }
.cards3.areas .card3 { border-top-color:var(--petrol); }
.cicon { display:inline-flex; width:44px; height:44px; border-radius:12px; background:var(--tint); color:var(--petrol); align-items:center; justify-content:center; margin-bottom:12px; }
.cards3:not(.areas) .cicon { background:var(--sun-soft); color:#7A5C00; }
.areas-note { margin:18px 0 0; color:var(--muted); }
.founder { display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:clamp(20px,4vw,48px); align-items:center; }
.founder .foto { aspect-ratio:4/3; background:var(--blue-soft); border-radius:16px; display:flex; align-items:center; justify-content:center; color:var(--petrol); font-weight:600; text-align:center; line-height:1.5; }
.founder p { color:var(--muted); line-height:1.6; margin:0 0 14px; }
.ctaband { background:var(--tint); color:var(--ink); border-radius:16px; padding:clamp(24px,4vw,40px); display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.ctaband h2 { margin:0 0 4px; font-size:clamp(24px,3vw,32px); }
.ctaband p { margin:0; color:var(--muted); }
.ctabtn { display:inline-flex; align-items:center; gap:10px; background:var(--petrol); color:#fff; font-weight:700; padding:14px 26px; border-radius:999px; text-decoration:none; transition:background-color .2s; }
.ctabtn svg { flex:none; transition:transform .2s; }
.ctabtn:hover svg, .ctabtn:focus-visible svg { transform:translateX(5px); }
main a.ctabtn.ctabtn.ctabtn { color:#fff; }
main a.ctabtn.ctabtn.ctabtn:hover, main a.ctabtn.ctabtn.ctabtn:focus-visible { color:var(--petrol); }
.ctabtn:hover, .ctabtn:focus-visible { background:#fff; box-shadow:inset 0 0 0 2px var(--petrol); }
.morebtn { display:inline-flex; align-items:center; gap:10px; text-decoration:none; }
.morebtn svg { flex:none; transition:transform .2s; }
.morebtn:hover svg, .morebtn:focus-visible svg { transform:translateX(5px); }
.moretoggle { display:none; align-items:center; gap:10px; margin:16px auto 0; }
.moretoggle svg { transition:transform .2s; flex:none; }
.moretoggle[aria-expanded="true"] svg { transform:rotate(180deg); }
.moretoggle .t-less, .moretoggle[aria-expanded="true"] .t-more { display:none; }
.moretoggle[aria-expanded="true"] .t-less { display:inline; }

/* Schmale Bildschirme */
@media (max-width:760px) {
  .moretoggle { display:flex; }
  .cards3.areas:not(.open) .more-card { display:none; }
  .cards3.areas:not(.open) .card3:nth-child(3) { -webkit-mask-image:linear-gradient(to bottom,#000 35%,transparent 100%); mask-image:linear-gradient(to bottom,#000 35%,transparent 100%); }
  .cards3.areas:not(.open) + .moretoggle { position:relative; margin-top:-38px; }
  .cards3, .cards3.four, .founder, .entries { grid-template-columns:minmax(0,1fr); }
  .top { padding:14px 16px; flex-wrap:wrap; }
  .nav { order:3; width:100%; gap:22px; }
  /* Formular: eine Spalte; Hinweise und Fehlermeldungen im Textfluss, damit sie nichts überdecken */
  form.inquiry { grid-template-columns:minmax(0,1fr); gap:22px; }
  form.inquiry label { align-content:start; }
  .field-err, form.inquiry .hint-abs { position:static; margin-top:0; }
  form.inquiry .check { flex-wrap:wrap; }
  form.inquiry .check > span { flex:1 1 0; min-width:0; }
  form.inquiry .check .field-err { flex-basis:100%; }
}
@media (prefers-reduced-motion:reduce) { * { transition:none !important; animation:none !important; } }