.homeSlider {
  opacity: 0!important;
  transition: 2.5s ease-in-out;
}
.homeSlider.showHomeSlider {
  opacity: 1!important;
}

/* ── Splash / preloader ─────────────────────────────────────────────────────
   Fonts: only the two licensed families — SangBleuVersailles + TTCommons.   */
.loader{
  position: fixed;
  top: 0; left: 0;
  width: 100%;
  height: 100svh;
  min-height: 100svh;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  overflow: hidden;
  background: #F3EEE8;
  color: #2c241d;
  font-family: TTCommons, sans-serif;
  transition: opacity .85s ease, transform .85s cubic-bezier(.16,1,.3,1), filter .85s ease;
}
.loader.hiddenClass{
  opacity: 0;
  transform: scale(1.02);
  filter: blur(8px);
  pointer-events: none;
}

/* background video + atmosphere */
.loader .bg{
  position: absolute;
  top: -3%; left: -3%;
  width: 106%; height: 106%;
  object-fit: cover;
  object-position: center;
  display: block;
  z-index: 0;
  opacity: .88;
  filter: contrast(102%) brightness(98%);
}
.loader .overlay{
  position: absolute;
  top: 0; left: 0; width: 100%; height: 100%;
  z-index: 1;
  pointer-events: none;
  background: radial-gradient(circle at center, rgba(243,238,232,.15) 20%, rgba(243,238,232,.72) 90%);
}
.loader .grain{
  position: absolute;
  top: 0; left: 0; width: 100%; height: 100%;
  z-index: 1;
  pointer-events: none;
  opacity: .03;
  background-image: radial-gradient(#000 1px, transparent 1px);
  background-size: 4px 4px;
  mix-blend-mode: overlay;
}

/* centre stage */
.loader .hero{
  position: relative;
  z-index: 2;
  flex: 1;
  width: min(900px, 100%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 28px 20px;
}
.loader .logo-wrap{
  position: relative;
  width: 224px;
  height: 298px;
  display: flex;
  align-items: center;
  justify-content: center;
  perspective: 1200px;
  margin-bottom: 32px;
  animation: splashLogoIn 1.3s cubic-bezier(.16,1,.3,1) both;
}
.loader .halo{
  position: absolute;
  top: -42px; right: -42px; bottom: -42px; left: -42px;
  border-radius: 50%;
  filter: blur(42px);
  background: radial-gradient(circle, rgba(163,149,134,.28), rgba(163,149,134,.08) 55%, transparent 75%);
  animation: splashAura 5s ease-in-out infinite;
}
.loader .logo{
  position: relative;
  width: 100%;
  height: 100%;
  filter: drop-shadow(0 16px 36px rgba(0,0,0,.2));
  transform-style: preserve-3d;
  transition: transform .18s ease-out;
}
.loader .logo .outline path{
  fill: none;
  stroke: url(#splashGold);
  stroke-width: 1.2;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
  animation: splashDraw 2.1s cubic-bezier(.16,1,.3,1) forwards;
}
.loader .logo .outline path:nth-child(2),
.loader .logo .outline path:nth-child(3){animation-delay: .25s}
.loader .logo .outline path:nth-child(4){animation-delay: .45s}
.loader .logo .outline path:nth-child(5){animation-delay: .55s}
.loader .logo .fill{
  opacity: 0;
  animation: splashFillIn 1.3s 1.25s ease-in-out forwards;
}
.loader .logo .glint{
  animation: splashGlint 5.9s 2.3s cubic-bezier(.4,0,.2,1) infinite;
}

.loader .wordmark{
  display: block;
  margin: 0;
  padding: 0;
  font-family: SangBleuVersailles, serif;
  font-weight: 300;
  font-size: clamp(30px, 4vw, 48px);
  line-height: 1;
  letter-spacing: .38em;
  text-indent: .38em;
  opacity: 0;
  transform: translateY(16px);
  animation: splashRise 1.4s .85s cubic-bezier(.16,1,.3,1) forwards;
}

/* progress */
.loader .progress-box{
  width: min(384px, 82vw);
  margin-top: 40px;
  opacity: 0;
  animation: splashFade 1s .65s forwards;
}
.loader .track{
  height: 1.5px;
  border-radius: 10px;
  overflow: hidden;
  background: rgba(163,149,134,.25);
}
.loader .bar{
  display: block;
  width: 0;
  height: 100%;
  background: linear-gradient(90deg, #8b7b6c, #d8cabe, #a39586);
  transition: width .12s ease-out;
}
.loader .status{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 12px;
  opacity: .6;
  font-size: 10px;
  letter-spacing: .25em;
  text-transform: uppercase;
}
.loader .status .percentage{
  margin: 0;
  padding: 0;
  font-family: TTCommons, sans-serif;
  font-weight: 500;
  font-size: 11px;
  letter-spacing: .12em;
  line-height: 1;
  color: #a39586;
  font-variant-numeric: tabular-nums;
}

/* footer */
.loader .splash-footer{
  position: relative;
  z-index: 3;
  width: min(1152px, 100%);
  padding: 28px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  opacity: 0;
  animation: splashFade 1s 1.1s forwards;
}
.loader .legal{
  margin: 0;
  padding: 0;
  opacity: .5;
  font-size: 10px;
  letter-spacing: .2em;
  text-transform: uppercase;
}
.loader .enter{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 24px;
  border: 1px solid rgba(163,149,134,.35);
  border-radius: 999px;
  background: rgba(243,238,232,.15);
  color: inherit;
  cursor: pointer;
  white-space: nowrap;
  -webkit-appearance: none;
  appearance: none;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  font-family: TTCommons, sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .25em;
  text-transform: uppercase;
  transition: .45s;
}
.loader .enter:focus{outline: none}
.loader .enter.ready{
  border-color: #a39586;
  background: rgba(163,149,134,.2);
  box-shadow: 0 4px 20px rgba(163,149,134,.3);
}
.loader .enter .arrow{
  color: #a39586;
  font-size: 18px;
  line-height: 1;
  transition: transform .3s;
}
.loader .enter:hover .arrow{transform: translateX(4px)}

@keyframes splashLogoIn{
  from{opacity: 0; transform: scale(.85); filter: blur(12px)}
  to  {opacity: 1; transform: scale(1);   filter: blur(0)}
}
@keyframes splashAura{
  0%,100%{opacity: .35; transform: scale(.95)}
  50%    {opacity: .75; transform: scale(1.08)}
}
@keyframes splashDraw{to{stroke-dashoffset: 0}}
@keyframes splashFillIn{to{opacity: 1}}
@keyframes splashRise{to{opacity: 1; transform: none}}
@keyframes splashFade{to{opacity: 1}}
@keyframes splashGlint{
  0%,64%{transform: translateX(-160px) rotate(28deg)}
  100%  {transform: translateX(320px)  rotate(28deg)}
}

@media (max-width: 640px){
  .loader .hero{padding-top: 18px}
  .loader .logo-wrap{width: 170px; height: 226px; margin-bottom: 24px}
  .loader .wordmark{font-size: 29px}
  .loader .splash-footer{
    flex-direction: column;
    text-align: center;
    padding-bottom: max(24px, env(safe-area-inset-bottom));
  }
}

@media (prefers-reduced-motion: reduce){
  .loader, .loader *, .loader *::before, .loader *::after{
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

.section {
  position: relative;
  overflow: hidden;
}
.section .container-fluid{
  position: relative;
  z-index: 1;
}
.section .bkgImg, .section .rightBkg{
  opacity: 0;
  transition: .8s ease-in-out;
}
.section::before {
  content: "";
  position: absolute;
  z-index: 2;
  top: 0; left: 0; width: 100%; height: 100%;
  pointer-events: none;
  opacity: 1;
  transition: .3s ease-in-out;

  /* SVG-шум как фон */
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400"><filter id="noise" x="0" y="0" width="100%25" height="100%25"><feTurbulence type="fractalNoise" baseFrequency="2" numOctaves="4" seed="2"/></filter><rect width="100%25" height="100%25" fill="%23b3a89b" filter="url(%23noise)" opacity="0.18"/></svg>');
  background-size: cover;
}
.section.home-section::before {
  display: none!important;
}

.section.sandOff::before {
  opacity: 0;
}
#footer-section::before {
  display: none!important;
}

.bkgImg {
    transform: scale(1.06);
    transition: .8s ease-in-out;
    will-change: transform;
  }
.bkgImg.zoomed-in, .rightBkg.zoomed-in {
  transform: scale(1);
  opacity: 1;
}

.homeSlider .slick-slide img{
  transform: scale(1.15);
  transition: .8s ease-in-out;
  will-change: transform;
}

.homeSlider .slick-slide.slick-active img{
  transform: scale(1);
}

@media (max-width: 925px) {
  .contentWithScroll {
    padding-bottom: 12rem;
  }
}
