@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@600;700&family=Manrope:wght@400;500;600;700;800&family=Unbounded:wght@500;600;700;800&display=swap');

/* ПроПлывём full-site concept layer. Visual only: content and SEO remain in HTML. */
html[data-concept-v2] {
  --c-surface: #e9fbf6;
  --c-foam: #c9f3ec;
  --c-aqua: #17c9b8;
  --c-aqua-glow: #5ef2e2;
  --c-ocean: #0a5a78;
  --c-deep: #06293e;
  --c-abyss: #03141f;
  --c-coral: #ff6b4a;
  --c-coral-soft: #ffd9ce;
  --c-sun: #ffc53d;
  --c-ink: #0b2233;
  --c-muted: rgba(11,34,51,.62);
  --c-white-muted: rgba(237,255,252,.7);
  --c-radius: 28px;
  --c-radius-sm: 18px;
  --c-shadow-soft: 0 8px 30px rgba(6,41,62,.09);
  --c-shadow-lift: 0 20px 60px rgba(6,41,62,.18);
  --c-display: 'Unbounded', system-ui, sans-serif;
  --c-body: 'Manrope', system-ui, sans-serif;
  --c-hand: 'Caveat', cursive;
  background: var(--c-abyss);
  color-scheme: light;
}

html[data-concept-v2] body {
  position: relative;
  min-height: 100vh;
  background: var(--c-abyss);
  color: #edfffc;
  font-family: var(--c-body);
  font-size: 16px;
  line-height: 1.6;
  overflow-x: clip;
}

html[data-concept-v2] body > :not(.concept-atmosphere):not(.concept-depth-meter) {
  position: relative;
  z-index: 2;
}

html[data-concept-v2] h1,
html[data-concept-v2] h2,
html[data-concept-v2] h3,
html[data-concept-v2] .logo,
html[data-concept-v2] .card-name,
html[data-concept-v2] .detail-title,
html[data-concept-v2] .article-title,
html[data-concept-v2] .sec-title {
  font-family: var(--c-display);
  letter-spacing: -.035em;
}

html[data-concept-v2] :focus-visible {
  outline: 3px solid var(--c-aqua-glow);
  outline-offset: 4px;
}

html[data-concept-v2] ::selection { background: var(--c-aqua); color: var(--c-abyss); }

html[data-concept-v2] .container {
  width: 100%;
  max-width: 1280px;
  margin-inline: auto;
  padding-inline: clamp(24px, 4vw, 48px);
}

/* Atmosphere and depth */
.concept-atmosphere {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
}

