@charset "UTF-8";

/*
Theme Name: PCH
Theme URI: https://wordpress.org/themes/pch/
Author: the WordPress team
Author URI: https://wordpress.org/
Description: Twenty Twenty-One is a blank canvas for your ideas and it makes the block editor your best brush. With new block patterns, which allow you to create a beautiful layout in a matter of seconds, this theme’s soft colors and eye-catching — yet timeless — design will let your work shine. Take it for a spin! See how Twenty Twenty-One elevates your portfolio, business website, or personal blog.
Requires at least: 5.3
Tested up to: 5.6
Requires PHP: 5.6
Version: 2.99
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: pch
*/

body {
  font-feature-settings: 'case' on, 'salt' on, 'ss01' on, 'ss02' on, 'ss03' on;
}

.admin-bar .navbar-2.w-nav,
.admin-bar .site-content {
  margin-top: 32px;
}

a {
  color: inherit;
}

@media screen and (max-width: 767px) {
  .h-scroll-wrapper {
    overflow-x: scroll;
    overflow-y: none;
  }
}

.case-grid .case-separator:first-child {
  display: none;
}

.wp-block-image {
  margin: 0;
}

.case-grid .wp-block-image {
  position: relative;

  -ms-grid-row: span 1;
  grid-row-start: span 1;
  -ms-grid-row-span: 1;
  grid-row-end: span 1;
  -ms-grid-column: span 2;
  grid-column-start: span 2;
  -ms-grid-column-span: 2;
  grid-column-end: span 2;
}

.case-grid .wp-block-image img {
  width: 100%;
  height: auto;
}

.case-grid .wp-block-image figcaption {
  position: absolute;
  left: 0;

  display: block;

  width: 26.8085106383%;
  margin: 0;

  transform: translateY(30px);
  text-align: left;

  font-size: 14px;
  font-weight: 200;
  line-height: 140%;
}

.case-p-block p {
  margin-bottom: 30px;

  font-size: 22px;
  font-weight: 200;
}

.pch-fullwidth {
  -ms-grid-row: span 1;
  grid-row-start: span 1;
  -ms-grid-row-span: 1;
  grid-row-end: span 1;
  -ms-grid-column: span 2;
  grid-column-start: span 2;
  -ms-grid-column-span: 2;
  grid-column-end: span 2;
}

@media screen and (max-width: 767px) {
  .case-grid .wp-block-image figcaption {
    position: static;

    width: 100%;
    padding-right: 30px;

    transform: none;
  }

  .pch-fullwidth {
    -ms-grid-column: span 1;
    grid-column-start: span 1;
    -ms-grid-column-span: 1;
    grid-column-end: span 1;
  }

  .case-grid .wp-block-image {
    -ms-grid-column: span 1;
    grid-column-start: span 1;
    -ms-grid-column-span: 1;
    grid-column-end: span 1;
  }
}

.menu-sector.black .menu-dd-link.w-nav-link {
  color: #fff;
}

@media screen and (min-width: 1280px) {
  .new-case-grid:not(.filtering-is-enable) .case-study-content:nth-child(1),
  .new-case-grid:not(.filtering-is-enable) .case-study-content:nth-child(7),
  .new-case-grid:not(.filtering-is-enable) .case-study-content:nth-child(11) {
    -ms-grid-row: span 1;
    grid-row-start: span 1;
    -ms-grid-row-span: 1;
    grid-row-end: span 1;
    -ms-grid-column: span 2;
    grid-column-start: span 2;
    -ms-grid-column-span: 2;
    grid-column-end: span 2;
  }
}

.div-block-41 .filter-switch {
  color: #1b1c1e;
  background-color: #f7f8fa;
}

.div-block-41 .filter-switch:hover {
  background-color: #e7eaf0;
}

.filter-switch.isActive,
.filter-switch.isActive:hover {
  color: #fff;
  background-color: #5c63ff;
}

.filter-plus,
.filter-minus {
  transition: opacity 350ms ease;
}

.filter-switch.isActive .filter-minus {
  opacity: 1;
}

.filter-minus,
.filter-switch.isActive .filter-plus {
  opacity: 0;
}

.filtering-is-enable .case-study-content {
  display: none;
}

.filtering-is-enable .case-card--isActive {
  display: block;
}

.case-study-item.transparent {
  color: #000;
  background-color: transparent;
}

.align-container-center {
  max-width: 1800px;
  margin-right: auto;
  margin-left: auto;
}

/* FORM */

.input-magic:placeholder-shown {
  padding: 18px;

  transition: 300ms;

  background-color: #f7f8fa;
}

.input-magic:placeholder-shown:hover {
  color: rgba(0, 0, 0, 0.8);
}

.input-magic:placeholder-shown {
  padding: 18px;

  transition: 300ms;

  background-color: #f7f8fa;
}

