:root{--min-screen-width:390px;--max-screen-width:1400px;--brand-50:hsla(205.71000000000004,87.5%,96.86%,1);--brand-100:hsla(205.71000000000004,100%,93.14%,1);--brand-200:hsla(205.97000000000003,100%,86.86%,1);--brand-300:hsla(205.18000000000006,96.55%,77.25%,1);--brand-400:hsla(204,80.31%,62.16%,1);--brand-500:hsla(200.20000000000005,90.74%,42.35%,1);--brand-600:hsla(199.89,100%,34.31%,1);--brand-700:hsla(200.27999999999997,100%,27.84%,1);--brand-800:hsla(200.87,100%,22.55%,1);--brand-900:hsla(202.30999999999995,100%,15.29%,1);--neutral-50:hsla(40,27.27%,97.84%,1);--neutral-100:hsla(40,12%,95.1%,1);--neutral-200:hsla(45,7.69%,89.8%,1);--neutral-300:hsla(40,6.82%,82.75%,1);--neutral-400:hsla(40,3.26%,63.92%,1);--neutral-500:hsla(40,2.36%,49.8%,1);--neutral-600:hsla(36,2.54%,38.63%,1);--neutral-700:hsla(30,2.67%,29.41%,1);--neutral-800:hsla(45,3.64%,21.57%,1);--neutral-900:hsla(40,3.61%,16.27%,1);--deep-mid:hsla(200.81999999999994,57.65%,16.67%,1);--primary:hsla(199.89,100%,34.31%,1);--primary-hover:hsla(200.27999999999997,100%,27.84%,1);--primary-text:hsla(0,0%,100%,1);--brand-surface:hsla(200.20000000000005,90.74%,42.35%,1);--link:hsla(200.27999999999997,100%,27.84%,1);--link-hover:hsla(200.87,100%,22.55%,1);--text-main:hsla(40,3.61%,16.27%,1);--text-soft:hsla(30,2.67%,29.41%,1);--text-muted:hsla(36,2.54%,38.63%,1);--text-placeholder:hsla(40,3.26%,63.92%,1);--text-on-dark-strong:hsla(0,0%,100%,1);--text-on-dark:hsla(205.71000000000004,100%,93.14%,1);--text-on-dark-soft:hsla(205.97000000000003,100%,86.86%,1);--text-on-dark-muted:hsla(205.18000000000006,96.55%,77.25%,1);--bg-body:hsla(0,0%,100%,1);--bg-alt:hsla(40,27.27%,97.84%,1);--bg-warm:hsla(40,12%,95.1%,1);--bg-tint:hsla(205.71000000000004,87.5%,96.86%,1);--bg-tint-2:hsla(205.71000000000004,100%,93.14%,1);--bg-dark:hsla(202.30999999999995,100%,15.29%,1);--border:hsla(45,7.69%,89.8%,1);--border-strong:hsla(40,6.82%,82.75%,1);--border-brand:hsla(205.97000000000003,100%,86.86%,1);--border-brand-soft:hsla(205.71000000000004,100%,93.14%,1);--danger:hsla(0,68.89%,44.12%,1);--danger-bg:hsla(5.449999999999989,100%,97.84%,1);--danger-border:hsla(6.980000000000018,58.9%,85.69%,1);--space-3xs:clamp(0.25rem,calc(0vw + 0.25rem),0.25rem);--space-2xs:clamp(0.5rem,calc(0vw + 0.5rem),0.5rem);--space-xs:clamp(0.75rem,calc(0vw + 0.75rem),0.75rem);--space-s:clamp(1rem,calc(0vw + 1rem),1rem);--space-m:clamp(1.25rem,calc(0vw + 1.25rem),1.25rem);--space-l:clamp(1.5rem,calc(0vw + 1.5rem),1.5rem);--space-xl:clamp(2rem,calc(0vw + 2rem),2rem);--space-2xl:clamp(2.5rem,calc(0vw + 2.5rem),2.5rem);--space-3xl:clamp(3rem,calc(0vw + 3rem),3rem);--space-4xl:clamp(3.5rem,calc(0vw + 3.5rem),3.5rem);--space-5xl:clamp(4rem,calc(0vw + 4rem),4rem);--space-6xl:clamp(5rem,calc(0vw + 5rem),5rem);--text-xs:clamp(0.81rem,calc(0vw + 0.81rem),0.81rem);--text-s:clamp(0.94rem,calc(0vw + 0.94rem),0.94rem);--text-m:clamp(1.06rem,calc(0vw + 1.06rem),1.06rem);--text-l:clamp(1.13rem,calc(0.1vw + 1.1rem),1.19rem);--text-xl:clamp(1.25rem,calc(0.2vw + 1.2rem),1.38rem);--text-2xl:clamp(1.5rem,calc(0.4vw + 1.4rem),1.75rem);--text-3xl:clamp(1.75rem,calc(0.79vw + 1.56rem),2.25rem);--text-4xl:clamp(2.13rem,calc(0.99vw + 1.88rem),2.75rem);--text-display:clamp(2.13rem,calc(1.78vw + 1.69rem),3.25rem);--text-stat:clamp(2.13rem,calc(0.79vw + 1.93rem),2.63rem);--font-sans:"Source Sans 3 Variable","Source Sans 3",system-ui,-apple-system,"Segoe UI",sans-serif;--leading-tight:1.12;--leading-snug:1.15;--leading-heading:1.35;--leading-relaxed:1.5;--leading-normal:1.65;--tracking-heading:-0.02em;--tracking-display:-0.03em;--tracking-eyebrow:0.14em;--tracking-label:0.10em;--weight-regular:400;--weight-semibold:600;--weight-bold:700;--weight-black:800;--measure:68ch;--section-space-s:clamp(2rem,1.6621rem + 1.3861vw,2.875rem);--section-space-m:clamp(2.75rem,2.0743rem + 2.7723vw,4.5rem);--section-space-l:clamp(2.75rem,1.8812rem + 3.5644vw,5rem);--space-gutter:clamp(1.25rem,-0.198rem + 5.9406vw,5rem);--width-full:1400px;--width-content:1280px;--width-narrow:720px;--columns-1:repeat(1,minmax(0,1fr));--columns-2:repeat(2,minmax(0,1fr));--columns-3:repeat(3,minmax(0,1fr));--columns-4:repeat(4,minmax(0,1fr));--columns-5:repeat(5,minmax(0,1fr));--columns-6:repeat(6,minmax(0,1fr));--columns-7:repeat(7,minmax(0,1fr));--columns-8:repeat(8,minmax(0,1fr));--radius-xs:clamp(0.25rem,calc(0vw + 0.25rem),0.25rem);--radius-s:clamp(0.5rem,calc(0vw + 0.5rem),0.5rem);--radius-m:clamp(0.63rem,calc(0vw + 0.63rem),0.63rem);--radius-l:clamp(0.75rem,calc(0vw + 0.75rem),0.75rem);--radius-xl:clamp(0.88rem,calc(0vw + 0.88rem),0.88rem);--radius-2xl:clamp(1rem,calc(0vw + 1rem),1rem);--radius-full:999px;--shadow-s:0 1px 2px rgba(43,42,40,.05),0 2px 10px -4px rgba(43,42,40,.08);--shadow-m:0 2px 4px rgba(43,42,40,.06),0 12px 28px -12px rgba(0,49,78,.35);--shadow-l:0 4px 10px rgba(43,42,40,.08),0 18px 34px -12px rgba(0,49,78,.42);--shadow-cta:0 4px 8px rgba(43,42,40,.06),0 24px 48px -22px rgba(0,49,78,.4);--shadow-bar:0 -6px 20px -12px rgba(43,42,40,.35);--shadow-hero:inset 0 0 0 2px rgba(10,140,206,.22),0 8px 20px -8px rgba(43,42,40,.14),0 30px 60px -30px rgba(0,49,78,.3);--ring-placeholder:inset 0 0 0 2px rgba(10,140,206,.22);--ring-placeholder-hover:inset 0 0 0 2px rgba(10,140,206,.40);--ring-on-dark:inset 0 0 0 2px rgba(255,255,255,.28);--gradient-cta:linear-gradient(135deg,#0075af 0%,#004b73 100%);--gradient-hero:linear-gradient(155deg,#0075af 0%,#004b73 60%,#00314e 100%);--gradient-deep:linear-gradient(160deg,#2b2a28 0%,#123243 55%,#00314e 100%);--gradient-tint:linear-gradient(180deg,#f0f8fe 0%,#ffffff 100%);--gradient-warm:linear-gradient(180deg,#f4f3f1 0%,#fbfaf8 100%);--gradient-placeholder:linear-gradient(140deg,#dcf0ff 0%,#f0f8fe 45%,#ffffff 100%);--glow:radial-gradient(circle,rgba(255,255,255,.16),transparent 70%);--ease:cubic-bezier(.22,1,.36,1);--duration-fast:.16s;--duration:.18s;--duration-move:.35s;--duration-rise:.55s;--focus-width:2px;--focus-offset:2px;--focus-color:var(--link);--header-height:88px;--border-on-dark:rgba(255,255,255,.16);--surface-on-dark:rgba(255,255,255,.07);--surface-glow:rgba(255,255,255,.16);}.btn{display:flex;align-items:center;justify-content:center;gap:var(--space-3xs);padding:var(--space-xs) var(--space-s);background:var(--gradient-cta);color:#fff;font-size:var(--text-m);font-weight:600;border-radius:var(--radius-m);border:1px solid var(--primary-d-1);box-shadow:var(--shadow-m);transition:all 0.25s ease-in-out;outline:0;cursor:pointer;}.btn.small{font-size:var(--text-s);padding:var(--space-xs) var(--space-s);}.btn.large{font-size:var(--text-l);padding:var(--space-s) var(--space-m);}.btn.tertiary{background:var(--tertiary);border-color:var(--tertiary-d-1);}.btn.ghost{color:var(--dark-80);background:transparent;border-color:transparent;box-shadow:none;}.btn.slight{color:var(--dark-80);background:var(--bg-surface);border-color:var(--border-primary);box-shadow:var(--shadow-s);}.btn.secondary{background:var(--secondary);border:1px solid var(--border-strong);color:var(--text-main);}.btn.ghost:hover{background:var(--dark-10);}.btn.slight:hover{background:var(--dark-5);}.btn.tertiary:hover{background:var(--tertiary-d-1);}.btn:focus{outline:4px solid var(--primary-l-3);outline-offset:2px;}.btn.no-bg{color:var(--dark-80);background:transparent;box-shadow:none;border-color:transparent;}.btn.no-bg:hover{color:var(--dark);}.btn.secondary:hover{border-color:var(--primary);background:var(--bg-tint);}.btn:hover{box-shadow:--shadow-l;transform:translateY(-1px);}.badge{display:flex;align-items:center;justify-content:center;gap:var(--space-4xs);padding:var(--space-2xs) var(--space-s);background:var(--dark-10);color:var(--primary);font-size:var(--text-s);font-weight:500;border-radius:var(--radius-full);border:0;outline:0;}.badge.secondary{color:var(--secondary);}.link{color:var(--primary);font-size:var(--text-m);font-weight:600;letter-spacing:0.05rem;box-shadow:0 2px 0 var(--primary-20);text-decoration:none;transition:all 0.15s ease-in-out;}.link:hover{box-shadow:0 2px 0 var(--primary-40);}.link:focus{background:var(--primary-10);}.link.secondary{color:var(--secondary);border-color:var(--secondary-20);}.link.tertiary{color:var(--tertiary);border-color:var(--tertiary-20);}.input{padding:var(--space-xs) var(--space-s);background:var(--dark-5);color:var(--text-title);font-size:var(--text-m);font-weight:500;border-radius:var(--radius-m);border:1px solid var(--border-primary);box-shadow:var(--shadow-xs);transition:all 0.25s ease-in-out;appearance:none;outline:0;}.input:focus{background:var(--primary-20);border-color:var(--primary);box-shadow:var(--shadow-l);}.input:hover{border-color:var(--primary);background:transparent;box-shadow:var(--shadow-l);}.input::placeholder{color:var(--dark-40);}.input:invalid{border-color:var(--error);background:var(--error-10);}.input:disabled{cursor:not-allowed;opacity:.75;box-shadow:none;background:var(--dark-10);}.select{padding:var(--space-xs) var(--space-s);background:var(--dark-5);color:var(--text-body);font-size:var(--text-m);font-weight:500;border-radius:var(--radius-m);border:1px solid var(--border-primary);box-shadow:var(--shadow-xs);transition:all 0.25s ease-in-out;outline:0;}.select:focus{background:var(--primary-20);border-color:var(--primary);}.select:hover{border-color:var(--primary);}.select::placeholder{color:var(--dark-40);}.select:invalid{border-color:var(--error);background:var(--error-10);}.select:disabled{cursor:not-allowed;opacity:.75;box-shadow:none;background:var(--dark-10);}.card{display:grid;gap:var(--space-xs);padding:var(--space-m);font-size:var(--text-m);color:var(--text-body);background:var(--bg-surface);line-height:1.3;border-radius:var(--radius-m);box-shadow:var(--shadow-m);}.card.secondary{background:var(--secondary);color:#fff;}.card.primary{background:var(--primary);color:#fff;}.icon{color:var(--primary);width:var(--space-2xl);height:auto;font-size:var(--space-2xl);}.icon.large{width:var(--space-3xl);font-size:var(--space-3xl);}.icon.secondary{color:var(--secondary);}.icon.tertiary{color:var(--tertiary);}.icon.outline{padding:0.5em;border:1px solid var(--border-primary);border-radius:100%;box-sizing:content-box;}.icon.filled{padding:0.5em;border-radius:100%;box-sizing:content-box;background:var(--dark-10);}.icon.small{width:var(--space-l);font-size:var(--space-l);}.avatar{width:var(--space-2xl);height:var(--space-2xl);border-radius:100%;box-shadow:var(--shadow-m);object-fit:cover;}.avatar.small{width:var(--space-l);height:var(--space-l);}.avatar.large{width:var(--space-4xl);height:var(--space-4xl);}.divider{min-width:100%;width:100%;max-width:100%;min-height:1px;height:1px;max-height:1px;background:var(--border-primary);margin:var(--space-m) 0;border:0;}.divider.vertical{min-width:1px;width:1px;max-width:1px;min-height:100%;height:100%;max-height:100%;}.checkbox{appearance:none;display:grid;place-content:center;border:2px solid var(--dark-40);border-radius:var(--radius-s);width:clamp(1.13rem,calc(0.4vw + 1.03rem),1.38rem);height:clamp(1.13rem,calc(0.4vw + 1.03rem),1.38rem);}.checkbox:checked:before{transform:scale(1);}.checkbox::before{content:"";width:1em;height:1em;box-shadow:inset 1em 1em #fff;clip-path:polygon(14% 44%,0 65%,50% 100%,100% 16%,80% 0%,43% 62%);transform:scale(0);transition:transform 0.2s;}.checkbox:hover{border-color:var(--primary);}.checkbox:focus{outline:3px solid var(--primary-l-3);outline-offset:2px;}.checkbox:checked{background:var(--primary);border-color:var(--primary);}.radio{appearance:none;display:grid;place-content:center;border:2px solid var(--dark-40);border-radius:var(--radius-full);width:clamp(1.13rem,calc(0.4vw + 1.03rem),1.38rem);height:clamp(1.13rem,calc(0.4vw + 1.03rem),1.38rem);}.radio:checked:before{transform:scale(1);}.radio::before{content:"";width:1em;height:1em;border-radius:100%;transform:scale(0);transition:transform 0.2s;background:var(--primary);}.radio:hover{border-color:var(--primary);}.radio:focus{outline:3px solid var(--primary-l-3);outline-offset:2px;}.radio:checked{border-color:var(--primary);}.bg-primary{background-color:var(--primary);}.text-primary{color:var(--primary);}.border-primary{border-color:var(--primary);}.bg-primary-hover{background-color:var(--primary-hover);}.text-primary-hover{color:var(--primary-hover);}.border-primary-hover{border-color:var(--primary-hover);}.bg-primary-text{background-color:var(--primary-text);}.text-primary-text{color:var(--primary-text);}.border-primary-text{border-color:var(--primary-text);}.bg-brand-surface{background-color:var(--brand-surface);}.text-brand-surface{color:var(--brand-surface);}.border-brand-surface{border-color:var(--brand-surface);}.bg-link{background-color:var(--link);}.text-link{color:var(--link);}.border-link{border-color:var(--link);}.bg-link-hover{background-color:var(--link-hover);}.text-link-hover{color:var(--link-hover);}.border-link-hover{border-color:var(--link-hover);}.text-main{color:var(--text-main);}.text-soft{color:var(--text-soft);}.text-muted{color:var(--text-muted);}.text-placeholder{color:var(--text-placeholder);}.text-on-dark-strong{color:var(--text-on-dark-strong);}.text-on-dark{color:var(--text-on-dark);}.text-on-dark-soft{color:var(--text-on-dark-soft);}.text-on-dark-muted{color:var(--text-on-dark-muted);}.bg-body{background-color:var(--bg-body);}.bg-alt{background-color:var(--bg-alt);}.bg-warm{background-color:var(--bg-warm);}.bg-tint{background-color:var(--bg-tint);}.bg-tint-2{background-color:var(--bg-tint-2);}.bg-dark{background-color:var(--bg-dark);}.border-border{border-color:var(--border);}.border-strong{border-color:var(--border-strong);}.border-brand{border-color:var(--border-brand);}.border-brand-soft{border-color:var(--border-brand-soft);}.bg-danger{background-color:var(--danger);}.text-danger{color:var(--danger);}.border-danger{border-color:var(--danger);}.bg-danger-bg{background-color:var(--danger-bg);}.text-danger-bg{color:var(--danger-bg);}.border-danger-bg{border-color:var(--danger-bg);}.bg-danger-border{background-color:var(--danger-border);}.text-danger-border{color:var(--danger-border);}.border-danger-border{border-color:var(--danger-border);}.padding-3xs{padding:var(--space-3xs);}.padding-2xs{padding:var(--space-2xs);}.padding-xs{padding:var(--space-xs);}.padding-s{padding:var(--space-s);}.padding-m{padding:var(--space-m);}.padding-l{padding:var(--space-l);}.padding-xl{padding:var(--space-xl);}.padding-2xl{padding:var(--space-2xl);}.padding-3xl{padding:var(--space-3xl);}.padding-4xl{padding:var(--space-4xl);}.padding-5xl{padding:var(--space-5xl);}.padding-6xl{padding:var(--space-6xl);}.padding-left-3xs{padding-left:var(--space-3xs);}.padding-left-2xs{padding-left:var(--space-2xs);}.padding-left-xs{padding-left:var(--space-xs);}.padding-left-s{padding-left:var(--space-s);}.padding-left-m{padding-left:var(--space-m);}.padding-left-l{padding-left:var(--space-l);}.padding-left-xl{padding-left:var(--space-xl);}.padding-left-2xl{padding-left:var(--space-2xl);}.padding-left-3xl{padding-left:var(--space-3xl);}.padding-left-4xl{padding-left:var(--space-4xl);}.padding-left-5xl{padding-left:var(--space-5xl);}.padding-left-6xl{padding-left:var(--space-6xl);}.padding-right-3xs{padding-right:var(--space-3xs);}.padding-right-2xs{padding-right:var(--space-2xs);}.padding-right-xs{padding-right:var(--space-xs);}.padding-right-s{padding-right:var(--space-s);}.padding-right-m{padding-right:var(--space-m);}.padding-right-l{padding-right:var(--space-l);}.padding-right-xl{padding-right:var(--space-xl);}.padding-right-2xl{padding-right:var(--space-2xl);}.padding-right-3xl{padding-right:var(--space-3xl);}.padding-right-4xl{padding-right:var(--space-4xl);}.padding-right-5xl{padding-right:var(--space-5xl);}.padding-right-6xl{padding-right:var(--space-6xl);}.padding-top-3xs{padding-top:var(--space-3xs);}.padding-top-2xs{padding-top:var(--space-2xs);}.padding-top-xs{padding-top:var(--space-xs);}.padding-top-s{padding-top:var(--space-s);}.padding-top-m{padding-top:var(--space-m);}.padding-top-l{padding-top:var(--space-l);}.padding-top-xl{padding-top:var(--space-xl);}.padding-top-2xl{padding-top:var(--space-2xl);}.padding-top-3xl{padding-top:var(--space-3xl);}.padding-top-4xl{padding-top:var(--space-4xl);}.padding-top-5xl{padding-top:var(--space-5xl);}.padding-top-6xl{padding-top:var(--space-6xl);}.padding-bottom-3xs{padding-bottom:var(--space-3xs);}.padding-bottom-2xs{padding-bottom:var(--space-2xs);}.padding-bottom-xs{padding-bottom:var(--space-xs);}.padding-bottom-s{padding-bottom:var(--space-s);}.padding-bottom-m{padding-bottom:var(--space-m);}.padding-bottom-l{padding-bottom:var(--space-l);}.padding-bottom-xl{padding-bottom:var(--space-xl);}.padding-bottom-2xl{padding-bottom:var(--space-2xl);}.padding-bottom-3xl{padding-bottom:var(--space-3xl);}.padding-bottom-4xl{padding-bottom:var(--space-4xl);}.padding-bottom-5xl{padding-bottom:var(--space-5xl);}.padding-bottom-6xl{padding-bottom:var(--space-6xl);}.padding-horizontal-3xs{padding-left:var(--space-3xs);padding-right:var(--space-3xs);}.padding-horizontal-2xs{padding-left:var(--space-2xs);padding-right:var(--space-2xs);}.padding-horizontal-xs{padding-left:var(--space-xs);padding-right:var(--space-xs);}.padding-horizontal-s{padding-left:var(--space-s);padding-right:var(--space-s);}.padding-horizontal-m{padding-left:var(--space-m);padding-right:var(--space-m);}.padding-horizontal-l{padding-left:var(--space-l);padding-right:var(--space-l);}.padding-horizontal-xl{padding-left:var(--space-xl);padding-right:var(--space-xl);}.padding-horizontal-2xl{padding-left:var(--space-2xl);padding-right:var(--space-2xl);}.padding-horizontal-3xl{padding-left:var(--space-3xl);padding-right:var(--space-3xl);}.padding-horizontal-4xl{padding-left:var(--space-4xl);padding-right:var(--space-4xl);}.padding-horizontal-5xl{padding-left:var(--space-5xl);padding-right:var(--space-5xl);}.padding-horizontal-6xl{padding-left:var(--space-6xl);padding-right:var(--space-6xl);}.padding-vertical-3xs{padding-top:var(--space-3xs);padding-bottom:var(--space-3xs);}.padding-vertical-2xs{padding-top:var(--space-2xs);padding-bottom:var(--space-2xs);}.padding-vertical-xs{padding-top:var(--space-xs);padding-bottom:var(--space-xs);}.padding-vertical-s{padding-top:var(--space-s);padding-bottom:var(--space-s);}.padding-vertical-m{padding-top:var(--space-m);padding-bottom:var(--space-m);}.padding-vertical-l{padding-top:var(--space-l);padding-bottom:var(--space-l);}.padding-vertical-xl{padding-top:var(--space-xl);padding-bottom:var(--space-xl);}.padding-vertical-2xl{padding-top:var(--space-2xl);padding-bottom:var(--space-2xl);}.padding-vertical-3xl{padding-top:var(--space-3xl);padding-bottom:var(--space-3xl);}.padding-vertical-4xl{padding-top:var(--space-4xl);padding-bottom:var(--space-4xl);}.padding-vertical-5xl{padding-top:var(--space-5xl);padding-bottom:var(--space-5xl);}.padding-vertical-6xl{padding-top:var(--space-6xl);padding-bottom:var(--space-6xl);}.margin-3xs{margin:var(--space-3xs);}.margin-2xs{margin:var(--space-2xs);}.margin-xs{margin:var(--space-xs);}.margin-s{margin:var(--space-s);}.margin-m{margin:var(--space-m);}.margin-l{margin:var(--space-l);}.margin-xl{margin:var(--space-xl);}.margin-2xl{margin:var(--space-2xl);}.margin-3xl{margin:var(--space-3xl);}.margin-4xl{margin:var(--space-4xl);}.margin-5xl{margin:var(--space-5xl);}.margin-6xl{margin:var(--space-6xl);}.margin-left-3xs{margin-left:var(--space-3xs);}.margin-left-2xs{margin-left:var(--space-2xs);}.margin-left-xs{margin-left:var(--space-xs);}.margin-left-s{margin-left:var(--space-s);}.margin-left-m{margin-left:var(--space-m);}.margin-left-l{margin-left:var(--space-l);}.margin-left-xl{margin-left:var(--space-xl);}.margin-left-2xl{margin-left:var(--space-2xl);}.margin-left-3xl{margin-left:var(--space-3xl);}.margin-left-4xl{margin-left:var(--space-4xl);}.margin-left-5xl{margin-left:var(--space-5xl);}.margin-left-6xl{margin-left:var(--space-6xl);}.margin-right-3xs{margin-right:var(--space-3xs);}.margin-right-2xs{margin-right:var(--space-2xs);}.margin-right-xs{margin-right:var(--space-xs);}.margin-right-s{margin-right:var(--space-s);}.margin-right-m{margin-right:var(--space-m);}.margin-right-l{margin-right:var(--space-l);}.margin-right-xl{margin-right:var(--space-xl);}.margin-right-2xl{margin-right:var(--space-2xl);}.margin-right-3xl{margin-right:var(--space-3xl);}.margin-right-4xl{margin-right:var(--space-4xl);}.margin-right-5xl{margin-right:var(--space-5xl);}.margin-right-6xl{margin-right:var(--space-6xl);}.margin-top-3xs{margin-top:var(--space-3xs);}.margin-top-2xs{margin-top:var(--space-2xs);}.margin-top-xs{margin-top:var(--space-xs);}.margin-top-s{margin-top:var(--space-s);}.margin-top-m{margin-top:var(--space-m);}.margin-top-l{margin-top:var(--space-l);}.margin-top-xl{margin-top:var(--space-xl);}.margin-top-2xl{margin-top:var(--space-2xl);}.margin-top-3xl{margin-top:var(--space-3xl);}.margin-top-4xl{margin-top:var(--space-4xl);}.margin-top-5xl{margin-top:var(--space-5xl);}.margin-top-6xl{margin-top:var(--space-6xl);}.margin-bottom-3xs{margin-bottom:var(--space-3xs);}.margin-bottom-2xs{margin-bottom:var(--space-2xs);}.margin-bottom-xs{margin-bottom:var(--space-xs);}.margin-bottom-s{margin-bottom:var(--space-s);}.margin-bottom-m{margin-bottom:var(--space-m);}.margin-bottom-l{margin-bottom:var(--space-l);}.margin-bottom-xl{margin-bottom:var(--space-xl);}.margin-bottom-2xl{margin-bottom:var(--space-2xl);}.margin-bottom-3xl{margin-bottom:var(--space-3xl);}.margin-bottom-4xl{margin-bottom:var(--space-4xl);}.margin-bottom-5xl{margin-bottom:var(--space-5xl);}.margin-bottom-6xl{margin-bottom:var(--space-6xl);}.margin-horizontal-3xs{margin-left:var(--space-3xs);margin-right:var(--space-3xs);}.margin-horizontal-2xs{margin-left:var(--space-2xs);margin-right:var(--space-2xs);}.margin-horizontal-xs{margin-left:var(--space-xs);margin-right:var(--space-xs);}.margin-horizontal-s{margin-left:var(--space-s);margin-right:var(--space-s);}.margin-horizontal-m{margin-left:var(--space-m);margin-right:var(--space-m);}.margin-horizontal-l{margin-left:var(--space-l);margin-right:var(--space-l);}.margin-horizontal-xl{margin-left:var(--space-xl);margin-right:var(--space-xl);}.margin-horizontal-2xl{margin-left:var(--space-2xl);margin-right:var(--space-2xl);}.margin-horizontal-3xl{margin-left:var(--space-3xl);margin-right:var(--space-3xl);}.margin-horizontal-4xl{margin-left:var(--space-4xl);margin-right:var(--space-4xl);}.margin-horizontal-5xl{margin-left:var(--space-5xl);margin-right:var(--space-5xl);}.margin-horizontal-6xl{margin-left:var(--space-6xl);margin-right:var(--space-6xl);}.margin-vertical-3xs{margin-top:var(--space-3xs);margin-bottom:var(--space-3xs);}.margin-vertical-2xs{margin-top:var(--space-2xs);margin-bottom:var(--space-2xs);}.margin-vertical-xs{margin-top:var(--space-xs);margin-bottom:var(--space-xs);}.margin-vertical-s{margin-top:var(--space-s);margin-bottom:var(--space-s);}.margin-vertical-m{margin-top:var(--space-m);margin-bottom:var(--space-m);}.margin-vertical-l{margin-top:var(--space-l);margin-bottom:var(--space-l);}.margin-vertical-xl{margin-top:var(--space-xl);margin-bottom:var(--space-xl);}.margin-vertical-2xl{margin-top:var(--space-2xl);margin-bottom:var(--space-2xl);}.margin-vertical-3xl{margin-top:var(--space-3xl);margin-bottom:var(--space-3xl);}.margin-vertical-4xl{margin-top:var(--space-4xl);margin-bottom:var(--space-4xl);}.margin-vertical-5xl{margin-top:var(--space-5xl);margin-bottom:var(--space-5xl);}.margin-vertical-6xl{margin-top:var(--space-6xl);margin-bottom:var(--space-6xl);}.gap-3xs{gap:var(--space-3xs);}.gap-2xs{gap:var(--space-2xs);}.gap-xs{gap:var(--space-xs);}.gap-s{gap:var(--space-s);}.gap-m{gap:var(--space-m);}.gap-l{gap:var(--space-l);}.gap-xl{gap:var(--space-xl);}.gap-2xl{gap:var(--space-2xl);}.gap-3xl{gap:var(--space-3xl);}.gap-4xl{gap:var(--space-4xl);}.gap-5xl{gap:var(--space-5xl);}.gap-6xl{gap:var(--space-6xl);}.text-xs{font-size:var(--text-xs);}.text-s{font-size:var(--text-s);}.text-m{font-size:var(--text-m);}.text-l{font-size:var(--text-l);}.text-xl{font-size:var(--text-xl);}.text-2xl{font-size:var(--text-2xl);}.text-3xl{font-size:var(--text-3xl);}.text-4xl{font-size:var(--text-4xl);}.text-display{font-size:var(--text-display);}.text-stat{font-size:var(--text-stat);}H1{font-size:var(--text-display);line-height:var(--leading-tight);letter-spacing:var(--tracking-display);font-weight:var(--weight-black);}H2{font-size:var(--text-3xl);line-height:var(--leading-snug);letter-spacing:var(--tracking-heading);font-weight:var(--weight-bold);}H3{font-size:var(--text-xl);line-height:var(--leading-heading);letter-spacing:var(--tracking-heading);font-weight:var(--weight-semibold);}H4{font-size:var(--text-m);line-height:var(--leading-heading);letter-spacing:var(--tracking-heading);font-weight:var(--weight-semibold);}body{font-size:var(--text-m);line-height:var(--leading-normal);font-family:var(--font-sans);color:var(--text-main);}.row{display:grid;grid-auto-flow:column;justify-content:start;}.column{display:grid;grid-auto-flow:row;justify-items:start;align-content:start;}.columns-2{display:grid;grid-template-columns:var(--columns-2);}.columns-3{display:grid;grid-template-columns:var(--columns-3);}.columns-4{display:grid;grid-template-columns:var(--columns-4);}.columns-5{display:grid;grid-template-columns:var(--columns-5);}.columns-6{display:grid;grid-template-columns:var(--columns-6);}.columns-7{display:grid;grid-template-columns:var(--columns-7);}.columns-8{display:grid;grid-template-columns:var(--columns-8);}.columns-min-5{display:grid;grid-template-columns:repeat(auto-fit,minmax(5rem,1fr));}.columns-min-10{display:grid;grid-template-columns:repeat(auto-fit,minmax(10rem,1fr));}.columns-min-20{display:grid;grid-template-columns:repeat(auto-fit,minmax(20rem,1fr));}.columns-min-30{display:grid;grid-template-columns:repeat(auto-fit,minmax(30rem,1fr));}.columns-min-40{display:grid;grid-template-columns:repeat(auto-fit,minmax(40rem,1fr));}.columns-min-50{display:grid;grid-template-columns:repeat(auto-fit,minmax(50rem,1fr));}.columns-min-60{display:grid;grid-template-columns:repeat(auto-fit,minmax(60rem,1fr));}.columns-min-70{display:grid;grid-template-columns:repeat(auto-fit,minmax(70rem,1fr));}.flex-row{display:flex;flex-direction:row;}.flex-column{display:flex;flex-direction:column;}.flex-1{flex:1;}.flex-2{flex:2;}.flex-3{flex:3;}.flex-wrap{flex-wrap:wrap;}.flex-nowrap{flex-wrap:nowrap;}.col-span-2{grid-column:auto / span 2;}.col-span-3{grid-column:auto / span 3;}.col-span-4{grid-column:auto / span 4;}.col-span-5{grid-column:auto / span 5;}.col-span-6{grid-column:auto / span 6;}.col-span-7{grid-column:auto / span 7;}.col-span-8{grid-column:auto / span 8;}.col-start-1{grid-column-start:1;}.col-start-2{grid-column-start:2;}.col-start-3{grid-column-start:3;}.col-start-4{grid-column-start:4;}.col-start-5{grid-column-start:5;}.col-start-6{grid-column-start:6;}.col-start-7{grid-column-start:7;}.col-start-8{grid-column-start:8;}.row-span-2{grid-row:auto / span 2;}.row-span-3{grid-row:auto / span 3;}.row-span-4{grid-row:auto / span 4;}.row-span-5{grid-row:auto / span 5;}.row-span-6{grid-row:auto / span 6;}.row-span-7{grid-row:auto / span 7;}.row-span-8{grid-row:auto / span 8;}.row-start-1{grid-row-start:1;}.row-start-2{grid-row-start:2;}.row-start-3{grid-row-start:3;}.row-start-4{grid-row-start:4;}.row-start-5{grid-row-start:5;}.row-start-6{grid-row-start:6;}.row-start-7{grid-row-start:7;}.row-start-8{grid-row-start:8;}.items-left{justify-items:start;}.content-left{justify-content:start;}.items-center{justify-items:center;}.content-center{justify-content:center;}.items-right{justify-items:end;}.content-right{justify-content:end;}.items-top{align-items:start;}.content-top{align-content:start;}.items-middle{align-items:center;}.content-middle{align-content:center;}.items-bottom{align-items:end;}.content-bottom{align-content:end;}.items-stretch{align-items:stretch;}.content-stretch{justify-content:stretch;}.space-between{justify-content:space-between;}.space-around{justify-content:space-around;}.self-left{margin-right:auto;place-self:start;}.self-center{margin-inline:auto;place-self:center;}.self-right{margin-left:auto;place-self:end;}.self-top{margin-bottom:auto;align-self:start;}.self-middle{margin-block:auto;align-self:center;}.self-bottom{margin-top:auto;align-self:end;}.self-stretch{align-self:stretch;}.full-width{width:100%;}.full-height{height:100%;}.screen-width{width:100vw;}.screen-height{height:100vh;}.auto-width{width:auto;}.auto-height{height:auto;}.width-90{width:90%;}.width-80{width:80%;}.width-70{width:70%;}.width-60{width:60%;}.width-50{width:50%;}.width-40{width:40%;}.width-30{width:30%;}.width-20{width:20%;}.width-10{width:10%;}.max-site-width{max-width:var(--max-screen-width);width:100%;}.max-width-140{max-width:140rem;}.max-width-130{max-width:130rem;}.max-width-120{max-width:120rem;}.max-width-110{max-width:110rem;}.max-width-100{max-width:100rem;}.max-width-90{max-width:90rem;}.max-width-80{max-width:80rem;}.max-width-70{max-width:70rem;}.max-width-60{max-width:60rem;}.max-width-50{max-width:50rem;}.max-width-40{max-width:40rem;}.max-width-30{max-width:30rem;}.max-width-20{max-width:20rem;}.max-width-10{max-width:10rem;}.radius-xs{border-radius:var(--radius-xs);}.radius-s{border-radius:var(--radius-s);}.radius-m{border-radius:var(--radius-m);}.radius-l{border-radius:var(--radius-l);}.radius-xl{border-radius:var(--radius-xl);}.radius-full{border-radius:var(--radius-full);}.border{border-width:1px;border-style:solid;}.border-left{border-left-width:1px;border-left-style:solid;}.border-right{border-right-width:1px;border-right-style:solid;}.border-top{border-top-width:1px;border-top-style:solid;}.border-bottom{border-bottom-width:1px;border-bottom-style:solid;}.shadow-xs{box-shadow:var(--shadow-xs);}.shadow-s{box-shadow:var(--shadow-s);}.shadow-m{box-shadow:var(--shadow-m);}.shadow-l{box-shadow:var(--shadow-l);}.shadow-xl{box-shadow:var(--shadow-xl);}.opacity-0{opacity:0;}.opacity-10{opacity:0.1;}.opacity-20{opacity:0.2;}.opacity-30{opacity:0.3;}.opacity-40{opacity:0.4;}.opacity-50{opacity:0.5;}.opacity-60{opacity:0.6;}.opacity-70{opacity:0.7;}.opacity-80{opacity:0.8;}.opacity-90{opacity:0.9;}.opacity-100{opacity:1;}.aspect-1{aspect-ratio:1;}.aspect-4-3{aspect-ratio:4 / 3;}.aspect-3-4{aspect-ratio:3 / 4;}.aspect-3-2{aspect-ratio:3 / 2;}.aspect-2-3{aspect-ratio:2 / 3;}.aspect-16-9{aspect-ratio:16 / 9;}.aspect-9-16{aspect-ratio:9 / 16;}.fit-contain{object-fit:contain;}.fit-cover{object-fit:cover;}.fit-fill{object-fit:fill;}.bg-blur-xs{backdrop-filter:blur(2px);}.bg-blur-s{backdrop-filter:blur(4px);}.bg-blur-m{backdrop-filter:blur(8px);}.bg-blur-l{backdrop-filter:blur(16px);}.bg-blur-xl{backdrop-filter:blur(32px);}.grayscale{filter:grayscale(1);}.rotate-90{transform:rotate(90deg);}.rotate-180{transform:rotate(180deg);}.display-none{display:none;}.visible{visibility:visible;}.hidden{visibility:hidden;}.overflow-hidden{overflow:hidden;}.overflow-auto{overflow:auto;}.overflow-x-hidden{overflow-x:hidden;}.overflow-x-auto{overflow-x:auto;}.overflow-y-hidden{overflow-y:hidden;}.overflow-y-auto{overflow-y:auto;}.list-none{list-style-type:none;}.white-space-nowrap{white-space:nowrap;}.transition-global{transition:all 0.3s;}.relative{position:relative;}.absolute{position:absolute;}.sticky{position:sticky;}.fixed{position:fixed;}.inset-0{inset:0;}.bottom-0{bottom:0;}.top-0{top:0;}.left-0{left:0;}.right-0{right:0;}.pointer{cursor:pointer;}.not-allowed{cursor:not-allowed;}.cursor-auto{cursor:auto;}.no-pointer-events{pointer-events:none;}.z--1{z-index:-1;}.z-0{z-index:0;}.z-1{z-index:1;}.z-10{z-index:10;}.z-100{z-index:100;}.z-1000{z-index:1000;}.z-10000{z-index:10000;}@media (max-width:1400px){.column--on-xl{grid-template-columns:1fr;grid-auto-flow:row;}.row--on-xl{grid-template-columns:unset;grid-auto-flow:column;}.columns-2--on-xl{grid-template-columns:repeat(2,1fr);}.columns-3--on-xl{grid-template-columns:repeat(3,1fr);}.columns-4--on-xl{grid-template-columns:repeat(4,1fr);}.columns-5--on-xl{grid-template-columns:repeat(5,1fr);}.columns-6--on-xl{grid-template-columns:repeat(6,1fr);}.col-span-1--on-xl{grid-column:auto / span 1;}.col-span-2--on-xl{grid-column:auto / span 2;}.col-span-3--on-xl{grid-column:auto / span 3;}.col-span-4--on-xl{grid-column:auto / span 4;}.col-span-5--on-xl{grid-column:auto / span 5;}.col-span-6--on-xl{grid-column:auto / span 6;}.col-start-1--on-xl{grid-column-start:1;}.col-start-2--on-xl{grid-column-start:2;}.col-start-3--on-xl{grid-column-start:3;}.col-start-4--on-xl{grid-column-start:4;}.col-start-5--on-xl{grid-column-start:5;}.col-start-6--on-xl{grid-column-start:6;}.row-span-1--on-xl{grid-row:auto / span 1;}.row-span-2--on-xl{grid-row:auto / span 2;}.row-span-3--on-xl{grid-row:auto / span 3;}.row-span-4--on-xl{grid-row:auto / span 4;}.row-span-5--on-xl{grid-row:auto / span 5;}.row-span-6--on-xl{grid-row:auto / span 6;}.row-start-1--on-xl{grid-row-start:1;}.row-start-2--on-xl{grid-row-start:2;}.row-start-3--on-xl{grid-row-start:3;}.row-start-4--on-xl{grid-row-start:4;}.row-start-5--on-xl{grid-row-start:5;}.row-start-6--on-xl{grid-row-start:6;}}@media (max-width:992px){.column--on-l{grid-template-columns:1fr;grid-auto-flow:row;}.row--on-l{grid-template-columns:unset;grid-auto-flow:column;}.columns-2--on-l{grid-template-columns:repeat(2,1fr);}.columns-3--on-l{grid-template-columns:repeat(3,1fr);}.columns-4--on-l{grid-template-columns:repeat(4,1fr);}.columns-5--on-l{grid-template-columns:repeat(5,1fr);}.columns-6--on-l{grid-template-columns:repeat(6,1fr);}.col-span-1--on-l{grid-column:auto / span 1;}.col-span-2--on-l{grid-column:auto / span 2;}.col-span-3--on-l{grid-column:auto / span 3;}.col-span-4--on-l{grid-column:auto / span 4;}.col-span-5--on-l{grid-column:auto / span 5;}.col-span-6--on-l{grid-column:auto / span 6;}.col-start-1--on-l{grid-column-start:1;}.col-start-2--on-l{grid-column-start:2;}.col-start-3--on-l{grid-column-start:3;}.col-start-4--on-l{grid-column-start:4;}.col-start-5--on-l{grid-column-start:5;}.col-start-6--on-l{grid-column-start:6;}.row-span-1--on-l{grid-row:auto / span 1;}.row-span-2--on-l{grid-row:auto / span 2;}.row-span-3--on-l{grid-row:auto / span 3;}.row-span-4--on-l{grid-row:auto / span 4;}.row-span-5--on-l{grid-row:auto / span 5;}.row-span-6--on-l{grid-row:auto / span 6;}.row-start-1--on-l{grid-row-start:1;}.row-start-2--on-l{grid-row-start:2;}.row-start-3--on-l{grid-row-start:3;}.row-start-4--on-l{grid-row-start:4;}.row-start-5--on-l{grid-row-start:5;}.row-start-6--on-l{grid-row-start:6;}}@media (max-width:768px){.column--on-m{grid-template-columns:1fr;grid-auto-flow:row;}.row--on-m{grid-template-columns:unset;grid-auto-flow:column;}.columns-2--on-m{grid-template-columns:repeat(2,1fr);}.columns-3--on-m{grid-template-columns:repeat(3,1fr);}.columns-4--on-m{grid-template-columns:repeat(4,1fr);}.columns-5--on-m{grid-template-columns:repeat(5,1fr);}.columns-6--on-m{grid-template-columns:repeat(6,1fr);}.col-span-1--on-m{grid-column:auto / span 1;}.col-span-2--on-m{grid-column:auto / span 2;}.col-span-3--on-m{grid-column:auto / span 3;}.col-span-4--on-m{grid-column:auto / span 4;}.col-span-5--on-m{grid-column:auto / span 5;}.col-span-6--on-m{grid-column:auto / span 6;}.col-start-1--on-m{grid-column:1;}.col-start-2--on-m{grid-column:2;}.col-start-3--on-m{grid-column:3;}.col-start-4--on-m{grid-column:4;}.col-start-5--on-m{grid-column:5;}.col-start-6--on-m{grid-column:6;}.row-span-1--on-m{grid-row:auto / span 1;}.row-span-2--on-m{grid-row:auto / span 2;}.row-span-3--on-m{grid-row:auto / span 3;}.row-span-4--on-m{grid-row:auto / span 4;}.row-span-5--on-m{grid-row:auto / span 5;}.row-span-6--on-m{grid-row:auto / span 6;}.row-start-1--on-m{grid-row-start:1;}.row-start-2--on-m{grid-row-start:2;}.row-start-3--on-m{grid-row-start:3;}.row-start-4--on-m{grid-row-start:4;}.row-start-5--on-m{grid-row-start:5;}.row-start-6--on-m{grid-row-start:6;}}@media (max-width:480px){.column--on-s{grid-template-columns:1fr;grid-auto-flow:row;}.row--on-s{grid-template-columns:1fr;grid-auto-flow:column;}.columns-2--on-s{grid-template-columns:repeat(2,1fr);}.columns-3--on-s{grid-template-columns:repeat(3,1fr);}.columns-4--on-s{grid-template-columns:repeat(4,1fr);}.columns-5--on-s{grid-template-columns:repeat(5,1fr);}.columns-6--on-s{grid-template-columns:repeat(6,1fr);}.col-span-1--on-s{grid-column:auto / span 1;}.col-span-2--on-s{grid-column:auto / span 2;}.col-span-3--on-s{grid-column:auto / span 3;}.col-span-4--on-s{grid-column:auto / span 4;}.col-span-5--on-s{grid-column:auto / span 5;}.col-span-6--on-s{grid-column:auto / span 6;}.col-start-1--on-s{grid-column-start:1;}.col-start-2--on-s{grid-column-start:2;}.col-start-3--on-s{grid-column-start:3;}.col-start-4--on-s{grid-column-start:4;}.col-start-5--on-s{grid-column-start:5;}.col-start-6--on-s{grid-column-start:6;}.row-span-1--on-s{grid-row:auto / span 1;}.row-span-2--on-s{grid-row:auto / span 2;}.row-span-3--on-s{grid-row:auto / span 3;}.row-span-4--on-s{grid-row:auto / span 4;}.row-span-5--on-s{grid-row:auto / span 5;}.row-span-6--on-s{grid-row:auto / span 6;}.row-start-1--on-s{grid-row-start:1;}.row-start-2--on-s{grid-row-start:2;}.row-start-3--on-s{grid-row-start:3;}.row-start-4--on-s{grid-row-start:4;}.row-start-5--on-s{grid-row-start:5;}.row-start-6--on-s{grid-row-start:6;}}/* Custom Stylesheets */ /* =========================================================================== Komponenten — aus design-kit/03-komponenten.md und 04-seiten.md Erzeugt von werkzeug/build_templates.py. Nicht von Hand aendern. Bricks setzt auf jede Sektion display:flex,flex-direction:column und align-items:center. Raster gehoeren deshalb auf ein Kind,nie auf die Sektion selbst. Mobile first:ausschliesslich min-width. Breakpoints 479 / 768 / 992 / 1280. =========================================================================== */ /* ---------- Kopfzeile ---------------------------------------------------- */ .jd-header{background:var(--bg-body);border-bottom:1px solid var(--border);padding:10px var(--space-gutter);}@media (min-width:992px){.jd-header{padding:14px var(--space-gutter);}}.jd-header__inner{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2xl);width:100%;}/* Nie breiter als 200px — lockup.png hat 400px und reicht damit fuer 2x. Siehe ADR-0005. */ .jd-header__brand img{width:150px;max-width:100%;height:auto;display:block;}@media (min-width:992px){.jd-header__brand img{width:196px;}}.jd-header__actions{display:flex;align-items:center;gap:var(--space-m);}.jd-nav{display:flex;align-items:center;gap:var(--space-l);}.jd-nav__link{color:var(--text-soft);text-decoration:none;font-size:var(--text-m);font-weight:var(--weight-semibold);padding:10px 2px;border-bottom:2px solid transparent;}.jd-nav__link:hover,.jd-nav__link[aria-current="page"]{color:var(--link);border-bottom-color:var(--primary);}.jd-burger{width:48px;height:48px;border:1px solid var(--border-strong);border-radius:var(--radius-m);background:var(--bg-body);}@media (min-width:992px){.jd-burger{display:none;}}/* Feste Aktionsleiste unten,unter 768px. Sie traegt,was auf Desktop in der Kopfzeile steht:den Telefonknopf. Deshalb steht sie hier und nicht bei den Bausteinen. Der einzige Schatten im Auftritt,der nach OBEN faellt. */ .jd-actionbar{position:sticky;bottom:0;z-index:5;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:10px 16px 14px;background:rgba(255,255,255,.96);border-top:1px solid var(--border);box-shadow:var(--shadow-bar);}@media (min-width:768px){.jd-actionbar{display:none;}}/* ---------- Button ------------------------------------------------------- */ .jd-button{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2xs);min-height:48px;padding:13px 22px;border:1px solid transparent;border-radius:var(--radius-m);/* Pflicht,nicht Kosmetik:.jd-button sitzt auf <a> UND auf <button>,und ein <button> erbt die Schrift nicht von selbst. Ohne diese Zeile steht der Telefonknopf in Arial. Siehe 03-komponenten.md,Abschnitt 1. */ font-family:inherit;font-size:var(--text-2xl);font-weight:var(--weight-semibold);text-decoration:none;cursor:pointer;/* Nimmt die 300-ms-Verzoegerung und das Doppeltipp-Zoomen auf Touch. Siehe 03-komponenten.md,Abschnitt 1. */ touch-action:manipulation;transition:background-color var(--duration) var(--ease),border-color var(--duration) var(--ease),color var(--duration) var(--ease),transform var(--duration) var(--ease),box-shadow var(--duration) var(--ease);}.jd-button--primary{background:var(--gradient-cta);color:var(--primary-text);box-shadow:var(--shadow-m);}.jd-button--primary:hover{color:var(--primary-text);transform:translateY(-1px);box-shadow:var(--shadow-l);}.jd-button--secondary{background:var(--bg-body);color:var(--text-main);border-color:var(--border-strong);}.jd-button--secondary:hover{color:var(--text-main);border-color:var(--primary);background:var(--bg-tint);}.jd-button--light{background:var(--bg-body);color:var(--link-hover);}.jd-button--light:hover{color:var(--bg-dark);transform:translateY(-1px);}/* Vierte Variante aus 03-komponenten.md,Abschnitt 1:keine Flaeche,kein Rahmen. Fuer Navigation im Fliesstext. Der transparente Rahmen der Grundform bleibt stehen,damit die Hoehe nicht gegen die anderen Varianten springt. */ .jd-button--text{background:none;color:var(--link);}.jd-button--text:hover{color:var(--link-hover);}/* Beide Schreibweisen,weil <a> kein :disabled kennt:ein deaktivierter Link traegt aria-disabled. Ohne Hebung und ohne Schatten -- sonst verspricht ein Knopf Bedienbarkeit,die er nicht hat. */ .jd-button:disabled,.jd-button[aria-disabled="true"]{opacity:.5;cursor:default;transform:none;box-shadow:none;}/* Volle Breite auf Mobil. 52 statt 48 px:die Aktionsleiste unten ist das einzige Bedienelement,das mit dem Daumen im Vorbeigehen getroffen wird. */ .jd-button--block{width:100%;min-height:52px;padding:14px 20px;}@media (prefers-reduced-motion:reduce){.jd-button:hover{transform:none;}}/* ---------- Bausteine ---------------------------------------------------- */ .jd-eyebrow{display:flex;align-items:center;gap:var(--space-2xs);margin:0;font-size:var(--text-xs);font-weight:var(--weight-bold);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--link);}.jd-eyebrow::before{content:"";flex:none;width:24px;height:2px;border-radius:var(--radius-xs);background:var(--gradient-cta);}.jd-eyebrow--on-dark{color:var(--text-on-dark-muted);}.jd-eyebrow--on-dark::before{background:linear-gradient(135deg,var(--brand-400),var(--brand-300));}.jd-section__head{display:flex;flex-direction:column;gap:var(--space-xs);max-width:62ch;width:100%;}.jd-section__title{margin:0;font-size:var(--text-3xl);font-weight:var(--weight-bold);line-height:var(--leading-snug);letter-spacing:var(--tracking-heading);color:var(--text-main);}.jd-section__lead{margin:0;font-size:var(--text-l);line-height:var(--leading-normal);color:var(--text-soft);}.jd-card{background:var(--bg-body);border:1px solid var(--border);border-radius:var(--radius-l);box-shadow:var(--shadow-s);}.jd-card--on-dark{background:var(--surface-on-dark);border:1px solid var(--border-on-dark);border-radius:var(--radius-l);box-shadow:none;color:var(--text-on-dark);}/* Beschriftete Flaeche statt Foto. Verschwindet,sobald das Bild da ist. */ .jd-placeholder{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-2xs);padding:var(--space-m);text-align:center;background:var(--gradient-placeholder);box-shadow:var(--ring-placeholder);}.jd-placeholder::after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(135deg,rgba(10,140,206,.055) 0 12px,transparent 12px 24px);}.jd-placeholder > *{position:relative;z-index:1;}.jd-placeholder__tag{margin:0;font-size:var(--text-xs);font-weight:var(--weight-bold);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--primary-text);background:var(--gradient-cta);padding:3px 10px;border-radius:var(--radius-full);}.jd-placeholder__text{margin:0;font-size:var(--text-xs);line-height:var(--leading-relaxed);color:var(--link-hover);max-width:34ch;}.jd-placeholder--on-dark{background:linear-gradient(140deg,var(--surface-glow),var(--surface-on-dark));box-shadow:var(--ring-on-dark);}.jd-placeholder--on-dark .jd-placeholder__tag{background:var(--bg-body);color:var(--link-hover);}.jd-placeholder--on-dark .jd-placeholder__text{color:var(--text-on-dark);}/* Radius und Seitenverhaeltnis kommen vom Einsatzort,nicht von der Komponente. */ .jd-ph--hero{aspect-ratio:4 / 3;border-radius:var(--radius-2xl);box-shadow:var(--shadow-hero);}.jd-ph--wide{aspect-ratio:4 / 3;border-radius:var(--radius-2xl);}.jd-ph--tall{aspect-ratio:3 / 4;border-radius:var(--radius-l);}.jd-ph--member{aspect-ratio:4 / 5;border-radius:var(--radius-l);}.jd-ph--map{aspect-ratio:16 / 10;border-radius:var(--radius-xl);}.jd-ph--portrait{aspect-ratio:3 / 4;border-radius:var(--radius-xl);background:linear-gradient(140deg,var(--surface-glow),var(--surface-on-dark));box-shadow:var(--ring-on-dark);}.jd-ph--portrait .jd-placeholder__tag{background:var(--bg-body);color:var(--link-hover);}.jd-ph--portrait .jd-placeholder__text{color:var(--text-on-dark);}.jd-facts{display:grid;grid-template-columns:1fr;gap:var(--space-s);}@media (min-width:479px){.jd-facts{grid-template-columns:repeat(2,minmax(0,1fr));}}.jd-fact{padding:16px 18px;border:1px solid var(--border-brand-soft);border-radius:var(--radius-m);background:var(--bg-tint);}.jd-fact__label{margin:0 0 var(--space-3xs);font-size:var(--text-xs);font-weight:var(--weight-bold);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--link);}.jd-fact__value{margin:0;font-size:var(--text-s);line-height:var(--leading-relaxed);color:var(--text-soft);}/* ---------- Bausteine der Unterseiten ------------------------------------ Sechs Komponenten,die auf der Startseite nicht vorkommen:Chip und Kachel auf /galerie,Formular und Badge auf /karriere,Tabelle auf den Rechtstextseiten,Pfeilknopf in den Karussells auf Mobil. Sie stehen hier,obwohl dieser Erzeuger nur die Startseite als Vorlage baut. Der Grund:es gibt genau EINEN Ort fuer Komponenten-CSS. Wer die Unterseiten in Bricks anlegt,findet die Klassen im Stylesheet schon vor und muss nichts nachtragen. Siehe design-kit/03-komponenten.md,Abschnitte 6,10 bis 13. ------------------------------------------------------------------------- */ /* Filterknopf in der Galerie. Zusammen mit Badge,Schrittzahl und Pfeilknopf der einzige Ort mit --radius-full. */ .jd-chip{min-height:46px;padding:11px 20px;border:1px solid;border-radius:var(--radius-full);font-family:inherit;/* <button>,siehe .jd-button */ font-size:var(--text-m);font-weight:var(--weight-semibold);cursor:pointer;transition:background-color var(--duration-fast) var(--ease),border-color var(--duration-fast) var(--ease),color var(--duration-fast) var(--ease);}.jd-chip[aria-pressed="false"]{background:var(--bg-body);border-color:var(--border-strong);color:var(--text-soft);}.jd-chip[aria-pressed="false"]:hover{border-color:var(--brand-300);}.jd-chip[aria-pressed="true"]{background:var(--primary);border-color:var(--primary);color:var(--primary-text);}/* Badge an den Stellenangeboten. Traegt die Kondition,nicht den Titel. */ .jd-badge{display:inline-block;padding:4px 12px;border:1px solid var(--border-brand);border-radius:var(--radius-full);background:var(--bg-tint);font-size:var(--text-s);font-weight:var(--weight-semibold);color:var(--link);}/* Formular. Die Beschriftung steht IMMER sichtbar ueber dem Feld:der Platzhalter erreicht 2,49:1 und verschwindet beim Tippen. Fehler stehen am Feld,sind ueber aria-describedby verknuepft und nie nur farbig markiert. */ .jd-field{display:flex;flex-direction:column;gap:6px;}.jd-field label{font-size:var(--text-m);font-weight:var(--weight-semibold);}.jd-field input,.jd-field textarea,.jd-field select{width:100%;min-height:50px;padding:12px 14px;border:1px solid var(--border-strong);border-radius:var(--radius-s);background:var(--bg-body);font-family:inherit;font-size:var(--text-m);line-height:var(--leading-relaxed);color:var(--text-main);}.jd-field textarea{min-height:130px;resize:vertical;}.jd-field input::placeholder,.jd-field textarea::placeholder{color:var(--text-placeholder);}.jd-field input[aria-invalid="true"],.jd-field textarea[aria-invalid="true"]{border-color:var(--danger);}.jd-error{display:flex;align-items:center;gap:6px;font-size:var(--text-s);color:var(--danger);}/* Galeriekachel. Ein <button> mit sprechendem aria-label,kein <div> mit Klick-Handler. */ .jd-tile{display:block;width:100%;padding:0;border:none;background:none;font-family:inherit;text-align:left;cursor:pointer;}/* .2s steht so im Kit und ist dort die einzige Dauer ohne Token — nicht stillschweigend auf --duration (.18s) gezogen. Wer das aendern will,aendert zuerst 03-komponenten.md,Abschnitt 11. */ .jd-tile .jd-placeholder,.jd-tile img{transition:box-shadow .2s var(--ease),transform .2s var(--ease);}.jd-tile:hover .jd-placeholder,.jd-tile:hover img{transform:translateY(-2px);box-shadow:var(--ring-placeholder-hover),0 10px 24px -12px rgba(0,49,78,.35);}.jd-tile__titel{display:block;margin-top:var(--space-2xs);font-size:var(--text-m);font-weight:var(--weight-semibold);}.jd-tile__bereich{display:block;font-size:var(--text-s);color:var(--text-muted);}@media (prefers-reduced-motion:reduce){.jd-tile:hover .jd-placeholder,.jd-tile:hover img{transform:none;}}/* Pfeilknopf der Karussells. Nie der einzige Zugang:die Spur bleibt scrollbar,und jede Karte ist per Tabulator erreichbar. */ .jd-arrow{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border:1px solid var(--border-strong);border-radius:var(--radius-full);background:var(--bg-body);color:var(--text-main);cursor:pointer;transition:border-color var(--duration-fast) var(--ease),background-color var(--duration-fast) var(--ease);}.jd-arrow:hover:not(:disabled){border-color:var(--primary);background:var(--bg-tint);}.jd-arrow:disabled{opacity:.4;cursor:default;}/* Tabelle. Kommt nur auf Impressum und Datenschutz vor. Breite Tabellen liegen in einem Element mit overflow-x:auto und tabindex="0" — die Seite selbst scrollt nie waagerecht. */ .jd-table{width:100%;border-collapse:collapse;}.jd-table th{padding:0 14px 10px 0;border-bottom:1px solid var(--border);font-size:var(--text-xs);font-weight:var(--weight-bold);letter-spacing:var(--tracking-label);text-transform:uppercase;text-align:left;vertical-align:bottom;color:var(--link);}.jd-table td{padding:12px 14px 12px 0;border-bottom:1px solid var(--bg-warm);vertical-align:top;font-size:var(--text-s);line-height:var(--leading-relaxed);}.jd-table tr:last-child td{border-bottom:none;}/* ---------- 1 Kopfbereich ------------------------------------------------ */ .jd-hero{background:var(--gradient-tint);padding:26px var(--space-gutter) 34px;}@media (min-width:992px){.jd-hero{padding:72px var(--space-gutter) 64px;}}.jd-hero__grid{display:grid;grid-template-columns:1fr;gap:var(--space-m);width:100%;}@media (min-width:992px){.jd-hero__grid{grid-template-columns:1.02fr 0.98fr;gap:var(--space-5xl);align-items:center;}}.jd-hero__text{display:flex;flex-direction:column;gap:var(--space-s);}.jd-hero__title{margin:0;font-size:var(--text-display);font-weight:var(--weight-black);line-height:var(--leading-tight);letter-spacing:var(--tracking-display);color:var(--text-main);}.jd-hero__lead{margin:0;max-width:46ch;font-size:var(--text-l);line-height:var(--leading-normal);color:var(--text-soft);}.jd-hero__actions{display:flex;flex-wrap:wrap;gap:var(--space-xs);}.jd-hero__note{display:flex;align-items:flex-start;gap:var(--space-2xs);font-size:var(--text-s);line-height:var(--leading-relaxed);color:var(--text-muted);}.jd-hero__note-icon{font-size:19px;color:var(--brand-surface);flex:none;}/* ---------- 2 Kontaktband ------------------------------------------------ */ .jd-contactbar{background:var(--bg-body);padding:0 var(--space-gutter);}.jd-contactbar__card{display:grid;grid-template-columns:1fr;width:100%;overflow:hidden;background:var(--bg-body);border:1px solid var(--border);border-radius:var(--radius-l);box-shadow:var(--shadow-s);}/* Der Ueberlappungseffekt erst dort,wo der Kopfbereich zweispaltig steht. */ @media (min-width:992px){.jd-contactbar__card{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:-34px;position:relative;z-index:2;}}.jd-contactbar__cell{display:flex;align-items:flex-start;gap:14px;padding:24px 28px;border-top:1px solid var(--border);}.jd-contactbar__cell:first-child{border-top:none;}@media (min-width:992px){.jd-contactbar__cell{border-top:none;border-left:1px solid var(--border);}.jd-contactbar__cell:first-child{border-left:none;}}.jd-contactbar__icon{font-size:24px;color:var(--brand-surface);flex:none;}.jd-contactbar__body{display:flex;flex-direction:column;gap:2px;}.jd-contactbar__head{margin:0 0 var(--space-3xs);font-size:var(--text-xs);font-weight:var(--weight-bold);letter-spacing:var(--tracking-label);line-height:var(--leading-snug);text-transform:uppercase;color:var(--link);}.jd-contactbar__text{margin:0;font-size:var(--text-s);line-height:var(--leading-relaxed);color:var(--text-soft);}.jd-contactbar__link{margin-top:var(--space-3xs);font-size:var(--text-s);font-weight:var(--weight-semibold);color:var(--link);}/* ---------- 3 Kennzahlen ------------------------------------------------- */ .jd-stats{background:var(--gradient-deep);color:var(--text-on-dark);margin-top:var(--space-5xl);padding:var(--section-space-s) var(--space-gutter);}.jd-stats__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 16px;width:100%;margin:0;}@media (min-width:992px){.jd-stats__grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-xl);}}/* column-reverse:im Markup steht dt vor dd,weil <dl> das verlangt. Optisch gehoert die Zahl nach oben. */ .jd-stat{display:flex;flex-direction:column-reverse;gap:var(--space-3xs);}.jd-stat__value{margin:0;font-size:var(--text-stat);font-weight:var(--weight-black);line-height:var(--leading-tight);color:var(--text-on-dark-strong);/* Steht auch schon ueber .num im Markup. Hier zusaetzlich,damit eine vergessene Klasse die Ziffern nicht laufen laesst. */ font-variant-numeric:tabular-nums;}.jd-stat__label{margin:0;font-size:var(--text-m);line-height:var(--leading-relaxed);color:var(--text-on-dark-soft);}/* ---------- 4 Fachbereiche ----------------------------------------------- */ .jd-fields{background:var(--bg-body);padding:var(--section-space-l) var(--space-gutter);}.jd-fields__grid{display:grid;grid-template-columns:1fr;gap:var(--space-xl);width:100%;margin-top:36px;}@media (min-width:992px){.jd-fields__grid{grid-template-columns:0.85fr 1.15fr;gap:var(--space-2xl);align-items:start;}}/* Ohne JavaScript sind die Schalter ueberfluessig:die sieben Tafeln stehen ohnehin alle untereinander da,und die Seite ist vollstaendig. VERTRAG MIT DEM SKRIPT:es setzt die Klasse jd-js auf <html> und blendet damit die Schalterliste ein. Erst danach darf es Tafeln verstecken. Umgekehrt — im CSS verstecken,per Skript zeigen — waere die Seite ohne Skript unvollstaendig. Siehe design-kit/05-bricks.md,Abschnitt 4. */ .jd-fields__list{display:none;flex-direction:column;gap:var(--space-2xs);}.jd-js .jd-fields__list{display:flex;}.jd-fields__panels{display:flex;flex-direction:column;gap:var(--space-m);}.jd-js .jd-fields__panels > .jd-panel[hidden]{display:none;}.jd-tab{display:flex;align-items:center;justify-content:space-between;gap:var(--space-xs);width:100%;min-height:56px;padding:14px 18px;border:1px solid var(--border);border-radius:var(--radius-m);background:var(--bg-alt);color:var(--text-soft);font-family:inherit;/* <button>,siehe .jd-button */ font-size:var(--text-l);font-weight:var(--weight-semibold);text-align:left;cursor:pointer;transition:background-color var(--duration-fast) var(--ease),border-color var(--duration-fast) var(--ease),color var(--duration-fast) var(--ease);}.jd-tab:hover{background:var(--bg-tint);border-color:var(--brand-300);color:var(--bg-dark);}.jd-tab[aria-pressed="true"]{background:var(--bg-body);border-color:var(--primary);color:var(--bg-dark);box-shadow:var(--shadow-s);}.jd-tab__name{margin:0;}.jd-tab__mark{margin:0;flex:none;font-size:var(--text-xs);font-weight:var(--weight-bold);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--link);}.jd-panel{padding:var(--space-l);}@media (min-width:992px){.jd-panel{padding:34px;min-height:420px;}}.jd-panel__grid{display:grid;grid-template-columns:1fr;gap:var(--space-m);}@media (min-width:768px){.jd-panel__grid{grid-template-columns:1fr 240px;gap:28px;}}.jd-panel__body{display:flex;flex-direction:column;gap:var(--space-xs);}.jd-panel__title{margin:0;font-size:var(--text-2xl);font-weight:var(--weight-bold);line-height:var(--leading-snug);letter-spacing:var(--tracking-heading);color:var(--link-hover);}.jd-panel__text{margin:0;font-size:var(--text-m);line-height:var(--leading-normal);color:var(--text-soft);}.jd-panel__note{margin:0;font-size:var(--text-m);line-height:var(--leading-normal);color:var(--text-muted);}.jd-panel__link{font-size:var(--text-m);font-weight:var(--weight-semibold);color:var(--link);}/* ---------- 5 Schwerpunkt ------------------------------------------------ */ /* Die Lichtflaeche ist reine Deko und deshalb ein Pseudoelement — so braucht sie kein aria-hidden und kein eigenes Element in der Vorlage. */ .jd-focus{position:relative;overflow:hidden;background:var(--gradient-hero);color:var(--text-on-dark);padding:var(--section-space-m) var(--space-gutter);}.jd-focus::before{content:"";position:absolute;top:-220px;right:-130px;width:520px;height:520px;border-radius:50%;background:var(--glow);pointer-events:none;}.jd-focus > *{position:relative;z-index:1;}.jd-focus__grid{display:grid;grid-template-columns:1fr;gap:var(--space-xl);width:100%;}@media (min-width:992px){.jd-focus__grid{grid-template-columns:300px 1fr;gap:var(--space-3xl);align-items:center;}}.jd-focus__text{display:flex;flex-direction:column;gap:var(--space-s);}.jd-focus__title{margin:0;font-size:var(--text-3xl);font-weight:var(--weight-bold);line-height:var(--leading-snug);letter-spacing:var(--tracking-heading);color:var(--text-on-dark-strong);}/* Kontrastkorrektur gegenueber dem Entwurf:--brand-50 auf --gradient-hero ergibt 4,70:1,die Entwurfsfarben lagen bei 4,31 / 3,71 / 2,97:1. */ .jd-focus__body{margin:0;font-size:var(--text-m);line-height:var(--leading-normal);color:var(--brand-50);}.jd-focus__name{margin:0;font-size:var(--text-m);font-weight:var(--weight-semibold);color:var(--brand-50);}/* ---------- 6 Hausbesuche ------------------------------------------------ */ .jd-home{background:var(--bg-body);padding:var(--section-space-l) var(--space-gutter);}.jd-home__grid{display:grid;grid-template-columns:1fr;gap:var(--space-xl);width:100%;}@media (min-width:992px){.jd-home__grid{grid-template-columns:1fr 0.9fr;gap:var(--space-4xl);align-items:center;}}.jd-home__text{display:flex;flex-direction:column;gap:var(--space-s);}.jd-home__body{margin:0;max-width:58ch;font-size:var(--text-m);line-height:var(--leading-normal);color:var(--text-soft);}/* ---------- 7 Ablauf ----------------------------------------------------- */ .jd-flow{background:var(--gradient-warm);padding:var(--section-space-m) var(--space-gutter);}.jd-flow__list{display:grid;grid-template-columns:1fr;gap:var(--space-m);width:100%;margin:var(--space-xl) 0 0;padding:0;list-style:none;}@media (min-width:768px){.jd-flow__list{grid-template-columns:repeat(2,minmax(0,1fr));}}@media (min-width:992px){.jd-flow__list{grid-template-columns:repeat(4,minmax(0,1fr));}}.jd-step{display:flex;flex-direction:column;gap:var(--space-2xs);padding:var(--space-l) 22px 22px;background:var(--bg-body);border:1px solid var(--border);border-radius:var(--radius-l);}.jd-step__number{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;margin:0;border-radius:var(--radius-full);background:var(--gradient-cta);color:var(--primary-text);font-size:var(--text-l);font-weight:var(--weight-bold);font-variant-numeric:tabular-nums;}.jd-step__title{margin:0;font-size:var(--text-xl);font-weight:var(--weight-bold);line-height:var(--leading-heading);letter-spacing:var(--tracking-heading);color:var(--text-main);}.jd-step__text{margin:0;font-size:var(--text-m);line-height:var(--leading-normal);color:var(--text-soft);}/* ---------- 8 Team ------------------------------------------------------- */ .jd-team{background:var(--bg-body);padding:var(--section-space-l) var(--space-gutter);}.jd-team__head{display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-m);width:100%;}@media (min-width:768px){.jd-team__head{flex-direction:row;align-items:flex-end;justify-content:space-between;}}.jd-team__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-l);width:100%;margin-top:34px;}@media (min-width:992px){.jd-team__grid{grid-template-columns:repeat(4,minmax(0,1fr));}}.jd-member{display:flex;flex-direction:column;gap:var(--space-2xs);}.jd-member__name{margin:var(--space-2xs) 0 0;font-size:var(--text-xl);font-weight:var(--weight-bold);line-height:var(--leading-heading);letter-spacing:var(--tracking-heading);color:var(--text-main);}.jd-member__role{margin:0;font-size:var(--text-m);line-height:var(--leading-relaxed);color:var(--text-muted);}/* ---------- 9 Bewertungen ------------------------------------------------ */ .jd-reviews{background:var(--gradient-deep);color:var(--text-on-dark);padding:var(--section-space-m) var(--space-gutter);}.jd-reviews__grid{display:grid;grid-template-columns:1fr;gap:var(--space-xl);width:100%;}@media (min-width:992px){.jd-reviews__grid{grid-template-columns:0.8fr 1.2fr;gap:var(--space-4xl);align-items:center;}}.jd-reviews__text{display:flex;flex-direction:column;gap:var(--space-s);}.jd-reviews__title{margin:0;font-size:var(--text-3xl);font-weight:var(--weight-bold);line-height:var(--leading-snug);letter-spacing:var(--tracking-heading);color:var(--text-on-dark-strong);}/* Fuenf Sterne,rein dekorativ:die Zahl steht in der Ueberschrift daneben. */ .jd-stars::before{content:"\2605\2605\2605\2605\2605";letter-spacing:.12em;font-size:24px;line-height:1;color:var(--brand-400);}.jd-reviews__note{margin:0;font-size:var(--text-s);line-height:var(--leading-relaxed);color:var(--text-on-dark-soft);}.jd-reviews__quotes{display:flex;flex-direction:column;gap:var(--space-m);}.jd-quote{display:flex;flex-direction:column;gap:var(--space-2xs);padding:var(--space-l);}.jd-quote__text{margin:0;font-size:var(--text-m);line-height:var(--leading-normal);color:var(--text-on-dark);}.jd-quote__name{margin:0;font-size:var(--text-s);color:var(--text-on-dark-muted);}/* ---------- 10 Karriere-Band --------------------------------------------- */ .jd-cta{background:var(--bg-body);padding:var(--section-space-s) var(--space-gutter);}.jd-cta__band{display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-m);width:100%;padding:36px 40px;background:var(--gradient-cta);border-radius:var(--radius-2xl);box-shadow:var(--shadow-cta);}@media (min-width:768px){.jd-cta__band{flex-direction:row;align-items:center;gap:var(--space-3xl);}}.jd-cta__text{display:flex;flex-direction:column;gap:var(--space-2xs);}.jd-cta__title{margin:0;font-size:var(--text-2xl);font-weight:var(--weight-bold);line-height:var(--leading-snug);letter-spacing:var(--tracking-heading);color:var(--text-on-dark-strong);}/* Kontrastkorrektur:der Entwurf setzt hier #dcf0ff mit 4,31:1. */ .jd-cta__body{margin:0;font-size:var(--text-m);line-height:var(--leading-normal);color:var(--brand-50);}/* ---------- 11 Kontakt --------------------------------------------------- */ .jd-contact{background:var(--bg-body);padding:20px var(--space-gutter) var(--section-space-l);}.jd-contact__grid{display:grid;grid-template-columns:1fr;gap:var(--space-xl);width:100%;}@media (min-width:992px){.jd-contact__grid{grid-template-columns:1fr 1.1fr;gap:var(--space-4xl);align-items:start;}}.jd-contact__text{display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-s);}.jd-contact__facts{display:grid;grid-template-columns:1fr;gap:var(--space-s);width:100%;}/* ---------- Fusszeile ---------------------------------------------------- */ .jd-footer{background:var(--gradient-deep);color:var(--text-on-dark);padding:48px var(--space-gutter) 36px;}.jd-footer__grid{display:grid;grid-template-columns:1fr;gap:var(--space-xl);}@media (min-width:768px){.jd-footer__grid{grid-template-columns:repeat(2,minmax(0,1fr));}}@media (min-width:992px){.jd-footer__grid{grid-template-columns:1.4fr 1fr 1fr 1fr;gap:var(--space-2xl);}}.jd-footer__brand{display:flex;flex-direction:column;gap:var(--space-xs);}/* Nicht breiter:lockup-negativ.png hat 342px und reicht damit genau fuer 2x. */ .jd-logo-negativ{width:170px;max-width:100%;height:auto;}.jd-footer__address{font-size:var(--text-s);line-height:var(--leading-relaxed);color:var(--text-on-dark-soft);}.jd-footer__col{display:flex;flex-direction:column;gap:var(--space-2xs);}/* Bleibt eine H2 — Ueberschrift ist Gliederung,kein Schriftgrad. Die Klasse schlaegt die H2-Regel ueber die hoehere Spezifitaet. */ .jd-footer__head{font-size:var(--text-xs);font-weight:var(--weight-bold);letter-spacing:var(--tracking-label);line-height:var(--leading-snug);text-transform:uppercase;color:var(--text-on-dark-muted);margin:0 0 var(--space-3xs);}.jd-footer__link{font-size:var(--text-s);color:var(--text-on-dark);text-decoration:none;}.jd-footer__link:hover{color:var(--text-on-dark-strong);text-decoration:underline;}.jd-footer__legal{margin-top:var(--space-xl);padding-top:20px;border-top:1px solid var(--border-on-dark);font-size:var(--text-s);color:var(--text-on-dark-muted);}/* Aus design-kit/tokens-web.css. Nicht verhandelbar. */ :where(a,button,input,textarea,select,[tabindex]):focus-visible{outline:var(--focus-width) solid var(--focus-color);outline-offset:var(--focus-offset);}[id]{scroll-margin-top:var(--header-height);}/* Ziffern in Telefonnummern,Uhrzeiten und Kennzahlen laufen nicht. */ .num{font-variant-numeric:tabular-nums;}@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important;}}