/* SLOPE EXPLAINERS */
.slope-explainer { display:grid; grid-template-columns:1fr 1fr; gap:2px; margin-bottom:48px; }
.slope-box { background:var(--surface); border:1px solid var(--border); padding:28px; position:relative; }
.slope-box.supply::before { content:''; position:absolute; top:0; left:0; width:3px; height:100%; background:var(--accent3); }
.slope-box.demand::before { content:''; position:absolute; top:0; left:0; width:3px; height:100%; background:var(--accent); }
.slope-box-tag { font-family:'Space Mono',monospace; font-size:9px; letter-spacing:0.3em; text-transform:uppercase; margin-bottom:10px; }
.slope-box.supply .slope-box-tag { color:var(--accent3); }
.slope-box.demand .slope-box-tag { color:var(--accent); }
.slope-box h4 { font-family:'Playfair Display',serif; font-size:18px; margin-bottom:10px; }
.slope-box p { font-size:13px; line-height:1.75; color:var(--muted); }
.slope-box .example { margin-top:12px; background:var(--inset-bg); border-left:2px solid var(--border); padding:10px 14px; font-size:12px; color:var(--example-color); font-style:italic; line-height:1.6; }

/* TWO-COL */
.two-col { display:grid; grid-template-columns:1fr 1fr; gap:48px; margin-bottom:48px; align-items:start; }
.content-block h4 { font-family:'Playfair Display',serif; font-size:20px; margin-bottom:12px; color:var(--text); margin-top:24px; }
.content-block h4:first-child { margin-top:0; }
.content-block p { font-size:14px; line-height:1.85; color:var(--content-color); margin-bottom:14px; }

/* CHART CARD */
.chart-card { background:var(--surface); border:1px solid var(--border); padding:28px 24px; }
.chart-card-label { font-family:'Space Mono',monospace; font-size:9px; letter-spacing:0.3em; text-transform:uppercase; color:var(--muted); margin-bottom:20px; }
.chart-wrapper { position:relative; height:300px; }

/* EFFECTS */
.effect-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:2px; margin-top:40px; }
.effect-chip { background:var(--surface); border:1px solid var(--border); padding:22px; position:relative; }
.effect-chip.negative::before { content:''; position:absolute; top:0; left:0; width:3px; height:100%; background:var(--accent); }
.effect-chip.positive::before { content:''; position:absolute; top:0; left:0; width:3px; height:100%; background:var(--accent3); }
.effect-chip-label { font-family:'Space Mono',monospace; font-size:9px; letter-spacing:0.3em; text-transform:uppercase; color:var(--muted); margin-bottom:8px; }
.effect-chip h5 { font-family:'Playfair Display',serif; font-size:16px; margin-bottom:8px; }
.effect-chip p { font-size:12px; line-height:1.7; color:var(--muted); }

/* INTERACTIVE */
.interactive-section { background:var(--surface); border:1px solid var(--border); padding:44px; margin-top:56px; }
.interactive-header { display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:36px; flex-wrap:wrap; gap:20px; }
.interactive-title { font-family:'Playfair Display',serif; font-size:26px; font-weight:700; }
.ctrl-tabs { display:flex; gap:2px; margin-top:8px; }
.ctrl-tab { font-family:'Space Mono',monospace; font-size:9px; letter-spacing:0.2em; text-transform:uppercase; padding:8px 18px; background:transparent; border:1px solid var(--border); color:var(--muted); cursor:pointer; transition:all 0.25s; }
.ctrl-tab:hover, .ctrl-tab.active { background:var(--accent); border-color:var(--accent); color:white; }

/* CONTROLS */
.controls-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(180px, 1fr)); gap:20px; margin-bottom:32px; }
.control-item label { display:block; font-family:'Space Mono',monospace; font-size:9px; letter-spacing:0.25em; text-transform:uppercase; color:var(--muted); margin-bottom:8px; }
.control-item .val { font-family:'Space Mono',monospace; font-size:17px; font-weight:700; color:var(--accent); margin-bottom:6px; }
.control-item .val.teal { color:var(--accent3); }
.control-item .val.gold { color:var(--gold); }
input[type=range] { width:100%; -webkit-appearance:none; height:2px; background:var(--range-bg); outline:none; cursor:pointer; touch-action:none; }
input[type=range]::-webkit-slider-thumb { -webkit-appearance:none; width:13px; height:13px; background:var(--accent); border-radius:0; cursor:pointer; transition:transform 0.15s; }
input[type=range]::-webkit-slider-thumb:hover { transform:scale(1.3); }
input[type=range]::-moz-range-thumb {
  width: 14px; height: 14px;
  background: var(--accent);
  border: none;
  border-radius: 50%;
  cursor: pointer;
  transition: transform 0.15s;
}
input[type=range]::-moz-range-thumb:hover {
  transform: scale(1.3);
}
input[type=range]::-moz-range-track {
  height: 3px;
  background: var(--border);
  border: none;
  border-radius: 2px;
}

