/* Page-owned styles for Rólunk page */
.rolunk-page {
  width: 100%;
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-padding-mobile);
}

/* Bevezető – Mi a FALENTRAB? */
.rolunk-intro {
  padding-block: var(--space-96) var(--space-64);
  background-color: var(--color-ivory);
}

.rolunk-intro__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-32);
  align-items: center;
}

.rolunk-intro__main {
  min-width: 0;
}

.rolunk-intro__timestamp {
  margin-block-end: var(--space-16);
}

.rolunk-intro__title {
  font-size: var(--text-display-size);
  line-height: var(--text-display-leading);
  letter-spacing: var(--text-display-tracking);
  margin-block-end: var(--space-24);
  overflow-wrap: break-word;
}

.rolunk-intro__lead {
  max-width: 680px;
  font-size: var(--text-body-large-size);
  line-height: var(--text-body-large-leading);
  margin-block-end: 0;
}

.rolunk-intro__quote {
  font-family: var(--font-heading);
  font-size: var(--text-h3-size);
  line-height: var(--text-h3-leading);
  font-style: italic;
  color: var(--color-coral);
  border-inline-start: 2px solid var(--color-coral);
  padding-inline-start: var(--space-16);
  margin-block-end: 0;
  text-align: right;
  max-width: 400px;
  justify-self: end;
}

/* A történet – Fény és íz */
.rolunk-story {
  padding-block: var(--space-64);
  background-color: var(--color-sand);
}

.rolunk-story__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-32);
  align-items: start;
}

.rolunk-story__copy {
  min-width: 0;
}

.rolunk-story__copy h2 {
  margin-block-end: var(--space-16);
}

.rolunk-story__copy p {
  max-width: 600px;
  margin-block-end: var(--space-16);
}

.rolunk-story__copy p:last-child {
  margin-block-end: 0;
}

.rolunk-story__media {
  margin-block-end: 0;
  box-shadow: var(--shadow-long);
}

.rolunk-story__media img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  display: block;
}

.rolunk-story__media figcaption {
  margin-block-start: var(--space-8);
  color: var(--color-graphite);
}

/* Az asztal filozófiája */
.rolunk-philosophy {
  padding-block: var(--space-64);
  background-color: var(--color-ivory);
}

.rolunk-philosophy__inner {
  display: flex;
  flex-direction: column;
  gap: var(--space-32);
}

.rolunk-philosophy__timestamp {
  align-self: center;
}

.rolunk-philosophy h2 {
  text-align: center;
  margin-block-end: var(--space-16);
}

.rolunk-philosophy__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-24);
}

.rolunk-philosophy__item {
  min-width: 0;
  text-align: center;
  padding: var(--space-24);
  border: var(--border-light);
  border-radius: var(--radius-card);
  background-color: var(--color-sand);
}

.rolunk-philosophy__item h3 {
  margin-block-end: var(--space-12);
}

.rolunk-philosophy__item p {
  max-width: 400px;
  margin-inline: auto;
  margin-block-end: 0;
}

/* Az alkony és az éjszaka – A játékterem */
.rolunk-gaming {
  padding-block: var(--space-64);
  background-color: var(--color-ultramarine);
  color: var(--color-ivory);
}

.rolunk-gaming__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-32);
  align-items: start;
}

.rolunk-gaming__copy {
  min-width: 0;
}

.rolunk-gaming__copy h2,
.rolunk-gaming__copy h3,
.rolunk-gaming__responsible h3 {
  color: var(--color-ivory);
}

.rolunk-gaming__copy p,
.rolunk-gaming__responsible p {
  color: var(--color-graphite);
  max-width: 600px;
  margin-block-end: var(--space-16);
}

.rolunk-gaming__copy p:last-child,
.rolunk-gaming__responsible p:last-child {
  margin-block-end: 0;
}

.rolunk-gaming__list {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-8);
  margin-block-start: var(--space-16);
}

.rolunk-gaming__list li {
  background-color: var(--color-ivory);
  color: var(--color-chocolate);
  padding: var(--space-8) var(--space-16);
  border-radius: var(--radius-button);
  font-size: var(--text-body-small-size);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.rolunk-gaming__responsible {
  min-width: 0;
  border-inline-start: 1px solid var(--border-ultramarine);
  padding-inline-start: var(--space-24);
}

.rolunk-gaming__media {
  margin-block-end: 0;
  box-shadow: var(--shadow-long);
  grid-column: 1 / -1;
}

.rolunk-gaming__media img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  display: block;
}

.rolunk-gaming__media figcaption {
  margin-block-start: var(--space-8);
  color: var(--color-graphite);
}

/* A 21+ házirend */
.rolunk-policy {
  padding-block: var(--space-64);
  background-color: var(--color-sand);
}

.rolunk-policy__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--space-24);
}

