/* Page-owned styles for offline-poker page */

.offline-poker-page {
  background-color: var(--color-chalk);
}

/* Open Edge Hero */
.open-edge-hero {
  position: relative;
  background-color: var(--color-chalk);
}

.open-edge-hero__overhead {
  width: 100%;
  height: 120px;
  background-color: var(--color-near-black);
}

.open-edge-hero__slit {
  width: 100%;
  height: 64px;
  overflow: hidden;
  background-color: var(--color-limestone);
  transition: height var(--transition-base);
}

.open-edge-hero__slit:hover {
  height: 72px;
}

.open-edge-hero__slit img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: saturate(0.82) sepia(0.06) brightness(1.02);
}

.open-edge-hero__content {
  padding-top: var(--space-2xl);
  padding-bottom: var(--space-3xl);
  max-width: var(--container-editorial);
}

.open-edge-hero__content h1 {
  max-width: 100%;
  margin-block-end: var(--space-lg);
}

.open-edge-hero__lead {
  max-width: 65ch;
  font-size: var(--text-body-large);
  line-height: var(--leading-body-large);
  margin-block-end: var(--space-xl);
}

.open-edge-hero__cta {
  margin-block-start: var(--space-md);
}

/* Offline Poker in Torquay */
.offline-poker-torquay {
  position: relative;
  background-color: var(--color-limestone);
  padding-block: var(--space-4xl);
}

.offline-poker-torquay__plane {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 80px;
  background-color: var(--color-limestone);
  z-index: 0;
}

.offline-poker-torquay__inner {
  position: relative;
  z-index: 1;
}

.offline-poker-torquay__inner h2 {
  margin-block-end: var(--space-2xl);
}

.offline-poker-torquay__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--space-xl);
}

.offline-poker-torquay__definition {
  grid-column: span 7;
  min-width: 0;
}

.offline-poker-torquay__definition h3,
.offline-poker-torquay__location h3 {
  margin-block-end: var(--space-sm);
}

.offline-poker-torquay__definition p,
.offline-poker-torquay__location p {
  max-width: 70ch;
  margin-block-end: var(--space-md);
}

.offline-poker-torquay__list {
  list-style: disc;
  padding-inline-start: var(--space-lg);
  margin-block-start: var(--space-sm);
}

.offline-poker-torquay__list li {
  margin-block-end: var(--space-xs);
}

.offline-poker-torquay__location {
  grid-column: span 5;
  min-width: 0;
}

.offline-poker-torquay__accent {
  width: 48px;
  height: 2px;
  background-color: var(--color-clay);
  margin-block-end: var(--space-md);
}

/* Physical Poker Tables */
.physical-poker-tables {
  background-color: var(--color-chalk);
  padding-block: var(--space-4xl);
}

.physical-poker-tables__inner h2 {
  margin-block-end: var(--space-2xl);
}

.physical-poker-tables__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--space-xl);
  margin-block-end: var(--space-xl);
}

.physical-poker-tables__felt,
.physical-poker-tables__layout {
  grid-column: span 6;
  min-width: 0;
}

.physical-poker-tables__felt h3,
.physical-poker-tables__layout h3 {
  margin-block-end: var(--space-sm);
}

.physical-poker-tables__felt p,
.physical-poker-tables__layout p {
  max-width: 65ch;
  margin-block-end: var(--space-md);
}

.physical-poker-tables__list {
  list-style: disc;
  padding-inline-start: var(--space-lg);
  margin-block-start: var(--space-sm);
}

.physical-poker-tables__list li {
  margin-block-end: var(--space-xs);
}

.physical-poker-tables__accent {
  width: 48px;
  height: 2px;
  background-color: var(--color-clay);
  margin-block-end: var(--space-md);
}

.physical-poker-tables__slit {
  width: 100%;
  height: 64px;
  overflow: hidden;
  background-color: var(--color-limestone);
  transition: height var(--transition-base);
}

.physical-poker-tables__slit:hover {
  height: 72px;
}

.physical-poker-tables__slit img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: saturate(0.82) sepia(0.06) brightness(1.02);
}

/* Poker Room Descent */
.poker-room-descent {
  background-color: var(--color-chalk);
}

.poker-room-descent__band {
  width: 100%;
  padding-block: var(--space-4xl);
}

.poker-room-descent__band--near-black {
  background-color: var(--color-near-black);
  color: var(--color-chalk);
}

.poker-room-descent__band--forest-felt {
  background-color: var(--color-forest-felt);
  color: var(--color-chalk);
}

.poker-room-descent__band-inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--space-xl);
  align-items: center;
}

.poker-room-descent__band-inner--reverse {
  direction: rtl;
}

