/* =========================================================
   TRAIN MOBIL / MODELLBAHN / DECALS 1.0
   Nur Contentbereich – globale Baseline bleibt unangetastet.
   ========================================================= */

.tm-decals-page{
  background:#050607;
  color:#f5f5f3;
}

.tm-decals-frame{
  width:min(1534px,100%);
  margin:0 auto;
  border-left:1px solid #17191c;
  border-right:1px solid #17191c;
  box-sizing:border-box;
}

.tm-decals-inner{
  width:min(1500px,calc(100% - 32px));
  margin:0 auto;
  box-sizing:border-box;
}

.tm-decals-hero{
  min-height:455px;
  position:relative;
  overflow:hidden;
  border-bottom:1px solid #202327;
  background:
    linear-gradient(90deg,rgba(3,4,5,.98) 0%,rgba(3,4,5,.94) 24%,rgba(3,4,5,.72) 46%,rgba(3,4,5,.26) 70%,rgba(3,4,5,.06) 100%),
    var(--tm-decals-hero),
    linear-gradient(90deg,#0d1013,#0a0c0e);
  background-size:100% 100%,cover,100% 100%;
  background-position:center,center,center;
  background-repeat:no-repeat;
}

.tm-decals-hero__inner{
  min-height:455px;
  padding:58px 34px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
}

.tm-decals-kicker,
.tm-decals-intro small,
.tm-decals-reference-head small,
.tm-decals-shop small,
.tm-decals-next small{
  margin:0 0 15px;
  color:#ffd000;
  font-size:11px;
  font-weight:900;
  letter-spacing:.15em;
}

.tm-decals-hero h1{
  max-width:900px;
  margin:0;
  font-size:clamp(42px,4vw,70px);
  line-height:.95;
  letter-spacing:-.035em;
}

.tm-decals-hero h1 span,
.tm-decals-intro h2 span,
.tm-decals-reference-head h2 span,
.tm-decals-shop h2 span{
  color:#ffd000;
}

.tm-decals-lead{
  max-width:690px;
  margin:27px 0 0;
  color:#e2e4e5;
  font-size:17px;
  line-height:1.65;
}

.tm-decals-hero__button{
  margin-top:28px;
  padding:14px 18px;
  background:#ffd000;
  color:#050607;
  font-size:11px;
  font-weight:900;
  text-decoration:none;
}

.tm-decals-content{
  background:linear-gradient(90deg,#0d1013,#0a0c0e);
}

.tm-decals-content > .tm-decals-inner{
  padding:54px 34px 58px;
}

.tm-decals-intro,
.tm-decals-reference-head,
.tm-decals-shop{
  display:grid;
  grid-template-columns:minmax(300px,.85fr) minmax(420px,1.15fr);
  gap:58px;
  align-items:end;
}

.tm-decals-intro{
  padding-bottom:38px;
  border-bottom:1px solid #262b2f;
}

.tm-decals-intro small,
.tm-decals-reference-head small,
.tm-decals-shop small,
.tm-decals-next small{
  display:block;
  color:#868e94;
  margin-bottom:10px;
}

.tm-decals-intro h2,
.tm-decals-reference-head h2,
.tm-decals-shop h2{
  margin:0;
  font-size:clamp(28px,2.6vw,42px);
  line-height:1;
  letter-spacing:-.025em;
}

.tm-decals-intro__copy,
.tm-decals-reference-head > p,
.tm-decals-shop > div:last-child{
  color:#c7ccd0;
  font-size:15px;
  line-height:1.68;
}

.tm-decals-intro__copy p{
  margin:0 0 12px;
}

.tm-decals-process{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin:34px 0 54px;
}

.tm-decals-process article{
  min-height:225px;
  padding:25px 24px;
  border:1px solid #2b3034;
  background:#0b0e10;
}

.tm-decals-process article > span{
  display:block;
  margin-bottom:34px;
  color:#ffd000;
  font-size:28px;
  font-weight:900;
}

.tm-decals-process h2{
  margin:0 0 12px;
  font-size:18px;
  line-height:1.05;
}

.tm-decals-process p{
  margin:0;
  color:#aeb5ba;
  font-size:13px;
  line-height:1.65;
}

.tm-decals-reference-head{
  padding:42px 0 30px;
  border-top:1px solid #262b2f;
}

.tm-decals-reference-head > p{
  margin:0;
}

.tm-decals-references{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}

.tm-decals-reference{
  border:1px solid #2b3034;
  background:#0a0d0f;
  overflow:hidden;
}

.tm-decals-reference--lead{
  grid-column:1/-1;
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(380px,.75fr);
  min-height:390px;
}

.tm-decals-reference__image{
  min-height:270px;
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
}

.tm-decals-reference--lead .tm-decals-reference__image{
  min-height:390px;
}

.tm-decals-reference__body{
  padding:28px 30px 32px;
}

.tm-decals-reference--lead .tm-decals-reference__body{
  padding:40px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.tm-decals-reference__body small{
  color:#ffd000;
  font-size:10px;
  font-weight:900;
  letter-spacing:.09em;
}

.tm-decals-reference__body h2{
  margin:12px 0 12px;
  font-size:25px;
  line-height:1.08;
}

.tm-decals-reference--lead h2{
  font-size:34px;
}

.tm-decals-reference__body p{
  margin:0;
  color:#b8bec2;
  font-size:13px;
  line-height:1.65;
}

.tm-decals-reference__body a,
.tm-decals-shop a,
.tm-decals-next a{
  display:inline-block;
  margin-top:22px;
  color:#ffd000;
  font-size:11px;
  font-weight:900;
  text-decoration:none;
}

.tm-decals-shop{
  margin-top:46px;
  padding:38px 0;
  border-top:1px solid #2a2f33;
  border-bottom:1px solid #2a2f33;
}

.tm-decals-shop p{
  margin:0;
}

.tm-decals-next{
  margin-top:32px;
  padding-top:24px;
  display:flex;
  justify-content:space-between;
  gap:30px;
  align-items:end;
}

.tm-decals-next h2{
  margin:0;
  font-size:24px;
}

.tm-decals-next__links{
  display:flex;
  flex-wrap:wrap;
  gap:20px;
}

.tm-decals-next__links a{
  margin-top:0;
}

@media(max-width:1000px){
  .tm-decals-intro,
  .tm-decals-reference-head,
  .tm-decals-shop{
    grid-template-columns:1fr;
    gap:22px;
  }

  .tm-decals-process{
    grid-template-columns:repeat(2,1fr);
  }

  .tm-decals-reference--lead{
    grid-template-columns:1fr;
  }
}

@media(max-width:760px){
  .tm-decals-inner{
    width:100%;
  }

  .tm-decals-hero__inner,
  .tm-decals-content > .tm-decals-inner{
    padding-left:22px;
    padding-right:22px;
  }

  .tm-decals-references{
    grid-template-columns:1fr;
  }

  .tm-decals-reference--lead{
    grid-column:auto;
  }

  .tm-decals-next{
    align-items:flex-start;
    flex-direction:column;
  }
}

@media(max-width:520px){
  .tm-decals-process{
    grid-template-columns:1fr;
  }
}
