@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;700;900&family=Outfit:wght@300;400;600;800&display=swap');

:root {
  --primary-color: #0b0b0b;
  --accent-color: #44ff06;
  --hover-blue: #7ba4db;
  --hover-gray: #8c8c8c;
  --text-dark: #121212;
  --text-light: #f5f5f5;
  --text-muted: #828282;
  --bg-light: #f9f9f9;
  --bg-dark: #111111;
  --transition-speed: 0.3s;
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  font-family: 'Inter', sans-serif;
  background-color: var(--bg-light);
  color: var(--text-dark);
  line-height: 1.6;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

a {
  color: inherit;
  text-decoration: none;
}

ul {
  list-style: none;
}

/* Custom layout helper classes */
.container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

.back-box .back-to-top a .bg-img {
  -webkit-transform:rotate(90deg);transform:rotate(90deg);background-repeat:no-repeat;background-position:center top;margin:10px auto;display:block
}

.back-box .back-to-top a .bg-img svg {
  width:12px
}

.back-box .back-to-top a:hover .bg-img svg .a {
  stroke:#44ff06
}

.row.heading .categroies ul li.current-item a {
  border-bottom:2px solid #44ff06
}

.row.heading .filter .filter-section,.row.heading .filter .rollover {
  position:absolute;z-index:999;right:0;padding:0;max-width:1180px;left:0
}

.row.heading .filter .filter-section .arrow-up {
  width:18px;height:12px;-webkit-transform:rotate(180deg);transform:rotate(180deg)
}

.row.heading .filter .rollover {
  width:100%;height:auto;background:rgba(255,255,255,.8);top:45px;display:none;margin:0 auto
}

.row.heading .filter .rollover ul {
  margin:0 auto;width:calc(100% - 40px);max-width:1180px;height:auto;padding:20px;list-style:none;display:-webkit-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;-webkit-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;-webkit-flex-wrap:wrap;flex-wrap:wrap
}

.row.heading .filter .rollover ul {
  width:calc(100% - 50px)
}

.row.heading .filter .rollover ul li {
  width:100%
}

.row.heading .filter .rollover ul li a {
  color:#000;width:100%;text-decoration:none;font-size:14px;line-height:32px;letter-spacing:.03em;-webkit-transition:.5s ease 0s;transition:.5s ease 0s
}

.row.heading .filter .rollover ul li a:hover,.row.heading .filter .rollover ul li.current-item a {
  color:#44ff06
}

.row.heading .filter .rollover .text {
  -webkit-box-sizing:border-box;box-sizing:border-box;width:100%;-webkit-transition:all .6s cubic-bezier(.2,0,.35,1);transition:all .6s cubic-bezier(.2,0,.35,1)
}

.row.heading .filter .rollover .text.show {
  opacity:1;-webkit-transform:translateY(0);transform:translateY(0)
}

.row.heading .filter .rollover .text.hide {
  opacity:0;-webkit-transform:translateY(30px);transform:translateY(30px)
}

.row.heading .filter .rollover .background {
  -webkit-transition:opacity .6s cubic-bezier(.2,0,.35,1);transition:opacity .6s cubic-bezier(.2,0,.35,1)
}

.row.heading .filter .rollover .background.show {
  opacity:1
}

.row.heading .filter .rollover .background.hide {
  opacity:0
}

body header .nav-menu .container .nav .current-menu-item a,body header .nav-menu .container .nav .current-menu-item a:hover {
  border-bottom:2px solid #44ff06
}

body header .background__container,body header .owl-item,body header .owl-stage,body header .owl-stage-outer {
  width:100%;height:100%
}

body header .owl-item {
  pointer-events:none
}

body header .owl-item.active {
  pointer-events:auto
}

body header .header .not-found h2.white-bg,body header .header .text-header h2.white-bg {
  color:#00f202
}

body header .header .not-found .href a span .button.white-bg,body header .header .not-found .href a span.white-bg,body header .header .text-header .href a span .button.white-bg,body header .header .text-header .href a span.white-bg {
  color:#000
}

body header .header .not-found .href a span .button .svg.white-bg path,body header .header .text-header .href a span .button .svg.white-bg path {
  fill:#000;stroke:none;-webkit-transition:.5s ease 0s;transition:.5s ease 0s
}

body header .header .not-found .href a span .button .svg.white-bg polygon,body header .header .text-header .href a span .button .svg.white-bg polygon {
  fill:#000;stroke:#000;stroke-width:1px;-webkit-transition:.5s ease 0s;transition:.5s ease 0s
}

body .content .row .image .background.bgfixedremove,body .content .row-black .image .background.bgfixedremove,body .content .row-grey .image .background.bgfixedremove {
  background-attachment:initial
}

body .content .row .projects.projects-home .block .box a .item,body .content .row-black .projects.projects-home .block .box a .item,body .content .row-grey .projects.projects-home .block .box a .item {
  width:100%;height:100%
}

body .content .row .projects.projects-home .block .box a .item,body .content .row-black .projects.projects-home .block .box a .item,body .content .row-grey .projects.projects-home .block .box a .item {
  width:100%!important;margin:0 auto;height:auto!important;padding:0!important
}

body .content .row .projects.projects-home .block .box a .item .rollover,body .content .row-black .projects.projects-home .block .box a .item .rollover,body .content .row-grey .projects.projects-home .block .box a .item .rollover {
  padding:30px 0
}

body .content .row .projects.projects-home .block .box a .item .rollover,body .content .row-black .projects.projects-home .block .box a .item .rollover,body .content .row-grey .projects.projects-home .block .box a .item .rollover {
  padding:30px 0
}

body .content .row .projects.projects-home .block .box a .item .rollover .text.show::after,body .content .row-black .projects.projects-home .block .box a .item .rollover .text.show::after,body .content .row-grey .projects.projects-home .block .box a .item .rollover .text.show::after {
  background:#fff
}

body .content .row .projects.projects-home .block .box a .item .rollover .text,body .content .row-black .projects.projects-home .block .box a .item .rollover .text,body .content .row-grey .projects.projects-home .block .box a .item .rollover .text {
  text-align:left;padding:0 50px
}

body .content .row .projects.projects-home .block .box a .item .rollover .text,body .content .row-black .projects.projects-home .block .box a .item .rollover .text,body .content .row-grey .projects.projects-home .block .box a .item .rollover .text {
  padding:0 25px
}

body .content .row .projects.projects-home .block .box a .item .rollover .text,body .content .row-black .projects.projects-home .block .box a .item .rollover .text,body .content .row-grey .projects.projects-home .block .box a .item .rollover .text {
  padding:0 25px
}

body .content .row .projects.projects-home .block .box a .item .rollover .text .project-name,body .content .row-black .projects.projects-home .block .box a .item .rollover .text .project-name,body .content .row-grey .projects.projects-home .block .box a .item .rollover .text .project-name {
  margin-top:60px;padding:0
}

body .content .row .projects.projects-home .block .box a .item .rollover .text .title,body .content .row-black .projects.projects-home .block .box a .item .rollover .text .title,body .content .row-grey .projects.projects-home .block .box a .item .rollover .text .title {
  font-size:28px;margin-bottom:10px
}

body .content .row .projects.projects-home .block .box a .item .rollover .text .project-name,body .content .row-black .projects.projects-home .block .box a .item .rollover .text .project-name,body .content .row-grey .projects.projects-home .block .box a .item .rollover .text .project-name {
  margin-top:0
}

body .content .row .projects.projects-home .block .box a .item .rollover .text .title,body .content .row-black .projects.projects-home .block .box a .item .rollover .text .title,body .content .row-grey .projects.projects-home .block .box a .item .rollover .text .title {
  font-size:24px
}

body .content .row .projects.projects-home .block .box a .item .rollover .text .project-name,body .content .row-black .projects.projects-home .block .box a .item .rollover .text .project-name,body .content .row-grey .projects.projects-home .block .box a .item .rollover .text .project-name {
  margin-top:0
}

body .content .row .projects.projects-home .block .box a .item .rollover .text .title,body .content .row-black .projects.projects-home .block .box a .item .rollover .text .title,body .content .row-grey .projects.projects-home .block .box a .item .rollover .text .title {
  font-size:24px
}

body .content .row .projects.projects-home .block .box a .item .rollover .text .brand,body .content .row-black .projects.projects-home .block .box a .item .rollover .text .brand,body .content .row-grey .projects.projects-home .block .box a .item .rollover .text .brand {
  font-size:28px;font-weight:300;margin-bottom:30px
}

body .content .row .projects.projects-home .block .box a .item .rollover .text .brand,body .content .row-black .projects.projects-home .block .box a .item .rollover .text .brand,body .content .row-grey .projects.projects-home .block .box a .item .rollover .text .brand {
  font-size:24px
}

body .content .row .projects.projects-home .block .box a .item .rollover .text .brand,body .content .row-black .projects.projects-home .block .box a .item .rollover .text .brand,body .content .row-grey .projects.projects-home .block .box a .item .rollover .text .brand {
  font-size:24px
}

body .content .row .projects.projects-home .block .box a .item .rollover .text .categories,body .content .row-black .projects.projects-home .block .box a .item .rollover .text .categories,body .content .row-grey .projects.projects-home .block .box a .item .rollover .text .categories {
  font-size:16px;font-weight:300;color:#828282
}

body .content .row .projects.projects-home .block .box a .item .rollover .text .categories,body .content .row-black .projects.projects-home .block .box a .item .rollover .text .categories,body .content .row-grey .projects.projects-home .block .box a .item .rollover .text .categories {
  font-size:14px;padding-right:30px;margin-top:5px
}

body .content .row .projects.projects-home .block .box a .item .rollover .text .categories,body .content .row-black .projects.projects-home .block .box a .item .rollover .text .categories,body .content .row-grey .projects.projects-home .block .box a .item .rollover .text .categories {
  font-size:14px;padding-right:30px;margin-top:5px
}

body .content .row .projects.projects-home .block .box a .item .rollover .text .subtitle,body .content .row-black .projects.projects-home .block .box a .item .rollover .text .subtitle,body .content .row-grey .projects.projects-home .block .box a .item .rollover .text .subtitle {
  font-size:16px;font-weight:300
}

body .content .row .projects.projects-home .block .box a .item .arrow,body .content .row-black .projects.projects-home .block .box a .item .arrow,body .content .row-grey .projects.projects-home .block .box a .item .arrow {
  position:absolute;left:50px;bottom:35px;width:50px;height:23px;z-index:1;background-image:url(../images/arrow.svg);background-repeat:no-repeat
}

body .content .row .projects.projects-home .block .box a .item .rollover .text .subtitle,body .content .row-black .projects.projects-home .block .box a .item .rollover .text .subtitle,body .content .row-grey .projects.projects-home .block .box a .item .rollover .text .subtitle {
  font-size:18px
}

body .content .row .projects.projects-home .block .box a .item .arrow,body .content .row-black .projects.projects-home .block .box a .item .arrow,body .content .row-grey .projects.projects-home .block .box a .item .arrow {
  left:auto;right:0;bottom:0
}

body .content .row .projects.projects-home .block .box a .item .rollover .text .subtitle,body .content .row-black .projects.projects-home .block .box a .item .rollover .text .subtitle,body .content .row-grey .projects.projects-home .block .box a .item .rollover .text .subtitle {
  font-size:18px
}

body .content .row .projects.projects-home .block .box a .item .arrow,body .content .row-black .projects.projects-home .block .box a .item .arrow,body .content .row-grey .projects.projects-home .block .box a .item .arrow {
  left:auto;right:0;bottom:0
}

body .content .row .projects.projects-home .block:nth-child(3n+1) #box-4 .item,body .content .row-black .projects.projects-home .block:nth-child(3n+1) #box-4 .item,body .content .row-grey .projects.projects-home .block:nth-child(3n+1) #box-4 .item {
  height:0;padding-bottom:48.37%
}

body .content .row .projects.projects-home .block:nth-child(3n+1) #box-4 .item,body .content .row-black .projects.projects-home .block:nth-child(3n+1) #box-4 .item,body .content .row-grey .projects.projects-home .block:nth-child(3n+1) #box-4 .item {
  height:initial;padding-bottom:initial
}

body .content .row .projects.projects-home .block:nth-child(3n+2) #box-6 .item,body .content .row-black .projects.projects-home .block:nth-child(3n+2) #box-6 .item,body .content .row-grey .projects.projects-home .block:nth-child(3n+2) #box-6 .item {
  height:0;padding-bottom:48.37%
}

body .content .row .projects.projects-home .block:nth-child(3n+2) #box-6 .item,body .content .row-black .projects.projects-home .block:nth-child(3n+2) #box-6 .item,body .content .row-grey .projects.projects-home .block:nth-child(3n+2) #box-6 .item {
  height:initial;padding-bottom:initial
}

