/* ===== Casino money-page components (scoped .lz-casino) — Leerzaam identity: warm orange + warm-dark ===== */
.lz-casino{--accent:#ef5b25;--amber:#ff8b00;--burnt:#c75a00;--dark:#2a2018;--ink:#2d2a26;--muted:#7a7268;--line:#ece7e1;--bg:#faf7f3;--peach:#fff3e9;color:var(--ink);font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;line-height:1.65;font-size:17px}
.lz-casino .wrap{max-width:1080px;margin:0 auto;padding:0 18px}
.lz-casino h1{font-size:2.05rem;line-height:1.18;color:var(--dark);margin:.2em 0 .25em;font-weight:800}
/* H2: four-petal motif + 4-colour gradient underline */
.lz-casino h2{font-size:1.5rem;color:var(--dark);margin:1.8em 0 .7em;font-weight:800;border:0;position:relative;padding:2px 0 12px 42px}
.lz-casino h2::before{content:"";position:absolute;left:0;top:0;width:30px;height:30px;background:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj48cGF0aCBkPSJNNTAsNTAgTDUwLDE4IFE1MCwzIDM1LDMgTDIwLDMgUTgsMyA4LDIwIEw4LDM1IFE4LDUwIDE4LDUwIFoiIGZpbGw9IiNGRjhCMDAiLz48cGF0aCBkPSJNNTAsNTAgTDUwLDE4IFE1MCwzIDM1LDMgTDIwLDMgUTgsMyA4LDIwIEw4LDM1IFE4LDUwIDE4LDUwIFoiIGZpbGw9IiNGRkJBNUYiIHRyYW5zZm9ybT0icm90YXRlKDkwIDUwIDUwKSIvPjxwYXRoIGQ9Ik01MCw1MCBMNTAsMTggUTUwLDMgMzUsMyBMMjAsMyBROCwzIDgsMjAgTDgsMzUgUTgsNTAgMTgsNTAgWiIgZmlsbD0iI0YzNjUyMyIgdHJhbnNmb3JtPSJyb3RhdGUoMTgwIDUwIDUwKSIvPjxwYXRoIGQ9Ik01MCw1MCBMNTAsMTggUTUwLDMgMzUsMyBMMjAsMyBROCwzIDgsMjAgTDgsMzUgUTgsNTAgMTgsNTAgWiIgZmlsbD0iI0Q4NjkwMCIgdHJhbnNmb3JtPSJyb3RhdGUoMjcwIDUwIDUwKSIvPjwvc3ZnPg==") center/contain no-repeat}
.lz-casino h2::after{content:"";position:absolute;left:42px;right:0;bottom:0;height:3px;border-radius:3px;background:linear-gradient(90deg,#FF8B00,#FFBA5F,#F36523,#D86900)}
.lz-casino h3{font-size:1.2rem;color:var(--dark);margin:1.3em 0 .4em;font-weight:700;padding-left:13px;border-left:4px solid var(--amber)}
.lz-casino p{margin:.6em 0}
.lz-casino a{color:var(--burnt)}
.lz-casino .wrap p a,.lz-casino .wrap li a{text-decoration:underline;text-decoration-color:var(--amber);text-decoration-thickness:2px;text-underline-offset:2px}
.lz-casino .wrap strong{color:var(--dark)}
.lz-casino .lede{font-size:1.12rem;color:#4a4138;margin:.3em 0 .6em}
/* byline: faint-orange container */
.lz-casino .byline{display:flex;align-items:center;gap:8px 16px;flex-wrap:wrap;font-size:.92rem;color:var(--muted);background:linear-gradient(90deg,var(--peach),#fff);border:1px solid #f4dcc8;border-left:4px solid var(--accent);border-radius:12px;padding:12px 16px;margin:.5em 0 1.3em}
.lz-casino .by-id{display:flex;align-items:center;gap:11px;flex-wrap:nowrap;min-width:0}
.lz-casino .by-id > span{min-width:0}
.lz-casino .by-meta{display:flex;align-items:center;gap:6px 10px;flex-wrap:wrap}
.lz-casino .byline img{width:42px;height:42px;border-radius:50%;object-fit:cover;border:2px solid #fff;box-shadow:0 0 0 2px var(--amber);flex:none}
.lz-casino .byline b{color:var(--ink)}
.lz-casino .byline .sep{color:var(--amber)}

/* content bullets: rotating four-favicon-colour diamond markers */
.lz-casino .wrap ul:not(.steps){list-style:none;padding-left:2px;margin:.7em 0}
.lz-casino .wrap ul:not(.steps) li{position:relative;padding:5px 0 5px 30px;margin:3px 0}
.lz-casino .wrap ul:not(.steps) li::before{content:"";position:absolute;left:3px;top:.85em;width:11px;height:11px;border-radius:3px;transform:rotate(45deg)}
.lz-casino .wrap ul:not(.steps) li:nth-child(4n+1)::before{background:#FF8B00}
.lz-casino .wrap ul:not(.steps) li:nth-child(4n+2)::before{background:#F36523}
.lz-casino .wrap ul:not(.steps) li:nth-child(4n+3)::before{background:#D86900}
.lz-casino .wrap ul:not(.steps) li:nth-child(4n+4)::before{background:#FFBA5F}

/* toplist */
.lz-casino .toplist{display:flex;flex-direction:column;gap:14px;margin:1.1em 0}
.lz-casino .ccard{display:grid;grid-template-columns:52px 200px 1fr 220px;gap:18px;align-items:center;background:linear-gradient(180deg,#fff4e8,#ffffff);border:1px solid #f1e2d3;border-radius:14px;padding:18px 20px;box-shadow:0 2px 10px rgba(42,32,24,.07);position:relative}
.lz-casino .ccard .rank{font-size:1.5rem;font-weight:800;color:var(--dark);text-align:center}
.lz-casino .ribbon{position:absolute;top:-11px;left:18px;background:var(--accent);color:#fff;font-size:.68rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:3px 10px;border-radius:20px}
.lz-casino .ribbon.gold{background:var(--amber);color:#fff;text-shadow:0 1px 1px rgba(150,60,0,.4)}
.lz-casino .logo-chip{background:#fff;border:1px solid var(--line);border-radius:10px;height:74px;display:flex;align-items:center;justify-content:center;padding:8px}
.lz-casino .logo-chip img{max-height:54px;max-width:170px;object-fit:contain}
.lz-casino .cmid .name{font-weight:800;font-size:1.12rem;color:var(--dark)}
.lz-casino .stars{color:var(--amber);font-size:1.05rem;letter-spacing:1px}
.lz-casino .rscore{color:var(--muted);font-size:.9rem;margin-left:6px}
.lz-casino .tags{margin-top:6px}
.lz-casino .tag{display:inline-block;background:#f4ede5;color:#6a5d4f;font-size:.72rem;font-weight:600;padding:3px 9px;border-radius:20px;margin:3px 4px 0 0}
.lz-casino .cright{text-align:center}
.lz-casino .blabel{font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.lz-casino .bamt{font-size:1.28rem;font-weight:800;color:var(--accent);line-height:1.15;margin:2px 0 4px}
.lz-casino .bsub{font-size:.8rem;color:var(--muted);margin-bottom:8px}
.lz-casino .cta{display:inline-block;background:linear-gradient(180deg,var(--amber),var(--accent));color:#fff!important;font-weight:800;text-decoration:none;padding:12px 22px;border-radius:9px;width:100%;box-sizing:border-box;transition:.15s}
.lz-casino .cta:hover{filter:brightness(1.07)}
.lz-casino .cta.sm{padding:9px 16px;font-size:.9rem}

/* DESKTOP ONLY: elevate the bonus into a highlighted panel with stronger hierarchy */
@media(min-width:821px){
 /* softer orange on the LEFT, held longer, fading to white by ~74% so the bonus panel + CTA land on white */
 .lz-casino .ccard{grid-template-columns:50px 188px 1fr 256px;background:linear-gradient(90deg,#ffa544 0%,#ffbf80 36%,#ffdcc2 56%,#ffffff 74%)}
 .lz-casino .ccard .rank{color:#fff;text-shadow:0 1px 2px rgba(150,60,0,.5)}
 .lz-casino .cright{background:#fff;border:1px solid #efe1d2;border-radius:12px;padding:13px 15px 14px;box-shadow:0 3px 12px rgba(42,32,24,.12)}
 .lz-casino .cright .blabel{font-size:.7rem;color:var(--burnt)}
 .lz-casino .cright .bamt{font-size:1.62rem;margin:3px 0 3px;letter-spacing:-.01em}
 .lz-casino .cright .bsub{font-size:.82rem;margin-bottom:11px}
 .lz-casino .cright .cta{box-shadow:0 4px 12px rgba(239,91,37,.32)}
}

/* comparison table — wrapper makes it horizontally scrollable on narrow screens */
.lz-casino .ctable-wrap{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;margin:1em 0;border-radius:10px}
.lz-casino .ctable{width:100%;border-collapse:collapse;font-size:.95rem;background:#fff;border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:10px;overflow:hidden}
.lz-casino .ctable th{background:linear-gradient(135deg,var(--amber),var(--accent));color:#fff;text-align:left;padding:12px 13px;font-size:.85rem;letter-spacing:.01em}
.lz-casino .ctable td{padding:11px 13px;border-top:1px solid var(--line)}
.lz-casino .ctable td:first-child{font-weight:700;color:var(--dark)}
.lz-casino .ctable tr:nth-child(even) td{background:#fbf3ec}
.lz-casino .ctable tbody tr:hover td{background:var(--peach)}
.lz-casino .ctable .b{color:var(--accent);font-weight:700}

/* review block */
.lz-casino .review{background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px 24px;margin:1em 0;box-shadow:0 2px 10px rgba(42,32,24,.06)}
.lz-casino .review .rhead{display:flex;align-items:center;gap:16px;flex-wrap:wrap;border-bottom:1px solid var(--line);padding-bottom:12px;margin-bottom:12px}
.lz-casino .review .rhead .logo-chip{height:60px}
.lz-casino .review .rhead h3{margin:0}
.lz-casino .rscore-badge{margin-left:auto;background:var(--dark);color:#fff;font-weight:800;border-radius:10px;padding:8px 14px;text-align:center;font-size:1.25rem;line-height:1}
.lz-casino .rscore-badge small{display:block;font-size:.6rem;font-weight:600;letter-spacing:.06em;opacity:.85}
.lz-casino .subscores{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px 18px;margin:10px 0}
.lz-casino .ss{font-size:.85rem}
.lz-casino .ss .bar{height:7px;background:#f0e9e1;border-radius:5px;overflow:hidden;margin-top:3px}
.lz-casino .ss .bar i{display:block;height:100%;background:var(--accent)}
.lz-casino .pc{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:12px 0}
.lz-casino .pc ul{margin:.2em 0;padding-left:20px}
.lz-casino .pc .pros li{color:#1c6b3a}
.lz-casino .pc .cons li{color:#9a3535}
.lz-casino .pc h4{margin:.2em 0;font-size:.95rem}

/* steps / faq / callouts */
.lz-casino ol.steps{counter-reset:s;list-style:none;padding-left:0}
.lz-casino ol.steps li{position:relative;padding:6px 0 6px 44px;margin:8px 0}
.lz-casino ol.steps li:before{counter-increment:s;content:counter(s);position:absolute;left:0;top:4px;width:30px;height:30px;background:var(--accent);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800}
.lz-casino .faq{border:1px solid var(--line);border-left:4px solid var(--amber);border-radius:10px;margin:10px 0;background:#fff;overflow:hidden;transition:border-color .15s}
.lz-casino .faq summary{cursor:pointer;font-weight:700;color:var(--dark);padding:14px 48px 14px 16px;list-style:none;position:relative;transition:background .15s}
.lz-casino .faq summary:hover{background:var(--peach)}
.lz-casino .faq summary::-webkit-details-marker{display:none}
.lz-casino .faq summary::after{content:"+";position:absolute;right:13px;top:50%;transform:translateY(-50%);width:24px;height:24px;line-height:23px;text-align:center;border-radius:50%;background:var(--accent);color:#fff;font-weight:800;font-size:1.15rem}
.lz-casino .faq[open]{border-left-color:var(--accent);box-shadow:0 2px 10px rgba(42,32,24,.06)}
.lz-casino .faq[open] summary{background:var(--peach);border-bottom:1px solid #f3ddc9}
.lz-casino .faq[open] summary::after{content:"\2212"}
.lz-casino .faq .fa{padding:12px 16px 15px}
.lz-casino .callout{background:var(--peach);border-left:4px solid var(--accent);padding:14px 18px;border-radius:0 10px 10px 0;margin:1em 0}
.lz-casino .rg{background:var(--dark);color:#e7ddd2;border-radius:12px;padding:20px 24px;margin:1.2em 0}
.lz-casino .rg a{color:#ffcfa6}
.lz-casino .rg strong{color:var(--amber)}   /* bold labels orange — was --dark (invisible on dark bg) */
.lz-casino .authorbox{display:flex;gap:18px;align-items:flex-start;background:#f5efe8;border-radius:12px;padding:20px;margin:1.4em 0}
.lz-casino .authorbox img{width:84px;height:84px;border-radius:50%;object-fit:cover;flex:none}
.lz-casino .disclaimer{font-size:.82rem;color:var(--muted);background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:12px 15px;margin:1em 0}
.lz-casino .updated{font-size:.85rem;color:var(--muted)}

/* hide the legacy floating social-share bar on the money page (it overlaps content on mobile) */
#csbwfs-right,#csbwfs-left,.csbwfs-social-widget,div[id*="sfsi"],div[class*="sfsi"]{display:none!important}

/* logo lockup in masthead */
.lz-brand{display:inline-flex;align-items:center;gap:12px;text-decoration:none}
.lz-brand svg{width:42px;height:42px;flex:none}
.lz-brand .wm{font-weight:800;font-size:1.7rem;letter-spacing:-.01em;color:#222;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}

/* mobile */
@media(max-width:820px){
 .lz-casino .ccard{grid-template-columns:1fr;text-align:center;padding-top:26px}
 .lz-casino .ccard .rank{position:absolute;top:8px;left:14px;font-size:1.1rem}
 .lz-casino .logo-chip{justify-self:center;width:80%}
 .lz-casino .cright{max-width:320px;margin:0 auto}
 .lz-casino .review .rscore-badge{margin:0 auto}
 .lz-casino .pc{grid-template-columns:1fr}
 .lz-casino h1{font-size:1.5rem;margin:.1em 0 .15em;line-height:1.15}
 .lz-casino .lede{font-size:1rem;margin:.15em 0 .35em}
 .lz-casino h2{margin:1.2em 0 .4em}
 .lz-casino .toplist{margin:26px 0 .7em}      /* clearance so the rank ribbon clears the H2 above */
 .lz-casino .byline{align-items:flex-start;gap:8px 12px;padding:11px 13px;margin:.4em 0 .9em;font-size:.86rem}
 .lz-casino .by-meta{width:100%}              /* meta drops to its own full-width row on mobile */
 .lz-casino .byline img{width:38px;height:38px}
 .lz-casino .authorbox{flex-direction:column;text-align:center;gap:12px;padding:18px 16px}
 .lz-casino .authorbox img{margin:0 auto}
 .lz-casino{font-size:16px}
 .lz-casino .ctable{min-width:560px}
}