@font-face {
  font-display: swap;
  /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'BarlowC';
  font-style: normal;
  font-weight: 400;
  src: url("/templates/elektro-wolber-template/fonts/BarlowCondensed-Regular.ttf") format("truetype");
  /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ }
@font-face {
  font-display: swap;
  /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  src: url("/templates/elektro-wolber-template/fonts/Inter_18pt-Regular.ttf") format("truetype");
  /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ }
@use "variables";
*,
*::before,
*::after {
  box-sizing: border-box; }

html {
  font-size: 100%; }

body {
  margin: 0;
  font-family: "Inter";
  font-weight: 400;
  font-size: 18px;
  color: #3C3C3C;
  line-height: 24px; }

img,
svg {
  max-width: 100%;
  height: auto; }

h1 {
  font-family: "BarlowC";
  font-weight: 700;
  font-size: 3.6rem;
  color: #3C3C3C;
  line-height: 4rem;
  margin-bottom: 20px; }
  h1 .smallh {
    font-family: "BarlowC";
    font-weight: 700;
    font-size: 1.2rem;
    color: #3C3C3C;
    line-height: 1.8rem; }
  h1 .color-rot {
    color: #A72140; }

.page-101 h1 {
  color: #F7F7F5; }
  .page-101 h1 .smallh {
    color: #F7F7F5; }

h2 {
  font-family: "BarlowC";
  font-weight: 700;
  font-size: 2.8rem;
  color: #3C3C3C;
  line-height: 3.2rem; }

h3 {
  font-family: "BarlowC";
  font-weight: 700;
  font-size: 18px;
  color: #3C3C3C;
  line-height: 24px; }

.padding-top5 {
  padding-top: 5% !important; }

.padding-bottom5 {
  padding-bottom: 5% !important; }

.padding-top8 {
  padding-top: 8% !important; }

.padding-bottom8 {
  padding-bottom: 8% !important; }

.padding-top40 {
  padding-top: 40px !important; }

.padding-bottom40 {
  padding-bottom: 40px !important; }

.padding-top80 {
  padding-top: 80px !important; }

.padding-bottom80 {
  padding-bottom: 80px !important; }

.background-red {
  background-color: #A72140; }
  .background-red h1, .background-red h2, .background-red h3, .background-red h4, .background-red p, .background-red div {
    color: #F7F7F5; }

.background-grau {
  background-color: #3C3C3C; }
  .background-grau h1, .background-grau h2, .background-grau h3, .background-grau h4, .background-grau p, .background-grau div {
    color: #F7F7F5; }

.background-dunkelgrau {
  background-color: #2E2C2A; }
  .background-dunkelgrau h1, .background-dunkelgrau h2, .background-dunkelgrau h3, .background-dunkelgrau h4, .background-dunkelgrau p, .background-dunkelgrau div {
    color: #F7F7F5; }

.color-white h1, .color-white h2, .color-white h3, .color-white h4, .color-white p, .color-white div {
  color: #F7F7F5; }

.andbefore p {
  color: #A72140;
  text-transform: uppercase; }
.andbefore::before {
  margin-right: 20px;
  display: inline-flex;
  content: "";
  position: relative;
  width: 30px;
  height: 30px;
  background-color: #A72140; }

.button-rot {
  background-color: #A72140;
  border-radius: 0px !important;
  padding: 18px 30px !important;
  color: #F7F7F5;
  text-transform: uppercase;
  text-decoration: none; }
  .button-rot:hover {
    transform: translateY(-3px) scale(1.02);
    background-color: #c9284c;
    /* Leuchtender "Strom"-Glow im eigenen Farbton */
    box-shadow: 0 10px 25px rgba(176, 35, 66, 0.5), 0 0 15px rgba(255, 255, 255, 0.3); }

.button-white-border {
  padding: 18px 30px !important;
  border: 1px solid #F7F7F5 !important;
  text-transform: uppercase;
  border-radius: 0px !important;
  text-decoration: none;
  color: #F7F7F5; }
  .button-white-border:hover {
    transform: translateY(-3px) scale(1.02);
    background-color: #c9284c;
    /* Leuchtender "Strom"-Glow im eigenen Farbton */
    box-shadow: 0 10px 25px rgba(176, 35, 66, 0.5), 0 0 15px rgba(255, 255, 255, 0.3); }

.button-white {
  padding: 18px 30px !important;
  background-color: #F7F7F5 !important;
  border: 1px solid #F7F7F5 !important;
  text-transform: uppercase;
  border-radius: 0px !important;
  text-decoration: none;
  color: #A72140; }
  .button-white:hover {
    transform: translateY(-3px) scale(1.02);
    background-color: #c9284c;
    /* Leuchtender "Strom"-Glow im eigenen Farbton */
    box-shadow: 0 10px 25px rgba(176, 35, 66, 0.5), 0 0 15px rgba(255, 255, 255, 0.3); }

/*-----------------buttons-------------*/
/* === 2. MINI FLASH PULSE === */
@keyframes miniFlash {
  0% {
    opacity: 0;
    transform: scaleX(0.2); }
  20% {
    opacity: 1;
    transform: scaleX(1); }
  40% {
    opacity: 0.2; }
  60% {
    opacity: 0.9; }
  100% {
    opacity: 0; } }
.button-rot {
  background-color: #A72140;
  color: #ffffff;
  border: 1px solid transparent;
  overflow: hidden; }

.button-rot::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.9) 0%, rgba(255, 113, 154, 0.4) 50%, transparent 80%);
  opacity: 0;
  pointer-events: none; }

.button-rot:hover::after {
  animation: miniFlash 0.35s cubic-bezier(0.1, 0.9, 0.2, 1) forwards; }

.button-rot:hover {
  background-color: #c91e4a;
  box-shadow: 0 6px 20px rgba(184, 29, 67, 0.45);
  transform: translateY(-1px); }

.button-white-border {
  background-color: transparent;
  color: #ffffff;
  border: 1px solid rgba(255, 255, 255, 0.85);
  overflow: hidden; }

.button-white-border::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.8) 0%, rgba(184, 29, 67, 0.3) 60%, transparent 80%);
  opacity: 0;
  pointer-events: none; }

.button-white-border:hover::after {
  animation: miniFlash 0.35s cubic-bezier(0.1, 0.9, 0.2, 1) forwards; }

.button-white-border:hover {
  border-color: #ffffff;
  background-color: rgba(255, 255, 255, 0.08);
  box-shadow: 0 6px 18px rgba(255, 255, 255, 0.18);
  transform: translateY(-1px); }

@use "variables";
header .topheader {
  background-color: #3C3C3C; }
  header .topheader .col {
    justify-content: flex-end;
    display: flex;
    padding-top: 8px;
    padding-bottom: 8px; }
    header .topheader .col p {
      margin-bottom: 0px;
      color: #F7F7F5; }
      header .topheader .col p a {
        color: #F7F7F5;
        text-decoration: none; }
header.site-header .logo-row .site-brand {
  padding: 10px 0;
  margin-left: 1rem;
  color: inherit;
  font-weight: 700;
  text-decoration: none;
  display: flex; }
  header.site-header .logo-row .site-brand img {
    width: 200px; }
header.site-header .nav-row {
  display: flex;
  align-items: center; }
  header.site-header .nav-row nav.site-nav ul.dj-megamenu li a {
    font-family: "Inter";
    font-weight: 600;
    font-size: 1.125rem;
    color: #3C3C3C;
    line-height: 24px; }

@use "variables";
.site-footer,
.site-bottom {
  padding-block: 1rem; }
