/* ==========================================================================
   leistung.css — service pages (/websites/, /automatisierung/, /daten-ki/,
   /software/, /beratung/). Static pages without the homepage scripts; they
   follow the system colour scheme like Impressum and Datenschutz.
   ========================================================================== */

/* Same container as the homepage sections (aligned with the header); running
   text keeps its own measure, cards and price grids use the extra width. */
body.era-2026 .lp { display:block; max-width:1320px; margin:0 auto; padding:40px 6vw 90px; }
body.era-2026 .lp h1 { font-size:clamp(32px,5.2vw,56px); line-height:1.06; margin:0 0 18px; max-width:1100px; }
body.era-2026 .lp h2 { font-size:clamp(24px,3vw,34px); line-height:1.15; margin:72px 0 16px; }
body.era-2026 .lp h3 { font-size:18px; line-height:1.25; letter-spacing:-.01em; margin:0 0 8px; }
body.era-2026 .lp p, body.era-2026 .lp li { font:16px/1.65 var(--f-body); color:var(--ink-dim); }
body.era-2026 .lp p { max-width:72ch; }
body.era-2026 .lp strong { color:var(--ink); }
body.era-2026 .lp a:not(.lp-button) { color:var(--ink); text-decoration:underline; text-underline-offset:3px; }
body.era-2026 .lp a:not(.lp-button):hover { color:var(--accent); }
body.era-2026 .lp .lp-lede { font-size:clamp(17px,1.6vw,19px); color:var(--ink); max-width:62ch; }

/* header */
body.era-2026 .lp-header .nav-inner { flex-wrap:wrap; }
body.era-2026 .lp-mainnav ul { display:flex; flex-wrap:wrap; align-items:center; gap:4px 22px; list-style:none; margin:0; padding:0; }
body.era-2026 .lp-mainnav a { display:inline-block; padding:10px 0; font:12px var(--f-mono); letter-spacing:.06em; text-transform:uppercase; color:var(--ink); }
body.era-2026 .lp-mainnav a:hover { color:var(--accent); }
body.era-2026 .lp-mainnav .lp-cta-small { padding:10px 14px; border:1px solid var(--accent); border-radius:6px; }

/* service switcher */
body.era-2026 .lp-tabs ul { display:flex; flex-wrap:wrap; gap:8px; list-style:none; margin:0 0 34px; padding:0; }
body.era-2026 .lp-tabs a { display:inline-block; padding:9px 14px; border:1px solid var(--line-2); border-radius:999px; font:12px/1.3 var(--f-mono); color:var(--ink); text-decoration:none; }
body.era-2026 .lp-tabs a:hover { border-color:var(--accent); color:var(--accent); }
body.era-2026 .lp-tabs a[aria-current="page"] { background:var(--accent); border-color:var(--accent); color:var(--accent-ink); }

/* calls to action */
body.era-2026 .lp .lp-actions { display:flex; flex-wrap:wrap; align-items:center; gap:14px 24px; margin:28px 0 0; max-width:none; font-size:14px; }
body.era-2026 .lp-button { display:inline-block; padding:14px 20px; border-radius:6px; background:var(--accent); color:var(--accent-ink); font:700 13px/1.2 var(--f-mono); letter-spacing:.02em; text-decoration:none; }
body.era-2026 .lp-button:hover { filter:brightness(1.08); }
body.era-2026 .lp a:focus-visible, body.era-2026 .lp-header a:focus-visible, body.era-2026 #site-footer a:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }

/* cards, prices, steps */
body.era-2026 .lp-cards, body.era-2026 .lp-prices { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr)); gap:16px; list-style:none; margin:20px 0 22px; padding:0; }
body.era-2026 .lp-cards > li, body.era-2026 .lp-prices > li { padding:22px; border:1px solid var(--line-2); border-radius:8px; }
body.era-2026 .lp-cards p, body.era-2026 .lp-prices p { margin:0; font-size:15px; }
body.era-2026 .lp .lp-price { margin:2px 0 10px; font:900 24px/1.2 var(--f-display); color:var(--ink); }
body.era-2026 .lp .lp-price .net { display:block; font:13px/1.5 var(--f-mono); }
body.era-2026 .lp-steps { list-style:none; counter-reset:lpstep; margin:20px 0 22px; padding:0; max-width:860px; }
body.era-2026 .lp-steps > li { counter-increment:lpstep; position:relative; padding:0 0 22px 52px; }
body.era-2026 .lp-steps > li::before { content:counter(lpstep); position:absolute; left:0; top:-2px; width:34px; height:34px; display:grid; place-items:center; border:1px solid var(--accent); border-radius:50%; font:13px var(--f-mono); color:var(--ink); }
body.era-2026 .lp-steps p { margin:0; }

/* FAQ and closing block */
body.era-2026 .lp-faq { max-width:860px; }
body.era-2026 .lp-faq summary { font:700 17px/1.4 var(--f-body); color:var(--ink); cursor:pointer; }
body.era-2026 .lp-faq details p { margin:10px 0 0; }
body.era-2026 .lp-next { margin-top:72px; padding:32px; border:1px solid var(--line-2); border-top:3px solid var(--accent); border-radius:8px; }
body.era-2026 .lp-next h2 { margin-top:0; }

@media (max-width:560px) {
  body.era-2026 .lp-header .nav-inner { flex-wrap:nowrap; }
  body.era-2026 .lp-mainnav li:not(:last-child) { display:none; }
}
@media (max-width:680px) {
  body.era-2026 .lp { padding-top:28px; }
  body.era-2026 .lp-mainnav ul { gap:0 16px; }
  body.era-2026 .lp-next { padding:22px; }
}
body.era-2026 .lp h1 { -webkit-hyphens:manual; hyphens:manual; overflow-wrap:normal; word-break:normal; }
body.era-2026 .lp h3.lp-subhead { margin:26px 0 6px; }