.poker-room-descent__band-inner--reverse > * {
  direction: ltr;
}

.poker-room-descent__text {
  grid-column: span 7;
  min-width: 0;
}

.poker-room-descent__text h3 {
  color: var(--color-chalk);
  margin-block-end: var(--space-sm);
}

.poker-room-descent__text p {
  max-width: 60ch;
  color: var(--color-chalk);
  margin-block-end: 0;
}

.poker-room-descent__slit {
  grid-column: span 5;
  min-width: 0;
  height: 64px;
  overflow: hidden;
  background-color: var(--color-limestone);
  transition: height var(--transition-base);
}

.poker-room-descent__slit:hover {
  height: 72px;
}

.poker-room-descent__slit img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: saturate(0.82) sepia(0.06) brightness(1.02);
}

/* Face-to-Face Poker */
.face-to-face-poker {
  background-color: var(--color-chalk);
  padding-block: var(--space-4xl);
}

.face-to-face-poker__inner h2 {
  margin-block-end: var(--space-2xl);
}

.face-to-face-poker__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--space-xl);
  align-items: center;
}

.face-to-face-poker__text {
  grid-column: span 7;
  min-width: 0;
}

.face-to-face-poker__text h3 {
  margin-block-end: var(--space-sm);
}

.face-to-face-poker__text p {
  max-width: 65ch;
  margin-block-end: var(--space-md);
}

.face-to-face-poker__slit {
  grid-column: span 5;
  min-width: 0;
  height: 64px;
  overflow: hidden;
  background-color: var(--color-limestone);
  transition: height var(--transition-base);
}

.face-to-face-poker__slit:hover {
  height: 72px;
}

.face-to-face-poker__slit img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: saturate(0.82) sepia(0.06) brightness(1.02);
}

/* Card Lounge */
.card-lounge {
  background-color: var(--color-forest-felt);
  color: var(--color-limestone);
  padding-block: var(--space-4xl);
}

.card-lounge__inner {
  max-width: 800px;
  margin-inline: 0;
}

.card-lounge__inner h2 {
  color: var(--color-limestone);
  margin-block-end: var(--space-2xl);
}

.card-lounge__text h3 {
  color: var(--color-limestone);
  margin-block-end: var(--space-sm);
}

.card-lounge__text p {
  max-width: 60ch;
  color: var(--color-limestone);
  margin-block-end: var(--space-md);
}

.card-lounge__clay-line {
  width: 100%;
  height: 2px;
  background-color: var(--color-clay);
  margin-block: var(--space-xl) var(--space-md);
  transition: height var(--transition-base);
}

.card-lounge__cta {
  display: inline-block;
  color: var(--color-limestone);
  text-decoration: underline;
  text-decoration-color: var(--color-clay);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  transition: color var(--transition-base), text-decoration-thickness var(--transition-base);
}

.card-lounge__cta:hover {
  color: var(--color-chalk);
  text-decoration-thickness: 2px;
}

.card-lounge__cta:hover + .card-lounge__clay-line {
  height: 4px;
}

/* Physical Poker Experience */
.physical-poker-experience {
  background-color: var(--color-chalk);
  padding-block: var(--space-4xl);
}

.physical-poker-experience__inner h2 {
  margin-block-end: var(--space-2xl);
}

.physical-poker-experience__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--space-xl);
}

.physical-poker-experience__main {
  grid-column: span 7;
  min-width: 0;
}

.physical-poker-experience__main h3 {
  margin-block-end: var(--space-sm);
}

.physical-poker-experience__main p {
  max-width: 65ch;
  margin-block-end: var(--space-md);
}

.physical-poker-experience__aside {
  grid-column: span 5;
  min-width: 0;
}

.physical-poker-experience__aside h3 {
  margin-block-end: var(--space-md);
}

.physical-poker-experience__faq {
  margin-block-end: var(--space-xl);
}

.physical-poker-experience__links {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.physical-poker-experience__links a {
  color: var(--color-forest-felt);
  text-decoration: underline;
  text-decoration-color: var(--color-clay);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  transition: color var(--transition-base), text-decoration-thickness var(--transition-base);
}

.physical-poker-experience__links a:hover {
  color: var(--color-felt-deep);
  text-decoration-thickness: 2px;
}

/* Restaurant Dining */
.restaurant-dining {
  background-color: var(--color-limestone);
  padding-block: var(--space-3xl);
}

.restaurant-dining__inner h3 {
  font-size: var(--text-h3);
  margin-block-end: var(--space-lg);
}

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

.restaurant-dining__text {
  grid-column: span 5;
  min-width: 0;
}

.restaurant-dining__text p {
  max-width: 55ch;
  font-size: var(--text-small);
  line-height: var(--leading-small);
  margin-block-end: 0;
}

.restaurant-dining__image {
  grid-column: span 7;
  min-width: 0;
  aspect-ratio: 21 / 9;
  overflow: hidden;
}

.restaurant-dining__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: saturate(0.82) sepia(0.06) brightness(1.02);
}

