/* build 18-07-2026-b — cache-verversing */
/* ============================================================
   exchangefacts.com — app.css (ENIGE bron van CSS voor:
   /, /en/, /vergelijken/, /en/compare/)

   SPELREGELS
   - Wijzig styling ALLEEN in dit bestand, nooit inline in de HTML.
   - Kaart-layout (result cards): zoek op "card-grid-fix" — dat blok
     is leidend voor het grid (3 kolommen, rang+naam samen in kolom 1).
   - Dropdown-panelen (Markt/Sorteren): zoek op "definitieve opgeruimde stijl".
   - Mobiele scoreregel: zoek op "compacte scoreregel op mobiel".
   - Pagina-specifieke regels zijn gescoped op body-class:
     .page-home (homepage) en .page-results (resultatenpagina).
   Laatste opschoning: 16 juli 2026.
   ============================================================ */

:root{
  --bg:#F4F7FB;
  --card:#FFFFFF;
  --ink:#101B33;
  --accent:#245DE8;
  --accent-2:#14B8A6;
  --accent-soft:#EEF4FF;
  --muted:#62708A;
  --line:#DFE6F1;
  --ok:#14945A;
  --ok-soft:#EAF8F1;
  --bad:#D23B2E;
  --gold:#B07E0A;
  --gold-soft:#FBF3DC;
  --radius:16px;
  --shadow:0 24px 70px -42px rgba(16,27,51,.42);
  --shadow-soft:0 14px 38px -30px rgba(16,27,51,.32);
}
*{margin:0;padding:0;box-sizing:border-box}
[hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
html{scroll-behavior:smooth}
body{
  font-family:'Inter',system-ui,sans-serif;
  background:
    linear-gradient(180deg,#FAFCFF 0,#F4F7FB 310px,#F6F8FC 100%);
  color:var(--ink);
  line-height:1.55;-webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
::selection{background:var(--accent);color:#fff}
.wrap{max-width:1920px;margin:0 auto;padding:0 40px}
a{color:var(--accent)}
button{font-family:inherit}

/* ---------- topbar ---------- */
.topbar{
  background:rgba(255,255,255,.86);border-bottom:1px solid rgba(223,230,241,.78);
  position:sticky;top:0;z-index:60;backdrop-filter:blur(16px);
}
.nav-grid{display:grid;grid-template-columns:auto minmax(440px,1fr) auto;align-items:center;gap:28px;height:64px}
.brand{
  display:flex;align-items:center;gap:9px;text-decoration:none;color:var(--ink);
  font-family:'Archivo',sans-serif;font-weight:800;font-size:19px;letter-spacing:-.02em;
  min-width:210px;
}
.site-logo{display:block;width:210px;height:auto}
.navlinks{display:flex;gap:12px;margin:0 auto;justify-content:center;min-width:760px}
.nav-item{position:relative}
.navlinks .nav-trigger{
  text-decoration:none;color:var(--ink);font-size:14px;font-weight:600;
  padding:21px 2px 19px;border-bottom:2px solid transparent;text-align:center;display:block;
}
.nav-item:nth-child(1) .nav-trigger{width:92px}
.nav-item:nth-child(2) .nav-trigger{width:96px}
.nav-item:nth-child(3) .nav-trigger{width:82px}
.nav-item:nth-child(4) .nav-trigger{width:96px}
.nav-item:nth-child(5) .nav-trigger{width:90px}

.navlinks .nav-trigger:hover{color:var(--accent)}
.navlinks .nav-trigger.active{border-bottom-color:var(--accent);color:var(--accent)}
.mega-panel{
  position:absolute;top:100%;left:50%;transform:translate(-50%,8px);
  min-width:330px;background:#fff;border:1px solid var(--line);border-radius:14px;
  box-shadow:0 24px 54px -30px rgba(16,27,51,.45);padding:10px;z-index:90;
  opacity:0;visibility:hidden;pointer-events:none;transition:.14s ease;
}
.nav-item:hover .mega-panel,
.nav-item:focus-within .mega-panel{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0)}
.nav-item:first-child .mega-panel{left:0;transform:translate(0,8px)}
.nav-item:first-child:hover .mega-panel,
.nav-item:first-child:focus-within .mega-panel{transform:translate(0,0)}
.nav-item:last-child .mega-panel{left:auto;right:0;transform:translate(0,8px)}
.nav-item:last-child:hover .mega-panel,
.nav-item:last-child:focus-within .mega-panel{transform:translate(0,0)}
.mega-panel a{
  display:block;text-decoration:none;color:var(--ink);font-size:13px;font-weight:650;
  padding:9px 10px;border-radius:9px;line-height:1.25;text-align:left;white-space:nowrap;
}
.mega-panel a:hover{background:var(--accent-soft);color:var(--accent)}
.mega-panel.info-mega{
  width:min(920px,calc(100vw - 48px));display:grid;grid-template-columns:repeat(4,minmax(165px,1fr));
  gap:18px;align-items:start;padding:22px 26px;border-radius:0 0 16px 16px;
}
.info-mega .mega-kicker{grid-column:1/-1;padding:0;margin:0 0 2px}
.info-mega .mega-col{display:flex;flex-direction:column;gap:2px}
.info-mega .mega-section{
  border:0;margin:0 0 8px;padding:0;color:var(--ink);font-size:15px;font-weight:850;
  letter-spacing:-.01em;text-transform:none;
}
.info-mega a{padding:7px 0;color:var(--accent);font-weight:750}
.info-mega a:hover{background:transparent;text-decoration:underline}
@media(max-width:1020px){.mega-panel.info-mega{display:none}}
.mega-kicker{
  display:block;padding:3px 10px 8px;color:var(--muted);font-size:11px;font-weight:800;
  letter-spacing:.06em;text-transform:uppercase;
}
.mega-section{display:block;color:#7B879C;font-size:10.5px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;margin:10px 10px 4px;padding-top:8px;border-top:1px solid #EEF3FA}
.mega-kicker + .mega-section{margin-top:0;padding-top:0;border-top:0}
.nav-actions{display:inline-flex;align-items:center;gap:10px}
.mobile-menu-btn{
  display:none;width:42px;height:38px;border:1.5px solid var(--line);border-radius:10px;
  background:var(--card);color:var(--ink);cursor:pointer;align-items:center;justify-content:center;
  transition:all .12s;
}
.mobile-menu-btn:hover{border-color:#BCC7DB;color:var(--accent)}
.mobile-menu-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.mobile-menu-btn svg{width:20px;height:20px}
.mobile-nav-panel{
  display:none;position:fixed;left:12px;right:12px;top:72px;z-index:95;
  max-height:calc(100vh - 88px);overflow:auto;background:#fff;border:1px solid var(--line);
  border-radius:16px;box-shadow:0 30px 70px -34px rgba(16,27,51,.48);padding:14px;
}
.mobile-nav-section + .mobile-nav-section{border-top:1px solid var(--line);margin-top:12px;padding-top:12px}
.mobile-nav-title{
  display:block;color:var(--muted);font-size:11px;font-weight:850;letter-spacing:.07em;
  text-transform:uppercase;margin:0 0 7px;
}
.mobile-nav-panel a{
  display:block;text-decoration:none;color:var(--ink);font-size:14px;font-weight:700;
  padding:10px 9px;border-radius:10px;line-height:1.25;
}
.mobile-nav-panel a:hover{background:var(--accent-soft);color:var(--accent)}
.langswitch,.curswitch{display:inline-flex;gap:6px}
.langbtn,.currencybtn{
  width:42px;height:38px;border:1.5px solid var(--line);border-radius:10px;background:var(--card);
  color:var(--muted);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;
  transition:all .12s;
}
.langbtn{width:62px;gap:6px}
.langbtn:hover,.currencybtn:hover{border-color:#BCC7DB;color:var(--ink)}
.langbtn:focus-visible,.currencybtn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.langbtn svg,.currencybtn svg{width:18px;height:18px}
.lang-code{font-family:'IBM Plex Mono',monospace;font-size:11.5px;font-weight:700;color:var(--ink)}
.lang-wrap,.currency-wrap{position:relative}
.lang-panel{
  position:absolute;right:0;top:calc(100% + 8px);z-index:80;background:#fff;border:1px solid var(--line);
  border-radius:12px;padding:6px;box-shadow:0 20px 44px -22px rgba(16,27,51,.42);min-width:150px;
}
.langoption{
  width:100%;border:1.5px solid transparent;border-radius:9px;background:var(--card);color:var(--ink);
  cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:9px 10px;font-size:13px;font-weight:650;text-align:left;transition:all .12s;
}
.langoption + .langoption{margin-top:4px}
.langoption .short{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--muted);font-weight:700}
.langoption.active{background:var(--accent-soft);border-color:#C4D6F9;color:var(--accent)}
.langoption:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.currencybtn.active{background:var(--ink);border-color:var(--ink);color:#fff;box-shadow:0 10px 22px -16px rgba(16,27,51,.65)}
.currency-panel{
  position:absolute;right:0;top:calc(100% + 8px);z-index:80;background:#fff;border:1px solid var(--line);
  border-radius:12px;padding:6px;box-shadow:0 20px 44px -22px rgba(16,27,51,.42);min-width:112px;
}
.curswitch{display:flex;flex-direction:column;gap:4px}
.curswitch .cur{
  font-family:'IBM Plex Mono',monospace;font-size:12.5px;font-weight:600;
  padding:9px 12px;border:1.5px solid transparent;border-radius:9px;text-align:left;
  background:var(--card);color:var(--muted);cursor:pointer;transition:all .12s;
}
.curswitch .cur.active{background:var(--ink);border-color:var(--ink);color:#fff;box-shadow:0 10px 22px -16px rgba(16,27,51,.65)}
.curswitch .cur:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* ---------- hero + calculator ---------- */
.hero{padding:66px 0 34px;position:relative;overflow:hidden}
.hero::after{
  content:'';position:absolute;left:0;right:0;bottom:-120px;height:330px;pointer-events:none;
  background:radial-gradient(circle at 18% 45%,rgba(36,93,232,.16),transparent 32%),
             radial-gradient(circle at 88% 45%,rgba(20,184,166,.16),transparent 34%);
}
.hero-grid{
  display:grid;grid-template-columns:minmax(420px,560px) minmax(292px,318px);gap:48px;align-items:center;
  justify-content:space-between;max-width:1588px;margin:0 auto;position:relative;z-index:1;
}
.hero-copy{max-width:560px;text-align:left;margin:0}
h1{
  font-family:'Archivo',sans-serif;font-weight:900;
  font-size:clamp(42px,4.4vw,64px);line-height:1.04;letter-spacing:-.03em;
  margin:4px 0 22px;text-wrap:balance;
}
h1 .accent{color:var(--accent)}
.lede{color:var(--muted);font-size:18px;max-width:50ch;margin:0;line-height:1.65}
.trust-row{display:none}
.trust-item{display:flex;align-items:flex-start;gap:10px}
.trust-icon{
  width:32px;height:32px;border-radius:10px;background:#fff;border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;color:var(--accent);box-shadow:var(--shadow-soft);flex-shrink:0;
}
.trust-title{display:block;font-size:12.5px;font-weight:850;color:var(--ink);line-height:1.25}
.trust-sub{display:block;font-size:11.5px;color:var(--muted);line-height:1.35;margin-top:3px}

.card{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow-soft);
}
.calc{
  padding:34px 38px 34px;position:relative;overflow:hidden;
  border-color:rgba(205,216,232,.95);box-shadow:var(--shadow);
}
.calc::before{
  content:'';position:absolute;left:0;right:0;top:0;height:4px;
  background:linear-gradient(90deg,var(--accent),var(--accent-2));
}
.calc-head{display:flex;align-items:center;justify-content:space-between;gap:22px;margin-bottom:24px}
.calc-head h2{font-family:'Inter',system-ui,sans-serif;font-weight:850;font-size:26px;letter-spacing:-.018em}
.how{font-size:14px;font-weight:750;text-decoration:none;white-space:nowrap;color:#2B63E6;text-align:right}
.how:hover{text-decoration:underline}
.profile-picker{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:24px}
#calculator .profile-picker{margin-top:0}
.profile-btn{
  border:1px solid #E3EAF4;background:#FFFFFF;color:var(--ink);border-radius:14px;
  min-height:82px;padding:14px 14px;text-align:left;cursor:pointer;position:relative;overflow:hidden;
  display:flex;flex-direction:column;justify-content:center;
  box-shadow:0 10px 26px -24px rgba(16,27,51,.35);
  transition:border-color .12s, box-shadow .12s, background .12s, transform .12s, color .12s;
}
.profile-btn[data-profile="retail"]{min-height:86px}
.profile-btn:hover{border-color:#C9D5E7;background:#FBFCFF;transform:translateY(-1px)}
.profile-btn.active{
  color:#fff;border-color:#245DE8;background:linear-gradient(180deg,#2E6AF2 0%,#174FD8 100%);
  box-shadow:0 18px 34px -20px rgba(36,93,232,.85), inset 0 1px 0 rgba(255,255,255,.28);
}
.profile-btn.active::after{
  content:'';position:absolute;top:12px;right:12px;width:8px;height:8px;border-radius:50%;
  background:#fff;box-shadow:0 0 0 4px rgba(255,255,255,.22);
}
.profile-btn:focus-visible{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px rgba(29,99,240,.14)}
.profile-name{display:flex;align-items:center;gap:7px;font-size:15px;font-weight:850;margin-bottom:3px}
.profile-dot{width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px rgba(36,93,232,.08)}
.profile-btn[data-profile="retail"] .profile-dot{background:var(--ok)}
.profile-btn[data-profile="vip"] .profile-dot{background:var(--accent)}
.profile-btn[data-profile="whale"] .profile-dot{background:var(--bad)}
.profile-btn[data-profile="custom"] .profile-dot{background:#667085}
.profile-vol{display:block;font-size:12.5px;font-weight:650;color:var(--muted)}
.profile-btn.active .profile-vol{color:rgba(255,255,255,.82)}
.profile-btn.active .profile-dot{box-shadow:0 0 0 4px rgba(255,255,255,.16)}
.calc-fields{display:grid;grid-template-columns:minmax(180px,.9fr) repeat(2,minmax(180px,1fr));gap:20px}
.market-first{grid-template-columns:1fr;margin-bottom:30px}
#calculator .market-first{grid-template-columns:1fr;max-width:none}
.volume-title{font-size:18px;font-weight:850;margin:0 0 14px;color:var(--ink)}
.volume-fields{grid-template-columns:1fr;max-width:none;margin-top:-8px}
#calculator .volume-fields{grid-template-columns:1fr;max-width:none}
.manual-volume-field label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.money-input{position:relative;display:block}
.money-prefix{
  position:absolute;left:22px;top:50%;transform:translateY(-50%);
  color:#5E6B84;font-weight:850;font-size:16px;line-height:1;pointer-events:none;
}
.field{display:flex;flex-direction:column;gap:7px;min-width:0}
.reserved-hidden{visibility:hidden;pointer-events:none}
.field > label{font-size:13px;font-weight:750;color:var(--ink)}
select,input[type=text]{
  font-family:'Inter',system-ui,sans-serif;font-size:16px;font-weight:600;color:var(--ink);
  background:#FBFCFF;border:1.5px solid #DDE5F0;border-radius:14px;
  padding:0 18px;width:100%;height:56px;transition:border-color .12s, box-shadow .12s;
}
.money-input input[type=text]{padding-left:78px}
select:hover,input[type=text]:hover{border-color:#B8C3D6}
select:focus,input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px rgba(29,99,240,.14)}
.custom-select-wrap{position:relative;width:100%}
.custom-select-wrap select{
  position:absolute!important;left:0;top:0;width:1px!important;height:1px!important;
  opacity:0!important;pointer-events:none!important;clip:rect(0,0,0,0)!important;
}
.calc-select-btn{
  font-family:'Inter',system-ui,sans-serif;font-size:16px;font-weight:600;color:var(--ink);
  background:#FBFCFF;border:1.5px solid #DDE5F0;border-radius:14px;
  padding:0 18px;width:100%;height:56px;transition:border-color .12s, box-shadow .12s, background .12s;
  display:flex;align-items:center;justify-content:space-between;gap:14px;text-align:left;cursor:pointer;
}
.calc-select-btn:hover{border-color:#B8C3D6}
.calc-select-btn:focus-visible,
.calc-select-btn[aria-expanded="true"]{
  outline:none;border-color:var(--accent);box-shadow:0 0 0 4px rgba(29,99,240,.14);
}
.calc-select-value{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.calc-select-chev{color:#10213D;font-size:18px;line-height:1;transition:transform .12s;flex:0 0 auto}
.calc-select-btn[aria-expanded="true"] .calc-select-chev{transform:rotate(180deg)}
.calc-select-panel{
  position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:120;
  background:#fff;border:1px solid #D8E1EE;border-radius:14px;
  box-shadow:0 22px 48px -22px rgba(16,27,51,.42);
  padding:6px;max-height:min(320px,calc(100vh - 120px));overflow:auto;
}
.calc-select-option{
  position:relative;width:100%;min-height:40px;border:0;border-radius:10px;background:transparent;
  color:var(--ink);font-family:'Inter',system-ui,sans-serif;font-size:15px;font-weight:650;
  display:flex;align-items:center;text-align:left;padding:8px 10px 8px 34px;cursor:pointer;
}
.calc-select-option:hover{background:#F2F6FF;color:var(--accent)}
.calc-select-option.actief{color:var(--accent);background:#EEF4FF}
.calc-select-option.actief::before{
  content:'✓';position:absolute;left:12px;top:50%;transform:translateY(-50%);
  color:var(--accent);font-weight:850;
}
.calc-select-option:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.derived{
  height:46px;display:flex;align-items:center;padding:0 12px;border-radius:10px;
  background:var(--accent-soft);border:1.5px dashed #B7CDF7;
  color:#1A4FBC;font-family:'IBM Plex Mono',monospace;font-size:14.5px;font-weight:600;
}
.calc-adv{
  display:flex;gap:22px;flex-wrap:wrap;align-items:flex-end;
  border-top:1px solid var(--line);margin-top:18px;padding-top:16px;
}
.calc-adv .field{max-width:180px}
.calc-result{
  display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;
  border-top:1px solid var(--line);padding-top:24px;margin-top:26px;
}
.rlabel{font-size:16px;font-weight:850;display:flex;align-items:center;gap:6px}
.rval{
  font-family:'Inter',system-ui,sans-serif;font-weight:900;font-size:46px;line-height:1.02;color:var(--ok);
  display:flex;align-items:center;gap:10px;margin:2px 0;
}
.rsub{font-size:15px;color:var(--muted)}
.rsub strong{color:var(--ink)}
.best-tag{
  display:inline-block;font-size:10px;font-weight:700;letter-spacing:.08em;
  color:var(--ok);background:var(--ok-soft);border:1px solid #BCE3CC;border-radius:999px;
  padding:2px 7px;font-family:'IBM Plex Mono',monospace;vertical-align:middle;
}
.calc-actions{display:flex;flex-direction:column;align-items:flex-end;gap:18px;margin-left:auto}
.calc-final{
  display:flex;align-items:center;justify-content:flex-end;gap:22px;flex-wrap:wrap;
  border-top:1px solid var(--line);padding-top:24px;margin-top:28px;
}
.calc-final .calc-actions{margin-left:0;align-items:flex-end}
#calculator .calc-final{display:block}
#calculator .calc-final .calc-actions{align-items:center;margin:0}
#calculator .calc-final .cta{width:100%;min-height:48px}
#calculator{
  width:100%;max-width:318px;justify-self:end;padding:16px 14px 17px;border-radius:16px;
}
#calculator .calc-head{align-items:flex-start;margin-bottom:12px;gap:10px}
#calculator .calc-head h2{font-size:18px;line-height:1.18;max-width:150px}
#calculator .how{
  width:24px;height:24px;border:1.5px solid #BFD0F7;border-radius:999px;
  display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;
  font-size:0;line-height:1;color:var(--accent);text-decoration:none;background:#fff;
}
#calculator .how::before{content:'i';font-size:14px;font-weight:850;font-family:'Inter',system-ui,sans-serif}
#calculator .how:hover{background:var(--accent-soft);text-decoration:none}
#calculator .market-first{gap:8px;margin-bottom:12px}
#calculator .field{gap:4px}
#calculator .field > label{font-size:11.5px}
#calculator .profile-picker{grid-template-columns:1fr 1fr;gap:8px;margin-bottom:11px}
#calculator .profile-btn{min-height:54px;padding:7px 9px;border-radius:11px}
#calculator .profile-btn[data-profile="retail"]{min-height:54px}
#calculator .profile-name{font-size:12.5px;gap:6px;margin-bottom:1px}
#calculator .profile-dot{width:7px;height:7px;box-shadow:0 0 0 3px rgba(36,93,232,.08)}
#calculator .profile-vol{font-size:10.5px;line-height:1.18}
#calculator .volume-title{font-size:12.5px;margin-bottom:7px}
#calculator select,#calculator input[type=text],
#calculator .calc-select-btn{height:40px;font-size:13px;border-radius:11px;padding:0 12px}
#calculator .calc-select-panel{top:calc(100% + 5px);border-radius:12px}
#calculator .calc-select-option{min-height:34px;font-size:13px;border-radius:8px;padding:7px 9px 7px 30px}
#calculator .calc-select-option.actief::before{left:10px}
#calculator .money-prefix{left:14px;font-size:13px}
#calculator .money-input input[type=text]{padding-left:46px}
#calculator .calc-adv{gap:12px}
#calculator .calc-final{margin-top:13px;padding-top:13px}
#calculator .linkbtn{text-align:center;font-size:11.5px;font-weight:650;color:#7B879A}
#calculator .calc-final .cta{min-height:42px;font-size:13px;border-radius:11px;padding:11px 16px}
.linkbtn{
  background:none;border:none;color:#516078;font-size:14px;font-weight:650;
  cursor:pointer;padding:2px;
}
.linkbtn:hover{color:var(--accent);text-decoration:underline}
.linkbtn:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
.cta{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;
  background:var(--accent);color:#fff;font-weight:800;font-size:16px;
  padding:16px 30px;border-radius:14px;transition:background .12s, transform .12s, box-shadow .12s;
  box-shadow:0 18px 34px -18px rgba(36,93,232,.85);
}
.cta:hover{background:#184FD1;transform:translateY(-1px);box-shadow:0 22px 38px -18px rgba(36,93,232,.92)}
.cta:focus-visible{outline:2px solid var(--ink);outline-offset:2px}

.side-calc-wrap{
  position:sticky;top:86px;align-self:start;z-index:10;margin-top:22px;width:318px;
}
.side-calc{
  padding:16px 14px 17px;border-radius:16px;
  box-shadow:0 26px 68px -42px rgba(16,27,51,.48);
}
.side-calc .calc-head{align-items:flex-start;margin-bottom:12px;gap:10px}
.side-calc .calc-head h2{font-size:18px;line-height:1.18;max-width:150px}
.side-calc .how{
  width:24px;height:24px;border:1.5px solid #BFD0F7;border-radius:999px;
  display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;
  font-size:0;line-height:1;color:var(--accent);text-decoration:none;background:#fff;
}
.side-calc .how::before{content:'i';font-size:14px;font-weight:850;font-family:'Inter',system-ui,sans-serif}
.side-calc .how:hover{background:var(--accent-soft);text-decoration:none}
.side-calc .market-first{gap:8px;margin-bottom:12px}
.side-calc .field{gap:4px}
.side-calc .field > label{font-size:11.5px}
.side-calc .profile-picker{grid-template-columns:1fr 1fr;gap:8px;margin-bottom:11px}
.side-calc .profile-btn{min-height:54px;padding:7px 9px;text-align:left;border-radius:11px}
.side-calc .profile-btn[data-profile="retail"]{min-height:54px}
.side-calc .profile-btn.active::after{top:9px;right:9px;width:7px;height:7px;box-shadow:0 0 0 4px rgba(255,255,255,.22)}
.side-calc .profile-name{font-size:12.5px;justify-content:flex-start;gap:6px;white-space:nowrap;margin-bottom:1px}
.side-calc .profile-dot{width:7px;height:7px;flex:0 0 7px;box-shadow:0 0 0 3px rgba(36,93,232,.08)}
.side-calc .profile-vol{font-size:10.5px;line-height:1.18}
.side-calc .calc-fields{grid-template-columns:1fr;gap:10px}
.side-calc select,.side-calc input[type=text],
.side-calc .calc-select-btn{height:40px;font-size:13px;border-radius:11px;padding:0 12px}
.side-calc .calc-select-panel{top:calc(100% + 5px);border-radius:12px}
.side-calc .calc-select-option{min-height:34px;font-size:13px;border-radius:8px;padding:7px 9px 7px 30px}
.side-calc .calc-select-option.actief::before{left:10px}
.side-calc .money-prefix{left:14px;font-size:13px}
.side-calc .money-input input[type=text]{padding-left:46px}
.side-calc .volume-title{font-size:12.5px;margin-bottom:7px}
.side-calc .calc-result{display:block;margin-top:22px;padding-top:22px}
.side-calc .rlabel{font-size:15px}
.side-calc .rval{font-size:42px;flex-wrap:wrap}
.side-calc .rsub{font-size:14px}
.side-calc .calc-actions{align-items:stretch;margin:13px 0 0;gap:12px}
.side-calc .calc-final{display:block;margin-top:13px;padding-top:13px}
.side-calc .calc-final .calc-actions{margin:0;align-items:stretch}
.side-calc .linkbtn{text-align:center;font-size:11.5px;font-weight:650;color:#7B879A}
.side-calc .cta{width:100%;min-height:42px;font-size:13px;border-radius:11px;padding:11px 16px}

.side-specs{display:grid;gap:12px;margin-top:12px}
.side-spec-clear{
  width:100%;border:1px solid var(--line);background:rgba(255,255,255,.86);color:#6A768A;
  min-height:40px;border-radius:14px;font-size:13px;font-weight:750;cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:8px;
}
.side-spec-clear:hover{border-color:#BFD0EE;color:var(--ink)}
.spec-card{
  border:1px solid var(--line);background:rgba(255,255,255,.9);border-radius:16px;
  padding:14px;box-shadow:0 18px 46px -38px rgba(16,27,51,.44);
}
.spec-title{display:flex;align-items:center;gap:7px;margin:0 0 10px;font-size:14px;font-weight:850;color:var(--ink)}
.spec-info{
  width:18px;height:18px;border-radius:999px;border:1.5px solid #AFC3E8;color:var(--accent);
  display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:900;
}
.spec-list{display:grid;gap:9px}
.spec-list .check{align-items:flex-start;gap:10px}
.spec-list .box{width:18px;height:18px;border-radius:5px;margin-top:1px}
.spec-list .ctext{font-size:13px;font-weight:720;line-height:1.25;color:var(--ink)}
.spec-row-muted .ctext{color:#8A96AA}
.spec-indent{padding-left:24px}
.spec-pill{
  display:inline-flex;align-items:center;height:20px;padding:0 8px;margin-left:6px;border-radius:7px;
  border:1px solid #AFC3E8;background:#F2F6FF;color:#2B61D6;font-size:10.5px;font-weight:850;
  vertical-align:1px;white-space:nowrap;
}
.spec-pill.purple{border-color:#C8B7FF;background:#F6F2FF;color:#7252C8}
.spec-select-all{font-size:12.5px;color:#6A768A;margin:-2px 0 8px}
.spec-select-all button{
  border:0;background:transparent;color:var(--accent);font:inherit;font-weight:800;cursor:pointer;padding:0 1px;
}
.spec-select-all button:hover{text-decoration:underline}

/* checkbox */
.check{display:flex;gap:9px;align-items:center;cursor:pointer;user-select:none}
.check input{position:absolute;opacity:0;width:0;height:0}
.box{
  width:20px;height:20px;border-radius:6px;border:1.5px solid var(--line);
  background:var(--card);flex-shrink:0;display:flex;align-items:center;justify-content:center;
  transition:all .12s;
}
.check input:checked + .box{background:var(--accent);border-color:var(--accent)}
.check input:checked + .box::after{
  content:'';width:10px;height:5px;border-left:2.5px solid #fff;border-bottom:2.5px solid #fff;
  transform:rotate(-45deg) translate(1px,-1px);
}
.check input:focus-visible + .box{outline:2px solid var(--accent);outline-offset:2px}
.check .ctext{font-size:13.5px;font-weight:600}

/* exchange-logo's in de resultaten */
.logo-lockup img,
.logo-lockup .brand-logo,
.logo-lockup .site-logo{
  display:block!important;width:auto!important;height:auto!important;
  max-width:172px!important;max-height:36px!important;object-fit:contain!important;
}
.brand-wordmark{
  display:block;font-family:'Archivo',sans-serif;font-weight:850;font-size:21px;
  letter-spacing:-.01em;line-height:1.08;color:var(--ink);
}
.logo-lockup{display:flex;align-items:flex-end;gap:8px;min-width:0;max-width:172px}
.logo-lockup.has-suffix img,
.logo-lockup.has-suffix .brand-logo,
.logo-lockup.has-suffix .site-logo{max-width:132px!important}
.logo-lockup.brand-backpack{max-width:194px}
.logo-lockup.brand-backpack img,
.logo-lockup.brand-backpack .brand-logo,
.logo-lockup.brand-backpack .site-logo{max-width:194px!important;max-height:42px!important}
.logo-lockup.brand-okx{max-width:184px}
.logo-lockup.brand-okx img,
.logo-lockup.brand-okx .brand-logo,
.logo-lockup.brand-okx .site-logo{max-width:184px!important;max-height:42px!important}
.logo-lockup.brand-kraken img,
.logo-lockup.brand-kraken .brand-logo,
.logo-lockup.brand-kraken .site-logo{max-width:150px!important;max-height:30px!important}
.logo-lockup.brand-kraken-pro.has-suffix img,
.logo-lockup.brand-kraken-pro.has-suffix .brand-logo,
.logo-lockup.brand-kraken-pro.has-suffix .site-logo{max-width:132px!important;max-height:28px!important}
.logo-lockup.brand-coinbase img,
.logo-lockup.brand-coinbase .brand-logo,
.logo-lockup.brand-coinbase .site-logo{max-width:172px!important;max-height:36px!important}
.logo-suffix{
  font-family:'Inter',sans-serif;font-size:15px;font-weight:800;color:#5E6B84;
  line-height:1;transform:translateY(-2px);
}

/* ---------- locatie, filters & sorteren ---------- */
.results-layout{
  display:grid;grid-template-columns:318px minmax(0,1180px);
  gap:28px;align-items:start;max-width:1526px;margin:0 auto;
  overflow-anchor:auto;
}
.results-main{min-width:0;width:100%;max-width:1180px;justify-self:stretch;scroll-margin-top:132px;overflow-anchor:auto}
.filtercard{
  background:rgba(255,255,255,.92);border:1px solid rgba(218,226,238,.95);border-radius:var(--radius);
  margin:22px 0 16px;box-shadow:var(--shadow-soft);
}
.mobile-filter-strip{display:none}
.fbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:15px 18px}
.fbar + .fbar{border-top:1px solid var(--line)}
.f-label{font-weight:700;font-size:13.5px}
.saved-filter{display:block}
.selbox{
  display:inline-flex;align-items:center;gap:9px;
  border:1.5px solid #DDE5F0;border-radius:12px;background:#FBFCFF;
  padding:0 8px 0 14px;height:46px;color:var(--ink);transition:border-color .12s, box-shadow .12s, background .12s;
}
.selbox:hover{border-color:#BCC7DB;background:#fff}
.selbox:focus-within{border-color:var(--accent);box-shadow:0 0 0 4px rgba(36,93,232,.10)}
.selbox svg{flex-shrink:0}
.selbox select{
  border:none;background:transparent;height:auto;width:auto;
  padding:6px 4px;font-size:13.5px;font-weight:600;font-family:'Inter',sans-serif;cursor:pointer;
}
.selbox select:focus{outline:none}

/* uitklapfilter (vergunningen) */
.ddwrap{position:relative}
.ddbtn{cursor:pointer;font-size:13.5px;font-weight:600;font-family:'Inter',sans-serif;padding:0 13px}
.filtercard .fbar > .ddwrap{flex:0 0 auto}
.filter-ddbtn{min-width:0;width:max-content;justify-content:flex-start}
.filter-ddbtn .chev{margin-left:auto}
.filter-ddbtn span{white-space:nowrap}
#regionBtn{min-width:220px}
#resultMarketBtn{min-width:230px}
#regionPanel,#resultMarketPanel{width:100%;min-width:100%}
.filter-panel{min-width:220px;padding:8px}
.saved-filter .ddbtn{min-width:168px;justify-content:flex-start}
.saved-filter .ddbtn .chev{margin-left:auto}
#permPanel,#prodPanel{min-width:250px}
.ddbtn .chev{transition:transform .15s;color:var(--muted)}
.ddbtn[aria-expanded="true"]{background:var(--accent-soft);border-color:#B7CDF7;color:var(--accent)}
.ddbtn[aria-expanded="true"] .chev{transform:rotate(180deg);color:var(--accent)}
.ddbtn.actief{border-color:#B7CDF7;color:var(--accent)}
.ddbtn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.ddpanel{
  position:absolute;top:calc(100% + 8px);left:0;z-index:40;
  background:var(--card);border:1px solid #DDE5F0;border-radius:14px;
  box-shadow:0 26px 60px -28px rgba(16,27,51,.42);
  padding:18px 20px 14px;min-width:270px;
}
.ddtitle{font-weight:700;font-size:14.5px;margin-bottom:12px}
.ddrow{padding:8px 0;width:100%}
.ddrow .ddname{font-size:14px;font-weight:500}
.ddrow .ddcount{margin-left:auto;color:var(--muted);font-family:'IBM Plex Mono',monospace;font-size:13px}
.ddclear{
  margin-top:10px;border:none;background:none;padding:4px 0;
  color:var(--accent);font-weight:600;font-size:14px;cursor:pointer;
}
.ddclear:hover{text-decoration:underline}
.ddclear:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
.sortbtn{
  display:inline-flex;align-items:center;gap:8px;cursor:pointer;
  color:var(--accent);font-weight:700;font-size:14.5px;
  border:none;background:var(--accent-soft);padding:9px 12px;border-radius:12px;
}
.sortbtn:hover{background:#E3ECFF}
.sortbtn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.sortpanel{left:auto;right:0;min-width:238px;padding:8px}
.sortopt{
  display:block;width:100%;text-align:left;border:none;background:none;cursor:pointer;
  position:relative;padding:10px 14px 10px 34px;border-radius:8px;
  font-size:14px;font-weight:500;color:var(--ink);
}
.sortopt:hover{background:var(--accent-soft)}
.sortopt.actief{color:var(--accent);font-weight:600}
.sortopt::before{content:''}
.sortopt.singleopt.actief::before,
.sortopt.sortchoice.actief::before{content:'✓';position:absolute;left:12px;font-weight:700;color:var(--accent)}
.sortopt:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.f-spacer{margin-left:auto}

/* ---------- resultaten ---------- */
.table-card{
  background:transparent;border:0;border-radius:0;box-shadow:none;position:relative;
  width:100%;max-width:1180px;
}
.table-scroll{overflow:visible;padding:0 0 2px}
table{width:100%;max-width:1180px;border-collapse:separate;border-spacing:0;min-width:0;table-layout:fixed}
tbody{display:grid;gap:14px}
tbody tr.mainrow{
  display:grid;grid-template-columns:minmax(300px,1fr) 170px 240px minmax(260px,.95fr);
  align-items:center;column-gap:18px;
}
tbody tr.mainrow > td{min-width:0}
thead{display:none}
thead tr{padding:0 32px}
th{
  font-size:12px;font-weight:750;color:#6B778F;text-align:left;padding:0 0 8px;
  border-bottom:0;background:transparent;white-space:nowrap;letter-spacing:.02em;text-transform:uppercase;
}
th .thsub{display:block;font-size:11px;font-weight:500;color:#93A0B8}
th.num,td.num{text-align:right}
thead th:nth-child(2){text-align:left}
td{padding:24px 0;border-bottom:0;vertical-align:middle;font-size:14px}
tbody tr.mainrow{
  height:138px;background:#fff;border:1px solid rgba(218,226,238,.95);border-radius:18px;
  box-shadow:0 16px 42px -32px rgba(16,27,51,.42);transition:border-color .14s,box-shadow .14s,transform .14s,background .14s;
  position:relative;
}
tbody tr.mainrow:hover{border-color:#C9D5E7;box-shadow:0 22px 54px -34px rgba(16,27,51,.5);transform:translateY(-1px)}
tbody tr.dimmed{opacity:.5}
tbody tr.no-price{
  background:#F9FBFE;border-color:#E5EAF3;box-shadow:none;color:#77839A;
}
tbody tr.no-price .exchange-main,
tbody tr.no-price .result-fees,
tbody tr.no-price .result-meta{opacity:.68}
tbody tr.no-price:hover{border-color:#DDE5F0;box-shadow:0 12px 32px -30px rgba(16,27,51,.28);transform:none}
tbody tr.winner{background:linear-gradient(90deg,#F2FCF7 0,#fff 64%);border-color:#48C47A;box-shadow:0 18px 48px -34px rgba(31,157,85,.62)}
.result-exchange{padding-left:32px;align-self:stretch;display:flex;align-items:center;min-width:0}
.result-meta,.result-fees,.result-cost{padding-left:10px;padding-right:10px;min-width:0}
.result-fees,.result-fees.num{text-align:left}
.result-cost,.result-cost.num{
  text-align:right;padding-right:32px;justify-self:end;width:100%;min-width:0;
  display:flex;flex-direction:column;align-items:flex-end;
}
.xrow{display:flex;gap:16px;align-items:center;width:100%}
.xrow .rank{
  min-width:44px;font-family:'Inter',system-ui,sans-serif;font-size:32px;font-weight:850;
  color:var(--ink);line-height:1;
}
tr.winner .xrow .rank{color:var(--ok)}
.exchange-main{min-width:0;display:flex;flex-direction:column;justify-content:center}
.exchange-action{display:block;margin-top:8px}
.result-products{margin-top:6px;color:#5E6B84;font-weight:600;font-size:13px}
.fee-stack{display:grid;gap:7px;justify-items:start}
.fee-stack .mono{font-size:14px}
.badge{
  display:inline-block;font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:600;
  padding:4px 9px;border-radius:999px;letter-spacing:.04em;white-space:nowrap;margin-right:6px;
}
.b-micar{color:#1A4FBC;background:var(--accent-soft);border:1px solid #C4D6F9}
.b-mifid{color:#8A6508;background:var(--gold-soft);border:1px solid #EAD8A0}
.b-none{color:var(--bad);background:#FBEBE9;border:1px solid #F0C9C4}
.b-spread{color:#B42318;background:#FFF1F0;border:1px solid #FDA29B}
.meta-warning{margin-top:8px}
.mono{font-family:'IBM Plex Mono',monospace;font-size:13px;font-weight:500;white-space:nowrap}
.sub{color:var(--muted);font-size:11px;font-weight:400;white-space:normal}
.na{color:var(--muted);font-family:'IBM Plex Mono',monospace;font-size:12.5px}
.no-price-label{
  display:inline-flex;align-items:center;justify-content:flex-end;
  color:#7E8AA0;font-size:14px;font-weight:750;text-align:right;line-height:1.3;
}
.cost-line{display:flex;align-items:baseline;justify-content:flex-end;gap:7px;flex-wrap:nowrap;width:100%;min-width:0;white-space:nowrap}
.cost{font-family:'Inter',system-ui,sans-serif;font-weight:900;font-size:clamp(22px,2vw,28px);letter-spacing:-.02em;color:var(--ink);white-space:nowrap}
.per-month{font-size:15px;font-weight:750;color:#5E6B84;white-space:nowrap;flex:0 0 auto}
.cost.best{color:var(--ok)}
.cost.neg{color:var(--ok)}
.cost-info{position:relative;display:inline-flex;align-items:center;margin-left:2px;flex:0 0 auto}
.cost-info-btn{
  width:18px;height:18px;border-radius:999px;border:1px solid #BFD0F7;background:#fff;color:var(--accent);
  display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:900;line-height:1;
  padding:0;cursor:help;box-shadow:0 6px 18px -14px rgba(37,99,235,.55);
}
.cost-info-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.breakdown-popover{display:none}
.floating-breakdown-popover{
  position:fixed;z-index:10000;width:min(316px,calc(100vw - 24px));max-height:calc(100vh - 24px);
  overflow:auto;padding:12px 13px;border:1px solid #D9E2EF;border-radius:12px;background:#fff;
  box-shadow:0 24px 54px -24px rgba(16,27,51,.45);text-align:left;color:var(--ink);
}
.floating-breakdown-popover[hidden]{display:none}
.floating-breakdown-popover::before{
  content:'';position:absolute;right:14px;top:-6px;width:10px;height:10px;background:#fff;
  border-left:1px solid #D9E2EF;border-top:1px solid #D9E2EF;transform:rotate(45deg);
}
.floating-breakdown-popover.is-above::before{top:auto;bottom:-6px;transform:rotate(225deg)}
.floating-breakdown-popover.is-sheet{
  left:12px!important;right:12px!important;top:auto!important;bottom:12px!important;
  width:auto;max-height:min(70vh,480px);border-radius:16px;padding:16px;
}
.floating-breakdown-popover.is-sheet::before{display:none}
.break-title{font-size:12px;font-weight:850;margin-bottom:8px}
.break-row{display:flex;justify-content:space-between;gap:14px;font-size:12px;line-height:1.35;color:#647088;padding:4px 0}
.break-row strong{color:var(--ink);font-weight:800;text-align:right;white-space:nowrap}
.break-row.good strong{color:var(--ok)}
.break-row.net{border-top:1px solid var(--line);margin-top:6px;padding-top:9px;color:var(--ink);font-weight:800}
.break-row.net strong{font-size:13px}
.winner-ribbon{
  position:absolute;top:0;left:24px;transform:translateY(-50%);
  display:inline-flex;align-items:center;gap:7px;
  color:var(--ok);background:#EAF8F1;border:1px solid #BCE3CC;border-radius:999px;
  padding:5px 12px;font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:750;
  letter-spacing:.08em;line-height:1;box-shadow:0 10px 24px -18px rgba(31,157,85,.65);
}
.winner-ribbon::before{content:'';width:7px;height:7px;border-radius:999px;background:var(--ok)}
.avgdiff{display:block;margin-top:6px;font-size:14px;font-weight:850;white-space:nowrap;text-align:right}
.avgdiff.good{color:var(--ok)}
.avgdiff.bad{color:var(--bad)}
.avgdiff.neutral{color:var(--muted)}
.year-saving{
  display:block;margin-top:5px;max-width:none;font-size:12.5px;font-weight:650;
  color:#6B778F;white-space:normal;text-align:right;line-height:1.3;
}
.year-saving strong{color:var(--ok);font-weight:850}
.year-saving.bad strong{color:var(--bad)}
.detbtn{
  min-width:0;height:auto;padding:0;border:0;background:transparent;
  cursor:pointer;color:#9AA3B4;display:inline-flex;align-items:center;justify-content:flex-start;gap:8px;
  font-weight:650;font-size:13.5px;transition:color .12s;
}
.detbtn:hover{color:var(--accent)}
.detbtn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.detbtn svg{display:none}
tr.open .detbtn svg{transform:rotate(90deg)}
tr.detail{display:table-row}
tr.detail > td{
  background:#FAFBFD;border:1px solid rgba(218,226,238,.95);border-top:0;border-radius:0 0 16px 16px;
  padding:18px 24px 22px 96px;
}
.dgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px 26px;max-width:1000px}
.dlabel{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:3px}
.dval{font-size:13px;line-height:1.5}
.footnote{
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  font-size:12.5px;color:var(--muted);padding:16px 4px 0;
}
.footnote a{font-weight:600;text-decoration:none}
.footnote a:hover{text-decoration:underline}
.empty{padding:36px 20px;text-align:center;color:var(--muted);font-size:14px}

/* ---------- footer ---------- */
footer{
  background:#FFFFFF;border-top:1px solid var(--line);
  margin-top:44px;padding:34px 0 52px;font-size:12.5px;color:var(--muted);
}
footer p{max-width:96ch;margin-bottom:10px;line-height:1.65}
footer strong{color:var(--ink)}

@media(max-width:1440px){
  .wrap{max-width:1320px;padding:0 24px}
  .hero-grid{grid-template-columns:minmax(420px,560px) minmax(292px,318px);gap:40px;max-width:1320px}
  .results-layout{display:block;max-width:1320px}
  .side-calc-wrap{display:none}
  table{min-width:0;max-width:none}
  thead tr, tbody tr.mainrow{grid-template-columns:minmax(300px,1fr) 170px 240px minmax(260px,.95fr)}
}
@media(max-width:1280px){
  .wrap{max-width:1220px;padding:0 18px}
  .hero{padding-top:48px}
  .hero-grid{grid-template-columns:minmax(400px,540px) minmax(292px,318px);gap:28px;max-width:1220px}
  h1{font-size:clamp(38px,4vw,54px)}
  .lede{font-size:17px}
  .calc{padding:28px 28px 30px}
  .profile-picker{gap:10px}
  .profile-btn{padding:12px 12px}
  .calc-fields{gap:14px}
  #calculator .market-first,#calculator .volume-fields{max-width:none}
  table{min-width:0;max-width:none}
  thead tr, tbody tr.mainrow{grid-template-columns:minmax(250px,1fr) 150px 215px minmax(230px,.9fr)}
  thead tr{padding:0 22px}
  td{padding:22px 0}
  tbody tr.mainrow{height:136px}
  .result-exchange{padding-left:22px}
  .result-meta,.result-fees{padding-left:8px;padding-right:8px}
  .result-cost{padding-left:8px;padding-right:22px;width:100%}
  .xrow{gap:14px}
  .xrow .rank{min-width:40px;font-size:30px}
  .brand-logo{max-width:164px;max-height:34px}
  .brand-wordmark{font-size:20px}
  .logo-lockup{max-width:164px}
  .logo-lockup.has-suffix .brand-logo{max-width:126px}
  .logo-suffix{font-size:14px}
  .cost{font-size:24px}
  .per-month{font-size:13px}
  .avgdiff{font-size:13px}
  .year-saving{font-size:12px;margin-top:4px}
  .detbtn{font-size:13.5px;padding:0}
}
@media(max-width:1120px){
  .hero-grid{
    grid-template-columns:minmax(0,1fr) minmax(292px,318px);
    gap:24px;
    max-width:1040px;
  }
  .hero-copy{max-width:none;text-align:left;margin:0}
  .lede{margin:0}
  .trust-row{margin-left:0;margin-right:0}
  .calc{max-width:none;margin:0}
  #calculator{justify-self:end;max-width:318px}
  table{min-width:0;border-spacing:0}
  tbody{gap:12px}
  thead{display:none}
  tbody tr.mainrow{grid-template-columns:1.4fr 1fr;height:auto;min-height:0;padding:24px;gap:18px 24px}
  td{padding:0}
  .result-exchange,.result-fees,.result-cost,.result-meta{padding:0;text-align:left}
  .result-exchange{grid-column:1 / 2}
  .exchange-main{padding-bottom:0}
  .exchange-action{position:static;margin-top:12px}
  .result-cost{grid-column:2 / 3;grid-row:1 / 2;text-align:right;justify-self:end;width:min(100%,300px);align-items:flex-end}
  .result-fees{grid-column:1 / 2}
  .result-meta{grid-column:2 / 3}
  tr.detail > td{padding:18px 22px 22px}
}
@media(max-width:1020px){
  .nav-grid{grid-template-columns:auto auto;justify-content:space-between}
  .hero-grid{
    grid-template-columns:minmax(0,1fr) minmax(286px,318px);
    gap:18px;
    max-width:960px;
  }
  .hero-copy{max-width:none;text-align:left;margin:0}
  .lede{margin:0}
  .trust-row{margin-left:0;margin-right:0}
  .calc-fields{grid-template-columns:1fr 1fr}
  #calculator .market-first,#calculator .volume-fields{grid-template-columns:1fr}
  .profile-picker{grid-template-columns:1fr 1fr}
  .navlinks{display:none}
  .mobile-menu-btn{display:inline-flex}
  .mobile-nav-panel:not([hidden]){display:block}
}
@media(max-width:860px){
  .hero-grid{grid-template-columns:1fr}
  .hero-copy{max-width:760px;text-align:center;margin:0 auto}
  .lede{margin:0 auto}
  .trust-row{margin-left:auto;margin-right:auto}
  #calculator{justify-self:center;max-width:318px}
}
@media(max-width:640px){
  .wrap{padding-left:14px;padding-right:14px}
  .nav-grid{gap:10px}
  .brand{min-width:0}
  .site-logo{width:156px;max-width:42vw}
  .nav-actions{gap:8px}
  .langbtn{width:54px}
  .mobile-menu-btn,.currencybtn{width:38px}
  .hero{padding-top:30px}
  .hero-copy{text-align:left}
  .lede{margin:0}
  .trust-row{grid-template-columns:1fr;gap:12px;margin-top:28px}
  .calc{padding:24px 20px 26px}
  .hero-grid,.results-layout,.results-main,.filtercard,.table-card,.table-scroll,
  #calculator,.calc,.card,.profile-picker,.calc-fields,.field,tbody tr.mainrow{min-width:0;max-width:100%}
  #calculator{width:100%;max-width:318px}
  .calc-head{align-items:flex-start;flex-direction:column;gap:8px}
  .how{text-align:left}
  .profile-picker{grid-template-columns:1fr 1fr}
  .calc-fields{grid-template-columns:1fr}
  #calculator .market-first,#calculator .volume-fields{grid-template-columns:1fr;max-width:none}
  .money-prefix{left:18px}
  .money-input input[type=text]{padding-left:62px}
  .settingsbar .aanpassen{margin-left:0}
  table{min-width:0;border-spacing:0}
  tbody{gap:12px}
  thead{display:none}
  tbody tr.mainrow{grid-template-columns:1fr;min-height:0;padding:18px 18px 20px;gap:14px}
  td{padding:0}
  .result-exchange,.result-meta,.result-fees,.result-cost{padding:0;text-align:left}
  .exchange-main{padding-bottom:0}
  .exchange-action{position:static;margin-top:12px}
  .result-cost{width:100%;align-items:flex-start}
  .cost-line{justify-content:flex-start}
  .avgdiff{text-align:left}
  .year-saving{text-align:left;white-space:normal}
  .filtercard{margin:18px 0 12px;background:transparent;border:0;box-shadow:none}
  .mobile-filter-strip{display:flex;align-items:center;gap:8px;overflow-x:auto;padding:0 0 2px;scrollbar-width:none}
  .mobile-filter-strip::-webkit-scrollbar,.mobile-filter-chips::-webkit-scrollbar{display:none}
  .mobile-filter-toggle{height:44px;display:inline-flex;align-items:center;gap:9px;flex:0 0 auto;border:0;border-radius:12px;background:var(--ink);color:#fff;padding:0 12px;font-weight:850;font-size:15px}
  .mobile-filter-toggle svg{flex:0 0 auto}
  .mobile-filter-count{display:inline-grid;place-items:center;min-width:24px;height:24px;border-radius:999px;background:#fff;color:#222;font-weight:850;font-size:13px}
  .mobile-filter-chips{display:flex;align-items:center;gap:8px;min-width:0;overflow-x:auto;flex:1}
  .mobile-filter-chip{height:44px;display:inline-flex;align-items:center;gap:7px;flex:0 0 auto;border:1px solid #E0E7F2;border-radius:999px;background:#F2F5FA;color:#62708A;padding:0 12px;font-weight:800;font-size:14.5px;white-space:nowrap}
  .mobile-filter-chip.is-locked{padding-right:14px;color:#7A869C}
  .mobile-filter-chip button{width:24px;height:24px;display:grid;place-items:center;border:0;border-radius:999px;background:transparent;padding:0;margin:0;color:#64748B;font-size:21px;line-height:1;cursor:pointer}
  .mobile-filter-chip button:hover{background:#E5EAF3}
  .filtercard:not(.filters-open) .fbar{display:none}
  .filtercard.filters-open .fbar{display:flex;flex-direction:column;align-items:stretch;gap:10px;margin-top:12px;padding:14px;background:#fff;border:1px solid rgba(218,226,238,.95);border-radius:18px;box-shadow:var(--shadow-soft)}
  .filtercard.filters-open .saved-filter{display:block}
  .filtercard.filters-open .f-label{font-size:12px;text-transform:uppercase;letter-spacing:.02em;color:#66738A}
  .filtercard .ddwrap,.filtercard .filter-ddbtn{width:100%;min-width:0}
  .filtercard .filter-panel{position:static;margin-top:8px;width:100%;min-width:0;box-shadow:none}
  .filtercard .sortbtn,
  .filtercard .sortpanel{display:none!important}
  .winner-ribbon{left:18px}
  .fee-stack{justify-items:start}
  .xrow{gap:12px}
  .xrow .rank{min-width:34px;font-size:28px}
  .site-logo{width:178px}
  .brand-logo{max-width:150px;max-height:32px}
  .brand-wordmark{font-size:19px}
  .logo-lockup{max-width:150px}
  .logo-lockup.has-suffix .brand-logo{max-width:116px}
  .logo-suffix{font-size:13px}
  .cost{font-size:24px}
  .detbtn{width:100%;min-width:0}
  tr.detail > td{padding-left:18px}
}
@media(max-width:360px){
  .profile-picker{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important}
  html{scroll-behavior:auto}
}

/* fixes v1.3 */
.tablewrap{overflow-x:auto;margin:18px 0}
table{width:100%;border-collapse:collapse;font-size:14.5px;background:#fff}
th,td{border:1px solid var(--line);padding:10px 12px;text-align:left;vertical-align:top}
th{background:#F4F8FF;font-weight:800;white-space:nowrap}
tbody tr:nth-child(even){background:#FAFCFF}
.table-card table{width:100%;max-width:1180px;border-collapse:separate;border-spacing:0;min-width:0;table-layout:fixed;background:transparent}
.table-card th,
.table-card td{border:0;background:transparent}
.table-card tbody tr:nth-child(even){background:#fff}
.table-card tbody tr.winner:nth-child(even){background:linear-gradient(90deg,#F2FCF7 0,#fff 64%)}
.table-card tbody tr.no-price:nth-child(even){background:#F9FBFE}
p.faq{margin:0 0 16px}
p.faq strong{display:block;margin-bottom:2px}
.seealso{border-top:1px solid var(--line);margin-top:30px;padding-top:18px}
.seealso ul{margin:8px 0 0 22px}

/* Resultaatkaarten blijven één rustige balk; content-tabellen mogen hier geen celranden maken. */
.table-card table,
.table-card tbody,
.table-card th,
.table-card td{
  border:0!important;
  outline:0!important;
}
.table-card tr{outline:0!important}
.table-card table{
  border-collapse:separate!important;
  border-spacing:0!important;
  background:transparent!important;
}
.table-card tbody tr.mainrow > td,
.table-card .result-exchange,
.table-card .result-fees,
.table-card .result-meta,
.table-card .result-cost{
  border:0!important;
  background:transparent!important;
  outline:0!important;
}
.table-card tbody tr.mainrow{
  border:1px solid rgba(218,226,238,.95)!important;
}
.table-card tbody tr.winner{
  border-color:#48C47A!important;
}
.table-card tbody tr.no-price{
  border-color:#E5EAF3!important;
}
ol{margin:0 0 18px 22px;color:#34405A}
ol li{margin:7px 0}
/* unified information mega menu */
.mega-panel.info-mega{
  width:min(76vw,940px)!important;
  max-height:none!important;
  overflow:visible!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:22px 36px!important;
  padding:28px 32px!important;
}
.nav-item:hover .mega-panel.info-mega,
.nav-item:focus-within .mega-panel.info-mega{
  display:grid!important;
}
.info-mega .mega-kicker{
  grid-column:1/-1!important;
  padding:0!important;
  margin:0 0 2px!important;
  color:var(--muted)!important;
  font-weight:900!important;
  font-size:12px!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}
.info-mega .mega-col{
  display:flex!important;
  flex-direction:column!important;
  gap:2px!important;
}
.info-mega .mega-section{
  color:var(--ink)!important;
  font-weight:900!important;
  font-size:15px!important;
  letter-spacing:-.015em!important;
  text-transform:none!important;
  border:0!important;
  padding:0!important;
  margin:0 0 10px!important;
}
.info-mega a{
  padding:7px 0!important;
  color:var(--accent)!important;
  font-weight:750!important;
  border-radius:0!important;
}
.info-mega a:hover{
  background:transparent!important;
  color:var(--accent)!important;
  text-decoration:underline!important;
}
@media(max-width:1020px){
  .mega-panel.info-mega{display:none!important}
}
/* end unified information mega menu */


/* unified header dropdown consistency v2 */
.nav-item .mega-panel{
  position:fixed!important;
  top:64px!important;
  left:50%!important;
  right:auto!important;
  transform:translate(-50%,8px)!important;
  width:min(1120px,calc(100vw - 96px))!important;
  min-width:0!important;
  max-width:none!important;
  background:#fff!important;
  border:1px solid var(--line)!important;
  border-radius:0 0 16px 16px!important;
  box-shadow:0 26px 62px -34px rgba(16,27,51,.45)!important;
  padding:26px 32px!important;
  z-index:120!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:10px 34px!important;
  align-items:start!important;
  transition:opacity .14s ease, transform .14s ease!important;
}
.nav-item:hover .mega-panel,
.nav-item:focus-within .mega-panel{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
  transform:translate(-50%,0)!important;
  display:grid!important;
}
.nav-item:first-child .mega-panel,
.nav-item:last-child .mega-panel,
.nav-item:first-child:hover .mega-panel,
.nav-item:first-child:focus-within .mega-panel,
.nav-item:last-child:hover .mega-panel,
.nav-item:last-child:focus-within .mega-panel{
  left:50%!important;
  right:auto!important;
  transform:translate(-50%,0)!important;
}
.nav-item .mega-panel .mega-kicker{
  grid-column:1/-1!important;
  display:block!important;
  margin:0 0 8px!important;
  padding:0!important;
  color:var(--muted)!important;
  font-size:12px!important;
  font-weight:900!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}
.nav-item .mega-panel .mega-col{display:flex!important;flex-direction:column!important;gap:2px!important}
.nav-item .mega-panel .mega-section{
  display:block!important;
  margin:0 0 8px!important;
  padding:0!important;
  border:0!important;
  color:var(--ink)!important;
  font-size:15px!important;
  font-weight:850!important;
  letter-spacing:-.01em!important;
  text-transform:none!important;
}
.nav-item .mega-panel a{
  display:block!important;
  padding:7px 0!important;
  border-radius:0!important;
  background:transparent!important;
  color:var(--accent)!important;
  font-size:14px!important;
  font-weight:750!important;
  line-height:1.35!important;
  text-decoration:none!important;
  white-space:normal!important;
}
.nav-item .mega-panel a:hover,
.nav-item .mega-panel a:focus-visible{
  color:#1D4ED8!important;
  text-decoration:underline!important;
  outline:none!important;
}
@media(max-width:1020px){
  .nav-item .mega-panel{display:none!important}
}
/* end unified header dropdown consistency v2 */


/* nav-cta v1.4 */
.nav-cta{display:inline-flex;align-items:center;height:38px;border-radius:10px;background:var(--accent);color:#fff;padding:0 14px;font-weight:850;font-size:13px;text-decoration:none;white-space:nowrap}
.nav-cta:hover{background:#1D4ED8;text-decoration:none;color:#fff}
@media(max-width:900px){}

/* mobile result-card hardening: no desktop columns may bleed into iPhone cards */
@media(max-width:640px){
  .table-card tbody tr.mainrow{
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-template-areas:
      "exchange"
      "cost"
      "fees"
      "meta"!important;
    height:auto!important;
    min-height:0!important;
    padding:22px 18px 20px!important;
    gap:14px!important;
    overflow:visible!important;
  }
  .table-card .result-exchange,
  .table-card .result-cost,
  .table-card .result-fees,
  .table-card .result-meta{
    grid-column:auto!important;
    grid-row:auto!important;
    width:100%!important;
    max-width:100%!important;
    justify-self:stretch!important;
    padding:0!important;
    text-align:left!important;
    border:0!important;
    background:transparent!important;
  }
  .table-card .result-exchange{grid-area:exchange!important}
  .table-card .result-cost{
    grid-area:cost!important;
    align-items:flex-start!important;
    margin-top:2px!important;
  }
  .table-card .result-fees{grid-area:fees!important}
  .table-card .result-meta{grid-area:meta!important}
  .table-card .xrow{
    align-items:flex-start!important;
    gap:14px!important;
  }
  .table-card .xrow .rank{
    min-width:34px!important;
    width:34px!important;
    flex:0 0 34px!important;
    font-size:30px!important;
    padding-top:8px!important;
  }
  .table-card .exchange-main{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  .table-card .logo-lockup{
    width:auto!important;
    max-width:min(210px,calc(100vw - 112px))!important;
  }
  .table-card .brand-logo{
    max-width:min(210px,calc(100vw - 112px))!important;
    max-height:46px!important;
    object-fit:contain!important;
  }
  .table-card .brand-backpack .brand-logo,
  .table-card .brand-okx .brand-logo,
  .table-card .brand-bitvavo .brand-logo,
  .table-card .brand-bybit-eu .brand-logo,
  .table-card .brand-finst .brand-logo{
    max-height:38px!important;
  }
  .table-card .cost-line{
    justify-content:flex-start!important;
    align-items:baseline!important;
    gap:6px!important;
  }
  .table-card .cost{
    font-size:28px!important;
    line-height:1.05!important;
  }
  .table-card .per-month{
    font-size:15px!important;
  }
  .table-card .cost-info{
    margin-left:4px!important;
  }
  .table-card .avgdiff,
  .table-card .year-saving{
    text-align:left!important;
    white-space:normal!important;
  }
  .table-card .fee-stack{
    justify-items:start!important;
  }
  .table-card .mono{
    font-size:15px!important;
  }
  .table-card .result-products{
    font-size:14px!important;
    line-height:1.35!important;
  }
  .table-card .winner-ribbon{
    left:18px!important;
    top:0!important;
  }
  .table-card .detbtn{
    width:auto!important;
  }
  .receipt-share,
  .fee-receipt,
  .share-receipt{
    display:none!important;
  }
}

/* ---------- result cards + filter bar final polish ---------- */
.results-count{
  max-width:1180px;margin:0 0 10px;color:#647088;font-size:14px;font-weight:800;
}
.filtercard .fbar{gap:14px}
.filtercard .fbar > .ddwrap{flex:0 0 auto;width:auto!important;min-width:0!important}
.filtercard .filter-ddbtn{
  width:auto!important;min-width:0!important;max-width:100%;
  padding:0 16px!important;gap:12px!important;
}
#regionBtn{min-width:180px!important}
#resultMarketBtn{min-width:230px!important}
#regionPanel,
#resultMarketPanel{
  width:max-content!important;min-width:100%!important;left:0!important;right:auto!important;
  top:calc(100% + 8px)!important;bottom:auto!important;
}
.sortopt.singleopt::before{
  content:''!important;width:0!important;margin:0!important;
}
.sortopt.singleopt[aria-selected="true"]::before{
  content:'✓'!important;position:absolute!important;left:12px!important;width:auto!important;
  margin:0!important;color:var(--accent);font-weight:900;
}
.receipt-share,
.fee-receipt,
.share-receipt,
[data-share-receipt],
#feeReceipt,
#shareReceipt,
.receipt-modal{
  display:none!important;
}
.table-card{max-width:1180px}
.table-scroll{overflow:visible!important}
#tbl{
  width:100%;max-width:1180px;border-collapse:separate!important;border-spacing:0 14px!important;
  table-layout:auto!important;background:transparent!important;
}
#tbl thead{display:none!important}
#tbl tbody{
  display:grid!important;gap:14px!important;width:100%;
}
#tbl tr.mainrow.result-card-v2{
  display:block!important;position:relative;height:auto!important;min-height:0!important;
  background:#fff!important;border:1px solid rgba(218,226,238,.95)!important;border-radius:18px!important;
  box-shadow:0 10px 26px rgba(15,23,42,.05)!important;overflow:visible!important;
  transition:border-color .14s,box-shadow .14s,transform .14s,background .14s!important;
}
#tbl tr.mainrow.result-card-v2:hover{
  border-color:#C9D5E7!important;box-shadow:0 14px 34px rgba(15,23,42,.07)!important;
  transform:translateY(-1px)!important;
}
#tbl tr.mainrow.result-card-v2.winner{
  background:linear-gradient(90deg,rgba(236,255,245,.86),#fff 44%)!important;
  border-color:#43C979!important;
}
#tbl tr.mainrow.result-card-v2.no-price{
  background:#F9FBFE!important;opacity:.72;
}
#tbl tr.mainrow.result-card-v2 > td.result-card-cell{
  display:block!important;width:100%!important;padding:0!important;border:0!important;background:transparent!important;
}
.result-top-v2{
  display:grid!important;grid-template-columns:minmax(340px,1.05fr) minmax(190px,.55fr) minmax(310px,.72fr);
  gap:28px;align-items:center;padding:30px 34px 26px;
}
.result-brand-v2{
  display:grid;grid-template-columns:46px minmax(0,1fr);gap:22px;align-items:center;min-width:0;
}
.result-brand-v2 .rank{
  font-size:33px;line-height:1;font-weight:950;color:var(--ink);
}
.winner .result-brand-v2 .rank{color:#159552}
.result-logo-wrap{display:block;min-width:0}
.result-logo-wrap .brand-logo{
  width:auto;height:auto;max-width:260px;max-height:50px;object-fit:contain;
}
.result-subtitle{
  display:block;margin-top:8px;color:#536177;font-size:15px;line-height:1.35;font-weight:820;
}
.result-badges-v2{
  display:flex;gap:8px;flex-wrap:wrap;margin-top:14px;
}
.result-badges-v2:empty{display:none}
.result-badges-v2 .badge,
.result-badges-v2 .tag,
.result-badges-v2 .pill{margin:0}
.result-detail-link{margin-top:7px}
.result-fees-v2{
  display:flex;flex-direction:column;gap:8px;align-items:flex-start;
}
.fee-label-v2{
  font-size:12px;color:#647088;font-weight:760;
}
.result-fees-v2 .mono{
  font-size:17px;font-weight:880;color:var(--ink);
}
.result-price-v2{
  display:flex;flex-direction:column;align-items:flex-end;text-align:right;gap:10px;min-width:0;
}
.result-price-v2 .cost-line{
  justify-content:flex-end!important;white-space:nowrap;
}
.result-price-v2 .cost{font-size:30px}
.result-price-v2 .no-price-label{font-size:16px}
.exchange-cta{
  display:inline-flex!important;align-items:center;justify-content:center;gap:10px;
  min-width:190px;height:44px;padding:0 22px!important;border-radius:14px;border:0!important;
  background:var(--accent)!important;color:#fff!important;font-size:15px;font-weight:900;
  box-shadow:0 12px 24px rgba(37,99,235,.22);
}
.exchange-cta:hover{background:#1E55D8!important;color:#fff!important}

.score-item{display:inline-flex;gap:9px;align-items:center;color:#647088}
.score-item strong{color:var(--ink)}
.score-shield,
.trust-item{color:#159552}
@media(max-width:760px){
  .results-main{padding:0 14px;overflow:hidden}
  .results-count{display:none}
  .filtercard .sortbtn,
  .filtercard .sortpanel,
  .sortbtn,
  .sortpanel{display:none!important}
  .filtercard.filters-open .fbar{display:flex}
  #tbl{border-spacing:0 18px!important}
  #tbl tbody{gap:18px!important}
  #tbl tr.mainrow.result-card-v2{
    display:block!important;border-radius:24px!important;overflow:hidden!important;
  }
  #tbl tr.mainrow.result-card-v2 > td.result-card-cell{display:block!important}
  .result-top-v2{
    display:flex!important;flex-direction:column!important;align-items:flex-start!important;
    gap:18px!important;padding:30px 22px 26px!important;
  }
  .result-brand-v2{
    grid-template-columns:42px minmax(0,1fr)!important;gap:16px!important;width:100%;align-items:start!important;
  }
  .result-brand-v2 .rank{font-size:32px!important;margin-top:8px}
  .result-logo-wrap .brand-logo{max-width:230px!important;max-height:48px!important}
  .result-subtitle{font-size:15px}
  .result-price-v2{
    order:2;align-items:flex-start!important;text-align:left!important;width:100%;
  }
  .result-price-v2 .cost-line{justify-content:flex-start!important}
  .result-price-v2 .cost{font-size:34px!important}
  .result-fees-v2{order:3}
  .result-badges-v2{order:4}
  
  .exchange-cta{display:none!important}
}

/* ---------- final QA hardening: clean cards, mobile and dropdowns ---------- */
#tbl,
#tbl tbody,
#tbl tr,
#tbl td{
  border-left:0!important;
  border-right:0!important;
}
#tbl tr.mainrow.result-card-v2 > td,
#tbl tr.mainrow.result-card-v2 .result-top-v2,
#tbl tr.mainrow.result-card-v2 .result-fees-v2,
#tbl tr.mainrow.result-card-v2 .result-price-v2{
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
#tbl tr.mainrow.result-card-v2{
  margin:0!important;
}
.result-price-v2{
  min-width:290px;
}
.result-price-v2 .cost-line{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:10px!important;
  white-space:nowrap!important;
}
.result-price-v2 .cost-info{
  flex:0 0 auto;
}
.result-price-v2 .year-saving{
  white-space:nowrap;
}
.result-detail-link{
  color:#9AA7BA!important;
  font-weight:850!important;
}
.winner-ribbon{
  font-size:12px!important;
  letter-spacing:.14em!important;
  text-transform:uppercase!important;
}
#regionPanel,
#resultMarketPanel{
  top:calc(100% + 8px)!important;
  bottom:auto!important;
  transform:none!important;
}
@media(max-width:760px){
  html,
  body{
    overflow-x:hidden!important;
  }
  .filtercard .sortwrap,
  .filtercard .sortbtn,
  .filtercard .sortpanel,
  .sortwrap,
  .sortbtn,
  .sortpanel{
    display:none!important;
  }
  .results-main,
  .results-col,
  .table-card,
  .table-scroll,
  #tbl,
  #tbl tbody{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:visible!important;
  }
  #tbl tbody{
    display:flex!important;
    flex-direction:column!important;
    gap:18px!important;
  }
  #tbl tr.mainrow.result-card-v2{
    width:100%!important;
    max-width:100%!important;
    border-radius:24px!important;
    overflow:hidden!important;
  }
  #tbl tr.mainrow.result-card-v2 .result-top-v2{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:18px!important;
    padding:28px 22px 26px!important;
  }
  .result-brand-v2{
    display:grid!important;
    grid-template-columns:44px minmax(0,1fr)!important;
    gap:14px!important;
    align-items:start!important;
    width:100%!important;
  }
  .result-logo-wrap .brand-logo{
    max-width:min(245px,100%)!important;
    max-height:54px!important;
  }
  .result-subtitle{
    font-size:15px!important;
  }
  .result-price-v2{
    order:2!important;
    align-items:flex-start!important;
    text-align:left!important;
    width:100%!important;
    min-width:0!important;
  }
  .result-price-v2 .cost-line{
    justify-content:flex-start!important;
    white-space:normal!important;
    flex-wrap:wrap!important;
  }
  .result-price-v2 .cost{
    font-size:clamp(32px,9vw,40px)!important;
  }
  .result-price-v2 .year-saving{
    white-space:normal!important;
  }
  .result-fees-v2{
    order:3!important;
  }
  
}

.updated-stamp{display:block;margin:-8px 0 18px;color:#748199;font-size:14px;font-weight:800;letter-spacing:0}
.hero .updated-stamp{margin-top:-6px;margin-bottom:18px}

/* ---------- final responsive filter/result pass ---------- */
.filtercard .fbar{
  align-items:center!important;
  gap:16px!important;
  flex-wrap:nowrap!important;
}
.filtercard .fbar > .ddwrap{
  width:auto!important;
  flex:0 0 auto!important;
}
.filtercard .filter-ddbtn{
  width:auto!important;
  min-width:0!important;
  height:52px!important;
  padding:0 18px!important;
  border-radius:14px!important;
}
#regionBtn{min-width:220px!important}
#resultMarketBtn{min-width:260px!important}
#regionPanel,
#resultMarketPanel{
  position:absolute!important;
  top:calc(100% + 8px)!important;
  bottom:auto!important;
  left:0!important;
  right:auto!important;
  transform:none!important;
  width:max-content!important;
  min-width:100%!important;
  max-width:min(360px, calc(100vw - 32px))!important;
}
.receipt-share,
.fee-receipt,
.share-receipt,
[data-share-receipt],
#feeReceipt,
#shareReceipt,
.receipt-modal{
  display:none!important;
}
#tbl tr.mainrow.result-card-v2 > td,
#tbl tr.mainrow.result-card-v2 .result-top-v2,
#tbl tr.mainrow.result-card-v2 .result-fees-v2,
#tbl tr.mainrow.result-card-v2 .result-products-v2,
#tbl tr.mainrow.result-card-v2 .result-price-v2{
  outline:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
#tbl tr.mainrow.result-card-v2{
  margin:0 0 14px!important;
}
#tbl tr.mainrow.result-card-v2 .result-top-v2{
  display:grid!important;
  grid-template-columns:minmax(350px,1.3fr) minmax(190px,.65fr) minmax(230px,.85fr) minmax(260px,.9fr)!important;
  align-items:center!important;
  gap:26px!important;
  padding:34px 34px 28px!important;
}
.result-brand-v2{
  min-width:0!important;
}
.result-price-v2{
  justify-self:end!important;
  align-items:flex-end!important;
  text-align:right!important;
  min-width:260px!important;
}
.result-price-v2 .cost-line{
  justify-content:flex-end!important;
  flex-wrap:nowrap!important;
}
.exchange-cta{
  display:inline-flex!important;
  min-height:46px!important;
  padding:0 24px!important;
  border-radius:16px!important;
  align-items:center!important;
  justify-content:center!important;
  background:linear-gradient(180deg,#2F6DFF,#245DE8)!important;
  color:#fff!important;
  font-weight:900!important;
  box-shadow:0 14px 28px -18px rgba(36,93,232,.75)!important;
}

@media(max-width:1180px){
  #tbl tr.mainrow.result-card-v2 .result-top-v2{
    grid-template-columns:minmax(300px,1.2fr) minmax(170px,.6fr) minmax(210px,.8fr) minmax(250px,.9fr)!important;
    gap:18px!important;
    padding-inline:26px!important;
  }
}
@media(max-width:760px){
  html,
  body{
    overflow-x:hidden!important;
  }
  .filtercard{
    padding:0!important;
    margin:18px 0 14px!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
  }
  .mobile-filter-strip{
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    overflow-x:auto!important;
    padding:0 2px 4px!important;
    scrollbar-width:none;
  }
  .mobile-filter-strip::-webkit-scrollbar{display:none}
  .mobile-filter-toggle{
    display:inline-flex!important;
    height:44px!important;
    min-width:max-content!important;
    border-radius:10px!important;
    background:#242424!important;
    color:#fff!important;
    border:0!important;
  }
  .mobile-filter-chip{
    display:inline-flex!important;
    height:44px!important;
    min-width:max-content!important;
    border-radius:999px!important;
    background:#F1F3F5!important;
    border:1px solid #E2E6EC!important;
    color:#5D687A!important;
  }
  .filtercard:not(.filters-open) .fbar{
    display:none!important;
  }
  .filtercard.filters-open .fbar{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    margin-top:10px!important;
    padding:12px!important;
    background:#fff!important;
    border:1px solid #DDE5F0!important;
    border-radius:16px!important;
  }
  .filtercard .sortwrap,
  .filtercard .sortbtn,
  .filtercard .sortpanel,
  .sortwrap,
  .sortbtn,
  .sortpanel{
    display:none!important;
  }
  .filtercard .ddwrap,
  .filtercard .filter-ddbtn{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
  }
  #regionPanel,
  #resultMarketPanel{
    position:absolute!important;
    top:calc(100% + 8px)!important;
    bottom:auto!important;
    left:0!important;
    right:auto!important;
    width:100%!important;
    min-width:100%!important;
    max-width:100%!important;
    z-index:90!important;
  }
  #tbl tr.mainrow.result-card-v2{
    border-radius:24px!important;
    overflow:hidden!important;
    margin-bottom:18px!important;
  }
  #tbl tr.mainrow.result-card-v2 .result-top-v2{
    display:grid!important;
    grid-template-columns:54px minmax(0,1fr)!important;
    gap:16px 14px!important;
    align-items:start!important;
    padding:26px 18px!important;
  }
  .result-brand-v2{
    grid-column:1 / -1!important;
    display:grid!important;
    grid-template-columns:54px minmax(0,1fr)!important;
    gap:14px!important;
    align-items:start!important;
    width:100%!important;
  }
  .result-brand-v2 .rank{
    grid-column:1!important;
    grid-row:1 / span 2!important;
    font-size:33px!important;
    margin:8px 0 0!important;
  }
  .result-logo-wrap{
    grid-column:2!important;
    min-width:0!important;
  }
  .result-logo-wrap .brand-logo{
    max-width:min(230px,68vw)!important;
    max-height:48px!important;
  }
  .result-detail-link{
    grid-column:2!important;
  }
  .result-price-v2{
    grid-column:1 / -1!important;
    justify-self:start!important;
    align-items:flex-start!important;
    text-align:left!important;
    width:100%!important;
    min-width:0!important;
  }
  .result-price-v2 .cost-line{
    justify-content:flex-start!important;
    white-space:normal!important;
    flex-wrap:wrap!important;
    gap:8px!important;
  }
  .result-price-v2 .cost{
    font-size:clamp(32px,9vw,40px)!important;
    line-height:1.05!important;
  }
  .result-price-v2 .year-saving{
    white-space:normal!important;
  }
  .result-fees-v2,
  .result-products-v2,
  .result-badges-v2{
    grid-column:1 / -1!important;
    align-items:flex-start!important;
  }
  
  .exchange-cta{
    display:none!important;
  }
}

/* ---------- definitive results/filter polish ---------- */
.receipt-share,
.fee-receipt,
.share-receipt,
[data-share-receipt],
#feeReceipt,
#shareReceipt,
.receipt-modal,
.exchange-cta.receipt-share{
  display:none!important;
}

.results-wrap,
.results-shell,
.table-card{
  max-width:100%!important;
  overflow:visible!important;
}

#tbl,
#tbl tbody{
  display:block!important;
  width:100%!important;
}

#tbl thead{
  display:none!important;
}

#tbl tbody{
  display:flex!important;
  flex-direction:column!important;
  gap:14px!important;
}

#tbl tr.mainrow.result-card-v2{
  display:block!important;
  width:100%!important;
  margin:0!important;
  border:0!important;
  border-radius:18px!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
}

#tbl tr.mainrow.result-card-v2 > .result-card-cell{
  display:block!important;
  width:100%!important;
  padding:0!important;
  border:1px solid #DCE6F3!important;
  border-radius:18px!important;
  background:#fff!important;
  box-shadow:0 18px 40px -34px rgba(15,23,42,.48)!important;
  overflow:hidden!important;
}

#tbl tr.mainrow.result-card-v2.winner > .result-card-cell{
  border-color:#31C477!important;
  background:linear-gradient(90deg,#F2FFF8 0%,#FFFFFF 48%,#FFFFFF 100%)!important;
}

#tbl tr.mainrow.result-card-v2.no-price > .result-card-cell{
  background:#F8FAFD!important;
  opacity:.76!important;
}

#tbl tr.mainrow.result-card-v2 .result-top-v2{
  display:grid!important;
  grid-template-columns:minmax(420px,1.28fr) minmax(190px,.58fr) minmax(290px,.88fr)!important;
  gap:34px!important;
  align-items:center!important;
  width:100%!important;
  min-height:154px!important;
  padding:30px 34px 24px!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  box-shadow:none!important;
}

#tbl tr.mainrow.result-card-v2 .result-brand-v2{
  display:grid!important;
  grid-template-columns:56px minmax(0,1fr)!important;
  gap:22px!important;
  align-items:center!important;
  min-width:0!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  box-shadow:none!important;
}

#tbl tr.mainrow.result-card-v2 .rank{
  margin:0!important;
  color:#101B33!important;
  font-size:34px!important;
  font-weight:950!important;
  line-height:1!important;
}

#tbl tr.mainrow.result-card-v2.winner .rank{
  color:#159A5D!important;
}

#tbl tr.mainrow.result-card-v2 .exchange-main{
  display:block!important;
  min-width:0!important;
}

#tbl tr.mainrow.result-card-v2 .result-logo-wrap{
  display:block!important;
  min-width:0!important;
}

#tbl tr.mainrow.result-card-v2 .result-logo-wrap .brand-logo{
  display:block!important;
  width:auto!important;
  max-width:270px!important;
  max-height:58px!important;
  object-fit:contain!important;
  object-position:left center!important;
}

#tbl tr.mainrow.result-card-v2 .result-logo-wrap .logo-lockup{
  display:inline-flex!important;
  align-items:center!important;
  gap:8px!important;
  max-width:100%!important;
}

#tbl tr.mainrow.result-card-v2 .result-subtitle{
  display:block!important;
  margin-top:8px!important;
  color:#5E6B84!important;
  font-size:16px!important;
  font-weight:850!important;
  line-height:1.35!important;
}

#tbl tr.mainrow.result-card-v2 .result-detail-link{
  display:inline-block!important;
  margin-top:8px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#A0AABC!important;
  box-shadow:none!important;
  font-size:15px!important;
  font-weight:850!important;
  line-height:1.3!important;
  text-align:left!important;
}

#tbl tr.mainrow.result-card-v2 .result-fees-v2,
#tbl tr.mainrow.result-card-v2 .result-products-v2,
#tbl tr.mainrow.result-card-v2 .result-price-v2,
#tbl tr.mainrow.result-card-v2 .result-badges-v2{
  border:0!important;
  outline:0!important;
  background:transparent!important;
  box-shadow:none!important;
}

#tbl tr.mainrow.result-card-v2 .result-fees-v2{
  min-width:0!important;
}

#tbl tr.mainrow.result-card-v2 .fee-label-v2{
  display:block!important;
  margin-bottom:7px!important;
  color:#63708A!important;
  font-size:13px!important;
  font-weight:850!important;
}

#tbl tr.mainrow.result-card-v2 .result-fees-v2 .mono{
  color:#101B33!important;
  font-size:18px!important;
  font-weight:950!important;
  white-space:nowrap!important;
}

#tbl tr.mainrow.result-card-v2 .result-badges-v2{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:8px!important;
  margin-top:10px!important;
}

#tbl tr.mainrow.result-card-v2 .result-price-v2{
  justify-self:end!important;
  align-items:flex-end!important;
  min-width:280px!important;
  text-align:right!important;
}

#tbl tr.mainrow.result-card-v2 .result-price-v2 .cost-line{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:8px!important;
  white-space:nowrap!important;
}

#tbl tr.mainrow.result-card-v2 .result-price-v2 .cost{
  font-size:32px!important;
  font-weight:950!important;
  line-height:1!important;
}

#tbl tr.mainrow.result-card-v2 .result-price-v2 .per-month{
  color:#5E6B84!important;
  font-size:18px!important;
  font-weight:900!important;
  white-space:nowrap!important;
}

#tbl tr.mainrow.result-card-v2 .result-price-v2 .avgdiff{
  display:block!important;
  margin-top:10px!important;
  font-size:16px!important;
  font-weight:950!important;
}

#tbl tr.mainrow.result-card-v2 .result-price-v2 .year-saving{
  display:block!important;
  margin-top:8px!important;
  color:#159A5D!important;
  font-size:15px!important;
  font-weight:900!important;
  white-space:nowrap!important;
}

#tbl tr.mainrow.result-card-v2 .result-price-v2 .year-saving.bad{
  color:#D94135!important;
}

#tbl tr.mainrow.result-card-v2 .exchange-cta{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:46px!important;
  margin-top:16px!important;
  padding:0 28px!important;
  border:0!important;
  border-radius:15px!important;
  background:linear-gradient(180deg,#2F6DFF,#245DE8)!important;
  color:#fff!important;
  font-size:16px!important;
  font-weight:950!important;
  box-shadow:0 14px 28px -18px rgba(36,93,232,.78)!important;
}

#tbl tr.mainrow.result-card-v2 .winner-ribbon,
.winner-ribbon{
  top:-13px!important;
  left:22px!important;
  padding:7px 14px!important;
  border-radius:999px!important;
  color:#159A5D!important;
  background:#EAFBF1!important;
  border:1px solid #B8EACD!important;
  font-size:12px!important;
  font-weight:950!important;
  letter-spacing:.16em!important;
  text-transform:uppercase!important;
  z-index:4!important;
}

#tbl tr.mainrow.result-card-v2 > .result-card-cell,
#tbl tr.mainrow.result-card-v2 .result-top-v2,
#tbl tr.mainrow.result-card-v2 .result-fees-v2,
#tbl tr.mainrow.result-card-v2 .result-products-v2,
#tbl tr.mainrow.result-card-v2 .result-price-v2{
  outline:0!important;
}

@media (min-width:761px) and (max-width:1240px){
  #tbl tr.mainrow.result-card-v2 .result-top-v2{
    grid-template-columns:minmax(320px,1.15fr) minmax(170px,.55fr) minmax(260px,.85fr)!important;
    gap:22px!important;
    padding-inline:26px!important;
  }
  #tbl tr.mainrow.result-card-v2 .result-logo-wrap .brand-logo{
    max-width:235px!important;
  }
}

/* ---------- final result-card cleanup ---------- */
#tbl{
  border-collapse:separate!important;
  border-spacing:0 16px!important;
}

#tbl tr.mainrow.result-card-v2{
  display:table-row!important;
  position:relative!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}

#tbl tr.mainrow.result-card-v2 > td.result-card-cell{
  padding:0!important;
  border:0!important;
  background:transparent!important;
  border-radius:0!important;
  box-shadow:none!important;
}

#tbl tr.mainrow.result-card-v2 .result-top-v2{
  display:grid!important;
  grid-template-columns:minmax(360px,1.2fr) minmax(230px,.72fr) minmax(330px,.85fr)!important;
  align-items:center!important;
  gap:28px!important;
  min-height:178px!important;
  padding:30px 34px!important;
  border:1px solid #DDE6F2!important;
  border-radius:22px!important;
  background:#fff!important;
  box-shadow:0 10px 28px rgba(15,31,64,.055)!important;
}

#tbl tr.mainrow.result-card-v2.winner .result-top-v2{
  border-color:#28C76F!important;
  background:linear-gradient(90deg,#F1FFF8 0%,#fff 48%)!important;
}

#tbl tr.mainrow.result-card-v2 .result-fees-v2,
#tbl tr.mainrow.result-card-v2 .result-products-v2,
#tbl tr.mainrow.result-card-v2 .result-price-v2,
#tbl tr.mainrow.result-card-v2 .result-badges-v2{
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  background:transparent!important;
  padding:0!important;
  min-height:0!important;
}

