/* ============================================================
   tkm.css — stone&fire (Belgium, NL/FR, offshore)
   Palette: deep ocean-navy + coral + teal  (redesigned hero)
   ============================================================ */
:root{
  --ink:#16203a; --muted:#5f6b82; --line:#e5e9f2; --bg:#f4f6fb; --card:#fff;
  --navy:#0d2140; --navy-2:#123a5e;
  --accent:#ff5a5f;         /* primary CTA (coral) */
  --accent-d:#f0353c;
  --accent-ink:#fff;
  --teal:#12b5a5;           /* secondary highlight */
  --teal-d:#0e8f83;
  --gold:#f6b73c;           /* ranks / awards */
  --ok:#1c9b6a; --shadow:0 6px 26px rgba(16,32,64,.10);
  --radius:16px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:"Wix Madefor Text",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);background:var(--bg);line-height:1.62;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:"Wix Madefor Display","Wix Madefor Text",sans-serif;line-height:1.2}
a{color:var(--teal-d);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;display:block}
.tkm-wrap{max-width:1040px;margin:0 auto;padding:0 18px}
section{padding:30px 0}
section h2{font-size:clamp(21px,3.4vw,27px);color:var(--navy);margin:0 0 .5em}
section h3{font-size:18px;margin:1.3em 0 .3em;color:var(--navy-2)}
p{margin:.6em 0}

