/* Wnętrze page-owned styles */

#wnetrze-main {
    --wnetrze-gap: 48px;
    --wnetrze-gap-small: 24px;
    --wnetrze-gap-xs: 16px;
    --wnetrze-gap-lg: 64px;
    --wnetrze-text-measure: 720px;
    --wnetrze-text-measure-narrow: 480px;
    --wnetrze-text-measure-card: 300px;
    --wnetrze-text-measure-cta: 600px;
}

/* Hero */
.wnetrze-hero {
    position: relative;
    min-height: 80vh;
    display: flex;
    align-items: flex-end;
    overflow: hidden;
    background-color: var(--color-graphite);
}

.wnetrze-hero__image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}

.wnetrze-hero__overlay {
    position: absolute;
    inset: 0;
    background-color: rgba(43, 43, 43, 0.15);
    z-index: 1;
}

.wnetrze-hero__content {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: var(--container-max);
    margin-inline: auto;
    padding-inline: var(--container-padding);
    padding-block-end: var(--wnetrze-gap);
    color: var(--color-ivory);
}

.wnetrze-hero__content h1 {
    color: var(--color-ivory);
    max-width: var(--wnetrze-text-measure);
    margin-block-end: var(--space-4);
}

.wnetrze-hero__content .lead {
    max-width: var(--wnetrze-text-measure);
    color: var(--color-ivory);
    margin-block-end: var(--space-5);
}

.wnetrze-hero__details {
    max-width: var(--wnetrze-text-measure);
    margin-block-end: 0;
    padding-inline-start: var(--space-5);
    color: var(--color-ivory);
}

.wnetrze-hero__details li {
    margin-block-end: var(--space-2);
}

.wnetrze-hero__details li:last-child {
    margin-block-end: 0;
}

/* Shared section spacing */
.wnetrze-section {
    padding-block: var(--wnetrze-gap-lg);
}

.wnetrze-section--ivory {
    background-color: var(--color-ivory);
}

.wnetrze-section--ivory-deep {
    background-color: var(--color-ivory-deep);
}

.wnetrze-section--graphite {
    background-color: var(--color-graphite);
    color: var(--color-ivory);
}

.wnetrze-section--dark-cherry {
    background-color: var(--color-dark-cherry);
    color: var(--color-ivory);
}

.wnetrze-section--graphite h2,
.wnetrze-section--graphite h3,
.wnetrze-section--dark-cherry h2,
.wnetrze-section--dark-cherry h3 {
    color: var(--color-ivory);
}

.wnetrze-section--graphite ul,
.wnetrze-section--dark-cherry ul {
    color: var(--color-ivory);
}

/* Jadalnia */
.wnetrze-jadalnia {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--wnetrze-gap);
    align-items: start;
}

.wnetrze-jadalnia__media {
    min-width: 0;
}

.wnetrze-jadalnia__image {
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    display: block;
    border-radius: var(--radius-0);
}

.wnetrze-jadalnia__content {
    min-width: 0;
    max-width: var(--wnetrze-text-measure-narrow);
}

.wnetrze-jadalnia__content h2,
.wnetrze-jadalnia__content h3 {
    margin-block-end: var(--space-3);
}

.wnetrze-jadalnia__content p {
    margin-block-end: var(--space-4);
}

.wnetrze-jadalnia__content ul {
    margin-block-end: var(--space-5);
}

/* Bar */
.wnetrze-bar {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--wnetrze-gap);
    align-items: start;
}

.wnetrze-bar__content {
    min-width: 0;
    max-width: var(--wnetrze-text-measure-narrow);
    order: 1;
}

.wnetrze-bar__media {
    min-width: 0;
    order: 2;
}

.wnetrze-bar__image {
    width: 100%;
    height: auto;
    aspect-ratio: 3 / 2;
    object-fit: cover;
    display: block;
    border-radius: var(--radius-0);
}

.wnetrze-bar__content h2,
.wnetrze-bar__content h3 {
    margin-block-end: var(--space-3);
}

.wnetrze-bar__content p {
    margin-block-end: var(--space-4);
}

.wnetrze-bar__content ul {
    margin-block-end: var(--space-5);
}

/* Przejście */
.wnetrze-przejscie {
    display: grid;
    grid-template-columns: 3fr 2fr;
    gap: var(--wnetrze-gap);
    align-items: start;
}

.wnetrze-przejscie__content {
    min-width: 0;
    max-width: var(--wnetrze-text-measure);
}

.wnetrze-przejscie__media {
    min-width: 0;
}

.wnetrze-przejscie__image {
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 5;
    object-fit: cover;
    display: block;
    border-radius: var(--radius-0);
    border: 1px solid var(--color-brass-deep);
}

.wnetrze-przejscie__content h2,
.wnetrze-przejscie__content h3 {
    margin-block-end: var(--space-3);
}

.wnetrze-przejscie__content p {
    margin-block-end: var(--space-4);
}

.wnetrze-przejscie__content ul {
    margin-block-end: var(--space-5);
}

/* Detale */
.wnetrze-detale__heading {
    margin-block-end: var(--space-6);
}

.wnetrze-detale {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--wnetrze-gap-small);
}

.wnetrze-detal {
    background-color: var(--color-ivory);
    border: var(--border-light);
    border-radius: var(--radius-1);
    padding: var(--space-5);
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.wnetrze-detal h3 {
    margin-block-end: 0;
}

.wnetrze-detal p {
    margin-block-end: 0;
    max-width: var(--wnetrze-text-measure-card);
}

.wnetrze-detal ul {
    margin-block-end: 0;
    padding-inline-start: var(--space-4);
}

.wnetrze-detal li {
    margin-block-end: var(--space-2);
}

.wnetrze-detal li:last-child {
    margin-block-end: 0;
}

/* Prywatna */
.wnetrze-prywatna {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--wnetrze-gap);
    align-items: start;
}

