/*
FONTS

font-family: acumin-pro;
font-family: acumin-pro-wide;
font-family: eurostile-extended;
font-family: calibri;


*/



/* VARIABLES */

:root {
  --default-font: acumin-pro;
  --default-font-size: 24px;
  --default-line-height: 1.5;

  --default-input-font: acumin-pro;
  --default-input-font-size: 20px;
  --dim-input-height: 48px;
  
  --button-input-font: acumin-pro;
  --button-font-size: 20px;
  --button-height: 22px;

  --col-primary: #263287;
  --col-accent: #AAAAAA;
  --col-burger: #fff;
  --col-text: #000;
  --col-page-bg: #fff;
  --col-border: #AAAAAA;
  --col-input: #263287;
  --col-placeholder: #263287;
  --col-input-bg: transparent;
  --col-button: #263287;
  --col-button-bg: transparent;
  --col-link: #000;
  --col-link-hover: #000000;

  --col-error: #ff6633;
  --col-attention: #ff6633;
  --col-warning: #f5b00e;
  --col-missing: #ff6633;

  --col-primary-rgb: 38,50,135;
  --col-accent-rgb: 0, 0, 0;
  --col-button-rgb: 255, 255, 255;
  --col-link-rgb: 0,0,0;
  --col-link-hover-rgb: 0, 0, 0;
  --col-error-rgb: 255, 51, 0;
  --col-attention-rgb: 255, 51, 0;
  --col-warning-rgb: 245, 176, 14;
  --col-border-rgb: 190, 190, 190;
  --col-missing-rgb: 255, 51, 0;

  --col-blue: #1C2255;

  --dim-site-width: 1920px;
  --dim-site-inner-width: 1440px;
  --dim-default-space: 100px;

  --vh: 1vh;
}

/* theme */


/*CORE HTML*/

