/*
Theme Name: PowerSmartCoat v2
Theme URI: https://powersmartcoat.de
Author: PowerSmartCoat
Author URI: https://powersmartcoat.de
Description: Partnerseite für die Nanosphären-Dämmbeschichtung PowerSmartCoat. Dunkle Fläche, fünf im Code gezeichnete technische Grafiken, Ersparnisrechner, technisches Merkblatt, natives Partnerformular mit Leads-Tabelle. Keine externen Laufzeit-Ressourcen: Schrift, Skripte und Grafiken liegen im Theme, die Partnerkarte lädt erst nach ausdrücklicher Zustimmung.
Version: 3.8.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: powersmartcoat
*/

/* Inter is served locally to avoid a pre-consent request to Google Fonts. */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url('assets/fonts/inter-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url('assets/fonts/inter-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ============================================================
   DESIGN TOKENS
   ============================================================ */
:root {
  --psc-bg:            #06101a;
  --psc-bg-elev:       #0a1724;
  --psc-bg-card:       #0f2031;
  --psc-bg-raised:     #142a3f;
  --psc-border:        rgba(173, 205, 229, 0.18);
  --psc-border-strong: rgba(173, 205, 229, 0.32);
  --psc-text:          #eef5fb;
  --psc-text-muted:    #a9b8c7;
  --psc-text-dim:      #8397aa;
  /* Aktionsfarbe. Exakt das Cyan aus dem Logo (#04b7d5), gemessen aus
     assets/images/logo.png. Kontrast auf --psc-bg: 7,97:1 (AAA). */
  --psc-accent:        #04b7d5;
  --psc-accent-soft:   rgba(4, 183, 213, 0.12);
  --psc-accent-glow:   rgba(4, 183, 213, 0.32);

  /* Markenfarbe aus dem Logo. Traegt Bauteile und Waende in den Zeichnungen. */
  --psc-navy:          #2f375e;
  --psc-navy-light:    #4a5488;

  /* Thermalpole. Farbe kodiert auf dieser Seite Physik, nicht Hierarchie:
     warm heisst immer "vorher / Waermeverlust", kalt heisst "nachher / Zielzustand".
     Deshalb ist Orange KEINE Interaktionsfarbe - dafuer ist --psc-accent da.
     Die beiden Pole sind bewusst auch in der HELLIGKEIT getrennt (Kontrast 2,83:1
     zueinander, unter simulierter Deuteranopie noch 2,42:1). Ein Paar, das sich nur
     im Farbton unterscheidet, verschwimmt im Graustufendruck und bei Rotgruenschwaeche.
     Zusaetzlich gilt: keine Aussage wird allein ueber Farbe kodiert. */
  --psc-warm:          #d1571d;
  --psc-warm-soft:     rgba(209, 87, 29, 0.14);
  --psc-cold:          #8ae3f7;
  --psc-cold-soft:     rgba(138, 227, 247, 0.14);
  --psc-neutral:       #8ea6b8;

  /* Belegstatus. Nie allein als Farbe eingesetzt, immer mit Textlabel. */
  --psc-proven:        #73e5c2;
  --psc-proven-soft:   rgba(115, 229, 194, 0.12);
  --psc-claimed:       #f1b768;
  --psc-claimed-soft:  rgba(241, 183, 104, 0.12);

  /* Rasterlinien und Flaechen fuer die technischen Zeichnungen. */
  --psc-line:          rgba(173, 205, 229, 0.22);
  --psc-paper:         #0f2031;

  /* Aliasse aus der nestnode-Basis, damit bestehende Regeln weiter greifen. */
  --psc-local:         #73e5c2;
  --psc-local-soft:    rgba(115, 229, 194, 0.12);
  --psc-home:          #f1b768;
  --psc-home-soft:     rgba(241, 183, 104, 0.12);
  --psc-white:         #ffffff;
  --psc-max:           clamp(1180px, 86vw, 1984px);
  --psc-nav-h:         72px;
  --psc-radius:        18px;
  --psc-radius-lg:     28px;
  --psc-shadow:        0 30px 80px -42px rgba(0, 0, 0, 0.86);
  --psc-step-0:        clamp(1rem, 0.94rem + 0.18vw, 1.18rem);
  --psc-step-1:        clamp(1.25rem, 1.08rem + 0.48vw, 1.72rem);
  --psc-step-2:        clamp(1.7rem, 1.38rem + 0.9vw, 2.55rem);
  --psc-step-3:        clamp(2.25rem, 1.7rem + 1.65vw, 4rem);
  --psc-step-4:        clamp(3rem, 2.05rem + 2.8vw, 6.2rem);
  --psc-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}

/* ============================================================
   RESET / BASE
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--psc-nav-h) + 16px);
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  background: var(--psc-bg);
  color: var(--psc-text);
  font-family: var(--psc-font);
  font-size: 17px;
  line-height: 1.65;
  font-weight: 400;
  letter-spacing: -0.01em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

img { max-width: 100%; height: auto; display: block; }

a { color: var(--psc-accent); text-decoration: none; transition: color .2s ease, opacity .2s ease; }
a:hover { color: var(--psc-white); }

.psc-skip-link {
  position: fixed;
  top: 10px;
  left: 12px;
  z-index: 2000;
  padding: 10px 15px;
  border: 2px solid var(--psc-accent);
  border-radius: 8px;
  background: var(--psc-bg);
  color: var(--psc-white);
  font-weight: 700;
  transform: translateY(calc(-100% - 18px));
  transition: transform .18s ease;
}

.psc-skip-link:focus {
  color: var(--psc-white);
  transform: translateY(0);
}

h1, h2, h3, h4 {
  margin: 0 0 .5em;
  line-height: 1.1;
  font-weight: 700;
  letter-spacing: -0.03em;
  color: var(--psc-white);
}

p { margin: 0 0 1rem; }

.psc-container {
  width: 100%;
  max-width: var(--psc-max);
  margin: 0 auto;
  padding-left: 24px;
  padding-right: 24px;
}

.psc-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--psc-accent);
}
.psc-eyebrow::before {
  content: "";
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--psc-accent);
  box-shadow: 0 0 10px 2px var(--psc-accent-glow);
}

/* ============================================================
   BUTTONS
   ============================================================ */
.psc-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 11px 22px;
  border-radius: 9px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: -0.01em;
  cursor: pointer;
  border: 1px solid transparent;
  transition: transform .18s ease, box-shadow .25s ease, background .2s ease, border-color .2s ease, color .2s ease;
  white-space: nowrap;
}
.psc-btn:active { transform: translateY(1px); }

.psc-btn--primary {
  background: var(--psc-accent);
  color: #04141a;
  box-shadow: 0 6px 24px -6px var(--psc-accent-glow);
}
.psc-btn--primary:hover {
  color: #04141a;
  transform: translateY(-2px);
  box-shadow: 0 10px 34px -6px var(--psc-accent-glow), 0 0 0 1px var(--psc-accent);
}

.psc-btn--ghost {
  background: transparent;
  color: var(--psc-text);
  border-color: var(--psc-border);
}
.psc-btn--ghost:hover {
  color: var(--psc-white);
  border-color: var(--psc-accent);
  background: var(--psc-accent-soft);
}

/* ============================================================
   NAVIGATION
   ============================================================ */
.psc-nav {
  position: fixed;
  inset: 0 0 auto 0;
  height: var(--psc-nav-h);
  z-index: 1000;
  display: flex;
  align-items: center;
  background: rgba(10, 10, 10, 0.55);
  backdrop-filter: saturate(160%) blur(14px);
  -webkit-backdrop-filter: saturate(160%) blur(14px);
  border-bottom: 1px solid transparent;
  transition: background .25s ease, border-color .25s ease;
}
.psc-nav.is-scrolled {
  background: rgba(10, 10, 10, 0.85);
  border-bottom-color: var(--psc-border);
}
.psc-nav__inner {
  width: 100%;
  max-width: var(--psc-max);
  margin: 0 auto;
  padding: 0 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.psc-logo {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 21px;
  font-weight: 800;
  letter-spacing: -0.04em;
  color: var(--psc-white);
}
.psc-logo:hover { color: var(--psc-white); }
.psc-logo__mark {
  width: 26px; height: 26px;
  border-radius: 7px;
  background: linear-gradient(150deg, var(--psc-white), var(--psc-accent) 62%);
  box-shadow: 0 0 16px -2px var(--psc-accent-glow);
  position: relative;
  flex: none;
}
.psc-logo__mark::after {
  content: "";
  position: absolute;
  inset: 7px;
  border-radius: 3px;
  background: var(--psc-bg);
}
.psc-logo b { color: var(--psc-accent); font-weight: 800; }

.psc-nav__links {
  display: flex;
  align-items: center;
  gap: 18px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.psc-nav__links a {
  color: var(--psc-text-muted);
  font-size: 14px;
  font-weight: 500;
  position: relative;
  white-space: nowrap;
}
.psc-nav__links a:hover { color: var(--psc-white); }
.psc-nav__links a::after {
  content: "";
  position: absolute;
  left: 0; bottom: -6px;
  width: 0; height: 2px;
  background: var(--psc-accent);
  border-radius: 2px;
  transition: width .25s ease;
}
.psc-nav__links a:hover::after { width: 100%; }

.psc-nav__cta { display: flex; align-items: center; gap: 16px; }
.psc-nav__cta .psc-btn { padding: 8px 16px; font-size: 13px; }

.psc-lang {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 3px;
  border: 1px solid var(--psc-border);
  border-radius: 9px;
  background: var(--psc-bg-elev);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.04em;
}
.psc-lang__opt {
  display: inline-flex;
  align-items: center;
  color: var(--psc-text-muted);
  text-decoration: none;
  padding: 5px 9px;
  border-radius: 6px;
  transition: color 0.15s ease, background-color 0.15s ease;
}
.psc-lang__opt:hover {
  color: var(--psc-white);
}
.psc-lang__opt.is-active {
  color: var(--psc-bg);
  background: var(--psc-accent);
}

.psc-burger {
  display: none;
  width: 44px; height: 44px;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: 1px solid var(--psc-border);
  border-radius: 10px;
  cursor: pointer;
  padding: 0;
}
.psc-burger span {
  display: block;
  position: relative;
  width: 20px; height: 2px;
  background: var(--psc-text);
  transition: background .2s ease;
}
.psc-burger span::before, .psc-burger span::after {
  content: "";
  position: absolute; left: 0;
  width: 20px; height: 2px;
  background: var(--psc-text);
  transition: transform .25s ease, top .25s ease;
}
.psc-burger span::before { top: -6px; }
.psc-burger span::after { top: 6px; }
.psc-nav.is-open .psc-burger span { background: transparent; }
.psc-nav.is-open .psc-burger span::before { top: 0; transform: rotate(45deg); }
.psc-nav.is-open .psc-burger span::after  { top: 0; transform: rotate(-45deg); }

/* ============================================================
   HERO
   ============================================================ */
.psc-hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  padding: calc(var(--psc-nav-h) + 60px) 0 90px;
  overflow: hidden;
  isolation: isolate;
}
/* layered background: grid + radial glow + gradient */
.psc-hero__bg {
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    radial-gradient(900px 600px at 70% 12%, rgba(0,212,255,0.16), transparent 60%),
    radial-gradient(700px 500px at 10% 90%, rgba(0,212,255,0.08), transparent 60%),
    var(--psc-bg);
}
.psc-hero__grid {
  position: absolute;
  inset: 0;
  z-index: -1;
  background-image:
    linear-gradient(to right, rgba(255,255,255,0.04) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,0.04) 1px, transparent 1px);
  background-size: 64px 64px;
  -webkit-mask-image: radial-gradient(ellipse 80% 70% at 50% 35%, #000 30%, transparent 80%);
          mask-image: radial-gradient(ellipse 80% 70% at 50% 35%, #000 30%, transparent 80%);
}

/* split layout: text column + product visual (mobile-first → stacked) */
.psc-hero__layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 56px;
  align-items: center;
  width: 100%;
}
.psc-hero__col { max-width: 640px; }

.psc-hero h1 {
  font-size: clamp(26px, 2.25vw, 32px);
  font-weight: 800;
  letter-spacing: -0.045em;
  margin: 22px 0 0;
}
.psc-hero h1 .psc-grad {
  background: linear-gradient(110deg, var(--psc-white) 0%, var(--psc-accent) 100%);
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}
.psc-hero__sub {
  margin: 26px 0 0;
  max-width: 620px;
  font-size: clamp(1.05rem, 2.2vw, 1.3rem);
  line-height: 1.6;
  color: var(--psc-text-muted);
  font-weight: 400;
}
.psc-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 40px;
}
.psc-hero__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 30px;
  margin-top: 44px;
  padding-top: 30px;
  border-top: 1px solid var(--psc-border);
  color: var(--psc-text-dim);
  font-size: 14px;
}
.psc-hero__meta span {
  display: inline-flex;
  align-items: center;
  gap: 9px;
}
.psc-hero__meta span::before {
  content: "";
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--psc-accent);
  box-shadow: 0 0 8px 1px var(--psc-accent-glow);
}

/* scroll hint */
.psc-hero__scroll {
  position: absolute;
  left: 50%; bottom: 26px;
  transform: translateX(-50%);
  color: var(--psc-text-dim);
  font-size: 12px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  animation: psc-float 2.4s ease-in-out infinite;
}
.psc-hero__scroll::after {
  content: "";
  width: 1px; height: 26px;
  background: linear-gradient(var(--psc-accent), transparent);
}
@keyframes psc-float {
  0%,100% { transform: translate(-50%, 0); opacity: .7; }
  50%     { transform: translate(-50%, 6px); opacity: 1; }
}

/* ============================================================
   HERO PRODUCT VISUAL — CSS-rendered PowerSmartCoat device
   ============================================================ */
.psc-hero__visual {
  display: flex;
  align-items: center;
  justify-content: center;
  perspective: 1100px;
}
.psc-device {
  position: relative;
  width: min(330px, 82vw);
  transform-style: preserve-3d;
  transform: rotateX(7deg) rotateY(-20deg);
  animation: psc-device-float 7s ease-in-out infinite;
}
@keyframes psc-device-float {
  0%,100% { transform: rotateX(7deg) rotateY(-20deg) translateY(0); }
  50%     { transform: rotateX(7deg) rotateY(-20deg) translateY(-14px); }
}
.psc-device__glow {
  position: absolute;
  inset: -16% -16% -24%;
  z-index: -1;
  background: radial-gradient(58% 58% at 50% 42%, var(--psc-accent-soft), transparent 72%);
  filter: blur(26px);
}
.psc-device__body {
  position: relative;
  aspect-ratio: 4 / 5;
  border-radius: 22px;
  padding: 28px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: linear-gradient(158deg, #1b1d22 0%, #0d0e11 58%, #0a0b0d 100%);
  border: 1px solid var(--psc-border);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.07),
    inset 0 0 46px rgba(0,0,0,0.55),
    -26px 34px 64px -22px rgba(0,0,0,0.85),
    0 36px 90px -32px var(--psc-accent-glow);
}
/* accent light bar down the left edge of the box */
.psc-device__bar {
  position: absolute;
  top: 26px; left: 0;
  width: 4px; height: 68px;
  border-radius: 0 4px 4px 0;
  background: var(--psc-accent);
  box-shadow: 0 0 18px 2px var(--psc-accent-glow);
}
.psc-device__brand {
  margin-top: auto;
  font-size: 28px;
  font-weight: 800;
  letter-spacing: -0.045em;
  color: var(--psc-white);
  line-height: 1;
}
.psc-device__brand b { color: var(--psc-accent); font-weight: 800; }
.psc-device__sub {
  margin-top: 6px;
  font-size: 11px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--psc-text-dim);
}
.psc-device__status {
  margin-top: 20px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.18em;
  color: var(--psc-text-muted);
}
.psc-device__led {
  width: 9px; height: 9px;
  border-radius: 50%;
  background: var(--psc-accent);
  box-shadow: 0 0 10px 2px var(--psc-accent-glow);
  animation: psc-device-pulse 1.8s ease-in-out infinite;
}
@keyframes psc-device-pulse {
  0%,100% { opacity: 1; }
  50%     { opacity: .35; }
}
.psc-device__vents {
  display: flex;
  flex-direction: column;
  gap: 7px;
  margin-top: 22px;
}
.psc-device__vents i {
  height: 2px;
  border-radius: 2px;
  background: linear-gradient(90deg, var(--psc-border), transparent);
}
.psc-device__vents i:nth-child(1) { width: 82%; }
.psc-device__vents i:nth-child(2) { width: 64%; }
.psc-device__vents i:nth-child(3) { width: 72%; }
.psc-device__vents i:nth-child(4) { width: 48%; }
.psc-device__floor {
  position: absolute;
  left: 50%; bottom: -30px;
  transform: translateX(-50%);
  width: 72%; height: 26px;
  border-radius: 50%;
  background: radial-gradient(closest-side, rgba(0,0,0,0.6), transparent);
  filter: blur(5px);
  z-index: -1;
}

/* ============================================================
   GENERIC SECTIONS / PLACEHOLDERS
   ============================================================ */
.psc-section {
  position: relative;
  padding: 96px 0;
  border-top: 1px solid var(--psc-border);
}
.psc-section--compact { padding: 42px 0; }
.psc-section__head { max-width: 680px; margin-bottom: 14px; }
.psc-section h2 {
  font-size: clamp(23px, 2.05vw, 31px);
  margin-top: 14px;
}
.psc-section__lead { color: var(--psc-text-muted); font-size: 1.1rem; max-width: 620px; }

.psc-soon {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 22px;
  padding: 8px 16px;
  border: 1px solid var(--psc-border);
  border-radius: 999px;
  background: var(--psc-bg-card);
  color: var(--psc-text-muted);
  font-size: 14px;
  font-weight: 500;
}
.psc-soon::before {
  content: "";
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--psc-accent);
  box-shadow: 0 0 10px 2px var(--psc-accent-glow);
}

/* ============================================================
   FOOTER
   ============================================================ */
.psc-footer {
  border-top: 1px solid var(--psc-border);
  padding: 64px 0 36px;
  background: var(--psc-bg-elev);
}
.psc-footer__inner {
  display: grid;
  grid-template-columns: minmax(220px, 1.05fr) minmax(0, 2.4fr);
  gap: 44px;
  align-items: start;
}
.psc-footer__brand {
  display: grid;
  gap: 18px;
  align-content: start;
}
.psc-footer__brand p {
  max-width: 320px;
  margin: 0;
  color: var(--psc-text-muted);
  font-size: 15px;
  line-height: 1.6;
}
.psc-footer__nav {
  display: grid;
  grid-template-columns: repeat(4, minmax(130px, 1fr));
  gap: 28px;
}
.psc-footer__group h2 {
  margin: 0 0 14px;
  color: var(--psc-white);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
}
.psc-footer__group ul {
  display: grid;
  gap: 10px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.psc-footer__group a,
.psc-footer__bottom a {
  color: var(--psc-text-muted);
  font-size: 14px;
}
.psc-footer__group a:hover,
.psc-footer__bottom a:hover { color: var(--psc-white); }
.psc-footer__bottom {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  align-items: center;
  justify-content: space-between;
  padding-top: 26px;
  border-top: 1px solid var(--psc-border);
}
.psc-footer__copy { margin: 0; color: var(--psc-text-dim); font-size: 14px; }

/* ============================================================
   SOCIAL LINKS (footer) & POST SHARING
   ============================================================ */
.psc-socials { display: flex; align-items: center; gap: 12px; list-style: none; margin: 0; padding: 0; }
.psc-socials a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  color: var(--psc-text-muted);
  border: 1px solid var(--psc-border);
  border-radius: 50%;
  transition: color .2s ease, border-color .2s ease, background .2s ease;
}
.psc-socials a:hover {
  color: var(--psc-accent);
  border-color: var(--psc-accent);
  background: var(--psc-accent-soft);
}
.psc-socials svg { width: 17px; height: 17px; fill: currentColor; display: block; }

/* header variant: smaller, sits next to the CTA button */
.psc-footer__socials { margin-top: 2px; }

/* post share buttons (single.php) */
.psc-share {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-top: 40px;
  padding-top: 24px;
  border-top: 1px solid var(--psc-border);
}
.psc-share__label { color: var(--psc-text-dim); font-size: 14px; }
.psc-share__btn {
  display: inline-block;
  padding: 8px 18px;
  border: 1px solid var(--psc-accent);
  border-radius: 8px;
  color: var(--psc-accent);
  font-size: 14px;
  font-weight: 600;
}
.psc-share__btn:hover { background: var(--psc-accent); color: #000; }

/* ============================================================
   RESPONSIVE / MOBILE-FIRST
   ============================================================ */
/* desktop: headline column + product visual side by side */
@media (min-width: 980px) {
  .psc-hero__layout {
    grid-template-columns: 1.05fr 0.95fr;
    gap: 48px;
  }
}

@media (max-width: 979px) {
  .psc-nav__links {
    position: fixed;
    inset: var(--psc-nav-h) 0 auto 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    padding: 18px 24px 26px;
    background: rgba(10,10,10,0.97);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border-bottom: 1px solid var(--psc-border);
    transform: translateY(-12px);
    opacity: 0;
    pointer-events: none;
    transition: opacity .22s ease, transform .22s ease;
  }
  .psc-nav.is-open .psc-nav__links {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
  }
  .psc-nav__links a { width: 100%; padding: 12px 0; font-size: 17px; }
  .psc-nav__links a::after { display: none; }
  .psc-nav__cta .psc-btn { padding: 9px 14px; font-size: 14px; }
  .psc-nav__cta { gap: 10px; }
  .psc-lang { padding: 5px 6px; font-size: 12px; }
  .psc-burger { display: inline-flex; }
  .psc-footer__inner { grid-template-columns: 1fr; gap: 34px; }
  .psc-footer__nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
  body { font-size: 16px; }
  .psc-logo { font-size: 19px; }
  .psc-logo__mark { width: 24px; height: 24px; }
  .psc-nav__inner { padding: 0 14px; }
  .psc-nav__cta .psc-btn { padding: 8px 10px; font-size: 13px; }
  .psc-hero { min-height: auto; padding: calc(var(--psc-nav-h) + 48px) 0 64px; }
  .psc-hero__actions { gap: 12px; }
  .psc-hero__actions .psc-btn { width: 100%; }
  .psc-section { padding: 64px 0; }
  .psc-hero__scroll { display: none; }
  .psc-footer { padding: 48px 0 30px; }
  .psc-footer__nav { grid-template-columns: 1fr; gap: 24px; }
  .psc-footer__bottom { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 430px) {
  .psc-nav__inner { padding: 0 10px; gap: 8px; }
  .psc-logo > span:last-child { display: none; }
  .psc-nav__cta { gap: 7px; }
  .psc-nav__cta .psc-btn { padding: 8px 9px; font-size: 12px; }
  .psc-lang { gap: 4px; padding: 5px; }
  .psc-burger { width: 40px; height: 40px; border-radius: 9px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .psc-hero__scroll,
  .psc-device,
  .psc-device__led { animation: none !important; }
  * { transition-duration: .001ms !important; }
}

/* ============================================================
   BLOG — archive list & single-post meta
   ============================================================ */
.psc-article__meta {
  color: var(--psc-text-muted);
  font-size: 14px;
  letter-spacing: 0.02em;
  margin-top: 10px;
}

.psc-bloglist {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 20px;
  max-width: none;
  margin-top: 8px;
}

.psc-postcard {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  padding: 22px;
  border: 1px solid var(--psc-border);
  border-radius: 14px;
  background: var(--psc-bg-card);
  transition: border-color .2s ease, transform .2s ease, box-shadow .25s ease;
}
.psc-postcard:hover {
  border-color: var(--psc-accent);
  transform: translateY(-2px);
  box-shadow: 0 12px 34px -16px var(--psc-accent-glow);
}
.psc-postcard__title {
  font-size: 21px;
  line-height: 1.28;
  margin: 0 0 8px;
}
.psc-blog .psc-bloglist .psc-postcard .psc-postcard__title {
  font-size: 21px !important;
  line-height: 1.28 !important;
}
.psc-postcard__title a { color: var(--psc-white); }
.psc-postcard__title a:hover { color: var(--psc-accent); }
.psc-postcard__meta {
  color: var(--psc-text-muted);
  font-size: 12px;
  letter-spacing: 0.02em;
  margin: 0 0 10px;
}
.psc-postcard__excerpt {
  color: var(--psc-text-muted);
  font-size: .94rem;
  line-height: 1.55;
  margin-bottom: 16px;
}
.psc-postcard__excerpt p { margin: 0; }
.psc-postcard .psc-link {
  align-self: flex-start;
  margin-top: auto;
  padding-top: 14px;
}

.psc-bloglist + .pagination,
.nav-links {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 32px;
}
.nav-links .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  padding: 8px 14px;
  border: 1px solid var(--psc-border);
  border-radius: 10px;
  color: var(--psc-text);
}
.nav-links .page-numbers.current,
.nav-links .page-numbers:hover {
  border-color: var(--psc-accent);
  color: var(--psc-accent);
}

/* ============================================================
   PAGE CONTENT — prose, cards, pricing, team, stats, CTA, forms
   ============================================================ */
.psc-container--narrow { max-width: 780px; }
.psc-page .psc-section__head,
.psc-single .psc-section__head { margin-bottom: 28px; }
.psc-page h1, .psc-single h1, .psc-blog h1 {
  font-size: clamp(25px, 2.15vw, 31px);
  margin-top: 12px;
}

.psc-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 600;
  font-size: .92rem;
  color: var(--psc-accent);
}
.psc-link:hover { color: var(--psc-white); }
.psc-single__back { margin-top: 48px; padding-top: 24px; border-top: 1px solid var(--psc-border); }

/* Prose typography for editor / page content */
.psc-prose {
  font-size: 1rem;
  color: var(--psc-text);
  max-width: 920px;
  margin-left: auto;
  margin-right: auto;
}
.psc-prose--wide {
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}
.psc-page .psc-prose, .psc-single .psc-prose { margin-top: 4px; }
.psc-prose > :first-child { margin-top: 0; }
.psc-prose h2 {
  font-size: clamp(22px, 1.9vw, 29px);
  margin: 2.2em 0 .6em;
  scroll-margin-top: calc(var(--psc-nav-h) + 20px);
}
.psc-prose h3 {
  font-size: clamp(19px, 1.6vw, 23px);
  margin: 1.8em 0 .5em;
  color: var(--psc-white);
}
.psc-prose p { margin: 0 0 1.15rem; color: var(--psc-text); }
.psc-prose strong { color: var(--psc-white); font-weight: 700; }
.psc-prose a { text-decoration: underline; text-underline-offset: 3px; }
.psc-prose ul, .psc-prose ol { margin: 0 0 1.3rem; padding-left: 1.3rem; color: var(--psc-text); }
.psc-prose li { margin: 0 0 .55rem; }
.psc-prose ul li::marker { color: var(--psc-accent); }
.psc-prose blockquote {
  margin: 1.6rem 0;
  padding: 4px 0 4px 22px;
  border-left: 3px solid var(--psc-accent);
  color: var(--psc-text-muted);
  font-style: italic;
}
.psc-prose hr { border: none; border-top: 1px solid var(--psc-border); margin: 2.4rem 0; }
.psc-prose code {
  background: var(--psc-bg-card);
  border: 1px solid var(--psc-border);
  border-radius: 6px;
  padding: 2px 7px;
  font-size: .92em;
}
.psc-prose img { border-radius: var(--psc-radius); margin: 1.6rem 0; }
.psc-prose table {
  width: 100%;
  max-width: 100%;
  border-collapse: collapse;
  margin: 1.6rem 0;
  font-size: .98rem;
}
.psc-prose th, .psc-prose td {
  text-align: left;
  padding: 13px 16px;
  border: 1px solid var(--psc-border);
  overflow-wrap: anywhere;
  word-break: normal;
}
.psc-prose thead th { background: var(--psc-bg-card); color: var(--psc-white); }
.psc-prose tbody tr:nth-child(even) { background: rgba(255,255,255,0.02); }

@media (max-width: 640px) {
  .psc-prose table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .psc-prose thead,
  .psc-prose tbody,
  .psc-prose tr,
  .psc-prose th,
  .psc-prose td {
    display: block;
    width: 100%;
  }

  .psc-prose tr {
    border: 1px solid var(--psc-border);
    margin-bottom: 12px;
  }

  .psc-prose th,
  .psc-prose td {
    min-width: 0;
    padding: 11px 12px;
  }

  .psc-prose th + th,
  .psc-prose td + td {
    border-top: 0;
  }
}

/* Card grid (features, hermes, generic) */
.psc-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 22px;
  margin: 1.8rem 0 2.2rem;
}
@media (min-width: 720px) { .psc-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .psc-grid--3 { grid-template-columns: repeat(3, 1fr); } }
.psc-card {
  padding: 26px;
  border: 1px solid var(--psc-border);
  border-radius: var(--psc-radius);
  background: var(--psc-bg-card);
  transition: border-color .2s ease, transform .2s ease, box-shadow .25s ease;
}
.psc-card:hover {
  border-color: var(--psc-accent);
  transform: translateY(-2px);
  box-shadow: 0 14px 38px -18px var(--psc-accent-glow);
}
.psc-card h3 { margin-top: 0; }
.psc-card p:last-child { margin-bottom: 0; }
.psc-card--quiet { background: linear-gradient(180deg, rgba(20,21,24,0.96), rgba(13,14,17,0.96)); }
.psc-card__icon {
  display: inline-flex;
  width: 46px; height: 46px;
  align-items: center; justify-content: center;
  border-radius: 12px;
  background: var(--psc-accent-soft);
  color: var(--psc-accent);
  font-size: 22px;
  margin-bottom: 16px;
}

