@charset "UTF-8";
/*
Theme Name: Milk 4.0
Text Domain: www.milk.se
Version: 1.4a
Description: Unique theme for milk
Tags: ACF, Modular, Block Editor, 
Author: Milk Reklambyrå
*/
@font-face {
  font-family: "Sangbleuempire";
  font-weight: normal;
  src: url(assets/fonts/SangBleuEmpire-Regular-WebXL.eot);
  src: url(assets/fonts/SangBleuEmpire-Regular-WebXL.woff2) format("woff2"), url(assets/fonts/SangBleuEmpire-Regular-WebXL.woff) format("woff"), url(assets/fonts/SangBleuEmpire-Regular.otf) format("opentype"), url(assets/fonts/SangBleuEmpire-Regular-WebXL.svg) format("svg"); /* Legacy iOS */
}
@font-face {
  font-family: "Scto";
  font-weight: 400;
  src: url(assets/fonts/SctoGroteskRegular.eot);
  src: url(assets/fonts/SctoGroteskRegular.woff2) format("woff2"), url(assets/fonts/SctoGroteskRegular.woff) format("woff"), url(assets/fonts/SctoGroteskRegular.otf) format("opentype"); /* Super Modern Browsers */
}
@font-face {
  font-family: "Scto";
  font-weight: 500;
  src: url(assets/fonts/SctoGroteskMedium.eot);
  src: url(assets/fonts/SctoGroteskMedium.woff2) format("woff2"), url(assets/fonts/SctoGroteskMedium.woff) format("woff"), url(assets/fonts/SctoGroteskMedium.otf) format("opentype"); /* Super Modern Browsers */
}
* {
  box-sizing: border-box;
}

#tinymce {
  cursor: default !important;
}

/* Margin Reset */
html, body, main, section, img, figure, span, header, footer, ul, li, a, h1, h2, h3, h4, p {
  margin: 0;
  padding: 0;
}

:root {
  /* Font */
  --normal-size: clamp(18px, 1.2vw ,27px);
  --medium-size: clamp(22px, 1.4vw, 35px);
  /* Colors */
  --white: #ffffff;
  --black: #000000;
  --yellow: #ffe73b;
}

::-moz-selection {
  background: var(--yellow);
  color: var(--white);
}

::selection {
  background: var(--yellow);
  color: var(--white);
}

/* Core typgraphy */
h1, .h1 {
  font-family: "Sangbleuempire", Fallback, serif;
  font-size: clamp(42px, 5vw, 128px);
  max-width: 11em;
  line-height: 1.2em;
  letter-spacing: -1px;
  margin: 0.1em 0 0.7em;
  font-weight: 400;
}
h1 *, .h1 * {
  font-size: inherit !important;
}

h2, .h2 {
  font-family: "Scto", Fallback, sans-serif;
  font-size: clamp(32px, 2.5vw, 64px);
  line-height: 1.3em;
  max-width: 18em;
  font-weight: 400;
  margin: 0.2em 0 0.3em;
}
h2 *, .h2 * {
  font-size: inherit;
}

h3, .h3 {
  font-family: "Scto", Fallback, sans-serif;
  font-size: clamp(22px, 1.4vw, 35px);
  line-height: 1.3em;
  max-width: 24em;
  margin: 0.5em 0 0.6em;
  font-weight: 400;
  color: inherit;
}
h3 *, .h3 * {
  font-size: inherit;
}

h4, .h4 {
  font-family: "Scto", Fallback, sans-serif;
  font-size: clamp(16px, 1.1vw, 24px);
  line-height: 1.4em;
  max-width: 32em;
  font-weight: 500;
}
h4 *, .h4 * {
  font-size: inherit;
}

p {
  font-family: "Scto", Fallback, sans-serif;
  font-size: clamp(18px, 1.2vw, 27px);
  line-height: 1.4em;
  max-width: 32em;
  font-weight: 400;
  margin: 0.5em 0 1em;
}
p * {
  font-size: inherit;
}
p a {
  font-size: inherit;
  text-decoration: underline;
}

.serif {
  font-family: "Sangbleuempire", serif;
}

.sans-serif {
  font-family: "Scto", sans-serif;
}

.span {
  font-size: var(--normal-size);
}

.inline {
  display: inline-block;
}

/* Core elements */
html {
  font-family: "Scto", Fallback, sans-serif;
  font-weight: 400;
}

body {
  font-family: "Scto", Fallback, sans-serif;
  font-size: var(--normal-size);
  font-weight: 400;
  color: var(--black);
}

header {
  color: var(--black);
}
header .custom-logo {
  height: 44px;
  width: auto;
}
header .container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-self: flex-start;
  width: 100%;
  padding: 2rem 3rem 0.5rem;
  margin: 0 auto;
}
header a {
  color: inherit;
  text-decoration: none;
}
header a:hover {
  text-decoration: underline;
}
header #navbar {
  position: fixed;
  display: flex;
  justify-content: space-between;
  width: 100%;
  top: 0;
  z-index: 10;
  transition: 0.4s ease;
}
header #navbar li {
  padding: 1rem;
  list-style-type: none;
  display: inline-block;
}
header #navbar li:last-child {
  padding-right: 0;
}

footer {
  background-color: var(--black);
  color: var(--white);
}
footer .container {
  padding-top: 3rem;
  padding-bottom: 2rem;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
footer .container .col {
  width: 25%;
}
footer .container .col a {
  text-decoration: none;
  font-size: var(--medium-size);
  line-height: 1.3em;
}
footer .container .col p {
  font-size: var(--medium-size);
  line-height: 1.3em;
}
footer .container .col p:first-of-type {
  font-size: var(--normal-size);
}

main {
  position: relative;
  max-width: 100vw !important;
  min-height: 90vh;
  padding-top: 10rem;
  overflow: hidden;
}
main section {
  position: relative;
  width: 100%;
  padding: 5rem 0;
}
main section:last-of-type {
  padding-bottom: 10rem;
}

/* Core Parts */
a {
  text-decoration: none;
  font-size: var(--normal-size);
  color: inherit;
}
.case-title {
  font-size: clamp(38px, 3vw, 80px);
  margin: 0.1em 0 0.2em;
  font-weight: 400;
}

.overflow {
  overflow: hidden;
}

.font--serif {
  font-family: "Sangbleuempire", serif;
}

.font--sans-serif {
  font-family: "Scto", sans-serif;
}

/* Color */
/* Theme Colors */
.theme_light {
  color: var(--black);
  background-color: var(--white);
}

.theme_dark {
  color: var(--white);
  background-color: var(--black);
}
.theme_dark .custom-logo {
  filter: invert(1);
}

/* Classes */
/* Navigation */
/* Header */
.nav-down {
  top: -8rem !important;
}

.mobile-menu {
  position: fixed;
  left: 0;
  top: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  width: 100vw;
  height: 100svh;
  padding: 0;
  background-color: var(--yellow);
  color: black;
  z-index: 15;
}
.mobile-menu .main-mobile-nav {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 3rem 1.2rem;
}
.mobile-menu .main-mobile-nav a {
  display: block;
  font-size: 46px;
}
.mobile-menu .main-mobile-nav li {
  padding: 0.2em 0;
  color: var(--black);
  list-style-type: none;
}
.mobile-menu .extra-mobile-nav {
  display: flex;
  flex-direction: column;
  margin-top: 1rem;
}
.mobile-menu .extra-mobile-nav a {
  display: block;
  font-size: var(--normal-size);
  padding: 0.1em 0;
}

#open {
  display: none;
}

