/* ===== 02 · Hero + Booking ===== */
.hero { position: relative; padding: 16px var(--hero-inset) 39px; } /* 72px w Figmie minus 33px wystającego booking bara */
.hero__media {
  position: relative; height: 720px; border-radius: var(--r-2xl); overflow: hidden;
  display: flex; flex-direction: column; justify-content: center;
  padding: 40px 40px 120px 64px;
}
.hero__media > img, .hero__media::after { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero__media > img { object-fit: cover; }
.hero__media::after {
  content: "";
  background:
    linear-gradient(180deg, rgba(22,26,29,0) 50%, rgba(22,26,29,.5) 100%),
    linear-gradient(90deg, rgba(22,26,29,.86) 0%, rgba(22,26,29,.35) 55%, rgba(22,26,29,.05) 80%);
}
.hero__content { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 28px; max-width: 780px; }
.hero__title { color: var(--c-text-inverse); }
.hero__lead { color: var(--c-text-inverse); max-width: 560px; }
.hero__cta { display: flex; flex-wrap: wrap; gap: 12px; }

/* booking bar na hero strony głównej: zachodzi na zdjęcie */
.hero .booking { width: min(1120px, calc(100% - 2 * (var(--page-gutter) - var(--hero-inset)))); margin: -64px auto 0; }
@media (max-width: 1024px) {
  .hero__media { height: 620px; padding: 40px 32px 120px; }
}
@media (max-width: 640px) {
  .hero { padding-bottom: 48px; }
  .hero__media { height: 600px; padding: 24px 20px 96px; justify-content: flex-end; }
  .hero__content { gap: 20px; }
}

/* ===== 03 · Kategorie ===== */
.categories { padding: 120px 0 80px; }
.categories .section-head--split { margin-bottom: var(--section-header-gap); }
.categories__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; align-items: start; }
.categories__grid > :nth-child(even) { margin-top: 56px; }

@media (max-width: 1100px) {
  .categories__grid { grid-template-columns: repeat(2, 1fr); }
  .section-head--split { flex-direction: column; align-items: flex-start; gap: 20px; }
}
@media (max-width: 640px) {
  .categories { padding: 72px 0 48px; }
  .categories__grid { grid-template-columns: 1fr; }
  .categories__grid > :nth-child(even) { margin-top: 0; }
  .card-category { height: 420px; }
}

/* ===== 04 · Dlaczego Best Inn ===== */
.why { padding: 48px var(--hero-inset); }
.why__panel {
  background: var(--c-bg-surface); border-radius: var(--r-2xl);
  padding: var(--section-py) 0;
}
.why__layout { display: flex; gap: 96px; align-items: flex-start; }
.why__photo { width: 540px; flex-shrink: 0; height: 700px; border-radius: var(--r-2xl); object-fit: cover; }
.why__content { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 40px; }
.why__content .lead { max-width: 560px; }
.benefit {
  display: flex; align-items: center; gap: 28px; padding: 22px 0;
  border-top: 1px solid var(--c-border-subtle);
}
.benefit__num { width: 48px; flex-shrink: 0; color: var(--c-text-accent); font-size: var(--fs-small); line-height: var(--lh-small); }
.benefit__text { flex: 1; display: flex; align-items: center; gap: 24px; }
.benefit__title { width: 240px; flex-shrink: 0; color: var(--c-primary); font-size: var(--fs-h5); line-height: var(--lh-h5); letter-spacing: var(--ls-h5); font-weight: 500; }
.benefit__desc { flex: 1; font-size: var(--fs-small); line-height: var(--lh-small); }

@media (max-width: 1100px) {
  .why__layout { flex-direction: column; gap: 48px; }
  .why__photo { width: 100%; height: 460px; }
}
@media (max-width: 640px) {
  .why__photo { height: 340px; }
  .benefit { align-items: flex-start; gap: 12px; }
  .benefit__num { width: 28px; padding-top: 2px; }
  .benefit__text { flex-direction: column; align-items: flex-start; gap: 4px; }
  .benefit__title { width: auto; }
}

