/* ===== Wnętrze page styles ===== */

.wnetrze-page {
  overflow-x: hidden;
}

/* ===== Hero ===== */
.wnetrze-hero {
  background-color: var(--color-mustard);
  position: relative;
  padding-block: var(--space-3xl);
  overflow: hidden;
}

.wnetrze-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(circle at 20% 30%, rgba(59, 36, 23, 0.08) 0 12px, transparent 13px),
    radial-gradient(circle at 80% 70%, rgba(59, 36, 23, 0.08) 0 12px, transparent 13px),
    linear-gradient(45deg, transparent 48%, rgba(59, 36, 23, 0.06) 48%, rgba(59, 36, 23, 0.06) 52%, transparent 52%);
  background-size: 120px 120px, 160px 160px, 80px 80px;
  pointer-events: none;
}

.wnetrze-hero__inner {
  position: relative;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--space-xl);
  align-items: center;
  min-height: 70vh;
}

.wnetrze-hero__content {
  grid-column: 1 / span 5;
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  align-items: flex-start;
  min-width: 0;
}

.wnetrze-hero__label {
  margin-block-end: 0;
}

.wnetrze-hero__title {
  font-size: clamp(2.25rem, 4vw + 0.75rem, 3.5rem);
  line-height: var(--text-h1-leading);
  letter-spacing: var(--text-h1-tracking);
  max-width: 20ch;
  margin-block-end: 0;
}

.wnetrze-hero__lead {
  font-size: var(--text-body-large-size);
  line-height: var(--text-body-large-leading);
  max-width: 68ch;
  margin-block-end: 0;
}

.wnetrze-hero__media {
  grid-column: 6 / span 7;
  min-width: 0;
}

.wnetrze-hero__figure {
  margin: 0;
}

.wnetrze-hero__figure img {
  width: 100%;
  height: auto;
  border: var(--border-structure);
  padding: var(--space-2xs);
  background-color: var(--color-cream);
  display: block;
}

.wnetrze-hero__caption {
  margin-block-start: var(--space-xs);
  text-align: left;
}

/* ===== Philosophy ===== */
.wnetrze-philosophy {
  background-color: var(--color-cream);
}

.wnetrze-philosophy__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--space-xl);
  align-items: start;
}

.wnetrze-philosophy__content {
  grid-column: 1 / span 6;
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  min-width: 0;
}

.wnetrze-philosophy__label {
  margin-block-end: 0;
}

.wnetrze-philosophy__title {
  margin-block-end: 0;
}

.wnetrze-philosophy__text {
  max-width: 68ch;
  margin-block-end: 0;
}

.wnetrze-philosophy__quote {
  background-color: var(--color-warm-white);
  border: var(--border-structure);
  border-inline-start: var(--border-accent);
  padding: var(--space-lg);
  margin-block-start: var(--space-sm);
  max-width: 68ch;
}

.wnetrze-philosophy__quote p {
  font-family: var(--font-heading);
  font-size: var(--text-h4-size);
  line-height: var(--text-h4-leading);
  font-weight: 600;
  color: var(--color-chocolate);
  font-style: normal;
}

.wnetrze-philosophy__media {
  grid-column: 7 / span 6;
  min-width: 0;
  margin-block-start: var(--space-2xl);
}

.wnetrze-philosophy__figure {
  margin: 0;
}

.wnetrze-philosophy__figure img {
  width: 100%;
  height: auto;
  border: var(--border-structure);
  padding: var(--space-2xs);
  background-color: var(--color-cream);
  display: block;
}

.wnetrze-philosophy__caption {
  margin-block-start: var(--space-xs);
}

/* ===== Zones ===== */
.wnetrze-zones {
  background-color: var(--color-teal);
  color: var(--color-cream);
}

.wnetrze-zones__header {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  align-items: flex-start;
  margin-block-end: var(--space-2xl);
}

.wnetrze-zones__label {
  color: var(--color-cream);
  margin-block-end: 0;
}

.wnetrze-zones__label::before {
  background-color: var(--color-cream);
}

.wnetrze-zones__title {
  color: var(--color-cream);
  margin-block-end: 0;
}

.wnetrze-zones__intro {
  max-width: 68ch;
  margin-block-end: 0;
}