body .content .row .projects.projects-home .block:nth-child(3n+3) #box-12 .item,body .content .row-black .projects.projects-home .block:nth-child(3n+3) #box-12 .item,body .content .row-grey .projects.projects-home .block:nth-child(3n+3) #box-12 .item {
  height:0;padding-bottom:48.37%
}

body .content .row .projects.projects-home .block:nth-child(3n+3) #box-12 .item,body .content .row-black .projects.projects-home .block:nth-child(3n+3) #box-12 .item,body .content .row-grey .projects.projects-home .block:nth-child(3n+3) #box-12 .item {
  height:initial;padding-bottom:initial
}

body .content .row .projects.projects-home a .item,body .content .row-black .projects.projects-home a .item,body .content .row-grey .projects.projects-home a .item {
  width:100%
}

body .content .row .projects a .item::after,body .content .row-black .projects a .item::after,body .content .row-grey .projects a .item::after {
  display:none
}

body .content .row .projects.projects-page a .item__background img,body .content .row-black .projects.projects-page a .item__background img,body .content .row-grey .projects.projects-page a .item__background img {
  width:100%
}

body .content .row .projects a .item::after,body .content .row-black .projects a .item::after,body .content .row-grey .projects a .item::after {
  display:none
}

body .content .row .projects a .item::after,body .content .row-black .projects a .item::after,body .content .row-grey .projects a .item::after {
  content:'';width:100%;height:100%;position:absolute;background:#F5F5F5;top:0;left:0;z-index:1;opacity:0;-webkit-transition:.4s ease;transition:.4s ease;-webkit-transition-delay:.2s;transition-delay:.2s
}

body .content .row .projects a .item .text.show,body .content .row-black .projects a .item .text.show,body .content .row-grey .projects a .item .text.show {
  opacity:0;-webkit-transition:1s ease 0s;transition:1s ease 0s
}

body .content .row .projects a .item:hover::after,body .content .row-black .projects a .item:hover::after,body .content .row-grey .projects a .item:hover::after {
  opacity:.9
}

body .content .row .projects a .item:hover::after,body .content .row-black .projects a .item:hover::after,body .content .row-grey .projects a .item:hover::after {
  display:none
}

body .content .row .projects a .item:hover::after,body .content .row-black .projects a .item:hover::after,body .content .row-grey .projects a .item:hover::after {
  display:none
}

body .content .row .projects a .item:hover text.show,body .content .row-black .projects a .item:hover text.show,body .content .row-grey .projects a .item:hover text.show {
  opacity:1
}

body .content .row .projects a .item:hover .button .svg path,body .content .row-black .projects a .item:hover .button .svg path,body .content .row-grey .projects a .item:hover .button .svg path {
  fill:#44ff06;stroke:none
}

body .content .row .projects a .item:hover .button .svg polygon,body .content .row-black .projects a .item:hover .button .svg polygon,body .content .row-grey .projects a .item:hover .button .svg polygon {
  fill:#44ff06;stroke:#44ff06;stroke-width:1px
}

body .content .row .projects a .item:hover .item__background,body .content .row-black .projects a .item:hover .item__background,body .content .row-grey .projects a .item:hover .item__background {
  -webkit-transform:scale(1.02);transform:scale(1.02)
}

body .content .row .projects a .item:hover .rollover,body .content .row-black .projects a .item:hover .rollover,body .content .row-grey .projects a .item:hover .rollover {
  opacity:1;-webkit-transition:opacity 250ms,-webkit-transform 250ms;transition:opacity 250ms,-webkit-transform 250ms;transition:opacity 250ms,transform 250ms;transition:opacity 250ms,transform 250ms,-webkit-transform 250ms;-webkit-transition-delay:.4s;transition-delay:.4s;-webkit-transform:scale(1);transform:scale(1)
}

body .content .row .projects a .item:hover .rollover .text,body .content .row-black .projects a .item:hover .rollover .text,body .content .row-grey .projects a .item:hover .rollover .text {
  opacity:0
}

body .content .row .projects a .item:hover .text h2,body .content .row-black .projects a .item:hover .text h2,body .content .row-grey .projects a .item:hover .text h2 {
  opacity:1!important
}

body .content .row .projects a .item:hover .project-name.border::after,body .content .row-black .projects a .item:hover .project-name.border::after,body .content .row-grey .projects a .item:hover .project-name.border::after {
  display:block!important
}

body .content .row .projects a .item__background,body .content .row-black .projects a .item__background,body .content .row-grey .projects a .item__background {
  -webkit-transition:all .3s;transition:all .3s;-webkit-transform:scale(1);transform:scale(1)
}

body .content .row .projects a .item__background img,body .content .row-black .projects a .item__background img,body .content .row-grey .projects a .item__background img {
  width:100%;display:block
}

body .content .row .projects a .item__background.pc,body .content .row-black .projects a .item__background.pc,body .content .row-grey .projects a .item__background.pc {
  display:none
}

body .content .row .projects a .item__background.mobile,body .content .row-black .projects a .item__background.mobile,body .content .row-grey .projects a .item__background.mobile {
  display:none;padding-bottom:100%
}

body .content .row .projects a .item__background.pc,body .content .row-black .projects a .item__background.pc,body .content .row-grey .projects a .item__background.pc {
  display:none
}

body .content .row .projects a .item__background.mobile,body .content .row-black .projects a .item__background.mobile,body .content .row-grey .projects a .item__background.mobile {
  display:block
}

body .content .row .projects a .item,body .content .row .projects a .item-text,body .content .row-black .projects a .item,body .content .row-black .projects a .item-text,body .content .row-grey .projects a .item,body .content .row-grey .projects a .item-text {
  width:100%;height:auto;background-repeat:no-repeat;background-size:cover;background-position:center;position:relative;overflow:hidden
}

body .content .row .projects a .item .rollover,body .content .row .projects a .item-text .rollover,body .content .row-black .projects a .item .rollover,body .content .row-black .projects a .item-text .rollover,body .content .row-grey .projects a .item .rollover,body .content .row-grey .projects a .item-text .rollover {
  z-index:2;width:100%;height:100%;position:absolute;top:0;left:0;opacity:0;-webkit-transition:opacity 250ms,-webkit-transform 250ms;transition:opacity 250ms,-webkit-transform 250ms;transition:opacity 250ms,transform 250ms;transition:opacity 250ms,transform 250ms,-webkit-transform 250ms;-webkit-transition-delay:0;transition-delay:0;-webkit-transform:scale(.95);transform:scale(.95)
}

body .content .row .projects a .item .rollover,body .content .row .projects a .item-text .rollover,body .content .row-black .projects a .item .rollover,body .content .row-black .projects a .item-text .rollover,body .content .row-grey .projects a .item .rollover,body .content .row-grey .projects a .item-text .rollover {
  position:relative;opacity:1
}

body .content .row .projects a .item .rollover .hide,body .content .row .projects a .item .rollover .show,body .content .row .projects a .item-text .rollover .hide,body .content .row .projects a .item-text .rollover .show,body .content .row-black .projects a .item .rollover .hide,body .content .row-black .projects a .item .rollover .show,body .content .row-black .projects a .item-text .rollover .hide,body .content .row-black .projects a .item-text .rollover .show,body .content .row-grey .projects a .item .rollover .hide,body .content .row-grey .projects a .item .rollover .show,body .content .row-grey .projects a .item-text .rollover .hide,body .content .row-grey .projects a .item-text .rollover .show {
  opacity:1
}

body .content .row .projects a .item .rollover .background,body .content .row .projects a .item-text .rollover .background,body .content .row-black .projects a .item .rollover .background,body .content .row-black .projects a .item-text .rollover .background,body .content .row-grey .projects a .item .rollover .background,body .content .row-grey .projects a .item-text .rollover .background {
  width:100%;height:100%;z-index:9;background:rgba(255,255,255,.8)
}

body .content .row .projects a .item .rollover .text,body .content .row .projects a .item-text .rollover .text,body .content .row-black .projects a .item .rollover .text,body .content .row-black .projects a .item-text .rollover .text,body .content .row-grey .projects a .item .rollover .text,body .content .row-grey .projects a .item-text .rollover .text {
  max-width:100%;min-height:50px;z-index:9;bottom:0;-webkit-transition:opacity .5s .3s ease-in;transition:opacity .5s .3s ease-in
}

body .content .row .projects a .item .rollover .text .project-name,body .content .row .projects a .item-text .rollover .text .project-name,body .content .row-black .projects a .item .rollover .text .project-name,body .content .row-black .projects a .item-text .rollover .text .project-name,body .content .row-grey .projects a .item .rollover .text .project-name,body .content .row-grey .projects a .item-text .rollover .text .project-name {
  width:100%;text-align:left;padding:50px;z-index:10
}

body .content .row .projects a .item__background.mobile,body .content .row-black .projects a .item__background.mobile,body .content .row-grey .projects a .item__background.mobile {
  display:block
}

body .content .row .projects a .item .rollover,body .content .row .projects a .item-text .rollover,body .content .row-black .projects a .item .rollover,body .content .row-black .projects a .item-text .rollover,body .content .row-grey .projects a .item .rollover,body .content .row-grey .projects a .item-text .rollover {
  position:relative;opacity:1
}

body .content .row .projects a .item .rollover .text .project-name,body .content .row .projects a .item-text .rollover .text .project-name,body .content .row-black .projects a .item .rollover .text .project-name,body .content .row-black .projects a .item-text .rollover .text .project-name,body .content .row-grey .projects a .item .rollover .text .project-name,body .content .row-grey .projects a .item-text .rollover .text .project-name {
  padding:30px
}

body .content .row .projects a .item .rollover .text .project-name.border::after,body .content .row .projects a .item-text .rollover .text .project-name.border::after,body .content .row-black .projects a .item .rollover .text .project-name.border::after,body .content .row-black .projects a .item-text .rollover .text .project-name.border::after,body .content .row-grey .projects a .item .rollover .text .project-name.border::after,body .content .row-grey .projects a .item-text .rollover .text .project-name.border::after {
  display:none
}

body .content .row .projects a .item .rollover .text .project-name p,body .content .row .projects a .item-text .rollover .text .project-name p,body .content .row-black .projects a .item .rollover .text .project-name p,body .content .row-black .projects a .item-text .rollover .text .project-name p,body .content .row-grey .projects a .item .rollover .text .project-name p,body .content .row-grey .projects a .item-text .rollover .text .project-name p {
  font-size:14px;line-height:19px;letter-spacing:.03em;font-weight:900;margin:0 0 -5px
}

body .content .row .projects a .item .rollover .text .project-name span,body .content .row .projects a .item-text .rollover .text .project-name span,body .content .row-black .projects a .item .rollover .text .project-name span,body .content .row-black .projects a .item-text .rollover .text .project-name span,body .content .row-grey .projects a .item .rollover .text .project-name span,body .content .row-grey .projects a .item-text .rollover .text .project-name span {
  font-size:14px;line-height:14px;letter-spacing:.03em;text-transform:none;font-weight:400;display:block;padding-top:5px
}

body .content .row .projects a .item .rollover .text h2,body .content .row .projects a .item-text .rollover .text h2,body .content .row-black .projects a .item .rollover .text h2,body .content .row-black .projects a .item-text .rollover .text h2,body .content .row-grey .projects a .item .rollover .text h2,body .content .row-grey .projects a .item-text .rollover .text h2 {
  margin:0;font-size:14px;line-height:19px;font-weight:400;display:block;text-align:right;width:80%;opacity:0;-webkit-transition:all .5s cubic-bezier(.2,0,.35,1);transition:all .5s cubic-bezier(.2,0,.35,1)
}

body .content .row .projects a .item .rollover .text h2 p,body .content .row .projects a .item-text .rollover .text h2 p,body .content .row-black .projects a .item .rollover .text h2 p,body .content .row-black .projects a .item-text .rollover .text h2 p,body .content .row-grey .projects a .item .rollover .text h2 p,body .content .row-grey .projects a .item-text .rollover .text h2 p {
  margin:0;font-weight:400;color:#4d4d4d
}

body .content .row .projects a .item .rollover .text,body .content .row .projects a .item-text .rollover .text,body .content .row-black .projects a .item .rollover .text,body .content .row-black .projects a .item-text .rollover .text,body .content .row-grey .projects a .item .rollover .text,body .content .row-grey .projects a .item-text .rollover .text {
  -webkit-box-sizing:border-box;box-sizing:border-box;width:100%;height:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;color:#000;text-align:center;padding:10px 0;background:0 0
}

body .content .row .projects a .item .rollover .text .title,body .content .row .projects a .item-text .rollover .text .title,body .content .row-black .projects a .item .rollover .text .title,body .content .row-black .projects a .item-text .rollover .text .title,body .content .row-grey .projects a .item .rollover .text .title,body .content .row-grey .projects a .item-text .rollover .text .title {
  font-size:20px;margin-bottom:10px
}

