/* Wnętrze page styles */

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

/* Hero section */
.wnetrze-hero {
    position: relative;
    background-color: var(--color-cream);
}

.wnetrze-hero::before {
    content: "";
    position: absolute;
    top: -80px;
    right: -120px;
    width: 320px;
    height: 320px;
    border-radius: var(--radius-full);
    background-color: rgba(147, 197, 114, 0.18);
    pointer-events: none;
}

.wnetrze-hero__container {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: var(--space-7);
    align-items: center;
    position: relative;
    z-index: 1;
}

.wnetrze-hero__text {
    min-width: 0;
    text-align: center;
    margin-inline: auto;
    max-width: 100%;
}

.wnetrze-hero__text h1 {
    margin-bottom: var(--space-5);
}

.wnetrze-hero__lead {
    margin-bottom: var(--space-5);
}

.wnetrze-hero__list {
    margin-bottom: var(--space-6);
    text-align: start;
    display: inline-block;
}

.wnetrze-hero__cta {
    display: inline-flex;
    margin-top: var(--space-2);
}

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

.wnetrze-hero__image {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border-radius: var(--radius-medium);
    box-shadow: var(--shadow-card);
}

/* Sala główna */
.wnetrze-sala {
    background-color: var(--color-white);
}

.wnetrze-sala__container {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
    gap: var(--space-7);
    align-items: center;
}

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

.wnetrze-sala__image {
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    border-radius: var(--radius-medium);
    box-shadow: var(--shadow-soft);
}

.wnetrze-sala__text {
    min-width: 0;
    text-align: start;
    max-width: 65ch;
}

.wnetrze-sala__text h2 {
    margin-bottom: var(--space-4);
}

.wnetrze-sala__text p {
    margin-bottom: var(--space-4);
}

.wnetrze-sala__text .content-list {
    margin-top: var(--space-4);
}

/* Rotating Table */
.wnetrze-rotating {
    background-color: var(--color-cream);
    position: relative;
}

.wnetrze-rotating::after {
    content: "";
    position: absolute;
    bottom: -60px;
    left: -80px;
    width: 240px;
    height: 240px;
    border-radius: var(--radius-full);
    background-color: rgba(251, 167, 111, 0.15);
    pointer-events: none;
}

.wnetrze-rotating__container {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-6);
    position: relative;
    z-index: 1;
}

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

.wnetrze-rotating__image {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border-radius: var(--radius-medium);
    box-shadow: var(--shadow-card);
    transition: transform 0.6s ease;
}

.wnetrze-rotating__image:hover {
    transform: rotate(2deg) scale(1.01);
}

.wnetrze-rotating__text {
    min-width: 0;
    text-align: center;
    margin-inline: auto;
    max-width: 100%;
}

.wnetrze-rotating__text h2 {
    margin-bottom: var(--space-4);
}

.wnetrze-rotating__text p {
    margin-bottom: var(--space-4);
}

.wnetrze-rotating__text .content-list {
    margin-top: var(--space-4);
    text-align: start;
    display: inline-block;
}

/* Strefa barowa */
.wnetrze-bar {
    background-color: var(--color-white);
}

.wnetrze-bar__container {
    display: grid;
    grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
    gap: var(--space-7);
    align-items: center;
}

.wnetrze-bar__text {
    min-width: 0;
    text-align: start;
    max-width: 60ch;
}

.wnetrze-bar__text h2 {
    margin-bottom: var(--space-4);
}

.wnetrze-bar__text p {
    margin-bottom: var(--space-4);
}

.wnetrze-bar__text .content-list {
    margin-top: var(--space-4);
}

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

.wnetrze-bar__image {
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    border-radius: var(--radius-medium);
    box-shadow: var(--shadow-soft);
}

/* Wieczorna aranżacja */
.wnetrze-wieczor {
    background-color: var(--color-cream);
    position: relative;
}

.wnetrze-wieczor::before {
    content: "";
    position: absolute;
    top: -40px;
    right: -60px;
    width: 200px;
    height: 200px;
    border-radius: var(--radius-full);
    background-color: rgba(0, 71, 171, 0.1);
    pointer-events: none;
}

.wnetrze-wieczor__container {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-6);
    position: relative;
    z-index: 1;
}

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

.wnetrze-wieczor__image {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border-radius: var(--radius-medium);
    box-shadow: var(--shadow-card);
}

.wnetrze-wieczor__text {
    min-width: 0;
    text-align: center;
    margin-inline: auto;
    max-width: 100%;
}

.wnetrze-wieczor__text h2 {
    margin-bottom: var(--space-4);
}

.wnetrze-wieczor__text p {
    margin-bottom: var(--space-4);
}

.wnetrze-wieczor__text .content-list {
    margin-top: var(--space-4);
    text-align: start;
    display: inline-block;
}

/* Strefa gier karcianych */
.wnetrze-karciane {
    background-color: var(--color-white);
}

.wnetrze-karciane__container {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
    gap: var(--space-7);
    align-items: center;
}

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

.wnetrze-karciane__image {
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    border-radius: var(--radius-medium);
    box-shadow: var(--shadow-soft);
}

.wnetrze-karciane__text {
    min-width: 0;
    text-align: start;
    max-width: 60ch;
}