.wnetrze-zones__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-xl);
}

.wnetrze-zone-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  min-width: 0;
}

.wnetrze-zone-card__media {
  margin: 0;
  overflow: hidden;
  border: var(--border-structure);
  background-color: var(--color-cream);
}

.wnetrze-zone-card__media img {
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  display: block;
  transition: transform var(--transition-image), filter var(--transition-image);
}

.wnetrze-zone-card:hover .wnetrze-zone-card__media img {
  transform: scale(1.02);
  filter: sepia(0.1) saturate(1.05);
}

.wnetrze-zone-card__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  min-width: 0;
}

.wnetrze-zone-card__title {
  color: var(--color-cream);
  margin-block-end: 0;
}

.wnetrze-zone-card__text {
  max-width: 56ch;
  margin-block-end: 0;
}

/* ===== Details ===== */
.wnetrze-details {
  background-color: var(--color-cream);
}

.wnetrze-details__header {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  align-items: flex-start;
  margin-block-end: var(--space-2xl);
}

.wnetrze-details__label {
  margin-block-end: 0;
}

.wnetrze-details__title {
  margin-block-end: 0;
}

.wnetrze-details__intro {
  max-width: 68ch;
  margin-block-end: 0;
}

.wnetrze-details__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-xl);
}

.wnetrze-detail-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  min-width: 0;
}

.wnetrze-detail-card__media {
  margin: 0;
  border: var(--border-structure);
  padding: var(--space-2xs);
  background-color: var(--color-cream);
}

.wnetrze-detail-card__media img {
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  display: block;
}

.wnetrze-detail-card__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  min-width: 0;
}

.wnetrze-detail-card__title {
  margin-block-end: 0;
}

.wnetrze-detail-card__text {
  max-width: 56ch;
  margin-block-end: 0;
}

/* ===== Gallery ===== */
.wnetrze-gallery {
  background-color: var(--color-muted-pink);
}

.wnetrze-gallery__header {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  align-items: flex-start;
  margin-block-end: var(--space-2xl);
}

.wnetrze-gallery__label {
  margin-block-end: 0;
}

.wnetrze-gallery__title {
  margin-block-end: 0;
}

.wnetrze-gallery__intro {
  max-width: 68ch;
  margin-block-end: 0;
}

.wnetrze-gallery__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--space-lg);
}

.wnetrze-gallery__item {
  margin: 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}

.wnetrze-gallery__item--large {
  grid-column: 1 / span 8;
  grid-row: 1 / span 2;
}

.wnetrze-gallery__item:nth-child(2) {
  grid-column: 9 / span 4;
  grid-row: 1;
}

.wnetrze-gallery__item:nth-child(3) {
  grid-column: 9 / span 4;
  grid-row: 2;
}

.wnetrze-gallery__link {
  display: block;
  border: var(--border-structure);
  padding: var(--space-2xs);
  background-color: var(--color-cream);
  overflow: hidden;
  text-decoration: none;
}

.wnetrze-gallery__link img {
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  display: block;
  transition: transform var(--transition-image), filter var(--transition-image);
}

.wnetrze-gallery__item--large .wnetrze-gallery__link img {
  aspect-ratio: 4 / 3;
}

.wnetrze-gallery__link:hover img {
  transform: scale(1.02);
  filter: sepia(0.1) saturate(1.05);
}

.wnetrze-gallery__caption {
  margin-block-start: 0;
}

/* ===== Inspirations ===== */
.wnetrze-inspirations {
  background-color: var(--color-mustard);
  color: var(--color-chocolate);
}

.wnetrze-inspirations__header {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  align-items: flex-start;
  margin-block-end: var(--space-2xl);
}

.wnetrze-inspirations__label {
  margin-block-end: 0;
}

.wnetrze-inspirations__title {
  margin-block-end: 0;
}

.wnetrze-inspirations__intro {
  max-width: 68ch;
  margin-block-end: 0;
}

.wnetrze-inspirations__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-xl);
}

.wnetrze-inspiration-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  min-width: 0;
}

.wnetrze-inspiration-card__media {
  margin: 0;
  border: var(--border-structure);
  padding: var(--space-2xs);
  background-color: var(--color-cream);
}

.wnetrze-inspiration-card__media img {
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  display: block;
}