body .content .row .projects a .item .rollover .text .title,body .content .row .projects a .item-text .rollover .text .title,body .content .row-black .projects a .item .rollover .text .title,body .content .row-black .projects a .item-text .rollover .text .title,body .content .row-grey .projects a .item .rollover .text .title,body .content .row-grey .projects a .item-text .rollover .text .title {
  font-size:20px
}

body .content .row .projects a .item .rollover .text,body .content .row .projects a .item-text .rollover .text,body .content .row-black .projects a .item .rollover .text,body .content .row-black .projects a .item-text .rollover .text,body .content .row-grey .projects a .item .rollover .text,body .content .row-grey .projects a .item-text .rollover .text {
  color:#000
}

body .content .row .projects a .item .rollover .text .title,body .content .row .projects a .item-text .rollover .text .title,body .content .row-black .projects a .item .rollover .text .title,body .content .row-black .projects a .item-text .rollover .text .title,body .content .row-grey .projects a .item .rollover .text .title,body .content .row-grey .projects a .item-text .rollover .text .title {
  font-size:20px
}

body .content .row .projects a .item .rollover .text .brand,body .content .row .projects a .item-text .rollover .text .brand,body .content .row-black .projects a .item .rollover .text .brand,body .content .row-black .projects a .item-text .rollover .text .brand,body .content .row-grey .projects a .item .rollover .text .brand,body .content .row-grey .projects a .item-text .rollover .text .brand {
  font-size:15px
}

body .content .row .projects a .item .rollover .text .brand,body .content .row .projects a .item-text .rollover .text .brand,body .content .row-black .projects a .item .rollover .text .brand,body .content .row-black .projects a .item-text .rollover .text .brand,body .content .row-grey .projects a .item .rollover .text .brand,body .content .row-grey .projects a .item-text .rollover .text .brand {
  font-size:15px;font-weight:300;margin-bottom:20px
}

body .content .row .projects a .item .rollover .text .brand,body .content .row .projects a .item-text .rollover .text .brand,body .content .row-black .projects a .item .rollover .text .brand,body .content .row-black .projects a .item-text .rollover .text .brand,body .content .row-grey .projects a .item .rollover .text .brand,body .content .row-grey .projects a .item-text .rollover .text .brand {
  font-size:15px
}

body .content .row .projects a .item .rollover .text .categories,body .content .row .projects a .item-text .rollover .text .categories,body .content .row-black .projects a .item .rollover .text .categories,body .content .row-black .projects a .item-text .rollover .text .categories,body .content .row-grey .projects a .item .rollover .text .categories,body .content .row-grey .projects a .item-text .rollover .text .categories {
  font-size:12px;font-weight:300;color:#828282
}

body .content .row .projects a .item .rollover .text .categories,body .content .row .projects a .item-text .rollover .text .categories,body .content .row-black .projects a .item .rollover .text .categories,body .content .row-black .projects a .item-text .rollover .text .categories,body .content .row-grey .projects a .item .rollover .text .categories,body .content .row-grey .projects a .item-text .rollover .text .categories {
  font-size:12px
}

body .content .row .projects a .item .rollover .text .categories,body .content .row .projects a .item-text .rollover .text .categories,body .content .row-black .projects a .item .rollover .text .categories,body .content .row-black .projects a .item-text .rollover .text .categories,body .content .row-grey .projects a .item .rollover .text .categories,body .content .row-grey .projects a .item-text .rollover .text .categories {
  font-size:12px
}

body .content .row .projects a .item .rollover .text .subtitle,body .content .row .projects a .item-text .rollover .text .subtitle,body .content .row-black .projects a .item .rollover .text .subtitle,body .content .row-black .projects a .item-text .rollover .text .subtitle,body .content .row-grey .projects a .item .rollover .text .subtitle,body .content .row-grey .projects a .item-text .rollover .text .subtitle {
  font-size:15px
}

body .content .row .projects a .item .rollover .text .subtitle,body .content .row .projects a .item-text .rollover .text .subtitle,body .content .row-black .projects a .item .rollover .text .subtitle,body .content .row-black .projects a .item-text .rollover .text .subtitle,body .content .row-grey .projects a .item .rollover .text .subtitle,body .content .row-grey .projects a .item-text .rollover .text .subtitle {
  font-size:15px;font-weight:300
}

body .content .row .projects a .item .rollover .text .arrow,body .content .row .projects a .item-text .rollover .text .arrow,body .content .row-black .projects a .item .rollover .text .arrow,body .content .row-black .projects a .item-text .rollover .text .arrow,body .content .row-grey .projects a .item .rollover .text .arrow,body .content .row-grey .projects a .item-text .rollover .text .arrow {
  position:absolute;left:50px;bottom:35px;width:50px;height:23px;z-index:1;background-image:url(../images/arrow.svg);background-repeat:no-repeat
}

body .content .row .projects a .item .rollover .text .subtitle,body .content .row .projects a .item-text .rollover .text .subtitle,body .content .row-black .projects a .item .rollover .text .subtitle,body .content .row-black .projects a .item-text .rollover .text .subtitle,body .content .row-grey .projects a .item .rollover .text .subtitle,body .content .row-grey .projects a .item-text .rollover .text .subtitle {
  font-size:15px
}

body .content .row .projects a .item .rollover .text .arrow,body .content .row .projects a .item-text .rollover .text .arrow,body .content .row-black .projects a .item .rollover .text .arrow,body .content .row-black .projects a .item-text .rollover .text .arrow,body .content .row-grey .projects a .item .rollover .text .arrow,body .content .row-grey .projects a .item-text .rollover .text .arrow {
  left:auto;right:0;bottom:0
}

body .content .row .projects a .item .rollover .text.show,body .content .row .projects a .item-text .rollover .text.show,body .content .row-black .projects a .item .rollover .text.show,body .content .row-black .projects a .item-text .rollover .text.show,body .content .row-grey .projects a .item .rollover .text.show,body .content .row-grey .projects a .item-text .rollover .text.show {
  opacity:1
}

body .content .row .projects a .item .rollover .text .arrow,body .content .row .projects a .item-text .rollover .text .arrow,body .content .row-black .projects a .item .rollover .text .arrow,body .content .row-black .projects a .item-text .rollover .text .arrow,body .content .row-grey .projects a .item .rollover .text .arrow,body .content .row-grey .projects a .item-text .rollover .text .arrow {
  left:auto;right:0;bottom:0
}

body .content .row .projects a .item .rollover .text.show,body .content .row .projects a .item-text .rollover .text.show,body .content .row-black .projects a .item .rollover .text.show,body .content .row-black .projects a .item-text .rollover .text.show,body .content .row-grey .projects a .item .rollover .text.show,body .content .row-grey .projects a .item-text .rollover .text.show {
  display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;text-align:left
}

body .content .row .projects a .item .rollover .text.hide,body .content .row .projects a .item-text .rollover .text.hide,body .content .row-black .projects a .item .rollover .text.hide,body .content .row-black .projects a .item-text .rollover .text.hide,body .content .row-grey .projects a .item .rollover .text.hide,body .content .row-grey .projects a .item-text .rollover .text.hide {
  opacity:0;-webkit-transform:translateY(30px);transform:translateY(30px)
}

body .content .row .projects a .item .rollover .background,body .content .row .projects a .item-text .rollover .background,body .content .row-black .projects a .item .rollover .background,body .content .row-black .projects a .item-text .rollover .background,body .content .row-grey .projects a .item .rollover .background,body .content .row-grey .projects a .item-text .rollover .background {
  -webkit-transition:opacity .6s cubic-bezier(.2,0,.35,1);transition:opacity .6s cubic-bezier(.2,0,.35,1)
}

body .content .row .projects a .item .rollover .background.show,body .content .row .projects a .item-text .rollover .background.show,body .content .row-black .projects a .item .rollover .background.show,body .content .row-black .projects a .item-text .rollover .background.show,body .content .row-grey .projects a .item .rollover .background.show,body .content .row-grey .projects a .item-text .rollover .background.show {
  opacity:1
}

body .content .row .projects a .item .rollover .background.hide,body .content .row .projects a .item-text .rollover .background.hide,body .content .row-black .projects a .item .rollover .background.hide,body .content .row-black .projects a .item-text .rollover .background.hide,body .content .row-grey .projects a .item .rollover .background.hide,body .content .row-grey .projects a .item-text .rollover .background.hide {
  opacity:0
}

body .content .row .projects a .item-text,body .content .row-black .projects a .item-text,body .content .row-grey .projects a .item-text {
  background:#ebebeb;min-height:580px
}

body .content .row .projects a .item-text:after,body .content .row-black .projects a .item-text:after,body .content .row-grey .projects a .item-text:after {
  content:'';width:100%;height:5px;display:block;background-color:#44ff06;position:absolute;bottom:0;left:0;-webkit-transform:scaleX(0);transform:scaleX(0);-webkit-transform-origin:left;transform-origin:left;-webkit-transition:-webkit-transform .7s cubic-bezier(.2,0,.35,1);transition:-webkit-transform .7s cubic-bezier(.2,0,.35,1);transition:transform .7s cubic-bezier(.2,0,.35,1);transition:transform .7s cubic-bezier(.2,0,.35,1),-webkit-transform .7s cubic-bezier(.2,0,.35,1);z-index:99
}

body .content .row .projects a .item-text .text,body .content .row-black .projects a .item-text .text,body .content .row-grey .projects a .item-text .text {
  color:#000;width:calc(100% - 170px);height:311px;z-index:99;position:absolute;bottom:0;padding:40px;-webkit-box-pack:end;-ms-flex-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end
}

body .content .row .projects a .item-text .text span,body .content .row-black .projects a .item-text .text span,body .content .row-grey .projects a .item-text .text span {
  font-size:16px;text-transform:uppercase;font-weight:600
}

body .content .row .projects a .item-text .text span .line,body .content .row-black .projects a .item-text .text span .line,body .content .row-grey .projects a .item-text .text span .line {
  background:#44ff06;height:1px;width:42px;margin-top:7px
}

body .content .row .projects a .item-text .text h2,body .content .row-black .projects a .item-text .text h2,body .content .row-grey .projects a .item-text .text h2 {
  font-size:30px;line-height:32px;font-weight:300;width:100%;margin-top:15px;text-transform:none;letter-spacing:.03em
}

body .content .row .projects a .item-text .text h2 i,body .content .row-black .projects a .item-text .text h2 i,body .content .row-grey .projects a .item-text .text h2 i {
  font-size:16px;font-weight:200;font-style:normal;vertical-align:super;padding-right:1px
}

body .content .row .projects a .item-text .text .button,body .content .row-black .projects a .item-text .text .button,body .content .row-grey .projects a .item-text .text .button {
  width:36px;height:36px;border-radius:50%;margin-left:0;display:-webkit-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center;-ms-flex-line-pack:center;-webkit-align-content:center;align-content:center;-webkit-transition:.7s ease 0s;transition:.7s ease 0s
}

body .content .row .projects a .item-text .text .button .svg path,body .content .row-black .projects a .item-text .text .button .svg path,body .content .row-grey .projects a .item-text .text .button .svg path {
  fill:#000;stroke:none;-webkit-transition:.7s ease 0s;transition:.7s ease 0s
}

body .content .row .projects a .item-text .text .button .svg polygon,body .content .row-black .projects a .item-text .text .button .svg polygon,body .content .row-grey .projects a .item-text .text .button .svg polygon {
  fill:#000;stroke:#000;-webkit-transition:.7s ease 0s;transition:.7s ease 0s
}

body .content .row .projects a:hover .item .text .button .svg path,body .content .row .projects a:hover .item-text .text .button .svg path,body .content .row-black .projects a:hover .item .text .button .svg path,body .content .row-black .projects a:hover .item-text .text .button .svg path,body .content .row-grey .projects a:hover .item .text .button .svg path,body .content .row-grey .projects a:hover .item-text .text .button .svg path {
  fill:#44ff06;stroke:none
}

body .content .row .projects a:hover .item .text .button .svg polygon,body .content .row .projects a:hover .item-text .text .button .svg polygon,body .content .row-black .projects a:hover .item .text .button .svg polygon,body .content .row-black .projects a:hover .item-text .text .button .svg polygon,body .content .row-grey .projects a:hover .item .text .button .svg polygon,body .content .row-grey .projects a:hover .item-text .text .button .svg polygon {
  fill:#44ff06;stroke:#44ff06
}

body .content .row .carousel,body .content .row-black .carousel,body .content .row-grey .carousel {
  -webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;-webkit-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;-webkit-flex-wrap:wrap;flex-wrap:wrap;height:auto;width:100%;display:-webkit-box;display:-ms-flexbox;display:-webkit-flex;display:flex;max-width:1200px;margin:0 auto
}

body .content .row .carousel .item,body .content .row-black .carousel .item,body .content .row-grey .carousel .item {
  width:50%;height:600px
}

body .content .row .carousel .item .img,body .content .row-black .carousel .item .img,body .content .row-grey .carousel .item .img {
  background-size:cover;background-position:center center;background-repeat:no-repeat;height:100%
}

