:root {
    --arena-ink: #10264b;
    --arena-ink-soft: #1a3b70;
    --arena-muted: #586b88;
    --arena-paper: #f3f7ff;
    --arena-white: #ffffff;
    --arena-lime: #ffc857;
    --arena-orange: #ff6b4a;
    --arena-line: #d8e3f4;
    --arena-primary: #2459d3;
    --arena-primary-dark: #174fc2;
    --arena-blue-tint: #eaf1ff;
    --arena-teal: #118b80;
    --arena-teal-tint: #e5f8f5;
    --arena-coral-tint: #fff0eb;
    --arena-shadow: 0 1.1rem 2.8rem rgb(22 57 112 / 11%);
    --bs-primary: #2459d3;
    --bs-primary-rgb: 36, 89, 211;
    --bs-primary-text-emphasis: #123a96;
    --bs-primary-bg-subtle: #eaf1ff;
    --bs-primary-border-subtle: #b8c9f1;
    --bs-info: #087e8b;
    --bs-info-rgb: 8, 126, 139;
    --bs-info-text-emphasis: #07525a;
    --bs-info-bg-subtle: #e2f5f5;
    --bs-info-border-subtle: #b1dfe0;
    --bs-body-bg: var(--arena-paper);
    --bs-body-color: var(--arena-ink);
    --bs-border-color: var(--arena-line);
    --bs-link-color: #194bb8;
    --bs-link-color-rgb: 25, 75, 184;
    --bs-link-hover-color: #123a96;
    --bs-link-hover-color-rgb: 18, 58, 150;
    --bs-success: #0b7658;
    --bs-success-rgb: 11, 118, 88;
    --bs-danger: #b42318;
    --bs-danger-rgb: 180, 35, 24;
    --bs-warning: #a56400;
    --bs-warning-rgb: 165, 100, 0;
}

body {
    background:
        radial-gradient(ellipse at 88% 0, rgb(36 89 211 / 6%), transparent 32rem),
        var(--arena-paper);
    color: var(--arena-ink);
}

