@charset "UTF-8";

/* Section geometry and type follow Design iRidi's standard and mirrored blocks. */
:root {
  --iridi-block-min-height: 700px;
  --iridi-title-font-size: 50px;
  --iridi-title-font-weight: 700;
  --iridi-desc-font-size: 21px;
  --iridi-desc-margin-top: 40px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: DINPro, Arial, sans-serif; }
#main { overflow: clip; }
#solutions-hero {
  min-height: 700px;
  padding: 145px max(5vw, 24px) 105px;
  background: #000 var(--hero-image) center / cover no-repeat;
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
#solutions-hero h1 { margin: 0; font-size: 60px; line-height: 1.17; font-weight: 700; }
#solutions-hero > p { margin: 28px 0 0; font-size: 40px; line-height: 1.25; }
#solutions-hero nav {
  width: min(1536px, 100%);
  margin-top: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  column-gap: 24px;
  row-gap: 10px;
}
#solutions-hero nav a {
  color: #fff;
  text-decoration: none;
  font-size: 21px;
  line-height: 1.45;
}
#solutions-hero nav a:hover,
#solutions-hero nav a:focus-visible { text-decoration: underline; }
.block_standard,
.block_mirrorstandard {
  display: flex;
  min-height: var(--iridi-block-min-height);
  color: #000;
}
[data-palette="black"] { background: #000; color: #fff; }
[data-palette="white"] { background: #fff; }
[data-palette="lavender"] { background: #eaeefa; }
[data-palette="gray"] { background: #e8e8e8; }
.block_standard_left,
.block_standard_right,
.block_mirrorstandard_left,
.block_mirrorstandard_right {
  width: 50%;
  min-width: 0;
}
.block_standard_left,
.block_mirrorstandard_right {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.block_standard_left { padding: 100px 5vw 100px 10vw; }
.block_mirrorstandard_right { padding: 100px 10vw 100px 5vw; }
.block_standard_title {
  margin: 0;
  max-width: 100%;
  font-size: var(--iridi-title-font-size);
  font-weight: var(--iridi-title-font-weight);
  line-height: 1.23;
  color: currentColor;
}
.block_standard_desc {
  margin: var(--iridi-desc-margin-top) 0 38px;
  max-width: 100%;
  font-size: var(--iridi-desc-font-size);
  line-height: 1.5;
  color: currentColor;
}
.block_standard_right,
.block_mirrorstandard_left {
  position: relative;
  background-image: var(--section-image);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
#solution-05 .block_mirrorstandard_left { background-position: right center; }
#solution-05 .block_mirrorstandard_left img { object-position: right center; }
.block_standard_right img,
.block_mirrorstandard_left img {
  position: absolute;
  width: 1px;
  height: 1px;
  visibility: hidden;
}
[data-more] {
  display: inline-flex;
  gap: 20px;
  align-items: center;
  align-self: flex-end;
  margin-top: auto;
  color: currentColor;
  text-decoration: none;
  font-size: 24px;
  line-height: 40px;
}
[data-more] img { display: block; flex: none; width: 40px; height: 40px; }
[data-more]:hover,
[data-more]:focus-visible { text-decoration: underline; }
@media (min-width: 2251px) {
  :root {
    --iridi-block-min-height: 930px;
    --iridi-title-font-size: 60px;
    --iridi-desc-font-size: 28px;
    --iridi-desc-margin-top: 50px;
  }
  .block_standard_left { padding: 120px 5vw 120px 10vw; }
  .block_mirrorstandard_right { padding: 120px 10vw 120px 5vw; }
}
@media (max-width: 1600px) {
  :root { --iridi-block-min-height: 670px; --iridi-title-font-size: 40px; }
  #solutions-hero h1 { font-size: 52px; }
  #solutions-hero > p { font-size: 34px; }
}
@media (max-width: 1300px) {
  :root { --iridi-block-min-height: 520px; --iridi-desc-font-size: 18px; }
  .block_standard_left { padding: 60px 5vw 60px 10vw; }
  .block_mirrorstandard_right { padding: 60px 10vw 60px 5vw; }
  #solutions-hero { min-height: 590px; padding-top: 110px; padding-bottom: 70px; }
  #solutions-hero nav a { font-size: 18px; }
}
@media (max-width: 1000px) {
  :root { --iridi-block-min-height: 0px; --iridi-title-font-size: 32px; --iridi-desc-margin-top: 30px; }
  .block_standard { flex-direction: column; }
  .block_mirrorstandard { flex-direction: column-reverse; }
  .block_standard_left,
  .block_standard_right,
  .block_mirrorstandard_left,
  .block_mirrorstandard_right { width: 100%; }
  .block_standard_left,
  .block_mirrorstandard_right { padding: 50px 10vw 30px; }
  .block_standard_desc { margin-bottom: 30px; }
  .block_standard_right,
  .block_mirrorstandard_left { background-image: none; }
  .block_standard_right img,
  .block_mirrorstandard_left img {
    display: block;
    position: static;
    width: 100%;
    height: auto;
    aspect-ratio: 6 / 5;
    object-fit: cover;
    visibility: visible;
  }
  #solutions-hero { min-height: 520px; padding: 100px 6vw 46px; }
  #solutions-hero h1 { font-size: 44px; }
  #solutions-hero > p { font-size: 27px; }
  #solutions-hero nav { gap: 8px 18px; }
  #solutions-hero nav a { font-size: 16px; }
}
@media (max-width: 700px) {
  :root { --iridi-title-font-size: 24px; --iridi-desc-font-size: 16px; --iridi-desc-margin-top: 20px; }
  #solutions-hero h1 { font-size: 36px; }
  #solutions-hero > p { font-size: 22px; }
}
@media (max-width: 500px) {
  .block_standard_left,
  .block_mirrorstandard_right { padding: 30px 10vw; }
  .block_standard_desc { line-height: 1.45; }
  [data-more] { font-size: 18px; }
  [data-more] img { width: 34px; height: 34px; }
  #solutions-hero { min-height: 490px; padding: 80px 6vw 36px; }
  #solutions-hero nav { gap: 5px 11px; }
  #solutions-hero nav a { font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}
section[id^="solution-"] { scroll-margin-top: 70px; }
@media (max-width: 500px) {
  #solutions-hero { min-height: 520px; }
  #solutions-hero nav a { font-size: 14px; }
}