body .content .row .details-project .content .item,body .content .row .details-project-responsive .content .item,body .content .row-black .details-project .content .item,body .content .row-black .details-project-responsive .content .item,body .content .row-grey .details-project .content .item,body .content .row-grey .details-project-responsive .content .item {
  width:calc(33% - 41px);padding:40px 30px;border-right:1px solid rgba(255,255,255,.2);height:calc(100% - 80px);display:-webkit-box;display:-ms-flexbox;display:-webkit-flex;display:flex
}

body .content .row .details-project .content .item .text-project,body .content .row .details-project-responsive .content .item .text-project,body .content .row-black .details-project .content .item .text-project,body .content .row-black .details-project-responsive .content .item .text-project,body .content .row-grey .details-project .content .item .text-project,body .content .row-grey .details-project-responsive .content .item .text-project {
  display:-webkit-box;display:-ms-flexbox;display:-webkit-flex;display:flex;margin-top:auto;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column;position:relative;cursor:pointer
}

body .content .row .details-project .content .item .text-project p,body .content .row .details-project-responsive .content .item .text-project p,body .content .row-black .details-project .content .item .text-project p,body .content .row-black .details-project-responsive .content .item .text-project p,body .content .row-grey .details-project .content .item .text-project p,body .content .row-grey .details-project-responsive .content .item .text-project p {
  -webkit-transition:all 1s cubic-bezier(.25,.1,.25,1);transition:all 1s cubic-bezier(.25,.1,.25,1);overflow:hidden
}

body .content .row .details-project .content .item .text-project .elipsis,body .content .row .details-project-responsive .content .item .text-project .elipsis,body .content .row-black .details-project .content .item .text-project .elipsis,body .content .row-black .details-project-responsive .content .item .text-project .elipsis,body .content .row-grey .details-project .content .item .text-project .elipsis,body .content .row-grey .details-project-responsive .content .item .text-project .elipsis {
  max-height:85px
}

body .content .row .details-project .content .item .text-project span,body .content .row .details-project-responsive .content .item .text-project span,body .content .row-black .details-project .content .item .text-project span,body .content .row-black .details-project-responsive .content .item .text-project span,body .content .row-grey .details-project .content .item .text-project span,body .content .row-grey .details-project-responsive .content .item .text-project span {
  color:#fff;font-size:16px;text-transform:uppercase;font-weight:700
}

body .content .row .details-project .content .item .text-project span .line,body .content .row .details-project-responsive .content .item .text-project span .line,body .content .row-black .details-project .content .item .text-project span .line,body .content .row-black .details-project-responsive .content .item .text-project span .line,body .content .row-grey .details-project .content .item .text-project span .line,body .content .row-grey .details-project-responsive .content .item .text-project span .line {
  width:42px;height:1px;background:#44ff06;margin:7px 0 4px
}

body .content .row .details-project .content .item .text-project .elipsis,body .content .row .details-project-responsive .content .item .text-project .elipsis,body .content .row-black .details-project .content .item .text-project .elipsis,body .content .row-black .details-project-responsive .content .item .text-project .elipsis,body .content .row-grey .details-project .content .item .text-project .elipsis,body .content .row-grey .details-project-responsive .content .item .text-project .elipsis {
  color:#FFF;opacity:.3;font-size:18px;line-height:28px;width:90%;margin-bottom:20px;overflow-y:hidden;position:relative;-webkit-transition:all 1s cubic-bezier(.25,.1,.25,1);transition:all 1s cubic-bezier(.25,.1,.25,1)
}

body .content .row .details-project .content .item .text-project .elip-not,body .content .row .details-project-responsive .content .item .text-project .elip-not,body .content .row-black .details-project .content .item .text-project .elip-not,body .content .row-black .details-project-responsive .content .item .text-project .elip-not,body .content .row-grey .details-project .content .item .text-project .elip-not,body .content .row-grey .details-project-responsive .content .item .text-project .elip-not {
  max-height:330px;color:#FFF;font-size:18px;line-height:28px;width:90%;margin-bottom:20px;-webkit-transition:all 1s cubic-bezier(.25,.1,.25,1);transition:all 1s cubic-bezier(.25,.1,.25,1)
}

body .content .row .details-project .content .item .text-project .plus .icon,body .content .row .details-project-responsive .content .item .text-project .plus .icon,body .content .row-black .details-project .content .item .text-project .plus .icon,body .content .row-black .details-project-responsive .content .item .text-project .plus .icon,body .content .row-grey .details-project .content .item .text-project .plus .icon,body .content .row-grey .details-project-responsive .content .item .text-project .plus .icon {
  height:39px;width:39px;background-image:url(../images/logos/plus.png)
}

body .content .row .details-project .content .item .text-project .plus .icon.minus,body .content .row .details-project-responsive .content .item .text-project .plus .icon.minus,body .content .row-black .details-project .content .item .text-project .plus .icon.minus,body .content .row-black .details-project-responsive .content .item .text-project .plus .icon.minus,body .content .row-grey .details-project .content .item .text-project .plus .icon.minus,body .content .row-grey .details-project-responsive .content .item .text-project .plus .icon.minus {
  background-image:url(../images/logos/minus.png)
}

body .content .row .details-project .content .item .text-project .plus i,body .content .row .details-project-responsive .content .item .text-project .plus i,body .content .row-black .details-project .content .item .text-project .plus i,body .content .row-black .details-project-responsive .content .item .text-project .plus i,body .content .row-grey .details-project .content .item .text-project .plus i,body .content .row-grey .details-project-responsive .content .item .text-project .plus i {
  color:#FFF;padding:0;border:0;font-size:32px;-webkit-transition:.5s ease 0s;transition:.5s ease 0s
}

body .content .row .details-project .content .item .text-project .plus .fa-minus-square,body .content .row .details-project-responsive .content .item .text-project .plus .fa-minus-square,body .content .row-black .details-project .content .item .text-project .plus .fa-minus-square,body .content .row-black .details-project-responsive .content .item .text-project .plus .fa-minus-square,body .content .row-grey .details-project .content .item .text-project .plus .fa-minus-square,body .content .row-grey .details-project-responsive .content .item .text-project .plus .fa-minus-square {
  font-size:31px;-webkit-transition:.5s ease 0s;transition:.5s ease 0s
}

body .content .row .details-project .content .item:last-child,body .content .row .details-project-responsive .content .item:last-child,body .content .row-black .details-project .content .item:last-child,body .content .row-black .details-project-responsive .content .item:last-child,body .content .row-grey .details-project .content .item:last-child,body .content .row-grey .details-project-responsive .content .item:last-child {
  border:0
}

body .content .row .pagination-project a .next .project-name .rollover,body .content .row .pagination-project a .prev .project-name .rollover,body .content .row-black .pagination-project a .next .project-name .rollover,body .content .row-black .pagination-project a .prev .project-name .rollover,body .content .row-grey .pagination-project a .next .project-name .rollover,body .content .row-grey .pagination-project a .prev .project-name .rollover {
  color:#000;font-size:15px;font-weight:300;z-index:2;width:calc(100% - 100px);height:calc(100% - 100px);position:absolute;top:0;left:0;opacity:0;padding:50px;-webkit-transition:opacity 250ms,-webkit-transform 250ms;transition:opacity 250ms,-webkit-transform 250ms;transition:opacity 250ms,transform 250ms;transition:opacity 250ms,transform 250ms,-webkit-transform 250ms;-webkit-transition-delay:0;transition-delay:0;-webkit-transform:scale(.95);transform:scale(.95);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:start;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;text-align:left
}

body .content .row .pagination-project a .next .project-name .rollover .title,body .content .row .pagination-project a .prev .project-name .rollover .title,body .content .row-black .pagination-project a .next .project-name .rollover .title,body .content .row-black .pagination-project a .prev .project-name .rollover .title,body .content .row-grey .pagination-project a .next .project-name .rollover .title,body .content .row-grey .pagination-project a .prev .project-name .rollover .title {
  font-size:20px;font-weight:500
}

body .content .row .pagination-project a .next .project-name .rollover .subtitle,body .content .row .pagination-project a .prev .project-name .rollover .subtitle,body .content .row-black .pagination-project a .next .project-name .rollover .subtitle,body .content .row-black .pagination-project a .prev .project-name .rollover .subtitle,body .content .row-grey .pagination-project a .next .project-name .rollover .subtitle,body .content .row-grey .pagination-project a .prev .project-name .rollover .subtitle {
  margin:20px 0 0
}

body .content .row .pagination-project a .next .project-name .rollover .categories,body .content .row .pagination-project a .prev .project-name .rollover .categories,body .content .row-black .pagination-project a .next .project-name .rollover .categories,body .content .row-black .pagination-project a .prev .project-name .rollover .categories,body .content .row-grey .pagination-project a .next .project-name .rollover .categories,body .content .row-grey .pagination-project a .prev .project-name .rollover .categories {
  font-size:12px;color:#828282
}

body .content .row .pagination-project a .next .project-name .rollover .arrow,body .content .row .pagination-project a .prev .project-name .rollover .arrow,body .content .row-black .pagination-project a .next .project-name .rollover .arrow,body .content .row-black .pagination-project a .prev .project-name .rollover .arrow,body .content .row-grey .pagination-project a .next .project-name .rollover .arrow,body .content .row-grey .pagination-project a .prev .project-name .rollover .arrow {
  position:absolute;left:50px;bottom:35px;width:50px;height:23px;z-index:1;background-image:url(../images/arrow.svg);background-repeat:no-repeat
}

body .content .row .pagination-project a .next .project-name .rollover .arrow,body .content .row .pagination-project a .prev .project-name .rollover .arrow,body .content .row-black .pagination-project a .next .project-name .rollover .arrow,body .content .row-black .pagination-project a .prev .project-name .rollover .arrow,body .content .row-grey .pagination-project a .next .project-name .rollover .arrow,body .content .row-grey .pagination-project a .prev .project-name .rollover .arrow {
  left:auto;right:0;bottom:0
}

body .content .row .pagination-project a .next .project-name .rollover .arrow,body .content .row .pagination-project a .prev .project-name .rollover .arrow,body .content .row-black .pagination-project a .next .project-name .rollover .arrow,body .content .row-black .pagination-project a .prev .project-name .rollover .arrow,body .content .row-grey .pagination-project a .next .project-name .rollover .arrow,body .content .row-grey .pagination-project a .prev .project-name .rollover .arrow {
  left:auto;right:0;bottom:0
}

body .content .row .pagination-project a:hover .project-name .rollover,body .content .row-black .pagination-project a:hover .project-name .rollover,body .content .row-grey .pagination-project a:hover .project-name .rollover {
  opacity:1;-webkit-transition:opacity 250ms,-webkit-transform 250ms;transition:opacity 250ms,-webkit-transform 250ms;transition:opacity 250ms,transform 250ms;transition:opacity 250ms,transform 250ms,-webkit-transform 250ms;-webkit-transition-delay:.4s;transition-delay:.4s;-webkit-transform:scale(1);transform:scale(1)
}

body .content .row .pagination-project a:hover .project-name .rollover .project-name,body .content .row-black .pagination-project a:hover .project-name .rollover .project-name,body .content .row-grey .pagination-project a:hover .project-name .rollover .project-name {
  opacity:1
}

body .content .row .offices .item,body .content .row-black .offices .item,body .content .row-grey .offices .item {
  display:-webkit-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column;width:50%
}

body .content .row .offices .item .title,body .content .row-black .offices .item .title,body .content .row-grey .offices .item .title {
  font-size:36px;line-height:60px;text-transform:uppercase;font-weight:700
}

body .content .row .offices .item .title .line,body .content .row-black .offices .item .title .line,body .content .row-grey .offices .item .title .line {
  width:42px;height:1px;background:#44ff06;margin:7px 0
}

body .content .row .offices .item .details,body .content .row-black .offices .item .details,body .content .row-grey .offices .item .details {
  padding:15px 0;font-weight:300
}

body .content .row .offices .item .details .adress,body .content .row .offices .item .details .e-contacts,body .content .row-black .offices .item .details .adress,body .content .row-black .offices .item .details .e-contacts,body .content .row-grey .offices .item .details .adress,body .content .row-grey .offices .item .details .e-contacts {
  margin-bottom:45px;display:-webkit-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column
}

body .content .row .offices .item .details .adress a,body .content .row .offices .item .details .e-contacts a,body .content .row-black .offices .item .details .adress a,body .content .row-black .offices .item .details .e-contacts a,body .content .row-grey .offices .item .details .adress a,body .content .row-grey .offices .item .details .e-contacts a {
  color:#000;text-decoration:none;-webkit-transition:.5s ease 0s;transition:.5s ease 0s
}

