/* Impressum / Datenschutz — legal pages, page-local only (enqueued in functions.php). Bare handoff tags (address, span-as-line) became classed Paragraph blocks here. */

.legalx{ display:grid; grid-template-columns:minmax(0,240px) minmax(0,1fr);
  gap:clamp(28px,5vw,90px); align-items:start; }

.legal-rail{ position:sticky; top:clamp(90px,9vw,116px); }
.legal-rail-lab{ display:block; margin:0; font-size:11px; font-weight:500; letter-spacing:.2em;
  text-transform:uppercase; color:var(--petrol); padding-bottom:12px; border-bottom:1px solid var(--petrol); }
.legal-rail ol{ list-style:none; margin:0; padding:0; counter-reset:lr; }
.legal-rail li{ counter-increment:lr; }
/* anchor now nests inside a Paragraph block (<li><p><a>) vs. the handoff's bare <li><a> — descendant selector still reaches it, just needs its margin killed. */
.legal-rail li p{ margin:0; }
.legal-rail a{ display:grid; grid-template-columns:2.1em minmax(0,1fr); gap:10px; align-items:baseline;
  padding:12px 0; border-bottom:1px solid var(--line);
  font-size:14.5px; line-height:1.45; color:var(--slate-text);
  transition:color .3s var(--ease-out), padding-left .4s var(--ease-out); }
.legal-rail a::before{ content:counter(lr,decimal-leading-zero);
  font-size:11px; font-weight:600; letter-spacing:.12em; color:var(--petrol); }
.legal-rail a:hover{ color:var(--petrol); padding-left:5px; }
.legal-rail a.is-active{ color:var(--ink); font-weight:500; }

/* anchor targets clear the fixed nav on jump */
.legal-sec{ scroll-margin-top:clamp(104px,11vw,132px); }

.legal{ max-width:64ch; }

/* the responsible party is the one fact a visitor comes for: it gets the
   page's single dark ground, everything else stays plain prose */
.legal-hero{ background:var(--petrol-deep); border-radius:var(--r-card);
  padding:clamp(26px,3.2vw,46px) clamp(24px,3vw,44px); }
.legal-hero svg{ width:18px; height:18px; fill:var(--turquoise); display:block; margin-bottom:14px; }
/* base rule also used stand-alone (e.g. Datenschutz) — the hero-scoped rule below only overrides color/font-size for the dark ground. */
.legal-address{ margin:0; font-size:17px; line-height:1.78; color:var(--ink-soft); font-style:normal; }
.legal-address strong{ font-weight:600; color:var(--ink); }
.legal-address a{ color:var(--petrol); }
.legal-address a:hover{ color:var(--petrol-deep); }
.legal-contact{ margin-top:14px; display:grid; gap:4px; }

.legal-hero .legal-address{ color:rgba(255,255,255,.82); font-size:16.5px; }
.legal-hero .legal-address strong{ display:block; margin-bottom:10px; color:#fff; font-weight:400;
  font-family:var(--font-display),var(--font-fallback),system-ui,sans-serif;
  font-size:clamp(19px,1.9vw,23px); letter-spacing:-.02em; line-height:1.3; }
.legal-hero .legal-address a{ color:#fff; text-decoration:underline; text-decoration-color:rgba(255,255,255,.4);
  text-underline-offset:3px; }
