
/* ---- css/page-transition-v1208.css ---- */
/* v.1359 — compositor-safe native navigation, no black intermediate frame. */

/*
 * Every root HTML page already loads this stylesheet.
 * Modern browsers can therefore keep the old document snapshot visible until
 * the new same-origin document has painted, without JS click interception.
 */
@view-transition {
  navigation: auto;
}

/* Do not animate/fade the snapshots — just bridge the document swap. */
::view-transition-old(root),
::view-transition-new(root) {
  animation: none !important;
  mix-blend-mode: normal !important;
}

/*
 * Permanent non-black compositor backdrop.
 * This is also the fallback for browsers without cross-document View Transition.
 */
html {
  background-color: #314b48 !important;
}

html[data-river-theme="dark"] {
  background-color: #182523 !important;
}

body {
  min-height: 100vh;
}

/* Legacy transition classes must never hide or dim the document. */
:root{
  --grafo-page-out: 0ms;
  --grafo-page-in: 0ms;
}

html.grafo-page-entering body,
html.grafo-page-ready body,
html.grafo-page-leaving body{
  opacity:1 !important;
  transition:none !important;
}

html.grafo-page-leaving body{
  pointer-events:auto !important;
}

html.grafo-page-entering .site-river-background-v640,
html.grafo-page-ready .site-river-background-v640,
html.grafo-page-leaving .site-river-background-v640{
  opacity:1 !important;
}


/* ---- css/header-style-quick-menu-v1210c.css ---- */
/* v.1210c — static HTML quick menu based on native <details>. */
#headerQuickMenuDetails{
  position:fixed!important;
  z-index:10053!important;
  left:var(--floating-edge,14px)!important;
  bottom:var(--floating-bottom,18px)!important;
  width:var(--floating-control-width,112px)!important;
  height:var(--floating-control-height,44px)!important;
  margin:0!important;
  padding:0!important;
  pointer-events:auto!important;
}
#headerQuickMenuDetails > summary{
  box-sizing:border-box!important;
  width:var(--floating-control-width,112px)!important;
  height:var(--floating-control-height,44px)!important;
  min-width:var(--floating-control-width,112px)!important;
  min-height:var(--floating-control-height,44px)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  padding:0 13px!important;
  border:2px solid rgba(255,255,255,.92)!important;
  border-radius:999px!important;
  background:var(--floating-dark-green,#0e5f5f)!important;
  color:#fff!important;
  box-shadow:0 4px 16px rgba(0,0,0,.27)!important;
  font:700 15px/1 Arial,sans-serif!important;
  cursor:pointer!important;
  list-style:none!important;
  user-select:none!important;
}
#headerQuickMenuDetails > summary::-webkit-details-marker{display:none!important}
#headerQuickMenuDetails > summary::before{
  content:"☰";
  font:700 19px/1 Arial,sans-serif;
}
#headerQuickMenuDetails[open] > summary{
  background:#0a4f52!important;
}
.header-quick-static-panel{
  position:absolute;
  left:0;
  bottom:calc(100% + 8px);
  width:min(330px,calc(100vw - 28px));
  max-height:min(70vh,620px);
  box-sizing:border-box;
  padding:10px;
  overflow:auto;
  border:2px solid rgba(255,255,255,.92);
  border-radius:16px;
  background:rgba(10,80,82,.97);
  color:#fff;
  box-shadow:0 14px 38px rgba(0,0,0,.34);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.header-quick-static-title{
  padding:5px 7px 9px;
  color:#fff;
  font:800 15px/1.15 Arial,sans-serif;
}
.header-quick-static-links{
  display:grid;
  gap:5px;
}
.header-quick-static-link{
  display:flex;
  align-items:center;
  min-height:38px;
  padding:8px 11px;
  box-sizing:border-box;
  border-radius:9px;
  color:#fff!important;
  text-decoration:none!important;
  font:700 13px/1.2 Arial,sans-serif;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.10);
}
.header-quick-static-link:hover,
.header-quick-static-link:focus-visible{
  background:rgba(255,255,255,.17);
  border-color:rgba(255,255,255,.28);
}
.header-quick-static-link[aria-current="page"]{
  background:#07943f;
  border-color:rgba(255,255,255,.55);
}
.header-quick-static-separator{
  height:1px;
  margin:5px 3px;
  background:rgba(255,255,255,.18);
}
.header-quick-static-activity{
  background:rgba(255,255,255,.14);
}
@media(max-width:640px){
  #headerQuickMenuDetails{
    left:var(--floating-edge,10px)!important;
    width:var(--floating-control-width,106px)!important;
  }
  #headerQuickMenuDetails > summary{
    width:var(--floating-control-width,106px)!important;
    min-width:var(--floating-control-width,106px)!important;
  }
  .header-quick-static-panel{
    width:min(310px,calc(100vw - 20px));
  }
}
@media print{
  #headerQuickMenuDetails{display:none!important}
}