body .content .row .offices .item .details .adress a:hover,body .content .row .offices .item .details .e-contacts a:hover,body .content .row-black .offices .item .details .adress a:hover,body .content .row-black .offices .item .details .e-contacts a:hover,body .content .row-grey .offices .item .details .adress a:hover,body .content .row-grey .offices .item .details .e-contacts a:hover {
  color:#44ff06;-webkit-transition:.5s ease 0s;transition:.5s ease 0s
}

body .content .row .offices .item .details .google-maps,body .content .row-black .offices .item .details .google-maps,body .content .row-grey .offices .item .details .google-maps {
  display:-webkit-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;-webkit-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center;-ms-flex-line-pack:center;-webkit-align-content:center;align-content:center
}

body .content .row .offices .item .details .google-maps a,body .content .row-black .offices .item .details .google-maps a,body .content .row-grey .offices .item .details .google-maps a {
  display:-webkit-box;display:-ms-flexbox;display:-webkit-flex;display:flex;text-decoration:none;color:#000
}

body .content .row .offices .item .details .google-maps a span,body .content .row-black .offices .item .details .google-maps a span,body .content .row-grey .offices .item .details .google-maps a span {
  display:-webkit-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center;-ms-flex-line-pack:center;-webkit-align-content:center;align-content:center;margin-right:15px
}

body .content .row .offices .item .details .google-maps a .button,body .content .row-black .offices .item .details .google-maps a .button,body .content .row-grey .offices .item .details .google-maps a .button {
  width:36px;height:36px;border-radius:50%;display:-webkit-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center;-ms-flex-line-pack:center;-webkit-align-content:center;align-content:center;position:relative
}

body .content .row .offices .item .details .google-maps a .button .svg,body .content .row .offices .item .details .google-maps a:hover .button .svg,body .content .row-black .offices .item .details .google-maps a .button .svg,body .content .row-black .offices .item .details .google-maps a:hover .button .svg,body .content .row-grey .offices .item .details .google-maps a .button .svg,body .content .row-grey .offices .item .details .google-maps a:hover .button .svg {
  height:100%;width:100%
}

body .content .row .offices .item .details .google-maps a .button svg,body .content .row-black .offices .item .details .google-maps a .button svg,body .content .row-grey .offices .item .details .google-maps a .button svg {
  width:12px
}

body .content .row .offices .item .details .google-maps a .button .svg path,body .content .row-black .offices .item .details .google-maps a .button .svg path,body .content .row-grey .offices .item .details .google-maps a .button .svg path {
  fill:#000;stroke:none;-webkit-transition:.7s ease 0s;transition:.7s ease 0s
}

body .content .row .offices .item .details .google-maps a .button .svg polygon,body .content .row-black .offices .item .details .google-maps a .button .svg polygon,body .content .row-grey .offices .item .details .google-maps a .button .svg polygon {
  fill:#000;stroke:#000;stroke-width:1px;-webkit-transition:.7s ease 0s;transition:.7s ease 0s
}

body .content .row .offices .item .details .google-maps a:hover,body .content .row-black .offices .item .details .google-maps a:hover,body .content .row-grey .offices .item .details .google-maps a:hover {
  color:#44ff06
}

body .content .row .offices .item .details .google-maps a:hover .button .svg path,body .content .row-black .offices .item .details .google-maps a:hover .button .svg path,body .content .row-grey .offices .item .details .google-maps a:hover .button .svg path {
  fill:#44ff06;stroke:none
}

body .content .row .offices .item .details .google-maps a:hover .button .svg polygon,body .content .row-black .offices .item .details .google-maps a:hover .button .svg polygon,body .content .row-grey .offices .item .details .google-maps a:hover .button .svg polygon {
  fill:#44ff06;stroke:#44ff06;stroke-width:1px
}

body .content .row .offices .item .details .google-maps a:hover svg .a,body .content .row-black .offices .item .details .google-maps a:hover svg .a,body .content .row-grey .offices .item .details .google-maps a:hover svg .a {
  stroke:#44ff06
}

body .content .row .careers .webs .item,body .content .row-black .careers .webs .item,body .content .row-grey .careers .webs .item {
  display:-webkit-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column;text-transform:uppercase;margin:7px 0 24px
}

body .content .row .careers .webs .item .name,body .content .row-black .careers .webs .item .name,body .content .row-grey .careers .webs .item .name {
  font-weight:600
}

body .content .row .careers .webs .item .url,body .content .row-black .careers .webs .item .url,body .content .row-grey .careers .webs .item .url {
  font-weight:300;text-transform:lowercase
}

body .content .row .careers .webs .item .url a,body .content .row-black .careers .webs .item .url a,body .content .row-grey .careers .webs .item .url a {
  text-decoration:none;color:#000;-webkit-transition:.5s ease 0s;transition:.5s ease 0s
}

body .content .row .careers .webs .item .url a:hover,body .content .row-black .careers .webs .item .url a:hover,body .content .row-grey .careers .webs .item .url a:hover {
  color:#44ff06
}

body .content .row footer .container .top .contacts .item,body .content .row-black footer .container .top .contacts .item,body .content .row-grey footer .container .top .contacts .item {
  font-size:14px;display:-webkit-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column;padding-right:48px
}

body .content .row footer .container .top .contacts .item .title,body .content .row-black footer .container .top .contacts .item .title,body .content .row-grey footer .container .top .contacts .item .title {
  color:#FFF;font-weight:600;text-transform:uppercase;padding-bottom:5px;letter-spacing:.55px;line-height:24px
}

body .content .row footer .container .top .contacts .item span,body .content .row-black footer .container .top .contacts .item span,body .content .row-grey footer .container .top .contacts .item span {
  color:#828282;line-height:16px;font-weight:300;-webkit-transition:.5s ease 0s;transition:.5s ease 0s
}

body .content .row footer .container .top .contacts .item a,body .content .row-black footer .container .top .contacts .item a,body .content .row-grey footer .container .top .contacts .item a {
  text-decoration:none;line-height:16px
}

body .content .row footer .container .top .contacts .item a span,body .content .row-black footer .container .top .contacts .item a span,body .content .row-grey footer .container .top .contacts .item a span {
  color:#828282;line-height:16px;font-weight:300;-webkit-transition:.5s ease 0s;transition:.5s ease 0s
}

body .content .row footer .container .top .contacts .item a span:hover,body .content .row-black footer .container .top .contacts .item a span:hover,body .content .row-grey footer .container .top .contacts .item a span:hover {
  color:#44ff06
}

body .content .row .footer-white .container .top .contacts .item,body .content .row-black .footer-white .container .top .contacts .item,body .content .row-grey .footer-white .container .top .contacts .item {
  font-size:14px;display:-webkit-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column;padding-right:48px
}

body .content .row .footer-white .container .top .contacts .item .title,body .content .row-black .footer-white .container .top .contacts .item .title,body .content .row-grey .footer-white .container .top .contacts .item .title {
  color:#000;font-weight:500;text-transform:uppercase;padding-bottom:5px;letter-spacing:.55px;line-height:24px
}

body .content .row .footer-white .container .top .contacts .item span,body .content .row-black .footer-white .container .top .contacts .item span,body .content .row-grey .footer-white .container .top .contacts .item span {
  color:#828282;line-height:16px;font-weight:300;-webkit-transition:.5s ease 0s;transition:.5s ease 0s
}

body .content .row .footer-white .container .top .contacts .item a,body .content .row-black .footer-white .container .top .contacts .item a,body .content .row-grey .footer-white .container .top .contacts .item a {
  text-decoration:none;line-height:16px
}

body .content .row .footer-white .container .top .contacts .item a span,body .content .row-black .footer-white .container .top .contacts .item a span,body .content .row-grey .footer-white .container .top .contacts .item a span {
  color:#828282;line-height:16px;font-weight:300;-webkit-transition:.5s ease 0s;transition:.5s ease 0s
}

body .content .row .footer-white .container .top .contacts .item a span:hover,body .content .row-black .footer-white .container .top .contacts .item a span:hover,body .content .row-grey .footer-white .container .top .contacts .item a span:hover {
  color:#44ff06
}

body .content .row .projects a .item .rollover .text,body .content .row-black .projects a .item .rollover .text,body .content .row-grey .projects a .item .rollover .text {
  width:100%;padding:5px 0;height:auto
}

body .content .row .projects a .item .item__background img,body .content .row-black .projects a .item .item__background img,body .content .row-grey .projects a .item .item__background img {
  height:auto;width:100%
}

body .content .row .projects a .item-text,body .content .row-black .projects a .item-text,body .content .row-grey .projects a .item-text {
  height:100%
}

body .content .row .projects a .item-text .text,body .content .row-black .projects a .item-text .text,body .content .row-grey .projects a .item-text .text {
  width:calc(100% - 50px);padding:25px;height:auto
}

body .content .row .projects a .item-text .text h2,body .content .row-black .projects a .item-text .text h2,body .content .row-grey .projects a .item-text .text h2 {
  width:90%
}

body .content .row .details-project .content .item p,body .content .row .details-project-responsive .content .item p,body .content .row-black .details-project .content .item p,body .content .row-black .details-project-responsive .content .item p,body .content .row-grey .details-project .content .item p,body .content .row-grey .details-project-responsive .content .item p {
  width:100%
}

body .content .row .carousel,body .content .row-black .carousel,body .content .row-grey .carousel {
  -webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;-webkit-flex-direction:row;flex-direction:row
}

body .content .row .carousel .item,body .content .row-black .carousel .item,body .content .row-grey .carousel .item {
  width:50%;height:389px
}

body .content .row .careers,body .content .row .filter .filter-section,body .content .row .filter .rollover ul,body .content .row .offices,body .content .row-black .careers,body .content .row-black .filter .filter-section,body .content .row-black .filter .rollover ul,body .content .row-black .offices,body .content .row-grey .careers,body .content .row-grey .filter .filter-section,body .content .row-grey .filter .rollover ul,body .content .row-grey .offices {
  max-width:960px
}

body .content .row .careers .item,body .content .row .offices .item,body .content .row-black .careers .item,body .content .row-black .offices .item,body .content .row-grey .careers .item,body .content .row-grey .offices .item {
  width:100%;padding-bottom:48px
}

body .content .row .careers,body .content .row .careers .webs .item,body .content .row-black .careers,body .content .row-black .careers .webs .item,body .content .row-grey .careers,body .content .row-grey .careers .webs .item {
  padding:0
}

body .content .row .careers .item .title .line,body .content .row .offices .item .title .line,body .content .row-black .careers .item .title .line,body .content .row-black .offices .item .title .line,body .content .row-grey .careers .item .title .line,body .content .row-grey .offices .item .title .line {
  width:48px;height:2px;background:#44ff06;margin:23px 0 5px
}

body .content .row .careers .item .details,body .content .row .offices .item .details,body .content .row-black .careers .item .details,body .content .row-black .offices .item .details,body .content .row-grey .careers .item .details,body .content .row-grey .offices .item .details {
  font-size:15px;line-height:20px
}

body .content .row .careers .item .details .adress,body .content .row .careers .item .details .e-contacts,body .content .row .offices .item .details .adress,body .content .row .offices .item .details .e-contacts,body .content .row-black .careers .item .details .adress,body .content .row-black .careers .item .details .e-contacts,body .content .row-black .offices .item .details .adress,body .content .row-black .offices .item .details .e-contacts,body .content .row-grey .careers .item .details .adress,body .content .row-grey .careers .item .details .e-contacts,body .content .row-grey .offices .item .details .adress,body .content .row-grey .offices .item .details .e-contacts {
  margin-bottom:18px
}

body .content .row .careers .item .details .google-maps,body .content .row .offices .item .details .google-maps,body .content .row-black .careers .item .details .google-maps,body .content .row-black .offices .item .details .google-maps,body .content .row-grey .careers .item .details .google-maps,body .content .row-grey .offices .item .details .google-maps {
  margin-top:35px
}

body .content .row .careers .item .details .google-maps .button,body .content .row .offices .item .details .google-maps .button,body .content .row-black .careers .item .details .google-maps .button,body .content .row-black .offices .item .details .google-maps .button,body .content .row-grey .careers .item .details .google-maps .button,body .content .row-grey .offices .item .details .google-maps .button {
  width:30px;height:30px
}

body .content .row .careers .item .details .google-maps .button i,body .content .row .offices .item .details .google-maps .button i,body .content .row-black .careers .item .details .google-maps .button i,body .content .row-black .offices .item .details .google-maps .button i,body .content .row-grey .careers .item .details .google-maps .button i,body .content .row-grey .offices .item .details .google-maps .button i {
  font-size:22px
}

body .content .row .projects a .item,body .content .row .projects a .item-text,body .content .row-black .projects a .item,body .content .row-black .projects a .item-text,body .content .row-grey .projects a .item,body .content .row-grey .projects a .item-text {
  width:100%;height:auto;margin:0 auto
}

body .content .row .projects a .item .rollover,body .content .row .projects a .item-text .rollover,body .content .row-black .projects a .item .rollover,body .content .row-black .projects a .item-text .rollover,body .content .row-grey .projects a .item .rollover,body .content .row-grey .projects a .item-text .rollover {
  height:auto
}

