/* Contacts: an address and live map, section navigation and a readable directory. */
.vkc-directory { --vkc-ink:#193e45; --vkc-muted:#59777b; --vkc-line:#d6e5e0; --vkc-paper:#fff; --vkc-soft:#edf6f2; --vkc-accent:#087782; color:var(--vkc-ink); font:15px/1.65 Arial,sans-serif; min-width:0; }
.vkc-directory * { box-sizing:border-box; }
body.vkc-page .main-content { min-width:0; padding:0; background:transparent; border:0; box-shadow:none; }
.vkc-directory h2 { border:0; padding:0; }
.vkc-directory [hidden] { display:none!important; }
.vkc-directory a { color:var(--vkc-accent); text-underline-offset:4px; }
.vkc-directory a:focus-visible,.vkc-directory input:focus-visible { outline:3px solid #bc862a; outline-offset:4px; }
.vkc-directory .vkc-icon { display:block; flex-shrink:0; width:21px; height:21px; margin:0; }
.vkc-intro-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:24px; }
.vkc-hero { position:relative; overflow:hidden; isolation:isolate; background:#153f46; color:#e6f3f1; padding:34px; border-radius:16px; display:flex; flex-direction:column; min-height:366px; }
.vkc-hero::after { content:''; position:absolute; z-index:-1; width:350px; height:350px; border:1px solid #72b9ac26; box-shadow:0 0 0 30px #72b9ac08,0 0 0 60px #72b9ac06; border-radius:50%; right:-180px; top:-175px; }
.vkc-directory .vkc-eyebrow { display:block; font-size:10px; letter-spacing:1.7px; line-height:1.7; font-weight:700; color:var(--vkc-accent); }
.vkc-hero .vkc-eyebrow { color:#93cbc2; display:flex; align-items:center; gap:8px; }
.vkc-hero .vkc-eyebrow>span { width:6px; height:6px; flex:0 0 6px; border-radius:50%; background:#93cbc2; }
.vkc-directory .vkc-hero h1 { font-size:37px; line-height:1.16; letter-spacing:-1px; color:white; margin:23px 0 17px; text-indent:0; }
.vkc-hero p { color:#c5deda; font-size:14px; margin:0 0 26px; line-height:1.75; }
.vkc-hero-bottom { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:15px; padding-top:20px; border-top:1px solid #6ca39944; margin-top:auto; }
.vkc-hero-note { display:grid; gap:4px; font-size:11px; color:#b8d5d1; }
.vkc-hero-note strong { color:#fff; font-size:23px; font-weight:500; letter-spacing:.3px; white-space:nowrap; }
.vkc-directory .vkc-hero-bottom>a { display:flex; align-items:center; gap:9px; color:#d9efea; font-size:12px; text-decoration:none; padding:8px 0; }
.vkc-hero-bottom>a:hover { text-decoration:underline; }
.vkc-map-card { border:1px solid var(--vkc-line); border-radius:16px; overflow:hidden; background:var(--vkc-paper); display:flex; flex-direction:column; min-width:0; }
.vkc-map-viewport { flex:1; min-height:265px; position:relative; background:#e6eee9; }
.vkc-directory .vkc-map-viewport iframe { position:absolute; inset:0; width:100%!important; height:100%!important; max-width:none!important; border:0; display:block; margin:0; border-radius:0; }
.vkc-map-placeholder { display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:10px; min-height:265px; padding:30px; color:#527b77; }
.vkc-map-placeholder .vkc-icon { width:40px; height:40px; }.vkc-map-placeholder span { font-size:12px; }
.vkc-map-caption { display:flex; align-items:center; gap:12px; padding:18px 21px; min-height:90px; }
.vkc-map-caption>.vkc-icon { color:var(--vkc-accent); }
.vkc-map-caption>div { min-width:0; flex:1; }.vkc-map-caption strong { display:block; color:var(--vkc-ink); font-size:12px; margin-bottom:3px; }.vkc-map-caption span { color:var(--vkc-muted); font-size:12px; line-height:1.6; display:block; }
.vkc-map-caption>a { flex:0 0 36px; height:36px; display:grid; place-items:center; background:var(--vkc-soft); border-radius:50%; }.vkc-map-caption>a .vkc-icon { width:18px; transform:rotate(-40deg); }
.vkc-nav { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin:0 0 20px; }
.vkc-directory .vkc-nav a { display:flex; align-items:flex-start; gap:10px; background:var(--vkc-paper); border:1px solid var(--vkc-line); border-radius:10px; padding:17px 14px; font-size:12px; text-decoration:none; transition:border-color .15s,background .15s; }
.vkc-directory .vkc-nav a:hover { background:var(--vkc-soft); border-color:#85b8ae; }
.vkc-nav-number { color:#77a49c; font-size:12px; line-height:1.7; }.vkc-nav-label { min-width:0; flex:1; }.vkc-nav-label strong { display:block; color:var(--vkc-ink); font-size:12px; line-height:1.7; font-weight:600; }.vkc-nav-label small { display:block; color:var(--vkc-muted); margin-top:6px; font-size:10px; }
.vkc-nav .vkc-icon { width:14px; height:14px; margin-top:4px; }
.vkc-tools { display:flex; align-items:center; gap:22px; padding:18px 22px; border:1px solid var(--vkc-line); background:var(--vkc-paper); border-radius:10px; margin-bottom:34px; }
.vkc-tools label { flex:1; font-size:11px; font-weight:600; color:var(--vkc-muted); }
.vkc-search-field { position:relative; display:block; margin-top:8px; }.vkc-search-field>.vkc-icon { position:absolute; left:13px; top:14px; color:#6e9996; width:19px; height:19px; pointer-events:none; }
.vkc-tools input { display:block; width:100%; border:1px solid var(--vkc-line); border-radius:7px; background:var(--vkc-soft); padding:13px 14px 13px 42px; font:14px Arial,sans-serif; min-height:46px; color:var(--vkc-ink); }
.vkc-count { font-size:11px; color:var(--vkc-muted); padding:8px 12px; white-space:nowrap; background:var(--vkc-soft); border-radius:6px; margin-top:22px; }
.vkc-section { margin:0 0 38px; scroll-margin-top:95px; }
.vkc-directory .vkc-section h2 { font-size:22px; line-height:1.4; display:flex; align-items:center; gap:13px; margin:0 0 19px; color:var(--vkc-ink); letter-spacing:-.35px; }
.vkc-section h2>span { flex:0 0 32px; height:32px; border:1px solid var(--vkc-line); background:var(--vkc-soft); color:var(--vkc-accent); border-radius:8px; display:grid; place-items:center; font-size:12px; font-weight:400; }
.vkc-section h2::after { content:''; height:1px; background:var(--vkc-line); min-width:18px; flex:1; margin-left:5px; }
.vkc-section-description { color:var(--vkc-muted); font-size:14px; margin:0 0 18px; }
.vkc-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.vkc-card { border:1px solid var(--vkc-line); border-radius:12px; background:var(--vkc-paper); padding:24px; display:flex; flex-direction:column; min-width:0; overflow-wrap:anywhere; box-shadow:0 3px 10px #234a4103; transition:border-color .15s,box-shadow .15s; }
.vkc-card:hover { border-color:#a6c5bc; box-shadow:0 5px 18px #234a4108; }
.vkc-card--wide { grid-column:1/-1; }
.vkc-card--featured { border-color:#8bbfaf; background:var(--vkc-soft); box-shadow:inset 0 3px #3c8c79; }
.vkc-card-heading { display:flex; align-items:flex-start; gap:16px; margin-bottom:19px; }.vkc-card-heading>div { flex:1; min-width:0; }
.vkc-card-icon { display:grid; place-items:center; flex:0 0 39px; height:39px; border:1px solid var(--vkc-line); border-radius:10px; background:var(--vkc-soft); color:var(--vkc-accent); }
.vkc-card--featured .vkc-card-icon { background:#19796c; color:white; border-color:#19796c; }
.vkc-directory .vkc-position { margin:0; font-size:15px; font-weight:600; line-height:1.6; color:var(--vkc-ink); }
.vkc-directory .vkc-card--person .vkc-position { font-size:12px; font-weight:400; line-height:1.6; color:var(--vkc-muted); }
.vkc-directory .vkc-name { margin:8px 0 0; font-size:21px; line-height:1.4; font-weight:600; letter-spacing:-.4px; color:var(--vkc-ink); }
.vkc-details { font-size:13px; color:var(--vkc-muted); margin:0 0 20px; line-height:1.8; }
.vkc-details p { margin:0 0 10px; }.vkc-details ul { padding-left:20px; margin:0 0 12px; }.vkc-details li+li { margin-top:6px; }.vkc-details a { overflow-wrap:anywhere; }
.vkc-card-bottom { margin-top:auto; padding-top:17px; border-top:1px solid var(--vkc-line); }
.vkc-phones { display:flex; flex-wrap:wrap; gap:8px; }
.vkc-directory .vkc-phones a { display:inline-flex; align-items:center; gap:9px; font-size:14px; font-weight:600; line-height:1.4; text-decoration:none; background:var(--vkc-soft); padding:11px 12px; border-radius:7px; white-space:nowrap; }
.vkc-phones .vkc-icon { width:16px; height:16px; opacity:.75; }
.vkc-directory .vkc-phones a:hover { background:#dceee8; color:#075c65; }
.vkc-card-meta { display:flex; flex-wrap:wrap; align-items:center; gap:11px 16px; margin-top:15px; }
.vkc-directory .vkc-email { display:inline-flex; align-items:center; gap:8px; font-size:12px; text-decoration:none; min-width:0; }.vkc-email span { overflow-wrap:anywhere; }.vkc-email:hover span { text-decoration:underline; }
.vkc-card-meta .vkc-icon { width:15px; height:15px; opacity:.7; }
.vkc-room { display:inline-flex; align-items:center; gap:7px; color:var(--vkc-muted); font-size:11px; margin-left:auto; }
.vkc-route { display:grid; grid-template-columns:1fr 1fr; border:1px solid var(--vkc-line); border-radius:14px; background:var(--vkc-paper); overflow:hidden; scroll-margin-top:95px; }
.vkc-route-address { padding:28px 30px; background:var(--vkc-soft); }.vkc-route-icon { display:grid; place-items:center; width:42px; height:42px; border:1px solid var(--vkc-line); border-radius:12px; color:var(--vkc-accent); margin-bottom:18px; }
.vkc-directory .vkc-route h2 { margin:10px 0 13px; font-size:26px; color:var(--vkc-ink); letter-spacing:-.4px; }
.vkc-route [data-vkc-field=address] { margin:0; font-size:14px; color:var(--vkc-muted); }
.vkc-directory .vkc-route a { display:inline-flex; align-items:center; gap:22px; margin-top:22px; color:#fff; background:#0a747e; border-radius:7px; padding:12px 17px; text-decoration:none; font-size:12px; }
.vkc-route a .vkc-icon { width:17px; height:17px; }
.vkc-route-directions { padding:34px 30px; align-self:center; }
.vkc-route [data-vkc-field=directions] { white-space:pre-line; color:var(--vkc-muted); font-size:14px; line-height:2; margin:16px 0 0; }
.vkc-no-results,.vkc-extra { margin:20px 0; padding:24px; background:var(--vkc-paper); border:1px solid var(--vkc-line); border-radius:10px; }
@media(min-width:993px) { body.vkc-page .content-wrapper { grid-template-columns:minmax(0,1fr) 240px!important; } body.vkc-page .sidebar-left { display:none; } }
@media(min-width:993px) and (max-width:1200px) { .vkc-intro-grid { grid-template-columns:1fr; }.vkc-hero { min-height:0; }.vkc-map-viewport { min-height:300px; }.vkc-nav { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:800px) { .vkc-intro-grid { grid-template-columns:1fr; }.vkc-hero { min-height:0; }.vkc-nav { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:600px) {
 .vkc-hero { padding:27px 24px; border-radius:13px; }.vkc-directory .vkc-hero h1 { font-size:32px; margin-top:20px; }.vkc-hero p { font-size:13px; }
 .vkc-map-caption { padding:17px; }.vkc-map-viewport { min-height:280px; }.vkc-nav { gap:8px; }.vkc-directory .vkc-nav a { padding:13px 10px; gap:8px; }.vkc-nav .vkc-icon { display:none; }
 .vkc-tools { padding:16px; flex-wrap:wrap; gap:10px; margin-bottom:26px; }.vkc-tools label { flex-basis:100%; }.vkc-tools input { font-size:13px; }.vkc-count { margin:0; padding:0; background:transparent; }
 .vkc-grid,.vkc-route { grid-template-columns:1fr; }.vkc-card { padding:20px; }.vkc-card-heading { gap:12px; }.vkc-card-icon { flex-basis:33px; height:33px; border-radius:8px; }.vkc-card-icon .vkc-icon { width:18px; height:18px; }
 .vkc-directory .vkc-section h2 { font-size:20px; }.vkc-directory .vkc-name { font-size:20px; }.vkc-room { margin-left:0; }.vkc-card-meta { justify-content:space-between; }
 .vkc-route-address,.vkc-route-directions { padding:25px; }.vkc-section h2::after { display:none; }
}
html.vodokanal-dark-mode .vkc-directory { --vkc-ink:#e1efec; --vkc-muted:#b1cfcb; --vkc-line:#36585b; --vkc-paper:#193940; --vkc-soft:#21494b; --vkc-accent:#9bd9cd; }
html.vodokanal-dark-mode .vkc-hero { background:#12343a; }
html.vodokanal-visual-mode .vkc-directory { --vkc-ink:#000; --vkc-muted:#000; --vkc-line:#000; --vkc-paper:#fff; --vkc-soft:#fff; --vkc-accent:#000; }
html.vodokanal-visual-mode .vkc-directory .vkc-hero { color:#000; background:#fff; border:2px solid #000; }
html.vodokanal-visual-mode .vkc-hero::after { display:none; }
html.vodokanal-visual-mode .vkc-directory :is(h1,h2,h3,p,a,span,strong,small) { color:#000; }
html.vodokanal-visual-mode .vkc-directory :is(.vkc-route a,.vkc-card-icon) { color:#000; background:#fff; border:1px solid #000; }
@media(prefers-reduced-motion:reduce) { .vkc-directory :is(.vkc-nav a,.vkc-card) { transition:none; } }