
/* stand-up-participate.de
------------------------------------------------ */



/* inter
-------------------------------------------------- */

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  src: url(../fonts/inter-300-light.woff2) format('woff2');
}

@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 300;
  src: url(../fonts/inter-300-light-italic.woff2) format('woff2');
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  src: url(../fonts/inter-600-semibold.woff2) format('woff2');
}



/* color
-------------------------------------------------- */

:root {
  --gray-light: rgb(170, 170, 170);
  --gray-medium: rgb(85, 85, 85);
  --gray-heavy: rgb(0, 0, 0);
  --sulfur-light: rgb(255, 238, 51);
  --sulfur-medium: rgb(229, 214, 51);
  --sulfur-heavy: rgb(204, 190, 51);
}



/* basics
------------------------------------------------ */

*,
*::before,
*::after {
  box-sizing: border-box;
}

* {
  margin: 0;
  padding: 0; /* lists */
}

html {
  font-size: 100%; /* rem */
  -webkit-text-size-adjust: none;
  -moz-text-size-adjust: none;
  text-size-adjust: none;
}

body {
  font-family: 'Inter', sans-serif;
  line-height: 1.75; /* 28 */
}

img, video {
  display: block;
  width: 100%;
}



/* font
------------------------------------------------ */

body {
  font-weight: 300;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 600;
}

strong {
  font-weight: 600;
}

h1, h2 {
  word-break: break-word;
}



/* font
------------------------------------------------ */

h1 {
  font-size: 2.25rem; /* 36 */
  line-height: 1.167; /* 42 */
}

h2 {
  font-size: 1.5rem; /* 24 */
  line-height: 1.167; /* 28 */
}

h3, h4, h5, h6 {
  font-size: 1.25rem; /* 20 */
  line-height: 1.4; /* 28 */
}

figcaption {
  font-size: .875rem; /* 14 */
  line-height: 2; /* 28 */
}

@media screen and (min-width: 48em) { /* 768 */
 body {
    font-size: 1.125rem; /* 18 */
    line-height: 1.556; /* 28 */
  }
 h1 {
    font-size: 3rem; /* 48 */
    line-height: 1.167; /* 56 */
  }
 h2 {
    font-size: 2.25rem; /* 36 */
    line-height: 1.167; /* 42 */
  }
 h3 {
    font-size: 1.5rem; /* 24 */
    line-height: 1.167; /* 28 */
  }
}

/* font
------------------------------------------------ */

.block-related h2 {
  font-size: 2.25rem; /* 36 */
  line-height: 1.167; /* 42 */
}

@media screen and (min-width: 48em) { /* 768 */
  .block-related h2 {
    font-size: 3rem; /* 48 */
    line-height: 1.167; /* 56 */
  }
}



/* margin
------------------------------------------------ */

h1, h2, h3, h4, h5, h6,
figure, dl, ol, ul, p, pre {
  margin: 1.75rem 0; /* 28 */
}



/* lists
------------------------------------------------ */

ul, ol {
  list-style: none;
}

.copy-column ul,
.info-column ul,
.intro-column ul,
.modules-list ul {
  padding: 0 0 0 3.5rem;
  list-style: "\2014\0020";
}

.copy-column ol,
.info-column ol
.intro-column ol,
.modules-list ol {
  padding: 0 0 0 3.5rem;
}

.copy-column li,
.info-column li,
.intro-column li {
  margin: 1.75rem 0;
}



/* rule
------------------------------------------------ */

hr {
  border: none;
  border-top: 1px solid var(--gray-medium);
}



/* focus
------------------------------------------------ */

*:focus:not(:focus-visible) {
  outline: none;
}

*:focus-visible {
  outline: 4px solid var(--gray-light);
  outline-offset: .21875rem; /* 3.5 */
}



/* links
------------------------------------------------ */

a {
  color: currentcolor;
  text-decoration: underline;
}

.header-menu a,
.block-headline a,
.block-featured a,
.block-related a,
.footer-contents a {
  text-decoration: none;
}

.header-menu a:hover,
.footer-contents a:hover {
  text-decoration: underline;
}



/* layout
------------------------------------------------ */

.header {
  padding: 1.75rem 0;
}

.main {
  padding: 1.75rem 0;
}