body .content .row .projects a .item .rollover .text,body .content .row .projects a .item-text .rollover .text,body .content .row-black .projects a .item .rollover .text,body .content .row-black .projects a .item-text .rollover .text,body .content .row-grey .projects a .item .rollover .text,body .content .row-grey .projects a .item-text .rollover .text {
  width:100%;height:auto;background:#FFF;z-index:99;position:relative;bottom:0;padding:15px 0;-webkit-box-pack:end;-ms-flex-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column
}

body .content .row .projects a .item .rollover .text .project-name,body .content .row .projects a .item-text .rollover .text .project-name,body .content .row-black .projects a .item .rollover .text .project-name,body .content .row-black .projects a .item-text .rollover .text .project-name,body .content .row-grey .projects a .item .rollover .text .project-name,body .content .row-grey .projects a .item-text .rollover .text .project-name {
  width:100%
}

body .content .row .projects a .item .rollover .text .project-name p,body .content .row .projects a .item-text .rollover .text .project-name p,body .content .row-black .projects a .item .rollover .text .project-name p,body .content .row-black .projects a .item-text .rollover .text .project-name p,body .content .row-grey .projects a .item .rollover .text .project-name p,body .content .row-grey .projects a .item-text .rollover .text .project-name p {
  font-size:14px;line-height:19px;letter-spacing:.03em;font-weight:900;margin:0
}

body .content .row .projects a .item .rollover .text .project-name span,body .content .row .projects a .item-text .rollover .text .project-name span,body .content .row-black .projects a .item .rollover .text .project-name span,body .content .row-black .projects a .item-text .rollover .text .project-name span,body .content .row-grey .projects a .item .rollover .text .project-name span,body .content .row-grey .projects a .item-text .rollover .text .project-name span {
  font-size:14px;line-height:11px;letter-spacing:.03em;font-weight:400;padding-top:0
}

body .content .row .projects a .item .rollover .text h2,body .content .row .projects a .item-text .rollover .text h2,body .content .row-black .projects a .item .rollover .text h2,body .content .row-black .projects a .item-text .rollover .text h2,body .content .row-grey .projects a .item .rollover .text h2,body .content .row-grey .projects a .item-text .rollover .text h2 {
  font-size:14px;line-height:19px;font-weight:400;margin-top:10px;display:block;text-align:left;width:100%
}

body .content .row .projects a .item .rollover .text h2 p,body .content .row .projects a .item-text .rollover .text h2 p,body .content .row-black .projects a .item .rollover .text h2 p,body .content .row-black .projects a .item-text .rollover .text h2 p,body .content .row-grey .projects a .item .rollover .text h2 p,body .content .row-grey .projects a .item-text .rollover .text h2 p {
  margin:0;font-weight:400
}

body .content .row .projects a .item-text .text,body .content .row-black .projects a .item-text .text,body .content .row-grey .projects a .item-text .text {
  width:calc(100% - 50px);z-index:99;position:absolute;bottom:0;padding:20px 25px;-webkit-box-pack:end;-ms-flex-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end
}

body .content .row .projects a .item-text .text span,body .content .row-black .projects a .item-text .text span,body .content .row-grey .projects a .item-text .text span {
  font-size:14px
}

body .content .row .projects a .item-text .text span .line,body .content .row-black .projects a .item-text .text span .line,body .content .row-grey .projects a .item-text .text span .line {
  width:30px;height:1px;margin:5px 0
}

body .content .row .projects a .item-text .text h2,body .content .row-black .projects a .item-text .text h2,body .content .row-grey .projects a .item-text .text h2 {
  font-size:15px;line-height:18px;margin:10px 0;font-weight:300
}

body .content .row .projects a .item-text .text h2 i,body .content .row-black .projects a .item-text .text h2 i,body .content .row-grey .projects a .item-text .text h2 i {
  font-size:8px
}

body .content .row .projects a .item-text .text .button,body .content .row-black .projects a .item-text .text .button,body .content .row-grey .projects a .item-text .text .button {
  width:26px;height:26px
}

body .content .row .projects a .item-text .text .button i,body .content .row-black .projects a .item-text .text .button i,body .content .row-grey .projects a .item-text .text .button i {
  font-size:22px
}

body .content .row .carousel,body .content .row-black .carousel,body .content .row-grey .carousel {
  -webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column
}

body .content .row #features .row-content .text-content ul,body .content .row .carousel .item,body .content .row-black #features .row-content .text-content ul,body .content .row-black .carousel .item,body .content .row-grey #features .row-content .text-content ul,body .content .row-grey .carousel .item {
  width:100%
}

body .content .row .footer-white .container .top .contacts .item,body .content .row footer .container .top .contacts .item,body .content .row-black .footer-white .container .top .contacts .item,body .content .row-black footer .container .top .contacts .item,body .content .row-grey .footer-white .container .top .contacts .item,body .content .row-grey footer .container .top .contacts .item {
  padding-bottom:35px;padding-right:50px
}

body .content .row .careers .item,body .content .row .offices .item,body .content .row-black .careers .item,body .content .row-black .offices .item,body .content .row-grey .careers .item,body .content .row-grey .offices .item {
  width:100%;padding-bottom:48px
}

body .content .row .careers,body .content .row .careers .webs .item,body .content .row-black .careers,body .content .row-black .careers .webs .item,body .content .row-grey .careers,body .content .row-grey .careers .webs .item {
  padding:0
}

body .content .row .careers .item .title .line,body .content .row .offices .item .title .line,body .content .row-black .careers .item .title .line,body .content .row-black .offices .item .title .line,body .content .row-grey .careers .item .title .line,body .content .row-grey .offices .item .title .line {
  width:48px;height:2px;background:#44ff06;margin:10px 0 5px
}

body .content .row .careers .item .details,body .content .row .offices .item .details,body .content .row-black .careers .item .details,body .content .row-black .offices .item .details,body .content .row-grey .careers .item .details,body .content .row-grey .offices .item .details {
  font-size:15px;line-height:20px
}

body .content .row .careers .item .details .adress,body .content .row .careers .item .details .e-contacts,body .content .row .offices .item .details .adress,body .content .row .offices .item .details .e-contacts,body .content .row-black .careers .item .details .adress,body .content .row-black .careers .item .details .e-contacts,body .content .row-black .offices .item .details .adress,body .content .row-black .offices .item .details .e-contacts,body .content .row-grey .careers .item .details .adress,body .content .row-grey .careers .item .details .e-contacts,body .content .row-grey .offices .item .details .adress,body .content .row-grey .offices .item .details .e-contacts {
  margin-bottom:18px
}

body .content .row .careers .item .details .google-maps,body .content .row .offices .item .details .google-maps,body .content .row-black .careers .item .details .google-maps,body .content .row-black .offices .item .details .google-maps,body .content .row-grey .careers .item .details .google-maps,body .content .row-grey .offices .item .details .google-maps {
  margin-top:35px
}

body .content .row .careers .item .details .google-maps .button,body .content .row .offices .item .details .google-maps .button,body .content .row-black .careers .item .details .google-maps .button,body .content .row-black .offices .item .details .google-maps .button,body .content .row-grey .careers .item .details .google-maps .button,body .content .row-grey .offices .item .details .google-maps .button {
  width:30px;height:30px
}

body .content .row .careers .item .details .google-maps .button i,body .content .row .offices .item .details .google-maps .button i,body .content .row-black .careers .item .details .google-maps .button i,body .content .row-black .offices .item .details .google-maps .button i,body .content .row-grey .careers .item .details .google-maps .button i,body .content .row-grey .offices .item .details .google-maps .button i {
  font-size:22px
}

body .content .row .projects a .item,body .content .row .projects a .item-text,body .content .row-black .projects a .item,body .content .row-black .projects a .item-text,body .content .row-grey .projects a .item,body .content .row-grey .projects a .item-text {
  width:100%;min-height:auto;height:100%
}

body .content .row .projects a .item .item__background img,body .content .row .projects a .item-text .item__background img,body .content .row-black .projects a .item .item__background img,body .content .row-black .projects a .item-text .item__background img,body .content .row-grey .projects a .item .item__background img,body .content .row-grey .projects a .item-text .item__background img {
  width:100%;height:100%
}

body .content .row .projects a .item .rollover,body .content .row .projects a .item-text .rollover,body .content .row-black .projects a .item .rollover,body .content .row-black .projects a .item-text .rollover,body .content .row-grey .projects a .item .rollover,body .content .row-grey .projects a .item-text .rollover {
  overflow:visible;height:auto
}

body .content .row .projects a .item .rollover .text,body .content .row .projects a .item-text .rollover .text,body .content .row-black .projects a .item .rollover .text,body .content .row-black .projects a .item-text .rollover .text,body .content .row-grey .projects a .item .rollover .text,body .content .row-grey .projects a .item-text .rollover .text {
  width:100%;height:auto;background:#FFF;z-index:99;position:relative;bottom:0;padding:10px 0;-webkit-box-pack:end;-ms-flex-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end
}

body .content .row .projects a .item .rollover .text .project-name,body .content .row .projects a .item-text .rollover .text .project-name,body .content .row-black .projects a .item .rollover .text .project-name,body .content .row-black .projects a .item-text .rollover .text .project-name,body .content .row-grey .projects a .item .rollover .text .project-name,body .content .row-grey .projects a .item-text .rollover .text .project-name {
  width:100%
}

body .content .row .projects a .item .rollover .text .project-name p,body .content .row .projects a .item-text .rollover .text .project-name p,body .content .row-black .projects a .item .rollover .text .project-name p,body .content .row-black .projects a .item-text .rollover .text .project-name p,body .content .row-grey .projects a .item .rollover .text .project-name p,body .content .row-grey .projects a .item-text .rollover .text .project-name p {
  font-size:14px;line-height:19px;letter-spacing:.03em;font-weight:900;margin:0
}

body .content .row .projects a .item .rollover .text .project-name span,body .content .row .projects a .item-text .rollover .text .project-name span,body .content .row-black .projects a .item .rollover .text .project-name span,body .content .row-black .projects a .item-text .rollover .text .project-name span,body .content .row-grey .projects a .item .rollover .text .project-name span,body .content .row-grey .projects a .item-text .rollover .text .project-name span {
  font-size:14px;line-height:11px;letter-spacing:.03em;font-weight:400;padding-top:0
}

body .content .row .projects a .item .rollover .text h2,body .content .row .projects a .item-text .rollover .text h2,body .content .row-black .projects a .item .rollover .text h2,body .content .row-black .projects a .item-text .rollover .text h2,body .content .row-grey .projects a .item .rollover .text h2,body .content .row-grey .projects a .item-text .rollover .text h2 {
  font-size:14px;line-height:19px;font-weight:400;margin-top:5px;text-align:right;width:80%;opacity:0;display:none
}

body .content .row .projects a .item .rollover .text h2 p,body .content .row .projects a .item-text .rollover .text h2 p,body .content .row-black .projects a .item .rollover .text h2 p,body .content .row-black .projects a .item-text .rollover .text h2 p,body .content .row-grey .projects a .item .rollover .text h2 p,body .content .row-grey .projects a .item-text .rollover .text h2 p {
  margin:0;font-weight:400
}

body .content .row .projects a .item-text .text,body .content .row-black .projects a .item-text .text,body .content .row-grey .projects a .item-text .text {
  width:calc(100% - 50px);z-index:99;position:relative;bottom:0;padding:20px 25px;-webkit-box-pack:end;-ms-flex-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end;min-height:315px
}

body .content .row .projects a .item-text .text span,body .content .row-black .projects a .item-text .text span,body .content .row-grey .projects a .item-text .text span {
  font-size:14px
}

body .content .row .projects a .item-text .text span .line,body .content .row-black .projects a .item-text .text span .line,body .content .row-grey .projects a .item-text .text span .line {
  width:30px;height:1px;margin:5px 0
}

body .content .row .projects a .item-text .text h2,body .content .row-black .projects a .item-text .text h2,body .content .row-grey .projects a .item-text .text h2 {
  font-size:15px;line-height:18px;margin:10px 0;font-weight:300
}

body .content .row .projects a .item-text .text h2 i,body .content .row-black .projects a .item-text .text h2 i,body .content .row-grey .projects a .item-text .text h2 i {
  font-size:8px
}

body .content .row .projects a .item-text .text .button,body .content .row-black .projects a .item-text .text .button,body .content .row-grey .projects a .item-text .text .button {
  width:26px;height:26px
}

body .content .row .projects a .item-text .text .button i,body .content .row-black .projects a .item-text .text .button i,body .content .row-grey .projects a .item-text .text .button i {
  font-size:22px
}

body .content .row .carousel,body .content .row-black .carousel,body .content .row-grey .carousel {
  -webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column
}

