@charset "utf-8";

/**********************************************
  SALESSTRON CSS SYSTEM - BASE
  Grundlagen: Fonts, Variablen, Typografie, Links, Buttons
***********************************************/

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/Montserrat-Regular.woff2') format('woff2');
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/Montserrat-Bold.woff2') format('woff2');
  font-display: swap;
}

:root{
  --salestron-blue: #00446D;
  --salestron-green:#99CC33;
  --ink:#555555;
  --muted:#5e6b78;
  --bg-soft:#f6f8fa;
  --white:#ffffff;
}

/**********************************************
  GENERAL
***********************************************/

body{
  font-family: "Montserrat", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: var(--ink);
  padding-top: 94px;
}

a.standard{
  color: var(--ink);
  text-decoration: none;
}
a.standard_u{
  color: var(--ink);
  text-decoration: underline;
}
a.standard:hover{
  text-decoration: underline;
}

.eyebrow{
  color: var(--salestron-blue);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: .78rem;
  margin-bottom: .5rem;
}
h2{
  font-size: 2rem;
  line-height: 1.15;
  margin-bottom: 1rem;
  color: var(--ink);
  font-weight: 700;
}
h3{
  font-size: 1.15rem;
  font-weight: 700;
  margin-bottom: .6rem;
  color: var(--ink);
}
p, li{
  font-weight: 300;
}
.fw-light { font-weight: 300 !important; }
.fw-bold  { font-weight: 700 !important; }

@media (max-width: 991.98px){
  h2{
    font-size: 1.5rem;
  }
}
.text-umbruch{
  hyphens:auto;
  overflow-wrap:break-word;
}
.border-test{
  border: 1px solid #990000;
}

/* =====================================================================
   Linklisten in Software-Karten
   ===================================================================== */

.st-link-list{
    list-style:none;
    margin:0;
    padding:0;
    display:flex;
    flex-direction:column;
    gap:14px;
}

.st-link-list li{
    margin:0;
    padding:0;
}

.st-link-list li::marker{
    display:none;
}

.st-link-green{
    display:flex;
    align-items:center;
    gap:10px;

    color:var(--salestron-blue);
    text-decoration:none;
    font-weight:500;
    line-height:1.4;

    transition:all .18s ease;
}

.st-link-green i{
    color:var(--salestron-green);
    font-size:1rem;
    line-height:1;
    flex-shrink:0;

    transition:transform .18s ease;
}

.st-link-green:hover{
    color:var(--salestron-green);
    text-decoration:none;
}

.st-link-green:hover i{
    transform:translateX(3px);
}


/* =====================================================================
   Modul-Karten
   ===================================================================== */

.st-module-link{
    color:var(--ink);
    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.st-module-link:hover{
    color:var(--ink);
    text-decoration:none;

    transform:translateY(-2px);

    border-color:rgba(153,204,51,.35);

    box-shadow:
        0 16px 34px rgba(0,68,109,.06);
}

.st-card-link{
    display:flex;
    align-items:center;
    gap:8px;

    margin-top:1rem;

    color:var(--salestron-green);
    font-weight:700;
    font-size:.95rem;
}

.st-card-link i{
    transition:transform .18s ease;
}

.st-module-link:hover .st-card-link i{
    transform:translateX(4px);
}

/**********************************************
  BUTTONS
***********************************************/

.btn-primary{
  --bs-btn-bg: var(--salestron-green);
  --bs-btn-border-color: var(--salestron-green);
  --bs-btn-color: var(--white);
  --bs-btn-hover-bg: #8ab92d;
  --bs-btn-hover-border-color: #8ab92d;
  --bs-btn-hover-color: var(--salestron-blue);
  --bs-btn-active-bg: #7aa425;
  --bs-btn-active-border-color: #7aa425;
  --bs-btn-active-color: var(--salestron-blue);
  border-radius: 10px;
  font-weight: 400;
  font-size: 0.95rem !important;
  padding: 4px 10px 4px 10px ;
}

.btn-outline-primary{
  border-radius: 10px;
  border-color: rgba(154,195,28,.95) !important;
  color: rgba(15,23,42,.88) !important;
  background: transparent !important;
}
.btn-outline-primary:hover{
  background: rgba(154,195,28,.14) !important;
  border-color: rgba(154,195,28,1) !important;
  color: rgba(15,23,42,1) !important;
}

.btn-outline-light{
  border-radius: 10px;
  padding: 4px 10px 4px 10px ;
  font-weight: 400;
}