/* ===================== Trace Lab v3 COMMERCIAL (2026-10-07) =====================
   Loaded after tl.css. Evan: "more commercial and conversion optimised".
   Pattern: Data Clinic / Attingo / HandyRetter - quote box in hero, prices on page, ratings by CTAs,
   guarantee block, sticky mobile call/WhatsApp/quote bar. */
:root{
  --ink:#0E1E2E; --ink-2:#33475B; --muted:#5E6F80; --line:#DCE3EA; --line-2:#C3CED8;
  --wash:#F3F6F9; --dark:#0E1E2E; --navy-2:#16304A;
  --copper:#E8620F; --copper-hover:#C9520A; --copper-bright:#FF8A3D;
  --ok:#1F9D57; --tp:#00B67A;
  --serif:'Inter',system-ui,sans-serif;
}
h1,h2,h3{font-family:var(--sans);font-weight:800;letter-spacing:-.025em}
h1{font-size:clamp(32px,4.4vw,52px);line-height:1.08}
h2{font-size:clamp(26px,3vw,36px)}
.tl-btn{font-weight:700;border-radius:8px;box-shadow:0 2px 0 rgba(0,0,0,.12)}
.tl-btn-lg{padding:17px 26px;font-size:17px}
.tl-btn-block{display:flex;width:100%}
.tl-center{text-align:center;margin-left:auto;margin-right:auto}
.tl-sec-head.tl-center{max-width:760px}
.tl-sec-dark{background:var(--dark);color:#E8EEF3}
.tl-sec-dark p{color:#B8C7D4}
.tl-sec-dark .tl-photo figcaption{color:#8FA3B5}
.tl-util{background:#08121C}

/* header */
.tl-head-phone{display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:17px;color:var(--ink);text-decoration:none;white-space:nowrap}
.tl-head-phone .tl-ic{color:var(--copper);width:20px;height:20px}

/* rating */
.tl-rating{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:15px;color:var(--ink-2);margin-bottom:18px}
.tl-sec-head.tl-center .tl-rating{justify-content:center}
.tl-tp-stars{display:inline-flex;gap:2px}
.tl-tp-stars i{font-style:normal;background:var(--tp);color:#fff;width:22px;height:22px;display:inline-grid;place-items:center;font-size:15px;line-height:1}
.tl-rating-dark{color:#C9D6E2}
.tl-rating-dark strong{color:#fff}

/* hero */
.tl-xhero{background:linear-gradient(rgba(10,22,34,.90),rgba(10,22,34,.94)),url("../img/microscope-wide.jpg") center/cover;color:#fff}
.tl-xhero-in{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:start;padding-top:52px;padding-bottom:56px}
.tl-xhero h1{color:#fff;margin-bottom:16px}
.tl-xhero h1 span{display:block;color:var(--copper-bright)}
.tl-xlede{font-size:19px;color:#C9D6E2;max-width:56ch}
.tl-usps{list-style:none;padding:0;margin:22px 0;display:grid;grid-template-columns:1fr 1fr;gap:10px 20px}
.tl-usps li{display:flex;align-items:center;gap:10px;font-weight:600}
.tl-usps .tl-ic{width:22px;height:22px;color:#fff;background:var(--ok);border-radius:50%;padding:4px;stroke-width:3}
.tl-xhero-call{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-top:26px}
.tl-xphone{display:inline-flex;align-items:center;gap:12px;color:#fff;text-decoration:none;font-size:24px;font-weight:800;letter-spacing:-.01em}
.tl-xphone:hover{color:#fff}
.tl-xphone small{display:block;font-size:13px;font-weight:600;color:#9FB2C4;letter-spacing:0}
.tl-xphone .tl-ic{width:44px;height:44px;padding:10px;border-radius:50%;background:var(--copper);color:#fff}
.tl-xwa{display:inline-flex;align-items:center;gap:8px;color:#fff;font-weight:700;text-decoration:none;border:1px solid #3B536B;border-radius:8px;padding:11px 16px}
.tl-xwa:hover{background:var(--navy-2);color:#fff}
.tl-xwa .tl-ic{color:#25D366}

/* quote box */
.tl-qbox{background:#fff;color:var(--ink);border-radius:12px;box-shadow:0 20px 50px rgba(0,0,0,.35);padding:24px;border-top:5px solid var(--copper)}
.tl-qbox-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.tl-qbox-head strong{font-size:20px;font-weight:800}
.tl-qbox-prog{font-size:13px;color:var(--muted);font-weight:600}
.tl-qlabel{font-weight:700;margin-bottom:12px}
.tl-qdev{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.tl-qdev-b{display:flex;align-items:center;gap:10px;text-align:left;background:#fff;border:1.5px solid var(--line-2);border-radius:10px;padding:14px;font:600 15px/1.25 var(--sans);color:var(--ink);cursor:pointer}
.tl-qdev-b:hover{border-color:var(--copper);background:#FFF5EE}
.tl-qdev-b .tl-dev-ic{width:28px;height:28px;color:var(--copper);flex:none}
.tl-qsym{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.tl-chip{border:1.5px solid var(--line-2);background:#fff;border-radius:999px;padding:9px 14px;font:600 14px var(--sans);color:var(--ink);cursor:pointer}
.tl-chip:hover{border-color:var(--copper)}
.tl-chip.on{background:var(--copper);border-color:var(--copper);color:#fff}
.tl-qfield{display:block;font:600 14px/1.3 var(--sans);margin-bottom:12px}
.tl-qfield input,.tl-qfield select,.tl-qfield textarea{display:block;width:100%;margin-top:6px;padding:11px 12px;border:1px solid var(--line-2);border-radius:8px;font:400 16px/1.4 var(--sans)}
.tl-qfield input:focus,.tl-qfield select:focus,.tl-qfield textarea:focus{outline:none;border-color:var(--copper);box-shadow:0 0 0 3px rgba(232,98,15,.2)}
.tl-qrow{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tl-qnav{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:6px}
.tl-qback{background:none;border:0;color:var(--muted);font:600 15px var(--sans);cursor:pointer;padding:10px 0}
.tl-qnav .tl-btn{flex:1}
.tl-qbox .tl-fine{margin:12px 0 0;text-align:center}
.tl-qbox .tl-form-msg{margin:10px 0 0}
.tl-qdone{text-align:center;padding:24px 8px}
.tl-qdone h3{font-size:24px}

/* proof bar */
.tl-proof{background:#fff;border-bottom:1px solid var(--line)}
.tl-proof-in{display:grid;grid-template-columns:repeat(4,1fr)}
.tl-proof-in > div{padding:22px 16px;text-align:center;border-left:1px solid var(--line)}
.tl-proof-in > div:first-child{border-left:0}
.tl-proof strong{display:block;font-size:20px;font-weight:800;color:var(--ink)}
.tl-proof span{font-size:14px;color:var(--muted)}

/* device cards */
.tl-devgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.tl-devcard{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:12px;padding:24px;text-decoration:none;color:var(--ink);background:#fff;transition:border-color .15s,box-shadow .15s,transform .15s}
.tl-devcard:hover{border-color:var(--copper);box-shadow:0 10px 26px rgba(14,30,46,.10);transform:translateY(-2px);color:var(--ink)}
.tl-devcard .tl-dev-ic{width:40px;height:40px;color:var(--copper);margin-bottom:14px}
.tl-devcard h3{font-size:21px;margin-bottom:6px}
.tl-devcard p{color:var(--muted);font-size:15px;flex:1}
.tl-devcard-go{font-weight:700;color:var(--copper);font-size:15px}

/* price cards */
.tl-pcards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:stretch}
.tl-pcard{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:14px;padding:28px}
.tl-pcard-hl{border:2px solid var(--copper);box-shadow:0 14px 34px rgba(232,98,15,.14)}
.tl-pcard-flag{position:absolute;top:-13px;left:24px;background:var(--copper);color:#fff;font-size:12px;font-weight:700;padding:5px 10px;border-radius:6px;text-transform:uppercase;letter-spacing:.04em}
.tl-pcard h3{font-size:20px;margin-bottom:6px}
.tl-pcard-price{font-size:36px;font-weight:800;letter-spacing:-.03em;margin:0 0 10px;color:var(--ink)}
.tl-pcard-price small{font-size:14px;font-weight:600;color:var(--muted);margin-left:6px;letter-spacing:0}
.tl-pcard-when{color:var(--ink-2);font-size:15px}
.tl-pcard ul{list-style:none;padding:0;margin:4px 0 22px;flex:1}
.tl-pcard li{padding:7px 0 7px 26px;border-top:1px solid var(--line);font-size:15px;position:relative}
.tl-pcard li::before{content:"\2713";position:absolute;left:2px;color:var(--ok);font-weight:800}

/* guarantee */
.tl-guarantee{display:flex;gap:24px;align-items:flex-start;background:#F0FAF4;border:2px solid #BFE6CF;border-radius:14px;padding:30px 34px}
.tl-guarantee > .tl-ic{width:56px;height:56px;color:var(--ok);flex:none;stroke-width:1.5}
.tl-guarantee h2{margin-bottom:6px}
.tl-guarantee-short{font-size:19px;font-weight:600;color:var(--ink)}

/* steps v3 */
.tl-steps li{border-top:4px solid var(--copper);background:#fff;padding:20px;border-radius:0 0 10px 10px;box-shadow:0 1px 0 var(--line)}
.tl-step-n{font-size:28px;font-weight:800;color:var(--copper)}

/* reviews v3 - cards */
.tl-reviews{grid-template-columns:repeat(3,1fr);gap:18px}
.tl-reviews figure{border:1px solid var(--line);border-left:1px solid var(--line);border-radius:12px;background:#fff;padding:22px}
.tl-reviews blockquote{font:500 16px/1.55 var(--sans)}
.tl-stars{color:var(--tp)}

/* gallery inside split */
.tl-split .tl-gallery{grid-template-columns:repeat(2,1fr);gap:12px;margin-top:20px}
.tl-split .tl-gallery figcaption{font-size:13px}

/* band */
.tl-band{background:var(--copper)}
.tl-band p{color:#FFE6D6}
.tl-band .tl-btn{background:#fff;color:var(--ink);border-color:#fff}
.tl-band .tl-btn:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.tl-band .tl-btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.6)}

/* mobile action bar */
.tl-mbar{display:none}
@media (max-width:1180px){
  .tl-head-phone{display:none}
}
@media (max-width:900px){
  .tl-xhero-in{grid-template-columns:1fr;padding-top:32px;gap:28px}
  .tl-proof-in{grid-template-columns:repeat(2,1fr)}
  .tl-proof-in > div:nth-child(3){border-left:0}
  .tl-proof-in > div{border-top:1px solid var(--line)}
  .tl-devgrid,.tl-pcards,.tl-reviews{grid-template-columns:1fr 1fr}
  .tl-pcards{gap:26px}
}
@media (max-width:640px){
  body{padding-bottom:64px}
  .tl-mbar{display:grid;grid-template-columns:1fr 1fr 1.3fr;position:fixed;left:0;right:0;bottom:0;z-index:60;background:#fff;border-top:1px solid var(--line);box-shadow:0 -6px 18px rgba(0,0,0,.08)}
  .tl-mbar a{display:flex;align-items:center;justify-content:center;gap:6px;padding:15px 6px;font-weight:700;color:var(--ink);text-decoration:none;font-size:15px}
  .tl-mbar .tl-ic{color:var(--copper)}
  .tl-mbar .tl-mbar-cta{background:var(--copper);color:#fff}
  .tl-usps{grid-template-columns:1fr 1fr;gap:8px 12px;font-size:14px;margin:16px 0 0}
  .tl-usps .tl-ic{width:18px;height:18px;padding:3px}
  .tl-xhero-call{display:none}
  .tl-xlede{font-size:17px}
  .tl-xhero .tl-rating{font-size:13px;margin-bottom:12px}
  .tl-xhero-in{padding-top:24px;padding-bottom:32px;gap:22px}
  .tl-xphone{font-size:21px}
  .tl-devgrid,.tl-pcards,.tl-reviews,.tl-qrow{grid-template-columns:1fr}
  .tl-qdev{grid-template-columns:1fr 1fr}
  .tl-qdev-b{flex-direction:column;align-items:flex-start;padding:12px;font-size:14px}
  .tl-guarantee{flex-direction:column;padding:24px}
  .tl-proof strong{font-size:17px}
}

/* v3 inner pages (2026-10-09) */
.tl-xcrumb{font-size:14px;color:#9FB2C4;margin:0 0 14px}
.tl-xcrumb a{color:#C9D6E2}
.tl-xhero-solo{grid-template-columns:1fr}
.tl-side-photo{margin-top:24px}
.tl-side-photo img{aspect-ratio:16/10}
.tl-ship{margin-top:28px;gap:24px}
.tl-sec-dark .tl-steps li{background:#16304A;box-shadow:none}
.tl-sec-dark .tl-steps h3{color:#fff}
.tl-sec-dark .tl-steps p{color:#C9D6E2}
.tl-sec-dark .tl-sec-head p{color:#C9D6E2}
.tl-twocol .tl-usps li{color:var(--ink)}

/* Language switcher (2026-10-09) */
.tl-lang{position:relative;flex:none}
.tl-lang-btn{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid var(--line-2);border-radius:8px;padding:8px 10px;font:700 14px/1 var(--sans);color:var(--ink);cursor:pointer}
.tl-lang-btn .tl-ic{width:18px;height:18px;color:var(--copper)}
.tl-lang-btn:hover{border-color:var(--ink)}
.tl-lang-menu{display:none;position:absolute;right:0;top:calc(100% + 6px);min-width:190px;list-style:none;margin:0;padding:6px;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 14px 34px rgba(14,30,46,.16);z-index:80}
.tl-lang.open .tl-lang-menu{display:block}
.tl-lang-menu a{display:flex;gap:10px;align-items:center;padding:10px 12px;border-radius:7px;color:var(--ink);text-decoration:none;font-size:15px}
.tl-lang-menu a:hover{background:var(--wash)}
.tl-lang-menu a[aria-current]{background:#FFF5EE;color:var(--copper);font-weight:600}
.tl-lang-menu b{display:inline-block;min-width:24px;font-size:12px;color:var(--muted)}
.tl-foot-langs a{margin-right:12px}
@media (max-width:1180px){
  .tl-head-in .tl-lang{margin-left:auto}
  .tl-head-in .tl-lang + .tl-head-cta{margin-left:0}
  .tl-head-cta{margin-left:0}
  .tl-burger{margin-left:0}
}
@media (max-width:640px){
  .tl-lang-btn{padding:8px}
}

/* Header fit across EN/NL/DE (2026-10-09): phone lives in the util bar below 1400px. */
@media (max-width:1400px){
  .tl-head-phone{display:none}
}
.tl-pcards{grid-template-columns:repeat(3,minmax(0,1fr))}
.tl-pcard{min-width:0;overflow-wrap:break-word;hyphens:auto}
.tl-pcard-price{font-size:clamp(28px,2.6vw,36px)}
.tl-devgrid,.tl-reviews{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:900px){.tl-pcards,.tl-devgrid,.tl-reviews{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.tl-pcards,.tl-devgrid,.tl-reviews{grid-template-columns:1fr}}