/* Visual polish over the original Fillo layout. No section or grid changes. */
:root {
  --ink: #14231e;
  --paper: #f7f6f0;
  --stone: #e7ebdf;
  --line: #d9dfd1;
  --muted: #5e685f;
}
::selection { background: var(--lime); color: var(--ink); }
body { font-feature-settings: 'ss01' 1; }
h1, h2, h3 { font-weight: 490; }
h2 { letter-spacing: -.052em; }
.muted-heading { color: #75816e; }
.eyebrow { font-weight: 560; letter-spacing: 1.65px; }
.wordmark>span { font-weight: 660; }
.site-header { border-bottom: 1px solid #d9dfd166; }
.site-header nav>a { transition: color .2s; }
.site-header nav>a:hover { color: #627936; }
.button { font-weight: 550; transition: background .2s, box-shadow .2s, transform .2s; }
.button:hover { transform: translateY(-1px); box-shadow: 0 4px 16px #10271714; }
.button svg, .text-link svg { transition: transform .25s; }
.button:hover svg, .text-link:hover svg { transform: translateX(3px); }
.button-dark:hover { background: #2b4032; }
.button-lime:hover { background: #d7ff55; box-shadow: 0 4px 22px #c6ff0024; }

/* Same copy on the left and booking sequence on the right. */
.hero { background: #101f1a; border: 1px solid #263b2c; isolation: isolate; }
.hero:before { width: 900px; height: 900px; right: -150px; top: -250px; background: radial-gradient(circle,#8fba5220,transparent 65%); }
.hero h1 { font-weight: 480; letter-spacing: -.065em; }
.hero h1>span { color: #cbed8e; }
.hero-description { color: #bcc9ba; }
.hero-copy .eyebrow { color: #d7e0cc; }
.hero-note { color: #a9bca3; }
.hero-copy, .product-window, .hero-bottom { position: relative; z-index: 1; }
.hero-bottom { align-items: center; color: #b2c1a6; border-color: #536b473d; }
.court-light { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; opacity: .55; z-index: 0; mix-blend-mode: screen; }
.hero-court-lines { position: absolute; left: 2%; bottom: 0; width: 44%; height: 100%; pointer-events: none; color: #adc696; opacity: .065; z-index: 0; }
.hero-court-lines path { stroke-width: .8; }
.hero-court-lines .court-signal { stroke: var(--lime); stroke-width: 2; stroke-dasharray: 12 88; animation: court-trace 4s linear both; }
@keyframes court-trace { to { stroke-dashoffset: -100; } }
.hero[data-paused="true"] .court-signal { animation-play-state: paused; }
.product-window { background: #f9faf4; border-color: #eef2e4; border-radius: 11px; box-shadow: 0 22px 65px #05110955, 0 0 0 6px #c7df9e05; }
.window-bar { background: #f1f4e9; border-color: #dce3d1; }
.tour-status { background: #213d2e; border: 1px solid #36563b; border-radius: 6px; }
.tour-title { font-weight: 540; }
.tour-detail { color: #cedac3; }
.match-list li { border-color: #e0e6d7; border-radius: 5px; background: #fff; }
.match-list li:first-child { border-color: #b9cd95; box-shadow: 0 3px 12px #5173200b; }
.match-list strong { font-weight: 570; }
.match-score { font-weight: 540; font-variant-numeric: tabular-nums; }
.tour-control { border-radius: 22px; background: #213d2e; border-color: #213d2e; }
.tour-control:hover { background: #36563b; }
.booked-result { box-shadow: 0 4px 16px #7da22415; }

/* Surface, type and icon refinements follow the existing section layout. */
.funnel>div>span { font-weight: 440; }
.funnel-result>span { background: #dfedc4; color: #284b22; }
.signal-list article>svg, .icon-label>svg { color: #61764b; stroke-width: 1.4; }
.signal-list h3 { font-weight: 510; }
.signal-example { background: #eaf0e0; color: #536847; border: 1px solid #dce6cf; }
.score-number { color: #617e3d; font-weight: 460; }
.message-preview { background: #e7ecdf; border-color: #d0dcc4; box-shadow: 0 15px 38px #2944210b; }
.message-top { background: #dde6d3; border-color: #c9d6bd; }
.message-bubble { box-shadow: 0 5px 15px #263d1610; }
.message-reply { background: #d1e6b6; }
.guardrails svg { background: #e3ecd8; color: #5b7537; }
.learning { background: #20382b; color: #f1f4e9; border: 1px solid #34513b; }
.learning .icon-label>svg { color: #bacd9c; }
.learning-copy>p { color: #c5d1bb; }
.learning-loop { border-color: #6a80534a; }
.learning-loop li { color: #c5d1bb; }
.learning-loop svg { color: #c1dc93; }
.learning-loop li+li:before { color: #92a875; }
.integration-flow li { border-color: #d6dfca; background: #f1f4ea; }
.integration-flow .integration-fillo { background: #213d2e; border-color: #213d2e; box-shadow: 0 8px 20px #10211712; }
.roi-calculator, .insights-window { background: #fcfdf8; border-color: #d6dfca; box-shadow: 0 14px 40px #29401c08; }
.roi-inputs input, .currency-label select { background: #f3f6ec; border-color: #d5e0c8; }
.roi-inputs input:focus, .currency-label select:focus { background: #fff; }
.roi-recovered { background: #d7ebba; }
.roi-recovered output { color: #203d17; font-weight: 490; }
.insight-observation { background: #edf3e2; }
.chart-track { background: #eaf0e1; }
.chart-track>span { background: #9fb96a; transform-origin: left; }
.platform-tags button, .platform-tags .more-spaces { border-color: #cdd9bd; color: #526741; }
.platform-tags button.is-active { background: #213d2e; border-color: #213d2e; color: #f1f4e9; }
.space-controls button { background: #14291fe8; border-color: #a9bd8f66; }
.questions details { border-color: #d5decb; }
.questions summary>span { color: #6f8455; transition: transform .2s; }
.questions details[open] summary>span { transform: rotate(45deg); }
.closing { background: #152b20; border: 1px solid #2e4832; }
.closing h2>span { color: #cbed8e; }
.contact-dialog { border-radius: 9px; }
.contact-aside { background: #20382b; }
.contact-main input, .contact-main select, .contact-main textarea { border-color: #d1ddc4; }

/* Small, once-per-visit cues. No page sections slide around. */
.learning.is-in-view .learning-loop svg { animation: learning-signal 2.8s ease-out both; }
.learning.is-in-view .learning-loop li:nth-child(2) svg { animation-delay: .35s; }
.learning.is-in-view .learning-loop li:nth-child(3) svg { animation-delay: .7s; }
.learning.is-in-view .learning-loop li:nth-child(4) svg { animation-delay: 1.05s; }
@keyframes learning-signal { 0%,100% { opacity: 1; } 30% { color: #e4ff9b; filter: drop-shadow(0 0 5px #c6ff0044); transform: translateY(-3px); } }
.club-intelligence.is-in-view .chart-track>span { animation: chart-fill .85s cubic-bezier(.2,.7,.3,1) both; }
.club-intelligence.is-in-view .utilization-chart>div:nth-child(2) .chart-track>span { animation-delay: .15s; }
@keyframes chart-fill { from { transform: scaleX(.05); } to { transform: scaleX(1); } }
.outreach.is-in-view .message-reply { animation: reply-arrive .6s .4s both; }
@keyframes reply-arrive { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: none; } }
@media(max-width:820px) { .hero-court-lines { width: 100%; height: 45%; top: 0; bottom: auto; opacity: .045; } }
@media(max-width:540px) { .hero-bottom { align-items: flex-start; } .hero-bottom>span:first-child { display: block; line-height: 1.7; } }
@media(prefers-reduced-motion:reduce) { .court-light { display: none; } .hero-court-lines .court-signal { animation: none; stroke-dasharray: none; } .button:hover, .button:hover svg, .text-link:hover svg { transform: none; } }

/* The same four places remain in view from missing players to a booked court. */
.tour-symbol { width: 26px; height: 26px; color: #cbed8e; }
.tour-status, .match-list li { transition: background-color .35s, border-color .35s; }
.product-window[data-stage="0"] .tour-status { background: #eaf0df; border-color: #d3dfbf; color: #35492d; box-shadow: inset 3px 0 0 #a9ce66; }
.product-window[data-stage="0"] .tour-step-number, .product-window[data-stage="0"] .tour-symbol { color: #66813b; }
.product-window[data-stage="0"] .tour-kicker, .product-window[data-stage="0"] .tour-detail { color: #63705b; }
.product-window[data-stage="0"] .match-heading .status-dot { background: #8aaf42; }
.match-stage { display: grid; min-height: 239px; }
.avatar>svg { position: absolute; inset: 21%; width: 58%; height: 58%; color: #78836e; stroke-width: 1.5; opacity: 0; }
.product-window[data-stage="0"] .match-list li { background: #f1f4eb; border-color: #d7e1ca; box-shadow: inset 2px 0 0 #c4d9a4; }
.product-window[data-stage="0"] .match-list strong, .product-window[data-stage="0"] .match-list li>div>span { color: #63705b; }
.product-window[data-stage="0"] .member-state { margin: 0; display: inline-block; padding: 3px 8px; border: 1px solid #c6dba8; border-radius: 12px; background: #e2edcf; color: #50633d; font-size: 9px; }
.product-window[data-stage="0"] .match-list .avatar,
.product-window:is([data-stage="0"],[data-stage="1"],[data-stage="2"]) .court-mini .avatar { background: #e4e9de; border-color: #e4e9de; box-shadow: none; }
.product-window[data-stage="0"] .match-list .avatar>svg,
.product-window:is([data-stage="0"],[data-stage="1"],[data-stage="2"]) .court-mini .avatar>svg { opacity: 1; }
.product-window[data-stage="0"] .match-list .avatar img,
.product-window:is([data-stage="0"],[data-stage="1"],[data-stage="2"]) .court-mini .avatar img { opacity: 0; }
.product-window[data-stage="0"] .send-icon { background: #e4e9de; color: #63705b; }
.product-window[data-stage="0"] .booked-label, .product-window[data-stage="0"] .booked-detail { color: #63705b; }
.product-window[data-stage="0"] .court-mini { border-color: #9ca88d; }
.product-window[data-stage="0"] .tour-progress li.is-current { border-color: #86ad43; color: #50633d; }
.product-window[data-stage="0"] .tour-progress .is-current .step-dot { background: #cce88e; }

/* Slow halos show the open places are part of an active sequence. */
.product-window[data-stage="0"]:is([data-state="playing"],[data-state="paused"]) .match-list .avatar { animation: open-place-pulse 2.2s ease-in-out var(--reveal-delay,0s) infinite; }
.product-window:is([data-state="playing"],[data-state="paused"]) .tour-progress .is-current .step-dot { animation: active-step-pulse 2.2s ease-in-out infinite; }
.product-window[data-stage="1"] .match-list li { animation: match-highlight 1.2s ease-out var(--reveal-delay,0s); }
@keyframes open-place-pulse {
  0%,100% { box-shadow: 0 0 0 0 #a4c85a00; background-color: #e4e9de; }
  45% { box-shadow: 0 0 0 5px #a4c85a38; background-color: #d6e5ba; }
  75% { box-shadow: 0 0 0 8px #a4c85a00; }
}
@keyframes active-step-pulse {
  0%,100% { box-shadow: 0 0 0 0 #91b83c00; }
  50% { box-shadow: 0 0 0 4px #91b83c38; }
}
@keyframes match-highlight {
  0%,100% { box-shadow: 0 0 0 0 #9fbe5700; }
  40% { background-color: #eaf4d8; border-color: #a6c975; box-shadow: 0 0 0 2px #9fbe5726; }
}
@media(max-width:540px) { .match-stage { min-height: 271px; } .tour-symbol { width: 19px; height: 19px; } }
@media(max-width:360px) { .tour-symbol { width: 17px; height: 17px; } }