/* HOWAT search: command palette with live preview (Leno shop style) */
html.sa-lock{overflow:hidden}
/* a classic scrollbar keeps its room while the page is locked, so nothing behind the palette moves sideways */
html.sa-lock.sa-gutter{scrollbar-gutter:stable}
.sa,.sz-sec,.sz-none{
  --sa-ink:#141211;--sa-ink2:#6B6459;--sa-ink3:#716B61;--sa-line:#EBE7E0;--sa-line2:#F2EEE7;--sa-beige:#FAF8F4;
  --sa-acc:#C05530;--sa-acc2:#A94825;--sa-act:#F4EFE7;--sa-ease:cubic-bezier(.2,.75,.2,1)
}
dialog.search-dialog.sa{
  position:fixed;inset:0;box-sizing:border-box;width:min(900px,calc(100vw - 48px));height:min(720px,calc(100vh - 96px));height:min(720px,calc(100dvh - 96px));
  max-width:none;max-height:none;margin:max(48px,6vh) auto auto;padding:0;border:0;border-radius:16px;overflow:hidden;
  background:#fff;color:var(--sa-ink);font-family:Inter,system-ui,sans-serif;font-size:14px;line-height:1.4;
  box-shadow:0 0 0 1px rgba(20,18,17,.07),0 12px 28px -12px rgba(20,18,17,.22),0 40px 90px -24px rgba(20,18,17,.42);outline:none
}
dialog.search-dialog.sa[open]{display:flex;flex-direction:column;animation:saIn .24s var(--sa-ease)}
/* short content (no results, one pane) lets the panel shrink instead of leaving an empty block */
dialog.search-dialog.sa.is-fit{bottom:auto;height:auto;min-height:min(440px,calc(100vh - 96px));max-height:min(720px,calc(100vh - 96px));max-height:min(720px,calc(100dvh - 96px))}
/* a plain scrim: a backdrop blur repaints the whole animated page behind it on every frame and roughly doubles input latency */
dialog.search-dialog.sa::backdrop{background:rgba(24,20,17,.46);animation:saFade .24s ease}
dialog.search-dialog.sa.is-closing{animation:saOut .14s ease forwards}
dialog.search-dialog.sa.is-closing::backdrop{animation:saFadeOut .14s ease forwards}
@keyframes saIn{from{opacity:0;transform:translateY(-8px) scale(.985)}}
@keyframes saOut{to{opacity:0;transform:translateY(-6px) scale(.99)}}
@keyframes saFade{from{opacity:0}}
@keyframes saFadeOut{to{opacity:0}}
@keyframes saRise{from{opacity:0;transform:translateY(8px)}}
dialog.sa:focus,dialog.sa:focus-visible{outline:none}
.sa *,.sa *::before,.sa *::after{box-sizing:border-box}
.sa :focus-visible{outline:2px solid var(--sa-acc);outline-offset:2px;border-radius:8px}
.sa svg{width:18px;height:18px;flex:none}
.sa kbd{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border:1px solid var(--sa-line);border-bottom-width:2px;border-radius:5px;background:#fff;font:600 11px/1 Inter,system-ui,sans-serif;color:var(--sa-ink2)}
.sa .visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.sa .dlv .dl-s{display:none}

/* head: a clean focus line under the field instead of an outline around the dialog */
.sa-head{position:relative;flex:none;display:flex;align-items:center;gap:10px;height:64px;padding:0 14px 0 20px;border-bottom:1px solid var(--sa-line)}
.sa-head::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1.5px;background:var(--sa-acc);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--sa-ease)}
.sa-head:has(.sa-input:focus)::after{transform:scaleX(1)}
.sa-glass{display:grid;color:var(--sa-ink3)}
.sa-glass svg{width:20px;height:20px}
.sa-input{flex:1;min-width:0;height:100%;padding:0;border:0;border-radius:0;background:none;font:450 17px/1.2 Inter,system-ui,sans-serif;letter-spacing:-.012em;color:var(--sa-ink);caret-color:var(--sa-acc);-webkit-appearance:none;appearance:none}
.sa .sa-input:focus,.sa .sa-input:focus-visible{outline:none}
.sa-input::placeholder{color:#A39C91;opacity:1}
.sa-input::-webkit-search-cancel-button,.sa-input::-webkit-search-decoration{-webkit-appearance:none;display:none}
.sa-clear{display:grid;place-items:center;flex:none;width:28px;height:28px;padding:0;border:0;border-radius:999px;background:var(--sa-line2);color:var(--sa-ink2);cursor:pointer;transition:background-color .15s,color .15s}
.sa-clear:hover{background:var(--sa-line);color:var(--sa-ink)}
.sa-clear svg{width:14px;height:14px}
.sa-clear[hidden]{display:none}
.sa-esc{flex:none;display:grid;place-items:center;height:30px;padding:0 2px;border:0;background:none;cursor:pointer}
.sa-esc kbd{height:24px;padding:0 7px;font-size:11.5px;transition:border-color .15s,color .15s}
.sa-esc:hover kbd{border-color:#D8D1C6;color:var(--sa-ink)}
.sa-esc-t{display:none}
.sa-back{display:none}

/* body */
.sa-body{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 340px}
.sa-body.is-home,.sa-body.is-none{grid-template-columns:minmax(0,1fr)}
.sa-scroll{min-height:0;overflow:auto;overscroll-behavior:contain;padding:6px 8px 14px;scrollbar-width:thin;scrollbar-color:#DDD6CB transparent}
.sa-preview{min-height:0;overflow:auto;overscroll-behavior:contain;padding:18px;border-left:1px solid var(--sa-line);background:var(--sa-beige);scrollbar-width:thin}
.is-home .sa-preview,.is-none .sa-preview{display:none}
.sa-pre:empty,.sa-post:empty{display:none}

/* groups */
.sa-group{padding:2px 0 6px}
.sa-list.is-results .sa-group+.sa-group{margin-top:2px;padding-top:6px;border-top:1px solid var(--sa-line2)}
.sa-gh{display:flex;align-items:center;gap:8px;min-height:32px;padding:8px 12px 4px;font-size:11px;font-weight:600;letter-spacing:.11em;text-transform:uppercase;color:var(--sa-ink3)}
.sa-gh .n{min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--sa-line2);font-size:10.5px;font-weight:600;letter-spacing:0;line-height:18px;text-align:center;color:var(--sa-ink2);font-variant-numeric:tabular-nums}
.sa-link{margin-left:auto;min-height:28px;padding:2px 6px;border:0;background:none;font:500 12px Inter,system-ui,sans-serif;letter-spacing:0;text-transform:none;color:var(--sa-ink3);cursor:pointer;border-radius:6px}
.sa-link:hover{color:var(--sa-ink);text-decoration:underline;text-underline-offset:3px}

/* rows: the option and, next to it, its own buttons */
.sa-row{position:relative;display:flex;align-items:center;border-radius:10px;transition:background-color .12s}
.sa-row.is-active{background:var(--sa-act)}
.sa-opt{flex:1;min-width:0;display:flex;align-items:center;gap:12px;padding:8px 10px;border-radius:inherit;color:inherit;text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
.sa-opt:hover{color:inherit}
.sa-thumb{flex:none;display:grid;place-items:center;width:56px;height:56px;overflow:hidden;border:1px solid var(--sa-line);border-radius:8px;background:#fff}
.sa-thumb img{width:100%;height:100%;padding:3px;object-fit:contain}
.sa-thumb.is-cover img{padding:0;object-fit:cover}
.sa-txt{flex:1;min-width:0;display:grid;gap:2px}
.sa-t{overflow:hidden;font-size:14.5px;font-weight:560;line-height:1.3;letter-spacing:-.006em;white-space:nowrap;text-overflow:ellipsis;color:var(--sa-ink)}
.sa-t--wrap{white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.sa-s{display:flex;align-items:center;gap:6px;min-width:0;font-size:12.5px;color:var(--sa-ink2)}
.sa-ell{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.sa-warn{color:#92400E}
.sa-dots{display:inline-flex;gap:3px;flex:none}
.sa-m{display:flex;align-items:center;gap:8px;min-width:0;margin-top:3px;font-size:12px;color:var(--sa-ink3)}
.sa-m .dlv{min-width:0;padding:1px 7px 1px 6px;font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sa-rate{display:inline-flex;align-items:center;gap:4px;flex:none;font-weight:600;color:var(--sa-ink);font-variant-numeric:tabular-nums}
.sa-rate i{display:grid;place-items:center;width:15px;height:15px;background:var(--sa-acc);color:#fff}
.sa-rate i svg{width:11px;height:11px}
.sa-rate span{font-weight:450;color:var(--sa-ink3)}
.sa-price{flex:none;display:grid;justify-items:end;gap:1px;margin-left:6px;font-variant-numeric:tabular-nums;white-space:nowrap}
.sa-price b{font-size:14.5px;font-weight:650;letter-spacing:-.01em}
.sa-price s{font-size:12px;color:var(--sa-ink3)}
/* "Met code SALE €368,10" from the promo settings, under the price of a result and in the preview */
.sa-code{display:block;margin:0;font-size:11.5px;font-weight:500;line-height:1.35;color:var(--sa-ink2);letter-spacing:0}
.sa .sa-code b,.sa .sa-prod .sa-code b{font-size:inherit;font-weight:600;letter-spacing:.06em;color:var(--sa-acc2)}
.sa-code .nw{white-space:nowrap;font-weight:650;color:var(--sa-ink)}
.sa-pv-code{margin-top:-4px;font-size:13px}
.sa-bp-code{margin-top:1px}
.sa-from{font-size:11.5px;color:var(--sa-ink3)}
.sa-add{flex:none;display:grid;place-items:center;width:38px;height:38px;margin:0 10px 0 2px;padding:0;border:1px solid var(--sa-line);border-radius:999px;background:#fff;color:var(--sa-ink);cursor:pointer;text-decoration:none;transition:background-color .15s,border-color .15s,color .15s,transform .15s}
.sa-add svg{width:17px;height:17px}
.sa-add:hover{border-color:var(--sa-acc);background:var(--sa-acc);color:#fff}
.sa-add:active{transform:scale(.94)}
.sa-add.is-done{border-color:#BBF7D0;background:#F0FDF4;color:#166534}
.sa-row.is-active .sa-add{border-color:#D9D1C5}
.sa-row.is-active .sa-add:hover{border-color:var(--sa-acc)}
.sa-ret,.sa-go{flex:none;display:grid;place-items:center;width:26px;height:26px;margin-left:4px;border-radius:7px;color:var(--sa-ink3);opacity:0;transition:opacity .12s}
.sa-ret svg,.sa-go svg{width:15px;height:15px}
.sa-row.is-active .sa-ret{opacity:1;background:#fff;box-shadow:inset 0 0 0 1px var(--sa-line)}
.sa-go{opacity:1;color:var(--sa-ink)}
.sa-ic{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:9px;background:var(--sa-beige);box-shadow:inset 0 0 0 1px var(--sa-line2);color:var(--sa-ink2)}
.sa-ic svg{width:18px;height:18px}
.sa-ic--plain{width:22px;height:22px;background:none;box-shadow:none;color:var(--sa-ink3)}
.sa-ic--plain svg{width:16px;height:16px}
.sa-ic--ink{background:var(--sa-ink);box-shadow:none;color:#fff}
.sa-row.is-active .sa-ic:not(.sa-ic--plain):not(.sa-ic--ink){background:#fff}
.sa-snip{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:12.5px;line-height:1.45;color:var(--sa-ink2)}
.sa-qa .sa-opt{align-items:flex-start}
.sa-qa .sa-ic{margin-top:1px}
.sa-qa .sa-ret{align-self:center}
.sa-all .sa-opt{min-height:52px}
.sa-all .sa-t{font-weight:600}
.sa mark{padding:0;border-radius:2px;background:linear-gradient(transparent 60%,rgba(192,85,48,.24) 60%);color:inherit;font-weight:inherit}

/* notes above the list: spelling and combinations that do not exist */
.sa-pre{display:grid;gap:6px;padding:8px 4px 2px}
.sa-fix,.sa-note{display:flex;align-items:flex-start;gap:8px;margin:0;padding:8px 10px;border-radius:10px;font-size:13px;line-height:1.45;color:var(--sa-ink2)}
.sa-fix{width:100%;align-items:center;border:0;background:none;font-family:Inter,system-ui,sans-serif;text-align:left;cursor:pointer;transition:background-color .15s}
.sa-fix:hover{background:var(--sa-beige)}
.sa-fix b{font-weight:600;color:var(--sa-acc2);text-decoration:underline;text-underline-offset:3px}
.sa-fix svg,.sa-note svg{width:16px;height:16px;margin-top:1px;color:var(--sa-ink3)}
.sa-fix svg{margin-top:0}
.sa-note{background:#FFFBEB;box-shadow:inset 0 0 0 1px #FDE68A;color:#92400E}
.sa-note svg{color:#B45309}
.sa-none-top button{padding:0;border:0;background:none;font:600 13px Inter,system-ui,sans-serif;color:var(--sa-acc);cursor:pointer;text-decoration:underline;text-underline-offset:3px}

/* preview pane */
.sa-pv{display:flex;flex-direction:column;gap:12px;min-height:100%;animation:saPv .18s ease}
@keyframes saPv{from{opacity:.4}}
.sa-pv-media{display:block;flex:none;height:188px;overflow:hidden;border-radius:12px;background:#fff;box-shadow:inset 0 0 0 1px var(--sa-line)}
.sa-pv-media img{display:block;width:100%;height:100%;object-fit:cover}
.sa-pv-media.is-white img{padding:12px;object-fit:contain}
.sa-pv--text .sa-pv-media{height:150px}
.sa-pv-head{display:grid;gap:3px}
.sa-pv-eye{font-size:11px;font-weight:600;letter-spacing:.11em;text-transform:uppercase;color:var(--sa-acc2)}
.sa-pv-t{margin:0;font-size:18px;font-weight:600;line-height:1.25;letter-spacing:-.018em;color:var(--sa-ink)}
.sa-pv-s{margin:0;font-size:13px;color:var(--sa-ink2)}
.sa-pv-p{margin:0;font-size:13.5px;line-height:1.6;color:#4A443C}
.sa-pv-p--sm{font-size:13px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.sa-pv-fin{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px;border-radius:10px;background:#fff;box-shadow:inset 0 0 0 1px var(--sa-line)}
.sa-pv-lab{font-size:12.5px;color:var(--sa-ink2)}
.sa-pv-lab b{margin-left:4px;font-weight:600;color:var(--sa-ink)}
.sa-pv-fin .fdots{gap:2px;flex-wrap:nowrap}
.sa-pv-fin .fdots a.is-current{box-shadow:0 0 0 1.5px var(--sa-ink)}
.sa-pv-buy{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.sa-pv-price{display:flex;align-items:baseline;gap:8px;font-variant-numeric:tabular-nums}
.sa-pv-price b{font-size:22px;font-weight:650;letter-spacing:-.02em}
.sa-pv-price s{font-size:13.5px;color:var(--sa-ink3)}
.sa-pv-rate{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--sa-ink3)}
.sa-pv-rate b{color:var(--sa-ink);font-weight:600}
.sa-pv-rate .sbox{margin:0;--sb:15px}
.sa-pv .dlv{align-self:flex-start;font-size:12px}
.sa-pv-cta{margin-top:auto;display:grid;grid-template-columns:1fr auto;gap:8px;padding-top:4px}
.sa-pv-cta.is-one{grid-template-columns:1fr}
.sa-pv-cta .btn{min-height:44px;padding:0 16px;gap:8px;font-size:14px;border-radius:999px}
.sa-pv-cta .btn svg{width:17px;height:17px}
.sa-pv-cta .btn.is-done{background:#166534;border-color:#166534;color:#fff}
.sa-pv-list{display:grid;gap:7px;margin:0;padding:0;list-style:none}
.sa-pv-list li{display:flex;gap:8px;font-size:13px;line-height:1.4;color:#4A443C}
.sa-pv-list svg{width:16px;height:16px;margin-top:1px;color:#166534}
.sa-pv-steps{display:grid;gap:6px;margin:0;padding:0;list-style:none;counter-reset:s}
.sa-pv-steps li{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:500;color:var(--sa-ink);counter-increment:s}
.sa-pv-steps li::before{content:counter(s);display:grid;place-items:center;flex:none;width:22px;height:22px;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 1px var(--sa-line);font-size:11.5px;font-weight:600;color:var(--sa-acc)}
.sa-pv-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.sa-mini-pv{display:grid;gap:2px;padding:6px 6px 8px;border-radius:10px;background:#fff;box-shadow:inset 0 0 0 1px var(--sa-line);color:inherit;text-decoration:none;transition:box-shadow .15s}
.sa-mini-pv:hover{box-shadow:inset 0 0 0 1px #CFC7BB}
.sa-mini-pv .sa-mini-im{display:block;height:92px;margin-bottom:4px}
.sa-mini-pv .sa-mini-im img{width:100%;height:100%;object-fit:contain}
.sa-mini-t{overflow:hidden;font-size:12px;line-height:1.3;white-space:nowrap;text-overflow:ellipsis;color:var(--sa-ink2)}
.sa-mini-pv b{font-size:13px;font-weight:650;font-variant-numeric:tabular-nums}
.sa-help{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;background:#fff;box-shadow:inset 0 0 0 1px var(--sa-line)}
.sa-help-t{flex:1;min-width:0;display:grid;font-size:12px;color:var(--sa-ink3)}
.sa-help-t b{font-size:13px;font-weight:600;color:var(--sa-ink)}
.sa-help-a{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--sa-ink);text-decoration:none;white-space:nowrap}
.sa-help-a svg{width:15px;height:15px}
.sa-live{display:inline-block;flex:none;width:8px;height:8px;border-radius:50%;background:#C9C2B7}
.sa-live.is-open{background:#22C55E;box-shadow:0 0 0 3px rgba(34,197,94,.18)}

/* empty state, wide: searches and help on the left, shop on the right */
.sa-home{display:grid;grid-template-columns:250px minmax(0,1fr);min-height:100%}
.sa-home.is-narrow{display:block}
.sa-home-l{padding:0 8px 0 0;border-right:1px solid var(--sa-line2)}
.sa-home-r{min-width:0;padding:0 4px 0 14px}
.sa-home .sa-group+.sa-group{margin-top:4px}
.sa-sug .sa-opt{gap:10px;min-height:38px;padding:6px 10px}
.sa-sug .sa-t{font-size:14px;font-weight:450}
.sa-cnt{margin-left:auto;font-size:12px;color:var(--sa-ink3);font-variant-numeric:tabular-nums}
.sa-x{display:grid;place-items:center;flex:none;width:30px;height:30px;margin-right:6px;padding:0;border:0;border-radius:8px;background:none;color:var(--sa-ink3);cursor:pointer;opacity:0;transition:opacity .12s,background-color .12s,color .12s}
.sa-x svg{width:14px;height:14px}
.sa-row.is-active .sa-x,.sa-x:focus-visible{opacity:1}
.sa-x:hover{background:#fff;color:var(--sa-ink)}
.sa-helpo .sa-opt{gap:10px;padding:6px 10px}
.sa-helpo .sa-ic{width:32px;height:32px;border-radius:8px}
.sa-helpo .sa-ic svg{width:16px;height:16px}
.sa-helpo .sa-t{font-size:13.5px}
.sa-helpo .sa-s{font-size:12px;color:var(--sa-ink3)}
.sa-home:not(.is-narrow) .sa-helpo .sa-s{align-items:flex-start}
.sa-home:not(.is-narrow) .sa-helpo .sa-ell{white-space:normal;line-height:1.35}
.sa-home:not(.is-narrow) .sa-helpo .sa-live{margin-top:4px}
.sa-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 10px;padding:2px 2px 2px}
.sa-tile{border-radius:12px}
.sa-tile .sa-opt{display:grid;align-content:start;gap:1px;padding:6px 6px 8px}
.sa-tile-im{display:block;aspect-ratio:16/10;margin-bottom:6px;overflow:hidden;border-radius:9px;background:#F3EFE8}
.sa-tile-im img{display:block;width:100%;height:100%;object-fit:cover;object-position:var(--pos,50% 50%);transition:transform .5s var(--sa-ease)}
.sa-tile-im.is-soft{background:#F3F0EB}
.sa-tile-im.is-soft img{object-fit:contain}
.sa-tile-im.is-white{background:#fff;box-shadow:inset 0 0 0 1px var(--sa-line)}
.sa-tile-im.is-white img{padding:8px;object-fit:contain}
.sa-tile.is-active .sa-tile-im img{transform:scale(1.04)}
.sa-tile-t{font-size:13.5px;font-weight:600;line-height:1.25;letter-spacing:-.006em}
.sa-tile-s{font-size:12px;color:var(--sa-ink3);font-variant-numeric:tabular-nums}
.sa-fins{display:flex;flex-wrap:wrap;gap:6px;padding:2px 6px 4px}
.sa-fin{border-radius:999px;box-shadow:inset 0 0 0 1px var(--sa-line)}
.sa-fin .sa-opt{gap:7px;min-height:36px;padding:4px 11px 4px 6px;font-size:13px;font-weight:500;white-space:nowrap}
.sa-fin .n{font-size:12px;color:var(--sa-ink3);font-variant-numeric:tabular-nums}
.sa-fin.is-active{box-shadow:inset 0 0 0 1px #D2C9BC}
.sa-best{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:2px 8px 4px}
.sa-mini{flex-direction:column;align-items:stretch;border-radius:12px;box-shadow:inset 0 0 0 1px var(--sa-line)}
.sa-mini .sa-opt{display:grid;align-content:start;gap:6px;padding:8px 8px 9px}
.sa-mini .sa-mini-im{display:block;height:84px;border-radius:8px;background:#fff}
.sa-mini .sa-mini-im img{display:block;width:100%;height:100%;object-fit:contain}
.sa-mini .sa-t{min-height:2.6em;font-size:12.5px;line-height:1.3;white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3}
.sa-mini .sa-s{font-size:11.5px}
.sa-mini .sa-add{position:absolute;top:58px;right:10px;width:34px;height:34px;margin:0;box-shadow:0 2px 8px -2px rgba(20,18,17,.18)}
.sa-bp{display:flex;align-items:baseline;flex-wrap:wrap;column-gap:6px;margin-top:2px;font-size:12px;font-variant-numeric:tabular-nums}
.sa-bp b{font-size:13.5px;font-weight:650}
.sa-bp s{font-size:11.5px;color:var(--sa-ink3)}

/* no results */
.sa-none-top{display:flex;align-items:center;gap:14px;padding:14px 12px 4px}
.sa-none-ic{display:grid;place-items:center;flex:none;width:46px;height:46px;border-radius:999px;background:var(--sa-beige);box-shadow:inset 0 0 0 1px var(--sa-line);color:var(--sa-ink3)}
.sa-none-ic svg{width:22px;height:22px}
.sa-none-top h3{margin:0 0 2px;font-size:18px;font-weight:600;letter-spacing:-.015em}
.sa-none-top p{margin:0;font-size:13.5px;color:var(--sa-ink2)}
.sa-g-try .sa-sugs,.sa-home.is-narrow .sa-sugs{display:flex;flex-wrap:wrap;gap:8px;padding:2px 10px 6px}
.sa-g-try .sa-sug,.sa-home.is-narrow .sa-sug{border-radius:999px;box-shadow:inset 0 0 0 1px var(--sa-line)}
.sa-g-try .sa-sug .sa-opt,.sa-home.is-narrow .sa-sug .sa-opt{gap:7px;min-height:40px;padding:0 14px 0 11px;font-size:13.5px}
.sa-g-try .sa-sug .sa-t,.sa-home.is-narrow .sa-sug .sa-t{font-size:13.5px;font-weight:500}
.sa-g-try .sa-sug.is-active,.sa-home.is-narrow .sa-sug.is-active{box-shadow:inset 0 0 0 1px #D2C9BC}
.sa-home.is-narrow .sa-cnt{display:none}
.sa-home.is-narrow .sa-sug--rec .sa-opt{padding-right:2px}
.sa-home.is-narrow .sa-sug--rec .sa-x{width:40px;height:40px;margin:0;border-radius:999px;opacity:1}
@media (max-width:699px),(pointer:coarse) and (max-height:500px){.sa-g-try .sa-sug .sa-opt,.sa-home.is-narrow .sa-sug .sa-opt{min-height:44px}.sa-home.is-narrow .sa-sug--rec .sa-x{width:44px;height:44px}}
/* horizontal scrollers */
.sa-g-scroll .sa-tiles,.sa-home.is-narrow .sa-tiles,.sa-home.is-narrow .sa-fins{display:flex;flex-wrap:nowrap;gap:10px;margin:0 -8px;padding:2px 18px 8px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scroll-padding:0 18px;scrollbar-width:none}
.sa-g-scroll .sa-tiles::-webkit-scrollbar,.sa-home.is-narrow .sa-tiles::-webkit-scrollbar,.sa-home.is-narrow .sa-fins::-webkit-scrollbar{display:none}
.sa-g-scroll .sa-tile,.sa-home.is-narrow .sa-tile{flex:none;width:148px;scroll-snap-align:start}
.sa-g-scroll .sa-tile .sa-opt,.sa-home.is-narrow .sa-tile .sa-opt{padding:0 0 4px}
.sa-g-scroll .sa-tile-im,.sa-home.is-narrow .sa-tile-im{aspect-ratio:4/3}
.sa-g-scroll .sa-tile-im img,.sa-home.is-narrow .sa-tile-im img{object-position:50% 50%}
.sa-home.is-narrow .sa-mini .sa-t{min-height:0}
/* no results with two panes wide: the six categories side by side, nothing cut off */
.sa-list.is-wide .sa-g-scroll .sa-tiles{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin:0;padding:2px 10px 6px;overflow:visible}
.sa-list.is-wide .sa-g-scroll .sa-tile{width:auto}
.sa-home.is-narrow .sa-fins{gap:8px}
.sa-home.is-narrow .sa-fin{flex:none}
.sa-home.is-narrow .sa-fin .sa-opt{min-height:44px}
.sa-home.is-narrow .sa-best{grid-template-columns:1fr;gap:0;padding:0}
.sa-home.is-narrow .sa-mini{flex-direction:row;align-items:center;box-shadow:none}
.sa-home.is-narrow .sa-mini .sa-opt{grid-template-columns:64px minmax(0,1fr);align-items:center;column-gap:12px;padding:8px 4px 8px 8px}
.sa-home.is-narrow .sa-mini .sa-mini-im{width:64px;height:64px;border:1px solid var(--sa-line)}
.sa-home.is-narrow .sa-mini .sa-mini-im img{padding:3px}
.sa-home.is-narrow .sa-mini .sa-t{font-size:14px;white-space:normal;display:-webkit-box}
.sa-home.is-narrow .sa-mini .sa-s{font-size:12.5px}
.sa-home.is-narrow .sa-mini .sa-add{position:static;width:44px;height:44px;margin:0 6px 0 0;box-shadow:none}
.sa-home.is-narrow .sa-helps{display:grid;grid-template-columns:1fr 1fr;gap:0 4px}
.sa-home.is-narrow .sa-helpo .sa-opt{min-height:52px}

/* the best answer, in full (screens without the preview pane) */
.sa-featrow{margin:2px 2px 6px;border-radius:14px;box-shadow:inset 0 0 0 1px var(--sa-line)}
.sa-featrow.is-active{background:#FBF9F5;box-shadow:inset 0 0 0 1px #D9D1C5}
.sa-featrow .sa-opt{display:block;padding:14px 16px 14px}
.sa-feat-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.sa-feat-hd{display:grid;gap:3px;min-width:0}
.sa-feat-eye{font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--sa-acc2)}
.sa-feat-t{font-size:16.5px;font-weight:600;line-height:1.3;letter-spacing:-.015em;color:var(--sa-ink)}
.sa-feat-im{width:64px;height:64px}
.sa-feat-bd{display:grid;gap:10px;margin-top:8px}
.sa-feat-x{font-size:14px;line-height:1.6;color:#4A443C}
.sa-feat-pts,.sa-feat-steps{display:grid;gap:7px}
.sa-feat-pts>span{display:flex;gap:8px;font-size:13.5px;line-height:1.4;color:#4A443C}
.sa-feat-pts svg{width:16px;height:16px;margin-top:1px;color:#166534}
.sa-feat-steps>span{display:flex;align-items:center;gap:10px;font-size:13.5px;font-weight:500;color:var(--sa-ink)}
.sa-feat-steps i{display:grid;place-items:center;flex:none;width:22px;height:22px;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 1px var(--sa-line);font-size:11.5px;font-style:normal;font-weight:600;color:var(--sa-acc)}
.sa-feat-more{display:inline-flex;align-items:center;gap:6px;margin-top:12px;font-size:13.5px;font-weight:600;color:var(--sa-ink);text-decoration:underline;text-decoration-color:var(--sa-line);text-underline-offset:4px}
.sa-feat-more svg{width:15px;height:15px}

/* contact card below answers and in the no-results state */
.sa-post{padding:4px 4px 0}
.sa-contact{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px 14px;margin:8px 0 4px;padding:14px 16px;border-radius:14px;background:var(--sa-beige);box-shadow:inset 0 0 0 1px var(--sa-line)}
.sa-contact-t{display:grid;gap:2px;font-size:12.5px;color:var(--sa-ink2)}
.sa-contact-t b{font-size:14px;font-weight:600;color:var(--sa-ink)}
.sa-contact-t>span{display:flex;align-items:center;gap:8px}
.sa-contact-b{display:flex;flex-wrap:wrap;gap:6px}
.sa-contact-b .btn{min-height:40px;padding:0 14px;gap:7px;font-size:13.5px;background:#fff}
.sa-contact-b .btn svg{width:16px;height:16px}

/* add confirmation: takes the place of the footer, never covers a result */
.sa-added{flex:none;display:flex;align-items:center;gap:12px;min-height:60px;padding:8px 10px 8px 12px;border-top:1px solid var(--sa-line);background:#fff}
.sa-added[hidden]{display:none}
.sa-added.is-in{animation:saRise .24s var(--sa-ease)}
.sa.has-added .sa-foot{display:none}
.sa-added-im{flex:none;width:44px;height:44px;overflow:hidden;border:1px solid var(--sa-line);border-radius:8px;background:#fff}
.sa-added-im img{width:100%;height:100%;padding:2px;object-fit:contain}
.sa-added-t{flex:1;min-width:0;display:grid;gap:1px;font-size:12.5px;color:var(--sa-ink2)}
.sa-added-t b{display:flex;align-items:center;gap:6px;font-size:13.5px;font-weight:600;color:var(--sa-ink)}
.sa-added-t b svg{width:16px;height:16px;padding:2px;border-radius:999px;background:#166534;color:#fff;stroke-width:2.4}
.sa-added-t>span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.sa-added-go{flex:none;min-height:40px;padding:0 8px 0 16px;gap:8px;border-radius:999px;font-size:13.5px}
.sa-added-n{display:grid;place-items:center;min-width:24px;height:24px;padding:0 6px;border-radius:999px;background:#fff;color:var(--sa-acc);font-size:12px;font-weight:700;font-variant-numeric:tabular-nums}
.sa-added-x{opacity:1;margin:0}

/* footer */
.sa-foot{flex:none;display:flex;align-items:center;justify-content:space-between;gap:16px;height:44px;padding:0 16px 0 18px;border-top:1px solid var(--sa-line);background:#fff;font-size:12px;color:var(--sa-ink3)}
.sa-keys{display:flex;align-items:center;gap:16px;min-width:0}
.sa-k{display:inline-flex;align-items:center;gap:4px;white-space:nowrap;line-height:20px}
.sa-k kbd:last-of-type{margin-right:3px}
.sa-k-add{display:none}
.sa-k[hidden]{display:none}
.sa.is-prod .sa-k-add{display:inline-flex}
.sa-svc{display:inline-flex;align-items:center;gap:7px;color:var(--sa-ink2);text-decoration:none;white-space:nowrap}
.sa-svc:hover{color:var(--sa-ink)}
/* the service status once: hidden here while a contact or help card shows it */
.sa.has-help .sa-svc{visibility:hidden}

/* page flash after jumping to an answer */
details.sa-flash,section.sa-flash,ol.sa-flash{animation:saFlash 2.2s ease}
@keyframes saFlash{0%,40%{box-shadow:0 0 0 3px rgba(192,85,48,.28);border-radius:10px}100%{box-shadow:0 0 0 3px rgba(192,85,48,0)}}
section.sa-flash{animation-name:saFlashBg}
@keyframes saFlashBg{0%,35%{background-color:rgba(192,85,48,.06)}100%{background-color:transparent}}

/* tablet: one pane */
@media (max-width:899px){
  dialog.search-dialog.sa{width:min(700px,calc(100vw - 32px));margin-top:max(32px,5vh);height:min(760px,calc(100vh - 64px));height:min(760px,calc(100dvh - 64px))}
  dialog.search-dialog.sa.is-fit{min-height:min(440px,calc(100vh - 64px));max-height:min(760px,calc(100vh - 64px));max-height:min(760px,calc(100dvh - 64px))}
  .sa-body{grid-template-columns:minmax(0,1fr)}
  .sa-preview{display:none}
  .sa-thumb{width:64px;height:64px}
  .sa-tiles{grid-template-columns:repeat(3,minmax(0,1fr))}
}
/* phone, also held sideways (low screen, touch): full-screen sheet */
@media (max-width:699px),(pointer:coarse) and (max-height:500px){
  dialog.search-dialog.sa,dialog.search-dialog.sa.is-fit{width:100%;height:100%;height:100dvh;min-height:0;max-height:none;margin:0;border-radius:0;box-shadow:none;padding:env(safe-area-inset-top,0) env(safe-area-inset-right,0) 0 env(safe-area-inset-left,0)}
  .sa-body{grid-template-columns:minmax(0,1fr)}
  .sa-preview{display:none}
  dialog.search-dialog.sa[open]{animation:saUp .26s var(--sa-ease)}
  @keyframes saUp{from{opacity:0;transform:translateY(14px)}}
  .sa-head{height:60px;gap:4px;padding:0 8px 0 4px}
  .sa-back{display:grid;place-items:center;flex:none;width:44px;height:44px;padding:0;border:0;border-radius:12px;background:none;color:var(--sa-ink);cursor:pointer}
  .sa-back svg{width:22px;height:22px}
  .sa-glass,.sa .sa-esc{display:none}
  .sa-input{height:44px;padding:0 12px;border-radius:12px;background:var(--sa-beige);box-shadow:inset 0 0 0 1px var(--sa-line);font-size:16px}
  .sa .sa-input:focus{box-shadow:inset 0 0 0 1.5px var(--sa-acc);background:#fff}
  .sa-head::after{display:none}
  .sa-clear{position:absolute;right:8px;width:36px;height:36px;background:transparent}
  .sa-clear svg{width:16px;height:16px}
  .sa-head:has(.sa-clear:not([hidden])) .sa-input{padding-right:44px}
  .sa-scroll{padding:2px 8px calc(24px + env(safe-area-inset-bottom,0px))}
  .sa-foot{display:none}
  .sa-gh{padding:14px 10px 6px}
  .sa-opt{min-height:56px}
  .sa-prod .sa-opt{display:grid;grid-template-columns:68px minmax(0,1fr);column-gap:12px;row-gap:0;align-items:start;padding:10px 4px 10px 8px}
  .sa-prod .sa-thumb{grid-row:1/3;width:68px;height:68px}
  .sa-prod .sa-t{white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}
  .sa-prod .sa-price{grid-column:2;display:flex;align-items:baseline;gap:7px;margin:5px 0 0}
  .sa-prod .sa-price b{font-size:15px}
  .sa-prod .sa-price{flex-wrap:wrap;row-gap:1px}
  .sa-prod .sa-code{flex-basis:100%;font-size:12px}
  .sa-m{flex-wrap:wrap;row-gap:4px}
  .sa .sa-m .dlv .dl-l{display:none}
  .sa .sa-m .dlv .dl-s{display:inline}
  .sa-add{width:44px;height:44px;margin:0 4px 0 0}
  .sa-add.is-done{border-color:#166534;background:#166534;color:#fff}
  .sa-ret{display:none}
  .sa-x{opacity:1}
  .sa-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sa-home.is-narrow .sa-helps{grid-template-columns:1fr}
  .sa-g-scroll .sa-tile,.sa-home.is-narrow .sa-tile{width:136px}
  .sa-none-top{padding:12px 8px 4px}
  .sa-contact{margin:10px 2px 4px}
  .sa-contact-b{width:100%}
  .sa-contact-b .btn{flex:1 1 auto;min-height:46px}
  .sa-added{min-height:64px;padding:8px 8px calc(8px + env(safe-area-inset-bottom,0px)) 12px;box-shadow:0 -8px 20px -12px rgba(20,18,17,.2)}
  .sa-added-go{min-height:44px}
  .sa-hide-s{display:none}
  .sa-added-x{width:44px;height:44px}
  .sa-featrow .sa-opt{padding:14px 14px}
  .sa-fix{min-height:44px;padding:6px 10px}
}
/* a mouse wheel cannot scroll a row sideways: below 900px with a mouse the categories and finishes wrap instead */
@media (max-width:899px) and (hover:hover) and (pointer:fine){
  .sa-g-scroll .sa-tiles,.sa-home.is-narrow .sa-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0;padding:2px 10px 6px;overflow:visible;scroll-snap-type:none}
  .sa-g-scroll .sa-tile,.sa-home.is-narrow .sa-tile{width:auto}
  .sa-g-scroll .sa-tile-im,.sa-home.is-narrow .sa-tile-im{aspect-ratio:16/10}
  .sa-home.is-narrow .sa-fins{flex-wrap:wrap;margin:0;padding:2px 10px 6px;overflow:visible;scroll-snap-type:none}
}
@media (max-width:559px) and (hover:hover) and (pointer:fine){
  .sa-g-scroll .sa-tiles,.sa-home.is-narrow .sa-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (hover:none),(pointer:coarse){
  .sa-foot .sa-keys{display:none}
  .sa-foot{justify-content:flex-end}
  .sa.has-help .sa-foot{display:none}
  .sa-x{opacity:1}
  /* no Escape key on a touch screen: a real close button, 44px high */
  .sa-esc{height:44px;margin-right:-4px;padding:0 12px;border-radius:999px;font:500 14px/1 Inter,system-ui,sans-serif;color:var(--sa-ink)}
  .sa-esc kbd{display:none}
  .sa-esc .sa-esc-t{display:inline}
  .sa-esc:active{background:var(--sa-line2)}
  /* a 44px target that still looks like the small round button */
  .sa-head .sa-clear{width:44px;height:44px;background:radial-gradient(circle,var(--sa-line2) 0 14px,transparent 14.5px)}
  .sa-none-top button{display:inline-flex;align-items:center;min-height:44px;margin:-14px 0;padding:0 4px}
  .sa-fix{min-height:44px}
  /* every control a finger can reach is 44px */
  .sa-add,.sa-x,.sa-added-x,.sa-home.is-narrow .sa-sug--rec .sa-x{width:44px;height:44px}
  .sa-mini .sa-add{top:48px;width:44px;height:44px}
  .sa-link{min-height:44px;padding:0 10px}
  .sa-svc,.sa-help-a{min-height:44px}
  .sa-sug .sa-opt,.sa-fin .sa-opt,.sa-g-try .sa-sug .sa-opt,.sa-home.is-narrow .sa-sug .sa-opt{min-height:44px}
  .sa-contact-b .btn,.sa-added-go{min-height:44px}
  .sa-pv-fin{flex-wrap:wrap;row-gap:0;padding-block:2px}
  .sa-pv-fin .fdots{gap:0}
  .sa-pv-fin .fdots a{display:grid;place-items:center;width:44px;height:44px;padding:0;box-shadow:none}
  .sa-pv-fin .fdots a:hover{box-shadow:none}
  .sa-pv-fin .fdots a.is-current{box-shadow:none}
  .sa-pv-fin .fdots a.is-current .fdot{box-shadow:0 0 0 2px #fff,0 0 0 3.5px var(--sa-ink)}
}
@media (max-width:699px),(pointer:coarse) and (max-height:500px){
  .sa-head .sa-clear{background:transparent}
}
@media (prefers-reduced-motion:reduce){
  dialog.search-dialog.sa[open],dialog.search-dialog.sa::backdrop,.sa-pv,.sa-added.is-in{animation:none}
  .sa-tile-im img,.sa-head::after{transition:none}
}

/* ================= #/zoeken results page ================= */
.sz-head{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;padding-block:clamp(24px,4vw,56px) clamp(18px,2.4vw,28px)}
.sz-head .h1{margin:0}
.sz-meta{margin:0;font-size:14px;color:var(--ink-2,#6B6459)}
.sz-form{display:flex;gap:8px;min-width:0;max-width:560px}
.sz-form .btn{flex:none}
.sz-cats{display:flex;flex-wrap:wrap;gap:8px;min-width:0}
.sz-cats .chip{gap:8px}
.sz-cats .fdot{--d:16px}
.sz-form input{flex:1;width:100%;min-width:0;height:50px;padding:0 1rem;border-radius:999px;border:1px solid var(--line,#EBE7E0);background:#fff;font-size:16px}
.sz-form input:focus{outline:none;border-color:var(--ink,#141211);box-shadow:0 0 0 3px rgba(20,18,17,.08)}
.sz-note,.sz-fix{display:flex;align-items:flex-start;gap:8px;max-width:640px;margin:0;padding:10px 14px;border-radius:12px;font-size:14px;line-height:1.5}
.sz-note{background:#FFFBEB;box-shadow:inset 0 0 0 1px #FDE68A;color:#92400E}
.sz-fix{padding-inline:0;color:var(--ink-2,#6B6459)}
.sz-fix a{font-weight:600;color:var(--accent,#C05530);text-underline-offset:3px}
.sz-note svg,.sz-fix svg{width:18px;height:18px;flex:none;margin-top:1px}
.sz-sec{margin-top:clamp(20px,3vw,36px)}
.sz-sec:first-child{margin-top:0}
.sz-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0 0 14px;font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3,#8A847A)}
.sz-h .n{letter-spacing:0;font-variant-numeric:tabular-nums}
.sz-answers{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:16px;align-items:start}
.sz-answers.is-solo{grid-template-columns:minmax(0,1fr)}
.sz-feat{display:grid;gap:12px;padding:clamp(18px,2.4vw,28px);border-radius:16px;background:#fff;box-shadow:inset 0 0 0 1px var(--line,#EBE7E0)}
.sz-feat-top{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.sz-feat-eye{display:block;margin-bottom:4px;font-size:11.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--accent,#C05530)}
.sz-feat h2{margin:0;font-size:clamp(19px,1.7vw,22px);font-weight:600;line-height:1.3;letter-spacing:-.018em}
.sz-feat-im{flex:none;width:88px;height:88px;overflow:hidden;border-radius:10px;border:1px solid var(--line,#EBE7E0);background:#fff}
.sz-feat-im img{width:100%;height:100%;object-fit:cover}
.sz-feat-im.is-white img{padding:6px;object-fit:contain}
.sz-feat .sa-feat-bd{margin:0;gap:12px}
.sz-feat .sa-feat-x{font-size:15px;line-height:1.65}
.sz-feat mark{padding:0;background:linear-gradient(transparent 60%,rgba(192,85,48,.24) 60%);color:inherit}
.sz-feat .btn{justify-self:start;gap:8px}
.sz-side{display:grid;gap:10px}
.sz-more{display:grid;gap:2px;padding:6px;border-radius:16px;background:#fff;box-shadow:inset 0 0 0 1px var(--line,#EBE7E0)}
.sz-more a,.sz-more button{display:flex;align-items:flex-start;gap:12px;width:100%;padding:10px;border:0;border-radius:10px;background:none;font:inherit;text-align:left;color:inherit;text-decoration:none;cursor:pointer}
.sz-more a:hover,.sz-more button:hover{background:#FAF8F4}
.sz-more .sa-ic{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:9px;background:#FAF8F4;box-shadow:inset 0 0 0 1px #F2EEE7;color:var(--ink-2,#6B6459)}
.sz-more .sa-ic svg{width:17px;height:17px}
.sz-more b{display:block;font-size:14px;font-weight:600;line-height:1.35}
.sz-more span span{display:block;margin-top:2px;font-size:13px;line-height:1.45;color:var(--ink-2,#6B6459)}
.sz-contact{display:grid;gap:10px;padding:16px 18px;border-radius:16px;background:#FAF8F4;box-shadow:inset 0 0 0 1px var(--line,#EBE7E0)}
.sz-contact b{font-size:15px}
.sz-contact .row{display:flex;flex-wrap:wrap;gap:8px}
.sz-contact .btn{background:#fff;gap:7px}
.sz-contact .btn svg{width:16px;height:16px}
.sz-live{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink-2,#6B6459)}
.sz-live .sa-live{width:8px;height:8px;border-radius:50%;background:#C9C2B7}
.sz-live .sa-live.is-open{background:#22C55E;box-shadow:0 0 0 3px rgba(34,197,94,.18)}
.sz-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.sz-none{display:grid;justify-items:center;gap:16px;max-width:620px;margin:0 auto;padding:clamp(24px,5vw,56px) 0;text-align:center}
.sz-none h2{margin:0;font-size:22px;font-weight:600;letter-spacing:-.015em}
.sz-none p{margin:0;color:var(--ink-2,#6B6459)}
.sz-none .sz-contact{justify-items:center;width:100%}
@media (max-width:899px){
  .sz-answers{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:699px){
  .sz-feat-im{width:64px;height:64px}
  .sz-contact .btn{flex:1 1 auto;min-height:46px}
}
