/* ===== Mitarbeitershop-Seite: Ergänzungen zur main.css. Ganze Flächen, Typografie, Linien. Keine Effekte, keine Animationen. ===== */
.y-sec{padding:72px 0;margin-top:0!important;margin-bottom:0!important}
.y-sec+section{margin-top:0!important}
.special-header+.y-sec{margin-top:96px!important}
@media (min-width:1024px){.y-sec{padding:128px 0}}
.y-white{background:var(--blue)}
.y-blue{background:var(--blue)}
.y-navy{background:var(--blue)}
.y-kicker{display:none;font-family:var(--font-mono);font-size:13px;line-height:1.5;letter-spacing:.14em;text-transform:uppercase;color:var(--green-dark);margin:0 0 16px}
.y-navy .y-kicker{color:var(--green-neon)}
.y-h2{margin:0;color:var(--green-dark)}
.y-h2 span{display:block}
.y-head{display:grid;gap:20px;margin-bottom:56px}
@media (min-width:1024px){.y-head{grid-template-columns:7fr 5fr;gap:48px;align-items:end;margin-bottom:72px}}
.y-head p{margin:0;max-width:44ch}
.y-h3{margin:0 0 10px;color:var(--green-dark)}
.y-def p{margin:0 0 1rem;max-width:62ch}
.y-def .y-syn{font-family:var(--font-mono);font-size:15px}
.y-def .y-stand{font-size:13px;opacity:.65}

