:root{--o:#FF6E00;--m:#E8007E;--p:#6E2391;--dk:#14101c;--dk2:#1d1727;--tx:#f4eff8;--mu:#b9aec6;--grad:linear-gradient(90deg,var(--o),var(--m) 55%,var(--p));--r:14px}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:"Liberation Sans",Arial,Helvetica,system-ui,sans-serif;background:var(--dk);color:var(--tx);line-height:1.6;
background-image:linear-gradient(rgba(120,170,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(120,170,255,.05) 1px,transparent 1px),linear-gradient(rgba(120,170,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(120,170,255,.025) 1px,transparent 1px);
background-size:100px 100px,100px 100px,20px 20px,20px 20px}
a{color:inherit}
img{max-width:100%;display:block}
.wrap{width:min(1120px,92%);margin:0 auto}
/* Header */
.top{position:sticky;top:0;z-index:50;background:rgba(20,16,28,.88);backdrop-filter:blur(8px);border-bottom:1px solid rgba(255,255,255,.08)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.6rem 0}
.brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;font-weight:700}
.brand img{width:44px;height:44px;border-radius:50%;box-shadow:0 0 0 2px var(--m)}
.brand small{display:block;font-weight:400;color:var(--mu);font-size:.75rem;letter-spacing:.08em;text-transform:uppercase}
nav ul{display:none;list-style:none;gap:1.4rem}
nav a{text-decoration:none;color:var(--mu);font-weight:700;font-size:.95rem}
nav a:hover{color:#fff}
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.8rem 1.4rem;border-radius:999px;font-weight:700;text-decoration:none;border:0;cursor:pointer;font-size:1rem;font-family:inherit}
.btn-grad{background:var(--grad);color:#fff;box-shadow:0 6px 24px rgba(232,0,126,.35)}
.btn-grad:hover{filter:brightness(1.1)}
.btn-ghost{border:2px solid rgba(255,255,255,.5);color:#fff}
.btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.08)}
.btn-sm{padding:.5rem 1rem;font-size:.9rem}
/* Hero */
.hero{position:relative;min-height:88vh;display:flex;align-items:center;overflow:hidden;isolation:isolate}
.hero::before{content:"";position:absolute;inset:0;background:url(img/hero.jpg) center/cover no-repeat;z-index:-2}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(20,16,28,.55),rgba(20,16,28,.35) 40%,var(--dk)),linear-gradient(90deg,rgba(110,35,145,.55),rgba(232,0,126,.15) 60%,transparent)}
.hero .wrap{padding:6rem 0 4rem}
.kicker{display:inline-block;padding:.3rem .9rem;border-radius:999px;background:rgba(255,110,0,.18);border:1px solid rgba(255,110,0,.6);color:#ffd2b0;font-weight:700;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase}
.hero h1{font-size:clamp(1.92rem,7.2vw,4.32rem);line-height:1.02;margin:.8rem 0 .6rem;letter-spacing:-.01em;text-transform:uppercase}
.hero h1 span{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p.claim{text-shadow:0 2px 10px rgba(0,0,0,.7);font-size:clamp(1.05rem,2.6vw,1.35rem);max-width:640px;color:#ece4f2}
.tags{text-shadow:0 2px 8px rgba(0,0,0,.7);margin:1rem 0 1.8rem;color:#ffd9ec;font-weight:700;letter-spacing:.04em}
.cta{display:flex;flex-wrap:wrap;gap:.8rem}
.sparks{position:absolute;right:6%;top:30%;width:260px;height:260px;pointer-events:none;opacity:.9}
.sparks i{position:absolute;left:50%;top:50%;width:3px;height:3px;border-radius:50%;background:#fff6c8;box-shadow:0 0 6px 2px #ffb347;animation:fly 1.6s linear infinite}
@keyframes fly{0%{transform:translate(0,0);opacity:1}100%{transform:translate(var(--x),var(--y));opacity:0}}
/* weld bead divider */
.bead{height:18px;background:radial-gradient(circle at 50% 30%,#fff 0 1.5px,transparent 2px),radial-gradient(ellipse 9px 7px at 50% 50%,#ffd2e8 0,#e8a0ff 35%,#8a6fd8 60%,#3a2a55 75%,transparent 78%);background-size:14px 18px;background-repeat:repeat-x;opacity:.9;filter:drop-shadow(0 0 4px rgba(232,0,126,.6))}
.bead.grad{background-color:transparent;border-top:2px solid transparent}
/* Sections */
section{padding:4.5rem 0}
.sec-head{margin-bottom:2.2rem}
.sec-head .no{font-family:"Liberation Mono",monospace;color:var(--o);font-size:.85rem;letter-spacing:.15em}
.sec-head h2{font-size:clamp(1.8rem,5vw,2.7rem);line-height:1.15;text-transform:uppercase}
.sec-head p{color:var(--mu);max-width:680px;margin-top:.5rem}
.bar{width:90px;height:5px;border-radius:3px;background:var(--grad);margin-top:.8rem}
.grid{display:grid;gap:1.2rem}
.card{position:relative;background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.1);border-radius:var(--r);padding:1.6rem;overflow:hidden}
.card::before{content:"";position:absolute;left:0;top:0;right:0;height:4px;background:var(--grad)}
.card .ic{width:54px;height:54px;border-radius:12px;display:grid;place-items:center;background:rgba(232,0,126,.14);margin-bottom:1rem}
.card h3{font-size:1.25rem;margin-bottom:.4rem}
.card p,.card li{color:var(--mu)}
.card ul{margin:.6rem 0 0 1.1rem}
.chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.9rem}
.chip{padding:.3rem .8rem;border-radius:999px;font-weight:700;font-size:.85rem;color:#fff}
.c-es{background:linear-gradient(90deg,#8a96a8,#c7cfdb);color:#1a1a1a}.c-al{background:linear-gradient(90deg,#9fb3c8,#e6eef6);color:#1a1a1a}
.c-ti{background:linear-gradient(90deg,#d6a54a,#8a5bd6,#3a7bd5)}.c-st{background:linear-gradient(90deg,#4a4f57,#7a8088)}
/* Fachbetrieb */
.fach{background:linear-gradient(135deg,rgba(255,110,0,.12),rgba(232,0,126,.12) 50%,rgba(110,35,145,.2));border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08)}
.fach .grid{align-items:center}
.checks{list-style:none;display:grid;gap:.8rem}
.checks li{display:flex;gap:.7rem;align-items:flex-start}
.checks li::before{content:"¹3";flex:0 0 24px;height:24px;margin-top:.1rem;border-radius:50%;background:var(--grad);color:#fff;font-weight:700;font-size:.8rem;display:grid;place-items:center}
.ph-inline{display:inline-block;padding:.05rem .5rem;border:1px dashed var(--o);border-radius:6px;color:#ffc79a;font-family:"Liberation Mono",monospace;font-size:.85em}
.logo-big{width:min(340px,80%);margin:0 auto;border-radius:50%;box-shadow:0 0 0 6px rgba(255,255,255,.08),0 20px 60px rgba(232,0,126,.35)}
/* Referenzen */
.ref{aspect-ratio:4/3;border:2px dashed rgba(255,110,0,.65);border-radius:var(--r);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;text-align:center;padding:1rem;
background:repeating-linear-gradient(45deg,rgba(255,255,255,.02) 0 12px,rgba(255,255,255,.045) 12px 24px);color:var(--mu)}
.ref strong{color:#fff;font-size:1.1rem}
.ref code{font-family:"Liberation Mono",monospace;font-size:.8rem;color:#ffc79a;background:rgba(0,0,0,.3);padding:.15rem .5rem;border-radius:5px}
/* Kontakt */
.kontakt dl{display:grid;gap:1rem}
.kontakt dt{font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--o);font-weight:700}
.kontakt dd a{text-decoration:none;font-weight:700;font-size:1.1rem}
.kontakt dd a:hover{text-decoration:underline}
form{display:grid;gap:.8rem}
label{font-weight:700;font-size:.9rem}
input,textarea{width:100%;padding:.8rem 1rem;border-radius:10px;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.25);color:#fff;font:inherit}
input:focus,textarea:focus{outline:2px solid var(--m);border-color:transparent}
textarea{min-height:130px;resize:vertical}
.note{font-size:.85rem;color:var(--mu)}
/* Footer */
footer{background:#0e0b14;padding:3rem 0 2rem;margin-top:2rem;border-top:4px solid;border-image:var(--grad) 1}
footer .grid{gap:2rem}
footer h4{text-transform:uppercase;letter-spacing:.1em;font-size:.85rem;color:var(--o);margin-bottom:.6rem}
footer p,footer a{color:var(--mu);font-size:.92rem}
.copy{margin-top:2rem;padding-top:1rem;border-top:1px solid rgba(255,255,255,.08);font-size:.82rem;color:#7d7389;display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between}
.float-wa{position:fixed;right:16px;bottom:16px;z-index:60;width:58px;height:58px;border-radius:50%;background:#25D366;display:grid;place-items:center;box-shadow:0 8px 24px rgba(0,0,0,.4)}
@media(min-width:720px){.g2{grid-template-columns:1fr 1fr}.g3{grid-template-columns:repeat(2,1fr)}.refs{grid-template-columns:repeat(2,1fr)}}
@media(min-width:980px){nav ul{display:flex}.g3{grid-template-columns:repeat(3,1fr)}.refs{grid-template-columns:repeat(3,1fr)}.ftg{grid-template-columns:2fr 1fr 1fr}}
@media(max-width:719px){.sparks{right:-40px;top:12%;opacity:.6}.top .btn-sm span{display:none}}
@media(prefers-reduced-motion:reduce){.sparks i{animation:none;display:none}html{scroll-behavior:auto}}
/* Datenschutz / Rechtstexte */
.legal{padding:3.5rem 0 4rem}
.legal .wrap{max-width:860px}
.legal h2{font-size:1.35rem;margin:2.4rem 0 .6rem;padding-top:.4rem;text-transform:none}
.legal h2 .n{color:var(--o);font-family:"Liberation Mono",monospace;margin-right:.4rem}
.legal h3{font-size:1.05rem;margin:1.2rem 0 .3rem;color:#ffd9ec}
.legal p,.legal li{color:#ddd3e6;margin-bottom:.6rem}
.legal ul{margin:.4rem 0 .8rem 1.3rem}
.legal a{color:#ffb3d9}
.legal .box{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-left:4px solid var(--m);border-radius:10px;padding:1rem 1.2rem;margin:.8rem 0}
.legal .box p{margin:0}
.toc{columns:1;margin-top:1rem}
.toc a{text-decoration:none}
.back{display:inline-flex;gap:.4rem;align-items:center;text-decoration:none;color:var(--mu);font-weight:700;margin-bottom:1.2rem}
.back:hover{color:#fff}
.review{margin-top:2.5rem;padding:1rem 1.2rem;border:1px dashed var(--o);border-radius:10px;color:#ffc79a;font-size:.9rem}
@media(min-width:720px){.toc{columns:2}}
.page-title{font-size:clamp(1.8rem,5vw,2.7rem);line-height:1.15;text-transform:uppercase}

/* Industriemontagen – breite Spezial-Karte */
.card-wide{grid-column:1/-1;display:flex;gap:1.4rem;align-items:flex-start;border:1px solid rgba(232,0,126,.55);background:linear-gradient(120deg,rgba(255,110,0,.16),rgba(232,0,126,.12) 50%,rgba(110,35,145,.2)),repeating-linear-gradient(0deg,transparent 0 31px,rgba(255,255,255,.05) 31px 32px),repeating-linear-gradient(90deg,transparent 0 31px,rgba(255,255,255,.05) 31px 32px);box-shadow:0 0 0 1px rgba(255,110,0,.15),0 10px 40px rgba(232,0,126,.18)}
.card-wide .wide-body{flex:1}
.card-wide .badge{display:inline-block;font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:.25rem .7rem;border-radius:999px;background:linear-gradient(90deg,#FF6E00,#E8007E);color:#fff;margin-bottom:.5rem}
.card-wide ul.cols{columns:1;gap:2rem}
@media(min-width:720px){.card-wide ul.cols{columns:2}}
@media(max-width:560px){.card-wide{flex-direction:column}}
.card-wide>.ic{flex:0 0 54px}
.card-wide ul.cols li{break-inside:avoid}
/* Imbiss */
.imbiss{position:relative;background:radial-gradient(ellipse at 85% 0%,rgba(255,110,0,.18),transparent 55%),radial-gradient(ellipse at 0% 100%,rgba(110,35,145,.25),transparent 60%)}
.imbiss-card{overflow:hidden}
.imbiss-info{display:grid;gap:.9rem;margin-top:.8rem}
.imbiss-info dt{font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--o);font-weight:700}
.imbiss-info dd{color:var(--tx)}
.imbiss-info a{font-weight:700}
.imbiss-pics{margin-top:1.2rem}
.imbiss-ph{aspect-ratio:16/10}
.flames{position:absolute;right:18px;top:14px;display:flex;gap:6px;align-items:flex-end;opacity:.85}
.flames i{display:block;width:14px;height:26px;border-radius:50% 50% 45% 45%/65% 65% 35% 35%;background:linear-gradient(0deg,var(--p),var(--m) 40%,var(--o) 75%,#ffd27a);filter:blur(.3px) drop-shadow(0 0 6px rgba(255,110,0,.7));transform-origin:50% 100%;animation:flick 1.2s ease-in-out infinite alternate}
.flames i:nth-child(2){height:36px;animation-delay:-.4s}
.flames i:nth-child(3){height:22px;animation-delay:-.8s}
@keyframes flick{0%{transform:scaleY(1) skewX(0)}50%{transform:scaleY(1.15) skewX(4deg)}100%{transform:scaleY(.9) skewX(-3deg)}}
@media(prefers-reduced-motion:reduce){.flames i{animation:none}}
/* Referenzen-Galerie */
.gallery{display:grid;gap:1rem;grid-template-columns:1fr}
.gal-item{margin:0;background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.1);border-radius:var(--r);overflow:hidden;position:relative;display:flex;flex-direction:column}
.gal-item::before{content:"";position:absolute;left:0;top:0;right:0;height:4px;background:var(--grad);z-index:2}
.gal-item a{position:relative;display:block;aspect-ratio:4/3;overflow:hidden;background:#000}
.gal-item img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease,filter .4s}
.gal-item a::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(110,35,145,.55));pointer-events:none}
.gal-item a:hover img,.gal-item a:focus-visible img{transform:scale(1.05);filter:saturate(1.1)}
.gal-zoom{position:absolute;right:10px;bottom:10px;z-index:1;width:34px;height:34px;border-radius:50%;background:var(--grad);color:#fff;font-weight:700;font-size:1.3rem;display:grid;place-items:center;box-shadow:0 4px 14px rgba(0,0,0,.4)}
.gal-item figcaption{padding:.8rem 1rem 1rem;font-weight:700;font-size:.95rem;line-height:1.4}
.gal-note{display:block;margin-top:.3rem;font-weight:400;font-size:.85rem;color:#ffc79a}
.gal-note::before{content:"\25B8  ";color:var(--o)}
@media(min-width:620px){.gallery{grid-template-columns:repeat(2,1fr)}}
@media(min-width:980px){.gallery{grid-template-columns:repeat(3,1fr)}}
/* Lightbox (reines CSS, :target) */
.lb{display:none;position:fixed;inset:0;z-index:100;align-items:center;justify-content:center;padding:3.5rem 1rem 1rem}
.lb:target{display:flex}
.lb-bg{position:absolute;inset:0;background:rgba(14,11,20,.94)}
.lb figure{position:relative;margin:0;max-width:min(1200px,100%);max-height:100%;display:flex;flex-direction:column;align-items:center}
.lb img{max-width:100%;max-height:calc(100vh - 9rem);object-fit:contain;border-radius:10px;box-shadow:0 0 0 2px rgba(232,0,126,.5),0 20px 60px rgba(0,0,0,.6)}
.lb figcaption{margin-top:.8rem;text-align:center;font-weight:700;color:#fff}
.lb-x,.lb-p,.lb-n{position:absolute;z-index:2;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:var(--grad);color:#fff;text-decoration:none;font-size:1.8rem;line-height:1}
.lb-x{top:12px;right:12px}
.lb-p{left:12px;top:50%;transform:translateY(-50%)}
.lb-n{right:12px;top:50%;transform:translateY(-50%)}

/* Kontrast: dünner weißer Rand */
.hero h1 span{background:linear-gradient(90deg,#CC5800,#BA0065 55%,#581C74);-webkit-background-clip:text;background-clip:text;-webkit-text-stroke:1.1px #fff;paint-order:stroke fill}
.hero p.tags{color:#ccaebd;-webkit-text-stroke:.44px #fff;paint-order:stroke fill}