/* CHART INTERACTIVE */
.interactive-chart-wrap { position:relative; height:420px; }

/* THREE-SECTOR GRID */
.three-sector-grid { display:grid; grid-template-columns:1fr 1fr 1fr; gap:12px; margin-bottom:16px; overflow:hidden; }
.mankiw-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:16px; overflow:hidden; position:relative; }
.mankiw-grid .sector-panel:nth-child(3) { grid-column:2; }
.mk-bridge { position:absolute; pointer-events:none; z-index:5; }
#mk-bridge-h { border-top:2px dotted rgba(255,209,102,0.6); }
#mk-bridge-v { border-left:2px dotted rgba(244,162,97,0.6); }
.sector-panel { background:var(--surface); border:1px solid var(--border); border-radius:4px; padding:10px 10px 8px; min-width:0; overflow:hidden; }
.sector-label { font-family:'Space Mono',monospace; font-size:8px; letter-spacing:0.15em; text-transform:uppercase; margin-bottom:4px; }
.sector-chart { position:relative; height:220px; }
.sector-stat { display:flex; justify-content:space-between; align-items:baseline; margin-top:6px; padding-top:6px; border-top:1px solid var(--border); }
.sector-stat-label { font-family:'Space Mono',monospace; font-size:7px; letter-spacing:0.1em; text-transform:uppercase; color:var(--muted); }
.sector-stat-val { font-family:'Playfair Display',serif; font-size:15px; font-weight:700; }
.stats-row { display:grid; grid-template-columns:repeat(4,1fr); gap:2px; margin-top:20px; }
.stat-box { background:var(--inset-bg); border:1px solid var(--border); padding:18px 20px; text-align:center; }
.stat-label { font-family:'Space Mono',monospace; font-size:8px; letter-spacing:0.25em; text-transform:uppercase; color:var(--muted); margin-bottom:6px; }
.stat-value { font-family:'Playfair Display',serif; font-size:22px; font-weight:700; color:var(--accent); }
.stat-value.good { color:var(--accent3); }
.stat-value.warn { color:var(--accent2); }
.stat-value.gold { color:var(--gold); }

/* EXPLAINER BOXES */
.explainer { background:linear-gradient(135deg, rgba(230,57,70,0.04), transparent); border:1px solid rgba(230,57,70,0.15); padding:24px; margin-top:20px; }
.explainer h5 { font-family:'Space Mono',monospace; font-size:9px; letter-spacing:0.3em; text-transform:uppercase; color:var(--accent); margin-bottom:10px; }
.explainer p { font-size:13px; line-height:1.8; color:var(--text-secondary); }

.big-quote { font-family:'Playfair Display',serif; font-size:clamp(18px,2vw,28px); font-style:italic; line-height:1.45; color:var(--muted); border-left:3px solid var(--accent); padding:4px 0 4px 28px; margin:48px 0; }
.big-quote small { font-size:13px; font-style:normal; color:var(--quote-small); display:block; margin-top:10px; }
.formula-box { background:var(--inset-bg); border:1px solid var(--border); padding:16px 24px; font-family:'Space Mono',monospace; font-size:12px; color:var(--accent2); margin:14px 0; letter-spacing:0.03em; line-height:1.7; }
.divider { height:1px; background:var(--border); margin:56px 0; }

/* ELASTICITY BOX */
.elasticity-box { background:var(--surface); border:1px solid var(--border); padding:28px 32px; margin-bottom:48px; display:grid; grid-template-columns:1fr 2fr; gap:32px; align-items:start; }
.elasticity-box-label { font-family:'Space Mono',monospace; font-size:9px; letter-spacing:0.35em; text-transform:uppercase; color:var(--accent2); margin-bottom:10px; }
.elasticity-box h4 { font-family:'Playfair Display',serif; font-size:18px; margin-bottom:8px; }
.elasticity-box > div > p { font-size:13px; line-height:1.8; color:var(--text-secondary); }
.elasticity-scale { display:flex; flex-direction:column; gap:10px; }
.elasticity-row { display:flex; align-items:center; gap:12px; }
.e-bar-wrap { flex:1; height:5px; background:var(--ebar-bg); }
.e-bar { height:100%; }
.e-label { font-family:'Space Mono',monospace; font-size:9px; color:var(--muted); width:130px; flex-shrink:0; }
.e-val { font-family:'Space Mono',monospace; font-size:9px; width:32px; text-align:right; flex-shrink:0; color:var(--accent2); }