/* Funktions-Reiter (Baustein product-diversity von /textilien) */
.y-func{background:var(--blue)}
.y-func .wrapper{padding-left:20px;padding-right:20px}
.y-func .product-diversity-grid{min-height:0}
.y-func .product-tab-icon{color:var(--green-dark)}
.product-diversity.y-func .product-tabs .product-tab .product-tab-icon{width:56px;height:40px}
@media (width<=1023px){.product-diversity.y-func .product-tabs .product-tab .product-tab-icon{width:34px;height:24px}.product-diversity.y-func .product-tabs .product-tab{gap:12px}}
.y-func .product-tab-icon svg{width:100%;height:100%;display:block}
.y-func .product-tab-icon svg.line{fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.y-func .product-tab-title{width:auto;flex:1}
.y-func .product-content-item{gap:24px}
.y-func .product-description h3{margin:0 0 12px}
.y-func .y-shot{margin:0;border-radius:20px;overflow:hidden}
.y-func .y-shot img{display:block;width:100%;height:auto}
@media (min-width:1024px){
  .y-func .product-content-item .product-content-wrapper{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);grid-template-rows:auto 1fr;column-gap:32px;row-gap:16px;align-items:start}
  .y-func .product-content-wrapper>.product-tag{grid-column:1;grid-row:1;justify-self:start}
  .y-func .product-content-wrapper>.product-description{grid-column:1;grid-row:2}
  .y-func .product-content-wrapper>.y-shot{grid-column:2;grid-row:1/3;align-self:center}
  .y-func .y-shot img{transform:scale(1.12);transform-origin:50% 48%}
  .y-func .product-description p{font-size:16px}
  .y-func .product-tabs .product-tab{padding:10px 24px}
  .product-diversity.y-func .product-tabs .product-tab .product-tab-icon{width:64px;height:46px}
  .product-diversity.y-func .product-tabs .product-tab{gap:24px}
  .y-func .product-content{padding:36px}
  .y-func .product-diversity-grid{min-height:620px}
  .y-func .product-tabs{align-self:stretch}
  .y-func .product-tabs .product-tab{flex:1 1 0;min-height:64px}
}
.y-check{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:12px}
.y-check li{position:relative;padding-left:28px;line-height:1.4}
.y-check li:before{content:"";position:absolute;left:0;top:.15em;width:16px;height:16px;background:no-repeat center/16px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23386a4e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 8.5l3.2 3.2L13 4.8'/%3E%3C/svg%3E")}
.y-cross li:before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23386a4e' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M4 4l8 8M12 4l-8 8'/%3E%3C/svg%3E")}
.y-cross li{opacity:.6}

/* Rollen: vier Textspalten mit Linie */
.y-cols{list-style:none;margin:0;padding:0;display:grid;gap:40px 48px}
@media (min-width:768px){.y-cols{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1200px){.y-cols.four{grid-template-columns:repeat(4,1fr)}}
.y-cols>li{border-top:1px solid currentColor;padding-top:20px}
.y-num{display:block;font-family:var(--font-mono);font-size:13px;letter-spacing:.14em;margin-bottom:28px;color:var(--green-dark)}
.y-cols p{margin:0}
.y-cols .y-check{margin-top:12px}
.y-roles{margin:8px 0 0;border-top:1px solid var(--green-dark)}
.y-roles>div{display:grid;gap:4px 32px;padding:16px 0;border-bottom:1px solid var(--green-dark)}
@media (min-width:768px){.y-roles>div{grid-template-columns:220px 1fr}}
.y-roles dt{font-family:var(--font-mono)}
.y-roles dd{margin:0}
#panel-mitarbeitende .y-roles{margin-top:16px}

/* Vergleich */
.y-cmp{display:grid;gap:40px 48px}
@media (min-width:768px){.y-cmp{grid-template-columns:1fr 1fr}}
.y-cmp>div{border-top:1px solid var(--green-dark);padding-top:20px}

/* Branchen */
.y-ind{list-style:none;margin:0;padding:0;display:grid;gap:48px}
@media (min-width:768px){.y-ind{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1024px){.y-ind{grid-template-columns:repeat(3,1fr)}}
@media (min-width:1280px){.y-ind{grid-template-columns:repeat(5,1fr);gap:40px 32px}}
.y-ind figure{max-width:240px;margin:0 0 24px}
.y-ind img{display:block;width:100%;height:auto}
.y-ind p{margin:0 0 20px}
.y-ind>li{display:flex;flex-direction:column}
.y-ind .button{margin-top:auto;align-self:flex-start}
.y-ind .button .text-button-container{padding:7px 16px;font-size:15px;line-height:1.4}
.y-ind .button .arrow-button-container{width:38px;padding:8px}
.y-ind .button .arrow-button-container svg{width:18px;height:18px}
.y-ind .button .arrow-button-container,.y-ind .button .text-button-container{background-color:var(--green-dark);color:var(--green-neon);transition:background-color .2s,color .2s}
.y-ind .button .arrow-button-container svg path{stroke:var(--green-neon)}
.y-ind .button:hover .arrow-button-container,.y-ind .button:hover .text-button-container{background-color:var(--green-neon);color:var(--green-dark)}
.y-ind .button:hover .arrow-button-container svg path{stroke:var(--green-dark)}
.y-link{font-family:var(--font-mono);font-size:15px;color:var(--green-dark)}

/* Abschluss */
.y-cta{display:grid;gap:48px;align-items:center}
@media (min-width:1024px){.y-cta{grid-template-columns:5fr 7fr;gap:80px}}
.y-cta img{display:block;width:100%;height:auto;border-radius:32px}
.y-cta p{max-width:48ch}
.y-cta .y-contact{font-family:var(--font-mono);font-size:15px;line-height:1.7;margin-top:28px}
.y-cta .y-contact a{color:var(--green-dark)}
.y-cta .button{margin-top:28px}
/* Schritte wie „Step by step zum fertigen Produkt“ (/leistungen), als HTML statt Bild */
.z-steps-bg{animation:none!important;padding:0}
.z-steps{list-style:none;margin:40px auto 0;padding:0;max-width:960px;display:grid;gap:0;grid-template-columns:1fr;text-align:left}
.z-card{background:var(--green-dark);color:var(--white);border-radius:24px;padding:20px 22px 22px;min-height:200px;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto 1fr auto;column-gap:16px}
.z-n{font-size:22px;line-height:1.2}
.z-t{margin:0;font-family:var(--font-sans,inherit);font-weight:400;font-size:22px;line-height:1.2;text-align:right;color:var(--white)}
.z-card p{grid-column:1/-1;grid-row:3;margin:28px 0 0;font-size:14px;line-height:1.4;max-width:34ch}
.z-conn{background:var(--green-neon);border-radius:24px;display:flex;align-items:center;justify-content:center;min-height:56px}
.z-conn svg{width:25px!important;height:25px!important;flex:none;transform:rotate(90deg)}
.z-end svg{transform:none!important}
@media (min-width:768px){
  .z-steps{grid-template-columns:60px 1fr 60px 60px 60px 1fr 60px}
  .z-steps>li:nth-child(1){grid-column:1/3}
  .z-steps>li:nth-child(2){grid-column:3/6}
  .z-steps>li:nth-child(3){grid-column:6/8}
  .z-steps>li:nth-child(4){grid-column:1}
  .z-steps>li:nth-child(5){grid-column:2/4}
  .z-steps>li:nth-child(6){grid-column:4}
  .z-steps>li:nth-child(7){grid-column:5/7}
  .z-steps>li:nth-child(8){grid-column:7}
  .z-steps>li:nth-child(9){grid-column:1/3}
  .z-steps>li:nth-child(10){grid-column:3/8}
  .z-conn svg{transform:none}
}
#anfrage{padding-bottom:72px;background-color:var(--blue)}
@media (min-width:1024px){#anfrage{padding-bottom:120px}}
#anfrage .text-box{padding-bottom:40px}
#anfrage .image-box{overflow:hidden;display:flex}
#anfrage .image-box img{width:100%;height:100%;object-fit:cover;display:block;margin-bottom:0;border-radius:16px}
#anfrage .text-box,#anfrage .image-box{border-radius:16px}
#anfrage+.faqs{padding-top:72px}
@media (min-width:1024px){#anfrage+.faqs{padding-top:120px}}
.faq .answer{transition:none!important}
.y-sec+.faqs{padding-top:72px}
@media (min-width:1024px){.y-sec+.faqs{padding-top:128px}}

.todo{background:#fff2a8;color:#5b4a00;padding:0 .25em;border-radius:3px}

/* Seitenrahmen wie Template services (Leistungen) */
.shops{background-color:var(--blue)}
@media (width>=1024px){.shops .special-header .text-container{background-color:var(--blue)}}
.shops .steps{text-align:center}
.shops .steps .step-image-desktop{max-width:848px;margin:0 auto}