#tbl tr.mainrow.result-card-v2 .result-brand-v2{
  min-width:0!important;
}

#tbl tr.mainrow.result-card-v2 .exchange-main{
  min-width:0!important;
}

#tbl tr.mainrow.result-card-v2 .result-logo-wrap .brand-logo{
  max-width:270px!important;
  max-height:62px!important;
  object-fit:contain!important;
}

#tbl tr.mainrow.result-card-v2 .result-price-v2{
  justify-self:end!important;
  align-items:flex-end!important;
  text-align:right!important;
}

#tbl tr.mainrow.result-card-v2 .result-price-v2 .cost-line{
  justify-content:flex-end!important;
}

#tbl tr.mainrow.result-card-v2 .exchange-cta{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:50px!important;
  padding:0 26px!important;
  border:0!important;
  border-radius:16px!important;
  color:#fff!important;
  background:#2563EB!important;
  font-weight:950!important;
  box-shadow:0 12px 24px rgba(37,99,235,.22)!important;
}

#tbl tr.mainrow.result-card-v2.no-price .result-top-v2{
  opacity:.58!important;
}

#tbl tr.mainrow.result-card-v2.no-price .exchange-cta{display:none!important}

@media (min-width:761px) and (max-width:1240px){
  #tbl tr.mainrow.result-card-v2 .result-top-v2{
    grid-template-columns:minmax(300px,1.08fr) minmax(190px,.62fr) minmax(285px,.86fr)!important;
    gap:20px!important;
    padding-inline:26px!important;
  }
  #tbl tr.mainrow.result-card-v2 .result-logo-wrap .brand-logo{
    max-width:235px!important;
  }
}