.wnetrze-prywatna__media {
    min-width: 0;
}

.wnetrze-prywatna__image {
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    display: block;
    border-radius: var(--radius-0);
}

.wnetrze-prywatna__content {
    min-width: 0;
    max-width: var(--wnetrze-text-measure-narrow);
}

.wnetrze-prywatna__content h2,
.wnetrze-prywatna__content h3 {
    margin-block-end: var(--space-3);
}

.wnetrze-prywatna__content p {
    margin-block-end: var(--space-4);
}

.wnetrze-prywatna__content ul {
    margin-block-end: var(--space-5);
}

/* Widok */
.wnetrze-widok {
    display: flex;
    justify-content: flex-start;
}

.wnetrze-widok__content {
    width: 60%;
    max-width: var(--wnetrze-text-measure);
    min-width: 0;
}

.wnetrze-widok__content h2,
.wnetrze-widok__content h3 {
    margin-block-end: var(--space-3);
}

.wnetrze-widok__content p {
    margin-block-end: var(--space-4);
}

.wnetrze-widok__content ul {
    margin-block-end: var(--space-5);
}

/* Wieczór */
.wnetrze-wieczor {
    display: grid;
    grid-template-columns: 3fr 2fr;
    gap: var(--wnetrze-gap);
    align-items: start;
}

.wnetrze-wieczor__content {
    min-width: 0;
    max-width: var(--wnetrze-text-measure);
}

.wnetrze-wieczor__media {
    min-width: 0;
}

.wnetrze-wieczor__image {
    width: 100%;
    height: auto;
    aspect-ratio: 3 / 2;
    object-fit: cover;
    display: block;
    border-radius: var(--radius-0);
    border: 1px solid var(--color-brass-deep);
}

.wnetrze-wieczor__content h2,
.wnetrze-wieczor__content h3 {
    margin-block-end: var(--space-3);
}

.wnetrze-wieczor__content p {
    margin-block-end: var(--space-4);
}

.wnetrze-wieczor__content ul {
    margin-block-end: var(--space-5);
}

/* Rezerwacja */
.wnetrze-rezerwacja {
    display: flex;
    justify-content: center;
}

.wnetrze-rezerwacja__content {
    max-width: var(--wnetrze-text-measure-cta);
    width: 100%;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-5);
}

.wnetrze-rezerwacja__content h2 {
    margin-block-end: 0;
}

.wnetrze-rezerwacja__content p {
    margin-block-end: 0;
}

.wnetrze-rezerwacja__kontakt {
    list-style: none;
    padding-inline-start: 0;
    margin-block-end: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.wnetrze-rezerwacja__kontakt li {
    margin-block-end: 0;
}

.wnetrze-rezerwacja__cta {
    min-width: 240px;
}

/* Tablet */
@media (min-width: 768px) and (max-width: 1023px) {
    .wnetrze-jadalnia,
    .wnetrze-bar,
    .wnetrze-prywatna {
        grid-template-columns: 1fr;
        gap: var(--wnetrze-gap-small);
    }

    .wnetrze-jadalnia__content,
    .wnetrze-bar__content,
    .wnetrze-prywatna__content {
        max-width: var(--wnetrze-text-measure);
    }

    .wnetrze-bar__content {
        order: 1;
    }

    .wnetrze-bar__media {
        order: 2;
    }

    .wnetrze-przejscie,
    .wnetrze-wieczor {
        grid-template-columns: 1fr;
        gap: var(--wnetrze-gap-small);
    }

    .wnetrze-detale {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: var(--wnetrze-gap-xs);
    }

    .wnetrze-widok__content {
        width: 100%;
        max-width: var(--wnetrze-text-measure);
    }
}

/* Mobile */
@media (max-width: 767px) {
    #wnetrze-main {
        --wnetrze-gap: 32px;
        --wnetrze-gap-small: 20px;
        --wnetrze-gap-lg: 48px;
    }

    .wnetrze-hero {
        min-height: 60vh;
    }

    .wnetrze-hero__overlay {
        background-color: rgba(43, 43, 43, 0.2);
    }

    .wnetrze-hero__content {
        padding-inline: var(--container-padding);
        padding-block-end: var(--wnetrze-gap-small);
    }

    .wnetrze-hero__content h1 {
        font-size: clamp(1.875rem, 1.5rem + 2vw, 2.25rem);
    }

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

    .wnetrze-jadalnia,
    .wnetrze-bar,
    .wnetrze-prywatna,
    .wnetrze-przejscie,
    .wnetrze-wieczor {
        grid-template-columns: 1fr;
        gap: var(--wnetrze-gap-small);
    }

    .wnetrze-jadalnia__content,
    .wnetrze-bar__content,
    .wnetrze-prywatna__content,
    .wnetrze-przejscie__content,
    .wnetrze-wieczor__content {
        max-width: 100%;
    }

    .wnetrze-bar__content {
        order: 1;
    }

    .wnetrze-bar__media {
        order: 2;
    }

    .wnetrze-detale {
        grid-template-columns: 1fr;
        gap: var(--wnetrze-gap-xs);
    }

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

    .wnetrze-rezerwacja__cta {
        width: 100%;
        min-width: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .wnetrze-hero,
    .wnetrze-section {
        transition: none;
    }
}
