/* V3: pouze CSS poptavky, stavajici HTML i layout paticky zustavaji.
 * Reference: zivy bagry-dily.cz, 4. 11. 2026.
 * Nadpis: .bdcats h2; panel: radius karet kategorii (5px).
 * Pole/popisky: nativni kontakty /kontakty/, .ums_forms_redesign--on.
 * Tlacitka: nativni .btn.btn-primary; velikost pismen textu zachovana.
 * Rozmisteni, fotografie, masky a barevne pozadi prevzaty z V2.
 * Odesilani zustava neaktivni v nezmenenem HTML. Nic nepublikovat.
 */
.bd-footer-poptavka {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  width: 100%;
  min-width: 0;
  overflow: hidden;
  border-radius: 5px;
  background: #e3f1f0;
  color: var(--colors-foregrounds-content-secondary);
  font-family: var(--template-font), sans-serif;
  text-align: start;
  isolation: isolate;
}

.bd-footer-poptavka .bd-footer-poptavka__intro {
  position: relative;
  min-width: 0;
  min-height: 376px;
  overflow: hidden;
}

.bd-footer-poptavka .bd-footer-poptavka__copy {
  position: relative;
  z-index: 1;
  padding: 32px 28px 76px 44px;
}

.bd-footer-poptavka .bd-footer-poptavka__title {
  max-width: 448px;
  margin: 0;
  padding: 0;
  color: var(--color-secondary);
  font-family: var(--template-headings-font), sans-serif;
  font-size: 28px;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: normal;
  overflow-wrap: anywhere;
}

.bd-footer-poptavka .bd-footer-poptavka__title > span {
  display: block;
}

.bd-footer-poptavka .bd-footer-poptavka__description {
  max-width: 384px;
  margin: 20px 0 0;
  font: inherit;
  overflow-wrap: anywhere;
}

.bd-footer-poptavka .bd-footer-poptavka__accent {
  display: block;
  width: 74px;
  height: 6px;
  margin-top: 20px;
  margin-inline-start: 3px;
  border-radius: 16px;
  background: #ffbd00;
}

.bd-footer-poptavka .bd-footer-poptavka__visual {
  position: absolute;
  z-index: 0;
  inset: auto 0 0 auto;
  width: min(68%, 640px);
  aspect-ratio: 1400 / 788;
  transform: translateX(10.2941176%);
  overflow: hidden;
  pointer-events: none;
  -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 18%, #000 88%, transparent 89.5%, transparent 100%);
  mask-image: linear-gradient(to right, transparent 0%, #000 18%, #000 88%, transparent 89.5%, transparent 100%);
}

.bd-footer-poptavka .bd-footer-poptavka__visual::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("Realistick%C3%A9%20rypadlo%20na%20kamenit%C3%A9m%20staveni%C5%A1ti.png");
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: contain;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 4%, #000 100%);
  mask-image: linear-gradient(to bottom, transparent 0%, #000 4%, #000 100%);
}

.bd-footer-poptavka .bd-footer-poptavka__fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 22px;
  align-content: start;
  min-width: 0;
  margin: 0;
  padding: 20px 24px 24px 16px;
}

.bd-footer-poptavka .bd-footer-poptavka__field {
  display: flex;
  flex-direction: column;
  gap: var(--form-groups-gap);
  min-width: 0;
}

.bd-footer-poptavka .bd-footer-poptavka__field--full {
  grid-column: 1 / -1;
}

.bd-footer-poptavka .bd-footer-poptavka__label {
  display: block;
  margin: 0;
  font-size: var(--form-group-labels-font-size);
  font-weight: inherit;
  line-height: var(--form-group-labels-line-height);
}

.bd-footer-poptavka .bd-footer-poptavka__control-wrap {
  position: relative;
  min-width: 0;
}

.bd-footer-poptavka .bd-footer-poptavka__control {
  display: block;
  width: 100%;
  margin: 0;
  padding: var(--form-controls-padding-y) var(--form-controls-padding-x);
  padding-inline-start: calc(24px + var(--form-controls-padding-x) * 2);
  border: var(--form-controls-border-width) var(--form-controls-border-style) var(--colors-forms-border);
  border-radius: var(--form-controls-border-radius);
  background: var(--colors-forms-background);
  color: var(--colors-foregrounds-content-secondary);
  box-shadow: none;
  font: inherit;
  font-size: var(--form-controls-font-size);
  line-height: var(--form-controls-line-height);
}

.bd-footer-poptavka .bd-footer-poptavka__control:focus {
  border-color: var(--colors-forms-activated);
  color: var(--colors-foregrounds-content-primary);
}

.bd-footer-poptavka :is(.bd-footer-poptavka__control:focus-visible, .bd-footer-poptavka__upload:focus-within) {
  box-shadow: 0 0 0 8px var(--colors-focus-secondary);
  outline: 3px solid var(--colors-focus-primary);
  outline-offset: 2px;
}

.bd-footer-poptavka .bd-footer-poptavka__control--message {
  min-height: 80px;
  resize: vertical;
}

.bd-footer-poptavka .bd-footer-poptavka__icon {
  display: inline-block;
  flex: 0 0 auto;
  width: 24px;
  height: 24px;
  background-color: currentColor;
  -webkit-mask-image: var(--bd-footer-poptavka-icon);
  mask-image: var(--bd-footer-poptavka-icon);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}

.bd-footer-poptavka .bd-footer-poptavka__control-wrap > .bd-footer-poptavka__icon {
  position: absolute;
  top: 50%;
  inset-inline-start: var(--form-controls-padding-x);
  transform: translateY(-50%);
  color: var(--colors-foregrounds-icons-primary);
  pointer-events: none;
}

