/* ======== PAGE HERO (Unterseiten) ======== */
.ecc-page-hero{position:relative;height:60vh;min-height:420px;max-height:600px;display:flex;align-items:flex-end;padding-bottom:60px;overflow:hidden;margin-top:0}
.ecc-page-hero-bg{position:absolute;inset:0;z-index:0}
.ecc-page-hero-bg img{width:100%;height:100%;object-fit:cover;filter:brightness(.55)}
.ecc-page-hero-grad{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(25,25,26,.5) 0%,rgba(25,25,26,.15) 40%,rgba(25,25,26,.8) 80%,#19191A 100%);z-index:1}
.ecc-page-hero-content{position:relative;z-index:2;max-width:var(--ecc-container);margin:0 auto;padding:0 40px;width:100%}
.ecc-page-hero h1{font-family:var(--ecc-font-display);font-size:clamp(48px,7vw,100px);line-height:.92;color:rgba(255,255,255,.8);letter-spacing:.02em;margin-bottom:20px}
.ecc-page-hero-sub{font-size:21px;color:var(--ecc-text);max-width:600px;line-height:1.65}

/* ======== BREADCRUMB ======== */
.ecc-breadcrumb{padding:20px 0;border-bottom:1px solid var(--ecc-border);margin-bottom:0}
.ecc-breadcrumb a,.ecc-breadcrumb span{font-family:var(--ecc-font-condensed);font-size:14px;letter-spacing:.08em;text-transform:uppercase;color:var(--ecc-text-muted)}
.ecc-breadcrumb a:hover{color:var(--ecc-blue)}
.ecc-breadcrumb span{margin:0 8px}
.ecc-breadcrumb span:last-child{color:var(--ecc-blue);margin:0}

/* ======== ACTIVE NAV ======== */
.ecc-nav-active{color:var(--ecc-blue)!important}
.ecc-nav-active::after{transform:scaleX(1)!important;transform-origin:left!important}

/* ======== SUB INTRO ======== */
.ecc-sub-intro{padding:100px 0 80px}
.ecc-sub-intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.ecc-sub-intro-text h2{font-family:var(--ecc-font-display);font-size:clamp(40px,4.5vw,64px);line-height:1;color:var(--ecc-white);margin-bottom:24px}
.ecc-sub-intro-text p{font-size:20px;color:var(--ecc-text);line-height:1.8;margin-bottom:18px}
.ecc-sub-intro-img{overflow:hidden}
.ecc-sub-intro-img img{width:100%;height:420px;object-fit:cover;transition:transform .6s ease}
.ecc-sub-intro-img:hover img{transform:scale(1.03)}
.ecc-highlight{color:var(--ecc-white)!important;font-weight:500}

/* ======== SERVICE ROWS (alternating) ======== */
.ecc-detail-services{padding:80px 0 100px;background:var(--ecc-bg-alt)}
.ecc-svc-row{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;padding:60px 0;border-bottom:1px solid var(--ecc-border)}
.ecc-svc-row:last-child{border-bottom:none}
.ecc-svc-row-rev .ecc-svc-img{order:2}
.ecc-svc-row-rev .ecc-svc-text{order:1}
.ecc-svc-img{overflow:hidden;position:relative}
.ecc-svc-img img{width:100%;height:360px;object-fit:cover;transition:transform .6s ease}
.ecc-svc-img:hover img{transform:scale(1.04)}
.ecc-svc-num{font-family:var(--ecc-font-display);font-size:72px;line-height:1;color:rgba(66,158,228,.12);position:absolute;top:-10px;left:0;pointer-events:none}
.ecc-svc-text{position:relative}
.ecc-svc-text h3{font-family:var(--ecc-font-display);font-size:clamp(32px,3vw,48px);color:var(--ecc-white);margin-bottom:18px;line-height:1}
.ecc-svc-text p{font-size:19px;color:var(--ecc-text);line-height:1.8;margin-bottom:14px}

/* ======== CTA BAND ======== */
.ecc-cta-band{padding:100px 0;background:var(--ecc-blue-bg)}
.ecc-cta-band-inner{display:flex;align-items:center;justify-content:space-between;gap:40px}
.ecc-cta-band h2{font-family:var(--ecc-font-display);font-size:clamp(36px,4vw,56px);line-height:1;color:var(--ecc-white);margin-bottom:12px}
.ecc-cta-band p{font-size:19px;color:var(--ecc-text);max-width:520px}
.ecc-cta-band-btns{display:flex;gap:16px;flex-shrink:0;flex-wrap:wrap}

/* ======== CROSS LINKS ======== */
.ecc-cross-links{padding:120px 0;background:var(--ecc-bg)}
.ecc-cross-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.ecc-cross-card{background:var(--ecc-bg-black);border:1px solid var(--ecc-border);padding:44px 36px;transition:all var(--ecc-ease);display:flex;flex-direction:column}
.ecc-cross-card:hover{border-color:var(--ecc-blue);transform:translateY(-6px);box-shadow:0 20px 60px rgba(0,0,0,.4)}
.ecc-cross-icon{color:var(--ecc-blue);margin-bottom:24px}
.ecc-cross-card:nth-child(2) .ecc-cross-icon{color:var(--ecc-pink)}
.ecc-cross-card h3{font-family:var(--ecc-font-display);font-size:32px;color:var(--ecc-white);margin-bottom:12px}
.ecc-cross-card p{font-size:17px;color:var(--ecc-text);line-height:1.7}

/* ======== VERSIEGELUNGEN – Comparison / Timeline ======== */
.ecc-seal-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin-top:60px}
.ecc-seal-card{background:var(--ecc-bg-black);border:1px solid var(--ecc-border);padding:44px 36px;position:relative;overflow:hidden;transition:all var(--ecc-ease)}
.ecc-seal-card:hover{border-color:rgba(66,158,228,.3);transform:translateY(-4px);box-shadow:0 16px 50px rgba(0,0,0,.4)}
.ecc-seal-card-badge{position:absolute;top:28px;right:-36px;background:var(--ecc-pink);color:var(--ecc-white);font-family:var(--ecc-font-condensed);font-size:14px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding:10px 50px;transform:rotate(45deg);box-shadow:0 4px 16px rgba(219,85,205,.3);z-index:2}
.ecc-seal-card h3{font-family:var(--ecc-font-display);font-size:36px;color:var(--ecc-white);margin-bottom:8px}
.ecc-seal-card-dur{font-family:var(--ecc-font-display);font-weight:400;font-size:24px;text-transform:uppercase;letter-spacing:.04em;color:var(--ecc-blue);margin-bottom:24px;display:flex;align-items:center;gap:10px}
.ecc-seal-card-dur svg{flex-shrink:0}
.ecc-seal-card p{font-size:18px;color:var(--ecc-text);line-height:1.7;margin-bottom:14px}
.ecc-seal-card-note{font-size:15px;color:var(--ecc-text-muted);font-style:italic;border-top:1px solid var(--ecc-border);padding-top:16px;margin-top:10px}
.ecc-seal-card.ecc-seal-premium{border-color:var(--ecc-blue);background:linear-gradient(180deg,rgba(66,158,228,.06),var(--ecc-bg-black))}