@media (max-width:760px){
  html,
  body{
    max-width:100%!important;
    overflow-x:hidden!important;
  }

  .filtercard .sortwrap,
  .filtercard .sortbtn,
  .filtercard .sortpanel,
  .sortwrap,
  .sortbtn,
  .sortpanel,
  #sortBtn,
  #sortPanel{
    display:none!important;
  }

  .filtercard{
    padding:0!important;
    margin:18px 0 14px!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
  }

  .mobile-filter-strip{
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    max-width:100%!important;
    overflow-x:auto!important;
    padding:0 2px 4px!important;
    scrollbar-width:none!important;
  }

  .mobile-filter-strip::-webkit-scrollbar{
    display:none!important;
  }

  .mobile-filter-toggle{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-width:max-content!important;
    min-height:44px!important;
    padding:0 14px!important;
    border:0!important;
    border-radius:10px!important;
    background:#242424!important;
    color:#fff!important;
    font-weight:950!important;
  }

  .mobile-filter-chip{
    display:inline-flex!important;
    align-items:center!important;
    min-width:max-content!important;
    min-height:44px!important;
    padding:0 14px!important;
    border:1px solid #E2E6EC!important;
    border-radius:999px!important;
    background:#F1F3F5!important;
    color:#5D687A!important;
    font-weight:850!important;
  }

  .filtercard:not(.filters-open) .fbar{
    display:none!important;
  }

  .filtercard.filters-open .fbar{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    margin-top:10px!important;
    padding:12px!important;
    background:#fff!important;
    border:1px solid #DDE5F0!important;
    border-radius:16px!important;
  }

  .filtercard .fbar > .ddwrap,
  .filtercard .filter-ddbtn{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }

  #regionPanel,
  #resultMarketPanel{
    top:calc(100% + 8px)!important;
    bottom:auto!important;
    left:0!important;
    right:auto!important;
    width:100%!important;
    min-width:100%!important;
    max-width:100%!important;
  }

  #tbl tbody{
    gap:14px!important;
  }

  #tbl tr.mainrow.result-card-v2{
    border-radius:22px!important;
  }

  #tbl tr.mainrow.result-card-v2 > .result-card-cell{
    border-radius:22px!important;
  }

  #tbl tr.mainrow.result-card-v2 .result-top-v2{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:18px!important;
    min-height:0!important;
    padding:28px 22px 24px!important;
  }

  #tbl tr.mainrow.result-card-v2 .result-brand-v2{
    display:grid!important;
    grid-template-columns:46px minmax(0,1fr)!important;
    gap:14px!important;
    align-items:start!important;
    width:100%!important;
  }

  #tbl tr.mainrow.result-card-v2 .rank{
    font-size:34px!important;
    margin-top:8px!important;
  }

  #tbl tr.mainrow.result-card-v2 .result-logo-wrap .brand-logo{
    max-width:min(245px,68vw)!important;
    max-height:58px!important;
  }

  #tbl tr.mainrow.result-card-v2 .result-subtitle{
    font-size:16px!important;
  }

  #tbl tr.mainrow.result-card-v2 .result-fees-v2,
  #tbl tr.mainrow.result-card-v2 .result-price-v2{
    justify-self:start!important;
    align-items:flex-start!important;
    min-width:0!important;
    width:100%!important;
    text-align:left!important;
  }

  #tbl tr.mainrow.result-card-v2 .result-price-v2 .cost-line{
    justify-content:flex-start!important;
    flex-wrap:wrap!important;
    white-space:normal!important;
  }

  #tbl tr.mainrow.result-card-v2 .result-price-v2 .cost{
    font-size:clamp(34px,10vw,42px)!important;
  }

  #tbl tr.mainrow.result-card-v2 .result-price-v2 .year-saving{
    white-space:normal!important;
  }

  #tbl tr.mainrow.result-card-v2 .exchange-cta,
  #tbl tr.mainrow.result-card-v2 

  #tbl tr.mainrow.result-card-v2 .winner-ribbon,
  .winner-ribbon{
    left:20px!important;
  }
}


