/* PCM VISION Unterseiten im Blueprint der Kapitelkarten.

   Rechtsseiten, Plattformseiten und die Founder-Seite kommen aus einem Dutzend
   verschiedener Wix-Layouts. Diese Datei legt dieselbe Sprache darueber:
   dunkle Buehne, eine zentrierte Karte, Kicker in Mono-Cyan, Titel in
   Space Grotesk mit goldener zweiter Zeile, Fliesstext in Inter, Kacheln mit
   dem Kartenrahmen. Der Inhalt der Seiten bleibt unangetastet - nur die
   Darstellung wird angeglichen. */

body.pcm-blueprint-page{
  --legal-accent:var(--ifc-cyan,#31dce8);
  --legal-line:rgba(255,255,255,.12);
  --legal-surface:linear-gradient(180deg,rgba(5,11,17,.95),rgba(7,9,16,.92));
  background:#04060b!important;
  color:rgba(255,255,255,.82)!important;
}

/* Die Seiten bringen eigene Hintergrundeffekte mit; sie bleiben, treten aber
   hinter die Karte zurueck. */
body.pcm-blueprint-page canvas,
body.pcm-blueprint-page .scan-line,
body.pcm-blueprint-page .visual-glow{
  opacity:.35!important;
}

/* ===== Buehne und Karte ===== */

body.pcm-blueprint-page .impressum-content,
body.pcm-blueprint-page .legal-content,
body.pcm-blueprint-page .shell,
body.pcm-blueprint-page .security-section,
body.pcm-blueprint-page .page,
body.pcm-blueprint-page #page,
body.pcm-blueprint-page .content,
body.pcm-blueprint-page .section-wrap,
body.pcm-blueprint-page .section{
  box-sizing:border-box;
  max-width:none!important;
  padding-top:clamp(78px,9vh,110px)!important;
}

body.pcm-blueprint-page .impressum-shell,
body.pcm-blueprint-page .legal-shell,
body.pcm-blueprint-page .konto-shell,
body.pcm-blueprint-page .shell,
body.pcm-blueprint-page .security-wrap,
body.pcm-blueprint-page .wrap,
body.pcm-blueprint-page .brand-shell,
body.pcm-blueprint-page .hero,
body.pcm-blueprint-page .chapter,
body.pcm-blueprint-page .quote-band,
body.pcm-blueprint-page .final-signature,
body.pcm-blueprint-page .chapter-wrap{
  box-sizing:border-box!important;
  width:min(860px,calc(100vw - 32px))!important;
  max-width:min(860px,calc(100vw - 32px))!important;
  margin-inline:auto!important;
  padding:clamp(20px,2.4vw,32px)!important;
  border:1px solid color-mix(in srgb,var(--legal-accent) 34%,rgba(255,255,255,.14))!important;
  border-radius:22px!important;
  background:
    var(--legal-surface),
    color-mix(in srgb,var(--legal-accent) 3%,rgba(2,4,7,.96))!important;
  box-shadow:
    0 36px 100px rgba(0,0,0,.52),
    inset 0 1px 0 rgba(255,255,255,.10),
    0 0 54px -34px var(--legal-accent)!important;
}

/* ===== Typografie wie in den Kapitelkarten ===== */

body.pcm-blueprint-page .kicker,
body.pcm-blueprint-page .konto-kicker,
body.pcm-blueprint-page .legal-kicker,
body.pcm-blueprint-page .chapter-number,
body.pcm-blueprint-page .eyebrow,
body.pcm-blueprint-page .pillar-kicker,
body.pcm-blueprint-page .quote-band-label,
body.pcm-blueprint-page .signature-role,
body.pcm-blueprint-page .matrix-code,
body.pcm-blueprint-page .feature-index,
body.pcm-blueprint-page .card-code,
body.pcm-blueprint-page .node-code,
body.pcm-blueprint-page .skill-code,
body.pcm-blueprint-page .phase-code,
body.pcm-blueprint-page .metric-head,
body.pcm-blueprint-page .fragment-index,
body.pcm-blueprint-page .panel-topline{
  display:flex;
  align-items:center;
  gap:9px;
  margin:0 0 8px!important;
  color:var(--legal-accent)!important;
  font-family:var(--mono,"Share Tech Mono",monospace)!important;
  font-size:10px!important;
  font-weight:700!important;
  line-height:1.35!important;
  letter-spacing:.12em!important;
  text-transform:uppercase;
}

body.pcm-blueprint-page h1,
body.pcm-blueprint-page .impressum-title,
body.pcm-blueprint-page .legal-title{
  margin:8px 0 10px!important;
  color:#fff!important;
  font-family:var(--display,"Space Grotesk",sans-serif)!important;
  font-size:clamp(29px,3vw,42px)!important;
  font-weight:700!important;
  line-height:1.02!important;
  letter-spacing:0!important;
  text-transform:none!important;
  text-wrap:balance;
}

body.pcm-blueprint-page h1 span,
body.pcm-blueprint-page .impressum-title span,
body.pcm-blueprint-page .legal-title span{
  color:var(--ifc-gold,#e7d4b5)!important;
}

body.pcm-blueprint-page h2{
  margin:26px 0 8px!important;
  color:#fff!important;
  font-family:var(--display,"Space Grotesk",sans-serif)!important;
  font-size:clamp(18px,1.6vw,22px)!important;
  font-weight:650!important;
  line-height:1.15!important;
  letter-spacing:0!important;
}

body.pcm-blueprint-page h3{
  margin:18px 0 6px!important;
  color:rgba(255,255,255,.9)!important;
  font-family:var(--body,'Inter',sans-serif)!important;
  font-size:14px!important;
  font-weight:650!important;
  line-height:1.3!important;
  letter-spacing:0!important;
}

body.pcm-blueprint-page p,
body.pcm-blueprint-page li{
  color:rgba(255,255,255,.74)!important;
  font-family:var(--body,'Inter',sans-serif)!important;
  font-size:14px!important;
  line-height:1.52!important;
  letter-spacing:0!important;
}

body.pcm-blueprint-page .impressum-lead,
body.pcm-blueprint-page .legal-lead,
body.pcm-blueprint-page .lead{
  max-width:64ch!important;
  color:rgba(255,255,255,.78)!important;
  font-size:14px!important;
  line-height:1.52!important;
}

body.pcm-blueprint-page strong{
  color:#fff!important;
  font-weight:650!important;
}

body.pcm-blueprint-page a:not(.pcm-header-brand):not(.pcm-header-konto):not(.pcm-footer-legal a){
  color:var(--legal-accent)!important;
  text-decoration:none!important;
  border-bottom:1px solid color-mix(in srgb,var(--legal-accent) 46%,transparent);
}

/* ===== Kacheln, Karten, Abschnitte ===== */

body.pcm-blueprint-page .impressum-flow-card,
body.pcm-blueprint-page .legal-section,
body.pcm-blueprint-page .konto-zahlen article,
body.pcm-blueprint-page .konto-sperre,
body.pcm-blueprint-page .konto-status,
body.pcm-blueprint-page .mini-card,
body.pcm-blueprint-page .price-card,
body.pcm-blueprint-page .fragment,
body.pcm-blueprint-page .visual-card,
body.pcm-blueprint-page .notice,
body.pcm-blueprint-page .text-card,
body.pcm-blueprint-page .matrix-card,
body.pcm-blueprint-page .feature-card,
body.pcm-blueprint-page .metric-card,
body.pcm-blueprint-page .metric-tile,
body.pcm-blueprint-page .trust-card,
body.pcm-blueprint-page .security-card,
body.pcm-blueprint-page .location-card,
body.pcm-blueprint-page .pillar,
body.pcm-blueprint-page .knowledge-facts,
body.pcm-blueprint-page .trust-chip,
body.pcm-blueprint-page .alert-row,
body.pcm-blueprint-page .content-image,
body.pcm-blueprint-page .contact{
  box-sizing:border-box;
  padding:clamp(14px,1.6vw,18px)!important;
  border:1px solid var(--legal-line)!important;
  border-radius:14px!important;
  background:rgba(255,255,255,.035)!important;
  box-shadow:none!important;
}

body.pcm-blueprint-page .impressum-flow-index,
body.pcm-blueprint-page .konto-sperre-marke,
body.pcm-blueprint-page .mini-label,
body.pcm-blueprint-page .price-badge,
body.pcm-blueprint-page .fragment-icon{
  color:var(--legal-accent)!important;
  font-family:var(--mono,"Share Tech Mono",monospace)!important;
  font-size:9px!important;
  font-weight:700!important;
  line-height:1.2!important;
  letter-spacing:.12em!important;
  text-transform:uppercase;
}

body.pcm-blueprint-page .impressum-flow-title,
body.pcm-blueprint-page .price-title,
body.pcm-blueprint-page .matrix-title,
body.pcm-blueprint-page .feature-title,
body.pcm-blueprint-page .card-title,
body.pcm-blueprint-page .node-title,
body.pcm-blueprint-page .skill-name,
body.pcm-blueprint-page .signature-name,
body.pcm-blueprint-page .fragment-title{
  margin-top:6px!important;
  color:#fff!important;
  font-family:var(--body,'Inter',sans-serif)!important;
  font-size:15px!important;
  font-weight:650!important;
  line-height:1.25!important;
  letter-spacing:0!important;
}

body.pcm-blueprint-page .price-value,
body.pcm-blueprint-page .license-value{
  color:var(--ifc-gold,#e7d4b5)!important;
  font-family:var(--mono,"Share Tech Mono",monospace)!important;
  font-weight:700!important;
  letter-spacing:0!important;
}

/* Badges und Marken folgen den Chips der Kapitelkarten. */
body.pcm-blueprint-page .legal-badge,
body.pcm-blueprint-page .nav-item,
body.pcm-blueprint-page .tab-btn,
body.pcm-blueprint-page .panel-state,
body.pcm-blueprint-page .mode-btn,
body.pcm-blueprint-page .dot,
body.pcm-blueprint-page .phase,
body.pcm-blueprint-page .feature{
  padding:6px 11px!important;
  color:#e4e7ed!important;
  background:rgba(255,255,255,.045)!important;
  border:1px solid rgba(255,255,255,.11)!important;
  border-radius:8px!important;
  font-family:var(--mono,"Share Tech Mono",monospace)!important;
  font-size:9px!important;
  font-weight:700!important;
  line-height:1.2!important;
  letter-spacing:.04em!important;
  text-transform:uppercase;
}

body.pcm-blueprint-page .legal-badge.green{
  color:var(--green,#46e6a5)!important;
  border-color:color-mix(in srgb,var(--green,#46e6a5) 46%,transparent)!important;
}

body.pcm-blueprint-page .legal-badge.warning{
  color:var(--gold,#f0dfc4)!important;
  border-color:color-mix(in srgb,var(--gold,#f0dfc4) 46%,transparent)!important;
}

body.pcm-blueprint-page .trust-bar{
  height:6px!important;
  overflow:hidden;
  border-radius:999px!important;
  background:rgba(255,255,255,.09)!important;
}

/* Kennzahl und Beschriftung in einer Kachel: der Wert in Mono und Akzentfarbe,
   die Beschriftung klein darunter. Dieselbe Anordnung wie bei den Fact-Boxen
   der Startseite. */
body.pcm-blueprint-page .trust-chip,
body.pcm-blueprint-page .metric-tile,
body.pcm-blueprint-page .metric-card{
  display:grid!important;
  gap:6px!important;
  align-content:start!important;
}

body.pcm-blueprint-page .trust-value,
body.pcm-blueprint-page .metric-value,
body.pcm-blueprint-page .node-value{
  display:block;
  margin:0!important;
  color:var(--legal-accent)!important;
  font-family:var(--mono,"Share Tech Mono",monospace)!important;
  font-size:17px!important;
  font-weight:700!important;
  line-height:1.2!important;
  letter-spacing:.04em!important;
}

body.pcm-blueprint-page .trust-label,
body.pcm-blueprint-page .metric-label,
body.pcm-blueprint-page .node-label,
body.pcm-blueprint-page .metric-text{
  display:block;
  margin:0!important;
  color:rgba(255,255,255,.62)!important;
  font-family:var(--body,'Inter',sans-serif)!important;
  font-size:11.5px!important;
  font-weight:400!important;
  line-height:1.4!important;
  letter-spacing:0!important;
}

/* Die Fusszeile steht auf diesen Seiten im Dokumentfluss und braucht Luft. */
body.pcm-blueprint-page .pcm-footer{
  margin-top:clamp(28px,4vh,48px);
  border-top:1px solid var(--legal-line);
}

@media(max-width:820px){
  body.pcm-blueprint-page .impressum-shell,
  body.pcm-blueprint-page .legal-shell,
  body.pcm-blueprint-page .shell,
  body.pcm-blueprint-page .security-wrap,
  body.pcm-blueprint-page .wrap,
  body.pcm-blueprint-page .brand-shell,
  body.pcm-blueprint-page .hero,
  body.pcm-blueprint-page .chapter,
  body.pcm-blueprint-page .quote-band,
  body.pcm-blueprint-page .final-signature,
  body.pcm-blueprint-page .chapter-wrap{
    width:calc(100vw - 20px)!important;
    max-width:calc(100vw - 20px)!important;
    padding:18px 16px 16px!important;
    border-radius:20px!important;
  }

  body.pcm-blueprint-page .impressum-content,
  body.pcm-blueprint-page .legal-content,
  body.pcm-blueprint-page .shell,
  body.pcm-blueprint-page .security-section,
  body.pcm-blueprint-page .section{
    padding-top:76px!important;
  }

  body.pcm-blueprint-page p,
  body.pcm-blueprint-page li{
    font-size:13px!important;
    line-height:1.5!important;
  }
}

/* ===== Breite Inhalte duerfen die Karte nicht sprengen =====

   Die Wix-Layouts bringen feste Raster mit (Preistabelle, Flow-Kacheln). In der
   schmaleren Karte laufen sie sonst aus dem Bild. Breite Tabellen scrollen
   deshalb in sich, Kachelraster brechen um. */

body.pcm-blueprint-page .impressum-shell,
body.pcm-blueprint-page .legal-shell,
body.pcm-blueprint-page .shell,
body.pcm-blueprint-page .chapter-wrap{
  overflow-x:hidden;
}

body.pcm-blueprint-page .license-table,
body.pcm-blueprint-page .license-table-wrap,
body.pcm-blueprint-page table{
  display:block;
  max-width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}

body.pcm-blueprint-page .license-table-head,
body.pcm-blueprint-page .license-table-row{
  min-width:640px;
}

body.pcm-blueprint-page .feature-grid,
body.pcm-blueprint-page .matrix-grid,
body.pcm-blueprint-page .metric-strip,
body.pcm-blueprint-page .trust-strip,
body.pcm-blueprint-page .trust-row,
body.pcm-blueprint-page .dashboard-grid,
body.pcm-blueprint-page .pillar-grid,
body.pcm-blueprint-page .fragment-grid,
body.pcm-blueprint-page .impressum-flow-grid{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr))!important;
  gap:12px!important;
}

body.pcm-blueprint-page .impressum-flow-card,
body.pcm-blueprint-page .mini-card,
body.pcm-blueprint-page .price-card,
body.pcm-blueprint-page .fragment,
body.pcm-blueprint-page .legal-section,
body.pcm-blueprint-page .text-card,
body.pcm-blueprint-page .matrix-card,
body.pcm-blueprint-page .feature-card,
body.pcm-blueprint-page .metric-card,
body.pcm-blueprint-page .metric-tile,
body.pcm-blueprint-page .trust-card,
body.pcm-blueprint-page .security-card,
body.pcm-blueprint-page .pillar,
body.pcm-blueprint-page .visual-card,
body.pcm-blueprint-page .license-cell{
  min-width:0!important;
  overflow-wrap:anywhere;
}

body.pcm-blueprint-page img,
body.pcm-blueprint-page svg,
body.pcm-blueprint-page canvas{
  max-width:100%;
}

/* Die DSG-Uebersicht buendelt die Pflichtangaben; sie liest sich als Liste aus
   Stichwort und Antwort, nicht als Fliesstext. */
/* The imported two-column ratio assumed a 1560px shell, not the 860px blueprint. */
body.pcm-blueprint-page .legal-shell{
  grid-template-columns:220px minmax(0,1fr)!important;
  gap:20px!important;
  align-items:start!important;
}

body.pcm-blueprint-page .legal-main{
  min-width:0;
}

body.pcm-blueprint-page .legal-side .legal-title{
  font-size:28px!important;
  overflow-wrap:anywhere;
}

body.pcm-blueprint-page .dsg-grid{
  display:grid;
  gap:10px;
  margin:14px 0 0!important;
  padding:0!important;
}

body.pcm-blueprint-page .dsg-row{
  display:grid;
  grid-template-columns:minmax(190px,.8fr) minmax(0,1.9fr);
  gap:14px;
  padding:12px 0;
  border-top:1px solid var(--legal-line);
}

body.pcm-blueprint-page .dsg-row dt{
  margin:0!important;
  color:var(--legal-accent)!important;
  font-family:var(--mono,"Share Tech Mono",monospace)!important;
  font-size:9px!important;
  font-weight:700!important;
  line-height:1.35!important;
  letter-spacing:.12em!important;
  text-transform:uppercase;
}

body.pcm-blueprint-page .dsg-row dd{
  margin:0!important;
  color:rgba(255,255,255,.78)!important;
  font-family:var(--body,'Inter',sans-serif)!important;
  font-size:13.5px!important;
  line-height:1.5!important;
}

body.pcm-blueprint-page .dsg-row code{
  padding:1px 6px;
  color:#e4e7ed;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  border-radius:6px;
  font-family:var(--mono,"Share Tech Mono",monospace);
  font-size:11px;
}

@media(max-width:820px){
  body.pcm-blueprint-page .legal-shell{
    grid-template-columns:minmax(0,1fr)!important;
  }
  body.pcm-blueprint-page .dsg-row{
    grid-template-columns:minmax(0,1fr);
    gap:5px;
  }
}

/* ===== Inhaltsseiten =====

   Die Plattformseiten erzaehlen in Abschnitten. Jeder Abschnitt wird eine Karte,
   die Folge der Karten ersetzt das fruehere Vollbild-Layout. Zwei Dinge muessen
   dafuer weichen: feste Hoehen (die Abschnitte fuellten je einen Bildschirm) und
   zweispaltige Raster, die in der schmaleren Karte nicht mehr aufgehen. */

/* Die Inhaltsseiten scrollten in einem eigenen Kasten (html und body auf
   overflow:hidden, main mit fester Hoehe). Unter dem Blueprint scrollt das
   Dokument selbst: die Karten stehen untereinander, die Fusszeile schliesst ab,
   und niemand scrollt in einem Fenster im Fenster. */
html:has(body.pcm-blueprint-page),
body.pcm-blueprint-page{
  height:auto!important;
  min-height:100%!important;
  overflow:visible!important;
}

body.pcm-blueprint-page #page,
body.pcm-blueprint-page > main,
body.pcm-blueprint-page .page,
body.pcm-blueprint-page .content{
  /* Der Inhalt lag absolut ueber der Seite; im Fluss steht er vor der
     Fusszeile statt darunter. */
  position:relative!important;
  height:auto!important;
  max-height:none!important;
  overflow:visible!important;
  scroll-snap-type:none!important;
  mask-image:none!important;
  -webkit-mask-image:none!important;
}

body.pcm-blueprint-page .section,
body.pcm-blueprint-page .security-section{
  min-height:0!important;
  height:auto!important;
  display:block!important;
  padding-bottom:clamp(10px,1.6vh,20px)!important;
}

body.pcm-blueprint-page .chapter-wrap,
body.pcm-blueprint-page .security-wrap,
body.pcm-blueprint-page .wrap,
body.pcm-blueprint-page .brand-shell{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  gap:clamp(12px,1.6vw,18px)!important;
  align-items:start!important;
}

body.pcm-blueprint-page .text-col,
body.pcm-blueprint-page .visual-col,
body.pcm-blueprint-page .brand-copy,
body.pcm-blueprint-page .brand-panel,
body.pcm-blueprint-page .hero-copy{
  min-width:0!important;
  max-width:100%!important;
  width:auto!important;
  /* Die Spalten standen im zweispaltigen Layout am Rand ausgerichtet
     (justify-self:end). Untereinander muessen sie die Karte fuellen. */
  justify-self:stretch!important;
  align-self:start!important;
}

/* Die Seiten blenden ihre Abschnitte beim Scrollen ein. Bleibt der Beobachter
   aus (Reduced Motion, Druckansicht, Screenshot vor dem Scrollen), waere die
   Seite leer - deshalb ist der Ruhezustand sichtbar. */
body.pcm-blueprint-page .scroll-fx{
  opacity:1!important;
  transform:none!important;
}

/* Die Kopfspalte der Founder-Seite war zweispaltig; in der Karte steht sie
   als Stapel, sonst haelt sie sich an ihrer alten halben Breite fest. */
body.pcm-blueprint-page .hero-copy,
body.pcm-blueprint-page .signature-grid{
  display:block!important;
}

/* Dekoration der Founder-Seite tritt hinter die Karten zurueck. */
body.pcm-blueprint-page .founder-portrait,
body.pcm-blueprint-page .gold-line-left,
body.pcm-blueprint-page .gold-line-center,
body.pcm-blueprint-page .gold-orbit,
body.pcm-blueprint-page .page-index,
body.pcm-blueprint-page .halo-core,
body.pcm-blueprint-page .crane,
body.pcm-blueprint-page .tower,
body.pcm-blueprint-page .floorplan,
body.pcm-blueprint-page .parallax-layer{
  opacity:.28!important;
}

/* Die Founder-Seite ist eine Sonderseite: sie traegt Gold statt Cyan, weil sie
   von Herkunft und Haltung erzaehlt und nicht von der Plattform. */
body.pcm-blueprint-page.pcm-page-founder{
  --legal-accent:var(--gold,#f0dfc4);
}

/* ===== Leben auf den Unterseiten =====
   Karten, Kacheln und Ueberschriften gleiten beim Scrollen der Reihe nach
   herein, Kacheln heben sich unter dem Zeiger, ein weiches Licht wandert langsam
   hinter der Buehne. site-chrome.js setzt html.pcm-bewegt nur, wenn ein
   IntersectionObserver da ist und keine reduzierte Bewegung verlangt wird;
   ohne die Klasse bleibt alles sichtbar wie bisher. Bewegt wird nur Lage und
   Deckkraft, ueber translate, das sich auf ein vorhandenes transform setzt. */
html.pcm-bewegt body.pcm-blueprint-page .pcm-auftritt{
  opacity:0;
  translate:0 22px;
  transition:
    opacity .7s ease var(--pcm-verzug,0s),
    translate .85s cubic-bezier(.2,.8,.2,1) var(--pcm-verzug,0s),
    border-color .3s ease,
    background-color .3s ease;
}
html.pcm-bewegt body.pcm-blueprint-page .pcm-auftritt.ist-da{
  opacity:1;
  translate:0 0;
}

@media (hover:hover){
  body.pcm-blueprint-page .pcm-kachel{
    transition:translate .3s cubic-bezier(.2,.8,.2,1),border-color .3s ease,opacity .7s ease,background-color .3s ease;
  }
  html.pcm-bewegt body.pcm-blueprint-page .pcm-kachel.ist-da:hover,
  html:not(.pcm-bewegt) body.pcm-blueprint-page .pcm-kachel:hover{
    translate:0 -3px;
    border-color:color-mix(in srgb,var(--legal-accent) 48%,transparent)!important;
    background-color:rgba(255,255,255,.055)!important;
    transition-delay:0s;
  }
}

@keyframes pcm-licht-wandern{
  0%{ transform:translate3d(-18vw,-8vh,0) scale(1); }
  50%{ transform:translate3d(16vw,12vh,0) scale(1.18); }
  100%{ transform:translate3d(-18vw,-8vh,0) scale(1); }
}
.pcm-lichtschleier{
  position:fixed;
  left:50%;
  top:30%;
  z-index:-1;
  width:70vmax;
  height:70vmax;
  margin:-35vmax 0 0 -35vmax;
  border-radius:50%;
  background:radial-gradient(closest-side,color-mix(in srgb,var(--legal-accent,#31dce8) 13%,transparent),transparent);
  pointer-events:none;
  animation:pcm-licht-wandern 26s ease-in-out infinite;
}

@media (prefers-reduced-motion:reduce){
  .pcm-lichtschleier{ display:none; }
}
@media print{
  html.pcm-bewegt body.pcm-blueprint-page .pcm-auftritt{ opacity:1; translate:none; }
  .pcm-lichtschleier{ display:none; }
}