/* Shared foundation used by the Niki V2 homepage and service archives. */
.featured-content { position: relative; z-index: 2; margin: 0; color: #fff; }
.featured-content .featured-content__heading { display: flex; flex-wrap: wrap; align-items: center; gap: 0; }
.featured-content__heading-line { display: flex; align-items: center; gap: 2rem; min-width: 0; }
.featured-content__subtitle { width: auto; margin: .8rem 0 0; }
.featured-content .category-section-copy { flex: 1 1 auto; }
.featured-content .clients-icon-wrapper { position: relative; z-index: 1; display: flex; flex: 0 0 auto; align-items: center; justify-content: center; height: auto; padding: 0; pointer-events: none; }
.featured-content .clients-section-icon { width: auto; height: auto; max-width: 12rem; max-height: 12rem; opacity: .9; }
.featured-content .clients-section-icon-font { color: rgb(255 255 255 / 90%); font-size: 4rem; }
.featured-content-swiper { width: 100%; overflow: hidden; margin: 4rem 0; }
.featured-content-swiper .swiper-wrapper { align-items: center; }
.featured-content-swiper .swiper-slide { width: clamp(23rem, 24vw, 32rem); height: auto; }
.featured-content__card { height: 100%; }
.featured-content__link { display: block; overflow: hidden; border-radius: 1.2rem; background: #29252d; color: #fff; text-decoration: none; }
.featured-content__link:hover { color: #fff; }
.featured-content__media { overflow: hidden; border-radius: inherit; }
.featured-content__image, .featured-content__image-placeholder, .featured-content__shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.featured-content__image { z-index: 0; object-fit: cover; transition: transform .4s ease; }
.featured-content__image-placeholder { z-index: 0; display: grid; place-items: center; background: #302a35; color: rgb(255 255 255 / 35%); font-size: 3rem; }
.featured-content__shade { z-index: 1; background: linear-gradient(0deg, rgb(0 0 0 / 82%), transparent 76%); }
.featured-content__media > .featured-content__title { position: absolute; z-index: 2; top: auto; right: 1rem; bottom: 1.8rem; left: 1rem; width: auto; height: auto; margin: 0; color: #fff; font-size: 2rem; font-weight: 700; text-align: center; text-shadow: 0 0 .8rem rgb(128 93 182 / 65%); transition: bottom .7s ease-in-out; }
.featured-content__details { position: absolute; z-index: 2; inset: auto 0 0; display: flex; flex-direction: column; align-items: center; padding: 1.6rem 1.4rem 2rem; text-align: center; justify-content: flex-end; }
.featured-content__badge { display: inline-block; margin-bottom: .7rem; padding: .3rem .8rem; border-radius: 2rem; background: #805db6; color: #fff; font-size: 1.2rem; }
.featured-content__details h3 { margin: 0 0 .5rem; color: #fff; font-size: 2rem; font-weight: 700; }
.featured-content__details p { margin: 0 0 1rem; color: rgb(255 255 255 / 82%); font-size: 1.4rem; line-height: 1.7; text-shadow: 0 0 .8rem rgb(128 93 182 / 55%); }
.featured-content__details .featured-content__badge, .featured-content__details p, .featured-content__details .btn { opacity: 0; transform: translateY(.5rem); transition: opacity .7s ease-in-out, transform .7s ease-in-out; }
.featured-content__link:hover .featured-content__media > .featured-content__title, .featured-content__link:focus-visible .featured-content__media > .featured-content__title { bottom: 16rem; }
.featured-content__link:hover .featured-content__details .featured-content__badge, .featured-content__link:hover .featured-content__details p, .featured-content__link:hover .featured-content__details .btn, .featured-content__link:focus-visible .featured-content__details .featured-content__badge, .featured-content__link:focus-visible .featured-content__details p, .featured-content__link:focus-visible .featured-content__details .btn { opacity: 1; transform: translateY(0); }
@media (hover: hover) and (pointer: fine) { .featured-content__link { transition: transform .4s ease, box-shadow .4s ease; } .featured-content__link:hover { transform: translateY(-2px); box-shadow: 0 .8rem 2rem rgb(0 0 0 / 22%); } .featured-content__link:hover .featured-content__image { transform: scale(1.025); } }
@media (max-width: 767.98px) { .featured-content .featured-content__heading { display: block; } .featured-content__heading-line { align-items: flex-start; flex-direction: column; gap: 1.2rem; } .featured-content .category-section-copy { min-width: 0; width: 100%; } .featured-content .category-section-copy .headline__title { margin: 0; } .featured-content .clients-section-icon { max-width: 6.4rem; max-height: 6.4rem; } .featured-content .clients-section-icon-font { font-size: 3rem; } .featured-content__subtitle { line-height: 1.8; } .featured-content-swiper { margin: 2.5rem 0; } .featured-content-swiper .swiper-slide { width: min(72vw, 30rem); } .featured-content__details { padding: 1.2rem 1rem 1.6rem; } .featured-content__media > .featured-content__title { bottom: 18rem; } .featured-content .featured-content__details .featured-content__badge, .featured-content .featured-content__details p, .featured-content .featured-content__details .btn { opacity: 1 !important; transform: none !important; } }
@font-face { font-family: Peyda; src: url('../../fonts/fonts/PeydaWeb/eot/PeydaWeb-Thin.eot'); src: url('../../fonts/fonts/PeydaWeb/eot/PeydaWeb-Thin.eot?#iefix') format('embedded-opentype'), url('../../fonts/fonts/PeydaWeb/woff2/PeydaWeb-Thin.woff2') format('woff2'), url('../../fonts/fonts/PeydaWeb/woff/PeydaWeb-Thin.woff') format('woff'); font-style: normal; font-weight: 100; font-display: swap; }
@font-face { font-family: Peyda; src: url('../../fonts/fonts/PeydaWeb/eot/peydaWeb-extralight.eot'); src: url('../../fonts/fonts/PeydaWeb/eot/peydaWeb-extralight.eot?#iefix') format('embedded-opentype'), url('../../fonts/fonts/PeydaWeb/woff2/peydaWeb-extralight.woff2') format('woff2'), url('../../fonts/fonts/PeydaWeb/woff/peydaWeb-extralight.woff') format('woff'); font-style: normal; font-weight: 200; font-display: swap; }
@font-face { font-family: Peyda; src: url('../../fonts/fonts/PeydaWeb/eot/peydaWeb-light.eot'); src: url('../../fonts/fonts/PeydaWeb/eot/peydaWeb-light.eot?#iefix') format('embedded-opentype'), url('../../fonts/fonts/PeydaWeb/woff2/peydaWeb-light.woff2') format('woff2'), url('../../fonts/fonts/PeydaWeb/woff/peydaWeb-light.woff') format('woff'); font-style: normal; font-weight: 300; font-display: swap; }
@font-face { font-family: Peyda; src: url('../../fonts/fonts/PeydaWeb/eot/PeydaWeb-Regular.eot'); src: url('../../fonts/fonts/PeydaWeb/eot/PeydaWeb-Regular.eot?#iefix') format('embedded-opentype'), url('../../fonts/fonts/PeydaWeb/woff2/PeydaWeb-Regular.woff2') format('woff2'), url('../../fonts/fonts/PeydaWeb/woff/PeydaWeb-Regular.woff') format('woff'); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: Peyda; src: url('../../fonts/fonts/PeydaWeb/eot/PeydaWeb-Medium.eot'); src: url('../../fonts/fonts/PeydaWeb/eot/PeydaWeb-Medium.eot?#iefix') format('embedded-opentype'), url('../../fonts/fonts/PeydaWeb/woff2/PeydaWeb-Medium.woff2') format('woff2'), url('../../fonts/fonts/PeydaWeb/woff/PeydaWeb-Medium.woff') format('woff'); font-style: normal; font-weight: 500; font-display: swap; }
@font-face { font-family: Peyda; src: url('../../fonts/fonts/PeydaWeb/eot/PeydaWeb-SemiBold.eot'); src: url('../../fonts/fonts/PeydaWeb/eot/PeydaWeb-SemiBold.eot?#iefix') format('embedded-opentype'), url('../../fonts/fonts/PeydaWeb/woff2/PeydaWeb-SemiBold.woff2') format('woff2'), url('../../fonts/fonts/PeydaWeb/woff/PeydaWeb-SemiBold.woff') format('woff'); font-style: normal; font-weight: 600; font-display: swap; }
@font-face { font-family: Peyda; src: url('../../fonts/fonts/PeydaWeb/eot/PeydaWeb-Bold.eot'); src: url('../../fonts/fonts/PeydaWeb/eot/PeydaWeb-Bold.eot?#iefix') format('embedded-opentype'), url('../../fonts/fonts/PeydaWeb/woff2/PeydaWeb-Bold.woff2') format('woff2'), url('../../fonts/fonts/PeydaWeb/woff/PeydaWeb-Bold.woff') format('woff'); font-style: normal; font-weight: 700; font-display: swap; }
@font-face { font-family: Peyda; src: url('../../fonts/fonts/PeydaWeb/eot/PeydaWeb-ExtraBold.eot'); src: url('../../fonts/fonts/PeydaWeb/eot/PeydaWeb-ExtraBold.eot?#iefix') format('embedded-opentype'), url('../../fonts/fonts/PeydaWeb/woff2/PeydaWeb-ExtraBold.woff2') format('woff2'), url('../../fonts/fonts/PeydaWeb/woff/PeydaWeb-ExtraBold.woff') format('woff'); font-style: normal; font-weight: 800; font-display: swap; }
@font-face { font-family: Peyda; src: url('../../fonts/fonts/PeydaWeb/eot/PeydaWeb-Black.eot'); src: url('../../fonts/fonts/PeydaWeb/eot/PeydaWeb-Black.eot?#iefix') format('embedded-opentype'), url('../../fonts/fonts/PeydaWeb/woff2/PeydaWeb-Black.woff2') format('woff2'), url('../../fonts/fonts/PeydaWeb/woff/PeydaWeb-Black.woff') format('woff'); font-style: normal; font-weight: 900; font-display: swap; }
*, *::before, *::after { box-sizing: border-box; }
html { font-size: 62.5%; -webkit-font-smoothing: antialiased; }
html, body { width: 100%; min-height: 100%; }
body { min-width: 320px; margin: 0; overflow-x: hidden; color: #fff; background: #1c1c1c; font: 400 1.6rem/1.7 Peyda, Arial, sans-serif; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
section { position: relative; min-width: 320px; }
.container-fluid { width: 100%; margin-inline: auto; padding-inline: 1.5rem; }
.row { display: flex; flex-wrap: wrap; margin-inline: -1.5rem; }
.row > * { flex-shrink: 0; max-width: 100%; padding-inline: 1.5rem; }
.g-0 { --niki-gutter-x: 0; --niki-gutter-y: 0; }
.gx-5 { --niki-gutter-x: 3rem; }
.p-0 { padding: 0 !important; }
.px-4 { padding-inline: 2.4rem !important; }
.fullheight { height: 100%; }
.text-center { text-align: center; }
.overflow-hidden { overflow: hidden; }
.bg-medium { background-color: #1c1c1c; }
.bg-dark { background-color: #1c1c1c; }
.color-layer { position: absolute; inset: 0; width: 100%; height: 100%; }
.color-layer-medium { background: rgb(0 0 0 / 60%); }
.color-layer-dark { background: rgb(0 0 0 / 80%); }
.intro { position: relative; display: flex; align-items: center; justify-content: center; width: 100%; height: 100vh; min-height: 600px; overflow: hidden; margin: 0; background-position: center; background-repeat: no-repeat; background-size: cover; }
.intro__media { position: absolute; inset: 0; width: 100%; height: 100%; }
.media__image { position: absolute; inset: 0; width: 100%; height: 100%; background-position: center; background-repeat: no-repeat; background-size: cover; }
.intro__header { position: fixed; inset: 0 0 auto; z-index: 9999; display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 1.5rem 3rem; background: linear-gradient(135deg, rgb(128 93 182 / 52%), rgb(28 28 28 / 72%)) !important; -webkit-backdrop-filter: blur(20px) saturate(180%); backdrop-filter: blur(20px) saturate(180%); }
.intro__header.scrolled { background: linear-gradient(135deg, rgb(128 93 182 / 52%), rgb(28 28 28 / 72%)) !important; }
.intro__header .logo img, .header-logo { width: auto; max-width: 100%; max-height: 5rem; object-fit: contain; }
.menu-trigger { display: inline-grid; place-items: center; padding: .6rem; border: 0; background: transparent; color: #fff; font-size: 2.4rem; cursor: pointer; }
.mobile-nav { position: fixed; inset: 0; z-index: 10001; display: flex; flex-direction: column; width: 100%; height: 100vh; height: 100dvh; padding: max(2rem, env(safe-area-inset-top)) 2rem max(2rem, env(safe-area-inset-bottom)); overflow-y: auto; background: var(--niki-bg, #1c1c1c); color: var(--niki-text, #f5f5f5); transform: translateX(100%); visibility: hidden; transition: transform .35s ease, visibility .35s ease; }
.mobile-nav.is-open { transform: translateX(0); visibility: visible; }
.mobile-nav__header { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding-bottom: 2rem; border-bottom: 1px solid var(--niki-border, rgb(255 255 255 / 16%)); }
.mobile-nav__brand { display: flex; align-items: center; min-width: 0; }
.mobile-nav__brand .logo-link { display: inline-flex; align-items: center; }
.mobile-nav__brand img, .mobile-nav__brand .custom-logo { display: block; width: auto; max-width: min(18rem, 55vw); max-height: 5.2rem; object-fit: contain; }
.mobile-nav__close { display: grid; width: 4.4rem; height: 4.4rem; place-items: center; border: 1px solid var(--niki-border, rgb(255 255 255 / 20%)); border-radius: 50%; background: transparent; color: inherit; font-size: 2.2rem; cursor: pointer; }
.mobile-menu, .mobile-nav .main-menu { display: grid; gap: .6rem; margin: 2rem 0 0; padding: 0; list-style: none; }
.mobile-menu a, .mobile-nav .main-menu a { display: block; padding: 1.4rem 1rem; border-radius: .8rem; color: inherit; font-size: 1.9rem; text-decoration: none; }
.mobile-menu a:hover, .mobile-menu a:focus-visible, .mobile-nav .main-menu a:hover, .mobile-nav .main-menu a:focus-visible { background: rgb(255 255 255 / 10%); color: var(--niki-accent, #1fb8b3); }
.mobile-nav__theme { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; margin-top: auto; padding: 2rem 1rem 0; border-top: 1px solid var(--niki-border, rgb(255 255 255 / 16%)); font-size: 1.6rem; }
.mobile-nav__theme .theme-mode-toggle { margin: 0; }
body.mobile-menu-open { overflow: hidden; }
@media (min-width: 992px) { .mobile-nav { display: none !important; } }
@media (prefers-reduced-motion: reduce) { .mobile-nav { transition: none; } }
.desktop-nav { position: absolute; left: 50%; transform: translateX(-50%); }
.desktop-nav .main-menu { display: flex; align-items: center; justify-content: center; gap: 2.4rem; margin: 0; padding: 0; list-style: none; }
.desktop-nav .main-menu > li { position: relative; margin: 0; }
.desktop-nav .main-menu a { display: block; padding: .8rem 0; color: #fff; font-size: 1.5rem; font-weight: 700; text-decoration: none; }
.desktop-nav .main-menu a:hover, .desktop-nav .main-menu .current-menu-item > a { color: #fff; }
.desktop-nav .main-menu .sub-menu { position: absolute; top: 100%; right: 0; z-index: 10000; display: none; min-width: 18rem; margin: 0; padding: .8rem 1.2rem; list-style: none; background: #fff; box-shadow: 0 1rem 2rem rgb(0 0 0 / 15%); }
.desktop-nav .main-menu li:hover > .sub-menu, .desktop-nav .main-menu li:focus-within > .sub-menu { display: block; }
.desktop-nav .main-menu .sub-menu a { padding: .6rem 0; white-space: nowrap; }
.intro__headline { position: relative; z-index: 2; width: 100%; padding: 12rem 3rem; }
.headline__title, .intro h1 { margin: 0; color: #fff; font-size: clamp(3.2rem, 6vw, 7rem); line-height: 1.2; }
.headline__subtitle, .headline__description, .intro__headline p { color: #fff; }
.headline__subtitle { font-size: 1.8rem; }
.headline__description { max-width: 61rem; margin-top: 2rem; font-size: 1.6rem; }
.headline__btnholder, .headline__btngroup { display: flex; flex-wrap: wrap; gap: 1.2rem; margin-top: 3rem; }
.button, .btn { display: inline-flex; align-items: center; justify-content: center; min-height: 4.4rem; padding: .8rem 1.8rem; border: 2px solid transparent; border-radius: .4rem; cursor: pointer; }
.button-solid-light, .btn-solid-light { color: #fff; background: #805db6; border-color: #805db6; }
.button-outline-dark { color: #313637; border-color: #313637; }
.button-outline-light, .btn-outline-light { color: #fff; border-color: #fff; }
.intro__scroll { position: absolute; bottom: 2rem; left: 50%; z-index: 3; }
.section-main { position: relative; min-height: 100vh; overflow: hidden; background: #1c1c1c; }
.section-main__intro { position: relative; min-height: 60rem; overflow: hidden; background: #1c1c1c; }
.section-main__aside { position: relative; padding: 3rem 0; color: #fff; background: #1c1c1c; }
.intro__copyright { position: absolute; right: 0; bottom: 3rem; z-index: 2; padding: 0 3rem; color: rgb(255 255 255 / 70%); }
.aside__content { position: relative; width: 100%; padding: 2rem 3rem; }
.aside__title { margin: 0 0 1.6rem; color: inherit; font-size: 2rem; font-weight: 700; }
.archive-service__category-logo .custom-logo { width: auto; max-width: 14rem; max-height: 8rem; }
.archive-service__filter-list { margin: 0; padding: 0; list-style: none; }
.archive-service__filter-list li { margin: .8rem 0; }
.archive-service__filter-list a { color: inherit; }
.section-inner { padding: 4rem 0; }
.section-inner__content { width: 100%; }
.section-inner__blocks { width: 100%; }
.content-block { margin-bottom: 3rem; }
.inner__title { color: #313637; font-size: 3rem; }
.inner__text { font-size: 1.6rem; }
.my-gallery__item { margin-bottom: 3rem; }
.works-image { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.my-gallery__descr { padding: 1.5rem; }
.my-gallery__descr h4 { margin: 0 0 1rem; font-size: 1.8rem; }
.archive-service__post-link { display: inline-block; margin-top: 1rem; color: #805db6; }
.pagination { display: flex; justify-content: center; gap: 1rem; }
.demo { position: relative; padding: 5rem 0; background: #1c1c1c; color: #fff; }
.demo__headline { position: relative; z-index: 1; padding: 2rem 3rem; isolation: isolate; }
.demo__headline > .row { position: relative; z-index: 2; }
.demo__headline > .row > .col-6:first-child { display: flex; align-items: center; justify-content: flex-start; gap: 2rem; }
.demo__headline .category-section-copy { position: relative; z-index: 1; flex: 1 1 auto; }
.demo__headline .category-section-action { display: flex; align-items: center; justify-content: flex-end; height: 100%; }
.demo__headline .category-section-link { display: inline-flex; align-items: center; gap: .8rem; color: #1fb8b3; font-size: 1.7rem; font-weight: 600; text-decoration: none; transition: color .2s ease, gap .2s ease; }
.demo__headline .category-section-link:hover, .demo__headline .category-section-link:focus-visible { gap: 1.2rem; color: #1fb8b3; }
.demo__headline .category-section-link__arrow { font-size: 2.2rem; line-height: 1; }
.demo__headline > .row > .col-6:first-child .category-icon-wrapper { position: relative; z-index: 1; display: flex; flex: 0 0 auto; align-items: center; justify-content: center; height: auto; padding: 0; opacity: 1; pointer-events: none; }
.demo__headline .headline__title { display: inline-block; margin: 0 0 1.5rem; color: #fff; font-size: clamp(2.8rem, 4vw, 5rem); }
.demo__headline .headline__subtitle { margin: 0 0 1.5rem; color: #fff; }
.demo__headline .headline__colors { margin-top: 1.5rem; }
.category-section-icon { width: auto; height: auto; max-width: 12rem; max-height: 12rem; }
.category-section-icon-font { font-size: 4rem; }
.demo__links { padding: 2rem 0; }
.demo .my-gallery__item { position: relative; display: block; height: 34rem; margin: 0 1.2rem 3rem; overflow: hidden; border: 1px solid rgb(255 255 255 / 24%); border-radius: 2rem; background: #25212f; box-shadow: 0 1.2rem 3.2rem rgb(0 0 0 / 24%); }
.demo .works-link { position: absolute; inset: 0; display: block; overflow: hidden; background: linear-gradient(145deg, rgb(255 255 255 / 16%), rgb(28 28 28 / 45%)); }
.demo .works-image { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; }
.demo .works-image--empty { background: linear-gradient(135deg, rgb(128 93 182 / 52%), rgb(28 28 28 / 72%)); }
.demo .my-gallery__descr { position: absolute; inset: auto 0 0; z-index: 2; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 15rem; padding: 1.8rem 1.5rem; overflow: hidden; background: transparent; color: #fff; transform: translateY(0); transition: background-color .4s ease; }
.demo .my-gallery__item:hover .my-gallery__descr, .demo .my-gallery__item:focus-within .my-gallery__descr { background: rgb(0 0 0 / 25%); }
.demo .my-gallery__item:hover .works-image { transform: scale(1.05); }
.demo .my-gallery__descr h4, .demo .my-gallery__descr p { width: 100%; margin: .5rem 0; color: #fff; text-align: center; text-shadow: 0 2px 5px rgb(0 0 0 / 85%); }
.demo .my-gallery__descr h4 { font-size: 1.8rem; font-weight: 700; }
.demo .my-gallery__descr p { font-size: 1.4rem; }
.demo .archive-service__post-link { display: inline-block; margin-top: .8rem; padding: .6rem 1.4rem; border: 1px solid #1fb8b3; border-radius: 2rem; background: #1fb8b3; color: #fff; }
.demo .archive-service__post-link:hover { border-color: #1fb8b3; background: #1fb8b3; color: #fff; }
.links__item { position: relative; margin: 0 0 3rem; overflow: hidden; }
.links__image { position: relative; overflow: hidden; background: #313637; }
.links__image img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; transition: transform .35s ease; }
.links__item:hover .links__image img { transform: scale(1.04); }
.service-overlay { position: absolute; inset: auto 0 0; padding: 2rem; color: #fff; background: linear-gradient(transparent, rgb(0 0 0 / 75%)); }
.service-overlay h4, .service-overlay p { color: #fff; }
.links__caption { padding: 1rem 0; }
.video-indicator { position: absolute; inset: 50% auto auto 50%; color: #fff; transform: translate(-50%, -50%); }
.demo__headline .category-icon-wrapper { transition: opacity .3s ease, transform .3s ease; }
.demo__headline:hover > .row > .col-6:first-child .category-icon-wrapper { transform: scale(1.04); }
.portfolio-tabs-section { padding: 5rem 0; }
.portfolio-tabs-section__heading { padding: 0 3rem 2rem; text-align: center; }
.portfolio-tabs-section__heading .headline__title { margin: 0; color: #fff; font-size: clamp(2.8rem, 4vw, 5rem); }
.portfolio-category-tabs { display: flex; gap: 1rem; max-width: 1200px; margin: 0 auto; padding: 1rem 2rem 2.5rem; overflow-x: auto; scrollbar-width: thin; }
.portfolio-category-tab { display: flex; flex: 1 0 16rem; flex-direction: column; align-items: center; justify-content: center; gap: 1rem; min-height: 13rem; padding: 1.5rem 1rem; border: 1px solid rgb(255 255 255 / 18%); border-radius: 1.4rem; background: rgb(255 255 255 / 5%); color: #fff; cursor: pointer; transition: background .2s ease, border-color .2s ease, transform .2s ease; }
.portfolio-category-tab:hover { transform: translateY(-3px); border-color: #1fb8b3; }
.portfolio-category-tab.is-active { border-color: #1fb8b3; background: rgb(31 184 179 / 14%); box-shadow: 0 0 0 1px #1fb8b3; }
.portfolio-category-tab__icon { display: grid; place-items: center; width: 7.5rem; height: 7.5rem; }
.portfolio-category-tab__icon img { display: block; width: 100%; height: 100%; object-fit: contain; }
.portfolio-category-tab__icon i { font-size: 5rem; }
.portfolio-category-tab__label { color: #fff; font-size: 1.5rem; font-weight: 600; text-align: center; }
.portfolio-category-panels { max-width: 1400px; margin: 0 auto; padding: 0 2rem; }
.portfolio-category-panel[hidden] { display: none !important; }
.portfolio-category-panel__heading { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: 1rem 1rem 2.5rem; }
.portfolio-category-panel__heading .headline__title { margin: 0; color: #fff; font-size: clamp(2.2rem, 3vw, 3.6rem); }
.portfolio-category-panel__heading .headline__subtitle { margin: 0 0 .8rem; color: #1fb8b3; }
.portfolio-category-panel__heading .category-section-link { display: inline-flex; align-items: center; gap: .8rem; color: #1fb8b3; font-size: 1.6rem; text-decoration: none; }
.portfolio-category-panel .my-gallery { justify-content: center; }
.portfolio-category-panel .inner__text { color: #fff; text-align: center; }
.values-section.section { padding-top: 4rem; padding-bottom: 4rem; background-color: #1c1c1c; color: #fff; }
.values-section__heading { margin-bottom: 3rem; text-align: center; }
.values-section__heading .headline__subtitle { margin-bottom: 1rem; color: #fff; font-size: 1.6rem; }
.values-section__heading .headline__title { margin: 0; color: #fff; font-size: clamp(3rem, 4vw, 5rem); }
.values-section__retro-layout > [class*="col-"] { display: flex; flex-direction: column; }
.values-section__entry { position: relative; display: block; min-height: 24rem; margin-bottom: 3rem; overflow: hidden; border-radius: 1rem; background: #30293a; isolation: isolate; }
.values-section__entry.mb-30 { margin-bottom: 3rem; }
.values-section__entry--tall { flex: 1 1 auto; min-height: 51rem; height: 100%; }
.values-section__retro-layout > .col-md-4:nth-child(1), .values-section__retro-layout > .col-md-4:nth-child(3) { gap: 0; }
.values-section__featured { position: absolute; inset: 0; z-index: -2; background: radial-gradient(circle at 25% 20%, rgb(31 184 179 / 65%), transparent 38%), linear-gradient(135deg, #805db6, #26202f 72%); transform: scale(1.03); transition: transform .35s ease; }
.values-section__entry:nth-child(3n + 2) .values-section__featured { background: radial-gradient(circle at 80% 15%, rgb(128 93 182 / 75%), transparent 42%), linear-gradient(145deg, #1fb8b3, #25212f 78%); }
.values-section__entry:before { position: absolute; inset: 0; z-index: -1; content: ''; background: linear-gradient(to bottom, transparent 12%, rgb(0 0 0 / 78%) 100%); }
.values-section__entry:hover .values-section__featured { transform: scale(1.09); }
.values-section__text { position: absolute; right: 0; bottom: 0; left: 0; z-index: 1; padding: 2rem; }
.values-section__number { display: block; margin-bottom: .8rem; color: rgb(255 255 255 / 75%); font-size: 1.4rem; }
.values-section__text h3 { margin: 0; color: #fff; font-size: clamp(1.8rem, 2vw, 2.4rem); line-height: 1.35; }
@media (max-width: 767.98px) {
	.portfolio-tabs-section { padding: 3rem 0; }
	.portfolio-tabs-section__heading { padding-inline: 1.5rem; }
	.portfolio-category-tabs { justify-content: flex-start; padding-inline: 1.5rem; }
	.portfolio-category-tab { flex-basis: 13rem; min-height: 11rem; }
	.portfolio-category-tab__icon { width: 5.5rem; height: 5.5rem; }
	.portfolio-category-tab__icon i { font-size: 3.8rem; }
	.portfolio-category-tab__label { font-size: 1.3rem; }
	.portfolio-category-panels { padding-inline: 1.2rem; }
	.portfolio-category-panel__heading { align-items: flex-start; flex-direction: column; }
	.values-section.section { padding-top: 3rem; padding-bottom: 3rem; }
	.values-section__heading { margin-bottom: 2.5rem; }
	.values-section__entry { min-height: 24rem; margin-bottom: 1.8rem; }
	.values-section__entry--tall { min-height: 32rem; }
	.values-section__text { padding: 1.6rem; }
}
@media (max-width: 767.98px) {
	/* Keep Bootstrap's negative row gutters and gallery card margins inside these sections. */
	#live-preview,
	#our-values {
		width: 100%;
		max-width: 100%;
		min-width: 0;
		overflow-x: clip;
	}
	#live-preview .portfolio-category-tabs {
		width: 100%;
		max-width: 100%;
		box-sizing: border-box;
	}
	#live-preview .portfolio-category-panels,
	#live-preview .portfolio-category-panel,
	#live-preview .portfolio-category-panel .my-gallery,
	#our-values .values-section__retro-layout {
		width: 100%;
		max-width: 100%;
		min-width: 0;
		margin-inline: 0;
		box-sizing: border-box;
	}
	#live-preview .portfolio-category-panel .my-gallery__item {
		min-width: 0;
		margin-inline: 0;
	}
	#our-values .values-section__retro-layout > [class*="col-"] {
		min-width: 0;
	}
}
@media (min-width: 768px) {
	.values-section__retro-layout > .col-md-4:nth-child(2) { min-height: 51rem; }
}
@media (min-width: 576px) { .col-sm-6 { width: 50%; } }
@media (min-width: 576px) { .demo .my-gallery__item { width: calc(50% - 2.4rem); max-width: calc(50% - 2.4rem); } }
@media (min-width: 992px) { .demo .my-gallery__item { width: calc(33.333333% - 2.4rem); max-width: calc(33.333333% - 2.4rem); } }
@media (min-width: 768px) {
	.container-fluid { padding-inline: 2.4rem; }
	.col-md-6 { width: 50%; }
	.intro__header, .intro__headline { padding-inline: 5rem; }
	.section-main__aside { padding: 4rem 0; }
	.demo__headline { padding-inline: 5rem; }
}
@media (max-width: 575.98px) {
	.demo__headline .category-section-icon { max-width: 8rem; max-height: 8rem; }
	.demo__headline .category-section-icon-font { font-size: 3rem; }
}
@media (min-width: 992px) { .col-lg-6 { width: 50%; } }
@media (min-width: 1200px) {
	.col-xl-3 { width: 25%; }
	.col-xl-9 { width: 75%; }
	.section-main { height: 100vh; }
	.section-main__intro { height: 100vh; min-height: 56.8rem; }
	.section-main__aside { position: fixed; inset: 0 0 0 auto; width: 25%; min-height: 56.8rem; }
	.section-main__aside .aside__content { position: relative; top: 50%; transform: translateY(-50%); }
}
@media (max-width: 768px) {
	.demo { padding: 3rem 0; }
}
@media (max-width: 480px) {
	.category-section-icon-font { font-size: 2.4rem; }
	.demo { padding: 2rem 0; }
}