/* ESRA – gemeinsames Layout für die öffentlichen Inhaltsseiten.
   Farbquelle: Dokumentation/04_Offene_Punkte.md (Petrol/Koralle/Creme). */
:root { --editorial-ink:var(--petrol-primary); --editorial-muted:var(--text-muted); --editorial-line:var(--border-soft); --editorial-paper:var(--surface); --editorial-teal:var(--petrol-light); --editorial-coral:var(--koralle); --editorial-shadow:0 16px 36px color-mix(in srgb,var(--petrol-primary) 12%,transparent); --editorial-ease:cubic-bezier(.23,1,.32,1); }
body { background:var(--cream); color:var(--editorial-ink); }
.site-header { background:color-mix(in srgb,var(--cream) 90%,transparent); border-bottom:1px solid var(--editorial-line); box-shadow:none; }
.nav-bar { max-width:1180px; min-height:5.7rem; padding:.9rem 1.5rem; }
.brand-mark { border-radius:50%; box-shadow:none; background-color:var(--petrol-primary); }.brand-name { letter-spacing:-.02em; }.brand-name small { letter-spacing:.025em; }
.nav-link { border-radius:.4rem; color:var(--editorial-muted); box-shadow:none; }.nav-link:hover { background:transparent; box-shadow:none; color:var(--editorial-ink); }.nav-link[aria-current='page'] { color:var(--editorial-ink); background:color-mix(in srgb,var(--petrol-light) 20%,var(--surface)); box-shadow:none; }.nav-link--praxis { color:#fff; background:var(--petrol-primary); border:0; padding:.6rem 1.05rem; }.nav-link--praxis:hover { background:var(--petrol-light); color:#232323; box-shadow:none; }
.theme-toggle,.menu-toggle { border:1px solid var(--editorial-line); border-radius:50%; box-shadow:none; background:var(--editorial-paper); }.theme-toggle:hover,.menu-toggle:hover { transform:translateY(-1px); }
.hero { padding:clamp(4.5rem,8vw,7rem) 0 clamp(2.5rem,5vw,4.5rem); }.hero::after { content:''; display:block; width:min(100% - 3rem,1132px); height:1px; margin:clamp(3rem,7vw,6rem) auto 0; background:var(--editorial-line); }.hero-blob { opacity:.26; }.hero .container { max-width:1180px; }.hero h1,.section h2,.callout h2 { font-family:Georgia,'Times New Roman',serif; font-weight:600; letter-spacing:-.045em; }.hero h1 { max-width:13ch; font-size:clamp(3rem,6vw,5.5rem); line-height:.98; }.hero .lede { font-size:1.12rem; max-width:56ch; }.hero-actions { margin-top:2rem; }
.btn { border-radius:.4rem; box-shadow:none; transition:transform 150ms var(--editorial-ease),background-color 180ms ease,box-shadow 180ms ease; }.btn-primary { color:#232323; background:var(--editorial-coral); box-shadow:0 9px 18px color-mix(in srgb,var(--koralle) 24%,transparent); }.btn-secondary { border:1px solid var(--editorial-line); box-shadow:none; background:var(--editorial-paper); }.btn:active { transform:scale(.97); }
.section { padding:clamp(4rem,8vw,7rem) 0; }.container { max-width:1180px; }.section-header { display:grid; grid-template-columns:.75fr 1.5fr; gap:1rem; max-width:none; margin-bottom:2.75rem; }.section-header .eyebrow { margin-top:.65rem; }.section-header h2 { max-width:15ch; }.eyebrow { color:var(--editorial-coral); font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:.75rem; letter-spacing:.07em; }.eyebrow::before { content:''; display:inline-block; width:1.5rem; height:1px; vertical-align:middle; margin-right:.55rem; background:currentColor; }
.grid { gap:0; border-top:1px solid var(--editorial-line); }.grid-3 { grid-template-columns:repeat(3,1fr); }.grid-2 { gap:clamp(2rem,6vw,6rem); border-top:0; }.clay-card { border-radius:0; border-right:1px solid var(--editorial-line); box-shadow:none; background:transparent; padding:1.5rem 2rem 1.5rem 0; transition:transform 180ms var(--editorial-ease),background-color 180ms ease; }.grid-3 .clay-card { padding:1.5rem 2rem; }.grid-3 .clay-card:last-child { border-right:0; }.clay-card:hover { box-shadow:none; transform:none; }.clay-card .icon-badge { color:var(--petrol-primary); border-radius:50%; box-shadow:none; background:color-mix(in srgb,var(--petrol-light) 18%,var(--surface)); }.clay-card h3 { font-family:Georgia,'Times New Roman',serif; font-size:1.32rem; letter-spacing:-.025em; }.clay-card p { color:var(--editorial-muted); }
.steps { gap:0; border-top:1px solid var(--editorial-line); }.step { padding:1.25rem 0; border-bottom:1px solid var(--editorial-line); }.step-number { color:var(--petrol-primary); border-radius:50%; box-shadow:none; background:color-mix(in srgb,var(--petrol-light) 18%,var(--surface)); }.service-steps { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:clamp(2rem,6vw,6rem); }.service-steps .step:nth-child(odd) { grid-column:1; }.service-steps .step:nth-child(even) { grid-column:2; }
.callout { border-radius:1rem; box-shadow:var(--editorial-shadow); background:linear-gradient(120deg,var(--petrol-primary),var(--petrol-light)); text-align:left; }.callout .btn-primary { color:#232323; background:var(--koralle); }
.contact-link { border:1px solid var(--editorial-line); border-radius:.65rem; box-shadow:none; background:var(--editorial-paper); }.contact-link:hover { transform:translateY(-2px); }.placeholder-note { border-radius:.65rem; }
.legal { max-width:780px; }.legal h2 { font-family:Georgia,'Times New Roman',serif; letter-spacing:-.03em; }.site-footer { background:var(--petrol-primary); color:#F5F2EA; border:0; }.site-footer p,.footer-links a,.footer-bottom { color:color-mix(in srgb,#F5F2EA 78%,transparent); }.footer-grid { padding-top:3rem; }.footer-bottom { border-color:color-mix(in srgb,#F5F2EA 18%,transparent); }.site-footer .brand,.site-footer .brand-name { color:#F5F2EA; }.site-footer .brand-name small { color:color-mix(in srgb,#F5F2EA 78%,transparent); }.site-footer .brand-mark { color:#0B1E20; background:var(--petrol-light); }
main .hero,main .section { transition:opacity 520ms var(--editorial-ease),transform 520ms var(--editorial-ease); } html.js-ready main .hero,html.js-ready main .section { opacity:0; transform:translateY(16px); } html.js-ready main .hero.is-revealed,html.js-ready main .section.is-revealed { opacity:1; transform:none; }
@media (hover:hover) and (pointer:fine) { .btn-primary:hover { transform:translateY(-2px); background:var(--koralle-hover); }.btn-secondary:hover { transform:translateY(-2px); }.grid-3 .clay-card:hover { background:color-mix(in srgb,var(--petrol-light) 12%,transparent); } }
[data-theme='dark'] { --editorial-ink:var(--text); --editorial-muted:var(--text-muted); --editorial-line:var(--border-soft); --editorial-paper:var(--surface-raised); --editorial-teal:var(--petrol-light); --editorial-coral:var(--koralle); --editorial-shadow:0 16px 36px rgba(0,0,0,.3); }
[data-theme='dark'] body { background:var(--cream); } [data-theme='dark'] .site-header { background:color-mix(in srgb,var(--cream) 92%,transparent); } [data-theme='dark'] .brand-mark { color:transparent; background-color:var(--petrol-light); } [data-theme='dark'] .nav-link[aria-current='page'],[data-theme='dark'] .clay-card .icon-badge,[data-theme='dark'] .step-number { color:var(--petrol-light); background:color-mix(in srgb,var(--petrol-light) 15%,var(--surface-raised)); } [data-theme='dark'] .nav-link--praxis { color:#0B1E20; background:var(--petrol-light); } [data-theme='dark'] .nav-link--praxis:hover { color:#0B1E20; background:#7FD6CF; } [data-theme='dark'] .theme-toggle,[data-theme='dark'] .menu-toggle,[data-theme='dark'] .btn-secondary,[data-theme='dark'] .contact-link { color:var(--text); background:var(--editorial-paper); } [data-theme='dark'] .site-footer { color:var(--text); background:var(--surface-raised); } [data-theme='dark'] .site-footer p,[data-theme='dark'] .footer-links a,[data-theme='dark'] .footer-bottom,[data-theme='dark'] .site-footer .brand,[data-theme='dark'] .site-footer .brand-name,[data-theme='dark'] .site-footer .brand-name small { color:var(--text); } [data-theme='dark'] .grid-3 .clay-card:hover { background:color-mix(in srgb,var(--petrol-light) 10%,transparent); } [data-theme='dark'] .hero-blob { opacity:.15; } [data-theme='dark'] .placeholder-note { background:var(--surface-raised); }
@media (max-width:760px) { .section-header { grid-template-columns:1fr; gap:.25rem; }.section-header .eyebrow { margin-top:0; }.grid-3 { grid-template-columns:1fr; }.grid-3 .clay-card,.grid-3 .clay-card + .clay-card { border-bottom:1px solid var(--editorial-line); border-right:0; padding:1.5rem 0; }.grid-3 .clay-card:last-child { border-bottom:0; }.grid-2,.service-steps { grid-template-columns:1fr; }.service-steps .step:nth-child(n) { grid-column:auto; }.hero h1 { font-size:clamp(2.75rem,14vw,4rem); } }
@media (prefers-reduced-motion:reduce) { main .hero,main .section { opacity:1 !important; transform:none !important; transition:none !important; } }