/* Seal comparison bar */
.ecc-seal-compare{margin-top:80px}
.ecc-seal-compare table{width:100%;border-collapse:collapse}
.ecc-seal-compare th,.ecc-seal-compare td{padding:18px 20px;text-align:left;border-bottom:1px solid var(--ecc-border);font-size:18px}
.ecc-seal-compare th{font-family:var(--ecc-font-condensed);font-weight:700;font-size:18px;text-transform:uppercase;letter-spacing:.1em;color:var(--ecc-blue);background:rgba(66,158,228,.06)}
.ecc-seal-compare td{color:var(--ecc-text)}
.ecc-seal-compare td:first-child{color:var(--ecc-white);font-weight:600}
.ecc-seal-compare tr:hover td{background:rgba(255,255,255,.02)}
.ecc-seal-check{color:var(--ecc-blue)}
.ecc-seal-star{color:var(--ecc-pink)}

/* ======== GALERIE – Before/After Duo ======== */
.ecc-ba-duo{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:60px}
.ecc-ba-offset{margin-top:80px}

/* ======== GALERIE – Masonry ======== */
.ecc-masonry-section{padding:80px 0 120px;background:var(--ecc-bg-alt)}
.ecc-masonry{columns:3;column-gap:20px}
.ecc-masonry-item{break-inside:avoid;margin-bottom:20px;overflow:hidden;position:relative;cursor:pointer}
.ecc-masonry-item img{width:100%;display:block;transition:transform .6s ease}
.ecc-masonry-item:hover img{transform:scale(1.05)}
.ecc-masonry-item-ov{position:absolute;bottom:0;left:0;right:0;padding:30px 20px 20px;background:linear-gradient(transparent 0%,rgba(0,0,0,.75) 100%);opacity:0;transition:opacity .4s ease;z-index:2}
.ecc-masonry-item:hover .ecc-masonry-item-ov{opacity:1}
.ecc-masonry-item-ov span{font-family:var(--ecc-font-condensed);font-weight:700;font-size:18px;color:var(--ecc-white);text-transform:uppercase;letter-spacing:.06em}

