:root {
  color-scheme: light;
  color: #203c2c;
  background: #efecdf;
  font-family: "Courier New", Courier, monospace;
}
* { box-sizing: border-box; }
body { margin: 0; min-height: 100svh; display: flex; flex-direction: column; }
header, footer { display: flex; align-items: center; justify-content: space-between; padding: 30px 5vw; }
.wordmark { display: flex; align-items: center; color: inherit; text-decoration: none; font-size: 24px; letter-spacing: -1px; font-weight: bold; }
.wordmark span { font-weight: normal; }
.wordmark svg { width: 30px; height: 30px; margin-right: 12px; }
.address, footer { font-size: 11px; }
main { flex: 1; display: grid; grid-template-columns: 1fr 1fr; align-items: center; width: 100%; padding: 0 8vw; }
.intro { padding: 40px 0; position: relative; z-index: 1; }
h1 { font-size: clamp(36px, 4.5vw, 70px); line-height: 1.1; letter-spacing: -3px; margin: 0 0 28px; font-weight: normal; }
p { font-size: 14px; line-height: 1.8; margin: 0; }
.plant { margin: 0; height: min(70vh, 760px); width: 100%; display: flex; justify-content: center; align-items: center; }
.plant img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: darken; }
footer { padding-top: 22px; padding-bottom: 22px; }
@media (min-width: 1600px) { main { padding-left: 14vw; padding-right: 14vw; } }
@media (max-width: 700px) {
  header { padding: 24px 7vw; }
  .address { display: none; }
  main { grid-template-columns: 1fr; padding: 0 7vw; }
  .intro { padding: 30px 0 12px; }
  h1 { font-size: clamp(36px, 8vw, 54px); letter-spacing: -2px; margin-bottom: 20px; }
  .plant { height: 44svh; min-height: 260px; margin: 8px 0 10px; }
  footer { padding: 20px 7vw; }
}