/* Точечная доводка шаблона: структура и вёрстка страницы не меняются.
   Всё правится только отсюда, вендорные файлы в css/ не трогаются. */

:root {
  --dp-pink: #fa5bdd;
  --dp-pink-soft: #fdeffb;
  --dp-plum: #2b1b3a;
  --dp-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

html { scroll-behavior: smooth; }
::selection { background: var(--dp-pink); color: #fff; }
a:focus-visible, button:focus-visible { outline: 2px solid var(--dp-pink); outline-offset: 3px; }

/* ─── Индикатор прокрутки и кнопка «наверх» ─── */
.dp-progress {
  position: fixed; left: 0; top: 0; height: 3px; width: 100%;
  transform: scaleX(0); transform-origin: 0 50%;
  background: linear-gradient(90deg, var(--dp-pink), #78d5ef);
  z-index: 9999; pointer-events: none;
}
.dp-top {
  position: fixed; right: 24px; bottom: 24px; width: 48px; height: 48px;
  border-radius: 50%; border: 0; background: var(--dp-plum); color: #fff;
  font-size: 18px; line-height: 1; cursor: pointer; z-index: 900;
  opacity: 0; transform: translateY(16px); pointer-events: none;
  transition: opacity .3s, transform .4s var(--dp-ease), background .25s;
}
.dp-top.show { opacity: 1; transform: none; pointer-events: auto; }
.dp-top:hover { background: var(--dp-pink); }

/* ─── Герой: читаемый текст, плавный наезд, подсказка прокрутки ─── */
.hero-wrap { overflow: hidden; }
.hero-wrap::before {
  content: ''; position: absolute; inset: 0; background: inherit;
  transform: scale(1.08); animation: dpKen 18s ease-out forwards;
}
@keyframes dpKen { to { transform: scale(1); } }
.hero-wrap .overlay {
  opacity: 1;
  background: linear-gradient(90deg, rgba(43, 27, 58, .62), rgba(43, 27, 58, .2) 62%, rgba(43, 27, 58, .05)),
              linear-gradient(0deg, rgba(43, 27, 58, .45), transparent 40%);
}
.hero-wrap .container { position: relative; z-index: 2; }
.hero-wrap .slider-text h1.mb-4 {
  letter-spacing: -.02em; text-shadow: 0 2px 30px rgba(43, 27, 58, .35);
}
.hero-wrap .slider-text .logo h1 { text-shadow: 0 2px 20px rgba(43, 27, 58, .35); }
.hero-wrap .btn-outline-white { border-width: 2px; transition: background .3s, color .3s, transform .3s var(--dp-ease); }
.hero-wrap .btn-outline-white:hover { transform: translateY(-3px); }
.hero-wrap::after {
  content: ''; position: absolute; left: 50%; bottom: 22px; width: 1px; height: 54px;
  background: linear-gradient(#fff, transparent); z-index: 2; animation: dpCue 2.2s ease-in-out infinite;
}
@keyframes dpCue { 0%, 100% { transform: scaleY(.3); transform-origin: top; opacity: .4; } 50% { transform: scaleY(1); opacity: 1; } }

/* ─── Меню ─── */
.ftco_navbar .nav-link { position: relative; transition: color .25s; }
.ftco_navbar .nav-link::after {
  content: ''; position: absolute; left: 1rem; right: 1rem; bottom: 6px; height: 1px;
  background: var(--dp-pink); transform: scaleX(0); transition: transform .35s var(--dp-ease);
}
.ftco_navbar .nav-link:hover::after,
.ftco_navbar .active > .nav-link::after { transform: scaleX(1); }

/* ─── Заголовки разделов: орнамент вместо голого текста ─── */
.heading-section h2 { letter-spacing: -.01em; }
.heading-section.text-center h2::after {
  content: ''; display: block; width: 64px; height: 1px; margin: 22px auto 0;
  background: var(--dp-pink); position: relative;
}
.heading-section.text-center p { max-width: 560px; margin-left: auto; margin-right: auto; }

/* ─── Мастера ─── */
.staff { border: 1px solid #f3edf2; transition: transform .45s var(--dp-ease), box-shadow .45s, border-color .3s; }
.staff:hover { transform: translateY(-8px); border-color: var(--dp-pink-soft); }
.staff .img {
  width: 132px; height: 132px; background-size: cover; background-position: center;
  box-shadow: 0 0 0 6px #fff, 0 0 0 7px var(--dp-pink-soft);
  transition: transform .5s var(--dp-ease), box-shadow .3s;
}
.staff:hover .img { transform: scale(1.06); box-shadow: 0 0 0 6px #fff, 0 0 0 7px var(--dp-pink); }
.staff .info span.position {
  display: inline-block; padding: 3px 14px; border-radius: 99px; background: var(--dp-pink-soft);
  color: #c73aa8; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; font-size: 10.5px;
}

/* ─── Работы ─── */
.work-entry { overflow: hidden; }
.work-entry img { transition: transform 1s var(--dp-ease); }
.work-entry:hover img { transform: scale(1.07); }
.work-entry .info {
  background: linear-gradient(180deg, rgba(43, 27, 58, .15), rgba(43, 27, 58, .78));
}
.work-entry .info .icon { border-width: 2px; border-color: rgba(255, 255, 255, .7); transition: transform .4s var(--dp-ease), background .3s; }
.work-entry:hover .info .icon { transform: rotate(90deg); background: var(--dp-pink); border-color: var(--dp-pink); }
.work-entry .info h3 { letter-spacing: .14em; text-transform: uppercase; font-size: 15px; font-weight: 500; }

/* ─── Цены ─── */
.pricing-entry {
  background: #fff; border-color: #f3edf2;
  transition: transform .45s var(--dp-ease), box-shadow .45s, border-color .3s;
}
.pricing-entry:hover { transform: translateY(-8px); box-shadow: 0 30px 50px -30px rgba(43, 27, 58, .35); }
.pricing-entry h3 { letter-spacing: .18em; color: #6b6470; }
.pricing-entry p .price { font-size: 38px; font-weight: 600; color: var(--dp-pink); letter-spacing: -.02em; }
.pricing-entry ul li { font-size: 14px; padding: 11px 20px 11px 48px; position: relative; text-align: left; }
.pricing-entry ul li:nth-child(odd) { background: #fdf7fc; }
.pricing-entry ul li::before {
  content: ''; position: absolute; left: 24px; top: 50%; width: 10px; height: 5px; margin-top: -4px;
  border-left: 2px solid var(--dp-pink); border-bottom: 2px solid var(--dp-pink); transform: rotate(-45deg);
}
.pricing-entry.active { border-color: var(--dp-pink); box-shadow: 0 30px 60px -30px rgba(250, 91, 221, .55); transform: translateY(-10px); }
.pricing-entry.active:hover { transform: translateY(-16px); }
.pricing-entry.active::before {
  content: 'Most loved'; position: absolute; top: -12px; left: 50%; transform: translateX(-50%);
  background: var(--dp-pink); color: #fff; font-size: 10.5px; font-weight: 600; letter-spacing: .16em;
  text-transform: uppercase; padding: 4px 14px; border-radius: 99px; white-space: nowrap;
}
.pricing-entry .button .btn { transition: background .3s, color .3s, transform .3s var(--dp-ease); }
.pricing-entry .button .btn:hover { transform: translateY(-2px); }

/* ─── Подвал ─── */
.ftco-footer a { transition: color .25s, padding-left .25s; }
.ftco-footer .list-unstyled a:hover { color: var(--dp-pink); padding-left: 6px; }
.ftco-footer-social li a { transition: transform .35s var(--dp-ease), background .25s; }
.ftco-footer-social li a:hover { transform: translateY(-4px); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .hero-wrap::before, .hero-wrap::after { animation: none; }
  * { transition-duration: .01ms !important; }
}
@media (max-width: 767.98px) {
  .pricing-entry.active { transform: none; }
  .dp-top { right: 14px; bottom: 14px; }
}