@font-face {
  font-family: "Open Sans";
  src: url("assets/fonts/open_sans/OpenSans-Regular.woff") format("woff");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Open Sans";
  src: url("assets/fonts/open_sans/OpenSans-SemiBold.woff") format("woff");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}

@font-face {
  font-family: "Open Sans";
  src: url("assets/fonts/open_sans/OpenSans-Bold.woff") format("woff");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: "Open Sans";
  src: url("assets/fonts/open_sans/OpenSans-Italic.woff") format("woff");
  font-style: italic;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Open Sans";
  src: url("assets/fonts/open_sans/OpenSans-ExtraBold.woff") format("woff");
  font-style: normal;
  font-weight: 800;
  font-display: swap;
}

@font-face {
  font-family: "Alumni Sans";
  src: url("assets/fonts/alumni_sans/fonts/webfonts/AlumniSans-SemiBold.woff2") format("woff2");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}

:root {
  --color-background-default: #f8f2f2;
  --color-text-title: #000;
  --color-text-primary: #303030;
  --color-text-inverse: #f8f2f2;
  --color-accent-primary: #892dff;
  --color-action-primary: #6a1cae;
  --radius-button: 60px;
  --motion-duration: 1200ms;
  --gallery-motion-duration: 2400ms;
  --motion-easing: cubic-bezier(.22, 1, .36, 1);
}

* { box-sizing: border-box; }
html { overflow-x: clip; scroll-behavior: auto; }
body { margin: 0; overflow-x: clip; background: var(--color-background-default); color: var(--color-text-primary); font-family: "Open Sans", Arial, sans-serif; }
button, a { font: inherit; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; }
img { display: block; }

.desktop-page { width: 100%; min-width: 0; max-width: 1440px; margin-inline: auto; overflow: visible; }

