@-ms-viewport{
  width: device-width;
}
html{box-sizing: border-box;
  -ms-overflow-style: scrollbar;}
*,*::before,*::after{box-sizing: inherit;}
.container{width: 100%;
  padding-right: 30px;
  padding-left: 30px;
  margin-right: auto;
  margin-left: auto;}
@media (min-width: 576px){.container{max-width: 540px;}
}
@media (min-width: 768px){.container{max-width: 720px;}
}
@media (min-width: 992px){.container{max-width: 960px;}
}
@media (min-width: 1200px){.container{max-width: 1140px;}
}
.row{display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-right: -30px;
  margin-left: -30px;}
.qcol-lg-4,.qcol-lg-5,.qcol-lg-6,.qcol-lg-7,.qcol-lg-8,.qcol-lg-9,.qcol-lg-12{position: relative;
  width: 100%;
  min-height: 1px;
  padding-right: 30px;
  padding-left: 30px;}
@media (min-width: 992px){.qcol-lg-4{-ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;}
.qcol-lg-5{-ms-flex: 0 0 41.666667%;
    flex: 0 0 41.666667%;
    max-width: 41.666667%;}
.qcol-lg-6{-ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;}
.qcol-lg-7{-ms-flex: 0 0 58.333333%;
    flex: 0 0 58.333333%;
    max-width: 58.333333%;}
.qcol-lg-8{-ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;}
.qcol-lg-9{-ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;}
.qcol-lg-12{-ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;}
}
.align-items-center{-ms-flex-align: center !important;
  align-items: center !important;}
body,textarea{font-family: 'Roboto', sans-serif;
    font-size: 16px;
    line-height: 25px;
    padding: 0;
    margin: 0;}
a,li{-webkit-tap-highlight-color: transparent}
h1,h2,h3,h4,h5,h6,p{margin: 0;}
p{margin: 0;}
p + p{margin-top: 10px;}
h1{font-size: 35px;
    line-height: 40px}
h2{font-size: 25px;
    line-height: 30px}
h1 + p,h2 + p,h3 + p,h4 + p,h2 + h4,h1 + h4,h2 + ul.qglyph-list,h3 + ul.qglyph-list,p + h3,p + .qbtn,p + h4,h4 + .qbtn,h4 + input,h4 + select,h4 + textarea,p + ul.qglyph-list,p + table,p + pre,p + img,img + p,p + .row,.row + p,p + .qcard,p + ul.qglyph-list,.container > .row + .row,.container > div + p,.container > div + .qbtn,h4 + div,h4 + ul,h4 + ul.qglyph-list,h4 + a,.qdeflist + .qbtn,p + .qdeflist{margin-top: 15px;}
.qbtn:not(.full-width) + .qbtn:not(.full-width){margin-left: 15px;}
.hidden{display: none !important;}
.text-uppercase{text-transform: uppercase;}
.align-right{text-align: right;}
.qpanel{padding: 30px;
    border-radius: 3px;}