/* ===== 05 · Karuzela sal ===== */
.spaces { padding: 80px 0; overflow: hidden; }
.spaces .section-head { margin-bottom: var(--section-header-gap); }
.spaces .section-head h2 { max-width: 680px; }
.spaces .section-head .lead { max-width: 560px; }
.spaces__track {
  display: flex; gap: 24px; overflow-x: auto; scroll-snap-type: x mandatory;
  padding-left: max(var(--page-gutter), calc((100vw - var(--container)) / 2));
  padding-right: var(--page-gutter);
  scroll-padding-left: max(var(--page-gutter), calc((100vw - var(--container)) / 2));
  scrollbar-width: none;
}
.spaces__track::-webkit-scrollbar { display: none; }
.carousel-nav { display: flex; justify-content: center; gap: 12px; margin-top: 24px; }
.carousel-arrow {
  width: 52px; height: 52px; display: grid; place-items: center;
  background: var(--c-bg-surface); border: 1px solid var(--c-border-strong); border-radius: var(--r-lg);
  transition: border-color .2s, opacity .2s;
}
.carousel-arrow img { width: 18px; height: 18px; }
.carousel-arrow:hover { border-color: var(--c-primary); }
.carousel-arrow:disabled { opacity: .4; cursor: default; border-color: var(--c-border-strong); }

@media (max-width: 640px) {
  .spaces { padding: 56px 0; }
  .card-space { flex-basis: 86%; padding: 16px; }
  .card-space__media { height: 260px; }
}

/* ===== 06 · Kalkulator ===== */
.calc { padding: 40px var(--hero-inset); }
.calc__panel {
  display: flex; align-items: center; gap: 64px; padding: 64px;
  background: var(--c-bg-accent-subtle); border-radius: var(--r-3xl);
  max-width: 1408px; margin-inline: auto;
}
.calc__intro { width: 460px; flex-shrink: 0; display: flex; flex-direction: column; gap: 28px; }
.calc__steps { display: flex; border-top: 1px solid var(--c-border-strong); border-bottom: 1px solid var(--c-border-strong); }
.step-item { flex: 1; display: flex; flex-direction: column; gap: 4px; padding: 18px 0; }
.step-item__num { font-size: var(--fs-caption); line-height: 1.5; }
.step-item__title { color: var(--c-primary); font-size: var(--fs-label); font-weight: 500; line-height: 1.4; }
.calc__cta { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }

@media (max-width: 1100px) {
  .calc__panel { flex-direction: column; align-items: stretch; padding: 48px 40px; gap: 48px; }
  .calc__intro { width: auto; }
}
@media (max-width: 640px) {
  .calc__panel { padding: 32px 20px; border-radius: var(--r-2xl); }
}

/* ===== 07 · Wesela ===== */
.weddings { padding: 64px 0 160px; }
.weddings__layout { display: flex; align-items: center; gap: 96px; }
.weddings__content { width: 500px; flex-shrink: 0; display: flex; flex-direction: column; gap: 32px; }
.check-list li {
  padding: 14px 0; border-top: 1px solid var(--c-border-subtle);
  color: var(--c-primary); font-size: var(--fs-body); line-height: var(--lh-body);
}
.check-list li:last-child { border-bottom: 1px solid var(--c-border-subtle); }
.weddings__photos { position: relative; flex: 1; min-width: 0; height: 780px; }
.weddings__main { position: absolute; top: 0; right: 0; width: calc(100% - 124px); height: 100%; border-radius: var(--r-2xl); object-fit: cover; }
.weddings__detail {
  position: absolute; left: 0; top: 400px; width: 280px; height: 320px; object-fit: cover;
  border: 8px solid var(--c-bg-page); border-radius: var(--r-xl); box-sizing: border-box;
  box-shadow: 0 2px 6px rgba(23,31,36,.05), 0 24px 48px -8px rgba(23,31,36,.08);
}
@media (max-width: 1100px) {
  .weddings { padding: 48px 0 96px; }
  .weddings__layout { flex-direction: column; align-items: stretch; gap: 56px; }
  .weddings__content { width: auto; }
  .weddings__photos { height: 620px; }
}
@media (max-width: 640px) {
  .weddings__photos { height: 460px; }
  .weddings__main { width: calc(100% - 40px); }
  .weddings__detail { top: auto; bottom: -24px; width: 170px; height: 200px; }
}

