/* ============================================================
   12 — miejsce
   ============================================================ */

.ai-miejsce__miasto {
  margin: 0 0 4px;
  font-size: 1.1875rem;
  color: var(--ai-heading);
}

.ai-miejsce__obiekt {
  margin: 0 0 4px;
  font-size: clamp(1.5rem, 1.1rem + 1.4vw, 2rem);
  line-height: 1.2;
}

.ai-miejsce__adres {
  margin: 0;
  font-size: 1.0625rem;
  color: var(--ai-heading);
}

.ai-miejsce__lead {
  margin: var(--ai-s6) 0 var(--ai-s5);
  font-size: 1.0625rem;
  line-height: 1.7;
  max-width: var(--ai-miara);
}

/* --- zdjęcie obiektu ----------------------------------------
   Kadr 16:9, żeby wysokość sekcji nie skakała przy podmianie pliku
   przez redaktora. */

.ai-miejsce__foto {
  margin: 0 0 var(--ai-s6);
  overflow: hidden;
  border-radius: 2px;
}
.ai-miejsce__foto img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

/* --- fakty ---------------------------------------------------
   Para etykieta/wartość: <dt> nazywa, <dd> podaje. Lewa krawędź w różu
   wiąże je wizualnie z obietnicą w hero. */

.ai-miejsce__fakty {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--ai-s3);
  margin: 0 0 var(--ai-s6);
}

.ai-fakt {
  padding: 18px 20px;
  background: var(--ai-tint);
  border-left: 3px solid var(--ai-rose);
}
.ai-fakt dt {
  margin-bottom: 10px;
  font-family: var(--ai-font-body);
  font-size: var(--ai-size-label);
  font-weight: 600;
  letter-spacing: var(--ai-ls-label);
  text-transform: uppercase;
  color: var(--ai-rose);
}
.ai-fakt dd {
  margin: 0;
  font-size: .9375rem;
  line-height: 1.5;
  color: var(--ai-heading);
}

/* --- noclegi -------------------------------------------------- */

.ai-miejsce__hotel p { max-width: var(--ai-miara); }

.ai-miejsce__kontakt {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ai-s2) var(--ai-s5);
  margin: 0 0 var(--ai-s3);
  padding: 0;
  list-style: none;
}
.ai-miejsce__kontakt li {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
}
.ai-miejsce__kontakt svg {
  flex: none;
  width: 17px;
  height: 17px;
  stroke: var(--ai-rose);
  fill: none;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.ai-miejsce__kontakt a {
  font-size: var(--ai-size-small);
  font-weight: 500;
  color: var(--ai-heading);
  text-decoration: none;
}
.ai-miejsce__kontakt a:hover { color: var(--ai-rose); }

@media (max-width: 900px) {
  .ai-miejsce__fakty { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .ai-miejsce__fakty { grid-template-columns: 1fr; }
}