body .content .row .carousel .item,body .content .row-black .carousel .item,body .content .row-grey .carousel .item {
  width:100%;height:243px
}

body .content .row .footer-white .container .top .contacts .item,body .content .row footer .container .top .contacts .item,body .content .row-black .footer-white .container .top .contacts .item,body .content .row-black footer .container .top .contacts .item,body .content .row-grey .footer-white .container .top .contacts .item,body .content .row-grey footer .container .top .contacts .item {
  padding-bottom:35px;padding-right:0
}

.mobile-video-bg {
  height:100%;width:100%;background-repeat:no-repeat;background-size:cover;background-position:50% 50%
}

.projects-home .item__background {
  height:auto
}

.owl-carousel .owl-item.active {
  z-index:9;left:0!important
}

.arrow-container {
  position:absolute;top:0;width:0;height:100%;z-index:99
}

.arrow-container {
  display:none
}

.arrow-container {
  display:none
}

.arrow-container .slide-button:hover {
  opacity:.6
}

.arrow-container--left {
  left:0
}

.arrow-container--right {
  right:0
}

[data-cmp=carousel] {
  position:relative;width:100%;height:calc(100vh - 63px);background:#fff;overflow:hidden;font-family:"Helvetica Neue",arial,sans-serif;margin-top:63px
}

[data-cmp=carousel] .item.black .cta:hover .button,[data-cmp=carousel] .item.white .cta:hover .button {
  background:url(../images/arrow-green.svg) center no-repeat
}

[data-cmp=carousel] {
  margin-top:85px;height:calc(100vh - 85px);float:left
}

[data-cmp=carousel] {
  margin-top:76px;height:calc(100vh - 76px);float:left
}

[data-cmp=carousel] .items {
  padding:0;margin:0;list-style-type:none;-webkit-transition:opacity 1s;transition:opacity 1s
}

[data-cmp=carousel] .bg,[data-cmp=carousel] .item,[data-cmp=carousel] .items {
  position:absolute;left:0;top:0;width:100%;height:100%;z-index:1
}

[data-cmp=carousel] .item {
  z-index:2;pointer-events:none;opacity:0;overflow:hidden;-webkit-backface-visibility:hidden;backface-visibility:hidden
}

[data-cmp=carousel] .item .mobile {
  display:none
}

[data-cmp=carousel] .item .mobile {
  display:none
}

[data-cmp=carousel] .item .pc {
  display:block
}

[data-cmp=carousel] .item .mobile {
  display:block
}

[data-cmp=carousel] .item .pc {
  display:block
}

[data-cmp=carousel] .item .mobile {
  display:block
}

[data-cmp=carousel] .item .pc {
  display:none
}

[data-cmp=carousel] .item.trans {
  z-index:3;opacity:1
}

[data-cmp=carousel] .item.safari-trans {
  z-index:-1!important
}

[data-cmp=carousel] .item.active {
  z-index:2;pointer-events:inherit;opacity:1;-webkit-backface-visibility:hidden;backface-visibility:hidden
}

[data-cmp=carousel] .item.white .title {
  color:#fff
}

[data-cmp=carousel] .item.white .cta {
  color:#fff;-webkit-transition:.7s ease 0s;transition:.7s ease 0s
}

[data-cmp=carousel] .item.white .cta:hover {
  color:#44ff06
}

[data-cmp=carousel] .item.black .title {
  color:#000
}

[data-cmp=carousel] .item.black .cta {
  color:#000;-webkit-transition:.7s ease 0s;transition:.7s ease 0s
}

[data-cmp=carousel] .item.black .cta:hover,[data-cmp=carousel] .item.green .title {
  color:#44ff06
}

[data-cmp=carousel] .item.black .button,[data-cmp=carousel] .item.green .cta:hover .button {
  background:url(../images/arrow.svg) center no-repeat
}

[data-cmp=carousel] .item.green .cta {
  color:#44ff06;-webkit-transition:.7s ease 0s;transition:.7s ease 0s
}

[data-cmp=carousel] .item.green .button {
  background:url(../images/arrow-green.svg) center no-repeat
}

[data-cmp=carousel] .content {
  position:absolute;left:0;bottom:180px;z-index:2;width:100%;background:0 0
}

[data-cmp=carousel] .content {
  bottom:80px
}

[data-cmp=carousel] .content .content-inner {
  max-width:1200px;width:100%;padding:0 20px;margin:0 auto
}

[data-cmp=carousel] .item .pc {
  display:none
}

[data-cmp=carousel] .content {
  bottom:150px
}

[data-cmp=carousel] .content .content-inner {
  padding:0 25px
}

[data-cmp=carousel] .nav {
  position:absolute;left:0;bottom:80px;width:100%;z-index:10
}

[data-cmp=carousel] .content .content-inner {
  padding:0 25px
}

[data-cmp=carousel] .nav {
  bottom:40px
}

[data-cmp=carousel] .nav .pages {
  padding:0;margin:0;font-size:0;text-align:center;list-style-type:none
}

[data-cmp=carousel] .nav {
  bottom:110px!important
}

[data-cmp=carousel] .nav .pages {
  display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;padding:0 15px!important;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center
}

[data-cmp=carousel] .nav .page {
  position:relative;display:inline-block;width:50px;height:32px;margin:0 8px;cursor:pointer
}

[data-cmp=carousel] .nav .page {
  width:20px
}

[data-cmp=carousel] .nav .page.active {
  cursor:default
}

[data-cmp=carousel] .nav .page.active .meter {
  width:100%
}

[data-cmp=carousel] .nav .bar,[data-cmp=carousel] .nav .meter {
  position:absolute;left:0;top:50%;margin:-1 0 0;width:100%;height:1px
}

[data-cmp=carousel] .nav .bar {
  background:#7b7a7a
}

[data-cmp=carousel] .nav .meter {
  background:#ebebeb;width:0
}

[data-cmp=carousel] .bg,[data-cmp=carousel] .bg-box::after {
  background-size:cover;background-repeat:no-repeat;background-position:50% 0
}

[data-cmp=carousel] .bg-box {
  position:absolute;left:0;top:0;width:100%;height:100%;z-index:1;overflow:hidden
}

[data-cmp=carousel] .bg-box::after {
  content:'';position:absolute;width:100%;height:100%;top:0;left:0;background-image:url(../images/bg-layer.svg);z-index:1
}

[data-cmp=carousel] .title {
  color:#fff;padding:0;margin:0;font-weight:400;font-size:50px;line-height:1.2em;font-family:Roboto,sans-serif
}

[data-cmp=carousel] .title {
  font-size:30px
}

[data-cmp=carousel] .bg {
  background-attachment:inherit
}

[data-cmp=carousel] .title {
  font-size:20px
}

[data-cmp=carousel] .cta {
  display:inline-block;text-decoration:none;color:#fff;outline:0;font-size:18px;line-height:1.4;margin-top:20px;font-family:Roboto,sans-serif
}

[data-cmp=carousel] .cta span {
  display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-align-content:center;-ms-flex-line-pack:center;align-content:center
}

[data-cmp=carousel] .cta span {
  font-size:13px
}

[data-cmp=carousel] .cta {
  font-size:15px
}

[data-cmp=carousel] .cta {
  font-size:15px
}

[data-cmp=carousel] .cta .button {
  width:23px;height:9px;background:url(../images/arrow-white.svg) center no-repeat
}

[data-cmp=carousel] .cta .button {
  width:30px;height:20px
}

.home-carousel {
  position:fixed;-webkit-transform:scale(1) translateY(0);transform:scale(1) translateY(0);-webkit-transition:-webkit-transform 2s;transition:-webkit-transform 2s;transition:transform 2s;transition:transform 2s,-webkit-transform 2s;-webkit-transition-timing-function:cubic-bezier(.215,.61,.355,1);transition-timing-function:cubic-bezier(.215,.61,.355,1)
}

.scrollify-sect-inactive .home-carousel {
  -webkit-transform:scale(1) translateY(-50%);transform:scale(1) translateY(-50%)
}

.scrollify-sect-inactive .home-carousel .items {
  opacity:.5
}

.ani-slide-up {
  -webkit-transition:opacity 750ms,-webkit-transform 750ms;transition:opacity 750ms,-webkit-transform 750ms;transition:transform 750ms,opacity 750ms;transition:transform 750ms,opacity 750ms,-webkit-transform 750ms;-webkit-transform:translateY(20px);transform:translateY(20px);opacity:0
}

.ani-slide-up.ani-go {
  -webkit-transform:none;transform:none;opacity:1
}

.projects-home .item__background {
  width:100%;height:100%;background-size:cover
}

.fullscreen-bg__video {
  width:100%;height:100vh;-o-object-fit:cover;object-fit:cover
}

/*!
 * animate.css -http://daneden.me/animate
 * Version - 3.5.2
 * Licensed under the MIT license - http://opensource.org/licenses/MIT
 *
 * Copyright (c) 2017 Daniel Eden
 */.animated {
  animation-duration:1.5s;animation-fill-mode:both
}

.animated.infinite {
  animation-iteration-count:infinite
}

.animated.hinge {
  animation-duration:2s
}

.animated.bounceIn,.animated.bounceOut,.animated.flipOutX,.animated.flipOutY {
  animation-duration:.75s
}

.animated.flip {
  -webkit-backface-visibility:visible;backface-visibility:visible;animation-name:flip
}

/* Extra custom styles for modern premium look */

/* Fix navbar styling */
header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
  background: rgba(11, 11, 11, 0.95);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  transition: all 0.3s ease;
}

header.scrolled {
  background: rgba(11, 11, 11, 0.98);
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.2);
}

header .nav-menu {
  height: 85px;
  display: flex;
  align-items: center;
}

header .nav-menu .container {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

header .logo-container img {
  height: 40px;
  width: auto;
  object-fit: contain;
}

header .nav {
  display: flex;
  align-items: center;
  gap: 30px;
}

header .nav li {
  position: relative;
}

header .nav li a {
  color: var(--text-light);
  font-family: 'Outfit', sans-serif;
  font-size: 14px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 10px 0;
  transition: color var(--transition-speed) ease;
}

header .nav li a:hover {
  color: var(--hover-blue); /* PC hover low-sat blue as recommended */
}

/* Services Dropdown Styles */
header .nav li.dropdown:hover .dropdown-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

header .nav .dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  width: 260px;
  background: #151515;
  border: 1px solid rgba(255, 255, 255, 0.1);
  padding: 20px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: all 0.3s ease;
  z-index: 1001;
  box-shadow: 0 10px 30px rgba(0,0,0,0.5);
}

header .nav .dropdown-menu .dropdown-category {
  margin-bottom: 15px;
}

header .nav .dropdown-menu .dropdown-category:last-child {
  margin-bottom: 0;
}

header .nav .dropdown-menu .category-title {
  color: var(--accent-color);
  font-family: 'Outfit', sans-serif;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 8px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  padding-bottom: 4px;
}

header .nav .dropdown-menu ul {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

header .nav .dropdown-menu ul li a {
  font-size: 12px;
  color: #ccc;
  text-transform: none;
  padding: 2px 0;
  display: block;
}

header .nav .dropdown-menu ul li a:hover {
  color: var(--accent-color);
  padding-left: 5px;
  transition: all 0.2s ease;
}

/* Carousel Meter Animation */
[data-cmp=carousel] .nav .page.active .meter {
  animation: fillMeter 5s linear forwards;
}

@keyframes fillMeter {
  from { width: 0%; }
  to { width: 100%; }
}

/* Hero Carousel Content Refinements */
[data-cmp=carousel] {
  height: 100vh;
  margin-top: 0;
}

[data-cmp=carousel] .item .bg {
  background-size: cover;
  background-position: center;
  transition: transform 8s ease;
}

[data-cmp=carousel] .item.active .bg {
  transform: scale(1.05);
}

[data-cmp=carousel] .content {
  bottom: 20%;
  text-align: left;
}

[data-cmp=carousel] .content .content-inner h2.title {
  font-family: 'Outfit', sans-serif;
  font-size: 64px;
  font-weight: 800;
  text-shadow: 0 4px 20px rgba(0,0,0,0.6);
  margin-bottom: 20px;
}

[data-cmp=carousel] .cta {
  background: rgba(255, 255, 255, 0.1);
  padding: 12px 30px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 30px;
  backdrop-filter: blur(5px);
  font-weight: 600;
  transition: all 0.3s ease;
}

[data-cmp=carousel] .cta:hover {
  background: var(--accent-color);
  color: var(--primary-color) !important;
  border-color: var(--accent-color);
}

/* Services Page Section */
.services-section {
  padding: 100px 0;
  background: #ffffff;
}

.services-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 30px;
  margin-top: 50px;
}

.service-card {
  background: #fbfbfb;
  border: 1px solid #eee;
  padding: 40px 30px;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}

.service-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 0;
  background: var(--accent-color);
  transition: height 0.3s ease;
}

.service-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 30px rgba(0,0,0,0.05);
}

