/*
Theme Name: MR Corporate Solutions
Template: blockundstift
Version: 1.0.0
Description: Custom WordPress Theme for MR Corporate Solutions
Author: blockundstift.de
Author URI: https://blockundstift.de
Text Domain: mrcs
*/

/*
## Variables
## Basic HTML Settings
## Type & Colors
  ### Type
  ### Colors
## Header & Navigation
  ### Header
  ### Navigation
  ### Search
  ### Off Canvas Navigation
  ### Hamburger Menu
## Layout
  ### Basic Layout
  ### Flexbox
  ### Cover & Slider
  ### Independent Layout Elements
  ### Layout Elements by Page/ID
## Utility
  ### Margins
  ### Paddings
  ### Font Sizes
  ### Width Height Aspect-Ratio
## Footer
## Input & Buttons
## Cookies
## Galleries & Images
## Gutenberg Blocks
## SnipCart
## Playground & Page Animations
## Layout Grid

----------------------------------------------------------------
## Variables
--------------------------------------------------------------*/

:root {
  --text-color: #324B63;
  --primary-color: #324B63;
  --secondary-color: #A3A3A3;
  --tertiary-color: #C3B6AA;
  --grey: #F4F4F4;
  /* 
  --quaternary-color: #E6DFD3; 
  --light-grey: #f8f8f8;
  */
}

:root {
  --admin-bar-color: #324B63;
  --admin-bar-active-color: #A3A3A3;
}

:root {
  --button-color: #fff;
  --button-hover-color: var(--primary-color);
  --button-hover-background: var(--tertiary-color);
  
  --navigation-hover-color:  var(--tertiary-color);
  --navigation-active-color: var(--secondary-color);
  
  --icon-color: var(--tertiary-color);
}

:root {
  /* --font-size-p: clamp(1rem, calc(1.125 / 87.5 * 100vw), 1.125rem);
  --font-size-h1: clamp(2.25rem, calc(2.625 / 8.75 * 100vw), 2.625rem);
  --font-size-h2: clamp(1.953rem, calc(2.125 / 112.5 * 100vw), 2.125rem);
  --font-size-h3: clamp(1.563rem, calc(1.75 / 112.5 * 100vw), 1.75rem); */
  --font-size-h4: var(--font-size-p);
}

:root {
  --header-height-estimated: 145px;
}

@media (max-width: 575.98px) {
  :root {
    --font-size-h1: var(--font-size-h2);
  }
}

:root {
  --cursor: pointer;
}
a,
.button {
  /* cursor: var(--cursor); */
}

/*--------------------------------------------------------------
## Basic HTML Settings
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## Type & Colors
--------------------------------------------------------------*/
/*--------------------------
### Type
---------------------------*/


@font-face {
  font-display: swap;
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/rubik-v28-latin-300.woff2') format('woff2');
}

@font-face {
  font-display: swap;
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/rubik-v28-latin-regular.woff2') format('woff2');
}

@font-face {
  font-display: swap;
  font-family: 'Rubik';
  font-style: italic;
  font-weight: 400;
  src: url('fonts/rubik-v28-latin-italic.woff2') format('woff2');
}

@font-face {
  font-display: swap;
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 500;
  src: url('fonts/rubik-v28-latin-500.woff2') format('woff2');
}

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

h2, .h2,
a.h3,
thead, th{
  font-weight: 400;
}
h3, .h3,
.blog h2.h4 {
  font-weight: 500;
}
strong,
.strong,
.bold,
.font-weight-bold,
.font-weight-700 {
  font-weight: 500 !important;
}