/* Keep the 1440 px composition centered while every section background fills the viewport. */
.header,
.hero,
.business-value,
.case-section,
.about,
.process-strategy,
.process-production {
  border-image: conic-gradient(var(--color-background-default) 0 0) fill 0 / / 0 100vw;
}
.product-benefits,
.gallery,
.case-section--warm,
.services-intro {
  border-image: conic-gradient(#ffefa4 0 0) fill 0 / / 0 100vw;
}
.cases-intro,
.pricing,
.free-sample,
.process-design,
.final-cta,
.footer {
  border-image: conic-gradient(#303030 0 0) fill 0 / / 0 100vw;
}

.header {
  position: sticky;
  z-index: 1000;
  top: 0;
  width: 100%;
  height: 82px;
  padding: 12px 100px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--color-background-default);
}

.header__left, .header__right, .menu { display: flex; align-items: center; }
.header__left, .header__right { gap: 48px; }
.logo { width: 151.723px; height: 49px; flex: none; }
.logo img { width: 100%; height: 100%; }
.menu { gap: 40px; color: var(--color-text-title); font-size: 16px; line-height: 1.2; white-space: nowrap; }
.menu a { position: relative; padding-bottom: 4px; transition: color var(--motion-duration) var(--motion-easing); }
.menu a::after { content: ""; position: absolute; right: 0; bottom: 0; left: 0; height: 1.5px; background: #892dff; transform: scaleX(0); transform-origin: left; transition: transform var(--motion-duration) var(--motion-easing); }
.menu a:hover, .menu a.is-active { color: #892dff; }
.menu a.is-active::after { transform: scaleX(1); }
.menu a:focus-visible { color: #892dff; outline: 2px solid #892dff; outline-offset: 5px; }
.menu a:focus-visible::after { transform: scaleX(1); }
.header__phone { position: relative; color: var(--color-text-primary); font-size: 24px; font-weight: 800; line-height: 1.5; letter-spacing: .72px; white-space: nowrap; transition: color var(--motion-duration) var(--motion-easing); }
/* Модуль телефонов Метрики (tag_phone.js) оборачивает цифры в small с opacity→0,
   но подменного номера у счётчика нет — номер оставался полускрытым. Не даём прятать. */
.header__phone small, .footer__contacts small { opacity: 1 !important; }
.header__phone::after { content: ""; position: absolute; right: 0; bottom: 1px; left: 0; height: 2px; background: var(--color-accent-primary); transform: scaleX(0); transform-origin: left; transition: transform var(--motion-duration) var(--motion-easing); }
.header__phone:hover,
.header__phone:focus-visible { color: var(--color-accent-primary); }
.header__phone:hover::after,
.header__phone:focus-visible::after { transform: scaleX(1); }
.header__phone:focus-visible { outline: 2px solid #892dff; outline-offset: 4px; }

.button {
  border: 0;
  border-radius: var(--radius-button);
  background: var(--color-action-primary);
  color: var(--color-text-inverse);
  display: flex;
  align-items: center;
  justify-content: center;
  text-transform: uppercase;
  font-weight: 800;
  white-space: nowrap;
  transition: background-color 1200ms cubic-bezier(.22, 1, .36, 1), color 1200ms cubic-bezier(.22, 1, .36, 1), box-shadow 1200ms cubic-bezier(.22, 1, .36, 1);
}

.button__icons { position: relative; display: block; flex: none; }
.button__icons--header { width: 24px; height: 24px; }
.button__icons--hero { width: 32px; height: 32px; }
.button__icon { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; transition: opacity 1200ms cubic-bezier(.22, 1, .36, 1); }
.button__icon--hover { opacity: 0; }
.button:hover .button__icons,
.button:focus-visible .button__icons { animation: button-arrow-drift var(--motion-duration) ease-in-out infinite alternate; }

@keyframes button-arrow-drift {
  from { transform: translateX(0); }
  to { transform: translateX(5px); }
}
.button:hover { background-color: #ffefa4; color: #303030; }
.button--hero:hover { box-shadow: 0 8px 20px rgba(106, 28, 174, .18); }
.button:hover .button__icon--default { opacity: 0; }
.button:hover .button__icon--hover { opacity: 1; }
.button:focus-visible { outline: 3px solid #892dff; outline-offset: 3px; }
.button--header { height: 58px; gap: 4px; padding: 16px 40px 16px 32px; font-size: 16px; line-height: 1.5; letter-spacing: .16px; }
.button--header { background: #ffefa4; color: #303030; }
.button--header:hover { background: #6a1cae; color: #f8f2f2; box-shadow: none; }

.hero {
  position: relative;
  width: 100%;
  height: 1129px;
  background: var(--color-background-default);
  overflow: hidden;
}

.hero__heading { position: absolute; top: 60px; left: 50%; width: 603px; transform: translateX(-50%); text-align: center; }
.hero__heading h1 { margin: 0; color: var(--color-text-title); font-family: "Alumni Sans", sans-serif; font-size: 128px; font-weight: 600; line-height: .8; text-transform: uppercase; }
.hero__heading p { margin: 16px 0 0; color: var(--color-text-title); font-size: 32px; font-weight: 600; line-height: 1.5; white-space: nowrap; }
.hero__price { position: relative; color: var(--color-accent-primary); }
.hero__price img { position: absolute; z-index: 1; left: -5px; top: 42px; width: 164.8px; height: 8px; object-fit: fill; }

.hero__phone { position: absolute; top: 284px; left: 50%; width: 374px; height: 788px; transform: translateX(-50%); object-fit: cover; }
.hero__left-cards { position: absolute; top: 463px; left: calc(50% - 604px); width: 255px; display: flex; flex-direction: column; align-items: center; gap: 100px; }
.hero-card { position: relative; display: flex; flex-direction: column; align-items: center; gap: 16px; text-align: center; font-size: 20px; font-weight: 600; line-height: 1.2; white-space: nowrap; }
.hero-card p { margin: 0; }
.hero-card strong { color: var(--color-accent-primary); font-weight: 600; }
.hero-card__icon { width: 60px; height: 60px; }
.hero-card__arrow { position: absolute; width: 170px; height: auto; object-fit: contain; }
.hero-card--money .hero-card__arrow { top: -27px; left: 201px; transform: rotate(12.19deg); }
.hero-card--discount { width: 255px; }
.hero-card--discount .hero-card__arrow { top: -61px; left: 174px; transform: rotate(-9.4deg); }
.hero-card--sales { position: absolute; top: 590px; left: calc(50% + 289px); }
.hero-card--sales .hero-card__arrow { top: -61px; left: -73px; transform: scaleY(-1) rotate(-170.6deg); }

.button--hero { position: absolute; z-index: 2; top: 871px; left: 50%; height: 69px; padding: 16px 60px; transform: translateX(-50%); gap: 8px; font-size: 24px; line-height: 1.5; letter-spacing: .72px; }

.product-benefits { position: relative; width: 100%; height: 570px; padding: 60px 100px 100px; display: flex; flex-direction: column; align-items: center; gap: 48px; background: #ffefa4; overflow: visible; }
.section-caption { margin: 0; color: #303030; font-size: 32px; font-style: italic; font-weight: 400; line-height: 1.5; text-transform: uppercase; opacity: .6; }
.product-benefits__title { margin: -24px 0 0; width: 729px; color: #303030; font-family: "Open Sans", Arial, sans-serif; font-size: 32px; font-weight: 700; line-height: 1.2; text-align: center; text-transform: uppercase; }
.product-benefits__title span { color: #892dff; }
.product-benefits__cards { width: 1240px; margin-top: 0; display: grid; grid-template-columns: repeat(4, 292px); gap: 24px; }
.benefit-card { height: 176px; padding: 24px 48px 40px; display: flex; flex-direction: column; align-items: center; gap: 4px; border-radius: 32px; background: #303030; color: #f8f2f2; overflow: hidden; }
.benefit-card img { width: 60px; height: 60px; object-fit: contain; }
.benefit-card p { margin: 0; font-size: 20px; font-weight: 400; line-height: 1.2; letter-spacing: .2px; text-align: center; white-space: nowrap; }
.product-benefits__accent { position: absolute; z-index: 2; left: calc(50% - 23px); top: 468px; width: 532.611px; min-height: 89.26px; margin: 0; padding: 16px 80px; display: flex; align-items: center; justify-content: center; transform: translateX(-50%) rotate(-1deg); border-radius: 32px; background: #892dff; color: #f8f2f2; font-size: 20px; font-weight: 700; line-height: 1.2; text-align: center; text-transform: uppercase; }

.gallery { position: relative; width: 100%; height: 708px; padding: 60px 0 100px; display: flex; flex-direction: column; align-items: center; gap: 40px; background: #ffefa4; overflow: visible; }
.gallery__slider { position: relative; width: 100%; height: 460px; flex: none; }
.gallery__viewport { position: absolute; inset: 0; overflow: visible; cursor: grab; touch-action: pan-y; }
.gallery__viewport:active { cursor: grabbing; }
.gallery__track { position: absolute; inset: 0; }
.gallery__image { position: absolute; top: 0; left: 50%; width: 864px; height: 460px; border-radius: 40px; object-fit: cover; object-position: center; opacity: 0; filter: blur(4.7px); transform: translate3d(-50%, 0, 0); transform-origin: center; pointer-events: none; will-change: transform, opacity, filter; }
.gallery__slider.is-ready .gallery__image { transition: transform var(--gallery-motion-duration) var(--motion-easing), opacity var(--gallery-motion-duration) var(--motion-easing), filter var(--gallery-motion-duration) var(--motion-easing); }
.gallery__image.is-active { z-index: 2; opacity: 1; filter: none; pointer-events: auto; }
.gallery__image.is-previous,
.gallery__image.is-next { z-index: 1; opacity: .6; filter: blur(4.7px); }
.gallery__control { position: absolute; z-index: 3; top: 50%; width: 58px; height: 58px; padding: 0; border: 0; border-radius: 50%; background: transparent; transform: translateY(-50%); }
.gallery__control:hover { transform: translateY(-50%); }
.gallery__control:focus-visible { outline: 3px solid #892dff; outline-offset: 4px; }
.gallery__control-icon { position: absolute; inset: 0; width: 58px; height: 58px; object-fit: contain; transition: opacity var(--motion-duration) var(--motion-easing); }
.gallery__control-icon--hover { opacity: 0; }
.gallery__control:hover .gallery__control-icon--default { opacity: 0; }
.gallery__control:hover .gallery__control-icon--hover { opacity: 1; }
.gallery__control--previous { left: calc(50% - 514px); }
.gallery__control--next { right: calc(50% - 514px); }

.business-value { width: 100%; min-height: 1197px; padding: 100px 100px 80px; display: flex; align-items: flex-start; justify-content: space-between; background: var(--color-background-default); }
.business-value__heading { position: relative; width: 524px; flex: none; }
.business-value__heading h2 { width: 420px; margin: 0; color: #303030; font-family: "Alumni Sans", sans-serif; font-size: 80px; font-weight: 600; line-height: .8; text-transform: uppercase; }
.business-value__arrow { position: absolute; top: 121px; left: 316px; width: 207.689px; height: 120.713px; display: flex; align-items: center; justify-content: center; }
.business-value__arrow img { width: 197px; height: 66px; object-fit: contain; transform: rotate(-17deg); transform-origin: center; }
.business-value__cards { width: 606px; display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }
.value-card { position: relative; width: 606px; display: flex; flex-direction: column; align-items: flex-start; }
.value-card__title { width: 606px; height: 213px; margin-bottom: -70px; padding-top: 32px; display: flex; align-items: flex-start; justify-content: center; border-radius: 32px; background: #303030; }
.value-card__title h3 { margin: 0; color: #f8f2f2; font-size: 20px; font-weight: 600; line-height: 1.2; text-align: center; }
.value-card__description { width: 606px; min-height: 180px; padding: 60px 32px 32px; display: flex; align-items: flex-end; justify-content: center; border-radius: 32px; background: #ffefa4; }
.value-card__description p { width: 542px; margin: 0; color: #303030; font-size: 18px; font-weight: 400; line-height: 1.2; text-align: center; }
.value-card__sticker { position: absolute; z-index: 2; left: 50%; object-fit: contain; transform: translateX(-50%); }
.value-card__sticker--loyalty { top: 86px; width: 126px; height: 122px; }
.value-card__sticker--apsel { top: 55px; width: 159px; height: 160px; }
.value-card__sticker--uniqueness { top: 66px; width: 121px; height: 139px; }

.cases-intro { position: relative; width: 100%; height: 474.379px; padding: 60px 100px 80px; display: flex; flex-direction: column; align-items: center; gap: 16px; background: #303030; overflow: hidden; }
.cases-intro__heading { width: 586px; height: 226px; display: flex; flex-direction: column; align-items: center; gap: 24px; text-align: center; text-transform: uppercase; }
.cases-intro__caption { width: 100%; color: #f8f2f2; }
.cases-intro__heading h2 { width: 586px; margin: 0; color: #ffefa4; font-family: "Alumni Sans", sans-serif; font-size: 96px; font-weight: 600; line-height: .8; text-align: center; text-transform: uppercase; }
.cases-intro__feature { position: relative; z-index: 2; width: 711.288px; height: 92.379px; display: flex; align-items: center; justify-content: center; }
.cases-intro__feature > div { padding: 16px 80px; display: flex; align-items: center; justify-content: center; border-radius: 32px; background: #892dff; transform: rotate(1deg); }
.cases-intro__feature p { margin: 0; color: #f8f2f2; font-size: 20px; font-weight: 700; line-height: 1.2; text-align: center; text-transform: uppercase; white-space: nowrap; }
.cases-intro__image { position: absolute; object-fit: contain; }
.cases-intro__image--left { top: 91px; left: 120px; width: 240px; height: 289px; }
.cases-intro__image--right { top: 107px; right: 120px; width: 240px; height: 257px; }

.case-section { position: relative; width: 100%; height: 701.384px; background: var(--color-background-default); overflow: hidden; }
.case-number { position: absolute; top: 80px; left: 101.98px; min-width: 194px; height: 52px; margin: 0; padding: 8px 40px; border-radius: 60px; background: #ffefa4; box-shadow: 3px 3px 9.4px rgba(151, 71, 255, .25); color: #303030; font-size: 24px; font-weight: 700; line-height: 1.5; letter-spacing: .72px; text-align: center; text-transform: uppercase; white-space: nowrap; }
.case-section__arrow { position: absolute; top: 142.86px; left: 204.98px; width: 146.169px; height: 66.166px; display: flex; align-items: center; justify-content: center; }
.case-section__arrow img { width: 146.169px; height: 66.166px; object-fit: contain; }
.case-quote-card { position: absolute; top: 225.48px; left: 204.98px; width: 368.036px; display: flex; flex-direction: column; align-items: center; }
.case-quote-card__body { position: relative; width: 368.036px; height: 355.37px; margin: 0 0 -30px; padding: 100px 32px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; border-radius: 32px; background: #303030; color: #f8f2f2; text-align: center; transform: rotate(-1deg); }
.case-quote-card__body p { width: 298px; margin: 0; font-size: 16px; font-weight: 400; line-height: 1.2; }
.case-quote-card__body cite { font-size: 16px; font-style: italic; font-weight: 400; line-height: 1.2; white-space: nowrap; }
.case-quote-card__quote { position: absolute; width: 48px; height: 38px; object-fit: contain; }
.case-quote-card__quote--left { top: 32px; left: 32px; }
.case-quote-card__quote--right { right: 32px; bottom: 32px; transform: rotate(180deg); }
.button--case { position: relative; z-index: 2; height: 58px; padding: 16px 40px 16px 32px; gap: 4px; font-size: 16px; line-height: 1.5; letter-spacing: .16px; transform: rotate(3deg); }
.case-details { position: absolute; top: 80px; left: 753.02px; width: 584.997px; display: flex; flex-direction: column; align-items: flex-start; gap: 48px; }
.case-details__heading { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.case-details__heading h2 { margin: 0; color: #000; font-family: "Alumni Sans", sans-serif; font-size: 96px; font-weight: 600; line-height: .8; text-transform: uppercase; white-space: nowrap; }
.case-details__heading h3 { margin: 0 0 4px; color: #303030; font-size: 20px; font-weight: 600; line-height: 1.2; text-transform: uppercase; }
.case-details__heading h3 span, .case-result strong { color: #892dff; font-weight: 600; }
.case-details__heading > p { width: 496px; margin: 0; color: rgba(48,48,48,.7); font-size: 16px; font-weight: 400; line-height: 1.2; }
.case-results { width: 584.997px; display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.case-results > h3 { margin: 0; color: #000; font-family: "Alumni Sans", sans-serif; font-size: 48px; font-weight: 600; line-height: .8; text-transform: uppercase; }
.case-results__list { width: 100%; display: flex; flex-direction: column; gap: 12px; }
.case-result { min-height: 48px; display: flex; align-items: center; gap: 32px; color: #303030; }
.case-result__number { width: 36px; flex: none; color: rgba(48,48,48,.6); font-size: 32px; font-style: italic; font-weight: 400; line-height: 1.5; }
.case-result p { margin: 0; font-size: 16px; font-weight: 600; line-height: 1.3; }
.case-result__divider { width: 584.997px; height: 2.035px; object-fit: fill; opacity: .3; }

.case-section--warm { background: #ffefa4; }
.case-number--light { background: #f8f2f2; }
.case-beauty .case-number { top: 80px; left: 103.16px; }
.case-epilation .case-number { left: 93.24px; }
.case-section__arrow--beauty { top: 146.86px; left: 209.16px; }
.case-section__arrow--epilation { top: 150.82px; left: 177.24px; }
.case-quote-card__body--beauty, .case-quote-card__body--epilation { position: absolute; left: 215.9px; margin: 0; transform: rotate(1deg); }
.case-quote-card__body--beauty { top: 264.52px; width: 368.699px; height: 393.259px; }
.case-quote-card__body--epilation { top: 265px; left: 205.32px; width: 368.036px; height: 355.265px; }
.case-quote-card__body--beauty cite { text-align: center; }
.case-details--beauty, .case-details--epilation { top: 80px; gap: 40px; }
.case-details--beauty { left: 757.84px; width: 578.997px; }
.case-details--epilation { left: 747.26px; width: 599.497px; }
.case-details--beauty .case-results, .case-details--epilation .case-results { width: 578.997px; }
.case-details--beauty .case-details__heading { width: 505px; }
.case-details--epilation .case-details__heading { width: 599.497px; }
.case-beauty, .case-epilation { height: 767.042px; }
.case-beauty .case-result__divider, .case-epilation .case-result__divider { width: 578.997px; height: 2.014px; }

.pricing { width: 100%; height: 1041.329px; padding: 60px 100px; display: flex; flex-direction: column; align-items: center; background: #303030; }
.pricing__heading { width: 535.175px; height: 331.329px; flex: none; display: flex; flex-direction: column; align-items: center; gap: 24px; }
.pricing__title { width: 466px; height: 226px; display: flex; flex-direction: column; align-items: center; gap: 24px; text-align: center; text-transform: uppercase; }
.pricing__caption { width: 100%; color: #f8f2f2; }
.pricing__title h2 { margin: 0; color: #ffefa4; font-family: "Alumni Sans", sans-serif; font-size: 96px; font-weight: 600; line-height: .8; text-transform: uppercase; }
.pricing__feature { width: 535.175px; height: 81.329px; display: flex; align-items: center; justify-content: center; padding: 24px 80px; border-radius: 32px; background: #892dff; transform: rotate(-1deg); }
.pricing__feature p { margin: 0; color: #f8f2f2; font-size: 20px; font-weight: 700; line-height: 1.2; text-align: center; text-transform: uppercase; white-space: nowrap; }
.pricing__card { width: 1240px; height: 590px; display: flex; flex-direction: column; align-items: flex-start; gap: 80px; }
.pricing__main { height: 416px; display: flex; align-items: center; gap: 172px; }
.pricing__rows { width: 578.997px; display: flex; flex-direction: column; gap: 12px; }
.pricing__row { width: 100%; height: 24px; padding-right: 8px; display: flex; align-items: center; justify-content: space-between; color: #f8f2f2; font-size: 20px; line-height: 1.2; white-space: nowrap; }
.pricing__row span { letter-spacing: .2px; }
.pricing__row strong { color: #ffefa4; font-weight: 600; }
.pricing__line { width: 100%; height: 2px; flex: none; border-top: 2px solid rgba(248,242,242,.3); transform: rotate(-.2deg); }
.pricing__sample { position: relative; width: 395px; height: 416px; flex: none; }
.pricing__sample-image { position: absolute; top: 0; left: 42px; width: 334px; height: 326px; object-fit: cover; }
.pricing__sample-note { position: absolute; left: 0; bottom: 0; width: 395px; height: 140px; padding: 32px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; border-radius: 32px; background: #ffefa4; color: #303030; font-size: 20px; line-height: 1.2; text-align: center; white-space: nowrap; }
.pricing__sample-note p { margin: 0; letter-spacing: .2px; }
.pricing__sample-note strong { font-weight: 700; }
.pricing__benefits { width: 1240px; height: 94px; padding: 0 100px; display: flex; align-items: center; justify-content: center; gap: 64px; }
.pricing-benefit { position: relative; height: 94px; padding: 40px 80px 16px; display: flex; align-items: center; justify-content: center; border-radius: 32px; background: #892dff; color: #f8f2f2; }
.pricing-benefit img { position: absolute; top: -19px; left: 50%; width: 48px; height: 48px; transform: translateX(-50%); }
.pricing-benefit p { margin: 0; font-size: 16px; line-height: 1.2; text-align: center; white-space: nowrap; }

.free-sample { width: 100%; height: 600px; padding: 80px 100px; display: flex; align-items: center; justify-content: center; gap: 140px; background: #303030; }
.free-sample__description { width: 493px; height: 440px; display: flex; flex-direction: column; align-items: flex-start; gap: 40px; }
.free-sample__heading { position: relative; width: 493px; height: 256px; display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.free-sample__heading h2 { width: 493px; margin: 0; color: #f8f2f2; font-family: "Alumni Sans", sans-serif; font-size: 80px; font-weight: 600; line-height: .8; text-transform: uppercase; }
.free-sample__heading > p { margin: 0; color: rgba(248,242,242,.6); font-size: 20px; font-weight: 600; line-height: 1.2; white-space: nowrap; }
.free-sample__arrow { position: absolute; z-index: 1; top: 133.21px; left: 368px; width: 197.405px; height: 79.566px; object-fit: contain; }
.free-sample__list { margin: 0; padding: 0; display: flex; flex-direction: column; gap: 24px; list-style: none; }
.free-sample__list li { height: 32px; display: flex; align-items: center; gap: 24px; color: #ffefa4; font-size: 16px; line-height: 1.2; white-space: nowrap; }
.free-sample__list img { width: 32px; height: 32px; flex: none; }
.social-card { width: 594px; height: 326px; padding: 40px 32px; display: flex; flex-direction: column; align-items: center; gap: 32px; border-radius: 32px; background: #ffefa4; }
.social-card h3 { margin: 0; color: #303030; font-size: 32px; font-weight: 700; line-height: 1.2; text-align: center; text-transform: uppercase; }
.social-card__buttons { width: 530px; display: flex; flex-direction: column; gap: 16px; }
.social-button { position: relative; isolation: isolate; width: 530px; height: 48px; padding: 12px 80px; display: flex; align-items: center; justify-content: center; overflow: hidden; border-radius: 60px; color: #f8f2f2; font-size: 20px; font-weight: 700; line-height: 1.2; text-decoration: none; text-transform: uppercase; transition: color 1200ms cubic-bezier(.22,1,.36,1); }
.social-button::before { content: ""; position: absolute; z-index: -1; inset: -2px; border-radius: inherit; background: #f8f2f2; opacity: 0; transition: opacity 1200ms cubic-bezier(.22,1,.36,1); }
.social-button:hover::before { opacity: 1; }
.social-button__label { position: relative; z-index: 1; }
.social-button__icon { position: absolute; z-index: 1; left: 80px; }
.social-button__icon img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; transition: opacity 1200ms cubic-bezier(.22,1,.36,1); }
.social-button__icon-hover { opacity: 0; }
.social-button:hover .social-button__icon-default { opacity: 0; }
.social-button:hover .social-button__icon-hover { opacity: 1; }
.social-button--vk { background: #07f; }
.social-button--vk:hover { color: #07f; }
.social-button--vk .social-button__icon { width: 29px; height: 18px; top: 14.38px; }
.social-button--telegram { background: #00b0f2; }
.social-button--telegram:hover { color: #00b0f2; }
.social-button--telegram .social-button__icon { width: 24px; height: 21px; top: 13.5px; }
.social-button--max { background: linear-gradient(94.43deg, #3391ff 0%, #9b40dd 99.963%); }
.social-button--max:hover { color: #07f; }
.social-button--max .social-button__icon { width: 25px; height: 25px; top: 11px; }
.social-button:focus-visible { outline: 3px solid #892dff; outline-offset: 3px; }

.about { width: 100%; height: 821.066px; padding: 60px 131px 80px; display: flex; flex-direction: column; align-items: center; gap: 40px; background: #f8f2f2; }
.about__company { width: 1177.193px; height: 565.066px; display: flex; flex-direction: column; align-items: center; gap: 132px; }
.about__heading { height: 149px; display: flex; flex-direction: column; align-items: center; gap: 24px; text-align: center; text-transform: uppercase; white-space: nowrap; }
.about__heading h2 { margin: 0; color: #000; font-family: "Alumni Sans", sans-serif; font-size: 96px; font-weight: 600; line-height: .8; }
.about__cards { width: 1177.193px; height: 284.066px; display: flex; align-items: center; justify-content: center; gap: 80px; }
.about-card-wrap { width: 327.596px; height: 284.066px; display: flex; align-items: center; justify-content: center; flex: none; }
.about-card-wrap--left .about-card { transform: rotate(-3deg); }
.about-card-wrap--right { width: 326.597px; height: 284.014px; }
.about-card-wrap--right .about-card { transform: rotate(3deg); }
.about-card { position: relative; min-width: 315px; height: 273px; padding: 100px 32px 32px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; border-radius: 32px; background: #ffefa4; color: #303030; text-align: center; }
.about-card--center { width: 363px; flex: none; }
.about-card > img { position: absolute; top: -92px; left: 50%; width: 172px; height: 172px; object-fit: cover; transform: translateX(-50%); }
.about-card h3 { margin: 0; font-size: 20px; font-weight: 600; line-height: 1.2; white-space: nowrap; }
.about-card p { margin: 0; font-size: 16px; font-weight: 400; line-height: 1.2; white-space: nowrap; }
.about__closing { height: 76px; margin: 0; color: #303030; font-size: 32px; font-weight: 700; line-height: 1.2; text-align: center; text-transform: uppercase; white-space: nowrap; }
.about__closing strong { color: #892dff; font-weight: 700; }

.services-intro { width: 100%; height: 388.407px; padding: 60px 0; display: flex; flex-direction: column; align-items: center; gap: 24px; background: #ffefa4; }
.services-intro h2 { height: 154px; margin: 0; color: #000; font-family: "Alumni Sans", sans-serif; font-size: 96px; font-weight: 600; line-height: .8; text-align: center; text-transform: uppercase; white-space: nowrap; }
.services-intro__feature { width: 598.305px; height: 90.407px; padding: 16px 80px; display: flex; align-items: center; justify-content: center; border-radius: 32px; background: #892dff; transform: rotate(-1deg); }
.services-intro__feature p { margin: 0; color: #f8f2f2; font-size: 20px; font-weight: 700; line-height: 1.2; text-align: center; text-transform: uppercase; white-space: nowrap; }

.process-strategy { width: 100%; height: 792px; padding: 60px 100px 80px; display: flex; flex-direction: column; align-items: center; gap: 24px; background: #f8f2f2; }
.process-number { height: 96px; margin: 0; color: rgba(48,48,48,.6); font-size: 64px; font-style: italic; font-weight: 600; line-height: 1.5; text-transform: uppercase; white-space: nowrap; }
.process-strategy > .process-number { width: 1240px; }
.process-strategy__content { width: 1240px; height: 532px; display: flex; align-items: flex-start; justify-content: center; gap: 100px; }
.process-strategy__heading { position: relative; width: 556px; flex: none; display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }
.process-strategy__heading h2 { margin: 0; color: #000; font-family: "Alumni Sans", sans-serif; font-size: 80px; font-weight: 600; line-height: .8; text-transform: uppercase; white-space: nowrap; }
.process-strategy__heading > p { width: 400px; margin: 0; color: rgba(48,48,48,.7); font-size: 18px; line-height: 1.2; }
.process-strategy__arrow { position: absolute; top: 201.41px; left: 449.75px; width: 148.339px; height: 96.397px; object-fit: contain; }
.process-strategy__right { position: relative; width: 589px; height: 532px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 8px; }
.process-strategy__description { width: 575px; height: 256px; display: flex; align-items: center; justify-content: center; gap: 40px; }
.process-strategy__info { width: 350px; height: 256px; display: flex; flex-direction: column; align-items: flex-start; gap: 32px; }
.process-strategy__tickets { width: 300px; display: flex; flex-direction: column; gap: 16px; }
.process-strategy__tickets h3 { margin: 0; color: #303030; font-size: 20px; font-weight: 600; line-height: 1.2; }
.process-strategy__tickets ul { margin: 0; padding: 0; display: flex; flex-direction: column; gap: 16px; list-style: none; }
.process-strategy__tickets li { min-height: 28px; display: flex; align-items: center; gap: 24px; color: #303030; font-size: 16px; line-height: 1.2; white-space: nowrap; }
.process-strategy__tickets li img { width: 28px; height: 28px; flex: none; }
.process-strategy__info > p { margin: 0; color: #303030; font-size: 20px; font-weight: 600; line-height: 1.2; white-space: nowrap; }
.process-strategy__image { width: 185px; height: 138px; object-fit: cover; }
.process-strategy__teaser { width: 589px; height: 148px; padding: 32px 80px; display: flex; align-items: center; justify-content: center; border-radius: 32px; background: #303030; color: #f8f2f2; text-align: center; transform: rotate(-3deg); }
.process-strategy__teaser p { margin: 0; font-size: 20px; line-height: 1.2; letter-spacing: .2px; white-space: nowrap; }
.process-strategy__teasers { width: 595.31px; display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }
.process-strategy__result { margin: 0; color: #303030; font-size: 32px; font-weight: 700; line-height: 1.2; text-transform: uppercase; white-space: nowrap; }
.process-strategy__result strong { color: #892dff; font-weight: 700; }

.process-design { width: 100%; height: 718px; padding: 80px 0; display: flex; align-items: flex-start; justify-content: center; gap: 4px; background: #303030; overflow: hidden; }
.process-design__heading { position: relative; width: 579px; height: 380px; display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }
.process-number--light { color: rgba(248,242,242,.6); }
.process-design__heading h2 { margin: 0; color: #f8f2f2; font-family: "Alumni Sans", sans-serif; font-size: 80px; font-weight: 600; line-height: .8; text-transform: uppercase; white-space: nowrap; }
.process-design__heading > p:last-of-type { width: 400px; margin: 0; color: rgba(255,239,164,.7); font-size: 18px; line-height: 1.2; }
.process-design__arrow { position: absolute; top: 305.74px; left: 336px; width: 210.79px; height: 124.959px; object-fit: contain; }
.process-design__images { position: relative; width: 673px; height: 558px; flex: none; }
.process-design__images img { position: absolute; object-fit: cover; }
.process-design__behind { top: 5px; left: 80px; width: 418px; height: 390px; }
.process-design__front { top: 217px; left: 181px; width: 423px; height: 341px; }
.process-design__money { top: 282px; left: 0; width: 160px; height: 183px; }
.process-design__flower { top: 81px; left: 486px; width: 187px; height: 195px; }
.process-design__heart { top: 0; left: 439px; width: 117px; height: 115px; }

.process-production { width: 100%; height: 712px; padding: 60px 100px 80px; display: flex; align-items: flex-start; justify-content: center; gap: 100px; background: #f8f2f2; }
.process-production__heading { position: relative; width: 609px; height: 424px; flex: none; display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }
.process-production__heading h2 { margin: 0; color: #000; font-family: "Alumni Sans", sans-serif; font-size: 80px; font-weight: 600; line-height: .8; text-transform: uppercase; white-space: nowrap; }
.process-production__heading > p:last-of-type { width: 408px; margin: 0; color: rgba(48,48,48,.7); font-size: 18px; line-height: 1.2; }
.process-production__arrow { position: absolute; top: 326.74px; left: 495px; width: 148.156px; height: 98.357px; object-fit: contain; }
.process-production__right { width: 511px; height: 572px; flex: none; display: flex; flex-direction: column; align-items: flex-start; gap: 32px; }
.process-production__illustration { position: relative; width: 511px; height: 468px; flex: none; }
.process-production__circle { position: absolute; top: 0; left: 0; width: 366px; height: 366px; }
.process-production__image { position: absolute; top: 55px; left: 88px; width: 423px; height: 413px; object-fit: cover; }
.process-production__result { margin: 0; color: #303030; font-size: 20px; font-weight: 700; line-height: 1.2; text-transform: uppercase; white-space: nowrap; }
.process-production__result strong { color: #892dff; font-weight: 700; }

.final-cta { width: 100%; height: 471.26px; padding: 80px 100px 60px; display: flex; align-items: center; justify-content: center; gap: 80px; background: #303030; }
.final-cta__images { position: relative; flex: none; }
.final-cta__images--left { width: 248px; height: 249px; }
.final-cta__cat { position: absolute; top: 0; left: 53px; width: 195px; height: 219px; object-fit: cover; }
.final-cta__smile { position: absolute; top: 85px; left: 0; width: 151px; height: 164px; object-fit: cover; }
.final-cta__heading { width: 548px; height: 331.26px; display: flex; flex-direction: column; align-items: center; gap: 32px; }
.final-cta__heading h2 { width: 548px; margin: 0; color: #f8f2f2; font-family: "Open Sans", sans-serif; font-size: 32px; font-weight: 700; line-height: 1.2; text-align: center; text-transform: uppercase; }
.final-cta__heading h2 strong { color: #ffefa4; font-weight: 700; }
.button--final { height: 68px; padding: 16px 60px; gap: 8px; font-size: 24px; line-height: 1.5; letter-spacing: .72px; }
.final-cta__sticker { width: 201.654px; height: 85.26px; object-fit: contain; }
.final-cta__images--right { width: 200px; height: 271px; }
.final-cta__rabbit { position: absolute; inset: 0; width: 200px; height: 271px; object-fit: cover; }
.final-cta__flower { position: absolute; top: 153px; left: 69px; width: 120px; height: 116px; object-fit: cover; }

.footer { width: 100%; height: 246px; padding: 60px 100px; display: flex; flex-direction: column; align-items: center; gap: 24px; background: #303030; color: #f8f2f2; }
.footer__description { width: 1240px; height: 80px; display: flex; align-items: flex-start; justify-content: space-between; }
.footer__contacts { height: 80px; display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.footer__contacts a { height: 34px; display: flex; align-items: center; gap: 12px; color: rgba(248,242,242,.9); font-size: 20px; line-height: 1.2; letter-spacing: .2px; text-decoration: none; white-space: nowrap; }
.footer__contacts a span { position: relative; transition: color var(--motion-duration) var(--motion-easing); }
.footer__contacts a span::after { content: ""; position: absolute; right: 0; bottom: -3px; left: 0; height: 2px; background: #ffefa4; transform: scaleX(0); transform-origin: left; transition: transform var(--motion-duration) var(--motion-easing); }
.footer__contacts a:hover span,
.footer__contacts a:focus-visible span { color: #ffefa4; }
.footer__contacts a:hover span::after,
.footer__contacts a:focus-visible span::after { transform: scaleX(1); }
.footer__contacts img { width: 34px; height: 34px; flex: none; }
.footer__column { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; font-size: 16px; line-height: 1.2; }
.footer__column p { margin: 0; }
.footer__label { color: rgba(255,239,164,.9); }
.footer__time { width: 156px; }
.footer__address { width: 218px; color: rgba(248,242,242,.9); }
.footer__legal { width: 278px; color: rgba(248,242,242,.6); }
.footer__legal p:last-child { height: 21px; }
.footer__copyright { width: 1240px; margin: 0; color: rgba(248,242,242,.7); font-size: 18px; line-height: 1.2; white-space: nowrap; }

.contact-popup { width: 690px; height: 320px; margin: auto; padding: 48px 80px; border: 0; border-radius: 32px; background: #ffefa4; color: #303030; overflow: hidden; opacity: 0; transform: translateY(16px) scale(.98); transition: opacity var(--motion-duration) var(--motion-easing), transform var(--motion-duration) var(--motion-easing), overlay var(--motion-duration) allow-discrete, display var(--motion-duration) allow-discrete; }
.contact-popup[open] { display: flex; flex-direction: column; align-items: center; gap: 24px; opacity: 1; transform: translateY(0) scale(1); }
.contact-popup::backdrop { background: rgba(24,19,28,.64); opacity: 0; backdrop-filter: blur(4px); transition: opacity var(--motion-duration) var(--motion-easing), overlay var(--motion-duration) allow-discrete, display var(--motion-duration) allow-discrete; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
.contact-popup[open]::backdrop { opacity: 1; }
.contact-popup__title { margin: 0; color: #303030; font-size: 20px; font-weight: 600; line-height: 1.2; text-align: center; white-space: nowrap; }
.contact-popup__buttons { width: 530px; display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
body.has-open-popup { overflow: hidden; }