.bd-footer-poptavka .bd-footer-poptavka__control-wrap--message > .bd-footer-poptavka__icon {
  top: var(--form-controls-padding-y);
  transform: none;
}

.bd-footer-poptavka .bd-footer-poptavka__icon--oem {
  --bd-footer-poptavka-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m10 3 1-1h2l1 3 2 1 3-1 2 3-2 2v3l2 2-2 3-3-1-2 1-1 3h-3l-1-3-2-1-3 1-2-3 2-2v-3L2 8l2-3 3 1 2-1z'/%3E%3Ccircle cx='12' cy='11.5' r='3'/%3E%3C/svg%3E");
}

.bd-footer-poptavka .bd-footer-poptavka__icon--machine {
  --bd-footer-poptavka-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='17' width='14' height='4' rx='2'/%3E%3Cpath d='M5 17v-5h6l2 5M9 12l5-9 2 1 3 10M14 4l-1 6 3 5m3-1 3 2-1 4h-5v-3'/%3E%3C/svg%3E");
}

.bd-footer-poptavka .bd-footer-poptavka__icon--contact {
  --bd-footer-poptavka-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='4.5' width='19' height='15' rx='2'/%3E%3Cpath d='m3.5 6 8.5 6.5L20.5 6'/%3E%3C/svg%3E");
}

.bd-footer-poptavka .bd-footer-poptavka__icon--message {
  --bd-footer-poptavka-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 19 3 22v-6a4 4 0 0 1-1-3V7a4 4 0 0 1 4-4h12a4 4 0 0 1 4 4v6a4 4 0 0 1-4 4H9z'/%3E%3C/svg%3E");
}

.bd-footer-poptavka .bd-footer-poptavka__icon--attachment {
  --bd-footer-poptavka-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m8 13 7-7a3 3 0 0 1 4 4L9 20a5 5 0 0 1-7-7L13 2a3 3 0 0 1 4 0M6 15l9-9'/%3E%3C/svg%3E");
}

.bd-footer-poptavka .bd-footer-poptavka__icon--send {
  --bd-footer-poptavka-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m2 10 20-8-7 20-4-8-9-4Zm9 4L22 2M11 14l-1 7 5-5'/%3E%3C/svg%3E");
}

.bd-footer-poptavka .bd-footer-poptavka__actions {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: minmax(0, 0.78fr) minmax(0, 1.22fr);
  gap: 22px;
  min-width: 0;
  margin-top: 6px;
}

.bd-footer-poptavka :is(.bd-footer-poptavka__upload, .bd-footer-poptavka__submit) {
  appearance: none;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 5px 15px;
  border: 1px solid var(--color-primary);
  border-radius: 0;
  font-family: var(--template-headings-font), sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  text-align: center;
  white-space: normal;
  overflow-wrap: anywhere;
}

.bd-footer-poptavka .bd-footer-poptavka__upload {
  position: relative;
  background: var(--colors-surface-primary);
  color: var(--color-primary);
  cursor: pointer;
}

.bd-footer-poptavka .bd-footer-poptavka__file {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  opacity: 0;
  cursor: pointer;
}

.bd-footer-poptavka .bd-footer-poptavka__submit {
  background: var(--color-primary);
  color: var(--colors-foregrounds-content-inverted);
}

.bd-footer-poptavka .bd-footer-poptavka__submit:disabled {
  cursor: not-allowed;
}

.bd-footer-poptavka .bd-footer-poptavka__prototype {
  grid-column: 1 / -1;
  margin: 0;
  font: inherit;
}

@media (max-width: 64rem) {
  .bd-footer-poptavka {
    grid-template-columns: minmax(0, 1fr);
  }

  .bd-footer-poptavka .bd-footer-poptavka__intro {
    min-height: 0;
  }

  .bd-footer-poptavka .bd-footer-poptavka__copy {
    padding: 32px 32px 24px;
  }

  .bd-footer-poptavka .bd-footer-poptavka__description {
    max-width: 544px;
  }

  .bd-footer-poptavka .bd-footer-poptavka__visual {
    position: relative;
    inset: auto;
    width: 100%;
    transform: none;
    -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 8%, #000 92%, transparent 100%);
    mask-image: linear-gradient(to right, transparent 0%, #000 8%, #000 92%, transparent 100%);
  }

  .bd-footer-poptavka .bd-footer-poptavka__fields {
    padding: 16px 32px 28px;
  }
}

@media (max-width: 48rem) {
  .bd-footer-poptavka .bd-footer-poptavka__copy {
    padding: 24px 22px 16px;
  }

  .bd-footer-poptavka .bd-footer-poptavka__description {
    margin-top: 16px;
  }

  .bd-footer-poptavka .bd-footer-poptavka__fields {
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
    padding: 12px 22px 24px;
  }

  .bd-footer-poptavka .bd-footer-poptavka__control--message {
    min-height: 104px;
  }

  .bd-footer-poptavka .bd-footer-poptavka__actions {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
    margin-top: 4px;
  }
}

@media (max-width: 767px) {
  .bd-footer-poptavka .bd-footer-poptavka__title {
    font-size: 23px;
  }
}

@media (max-width: 24rem) {
  .bd-footer-poptavka .bd-footer-poptavka__copy {
    padding-inline: 18px;
  }

  .bd-footer-poptavka .bd-footer-poptavka__fields {
    padding-inline: 18px;
  }
}