.quote { justify-content: flex-start; padding-left: clamp(0px, 4vw, 56px); }
.quote blockquote { color: #203b2a; font-size: clamp(1.35rem, 2vw, 1.8rem); }
.footer-brand { align-items: flex-start; }
.footer-brand strong { font-size: clamp(2.4rem, 4vw, 3.7rem); letter-spacing: .12em; }
.footer-brand span { margin-top: .75rem; font-size: .62rem; letter-spacing: .16em; }

/* Selkeä tekstilogo korvaa pyöreän tunnuksen yläpalkissa. */
.brand img {
  width: clamp(190px, 19vw, 275px);
  height: auto;
  max-height: 76px;
  object-fit: contain;
}

.header-tools {
  align-self: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .45rem;
}

.forest-sound {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .2rem .45rem;
  border: 0;
  color: var(--green);
  background: transparent;
  font: 500 .72rem/1.2 Inter, sans-serif;
  cursor: pointer;
  white-space: nowrap;
}

.forest-sound svg { width: 16px; height: 16px; }
.forest-sound[aria-pressed="true"] { color: var(--copper); }
.languages button:disabled { cursor: not-allowed; opacity: .48; }

.hero .hero-copy h1 {
  max-width: 760px;
  font-size: clamp(3.7rem, 6vw, 6.4rem);
  line-height: .94;
  letter-spacing: -.025em;
}

.hero .hero-copy .hero-lead {
  margin: 1.7rem 0 2.5rem;
  font-size: clamp(1.15rem, 1.55vw, 1.4rem);
  line-height: 1.5;
}

.newsletter-join { display: flex; flex-direction: column; align-items: flex-start; }
.newsletter-join strong { font-size: 12px; }
.newsletter-join p { max-width: 540px; margin: 5px 0 14px; font-size: 13px; line-height: 1.5; }
.newsletter-join .button { min-height: 42px; }
.newsletter-join small { margin-top: 9px; color: #5c625d; font-size: 11px; }

.about-section {
  padding: clamp(4.5rem, 8vw, 7.5rem) clamp(1.5rem, 9vw, 9rem);
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: clamp(2.5rem, 7vw, 7rem);
  align-items: start;
  background: #f8f5ee;
}
.about-section h2 {
  max-width: 650px;
  margin: 0;
  color: var(--green);
  font-size: clamp(2.7rem, 5vw, 4.8rem);
  font-weight: 500;
  line-height: .98;
}
.about-copy { max-width: 680px; }
.about-copy p { margin: 0 0 1.1rem; color: #4d554f; font-size: 1rem; line-height: 1.8; }
.about-copy a { display: inline-flex; gap: .8rem; margin-top: .6rem; color: var(--green); font-weight: 600; text-decoration: none; }

.course-card > img { height: 185px; }
.course-card > div { min-height: 220px; padding-top: 22px; }
.course-card .course-status {
  display: inline-block;
  margin: 0 0 .65rem;
  color: var(--copper);
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .09em;
}
.course-card h3 { min-height: 2.25em; font-size: 1.55rem; }
.course-card p { min-height: 4.5em; font-size: .84rem; line-height: 1.55; }
.course-card:nth-child(1) > img { object-position: center 55%; }
.course-card:nth-child(2) > img { object-position: center 42%; }
.course-card:nth-child(3) > img { object-position: center 48%; }
.course-card:nth-child(4) > img { object-position: center 64%; }

/* Vaakasuunnassa suunnitellut kurssikannet näytetään kokonaisina.
   Näin kuviin kuuluvat otsikot pysyvät keskellä eivätkä leikkaudu kortin reunoihin. */
.course-card > img[src*="-vaaka.webp"] {
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: contain;
  object-position: center;
  background: #f7f4ec;
}

@media (max-width: 1100px) {
  .brand img { width: clamp(175px, 25vw, 235px); }
}

@media (max-width: 760px) {
  .site-header { grid-template-columns: minmax(150px, 1fr) auto auto; }
  .brand img { width: min(48vw, 210px); max-height: 58px; }
  .header-tools { order: 2; }
  .menu-button { order: 3; }
  .header-tools .languages { display: none; }
  .forest-sound { font-size: .67rem; padding: .35rem; }
  .forest-sound span { display: none; }
  .forest-sound svg { width: 22px; height: 22px; }
  .hero .hero-copy h1 { max-width: 19rem; font-size: clamp(3.25rem, 14vw, 4.2rem); }
  .hero .hero-copy .hero-lead { max-width: 18rem; margin: 1.4rem 0 2rem; font-size: 1.1rem; }
  .newsletter-join { align-items: stretch; }
  .newsletter-join .button { width: 100%; }
  .about-section { grid-template-columns: 1fr; gap: 2rem; }
}

@media (max-width: 760px) {
  .quote { padding-left: 0; }
}

.mushroom-season-notice {
  padding: 1.4rem clamp(1.5rem, 7vw, 7rem);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  border-top: 1px solid rgba(193, 168, 117, .48);
  background: #f7f3ed;
  color: #2f2f2f;
}
.mushroom-season-notice > div { max-width: 850px; }
.mushroom-season-notice span:first-child { display: block; margin-bottom: .25rem; color: #a66f45; font-size: .72rem; font-weight: 700; letter-spacing: .1em; }
.mushroom-season-notice strong { display: block; color: #071d16; font-family: "Cormorant Garamond", serif; font-size: clamp(1.45rem, 2.4vw, 2rem); font-weight: 600; }
.mushroom-season-notice p { margin: .3rem 0 0; line-height: 1.55; }
.mushroom-season-notice > a { flex: none; color: #071d16; font-weight: 600; text-decoration: none; }
@media (max-width: 760px) {
  .mushroom-season-notice { align-items: flex-start; flex-direction: column; gap: 1rem; }
}