.select-input.w-select {
  color: rgb(99, 99, 100);
  background-color: #f7f8fa;
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M17.298 12.478a.642.642 0 00.206-.44v-.005a.354.354 0 00-.103-.257.379.379 0 00-.268-.094c-.16 0-.334.08-.458.203l-3.103 3.085a.888.888 0 01-.6.243c-.287-.005-1.128-.005-1.848-.005-.197 0-.48-.057-.665-.242L7.331 11.86a.677.677 0 00-.453-.203.394.394 0 00-.278.1.37.37 0 00-.103.316.683.683 0 00.2.4l4.894 4.703a.604.604 0 00.834 0l4.873-4.698z' fill='%23000'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: calc(100% - 15px) center;

  appearance: none;
}

.btn-close-contact {
  cursor: pointer;
}

.textarea-magic:placeholder-shown {
  background-color: #f7f8fa;

  -webkit-appearance: none;
}

.checkbox {
  outline: none;
  background-image: url("data:image/svg+xml,%3Csvg width='17' height='17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M.586 3.554a3 3 0 013-3h10a3 3 0 013 3v10a3 3 0 01-3 3h-10a3 3 0 01-3-3v-10z' fill='%23E6E7EE'/%3E%3C/svg%3E");

  appearance: none;
  -webkit-appearance: none;
}

.checkbox:checked {
  background-image: url("data:image/svg+xml,%3Csvg width='17' height='17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23E6E7EE' d='M.586.554h16v16h-16z'/%3E%3Cpath d='M6.51 13.153c.25.25.674.25.924 0l7.35-7.35a.664.664 0 000-.924l-.9-.9a.634.634 0 00-.9 0l-6 6-2.825-2.8a.634.634 0 00-.9 0l-.9.9a.664.664 0 000 .925l4.15 4.15z' fill='%23000'/%3E%3C/svg%3E");
}

.overlay-link {
  position: absolute;
  z-index: 10;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;

  cursor: pointer;
}

.home .case > a {
  position: static;
}

.home .case > a::after {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;

  display: block;
}

.text-page-content h3,
.text-page-content h4 {
  margin-top: 30px;
  margin-bottom: 18px;

  font-weight: 400;
}

.text-page-content ul,
.text-page-content p {
  margin-bottom: 18px;

  font-size: 18px;
  font-weight: 100;
  line-height: 140%;
}

.state--progress {
  pointer-events: none;

  opacity: 0.8;
}

.state--success {
  display: none;
}

.w-form-done.is-active {
  display: block;
}

.popup {
  margin: auto;

  transition: opacity 500ms ease, transform 500ms ease;
}

.popupWrapper {
  position: fixed;
  z-index: 100;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;

  display: flex;
  flex-flow: column nowrap;

  transition: visibility 500ms ease, opacity 500ms ease;
}

.popupWrapper form {
  margin: auto;
}

.popupWrapper.isHidden {
  visibility: hidden;

  pointer-events: none;

  opacity: 0;
}

.popupWrapper.isHidden .popup {
  transform: translateY(100%);

  opacity: 0;
}

.pop-submit {
  border-width: 0;
}

.download-link[data-popup] {
  z-index: 1;
}

.s-footer.dark .footer-logo-link {
  color: #fff;
}

.latest-grid .download-link {
  z-index: 1;
}

.latest-card.img .latest-content {
  background-image: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(rgba(37, 37, 37, 0.72)),
    to(rgba(0, 0, 0, 0.2))
  );
  background-image: linear-gradient(
    180deg,
    rgba(37, 37, 37, 0.72),
    rgba(0, 0, 0, 0.2)
  );
}

.supplier-big-grid .supplier-grid .sys-link a::after {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;

  content: '';
}

.site-content .site-main {
  min-height: calc(100vh - 610px);
}

.wide_image {
  width: 100%;
}

@media screen and (max-width: 767px) {
  .news-card {
    -ms-grid-column: span 1;
    grid-column-start: span 1;
    -ms-grid-column-span: 1;
    grid-column-end: span 1;
  }
}

@media screen and (min-width: 768px) {
  .wide_newsroom {
    -ms-grid-row: span 1;
    grid-row-start: span 1;
    -ms-grid-row-span: 1;
    grid-row-end: span 1;
    -ms-grid-column: span 2;
    grid-column-start: span 2;
    -ms-grid-column-span: 2;
    grid-column-end: span 2;
  }

  .wide_newsroom h3 {
    max-width: 26ch;
    margin-top: 0px;
    margin-bottom: 24px;

    letter-spacing: -0.08em;

    font-size: 67px;
    font-weight: 200;
    line-height: 120%;
  }
}

.nav-menu .menu-dd-block > a {
  position: relative;

  display: inline-block;

  margin-bottom: 18px;

  text-align: left;
  vertical-align: top;
  text-decoration: none;

  color: #222222;
}

.footer-dd-list a {
  margin-bottom: 3px;

  white-space: nowrap;
  letter-spacing: 0.3px;

  font-weight: 300;
  line-height: 160%;
}