/* Cookie Modal */
.modal__cookies {
  position: fixed;
  left: 2rem;
  bottom: 2rem;
  right: 2rem;
  display: flex;
  z-index: 3;
  opacity: 0;
}
.modal__cookies.show {
  opacity: 1;
  pointer-events: all;
}
.modal__cookies .wrapper {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  max-width: 100%;
  padding: 1em 1.25em;
  border-radius: 0.5rem;
  background-color: var(--yellow);
  color: black;
  font-weight: 600;
}
.modal__cookies .wrapper .textWrapper {
  display: inline-block;
  margin-bottom: 0.5em;
  line-height: 1.4em;
}
.modal__cookies .wrapper .textWrapper a {
  display: inline-block;
  text-decoration: underline;
}
.modal__cookies .wrapper .btnWrapper button {
  background-color: unset;
  border: unset;
  font-size: inherit;
  font-family: inherit;
  margin-right: 0.5rem;
  padding: unset;
}
.modal__cookies .wrapper .btnWrapper button:hover {
  text-decoration: underline;
}
.modal__cookies .wrapper .btnWrapper #acceptCookies {
  cursor: pointer;
}
.modal__cookies .wrapper .btnWrapper #declineCookies {
  cursor: pointer;
}

/* Section & Containers */
.container {
  padding: 0 10vw;
  margin: 0 auto;
}

.hero {
  padding: 10em 0 0;
}

/* Position */
/* F - A - R - S */
.fixed {
  position: fixed;
}

.absolute {
  position: absolute;
}

.relative {
  position: relative;
}

/* Margins */
/* Top */
.mt-0 {
  margin-top: 0;
}

.mt-1 {
  margin-top: 1rem;
}

.mt-2 {
  margin-top: 2rem;
}

.mt-4 {
  margin-top: 4rem;
}

/* Right */
.mr-2 {
  margin-right: 2rem;
}

.mr-4 {
  margin-right: 4rem;
}

/* Bottom */
.mb-1 {
  margin-bottom: 1rem;
}

.mb-2 {
  margin-bottom: 2rem;
}

.mb-4 {
  margin-bottom: 4rem;
}

/* Left */
.ml-2 {
  margin-left: 2rem;
}

.ml-4 {
  margin-left: 4rem;
}

/* Paddings */
/* Top */
.pt-0 {
  padding-top: 0;
}

.pt-1 {
  padding-top: 1rem;
}

.pt-2 {
  padding-top: 2rem;
}

.pt-4 {
  padding-top: 4rem;
}

/* Right */
.pr-2 {
  padding-right: 2rem;
}

/* Bottom */
.pb-1 {
  padding-bottom: 1rem;
}

.pb-2 {
  padding-bottom: 2rem;
}

.pb-4 {
  padding-bottom: 4rem;
}

/* Left */
.pl-2 {
  padding-left: 2rem;
}

.pl-4 {
  padding-left: 4rem;
}

/* Media */
figure {
  overflow: hidden;
  width: 100%;
}
figure img, figure video, figure picture {
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  height: 100%;
}
figure video {
  transform: scale(1.01);
}

picture {
  display: flex;
}
picture img {
  position: static;
  width: 100%;
  height: auto;
  -o-object-fit: cover;
     object-fit: cover;
}

video {
  display: flex;
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}

/* Preloader */
.preloader {
  position: fixed;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  left: 0;
  top: 0;
  z-index: 9999;
  background: white;
}

/* Stagger objects ?? Fixa för JS disabled */
.stagger-obj {
  opacity: 0;
  transform: translateY(48px);
}

/* Cursor */
.theBall, .theBall-outer {
  width: 20px;
  height: 20px;
}

.theBall-outer {
  position: fixed;
  top: -20px;
  left: -20px;
  z-index: 5000;
  pointer-events: none !important;
  transition: transform 100ms ease-out;
}

.theBall {
  position: absolute;
  background-color: var(--yellow);
  border-radius: 50%;
  transition: transform 200ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
  transform-origin: center center;
}

.zooming.theBall {
  transform: scale(2.2);
}

/* html.lenis {
    height: auto;
}

.lenis.lenis-smooth {
    scroll-behavior: auto;
}

.lenis.lenis-smooth [data-lenis-prevent] {
    overscroll-behavior: contain;
}

.lenis.lenis-stopped {
    overflow: hidden;
}

.lenis.lenis-scrolling iframe {
    pointer-events: none;
}
 */
/*     .transition-translate {
        transition-property: opacity, transform;
        transition-duration: 600ms;
        transition-timing-function: cubic-bezier(.2,.6,.5,1);
        transform: translateY(0);
        opacity: 1;
    }

    html.is-changing {
        overflow: hidden;
        pointer-events: none;
    }

    html.is-animating .transition-translate {
        opacity: 0;
        transform: translateY(10vh);
    }

    html.is-leaving .transition-translate {
        transform: translateY(-10vh);
        transition-timing-function: cubic-bezier(0.5, 0.00, 0.8, 0.4);
    }



    html.is-animating.to-left .transition-translate {
        opacity: 0;
        transform: translateY(-10vh);
    }

    html.is-leaving.to-left .transition-translate {
        transform: translateY(10vh);
        transition-timing-function: cubic-bezier(0.5, 0.00, 0.8, 0.4);
    } */
/* Home */
#temp__root section:first-of-type {
  padding-bottom: 0;
}

.roller h1 {
  margin-bottom: 0;
}

#hero-reel {
  transform-origin: center;
}

.news {
  display: flex;
  flex-direction: column;
}
.news h2 {
  max-width: none;
  margin: 0;
}
.news .row {
  width: -moz-fit-content;
  width: fit-content;
}
.news .row .col {
  display: block;
  padding: 1em 1em 1em 0;
}
.news .row .col:hover .title {
  text-decoration: underline;
}
.news .row .col .title {
  font-size: var(--medium-size);
}
.news .row .col .date {
  font-size: var(--normal-size) !important;
  margin-top: 0.3em;
  font-weight: 400;
  text-transform: capitalize;
}

/* New Hover News list */
.image-hover-list {
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  padding-bottom: 8rem;
}
.image-hover-list .collection__news {
  display: flex;
  flex-direction: column;
  align-content: flex-start;
  width: 66%;
}
.image-hover-list .collection__news .row {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-end;
  gap: 2rem;
  padding: 1rem 0;
  transition: opacity 200ms ease;
}
.image-hover-list .collection__news .row .title {
  font-size: 48px;
  line-height: 1em;
}
.image-hover-list .collection__news .row .date {
  text-transform: capitalize;
}
.image-hover-list .collection__news .row:hover {
  opacity: 1 !important;
}
.image-hover-list .collection__news:hover .row {
  opacity: 0.4;
}
.image-hover-list .image-hover-content {
  position: absolute;
  top: -150px;
  left: 300px;
  width: 300px;
  height: 300px;
  opacity: 1;
  transition: transform 200ms ease-out, opacity 200ms ease;
}
.image-hover-list .image-hover-content.hidden {
  opacity: 0;
}
.image-hover-list .image-hover-content picture {
  pointer-events: none;
  position: absolute;
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: left;
     object-position: left;
  vertical-align: middle;
}
.image-hover-list .image-hover-content picture img {
  max-width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.image-hover-list .image-hover-content picture.hidden {
  display: none;
}

/* Case */
/* Grid */
.special {
  display: flex;
  margin-bottom: 2rem;
}

.case-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: auto;
  grid-gap: 4rem 2rem;
  align-items: start;
  width: 100%;
}
.case-grid .c-tn {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  grid-column: span 1;
  grid-row: span 1;
  margin: 0;
  height: auto;
  align-self: stretch;
}
.case-grid .c-tn figure {
  position: relative;
  height: 100%;
  padding-top: 66.66%;
}
.case-grid .c-tn figure picture {
  position: absolute;
  top: 0;
}
.case-grid .c-tn figure video {
  position: absolute;
  top: 0;
}
.case-grid .c-tn:nth-child(1) {
  grid-column: 1/3;
  grid-row: span 2;
}
.case-grid .c-tn:nth-child(6) {
  grid-column: 2/4;
  grid-row: 3/5;
}
.case-grid .case__link {
  display: flex;
  grid-column: 2/4;
  margin-top: 2rem;
}
.case-grid .case__link .h2 {
  text-decoration: underline;
}
.case-grid .case__link .case__count {
  font-size: var(--normal-size);
}

