/* hero */
#about #hero .p-hero {background-image: url(../img/about/hero-bg.jpg);}
/* message */
#about #message {
  position: relative;
  padding: calc(var(--base) * 10) 0 0;
  background-color: #e6c8b8;
}
#about #message::before {
  position: absolute;
  left: 0;
  top: calc(79 / 1200 * -100vw);
  width: 100%;
  height: calc(79 / 1200 * 100vw);
  background-image: url(../img/casestudy/deco_content_before.png);
  background-position: center bottom;
  background-repeat: no-repeat;
  background-size: cover;
  z-index: 0;
  content: '';
}
#about #message .p-headline > * {
  display: flex;
  justify-content: center;
  flex-direction: column;
  text-align: center;
  gap: 1em;
}
#about #message .p-headline > * > span:nth-of-type(1) {
  color: #706359;
  font-family: 'FOT-SeuratProN-EB', sans-serif;
  font-size: 32px;
}
#about #message .p-headline > * > span:nth-of-type(2) {
  font-size: 64px;
  font-weight: 700;
  padding-left: .5em;
}
#about #message .p-lead {margin-top: 64px;}
#about #message .p-lead p {
  font-size: 24px;
  font-weight: 700;
  line-height: 2;
  text-align: center;
}
/* features */
#about #features {
  padding: calc(var(--base) * 15) 0;
  background-color: #e6c8b8;
}
#about #features .p-content > * {
  width: 100%;
  max-width: 896px;
  margin-inline: auto;
  padding: calc(var(--base)* 6) calc(var(--base)* 6) calc(var(--base)* 8);
  border: 4px solid #fff;
  border-radius: 5em;
}
#about #features .p-content > *:nth-child(1) {background-color: #fff;}
#about #features .p-content > *:not(:nth-child(1)) {margin-top: calc(var(--base)* 8);}
#about #features .p-content-headline h2 {
  color: #706359;
  font-family: 'FOT-SeuratProN-EB', sans-serif;
  font-size: 40px;
  text-align: center;
}
#about #features .p-content-text p {font-size: calc(var(--base)* 2.5);}
#about #features .p-content-subtext p {font-size: calc(var(--base)* 2);}
#about #features .p-content > *:nth-child(1) figure {
  width: 70%;
  margin-inline: auto;
}
#about #features .p-content-imagetext > .c-flex:not(:nth-child(1)) {margin-top: calc(var(--base)* 4);}
#about #features .p-content-imagetext > .c-flex:nth-of-type(even) {flex-direction: row-reverse;}
#about #features .p-content-imagetext > .c-flex > *:nth-child(1) {width: 60%;}
#about #features .p-content-imagetext > .c-flex > *:nth-child(1) img {
  width: 100%;
  border-radius: 24px;
}
#about #features .p-content-imagetext > .c-flex > *:nth-child(2) {
  flex: 1;
  padding: 1em;
}
#about #features .p-content-imagetext > .c-flex > *:nth-child(2) p {font-size: calc(var(--base)* 2.5);}
#about #features .p-content-tile > .c-flex {gap: 1em;}
#about #features .p-content-tile > .c-flex > * {width: calc((100% - 1em) / 2);}
#about #features .p-content-tile img {
  width: 100%;
  border-radius: 24px;
}

@media screen and (max-width: 1200px) {
  /* message */
  #about #message .p-headline > * > span:nth-of-type(1) {font-size: 2.86vw;}
  #about #message .p-headline > * > span:nth-of-type(2) {font-size: 5.71vw;}
  #about #message .p-lead {margin-top: 5.71vw;}
  #about #message .p-lead p {font-size: 2.04vw;}
  /* features */
  #about #features .p-content-headline h2 {font-size: 4.08vw;}

}
@media screen and (max-width: 767px) {
  /* message */
  #about #message .p-headline > * > span:nth-of-type(1) {font-size: 3.75vw;}
  #about #message .p-headline > * > span:nth-of-type(2) {font-size: 7.5vw;}
  #about #message .p-lead {margin-top: 7.5vw;}
  #about #message .p-lead p {font-size: 2.81vw;}
  /* features */
  #about #features .p-content-headline h2 {font-size: 5.63vw;}
  #about #features .p-content-imagetext > .c-flex > *:nth-child(1) {width: 100%;}
  #about #features .p-content-tile > .c-flex > * {width: 100%;}

}
@media screen and (max-width: 480px) {
  /* message */
  #about #message .p-headline > * > span:nth-of-type(1) {font-size: 5.00vw;}
  #about #message .p-headline > * > span:nth-of-type(2) {font-size: 8.00vw;}
  #about #message .p-lead {margin-top: 8.00vw;}
  #about #message .p-lead p {font-size: 4.00vw;}
  /* features */
  #about #features .p-content > * {padding: calc(var(--base)* 6) calc(var(--base)* 2) calc(var(--base)* 8);}
  #about #features .p-content-headline h2 {font-size: 7.00vw;}

}