/* Pixel-Fischi Leistungen – isolierte Unterseite 2026-07-15 */
.services-page{color:#f7f8f5!important;min-height:100vh!important}
.services-page::before{display:none!important}
.services-page .section-shell,.services-page .site-header{width:min(1480px,calc(100% - 96px))!important;margin-inline:auto!important}
.services-page .site-header{padding:18px 0 14px!important;border-bottom:0!important;position:relative!important}
.services-page .brand-mark{clip-path:none!important;background:none!important;filter:none!important;width:45px!important;height:45px!important}
.services-page .brand-mark svg{width:100%;height:100%;fill:#9be042;filter:drop-shadow(0 0 12px rgba(155,224,66,.22))}
.services-page .brand-text strong{font-size:1.32rem!important}.services-page .brand-text small{font-size:.72rem!important}
.services-page .nav a{position:relative}.services-page .nav a.is-active{color:#9be042}.services-page .nav a.is-active::after{content:none}
.services-page main{padding-bottom:6px}
.services-hero{display:grid;grid-template-columns:minmax(0,.9fr) minmax(600px,1.1fr);gap:68px;align-items:center;padding:34px 0 42px!important;min-height:375px;position:relative}
.services-hero::after{content:"";position:absolute;right:0;top:18px;width:57%;height:310px;background-image:radial-gradient(rgba(155,224,66,.18) 1px,transparent 1px);background-size:13px 13px;mask-image:radial-gradient(ellipse,black 12%,transparent 70%);opacity:.42;pointer-events:none}
.services-intro{position:relative;z-index:2}.breadcrumb{display:flex;gap:10px;align-items:center;color:#9aa59b;font-size:.9rem;margin:0 0 17px}.breadcrumb strong{color:#9be042}.services-intro .eyebrow{font-size:.86rem;margin:0 0 9px}.services-intro h1{max-width:760px}.services-title-main,.services-title-sub{display:block}.services-title-main{font-size:clamp(2.75rem,4.15vw,4.45rem)!important;color:#fff!important}.services-title-sub{font-size:clamp(1.7rem,2.45vw,2.65rem)!important;color:#9be042!important;margin-top:0}.services-lead{font-size:1.08rem;line-height:1.65;color:#c2cac2;max-width:680px;margin:0 0 24px}.services-intro .actions{margin:0}
.service-flow{position:relative;z-index:2;display:grid;grid-template-columns:1fr 42px 1fr 42px 1fr;align-items:center}.service-flow article{min-height:220px;padding:25px 18px 20px;text-align:center;display:flex;flex-direction:column;justify-content:center;align-items:center;background:linear-gradient(180deg,rgba(12,24,31,.95),rgba(5,13,20,.95));border:1px solid rgba(155,224,66,.42);border-radius:12px;box-shadow:0 18px 45px rgba(0,0,0,.24)}.flow-icon{display:grid;place-items:center;width:78px;height:78px;margin:0 auto 14px;color:#9be042}.flow-icon svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}.service-flow h2{font-size:1.13rem;margin:0 0 8px}.service-flow p{font-size:.88rem;color:#c6cec6;margin:0;line-height:1.5}.flow-arrow{font-size:1.8rem;text-align:center;color:#e9eee9}
.service-section{display:grid;grid-template-columns:minmax(0,1fr) minmax(520px,.95fr);gap:52px;align-items:center;padding:30px!important;margin-bottom:20px!important;border:1px solid rgba(156,186,165,.16);border-radius:14px;background:linear-gradient(145deg,rgba(10,22,29,.96),rgba(5,14,21,.9));box-shadow:0 22px 65px rgba(0,0,0,.23);position:relative;overflow:hidden}.service-section::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 75% 12%,rgba(155,224,66,.055),transparent 28rem);pointer-events:none}.service-copy,.before-after,.example-grid,.tool-mockup{position:relative;z-index:1}.before-after,.example-grid,.tool-mockup{align-self:center;width:100%}.service-heading{display:grid;grid-template-columns:auto auto 1fr;gap:14px;align-items:center;margin-bottom:16px}.service-number{font-weight:900;color:rgba(155,224,66,.22);font-size:1rem;align-self:start;padding-top:4px}.service-badge{width:58px;height:58px;border-radius:10px;background:rgba(155,224,66,.08);border:1px solid rgba(155,224,66,.28);display:grid;place-items:center;color:#9be042}.service-badge svg{width:38px;height:38px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.service-heading h2{font-size:2rem;line-height:1.05;margin:0 0 5px;letter-spacing:-.03em}.service-heading p{color:#9be042!important;font-weight:750;margin:0!important}.service-copy>p{color:#c2cac2;line-height:1.65;margin:0 0 18px}.check-list{list-style:none;padding:0;margin:0 0 18px;display:grid;gap:10px 25px}.check-list.two-columns{grid-template-columns:repeat(2,minmax(0,1fr))}.check-list li{position:relative;padding-left:24px;color:#d9dfd9;font-size:.93rem}.check-list li::before{content:"✓";position:absolute;left:0;top:1px;width:15px;height:15px;border:1px solid #9be042;color:#9be042;border-radius:50%;font-size:.68rem;font-weight:900;display:grid;place-items:center}.result-note{display:flex;gap:12px;align-items:flex-start;max-width:690px;padding:13px 15px;border-radius:8px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.055)}.result-note>span{color:#9be042;font-size:1.45rem}.result-note p{margin:0;color:#cbd2cb;font-size:.88rem;line-height:1.5}.result-note strong{color:#9be042}
.before-after{display:grid;grid-template-columns:1fr 36px .78fr;align-items:stretch;min-height:305px}.before-after article{border:1px solid rgba(255,255,255,.12);background:#050c13;border-radius:9px;overflow:hidden}.before-after h3{text-align:center;font-size:.97rem;font-weight:650;color:#bec7c0;background:rgba(255,255,255,.035);padding:11px;margin:0}.clear-card h3{color:#9be042}.transform-arrow{display:grid;place-items:center;font-size:1.7rem;color:#aeb8b0}.chaos-map{position:relative;height:255px}.chaos-node{position:absolute;width:45px;height:45px;border-radius:8px;border:1px solid rgba(255,255,255,.2);background:#101921;display:grid;place-items:center;font-size:.64rem;color:#d5dcd6;z-index:2}.n1{left:11%;top:12%}.n2{right:10%;top:16%}.n3{left:42%;top:37%}.n4{left:12%;bottom:14%}.n5{right:10%;bottom:20%}.n6{left:43%;bottom:4%}.chaos-map i{position:absolute;left:26%;top:27%;width:45%;height:1px;border-top:1px dashed rgba(255,255,255,.35);transform-origin:center}.chaos-map .l1{transform:rotate(18deg)}.chaos-map .l2{transform:rotate(-31deg)}.chaos-map .l3{transform:rotate(67deg)}.chaos-map .l4{transform:rotate(115deg)}.chaos-map .l5{transform:rotate(145deg)}.chaos-map .l6{transform:rotate(91deg)}.clear-flow{height:255px;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#9be042;gap:8px}.clear-flow span{min-width:95px;border:1px solid rgba(155,224,66,.5);border-radius:7px;padding:8px 10px;text-align:center;font-size:.78rem;background:rgba(155,224,66,.055)}.clear-flow b{font-size:1.1rem}
.example-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.example-grid article{min-height:145px;text-align:center;padding:17px 12px;display:flex;flex-direction:column;justify-content:center;align-items:center;border:1px solid rgba(155,224,66,.25);border-radius:9px;background:linear-gradient(180deg,rgba(15,28,34,.8),rgba(5,13,20,.75))}.example-grid article>span{display:block;color:#9be042;font-size:2rem;line-height:1;margin-bottom:10px}.example-grid h3{font-size:.93rem;margin:0 0 5px}.example-grid p{font-size:.75rem;color:#b9c2ba;line-height:1.45;margin:0}
.tool-mockup{align-self:center;border:1px solid rgba(255,255,255,.24);border-radius:10px;background:#070e15;overflow:hidden;box-shadow:0 20px 50px rgba(0,0,0,.35)}.mock-window-bar{height:34px;border-bottom:1px solid rgba(255,255,255,.12);display:flex;align-items:center;gap:6px;padding:0 13px;background:#111a22}.mock-window-bar i{width:9px;height:9px;border-radius:50%;background:#ff6258}.mock-window-bar i:nth-child(2){background:#ffbf37}.mock-window-bar i:nth-child(3){background:#36c85b}.mock-window-body{display:grid;grid-template-columns:54px 1fr;min-height:295px}.mock-window-body aside{border-right:1px solid rgba(255,255,255,.09);display:flex;flex-direction:column;align-items:center;gap:20px;padding-top:20px;color:#c8d0ca}.mock-window-body aside b:first-child{color:#9be042}.mock-content{padding:18px}.mock-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.mock-stats article,.mock-panels article{background:#131c24;border:1px solid rgba(255,255,255,.08);border-radius:7px;padding:12px}.mock-stats small,.mock-panels small{display:block;color:#dce1dd;font-size:.68rem}.mock-stats strong{display:block;font-size:1.75rem;margin:2px 0}.mock-stats span{font-size:.63rem;color:#aab4ac}.mock-panels{display:grid;grid-template-columns:1.2fr .8fr;gap:10px;margin-top:10px}.mock-panels article{min-height:125px}.mock-panels svg{width:100%;height:82px;fill:none;stroke:#9be042;stroke-width:2}.mock-panels p{font-size:.68rem;color:#aeb8b0;margin:10px 0 0}
.services-cta{display:flex;align-items:center;justify-content:space-between;gap:42px;padding:24px 30px!important;margin:16px auto 22px!important;border:1px solid rgba(155,224,66,.38);border-radius:13px;background:linear-gradient(90deg,rgba(23,48,28,.65),rgba(7,18,24,.92));position:relative;overflow:hidden}.services-cta::before{content:"";position:absolute;left:22px;top:24px;bottom:24px;width:3px;border-radius:99px;background:#9be042}.services-cta>div{padding-left:25px}.services-cta .eyebrow{font-size:.7rem;margin:0 0 5px}.services-cta h2{font-size:2rem;letter-spacing:-.035em;margin:0 0 5px}.services-cta p{color:#bdc6be;margin:0;max-width:830px}.services-cta .btn{flex:none}
.services-footer{display:grid;grid-template-columns:1.1fr 1fr;gap:20px;padding:18px 0 26px!important;border-top:1px solid rgba(255,255,255,.07)}.footer-brand{display:flex;align-items:center;gap:28px}.footer-brand .brand{flex:none}.footer-brand p{max-width:350px;color:#9ca79e;font-size:.85rem;margin:0}.services-footer nav{display:flex;align-items:center;justify-content:flex-end;gap:34px;font-size:.9rem}.services-footer nav a:hover,.footer-legal a:hover{color:#9be042}.footer-legal{grid-column:1/-1;display:flex;justify-content:space-between;color:#8f9a91;font-size:.82rem}.footer-legal p{margin:0}
@media(max-width:1180px){.services-hero{grid-template-columns:1fr;padding-top:28px!important}.service-flow{max-width:850px}.service-section{grid-template-columns:1fr}.before-after,.example-grid,.tool-mockup{max-width:900px;width:100%;margin-inline:auto}.services-footer{grid-template-columns:1fr}.services-footer nav{justify-content:flex-start}.footer-legal{grid-column:auto}}
@media(max-width:760px){.services-page .section-shell,.services-page .site-header{width:min(100% - 28px,1480px)!important}.services-hero{padding-bottom:24px!important}.services-title-main{font-size:2.35rem!important}.services-title-sub{font-size:1.72rem!important}.service-flow{grid-template-columns:1fr;gap:10px}.flow-arrow{transform:rotate(90deg)}.service-flow article{min-height:auto}.service-section{padding:22px!important}.check-list.two-columns,.example-grid{grid-template-columns:1fr}.before-after{grid-template-columns:1fr}.transform-arrow{transform:rotate(90deg);height:34px}.services-cta{flex-direction:column;align-items:flex-start}.services-cta .btn{width:100%}.footer-brand{align-items:flex-start;flex-direction:column;gap:14px}.services-footer nav{flex-wrap:wrap;gap:18px}.footer-legal{flex-direction:column;gap:8px}.service-heading{grid-template-columns:auto 1fr}.service-number{display:none}.service-heading h2{font-size:1.65rem}.mock-stats{grid-template-columns:1fr}.mock-panels{grid-template-columns:1fr}.mock-window-body{grid-template-columns:42px 1fr}}

/* PIXEL-FISCHI LEISTUNGEN STARTSEITEN-OPTIK START */

/* Grundfläche exakt an die Startseite angleichen */
.services-page {
  background: #050b12 !important;
  background-image: none !important;
}

.services-page::before {
  display: none !important;
}

/* Gleiche Inhaltsbreite wie die Startseite */
.services-page .section-shell,
.services-page .site-header {
  width: min(var(--max), calc(100% - 48px)) !important;
  max-width: var(--max) !important;
  margin-inline: auto !important;
}

/* Hero ruhiger und ohne fremde Hintergrundfläche */
.services-hero {
  background: transparent !important;
  gap: 42px !important;
}

.services-hero::after {
  opacity: .12 !important;
}

/* Alle großen Leistungsflächen wie die Startseiten-Kacheln */
.services-page .service-section {
  width: 100% !important;
  margin-inline: auto !important;
  border: 1px solid rgba(155, 224, 66, .24) !important;
  border-radius: 14px !important;
  background: rgba(3, 10, 18, .96) !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, .18) !important;
}

.services-page .service-section::before {
  background: radial-gradient(circle at 12% 28%, rgba(155, 224, 66, .07), transparent 34%) !important;
}

/* Innere Visuals nicht mehr in mehreren konkurrierenden Blautönen */
.services-page .before-after article,
.services-page .example-grid article,
.services-page .tool-mockup {
  background: #050b12 !important;
  border-color: rgba(155, 224, 66, .22) !important;
  box-shadow: none !important;
}

.services-page .before-after h3,
.services-page .mock-window-bar,
.services-page .mock-stats article,
.services-page .mock-panels article,
.services-page .result-note {
  background: rgba(255, 255, 255, .045) !important;
}

.services-page .chaos-node {
  background: #101921 !important;
}

/* Ablaufkarten oben auf denselben Kachelstil bringen */
.services-page .service-flow article {
  background: rgba(3, 10, 18, .96) !important;
  border: 1px solid rgba(155, 224, 66, .24) !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, .18) !important;
}

/* CTA ebenfalls exakt in derselben ruhigen Flächenfamilie */
.services-page .services-cta {
  width: min(var(--max), calc(100% - 48px)) !important;
  max-width: var(--max) !important;
  background:
    radial-gradient(circle at 52% 50%, rgba(151, 226, 54, .16), transparent 34%),
    linear-gradient(180deg, rgba(5, 17, 20, .98), rgba(4, 11, 17, .98)) !important;
  border: 1px solid rgba(151, 226, 54, .30) !important;
  border-radius: 14px !important;
  box-shadow: 0 18px 44px rgba(0, 0, 0, .22) !important;
}

@media (max-width: 620px) {
  .services-page .section-shell,
  .services-page .site-header,
  .services-page .services-cta {
    width: min(100% - 28px, var(--max)) !important;
  }
}

/* PIXEL-FISCHI LEISTUNGEN STARTSEITEN-OPTIK END */

/* PIXEL-FISCHI LEISTUNGEN DUNKEL FINAL START */

/* Leistungsseite übernimmt ausschließlich das globale Schwarz. */
html body.services-page,
body.services-page main,
.services-hero {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

/* PIXEL-FISCHI LEISTUNGEN DUNKEL FINAL END */


/* PIXEL-FISCHI LEISTUNGEN FLOW-ICONS START */

/* Exakt dieselben SVG-Dateien wie im Ablauf der Startseite. */
.service-flow .flow-icon-img {
  display: block !important;

  width: 64px !important;
  height: 64px !important;
  margin: 0 auto 16px !important;

  object-fit: contain !important;
}

/* PIXEL-FISCHI LEISTUNGEN FLOW-ICONS END */

/* Inhaltskopf direkt unter der gemeinsamen Kopfzeile beginnen lassen. */
@media (min-width: 1181px) {
  .services-hero { padding-top: 0 !important; }
}

/* PIXEL-FISCHI ANALYSE HTML-RAHMEN START */

/*
  Aus dem transparenten Gesamtbild werden nur die inneren Bereiche
  der beiden Karten gezeigt. Die ursprünglichen Außenränder und die
  fehlerhafte helle Ecke liegen außerhalb des sichtbaren Ausschnitts.
*/
.analysis-visual-framed {
  display: grid !important;
  grid-template-columns:
    minmax(0, 1fr)
    54px
    minmax(0, 1fr) !important;

  align-items: center !important;
  gap: 10px !important;

  width: 100% !important;
  max-width: 920px !important;
  margin: auto !important;

  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.analysis-framed-card {
  position: relative !important;

  width: 100% !important;
  overflow: hidden !important;

  background: #071018 !important;
  background-image: none !important;

  border-radius: 22px !important;
  box-shadow:
    0 14px 32px rgba(0, 0, 0, .18) !important;

  isolation: isolate;
}

/* Linke Karte: neutraler, dezenter Rahmen. */
.analysis-framed-before {
  aspect-ratio: 752 / 690 !important;

  border:
    1px solid rgba(132, 151, 165, .58) !important;
}

/* Rechte Karte: grüner Markenrahmen. */
.analysis-framed-after {
  aspect-ratio: 738 / 688 !important;

  border:
    1px solid rgba(147, 226, 54, .82) !important;

  box-shadow:
    0 14px 32px rgba(0, 0, 0, .18),
    0 0 20px rgba(147, 226, 54, .045) !important;
}

.analysis-framed-card img {
  position: absolute !important;
  display: block !important;

  max-width: none !important;
  height: auto !important;

  user-select: none !important;
  pointer-events: none !important;

  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  filter: none !important;
}

/*
  Linker Innenausschnitt:
  Ausgangsbild 1915 × 821 Pixel
  sichtbarer Bereich ungefähr x101–853 / y57–747.
*/
.analysis-framed-before img {
  top: -8.261% !important;
  left: -13.431% !important;

  width: 254.654% !important;
}

/*
  Rechter Innenausschnitt:
  sichtbarer Bereich ungefähr x1087–1825 / y57–745.
*/
.analysis-framed-after img {
  top: -8.285% !important;
  left: -147.290% !important;

  width: 259.485% !important;
}

.analysis-framed-arrow {
  display: grid !important;
  place-items: center !important;

  color: #98df32 !important;
  font-size: clamp(2rem, 3vw, 2.8rem) !important;
  font-weight: 800 !important;
  line-height: 1 !important;

  text-shadow:
    0 0 16px rgba(152, 223, 50, .16) !important;
}

@media (max-width: 760px) {
  .analysis-visual-framed {
    grid-template-columns: 1fr !important;
    gap: 14px !important;

    width: min(100%, 520px) !important;
  }

  .analysis-framed-arrow {
    min-height: 30px !important;
    transform: rotate(90deg) !important;
  }
}

/* PIXEL-FISCHI ANALYSE HTML-RAHMEN END */
/* Gemeinsamer rechtlicher Seitenfuß. */
.site-footer {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  width: min(var(--max), calc(100% - 48px));
  margin: 24px auto 0;
  padding: 22px 0 36px;
  color: #9da89a;
  font-size: .92rem;
}
.site-footer a { color: inherit; text-decoration: none; }
.site-footer a:hover { color: var(--green); }

@media (max-width: 620px) {
  .site-footer { width: min(100% - 28px, var(--max)); flex-direction: column; }
}
