/* Power4Success · Design Tokens v1.0 · Oktober 2026
   Fonts: <link rel="stylesheet" href="fonts.css"> (Geist lokal, Ordner fonts/)
   Breakpoints: sm 640 · md 960 · lg 1280 · xl 1600 */
:root{
/* Farbe · Kern */
--p4s-paper:#F4F0E6;--p4s-white:#FFFFFF;--p4s-ink:#15110E;--p4s-orange:#FF5A1F;--p4s-slate:#46525C;--p4s-muted:#8A857C;
/* Farbe · Bereiche */
--p4s-ls:#287A72;--p4s-dt:#3A5FC8;--p4s-in:#94722A;
/* Abstufungen (auf Paper gemischt) */
--p4s-slate-70:#7A8185;--p4s-slate-45:#A6A9A8;--p4s-slate-20:#D1D0CA;--p4s-slate-10:#E3E0D8;
--p4s-orange-70:#FC875B;--p4s-orange-45:#F9AD8C;--p4s-orange-20:#F6D2BE;--p4s-orange-10:#F5E1D2;
--p4s-ls-45:#98BBB2;--p4s-ls-10:#E0E4DA;--p4s-dt-45:#A0AFD9;--p4s-dt-10:#E1E2E3;--p4s-in-45:#C9B791;--p4s-in-10:#EAE3D3;
--p4s-ink-70:#58544F;--p4s-ink-20:#C7C3BB;--p4s-ink-10:#DEDAD0;
/* Semantik */
--p4s-bg:var(--p4s-paper);--p4s-surface:var(--p4s-white);--p4s-surface-sunk:var(--p4s-ink-10);--p4s-fg:var(--p4s-ink);--p4s-fg-muted:#6E6A62;
--p4s-rule:rgba(21,17,14,.14);--p4s-rule-strong:var(--p4s-ink);--p4s-accent:var(--p4s-orange);--p4s-focus:var(--p4s-ink);
/* Typografie */
--p4s-font-sans:"Geist",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
--p4s-fs-display:clamp(56px,8vw,120px);--p4s-fs-h1:clamp(40px,5vw,64px);--p4s-fs-h2:clamp(28px,3.2vw,40px);
--p4s-fs-lead:20px;--p4s-fs-body:16px;--p4s-fs-small:14px;--p4s-fs-label:12px;
--p4s-track-display:-.045em;--p4s-track-head:-.035em;--p4s-track-label:.14em;
/* Abstand · 4er-Raster */
--p4s-s1:4px;--p4s-s2:8px;--p4s-s3:12px;--p4s-s4:16px;--p4s-s5:24px;--p4s-s6:32px;--p4s-s7:48px;--p4s-s8:64px;--p4s-s9:96px;--p4s-s10:128px;
/* Layout */
--p4s-max:1440px;--p4s-cols:12;--p4s-gutter:24px;--p4s-margin:clamp(20px,5vw,80px);
/* Form */
--p4s-radius:0;--p4s-border:1px;
/* Motion */
--p4s-ease:cubic-bezier(.77,0,.18,1);--p4s-ease-out:cubic-bezier(.2,0,0,1);
--p4s-dur-xs:120ms;--p4s-dur-s:240ms;--p4s-dur-m:480ms;--p4s-dur-l:900ms;
}
/* Logo */
.p4s-wordmark{font-family:var(--p4s-font-sans);font-weight:600;letter-spacing:-.045em;line-height:.95;white-space:nowrap;color:var(--p4s-ink)}
.p4s-monogram{font-family:var(--p4s-font-sans);font-weight:600;letter-spacing:-.06em;line-height:.86;white-space:nowrap;color:var(--p4s-ink)}
.p4s-wordmark .p4s-4,.p4s-monogram .p4s-4{color:var(--p4s-orange)}
.p4s-on-ink .p4s-wordmark,.p4s-on-ink .p4s-monogram,.p4s-wordmark.p4s-inv,.p4s-monogram.p4s-inv{color:var(--p4s-paper)}
/* Basis */
.p4s-label{font-family:var(--p4s-font-sans);font-size:var(--p4s-fs-label);font-weight:300;letter-spacing:var(--p4s-track-label);text-transform:uppercase}
.p4s-link{color:var(--p4s-ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em;transition:text-decoration-color var(--p4s-dur-s) var(--p4s-ease-out)}
.p4s-link:hover{text-decoration-color:var(--p4s-orange);text-decoration-thickness:2px}
/* Buttons */
.p4s-btn{display:inline-flex;align-items:center;gap:var(--p4s-s3);font-family:var(--p4s-font-sans);font-size:13px;font-weight:300;letter-spacing:.12em;text-transform:uppercase;padding:14px 22px;min-height:48px;border:1px solid var(--p4s-ink);background:var(--p4s-ink);color:var(--p4s-paper);cursor:pointer;text-decoration:none;border-radius:var(--p4s-radius);transition:background var(--p4s-dur-s) var(--p4s-ease-out),color var(--p4s-dur-s) var(--p4s-ease-out)}
.p4s-btn:hover{background:#000}
.p4s-btn--accent{background:var(--p4s-orange);border-color:var(--p4s-orange);color:var(--p4s-ink)}
.p4s-btn--accent:hover{background:var(--p4s-ink);border-color:var(--p4s-ink);color:var(--p4s-paper)}
.p4s-btn--ghost{background:transparent;color:var(--p4s-ink)}
.p4s-btn--ghost:hover{background:var(--p4s-ink);color:var(--p4s-paper)}
.p4s-btn:focus-visible,.p4s-input:focus-visible,.p4s-link:focus-visible{outline:2px solid var(--p4s-focus);outline-offset:2px;box-shadow:0 0 0 5px var(--p4s-orange)}
.p4s-btn[disabled]{opacity:.4;cursor:not-allowed}
/* Formular */
.p4s-field{display:flex;flex-direction:column;gap:var(--p4s-s2)}
.p4s-input{font-family:var(--p4s-font-sans);font-size:16px;padding:13px 14px;min-height:48px;border:1px solid var(--p4s-ink);background:var(--p4s-white);color:var(--p4s-ink);border-radius:var(--p4s-radius)}
.p4s-input::placeholder{color:#8A857C}
.p4s-hint{font-size:13px;color:var(--p4s-fg-muted)}
/* Tags */
.p4s-tag{display:inline-flex;align-items:center;gap:6px;font-family:var(--p4s-font-sans);font-size:11px;letter-spacing:.14em;text-transform:uppercase;padding:5px 9px;border:1px solid var(--c,var(--p4s-slate));color:var(--p4s-ink)}
.p4s-tag::before{content:"";width:6px;height:6px;background:var(--c,var(--p4s-slate))}
.p4s-tag--ls{--c:var(--p4s-ls)}.p4s-tag--dt{--c:var(--p4s-dt)}.p4s-tag--in{--c:var(--p4s-in)}
/* Karte */
.p4s-card{background:var(--p4s-white);border:1px solid var(--p4s-rule);display:flex;flex-direction:column;gap:var(--p4s-s4);padding:var(--p4s-s5);border-top:4px solid var(--c,var(--p4s-ink));transition:border-color var(--p4s-dur-s) var(--p4s-ease-out)}
.p4s-card:hover{border-color:var(--p4s-ink)}