.service-card:hover::before {
  height: 100%;
}

.service-card .icon {
  font-size: 36px;
  color: #333;
  margin-bottom: 20px;
}

.service-card h3 {
  font-family: 'Outfit', sans-serif;
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 15px;
}

.service-card p {
  font-size: 14px;
  color: #666;
  margin-bottom: 20px;
}

.service-card ul {
  list-style: none;
  font-size: 13px;
  color: #555;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.service-card ul li i {
  color: var(--accent-color);
  margin-right: 5px;
}

/* Projects grid and filters */
.projects-section {
  padding: 100px 0;
  background: #111111;
  color: #fff;
}

.section-header {
  text-align: center;
  margin-bottom: 60px;
}

.section-header h2 {
  font-family: 'Outfit', sans-serif;
  font-size: 40px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  position: relative;
  display: inline-block;
  padding-bottom: 15px;
}

.section-header h2::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 60px;
  height: 3px;
  background: var(--accent-color);
}

.filter-container {
  display: flex;
  justify-content: center;
  gap: 15px;
  margin-bottom: 40px;
  flex-wrap: wrap;
}

.filter-btn {
  background: transparent;
  color: #aaa;
  border: 1px solid #333;
  padding: 10px 25px;
  font-size: 13px;
  font-weight: 500;
  text-transform: uppercase;
  border-radius: 20px;
  cursor: pointer;
  transition: all 0.3s ease;
}

.filter-btn:hover, .filter-btn.active {
  color: var(--accent-color);
  border-color: var(--accent-color);
}

/* Projects Showcase layout */
.projects-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 40px;
}

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

.project-box {
  position: relative;
  overflow: hidden;
  background: #000;
  aspect-ratio: 16/10;
}

.project-box img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.project-box:hover img {
  transform: scale(1.05);
}

.project-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.85);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 40px;
  opacity: 0;
  transition: opacity 0.4s ease;
  z-index: 2;
}

.project-box:hover .project-overlay {
  opacity: 1;
}

.project-overlay .project-category {
  color: var(--accent-color);
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  margin-bottom: 10px;
}

.project-overlay h3 {
  font-family: 'Outfit', sans-serif;
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 10px;
  color: #fff;
}

.project-overlay p {
  font-size: 14px;
  color: #ccc;
  margin-bottom: 20px;
  line-height: 1.5;
}

.project-overlay .btn-view {
  align-self: flex-start;
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  border-bottom: 1px solid var(--accent-color);
  padding-bottom: 4px;
  transition: color 0.3s ease;
}

.project-overlay .btn-view:hover {
  color: var(--accent-color);
}

/* Project Detail Modal */
.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.9);
  z-index: 2000;
  opacity: 0;
  visibility: hidden;
  transition: all 0.4s ease;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 20px;
}

.modal-overlay.active {
  opacity: 1;
  visibility: visible;
}

.modal-container {
  background: #111;
  border: 1px solid #333;
  width: 100%;
  max-width: 900px;
  max-height: 90vh;
  overflow-y: auto;
  position: relative;
  color: #fff;
  border-radius: 8px;
}

.modal-close {
  position: absolute;
  top: 20px;
  right: 20px;
  background: rgba(0,0,0,0.5);
  border: none;
  color: #fff;
  font-size: 28px;
  cursor: pointer;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 10;
  transition: all 0.3s ease;
}

.modal-close:hover {
  background: var(--accent-color);
  color: var(--primary-color);
}

.modal-image {
  width: 100%;
  height: auto;
  max-height: 450px;
  object-fit: cover;
  display: block;
}

.modal-body {
  padding: 40px;
}

.modal-body .meta {
  display: flex;
  gap: 30px;
  margin-bottom: 20px;
  font-size: 13px;
  color: #888;
  border-bottom: 1px solid #222;
  padding-bottom: 15px;
}

.modal-body .meta span strong {
  color: #fff;
}

.modal-body h3 {
  font-family: 'Outfit', sans-serif;
  font-size: 32px;
  margin-bottom: 15px;
}

.modal-body p {
  color: #ccc;
  font-size: 15px;
  line-height: 1.7;
}

/* About Section */
.about-section {
  padding: 100px 0;
  background: #fdfdfd;
}

.about-grid {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 50px;
  align-items: center;
}

@media (max-width: 768px) {
  .about-grid {
    grid-template-columns: 1fr;
    gap: 30px;
  }
}

.about-left {
  position: relative;
  border-left: 5px solid var(--accent-color);
  padding-left: 30px;
}

.about-left h2 {
  font-family: 'Outfit', sans-serif;
  font-size: 80px;
  line-height: 1.1;
  font-weight: 800;
  color: #eeeeee;
  margin-bottom: 10px;
}

.about-left h3 {
  font-family: 'Outfit', sans-serif;
  font-size: 36px;
  font-weight: 700;
  color: var(--primary-color);
}

.about-right p {
  font-size: 16px;
  color: #555;
  margin-bottom: 20px;
  line-height: 1.8;
}

.about-right .company-stats {
  display: flex;
  gap: 40px;
  margin-top: 30px;
}

.stat-item h4 {
  font-family: 'Outfit', sans-serif;
  font-size: 32px;
  color: var(--primary-color);
  font-weight: 700;
  margin-bottom: 5px;
}

.stat-item p {
  font-size: 13px;
  color: #888;
  margin-bottom: 0;
}

/* Blog Section */
.blog-section {
  padding: 100px 0;
  background: #f5f5f5;
}

.blog-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 30px;
  margin-top: 50px;
}

.blog-card {
  background: #fff;
  border: 1px solid #eaeaea;
  box-shadow: 0 5px 15px rgba(0,0,0,0.02);
  transition: all 0.3s ease;
}

.blog-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 15px 35px rgba(0,0,0,0.05);
}

.blog-card .card-img {
  width: 100%;
  height: 200px;
  object-fit: cover;
}

.blog-card .card-body {
  padding: 30px;
}

.blog-card .card-date {
  font-size: 12px;
  color: var(--text-muted);
  text-transform: uppercase;
  margin-bottom: 10px;
  display: block;
}

.blog-card h3 {
  font-family: 'Outfit', sans-serif;
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 15px;
  line-height: 1.4;
}

.blog-card h3 a:hover {
  color: var(--hover-blue);
}

.blog-card p {
  font-size: 14px;
  color: #666;
  margin-bottom: 20px;
}

.blog-card .btn-read {
  font-size: 13px;
  font-weight: 600;
  color: var(--primary-color);
  border-bottom: 1px solid var(--primary-color);
  padding-bottom: 2px;
  transition: all 0.3s ease;
}

.blog-card .btn-read:hover {
  color: var(--hover-blue);
  border-color: var(--hover-blue);
}

/* Contact Section */
.contact-section {
  padding: 100px 0;
  background: #ffffff;
}

.contact-grid {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 50px;
}

@media (max-width: 768px) {
  .contact-grid {
    grid-template-columns: 1fr;
    gap: 30px;
  }
}

.contact-info {
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.info-item {
  display: flex;
  gap: 20px;
  align-items: flex-start;
}

.info-item .icon {
  font-size: 24px;
  color: var(--accent-color);
  background: #111;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
}

.info-item h4 {
  font-family: 'Outfit', sans-serif;
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 5px;
}

.info-item p, .info-item a {
  font-size: 14px;
  color: #666;
  line-height: 1.5;
}

.info-item a:hover {
  color: var(--accent-color);
}

/* Contact Form */
.contact-form {
  background: #fbfbfb;
  border: 1px solid #eee;
  padding: 40px;
}

.form-group {
  margin-bottom: 20px;
}

.form-group label {
  display: block;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  margin-bottom: 8px;
  color: #333;
}

.form-control {
  width: 100%;
  padding: 12px 15px;
  border: 1px solid #ddd;
  background: #fff;
  color: #333;
  font-family: inherit;
  font-size: 14px;
  border-radius: 4px;
  transition: border-color 0.3s ease;
}

.form-control:focus {
  outline: none;
  border-color: var(--primary-color);
}

textarea.form-control {
  height: 150px;
  resize: vertical;
}

.submit-btn {
  background: var(--primary-color);
  color: #fff;
  border: none;
  padding: 14px 30px;
  font-family: 'Outfit', sans-serif;
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.3s ease;
  width: 100%;
}

.submit-btn:hover {
  background: #222;
}

.form-success-msg {
  display: none;
  background: rgba(68, 255, 6, 0.15);
  border: 1px solid var(--accent-color);
  color: #1b6200;
  padding: 15px;
  border-radius: 4px;
  margin-top: 20px;
  font-size: 14px;
  text-align: center;
  font-weight: 500;
}

/* Mobile Hamburger Menu */
.hamburger-btn {
  display: none;
  flex-direction: column;
  gap: 5px;
  background: transparent;
  border: none;
  cursor: pointer;
  z-index: 1100;
}

.hamburger-btn span {
  display: block;
  width: 25px;
  height: 2px;
  background: #fff;
  transition: all 0.3s ease;
}

@media (max-width: 768px) {
  .hamburger-btn {
    display: flex;
  }
  header .nav {
    display: none;
  }
}

/* Fullscreen Menu for Mobile */
.mobile-menu {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: #0b0b0b;
  z-index: 1050;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  opacity: 0;
  visibility: hidden;
  transition: all 0.4s ease;
}

.mobile-menu.active {
  opacity: 1;
  visibility: visible;
}

.mobile-menu ul {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 25px;
}

.mobile-menu ul li a {
  color: #fff;
  font-family: 'Outfit', sans-serif;
  font-size: 24px;
  font-weight: 700;
  text-transform: uppercase;
  transition: color 0.3s ease;
}

.mobile-menu ul li a:hover {
  color: var(--accent-color);
}

.hamburger-btn.active span:nth-child(1) {
  transform: rotate(45deg) translate(5px, 5px);
}

.hamburger-btn.active span:nth-child(2) {
  opacity: 0;
}

.hamburger-btn.active span:nth-child(3) {
  transform: rotate(-45deg) translate(5px, -5px);
}

/* Footer Section */
footer {
  background: #0b0b0b;
  color: #fff;
  padding: 80px 0 40px;
  border-top: 1px solid rgba(255,255,255,0.05);
}

footer .footer-cols {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr;
  gap: 40px;
  margin-bottom: 50px;
}

@media (max-width: 768px) {
  footer .footer-cols {
    grid-template-columns: 1fr;
  }
}

footer .footer-col h3 {
  font-family: 'Outfit', sans-serif;
  font-size: 22px;
  margin-bottom: 20px;
  font-weight: 700;
}

footer .footer-col p {
  color: #888;
  font-size: 14px;
  line-height: 1.6;
}

footer .footer-col h4 {
  font-family: 'Outfit', sans-serif;
  font-size: 14px;
  text-transform: uppercase;
  margin-bottom: 15px;
  letter-spacing: 0.05em;
  color: var(--accent-color);
}

footer .footer-col ul {
  display: flex;
  flex-direction: column;
  gap: 10px;
  font-size: 14px;
  color: #888;
}

footer .footer-col ul li a:hover {
  color: var(--accent-color);
}

footer .footer-bottom {
  border-top: 1px solid rgba(255,255,255,0.05);
  padding-top: 30px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 13px;
  color: #666;
}

@media (max-width: 576px) {
  footer .footer-bottom {
    flex-direction: column;
    gap: 15px;
    text-align: center;
  }
}



/* Multi-page Hero Styling */
.page-hero {
  height: 400px;
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #fff;
  margin-top: 85px; /* offset navbar height */
  position: relative;
}

.page-hero::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.65);
  z-index: 1;
}

.page-hero .container {
  position: relative;
  z-index: 2;
  max-width: 800px;
  margin: 0 auto;
  padding: 0 20px;
}

.page-hero h1 {
  font-family: 'Outfit', sans-serif;
  font-size: 52px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 15px;
  color: #fff;
  line-height: 1.2;
}

.page-hero p {
  font-size: 16px;
  color: #ccc;
  line-height: 1.6;
}

/* Subpage Content Section styling */
.subpage-container {
  padding: 80px 0;
  background: #fafafa;
}

.subpage-wrapper {
  max-width: 800px;
  margin: 0 auto;
  background: #fff;
  border: 1px solid #eaeaea;
  padding: 50px;
  box-shadow: 0 5px 15px rgba(0,0,0,0.02);
}

.subpage-wrapper h2 {
  font-family: 'Outfit', sans-serif;
  font-size: 24px;
  margin-top: 30px;
  margin-bottom: 15px;
  color: var(--primary-color);
}

.subpage-wrapper p {
  font-size: 14px;
  color: #555;
  line-height: 1.8;
  margin-bottom: 15px;
}

/* Hero Carousel Interactive Canvas Animation Styles */
#carousel-canvas {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 2;
}

[data-cmp=carousel] .content {
  z-index: 3 !important;
}

[data-cmp=carousel] .nav {
  z-index: 10 !important;
}