/* The company's own blocks on its website (app/site_blocks.py) in the website's look: its palette (company-site.css),
   its type, no colour or font of their own — loaded by the first block a page has. A text reads at about 68
   characters a line; «Преимущества» are ruled columns, not cards; the call is the page's one framed band with the
   booking's button; the video is a poster the tap turns into the player. */
/* An owner's long Russian word — 10 letters or more, four at least on each side — parts at its syllables with a hyphen
   (the page is lang="ru"), never at a random letter; a shorter one moves to the next line whole (the owner, 08.10.2026,
   of four columns at 1 600 px: «Можно со свои-ми запчастями»). Safari, without hyphenate-limit-chars, keeps five
   letters on each side: no word under ten parts there either. An address or a code with no syllables to part at
   still wraps inside the screen rather than push it wider. */
.company-site .site-block :is(h2, h3, p) { hyphens: auto; -webkit-hyphens: auto; hyphenate-limit-chars: 10 4 4; -webkit-hyphenate-limit-before: 5; -webkit-hyphenate-limit-after: 5; overflow-wrap: anywhere; }
.company-site .site-block-words { max-width: 780px; font-size: 17px; line-height: 1.6; }
.company-site .site-block-words p { margin: 0 0 16px; }
.company-site .site-block-words p:last-child { margin-bottom: 0; }
.company-site .site-block-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; align-items: center; }
.company-site .site-block-split h2 { margin: 0 0 24px; }
.company-site .site-block-picture { margin: 0; min-width: 0; }
.company-site .site-block-image { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 14px; background: #e4ebe2; }
.company-site .site-points { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; margin: 0; padding: 0; list-style: none; }
/* Four in a row on a wide screen, not three and one; a column stays wide enough for «Высококвалифицированные»
   whole — at 1 024 px four would be 208 px. */
@media (min-width: 1280px) {
  .company-site .site-points:has(> li:nth-child(4):last-child) { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.company-site .site-points li { min-width: 0; padding: 16px 0 0; border-top: 2px solid #16382b; }
.company-site .site-points h3 { margin: 0 0 8px; font-size: 19px; line-height: 1.3; color: #16382b; }
.company-site .site-points p { margin: 0; font-size: 15px; line-height: 1.55; color: #526353; }
.company-site .site-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px 40px; padding: 32px 40px; border: 1px solid #d9e3d8; border-radius: 20px; background: #fff; }
.company-site .site-cta-words { flex: 1 1 22em; min-width: 0; }
.company-site .site-cta h2 { margin: 0 0 8px; }
.company-site .site-cta-words p { margin: 0; max-width: 40em; font-size: 16px; color: #526353; }
.company-site .site-cta-action { flex: none; margin: 0; max-width: 100%; }
/* A clinic's warning under its «Преимущества» and «Призыв к записи» (38-ФЗ ст. 24 ч. 7): the block's own size and ink,
   a framed line across the block — never small grey print. */
.company-site .site-block .site-block-warning { max-width: none; margin: 24px 0 0; padding: 12px 16px; border: 1px solid #16382b; border-radius: 12px; font-size: 16px; font-weight: 600; line-height: 1.5; color: #16382b; }
.company-site .site-cta .site-block-warning { margin-top: 16px; }
.company-site .site-cta-action .btn { white-space: normal; text-align: center; }
.company-site .site-video { max-width: 960px; }
.company-site .site-video-poster { position: relative; display: grid; place-items: center; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 16px; background: linear-gradient(135deg, #16382b 0%, #2c5b46 100%); color: #fff; text-decoration: none; }
.company-site .site-video-cover { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.company-site .site-video-poster.with-photo::after { content: ""; position: absolute; inset: 0; background: rgba(12, 41, 30, .3); }
.company-site .site-video-play { position: relative; z-index: 1; display: grid; place-items: center; width: 76px; height: 76px; border-radius: 50%; background: var(--site-accent); color: #16382b; }
.company-site .site-video-play svg { margin-left: 4px; }
.company-site .site-video-label { position: absolute; z-index: 1; left: 20px; bottom: 18px; display: inline-flex; align-items: center; min-height: 36px; padding: 6px 12px; border-radius: 8px; background: #16382b; color: #fff; font-size: 14px; font-weight: 600; }
.company-site .site-video-poster:hover .site-video-label { text-decoration: underline; text-underline-offset: 3px; }
.company-site .site-video-poster:focus-visible { outline: 3px solid #16382b; outline-offset: 3px; }
.company-site .site-video-frame { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; border: 0; border-radius: 16px; background: #0c291e; }
.company-site .site-video-caption { max-width: 780px; margin: 16px 0 0; font-size: 16px; }
.company-site .site-video-note { margin: 8px 0 0; font-size: 13px; color: #526353; }
@media (max-width: 1023px) {
  .company-site .site-points { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .company-site .site-block-split { gap: 28px; }
}
@media (max-width: 699px) {
  .company-site .site-block-split { grid-template-columns: 1fr; }
  .company-site .site-block-split .site-block-picture { order: -1; }
  .company-site .site-block-words { font-size: 16px; }
  .company-site .site-points { grid-template-columns: 1fr; gap: 20px; }
  .company-site .site-cta { padding: 24px; border-radius: 16px; }
  .company-site .site-cta-action, .company-site .site-cta-action .btn { width: 100%; }
  .company-site .site-video-play { width: 60px; height: 60px; }
  .company-site .site-video-label { left: 12px; bottom: 12px; }
  .company-site .site-video-poster, .company-site .site-video-frame { border-radius: 12px; }
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .company-site .site-video-play { transition: transform .2s ease; }
  .company-site .site-video-poster:is(:hover, :focus-visible) .site-video-play { transform: scale(1.06); }
}
