h1{font-family:'Playfair Display',serif;font-size:2.2rem;color:var(--brown-dark);text-align:center}
h2{font-size:1.4rem;color:var(--brown);margin:2.5rem 0 1rem;text-align:center}
h3{font-size:1.1rem;color:var(--brown-dark);margin:1rem 0 .5rem}
p.sub{text-align:center;color:var(--text-light);margin-bottom:2rem;font-size:1rem}

/* COMIC PANEL */
.comic{border:3px solid var(--brown-dark);border-radius:var(--radius);overflow:hidden;margin-bottom:2rem;position:relative}
.comic-panel{display:flex;min-height:200px;align-items:stretch}
.comic-img{flex:0 0 280px;background:var(--cream);display:flex;align-items:center;justify-content:center;font-size:5rem;position:relative;overflow:hidden}
.comic-body{flex:1;padding:1.5rem;display:flex;flex-direction:column;justify-content:center}
.comic-speech{position:relative;background:var(--white);border:2px solid var(--brown);border-radius:var(--radius);padding:1rem 1.2rem;font-size:.9rem;line-height:1.6;margin-bottom:1rem}
.comic-speech::after{content:'';position:absolute;bottom:-12px;left:40px;width:0;height:0;border-left:12px solid transparent;border-right:12px solid transparent;border-top:12px solid var(--white)}
.comic-caption{font-size:.8rem;color:var(--text-light);font-style:italic}
.comic-num{position:absolute;top:8px;right:8px;background:var(--brown-dark);color:var(--gold);width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:900}
.comic-wide{flex-direction:column}
.comic-wide .comic-img{flex:0 0 200px}
@media(max-width:600px){.comic-panel{flex-direction:column}.comic-img{flex:0 0 150px}}