body {
  font-family: 'Rubik', sans-serif;
}
@media (max-width: 575.98px) {
  h1, .h1,
  h2, .h2,
  h3, .h3,
  h4, .h4 {
    hyphens: auto;
  }
}
.serif em,
.text-serif em,
.serif strong,
.text-serif strong {
  color: var(--tertiary-color);
  font-style: normal;
}
.serif,
.text-serif p,
.headline-serif h1,
.headline-serif h2,
.headline-serif h3,
.headline-serif h4 {
  font-family: 'Faustina', serif;
}
nav li {
  text-transform: uppercase;
}
.font-size-huge .text-indent p {
  text-indent: 2em;
}
.font-size-huge.text-serif p,
.text-serif .font-size-huge p {
  line-height: 140%;
}
.font-weight-normal,
.section-title.strong,
h4, .h4 {
  font-weight: 400;
}
.uppercase,
.section-title,
h4, .h4 {
  text-transform: uppercase;
}
@media (min-width: 376px) {
  .text-vw,
  .font-size-vw,
  .headline-size-vw,
  .headline-vw,
  .child-text-vw > * {
    font-size: calc(2.5vmax * var(--font-size-huge-faktor)) !important;
  }
  .text-vw-max,
  .font-size-vw-max,
  .headline-size-vw-max,
  .headline-vw-max,
  .child-text-vw-max > *,
  .text-vw-max .inherit-max {
    font-size: calc(5.0vmax * var(--font-size-huge-faktor)) !important;
  }
}
header nav ul,
header .language-switch {
  font-size: 16px !important;
}
header nav.navigation-off-canvas ul {
  font-size: 22px !important;
}
@media (max-width: 991.98px) {
  .headline-size-huge h2,
  .headline-size-huge .h2,
  .headline-size-huge.h2,
  .font-size-huge blockquote p,
  .font-size-huge blockquote cite,
  .font-size-huge .blockquote,
  .font-size-huge .wp-block-pullquote.is-style-solid-color blockquote p,
  h2.has-x-large-font-size {
    font-size: calc(var(--font-size-h3) * var(--font-size-big-faktor)) !important;
  }
}

/*--------------------------
### Colors
---------------------------*/

.tertiary-color,
.link-inverted a {
  color: var(--tertiary-color);
}
.secondary-color,
.link-inverted a:hover {
  color: var(--secondary-color);
}
hr,
hr.wp-block-separator {
  background: var(--tertiary-color);
}
.current-lang a {
  color: var(--secondary-color);
}



/*--------------------------------------------------------------
## Header & Navigation
--------------------------------------------------------------*/
/*--------------------------
### Header
---------------------------*/

.header-logo-svg,
.footer-logo-svg,
.logo-image {
  max-width: 225px;
}
.header-minified .header-logo-svg {
  max-width: 210px;
}
@media (max-width: 575.98px) {
  .header-logo-svg,
  .footer-logo-svg,
  .logo-image {
    max-width: 200px;
  }
  .header-minified .header-logo-svg {
    max-width: 200px;
  }
  .header-button {
    display: none;
  }
}
.header-logo {
  padding: 25px 0;
}
.header-minified .header-logo {
  padding: 10px 0;
}
.main-header,
.scroll-up.header-minified {
  background: white;
  padding-bottom: 15px;
}
@media (min-width: 992px) {
  .header-minified.scroll-down {
    background: rgba(255, 255, 255, .3);
    backdrop-filter: blur(5px);
  }
  .header-minified nav li {
    font-size: 16px;
  }
}
.header-minified {
  padding-bottom: 0;
}
.header-border {
  border-bottom: 1px solid var(--tertiary-color);
}
ul.languages {
  display: flex;
}
ul.languages li {
  list-style: none;
  padding: 0 7.5px;
}


/*--------------------------
### Navigation
---------------------------*/


.main-navigation .sub-menu {
  background: rgb(255 255 255 / 85%);
  top: 42px;
}
.main-navigation .sub-menu:before {
  border-bottom: 12px solid rgb(255 255 255 / 85%);
}
@media (max-width: 991.98px), (min-width: 1200px) {
  li.tablet-only {
    display: none;
  }
}
.main-navigation-menu > li > .sub-menu {
  width: 320px;
  padding: 25px;
  background: rgb(255 255 255 / 75%);
}

/*--------------------------
### Search
---------------------------*/
/*--------------------------
### Off Canvas Navigation
---------------------------*/
/*--------------------------
### Hamburger Menu
---------------------------*/

/*--------------------------------------------------------------
## Layout
--------------------------------------------------------------*/
/*--------------------------
### Basic Layout
---------------------------*/

/*--------------------------
### Flexbox
---------------------------*/
/*--------------------------
### Cover & Slider
---------------------------*/

@media (max-width: 767.98px) {
  .cover-intro {
    bottom: 10vmin !important;
    top: unset !important;
  }
}

/*--------------------------
### Independent Layout Elements
---------------------------*/

