/*
Theme Name: Uw Brandmeldsysteem
Theme URI: https://uwbrandmeldsysteem.nl/
Author: Uw Brandmeldsysteem
Description: Eigen thema voor uwbrandmeldsysteem.nl: rood, zwart en wit, met zelf gehoste letters.
Version: 3.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: Eigendom van de opdrachtgever
Text Domain: uwbrandmeldsysteem
*/

@font-face{font-family:'Libre Franklin';font-style:normal;font-weight:400 900;font-display:swap;src:url('fonts/franklin-recht.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Atkinson Hyperlegible Next';font-style:italic;font-weight:200 800;font-display:swap;src:url('fonts/atkinson-cursief.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Atkinson Hyperlegible Next';font-style:normal;font-weight:200 800;font-display:swap;src:url('fonts/atkinson-recht.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

@font-face{font-family:'UBS Cijfers';font-style:normal;font-weight:400 900;font-display:swap;src:url('fonts/franklin-recht.woff2') format('woff2');unicode-range:U+0030-0039}

:root{
  --wit:#FFFFFF; --grijs:#F1F2F2; --lijn:#DADCDC; --rand:#8A8C8C;
  --inkt:#141414; --zacht:#454747; --stil:#5E6161;
  --rood:#C8102E; --rooddiep:#9F0C24; --zwart:#121212;
  --zwart-t:#C9CBCB; --zwart-s:#9B9E9E; --zwart-l:rgba(255,255,255,.14);
  --kop:"Libre Franklin","Franklin Gothic Medium","Arial Narrow",Arial,sans-serif;
  --tekst:"Libre Franklin","Franklin Gothic Book",Arial,sans-serif;
  --ub-max:1200px;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--wit);color:var(--inkt);font-family:var(--tekst);
  font-size:17.5px;line-height:1.6;-webkit-font-smoothing:antialiased}
b,strong{font-weight:700}
img{max-width:100%;height:auto}
a{color:var(--inkt);text-decoration:underline;text-decoration-thickness:1.5px;
  text-underline-offset:3px;text-decoration-color:var(--rood)}
a:hover{color:var(--rood)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,
textarea:focus-visible{outline:3px solid var(--rood);outline-offset:2px}
h1,h2,h3,h4{font-family:var(--kop);color:var(--inkt);line-height:1.08;
  overflow-wrap:break-word;hyphens:auto;-webkit-hyphens:auto}
h1{font-weight:800;font-size:clamp(34px,4.6vw,56px);letter-spacing:-.022em;
  hyphens:manual;-webkit-hyphens:manual}
h2{font-weight:750;font-size:clamp(26px,3vw,36px);letter-spacing:-.015em}
h3{font-weight:700;font-size:21px}
p{max-width:68ch}
.ubs-main,.ubs-main article{margin:0;padding:0}

.screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.screen-reader-text:focus{position:fixed;left:12px;top:12px;width:auto;height:auto;
  margin:0;overflow:visible;clip:auto;clip-path:none;background:var(--rood);
  color:#fff;padding:12px 18px;z-index:200;font-family:var(--kop);
  font-weight:700;text-decoration:none;font-size:16px}

.ubs-topregel{display:none}
.ubs-kop{position:sticky;top:0;z-index:60;padding:12px 24px 0;background:var(--zwart)}
.ubs-kop-rij{max-width:var(--ub-max);margin:0 auto;display:flex;align-items:center;gap:18px;
  min-height:64px;padding:0 10px 0 18px;background:#fff;border-radius:12px;flex-wrap:wrap}
.ubs-merk{display:flex;align-items:center;gap:11px;text-decoration:none;flex:0 0 auto;color:var(--inkt)}
.ubs-merk-stip{position:relative;width:30px;height:30px;flex:0 0 30px;background:var(--rood);border-radius:4px}
.ubs-merk-stip::before{content:"";position:absolute;inset:7px;background:#fff}
.ubs-merk-stip::after{content:"";position:absolute;left:12px;top:12px;width:6px;height:6px;border-radius:50%;background:var(--inkt)}
.ubs-merk b{font-family:var(--kop);font-weight:800;font-size:19px;letter-spacing:-.015em;white-space:nowrap}
.ubs-merk b span{display:none}
.ubs-menu{display:flex;align-items:center;gap:0;margin-left:auto;flex-wrap:wrap}
.ubs-menu a{display:block;padding:10px 11px;font-family:var(--kop);font-weight:600;font-size:16px;
  color:var(--inkt);text-decoration:none;white-space:nowrap;border-radius:4px}
.ubs-menu a:hover{background:var(--grijs);color:var(--inkt)}
.ubs-knop{display:inline-flex;align-items:center;background:var(--rood);color:#fff;font-family:var(--kop);
  font-weight:700;font-size:16px;padding:11px 18px;text-decoration:none;white-space:nowrap;border-radius:6px}
.ubs-knop:hover{background:var(--rooddiep);color:#fff}
@media(max-width:900px){.ubs-menu{display:none}.ubs-knop{margin-left:auto}}

.ubs-main{min-height:40vh}
.ubs-band{padding:clamp(56px,7vw,96px) 24px;background:var(--zwart);color:var(--zwart-t)}
.ubs-band h1{color:#fff}
.ubs-band a{color:#fff}
.ubs-smal{max-width:760px;margin:0 auto}
.ubs-smal>p{color:var(--zwart-t)}
.ubs-ooglid{font-family:var(--kop);font-size:15px;font-weight:700;color:#fff;margin:0 0 14px;
  display:inline-flex;align-items:center;gap:10px}
.ubs-ooglid::before{content:"";width:12px;height:12px;background:var(--rood)}
.ubs-herkomst{display:flex;flex-wrap:wrap;gap:6px 18px;padding:12px 0;margin:30px 0 0;
  border-top:1px solid var(--zwart-l);font-size:14.5px;color:var(--zwart-s)}
.ubs-herkomst b{color:#fff}

.ubs-voet{background:var(--zwart);color:var(--zwart-t);padding:56px 24px 48px;font-size:16px;
  border-top:6px solid var(--rood)}
.ubs-voet a{color:var(--zwart-t);text-decoration:none}
.ubs-voet a:hover{color:#fff;text-decoration:underline;text-decoration-color:var(--rood)}
.ubs-voet-net{max-width:var(--ub-max);margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:30px 24px}
@media(min-width:900px){.ubs-voet-net{grid-template-columns:repeat(4,minmax(0,1fr))}}
.ubs-voet-kop,.ubs-voet h4{font-family:var(--kop);color:#fff;font-size:17px;margin:0 0 12px;font-weight:800}
.ubs-voet ul{list-style:none;padding:0;margin:0}
.ubs-voet li{margin-bottom:6px}
.ubs-voet b{color:#fff}
.ubs-onderrand{max-width:var(--ub-max);margin:40px auto 0;padding-top:20px;border-top:1px solid var(--zwart-l);
  font-size:14.5px;color:var(--zwart-s);display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.ubs-voet-maker{max-width:var(--ub-max);margin:18px auto 0;font-size:14px;line-height:1.6;color:var(--zwart-t)}
.ubs-voet-maker a{color:var(--zwart-t);text-decoration:underline;text-decoration-color:var(--zwart-l);text-underline-offset:3px}
