/* ===== Szczegóły sali ===== */

/* 02 · Hero sali z galerią */
.room-hero { padding: 32px 0 var(--section-py-compact); }
.room-hero .breadcrumb { margin-bottom: 24px; }
.room-hero__layout { display: flex; gap: 48px; align-items: flex-start; }
.room-gallery { width: 760px; flex-shrink: 0; display: flex; flex-direction: column; gap: 24px; }
.room-gallery__main { width: 100%; height: 500px; object-fit: cover; border-radius: var(--r-2xl); }
.room-gallery__thumbs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.room-gallery__thumbs button { height: 120px; padding: 0; border: 0; border-radius: var(--r-lg); overflow: hidden; background: none; outline-offset: 3px; transition: opacity .2s; }
.room-gallery__thumbs button[aria-pressed="true"] { outline: 2px solid var(--c-secondary); }
.room-gallery__thumbs button:not([aria-pressed="true"]):hover { opacity: .85; }
.room-gallery__thumbs img { width: 100%; height: 100%; object-fit: cover; }
.room-hero__info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 24px; align-items: flex-start; }
.room-params { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; width: 100%; }
.room-param { display: flex; flex-direction: column; gap: 4px; padding: 20px; border: 1px solid var(--c-border-subtle); border-radius: var(--r-xl); background: var(--c-bg-surface); }
.room-param span:first-child { font-size: var(--fs-caption); line-height: 1.5; }
.room-param span:last-child { color: var(--c-primary); font-size: var(--fs-h4); line-height: var(--lh-h4); letter-spacing: var(--ls-h4); font-weight: 500; }

/* 03 · Fakty i wyposażenie */
.room-equipment { padding: 0 var(--hero-inset) 48px; }
.room-equipment__panel { max-width: 1408px; margin-inline: auto; padding: var(--section-py) 0; border-radius: var(--r-2xl); background: var(--c-bg-surface); }

/* 05 · Sala w akcji */
.room-action { padding: var(--section-py) 0; }
.room-action .photo-row { grid-template-columns: repeat(4, 1fr); }
.room-action .photo-card img { height: 308px; }

/* 06 · Do czego polecamy */
.room-recommended { padding: var(--section-py-compact) 0 var(--section-py); }
.room-recommended__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }

/* 07 · Menu i usługi */
.room-services { padding: var(--section-py) 0; }
.room-services__layout { display: flex; align-items: center; gap: 96px; }
.room-services__photo { width: 620px; flex-shrink: 0; height: 480px; object-fit: cover; border-radius: var(--r-2xl); }
.room-services__text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 24px; }
.service-list li { display: flex; align-items: flex-start; gap: 16px; padding: 14px 0; border-top: 1px solid var(--c-border-subtle); }
.service-list img { width: 20px; height: 20px; flex-shrink: 0; }
.service-list strong { display: block; color: var(--c-primary); font-size: var(--fs-label); font-weight: 500; line-height: 1.4; }
.service-list span { display: block; margin-top: 2px; font-size: var(--fs-small); line-height: var(--lh-small); }

/* 08 · Lokalizacja i logistyka */
.room-logistics { padding: var(--section-py-compact) 0 var(--section-py); }

@media (max-width: 1100px) {
  .room-hero__layout, .room-services__layout { flex-direction: column; align-items: stretch; gap: 40px; }
  .room-gallery, .room-services__photo { width: 100%; }
  .room-gallery__main { height: 420px; }
  .room-services__photo { height: 380px; }
  .room-action .photo-row { grid-template-columns: repeat(2, 1fr); }
  .room-recommended__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 700px) {
  .room-hero { padding-top: 20px; }
  .room-gallery__main { height: 260px; }
  .room-gallery__thumbs { gap: 8px; }
  .room-gallery__thumbs button { height: 64px; border-radius: var(--r-sm); }
  .room-params { grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
  .room-param { padding: 14px; }
  .room-param span:last-child { font-size: 18px; }
  .room-action .photo-row, .room-recommended__grid { grid-template-columns: 1fr; }
  .room-recommended__grid .card-category { height: 380px; }
  .room-services__photo { height: 260px; }
}