/* "Let's talk": one component on every page (markup from tools/talk.py) */
.tk{background:#0E2A31;color:#fff;padding:clamp(56px,8vw,96px) 0}
.tk-in{max-width:1180px;margin:0 auto;padding-inline:16px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:end}
.tk .label{margin:0;font-size:13px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#C5D3D6}
.tk h2{margin:10px 0 0;font-family:'Goldman Sans Condensed',Figtree,'Segoe UI',Arial,sans-serif;font-weight:400;font-size:clamp(40px,5vw,60px);line-height:1.05;color:#fff}
.tk .lead{margin:14px 0 0;font-size:20px;color:#C5D3D6;max-width:34em}
.tk-c{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.tk-c li{display:flex;align-items:center;gap:14px;border:1px solid rgba(197,211,214,.22);border-radius:10px;padding:10px 14px;min-height:64px;box-sizing:border-box}
.tk-i{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:transparent;border:1.5px solid #F5BE1E;color:#F5BE1E}
.tk-t{display:grid;min-width:0}
.tk-k{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#C5D3D6}
.tk-v{font-variant-numeric:tabular-nums;font-size:20px;font-weight:600;color:#fff;text-decoration:none;overflow-wrap:anywhere}
.tk-v:hover,.tk-v:focus-visible{color:#F5BE1E}
.tk-cp{margin-left:auto;flex:none;min-height:40px;padding:6px 14px;border:1px solid #C5D3D6;border-radius:4px;background:transparent;color:#fff;font:600 14px/1 inherit;cursor:pointer}
.tk-cp:hover,.tk-cp:focus-visible{background:#F5BE1E;color:#0E2A31}
.tk-go{margin-left:auto;padding-right:6px;color:#C5D3D6;font-size:18px}
@media (max-width:900px){.tk-in{grid-template-columns:minmax(0,1fr);gap:28px}}
@media (max-width:520px){.tk-v{font-size:17px}.tk-c li{gap:10px;padding:10px}}

/* === One accent rule for the service pages (2.11.2026). MarketWatch / EnergyMonitor / Forward (body.mwp) keep their own look. ===
   petrol #0E2A31 = bands, backgrounds, headings, text links; taxi #F5BE1E = the only accent (hover, active); lines on dark = neutral */
body:not(.mwp){--pe:#0E2A31;--ld:rgba(255,255,255,.16)}
body:not(.mwp) .btn:hover,body:not(.mwp) .lh .btn:hover,body:not(.mwp) .dark .btn:hover,body:not(.mwp) .hero .btn:hover,
body:not(.mwp) .pctl .btn.ghost:hover,body:not(.mwp) .paths-go a:hover,body:not(.mwp) .paths-go a:focus-visible{background:var(--taxi);color:var(--b9)}
body:not(.mwp) a.card:hover,body:not(.mwp) .pclip:hover,body:not(.mwp) .ee-tabs button:hover,body:not(.mwp) .tile:hover,body:not(.mwp) .chip:hover,
body:not(.mwp) .opt:hover,body:not(.mwp) .set:hover,body:not(.mwp) .mod:hover{border-color:var(--taxi)}
body:not(.mwp) .ee-pts button:hover{border-top-color:var(--taxi)}
body:not(.mwp) .dark :focus-visible,body:not(.mwp) .hero :focus-visible,body:not(.mwp) .tk :focus-visible{outline-color:var(--taxi)}
body:not(.mwp) .tk-c li{border-color:rgba(255,255,255,.16)}
body:not(.mwp) .tk-i{background:transparent;border:1.5px solid var(--taxi);color:var(--taxi)}
body:not(.mwp) .tk-cp:hover,body:not(.mwp) .tk-cp:focus-visible{background:var(--taxi);color:var(--b9)}
/* one footer on every service page */
.foot,.sitefoot{background:#0E2A31;border-top:1px solid rgba(255,255,255,.16);padding:18px 16px;font-size:13px;color:#C5D3D6;font-family:Figtree,system-ui,sans-serif}
.foot .in,.sitefoot .in{width:100%;box-sizing:border-box;max-width:1180px;margin:0 auto;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.foot a,.sitefoot a{color:#C5D3D6}
