/* WettLogik — Regelbuch für Wettarten und Casino-Bedingungen */
:root {
  --paper: #f6f3ec;
  --paper-deep: #ece6d8;
  --card: #fffdf8;
  --ink: #14213d;
  --ink-soft: #3d4a63;
  --muted: #6b7385;
  --rule: #d9d1bf;
  --pitch: #0b6e4f;
  --pitch-deep: #08523b;
  --pitch-tint: #e3f1ea;
  --card-yellow: #f2c230;
  --yellow-tint: #fbf1cf;
  --card-red: #b8322a;
  --red-tint: #f8e3e0;

  --f-head: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --f-body: "Source Serif 4", Georgia, "Times New Roman", serif;
  --f-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

  --wrap: 1120px;
  --text: 100%;
  --r: 4px;
}

*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; padding: 0; }

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  background: var(--paper);
  color: var(--ink);
  font-family: var(--f-body);
  font-size: 1.0625rem;
  line-height: 1.7;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  -webkit-font-smoothing: antialiased;
}
main { flex: 1; }

img, svg { max-width: 100%; height: auto; display: block; }
a { color: var(--pitch); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--pitch-deep); text-decoration-thickness: 2px; }
:focus-visible { outline: 3px solid var(--card-yellow); outline-offset: 2px; }
strong, b { font-weight: 600; }

h1, h2, h3, h4, .me3001a, .f3fd588, .rccca01 {
  font-family: var(--f-head);
  color: var(--ink);
  line-height: 1.2;
  letter-spacing: -0.01em;
}
h1 { font-size: clamp(1.9rem, 4.4vw, 3.1rem); font-weight: 800; letter-spacing: -0.02em; }
h2 { font-size: clamp(1.35rem, 2.4vw, 1.75rem); font-weight: 700; margin-bottom: 0.9rem; }
h3 { font-size: 1.1rem; font-weight: 700; }
p + p { margin-top: 0.9rem; }

.z953e22 { width: 100%; max-width: var(--wrap); margin: 0 auto; padding: 0 20px; }