body,header h2,::placeholder{color: #6fa6d7;}
h1,h2,h3,h4,h5,h6,.qbtn.qbtn-border,.qglyph-list span,.qglyph-list span a,a,.qnav-cnt > ul > li a{color: #379cf4;}
.qglyph-line li:before,.qglyph-line span:before{background-color: #379cf4;}
.qbtn{background-color: #379cf4;
    border-color: #379cf4;}
.qbtn-border:hover,nav.active .qnav-btn{color: #3081c8;}
.qbtn:not(.qbtn-border):hover,.qnav-cnt > ul > li:hover > a{background-color: #3081c8;}
.qbtn:hover{border-color: #3081c8;}
.qstep > span,.qfoot-bar,.qnav-cnt.active{border-color: #c3dff7;}
.qstep:before,body hr:not([class*=qgap]){background-color: #c3dff7;}
.qcard.qsurface .qcap,footer,main > section.qband-base.qband-color,.qpanel{background-color: #EAF5FC;}
.light,.light h1,.light h2,.light h3,.light h4,.light h5,.light h6,.light p,.light .qbtn a,.light .qbtn:hover,nav.light a{color: #FFF !important;}
.qband-image .qpanel{background-color: #FFF;}
.qband-color .qpanel{background-color: #FFF !important;}
.light .qbtn-border{color: #FFF !important;
    border-color: #FFF !important;}
.light p a:hover{opacity: .7;}
[class^="qglyph-"]:before,[class*=" qglyph-"]:before{font-family: "Quorum Glyphs";
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    speak: none;
    text-transform: none;}
main > section{margin: 0;
    padding: 0;
    position: relative;
    overflow: hidden;}
main > section.qband-base{background-color: #FFF;}
main > section > .container{padding-top: 100px;
    padding-bottom: 100px;}
.qflush > .container{padding-top: 0;
    padding-bottom: 0;}
.qband-image{background-size: cover;
    background-position: center center;}
body > nav{z-index: 995;
    position: relative;
    background-color: #FFF;}
body > nav > .container{height: 100%;
    min-height: 50px;}
nav:not(.qnav-transparent) .qnav-cnt > ul > li:hover > a{color: #FFF;}
@media (min-resolution: 192dpi) and (min-width: 994px), (-webkit-min-device-pixel-ratio: 2) and (min-width: 994px){.qmark{display: none !important;}
}
body > nav .qnav-brand{float: left;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 0;
    z-index: 9999;
    position: relative;}
body > nav .qnav-brand > a{height: 100%;}
body > nav .qnav-brand img{max-height: 100%;
    display: block;}
.qnav-btn{display: none;
    width: 30px;
    height: 30px;
    font-style: normal;
    position: absolute;
    right: 30px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 30px;
    line-height: 30px;}
.qnav-btn:before{content: "\64";
    font-family: "Quorum Glyphs";
    position: absolute;
    left: 0;
    text-transform: none;}
.qnav-cnt{position: relative;}
.qnav-cnt > ul{float: left;
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    margin-left: 30px;}
.qnav-cnt > ul > li > a{height: 50px;
    line-height: 50px;
    padding: 0 15px;
    font-size: 13px;
    display: block;}
.qnav-cnt ul > li > a{text-decoration: none;
    transition: all .5s, height 0s, line-height 0s;}
.qnav-cnt > ul > li a{font-weight: 500;
    text-decoration: none;
    text-align: left;}
nav.light h5{color: #4C4C4C;}
.qnav-cnt li > a{position: relative;}
.qnav-cnt li:hover > a:after{opacity: 1;}
nav.align-right .qnav-cnt{display: flex;
    justify-content: flex-end;}
nav.align-right .qnav-cnt{float: none;}
nav.qnav-fixed{position: fixed;
    right: 0;
    left: 0;
    top: 0;}
.qnav-fixed:not(.qnav-transparent) + header,.qnav-fixed:not(.qnav-transparent) + main{margin-top: 50px;}
.title{position: relative;
    margin-bottom: 50px;}
.title > p{margin-top: 15px;}
.row > div > .title:last-child{margin-bottom: 0;}
body > header{position: relative;
    display: flex;
    align-items: center;
    height: 350px;
    overflow: hidden;}
body > header > .container{position: relative;
    z-index: 5;}
body > header h1{font-size: 30px;
    font-weight: 600;
    margin: 0;}
body > header h2{margin: 20px 0 0 0;
    font-size: 18px;
    font-weight: 400;}
hr.qgap,hr.qgap-xs,hr.qgap-sm,hr.qgap-lg{border: none;
    clear: both;
    margin: 0;}
hr.qgap-xs{height: 15px;}
hr.qgap-sm{height: 30px;}
hr.qgap{height: 60px;}
hr.qgap-lg{height: 100px;}
span.qgap,span.qgap-xs,span.qgap-sm,span.qgap-lg{display: inline-block;}
span.qgap-xs{width: 15px;}
span.qgap-sm{width: 30px;}
span.qgap{width: 60px;}
span.qgap-lg{width: 100px;}
hr:not([class*=qgap]){height: 1px;
    border: none;
    background: #dadada;
    margin: 30px 0;}
.qbtn{color: #fff;
    border-radius: 3px;
    display: inline-block;
    text-decoration: none;
    border-style: solid;
    border-width: 1px;
    position: relative;
    cursor: pointer;
    outline: none;
    text-align: center;
    transition: all .5s;}
.qbtn-sm{padding: 10px 30px;
    font-size: 15px;}
.qbtn-border,body .qbtn-border{background: none;}
.qbtn + .qbtn{margin-top: 15px;}
.qdeflist,.qdeflist li{list-style: none;
    position: relative;
    padding: 0;
    margin: 0;}
.qdeflist li{transition: all .5s;}
.qdeflist-line li{display: flex;
    margin-bottom: 5px;}
.qdeflist-line p span{padding-left: 15px;}
.qdeflist-line li b{margin-right: 5px;
    white-space: nowrap;}
.qdeflist-line label{text-transform: none;
    font-weight: normal;
    font-style: normal;
    display: inline;}
.qdeflist-line li p{margin: 0 5px;
    white-space: nowrap;
    overflow: visible;}
.qdeflist-line li{justify-content: qgap-between;
    height: 26.5px;}
.qdeflist-line li hr{width: 100%;
    margin-top: 16px;
    border-top: 1px dotted;
    background: none;
    opacity: .8;}
.qglyph-list p{margin: 0;
    display: inline;}
.qglyph-list li > i{position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);}
ul.qglyph-list{list-style: none;
    padding: 0;
    margin: 0;}
ul.qglyph-list li{position: relative;
    list-style: none;
    padding-left: 30px;
    margin-bottom: 10px;}
ul.qglyph-list li:last-child{margin-bottom: 0;}
.qglyph-line li > i{display: none;}
.qglyph-line li:before,.qglyph-line span:before{content: "";
    position: absolute;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    transition: all .5s;}
.qglyph-line li:before,.qglyph-line span:before{border-radius: 3px;
    height: 2px;}
.qglyph-line li:hover:before,.qglyph-line span:hover:before{transform: translateY(-50%) translateX(5px);}
.qsteps{display: grid;
    grid-gap: 30px;
    grid-template-columns: 1fr 1fr 1fr;}
.qsteps > div{grid-template-columns: 1fr 1fr 1fr;}
.qstep{position: relative;}
.qstep > .content{position: relative;
    padding-top: 60px;}
.qstep > .content > *:first-child{margin-top: 0;}
.qstep > span{position: absolute;
    width: 30px;
    height: 30px;
    line-height: 30px;
    border-style: solid;
    border-width: 1px;
    border-radius: 50%;
    text-align: center;
    font-size: 14px;
    display: block;
    font-weight: 600;
    background: #FFF;}
.qstep:before{content: "";
    position: absolute;
    width: 100%;
    height: 1px;
    top: 14px;}
img{max-width: 100%;
    display: inline-block;}
.qmesh-item{padding: 0;
    margin: 0;
    min-width: 0;
    position: relative;}
.qmesh-item img{display: block;}
.qmesh-box{display: grid;
    grid-gap: 30px;}
[data-columns='1'] > div,.qsteps[data-columns='1']{grid-template-columns: 1fr;}
[data-columns='2'] > div,.qsteps[data-columns='2']{grid-template-columns: 1fr 1fr;}
[data-columns='3'] > div,.qsteps[data-columns='3']{grid-template-columns: 1fr 1fr 1fr;}
[data-columns='4'] > div,.qsteps[data-columns='4']{grid-template-columns: 1fr 1fr 1fr 1fr;}
[data-columns='5'] > div,.qsteps[data-columns='5']{grid-template-columns: 1fr 1fr 1fr 1fr 1fr;}
[data-columns='6'] > div,.qsteps[data-columns='6']{grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;}
footer > .container{padding-top: 80px;
    padding-bottom: 80px;}
.qfoot-bar{border-top-style: solid;
    border-top-width: 1px;}
.qfoot-bar > .container{padding-top: 15px;
    padding-bottom: 15px;
    font-size: 12px;
    letter-spacing: .5px;}
.qfoot-bar > .container > span:last-child{float: right;}
footer a{text-decoration: none;}
i.qtop-btn{position: fixed;
    bottom: 15px;
    right: 15px;
    width: 35px;
    height: 35px;
    display: none;
    box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.17);
    border-radius: 50%;
    background: #FFF;
    text-align: center;
    cursor: pointer;
    z-index: 999995;
    transition: all .5s;}
i.qtop-btn:hover{margin-bottom: 5px;}
i.qtop-btn.show{display: block;}
i.qtop-btn:before{font-family: "Quorum Glyphs";
    font-style: normal;
    font-weight: normal;
    transform: rotate(90deg);
    content: "\68";
    position: absolute;
    left: 0;
    right: 0.5px;
    font-size: 22px;
    line-height: 32px;
    text-transform: none;}
@keyframes ken-burn-in{
    0% {
        transform: scale(1.2);
    }

    100% {
        transform: scale(1);
    }
}
@keyframes rotate{
    0% {
        transform: rotate(0);
    }

    100% {
        transform: rotate(20deg);
    }
}
@keyframes scale{
    0% {
        transform: scale(1);
    }

    100% {
        transform: scale(1.2);
    }
}
@keyframes scale-rotate{
    0% {
        transform: scale(1) rotate(0);
    }

    100% {
        transform: scale(1.2) rotate(4deg);
    }
}
@keyframes fadein{
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}
@keyframes fadeleft{
    0% {
        opacity: 0;
        transform: translateX(-100px);
    }

    100% {
        opacity: 1;
        transform: translateX(0);
    }
}
@keyframes faderight{
    0% {
        opacity: 0;
        transform: translateX(100px);
    }

    100% {
        opacity: 1;
        transform: translateX(0);
    }
}
@keyframes fadetop{
    0% {
        opacity: 0;
        transform: translateY(-100px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}
@keyframes fadebottom{
    0% {
        opacity: 0;
        transform: translateY(100px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}
@keyframes pulse{
    from {
        transform: scale(1);
        transform-origin: center center;
        animation-timing-function: ease-out;
    }

    10% {
        transform: scale(0.91);
        animation-timing-function: ease-in;
    }

    17% {
        transform: scale(0.98);
        animation-timing-function: ease-out;
    }

    33% {
        transform: scale(0.87);
        animation-timing-function: ease-in;
    }

    45% {
        transform: scale(1);
        animation-timing-function: ease-out;
    }
}
@keyframes pulse-horizontal{
    16.65% {
        transform: translateX(8px);
    }

    33.3% {
        opacity: 1;
        transform: translateX(-6px);
    }

    49.95% {
        transform: translateX(4px);
    }

    66.6% {
        transform: translateX(-2px);
    }

    83.25% {
        transform: translateX(1px);
    }

    100% {
        transform: translateX(0);
    }
}
@keyframes show-scale{
    0% {
        opacity: 0;
        transform: scale(0);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}
@keyframes ping{
    0% {
        transform: scale(0.2);
        opacity: 0.8;
    }

    80% {
        transform: scale(1.2);
        opacity: 0;
    }

    100% {
        transform: scale(2.2);
        opacity: 0;
    }
}
img-pulse img{transition: all .5s;}
@media (max-width: 991.98px){[class*=qcol-lg-] + [class*=qcol-lg-]{margin-top: 30px;}
[data-columns-md='1'] > div{grid-template-columns: 1fr;}
[data-columns-md='2'] > div{grid-template-columns: 1fr 1fr;}
[data-columns-md='3'] > div{grid-template-columns: 1fr 1fr 1fr;}
[data-columns-md='4'] > div{grid-template-columns: 1fr 1fr 1fr 1fr;}
body > nav{height: 50px;}
body > nav .qnav-brand{max-width: calc(100% - 60px);}
body > nav .qnav-brand > a{display: flex;
        align-items: center;}
body > nav > .container{max-width: 100%;}
.qnav-btn{display: block;
        z-index: 9999;}
.qnav-cnt > ul > li > a{padding: 0 30px;}
.qnav-cnt{height: 0;
        overflow: hidden;
        position: absolute;
        top: 100%;
        background: #FFF;
        left: 0;
        width: 100%;
        transition: height .5s;
        display: block;}
nav.light .qnav-cnt a{color: rgb(68, 68, 68) !important;}
nav.align-right .qnav-cnt{display: block;}
nav.active .qnav-cnt{box-shadow: 0px 4px 3px rgba(0, 0, 0, 0.08);
        z-index: 9995;}
body > nav.qnav-fixed .qnav-cnt{overflow-y: scroll;}
.qnav-cnt > ul{float: none;
        display: block;
        width: 100%;
        height: auto;}
.qnav-cnt > ul{margin: 0;}
i.qtop-btn{display: block;}
.qfoot-bar > .container > span:last-child{float: none;}
}
@media (max-width: 767.98px){[class*=col-]:not([class*=col-sm]) + [class*=col-]:not([class*=col-sm]){margin-top: 30px;}
.qfull-sm + .qfull-sm{margin-top: 15px !important;}
.qfull-sm{width: 100% !important;}
.qbtn:not(.full-width) + .qbtn.qfull-sm{margin-left: 0;}
[data-columns-sm='1'] > div{grid-template-columns: 1fr;}
[data-columns-sm='2'] > div{grid-template-columns: 1fr 1fr;}
[data-columns-sm='3'] > div{grid-template-columns: 1fr 1fr 1fr;}
[data-columns-sm='4'] > div{grid-template-columns: 1fr 1fr 1fr 1fr;}
}
@media (max-width: 575.98px){.qbtn-sm{padding: 5px 20px;
        font-size: 14px;}
.qsteps{grid-template-columns: 1fr;}
}
.qcard{position: relative;
    overflow: hidden;}
.qcard .qcap h2{font-size: 20px;
    margin-top: 0;
    margin-bottom: 15px;}
.qcard .qcap h3{font-size: 15px;}
.qcard .qcap p{font-size: 15px;
    margin: 0;}
.qcard .qcap .qbtn{margin-top: 15px;}
.qcard.qsurface{border-radius: 3px;}
.qcard.qsurface .qcap{padding: 30px;}
.qcard.align-right .qcap{text-align: right;}
.qband-color .qcard.qsurface .qcap{background-color: #FFF;}
body,p,a,.qglyph-list span,.qglyph-list span a,a,.qnav-cnt > ul > li a{color: rgb(64, 77, 96);}
body > nav,footer,i.qtop-btn,.qbtn:not(.qbtn-border):hover,section .qcard.qsurface.light .qcap,.qnav-fixed.scroll-menu,.qnav-cnt > ul > li:hover > a,main > section.qband-base.qband-color.light{background-color: rgb(0, 71, 103);}
.qpanel.light{background-color: rgb(0, 71, 103) !important;}
h1,h2,h3,h4,h5,h6,.qstep > span,.qdeflist-line li b{color: rgb(0, 71, 103);}
.qbtn:hover{border-color: rgb(0, 71, 103);}
.qbtn.qbtn-border:hover,.qbtn.qbtn-border.active{color: rgb(0, 71, 103);
    border-color: rgb(0, 71, 103);}
.qbtn:not(.qbtn-border).active{background-color: rgb(0, 71, 103);
    border-color: rgb(0, 71, 103);}
@media (max-width: 991.98px){nav .qnav-cnt > ul > li > a{color: rgb(0, 71, 103);}
nav.light .qnav-cnt a{color: rgb(0, 71, 103) !important;}
}
::placeholder{color: rgb(75, 134, 161);}
.qnav-cnt > ul > li:hover > a,.qglyph-list li > i,.qbtn.qbtn-border,.title p,nav:not(.qnav-transparent) .qnav-cnt > ul > li:hover > a,nav.active .qnav-btn,body > header h2{color: #03BFCB}
footer.light a,nav.light .qnav-cnt > ul > li:hover > a,.light .title p,body > header.light h2,.qaccent{color: #03BFCB !important;}
footer .qglyph-list li:before,.qnav-cnt > ul > li:hover > a,.qband-color.light .qbtn:not(.qbtn-border):hover,.qglyph-line li:before,.qglyph-line span:before{background-color: #03BFCB}
.qbtn{background-color: #03BFCB;
    border-color: #03BFCB;}
.qnav-cnt > ul li ul li:hover + li > a,.light .qdeflist-line li hr{border-color: #03BFCB}
main > section.qband-base.qband-color{background-color: rgb(228, 237, 243);}
.qnav-cnt > ul > li > a,.qnav-cnt,i.qtop-btn,footer .qdeflist-line li b,.light .qdeflist-line li b,.qnav-btn{color: #FFF;}
footer.light ul li > a{color: #FFF !important;}
.qnav-cnt > ul > li:hover > a{background-color: transparent;}
.qnav-cnt > ul > li > a:first-child{background-color: transparent;}
.qcard.qsurface .qcap,.qpanel{background-color: rgb(255, 255, 255);}
.qwide{min-width: 190px;}
.qpanel{box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);}
.qmesh-list.qpanel{padding: 0;
    border-radius: 3px;
    box-shadow: none;
    background: none !important;}
.qmesh-list.qpanel > div{grid-gap: 15px;}
.qmesh-list.qpanel .qmesh-item{box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);}
@media (min-width: 994px) and (max-width: 1200px){.qband-home-one p{font-size: 13px;}
.qband-home-one li h1{font-size: 37px;
        line-height: 49px;}
}
body,textarea{font-family: 'Quorum Sans', system-ui, sans-serif;
    line-height: 30px;
    font-size: 14px;
    font-weight: 500;}
button{font-family: 'Quorum Sans', system-ui, sans-serif;}
h1,h2{font-weight: 900;}
h1{font-size: 45px;
    line-height: 65px;}
h1 + p,h2 + p,h3 + p,h4 + p,h2 + h4,h1 + h4,h2 + ul.qglyph-list,h3 + ul.qglyph-list,p + h3,p + .qbtn,p + h4,h4 + .qbtn,h4 + input,h4 + select,h4 + textarea,p + ul.qglyph-list,p + table,p + pre,p + img,p + .row,p + .qcard,p + ul.qglyph-list,.container > .row + .row,.container > div + p,p + .qdeflist,.container > div + .qbtn,h4 + div,h4 + ul,h4 + ul.qglyph-list,h4 + a,h3 + .qmesh-list,.qdeflist + .qbtn{margin-top: 30px;}
h3 + h1{margin-top: 10px;}
[class*=qcol-lg-] > h3,.qpanel > h3,.container > h3{text-transform: uppercase;
    font-weight: 900;
    font-size: 21px;}
.container > h2{line-height: 37px;}
.row{margin-right: -15px;
    margin-left: -15px;}
.qcol-lg-4,.qcol-lg-5,.qcol-lg-6,.qcol-lg-7,.qcol-lg-8,.qcol-lg-9,.qcol-lg-12{padding-right: 15px;
    padding-left: 15px;}
[class*=col-lg] > img{border-radius: 3px;}
@media (min-width: 992px){.qnav-classic .qnav-cnt > ul > li > a{height: 65px;
        line-height: 65px;}
}
body > nav .qnav-brand{height: 65px;}
@keyframes anima-menu-down{
    0% {
        opacity: 0;
        top: -100%;
    }

    100% {
        top: 0;
        opacity: 1;
    }
}
.qnav-fixed.scroll-menu{opacity: 1;
    top: 0;
    transition: opacity .5s, top .5s;
    animation: anima-menu-down 2s;}
.qnav-cnt > ul > li a{font-weight: 600;}
.qnav-cnt > ul > li > a{font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;}
.qnav-cnt > ul > li a{transition: all .3s;}
body > header{height: 250px;}
body > header h1{text-transform: uppercase;
    font-size: 45px;
    line-height: 55px;
    margin-bottom: 10px;
    font-weight: 900;}
body > header h2{text-transform: uppercase;
    font-weight: 700;
    margin: 0;
    font-size: 14px;}
.qfoot-bar{border-color: rgba(255, 255, 255, 0.15);}
footer h3{text-transform: uppercase;
    font-size: 18px;
    font-weight: 900;}
footer p,footer .qglyph-list li{opacity: .8;}
footer .qglyph-list li{margin-bottom: 1px;}
footer .qcol-lg-4:last-child{background: rgba(0, 0, 0, 0.11);
    padding: 30px;
    border-radius: 3px;}
.qcol-lg-6 > p + .qglyph-line{margin-top: 20px;}
.qcol-lg-6 > p + .qglyph-line li{margin-bottom: 2px;}
.qdeflist-line li hr{margin-top: 19px;}
@keyframes qbtn-text-anima{
    0% {
        right: -30px;
        opacity: 0;
    }

    60% {
        right: -40px;
        opacity: 1;
    }

    100% {
        right: -45px;
        opacity: 0;
    }
}
.qbtn{font-weight: 600;}
.qbtn:hover{box-shadow: 0 12px 24px -10px rgba(21, 59, 93, 0.46);
    transform: scale(.95);}
button.qbtn-sm{line-height: 30px;}
.qcard.qsurface{box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
    transition: all .5s;}
.qcard .qcap p{font-size: 14px;}
.qcard .qcap h2{font-weight: 700;
    line-height: 35px;}
.qcard.qsurface:hover{box-shadow: 0 15px 15px rgba(0, 0, 0, 0.15);
    transform: translateY(-5px);}
.title{display: flex;
    flex-direction: column-reverse;
    margin-bottom: 30px;}
.title p{text-transform: uppercase;
    font-weight: 700;
    margin: -2px 0 2px 0;}
.title h2{font-size: 28px;
    line-height: 40px;}
.qstep > .content > h3{margin-bottom: 15px;
    font-size: 16px;}
.qstep:before{background-color: rgba(19, 48, 74, 0.22);}
.qstep > span{box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
    border: 1px solid rgb(214, 226, 234);
    font-weight: 700;}
@media (max-width: 1199.98px){.qcol-lg-4 .qpanel .qdeflist-line li{display: block;
        height: auto;}
.qcol-lg-4 .qpanel .qdeflist-line li p{margin-left: 0;}
.qcol-lg-4 .qpanel .qdeflist-line hr{display: none;}
}
@media (max-width: 991.98px){body > nav{height: 65px;}
body > nav .qnav-brand{padding: 15px 0;}
footer h3 + p,footer h3 + p + div,footer h3 + div,footer h3 + ul.qglyph-list{margin-top: 15px;}
footer .qcol-lg-4 + .qcol-lg-4,footer [class*=col-]:not([class*=col-sm]) + [class*=col-]:not([class*=col-sm]){margin-top: 45px;}
footer .qcol-lg-4:last-child{margin: 0 15px;
        max-width: calc(100% - 30px);
        overflow: hidden;}
}
@media (max-width: 767.98px){.qcard .qcap h2{line-height: 30px;
        font-size: 19px;}
body > header h1{font-size: 36px;
        line-height: 50px;}
}
@media (max-width: 575.98px){h1{font-size: 33px;
        line-height: 45px;}
body > header h1{font-size: 35px;
        line-height: 45px;}
[class*=qcol-lg-] > h3,.qpanel > h3,.container > h3{font-size: 18px;}
}
@media (max-width: 425px){.qcol-lg-4 .qdeflist-line li{display: block;
        height: auto;}
.qcol-lg-4 .qdeflist-line li p{margin-left: 0;}
.qcol-lg-4 .qdeflist-line hr{display: none;}
body > header h1{font-size: 25px;
        line-height: 35px;}
body,textarea,.qcard .qcap p{font-size: 13px;}
.qdeflist{font-size: 14px;}
}
/* ================================================================
   Doplnky Quorum — pisma, ikony a drobne upravy nad ramec sablony.
   Pise se jeste v puvodnim pojmenovani trid, build ho prejmenuje
   stejnym prevodem jako zbytek CSS.
   ================================================================ */

@font-face {
    font-family: 'Quorum Sans';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url(../fonts/quorum-sans-ext.woff2) format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: 'Quorum Sans';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url(../fonts/quorum-sans.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: "Quorum Glyphs";
    src: url(../fonts/quorum-glyphs.woff) format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}

body, p, a, li, div, span, b, input, button {
    font-family: 'Quorum Sans', system-ui, sans-serif;
}

html {
    scroll-behavior: smooth;
}

section[id] {
    /* hlavicka je od TASK-100 jednoradkova (qnav-classic, ~50 px) */
    scroll-margin-top: 70px;
}

/* --- znacka v hlavicce ------------------------------------------- */

/* logo sedi primo v radku qnav (qnav-classic, CEO 21. 8. 2026) —
   mensi svisle odsazeni, aby znacka vyuzila vysku radku.
   TASK-104 (druhe kolo): "logo v hlavicce vetsi, tohle je hrozne male"
   — 34 px -> 48 px, s 8px odsazenim presne vyplni 65px radek qnav. */
body > nav .qnav-brand {
    padding: 8px 0;
}

.qnav-brand img {
    height: 48px;
    width: auto;
    display: block;
    /* znacka je tmave modra, hlavicka tmava — v hlavicce ji vedeme v bile */
    filter: brightness(0) invert(1);
}

/* --- kontakty v hlavicce: piste a volejte pod sebou (TASK-100) -----
   TASK-104: CEO chce oba radky mensi a vic k sobe — 13 -> 12 px,
   line-height 1.8 -> 1.45. */

@media (min-width: 992px) {
    .qnav-cnt > ul > li.nav-contact {
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding-left: 15px;
    }

    .qnav-cnt > ul > li.nav-contact > a {
        height: auto;
        line-height: 1.45;
        padding: 0;
        font-size: 12px;
        text-transform: none;
    }

    .qnav-cnt > ul > li.nav-contact > a span {
        color: #fff;
        font-weight: 700;
        padding-right: 5px;
    }
}

/* --- mezera mezi uvodnim odstavcem a kartami oboru ----------------- */

#co-delame .title {
    margin-bottom: 18px;
}

/* patickovy pruh nese jednu vetu — bez druheho sloupce by odplula doprava */
.qfoot-bar span {
    float: none;
}

/* --- ctyri kroky pres celou sirku ---------------------------------- */

.qsteps {
    grid-template-columns: repeat(4, 1fr);
}

@media (max-width: 991.98px) {
    .qsteps {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 575.98px) {
    .qsteps {
        grid-template-columns: 1fr;
    }
}

/* --- kontaktni formular (TASK-094) ---------------------------------
   Vlastni, minimalisticke tridy s prefixem "q" — sablona zadny formular
   vlastniho vzhledu nema zapojeny v cssFiles (build.mjs), theme.css
   contact-form.css se sem netahne. */

/* TASK-104: formular byl moc roztazeny na vysku — mensi svisle mezery
   a nizsi textarea, aby se cely vesel vedle uvodniho textu kontaktu. */
.qform-field {
    margin-bottom: 12px;
}

.qform-field label {
    display: block;
    font-weight: 700;
    margin-bottom: 4px;
}

.qform-field input[type="text"],
.qform-field textarea {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid #c7d3da;
    border-radius: 4px;
    font-size: 15px;
    box-sizing: border-box;
}

.qform-field textarea {
    min-height: 88px;
    resize: vertical;
}

.qform-error {
    display: none;
    color: #b3261e;
    font-size: 13px;
    margin: 6px 0 0;
}

.qform-field--error input,
.qform-field--error textarea {
    border-color: #b3261e;
}

.qform-field--error .qform-error {
    display: block;
}

.qform-consent label {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-weight: 400;
}

.qform-consent input[type="checkbox"] {
    margin-top: 4px;
    flex: 0 0 auto;
}

.qform-status {
    font-size: 14px;
    margin: 4px 0 10px;
}

.qform-status:empty {
    display: none;
}

.qform-status--ok {
    color: #1a7f37;
}

.qform-status--error {
    color: #b3261e;
}

.qform-status--warn {
    color: #8a5a00;
}

.qform-hint {
    margin-top: 10px;
    font-size: 14px;
    color: #556;
}

/* --- fakta v panelu ----------------------------------------------- */

.qpanel p.fact {
    margin-bottom: 18px;
}

.qpanel p.fact b {
    display: block;
    margin-bottom: 2px;
}

/* --- uvodni blok -------------------------------------------------- */

/* Fotka v pozadi (TASK-101): stock z Pexels, zpracovava obrazky.mjs —
   mobil 960 px, desktop 1920 px, WebP s JPG zalohou (prvni radek
   background-image je fallback pro prohlizece bez image-set). Tmavy
   filtr je v quorum.a11y.css (.qband-home-one::before); worst-case
   kontrast bileho textu nad nejsvetlejsim pixelem fotky je zmereny
   v obrazky.mjs — pri zmene fotky nebo filtru pustit znovu. */
.qband-home-one {
    background-size: cover;
    background-position: center;
    background-image: url(../img/hero-960.jpg);
    background-image: image-set(url(../img/hero-960.webp) type("image/webp"), url(../img/hero-960.jpg) type("image/jpeg"));
}

@media (min-width: 992px) {
    .qband-home-one {
        background-image: url(../img/hero-1920.jpg);
        background-image: image-set(url(../img/hero-1920.webp) type("image/webp"), url(../img/hero-1920.jpg) type("image/jpeg"));
    }
}

.qband-home-one h1 {
    font-size: 46px;
    line-height: 1.15;
    margin: 0 0 24px 0;
}

.qband-home-one h3 {
    letter-spacing: 1.5px;
    font-size: 13px;
    margin-bottom: 18px;
}

.qband-home-one p {
    max-width: 640px;
    font-size: 17px;
    line-height: 1.7;
}

/* --- tematicke ikony karet Co delame (TASK-104) ---------------------
   Druhe kolo CEO 21. 8.: ikony zpet, ale tematicke (rikaji, o cem karta
   je) a NE v levem rohu nad textem — sedi v jednom radku s nadpisem
   karty, svisle vycentrovane, jako soucast titulku. Dekorativni jsou
   jen napul: informaci nese nadpis vedle, proto aria-hidden. */
.qbox-topic {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}

.qbox-topic svg {
    flex: 0 0 auto;
    box-sizing: border-box;
    width: 42px;
    height: 42px;
    padding: 9px;
    color: #006672;
    background: rgba(3, 191, 203, .12);
    border-radius: 10px;
}

.qcard.qsurface .qcap .qbox-topic h2 {
    margin-bottom: 0;
}

/* --- karty stejne vysoke ------------------------------------------
   TASK-103 (treti kolo CEO): "obdelniky nemaji vzdy bily background
   az dolu, pokud je vedle delsi text." Bile pozadi karty nese .qcap
   (skin: .qcard.qsurface .qcap), ne .qcard — height: 100% na
   .qcard natahl jen neviditelny obal, pozadi koncilo s obsahem.
   Flex sloupec necha .qcap vyplnit celou vysku karty; radek mrizky
   urcuje nejvyssi bunka, ostatni dorostou pozadim za ni. Plati na
   vsech sirkach (v 1 sloupci flex nic nemeni). */

.qmesh-list .qmesh-item > .qcard {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.qmesh-list .qmesh-item > .qcard > .qcap {
    flex: 1 1 auto;
}

/* --- karty situaci ------------------------------------------------ */

.qcard.qsurface .qcap h2 {
    font-size: 19px;
    line-height: 1.45;
    margin-bottom: 14px;
}

/* --- panely ------------------------------------------------------- */

.qpanel {
    padding: 34px;
}

.qpanel h3 {
    margin-bottom: 18px;
}

.qpanel .qdeflist li p {
    margin: 0;
}

/* --- paticka ------------------------------------------------------ */

footer .qglyph-list li a {
    line-height: 2.1;
}

/* provozovatel pod kontakty (presun z Napiste nam, TASK-100).
   TASK-104: mene vyrazny — mensi pismo, tlumenejsi bila. Barva NENI
   odhad: rgba(255,255,255,.78) nad navy patickou #004767 slozi
   ~rgb(199,214,221), kontrast 6,6:1 (nad limitem 4,5:1); axe to meri
   znovu pri kazdem overeni. */
footer p.fact {
    margin-top: 18px;
    font-size: 12.5px;
    line-height: 1.6;
    color: rgba(255, 255, 255, .78);
}

footer p.fact b {
    display: block;
    margin-bottom: 2px;
    font-weight: 600;
    color: rgba(255, 255, 255, .78);
}

.qfoot-bar span {
    line-height: 1.8;
}

/* --- mobil -------------------------------------------------------- */

@media (max-width: 991.98px) {
    /* rozbalena nabidka — vysku jinak dopocitava skript sablony, ktery nepouzivame */
    nav.active .qnav-cnt {
        height: auto;
        max-height: calc(100vh - 70px);
        overflow-y: auto;
        padding-bottom: 20px;
    }

    .qnav-cnt > ul > li > a {
        line-height: 3.2;
    }

    /* dlouhe hodnoty v seznamech se na mobilu lamou pod popisek */
    .qdeflist-line li p {
        display: block;
        float: none;
        text-align: left;
        white-space: normal;
        margin: 4px 0 0 0;
    }

    .qdeflist-line li hr {
        display: none;
    }

    .qband-home-one h1 {
        font-size: 32px;
    }

    .qband-home-one p {
        font-size: 16px;
    }

    .qnav-brand img {
        /* TASK-104: vetsi logo i na mobilu (28 -> 36 px) */
        height: 36px;
    }

    .qpanel {
        padding: 26px;
    }
}

/* ================================================================
   Pristupnost — pridano pri priprave spusteni webu (viz dokumentace
   docs/02-vyvoj/web-quorum-build.md, kod ulohy v zaznamu KB).

   Pripojuje se AZ PO prevodu trid v build.mjs (krok 5b), takze pise uz
   ve financich nazvech (q*) a nemuze dojit k druhemu, nechtenemu
   prevodu stejnych retezcu.

   Hodnoty NEJSOU odhad — kazda barva je overena kontrolnim vypoctem
   WCAG kontrastu (2.1) proti SKUTECNE vykreslenemu pozadi zmerenemu
   axe-core, ne proti puvodni definici v sablone. Sablona ma pro tyz
   text nekolikrat protichudnou definici barvy v ruznych blocich a
   poradi jejich vyhodnoceni je rucne tezko sledovatelne — proto merit,
   ne odhadovat, a proto !important tam, kde jinak vitezi jina definice
   se stejnou specificitou o par radku niz.
   ================================================================ */

/* --- kontrast textu, WCAG 1.4.3 (min. 4.5:1) ----------------------
   Zmereno axe-core pred zasahem:
   - ".title p" (popisky nad kazdym nadpisem): #03bfcb na bilem/svetlem
     pozadi = 2,25:1, na pruhu #e4edf3 dokonce 1,9:1.
   - ".qbtn" (plna tlacitka CTA, e-mailovy odkaz v kontaktech): bily
     text na #03bfcb = 2,25:1.
   - telefonni odkaz v navigaci: #03bfcb na tmave navy #004767 = 4,44:1,
     tesne pod pozadovanym pomerem.
   Noven ton tealu ma na nejsvetlejsim pouzitem pozadi (#e4edf3) rezervu
   nad limitem (5,6:1), aby drobne odchylky vykreslovani nerozhodovaly. */
.title p {
    color: #006672 !important;
}

.qbtn:not(.qbtn-border) {
    background-color: #006672 !important;
    border-color: #006672 !important;
}

/* Kontaktni odkazy v hlavicce (od TASK-100 dva pod sebou: piste + volejte,
   trida .nav-contact misto puvodni qnav-tel). Maji dve zcela odlisna pozadi
   podle sirky: na desktopu sedi v tmave navy liste (potrebuji svetly text),
   na mobilu se ale oteviraji v bilem rozbalovacim panelu (qnav-cnt) — tam by
   stejna svetla barva byla skoro neviditelna. Desktopovy teal #2ecbd6 je na
   navy #004767 overeny nad 4,5:1 (puvodni mereni pro qnav-tel plati dal,
   pozadi se nezmenilo); mobil dostava navy z mobilniho pravidla skinu, na
   bilem panelu s rezervou nad limitem. */
@media (min-width: 992px) {
    .nav-contact > a {
        color: #2ecbd6 !important;
    }
}

/* --- viditelny fokus, WCAG 2.4.7 -----------------------------------
   Sablona na nekolika mistech rusi outline (outline: none) a fokus tak
   neni videt vubec. Vraceno explicitne pro klavesnicove ovladani. */
a:focus-visible,
button:focus-visible,
[tabindex]:focus-visible,
.qbtn:focus-visible,
.qnav-btn:focus-visible {
    outline: 3px solid #006672 !important;
    outline-offset: 2px;
}

/* uvnitr tmave navigace a paticky by tmavy outline splynul s pozadim */
body > nav :focus-visible,
footer :focus-visible {
    outline-color: #fff !important;
}

/* --- skip link, WCAG 2.4.1 ------------------------------------------
   Prvni prvek v tab poradi. Viditelny az pri fokusu, do te doby mimo
   viditelnou plochu (ne display:none — ten by ho vyradil z tab poradi). */
.skip-link {
    position: absolute;
    left: -9999px;
    top: 0;
    z-index: 100000;
    background: #004767;
    color: #fff;
    padding: 12px 22px;
    font-weight: 700;
    border-radius: 0 0 8px 0;
    text-decoration: none;
}

.skip-link:focus {
    left: 0;
}

/* --- tlacitko mobilniho menu -----------------------------------------
   Puvodne dekorativni <i>, bez klavesnice nedosazitelne (WCAG 2.1.1).
   Nahrazeno skutecnym <button> (viz index.src.html) — tady jen reset
   vychoziho vzhledu prohlizece, aby zustal identicky puvodnimu <i>. */
button.qnav-btn {
    background: none;
    border: 0;
    margin: 0;
    font: inherit;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
}

/* --- uvodni sekce — text na fotografii ------------------------------
   Nadpis a eyebrow lezi primo na fotografii (assets/img/hero.jpg) bez
   jakekoli podkladove vrstvy v puvodni sablone — kontrast tak zavisel
   na tom, co zrovna je pod textem, a nedal se zarucit. Tmavy prechod
   pod textem zarucuje citelnost bez ohledu na obsah fotky; nemeni text
   ani rozlozeni. */
.qband-home-one {
    position: relative;
}

.qband-home-one::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(100deg, rgba(0, 20, 40, .86) 0%, rgba(0, 20, 40, .74) 50%, rgba(0, 20, 40, .62) 100%);
    pointer-events: none;
}

.qband-home-one > .container {
    position: relative;
    z-index: 1;
}

.qband-home-one h1,
.qband-home-one p,
.qband-home-one .qaccent {
    color: #fff !important;
}

/* Obrysove tlacitko (telefon v uvodu) melo navy text na navy scrimu —
   prakticky neviditelne. Nad tmavym prechodem musi byt svetle. */
.qband-home-one .qbtn.qbtn-border,
.qband-home-one .qbtn.qbtn-border:hover,
.qband-home-one .qbtn.qbtn-border.active {
    color: #fff !important;
    border-color: #fff !important;
}

/* --- odkaz v patickovem pruhu, WCAG 1.4.3 a 1.4.1 (TASK-094) --------
   Puvodni patickovy pruh nesl jen prosty text — az TASK-094 do nej pridal
   odkaz na zasady zpracovani udaju (footer-bar span a[href]). Sablona ma
   pravidlo "footer.light a { color: #03BFCB !important; }" (skin.css) —
   TENTYZ teal, ktery je uz vyse v tomto souboru zdokumentovany jako pod
   4,5:1 na svetlych i tmavych pozadich. Specificita "footer.light a" je
   (0,1,2); ".qfoot-bar a" samotne ma jen (0,1,1) a prohrava i s !important
   (zmereno axe-core — puvodni pokus bez "footer" v selektoru nezabral).
   Proto "footer .qfoot-bar a" se stejnou specificitou (0,1,2), ktere vyhraje
   poradim v souboru (quorum.a11y.css se pripojuje az za skin.css). */
footer .qfoot-bar a {
    color: #fff !important;
    text-decoration: underline;
}

/* --- respekt k nastaveni "omezit animace" ---------------------------- */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}