#single__case {
  margin-top: -4rem;
}
#single__case > section {
  padding: 1rem 0;
}
#single__case > section:last-of-type {
  padding-top: 3rem;
  padding-bottom: 3rem;
}

/* Case flex content */
.case-description-wrapper {
  display: flex;
  flex-direction: row;
  margin-top: 3rem;
  margin-bottom: 4rem;
}
.case-description-wrapper .case-description-title {
  width: 50%;
  padding-right: 4rem;
}
.case-description-wrapper .case-description-content {
  width: 50%;
  display: flex;
  flex-direction: column;
}
.case-description-wrapper .case-description-content .more {
  margin: 1.5em 0 1em;
  font-weight: 500;
}
.case-description-wrapper .case-description-content .complete {
  overflow: hidden;
  height: 0;
  margin: 0;
}
.case-description-wrapper .case-description-content .expand {
  height: auto;
  margin: 0.5em 0 1em;
}
.case-description-wrapper .case-description-content .case-description-tags {
  margin-top: 2em;
}
.case-description-wrapper .case-description-content .case-description-tags span {
  line-height: 1.4em;
}

.case-image-row {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.case-image-row .row-left {
  width: 50%;
  margin-right: 1rem;
}
.case-image-row .row-right {
  width: 50%;
  margin-left: 1rem;
}
.case-image-row .alt-content-size {
  padding: 0 5%;
  width: 50%;
}

.video-embed {
  position: relative;
  padding: 56.25% 0 0 0;
}
.video-embed iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

.case-text {
  margin: 4em 0;
}

.case-results {
  margin-top: 4rem;
}
.case-results .result--wrapper {
  display: flex;
}
.case-results .result--wrapper .result--container {
  display: flex;
  margin-top: 4rem;
  width: 33.333%;
}
.case-results .result--wrapper .result--container:nth-child(2n) {
  justify-content: center;
}
.case-results .result--wrapper .result--container:nth-child(3n) {
  justify-content: flex-end;
}

.case-end {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

/* Temp Home */
#temp__home .cookies {
  position: fixed;
  left: 2rem;
  bottom: 2rem;
  display: flex;
  align-items: center;
  padding-block: 0.66em;
  padding-inline: 1em 0.75em;
  background-color: var(--yellow);
  z-index: 2;
}
#temp__home .cookies a {
  font-size: inherit;
  text-decoration: underline;
}
#temp__home .cookies #close {
  width: 1.5em;
  height: 1.5em;
  margin-left: 1em;
}
#temp__home section {
  margin: auto;
  padding: 1rem 10vw;
}
#temp__home .homeCase .collection__case {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: auto;
  gap: 2rem;
}
#temp__home .homeCase .collection__case .card__case {
  position: relative;
  grid-column: span 1;
  grid-row: span 1;
  width: 100%;
  height: 100%;
  aspect-ratio: 3/2;
}
#temp__home .homeCase .collection__case .card__case picture, #temp__home .homeCase .collection__case .card__case video {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transition: filter 0.4s ease;
}
#temp__home .homeCase .collection__case .card__case .content {
  position: absolute;
  top: 2rem;
  right: 2rem;
  bottom: 2rem;
  left: 2rem;
  transition: opacity 0.4s ease;
  opacity: 0;
}
#temp__home .homeCase .collection__case .card__case .content * {
  color: white;
  margin: 0;
}
#temp__home .homeCase .collection__case .card__case:hover .content {
  opacity: 1;
}
#temp__home .homeCase .collection__case .card__case:hover picture, #temp__home .homeCase .collection__case .card__case:hover video {
  filter: brightness(0.4);
}
#temp__home .homeCase .collection__case .card__case:nth-child(10n+1) {
  grid-column: span 2;
  grid-row: span 2;
}
#temp__home .homeCase .collection__case .card__cta {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  grid-column: 3/4;
  grid-row: 3/5;
  padding: 2rem;
  background-color: var(--black);
  color: white;
}
#temp__home .homeCase .collection__case .card__cta * {
  margin: 0;
}
#temp__home .homeCase .collection__case.ctaActive .card__case:nth-child(10n+1) {
  grid-column: span 1;
  grid-row: span 1;
}
#temp__home .homeCase .collection__case.ctaActive .card__case:nth-child(8n+1) {
  grid-column: span 2;
  grid-row: span 2;
}
#temp__home .homeNews {
  padding-block: 4rem;
}
#temp__home .homeNews .collection__news .row {
  display: block;
  margin-bottom: 2rem;
}
#temp__home .homeNews .collection__news .row .title {
  margin-bottom: 0.1em;
}
/* Temp Archive Case */
#temp__case section {
  padding: 1rem 10vw;
}
#temp__case .caseHero h1 {
  max-width: unset;
}
#temp__case .caseHero h1 span {
  position: relative;
}
#temp__case .caseHero h1 span::after {
  content: "";
  position: absolute;
  bottom: 10%;
  left: 0;
  width: 100%;
  height: 8px;
  background-color: var(--black);
}
#temp__case .collection__case {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: auto;
  grid-gap: 2rem;
  align-items: start;
  padding-bottom: 4rem;
}
#temp__case .collection__case .card__case {
  position: relative;
  overflow: hidden;
  grid-column: span 1;
  aspect-ratio: 3/2;
}
#temp__case .collection__case .card__case picture, #temp__case .collection__case .card__case video {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transition: filter 0.4s ease;
}
#temp__case .collection__case .card__case .content {
  position: absolute;
  top: 2rem;
  right: 2rem;
  bottom: 2rem;
  left: 2rem;
  transition: opacity 0.4s ease;
  opacity: 0;
}
#temp__case .collection__case .card__case .content * {
  color: white;
  margin: 0;
}
#temp__case .collection__case .card__case:hover .content {
  opacity: 1;
}
#temp__case .collection__case .card__case:hover picture, #temp__case .collection__case .card__case:hover video {
  filter: brightness(0.4);
}

/* Case archive */
.archive-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: auto;
  grid-gap: 4rem 2rem;
  align-items: start;
}

/* Case Thumbnails */
.c-tn {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  position: relative;
  height: 100%;
  width: 100%;
}
.c-tn figure picture, .c-tn figure video {
  transition: transform 0.6s cubic-bezier(0.4, 1, 0.7, 1);
}
.c-tn:hover .case__title {
  text-decoration: underline;
}
.c-tn:hover picture, .c-tn:hover video {
  transform: scale(1.05);
}

.c-tn-basic {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  position: relative;
  width: 100%;
  aspect-ratio: 3/2;
  grid-column: span 2;
}
.c-tn-basic figure {
  height: 100%;
}
.c-tn-basic figure picture, .c-tn-basic figure video {
  transition: transform 0.6s cubic-bezier(0.4, 1, 0.7, 1);
}
.c-tn-basic:hover .case__title {
  text-decoration: underline;
}
.c-tn-basic:hover picture, .c-tn-basic:hover video {
  transform: scale(1.05);
}

.c-tn-text-wrapper {
  color: var(--black);
}
.c-tn-text-wrapper .case__title {
  font-size: var(--normal-size);
  margin: unset;
  font-weight: 500;
}
.c-tn-text-wrapper .case__subtitle {
  font-size: var(--normal-size);
  font-weight: 400;
}