.wnetrze-inspiration-card__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  min-width: 0;
}

.wnetrze-inspiration-card__title {
  margin-block-end: 0;
}

.wnetrze-inspiration-card__text {
  max-width: 56ch;
  margin-block-end: 0;
}

/* ===== Testimonials ===== */
.wnetrze-testimonials {
  background-color: var(--color-deep-teal);
  color: var(--color-cream);
}

.wnetrze-testimonials__header {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  align-items: flex-start;
  margin-block-end: var(--space-2xl);
}

.wnetrze-testimonials__label {
  color: var(--color-cream);
  margin-block-end: 0;
}

.wnetrze-testimonials__label::before {
  background-color: var(--color-cream);
}

.wnetrze-testimonials__title {
  color: var(--color-cream);
  margin-block-end: 0;
}

.wnetrze-testimonials__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-xl);
}

.wnetrze-testimonial {
  background-color: var(--color-warm-white);
  border: var(--border-structure);
  border-inline-start: var(--border-accent);
  padding: var(--space-lg);
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  min-width: 0;
}

.wnetrze-testimonial__text {
  font-style: italic;
  color: var(--color-chocolate);
  max-width: 56ch;
  margin-block-end: 0;
}

.wnetrze-testimonial__author {
  font-size: var(--text-small-size);
  font-weight: 600;
  letter-spacing: var(--text-small-tracking);
  color: var(--color-ink-soft);
}

/* ===== Invitation ===== */
.wnetrze-invitation {
  background-color: var(--color-chocolate);
  color: var(--color-cream);
  text-align: center;
}

.wnetrze-invitation__content {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  align-items: center;
  max-width: 720px;
  margin-inline: auto;
}

.wnetrze-invitation__label {
  color: var(--color-cream);
  margin-block-end: 0;
}

.wnetrze-invitation__label::before {
  background-color: var(--color-cream);
}

.wnetrze-invitation__title {
  color: var(--color-cream);
  margin-block-end: 0;
}

.wnetrze-invitation__text {
  max-width: 68ch;
  margin-block-end: 0;
}

.wnetrze-invitation__contact {
  margin-block-end: 0;
}

.wnetrze-invitation__contact a {
  color: var(--color-cream);
  text-decoration-color: var(--color-cream);
}

.wnetrze-invitation__contact a:hover {
  color: var(--color-mustard);
  text-decoration-color: var(--color-mustard);
}

.wnetrze-invitation__btn {
  margin-block-start: var(--space-sm);
}

/* ===== Lightbox ===== */
.wnetrze-lightbox {
  position: fixed;
  inset: 0;
  z-index: 2000;
  background-color: rgba(59, 36, 23, 0.92);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-lg);
}

.wnetrze-lightbox[hidden] {
  display: none;
}

.wnetrze-lightbox__inner {
  position: relative;
  max-width: min(1100px, 100%);
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  align-items: center;
}

.wnetrze-lightbox__media {
  max-width: 100%;
  max-height: 80vh;
  width: auto;
  height: auto;
  display: block;
  border: var(--border-structure);
  background-color: var(--color-cream);
  padding: var(--space-2xs);
}

.wnetrze-lightbox__title {
  color: var(--color-cream);
  font-size: var(--text-body-size);
  font-weight: 500;
  text-align: center;
  margin: 0;
}

.wnetrze-lightbox__close,
.wnetrze-lightbox__prev,
.wnetrze-lightbox__next {
  position: absolute;
  background-color: var(--color-mustard);
  color: var(--color-chocolate);
  border: var(--border-emphasis);
  border-radius: var(--radius-round);
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  line-height: 1;
  cursor: pointer;
  transition: transform var(--transition-fast), box-shadow var(--transition-fast);
}

.wnetrze-lightbox__close:hover,
.wnetrze-lightbox__prev:hover,
.wnetrze-lightbox__next:hover {
  box-shadow: var(--shadow-hard);
}

.wnetrze-lightbox__close:active,
.wnetrze-lightbox__prev:active,
.wnetrze-lightbox__next:active {
  transform: translate(2px, 2px);
  box-shadow: var(--shadow-hard-active);
}

.wnetrze-lightbox__close {
  top: 0;
  right: 0;
}

