:root{
  --bg:#fbf5ee; --tint:#f4e8dc; --card:#fffdfa; --ink:#3d302c; --muted:#7d6b63;
  --rose:#b5586a; --rose-d:#964556; --sage:#6f8560; --line:#e6d6c8; --shadow:0 10px 30px rgba(90,55,40,.10);
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
@media (prefers-color-scheme:dark){
  :root{--bg:#231b19;--tint:#2b211f;--card:#322826;--ink:#f3e8df;--muted:#c0aca1;--rose:#e08a9a;--rose-d:#f0a3b1;--sage:#9bb28b;--line:#4a3b37;--shadow:0 10px 30px rgba(0,0,0,.35)}
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.65 var(--sans);-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--serif);font-weight:600;line-height:1.15;margin:0}
a{color:var(--rose-d)}
img{max-width:100%;display:block}

.hero{position:relative;min-height:88svh;display:flex;align-items:flex-end;overflow:hidden;color:#fff}
.hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(40,25,20,.35) 0%,rgba(40,25,20,.05) 35%,rgba(40,25,20,.70) 100%)}
.nav{position:absolute;top:0;left:0;right:0;display:flex;gap:6px 18px;flex-wrap:wrap;justify-content:center;padding:18px 16px}
.nav a{color:#fff;text-decoration:none;font-size:.9rem;letter-spacing:.04em;padding:4px 2px;border-bottom:1px solid transparent;text-shadow:0 1px 8px rgba(0,0,0,.4)}
.nav a:hover{border-color:#fff}
.hero-text{position:relative;padding:0 24px 56px;max-width:900px;margin:0 auto;width:100%}
.kicker{margin:0 0 8px;letter-spacing:.14em;text-transform:uppercase;font-size:.8rem;opacity:.9}
.hero h1{font-size:clamp(3rem,10vw,6rem);font-style:italic;font-weight:500;text-shadow:0 2px 24px rgba(0,0,0,.35)}
.lead{font-family:var(--serif);font-size:clamp(1.15rem,3.2vw,1.6rem);margin:12px 0 24px;max-width:30ch}

.sec{padding:72px 20px;max-width:1000px;margin:0 auto}
.sec.tint{max-width:none;background:var(--tint)}
.sec.tint>*{max-width:960px;margin-left:auto;margin-right:auto}
.eyebrow{margin:0 0 6px;color:var(--sage);letter-spacing:.14em;text-transform:uppercase;font-size:.78rem;font-weight:600}
.sec h2{font-size:clamp(1.9rem,5vw,2.8rem);margin-bottom:22px}
.sec h3{font-size:1.5rem;margin:40px 0 16px}
.prose{margin:0 0 18px;max-width:52ch}
.two{display:grid;gap:28px;grid-template-columns:1fr}
@media(min-width:800px){.two{grid-template-columns:1.1fr 1fr;align-items:center}}
.photo{margin:0;border-radius:18px;overflow:hidden;box-shadow:var(--shadow);background:var(--tint)}
.photo img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3}
.photo figcaption{padding:8px 14px;font-size:.85rem;color:var(--muted);background:var(--card)}
.gallery{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));margin-top:36px}

.facts{list-style:none;display:flex;flex-wrap:wrap;gap:12px;padding:0;margin:0 0 22px}
.facts li{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:10px 16px;display:flex;flex-direction:column}
.facts b{font-family:var(--serif);font-size:1.4rem;color:var(--rose-d)}
.facts span{font-size:.8rem;color:var(--muted)}

