/* Карта экскурсий /karta (Pages\MapPage), версия 2: карта Leaflet с зумом; без JS — схема Индии в том же поле */
/* высота карты на ПК — до низа первого экрана (--kt: верх карты при открытии + отступ снизу); телефон — в @media ниже */
.karta{--pin:32px;--tap:44px;--kt:246px;--kh:clamp(360px,calc(100vh - var(--kt)),1000px)}
@supports (height:100dvh){.karta{--kh:clamp(360px,calc(100dvh - var(--kt)),1000px)}}
.k-head{padding-bottom:6px}
.k-skip{display:inline-block;margin-bottom:8px;font-weight:600}
.k-skip:not(:focus){position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.k-bar{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin:4px 0 14px}
.k-views{display:flex;gap:6px;margin-left:auto}
.k-view{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 16px;border:1.5px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink);font-size:15px;font-weight:600;text-decoration:none}
.k-view .n{font-weight:400;opacity:.65}
.k-view:hover{border-color:var(--ink);color:var(--ink)}
.k-view[aria-pressed=true]{border-color:var(--ink);background:var(--ink);color:#fff}
.k-stage{position:relative}
/* поле карты: размер задаёт только CSS — схема и карта Leaflet в одном и том же поле, без сдвига вёрстки */
.k-map{position:relative;display:flex;align-items:center;justify-content:center;height:var(--kh);margin:0;border:1px solid var(--line);border-radius:14px;overflow:hidden;isolation:isolate;background:var(--sea-tint)}
.k-fb{position:relative;flex:none;width:min(100%,calc(var(--kh)*var(--w)/var(--h)));aspect-ratio:var(--w)/var(--h);max-height:100%;container:ki/inline-size}
.k-base{position:absolute;inset:0;width:100%;height:100%}
.k-base *{vector-effect:non-scaling-stroke}
.k-land{fill:var(--card);fill-opacity:1;stroke:#8FA6A3;stroke-width:1px;stroke-linejoin:round}
.k-st{fill:none;stroke:#B9CCC8;stroke-width:.8px}
.k-isl{stroke:#8FA6A3;stroke-width:3px;stroke-linecap:round}
.k-frame{fill:rgba(242,160,7,.12);stroke:var(--marigold);stroke-width:2px}
.k-sc{stroke:var(--ink-2);stroke-width:2px}
.k-gl{stroke:var(--marigold-deep);stroke-width:1.5px}
.k-lead{stroke:var(--ink-2)}
.k-real{stroke:var(--ink);stroke-width:6px;stroke-linecap:round}
.k-l,.k-deco{position:absolute;inset:0;pointer-events:none}
.k-l a{pointer-events:auto}
@container ki (max-width:539.98px){.k-w{display:none}}
@container ki (min-width:540px){.k-n{display:none}}
@supports not (container-type:inline-size){.k-w{display:none}}
.k-l [style],.k-sc-lb{position:absolute;left:calc(var(--x)*.1%);top:calc(var(--y)*.1%)}
.k-l .k-pin,.k-l .k-dot,.k-ent{transform:translate(-50%,-50%)}
/* отметки: схема и карта Leaflet (там место и сдвиг задаёт Leaflet) */
.k-pin{display:grid;place-items:center;width:var(--tap);height:var(--tap);border-radius:50%;color:#fff;text-decoration:none}
.k-pin::before,.k-dot::before{content:"";position:absolute;inset:0;margin:auto;box-sizing:border-box;border-radius:50%}
.k-pin::before{width:var(--pin);height:var(--pin);background:var(--c,var(--ink-2));border:2px solid #fff;box-shadow:0 1px 4px rgba(16,42,49,.35)}
.k-pin>*{position:relative}
.k-pin svg{width:17px;height:17px}
.k-pin b{font:700 14px/1 var(--font-body)}
.k-pin:focus-visible{outline:3px solid var(--ink);outline-offset:-3px}
.k-mix{--c:var(--ink-2)}
.k-ax::after{content:"";position:absolute;inset:-7px;border-radius:50%;z-index:-1;background:radial-gradient(closest-side,#f2a00700 52%,#f2a00780 66%,#f2a00700)}
.k-dot{width:8px;height:8px}
.k-dot::before{width:8px;height:8px;background:#fff;border:2px solid var(--ink-2)}
a.k-dot,.k-lf .k-dot{width:24px;height:24px;border-radius:50%}
.k-mem::before{width:9px;height:9px;background:var(--ink-2);border-color:#fff}
.k-ent{display:flex;align-items:center;gap:5px;height:30px;padding:0 8px;border-radius:8px;background:var(--marigold);color:var(--ink);font:600 13px/1 var(--font-body);white-space:nowrap;text-decoration:none;box-shadow:0 1px 4px rgba(16,42,49,.3)}
.k-ent::after{content:"";position:absolute;inset:-7px 0}
.k-ent:focus-visible{outline:3px solid var(--ink);outline-offset:1px}
.k-ent-f{width:var(--tap);height:var(--tap);padding:0;background:none;box-shadow:none}
.k-ent-f::after{inset:0}
/* подписи (у карты Leaflet — внутри .k-lbm в точке места) */
.k-lbm{width:0;height:0}
.k-lbm>.k-lb{position:absolute;left:0;top:0}
.k-lb{--o:6px;white-space:nowrap;font:600 12px/1.3 var(--font-body);color:var(--ink);text-shadow:0 0 2px #fff,0 0 3px #fff;transform:translate(var(--o),-50%)}
.lb-l{transform:translate(calc(-100% - var(--o)),-50%)}
.lb-c{transform:translate(-50%,-50%)}
.lb-b{transform:translate(-50%,calc(var(--o) - 1px))}
.lb-t{transform:translate(-50%,calc(-100% - var(--o) + 1px))}
.lb-pin{--o:19px}
.lb-goa{--o:4px}
.lb-dot{--o:7px;font-size:11px;font-weight:400}
.lb-pt{font-size:11px;font-weight:400;color:var(--ink-2)}
.lb-beach,.lb-sea{font-style:italic}
.lb-pt::before{content:"";position:absolute;top:50%;left:-8.5px;width:5px;height:5px;margin-top:-2.5px;border-radius:50%;background:var(--ink-3)}
.lb-l::before{left:auto;right:-8.5px}
.lb-sea{font-size:11px;font-weight:400;color:#4F7D86}
.lb-state{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.lb-airport{color:var(--c-sea)}
.k-sc-lb{transform:translate(-50%,-140%);font-size:11px;line-height:1;color:var(--ink-2);white-space:nowrap}
/* под картой: «Показано», легенда, пометка */
.k-info{display:flex;flex-wrap:wrap;align-items:center;gap:8px 22px;margin-top:12px}
.k-info .count{margin:0;font-weight:600;color:var(--ink)}
.k-count:focus{outline:none}
.k-note{margin:0;font-size:13px;line-height:1.4;color:var(--ink-3)}
.k-lead2{display:none}
.k-legend{display:flex;flex-wrap:wrap;gap:8px 22px;margin:0;padding:0;list-style:none;font-size:13px;line-height:1.35;color:var(--ink-2)}
.k-legend li{display:flex;align-items:center;gap:8px}
@media (scripting:none){.karta .k-js,.karta .k-chips{display:none}} /* без скрипта чипы ничего не делают */
.k-lg{position:relative;flex:none;display:grid;place-items:center;width:30px;height:24px}
.k-lg.k-pin::before{width:22px;height:22px;border-width:1.5px}
.k-lg.k-pin svg{width:12px;height:12px}
.k-lg.k-pin b{font-size:11px}
.k-lg-line{width:30px;height:2px;background:linear-gradient(90deg,var(--ink-2) 40%,#0000 0 55%,var(--ink-2) 0 72%,#0000 0 86%,var(--ink-2) 0)}
/* карта Leaflet */
.k-lf{position:absolute;inset:0}
.k-lf .leaflet-pane>svg{max-width:none;max-height:none} /* site.css: img,svg{max-width:100%} — у своих слоёв Leaflet ширина 0 */
.k-map .leaflet-container{background:var(--sea-tint);font:400 12px/1.3 var(--font-body)}
.k-lf:focus-visible{outline:3px solid var(--marigold);outline-offset:-3px}
.k-lf .k-st{stroke-width:1px;stroke-dasharray:4 4}
.k-lf .k-isl{fill:var(--card);fill-opacity:1;stroke-width:1px}
.k-rt{fill:none;stroke:var(--c);stroke-width:3px;stroke-opacity:1;stroke-linecap:round;stroke-linejoin:round}
.k-fly{stroke-dasharray:6 7}
.k-map .leaflet-bar{border:0;border-radius:12px;box-shadow:0 1px 4px rgba(16,42,49,.3)}
.k-map .leaflet-bar a,.k-ctl button{display:grid;place-items:center;width:40px;height:40px;border:0;border-bottom:1px solid var(--line);background:var(--card);color:var(--ink);font:600 20px/1 var(--font-body);cursor:pointer}
.k-map .leaflet-bar a:last-child,.k-ctl button{border-bottom:0}
.k-map .leaflet-bar a:hover,.k-ctl button:hover{background:var(--paper-2);color:var(--ink)}
.k-map .leaflet-bar a:first-child{border-radius:12px 12px 0 0}
.k-map .leaflet-bar a:last-child{border-radius:0 0 12px 12px}
.k-ctl button{border-radius:12px}
.k-ctl svg{width:20px;height:20px}
.k-ctl .k-fs{display:flex;gap:6px;width:auto;padding:0 12px;font-size:14px}
.k-ctl .k-fs svg{width:18px;height:18px}
.k-map .leaflet-control-attribution{padding:1px 6px;background:rgba(255,255,255,.8);color:var(--ink-2);font-size:11px}
.k-map .leaflet-control-attribution a{color:var(--ink-2)}
.k-on,.k-hot{z-index:2000!important}
.k-on::before,.k-hot::before{box-shadow:0 0 0 3px var(--ink)}
.k-tip{--o:21px;width:max-content;max-width:220px;padding:4px 8px;border-radius:8px;background:var(--ink);color:#fff;text-shadow:none;white-space:normal}
/* на весь экран (свой режим: .k-full на .k-stage, прокрутка страницы закрыта) */
html.k-lock,html.k-lock body{overflow:hidden}
.k-full{position:fixed;inset:0;z-index:60;background:var(--paper)}
.k-full .k-map{height:100%;border:0;border-radius:0}
/* карточка и лист */
.k-sheet{position:absolute;z-index:6;width:320px;max-height:70vh;margin:0;padding:0;overflow:auto;border:1px solid var(--line);border-radius:16px;background:var(--card);color:var(--ink);box-shadow:var(--shadow)}
.k-sheet:not([open]){display:none}
.k-sheet::backdrop{background:none}
.k-sh-head{display:flex;gap:8px;padding:12px 8px 8px 16px}
.k-sh-title{flex:1;margin:6px 0 0;font:600 17px/1.25 var(--font-body)}
.k-x{flex:none;width:44px;height:44px;border:0;background:none;color:var(--ink);cursor:pointer}
.k-x svg{width:20px;height:20px}
.k-sh-body{padding:0 16px 16px}
.k-one .k-row{display:block;padding:0;border:0}
.k-one .k-th{width:100%;height:auto;max-height:22dvh;aspect-ratio:16/9;margin-bottom:10px}
/* кнопка карточки — у низа листа, пока до неё не прокрутили; пометка — после неё */
.k-cta{position:sticky;bottom:0;margin:4px -16px -16px;padding:10px 16px max(16px,env(safe-area-inset-bottom));background:var(--card)}
.k-cta::before{content:"";position:absolute;inset:auto 0 100%;height:12px;background:linear-gradient(#fff0,var(--card));pointer-events:none}
.k-cta+.k-note{margin-top:16px}
@media (prefers-reduced-motion:no-preference){.k-sheet[open]{animation:k-in .2s ease-out}}
@keyframes k-in{from{opacity:0;transform:translateY(10px)}}
/* список по местам */
.k-list{padding:36px 0 56px}
.k-list h2{margin:0 0 6px}
.k-group{margin-top:22px}
.k-group h3{margin:0 0 10px;font:600 19px/1.25 var(--font-display)}
.k-group .n{margin-left:4px;font:400 15px var(--font-body);color:var(--ink-3)}
.k-rows{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.k-row{display:flex;gap:12px;align-items:flex-start;padding:10px;border:1px solid var(--line);border-radius:14px;background:var(--card);scroll-margin-top:10px}
.k-row:target{border-color:var(--sea);box-shadow:0 0 0 2px var(--sea-tint)}
.k-th{position:relative;flex:none;display:grid;place-items:center;width:72px;height:72px;border-radius:10px;overflow:hidden;background:var(--c);color:#fff}
.k-th>svg{width:26px;height:26px}
.k-th .cover-photo{position:absolute;inset:0}
.k-rb{flex:1;min-width:0}
.k-name{display:block;font-size:16px;font-weight:600;line-height:1.3;color:var(--ink);text-decoration:none}
.k-name:hover{color:var(--sea);text-decoration:underline}
.k-where{margin:4px 0 0;font-size:13.5px;line-height:1.35;color:var(--ink-2)}
.k-meta{align-items:center}
.k-price{font-weight:600;color:var(--ink)}
.k-price small{font-size:13px;font-weight:400;color:var(--ink-2)}
.k-also{display:block;padding:8px 12px;font-size:14px;color:var(--ink-2);background:var(--paper-2);border-style:dashed}
.k-also a{color:var(--sea);font-weight:600}
@media (min-width:861px){
/* шапка страницы — строки постоянной высоты: карта целиком на первом экране, шрифт не сдвигает её */
.page-head.k-head{padding-block:12px 0}
.page-head.k-head .crumbs{margin-bottom:4px}
.page-head.k-head h1{margin:0 0 2px;font-size:30px;line-height:36px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.page-head.k-head .lead{max-width:none;margin:0;font-size:15px;line-height:22px}
.k-bar{margin:10px 0}
.k-rows{grid-template-columns:1fr 1fr}
.k-sh-body .k-rows{grid-template-columns:1fr}
.k-info .count{margin-right:auto}
.k-legend{order:2;flex-basis:100%}
.k-note{order:1}
}
@media (min-width:861px) and (max-width:1199px){.karta{--kt:322px}} /* лид в 2 строки, чипы и пресеты — в 2 ряда */
@media (max-width:860px){
.karta{--kh:max(min(360px,100vh - 150px),68vh)} /* боком — над и под картой есть где листать страницу */
@supports (height:100svh){.karta{--kh:max(min(360px,100svh - 150px),68svh)}}
.page-head.k-head .lead{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;margin:0;font-size:15px}
.k-lead2{display:block;margin:0;font-size:14px;color:var(--ink-2)}
.k-bar{display:block;margin-bottom:10px}
.k-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:-20px;padding-inline:20px}
.k-chips .chip{flex:none}
.k-views{margin:10px 0 0}
.k-map{margin-inline:-20px;border-width:1px 0;border-radius:0}
.k-full .k-map{margin:0;border:0}
.k-info{display:block}
.k-info>*+*{margin-top:10px}
.k-sheet{position:fixed;inset:auto 0 0;width:auto;max-width:none;max-height:55dvh;border-width:1px 0 0;border-radius:16px 16px 0 0}
.k-one .k-th{max-height:min(22dvh,55dvh - 290px)} /* фото — сколько оставит лист: цена и кнопка видны */
}
@media (max-width:860px) and (max-height:700px){ /* низкий экран: фото карточки — слева, как в списке */
.k-sh-head{padding-block:6px 2px}
.k-one .k-row{display:flex}
.k-one .k-th{width:96px;height:72px;max-height:none;margin:0}
.k-sh-body .k-price{display:block} /* цена переносится строкой, а не столбиками */
}
@media (max-width:860px) and (max-height:500px){ /* телефон боком: кнопка — справа от карточки */
.k-sh-body{display:flex;flex-wrap:wrap;align-items:center;column-gap:16px}
.k-sh-body .k-rows{flex:1 1 240px}
.k-cta{position:static;margin:0;padding:0}
.k-cta::before{content:none}
.k-cta .btn{width:auto}
.k-note{flex-basis:100%}
}