#krepost-landing main > section[id]{scroll-margin-top:24px}
/* Let vertical page scrolling and browser pinch zoom pass through the map. */
#krepost-landing .kl-map-stage[data-map-gestures="disabled"] .kl-map-live,
#krepost-landing .kl-map-stage[data-map-gestures="disabled"] .kl-map-live *{touch-action:pan-y pinch-zoom!important}
#krepost-landing .kl-header nav a[aria-current="location"]{text-decoration:underline;text-decoration-color:var(--kl-accent);text-underline-offset:6px;text-decoration-thickness:2px}
#krepost-landing section:focus:not(:focus-visible){outline:none}
/* Stationary masks keep the type and image frames in their original layout. */
#krepost-landing .kl-title-mask{display:block;overflow:hidden;padding-bottom:.12em;margin-bottom:-.12em}
#krepost-landing .kl-title-content{display:block}
#krepost-landing .kl-discount-mask{overflow:hidden;padding-bottom:4px;margin-bottom:-4px}
#krepost-landing .kl-hero-scene img,#krepost-landing .kl-product-image img,#krepost-landing .kl-work-photo img{transform-origin:50% 50%}
/* Rules draw once; backgrounds, questions and form controls stay still. */
#krepost-landing .kl-draw-rule{position:relative}
#krepost-landing .kl-draw-rule::before{content:"";position:absolute;top:-2px;left:0;right:0;height:2px;background:var(--kl-accent);transform-origin:left;transform:scaleX(1);pointer-events:none;transition:transform 1s cubic-bezier(.22,.68,.18,1)}
#krepost-landing .kl-draw-rule.kl-rule-pending::before{transform:scaleX(0);transition:none}
#krepost-landing .kl-steps article.kl-draw-rule{border-top-color:transparent}
#krepost-landing .kl-form-rule::before{top:-1px;left:-1px;right:-1px}
#krepost-landing .kl-faq-list .kl-faq-rule{border-bottom-color:transparent}
#krepost-landing .kl-faq-rule::before{top:auto;bottom:-1px;height:1px;background:var(--kl-border)}
/* One quiet light pass accompanies the brand's first entrance. */
#krepost-landing .kl-about-brand{position:relative;overflow:hidden}
#krepost-landing .kl-about-brand::after{content:"";position:absolute;inset:-30% -60%;background:linear-gradient(115deg,transparent 44%,#ffffff05 48%,#ffffff14 50%,#ffffff05 52%,transparent 56%);transform:translateX(-40%);opacity:0;pointer-events:none}
#krepost-landing .kl-about-brand.kl-brand-shimmer::after{animation:kl-brand-shimmer 1s cubic-bezier(.22,.68,.18,1)}
@keyframes kl-brand-shimmer{0%{transform:translateX(-40%);opacity:0}20%,75%{opacity:.6}100%{transform:translateX(40%);opacity:0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}#krepost-landing .kl-draw-rule::before{transition:none;transform:scaleX(1)}#krepost-landing .kl-about-brand.kl-brand-shimmer::after{animation:none}}

/* Palette-aware custom selection. The native select only retains the form value. */
#krepost-landing .kl-select-label{display:block;font-size:11px;color:var(--kl-text)}
#krepost-landing .kl-custom-select{position:relative;margin:7px 0 15px}
#krepost-landing .kl-form .kl-custom-select select[hidden]{display:none}
#krepost-landing :is(.kl-form,.kl-contact-form) :is(input,textarea,select,.kl-select-trigger):focus{outline:2px solid var(--kl-accent);outline-offset:2px}
#krepost-landing :is(.kl-form,.kl-contact-form) :is(input:not([type=radio]),textarea,select,.kl-select-trigger):focus{border-color:var(--kl-accent)}
#krepost-landing :is(.kl-form,.kl-contact-form) button:focus-visible{outline:2px solid var(--kl-accent);outline-offset:2px}
#krepost-landing .kl-select-trigger{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:43px;border:1px solid var(--kl-border);border-radius:0;padding:10px 16px 10px 10px;background:var(--kl-bg);color:var(--kl-text);font-size:12px;text-align:left;cursor:pointer}
#krepost-landing .kl-select-trigger:hover{border-color:var(--kl-muted)}
#krepost-landing .kl-select-trigger:focus-visible{outline:2px solid var(--kl-accent);outline-offset:2px}
#krepost-landing .kl-select-trigger[aria-expanded="true"]{border-color:var(--kl-accent)}
#krepost-landing .kl-select-chevron{width:7px;height:7px;border-right:1.5px solid var(--kl-muted);border-bottom:1.5px solid var(--kl-muted);transform:rotate(45deg) translateY(-2px);flex-shrink:0}
#krepost-landing .kl-select-trigger[aria-expanded="true"] .kl-select-chevron{transform:rotate(225deg) translate(-2px,-1px)}
#krepost-landing .kl-select-options{position:absolute;top:calc(100% + 5px);left:0;right:0;z-index:5;list-style:none;margin:0;padding:5px;background:var(--kl-bg);border:1px solid var(--kl-border);box-shadow:0 12px 28px #00000014}
#krepost-landing .kl-select-options [role="option"]{position:relative;margin:0;padding:11px 32px 11px 10px;color:var(--kl-text);font-size:12px;line-height:1.5;cursor:pointer}
#krepost-landing .kl-select-options [data-active]{background:var(--kl-soft);box-shadow:inset 2px 0 var(--kl-accent)}
#krepost-landing .kl-select-options [aria-selected="true"]::after{content:'✓';position:absolute;right:11px;top:11px;color:var(--kl-accent)}
@media(max-width:620px){#krepost-landing .kl-select-trigger,#krepost-landing .kl-select-options [role="option"]{min-height:46px;font-size:16px}}

/* The map remains behind the sharp preview until its visible tiles are ready. */
#krepost-landing .kl-map-live{position:absolute;inset:0;opacity:0;pointer-events:none;transition:opacity 1s ease}
#krepost-landing .kl-map-stage.is-ready .kl-map-live{opacity:1;pointer-events:auto}
#krepost-landing .kl-map-live a[href*="tech.yandex.ru/maps/mapsapi/"]{display:none}
#krepost-landing .kl-map-preview-link{position:absolute;inset:0}
#krepost-landing .kl-map-stage.is-ready .kl-map-preview-link{display:none}
#krepost-landing .kl-map-loader{position:absolute;z-index:2;left:14px;bottom:14px;display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;max-width:calc(100% - 28px);padding:11px 14px;background:var(--kl-bg);color:var(--kl-text);border:1px solid var(--kl-border);box-shadow:0 3px 12px #0001;font-size:11px}
#krepost-landing .kl-map-loader[hidden]{display:none}
/* Loading announcements stay available to screen readers without a visible notice. */
#krepost-landing .kl-map-loader .kl-map-loading{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;padding:0;border:0;background:none}
#krepost-landing .kl-map-loader a{color:var(--kl-accent);font-weight:600}
#krepost-landing .kl-map-retry{border:0;background:none;color:var(--kl-accent);padding:0;text-align:left;cursor:pointer;font-size:11px}
#krepost-landing .kl-map-zoom{position:absolute;right:12px;top:12px;z-index:2;box-shadow:0 2px 10px #0002}
#krepost-landing .kl-map-zoom button{display:block;width:38px;height:38px;border:1px solid var(--kl-border);background:var(--kl-bg);color:var(--kl-text);font-size:24px;line-height:1;cursor:pointer}
#krepost-landing .kl-map-zoom button+button{border-top:0}
#krepost-landing .kl-map-marker{display:block;position:relative;transform:translate(-50%,-100%);padding:9px 12px;background:var(--kl-accent);color:var(--kl-button);box-shadow:0 3px 10px #0002;white-space:nowrap;font-size:12px;font-weight:600;border-radius:3px}
#krepost-landing .kl-map-marker::after{content:'';position:absolute;left:50%;top:100%;margin-left:-5px;border:5px solid transparent;border-top-color:var(--kl-accent)}
@media(prefers-reduced-motion:reduce){#krepost-landing .kl-map-live{transition:none}}