/* COLOR SKETCH (CSS Art) */
.sketch{width:100%;max-width:260px;aspect-ratio:1;border-radius:var(--radius-sm);position:relative;overflow:hidden}
.sketch-aktenmappe{background:linear-gradient(135deg,var(--brown-light),var(--brown));border:3px solid var(--brown-dark)}
.sketch-aktenmappe::before{content:'📋';position:absolute;top:30%;left:50%;transform:translateX(-50%);font-size:4rem}
.sketch-aktenmappe::after{content:'Amts-Würstchen';position:absolute;bottom:15%;left:50%;transform:translateX(-50%);font-family:'Playfair Display',serif;font-size:1rem;font-weight:900;color:var(--gold);white-space:nowrap}
.sketch-trophy{background:linear-gradient(180deg,var(--gold),#FF8F00);border:3px solid var(--brown-dark);border-radius:var(--radius-sm) var(--radius-sm) 50% 50%}
.sketch-trophy::before{content:'🏆';position:absolute;top:25%;left:50%;transform:translateX(-50%);font-size:4rem}
.sketch-trophy::after{content:'DAS TRIO';position:absolute;bottom:12%;left:50%;transform:translateX(-50%);font-weight:900;font-size:1rem;color:var(--brown-dark)}
.sketch-stempel{background:linear-gradient(180deg,var(--brown-dark) 30%,var(--red) 30%,var(--red));border-radius:50% 50% 20% 20%;border:3px solid var(--brown-dark)}
.sketch-stempel::before{content:'🔴';position:absolute;top:40%;left:50%;transform:translateX(-50%);font-size:3rem}
.sketch-stempel::after{content:'Genehmigt!';position:absolute;bottom:10%;left:50%;transform:translateX(-50%);font-weight:900;font-size:.8rem;color:var(--cream)}
.sketch-antrag{background:var(--white);border:3px solid var(--brown-dark);position:relative}
.sketch-antrag::before{content:'';position:absolute;top:20px;left:15px;right:15px;height:2px;background:repeating-linear-gradient(90deg,var(--brown-light) 0,var(--brown-light) 4px,transparent 4px,transparent 8px)}
.sketch-antrag::after{content:'Nr. 42 ✅';position:absolute;bottom:15%;left:50%;transform:translateX(-50%);font-weight:900;font-size:1.2rem;color:var(--green)}
.sketch-quittung{background:#FFF8E1;border:2px dashed var(--brown-light);font-family:'Courier New',monospace;font-size:.7rem;padding:12px;line-height:1.6;color:var(--brown)}
.sketch-dossier{background:linear-gradient(180deg,var(--brown),var(--brown-dark));border:3px solid var(--brown-dark);border-radius:var(--radius-sm) var(--radius-sm) 0 0}
.sketch-dossier::before{content:'💼';position:absolute;top:30%;left:50%;transform:translateX(-50%);font-size:3.5rem}
.sketch-dossier::after{content:'VERTRAULICH';position:absolute;bottom:15%;left:50%;transform:translateX(-50%);font-weight:900;font-size:.8rem;color:var(--gold);letter-spacing:.1em}

/* CALENDAR */
.cal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem}
.cal-card{background:var(--bg);border-radius:var(--radius-sm);padding:1rem;text-align:center;border:2px solid #E0E0E0;transition:all .2s}
.cal-card:hover{border-color:var(--brown);transform:translateY(-2px)}
.cal-card.active{border-color:var(--green);background:var(--green-bg)}
.cal-card.coming{border-style:dashed;border-color:var(--gold)}
.cal-date{font-weight:900;color:var(--brown-dark);font-size:.9rem}
.cal-loc{font-size:.75rem;color:var(--text-light);margin-top:2px}
.cal-badge{font-size:.6rem;padding:2px 6px;border-radius:8px;font-weight:600;margin-top:4px;display:inline-block}
.cal-badge.now{background:var(--green);color:#fff}
.cal-badge.soon{background:var(--gold);color:var(--brown-dark)}
.cal-badge.future{background:#E3F2FD;color:#1565C0}
@media(max-width:600px){.cal-grid{grid-template-columns:1fr 1fr}}

/* CTA */
.cta{text-align:center;margin:2rem 0}
.cta-btn{display:inline-block;padding:14px 32px;background:var(--green);color:#fff;border:none;border-radius:30px;font-size:1.1rem;font-weight:700;text-decoration:none;cursor:pointer;transition:all .2s;box-shadow:0 4px 16px rgba(46,125,50,.3)}
.cta-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(46,125,50,.4)}
.cta-btn.orange{background:var(--orange);box-shadow:0 4px 16px rgba(230,81,0,.3)}
.cta-btn.orange:hover{box-shadow:0 6px 20px rgba(230,81,0,.4)}

/* CALLOUT */
.co{padding:1rem;border-radius:var(--radius-sm);font-size:.85rem;display:flex;align-items:flex-start;gap:10px;margin:1rem 0}
.co-green{background:var(--green-bg);color:var(--green);border-left:3px solid var(--green)}
.co-brown{background:var(--cream);color:var(--brown);border-left:3px solid var(--brown)}
.co-orange{background:#FFF3E0;color:var(--orange);border-left:3px solid var(--orange)}

/* FUTURE MAP */
.future-map{background:linear-gradient(135deg,var(--brown-dark),var(--brown));color:#fff;border-radius:var(--radius);padding:2rem;text-align:center}
.future-map h3{color:var(--gold);font-size:1.2rem;margin-bottom:1rem}
.future-stops{display:flex;flex-wrap:wrap;gap:.8rem;justify-content:center}
.future-stop{background:rgba(255,255,255,.1);border-radius:var(--radius-sm);padding:.8rem 1rem;min-width:120px}
.future-stop .city{font-weight:700;font-size:.9rem}.future-stop .when{font-size:.75rem;opacity:.7}

/* FOOTER */
.ft{text-align:center;padding:1.5rem 0;font-size:.75rem;color:#9E9E9E}
.ft a{color:var(--brown);text-decoration:none}