/* About */
.capabilites .title-wrapper {
  margin-bottom: 4rem;
}
.capabilites .row {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  flex-wrap: wrap;
}
.capabilites .row .col {
  width: 25%;
  margin-bottom: 2rem;
}

.logo-loaf {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-top: 4rem;
}
.logo-loaf figure {
  width: 12%;
  padding: 0.5em;
}
.logo-loaf figure img {
  height: auto;
}

.exp {
  text-align: start;
  display: flex;
  flex-direction: column;
}
.exp span {
  font-size: var(--normal-size);
  line-height: 1.8em;
}
.exp a {
  font-size: inherit;
  text-decoration: underline;
}
.exp a:hover {
  color: black;
  background-color: var(--yellow);
}

.about-filter video {
  filter: brightness(0.95) contrast(1) grayscale(1);
}

/* Contact */
.contact-hero .content-wrapper {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.contact-hero .content-wrapper .text-wrapper {
  width: 50%;
}
.contact-hero .content-wrapper .text-wrapper p {
  margin-top: 0;
  margin-bottom: 2em;
  max-width: 30em;
  padding-right: 2em;
}
.contact-hero .content-wrapper .contact-wrapper {
  display: flex;
  flex-direction: column;
}
.contact-hero .content-wrapper .contact-wrapper .col {
  width: 100%;
  margin-bottom: 2rem;
}
.contact-hero .content-wrapper .contact-wrapper .col span:nth-child(1) {
  font-weight: 500;
}

.person-container {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.person-container .col {
  width: 25%;
  margin-bottom: 2rem;
}
.person-container .col .col {
  display: flex;
  flex-direction: column;
  width: 90%;
}
.person-container .col span:nth-child(1) {
  font-weight: 500;
}

.info-wrapper {
  max-width: 32rem;
}

.newsletter-modal {
  position: fixed;
  background-color: var(--black);
  color: var(--white);
  padding: 3em 2em 2em;
  top: 50%;
  left: 50%;
  width: 26em;
  max-width: calc(100vw - 1.6rem);
  transform: translate(-50%, -50%);
  transition: opacity 0.15s ease;
  opacity: 0;
  pointer-events: none;
}
.newsletter-modal h2 {
  max-width: 75%;
}
.newsletter-modal form {
  display: block;
}
.newsletter-modal form label {
  display: none;
}
.newsletter-modal form input:focus, .newsletter-modal form textarea:focus, .newsletter-modal form select:focus {
  outline: none;
}
.newsletter-modal form input {
  border-radius: 0;
}
.newsletter-modal form input[type=text i] {
  font-size: var(--normal-size);
  padding: 0.2em 0em;
  background-color: var(--black);
  border: none;
  border-bottom: 1px solid white;
  margin: 0.8em 0;
  width: 100%;
  color: var(--white);
}
.newsletter-modal form input[type=submit i] {
  font-size: var(--normal-size);
  border: none;
  padding: 0;
  background-color: var(--black);
  color: var(--white);
  margin-top: 1em;
}
.newsletter-modal form input[type=submit i] :hover {
  text-decoration: underline;
}
.newsletter-modal form textarea,
.newsletter-modal form input[type=text],
.newsletter-modal form input[type=button],
.newsletter-modal form input[type=submit] {
  -webkit-appearance: none;
  border-radius: 0;
}
.newsletter-modal span {
  display: inline-block;
  margin-top: 2rem;
}
.newsletter-modal span a {
  display: inline-block;
  text-decoration: underline;
}

.modal-active {
  opacity: 1;
  pointer-events: all;
}

#newsletter-modal-open {
  font-weight: 500;
  cursor: pointer;
}

#close-btn {
  position: absolute;
  top: 1em;
  right: 2em;
  width: 32px;
  height: 32px;
  transform-origin: center;
  transition: transform 0.2s ease-out;
}
#close-btn:hover {
  transform: rotateZ(90deg);
}

.mdiv {
  height: 32px;
  width: 2px;
  margin-left: 16px;
  background-color: var(--white);
  transform: rotate(45deg);
  Z-index: 1;
}

.md {
  height: 32px;
  width: 2px;
  background-color: var(--white);
  transform: rotate(90deg);
  Z-index: 2;
}

/* News */
.news-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 2rem 0;
}
.news-wrapper figure {
  position: relative;
  width: 50%;
  margin-right: 2vw;
  padding-top: 33%;
}
.news-wrapper figure picture, .news-wrapper figure video {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}
.news-wrapper .iframe-wrapper {
  padding-top: 27.888%;
}
.news-wrapper .iframe-wrapper iframe {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
}
.news-wrapper .news-content {
  width: 50%;
  margin: 0 0 0 2vw;
  position: relative;
}
.news-wrapper .news-content .date {
  font-size: var(--normal-size) !important;
  line-height: 1em;
  margin: 0.5em 0 1em 0;
  font-weight: 400;
  text-transform: capitalize;
}
.news-wrapper .anchor {
  display: block;
  position: relative;
  visibility: hidden;
  align-self: flex-start;
  top: -10rem;
}

/* Prospekt */
#single__prospekt .col {
  display: flex;
  flex-direction: column;
}
#single__prospekt .col .col {
  margin: 2rem 0;
  width: 25%;
}
#single__prospekt .row {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  margin-bottom: 1em;
}
#single__prospekt .row.toggle h2 {
  opacity: 0.5;
  cursor: pointer;
}
#single__prospekt .row.toggle h2.active {
  text-decoration: underline;
  opacity: 1;
}
#single__prospekt .row.toggle h2:last-child {
  padding-left: 1em;
}
#single__prospekt .archive-grid {
  display: none;
}
#single__prospekt .archive-grid.active {
  display: grid;
}

/* 404 */
.error-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 60vh;
}

