/* Reset */
html{line-height:1.15;-webkit-text-size-adjust:100%}
body,html,h1,h2,h3,h4,h5,h6,figure,video,ul,ol,li,menu{margin:0;padding:0;}
[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}
[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}
[type=button]:-moz-focusring,[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}
::-webkit-input-placeholder{color:#fff;}:-moz-placeholder{color:#fff;}::-moz-placeholder{color:#fff;}:-ms-input-placeholder{color:#fff;}
*{text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;outline:none !important;box-sizing:border-box;-webkit-box-sizing:border-box;}
a{text-decoration:none;}
a,input[type="submit"],.btn{transition:0.2s;}
input,textarea,select,button,a{padding:0;color:inherit;font:inherit;letter-spacing:inherit;background:transparent;border-radius:0;-webkit-border-radius:0;}
form input:not([type="select"]):not([type="file"]),form textarea{border: 1px solid #fff;padding: 10px 14px;border-radius: 20px;max-width: 100%;}
input[type="submit"]{cursor:pointer;}
img,.btn{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;}
figure img,figure video,figure iframe{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;z-index:1;}
figure{position:relative;}
figure:after{content:'';pointer-events:none;position:absolute;z-index:0;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.15);}
img{border-style:none;vertical-align:top;max-width:100%;height:auto;pointer-events:none;}
a img{pointer-events:all;}
::-webkit-media-controls{display:none !important;}
video{pointer-events:none;}
svg,video{vertical-align:top;}
p:empty{display:none;}
p:first-child{margin-top:0;}
p:last-child{margin-bottom:0;}
::selection{background:rgba(222,222,222,0.3);}
::-moz-selection{background:rgba(222,222,222,0.3);}
.center{text-align:center;margin:0 auto;}
.center-flex{justify-content:center;}
.slide video,.slide img{object-fit:cover;height: 100%;width: 100%;}
.flex{display:flex;}
.flex-col{flex-direction:column;}
.flex-wrap{flex-wrap:wrap;}
.space-between{justify-content:space-between;}
.grey{color:#9D9D9D;}


body{background:black;font-family:'Inter';color:white;font-size:15px;}
#content{min-height:100vh;display:flex;flex-direction:column;}
#main{flex:1;}
.mobile{display:none;}
h1,.font-24{font-size:24px;line-height:1.25;}
h1,h2,h3,h4{font-weight:400;}
.font-12{font-size:12px;line-height: 1.3;}
.font-11{font-size:11px;line-height: 1.3;}
.paragraph{line-height:1.5;}

/* Animations */
.animate{transition:all 0.75s cubic-bezier(.2,.9,.45,1);-webkit-transition:all 0.75s cubic-bezier(.2,.9,.45,1);transform:translate3d(0,25px,0);-webkit-transform:translate3d(0,25px,0);opacity:0;}
.animated{transform:translate3d(0,0,0);-webkit-transform:translate3d(0,0,0);opacity:1 !important;}

/* Header */
header .container{display:flex;justify-content:space-between;align-items:center;padding: 0 !important;max-width: none;}
.menu{display:flex;font-size:18px;text-transform:uppercase;gap: 2rem;padding-right: 50px;}
.menu li{list-style:none;}
.menu li a{border-bottom:2px solid transparent;padding-bottom:7px;}
.menu .current-menu-item a,
.menu li a:hover{border-bottom:2px solid #38B6FF;}


/* Home */
.home header{opacity: 0;transform: translateY(-100px);}
.home .video{padding:10px 0 60px;opacity:0;}
.home .video video{width:100%;height:calc(100vh - 244px);min-height:400px;}


/* About */
.container-narrow .font-24{margin-bottom:1rem;margin-top: -6px;}
.container-narrow{padding-top:80px;}
.p-about .description{max-width:470px;}
.awards{margin: 3rem -8px;}
.award{margin-bottom:1.5rem;padding: 0;}
.award-inner{align-items: center;text-transform: uppercase;}
.award-inner img{padding-right: 16px;flex: 1 0 49px;}
.award-inner span{flex: 1 1 100%;}


/* Services */
.description li{margin-bottom:2rem;}
.p-services .description{padding-bottom:80px;}

/* Contact */
.p-contact main .container{padding: 0 200px 50px;}
.p-contact main .col-4{padding-left:40px;}
.p-contact h1{margin-bottom:3rem;}
.form {
    width: 350px;
    max-width: 100%;
}
.wpcf7-form-control-wrap{display:block;}
.wpcf7-form-control-wrap input{width:200px;}
.address{margin-top:3rem;}

/* Projects */
.projects-index{padding-top: 80px;padding-bottom: 100px;}
.cats{flex-wrap:wrap;gap: 18px 22px;margin: 0 auto;margin-bottom: 3rem;max-width: 960px;justify-content: center;}
.cat{border-bottom:2px solid transparent;padding-bottom: 2px;font-size: 22px;white-space:nowrap;}
.cat.active,.cat:hover{border-color:#38B6FF;}
.projects-index .post{margin-bottom:40px;}
.post a{display:block;position:relative;}
.post a:after{content:'';width:100%;height:100%;top:0;left:0;z-index:1;pointer-events:none;background:rgba(0,0,0,0.7);display:block;position:absolute;opacity:0;transition:0.5s;}
.post h2{position:absolute;top:50%;left:50%;z-index:2;transform:translate(-50%,-50%);text-align:center;width: 100%;padding: 0 20px;opacity: 0;pointer-events: none;transition:0.5s;}
.post a:hover h2,.post a:hover:after{opacity:1;}
.single .container-narrow{max-width: 900px;}
.vid-thumbnail{margin:2rem 0;position:relative;cursor:pointer;}
.vid-thumbnail .play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2;}
.project-bottom{margin-top:2rem;}
.function{margin-bottom:1rem;}
.single .awards{margin-top:2rem;}

/* --- modal base --- */
modal {
  display: flex;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.82);
  z-index: 9999;
  padding: clamp(16px, 6vw, 80px);
  align-items: center;
  justify-content: center;
  /* animation states */
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.5s ease, visibility 0s linear 0.5s;
}

modal.open {
  opacity: 1;
  visibility: visible;
  transition: opacity 0.5s ease;
}

#video .video-container {
  position: relative;
  width: 100%;
  max-width: 1200px;
}
#video .video-container::before {
  content: "";
  display: block;
  padding-bottom: 56.25%; /* 16:9 ratio */
}
#video .video-container iframe,
#video .video-container embed,
#video .video-container object {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* close button */
#video .modal-close {
  position: fixed;
  top: 0;
  right: 10px;
  font-size: 50px;
  font-weight: 200;
  line-height: 1;
  background: transparent;
  color: #fff;
  border: 0;
  cursor: pointer;
  padding: .25rem .5rem;
}