/* Hover second image */
.ecc-mi-img2{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s ease;z-index:1}
.ecc-masonry-item:hover .ecc-mi-img2{opacity:1}
.ecc-masonry-item{position:relative}

/* ======== LIGHTBOX ======== */
.ecc-lightbox{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .35s ease,visibility .35s ease}
.ecc-lightbox.ecc-lb-open{opacity:1;visibility:visible}
.ecc-lb-overlay{position:absolute;inset:0;background:rgba(10,10,12,.92);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.ecc-lb-close{position:absolute;top:24px;right:28px;z-index:3;background:none;border:none;color:var(--ecc-white);font-size:36px;cursor:pointer;opacity:.7;transition:opacity .3s}
.ecc-lb-close:hover{opacity:1}
.ecc-lb-prev,.ecc-lb-next{position:absolute;top:50%;transform:translateY(-50%);z-index:3;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);color:var(--ecc-white);width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s;backdrop-filter:blur(4px)}
.ecc-lb-prev{left:24px}
.ecc-lb-next{right:24px}
.ecc-lb-prev:hover,.ecc-lb-next:hover{background:rgba(66,158,228,.25);border-color:var(--ecc-blue)}
.ecc-lb-content{position:relative;z-index:2;max-width:90vw;max-height:85vh;display:flex;flex-direction:column;align-items:center}
.ecc-lb-images{display:flex;gap:16px;max-height:78vh;align-items:center}
.ecc-lb-images img{max-height:78vh;max-width:88vw;object-fit:contain;border:1px solid rgba(255,255,255,.08);display:block}
.ecc-lb-images img[style*="display:none"]{display:none!important}
.ecc-lb-images.ecc-lb-dual img{max-width:44vw}
.ecc-lb-caption{font-family:var(--ecc-font-condensed);font-weight:700;font-size:16px;letter-spacing:.08em;text-transform:uppercase;color:var(--ecc-white);margin-top:16px;text-align:center;opacity:.8}

/* ======== BEFORE/AFTER SLIDER ======== */
.ecc-ba-section{padding:120px 0 60px;background:var(--ecc-bg)}
.ecc-ba-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:60px}
.ecc-ba-card{position:relative;overflow:hidden;cursor:col-resize;background:var(--ecc-bg-black);border:1px solid var(--ecc-border)}
.ecc-ba-card-label{padding:18px 22px 0;margin-bottom:14px}
.ecc-ba-card-label h3{font-family:var(--ecc-font-condensed);font-weight:700;font-size:17px;text-transform:uppercase;letter-spacing:.08em;color:var(--ecc-white)}
.ecc-ba-card-label span{font-size:14px;color:var(--ecc-text-muted)}
.ecc-ba-wrap{position:relative;width:100%;padding-top:66.66%;overflow:hidden;user-select:none;-webkit-user-select:none}
.ecc-ba-wrap img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.ecc-ba-after{clip-path:inset(0 0 0 50%)}
.ecc-ba-line{position:absolute;top:0;bottom:0;left:50%;width:3px;background:var(--ecc-white);z-index:3;transform:translateX(-50%);pointer-events:none}
.ecc-ba-handle{position:absolute;top:50%;left:50%;width:44px;height:44px;background:var(--ecc-white);border-radius:50%;transform:translate(-50%,-50%);z-index:4;display:flex;align-items:center;justify-content:center;pointer-events:none;box-shadow:0 2px 12px rgba(0,0,0,.4)}
.ecc-ba-handle::before,.ecc-ba-handle::after{content:'';width:0;height:0;border-style:solid;position:absolute}
.ecc-ba-handle::before{border-width:6px 8px 6px 0;border-color:transparent var(--ecc-bg-black) transparent transparent;left:8px}
.ecc-ba-handle::after{border-width:6px 0 6px 8px;border-color:transparent transparent transparent var(--ecc-bg-black);right:8px}
.ecc-ba-tag{position:absolute;bottom:12px;z-index:3;font-family:var(--ecc-font-condensed);font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ecc-white);background:rgba(0,0,0,.6);padding:5px 12px;pointer-events:none}
.ecc-ba-tag-before{left:12px}
.ecc-ba-tag-after{right:12px}

