@charset "UTF-8";
/* =====================================================================
   Gewerbe & Logistik — page styles
   Mobile design canvas 430px (literal px) · Desktop canvas 1536px
   (every value written as calc(N * var(--s)))
   ===================================================================== */

/* desktop-only line break */
.gw-br-d { display: none; }

/* shared orange rule under headlines */
.gw-rule { width: 50px; height: 4px; background: var(--o); margin-top: 18px; }
.gw-rule--hero { width: 56px; }

/* eyebrow tuning for this page */
.gw-eyebrow { letter-spacing: 1.4px; }

/* ------------------------------------------------------------------ */
/* HERO                                                                */
/* ------------------------------------------------------------------ */
.gw-hero { position: relative; background: #f2f0ed; overflow: hidden; }

.gw-hero__media { position: relative; height: 260px; }
.gw-hero__img { width: 100%; height: 260px; object-fit: cover; object-position: 65% 50%; display: block; }
.gw-hero__fade {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(242, 240, 237, 0) 55%, #f2f0ed 98%);
}

.gw-hero__body { padding: 4px 22px 44px; }

.gw-crumb {
  display: flex; align-items: center; gap: 8px;
  font-size: 12px; font-weight: 600; color: #5a5751;
}
.gw-crumb a { color: #5a5751; }
.gw-crumb a:hover { color: var(--o); }
.gw-crumb span { color: var(--ink-2); font-weight: 700; }

.gw-hero__eyebrow { margin-top: 18px; }

.gw-hero__h1 {
  margin: 12px 0 0;
  font-size: 42px;
  line-height: 1.12;
  color: var(--ink-2);
}

.gw-hero__lead { margin-top: 18px; line-height: 1.7; }

.gw-cta {
  display: flex;
  width: 100%;
  margin-top: 24px;
  gap: 14px;
  padding: 17px 0;
  font-size: 13px;
}

/* ------------------------------------------------------------------ */
/* UNSER SYSTEM                                                        */
/* ------------------------------------------------------------------ */
.gw-sys {
  background: #f6f4f1;
  border-top: 1px solid #e6e3df;
  padding: 56px 0 50px;
}
.gw-sys__head { padding: 0 22px; text-align: center; }
.gw-sys__h2 {
  margin-top: 14px;
  font-size: 29px;
  line-height: 1.22;
  color: var(--ink-2);
}

.gw-steps { gap: 14px; padding: 28px 22px 8px; }

.gw-step {
  flex: none;
  width: 210px;
  background: #fbfaf8;
  border: 1px solid #e8e5e0;
  border-radius: 8px;
  padding: 22px 18px;
  text-align: center;
}
.gw-step__no {
  font-size: 11px; font-weight: 800; letter-spacing: 1px;
  color: var(--o); text-transform: uppercase;
}
.gw-step__img {
  display: inline-block;
  width: 140px; height: 80px;
  object-fit: contain;
  margin-top: 12px;
}
.gw-step__img--narrow { width: 84px; }
.gw-step__title {
  margin-top: 14px;
  font-size: 14px; font-weight: 800; letter-spacing: .6px;
  color: var(--ink-2); text-transform: uppercase;
}
.gw-step__txt {
  margin-top: 8px;
  font-size: 13px; line-height: 1.55; font-weight: 500; color: var(--tx-3);
}

.gw-arrow { display: none; }

.gw-checks {
  display: flex; flex-direction: column; gap: 12px;
  margin-top: 26px;
  padding: 0 22px;
}
.gw-check { display: flex; align-items: center; gap: 12px; }
.gw-check svg { width: 20px; height: 20px; }
.gw-check__t {
  font-size: 13px; font-weight: 800; letter-spacing: .3px;
  color: var(--ink-2); text-transform: uppercase;
}
.gw-checks__sep { width: 1px; height: 34px; background: #dcd9d4; }

/* ------------------------------------------------------------------ */
/* EIGENE LOGISTIK                                                     */
/* ------------------------------------------------------------------ */
.gw-log { position: relative; background: #0c0c0c; overflow: hidden; }
.gw-log__media { position: relative; height: 220px; }
.gw-log__media img { height: 220px; }
.gw-log__fade {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(12, 12, 12, .1) 40%, #0c0c0c 100%);
}
.gw-log__body { padding: 8px 22px 52px; }
.gw-log__h2 {
  margin-top: 12px;
  font-size: 30px;
  line-height: 1.22;
}
.gw-log__lead { margin-top: 18px; font-size: 14.5px; font-weight: 500; color: #eceae7; }

.gw-log__list {
  list-style: none;
  margin: 18px 0 0;
  padding: 0;
  display: flex; flex-direction: column; gap: 13px;
}
.gw-log__list li { display: flex; align-items: center; gap: 14px; }
.gw-log__list svg { width: 20px; height: 20px; }
.gw-log__list span { font-size: 14.5px; font-weight: 600; color: #eceae7; }

/* ------------------------------------------------------------------ */
/* EINMALIG ODER REGELMÄSSIG                                           */
/* ------------------------------------------------------------------ */
.gw-mode { background: #f6f4f1; padding: 56px 0 54px; }
.gw-mode__head { padding: 0 22px; text-align: center; }
.gw-mode__h2 {
  margin-top: 14px;
  font-size: 29px;
  line-height: 1.2;
  color: var(--ink-2);
}
.gw-mode__grid {
  display: flex; flex-direction: column; gap: 16px;
  padding: 0 18px;
  margin-top: 28px;
}
.gw-mcard {
  background: #fbfaf8;
  border: 1px solid #e8e5e0;
  border-radius: 8px;
  padding: 26px 22px;
  text-align: center;
}
.gw-mcard__img { width: 140px; height: 80px; object-fit: contain; display: inline-block; }
.gw-mcard__img--narrow { width: 120px; }
.gw-mcard__title {
  margin-top: 14px;
  font-size: 22px; letter-spacing: .5px; color: var(--ink-2);
}
.gw-mcard__txt {
  margin-top: 10px;
  font-size: 13.5px; line-height: 1.6; font-weight: 500; color: var(--tx-2);
}
.gw-mbtn {
  display: flex;
  width: 100%;
  margin-top: 20px;
  gap: 12px;
  padding: 14px 0;
  font-size: 12px;
  border-width: 1.5px;
  border-color: var(--o);
}
.gw-mbtn--outline { background: #ffffff; color: var(--o); }
.gw-mbtn--outline:hover { background: var(--o); color: #ffffff; }

/* ------------------------------------------------------------------ */
/* ANFRAGE                                                             */
/* ------------------------------------------------------------------ */
.gw-af {
  background: #f2f0ed;
  border-top: 1px solid #e6e3df;
  padding: 56px 0 64px;
}
.gw-af__aside { padding: 0 22px; }
.gw-af__h2 {
  margin-top: 12px;
  font-size: 29px;
  line-height: 1.22;
  color: var(--ink-2);
}
.gw-af .gw-rule { margin-top: 16px; }
.gw-af__lead { margin-top: 16px; line-height: 1.65; }

.gw-af__note {
  display: flex; align-items: flex-start; gap: 16px;
  font-size: 13.5px; line-height: 1.65; font-weight: 500; color: var(--tx-3);
}

.gw-form {
  margin: 24px 18px 0;
  background: var(--sand-3);
  border: 1px solid var(--line-2);
  border-radius: 12px;
  padding: 24px 20px;
}
.gw-form .fld input,
.gw-form .fld select,
.gw-form .fld textarea { border-color: #dedbd6; }
.gw-form .fld textarea { height: 90px; }
.gw-form .dropzone {
  border-style: dashed;
  border-color: #d3d0ca;
  padding: 22px 14px;
  gap: 5px;
}
.gw-submit {
  display: flex;
  width: 100%;
  gap: 14px;
  padding: 17px 0;
  font-size: 13.5px;
  letter-spacing: 1px;
  border-radius: 6px;
}
.gw-af__note--m svg { margin-top: 2px; }

/* ================================================================== */
/* DESKTOP — 1536px design canvas                                      */
/* ================================================================== */
@media (min-width: 1024px) {

  .gw-br-d { display: inline; }

  .gw-rule { width: calc(56 * var(--s)); height: calc(4 * var(--s)); margin-top: calc(26 * var(--s)); }
  .gw-rule--hero { width: calc(66 * var(--s)); margin-top: calc(30 * var(--s)); }

  .gw-eyebrow { font-size: max(11px, calc(13 * var(--s))); }

  /* ---------------- HERO ---------------- */
  .gw-hero__media {
    position: absolute;
    right: 0; top: 0;
    width: calc(1040 * var(--s));
    height: 100%;
  }
  .gw-hero__img { height: 100%; }
  .gw-hero__fade {
    background: linear-gradient(90deg, #f2f0ed 0%, rgba(242, 240, 237, 0) 38%);
  }

  .gw-hero__body {
    position: relative;
    z-index: 1;
    width: calc(520 * var(--s));
    padding: calc(38 * var(--s)) 0 calc(96 * var(--s)) calc(75 * var(--s));
  }
  .gw-crumb { gap: calc(10 * var(--s)); font-size: max(11.5px, calc(13 * var(--s))); }

  .gw-hero__eyebrow { margin-top: calc(64 * var(--s)); }

  .gw-hero__h1 { margin-top: calc(22 * var(--s)); font-size: calc(74 * var(--s)); }

  .gw-hero__lead {
    margin-top: calc(30 * var(--s));
    max-width: calc(360 * var(--s));
    font-size: max(13px, calc(15.5 * var(--s)));
    line-height: 1.75;
  }

  .gw-cta {
    display: inline-flex;
    width: auto;
    margin-top: calc(44 * var(--s));
    gap: calc(14 * var(--s));
    padding: calc(17 * var(--s)) calc(28 * var(--s));
    font-size: max(11px, calc(13 * var(--s)));
    border-radius: calc(5 * var(--s));
  }

  /* -------------- UNSER SYSTEM -------------- */
  .gw-sys { padding: calc(96 * var(--s)) 0 calc(84 * var(--s)); }
  .gw-sys__head { padding: 0; }
  .gw-sys__h2 { margin-top: calc(20 * var(--s)); font-size: calc(46 * var(--s)); line-height: 1.2; }

  .gw-steps {
    display: flex;
    overflow: visible;
    align-items: flex-start;
    justify-content: center;
    gap: calc(56 * var(--s));
    margin-top: calc(74 * var(--s));
    padding: 0 calc(120 * var(--s));
    scroll-snap-type: none;
  }
  .gw-step {
    width: calc(190 * var(--s));
    background: none;
    border: 0;
    border-radius: 0;
    padding: 0;
  }
  .gw-step__img {
    width: calc(160 * var(--s));
    height: calc(90 * var(--s));
    margin-top: 0;
  }
  .gw-step__img--narrow { width: calc(96 * var(--s)); }
  .gw-step__title { margin-top: calc(20 * var(--s)); font-size: max(13px, calc(15 * var(--s))); }
  .gw-step__txt { margin-top: calc(10 * var(--s)); font-size: max(12.5px, calc(14 * var(--s))); line-height: 1.6; }

  .gw-arrow {
    display: block;
    flex: none;
    width: calc(52 * var(--s));
    height: calc(14 * var(--s));
    margin-top: calc(26 * var(--s));
  }

  .gw-checks {
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 0;
    margin-top: calc(70 * var(--s));
    padding: 0;
  }
  .gw-check { gap: calc(14 * var(--s)); padding: 0 calc(44 * var(--s)); }
  .gw-check svg { width: calc(24 * var(--s)); height: calc(24 * var(--s)); }
  .gw-check__t { font-size: max(12.5px, calc(14.5 * var(--s))); }
  .gw-checks__sep { height: calc(34 * var(--s)); flex: none; }

  /* -------------- EIGENE LOGISTIK -------------- */
  .gw-log__media {
    position: absolute;
    right: 0; top: 0;
    width: calc(1080 * var(--s));
    height: 100%;
  }
  .gw-log__media img { height: 100%; }
  .gw-log__fade {
    background: linear-gradient(90deg, #0c0c0c 0%, rgba(12, 12, 12, 0) 42%);
  }
  .gw-log__body {
    position: relative;
    z-index: 1;
    width: calc(480 * var(--s));
    padding: calc(88 * var(--s)) 0 calc(84 * var(--s)) calc(75 * var(--s));
  }
  .gw-log__h2 { margin-top: calc(18 * var(--s)); font-size: calc(47 * var(--s)); line-height: 1.22; }
  .gw-log__lead { margin-top: calc(26 * var(--s)); font-size: max(13px, calc(15.5 * var(--s))); }
  .gw-log__list { margin-top: calc(28 * var(--s)); gap: calc(16 * var(--s)); }
  .gw-log__list li { gap: calc(16 * var(--s)); }
  .gw-log__list svg { width: calc(22 * var(--s)); height: calc(22 * var(--s)); }
  .gw-log__list span { font-size: max(13px, calc(15 * var(--s))); }

  /* -------------- EINMALIG ODER REGELMÄSSIG -------------- */
  .gw-mode { padding: calc(92 * var(--s)) 0 calc(96 * var(--s)); }
  .gw-mode__head { padding: 0; }
  .gw-mode__h2 { margin-top: calc(20 * var(--s)); font-size: calc(46 * var(--s)); line-height: 1.2; }

  .gw-mode__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: calc(32 * var(--s));
    padding: 0 calc(185 * var(--s));
    margin-top: calc(60 * var(--s));
  }
  .gw-mcard {
    display: flex;
    align-items: flex-start;
    gap: calc(36 * var(--s));
    padding: calc(44 * var(--s)) calc(48 * var(--s));
    border-radius: calc(8 * var(--s));
    text-align: left;
  }
  .gw-mcard__img {
    flex: none;
    width: calc(150 * var(--s));
    height: calc(86 * var(--s));
    margin-top: calc(4 * var(--s));
  }
  .gw-mcard__img--narrow { width: calc(130 * var(--s)); }
  .gw-mcard__title { margin-top: 0; font-size: calc(26 * var(--s)); }
  .gw-mcard__txt {
    margin-top: calc(14 * var(--s));
    max-width: calc(280 * var(--s));
    font-size: max(12.5px, calc(15 * var(--s)));
    line-height: 1.65;
  }
  .gw-mbtn {
    display: inline-flex;
    width: auto;
    margin-top: calc(26 * var(--s));
    gap: calc(14 * var(--s));
    padding: calc(13 * var(--s)) calc(22 * var(--s));
    font-size: max(11px, calc(12.5 * var(--s)));
    border-radius: calc(5 * var(--s));
  }

  /* -------------- ANFRAGE -------------- */
  .gw-af { padding: calc(96 * var(--s)) 0 calc(110 * var(--s)); }
  .gw-af__inner {
    display: flex;
    align-items: flex-start;
    gap: calc(64 * var(--s));
    padding: 0 calc(75 * var(--s));
  }
  .gw-af__aside { width: calc(380 * var(--s)); flex: none; padding: 0; }
  .gw-af__h2 { margin-top: calc(18 * var(--s)); font-size: calc(41 * var(--s)); }
  .gw-af .gw-rule { margin-top: calc(24 * var(--s)); }
  .gw-af__lead {
    margin-top: calc(26 * var(--s));
    max-width: calc(320 * var(--s));
    font-size: max(13px, calc(15.5 * var(--s)));
    line-height: 1.7;
  }
  .gw-af__note {
    display: flex;
    margin-top: calc(56 * var(--s));
    max-width: calc(320 * var(--s));
    gap: calc(16 * var(--s));
    font-size: max(12px, calc(13.5 * var(--s)));
  }
  .gw-af__note svg { width: calc(30 * var(--s)); height: calc(34 * var(--s)); }

  .gw-form {
    flex: 1;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: calc(24 * var(--s)) calc(28 * var(--s));
    margin: 0;
    background: none;
    border: 0;
    border-radius: 0;
    padding: 0;
  }
  .gw-form .fld-row { display: contents; }
  .gw-form .fld { margin-top: 0; }
  .gw-form .fld > span { font-size: max(10.5px, calc(11.5 * var(--s))); }
  .gw-form .fld input,
  .gw-form .fld select {
    height: calc(46 * var(--s));
    margin-top: calc(9 * var(--s));
  }
  .gw-form .fld textarea {
    height: calc(132 * var(--s));
    margin-top: calc(9 * var(--s));
    padding: calc(12 * var(--s)) calc(14 * var(--s));
  }
  .gw-form__msg { grid-row: span 2; }
  .gw-form__fotos { grid-column: span 2; }
  .gw-form .dropzone {
    margin-top: calc(9 * var(--s));
    padding: calc(20 * var(--s)) calc(16 * var(--s));
    gap: calc(4 * var(--s));
    border-radius: calc(8 * var(--s));
  }
  .gw-form .dropzone__hint { font-size: max(12px, calc(13.5 * var(--s))); }
  .gw-form .dropzone__sub { font-size: max(10.5px, calc(11.5 * var(--s))); }

  .gw-submit {
    align-self: end;
    margin-top: 0;
    height: calc(56 * var(--s));
    gap: calc(16 * var(--s));
    padding: calc(16 * var(--s)) 0;
    font-size: max(12px, calc(13.5 * var(--s)));
    border-radius: calc(6 * var(--s));
  }
}