.rolunk-policy__timestamp {
  align-self: center;
}

.rolunk-policy h2 {
  margin-block-end: var(--space-16);
}

.rolunk-policy p {
  max-width: 600px;
  margin-inline: auto;
  margin-block-end: 0;
}

.rolunk-policy__highlight {
  font-family: var(--font-heading);
  font-size: var(--text-h3-size);
  line-height: var(--text-h3-leading);
  color: var(--color-coral);
  font-weight: 500;
  margin-block-start: var(--space-16);
}

/* 100% alkoholmentes elköteleződés */
.rolunk-zero {
  padding-block: var(--space-64);
  background-color: var(--color-ivory);
}

.rolunk-zero__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-32);
  align-items: start;
}

.rolunk-zero__copy {
  min-width: 0;
}

.rolunk-zero__copy h2 {
  margin-block-end: var(--space-16);
}

.rolunk-zero__copy p {
  max-width: 600px;
  margin-block-end: var(--space-16);
}

.rolunk-zero__copy p:last-child {
  margin-block-end: 0;
}

.rolunk-zero__media {
  margin-block-end: 0;
  box-shadow: var(--shadow-long);
}

.rolunk-zero__media img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  display: block;
}

.rolunk-zero__media figcaption {
  margin-block-start: var(--space-8);
  color: var(--color-graphite);
}

/* A csapat és a vendéglátás */
.rolunk-team {
  padding-block: var(--space-64);
  background-color: var(--color-sand);
}

.rolunk-team__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--space-32);
}

.rolunk-team__timestamp {
  align-self: center;
}

.rolunk-team h2 {
  margin-block-end: var(--space-16);
}

.rolunk-team__intro {
  max-width: 600px;
  margin-inline: auto;
  margin-block-end: 0;
}

.rolunk-team__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-24);
  width: 100%;
}

.rolunk-team__member {
  min-width: 0;
  padding: var(--space-24);
  border: var(--border-light);
  border-radius: var(--radius-card);
  background-color: var(--color-ivory);
  text-align: center;
}

.rolunk-team__member h3 {
  margin-block-end: var(--space-12);
}

.rolunk-team__member p {
  max-width: 400px;
  margin-inline: auto;
  margin-block-end: 0;
}

/* Meghívás – Foglaljon asztalt */
.rolunk-invite {
  padding-block: var(--space-96) var(--space-128);
  background-color: var(--color-ultramarine);
  color: var(--color-ivory);
}

.rolunk-invite__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--space-32);
}

.rolunk-invite__timestamp {
  align-self: center;
}

.rolunk-invite h2 {
  color: var(--color-ivory);
  margin-block-end: var(--space-16);
}

.rolunk-invite p {
  color: var(--color-graphite);
  max-width: 600px;
  margin-inline: auto;
  margin-block-end: 0;
}

.rolunk-invite__actions {
  display: flex;
  flex-direction: column;
  gap: var(--space-16);
  width: 100%;
  max-width: 400px;
}

.rolunk-invite__actions .btn {
  width: 100%;
}

/* Tablet and desktop breakpoints */
@media (min-width: 768px) {
  .rolunk-page {
    padding-inline: var(--container-padding-desktop);
  }

  .rolunk-intro__inner {
    grid-template-columns: minmax(0, 8fr) minmax(0, 4fr);
    gap: var(--space-48);
  }

  .rolunk-intro__quote {
    justify-self: end;
    text-align: right;
  }

  .rolunk-story__inner {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: var(--space-48);
  }

  .rolunk-story__media {
    transform: translateY(var(--space-24));
  }

  .rolunk-philosophy__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .rolunk-gaming__inner {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: var(--space-48);
  }

  .rolunk-gaming__responsible {
    border-inline-start: 1px solid var(--border-ultramarine);
    padding-inline-start: var(--space-24);
  }

  .rolunk-gaming__media {
    grid-column: 1 / -1;
  }

  .rolunk-zero__inner {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: var(--space-48);
  }

  .rolunk-zero__media {
    transform: translateY(-var(--space-24));
  }

  .rolunk-team__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .rolunk-invite__actions {
    flex-direction: row;
    justify-content: center;
    width: auto;
    max-width: none;
  }

  .rolunk-invite__actions .btn {
    width: auto;
  }
}

@media (min-width: 1024px) {
  .rolunk-intro {
    padding-block: var(--space-128) var(--space-96);
  }

  .rolunk-story,
  .rolunk-philosophy,
  .rolunk-gaming,
  .rolunk-policy,
  .rolunk-zero,
  .rolunk-team {
    padding-block: var(--space-96);
  }

  .rolunk-invite {
    padding-block: var(--space-128) var(--space-160);
  }
}

@media (prefers-reduced-motion: reduce) {
  .rolunk-story__media,
  .rolunk-zero__media {
    transform: none;
  }
}