/* «Море Массажа» — проба первого экрана «Песок» (07.10.2026; на боевой сайт не попадает).
   Сам пляж рисует wow/src/hero-sand.js на холсте .mmw-cv. Класс mmw-on ставит скрипт, когда WebGL есть:
   без скрипта и без WebGL первый экран остаётся как сейчас. */

/* первый экран во весь экран; холст уходит вверх под прозрачную шапку */
html.mmw-on .hero{--mmw-hd:80px;min-height:calc(100vh - var(--mmw-hd));min-height:calc(100svh - var(--mmw-hd));padding:0;display:flex;flex-direction:column}
html.mmw-on .hero::before{display:none}
html.mmw-on .hero .deco-board{display:none}
html.mmw-on .hero>.w{width:100%;padding-top:clamp(56px,13vh,128px)}
.mmw-cv{position:absolute;left:0;top:calc(-1 * var(--mmw-hd));width:100%;height:calc(100% + var(--mmw-hd));z-index:0;pointer-events:none;opacity:0;transition:opacity 1s ease}
.mmw-cv.on{opacity:1}

/* надпись и кнопки лежат на песке: мягкая тень от солнца слева сверху */
html.mmw-on .hero .wm-word img{filter:drop-shadow(1.5px 2.5px 1.5px rgba(112,74,30,.30))}
html.mmw-on .hero .wm-surf,html.mmw-on .hero .wm-sun img{filter:drop-shadow(1px 2px 1px rgba(112,74,30,.22))}
html.mmw-on .hero-tag{text-shadow:0 1px 0 rgba(255,250,236,.7)}
html.mmw-on .hero-cta .btn{box-shadow:2px 6px 14px -6px rgba(96,62,22,.5)}
html.mmw-on .hero-cta .btn-g{background:#fffcf3}
html.mmw-on .hero-cta .btn-g:hover{background:var(--blue)}

/* акции — сразу под первым экраном */
.mmw-promo{position:relative;padding-top:clamp(18px,2.6vw,36px)}
.mmw-promo .hero-sl{margin-top:0;animation:none}

@media (max-width:700px){
  html.mmw-on .hero>.w{padding-top:clamp(26px,6vh,56px)}
  .mmw-promo{padding-top:10px}
}
@media (prefers-reduced-motion:reduce){.mmw-cv{transition:none}}

/* «Первый массаж 2 800 ₽» — надпись на песке; текст ссылки прозрачный, буквы рисует холст */
.mmw-offer{display:block;width:max-content;max-width:100%;margin:clamp(20px,3.2vh,34px) auto 0;padding:4px 10px;font:700 40px/1.15 var(--sans);letter-spacing:.035em;color:transparent;-webkit-tap-highlight-color:transparent}
.mmw-offer::selection{color:var(--ink)}
.mmw-offer:hover,.mmw-offer:focus-visible{text-decoration:underline wavy var(--orange) 2px;text-underline-offset:9px;text-decoration-skip-ink:none}   /* как у пунктов меню */
html.mmw-lost .mmw-offer{color:var(--orange)}   /* браузер забрал WebGL: надпись показываем обычным текстом */
@media (max-width:700px){.mmw-offer{font-size:27px;margin-top:14px;letter-spacing:.03em}}