/* MONOPSONY SECTION */
.mono-section { background:linear-gradient(135deg, rgba(46,196,182,0.04), transparent); border:1px solid rgba(46,196,182,0.18); padding:40px; margin:48px 0; }
.mono-tag { font-family:'Space Mono',monospace; font-size:9px; letter-spacing:0.35em; text-transform:uppercase; color:var(--accent3); margin-bottom:12px; }
.mono-title { font-family:'Playfair Display',serif; font-size:28px; font-weight:700; margin-bottom:8px; }
.mono-intro { font-size:14px; line-height:1.8; color:var(--text-secondary); margin-bottom:28px; max-width:700px; }
.mono-grid { display:grid; grid-template-columns:1fr 1fr; gap:2px; }
.mono-box { background:var(--box-bg); border:1px solid rgba(46,196,182,0.1); padding:24px; }
.mono-box h5 { font-family:'Playfair Display',serif; font-size:16px; margin-bottom:8px; color:var(--accent3); }
.mono-box p { font-size:13px; line-height:1.75; color:var(--text-box); }

/* BALANCED SECTION */
.balanced-section { background:linear-gradient(135deg, rgba(255,209,102,0.04), transparent); border:1px solid rgba(255,209,102,0.16); padding:40px; margin:48px 0; }
.balanced-tag { font-family:'Space Mono',monospace; font-size:9px; letter-spacing:0.35em; text-transform:uppercase; color:var(--gold); margin-bottom:12px; }
.balanced-title { font-family:'Playfair Display',serif; font-size:24px; font-weight:700; margin-bottom:8px; }
.balanced-intro { font-size:14px; line-height:1.8; color:var(--text-secondary); margin-bottom:24px; }
.balanced-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:2px; }
.balanced-box { background:var(--box-bg); border:1px solid rgba(255,209,102,0.1); padding:22px; }
.balanced-box h6 { font-family:'Playfair Display',serif; font-size:15px; margin-bottom:8px; color:var(--gold); }
.balanced-box p { font-size:12px; line-height:1.7; color:var(--text-box); }

/* DYNAMIC EXPLANATION */
.dyn-explain { margin-top:14px; padding:12px 18px; font-size:13px; line-height:1.65; border-left:3px solid var(--border); color:var(--muted); font-style:italic; transition:border-color 0.3s, color 0.3s; }
.dyn-explain.warn  { border-left-color:var(--accent2); color:var(--accent2); }
.dyn-explain.bad   { border-left-color:var(--accent);  color:var(--accent); }
.dyn-explain.good  { border-left-color:var(--accent3); color:var(--accent3); }

/* LEGEND */
.chart-legend { display:flex; flex-wrap:wrap; gap:14px; margin-top:14px; }
.legend-item { display:flex; align-items:center; gap:7px; font-family:'Space Mono',monospace; font-size:9px; letter-spacing:0.15em; color:var(--muted); }
.legend-dot { width:20px; height:3px; border-radius:1px; flex-shrink:0; }
.legend-dot.dashed { background:none; border-bottom:2px dashed; opacity:0.6; }

