/* retro.css — Win95 Vibes */
:root{
  --bg:#c0c0c0; --fg:#000; --muted:#3a3a3a; --acc:#000080;
  --light:#fff; --shadow:#808080; --dark:#404040;
}
body.win95{background:var(--bg); color:var(--fg); font:14px/1.4 Tahoma, Verdana, Arial, sans-serif;}
header.titlebar{
  background:linear-gradient(#000080,#000060);
  color:#fff; padding:6px 10px; border:2px solid var(--dark);
  box-shadow:inset 1px 1px 0 var(--light), inset -1px -1px 0 var(--shadow);
}
header.titlebar .brand a{color:#fff; text-decoration:none; font-weight:700}
header.titlebar nav a{color:#fff; text-decoration:none; margin-left:10px}
.wrap{max-width:980px; margin:0 auto; padding:10px}

.window{
  background:#d4d0c8; padding:10px; margin:12px 0;
  border:2px solid var(--dark);
  box-shadow:inset 1px 1px 0 var(--light), inset -1px -1px 0 var(--shadow);
}
.window .title{background:#000080; color:#fff; padding:4px 6px; margin:-10px -10px 10px -10px; font-weight:700}

.card{
  background:#d4d0c8; border:2px solid var(--dark);
  box-shadow:inset 1px 1px 0 var(--light), inset -1px -1px 0 var(--shadow);
  border-radius:0; padding:10px;
}

input, textarea, select{
  width:100%; padding:6px; background:#fff; color:#000;
  border:2px solid var(--dark);
  box-shadow:inset 1px 1px 0 var(--light), inset -1px -1px 0 var(--shadow);
  border-radius:0; outline:none;
}
textarea{min-height:120px}

.btn, button, .linklike{
  display:inline-block; padding:6px 10px; background:#d4d0c8; color:#000; text-decoration:none; border:2px solid var(--dark);
  box-shadow:inset 1px 1px 0 var(--light), inset -1px -1px 0 var(--shadow);
  cursor:pointer; border-radius:0;
}
.btn:hover, button:hover{filter:brightness(0.97)}
.btn:active, button:active{
  box-shadow:inset -1px -1px 0 var(--light), inset 1px 1px 0 var(--shadow);
}

.small{font-size:12px; color:var(--muted)}
.text-muted{color:var(--muted)}
.logo-wrap{display:flex;align-items:center;justify-content:center;min-height:90px;background:#fff;border:1px solid var(--shadow)}

.badge{display:inline-block;padding:2px 8px;border:2px solid var(--dark);box-shadow:inset 1px 1px 0 var(--light), inset -1px -1px 0 var(--shadow);background:#e6e6e6;margin-left:6px}
.badge-outline{background:#d4d0c8}
/* --- Win95 Dashboard Tiles --- */
.deskgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
.tile{background:#d4d0c8;border:2px solid var(--dark);
  box-shadow:inset 1px 1px 0 var(--light), inset -1px -1px 0 var(--shadow);padding:0}
.tile .tile-head{background:#000080;color:#fff;padding:6px 8px;font-weight:700}
.tile .tile-body{padding:10px}
.tile-list{list-style:none;margin:0;padding:0}
.tile-list li{margin:6px 0}
.thumb-row{display:flex;flex-wrap:wrap;gap:8px}
.thumb{display:flex;align-items:center;justify-content:center;width:72px;height:72px;background:#fff;border:1px solid var(--shadow)}
.thumb img{max-width:100%;max-height:100%}
.link-row{margin-top:8px}
.link-row a{margin-right:8px}
/* --- Win95 Icons (16x16) --- */
.icon{display:inline-block;width:16px;height:16px;margin-right:6px;vertical-align:-2px;background-size:16px 16px;background-repeat:no-repeat}
.icon-news{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"><rect width="16" height="16" fill="%23ffffff"/><rect x="1" y="1" width="14" height="14" fill="none" stroke="%23000"/><rect x="3" y="3" width="10" height="2" fill="%23000"/><rect x="3" y="6" width="8" height="2" fill="%23000"/><rect x="3" y="9" width="9" height="2" fill="%23000"/></svg>');}
.icon-sponsors{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"><rect width="16" height="16" fill="%23ffffff"/><circle cx="5" cy="6" r="3" fill="%23000"/><circle cx="11" cy="10" r="3" fill="%23000"/></svg>');}
.icon-partners{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"><rect width="16" height="16" fill="%23ffffff"/><path d="M3 3h4v4H3zM9 9h4v4H9zM4 9l8-6" stroke="%23000" fill="none"/></svg>');}
/* Icon leicht justieren in der Fenster-Titlebar */
.window .title .icon{margin-right:6px;vertical-align:-3px}

/* Zusätzliche 16x16 SVG-Icons (Win95-Style, schwarz/weiß) */
.icon{display:inline-block;width:16px;height:16px;background-size:16px 16px;background-repeat:no-repeat}

/* Haus / Home */
.icon-home{background-image:url('data:image/svg+xml;utf8,\
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16">\
<rect width="16" height="16" fill="%23fff"/><path d="M2 8 L8 3 L14 8" fill="none" stroke="%23000"/>\
<rect x="4" y="8" width="8" height="6" fill="none" stroke="%23000"/>\
<rect x="7" y="10" width="2" height="4" fill="%23000"/>\
</svg>');}

/* News (schon vorhanden in den Tiles, hier nochmals falls noch nicht) */
.icon-news{background-image:url('data:image/svg+xml;utf8,\
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16">\
<rect width="16" height="16" fill="%23ffffff"/><rect x="1" y="1" width="14" height="14" fill="none" stroke="%23000"/>\
<rect x="3" y="3" width="10" height="2" fill="%23000"/><rect x="3" y="6" width="8" height="2" fill="%23000"/><rect x="3" y="9" width="9" height="2" fill="%23000"/>\
</svg>');}

/* Sponsoren (2 Scheiben) */
.icon-sponsors{background-image:url('data:image/svg+xml;utf8,\
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16">\
<rect width="16" height="16" fill="%23ffffff"/><circle cx="5" cy="6" r="3" fill="%23000"/><circle cx="11" cy="10" r="3" fill="%23000"/>\
</svg>');}

/* Partner (Kacheln & Verbindung) */
.icon-partners{background-image:url('data:image/svg+xml;utf8,\
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16">\
<rect width="16" height="16" fill="%23ffffff"/><path d="M3 3h4v4H3zM9 9h4v4H9zM4 9l8-6" stroke="%23000" fill="none"/>\
</svg>');}

/* Presse (Ausweis) */
.icon-press{background-image:url('data:image/svg+xml;utf8,\
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16">\
<rect width="16" height="16" fill="%23fff"/><rect x="2" y="3" width="12" height="10" fill="none" stroke="%23000"/>\
<rect x="3" y="4" width="4" height="4" fill="%23000"/><rect x="8" y="5" width="5" height="2" fill="%23000"/>\
<rect x="8" y="8" width="6" height="3" fill="none" stroke="%23000"/>\
</svg>');}

/* Admin (Zahnrad) */
.icon-admin{background-image:url('data:image/svg+xml;utf8,\
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16">\
<rect width="16" height="16" fill="%23fff"/><circle cx="8" cy="8" r="2" fill="%23000"/>\
<path d="M8 2v2M8 12v2M2 8h2M12 8h2M4 4l1.5 1.5M10.5 10.5L12 12M12 4l-1.5 1.5M4 12l1.5-1.5" stroke="%23000"/>\
</svg>');}

/* User (Kopf & Schultern) */
.icon-user{background-image:url('data:image/svg+xml;utf8,\
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16">\
<rect width="16" height="16" fill="%23fff"/><circle cx="8" cy="6" r="3" fill="none" stroke="%23000"/>\
<path d="M3 13c2-3 8-3 10 0" fill="none" stroke="%23000"/>\
</svg>');}

/* Login (Schlüssel) */
.icon-key{background-image:url('data:image/svg+xml;utf8,\
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16">\
<rect width="16" height="16" fill="%23fff"/><circle cx="6" cy="8" r="3" fill="none" stroke="%23000"/>\
<path d="M9 8h5M12 8v3M14 8v2" stroke="%23000"/>\
</svg>');}

/* Dashboard (Monitor) */
.icon-dashboard{background-image:url('data:image/svg+xml;utf8,\
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16">\
<rect width="16" height="16" fill="%23fff"/><rect x="2" y="3" width="12" height="8" fill="none" stroke="%23000"/>\
<rect x="6" y="12" width="4" height="1" fill="%23000"/>\
</svg>');}
/* --- Window Controls + Taskbar --- */
.window{position:relative}
.win-controls{position:absolute; right:6px; top:6px; display:flex; gap:4px}
.win-btn{
  width:20px;height:18px;line-height:16px;text-align:center;font:12px/16px monospace;
  background:#d4d0c8;border:2px solid var(--dark);
  box-shadow:inset 1px 1px 0 var(--light), inset -1px -1px 0 var(--shadow);
  cursor:pointer;padding:0;border-radius:0;
}
.win-btn:active{box-shadow:inset -1px -1px 0 var(--light), inset 1px 1px 0 var(--shadow)}
.window-body.hidden{display:none}

/* Maximieren */
main.wrap.wide{max-width:100%}
main.wrap.wide .window{margin:0}

/* Taskbar */
body.has-taskbar{padding-bottom:36px}
.taskbar{
  position:fixed; left:0; right:0; bottom:0; z-index:999;
  background:#c0c0c0; border-top:2px solid var(--dark);
  box-shadow:inset 1px 1px 0 var(--light), inset -1px -1px 0 var(--shadow);
  padding:4px 8px; display:flex; gap:8px; align-items:center;
}
.taskbar .tb-btn{
  padding:4px 10px; background:#d4d0c8; border:2px solid var(--dark);
  box-shadow:inset 1px 1px 0 var(--light), inset -1px -1px 0 var(--shadow);
  font-size:13px; cursor:pointer;
}
.taskbar .tb-btn:active{box-shadow:inset -1px -1px 0 var(--light), inset 1px 1px 0 var(--shadow)}
/* Breadcrumbs */
.breadcrumbs{margin:8px 0 10px; font-size:13px}
.breadcrumbs a{color:#000080; text-decoration:none}
.breadcrumbs .sep{margin:0 6px; color:#666}
/* --- Home Hero (Win95 + modern) --- */
.hero95{
  background:#d4d0c8;
  border:2px solid var(--dark);
  box-shadow:inset 1px 1px 0 var(--light), inset -1px -1px 0 var(--shadow);
  padding:14px; margin-bottom:12px;
}
.hero95 .head{
  display:flex; align-items:center; gap:8px;
  background:#000080; color:#fff; padding:6px 8px; font-weight:700;
  margin:-14px -14px 12px -14px;
}
.hero95 .title{font-size:20px; font-weight:700}
.hero95 .lead{font-size:14px; color:#222}
.hero95 .cta-row{display:flex; flex-wrap:wrap; gap:8px; margin-top:10px}
.pills{display:flex; flex-wrap:wrap; gap:6px; margin-top:8px}
.pill{
  padding:2px 8px; background:#e6e6e6; border:2px solid var(--dark);
  box-shadow:inset 1px 1px 0 var(--light), inset -1px -1px 0 var(--shadow);
  font-size:12px;
}

/* Spalten */
.columns{display:grid; grid-template-columns:1fr; gap:12px}
@media (min-width:800px){ .columns{grid-template-columns:1.2fr .8fr} }

/* 3D Trenner */
.divider-3d{height:2px; background:linear-gradient(#fff,#808080); margin:12px 0}
