:root {
    color-scheme: dark;
    --bg: #0b1110;
    --surface: #131c19;
    --raised: #19241f;
    --ink: #edf3ee;
    --muted: #a5b5ab;
    --line: #2b3932;
    --accent: #bcdf7b;
    --green: #bcdf7b;
    font-family: "Segoe UI", Inter, Arial, sans-serif;
    color: var(--ink);
    background: var(--bg);
    font-synthesis: none;
}
* {box-sizing:border-box}
html {scroll-behavior:smooth;scroll-padding-top:28px}
body {margin:0;font-size:14px;line-height:1.6;background:radial-gradient(ellipse at 85% 0%,#1b2c212e,transparent 40%),var(--bg)}
h1,h2,h3,p {margin:0}
a {color:inherit;text-decoration:none}
button,input,select {font:inherit}
button,a {touch-action:manipulation}
button {cursor:pointer}
button:disabled {cursor:default;opacity:1}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible {outline:2px solid var(--accent);outline-offset:4px}
.icon {width:18px;height:18px;flex:none;vertical-align:middle}
.container,.header-inner {width:calc(100% - 80px);max-width:1160px;margin:auto}
.site-header {background:#0d1512;border-bottom:1px solid var(--line)}
.header-inner {height:88px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand {display:flex;align-items:center;gap:12px;font-size:25px;font-weight:650;letter-spacing:-1px;line-height:1.1}
.brand img {width:64px;height:64px;object-fit:contain;border-radius:12px;flex:none}
.logo-showcase {display:flex;justify-content:center;padding:18px 0}
.logo-showcase img {display:block;width:min(100%,280px);height:auto;aspect-ratio:1;object-fit:contain;border-radius:14px}
.brand small {display:block;margin-top:7px;font-size:8px;letter-spacing:3px;color:var(--muted);font-weight:500}
.site-header nav {display:flex;align-items:center;gap:34px;color:var(--muted);font-size:13px}
.site-header nav a {padding:30px 0;transition:color .15s}
.site-header nav a.active,.site-header nav a:hover {color:var(--accent)}
.site-header nav a.active {font-weight:600}
.header-tag {display:flex;gap:12px;align-items:center;padding:7px 12px;border:1px solid var(--line);border-radius:6px;font-size:10px;letter-spacing:1px;color:var(--muted)}
.header-tag i {width:4px;height:4px;border-radius:50%;background:var(--accent)}
.hero {display:grid;grid-template-columns:1.15fr 1fr;gap:70px;align-items:center;padding:64px 0 60px}
.eyebrow {display:flex;align-items:center;gap:8px;font-size:10px;font-weight:600;letter-spacing:1.8px;color:var(--accent);margin-bottom:16px}
.eyebrow i {width:5px;height:5px;background:var(--accent);border-radius:50%}
.hero h1 {font-size:60px;line-height:1.1;letter-spacing:-2.8px;font-weight:650}
.hero h1 em {font-style:normal;color:var(--accent)}
.hero-copy>p {max-width:410px;font-size:14px;color:var(--muted);line-height:1.85;margin:22px 0 25px}
.hero-facts {display:flex;align-items:center;flex-wrap:wrap;gap:24px;font-size:12px;color:#b6c6b9}
.hero-facts>span {display:flex;gap:8px;align-items:center}
.hero-facts .icon {width:16px;height:16px;color:var(--accent)}
.venue-visual {background:linear-gradient(145deg,#1e3528,#12241b);border:1px solid #35533d;border-radius:14px;padding:24px 26px;box-shadow:0 20px 60px #0003;position:relative}
.venue-heading {display:flex;justify-content:space-between;align-items:center;gap:15px;font-size:10px;letter-spacing:1.7px;color:#c4d3bc}
.venue-dot {width:7px;height:7px;background:var(--accent);border-radius:50%;box-shadow:0 0 12px #bcdf7b55}
.pitch-wrap {padding:25px 6px}
.pitch {position:relative;overflow:hidden;width:100%;aspect-ratio:1.9;border:1px solid #bcdf7b73;background:repeating-linear-gradient(90deg,#bcdf7b05 0,#bcdf7b05 12.5%,transparent 12.5%,transparent 25%)}
.midline {position:absolute;left:50%;top:0;bottom:0;width:1px;background:#bcdf7b73}
.center-circle {position:absolute;left:37.5%;top:26%;width:25%;aspect-ratio:1;border:1px solid #bcdf7b73;border-radius:50%}
.center-circle:after {content:"";position:absolute;left:calc(50% - 2px);top:calc(50% - 2px);width:4px;height:4px;border-radius:50%;background:var(--accent)}
.goal {position:absolute;top:22%;height:56%;width:16%;border:1px solid #bcdf7b73}
.goal.left,.penalty.left {left:-1px}
.goal.right,.penalty.right {right:-1px}
.penalty {position:absolute;top:35%;height:30%;width:7%;border:1px solid #bcdf7b73}
.venue-bottom {display:flex;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid #bcdf7b26;padding-top:17px;font-size:11px;color:#a8bda4}
.venue-bottom strong {font-size:10px;font-weight:550;letter-spacing:1.3px;color:var(--accent)}
.section-heading {display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px}
.section-heading h2 {font-size:28px;letter-spacing:-.7px;font-weight:600;line-height:1.3}
.section-heading p {margin-top:8px;color:var(--muted);font-size:13px}
.section-heading .eyebrow {font-size:9px;margin-bottom:9px}
.btn {display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:11px 17px;border:1px solid transparent;border-radius:7px;font-size:12px;font-weight:600;line-height:1.5;white-space:nowrap;transition:background .15s,border-color .15s}
.btn .icon {width:16px;height:16px}
.btn.primary {color:#18260f;background:var(--accent);border-color:var(--accent)}
.btn.primary:hover {background:#d0efa0;border-color:#d0efa0}
.btn.secondary {background:#18211d;color:#d9e5dc;border-color:#35463c}
.btn.secondary:hover {background:#25342b;border-color:#698253}
.btn:disabled {opacity:.55}
.schedule-panel {background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:0 12px 40px #0002}
.filters {display:flex;align-items:flex-end;gap:24px;padding:25px 28px;border-bottom:1px solid var(--line);background:#16201b}
.field {display:flex;flex-direction:column;gap:9px;flex:1;max-width:265px;font-size:12px;font-weight:500;color:#c7d4c9}
input,select {width:100%;min-width:0;padding:12px 14px;background:#0e1712;color:var(--ink);border:1px solid #3b4b3e;border-radius:7px;line-height:1.4;font-size:14px}
input:focus,select:focus {border-color:var(--accent)}
.filter-note {display:flex;align-items:center;gap:10px;font-size:11px;color:var(--muted);margin-left:auto;padding-bottom:5px;line-height:1.8}
.filter-note .icon {color:#a6bb97}
.date-strip {display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:12px;padding:23px 28px;border-bottom:1px solid var(--line)}
.date-choice {display:flex;flex-direction:column;align-items:center;gap:2px;background:#18231d;border:1px solid #304135;border-radius:8px;padding:10px 8px;color:var(--muted);transition:background .15s,border-color .15s}
.date-choice span {font-size:11px}
.date-choice strong {font-size:25px;line-height:1.5;font-weight:600;color:#e4ece3}
.date-choice small {font-size:10px}
.date-choice.selected {background:var(--accent);color:#344621;border-color:var(--accent)}
.date-choice.selected strong {color:#192911}
.date-choice:hover:not(.selected) {background:#26342a;border-color:#61734d}
.schedule-toolbar {display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px 28px 22px}
.schedule-toolbar h3 {font-size:17px;font-weight:600;letter-spacing:-.2px}
.schedule-toolbar>div>span {display:block;font-size:12px;color:var(--muted);margin-top:5px}
.legend {display:flex;align-items:center;flex-wrap:wrap;gap:16px;color:var(--muted);font-size:11px}
.legend>span {display:flex;align-items:center;gap:6px}
.legend i,.slot-status i {width:6px;height:6px;border-radius:50%;background:#bcdf7b;flex:none}
.legend i.booked {background:#e3a8af}
.legend i.held {background:#e1c27a}
.legend i.blocked {background:#a0b1c6}
.slots-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;padding:0 28px 25px}
.slot-card {--slot-ink:#d8e8d1;--slot-muted:#aec2a5;--slot-dot:#bcdf7b;display:flex;flex-direction:column;align-items:flex-start;min-width:0;min-height:168px;text-align:left;background:#19281e;border:1px solid #3a5133;border-radius:9px;padding:16px 17px 13px;color:var(--slot-ink);transition:background .15s,border-color .15s,transform .15s}
.slot-card.available:hover {background:#253724;border-color:#bcdf7b;transform:translateY(-2px)}
.slot-status {display:flex;align-items:center;gap:7px;font-size:11px;color:var(--slot-muted)}
.slot-status i {background:var(--slot-dot)}
.slot-time {font-size:22px;font-weight:600;letter-spacing:-.65px;white-space:nowrap;margin:12px 0 3px;font-variant-numeric:tabular-nums;line-height:1.5}
.slot-time>span {font-size:16px;font-weight:400;color:var(--slot-muted);margin:0 3px}
.slot-price {font-size:14px;color:var(--slot-ink)}
.slot-bottom {display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;margin-top:auto;padding-top:12px;border-top:1px solid #ffffff12;font-size:11px;color:var(--slot-muted)}
.slot-bottom .icon {width:14px;height:14px}
.slot-card.booked {--slot-ink:#edd3d8;--slot-muted:#d7afb7;--slot-dot:#e3a8af;background:#2a1e24;border-color:#4d343c}
.slot-card.held {--slot-ink:#f0dfb8;--slot-muted:#d7c28e;--slot-dot:#e1c27a;background:#29251c;border-color:#51452d}
.slot-card.blocked {--slot-ink:#d3deea;--slot-muted:#b0becf;--slot-dot:#a0b1c6;background:#1d252d;border-color:#37434f}
.slot-card.past,.slot-card.closed {--slot-ink:#b5c0b6;--slot-muted:#9eaba0;--slot-dot:#89958a;background:#1a211c;border-color:#2e3a30}
.schedule-footer {display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 28px;border-top:1px solid var(--line);background:#111b15;font-size:11px;color:var(--muted)}
.schedule-footer>span:last-child {display:flex;align-items:center;gap:5px;color:#c0d5a9}
.schedule-footer strong {font-weight:600;color:var(--accent)}
.schedule-footer i {width:5px;height:5px;flex:none;border-radius:50%;background:var(--accent);margin-right:4px}
.schedule-note {display:flex;align-items:flex-start;gap:9px;font-size:12px;color:#9fac9f;padding:16px 3px;line-height:1.8}
.schedule-note .icon {width:15px;height:15px;margin-top:3px;color:#a4b693}
.error-box {margin:20px 28px;padding:14px 17px;background:#32231f;color:#f0b5a2;border:1px solid #5b3a30;border-radius:7px;font-size:13px}
.error-box[hidden] {display:none}
.loading {grid-column:1/-1;text-align:center;padding:50px 20px;color:var(--muted)}
.info-grid {display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start;margin:30px 0 55px}
.info-card {background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:28px;scroll-margin-top:30px}
.info-card .eyebrow {font-size:9px;margin-bottom:10px}
.info-card h2 {font-size:23px;font-weight:600;letter-spacing:-.5px}
.info-card>p {font-size:12px;color:var(--muted);margin:8px 0 22px}
.table-scroll {overflow-x:auto}
table {width:100%;border-collapse:collapse;text-align:left;font-size:13px}
th {font-weight:500;font-size:11px;color:var(--muted);padding:12px 0;border-bottom:1px solid var(--line);white-space:nowrap}
td {padding:16px 0;border-bottom:1px solid #25332a;color:#e1e9df;white-space:nowrap;font-variant-numeric:tabular-nums}
td+td,th+th {text-align:right;padding-left:12px}
tbody tr:last-child td {border:0}
.tariff-note {display:flex;align-items:flex-start;gap:8px;font-size:12px;color:var(--muted);border-top:1px solid var(--line);padding-top:16px;margin-top:8px}
.tariff-note .icon {width:15px;height:15px;margin-top:3px;color:var(--accent)}
.steps {display:flex;flex-direction:column;gap:20px;margin:24px 0}
.steps>div {display:flex;align-items:flex-start;gap:13px}
.steps>div>span {display:grid;place-items:center;width:31px;height:31px;flex:none;background:#233123;border:1px solid #3a4d32;border-radius:7px;color:var(--accent);font-size:11px}
.steps h3 {font-size:13px;font-weight:600;color:#e1ebdb}
.steps p {font-size:12px;color:var(--muted);margin-top:4px}
.contact-box {display:flex;align-items:flex-start;gap:20px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:21px}
.contact-box strong {font-size:13px;font-weight:600;color:#e4ebdf}
.contact-box p {max-width:350px;font-size:12px;color:var(--muted);white-space:pre-line;margin-top:5px}
.contact-box>div>span {display:block;font-size:11px;color:#b6c6ad;margin-top:7px}
.contact-box .btn {font-size:12px;padding:10px 14px}
.site-footer {border-top:1px solid var(--line);background:#0d1511;padding:24px 0;color:#bbc8b9;font-size:12px}
.site-footer .container {display:flex;align-items:center;justify-content:space-between;gap:20px}
.site-footer small {display:block;font-size:11px;color:var(--muted);margin-top:3px}
.site-footer a {font-size:12px;color:#bdcea8}
.site-footer a:hover {color:var(--accent)}
.site-footer a span {margin-left:6px}
dialog {background:#151f19;border:1px solid #45583b;border-radius:13px;padding:0;width:490px;max-width:calc(100vw - 32px);max-height:calc(100dvh - 48px);color:var(--ink);box-shadow:0 24px 85px #0008}
dialog::backdrop {background:#050a08b3;backdrop-filter:blur(5px)}
.dialog-head {display:flex;align-items:center;justify-content:space-between;gap:15px;padding:23px 25px;border-bottom:1px solid var(--line)}
.dialog-head .eyebrow {font-size:9px;margin-bottom:5px}
.dialog-head h2 {font-size:20px;letter-spacing:-.4px;font-weight:600}
.close-button {display:grid;place-items:center;padding:7px;border:0;background:transparent;color:var(--muted);border-radius:6px}
.close-button:hover {background:#2b392b;color:var(--ink)}
.dialog-body {padding:24px 25px}
.selected-time {background:#1e2d20;border:1px solid #425737;border-radius:9px;padding:20px}
.dialog-status {display:flex;align-items:center;gap:7px;font-size:12px;color:var(--accent)}
.dialog-status .icon {width:15px;height:15px}
.dialog-status.changed {color:#e1c27a}
.selected-time h3 {font-size:32px;letter-spacing:-1px;font-weight:600;color:#e3f0d8;margin:8px 0 4px;font-variant-numeric:tabular-nums}
.selected-time h3 small {font-size:12px;font-weight:400;color:var(--muted);letter-spacing:0}
.selected-time p {font-size:12px;color:#b0c2a3}
.price-breakdown {margin-top:23px}
.price-breakdown h3 {font-size:13px;font-weight:600;color:#d1dec7;margin-bottom:10px}
.price-breakdown>div {display:flex;justify-content:space-between;gap:15px;font-size:13px;color:var(--muted);padding:10px 0;border-bottom:1px solid var(--line)}
.price-breakdown strong {font-weight:500;color:#e0e9dc}
.price-total {display:flex;align-items:center;justify-content:space-between;gap:15px;padding:18px 0;font-size:13px;color:var(--muted)}
.price-total strong {font-size:22px;font-weight:600;letter-spacing:-.4px;color:var(--accent)}
.deposit-note {display:flex;align-items:flex-start;gap:9px;padding:13px 15px;border-radius:7px;background:#202d20;font-size:12px;color:#bdceb0}
.deposit-note .icon {width:16px;height:16px;margin-top:2px;color:var(--accent)}
.deposit-note strong {font-weight:600;color:#dceccb}
.dialog-disclaimer {font-size:12px;line-height:1.8;color:var(--muted);margin:17px 0}
.dialog-actions {display:flex;justify-content:space-between;gap:10px;margin-top:20px}
.changed-notice {font-size:12px;color:#e1c27a;background:#302a1b;border:1px solid #51472c;border-radius:7px;padding:13px;margin-top:15px}
@media(max-width:1100px) {
    .container,.header-inner {width:calc(100% - 48px)}
    .hero {gap:40px;padding:52px 0}
    .hero h1 {font-size:54px}
    .slots-grid {grid-template-columns:repeat(3,minmax(0,1fr))}
    .info-card {padding:24px}
    .schedule-toolbar {align-items:flex-start;flex-direction:column;gap:14px}
}
@media(max-width:850px) {
    .header-tag {display:none}
    .header-inner {height:80px}
    .hero {gap:30px;grid-template-columns:1fr 1fr}
    .hero h1 {font-size:44px;letter-spacing:-1.8px}
    .hero-copy>p {font-size:13px}
    .hero-facts {gap:12px;font-size:11px}
    .venue-visual {padding:20px}
    .venue-heading,.venue-bottom strong {font-size:9px}
    .venue-bottom {font-size:10px;flex-wrap:wrap}
    .filter-note {display:none}
    .info-grid {grid-template-columns:1fr}
    .slot-time {font-size:20px}
}
@media(max-width:640px) {
    .container,.header-inner {width:calc(100% - 36px)}
    .header-inner {height:76px;gap:16px}
    .brand {font-size:22px;gap:9px}
    .brand img {width:52px;height:52px;border-radius:10px}
    .logo-showcase img {max-width:240px}
    .brand small {font-size:7px;letter-spacing:2.5px}
    .site-header nav {gap:18px;font-size:12px}
    .site-header nav a:last-child {display:none}
    .hero {grid-template-columns:1fr;gap:28px;padding:35px 0 40px}
    .hero h1 {font-size:48px;letter-spacing:-2px}
    .hero-copy>p {max-width:none;margin:18px 0 20px;font-size:14px}
    .hero-facts {gap:20px;font-size:11px}
    .venue-visual {padding:20px 22px;width:100%;max-width:460px;justify-self:center}
    .venue-heading {font-size:9px}
    .pitch-wrap {padding:20px 5px}
    .venue-bottom {flex-wrap:nowrap;font-size:10px}
    .section-heading {flex-wrap:wrap;gap:17px;align-items:flex-start}
    .section-heading h2 {font-size:26px}
    .section-heading p {font-size:13px}
    .section-heading .btn {font-size:12px;padding:10px 13px}
    .section-heading .eyebrow {font-size:9px}
    .filters {padding:20px 16px;gap:12px}
    .field {min-width:0;max-width:none;font-size:12px}
    input,select {font-size:14px;padding:12px 10px}
    .date-strip {padding:18px 14px;gap:5px}
    .date-choice {padding:10px 2px}
    .date-choice span {font-size:9px}
    .date-choice strong {font-size:21px}
    .date-choice small {font-size:9px}
    .schedule-toolbar {padding:20px 16px}
    .schedule-toolbar h3 {font-size:16px}
    .schedule-toolbar>div>span {font-size:11px}
    .legend {gap:14px;font-size:11px}
    .slots-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:0 14px 20px}
    .slot-card {padding:14px 12px 12px;min-height:163px}
    .slot-time {font-size:20px;letter-spacing:-.6px}
    .slot-time>span {font-size:13px;margin:0 1px}
    .slot-status,.slot-bottom {font-size:11px}
    .slot-price {font-size:13px}
    .schedule-footer {padding:14px 16px;align-items:flex-start;flex-direction:column;gap:5px}
    .schedule-note {font-size:11px}
    .info-grid {gap:18px;margin:24px 0 35px}
    .info-card {padding:23px 20px}
    .info-card h2 {font-size:23px}
    table {font-size:12px}
    th {font-size:10px}
    td+td,th+th {padding-left:10px}
    .contact-box .btn {width:100%}
    .site-footer a {font-size:11px}
    .error-box {margin:15px 16px}
    .dialog-head {padding:21px}
    .dialog-head h2 {font-size:19px}
    .dialog-body {padding:22px 21px}
    .selected-time h3 {font-size:30px}
    .dialog-actions {flex-direction:column-reverse}
    .dialog-actions .btn {width:100%}
}
@media(max-width:360px) {
    .container,.header-inner {width:calc(100% - 28px)}
    .site-header nav {gap:12px;font-size:11px}
    .brand {font-size:20px}
    .brand img {width:44px;height:44px}
    .hero h1 {font-size:43px}
    .hero-facts {gap:12px;font-size:10px}
    .slots-grid {padding:0 11px 18px;gap:8px}
    .slot-card {padding:12px 9px}
    .slot-time {font-size:18px}
    .slot-status {font-size:10px}
    .slot-price {font-size:12px}
    .slot-bottom {font-size:10px}
    .info-card {padding:20px 16px}
    table {font-size:11px}
    th {font-size:9px}
}
@media(prefers-reduced-motion:reduce) {
    html {scroll-behavior:auto}
    * {transition:none!important}
}