/* ---------- NAV ---------- */
.tkm-nav{background:var(--navy);color:#fff;position:sticky;top:0;z-index:60;box-shadow:0 2px 14px rgba(0,0,0,.18)}
.tkm-nav-in{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:62px}
.tkm-logo{display:flex;flex-direction:column;color:#fff;text-decoration:none;line-height:1.05}
.tkm-logo-mark{font-family:"Bebas Neue",sans-serif;font-size:26px;letter-spacing:1.2px}
.tkm-logo-mark b{color:var(--accent);font-weight:400}
.tkm-logo-tag{font-size:10.5px;color:#9fb3cf;letter-spacing:.4px;text-transform:uppercase}
.tkm-nav-links{display:flex;align-items:center;gap:18px}
.tkm-navitem{position:relative}
.tkm-navtop{display:inline-flex;align-items:center;gap:6px;color:#eef2fb;text-decoration:none;font-family:"Wix Madefor Text",-apple-system,"Segoe UI",Roboto,sans-serif;font-size:15px;font-weight:500;letter-spacing:.15px;padding:10px 4px;border-radius:8px;transition:color .15s}
.tkm-navtop:hover{color:#fff;background:none;text-decoration:none}
.tkm-caret{font-size:9px;opacity:.55;margin-left:1px;transform:translateY(1px)}
.tkm-drop-panel{position:absolute;top:100%;left:0;min-width:230px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:8px;display:none;flex-direction:column;z-index:70}
.tkm-navitem:hover .tkm-drop-panel{display:flex}
.tkm-drop-panel a{color:var(--ink);padding:8px 10px;border-radius:7px;font-size:14px}
.tkm-drop-panel a:hover{background:var(--bg);text-decoration:none}
.tkm-drop-panel a.sub{padding-left:20px;color:var(--muted)}
.tkm-drop-h{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);padding:8px 10px 3px;font-weight:700}
.tkm-burger{display:none}
.tkm-burger>summary{list-style:none;cursor:pointer;padding:8px}
.tkm-burger>summary::-webkit-details-marker{display:none}
.tkm-burger-b,.tkm-burger-b::before,.tkm-burger-b::after{display:block;width:24px;height:2.5px;background:#fff;border-radius:3px;position:relative}
.tkm-burger-b::before,.tkm-burger-b::after{content:"";position:absolute}
.tkm-burger-b::before{top:-7px}.tkm-burger-b::after{top:7px}
.tkm-burger-p{position:absolute;left:0;right:0;top:100%;background:var(--navy-2);padding:10px 18px 18px;display:flex;flex-direction:column;gap:2px}
.tkm-burger-p a{color:#e7eefb;padding:10px 6px;border-bottom:1px solid rgba(255,255,255,.08);font-size:15px}
.tkm-bsub>summary{color:#fff;padding:10px 6px;cursor:pointer;font-weight:700;border-bottom:1px solid rgba(255,255,255,.08)}
.tkm-bsub a{padding-left:18px;color:#bcd0ec}

/* ---------- HERO (redesigned: centered + spotlight + top-pick ribbon) ---------- */
.tkm-hero{position:relative;overflow:hidden;color:#fff;background:linear-gradient(160deg,#0b1d38 0%,#0d2140 42%,#0c3f4a 100%)}
.tkm-hero-bg{position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(680px 340px at 78% -8%, rgba(18,181,165,.35), transparent 60%),
    radial-gradient(560px 320px at 8% 12%, rgba(255,90,95,.22), transparent 60%),
    radial-gradient(1px 1px at 20% 40%, rgba(255,255,255,.5) 1px, transparent 0),
    radial-gradient(1px 1px at 60% 70%, rgba(255,255,255,.35) 1px, transparent 0),
    radial-gradient(1px 1px at 85% 30%, rgba(255,255,255,.4) 1px, transparent 0);
  background-size:auto,auto,140px 140px,180px 180px,120px 120px}
.tkm-hero-in{position:relative;z-index:2;text-align:center;padding:40px 18px 34px;max-width:880px}
.tkm-eyebrow{display:inline-block;background:rgba(18,181,165,.16);border:1px solid rgba(18,181,165,.5);color:#8ff0e4;border-radius:999px;padding:5px 13px;font-size:12px;font-weight:700;letter-spacing:.4px;text-transform:uppercase}
.tkm-h1{font-size:clamp(28px,5.2vw,46px);margin:.35em 0 .3em;letter-spacing:-.5px}
.tkm-h1 .hl{color:var(--gold)}
.tkm-lede{color:#cfe0f0;font-size:clamp(15px,2vw,17.5px);max-width:64ch;margin:.4em auto}
.tkm-lede-more{display:none}
.tkm-lede.open .tkm-lede-more{display:inline}
.tkm-lede-tog{background:none;border:0;color:var(--gold);font:inherit;font-weight:700;cursor:pointer;padding:0 4px;text-decoration:underline}
.tkm-trust{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:16px 0 4px}
.tkm-trust span{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.22);border-radius:999px;padding:6px 12px;font-size:12.5px;font-weight:600}
.tkm-trust span:first-child{background:#fff;color:var(--navy);border-color:#fff}
.tkm-byline{display:flex;align-items:center;gap:9px;justify-content:center;color:#a9c0da;font-size:12.5px;margin-top:14px}
.tkm-byline a{color:#dfeaf6}
.tkm-avatar{border-radius:50%;border:2px solid rgba(255,255,255,.4);width:40px;height:40px;object-fit:cover}
/* top-pick ribbon */
.tkm-hpick{display:flex;align-items:center;gap:14px;justify-content:center;flex-wrap:wrap;
  background:rgba(255,255,255,.96);color:var(--ink);border-radius:14px;box-shadow:0 12px 30px rgba(0,0,0,.28);
  padding:12px 16px;margin:22px auto 0;max-width:660px;text-align:left}
.tkm-hpick:hover{text-decoration:none}
.tkm-hpick-badge{background:var(--gold);color:#3a2a05;font-weight:800;font-size:12px;border-radius:8px;padding:5px 9px;white-space:nowrap}
.tkm-hpick-logo{width:52px;height:52px;border-radius:10px;background:#fff;border:1px solid var(--line);object-fit:contain;padding:4px}
.tkm-hpick-txt{flex:1;min-width:150px}
.tkm-hpick-name{font-weight:800;font-size:16px;color:var(--navy)}
.tkm-hpick-bon{font-size:13px;color:var(--muted)}
.tkm-hpick-rate{font-family:"Bebas Neue",sans-serif;font-size:30px;color:var(--teal-d);line-height:1}
.tkm-hpick-rate small{display:block;font-family:"Wix Madefor Text";font-size:10px;color:var(--muted)}

/* legacy subdial (kept styled in case reused) */
.tkm-subdial{display:none}

/* ---------- CTA ---------- */
.tkm-cta{display:inline-block;background:var(--accent);color:var(--accent-ink)!important;font-weight:800;text-decoration:none;
  padding:11px 20px;border-radius:10px;white-space:nowrap;font-size:14.5px;box-shadow:0 3px 0 var(--accent-d);transition:transform .06s,filter .15s}
.tkm-cta:hover{filter:brightness(1.05);text-decoration:none}
.tkm-cta:active{transform:translateY(2px);box-shadow:0 1px 0 var(--accent-d)}
.tkm-cta-w{width:100%;text-align:center}
.tkm-tc{font-size:11px;color:var(--muted);margin:6px 0 0;text-align:center}

/* ---------- TOPLIST ---------- */
#toplist h2{font-size:clamp(20px,3.2vw,25px)}
.tkm-filters{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 14px}
.tkm-chip{background:#fff;border:1.5px solid var(--line);color:var(--navy-2);border-radius:999px;padding:8px 15px;font-size:13.5px;font-weight:700;cursor:pointer;transition:.12s}
.tkm-chip:hover{border-color:var(--teal)}
.tkm-chip[aria-pressed="true"]{background:var(--navy);color:#fff;border-color:var(--navy)}
.tkm-desk-rows{display:flex;flex-direction:column;gap:10px}
.tkm-row{display:grid;grid-template-columns:42px 66px 1.5fr 1.3fr 150px;align-items:center;gap:14px;
  background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px 16px;box-shadow:var(--shadow)}
.tkm-row[data-top="1"]{border:2px solid var(--gold);box-shadow:0 8px 26px rgba(246,183,60,.22)}
.tkm-rank{font-family:"Bebas Neue",sans-serif;font-size:26px;color:var(--navy);opacity:.55;text-align:center}
.tkm-row[data-top="1"] .tkm-rank{color:var(--gold);opacity:1}
.tkm-plate{width:66px;height:66px;border-radius:12px;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;overflow:hidden}
.tkm-plate img{max-width:58px;max-height:58px;object-fit:contain}
.tkm-award{display:inline-block;font-size:11px;font-weight:800;color:var(--teal-d);background:rgba(18,181,165,.12);border-radius:6px;padding:2px 7px;margin:0 0 3px}
.tkm-name{font-weight:800;font-size:16px;color:var(--navy);margin:0}
.tkm-bon{font-size:13px;color:var(--muted);margin:2px 0 0}
.tkm-scale-t{font-size:12.5px;font-weight:700;color:var(--navy-2);margin:0 0 5px}
.tkm-track{height:7px;border-radius:6px;background:linear-gradient(90deg,var(--teal),var(--gold),var(--accent))}
.tkm-fill{display:block;height:100%;border-radius:6px;background:var(--navy);opacity:.14}
.tkm-scale-l{display:flex;justify-content:space-between;font-size:10.5px;color:var(--muted);margin-top:4px}
.tkm-morewrap{text-align:center;margin-top:6px}
.tkm-more{background:var(--navy);color:#fff;border:0;border-radius:10px;padding:11px 22px;font-weight:700;cursor:pointer}
.tkm-mobile-cards{display:none;flex-direction:column;gap:12px}
.tkm-mcard{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px;box-shadow:var(--shadow);text-align:center}
.tkm-mcard[data-top="1"]{border:2px solid var(--gold)}
.tkm-mcard .tkm-rank{font-size:22px;text-align:left}
.tkm-mcard .tkm-plate{margin:2px auto 8px}
.tkm-mcard .tkm-scale{margin:10px 0}

/* ---------- CONTENT BLOCKS ---------- */
.tkm-callout{background:#fff4e6;border:1px solid #f4d9a6;border-left:5px solid var(--gold);border-radius:12px;padding:15px 18px;font-size:14.5px}
.tkm-authbox{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 16px;margin-bottom:16px}
.tkm-authbox .tkm-avatar{width:44px;height:44px;border-color:var(--teal)}
.tkm-authbox b{color:var(--navy)}
.tkm-authbox span{font-size:12.5px;color:var(--muted)}
.tkm-toc{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 18px;margin:18px 0}
.tkm-toc b{color:var(--navy)}
.tkm-toc ul{columns:2;margin:.5em 0 0;padding-left:18px}
.tkm-toc li{margin:3px 0}
@media(max-width:560px){.tkm-toc ul{columns:1}}
.tkm-table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:14px;background:#fff;box-shadow:var(--shadow)}
.tkm-cmp{border-collapse:collapse;width:100%;min-width:760px}
.tkm-cmp th,.tkm-cmp td{padding:11px 12px;text-align:left;border-bottom:1px solid var(--line);font-size:14px}
.tkm-cmp thead th{background:var(--navy);color:#fff;font-size:12px;text-transform:uppercase;letter-spacing:.03em;position:sticky;top:0}
.tkm-cmp tbody tr:nth-child(even){background:#fafbfe}
.tkm-cmp tbody tr:first-child td{background:#fff9ec}
.tkm-ol{margin:.6em 0;padding-left:22px}
.tkm-ol li{margin:7px 0}
.tkm-grid3{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.tkm-info{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 18px}
.tkm-info h4{margin:.2em 0 .4em;color:var(--navy)}
.tkm-info:first-child h4{color:var(--ok)}
.tkm-info:last-child h4{color:var(--accent-d)}
.tkm-info ul{margin:.3em 0;padding-left:18px}
.tkm-info li{margin:5px 0;font-size:14px}
.tkm-faq details{background:#fff;border:1px solid var(--line);border-radius:11px;margin:9px 0;padding:2px 16px}
.tkm-faq summary{cursor:pointer;font-weight:700;color:var(--navy);padding:12px 0;list-style:none}
.tkm-faq summary::-webkit-details-marker{display:none}
.tkm-faq summary::after{content:"+";float:right;color:var(--teal-d);font-weight:800}
.tkm-faq details[open] summary::after{content:"−"}
.tkm-faq .a{padding:0 0 12px;color:var(--ink)}
.tkm-links{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.tkm-links a{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 16px;color:var(--navy);font-weight:800}
.tkm-links a:hover{border-color:var(--teal);text-decoration:none}
.tkm-links a span{font-weight:500;color:var(--muted);font-size:12.5px;margin-top:3px}
.tkm-disc{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px 18px;font-size:13px;color:var(--muted)}
.tkm-disc b{color:var(--ink)}

/* ---------- RG bar + footer ---------- */
.tkm-rgbar{background:#08152b;color:#c6d6ec;font-size:12.5px;text-align:center;padding:11px 18px}
.tkm-rgbar a{color:#fff}
.tkm-foot{background:var(--navy);color:#c6d3e6;padding:30px 0 24px}
.tkm-foot-g{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:22px}
.tkm-foot h4{color:#fff;font-size:14px;margin:0 0 8px}
.tkm-foot a{display:block;color:#b7c6dc;font-size:13.5px;padding:3px 0}
.tkm-foot a:hover{color:#fff}
.tkm-foot-plate{font-family:"Bebas Neue",sans-serif;font-size:26px;letter-spacing:1px;color:#fff;margin-bottom:8px}
.tkm-foot-plate b{color:var(--accent);font-weight:400}
.tkm-age{display:inline-block;background:var(--accent);color:#fff;font-weight:800;border-radius:6px;padding:1px 7px;font-size:12px;margin-right:5px}
.tkm-legal{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.12);padding-top:14px;font-size:12.5px;color:#9fb0c8}
.tkm-legal a{display:inline;color:#c6d3e6}
.linklike{background:none;border:0;color:#c6d3e6;font:inherit;cursor:pointer;text-decoration:underline;padding:0}
.copy{grid-column:1/-1;color:#7f90ab;font-size:12px;margin:6px 0 0}

/* ---------- responsive ---------- */
@media(max-width:900px){
  .tkm-nav-links{display:none}
  .tkm-burger{display:block;position:relative}
  .tkm-foot-g{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  .tkm-desk-rows{display:none}
  .tkm-mobile-cards{display:flex}
  .tkm-links{grid-template-columns:1fr}
  .tkm-grid3{grid-template-columns:1fr}
  .tkm-foot-g{grid-template-columns:1fr}
  /* Mobile above-the-fold: keep only H1 + author/updated byline, then the toplist H2 + table.
     Trim the space-consuming hero bits (eyebrow, lede, trust chips, #1 ribbon). */
  .tkm-hero-in{padding:18px 18px 16px}
  .tkm-hero .tkm-eyebrow,.tkm-hero .tkm-lede,.tkm-hero .tkm-trust,.tkm-hero .tkm-hpick{display:none}
  .tkm-hero .tkm-h1{margin:.1em 0 .35em}
  .tkm-hero .tkm-byline{margin-top:8px;justify-content:flex-start}
  #toplist{padding-top:16px}
  #toplist>.tkm-wrap>p{display:none}          /* sub-line under the toplist H2 */
  #toplist>.tkm-wrap>h2{margin:0 0 .4em}
  .tkm-filters{margin:8px 0 12px;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .tkm-chip{flex:0 0 auto}
}
[data-seg].tkm-hide{display:none!important}