p { margin-bottom: 40px; line-height: 1.5; }
p a:hover { color: #aaa;}
a.underline { text-decoration: underline}

p.larger {font-size: 30px}
p.strong {}
p.light { }
p.medium { }

p.short { max-width: 960px; margin-left: auto; margin-right: auto; }
p.short.left { margin-left: 0; margin-right: auto; }
p.shorter { max-width: 740px; margin-left: auto; margin-right: auto; }
p.shortest { }

h1 { font-family: acumin-pro-wide; color: #fff; font-weight: 700; font-style: italic; line-height: 1; text-transform: uppercase;font-size: 92px;   }
h1 small { font-size: 0.5em; display: block; margin-bottom: 10px}
h2 { font-family: acumin-pro-wide; color: var(--col-primary); font-weight: 700; font-style: italic; line-height: 1; text-transform: uppercase;font-size: 60px; margin-bottom: 30px}
h2.large { font-size: 92px; }
h2 small { font-size: 0.66em; display: block;}
h3 { font-family: acumin-pro-wide; color: var(--col-primary); font-weight: 700; font-style: italic; line-height: 1; text-transform: uppercase;font-size: 42px; margin-bottom: 30px}
h3  small { font-size: 0.7em; }
h4 { font-family: acumin-pro-wide; color: var(--col-primary); font-weight: 700; font-style: italic; line-height: 1; text-transform: uppercase;font-size: 30px; margin-bottom: 30px}
h6 { font-family: acumin-pro-wide; color: var(--col-primary); font-weight: 700; font-style: italic; line-height: 1; text-transform: uppercase;font-size: 24px; margin-bottom: 20px}

.font-1 { font-family: acumin-pro;}
.font-2 { font-family: acumin-pro-wide;}
.font-3 { font-family: eurostile-extended;}



/*CONTAINERS*/

article { padding-top: 0px; }
section.full-screen { max-width: 100vw; margin: 0; padding: 0; width: 100%;}

/*BUTTONS*/

a.btn { display: table; font-size: 22px; color: var(--col-primary); font-family: acumin-pro-wide; font-weight: 700; font-style: italic; padding-right: 32px; z-index: 4; text-transform: uppercase; white-space: nowrap; position: relative;}
a.btn.btn-white { color: #fff;}
a.btn:after {content:""; width: 14px; height: 100%; position: absolute; display: block; right: 0; top: 0; background: url(/img/svg/arrow-right.svg) no-repeat center center; background-size: contain; }
a.btn.btn-white:after {background-image: url(/img/svg/arrow-right2.svg); }
a.btn.short { max-width: 634px; white-space: inherit}

/*HEADER AND NAV*/

header {position: fixed; top: 0; left: 0; z-index: 10}
header div.burger {display: block; position: relative; }
header > div {display: flex; justify-content: space-between; gap: 0; max-width: 1440px; margin: 0 auto; padding-top: 60px; align-items: flex-start;}
header div.logo {display: block; width: 410px; }
header.hide-logo div.logo {opacity: 0}
header.hide-logo div.burger {opacity: 0}
header nav { position: absolute; top: 0; right: -200vw; opacity: 0; display: flex; justify-content: center; gap: 30px; width: 510px; padding: 193px 0 310px; align-items: center; background: var(--col-primary); flex-direction: column; height: 100vh}
header nav a { display: block; font-family: acumin-pro-wide; color: #fff; font-weight: 700; font-style: italic; line-height: 1; font-size: 35px; text-transform: uppercase;;}
header nav img { display: block; position: absolute; width: 290px; bottom: 95px; left: 50%; transform: translateX(-50%); }
header.active nav { right: 0; opacity: 1; }

header div.burger ul {transform: scale(1.5)}

header.attached {top: -300px; opacity: 0;}
header.attached.visible {top: 0px; opacity: 1; background: var(--col-primary);}
header.attached.visible div.logo { width: 200px; padding-top: 15px}
header.attached.visible > div {padding-top: 0px}

footer { max-width: 100%; padding: 80px 0px 0; border-top: 1px solid var(--col-border)}
div.footer { max-width: 1500px; padding: 0 30px; margin: 0 auto 120px;}
footer div.logo { width: 900px; margin: 0 auto 90px; display: block;}
footer div.contacts { display: flex; justify-content: center; gap: 70px; align-items: flex-start; max-width: 100%}
footer div.contacts > div { flex: 1;}
footer div.contacts div.form { max-width: 390px;}
footer div.contacts strong { display: block; font-style: italic; font-family: acumin-pro-wide; color: var(--col-primary); margin-bottom: 20px; font-size: 20px; text-transform: uppercase; white-space: nowrap;}
footer div.contacts p, footer div.contacts a { display: block; font-size: 20px; font-family: acumin-pro-wide; color: #000; margin-top: 3px; line-height: 1.4; font-weight: 500}
footer div.contacts a { text-decoration: underline; white-space: nowrap;}
footer div.footer-nav { max-width: 100%; border-top: 1px solid var(--col-border); }
footer div.footer-nav > div { max-width: 1500px; padding: 20px 30px; display: flex; justify-content: space-between; gap: 40px; align-items: center; margin: 0 auto}
footer div.footer-nav > div > div:first-child { display: flex; justify-content: flex-start; gap: 50px; align-items: center; flex: 1;}
footer div.footer-nav > div > div:first-child a { font-size: 15px; font-weight: 600;  font-style: italic; font-family: acumin-pro-wide; color: var(--col-primary); text-transform: uppercase;}
footer div.footer-nav > div > div:last-child { max-width: 390px; }
footer div.footer-nav div.social { display: flex; justify-content: flex-start; gap: 44px;}
footer div.footer-nav div.social a { font-size: 20px; color: var(--col-primary); display: block}
footer div.disclaimer { max-width: 100%; background: var(--col-primary); padding: 14px 0;}
footer div.disclaimer > p { max-width: 1500px; padding: 0 30px; text-align: left; margin: 0 auto}
footer div.disclaimer p, footer div.disclaimer a { font-size: 12px; font-weight: 300; color: #fff; }

div.cookie-overlay { background: rgba(0,0,0,.8); position: fixed; top: 0; left: 0; width: 100vw; height: calc(100 * var(--vh)); z-index: 150; display: none;}
div.cookie-overlay.active { display: block;}
div.cookie-overlay > div { background: #fff; padding: 115px 105px; text-align: center; position: absolute; top: 50%; left: 50%; transform: translate3D(-50%, -50%, 0); width: 96%; max-width: 1080px;}
div.cookie-overlay > div p { color: #000; font-weight: 300; font-size: 26px}


/*ELEMENTS*/
.c-primary { color: var(--col-primary) !important}
.c-black { color: #000 !important}
.b-primary { background-color: var(--col-primary) !important}
.b-black { background-color: #000 !important}
.b-gray { background-color: #EBEBEB !important}
.b-tan { background-color: #D9D2CA !important}
.b-white { background-color: #fff !important}
.c-white { color: #fff !important}

.uc {text-transform: uppercase;}

/*CONTENT*/

div.full-screen { width: 100vw; height: calc(100 * var(--vh))}
a.scroll-down { position: absolute; bottom: 70px; left: 50%; transform: translateX(-50%); z-index: 3;}

div.content-1 {max-width: var(--dim-site-inner-width); margin: 0 auto; padding: 100px 0;}

div.home-nav { position: absolute; bottom: 120px; width: 1440px; left: 50%; transform: translateX(-50%); max-width: 100%; z-index: 3;}
div.home-nav > div { display: flex; justify-content: flex-end; gap: 20px; align-items: flex-start; flex-direction: column;width: 100%; }
div.home-nav div a { display: block; font-family: acumin-pro-wide; color: #fff; font-weight: 700; font-style: italic; line-height: 1; font-size: 30px; opacity: .3; text-transform: uppercase;; position: relative; padding-left: 1.5em}
div.home-nav div a:before { content:""; display: block; position: absolute; left: 0em; width: .4em; height: .4em; border-radius: .4em; background: #fff; top: 50%; margin-top: -.2em;}
div.home-nav div a:hover { opacity: 1}
div.home-nav a.btn { margin-left: 0; margin-top: 3.8em; line-height: 1.1;}
div.home-nav a.btn:after { background-position: right bottom;}

div.home-products { margin: 150px auto 120px; display: flex; justify-content: space-between; gap: 40px; flex-direction: column}
div.home-products > div { display: flex; justify-content: space-between; gap: 0; align-items: stretch; padding-bottom: 55px;}
div.home-products > div:hover:after { width: 100%;}
div.home-products > div > div { width: 480px; }
div.home-products > div > div:first-child { flex: 1; padding-right: 30px; display: flex; justify-content: space-between; gap: 0; flex-direction: column}
div.home-products > div > div:first-child p { flex: 1; display: flex; justify-content: flex-end; gap: 0;align-items: flex-start; flex-direction: column}
div.home-products div.title {font-family: acumin-pro-wide; color: #000; font-weight: 700; font-style: italic; font-size: 20px; text-align: left; margin-bottom: 30px; text-transform: uppercase;}
div.home-products div.name {font-family: acumin-pro-wide; color: var(--col-primary); font-weight: 700; font-style: italic; font-size: 60px; text-align: left;  text-transform: uppercase;}
div.home-products div.product-image a {display: none; position: absolute; top: 50%; left: 50%; transform: translate3D(-50%, -50%, 0); font-size: 28px; color: #fff; font-family: acumin-pro-wide; font-weight: 700; font-style: italic; padding-right: 32px; z-index: 4; text-transform: uppercase; white-space: nowrap}
div.home-products div.product-image a:after {content:""; width: 14px; height: 100%; position: absolute; display: block; right: 0; top: 0; background: url(/img/svg/arrow-right2.svg) no-repeat center center; background-size: contain; }
div.home-products >div:hover div.product-image a {display: block;}
div.home-products >div div.product-image:after {content:""; position: absolute; width: 100%; height: 100%; background: var(--col-primary);  z-index: 3; display: block; top: 0; left: 0; opacity: 0; transition: all .5s cubic-bezier(0.250, 0.460, 0.450, 0.940)}
div.home-products >div:hover div.product-image:after {opacity: 1;}

div.home-about-slider { margin: 80px auto}
div.home-about-slider.line-dots ul.slick-dots { bottom: 40px;}
div.home-about-slider.line-dots ul.slick-dots li button { background: #fff; }
div.home-about-slider > div { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
div.home-about-slider .slick-slide, div.home-about-slider .slick-list, div.home-about-slider .slick-track  { height: 100%;}
p.eyebrow {font-size: 42px; text-transform: uppercase;font-family: acumin-pro-wide; font-weight: 700; font-style: italic; margin-bottom: 0px; color: var(--col-primary)}
div.about-message { height: 100%; display: flex; justify-content: center; gap: 40px; flex-direction: column; align-items: center; font-size: 40px; max-width: 1080px; padding: 0 30px; text-align: center; margin: 0 auto}
div.about-message div { color: #fff; font-family: acumin-pro-wide; font-size: 1em; font-weight: 700; font-style: italic; text-transform: uppercase;}
div.about-message div.big { font-size: 3em;}
div.about-message div.big2 { font-size: 2.4em;}
div.about-message div.big3 { font-size: 3.9em;}
div.about-message div.big3 small { font-size: 0.4em;}

.with-line:before { content:""; display: block; position: absolute; bottom: 1px; left: 0; width: 100%; height: 1px; background: var(--col-border); }
.with-line.white-line:before { background: #BCBBBA; }
.with-line:after { content:""; display: block; position: absolute; bottom: 0; left: 0; width: 230px; height: 3px; background: var(--col-primary); }
.with-line.white-line:after { background: #fff; }
.with-line-right:after { left: auto; right: 0}

div.separator { display: block; width: 100%; padding: 80px 0px 0; border-top: 1px solid var(--col-border);}

div.about { text-align: center;}
div.about > img { margin: 0 auto -15px; position: relative; z-index: 3;}
div.about div.subtitle { z-index: 4;  display: block; font-family: acumin-pro-wide; color: #000; font-weight: 700; font-style: italic; line-height: 1; font-size: 20px; text-transform: uppercase;; margin-bottom: 30px}

div.partners { display: grid; gap: 50px 200px; grid-template-columns: 1fr 1fr 1fr; margin: 80px auto}
div.partners > div { display: flex; justify-content: space-between; gap: 10px; flex-direction: column; align-items: center; text-align: center;}
div.partners div.logo { height: 140px; width: 244px;;}
div.partners div.logo img { display: block; width: 100%; height: 100%; object-fit: center center;}
div.partners div.info { width: 100%}
div.partners div.title { font-size: 18px; font-weight: 700; margin-bottom: 8px}
div.partners p { font-size: 15px; font-style: italic}

.underlined { text-decoration: underline;}

div.fancy-title { display: flex; justify-content: space-between; gap: 20px; align-items: center; margin-bottom: 80px;}
div.fancy-title span:first-child { white-space: nowrap; font-family: acumin-pro-wide; color: #000; font-weight: 700; font-style: italic; line-height: 1; font-size: 20px; text-transform: uppercase;; display: block;}
div.fancy-title span:first-child:empty { display: none;; }
div.fancy-title.fancy-white span:first-child { color: #fff}
div.fancy-title span:last-child { flex: 1; height: 1px; display: block; background: var(--col-border); position: relative; }
div.fancy-title span:last-child:after { content:""; position: absolute; bottom: -1px; right: 0; height: 3px; width: 240px; background: var(--col-primary); }
div.fancy-title.fancy-white span:last-child:after { background: #fff; }
div.fancy-title.limited { max-width: 1440px}

div.home-projects { width: 1920px; max-width: 100%; margin: 0 auto; overflow: hidden; padding-bottom: 42px}
div.home-projects > div { width: 4320px; max-width: 4320px; position: relative; left: -1160px; padding-bottom: 42px;}
div.home-project { padding: 1px}
div.home-project div.logo { position: absolute; top: 30px; width: 360px; height: 100px; display: block; z-index: 3; left: 50%; transform: translateX(-50%);}
div.home-project div.logo img { width: 100%; height: 100%; object-fit: contain; object-position: center top;}
div.home-project a {display: block; position: absolute; top: 50%; left: 50%; transform: translate3D(-50%, -50%, 0); font-size: 28px; color: #fff; font-family: acumin-pro-wide; font-weight: 700; font-style: italic; padding-right: 32px; z-index: 4; text-transform: uppercase; white-space: nowrap; padding-right: 31px; padding-bottom: 4px; line-height: 1}
div.home-project a:after {content:""; width: 14px; height: 100%; position: absolute; display: block; right: 0; top: 0; background: url(/img/svg/arrow-right2.svg) no-repeat center center; background-size: contain; }
div.home-products div.product-image a:after {content:""; width: 14px; height: 100%; position: absolute; display: block; right: 0; top: 0; background: url(/img/svg/arrow-right2.svg) no-repeat center center; background-size: contain; }
.line-dots ul.slick-dots { width: 100%; display: flex; justify-content: center; gap: 9px; position: absolute; bottom: -42px; left: 0; }
.line-dots ul.slick-dots li { width: 50px; height: 2px; }
.line-dots ul.slick-dots li button { width: 100%; height: 100%; background: var(--col-primary); opacity: .4}
.line-dots.white-line ul.slick-dots li button { background: #fff}
.line-dots ul.slick-dots li.slick-active button { opacity: 1}

div.culture { background: url(/img/home/bg-people.jpg) no-repeat center center; background-size: cover; padding: 140px 30px 100px;}
div.culture > img { display: block; margin:0 auto}
div.culture div.caption { bottom: 100px; left: 0; text-align: center;}
div.culture div.caption p { color: #fff;  max-width: 700px; margin: 0 auto 35px}

div.video { position: relative; }
div.video > img { z-index: 2; position: relative; display: block; }
div.video.active > img { opacity: 0}
div.video iframe { position: absolute; opacity: 0; z-index: 1; width: 100%; height: 100%; top: 0; left: 0}
div.video.active iframe { opacity: 1; z-index: 4;}
div.video a.play-video { position: absolute; top: 50%; left: 50%; transform: translate3D(-50%, -50%, 0); width: 250px; z-index: 5;}
div.video.active a.play-video { top: 0%; left: 0%; transform: translate3D(0%, 0%, 0); width: 100% !important; height: 100% }
div.video.active a.play-video img { display: none;}

div.full-screen div.video { width: 100%; height: 100%; }
div.full-screen div.video > img, div.full-screen img { width: 100%; height: 100%; object-fit: cover;}
div.full-screen div.video a.play-video {width: 45px;  }

div.list-filter {display: flex; justify-content: flex-start; gap: 40px; margin: 0 auto 90px 0;}
div.list-filter a img { filter: grayscale(1); }
div.list-filter a.active img { filter: none; }
div.projects-filter { margin: 0 0 90px auto; justify-content: flex-end;}

div.news-list {display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px 20px;}
div.news-list div.thumb {display: block; margin-bottom: 50px;}
div.news-list div.date {display: block; margin-bottom: 20px; font-size: 24px; font-weight: 500}
div.news-list div.details {display: block; margin-bottom: 60px;}
div.news-list div.title {display: block; margin-bottom: 25px; font-size: 25px; font-weight: 500; font-family: acumin-pro-wide; color: var(--col-primary); text-transform: uppercase;}
div.news-list p {font-weight: 500; margin-bottom: 00px;}
div.news-list a { margin: 0 auto 0 0}
div.news-entry { padding-bottom: 40px;}
div.news-entry:before { }
div.news-entry:after {  width: 30%; }

div.news-list.list { display: flex; flex-direction: column; gap: 50px; align-items: flex-start;}
div.news-list.list div.news-entry { width: 100%; padding-bottom: 40px;}
div.news-list.list div.details { display: flex; justify-content: space-between; gap: 80px;}
div.news-list.list div.title { width: 480px; margin: 0}
div.news-list.list p { flex: 1; margin: 0}
div.news-list.list div.news-entry:after { width: 250px}
div.news-list.list a { margin: 0 0 0 auto; }
div.news-list.list div.thumb { display: none;}

div.caption-title  { position: absolute; bottom: 120px; left: 50%; transform: translateX(-50%); max-width: 1440px; text-align: left; z-index: 6;}
div.caption-title h1 small { font-size: 0.4em; margin-top: 5px}

div.culture-intro { display: flex; justify-content: space-between; gap: 140px; }
div.culture-intro > div:first-child { width: 600px}
div.culture-intro > div:last-child { flex: 1}
div.culture-intro > div:last-child > div { display: flex; justify-content: space-between; gap: 30px; flex-direction: column; height: 100%; align-items: flex-start;}
div.culture-slider div.slick-slide { padding-bottom: 40px;}
div.culture-slider img {height: 100%; width: 100%; object-fit: cover;}
div.culture-slider ul.slick-dots { position: absolute; left: 0; bottom: 0; width: 100; display: flex; justify-content: space-between; gap: 8px;}
div.culture-slider ul.slick-dots li { width: 100%; margin: 0}
div.culture-slider ul.slick-dots li button { width: 100%; margin: 0; border-radius: 0; height: 2px; background: var(--col-primary); opacity: .4}
div.culture-slider ul.slick-dots li.slick-active button { opacity: 1}

div.culture-2 {z-index: 2;}
div.culture-2 .slick-slide {padding: 0 1px}
div.culture-2 img {height: 200px; object-fit: cover;}
div.culture-1 img {display: block; margin: 0 0 0 auto;}
div.culture-3 img {display: block; margin: 0 0 0 auto; padding-bottom: 50px; margin-top: 0px; z-index: 1;}
/*div.culture-3:before { content:""; position: absolute; display: block; bottom: 0; left: 0; background: var(--col-border); width: 100%; height: 1px; }*/
/*div.culture-3:after {  content:""; position: absolute; display: block; right: 0; bottom: -1px; background: var(--col-primary); width: 250px; height: 3px; }*/

div.core-values { display: grid; gap: 70px; grid-template-columns: 2fr 5fr; max-width: 820px; margin: 0 auto}
div.core-values > div { text-align: left; opacity: 0.4; transition: all .3s linear}
div.core-values > div.active { opacity: 1}
div.core-values > div:nth-child(odd) { padding-left: 40px; position: relative;}
div.core-values > div:nth-child(odd) span { font-family: acumin-pro-wide; text-transform: uppercase; color: var(--col-primary); font-weight: 700; font-size: 19px; font-style: italic}
div.core-values > div:nth-child(odd) img { display: block; position: absolute; top: 0; left: 0; width: 25px;}
div.core-values > div:nth-child(odd) img.cv-1 { width: 20px;}
div.core-values > div:nth-child(odd) img.cv-2 { width: 30px;}
div.core-values > div:nth-child(even) p { color: #000; font-size: 24px; margin: 0; font-weight: 500;}
div.core-values span.cv-line { position: absolute; top: 0; width: 2px; display: block; height: 100%; left: calc(28.5% + 10px); background: #F1EFEE; }
div.core-values span.cv-line span { position: absolute; top: 0; width: 2px; display: none; height: 0; left: 0px; background: var(--col-primary); transition: all .3s linear}
div.core-values span.cv-line span:after { content: ""; position: absolute; width: 13px; display: block; height: 13px; left: -5px; background: var(--col-primary); border-radius: 13px; bottom: 0; }
div.core-values span.cv-line span:before { content: ""; position: absolute; width: 2px; display: block; height: 16px; left: 0px; background: #fff; bottom: -16px; }

div.culture-videos { display: flex; justify-content: space-between; gap: 0;}
div.culture-videos div.video > img { display: block; width: 100%; height: 100%; object-fit: cover;}
div.culture-videos a.play-video { width: 45px; }

div.projects-grid { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; column-gap: 20px; row-gap: 20px;}
div.projects-grid div.x2 { grid-column: span 2}
div.projects-grid div.y2 { grid-row: span 2}
div.projects-grid div.logo { position: absolute; display: block; top: 50%; left: 50%; transform: translate3D(-50%, -50%, 0); opacity: 0; transition: all .3s linear; text-align: center;}
div.projects-grid div.logo p { font-size: 42px; font-weight: 700; font-family: acumin-pro-wide; color: #fff; text-transform: uppercase; font-style: italic; line-height: 1.15}
div.projects-grid div.logo span { display: table; font-size: 20px; color: #fff; font-family: acumin-pro-wide; font-weight: 700; font-style: italic; padding-right: 26px; z-index: 4; text-transform: uppercase; white-space: nowrap; position: relative; margin: 0 auto}
div.projects-grid div.logo span:after {content:""; width: 11px; height: 100%; position: absolute; display: block; right: 0; top: 0; background: url(/img/svg/arrow-right2.svg) no-repeat center center; background-size: contain; }

div.projects-grid :hover div.logo { opacity: 1}
div.projects-grid > div:hover > a { overflow: hidden}
div.projects-grid > div > a > img {transition: all 1.5s cubic-bezier(0.250, 0.460, 0.450, 0.940)}
div.projects-grid > div:hover > a > img {transform: scale(1.03); }

div.more-projects { display: flex; justify-content: space-between; gap: 50px; flex-direction: column }
div.project-entry { display: flex; justify-content: space-between; gap: 0; padding-bottom: 55px; position: relative;}
div.project-entry:before { content:""; display: block; position: absolute; bottom: 1px; left: 0; width: 100%; height: 1px; background: var(--col-border); }
div.project-entry:after { content:""; display: block; position: absolute; bottom: 0; left: 0; width: 230px; height: 3px; background: var(--col-primary); }

div.project-entry > div:last-child { width: 480px;}
div.project-entry div.thumb { height: 300px; }
div.project-entry div.thumb img { height: 100%; width: 100%; object-fit: cover; }
div.project-entry > div:first-child { flex: 1; padding-right: 40px; display: flex; justify-content: space-between; gap: 20px; flex-direction: column; align-items: flex-start;}
div.project-entry div.city { display: block; margin-bottom: 30px; font-size: 20px; font-weight: 700; font-family: acumin-pro-wide; color: #000; text-transform: uppercase; font-style: italic;}
div.project-entry div.title { display: block; font-size: 60px; font-weight: 700; font-family: acumin-pro-wide; color: var(--col-primary); text-transform: uppercase; font-style: italic;}
div.project-entry p { margin-bottom: 12px; font-weight: 500; }
div.skus { display: flex; justify-content: flex-start; gap: 40px; }
div.skus a { display: block;  font-size: 22px; color: var(--col-primary); font-family: acumin-pro-wide; font-weight: 700; font-style: italic; padding-right: 32px; z-index: 4; text-transform: uppercase; white-space: nowrap; position: relative;}
div.skus a:after {content:""; width: 14px; height: 100%; position: absolute; display: block; right: 0; top: 0; background: url(/img/svg/arrow-right.svg) no-repeat center center; background-size: contain; }

div.caption div.skus { margin-bottom: 40px}
div.caption div.skus a { color:#fff; font-size: 20px}
div.caption div.skus a:after {background-image: url(/img/svg/arrow-right2.svg); }


div.shaded:after {content:""; background: linear-gradient(to top, rgba(0,0,0,1), rgba(0,0,0,0)); position: absolute; display: block; bottom: 0; left: 0; width: 100%; height: 400px; max-height: 50%; z-index: 2;}

div.project-info {display: flex; justify-content: flex-start; gap: 100px; align-items: flex-start; max-width: 1440px; margin: 0 auto 80px}
div.project-info > div strong {display: block; font-size: 20px; font-weight: 700; font-family: acumin-pro-wide; color: #000; text-transform: uppercase; font-style: italic; margin-bottom: 35px}
div.project-info > div span, div.project-info > div a  {display: block; font-size: 42px; font-weight: 700; font-family: acumin-pro-wide; color: var(--col-primary); text-transform: uppercase; font-style: italic;}

div.project-slider-main .slick-slide  {height: 910px; width: 100vw; background: #F1EFEE}
div.project-slider-main .slick-slide img {height: 100%; width: 100%; object-fit: contain;}
div.project-slider-main button.slick-arrow { background-image: url(/img/svg/arrow-right3.svg); width: 15px; height: 45px}
div.project-slider-main button.slick-arrow.slick-next { right: 40px;}
div.project-slider-main button.slick-arrow.slick-prev { left: 40px; transform: rotate(180deg)}
div.project-slider-index { display: flex; flex-wrap: wrap; gap: 8px; max-width: 1440px; margin: 80px auto;}
div.project-slider-index div { display: block; width: 200px;height: 120px;}
div.project-slider-index div img { display: block; width: 100%;height: 100%; object-fit: cover;}

div.project-gallery h4 { max-width: var(--dim-site-inner-width); margin-left: auto; margin-right: auto; margin-bottom: 100px}

div.project-info-new { display: grid; gap: 0; grid-template-columns: 1fr 2fr; gap: 15px 130px; max-width: 100%; margin: 0 auto 80px 0;}
div.project-info-new div {  text-transform: uppercase; font-family: acumin-pro-wide; font-weight: 700; font-style: italic; }
div.project-info-new div:nth-child(odd) {  color: #BCBBBA}
div.project-info-new .th { font-size: 30px; color: var(--col-primary) !important; text-transform: uppercase; font-family: acumin-pro-wide; font-weight: 700; font-style: italic; padding-bottom: 20px;}

div.project-highlights { margin-bottom: 80px}
div.project-highlights ul { margin-bottom: 0; padding-left: 1em;}
div.project-highlights ul li {font-size: 30px; font-weight: 500; margin-bottom: .7em;}
div.project-highlights ul li a {font-weight: 700; color: var(--col-primary)}

div.faq summary { color: #fff; display: block; position: relative; padding-right: 48px; list-style: none; cursor: pointer; }
div.faq summary::marker { content: ""; }
div.faq summary::-webkit-details-marker { display: none; }
div.faq summary::after { content: ""; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 24px; height: 24px; background: url(/img/svg/plus.svg) no-repeat center; background-size: contain; }
div.faq details[open] > summary::after { background-image: url(/img/svg/minus.svg); }


div.recent-projects { display: flex; justify-content: space-between; gap: 4px; max-width: 1440px; margin: 70px auto; align-items: flex-end}
div.recent-projects > div { flex: 1; padding-bottom: 55px; position: relative;}
div.recent-projects div.thumb { height: 300px;}
div.recent-projects div.thumb img { display: block; width: 100%;height: 100%; object-fit: cover;}
div.recent-projects div.city { display: block; margin-bottom: 35px; font-size: 20px; font-weight: 700; font-family: acumin-pro-wide; color: #000; text-transform: uppercase; font-style: italic;}
div.recent-projects div.title { display: block;margin-bottom: 35px;  font-size: 42px; font-weight: 700; font-family: acumin-pro-wide; color: var(--col-primary); text-transform: uppercase; font-style: italic;}
/*div.recent-projects > div:before { content:""; display: block; position: absolute; bottom: 1px; left: 0; width: 100%; height: 1px; background: var(--col-border); }*/
/*div.recent-projects > div:after { content:""; display: block; position: absolute; bottom: 0; left: 0; width: 230px; height: 3px; background: var(--col-primary); }*/

div.image { position: relative; width: 100%;}
div.image > img { width: 100%; display: block;}
div.caption-vision2 { width: 100%; max-width: 1500px; left: 50%; top: 50%; transform: translate3D(-50%, -50%, 0); max-height: 100%; position: absolute; padding: 30px; display: flex; justify-content: center; gap: 0; flex-direction: column; align-items: stretch; text-align: left;}
div.vision-entry div.title { width: 100%; font-size: 170px; font-weight: 700; font-family: acumin-pro-wide; color: #fff; text-transform: uppercase; font-style: italic; -webkit-text-fill-color: transparent;  -webkit-text-stroke: 2px #fff; transition: all 1s cubic-bezier(0.250, 0.460, 0.450, 0.940); }
div.vision-entry:hover div.title { -webkit-text-fill-color: #fff;  }
div.vision-entry { position: static;}
div.vision-entry div.message { width: 540px; max-width: 45%; display: block; position: absolute; right: 0px; top: 70px; opacity: 0; font-size: 42px; font-weight: 700; font-family: acumin-pro-wide; color: #fff; text-transform: uppercase; font-style: italic; text-align: left;}
div.vision-entry:hover div.message { opacity: 1;}

div.caption-vision { width: 100%; max-width: 1500px; left: 50%; transform: translateX(-50%); height: 100%; top: 0; position: absolute; padding: 30px;}
div.caption-vision img { width: 100%; display: block; height: 100%; object-fit: contain; object-position: left center;}

div.timeline { margin-top: 80px}
div.timeline div.timeline-holder {width: 1440px; max-width: 100%; margin: 0 auto; overflow: hidden;padding: 60px 0px; position: relative; }
/*div.timeline div.timeline-holder:before {width: 6px; background: #fff; height: 33%; left: 0; content:""; top: 31%; position: absolute; display: block; z-index:5;}*/
/*div.timeline div.timeline-holder:after {width: 6px; background: #fff; height: 100%; right: 0; content:""; top: 0; position: absolute; display: block; z-index: 5;}*/
div.timeline div.timeline-slide {width: 2880px; position: relative; left: 0; transition: left 1s cubic-bezier(0.250, 0.460, 0.450, 0.940); }
div.timeline > div > div > div {display: grid; gap: 8px; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr; width: 100%; z-index: 3;}
/*div.timeline > div > div > div > div.not-shown {opacity: 0}*/
div.timeline > div > div > div.images {z-index: 2;}
div.timeline > div > div > div.first-row > div, div.timeline > div > div > div.last-row > div {grid-column: span 2}
div.timeline > div > div > div.last-row > div.single {grid-column: span 1}
div.timeline p, div.timeline li { font-size: 15px; font-style: italic;}
div.timeline div.first-row > div { padding-bottom: 30px;}
div.timeline div.last-row > div { padding-top: 30px;}
div.timeline ul { padding-left: 15px}
div.timeline ul li { margin-bottom: 15px}
div.timeline > div > div > div:not(.images) > div:not(:empty) { padding-left: 15px; border-left: 0px solid var(--col-primary); position: relative;}
div.timeline > div > div > div:not(.images) > div:not(:empty):before { content:""; width: 2px; height: 100%; background: var(--col-primary); display: block;position: Absolute; left: 5px;; top: 0}
div.timeline > div > div > div:not(.images) > div:not(:empty):after { content:""; width: 13px; height: 13px; border-radius: 13px; background: var(--col-primary); display: block;position: Absolute; left: 0px;; bottom: -4px;}
div.timeline > div > div > div > div div.title { position: absolute; top: -60px; left: 0; text-align: left; font-size: 42px; font-weight: 700; font-family: acumin-pro-wide; color: var(--col-primary); font-style: italic;}
div.timeline > div > div > div.last-row > div div.title { top: auto; bottom: -60px;}
div.timeline > div > div > div.last-row > div:not(:empty):after { bottom: auto; top: -4px}

div.timeline-index { display: flex; justify-content: center; gap:26px; margin-top: 20px; align-items: center;}
div.timeline-index img { width: 13px; height: 26px; display: block;}
div.timeline-index a.timeline-prev img { transform: rotate(180deg);}
div.timeline-index a.inactive { opacity: .3}
div.timeline-index div.dots { display: flex; justify-content: space-between; gap: 9px; align-items: center;}
div.timeline-index div.dots span { display: block; width: 50px; height: 2px; background: var(--col-primary); opacity: .4}
div.timeline-index div.dots span.active { opacity: 1}


div.scale-meets {display: block; width: 100%; position: relative; z-index: 2}
div.scale-meets > img {display: block; width: 100%;}
div.scale-meets * { color: #fff;}
div.scale-meets div.caption-top { display: block;position: absolute; top: 70px; width: 100%; max-width: 1260px; padding: 0 30px; left: 50%; transform: translateX(-50%); text-align: center; }
div.scale-meets div.caption-bottom { display: block;position: absolute; bottom: 400px; width: 100%; max-width: 1500px; padding: 0 30px; left: 50%; transform: translateX(-50%);}
div.scale-meets div.caption-bottom p { max-width: 960px; margin: 0 auto 0 0;}

div.international-portfolio { background: var(--col-primary); padding: 70px 0 500px; margin-top: -330px; z-index: 3; position: relative;}
div.international-portfolio > div { max-width: 1500px; width: 100%; margin: 0 auto; z-index: 3; position: relative; padding: 0 30px}
div.portfolio-index { display: flex; justify-content: flex-start; gap: 40px; align-items: flex-end; }
div.portfolio-index a { display: block; padding-left: 31px; position: relative; text-align: left; font-size: 20px; font-weight: 700; font-family: acumin-pro-wide; color: var(--col-primary); font-style: italic; color: #fff; opacity: .4; text-transform: uppercase;}
div.portfolio-index a:before { content:""; display: block; width: 13px; height: 100%;  position: absolute; left: 0; top: 0; background: url(/img/svg/arrow-right2.svg) no-repeat left center; background-size: contain; opacity: 0} 
div.portfolio-index a.active, div.portfolio-index a.active:before { opacity: 1} 
div.portfolio-text {min-height: 172px; max-width: 840px; margin: 40px auto 0 0; position: relative;}
div.portfolio-text p {color: #fff; height: 100%; display: none;}
div.portfolio-text p.active {display: block;}

img.big-flag { position: absolute; right: 0; bottom: 0; z-index: 2; width: 800px; max-width: 50vw;}
img.about-partners {  width: 980px; max-width: 100%; margin: 85px auto 0; display: block;}

div.about-stats > div { position: absolute; max-width: 1440px; top: 50%; left: 50%; transform: translate3D(-50%, -50%, 0); text-align: center;}
div.about-stats div.stat { display: block; color: #fff; font-size: 240px; font-weight: 700; font-family: acumin-pro-wide;  font-style: italic; text-transform: uppercase; position: relative; z-index: 3; opacity: 0; -webkit-text-fill-color: transparent;  -webkit-text-stroke: 2px #fff; }
div.about-stats div.stat.active { opacity: 1;}
div.about-stats p { display: block; color: #fff; font-size: 42px; font-weight: 700; font-family: acumin-pro-wide; font-style: italic; text-transform: uppercase; position: relative; z-index: 4; margin-top: 0px; line-height: 1}

div.values-grid {display: flex; justify-content: space-between; gap: 0;}
div.values-grid a.btn {font-size: 20px; margin: 45px auto 0 0; }
div.values-grid a.btn.active {color: #BCBBBA;}

div.values-data { display: flex; justify-content: space-between; gap: 50px; display: none; margin-top: 60px;}
div.values-data div.title { width: 440px;  font-size: 42px; font-weight: 700; font-family: acumin-pro-wide; color: var(--col-primary); font-style: italic; text-transform: uppercase;}
div.values-data div.text { flex: 1; }
div.values-data.active { display: flex;}

div.charities-top {top: 100px; position: absolute; left: 50%; transform: translateX(-50%);width: 1500px; max-width: 100%; padding: 0 30px}
div.charities-middle {top: 50%; position: absolute; left: 50%; transform: translate3D(-50%, -50%, 0); width: 1500px; max-width: 100%; padding: 0 30px}
div.charities-middle > div { display: flex; justify-content: space-between; gap: 80px; align-items: stretch; }
div.charity-box { display: flex; justify-content: space-between; gap: 40px; flex-direction: column; align-items: center; text-align: center;}
div.charity-box div.logo { min-height: 130px; display: flex; align-items: center;}
div.charity-box p { color: #fff; font-size: 22px}


/*PRODUCTS*/
div.caption-product { display: block; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 100%; max-width: calc(60px + var(--dim-site-inner-width)); padding: 0 30px 120px 30px; text-align: left; }
div.caption-product * { color:  #fff !important; text-align: left; }
div.caption-product p.eyebrow  { font-family: acumin-pro-wide; color: var(--col-primary); font-weight: 700; font-style: italic; line-height: 1; text-transform: uppercase;font-size: 42px; margin-bottom: 10px}
div.caption-product a.scroll-down { bottom: 50px;}

div.product-index { display: flex; justify-content: flex-start; gap: 50px;; margin: 0 auto 80px; width: 100%}
div.product-index a { display: block; position: relative; padding-right: 40px; background: url(/img/svg/arrow-right.svg) no-repeat center right; background-size: 13px auto; font-family: acumin-pro-wide; color: var(--col-primary); font-weight: 700; font-style: italic;  font-size: 20px; text-transform: uppercase; line-height: 1.3; opacity: .43; padding-bottom: 2px}
div.product-index a.active { opacity: 1}

div.product-wrapper { display: flex; justify-content: space-between; gap: 0;}
div.product-wrapper > div { flex: 1; display: block;}
div.product-wrapper div.product-data { padding-left: 100px; }
div.product-wrapper h2 { margin-bottom: 45px;}
div.product-menu { display: flex; justify-content: space-between; gap: 10px; margin-bottom: 45px;}
div.product-menu:after { display: block; content:""; position: Absolute; bottom: 0; left: 0; width: 100%; height: 1px; background: #BCBBBA; z-index: 2;}
div.product-menu > a { position: relative; z-index: 3; display: block; font-family: acumin-pro-wide; color: var(--col-primary); font-weight: 700; font-style: italic;  font-size: 20px; text-transform: uppercase; padding-bottom: 32px; border-bottom: 3px solid transparent; opacity: .43}
div.product-menu > a.active { border-bottom: 3px solid var(--col-primary); opacity: 1}
div.product-info { margin-bottom: 50px;}
div.product-info > div { display: none;}
div.product-info > div.active { display: block;}
div.product-info ul { margin-bottom: 30px; padding-left: 20px;}
div.product-info ul li { line-height: 1.5; margin-bottom: 5px;}

div.product-images {display: flex; justify-content: flex-start; gap: 15px;;}
div.product-images a {display: block; max-width: 75px; position: relative; }
div.product-images a.active:after {content:""; display: block; position: absolute; top: -5px; left: -5px; width: calc(100% + 10px); height: calc(100% + 10px); background: transparent; border: 2px solid var(--col-primary); box-sizing: border-box; }
div.product-images a img { display: block; width: 100%; opacity: .3}
div.product-images a.active img { opacity: 1}

div.product-versions { display: flex; justify-content: space-between; align-items: center; gap: 0; margin-top: 90px; width: 100%;}
div.product-versions div.product-dots{ flex: 1; display: flex; justify-content: center; gap: 6px; }
div.product-versions > a{ display: block; position: relative; background: url(/img/svg/arrow-right.svg) no-repeat center right; background-size: 13px auto; font-family: acumin-pro-wide; color: var(--col-primary); font-weight: 700; font-style: italic;  font-size: 20px; text-transform: uppercase; line-height: 1.3; opacity: .43; padding-bottom: 2px}
div.product-versions > a:first-child { padding-left: 40px; background-position: center left; background-image: url(/img/svg/arrow-left.svg)}
div.product-versions > a:last-child { padding-right: 40px;}
div.product-versions div.product-dots a { font-size: 0; height: 2px; width: 35px; background:var(--col-primary); display: block;opacity: .43}
div.product-versions div.product-dots a.active { opacity: 1}


/*FORMS*/

div.registration { }
div.registration div.title  { margin-bottom: 40px; font-weight: 600; font-size: 26px; text-transform: uppercase; text-align: center; font-family: elza; letter-spacing: 1;}
div.registration > p { font-size: 26px; text-align: center; margin-bottom: 30px; font-weight: 300;}
div.form { max-width: 100%; width: 600px; margin: 0 auto;}
div.form-row { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr; column-gap: 20px; row-gap: 20px; }
div.form-row div.field { grid-column: span 12; display: inline-grid}
div.form-row div.field.x1 { grid-column: span 1; }
div.form-row div.field.x2 { grid-column: span 2; }
div.form-row div.field.x3 { grid-column: span 3; }
div.form-row div.field.x4 { grid-column: span 4; }
div.form-row div.field.x6 { grid-column: span 6; }
div.form-row div.field.x8 { grid-column: span 8; }
div.form-row div.field.x9 { grid-column: span 9; }
div.form-row div.field.x12 { grid-column: span 12; }


input[type="text"], input[type="search"], input[type="tel"], input[type="number"], input[type="email"], input[type="password"] { transition:    color calc(infinity * 1s) step-end,    background-color calc(infinity * 1s) step-end;  background-color: rgba(255,255,255,.2); border: 0; border-bottom: 1px solid var(--col-border); padding-left: 0; }
textarea { font-family: var(--default-input-font); min-height: 200px; background-color: rgba(255,255,255,.2); border: 0}
div.checkbox label:before { border-color: #000; }
div.checkbox input:checked + label:before { background-image: url(/lib/img/dark/checkmark.svg);}
div.checkbox label { color: #000; font-size: 13px; font-weight: 300; margin-bottom: 0px; }
div.checkbox label a  { color: #fff;}
/*form button[type="submit"], form button[type="button"] { width: 100%; }*/
/*form button[type="submit"]:hover { background: #333; }*/

div.form-footer {}
div.form-footer > div {display: flex; gap: 10px; justify-content: space-between; align-items: flex-start}
div.form-footer button {width: 15px; display: block;padding: 0; margin: 0; background: none; line-height: 1;}
div.form-footer button img {width: 100%; }
div.form-footer > div > div {flex: 1;}

input[type=email]:focus, input[type=number]:focus, input[type=password]:focus, input[type=search], input[type=tel]:focus, input[type=text]:focus {box-shadow: none;}

*::-webkit-input-placeholder {  color: #BCBBBA; font-weight: 500;}
*::-moz-placeholder  {  color: #BCBBBA; font-weight: 500;}
*:-ms-input-placeholder  {  color: #BCBBBA; font-weight: 500;}

div.reveal-response p { color: #000; font-size: 20px; text-align: left;}


/*ANIMATIONS*/


.slide-in-bottom { transform: translateY(150px); opacity: 0;}
.slide-in-top { transform: translateY(-150px); opacity: 0;}
.in-better-view.slide-in-bottom {opacity: 1;	animation: slide-in-bottom 1.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;}
.in-better-view .slide-in-bottom {	opacity: 1; animation: slide-in-bottom 1.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;}
.in-better-view .slide-in-top {	opacity: 1;animation: slide-in-top 1.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;}

@keyframes bounce {
	0%  { transform: translateY(0px); }
	40%  { transform: translateY(20px); }
	100%  { transform: translateY(0px); }
}

@keyframes slide-in-top {
  0% { transform: translateY(-300px); opacity: 0;}
  100% {transform: translateY(0);opacity: 1;}
}

@keyframes slide-in-bottom {
  0% {transform: translateY(300px);opacity: 0;  }
  100% { transform: translateY(0);opacity: 1;  }
  }



@media only screen and (max-height: 880px) {
	div.home-nav  { bottom: 50px}
	div.home-nav > div { gap: 20px; }
	div.home-nav div a { font-size: 28px;}
	a.scroll-down { bottom: 30px;}
}

@media only screen and (max-width: 1520px) {
	
	:root {
	  --default-font-size: 20px;
	  --default-input-font-size: 18px;
	  --dim-input-height: 40px;
	  --button-font-size: 18px;
	  --button-height: 20px;
	}

	div.project-slider-index, div.project-info, div.caption-title, div.home-nav, section:not(.full):not(.max):not(.masthead):not(.full-screen) { padding-left: 30px; padding-right: 30px;}

	header > div { padding: 0px 30px 0;}
	header div.logo { width: 320px; padding-top: 30px}
	header div.burger { top: 20px;}
	header.attached.visible div.burger { top: 0px;}
	header nav { gap: 20px; width: 460px; padding: 169px 0 220px; }
	header nav a { font-size: 28px; }
	header nav img { width: 180px; bottom: 40px; }
	
	footer div.contacts { gap: 30px;}
	footer div.contacts strong, footer div.contacts p, footer div.contacts a { font-size: 18px;}
	footer div.logo { width: 50%}
	

	a.scroll-down { bottom: 30px;}
	.max div.fancy-title, .full div.fancy-title { max-width: calc(100% - 60px)}
	.full .charities-top div.fancy-title { max-width: 100%}


	p { margin-bottom: 30px; }
	h1 { font-size: 72px; }
	h2 { font-size: 48px; margin-bottom: 30px}
	h3 { font-size: 34px; margin-bottom: 30px}

	a.btn { font-size: 20px; padding-right: 26px; }
	a.btn:after {width: 10px; }
	div.home-nav { bottom: 50px; }
	div.home-nav > div { gap: 20px; }
	div.home-nav div a { font-size: 28px; }

	div.home-products { margin: 100px auto; gap: 30px; }
	div.home-products > div { padding-bottom: 40px;}
	div.home-products > div > div { width: 360px; }
	div.home-products div.title {font-size: 18px; margin-bottom: 20px; }
	div.home-products div.name {font-size: 48px; }
	div.home-products div.product-image a {font-size: 22px; padding-right: 26px; }
	div.home-products div.product-image a:after {width: 12px; }

	div.about div.subtitle { font-size: 18px; margin-bottom: 20px}

	div.fancy-title { display: flex; justify-content: space-between; gap: 20px; align-items: center; margin-bottom: 80px;}
	div.fancy-title span:first-child { font-size: 18px; }
	

	div.home-projects { padding-bottom: 42px}
	div.home-project div.logo { width: 320px; height: 80px; }
	div.home-project a {font-size: 24px; }
	div.home-products div.product-image a:after {width: 12px; }

	div.culture { padding: 140px 30px 100px;}
	div.culture div.caption { bottom: 100px; }
	div.culture div.caption p { margin: 0 auto 35px}

	div.full-screen div.video a.play-video {width: 40px;  }

	div.list-filter {gap: 30px; margin: 0 auto 50px 0;}
	div.projects-filter { margin: 0 0 50px auto; }

	div.news-list div.thumb {display: block; margin-bottom: 30px;}
	div.news-list div.date {margin-bottom: 10px; font-size: 20px; }
	div.news-list div.details {margin-bottom: 40px;}
	div.news-list div.title {margin-bottom: 20px; font-size: 22px; }
	div.news-entry { padding-bottom: 30px;}

	div.news-list.list { gap: 40px; }
	div.news-list.list div.news-entry { padding-bottom: 30px;}
	div.news-list.list div.details { gap: 40px;}
	div.news-list.list div.title { width: 33%; }

	div.caption-title  { position: absolute; bottom: 120px; left: 50%; transform: translateX(-50%); max-width: 1440px; text-align: left; z-index: 6;}

	div.culture-intro { gap: 60px; }
	div.culture-intro > div:first-child { width: 50%}
	div.culture-slider div.slick-slide { padding-bottom: 30px;}
	div.culture-slider ul.slick-dots { gap: 5px;}
	div.culture-2 img {height: 160px; }
	div.culture-3 img {padding-bottom: 40px; margin-top: 0px; }

	div.culture-videos a.play-video { width: 40px; }

	div.projects-grid { column-gap: 12px; row-gap: 12px;}

	div.more-projects { gap: 40px; }
	div.project-entry { padding-bottom: 40px; }

	div.project-entry > div:last-child { width: 25%;}
	div.project-entry div.thumb { height: 250px; }
	div.project-entry div.city { margin-bottom: 20px; font-size: 18px; }
	div.project-entry div.title { font-size: 48px; }
	div.project-entry p { margin-bottom: 10px; }
	div.skus { gap: 30px; }
	div.skus a { font-size: 20px; padding-right: 24px; }
	div.skus a:after {width: 12px}

	div.project-info {gap: 50px; margin: 0 auto 50px}
	div.project-info > div strong {font-size: 18px; margin-bottom: 30px}
	div.project-info > div span, div.project-info > div a  {font-size: 34px; }

	div.project-slider-main .slick-slide  {height: 50vw;}
	div.project-slider-main button.slick-arrow { width: 12px; height: 36px}
	div.project-slider-main button.slick-arrow.slick-next { right: 20px;}
	div.project-slider-main button.slick-arrow.slick-prev { left: 20px; }
	div.project-slider-index { margin: 30px auto;}
	div.project-slider-index div { width: 160px;height: 100px;}

	div.recent-projects { margin: 70px auto}
	div.recent-projects > div { padding-bottom: 40px; }
	div.recent-projects div.thumb { height: 260px;}
	div.recent-projects div.city { margin-bottom: 30px; font-size: 18px; }
	div.recent-projects div.title { margin-bottom: 30px;  font-size: 34px; }


	div.scale-meets div.caption-top { top: 40px}
	div.scale-meets div.caption-bottom { bottom: 300px}
	div.international-portfolio { margin-top: -230px; padding-bottom: 60px}
	div.portfolio-index { gap: 25px; }
	div.portfolio-index a { padding-left: 26px; }
	div.portfolio-index a:before { width: 10px;  }
	div.portfolio-text {margin: 30px auto 0 0; }
	img.big-flag { width: 400px}

	div.about-stats div.stat {font-size: 180px}
	div.about-stats p { font-size: 28px}

	div.charities-top { top: 40px}
	div.charities-middle {top: auto; left: 0; bottom: 40px; transform: none}
	div.charities-middle > div { gap: 30px}
	div.charity-box { gap: 20px}
	div.charity-box p { font-size: 18px; margin-bottom: 20px}

	div.timeline div.timeline-holder { width: calc(100vw - 60px); margin: 0 auto}
	div.timeline div.timeline-slide { width: 200%;}

	div.caption-vision2 { }
	div.vision-entry div.title { font-size: 10vw; }
	div.vision-entry div.message { font-size: 2.5vw}

	div.projects-grid div.logo p { font-size: 32px; line-height: 1.2}
	div.projects-grid div.logo span { font-size: 16px; padding-right: 20px; }
	div.projects-grid div.logo span:after {width: 9px; }

}

@media only screen and (max-width: 1440px) {
	div.home-projects > div { width: 270vw; max-width: 270vw; }

	/*PRODUCTS*/
	div.caption-product { padding: 0 30px 60px 30px; }
	div.caption-product p.eyebrow  { font-size: 24px; margin-bottom: 10px}
	div.caption-product a.scroll-down { bottom: 20px;}

	div.product-index { gap: 20px;; margin: 0 auto 50px; }
	div.product-index a { padding-right: 30px; background-size: 9px auto; font-size: 18px; padding-bottom: 2px}

	div.product-wrapper div.product-data { padding-left: 60px; }
	div.product-wrapper h2 { margin-bottom: 40px;}
	div.product-menu { gap: 10px; margin-bottom: 40px;}
	div.product-menu > a { font-size: 18px; padding-bottom: 16px; border-bottom: 2px solid transparent; }
	div.product-menu > a.active { border-bottom: 2px solid var(--col-primary); }
	div.product-info { margin-bottom: 40px;}

	div.product-images {gap: 10px;;}
	div.product-images a.active:after {top: -3px; left: -3px; width: calc(100% + 6px); height: calc(100% + 6px); border: 1px solid var(--col-primary); }

	div.product-versions { margin-top: 50px; }
	div.product-versions div.product-dots{ gap: 4px; }
	div.product-versions > a{ background-size: 9px auto; font-size: 18px; padding-bottom: 2px}
	div.product-versions > a:first-child { padding-left: 30px; }
	div.product-versions > a:last-child { padding-right: 30px;}
	div.product-versions div.product-dots a { width: 25px; }

}

@media only screen and (max-width: 1280px) {
	footer div.contacts { flex-wrap: wrap; gap: 36px; align-items: center; justify-content: center;}
	footer div.contacts > div { max-width: calc(33.33% - 27px); flex: auto}
	footer div.contacts div.form { width: 100%}

	div.values-data div.title { font-size: 28px;}
	div.values-data div.title { width: 30%;}

	div.timeline div.timeline-slide { width: 300%;}

		div.core-values { gap: 40px; }
		div.core-values > div:nth-child(odd) { padding-left: 30px; }
		div.core-values > div:nth-child(odd) span { font-size: 16px; }
		div.core-values > div:nth-child(odd) img { width: 18px;}
		div.core-values > div:nth-child(odd) img.cv-1 { width: 14px;}
		div.core-values > div:nth-child(odd) img.cv-2 { width: 20px;}
		div.core-values > div:nth-child(even) p { font-size: 20px; }
		div.core-values span.cv-line { width: 1px; left: 27%; }
		div.core-values span.cv-line span { width: 1px; }
		div.core-values span.cv-line span:after { width: 8px; height: 8px; left: -3px; border-radius: 8px; }
		div.core-values span.cv-line span:before { width: 1px; height: 12px; bottom: -12px; }

	div.product-wrapper div.product-data { padding-left: 30px; }

}

@media only screen and (max-width: 1080px) {
	div.product-wrapper  { flex-direction: column; gap: 30px}
	div.product-wrapper  div.product-image img { display: block; width: 100%; max-width: 600px; margin: 0 auto 0 0}
	div.product-wrapper div.product-data { padding-left: 0px; }
	div.product-header {height: 400px;}
	div.product-header > img {height: 100%; width: 100%; object-fit: cover; }
	div.product-index { gap: 5px;}
	div.product-index a { padding-right: 15px; background-size: 8px auto; font-size: 16px; padding-bottom: 1px; }
}

@media only screen and (max-width: 980px) {
	footer div.contacts { flex-direction: column; width: 400px; max-width: 100%; margin: 0 auto}
	footer div.contacts > div { width: 100%; max-width: 100%; text-align: center;}
	footer div.footer-nav { display: none}
	footer div.disclaimer p { text-align: center;}

div.scale-meets div.caption-top { position: relative; top: 0; left: 0; transform: none; padding: 50px 30px; background: #fff; margin-top: -100px}
div.scale-meets div.caption-top * { color: #000;}
div.scale-meets div.caption-bottom { position: relative; top: 0; left: 0; transform: none; padding: 50px 30px; text-align: center;}
div.scale-meets div.caption-bottom * { color: #000 !important}
	div.international-portfolio { margin-top: 50px; }

	div.about-stats div.stat {font-size: 100px}
	div.about-stats p { font-size: 20px}

	div.charities-top, div.charities-middle { top: 0px; left: 0; bottom: 0; position: relative; transform: none;}
	div.charities { padding: 40px 30px;}
	div.charities > img { position: absolute; width: 100%; height: 100%; object-fit: cover; top: 0; left: 0}
	div.charities-top { margin-bottom: 80px}
	div.charities-middle > div { display: grid; gap: 50px; grid-template-columns: 1fr 1fr; }
	 
	div.projects-grid div.logo p { font-size: 22px; margin-bottom: 20px}
	div.projects-grid div.logo span { font-size: 12px; padding-right: 16px; }
	div.projects-grid div.logo span:after {width: 9px; }
	div.product-index { gap: 5px;}
	div.product-index a { padding-right: 10px; background-size: 6px auto; font-size: 14px; padding-bottom: 1px; }

}

@media only screen and (max-width: 760px) {
	
	:root {
	  --default-font-size: 18px;
	  --default-input-font-size: 18px;
	  --dim-input-height: 40px;
	  --button-font-size: 18px;
	  --button-height: 20px;
	   --dim-default-space: 70px;
	}


	header > div { padding: 0}
	header div.logo { width: 200px; padding: 20px 0 0 20px}
	header div.burger ul {transform: scale(1)}
	header div.burger { top: 0px;}
	header.attached.visible div.burger { top: 0px;}
	header nav { height: 100vh; width: 100%;}
	header nav a { font-size: 28px; }
	header nav img { width: 180px; bottom: 40px; }
	
	footer {padding-top: 40px}
	footer div.contacts > div:nth-child(3), footer div.contacts > div:nth-child(4) { display: none;}
	footer div.logo { width: 70%; margin-bottom: 50px}
	div.footer { margin-bottom: 40px}


	a.scroll-down { bottom: 20px; width: 30px}

	p { margin-bottom: 30px; }
	h1 { font-size: 38px; }
	h2 { font-size: 28px; margin-bottom: 30px}
	h3 { font-size: 24px; margin-bottom: 30px}

	a.btn { font-size: 20px; padding-right: 26px; }
	a.btn:after {width: 10px; }
	div.home-nav { bottom: 70px; }
	div.home-nav > div { gap: 15px; }
	div.home-nav div a { font-size: 24px; }

	div.home-products { margin: 100px auto; gap:50px; }
	div.home-products > div { padding-bottom: 40px; flex-direction: column; gap: 20px}
	div.home-products > div > div { width: 100%; }
	div.home-products div.title {font-size: 12px; margin-bottom: 5px }
	div.home-products div.name {font-size: 26px; }
	div.home-products div.product-image a {font-size: 22px; padding-right: 26px; }
	div.home-products div.product-image a:after {width: 12px; }

	div.about div.subtitle { font-size: 18px; margin-bottom: 20px}

	div.fancy-title { display: block; margin-bottom: 50px}
	div.fancy-title span:first-child { font-size: 14px; margin-bottom: 15px}
	div.fancy-title span { width: 100%; display: block; }
	div.fancy-title span:last-child:after { width: 30%; left: auto; right: 0}

	.with-line:after { width: 30%; }
	

	div.home-projects { padding-bottom: 24px}
	div.home-project div.logo { width: 160px; height: 40px; }
	div.home-project a {font-size: 16px; top: auto; left: 0; width: 100%; text-align: center; bottom: 30px; transform: none;}
	div.home-products div.product-image a:after {width: 12px; }
	.line-dots ul.slick-dots { gap: 5px; bottom: -20px}
	.line-dots ul.slick-dots li { width: 20px}

	div.culture { padding: 140px 30px 100px;}
	div.culture div.caption { bottom: 20px; }
	div.culture div.caption p { margin: 0 auto 20px; padding: 0 20px; font-size: 16px}

	div.full-screen div.video a.play-video {width: 40px;  }
	div.video a.corp-video {width: 160px;  }

	div.list-filter {gap: 20px; margin: 0 auto 30px 0;}
	div.list-filter img { height: 20px}
	div.projects-filter { margin: 0 0 30px auto; }

	div.news-list { grid-template-columns: 1fr; }
	div.news-list div.thumb {display: block; margin-bottom: 20px;}
	div.news-list div.date {margin-bottom: 10px; font-size: 16px; }
	div.news-list div.details {margin-bottom: 30px;}
	div.news-list div.title {margin-bottom: 20px; font-size: 20px; }
	div.news-entry { padding-bottom: 30px;}

	div.news-list.list { gap: 40px; }
	div.news-list.list div.news-entry { padding-bottom: 30px; }
	div.news-list.list div.details { gap: 30px;flex-direction: column;}
	div.news-list.list div.title { width: 100%; }

	div.caption-title  { position: absolute; bottom: 120px; left: 50%; transform: translateX(-50%); max-width: 1440px; text-align: left; z-index: 6;}

	div.culture-intro { gap: 60px; flex-direction: column}
	div.culture-intro > div { width: 100% !important}
	div.culture-slider div.slick-slide { padding-bottom: 30px;}
	div.culture-slider ul.slick-dots { gap: 5px;}
	div.culture-2 img {height: 160px; }
	div.culture-3 img {padding-bottom: 40px; margin-top: 0px; }

	div.culture-videos { flex-direction: column; gap: 20px}
	div.culture-videos a.play-video { width: 40px; }

	div.projects-grid { column-gap: 12px; row-gap: 12px; grid-template-columns: 1fr 1fr;}
	div.projects-grid div.x2 { grid-column: span 1}
	div.projects-grid a { height: calc(50vw - 36px); display: block;}
	div.projects-grid a > img { display: block; width: 100%; height: 100%; object-fit: cover;}
	div.projects-grid div.y2 { grid-row: span 1}

	div.more-projects { gap: 40px; }
	div.project-entry { padding-bottom: 40px; flex-direction: column-reverse; gap: 20px}

	div.project-entry > div:last-child { width: 100%;}
	div.project-entry div.thumb { height: 250px; }
	div.project-entry div.city { margin-bottom: 10px; font-size: 16px; }
	div.project-entry div.title { font-size: 26px; }
	div.project-entry p { margin-bottom: 10px; }
	div.skus { gap: 10px; flex-direction: column; align-items: flex-start;}
	div.skus a { font-size: 16px; padding-right: 20px; }
	div.skus a:after {width: 10px}

	div.project-info {gap: 30px; margin: 0 auto 50px; flex-direction: column}
	div.project-info > div {display: grid; gap: 10px; grid-template-columns: 1fr 2fr; width: 100%}
	div.project-info > div strong {font-size: 16px; margin-bottom: 0px; line-height: 18px}
	div.project-info > div span, div.project-info > div a  {font-size: 18px; }

	div.project-slider-main .slick-slide  {height: 70vw;}
	div.project-slider-main button.slick-arrow { width: 12px; height: 36px}
	div.project-slider-main button.slick-arrow.slick-next { right: 20px;}
	div.project-slider-main button.slick-arrow.slick-prev { left: 20px; }
	div.project-slider-index { margin: 30px auto;}
	div.project-slider-index div { width: 31%; height: 80px;}

	div.recent-projects { margin: 70px auto; flex-direction: column}
	div.recent-projects > div { padding-bottom: 40px; }
	div.recent-projects div.thumb { height: 200px;}
	div.recent-projects div.city { margin-bottom: 10px; font-size: 16px; }
	div.recent-projects div.title { margin-bottom: 10px;  font-size: 24px; }

	div.portfolio-index {flex-direction: column; align-items: flex-start;}
	div.portfolio-text { min-height: 0; padding-bottom: 40px;}

	div.values-data { flex-direction: column; align-items: flex-start; gap: 30px; margin-top: 30px}
	div.values-data div.title { width: 100%}
	div.values-data div.title br { display: none}
	div.values-grid { gap: 2px}
	div.values-grid a.btn { margin: 10px auto 0 0; font-size: 9px; padding-right: 13px;}
	div.values-grid a.btn:after { width: 6px}

	div.about-stats div.stat {font-size: 48px}
	div.about-stats p { font-size: 12px; margin-top: 10px; line-height: 1.2}

	div.charities-middle > div { gap: 100px; grid-template-columns: 1fr; }

	div.timeline div.timeline-slide { width: 600%;}
	div.timeline div.last-row p { max-width: 50%; padding-right: 8px}
	div.timeline div.last-row div.single p { max-width: 100%;}
	div.timeline div.last-row ul { max-width: 50%; padding-right: 8px}
	div.timeline div.last-row div.single ul { max-width: 100%;}
	div.timeline-index div.dots span { width: 20px}

div.caption-vision2 { transform: none; top: 0; left: 0; position: relative; padding: 40px 30px; gap: 40px;}
div.vision-entry div.title { font-size: 28px; color:#000; -webkit-text-fill-color: #000;  -webkit-text-stroke: transparent; margin-bottom: 30px;}
div.vision-entry:hover div.title { -webkit-text-fill-color: #000;  }
div.vision-entry div.message { width: 100%; max-width: 100%; display: block; position: relative; right: 0px; top: 0px; opacity: 1; font-size: 18px; font-weight: 500; font-family: acumin-pro; color: #000; text-transform: none; font-style: normal; text-align: left;}
div.vision-entry:hover div.message { opacity: 1;}

div.about-stats div.stat { -webkit-text-stroke: 1px #fff; }

	div.core-values { display: grid; grid-template-columns: 1fr; }
	div.core-values > div { opacity: 1; text-align: center;}
	div.core-values > div:nth-child(odd) { padding-left: 0px; position: relative; display: flex; justify-content: center; gap: 20px; align-items: center;	}
	div.core-values > div:nth-child(odd) span { font-size: 16px; }
	div.core-values > div:nth-child(odd) img { width: 22px; position: relative;}
	div.core-values > div:nth-child(odd) img.cv-1 { width: 17px;}
	div.core-values > div:nth-child(odd) img.cv-2 { width: 25px;}
	div.core-values > div:nth-child(even) p {  font-size: 18px; }
	div.core-values span.cv-line { display: none !important;}

div.cookie-overlay > div { padding: 20px; max-height: 100%; overflow; auto;}
div.cookie-overlay > div p { font-size: 18px;}

	div.product-images {gap: 5px}
	div.product-versions > a { font-size: 0; padding: 0; width: 10px; height: 20px}
	div.product-menu { gap: 6px;}
	div.product-menu a { font-size: 13px; padding-bottom: 10px;}
	
	div.product-index { display: block; height: 42px; width: 100%; max-width: 400px;  margin: 0 auto 0 0; z-index: 3; position: relative; padding-top: 42px; overflow: hidden; margin-bottom: 20px}
	div.product-index.open { overflow: visible;}
	div.product-index:after { content:""; display: block; height: 42px; width: 100%; position: absolute; z-index: 3; background: transparent; top: 0; left: 0}
	div.product-index a { display: block; width: 100%; font-size: 15px; padding: 0 20px; line-height: 42px; color: #fff; background: var(--col-primary); opacity: 1; }
	div.product-index a.active { position: absolute; top: 0; left: 0; }
	div.product-index a.active:after { content:""; display: block; position: absolute; right: 10px; top: 0; width: 10px; height: 100%; background: url(/img/svg/arrow-down.svg) no-repeat center center; background-size: contain; }

}