.pb-section-title-border.bordered,
.pb-block-contact-border {
  border-color: var(--tertiary-color);
}
.child-gutter .pb-section-title .gutter-legacy > div:has( > div:not(.bordered)) {
  padding-bottom: unset;
  /* border: 1px solid red; */
}
.border,
.bordered,
.child-border,
.child-bordered {
  border: 1px solid var(--tertiary-color);
}
.contact-link {
  min-height: 150px;
}
.mr-badge {
  position: relative;
}
.mr-badge:after {
  content: '';
  display: block;
  position: absolute;
  top: 30px;
  right: 30px;
  width: 50px;
  height: 50px;
  background: url(img/mr-corporate-solutions-badge.svg) no-repeat center;
  background-size: contain;
}



.contact-link-border {
  border-bottom: 1px solid var(--tertiary-color);
}
.contact-block {
  position: absolute;
  right: 0;
  bottom: 15%;
  left: 0;
  padding: var(--global-margin);
}

@media (max-width: 767.98px) {
  .contact-image {
    min-height: 400px;
    /* border: 1px solid blue; */
  }
  .contact-image .cover-mobile {
    object-fit: cover;
    height: 100% !important;
    position: absolute;
    /* border: 1px solid red; */
  }
  .link-inverted {
    min-width: 100%;
    text-align: center;
    border: 1px solid var(--tertiary-color);
    border-width: 1px 0;
  }
  .link-inverted:last-of-type {
    /* border-bottom: 1px solid var(--tertiary-color); */
    margin-top: -1px;
  }
  .contact-link-border {
    /* border-bottom: unset; */
  }
  .contact-block {
    padding: unset;
    bottom: var(--global-padding);
  }
}
.portfolio-image {
  opacity: .7;
  mix-blend-mode: multiply;
}
.square-content .arrows.next {
  border: 1px solid #fff;
  width: 44px;
}
.bordered-blocks .pb-block-content-inner {
  border: 1px solid var(--tertiary-color);
  padding: var(--global-margin);
}
.bordered-blocks .pb-block-content-inner p:last-of-type {
  margin-bottom: 0;
}
h4.title,
.h4.title {
  border-bottom: 1px solid var(--tertiary-color);
  padding-bottom: 1vmax;
  margin-bottom: 2vmax;
}
.blogtopics:first-of-type,
.blogtopics {
  border-top: 1px solid var(--tertiary-color);
}
.blogtopics:last-of-type {
  border-bottom: 1px solid var(--tertiary-color);
}
.blog-section,
/* .blog .cover-no-image, */
.pb-section:last-of-type .blogtopics:last-of-type {
  border-bottom: unset;
}
figcaption:not(.blocks-gallery-caption):not(.wp-element-caption) {
  right: auto;
  padding: 10px 15px;
  /* background: var(--tertiary-color); */
  background: rgb(255 255 255 / 75%);
}
.pb-section.conceal .pb-block-pop-up {
  display: none;
}
.logged-in .pb-section.conceal .pb-block-pop-up {
  display: block;
}
.logged-in .pb-section.conceal {
  display: block;
  opacity: .5;
}
.logged-in .pb-section.conceal:before {
  content: 'Für Besucher*innen nicht sichtbar!';
  position: absolute;
  padding: 7.5px;
  top: 0;
  left: 0;
  color: #fff;
  background: var(--primary-color);
  font-size: .75rem;
}
.table-comparison-big tr td,
.table-comparison-big tr th,
.table-comparison-big tr td,
.table-comparison-big tr th {
  vertical-align: top;
}

