/* ok-styleprov.css — G0 premium style sample (okp- prefix, loads ONLY on the
   hidden preview). Language: v2.5 "levande redaktionellt" — flat + hairlines
   kept, adds tonal bands, per-casino accents, icons/marks, richer hierarchy. */
.okp{background:#fff}
.okp .okp-note{margin:18px auto;background:#fff8ec;border:1px solid #f0dcae;border-left:3px solid #b98a1c;border-radius:8px;padding:12px 16px;font-size:14px}
.okp-sec{padding:34px 0 40px}
.okp-ab{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;margin:0 0 16px}
.okp-ab--a{color:#8a93ad}.okp-ab--b{color:#0b7d57}
.okp-band--mint{background:#eef5f1;border-top:1px solid #dbe8e0;border-bottom:1px solid #dbe8e0}
.okp-band--sand{background:#f7f3ea;border-top:1px solid #ece2cd;border-bottom:1px solid #ece2cd}
.okp-band--navy05{background:#f2f4f9;border-top:1px solid #dfe4f0;border-bottom:1px solid #dfe4f0}
/* hero */
.okp-hero{background:#0f1834;color:#e9eef9;padding:56px 0 48px;border-bottom:3px solid #0aa268}
.okp-hero-in{display:grid;grid-template-columns:1.1fr .9fr;gap:44px;align-items:center}
.okp-kicker{font-size:11px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:#8fd6b7}
.okp-hero h1{margin:10px 0 0;font-size:40px;line-height:1.12;color:#fff;max-width:20ch}
.okp-hero h1 em{font-style:normal;color:#8fd6b7}
.okp-hero p{margin:16px 0 0;font-size:17px;line-height:1.65;color:#c4cee5;max-width:56ch}
.okp-hero-ctas{display:flex;gap:20px;align-items:center;margin-top:24px}
.okp-btn{display:inline-flex;align-items:center;gap:8px;border-radius:8px;font-weight:800;text-decoration:none}
.okp-btn--primary{background:#0aa268;color:#fff;padding:15px 28px;font-size:16.5px;box-shadow:inset 0 1px 0 rgba(255,255,255,.18)}
.okp-btn--primary:hover{background:#08815a}
.okp-btn svg{width:18px;height:18px}
.okp-hero-sec{color:#c4cee5;font-size:15px;text-decoration:underline;text-underline-offset:3px}
.okp-paystrip{display:flex;align-items:center;gap:8px;margin-top:26px;flex-wrap:wrap}
.okp-paymark{display:inline-flex;background:#fff;border-radius:6px;padding:5px 9px;border:1px solid rgba(255,255,255,.16)}
.okp-paymark img{height:18px;width:auto;display:block}
.okp-paymark--xs img{height:14px}
.okp-paystrip-txt{font-size:12.5px;color:#a9b4d2;margin-left:6px}
.okp-paystrip--light .okp-paymark{border-color:#dde3ef}
.okp-paystrip--light .okp-paystrip-txt{color:#5c6580}
/* hero stack */
.okp-hero-stack{display:flex;flex-direction:column;gap:12px}
.okp-stackcard{display:flex;align-items:center;gap:14px;background:#14203f;border:1px solid #2b3a66;border-left:3px solid var(--okp-acc);border-radius:10px;padding:14px 18px}
.okp-stackcard:nth-child(2){transform:translateX(18px)}
.okp-stackcard:nth-child(3){transform:translateX(36px)}
.okp-stackrank{font-size:15px;font-weight:800;color:#8fd6b7;width:18px}
.okp-stackmeta{flex:1;min-width:0}
.okp-stackmeta b{display:block;color:#fff;font-size:15.5px}
.okp-stackmeta span{font-size:12.5px;color:#a9b4d2}
/* brand + ring */
.okp-blogo{display:inline-flex;align-items:center;justify-content:center;background:#fff;border:1px solid #dde3ef;border-radius:8px;padding:7px 12px}
.okp-blogo img{max-height:34px;width:auto;object-fit:contain;display:block}
.okp-blogo--sm img{max-height:24px}
.okp-blogo--xs{padding:4px 8px}.okp-blogo--xs img{max-height:18px}
.okp-mono{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:10px;background:var(--okp-acc,#14203f);color:#fff;font-weight:800;font-size:21px;box-shadow:inset 0 -2px 0 rgba(0,0,0,.18)}
.okp-ring{--sz:56px;position:relative;display:inline-flex;align-items:center;justify-content:center;width:var(--sz);height:var(--sz);border-radius:50%;background:conic-gradient(var(--okp-acc,#0aa268) calc(var(--okp-pct)*1%),#e3e9f4 0);flex:none}
.okp-ring::before{content:"";position:absolute;inset:5px;background:#fff;border-radius:50%}
.okp-ring b{position:relative;font-size:16.5px;color:#14203f}
/* top-3 cards */
.okp-cardgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.okp-card{position:relative;background:#fff;border:1px solid #dde3ef;border-top:3px solid var(--okp-acc);border-radius:12px;padding:20px 22px 18px;display:flex;flex-direction:column;gap:12px}
.okp-card-rank{position:absolute;top:-13px;left:18px;width:30px;height:30px;border-radius:8px;background:#14203f;color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center;font-size:15px;box-shadow:0 2px 0 rgba(20,32,63,.15)}
.okp-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:6px}
.okp-card-name{margin:0;font-size:21px;color:#14203f}
.okp-card-verdict{margin:0;font-size:14.5px;line-height:1.55;color:#3f4a68;min-height:44px}
.okp-cues{list-style:none;margin:0;padding:10px 0;border-top:1px solid #edf1f8;border-bottom:1px solid #edf1f8;display:flex;flex-direction:column;gap:7px}
.okp-cues li{display:flex;align-items:center;gap:9px;font-size:13.5px;color:#222b45}
.okp-cues svg{width:17px;height:17px;color:#0b7d57;flex:none}
.okp-cue-flag svg{color:#b98a1c}
.okp-card-bonus{display:flex;gap:10px;align-items:center;background:#fdf6e7;border:1px solid #f0dcae;border-radius:8px;padding:10px 14px}
.okp-card-bonus svg{width:20px;height:20px;color:#b98a1c;flex:none}
.okp-card-bonus b{display:block;font-size:14.5px;color:#14203f;line-height:1.3}
.okp-card-bonus span{font-size:11.5px;color:#5c6580}
.okp-card-bonus--none{background:#f2f4f9;border-color:#dfe4f0}
.okp-card-bonus--none svg{color:#8a93ad}
.okp-card-pay{display:flex;align-items:center;gap:6px}
.okp-card-pay-txt{font-size:12.5px;color:#5c6580;margin-left:auto}
.okp-card-ctas{display:flex;flex-direction:column;gap:8px;align-items:stretch;text-align:center}
.okp-card-ctas .ok-btn{width:100%;justify-content:center}
.okp-card-rg{margin:0;font-size:10.5px;color:#8a93ad;text-align:center}
/* rows 4-10 */
.okp-rows{display:flex;flex-direction:column;gap:10px}
.okp-row{display:grid;grid-template-columns:26px 56px 1.5fr 130px 1fr 210px;gap:14px;align-items:center;background:#fff;border:1px solid #dde3ef;border-left:3px solid var(--okp-acc);border-radius:10px;padding:13px 18px}
.okp-row-rank{font-weight:800;font-size:15px;color:#8a93ad}
.okp-row-name{font-weight:800;font-size:16px;color:#14203f;text-decoration:none}
.okp-row-name:hover{text-decoration:underline}
.okp-chips{display:flex;gap:6px;margin-top:5px;flex-wrap:wrap}
.okp-chip{font-size:11px;font-weight:700;padding:2.5px 9px;border-radius:99px;background:#f2f4f9;color:#3f4a68;border:1px solid #dfe4f0}
.okp-chip--acc{background:color-mix(in srgb,var(--okp-acc) 12%,#fff);border-color:color-mix(in srgb,var(--okp-acc) 30%,#fff);color:#14203f}
.okp-chip--flag{background:#fdf6e7;border-color:#f0dcae;color:#7a5b13}
.okp-chip--ok{background:#eef5f1;border-color:#cfe4d8;color:#0b7d57}
.okp-row-score{display:flex;align-items:center;gap:10px}
.okp-row-score .okp-ring{--sz:44px}
.okp-row-score .okp-ring b{font-size:13.5px}
.okp-row-verdict{font-size:12px;color:#5c6580}
.okp-row-bonus b{display:block;font-size:13.5px;color:#14203f}
.okp-row-bonus span{font-size:11.5px;color:#5c6580}
.okp-row-ctas{display:flex;flex-direction:column;gap:5px;align-items:flex-end}
/* table */
.okp-table{background:#fff;border:1px solid #dde3ef;border-radius:12px;overflow:hidden}
.okp-t-head,.okp-t-row{display:grid;grid-template-columns:1.7fr 1fr .6fr .55fr .6fr .55fr .85fr .9fr;gap:10px;align-items:center;padding:12px 18px}
.okp-t-head{background:#14203f;color:#c4cee5;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.okp-t-row{border-top:1px solid #edf1f8;font-size:14.5px}
.okp-t-row:nth-child(odd){background:#f8fafc}
.okp-t-name{display:flex;align-items:center;gap:10px}
.okp-t-name a{font-weight:800;color:#14203f;text-decoration:none}
.okp-t-score b{font-size:16px;color:#14203f}.okp-t-score em{font-style:normal;color:#8a93ad;font-size:12px}
.okp-t-row i{display:none;font-style:normal}
.okp-mark{color:#c3cadd}
.okp-mark--yes svg{width:17px;height:17px;color:#0b7d57}
.okp-mark--bonus svg{width:17px;height:17px;color:#b98a1c}
.okp-badge{font-size:11.5px;font-weight:700;padding:3px 10px;border-radius:99px;background:#f2f4f9;border:1px solid #dfe4f0;color:#3f4a68}
.okp-badge--clean{background:#eef5f1;border-color:#cfe4d8;color:#0b7d57}
/* icons / swatches / monograms */
.okp-iconrow{display:flex;gap:22px;flex-wrap:wrap;margin-bottom:20px}
.okp-icondemo{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11.5px;color:#3f4a68}
.okp-icondemo svg{width:26px;height:26px;color:#14203f}
.okp-icondemo i{font-style:normal}
.okp-swatches{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
.okp-swatches span{padding:14px 18px;border-radius:8px;font-size:12px;font-weight:700}
.okp-monogrid{display:flex;gap:16px;flex-wrap:wrap}
.okp-monodemo{display:flex;flex-direction:column;align-items:center;gap:8px;font-size:12px;color:#3f4a68;width:110px;text-align:center}
.okp-fine{font-size:12px;color:#8a93ad;margin-top:14px}
/* responsive */
@media (max-width:1024px){
  .okp-hero-in{grid-template-columns:1fr}
  .okp-hero-stack{display:none}
  .okp-cardgrid{grid-template-columns:1fr}
  .okp-row{grid-template-columns:24px 48px 1fr;grid-auto-rows:auto;row-gap:10px}
  .okp-row-score,.okp-row-bonus{grid-column:2 / -1}
  .okp-row-ctas{grid-column:2 / -1;align-items:flex-start;flex-direction:row;gap:14px}
  .okp-t-head{display:none}
  .okp-t-row{grid-template-columns:1fr 1fr;row-gap:8px}
  .okp-t-name{grid-column:1 / -1}
  .okp-t-row i{display:block;font-size:10.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:#8a93ad;margin-bottom:2px}
}
@media (max-width:560px){
  .okp-hero h1{font-size:29px}
  .okp-sec{padding:26px 0 30px}
}
/* shim: v2 homepage wrapper kept for the G0 sample's "A" variant after ok-home.css v3 rewrite */
.ok-home-listrows{display:flex;flex-direction:column;gap:10px}