/* Rechtliches skin — scoped to /rechtliches/ (page id 160371) */
body.page-id-160371 .gmg-recht-row * { box-sizing: border-box; }
body.page-id-160371 ::selection { background: #E30613; color: #fff; }

/* top scroll-progress bar */
body.page-id-160371 .gmg-r-progress {
  position: fixed; top: 0; left: 0; height: 3px; width: 0%;
  background: #E30613; z-index: 200; transition: width .1s linear;
}

/* reveal-on-scroll */
body.page-id-160371 [data-reveal] {
  opacity: 0; transform: translateY(24px);
  transition: opacity .8s cubic-bezier(.22,1,.36,1), transform .8s cubic-bezier(.22,1,.36,1);
}
body.page-id-160371 [data-reveal].in { opacity: 1; transform: none; }

/* sticky tabbar — sits under the theme header; JS sets --gmg-hdr, fallback 74px */
body.page-id-160371 .gmg-r-tabbar {
  position: sticky; top: var(--gmg-hdr, 74px); z-index: 90;
  background: rgba(255,255,255,.92); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid #E6E4E0;
  display: flex; gap: 6px; height: 62px; align-items: center; overflow-x: auto;
  max-width: 1280px; margin: 0 auto; padding: 0 28px;
}
body.page-id-160371 .gmg-r-tabbar button {
  border: none; cursor: pointer; padding: 10px 22px; border-radius: 100px;
  font-size: 14px; font-weight: 600; white-space: nowrap; transition: all .25s;
  background: transparent; color: #6E6E73;
}

/* hero + main wrappers (mockup used inline; wrappers get layout here) */
body.page-id-160371 .gmg-r-main { max-width: 1280px; margin: 0 auto; padding: 64px 28px 110px; }
body.page-id-160371 .gmg-r-panel[hidden] { display: none; }

/* TOC grid (mockup .legal-grid / .legal-aside) */
body.page-id-160371 .legal-grid { display: grid; grid-template-columns: 262px 1fr; gap: 56px; align-items: start; }
body.page-id-160371 .legal-aside {
  position: sticky; top: calc(var(--gmg-hdr, 74px) + 76px);
  max-height: calc(100vh - 180px); overflow-y: auto;
}
@media (max-width: 900px) {
  body.page-id-160371 .legal-grid { grid-template-columns: 1fr; gap: 0; }
  body.page-id-160371 .legal-aside { display: none; }
}

@keyframes gmgpulse { 0%, 100% { opacity: .5; } 50% { opacity: 1; } }

/* ============================================================
   Post-review fixes
   ============================================================ */

/* #4 — Hero heading must be white. Uncode forces a dark heading colour that
   overrides the section's inherited white. The red dot keeps its own inline
   colour (no !important here, so inline wins for the dot). */
body.page-id-160371 .gmg-r-hero h1,
body.page-id-160371 .gmg-r-hero [data-hero-ital] { color: #fff; }

/* #5 — wpautop inserts empty <p></p> inside vc_column_text, which break the
   info-banner flex row (pushing the "i" onto its own line) and add stray gaps. */
body.page-id-160371 .gmg-recht-row p:empty { display: none; }

/* #1 — Hero is its OWN full-width dark row (el_class gmg-r-hero-row) set as the
   Uncode "first_row" header, so the nav overlaps it with no gap and the dark row
   background covers the site's red body colour (same pattern as /contact-business/).
   The section stays at the boxed content width so its text lines up with the body
   content; only the video + dark overlay bleed to the full viewport width. */
body.page-id-160371 .gmg-r-hero {
  position: relative;
  display: block;
  min-height: 66vh;
  overflow: visible;
}
/* video + the full-cover linear overlay bleed to the viewport edges */
body.page-id-160371 .gmg-r-hero video,
body.page-id-160371 .gmg-r-hero > div[style*="inset"] {
  left: calc(50% - 50vw) !important;
  right: auto !important;
  width: 100vw !important;
}
/* wrappers of the hero row must not clip the bleeding video */
body.page-id-160371 .gmg-r-hero-row .uncode_text_column,
body.page-id-160371 .gmg-r-hero-row .uncont,
body.page-id-160371 .gmg-r-hero-row .uncell,
body.page-id-160371 .gmg-r-hero-row .row,
body.page-id-160371 .gmg-r-hero-row .wpb_column { overflow: visible !important; }
/* the hero row was created with zero horizontal padding; restore the theme's row
   padding so the hero text lines up with the boxed body content (left ~62px). */
body.page-id-160371 .gmg-r-hero-row > .row-container > .row { padding-left: 36px !important; padding-right: 36px !important; }

/* #2 — the info-banner text <p> gets a stray top margin that pushes the text
   below the "i". Zero it so the icon sits on the first line. */
body.page-id-160371 .gmg-r-info p { margin: 0 !important; }

/* #3 — wpautop wraps the sidebar TOC links in <p> and inserts a <br> after each
   block <a>, doubling the spacing. Kill the breaks and the wrapper margin. */
body.page-id-160371 .legal-aside br { display: none; }
body.page-id-160371 .legal-aside p { margin: 0; }