/* Private Poker Enquiries */
.private-poker-enquiries {
  background-color: var(--color-limestone);
  padding-block: var(--space-4xl);
}

.private-poker-enquiries__inner {
  max-width: 600px;
  margin-inline: auto;
  text-align: center;
}

.private-poker-enquiries__inner h2 {
  margin-block-end: var(--space-lg);
}

.private-poker-enquiries__inner p {
  max-width: 65ch;
  margin-inline: auto;
  margin-block-end: var(--space-xl);
}

.private-poker-enquiries__cta {
  display: inline-flex;
  margin-block-end: var(--space-md);
}

.private-poker-enquiries__secondary {
  display: inline-block;
  color: var(--color-forest-felt);
  text-decoration: underline;
  text-decoration-color: var(--color-clay);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  transition: color var(--transition-base), text-decoration-thickness var(--transition-base);
}

.private-poker-enquiries__secondary:hover {
  color: var(--color-felt-deep);
  text-decoration-thickness: 2px;
}

/* Scroll reveal */
.offline-poker-page .reveal {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity var(--transition-reveal), transform var(--transition-reveal);
}

.offline-poker-page .reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Tablet */
@media (min-width: 768px) and (max-width: 1023px) {
  .offline-poker-torquay__definition,
  .offline-poker-torquay__location,
  .physical-poker-tables__felt,
  .physical-poker-tables__layout,
  .poker-room-descent__text,
  .poker-room-descent__slit,
  .face-to-face-poker__text,
  .face-to-face-poker__slit,
  .physical-poker-experience__main,
  .physical-poker-experience__aside,
  .restaurant-dining__text,
  .restaurant-dining__image {
    grid-column: span 12;
  }

  .poker-room-descent__band-inner--reverse {
    direction: ltr;
  }

  .poker-room-descent__band-inner--reverse > * {
    direction: ltr;
  }

  .restaurant-dining__image {
    aspect-ratio: 16 / 9;
  }
}

/* Mobile */
@media (max-width: 767px) {
  .open-edge-hero__overhead {
    height: 80px;
  }

  .open-edge-hero__slit,
  .physical-poker-tables__slit,
  .poker-room-descent__slit,
  .face-to-face-poker__slit {
    height: 48px;
  }

  .open-edge-hero__slit:hover,
  .physical-poker-tables__slit:hover,
  .poker-room-descent__slit:hover,
  .face-to-face-poker__slit:hover {
    height: 56px;
  }

  .open-edge-hero__content {
    padding-top: var(--space-xl);
    padding-bottom: var(--space-2xl);
  }

  .open-edge-hero__lead {
    font-size: var(--text-body);
    line-height: var(--leading-body);
  }

  .offline-poker-torquay,
  .physical-poker-tables,
  .poker-room-descent__band,
  .face-to-face-poker,
  .card-lounge,
  .physical-poker-experience,
  .restaurant-dining,
  .private-poker-enquiries {
    padding-block: var(--space-3xl);
  }

  .offline-poker-torquay__plane {
    height: 60px;
  }

  .offline-poker-torquay__grid,
  .physical-poker-tables__grid,
  .poker-room-descent__band-inner,
  .face-to-face-poker__grid,
  .physical-poker-experience__grid,
  .restaurant-dining__grid {
    grid-template-columns: 1fr;
    gap: var(--space-lg);
  }

  .offline-poker-torquay__definition,
  .offline-poker-torquay__location,
  .physical-poker-tables__felt,
  .physical-poker-tables__layout,
  .poker-room-descent__text,
  .poker-room-descent__slit,
  .face-to-face-poker__text,
  .face-to-face-poker__slit,
  .physical-poker-experience__main,
  .physical-poker-experience__aside,
  .restaurant-dining__text,
  .restaurant-dining__image {
    grid-column: auto;
  }

  .poker-room-descent__band-inner--reverse {
    direction: ltr;
  }

  .poker-room-descent__band-inner--reverse > * {
    direction: ltr;
  }

  .restaurant-dining__image {
    aspect-ratio: 16 / 9;
  }

  .card-lounge__inner {
    margin-inline: auto;
  }

  .private-poker-enquiries__cta {
    display: flex;
    width: 100%;
    justify-content: center;
  }
}
