.hero-copy {
    max-width: 640px
}

.hero-copy .hero-title {
    color: var(--color-accent-charcoal)
}

.hero-actions .btn-secondary {
    background-color: #ffffff
}

.live-poker-grid,
.restaurant-grid,
.host-night-grid,
.hosts-grid,
.enquiry-grid,
.faq-grid,
.newsletter-grid {
    align-items: flex-start
}

.gallery-card {
    background: var(--color-surface-alt)
}

.gallery-figure {
    min-width: 260px;
    max-width: 520px
}

.gallery-figure figcaption {
    margin-top: var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--color-text-soft)
}

.card-image-offline img {
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-card)
}

details {
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border);
    padding: var(--space-3) var(--space-4);
    background-color: #ffffff
}

details+details {
    margin-top: var(--space-3)
}

details summary {
    cursor: pointer;
    font-weight: 500;
    color: var(--color-accent-charcoal)
}

details[open] {
    background-color: var(--color-bg)
}

details p {
    margin-top: var(--space-3);
    margin-bottom: 0
}

.newsletter-grid form .list-inline a {
    font-size: var(--font-size-xs);
    color: var(--color-muted)
}

.newsletter-grid form .list-inline a:hover {
    color: var(--color-accent-terracotta)
}

@media (max-width:1024px) {

    .live-poker-grid,
    .restaurant-grid,
    .host-night-grid,
    .hosts-grid,
    .enquiry-grid,
    .faq-grid,
    .newsletter-grid {
        grid-template-columns: 1fr
    }
}

@media (max-width:768px) {
    .hero-copy {
        max-width: 100%
    }

    .gallery-figure {
        max-width: 100%
    }
}