/* ── Header ───────────────────────────────────────── */
.ca28c4a {
  position: sticky; top: 0; z-index: 50;
  background: var(--ink);
  border-bottom: 4px solid var(--pitch);
}
.h66970e { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; min-height: 64px; }
.g1858fa {
  font-family: var(--f-head); font-weight: 800; font-size: 1.35rem;
  color: #fff; text-decoration: none; letter-spacing: -0.02em;
  display: inline-flex; align-items: center; gap: 0.1rem;
}
.g1858fa span { color: var(--card-yellow); }
.g1858fa::before {
  content: ""; width: 12px; height: 17px; border-radius: 2px;
  background: var(--card-yellow); margin-right: 0.55rem; transform: rotate(-8deg);
}
.g1858fa:hover { color: #fff; }
.de047a3 { display: flex; gap: 0.25rem; flex-wrap: wrap; }
.de047a3 a {
  font-family: var(--f-head); font-weight: 500; font-size: 0.92rem;
  color: #d6dcea; text-decoration: none;
  padding: 0.7rem 0.75rem; min-height: 44px; display: inline-flex; align-items: center;
  border-radius: var(--r);
}
.de047a3 a:hover { color: #fff; background: rgba(255,255,255,0.08); }
.bd07eca {
  display: none; width: 48px; height: 48px; border: 1px solid rgba(255,255,255,0.25);
  background: transparent; border-radius: var(--r); cursor: pointer;
  flex-direction: column; justify-content: center; align-items: center; gap: 5px;
}
.a08fd44 { display: block; width: 22px; height: 2px; background: #fff; transition: transform .2s ease, opacity .2s ease; }
.bd07eca[aria-expanded="true"] .a08fd44:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.bd07eca[aria-expanded="true"] .a08fd44:nth-child(2) { opacity: 0; }
.bd07eca[aria-expanded="true"] .a08fd44:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ── Hero ─────────────────────────────────────────── */
.lbe6292 {
  background:
    linear-gradient(90deg, transparent calc(50% - 1px), rgba(255,255,255,0.07) calc(50% - 1px), rgba(255,255,255,0.07) calc(50% + 1px), transparent calc(50% + 1px)),
    radial-gradient(circle at 50% 50%, transparent 118px, rgba(255,255,255,0.07) 119px, rgba(255,255,255,0.07) 121px, transparent 122px),
    linear-gradient(160deg, #0d5a42 0%, var(--pitch-deep) 55%, #063d2c 100%);
  color: #fff;
  padding: clamp(2.5rem, 6vw, 4.5rem) 0 clamp(2rem, 5vw, 3.25rem);
}
.lbe6292 h1 { color: #fff; max-width: 22ch; margin-bottom: 1.1rem; overflow-wrap: anywhere; hyphens: auto; }
.t99c4f2 { color: #d9ece3; font-size: 1.12rem; max-width: 62ch; }
.pe69565 {
  display: flex; flex-wrap: wrap; gap: 0.5rem 1.75rem;
  margin-top: 1.5rem; padding-top: 1rem; border-top: 1px solid rgba(255,255,255,0.18);
  font-size: 0.9rem;
}
.pe69565 { list-style: none; }
.pe69565 li { display: flex; flex-direction: column; }
.eb34cda { font-family: var(--f-head); font-size: 0.7rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--card-yellow); }
.i4cd437 { color: #fff; }
.pe69565 a { color: #fff; }
.r56e4f9 { list-style: none; display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 1.6rem; }

/* ── Buttons ──────────────────────────────────────── */
.a9f88c2 {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
  min-height: 48px; padding: 0.75rem 1.35rem;
  font-family: var(--f-head); font-weight: 700; font-size: 0.98rem; line-height: 1.2;
  text-decoration: none; text-align: center; border-radius: var(--r);
  border: 2px solid transparent; cursor: pointer;
  transition: transform .15s ease, background-color .15s ease, box-shadow .15s ease;
}
.a9f88c2:active { transform: translateY(1px); }
.t9a3c35 { background: var(--card-yellow); color: var(--ink); box-shadow: 0 3px 0 #b8901c; }
.t9a3c35:hover { background: #f6cf52; color: var(--ink); }
.abe4545, .u630c20 { background: transparent; color: inherit; border-color: currentColor; }
.lbe6292 .abe4545 { color: #fff; border-color: rgba(255,255,255,0.6); }
.lbe6292 .abe4545:hover { background: rgba(255,255,255,0.1); color: #fff; }
.abe4545:hover, .u630c20:hover { background: var(--pitch-tint); color: var(--pitch-deep); }

/* ── Breadcrumb ───────────────────────────────────── */
.t4656e3 { padding-top: 1rem; padding-bottom: 0.25rem; }
.m72605e { list-style: none; display: flex; flex-wrap: wrap; gap: 0.4rem; font-family: var(--f-head); font-size: 0.85rem; color: var(--muted); }
.m72605e a { color: var(--muted); }

/* ── Content flow ─────────────────────────────────── */
main > .z953e22 > section,
main > .z953e22 > aside { margin: 2.5rem 0; }
main > .z953e22 > section > p,
main > .z953e22 > section > ul:not(.p6922ef):not(.z5f96ea):not(.n45b83a) { max-width: var(--text); }


.vc94bae {
  background: var(--yellow-tint);
  border: 1px solid #e8d48f;
  border-radius: 6px;
  padding: 1.35rem 1.5rem;
  font-size: 1.1rem;
}
.zf87913, .ba8ff70 .me3001a + .o61ba35 { color: var(--muted); }
.zf87913 {
  font-family: var(--f-head); font-size: 0.75rem; font-weight: 700;
  letter-spacing: 0.14em; text-transform: uppercase; color: var(--pitch); margin-bottom: 0.4rem;
}
.vc94bae p { max-width: none; }

.e0de9a6 { border-top: 2px solid var(--ink); padding-top: 1.25rem; }
.e0de9a6 strong { background: linear-gradient(transparent 62%, var(--yellow-tint) 62%); }

.me3001a { font-size: 1.2rem; font-weight: 700; margin-bottom: 0.6rem; }

/* ── Tools / calculators ──────────────────────────── */
.j81716a {
  background: var(--ink); color: #fff; border-radius: 6px;
  padding: clamp(1.25rem, 3vw, 2rem);
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.25rem;
}
.j81716a .me3001a { color: #fff; }
.o61ba35 { color: #b9c2d6; font-size: 0.98rem; }
.hc619f5 { list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr)); gap: 1rem; }
.eacc0d3 { min-width: 0; display: flex; flex-direction: column; gap: 0.35rem; }
.eacc0d3 label { font-family: var(--f-head); font-size: 0.82rem; font-weight: 500; color: #cfd6e6; }
.eacc0d3 input, .eacc0d3 select {
  min-height: 48px; padding: 0.6rem 0.75rem; width: 100%;
  font-family: var(--f-mono); font-size: 1rem; color: var(--ink);
  background: #fff; border: 2px solid transparent; border-radius: var(--r);
}
.eacc0d3 select { font-family: var(--f-head); font-size: 0.92rem; }
.eacc0d3 input:focus, .eacc0d3 select:focus { border-color: var(--card-yellow); outline: none; }
.ne4f59b {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(160px, 100%), 1fr)); gap: 1px;
  background: rgba(255,255,255,0.12); border-radius: var(--r); overflow: hidden;
}
[data-row] { background: #1c2c4f; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.15rem; }
[data-row] span { font-family: var(--f-head); font-size: 0.75rem; color: #b9c2d6; letter-spacing: 0.04em; }
[data-row] b { font-family: var(--f-mono); font-size: 1.25rem; color: #fff; }
[data-row][data-total] { background: var(--card-yellow); }
[data-row][data-total] span { color: #5a4708; }
[data-row][data-total] b { color: var(--ink); }

/* ── Tables ───────────────────────────────────────── */
.d607a41 { overflow-x: auto; -webkit-overflow-scrolling: touch; margin-top: 1rem; border: 1px solid var(--rule); background: var(--card); }
table { width: 100%; border-collapse: collapse; font-size: 0.95rem; min-width: 560px; }
th {
  font-family: var(--f-head); font-weight: 700; font-size: 0.8rem; letter-spacing: 0.06em; text-transform: uppercase;
  text-align: left; background: var(--paper-deep); color: var(--ink); padding: 0.75rem 1rem; border-bottom: 2px solid var(--ink);
}
td { padding: 0.75rem 1rem; border-bottom: 1px solid var(--rule); vertical-align: top; }
td:first-child { font-weight: 600; }
tr:last-child td { border-bottom: 0; }
tbody tr:nth-child(even) td { background: #faf7f0; }

/* ── Casino fact card ─────────────────────────────── */
.yc0f0ea { background: var(--card); border: 1px solid var(--rule); border-top: 6px solid var(--ink); padding: 1.5rem; }
.g6627cf { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; flex-wrap: wrap; margin-bottom: 1rem; }
.g6627cf p { color: var(--muted); font-size: 0.92rem; }
.se991b4 { width: 140px; height: 48px; object-fit: contain; background: var(--ink); padding: 8px 12px; border-radius: var(--r); }
.n45b83a { list-style: none; display: grid; gap: 0; }
.n45b83a li { display: grid; grid-template-columns: minmax(150px, 34%) 1fr; gap: 1rem; padding: 0.65rem 0; border-bottom: 1px dashed var(--rule); }
.n45b83a li span { font-family: var(--f-head); font-size: 0.85rem; color: var(--muted); }
.l8732c8 { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 0.75rem; margin-top: 1rem; font-size: 0.85rem; color: var(--muted); }

/* ── Steps ────────────────────────────────────────── */
.na098aa { list-style: none; counter-reset: step; display: grid; gap: 0.75rem; margin-top: 1rem; }
.na098aa li {
  counter-increment: step; position: relative;
  background: var(--card); border: 1px solid var(--rule); padding: 1rem 1.1rem 1rem 3.6rem;
}
.na098aa li::before {
  content: counter(step); position: absolute; left: 1rem; top: 0.95rem;
  width: 1.9rem; height: 1.9rem; display: grid; place-items: center;
  font-family: var(--f-mono); font-weight: 700; font-size: 0.9rem;
  background: var(--ink); color: var(--card-yellow); border-radius: 50%;
}
.na098aa li strong { display: block; font-family: var(--f-head); }

/* ── FAQ ──────────────────────────────────────────── */
.m8d2f1d { border-top: 2px solid var(--ink); padding-top: 1.25rem; }
.n715587 { border-bottom: 1px solid var(--rule); padding: 1rem 0; }
.wb3957b h3 { font-size: 1.05rem; display: flex; gap: 0.6rem; }
.wb3957b h3::before { content: "?"; flex: none; font-family: var(--f-mono); color: var(--pitch); font-weight: 700; }
.h6dc74f { margin-top: 0.4rem; padding-left: 1.3rem; color: var(--ink-soft); max-width: var(--text); }

/* ── Side notes ───────────────────────────────────── */
.yf273c8 { background: var(--red-tint); border: 1px solid #e6b9b3; border-radius: 6px; padding: 1.1rem 1.35rem; font-size: 0.95rem; }
.yf273c8 .me3001a { font-size: 1rem; color: var(--card-red); }
.d093ed5 .p6922ef { list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 0.75rem; }
.d093ed5 .p6922ef li { background: var(--card); border: 1px solid var(--rule); padding: 0.9rem 1rem; font-size: 0.93rem; color: var(--ink-soft); }
.d093ed5 .p6922ef a { font-family: var(--f-head); font-weight: 700; display: inline-block; min-height: 24px; }
.ha4b0f9 { font-size: 0.93rem; color: var(--ink-soft); border-top: 1px solid var(--rule); padding-top: 1.25rem; }
.ha4b0f9 .me3001a { font-size: 1rem; }
.z5f96ea { list-style: none; margin-top: 0.75rem; display: grid; gap: 0.35rem; }
.z5f96ea li { display: flex; flex-wrap: wrap; gap: 0.25rem 0.75rem; align-items: baseline; }
.ha76493 { font-family: var(--f-mono); font-size: 0.78rem; color: var(--muted); }

.c5d95d1 {
  background: var(--ink); color: #d6dcea; padding: clamp(1.5rem, 4vw, 2.25rem);
  border-radius: 6px; display: grid; gap: 0.9rem; justify-items: start;
}
.c5d95d1 .f3fd588 { color: #fff; font-size: clamp(1.2rem, 2.4vw, 1.5rem); font-weight: 800; }
.c5d95d1 p { max-width: none; }

.y3d1670 { display: none; }

/* ── Footer ───────────────────────────────────────── */
.u1dade3 { background: #0e1830; color: #aab3c7; margin-top: 3rem; padding: 2.5rem 0 1.5rem; font-size: 0.92rem; }
.u1dade3 a { color: #dfe5f2; }
.e2fa0c1 { border: 1px solid #2b3a5c; padding: 1rem 1.1rem; border-radius: var(--r); margin-bottom: 2rem; }
.e2fa0c1 strong { color: var(--card-yellow); }
.ece997b { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 2rem; }
.rccca01 { color: #fff; font-size: 0.85rem; letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 0.75rem; }
.i3c3676 ul { list-style: none; display: grid; gap: 0.15rem; }
.i3c3676 li a { display: inline-flex; align-items: center; min-height: 36px; text-decoration: none; }
.i3c3676 li a:hover { text-decoration: underline; }
.s0cb0a9 { border-top: 1px solid #2b3a5c; margin-top: 2rem; padding-top: 1.25rem; display: grid; gap: 0.6rem; }
.y3bc20c { color: #c9d1e2; font-size: 0.92rem; line-height: 1.6; }

/* ── Mobile ───────────────────────────────────────── */
/* Casino-Liste (Startseite) */
.ae5f396 { margin: 2.5rem 0; }
.sebd2b2 { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; flex-wrap: wrap; }
.vebc6c7 { font-family: var(--f-head); font-weight: 700; }
.t410a2d { list-style: none; margin: 1.25rem 0 0; padding: 0; display: grid; gap: 1rem; }
.p206c5c {
  position: relative; display: grid; grid-template-columns: 3rem 120px minmax(0,1fr) 260px;
  gap: 1.25rem; align-items: center; padding: 1.4rem 1.5rem;
  background: var(--ink); color: #e9ecf3; border-radius: 10px;
  box-shadow: 0 10px 24px -14px rgba(20,33,61,0.55);
}
.d3988d9 { box-shadow: 0 0 0 2px var(--card-yellow), 0 14px 30px -14px rgba(20,33,61,0.6); padding-top: 1.9rem; }
.vd6fae9 {
  position: absolute; top: -0.75rem; left: 1.5rem; background: var(--card-yellow); color: var(--ink);
  font-family: var(--f-head); font-weight: 800; font-size: 0.72rem; letter-spacing: 0.12em;
  text-transform: uppercase; padding: 0.3rem 0.7rem; border-radius: 4px;
}
.j7c12b4 { font-family: var(--f-head); font-weight: 800; font-size: 3rem; line-height: 1; text-align: center; color: transparent; -webkit-text-stroke: 1.5px #8d98b3; }
.d3988d9 .j7c12b4 { color: var(--card-yellow); -webkit-text-stroke: 0; }
.qc5c11e { display: grid; place-items: center; width: 120px; aspect-ratio: 1; background: #0c1428; border: 1px solid #2a3758; border-radius: 10px; padding: 0.8rem; }
.qc5c11e img { max-width: 100%; max-height: 100%; object-fit: contain; }
.fb602f9 { font-family: var(--f-head); font-weight: 800; font-size: 1.7rem; text-transform: uppercase; letter-spacing: 0.01em; color: #fff; line-height: 1.1; }
.i21262d { margin: 0.3rem 0 0.7rem; font-family: var(--f-head); font-weight: 600; font-size: 0.98rem; color: var(--card-yellow); }
.jfe74a2 { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.4rem; }
.jfe74a2 li { position: relative; padding-left: 1.75rem; font-size: 1rem; line-height: 1.45; }
.jfe74a2 li::before {
  content: ""; position: absolute; left: 0; top: 0.2em; width: 1.15rem; height: 1.15rem; border-radius: 50%;
  background: #2fbf85 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.5l2.5 2.5L12 5.5' fill='none' stroke='%2314213d' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/80% no-repeat;
}
.q7d89ca { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.65rem; text-align: center; }
.m4b55ee { text-align: left; background: #1d2b4d; border: 1px solid #33426a; border-radius: 8px; padding: 0.7rem 0.9rem; }
.sd299d8 { display: block; font-family: var(--f-head); font-weight: 700; font-size: 0.7rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--card-yellow); }
.lb2ad85 { display: block; margin-top: 0.2rem; font-family: var(--f-head); font-weight: 700; color: #fff; font-size: 1rem; }
.b8a93d1 { width: 100%; justify-content: center; min-height: 52px; font-size: 1.05rem; }
.ja385df { color: var(--card-yellow); font-family: var(--f-head); font-weight: 700; }
.ja385df:hover { color: #fff; }
.g4b0bfe { font-size: 0.8rem; color: #a9b2c7; line-height: 1.35; }
.mad6c5e { margin-top: 1rem; font-size: 0.92rem; color: var(--ink-soft); }
@media (max-width: 960px) {
  .p206c5c { grid-template-columns: 2.5rem 96px minmax(0,1fr); }
  .qc5c11e { width: 96px; }
  .q7d89ca { grid-column: 1 / -1; grid-template-columns: 1fr 1fr; align-items: center; }
  .m4b55ee, .g4b0bfe { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
  .p206c5c { grid-template-columns: 1.75rem 64px minmax(0,1fr); gap: 0.6rem 0.8rem; padding: 1.2rem 1rem; }
  .d3988d9 { padding-top: 1.7rem; }
  .vd6fae9 { left: 1rem; font-size: 0.66rem; letter-spacing: 0.08em; white-space: nowrap; }
  .j7c12b4 { font-size: 2rem; }
  .qc5c11e { width: 64px; padding: 0.45rem; border-radius: 8px; }
  .kf097b1 { display: contents; }
  .fb602f9 { font-size: 1.15rem; }
  .i21262d, .jfe74a2, .q7d89ca { grid-column: 1 / -1; }
  .i21262d { margin: 0.2rem 0 0; }
  .q7d89ca { grid-template-columns: 1fr; }
}

@media (max-width: 860px) {
  .bd07eca { display: inline-flex; }
  .de047a3 {
    display: none; position: absolute; left: 0; right: 0; top: 100%;
    background: var(--ink); flex-direction: column; padding: 0.5rem 16px 1rem;
    border-bottom: 4px solid var(--pitch);
  }
  .de047a3.f60be25 { display: flex; }
  .de047a3 a { min-height: 48px; font-size: 1rem; }
}
@media (max-width: 640px) {
  body { font-size: 1rem; padding-bottom: 76px; }
  .z953e22 { padding: 0 16px; }
  .n45b83a li { grid-template-columns: 1fr; gap: 0.1rem; }
  .r56e4f9 li, .r56e4f9 .a9f88c2 { width: 100%; }
  .y3d1670 {
    display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
    padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
    background: rgba(20, 33, 61, 0.96); border-top: 3px solid var(--card-yellow);
  }
  .y3d1670 .a9f88c2 { width: 100%; }
}

cite { font-style: normal; font-family: var(--f-mono); font-size: 0.85em; color: var(--ink-soft); word-break: break-word; }
.x95bfb2 { font-weight: 600; }