/* ======== LEGAL / TEXT PAGES ======== */
.ecc-legal{padding:60px 0 120px}
.ecc-legal h1{font-family:var(--ecc-font-display);font-size:clamp(40px,5vw,64px);color:var(--ecc-white);margin-bottom:40px;line-height:1}
.ecc-legal h2{font-family:var(--ecc-font-condensed);font-weight:700;font-size:22px;text-transform:uppercase;letter-spacing:.06em;color:var(--ecc-white);margin-top:48px;margin-bottom:16px}
.ecc-legal h3{font-family:var(--ecc-font-condensed);font-weight:600;font-size:19px;color:var(--ecc-white);margin-top:32px;margin-bottom:12px}
.ecc-legal p,.ecc-legal li{font-size:18px;color:var(--ecc-text);line-height:1.8;margin-bottom:12px}
.ecc-legal ul{padding-left:20px;list-style:disc}
.ecc-legal a{color:var(--ecc-blue);transition:color var(--ecc-ease)}
.ecc-legal a:hover{color:var(--ecc-pink)}

/* ======== ZUSATZLEISTUNGEN GRID ======== */
.ecc-extra-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:60px}
.ecc-extra-card{background:var(--ecc-bg-black);border:1px solid var(--ecc-border);padding:36px 30px;transition:all var(--ecc-ease)}
.ecc-extra-card:hover{border-color:rgba(66,158,228,.3);transform:translateY(-3px)}
.ecc-extra-card h3{font-family:var(--ecc-font-condensed);font-weight:700;font-size:20px;text-transform:uppercase;letter-spacing:.06em;color:var(--ecc-white);margin-bottom:10px}
.ecc-extra-card p{font-size:16px;color:var(--ecc-text);line-height:1.7}
.ecc-extra-card-tag{display:inline-block;font-family:var(--ecc-font-condensed);font-weight:600;font-size:16px;letter-spacing:.12em;text-transform:uppercase;color:var(--ecc-pink);margin-bottom:14px}

/* ======== RESPONSIVE SUBPAGES ======== */
@media(max-width:1024px){
  .ecc-sub-intro-grid{grid-template-columns:1fr;gap:50px}
  .ecc-svc-row,.ecc-svc-row-rev .ecc-svc-img,.ecc-svc-row-rev .ecc-svc-text{grid-template-columns:1fr}
  .ecc-svc-row{grid-template-columns:1fr;gap:30px}
  .ecc-svc-row-rev .ecc-svc-img{order:0}
  .ecc-svc-row-rev .ecc-svc-text{order:0}
  .ecc-cta-band-inner{flex-direction:column;text-align:center}
  .ecc-cta-band-btns{justify-content:center}
  .ecc-cross-grid{grid-template-columns:1fr}
  .ecc-seal-cards{grid-template-columns:1fr}
  .ecc-ba-grid{grid-template-columns:1fr;max-width:500px;margin-left:auto;margin-right:auto}
  .ecc-ba-duo{grid-template-columns:1fr;max-width:540px;margin-left:auto;margin-right:auto}
  .ecc-ba-offset{margin-top:0}
  .ecc-masonry{columns:2}
  .ecc-extra-grid{grid-template-columns:1fr}
  .ecc-seal-compare{overflow-x:auto}
}
@media(max-width:768px){
  .ecc-page-hero{height:50vh;min-height:340px;max-height:480px;padding-bottom:40px}
  .ecc-page-hero h1{font-size:clamp(36px,10vw,56px)}
  .ecc-page-hero-content{padding:0 20px}
  .ecc-page-hero-sub{font-size:18px}
  .ecc-sub-intro{padding:60px 0 50px}
  .ecc-sub-intro-img img{height:300px}
  .ecc-svc-img img{height:280px}
  .ecc-svc-num{font-size:56px}
  .ecc-detail-services{padding:50px 0 60px}
  .ecc-svc-row{padding:40px 0}
  .ecc-masonry{columns:1}
  .ecc-ba-grid{grid-template-columns:1fr}
  .ecc-cross-grid{grid-template-columns:1fr}
  .ecc-lb-images{flex-direction:column;gap:10px}
  .ecc-lb-images.ecc-lb-dual img{max-width:88vw;max-height:38vh}
  .ecc-lb-prev{left:10px;width:42px;height:42px}
  .ecc-lb-next{right:10px;width:42px;height:42px}
}