.wnetrze-lightbox__prev {
  left: var(--space-md);
  top: 50%;
  transform: translateY(-50%);
}

.wnetrze-lightbox__next {
  right: var(--space-md);
  top: 50%;
  transform: translateY(-50%);
}

.wnetrze-lightbox__prev:active,
.wnetrze-lightbox__next:active {
  transform: translateY(-50%) translate(2px, 2px);
}

/* ===== Scroll reveal ===== */
.wnetrze-reveal {
  opacity: 0;
  transform: translateY(12px);
  transition: opacity var(--transition-scroll), transform var(--transition-scroll);
}

.wnetrze-reveal.wnetrze-reveal--visible {
  opacity: 1;
  transform: translateY(0);
}

/* ===== Responsive ===== */
@media (max-width: 1023px) {
  .wnetrze-hero__inner {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: var(--space-lg);
  }

  .wnetrze-hero__content {
    grid-column: 1 / span 6;
  }

  .wnetrze-hero__media {
    grid-column: 1 / span 6;
  }

  .wnetrze-philosophy__grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: var(--space-lg);
  }

  .wnetrze-philosophy__content {
    grid-column: 1 / span 6;
  }

  .wnetrze-philosophy__media {
    grid-column: 1 / span 6;
    margin-block-start: 0;
  }

  .wnetrze-zones__grid,
  .wnetrze-details__grid,
  .wnetrze-inspirations__grid,
  .wnetrze-testimonials__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .wnetrze-gallery__grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  .wnetrze-gallery__item--large {
    grid-column: 1 / span 6;
    grid-row: auto;
  }

  .wnetrze-gallery__item:nth-child(2) {
    grid-column: 1 / span 3;
    grid-row: auto;
  }

  .wnetrze-gallery__item:nth-child(3) {
    grid-column: 4 / span 3;
    grid-row: auto;
  }
}

@media (max-width: 767px) {
  .wnetrze-hero {
    padding-block: var(--space-2xl);
  }

  .wnetrze-hero__inner {
    grid-template-columns: 1fr;
    gap: var(--space-lg);
    min-height: auto;
  }

  .wnetrze-hero__content {
    grid-column: 1;
  }

  .wnetrze-hero__media {
    grid-column: 1;
  }

  .wnetrze-hero__title {
    font-size: clamp(2.25rem, 8vw, 2.5rem);
    max-width: 100%;
  }

  .wnetrze-philosophy__grid {
    grid-template-columns: 1fr;
    gap: var(--space-lg);
  }

  .wnetrze-philosophy__content,
  .wnetrze-philosophy__media {
    grid-column: 1;
  }

  .wnetrze-zones__grid,
  .wnetrze-details__grid,
  .wnetrze-inspirations__grid,
  .wnetrze-testimonials__grid {
    grid-template-columns: 1fr;
    gap: var(--space-xl);
  }

  .wnetrze-gallery__grid {
    grid-template-columns: 1fr;
    gap: var(--space-lg);
  }

  .wnetrze-gallery__item--large,
  .wnetrze-gallery__item:nth-child(2),
  .wnetrze-gallery__item:nth-child(3) {
    grid-column: 1;
    grid-row: auto;
  }

  .wnetrze-invitation__content {
    max-width: 100%;
  }

  .wnetrze-lightbox__prev,
  .wnetrze-lightbox__next {
    width: 40px;
    height: 40px;
    font-size: 1.25rem;
  }

  .wnetrze-lightbox__prev {
    left: var(--space-xs);
  }

  .wnetrze-lightbox__next {
    right: var(--space-xs);
  }
}

@media (max-width: 479px) {
  .wnetrze-hero__title {
    font-size: 2rem;
  }

  .wnetrze-hero__lead {
    font-size: var(--text-body-size);
  }

  .wnetrze-philosophy__quote p {
    font-size: var(--text-body-size);
  }
}

@media (prefers-reduced-motion: reduce) {
  .wnetrze-reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .wnetrze-zone-card__media img,
  .wnetrze-gallery__link img {
    transition: none;
  }

  .wnetrze-zone-card:hover .wnetrze-zone-card__media img,
  .wnetrze-gallery__link:hover img {
    transform: none;
    filter: none;
  }
}