/* MODEL INFO BOX */
.model-info-box { display:grid; grid-template-columns:1fr 1fr; gap:2px; margin:40px 0 52px; }
.model-info-cell { padding:24px 28px; }
.model-info-cell.limits { background:linear-gradient(135deg, rgba(244,162,97,0.06), transparent); border:1px solid rgba(244,162,97,0.2); }
.model-info-cell.equil  { background:linear-gradient(135deg, rgba(46,196,182,0.06), transparent); border:1px solid rgba(46,196,182,0.2); }
.model-info-cell-tag { font-family:'Space Mono',monospace; font-size:9px; letter-spacing:0.35em; text-transform:uppercase; margin-bottom:10px; }
.model-info-cell.limits .model-info-cell-tag { color:var(--accent2); }
.model-info-cell.equil  .model-info-cell-tag { color:var(--accent3); }
.model-info-cell h5 { font-family:'Playfair Display',serif; font-size:17px; margin-bottom:10px; }
.model-info-cell p  { font-size:13px; line-height:1.8; color:#9090a8; }
.model-info-cell .model-example { margin-top:12px; background:var(--bg); border-left:2px solid var(--border); padding:10px 14px; font-size:12px; color:#7878a0; font-style:italic; line-height:1.6; }
@media (max-width:700px) { .model-info-box { grid-template-columns:1fr; } }

/* RENTE BREAKDOWN */
.rente-step-grid { display:grid; grid-template-columns:auto 1fr auto; gap:8px 14px; align-items:start; }
.rente-step-num  { font-family:'Space Mono',monospace; font-size:10px; padding-top:3px; }
.rente-step-calc { font-family:'Space Mono',monospace; white-space:nowrap; padding-top:3px; text-align:right; }
@media (max-width:900px) {
  .rente-breakdown-grid { grid-template-columns:1fr !important; }
  .rente-step-grid { grid-template-columns:auto 1fr; gap:6px 10px; }
  .rente-step-calc { grid-column:1/-1; text-align:left; background:rgba(255,255,255,0.04); border-radius:4px; padding:8px 10px; margin-bottom:8px; white-space:normal; }
}

/* RESET BUTTON */
.sim-reset-btn {
  background: transparent;
  border: 1px solid var(--border);
  color: var(--muted);
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 6px 14px;
  cursor: pointer;
  transition: all 0.2s ease;
  margin-bottom: 16px;
}
.sim-reset-btn:hover {
  border-color: var(--accent);
  color: var(--accent);
}

/* ══ MOBILE — simulator overrides ═════════════════════════════════ */
@media (max-width: 900px) {
  .slope-explainer, .two-col, .effect-grid,
  .mono-grid, .balanced-grid { grid-template-columns: 1fr; }

  .stat-value { font-size: 20px; }
  .interactive-title { font-size: 20px; }

  /* ── LAYOUT ── */
  .elasticity-box { grid-template-columns: 1fr; gap: 16px; padding: 18px; }
  .mono-section, .balanced-section { padding: 20px 14px; }
  .stats-row { grid-template-columns: repeat(2, 1fr); }
  .controls-grid { grid-template-columns: 1fr 1fr; gap: 14px; }
  .interactive-section { padding: 20px 14px; }
  .interactive-chart-wrap { height: 250px; }
  .chart-wrapper { height: 200px; }
  .three-sector-grid, .mankiw-grid { gap:8px; }
  .sector-chart { height:180px; }
  .sector-panel { padding:8px 8px 6px; }
  .sector-label { font-size:7px; }
  .sector-stat-val { font-size:13px; }

  /* ── BOXES ── */
  .mono-box, .balanced-box, .effect-chip { padding: 16px; }
  .mono-box h5, .balanced-box h6 { margin-bottom: 6px; }
  .mono-box p, .balanced-box p { margin: 0; }
}

@media (max-width: 480px) {
  /* ── CONTROLS ── */
  .controls-grid { grid-template-columns: 1fr; }
  .stats-row { grid-template-columns: 1fr 1fr; }
  .three-sector-grid, .mankiw-grid { gap:6px; }
  .sector-chart { height:150px; }
  .sector-panel { padding:6px 6px 4px; }
  .sector-label { font-size:6px; letter-spacing:0.08em; }
  .sector-stat-label { font-size:6px; }
  .sector-stat-val { font-size:11px; }

  .stat-value { font-size: 18px; }
}

/* GLOBAL MOBILE FIX — fehlende Grid-Klassen */
@media (max-width:900px) {
  .slope-explainer   { grid-template-columns: 1fr !important; }
  .two-col           { grid-template-columns: 1fr !important; }
  .effect-grid       { grid-template-columns: 1fr !important; }
  .elasticity-box    { grid-template-columns: 1fr !important; flex-direction: column; }
  .mono-grid         { grid-template-columns: 1fr !important; }
  .model-info-box    { grid-template-columns: 1fr !important; }
  .balanced-grid     { grid-template-columns: 1fr !important; }
  .mankiw-grid       { grid-template-columns: 1fr !important; }
  .section           { padding: 48px 20px; }
  .section-title     { font-size: clamp(28px, 7vw, 56px); }
  .big-quote         { font-size: clamp(16px, 4.5vw, 22px); padding: 32px 24px; }
  .chart-card        { padding: 16px; }
  .formula-box       { font-size: 12px; padding: 12px 14px; }
  .dyn-explain       { padding: 14px 16px; font-size: 13px; }
}
@media (max-width:480px) {
  .slope-explainer   { gap: 16px; }
  .section           { padding: 36px 14px; }
  .section-title     { font-size: clamp(24px, 8.5vw, 42px); }
  .elasticity-scale  { padding: 16px 14px; }
  .model-info-cell   { padding: 18px 16px; }
}