.table-comparison  tr td {
  width: 50%;
  padding: var(--global-padding) 0;
  position: relative;
  padding-left: 40px;
}
.table-comparison  tr td:before {
  content: '';
  display: block;
  height: 25px;
  width: 25px;
  position: absolute;
  top: 27.5px;
  left: 0;
}
.table-comparison-big tr th {
  padding: 20px 0;
}
.table-comparison-big tr th,
.table-comparison-big tr td {
  padding-right: 10px;
}
.table-comparison  tr td:first-child:before {
  background: url('img/minus.png') no-repeat center;
  background-size: contain;
}
.table-comparison  tr td:last-child:before {
  background: url('img/plus.png') no-repeat center;
  background-size: contain;
}
.table-comparison-big tr td:first-of-type,
.table-comparison-big tr th:first-of-type {
  width: 17.5%;
}
.table-comparison-big tr td,
.table-comparison-big tr th {
  width: 27.5%;
}
.table-comparison-big tr td,
.table-comparison-big tr th {
  /* width: 27.5%;   */
}
.table-comparison-big {
  min-width: 750px;
}
.pb-section:has(.table-comparison-big) {
  overflow-x: auto;
}
.fc-bold tr td:first-child,
.table-comparison-big th {
  font-weight: 500;
}
.positiv {
  color: var(--text-color);
}
.negativ {
  color: orange;
}
.positiv {
  color: green;
}
.blog main iframe,
.archive main iframe {
  min-height: 375px;
}
@media (max-width: 767.98px) {
  .blog main iframe,
  .archive main iframe {
    min-height: 500px;
  }
}
.blog-section {
  padding-top: 1%;
  padding-bottom: 1%;
}
.image-headline-wrapper {
  position: relative;
}
@media (max-width: 991.98px) {
  .image-headline-wrapper {
    min-height: 550px;
  }
  .image-headline-wrapper img.full-width {
    object-fit: cover;
    position: absolute;
    height: 100%;
  }
}
.pb-block-text-image .button-read-more {
  margin-top: 0 !important;
}
.pb-block-text-image .read-more-content {
  margin-top: 0 !important;
  margin-bottom: var(--global-padding);
}
@media (max-width: 767.98px) {
  .contact-image.mr-badge {
    min-width: 100%;
  }
  .column.mobile-row {
    flex-direction: row;
  }
}
.contact-image .container-medium {
  width: auto;
}
button.accordion-button.h5 {
  font-weight: 400;
  line-height: 1.56;
  padding: 20px 55px 20px 0;
}
.blog-index a[target="_blank"]:after {
  content: ' \2197';
}
.blog-thumbnail .wp-post-image {
  border-radius: 15px;
}

/*--------------------------
### Layout Elements by Page/ID
---------------------------*/


.page-id-608 .sticky,
.page-id-1000 .sticky {
  z-index: 123;
}
.page-id-5 .intro-section a.button,
.page-id-979 .intro-section a.button {
  color: var(--button-hover-color);
  border: var(--button-hover-border);
  background: var(--button-hover-background);
}
.page-id-5 .intro-section a.button:hover,
.page-id-979 .intro-section a.button:hover {
  color: var(--button-color) !important;
  border: var(--button-border);
  background: var(--button-background);
}


/*--------------------------------------------------------------
## Footer
--------------------------------------------------------------*/

footer {
  /* max-width: 100%; */
  /* overflow: visible; */
}
footer > div {
  margin-top: 3vw;
}
.footer-border {
  border-top: 1px solid var(--tertiary-color);
  padding: 5vmax 0;
}
footer nav a {
  padding-top: 5px;
}
@media (max-width: 991.98px) {
  .footer-navigation {
    margin-top: var(--global-margin);
  }
  .footer-border .flex:has(.footer-navigation) {
    width: 100%;
  }
}

/*--------------------------------------------------------------
## Input & Buttons
--------------------------------------------------------------*/

input[type="submit"],
form button,
main button,
button.button,
.button,
.child-links-buttoned a,
.wp-block-button .wp-block-button__link,
.wp-block-button .wp-block-button__link.is-style-outline,
.wp-block-button.is-style-outline > .wp-block-button__link,
.wp-element-button {
  /* padding: 14.5px 30px 12px; */
  padding: 14px 30px;
  border-radius: 3px;
}

button.tablinks,
button.tablinks-vertical,
button.button-read-more {
  border-radius: unset;
}
button.button-read-more {
  /* line-height: 1.618; */
  line-height: inherit;
}


button.tablinks-vertical {
  border-right-color: var(--grey);
  /* border-width: 0 0 2px; */
}
button.tablinks.active,
button.tablinks-vertical.active,
button.filter-button.mixitup-control-active {
  /* border: 2px solid var(--secondary-color); */
  /* border-width: 0 0 2px; */
  /* color: var(--tertiary-color); */
}

/*--------------------------------------------------------------
## Cookies
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## Galleries & Images
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## Gutenberg Blocks
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## Playground
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## Layout Grid
--------------------------------------------------------------*/