/* CWP theme: colours, font, header and footer of control-webpanel.com (theme cwp2026) */
@font-face{font-family:"Inter";font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/inter-latin.woff2) format("woff2")}
:root{--navy:#0b1d33;--navy-2:#13304f;--navy-line:#1f3d61;--blue:#1d5fbf;--red:#c8202f;--red-dark:#a91a27;
 --bg:#f3f5f9;--card:#fff;--line:#e1e7ef;--line2:#eef2f7;--text:#172233;--mut:#5d6b7e;--pri:#c8202f;--pri-d:#a91a27;--link:#1d5fbf;--head:#0b1d33;--r:16px;
 --font:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}
body.cwp{font-size:16px;line-height:1.6}
body.cwp a:hover{color:var(--red);text-decoration:none}
.wrap{max-width:1240px;margin:0 auto;padding:0 24px}
.cwp .btn{font-weight:700;border-radius:11px;padding:12px 20px;transition:transform .15s,background .15s}
.cwp .btn:hover{transform:translateY(-1px)}
.btn-red{background:var(--red);color:#fff}.btn-red:hover{background:var(--red-dark);color:#fff!important}
.cwp header.top .btn-ghost{border-color:#2c4870;color:#fff;background:transparent}.cwp header.top .btn-ghost:hover{background:var(--navy-2);color:#fff!important}
.ico{width:18px;height:18px;flex:none}
/* header */
.cwp header.top{background:var(--navy);position:sticky;top:0;z-index:50;border-bottom:1px solid #172f4d}
.cwp header.top .wrap{display:flex;align-items:center;gap:28px;height:70px}
.cwp .brand{display:flex;align-items:center;gap:11px;color:#fff}
.mark{width:40px;height:40px;border-radius:10px;background:var(--red);color:#fff;font-weight:800;font-size:13px;letter-spacing:.5px;display:flex;align-items:center;justify-content:center;flex:none}
.cwp .brand b{display:block;font-size:16px;line-height:1.15}
.cwp .brand small{display:block;color:#9fb3cc;font-size:12px;font-weight:400}
nav.main{display:flex;align-items:center;gap:2px;flex:1;padding:0}
nav.main a{color:#c3d1e3;font-size:14px;font-weight:500;padding:9px 11px;border-radius:8px}
nav.main a:hover{color:#fff;background:var(--navy-2)}
.top-cta{display:flex;gap:10px;align-items:center}
.top-cta .btn{padding:10px 16px;font-size:14px}
.burger{display:none;margin-left:auto;background:none;border:1px solid #2c4870;border-radius:9px;width:44px;height:44px;color:#fff;cursor:pointer;place-items:center}
.mnav{display:none;background:var(--navy);border-top:1px solid #172f4d;padding:10px 24px 18px}
.mnav.open{display:block}
.mnav a{display:block;color:#d6e3f3;padding:11px 0;border-bottom:1px solid #172f4d;font-weight:500}
.mnav .btn{margin-top:14px;justify-content:center;display:flex}
/* client sub navigation */
.subnav{background:#fff;border-bottom:1px solid var(--line)}
.subnav .wrap{display:flex;gap:4px;align-items:center;height:52px;overflow-x:auto}
.subnav a{color:var(--text);font-weight:600;font-size:14px;padding:8px 12px;border-radius:8px;white-space:nowrap}
.subnav a:hover{background:var(--line2);color:var(--text)}
.subnav .who{margin-left:auto;color:var(--mut);font-size:13px;white-space:nowrap}
.cwp main{padding-top:36px;padding-bottom:20px;min-height:55vh}
.cwp h1{font-size:30px;letter-spacing:-.7px;font-weight:800;color:var(--navy)}
.cwp .card{border-radius:var(--r);padding:26px}
.cwp .card.narrow{margin:40px auto}
.cwp .tile{border-top-color:var(--red)}
/* footer */
.cwp footer{background:var(--navy);color:#9fb3cc;margin-top:96px;padding:56px 0 26px;font-size:14px}
.fcols{display:grid;grid-template-columns:1.4fr repeat(4,minmax(0,1fr));gap:32px;padding-bottom:32px;border-bottom:1px solid #1c3352}
.fcols h4{color:#fff;margin:0 0 14px;font-size:14px}
.fcols ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.fcols a{color:#9fb3cc}.fcols a:hover{color:#fff}
.fdesc{margin-top:16px;max-width:300px}
.cwp footer .fsupport{margin-top:6px;padding:10px 16px;font-size:14px;border-radius:10px;color:#fff}
.fbottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding-top:20px;font-size:13px}
.fbottom>span{display:flex;flex-wrap:wrap;align-items:center;gap:18px}
.fbottom a{color:#c3d1e3}
.cwp .langs a.on{color:#fff}
@media(max-width:1020px){nav.main,.top-cta{display:none}.burger{display:grid}.fcols{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.fcols{grid-template-columns:1fr}.cwp h1{font-size:25px}.wrap{padding:0 16px}}
.acc-switch{position:relative;font-size:14px}.acc-switch summary{cursor:pointer}.acc-switch[open] form{display:block;background:#fff;padding:4px 10px}
.subnav a.on{background:var(--line2);color:var(--text);box-shadow:inset 0 -3px 0 var(--red,#c8202f)}.subnav .who.on{color:var(--text);font-weight:600}
/* buttons that are links keep their own text colour on hover (body.cwp a:hover turns links red) */
body.cwp a.btn:hover{color:#fff}body.cwp a.btn.btn-ghost:hover{color:var(--text)}body.cwp header.top a.btn-ghost:hover{color:#fff}
.store-tabs a{font-weight:600}.cwp .store-tabs a.on{border-color:var(--red);color:var(--red)}