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

html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  scroll-behavior: smooth; }

body,
blockquote {
  margin: 0; }

a:active,
a:hover {
  outline: 0; }

h1,
h2,
h3,
h4,
h5,
p,
pre {
  margin: 0; }

img,
svg {
  border: 0;
  display: block;
  margin: 0;
  max-width: 100%; }

input,
textarea,
select,
button {
  background-color: transparent;
  border: 0;
  color: currentColor;
  display: block;
  margin: 0;
  outline: none;
  padding: 0;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  -moz-appearance: none;
  -webkit-appearance: none; }
  input:disabled::placeholder,
  textarea:disabled::placeholder,
  select:disabled::placeholder,
  button:disabled::placeholder {
    -webkit-text-fill-color: currentcolor;
    opacity: 1; }

textarea {
  resize: none; }

select {
  border-radius: 0; }

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
  cursor: pointer; }

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0; }

datalist {
  border: none;
  background-color: white;
  font-family: inherit;
  font-size: inherit;
  padding: 0; }
  datalist option {
    cursor: pointer;
    font-family: inherit;
    font-size: inherit; }

ul,
ol {
  margin: 0;
  padding: 0; }

*:focus {
  outline: 0; }

menu {
  margin: 0;
  padding: 0; }
  menu li {
    list-style: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

form,
figure,
fieldset {
  margin: 0; }

fieldset {
  border: 0;
  padding: 0; }

:root {
  --primary: #00AA50;
  --secondary: #D7D2C3;
  --beige-bg: hsla(45deg, 20%, 80%, .4);
  --line: hsl(45deg, 20%, 93%); }

body {
  font: normal normal 1em/1.5 'Inter', sans-serif; }

main {
  min-height: calc(100vh - 7em); }

.bg {
  position: fixed;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  height: 120vh;
  display: grid;
  gap: 1px;
  grid-template-columns: repeat(6, 1fr);
  z-index: -10;
  pointer-events: none; }
  @media (max-width: 960px) {
    .bg {
      grid-template-columns: 1.4375em 1fr 1fr 1.4375em; }
      .bg span:nth-child(1) {
        box-shadow: 1px 0 0 var(--line); }
      .bg span:nth-child(2) {
        box-shadow: 1px 0 0 var(--line); }
      .bg span:nth-child(3) {
        box-shadow: 1px 0 0 var(--line); } }
  @media (min-width: 960px) {
    .bg span:nth-child(1) {
      box-shadow: 1px 0 0 var(--line), -1px 0 0 var(--line);
      grid-column: 2; }
    .bg span:nth-child(2) {
      box-shadow: 1px 0 0 var(--line), -1px 0 0 var(--line);
      grid-column: 4; }
    .bg span:nth-child(3) {
      box-shadow: -1px 0 0 var(--line);
      grid-column: 6; } }
h1,
h2,
h3,
h4 {
  font-weight: 900; }

h1 {
  font-size: 1.875em;
  line-height: 1.1;
  margin-bottom: .25em; }
  @media (min-width: 960px) {
    h1 {
      font-size: 2.5em; } }
h2 {
  font-size: 1.5em;
  line-height: 1.2;
  margin-bottom: .25em; }
  @media (min-width: 960px) {
    h2 {
      font-size: 1.875em; } }
h3 {
  font-size: 1em; }

.text-m {
  font-size: 1.125em; }
  @media (min-width: 960px) {
    .text-m {
      font-size: 1.25em; } }
small {
  font-size: 0.875em; }

a {
  color: currentColor;
  text-decoration: none; }

.opacity {
  opacity: .65; }

.noimage {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  color: white; }
  .noimage .icon {
    height: 5em;
    width: 5em; }

.icon {
  height: 1.5em;
  width: 1.5em; }
  .icon svg {
    fill: currentColor; }

.media {
  background: var(--beige-bg); }
  .media img {
    aspect-ratio: inherit;
    height: 100%;
    object-fit: cover;
    width: 100%; }

.bg {
  margin-left: auto;
  margin-right: auto; }

.site-logo {
  background: white;
  display: flex; }
  .site-logo a {
    display: flex; }
  .site-logo svg {
    margin: auto 0;
    width: 100%;
    max-width: 11em; }

.site-nav {
  z-index: 900; }
  .site-nav input {
    display: none; }
    .site-nav input:checked ~ label {
      color: gray; }
  .site-nav menu a {
    display: block; }
  .site-nav .label {
    display: flex;
    justify-content: space-between; }
    .site-nav .label select {
      font-size: 1.25em;
      line-height: 2.8em; }
  .site-nav label {
    align-items: center;
    font-size: 1.25em;
    display: flex;
    justify-content: right;
    gap: .375em; }

section.products menu {
  background: white;
  position: sticky;
  top: 5em;
  z-index: 1; }
  section.products menu ul {
    font-weight: bold;
    display: flex;
    overflow: hidden;
    overflow-x: auto;
    white-space: nowrap; }
    section.products menu ul li {
      color: var(--primary);
      padding: 0 1.5em;
      list-style: none;
      line-height: 3.5rem;
      cursor: pointer; }
      section.products menu ul li:hover {
        background: var(--beige-bg); }
      section.products menu ul li.active {
        background: black;
        color: white; }

section.products figure {
  opacity: 0;
  visibility: hidden;
  max-height: 0;
  overflow: hidden; }
  section.products figure.is-visible {
    opacity: 1;
    visibility: visible;
    max-height: none;
    overflow: visible; }

section.products footer {
  background: white;
  padding: 1em; }
  section.products footer:empty {
    padding: 0; }

@media (min-width: 1440px) {
  .site-nav,
  .page-header,
  main,
  .contactform,
  .site-footer,
  .bg {
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto; } }

@media (max-width: 960px) {
  .site-nav {
    background: white;
    border-top: thin solid var(--secondary);
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    display: flex;
    justify-content: space-between; }
    .site-nav input:checked ~ menu {
      opacity: 1;
      visibility: visible; }
    .site-nav label {
      line-height: 2.8em;
      padding: 0 1em; }
    .site-nav .site-logo {
      padding-left: 1em; }
      .site-nav .site-logo svg {
        width: 10em; }
    .site-nav menu {
      background: rgba(255, 255, 255, 0.85);
      -webkit-backdrop-filter: blur(1em);
      backdrop-filter: blur(1em);
      display: flex;
      flex-direction: column-reverse;
      position: absolute;
      justify-content: end;
      padding: 0 1em;
      bottom: 3em;
      height: 100vh;
      left: 0;
      width: 100%;
      opacity: 0;
      visibility: hidden;
      transition: all 300ms; }
      .site-nav menu ul {
        padding: 1em 0; }
      .site-nav menu a {
        font-size: 1.25em;
        line-height: 2.2em;
        display: block;
        text-align: right; }
      .site-nav menu .menu a {
        font-weight: 900;
        font-size: 1.5em;
        line-height: 2em; }
      .site-nav menu .submenu {
        display: flex;
        flex-wrap: wrap;
        border-bottom: thin solid var(--secondary); }
        .site-nav menu .submenu > * {
          flex: 0 0 50%; }
  .page-header .media {
    aspect-ratio: 4 / 5; }
  .page-header figcaption {
    padding: 1.5em; }
  .home .page-header h1 {
    font-size: 2.5em;
    line-height: 1; }
  .columns {
    background: var(--beige-bg);
    padding: .75em 1.5em; }
    .columns > * {
      display: block;
      padding: .75em 0; }
      .columns > * + * {
        border-top: thin solid var(--secondary); }
  .section {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1px; }
    .section header {
      grid-column-end: span 2;
      padding: 1.5em 1.5em .75em; }
    .section .media {
      aspect-ratio: 1 / 1; }
    .section figcaption {
      padding-bottom: .5em; }
  section.products header {
    background: var(--beige-bg);
    padding: 1.5em; }
  section.products menu {
    top: 0; }
  section.products figcaption {
    background: white;
    padding: 1em 1em 1.5em; }
  section.products figure {
    position: relative; }
    section.products figure .profile {
      box-shadow: 0 0 0 1px white;
      position: absolute;
      top: 0;
      right: 0;
      width: calc(100% / 3); } }

.section a {
  display: flex;
  gap: .25em;
  justify-content: space-between;
  padding: .75em .75em 1.5em 1em; }
  .section a .icon {
    color: var(--primary); }

.section figcaption .url {
  font-size: 12px;
  display: block;
  width: 100%;
  color: blue; }

article.article .article-content {
  background: rgba(255, 255, 255, 0.5);
  padding: 1.5em; }
  article.article .article-content > *,
  article.article .article-content .edy-texteditor-view > * {
    margin-bottom: .75em; }
  article.article .article-content h3 {
    font-size: 1.125em; }
  article.article .article-content ul,
  article.article .article-content ol {
    margin-left: 1.5em; }
  article.article .article-content li + li {
    margin-top: .5em; }
  article.article .article-content iframe[src*="youtube"] {
    aspect-ratio: 16 / 9;
    margin-left: -1.5em;
    margin-right: -1.5em;
    max-width: calc(100% + 3em) !important;
    width: calc(100% + 3em) !important;
    height: auto !important; }

.people {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  margin: 3em -1.5em;
  min-width: 1px; }
  .people .person {
    margin-bottom: 3em; }
  @media (min-width: 960px) {
    .people {
      grid-template-columns: repeat(4, 1fr); } }
.person {
  display: flex;
  flex-direction: column;
  min-width: 1px; }
  .person .media img {
    aspect-ratio: 1 / 1; }
  .person .avatar {
    aspect-ratio: 1 / 1;
    background-color: var(--beige-bg);
    display: flex; }
    .person .avatar .icon {
      color: white;
      margin: auto;
      height: 5em;
      width: 5em; }
  .person figcaption {
    flex: 1 0 0%;
    display: flex;
    flex-direction: column;
    padding: 1em 1.5em 0; }
  .person p {
    margin-bottom: .5em; }
  @media (max-width: 960px) {
    .person {
      overflow: hidden; }
      .person figcaption {
        padding-left: 1em;
        padding-right: 1em; } }
html.public .contactform.false {
  display: none; }

.contactform {
  padding: 3em 0; }
  .contactform-wrapper {
    background: var(--beige-bg);
    margin-top: 5em;
    position: relative; }
  .contactform-visibility {
    font-weight: bold;
    padding: 1em;
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    gap: .5em; }
    .contactform-visibility input ~ label:before {
      content: 'Is Hidden'; }
    .contactform-visibility input:checked ~ label:before {
      content: 'Is Visible'; }
  .contactform label {
    display: block;
    opacity: .65;
    padding: 1em 1.5em; }
  .contactform input[type="text"],
  .contactform input[type="email"],
  .contactform textarea {
    background: white;
    padding: 1em;
    margin-bottom: .25em;
    width: 100%; }
  .contactform input[type="submit"] {
    background: black;
    color: white;
    margin-top: 1.5em;
    padding: 1em;
    width: 100%; }
  .contactform h2 {
    color: var(--primary); }
  .contactform .form_notice,
  .contactform .form_error {
    padding: 1.5em;
    text-align: center; }
  .contactform .form_field_error {
    font-size: 0.875em;
    grid-column: 2;
    padding-bottom: 0.5714285714em; }
  @media (max-width: 960px) {
    .contactform header {
      padding: 0 1.5em 1.5em; }
    .contactform .form_field {
      padding: 0 1.5em; }
    .contactform label {
      padding-left: 0;
      padding-bottom: 0;
      display: none; }
    .contactform .person {
      display: none; }
    .contactform .form_submit {
      padding: 0 1.5em; } }
  @media (min-width: 960px) {
    .contactform {
      display: grid;
      grid-template-columns: repeat(12, 1fr);
      gap: 1px; }
      .contactform header {
        grid-column: 3 / span 8;
        padding: 0 1.5em 2em; }
      .contactform .person {
        grid-column: 3 / span 2; }
      .contactform .form {
        grid-column: 5 / span 6; }
      .contactform label {
        font-weight: bold;
        text-align: right; }
      .contactform input::placeholder,
      .contactform textarea::placeholder {
        color: white; }
      .contactform input::-ms-input-placeholder,
      .contactform textarea::-ms-input-placeholder {
        color: white; }
      .contactform input::-ms-input-placeholder,
      .contactform textarea::-ms-input-placeholder {
        color: white; }
      .contactform .form_field,
      .contactform .form_submit {
        display: grid;
        grid-template-columns: 1fr 2fr; } }
@media (min-width: 960px) {
  .site-nav {
    background: var(--line);
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 1px;
    grid-template-rows: auto 0px;
    position: sticky;
    top: 0; }
    .site-nav:after {
      content: '';
      display: block;
      left: 50%;
      height: 1px;
      width: 100vw;
      bottom: 0;
      position: absolute;
      transform: translateX(-50%);
      background: var(--secondary); }
    .site-nav input:checked ~ menu .submenu {
      opacity: 1;
      visibility: visible; }
    .site-nav > * {
      grid-row: 1; }
    .site-nav .site-logo {
      grid-column: 1 / span 4;
      padding-left: 1.5em; }
      .site-nav .site-logo a {
        margin: auto 0; }
    .site-nav menu {
      grid-column: 5 / span 8;
      position: relative; }
      .site-nav menu ul {
        position: relative;
        z-index: 1; }
      .site-nav menu li {
        min-height: 3.5em; }
      .site-nav menu .menu {
        display: grid;
        gap: 1px;
        grid-template-columns: repeat(4, 1fr); }
        .site-nav menu .menu li {
          background: white;
          flex: 1; }
        .site-nav menu .menu a {
          padding-left: 1.2em;
          font-weight: 900;
          line-height: 4em; }
          .site-nav menu .menu a:hover {
            color: var(--primary); }
      .site-nav menu .submenu {
        background: white;
        box-shadow: 10em 0 white;
        border-left: thin solid var(--line);
        width: 25%;
        opacity: 0;
        min-height: 100vh;
        position: absolute;
        top: 100%;
        right: 0;
        padding-bottom: 1em;
        transition: all 300ms;
        visibility: hidden; }
        .site-nav menu .submenu a {
          text-align: right;
          padding-right: 1.2em; }
          .site-nav menu .submenu a:hover {
            color: var(--primary); }
    .site-nav a,
    .site-nav label {
      font-size: 1.25em;
      line-height: 2.8em;
      user-select: none; }
    .site-nav .label {
      background: white;
      grid-column: 11 / span 2;
      padding-left: 1.5em;
      position: relative;
      z-index: 1; }
    .site-nav label {
      line-height: 4em;
      cursor: pointer;
      text-align: right;
      padding-right: 1.2em;
      transition: all 300ms; }
      .site-nav label .icon {
        display: none; }
  .columns {
    border-top: thin solid var(--line);
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    margin-bottom: 1px; }
    .columns > * {
      color: var(--primary);
      overflow: hidden;
      padding: 1.5em 1.5em 5em;
      position: relative; }
      .columns > *:before {
        content: '';
        display: block;
        height: 4em;
        width: 2em;
        background: var(--secondary);
        position: absolute;
        bottom: 0;
        right: 0;
        transform: skewX(-25deg);
        transform-origin: left bottom; }
  .page-header figure {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-template-rows: 1fr; }
    .page-header figure figcaption {
      align-self: end;
      grid-row: 1;
      grid-column: 1 / span 4;
      padding: 2em 1.5em;
      z-index: 1; }
    .page-header figure .media {
      aspect-ratio: 2 / 1;
      grid-row: 1;
      grid-column: 5 / span 8;
      position: relative; }
      .page-header figure .media:after {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        height: 100%;
        width: 100%;
        z-index: 1;
        pointer-events: none;
        background-image: linear-gradient(90deg, rgba(255, 255, 255, 0.65), rgba(255, 255, 255, 0.65) 1px, transparent 1px);
        background-size: 25% 100%; }
  .factory .page-header figcaption {
    grid-column: 1 / span 4; }
    .factory .page-header figcaption h1 {
      max-width: 100%; }
  .section {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 1px;
    border-top: thin solid var(--secondary); }
    .section header {
      grid-column: 1 / span 4;
      grid-row: 1 / span 2;
      padding: 3em 1.5em 1.5em; }
    .section figure {
      grid-column-end: span 2;
      position: relative; }
      .section figure .media {
        aspect-ratio: 1 / 1; }
  article.article {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    margin: 3em 0; }
    article.article .article-content {
      grid-column: 3 / span 8;
      padding: 0 1.5em; }
  section.products {
    border-top: thin solid var(--secondary);
    display: grid;
    grid-template-columns: repeat(12, 1fr); }
    section.products header {
      grid-column: 1 / span 10;
      display: grid;
      gap: 0 3em;
      padding: 0 1.5em;
      grid-template-columns: 2fr 3fr; }
      section.products header .title {
        background: white;
        padding-top: 6em;
        padding-bottom: 1.5em;
        display: flex;
        align-items: flex-end; }
      section.products header .text {
        align-self: end;
        padding-top: 6em;
        padding-bottom: 2.125em; }
    section.products menu {
      box-shadow: inset 0 -1px var(--secondary), 0 -1px var(--secondary);
      grid-row: 2;
      grid-column: 1 / span 12;
      z-index: 2; }
    section.products figure {
      display: grid;
      grid-template-columns: repeat(10, 1fr);
      grid-column: 3 / span 10;
      grid-row: 3;
      position: relative; }
      section.products figure:before {
        content: attr(data-title);
        display: block;
        width: 20%;
        position: absolute;
        top: 3em;
        padding: .5em 1.5em;
        right: 100%;
        opacity: .6;
        z-index: 1; }
      section.products figure .profile {
        grid-column: 1 / span 2;
        grid-row: 1;
        transform: translate3d(-100%, 3em, 0);
        padding-right: 1px; }
      section.products figure .media {
        display: flex;
        grid-column: 1 / span 6;
        grid-row: 1;
        margin-top: 3em;
        min-height: 28em; }
        section.products figure .media img {
          align-self: start;
          height: auto;
          object-fit: contain; }
      section.products figure figcaption {
        background: white;
        padding-top: 3em;
        grid-column: 7 / span 4;
        grid-row: 1; }
        section.products figure figcaption [data-label] {
          padding-left: 1.5em;
          padding-right: 1.5em; }
    section.products footer {
      grid-row: 4;
      grid-column: 3 / span 8;
      padding: 1.5em; } }

.site-footer {
  background: #444; }
  .site-footer-wrapper {
    background: black;
    color: white; }
  .site-footer > * {
    background: black;
    color: var(--secondary);
    padding: 1.5em 0 1.5em 1.5em; }
  .site-footer small {
    opacity: .65; }
  .site-footer strong {
    font-size: 1.5em;
    font-weight: normal; }
  @media (max-width: 960px) {
    .site-footer {
      padding-bottom: 4em; }
      .site-footer > * {
        margin-top: 1px; }
      .site-footer .wide .text + .text {
        margin-top: 1em; } }
  @media (min-width: 960px) {
    .site-footer {
      display: grid;
      gap: 1px;
      grid-template-columns: repeat(6, 1fr); }
      .site-footer .wide {
        grid-column: 1 / span 2;
        grid-row: 1 / span 2;
        padding-right: 1.5em;
        display: flex;
        flex-direction: column;
        gap: 1em;
        justify-content: space-between; }
      .site-footer .serts {
        grid-column-end: span 4; } }
p[data-label],
div[data-label] {
  border-bottom: 1px solid var(--secondary);
  flex-wrap: wrap;
  padding: .5em 0; }
  p[data-label]:before,
  div[data-label]:before {
    content: attr(data-label);
    opacity: .6; }
  p[data-label] div,
  div[data-label] div {
    flex: 1 0 0%; }
  @media (min-width: 960px) {
    p[data-label],
    div[data-label] {
      display: flex;
      text-align: right; } }