.wnetrze-karciane__text h2 {
    margin-bottom: var(--space-4);
}

.wnetrze-karciane__text p {
    margin-bottom: var(--space-4);
}

.wnetrze-karciane__text .content-list {
    margin-top: var(--space-4);
}

/* Strefa ruletki */
.wnetrze-ruletka {
    background-color: var(--color-cream);
    position: relative;
}

.wnetrze-ruletka::after {
    content: "";
    position: absolute;
    bottom: -50px;
    left: -70px;
    width: 220px;
    height: 220px;
    border-radius: var(--radius-full);
    background-color: rgba(110, 20, 35, 0.08);
    pointer-events: none;
}

.wnetrze-ruletka__container {
    display: grid;
    grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
    gap: var(--space-7);
    align-items: center;
    position: relative;
    z-index: 1;
}

.wnetrze-ruletka__text {
    min-width: 0;
    text-align: start;
    max-width: 60ch;
}

.wnetrze-ruletka__text h2 {
    margin-bottom: var(--space-4);
}

.wnetrze-ruletka__text p {
    margin-bottom: var(--space-4);
}

.wnetrze-ruletka__text .content-list {
    margin-top: var(--space-4);
}

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

.wnetrze-ruletka__image {
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    border-radius: var(--radius-medium);
    box-shadow: var(--shadow-soft);
}

/* Atmosfera i detale */
.wnetrze-detale {
    background-color: var(--color-white);
}

.wnetrze-detale__container {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-6);
}

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

.wnetrze-detale__image {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border-radius: var(--radius-medium);
    box-shadow: var(--shadow-card);
}

.wnetrze-detale__text {
    min-width: 0;
    text-align: center;
    margin-inline: auto;
    max-width: 100%;
}

.wnetrze-detale__text h2 {
    margin-bottom: var(--space-4);
}

.wnetrze-detale__text p {
    margin-bottom: var(--space-4);
}

.wnetrze-detale__text .content-list {
    margin-top: var(--space-4);
    text-align: start;
    display: inline-block;
}

/* Rezerwacja i informacje praktyczne */
.wnetrze-rezerwacja {
    background-color: var(--color-cobalt);
    color: var(--color-white);
    padding-block: var(--space-8);
}

.wnetrze-rezerwacja__container {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: var(--space-5);
}

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

.wnetrze-rezerwacja__text h2 {
    color: var(--color-white);
    margin-bottom: var(--space-4);
}

.wnetrze-rezerwacja__text p {
    color: var(--color-white);
    margin-bottom: var(--space-5);
}

.wnetrze-rezerwacja__list {
    color: var(--color-white);
    margin-bottom: var(--space-6);
    text-align: start;
    display: inline-block;
}

.wnetrze-rezerwacja__list a {
    color: var(--color-apricot);
}

.wnetrze-rezerwacja__list a:hover,
.wnetrze-rezerwacja__list a:focus-visible {
    color: var(--color-white);
}

.wnetrze-rezerwacja__cta {
    display: inline-flex;
    margin-top: var(--space-2);
}

/* Responsive */
@media (max-width: 1023px) {
    .wnetrze-hero__container {
        grid-template-columns: 1fr;
        gap: var(--space-6);
    }

    .wnetrze-hero__text {
        order: 1;
        text-align: center;
        margin-inline: auto;
    }

    .wnetrze-hero__media {
        order: 2;
    }

    .wnetrze-sala__container,
    .wnetrze-bar__container,
    .wnetrze-karciane__container,
    .wnetrze-ruletka__container {
        grid-template-columns: 1fr;
        gap: var(--space-6);
    }

    .wnetrze-sala__media,
    .wnetrze-bar__media,
    .wnetrze-karciane__media,
    .wnetrze-ruletka__media {
        order: -1;
    }

    .wnetrze-sala__text,
    .wnetrze-bar__text,
    .wnetrze-karciane__text,
    .wnetrze-ruletka__text {
        max-width: 100%;
        text-align: start;
    }
}

@media (max-width: 767px) {
    .wnetrze-hero__container,
    .wnetrze-sala__container,
    .wnetrze-rotating__container,
    .wnetrze-bar__container,
    .wnetrze-wieczor__container,
    .wnetrze-karciane__container,
    .wnetrze-ruletka__container,
    .wnetrze-detale__container {
        gap: var(--space-5);
    }

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

    .wnetrze-hero__list,
    .wnetrze-rotating__text .content-list,
    .wnetrze-wieczor__text .content-list,
    .wnetrze-detale__text .content-list,
    .wnetrze-rezerwacja__list {
        display: block;
        text-align: start;
    }

    .wnetrze-rezerwacja__container {
        gap: var(--space-4);
    }
}

@media (max-width: 480px) {
    .wnetrze-hero::before,
    .wnetrze-rotating::after,
    .wnetrze-wieczor::before,
    .wnetrze-ruletka::after {
        width: 160px;
        height: 160px;
    }

    .wnetrze-hero__image,
    .wnetrze-rotating__image,
    .wnetrze-wieczor__image,
    .wnetrze-detale__image {
        aspect-ratio: 4 / 3;
    }
}