/* ---- css/remove-password-buttons-v1215.css ---- */
/* v.1215 — no Password/Access Lock button in any Viewer button row. */
#viewer2026Overlay [data-action="access-lock"],
#viewer2026Overlay .viewer122-access-lock,
.doc2026 [data-action="access-lock"],
.doc2026 .viewer122-access-lock,
.viewer4 [data-password-button],
.viewer4 [data-action="password"],
.viewer4 button[name="password"],
.viewer4 button[id*="password" i],
.viewer4 button[class*="password" i] {
  display:none !important;
  visibility:hidden !important;
  width:0 !important;
  min-width:0 !important;
  max-width:0 !important;
  height:0 !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:hidden !important;
  pointer-events:none !important;
}


/* ---- css/water-background-headings-red-v1243.css ---- */
/* v.1245 — единый фирменный красный для секционных заголовков сайта. */
:root{--grafo-heading-red:#34465a;}

/* Пара заголовок + подзаголовок, как «Почерк в графологии» /
   «Сколько людей, столько и почерков...». */
html[data-site-river-background] body .practice__header.header-block > .header-block__title,
html[data-site-river-background] body .practice__header.header-block > .header-block__sub-title,
html[data-site-river-background] body .categories__header.header-block > .header-block__title,
html[data-site-river-background] body .categories__header.header-block > .header-block__sub-title,
html[data-site-river-background] body .header-block > .header-block__title,
html[data-site-river-background] body .header-block > .header-block__sub-title,

/* Заголовки секций, которые используют старый класс categories__title. */
html[data-site-river-background] body .practice__header > .categories__title,
html[data-site-river-background] body .categories__header > .categories__title,

/* Явные зоны воды/камней. */
.bgimg-1 h1,.bgimg-1 h2,.bgimg-1 h3,.bgimg-1 h4,
.bgimg-2 h1,.bgimg-2 h2,.bgimg-2 h3,.bgimg-2 h4,
.bgimg-3 h1,.bgimg-3 h2,.bgimg-3 h3,.bgimg-3 h4,
.graphology-river-strip h1,.graphology-river-strip h2,.graphology-river-strip h3,.graphology-river-strip h4,
.river-strip h1,.river-strip h2,.river-strip h3,.river-strip h4,
[data-site-river-background] .river-title,
[data-site-river-background] .water-title{
  color:var(--grafo-heading-red)!important;
  text-shadow:0 1px 0 rgba(255,255,255,.46),0 2px 5px rgba(0,0,0,.17)!important;
}

/* Документы — принудительно тем же красным. */
html body #documents2026 .documents-main-heading,
html body #documents2026 .header-block__sub-title{
  color:var(--grafo-heading-red)!important;
  text-shadow:0 1px 0 rgba(255,255,255,.46),0 2px 5px rgba(0,0,0,.17)!important;
}

/* Содержимое белых листов и карточек не наследует этот декоративный цвет. */
html[data-site-river-background] body .documentation-info-paper .header-block__title,
html[data-site-river-background] body .documentation-info-paper .header-block__sub-title,
html[data-site-river-background] body .item-service .header-block__title,
html[data-site-river-background] body .item-service .header-block__sub-title,
html[data-site-river-background] body .item-practice .header-block__title,
html[data-site-river-background] body .item-practice .header-block__sub-title{
  text-shadow:none!important;
}