.btn{display:inline-block;border:0;cursor:pointer;background:var(--rose);color:#fff;font:600 .95rem var(--sans);padding:12px 22px;border-radius:999px;text-decoration:none;transition:transform .15s,background .15s}
.btn:hover{background:var(--rose-d);transform:translateY(-1px)}
.btn.ghost{background:transparent;color:var(--rose-d);border:1.5px solid var(--rose)}
.btn.ghost:hover{background:var(--rose);color:#fff}
.btn.small{padding:10px 18px}
.row{display:flex;gap:12px;flex-wrap:wrap;align-items:center}

.timeline{list-style:none;margin:0;padding:0 0 0 22px;border-left:2px solid var(--line)}
.timeline li{position:relative;padding:0 0 22px 22px;display:flex;gap:14px;align-items:flex-start}
.timeline li::before{content:"";position:absolute;left:-30px;top:8px;width:14px;height:14px;border-radius:50%;background:var(--rose);border:3px solid var(--bg)}
.timeline time{font-family:var(--serif);font-weight:600;color:var(--rose-d);min-width:3.2rem}
.timeline .t{flex:1}

input,textarea{font:inherit;color:var(--ink);background:var(--card);border:1.5px solid var(--line);border-radius:12px;padding:11px 14px;min-width:0}
input:focus,textarea:focus{outline:2px solid var(--rose);outline-offset:1px;border-color:transparent}
.add{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
.add input:not([type=time]):not(.narrow){flex:1 1 220px}
.add input.narrow{flex:0 1 150px}
.add.stack{flex-direction:column}
.add.stack>*{flex:none!important;width:100%;max-width:560px}
.add.stack .btn,.add.stack .file{width:auto}
.add.stack .btn{align-self:flex-start}
.hint{color:var(--muted);font-size:.9rem}
.datum{display:flex;gap:10px;align-items:center;font-weight:600}

.x{border:0;background:none;color:var(--muted);cursor:pointer;font-size:1.2rem;line-height:1;padding:4px 8px;border-radius:8px}
.x:hover{color:var(--rose-d);background:var(--tint)}

.checks{list-style:none;padding:0;margin:0;display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.checks li{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:6px 8px 6px 14px}
.checks label{flex:1;display:flex;gap:10px;align-items:center;cursor:pointer;padding:6px 0}
.checks input{width:20px;height:20px;accent-color:var(--sage);flex:none}
.checks li.done label span{text-decoration:line-through;color:var(--muted)}

.cards,.memories,.ideen{list-style:none;padding:0;margin:0;display:grid;gap:14px}
.cards{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px 18px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:6px}
.card.done{opacity:.6}
.card .top{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}
.card h4{margin:0;font:600 1.2rem var(--serif)}
.card .preis{color:var(--sage);font-weight:600}
.card .notiz{color:var(--muted);font-size:.92rem;margin:0}
.card .acts{display:flex;gap:10px;align-items:center;margin-top:auto;padding-top:6px;font-size:.9rem}
.pill{border:1.5px solid var(--sage);color:var(--sage);background:transparent;border-radius:999px;padding:4px 12px;cursor:pointer;font:600 .85rem var(--sans)}
.card.done .pill{background:var(--sage);color:#fff}

.ideen li{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:10px 12px 10px 16px}
.ideen .t{flex:1}
.ideen small{color:var(--muted);display:block}
.herz{border:1.5px solid var(--rose);background:transparent;color:var(--rose-d);border-radius:999px;padding:6px 14px;cursor:pointer;font:600 .95rem var(--sans)}
.herz:hover{background:var(--rose);color:#fff}

.memories{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.mem{background:var(--card);border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column}
.mem img{width:100%;aspect-ratio:4/3;object-fit:cover}
.mem .b{padding:14px 16px;display:flex;flex-direction:column;gap:6px;flex:1}
.mem p{margin:0;white-space:pre-wrap}
.mem .d{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:.85rem;margin-top:auto}
.file{display:inline-block;border:1.5px dashed var(--rose);color:var(--rose-d);border-radius:12px;padding:10px 16px;cursor:pointer;font-weight:600;align-self:flex-start}
.file input{display:none}

.wetter{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));margin-top:18px}
.tag{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px;text-align:center}
.tag.pick{outline:2.5px solid var(--rose)}
.tag .e{font-size:2rem;line-height:1.2}
.tag .dt{font-weight:600;font-size:.9rem}
.tag .tp{font-family:var(--serif);font-size:1.2rem}
.tag .rn{color:var(--muted);font-size:.82rem}
.tipp{grid-column:1/-1;background:var(--card);border-left:4px solid var(--sage);border-radius:10px;padding:12px 16px}

footer{text-align:center;padding:40px 20px 60px;color:var(--muted);font-family:var(--serif);font-style:italic}
.credit{font:italic .78rem/1.5 var(--sans);max-width:62ch;margin:10px auto 0}
#toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);background:var(--ink);color:var(--bg);padding:10px 18px;border-radius:999px;opacity:0;transition:.25s;pointer-events:none;font-size:.9rem;z-index:9}
#toast.on{opacity:1;transform:translate(-50%,0)}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

.tabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 20px}
.tabs button{border:1.5px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:8px 18px;font:600 .92rem var(--sans);cursor:pointer}
.tabs button.on{background:var(--rose);border-color:var(--rose);color:#fff}
.akt{list-style:none;padding:0;margin:0;display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.ak{background:var(--card);border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column}
.ak.sel{outline:3px solid var(--rose)}
.ak img{width:100%;aspect-ratio:16/9;object-fit:cover}
.ak .ic{height:90px;display:grid;place-items:center;font-size:2.6rem;background:var(--tint)}
.ak .b{padding:14px 16px 16px;display:flex;flex-direction:column;gap:6px;flex:1}
.ak h4{margin:0;font:600 1.2rem/1.2 var(--serif)}
.ak p{margin:0;color:var(--muted);font-size:.93rem}
.ak .meta{display:flex;gap:8px;align-items:center;font-size:.8rem;color:var(--sage);font-weight:600;text-transform:uppercase;letter-spacing:.06em}
.ak .acts{display:flex;gap:10px;align-items:center;margin-top:auto;padding-top:8px;flex-wrap:wrap}
.ak.sel .pill{background:var(--rose);border-color:var(--rose);color:#fff}
.ak .pill{border-color:var(--rose);color:var(--rose-d)}
select{font:inherit;color:var(--ink);background:var(--card);border:1.5px solid var(--line);border-radius:12px;padding:11px 14px}

.filter{display:grid;gap:14px 24px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px 18px;margin:8px 0 14px;align-items:end}
.filter label{display:flex;flex-direction:column;gap:6px;font-size:.92rem;font-weight:600}
.filter input[type=range]{padding:0;accent-color:var(--rose);width:100%}
.filter .chk{flex-direction:row;align-items:center;gap:8px}
.filter .chk input{width:20px;height:20px;accent-color:var(--rose)}
.baeder{list-style:none;padding:0;margin:0 0 18px;display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.bd{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:16px 18px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:8px}
.bd.fav{outline:3px solid var(--rose)}
.bd .top{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}
.bd h4{margin:0;font:600 1.25rem/1.2 var(--serif)}
.bd .sub{color:var(--muted);font-size:.88rem}
.bd .bar{height:10px;border-radius:99px;background:var(--tint);overflow:hidden}
.bd .bar i{display:block;height:100%;background:linear-gradient(90deg,var(--sage),var(--rose));border-radius:99px}
.bd dl{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;margin:0;font-size:.92rem}
.bd dt{color:var(--muted)}.bd dd{margin:0;font-weight:600}
.bd p{margin:0;color:var(--muted);font-size:.88rem}
.bd .acts{display:flex;gap:10px;align-items:center;margin-top:auto;padding-top:6px}
.bd.fav .herz{background:var(--rose);color:#fff}

.checks2{grid-column:1/-1;display:flex;gap:16px;flex-wrap:wrap;align-items:center}
.chk{display:flex;align-items:center;gap:8px;font-weight:600;font-size:.92rem;cursor:pointer}
.chk input{width:20px;height:20px;accent-color:var(--rose)}
.baeder{grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}
.bd details{border-top:1px solid var(--line);padding-top:8px}
.bd summary{cursor:pointer;font-weight:600;color:var(--rose-d)}
.bd .dt h5{margin:12px 0 2px;font:600 .8rem var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--sage)}
.bd .dt p,.bd .dt ul{margin:0;font-size:.9rem;color:var(--ink)}
.bd .dt ul{padding-left:18px}
.bd .stand{color:var(--muted)!important;font-style:italic;margin-top:10px!important;font-size:.8rem!important}
.bd .acts{justify-content:space-between}
.vergleich{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:16px;margin:0 0 18px;box-shadow:var(--shadow);max-width:960px}
.vergleich .vh{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.vergleich h3{margin:0!important}
.tw{overflow-x:auto}
.vergleich table{border-collapse:collapse;min-width:640px;width:100%;font-size:.88rem}
.vergleich th,.vergleich td{border-top:1px solid var(--line);padding:8px 10px;text-align:left;vertical-align:top}
.vergleich thead th{border-top:0;font-family:var(--serif);font-size:1rem;color:var(--rose-d)}
.vergleich tbody th{color:var(--sage);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}