/* SAMUI · входной экран главной: большой тайский домик на весь экран, закат, слоны.
   Части домика — ссылки: двери распахиваются, окна раскрываются, фонари качаются, у каждой появляется деревянная табличка. */
.scene{position:relative;overflow:clip;min-height:620px;height:calc(100vh / var(--zf,1));max-height:980px;color:var(--sm-on-dark);border-radius:0 0 var(--r-panel) var(--r-panel);
  background:linear-gradient(180deg,#140B05 0%,#2A160A 30%,#56300F 52%,#8F5220 68%,#C6843B 82%,#E0A552 100%)}
.scene__sky{position:absolute;inset:0;pointer-events:none}
.scene__sun{position:absolute;left:50%;top:54%;width:min(calc(58vh / var(--zf,1)),calc(46vw / var(--zf,1)));aspect-ratio:1;border-radius:50%;translate:-50% -62%;background:linear-gradient(180deg,#F9DC98 0%,#EDB45C 62%,#D98A3A 100%);box-shadow:0 0 0 24px rgba(249,220,152,.10),0 0 0 60px rgba(249,220,152,.05);transform:translate3d(calc(var(--px,0) * var(--k,0) * 1px),calc(var(--py,0) * var(--k,0) * .55px),0);transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.scene__hills{position:absolute;left:-3%;width:106%;max-width:none;bottom:0;height:40%;transform:translate3d(calc(var(--px,0) * var(--k,0) * 1px),0,0);transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.scene__hills--near{fill:#1C0F07;height:26%}
/* джунгли из листьев заказчика: дальний план темнее и мельче, ближний — крупные листья по бокам */
.jg{position:absolute;left:0;right:0;transform:translate3d(calc(var(--px,0) * var(--k,0) * 1px),0,0);transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.jg img{position:absolute;height:auto;rotate:var(--r,0deg);transform:scaleX(var(--f,1));transform-origin:50% 100%}
.jg--far{bottom:21%;filter:brightness(.62)}
.jg--mid{bottom:11%}
.jg__bamboo{position:absolute;bottom:5%;width:min(calc(17vw / var(--zf,1)),250px);transform:translate3d(calc(var(--px,0) * var(--k,0) * 1px),0,0);transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.jg__bamboo img{display:block;width:100%;height:auto}
.jg__bamboo--l{left:-3%}
.jg__bamboo--r{right:-3%;scale:-1 1}
.scene__orn{width:150px;height:auto;margin:-2px 0 -4px -6px;opacity:.95}
.fly{position:absolute;left:var(--x);top:var(--y);width:4px;height:4px;border-radius:50%;background:#FFE3A1;box-shadow:0 0 10px 3px rgba(255,214,130,.55);opacity:0}

.scene__in{position:relative;z-index:1;height:100%;pointer-events:none}
.scene__title,.scene__cta,.scene__nav,.hz,.scene__elbtn{pointer-events:auto}
/* заголовок — в левом верхнем углу неба, кнопки — в правом; центр целиком отдан домику */
.scene__title{position:absolute;z-index:3;left:var(--g);top:calc(var(--sm-header) + 8px);display:flex;flex-direction:column;gap:12px}
.scene__h1{font-size:clamp(28px,calc(3.1vw / var(--zf,1)),50px);line-height:1.02;max-width:calc(36vw / var(--zf,1));text-wrap:balance}   /* заголовок из админки бывает длинным — переносится, а не заезжает на хижину */
.scene__h1 span{display:block;color:var(--sm-blue)}
.scene__kicker{font-family:var(--sm-font-display);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#E0BE7E}
.scene__cta{position:absolute;z-index:3;right:var(--g);top:calc(var(--sm-header) + 12px);width:min(300px,calc(24vw / var(--zf,1)));display:flex;flex-direction:column;align-items:stretch;gap:16px;text-align:right}
.scene__lead{font-size:17px;line-height:1.45;color:rgba(243,231,211,.9)}
.scene__btns{display:flex;flex-direction:column;gap:10px}
.scene__btns .btn{height:56px;font-size:16px;padding:0 20px}
.scene__btns .btn--line-light{background:rgba(31,18,8,.6)}

/* сцена: высота = экран минус шапка; домик занимает её почти целиком */
.scene__stage{position:absolute;left:50%;bottom:0;height:calc(100% - 100px);aspect-ratio:980/600;max-width:calc(100vw / var(--zf,1));translate:-50% 0}
.scene__layer{position:absolute;transform:translate3d(calc(var(--px,0) * var(--k,0) * 1px),calc(var(--py,0) * var(--k,0) * .55px),0);transition:transform .5s cubic-bezier(.2,.7,.2,1);will-change:transform}
.scene__layer>img,.scene__elbtn img{display:block;width:100%;height:auto}
.scene__leaf,.scene__stones,.scene__pouches,.scene__orchid{pointer-events:none}
.scene__leaf{display:none}
.scene__leaf--l{left:1%;top:30%;width:23%;rotate:-12deg}
.scene__leaf--r{right:-1%;top:14%;width:28%;rotate:8deg}
.scene__house{left:13%;right:13%;bottom:3.5%}
.house{display:block;width:100%;height:auto;overflow:visible}
.scene__stones{left:20.500%;bottom:.5%;width:8.5%}
.scene__pouches{right:17.500%;bottom:.5%;width:8%}
.scene__orchid{right:3%;bottom:1%;width:13%}
.scene__el--big{left:5%;bottom:1.5%;width:19%}
.scene__el--baby{right:9%;bottom:1%;width:10.5%}
.scene__elbtn{display:block;width:100%;padding:0;cursor:pointer;transform-origin:50% 100%;filter:drop-shadow(0 10px 12px rgba(0,0,0,.35))}
.scene__elbtn:hover{transform:translateY(-3px)}
.scene__el.is-hi .scene__elbtn{animation:el-hop .7s ease}
.scene__say{position:absolute;left:50%;bottom:104%;transform:translate(-50%,8px);padding:8px 14px;border-radius:16px 16px 16px 4px;background:var(--sm-sand-2);color:var(--sm-text);font-size:14px;font-weight:600;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s}
.scene__el.is-hi .scene__say{opacity:1;transform:translate(-50%,0)}

/* день и ночь: по солнцу можно нажать */
.scene__sunbtn{position:absolute;z-index:1;left:50%;top:54%;width:min(calc(58vh / var(--zf,1)),calc(46vw / var(--zf,1)));aspect-ratio:1;border-radius:50%;translate:-50% -62%;cursor:pointer}
.scene__sunbtn:focus-visible{outline:2px solid var(--sm-blue);outline-offset:6px}
.scene__night{position:absolute;inset:0;background:linear-gradient(180deg,#05090F 0%,#0B1A26 38%,#123247 66%,#1F5068 86%,#2E7089 100%);opacity:0;transition:opacity 1.1s ease}
.scene__sun{transition:transform .5s cubic-bezier(.2,.7,.2,1),scale 1.1s ease,box-shadow 1.1s ease}
.scene__sun::after{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 34% 30%,#FFFDF4 0 8%,#F4EEDD 9% 100%);box-shadow:inset -18px -14px 0 rgba(160,170,180,.28);opacity:0;transition:opacity 1.1s ease}
.jg,.jg__bamboo{transition:transform .5s cubic-bezier(.2,.7,.2,1),filter 1.1s ease}
.is-night .scene__night{opacity:1}
.is-night .scene__sun{scale:.62;box-shadow:0 0 0 20px rgba(214,236,246,.10),0 0 0 54px rgba(214,236,246,.05)}
.is-night .scene__sun::after{opacity:1}
.is-night .jg--far{filter:brightness(.26) saturate(.6) hue-rotate(160deg)}
.is-night .jg--mid{filter:brightness(.42) saturate(.7)}
.is-night .jg__bamboo{filter:brightness(.6) saturate(.8)}
.is-night .scene__hills--near{fill:#070D12}
.is-night .house__glow{opacity:1}
.is-night .fly{background:#FFF6D8;box-shadow:0 0 12px 4px rgba(255,236,170,.7)}
.is-night .scene__kicker{color:#9FD3E6}
.scene__hills--near{transition:fill 1.1s ease}
.house__glow{transition:opacity 1.1s ease}

/* лепестки орхидеи: медленно падают; клик по небу — россыпь */
.scene__petals{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.scene__petals i,.burst{position:absolute;display:block;border-radius:80% 0 80% 0;background:linear-gradient(135deg,#FFF8E6,#F0D9A8);box-shadow:0 0 0 .5px rgba(120,80,40,.35)}
.scene__petals i{left:var(--x);top:-4%;width:var(--sz);height:calc(var(--sz) * .7);opacity:0}
.burst{width:11px;height:8px;pointer-events:none;z-index:4}

/* части домика */
.house__glow{opacity:.7;pointer-events:none}
.house__signs{pointer-events:none}
.hz{cursor:pointer;outline:none}
.hz__hit{fill:transparent;stroke:none}
.hz__hl{fill:none;stroke:#FFE9A8;stroke-width:3;stroke-opacity:0;transition:stroke-opacity .25s}
.hz:hover .hz__hl,.hz:focus-visible .hz__hl{stroke-opacity:.95}
.hz__in{opacity:0;transition:opacity .35s}
.hz__veil{transition:opacity .35s}
.hz--win:hover .hz__veil,.hz--win:focus-visible .hz__veil{opacity:.12}
.hz--win:hover .hz__in,.hz--win:focus-visible .hz__in,.hz--door:hover .hz__in,.hz--door:focus-visible .hz__in{opacity:1}
.door{transform-box:fill-box;transition:transform .45s cubic-bezier(.3,.8,.3,1)}
.door--l{transform-origin:0 50%}.door--r{transform-origin:100% 50%}
.hz--door:hover .door,.hz--door:focus-visible .door{transform:scaleX(.22)}
.lamp{transform-box:fill-box;transform-origin:50% 0}
.chime{transform-box:fill-box;transform-origin:50% 0}
.step{transition:fill .25s}
.house__crest{stroke:#35190B}
.hz--logo>svg,.hz--logo>path{transition:filter .3s}
.hz--logo:hover>path:nth-child(2),.hz--logo:focus-visible>path:nth-child(2){filter:brightness(1.08)}
.sign{opacity:0;transform:translateY(8px);transition:opacity .25s,transform .25s}
.house[data-on="0"] .sign[data-i="0"],.house[data-on="1"] .sign[data-i="1"],.house[data-on="2"] .sign[data-i="2"],.house[data-on="3"] .sign[data-i="3"],.house[data-on="4"] .sign[data-i="4"],.house[data-on="5"] .sign[data-i="5"],.house[data-on="6"] .sign[data-i="6"]{opacity:1;transform:none}

.scene__hint{position:absolute;z-index:3;left:50%;bottom:14px;translate:-50% 0;font-size:13px;letter-spacing:.02em;color:rgba(243,231,211,.72);white-space:nowrap;pointer-events:none}
.scene__nav{display:none}

@media (prefers-reduced-motion:no-preference){
  .fly{animation:fly var(--d) ease-in-out var(--w) infinite}
  @keyframes fly{0%,100%{opacity:0;transform:translate(0,0)}35%{opacity:.95}60%{opacity:.5;transform:translate(14px,-22px)}80%{opacity:.9}}
  .house__glow circle{animation:lamp 3.6s ease-in-out infinite}
  .house__glow circle:nth-child(2){animation-delay:-1.3s}.house__glow circle:nth-child(3){animation-delay:-2.1s}.house__glow circle:nth-child(4){animation-delay:-.6s}.house__glow circle:nth-child(5){animation-delay:-2.8s}
  @keyframes lamp{0%,100%{opacity:.75}45%{opacity:1}60%{opacity:.6}}
  .hz--lamp:hover .lamp,.hz--lamp:focus-visible .lamp{animation:swing 1.1s ease-in-out infinite}
  .chime{animation:chime var(--cd,3.6s) ease-in-out infinite}
  @keyframes chime{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(6deg)}}
  .hz--stairs:hover .step,.hz--stairs:focus-visible .step{animation:step .9s ease calc(var(--s) * .11s) infinite}
  @keyframes step{0%,100%{fill:#E0C79A}35%{fill:#FFE9A8}}
  .jg img{animation:sway 6.5s ease-in-out infinite alternate}
  .jg img:nth-child(2n){animation-duration:8s;animation-delay:-2s}.jg img:nth-child(3n){animation-duration:5.4s;animation-delay:-3.5s}
  @keyframes sway{from{rotate:calc(var(--r,0deg) - 2.2deg)}to{rotate:calc(var(--r,0deg) + 2.2deg)}}
  .jg__bamboo img{animation:sway-b 7s ease-in-out infinite alternate;transform-origin:50% 100%}
  @keyframes sway-b{from{rotate:-1.2deg}to{rotate:1.2deg}}
  .scene__petals i{animation:petal var(--d) linear var(--w) infinite}
  @keyframes petal{0%{opacity:0;transform:translate(0,0) rotate(0)}8%{opacity:.95}50%{transform:translate(46px,calc(52vh / var(--zf,1))) rotate(210deg)}92%{opacity:.9}100%{opacity:0;transform:translate(-18px,calc(104vh / var(--zf,1))) rotate(420deg)}}
  .burst{animation:burst .95s ease-out forwards}
  @keyframes burst{from{opacity:1;transform:translate(0,0) rotate(0) scale(1)}to{opacity:0;transform:translate(var(--bx),var(--by)) rotate(var(--br)) scale(.5)}}
  .scene__elbtn img{animation:breathe 4.2s ease-in-out infinite;transform-origin:50% 100%}
  .scene__el--baby .scene__elbtn img{animation-duration:3.1s}
  @keyframes breathe{50%{transform:scale(1.018,1.028)}}
  @keyframes swing{0%,100%{transform:rotate(-9deg)}50%{transform:rotate(9deg)}}
  @keyframes el-hop{0%,100%{transform:translateY(0) rotate(0)}30%{transform:translateY(-14px) rotate(-3deg)}60%{transform:translateY(0) rotate(2deg)}80%{transform:translateY(-5px)}}
  .scene__stage{animation:stage-in 1.1s cubic-bezier(.2,.7,.2,1) both}
  @keyframes stage-in{from{opacity:0;transform:translateY(30px) scale(.97)}}
  /* знакомство: при загрузке таблички по очереди показываются сами, чтобы было понятно, что домик кликабельный */
  .house:not([data-on]) .sign{animation:peek 1.5s ease calc(1.4s + var(--i) * .9s) 1 both}
  @keyframes peek{0%,100%{opacity:0;transform:translateY(8px)}18%,80%{opacity:1;transform:none}}
}
@media (max-width:1100px){
  .scene__cta{width:230px}
  .scene__lead{font-size:15px}
  .scene__btns .btn{height:50px;font-size:14px}
}
/* телефон и планшет: вертикальная сцена на весь экран — заголовок в небе, огромный домик на солнце, джунгли, кнопки на земле */
@media (max-width:860px){
  .scene{--hw:min(calc(118vw / var(--zf,1)),calc((calc(100svh / var(--zf,1)) - 318px) * 1.24));height:calc(100vh / var(--zf,1));height:calc(100svh / var(--zf,1));min-height:600px;max-height:none;display:flex;flex-direction:column;
    background:linear-gradient(180deg,#140B05 0%,#2A160A 22%,#56300F 44%,#8F5220 60%,#C6843B 74%,#E0A552 100%)}
  .scene__in{flex:1;min-height:0;height:auto;display:flex;flex-direction:column;align-items:center;gap:0;padding:66px var(--g) 14px;text-align:center}
  /* небо */
  .scene__sun{display:block;left:50%;top:auto;bottom:176px;width:calc(var(--hw) * .8);translate:-50% 0}
  .scene__hills--near{display:block;height:940px}
  .jg--far,.scene__leaf,.scene__stones,.scene__pouches,.scene__hint,.scene__kicker,.scene__lead{display:none}
  .jg--mid{display:block;bottom:176px}
  .jg--mid img{width:calc(54vw / var(--zf,1))!important}
  .jg--mid img:nth-child(3),.jg--mid img:nth-child(5),.jg--mid img:nth-child(8),.jg--mid img:nth-child(10){display:none}
  .jg__bamboo{display:block;bottom:150px;width:calc(30vw / var(--zf,1))}
  .jg__bamboo--l{left:-9%}.jg__bamboo--r{right:-9%}
  /* день/ночь — маленькое солнце-кнопка под шапкой */
  .scene__sunbtn{left:auto;right:14px;top:152px;width:40px;translate:none;background:linear-gradient(180deg,#F9DC98,#E9A94F);box-shadow:0 0 0 5px rgba(249,220,152,.16)}
  .is-night .scene__sunbtn{background:radial-gradient(circle at 34% 30%,#FFFDF4 0 10%,#F4EEDD 11% 100%);box-shadow:inset -6px -5px 0 rgba(160,170,180,.3),0 0 0 5px rgba(214,236,246,.14)}
  /* заголовок */
  .scene__title{position:static;order:1;align-items:center;gap:2px;padding-top:6px;pointer-events:none;text-shadow:0 2px 14px rgba(20,11,5,.75)}
  .scene__h1{font-size:clamp(22px,calc(6.4vw / var(--zf,1)),40px);line-height:1.06;white-space:normal;text-wrap:balance;max-width:none}   /* заголовок из админки бывает длинным — на телефоне переносится */
  .scene__h1 span{display:inline}
  .scene__orn{width:96px;margin:2px auto 0}
  /* домик: занимает всё, что осталось между заголовком и кнопками */
  .scene__stage{order:2;position:relative;left:auto;bottom:auto;translate:none;flex:1;min-height:0;width:calc(100% + 2 * var(--g));max-width:none;height:auto;aspect-ratio:auto}
  .scene__house{left:50%;right:auto;bottom:0;width:var(--hw);translate:-50% 0}
  .scene__orchid{right:-2%;bottom:-2%;width:calc(17vw / var(--zf,1))}
  .scene__el--big{left:-3%;bottom:-3%;width:calc(31vw / var(--zf,1))}
  .scene__el--baby{right:6%;bottom:-3%;width:calc(18vw / var(--zf,1))}
  /* кнопки и таблички — на земле */
  .scene__cta{position:static;order:3;width:auto;align-self:stretch;padding-top:22px}
  .scene__btns{flex-direction:row;gap:8px}
  .scene__btns .btn{flex:1 1 0;min-width:0;height:54px;padding:0 8px;font-size:clamp(11px,calc(3.2vw / var(--zf,1)),15px);white-space:nowrap}
  .scene__nav{order:4;display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;align-self:stretch;margin:10px calc(-1 * var(--g)) 0;padding:0 76px 0 var(--g)}
  .scene__nav::-webkit-scrollbar{display:none}
  .scene__nav a{flex:0 0 auto;height:38px;padding:0 14px;display:inline-flex;align-items:center;border-radius:10px;background:linear-gradient(180deg,#6B3D1F,#40220F);box-shadow:inset 0 0 0 1.4px #E0BE7E;font-family:var(--sm-font-display);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--sm-on-dark);white-space:nowrap}
  .scene__petals i:nth-child(n+6){display:none}
}
@media (max-width:860px) and (min-width:601px){
  .scene__in{padding-top:calc(var(--sm-header) - 6px)}
  .scene__sunbtn{top:calc(var(--sm-header) + 96px);right:24px}
  .scene{--hw:min(calc(96vw / var(--zf,1)),calc((calc(100svh / var(--zf,1)) - 330px) * 1.24))}
  .jg--mid img{width:calc(38vw / var(--zf,1))!important}
  .scene__btns{max-width:560px;margin:0 auto;width:100%}
  .scene__nav{justify-content:center;padding:0 var(--g)}
}

/* программы на главной: карточки с фото, как в каталоге */
.programs .cat__grid{gap:20px}
.programs .pcard{background:rgba(247,238,223,.96)}
@media (max-width:600px){ .programs .cat__grid{gap:10px} }

/* ===== правки заказчика 06.10.2026 ===== */
/* заголовок первого экрана: что это за место — салон spa и тайского массажа */
.scene__kicker{display:flex;align-items:center}
.scene__count{font:600 clamp(13px,calc(1.2vw / var(--zf,1)),18px)/1.3 var(--sm-font-display);letter-spacing:.05em;text-transform:uppercase;color:rgba(243,231,211,.94)}
.scene__mini{display:flex;gap:8px}
.scene__minibtn{flex:1 1 0;min-width:0;height:42px;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--sm-r-pill);background:rgba(31,18,8,.55);box-shadow:inset 0 0 0 1px rgba(243,231,211,.4);font:600 11.5px/1 var(--sm-font-display);letter-spacing:.03em;text-transform:uppercase;color:var(--sm-on-dark);white-space:nowrap;transition:background .2s}
.scene__minibtn:hover{background:rgba(243,231,211,.18)}
/* слоны с поднятым хоботом */
.scene__flip{scale:-1 1}
.scene__el--big{width:15.5%;left:6%}
.scene__el--baby{width:12.5%;right:8%}

/* время суток по солнцу: утро и день — светлое небо и яркое солнце */
.scene__day{position:absolute;inset:0;background:linear-gradient(180deg,#135A7C 0%,#2B86AB 24%,#74BED1 48%,#F2E0B8 70%,#EEC27A 100%);opacity:0;transition:opacity 1.1s ease}
.scene__sun{transition:transform .5s cubic-bezier(.2,.7,.2,1),scale 1.1s ease,box-shadow 1.1s ease,filter 1.1s ease}
.is-day .scene__day{opacity:1}
.is-day .scene__sun{filter:brightness(1.14) saturate(.8);box-shadow:0 0 0 26px rgba(255,247,218,.22),0 0 0 66px rgba(255,247,218,.12),0 0 130px 46px rgba(255,241,196,.55)}
.is-day .jg--far{filter:brightness(.98)}
.is-day .jg--mid{filter:brightness(1.14)}
.is-day .jg__bamboo{filter:brightness(1.06)}
.is-day .house__glow{opacity:.2}
.is-day .fly{display:none}
.is-day .scene__kicker{color:#FFE9B0}

/* фото spa сразу после первого экрана; единый тёплый тон и лёгкое зерно, чтобы кадры не рябили цветами */
.spa-gal{padding-bottom:28px}
.spa-gal__head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px}
.spa-gal__head .t-lg{max-width:760px}
.spa-gal .round-btn:not(.round-btn--blue){border-color:var(--sm-line);color:var(--sm-brown)}
.spa-gal__track{gap:16px}
.spa-gal__it{position:relative;flex:0 0 auto;height:clamp(240px,calc(29vw / var(--zf,1)),420px);border-radius:26px;overflow:hidden;background:var(--sm-brown-2);scroll-snap-align:start}
.spa-gal__it a{display:block;height:100%}
.spa-gal__it img{display:block;height:100%;width:100%;object-fit:cover;filter:sepia(.3) saturate(.8) contrast(.97) brightness(.95);transition:filter .5s,transform .7s}
.spa-gal__it a::before{content:"";position:absolute;inset:0;z-index:1;background:#7A4A22;mix-blend-mode:color;opacity:.34;transition:opacity .5s;pointer-events:none}
.spa-gal__it a::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.5;background:linear-gradient(180deg,rgba(53,32,15,0) 55%,rgba(53,32,15,.38)),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .21 0 0 0 0 .13 0 0 0 0 .06 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.spa-gal__it:hover img{filter:none;transform:scale(1.03)}
.spa-gal__it:hover a::before{opacity:0}

@media (max-width:1100px){
  .scene__long{display:none}
  .scene__minibtn{font-size:10px;letter-spacing:0;height:38px}
}
@media (max-width:860px){
  .scene{--hw:min(calc(118vw / var(--zf,1)),calc((calc(100svh / var(--zf,1)) - 356px) * 1.24))}
  .scene__kicker{display:flex;font-size:10px;letter-spacing:.1em;padding-bottom:4px}
  .scene__count{font-size:12px;padding-top:4px}
  .scene__mini{display:none}
  .scene__el--big{left:-1%;width:calc(26vw / var(--zf,1))}
  .scene__el--baby{right:5%;width:calc(21vw / var(--zf,1))}
  .scene__nav button{flex:0 0 auto;height:38px;padding:0 14px;display:inline-flex;align-items:center;border-radius:10px;background:var(--sm-blue);font-family:var(--sm-font-display);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--sm-on-dark);white-space:nowrap}
  .spa-gal__head .carousel__nav{display:none}
  .spa-gal__track{gap:10px}
  .spa-gal__it{border-radius:18px}
}
@media (max-width:860px) and (min-width:601px){
  .scene{--hw:min(calc(96vw / var(--zf,1)),calc((calc(100svh / var(--zf,1)) - 368px) * 1.24))}
}
/* днём голубое слово заголовка сливалось бы с небом */
.scene__h1 span{transition:color 1.1s ease}
.is-day .scene__h1 span{color:#FFE08A}
.scene__btns .btn{font-size:14.5px;padding:0 12px;letter-spacing:0}
.scene__minibtn{font-size:10.5px}
@media (max-width:860px){
  .scene__btns .btn{font-size:clamp(11px,calc(3.2vw / var(--zf,1)),15px)}
  .scene__nav{padding-left:70px}   /* слева — кнопка музыки */
}
@media (max-width:860px) and (min-width:601px){ .scene__nav{padding-left:var(--g)} }
@media (max-width:600px){ .scene__sunbtn{top:188px} }

/* ===== иллюстрации заказчика 07.10: сцена тайского массажа справа от домика, слоны — слева ===== */
.scene__massage{right:-1%;bottom:1.2%;width:29%;pointer-events:auto;filter:drop-shadow(0 10px 12px rgba(0,0,0,.35));transition:transform .5s cubic-bezier(.2,.7,.2,1),filter .3s}
.scene__massage:hover{filter:drop-shadow(0 10px 12px rgba(0,0,0,.35)) brightness(1.06)}
.scene__massage:focus-visible{outline:2px solid var(--sm-blue);outline-offset:4px}
.scene__el--big{left:1.5%;width:15%}
.scene__el--baby{right:auto;left:16%;width:10.5%;bottom:.6%}
.scene__el--baby .scene__elbtn img{scale:-1 1}
.scene__stones{display:none}
.scene__pouches,.scene__orchid{display:none}
.jg__bamboo{width:min(calc(15vw / var(--zf,1)),220px);bottom:3%}
@media (max-width:860px){
  .scene__massage{right:-3%;bottom:-2.5%;width:calc(47vw / var(--zf,1))}
  .scene__el--big{left:-2%;width:calc(24vw / var(--zf,1))}
  .scene__el--baby{left:calc(21vw / var(--zf,1));width:calc(16vw / var(--zf,1));bottom:-3%}
  .jg__bamboo{width:calc(26vw / var(--zf,1));bottom:150px}
}

/* ===== «живые» элементы заказчика (вторая партия 07.10): лепестки лотоса в воздухе, сидящий слоник, живой бамбук ===== */
/* 29.10: заказчица просит вернуть падающий рис вместо лепестков — у зёрен остаётся исходный вид (светлое зерно), лепесток только у .burst */
.burst{border-radius:0;box-shadow:none;background:url(/static/samui/decor/petal.webp) center/contain no-repeat;width:22px;height:20px}
.scene__el--baby .scene__elbtn img{scale:-1 1}
.scene__el--baby{left:16.5%;width:9.5%}
.scene__massage{width:31%;right:-1.5%;bottom:.8%}
.jg__bamboo{width:min(calc(13vw / var(--zf,1)),190px);bottom:2%}
@media (max-width:860px){
  .scene__massage{width:calc(52vw / var(--zf,1));right:-4%}
  .scene__el--baby{left:calc(21vw / var(--zf,1));width:calc(15vw / var(--zf,1))}
  .jg__bamboo{width:calc(22vw / var(--zf,1));bottom:150px}
}

/* ===== hero из «живых» элементов заказчика (07.10, вторая итерация): бамбуковый домик с настоящими фонарями, арека вместо силуэтов, тиковые слоны ===== */
.jg--areca{bottom:9%}
.jg--areca img{filter:drop-shadow(0 8px 10px rgba(20,11,5,.35)) saturate(.92)}
.scene:not(.is-day) .jg--areca{filter:brightness(.72) saturate(.85) sepia(.18)}
.is-night .jg--areca{filter:brightness(.42) saturate(.6) hue-rotate(20deg)}
.is-day .jg--areca{filter:none}
.house image.house__lit{filter:drop-shadow(0 0 7px rgba(255,196,104,.75))}
.is-night .house image.house__lit{filter:drop-shadow(0 0 12px rgba(255,206,120,.95))}
.scene__lotus{left:29.5%;bottom:.4%;width:6.2%;pointer-events:none;filter:drop-shadow(0 6px 8px rgba(0,0,0,.35))}
.scene__compress{right:31.5%;bottom:.3%;width:4.2%;pointer-events:none;filter:drop-shadow(0 6px 8px rgba(0,0,0,.35))}
.scene__el--big{left:1%;width:16%}
.scene__el--baby{left:17%;width:9%}
.scene__tip{font-size:12.5px;line-height:1.4;color:rgba(243,231,211,.78)}
@media (max-width:1100px){ .scene__tip{display:none} }
@media (max-width:860px){
  .jg--areca{bottom:170px}
  .jg--areca img{width:calc(46vw / var(--zf,1))!important;display:block!important}
  .jg--areca img:nth-child(3),.jg--areca img:nth-child(4),.jg--areca img:nth-child(7),.jg--areca img:nth-child(8){display:none!important}
  .scene__lotus,.scene__compress{display:none}
  .scene__el--big{left:-3%;width:calc(25vw / var(--zf,1))}
  .scene__el--baby{left:calc(20vw / var(--zf,1));width:calc(14vw / var(--zf,1))}
}
@media (max-width:860px){
  .jg--areca{bottom:250px}
  .jg--areca img{width:calc(64vw / var(--zf,1))!important}
  .jg--areca img:nth-child(1){left:-22%!important}.jg--areca img:nth-child(2){left:-26%!important}
  .jg--areca img:nth-child(5){left:58%!important}.jg--areca img:nth-child(6){left:62%!important}
}
@media (max-width:860px) and (min-width:601px){
  .scene__massage{width:calc(38vw / var(--zf,1));right:-2%}
  .scene__el--big{width:calc(18vw / var(--zf,1));left:0}
  .scene__el--baby{left:calc(17vw / var(--zf,1));width:calc(11vw / var(--zf,1))}
  .scene__nav{padding-left:76px;justify-content:flex-start}
}

/* лучи от солнца: медленно вращаются, к краям гаснут */
.scene__rays{position:absolute;left:50%;top:54%;width:min(calc(150vh / var(--zf,1)),calc(125vw / var(--zf,1)));aspect-ratio:1;translate:-50% -56%;border-radius:50%;pointer-events:none;opacity:.55;
  background:repeating-conic-gradient(from 0deg,rgba(255,236,178,.20) 0 5deg,rgba(255,236,178,0) 5deg 15deg);
  -webkit-mask-image:radial-gradient(closest-side,transparent 30%,#000 38%,transparent 96%);mask-image:radial-gradient(closest-side,transparent 30%,#000 38%,transparent 96%);transition:opacity 1.1s ease}
.is-day .scene__rays{opacity:.75;background:repeating-conic-gradient(from 0deg,rgba(255,252,232,.26) 0 5deg,rgba(255,252,232,0) 5deg 15deg)}
.is-night .scene__rays{opacity:0}
/* звёзды — только ночью */
.scene__stars{position:absolute;inset:0;opacity:0;transition:opacity 1.1s ease}
.is-night .scene__stars{opacity:1}
.scene__stars i{position:absolute;left:var(--x);top:var(--y);width:var(--sz);height:var(--sz);border-radius:50%;background:#EAF4FF;box-shadow:0 0 4px 1px rgba(214,236,255,.55)}
/* дальняя роща: бамбук и арека, приглушены под цвет неба — ощущение глубины без размытия */
.jg--grove{bottom:19%}
.jg--grove img{transform-origin:50% 100%}
.jg--grove{filter:brightness(.5) saturate(.55) sepia(.45);opacity:.9}
.is-day .jg--grove{filter:brightness(1.08) saturate(.5) contrast(.85);opacity:.62}
.is-night .jg--grove{filter:brightness(.2) saturate(.5) hue-rotate(150deg);opacity:.95}
/* дымка у горизонта и дальняя дюна */
.scene__mist{position:absolute;left:0;right:0;bottom:12%;height:26%;pointer-events:none;background:linear-gradient(180deg,rgba(240,176,96,0),rgba(240,176,96,.34) 55%,rgba(240,176,96,0));transition:opacity 1.1s ease}
.is-day .scene__mist{background:linear-gradient(180deg,rgba(255,250,236,0),rgba(255,250,236,.5) 55%,rgba(255,250,236,0))}
.is-night .scene__mist{background:linear-gradient(180deg,rgba(60,130,160,0),rgba(60,130,160,.28) 55%,rgba(60,130,160,0))}
.scene__hills--back{height:36%;fill:#7A4A1F;transition:fill 1.1s ease}
.is-day .scene__hills--back{fill:#D9B983}
.is-night .scene__hills--back{fill:#0E2230}
.is-day .scene__hills--near{fill:#3A2212}
@media (prefers-reduced-motion:no-preference){
  .scene__rays{animation:rays 160s linear infinite}
  @keyframes rays{to{rotate:360deg}}
  .scene__stars i{animation:twinkle var(--d) ease-in-out var(--w) infinite}
  @keyframes twinkle{0%,100%{opacity:.25}50%{opacity:1}}
}
@media (max-width:860px){
  .scene__rays{top:auto;bottom:176px;width:calc(190vw / var(--zf,1));translate:-50% 28%}
  .jg--grove{bottom:230px}
  .jg--grove img{width:calc(var(--mw,calc(22vw / var(--zf,1))))!important}
  .jg--grove img:nth-child(2n){display:none}
  .scene__mist{bottom:160px;height:200px}
  .scene__hills--back{display:block;height:300px}
}

/* ===== варианты первого экрана (/hero-varianty): сала, бамбуковая хижина, деревня ===== */
.hz--mass image{transition:filter .3s}
.hz--mass:hover image,.hz--mass:focus-visible image{filter:brightness(1.07)}
.hz--hut{transition:filter .25s}
.hz--hut:hover,.hz--hut:focus-visible{filter:brightness(1.12) drop-shadow(0 0 9px rgba(255,214,130,.6))}
/* 1 · сала: массаж внутри павильона, слоны по обе стороны */
.scene--sala .scene__massage,.scene--sala .scene__compress,.scene--sala .scene__lotus{display:none}
.scene--sala .scene__el--big{left:2%;width:17%}
.scene--sala .scene__el--baby{left:auto;right:4%;width:11.5%}
.scene--sala .scene__el--baby .scene__elbtn img{scale:1 1}
/* 3 · деревня: три хижины занимают всю сцену */
.scene--village .scene__house{left:7%;right:7%}
.scene--village .scene__massage{width:20%;right:-1.5%}
.scene--village .scene__el--baby,.scene--village .scene__lotus,.scene--village .scene__compress{display:none}
.scene--village .scene__el--big{left:-.5%;width:11.5%}
@media (max-width:860px){
  .scene--sala .scene__el--big{left:-4%;width:calc(24vw / var(--zf,1))}
  .scene--sala .scene__el--baby{right:-1%;width:calc(17vw / var(--zf,1))}
  .scene--village .scene__house{left:50%;right:auto}
  .scene--village .scene__massage{width:calc(34vw / var(--zf,1));right:-3%}
  .scene--village .scene__el--big{left:-4%;width:calc(19vw / var(--zf,1))}
}
/* переключатель вариантов */
.hv .music,.hv .dots,.hv .cookie{display:none!important}
.hv-bar{position:fixed;left:50%;bottom:14px;translate:-50% 0;z-index:65;display:flex;flex-wrap:wrap;justify-content:center;gap:4px;padding:6px;max-width:calc(calc(100vw / var(--zf,1)) - 16px);border-radius:26px;background:rgba(31,18,8,.9);box-shadow:0 10px 30px rgba(0,0,0,.4)}
.hv-bar a,.hv-bar button{height:38px;padding:0 14px;border-radius:999px;display:inline-flex;align-items:center;font:600 12px/1 var(--sm-font-display);letter-spacing:.03em;text-transform:uppercase;color:var(--sm-on-dark);white-space:nowrap;transition:background .2s}
.hv-bar a:hover,.hv-bar button:hover{background:rgba(243,231,211,.14)}
.hv-bar a.is-on{background:var(--sm-blue)}
.hv-bar__sep{width:1px;margin:6px 4px;background:rgba(243,231,211,.25)}
@media (max-width:600px){ .hv-bar a,.hv-bar button{height:34px;padding:0 10px;font-size:10.5px} .hv .scene__nav{visibility:hidden} }
/* на странице вариантов переключатель стоит под сценой и ничего не закрывает */
.hv .scene{height:calc(calc(100vh / var(--zf,1)) - 66px);min-height:560px}
.hv-bar{position:static;translate:none;width:fit-content;margin:8px auto;flex-wrap:nowrap}
.scene--sala .scene__tip{display:none}
/* открытые павильоны (25.10): чуть крупнее домика, бунгало для двоих — шире */
.house--pv .curtain{transition:transform .5s}
@media (max-width:860px){ .hv .scene{height:calc(calc(100svh / var(--zf,1)) - 96px)} .hv-bar{flex-wrap:wrap;border-radius:22px} }

/* вкладки категорий на главной — как кнопки категорий в каталоге: значок + короткое название, в два ряда (правки 22.10) */
.programs__tabs.seg--icons{flex-wrap:wrap;gap:10px}
.programs__tabs.seg--icons .seg__btn{flex:1 1 calc(20% - 10px);margin:0;border-radius:36px!important;height:64px;gap:10px;padding:0 16px;font-size:15px;line-height:1.12;text-align:left;justify-content:flex-start}
.programs__tabs .seg__btn span{min-width:0}
.programs__tabs .seg__ic{width:26px;height:26px;flex:none}
@media (max-width:1280px){ .programs__tabs.seg--icons .seg__btn{flex-basis:calc(25% - 10px)} }
@media (max-width:600px){
  .programs__tabs.seg--icons{flex-wrap:wrap;overflow:visible;margin:0;padding:0;gap:8px}
  .programs__tabs.seg--icons .seg__btn{flex:1 1 calc(50% - 8px);height:52px;font-size:12.5px;padding:0 10px;gap:8px}
}

/* хижина вместо домика-храма (правки 27.10): слой из референса заказчицы + живая тайка с ваем */
.house--art image{image-rendering:auto}
.house--vec .thai,.house--art .thai{filter:drop-shadow(0 10px 14px rgba(40,20,8,.35))}
.house--vec .thai__top,.house--art .thai__top{transform-box:view-box}
.hz--thai:hover .thai,.hz--thai:focus-visible .thai{filter:drop-shadow(0 0 12px rgba(255,214,130,.7))}
.hz--logo:hover,.hz--logo:focus-visible{filter:brightness(1.06)}
.house--vec .hz--win:hover,.house--vec .hz--win:focus-visible{filter:none}
.house--vec .hz__in{mix-blend-mode:screen}
@media (prefers-reduced-motion:no-preference){
  .house--vec .thai__top,.house--art .thai__top{animation:wai 7s ease-in-out 1.2s infinite}
  .hz--thai:hover .thai__top{animation:wai-now 2.2s ease-in-out infinite}
  @keyframes wai{0%,48%,100%{transform:none}60%,70%{transform:translateY(3px) scale(1.012,.915)}}
  @keyframes wai-now{0%,100%{transform:none}35%,60%{transform:translateY(3px) scale(1.012,.915)}}
  .house--art .house__glow circle{animation:lamp 3.6s ease-in-out infinite}
}
@media (max-width:860px){.scene:has(.house--art) .scene__massage,.scene:has(.house--vec) .scene__massage{display:none}}

/* примеры фона для заказчицы (30.10): ?fon=1 — полосы интерьера между блоками, ?fon=2 — размытый интерьер под всем сайтом */
.fon-band{position:relative;height:clamp(300px,52vh,560px);overflow:hidden;display:flex;align-items:flex-end;color:#FFF6E6}
.fon-band picture,.fon-band img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.fon-band img{filter:blur(2px) saturate(.75) brightness(.78);transform:scale(1.04)}
.fon-band::after{content:"";position:absolute;inset:0;background:linear-gradient(var(--sm-sand) 0,rgba(0,0,0,0) 22%,rgba(0,0,0,0) 55%,rgba(30,16,6,.55) 85%,var(--sm-sand) 100%)}
.fon-band__in{position:relative;z-index:1;width:100%;max-width:calc(1440px + 2 * var(--g));margin:0 auto;padding-left:var(--g);padding-right:var(--g);padding-bottom:clamp(40px,8vh,90px)}
.fon-band__t{margin:0;font:700 clamp(30px,4.2vw,62px)/1.04 var(--sm-font-display);text-transform:uppercase;max-width:16ch;text-shadow:0 2px 18px rgba(0,0,0,.45)}
.fon-band__p{margin:14px 0 0;max-width:46ch;font-size:clamp(15px,1.2vw,19px);opacity:.92;text-shadow:0 1px 10px rgba(0,0,0,.5)}
body.fon-2::before{content:"";position:fixed;inset:-40px;z-index:-2;background:url(/static/samui/img/int-lounge-1600.webp) center/cover;filter:blur(16px) saturate(.8)}
body.fon-2::after{content:"";position:fixed;inset:0;z-index:-1;background:linear-gradient(rgba(239,227,208,.8),rgba(239,227,208,.86))}
body.fon-2{background:transparent}
.fon-2 .bg-photo--sand{opacity:.35}

/* правки 31.10: подпись над заголовком — крупнее и белая (золотая плохо читалась); кнопка «акции» со значком % */
.scene__kicker,.is-night .scene__kicker,.is-day .scene__kicker{font-size:15px;letter-spacing:.12em;color:#fff;text-shadow:0 1px 10px rgba(20,11,5,.6)}
.scene__promo{position:relative;gap:12px}
.scene__promo-ic{width:22px;height:22px;flex:none;stroke:#E0BE7E;stroke-width:2;fill:none}
@media (max-width:860px){
  .scene__kicker,.is-night .scene__kicker,.is-day .scene__kicker{font-size:12px;letter-spacing:.1em}
  .scene{--hw:min(calc(118vw / var(--zf,1)),calc((calc(100svh / var(--zf,1)) - 366px) * 1.24))}
  .scene__btns{flex-wrap:wrap}
  .scene__btns .scene__promo{flex:1 1 100%;height:44px}
}
@media (max-width:860px) and (min-width:601px){
  .scene{--hw:min(calc(96vw / var(--zf,1)),calc((calc(100svh / var(--zf,1)) - 378px) * 1.24))}
}
/* подпись над заголовком — ниже строки с часами и адресом в шапке */
@media (min-width:1101px){.scene__title{top:calc(var(--sm-header) + 30px)}}

/* ── правки 02.11 (маркетолог) ── */
/* компьютер: кнопки — слева (справа их не замечали), заголовок — справа; верх у обоих на одной линии */
@media (min-width:861px){
  .scene__title{left:auto;right:var(--g);align-items:flex-end;text-align:right}
  .scene__h1{margin-left:auto}
  .scene__cta{left:var(--g);right:auto;top:calc(var(--sm-header) + 8px);width:min(330px,calc(26vw / var(--zf,1)));text-align:left}
}
@media (min-width:1101px){.scene__cta{top:calc(var(--sm-header) + 30px)}}
/* телефон: «записаться» и «оставить заявку» — одна под другой во всю ширину, без прокрутки; снизу втрое больше воздуха */
@media (max-width:860px){
  .scene__nav{flex-direction:column;gap:8px;overflow:visible;margin:10px 0 0;padding:0 0 42px;align-self:stretch}
  .scene__nav a,.scene__nav button{flex:none;width:100%;height:46px;justify-content:center;border-radius:12px;font-size:15px;letter-spacing:.01em;text-transform:none}
  .scene{--hw:min(calc(118vw / var(--zf,1)),calc((calc(100svh / var(--zf,1)) - 430px) * 1.24))}
}
@media (max-width:860px) and (min-width:601px){
  .scene__nav{max-width:560px;margin:10px auto 0;width:100%;padding:0 0 42px}
  .scene{--hw:min(calc(96vw / var(--zf,1)),calc((calc(100svh / var(--zf,1)) - 440px) * 1.24))}
}
/* галерея: фото одинаковые и целиком помещаются в экран — 3 / 2 / 1 в ряд; клик открывает фото крупно, а не уводит со страницы */
.spa-gal__it{flex:0 0 calc((100% - 32px) / 3);height:auto;aspect-ratio:4/3}
@media (max-width:1100px){ .spa-gal__it{flex-basis:calc((100% - 16px) / 2)} }
@media (max-width:600px){ .spa-gal__it{flex-basis:100%;aspect-ratio:4/3.3} .spa-gal__track{gap:16px} }
.programs__pick{align-self:flex-start;gap:12px}
.programs__pick svg{width:20px;height:20px}
@media (max-width:600px){ .programs__pick{align-self:stretch} }