.concept-depth-bg {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(52rem 36rem at 50% calc(2% + var(--concept-depth, 0) * 8%), rgba(94,242,226,.18), transparent 68%),
    radial-gradient(34rem 30rem at 92% 34%, rgba(255,107,74,.08), transparent 72%),
    linear-gradient(180deg, #0b4b63 0%, var(--c-deep) 38%, var(--c-abyss) 100%);
  transform: translateZ(0);
}

.concept-noise {
  position: absolute;
  inset: 0;
  opacity: .028;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E");
}

.concept-bubbles { position: absolute; inset: 0; width: 100%; height: 100%; opacity: .75; }

.concept-depth-meter {
  position: fixed;
  z-index: 90;
  right: max(22px, env(safe-area-inset-right));
  bottom: max(28px, env(safe-area-inset-bottom));
  display: grid;
  justify-items: center;
  gap: 6px;
  padding: 10px 8px;
  border: 1px solid rgba(94,242,226,.16);
  border-radius: 16px;
  background: rgba(3,20,31,.42);
  box-shadow: 0 12px 28px rgba(0,0,0,.12);
  backdrop-filter: blur(10px);
  color: var(--c-aqua-glow);
  pointer-events: none;
  transform: none;
}
.concept-depth-meter__line { width: 1px; height: 56px; background: rgba(94,242,226,.22); overflow: hidden; }
.concept-depth-meter__fill { display: block; width: 100%; height: 100%; background: var(--c-aqua-glow); transform: scaleY(var(--concept-progress, 0)); transform-origin: top; }
.concept-depth-meter__label { font: 700 9px/1 var(--c-body); letter-spacing: .13em; writing-mode: vertical-rl; text-transform: uppercase; opacity: .72; }

/* Header */
html[data-concept-v2] .hdr {
  position: sticky;
  top: 12px;
  z-index: 100;
  width: min(1360px, calc(100% - 32px));
  height: 70px;
  margin: 12px auto 0;
  padding: 0 20px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 24px;
  background: rgba(3,20,31,.76);
  color: #edfffc;
  box-shadow: 0 18px 52px rgba(0,0,0,.16);
  backdrop-filter: blur(18px) saturate(135%);
  -webkit-backdrop-filter: blur(18px) saturate(135%);
  transition: background-color .35s ease, box-shadow .35s ease, border-color .35s ease;
}
html[data-concept-v2] .hdr.is-scrolled { background: rgba(3,20,31,.92); border-color: rgba(94,242,226,.25); box-shadow: 0 18px 52px rgba(0,0,0,.28); }
html[data-concept-v2] .logo { color: #fff; font-size: 1.08rem; font-weight: 700; }
html[data-concept-v2] .logo svg path { stroke: var(--c-aqua-glow); }
html[data-concept-v2] .logo svg circle,
html[data-concept-v2] .logo-o { fill: var(--c-coral); color: var(--c-coral); }
html[data-concept-v2] .nav { gap: 6px; }
html[data-concept-v2] .nav-link { padding: 9px 12px; border-radius: 999px; color: rgba(237,255,252,.72); font-size: .84rem; font-weight: 700; transition: color .3s ease, background-color .3s ease, transform .3s ease; }
html[data-concept-v2] .nav-link::after { display: none; }
html[data-concept-v2] .nav-link:hover,
html[data-concept-v2] .nav-link.is-active { color: var(--c-abyss); background: var(--c-aqua-glow); transform: translateY(-1px); }
html[data-concept-v2] .city-switcher-btn { border-color: rgba(255,255,255,.17); background: rgba(255,255,255,.07); color: #fff; border-radius: 999px; font-weight: 700; }
html[data-concept-v2] .city-switcher-btn:hover,
html[data-concept-v2] .city-switcher-btn[aria-expanded='true'] { border-color: var(--c-aqua); background: rgba(94,242,226,.12); }
html[data-concept-v2] .city-switcher-menu { border: 1px solid rgba(94,242,226,.24); border-radius: 20px; background: rgba(3,20,31,.97); box-shadow: var(--c-shadow-lift); }
html[data-concept-v2] .city-switcher-item { color: #edfffc; border-radius: 12px; }
html[data-concept-v2] .city-switcher-item:hover { background: rgba(94,242,226,.1); }
html[data-concept-v2] .city-switcher-item-count { background: rgba(94,242,226,.12); color: var(--c-aqua-glow); }
html[data-concept-v2] .btn-pill--ghost { border: 0; background: var(--c-coral); color: #fff; box-shadow: 0 10px 26px rgba(255,107,74,.24); }
html[data-concept-v2] .btn-pill--ghost:hover { background: #ff8067; transform: translateY(-2px); box-shadow: 0 16px 32px rgba(255,107,74,.34); }

/* Hero family */
html[data-concept-v2] .hero,
html[data-concept-v2] .page-hero,
html[data-concept-v2] .detail-hero,
html[data-concept-v2] .article-head {
  position: relative;
  overflow: hidden;
  border: 0;
  color: #edfffc;
  background:
    radial-gradient(38rem 24rem at 50% 0%, rgba(255,255,255,.16), transparent 72%),
    radial-gradient(26rem 22rem at 92% 72%, rgba(255,107,74,.1), transparent 72%),
    linear-gradient(180deg, rgba(10,90,120,.62), rgba(6,41,62,.38));
}
html[data-concept-v2] .hero { min-height: 720px; margin-top: -94px; padding: 168px 0 104px; }
html[data-concept-v2] .page-hero { padding: 104px 0 72px; }
html[data-concept-v2] .detail-hero { padding: 96px 0 72px; }
html[data-concept-v2] .article-head { padding: 80px 0 48px; margin-bottom: 0; }
html[data-concept-v2] .page-hero,
html[data-concept-v2] .detail-hero,
html[data-concept-v2] .article-head { isolation: isolate; }
html[data-concept-v2] .page-hero > .container,
html[data-concept-v2] .detail-hero > .container,
html[data-concept-v2] .article-head > .container { position: relative; z-index: 1; }
html[data-concept-v2] .hero::before,
html[data-concept-v2] .page-hero::before,
html[data-concept-v2] .detail-hero::before {
  content: '';
  position: absolute;
  right: clamp(24px,7vw,110px);
  top: clamp(92px,14vw,156px);
  width: clamp(82px,10vw,142px);
  aspect-ratio: 1;
  background: url('/assets/img/concept/lifebuoy.svg') center/contain no-repeat;
  opacity: .82;
  animation: concept-bob 6s ease-in-out infinite;
}
html[data-concept-v2] .hero::after {
  content: '';
  position: absolute;
  left: clamp(30px,6vw,90px);
  bottom: 34px;
  width: clamp(58px,7vw,96px);
  aspect-ratio: 1;
  background: url('/assets/img/concept/duck.png') center/contain no-repeat;
  animation: concept-float 5s ease-in-out infinite;
}
html[data-concept-v2] .kicker { color: var(--c-aqua-glow); font: 800 .72rem/1.3 var(--c-body); letter-spacing: .13em; opacity: .78; }
html[data-concept-v2] .hero-title,
html[data-concept-v2] .page-title,
html[data-concept-v2] .detail-title,
html[data-concept-v2] .article-title {
  max-width: 980px;
  color: #f7fffd;
  font-family: var(--c-display);
  font-weight: 700;
  line-height: 1.04;
  text-wrap: balance;
}
html[data-concept-v2] .hero-title { font-size: clamp(2.7rem,5.8vw,5.4rem); }
html[data-concept-v2] .page-title,
html[data-concept-v2] .detail-title,
html[data-concept-v2] .article-title { font-size: clamp(2.15rem,4.8vw,4.7rem); }
html[data-concept-v2] .hero-title .muted { display: block; margin-top: .12em; color: var(--c-aqua-glow); font-weight: 600; }
html[data-concept-v2] .hero-sub,
html[data-concept-v2] .page-sub,
html[data-concept-v2] .detail-meta,
html[data-concept-v2] .article-meta { color: var(--c-white-muted); font-family: var(--c-body); font-weight: 600; }
html[data-concept-v2] .hero-sub { max-width: 760px; font-size: clamp(1rem,1.45vw,1.18rem); }
html[data-concept-v2] .article-head .article-title { color: #f7fffd !important; text-shadow: 0 8px 28px rgba(0,0,0,.2); }
html[data-concept-v2] .article-head .kicker,
html[data-concept-v2] .article-head .kicker a { color: var(--c-aqua-glow); }
html[data-concept-v2] .article-head .article-meta { color: rgba(237,255,252,.82) !important; }

/* Unified forms and buttons */
html[data-concept-v2] .search,
html[data-concept-v2] .filters,
html[data-concept-v2] .filters-bar,
html[data-concept-v2] .cat-filters {
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 28px;
  background: rgba(255,255,255,.92);
  box-shadow: var(--c-shadow-lift);
  backdrop-filter: blur(14px);
}
html[data-concept-v2] .search { max-width: 920px; grid-template-columns: 1fr 1fr 1.2fr auto; gap: 8px; padding: 12px; }
html[data-concept-v2] .field { min-height: 54px; padding: 8px 16px; border: 1px solid rgba(11,34,51,.1) !important; border-radius: 17px; background: #fff; transition: transform .35s ease, border-color .35s ease, box-shadow .35s ease; }
html[data-concept-v2] .field:hover,
html[data-concept-v2] .field:focus-within { border-color: var(--c-aqua) !important; transform: translateY(-1px); box-shadow: 0 8px 18px rgba(6,41,62,.1), 0 0 0 3px rgba(23,201,184,.1); }
html[data-concept-v2] .field-label { color: var(--c-ocean); font-family: var(--c-body); }
html[data-concept-v2] .field-input { color: var(--c-ink); font-family: var(--c-body); font-weight: 700; }
html[data-concept-v2] .btn-search { width: auto; min-width: 56px; height: 54px; border-radius: 17px; background: var(--c-coral); color: #fff; }
html[data-concept-v2] .btn-search:hover { background: #ff8067; transform: translateY(-1px); box-shadow: 0 10px 24px rgba(255,107,74,.3); }
html[data-concept-v2] .quick-link,
html[data-concept-v2] .chip,
html[data-concept-v2] .chip-mini,
html[data-concept-v2] .tag { border-radius: 999px; transition: transform .3s ease, background-color .3s ease, border-color .3s ease; }
html[data-concept-v2] .quick-link { border-color: rgba(255,255,255,.2); background: rgba(255,255,255,.08); color: #fff; }
html[data-concept-v2] .quick-link:hover { border-color: var(--c-aqua); background: var(--c-aqua); color: var(--c-abyss); transform: translateY(-2px); }
html[data-concept-v2] .hero-cta,
html[data-concept-v2] .btn-primary,
html[data-concept-v2] .action-card .btn-pill,
html[data-concept-v2] .mobile-cta a { border-radius: 999px; background: var(--c-coral); color: #fff; font-family: var(--c-body); font-weight: 800; box-shadow: 0 12px 28px rgba(255,107,74,.24); transition: transform .3s ease, background-color .3s ease, box-shadow .3s ease; }
html[data-concept-v2] .hero-cta:hover,
html[data-concept-v2] .btn-primary:hover,
html[data-concept-v2] .action-card .btn-pill:hover { background: #ff8067; transform: translateY(-2px); box-shadow: 0 18px 36px rgba(255,107,74,.34); }

/* Section rhythm and wave graphics */
html[data-concept-v2] section { position: relative; }
html[data-concept-v2] .catalog,
html[data-concept-v2] .districts,
html[data-concept-v2] .how,
html[data-concept-v2] .map-block,
html[data-concept-v2] .similar-section,
html[data-concept-v2] .art-related { padding-block: clamp(72px,9vw,120px); }
html[data-concept-v2] .catalog,
html[data-concept-v2] .detail-body,
html[data-concept-v2] .article-body-wrap,
html[data-concept-v2] .articles-page,
html[data-concept-v2] main { background-color: transparent; }
html[data-concept-v2] .catalog::before,
html[data-concept-v2] .districts::before,
html[data-concept-v2] .map-block::before,
html[data-concept-v2] .similar-section::before,
html[data-concept-v2] .art-related::before {
  content: '';
  position: absolute;
  z-index: 0;
  left: 0;
  right: 0;
  top: -35px;
  height: 70px;
  opacity: .42;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M-40 48 C120 8 260 12 410 47 C565 84 710 81 860 41 C1010 2 1150 14 1290 51 C1370 72 1430 67 1490 45' fill='none' stroke='%235ef2e2' stroke-opacity='.62' stroke-width='2'/%3E%3Cpath d='M-40 65 C130 34 280 37 430 63 C580 89 730 86 880 57 C1030 28 1170 35 1310 64 C1390 80 1450 76 1490 62' fill='none' stroke='%2317c9b8' stroke-opacity='.3' stroke-width='1.5'/%3E%3C/svg%3E") center/100% 100% no-repeat;
}
html[data-concept-v2] .sec-head { position: relative; z-index: 1; align-items: end; }
html[data-concept-v2] .sec-title { color: #f7fffd; font-size: clamp(1.85rem,3.8vw,3.45rem); font-weight: 700; line-height: 1.08; text-wrap: balance; }
html[data-concept-v2] .sec-sub,
html[data-concept-v2] .districts-lead { color: var(--c-white-muted); }
html[data-concept-v2] .link-arrow { color: var(--c-aqua-glow); border-color: var(--c-aqua); font-weight: 800; }

/* Catalog cards */
html[data-concept-v2] .cards { position: relative; z-index: 1; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 26px; }
html[data-concept-v2] .card {
  min-width: 0;
  padding: 12px 12px 18px;
  border: 1px solid rgba(255,255,255,.65);
  border-radius: var(--c-radius);
  background: rgba(255,255,255,.95);
  color: var(--c-ink);
  box-shadow: var(--c-shadow-soft);
  animation: none;
  opacity: 1;
  filter: none;
  transform: none;
  transition: transform .5s cubic-bezier(.22,1,.36,1), box-shadow .5s cubic-bezier(.22,1,.36,1), border-color .4s ease;
}
html[data-concept-v2] .card:hover { border-color: rgba(94,242,226,.7); transform: translateY(-7px); box-shadow: var(--c-shadow-lift); }
html[data-concept-v2] .card-img { aspect-ratio: 4/3; margin-bottom: 16px; border: 0; border-radius: 19px; background: var(--c-foam); box-shadow: none; }
html[data-concept-v2] .card:hover .card-img { box-shadow: none; }
html[data-concept-v2] .card-body { padding: 0 7px; }
html[data-concept-v2] .card-name { color: var(--c-ink); font-size: 1rem; font-weight: 700; line-height: 1.35; }
html[data-concept-v2] .card-meta,
html[data-concept-v2] .card-foot { color: var(--c-muted); font-family: var(--c-body); }
html[data-concept-v2] .card-meta .dot-loc,
html[data-concept-v2] .card-price { color: var(--c-ink); }
html[data-concept-v2] .card-foot { border-color: rgba(11,34,51,.1); }
html[data-concept-v2] .card-foot { align-items: flex-start; }
html[data-concept-v2] .card-price { max-width: 58%; white-space: normal; text-align: right; overflow-wrap: anywhere; }
html[data-concept-v2] .card-badge,
html[data-concept-v2] .photo-credit { border-radius: 999px; backdrop-filter: blur(8px); }

/* Districts and utility cards */
html[data-concept-v2] .districts { border: 0; background: rgba(10,90,120,.24); }
html[data-concept-v2] .districts-grid { gap: 14px; }
html[data-concept-v2] .d-card,
html[data-concept-v2] .how-card,
html[data-concept-v2] .article-card,
html[data-concept-v2] .location-item {
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 999px;
  background: rgba(255,255,255,.065);
  color: #f7fffd;
  box-shadow: none;
  transition: transform .4s cubic-bezier(.22,1,.36,1), border-color .35s ease, background-color .35s ease, box-shadow .35s ease;
}
html[data-concept-v2] .d-card:hover,
html[data-concept-v2] .how-card:hover,
html[data-concept-v2] .location-item:hover { border-color: var(--c-aqua); background: rgba(94,242,226,.12); transform: translateY(-3px); box-shadow: 0 0 28px rgba(94,242,226,.1); }
html[data-concept-v2] .d-name,
html[data-concept-v2] .how-card h3 { color: #fff; }
html[data-concept-v2] .d-count { background: var(--c-aqua); color: var(--c-abyss); }
html[data-concept-v2] .how-card { border-radius: var(--c-radius); }
html[data-concept-v2] .how-card p { color: var(--c-white-muted); }
html[data-concept-v2] .how-num { color: var(--c-aqua-glow); font-family: var(--c-display); }

/* Detail pages */
html[data-concept-v2] .breadcrumb { color: rgba(237,255,252,.58); }
html[data-concept-v2] .breadcrumb a:hover { color: var(--c-aqua-glow); }
html[data-concept-v2] .detail-hero-layout { gap: clamp(32px,5vw,72px); align-items: center; }
html[data-concept-v2] .detail-cover { overflow: hidden; border: 1px solid rgba(255,255,255,.2); border-radius: 36px; box-shadow: 0 30px 80px rgba(0,0,0,.3); }
html[data-concept-v2] .detail-info { color: var(--c-white-muted); }
html[data-concept-v2] .tag-age,
html[data-concept-v2] .tag-type { border-color: rgba(94,242,226,.3); background: rgba(94,242,226,.1); color: var(--c-aqua-glow); }
html[data-concept-v2] .detail-body { padding-block: clamp(64px,8vw,108px); background: var(--c-surface); color: var(--c-ink); }
html[data-concept-v2] .detail-grid { gap: clamp(24px,4vw,48px); }
html[data-concept-v2] .detail-section,
html[data-concept-v2] .action-card,
html[data-concept-v2] .verification-note {
  border: 1px solid rgba(11,34,51,.08);
  border-radius: var(--c-radius);
  background: rgba(255,255,255,.88);
  box-shadow: var(--c-shadow-soft);
}
html[data-concept-v2] .detail-section { padding: clamp(24px,4vw,42px); }
html[data-concept-v2] .detail-section h2 { color: var(--c-ink); font-size: clamp(1.25rem,2.2vw,1.8rem); }
html[data-concept-v2] .detail-section p,
html[data-concept-v2] .detail-section li,
html[data-concept-v2] .label { color: var(--c-muted); }
html[data-concept-v2] .val { color: var(--c-ink); }
html[data-concept-v2] .action-card { top: 104px; padding: 28px; }
html[data-concept-v2] .price { color: var(--c-ocean); font-family: var(--c-display); }
html[data-concept-v2] .similar-section { background: var(--c-deep); }
html[data-concept-v2] .mini-card { border: 1px solid rgba(255,255,255,.14); border-radius: 20px; background: rgba(255,255,255,.07); color: #fff; }
html[data-concept-v2] .mini-card:hover { border-color: var(--c-aqua); background: rgba(94,242,226,.12); }
html[data-concept-v2] .mini-name { color: #fff; }
html[data-concept-v2] .mini-meta { color: var(--c-white-muted); }
html[data-concept-v2] .mobile-cta { border-color: rgba(255,255,255,.2); background: rgba(3,20,31,.94); backdrop-filter: blur(16px); }

/* Catalog, lists and map */
html[data-concept-v2] .cat-results,
html[data-concept-v2] .catalog-page,
html[data-concept-v2] .districts-page { color: #fff; }
html[data-concept-v2] .map-frame,
html[data-concept-v2] .map-embed,
html[data-concept-v2] #leafletMap { overflow: hidden; border: 1px solid rgba(255,255,255,.16); border-radius: 32px; box-shadow: 0 28px 72px rgba(0,0,0,.22); }
html[data-concept-v2] .map-overlay-cta { right: 18px; bottom: 18px; border-radius: 999px; background: var(--c-coral); color: #fff; font-weight: 800; box-shadow: 0 12px 28px rgba(255,107,74,.3); }
html[data-concept-v2] .map-list { border-color: rgba(255,255,255,.12); border-radius: 24px; background: rgba(255,255,255,.06); }

/* Articles, about and editorial content */
html[data-concept-v2] .articles-grid { gap: 24px; }
html[data-concept-v2] .article-card { overflow: hidden; border-radius: var(--c-radius); background: rgba(255,255,255,.94); color: var(--c-ink); box-shadow: var(--c-shadow-soft); }
html[data-concept-v2] .article-card:hover { border-color: var(--c-aqua); transform: translateY(-5px); box-shadow: var(--c-shadow-lift); }
html[data-concept-v2] .article-card-title { color: var(--c-ink); font-family: var(--c-display); }
html[data-concept-v2] .article-card-lead { color: var(--c-muted); }
html[data-concept-v2] .article-card-tag { border-radius: 999px; background: var(--c-foam); color: var(--c-ocean); }
html[data-concept-v2] .article-hero { max-width: 1180px; margin: 42px auto; border-radius: 36px; box-shadow: var(--c-shadow-lift); }
html[data-concept-v2] .article-body { max-width: 880px; margin: 0 auto 80px; padding: clamp(28px,5vw,64px); border: 1px solid rgba(255,255,255,.7); border-radius: 36px; background: rgba(255,255,255,.94); color: var(--c-ink); box-shadow: var(--c-shadow-lift); }
html[data-concept-v2] .article-body .art-lead { color: var(--c-ocean); font-size: clamp(1.08rem,1.8vw,1.3rem); }
html[data-concept-v2] .article-body .art-h2 { color: var(--c-ink); font-family: var(--c-display); }
html[data-concept-v2] .article-body .art-answer,
html[data-concept-v2] .article-body .art-method { border-color: rgba(23,201,184,.35); border-radius: 22px; background: var(--c-surface); }
html[data-concept-v2] .art-table-wrap { border-color: rgba(11,34,51,.1); border-radius: 20px; box-shadow: var(--c-shadow-soft); }
html[data-concept-v2] .art-table th { background: var(--c-foam); }
html[data-concept-v2] .art-cta { background: transparent; }
html[data-concept-v2] .art-cta-card { border: 1px solid rgba(94,242,226,.22); border-radius: 32px; background: rgba(94,242,226,.1); color: #fff; }
html[data-concept-v2] .art-cta-card h2 { color: var(--c-aqua-glow); }
html[data-concept-v2] .art-cta-card p { color: var(--c-white-muted); }

/* Contrast guards for old template fragments placed on the new dark surfaces. */
html[data-concept-v2] :is(.catalog-page, .districts-page, .map-page, .map-block, .cat-results, .similar-section, .art-cta, .ftr) {
  color: #edfffc;
}
html[data-concept-v2] :is(.catalog-page, .districts-page, .map-page, .map-block, .cat-results, .similar-section, .art-cta, .ftr) :is(h1, h2, h3, h4, .results-count, .map-list-title, .map-list-address, .map-list-meta) {
  color: #f7fffd !important;
}
html[data-concept-v2] :is(.catalog-page, .districts-page, .map-page, .map-block, .cat-results, .similar-section, .art-cta, .ftr) :is(p, li, small, .results-note, .map-list p, .map-list span) {
  color: rgba(237,255,252,.78);
}
html[data-concept-v2] :is(.catalog-page, .districts-page, .map-page, .map-block, .cat-results, .similar-section, .art-cta, .ftr) a:not(.card):not(.article-card):not(.d-card):not(.how-card):not(.mini-card) {
  color: var(--c-aqua-glow);
}
html[data-concept-v2] :is(.catalog-page, .districts-page, .map-page, .map-block, .cat-results, .similar-section, .art-cta, .ftr) .card,
html[data-concept-v2] :is(.catalog-page, .districts-page, .map-page, .map-block, .cat-results, .similar-section, .art-cta, .ftr) .article-card {
  color: var(--c-ink);
}
html[data-concept-v2] :is(.catalog-page, .districts-page, .map-page, .map-block, .cat-results, .similar-section, .art-cta, .ftr) .card :is(h1, h2, h3, h4, p, li, small, span),
html[data-concept-v2] :is(.catalog-page, .districts-page, .map-page, .map-block, .cat-results, .similar-section, .art-cta, .ftr) .article-card :is(h1, h2, h3, h4, p, li, small, span) {
  color: revert !important;
}
html[data-concept-v2] .card-name,
html[data-concept-v2] .article-card-title { color: var(--c-ink) !important; }
html[data-concept-v2] .card-meta,
html[data-concept-v2] .card-foot,
html[data-concept-v2] .article-card-lead { color: var(--c-muted) !important; }
html[data-concept-v2] .d-card :is(h1, h2, h3, h4, p, li, small, span),
html[data-concept-v2] .how-card :is(h1, h2, h3, h4, p, li, small, span),
html[data-concept-v2] .mini-card :is(h1, h2, h3, h4, p, li, small, span) { color: inherit !important; }

/* Footer */
html[data-concept-v2] .ftr { position: relative; overflow: hidden; padding-top: 76px; border-top: 1px solid rgba(94,242,226,.16); background: var(--c-abyss); color: var(--c-white-muted); }
html[data-concept-v2] .ftr::before { content: ''; position: absolute; right: clamp(30px,8vw,120px); bottom: 22px; width: 78px; aspect-ratio: 1; background: url('/assets/img/concept/duck.png') center/contain no-repeat; opacity: .82; animation: concept-float 6s ease-in-out infinite reverse; }
html[data-concept-v2] .ftr-in { border-color: rgba(94,242,226,.16); }
html[data-concept-v2] .ftr-nav a { color: var(--c-white-muted); font-weight: 700; }
html[data-concept-v2] .ftr-nav a:hover { color: var(--c-aqua-glow); }

/* Motion runtime */
html[data-concept-v2].concept-motion-ready .concept-reveal { opacity: 0; transform: translateY(36px); transition: opacity .75s ease, transform .85s cubic-bezier(.22,1,.36,1); }
html[data-concept-v2].concept-motion-ready .concept-reveal.is-visible { opacity: 1; transform: translateY(0); }
html[data-concept-v2].concept-motion-ready .concept-reveal-card { opacity: 0; transform: translateY(24px) scale(.985); transition: opacity .65s ease, transform .75s cubic-bezier(.22,1,.36,1); transition-delay: calc(var(--concept-order,0) * 45ms); }
html[data-concept-v2].concept-motion-ready .concept-reveal-card.is-visible { opacity: 1; transform: translateY(0) scale(1); }
html[data-concept-v2] .page-hero .concept-reveal.is-visible,
html[data-concept-v2] .detail-hero .concept-reveal.is-visible,
html[data-concept-v2] .article-head .concept-reveal.is-visible { will-change: auto; }

@keyframes concept-float { 0%,100% { transform: translateY(-7px) rotate(-2deg); } 50% { transform: translateY(7px) rotate(2deg); } }
@keyframes concept-bob { 0%,100% { transform: translateY(-9px) rotate(-4deg); } 50% { transform: translateY(9px) rotate(4deg); } }

@media (max-width: 1040px) {
  html[data-concept-v2] .hdr { width: calc(100% - 24px); top: 8px; margin-top: 8px; }
  html[data-concept-v2] .nav.is-open { top: 90px; left: 12px; right: 12px; border: 1px solid rgba(94,242,226,.2); border-radius: 24px; background: rgba(3,20,31,.98); box-shadow: var(--c-shadow-lift); }
  html[data-concept-v2] .hdr-burger span { background: var(--c-aqua-glow); }
  html[data-concept-v2] .cards { grid-template-columns: repeat(2,minmax(0,1fr)); }
  html[data-concept-v2] .hero::before,
  html[data-concept-v2] .page-hero::before,
  html[data-concept-v2] .detail-hero::before { opacity: .36; }
}

@media (max-width: 760px) {
  html[data-concept-v2] body { font-size: 15px; }
  html[data-concept-v2] .container { padding-inline: 20px; }
  html[data-concept-v2] .concept-depth-meter { display: none; }
  html[data-concept-v2] .hdr { height: 64px; padding-inline: 14px; border-radius: 20px; }
  html[data-concept-v2] .hero { min-height: auto; margin-top: -84px; padding: 132px 0 92px; }
  html[data-concept-v2] .page-hero,
  html[data-concept-v2] .detail-hero,
  html[data-concept-v2] .article-head { padding: 72px 0 48px; }
  html[data-concept-v2] .hero-title { font-size: clamp(2.35rem,11vw,3.7rem); }
  html[data-concept-v2] .page-title,
  html[data-concept-v2] .detail-title,
  html[data-concept-v2] .article-title { font-size: clamp(2rem,9vw,3.15rem); }
  html[data-concept-v2] .hero::after { left: auto; right: 20px; bottom: 16px; width: 64px; opacity: .75; }
  html[data-concept-v2] .hero::before,
  html[data-concept-v2] .page-hero::before,
  html[data-concept-v2] .detail-hero::before { top: 92px; right: -24px; width: 92px; opacity: .2; }
  html[data-concept-v2] .search { grid-template-columns: 1fr; border-radius: 24px; }
  html[data-concept-v2] .field { min-height: 58px; border-right: 1px solid rgba(11,34,51,.1) !important; }
  html[data-concept-v2] .btn-search { width: 100%; border-radius: 17px; }
  html[data-concept-v2] .cards { grid-template-columns: 1fr; gap: 20px; }
  html[data-concept-v2] .card { width: 100%; max-width: 480px; margin-inline: auto; }
  html[data-concept-v2] .card-img { aspect-ratio: 16/11; }
  html[data-concept-v2] .sec-title { font-size: clamp(1.7rem,8vw,2.6rem); }
  html[data-concept-v2] .detail-cover,
  html[data-concept-v2] .article-hero,
  html[data-concept-v2] .article-body { border-radius: 26px; }
  html[data-concept-v2] .article-body { padding: 26px 22px; }
  html[data-concept-v2] .ftr::before { width: 60px; right: 18px; opacity: .48; }
}

@media (prefers-reduced-motion: reduce) {
  html[data-concept-v2] *,
  html[data-concept-v2] *::before,
  html[data-concept-v2] *::after { animation: none !important; transition-duration: .01ms !important; }
  html[data-concept-v2] .concept-reveal,
  html[data-concept-v2] .concept-reveal-card { opacity: 1 !important; transform: none !important; }
}

/* Keep high-DPI backing stores from affecting decorative layer geometry. */
html[data-concept-v2] .concept-bubbles {
  position: fixed !important;
  inset: 0 !important;
  inline-size: 100vw !important;
  block-size: 100vh !important;
  max-inline-size: 100% !important;
  pointer-events: none !important;
}

html[data-concept-v2] .concept-depth-meter {
  right: 18px !important;
  width: auto !important;
  max-width: calc(100vw - 36px) !important;
}

html[data-concept-v2] .article-body table {
  display: block;
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
}

@media (max-width: 767px) {
  html[data-concept-v2] .city-switcher {
    transform: translateX(-6px);
  }
}

/* Dark water heroes must win over legacy page-specific text colors. */
html[data-concept-v2] .page-hero h1,
html[data-concept-v2] .page-hero .h1 {
  color: #fff !important;
}

html[data-concept-v2] .cat-head h1 {
  color: #fff !important;
}

html[data-concept-v2] .page-hero p,
html[data-concept-v2] .page-hero .lead {
  color: rgba(255, 255, 255, .7) !important;
}

html[data-concept-v2] .cat-head > .container > p:not(.kicker) {
  color: rgba(255, 255, 255, .7) !important;
}

html[data-concept-v2] .breadcrumbs,
html[data-concept-v2] .breadcrumbs a {
  color: rgba(255, 255, 255, .58) !important;
}