.footer-dd-list a:first-child {
  margin-top: 12px;
}

.footer-dd-list a:last-child {
  margin-bottom: 12px;
}

@media screen and (max-width: 991px) {
  .footer-dd-list a {
    margin-bottom: 12px;
  }
}

@media screen and (min-width: 768px) {
  .body-2 .width-blog {
    width: 67%;
  }
  .size-blog-width,
  .blog-body .wp-block-columns,
  .blog-body .wp-block-image figcaption,
  .blog-body p,
  .blog-body h2,
  .blog-body ul,
  .blog-body ol {
    width: 67%;
    min-width: 620px;
    margin-right: auto;
    margin-left: auto;
  }
}

.size-blog-width img {
  width: 100%;
}

.blog-body p {
  position: relative;

  margin-bottom: 30px;

  font-size: 22px;
  line-height: 140%;
}

.blog-body ul,
.blog-body ol {
  position: relative;

  margin-bottom: 15px;

  font-size: 22px;
  font-weight: 100;
  line-height: 140%;
}

.blog-body ul + h2,
.blog-body ol + h2,
.blog-body ul + p,
.blog-body ol + p {
  margin-top: 30px;
}

.blog-body h2 {
  max-width: none;
  margin-top: 0px;
  margin-bottom: 18px;

  letter-spacing: 0.02em;

  font-size: 22px;
  font-weight: 400;
  line-height: 28px;
}

/* Blog Grid */
@media screen and (min-width: 768px) {
  .blog-more-card:only-child,
  .blog-more-grid .blog-more-card:nth-child(3),
  .is-blog-page .news-card:nth-child(3) {
    -ms-grid-row: span 1;
    grid-row-start: span 1;
    -ms-grid-row-span: 1;
    grid-row-end: span 1;
    -ms-grid-column: span 2;
    grid-column-start: span 2;
    -ms-grid-column-span: 2;
    grid-column-end: span 2;
  }

  .is-blog-page .news-card:nth-child(3) h3 {
    max-width: 26ch;
    margin-top: 0px;
    margin-bottom: 24px;

    letter-spacing: -0.08em;

    font-size: 67px;
    font-weight: 200;
    line-height: 120%;
  }
}

.blog-body .wp-block-image img {
  width: 100%;
  height: auto;
  margin-bottom: 24px;

  border-radius: 3px;

  -o-object-fit: cover;
  object-fit: cover;
}

.blog-body .wp-block-image figcaption {
  margin-top: 0px;
  margin-bottom: 0px;

  text-align: left;
  letter-spacing: 0.015em;

  color: #000;

  font-size: 14px;
  font-weight: 100;
  line-height: 24px;
}

.blog-body p a,
.blog-body li a,
.blog-body figcaption a {
  box-shadow: inset 0 -1px #000;
}

.w-nav-menu.black .menu-dd-block > a {
  color: #fff;
}

.blog-body .wp-block-column .wp-block-image img,
.wp-block-media-text__media img,
.wp-block-media-text__media video {
  height: auto;
}

.case-study-content .case-study-item--bg.no-grad {
  background-color: #f7f8fa;
}

.case-study-content img + .case-study-item--bg.no-grad {
  background-color: transparent;
}

/* restile blocks */
.page-template-page-locations-acf .office-item {
  color: #000;
  background-color: #f7f8fa;
}

.page-template-page-locations-acf .card-lock._3fr {
  background-color: #f7f8fa;
}

.page-template-page-locations-acf .card-lock {
  color: #000;
  background-color: #f7f8fa;
}

.page-template-page-locations-acf .container.w-container {
  background-color: #ffffff;
}

.page-template-page-locations-acf div div h1 {
  color: #000;
}

.page-template-page-locations-acf .loc-show-more {
  color: #000000;
  background-color: #ffffff;
}

.page-template-page-locations-acf .lockation-block {
  color: #000;
  background-color: #f7f8fa;
}

.page-template-page-locations-acf .page-title {
  color: #000000;
}

.case-study-item.black {
  color: #fff;
}

/* COLOS */

.case-study-item.green_screen,
.news-card.green_screen {
  background-color: #19af60;
  color: #fff;
}

.case-study-item.lime_green,
.news-card.lime_green {
  background-color: #97d934;
}

.case-study-item.denim,
.news-card.denim {
  background-color: #1565c5;
  color: #fff;
}

.case-study-item.persimmon,
.news-card.persimmon {
  background-color: #ffa06a;
}

.case-study-item.web_blue,
.news-card.web_blue {
  color: #fff;
  background-color: #1c2fd7;
}

.case-study-item.jasmine,
.news-card.jasmine {
  background-color: #facc73;
}

.case-study-item.maya_blue,
.news-card.maya_blue {
  background-color: #5ac4ff;
}

.case-study-item.pc_blue,
.news-card.pc_blue {
  color: #fff;
  background-color: #5c62eb;
}