.page-inner {
background: transparent;
}  .page-inner .site-main {
background: #f6f2ed;
color: #171717;
} .page-inner .site-main .container {
max-width: 1260px;
padding-left: 24px;
padding-right: 24px;
} .page-inner .site-main h2 {
font-size: clamp(36px, 3.6vw, 56px);
font-weight: 800;
line-height: 1.05;
letter-spacing: -.04em;
color: #151515;
margin: 0 0 24px;
}
.page-inner .site-main h2 span {
color: #c7a286;
}
.page-inner .site-main h3 {
font-size: clamp(22px, 1.8vw, 28px);
font-weight: 700;
line-height: 1.25;
letter-spacing: -.025em;
color: #1a1a1a;
margin: 0 0 14px;
}
.page-inner .site-main p {
font-size: clamp(15px, 1.1vw, 17px);
line-height: 1.65;
color: #444;
margin: 0 0 16px;
} .page-inner .site-main [class*="__eyebrow"] {
display: flex;
align-items: center;
gap: 22px;
margin: 0 0 18px;
font-size: 12px;
font-weight: 700;
letter-spacing: .28em;
text-transform: uppercase;
color: #9b795f;
}
.page-inner .site-main [class*="__eyebrow"] > span:first-child {
width: 42px;
height: 2px;
background: var(--orange);
flex: none;
} .page-inner .site-main [class*="__lead"] {
font-size: clamp(16px, 1.3vw, 20px);
line-height: 1.55;
color: #5f636a;
max-width: 760px;
margin: 0 0 30px;
} .page-inner .site-main > section {
padding: clamp(70px, 6vw, 110px) 0;
} .page-inner .site-main > section.contacts-section,
.page-inner .site-main > section.project-cta,
.page-inner .site-main > section.portfolio-cta {
padding: clamp(70px, 6vw, 110px) 0;
} .page-inner .site-main > section.inner-hero {
padding: 0;
background: #12100e;
} .page-inner .site-main > section.news-list,
.page-inner .site-main > section.quiz-section,
.page-inner .site-main > section.contact-info,
.page-inner .site-main > section.about-company,
.page-inner .site-main > section.about-why,
.page-inner .site-main > section.about-production,
.page-inner .site-main > section.team-mission,
.page-inner .site-main > section.team-people,
.page-inner .site-main > section.process-section,
.page-inner .site-main > section.project-faq,
.page-inner .site-main > section.portfolio-faq,
.page-inner .site-main > section.straight-faq,
.page-inner .site-main > section.project-related,
.page-inner .site-main > section.project-materials,
.page-inner .site-main > section.project-overview,
.page-inner .site-main > section.article-body,
.page-inner .site-main > section.article-related,
.page-inner .site-main > section.portfolio-why,
.page-inner .site-main > section.portfolio-directions,
.page-inner .site-main > section.category-calculator,
.page-inner .site-main > section.home-news,
.page-inner .site-main > article.article-body {
padding: clamp(70px, 6vw, 110px) 0;
}
@media (max-width: 768px) {
.page-inner .site-main .container {
padding-left: 18px;
padding-right: 18px;
}
}
.page-inner .nav-link.is-active {
color: var(--orange);
}
.page-inner .nav-link.is-active::after {
transform: scaleX(1);
}
.page-inner .mobile-menu__link.is-active {
color: var(--orange);
}
.inner-hero {
position: relative;
min-height: 700px;
overflow: hidden;
isolation: isolate;
background: #12100e;
}
.inner-hero::before {
content: "";
position: absolute;
inset: 0;
z-index: -3;
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
transform: scale(1.001);
} .page-portfolio .inner-hero::before {
background-image: var(--portfolio-hero-bg, none);
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
filter: saturate(.74) brightness(.72) contrast(1.02);
} .page-about .inner-hero::before,
.page-team .inner-hero::before,
.page-contact .inner-hero::before,
.page-quiz .inner-hero::before,
.page-news .inner-hero::before,
.page-article .inner-hero::before,
.page-default .inner-hero::before,
.alkor-about .inner-hero::before,
.alkor-team .inner-hero::before,
.alkor-contact .inner-hero::before,
.alkor-quiz .inner-hero::before,
.alkor-news .inner-hero::before,
.alkor-article .inner-hero::before,
.alkor-default .inner-hero::before {
background-image: var(--hero-bg-desktop, none);
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
filter: saturate(.74) brightness(.72) contrast(1.02);
}
@media (max-width: 760px) {
.page-about .inner-hero::before,
.page-team .inner-hero::before,
.page-contact .inner-hero::before,
.page-quiz .inner-hero::before,
.page-news .inner-hero::before,
.page-article .inner-hero::before,
.page-default .inner-hero::before,
.alkor-about .inner-hero::before,
.alkor-team .inner-hero::before,
.alkor-contact .inner-hero::before,
.alkor-quiz .inner-hero::before,
.alkor-news .inner-hero::before,
.alkor-article .inner-hero::before,
.alkor-default .inner-hero::before {
background-image: var(--hero-bg-mobile, var(--hero-bg-desktop, none));
}
}
.inner-hero__shade {
position: absolute;
inset: 0;
z-index: -2;
pointer-events: none;
background:
linear-gradient(90deg,
rgba(8,10,11,.95) 0%,
rgba(9,10,11,.91) 18%,
rgba(9,10,11,.80) 33%,
rgba(9,10,11,.54) 47%,
rgba(9,10,11,.20) 66%,
rgba(9,10,11,.12) 100%),
linear-gradient(180deg,
rgba(0,0,0,.24) 0%,
rgba(0,0,0,.02) 38%,
rgba(0,0,0,.18) 100%);
}
.inner-hero .site-header {
background: rgba(20,21,21,.94);
backdrop-filter: blur(7px);
-webkit-backdrop-filter: blur(7px);
border-bottom-color: rgba(255,255,255,.07);
}
.inner-hero__content {
position: relative;
z-index: 2;
padding-top: 58px;
}
.inner-breadcrumbs {
display: flex;
align-items: center;
gap: 16px;
margin: 0;
font-size: 16px;
line-height: 1.3;
font-weight: 500;
color: rgba(255,255,255,.58);
}
.inner-breadcrumbs a {
transition: color .2s ease;
}
.inner-breadcrumbs a:hover {
color: #fff;
}
.inner-breadcrumbs > span[aria-hidden="true"] {
color: rgba(255,255,255,.38);
}
.inner-hero__copy {
width: min(760px, 57vw);
margin-top: 67px;
}
.inner-hero__eyebrow {
display: flex;
align-items: center;
gap: 30px;
margin: 0 0 28px;
font-size: 13px;
line-height: 1;
font-weight: 600;
letter-spacing: .43em;
text-transform: uppercase;
color: rgba(255,255,255,.87);
}
.inner-hero__eyebrow > span {
width: 60px;
height: 2px;
flex: 0 0 60px;
background: var(--orange);
}
.inner-hero h1 {
margin: 0;
font-size: clamp(66px, 5vw, 94px);
line-height: .95;
letter-spacing: -.05em;
font-weight: 800;
color: #fff;
}
.inner-hero h1 span {
color: var(--cream);
}
.inner-hero__lead {
margin: 30px 0 0;
max-width: 680px;
font-size: clamp(18px, 1.35vw, 23px);
line-height: 1.55;
font-weight: 400;
color: rgba(255,255,255,.83);
}
@media (max-width: 1180px) {
.inner-hero {
min-height: 660px;
}
.inner-hero__content {
padding-top: 48px;
}
.inner-hero__copy {
width: min(680px, 68vw);
margin-top: 54px;
}
.inner-hero h1 {
font-size: clamp(58px, 7vw, 78px);
}
.page-portfolio .inner-hero::before {
background-position: 60% center;
}
}
@media (max-width: 760px) {
.inner-hero {
min-height: 560px;
}
.page-portfolio .inner-hero::before {
background-image: var(--portfolio-hero-bg, none);
background-position: center center;
}
.inner-hero__shade {
background:
linear-gradient(90deg, rgba(7,8,9,.90) 0%, rgba(7,8,9,.70) 56%, rgba(7,8,9,.38) 100%),
linear-gradient(180deg, rgba(0,0,0,.38) 0%, rgba(0,0,0,.12) 40%, rgba(0,0,0,.56) 100%);
}
.inner-hero__content {
padding-top: 34px;
}
.inner-breadcrumbs {
gap: 12px;
font-size: 13px;
}
.inner-hero__copy {
width: 100%;
margin-top: 48px;
}
.inner-hero__eyebrow {
gap: 16px;
margin-bottom: 22px;
font-size: 10px;
letter-spacing: .34em;
}
.inner-hero__eyebrow > span {
width: 30px;
flex-basis: 30px;
}
.inner-hero h1 {
max-width: 520px;
font-size: clamp(48px, 13vw, 68px);
line-height: .96;
}
.inner-hero__lead {
margin-top: 24px;
max-width: 480px;
font-size: 16px;
line-height: 1.55;
}
.inner-hero__lead br {
display: none;
}
}
@media (max-width: 620px) {
.inner-hero {
min-height: 500px;
}
.inner-hero__content {
padding-top: 28px;
}
.inner-hero__copy {
margin-top: 42px;
}
.inner-hero h1 {
font-size: clamp(44px, 13.5vw, 60px);
}
.inner-hero__lead {
max-width: 330px;
font-size: 15px;
}
}
.portfolio-directions {
background: #f6f2ed;
color: #171717;
padding: clamp(72px, 6vw, 104px) 0 clamp(86px, 7vw, 118px);
}
.portfolio-directions__head {
margin-bottom: clamp(28px, 2.5vw, 38px);
}
.portfolio-directions__eyebrow {
display: flex;
align-items: center;
gap: 26px;
margin: 0 0 20px;
font-size: 13px;
line-height: 1;
font-weight: 600;
letter-spacing: .42em;
text-transform: uppercase;
color: #777;
}
.portfolio-directions__eyebrow > span {
width: 48px;
height: 2px;
flex: 0 0 48px;
background: var(--orange);
}
.portfolio-directions__title {
margin: 0;
font-size: clamp(54px, 4.7vw, 76px);
line-height: .98;
letter-spacing: -.052em;
font-weight: 800;
}
.portfolio-directions__title span {
color: #c4a184;
}
.portfolio-directions__lead {
margin: 18px 0 0;
max-width: 1120px;
font-size: clamp(18px, 1.35vw, 22px);
line-height: 1.4;
color: #777;
}
.portfolio-directions__grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 16px;
}
.portfolio-direction-card {
overflow: hidden;
border: 1px solid #e5ddd4;
border-radius: 10px;
background: #fbf8f4;
box-shadow: 0 8px 24px rgba(28, 24, 20, .025);
transition:
transform .34s ease,
box-shadow .34s ease,
border-color .34s ease;
}
.portfolio-direction-card__media {
position: relative;
width: 100%;
aspect-ratio: 1.98 / 1;
overflow: hidden;
background: #ddd6ce;
}
.portfolio-direction-card__media::after {
content: "";
position: absolute;
inset: 0;
pointer-events: none;
background: linear-gradient(180deg, transparent 58%, rgba(0,0,0,.08) 100%);
opacity: .25;
transition: opacity .34s ease;
}
.portfolio-direction-card__media img {
width: 100%;
height: 100%;
object-fit: cover;
transform: scale(1.001);
transition: transform .55s cubic-bezier(.2,.65,.25,1), filter .4s ease;
}
.portfolio-direction-card__body {
min-height: 84px;
padding: 17px 22px 17px 24px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 18px;
}
.portfolio-direction-card__body > div {
min-width: 0;
}
.portfolio-direction-card h3 {
margin: 0;
font-size: clamp(19px, 1.25vw, 23px);
line-height: 1.12;
letter-spacing: -.03em;
font-weight: 800;
color: #171717;
}
.portfolio-direction-card p {
margin: 8px 0 0;
font-size: 14px;
line-height: 1.35;
color: #777;
}
.portfolio-direction-card__arrow {
width: 48px;
height: 48px;
flex: 0 0 48px;
display: grid;
place-items: center;
border-radius: 50%;
background: #f3dfca;
color: #171717;
font-size: 26px;
line-height: 1;
font-weight: 300;
transition:
transform .32s ease,
background .32s ease,
color .32s ease,
box-shadow .32s ease;
}
@media (hover: hover) and (pointer: fine) {
.portfolio-direction-card:hover {
transform: translateY(-5px);
border-color: #d6c7b9;
box-shadow: 0 18px 42px rgba(32, 25, 19, .10);
}
.portfolio-direction-card:hover .portfolio-direction-card__media img {
transform: scale(1.045);
filter: saturate(1.03) contrast(1.02);
}
.portfolio-direction-card:hover .portfolio-direction-card__media::after {
opacity: .45;
}
.portfolio-direction-card:hover .portfolio-direction-card__arrow {
transform: translateX(3px);
background: var(--orange);
color: #fff;
box-shadow: 0 8px 22px rgba(255,90,10,.22);
}
}
@media (max-width: 1180px) {
.portfolio-directions__grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (max-width: 760px) {
.portfolio-directions {
padding: 58px 0 72px;
}
.portfolio-directions__head {
margin-bottom: 26px;
}
.portfolio-directions__eyebrow {
gap: 16px;
margin-bottom: 18px;
font-size: 10px;
letter-spacing: .36em;
}
.portfolio-directions__eyebrow > span {
width: 30px;
flex-basis: 30px;
}
.portfolio-directions__title {
max-width: 520px;
font-size: clamp(40px, 11vw, 54px);
line-height: 1;
}
.portfolio-directions__lead {
margin-top: 14px;
max-width: 430px;
font-size: 15px;
line-height: 1.45;
}
.portfolio-directions__grid {
grid-template-columns: 1fr;
gap: 14px;
}
.portfolio-direction-card {
border-radius: 10px;
}
.portfolio-direction-card__media {
aspect-ratio: 1.62 / 1;
}
.portfolio-direction-card__body {
min-height: 78px;
padding: 15px 16px 15px 18px;
}
.portfolio-direction-card h3 {
font-size: 20px;
}
.portfolio-direction-card p {
margin-top: 6px;
font-size: 13px;
}
.portfolio-direction-card__arrow {
width: 44px;
height: 44px;
flex-basis: 44px;
font-size: 23px;
}
}
@media (max-width: 420px) {
.portfolio-direction-card__media {
aspect-ratio: 1.48 / 1;
}
.portfolio-direction-card__body {
align-items: flex-start;
}
.portfolio-direction-card__arrow {
margin-top: 1px;
}
}
.portfolio-process {
background: #f6f2ed;
color: #171717;
padding: 0 0 clamp(92px, 7vw, 126px);
}
.portfolio-process__head {
display: grid;
grid-template-columns: minmax(0, 1.25fr) minmax(420px, .95fr);
align-items: end;
gap: 64px;
margin-bottom: 54px;
}
.portfolio-process__eyebrow {
display: flex;
align-items: center;
gap: 26px;
margin: 0 0 20px;
font-size: 13px;
line-height: 1;
font-weight: 600;
letter-spacing: .38em;
text-transform: uppercase;
color: #777;
}
.portfolio-process__eyebrow > span {
width: 48px;
height: 2px;
flex: 0 0 48px;
background: var(--orange);
}
.portfolio-process__title {
margin: 0;
font-size: clamp(54px, 4.7vw, 76px);
line-height: .98;
letter-spacing: -.052em;
font-weight: 800;
}
.portfolio-process__title span {
color: #c4a184;
}
.portfolio-process__intro {
display: flex;
align-items: center;
justify-content: space-between;
gap: 32px;
}
.portfolio-process__intro p {
margin: 0;
max-width: 430px;
font-size: 15px;
line-height: 1.45;
color: #6f7174;
}
.portfolio-process__top-cta {
flex: 0 0 auto;
min-width: 236px;
min-height: 64px;
justify-content: space-between;
padding-inline: 28px;
}
.portfolio-process__track {
display: grid;
grid-template-columns: repeat(5, minmax(0, 1fr));
overflow: visible;
}
.portfolio-process-step {
position: relative;
min-width: 0;
padding: 0 28px 0 28px;
}
.portfolio-process-step:first-child {
padding-left: 4px;
}
.portfolio-process-step:last-child {
padding-right: 0;
}
.portfolio-process-step:not(:last-child)::after {
content: "";
position: absolute;
top: 0;
right: 0;
width: 1px;
height: 100%;
background: #d9d1c8;
}
.portfolio-process-step__top {
min-height: 54px;
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 14px;
}
.portfolio-process-step__number {
font-size: clamp(40px, 3vw, 52px);
line-height: .95;
font-weight: 500;
letter-spacing: -.04em;
color: #c8ac91;
}
.portfolio-process-step__arrow {
padding-top: 6px;
font-size: 24px;
line-height: 1;
color: #555b60;
}
.portfolio-process-step h3 {
margin: 8px 0 0;
min-height: 54px;
font-size: clamp(17px, 1.12vw, 21px);
line-height: 1.18;
letter-spacing: -.025em;
font-weight: 800;
}
.portfolio-process-step > p {
margin: 5px 0 0;
min-height: 74px;
font-size: 14px;
line-height: 1.45;
color: #777;
}
.portfolio-process-step__media {
width: 100%;
margin-top: 18px;
aspect-ratio: 1.12 / 1;
overflow: hidden;
border-radius: 8px;
background: #ddd5cd;
}
.portfolio-process-step__media img {
width: 100%;
height: 100%;
object-fit: cover;
}
.portfolio-process__mobile-meta {
display: none;
}
.portfolio-help {
position: relative;
min-height: 168px;
margin-top: 38px;
overflow: hidden;
border-radius: 10px;
background:
#ded5cc url(//alkor-kyhni.ru/wp-content/themes/alkor-kyhni/assets/css/img/pages/portfolio/06-consultation-banner.jpg) center center / cover no-repeat;
}
.portfolio-help__shade {
position: absolute;
inset: 0;
background:
linear-gradient(90deg,
rgba(246,242,237,.98) 0%,
rgba(246,242,237,.96) 25%,
rgba(246,242,237,.86) 46%,
rgba(246,242,237,.28) 67%,
rgba(246,242,237,.06) 100%);
}
.portfolio-help__content {
position: relative;
z-index: 2;
min-height: 168px;
display: grid;
grid-template-columns: 150px minmax(330px, 1fr) 340px;
align-items: center;
gap: 34px;
padding: 26px 40px;
}
.portfolio-help__icon {
width: 104px;
height: 104px;
display: grid;
place-items: center;
border-right: 1px solid #d8cec4;
color: #bb9877;
}
.portfolio-help__icon svg {
width: 64px;
height: 64px;
fill: none;
stroke: currentColor;
stroke-width: 2.6;
stroke-linecap: round;
stroke-linejoin: round;
}
.portfolio-help__copy h3 {
margin: 0;
font-size: 28px;
line-height: 1.03;
letter-spacing: -.04em;
font-weight: 800;
}
.portfolio-help__copy p {
margin: 12px 0 0;
font-size: 14px;
line-height: 1.45;
color: #707174;
}
.portfolio-help__button {
min-height: 66px;
justify-content: space-between;
padding-inline: 30px;
}
@media (max-width: 1180px) {
.portfolio-process__head {
grid-template-columns: 1fr;
gap: 26px;
}
.portfolio-process__intro {
justify-content: flex-start;
}
.portfolio-process__track {
grid-template-columns: repeat(5, minmax(220px, 1fr));
overflow-x: auto;
scrollbar-width: none;
}
.portfolio-process__track::-webkit-scrollbar {
display: none;
}
.portfolio-process-step {
padding-inline: 24px;
}
.portfolio-help__content {
grid-template-columns: 120px 1fr 300px;
}
}
@media (max-width: 760px) {
.portfolio-process {
padding-bottom: 76px;
overflow: hidden;
}
.portfolio-process__head {
display: block;
margin-bottom: 28px;
}
.portfolio-process__eyebrow {
gap: 16px;
margin-bottom: 18px;
font-size: 10px;
letter-spacing: .34em;
}
.portfolio-process__eyebrow > span {
width: 30px;
flex-basis: 30px;
}
.portfolio-process__title {
font-size: clamp(40px, 11vw, 54px);
line-height: 1;
}
.portfolio-process__intro {
display: block;
margin-top: 18px;
}
.portfolio-process__intro p {
max-width: 360px;
font-size: 15px;
}
.portfolio-process__intro p br {
display: none;
}
.portfolio-process__top-cta {
width: 100%;
margin-top: 22px;
}
.portfolio-process__track {
display: flex;
gap: 14px;
overflow-x: auto;
scroll-snap-type: x mandatory;
scroll-padding-left: 0;
margin-right: calc((100vw - min(calc(100vw - 24px), var(--container))) / -2);
padding-right: 38px;
overscroll-behavior-x: contain;
-webkit-overflow-scrolling: touch;
}
.portfolio-process-step,
.portfolio-process-step:first-child,
.portfolio-process-step:last-child {
flex: 0 0 min(84vw, 340px);
padding: 22px 20px 20px;
scroll-snap-align: start;
border: 1px solid #e1d8cf;
border-radius: 14px;
background: #fbf8f4;
}
.portfolio-process-step::after {
display: none !important;
}
.portfolio-process-step__top {
min-height: auto;
}
.portfolio-process-step__number {
font-size: 42px;
}
.portfolio-process-step__arrow {
display: none;
}
.portfolio-process-step h3 {
min-height: 0;
margin-top: 16px;
font-size: 21px;
}
.portfolio-process-step > p {
min-height: 0;
margin-top: 10px;
font-size: 14px;
}
.portfolio-process-step > p br {
display: none;
}
.portfolio-process-step__media {
margin-top: 20px;
aspect-ratio: 1.34 / 1;
}
.portfolio-process__mobile-meta {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 14px;
color: #858585;
font-size: 12px;
letter-spacing: .04em;
}
.portfolio-process__counter b {
color: var(--orange);
font-size: 15px;
font-weight: 700;
}
.portfolio-help {
min-height: 360px;
margin-top: 30px;
background-position: 67% center;
}
.portfolio-help__shade {
background:
linear-gradient(180deg,
rgba(246,242,237,.99) 0%,
rgba(246,242,237,.97) 49%,
rgba(246,242,237,.78) 70%,
rgba(246,242,237,.18) 100%);
}
.portfolio-help__content {
min-height: 360px;
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: flex-start;
gap: 0;
padding: 28px 22px;
}
.portfolio-help__icon {
width: 58px;
height: 58px;
border-right: 0;
}
.portfolio-help__icon svg {
width: 48px;
height: 48px;
}
.portfolio-help__copy {
margin-top: 14px;
}
.portfolio-help__copy h3 {
font-size: 28px;
}
.portfolio-help__copy p {
max-width: 320px;
font-size: 14px;
}
.portfolio-help__copy p br {
display: none;
}
.portfolio-help__button {
width: 100%;
min-height: 60px;
margin-top: 22px;
}
}
.portfolio-why {
position: relative;
overflow: hidden;
min-height: 790px;
background: #f6f2ed;
color: #171717;
isolation: isolate;
}
.portfolio-why__bg {
position: absolute;
inset: 0;
z-index: -2;
background: #f6f2ed var(--portfolio-why-bg, none) center center / cover no-repeat;
}
.portfolio-why::after {
content: "";
position: absolute;
inset: 0;
z-index: -1;
pointer-events: none;
background:
linear-gradient(90deg,
rgba(246,242,237,.99) 0%,
rgba(246,242,237,.98) 28%,
rgba(246,242,237,.91) 43%,
rgba(246,242,237,.48) 56%,
rgba(246,242,237,.08) 72%,
rgba(246,242,237,0) 100%);
}
.portfolio-why__inner {
position: relative;
min-height: 790px;
padding-top: 70px;
padding-bottom: 70px;
}
.portfolio-why__content {
width: min(760px, 49vw);
}
.portfolio-why__eyebrow {
display: flex;
align-items: center;
gap: 26px;
margin: 0 0 22px;
font-size: 13px;
line-height: 1;
font-weight: 600;
letter-spacing: .38em;
text-transform: uppercase;
color: #666c70;
}
.portfolio-why__eyebrow > span {
width: 48px;
height: 2px;
flex: 0 0 48px;
background: var(--orange);
}
.portfolio-why__title {
margin: 0;
font-size: clamp(52px, 4.7vw, 76px);
line-height: .98;
letter-spacing: -.052em;
font-weight: 800;
}
.portfolio-why__title span {
color: #c4a184;
}
.portfolio-why__lead {
margin: 28px 0 0;
font-size: clamp(18px, 1.35vw, 23px);
line-height: 1.42;
color: #73777b;
}
.portfolio-why__features {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 38px 54px;
margin-top: 52px;
}
.portfolio-why-feature {
display: grid;
grid-template-columns: 82px 1fr;
align-items: center;
gap: 18px;
}
.portfolio-why-feature__icon {
width: 82px;
height: 82px;
display: grid;
place-items: center;
border-radius: 10px;
background: rgba(245,235,225,.84);
color: #bb8e65;
}
.portfolio-why-feature__icon svg {
width: 43px;
height: 43px;
fill: none;
stroke: currentColor;
stroke-width: 2.5;
stroke-linecap: round;
stroke-linejoin: round;
}
.portfolio-why-feature > div:last-child {
min-width: 0;
padding-left: 18px;
border-left: 1px solid #d8cec4;
}
.portfolio-why-feature h3 {
margin: 0;
font-size: 18px;
line-height: 1.18;
letter-spacing: -.025em;
font-weight: 800;
}
.portfolio-why-feature p {
margin: 9px 0 0;
font-size: 14px;
line-height: 1.42;
color: #777b7e;
}
.portfolio-consult {
position: absolute;
right: 0;
bottom: 72px;
width: min(650px, 42vw);
min-height: 220px;
display: grid;
grid-template-columns: 112px 1fr;
gap: 28px;
align-items: center;
padding: 32px 42px;
overflow: hidden;
border: 1px solid rgba(213,199,185,.8);
border-radius: 18px;
background:
linear-gradient(90deg, rgba(249,246,242,.98) 0%, rgba(249,246,242,.95) 72%, rgba(249,246,242,.78) 100%);
box-shadow: 0 18px 48px rgba(56,42,30,.08);
}
.portfolio-consult__icon {
width: 92px;
height: 118px;
display: grid;
place-items: center;
border-right: 1px solid #d8cec4;
color: #b98c65;
}
.portfolio-consult__icon svg {
width: 58px;
height: 58px;
fill: none;
stroke: currentColor;
stroke-width: 2.7;
stroke-linecap: round;
stroke-linejoin: round;
}
.portfolio-consult__copy h3 {
margin: 0;
font-size: 28px;
line-height: 1.08;
letter-spacing: -.035em;
font-weight: 800;
}
.portfolio-consult__copy p {
margin: 12px 0 0;
font-size: 15px;
line-height: 1.4;
color: #74777a;
}
.portfolio-consult__button {
min-width: 276px;
min-height: 62px;
margin-top: 22px;
justify-content: space-between;
padding-inline: 30px;
}
@media (max-width: 1180px) {
.portfolio-why__content {
width: min(700px, 58vw);
}
.portfolio-why__features {
gap: 30px 36px;
}
.portfolio-consult {
width: min(560px, 46vw);
grid-template-columns: 90px 1fr;
padding: 28px 30px;
}
}
@media (max-width: 900px) {
.portfolio-why {
min-height: auto;
}
.portfolio-why__bg {
background-position: 65% center;
}
.portfolio-why::after {
background:
linear-gradient(180deg,
rgba(246,242,237,.99) 0%,
rgba(246,242,237,.98) 48%,
rgba(246,242,237,.84) 67%,
rgba(246,242,237,.25) 100%);
}
.portfolio-why__inner {
min-height: 0;
padding-top: 58px;
padding-bottom: 58px;
}
.portfolio-why__content {
width: 100%;
}
.portfolio-why__features {
max-width: 680px;
}
.portfolio-consult {
position: relative;
right: auto;
bottom: auto;
width: min(620px, 100%);
margin-top: 42px;
}
}
@media (max-width: 760px) {
.portfolio-why {
padding: 0;
}
.portfolio-why__bg {
background-position: 72% center;
}
.portfolio-why__inner {
padding-top: 54px;
padding-bottom: 54px;
}
.portfolio-why__eyebrow {
gap: 16px;
margin-bottom: 18px;
font-size: 10px;
letter-spacing: .34em;
}
.portfolio-why__eyebrow > span {
width: 30px;
flex-basis: 30px;
}
.portfolio-why__title {
font-size: clamp(40px, 11vw, 54px);
line-height: 1;
}
.portfolio-why__title br {
display: none;
}
.portfolio-why__lead {
margin-top: 18px;
max-width: 390px;
font-size: 15px;
line-height: 1.5;
}
.portfolio-why__lead br {
display: none;
}
.portfolio-why__features {
grid-template-columns: 1fr;
gap: 18px;
margin-top: 34px;
}
.portfolio-why-feature {
grid-template-columns: 64px 1fr;
gap: 14px;
}
.portfolio-why-feature__icon {
width: 64px;
height: 64px;
}
.portfolio-why-feature__icon svg {
width: 34px;
height: 34px;
}
.portfolio-why-feature > div:last-child {
padding-left: 14px;
}
.portfolio-why-feature h3 {
font-size: 17px;
}
.portfolio-why-feature p {
margin-top: 6px;
font-size: 13px;
}
.portfolio-why-feature p br {
display: none;
}
.portfolio-consult {
grid-template-columns: 1fr;
gap: 12px;
width: 100%;
min-height: 0;
margin-top: 34px;
padding: 24px 20px;
border-radius: 14px;
}
.portfolio-consult__icon {
width: 56px;
height: 56px;
border-right: 0;
}
.portfolio-consult__icon svg {
width: 46px;
height: 46px;
}
.portfolio-consult__copy h3 {
font-size: 24px;
}
.portfolio-consult__copy p {
font-size: 14px;
}
.portfolio-consult__copy p br {
display: none;
}
.portfolio-consult__button {
width: 100%;
min-width: 0;
margin-top: 18px;
}
}
.portfolio-faq {
background: #f6f2ed;
color: #171717;
padding: clamp(84px, 6vw, 112px) 0 clamp(90px, 7vw, 124px);
}
.portfolio-faq__grid {
display: grid;
grid-template-columns: minmax(0, 1.05fr) minmax(560px, .95fr);
gap: 30px;
align-items: start;
}
.portfolio-faq__eyebrow {
display: flex;
align-items: center;
gap: 26px;
margin: 0 0 20px;
font-size: 13px;
line-height: 1;
font-weight: 600;
letter-spacing: .38em;
text-transform: uppercase;
color: #666c70;
}
.portfolio-faq__eyebrow > span {
width: 48px;
height: 2px;
flex: 0 0 48px;
background: var(--orange);
}
.portfolio-faq__title {
margin: 0;
font-size: clamp(54px, 4.7vw, 76px);
line-height: .98;
letter-spacing: -.052em;
font-weight: 800;
}
.portfolio-faq__title span {
color: #c4a184;
}
.portfolio-faq__lead {
margin: 20px 0 0;
font-size: clamp(18px, 1.3vw, 22px);
line-height: 1.45;
color: #767a7e;
}
.portfolio-faq__image {
margin-top: 38px;
overflow: hidden;
border-radius: 9px 9px 0 0;
aspect-ratio: 1.38 / 1;
background: #ddd4cb;
}
.portfolio-faq__image img {
width: 100%;
height: 100%;
object-fit: cover;
}
.portfolio-faq-help {
min-height: 136px;
display: grid;
grid-template-columns: 88px minmax(0, 1fr) 235px;
align-items: center;
gap: 24px;
padding: 26px 24px;
border-radius: 0 0 9px 9px;
background: #f1e7dc;
}
.portfolio-faq-help__icon {
width: 72px;
height: 72px;
display: grid;
place-items: center;
border-radius: 50%;
background: rgba(255,255,255,.45);
color: #b88960;
}
.portfolio-faq-help__icon svg {
width: 38px;
height: 38px;
fill: none;
stroke: currentColor;
stroke-width: 2.5;
stroke-linecap: round;
stroke-linejoin: round;
}
.portfolio-faq-help__copy h3 {
margin: 0;
font-size: 22px;
line-height: 1.1;
letter-spacing: -.03em;
font-weight: 800;
}
.portfolio-faq-help__copy p {
margin: 8px 0 0;
font-size: 13px;
line-height: 1.42;
color: #767a7e;
}
.portfolio-faq-help__button {
min-height: 56px;
justify-content: space-between;
padding-inline: 22px;
}
.portfolio-faq__accordion {
display: flex;
flex-direction: column;
gap: 14px;
padding-top: 12px;
}
.portfolio-faq-item {
overflow: hidden;
border: 1px solid #ddd5cc;
border-radius: 9px;
background: rgba(255,255,255,.18);
transition: border-color .25s ease, background .25s ease;
}
.portfolio-faq-item.is-open {
background: rgba(255,255,255,.28);
}
.portfolio-faq-item__button {
width: 100%;
min-height: 74px;
display: grid;
grid-template-columns: 44px 1fr 28px;
align-items: center;
gap: 24px;
padding: 16px 24px;
border: 0;
background: transparent;
color: #171717;
text-align: left;
cursor: pointer;
font: inherit;
}
.portfolio-faq-item__number {
width: 40px;
height: 40px;
display: grid;
place-items: center;
border-radius: 9px;
background: #f1e6da;
color: #b27e53;
font-size: 14px;
font-weight: 700;
}
.portfolio-faq-item__question {
font-size: 17px;
line-height: 1.25;
font-weight: 800;
letter-spacing: -.015em;
}
.portfolio-faq-item__toggle {
position: relative;
width: 18px;
height: 18px;
justify-self: end;
}
.portfolio-faq-item__toggle::before,
.portfolio-faq-item__toggle::after {
content: "";
position: absolute;
top: 50%;
left: 50%;
width: 15px;
height: 2px;
background: #171717;
transform: translate(-50%, -50%);
transition: transform .25s ease, opacity .25s ease;
}
.portfolio-faq-item__toggle::after {
transform: translate(-50%, -50%) rotate(90deg);
}
.portfolio-faq-item.is-open .portfolio-faq-item__toggle::after {
opacity: 0;
transform: translate(-50%, -50%) rotate(0);
}
.portfolio-faq-item__answer {
display: grid;
grid-template-rows: 0fr;
opacity: 0;
transition: grid-template-rows .32s ease, opacity .26s ease;
}
.portfolio-faq-item__answer > div {
overflow: hidden;
padding: 0 76px 0 106px;
font-size: 14px;
line-height: 1.5;
color: #74787c;
}
.portfolio-faq-item.is-open .portfolio-faq-item__answer {
grid-template-rows: 1fr;
opacity: 1;
}
.portfolio-faq-item.is-open .portfolio-faq-item__answer > div {
padding-bottom: 24px;
}
@media (hover: hover) and (pointer: fine) {
.portfolio-faq-item:not(.is-open):hover {
border-color: #cdbbaa;
background: rgba(255,255,255,.34);
}
}
@media (max-width: 1180px) {
.portfolio-faq__grid {
grid-template-columns: 1fr;
gap: 44px;
}
.portfolio-faq__left {
max-width: 820px;
}
.portfolio-faq__accordion {
padding-top: 0;
}
}
@media (max-width: 760px) {
.portfolio-faq {
padding: 58px 0 76px;
}
.portfolio-faq__grid {
gap: 30px;
}
.portfolio-faq__eyebrow {
gap: 16px;
margin-bottom: 18px;
font-size: 10px;
letter-spacing: .34em;
}
.portfolio-faq__eyebrow > span {
width: 30px;
flex-basis: 30px;
}
.portfolio-faq__title {
font-size: clamp(40px, 11vw, 54px);
line-height: 1;
}
.portfolio-faq__lead {
margin-top: 16px;
max-width: 390px;
font-size: 15px;
}
.portfolio-faq__lead br {
display: none;
}
.portfolio-faq__image {
margin-top: 28px;
aspect-ratio: 1.3 / 1;
}
.portfolio-faq-help {
grid-template-columns: 56px 1fr;
gap: 14px;
min-height: 0;
padding: 20px 16px;
}
.portfolio-faq-help__icon {
width: 56px;
height: 56px;
}
.portfolio-faq-help__icon svg {
width: 31px;
height: 31px;
}
.portfolio-faq-help__copy h3 {
font-size: 20px;
}
.portfolio-faq-help__copy p {
font-size: 13px;
}
.portfolio-faq-help__copy p br {
display: none;
}
.portfolio-faq-help__button {
grid-column: 1 / -1;
width: 100%;
margin-top: 2px;
}
.portfolio-faq__accordion {
gap: 10px;
}
.portfolio-faq-item__button {
min-height: 68px;
grid-template-columns: 38px 1fr 22px;
gap: 12px;
padding: 14px 14px;
}
.portfolio-faq-item__number {
width: 36px;
height: 36px;
font-size: 13px;
}
.portfolio-faq-item__question {
font-size: 15px;
}
.portfolio-faq-item__answer > div {
padding: 0 46px 0 64px;
font-size: 13px;
}
.portfolio-faq-item.is-open .portfolio-faq-item__answer > div {
padding-bottom: 18px;
}
}
.page-inner .project-faq,
.page-inner .portfolio-faq,
.page-inner .straight-faq {
background: #f6f2ed !important;
color: #171717 !important;
}
.page-inner .project-faq__intro h2,
.page-inner .portfolio-faq__intro h2,
.page-inner .straight-faq__intro h2,
.page-inner .project-faq__intro h2 span,
.page-inner .portfolio-faq__intro h2 span,
.page-inner .straight-faq__intro h2 span {
color: #171717 !important;
}
.page-inner .project-faq__intro h2 span,
.page-inner .portfolio-faq__intro h2 span,
.page-inner .straight-faq__intro h2 span {
color: var(--orange, #ff5a0a) !important;
}
.page-inner .project-faq__lead,
.page-inner .portfolio-faq__lead,
.page-inner .straight-faq__lead {
color: #5a5a5a !important;
}
.portfolio-direction-card__link {
display: block;
color: inherit;
text-decoration: none;
height: 100%;
}
.portfolio-direction-card__link:hover .portfolio-direction-card__arrow {
transform: translateX(4px);
}
.category-project-card__link {
display: block;
color: inherit;
text-decoration: none;
height: 100%;
}
.category-project-card__link:hover .category-project-card__arrow {
transform: translateX(4px);
}
.layout-card__link {
display: block;
color: inherit;
text-decoration: none;
height: 100%;
}
.layout-card__link:hover .layout-card__arrow {
transform: translateX(4px);
}
.project-related-card__link {
display: block;
color: inherit;
text-decoration: none;
height: 100%;
}
.project-related-card__link:hover .project-related-card__arrow {
transform: translateX(4px);
}
.portfolio-direction-card__arrow,
.category-project-card__arrow,
.layout-card__arrow,
.project-related-card__arrow {
transition: transform 0.25s ease;
display: inline-flex;
align-items: center;
justify-content: center;
}
.portfolio-cta {
padding: clamp(56px, 4vw, 84px) 0;
background: #f6f2ed;
}
.portfolio-cta__inner {
display: grid;
grid-template-columns: auto minmax(0, 1fr) auto;
align-items: center;
gap: 30px;
padding: 32px 40px;
background: linear-gradient(135deg, #2a2622 0%, #1a1714 100%);
border-radius: 16px;
color: #fff;
}
.portfolio-cta__icon {
display: flex;
align-items: center;
justify-content: center;
width: 64px;
height: 64px;
border-radius: 50%;
background: rgba(255, 122, 38, 0.15);
color: #ff7a26;
flex-shrink: 0;
}
.portfolio-cta__icon svg {
width: 32px;
height: 32px;
fill: none;
stroke: currentColor;
stroke-width: 2;
stroke-linecap: round;
stroke-linejoin: round;
}
.portfolio-cta__content h2 {
margin: 0 0 6px;
font-size: clamp(22px, 2.5vw, 28px);
font-weight: 700;
line-height: 1.15;
color: #fff;
}
.portfolio-cta__content h2 span {
color: #ff7a26;
}
.portfolio-cta__content p {
margin: 0;
font-size: 15px;
color: rgba(255,255,255,.72);
line-height: 1.4;
}
.portfolio-cta__button {
white-space: nowrap;
min-height: 56px;
padding: 0 28px;
background: #ff5a0a;
color: #fff;
border-radius: 8px;
font-size: 15px;
font-weight: 600;
display: inline-flex;
align-items: center;
gap: 12px;
text-decoration: none;
transition: background 0.2s ease, transform 0.15s ease;
}
.portfolio-cta__button:hover {
background: #ff7a26;
transform: translateY(-1px);
}
@media (max-width: 768px) {
.portfolio-cta__inner {
grid-template-columns: 1fr;
text-align: center;
gap: 20px;
padding: 28px 24px;
}
.portfolio-cta__icon {
margin: 0 auto;
}
.portfolio-cta__button {
width: 100%;
justify-content: center;
}
} .contact-info {
background: #f6f2ed;
color: #171717;
padding: clamp(78px, 6vw, 108px) 0 clamp(86px, 7vw, 118px);
}
.contact-info__head {
max-width: 900px;
}
.contact-info__eyebrow {
display: flex;
align-items: center;
gap: 26px;
margin: 0 0 18px;
font-size: 13px;
line-height: 1;
font-weight: 600;
letter-spacing: .36em;
text-transform: uppercase;
color: #676c70;
}
.contact-info__eyebrow > span {
width: 48px;
height: 2px;
flex: 0 0 48px;
background: var(--orange);
}
.contact-info__title {
margin: 0;
font-size: clamp(50px, 4.3vw, 72px);
line-height: .98;
letter-spacing: -.05em;
font-weight: 800;
}
.contact-info__title span {
color: #c4a184;
}
.contact-info__lead {
max-width: 820px;
margin: 20px 0 0;
font-size: clamp(17px, 1.2vw, 21px);
line-height: 1.5;
color: #767a7e;
}
.contact-info__cards {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 16px;
margin-top: 40px;
}
.contact-info-card {
min-height: 168px;
padding: 24px 24px 22px;
border: 1px solid #e5ddd4;
border-radius: 12px;
background: rgba(255,255,255,.48);
box-shadow: 0 14px 36px rgba(45,35,27,.055);
}
.contact-info-card__heading {
display: flex;
align-items: center;
gap: 12px;
margin-bottom: 20px;
}
.contact-info-card__icon {
width: 38px;
height: 38px;
flex: 0 0 38px;
display: grid;
place-items: center;
border-radius: 10px;
background: #f1e6da;
color: #b27e53;
}
.contact-info-card__icon svg {
width: 20px;
height: 20px;
fill: none;
stroke: currentColor;
stroke-width: 1.9;
stroke-linecap: round;
stroke-linejoin: round;
}
.contact-info-card h3 {
margin: 0;
font-size: 16px;
line-height: 1.2;
font-weight: 800;
letter-spacing: -.015em;
}
.contact-info-card > a,
.contact-info-card__strong {
display: block;
margin: 0;
font-size: 16px;
line-height: 1.45;
font-weight: 700;
color: #242424;
}
.contact-info-card > a {
transition: color .2s ease;
}
.contact-info-card > a:hover {
color: var(--orange);
}
.contact-info-card > p:not(.contact-info-card__strong) {
margin: 7px 0 0;
font-size: 14px;
line-height: 1.45;
color: #777b7f;
}
.contact-info__media {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 24px;
margin-top: 28px;
}
.contact-info__map,
.contact-info__photo {
overflow: hidden;
aspect-ratio: 16 / 9;
border-radius: 12px;
background: #ddd5cc;
}
.contact-info__map iframe {
display: block;
width: 100%;
height: 100%;
border: 0;
}
.contact-info__photo img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
@media (max-width: 1180px) {
.contact-info__cards {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.contact-info__media {
gap: 18px;
}
}
@media (max-width: 760px) {
.contact-info {
padding: 58px 0 72px;
}
.contact-info__eyebrow {
gap: 16px;
margin-bottom: 16px;
font-size: 10px;
letter-spacing: .32em;
}
.contact-info__eyebrow > span {
width: 30px;
flex-basis: 30px;
}
.contact-info__title {
font-size: clamp(39px, 11vw, 52px);
}
.contact-info__lead {
margin-top: 16px;
font-size: 15px;
}
.contact-info__cards {
gap: 12px;
margin-top: 28px;
}
.contact-info-card {
min-height: 150px;
padding: 20px 18px;
}
.contact-info-card__heading {
margin-bottom: 16px;
}
.contact-info-card h3,
.contact-info-card > a,
.contact-info-card__strong {
font-size: 15px;
}
.contact-info-card > p:not(.contact-info-card__strong) {
font-size: 13px;
}
.contact-info__media {
grid-template-columns: 1fr;
gap: 14px;
margin-top: 18px;
}
.contact-info__map,
.contact-info__photo {
border-radius: 10px;
}
}
@media (max-width: 520px) {
.contact-info__cards {
grid-template-columns: 1fr;
}
.contact-info-card {
min-height: 0;
}
.contact-info__map {
aspect-ratio: 1.45 / 1;
}
.contact-info__photo {
aspect-ratio: 1.3 / 1;
}
} .contact-showroom {
background: #111;
color: #fff;
padding: clamp(84px, 6.5vw, 118px) 0 clamp(90px, 7vw, 126px);
}
.contact-showroom__head {
display: flex;
align-items: end;
justify-content: space-between;
gap: 32px;
margin-bottom: 34px;
}
.contact-showroom__eyebrow {
display: flex;
align-items: center;
gap: 26px;
margin: 0 0 18px;
font-size: 13px;
line-height: 1;
font-weight: 600;
letter-spacing: .36em;
text-transform: uppercase;
color: rgba(255,255,255,.64);
}
.contact-showroom__eyebrow > span {
width: 48px;
height: 2px;
flex: 0 0 48px;
background: var(--orange);
}
.contact-showroom__title {
margin: 0;
font-size: clamp(48px, 4.2vw, 70px);
line-height: .98;
letter-spacing: -.05em;
font-weight: 800;
}
.contact-showroom__title span {
color: #c4a184;
}
.contact-showroom__status {
display: inline-flex;
align-items: center;
gap: 10px;
max-width: 360px;
padding: 14px 18px;
border: 1px solid rgba(231,195,158,.34);
border-radius: 999px;
background: rgba(231,195,158,.08);
color: #e7c39e;
font-size: 14px;
line-height: 1.35;
font-weight: 700;
}
.contact-showroom__status-dot {
width: 9px;
height: 9px;
flex: 0 0 9px;
border-radius: 50%;
background: #c99c73;
box-shadow: 0 0 0 5px rgba(201,156,115,.12);
}
.contact-showroom__grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 24px;
}
.contact-showroom__map,
.contact-showroom__photo {
position: relative;
overflow: hidden;
aspect-ratio: 16 / 9;
border-radius: 12px;
background: #1d1b1a;
}
.contact-showroom__map iframe {
display: block;
width: 100%;
height: 100%;
border: 0;
}
.contact-showroom__photo img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.contact-showroom__photo-badge {
position: absolute;
left: 20px;
bottom: 20px;
padding: 11px 15px;
border-radius: 999px;
background: rgba(17,17,17,.82);
border: 1px solid rgba(255,255,255,.18);
backdrop-filter: blur(8px);
-webkit-backdrop-filter: blur(8px);
color: #fff;
font-size: 13px;
line-height: 1;
font-weight: 700;
}
.contact-showroom__details {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 16px;
margin-top: 20px;
}
.contact-showroom-detail {
min-height: 96px;
display: grid;
grid-template-columns: 46px 1fr;
align-items: center;
gap: 14px;
padding: 18px 20px;
border: 1px solid rgba(255,255,255,.10);
border-radius: 10px;
background: rgba(255,255,255,.035);
}
.contact-showroom-detail__icon {
width: 42px;
height: 42px;
display: grid;
place-items: center;
border-radius: 10px;
background: rgba(231,195,158,.10);
color: #d7ad87;
}
.contact-showroom-detail__icon svg {
width: 21px;
height: 21px;
fill: none;
stroke: currentColor;
stroke-width: 1.9;
stroke-linecap: round;
stroke-linejoin: round;
}
.contact-showroom-detail span {
display: block;
margin-bottom: 4px;
color: rgba(255,255,255,.56);
font-size: 12px;
line-height: 1.2;
}
.contact-showroom-detail strong {
color: #fff;
font-size: 15px;
line-height: 1.35;
font-weight: 700;
}
@media (max-width: 980px) {
.contact-showroom__head {
align-items: flex-start;
flex-direction: column;
}
.contact-showroom__details {
grid-template-columns: 1fr;
}
}
@media (max-width: 760px) {
.contact-showroom {
padding: 58px 0 74px;
}
.contact-showroom__head {
gap: 22px;
margin-bottom: 26px;
}
.contact-showroom__eyebrow {
gap: 16px;
margin-bottom: 16px;
font-size: 10px;
letter-spacing: .32em;
}
.contact-showroom__eyebrow > span {
width: 30px;
flex-basis: 30px;
}
.contact-showroom__title {
font-size: clamp(38px, 10.5vw, 50px);
}
.contact-showroom__status {
max-width: 100%;
padding: 12px 15px;
font-size: 13px;
}
.contact-showroom__grid {
grid-template-columns: 1fr;
gap: 14px;
}
.contact-showroom__map,
.contact-showroom__photo {
border-radius: 10px;
}
.contact-showroom__map {
aspect-ratio: 1.45 / 1;
}
.contact-showroom__photo {
aspect-ratio: 1.3 / 1;
}
.contact-showroom__photo-badge {
left: 14px;
bottom: 14px;
font-size: 12px;
}
.contact-showroom__details {
gap: 10px;
margin-top: 14px;
}
.contact-showroom-detail {
min-height: 82px;
padding: 15px 16px;
}
} .contact-info--second {
border-top: 1px solid #e5ddd4;
}
.contact-info-card--status .contact-info-card__icon {
background: #f1e6da;
color: #b27e53;
}
.contact-info-card--status .contact-info-card__strong {
color: #242424;
max-width: 250px;
}
@media (max-width: 760px) {
.contact-info--second {
border-top-color: #e5ddd4;
}
} .contact-info__photo--status {
position: relative;
}
.contact-photo-sticker {
position: absolute;
left: 20px;
bottom: 20px;
z-index: 2;
max-width: 320px;
padding: 12px 16px;
border: 1px solid rgba(255,255,255,.14);
border-radius: 999px;
background: rgba(23,23,23,.82);
-webkit-backdrop-filter: blur(8px);
backdrop-filter: blur(8px);
box-shadow: 0 10px 30px rgba(0,0,0,.18);
color: #fff;
font-size: 13px;
line-height: 1.3;
font-weight: 700;
}
@media (max-width: 760px) {
.contact-photo-sticker {
left: 14px;
right: 14px;
bottom: 14px;
max-width: none;
padding: 11px 14px;
border-radius: 14px;
font-size: 12px;
}
} .news-list {
background: #f6f2ed;
color: #171717;
padding: clamp(82px, 6.5vw, 116px) 0 clamp(90px, 7vw, 124px);
}
.news-list__head {
max-width: 920px;
margin-bottom: 42px;
}
.news-list__eyebrow {
display: flex;
align-items: center;
gap: 26px;
margin: 0 0 18px;
font-size: 13px;
line-height: 1;
font-weight: 600;
letter-spacing: .36em;
text-transform: uppercase;
color: #676c70;
}
.news-list__eyebrow > span {
width: 48px;
height: 2px;
flex: 0 0 48px;
background: var(--orange);
}
.news-list__title {
margin: 0;
font-size: clamp(50px, 4.35vw, 72px);
line-height: .98;
letter-spacing: -.052em;
font-weight: 800;
}
.news-list__title span {
color: #c4a184;
}
.news-list__lead {
max-width: 720px;
margin: 20px 0 0;
font-size: clamp(17px, 1.2vw, 21px);
line-height: 1.5;
color: #767a7e;
}
.news-list__track {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 26px 22px;
}
.news-card {
display: flex;
flex-direction: column;
min-width: 0;
overflow: hidden;
border: 1px solid #e4dbd2;
border-radius: 12px;
background: rgba(255,255,255,.46);
box-shadow: 0 16px 38px rgba(45,35,27,.045);
transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.news-card__media {
display: block;
overflow: hidden;
aspect-ratio: 3 / 2;
background: #ddd4cb;
}
.news-card__media img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform .5s cubic-bezier(.2,.7,.2,1);
}
.news-card__body {
display: flex;
flex: 1;
flex-direction: column;
padding: 24px 24px 25px;
}
.news-card h3 {
margin: 0;
font-size: clamp(21px, 1.5vw, 27px);
line-height: 1.16;
letter-spacing: -.035em;
font-weight: 800;
}
.news-card h3 a {
transition: color .22s ease;
}
.news-card p {
margin: 15px 0 24px;
font-size: 14px;
line-height: 1.58;
color: #72777b;
}
.news-card__link {
display: inline-flex;
align-items: center;
gap: 10px;
width: fit-content;
margin-top: auto;
color: #b27e53;
font-size: 14px;
line-height: 1.2;
font-weight: 700;
}
.news-card__link span {
transition: transform .25s ease;
}
@media (hover: hover) and (pointer: fine) {
.news-card:hover {
transform: translateY(-7px);
border-color: #d3c0ad;
box-shadow: 0 24px 50px rgba(45,35,27,.10);
}
.news-card:hover .news-card__media img {
transform: scale(1.045);
}
.news-card:hover h3 a {
color: #b27e53;
}
.news-card:hover .news-card__link span {
transform: translateX(5px);
}
}
.news-list__mobile-meta {
display: none;
}
.news-pagination {
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
margin-top: 50px;
}
.news-pagination__page,
.news-pagination__arrow {
width: 46px;
height: 46px;
display: grid;
place-items: center;
border: 1px solid #ddd3c9;
border-radius: 10px;
background: rgba(255,255,255,.38);
color: #3c3c3c;
font-size: 14px;
font-weight: 700;
}
.news-pagination__page.is-active {
border-color: #c9a789;
background: #e9ddd1;
color: #6d4d35;
}
.news-pagination__arrow {
font-size: 19px;
}
.news-pagination__arrow.is-disabled {
opacity: .35;
}
@media (max-width: 1100px) {
.news-list__track {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (max-width: 760px) {
.news-list {
padding: 58px 0 76px;
overflow: hidden;
}
.news-list__head {
margin-bottom: 28px;
}
.news-list__eyebrow {
gap: 16px;
margin-bottom: 16px;
font-size: 10px;
letter-spacing: .32em;
}
.news-list__eyebrow > span {
width: 30px;
flex-basis: 30px;
}
.news-list__title {
font-size: clamp(39px, 10.8vw, 52px);
}
.news-list__lead {
margin-top: 16px;
font-size: 15px;
}
.news-list__track {
display: grid;
grid-auto-flow: column;
grid-auto-columns: 88%;
grid-template-columns: none;
gap: 14px;
overflow-x: auto;
padding: 2px 0 12px;
scroll-snap-type: x mandatory;
scroll-padding-left: 0;
overscroll-behavior-x: contain;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
}
.news-list__track::-webkit-scrollbar {
display: none;
}
.news-card {
scroll-snap-align: start;
min-height: 100%;
}
.news-card__body {
padding: 20px 18px 21px;
}
.news-card h3 {
font-size: 21px;
}
.news-card p {
margin: 13px 0 20px;
font-size: 13px;
}
.news-list__mobile-meta {
display: flex;
align-items: center;
justify-content: space-between;
gap: 14px;
margin-top: 8px;
color: #777b7f;
font-size: 12px;
}
.news-list__counter b {
color: #b27e53;
font-size: 15px;
}
.news-pagination {
gap: 8px;
margin-top: 32px;
}
.news-pagination__page,
.news-pagination__arrow {
width: 42px;
height: 42px;
border-radius: 9px;
}
}
@media (max-width: 420px) {
.news-list__track {
grid-auto-columns: 91%;
}
} .about-company {
background: #f6f2ed;
color: #171717;
padding: clamp(86px, 6.7vw, 118px) 0 clamp(92px, 7vw, 126px);
}
.about-company__grid {
display: grid;
grid-template-columns: minmax(0, .92fr) minmax(520px, 1.08fr);
gap: clamp(42px, 5vw, 78px);
align-items: center;
}
.about-company__eyebrow {
display: flex;
align-items: center;
gap: 26px;
margin: 0 0 20px;
font-size: 13px;
line-height: 1;
font-weight: 600;
letter-spacing: .36em;
text-transform: uppercase;
color: #676c70;
}
.about-company__eyebrow > span {
width: 48px;
height: 2px;
flex: 0 0 48px;
background: var(--orange);
}
.about-company__title {
margin: 0;
max-width: 690px;
font-size: clamp(50px, 4.25vw, 72px);
line-height: .98;
letter-spacing: -.052em;
font-weight: 800;
}
.about-company__title span {
color: #c4a184;
}
.about-company__text {
max-width: 700px;
margin-top: 28px;
}
.about-company__text p {
margin: 0;
font-size: clamp(16px, 1.08vw, 19px);
line-height: 1.62;
color: #666b70;
}
.about-company__text p + p {
margin-top: 16px;
}
.about-company__media {
overflow: hidden;
min-height: 560px;
border-radius: 12px;
background: #ddd4cb;
}
.about-company__media img {
width: 100%;
height: 100%;
min-height: 560px;
object-fit: cover;
object-position: center;
}
.about-stats {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
margin-top: 54px;
border-top: 1px solid #ddd3c9;
border-bottom: 1px solid #ddd3c9;
}
.about-stat {
min-height: 162px;
padding: 28px 30px;
border-right: 1px solid #ddd3c9;
}
.about-stat:last-child {
border-right: 0;
}
.about-stat__value {
display: flex;
align-items: flex-start;
gap: 3px;
color: #b88960;
font-size: clamp(46px, 4vw, 68px);
line-height: .95;
letter-spacing: -.055em;
font-weight: 800;
}
.about-stat__value sup {
margin-top: 2px;
font-size: .48em;
line-height: 1;
}
.about-stat p {
margin: 14px 0 0;
font-size: 14px;
line-height: 1.35;
color: #6d7175;
}
@media (max-width: 1180px) {
.about-company__grid {
grid-template-columns: 1fr;
}
.about-company__content {
max-width: 820px;
}
.about-company__media,
.about-company__media img {
min-height: 480px;
}
.about-stats {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.about-stat:nth-child(2) {
border-right: 0;
}
.about-stat:nth-child(-n+2) {
border-bottom: 1px solid #ddd3c9;
}
}
@media (max-width: 760px) {
.about-company {
padding: 58px 0 76px;
}
.about-company__grid {
gap: 30px;
}
.about-company__eyebrow {
gap: 16px;
margin-bottom: 16px;
font-size: 10px;
letter-spacing: .32em;
}
.about-company__eyebrow > span {
width: 30px;
flex-basis: 30px;
}
.about-company__title {
font-size: clamp(39px, 10.8vw, 52px);
}
.about-company__text {
margin-top: 20px;
}
.about-company__text p {
font-size: 15px;
line-height: 1.55;
}
.about-company__media,
.about-company__media img {
min-height: 0;
}
.about-company__media {
aspect-ratio: 1.22 / 1;
border-radius: 10px;
}
.about-company__media img {
height: 100%;
}
.about-stats {
margin-top: 34px;
}
.about-stat {
min-height: 132px;
padding: 22px 18px;
}
.about-stat__value {
font-size: clamp(40px, 12vw, 54px);
}
.about-stat p {
margin-top: 10px;
font-size: 12px;
}
}
@media (max-width: 420px) {
.about-stat {
padding-inline: 14px;
}
} .about-why {
background: #f6f2ed;
color: #171717;
padding: 0 0 clamp(92px, 7vw, 126px);
}
.about-why__head {
max-width: 860px;
margin-bottom: 42px;
}
.about-why__eyebrow {
display: flex;
align-items: center;
gap: 26px;
margin: 0 0 18px;
font-size: 13px;
line-height: 1;
font-weight: 600;
letter-spacing: .36em;
text-transform: uppercase;
color: #676c70;
}
.about-why__eyebrow > span {
width: 48px;
height: 2px;
flex: 0 0 48px;
background: var(--orange);
}
.about-why__title {
margin: 0;
font-size: clamp(50px, 4.25vw, 72px);
line-height: .98;
letter-spacing: -.052em;
font-weight: 800;
}
.about-why__title span {
color: #c4a184;
}
.about-why__lead {
max-width: 760px;
margin: 20px 0 0;
font-size: clamp(17px, 1.18vw, 20px);
line-height: 1.5;
color: #767a7e;
}
.about-why__track {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 16px;
}
.about-why-card {
min-height: 320px;
display: flex;
flex-direction: column;
padding: 26px 24px 28px;
border: 1px solid #e1d8cf;
border-radius: 12px;
background: rgba(255,255,255,.42);
transition: transform .28s ease, border-color .28s ease, box-shadow .28s ease, background .28s ease;
}
.about-why-card__top {
display: flex;
align-items: center;
justify-content: space-between;
gap: 20px;
}
.about-why-card__number {
color: #b88960;
font-size: 14px;
line-height: 1;
font-weight: 800;
letter-spacing: .08em;
}
.about-why-card__icon {
width: 66px;
height: 66px;
display: grid;
place-items: center;
border-radius: 50%;
background: #efe4d8;
color: #b88960;
}
.about-why-card__icon svg {
width: 34px;
height: 34px;
fill: none;
stroke: currentColor;
stroke-width: 2.1;
stroke-linecap: round;
stroke-linejoin: round;
}
.about-why-card h3 {
margin: auto 0 0;
padding-top: 54px;
font-size: 23px;
line-height: 1.12;
letter-spacing: -.03em;
font-weight: 800;
}
.about-why-card p {
margin: 14px 0 0;
font-size: 14px;
line-height: 1.55;
color: #6f7478;
}
.about-why__mobile-meta {
display: none;
}
@media (hover: hover) and (pointer: fine) {
.about-why-card:hover {
transform: translateY(-6px);
border-color: #cfbca9;
background: rgba(255,255,255,.58);
box-shadow: 0 22px 42px rgba(45,35,27,.09);
}
.about-why-card:hover .about-why-card__icon {
transform: scale(1.04);
}
.about-why-card__icon {
transition: transform .28s ease;
}
}
@media (max-width: 1180px) {
.about-why__track {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.about-why-card {
min-height: 280px;
}
}
@media (max-width: 760px) {
.about-why {
padding-bottom: 76px;
overflow: hidden;
}
.about-why__head {
margin-bottom: 28px;
}
.about-why__eyebrow {
gap: 16px;
margin-bottom: 16px;
font-size: 10px;
letter-spacing: .32em;
}
.about-why__eyebrow > span {
width: 30px;
flex-basis: 30px;
}
.about-why__title {
font-size: clamp(39px, 10.8vw, 52px);
}
.about-why__lead {
margin-top: 16px;
font-size: 15px;
}
.about-why__track {
display: grid;
grid-auto-flow: column;
grid-auto-columns: 88%;
grid-template-columns: none;
gap: 14px;
overflow-x: auto;
padding: 2px 0 12px;
scroll-snap-type: x mandatory;
scroll-padding-left: 0;
overscroll-behavior-x: contain;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
}
.about-why__track::-webkit-scrollbar {
display: none;
}
.about-why-card {
min-height: 300px;
scroll-snap-align: start;
padding: 22px 20px 24px;
}
.about-why-card__icon {
width: 58px;
height: 58px;
}
.about-why-card__icon svg {
width: 30px;
height: 30px;
}
.about-why-card h3 {
padding-top: 44px;
font-size: 21px;
}
.about-why-card p {
font-size: 13px;
}
.about-why__mobile-meta {
display: flex;
align-items: center;
justify-content: space-between;
gap: 14px;
margin-top: 8px;
color: #777b7f;
font-size: 12px;
}
.about-why__counter b {
color: #b27e53;
font-size: 15px;
}
}
@media (max-width: 420px) {
.about-why__track {
grid-auto-columns: 91%;
}
} .about-production {
background: #f2ece5;
color: #171717;
padding: clamp(88px, 6.8vw, 120px) 0 clamp(92px, 7vw, 126px);
}
.about-production__grid {
display: grid;
grid-template-columns: minmax(0, 1.02fr) minmax(520px, .98fr);
gap: clamp(42px, 5vw, 76px);
align-items: center;
}
.about-production__media {
overflow: hidden;
min-height: 600px;
border-radius: 12px;
background: #d9d0c7;
}
.about-production__media img {
width: 100%;
height: 100%;
min-height: 600px;
object-fit: cover;
object-position: center;
}
.about-production__eyebrow {
display: flex;
align-items: center;
gap: 26px;
margin: 0 0 18px;
font-size: 13px;
line-height: 1;
font-weight: 600;
letter-spacing: .36em;
text-transform: uppercase;
color: #676c70;
}
.about-production__eyebrow > span {
width: 48px;
height: 2px;
flex: 0 0 48px;
background: var(--orange);
}
.about-production__title {
margin: 0;
max-width: 690px;
font-size: clamp(48px, 4.1vw, 70px);
line-height: .98;
letter-spacing: -.052em;
font-weight: 800;
}
.about-production__title span {
color: #c4a184;
}
.about-production__text {
margin-top: 26px;
}
.about-production__text p {
margin: 0;
font-size: clamp(16px, 1.08vw, 19px);
line-height: 1.6;
color: #666b70;
}
.about-production__text p + p {
margin-top: 16px;
}
.about-production__features {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 16px 18px;
margin-top: 34px;
}
.about-production-feature {
display: grid;
grid-template-columns: 58px minmax(0, 1fr);
gap: 14px;
align-items: start;
padding: 20px 18px;
border: 1px solid #ddd3c9;
border-radius: 10px;
background: rgba(255,255,255,.38);
}
.about-production-feature__icon {
width: 54px;
height: 54px;
display: grid;
place-items: center;
border-radius: 50%;
background: #eadfd4;
color: #b88960;
}
.about-production-feature__icon svg {
width: 29px;
height: 29px;
fill: none;
stroke: currentColor;
stroke-width: 2;
stroke-linecap: round;
stroke-linejoin: round;
}
.about-production-feature h3 {
margin: 1px 0 0;
font-size: 17px;
line-height: 1.18;
letter-spacing: -.02em;
font-weight: 800;
}
.about-production-feature p {
margin: 7px 0 0;
font-size: 13px;
line-height: 1.48;
color: #72777b;
}
@media (max-width: 1180px) {
.about-production__grid {
grid-template-columns: 1fr;
}
.about-production__media,
.about-production__media img {
min-height: 500px;
}
.about-production__content {
max-width: 900px;
}
}
@media (max-width: 760px) {
.about-production {
padding: 58px 0 76px;
}
.about-production__grid {
gap: 30px;
}
.about-production__media {
order: 0;
min-height: 0;
aspect-ratio: 1.22 / 1;
border-radius: 10px;
}
.about-production__media img {
min-height: 0;
height: 100%;
}
.about-production__content {
order: 1;
}
.about-production__eyebrow {
gap: 16px;
margin-bottom: 16px;
font-size: 10px;
letter-spacing: .32em;
}
.about-production__eyebrow > span {
width: 30px;
flex-basis: 30px;
}
.about-production__title {
font-size: clamp(39px, 10.7vw, 52px);
}
.about-production__text {
margin-top: 20px;
}
.about-production__text p {
font-size: 15px;
line-height: 1.55;
}
.about-production__features {
grid-template-columns: 1fr;
gap: 10px;
margin-top: 26px;
}
.about-production-feature {
grid-template-columns: 52px 1fr;
padding: 17px 16px;
}
.about-production-feature__icon {
width: 48px;
height: 48px;
}
.about-production-feature__icon svg {
width: 26px;
height: 26px;
}
.about-production-feature h3 {
font-size: 16px;
}
.about-production-feature p {
font-size: 13px;
}
}  .team-mission{background:#f6f2ed;color:#171717;padding:clamp(76px,7vw,116px) 0}
.team-mission__layout{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(32px,5vw,88px);align-items:start}
.team-mission__eyebrow{font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:#9b795f;margin:0 0 24px}
.team-mission h2{font-size:clamp(38px,3.6vw,62px);line-height:1.09;letter-spacing:-.045em;margin:0 0 30px;font-weight:700}
.team-mission h2 span{color:#967b66}
.team-mission__intro{max-width:720px;font-size:clamp(16px,1.18vw,19px);line-height:1.75;color:#60605e;margin:0 0 18px}
.team-mission__interior,.team-mission__portrait{margin:0;overflow:hidden;border-radius:12px;background:#ddd5cc}
.team-mission__interior{margin-top:36px;aspect-ratio:1.68}
.team-mission__portrait{aspect-ratio:4/4.6}
.team-mission__interior img,.team-mission__portrait img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .6s ease;filter:saturate(.82)}
.team-mission__interior:hover img,.team-mission__portrait:hover img{transform:scale(1.025)}
.team-mission__portrait img{object-position:center 18%}
.team-mission__director-info{padding:28px 4px 0}
.team-mission__statement{font-size:clamp(20px,1.8vw,28px);line-height:1.4;letter-spacing:-.025em;font-weight:600;margin:0 0 24px}
.team-mission__director-name{font-size:17px;font-weight:700;margin:0 0 5px}
.team-mission__director-role{font-size:14px;color:#747474;margin:0}
@media(max-width:900px){.team-mission__layout{grid-template-columns:1fr;gap:44px}.team-mission__portrait{aspect-ratio:4/3.6}.team-mission__director{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:center}.team-mission__director-info{padding:0}.team-mission__interior{aspect-ratio:16/9}}
@media(max-width:620px){.team-mission{padding:64px 0 76px}.team-mission__layout{gap:36px}.team-mission__eyebrow{font-size:11px;margin-bottom:18px}.team-mission h2{font-size:clamp(33px,9vw,43px);margin-bottom:24px}.team-mission__intro{font-size:15px;line-height:1.65}.team-mission__interior{margin-top:28px;aspect-ratio:4/3}.team-mission__director{display:block}.team-mission__portrait{aspect-ratio:4/4.5}.team-mission__director-info{padding:22px 0 0}.team-mission__statement{font-size:21px}} .team-mission__eyebrow{display:flex;align-items:center;gap:26px;color:#747474;letter-spacing:.35em}
.team-mission__eyebrow>span{display:block;width:60px;height:2px;flex:0 0 60px;background:var(--orange)}
@media(max-width:620px){.team-mission__eyebrow{gap:16px;letter-spacing:.25em}.team-mission__eyebrow>span{width:30px;flex-basis:30px}} .team-people{background:#fff;color:#171717;padding:clamp(72px,7vw,112px) 0 clamp(86px,8vw,126px)}
.team-people__heading{max-width:900px;margin-bottom:44px}
.team-people__eyebrow{display:flex;align-items:center;gap:26px;font-size:13px;font-weight:600;letter-spacing:.36em;text-transform:uppercase;color:#676c70;margin:0 0 24px}
.team-people__eyebrow span{width:60px;height:2px;flex:0 0 60px;background:var(--orange)}
.team-people h2{font-size:clamp(42px,4.2vw,70px);font-weight:800;line-height:1.02;letter-spacing:-.05em;margin:0 0 24px}
.team-people h2 span{color:#c4a184}
.team-people__heading>p:last-child{font-size:clamp(16px,1.3vw,20px);line-height:1.65;color:#747474;max-width:790px;margin:0}
.team-people__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:38px 24px}
.team-people__card{min-width:0}
.team-people__photo{aspect-ratio:4/3.8;overflow:hidden;border-radius:12px;background:#e8e2da}
.team-people__photo img{width:100%;height:100%;object-fit:cover;object-position:center center;display:block;filter:saturate(.78);transition:transform .5s ease}
.team-people__card:hover .team-people__photo img{transform:scale(1.035)}
.team-people__details{padding:20px 2px 0;position:relative}
.team-people__number{font-size:11px;color:#b79b86;letter-spacing:.12em}
.team-people__details h3{font-size:clamp(19px,1.6vw,25px);line-height:1.25;letter-spacing:-.025em;margin:8px 0 7px;font-weight:700}
.team-people__details p{font-size:15px;color:#777;margin:0}
.team-people__swipe{display:none}
@media(max-width:1024px){.team-people__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.team-people{padding:64px 0 80px}.team-people__heading{margin-bottom:28px}.team-people__eyebrow{font-size:11px;gap:16px;letter-spacing:.26em}.team-people__eyebrow span{width:30px;flex-basis:30px}.team-people h2{font-size:clamp(34px,9vw,48px)}.team-people__heading>p:last-child{font-size:15px}.team-people__grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:12px;gap:14px;margin-inline:-12px;padding:0 12px 12px;scrollbar-width:none}.team-people__grid::-webkit-scrollbar{display:none}.team-people__card{flex:0 0 min(84vw,350px);scroll-snap-align:start}.team-people__photo{aspect-ratio:4/4.2}.team-people__details{padding-top:14px}.team-people__details h3{font-size:21px}.team-people__swipe{display:block;margin:14px 0 0;text-align:right;font-size:13px;color:#777}} .team-people__card{border:1px solid #e8e2db;border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 2px 12px rgba(24,21,18,.035);transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease}
.team-people__card:hover{transform:translateY(-7px);border-color:#d2b9a4;box-shadow:0 18px 38px rgba(24,21,18,.11)}
.team-people__photo{border-radius:0}
.team-people__details{padding:20px 22px 25px}
.team-people__details h3{margin-top:0}
@media(max-width:620px){.team-people__details{padding:17px 18px 22px}.team-people__card:hover{transform:translateY(-3px)}}
@media(prefers-reduced-motion:reduce){.team-people__card,.team-people__photo img{transition:none}}  .page-quiz .quiz-section{background:#f6f2ed;color:#171717;padding:90px 0 110px}
.page-quiz .quiz-container{max-width:1260px}
.quiz-intro{text-align:center;margin:0 auto 38px;max-width:820px}
.quiz-intro .quiz-kicker{color:#8a6e56;letter-spacing:.2em;font-size:12px;font-weight:700;margin:0 0 15px}
.quiz-intro h2{font-size:clamp(32px,3.5vw,52px);line-height:1.12;letter-spacing:-.04em;margin:0 0 15px}
.quiz-intro>p:last-child{color:#777;font-size:17px;line-height:1.6;margin:0}
.quiz-shell{background:#fffdfa;border:1px solid #e9e1d8;border-radius:22px;padding:clamp(24px,4vw,54px);box-shadow:0 18px 60px rgba(36,26,18,.045)}
.quiz-progress{margin-bottom:40px}
.quiz-progress__top{display:flex;justify-content:space-between;color:#776b61;font-size:14px;font-weight:600;margin-bottom:12px}
.quiz-progress__bar{height:6px;border-radius:8px;background:#eae3dc;overflow:hidden}
.quiz-progress__bar span{display:block;height:100%;width:25%;background:#d9af87;border-radius:8px;transition:width .35s ease}
.quiz-progress__labels{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:12px;font-size:12px;color:#8d8279}
.quiz-progress__labels span:last-child{text-align:right}
.quiz-progress__labels span:nth-child(2),.quiz-progress__labels span:nth-child(3){text-align:center}
.quiz-step{border:0;padding:0;margin:0;min-width:0}
.quiz-step[hidden],.quiz-back[hidden],.quiz-next[hidden],.quiz-error[hidden],.quiz-success[hidden]{display:none!important}
.quiz-step legend{font-size:clamp(25px,2.5vw,36px);font-weight:750;letter-spacing:-.035em;line-height:1.2;padding:0;max-width:800px}
.quiz-step__hint{color:#82786f;font-size:15px;margin:12px 0 28px;line-height:1.5}
.quiz-options{display:grid;gap:18px}
.quiz-options--images{grid-template-columns:repeat(2,minmax(0,1fr))}
.quiz-options--text{grid-template-columns:repeat(2,minmax(0,1fr))}
.quiz-option{position:relative;cursor:pointer;border:1px solid #e4ddd5;border-radius:14px;overflow:hidden;background:#fff;transition:border-color .2s,box-shadow .2s,transform .2s}
.quiz-option:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(0,0,0,.07)}
.quiz-option:has(input:checked){border-color:#b88a63;box-shadow:0 0 0 2px #d5ab87}
.quiz-option:has(input:focus-visible){outline:3px solid #8e6749;outline-offset:3px}
.quiz-option input[type=radio]{position:absolute;opacity:0;width:1px;height:1px}
.quiz-option__image{display:block;aspect-ratio:16/9;overflow:hidden}
.quiz-option__image img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .4s}
.quiz-option:hover img{transform:scale(1.035)}
.quiz-option__label{display:flex;align-items:center;justify-content:space-between;padding:17px 20px;font-weight:700;font-size:17px;gap:12px}
.quiz-option__check{display:grid;place-items:center;flex-shrink:0;width:28px;height:28px;border:1px solid #ded5cb;border-radius:50%;font-size:15px;color:transparent;transition:background .2s}
.quiz-option:has(input:checked) .quiz-option__check{background:#d6ae8a;color:#171717;border-color:#d6ae8a}
.quiz-option--text{display:flex;align-items:center;justify-content:space-between;padding:24px;gap:18px;font-weight:650;font-size:17px;min-height:90px}
.quiz-contact{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.quiz-contact>label:not(.quiz-consent){display:grid;gap:9px;font-weight:650;font-size:15px}
.quiz-contact input[type=text],.quiz-contact input[type=tel]{width:100%;min-width:0;box-sizing:border-box;border:1px solid #dcd3ca;background:#fff;border-radius:10px;padding:17px 18px;font:inherit;color:#171717}
.quiz-contact input:focus{outline:2px solid #d9af87;outline-offset:1px}
.quiz-consent{grid-column:1/-1;display:flex;align-items:flex-start;gap:11px;font-size:13px;color:#706861;line-height:1.55}
.quiz-consent input{accent-color:#b58c68;margin-top:4px}
.quiz-consent a{color:#65472d;text-decoration:underline}
.quiz-actions{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:32px}
.quiz-next{border:0;background:#e8c19b;color:#171717;font:inherit;font-weight:750;border-radius:11px;padding:18px 28px;cursor:pointer;margin-left:auto;display:flex;gap:30px;align-items:center;justify-content:center;transition:background .2s,transform .2s}
.quiz-next:hover{background:#d9aa7e;transform:translateY(-2px)}
.quiz-next:disabled{opacity:.55;cursor:wait}
.quiz-back{border:0;background:transparent;color:#5b524a;font:inherit;font-weight:650;cursor:pointer;padding:14px}
.quiz-back:hover{color:#171717}
.quiz-error{margin-top:20px;padding:14px 16px;background:#fff2ef;color:#9a3929;border-radius:10px;font-size:14px}
.quiz-success{text-align:center;padding:45px 10px}
.quiz-success__icon{display:grid;place-items:center;margin:0 auto 22px;width:64px;height:64px;border-radius:50%;background:#e6d0b9;font-size:30px}
.quiz-success h3{font-size:32px;margin:0 0 14px}
.quiz-success p{color:#706861;font-size:17px}
@media(max-width:767px){
.page-quiz .quiz-section{padding:54px 0 70px}
.quiz-intro{margin-bottom:26px;text-align:left}
.quiz-intro>p:last-child{font-size:15px}
.quiz-shell{padding:22px 16px;border-radius:16px}
.quiz-progress{margin-bottom:28px}
.quiz-progress__labels{font-size:10px;gap:3px}
.quiz-options--images{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.quiz-options--text,.quiz-contact{grid-template-columns:1fr}
.quiz-option__image{aspect-ratio:4/3}
.quiz-option__label{padding:12px 10px;font-size:13px;gap:4px;min-height:62px}
.quiz-option__check{width:23px;height:23px}
.quiz-option--text{min-height:75px;padding:17px;font-size:16px}
.quiz-step__hint{margin:10px 0 22px}
.quiz-contact{gap:16px}
.quiz-actions{margin-top:25px}
.quiz-next{padding:16px 18px;gap:12px;font-size:14px}
}
@media(max-width:370px){.quiz-option__label{font-size:12px}.quiz-progress__labels{font-size:9px}}
@media(prefers-reduced-motion:reduce){.quiz-option,.quiz-next,.quiz-progress__bar span,.quiz-option__image img{transition:none}} .page-quiz .quiz-intro{text-align:left;margin:0 0 38px;max-width:none}
.page-quiz .quiz-intro .quiz-kicker{display:flex;align-items:center;gap:25px;margin:0 0 20px;color:#707780;font-size:13px;font-weight:700;letter-spacing:.34em}
.page-quiz .quiz-intro .quiz-kicker span{display:block;width:48px;height:2px;flex:none;background:#f36a20}
.page-quiz .quiz-intro h2{margin:0 0 14px;color:#171717;font-size:clamp(40px,4.3vw,72px);font-weight:800;line-height:1.07;letter-spacing:-.055em}
.page-quiz .quiz-intro h2 span{color:#c7a286}
.page-quiz .quiz-intro>p:last-child{color:#78808a;font-size:clamp(16px,1.3vw,21px);line-height:1.5;margin:0}
@media(max-width:767px){.page-quiz .quiz-intro{margin-bottom:25px}.page-quiz .quiz-intro .quiz-kicker{font-size:10px;letter-spacing:.2em;gap:14px;margin-bottom:15px}.page-quiz .quiz-intro .quiz-kicker span{width:32px}.page-quiz .quiz-intro h2{font-size:clamp(34px,9vw,48px);line-height:1.1}.page-quiz .quiz-intro>p:last-child{font-size:15px}} .article-body {
background: #ffffff;
color: #171717;
padding: clamp(60px, 5vw, 90px) 0;
}
.article-body__container {
max-width: 1100px;
}
.article-body h2 {
font-size: clamp(22px, 2.4vw, 30px);
font-weight: 700;
margin: 36px 0 16px;
color: #1a1a1a;
}
.article-body h3 {
font-size: clamp(18px, 2vw, 24px);
font-weight: 600;
margin: 28px 0 12px;
color: #1a1a1a;
}
.article-body p {
font-size: 16px;
line-height: 1.75;
margin: 0 0 18px;
color: #2a2a2a;
}
.article-body img {
max-width: 100%;
height: auto;
margin: 24px 0;
border-radius: 8px;
}
.article-body ul,
.article-body ol {
margin: 0 0 20px 22px;
font-size: 16px;
line-height: 1.75;
color: #2a2a2a;
}
.article-body ul li,
.article-body ol li {
margin-bottom: 8px;
}
.article-body blockquote {
border-left: 4px solid #d48748;
padding: 12px 20px;
margin: 24px 0;
font-style: italic;
color: #555;
background: rgba(212, 135, 72, .05);
border-radius: 4px;
}
.article-body a {
color: #d48748;
text-decoration: underline;
}
.article-body a:hover {
color: #b87436;
}
.article-body figure {
margin: 24px 0;
}
.article-body figcaption {
text-align: center;
font-size: 13px;
color: #777;
margin-top: 8px;
}
.article-body table {
width: 100%;
border-collapse: collapse;
margin: 24px 0;
font-size: 14px;
}
.article-body table th,
.article-body table td {
border: 1px solid #ddd;
padding: 10px 12px;
text-align: left;
}
.article-body table th {
background: rgba(212, 135, 72, .1);
font-weight: 600;
}
.article-footer {
background: #ffffff;
padding-bottom: 30px;
}
.article-tags {
display: flex;
flex-wrap: wrap;
gap: 10px;
align-items: center;
font-size: 14px;
}
.article-tags__label {
color: #777;
font-weight: 600;
}
.article-tags a {
display: inline-block;
padding: 6px 14px;
background: rgba(212, 135, 72, .12);
color: #d48748;
border-radius: 20px;
text-decoration: none;
font-size: 13px;
transition: background .2s;
}
.article-tags a:hover {
background: rgba(212, 135, 72, .25);
}
.article-back {
background: #ffffff;
padding: 20px 0 60px;
}
.article-back a {
display: inline-flex;
align-items: center;
gap: 10px;
color: #d48748;
text-decoration: none;
font-weight: 600;
font-size: 15px;
transition: color .2s;
}
.article-back a:hover {
color: #b87436;
}
.article-back a span {
font-size: 18px;
}
@media (max-width: 768px) {
.article-body {
padding: 40px 0;
}
.article-body p {
font-size: 15px;
line-height: 1.7;
}
} .article-related {
background: #f6f2ed;
padding: clamp(50px, 5vw, 80px) 0;
border-top: 1px solid #e5dcd3;
}
.article-related__head {
max-width: 1100px;
margin: 0 auto 32px;
padding: 0 24px;
}
.article-related__eyebrow {
display: flex;
align-items: center;
gap: 25px;
margin: 0 0 14px;
color: #68717b;
font-size: 13px;
font-weight: 700;
letter-spacing: .32em;
text-transform: uppercase;
}
.article-related__eyebrow span {
width: 48px;
height: 2px;
background: #f36a20;
flex: none;
}
.article-related__title {
font-size: clamp(28px, 3vw, 42px);
font-weight: 800;
letter-spacing: -.045em;
line-height: 1.05;
margin: 0;
color: #1a1a1a;
}
.article-related__title span {
color: #c7a286;
}
.article-related__grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 22px;
max-width: 1100px;
margin: 0 auto;
padding: 0 24px;
}
.article-related .news-card {
display: flex;
flex-direction: column;
min-width: 0;
background: #fcfaf7;
border: 1px solid #e5dcd3;
border-radius: 12px;
overflow: hidden;
transition: transform .25s, box-shadow .25s;
}
.article-related .news-card:hover {
transform: translateY(-5px);
box-shadow: 0 18px 38px rgba(30, 22, 15, .09);
}
.article-related .news-card__media {
display: block;
aspect-ratio: 3/2;
overflow: hidden;
}
.article-related .news-card__media img {
width: 100%;
height: 100%;
display: block;
object-fit: cover;
transition: transform .4s;
}
.article-related .news-card:hover .news-card__media img {
transform: scale(1.04);
}
.article-related .news-card__body {
padding: 22px;
display: flex;
flex-direction: column;
flex: 1;
}
.article-related .news-card__body h3 {
font-size: clamp(17px, 1.25vw, 21px);
font-weight: 700;
letter-spacing: -.025em;
line-height: 1.25;
margin: 0 0 12px;
}
.article-related .news-card__body h3 a {
color: #151515;
text-decoration: none;
}
.article-related .news-card__body h3 a:hover {
color: #a67855;
}
.article-related .news-card__body p {
color: #777e86;
font-size: 13px;
line-height: 1.6;
margin: 0 0 20px;
}
.article-related .news-card__link {
margin-top: auto;
display: inline-flex;
gap: 10px;
align-items: center;
color: #b47d52;
font-weight: 700;
font-size: 13px;
text-decoration: none;
}
.article-related .news-card__link:hover {
color: #815131;
}
@media (max-width: 1024px) {
.article-related__grid {
gap: 14px;
}
.article-related .news-card__body {
padding: 16px;
}
}
@media (max-width: 767px) {
.article-related {
padding: 50px 0 60px;
}
.article-related__head {
margin-bottom: 24px;
}
.article-related__eyebrow {
font-size: 10px;
gap: 14px;
letter-spacing: .2em;
margin-bottom: 12px;
}
.article-related__eyebrow span {
width: 32px;
}
.article-related__grid {
grid-template-columns: 1fr;
gap: 18px;
}
} .page-quiz--no-hero .quiz-section {
padding-top: clamp(80px, 8vw, 120px);
} .page-quiz--no-hero .site-header {
background: rgba(20, 21, 21, .96);
backdrop-filter: blur(7px);
-webkit-backdrop-filter: blur(7px);
border-bottom: 1px solid rgba(255, 255, 255, .07);
position: sticky;
top: 0;
z-index: 100;
}   .page-default .article-body,
.alkor-default .article-body {
background: #ffffff;
} .page-default--no-hero .article-body,
.alkor-default.page-default--no-hero .article-body {
padding-top: clamp(50px, 5vw, 80px);
} .page-default--no-hero .site-header,
.alkor-default.page-default--no-hero .site-header {
background: rgba(20, 21, 21, .96);
backdrop-filter: blur(7px);
-webkit-backdrop-filter: blur(7px);
border-bottom: 1px solid rgba(255, 255, 255, .07);
position: sticky;
top: 0;
z-index: 100;
}