.footer {
  padding: 1.75rem 0;
  background: var(--sulfur-light);
}



/* block-featured
------------------------------------------------ */

.block-featured {
  padding: 1.75rem 0;
}

.featured-column {
  display: flex;
  flex-wrap: wrap;
}

.featured-column .column-media,
.featured-column .column-text {
  flex-basis: 100%;
}

.featured-column .column-text {
  padding: 0 1.75rem;
}

@media screen and (min-width: 48em) {
  .featured-column .column-media,
  .featured-column .column-text {
    flex-basis: 50%;
  }
  .featured-column .column-media {
    padding: 0 1.75rem 0 0;
  }
}

@media screen and (min-width: 96em) {
  .block-featured {
    padding: 1.75rem calc(50% - 36rem) 1.75rem;
  }
}

.block-featured {
  position: relative;
}

.block-featured a::after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
}

/* block-related
------------------------------------------------ */

.block-related {
  padding: 1.75rem 0;
}

.related-column {
  display: flex;
  flex-wrap: wrap;
}

.related-column .column-media,
.related-column .column-text {
  flex-basis: 100%;
}

.related-column .column-text {
  padding: 0 1.75rem;
}

@media screen and (min-width: 48em) {
  .related-column .column-media {
    flex-basis: 50%;
    order: 2;
  }
  .related-column .column-text {
    flex-basis: 50%;
    order: 1;
  }
}

@media screen and (min-width: 96em) {
  .block-related {
    padding: 1.75rem calc(50% - 36rem) 1.75rem;
  }
}

/* block-headline
------------------------------------------------ */

.block-headline {
  padding: 1.75rem 0;
}

.headline-column {
  padding: 0 1.75rem;
}

@media screen and (min-width: 36em) {
  .block-headline {
    padding: 1.75rem calc(50% - 18rem) 1.75rem 0;
  }
}

@media screen and (min-width: 96em) {
  .block-headline {
    padding: 1.75rem calc(50% - 36rem) 1.75rem;
  }
}

/* block-copy
------------------------------------------------ */

.block-copy {
  padding: 1.75rem 0;
}

.copy-column {
  padding: 0 1.75rem;
}

@media screen and (min-width: 60em) {
  .block-copy {
    padding: 1.75rem calc(50% - 24rem) 1.75rem;
  }
}

/* block-video
------------------------------------------------ */

.block-video {
  padding: 1.75rem 0;
}

.video-figure .figure-text {
  padding: 0 1.75rem;
}

@media screen and (min-width:60em) {
  .block-video {
    padding: 1.75rem calc(50% - 24rem) 1.75rem 0;
  }
}

@media screen and (min-width: 96em) {
  .block-video {
    padding: 1.75rem calc(50% - 36rem) 1.75rem;
  }
}

/* block-heroes
------------------------------------------------ */

.block-heroes {
  padding: 1.75rem 0;
}

.heroes-figure .figure-text {
  padding: 0 1.75rem;
}

@media screen and (min-width:60em) {
  .block-heroes {
    padding: 1.75rem calc(50% - 24rem) 1.75rem 0;
  }
}

@media screen and (min-width: 96em) {
  .block-heroes {
    padding: 1.75rem calc(50% - 36rem) 1.75rem;
  }
}

/* block-images
------------------------------------------------ */

.block-images {
  padding: 1.75rem 0;
}

.images-figures {
  display: flex;
  flex-wrap: wrap;
}

.images-figure {
  flex-basis: 100%;
  padding: 0 1.75rem;
}

@media screen and (min-width: 48em) {
  .images-figure {
    flex-basis: 50%;
  }
}

@media screen and (min-width: 96em) {
  .block-images {
    padding: 1.75rem calc(50% - 36rem) 1.75rem;
  }
}

/* block-funders (ul)
------------------------------------------------ */

.block-funders {
  padding: 1.75rem 0;
}

.funders-heading {
  padding: 0 1.75rem;
}

.funders-list {
  display: flex;
  flex-wrap: wrap;
  margin: 0; /* ul reset */
}

.funders-item {
  flex-basis: 100%;
  padding: 0 1.75rem;
}

@media screen and (min-width: 36em) {
  .funders-item {
    flex-basis: 50%;
  }
}