/* ---- css/cover-fixed-geometry-v4309.css ---- */
/* v.4309 — stable first-screen cover geometry, loaded LAST on cover pages.
   Goal: cover X/Y/size must not depend on text height or page-specific align-self rules. */
@media (min-width: 801px) {
  .page__main-block .main-block__container {
    width: min(calc(100% - 48px), 1360px) !important;
    max-width: 1360px !important;
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-columns: minmax(360px, 0.78fr) minmax(560px, 1.22fr) !important;
    grid-template-areas: "heading image" "body image" !important;
    column-gap: clamp(54px, 5vw, 86px) !important;
    row-gap: 28px !important;
    align-items: start !important;
    padding: clamp(82px, 7vw, 106px) 0 clamp(54px, 6vw, 88px) !important;
    margin: 0 auto !important;
  }

  .page__main-block .main-block__heading { grid-area: heading !important; }
  .page__main-block .main-block__body { grid-area: body !important; }

  .page__main-block .main-block__image._ibg {
    grid-area: image !important;
    position: relative !important;
    inset: auto !important;
    align-self: start !important;
    justify-self: stretch !important;
    width: 100% !important;
    height: auto !important;
    min-width: 0 !important;
    margin: 96px 0 0 0 !important;
    transform: none !important;
    overflow: hidden !important;
  }

  .page__main-block .main-block__image._ibg > img[src*="cover_"] {
    position: static !important;
    inset: auto !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    aspect-ratio: 16 / 10 !important;
    object-fit: cover !important;
    object-position: center center !important;
    margin: 0 !important;
    transform: none !important;
  }
}

/* v.4311 — unified hero heading position.
   graphology.html is the approved visual reference. The heading block is
   pinned to one top-left point of the shared desktop hero grid so X/Y does
   not vary with page-specific rules or the height of the body content. */
