:root{
    --ink:#0d0e12;
    --ink-2:#16181e;
    --paper:#f3f1ec;
    --paper-2:#eae7df;
    --signal:#c8102e;
    --signal-2:#9c0c22;
    --steel:#5b6068;
    --steel-line:#2a2d33;
    --white:#ffffff;
    --line:rgba(255,255,255,.12);
    --line-dark:rgba(13,14,18,.12);
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    font-family:'Inter',sans-serif;
    background:var(--paper);
    color:var(--ink);
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3,.display{
    font-family:'Barlow Condensed',sans-serif;
    text-transform:uppercase;
    letter-spacing:.01em;
    font-weight:700;
    line-height:.98;
    margin:0;
  }
  .mono{
    font-family:'IBM Plex Mono',monospace;
    letter-spacing:.06em;
    text-transform:uppercase;
    font-size:12px;
  }
  a{color:inherit;text-decoration:none;}
  img{display:block;max-width:100%;}
  .wrap{max-width:1240px;margin:0 auto;padding:0 32px;}

  /* ---------- signature: cross-section ring divider ---------- */
  .ring-divider{
    display:flex;align-items:center;justify-content:center;
    padding:10px 0;
  }
  .ring-divider svg{width:34px;height:34px;}

  /* ---------- header ---------- */
  header{
    position:sticky;top:0;z-index:50;
    background:var(--ink);
    border-bottom:1px solid var(--line);
  }
  .nav{
    display:flex;align-items:center;justify-content:space-between;
    padding:16px 32px;max-width:1240px;margin:0 auto;
  }
  .logo{display:flex;align-items:center;gap:12px;color:var(--white);}
  .logo-mark{height:44px;width:auto;display:block;}
  .logo-text .display{font-size:22px;color:var(--white);}
  .logo-text .mono{color:var(--steel);font-size:10px;}
  nav.links{display:flex;gap:28px;}
  nav.links a{
    color:#cfd1d6;font-size:14px;font-weight:500;
    padding:6px 0;border-bottom:2px solid transparent;
    transition:.2s;
  }
  nav.links a:hover, nav.links a.active{color:var(--white);border-color:var(--signal);}
  .call-btn{
    display:flex;align-items:center;gap:10px;
    background:var(--signal);color:var(--white);
    padding:11px 20px;border-radius:2px;font-size:14px;font-weight:600;
    white-space:nowrap;
  }
  .call-btn:hover{background:var(--signal-2);}
  .burger{display:none;color:var(--white);font-size:24px;background:none;border:none;}

  /* ---------- hero ---------- */
  .hero{
    position:relative;background:var(--ink);color:var(--white);
    overflow:hidden;
  }
  .hero-grid{
    display:grid;grid-template-columns:1.1fr .9fr;
    max-width:1240px;margin:0 auto;min-height:640px;
  }
  .hero-copy{
    padding:80px 32px 64px 32px;display:flex;flex-direction:column;justify-content:center;
    position:relative;z-index:2;
  }
  .eyebrow{
    color:var(--signal);display:flex;align-items:center;gap:10px;margin-bottom:22px;
  }
  .eyebrow::before{content:"";width:28px;height:2px;background:var(--signal);display:block;}
  .hero-copy h1{font-size:clamp(42px,5.4vw,72px);color:var(--white);}
  .hero-copy h1 span{color:var(--signal);}
  .hero-copy p.lede{
    font-family:'Inter';font-size:17px;color:#c6c8ce;max-width:440px;
    margin:26px 0 34px 0;line-height:1.6;
  }
  .btn-row{display:flex;gap:14px;flex-wrap:wrap;}
  .btn{
    padding:15px 26px;font-size:14px;font-weight:600;border-radius:2px;
    display:inline-flex;align-items:center;gap:10px;
  }
  .btn-primary{background:var(--signal);color:var(--white);}
  .btn-primary:hover{background:var(--signal-2);}
  .btn-ghost{border:1px solid rgba(255,255,255,.3);color:var(--white);}
  .btn-ghost:hover{border-color:var(--white);}

  .hero-photo{
    position:relative;
  }
  .hero-photo img{
    width:100%;height:100%;object-fit:cover;
    filter:grayscale(15%) contrast(1.05);
  }
  .hero-photo::after{
    content:"";position:absolute;inset:0;
    background:linear-gradient(90deg, rgba(13,14,18,.85) 0%, rgba(13,14,18,0) 24%);
  }
  .hero-tag{
    position:absolute;bottom:28px;right:28px;z-index:3;
    background:var(--ink);border:1px solid var(--signal);
    padding:14px 18px;max-width:230px;
  }
  .hero-tag .mono{color:var(--signal);font-size:10px;}
  .hero-tag p{font-family:'Inter';font-size:13px;color:#d8d9dc;margin:6px 0 0 0;line-height:1.5;}

  /* ---------- credential strip ---------- */
  .strip{
    background:var(--ink-2);border-bottom:1px solid var(--line);
  }
  .strip-grid{
    display:grid;grid-template-columns:repeat(3,1fr);
    max-width:1240px;margin:0 auto;
  }
  .strip-item{
    padding:36px 28px;border-right:1px solid var(--line);color:var(--white);
    display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px;
  }
  .strip-item:last-child{border-right:none;}
  .strip-icon{
    width:56px;height:56px;border-radius:50%;border:1.5px solid var(--signal);
    display:flex;align-items:center;justify-content:center;
  }
  .strip-item svg{flex:none;width:24px;height:24px;color:var(--signal);}
  .strip-item h3{font-size:18px;letter-spacing:.03em;color:var(--white);margin-bottom:4px;}
  .strip-item p{font-family:'Inter';font-size:13px;color:#a6a9af;line-height:1.5;margin:0;max-width:190px;}

  /* ---------- about ---------- */
  .about{padding:100px 0;background:var(--paper);}
  .about-grid{
    display:grid;grid-template-columns:.95fr 1.05fr;gap:70px;align-items:center;
  }
  .about-copy .mono{color:var(--signal);margin-bottom:14px;display:block;}
  .about-copy h2{font-size:clamp(34px,4vw,50px);margin-bottom:22px;}
  .about-copy p{font-family:'Inter';font-size:15.5px;color:#4a4d53;line-height:1.75;max-width:480px;}
  .about-copy .btn-primary{margin-top:26px;}
  .about-photo{position:relative;}
  .about-photo img{width:100%;height:460px;object-fit:cover;}
  .about-badge{
    position:absolute;left:-30px;bottom:-30px;
    background:var(--signal);color:var(--white);padding:24px;width:230px;
  }
  .about-badge h4{font-size:20px;color:var(--white);margin-bottom:8px;}
  .about-badge p{font-family:'Inter';font-size:12.5px;line-height:1.5;color:#ffd7dc;margin:0;}

  /* ---------- services ---------- */
  .services{padding:100px 0 110px 0;background:var(--ink);color:var(--white);}
  .services-head{
    display:flex;justify-content:space-between;align-items:flex-end;
    margin-bottom:52px;gap:30px;flex-wrap:wrap;
  }
  .services-head .mono{color:var(--signal);display:block;margin-bottom:14px;}
  .services-head h2{font-size:clamp(32px,4vw,46px);color:var(--white);max-width:560px;}
  .services-head p{font-family:'Inter';color:#a6a9af;max-width:340px;font-size:14.5px;line-height:1.6;}
  .service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
  .service-card{background:var(--ink-2);border:1px solid var(--line);padding:0;position:relative;border-radius:3px;overflow:hidden;transition:transform .3s,border-color .3s;}
  .service-card:hover{transform:translateY(-4px);border-color:var(--signal);}
  .service-photo{height:190px;overflow:hidden;position:relative;}
  .service-photo img{width:100%;height:100%;object-fit:cover;transition:transform .5s;}
  .service-card:hover .service-photo img{transform:scale(1.06);}
  .service-icon{
    position:absolute;left:20px;bottom:-24px;z-index:2;
    width:48px;height:48px;border-radius:50%;background:var(--ink);
    border:1px solid var(--signal);display:flex;align-items:center;justify-content:center;
  }
  .service-icon svg{width:20px;height:20px;color:var(--signal);}
  .service-body{padding:40px 22px 28px 22px;}
  .service-body h3{font-size:20px;color:var(--white);margin-bottom:10px;}
  .service-body p{font-family:'Inter';font-size:13px;color:#9a9da3;line-height:1.55;margin:0;}

  /* ---------- process / signature band ---------- */
  .process{background:var(--paper-2);padding:90px 0;}
  .process-head{text-align:center;max-width:600px;margin:0 auto 56px auto;}
  .process-head .mono{color:var(--signal);display:block;margin-bottom:14px;}
  .process-head h2{font-size:clamp(30px,4vw,42px);}
  .process-track{
    display:grid;grid-template-columns:repeat(4,1fr);position:relative;
  }
  .process-track::before{
    content:"";position:absolute;top:19px;left:0;right:0;height:1px;
    background:repeating-linear-gradient(90deg, var(--steel) 0 8px, transparent 8px 16px);
  }
  .p-step{padding:0 20px;text-align:center;position:relative;}
  .p-ring{
    width:40px;height:40px;border-radius:50%;background:var(--paper-2);
    border:2px solid var(--signal);margin:0 auto 22px auto;position:relative;z-index:2;
    display:flex;align-items:center;justify-content:center;font-family:'IBM Plex Mono';font-size:13px;color:var(--signal);
  }
  .p-step h4{font-family:'Barlow Condensed';font-weight:700;font-size:18px;text-transform:uppercase;margin-bottom:8px;}
  .p-step p{font-family:'Inter';font-size:13px;color:#63666d;line-height:1.55;max-width:220px;margin:0 auto;}

  /* ---------- contact ---------- */
  .contact{background:linear-gradient(120deg,var(--signal-2) 0%, var(--signal) 55%, var(--ink) 55%);color:var(--white);padding:100px 0 0 0;}
  .contact-grid{display:grid;grid-template-columns:1fr 1fr 0.85fr;gap:50px;align-items:start;}
  .contact-copy p.lede{color:rgba(255,255,255,.85);}
  .contact-card{
    background:var(--ink-2);border:1px solid var(--line);border-radius:4px;
    padding:32px 26px;
  }
  .contact-card .logo{margin-bottom:18px;}
  .contact-card ul{list-style:none;padding:0;margin:16px 0 0 0;display:flex;flex-direction:column;gap:12px;}
  .contact-card ul li{display:flex;align-items:center;gap:10px;font-size:14px;color:#d8d9dc;}
  .contact-card ul li svg{width:16px;height:16px;color:#3ecf6a;flex:none;}
  form input, form textarea{width:100%;}
  .contact-copy .mono{color:var(--signal);display:block;margin-bottom:14px;}
  .contact-copy h2{font-size:clamp(30px,4vw,42px);color:var(--white);margin-bottom:18px;}
  .contact-copy p.lede{font-family:'Inter';color:#a6a9af;font-size:14.5px;max-width:400px;line-height:1.65;margin-bottom:34px;}
  .contact-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:18px;}
  .contact-list li{display:flex;gap:14px;align-items:center;font-size:15px;}
  .contact-list svg{width:20px;height:20px;color:var(--signal);flex:none;}
  form{display:flex;flex-direction:column;gap:14px;}
  form input, form textarea{
    background:var(--ink-2);border:1px solid var(--line);color:var(--white);
    padding:14px 16px;font-family:'Inter';font-size:14px;border-radius:2px;
  }
  form input::placeholder, form textarea::placeholder{color:#797d84;}
  form textarea{resize:vertical;min-height:110px;}
  form button{
    align-self:flex-start;background:var(--signal);color:var(--white);border:none;
    padding:15px 28px;font-family:'Inter';font-weight:600;font-size:14px;border-radius:2px;cursor:pointer;
  }
  form button:hover{background:var(--signal-2);}

  footer{
    margin-top:70px;border-top:1px solid var(--line);padding:26px 0;
  }
  .footer-grid{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;}
  .footer-grid .mono{color:#797d84;}
  .footer-links{display:flex;gap:22px;}
  .footer-links a{font-size:13px;color:#a6a9af;}
  .footer-links a:hover{color:var(--white);}

  @media(max-width:900px){
    .hero-grid{grid-template-columns:1fr;min-height:auto;}
    .hero-photo{height:340px;order:-1;}
    .hero-photo::after{background:linear-gradient(180deg, rgba(13,14,18,0) 60%, rgba(13,14,18,1) 100%);}
    .strip-grid{grid-template-columns:1fr 1fr;}
    .strip-item{border-bottom:1px solid var(--line);}
    .about-grid{grid-template-columns:1fr;gap:50px;}
    .about-badge{position:static;width:auto;margin-top:-6px;}
    .service-grid{grid-template-columns:1fr 1fr;}
    .process-track{grid-template-columns:1fr 1fr;row-gap:40px;}
    .process-track::before{display:none;}
    .contact-grid{grid-template-columns:1fr;}
    nav.links{display:none;}
    .burger{display:block;}
  }

/* ============ ADDITIONAL: inner-page components ============ */

/* small page banner used on all sub-pages */
.page-hero{
  position:relative;background:var(--ink);color:var(--white);
  padding:150px 0 70px 0;overflow:hidden;
}
.page-hero .bg{
  position:absolute;inset:0;z-index:0;
}
.page-hero .bg img{width:100%;height:100%;object-fit:cover;opacity:.28;filter:grayscale(40%);}
.page-hero .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(13,14,18,.4) 0%, var(--ink) 92%);}
.page-hero .wrap{position:relative;z-index:2;}
.breadcrumb{color:#9a9da3;font-size:13px;display:flex;gap:8px;align-items:center;margin-bottom:18px;}
.breadcrumb a{color:#c6c8ce;}
.breadcrumb a:hover{color:var(--white);}
.page-hero h1{font-size:clamp(38px,5vw,58px);color:var(--white);}
.page-hero h1 span{color:var(--signal);}
.page-hero p{font-family:'Inter';font-size:15.5px;color:#a6a9af;max-width:520px;margin-top:16px;line-height:1.6;}

/* value cards (Über uns) */
.value-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:50px;}
.value-card{background:var(--white);border:1px solid var(--line-dark);padding:28px 24px;border-radius:3px;}
.value-card .strip-icon{border-color:var(--signal);width:48px;height:48px;margin-bottom:16px;}
.value-card .strip-icon svg{width:20px;height:20px;color:var(--signal);}
.value-card h3{font-size:19px;margin-bottom:8px;}
.value-card p{font-family:'Inter';font-size:13.5px;color:#5a5d63;line-height:1.6;margin:0;}

/* timeline (Über uns) */
.timeline{margin-top:60px;border-top:1px solid var(--line-dark);}
.t-row{display:grid;grid-template-columns:120px 1fr;gap:30px;padding:26px 0;border-bottom:1px solid var(--line-dark);}
.t-row .yr{font-family:'Barlow Condensed';font-weight:700;font-size:26px;color:var(--signal);}
.t-row h4{font-size:17px;margin-bottom:6px;text-transform:none;font-family:'Inter';font-weight:600;}
.t-row p{font-family:'Inter';font-size:13.5px;color:#5a5d63;line-height:1.6;margin:0;max-width:520px;}

/* service detail rows (Dienstleistungen) */
.svc-detail{padding:80px 0;border-bottom:1px solid var(--line-dark);}
.svc-detail:last-child{border-bottom:none;}
.svc-detail .grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;}
.svc-detail.reverse .grid{direction:rtl;}
.svc-detail.reverse .grid > *{direction:ltr;}
.svc-detail img{width:100%;height:360px;object-fit:cover;border-radius:2px;}
.svc-num{font-family:'IBM Plex Mono';color:var(--signal);font-size:13px;display:block;margin-bottom:14px;}
.svc-detail h2{font-size:clamp(28px,3.4vw,38px);margin-bottom:16px;}
.svc-detail p{font-family:'Inter';font-size:15px;color:#4a4d53;line-height:1.75;max-width:460px;margin-bottom:18px;}
.svc-list{list-style:none;padding:0;margin:0 0 24px 0;display:flex;flex-direction:column;gap:10px;}
.svc-list li{display:flex;gap:10px;align-items:flex-start;font-family:'Inter';font-size:14px;color:#3a3d43;}
.svc-list svg{width:17px;height:17px;color:var(--signal);flex:none;margin-top:2px;}

/* gallery (Referenzen) */
.gallery{padding:90px 0;background:var(--paper);}
.filter-row{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:44px;}
.filter-pill{font-family:'IBM Plex Mono';font-size:11px;text-transform:uppercase;letter-spacing:.06em;
  padding:8px 16px;border:1px solid var(--line-dark);border-radius:20px;color:#5a5d63;}
.filter-pill.active{background:var(--ink);color:var(--white);border-color:var(--ink);}
.g-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.g-card{position:relative;overflow:hidden;border-radius:3px;height:280px;}
.g-card img{width:100%;height:100%;object-fit:cover;transition:transform .5s;}
.g-card:hover img{transform:scale(1.08);}
.g-overlay{
  position:absolute;inset:0;background:linear-gradient(0deg, rgba(13,14,18,.88) 0%, rgba(13,14,18,0) 55%);
  display:flex;flex-direction:column;justify-content:flex-end;padding:20px;color:var(--white);
}
.g-overlay .mono{color:var(--signal);font-size:10px;}
.g-overlay h4{font-size:19px;margin-top:6px;}

/* testimonials */
.testimonials{background:var(--ink);color:var(--white);padding:90px 0;}
.t-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:50px;}
.t-card{background:var(--ink-2);border:1px solid var(--line);padding:28px 24px;border-radius:3px;}
.t-card p{font-family:'Inter';font-size:14px;color:#c6c8ce;line-height:1.7;margin-bottom:20px;}
.t-card .who{display:flex;align-items:center;gap:12px;}
.t-avatar{width:36px;height:36px;border-radius:50%;background:var(--signal);display:flex;align-items:center;justify-content:center;font-family:'Barlow Condensed';font-weight:700;font-size:14px;}
.t-card .who div h5{font-size:14px;margin:0;font-family:'Inter';font-weight:600;text-transform:none;}
.t-card .who div span{font-size:12px;color:#797d84;}

/* karriere */
.perks-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:50px;}
.perk{background:var(--white);border:1px solid var(--line-dark);padding:24px 20px;border-radius:3px;text-align:center;}
.perk .strip-icon{margin:0 auto 14px auto;border-color:var(--signal);width:46px;height:46px;}
.perk .strip-icon svg{width:19px;height:19px;color:var(--signal);}
.perk h4{font-size:16px;margin-bottom:6px;text-transform:none;font-family:'Inter';font-weight:600;}
.perk p{font-family:'Inter';font-size:12.5px;color:#5a5d63;line-height:1.5;margin:0;}

.jobs{padding:90px 0;background:var(--paper-2);}
.job-card{
  background:var(--white);border:1px solid var(--line-dark);border-radius:3px;
  padding:26px 28px;display:flex;justify-content:space-between;align-items:center;
  margin-bottom:16px;flex-wrap:wrap;gap:16px;
}
.job-card h4{font-size:19px;margin-bottom:6px;text-transform:none;font-family:'Inter';font-weight:600;}
.job-card .tags{display:flex;gap:8px;flex-wrap:wrap;}
.job-card .tags span{font-family:'IBM Plex Mono';font-size:10px;color:#5a5d63;border:1px solid var(--line-dark);padding:4px 10px;border-radius:20px;}
.job-card .btn-primary{padding:12px 20px;font-size:13px;}

.spontaneous{
  margin-top:40px;padding:36px 32px;border:1px dashed var(--signal);border-radius:4px;
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:20px;background:var(--white);
}
.spontaneous h4{font-size:20px;margin-bottom:6px;}
.spontaneous p{font-family:'Inter';font-size:13.5px;color:#5a5d63;margin:0;max-width:420px;}

/* kontakt page */
.kontakt-page{padding:90px 0;background:var(--paper);}
.kp-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;}
.kp-info h2{font-size:clamp(30px,4vw,40px);margin-bottom:18px;}
.kp-info p.lede{font-family:'Inter';font-size:15px;color:#4a4d53;line-height:1.7;max-width:420px;margin-bottom:32px;}
.kp-list{list-style:none;padding:0;margin:0 0 32px 0;display:flex;flex-direction:column;gap:20px;}
.kp-list li{display:flex;gap:14px;align-items:flex-start;}
.kp-list .strip-icon{width:44px;height:44px;flex:none;border-color:var(--signal);}
.kp-list .strip-icon svg{width:18px;height:18px;color:var(--signal);}
.kp-list h5{font-size:15px;margin-bottom:4px;text-transform:none;font-family:'Inter';font-weight:600;}
.kp-list span{font-family:'Inter';font-size:13.5px;color:#5a5d63;}
.map-frame{width:100%;height:320px;border:1px solid var(--line-dark);border-radius:3px;overflow:hidden;}
.map-frame iframe{width:100%;height:100%;border:0;filter:grayscale(35%) contrast(1.05);}
.kp-form{background:var(--ink);color:var(--white);padding:40px;border-radius:4px;}
.kp-form h3{color:var(--white);font-size:22px;margin-bottom:22px;}

@media(max-width:900px){
  .value-grid{grid-template-columns:1fr;}
  .svc-detail .grid{grid-template-columns:1fr;gap:30px;}
  .svc-detail.reverse .grid{direction:ltr;}
  .g-grid{grid-template-columns:1fr 1fr;}
  .t-grid{grid-template-columns:1fr;}
  .perks-grid{grid-template-columns:1fr 1fr;}
  .kp-grid{grid-template-columns:1fr;}
  .t-row{grid-template-columns:1fr;gap:8px;}
}

form select{
  background:var(--ink-2);border:1px solid var(--line);color:var(--white);
  padding:14px 16px;font-family:'Inter';font-size:14px;border-radius:2px;
  width:100%;appearance:none;-webkit-appearance:none;-moz-appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23797d84' stroke-width='2.5'><path d='M6 9l6 6 6-6'/></svg>");
  background-repeat:no-repeat;background-position:right 16px center;
  cursor:pointer;
}
form select:invalid{color:#797d84;}
form select option{background:var(--ink-2);color:var(--white);}