@media screen and (min-width: 60em) {
  .block-funders {
    padding: 1.75rem calc(50% - 24rem) 1.75rem;
  }
}

/* block-modules (ul)
------------------------------------------------ */

.block-modules {
  padding: 1.75rem 0;
}

.modules-list {
  display: flex;
  flex-wrap: wrap;
  margin: 0; /* ul reset */
}

.modules-item {
  flex-basis: 100%;
  padding: 0 1.75rem;
}

@media screen and (min-width: 48em) {
  .modules-item {
    flex-basis: 50%;
    padding: 0 3.5rem;
  }
}

@media screen and (min-width: 96em) {
  .block-modules {
    padding: 1.75rem calc(50% - 36rem) 1.75rem;
  }
}

/* block-reviews (ul)
------------------------------------------------ */

.block-reviews {
  padding: 1.75rem 0;
}

.reviews-heading {
  padding: 0 1.75rem;
}

.reviews-list {
  display: flex;
  flex-wrap: wrap;
  margin: 0; /* ul reset */
}

.reviews-item {
  flex-basis: 100%;
  padding: 0 1.75rem;
}

@media screen and (min-width: 48em) {
  .reviews-item {
    flex-basis: 50%;
  }
}

@media screen and (min-width: 60em) {
  .block-reviews {
    padding: 1.75rem calc(50% - 24rem) 1.75rem;
  }
}

/* block-team (ul)
------------------------------------------------ */

.block-team {
  padding: 1.75rem 0;
}

.team-heading {
  padding: 0 1.75rem;
}

.team-list {
  display: flex;
  flex-wrap: wrap;
  margin: 0; /* ul reset */
}

.team-item {
  flex-basis: 100%;
  padding: 0 1.75rem;
}

@media screen and (min-width: 48em) {
  .team-item {
    flex-basis: 50%;
  }
}

@media screen and (min-width: 60em) {
  .block-team {
    padding: 1.75rem calc(50% - 24rem) 1.75rem;
  }
}

/* block-booklet
------------------------------------------------ */

.block-booklet {
  padding: 1.75rem 0;
}

.booklet-column {
  display: flex;
  flex-wrap: wrap;
}

.booklet-column > * {
  flex-basis: 100%;
  padding: 0 1.75rem;
}

@media screen and (min-width: 48em) {
  .booklet-column > * {
    flex-basis: 50%;
  }
}

@media screen and (min-width: 60em) {
  .block-booklet {
    padding: 0 calc(50% - 24rem) 0;
  }
}

/* site-header
------------------------------------------------ */

.site-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.header-identity,
.header-menu {
  flex-basis: 100%;
  padding: 0 1.75rem;
}

.header-identity img {
  max-width: 12.5rem; /* 16 - (2 * 1.75) */
}

.menu-list {
  margin: 0; /* ul reset */
}

.menu-item {
  display: inline-block;
  margin: 0 .875rem 0 0;
}

@media screen and (min-width: 48em) {
  .header-identity {
    flex-basis: 33.333%; /* 16 */
  }
  .header-menu {
    flex-basis: 66.667%; /* 32 */
  }
}

@media screen and (min-width: 48em) {
  .menu-list {
    text-align: right;
  }
  .menu-item {
    margin: 0 0 0 .875rem;
  }
}

@media screen and (min-width: 96em) {
  .site-header {
    padding: 1.75rem calc(50% - 36rem) 1.75rem;
  }
}

/* site-footer
------------------------------------------------ */

.site-footer {
  display: flex;
  flex-wrap: wrap;
  padding: 1.75rem 0;
}

.footer-contents,
.footer-social {
  flex-basis: 100%;
  padding: 0 1.75rem;
}

.footer-contents img {
  max-width: 20.5rem; /* 24 - (2 * 1.75) */
}

.social-list {
  margin: 0;  /* ul reset */
}

.social-item {
  display: inline-block;
  width: 2.625rem;
  margin: 0 .875rem 0 0;
}

@media screen and (min-width: 48em) {
  .footer-contents {
    flex-basis: 50%; /* 24 */
  }
}

@media screen and (min-width: 96em) {
  .site-footer {
    padding: 1.75rem calc(50% - 36rem) 1.75rem;
  }
}
