/* ============================================================
   /projects — DARK  ·  12) LEGAL  (privacy / podmínky)
   ------------------------------------------------------------
   Jeden skleněný panel .psx-legal se stejným jazykem jako intro,
   ale text zarovnaný vlevo a užší sloupec pro čtení.
   Používá se na podstránkách /projects/*-privacy.
   ============================================================ */

body.psx-dark .psx-legal-page .psx-hero,
body.psx-dark .psx-legal-page .psx-section { display: none; }

body.psx-dark .psx-legal {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  max-width: 760px;
  margin: 0 auto;
  padding: 40px clamp(22px, 4vw, 48px) 46px;
  border-radius: var(--psx-radius-xl);
  background:
    radial-gradient(55% 45% at 50% -8%, rgba(31,171,188,0.10), rgba(31,171,188,0) 62%),
    linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.025)),
    rgba(9,11,15,0.66);   /* neprůhlednější podklad → čitelný text i přes dekorace v pozadí */
  border: 1px solid rgba(255,255,255,0.06);
  box-shadow: var(--psx-hi-teal), var(--psx-shadow);
  -webkit-backdrop-filter: blur(var(--psx-blur)) saturate(140%);
  backdrop-filter: blur(var(--psx-blur)) saturate(140%);
}
/* teal→coral gradient okraj – vlastní vrstva (::after už nese zrno z 11-glass.css) */
body.psx-dark .psx-legal__frame {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(135deg,
    rgba(86,205,218,0.55) 0%,
    rgba(86,205,218,0.10) 45%,
    rgba(255,140,128,0.12) 55%,
    rgba(255,140,128,0.45) 100%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
}

/* logo nahoře, vycentrované */
body.psx-dark .psx-legal__logo {
  display: flex;
  justify-content: center;
  margin-bottom: 22px;
  line-height: 0;
}
body.psx-dark .psx-legal__logo img {
  height: 84px;
  width: auto;
  opacity: 0.92;
}

body.psx-dark .psx-legal .psx-badge { margin-bottom: 14px; }

body.psx-dark .psx-legal__title {
  margin: 0 0 6px;
  font-size: clamp(30px, 4.4vw, 46px);
  line-height: 1.05;
  letter-spacing: -0.045em;
  font-weight: 800;
  color: var(--psx-heading);
}
body.psx-dark .psx-legal__updated {
  margin: 0 0 26px;
  font-size: 12.5px;
  letter-spacing: 0.04em;
  color: var(--psx-text-soft);
}

/* zvýrazněný „claim" */
body.psx-dark .psx-legal__note {
  margin: 0 0 28px;
  padding: 14px 18px;
  border-radius: var(--psx-radius-md);
  font-weight: 600;
  color: var(--psx-heading);
  background: rgba(31,171,188,0.10);
  border: 1px solid rgba(31,171,188,0.24);
}

body.psx-dark .psx-legal h2 {
  margin: 28px 0 10px;
  font-size: 16px;
  letter-spacing: 0.02em;
  color: var(--psx-heading);
}
body.psx-dark .psx-legal p {
  margin: 0 0 12px;
  font-size: 14px;
  line-height: 1.75;
  color: var(--psx-text);
}
body.psx-dark .psx-legal ul {
  margin: 0 0 12px;
  padding-left: 1.1em;
}
body.psx-dark .psx-legal li {
  margin: 7px 0;
  font-size: 14px;
  line-height: 1.7;
  color: var(--psx-text);
}
body.psx-dark .psx-legal li::marker { color: var(--psx-teal-light); }
body.psx-dark .psx-legal a {
  color: var(--psx-teal-light);
  text-decoration: none;
  border-bottom: 1px solid rgba(86,197,210,0.35);
}
body.psx-dark .psx-legal a:hover { border-bottom-color: rgba(86,197,210,0.8); }

body.psx-dark .psx-legal__back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 26px;
  padding: 10px 18px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  color: var(--psx-text);
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.12);
  text-decoration: none;
}
body.psx-dark .psx-legal__back:hover {
  border-color: rgba(86,197,210,0.5);
  background: rgba(31,171,188,0.08);
}

@media (max-width: 767px) {
  body.psx-dark .psx-legal { padding: 32px 18px 34px; border-radius: var(--psx-radius-lg); }
  body.psx-dark .psx-legal__logo img { height: 66px; }
}