.legal-hero .legal-address a:hover{ color:#fff; text-decoration-color:#fff; }
.legal-hero .legal-contact{ margin-top:18px; padding-top:16px; border-top:1px solid rgba(255,255,255,.24); }
/* stacks via .legal-contact's grid+gap above — child <p>s just need their default margin killed. */
.legal-hero .legal-contact p{ margin:0; color:rgba(255,255,255,.82); font-size:16.5px; }
.legal-hero .legal-contact a{ color:#fff; text-decoration:underline; text-decoration-color:rgba(255,255,255,.4);
  text-underline-offset:3px; }
.legal-hero .legal-contact a:hover{ color:#fff; text-decoration-color:#fff; }

/* register facts / representatives: hairline rows, not a nested list */
.legal-rows{ list-style:none; margin:clamp(18px,2vw,26px) 0 0; padding:0;
  border-top:1px solid var(--line); }
.legal-rows li{ display:grid; grid-template-columns:clamp(170px,18vw,200px) minmax(0,1fr);
  gap:6px clamp(16px,2.4vw,34px); padding:13px 0; border-bottom:1px solid var(--line);
  font-size:16px; line-height:1.6; color:var(--ink); }
.legal-rows li p{ margin:0; }
.legal-rows .k{ font-size:11px; font-weight:500; letter-spacing:.18em; text-transform:uppercase;
  color:var(--petrol); padding-top:.45em; }
.legal-names{ list-style:none; margin:clamp(18px,2vw,26px) 0 0; padding:0;
  display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));
  gap:0 clamp(24px,3vw,48px); }
.legal-names li{ display:flex; align-items:baseline; gap:12px; padding:12px 0;
  border-bottom:1px solid var(--line); font-size:16.5px; line-height:1.5; color:var(--ink); }
.legal-names li p{ margin:0; }
.legal-names li::before{ content:""; width:10px; height:1px; background:var(--petrol); flex:none; transform:translateY(-.45em); }

@media (max-width:900px){
  .legalx{ grid-template-columns:1fr; gap:clamp(24px,4vw,40px); }
  .legal-rail{ position:static; }
  .legal-rail ol{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr)); gap:0 28px; }
}

.legal-sec + .legal-sec{ margin-top:clamp(34px,3.6vw,54px); }
.legal-sec .sec-rule{ margin-bottom:16px; }
.legal-sec h2{ font-family:var(--font-display),var(--font-fallback),system-ui,sans-serif;
  font-size:clamp(21px,2vw,27px); font-weight:400; letter-spacing:-.018em; line-height:1.16;
  color:var(--ink); margin:0 0 14px; }
/* direct-child combinator, not descendant: a bare ".legal-sec p" was reaching into nested .legal-rows/.legal-names/.legal-hero paragraphs and clobbering their own styling. */
.legal-sec > p{ margin:0; font-size:17px; line-height:1.78; color:var(--ink-soft); }
.legal-sec > p + p{ margin-top:14px; }
/* .legal-source is now a Group block (image + paragraph side by side) — its
   own <a> links (one on the image, one on the text) share this hover style
   via the shared ancestor, so both act as one clickable unit visually. */
.legal-source{transition: color .3s var(--ease-out), padding-left .4s var(--ease-out); margin-top:18px !important; padding-top:18px !important; border-top:1px solid var(--line);
  align-items:center !important; gap:10px !important;
  font-size:14px !important; line-height:14px !important; color:var(--slate-text) !important; }
.legal-source > *{ margin:0 !important; }
.legal-source a{ display:flex !important; align-items:center !important;
  color:inherit !important; text-decoration:none !important; line-height:14px !important;
  transition:color .25s var(--ease-out), opacity .25s var(--ease-out); }
.legal-source:hover {  padding-left: 5px;}
.legal-source:hover a{ color:var(--petrol) !important; color: var(--petrol);text-decoration: underline;}
.legal-source-logo{ flex-shrink:0; }
.legal-source-logo img{ height:32px !important; width:auto !important; display:block; }

/* placeholder marker, visible on purpose so nothing ships unnoticed — not used by Impressum. */
.ph-note{ display:inline-flex; align-items:center; gap:.7em; margin:0;
  font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:12.5px; letter-spacing:.02em;
  color:var(--petrol-deep); background:var(--accent-tint); border:1px dashed rgba(11,102,121,.45);
  border-radius:8px; padding:11px 14px; }
.ph-note::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--turquoise); flex:none; }
.ph-inline{ font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:12px; letter-spacing:.02em;
  color:var(--petrol-deep); background:var(--accent-tint); border-radius:5px; padding:2px 7px; white-space:nowrap; }
.legal-updated{ margin-top:clamp(38px,4vw,58px); padding-top:22px; border-top:1px solid var(--line);
  font-size:13.5px; color:var(--slate-text); }