.site-header,
.site-footer {
    background: linear-gradient(112deg, #10264b 0%, #173f7f 100%);
}

.hero-section {
    background: linear-gradient(118deg, #10264b 0%, #17458d 64%, #17608f 100%);
}

.hero-glow-one {
    background: radial-gradient(circle, rgb(255 200 87 / 21%) 0, rgb(255 200 87 / 0%) 70%);
}

.hero-glow-two {
    background: radial-gradient(circle, rgb(255 107 74 / 17%) 0, rgb(255 107 74 / 0%) 70%);
}

.status-dot {
    background: var(--arena-teal);
}

.btn-brand {
    background: var(--arena-primary);
    color: var(--arena-white);
    box-shadow: 0 .7rem 1.6rem rgb(36 89 211 / 22%);
}

.btn-brand:hover,
.btn-brand:focus-visible {
    background: var(--arena-primary-dark);
    color: var(--arena-white);
}

.btn-primary {
    --bs-btn-color: #ffffff;
    --bs-btn-bg: var(--arena-primary);
    --bs-btn-border-color: var(--arena-primary);
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: var(--arena-primary-dark);
    --bs-btn-hover-border-color: var(--arena-primary-dark);
    --bs-btn-active-color: #ffffff;
    --bs-btn-active-bg: #123a96;
    --bs-btn-active-border-color: #123a96;
    --bs-btn-focus-shadow-rgb: 36, 89, 211;
    --bs-btn-disabled-color: #ffffff;
    --bs-btn-disabled-bg: var(--arena-primary);
    --bs-btn-disabled-border-color: var(--arena-primary);
}

.btn-outline-primary {
    --bs-btn-color: var(--arena-primary-dark);
    --bs-btn-border-color: #8ca9e6;
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: var(--arena-primary);
    --bs-btn-hover-border-color: var(--arena-primary);
    --bs-btn-active-color: #ffffff;
    --bs-btn-active-bg: var(--arena-primary-dark);
    --bs-btn-active-border-color: var(--arena-primary-dark);
    --bs-btn-focus-shadow-rgb: 36, 89, 211;
}

.btn-dark {
    --bs-btn-bg: #173f7f;
    --bs-btn-border-color: #173f7f;
    --bs-btn-hover-bg: #10264b;
    --bs-btn-hover-border-color: #10264b;
    --bs-btn-active-bg: #0c1d3b;
    --bs-btn-active-border-color: #0c1d3b;
}

.btn-outline-dark {
    --bs-btn-color: #174fc2;
    --bs-btn-border-color: #8ca9e6;
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: #2459d3;
    --bs-btn-hover-border-color: #2459d3;
    --bs-btn-active-color: #ffffff;
    --bs-btn-active-bg: #174fc2;
    --bs-btn-active-border-color: #174fc2;
}

.facilities-section,
.booking-section,
.closing-section,
.account-section,
.cricket-section,
.phase5-section {
    background: var(--arena-paper);
}

.booking-intro {
    background: radial-gradient(circle at 10% 100%, rgb(255 200 87 / 14%), transparent 45%), #10264b;
}

.guest-badge {
    border-color: rgb(255 200 87 / 40%);
    background: rgb(255 200 87 / 7%);
}

.facility-tags span,
.no-gateway-pill {
    background: var(--arena-blue-tint);
    color: #455b83;
}

.locations-link:hover,
.closing-inner h2 span {
    color: var(--arena-primary-dark);
}

.phase5-public-badge,
.cricket-public-badge {
    border-color: #cbdaf7;
    background: var(--arena-blue-tint);
    color: #204ba7;
}

.phase5-public-badge span {
    color: var(--arena-primary);
}

.facility-card,
.booking-tool,
.account-hub,
.account-card,
.cricket-console,
.cricket-disclosure,
.phase5-shell,
.phase5-guest-card {
    border-color: var(--arena-line);
    box-shadow: 0 .8rem 2rem rgb(27 57 105 / 8%);
}

.facility-card .facility-icon,
.cricket-meta-pill,
.phase5-result-meta span {
    background: var(--arena-blue-tint);
    color: #204ba7;
}

.facility-card-nets .facility-icon,
.payment-note-icon {
    background: var(--arena-coral-tint);
    color: #ad3f2d;
}

.facility-card-box .facility-icon {
    background: #efebff;
    color: #5a43a8;
}

.ground-symbol,
.account-lock,
.phase5-guest-mark {
    background: var(--arena-teal-tint);
    color: #126b63;
}

.cricket-tabs .nav-link.active,
.phase5-tabs .nav-link.active {
    border-color: var(--arena-primary);
    background: var(--arena-primary);
    color: #ffffff;
}

.cricket-tabs .nav-link:hover,
.phase5-tabs .nav-link:hover {
    color: var(--arena-primary-dark);
}

.account-message,
.cricket-message[data-kind="success"],
.phase5-managed-result,
.booking-result {
    border-color: #b8e6dc;
    background: var(--arena-teal-tint);
    color: #125c56;
}

.booking-result p {
    color: #125c56;
}

.result-check {
    background: #bde9dd;
    color: #125c56;
}

.quote-card > [data-quote-total] {
    color: var(--arena-ink);
}

.quote-card > p,
.quote-terms {
    color: #455b83;
}

.account-message[data-kind="error"],
.cricket-message[data-kind="error"] {
    border-color: #f3c3b9;
    background: var(--arena-coral-tint);
    color: #9d3528;
}

.status-pill[data-status="confirmed"],
.status-pill[data-status="approved"] {
    background: #d9f2e8;
    color: #11664f;
}

.status-pill[data-status="pending"],
.status-pill[data-status="pending_review"],
.status-pill[data-status="pending_customer"] {
    background: #fff1cc;
    color: #7d5200;
}

.status-pill[data-status="rejected"],
.status-pill[data-status="expired"] {
    background: #ffe1db;
    color: #98372b;
}

.account-card-count {
    background: var(--arena-blue-tint);
    color: var(--arena-primary-dark);
}

.account-booking,
.account-notification.is-unread {
    border-left-color: var(--arena-primary);
}

.account-notification.is-unread {
    background: var(--arena-blue-tint);
}

.cricket-directory-card:hover,
.phase5-result-card:hover {
    border-color: #91aeea;
}

.cricket-disclosure > summary::after,
.phase5-policy-card li::marker {
    color: var(--arena-primary);
}

.cricket-ops-footnote {
    border-left-color: var(--arena-lime);
}

.phase5-public-badge,
.phase5-detail-item,
.cricket-public-badge,
.cricket-detail {
    border-color: #cbdaf7;
    background: var(--arena-blue-tint);
}

.phase5-policy-card,
.quote-card {
    border-color: #f0d68f;
    background: #fff8e5;
}

.phase5-message[data-kind="success"],
.phase5-form-message[data-kind="success"],
.phase5-account-message[data-kind="success"] {
    color: #126b63;
}

.phase5-message[data-kind="error"],
.phase5-form-message[data-kind="error"],
.phase5-account-message[data-kind="error"] {
    color: #a33327;
}

.booking-tool .form-control:focus,
.booking-tool .form-select:focus,
.account-hub .form-control:focus,
.account-hub .form-select:focus,
.phase5-section .form-control:focus,
.phase5-section .form-select:focus,
.cricket-console .form-control:focus,
.cricket-console .form-select:focus {
    border-color: #7ea1ec;
    box-shadow: 0 0 0 .2rem rgb(36 89 211 / 17%);
}

.slot-choice:not(:disabled):hover,
.slot-choice[aria-pressed="true"] {
    border-color: var(--arena-primary);
    background: var(--arena-blue-tint);
}

.slot-choice:focus-visible,
.cricket-tabs .nav-link:focus-visible,
.cricket-directory-switch .btn:focus-visible,
.cricket-console button:focus-visible,
.phase5-tabs .nav-link:focus-visible,
.phase5-section button:focus-visible,
.account-hub button:focus-visible {
    outline-color: var(--arena-primary);
}

.cricket-console a:focus-visible,
.skip-link:focus-visible {
    outline-color: var(--arena-orange);
}

/* Sport-forward visual refresh: photography, layered depth, and restrained motion. */
html {
    scroll-padding-top: 5.5rem;
}

.site-header {
    position: sticky;
    top: 0;
    z-index: 100;
    border-bottom: 1px solid rgb(255 255 255 / 9%);
    background: rgb(13 34 68 / 94%);
    box-shadow: 0 .35rem 1.5rem rgb(7 23 49 / 12%);
    backdrop-filter: blur(18px);
}

.site-header .navbar {
    min-height: 4.55rem;
}

.brand-mark {
    position: relative;
    overflow: hidden;
    border: 1px solid rgb(255 255 255 / 24%);
    border-radius: .78rem .78rem .78rem .24rem;
    box-shadow: 0 .35rem .9rem rgb(255 200 87 / 18%);
    transition: transform .28s ease, box-shadow .28s ease;
}

.brand-lockup:hover .brand-mark {
    transform: rotate(-5deg) translateY(-2px);
    box-shadow: 0 .55rem 1.2rem rgb(255 200 87 / 28%);
}

.site-header .nav-link {
    position: relative;
    padding-inline: .1rem;
}

.site-header .nav-link::after {
    position: absolute;
    right: 0;
    bottom: .1rem;
    left: 0;
    height: 2px;
    transform: scaleX(0);
    transform-origin: right;
    background: var(--arena-lime);
    content: "";
    transition: transform .24s ease;
}

.site-header .nav-link:hover::after,
.site-header .nav-link:focus-visible::after {
    transform: scaleX(1);
    transform-origin: left;
}

.preview-chip {
    border-color: rgb(255 255 255 / 17%);
    background: rgb(255 255 255 / 5%);
    backdrop-filter: blur(8px);
}

.hero-section {
    isolation: isolate;
    min-height: 39rem;
    background: #0c1e39;
}

.hero-media {
    position: absolute;
    z-index: 0;
    inset: 0 0 0 auto;
    width: min(78%, 90rem);
    overflow: hidden;
    pointer-events: none;
}

.hero-media::after {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, #0c1e39 0%, rgb(12 30 57 / 84%) 19%, rgb(12 30 57 / 40%) 48%, rgb(12 30 57 / 8%) 100%),
        linear-gradient(0deg, #0c1e39 0%, rgb(12 30 57 / 8%) 42%, rgb(12 30 57 / 14%) 100%);
    content: "";
}

.hero-photo {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 57% center;
    opacity: .96;
    transform: scale(1.04);
    animation: arena-hero-drift 26s ease-in-out infinite alternate;
    will-change: transform;
}

.hero-container {
    z-index: 2;
    padding-top: clamp(3.6rem, 6.7vw, 6rem);
    padding-bottom: 1rem;
}

.hero-container > .row {
    min-height: 31rem;
}

.hero-glow {
    z-index: 1;
}

.hero-glow-one {
    animation: arena-glow-breathe 11s ease-in-out infinite alternate;
}

.hero-glow-two {
    animation: arena-glow-breathe 14s ease-in-out -4s infinite alternate-reverse;
}

.hero-copy h1 {
    max-width: 12ch;
    font-size: clamp(3.6rem, 7.15vw, 6.55rem);
    font-weight: 900;
    letter-spacing: -.085em;
    line-height: .94;
    text-wrap: balance;
}

.hero-copy h1 span {
    color: #ffd06a;
    text-shadow: 0 .2rem 1.4rem rgb(255 200 87 / 13%);
}

.hero-lede {
    max-width: 36rem;
    color: rgb(255 255 255 / 82%);
    line-height: 1.7;
}

.hero-actions .btn-brand {
    border: 1px solid rgb(255 255 255 / 18%);
    background: linear-gradient(135deg, #ffd16e 0%, #ffbd46 100%);
    color: #10264b;
    box-shadow: 0 .8rem 2rem rgb(255 190 70 / 24%);
    transition: transform .25s ease, box-shadow .25s ease, background .25s ease;
}

.hero-actions .btn-brand:hover,
.hero-actions .btn-brand:focus-visible {
    transform: translateY(-3px);
    background: #ffe09b;
    box-shadow: 0 1rem 2.2rem rgb(255 190 70 / 32%);
}

.hero-actions .btn-brand span,
.facility-card-cta span {
    display: inline-block;
    margin-left: .35rem;
    transition: transform .25s ease;
}

.hero-actions .btn-brand:hover span,
.facility-card-cta:hover span {
    transform: translate(3px, -2px);
}

.hero-text-link span {
    display: inline-block;
    transition: transform .25s ease;
}

.hero-text-link:hover span {
    transform: translateY(3px);
}

.hero-proof-row {
    gap: 1rem;
}

.hero-proof {
    min-width: 12rem;
    border: 1px solid rgb(255 255 255 / 11%);
    border-radius: .85rem;
    padding: .65rem .8rem;
    background: rgb(255 255 255 / 5%);
    backdrop-filter: blur(8px);
}

.proof-icon {
    width: 2.15rem;
    height: 2.15rem;
    border-color: rgb(255 208 106 / 45%);
    border-radius: .7rem;
    background: rgb(255 208 106 / 10%);
    color: #ffd06a;
}

.hero-panel {
    border-color: rgb(255 255 255 / 21%);
    border-radius: 1.4rem;
    background: rgb(8 24 47 / 66%);
    box-shadow: 0 1.5rem 4rem rgb(0 0 0 / 26%), inset 0 1px rgb(255 255 255 / 8%);
    backdrop-filter: blur(18px) saturate(120%);
    animation: arena-panel-enter .9s cubic-bezier(.2,.75,.25,1) .12s both;
}

.hero-panel h2 {
    font-size: 1.52rem;
    letter-spacing: -.045em;
}

.panel-ball {
    background: linear-gradient(145deg, #ff906b, #f15a3a);
    box-shadow: inset -.45rem -.45rem 0 rgb(0 0 0 / 11%), 0 .6rem 1.3rem rgb(241 90 58 / 25%);
    animation: arena-ball-float 5.5s ease-in-out infinite;
}

.format-row {
    transition: padding .24s ease, background .24s ease;
}

.format-row:hover {
    padding-inline: .4rem;
    background: rgb(255 255 255 / 5%);
}

.format-arrow {
    transition: transform .24s ease, color .24s ease;
}

.format-row:hover .format-arrow {
    transform: translate(2px, -2px);
    color: var(--arena-lime);
}

.hero-bottomline {
    position: relative;
    color: rgb(255 255 255 / 56%);
}

.hero-bottomline::before {
    position: absolute;
    top: -1px;
    left: 0;
    width: 5.5rem;
    height: 2px;
    background: linear-gradient(90deg, #ffd06a, transparent);
    content: "";
}

.hero-copy > .eyebrow,
.hero-copy > h1,
.hero-copy > .hero-lede,
.hero-copy > .hero-actions,
.hero-copy > .hero-proof-row {
    opacity: 0;
    animation: arena-copy-enter .72s cubic-bezier(.2,.75,.25,1) both;
}

.hero-copy > .eyebrow { animation-delay: .04s; }
.hero-copy > h1 { animation-delay: .12s; }
.hero-copy > .hero-lede { animation-delay: .2s; }
.hero-copy > .hero-actions { animation-delay: .28s; }
.hero-copy > .hero-proof-row { animation-delay: .36s; }

.section-space {
    padding-top: clamp(4rem, 7vw, 6.2rem);
    padding-bottom: clamp(4rem, 7vw, 6.2rem);
}

.section-heading-row {
    margin-bottom: clamp(1.5rem, 2.4vw, 2rem);
}

.section-title {
    max-width: 22ch;
    font-size: clamp(2rem, 3.6vw, 3rem);
    font-weight: 900;
    letter-spacing: -.075em;
}

.section-intro {
    max-width: 24rem;
    line-height: 1.7;
}

.facilities-section {
    position: relative;
    background:
        radial-gradient(ellipse at 8% 28%, rgb(36 89 211 / 5%), transparent 28rem),
        linear-gradient(180deg, #f8faff 0%, #f2f6ff 100%);
}

.facility-grid > [class*="col-"] {
    display: flex;
}

.facility-card {
    width: 100%;
    min-height: 0;
    padding: 0;
    border: 1px solid rgb(21 51 93 / 10%);
    border-radius: 1.35rem;
    background: #fff;
    box-shadow: 0 .8rem 2rem rgb(16 42 81 / 7%);
    transition: transform .36s cubic-bezier(.2,.75,.25,1), box-shadow .36s ease, border-color .36s ease;
}

.facility-card:hover {
    transform: translateY(-8px);
    border-color: rgb(36 89 211 / 22%);
    box-shadow: 0 1.25rem 2.8rem rgb(16 42 81 / 15%);
}

.facility-photo {
    position: relative;
    height: clamp(11rem, 15vw, 13rem);
    overflow: hidden;
    margin: 0;
    background: #112846;
}

.facility-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .8s cubic-bezier(.2,.7,.2,1), filter .6s ease;
}

.facility-card:hover .facility-photo img {
    transform: scale(1.075);
    filter: saturate(1.08);
}

.facility-photo::after {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgb(7 20 39 / 18%) 0%, transparent 36%, rgb(7 20 39 / 46%) 100%);
    content: "";
}

.facility-photo-tag {
    position: absolute;
    z-index: 1;
    bottom: .9rem;
    left: 1rem;
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    border: 1px solid rgb(255 255 255 / 28%);
    border-radius: 999px;
    padding: .38rem .62rem;
    background: rgb(8 24 47 / 74%);
    color: #fff;
    font-size: .62rem;
    font-weight: 850;
    letter-spacing: .1em;
    backdrop-filter: blur(10px);
}

.facility-photo-tag span {
    color: #ffd06a;
    font-size: .72rem;
}

.facility-card-body {
    display: flex;
    min-height: 13.8rem;
    flex-direction: column;
    padding: 1.2rem 1.25rem 1.25rem;
}

.facility-card-top {
    margin-bottom: .85rem;
}

.facility-card .facility-icon {
    width: 2.35rem;
    height: 2.35rem;
    border: 1px solid rgb(36 89 211 / 8%);
    border-radius: .76rem;
}

.facility-index {
    color: #6f7f98;
    font-size: .63rem;
    letter-spacing: .13em;
}

.facility-card h3 {
    margin-bottom: .45rem;
    font-size: 1.28rem;
    font-weight: 900;
    letter-spacing: -.05em;
}

.facility-card p {
    color: #5c6d86;
    line-height: 1.65;
}

.facility-tags {
    margin-top: .85rem;
}

.facility-tags span {
    border: 1px solid #dce6f8;
    background: #f3f7ff;
    color: #3f5680;
}

.facility-card-cta {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    gap: .25rem;
    margin-top: auto;
    padding-top: 1.1rem;
    color: #174fc2;
    font-size: .78rem;
    font-weight: 900;
    text-decoration: none;
}

.facility-card-cta:hover,
.facility-card-cta:focus-visible {
    color: #102f81;
    text-decoration: underline;
    text-underline-offset: .24rem;
}

.locations-strip {
    margin-top: 1.35rem;
    border-color: rgb(21 51 93 / 10%);
    border-radius: 1rem;
    padding: .95rem 1.1rem;
    background: rgb(255 255 255 / 88%);
    box-shadow: 0 .55rem 1.5rem rgb(16 42 81 / 5%);
    transition: transform .3s ease, box-shadow .3s ease;
}

.locations-strip:hover {
    transform: translateY(-2px);
    box-shadow: 0 .85rem 1.9rem rgb(16 42 81 / 9%);
}

.locations-icon {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: .8rem;
    background: linear-gradient(145deg, #173f7f, #10264b);
    box-shadow: 0 .45rem 1rem rgb(16 38 75 / 19%);
}

.booking-shell,
.booking-tool,
.account-hub,
.cricket-console,
.phase5-shell,
.phase5-guest-card {
    border: 1px solid rgb(18 46 86 / 8%);
    border-radius: 1.35rem;
    box-shadow: 0 1.1rem 2.8rem rgb(22 57 112 / 9%);
}

.cricket-section,
.account-section {
    background:
        radial-gradient(ellipse at 92% 2%, rgb(36 89 211 / 5%), transparent 28rem),
        #f6f8fc;
}

.phase5-section {
    background:
        radial-gradient(ellipse at 2% 12%, rgb(17 139 128 / 6%), transparent 24rem),
        #f5f8f6;
}

.booking-section {
    padding-top: clamp(3rem, 5vw, 4.5rem);
    background: linear-gradient(180deg, #f1f5fc 0%, #f8faff 100%);
}

.booking-shell {
    box-shadow: 0 1.5rem 3.4rem rgb(16 42 81 / 14%);
}

.payment-note {
    border-color: rgb(21 51 93 / 10%);
    border-radius: 1rem;
    box-shadow: 0 .55rem 1.5rem rgb(16 42 81 / 5%);
}

.btn,
.nav-link,
.format-row,
.cricket-directory-card,
.phase5-result-card,
.account-card,
.locations-link {
    transition-timing-function: cubic-bezier(.2,.75,.25,1);
}

.btn:not(:disabled):hover {
    transform: translateY(-2px);
}

.btn:focus-visible,
a:focus-visible,
button:focus-visible {
    outline: 3px solid rgb(255 200 87 / 85%);
    outline-offset: 3px;
}

html.motion-ready [data-reveal="up"] {
    opacity: 0;
    transform: translate3d(0, 26px, 0);
    transition: opacity .68s cubic-bezier(.2,.75,.25,1), transform .68s cubic-bezier(.2,.75,.25,1);
    transition-delay: var(--reveal-delay, 0ms);
}

html.motion-ready [data-reveal="left"] {
    opacity: 0;
    transform: translate3d(-24px, 0, 0);
    transition: opacity .68s cubic-bezier(.2,.75,.25,1), transform .68s cubic-bezier(.2,.75,.25,1);
    transition-delay: var(--reveal-delay, 0ms);
}

html.motion-ready [data-reveal].is-revealed {
    opacity: 1;
    transform: none;
}

@keyframes arena-hero-drift {
    from { transform: scale(1.04) translate3d(0, 0, 0); }
    to { transform: scale(1.095) translate3d(-.6%, -1%, 0); }
}

@keyframes arena-glow-breathe {
    from { opacity: .65; transform: translate3d(0, 0, 0) scale(.96); }
    to { opacity: 1; transform: translate3d(-1rem, .8rem, 0) scale(1.05); }
}

@keyframes arena-ball-float {
    0%, 100% { transform: translateY(0) rotate(-25deg); }
    50% { transform: translateY(-7px) rotate(12deg); }
}

@keyframes arena-copy-enter {
    from { opacity: 0; transform: translate3d(0, 18px, 0); }
    to { opacity: 1; transform: translate3d(0, 0, 0); }
}

@keyframes arena-panel-enter {
    from { opacity: 0; transform: translate3d(0, 18px, 0) scale(.985); }
    to { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
}

@media (max-width: 991.98px) {
    .site-header .navbar-collapse {
        border-top: 1px solid rgb(255 255 255 / 10%);
        margin-top: .6rem;
        padding-top: .75rem;
    }

    .hero-section {
        min-height: 0;
    }

    .hero-media {
        width: 91%;
    }

    .hero-container > .row {
        min-height: 0;
    }

    .hero-panel {
        max-width: 34rem;
    }
}

@media (max-width: 767.98px) {
    .hero-media {
        width: 100%;
        opacity: .58;
    }

    .hero-media::after {
        background:
            linear-gradient(90deg, rgb(12 30 57 / 88%) 0%, rgb(12 30 57 / 52%) 76%, rgb(12 30 57 / 35%) 100%),
            linear-gradient(0deg, #0c1e39 0%, rgb(12 30 57 / 12%) 58%);
    }

    .hero-container {
        padding-top: 3.5rem;
    }

    .hero-copy h1 {
        max-width: 11ch;
        font-size: clamp(3.2rem, 10.5vw, 5.2rem);
    }

    .hero-proof-row {
        gap: .65rem;
    }

    .hero-proof {
        min-width: 0;
        flex: 1 1 10rem;
    }

    .facility-photo {
        height: 13rem;
    }
}

@media (max-width: 575.98px) {
    .hero-container {
        padding-top: 2.8rem;
    }

    .hero-copy h1 {
        font-size: clamp(3rem, 13vw, 4.4rem);
    }

    .hero-proof {
        padding: .55rem .6rem;
    }

    .hero-proof small {
        font-size: .66rem;
    }

    .hero-bottomline {
        gap: 1rem;
        line-height: 1.5;
    }

    .hero-bottomline span:last-child {
        max-width: 12rem;
        text-align: right;
    }

    .facility-photo {
        height: 12.2rem;
    }

    .facility-card-body {
        min-height: 14.8rem;
        padding: 1rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }

    .hero-photo,
    .hero-glow-one,
    .hero-glow-two,
    .panel-ball,
    .hero-panel,
    .hero-copy > *,
    .brand-mark {
        animation: none !important;
    }

    .hero-copy > * {
        opacity: 1 !important;
        transform: none !important;
    }

    .facility-card,
    .facility-photo img,
    .locations-strip,
    .panel-ball,
    .btn,
    .nav-link {
        transition: none !important;
    }

    html.motion-ready [data-reveal] {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}

/* Cricket-specific ambient motion: a soft ball flight path and wicket silhouette. */
.hero-cricket-ambient {
    position: absolute;
    z-index: 1;
    inset: 0 0 0 auto;
    width: min(100%, 90rem);
    overflow: hidden;
    pointer-events: none;
    opacity: .975;
}

.cricket-flight-path {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: visible;
}

.cricket-flight-path path {
    fill: none;
    stroke: rgb(255 255 255 / 57%);
    stroke-width: 2.2;
    stroke-dasharray: 4 9;
    stroke-linecap: round;
    animation: cricket-flight-trace 8s linear infinite;
}

.cricket-flight-path .cricket-flight-path-secondary {
    stroke-width: 1.7;
    stroke-dasharray: 2 12;
    animation: cricket-flight-trace-reverse 10s linear infinite;
}

.cricket-ball-flight {
    position: absolute;
    top: 16%;
    left: 88%;
    display: block;
    width: 1.5rem;
    height: 1.5rem;
    border: 1px solid rgb(255 239 229 / 88%);
    border-radius: 50%;
    background: radial-gradient(circle at 32% 28%, #ffd0a9 0%, #ff6b55 35%, #a91f36 100%);
    box-shadow: 0 0 0 .45rem rgb(245 90 66 / 20%), 0 0 1.35rem rgb(255 107 74 / 92%), inset -.18rem -.18rem .24rem rgb(65 12 30 / 42%);
    opacity: .975;
    animation: cricket-ball-flight 8s cubic-bezier(.45, 0, .2, 1) infinite;
    will-change: left, top, transform, opacity;
}

.cricket-ball-flight-secondary {
    width: 1.15rem;
    height: 1.15rem;
    animation-name: cricket-ball-flight-secondary;
    animation-duration: 11s;
    animation-delay: -5s;
    animation-timing-function: cubic-bezier(.45, 0, .2, 1);
}

.cricket-ball-seam {
    position: absolute;
    inset: .12rem .34rem;
    display: block;
    transform: rotate(39deg);
    border-right: 1px dashed rgb(255 248 241 / 92%);
    border-left: 1px dashed rgb(255 248 241 / 92%);
    border-radius: 50%;
}

.cricket-wicket-silhouette {
    position: absolute;
    right: 9%;
    bottom: 11%;
    display: flex;
    width: 4.3rem;
    height: 4.6rem;
    align-items: flex-end;
    justify-content: space-between;
    padding: 0 .35rem;
    opacity: .28;
    filter: drop-shadow(0 0 .85rem rgb(255 255 255 / 45%));
    animation: cricket-wicket-glow 5.2s ease-in-out infinite alternate;
}

.cricket-wicket-silhouette::before {
    position: absolute;
    top: .18rem;
    right: .26rem;
    left: .26rem;
    height: .12rem;
    border-radius: 999px;
    background: linear-gradient(90deg, transparent, rgb(255 255 255 / 85%) 18%, rgb(255 255 255 / 85%) 82%, transparent);
    content: "";
}

.cricket-wicket-silhouette i {
    display: block;
    width: .12rem;
    height: 3.95rem;
    border-radius: 999px;
    background: linear-gradient(90deg, rgb(255 255 255 / 20%), rgb(255 255 255 / 90%), rgb(255 255 255 / 35%));
}

@keyframes cricket-flight-trace {
    0%, 100% { stroke-dashoffset: 0; opacity: .34; }
    50% { stroke-dashoffset: -155; opacity: .68; }
}

@keyframes cricket-flight-trace-reverse {
    0%, 100% { stroke-dashoffset: 0; opacity: .28; }
    50% { stroke-dashoffset: 145; opacity: .55; }
}

@keyframes cricket-ball-flight {
    0% { left: 88%; top: 16%; opacity: 0; transform: scale(.62) rotate(0deg); }
    8% { opacity: .9; }
    30% { left: 68%; top: 11%; opacity: .9; transform: scale(.9) rotate(145deg); }
    55% { left: 48%; top: 35%; opacity: .88; transform: scale(1) rotate(290deg); }
    78% { left: 26%; top: 67%; opacity: .78; transform: scale(.82) rotate(430deg); }
    92% { left: 8%; top: 58%; opacity: .5; transform: scale(.7) rotate(560deg); }
    100% { left: 4%; top: 56%; opacity: 0; transform: scale(.55) rotate(650deg); }
}

@keyframes cricket-ball-flight-secondary {
    0% { left: 2%; top: 72%; opacity: 0; transform: scale(.55) rotate(0deg); }
    10% { opacity: .78; }
    27% { left: 20%; top: 82%; opacity: .82; transform: scale(.8) rotate(140deg); }
    51% { left: 52%; top: 53%; opacity: .92; transform: scale(1) rotate(300deg); }
    76% { left: 78%; top: 27%; opacity: .82; transform: scale(.9) rotate(465deg); }
    92% { left: 94%; top: 36%; opacity: .55; transform: scale(.72) rotate(590deg); }
    100% { left: 98%; top: 38%; opacity: 0; transform: scale(.55) rotate(650deg); }
}

@keyframes cricket-wicket-glow {
    from { opacity: .2; transform: translateY(0); }
    to { opacity: .36; transform: translateY(-5px); }
}

@media (max-width: 767.98px) {
    .hero-cricket-ambient {
        right: 0;
        width: 100%;
        opacity: .86;
    }

    .cricket-ball-flight {
        animation-name: cricket-ball-flight-mobile;
    }

    .cricket-ball-flight-secondary {
        animation-name: cricket-ball-flight-secondary-mobile;
    }

    .cricket-wicket-silhouette {
        right: 13%;
        bottom: 8%;
        transform: scale(.78);
        transform-origin: bottom right;
    }

    @keyframes cricket-ball-flight-mobile {
        0% { left: 88%; top: 12%; opacity: 0; transform: scale(.55) rotate(0deg); }
        10% { opacity: .82; }
        35% { left: 70%; top: 18%; opacity: .78; transform: scale(.82) rotate(160deg); }
        62% { left: 48%; top: 37%; opacity: .72; transform: scale(.9) rotate(330deg); }
        86% { left: 28%; top: 53%; opacity: .52; transform: scale(.72) rotate(510deg); }
        100% { left: 24%; top: 53%; opacity: 0; transform: scale(.55) rotate(620deg); }
    }

    @keyframes cricket-ball-flight-secondary-mobile {
        0% { left: 2%; top: 72%; opacity: 0; transform: scale(.52) rotate(0deg); }
        12% { opacity: .74; }
        31% { left: 21%; top: 80%; opacity: .76; transform: scale(.75) rotate(140deg); }
        56% { left: 52%; top: 54%; opacity: .86; transform: scale(.9) rotate(300deg); }
        81% { left: 79%; top: 35%; opacity: .7; transform: scale(.78) rotate(465deg); }
        100% { left: 96%; top: 37%; opacity: 0; transform: scale(.52) rotate(650deg); }
    }
}

@media (prefers-reduced-motion: reduce) {
    .cricket-flight-path path,
    .cricket-ball-flight,
    .cricket-wicket-silhouette {
        animation: none !important;
    }

    .cricket-ball-flight {
        opacity: .22;
        transform: none;
    }

    .cricket-flight-path path {
        stroke-dashoffset: 0;
        opacity: .18;
    }
}

/* Low-contrast cricket field motion continues through the page below the hero. */
.facilities-section,
.cricket-section,
.phase5-section,
.booking-section,
.account-section {
    position: relative;
    isolation: isolate;
}

.facilities-section > .container,
.cricket-section > .container,
.phase5-section > .container,
.booking-section > .container,
.account-section > .container {
    position: relative;
    z-index: 1;
}

.facilities-section::before,
.cricket-section::before,
.phase5-section::before,
.booking-section::before,
.account-section::before,
.facilities-section::after,
.cricket-section::after,
.phase5-section::after,
.booking-section::after,
.account-section::after {
    position: absolute;
    z-index: 0;
    pointer-events: none;
    filter: brightness(1.25);
    content: "";
}

.facilities-section::before {
    top: 6.5rem;
    right: 3%;
    width: 18rem;
    height: 18rem;
    transform: rotate(-18deg);
    border: 1px dashed rgb(36 89 211 / 12%);
    border-radius: 50%;
    box-shadow: 0 0 0 1.6rem rgb(36 89 211 / 2.5%), 0 0 0 3.6rem rgb(36 89 211 / 1.5%);
    animation: body-ground-orbit 43s linear infinite;
}

.facilities-section::after {
    top: 10.5rem;
    right: 12%;
    width: .8rem;
    height: .8rem;
    border: 1px solid rgb(255 255 255 / 74%);
    border-radius: 50%;
    background: radial-gradient(circle at 30% 28%, #ffb394, #e34441 55%, #9e233e 100%);
    box-shadow: 0 0 0 .32rem rgb(239 80 64 / 7%), 0 0 .9rem rgb(239 80 64 / 22%);
    animation: body-ball-roll 10s ease-in-out infinite;
}

.cricket-section::before {
    top: 15%;
    left: 2%;
    width: 23rem;
    height: 14rem;
    transform: rotate(-19deg);
    border: 1px solid rgb(36 89 211 / 8%);
    border-radius: 50%;
    box-shadow: inset 0 0 0 1.8rem rgb(36 89 211 / 1.4%), 0 0 0 1rem rgb(36 89 211 / 1.4%);
    animation: body-pitch-sway 14s ease-in-out infinite alternate;
}

.cricket-section::after {
    top: 12%;
    right: 4%;
    width: 21rem;
    height: 21rem;
    border-radius: 50%;
    background: radial-gradient(circle, rgb(36 89 211 / 7%) 0%, rgb(36 89 211 / 2%) 40%, transparent 72%);
    animation: body-stadium-glow 14s ease-in-out infinite alternate;
}

.phase5-section::before {
    top: 12%;
    right: 4%;
    width: 17rem;
    height: 17rem;
    transform: rotate(12deg);
    border: 1px dashed rgb(17 139 128 / 13%);
    border-radius: 50%;
    box-shadow: 0 0 0 1.4rem rgb(17 139 128 / 2%), 0 0 0 3rem rgb(17 139 128 / 1.4%);
    animation: body-ground-orbit 53s linear infinite reverse;
}

.phase5-section::after {
    bottom: 9%;
    left: 5%;
    width: 15rem;
    height: 8rem;
    transform: rotate(-18deg);
    border-top: 1px dashed rgb(17 139 128 / 14%);
    border-radius: 50%;
    animation: body-pitch-sway 11s ease-in-out infinite alternate-reverse;
}

.booking-section::before {
    top: 13%;
    right: 5%;
    width: 22rem;
    height: 13rem;
    transform: rotate(17deg);
    border: 1px dashed rgb(36 89 211 / 9%);
    border-radius: 50%;
    box-shadow: inset 0 0 0 1.2rem rgb(36 89 211 / 1.5%);
    animation: body-pitch-sway 15s ease-in-out infinite alternate;
}

.booking-section::after {
    top: 18%;
    right: 13%;
    width: .72rem;
    height: .72rem;
    border-radius: 50%;
    background: radial-gradient(circle at 30% 28%, #ffd16e, #ff8759 60%, #e55238 100%);
    box-shadow: 0 0 0 .28rem rgb(255 135 89 / 7%), 0 0 .8rem rgb(255 135 89 / 25%);
    animation: body-ball-roll 12s ease-in-out -5s infinite;
}

.account-section::before {
    top: 12%;
    left: 4%;
    width: 14rem;
    height: 14rem;
    transform: rotate(-12deg);
    border: 1px dashed rgb(36 89 211 / 9%);
    border-radius: 50%;
    box-shadow: 0 0 0 1.4rem rgb(36 89 211 / 1.5%), 0 0 0 3rem rgb(36 89 211 / 1%);
    animation: body-ground-orbit 58s linear infinite;
}

.account-section::after {
    top: 25%;
    left: 13%;
    width: .65rem;
    height: .65rem;
    border: 1px solid rgb(255 255 255 / 70%);
    border-radius: 50%;
    background: radial-gradient(circle at 32% 28%, #ffb394, #e34441 56%, #9e233e 100%);
    box-shadow: 0 0 0 .28rem rgb(239 80 64 / 5%), 0 0 .75rem rgb(239 80 64 / 19%);
    animation: body-ball-roll 14s ease-in-out -8s infinite;
}

@keyframes body-ground-orbit {
    from { rotate: 0deg; }
    to { rotate: 360deg; }
}

@keyframes body-ball-roll {
    0%, 100% { translate: 0 0; opacity: .56; }
    50% { translate: -3.125rem 1.75rem; opacity: 1; }
}

@keyframes body-pitch-sway {
    from { transform: translate3d(0, 0, 0) rotate(-19deg); opacity: .56; }
    to { transform: translate3d(1.5rem, 1rem, 0) rotate(-13deg); opacity: 1; }
}

@keyframes body-stadium-glow {
    from { transform: translate3d(0, 0, 0) scale(.875); opacity: .69; }
    to { transform: translate3d(-1.25rem, 1.5rem, 0) scale(1.1); opacity: 1; }
}

@media (max-width: 767.98px) {
    .facilities-section::before,
    .cricket-section::before,
    .phase5-section::before,
    .booking-section::before,
    .account-section::before {
        opacity: .69;
    }

    .facilities-section::after,
    .booking-section::after,
    .account-section::after {
        opacity: .5;
    }
}

@media (prefers-reduced-motion: reduce) {
    .facilities-section::before,
    .facilities-section::after,
    .cricket-section::before,
    .cricket-section::after,
    .phase5-section::before,
    .phase5-section::after,
    .booking-section::before,
    .booking-section::after,
    .account-section::before,
    .account-section::after {
        animation: none !important;
    }
}

/* Mobile navigation sizing/alignment and an unmistakable, centered menu control. */
@media (max-width: 991.98px) {
    .site-header .navbar {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        column-gap: .55rem;
    }

    .site-header .navbar-brand {
        min-width: 0;
        margin-right: auto;
    }

    .site-header .navbar-toggler.nav-toggle {
        display: grid !important;
        width: 2.85rem;
        height: 2.85rem;
        flex: 0 0 2.85rem;
        place-items: center;
        margin: 0 0 0 auto;
        padding: 0;
        border: 1px solid rgb(255 255 255 / 36%);
        border-radius: .78rem;
        background: rgb(255 255 255 / 7%);
        color: var(--arena-white);
        line-height: 1;
        box-shadow: 0 .35rem .9rem rgb(0 0 0 / 14%) !important;
    }

    .site-header .navbar-toggler.nav-toggle:hover {
        border-color: rgb(211 243 107 / 70%);
        background: rgb(255 255 255 / 12%);
    }

    .nav-toggle-icon {
        width: 1.5rem;
        height: 1.5rem;
        flex: 0 0 1.5rem;
        color: #fff;
    }

    .nav-toggle-icon-line {
        stroke: currentColor;
        stroke-width: 2.2;
        stroke-linecap: round;
        transform-box: fill-box;
        transform-origin: center;
        transition: transform .2s ease, opacity .16s ease;
    }

    .nav-toggle[aria-expanded="true"] .nav-toggle-icon-line-top {
        transform: translateY(6px) rotate(45deg);
    }

    .nav-toggle[aria-expanded="true"] .nav-toggle-icon-line-middle {
        opacity: 0;
        transform: scaleX(.35);
    }

    .nav-toggle[aria-expanded="true"] .nav-toggle-icon-line-bottom {
        transform: translateY(-6px) rotate(-45deg);
    }

    .site-header .navbar-collapse {
        flex-basis: 100%;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        margin: .75rem 0 0;
        padding: .7rem 0 .25rem;
        border-top: 1px solid rgb(255 255 255 / 14%);
    }

    .site-header .navbar-nav {
        display: flex;
        width: 100%;
        flex-direction: column;
        align-items: stretch !important;
        gap: .15rem !important;
        margin: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-top: 0 !important;
    }

    .site-header .navbar-nav > .nav-item {
        display: block;
        width: 100%;
    }

    .site-header .navbar-nav > .nav-item > .nav-link {
        display: flex;
        width: 100%;
        min-height: 2.75rem;
        align-items: center;
        justify-content: flex-start;
        padding: .65rem .75rem !important;
        border-radius: .6rem;
        text-align: left;
        line-height: 1.35;
    }

    .site-header .navbar-nav > .nav-item > .nav-link::after {
        display: none;
    }

    .site-header .navbar-nav > .nav-item:last-child {
        padding: .45rem .75rem .15rem;
    }
}

/* Keep the mobile brand/toggler edges aligned with the page's section content. */
@media (max-width: 991.98px) {
    :root {
        --arena-mobile-inline-gutter: 1rem;
    }

    .site-header .navbar,
    main > section > .container {
        padding-inline: var(--arena-mobile-inline-gutter);
    }
}

/* Prevent oversized decorative pitch rings from widening the mobile page. */
@media (max-width: 767.98px) {
    main {
        overflow-x: clip;
    }

    .facilities-section::before,
    .facilities-section::after,
    .cricket-section::before,
    .cricket-section::after,
    .phase5-section::before,
    .phase5-section::after,
    .booking-section::before,
    .booking-section::after,
    .account-section::before,
    .account-section::after {
        max-width: calc(100% - 2rem);
    }
}

/*
 * Wide, low-contrast field lights keep the sport motion distributed behind
 * the content. Each moving field spans roughly 20%+ of a normal viewport;
 * the smaller ball accents travel across it without catching pointer events.
 */
.facilities-section::before,
.cricket-section::before,
.phase5-section::before,
.booking-section::before,
.account-section::before {
    width: min(72vw, 140rem);
    height: min(68vh, 100rem);
    border-width: 2px;
    background: radial-gradient(ellipse at 48% 48%, rgb(36 89 211 / 10%) 0%, rgb(36 89 211 / 4%) 40%, transparent 76%);
    animation: body-field-drift 22s ease-in-out infinite alternate;
}

.facilities-section::before {
    border-color: rgb(36 89 211 / 24%);
    background: radial-gradient(ellipse at 48% 48%, rgb(36 89 211 / 13%) 0%, rgb(36 89 211 / 5%) 42%, transparent 76%);
    animation-duration: 21s;
    animation-delay: -4s;
}

.cricket-section::before {
    border-color: rgb(255 135 89 / 25%);
    background: radial-gradient(ellipse at 48% 48%, rgb(255 135 89 / 14%) 0%, rgb(255 135 89 / 5%) 42%, transparent 76%);
    animation-duration: 19s;
    animation-delay: -9s;
}

.phase5-section::before {
    border-color: rgb(17 139 128 / 24%);
    background: radial-gradient(ellipse at 48% 48%, rgb(17 139 128 / 13%) 0%, rgb(17 139 128 / 5%) 42%, transparent 76%);
    animation-duration: 24s;
    animation-delay: -13s;
}

.booking-section::before {
    border-color: rgb(211 243 107 / 24%);
    background: radial-gradient(ellipse at 48% 48%, rgb(211 243 107 / 12%) 0%, rgb(211 243 107 / 5%) 42%, transparent 76%);
    animation-duration: 20s;
    animation-delay: -6s;
}

.account-section::before {
    border-color: rgb(123 145 241 / 24%);
    background: radial-gradient(ellipse at 48% 48%, rgb(123 145 241 / 13%) 0%, rgb(123 145 241 / 5%) 42%, transparent 76%);
    animation-duration: 23s;
    animation-delay: -11s;
}

.facilities-section::after,
.cricket-section::after,
.phase5-section::after,
.booking-section::after,
.account-section::after {
    width: clamp(1.2rem, 1.6vw, 1.65rem);
    height: clamp(1.2rem, 1.6vw, 1.65rem);
    border: 1px solid rgb(255 239 229 / 90%);
    border-radius: 50%;
    background: radial-gradient(circle at 32% 28%, #ffd0a9 0%, #ff6b55 35%, #a91f36 100%);
    box-shadow: 0 0 0 .35rem rgb(245 90 66 / 18%), 0 0 1.1rem rgb(255 107 74 / 58%), inset -.14rem -.15rem .18rem rgb(65 12 30 / 38%);
    animation: body-ball-cross-left 13s ease-in-out infinite alternate;
}

.facilities-section::after { animation-duration: 12s; animation-delay: -3s; }
.cricket-section::after { animation-duration: 15s; animation-delay: -8s; }
.phase5-section::after {
    animation-name: body-ball-cross-right;
    animation-duration: 14s;
    animation-delay: -5s;
}
.booking-section::after { animation-duration: 12.5s; animation-delay: -6s; }
.account-section::after {
    animation-name: body-ball-cross-right;
    animation-duration: 16s;
    animation-delay: -10s;
}

@keyframes body-field-drift {
    from { transform: translate3d(-4vw, -3vh, 0) rotate(-14deg) scale(.94); opacity: .5; }
    to { transform: translate3d(5vw, 5vh, 0) rotate(11deg) scale(1.04); opacity: .92; }
}

@keyframes body-ball-cross-left {
    from { transform: translate3d(0, 0, 0) rotate(-12deg) scale(.72); opacity: .48; }
    to { transform: translate3d(-42vw, 14vh, 0) rotate(438deg) scale(1.12); opacity: .98; }
}

@keyframes body-ball-cross-right {
    from { transform: translate3d(0, 0, 0) rotate(12deg) scale(.72); opacity: .48; }
    to { transform: translate3d(42vw, -12vh, 0) rotate(438deg) scale(1.12); opacity: .98; }
}

@media (prefers-reduced-motion: reduce) {
    .facilities-section::before,
    .cricket-section::before,
    .phase5-section::before,
    .booking-section::before,
    .account-section::before {
        animation: none !important;
        opacity: .34;
    }

    .facilities-section::after,
    .cricket-section::after,
    .phase5-section::after,
    .booking-section::after,
    .account-section::after {
        animation: none !important;
        opacity: .4;
        transform: none;
    }
}

/* Direct account routes render the sign-in panel without changing the URL. */
.login-page main > .account-section {
    display: flex;
    min-height: calc(100vh - 8rem);
    min-height: calc(100svh - 8rem);
    align-items: center;
    padding-block: clamp(2.5rem, 6vh, 4rem);
}

.login-page .account-section .section-heading-row {
    margin-bottom: 1.4rem;
}

.login-page .account-section::before,
.login-page .account-section::after {
    opacity: .35;
}