/* Mobilné rozloženie pravého panelu v sekcii Informácie pre rodičov. */
@media (max-width: 640px) {
  .parents .safety-panel {
    /* Ručné nastavenie celkovej výšky mobilného panelu. */
    --safety-mobile-height: clamp(390px, 112vw, 430px);

    height: var(--safety-mobile-height);
    min-height: var(--safety-mobile-height);
    aspect-ratio: auto;
  }

  .parents .safety-panel::before {
    top: -2%;
    bottom: -1%;
  }

  .parents .safety-panel > h2 {
    /* Ručné nastavenie polohy mobilného nadpisu. */
    top: 22px;
    left: 22px;
    right: 58px;
    font-size: clamp(1.15rem, 5.2vw, 1.4rem);
    line-height: 1.08;
  }

  .parents .safety-panel > p {
    /* Ručné nastavenie polohy a šírky mobilného odseku. */
    top: 86px;
    left: 22px;
    right: 58px;
    width: auto;
    font-size: clamp(0.72rem, 3vw, 0.82rem);
    line-height: 1.32;
  }

  .parents .safety-features {
    --safety-labels-left: 0%;
    --safety-labels-width: 75%;
    --safety-labels-bottom: 18px;
    --safety-label-1-x: 12px;
    --safety-label-2-x: 6px;
    --safety-label-3-x: -1px;

    gap: 2px;
  }

  .parents .safety-features span {
    min-height: 2.3em;
    padding-inline: 1px;
    font-size: clamp(0.68rem, 3.15vw, 0.78rem);
    line-height: 1.08;
  }
}

@media (max-width: 400px) {
  .parents .safety-panel {
    --safety-mobile-height: clamp(400px, 116vw, 420px);
  }

  .parents .safety-panel > h2 {
    top: 20px;
    left: 20px;
    right: 50px;
    font-size: clamp(1.1rem, 5.5vw, 1.28rem);
  }

  .parents .safety-panel > p {
    top: 82px;
    left: 20px;
    right: 50px;
    font-size: clamp(0.69rem, 3.2vw, 0.76rem);
    line-height: 1.28;
  }

  .parents .safety-features {
    --safety-labels-bottom: 14px;
    --safety-label-1-x: 10px;
    --safety-label-2-x: 4px;
    --safety-label-3-x: -1px;
  }

  .parents .safety-features span {
    font-size: clamp(0.64rem, 3.25vw, 0.72rem);
    line-height: 1.08;
  }
}