.psc-home-beta {
  display: grid;
  gap: 20px;
  align-items: center;
}
.psc-home-beta h2 {
  font-size: clamp(1.45rem, 2.8vw, 2rem);
  margin-top: 10px;
}
.psc-home-beta p {
  color: var(--psc-text-muted);
  margin-bottom: 0;
}
@media (min-width: 800px) {
  .psc-home-beta { grid-template-columns: minmax(0, 1fr) auto; }
}
@media (max-width: 560px) {
  .psc-home-beta .psc-btn {
    width: 100%;
    white-space: normal;
  }
}

/* Room-by-room use cases */
.psc-usecases {
  margin: 2.4rem 0 3rem;
}
.psc-usecases__intro {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
  align-items: start;
  padding: 26px;
  border: 1px solid var(--psc-border);
  border-radius: var(--psc-radius);
  background: linear-gradient(180deg, rgba(20,21,24,0.96), rgba(13,14,17,0.96));
}
.psc-usecases__intro h2 { margin-top: 10px; }
.psc-usecases__intro p:last-child { color: var(--psc-text-muted); margin-bottom: 0; }
.psc-usecases__signal,
.psc-usecases__note {
  padding: 16px;
  border: 1px solid rgba(0,212,255,0.28);
  border-radius: 12px;
  background: var(--psc-accent-soft);
}
.psc-usecases__signal strong {
  display: block;
  color: var(--psc-accent);
}
.psc-usecases__signal span,
.psc-usecases__note p {
  display: block;
  color: var(--psc-text-muted);
  margin: 6px 0 0;
}
.psc-usecases__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
  margin-top: 22px;
}
.psc-usecase-card {
  display: grid;
  gap: 12px;
  padding: 22px;
  border: 1px solid var(--psc-border);
  border-radius: var(--psc-radius);
  background: var(--psc-bg-card);
}
.psc-usecase-card:hover {
  border-color: var(--psc-accent);
}
.psc-usecase-card__room {
  margin: 0 !important;
  color: var(--psc-accent) !important;
  font-size: .82rem;
  font-weight: 800;
  text-transform: uppercase;
}
.psc-usecase-card h3 {
  margin: 0;
}
.psc-usecase-card p {
  margin: 0;
}
.psc-usecase-card dl {
  display: grid;
  gap: 8px;
  margin: 4px 0 0;
}
.psc-usecase-card dt {
  color: var(--psc-white);
  font-weight: 800;
}
.psc-usecase-card dd {
  margin: 0;
  color: var(--psc-text-muted);
}
.psc-usecases__note {
  margin: 1.8rem 0 2.2rem;
}
.psc-usecases__cta {
  margin: 2.4rem 0;
  padding: 26px;
  border: 1px solid var(--psc-border);
  border-radius: var(--psc-radius);
  background: linear-gradient(135deg, rgba(0,212,255,0.10), rgba(255,255,255,0.03));
}
.psc-usecases__cta h2 {
  margin-top: 0;
}
.psc-usecases__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
@media (min-width: 760px) {
  .psc-usecases__intro { grid-template-columns: minmax(0, 1fr) minmax(220px, 300px); }
  .psc-usecases__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1080px) {
  .psc-usecases__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .psc-usecases__intro,
  .psc-usecases__cta {
    padding: 18px;
  }
  .psc-usecase-card {
    padding: 18px;
  }
  .psc-usecases__actions .psc-btn {
    width: 100%;
    white-space: normal;
  }
}

/* TCO calculator */
.psc-page-lead {
  max-width: 820px;
  color: var(--psc-text-muted) !important;
  font-size: 1.12rem;
}
.psc-tco {
  margin: 2.4rem 0 3rem;
  padding: 28px;
  border: 1px solid var(--psc-border);
  border-radius: var(--psc-radius);
  background: linear-gradient(180deg, rgba(20,21,24,0.96), rgba(13,14,17,0.96));
}
.psc-tco__intro {
  display: grid;
  grid-template-columns: 1fr;
  gap: 22px;
  align-items: start;
  margin-bottom: 26px;
}
.psc-tco__intro h2 { margin-top: 10px; }
.psc-tco__intro p:last-child { color: var(--psc-text-muted); margin-bottom: 0; }
.psc-tco__note {
  display: grid;
  gap: 6px;
  padding: 16px;
  border: 1px solid rgba(0,212,255,0.28);
  border-radius: 12px;
  background: var(--psc-accent-soft);
  color: var(--psc-text-muted);
  font-size: .92rem;
}
.psc-tco__note strong { color: var(--psc-accent); }
.psc-tco__layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 22px;
  align-items: start;
}
.psc-tco__form,
.psc-tco__results {
  min-width: 0;
  padding: 22px;
  border: 1px solid var(--psc-border);
  border-radius: 12px;
  background: rgba(10,10,10,0.58);
}
.psc-tco__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  margin-top: 14px;
}
.psc-tco__group {
  display: grid;
  gap: 8px;
  min-width: 0;
}
.psc-tco__group label,
.psc-tco__toggle {
  color: var(--psc-text-muted);
  font-size: .88rem;
  font-weight: 700;
}
.psc-tco__group input,
.psc-tco__group select {
  width: 100%;
  min-width: 0;
  min-height: 48px;
  border: 1px solid var(--psc-border);
  border-radius: 10px;
  background: var(--psc-bg);
  color: var(--psc-white);
  font: inherit;
  font-size: 1rem;
}
.psc-tco__group select {
  padding: 0 42px 0 14px;
}
.psc-tco__input {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  min-width: 0;
  border: 1px solid var(--psc-border);
  border-radius: 10px;
  background: var(--psc-bg);
  overflow: hidden;
}
.psc-tco__input input {
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 0 12px 0 14px;
}
.psc-tco__input span {
  padding: 0 12px;
  color: var(--psc-text-dim);
  font-size: .9rem;
  white-space: nowrap;
}
.psc-tco__group input:focus,
.psc-tco__group select:focus {
  outline: none;
  border-color: var(--psc-accent);
  box-shadow: 0 0 0 3px var(--psc-accent-soft);
}
.psc-tco__input:focus-within {
  border-color: var(--psc-accent);
  box-shadow: 0 0 0 3px var(--psc-accent-soft);
}
.psc-tco__input:focus-within input { box-shadow: none; }
.psc-tco__time {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid var(--psc-border);
}
.psc-tco__toggle {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
}
.psc-tco__toggle input {
  width: 18px;
  height: 18px;
  accent-color: var(--psc-accent);
}
.psc-tco__kicker {
  margin: 0 0 10px !important;
  color: var(--psc-accent) !important;
  font-size: .82rem;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}
.psc-tco__total {
  padding-bottom: 18px;
  border-bottom: 1px solid var(--psc-border);
}
.psc-tco__total span,
.psc-tco__rows span,
.psc-tco__compare span {
  display: block;
  color: var(--psc-text-muted);
  font-size: .9rem;
}
.psc-tco__total strong {
  display: block;
  color: var(--psc-white);
  font-size: clamp(2rem, 6vw, 3.1rem);
  line-height: 1;
  margin-top: 6px;
}
.psc-tco__rows,
.psc-tco__compare {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin-top: 18px;
}
.psc-tco__rows div,
.psc-tco__compare div {
  min-width: 0;
  padding: 14px;
  border: 1px solid var(--psc-border);
  border-radius: 10px;
  background: var(--psc-bg-card);
}
.psc-tco__rows strong,
.psc-tco__compare strong {
  display: block;
  margin-top: 4px;
  color: var(--psc-white);
  font-size: 1.08rem;
  line-height: 1.25;
}
.psc-tco__compare {
  padding-top: 18px;
  border-top: 1px solid var(--psc-border);
}
.psc-tco__verdict {
  margin: 18px 0 18px !important;
  color: var(--psc-text) !important;
}
.psc-tco__formula,
.psc-tco-next {
  margin-top: 24px;
  padding: 22px;
  border: 1px solid var(--psc-border);
  border-radius: 12px;
  background: var(--psc-bg-card);
}
.psc-tco__formula h3,
.psc-tco-next h2 { margin-top: 0; }
.psc-tco__formula p:last-child,
.psc-tco-next p:last-child { margin-bottom: 0; }
.psc-tco-next .psc-btn {
  margin: 8px 10px 0 0;
  text-decoration: none;
}

@media (min-width: 720px) {
  .psc-tco__intro { grid-template-columns: minmax(0, 1fr) minmax(260px, 360px); }
  .psc-tco__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .psc-tco__time { grid-template-columns: minmax(0, 1fr) minmax(180px, 240px); align-items: end; }
  .psc-tco__rows { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 1060px) {
  .psc-tco__layout { grid-template-columns: minmax(0, 1.15fr) minmax(340px, .85fr); }
  .psc-tco__results { position: sticky; top: calc(var(--psc-nav-h) + 18px); }
}

@media (max-width: 560px) {
  .psc-tco {
    padding: 18px;
    margin-left: -6px;
    margin-right: -6px;
  }
  .psc-tco__form,
  .psc-tco__results,
  .psc-tco__formula,
  .psc-tco-next { padding: 18px; }
  .psc-tco .psc-btn,
  .psc-tco-next .psc-btn {
    width: 100%;
    white-space: normal;
  }
  .psc-tco-next .psc-btn { margin-right: 0; }
}

/* Buyer advisor */
.psc-advisor {
  margin: 2.4rem 0 3rem;
  padding: 28px;
  border: 1px solid var(--psc-border);
  border-radius: var(--psc-radius);
  background: linear-gradient(180deg, rgba(20,21,24,0.96), rgba(13,14,17,0.96));
}
.psc-advisor__intro {
  display: grid;
  grid-template-columns: 1fr;
  gap: 22px;
  align-items: start;
  margin-bottom: 26px;
}
.psc-advisor__intro h2 { margin-top: 10px; }
.psc-advisor__intro p:last-child { color: var(--psc-text-muted); margin-bottom: 0; }
.psc-advisor__privacy {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 16px;
  border: 1px solid rgba(0,212,255,0.28);
  border-radius: 12px;
  background: var(--psc-accent-soft);
  color: var(--psc-text-muted);
  font-size: .92rem;
}
.psc-advisor__privacy strong { color: var(--psc-accent); }
.psc-advisor__layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 22px;
  align-items: start;
}
.psc-advisor__form,
.psc-advisor__result {
  min-width: 0;
  padding: 22px;
  border: 1px solid var(--psc-border);
  border-radius: 12px;
  background: rgba(10,10,10,0.58);
}
.psc-advisor__form {
  display: grid;
  gap: 16px;
}
.psc-advisor__question {
  display: grid;
  gap: 10px;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}
.psc-advisor__question label,
.psc-advisor__question legend {
  padding: 0;
  color: var(--psc-text-muted);
  font-size: .88rem;
  font-weight: 800;
}
.psc-advisor__number {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  min-width: 0;
  border: 1px solid var(--psc-border);
  border-radius: 10px;
  background: var(--psc-bg);
  overflow: hidden;
}
.psc-advisor__number input {
  width: 100%;
  min-width: 0;
  min-height: 48px;
  padding: 0 12px 0 14px;
  border: 0;
  background: transparent;
  color: var(--psc-white);
  font: inherit;
  font-size: 1rem;
}
.psc-advisor__number span {
  padding: 0 12px;
  color: var(--psc-text-dim);
  font-size: .9rem;
  white-space: nowrap;
}
.psc-advisor__number:focus-within {
  border-color: var(--psc-accent);
  box-shadow: 0 0 0 3px var(--psc-accent-soft);
}
.psc-advisor__number input:focus { outline: none; }
.psc-advisor__options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.psc-advisor__options button {
  width: 100%;
  min-width: 0;
  min-height: 46px;
  padding: 9px 10px;
  border: 1px solid var(--psc-border);
  border-radius: 10px;
  background: var(--psc-bg-card);
  color: var(--psc-text-muted);
  font: inherit;
  font-size: .9rem;
  font-weight: 800;
  line-height: 1.2;
  cursor: pointer;
  overflow-wrap: anywhere;
  transition: background .2s ease, border-color .2s ease, color .2s ease;
}
.psc-advisor__options button:hover,
.psc-advisor__options button[aria-pressed="true"] {
  border-color: var(--psc-accent);
  background: var(--psc-accent-soft);
  color: var(--psc-white);
}
.psc-advisor__options button:focus-visible {
  outline: 3px solid var(--psc-accent-soft);
  outline-offset: 2px;
  border-color: var(--psc-accent);
}
.psc-advisor__kicker {
  margin: 0 0 10px !important;
  color: var(--psc-accent) !important;
  font-size: .82rem;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}
.psc-advisor__result h3 {
  margin-top: 0;
  color: var(--psc-white);
  font-size: clamp(1.6rem, 4vw, 2.35rem);
  line-height: 1.08;
}
.psc-advisor__result p {
  color: var(--psc-text-muted);
}
.psc-advisor__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}
.psc-advisor__actions .psc-btn {
  text-decoration: none;
}
.psc-advisor__note {
  margin-top: 16px !important;
  color: var(--psc-text-dim) !important;
  font-size: .9rem;
}
.psc-advisor-links {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin: 1.4rem 0 2rem;
}
.psc-advisor-links a {
  min-width: 0;
  padding: 18px;
  border: 1px solid var(--psc-border);
  border-radius: 12px;
  background: var(--psc-bg-card);
  text-decoration: none;
}
.psc-advisor-links strong {
  display: block;
  color: var(--psc-white);
}
.psc-advisor-links span {
  display: block;
  margin-top: 5px;
  color: var(--psc-text-muted);
  font-size: .94rem;
}
.psc-advisor-links a:hover {
  border-color: rgba(0,212,255,0.35);
}

@media (min-width: 760px) {
  .psc-advisor__intro { grid-template-columns: minmax(0, 1fr) minmax(240px, 340px); }
  .psc-advisor-links { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 1060px) {
  .psc-advisor__layout { grid-template-columns: minmax(0, 1.1fr) minmax(340px, .9fr); }
  .psc-advisor__result { position: sticky; top: calc(var(--psc-nav-h) + 18px); }
  .psc-advisor-links { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
  .psc-advisor {
    padding: 18px;
    margin-left: -6px;
    margin-right: -6px;
  }
  .psc-advisor__form,
  .psc-advisor__result { padding: 18px; }
  .psc-advisor__options { grid-template-columns: 1fr; }
  .psc-advisor__actions .psc-btn {
    width: 100%;
    white-space: normal;
  }
}

/* Energy planner */
.psc-energy {
  margin: 2.4rem 0 3rem;
  padding: 28px;
  border: 1px solid var(--psc-border);
  border-radius: var(--psc-radius);
  background: linear-gradient(180deg, rgba(20,21,24,0.96), rgba(13,14,17,0.96));
}
.psc-energy__intro {
  display: grid;
  grid-template-columns: 1fr;
  gap: 22px;
  align-items: start;
  margin-bottom: 26px;
}
.psc-energy__intro h2 { margin-top: 10px; }
.psc-energy__intro p:last-child { color: var(--psc-text-muted); margin-bottom: 0; }
.psc-energy__privacy {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 16px;
  border: 1px solid rgba(0,212,255,0.28);
  border-radius: 12px;
  background: var(--psc-accent-soft);
  color: var(--psc-text-muted);
  font-size: .92rem;
}
.psc-energy__privacy strong { color: var(--psc-accent); }
.psc-energy__layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 22px;
  align-items: start;
}
.psc-energy__form,
.psc-energy__result {
  min-width: 0;
  padding: 22px;
  border: 1px solid var(--psc-border);
  border-radius: 12px;
  background: rgba(10,10,10,0.58);
}
.psc-energy__form {
  display: grid;
  gap: 18px;
}
.psc-energy__group {
  display: grid;
  gap: 10px;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}
.psc-energy__group legend {
  margin-bottom: 2px;
  padding: 0;
  color: var(--psc-white);
  font-size: .95rem;
  font-weight: 800;
}
.psc-energy__group label {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  min-width: 0;
  padding: 10px 12px;
  border: 1px solid var(--psc-border);
  border-radius: 10px;
  background: var(--psc-bg-card);
  color: var(--psc-text-muted);
  font-size: .92rem;
  line-height: 1.35;
  cursor: pointer;
}
.psc-energy__group input {
  width: 18px;
  height: 18px;
  margin-top: 1px;
  accent-color: var(--psc-accent);
}
.psc-energy__group label:has(input:checked) {
  border-color: rgba(0,212,255,0.56);
  background: var(--psc-accent-soft);
  color: var(--psc-white);
}
.psc-energy__group label:focus-within {
  outline: 3px solid var(--psc-accent-soft);
  outline-offset: 2px;
  border-color: var(--psc-accent);
}
.psc-energy__hint {
  margin: 0 !important;
  color: var(--psc-text-dim) !important;
  font-size: .9rem;
}
.psc-energy__kicker {
  margin: 0 0 10px !important;
  color: var(--psc-accent) !important;
  font-size: .82rem;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}
.psc-energy__result h3 {
  margin-top: 0;
  color: var(--psc-white);
  font-size: clamp(1.5rem, 4vw, 2.25rem);
  line-height: 1.08;
}
.psc-energy__result p { color: var(--psc-text-muted); }
.psc-energy__bullets {
  display: grid;
  gap: 8px;
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
}
.psc-energy__bullets li {
  position: relative;
  padding-left: 18px;
  color: var(--psc-text-muted);
}
.psc-energy__bullets li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .68em;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--psc-accent);
  box-shadow: 0 0 12px rgba(0,212,255,0.45);
}
.psc-energy__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}
.psc-energy__actions .psc-btn { text-decoration: none; }
.psc-energy__note {
  margin-top: 16px !important;
  color: var(--psc-text-dim) !important;
  font-size: .9rem;
}

@media (min-width: 760px) {
  .psc-energy__intro { grid-template-columns: minmax(0, 1fr) minmax(240px, 340px); }
}

@media (min-width: 1060px) {
  .psc-energy__layout { grid-template-columns: minmax(0, 1.05fr) minmax(340px, .95fr); }
  .psc-energy__result { position: sticky; top: calc(var(--psc-nav-h) + 18px); }
}

@media (max-width: 560px) {
  .psc-energy {
    padding: 18px;
    margin-left: -6px;
    margin-right: -6px;
  }
  .psc-energy__form,
  .psc-energy__result { padding: 18px; }
  .psc-energy__actions .psc-btn,
  .psc-energy__form > .psc-btn {
    width: 100%;
    white-space: normal;
  }
}

