.hero {
position: relative;
height: 100svh;
min-height: 720px;
overflow: hidden;
isolation: isolate;
background: black;
}
.hero::before{
content:"";
position:absolute;
inset:0;
pointer-events:none;
opacity:.03;
background-image:
radial-gradient(circle, rgba(255,255,255,.35) .5px, transparent .6px);
background-size:4px 4px;
}
.hero__slider,
.hero__slide,
.hero__video {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
}
.hero__slide {
opacity: 0;
transition: opacity 1.2s ease;
}
.hero__slide.is-active {
opacity: 1;
}
.hero__video {
object-fit: cover;
object-position: center center;
}
.hero__video--mobile {
display: none;
} .hero__overlay {
position: absolute;
inset: 0;
z-index: 2;
pointer-events: none;
background: radial-gradient(ellipse 110% 95% at 100% 18%, rgb(213 165 109 / 15%) 0%, rgb(35 25 14 / 17%) 44%, transparent 78%), radial-gradient(ellipse 100% 85% at 0% 52%, rgb(58 42 24 / 69%) 0%, rgba(30, 23, 16, 0.03) 46%, transparent 80%), linear-gradient(180deg, rgba(3, 3, 3, 0.08) 0%, rgba(4, 4, 4, 0.045) 50%, rgba(3, 3, 3, 0.10) 100%);
filter: none;
transform: none;
}  .hero__slide::after {
content: "";
position: absolute;
inset: 0;
pointer-events: none; }
.hero::after {
content: "";
position: absolute;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
height: 320px;
pointer-events: none;
background: linear-gradient(
to bottom,
transparent 0%,
rgba(5, 5, 5, 0.08) 24%,
rgba(5, 5, 5, 0.42) 58%,
rgba(5, 5, 5, 0.9) 84%,
#050505 100%
);
}
.hero__content {
position: relative;
z-index: 1;
width: calc(100% - 120px);
max-width: 1560px;
height: 100%;
margin: 0 auto;
margin-top:30px;
display: grid;
grid-template-columns: minmax(0, 1fr) 260px; gap: 56px;
padding-top: 140px;
padding-bottom: 150px;
}
.hero__main {
max-width: 980px;
}
.hero__eyebrow {
position: relative;
width: fit-content;
margin: 0 0 30px;
padding-bottom: 14px;
font-size: 11px;
line-height: 1;
letter-spacing: 0.26em;
text-transform: uppercase;
color: rgba(155, 129, 77, 0.86);
}
.hero__eyebrow::after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 150px;
height: 1px;
background: linear-gradient(
90deg,
rgba(155, 129, 77, 0.95),
rgba(155, 129, 77, 0.18),
transparent
);
} .hero__title-wrap {
width: fit-content;
}
.hero__title-line {
position: relative;
width: fit-content;
overflow: hidden;
}
.hero__title {
margin: 0;
font-family: "Cormorant Garamond", Georgia, serif;
font-size: 64px;
font-weight: 500;
line-height: 0.9;
letter-spacing: -0.055em;
white-space: nowrap;
}
.hero__title--outline {
color: transparent;
-webkit-text-stroke: 1px rgba(245, 242, 236, 0.42);
}
.hero__title--fill {
position: absolute;
inset: 0;
color: #ffffff;
clip-path: inset(0 100% 0 0);
}
.hero__title-line:nth-child(1) .hero__title--fill {
animation: heroTitleFill 1.45s cubic-bezier(0.22, 1, 0.36, 1) 0.35s forwards;
}
.hero__title-line:nth-child(2) .hero__title--fill {
animation: heroTitleFill 1.55s cubic-bezier(0.22, 1, 0.36, 1) 0.95s forwards;
}
@keyframes heroTitleFill {
to {
clip-path: inset(0 0 0 0);
}
} .hero__description {
position: relative;
max-width: 520px;
margin-top: 34px;
padding-top: 24px;
}
.hero__description::before {
content: "";
position: absolute;
left: 0;
top: 0;
width: 420px;
max-width: 100%;
height: 1px;
background: linear-gradient(
90deg,
rgba(155, 129, 77, 0.85),
rgba(155, 129, 77, 0.12),
transparent
);
}
.hero__description p {
margin: 0;
font-size: 17px;
line-height: 1.7;
color: rgba(245, 242, 236, 0.72);
} .hero__premium-stat {
position: relative;
align-self: end;
min-height: 230px;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 20px;
}
.hero__stat-line {
position: absolute;
left: -120px;
top: 50%;
width: 190px;
height: 1px;
background: linear-gradient(
90deg,
transparent,
rgba(155, 129, 77, 0.7),
rgba(155, 129, 77, 0.12)
);
}
.hero__stat-inner {
position: relative;
width: 210px;
height: 210px;
padding: 34px;
border: 1px solid rgba(155, 129, 77, 0.38);
border-radius: 50%;
display: flex;
flex-direction: column;
justify-content: center;
background:
radial-gradient(circle, rgba(155, 129, 77, 0.1), transparent 62%),
rgba(5, 5, 5, 0.28);
backdrop-filter: blur(8px);
box-shadow:
0 0 70px rgba(155, 129, 77, 0.12),
inset 0 0 50px rgba(155, 129, 77, 0.05);
}
.hero__stat-inner::before {
content: "";
position: absolute;
inset: 16px;
border: 1px solid rgba(155, 129, 77, 0.18);
border-radius: 50%;
}
.hero__stat-number {
position: relative;
z-index: 1;
margin-bottom: 14px;
font-family: "Cormorant Garamond", Georgia, serif;
font-size: 58px;
font-weight: 500;
line-height: 0.8;
color: #ffffff;
}
.hero__stat-inner p {
position: relative;
z-index: 1;
margin: 0;
font-size: 10px;
line-height: 1.45;
letter-spacing: 0.16em;
text-transform: uppercase;
color: rgba(245, 242, 236, 0.62);
}
.hero__stat-seal {
position: absolute;
right: 8px;
bottom: 20px;
width: 42px;
height: 42px;
border: 1px solid rgba(155, 129, 77, 0.5);
border-radius: 50%;
background:
radial-gradient(circle, #9b814d 0 4px, transparent 5px),
rgba(5, 5, 5, 0.65);
box-shadow: 0 0 26px rgba(155, 129, 77, 0.28);
} .hero__pagination {
position: absolute;
z-index: 3;
left: 50%;
bottom: 34px;
display: flex;
gap: 12px;
transform: translateX(-50%);
}
.hero__dot {
width: 10px;
height: 10px;
border-radius: 50%;
background: rgba(155, 129, 77, 0.35);
transition:
width 0.35s ease,
background 0.35s ease;
}
.hero__dot.is-active {
width: 34px;
border-radius: 999px;
background: #9b814d;
} @media (max-width: 1200px) {
.hero__content {
width: calc(100% - 80px);
max-width: 1400px;
grid-template-columns: minmax(0, 1fr) 220px;
gap: 42px;
}
.hero__title {
font-size: 64px;
}
.hero__stat-inner {
width: 180px;
height: 180px;
padding: 28px;
}
.hero__stat-number {
font-size: 48px;
}
} @media (max-width: 768px) {
.hero {
height: 100svh;
min-height: 600px;
}
.hero::after {
background: linear-gradient(
to top,
#050505 0px,
rgba(5, 5, 5, 0.85) 36px,
rgba(5, 5, 5, 0.4) 84px,
rgba(5, 5, 5, 0.08) 132px,
transparent 180px
);
}
.hero__content {
width: calc(100% - 40px);
height: 100%;
min-height: 0;
display: flex;
flex-direction: column;
justify-content: flex-start;
padding-top: 160px;
padding-bottom: 96px;
}
.hero__video--desktop {
display: none;
}
.hero__video--mobile {
display: block;
}
.hero__video {
object-position: center top;
}
.hero::after {
background:
radial-gradient(
ellipse 145% 46% at 50% 108%,
rgba(5, 5, 5, 1) 0%,
rgba(5, 5, 5, 0.76) 30%,
rgba(5, 5, 5, 0.25) 62%,
transparent 84%
);
}
.hero__main {
width: 100%;
max-width: 100%;
}
.hero__eyebrow {
max-width: 320px;
margin-bottom: 16px;
padding-bottom: 10px;
font-size: 10px;
line-height: 1.25;
letter-spacing: 0.18em;
}
.hero__eyebrow::after {
width: 120px;
}
.hero__title {
max-width: 100%;
font-size: clamp(30px, 9.2vw, 64px);
line-height: 1.04;
letter-spacing: -0.04em;
}
.hero__description {
max-width: 480px;
margin-top: 18px;
padding-top: 14px;
}
.hero__description p {
font-size: 15px;
line-height: 1.5;
}
.hero__premium-stat {
display: none;
}
.hero__pagination {
bottom: 24px;
}
.hero__overlay {
background:
linear-gradient(
180deg,
rgba(110, 80, 40, .16) 0%,
rgba(70, 50, 25, .08) 18%,
rgba(0,0,0,0) 45%
),
linear-gradient(
rgba(0,0,0,.18),
rgba(0,0,0,.18)
);
}
} @media (max-width: 480px) {
.hero__content {
width: calc(100% - 32px);
}
.hero__eyebrow {
max-width: 280px;
margin-bottom: 14px;
font-size: 9px;
letter-spacing: 0.16em;
}
.hero__description {
max-width: 330px;
margin-top: 16px;
padding-top: 13px;
}
.hero__description p {
font-size: 13px;
line-height: 1.42;
}
} @media (max-width: 390px) {
.hero__description p {
font-size: 12.5px;
}
} @media (max-height: 760px) and (max-width: 768px) {
.hero {
min-height: 520px;
}
.hero__content {
padding-top: 80px;
padding-bottom: 80px;
}
.hero__eyebrow {
margin-bottom: 10px;
padding-bottom: 8px;
}
.hero__description {
margin-top: 12px;
padding-top: 11px;
}
.hero__description p {
font-size: 12px;
line-height: 1.38;
}
}  .about-products {
position: relative;
overflow: hidden;
padding: 100px 0 80px;
background: linear-gradient(
to bottom,
rgba(5, 5, 5, 1) 0%,
rgba(5, 5, 5, 0.98) 12%,
rgba(5, 5, 5, 0.9) 22%,
rgba(5, 5, 5, 0.7) 35%,
rgba(5, 5, 5, 0.35) 48%,
transparent 60%
);
}
.about-products::before {
content: "";
position: absolute;
inset: 0;
z-index: 0; pointer-events: none;
}
.about-bg {
position: absolute;
inset: 0; background-size: cover;
background-position: center;
opacity: 0.45;
}
.about-products .container {
position: relative;
z-index: 1;
max-width: 1320px;
margin: 0 auto;
padding-left: 40px;
padding-right: 40px;
}
.about-products__container {
display: grid;
grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
gap: 90px;
align-items: center;
}
.about-products__content {
position: relative;
z-index: 3;
max-width: 570px;
}
.about-products__eyebrow {
position: relative;
width: fit-content;
margin: 0 0 30px;
padding-bottom: 14px;
font-size: 11px;
line-height: 1;
letter-spacing: 0.26em;
text-transform: uppercase;
color: rgba(155, 129, 77, 0.78);
}
.about-products__eyebrow::after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 140px;
height: 1px;
background: linear-gradient(
90deg,
rgba(155, 129, 77, 0.9),
rgba(155, 129, 77, 0.18),
transparent
);
}
.about-products__title {
margin: 0 0 36px;
font-family: "Cormorant Garamond", Georgia, serif;
font-size: 64px;
font-weight: 500;
line-height: 0.92;
letter-spacing: -0.045em;
}
.about-products__title span {
display: block;
}
.about-products__title span:nth-child(1),
.about-products__title span:nth-child(3) {
color: var(--color-white);
}
.about-products__title span:nth-child(2) {
color: var(--color-gold-light);
}
.about-products__text {
max-width: 520px;
margin: 0 0 18px;
font-size: 15px;
line-height: 1.8;
color: rgba(245, 242, 236, 0.72);
}
.about-products__btn {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 176px;
height: 58px;
margin-top: 28px;
padding: 0 30px;
border: 1px solid rgba(155, 129, 77, 0.5);
background: #9b814d;
font-size: 11px;
font-weight: 600;
letter-spacing: 0.16em;
text-transform: uppercase;
color: #050505;
text-decoration: none;
transition:
background 0.35s ease,
color 0.35s ease,
transform 0.35s ease,
box-shadow 0.35s ease;
}
.about-products__btn:hover {
background: transparent;
color: #9b814d;
transform: translateY(-3px);
box-shadow: 0 18px 45px rgba(155, 129, 77, 0.16);
}
.about-products__gallery {
position: relative;
z-index: 2;
min-height: 680px;
}
.about-products__gallery::before {
content: "";
position: absolute;
left: 58%;
top: 52%;
z-index: 0;
width: 520px;
height: 520px;
border-radius: 50%;
background: rgba(155, 129, 77, 0.12);
filter: blur(145px);
transform: translate(-50%, -50%);
pointer-events: none;
}
.about-products__frame {
position: absolute;
right: 42px;
top: 58px;
z-index: 1;
width: 72%;
height: 74%;
border: 1px solid rgba(155, 129, 77, 0.52);
}
.about-products__frame::before,
.about-products__frame::after {
content: "";
position: absolute;
background: #9b814d;
opacity: 0.65;
}
.about-products__frame::before {
left: -80px;
top: 72px;
width: 80px;
height: 1px;
}
.about-products__frame::after {
right: 58px;
bottom: -70px;
width: 1px;
height: 70px;
}
.about-products__photo {
position: absolute;
z-index: 2;
display: block;
overflow: hidden;
background: #111;
text-decoration: none; }
.about-products__photo::before {
content: "";
position: absolute;
inset: 0;
z-index: 2;
background:
linear-gradient(180deg, transparent 42%, rgba(0, 0, 0, 0.72) 100%),
linear-gradient(135deg, rgba(155, 129, 77, 0.18), transparent 38%);
opacity: 0.75;
transition: opacity 0.45s ease;
}
.about-products__photo::after {
content: "";
position: absolute;
inset: 14px;
z-index: 3;
border: 1px solid rgba(155, 129, 77, 0.45);
opacity: 0;
transform: scale(1.04);
transition:
opacity 0.45s ease,
transform 0.45s ease;
}
.about-products__photo img {
width: 100%;
height: 100%;
object-fit: cover;
filter: saturate(0.92) contrast(1.05);
transform: scale(1.01);
transition:
transform 0.75s ease,
filter 0.75s ease;
}
.about-products__photo span {
position: absolute;
left: 28px;
bottom: 24px;
z-index: 4;
font-family: "Cormorant Garamond", Georgia, serif;
font-size: 34px;
font-weight: 600;
line-height: 1;
color: var(--color-white);
}
.about-products__photo:hover img {
transform: scale(1.07);
filter: saturate(1.05) contrast(1.08);
}
.about-products__photo:hover::before {
opacity: 0.95;
}
.about-products__photo:hover::after {
opacity: 1;
transform: scale(1);
}
.about-products__photo--main {
right: 0;
top: 118px;
width: 68%;
height: 480px;
}
.about-products__photo--top {
left: 0;
top: 0;
width: 43%;
height: 300px;
}
.about-products__photo--bottom {
left: 46px;
bottom: 0;
width: 42%;
height: 260px;
}
.about-products__note {
position: absolute;
z-index: 4;
padding: 18px 20px;
border: 1px solid rgba(155, 129, 77, 0.28);
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.015)),
rgba(5, 5, 5, 0.74);
backdrop-filter: blur(14px);
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.38);
}
.about-products__note span {
display: block;
font-size: 10px;
line-height: 1.45;
letter-spacing: 0.2em;
text-transform: uppercase;
color: rgba(155, 129, 77, 0.82);
}
.about-products__note--top {
right: 40px;
top: 120px;
}
.about-products__note--bottom {
left: 42%;
bottom: 170px;
}
.about-products__seal {
position: absolute;
right: 52px;
bottom: 92px;
z-index: 4;
width: 42px;
height: 42px;
border: 1px solid rgba(155, 129, 77, 0.5);
border-radius: 50%;
background:
radial-gradient(circle, #9b814d 0 4px, transparent 5px),
rgba(5, 5, 5, 0.7);
box-shadow:
0 0 26px rgba(155, 129, 77, 0.28),
inset 0 0 20px rgba(155, 129, 77, 0.06);
}
.about-products__seal::before {
content: "";
position: absolute;
right: 100%;
top: 50%;
width: 68px;
height: 1px;
background: linear-gradient(
90deg,
rgba(155, 129, 77, 0.75),
transparent
);
} .about-products__content,
.about-products__gallery {
opacity: 0;
transform: translateY(38px);
}
.about-products.is-visible .about-products__content,
.about-products.is-visible .about-products__gallery {
animation: aboutProductsFadeUp 1s ease forwards;
}
.about-products.is-visible .about-products__gallery {
animation-delay: 0.16s;
}
.about-products__frame {
transform: scaleX(0.65) scaleY(0.88);
transform-origin: center;
opacity: 0;
}
.about-products.is-visible .about-products__frame {
animation: aboutProductsFrame 1s ease forwards 0.35s;
}
.about-products__photo--main,
.about-products__photo--top,
.about-products__photo--bottom,
.about-products__note {
opacity: 0;
}
.about-products__photo--main {
transform: translateY(34px) scale(1.08);
}
.about-products__photo--top {
transform: translate(-34px, 24px) scale(0.96);
}
.about-products__photo--bottom {
transform: translate(34px, -20px) scale(0.96);
}
.about-products__note {
transform: translateY(20px);
}
.about-products.is-visible .about-products__photo--main {
animation: aboutProductsMainPhoto 1s ease forwards 0.45s;
}
.about-products.is-visible .about-products__photo--top {
animation: aboutProductsPhotoIn 0.9s ease forwards 0.65s;
}
.about-products.is-visible .about-products__photo--bottom {
animation: aboutProductsPhotoIn 0.9s ease forwards 0.82s;
}
.about-products.is-visible .about-products__note {
animation: aboutProductsPhotoIn 0.8s ease forwards 1s;
}
@keyframes aboutProductsFadeUp {
to {
opacity: 1;
transform: translateY(0);
}
}
@keyframes aboutProductsFrame {
to {
opacity: 1;
transform: scaleX(1) scaleY(1);
}
}
@keyframes aboutProductsMainPhoto {
to {
opacity: 1;
transform: translateY(0) scale(1);
}
}
@keyframes aboutProductsPhotoIn {
to {
opacity: 1;
transform: translate(0, 0) scale(1);
}
} @media (max-width: 1200px) {
.about-products {
padding: 120px 0;
}
.about-products .container {
padding-left: 40px;
padding-right: 40px;
}
.about-products__container {
gap: 60px;
}
.about-products__gallery {
min-height: 610px;
}
.about-products__photo--main {
height: 430px;
}
.about-products__photo--top {
height: 260px;
}
.about-products__photo--bottom {
height: 230px;
}
} @media (max-width: 900px) {
.about-products {
padding: 96px 0 110px;
}
.about-products::before {
background: linear-gradient(
to bottom,
#050505 0px,
rgba(5, 5, 5, 0.85) 36px,
rgba(5, 5, 5, 0.4) 84px,
rgba(5, 5, 5, 0.08) 132px,
transparent 180px
);
}
.about-products .container {
padding-left: 28px;
padding-right: 28px;
}
.about-products__container {
grid-template-columns: 1fr;
gap: 70px;
}
.about-products__content {
max-width: 720px;
}
.about-products__title {
font-size: 48px;
}
.about-products__gallery {
width: 100%;
max-width: 720px;
min-height: 640px;
margin: 0 auto;
}
.about-products__gallery::before {
left: 52%;
top: 50%;
width: 520px;
height: 520px;
filter: blur(140px);
}
.about-products__photo--main {
right: 0;
top: 120px;
width: 70%;
height: 430px;
}
.about-products__photo--top {
left: 0;
top: 0;
width: 44%;
height: 270px;
}
.about-products__photo--bottom {
left: 40px;
bottom: 0;
width: 44%;
height: 240px;
}
} @media (max-width: 560px) {
.about-products {
padding: 70px 0 50px;
}
.about-products::before {
background-size: 64px 64px;
opacity: 0.18;
}
.about-products .container {
padding-left: 16px;
padding-right: 16px;
}
.about-products__container {
gap: 54px;
}
.about-products__title {
font-size: 42px;
}
.about-products__text {
font-size: 14px;
line-height: 1.75;
}
.about-products__btn {
width: 100%;
}
.about-products__gallery {
min-height: 560px;
}
.about-products__gallery::before {
left: 58%;
top: 50%;
width: 360px;
height: 360px;
background: rgba(155, 129, 77, 0.13);
filter: blur(110px);
}
.about-products__frame {
right: 16px;
top: 44px;
width: 78%;
height: 74%;
}
.about-products__frame::before,
.about-products__frame::after {
display: none;
}
.about-products__photo span {
left: 20px;
bottom: 18px;
font-size: 28px;
}
.about-products__photo--main {
right: 0;
top: 96px;
width: 78%;
height: 360px;
}
.about-products__photo--top {
left: 0;
top: 0;
width: 56%;
height: 210px;
}
.about-products__photo--bottom {
left: 0;
bottom: 0;
width: 54%;
height: 190px;
}
.about-products__note {
display: none;
}
} @media (max-width: 390px) {
.about-products__gallery {
min-height: 520px;
}
.about-products__photo--main {
height: 335px;
}
.about-products__photo--top {
height: 190px;
}
.about-products__photo--bottom {
height: 165px;
}
}   .advantages {
position: relative;
overflow: hidden;
padding: 80px 0 80px; }
.advantages__container {
max-width: 1320px;
margin: 0 auto;
padding: 0 40px;
}
.advantages__head {
position: relative;
z-index: 3;
max-width: 760px;
margin-bottom: 40px;
}
.advantages__eyebrow {
position: relative;
width: fit-content;
margin: 0 0 26px;
padding-bottom: 14px;
font-size: 11px;
line-height: 1;
letter-spacing: 0.26em;
text-transform: uppercase;
color: rgba(155, 129, 77, 0.86);
}
.advantages__eyebrow::after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 140px;
height: 1px;
background: linear-gradient(
90deg,
rgba(155, 129, 77, 0.95),
rgba(155, 129, 77, 0.18),
transparent
);
}
.advantages__title {
margin: 0;
font-family: "Cormorant Garamond", Georgia, serif;
font-size: 72px;
font-weight: 500;
line-height: 0.92;
letter-spacing: -0.05em;
}
.advantages__title span {
display: block;
}
.advantages__title span:first-child {
color: #f5f2ec;
}
.advantages__title span:last-child {
color: #9b814d;
} .advantages__constellation {
position: relative;
min-height: 610px;
}
.advantages__constellation::before {
content: "";
position: absolute;
left: 50%;
top: 52%;
width: 680px;
height: 680px;
border: 1px solid rgba(155, 129, 77, 0.1);
border-radius: 50%;
transform: translate(-50%, -50%);
pointer-events: none;
}
.advantages__constellation::after {
content: "";
position: absolute;
left: 50%;
top: 52%;
width: 900px;
height: 1px;
background: linear-gradient(
90deg,
transparent,
rgba(155, 129, 77, 0.42),
rgba(155, 129, 77, 0.12),
transparent
);
transform: translateX(-50%);
pointer-events: none;
}
.advantages__center {
position: absolute;
left: 50%;
top: 50%;
z-index: 3;
transform: translate(-50%, -50%);
width: 360px;
height: 360px;
border-radius: 50%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background:
radial-gradient(circle at 50% 50%, rgba(155, 129, 77, 0.13), transparent 56%),
rgba(5, 5, 5, 0.56);
box-shadow:
0 0 120px rgba(155, 129, 77, 0.08),
inset 0 0 80px rgba(155, 129, 77, 0.055);
opacity: 0;
scale: 0.92;
}
.advantages.is-visible .advantages__center {
animation: advantageCenterIn 0.9s ease forwards;
}
.advantages__center::before,
.advantages__center::after {
content: "";
position: absolute;
border-radius: 50%;
pointer-events: none;
}
.advantages__center::before {
inset: 0;
border: 1px solid rgba(155, 129, 77, 0.2);
}
.advantages__center::after {
inset: 34px;
border: 1px solid rgba(155, 129, 77, 0.1);
}
.advantages__center span {
position: relative;
z-index: 2;
font-family: "Cormorant Garamond", Georgia, serif;
font-size: 180px;
line-height: 0.74;
letter-spacing: -0.09em;
color: #9b814d;
}
.advantages__center small {
position: relative;
z-index: 2;
margin-top: 24px;
font-size: 11px;
line-height: 1;
letter-spacing: 0.24em;
text-transform: uppercase;
color: rgba(245, 242, 236, 0.62);
}
.advantages__stat {
position: absolute;
z-index: 4;
width: 230px;
padding-top: 18px;
border-top: 1px solid rgba(155, 129, 77, 0.28);
opacity: 0;
transform: translateY(18px);
}
.advantages.is-visible .advantages__stat {
animation: advantageStatIn 0.7s ease forwards;
}
.advantages__stat::before {
content: "";
position: absolute;
top: -5px;
left: 0;
width: 9px;
height: 9px;
border: 1px solid rgba(155, 129, 77, 0.9);
border-radius: 50%;
background: #050505;
box-shadow:
0 0 0 8px rgba(155, 129, 77, 0.06),
0 0 24px rgba(155, 129, 77, 0.38);
}
.advantages__stat strong {
display: block;
margin-bottom: 14px;
font-family: "Cormorant Garamond", Georgia, serif;
font-size: 58px;
font-weight: 500;
line-height: 0.88;
color: #f5f2ec;
}
.advantages__stat span {
display: block;
max-width: 180px;
font-size: 10px;
line-height: 1.55;
letter-spacing: 0.16em;
text-transform: uppercase;
color: rgba(245, 242, 236, 0.56);
} .advantages__stat--1 {
left: 8%;
top: 18%;
animation-delay: 0.1s;
}
.advantages__stat--2 {
right: 13%;
top: 10%;
animation-delay: 0.2s;
}
.advantages__stat--3 {
right: 4%;
top: 52%;
animation-delay: 0.3s;
}
.advantages__stat--4 {
left: 18%;
bottom: 10%;
animation-delay: 0.4s;
}
.advantages__stat--5 {
right: 22%;
bottom: 4%;
animation-delay: 0.5s;
} @keyframes advantageCenterIn {
to {
opacity: 1;
scale: 1;
}
}
@keyframes advantageStatIn {
to {
opacity: 1;
transform: translateY(0);
}
} @media (max-width: 1100px) {
.advantages {
padding: 105px 0 120px;
}
.advantages__title {
font-size: 60px;
}
.advantages__constellation {
min-height: 700px;
}
.advantages__center {
width: 300px;
height: 300px;
}
.advantages__center span {
font-size: 145px;
}
.advantages__stat--1 {
left: 0;
}
.advantages__stat--2 {
right: 2%;
}
.advantages__stat--3 {
right: 0;
}
.advantages__stat--4 {
left: 6%;
}
.advantages__stat--5 {
right: 12%;
}
}
@media (max-width: 768px) {
.advantages {
padding: 90px 0 98px;
}
.advantages__container {
padding: 0 20px;
}
.advantages__title {
font-size: 46px;
line-height: 0.98;
}
.advantages__constellation {
min-height: auto;
padding-top: 40px;
}
.advantages__constellation::before,
.advantages__constellation::after {
display: none;
}
.advantages__center {
position: relative;
left: auto;
top: auto;
transform: none;
width: 240px;
height: 240px;
margin-bottom: 42px;
}
.advantages__center span {
font-size: 112px;
}
.advantages__stat {
position: relative;
left: auto;
right: auto;
top: auto;
bottom: auto;
width: 100%;
padding: 24px 0;
border-top: 1px solid rgba(155, 129, 77, 0.18);
}
.advantages__stat strong {
font-size: 46px;
}
.advantages__stat span {
max-width: 260px;
}
}
@media (max-width: 480px) {
.advantages {
padding: 78px 0 86px;
}
.advantages__container {
padding: 0 16px;
}
.advantages__title {
font-size: 38px;
}
.advantages__center {
width: 220px;
height: 220px;
}
.advantages__center span {
font-size: 98px;
}
.advantages__center small {
font-size: 9px;
}
}  .suppliers-map {
position: relative;
overflow: hidden;
padding-top: 130px;
padding-bottom: 80px; }
.suppliers-map .container {
position: relative;
z-index: 1;
max-width: 1320px;
margin: 0 auto;
padding-left: 40px;
padding-right: 40px;
}
.suppliers-map__head {
max-width: 900px; }
.suppliers-map__eyebrow {
position: relative;
width: fit-content;
margin: 0 0 26px;
padding-bottom: 14px;
font-size: 11px;
line-height: 1;
letter-spacing: 0.26em;
text-transform: uppercase;
color: rgba(155, 129, 77, 0.86);
}
.suppliers-map__eyebrow::after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 150px;
height: 1px;
background: linear-gradient(
90deg,
rgba(155, 129, 77, 0.95),
rgba(155, 129, 77, 0.18),
transparent
);
}
.suppliers-map__title {
margin: 0;
font-family: "Cormorant Garamond", Georgia, serif;
font-size: 64px;
font-weight: 500;
line-height: 0.92;
letter-spacing: -0.045em;
}
.suppliers-map__title span {
display: block;
}
.suppliers-map__title span:first-child {
color: var(--color-white);
}
.suppliers-map__title span:last-child {
color: #9b814d;
}
.suppliers-map__body {
position: relative;
min-height: 760px;
overflow: hidden;
background: transparent;
} .suppliers-map__svg-wrap {
position: absolute;
left: 50%;
top: 47%;
width: 92%;
max-width: 1180px;
transform: translate(-50%, -50%);
opacity: 0;
transition: opacity 1s ease;
}
.suppliers-map.is-visible .suppliers-map__svg-wrap {
opacity: 1;
}
.suppliers-map__svg-wrap {
touch-action: pan-y;
overscroll-behavior: auto;
}
.suppliers-map__svg-wrap svg {
width: 100%;
height: 100%;
object-fit: contain;
touch-action: pan-y;
user-select: none;
-webkit-user-select: none;
-webkit-touch-callout: none;
}
.suppliers-map__svg-wrap path {
fill: rgba(73, 63, 43, 0.74);
stroke: rgba(155, 129, 77, 0.34);
stroke-width: 0.75;
transition:
fill 0.55s ease,
stroke 0.55s ease,
filter 0.55s ease;
}
.suppliers-map__svg-wrap path.is-supplier {
fill: rgba(102, 84, 48, 0.84);
stroke: rgba(155, 129, 77, 0.5);
cursor: pointer;
}
.suppliers-map__svg-wrap path.is-active {
fill: rgba(155, 129, 77, 0.94);
stroke: rgba(215, 193, 138, 0.98);
filter:
drop-shadow(0 0 10px rgba(155, 129, 77, 0.58))
drop-shadow(0 0 28px rgba(111, 90, 52, 0.5));
} .map-marker {
cursor: pointer;
opacity: 0;
transform-box: fill-box;
transform-origin: center;
}
.suppliers-map.is-visible .map-marker {
animation: mapMarkerIn 0.7s ease forwards;
}
.map-marker__pulse {
fill: rgba(155, 129, 77, 0.16);
}
.map-marker__dot {
fill: #050505;
stroke: #9b814d;
stroke-width: 2;
filter: drop-shadow(0 0 12px rgba(155, 129, 77, 0.7));
transition: fill 0.35s ease, filter 0.35s ease;
}
.map-marker__text {
font-family: "Manrope", Arial, sans-serif;
font-size: 11px;
font-weight: 500;
letter-spacing: 2px;
text-transform: uppercase;
fill: rgba(245, 242, 236, 0.88);
paint-order: stroke;
stroke: rgba(0, 0, 0, 0.92);
stroke-width: 5px;
}
.map-marker:hover .map-marker__dot,
.map-marker.is-active .map-marker__dot {
fill: #9b814d;
filter: drop-shadow(0 0 18px rgba(155, 129, 77, 0.9));
}
@keyframes mapMarkerIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
.map-marker__pulse,
.map-marker__dot,
.map-marker__text {
pointer-events: none;
}
.map-marker {
pointer-events: auto;
}
.suppliers-map__svg-wrap path.is-supplier {
pointer-events: auto;
} .suppliers-map__card {
position: absolute;
right: 20px;
top: 50%;
z-index: 10;
width: 360px;
padding: 0;
border: 1px solid rgba(155, 129, 77, 0.34);
background:
linear-gradient(
180deg,
rgba(12, 12, 12, 0.58),
rgba(5, 5, 5, 0.68)
);
backdrop-filter: blur(18px);
box-shadow: 0 34px 100px rgba(0, 0, 0, 0.7);
opacity: 0;
transform: translateY(110px) scale(0.96);
pointer-events: none;
overflow: hidden;
transition:
opacity 0.75s ease,
transform 1.1s cubic-bezier(0.22, 1, 0.36, 1);
}
.suppliers-map__card.is-open {
opacity: 1;
transform: translateY(-50%) scale(1);
pointer-events: auto;
}
.suppliers-map__card-media {
height: 130px;
display: flex;
overflow: hidden;
border-bottom: 1px solid rgba(155, 129, 77, 0.18);
background: #111111;
}
.suppliers-map__card-photo {
position: relative;
flex: 1 1 50%;
width: 50%;
height: 100%;
min-width: 0;
overflow: hidden;
}
.suppliers-map__card-flag {
position: relative;
flex: 1 1 50%;
width: 50%;
height: 100%;
min-width: 0;
overflow: hidden;
border-left: 1px solid rgba(155, 129, 77, 0.28);
background: #0c0c0c;
}
.suppliers-map__card-photo img,
.suppliers-map__card-flag img {
width: 100%;
height: 100%;
object-fit: cover;
opacity: 1;
transform: scale(1.08);
transition: transform 1.1s ease;
}
.suppliers-map__card.is-open .suppliers-map__card-photo img,
.suppliers-map__card.is-open .suppliers-map__card-flag img {
transform: scale(1);
}
.suppliers-map__card-content {
padding: 24px 26px 26px;
}
.suppliers-map__card-label {
margin: 0 0 14px;
font-size: 10px;
line-height: 1;
letter-spacing: 0.24em;
text-transform: uppercase;
color: rgba(155, 129, 77, 0.84);
}
.suppliers-map__card h3 {
margin: 0 0 14px;
font-family: "Cormorant Garamond", Georgia, serif;
font-size: 38px;
font-weight: 600;
line-height: 0.9;
color: var(--color-white);
}
.suppliers-map__card p {
margin: 0 0 18px;
font-size: 13px;
line-height: 1.6;
color: rgba(245, 242, 236, 0.72);
}
.suppliers-map__card ul {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin: 0;
padding: 0;
list-style: none;
}
.suppliers-map__card li {
padding: 8px 12px;
border: 1px solid rgba(215, 193, 138, 0.38);
background: rgba(155, 129, 77, 0.08);
font-size: 10px;
line-height: 1;
font-weight: 600;
letter-spacing: 0.06em;
text-transform: uppercase;
color: rgba(255, 255, 255, 0.88);
text-shadow: 0 1px 10px rgba(0, 0, 0, 0.8);
}
.suppliers-map__card-link {
display: inline-flex;
align-items: center;
justify-content: center;
margin-top: 18px;
padding: 12px 22px;
border: 1px solid rgba(155, 129, 77, 0.5);
background: #9b814d;
font-size: 10px;
font-weight: 600;
letter-spacing: 0.14em;
text-transform: uppercase;
color: #050505;
text-decoration: none;
transition: background 0.35s ease, color 0.35s ease;
}
.suppliers-map__card-link:hover {
background: transparent;
color: #d7c18a;
} @media (max-width: 1200px) {
.suppliers-map {
padding-top: 110px;
padding-bottom: 120px;
}
.suppliers-map .container {
padding-left: 32px;
padding-right: 32px;
}
.suppliers-map__title {
font-size: 68px;
}
.suppliers-map__body {
min-height: 700px;
}
.suppliers-map__svg-wrap {
width: 100%;
}
.suppliers-map__card {
right: 18px;
width: 330px;
}
.suppliers-map__card-media {
height: 120px;
}
.suppliers-map__card h3 {
font-size: 34px;
}
.map-marker__text {
font-size: 11px;
letter-spacing: 1.5px;
}
} @media (max-width: 768px) {
.suppliers-map {
padding-top: 90px;
padding-bottom: 80px;
}
.suppliers-map .container {
width: 100%;
padding-left: 0;
padding-right: 0;
}
.suppliers-map__head {
width: calc(100% - 40px);
margin: 0 auto 44px;
}
.suppliers-map__title {
font-size: 48px;
line-height: 0.96;
}
.suppliers-map__body {
min-height: 0;
overflow: visible;
}
.suppliers-map__svg-wrap {
position: relative;
left: 50%;
top: auto;
width: 118%;
max-width: none;
height: 520px;
transform: translateX(-50%);
overflow: hidden;
}
.suppliers-map__svg-wrap svg {
width: 100%;
height: 100%;
object-fit: contain;
touch-action: manipulation;
}
.map-marker__pulse {
r: 13;
}
.map-marker__dot {
r: 5;
}
.map-marker__text {
display: block;
font-size: 11px;
letter-spacing: 0.8px;
stroke-width: 4px;
}
.suppliers-map__card {
position: relative;
left: auto;
right: auto;
top: auto;
bottom: auto;
width: calc(100% - 48px);
max-height: 0;
margin: 0 auto;
opacity: 0;
overflow: hidden;
transform: translateY(32px) scale(0.96);
transition:
opacity 0.65s ease,
max-height 0.8s ease,
margin 0.45s ease,
transform 0.9s cubic-bezier(0.22, 1, 0.36, 1);
}
.suppliers-map__card.is-open { margin-top: 24px;
padding-bottom: 12px;
opacity: 1;
transform: translateY(0) scale(1);
}
.suppliers-map__card-media {
height: 105px;
}
.suppliers-map__card-content {
padding: 20px 22px 22px;
}
.suppliers-map__card h3 {
font-size: 32px;
}
.suppliers-map__card p {
font-size: 13px;
margin-bottom: 14px;
}
} @media (max-width: 480px) {
.suppliers-map {
padding-top: 78px;
padding-bottom: 70px;
}
.suppliers-map__head {
width: calc(100% - 28px);
margin-bottom: 34px;
}
.suppliers-map__eyebrow {
letter-spacing: 0.16em;
}
.suppliers-map__title {
font-size: 40px;
line-height: 0.98;
}
.suppliers-map__svg-wrap {
width: 132%;
height: 430px;
}
.map-marker__pulse {
r: 11;
}
.map-marker__dot {
r: 4.5;
}
.map-marker__text {
display: block;
font-size: 11px;
letter-spacing: 0.5px;
stroke-width: 3.2px;
}
.suppliers-map__card {
width: calc(100% - 28px);
max-height: 0;
margin: 0 auto;
opacity: 0;
transform: translateY(28px) scale(0.96);
}
.suppliers-map__card.is-open {
max-height: 650px;
margin-top: 22px;
opacity: 1;
transform: translateY(0) scale(1);
}
.suppliers-map__card-media {
height: 132px;
}
.suppliers-map__card-content {
padding: 18px 18px 20px;
}
.suppliers-map__card h3 {
font-size: 30px;
}
.suppliers-map__card p {
font-size: 12px;
line-height: 1.5;
margin-bottom: 12px;
}
.suppliers-map__card li {
font-size: 8.5px;
padding: 7px 9px;
letter-spacing: 0.04em;
}
}  .partners {
position: relative;
overflow: hidden;
padding-top: 130px;
padding-bottom: 150px; }
.partners::before {
content: "";
position: absolute;
inset: 0;
background-image:
linear-gradient(rgba(255, 255, 255, 0.018) 1px, transparent 1px),
linear-gradient(90deg, rgba(255, 255, 255, 0.018) 1px, transparent 1px);
background-size: 80px 80px;
opacity: 0.28;
pointer-events: none;
}
.partners::after {
display: none;
}
.partners__container {
position: relative;
z-index: 1;
max-width: 1320px;
margin: 0 auto;
padding-left: 40px;
padding-right: 40px;
overflow: hidden;
}
.partners__head {
max-width: 900px;
margin-bottom: 76px;
}
.partners__eyebrow {
position: relative;
width: fit-content;
margin: 0 0 28px;
padding-bottom: 14px;
font-size: 11px;
line-height: 1;
letter-spacing: 0.26em;
text-transform: uppercase;
color: rgba(155, 129, 77, 0.82);
}
.partners__eyebrow::after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 140px;
height: 1px;
background: linear-gradient(
90deg,
rgba(155, 129, 77, 0.95),
rgba(155, 129, 77, 0.18),
transparent
);
}
.partners__title {
margin: 0;
font-family: "Cormorant Garamond", Georgia, serif;
font-size: 64px;
font-weight: 500;
line-height: 0.92;
letter-spacing: -0.045em;
}
.partners__title span {
display: block;
}
.partners__title span:first-child {
color: var(--color-white);
}
.partners__title span:last-child {
color: #9b814d;
}
.partners__text {
max-width: 640px;
margin: 32px 0 0;
font-size: 16px;
line-height: 1.7;
color: rgba(245, 242, 236, 0.66);
}
.partners__marquee {
position: relative;
width: 100%;
display: grid;
gap: 22px;
overflow: hidden;
padding: 8px 0;
cursor: grab;
touch-action: pan-y;
user-select: none;
}
.partners__marquee.is-dragging {
cursor: grabbing;
}
.partners__marquee::before,
.partners__marquee::after {
content: "";
position: absolute;
top: 0;
z-index: 4;
width: 160px;
height: 100%;
pointer-events: none;
}
.partners__marquee::before {
left: 0;
background: linear-gradient(90deg, #050505 0%, rgba(5, 5, 5, 0) 100%);
}
.partners__marquee::after {
right: 0;
background: linear-gradient(270deg, #050505 0%, rgba(5, 5, 5, 0) 100%);
}
.partners__track {
display: flex;
width: max-content;
will-change: transform;
}
.partners__group {
display: flex;
flex-shrink: 0;
gap: 22px;
padding-right: 22px;
}
.partners__track--left {
animation: partnersMoveLeft 34s linear infinite;
}
.partners__track--right {
animation: partnersMoveRight 38s linear infinite;
}
.partners__marquee:hover .partners__track {
animation-play-state: paused;
}
.partners__logo {
width: 230px;
height: 124px;
flex: 0 0 230px;
display: flex;
align-items: center;
justify-content: center;
padding: 28px;
border: 1px solid rgba(155, 129, 77, 0.16);
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0.01)),
rgba(10, 10, 10, 0.74);
box-shadow:
inset 0 0 30px rgba(155, 129, 77, 0.025),
0 16px 50px rgba(0, 0, 0, 0.18);
overflow: hidden;
transition:
border-color 0.35s ease,
background 0.35s ease,
transform 0.35s ease;
}
.partners__logo img {
max-width: 170px;
max-height: 70px;
width: auto;
height: auto;
object-fit: contain;
pointer-events: none;
-webkit-user-drag: none; opacity: 0.78;
transition:
filter 0.4s ease,
opacity 0.4s ease,
transform 0.4s ease;
}
.partners__logo:hover {
transform: translateY(-4px);
border-color: rgba(155, 129, 77, 0.42);
background:
radial-gradient(circle at 50% 50%, rgba(155, 129, 77, 0.11), transparent 62%),
rgba(12, 12, 12, 0.88);
}
.partners__logo:hover img {
filter: none;
opacity: 1;
transform: scale(1.04);
}
@keyframes partnersMoveLeft {
from {
transform: translateX(0);
}
to {
transform: translateX(-50%);
}
}
@keyframes partnersMoveRight {
from {
transform: translateX(-50%);
}
to {
transform: translateX(0);
}
} @media (max-width: 768px) {
.partners {
padding-top: 90px;
padding-bottom: 90px;
}
.partners__container {
max-width: 100%;
padding-left: 0;
padding-right: 0;
}
.partners__head {
width: calc(100% - 40px);
max-width: 900px;
margin: 0 auto 50px;
}
.partners__title {
font-size: 48px;
line-height: 0.96;
}
.partners__text {
max-width: 560px;
font-size: 14px;
}
.partners__marquee {
gap: 16px;
}
.partners__marquee::before,
.partners__marquee::after {
width: 70px;
}
.partners__group {
gap: 16px;
padding-right: 16px;
}
.partners__logo {
width: 180px;
height: 104px;
flex-basis: 180px;
padding: 22px;
}
.partners__logo img {
max-width: 132px;
max-height: 58px;
}
} @media (max-width: 480px) {
.partners {
padding-top: 78px;
padding-bottom: 80px;
}
.partners__head {
width: calc(100% - 28px);
margin-bottom: 40px;
}
.partners__eyebrow {
font-size: 9px;
letter-spacing: 0.16em;
}
.partners__title {
font-size: 40px;
line-height: 0.98;
}
.partners__text {
margin-top: 24px;
font-size: 13px;
line-height: 1.65;
}
.partners__marquee {
gap: 14px;
}
.partners__marquee::before,
.partners__marquee::after {
width: 42px;
}
.partners__group {
gap: 14px;
padding-right: 14px;
}
.partners__logo {
width: 148px;
height: 88px;
flex-basis: 148px;
padding: 18px;
}
.partners__logo img {
max-width: 112px;
max-height: 48px;
}
}