/* ===== 08 · Dla firm ===== */
.business { padding: 0 var(--hero-inset); }
.business__panel {
  max-width: 1408px; margin-inline: auto; border-radius: var(--r-2xl);
  background: var(--c-bg-inverse); padding: var(--section-py) 0;
}
.business__inner { display: flex; flex-direction: column; gap: 64px; }
.business__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 40px; }
.business__head h2 { color: var(--c-text-inverse); max-width: 640px; }
.business__head .lead { color: var(--c-text-inverse-muted); max-width: 560px; }
.business__head .cta-row { gap: 12px; flex-shrink: 0; }
.business__main { display: flex; gap: 48px; align-items: flex-start; }
.business__photo { width: 600px; flex-shrink: 0; height: 520px; object-fit: cover; border-radius: var(--r-2xl); }
.business__list { flex: 1; min-width: 0; }
.scenario { display: flex; align-items: center; gap: 24px; padding: 24px 0; border-top: 1px solid var(--c-bg-inverse-elevated); }
.scenario__thumb { width: 132px; height: 100px; flex-shrink: 0; object-fit: cover; border-radius: var(--r-lg); }
.scenario__text { flex: 1; min-width: 0; }
.scenario__title, .scenario__desc { display: block; }
.scenario__title { color: var(--c-text-inverse); font-size: var(--fs-h4); line-height: var(--lh-h4); letter-spacing: var(--ls-h4); font-weight: 500; }
.scenario__desc { margin-top: 6px; color: var(--c-text-inverse-muted); font-size: var(--fs-small); line-height: var(--lh-small); }
.features-dark { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.feature-dark {
  display: flex; align-items: center; gap: 14px; padding: 20px 22px;
  background: var(--c-bg-inverse-elevated); border-radius: var(--r-lg);
  color: var(--c-text-inverse); font-size: var(--fs-label); font-weight: 500; line-height: 1.4;
}
.feature-dark img { width: 20px; height: 20px; flex-shrink: 0; }
@media (max-width: 1100px) {
  .business__head { flex-direction: column; align-items: flex-start; }
  .business__main { flex-direction: column; }
  .business__photo { width: 100%; height: 420px; }
  .features-dark { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .business__inner { gap: 40px; }
  .business__photo { height: 280px; }
  .scenario { align-items: flex-start; gap: 16px; }
  .scenario__thumb { width: 96px; height: 76px; }
  .features-dark { grid-template-columns: 1fr; }
}

/* ===== 09 · Restauracja ===== */
.restaurant { padding: var(--section-py) var(--page-gutter-wide); }
.restaurant__inner { max-width: 1344px; margin-inline: auto; }
.restaurant__head { display: flex; align-items: center; justify-content: space-between; gap: 40px; margin-bottom: var(--section-header-gap); }
.restaurant__head .section-head { max-width: 620px; }
.restaurant__head .cta-row { gap: 12px; }
.restaurant__head .pdf-list { width: 420px; flex-shrink: 0; }
.restaurant__photos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; align-items: start; }
.restaurant__photos img { width: 100%; height: 520px; object-fit: cover; border-radius: var(--r-xl); }
.restaurant__photos img:nth-child(2) { height: 440px; margin-top: 80px; }
@media (max-width: 1100px) {
  .restaurant { padding-inline: var(--page-gutter); }
  .restaurant__head { flex-direction: column; align-items: flex-start; }
  .pdf-list { width: 100%; }
  .restaurant__photos img { height: 380px; }
  .restaurant__photos img:nth-child(2) { height: 320px; margin-top: 60px; }
}
@media (max-width: 640px) {
  .restaurant__photos { grid-template-columns: 1fr 1fr; }
  .restaurant__photos img, .restaurant__photos img:nth-child(2) { height: 220px; margin-top: 0; }
  .restaurant__photos img:first-child { grid-column: 1 / -1; height: 260px; }
}

/* ===== 10 · Wydarzenia ===== */
.events { padding: 0 var(--hero-inset); }
.events__panel { max-width: 1408px; margin-inline: auto; background: var(--c-bg-surface); border-radius: var(--r-2xl); padding: var(--section-py) 0; }
.events__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 40px; margin-bottom: var(--section-header-gap); }
.events__head .lead { max-width: 520px; }
.events__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
@media (max-width: 1100px) {
  .events__grid { grid-template-columns: repeat(2, 1fr); }
  .events__head { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 700px) { .events__grid { grid-template-columns: 1fr; } }

/* ===== 11 · Galeria i opinie ===== */
.gallery { padding: var(--section-py) 0; overflow: hidden; }
.gallery__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; padding-inline: var(--page-gutter-wide); margin-bottom: 40px; }
.gallery__strip { display: flex; gap: 16px; padding-left: var(--page-gutter-wide); overflow-x: auto; scrollbar-width: none; }
.gallery__strip::-webkit-scrollbar { display: none; }
.gallery__strip img { height: 440px; flex-shrink: 0; object-fit: cover; border-radius: var(--r-xl); }
.gallery__strip .w-340 { width: 340px; } .gallery__strip .w-360 { width: 360px; }
.gallery__strip .w-520 { width: 520px; } .gallery__strip .w-540 { width: 540px; }
.review { display: flex; align-items: flex-end; gap: 80px; padding: 64px var(--page-gutter-wide) 0; }
.review__quote { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 16px; margin: 0; }
.review__quote blockquote { margin: 0; max-width: 820px; color: var(--c-primary); font-size: var(--fs-h3); line-height: var(--lh-h3); letter-spacing: var(--ls-h3); font-weight: 500; }
.review__quote figcaption { font-size: var(--fs-small); line-height: var(--lh-small); }
.rating { width: 300px; flex-shrink: 0; height: 106px; display: flex; flex-direction: column; justify-content: center; gap: 4px; padding-left: 24px; border-left: 1px solid var(--c-border-strong); }
.rating__label { font-size: var(--fs-caption); line-height: 1.5; }
.rating__value { color: var(--c-primary); font-size: var(--fs-h4); line-height: var(--lh-h4); letter-spacing: var(--ls-h4); font-weight: 500; }
@media (max-width: 900px) {
  .gallery__head, .gallery__strip, .review { padding-inline: var(--page-gutter); }
  .gallery__strip { padding-right: 0; }
  .gallery__strip img { height: 300px; }
  .gallery__strip .w-340, .gallery__strip .w-360 { width: 240px; }
  .gallery__strip .w-520, .gallery__strip .w-540 { width: 360px; }
  .review { flex-direction: column; align-items: flex-start; gap: 32px; padding-top: 48px; }
  .rating { width: auto; height: auto; padding-block: 8px; }
}

/* ===== 12 · FAQ i zapytanie (layout) ===== */
.faq-inquiry { background: var(--c-bg-accent-subtle); padding: var(--section-py) var(--page-gutter-wide); }
.faq-inquiry__inner { max-width: 1344px; margin-inline: auto; display: flex; gap: 80px; align-items: flex-start; }
.faq { width: 560px; flex-shrink: 0; display: flex; flex-direction: column; gap: 32px; }
@media (max-width: 1100px) {
  .faq-inquiry { padding-inline: var(--page-gutter); }
  .faq-inquiry__inner { flex-direction: column; gap: 56px; }
  .faq { width: 100%; }
}