/* filterbar v3 — pill-layout ALLEEN mobiel; desktop = oude versie */
.fgroup{display:contents}
@media(max-width:760px){
  .results-count{font-size:17px;font-weight:850;color:var(--ink);margin:26px 0 14px;display:block}
  .fgroup{display:flex;align-items:center;gap:4px;border:1.5px solid #E3E9F4;border-radius:16px;background:#fff;padding:0 6px 0 18px;height:58px;width:100%}
  .fgroup .f-label{color:#64708B;font-weight:750;font-size:15px;display:inline-flex;align-items:center}
  .fgroup .f-label::after{content:'';width:1px;height:22px;background:#E9EEF6;margin:0 10px 0 14px}
  .fgroup .selbox{border:0!important;background:transparent!important;height:54px;padding:0 10px 0 2px!important;font-weight:850;box-shadow:none!important;flex:1}
  .fbar .sortbtn{background:transparent;border:0;color:var(--ink);font-weight:850;font-size:15px;gap:10px;padding:10px 12px}
  .fbar .sortbtn > span:first-of-type{color:#64708B;font-weight:750}
  .fbar .sortbtn #sortValue{color:var(--ink);font-weight:900}
  .fbar .sortbtn::after{content:'';width:8px;height:8px;border-right:2.2px solid #64708B;border-bottom:2.2px solid #64708B;transform:rotate(45deg) translateY(-2px);flex:0 0 auto}
}
/* score v1.3 */
a.score-item{text-decoration:none;cursor:help}
a.score-item:hover{text-decoration:none}
.score-info{color:#9AA7BC;font-size:12px;margin-left:2px}

/* result-card v4 — pixel-perfect uitlijning */
#tbl tr.mainrow.result-card-v2 > td.result-card-cell{position:relative!important}
.winner-ribbon{top:0!important;left:28px!important;z-index:3}
.result-top-v2{
  grid-template-columns:56px minmax(0,1.1fr) minmax(190px,.55fr) minmax(300px,.78fr)!important;
  gap:0 32px!important;align-items:center!important;padding:30px 34px 26px!important;
}
.result-brand-v2{display:contents!important}
.result-brand-v2 .rank{
  font-size:30px!important;font-weight:950;line-height:1;align-self:center;justify-self:center;
}
.exchange-main{display:block;min-width:0}
.result-logo-wrap .brand-logo{max-height:44px!important;max-width:240px!important}
.result-subtitle{margin-top:10px!important;font-size:15px!important;line-height:1.45!important;font-weight:750!important}
.result-badges-v2{margin-top:12px!important;gap:8px!important}
.result-detail-link{margin-top:9px!important}
.result-fees-v2{align-self:center!important;gap:9px!important}
.fee-label-v2{font-size:13.5px!important;font-weight:750!important;color:#64708B!important;letter-spacing:.01em}
.result-fees-v2 .mono{font-size:18px!important;font-weight:850!important;letter-spacing:.02em}
.result-price-v2{align-self:center!important;gap:12px!important}
.result-price-v2 .cost{font-size:31px!important;letter-spacing:-.01em}
.avgdiff{margin-top:2px!important}
.year-saving{margin-top:2px!important;font-size:14px!important;font-weight:750!important}
.exchange-cta{height:48px!important;min-width:210px!important;border-radius:14px!important;margin-top:4px}



#tbl tr.mainrow.result-card-v2.winner{
  background:linear-gradient(180deg,#F2FCF7 0%,#FDFFFE 55%,#fff 100%)!important;
}
@media(max-width:900px){
  .result-top-v2{grid-template-columns:40px minmax(0,1fr)!important;gap:18px 18px!important;padding:22px 20px 18px!important}
  .result-fees-v2{grid-column:2;flex-direction:row!important;align-items:baseline!important;gap:10px!important;margin-top:14px}
  .result-price-v2{grid-column:1 / -1;align-items:flex-start!important;text-align:left!important;margin-top:16px}
  .result-price-v2 .cost-line{justify-content:flex-start!important}
  .exchange-cta{width:100%}
  
}

/* result-card v5 — compacte hoogte (gaslicht-dichtheid) */
.result-top-v2{padding:18px 28px 14px!important;gap:0 28px!important;
  grid-template-columns:44px minmax(0,1.1fr) minmax(180px,.55fr) minmax(280px,.78fr)!important}
.result-brand-v2 .rank{font-size:26px!important}
.result-logo-wrap .brand-logo{max-height:32px!important;max-width:190px!important}
.result-subtitle{margin-top:6px!important;font-size:14px!important;line-height:1.35!important}
.result-badges-v2{margin-top:8px!important;gap:6px!important}
.result-detail-link{margin-top:6px!important;font-size:13px!important}
.fee-label-v2{font-size:12.5px!important}
.result-fees-v2{gap:6px!important}
.result-fees-v2 .mono{font-size:16px!important}
.result-price-v2{gap:8px!important}
.result-price-v2 .cost{font-size:26px!important}
.year-saving{font-size:13.5px!important}
.exchange-cta{height:42px!important;min-width:190px!important;font-size:14.5px!important}


#tbl{border-spacing:0 12px!important}
#tbl tbody{gap:12px!important}
.winner-ribbon{padding:4px 11px!important;font-size:10.5px!important}
@media(max-width:900px){
  .result-top-v2{grid-template-columns:34px minmax(0,1fr)!important;padding:16px 18px 12px!important}
  .result-price-v2{margin-top:12px!important}
  
}

/* spec-indent v2 */
.spec-indent{margin-left:28px}

/* perm-topbar-hide: vergunningen-filter alleen in sidebar (badges op kaarten tonen licenties al) */
.fbar .perm-topbar{display:none!important}

/* reg-filter-hide: vergunningenfilter verwijderd; pMicar staat vast aan, pMifid volgt de markt-switch automatisch */
.spec-card--reg{display:none!important}

/* topbar-filters-hide: Vergunningen + Producten uit de sticky balk; filteren via sidebar */
.ddwrap.saved-filter{display:none!important}



/* ===== result-bottom-v2 — ENIGE bron van waarheid (opgeschoond, alle oude stacking verwijderd) ===== */
.result-bottom-v2{
  display:flex;align-items:center;flex-wrap:wrap;gap:20px;
  margin:0;padding:11px 28px 13px;border-top:1px solid #ECF1F8;
  color:#159A5D;font-size:13.5px;font-weight:850;position:static;transform:none;
}
.result-bottom-v2 .score-item{display:inline-flex;gap:8px;align-items:center;color:#647088;font-size:13.5px}
.result-bottom-v2 .score-item strong{color:var(--ink);font-size:15px}
.result-bottom-v2 .score-shield,.result-bottom-v2 .trust-item{color:#159A5D}
@media(max-width:760px){
  /* compacte scoreregel op mobiel: score + 1 trust-item i.p.v. verbergen */
  .result-bottom-v2{
    display:flex;flex-wrap:nowrap;align-items:center;gap:12px;
    padding:9px 18px 10px;overflow:hidden;
  }
  .result-bottom-v2 .score-item{font-size:12.5px;flex:0 0 auto}
  .result-bottom-v2 .score-item strong{font-size:14px}
  .result-bottom-v2 .trust-item{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
  .result-bottom-v2 .trust-item ~ .trust-item{display:none}
  .score-pop{left:0;max-width:calc(100vw - 70px)}
}

/* ===== card-shell v6: wit kader om de HELE kaart (top + scoreregel), lint niet meer afgeknipt ===== */
#tbl tr.mainrow.result-card-v2{background:transparent!important}
#tbl tr.mainrow.result-card-v2.winner{background:transparent!important}

#tbl tr.mainrow.result-card-v2 > td.result-card-cell{
  display:block!important;width:100%!important;padding:0!important;
  border:1px solid #DDE6F2!important;border-radius:18px!important;
  background:#fff!important;box-shadow:0 10px 28px rgba(15,31,64,.055)!important;
  overflow:visible!important;position:relative!important;
}
#tbl tr.mainrow.result-card-v2.winner > td.result-card-cell{
  border-color:#28C76F!important;
  background:linear-gradient(90deg,#F1FFF8 0%,#fff 48%)!important;
}
#tbl tr.mainrow.result-card-v2.no-price > td.result-card-cell{background:#F8FAFD!important;opacity:1!important}

#tbl tr.mainrow.result-card-v2 .result-top-v2,
#tbl tr.mainrow.result-card-v2.winner .result-top-v2{
  border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;
}
#tbl tr.mainrow.result-card-v2.no-price .result-top-v2{opacity:.58!important}


/* ===== card v7: gaslicht-hoogte — compacte desktopkaart ===== */
@media(min-width:901px){
#tbl tr.mainrow.result-card-v2 .result-top-v2{
  min-height:0!important;
  padding:14px 24px 11px!important;
  gap:0 24px!important;
}
#tbl tr.mainrow.result-card-v2 .result-brand-v2 .rank{font-size:21px!important}
#tbl tr.mainrow.result-card-v2 .result-logo-wrap .brand-logo{max-height:28px!important;max-width:160px!important}
#tbl tr.mainrow.result-card-v2 .result-subtitle{margin-top:4px!important;font-size:13px!important;line-height:1.3!important}
#tbl tr.mainrow.result-card-v2 .result-badges-v2{margin-top:6px!important;gap:5px!important}
#tbl tr.mainrow.result-card-v2 .result-badges-v2 .badge{font-size:11px!important;padding:2px 8px!important}
#tbl tr.mainrow.result-card-v2 .result-detail-link{margin-top:4px!important;font-size:12.5px!important}
#tbl tr.mainrow.result-card-v2 .fee-label-v2{font-size:12px!important}
#tbl tr.mainrow.result-card-v2 .result-fees-v2{gap:4px!important}
#tbl tr.mainrow.result-card-v2 .result-fees-v2 .mono{font-size:15px!important}
#tbl tr.mainrow.result-card-v2 .result-price-v2{gap:5px!important}
#tbl tr.mainrow.result-card-v2 .result-price-v2 .cost{font-size:23px!important}
#tbl tr.mainrow.result-card-v2 .per-month{font-size:13px!important}
#tbl tr.mainrow.result-card-v2 .avgdiff{margin-top:0!important;font-size:12.5px!important}
#tbl tr.mainrow.result-card-v2 .year-saving{margin-top:0!important;font-size:13px!important}
#tbl tr.mainrow.result-card-v2 .exchange-cta{
  height:38px!important;min-height:38px!important;min-width:170px!important;
  font-size:14px!important;border-radius:11px!important;margin-top:2px!important;padding:0 20px!important;
}
#tbl tr.mainrow.result-card-v2 .result-bottom-v2{padding:8px 24px 9px!important;gap:14px!important}
#tbl tr.mainrow.result-card-v2 .result-bottom-v2 .score-item{font-size:12.5px!important}
#tbl tr.mainrow.result-card-v2 .result-bottom-v2 .score-item strong{font-size:14px!important}
#tbl tr.mainrow.result-card-v2 .result-bottom-v2 .trust-item{font-size:12.5px!important}
#tbl{border-spacing:0 10px!important}
.winner-ribbon{padding:3px 10px!important;font-size:10px!important}
}


/* ===== score-popup (i-knopje op de scoreregel) ===== */
.score-item{position:relative}
.score-link{color:inherit;text-decoration:none;display:inline-flex;gap:8px;align-items:center}
.score-link:hover strong{text-decoration:underline}
button.score-info{
  width:15px;height:15px;border-radius:999px;border:1px solid #C4D2E4;background:#fff;color:#64708B;
  font-size:10px;font-weight:800;line-height:1;display:inline-flex;align-items:center;justify-content:center;
  cursor:pointer;padding:0;margin-left:3px;font-family:Georgia,'Times New Roman',serif;font-style:italic;
}
button.score-info:hover,button.score-info[aria-expanded="true"]{background:#EEF4FB;color:#2563EB;border-color:#9DB6D8}
.score-pop{
  position:absolute;bottom:calc(100% + 10px);left:-8px;z-index:60;width:252px;
  background:#fff;border:1px solid #D7E2F0;border-radius:14px;
  box-shadow:0 16px 38px -12px rgba(15,23,42,.28);padding:13px 15px;display:block;text-align:left;
}
.score-pop[hidden]{display:none}
.score-pop::after{content:'';position:absolute;top:100%;left:22px;border:7px solid transparent;border-top-color:#fff}
.sp-title{display:block;font-size:13px;color:var(--ink);margin-bottom:8px}
.sp-row{display:flex;justify-content:space-between;gap:12px;font-size:12.5px;color:#4A576D;font-weight:650;padding:2.5px 0}
.sp-row em{font-style:normal;color:#93A1B8;font-weight:600}
.sp-link{display:inline-block;margin-top:9px;font-size:12.5px;font-weight:800;color:#2563EB;text-decoration:none}
.sp-link:hover{text-decoration:underline}

/* regio verplaatst naar calculator; sticky-bar versie verborgen */
.fbar .fgroup:has(#regionBtn){display:none!important}

/* card-grid-fix (geverifieerd in browser 901-1440px):
   .result-brand-v2 rendert als display:grid, niet als display:contents. De kaart heeft dus
   3 grid-items (brand | fees | prijs), niet 4. Oudere regels gaven kolom 1 een breedte van
   40px (bedoeld als rangkolom), waardoor naam+logo tot 0px werden geperst en de fees
   eroverheen vielen. Hier: 3 kolommen, met rang + naam als eigen grid binnen de brandkolom. */
@media(min-width:901px){
#tbl tr.mainrow.result-card-v2 .result-top-v2{
  grid-template-columns:minmax(0,1.25fr) minmax(150px,.55fr) minmax(280px,.8fr)!important;
  gap:0 24px!important;align-items:center!important;
}
#tbl tr.mainrow.result-card-v2 .result-brand-v2{
  display:grid!important;grid-template-columns:34px minmax(0,1fr)!important;
  gap:0 14px!important;align-items:center!important;min-width:0!important;
}
#tbl tr.mainrow.result-card-v2 .exchange-main{display:block!important;min-width:0!important}
#tbl tr.mainrow.result-card-v2 .result-fees-v2{min-width:0!important}
#tbl tr.mainrow.result-card-v2 .result-price-v2{min-width:0!important}
}
@media(min-width:901px) and (max-width:1240px){
#tbl tr.mainrow.result-card-v2 .result-top-v2{
  grid-template-columns:minmax(0,1.1fr) minmax(115px,.45fr) minmax(285px,.75fr)!important;
  gap:0 16px!important;padding-inline:20px!important;
}
#tbl tr.mainrow.result-card-v2 .exchange-cta{min-width:0!important;width:100%!important;padding:0 14px!important}
}
/* tablet 761-900px: oude 3-koloms regels lieten de inhoud 28-107px buiten de kaart
   lopen. Hier gestapeld, net als op telefoon. */
@media(min-width:761px) and (max-width:900px){
#tbl tr.mainrow.result-card-v2 .result-top-v2{
  display:grid!important;grid-template-columns:minmax(0,1fr)!important;
  gap:16px!important;padding:22px 22px 20px!important;align-items:start!important;
}
#tbl tr.mainrow.result-card-v2 .result-brand-v2{
  display:grid!important;grid-template-columns:34px minmax(0,1fr)!important;gap:0 14px!important;
  align-items:center!important;min-width:0!important;grid-column:1!important;
}
#tbl tr.mainrow.result-card-v2 .exchange-main{display:block!important;min-width:0!important}
#tbl tr.mainrow.result-card-v2 .result-fees-v2{
  grid-column:1!important;flex-direction:row!important;align-items:baseline!important;
  gap:10px!important;min-width:0!important;
}
#tbl tr.mainrow.result-card-v2 .result-price-v2{
  grid-column:1!important;align-items:flex-start!important;text-align:left!important;min-width:0!important;
}
#tbl tr.mainrow.result-card-v2 .exchange-cta{min-width:0!important;width:100%!important}
}
/* het exchange-logo (tot 245px) was breder dan de kaart op telefoons en werd afgeknipt */
@media(max-width:900px){
#tbl tr.mainrow.result-card-v2 .result-logo-wrap{min-width:0!important;max-width:100%!important;display:block!important}
#tbl tr.mainrow.result-card-v2 .result-logo-wrap .brand-logo{max-width:100%!important;height:auto!important}
}

/* score-schaal: "9,0" alleen zegt niets — toon de noemer */
.result-bottom-v2 .score-max{color:#8A97AC;font-weight:750;margin-left:-3px}
#tbl tr.mainrow.result-card-v2 .result-bottom-v2 .score-max{font-size:12.5px!important}

/* "Exchange details" was lichtgrijs en zonder onderstreping: zag eruit als uitgeschakelde
   tekst, terwijl het de belangrijkste secundaire actie op de kaart is. */
#tbl tr.mainrow.result-card-v2 .result-detail-link,
.result-detail-link{
  color:#2563EB!important;
  font-weight:800!important;
  text-decoration:underline!important;
  text-decoration-thickness:1px!important;
  text-underline-offset:2px!important;
  text-decoration-color:rgba(37,99,235,.35)!important;
  cursor:pointer!important;
}
#tbl tr.mainrow.result-card-v2 .result-detail-link:hover,
.result-detail-link:hover{
  color:#1D4ED8!important;
  text-decoration-color:currentColor!important;
}
#tbl tr.mainrow.result-card-v2 .result-detail-link:focus-visible,
.result-detail-link:focus-visible{
  outline:2px solid #2563EB!important;outline-offset:2px!important;border-radius:4px!important;
}

/* CTA is nu een uitgaande link naar de exchange (was een knop die alleen de detailrij opende) */
a.exchange-cta{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  gap:8px!important;text-decoration:none!important;
}
a.exchange-cta:hover{text-decoration:none!important}
a.exchange-cta:focus-visible{outline:2px solid #1D4ED8!important;outline-offset:2px!important}

/* detailrij: doorklik naar de review en naar de officiele bron */
.dlinks{
  display:flex;flex-wrap:wrap;gap:10px 22px;align-items:center;
  margin-top:16px;padding-top:14px;border-top:1px solid #ECF1F8;
}
.dlink{
  display:inline-flex;align-items:center;gap:6px;
  font-size:13.5px;font-weight:800;color:#2563EB;text-decoration:none;
}
.dlink:hover{text-decoration:underline;text-underline-offset:2px}
.dlink:focus-visible{outline:2px solid #2563EB;outline-offset:2px;border-radius:4px}
.dlink:not(.dlink-primary){color:#5B6880;font-weight:750}
.dlink:not(.dlink-primary):hover{color:var(--ink)}
@media(max-width:600px){ .dlinks{gap:8px 14px} .dlink{font-size:13px} }

/* ===== dropdown-panels (Markt/Regio/Sorteren): definitieve opgeruimde stijl ===== */
#resultMarketPanel,#regionPanel,#sortPanel{
  padding:6px!important;border:1px solid #DCE6F3!important;border-radius:14px!important;
  background:#fff!important;box-shadow:0 18px 44px -18px rgba(15,23,42,.25)!important;
  width:max-content!important;min-width:100%!important;max-width:min(340px,calc(100vw - 32px))!important;
  top:calc(100% + 8px)!important;bottom:auto!important;left:0!important;right:auto!important;transform:none!important;
}
#resultMarketPanel .sortopt,#regionPanel .sortopt,#sortPanel .sortopt{
  display:block!important;width:100%!important;min-width:0!important;
  padding:9px 16px 9px 38px!important;border-radius:9px!important;margin:0!important;
  font-size:14.5px!important;font-weight:650!important;line-height:1.35!important;color:var(--ink)!important;
  position:relative!important;white-space:nowrap!important;text-align:left!important;
}
#resultMarketPanel .sortopt::before,#regionPanel .sortopt::before,#sortPanel .sortopt::before{
  content:'\2713'!important;position:absolute!important;left:13px!important;top:50%!important;
  transform:translateY(-50%)!important;display:block!important;width:auto!important;margin:0!important;
  font-weight:900!important;font-size:13px!important;color:transparent!important;
}
#resultMarketPanel .sortopt[aria-selected="true"],#regionPanel .sortopt[aria-selected="true"],
#resultMarketPanel .sortopt.actief,#regionPanel .sortopt.actief,#sortPanel .sortopt.actief{
  color:var(--accent)!important;font-weight:800!important;
}
#resultMarketPanel .sortopt[aria-selected="true"]::before,#regionPanel .sortopt[aria-selected="true"]::before,
#resultMarketPanel .sortopt.actief::before,#regionPanel .sortopt.actief::before,#sortPanel .sortopt.actief::before{
  color:var(--accent)!important;
}
#resultMarketPanel .sortopt:hover,#regionPanel .sortopt:hover,#sortPanel .sortopt:hover{
  background:#EEF4FB!important;
}

.page-home main.wrap{display:none!important}
.page-home header.hero{min-height:auto;padding-bottom:70px}

/* pagina-specifiek (gescoped op body-class) */
.page-results header.hero{display:none!important}
.page-results main.wrap{margin-top:26px}

/* ===== score-chip (badge-systeem C) — 16 juli 2026, terugdraaipunt: TERUGDRAAIPUNT_voor_badges.tgz ===== */
.score-chip{display:inline-flex;align-items:center;gap:8px;text-decoration:none;padding:3px 12px 3px 4px;border-radius:999px;border:1px solid}
.score-chip .chip-num{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:999px;color:#fff;font-size:12.5px;font-weight:850}
.score-chip .chip-txt{display:flex;flex-direction:column;line-height:1.05;font-size:12px;font-weight:800}
.score-chip .chip-txt em{font-style:normal;font-size:9.5px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;opacity:.62}
.score-chip:hover{filter:brightness(.97)}
.chip-green{background:#EAFBF1;border-color:#B8EACD;color:#085041}
.chip-green .chip-num{background:#159A5D}
.chip-blue{background:#EEF4FB;border-color:#C7D9F2;color:#0C447C}
.chip-blue .chip-num{background:#2563EB}
.chip-gray{background:#F2F5F9;border-color:#D8E0EA;color:#3F4A5C}
.chip-gray .chip-num{background:#64708B}
@media(max-width:760px){
  .score-chip{padding:2px 10px 2px 3px}
  .score-chip .chip-num{width:24px;height:24px;font-size:11.5px}
}

/* ===== home-top3: teaser op de homepage (terugdraaipunt: TERUGDRAAIPUNT_voor_top3.tgz) ===== */
.page-home .home-top3{display:block;padding:6px 20px 52px}
.home-top3[hidden]{display:none!important}
body:not(.page-home) .home-top3{display:none}
.ht3-head{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:11px}
.ht3-head h2{font-size:19px;font-weight:900;color:var(--ink,#101828)}
.ht3-head span{font-size:12px;color:#93A1B8;font-weight:650}
.ht3-row{background:#fff;border:1px solid #DCE6F3;border-radius:14px;display:flex;align-items:center;gap:16px;padding:13px 20px;margin-bottom:9px;text-decoration:none;color:#101828}
.ht3-row:hover{border-color:#B9CBE4}
.ht3-row.win{border:1.5px solid #28C76F;background:linear-gradient(90deg,#F2FFF8,#fff 45%)}
.ht3-rank{font-size:19px;font-weight:950;color:#64708B;width:18px}
.ht3-name{font-size:16.5px;font-weight:900;width:140px}
.ht3-fees{font-family:ui-monospace,Menlo,monospace;font-size:13px;color:#64708B;margin-left:8px}
.ht3-price{margin-left:auto;text-align:right;font-size:19px;font-weight:950;white-space:nowrap}
.ht3-price small{font-size:11.5px;color:#64708B;font-weight:700}
.ht3-price.ok{color:#159A5D}
.ht3-foot{display:flex;align-items:center;justify-content:space-between;margin-top:12px;flex-wrap:wrap;gap:8px}
.ht3-foot span{font-size:12px;color:#93A1B8}
.ht3-all{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1.5px solid #2563EB;color:#2563EB;font-size:14px;font-weight:850;padding:11px 20px;border-radius:12px;text-decoration:none}
.ht3-all:hover{background:#EEF4FB}
@media(max-width:700px){
  .ht3-name{width:auto;flex:1;min-width:0;font-size:15px}
  .ht3-fees{display:none}
  .ht3-row{gap:10px;padding:11px 14px}
  .ht3-price{font-size:16px}
}

/* resultatenpagina: geen Bereken-knop in de navbar (calculator staat al in de zijbalk) */


/* ===== polish-laag app-pagina's (16 juli 2026) ===== */
::selection{background:#2563EB;color:#fff}
html{scroll-behavior:smooth}
[id]{scroll-margin-top:88px}

/* n.n.b.-kaart: leesbaar i.p.v. spookachtig (audit #15) */
#tbl tr.mainrow.result-card-v2.no-price .result-top-v2{opacity:.74!important}
#tbl tr.mainrow.result-card-v2.no-price .result-detail-link{display:none!important}

/* mobiel: kop van de calculator blijft één regel met i rechts (audit #16) */
@media(max-width:760px){
  .calc-head{flex-wrap:nowrap!important}
  .calc-head h2{flex:1;min-width:0}
}

/* mobiel: leesvolgorde kaart = naam → fees → prijs/knop (audit #16) */
@media(max-width:760px){
  #tbl tr.mainrow.result-card-v2 .result-top-v2{display:flex!important;flex-direction:column!important;align-items:stretch!important}
  #tbl tr.mainrow.result-card-v2 .result-brand-v2{order:1}
  #tbl tr.mainrow.result-card-v2 .result-fees-v2{order:2;margin-top:12px!important;flex-direction:row!important;align-items:baseline!important;gap:10px!important}
  #tbl tr.mainrow.result-card-v2 .result-price-v2{order:3;margin-top:12px!important;align-items:flex-start!important;text-align:left!important}
}

/* zachte overgangen op interactieve elementen */
.exchange-cta,.ht3-all,.score-chip,.nav-cta,.sortopt,.ht3-row{transition:background .15s ease,border-color .15s ease,box-shadow .15s ease,transform .15s ease}
.exchange-cta:hover{transform:translateY(-1px);box-shadow:0 14px 26px rgba(37,99,235,.28)!important}
.ht3-row:hover{transform:translateY(-1px)}

/* waarschuwingsregel op kaarten (verlies klantengeld) */
.result-bottom-v2 .trust-item.warn{color:#D64545}
@media(max-width:760px){
  .result-bottom-v2 .trust-item.warn{display:inline-flex!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
}

/* ===== Header uniform met contentpagina's — QA 18 juli 2026 =====
   Zelfde menu-anker als content.css zodat het menu niet verspringt bij
   navigeren tussen dashboard- en contentpagina's. */
@media(min-width:1181px){
  .wrap.nav-grid{max-width:1320px!important;padding-left:24px!important;padding-right:24px!important;grid-template-columns:210px 1fr 320px!important}
  .wrap.nav-grid .nav-actions{justify-self:end}
  .wrap.nav-grid .navlinks{width:100%!important;min-width:0;display:flex!important;justify-content:center!important}
}

/* stabiele scrollbalk: header verschuift niet tussen korte en lange paginas */
html{overflow-y:scroll}

/* ===== Menu-omslagpunt gelijk aan contentpagina's (QA 18 juli, avond) =====
   Content wisselt naar hamburger onder 1181px; de app deed dat pas bij 1020px
   waardoor tussen 1020-1180px twee verschillende menus zichtbaar waren. */
@media(max-width:1180px){
  .wrap.nav-grid{padding-left:24px!important;padding-right:24px!important;grid-template-columns:auto 1fr!important}
  .wrap.nav-grid .nav-actions{justify-self:end}
  .navlinks{display:none!important}
  .mobile-menu-btn{display:inline-flex!important}
  .mobile-nav-panel:not([hidden]){display:block}
}
@media(max-width:900px){
  .nav-cta{display:none!important}
}