/* lock page scroll when modal is open */
html.modal-open, body.modal-open { overflow: hidden; }



/* Footer */
.footer{border-top:2px solid white;padding:20px 0;}
.socials{gap:12px;margin-right: 120px;}
.socials a{border:1px solid white;border-radius:100%;width:28px;height:28px;justify-content:center;align-items:center;display:flex;flex:0 0 auto;}
.socials a:hover{border-color:#38B6FF;background:#38B6FF;}


.otgs-development-site-front-end{display:none;}


#main {margin-top: 50px;}

.container{max-width: 1440px;}

.projects-index {
    padding-top: 0;
    padding-bottom: 100px;
}
.container-narrow {
    padding-top: 0px;
}




.footer {position: relative;}
.copyrights {position: absolute; right: 0;}
body {  font-family: "DM Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;}
.home p {font-size: 22px; text-align: center; margin-top: 16px;}
.home .opening-heading {text-align: center;}
.home h1{font-size:35px;}
.about-description p {font-size: 18px; }
.awards {
    margin: 3rem 20px;
    justify-content: center;
}
.p-about .paragraph {
 
    margin-top: 1em;
}
.p-services .description {font-size: 18px;}



@media (max-width:1200px){
  .container,.container-narrow{padding-left:32px !important;padding-right:32px !important;}
  .menu{padding-right:32px;}
  .p-services .col-4{-ms-flex-preferred-size: 83.3333%;flex-basis: 83.3333%;max-width: 83.3333%;}
  .p-contact .col-4{margin:0 auto;}
}

@media (max-width:960px){
  #main {margin-top: 0px;}
  .projects-index .post{-ms-flex-preferred-size: 50%;flex-basis: 50%;max-width: 50%;}
}

@media (max-width: 800px){

  body{line-height:1.4;}

  .desktop{display:none;}

  .container,.container-narrow{padding-left:20px !important;padding-right:20px !important;}
  .menu{padding-right: 0;flex-direction: column;text-align: center;padding-top: 120px;}
  
  .footer{flex-direction:column;}
  .footer-left{width:100%;justify-content:space-between;margin-bottom:1rem;flex-direction:column;}
  .footer-left .col:nth-child(3){order:4;margin-top:14px;}
  .footer-left .copyrights{margin-top:14px;}
  .footer-left .col{
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    max-width: 100%;
    width: 100%;
  }

  .p-about .container-narrow > .row{flex-direction:column;}

  .p-about .container-narrow > .row .col-2,
  .p-about .container-narrow > .row .col-4{
    margin-bottom:2rem;
    width: 100%;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    max-width: 100%;
  }

  #menu{position: absolute;visibility: hidden;pointer-events: none;transform: translate(0,-100%);top: 0;left: 0;width: 100%;height: 100vh;background: black;transition: 0.3s;}
  .menu-open #menu{transform:translate(0,0);pointer-events:all;visibility:visible;z-index: 2;}
  .home p{font-size:20px;}
  .home .video{padding:0;margin: -20px -20px 0px;}
  .home main{padding-top: 10px;}
  .home .opening-heading,
  .home p{text-align: left !important;max-width: 300px;}
  .home h1{font-size:24px;}
  
  .p-contact main .row{flex-direction:column-reverse;}
  .p-contact main .col{
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    max-width: 100%;
    width: 100%;
  }

  header{min-height: 120px;z-index: 2;}
  .logo{position:absolute;top: 0;z-index: 3;}
  .menu-trigger{cursor: pointer;top: 28px;width: 36px;height: 24px;display:flex;flex-direction: column;justify-content: space-between;position: absolute;right: 20px;z-index: 3;}
  .menu-trigger span{width:100%;height:2px;background:white;transition:0.25s;position:relative;}
  .menu-open .menu-trigger span:nth-child(1){transform:rotate(45deg);top:11px;}
  .menu-open .menu-trigger span:nth-child(2){opacity:0;}
  .menu-open .menu-trigger span:nth-child(3){transform:rotate(-45deg);top:-11px;}

  .p-about main .col{
    width: 100%;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    max-width: 100%;
    margin-bottom: 30px;
  }

  .about-description p{font-size:14px;line-height: 20px;}

  .awards{width: 100%;flex-direction:column;display: block;margin: 0 0 40px;}
  .awards .award{
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    max-width: 100%;
    width: auto;
  }

  modal{padding:0;}
  
  .home .video video{height:auto;min-height:0;display: block;}
  .socials{margin: 0 0 15px;gap: 8px;}
  .copyrights{position:relative;right: auto;padding-left: 10px;}
  .socials a{transform:scale(0.9);}


  .project-bottom > .col{
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    max-width: 100%;}

  .description li{margin-left:10px;}

  .p-services .description{font-size:14px;line-height:20px;padding-bottom: 20px;}

  .p-contact h1{margin-bottom:20px;}
  .wpcf7-form-control-wrap input,
  .wpcf7-form-control-wrap textarea{width:100%;max-width: 350px !important;}
  
  .footer{
    padding: 12px 0 20px;
}

.home .video .desktop {display: none;}
.menu-item-wpml-ls-3-en a {display: block;}

ul .wpml-ls-menu-item a {
    display: inline-block;
  
}

}


@media (max-width:600px){
  .projects-index{padding-top: 10px;padding-bottom:40px;}

  .cats{gap: 16px 8px;}
  .cat{font-size:16px;}
  .container-narrow{padding-top: 20px;}
  .projects-index .post,.p-services .col-4{-ms-flex-preferred-size: 100%;flex-basis: 100%;max-width: 100%;}
  .p-services .container-narrow > .row{flex-direction:column;}
  .p-services .container-narrow > .row > .col:first-child{margin-bottom:1rem;}
  .p-contact .col-4{margin:initial;padding: 0 !important;margin: 0 0 20px !important;}
}