/*!
Theme Name: Savas Dev
Theme URI: https://underscores.me/
Author: Automattic
Author URI: https://automattic.com/
Description: Hi. I'm a starter theme called <code>base_theme</code>, or <em>underscores</em>, if you like. I'm a theme meant for hacking so don't use me as a <em>Parent Theme</em>. Instead try turning me into the next, most awesome, WordPress theme out there. That's what I'm here for.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: base_theme
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

base_theme is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/


@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap");
/*! modern-normalize v3.0.1 | MIT License | https://github.com/sindresorhus/modern-normalize */
/*
Document
========
*/
/**
Use a better box model (opinionated).
*/
*,
::before,
::after {
  box-sizing: border-box;
}
html {
  /* Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3) */
  font-family: system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
  line-height: 1.15; /* 1. Correct the line height in all browsers. */
  -webkit-text-size-adjust: 100%; /* 2. Prevent adjustments of font size after orientation changes in iOS. */
  -moz-tab-size: 4;
    -o-tab-size: 4;
       tab-size: 4; /* 3. Use a more readable tab size (opinionated). */
}
/*
Sections
========
*/
body {
  margin: 0; /* Remove the margin in all browsers. */
}
/*
Text-level semantics
====================
*/
/**
Add the correct font weight in Chrome and Safari.
*/
b,
strong {
  font-weight: bolder;
}
/**
1. Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)
2. Correct the odd 'em' font sizing in all browsers.
*/
code,
kbd,
samp,
pre {
  font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace; /* 1 */
  font-size: 1em; /* 2 */
}
/**
Add the correct font size in all browsers.
*/
small {
  font-size: 80%;
}
/**
Prevent 'sub' and 'sup' elements from affecting the line height in all browsers.
*/
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sub {
  bottom: -0.25em;
}
sup {
  top: -0.5em;
}
/*
Tabular data
============
*/
/**
Correct table border color inheritance in Chrome and Safari. (https://issues.chromium.org/issues/40615503, https://bugs.webkit.org/show_bug.cgi?id=195016)
*/
table {
  border-color: currentcolor;
}
/*
Forms
=====
*/
/**
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
*/
button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}
/**
Correct the inability to style clickable types in iOS and Safari.
*/
button,
[type=button],
[type=reset],
[type=submit] {
  -webkit-appearance: button;
}
/**
Remove the padding so developers are not caught out when they zero out 'fieldset' elements in all browsers.
*/
legend {
  padding: 0;
}
/**
Add the correct vertical alignment in Chrome and Firefox.
*/
progress {
  vertical-align: baseline;
}
/**
Correct the cursor style of increment and decrement buttons in Safari.
*/
::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}
/**
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/
[type=search] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}
/**
Remove the inner padding in Chrome and Safari on macOS.
*/
::-webkit-search-decoration {
  -webkit-appearance: none;
}
/**
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to 'inherit' in Safari.
*/
::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}
/*
Interactive
===========
*/
/*
Add the correct display in Chrome and Safari.
*/
summary {
  display: list-item;
}
/*
This file is used to contain all abstracts imports.
Files inside this folder can contain abstract settings,
helpers or functions. They have no direct output.
*/
/*
This file is used to contain all base imports.
Files inside this folder can contain global styles used in
the project.
*/
html,
body {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
html *,
body * {
  box-sizing: inherit;
}
html {
  scroll-behavior: smooth;
  background-color: #F7F6F4;
}
.site-main {
  min-height: 100vh;
  min-height: 100svh;
  padding: 16px;
}
@media screen and (min-width: 768px) {
  .site-main {
    padding: 64px;
  }
}
html {
  font-family: "Inter", sans-serif;
  font-weight: normal;
  color: #727272;
  line-height: 1.5;
  font-size: 14px;
}
@media only screen and (min-width: 600px) {
  html {
    font-size: 15px;
  }
}
@media only screen and (min-width: 1080px) {
  html {
    font-size: 16px;
  }
}
h1 {
  font-size: clamp(28px, 4vw, 48px);
}
h2 {
  font-size: clamp(24px, 3vw, 40px);
}
h3 {
  font-size: clamp(20px, 2.5vw, 32px);
}
h4 {
  font-size: clamp(18px, 2vw, 24px);
}
h5 {
  font-size: 18px;
}
h6 {
  font-size: 14px;
}
h1, h2, h3, h4, h5, h6 {
  margin: 0;
  margin-bottom: 1em;
  line-height: 1.2;
  color: #727272;
}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
  font-weight: inherit;
}
p {
  margin-bottom: 0;
  color: #727272;
}
.text-small {
  font-size: 13px;
}
.text-caption {
  font-size: 11px;
  letter-spacing: 0.04em;
}
a {
  color: #727272;
  text-decoration: none;
}
a:hover {
  color: #505050;
}
em {
  font-style: italic;
}
strong {
  font-weight: bold;
}
.uppercase {
  text-transform: uppercase;
}
.section-title {
  font-size: 24px;
  font-weight: 600;
  line-height: 33px;
  text-align: center;
  margin-bottom: 40px;
}
/*
This file is used to contain all component imports.
Files inside this folder should contain all styles relating
to a reusable component.
*/
.container {
  display: block;
  margin: 0 auto;
  padding: 0 1em;
  max-width: 1080px;
}
.side-menu {
  position: fixed;
  width: 100vw;
  top: 0;
  right: -100vw;
  padding: 50px 25px;
  height: 100vh;
  transform: translateX(0);
  transition: all 0.5s cubic-bezier(0, 0, 0.2, 1);
  z-index: 100;
  font-size: 24px;
  line-height: 33px;
  background-color: #fff;
}
.side-menu.active {
  transform: translateX(-100%);
  transition: all 0.5s cubic-bezier(0, 0, 0.2, 1);
}
.side-menu .side-menu-header {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 60px;
}
.side-menu .side-menu-content {
  overflow: auto;
  height: 100%;
  padding-bottom: 80px;
  -ms-overflow-style: none; /* for Internet Explorer, Edge */
  scrollbar-width: none; /* for Firefox */
  overflow-y: scroll;
}
.side-menu .side-menu-content::-webkit-scrollbar {
  display: none; /* for Chrome, Safari, and Opera */
}
.side-menu .side-menu-content .navigation__links {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 50px;
  line-height: 50px;
}
.side-menu .side-menu-content .navigation__links li {
  margin-left: 0;
  margin-bottom: 30px;
}
.side-menu .side-menu-content .navigation__links li.has-children {
  margin-bottom: 10px;
}
.side-menu .side-menu-content .navigation__links li.has-children > a {
  display: block;
  margin-bottom: 0.4em;
}
.side-menu .side-menu-content .navigation__links li.has-children.active .navigation__links-sub {
  display: flex;
}
.side-menu .side-menu-content .navigation__links-sub {
  padding-left: 30px;
  display: none;
  font-size: 40px;
  line-height: 40px;
}
.side-menu .side-menu-content .navigation__links .navigation__links-sub li {
  margin-bottom: 15px;
}
@media screen and (min-width: 1100px) {
  .side-menu {
    position: static;
    width: auto;
    height: auto;
    right: auto;
    top: auto;
    padding: 0;
    background: transparent;
    transform: none;
    transition: none;
    display: flex;
    flex: 1;
    justify-content: center;
  }
  .side-menu.active {
    transform: none;
  }
  .side-menu .side-menu-header {
    display: none;
  }
  .side-menu .side-menu-content {
    overflow: visible;
    height: auto;
    padding: 0;
    display: flex;
    justify-content: center;
    -ms-overflow-style: auto;
    scrollbar-width: auto;
  }
  .side-menu .side-menu-content::-webkit-scrollbar {
    display: block;
  }
  .side-menu .side-menu-content .navigation__links {
    display: flex;
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 22px;
    line-height: 24px;
  }
  .side-menu .side-menu-content .navigation__links li {
    margin-left: 24px;
    margin-bottom: 0;
  }
  .side-menu .side-menu-content .navigation__links li:first-child {
    margin-left: 0;
  }
}
.slider {
  position: relative;
  max-width: 100%;
}
.slider__viewport {
  overflow: hidden;
}
.slider__container {
  display: flex;
  touch-action: pan-y pinch-zoom;
}
.slider__slide {
  flex: 0 0 100%;
  min-width: 0;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 32px 16px;
  text-align: center;
}
.slider__slide-media {
  width: 100%;
  margin-bottom: 16px;
}
.slider__slide-media img {
  width: 100%;
  height: auto;
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
  max-height: 50vh;
}
.slider__slide-text {
  font-size: 16px;
  line-height: 1.5;
  color: #505050;
  max-width: 32em;
}
.slider__prev, .slider__next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  width: 48px;
  height: 48px;
  padding: 0;
  border: none;
  background: #fff;
  color: #505050;
  cursor: pointer;
  border-radius: 50%;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  font-size: 24px;
  line-height: 1;
  transition: opacity 0.2s;
}
.slider__prev:hover, .slider__next:hover {
  opacity: 0.9;
}
.slider__prev:focus, .slider__next:focus {
  outline: 2px solid #505050;
  outline-offset: 2px;
}
.slider__prev {
  left: 16px;
}
.slider__prev::before {
  content: "‹";
}
.slider__next {
  right: 16px;
}
.slider__next::before {
  content: "›";
}
.section--slider {
  padding: 32px 0;
}
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  color: #727272;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  transition: color 0.4s ease;
}
.btn .btn-icon {
  flex-shrink: 0;
  transition: transform 0.55s cubic-bezier(0.16, 1, 0.3, 1);
}
.btn .btn-label {
  position: relative;
}
.btn .btn-label::after {
  content: "";
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 0;
  height: 1px;
  background-color: currentColor;
  transition: width 0.65s cubic-bezier(0.16, 1, 0.3, 1);
}
.btn:hover {
  color: #888480;
}
.btn:hover .btn-icon {
  transform: translateX(2px);
}
.btn:hover .btn-label::after {
  width: 100%;
}
.btn--outline {
  padding: 9px 24px;
  border: 1px solid #C2BEB9;
  border-radius: 100px;
  transition: color 0.4s ease, border-color 0.4s ease;
}
.btn--outline .btn-label::after {
  display: none;
}
.btn--outline:hover {
  color: #505050;
  border-color: #888480;
}
.btn--outline:hover .btn-icon {
  transform: translateX(2px);
}
.btn--solid {
  padding: 9px 24px;
  border-radius: 100px;
  background-color: #DCD9D4;
  color: #888480;
  transition: color 0.4s ease, background-color 0.4s ease;
}
.btn--solid .btn-label::after {
  display: none;
}
.btn--solid:hover {
  background-color: #888480;
  color: #fff;
}
.btn--solid:hover .btn-icon {
  transform: translateX(2px);
}
.btn--quiet {
  opacity: 0.45;
  transition: color 0.4s ease, opacity 0.5s ease;
}
.btn--quiet:hover {
  opacity: 1;
  color: #888480;
}
.btn--quiet:hover .btn-icon {
  transform: translateX(2px);
}
.btn--quiet:hover .btn-label::after {
  width: 100%;
}
.btn--tag {
  padding: 4px 14px;
  background-color: #DCD9D4;
  color: #888480;
  border-radius: 100px;
  font-size: 12px;
  gap: 5px;
  transition: color 0.4s ease, background-color 0.4s ease;
}
.btn--tag .btn-label::after {
  display: none;
}
.btn--tag:hover {
  background-color: #C2BEB9;
  color: #505050;
}
.btn--tag:hover .btn-icon {
  transform: translateX(2px);
}
.button-icon {
  display: block;
  border: none;
  height: 30px;
  width: 30px;
  background-color: transparent;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.button-icon-menu {
  background-image: url("src/images/icon-menu.svg");
  height: 19px;
}
.button-icon-search {
  background-image: url("src/images/icon-search.svg");
}
.button-icon-close {
  background-image: url("src/images/icon-close.svg");
}
.button-icon-close-white {
  background-image: url("src/images/icon-close-white.svg");
}
.button-icon-social-youtube {
  background-image: url("src/images/icon-social-youtube.svg");
  width: 44px;
}
.button-icon-social-instagram {
  background-image: url("src/images/icon-social-instagram.svg");
}
.button-icon-social-twitter {
  background-image: url("src/images/icon-social-twitter.svg");
}
.button-icon-social-facebook {
  background-image: url("src/images/icon-social-facebook.svg");
}
.card {
  background-color: #F2F2F2;
  padding: 16px;
  border-radius: 8px;
}
.card-outlined {
  background-color: transparent;
  border: 1px solid #DCDCDC;
}
.case-image {
  max-width: 100%;
  border-radius: 8px;
  margin-bottom: 8px;
}
.case p {
  margin-bottom: 16px;
}
.case-title {
  margin-bottom: 16px;
}
.case-title a {
  text-decoration: none;
  color: #727272;
}
.surface {
  padding: 24px;
  border-radius: 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.surface .btn {
  color: inherit;
  opacity: 0.65;
  transition: opacity 0.4s ease;
}
.surface .btn:hover {
  opacity: 1;
  color: inherit;
  transform: none;
}
.surface .btn:hover .btn-icon {
  transform: translateX(2px);
}
.surface .btn:hover .btn-label::after {
  width: 100%;
}
.surface .btn--outline {
  border-color: currentColor;
  opacity: 0.65;
}
.surface .btn--outline:hover {
  opacity: 1;
  border-color: currentColor;
}
.surface .btn--solid {
  background-color: currentColor;
  opacity: 0.2;
}
.surface .btn--solid:hover {
  opacity: 0.35;
}
.surface .btn--tag {
  background-color: transparent;
  border: 1px solid currentColor;
  opacity: 0.55;
}
.surface .btn--tag:hover {
  opacity: 1;
  background-color: transparent;
}
.surface--01 {
  background: #F7F6F4;
  color: #505050;
}
.surface--02 {
  background: #F7F6F4;
  color: #727272;
}
.surface--03 {
  background: #fff;
  color: #727272;
}
.surface--04 {
  background: #F2F2F2;
  color: #727272;
}
.surface--05 {
  background: #DCDCDC;
  color: #727272;
}
.surface--06 {
  background: #DCDCDC;
  color: #505050;
}
.surface--07 {
  background: #DCD9D4;
  color: #727272;
}
.surface--08 {
  background: #DCD9D4;
  color: #505050;
}
.surface--09 {
  background: #C2BEB9;
  color: #505050;
}
.surface--10 {
  background: #C2BEB9;
  color: #727272;
}
.surface--11 {
  background: #A6A29C;
  color: #F7F6F4;
}
.surface--12 {
  background: #A6A29C;
  color: #fff;
}
.surface--13 {
  background: #888480;
  color: #F7F6F4;
}
.surface--14 {
  background: #888480;
  color: #fff;
}
.surface--15 {
  background: #727272;
  color: #F7F6F4;
}
.surface--16 {
  background: #505050;
  color: #DCD9D4;
}
.el-1 {
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.09), 0 1px 2px rgba(0, 0, 0, 0.13);
}
.el-2 {
  box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1), 0 2px 3px rgba(0, 0, 0, 0.14);
}
.el-3 {
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.11), 0 5px 5px rgba(0, 0, 0, 0.14);
}
.el-4 {
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.13), 0 8px 8px rgba(0, 0, 0, 0.14);
}
.el-hover--1 {
  transition: box-shadow 0.45s cubic-bezier(0.16, 1, 0.3, 1);
}
.el-hover--1:hover {
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.09), 0 1px 2px rgba(0, 0, 0, 0.13);
}
.el-hover--2 {
  transition: box-shadow 0.45s cubic-bezier(0.16, 1, 0.3, 1);
}
.el-hover--2:hover {
  box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1), 0 2px 3px rgba(0, 0, 0, 0.14);
}
.el-hover--3 {
  transition: box-shadow 0.45s cubic-bezier(0.16, 1, 0.3, 1);
}
.el-hover--3:hover {
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.11), 0 5px 5px rgba(0, 0, 0, 0.14);
}
.el-hover--4 {
  transition: box-shadow 0.45s cubic-bezier(0.16, 1, 0.3, 1);
}
.el-hover--4:hover {
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.13), 0 8px 8px rgba(0, 0, 0, 0.14);
}
/*
This file is used to contain all layout imports.
Files inside this folder should contain all styles relating
to layouts.
*/
.site-footer {
  background: #fff;
  color: #505050;
  padding: 32px 50px;
}
.site-footer-logos img {
  max-width: 100%;
  max-height: 35px;
  margin-left: 30px;
  filter: grayscale(1);
}
.site-footer .site-info {
  padding-top: 15px;
  margin: auto;
  border-top: 3px solid #505050;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
}
.site-footer .footer-social {
  display: flex;
  flex-direction: row;
  padding-bottom: 15px;
}
.site-footer .footer-social a {
  margin-right: 15px;
}
@media screen and (max-width: 768px) {
  .site-footer {
    padding: 32px 15px;
  }
  .site-footer .footer-social a {
    margin-left: 0;
    margin-right: 15px;
    margin-bottom: 15px;
  }
  .site-footer-logos img {
    margin-left: 0;
    margin-right: 15px;
  }
}
.site-header {
  display: none;
  background: #fff;
  color: #505050;
  padding: 20px 0;
  max-width: 100%;
}
.site-header .header-container {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.site-header .site-branding {
  margin-right: 0;
  height: 40px;
}
.site-header .navigation {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  padding-left: 32px;
}
.site-header .navigation__buttons {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
}
@media (min-width: 1100px) {
  .site-header .navigation .side-menu-open {
    display: none;
  }
}
.site-header .side-menu .navigation__links a {
  color: #505050;
  font-weight: 600;
  text-transform: lowercase;
  text-decoration: none;
}
.section--logo-gallery {
  padding: 40px 0;
}
.section--logo-gallery .logo-gallery {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 24px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.section--logo-gallery .logo-gallery__item {
  display: flex;
  align-items: center;
  justify-content: center;
}
.section--logo-gallery .logo-gallery__item a {
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: inherit;
}
.section--logo-gallery .logo-gallery__item img {
  max-width: 100%;
  height: auto;
  display: block;
}
@media (max-width: 1024px) {
  .section--logo-gallery .logo-gallery {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 768px) {
  .section--logo-gallery .logo-gallery {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 480px) {
  .section--logo-gallery .logo-gallery {
    grid-template-columns: 1fr;
  }
}
.ks-page-header {
  margin-bottom: 64px;
}
.ks-page-header h1 {
  margin-bottom: 0;
}
.ks-overline {
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: 8px;
}
.ks-section {
  margin-bottom: 64px;
}
.ks-label {
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 24px;
  padding-bottom: 12px;
  border-bottom: 1px solid #DCDCDC;
}
.ks-demo {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.ks-demo--row {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 24px;
}
.ks-swatches {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
}
.ks-swatch {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 160px;
}
.ks-swatch-block {
  height: 56px;
  border-radius: 3px;
}
.ks-swatch-label {
  font-size: 11px;
  letter-spacing: 0.03em;
}
.ks-sub-label {
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-top: 40px;
  margin-bottom: 20px;
  color: #A6A29C;
}
.ks-surface-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 400px));
  gap: 16px;
}
.site-label {
  display: block;
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #A6A29C;
  margin-bottom: 8px;
}
.site-name {
  color: #505050;
  margin-bottom: 80px;
}
.hero {
  margin-top: 0;
  padding: 48px 0 40px;
  border-bottom: 1px solid #DCDCDC;
  border-top: 1px solid #DCDCDC;
}
.hero-overline {
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #A6A29C;
  margin-bottom: 32px;
}
.hero-heading {
  font-size: clamp(32px, 5vw, 56px);
  line-height: 1.1;
  color: #505050;
  margin-bottom: 24px;
  max-width: 700px;
}
.hero-body {
  max-width: 460px;
  margin-bottom: 40px;
}
.services {
  padding: 80px 0;
  border-bottom: 1px solid #DCDCDC;
}
.services-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 48px;
  flex-wrap: wrap;
  gap: 16px;
}
.services-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  border-top: 1px solid #DCDCDC;
}
.service {
  padding: 32px;
  border-right: 1px solid #DCDCDC;
}
.service:last-child {
  border-right: none;
}
.service-type {
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #A6A29C;
  margin-bottom: 16px;
  display: block;
}
.service-title {
  margin-bottom: 12px;
}
.service-skills {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 20px;
}
.process {
  padding: 80px 0;
  border-bottom: 1px solid #DCDCDC;
}
.process-header {
  margin-bottom: 56px;
}
.process-steps {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 40px 32px;
}
.step-num {
  display: block;
  font-size: clamp(56px, 8vw, 96px);
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.03em;
  color: #DCD9D4;
  margin-bottom: 4px;
}
.step-label {
  display: block;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #A6A29C;
  margin-bottom: 16px;
}
.step-title {
  color: #505050;
  margin-bottom: 8px;
}
.testimonials {
  padding: 80px 0;
  border-bottom: 1px solid #DCDCDC;
}
.testimonials-header {
  margin-bottom: 56px;
}
.testimonials-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
}
@media (max-width: 600px) {
  .testimonials-grid {
    grid-template-columns: 1fr;
    gap: 48px;
  }
}
.testimonial {
  margin: 0;
}
.testimonial-quote {
  font-size: 18px;
  line-height: 1.65;
  color: #505050;
  margin-bottom: 24px;
}
.testimonial-quote::before {
  content: "“";
}
.testimonial-quote::after {
  content: "”";
}
.testimonial-author {
  font-size: 13px;
  color: #727272;
  display: block;
}
.testimonial-company {
  color: #A6A29C;
}
.clients {
  padding: 80px 0;
  border-bottom: 1px solid #DCDCDC;
}
.clients-heading {
  color: #505050;
  margin-bottom: 8px;
}
.clients-hint {
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #A6A29C;
  margin-bottom: 40px;
}
.clients-grid {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 48px 56px;
}
.client {
  display: flex;
  align-items: center;
  text-decoration: none;
}
.client-logo {
  max-height: 36px;
  width: auto;
  filter: grayscale(1) opacity(0.5);
  transition: filter 0.4s ease;
}
.client:hover .client-logo {
  filter: grayscale(0) opacity(1);
}
.contact {
  padding: 80px 0;
}
.contact-inner {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 40px;
}
.contact-heading {
  font-size: clamp(24px, 3vw, 40px);
  line-height: 1.2;
  color: #505050;
  max-width: 480px;
  margin-bottom: 0;
}
.contact-action {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}
.contact-email {
  font-size: 13px;
  color: #A6A29C;
}
/*# sourceMappingURL=style.css.map */