.content-wrapper {
  /* Case Flex Hero */
  /* Flex Content */
}
.content-wrapper .caseHero {
  padding-top: 0 !important;
}
.content-wrapper .caseHero > div {
  margin: auto;
  padding: 1rem 10vw;
}
.content-wrapper .caseHero .heroMedia.sectionWidthFull {
  padding: 0;
}
.content-wrapper .caseHero .heroMedia > div {
  overflow: hidden;
}
.content-wrapper .caseHero .heroTitle {
  padding-top: 4rem !important;
}
.content-wrapper .caseHero .heroContent {
  display: flex;
  justify-content: space-between;
  padding-top: 4rem;
}
.content-wrapper .caseHero .heroContent .heroDetails {
  width: calc(30% - 1rem);
}
.content-wrapper .caseHero .heroContent .heroDetails .detailsRow {
  margin-bottom: 3rem;
}
.content-wrapper .caseHero .heroContent .heroDetails .detailsRow .detailsHeading {
  margin-bottom: 1em;
  font-weight: 400;
}
.content-wrapper .caseHero .heroContent .heroDetails .detailsRow .detailsContent {
  display: block;
  font-weight: 500;
  margin-bottom: 0.25em;
}
.content-wrapper .caseHero .heroContent .heroDetails .detailsRow .detailsContent a {
  display: inline-block;
  text-decoration: underline;
}
.content-wrapper .caseHero .heroContent .heroDetails .detailsRow .detailsContent a img {
  height: 1em;
  width: 1em;
  margin-left: 0.25em;
  margin-bottom: 0;
}
.content-wrapper .caseHero .heroContent .heroDescription {
  width: calc(70% - 1rem);
}
.content-wrapper .caseHero .heroContent .heroDescription * {
  width: unset;
  max-width: 100%;
}
.content-wrapper .caseHero .heroContent .heroDescription .h3 {
  margin-bottom: 2em;
}
.content-wrapper .caseHero h1 {
  margin-bottom: 0.2em;
}
.content-wrapper .flexContent-wrapper {
  /* Section mods --> Move to universal later */
  /* Column 1 */
  /* Column 2 */
  /* Column Text */
  /* Grid */
  /* Image Grid */
  /* Slider */
}
.content-wrapper .flexContent-wrapper section {
  margin: auto;
  padding: 1rem 10vw;
  /* width */
  /* Padding */
  /* Start */
  /* End */
}
.content-wrapper .flexContent-wrapper section picture {
  display: flex;
}
.content-wrapper .flexContent-wrapper section picture img {
  position: static;
  width: 100%;
  height: auto;
  -o-object-fit: cover;
     object-fit: cover;
}
.content-wrapper .flexContent-wrapper section div[class*=content] {
  overflow: hidden;
}
.content-wrapper .flexContent-wrapper section.sectionWidthSmall {
  padding-inline: 22.5vw;
}
.content-wrapper .flexContent-wrapper section.sectionWidthMedium {
  padding-inline: 17.5vw;
}
.content-wrapper .flexContent-wrapper section.sectionWidthFull {
  padding-inline: unset;
}
.content-wrapper .flexContent-wrapper section.paddingStartNone {
  padding-top: 0;
}
.content-wrapper .flexContent-wrapper section.paddingStartSmall {
  padding-top: 1rem;
}
.content-wrapper .flexContent-wrapper section.paddingStartMedium {
  padding-top: 2rem;
}
.content-wrapper .flexContent-wrapper section.paddingStartLarge {
  padding-top: 4rem;
}
.content-wrapper .flexContent-wrapper section.paddingStartMax {
  padding-top: 6rem;
}
.content-wrapper .flexContent-wrapper section.paddingEndNone {
  padding-bottom: 0;
}
.content-wrapper .flexContent-wrapper section.paddingEndSmall {
  padding-bottom: 1rem;
}
.content-wrapper .flexContent-wrapper section.paddingEndMedium {
  padding-bottom: 2rem;
}
.content-wrapper .flexContent-wrapper section.paddingEndLarge {
  padding-bottom: 4rem;
}
.content-wrapper .flexContent-wrapper section.paddingEndMax {
  padding-bottom: 6rem;
}
.content-wrapper .flexContent-wrapper .flex__column .contentText * {
  max-width: unset;
}
.content-wrapper .flexContent-wrapper .flex__column .contentText *.aligncenter {
  text-align: center;
  margin-inline: auto;
}
.content-wrapper .flexContent-wrapper .flex__column .contentText * img {
  display: block;
  max-width: 100%;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
}
.content-wrapper .flexContent-wrapper .flex__column .contentEmbed {
  width: 100%;
}
.content-wrapper .flexContent-wrapper .flex__column .contentEmbed.aspectRatio16-7 {
  aspect-ratio: 16/7;
}
.content-wrapper .flexContent-wrapper .flex__column .contentEmbed.aspectRatio2-39 {
  aspect-ratio: 2.39;
}
.content-wrapper .flexContent-wrapper .flex__column .contentEmbed.aspectRatio2-1 {
  aspect-ratio: 2/1;
}
.content-wrapper .flexContent-wrapper .flex__column .contentEmbed.aspectRatio16-9 {
  aspect-ratio: 16/9;
}
.content-wrapper .flexContent-wrapper .flex__column .contentEmbed.aspectRatio16-10 {
  aspect-ratio: 16/10;
}
.content-wrapper .flexContent-wrapper .flex__column .contentEmbed iframe {
  width: 100%;
  height: 100%;
}
.content-wrapper .flexContent-wrapper .flex__columns {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  /* Align content */
  /* Column widths */
  /* Content blocks */
}
.content-wrapper .flexContent-wrapper .flex__columns.alignStart {
  align-items: flex-start;
}
.content-wrapper .flexContent-wrapper .flex__columns.alignCenter {
  align-items: center;
}
.content-wrapper .flexContent-wrapper .flex__columns.alignEnd {
  align-items: flex-end;
}
.content-wrapper .flexContent-wrapper .flex__columns.col-5-5 .wrapper:nth-child(1n) {
  width: calc(50% - 1rem);
}
.content-wrapper .flexContent-wrapper .flex__columns.col-4-6 .wrapper:nth-child(odd) {
  width: calc(40% - 1rem);
}
.content-wrapper .flexContent-wrapper .flex__columns.col-4-6 .wrapper:nth-child(even) {
  width: calc(60% - 1rem);
}
.content-wrapper .flexContent-wrapper .flex__columns.col-6-4 .wrapper:nth-child(odd) {
  width: calc(60% - 1rem);
}
.content-wrapper .flexContent-wrapper .flex__columns.col-6-4 .wrapper:nth-child(even) {
  width: calc(40% - 1rem);
}
.content-wrapper .flexContent-wrapper .flex__columns.col-3-7 .wrapper:nth-child(odd) {
  width: calc(30% - 1rem);
}
.content-wrapper .flexContent-wrapper .flex__columns.col-3-7 .wrapper:nth-child(even) {
  width: calc(70% - 1rem);
}
.content-wrapper .flexContent-wrapper .flex__columns.col-7-3 .wrapper:nth-child(odd) {
  width: calc(70% - 1rem);
}
.content-wrapper .flexContent-wrapper .flex__columns.col-7-3 .wrapper:nth-child(even) {
  width: calc(30% - 1rem);
}
.content-wrapper .flexContent-wrapper .flex__columns .wrapper.alt-size {
  padding-inline: 7.5%;
}
.content-wrapper .flexContent-wrapper .flex__columns .contentText {
  margin-bottom: 2em;
}
.content-wrapper .flexContent-wrapper .flex__columns .contentText * {
  max-width: unset;
}
.content-wrapper .flexContent-wrapper .flex__columns .contentText *:first-child {
  margin-top: 0;
}
.content-wrapper .flexContent-wrapper .flex__columns .contentText.col-2 {
  -moz-column-count: 2;
       column-count: 2;
  -moz-column-gap: 1rem;
       column-gap: 1rem;
}
.content-wrapper .flexContent-wrapper .flex__columns .contentText p:last-of-type {
  margin-bottom: 0;
}
.content-wrapper .flexContent-wrapper .flex__columns .contentEmbed {
  width: 100%;
}
.content-wrapper .flexContent-wrapper .flex__columns .contentEmbed.aspectRatio16-9 {
  aspect-ratio: 16/9;
}
.content-wrapper .flexContent-wrapper .flex__columns .contentEmbed.aspectRatio5-4 {
  aspect-ratio: 5/4;
}
.content-wrapper .flexContent-wrapper .flex__columns .contentEmbed.aspectRatio1 {
  aspect-ratio: 1;
}
.content-wrapper .flexContent-wrapper .flex__columns .contentEmbed.aspectRatio9-16 {
  aspect-ratio: 9/16;
}
.content-wrapper .flexContent-wrapper .flex__columns .contentEmbed.aspectRatio4-5 {
  aspect-ratio: 4/5;
}
.content-wrapper .flexContent-wrapper .flex__columns .contentEmbed iframe {
  width: 100%;
  height: 100%;
}
.content-wrapper .flexContent-wrapper .flex__columns .contentMixed .wrapper {
  width: 100% !important;
}
.content-wrapper .flexContent-wrapper .flex__columns .contentMixed .wrapper:first-of-type {
  margin-bottom: 2rem !important;
}
.content-wrapper .flexContent-wrapper .flex__columnText .row {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
}
.content-wrapper .flexContent-wrapper .flex__columnText .row:nth-child(n+2) {
  padding-top: 6rem;
}
.content-wrapper .flexContent-wrapper .flex__columnText .row .rowHeading {
  width: calc(30% - 1rem);
}
.content-wrapper .flexContent-wrapper .flex__columnText .row .rowHeading:first-child * {
  margin-top: 0;
}
.content-wrapper .flexContent-wrapper .flex__columnText .row .rowHeading.h2, .content-wrapper .flexContent-wrapper .flex__columnText .row .rowHeading .h3, .content-wrapper .flexContent-wrapper .flex__columnText .row .rowHeading .h4 {
  margin: 0;
  max-width: unset;
}
.content-wrapper .flexContent-wrapper .flex__columnText .row .rowContent {
  width: calc(70% - 1rem);
  list-style: none;
  /* normal :first-child not working for some reason? */
}
.content-wrapper .flexContent-wrapper .flex__columnText .row .rowContent > *:first-child {
  margin-top: 0;
}
.content-wrapper .flexContent-wrapper .flex__columnText .row .rowContent.col-1 {
  -moz-column-count: 1;
       column-count: 1;
}
.content-wrapper .flexContent-wrapper .flex__columnText .row .rowContent.col-2 {
  -moz-column-count: 2;
       column-count: 2;
  -moz-column-gap: 1rem;
       column-gap: 1rem;
}
.content-wrapper .flexContent-wrapper .flex__columnText .row .rowContent > * {
  margin: 0;
  max-width: unset;
}
.content-wrapper .flexContent-wrapper .flex__grid .heading {
  width: 100%;
}
.content-wrapper .flexContent-wrapper .flex__grid .collection {
  display: grid;
  align-items: start;
  grid-template-rows: auto;
  gap: 1rem;
  padding-block: 2rem;
}
.content-wrapper .flexContent-wrapper .flex__grid.col-3 .collection {
  grid-template-columns: repeat(3, 1fr);
}
.content-wrapper .flexContent-wrapper .flex__grid.col-4 .collection {
  grid-template-columns: repeat(4, 1fr);
}
.content-wrapper .flexContent-wrapper .flex__grid.col-6 .collection {
  grid-template-columns: repeat(6, 1fr);
}
.content-wrapper .flexContent-wrapper .flex__imageGrid .heading {
  width: 100%;
}
.content-wrapper .flexContent-wrapper .flex__imageGrid .collection {
  display: grid;
  align-items: center;
  grid-template-rows: auto;
  gap: 2rem;
  padding-block: 2rem;
}
.content-wrapper .flexContent-wrapper .flex__imageGrid .collection picture {
  display: inline-flex;
  width: 100%;
  height: auto;
}
.content-wrapper .flexContent-wrapper .flex__imageGrid.col-3 .collection {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.content-wrapper .flexContent-wrapper .flex__imageGrid.col-4 .collection {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.content-wrapper .flexContent-wrapper .flex__imageGrid.col-6 .collection {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}
.content-wrapper .flexContent-wrapper .flex__imageGrid.col-8 .collection {
  grid-template-columns: repeat(8, minmax(0, 1fr));
}
.content-wrapper .flexContent-wrapper .flex__slider .slider-wrapper {
  padding-block: 2rem 5rem;
}
.content-wrapper .flexContent-wrapper .flex__slider .slider-wrapper .swiper {
  width: 100%;
  aspect-ratio: 16/9;
  overflow: visible;
}
.content-wrapper .flexContent-wrapper .flex__slider .slider-wrapper .swiper .swiper-slide {
  display: flex;
  flex-direction: row;
  justify-content: center;
}
.content-wrapper .flexContent-wrapper .flex__slider .slider-wrapper .swiper.sliderAuto .swiper-slide {
  width: auto;
  max-width: 100%;
}
.content-wrapper .flexContent-wrapper .flex__slider .slider-wrapper .swiper .swiper-pagination-fraction {
  width: auto;
  left: 0;
  bottom: -4rem;
}
.content-wrapper .flexContent-wrapper .flex__slider .slider-wrapper .swiper .swiper-button-next {
  top: auto;
  right: 0;
  bottom: -4rem;
  left: auto;
  width: 2.5rem;
  height: 2.5rem;
}
.content-wrapper .flexContent-wrapper .flex__slider .slider-wrapper .swiper .swiper-button-next::after {
  content: "";
  width: 100%;
  height: 100%;
  background: no-repeat center url("assets/img/material-symbols_arrow-forward-ios.svg");
}
.content-wrapper .flexContent-wrapper .flex__slider .slider-wrapper .swiper .swiper-button-prev {
  top: auto;
  right: 3rem;
  bottom: -4rem;
  left: auto;
  width: 2.5rem;
  height: 2.5rem;
}
.content-wrapper .flexContent-wrapper .flex__slider .slider-wrapper .swiper .swiper-button-prev::after {
  content: "";
  width: 100%;
  height: 100%;
  background: no-repeat center url("assets/img/material-symbols_arrow-back-ios.svg");
}
.content-wrapper .flexContent-wrapper .flex__results {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.content-wrapper .flexContent-wrapper .flex__results .heading {
  width: calc(50% - 2rem);
}
.content-wrapper .flexContent-wrapper .flex__results .collection {
  display: flex;
  justify-content: space-between;
  align-content: flex-start;
  flex-wrap: wrap;
  width: calc(50% - 1rem);
}
.content-wrapper .flexContent-wrapper .flex__results .collection .column {
  width: calc(50% - 1rem);
}

/* @MEDIA */
/* Big screeens */
@media only screen and (min-width: 2560px) {
  /* Sections */
  .container {
    padding: 0 14vw;
    margin: 0 auto;
  }
  footer .container {
    padding-top: 3rem;
    padding-bottom: 2rem;
  }
  .case-results {
    padding-top: 4rem;
  }
  .content-wrapper .caseHero .heroContent {
    padding-inline: 14vw;
  }
  .content-wrapper .flexContent-wrapper section {
    padding: 1rem 14vw;
    /* width */
  }
  .content-wrapper .flexContent-wrapper section.sectionWidthSmall {
    padding-inline: 26.5vw;
  }
  .content-wrapper .flexContent-wrapper section.sectionWidthMedium {
    padding-inline: 21.5vw;
  }
  .content-wrapper .flexContent-wrapper section.sectionWidthFull {
    padding-inline: unset;
  }
}
/* Medium Screens */
@media only screen and (max-width: 1680px) {
  main {
    padding-top: 8rem;
  }
  main section {
    padding: 4rem 0;
  }
  main section:last-of-type {
    padding-bottom: 8rem;
  }
  main .container {
    padding: 0 8vw;
  }
  footer .container {
    padding-top: 3rem;
    padding-bottom: 2rem;
  }
  header .container {
    padding: 1.25rem 8vw 1rem;
  }
  #single__case {
    margin-top: -2rem;
  }
  .content-wrapper .caseHero .heroContent {
    padding-inline: 8vw;
  }
  .content-wrapper .flexContent-wrapper section {
    padding: 1rem 8vw;
    /* width */
  }
  .content-wrapper .flexContent-wrapper section.sectionWidthSmall {
    padding-inline: 20.5vw;
  }
  .content-wrapper .flexContent-wrapper section.sectionWidthMedium {
    padding-inline: 15.5vw;
  }
  .content-wrapper .flexContent-wrapper section.sectionWidthFull {
    padding-inline: unset;
  }
}
/* Laptops */
@media only screen and (max-width: 1440px) {
  main {
    padding-top: 6rem;
  }
  main section {
    padding: 3rem 0;
  }
  main section:last-of-type {
    padding-bottom: 6rem;
  }
  main .container {
    padding: 0 6vw;
  }
  footer .container {
    padding-top: 3rem;
    padding-bottom: 2rem;
  }
  .special {
    display: flex;
    margin-bottom: 1rem;
  }
  .case-grid {
    grid-gap: 2rem;
  }
  .archive-grid {
    grid-gap: 2rem;
  }
  header #navbar .container {
    padding: 1.25rem 6vw 1rem;
  }
  #single__case {
    margin-top: unset;
  }
  .content-wrapper .caseHero .heroContent {
    padding-inline: 6vw;
  }
  .content-wrapper .flexContent-wrapper section {
    padding: 1rem 6vw;
    /* width */
  }
  .content-wrapper .flexContent-wrapper section.sectionWidthSmall {
    padding-inline: 18.5vw;
  }
  .content-wrapper .flexContent-wrapper section.sectionWidthMedium {
    padding-inline: 13.5vw;
  }
  .content-wrapper .flexContent-wrapper section.sectionWidthFull {
    padding-inline: unset;
  }
}
@media only screen and (max-width: 1279px) {
  /* Pages */
  #temp__root .image-hover-list {
    flex-direction: column;
  }
  #temp__root .image-hover-list .collection__news {
    width: 100%;
  }
  #temp__root .image-hover-list .collection__news .row {
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
  }
}
/* Mobile – Landscape down */
@media only screen and (max-width: 767px) {
  /* Core */
  body {
    cursor: default;
  }
  main {
    padding-top: 4rem;
  }
  main section {
    padding: 2rem 0;
  }
  main section:last-of-type {
    padding-bottom: 4rem;
  }
  main .container {
    padding: 0 1.2rem;
  }
  .hero {
    padding: 0;
    margin: 8rem 0 -2rem;
  }
  .theBall, .theBall-outer {
    display: none;
  }
  .modal__cookies {
    left: 1rem;
    right: 1rem;
    bottom: 1rem;
  }
  /* Header */
  header .main-nav {
    display: none;
  }
  header #navbar .container, header .mobile-menu .container {
    padding: 1rem 1.2rem 0.5rem;
  }
  header #navbar .custom-logo-link, header .mobile-menu .custom-logo-link {
    transform: rotateZ(90deg);
    margin-left: 0.5em;
  }
  header #navbar .custom-logo-link .custom-logo, header .mobile-menu .custom-logo-link .custom-logo {
    height: 34px;
  }
  .show-hamburger {
    display: flex;
    opacity: 1;
    pointer-events: all;
    z-index: 100;
  }
  #open {
    display: inline-block;
  }
  /* Footer */
  footer .container {
    flex-direction: column;
    padding: 2rem 1.2rem;
  }
  footer .container .col {
    width: 100%;
    margin: 0;
  }
  footer .container .col a {
    font-size: inherit;
  }
  /* Classes */
  .animati-wrapper-flip {
    display: flex;
    align-items: center;
    flex-direction: column-reverse;
  }
  .animati-wrapper {
    display: flex;
    align-items: center;
    flex-direction: column;
  }
  .news .row .col {
    padding: 1em 0;
  }
  /* Case */
  .case-grid {
    grid-template-columns: 1fr 1fr;
    grid-gap: 2rem 0;
  }
  .archive-grid {
    grid-gap: 2rem;
  }
  /* Case Flex Content */
  main.case section {
    padding: 0.5rem 0;
  }
  main.case section:first-of-type {
    padding-top: 1rem !important;
  }
  main.case section:last-of-type {
    padding-top: 0rem !important;
    padding-bottom: 2rem !important;
  }
  .case-description-wrapper {
    margin: 1rem 0 2rem;
    display: flex;
    flex-direction: column;
  }
  .case-description-wrapper .case-description-title {
    width: 100%;
    padding-right: 0;
  }
  .case-description-wrapper .case-description-content {
    width: 100%;
    padding-right: 0;
    margin-top: 1em;
  }
  .case-description-wrapper .case-description-content .case-description-tags {
    margin-top: 1em;
  }
  .case-image-row {
    flex-direction: column;
  }
  .case-image-row .row-left {
    width: 100%;
    margin-right: 0;
  }
  .case-image-row .row-right {
    width: 100%;
    margin-left: 0;
    margin-top: 1rem;
  }
  .case-image-row .alt-content-size {
    width: 100%;
  }
  .case-text {
    margin: 2em 0;
  }
  .case-results {
    margin-top: 2rem;
  }
  .case-results .result--wrapper {
    flex-wrap: wrap;
  }
  .case-results .result--wrapper .result--container {
    justify-content: left !important;
    margin-top: 1rem;
    width: 100%;
  }
  /* Case archive */
  .case-grid .c-tn {
    grid-column: span 2 !important;
  }
  .case-grid .case__link {
    grid-column: 1/3;
  }
  /* Case Thumbnails */
  .c-tn {
    margin-bottom: 1rem;
    height: 100%;
  }
  .c-tn-basic {
    grid-column: span 4;
  }
  /* About */
  .temp__about .contact-col {
    width: 100%;
  }
  .capabilites .row .col {
    width: 100%;
  }
  .logo-loaf {
    margin-top: 2rem;
  }
  .logo-loaf figure {
    width: 25%;
  }
  /* Contact */
  .contact-hero .content-wrapper .text-wrapper {
    width: 100%;
    margin-bottom: 4rem;
  }
  .contact-hero .content-wrapper .text-wrapper p {
    padding-right: 0;
  }
  .person-container .col {
    width: 50%;
    margin-bottom: 2rem;
  }
  .newsletter-modal {
    padding: 2em 1.5em 2em;
  }
  .newsletter-modal .h2 {
    max-width: 90%;
  }
  #close-btn {
    top: 1.5em;
    right: 1.5em;
  }
  input[type=submit i] {
    margin-top: 1rem;
  }
  /* News */
  .news-wrapper {
    flex-direction: column;
  }
  .news-wrapper figure, .news-wrapper .iframe-wrapper {
    width: 100%;
    margin: 0;
    padding-top: 66%;
  }
  .news-wrapper .news-content {
    width: 100%;
    margin: 1rem 0 0;
  }
  .content-wrapper .caseHero .heroContent {
    flex-direction: column-reverse;
    padding-top: 2rem;
    padding-inline: 1rem;
  }
  .content-wrapper .caseHero .heroContent .heroDescription {
    width: 100%;
  }
  .content-wrapper .caseHero .heroContent .heroDetails {
    width: 100%;
    padding-top: 2rem;
  }
  .content-wrapper .caseHero .heroContent .heroDetails .detailsRow {
    margin-bottom: 2rem;
  }
  .content-wrapper .flexContent-wrapper section {
    padding: 0.5rem 1rem;
    /* width */
    /* Padding */
    /* Start */
    /* End */
  }
  .content-wrapper .flexContent-wrapper section.sectionWidthSmall {
    padding-inline: 3rem;
  }
  .content-wrapper .flexContent-wrapper section.sectionWidthMedium {
    padding-inline: 2rem;
  }
  .content-wrapper .flexContent-wrapper section.sectionWidthFull {
    padding-inline: unset;
  }
  .content-wrapper .flexContent-wrapper section.paddingStartNone {
    padding-top: 0;
  }
  .content-wrapper .flexContent-wrapper section.paddingStartSmall {
    padding-top: 0.5rem;
  }
  .content-wrapper .flexContent-wrapper section.paddingStartMedium {
    padding-top: 1rem;
  }
  .content-wrapper .flexContent-wrapper section.paddingStartLarge {
    padding-top: 2rem;
  }
  .content-wrapper .flexContent-wrapper section.paddingStartMax {
    padding-top: 3rem;
  }
  .content-wrapper .flexContent-wrapper section.paddingEndNone {
    padding-bottom: 0;
  }
  .content-wrapper .flexContent-wrapper section.paddingEndSmall {
    padding-bottom: 0.5rem;
  }
  .content-wrapper .flexContent-wrapper section.paddingEndMedium {
    padding-bottom: 1rem;
  }
  .content-wrapper .flexContent-wrapper section.paddingEndLarge {
    padding-bottom: 2rem;
  }
  .content-wrapper .flexContent-wrapper section.paddingEndMax {
    padding-bottom: 3rem;
  }
  .content-wrapper .flexContent-wrapper .flex__columns {
    flex-direction: column;
  }
  .content-wrapper .flexContent-wrapper .flex__columns.col-5-5 .wrapper:nth-child(odd), .content-wrapper .flexContent-wrapper .flex__columns.col-4-6 .wrapper:nth-child(odd), .content-wrapper .flexContent-wrapper .flex__columns.col-6-4 .wrapper:nth-child(odd), .content-wrapper .flexContent-wrapper .flex__columns.col-3-7 .wrapper:nth-child(odd), .content-wrapper .flexContent-wrapper .flex__columns.col-7-3 .wrapper:nth-child(odd) {
    margin-bottom: 1rem;
  }
  .content-wrapper .flexContent-wrapper .flex__columns.reverseOrderMobile {
    flex-direction: column-reverse;
  }
  .content-wrapper .flexContent-wrapper .flex__columns.reverseOrderMobile.col-5-5 .wrapper:nth-child(odd), .content-wrapper .flexContent-wrapper .flex__columns.reverseOrderMobile.col-4-6 .wrapper:nth-child(odd), .content-wrapper .flexContent-wrapper .flex__columns.reverseOrderMobile.col-6-4 .wrapper:nth-child(odd), .content-wrapper .flexContent-wrapper .flex__columns.reverseOrderMobile.col-3-7 .wrapper:nth-child(odd), .content-wrapper .flexContent-wrapper .flex__columns.reverseOrderMobile.col-7-3 .wrapper:nth-child(odd) {
    margin-bottom: 0;
  }
  .content-wrapper .flexContent-wrapper .flex__columns.reverseOrderMobile.col-5-5 .wrapper:nth-child(odd) .wrapper, .content-wrapper .flexContent-wrapper .flex__columns.reverseOrderMobile.col-4-6 .wrapper:nth-child(odd) .wrapper, .content-wrapper .flexContent-wrapper .flex__columns.reverseOrderMobile.col-6-4 .wrapper:nth-child(odd) .wrapper, .content-wrapper .flexContent-wrapper .flex__columns.reverseOrderMobile.col-3-7 .wrapper:nth-child(odd) .wrapper, .content-wrapper .flexContent-wrapper .flex__columns.reverseOrderMobile.col-7-3 .wrapper:nth-child(odd) .wrapper {
    margin: 0;
  }
  .content-wrapper .flexContent-wrapper .flex__columns.reverseOrderMobile.col-5-5 .wrapper:nth-child(even), .content-wrapper .flexContent-wrapper .flex__columns.reverseOrderMobile.col-4-6 .wrapper:nth-child(even), .content-wrapper .flexContent-wrapper .flex__columns.reverseOrderMobile.col-6-4 .wrapper:nth-child(even), .content-wrapper .flexContent-wrapper .flex__columns.reverseOrderMobile.col-3-7 .wrapper:nth-child(even), .content-wrapper .flexContent-wrapper .flex__columns.reverseOrderMobile.col-7-3 .wrapper:nth-child(even) {
    margin-bottom: 1rem;
  }
  .content-wrapper .flexContent-wrapper .flex__columns.reverseOrderMobile.col-5-5 .wrapper:nth-child(even) .wrapper, .content-wrapper .flexContent-wrapper .flex__columns.reverseOrderMobile.col-4-6 .wrapper:nth-child(even) .wrapper, .content-wrapper .flexContent-wrapper .flex__columns.reverseOrderMobile.col-6-4 .wrapper:nth-child(even) .wrapper, .content-wrapper .flexContent-wrapper .flex__columns.reverseOrderMobile.col-3-7 .wrapper:nth-child(even) .wrapper, .content-wrapper .flexContent-wrapper .flex__columns.reverseOrderMobile.col-7-3 .wrapper:nth-child(even) .wrapper {
    margin: 0;
  }
  .content-wrapper .flexContent-wrapper .flex__columns.col-5-5 .wrapper:nth-child(odd) {
    width: 100%;
  }
  .content-wrapper .flexContent-wrapper .flex__columns.col-5-5 .wrapper:nth-child(even) {
    width: 100%;
  }
  .content-wrapper .flexContent-wrapper .flex__columns.col-4-6 .wrapper:nth-child(odd) {
    width: 100%;
  }
  .content-wrapper .flexContent-wrapper .flex__columns.col-4-6 .wrapper:nth-child(even) {
    width: 100%;
  }
  .content-wrapper .flexContent-wrapper .flex__columns.col-6-4 .wrapper:nth-child(odd) {
    width: 100%;
  }
  .content-wrapper .flexContent-wrapper .flex__columns.col-6-4 .wrapper:nth-child(even) {
    width: 100%;
  }
  .content-wrapper .flexContent-wrapper .flex__columns.col-3-7 .wrapper:nth-child(odd) {
    width: 100%;
  }
  .content-wrapper .flexContent-wrapper .flex__columns.col-3-7 .wrapper:nth-child(even) {
    width: 100%;
  }
  .content-wrapper .flexContent-wrapper .flex__columns.col-7-3 .wrapper:nth-child(odd) {
    width: 100%;
  }
  .content-wrapper .flexContent-wrapper .flex__columns.col-7-3 .wrapper:nth-child(even) {
    width: 100%;
  }
  .content-wrapper .flexContent-wrapper .flex__columns .contentText.col-2 {
    -moz-column-count: 1;
         column-count: 1;
  }
  .content-wrapper .flexContent-wrapper .flex__grid.col-3 .collection, .content-wrapper .flexContent-wrapper .flex__grid.col-4 .collection, .content-wrapper .flexContent-wrapper .flex__grid.col-6 .collection {
    padding-block: 1rem;
    grid-template-columns: 1fr;
  }
  .content-wrapper .flexContent-wrapper .flex__imageGrid.col-3 .collection, .content-wrapper .flexContent-wrapper .flex__imageGrid.col-4 .collection, .content-wrapper .flexContent-wrapper .flex__imageGrid.col-6 .collection, .content-wrapper .flexContent-wrapper .flex__imageGrid.col-8 .collection {
    grid-template-columns: 1fr 1fr;
  }
  .content-wrapper .flexContent-wrapper .flex__slider .slider-wrapper {
    padding-block: 1rem 3rem;
  }
  .content-wrapper .flexContent-wrapper .flex__slider .slider-wrapper .swiper.sliderAuto {
    aspect-ratio: 4/3;
  }
  .content-wrapper .flexContent-wrapper .flex__slider .slider-wrapper .swiper .swiper-pagination-fraction {
    bottom: -2.5rem;
  }
  .content-wrapper .flexContent-wrapper .flex__slider .slider-wrapper .swiper .swiper-button-next {
    bottom: -3rem;
  }
  .content-wrapper .flexContent-wrapper .flex__slider .slider-wrapper .swiper .swiper-button-prev {
    bottom: -3rem;
    right: 2.5rem;
  }
  .content-wrapper .flexContent-wrapper .flex__results {
    flex-direction: column;
  }
  .content-wrapper .flexContent-wrapper .flex__results .heading {
    width: 100%;
  }
  .content-wrapper .flexContent-wrapper .flex__results .collection {
    width: 100%;
    margin-top: 2rem;
  }
  .content-wrapper .flexContent-wrapper .flex__columnText .row {
    flex-direction: column;
  }
  .content-wrapper .flexContent-wrapper .flex__columnText .row:nth-child(n+2) {
    padding-top: 3rem;
  }
  .content-wrapper .flexContent-wrapper .flex__columnText .row .rowHeading {
    width: 100%;
    margin-bottom: 1rem;
  }
  .content-wrapper .flexContent-wrapper .flex__columnText .row .rowContent {
    width: 100%;
  }
}/*# sourceMappingURL=style.css.map */