/* Manufacturer colors from the official logos: microtech.de, abacus.ch, selectline.de. */
.erp-microtech { --erp-brand: #0099aa; }
.erp-abacus { --erp-brand: #de323c; }
.erp-selectline { --erp-brand: #009fda; }

.ed-content .ed-landing.ed-erp-page {
    background: linear-gradient(180deg, #000 0%, #080c11 25%, #12171d 55%, #161c22 80%, #000 100%),
        linear-gradient(90deg, rgba(194,120,64,.035) 1px, transparent 1px),
        linear-gradient(0deg, rgba(194,120,64,.025) 1px, transparent 1px);
    background-size: 100% 100%, 160px 160px, 160px 160px;
    background-repeat: no-repeat, repeat, repeat;
}
.erp-container { position: relative; z-index: 2; max-width: 1440px; margin: auto; padding: 150px 60px 160px; }
.erp-eyebrow { color: var(--ed-primary); font-size: .78rem; font-weight: 600; letter-spacing: .16em; margin-bottom: 40px; }
/* Match the landing page's solution heading typography. */
.erp-container h1 { font-family: inherit; font-size: 64px; line-height: 1.1; font-weight: 700; letter-spacing: -.02em; margin: 0 0 36px; color: var(--ed-white); }
.erp-container h1 span, .erp-summary h2 span { color: var(--ed-primary); }
.ed-content .ed-erp-page .erp-lead { max-width: 760px; font-size: 18px; line-height: 1.6; color: var(--ed-muted); margin: 0 0 112px; }
.ed-content .ed-erp-page .erp-overview-container .erp-lead { max-width: none; width: 100%; }
.ed-content .ed-erp-page .erp-overview-section { min-height: auto; }
.ed-content .ed-erp-page .erp-overview-section .erp-hero-back .erp-eyebrow { display: inline-block; margin: 0; }
.ed-content .ed-erp-page .erp-overview-container h1 { max-width: none; }
.ed-content .ed-erp-page .erp-overview-container .erp-lead { font-size: 21px; line-height: 1.65; margin-bottom: 80px; }
.ed-content .ed-erp-page .erp-overview-container .erp-tile h2 { font-size: clamp(2rem, 3vw, 3rem); margin: 35px 0 15px; }
.ed-content .ed-erp-page .erp-overview-container .erp-tile p { font-size: 1rem; line-height: 1.6; color: #fff; }
.ed-content .ed-erp-page .erp-detail-container .erp-lead { max-width: none; }
.erp-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.erp-tile { display: flex; flex-direction: column; min-height: 320px; padding: 36px; border-radius: 20px; background: var(--erp-brand); color: #fff; text-decoration: none; box-shadow: 0 20px 45px #0003; transition: transform 180ms ease, box-shadow 180ms ease; }
.erp-tile:hover { color: #fff; text-decoration: none; transform: translateY(-5px); box-shadow: 0 25px 50px #0005; }
.erp-tile:focus-visible, .erp-back:focus-visible, .erp-contact:focus-visible { outline: 3px solid #fff; outline-offset: 5px; }
.erp-tile-label { font-size: .72rem; letter-spacing: .16em; font-weight: 600; }
.erp-tile h2 { font-size: clamp(2rem, 3vw, 3rem); letter-spacing: -.03em; margin: 35px 0 15px; font-weight: 700; color: #fff; }
.erp-tile p { font-size: 1rem; line-height: 1.6; }
.erp-tile-footer { display: flex; justify-content: space-between; align-items: center; margin-top: auto; padding-top: 25px; font-size: .85rem; }
.erp-tile-footer span { font-size: 1.8rem; }
.erp-back { display: inline-block; color: #b8c2d6; text-decoration: none; margin-bottom: 64px; font-size: .9rem; }
.erp-back:hover { color: var(--ed-primary); }
.erp-detail-container { max-width: 1560px; padding-top: 0; padding-bottom: 320px; }

.erp-horizontal-diagram { display: block; width: 100%; height: auto; overflow: visible; font-family: inherit; }
.erp-portrait-diagram { display: none; width: 100%; height: auto; font-family: inherit; }
.erp-portrait-diagram .erp-diagram-interface { font-size: 30px; }
.erp-portrait-diagram .erp-diagram-description { font-size: 26px; }
.erp-diagram-manufacturer { fill: var(--erp-brand); }
.erp-diagram-eyebrow { fill: #fff; font-size: 20px; font-weight: 600; letter-spacing: 3px; }
.erp-diagram-name { fill: #fff; font-size: 40px; font-weight: 700; }
.erp-diagram-arrows { fill: none; stroke: var(--ed-primary); stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; }
.erp-diagram-interface { fill: #e6f2f7; font-size: 27px; font-weight: 500; }
.erp-diagram-description { fill: #b8c2d6; font-size: 20px; }
.ed-content .ed-erp-page .ed-hero-content .erp-hero-description p { margin-bottom: 0; }
.ed-content .ed-erp-page .ed-hero-content .erp-hero-description p + p { margin-top: .825em; }
.ed-content .ed-erp-page .ed-hero-content .erp-hero-description { margin-bottom: 26px; }
.erp-summary { max-width: 1000px; margin: 120px auto 0; }
.erp-summary h2 { font-family: inherit; font-size: 64px; font-weight: 700; letter-spacing: -.02em; line-height: 1.1; color: var(--ed-white); margin: 0 0 36px; }
.erp-summary p { color: var(--ed-muted); font-size: 18px; line-height: 1.6; margin: 0 0 28px; }
.erp-partner { display: flex; align-items: center; flex-wrap: wrap; gap: 20px; color: var(--ed-primary); font-size: .95rem; font-weight: 500; margin-bottom: 32px; }
.erp-partner img { display: block; width: 200px; max-width: 100%; height: auto; border-radius: 6px; }
.erp-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 24px 32px; margin-top: 40px; }
.erp-contact { display: inline-flex; gap: 25px; align-items: center; background: var(--ed-primary); color: #fff; border-radius: 8px; padding: 13px 22px; text-decoration: none; }
.erp-contact:hover { color: #fff; filter: brightness(1.08); text-decoration: none; }

@media (max-width: 1100px) {
    .erp-summary { margin-top: 88px; }
}
@media (max-width: 800px) {
    .erp-container { padding: 85px 24px 100px; }
    .erp-detail-container { padding-bottom: 220px; }
    .erp-container h1, .erp-summary h2 { font-size: 40px; }
    .erp-eyebrow { margin-bottom: 32px; }
    .erp-back { margin-bottom: 48px; }
    .erp-grid { grid-template-columns: 1fr; gap: 20px; }
    .erp-tile { min-height: 260px; padding: 30px; }
    .ed-content .ed-erp-page .erp-lead { font-size: 18px; margin-bottom: 80px; }

}
@media (prefers-reduced-motion: reduce) { .erp-tile { transition: none; } .erp-tile:hover { transform: none; } }

/* ERP heroes use the product landing page layout and responsive rules directly. */
.ed-content .ed-erp-page .erp-hero-back { position: absolute; top: 65px; left: 0; right: 0; }
.ed-content .ed-erp-page .erp-hero-back .erp-back { margin: 0; font-size: .78rem; font-weight: 600; letter-spacing: .16em; }
.ed-content .ed-erp-page .erp-horizontal-diagram { position: relative; z-index: 2; max-width: 1080px; transform: scale(clamp(.58, .88vw + .6, 1.1)); transform-origin: center; }
.ed-content .ed-erp-page .erp-hero-partner { margin: 36px 0 0; }
.ed-content .ed-erp-page .erp-hero-partner img { width: 170px; }

@media (max-width: 2000px) {
    .ed-content .ed-erp-page .erp-horizontal-diagram { transform: scale(.92); transform-origin: right center; }
}
@media (max-width: 1750px) {
    .ed-content .ed-erp-page .erp-horizontal-diagram { transform: scale(.9); transform-origin: center center; }
    .ed-content .ed-erp-page .erp-hero-back { left: 22px; right: 22px; }
}
@media (max-width: 700px) {
    .ed-content .ed-erp-page .erp-horizontal-diagram { display: none; }
    .ed-content .ed-erp-page .erp-portrait-diagram { display: block; }
    .ed-content .ed-erp-page .erp-hero-back { top: 32px; left: 18px; right: 18px; }
    .ed-content .ed-erp-page > .ed-bg-dots { display: none; }
    .ed-content .ed-erp-page .erp-overview-container .erp-lead { font-size: 17px; line-height: 1.65; margin-bottom: 48px; }
    .ed-content .ed-erp-page .erp-overview-container .erp-tile h2 { font-size: 2rem; }
    .ed-content .ed-erp-page .erp-detail-container { padding: 0 18px 144px; }
    .ed-content .ed-erp-page .erp-summary { margin-top: 24px; }
    .ed-content .ed-erp-page .erp-summary h2 { font-size: 34px; }
    .ed-content .ed-erp-page .erp-contact { max-width: 100%; padding: 16px 20px; }
}
