/**
 * Foldable and compact-tablet viewport corrections.
 *
 * Component base styles stay in their own files. This module only corrects
 * the 561-920px layout range where a wide but short viewport otherwise pushes
 * carousel controls and lower business copy outside the first visible screen.
 */

@media (min-width: 561px) and (max-width: 920px) {
  .gy-carousel,
  .gy-nav-hybrid .gy-carousel,
  .logged-in .gy-carousel,
  .logged-in.gy-nav-hybrid .gy-carousel {
    height: 100vh;
    min-height: 100vh;
  }

  @supports (height: 100svh) {
    .gy-carousel,
    .gy-nav-hybrid .gy-carousel,
    .logged-in .gy-carousel,
    .logged-in.gy-nav-hybrid .gy-carousel {
      height: 100svh;
      min-height: 100svh;
    }
  }

  .gy-carousel__slide .gy-hero__copy {
    bottom: clamp(112px, 16vh, 138px);
  }

  .gy-carousel__controls {
    bottom: clamp(14px, 2.5vh, 24px);
  }

  .gy-carousel__tabs button { min-height: 44px; }

  .logged-in .gy-carousel__slide .gy-hero__copy {
    bottom: clamp(164px, 24vh, 196px);
  }

  .logged-in .gy-carousel__controls {
    bottom: clamp(92px, 15vh, 112px);
  }

  :is(.gy-poultry-story__panel, .gy-solar-story__status, .gy-house-story__panel) {
    width: calc(100% - 80px);
    max-width: 460px;
  }

  .gy-poultry-story__panel,
  .gy-house-story__panel,
  body.logged-in .gy-poultry-story__panel,
  body.logged-in .gy-house-story__panel {
    top: clamp(250px, 48vh, 370px);
    bottom: auto;
  }

  .gy-solar-story__status,
  body.logged-in .gy-solar-story__status {
    top: clamp(96px, 16vh, 148px);
    bottom: auto;
  }
}

@media (min-width: 561px) and (max-width: 760px) and (max-height: 620px) {
  .gy-carousel__slide .gy-hero__copy {
    bottom: 102px;
  }

  .gy-carousel__slide .gy-hero__description {
    max-width: 560px;
    margin-top: 16px;
    line-height: 1.58;
  }

  .gy-carousel__slide .gy-hero__actions { margin-top: 18px; }
}