@media (min-width: 801px) {
  .page__main-block .main-block__heading {
    grid-area: heading !important;
    position: relative !important;
    inset: auto !important;
    align-self: start !important;
    justify-self: start !important;
    width: 100% !important;
    max-width: 520px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    z-index: 2 !important;
  }
  .page__main-block .main-block__title,
  .page__main-block .main-block__subtitle {
    position: static !important;
    inset: auto !important;
    transform: none !important;
  }
  .page__main-block .main-block__title {
    margin-top: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .page__main-block .main-block__subtitle {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}


/* v.4312 — unify the vertical position of the author block with graphology.html.
   The left heading and body share one grid row. The body receives a fixed
   reference offset equal to graphology.html: one title line + 8px gap +
   one subtitle line + the approved 28px heading/body gap. This makes the
   avatar + “Исакова Лариса” start at the same Y on every cover page,
   regardless of the page-specific heading height. */
@media (min-width: 801px) {
  .page__main-block .main-block__container {
    grid-template-areas: "heading image" !important;
    grid-template-rows: auto !important;
  }

  .page__main-block .main-block__heading {
    grid-column: 1 !important;
    grid-row: 1 !important;
    align-self: start !important;
  }

  .page__main-block .main-block__body {
    grid-column: 1 !important;
    grid-row: 1 !important;
    align-self: start !important;
    padding-top: calc(
      clamp(38.08px, 3.36vw, 53.76px) +
      8px +
      clamp(33.04px, 2.773vw, 47.2px) +
      28px
    ) !important;
  }

  .page__main-block .main-block__image._ibg {
    grid-column: 2 !important;
    grid-row: 1 !important;
  }
}

/* v.4314 — lock the “Исакова Лариса” author block to the services.html
   desktop reference position on every analogous cover page.
   The author is taken out of normal flow and pinned to one Y coordinate;
   equivalent flow space is reserved so following page-specific content cannot
   pull the author up/down. services.html therefore remains the visual reference. */
@media (min-width: 801px) {
  .page__main-block .main-block__body {
    --g74-author-top-services: calc(
      clamp(38.08px, 3.36vw, 53.76px) +
      8px +
      clamp(33.04px, 2.773vw, 47.2px) +
      28px
    );
    position: relative !important;
    inset: auto !important;
    margin: 0 !important;
    transform: none !important;
    padding-top: calc(var(--g74-author-top-services) + 90px) !important;
  }

  .page__main-block .main-block__body > .main-block__text:first-child {
    position: absolute !important;
    top: var(--g74-author-top-services) !important;
    left: 0 !important;
    right: auto !important;
    bottom: auto !important;
    width: 100% !important;
    max-width: 500px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    z-index: 3 !important;
  }
}

/* v.4316 — index.html: make “Юридические услуги” typographically identical
   to the main title on graphology.html. Kept as a div to avoid adding a second H1
   on index.html; only visual typography is synchronized. */
body.page-index .page__main-block .g74-title-like-graphology {
  font-family: Montserrat, sans-serif !important;
  font-size: 40px !important;
  line-height: 137% !important;
  letter-spacing: 0.2px !important;
  font-weight: 800 !important;
}
@media (max-width: 480px) {
  body.page-index .page__main-block .g74-title-like-graphology {
    font-size: 30px !important;
  }
}


/* ---- css/heading-unified-v4317.css ---- */
/* v.4317 — unified visible page heading typography.
   Reference: index.html visible "Юридические услуги" title from approved v.4316.
   Important: index.html uses .main-block__title on a div, not the SEO-hidden H1.
   Therefore both visible .main-block__title and visible semantic H1 are normalized. */

.page__main-block .main-block__title,
h1:not(.seo-visually-hidden) {
  font-family: Montserrat, sans-serif !important;
  font-size: 40px !important;
  line-height: 137% !important;
  letter-spacing: 0.2px !important;
  font-weight: 800 !important;
}

@media (max-width: 480px) {
  .page__main-block .main-block__title,
  h1:not(.seo-visually-hidden) {
    font-size: 30px !important;
  }
}

/* v.4319 — keep the visible first-screen page title on one line on desktop.
   The title may use the free horizontal space above the cover image instead of
   wrapping inside the left 520px text column and colliding with the fixed author block. */
@media (min-width: 801px) {
  .page__main-block .main-block__heading {
    width: max-content !important;
    max-width: none !important;
    overflow: visible !important;
  }

  .page__main-block .main-block__title {
    display: block !important;
    width: max-content !important;
    max-width: none !important;
    white-space: nowrap !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none !important;
  }
}


/* v.4325 — menu-matching first word accent in hero titles.
   Uses the same red-brown accent as the active upper-navigation item (#850909). */
.page__main-block .main-block__title > .hero-title-menu-word,
h1.main-block__title > .hero-title-menu-word,
h1.activity-h1 > .hero-title-menu-word {
  color:#34465a !important;
}


/* ---- css/header-v4444-09.css ---- */
/* v4444-09: header-only correction */
@media (min-width:771px){
  .header__container{column-gap:20px !important;}
  .g74-prelogo-nav{
    flex:0 0 auto !important;
    width:auto !important;
    min-width:0 !important;
    margin:0 !important;
    overflow:visible !important;
    background-color:rgba(250,250,250,1) !important;
  }
  .g74-prelogo-nav > a{
    float:left !important;
    display:block !important;
    color:rgba(13,92,99,1) !important;
    text-align:center !important;
    padding:10px 10px !important;
    text-decoration:none !important;
    font-size:14px !important;
  }
  .header__container > .g74-prelogo-nav,
  .header__container > .g74-header-feather,
  .header__container > .g74-header-name{
    margin-left:0 !important;
    margin-right:0 !important;
  }
}
.topnav > a[aria-current="page"]:not(.icon),
.topnav > a.active:not(.icon){
  background-color:rgba(133,9,9,1) !important;
  color:#fff !important;
  font-weight:700 !important;
}
.topnav > a[aria-current="page"]:not(.icon) span,
.topnav > a.active:not(.icon) span{color:#fff !important;}