/* Compatibility checker */
.psc-compat {
  margin: 2.4rem 0 3rem;
  padding: 28px;
  border: 1px solid var(--psc-border);
  border-radius: var(--psc-radius);
  background: linear-gradient(180deg, rgba(20,21,24,0.96), rgba(13,14,17,0.96));
}
.psc-compat__intro {
  display: grid;
  grid-template-columns: 1fr;
  gap: 22px;
  align-items: end;
  margin-bottom: 24px;
}
.psc-compat__intro h2 { margin-top: 10px; }
.psc-compat__intro p:last-child { color: var(--psc-text-muted); margin-bottom: 0; }
.psc-compat__summary {
  min-width: 168px;
  padding: 18px;
  border: 1px solid rgba(0,212,255,0.28);
  border-radius: 12px;
  background: var(--psc-accent-soft);
}
.psc-compat__summary strong {
  display: block;
  color: var(--psc-accent);
  font-size: 2rem;
  line-height: 1;
}
.psc-compat__summary span {
  display: block;
  color: var(--psc-text-muted);
  font-size: .9rem;
  margin-top: 6px;
}
.psc-compat__controls {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  margin-bottom: 24px;
}
.psc-compat__search {
  display: grid;
  gap: 8px;
  color: var(--psc-text-muted);
  font-size: .88rem;
  font-weight: 600;
}
.psc-compat__search input {
  width: 100%;
  min-height: 48px;
  padding: 12px 14px;
  border: 1px solid var(--psc-border);
  border-radius: 10px;
  background: var(--psc-bg);
  color: var(--psc-white);
  font: inherit;
  font-size: 1rem;
}
.psc-compat__search input:focus {
  outline: none;
  border-color: var(--psc-accent);
  box-shadow: 0 0 0 3px var(--psc-accent-soft);
}
.psc-compat__filters {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
.psc-compat__chip {
  min-height: 42px;
  padding: 9px 14px;
  border: 1px solid var(--psc-border);
  border-radius: 999px;
  background: var(--psc-bg-card);
  color: var(--psc-text-muted);
  font: inherit;
  font-size: .92rem;
  font-weight: 700;
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease, color .2s ease;
}
.psc-compat__chip:hover,
.psc-compat__chip.is-active {
  border-color: var(--psc-accent);
  background: var(--psc-accent-soft);
  color: var(--psc-white);
}
.psc-compat__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}
.psc-compat-card {
  min-height: 230px;
  padding: 22px;
  border: 1px solid var(--psc-border);
  border-radius: 12px;
  background: rgba(10,10,10,0.58);
}
.psc-compat-card[hidden] { display: none; }
.psc-compat-card__top {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 12px;
}
.psc-compat-card h3 {
  margin: 0;
  font-size: 1.15rem;
  line-height: 1.25;
}
.psc-compat-card p {
  color: var(--psc-text-muted);
  font-size: .97rem;
}
.psc-compat-card__note {
  margin-top: auto;
  color: var(--psc-text-dim) !important;
  font-size: .9rem !important;
}
.psc-status {
  flex: none;
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 4px 10px;
  border: 1px solid currentColor;
  border-radius: 999px;
  font-size: .76rem;
  font-weight: 800;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
}
.psc-status--direct { color: #5eead4; background: rgba(94,234,212,0.10); }
.psc-status--integration { color: var(--psc-accent); background: var(--psc-accent-soft); }
.psc-status--check { color: #f8c66b; background: rgba(248,198,107,0.10); }
.psc-status--cloud { color: #ff9f8c; background: rgba(255,159,140,0.10); }
.psc-compat__empty {
  margin: 20px 0 0;
  padding: 16px;
  border: 1px solid var(--psc-border);
  border-radius: 10px;
  color: var(--psc-text-muted);
  background: var(--psc-bg);
}
.psc-compat-stack {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  margin: 1.6rem 0 2.4rem;
}
.psc-compat-feature {
  padding: 22px;
  border: 1px solid var(--psc-border);
  border-radius: 12px;
  background: var(--psc-bg-card);
}
.psc-compat-feature h3 { margin-top: 0; }
.psc-compat-feature p:last-child { margin-bottom: 0; color: var(--psc-text-muted); }
.psc-compat-next {
  display: grid;
  gap: 12px;
}
.psc-compat-cta {
  margin-top: 2.6rem;
  padding: 28px;
  border: 1px solid rgba(0,212,255,0.35);
  border-radius: var(--psc-radius);
  background:
    linear-gradient(135deg, rgba(0,212,255,0.13), transparent 52%),
    var(--psc-bg-card);
}
.psc-compat-cta p {
  max-width: 720px;
  color: var(--psc-text-muted);
}
.psc-compat-cta__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin-top: 18px;
}
.psc-compat-cta__actions .psc-btn {
  text-decoration: none;
}

@media (min-width: 760px) {
  .psc-compat__intro { grid-template-columns: 1fr auto; }
  .psc-compat__controls { grid-template-columns: minmax(260px, 360px) 1fr; align-items: end; }
  .psc-compat__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .psc-compat-stack { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 1080px) {
  .psc-compat__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
  .psc-compat { padding: 18px; margin-left: -6px; margin-right: -6px; }
  .psc-compat__filters { gap: 8px; }
  .psc-compat__chip { flex: 1 1 calc(50% - 8px); padding-left: 10px; padding-right: 10px; font-size: .86rem; }
  .psc-compat-card { min-height: 0; padding: 18px; }
  .psc-compat-card__top { flex-direction: column; align-items: flex-start; }
  .psc-status { white-space: normal; }
  .psc-compat-cta__actions .psc-btn { width: 100%; white-space: normal; }
}

/* Public product demo */
.psc-demo {
  margin: 2.4rem 0 3rem;
  padding: 28px;
  border: 1px solid var(--psc-border);
  border-radius: var(--psc-radius);
  background: linear-gradient(180deg, rgba(20,21,24,0.96), rgba(13,14,17,0.96));
}
.psc-demo br,
.psc-demo-next br {
  display: none;
}
.psc-demo__intro {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
  align-items: start;
  margin-bottom: 24px;
}
.psc-demo__intro h2 { margin-top: 10px; }
.psc-demo__intro p:last-child { color: var(--psc-text-muted); margin-bottom: 0; }
.psc-demo__signal {
  min-width: 220px;
  padding: 16px;
  border: 1px solid rgba(0,212,255,0.28);
  border-radius: 12px;
  background: var(--psc-accent-soft);
}
.psc-demo__signal strong {
  display: block;
  color: var(--psc-accent);
  line-height: 1.2;
}
.psc-demo__signal span {
  display: block;
  color: var(--psc-text-muted);
  font-size: .9rem;
  margin-top: 6px;
}
.psc-demo__layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
  align-items: start;
}
.psc-demo__steps {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}
.psc-demo__tab {
  width: 100%;
  min-height: 52px;
  padding: 12px 14px;
  border: 1px solid var(--psc-border);
  border-radius: 10px;
  background: rgba(10,10,10,0.58);
  color: var(--psc-text-muted);
  font: inherit;
  font-size: .96rem;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease, color .2s ease;
}
.psc-demo__tab span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 28px;
  margin-right: 10px;
  border-radius: 8px;
  background: var(--psc-bg-card);
  color: var(--psc-accent);
  font-size: .78rem;
}
.psc-demo__tab:hover,
.psc-demo__tab.is-active {
  border-color: var(--psc-accent);
  background: var(--psc-accent-soft);
  color: var(--psc-white);
}
.psc-demo__viewport {
  min-width: 0;
  padding: 22px;
  border: 1px solid var(--psc-border);
  border-radius: 12px;
  background: rgba(10,10,10,0.58);
}
.psc-demo__panel {
  min-height: 430px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 22px;
  align-items: stretch;
}
.psc-demo__panel[hidden] { display: none; }
.psc-demo__panel-copy {
  min-width: 0;
}
.psc-demo__kicker {
  margin: 0 0 10px !important;
  color: var(--psc-accent) !important;
  font-size: .82rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.psc-demo__checks {
  list-style: none;
  margin: 1rem 0 0;
  padding: 0;
}
.psc-demo__checks li {
  position: relative;
  padding-left: 28px;
  margin-bottom: 10px;
  color: var(--psc-text-muted);
}
.psc-demo__checks li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .62em;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--psc-accent);
  box-shadow: 0 0 10px var(--psc-accent-glow);
}
.psc-demo__surface {
  min-width: 0;
  min-height: 300px;
  display: grid;
  gap: 14px;
  align-content: center;
  padding: 22px;
  border: 1px solid var(--psc-border);
  border-radius: 12px;
  background:
    radial-gradient(90% 90% at 50% 0%, rgba(0,212,255,0.12), transparent 62%),
    var(--psc-bg-card);
}
.psc-demo-device {
  display: grid;
  justify-items: center;
  gap: 8px;
  margin: 0 auto;
  padding: 26px 28px;
  border: 1px solid var(--psc-border);
  border-radius: 12px;
  background: linear-gradient(158deg, #1b1d22, #0a0b0d);
  box-shadow: 0 22px 60px -34px var(--psc-accent-glow);
}
.psc-demo-device span {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--psc-accent);
  box-shadow: 0 0 14px var(--psc-accent-glow);
}
.psc-demo-device strong { color: var(--psc-white); }
.psc-demo-device small,
.psc-demo-room em,
.psc-demo-path {
  color: var(--psc-text-dim);
  font-size: .86rem;
  font-style: normal;
}
.psc-demo-flow {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: center;
}
.psc-demo-flow span,
.psc-demo-room,
.psc-demo__surface--status div {
  padding: 13px 14px;
  border: 1px solid var(--psc-border);
  border-radius: 10px;
  background: rgba(10,10,10,0.58);
}
.psc-demo-flow i {
  width: 28px;
  height: 1px;
  background: var(--psc-accent);
  opacity: .65;
}
.psc-demo-room {
  display: grid;
  gap: 4px;
}
.psc-demo-room strong,
.psc-demo__surface--status strong {
  color: var(--psc-white);
}
.psc-demo-room span,
.psc-demo__surface--status span {
  color: var(--psc-accent);
  font-size: .88rem;
  font-weight: 700;
}
.psc-demo__surface--list {
  align-content: center;
}
.psc-demo-toggle {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 52px;
  padding: 14px;
  border: 1px solid var(--psc-border);
  border-radius: 10px;
  background: rgba(10,10,10,0.58);
  color: var(--psc-text);
}
.psc-demo-toggle input {
  width: 18px;
  height: 18px;
  accent-color: var(--psc-accent);
}
.psc-demo-chat {
  display: grid;
  gap: 12px;
}
.psc-demo-msg {
  max-width: 86%;
  margin: 0 !important;
  padding: 12px 14px;
  border-radius: 14px;
  font-size: .95rem;
}
.psc-demo-msg--out {
  justify-self: end;
  background: var(--psc-accent);
  color: #04141a !important;
  font-weight: 600;
}
.psc-demo-msg--in {
  justify-self: start;
  border: 1px solid var(--psc-border);
  background: var(--psc-bg-elev);
}
.psc-demo-path {
  margin: 0 !important;
  padding-top: 8px;
  border-top: 1px solid var(--psc-border);
}
.psc-demo__surface--status {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.psc-demo__surface--status div {
  display: grid;
  gap: 5px;
}
.psc-demo__controls {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
  margin-top: 18px;
}
.psc-demo__control {
  min-height: 44px;
  padding: 10px 16px;
  border: 1px solid var(--psc-border);
  border-radius: 10px;
  background: transparent;
  color: var(--psc-text);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.psc-demo__control--primary {
  border-color: var(--psc-accent);
  background: var(--psc-accent);
  color: #04141a;
}
.psc-demo__control:disabled {
  cursor: not-allowed;
  opacity: .45;
}
.psc-demo-next {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  margin: 1.5rem 0 2.4rem;
}
.psc-demo-next a {
  display: grid;
  gap: 4px;
  padding: 18px;
  border: 1px solid var(--psc-border);
  border-radius: 12px;
  background: var(--psc-bg-card);
  text-decoration: none;
}
.psc-demo-next strong {
  color: var(--psc-white);
}
.psc-demo-next span {
  color: var(--psc-text-muted);
}
.psc-demo-next a:hover {
  border-color: var(--psc-accent);
}

@media (min-width: 760px) {
  .psc-demo__intro { grid-template-columns: minmax(0, 1fr) minmax(220px, 300px); }
  .psc-demo__layout { grid-template-columns: minmax(190px, 240px) minmax(0, 1fr); }
  .psc-demo__panel { grid-template-columns: minmax(0, .88fr) minmax(320px, 1.12fr); }
  .psc-demo-next { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
  .psc-demo {
    padding: 18px;
    margin-left: -6px;
    margin-right: -6px;
  }
  .psc-demo__viewport,
  .psc-demo__surface { padding: 18px; }
  .psc-demo__panel { min-height: 0; }
  .psc-demo__steps { grid-template-columns: 1fr; }
  .psc-demo__surface--status { grid-template-columns: 1fr; }
  .psc-demo-flow { justify-content: flex-start; }
  .psc-demo-flow i { width: 18px; }
  .psc-demo-msg { max-width: 94%; }
  .psc-demo__controls { justify-content: stretch; }
  .psc-demo__control { flex: 1 1 140px; }
}

/* Blog teaser cards (whole card is a link, with a topic thumbnail banner) */
.psc-card--post {
  display: flex;
  flex-direction: column;
  color: var(--psc-text);
  padding: 0;
  overflow: hidden;
}
.psc-card--post:hover { color: var(--psc-text); }
.psc-card--post__thumb {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 132px;
  background:
    radial-gradient(120% 130% at 28% 18%, rgba(0,212,255,0.20), transparent 58%),
    linear-gradient(135deg, #14161b, #0b0c0f);
  border-bottom: 1px solid var(--psc-border);
}
.psc-card--post__glyph {
  font-size: 46px;
  line-height: 1;
  filter: drop-shadow(0 6px 18px rgba(0,0,0,0.5));
  transition: transform .25s ease;
}
.psc-card--post:hover .psc-card--post__glyph { transform: scale(1.06); }
.psc-card--post__cat {
  position: absolute;
  top: 12px; left: 12px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--psc-accent);
  background: rgba(0,212,255,0.10);
  border: 1px solid var(--psc-border);
  padding: 4px 11px;
  border-radius: 999px;
}
.psc-card--post__body {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  padding: 22px 24px 26px;
}
.psc-card--post__title {
  font-size: 1.18rem;
  line-height: 1.35;
  margin: 10px 0 12px;
  color: var(--psc-white);
}
.psc-card--post:hover .psc-card--post__title { color: var(--psc-accent); }
.psc-card--post__excerpt {
  color: var(--psc-text-muted);
  font-size: .98rem;
  margin: 0 0 18px;
  flex: 1 1 auto;
}
.psc-card--post .psc-link { margin-top: auto; }
.psc-card--post .psc-postcard__meta { margin: 0; }

/* Pricing tiers */
.psc-pricing {
  display: grid;
  grid-template-columns: 1fr;
  gap: 22px;
  margin: 2rem 0;
}
@media (min-width: 980px) { .psc-pricing { grid-template-columns: repeat(3, 1fr); align-items: start; } }
.psc-tier {
  padding: 30px 26px;
  border: 1px solid var(--psc-border);
  border-radius: var(--psc-radius);
  background: var(--psc-bg-card);
  display: flex;
  flex-direction: column;
}
.psc-tier--featured {
  border-color: var(--psc-accent);
  box-shadow: 0 0 0 1px var(--psc-accent), 0 20px 50px -24px var(--psc-accent-glow);
}
.psc-tier__badge {
  align-self: flex-start;
  margin-bottom: 14px;
  padding: 5px 12px;
  border-radius: 999px;
  background: var(--psc-accent-soft);
  color: var(--psc-accent);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.psc-tier h3 { margin: 0 0 4px; }
.psc-tier__price {
  font-size: 2.4rem;
  font-weight: 800;
  color: var(--psc-white);
  letter-spacing: -0.03em;
  margin: 10px 0 2px;
}
.psc-tier__price small { font-size: .9rem; font-weight: 500; color: var(--psc-text-dim); }
.psc-tier__note { color: var(--psc-text-dim); font-size: .9rem; margin-bottom: 18px; }
.psc-tier__features { list-style: none; margin: 0 0 24px; padding: 0; }
.psc-tier__features li {
  position: relative;
  padding-left: 26px;
  margin-bottom: 11px;
  color: var(--psc-text-muted);
}
.psc-tier__features li::before {
  content: "✓";
  position: absolute; left: 0;
  color: var(--psc-accent);
  font-weight: 700;
}
.psc-tier .psc-btn { margin-top: auto; width: 100%; }
.psc-pricing-decision {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  margin: 1.6rem 0 2.2rem;
}
@media (min-width: 980px) { .psc-pricing-decision { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.psc-pricing-decision__item,
.psc-pricing-next {
  padding: 24px;
  border: 1px solid var(--psc-border);
  border-radius: var(--psc-radius);
  background: rgba(16,17,20,0.86);
}
.psc-pricing-decision__item h3,
.psc-pricing-next h2 {
  margin-top: 0;
}
.psc-pricing-decision__item p:last-child,
.psc-pricing-next ul:last-child {
  margin-bottom: 0;
}
.psc-pricing-decision__item {
  overflow-wrap: anywhere;
}
.psc-pricing-next {
  margin: 1.8rem 0 2.2rem;
}
.psc-pricing-cta {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin-top: 1.8rem;
}
.psc-pricing-cta .psc-btn {
  min-width: min(100%, 220px);
}
@media (max-width: 520px) {
  .psc-pricing-decision__item,
  .psc-pricing-next {
    padding: 20px;
  }
  .psc-pricing-cta .psc-btn {
    width: 100%;
  }
}

/* Stats (investoren) */
.psc-stats {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 18px;
  margin: 2rem 0;
}
@media (min-width: 760px) { .psc-stats { grid-template-columns: repeat(4, 1fr); } }
.psc-stat {
  padding: 24px;
  border: 1px solid var(--psc-border);
  border-radius: var(--psc-radius);
  background: var(--psc-bg-card);
}
.psc-stat__num { font-size: 2rem; font-weight: 800; color: var(--psc-accent); letter-spacing: -0.03em; }
.psc-stat__label { color: var(--psc-text-muted); font-size: .92rem; margin-top: 4px; }

/* Team (ueber-uns) */
.psc-team {
  display: grid;
  grid-template-columns: 1fr;
  gap: 22px;
  margin: 2rem 0;
}
@media (min-width: 720px) { .psc-team { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .psc-team { grid-template-columns: repeat(3, 1fr); } }
.psc-member {
  padding: 26px;
  border: 1px solid var(--psc-border);
  border-radius: var(--psc-radius);
  background: var(--psc-bg-card);
}
.psc-member__avatar {
  width: 64px; height: 64px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 24px; font-weight: 800;
  color: #04141a;
  background: linear-gradient(150deg, var(--psc-white), var(--psc-accent) 70%);
  margin-bottom: 16px;
}
.psc-member h3 { margin: 0 0 2px; }
.psc-member__role { color: var(--psc-accent); font-size: .9rem; font-weight: 600; margin-bottom: 12px; }
.psc-member p { color: var(--psc-text-muted); margin-bottom: 0; }
.psc-member__social { margin: 14px 0 0 !important; }
.psc-member__link {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: .82rem; font-weight: 600; color: var(--psc-accent); opacity: .85;
}
.psc-member__link .psc-in {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; border-radius: 5px;
  background: var(--psc-accent); color: #04141a; font-weight: 800; font-size: .72rem;
}

/* ============================================================
   WAITLIST CTA (site-wide, bottom of every page)
   ============================================================ */
.psc-cta {
  position: relative;
  padding: 92px 0;
  border-top: 1px solid var(--psc-border);
  overflow: hidden;
  isolation: isolate;
  text-align: center;
}
.psc-cta__bg {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(720px 380px at 50% 0%, rgba(0,212,255,0.14), transparent 60%),
    var(--psc-bg-elev);
}
.psc-cta__inner { max-width: 640px; }
.psc-cta .psc-eyebrow { justify-content: center; }
.psc-cta h2 { font-size: clamp(1.9rem, 4vw, 2.8rem); margin-top: 14px; }
.psc-cta__lead { color: var(--psc-text-muted); font-size: 1.12rem; margin: 0 auto 28px; max-width: 520px; }
.psc-cta__fine { color: var(--psc-text-dim); font-size: 13px; margin-top: 18px; }
.psc-cta__fine a { color: var(--psc-text-muted); text-decoration: underline; }

/* ============================================================
   FORMS — Contact Form 7 (contact/investor/beta) + Newsletter
   ============================================================ */
.psc-form label { display: block; margin-bottom: 16px; color: var(--psc-text); font-size: .95rem; font-weight: 500; }
.psc-form p { margin: 0 0 4px; }
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form input[type="number"],
.wpcf7-form select,
.wpcf7-form textarea {
  width: 100%;
  margin-top: 6px;
  padding: 13px 15px;
  background: var(--psc-bg-card);
  border: 1px solid var(--psc-border);
  border-radius: 10px;
  color: var(--psc-white);
  font-family: var(--psc-font);
  font-size: 16px;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.wpcf7-form textarea { min-height: 140px; resize: vertical; }
.wpcf7-form select { min-height: 50px; }
.wpcf7-form input::placeholder,
.wpcf7-form textarea::placeholder { color: var(--psc-text-dim); }
.wpcf7-form input:focus,
.wpcf7-form select:focus,
.wpcf7-form textarea:focus {
  outline: none;
  border-color: var(--psc-accent);
  box-shadow: 0 0 0 3px var(--psc-accent-soft);
}
.wpcf7-form .wpcf7-not-valid {
  border-color: #e2554f !important;
  box-shadow: 0 0 0 3px rgba(226, 85, 79, 0.12);
}
.wpcf7-form input[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 10px;
  padding: 14px 28px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: var(--psc-accent);
  color: #04141a;
  font-family: var(--psc-font);
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 6px 24px -6px var(--psc-accent-glow);
  transition: transform .18s ease, box-shadow .25s ease;
}
.wpcf7-form input[type="submit"]:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 34px -6px var(--psc-accent-glow), 0 0 0 1px var(--psc-accent);
}

/* Waitlist inline form (email + submit on one row at wider widths) */
.psc-waitlist-form {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
  max-width: 760px;
  margin: 0 auto;
}
.psc-waitlist-form .psc-waitlist-field {
  flex: 1 1 230px;
  margin: 0;
  color: var(--psc-text-muted);
  font-size: .9rem;
  font-weight: 700;
  line-height: 1.35;
}
.psc-waitlist-form .psc-waitlist-field label {
  display: block;
  text-align: left;
}
.psc-waitlist-form .psc-waitlist-field .wpcf7-form-control-wrap {
  flex: 1 1 240px;
  display: block;
  margin-top: 7px;
}
.psc-waitlist-form input[type="email"],
.psc-waitlist-form input[type="text"],
.psc-waitlist-form select { margin-top: 0; }
.psc-waitlist-form input[type="submit"] { margin-top: 0; flex: 0 0 auto; }

/* DSGVO opt-in consent line — full width below the inputs */
.psc-waitlist-form .psc-waitlist-consent {
  flex: 1 1 100%;
  text-align: left;
  font-size: .82rem;
  line-height: 1.5;
  color: var(--psc-text-muted);
}
.psc-waitlist-form .psc-waitlist-consent .wpcf7-form-control-wrap,
.psc-waitlist-form .psc-waitlist-consent .wpcf7-acceptance,
.psc-waitlist-form .psc-waitlist-consent .wpcf7-list-item { display: inline; margin: 0; }
.psc-waitlist-form .psc-waitlist-consent .wpcf7-list-item-label:empty { display: none; }
.psc-waitlist-form .psc-waitlist-consent label { font-weight: 400; display: inline; }
.psc-waitlist-form .psc-waitlist-consent input[type="checkbox"] {
  width: auto;
  margin: 0 .5rem 0 0;
  accent-color: var(--psc-accent);
  vertical-align: middle;
}
.psc-waitlist-form .psc-waitlist-consent a { color: var(--psc-accent); }

/* The Newsletter Plugin waitlist. The custom shortcode output stays native
   to Newsletter so DOI, subscriber state and service messages remain intact. */
.psc-newsletter {
  width: 100%;
  max-width: 760px;
  margin: 0 auto;
}
.psc-newsletter__doi-note,
.psc-newsletter__legal {
  max-width: 640px;
  margin-right: auto;
  margin-left: auto;
  color: var(--psc-text-muted);
  font-size: .88rem;
  line-height: 1.55;
}
.psc-newsletter__doi-note { margin-bottom: 18px; }
.psc-newsletter__legal {
  margin-top: 16px;
  margin-bottom: 0;
  color: var(--psc-text-dim);
  font-size: .8rem;
}
.psc-newsletter__legal a {
  color: var(--psc-text-muted);
  text-decoration: underline;
  text-underline-offset: .16em;
}
.psc-newsletter form.psc-newsletter__form {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 12px;
  width: 100%;
  max-width: 760px;
  margin: 0 auto;
  text-align: left;
}
.psc-newsletter form.psc-newsletter__form .tnp-field {
  min-width: 0;
  margin: 0 !important;
  padding: 0;
  border: 0;
}
.psc-newsletter form.psc-newsletter__form .tnp-field-email { flex: 1 1 320px; }
.psc-newsletter form.psc-newsletter__form .tnp-field-button {
  flex: 0 0 auto;
  align-self: flex-end;
}
.psc-newsletter form.psc-newsletter__form .tnp-field-privacy {
  display: flex;
  flex: 1 1 100%;
  align-items: flex-start;
  gap: 9px;
  margin-top: 2px !important;
}
.psc-newsletter form.psc-newsletter__form label {
  display: block;
  margin: 0 0 7px;
  color: var(--psc-text-muted);
  font-size: .9rem;
  font-weight: 700;
  line-height: 1.4;
}
.psc-newsletter form.psc-newsletter__form input.tnp-email {
  display: block;
  width: 100%;
  min-height: 50px;
  margin: 0;
  padding: 13px 15px;
  border: 1px solid var(--psc-border);
  border-radius: 10px;
  background: var(--psc-bg-card);
  color: var(--psc-white);
  font-family: var(--psc-font);
  font-size: 16px;
  line-height: 1.4;
  box-shadow: none;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.psc-newsletter form.psc-newsletter__form input.tnp-email::placeholder { color: var(--psc-text-dim); }
.psc-newsletter form.psc-newsletter__form input.tnp-email:focus {
  outline: none;
  border-color: var(--psc-accent);
  box-shadow: 0 0 0 3px var(--psc-accent-soft);
}
.psc-newsletter form.psc-newsletter__form input.tnp-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-height: 50px;
  margin: 0;
  padding: 13px 24px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: var(--psc-accent);
  color: #04141a;
  font-family: var(--psc-font);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.4;
  white-space: nowrap;
  cursor: pointer;
  box-shadow: 0 6px 24px -6px var(--psc-accent-glow);
  transition: transform .18s ease, box-shadow .25s ease;
}
.psc-newsletter form.psc-newsletter__form input.tnp-submit:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 34px -6px var(--psc-accent-glow), 0 0 0 1px var(--psc-accent);
}
.psc-newsletter form.psc-newsletter__form input.tnp-submit:focus-visible {
  outline: 3px solid var(--psc-white);
  outline-offset: 3px;
}
.psc-newsletter form.psc-newsletter__form input.tnp-submit:disabled {
  cursor: wait;
  opacity: .68;
}
.psc-newsletter form.psc-newsletter__form input.tnp-privacy {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  margin: 2px 0 0;
  accent-color: var(--psc-accent);
}
.psc-newsletter form.psc-newsletter__form .tnp-field-privacy label {
  margin: 0;
  color: var(--psc-text-muted);
  font-size: .82rem;
  font-weight: 400;
  line-height: 1.5;
}
.psc-newsletter form.psc-newsletter__form > p,
.psc-newsletter form.psc-newsletter__form > div:not(.tnp-field) {
  flex: 1 1 100%;
}
.psc-newsletter__fallback {
  padding: 20px;
  border: 1px solid var(--psc-border);
  border-radius: var(--psc-radius);
  background: rgba(10,10,10,0.55);
  text-align: center;
}
.psc-newsletter__fallback p {
  max-width: 560px;
  margin: 0 auto 16px;
  color: var(--psc-text-muted);
}

/* DSGVO consent line inside the stacked contact form */
.psc-form .psc-consent { font-size: .85rem; color: var(--psc-text-muted); line-height: 1.5; }
.psc-form .psc-consent label { font-weight: 400; }
.psc-form .psc-consent input[type="checkbox"] {
  width: auto;
  margin: 0 .5rem 0 0;
  accent-color: var(--psc-accent);
  vertical-align: middle;
}

.psc-form--beta {
  margin-top: 1.4rem;
  padding: 24px;
  border: 1px solid var(--psc-border);
  border-radius: var(--psc-radius);
  background: rgba(10,10,10,0.58);
}
.psc-form--beta p:last-child { margin-bottom: 0; }

@media (max-width: 560px) {
  .psc-form--beta {
    padding: 18px;
    margin-left: -6px;
    margin-right: -6px;
  }
  .psc-form--beta input[type="submit"] {
    width: 100%;
    white-space: normal;
  }
}

/* CF7 response + validation messaging */
.wpcf7 form .wpcf7-response-output {
  margin: 18px 0 0;
  padding: 14px 16px;
  border-radius: 10px;
  border: 1px solid var(--psc-border);
  color: var(--psc-text);
  font-size: .92rem;
  line-height: 1.45;
  background: var(--psc-bg-card);
}
.wpcf7 form.sent .wpcf7-response-output { border-color: var(--psc-accent); background: var(--psc-accent-soft); }
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output { border-color: #e2554f; color: #ffb4b0; }
.wpcf7-not-valid-tip {
  display: block;
  margin-top: 6px;
  color: #ffb4b0;
  font-size: .85rem;
  line-height: 1.35;
}
.wpcf7-spinner { margin: 0 0 0 10px; }

@media (max-width: 560px) {
  .psc-waitlist-form { align-items: stretch; }
  .psc-waitlist-form .psc-waitlist-field,
  .psc-waitlist-form input[type="submit"] {
    width: 100%;
    flex-basis: 100%;
  }
  .psc-newsletter form.psc-newsletter__form .tnp-field-email,
  .psc-newsletter form.psc-newsletter__form .tnp-field-button {
    flex: 1 1 100%;
  }
  .psc-newsletter form.psc-newsletter__form input.tnp-submit { width: 100%; }
  .psc-newsletter__doi-note,
  .psc-newsletter__legal { text-align: left; }
}

/* ============================================================
   HERO SHOWCASE — product cube + Telegram chat with Hermes
   (replaces the old CSS-box device; later rule overrides earlier)
   ============================================================ */
.psc-hero__visual {
  display: flex;
  align-items: center;
  justify-content: center;
  perspective: none;
}
.psc-showcase {
  position: relative;
  width: min(420px, 92vw);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 22px;
  isolation: isolate;
}
.psc-showcase__glow {
  position: absolute;
  inset: -12% -10% 8%;
  z-index: -1;
  background: radial-gradient(60% 50% at 50% 30%, var(--psc-accent-soft), transparent 72%);
  filter: blur(30px);
}

/* product cube */
.psc-cube {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  animation: psc-cube-float 7s ease-in-out infinite;
}
@keyframes psc-cube-float {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-12px); }
}
.psc-cube svg { filter: drop-shadow(0 18px 40px rgba(0,0,0,0.55)) drop-shadow(0 0 22px var(--psc-accent-glow)); }
.psc-cube__led { animation: psc-cube-pulse 1.8s ease-in-out infinite; }
.psc-cube__led:nth-of-type(2) { animation-delay: .25s; }
.psc-cube__led:nth-of-type(3) { animation-delay: .5s; }
@keyframes psc-cube-pulse {
  0%, 100% { opacity: 1; }
  50%      { opacity: .3; }
}
.psc-cube__tag {
  margin-top: 6px;
  font-size: 12px;
  letter-spacing: 0.08em;
  color: var(--psc-text-dim);
  text-transform: uppercase;
}

/* Telegram chat mockup */
.psc-chat {
  width: 100%;
  margin: 0;
  border: 1px solid var(--psc-border);
  border-radius: 16px;
  background: linear-gradient(170deg, var(--psc-bg-card), var(--psc-bg-elev));
  box-shadow: 0 26px 60px -28px rgba(0,0,0,0.8), 0 0 0 1px rgba(0,212,255,0.05);
  overflow: hidden;
}
.psc-chat__bar {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--psc-border);
  background: rgba(255,255,255,0.02);
}
.psc-chat__avatar {
  flex: none;
  width: 38px; height: 38px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: 17px;
  color: #04141a;
  background: linear-gradient(150deg, var(--psc-white), var(--psc-accent) 70%);
}
.psc-chat__id { display: flex; flex-direction: column; line-height: 1.3; margin-right: auto; }
.psc-chat__id strong { color: var(--psc-white); font-size: 15px; }
.psc-chat__id small { color: var(--psc-accent); font-size: 12px; }
.psc-chat__tg { flex: none; opacity: .9; }
.psc-chat__body {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 18px 16px 20px;
}
.psc-msg {
  position: relative;
  max-width: 84%;
  margin: 0;
  padding: 11px 14px 22px;
  border-radius: 14px;
  font-size: 14.5px;
  line-height: 1.5;
  color: var(--psc-text);
}
.psc-msg--out {
  align-self: flex-end;
  background: var(--psc-accent);
  color: #04141a;
  border-bottom-right-radius: 4px;
  font-weight: 500;
}
.psc-msg--in {
  align-self: flex-start;
  background: var(--psc-bg-elev);
  border: 1px solid var(--psc-border);
  border-bottom-left-radius: 4px;
}
.psc-msg--in strong { color: var(--psc-white); }
.psc-msg__path {
  display: block;
  margin-top: 6px;
  font-size: 12.5px;
  color: var(--psc-text-muted);
}
.psc-msg__cta {
  display: inline-block;
  margin-top: 8px;
  padding: 5px 12px;
  border-radius: 999px;
  background: var(--psc-accent-soft);
  color: var(--psc-accent);
  font-size: 12.5px;
  font-weight: 600;
}
.psc-msg__t {
  position: absolute;
  right: 12px; bottom: 7px;
  font-size: 10.5px;
  opacity: .65;
}
.psc-msg--out .psc-msg__t { color: #04141a; }
.psc-msg--in .psc-msg__t { color: var(--psc-text-dim); }

/* stat chips under the hero visual */
.psc-hero__chips {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  width: 100%;
}
.psc-chip {
  display: inline-flex;
  align-items: baseline;
  gap: 7px;
  padding: 9px 14px;
  border: 1px solid var(--psc-border);
  border-radius: 999px;
  background: var(--psc-bg-card);
  font-size: 13px;
  color: var(--psc-text-muted);
}
.psc-chip b { color: var(--psc-accent); font-size: 16px; font-weight: 800; }

/* ============================================================
   FRONT-PAGE SECTIONS — split layout, checklist, notes, accent
   ============================================================ */
.psc-split {
  display: grid;
  grid-template-columns: 1fr;
  gap: 32px;
  align-items: center;
  margin-top: 8px;
}
@media (min-width: 980px) {
  .psc-split { grid-template-columns: 1fr 1fr; gap: 48px; }
}
.psc-split__text { max-width: 520px; }
.psc-chat--lg { max-width: 440px; }
.psc-chat--lg .psc-msg { max-width: 88%; }

.psc-checklist { list-style: none; margin: 0 0 22px; padding: 0; }
.psc-checklist li {
  position: relative;
  padding-left: 30px;
  margin-bottom: 14px;
  color: var(--psc-text-muted);
}
.psc-checklist li::before {
  content: "✓";
  position: absolute;
  left: 0; top: -1px;
  width: 20px; height: 20px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%;
  background: var(--psc-accent-soft);
  color: var(--psc-accent);
  font-size: 12px; font-weight: 800;
}

.psc-section__note {
  margin-top: 22px;
  color: var(--psc-text-dim);
  font-size: .95rem;
}

.psc-section--accent {
  overflow: hidden;
  isolation: isolate;
}
.psc-section--accent::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(720px 380px at 50% 0%, rgba(0,212,255,0.12), transparent 60%),
    var(--psc-bg-elev);
}
.psc-section--accent .psc-waitlist-wrap { margin-top: 26px; }

@media (max-width: 560px) {
  .psc-showcase { width: 100%; }
  .psc-msg { max-width: 90%; }
}

@media (prefers-reduced-motion: reduce) {
  .psc-cube, .psc-cube__led { animation: none !important; }
}

/* ============================================================
   2.1 POLISH — responsive shell, motion and interaction a11y
   ============================================================ */

/* A clearly visible keyboard state across links, controls and form fields. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid var(--psc-accent) !important;
  outline-offset: 4px;
}

.psc-btn:focus-visible,
.psc-burger:focus-visible,
.psc-lang__opt:focus-visible {
  box-shadow: 0 0 0 5px rgba(0, 212, 255, 0.18);
}

/* Current-page state works with WordPress classes and the JS fallback. */
.psc-nav__links .current-menu-item > a,
.psc-nav__links .current_page_item > a,
.psc-nav__links a[aria-current="page"] {
  color: var(--psc-white);
}

.psc-nav__links .current-menu-item > a::after,
.psc-nav__links .current_page_item > a::after,
.psc-nav__links a[aria-current="page"]::after,
.psc-nav__links a:focus-visible::after {
  width: 100%;
}

.psc-hero__col {
  max-width: 720px;
}

.psc-hero h1 {
  max-width: 19ch;
  font-size: clamp(2.1rem, 4.4vw, 3.65rem);
  text-wrap: balance;
}

.psc-hero__sub {
  max-width: 64ch;
  font-size: clamp(1.05rem, 1.45vw, 1.3rem);
}

.psc-section__head h1,
.psc-section__head h2,
.psc-cta__inner h2 {
  text-wrap: balance;
}

.psc-showcase {
  width: min(clamp(340px, 34vw, 470px), 100%);
}

.psc-cube svg {
  width: clamp(148px, 11vw, 190px);
  height: auto;
}

/* Added only by JS, so content stays visible if scripting is unavailable. */
.psc-motion-ready .psc-reveal {
  opacity: 0;
  translate: 0 24px;
  will-change: opacity, translate;
}

.psc-motion-ready .psc-reveal--hero.psc-hero__visual {
  translate: 24px 0;
}

.psc-motion-ready .psc-reveal.is-visible {
  animation: psc-reveal-in 720ms cubic-bezier(.2, .72, .25, 1) forwards;
  animation-delay: var(--psc-reveal-delay, 0ms);
}

.psc-motion-ready .psc-reveal:focus-within {
  opacity: 1;
  translate: none;
  animation: none;
}

@keyframes psc-reveal-in {
  to {
    opacity: 1;
    translate: 0 0;
  }
}

/* The header and hero switch together, removing the cramped 861–979px band. */
@media (max-width: 979px) {
  body.psc-menu-open {
    overflow: hidden;
  }

  .psc-nav__links {
    position: fixed;
    inset: var(--psc-nav-h) 0 auto 0;
    max-height: calc(100vh - var(--psc-nav-h));
    max-height: calc(100dvh - var(--psc-nav-h));
    overflow-y: auto;
    overscroll-behavior: contain;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    padding: 22px clamp(32px, 4.4vw, 48px) 30px;
    background: rgba(10, 10, 10, 0.98);
    backdrop-filter: blur(18px) saturate(150%);
    -webkit-backdrop-filter: blur(18px) saturate(150%);
    border-bottom: 1px solid var(--psc-border);
    box-shadow: 0 24px 44px rgba(0, 0, 0, 0.38);
    visibility: hidden;
    transform: translateY(-12px);
    opacity: 0;
    pointer-events: none;
    transition: visibility 0s linear .24s, opacity .22s ease, transform .22s ease;
  }

  .psc-nav.is-open .psc-nav__links {
    visibility: visible;
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
    transition-delay: 0s;
  }

  .psc-nav__links a {
    width: 100%;
    padding: 12px 0;
    font-size: 17px;
  }

  .psc-nav__links a::after {
    display: none;
  }

  .psc-nav__links .current-menu-item > a,
  .psc-nav__links .current_page_item > a,
  .psc-nav__links a[aria-current="page"] {
    text-decoration: underline;
    text-decoration-color: var(--psc-accent);
    text-decoration-thickness: 2px;
    text-underline-offset: 7px;
  }

  .psc-burger {
    display: inline-flex;
  }

  .psc-hero {
    min-height: auto;
    padding: calc(var(--psc-nav-h) + 58px) 0 88px;
  }

  .psc-hero__layout {
    grid-template-columns: 1fr;
    gap: 52px;
  }

  .psc-footer__inner {
    grid-template-columns: 1fr;
    gap: 34px;
  }

  .psc-footer__nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Spacious, consistent tablet gutters including both iPad orientations. */
@media (min-width: 600px) and (max-width: 1199px) {
  .psc-container,
  .psc-nav__inner {
    padding-left: clamp(32px, 4.4vw, 48px);
    padding-right: clamp(32px, 4.4vw, 48px);
  }
}

/* Keep the desktop header composed immediately above its mobile breakpoint. */
@media (min-width: 980px) and (max-width: 1120px) {
  .psc-nav__links {
    gap: 11px;
  }

  .psc-nav__links a {
    font-size: 13px;
  }

  .psc-nav__cta {
    gap: 9px;
  }

  .psc-nav__cta .psc-btn {
    padding-inline: 12px;
  }

  .psc-lang__opt {
    padding-inline: 7px;
  }
}

@media (max-width: 599px) {
  .psc-container,
  .psc-nav__inner {
    padding-left: 20px;
    padding-right: 20px;
  }

  .psc-nav__links {
    padding-left: 20px;
    padding-right: 20px;
  }

  .psc-hero h1 {
    max-width: 17ch;
  }

  .psc-hero {
    padding-top: calc(var(--psc-nav-h) + 44px);
    padding-bottom: 68px;
  }

  .psc-hero__layout {
    gap: 44px;
  }

  .psc-footer__nav {
    grid-template-columns: 1fr;
    gap: 24px;
  }
}

@media (max-width: 480px) {
  .psc-logo > span:last-child { display: none; }
}

@media (max-width: 430px) {
  .psc-container,
  .psc-nav__inner {
    padding-left: 16px;
    padding-right: 16px;
  }

  .psc-nav__links {
    padding-left: 16px;
    padding-right: 16px;
  }
}

/* 4K / ultrawide: a larger shell and type scale without overlong copy lines. */
@media (min-width: 1800px) {
  body {
    font-size: 18px;
  }

  .psc-container,
  .psc-nav__inner {
    padding-left: 64px;
    padding-right: 64px;
  }

  .psc-hero {
    min-height: min(100vh, 1280px);
    padding-top: calc(var(--psc-nav-h) + 82px);
    padding-bottom: 112px;
  }

  .psc-hero__layout {
    grid-template-columns: minmax(0, 1.05fr) minmax(440px, .95fr);
    gap: 88px;
  }

  .psc-hero__col {
    max-width: 780px;
  }

  .psc-hero h1 {
    max-width: 18ch;
    font-size: clamp(3.75rem, 2.1vw, 4.75rem);
  }

  .psc-hero__sub {
    max-width: 62ch;
    font-size: 1.3rem;
  }

  .psc-showcase {
    width: min(540px, 100%);
  }

  .psc-section {
    padding-top: 118px;
    padding-bottom: 118px;
  }

  .psc-section--compact {
    padding-top: 56px;
    padding-bottom: 56px;
  }

  .psc-section__head {
    max-width: 760px;
  }

  .psc-section h2 {
    font-size: clamp(2rem, 1.15vw, 2.5rem);
  }

  .psc-page h1,
  .psc-single h1,
  .psc-blog h1 {
    max-width: 24ch;
    font-size: clamp(2rem, 1.2vw, 2.65rem);
  }

  .psc-prose:not(.psc-prose--wide) {
    max-width: 980px;
  }

  .psc-grid,
  .psc-bloglist,
  .psc-pricing,
  .psc-team {
    gap: 28px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .psc-motion-ready .psc-reveal,
  .psc-motion-ready .psc-reveal--hero.psc-hero__visual,
  .psc-motion-ready .psc-reveal.is-visible {
    opacity: 1 !important;
    translate: none !important;
    animation: none !important;
    will-change: auto;
  }
}

@media print {
  .psc-motion-ready .psc-reveal,
  .psc-motion-ready .psc-reveal--hero.psc-hero__visual,
  .psc-motion-ready .psc-reveal.is-visible {
    opacity: 1 !important;
    translate: none !important;
    animation: none !important;
    will-change: auto;
  }
}

/* ============================================================
   2.3 EDITORIAL SYSTEM — journal hierarchy and long-form reading
   ============================================================ */

/* The journal follows the shared stage width but stops expanding before its
   three-column composition becomes a five-column dashboard on ultrawide
   screens. The article shell is wider than the reading measure so the prose
   width never loses space to the global 4K gutter. */
.psc-journal-shell {
  width: min(100%, var(--psc-max), 1780px);
  max-width: none;
}

.psc-article-shell {
  width: min(100%, var(--psc-max), 1500px);
  max-width: none;
}

.psc-journal {
  overflow: hidden;
  padding-top: calc(var(--psc-nav-h) + clamp(50px, 6vw, 94px));
  padding-bottom: clamp(92px, 9vw, 142px);
}

.psc-journal-head {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr);
  align-items: end;
  gap: clamp(34px, 6vw, 88px);
  margin-bottom: 28px;
  padding-bottom: clamp(34px, 4vw, 56px);
  border-bottom: 1px solid var(--psc-border);
}

.psc-journal-head h1 {
  max-width: 15ch;
  margin: 18px 0 0;
  font-size: clamp(2.8rem, 5vw, 5rem);
  line-height: .98;
  letter-spacing: -.06em;
  text-wrap: balance;
}

.psc-journal-head__lead {
  max-width: 40ch;
  margin: 0;
  color: var(--psc-text-muted);
  font-size: var(--psc-step-0);
  line-height: 1.65;
}

.psc-story-topics {
  margin: 0 0 clamp(32px, 4vw, 52px);
}

.psc-story-topics ul {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.psc-story-topics a {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--psc-border);
  border-radius: 999px;
  background: rgba(15, 32, 49, .66);
  padding: 8px 14px;
  color: var(--psc-text-muted);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .015em;
  transition: border-color .2s ease, background .2s ease, color .2s ease, transform .2s ease;
}

.psc-story-topics a:hover,
.psc-story-topics a[aria-current="page"] {
  border-color: rgba(115, 229, 194, .5);
  background: var(--psc-local-soft);
  color: var(--psc-white);
}

.psc-story-topics a:hover { transform: translateY(-2px); }

.psc-story-topics__dot {
  width: 7px;
  height: 7px;
  flex: none;
  border-radius: 50%;
  background: var(--psc-accent);
  box-shadow: 0 0 10px rgba(32, 215, 242, .38);
}

.psc-story-topics__dot--server { background: var(--psc-local); box-shadow: 0 0 10px rgba(115, 229, 194, .36); }
.psc-story-topics__dot--privacy { background: var(--psc-home); box-shadow: 0 0 10px rgba(241, 183, 104, .36); }
.psc-story-topics__dot--ai { background: #b99cff; box-shadow: 0 0 10px rgba(185, 156, 255, .38); }

.psc-story-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(18px, 2vw, 28px);
  align-items: stretch;
}

.psc-story-card {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--psc-border);
  border-radius: 20px;
  background:
    linear-gradient(155deg, rgba(20, 42, 63, .84), rgba(8, 23, 36, .98));
  box-shadow: 0 24px 64px -48px rgba(0, 0, 0, .94);
  transition: border-color .25s ease, transform .25s ease, box-shadow .3s ease;
}

.psc-story-card::before {
  content: "";
  position: absolute;
  z-index: 3;
  inset: 0 auto 0 0;
  width: 2px;
  background: linear-gradient(transparent, var(--psc-local), transparent);
  opacity: .46;
  pointer-events: none;
}

.psc-story-card:hover,
.psc-story-card:focus-within {
  border-color: rgba(115, 229, 194, .5);
  transform: translateY(-5px);
  box-shadow: 0 34px 80px -48px rgba(32, 215, 242, .38);
}

.psc-story-card__link {
  display: flex;
  min-height: 100%;
  flex-direction: column;
  color: var(--psc-text);
}

.psc-story-card__link:hover { color: var(--psc-text); }

.psc-story-card__link:focus-visible {
  outline-offset: -5px !important;
  border-radius: inherit;
}

.psc-story-cover {
  --psc-story-accent: var(--psc-accent);
  --psc-story-soft: rgba(32, 215, 242, .18);
  position: relative;
  isolation: isolate;
  display: block;
  min-height: 178px;
  overflow: hidden;
  border-bottom: 1px solid var(--psc-border);
  background:
    radial-gradient(circle at 72% 28%, var(--psc-story-soft), transparent 30%),
    linear-gradient(138deg, #102a40, #071522 62%, #0c2032);
}

.psc-story-cover--server { --psc-story-accent: var(--psc-local); --psc-story-soft: rgba(115, 229, 194, .2); }
.psc-story-cover--privacy { --psc-story-accent: var(--psc-home); --psc-story-soft: rgba(241, 183, 104, .2); }
.psc-story-cover--ai { --psc-story-accent: #b99cff; --psc-story-soft: rgba(185, 156, 255, .2); }

.psc-story-cover::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0;
  background: linear-gradient(115deg, rgba(6, 16, 26, .12), rgba(6, 16, 26, .52));
  pointer-events: none;
}

.psc-story-cover__image {
  position: absolute;
  z-index: 0;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0 !important;
  object-fit: cover;
  opacity: .62;
}

.psc-story-cover__grid {
  position: absolute;
  z-index: 1;
  inset: 0;
  opacity: .45;
  background-image:
    linear-gradient(rgba(173, 205, 229, .08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(173, 205, 229, .08) 1px, transparent 1px);
  background-size: 34px 34px;
  mask-image: linear-gradient(115deg, #000, transparent 72%);
  -webkit-mask-image: linear-gradient(115deg, #000, transparent 72%);
}

.psc-story-cover__signal {
  position: absolute;
  z-index: 2;
  left: 24px;
  top: 28px;
  width: 46%;
  height: 2px;
  background: linear-gradient(90deg, var(--psc-story-accent), transparent);
  transform: rotate(-8deg);
  transform-origin: left;
  box-shadow: 0 0 18px var(--psc-story-soft);
}

.psc-story-cover__topic,
.psc-story-cover__index,
.psc-story-cover__glyph {
  position: absolute;
  z-index: 2;
}

.psc-story-cover__topic {
  left: 22px;
  bottom: 18px;
  color: rgba(238, 245, 251, .76);
  font-size: .66rem;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.psc-story-cover__index {
  right: 22px;
  bottom: 15px;
  color: rgba(255, 255, 255, .9);
  font-size: clamp(2.6rem, 5vw, 5rem);
  font-weight: 800;
  line-height: .78;
  letter-spacing: -.08em;
}

.psc-story-cover__glyph {
  display: grid;
  place-items: center;
  right: 23px;
  top: 20px;
  width: 58px;
  height: 58px;
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: 17px;
  background: rgba(6, 16, 26, .5);
  color: var(--psc-story-accent);
  box-shadow: 0 18px 40px -24px #000;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.psc-story-cover__glyph svg {
  width: 30px;
  height: 30px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.psc-story-card__body {
  display: flex;
  min-height: 0;
  flex: 1 1 auto;
  flex-direction: column;
  padding: clamp(22px, 2.4vw, 32px);
}

.psc-story-card__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  color: var(--psc-text-dim);
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .035em;
  text-transform: uppercase;
}

.psc-story-card__category { color: var(--psc-local); }

.psc-story-card__title {
  margin: 16px 0 12px;
  color: var(--psc-white);
  font-size: clamp(1.2rem, 1.35vw, 1.55rem);
  line-height: 1.18;
  letter-spacing: -.035em;
  text-wrap: balance;
  transition: color .2s ease;
}

.psc-story-card:hover .psc-story-card__title,
.psc-story-card:focus-within .psc-story-card__title { color: var(--psc-accent); }

.psc-story-card__excerpt {
  margin: 0;
  color: var(--psc-text-muted);
  font-size: .93rem;
  line-height: 1.62;
}

.psc-story-card__action {
  align-self: flex-start;
  margin-top: auto;
  padding-top: 24px;
  color: var(--psc-accent);
  font-size: .82rem;
  font-weight: 800;
}

.psc-story-card.is-featured .psc-story-cover { min-height: 320px; }
.psc-story-card.is-featured .psc-story-card__body { padding: clamp(28px, 3vw, 42px); }
.psc-story-card.is-featured .psc-story-card__title { max-width: 19ch; font-size: clamp(2rem, 3vw, 3.35rem); line-height: 1.04; }
.psc-story-card.is-featured .psc-story-card__excerpt { max-width: 60ch; font-size: var(--psc-step-0); }

.psc-story-grid--home { margin-top: clamp(28px, 4vw, 48px); margin-bottom: 28px; }
.psc-story-grid--related .psc-story-cover { min-height: 144px; }
.psc-story-grid--related .psc-story-card__body { padding: 22px; }
.psc-story-grid--related .psc-story-card__title { font-size: clamp(1.08rem, 1.1vw, 1.28rem); }
.psc-story-grid--related .psc-story-card__excerpt { font-size: .86rem; }

.psc-journal-empty {
  display: grid;
  justify-items: start;
  gap: 18px;
  max-width: 620px;
  border: 1px solid var(--psc-border);
  border-radius: 18px;
  background: var(--psc-bg-card);
  padding: 28px;
}

.psc-journal-empty p { margin: 0; color: var(--psc-text-muted); }

.psc-journal .pagination { margin-top: clamp(40px, 6vw, 72px); }
.psc-journal .nav-links { justify-content: center; }

/* Single article: the outer stage owns gutters, while the reading column
   retains a stable 760–780px measure at desktop and 4K. */
.psc-article-page {
  padding-top: calc(var(--psc-nav-h) + clamp(52px, 6vw, 96px));
  padding-bottom: clamp(94px, 9vw, 150px);
}

.psc-article-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  justify-content: center;
}

.psc-article-main { min-width: 0; }

.psc-article-header {
  position: relative;
  margin-bottom: clamp(28px, 4vw, 44px);
  padding-bottom: clamp(28px, 3vw, 40px);
  border-bottom: 1px solid var(--psc-border);
}

.psc-article-header::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 132px;
  height: 2px;
  background: linear-gradient(90deg, var(--psc-local), var(--psc-accent));
}

.psc-article-header__topic { width: max-content; }

.psc-article-header h1 {
  max-width: 15ch;
  margin: 20px 0 18px;
  font-size: clamp(2.5rem, 4.7vw, 4.8rem);
  line-height: .98;
  letter-spacing: -.058em;
  text-wrap: balance;
}

.psc-article__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  color: var(--psc-text-dim);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.psc-story-cover--article {
  min-height: clamp(230px, 28vw, 410px);
  margin-bottom: clamp(34px, 5vw, 60px);
  border: 1px solid var(--psc-border);
  border-radius: 22px;
  box-shadow: 0 32px 86px -54px rgba(32, 215, 242, .38);
}

.psc-story-cover--article .psc-story-cover__glyph {
  right: clamp(24px, 4vw, 48px);
  top: clamp(24px, 4vw, 46px);
  width: clamp(68px, 8vw, 104px);
  height: clamp(68px, 8vw, 104px);
  border-radius: 24px;
}

.psc-story-cover--article .psc-story-cover__glyph svg { width: 48%; height: 48%; }
.psc-story-cover--article .psc-story-cover__topic { left: clamp(24px, 4vw, 48px); bottom: clamp(24px, 4vw, 42px); }
.psc-story-cover--article .psc-story-cover__signal { left: clamp(24px, 4vw, 48px); top: clamp(34px, 5vw, 62px); }

.psc-article-prose {
  max-width: none !important;
  margin: 0;
  font-size: clamp(1.02rem, .98rem + .14vw, 1.16rem);
  line-height: 1.78;
}

.psc-article-prose > h2 { margin-top: 2.45em; }
.psc-article-prose > h3 { margin-top: 2em; }

.psc-article-toc-mobile,
.psc-article-toc,
.psc-article-context {
  border: 1px solid var(--psc-border);
  border-radius: 16px;
  background: rgba(10, 23, 36, .82);
  box-shadow: 0 24px 60px -48px #000;
}

.psc-article-toc-mobile[hidden],
.psc-article-toc[hidden] { display: none !important; }

.psc-article-toc-mobile {
  margin-bottom: 34px;
  padding: 0;
}

.psc-article-toc-mobile summary {
  cursor: pointer;
  padding: 16px 18px;
  color: var(--psc-white);
  font-weight: 750;
}

.psc-article-toc-mobile ol,
.psc-article-toc ol {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.psc-article-toc-mobile ol { padding: 0 18px 18px; }

.psc-article-toc-mobile a,
.psc-article-toc a {
  display: block;
  border-left: 1px solid var(--psc-border);
  padding: 5px 0 5px 12px;
  color: var(--psc-text-muted);
  font-size: .8rem;
  line-height: 1.4;
}

.psc-article-toc-mobile a:hover,
.psc-article-toc-mobile a.is-current,
.psc-article-toc a:hover,
.psc-article-toc a.is-current {
  border-left-color: var(--psc-local);
  color: var(--psc-white);
}

.psc-article-aside { display: none; }

.psc-article-toc {
  max-height: calc(100svh - var(--psc-nav-h) - 118px);
  overflow: auto;
  padding: 20px;
  scrollbar-width: thin;
  scrollbar-color: var(--psc-border-strong) transparent;
}

.psc-article-toc > span {
  display: block;
  margin-bottom: 16px;
  color: var(--psc-local);
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.psc-article-context {
  display: grid;
  gap: 12px;
  padding: 22px;
  background:
    linear-gradient(145deg, rgba(115, 229, 194, .08), transparent 56%),
    rgba(10, 23, 36, .9);
}

.psc-article-context p { margin: 0; color: var(--psc-text-muted); font-size: .86rem; line-height: 1.55; }
.psc-article-context > a { font-size: .8rem; font-weight: 800; }

.psc-related {
  margin-top: clamp(72px, 9vw, 128px);
  padding-top: clamp(54px, 7vw, 88px);
  border-top: 1px solid var(--psc-border);
}

.psc-related__head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(240px, .7fr);
  align-items: end;
  gap: 20px 48px;
  margin-bottom: 34px;
}

.psc-related__head .psc-eyebrow { grid-column: 1 / -1; margin: 0; }
.psc-related__head h2 { margin: 0; font-size: var(--psc-step-2); }
.psc-related__head > p:last-child { margin: 0; color: var(--psc-text-muted); }

.psc-article-navigation {
  display: grid;
  gap: 26px;
  margin-top: clamp(60px, 8vw, 108px);
  padding-top: 34px;
  border-top: 1px solid var(--psc-border);
}

.psc-article-navigation .navigation { margin: 0; }
.psc-article-navigation .nav-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 0; }
.psc-article-navigation .nav-previous,
.psc-article-navigation .nav-next { min-width: 0; }
.psc-article-navigation .nav-next { text-align: right; }

.psc-article-navigation .nav-links a {
  display: block;
  min-height: 100%;
  border: 1px solid var(--psc-border);
  border-radius: 14px;
  background: rgba(15, 32, 49, .62);
  padding: 16px 18px;
  color: var(--psc-text-muted);
  font-size: .84rem;
  font-weight: 700;
  line-height: 1.45;
}

.psc-article-navigation .nav-links a:hover { border-color: var(--psc-accent); color: var(--psc-white); }
.psc-article-navigation__back { justify-self: start; }

.psc-article-main .psc-share { margin-top: clamp(44px, 6vw, 68px); }

@media (min-width: 700px) {
  .psc-story-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .psc-story-grid--archive > .psc-story-card.is-featured { grid-column: 1 / -1; }

  .psc-story-card.is-featured .psc-story-card__link {
    display: grid;
    grid-template-columns: minmax(260px, .88fr) minmax(0, 1.12fr);
  }

  .psc-story-card.is-featured .psc-story-cover {
    min-height: 390px;
    border-right: 1px solid var(--psc-border);
    border-bottom: 0;
  }
}

@media (min-width: 1100px) {
  .psc-story-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .psc-story-grid--archive > .psc-story-card.is-featured {
    grid-column: 1 / -1;
    grid-row: auto;
  }
}

@media (min-width: 1180px) {
  .psc-article-layout {
    grid-template-columns: minmax(0, 780px) minmax(240px, 300px);
    gap: clamp(62px, 6vw, 100px);
  }

  .psc-article-aside {
    position: sticky;
    top: calc(var(--psc-nav-h) + 30px);
    display: grid;
    gap: 14px;
  }

  .psc-article-toc-mobile { display: none !important; }
}

@media (max-width: 860px) {
  .psc-journal-head,
  .psc-related__head { grid-template-columns: minmax(0, 1fr); align-items: start; }
  .psc-journal-head__lead { max-width: 58ch; }
  .psc-related__head .psc-eyebrow { grid-column: auto; }
}

@media (max-width: 699px) {
  .psc-journal { padding-top: calc(var(--psc-nav-h) + 46px); }
  .psc-journal-head { gap: 22px; padding-bottom: 30px; }
  .psc-journal-head h1 { font-size: clamp(2.55rem, 12vw, 3.4rem); }
  .psc-story-topics ul { flex-wrap: nowrap; margin-inline: -18px; padding-inline: 18px; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none; }
  .psc-story-topics ul::-webkit-scrollbar { display: none; }
  .psc-story-topics li { flex: none; scroll-snap-align: start; }
  .psc-story-cover { min-height: 190px; }
  .psc-story-card.is-featured .psc-story-cover { min-height: 220px; }
  .psc-story-card.is-featured .psc-story-card__title { font-size: clamp(1.65rem, 8.2vw, 2.2rem); }
  .psc-story-card.is-featured .psc-story-card__excerpt { font-size: .96rem; }
  .psc-article-header h1 { font-size: clamp(2.35rem, 11.5vw, 3.25rem); }
  .psc-story-cover--article { min-height: 210px; border-radius: 17px; }
  .psc-article-navigation .nav-links { grid-template-columns: minmax(0, 1fr); }
  .psc-article-navigation .nav-next { text-align: left; }
}

@media (min-width: 1800px) {
  .psc-journal-head h1 { font-size: clamp(4.5rem, 2.5vw, 5.6rem); }
  .psc-story-card__title { font-size: clamp(1.35rem, .8vw, 1.7rem); }
  .psc-story-card.is-featured .psc-story-card__title { font-size: clamp(2.8rem, 1.7vw, 3.7rem); }
  .psc-article-header h1 { font-size: clamp(4rem, 2.1vw, 5rem); }
  .psc-article-prose { font-size: clamp(1.12rem, .58vw, 1.28rem); }
}

@media (prefers-reduced-motion: reduce) {
  .psc-story-card,
  .psc-story-topics a { transition: none !important; }
  .psc-story-card:hover,
  .psc-story-card:focus-within,
  .psc-story-topics a:hover { transform: none; }
}

@media print {
  .psc-story-topics,
  .psc-article-aside,
  .psc-article-toc-mobile,
  .psc-related,
  .psc-article-navigation,
  .psc-share { display: none !important; }
  .psc-article-shell { width: 100%; padding: 0; }
  .psc-article-layout { display: block; }
}

/* ============================================================
   2.2 QUIET INFRASTRUCTURE — product-led depth and scale
   ============================================================ */

body {
  min-width: 320px;
  background:
    radial-gradient(1100px 760px at 88% -12%, rgba(32, 215, 242, 0.09), transparent 62%),
    radial-gradient(900px 640px at -10% 42%, rgba(115, 229, 194, 0.055), transparent 66%),
    var(--psc-bg);
  font-size: var(--psc-step-0);
}

.psc-container {
  padding-left: clamp(20px, 3vw, 56px);
  padding-right: clamp(20px, 3vw, 56px);
}

.psc-section {
  padding: clamp(76px, 8vw, 132px) 0;
  border-top-color: var(--psc-border);
}

.psc-section--compact {
  padding: clamp(44px, 5vw, 76px) 0;
}

.psc-section__head {
  max-width: 760px;
  margin-bottom: clamp(28px, 4vw, 50px);
}

.psc-section__head--wide {
  max-width: 920px;
}

.psc-section__head--center {
  margin-right: auto;
  margin-left: auto;
  text-align: center;
}

.psc-section__head--center .psc-eyebrow {
  justify-content: center;
}

.psc-section__head--center .psc-section__lead {
  margin-right: auto;
  margin-left: auto;
}

.psc-section h2,
.psc-cta h2 {
  font-size: var(--psc-step-3);
  line-height: 1.02;
  letter-spacing: -0.048em;
}

.psc-section__lead,
.psc-page-lead {
  font-size: var(--psc-step-1);
  line-height: 1.6;
}

.psc-eyebrow {
  gap: 10px;
  color: var(--psc-local);
  font-size: clamp(0.72rem, 0.68rem + 0.12vw, 0.84rem);
  letter-spacing: 0.11em;
}

.psc-eyebrow::before {
  background: var(--psc-local);
  box-shadow: 0 0 14px rgba(115, 229, 194, 0.38);
}

/* Pre-paint targets are injected synchronously by the header bootstrap from
   the same selector contract consumed by motion.js. No JS means no prehide. */

.psc-motion-ready .psc-reveal {
  opacity: 0;
  translate: 0 22px;
  scale: 1;
  will-change: opacity, translate, scale;
}

.psc-motion-ready .psc-reveal--left { translate: -18px 12px; }
.psc-motion-ready .psc-reveal--right { translate: 18px 12px; }
.psc-motion-ready .psc-reveal--visual { translate: 28px 0; scale: .985; }

.psc-motion-ready .psc-reveal.is-visible {
  animation: psc-reveal-in-22 760ms cubic-bezier(.2, .72, .22, 1) forwards;
  animation-delay: var(--psc-reveal-delay, 0ms);
}

@keyframes psc-reveal-in-22 {
  to { opacity: 1; translate: 0 0; scale: 1; }
}

/* Shell */
.psc-nav {
  background: rgba(6, 16, 26, 0.7);
  border-bottom-color: rgba(173, 205, 229, 0.08);
  backdrop-filter: saturate(150%) blur(20px);
  -webkit-backdrop-filter: saturate(150%) blur(20px);
}

.psc-nav.is-scrolled {
  background: rgba(6, 16, 26, 0.93);
  border-bottom-color: var(--psc-border);
  box-shadow: 0 18px 48px -38px rgba(0, 0, 0, .9);
}

.psc-logo__mark {
  background: linear-gradient(145deg, #f8fcff 0%, var(--psc-accent) 58%, var(--psc-local) 100%);
  box-shadow: 0 0 22px -5px var(--psc-accent-glow);
}

.psc-btn {
  min-height: 46px;
  padding: 12px 23px;
  border-radius: 12px;
}

.psc-btn--primary {
  background: linear-gradient(135deg, #58e8f8 0%, var(--psc-accent) 48%, #67e2d3 118%);
  box-shadow: 0 12px 34px -14px var(--psc-accent-glow), inset 0 1px rgba(255, 255, 255, .42);
}

.psc-btn--ghost {
  background: rgba(9, 23, 37, .72);
  border-color: var(--psc-border-strong);
}

/* Hero */
.psc-hero {
  min-height: min(1080px, 100svh);
  padding: calc(var(--psc-nav-h) + clamp(58px, 7vw, 112px)) 0 clamp(110px, 10vw, 154px);
  border-bottom: 1px solid var(--psc-border);
}

.psc-hero__bg {
  background:
    radial-gradient(880px 700px at 76% 30%, rgba(32, 215, 242, .15), transparent 65%),
    radial-gradient(720px 560px at 18% 84%, rgba(115, 229, 194, .07), transparent 68%),
    linear-gradient(145deg, #06101a 0%, #07131f 48%, #06101a 100%);
}

.psc-hero__grid {
  background-image:
    linear-gradient(to right, rgba(173, 205, 229, .055) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(173, 205, 229, .055) 1px, transparent 1px);
  background-size: clamp(46px, 4vw, 72px) clamp(46px, 4vw, 72px);
  mask-image: radial-gradient(ellipse 88% 78% at 53% 42%, #000 26%, transparent 84%);
  -webkit-mask-image: radial-gradient(ellipse 88% 78% at 53% 42%, #000 26%, transparent 84%);
}

.psc-hero__layout {
  gap: clamp(54px, 6vw, 112px);
}

.psc-hero__col {
  max-width: 720px;
}

.psc-hero h1 {
  max-width: 12ch;
  margin-top: 24px;
  font-size: var(--psc-step-4);
  line-height: .96;
  letter-spacing: -.065em;
}

.psc-hero h1 .psc-grad {
  background: linear-gradient(105deg, var(--psc-accent) 10%, var(--psc-local) 85%);
  -webkit-background-clip: text;
  background-clip: text;
}

.psc-hero__sub {
  max-width: 57ch;
  margin-top: 28px;
  color: #c1ced9;
  font-size: var(--psc-step-1);
  line-height: 1.62;
}

.psc-hero__actions {
  margin-top: 34px;
}

.psc-hero__status {
  display: grid;
  gap: 12px;
  max-width: 680px;
  margin-top: 34px;
  padding: 20px 22px;
  border: 1px solid var(--psc-border);
  border-left: 3px solid var(--psc-home);
  border-radius: 0 var(--psc-radius) var(--psc-radius) 0;
  background: linear-gradient(135deg, rgba(20, 42, 63, .82), rgba(8, 23, 36, .72));
  box-shadow: var(--psc-shadow);
}

.psc-hero__status-head {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.psc-status-pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  width: fit-content;
  padding: 6px 10px;
  border: 1px solid var(--psc-border-strong);
  border-radius: 999px;
  background: rgba(6, 16, 26, .72);
  color: var(--psc-text);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .05em;
  line-height: 1.1;
  text-transform: uppercase;
}

.psc-status-pill::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--psc-accent);
  box-shadow: 0 0 12px var(--psc-accent-glow);
}

.psc-status-pill--local {
  border-color: rgba(115, 229, 194, .34);
  background: var(--psc-local-soft);
  color: var(--psc-local);
}

.psc-status-pill--local::before { background: var(--psc-local); }
.psc-status-pill--home { border-color: rgba(241, 183, 104, .36); background: var(--psc-home-soft); color: #ffd69c; }
.psc-status-pill--home::before { background: var(--psc-home); box-shadow: 0 0 12px rgba(241, 183, 104, .35); }

.psc-hero__status p {
  max-width: 72ch;
  margin: 0;
  color: var(--psc-text-muted);
  font-size: clamp(.82rem, .78rem + .12vw, .94rem);
  line-height: 1.55;
}

.psc-hero__status a {
  width: fit-content;
  color: var(--psc-local);
  font-size: .84rem;
  font-weight: 750;
}

.psc-hero__scroll {
  color: var(--psc-text-dim);
}

/* Hero product topology */
.psc-hero__visual {
  min-width: 0;
}

.psc-showcase.psc-topology {
  width: min(100%, 760px);
  min-height: 650px;
  padding: 20px;
  border: 1px solid var(--psc-border);
  border-radius: var(--psc-radius-lg);
  background:
    linear-gradient(rgba(173, 205, 229, .04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(173, 205, 229, .04) 1px, transparent 1px),
    linear-gradient(155deg, rgba(15, 32, 49, .92), rgba(6, 16, 26, .82));
  background-size: 44px 44px, 44px 44px, auto;
  box-shadow: 0 42px 100px -58px rgba(0, 0, 0, .95), inset 0 1px rgba(255, 255, 255, .05);
  overflow: hidden;
}

.psc-showcase__glow {
  inset: -12% -8% 0;
  background: radial-gradient(60% 52% at 50% 43%, rgba(32, 215, 242, .2), transparent 72%);
  filter: blur(46px);
}

.psc-topology__bar {
  position: relative;
  z-index: 4;
  width: 100%;
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: center;
  padding: 5px 2px 16px;
  border-bottom: 1px solid var(--psc-border);
}

.psc-topology__bar span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--psc-local);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.psc-topology__bar i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--psc-local);
  box-shadow: 0 0 14px rgba(115, 229, 194, .5);
}

.psc-topology__bar small,
.psc-topology__footnote {
  color: var(--psc-text-dim);
  font-size: .72rem;
}

.psc-topology__stage {
  position: relative;
  width: 100%;
  height: 520px;
}

.psc-topology__paths {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.psc-topology__path {
  fill: none;
  stroke: url(#nnPathCyan);
  stroke-width: 2;
  stroke-dasharray: 7 9;
  animation: psc-data-path 9s linear infinite;
}

.psc-topology__path--local { stroke: var(--psc-local); stroke-opacity: .56; }

@keyframes psc-data-path { to { stroke-dashoffset: -160; } }

.psc-topology__boundary {
  position: absolute;
  inset: 38px 14px 28px 192px;
  border: 1px dashed rgba(115, 229, 194, .34);
  border-radius: 26px;
  pointer-events: none;
}

.psc-topology__boundary span {
  position: absolute;
  top: -12px;
  right: 22px;
  padding: 3px 10px;
  border-radius: 999px;
  background: var(--psc-bg-card);
  color: var(--psc-local);
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.psc-topology__node {
  position: absolute;
  z-index: 3;
  display: grid;
  grid-template-columns: 38px 1fr;
  gap: 1px 11px;
  min-width: 148px;
  padding: 12px 14px;
  border: 1px solid var(--psc-border);
  border-radius: 14px;
  background: rgba(8, 23, 36, .94);
  box-shadow: 0 20px 50px -34px rgba(0, 0, 0, .9);
}

.psc-topology__node svg {
  grid-row: 1 / 3;
  align-self: center;
  width: 32px;
  height: 32px;
  fill: none;
  stroke: var(--psc-accent);
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.psc-topology__node strong { color: var(--psc-white); font-size: .82rem; }
.psc-topology__node small { color: var(--psc-text-dim); font-size: .67rem; }
.psc-topology__node--upstream { left: 0; top: 208px; }
.psc-topology__node--home { right: 6px; top: 68px; }
.psc-topology__node--server { right: 6px; bottom: 54px; }
.psc-topology__node--home svg { stroke: var(--psc-home); }
.psc-topology__node--server svg { stroke: var(--psc-local); }

.psc-cube--hero {
  position: absolute;
  z-index: 3;
  left: 51%;
  top: 50%;
  translate: -50% -50%;
  gap: 2px;
}

.psc-cube--hero svg {
  width: clamp(230px, 19vw, 300px);
  height: auto;
  filter: drop-shadow(0 32px 60px rgba(0, 0, 0, .62)) drop-shadow(0 0 34px rgba(32, 215, 242, .22));
}

.psc-cube--hero strong {
  color: var(--psc-white);
  font-size: 1.05rem;
  letter-spacing: -.02em;
}

.psc-cube--hero small {
  color: var(--psc-local);
  font-size: .68rem;
  font-weight: 750;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.psc-chat--hero {
  position: absolute;
  z-index: 5;
  right: 28px;
  bottom: 20px;
  width: min(310px, 48%);
  border-color: var(--psc-border-strong);
  box-shadow: 0 28px 64px -34px rgba(0, 0, 0, .92);
}

.psc-chat--hero .psc-chat__bar { padding: 10px 12px; }
.psc-chat--hero .psc-chat__avatar { width: 30px; height: 30px; font-size: 13px; }
.psc-chat--hero .psc-chat__id strong { font-size: 12px; }
.psc-chat--hero .psc-chat__id small { font-size: 9px; }
.psc-chat--hero .psc-chat__body { gap: 8px; padding: 10px 12px 12px; }
.psc-chat--hero .psc-msg { padding: 8px 10px 17px; font-size: 10.5px; line-height: 1.35; }
.psc-chat--hero .psc-msg__path { font-size: 9px; }
.psc-chat--hero .psc-msg__t { right: 8px; bottom: 4px; font-size: 8px; }

.psc-topology__footnote {
  position: absolute;
  z-index: 4;
  left: 24px;
  bottom: 13px;
  max-width: 210px;
  margin: 0;
}

/* Proof rail */
.psc-proof-section {
  position: relative;
  z-index: 2;
  padding: 0 0 clamp(44px, 5vw, 72px);
  background: linear-gradient(180deg, rgba(10, 23, 36, .92), var(--psc-bg));
}

.psc-proof-rail {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: -36px;
  border: 1px solid var(--psc-border);
  border-radius: var(--psc-radius-lg);
  background: rgba(10, 23, 36, .94);
  box-shadow: var(--psc-shadow);
  overflow: hidden;
}

.psc-proof-rail > div {
  position: relative;
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 24px 24px 24px 46px;
}

.psc-proof-rail > div + div { border-left: 1px solid var(--psc-border); }

.psc-proof-rail__mark {
  position: absolute;
  left: 24px;
  top: 31px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--psc-accent);
  box-shadow: 0 0 14px var(--psc-accent-glow);
}

.psc-proof-rail__mark--local { background: var(--psc-local); }
.psc-proof-rail__mark--home { background: var(--psc-home); }
.psc-proof-rail strong { color: var(--psc-white); font-size: .9rem; }
.psc-proof-rail small { color: var(--psc-text-dim); font-size: .78rem; line-height: 1.45; }

/* Architecture */
.psc-section--architecture {
  border-top: 0;
  background:
    radial-gradient(760px 540px at 82% 48%, rgba(32, 215, 242, .09), transparent 68%),
    linear-gradient(180deg, var(--psc-bg), #071522);
}

.psc-architecture {
  display: grid;
  gap: clamp(52px, 7vw, 110px);
  align-items: center;
}

.psc-architecture__copy { max-width: 690px; }
.psc-architecture__copy h2 { margin-top: 18px; }
.psc-architecture__copy .psc-section__lead { max-width: 62ch; }

.psc-architecture__steps {
  display: grid;
  gap: 0;
  margin: 34px 0 0;
  padding: 0;
  list-style: none;
}

.psc-architecture__steps li {
  position: relative;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 16px;
  padding: 0 0 26px;
}

.psc-architecture__steps li:not(:last-child)::after {
  content: "";
  position: absolute;
  left: 20px;
  top: 35px;
  bottom: 3px;
  width: 1px;
  background: linear-gradient(var(--psc-accent), rgba(32, 215, 242, .08));
}

.psc-architecture__steps li > span {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(32, 215, 242, .36);
  border-radius: 50%;
  background: var(--psc-bg-elev);
  color: var(--psc-accent);
  font-size: .72rem;
  font-weight: 800;
}

.psc-architecture__steps strong { color: var(--psc-white); font-size: 1rem; }
.psc-architecture__steps p { max-width: 58ch; margin: 4px 0 0; color: var(--psc-text-muted); font-size: .92rem; }
.psc-architecture__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 10px; }

.psc-architecture__visual {
  min-width: 0;
}

.psc-blueprint {
  position: relative;
  min-height: 590px;
  border: 1px solid var(--psc-border);
  border-radius: var(--psc-radius-lg);
  background:
    linear-gradient(rgba(173, 205, 229, .05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(173, 205, 229, .05) 1px, transparent 1px),
    linear-gradient(145deg, rgba(15, 32, 49, .96), rgba(7, 21, 34, .96));
  background-size: 38px 38px, 38px 38px, auto;
  box-shadow: var(--psc-shadow), inset 0 1px rgba(255, 255, 255, .04);
  overflow: hidden;
}

.psc-blueprint::before {
  content: "";
  position: absolute;
  inset: 72px 34px 42px;
  border: 1px dashed rgba(115, 229, 194, .28);
  border-radius: 22px;
}

.psc-blueprint__head {
  display: flex;
  justify-content: space-between;
  padding: 22px 24px;
  border-bottom: 1px solid var(--psc-border);
  color: var(--psc-local);
  font-size: .74rem;
  font-weight: 800;
  letter-spacing: .1em;
}

.psc-blueprint__head small { color: var(--psc-text-dim); letter-spacing: .04em; }

.psc-blueprint > svg {
  position: absolute;
  inset: 70px 0 40px;
  width: 100%;
  height: calc(100% - 110px);
  fill: none;
  stroke: var(--psc-accent);
  stroke-width: 1.8;
  stroke-dasharray: 5 8;
  opacity: .5;
}

.psc-blueprint__core,
.psc-blueprint__room {
  position: absolute;
  z-index: 2;
  display: grid;
  gap: 3px;
  border: 1px solid var(--psc-border-strong);
  background: rgba(8, 23, 36, .94);
  box-shadow: 0 22px 48px -36px #000;
}

.psc-blueprint__core {
  left: 50%;
  top: 50%;
  translate: -50% -44%;
  place-items: center;
  width: 152px;
  height: 152px;
  border-color: rgba(32, 215, 242, .54);
  border-radius: 32px;
  background: linear-gradient(145deg, rgba(20, 42, 63, .98), rgba(6, 16, 26, .98));
}

.psc-blueprint__core > span {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 14px;
  background: linear-gradient(145deg, var(--psc-accent), var(--psc-local));
  color: #04141a;
  font-size: 1.35rem;
  font-weight: 900;
}

.psc-blueprint__core strong { color: var(--psc-white); }
.psc-blueprint__core small { color: var(--psc-local); font-size: .72rem; }

.psc-blueprint__room {
  width: 190px;
  padding: 16px;
  border-radius: 15px;
}

.psc-blueprint__room span { color: var(--psc-text-dim); font-size: .72rem; font-weight: 750; text-transform: uppercase; }
.psc-blueprint__room strong { color: var(--psc-text); font-size: .82rem; }
.psc-blueprint__room i { width: 8px; height: 8px; margin-top: 7px; border-radius: 50%; background: var(--psc-local); box-shadow: 0 0 12px rgba(115, 229, 194, .44); }
.psc-blueprint__room--living { left: 42px; top: 110px; }
.psc-blueprint__room--energy { left: 42px; bottom: 68px; }
.psc-blueprint__room--office { right: 42px; top: 110px; }
.psc-blueprint__room--entry { right: 42px; bottom: 68px; }
.psc-blueprint__room--living i,
.psc-blueprint__room--entry i { background: var(--psc-home); box-shadow: 0 0 12px rgba(241, 183, 104, .4); }
.psc-blueprint > p { position: absolute; left: 42px; bottom: 15px; margin: 0; color: var(--psc-text-dim); font-size: .68rem; }

/* Outcomes, beta and journal */
.psc-section--outcomes {
  background: linear-gradient(180deg, #071522, var(--psc-bg));
}

.psc-outcome-grid { align-items: stretch; }

.psc-card,
.psc-postcard,
.psc-tier,
.psc-member,
.psc-pricing-decision__item,
.psc-pricing-next,
.psc-demo-next a,
.psc-advisor-links a {
  border-color: var(--psc-border);
  background: linear-gradient(155deg, rgba(20, 42, 63, .82), rgba(10, 23, 36, .92));
  box-shadow: 0 24px 60px -48px rgba(0, 0, 0, .92), inset 0 1px rgba(255, 255, 255, .035);
}

.psc-card {
  position: relative;
  padding: clamp(24px, 2.4vw, 36px);
  overflow: hidden;
}

.psc-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 2px;
  background: linear-gradient(transparent, rgba(32, 215, 242, .72), transparent);
  opacity: .55;
}

.psc-card:hover {
  border-color: rgba(32, 215, 242, .44);
  transform: translateY(-4px);
  box-shadow: 0 28px 70px -42px rgba(32, 215, 242, .28);
}

.psc-card__icon {
  width: 54px;
  height: 54px;
  border: 1px solid rgba(32, 215, 242, .18);
  border-radius: 15px;
  background: var(--psc-accent-soft);
}

.psc-card__icon svg,
.psc-card--post__glyph svg {
  width: 28px;
  height: 28px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.psc-outcome-card { min-height: 300px; }
.psc-outcome-card h3 { margin-top: auto; font-size: var(--psc-step-1); }
.psc-outcome-card--local .psc-card__icon { color: var(--psc-local); border-color: rgba(115, 229, 194, .25); background: var(--psc-local-soft); }
.psc-outcome-card--home .psc-card__icon { color: var(--psc-home); border-color: rgba(241, 183, 104, .26); background: var(--psc-home-soft); }
.psc-outcome-card--home::before { background: linear-gradient(transparent, var(--psc-home), transparent); }

.psc-section--beta {
  background:
    radial-gradient(720px 340px at 12% 48%, rgba(241, 183, 104, .08), transparent 70%),
    var(--psc-bg-elev);
}

.psc-beta-stage {
  display: grid;
  gap: clamp(34px, 5vw, 74px);
  align-items: center;
  padding: clamp(30px, 4vw, 58px);
  border: 1px solid var(--psc-border);
  border-radius: var(--psc-radius-lg);
  background: linear-gradient(135deg, rgba(20, 42, 63, .92), rgba(8, 23, 36, .96));
  box-shadow: var(--psc-shadow), inset 0 1px rgba(255, 255, 255, .04);
}

.psc-beta-stage h2 { max-width: 20ch; margin-top: 18px; font-size: var(--psc-step-3); }
.psc-beta-stage__copy > p { max-width: 66ch; color: var(--psc-text-muted); }
.psc-beta-stage__actions { display: flex; flex-wrap: wrap; gap: 18px; align-items: center; margin-top: 26px; }

.psc-beta-stage__track {
  position: relative;
  display: grid;
  gap: 16px;
}

.psc-beta-stage__track::before {
  content: "";
  position: absolute;
  left: 19px;
  top: 30px;
  bottom: 30px;
  width: 1px;
  background: linear-gradient(var(--psc-home), var(--psc-border), var(--psc-border));
}

.psc-beta-stage__track > div {
  position: relative;
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 2px 14px;
  padding: 14px 16px;
  border: 1px solid var(--psc-border);
  border-radius: 14px;
  background: rgba(6, 16, 26, .72);
}

.psc-beta-stage__track span {
  grid-row: 1 / 3;
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border: 1px solid var(--psc-border-strong);
  border-radius: 50%;
  background: var(--psc-bg-card);
  color: var(--psc-text-dim);
  font-size: .7rem;
  font-weight: 800;
}

.psc-beta-stage__track .is-current { border-color: rgba(241, 183, 104, .32); background: var(--psc-home-soft); }
.psc-beta-stage__track .is-current span { color: var(--psc-home); border-color: rgba(241, 183, 104, .5); }
.psc-beta-stage__track strong { color: var(--psc-white); font-size: .9rem; }
.psc-beta-stage__track small { color: var(--psc-text-dim); font-size: .76rem; }

.psc-section--journal {
  background:
    radial-gradient(760px 400px at 88% 0%, rgba(32, 215, 242, .075), transparent 68%),
    var(--psc-bg);
}

.psc-card--post__thumb {
  min-height: 150px;
  background:
    radial-gradient(circle at 70% 26%, rgba(32, 215, 242, .2), transparent 34%),
    linear-gradient(135deg, #0f2031, #071522);
}

.psc-card--post__glyph {
  color: var(--psc-local);
  font-size: 0;
}

.psc-card--post__glyph svg { width: 58px; height: 58px; }

.psc-home-waitlist {
  background:
    radial-gradient(760px 420px at 50% 0%, rgba(32, 215, 242, .14), transparent 65%),
    linear-gradient(180deg, var(--psc-bg-elev), #08131f);
}

.psc-home-waitlist .psc-container--narrow { max-width: 980px; }
.psc-home-waitlist .psc-section__lead { max-width: 760px; font-size: 1rem; }

/* Inner pages and interactive product surfaces */
main.psc-page,
main.psc-blog,
main.psc-single {
  position: relative;
  isolation: isolate;
  border-top: 0;
  background:
    radial-gradient(880px 480px at 78% 4%, rgba(32, 215, 242, .1), transparent 66%),
    linear-gradient(180deg, #071522 0, var(--psc-bg) 430px);
}

main.psc-page::before,
main.psc-blog::before,
main.psc-single::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0 0 auto;
  height: 410px;
  border-bottom: 1px solid rgba(173, 205, 229, .09);
  background-image:
    linear-gradient(rgba(173, 205, 229, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(173, 205, 229, .035) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: linear-gradient(#000, transparent);
  -webkit-mask-image: linear-gradient(#000, transparent);
}

.psc-page .psc-section__head,
.psc-blog .psc-section__head,
.psc-single .psc-section__head {
  max-width: 980px;
  min-height: 180px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  margin-bottom: clamp(46px, 6vw, 76px);
  padding-bottom: 30px;
  border-bottom: 1px solid var(--psc-border);
}

.psc-page h1,
.psc-single h1,
.psc-blog h1 {
  max-width: 24ch;
  font-size: var(--psc-step-3);
  line-height: 1.02;
  letter-spacing: -.05em;
  text-wrap: balance;
}

.psc-prose {
  font-size: var(--psc-step-0);
}

.psc-prose:not(.psc-prose--wide) { max-width: 980px; }
.psc-prose h2 { font-size: var(--psc-step-2); line-height: 1.08; }
.psc-prose h3 { font-size: var(--psc-step-1); }

.psc-prose blockquote,
.psc-disclaimer {
  border: 1px solid rgba(241, 183, 104, .26);
  border-left: 3px solid var(--psc-home);
  border-radius: 0 14px 14px 0;
  background: var(--psc-home-soft);
  color: var(--psc-text-muted);
  font-style: normal;
}

.psc-disclaimer { padding: 16px 18px; }

.psc-prose table {
  border-radius: 14px;
  background: rgba(10, 23, 36, .66);
  box-shadow: 0 24px 60px -50px #000;
  overflow: hidden;
}

.psc-prose thead th { background: var(--psc-bg-raised); }

.psc-demo,
.psc-advisor,
.psc-tco,
.psc-energy,
.psc-compat,
.psc-usecases__intro {
  border-color: var(--psc-border-strong);
  border-radius: var(--psc-radius-lg);
  background:
    radial-gradient(620px 300px at 88% 0%, rgba(32, 215, 242, .095), transparent 68%),
    linear-gradient(155deg, rgba(20, 42, 63, .92), rgba(8, 23, 36, .96));
  box-shadow: var(--psc-shadow), inset 0 1px rgba(255, 255, 255, .04);
}

.psc-demo__viewport,
.psc-advisor__form,
.psc-advisor__result,
.psc-tco__form,
.psc-tco__results,
.psc-energy__form,
.psc-energy__result {
  border-color: var(--psc-border);
  background: rgba(6, 16, 26, .72);
}

.psc-demo__surface {
  background:
    radial-gradient(90% 90% at 50% 0%, rgba(32, 215, 242, .13), transparent 62%),
    var(--psc-bg-card);
}

.psc-advisor__privacy,
.psc-energy__privacy,
.psc-demo__signal,
.psc-tco__note {
  border-color: rgba(115, 229, 194, .28);
  background: var(--psc-local-soft);
}

.psc-advisor__privacy strong,
.psc-energy__privacy strong,
.psc-demo__signal strong,
.psc-tco__note strong { color: var(--psc-local); }

.psc-advisor__options button,
.psc-energy__group label,
.psc-demo__tab {
  background: rgba(15, 32, 49, .78);
}

/* Tablet-safe demo: never activate the nested split before it can retain a
   useful copy measure. The two-column desktop composition starts at 1180px. */
.psc-demo__layout,
.psc-demo__panel {
  grid-template-columns: minmax(0, 1fr);
}

.psc-demo__panel-copy,
.psc-demo__surface,
.psc-demo__viewport { min-width: 0; }

@media (min-width: 760px) and (max-width: 1179px) {
  .psc-demo__steps {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
  }

  .psc-demo__tab {
    min-width: 0;
    padding: 10px 8px;
    text-align: center;
    line-height: 1.2;
  }

  .psc-demo__tab span {
    display: flex;
    margin: 0 auto 7px;
  }
}

@media (min-width: 1180px) {
  .psc-demo__layout { grid-template-columns: minmax(190px, 240px) minmax(0, 1fr); }
  .psc-demo__panel { grid-template-columns: minmax(260px, .88fr) minmax(320px, 1.12fr); }
}

.psc-pricing {
  gap: clamp(18px, 2.2vw, 30px);
  align-items: stretch;
}

.psc-tier {
  height: 100%;
  padding: clamp(26px, 2.4vw, 38px);
  border-radius: var(--psc-radius-lg);
}

.psc-tier--featured {
  border-color: rgba(32, 215, 242, .68);
  background:
    radial-gradient(460px 260px at 50% 0%, rgba(32, 215, 242, .12), transparent 70%),
    linear-gradient(155deg, rgba(20, 42, 63, .96), rgba(8, 23, 36, .98));
  box-shadow: 0 0 0 1px rgba(32, 215, 242, .18), 0 32px 80px -48px rgba(32, 215, 242, .34);
}

.psc-tier__price { font-size: clamp(2.25rem, 3.5vw, 3.4rem); }

.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form input[type="number"],
.wpcf7-form select,
.wpcf7-form textarea,
.psc-newsletter form.psc-newsletter__form input[type="email"] {
  border-color: var(--psc-border);
  background: rgba(6, 16, 26, .82);
}

/* Footer */
.psc-footer {
  padding: clamp(58px, 6vw, 92px) 0 34px;
  background:
    radial-gradient(700px 360px at 14% 0%, rgba(32, 215, 242, .075), transparent 70%),
    #081521;
}

.psc-footer__inner { gap: clamp(38px, 5vw, 74px); }
.psc-footer__brand p { max-width: 360px; }
.psc-footer__nav { gap: clamp(22px, 3vw, 46px); }
.psc-footer__group h2 { color: var(--psc-local); letter-spacing: .07em; }
.psc-footer__group ul { gap: 9px; }

/* Mobile/tablet shell */
@media (max-width: 1099px) {
  .psc-hero {
    min-height: auto;
    padding-top: calc(var(--psc-nav-h) + 68px);
  }

  .psc-hero__layout { grid-template-columns: minmax(0, 1fr); }
  .psc-hero__col { max-width: 820px; }
  .psc-hero h1 { max-width: 12ch; }
  .psc-hero__visual { width: 100%; }
  .psc-showcase.psc-topology { width: min(100%, 820px); margin: 0 auto; }

  .psc-architecture { grid-template-columns: minmax(0, 1fr); }
  .psc-architecture__copy { max-width: 820px; }
  .psc-architecture__visual { width: min(100%, 820px); }

  .psc-beta-stage { grid-template-columns: minmax(0, 1fr); }
  .psc-beta-stage__track { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .psc-beta-stage__track::before { left: 10%; right: 10%; top: 34px; bottom: auto; width: auto; height: 1px; }
  .psc-beta-stage__track > div { grid-template-columns: 40px minmax(0, 1fr); }
}

@media (min-width: 1100px) {
  .psc-hero__layout { grid-template-columns: minmax(0, .92fr) minmax(540px, 1.08fr); align-items: center; }
  .psc-architecture { grid-template-columns: minmax(0, .88fr) minmax(560px, 1.12fr); }
  .psc-beta-stage { grid-template-columns: minmax(0, 1.25fr) minmax(360px, .75fr); }
}

@media (max-width: 979px) {
  .psc-nav__links {
    inset: var(--psc-nav-h) 0 0;
    width: 100%;
    height: calc(100vh - var(--psc-nav-h));
    height: calc(100dvh - var(--psc-nav-h));
    max-height: none;
    gap: 2px;
    padding: clamp(28px, 6vw, 52px) clamp(24px, 6vw, 52px) 44px;
    background:
      radial-gradient(640px 420px at 82% 0%, rgba(32, 215, 242, .12), transparent 70%),
      rgba(6, 16, 26, .985);
    border-bottom: 0;
    box-shadow: none;
  }

  .psc-nav__links a {
    padding: 10px 0;
    color: var(--psc-text-muted);
    font-size: clamp(1.15rem, 3vw, 1.45rem);
    font-weight: 650;
  }
}

@media (max-width: 759px) {
  .psc-proof-rail { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .psc-proof-rail > div + div { border-left: 0; }
  .psc-proof-rail > div:nth-child(even) { border-left: 1px solid var(--psc-border); }
  .psc-proof-rail > div:nth-child(n + 3) { border-top: 1px solid var(--psc-border); }

  .psc-beta-stage__track { grid-template-columns: minmax(0, 1fr); }
  .psc-beta-stage__track::before { left: 19px; right: auto; top: 30px; bottom: 30px; width: 1px; height: auto; }

  .psc-blueprint { min-height: 700px; }
  .psc-blueprint::before { inset: 72px 20px 42px; }
  .psc-blueprint__core { top: 50%; }
  .psc-blueprint__room { width: calc(50% - 38px); }
  .psc-blueprint__room--living { left: 24px; top: 98px; }
  .psc-blueprint__room--office { right: 24px; top: 98px; }
  .psc-blueprint__room--energy { left: 24px; bottom: 74px; }
  .psc-blueprint__room--entry { right: 24px; bottom: 74px; }
}

/* Let the final item in an odd three-card group use the tablet row instead of
   leaving an accidental empty column beside it. */
@media (min-width: 760px) and (max-width: 999px) {
  .psc-grid--3 > :last-child:nth-child(odd) { grid-column: 1 / -1; }
}

@media (max-width: 599px) {
  .psc-container,
  .psc-nav__inner { padding-left: 18px; padding-right: 18px; }

  .psc-hero { padding-top: calc(var(--psc-nav-h) + 42px); padding-bottom: 94px; }
  .psc-hero__layout { gap: 44px; }
  .psc-hero h1 { font-size: clamp(2.55rem, 12.4vw, 3.55rem); }
  .psc-hero__sub { font-size: 1.03rem; }
  .psc-hero__status { padding: 17px; }

  .psc-showcase.psc-topology { min-height: 0; padding: 16px; border-radius: 22px; }
  .psc-topology__bar { align-items: flex-start; flex-direction: column; gap: 4px; }
  .psc-topology__stage { height: 450px; }
  .psc-topology__boundary { inset: 28px 4px 20px 102px; }
  .psc-topology__node { grid-template-columns: 28px 1fr; min-width: 116px; padding: 9px 10px; }
  .psc-topology__node svg { width: 24px; height: 24px; }
  .psc-topology__node strong { font-size: .7rem; }
  .psc-topology__node small { font-size: .57rem; }
  .psc-topology__node--upstream { top: 192px; }
  .psc-topology__node--home { top: 42px; right: 0; }
  .psc-topology__node--server { right: 0; bottom: 38px; }
  .psc-cube--hero { left: 53%; }
  .psc-cube--hero svg { width: clamp(172px, 50vw, 214px); }
  .psc-cube--hero strong { font-size: .82rem; }
  .psc-chat--hero { position: relative; right: auto; bottom: auto; width: 100%; margin-top: -16px; }
  .psc-topology__footnote { position: static; align-self: start; width: 100%; max-width: none; margin: 0; }

  .psc-proof-section { padding-top: 18px; }
  .psc-proof-rail { margin-top: 0; }
  .psc-proof-rail > div { padding: 18px 14px 18px 34px; }
  .psc-proof-rail__mark { left: 16px; top: 25px; }
  .psc-proof-rail strong { font-size: .78rem; }
  .psc-proof-rail small { font-size: .68rem; }

  .psc-architecture__actions .psc-btn,
  .psc-beta-stage__actions .psc-btn { width: 100%; }

  .psc-blueprint { min-height: 650px; }
  .psc-blueprint__room { width: calc(50% - 30px); padding: 12px; }
  .psc-blueprint__room--living,
  .psc-blueprint__room--energy { left: 16px; }
  .psc-blueprint__room--office,
  .psc-blueprint__room--entry { right: 16px; }
  .psc-blueprint__room strong { font-size: .7rem; }
  .psc-blueprint__core { width: 132px; height: 132px; }
  .psc-blueprint > p { left: 18px; }

  .psc-outcome-card { min-height: 0; }
  .psc-beta-stage { padding: 24px 20px; }

  .psc-page .psc-section__head,
  .psc-blog .psc-section__head,
  .psc-single .psc-section__head { min-height: 140px; }

  .psc-footer__nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 30px 22px;
  }

  .psc-footer__group a { font-size: .82rem; }
}

/* On phones, explain the product visually before presenting the complete
   pre-launch/Bridge/pricing caveat. DOM and desktop/tablet composition stay
   unchanged; display:contents only exposes the copy children to this grid. */
@media (max-width: 420px) {
  .psc-hero__layout { gap: 0; align-items: start; }
  .psc-hero__col { display: contents; }
  .psc-hero__col > .psc-eyebrow { order: 1; }
  .psc-hero__col > h1 { order: 2; }
  .psc-hero__sub { order: 3; }
  .psc-hero__actions { order: 4; }
  .psc-hero__visual { order: 5; margin-top: 44px; }
  .psc-hero__status { order: 6; margin-top: 30px; }
}

@media (max-width: 380px) {
  .psc-footer__nav { grid-template-columns: minmax(0, 1fr); }
  .psc-proof-rail { grid-template-columns: minmax(0, 1fr); }
  .psc-proof-rail > div:nth-child(even) { border-left: 0; }
  .psc-proof-rail > div + div { border-top: 1px solid var(--psc-border); }
}

/* Progressive navigation: without JavaScript, or if nav.js never becomes
   ready, expose every primary link in normal document flow. A healthy bundle
   replaces this with the existing full-viewport interactive menu. */
@media (max-width: 979px) {
  /* The interactive control only becomes visible once nav.js has attached its
     handlers. Preserve its slot while pending to avoid a header layout shift;
     true no-JS and timed-out states use the link-first fallbacks below. */
  html.psc-nav-pending .psc-burger {
    visibility: hidden;
    pointer-events: none;
  }

  html.no-js .psc-nav,
  html.psc-nav-fallback .psc-nav {
    position: relative;
    height: auto;
    min-height: var(--psc-nav-h);
    align-items: stretch;
  }

  html.no-js .psc-nav__inner,
  html.psc-nav-fallback .psc-nav__inner {
    min-height: var(--psc-nav-h);
    height: auto;
    flex-wrap: wrap;
    padding-top: 10px;
    padding-bottom: 18px;
  }

  html.no-js .psc-nav__inner > nav,
  html.psc-nav-fallback .psc-nav__inner > nav {
    order: 3;
    width: 100%;
  }

  html.no-js .psc-nav__links,
  html.psc-nav-fallback .psc-nav__links {
    position: static;
    inset: auto;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    height: auto;
    max-height: none;
    margin-top: 10px;
    padding: 14px 0 0;
    overflow: visible;
    visibility: visible;
    transform: none;
    opacity: 1;
    pointer-events: auto;
    background: none;
    border-top: 1px solid var(--psc-border);
    border-bottom: 0;
    box-shadow: none;
    transition: none;
  }

  html.no-js .psc-nav__links a,
  html.psc-nav-fallback .psc-nav__links a {
    padding: 8px 0;
    font-size: .9rem;
  }

  html.no-js .psc-burger,
  html.psc-nav-fallback .psc-burger { display: none; }
}

@media (min-width: 600px) and (max-width: 979px) {
  html.no-js .psc-nav__links,
  html.psc-nav-fallback .psc-nav__links { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* Sideways reveal offsets must never create a transient mobile scrollbar. */
@media (max-width: 599px) {
  .psc-motion-ready .psc-reveal--left,
  .psc-motion-ready .psc-reveal--right,
  .psc-motion-ready .psc-reveal--visual { translate: 0 18px; }
}

/* 4K: expand the composition, not the reading measure. */
@media (min-width: 1800px) {
  body { font-size: clamp(18px, .58vw, 22px); }

  .psc-container,
  .psc-nav__inner { padding-left: clamp(64px, 4vw, 96px); padding-right: clamp(64px, 4vw, 96px); }

  .psc-nav__inner { max-width: 2100px; }

  .psc-hero {
    min-height: min(1500px, 88svh);
    padding-top: calc(var(--psc-nav-h) + 112px);
    padding-bottom: 170px;
  }

  .psc-hero__layout { grid-template-columns: minmax(0, .9fr) minmax(720px, 1.1fr); gap: 130px; }
  .psc-hero__col { max-width: 860px; }
  .psc-hero h1 { font-size: clamp(5.2rem, 2.7vw, 6.5rem); }
  .psc-hero__sub { max-width: 54ch; font-size: clamp(1.35rem, .75vw, 1.7rem); }
  .psc-showcase.psc-topology { width: min(100%, 860px); min-height: 720px; }
  .psc-topology__stage { height: 580px; }
  .psc-cube--hero svg { width: 340px; }

  .psc-section { padding-top: 150px; padding-bottom: 150px; }
  .psc-section--compact { padding-top: 82px; padding-bottom: 82px; }
  .psc-section__head { max-width: 900px; }
  .psc-section h2 { font-size: clamp(3rem, 1.6vw, 3.9rem); }

  .psc-blueprint { min-height: 680px; }
  .psc-card { padding: 40px; }
  .psc-card h3 { font-size: 1.35rem; }
  .psc-outcome-card { min-height: 360px; }

  .psc-page h1,
  .psc-single h1,
  .psc-blog h1 { font-size: clamp(3.25rem, 1.7vw, 4.25rem); }

  .psc-prose:not(.psc-prose--wide) { max-width: 1120px; }
  .psc-footer__inner { grid-template-columns: minmax(300px, 1fr) minmax(0, 2.8fr); }
}

@media (prefers-reduced-motion: reduce) {
  .psc-topology__path,
  .psc-cube,
  .psc-cube__led,
  .psc-hero__scroll { animation: none !important; }

  .psc-motion-ready .psc-reveal,
  .psc-motion-ready .psc-reveal.is-visible {
    opacity: 1 !important;
    translate: none !important;
    scale: 1 !important;
    animation: none !important;
  }
}

@media print {
  html.psc-motion-pending *,
  .psc-motion-ready .psc-reveal {
    opacity: 1 !important;
    translate: none !important;
    scale: 1 !important;
    animation: none !important;
  }
}

/* 2.3 cascade guard: the editorial components intentionally sit on top of
   the 2.2 global section/type scaling without changing non-editorial pages. */
.psc-section.psc-journal {
  padding-top: calc(var(--psc-nav-h) + clamp(50px, 6vw, 94px));
  padding-bottom: clamp(92px, 9vw, 142px);
}

.psc-section.psc-article-page {
  padding-top: calc(var(--psc-nav-h) + clamp(52px, 6vw, 96px));
  padding-bottom: clamp(94px, 9vw, 150px);
}

.psc-section.psc-journal .psc-story-card__title {
  font-size: clamp(1.2rem, 1.35vw, 1.55rem);
  line-height: 1.18;
}

.psc-section.psc-journal .psc-story-card.is-featured .psc-story-card__title {
  font-size: clamp(2rem, 3vw, 3.35rem);
  line-height: 1.04;
}

.psc-section.psc-article-page .psc-related .psc-story-card__title {
  font-size: clamp(1.08rem, 1.1vw, 1.28rem);
  line-height: 1.2;
}

.psc-blog .psc-journal-head h1 {
  max-width: 15ch;
  font-size: clamp(2.8rem, 5vw, 5rem);
}

.psc-single .psc-article-header h1 {
  max-width: 15ch;
  font-size: clamp(2.5rem, 4.7vw, 4.8rem);
}

.psc-section .psc-related__head h2 { font-size: var(--psc-step-2); }

@media (max-width: 699px) {
  .psc-section.psc-journal { padding-top: calc(var(--psc-nav-h) + 46px); }
  .psc-blog .psc-journal-head h1 { font-size: clamp(2.55rem, 12vw, 3.4rem); }
  .psc-single .psc-article-header h1 { font-size: clamp(2.35rem, 11.5vw, 3.25rem); }
}

@media (min-width: 1800px) {
  .psc-blog .psc-journal-head h1 { font-size: clamp(4.5rem, 2.5vw, 5.6rem); }
  .psc-single .psc-article-header h1 { font-size: clamp(4rem, 2.1vw, 5rem); }
}

/* ============================================================
   2.3.1 RELEASE POLISH — explicit states, editorial rails and
   Gutenberg-owned feature/contact page grammar
   ============================================================ */

.psc-visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  border: 0 !important;
  white-space: nowrap !important;
}

/* Static product states are deliberately rectangular and label-led. They do
   not borrow the round, hoverable language of filters or topic controls. */
.psc-status-pill {
  gap: 0;
  padding: 0;
  overflow: hidden;
  border-radius: 7px;
  background: rgba(6, 16, 26, .74);
  cursor: default;
  text-transform: none;
  user-select: text;
}

.psc-status-pill::before { display: none; }

.psc-status-pill__prefix,
.psc-status-pill__value {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 6px 9px;
}

.psc-status-pill__prefix {
  border-right: 1px solid currentColor;
  color: var(--psc-text-dim);
  font-size: .58rem;
  font-weight: 800;
  letter-spacing: .11em;
  text-transform: uppercase;
  opacity: .92;
}

.psc-status-pill__value {
  position: relative;
  gap: 7px;
  letter-spacing: .045em;
  text-transform: uppercase;
}

.psc-status-pill__value::before {
  content: "";
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 10px currentColor;
}

.psc-tier__badge {
  padding: 7px 11px;
  border: 1px solid rgba(32, 215, 242, .32);
  border-left: 3px solid var(--psc-accent);
  border-radius: 5px;
  background: rgba(32, 215, 242, .08);
  box-shadow: none;
  cursor: default;
}

/* The Newsletter Plugin keeps ownership of endpoint, required fields and DOI.
   Its privacy field is turned into a genuine 44px checkbox target; the linked
   privacy policy remains a separate, same-tab link below the form. */
.psc-newsletter form.psc-newsletter__form .tnp-field-privacy {
  position: relative;
  display: block;
  min-height: 44px;
  padding: 0;
}

.psc-newsletter form.psc-newsletter__form input.tnp-privacy {
  position: absolute;
  z-index: 2;
  inset: 0 auto auto 0;
  width: 44px !important;
  min-width: 44px !important;
  max-width: 44px !important;
  height: 44px !important;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}

.psc-newsletter form.psc-newsletter__form .tnp-field-privacy label {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 44px;
  margin: 0;
  padding: 8px 8px 8px 44px;
  cursor: pointer;
}

.psc-newsletter form.psc-newsletter__form .tnp-field-privacy label::before {
  content: "";
  position: absolute;
  left: 11px;
  top: 50%;
  width: 20px;
  height: 20px;
  translate: 0 -50%;
  border: 1px solid var(--psc-border-strong);
  border-radius: 5px;
  background: rgba(6, 16, 26, .9);
  box-shadow: inset 0 1px rgba(255, 255, 255, .04);
  transition: border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.psc-newsletter form.psc-newsletter__form .tnp-field-privacy label::after {
  content: "";
  position: absolute;
  left: 18px;
  top: 50%;
  width: 7px;
  height: 12px;
  translate: 0 -60%;
  rotate: 45deg;
  border-right: 2px solid #04141a;
  border-bottom: 2px solid #04141a;
  opacity: 0;
}

.psc-newsletter form.psc-newsletter__form input.tnp-privacy:checked + label::before {
  border-color: var(--psc-accent);
  background: var(--psc-accent);
  box-shadow: 0 0 0 3px var(--psc-accent-soft);
}

.psc-newsletter form.psc-newsletter__form input.tnp-privacy:checked + label::after { opacity: 1; }

.psc-newsletter form.psc-newsletter__form input.tnp-privacy:focus-visible {
  outline: 0 !important;
}

.psc-newsletter form.psc-newsletter__form input.tnp-privacy:focus-visible + label::before {
  outline: 3px solid var(--psc-accent);
  outline-offset: 3px;
}

/* Persistent Journal section state in the global navigation. */
.psc-nav__links .current-menu-parent > a,
.psc-nav__links .current_page_parent > a,
.psc-nav__links a.is-section-current,
.psc-nav__links a[aria-current="location"] {
  color: var(--psc-white);
}

.psc-nav__links .current-menu-parent > a::after,
.psc-nav__links .current_page_parent > a::after,
.psc-nav__links a.is-section-current::after,
.psc-nav__links a[aria-current="location"]::after {
  width: 100%;
}

.psc-context-journal .psc-nav {
  border-bottom-color: rgba(115, 229, 194, .18);
}

.psc-journal,
.psc-article-page {
  position: relative;
  isolation: isolate;
}

.psc-journal::before,
.psc-article-page::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0 0 auto;
  height: clamp(280px, 35vw, 620px);
  background:
    linear-gradient(180deg, rgba(7, 25, 38, .72), transparent),
    radial-gradient(70% 100% at 14% 0%, rgba(115, 229, 194, .075), transparent 72%);
  pointer-events: none;
}

.psc-article-header__context {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  width: fit-content;
  color: var(--psc-text-dim);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.psc-article-header__context a { color: var(--psc-local); }
.psc-article-header__context a:hover { color: var(--psc-white); }

/* Gutenberg Features: the source copy and every product detail stay editable;
   this layer only supplies hierarchy, scannability and a stable anchor model. */
.psc-page--features {
  overflow: hidden;
  padding-bottom: clamp(66px, 7vw, 112px);
}

.psc-page--features .psc-section__head {
  position: relative;
  max-width: 980px;
  margin-bottom: clamp(30px, 4vw, 54px);
  padding-bottom: clamp(26px, 3vw, 38px);
  border-bottom: 1px solid var(--psc-border);
}

.psc-page--features .psc-section__head::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  width: clamp(100px, 12vw, 180px);
  height: 2px;
  background: linear-gradient(90deg, var(--psc-local), var(--psc-accent));
}

.psc-page--features .psc-section__head h1 {
  max-width: 12ch;
  font-size: clamp(3rem, 6vw, 6rem);
}

.psc-features-content {
  max-width: none !important;
  margin: 0 !important;
}

.psc-features-overview {
  position: relative;
  display: grid;
  gap: 0;
  max-width: 1320px;
  margin: 0 auto clamp(74px, 8vw, 126px);
}

.psc-features-overview__context > p {
  max-width: 78ch;
}

.psc-features-overview__context > p:first-child {
  max-width: 72ch;
  color: #d7e4ee;
  font-size: var(--psc-step-1);
  line-height: 1.55;
  text-wrap: pretty;
}

.psc-features-overview > .psc-disclaimer {
  position: relative;
  max-width: 92ch;
  margin: 10px 0 24px;
  padding: 18px 20px 18px 48px;
  border-color: rgba(241, 183, 104, .3);
  background: linear-gradient(100deg, rgba(241, 183, 104, .12), rgba(10, 23, 36, .74));
}

.psc-features-overview > .psc-disclaimer::before {
  content: "";
  position: absolute;
  left: 22px;
  top: 25px;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--psc-home);
  box-shadow: 0 0 14px rgba(241, 183, 104, .4);
}

.psc-features-anchor-nav {
  margin: 0 0 clamp(26px, 4vw, 44px);
  padding: 24px 0;
  border-top: 1px solid var(--psc-border);
  border-bottom: 1px solid var(--psc-border);
}

.psc-features-anchor-nav > span,
.psc-contact-task-nav > span {
  display: block;
  margin-bottom: 14px;
  color: var(--psc-local);
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.psc-features-anchor-nav ol,
.psc-contact-task-nav ol {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--psc-border);
  border-radius: 14px;
  background: var(--psc-border);
  list-style: none;
}

.psc-features-anchor-nav li,
.psc-contact-task-nav li { margin: 0; }

.psc-features-anchor-nav a,
.psc-contact-task-nav a {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-height: 66px;
  padding: 12px 15px;
  background: rgba(8, 23, 36, .97);
  color: var(--psc-text);
  text-decoration: none;
  transition: background .2s ease, color .2s ease;
}

.psc-features-anchor-nav a > span,
.psc-contact-task-nav a > span {
  color: var(--psc-text-dim);
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .08em;
}

.psc-features-anchor-nav a > strong,
.psc-contact-task-nav a > strong {
  color: inherit;
  font-size: .82rem;
  line-height: 1.35;
}

.psc-features-anchor-nav a:hover,
.psc-features-anchor-nav a:focus-visible,
.psc-contact-task-nav a:hover,
.psc-contact-task-nav a:focus-visible {
  background: var(--psc-bg-raised);
  color: var(--psc-accent);
}

.psc-features-overview > .psc-grid {
  margin-top: clamp(20px, 3vw, 34px);
  gap: 1px;
  overflow: hidden;
  border: 1px solid var(--psc-border);
  border-radius: var(--psc-radius-lg);
  background: var(--psc-border);
}

.psc-features-overview > .psc-grid .psc-card {
  min-height: 250px;
  border: 0;
  border-radius: 0;
  background:
    radial-gradient(260px 170px at 90% 0%, rgba(32, 215, 242, .08), transparent 72%),
    var(--psc-bg-card);
  box-shadow: none;
}

.psc-features-overview > .psc-grid .psc-card:hover {
  transform: none;
  background-color: var(--psc-bg-raised);
}

.psc-features-overview__context {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, .65fr);
  gap: clamp(26px, 4vw, 58px);
  align-items: start;
  margin-top: clamp(34px, 5vw, 58px);
  padding-top: clamp(28px, 4vw, 46px);
  border-top: 1px solid var(--psc-border);
}

.psc-features-overview__context > p { margin: 0; }

.psc-feature-band {
  position: relative;
  display: grid;
  grid-template-columns: minmax(72px, .18fr) minmax(0, 1fr);
  gap: clamp(28px, 5vw, 84px);
  max-width: 1460px;
  margin: 0 auto;
  padding: clamp(64px, 8vw, 126px) 0;
  border-top: 1px solid var(--psc-border);
  scroll-margin-top: calc(var(--psc-nav-h) + 18px);
}

.psc-feature-band::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 16% -18vw;
  background: radial-gradient(50% 80% at 86% 48%, rgba(32, 215, 242, .045), transparent 76%);
  pointer-events: none;
}

.psc-feature-band:nth-of-type(even)::before {
  background: radial-gradient(50% 80% at 12% 48%, rgba(115, 229, 194, .045), transparent 76%);
}

.psc-feature-band__index {
  position: sticky;
  top: calc(var(--psc-nav-h) + 30px);
  align-self: start;
  display: grid;
  gap: 7px;
  padding-top: 4px;
}

.psc-feature-band__index > span {
  color: transparent;
  font-size: clamp(3.5rem, 6vw, 7.5rem);
  font-weight: 800;
  line-height: .8;
  letter-spacing: -.08em;
  -webkit-text-stroke: 1px rgba(115, 229, 194, .42);
}

.psc-feature-band__index > small {
  color: var(--psc-text-dim);
  font-size: .62rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.psc-feature-band__body {
  min-width: 0;
  max-width: 1120px;
}

.psc-feature-band__body > h2 {
  max-width: 22ch;
  margin: 0 0 clamp(24px, 3vw, 38px);
  font-size: clamp(2rem, 4vw, 4.4rem);
  line-height: 1.02;
  text-wrap: balance;
  scroll-margin-top: calc(var(--psc-nav-h) + 24px);
}

.psc-feature-band__body > p,
.psc-feature-band__body > ul {
  max-width: 76ch;
}

.psc-feature-band__body > p:first-of-type {
  color: #c7d5e0;
  font-size: clamp(1.05rem, 1rem + .18vw, 1.25rem);
  line-height: 1.72;
}

.psc-feature-band__body > table {
  margin: clamp(28px, 4vw, 46px) 0;
}

.psc-feature-band__body > .psc-grid,
.psc-feature-band__body > .psc-stats {
  max-width: 1080px;
  margin-top: clamp(30px, 4vw, 50px);
  margin-bottom: clamp(30px, 4vw, 50px);
}

.psc-features-final {
  max-width: 900px;
  margin-top: clamp(42px, 6vw, 74px) !important;
  padding: clamp(30px, 4vw, 48px);
  border-color: rgba(32, 215, 242, .42);
  background:
    radial-gradient(440px 220px at 90% 0%, rgba(32, 215, 242, .12), transparent 70%),
    linear-gradient(150deg, rgba(20, 42, 63, .96), rgba(8, 23, 36, .98));
  text-align: left !important;
}

.psc-features-final h3 { font-size: var(--psc-step-2); }

/* Pricing cards sit beneath an accessible overview heading injected by the
   render layer, keeping the visible tier titles at the correct H3 depth. */
.psc-page--pricing .psc-pricing-content { max-width: 1220px; }

/* Contact: a real task index precedes the forms, then the mobile flow makes
   waitlist, message and specialist routes visibly distinct. */
.psc-page--contact .psc-section__head { max-width: 920px; }
.psc-contact-content { max-width: 1040px; }

.psc-contact-intro > .psc-lead {
  max-width: 78ch;
  margin: 0;
  color: #c9d7e2;
  font-size: clamp(1rem, .97rem + .14vw, 1.14rem);
  line-height: 1.7;
}

.psc-contact-task-nav {
  margin: 0 0 clamp(26px, 4vw, 42px);
}

.psc-contact-task-nav ol { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.psc-contact-intro {
  max-width: 900px;
  margin: 0 0 clamp(54px, 7vw, 82px);
  padding: clamp(20px, 3vw, 28px);
  border-left: 2px solid rgba(115, 229, 194, .44);
  background: linear-gradient(90deg, rgba(115, 229, 194, .055), transparent 82%);
}

.psc-contact-content > h2 {
  position: relative;
  margin-top: clamp(58px, 8vw, 96px);
  padding-top: clamp(30px, 4vw, 46px);
  border-top: 1px solid var(--psc-border);
  scroll-margin-top: calc(var(--psc-nav-h) + 20px);
}

.psc-contact-content > h2::before {
  content: "";
  position: absolute;
  left: 0;
  top: -1px;
  width: 86px;
  height: 2px;
  background: linear-gradient(90deg, var(--psc-local), var(--psc-accent));
}

.psc-contact-content > h2:first-of-type {
  margin-top: 0;
}

.psc-contact-content > .psc-newsletter,
.psc-contact-content > .wpcf7 {
  max-width: 900px;
  margin: 26px 0 0;
  padding: clamp(22px, 4vw, 36px);
  border: 1px solid var(--psc-border);
  border-radius: var(--psc-radius-lg);
  background:
    radial-gradient(420px 220px at 92% 0%, rgba(32, 215, 242, .08), transparent 72%),
    rgba(10, 23, 36, .72);
  box-shadow: var(--psc-shadow);
}

.psc-contact-content > .psc-newsletter .psc-newsletter__doi-note,
.psc-contact-content > .psc-newsletter .psc-newsletter__legal {
  max-width: none;
  margin-left: 0;
}

/* Standalone controls keep a full 44px hit area without changing the rhythm of
   links embedded in paragraphs. */
.psc-logo,
.psc-nav__cta .psc-btn,
.psc-lang__opt,
.psc-link,
.psc-hero__status > a,
.psc-footer__bottom > a,
.psc-story-topics a,
.psc-article-header__context a,
.psc-article-context > a,
.psc-article-toc a,
.psc-article-toc-mobile a,
.psc-share__btn {
  min-height: 44px;
}

.psc-logo,
.psc-link,
.psc-hero__status > a,
.psc-footer__bottom > a,
.psc-article-header__context a,
.psc-article-context > a,
.psc-article-toc a,
.psc-article-toc-mobile a,
.psc-share__btn {
  align-items: center;
}

.psc-hero__status > a,
.psc-footer__bottom > a,
.psc-article-header__context a,
.psc-article-context > a,
.psc-article-toc a,
.psc-article-toc-mobile a,
.psc-share__btn { display: inline-flex; }

.psc-lang { padding: 0; }

.psc-lang__opt {
  min-width: 44px;
  justify-content: center;
  padding: 0 8px;
}

.psc-page-numbers .page-numbers,
.nav-links .page-numbers { min-width: 44px; }

/* The mobile header remains visually compact while every direct control has a
   44px target. */
@media (max-width: 979px) {
  .psc-logo {
    min-width: 44px;
    min-height: 44px;
    margin-left: -8px;
    padding: 4px 8px;
  }

  .psc-nav__cta .psc-btn { min-height: 44px; }

  .psc-lang { min-height: 44px; padding: 0; }

  .psc-lang__opt {
    min-width: 44px;
    min-height: 44px;
    justify-content: center;
    padding: 0 8px;
  }

  .psc-burger { width: 44px; height: 44px; }
}

/* Mobile Journal rail: persistent edge cues, snap padding and an active topic
   that nav.js centres with horizontal scrolling only. */
@media (max-width: 699px) {
  .psc-story-topics {
    position: relative;
    isolation: isolate;
  }

  .psc-story-topics::before,
  .psc-story-topics::after {
    content: "";
    position: absolute;
    z-index: 3;
    top: 0;
    bottom: 0;
    width: 44px;
    pointer-events: none;
    opacity: 0;
    transition: opacity .16s ease;
  }

  .psc-story-topics::before {
    left: -1px;
    background: linear-gradient(90deg, var(--psc-bg) 12%, transparent);
  }

  .psc-story-topics::after {
    right: -1px;
    background: linear-gradient(270deg, var(--psc-bg) 12%, transparent);
  }

  .psc-story-topics.has-scroll-left::before,
  .psc-story-topics.has-scroll-right::after { opacity: 1; }

  html.no-js .psc-story-topics::after,
  html.psc-nav-fallback .psc-story-topics::after { opacity: 1; }

  .psc-story-topics ul {
    gap: 10px;
    padding-right: max(132px, 36vw);
    scroll-padding-inline: 22vw;
    overscroll-behavior-inline: contain;
    touch-action: pan-x pan-y;
  }

  .psc-story-topics li { scroll-snap-align: center; }

  .psc-story-topics a {
    min-height: 44px;
    padding: 10px 15px;
    border-radius: 12px;
  }

  .psc-feature-band {
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
    padding: 64px 0;
  }

  .psc-feature-band__index {
    position: static;
    display: flex;
    align-items: end;
    gap: 12px;
    padding: 0;
  }

  .psc-feature-band__index > span { font-size: 3.8rem; }
  .psc-feature-band__index > small { padding-bottom: 3px; }
  .psc-feature-band__body > h2 { font-size: clamp(2rem, 10vw, 3.1rem); }

  .psc-features-anchor-nav ol { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .psc-features-anchor-nav a { min-height: 58px; }

  .psc-features-overview > .psc-grid .psc-card { min-height: 0; }

  .psc-features-overview__context {
    grid-template-columns: minmax(0, 1fr);
  }

  .psc-contact-task-nav ol { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .psc-contact-content > .psc-newsletter,
  .psc-contact-content > .wpcf7 {
    padding: 20px;
    border-radius: 18px;
  }
}

@media (max-width: 520px) {
  .psc-contact-task-nav ol { grid-template-columns: minmax(0, 1fr); }
  .psc-contact-task-nav a { min-height: 58px; }
}

@media (max-width: 430px) {
  .psc-burger { width: 44px; height: 44px; }
}

/* Keep editorial display type monotonic at the 1800px boundary and let it grow
   modestly on 4K without widening the reading column. */
@media (min-width: 1800px) {
  .psc-blog .psc-journal-head h1 {
    font-size: clamp(5rem, calc(4.1rem + .8vw), 6rem);
  }

  .psc-single .psc-article-header h1 {
    font-size: clamp(4.8rem, calc(3.95rem + .75vw), 5.6rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  .psc-features-anchor-nav a,
  .psc-contact-task-nav a,
  .psc-newsletter form.psc-newsletter__form .tnp-field-privacy label::before,
  .psc-story-topics::before,
  .psc-story-topics::after { transition: none !important; }
}

/* ============================================================
   3.0 POWERSMARTCOAT — Bausteine der Partnerseite
   ------------------------------------------------------------
   Kontrast: jedes Text-auf-Flaeche-Paar ist nachgerechnet. Die
   Bezugsflaechen sind
     Grund      --psc-bg        #06101a   L = 0,00484
     erhoeht    --psc-bg-elev   #0a1724   L = 0,00805
     Karte      --psc-bg-card   #0f2031   L = 0,01357
   und die Textfarben
     --psc-text       #eef5fb  L = 0,90462
     --psc-text-muted #a9b8c7  L = 0,46844
     --psc-text-dim   #8397aa  L = 0,30276
     --psc-accent     #04b7d5  L = 0,38702
     --psc-cold       #8ae3f7  L = 0,66983
     --psc-warm       #d1571d  L = 0,20458
   Daraus:
     text  auf Karte 15,02:1 · muted auf Karte 8,16:1
     dim   auf Karte  5,55:1 · accent auf Karte 6,87:1
     cold  auf Karte 11,32:1
     warm  auf Grund  4,64:1  <- nur auf dem GRUND, nicht auf der Karte
   --psc-warm liegt auf der Karte nur bei 4,01:1. Deshalb traegt jede
   Flaeche, auf der warmer Text steht, ausdruecklich den Grund
   (.psc-section--figure) und niemals eine Kartenfarbe. Orange bleibt
   Bedeutungsfarbe (Waermeverlust) und ist nirgends anklickbar.
   ============================================================ */

/* ---- Logo -------------------------------------------------
   Das Wortzeichen ist Navy #2f375e. Auf dem Grund #06101a waeren das
   1,67:1 und damit unlesbar. Auf Weiss sind es 11,48:1. Deshalb steht
   das transparente Logo auf einer eigenen hellen Traegerflaeche; sie
   gehoert zur Sperrzone des Logos, nicht zur Seitenflaeche. */
.psc-logo__plate {
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 0 0 1px rgba(173, 205, 229, .14), 0 10px 26px -18px rgba(0, 0, 0, .9);
}
.psc-logo__plate img {
  display: block;
  width: auto;
  height: 26px;
}
.psc-footer__brand .psc-logo__plate img { height: 30px; }
/* Die geerbte Regel blendet auf schmalen Viewports das letzte Kind des
   Logos aus. Das war die nestnode-Wortmarke; hier ist es das Logo selbst. */
.psc-logo > .psc-logo__plate { display: inline-flex !important; }
@media (max-width: 430px) {
  .psc-logo__plate { padding: 5px 7px; }
  .psc-logo__plate img { height: 22px; }
}

/* ---- Sektionen mit technischer Zeichnung ------------------
   Ausdruecklich opak auf dem Grund: die Zeichnungen enthalten warmen
   Text (13,0 °C, Gefahrenzone), der nur auf #06101a die 4,5:1 erreicht.
   Ein durchscheinender Verlauf wuerde den Wert auf 4,2:1 druecken. */
.psc-section--figure { background: var(--psc-bg); }

.psc-figure-block {
  margin-top: clamp(24px, 3vw, 40px);
  max-width: 100%;
  min-width: 0;
}

.psc-subsection {
  margin-top: clamp(48px, 6vw, 84px);
  padding-top: clamp(28px, 3vw, 44px);
  border-top: 1px solid var(--psc-border);
}
.psc-subsection__title {
  margin: 0 0 12px;
  font-size: var(--psc-step-2);
  line-height: 1.12;
  letter-spacing: -.035em;
}
.psc-subsection__lead {
  margin: 0;
  max-width: 74ch;
  color: var(--psc-text-muted);
  font-size: var(--psc-step-1);
  line-height: 1.6;
}
.psc-subsection .psc-figure-block { margin-top: clamp(20px, 2.5vw, 34px); }
.psc-subsection .psc-grid { margin-bottom: 0; }

/* ---- Kennwertpanel im Hero ------------------------------- */
.psc-metrics {
  width: 100%;
  max-width: 520px;
  padding: clamp(20px, 2.4vw, 30px);
  border: 1px solid var(--psc-border);
  border-radius: var(--psc-radius-lg);
  background: linear-gradient(160deg, #142a3f 0%, #0b1c2b 62%, #0a1724 100%);
  box-shadow: var(--psc-shadow);
}
.psc-metrics__title {
  margin: 0 0 4px;
  color: var(--psc-cold);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.psc-metrics__list { margin: 0; }
.psc-metrics__row {
  display: grid;
  gap: 2px;
  padding: 14px 0;
  border-bottom: 1px solid var(--psc-border);
}
.psc-metrics__row:last-child { border-bottom: 0; }
.psc-metrics__label {
  color: var(--psc-text);
  font-size: .95rem;
  font-weight: 650;
}
.psc-metrics__value {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 10px;
  margin: 0;
}
.psc-metrics__number {
  color: var(--psc-cold);
  font-size: clamp(1.35rem, 1.1rem + 1vw, 1.85rem);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.03em;
  line-height: 1.1;
}
.psc-metrics__unit {
  color: var(--psc-text-muted);
  font-size: .82rem;
}
.psc-metrics__proof {
  flex: 1 0 100%;
  color: var(--psc-text-dim);
  font-size: .74rem;
  line-height: 1.45;
}
.psc-metrics__scale { margin-top: 18px; }
.psc-metrics__scale-bar {
  display: block;
  height: 8px;
  border-radius: 999px;
  /* Reine Bedeutungsskala, kein Bedienelement. */
  background: linear-gradient(90deg, var(--psc-cold), #6ea0b4 46%, var(--psc-warm));
}
.psc-metrics__scale-legend {
  display: flex;
  justify-content: space-between;
  margin-top: 6px;
  color: var(--psc-text-muted);
  font-size: .74rem;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.psc-metrics__note {
  margin: 10px 0 0;
  color: var(--psc-text-dim);
  font-size: .76rem;
  line-height: 1.5;
}

/* ---- Produkteigenschaften -------------------------------- */
.psc-property { display: flex; flex-direction: column; }
.psc-property__unit {
  margin: 0 0 10px;
  color: var(--psc-accent);
  font-size: .74rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.psc-property h3 { margin-bottom: 10px; font-size: 1.16rem; }
.psc-property > p { color: var(--psc-text-muted); line-height: 1.65; }
.psc-property__proof {
  margin: auto 0 0;
  padding-top: 14px;
  border-top: 1px solid var(--psc-border);
  color: var(--psc-text-dim);
  font-size: .8rem;
  line-height: 1.5;
}
.psc-property__proof-label {
  display: inline-block;
  margin-right: 6px;
  color: var(--psc-text-muted);
  font-weight: 750;
  letter-spacing: .04em;
  text-transform: uppercase;
  font-size: .7rem;
}

/* ---- Ersparnisrechner ------------------------------------ */
.psc-calc {
  display: grid;
  gap: clamp(20px, 3vw, 34px);
  margin-top: clamp(24px, 3vw, 40px);
  align-items: start;
}
@media (min-width: 980px) {
  .psc-calc { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}
.psc-calc__inputs,
.psc-calc__results {
  min-width: 0;
  padding: clamp(20px, 2.4vw, 30px);
  border: 1px solid var(--psc-border);
  border-radius: var(--psc-radius);
  background: var(--psc-bg-card);
}
.psc-calc__results { background: var(--psc-bg-elev); }
.psc-calc__sub {
  margin: 0 0 16px;
  color: var(--psc-text-muted);
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.psc-calc__presets {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 22px;
}
.psc-calc__preset {
  display: grid;
  gap: 2px;
  min-height: 44px;
  padding: 8px 14px;
  border: 1px solid var(--psc-border-strong);
  border-radius: 10px;
  background: var(--psc-bg);
  color: var(--psc-text);
  font: inherit;
  font-size: .84rem;
  font-weight: 650;
  text-align: left;
  cursor: pointer;
  transition: border-color .2s ease, background .2s ease;
}
.psc-calc__preset span {
  color: var(--psc-text-muted);
  font-size: .72rem;
  font-weight: 500;
}
.psc-calc__preset:hover { border-color: var(--psc-accent); }
/* Der gewaehlte Zustand ist nicht allein farbig kodiert: er traegt
   zusaetzlich aria-pressed und einen sichtbaren Rahmen von 2 px. */
.psc-calc__preset[aria-pressed="true"] {
  border-color: var(--psc-accent);
  border-width: 2px;
  padding: 7px 13px;
  background: var(--psc-accent-soft);
}
.psc-calc__preset[aria-pressed="true"]::after {
  content: "gewählt";
  color: var(--psc-accent);
  font-size: .66rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.psc-calc__fields { display: grid; gap: 16px; }
.psc-calc__field { display: grid; gap: 6px; margin: 0; }
.psc-calc__field label {
  color: var(--psc-text);
  font-size: .9rem;
  font-weight: 650;
}
.psc-calc__control {
  display: flex;
  align-items: stretch;
  border: 1px solid var(--psc-border-strong);
  border-radius: 10px;
  background: var(--psc-bg);
  overflow: hidden;
}
.psc-calc__control input {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 44px;
  padding: 10px 12px;
  border: 0;
  background: transparent;
  color: var(--psc-text);
  font: inherit;
  font-variant-numeric: tabular-nums;
}
.psc-calc__control input:focus { outline: none; }
.psc-calc__control:focus-within {
  border-color: var(--psc-accent);
  box-shadow: 0 0 0 2px var(--psc-accent-soft);
}
.psc-calc__suffix {
  display: flex;
  align-items: center;
  padding: 0 12px;
  border-left: 1px solid var(--psc-border);
  background: var(--psc-bg-card);
  color: var(--psc-text-muted);
  font-size: .8rem;
  white-space: nowrap;
}
.psc-calc__hint {
  color: var(--psc-text-dim);
  font-size: .78rem;
  line-height: 1.5;
}
.psc-calc__hint strong { color: var(--psc-text-muted); }

.psc-calc__headline {
  display: grid;
  gap: 2px;
  margin: 0 0 20px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--psc-border);
}
.psc-calc__headline-label {
  color: var(--psc-text-muted);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.psc-calc__headline-value {
  color: var(--psc-cold);
  font-size: clamp(1.9rem, 1.4rem + 2vw, 2.9rem);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.04em;
  line-height: 1.05;
}
.psc-calc__bars { display: grid; gap: 14px; margin-bottom: 22px; }
.psc-calc__bar-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 6px;
  margin: 0;
}
.psc-calc__bar-label {
  color: var(--psc-text-muted);
  font-size: .82rem;
}
/* Der Balken ist die Zweitkodierung der Zahl daneben, nie ihr Ersatz. */
.psc-calc__bar {
  display: block;
  height: 12px;
  border-radius: 999px;
  background: rgba(173, 205, 229, .12);
  overflow: hidden;
}
.psc-calc__bar::before {
  content: "";
  display: block;
  width: var(--anteil, 2%);
  height: 100%;
  border-radius: inherit;
  transition: width .25s ease;
}
.psc-calc__bar--warm::before { background: var(--psc-warm); }
.psc-calc__bar--cold::before { background: var(--psc-cold); }
.psc-calc__bar-value {
  color: var(--psc-text);
  font-size: .95rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.psc-calc__figures {
  display: grid;
  gap: 1px;
  margin: 0 0 18px;
  border: 1px solid var(--psc-border);
  background: var(--psc-border);
}
@media (min-width: 560px) {
  .psc-calc__figures { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.psc-calc__figures > div {
  display: grid;
  gap: 3px;
  padding: 12px 14px;
  background: var(--psc-bg-elev);
}
.psc-calc__figures dt {
  color: var(--psc-text-muted);
  font-size: .76rem;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.psc-calc__figures dd {
  margin: 0;
  color: var(--psc-text);
  font-size: 1.02rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.psc-calc__reading {
  margin: 0 0 16px;
  padding: 12px 14px;
  border-left: 3px solid var(--psc-accent);
  background: var(--psc-accent-soft);
  color: var(--psc-text);
  font-size: .9rem;
  line-height: 1.6;
}
.psc-calc__method {
  margin: 0;
  color: var(--psc-text-dim);
  font-size: .78rem;
  line-height: 1.6;
}
.psc-calc__method strong { color: var(--psc-text-muted); }
.psc-calc__method em { font-style: normal; color: var(--psc-text-muted); font-weight: 700; }

/* ---- Dokumentierte Untersuchungen -------------------------
   Hairline-Karten ohne eigene Flaeche: der warme "vorher"-Wert braucht
   den Grund, um 4,64:1 zu erreichen. */
.psc-study {
  display: flex;
  flex-direction: column;
  padding: 22px;
  border: 1px solid var(--psc-border);
  border-radius: var(--psc-radius);
  background: transparent;
}
.psc-study__tag {
  margin: 0 0 10px;
  color: var(--psc-accent);
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.psc-study h4 { margin: 0 0 8px; font-size: 1.1rem; }
.psc-study__subject {
  margin: 0 0 18px;
  color: var(--psc-text-muted);
  font-size: .9rem;
  line-height: 1.6;
}
.psc-study__results {
  margin: auto 0 0;
  padding-top: 16px;
  border-top: 1px solid var(--psc-border);
}
.psc-study__result {
  display: grid;
  gap: 4px;
  padding: 8px 0;
}
.psc-study__k {
  color: var(--psc-text-muted);
  font-size: .7rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.psc-study__result dd {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 14px;
  margin: 0;
}
.psc-study__v {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  font-size: .92rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
/* "vorher" und "nachher" stehen ausgeschrieben da; die Farbe wiederholt
   die Aussage nur, sie traegt sie nicht. */
.psc-study__state {
  font-size: .66rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.psc-study__v--before { color: var(--psc-warm); }
.psc-study__v--after { color: var(--psc-cold); }
.psc-study__delta {
  width: fit-content;
  margin: 14px 0 0;
  padding: 5px 12px;
  border: 1px solid var(--psc-border-strong);
  border-radius: 999px;
  color: var(--psc-text);
  font-size: .76rem;
  font-weight: 700;
}

/* ---- Kundenstimmen --------------------------------------- */
.psc-quotes {
  display: grid;
  gap: 20px;
  margin-top: clamp(24px, 3vw, 40px);
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
}
.psc-quote {
  margin: 0;
  padding: 26px;
  border: 1px solid var(--psc-border);
  border-left: 3px solid var(--psc-accent);
  border-radius: 0 var(--psc-radius) var(--psc-radius) 0;
  background: var(--psc-bg-card);
}
.psc-quote blockquote {
  margin: 0 0 18px;
  padding: 0;
  border: 0;
  color: var(--psc-text);
  font-size: 1.02rem;
  line-height: 1.7;
  quotes: "„" "“";
}
.psc-quote blockquote p { margin: 0; }
.psc-quote blockquote p::before { content: open-quote; }
.psc-quote blockquote p::after { content: close-quote; }
.psc-quote figcaption {
  color: var(--psc-text);
  font-size: .88rem;
  font-weight: 750;
}
.psc-quote figcaption span {
  display: block;
  margin-top: 2px;
  color: var(--psc-text-muted);
  font-weight: 500;
}

/* ---- Partnervorteile ------------------------------------- */
.psc-benefit {
  padding-top: 18px;
  border-top: 2px solid var(--psc-accent);
}
.psc-benefit__no {
  margin: 0 0 10px;
  color: var(--psc-text-muted);
  font-size: .76rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: .12em;
}
.psc-benefit h3 { margin: 0 0 10px; font-size: 1.14rem; }
.psc-benefit p {
  margin: 0;
  color: var(--psc-text-muted);
  line-height: 1.7;
}

/* ---- Kontakt --------------------------------------------- */
.psc-contact {
  display: grid;
  gap: clamp(28px, 4vw, 56px);
  align-items: start;
}
@media (min-width: 900px) {
  .psc-contact { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}
.psc-contact__copy { min-width: 0; }
.psc-contact__form { min-width: 0; }
.psc-contact__points {
  margin: 26px 0 0;
  padding: 0;
  list-style: none;
}
.psc-contact__points li {
  display: flex;
  gap: 12px;
  padding: 13px 0;
  border-top: 1px solid var(--psc-border);
  color: var(--psc-text-muted);
}
.psc-contact__points li::before {
  content: "→";
  flex: none;
  color: var(--psc-accent);
  font-weight: 800;
}

/* Formular. Portiert aus dem Live-Theme und auf die dunkle Flaeche gesetzt:
   Eingabefelder tragen den Grund (#06101a) unter --psc-text = 17,4:1. */
.psc-form {
  padding: clamp(20px, 2.6vw, 32px);
  border: 1px solid var(--psc-border);
  border-radius: var(--psc-radius);
  background: var(--psc-bg-card);
  color: var(--psc-text);
}
.psc-form h3 { margin: 0 0 6px; font-size: 1.24rem; }
.psc-form__hint {
  margin: 0 0 22px;
  color: var(--psc-text-muted);
  font-size: .9rem;
}
.psc-form label {
  display: block;
  margin-bottom: 16px;
  font-size: .88rem;
  font-weight: 650;
}
.psc-form label > span { display: block; margin-bottom: 6px; }
.psc-form .psc-req { color: var(--psc-accent); }
.psc-form__phone {
  display: grid;
  gap: 8px;
  grid-template-columns: 8.5rem minmax(0, 1fr);
}
@media (max-width: 380px) {
  .psc-form__phone { grid-template-columns: minmax(0, 1fr); }
}
.psc-form select,
.psc-form :is(input[type="text"], input[type="email"], input[type="tel"], textarea) {
  width: 100%;
  min-height: 44px;
  padding: 11px 13px;
  border: 1px solid var(--psc-border-strong);
  border-radius: 10px;
  background: var(--psc-bg);
  color: var(--psc-text);
  font: inherit;
  font-weight: 400;
}
.psc-form select option { background: #06101a; color: #eef5fb; }
.psc-form :is(input, select, textarea):focus-visible {
  border-color: var(--psc-accent);
  outline: 2px solid var(--psc-accent);
  outline-offset: 2px;
}
.psc-form textarea { resize: vertical; }
.psc-form__consent {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 20px;
  color: var(--psc-text-muted);
  font-size: .84rem;
  font-weight: 400;
  line-height: 1.6;
}
.psc-form__consent input {
  flex: none;
  width: 20px;
  height: 20px;
  margin-top: 2px;
  accent-color: var(--psc-accent);
}
.psc-form__consent a { color: var(--psc-accent); text-decoration: underline; }
.psc-form button[type="submit"] {
  width: 100%;
  min-height: 48px;
  padding: 13px 24px;
  border: 0;
  border-radius: 12px;
  background: linear-gradient(135deg, #58e8f8 0%, var(--psc-accent) 48%, #67e2d3 118%);
  /* Dunkler Text auf hellem Cyan: 8,6:1. */
  color: #04222b;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}
.psc-form button[type="submit"]:hover { filter: brightness(1.08); }
.psc-honeypot {
  position: absolute;
  left: -9999px;
  width: 0;
  height: 0;
  overflow: hidden;
}
.psc-form-notice {
  margin: 0 0 18px;
  padding: 12px 14px;
  border-radius: 10px;
  font-size: .92rem;
  line-height: 1.55;
}
/* Erfolg und Fehler sind zusaetzlich ueber role="status"/"alert" und ueber
   das vorangestellte Wort unterscheidbar, nicht allein ueber die Farbe. */
.psc-form-notice.is-success {
  border-left: 3px solid var(--psc-proven);
  background: var(--psc-proven-soft);
  color: var(--psc-text);
}
.psc-form-notice.is-error {
  border-left: 3px solid var(--psc-claimed);
  background: var(--psc-claimed-soft);
  color: var(--psc-text);
}

/* ---- Partnerkarte ---------------------------------------- */
.psc-map {
  position: relative;
  margin-top: clamp(20px, 2.5vw, 32px);
  border: 1px solid var(--psc-border);
  border-radius: var(--psc-radius);
  background: var(--psc-bg-card);
  overflow: hidden;
}
.psc-map__gate {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 18px;
  padding: clamp(2rem, 6vw, 4rem) 1.25rem;
  text-align: center;
}
.psc-map__gate p {
  max-width: 56ch;
  margin: 0;
  color: var(--psc-text-muted);
  font-size: .94rem;
  line-height: 1.65;
}
.psc-map__gate strong { color: var(--psc-text); }
.psc-map__frame {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 0;
}
@media (max-width: 700px) {
  .psc-map__frame { aspect-ratio: 4 / 5; }
}
.psc-map__note {
  margin-top: 12px;
  color: var(--psc-text-dim);
  font-size: .84rem;
}
.psc-map__note a { color: var(--psc-accent); }

/* ---- Disclaimer ------------------------------------------ */
.psc-disclaimer {
  padding: clamp(30px, 4vw, 52px) 0;
  border-top: 1px solid var(--psc-border);
  background: var(--psc-bg-elev);
}
.psc-disclaimer__title {
  margin: 0 0 10px;
  color: var(--psc-text-muted);
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.psc-disclaimer p {
  max-width: 92ch;
  margin: 0;
  color: var(--psc-text-dim);
  font-size: .86rem;
  line-height: 1.75;
}

/* ---- Raster ---------------------------------------------- */
@media (min-width: 720px) {
  .psc-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---- Kein seitliches Scrollen ----------------------------
   Breite Bausteine scrollen in ihrem eigenen Kasten, nie im Dokument.
   Deutsche Komposita ("Kundenerfahrungen", "Schimmelkriterium") sind bei
   36 px Schriftgroesse laenger als ein 320-px-Viewport. Sie brechen jetzt
   die Zeile statt das Dokument: gemessen sind 342 px Dokumentbreite bei
   320 px Viewport vorher, 320 px nachher. */
.psc-figure-block > * { max-width: 100%; }
.psc-datasheet .psc-container { min-width: 0; }

h1, h2, h3, h4,
.psc-section__lead,
.psc-subsection__title,
.psc-subsection__lead,
.psc-thickness__name,
.psc-thickness__hint,
.psc-thickness__value,
.psc-ds__term,
.psc-ds__value { overflow-wrap: break-word; }

@media (max-width: 700px) {
  h1, h2, h3 { hyphens: auto; }
}

@media (prefers-reduced-motion: reduce) {
  .psc-calc__bar::before { transition: none !important; }
}

/* ============================================================
   3.1 — MEHRSEITIGE STRUKTUR UND KOMPAKTES FORMULAR
   Steht bewusst am Dateiende: mehrere Korrekturen unten heben
   Regeln auf, die weiter oben mit gleicher Spezifitaet stehen.
   Die Reihenfolge in der Datei entscheidet dort.
   ============================================================ */

/* ---- Seitenkopf der Unterseiten --------------------------- */
/* .psc-nav ist position:fixed und 72px hoch (--psc-nav-h). Auf der Startseite
   gleicht der Hero das aus (padding-top: calc(var(--psc-nav-h) + 60px)); eine
   Unterseite hat keinen Hero, und das Grundpolster von .psc-section--compact
   faellt mit clamp(44px, 5vw, 76px) auf schmalen Schirmen unter die
   Leistenhoehe - der Seitentitel liefe dann unter die Leiste. */
.psc-pagehead {
  padding-top: calc(var(--psc-nav-h) + clamp(28px, 4vw, 56px));
  border-top: 0;
}

/* ---- Kontaktformular: drei Kollisionen aus dem Altbestand -- */
/* Alle drei Regeln, die hier korrigiert werden, stammen aus dem geforkten
   Contact-Form-7-Block bzw. aus der Grundfassung des nativen Formulars. Sie
   haben jeweils die hoehere Spezifitaet und haben die spaeteren, spezifischer
   gemeinten Regeln ueberstimmt. Das kostete Bauhoehe, ohne dass es jemandem
   ansehbar war. */

/* 1. .psc-form label > span (0,1,2) schlug .psc-form__phone (0,1,0): die
      Laendervorwahl stand deshalb UEBER dem Telefonfeld statt daneben und
      verbrauchte 91 statt 44 Pixel. */
.psc-form label > span.psc-form__phone {
  display: grid;
  gap: 8px;
  /* Mitwachsend statt fest: im zweispaltigen Raster ist die Zelle nur noch
     rund 240px breit, eine feste Vorwahlspalte von 8,5rem liesse fuer die
     Rufnummer keine 100px uebrig. Der untere Anschlag von 6,5rem haelt die
     breiteste Vorwahl (+420) lesbar. */
  grid-template-columns: clamp(6.5rem, 42%, 8.5rem) minmax(0, 1fr);
  margin-bottom: 0;
}
/* Die alte Regel in style.css:6985 stellte die Zeile unter 380px einspaltig,
   weil 8,5rem Vorwahl dort nichts mehr uebrig liessen. Mit dem clamp() oben
   passen beide Felder auch bei 320px Schirmbreite nebeneinander; die Zeile
   spart dadurch rund 47px Bauhoehe. Die alte Regel hat die geringere
   Spezifitaet und greift nicht mehr. */

/* 2. .psc-form label (0,1,1) schlug .psc-form__consent (0,1,0): das
      Einwilligungs-Label war nie flex, der Text rutschte unter die
      Ankreuzflaeche statt daneben. */
.psc-form label.psc-form__consent {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 14px;
  font-size: .84rem;
  font-weight: 400;
  line-height: 1.55;
}
.psc-form label.psc-form__consent > span { margin-bottom: 0; }

/* 3. .psc-form p (0,1,1) schlug .psc-form__hint und .psc-form-notice (0,1,0):
      deren Abstaende waren real 4px, jede Aenderung an ihnen wirkungslos. */
.psc-form > p.psc-form__hint { margin: 0 0 14px; }
.psc-form > p.psc-form-notice { margin: 0 0 14px; }

/* ---- Kontaktformular: kompaktes Raster -------------------- */
/* Container-Abfrage statt Media Query: ab 900px Fensterbreite steht das
   Formular neben dem Begleittext (.psc-contact) und ist dann selbst nur noch
   halb so breit. Eine an der Fensterbreite haengende Umschaltung erzeugte
   genau dort zwei unbrauchbar schmale Spalten. Browser ohne
   Container-Abfragen bleiben einspaltig - das ist der sichere Rueckfall. */
.psc-form {
  container-type: inline-size;
  container-name: pscform;
  padding: clamp(18px, 2.2vw, 26px);
}
.psc-form__grid {
  display: grid;
  gap: 12px 16px;
  align-items: start;
  margin-bottom: 14px;
}
@container pscform (min-width: 30rem) {
  .psc-form__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}
/* Im Raster traegt der Abstand die Luecke, nicht der Rand jedes Labels. */
.psc-form__grid > label { margin-bottom: 0; }
.psc-form label > span { margin-bottom: 4px; }
/* Attributselektor als Spezifitaets-Gegengewicht: die Feldregel in
   style.css:6989 nutzt :is(input[type="text"], …, textarea) und kommt damit
   auf (0,2,1). Ein blosses .psc-form textarea (0,1,1) verlöre gegen deren
   min-height von 44px - das Nachrichtenfeld liesse sich dann per resize auf
   eine einzige Zeile zusammenziehen. */
.psc-form textarea[rows] { min-height: 92px; }

/* ============================================================
   3.2 — SEITENBREITE UND LESERHYTHMUS
   ============================================================ */

/* Die Grundbreite war clamp(1180px, 86vw, 1984px). Der 86vw-Anteil laesst den
   Inhalt unbegrenzt mitwachsen: 1651px auf einem 1920er-Schirm, 1984px auf einem
   4K-Schirm. Uebliche Seiten deckeln bei 1140 bis 1400px (Bootstrap 1320,
   Tailwind max-w-7xl 1280). Der neue Deckel von 1360px laesst 1280 und 1440
   praktisch unveraendert und stoppt nur das Weiterwachsen darueber. */
:root {
  --psc-max: clamp(900px, 78vw, 1140px);

  /* Eine Zeile ist ab etwa 75 Zeichen unbequem zu lesen, weil das Auge den
     Zeilenanfang nicht mehr sicher findet. Fliesstext bekommt deshalb eine
     eigene Breite - und genau daraus entsteht der Rhythmus: schmaler Text,
     breite Zeichnung. */
  --psc-lesebreite: 68ch;
}

/* Der Belegstatus-Absatz lief mit 92ch auf gemessene 96 Zeichen je Zeile. */
.psc-disclaimer p { max-width: var(--psc-lesebreite); }

/* Fliesstext der Rechtsseiten und der Fachbeitraege. .psc-prose stand auf
   980px, das sind bei 17px Grundschrift rund 105 Zeichen. */
.psc-prose > p,
.psc-prose > ul,
.psc-prose > ol,
.psc-prose > blockquote { max-width: var(--psc-lesebreite); }

/* Zeichnungen und Tabellen duerfen weiterhin die volle Breite nutzen - sie
   brauchen sie, und der Unterschied zum schmalen Text traegt den Rhythmus. */
.psc-prose > figure,
.psc-prose > table,
.psc-prose > .psc-figure-block { max-width: none; }

/* ============================================================
   3.4 — HELLE GRUNDFLÄCHE MIT DUNKLEN BÄNDERN
   ------------------------------------------------------------
   Die Seite war durchgehend dunkelblau. Neu ist eine helle
   Grundfläche, auf der einzelne Bänder dunkel bleiben: die
   Navigationsleiste, die vier technischen Zeichnungen, das
   Kennwertpanel, der Ersparnisrechner, der Kontaktbereich und
   die Fußzeile.

   WARUM die Zeichnungen dunkel bleiben — das ist keine
   Geschmacksfrage, sondern gerechnet: Die beiden Thermalpole
   müssen sich laut Farbsystem AUCH in der Helligkeit
   unterscheiden, damit sie im Graustufendruck und bei
   Rotgrünschwäche unterscheidbar bleiben. Auf dunklem Grund
   gelingt das (warm #d1571d 4,64:1, kalt #8ae3f7 13,14:1,
   Trennung 2,83:1). Auf hellem Grund müssten BEIDE Pole dunkel
   sein, um überhaupt 4,5:1 zu erreichen — und verlieren damit
   zwangsläufig ihre Helligkeitstrennung. Geprüft wurden fünf
   Paare, das beste erreichte 4,49:1 Trennung bei nur 2,64:1
   Kontrast des Kaltpols. Es gibt kein Paar, das beides schafft.

   Umgesetzt über neu gebundene Token statt über doppelte
   Regeln: die Bänder definieren die --psc-Variablen um, alles
   darin erbt sie. Die vier Zeichnungen brauchten dadurch
   KEINE Änderung.
   ============================================================ */

:root {
  /* Flächen */
  --psc-bg:            #f2f6fb;
  --psc-bg-elev:       #ffffff;
  --psc-bg-card:       #ffffff;
  --psc-bg-raised:     #e9eff8;
  --psc-paper:         #ffffff;

  /* Linien. Navy mit Alpha statt Grau: bleibt in der Familie. */
  --psc-border:        rgba(47, 55, 94, 0.16);
  --psc-border-strong: rgba(47, 55, 94, 0.32);
  --psc-line:          rgba(47, 55, 94, 0.18);

  /* Schrift. Alle drei Stufen ≥ 5,2:1 auf #f2f6fb. */
  --psc-text:          #16223a;   /* 14,62:1 */
  --psc-text-muted:    #414e6b;   /*  7,66:1 */
  --psc-text-dim:      #5b6782;   /*  5,22:1 */
  --psc-white:         #16223a;   /* „weiß" heißt hier: kräftigster Text */

  /* Aktionsfarbe für hellen Grund — aus dem Farbsystem der Übergabe.
     #04b7d5 wäre hier falsch: auf Weiß nur 2,1:1. */
  --psc-accent:        #076a80;   /*  5,72:1, Weiß darauf 6,21:1 */
  --psc-accent-soft:   rgba(7, 106, 128, 0.10);
  --psc-accent-glow:   rgba(7, 106, 128, 0.26);

  --psc-neutral:       #5b6782;   /*  5,22:1 */
  --psc-navy-light:    #3a4370;   /*  8,73:1 */

  /* Belegstatus-Farben, für hellen Grund nachgerechnet. */
  --psc-proven:        #0f7a5f;   /*  4,88:1 */
  --psc-proven-soft:   rgba(15, 122, 95, 0.10);
  --psc-claimed:       #8a5a08;   /*  5,46:1 */
  --psc-claimed-soft:  rgba(138, 90, 8, 0.10);
  --psc-local:         #0f7a5f;
  --psc-local-soft:    rgba(15, 122, 95, 0.10);
  --psc-home:          #8a5a08;
  --psc-home-soft:     rgba(138, 90, 8, 0.10);

  /* Auf heller Fläche trägt ein tiefschwarzer Schatten nicht. */
  --psc-shadow:        0 24px 60px -34px rgba(47, 55, 94, 0.34);
}

/* ---- Dunkle Bänder ---------------------------------------- */
/* ACHTUNG: Jeder Baustein, der --psc-warm oder --psc-cold nutzt,
   MUSS innerhalb eines dieser Selektoren stehen. Auf heller
   Fläche erreicht der Kaltpol nur 1,34:1 und ist unsichtbar.
   Betroffen sind: die vier Zeichnungen, das Kennwertpanel,
   die Balken des Ersparnisrechners und die Studienwerte. */
.psc-metrics,
.psc-section--figure {
  --psc-bg:            #06101a;
  --psc-bg-elev:       #0a1724;
  --psc-bg-card:       #0f2031;
  --psc-bg-raised:     #142a3f;
  --psc-paper:         #0f2031;
  --psc-border:        rgba(173, 205, 229, 0.18);
  --psc-border-strong: rgba(173, 205, 229, 0.32);
  --psc-line:          rgba(173, 205, 229, 0.22);
  --psc-text:          #eef5fb;
  --psc-text-muted:    #a9b8c7;
  --psc-text-dim:      #8397aa;
  --psc-white:         #ffffff;
  --psc-accent:        #04b7d5;
  --psc-accent-soft:   rgba(4, 183, 213, 0.12);
  --psc-accent-glow:   rgba(4, 183, 213, 0.32);
  --psc-neutral:       #8ea6b8;
  --psc-navy-light:    #4a5488;
  /* Die Thermalpole MUESSEN hier zurueckgesetzt werden. Seit Fassung 3.5
     traegt :root die hellen Varianten; ohne diese vier Zeilen erben die
     dunklen Baender sie und das Kennwertpanel faellt auf 2,80:1. */
  --psc-warm:          #d1571d;
  --psc-warm-soft:     rgba(209, 87, 29, 0.14);
  --psc-cold:          #8ae3f7;
  --psc-cold-soft:     rgba(138, 227, 247, 0.14);
  --psc-proven:        #73e5c2;
  --psc-proven-soft:   rgba(115, 229, 194, 0.12);
  --psc-claimed:       #f1b768;
  --psc-claimed-soft:  rgba(241, 183, 104, 0.12);
  --psc-local:         #73e5c2;
  --psc-local-soft:    rgba(115, 229, 194, 0.12);
  --psc-home:          #f1b768;
  --psc-home-soft:     rgba(241, 183, 104, 0.12);
  --psc-shadow:        0 30px 80px -42px rgba(0, 0, 0, 0.86);
  color: var(--psc-text);
}
.psc-section--figure { background: var(--psc-bg); }

/* ---- Hero: hell, mit dunklem Kennwertpanel ----------------- */
.psc-hero__bg {
  background:
    radial-gradient(900px 520px at 78% 4%, rgba(7, 106, 128, 0.10), transparent 62%),
    linear-gradient(180deg, #ffffff 0%, var(--psc-bg) 62%);
}
.psc-hero__grid { opacity: .35; }
/* Die Belegstatus-Box stand auf einem dunklen Verlauf. */
.psc-hero__status {
  background: var(--psc-bg-elev);
  border: 1px solid var(--psc-border);
}
.psc-status-pill { background: var(--psc-accent-soft); }
/* Der Geisterknopf lag auf dunkler Fläche. */
.psc-btn--ghost {
  background: var(--psc-bg-elev);
  border-color: var(--psc-border-strong);
  color: var(--psc-text);
}
.psc-btn--ghost:hover { border-color: var(--psc-accent); color: var(--psc-accent); }

/* ---- Navigationsleiste ------------------------------------ */
.psc-nav { background: rgba(6, 16, 26, 0.94); }
.psc-nav.is-scrolled { background: rgba(6, 16, 26, 0.98); }
@media (max-width: 979px) { .psc-nav__links { background: rgba(6, 16, 26, 0.98); } }

/* ---- Fließtext und Redaktionsseiten ----------------------- */
main.psc-page, main.psc-blog, main.psc-single {
  background:
    radial-gradient(760px 400px at 88% 0%, rgba(7, 106, 128, 0.06), transparent 68%),
    linear-gradient(180deg, #ffffff 0, var(--psc-bg) 430px);
}
.psc-prose table { background: var(--psc-bg-elev); }
.psc-story-topics a,
.psc-article-navigation .nav-links a { background: var(--psc-bg-elev); }
.psc-article-context { background: var(--psc-bg-elev); border: 1px solid var(--psc-border); }
.psc-story-cover::after {
  background: linear-gradient(115deg, rgba(47, 55, 94, .06), rgba(47, 55, 94, .16));
}
.psc-story-cover__glyph { background: rgba(255, 255, 255, .78); }

/* ---- Karten ------------------------------------------------ */
/* Der Polish-Layer setzt hier einen fest verdrahteten dunklen
   Verlauf, den die Token nicht erreichen. */
.psc-card,
.psc-postcard,
.psc-card--post {
  background: var(--psc-bg-card);
  box-shadow: 0 1px 2px rgba(47, 55, 94, .06);
}
.psc-card--post__thumb {
  background:
    radial-gradient(circle at 70% 26%, rgba(7, 106, 128, .12), transparent 40%),
    linear-gradient(135deg, #eaf1f8, #dde7f3);
  border-bottom: 1px solid var(--psc-border);
}
.psc-card--post__cat { background: var(--psc-accent-soft); }

/* Der Polish-Layer setzt hier eine feste helle Schriftfarbe (#c1ced9),
   die die Token uebergeht - auf hellem Grund 1,48:1. */
.psc-hero__sub { color: var(--psc-text-muted); }

/* ---- Blog-Karten ------------------------------------------ */
/* Der Polish-Layer gibt ihnen einen fest verdrahteten dunklen Verlauf.
   Die Schrift kommt aber aus den Token und ist auf heller Flaeche dunkel -
   dunkel auf dunkel, also unlesbar. */
.psc-story-card { background: var(--psc-bg-card); }
.psc-story-cover {
  background:
    radial-gradient(circle at 72% 28%, rgba(7, 106, 128, .14), transparent 46%),
    linear-gradient(135deg, #eaf1f8, #dde7f3);
}
.psc-story-cover::after {
  background: linear-gradient(115deg, rgba(47, 55, 94, .04), rgba(47, 55, 94, .12));
}
.psc-story-cover__topic,
.psc-story-cover__index { color: var(--psc-text-muted); }
.psc-story-cover__glyph { background: rgba(255, 255, 255, .74); color: var(--psc-accent); }

/* ---- Zwei nachgemessene Korrekturen ------------------------ */
/* Die Kategoriepille erbte eine fest verdrahtete Cyan-Toenung
   (rgba(0,212,255,.10), style.css:2413). Zusammen mit der hellen
   Miniaturflaeche darunter blieb der Akzenttext bei 3,51:1.
   Auf nahezu weisser Flaeche sind es 5,96:1. */
.psc-card--post__cat {
  background: rgba(255, 255, 255, .88);
  border-color: var(--psc-border);
  color: var(--psc-accent);
}

/* Der Kicker steht auf --psc-local. #0f7a5f erreicht auf der hellen
   Grundflaeche 4,88:1 - knapp ueber der Grenze, und der radiale
   Farbschleier auf den Redaktionsseiten frisst die Reserve auf.
   Auf den Redaktionsseiten (.psc-page, .psc-blog) liegt zusaetzlich ein
   radialer Farbschleier darueber, der auch #0d6b53 noch auf 4,30:1
   gedrueckt hat. #0a5c47 gibt 7,34:1 und haelt auch dort. */
:root {
  --psc-local:  #0a5c47;
  --psc-proven: #0a5c47;
}

/* ============================================================
   3.5 — HELL ALS VORGABE, BLAU ALS AKZENT
   ------------------------------------------------------------
   Dunkel bleiben nur noch zwei Dinge: die vier technischen
   Zeichnungen und das Kennwertpanel im Hero. Navigationsleiste,
   Kontaktbereich, Fußzeile, Belegstatus-Band und der
   Ersparnisrechner sind hell. Blau trägt jetzt Linien, Kicker,
   Verweise, Schaltflächen und die beiden dunklen Akzentflächen.
   ============================================================ */

/* ---- Thermalpole für helle Flächen ------------------------- */
/* Nur für Stellen, an denen NEBEN der Farbe ein Textetikett steht:
   die Balken des Rechners (.psc-calc__bar-label), die Studienwerte
   (.psc-study__state), die Legende des Kennwertpanels und die
   Schichtbalken im Merkblatt. Dort ist Farbe nicht der alleinige
   Bedeutungsträger, deshalb genügt die Trennung von 1,87:1.
   Die vier ZEICHNUNGEN bleiben davon ausgenommen und dunkel: dort
   trägt die Farbe die Aussage über Dutzende Elemente hinweg, und
   das dunkle Paar erreicht 2,83:1 Trennung. */
:root {
  --psc-warm:      #6b2405;   /* 10,29:1 auf #f2f6fb */
  --psc-warm-soft: rgba(107, 36, 5, 0.12);
  --psc-cold:      #0f6d80;   /*  5,50:1 */
  --psc-cold-soft: rgba(15, 109, 128, 0.12);
}

/* ---- Navigationsleiste: hell ------------------------------- */
.psc-nav {
  background: rgba(255, 255, 255, 0.86);
  border-bottom-color: var(--psc-border);
}
.psc-nav.is-scrolled {
  background: rgba(255, 255, 255, 0.96);
  border-bottom-color: var(--psc-border-strong);
}
.psc-nav__links a { color: var(--psc-text-muted); }
.psc-nav__links a:hover,
.psc-nav__links .current-menu-item > a,
.psc-nav__links .current_page_item > a,
.psc-nav__links a[aria-current="page"] { color: var(--psc-text); }
/* Die weiße Trägerfläche des Logos ist auf heller Leiste überflüssig —
   das Wortzeichen ist Navy und erreicht auf Weiß 11,5:1. */
.psc-logo__plate { background: transparent; box-shadow: none; padding: 0; }
.psc-burger span,
.psc-burger span::before,
.psc-burger span::after { background: var(--psc-text); }
@media (max-width: 979px) {
  .psc-nav__links { background: rgba(255, 255, 255, 0.98); }
}

/* ---- Kontaktbereich: hell mit blauem Schleier -------------- */
.psc-section--accent { background: var(--psc-bg-elev); }
.psc-section--accent::before {
  background:
    radial-gradient(720px 380px at 50% 0%, rgba(7, 106, 128, 0.09), transparent 66%);
}

/* ---- Fußzeile: hell --------------------------------------- */
.psc-footer {
  background: var(--psc-bg-raised);
  border-top: 1px solid var(--psc-border);
}

/* ---- Belegstatus-Band: hell, blaue Kante ------------------- */
.psc-disclaimer {
  background: var(--psc-bg-elev);
  border-top: 1px solid var(--psc-border);
  border-left: 3px solid var(--psc-accent);
  border-right: 0;
  border-bottom: 0;
  border-radius: 0;
}

/* ---- Ersparnisrechner: hell ------------------------------- */
/* Die beiden Balken tragen ihr Textetikett daneben, deshalb dürfen
   sie die hellen Thermalpole nutzen. */
.psc-calc__results { background: var(--psc-bg-elev); }

/* ============================================================
   3.7 — BREITENRHYTHMUS UND ERSTER BILDSCHIRM
   ------------------------------------------------------------
   Der Auftraggeber hat den Punkt genau benannt: die Seite darf
   breit sein, muss aber immer wieder in die Schmale zurück,
   sonst fühlt sie sich eingeengt an. Eine einzige Breite für
   alles war der Fehler — sie war entweder überall zu weit oder
   überall zu eng.

   Drei Stufen statt einer:
     --weit    Karten, Zeichnungen, Hero — Fläche zum Atmen
     Standard  Formulare, Karte, Bausteine mittlerer Dichte
     --narrow  Fließtext, Zitate, Belegstatus — Lesebreite
   ============================================================ */

:root {
  /* 1520px ist die Obergrenze für die weiten Bänder. Auf einem
     1440er-Schirm greift 94vw und damit 1354px, auf 1920 die 1520. */
  --psc-max-weit: min(94vw, 1520px);
}

.psc-container--weit   { max-width: var(--psc-max-weit); }
.psc-container--narrow { max-width: 780px; }

/* ---- Hero: erster Bildschirm ohne Scrollen ----------------- */
/* Vorher 1890px hoch bei 900px Schirm — der Scrollhinweis lag
   990px unterhalb der Kante. Zwei Ursachen: die Textspalte war
   durch den engen Container auf 377px zusammengedrückt (die
   Überschrift brach auf fünf Zeilen), und die Polster waren fest
   statt an der Schirmhöhe bemessen. */
.psc-hero {
  min-height: 100svh;
  padding: calc(var(--psc-nav-h) + clamp(12px, 3.5vh, 56px)) 0 clamp(58px, 9vh, 104px);
  display: flex;
  align-items: center;
}
@media (min-width: 980px) {
  .psc-hero__layout {
    /* minmax(0, …) ist entscheidend: ohne die Null als Untergrenze
       nimmt sich die rechte Spalte ihre Inhaltsbreite (540px) und
       die linke bekommt nur den Rest. */
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
    gap: clamp(32px, 4vw, 72px);
  }
}
.psc-hero__col { max-width: 46rem; }

/* Vertikaler Rhythmus im Hero an der Schirmhöhe bemessen. */
.psc-hero h1        { margin-top: clamp(8px, 1.6vh, 24px); }
.psc-hero__sub      { margin-top: clamp(10px, 2vh, 28px); }
.psc-hero__actions  { margin-top: clamp(14px, 2.6vh, 34px); }
.psc-hero__status   { margin-top: clamp(14px, 2.6vh, 34px); padding: clamp(12px, 1.6vh, 20px) clamp(14px, 1.4vw, 20px); }

/* Der Belegstatus-Kasten trug zwei lange Absätze und allein 330px.
   Derselbe Text steht vollständig im Belegstatus-Band am Seitenfuß;
   im Hero genügt die Marke und der Weg zum Merkblatt. Auf niedrigen
   Schirmen entfallen die Absätze ganz. */
/* Die Schriftgroessen im Hero werden an Breite UND Hoehe bemessen.
   Ohne die vh-Grenze brach "Ein neues Geschaeftsfeld." bei 73px in der
   695px breiten Spalte um - aus drei Zeilen wurden fuenf, und allein
   die Ueberschrift war 351px hoch. */
.psc-hero h1 {
  font-size: clamp(30px, min(4.4vw, 7vh), 58px);
  line-height: 1.04;
}
.psc-hero__sub {
  font-size: clamp(15px, min(1.35vw, 2.1vh), 20px);
  line-height: 1.55;
  max-width: 56ch;
}
/* Der Belegstatus-Satz erscheint nur, wenn der Schirm ihn traegt. */
@media (max-height: 950px) {
  /* Auf niedrigen Schirmen bleibt nur Marke und Weg zum Merkblatt. */
  .psc-hero__status p { display: none; }
  .psc-hero__status   { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
  .psc-hero__status-head { margin: 0; }
}
@media (max-height: 800px) {
  .psc-hero h1 { font-size: clamp(34px, 4.6vh, 56px); line-height: 1.04; }
  .psc-hero__sub { font-size: clamp(15px, 2vh, 19px); }
}

/* Auf niedrigen Schirmen ist das Kennwertpanel der Engpass, nicht der Text:
   es baut 618px und laesst bei 768px Schirmhoehe nichts mehr uebrig. Gekuerzt
   werden die Farbskala und ihre Erlaeuterung — beides ist Beiwerk. Die
   Belegstatus-Zeile unter JEDER Zahl bleibt stehen; sie ist der Grund, warum
   die Zahlen ueberhaupt gezeigt werden duerfen. */
@media (max-height: 820px) {
  .psc-metrics__scale,
  .psc-metrics__note { display: none; }
  .psc-metrics { padding: clamp(14px, 1.8vh, 22px); }
  .psc-metrics__row { padding-block: clamp(6px, 1vh, 12px); }
}

/* ---- Artikelseiten ---------------------------------------- */
/* Die Beitragsvorlage war bei der Hellumstellung nicht pruefbar, weil es
   damals keine Beitraege gab. Das Inhaltsverzeichnis trug einen fest
   verdrahteten dunklen Grund (rgba(10,23,36,.82)) bei jetzt dunkler
   Schrift — 1,35:1. */
.psc-article-toc,
.psc-article-toc-mobile {
  background: var(--psc-bg-elev);
  border: 1px solid var(--psc-border);
}
.psc-article-toc a { color: var(--psc-text-muted); }
.psc-article-toc a:hover,
.psc-article-toc a.is-current { color: var(--psc-accent); }
/* Datum und Lesezeit standen auf --psc-text-dim und kamen auf dem
   Farbschleier der Beitragsseiten nur auf 3,76:1. */
.psc-article__meta,
.psc-article__meta time,
.psc-article__meta span { color: var(--psc-text-muted); }

/* Auf den Redaktionsseiten liegt ein radialer Farbschleier ueber der
   Flaeche. Er kostet den Akzent rund 1,6 Kontraststufen (5,72:1 -> 4,13:1).
   Dort deshalb eine Stufe dunkler binden, statt den Schleier zu opfern. */
main.psc-single,
main.psc-blog,
main.psc-page {
  --psc-accent:    #05596a;
  --psc-text-dim:  #48546f;
}