<!DOCTYPE html><html lang="en" class="light"> <head><meta charset="UTF-8"><meta name="description" content="TeamStats - Team Management App for Grassroots Sports"><meta name="robots" content="index, follow"><link rel="canonical" href="https://www.teamstats.net/"><!-- Open Graph / Facebook --><meta property="og:type" content="website"><meta property="og:url" content="https://www.teamstats.net/"><meta property="og:title" content="Football Team Management App | TeamStats"><meta property="og:description" content="TeamStats - Team Management App for Grassroots Sports"><meta property="og:image" content="https://assets.teamstats.net/images/og-default.jpg"><meta property="og:site_name" content="TeamStats"><!-- Twitter --><meta name="twitter:card" content="summary_large_image"><meta name="twitter:url" content="https://www.teamstats.net/"><meta name="twitter:title" content="Football Team Management App | TeamStats"><meta name="twitter:description" content="TeamStats - Team Management App for Grassroots Sports"><meta name="twitter:image" content="https://assets.teamstats.net/images/og-default.jpg"><meta name="viewport" content="width=device-width"><link rel="icon" type="image/svg+xml" href="/favicon.svg"><meta name="generator" content="Astro v5.15.3"><meta name="color-scheme" content="light only"><title>Football Team Management App | TeamStats</title><!-- Force mytheme --><script>
      document.documentElement.setAttribute("data-theme", "mytheme");
    </script><!-- Preconnect to critical origins --><link rel="preconnect" href="https://fonts.googleapis.com" crossorigin><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin><!-- Cloudflare Zaraz optimization --><link rel="dns-prefetch" href="https://cdn.zaraz.com"><link rel="preconnect" href="https://cdn.zaraz.com" crossorigin><!-- Preconnect to TeamStats assets CDN --><link rel="dns-prefetch" href="https://assets.teamstats.net"><link rel="preconnect" href="https://assets.teamstats.net" crossorigin><!-- Preconnect to TeamStats staging API (used by client-side tracking) --><link rel="preconnect" href="https://staging-api.teamstats.net" crossorigin><!-- Modal Styles - non-render-blocking --><link rel="stylesheet" href="/styles/modals.css?v=1770725899218" media="print" onload="this.media='all'"><noscript><link rel="stylesheet" href="/styles/modals.css?v=1770725899218"></noscript><link rel="stylesheet" href="/_astro/_slug_.Cz0QT6cZ.css">
<style>@keyframes infinite-scroll{0%{transform:translate(0)}to{transform:translate(-100%)}}.animate-infinite-scroll[data-astro-cid-of2dwe7y]{animation:infinite-scroll 25s linear infinite}
.login-step[data-astro-cid-4iwzqplc]{display:none;animation:slideIn .3s ease-out}.login-step[data-astro-cid-4iwzqplc]:not(.hidden){display:block}#login-modal[data-astro-cid-4iwzqplc] input[data-astro-cid-4iwzqplc]:focus{outline:none;box-shadow:none}.signup-step[data-astro-cid-uc2ui6qy]{display:none;animation:slideIn .3s ease-out}.signup-step[data-astro-cid-uc2ui6qy]:not(.hidden){display:block}@keyframes slideIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.form-group[data-astro-cid-uc2ui6qy]{display:block}#full-page-overlay[data-astro-cid-uc2ui6qy] input[data-astro-cid-uc2ui6qy]:focus{outline:none;box-shadow:none}
.hero-bg[data-astro-cid-lhnbf22g]{position:absolute;inset:0;opacity:0;transition:opacity 1s ease-in-out}.hero-bg[data-astro-cid-lhnbf22g].active{opacity:1}.hero-bg[data-astro-cid-lhnbf22g] img[data-astro-cid-lhnbf22g]{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.hero-bg[data-astro-cid-lhnbf22g]:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:2;background:linear-gradient(to bottom,#00000059,#000000bf,#000000d9,#00000040)}.hero-headline[data-astro-cid-lhnbf22g]{position:absolute;top:0;left:0;opacity:0;transition:opacity .05s ease-in-out;display:block;font-size:64px}.hero-headline[data-astro-cid-lhnbf22g].active{opacity:1;position:relative}.hero-headline[data-astro-cid-lhnbf22g].fading-out{opacity:0}.hero-headline-suffix[data-astro-cid-lhnbf22g]{font-size:60px;font-weight:300}@media(max-width:767px){h1[data-astro-cid-lhnbf22g]{font-size:18px;padding:12px 0}.hero-headline[data-astro-cid-lhnbf22g]{font-size:32px;padding:0;margin:0}.hero-headline-suffix[data-astro-cid-lhnbf22g]{font-size:28px}}.hero-buttons[data-astro-cid-lhnbf22g] .btn-secondary[data-astro-cid-lhnbf22g]{background:#4caf50;border:none}.hero-buttons[data-astro-cid-lhnbf22g] .btn-secondary[data-astro-cid-lhnbf22g]:hover{background:#45a049}.hero-buttons[data-astro-cid-lhnbf22g] .btn-outline[data-astro-cid-lhnbf22g]:hover{background:transparent;text-decoration:underline}.hero-screenshot[data-astro-cid-7xd7yi2v]{position:absolute;top:0;left:0;width:100%;height:100%;transform:translate(100%);opacity:0;transition:transform .4s cubic-bezier(.25,.46,.45,.94),opacity .4s cubic-bezier(.25,.46,.45,.94)}.hero-screenshot[data-astro-cid-7xd7yi2v].active{transform:translate(0);opacity:1}.hero-screenshot[data-astro-cid-7xd7yi2v].exiting{transform:translate(-100%);opacity:0}@media(prefers-reduced-motion:reduce){.hero-screenshot[data-astro-cid-7xd7yi2v]{transition:transform .2s ease,opacity .2s ease}}
</style>
<link rel="stylesheet" href="/_astro/_slug_.DlFNpQL5.css">
<style>@keyframes astroFadeInOut{0%{opacity:1}to{opacity:0}}@keyframes astroFadeIn{0%{opacity:0;mix-blend-mode:plus-lighter}to{opacity:1;mix-blend-mode:plus-lighter}}@keyframes astroFadeOut{0%{opacity:1;mix-blend-mode:plus-lighter}to{opacity:0;mix-blend-mode:plus-lighter}}@keyframes astroSlideFromRight{0%{transform:translate(100%)}}@keyframes astroSlideFromLeft{0%{transform:translate(-100%)}}@keyframes astroSlideToRight{to{transform:translate(100%)}}@keyframes astroSlideToLeft{to{transform:translate(-100%)}}@media(prefers-reduced-motion){::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}[data-astro-transition-scope]{animation:none!important}}
</style>
<link rel="stylesheet" href="/_astro/_featureSlug_.Cpk5ZIId.css">
<style>.video-hero-section[data-astro-cid-ux2kju4p]{position:relative;width:100%;min-height:320px;height:auto;overflow:hidden;display:flex;align-items:center;justify-content:center;color:#fff;text-align:center;background:#000;z-index:0;padding:3rem 0}@media(min-width:768px){.video-hero-section[data-astro-cid-ux2kju4p]{min-height:380px;padding:4rem 0}}.video-bg[data-astro-cid-ux2kju4p]{position:absolute;inset:0;z-index:0}.video-poster[data-astro-cid-ux2kju4p]{position:absolute;inset:0;background-size:cover;background-position:center;z-index:1;opacity:0;animation:fadeOut 1s ease-in 2s forwards}@keyframes fadeOut{to{opacity:0;pointer-events:none}}.content-with-mockup[data-astro-cid-ux2kju4p]{position:relative;z-index:10;display:flex;align-items:center;justify-content:center;gap:2rem;width:100%}.content-wrapper[data-astro-cid-ux2kju4p]{position:relative;z-index:10;padding:2rem 1rem;max-width:700px;text-align:center}.mockup-wrapper[data-astro-cid-ux2kju4p]{display:none;position:relative;z-index:10}.video-hero-section[data-astro-cid-ux2kju4p] h1[data-astro-cid-ux2kju4p].hero-title{padding-top:60px}.mockup-wrapper[data-astro-cid-ux2kju4p]:empty{display:none}@media(min-width:1024px){.content-wrapper[data-astro-cid-ux2kju4p]{text-align:center;flex:1}.mockup-wrapper[data-astro-cid-ux2kju4p]{display:block;flex-shrink:0}.mockup-wrapper[data-astro-cid-ux2kju4p]:empty{display:none}}.hero-title[data-astro-cid-ux2kju4p]{font-size:clamp(2rem,5vw,3.5rem);font-weight:700;margin-bottom:1.5rem;text-shadow:0 4px 12px rgba(0,0,0,.8);line-height:1.2}.hero-description[data-astro-cid-ux2kju4p]{font-size:clamp(1rem,2vw,1.25rem);margin-bottom:2.5rem;text-shadow:0 2px 8px rgba(0,0,0,.8);line-height:1.6;max-width:800px;margin-left:auto;margin-right:auto}.play-btn[data-astro-cid-ux2kju4p]{background:none;border:none;cursor:pointer;transition:transform .3s ease,filter .3s ease;padding:0;display:inline-flex;align-items:center;justify-content:center}.play-btn[data-astro-cid-ux2kju4p]:hover{transform:scale(1.15);filter:drop-shadow(0 8px 16px rgba(220,38,38,.5))}.play-btn[data-astro-cid-ux2kju4p]:active{transform:scale(1.05)}.play-icon[data-astro-cid-ux2kju4p]{filter:drop-shadow(0 4px 8px rgba(0,0,0,.4))}.sr-only[data-astro-cid-ux2kju4p]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.modal-content[data-astro-cid-ux2kju4p]{position:relative;width:100%;background:#000;border-radius:16px;overflow:hidden}.modal-content[data-astro-cid-ux2kju4p] .close-btn[data-astro-cid-ux2kju4p]{position:absolute;top:.75rem;right:.75rem;width:3rem;height:3rem;background:#dc2626f2;color:#fff;border:2px solid #fff;border-radius:50%;cursor:pointer;z-index:100;display:flex;align-items:center;justify-content:center;transition:all .2s ease;box-shadow:0 4px 12px #0000004d}.close-btn[data-astro-cid-ux2kju4p]:hover{background:#b91c1c;transform:scale(1.1)}.close-btn[data-astro-cid-ux2kju4p] svg[data-astro-cid-ux2kju4p]{width:20px;height:20px}@media(max-width:768px){.video-hero-section[data-astro-cid-ux2kju4p]{min-height:500px;height:70vh}.content-wrapper[data-astro-cid-ux2kju4p]{padding:1.5rem 1rem}.play-btn[data-astro-cid-ux2kju4p]:hover{transform:scale(1.1)}.video-modal[data-astro-cid-ux2kju4p]{width:95vw;max-width:95vw}.close-btn[data-astro-cid-ux2kju4p]{top:.5rem;right:.5rem;width:2.5rem;height:2.5rem}}@media(prefers-reduced-motion:reduce){.play-btn[data-astro-cid-ux2kju4p],.close-btn[data-astro-cid-ux2kju4p]{transition:none}.play-btn[data-astro-cid-ux2kju4p]:hover{transform:scale(1.05)}}
.logos-track[data-astro-cid-tegb73yx]{display:flex;animation:scroll 60s linear infinite;width:max-content}.logos-track[data-astro-cid-tegb73yx]:hover{animation-play-state:paused}@keyframes scroll{0%{transform:translate(0)}to{transform:translate(-50%)}}.logo-item[data-astro-cid-tegb73yx]{flex-shrink:0;width:64px;height:64px;display:flex;align-items:center;justify-content:center;margin:0 1.75rem}.logo-item[data-astro-cid-tegb73yx] img[data-astro-cid-tegb73yx]{max-width:100%;max-height:100%;object-fit:contain;filter:grayscale(20%);opacity:.9;transition:all .3s ease}.logo-item[data-astro-cid-tegb73yx]:hover img[data-astro-cid-tegb73yx]{filter:grayscale(0%);opacity:1;transform:scale(1.1)}@media(min-width:768px){.logo-item[data-astro-cid-tegb73yx]{width:72px;height:72px;margin:0 2.25rem}}
.image-card[data-astro-cid-x4g36ggu]{position:relative;border-radius:1rem;overflow:hidden;text-align:center;height:220px}.image-card[data-astro-cid-x4g36ggu] img[data-astro-cid-x4g36ggu]{width:100%;height:100%;display:block;object-fit:cover;object-position:center;transition:transform .4s ease-out}.image-card[data-astro-cid-x4g36ggu]:before{content:"";position:absolute;inset:0;background:#00000040;transition:background .3s ease;z-index:1}.image-card[data-astro-cid-x4g36ggu]:hover:before{background:#00000026}.image-card[data-astro-cid-x4g36ggu]:hover img[data-astro-cid-x4g36ggu]{transform:scale(1.05)}.image-card[data-astro-cid-x4g36ggu] h3[data-astro-cid-x4g36ggu]{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:10;color:#fff;font-size:2rem;font-weight:700;text-shadow:2px 2px 4px rgba(0,0,0,.8);margin:0}
.laptop-frame[data-astro-cid-ptqbfvrg]{position:relative;width:800px;margin:0 auto;padding:12px 12px 0;border-radius:8px 8px 0 0;background:#1a1a1a}.laptop-screen[data-astro-cid-ptqbfvrg]{position:relative;width:100%;padding-bottom:62.5%;background:#000;overflow:hidden}.laptop-base[data-astro-cid-ptqbfvrg]{position:relative;width:110%;height:16px;margin:0 -5%;background:#1a1a1a;border-radius:0 0 6px 6px}.laptop-base[data-astro-cid-ptqbfvrg]:before{content:"";position:absolute;bottom:0;left:50%;transform:translate(-50%);width:80px;height:3px;background:#2a2a2a;border-radius:2px 2px 0 0}.tablet-frame[data-astro-cid-aovdocaw]{position:relative;width:280px;height:380px;margin:0 auto;padding:12px;border-radius:12px;background:#1a1a1a}.tablet-screen[data-astro-cid-aovdocaw]{position:relative;width:100%;height:100%;background:#000;overflow:hidden;display:flex;align-items:center;justify-content:center}.device-showcase-container[data-astro-cid-5svpmbcj]{position:relative;width:100%;display:flex;align-items:center;justify-content:center;min-height:var(--container-height-mobile)}.device-wrapper[data-astro-cid-5svpmbcj]{position:absolute;top:50%;left:50%;transform:translate(calc(-50% + var(--x-offset-mobile)),calc(-50% + var(--y-offset-mobile))) scale(var(--mobile-scale));z-index:var(--z-index);max-height:450px;margin-top:var(--margin-top-mobile, 0px)}.device-wrapper[data-astro-cid-5svpmbcj].hide-mobile{display:none}@media(min-width:1024px){.device-showcase-container[data-astro-cid-5svpmbcj]{min-height:var(--container-height-desktop)}.device-wrapper[data-astro-cid-5svpmbcj]{transform:translate(calc(-50% + var(--x-offset-desktop)),calc(-50% + var(--y-offset-desktop))) scale(var(--desktop-scale));max-height:none;margin-top:var(--margin-top-desktop, 0px)}.device-wrapper[data-astro-cid-5svpmbcj].hide-mobile{display:block}}
.phone-frame-single[data-astro-cid-esjtk2be]{position:relative;width:340px;height:680px;margin:0 auto;padding:15px;border-radius:50px;background:linear-gradient(145deg,#2a2a2a,#1a1a1a)}.phone-frame-single[data-astro-cid-esjtk2be]:before{content:"";position:absolute;top:20px;left:50%;transform:translate(-50%);width:180px;height:32px;background:#000;border-radius:0 0 20px 20px;z-index:3}.phone-frame-single[data-astro-cid-esjtk2be]:after{content:"";position:absolute;top:28px;left:50%;transform:translate(-50%);width:12px;height:12px;background:radial-gradient(circle,#1a3a5a 30%,#0a1a2a 70%);border-radius:50%;z-index:4}.phone-screen-single[data-astro-cid-esjtk2be]{position:relative;width:100%;height:100%;background:#000;border-radius:38px;overflow:hidden;display:flex;align-items:center;justify-content:center}
.phone-frame-video[data-astro-cid-wc5sb4d6]{position:relative;width:340px;height:680px;margin:0 auto;padding:15px;border-radius:50px;background:linear-gradient(145deg,#2a2a2a,#1a1a1a)}.phone-frame-video[data-astro-cid-wc5sb4d6]:before{content:"";position:absolute;top:20px;left:50%;transform:translate(-50%);width:180px;height:32px;background:#000;border-radius:0 0 20px 20px;z-index:3}.phone-frame-video[data-astro-cid-wc5sb4d6]:after{content:"";position:absolute;top:28px;left:50%;transform:translate(-50%);width:12px;height:12px;background:radial-gradient(circle,#1a3a5a 30%,#0a1a2a 70%);border-radius:50%;z-index:4}.phone-screen-video[data-astro-cid-wc5sb4d6]{position:relative;width:100%;height:100%;background:#000;border-radius:38px;overflow:hidden}.phone-screen-video[data-astro-cid-wc5sb4d6] video[data-astro-cid-wc5sb4d6]{width:100%;height:100%;object-fit:contain}
</style><style>[data-astro-transition-scope="astro-ic3wujkf-1"] { view-transition-name: astro-ic3wujkf-1; }@layer astro { ::view-transition-old(astro-ic3wujkf-1) { 
	animation-duration: 180ms;
	animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1);
	animation-fill-mode: both;
	animation-name: astroFadeOut; }::view-transition-new(astro-ic3wujkf-1) { 
	animation-duration: 180ms;
	animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1);
	animation-fill-mode: both;
	animation-name: astroFadeIn; }[data-astro-transition=back]::view-transition-old(astro-ic3wujkf-1) { 
	animation-duration: 180ms;
	animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1);
	animation-fill-mode: both;
	animation-name: astroFadeOut; }[data-astro-transition=back]::view-transition-new(astro-ic3wujkf-1) { 
	animation-duration: 180ms;
	animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1);
	animation-fill-mode: both;
	animation-name: astroFadeIn; } }[data-astro-transition-fallback="old"] [data-astro-transition-scope="astro-ic3wujkf-1"],
			[data-astro-transition-fallback="old"][data-astro-transition-scope="astro-ic3wujkf-1"] { 
	animation-duration: 180ms;
	animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1);
	animation-fill-mode: both;
	animation-name: astroFadeOut; }[data-astro-transition-fallback="new"] [data-astro-transition-scope="astro-ic3wujkf-1"],
			[data-astro-transition-fallback="new"][data-astro-transition-scope="astro-ic3wujkf-1"] { 
	animation-duration: 180ms;
	animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1);
	animation-fill-mode: both;
	animation-name: astroFadeIn; }[data-astro-transition=back][data-astro-transition-fallback="old"] [data-astro-transition-scope="astro-ic3wujkf-1"],
			[data-astro-transition=back][data-astro-transition-fallback="old"][data-astro-transition-scope="astro-ic3wujkf-1"] { 
	animation-duration: 180ms;
	animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1);
	animation-fill-mode: both;
	animation-name: astroFadeOut; }[data-astro-transition=back][data-astro-transition-fallback="new"] [data-astro-transition-scope="astro-ic3wujkf-1"],
			[data-astro-transition=back][data-astro-transition-fallback="new"][data-astro-transition-scope="astro-ic3wujkf-1"] { 
	animation-duration: 180ms;
	animation-timing-function: cubic-bezier(0.76, 0, 0.24, 1);
	animation-fill-mode: both;
	animation-name: astroFadeIn; }</style></head> <body> <div data-astro-transition-scope="astro-ic3wujkf-1">  <nav class="bg-white border-b border-gray-100 fixed top-0 left-0 right-0 z-50 w-full transition-all duration-300" data-astro-cid-5blmo7yk> <div class="navbar w-full max-w-6xl mx-auto h-16 lg:h-20 px-4" data-astro-cid-5blmo7yk> <div class="navbar-start" data-astro-cid-5blmo7yk> <a href="/" class="hover:opacity-90 transition-opacity py-1" data-astro-cid-5blmo7yk> <picture> <source srcset="https://assets.teamstats.net/img-m-400-100/logos/teamstats/teamstats-logo-text-400.png?f=avif&v=130126-1" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-400-100/logos/teamstats/teamstats-logo-text-400.png?f=webp&v=130126-1" type="image/webp"> <img src="https://assets.teamstats.net/img-m-400-100/logos/teamstats/teamstats-logo-text-400.png" alt="TeamStats" loading="eager" fetchpriority="high" class="max-w-[120px] lg:max-w-[150px]"> </picture> </a> </div> <div class="navbar-center hidden lg:flex" data-astro-cid-5blmo7yk> <ul class="flex items-center gap-9 xl:gap-12" data-astro-cid-5blmo7yk> <li class="static menu-item" key="Features" data-astro-cid-5blmo7yk> <a tabindex="0" role="button" class="flex items-center gap-1 font-semibold text-gray-700 hover:text-primary transition-colors py-2 px-1 cursor-pointer" data-astro-cid-5blmo7yk> Features <span class="menu-icon-container" data-astro-cid-5blmo7yk> <svg class="chevron-down w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24" data-astro-cid-5blmo7yk> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" data-astro-cid-5blmo7yk></path> </svg> <svg class="chevron-x w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24" data-astro-cid-5blmo7yk> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" data-astro-cid-5blmo7yk></path> </svg> </span> </a> <div class="dropdown-content mega-menu-glass" data-astro-cid-5blmo7yk> <div class="py-12 mega-menu-inner" data-astro-cid-5blmo7yk> <div class="container mx-auto max-w-7xl px-8" data-astro-cid-5blmo7yk>  <div class="grid grid-cols-4 gap-12" data-astro-cid-5blmo7yk> <div key="Team Organisation &#38; Scheduling" class="mega-menu-col" data-astro-cid-5blmo7yk> <h3 class="font-bold text-gray-900 text-base uppercase tracking-wider mb-6" data-astro-cid-5blmo7yk>Team Organisation &amp; Scheduling</h3> <ul class="space-y-4" data-astro-cid-5blmo7yk> <li key="Organise your team" data-astro-cid-5blmo7yk> <a href="/organise" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Organise your team </a> </li><li key="Arrange matches and training" data-astro-cid-5blmo7yk> <a href="/organise/schedule-matches-training" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Arrange matches and training </a> </li><li key="Track player availability" data-astro-cid-5blmo7yk> <a href="/organise/track-player-availability" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Track player availability </a> </li><li key="Plan your line-ups" data-astro-cid-5blmo7yk> <a href="/organise/line-up-planner" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Plan your line-ups </a> </li> </ul> </div><div key="Team Statistics &#38; Match Reports" class="mega-menu-col" data-astro-cid-5blmo7yk> <h3 class="font-bold text-gray-900 text-base uppercase tracking-wider mb-6" data-astro-cid-5blmo7yk>Team Statistics &amp; Match Reports</h3> <ul class="space-y-4" data-astro-cid-5blmo7yk> <li key="Analyse your performances" data-astro-cid-5blmo7yk> <a href="/analyse" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Analyse your performances </a> </li><li key="Publish match reports" data-astro-cid-5blmo7yk> <a href="/analyse/write-match-reports" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Publish match reports </a> </li><li key="Generate team stats" data-astro-cid-5blmo7yk> <a href="/analyse/generate-team-stats" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Generate team stats </a> </li><li key="Track player performance" data-astro-cid-5blmo7yk> <a href="/analyse/track-player-performance" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Track player performance </a> </li> </ul> </div><div key="Team Finances &#38; Payment Management" class="mega-menu-col" data-astro-cid-5blmo7yk> <h3 class="font-bold text-gray-900 text-base uppercase tracking-wider mb-6" data-astro-cid-5blmo7yk>Team Finances &amp; Payment Management</h3> <ul class="space-y-4" data-astro-cid-5blmo7yk> <li key="Manage team finances" data-astro-cid-5blmo7yk> <a href="/finances" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Manage team finances </a> </li><li key="Record every payment" data-astro-cid-5blmo7yk> <a href="/finances/payment-tracking" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Record every payment </a> </li><li key="Team and player reporting" data-astro-cid-5blmo7yk> <a href="/finances/financial-reports" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Team and player reporting </a> </li><li key="Receive player payments" data-astro-cid-5blmo7yk> <a href="/finances/receive-player-payments" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Receive player payments </a> </li> </ul> </div><div key="Team Communication App &#38; Website" class="mega-menu-col" data-astro-cid-5blmo7yk> <h3 class="font-bold text-gray-900 text-base uppercase tracking-wider mb-6" data-astro-cid-5blmo7yk>Team Communication App &amp; Website</h3> <ul class="space-y-4" data-astro-cid-5blmo7yk> <li key="Improve team communication" data-astro-cid-5blmo7yk> <a href="/communicate" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Improve team communication </a> </li><li key="Create a team website and app" data-astro-cid-5blmo7yk> <a href="/communicate/team-website-app" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Create a team website and app </a> </li><li key="Share news, docs, photos and video" data-astro-cid-5blmo7yk> <a href="/communicate/team-news-media" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Share news, docs, photos and video </a> </li><li key="Send messages to team members" data-astro-cid-5blmo7yk> <a href="/communicate/send-messages" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Send messages to team members </a> </li> </ul> </div> </div> <div class="mt-12 pt-8 border-t border-gray-100 text-center" data-astro-cid-5blmo7yk> <a href="/all-teamstats-features" class="inline-flex items-center text-primary font-bold hover:gap-2 transition-all group" data-astro-cid-5blmo7yk> View all features <svg class="w-4 h-4 ml-1 group-hover:translate-x-1 transition-transform" fill="none" stroke="currentColor" viewBox="0 0 24 24" data-astro-cid-5blmo7yk> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" data-astro-cid-5blmo7yk></path> </svg> </a> </div> </div> </div> </div> </li><li class="static menu-item" key="Who it's for" data-astro-cid-5blmo7yk> <a tabindex="0" role="button" class="flex items-center gap-1 font-semibold text-gray-700 hover:text-primary transition-colors py-2 px-1 cursor-pointer" data-astro-cid-5blmo7yk> Who it&#39;s for <span class="menu-icon-container" data-astro-cid-5blmo7yk> <svg class="chevron-down w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24" data-astro-cid-5blmo7yk> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" data-astro-cid-5blmo7yk></path> </svg> <svg class="chevron-x w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24" data-astro-cid-5blmo7yk> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" data-astro-cid-5blmo7yk></path> </svg> </span> </a> <div class="dropdown-content mega-menu-glass" data-astro-cid-5blmo7yk> <div class="py-12 mega-menu-inner" data-astro-cid-5blmo7yk> <div class="container mx-auto max-w-7xl px-8" data-astro-cid-5blmo7yk>  <div class="grid grid-cols-4 gap-12" data-astro-cid-5blmo7yk> <div key="Clubs and Teams" class="mega-menu-col" data-astro-cid-5blmo7yk> <h3 class="font-bold text-gray-900 text-base uppercase tracking-wider mb-6" data-astro-cid-5blmo7yk>Clubs and Teams</h3> <ul class="space-y-4" data-astro-cid-5blmo7yk> <li key="Teams and Clubs" data-astro-cid-5blmo7yk> <a href="/team-management-app" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Teams and Clubs </a> </li><li key="Junior teams" data-astro-cid-5blmo7yk> <a href="/team-management-app#kids-teams" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Junior teams </a> </li><li key="Adult teams" data-astro-cid-5blmo7yk> <a href="/team-management-app#adult-teams" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Adult teams </a> </li><li key="Multi-team clubs" data-astro-cid-5blmo7yk> <a href="/team-management-app#multi-team-clubs" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Multi-team clubs </a> </li> </ul> </div><div key="Team Members" class="mega-menu-col" data-astro-cid-5blmo7yk> <h3 class="font-bold text-gray-900 text-base uppercase tracking-wider mb-6" data-astro-cid-5blmo7yk>Team Members</h3> <ul class="space-y-4" data-astro-cid-5blmo7yk> <li key="Team Members" data-astro-cid-5blmo7yk> <a href="/team-communication-app" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Team Members </a> </li><li key="Coaches, managers &#38; staff" data-astro-cid-5blmo7yk> <a href="/team-communication-app#management-staff-officials" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Coaches, managers &amp; staff </a> </li><li key="Players" data-astro-cid-5blmo7yk> <a href="/team-communication-app#players" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Players </a> </li><li key="Parents &#38; supporters" data-astro-cid-5blmo7yk> <a href="/team-communication-app#parents-supporters" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Parents &amp; supporters </a> </li> </ul> </div><div key="Success Stories" class="mega-menu-col" data-astro-cid-5blmo7yk> <h3 class="font-bold text-gray-900 text-base uppercase tracking-wider mb-6" data-astro-cid-5blmo7yk>Success Stories</h3> <ul class="space-y-4" data-astro-cid-5blmo7yk> <li key="User Feedback" data-astro-cid-5blmo7yk> <a href="/success-stories" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> User Feedback </a> </li><li key="Testimonials" data-astro-cid-5blmo7yk> <a href="/success-stories#testimonials" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Testimonials </a> </li><li key="TeamStats Top 50" data-astro-cid-5blmo7yk> <a href="/teamstats-top-50-football-teams" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> TeamStats Top 50 </a> </li><li key="Grassroots Football Blog" data-astro-cid-5blmo7yk> <a href="/blog" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Grassroots Football Blog </a> </li> </ul> </div><div key="Directory" class="mega-menu-col" data-astro-cid-5blmo7yk> <h3 class="font-bold text-gray-900 text-base uppercase tracking-wider mb-6" data-astro-cid-5blmo7yk>Directory</h3> <ul class="space-y-4" data-astro-cid-5blmo7yk> <li key="Directory Home" data-astro-cid-5blmo7yk> <a href="/directory" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Directory Home </a> </li><li key="Team Directory" data-astro-cid-5blmo7yk> <a href="/teams" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Team Directory </a> </li><li key="League Directory" data-astro-cid-5blmo7yk> <a href="/leagues" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> League Directory </a> </li><li key="Match Reports" data-astro-cid-5blmo7yk> <a href="/match-reports" class="text-gray-600 hover:text-primary transition-colors text-sm font-medium flex items-center group" data-astro-cid-5blmo7yk> <span class="w-1.5 h-1.5 rounded-full bg-primary opacity-0 group-hover:opacity-100 transition-opacity mr-2" data-astro-cid-5blmo7yk></span> Match Reports </a> </li> </ul> </div> </div>  </div> </div> </div> </li><li key="Pricing" data-astro-cid-5blmo7yk> <a href="/pricing" class="font-semibold text-gray-700 hover:text-primary transition-colors nav-link-hover py-2 px-1" data-astro-cid-5blmo7yk> Pricing </a> </li><li key="Contact" data-astro-cid-5blmo7yk> <a href="/contact" class="font-semibold text-gray-700 hover:text-primary transition-colors nav-link-hover py-2 px-1 contact-trigger" data-astro-cid-5blmo7yk> Contact </a> </li> </ul> </div> <div class="navbar-end gap-5" data-astro-cid-5blmo7yk> <div id="user-nav-container" class="hidden lg:block" data-astro-cid-5blmo7yk> <!-- Dynamically populated by login.js --> </div> <!-- Desktop login/signup --> <div class="hidden lg:flex items-center gap-4" data-astro-cid-5blmo7yk> <button type="button" id="desktop-login-button" class="open-login-modal btn btn-outline border-gray-300 bg-transparent text-gray-700 hover:bg-gray-50 rounded-lg h-11 min-h-auto font-semibold w-32 justify-center" data-astro-cid-5blmo7yk>
Login
</button> <a href="#" id="signup-nav-item" class="trigger-signup btn btn-primary rounded-lg shadow-md hover:shadow-lg transition-all h-11 min-h-auto w-32 justify-center" data-astro-cid-5blmo7yk>
Sign Up
</a> </div> <!-- Mobile primary CTA (directory uses drawer Search button instead) --> <a href="#" id="mobile-signup-btn" class="trigger-signup btn btn-primary btn-sm uppercase lg:hidden rounded-md h-9 min-h-auto font-bold mr-2" data-astro-cid-5blmo7yk>
Sign Up
</a> <!-- Mobile search icon (directory pages only) -->  <!-- Mobile avatar (shown when logged in, hidden by default) --> <a href="#" id="mobile-navbar-avatar" class="hidden lg:hidden! items-center mr-2" data-astro-cid-5blmo7yk> <img src="" alt="" class="w-8 h-8 rounded-full object-cover border border-gray-200" data-astro-cid-5blmo7yk> </a> <!-- Mobile menu button (morphing hamburger/X) --> <label for="mobile-drawer" id="mobile-menu-toggle" class="menu-toggle lg:hidden text-gray-700" aria-label="Toggle menu" data-astro-cid-5blmo7yk> <div class="hamburger hamburger3" data-astro-cid-5blmo7yk> <span class="bar bar1" data-astro-cid-5blmo7yk></span> <span class="bar bar2" data-astro-cid-5blmo7yk></span> <span class="bar bar3" data-astro-cid-5blmo7yk></span> <span class="bar bar4" data-astro-cid-5blmo7yk></span> </div> </label> </div> </div> </nav> <div class="drawer drawer-end lg:hidden" data-astro-cid-5blmo7yk> <input id="mobile-drawer" type="checkbox" class="drawer-toggle" data-astro-cid-5blmo7yk> <div class="drawer-side z-60" data-astro-cid-5blmo7yk> <label for="mobile-drawer" class="drawer-overlay" data-astro-cid-5blmo7yk></label> <div class="p-6 w-80 min-h-full bg-white flex flex-col" data-astro-cid-5blmo7yk> <!-- Mobile menu header (logo removed; navbar logo remains visible above) --> <div class="mb-4" data-astro-cid-5blmo7yk></div> <ul class="space-y-2" data-astro-cid-5blmo7yk> <li class="mobile-nav-item" data-astro-cid-5blmo7yk> <a href="/" class="flex items-center justify-between py-3 px-4 font-bold text-gray-900 hover:bg-gray-50 rounded-lg" data-astro-cid-5blmo7yk>Home</a> </li> <li class="mobile-nav-item" data-astro-cid-5blmo7yk> <details class="group" data-astro-cid-5blmo7yk> <summary class="flex items-center justify-between py-3 px-4 font-bold text-gray-900 cursor-pointer hover:bg-gray-50 rounded-lg list-none group-open:bg-gray-50" data-astro-cid-5blmo7yk> Features <svg class="w-4 h-4 transition-transform group-open:rotate-180 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24" data-astro-cid-5blmo7yk> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" data-astro-cid-5blmo7yk></path> </svg> </summary> <ul class="pl-4 mt-2 space-y-1" data-astro-cid-5blmo7yk> <li data-astro-cid-5blmo7yk> <details class="group/sub" data-astro-cid-5blmo7yk> <summary class="flex items-center justify-between py-2 px-4 font-semibold text-gray-700 cursor-pointer hover:bg-gray-50 rounded-lg list-none group-open/sub:text-primary" data-astro-cid-5blmo7yk> Team Organisation &amp; Scheduling <svg class="w-3 h-3 transition-transform group-open/sub:rotate-180" fill="none" stroke="currentColor" viewBox="0 0 24 24" data-astro-cid-5blmo7yk> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" data-astro-cid-5blmo7yk></path> </svg> </summary> <ul class="pl-4 mt-1 space-y-1" data-astro-cid-5blmo7yk> <li data-astro-cid-5blmo7yk> <a href="/organise" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Organise your team</a> </li><li data-astro-cid-5blmo7yk> <a href="/organise/schedule-matches-training" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Arrange matches and training</a> </li><li data-astro-cid-5blmo7yk> <a href="/organise/track-player-availability" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Track player availability</a> </li><li data-astro-cid-5blmo7yk> <a href="/organise/line-up-planner" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Plan your line-ups</a> </li> </ul> </details> </li><li data-astro-cid-5blmo7yk> <details class="group/sub" data-astro-cid-5blmo7yk> <summary class="flex items-center justify-between py-2 px-4 font-semibold text-gray-700 cursor-pointer hover:bg-gray-50 rounded-lg list-none group-open/sub:text-primary" data-astro-cid-5blmo7yk> Team Statistics &amp; Match Reports <svg class="w-3 h-3 transition-transform group-open/sub:rotate-180" fill="none" stroke="currentColor" viewBox="0 0 24 24" data-astro-cid-5blmo7yk> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" data-astro-cid-5blmo7yk></path> </svg> </summary> <ul class="pl-4 mt-1 space-y-1" data-astro-cid-5blmo7yk> <li data-astro-cid-5blmo7yk> <a href="/analyse" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Analyse your performances</a> </li><li data-astro-cid-5blmo7yk> <a href="/analyse/write-match-reports" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Publish match reports</a> </li><li data-astro-cid-5blmo7yk> <a href="/analyse/generate-team-stats" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Generate team stats</a> </li><li data-astro-cid-5blmo7yk> <a href="/analyse/track-player-performance" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Track player performance</a> </li> </ul> </details> </li><li data-astro-cid-5blmo7yk> <details class="group/sub" data-astro-cid-5blmo7yk> <summary class="flex items-center justify-between py-2 px-4 font-semibold text-gray-700 cursor-pointer hover:bg-gray-50 rounded-lg list-none group-open/sub:text-primary" data-astro-cid-5blmo7yk> Team Finances &amp; Payment Management <svg class="w-3 h-3 transition-transform group-open/sub:rotate-180" fill="none" stroke="currentColor" viewBox="0 0 24 24" data-astro-cid-5blmo7yk> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" data-astro-cid-5blmo7yk></path> </svg> </summary> <ul class="pl-4 mt-1 space-y-1" data-astro-cid-5blmo7yk> <li data-astro-cid-5blmo7yk> <a href="/finances" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Manage team finances</a> </li><li data-astro-cid-5blmo7yk> <a href="/finances/payment-tracking" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Record every payment</a> </li><li data-astro-cid-5blmo7yk> <a href="/finances/financial-reports" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Team and player reporting</a> </li><li data-astro-cid-5blmo7yk> <a href="/finances/receive-player-payments" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Receive player payments</a> </li> </ul> </details> </li><li data-astro-cid-5blmo7yk> <details class="group/sub" data-astro-cid-5blmo7yk> <summary class="flex items-center justify-between py-2 px-4 font-semibold text-gray-700 cursor-pointer hover:bg-gray-50 rounded-lg list-none group-open/sub:text-primary" data-astro-cid-5blmo7yk> Team Communication App &amp; Website <svg class="w-3 h-3 transition-transform group-open/sub:rotate-180" fill="none" stroke="currentColor" viewBox="0 0 24 24" data-astro-cid-5blmo7yk> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" data-astro-cid-5blmo7yk></path> </svg> </summary> <ul class="pl-4 mt-1 space-y-1" data-astro-cid-5blmo7yk> <li data-astro-cid-5blmo7yk> <a href="/communicate" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Improve team communication</a> </li><li data-astro-cid-5blmo7yk> <a href="/communicate/team-website-app" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Create a team website and app</a> </li><li data-astro-cid-5blmo7yk> <a href="/communicate/team-news-media" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Share news, docs, photos and video</a> </li><li data-astro-cid-5blmo7yk> <a href="/communicate/send-messages" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Send messages to team members</a> </li> </ul> </details> </li><li data-astro-cid-5blmo7yk> <a href="/all-teamstats-features" class="block py-2 px-4 font-semibold text-gray-700 hover:text-primary rounded-lg" data-astro-cid-5blmo7yk>View all features</a> </li> </ul> </details> </li><li class="mobile-nav-item" data-astro-cid-5blmo7yk> <details class="group" data-astro-cid-5blmo7yk> <summary class="flex items-center justify-between py-3 px-4 font-bold text-gray-900 cursor-pointer hover:bg-gray-50 rounded-lg list-none group-open:bg-gray-50" data-astro-cid-5blmo7yk> Who it&#39;s for <svg class="w-4 h-4 transition-transform group-open:rotate-180 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24" data-astro-cid-5blmo7yk> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" data-astro-cid-5blmo7yk></path> </svg> </summary> <ul class="pl-4 mt-2 space-y-1" data-astro-cid-5blmo7yk> <li data-astro-cid-5blmo7yk> <details class="group/sub" data-astro-cid-5blmo7yk> <summary class="flex items-center justify-between py-2 px-4 font-semibold text-gray-700 cursor-pointer hover:bg-gray-50 rounded-lg list-none group-open/sub:text-primary" data-astro-cid-5blmo7yk> Clubs and Teams <svg class="w-3 h-3 transition-transform group-open/sub:rotate-180" fill="none" stroke="currentColor" viewBox="0 0 24 24" data-astro-cid-5blmo7yk> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" data-astro-cid-5blmo7yk></path> </svg> </summary> <ul class="pl-4 mt-1 space-y-1" data-astro-cid-5blmo7yk> <li data-astro-cid-5blmo7yk> <a href="/team-management-app" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Teams and Clubs</a> </li><li data-astro-cid-5blmo7yk> <a href="/team-management-app#kids-teams" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Junior teams</a> </li><li data-astro-cid-5blmo7yk> <a href="/team-management-app#adult-teams" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Adult teams</a> </li><li data-astro-cid-5blmo7yk> <a href="/team-management-app#multi-team-clubs" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Multi-team clubs</a> </li> </ul> </details> </li><li data-astro-cid-5blmo7yk> <details class="group/sub" data-astro-cid-5blmo7yk> <summary class="flex items-center justify-between py-2 px-4 font-semibold text-gray-700 cursor-pointer hover:bg-gray-50 rounded-lg list-none group-open/sub:text-primary" data-astro-cid-5blmo7yk> Team Members <svg class="w-3 h-3 transition-transform group-open/sub:rotate-180" fill="none" stroke="currentColor" viewBox="0 0 24 24" data-astro-cid-5blmo7yk> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" data-astro-cid-5blmo7yk></path> </svg> </summary> <ul class="pl-4 mt-1 space-y-1" data-astro-cid-5blmo7yk> <li data-astro-cid-5blmo7yk> <a href="/team-communication-app" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Team Members</a> </li><li data-astro-cid-5blmo7yk> <a href="/team-communication-app#management-staff-officials" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Coaches, managers &amp; staff</a> </li><li data-astro-cid-5blmo7yk> <a href="/team-communication-app#players" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Players</a> </li><li data-astro-cid-5blmo7yk> <a href="/team-communication-app#parents-supporters" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Parents &amp; supporters</a> </li> </ul> </details> </li><li data-astro-cid-5blmo7yk> <details class="group/sub" data-astro-cid-5blmo7yk> <summary class="flex items-center justify-between py-2 px-4 font-semibold text-gray-700 cursor-pointer hover:bg-gray-50 rounded-lg list-none group-open/sub:text-primary" data-astro-cid-5blmo7yk> Success Stories <svg class="w-3 h-3 transition-transform group-open/sub:rotate-180" fill="none" stroke="currentColor" viewBox="0 0 24 24" data-astro-cid-5blmo7yk> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" data-astro-cid-5blmo7yk></path> </svg> </summary> <ul class="pl-4 mt-1 space-y-1" data-astro-cid-5blmo7yk> <li data-astro-cid-5blmo7yk> <a href="/success-stories" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>User Feedback</a> </li><li data-astro-cid-5blmo7yk> <a href="/success-stories#testimonials" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Testimonials</a> </li><li data-astro-cid-5blmo7yk> <a href="/teamstats-top-50-football-teams" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>TeamStats Top 50</a> </li><li data-astro-cid-5blmo7yk> <a href="/blog" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Grassroots Football Blog</a> </li> </ul> </details> </li><li data-astro-cid-5blmo7yk> <details class="group/sub" data-astro-cid-5blmo7yk> <summary class="flex items-center justify-between py-2 px-4 font-semibold text-gray-700 cursor-pointer hover:bg-gray-50 rounded-lg list-none group-open/sub:text-primary" data-astro-cid-5blmo7yk> Directory <svg class="w-3 h-3 transition-transform group-open/sub:rotate-180" fill="none" stroke="currentColor" viewBox="0 0 24 24" data-astro-cid-5blmo7yk> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" data-astro-cid-5blmo7yk></path> </svg> </summary> <ul class="pl-4 mt-1 space-y-1" data-astro-cid-5blmo7yk> <li data-astro-cid-5blmo7yk> <a href="/directory" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Directory Home</a> </li><li data-astro-cid-5blmo7yk> <a href="/teams" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Team Directory</a> </li><li data-astro-cid-5blmo7yk> <a href="/leagues" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>League Directory</a> </li><li data-astro-cid-5blmo7yk> <a href="/match-reports" class="block py-2 px-4 text-sm text-gray-600 hover:text-primary transition-colors" data-astro-cid-5blmo7yk>Match Reports</a> </li> </ul> </details> </li> </ul> </details> </li><li data-astro-cid-5blmo7yk> <a href="/pricing" class="block py-3 px-4 font-bold text-gray-900 hover:bg-gray-50 rounded-lg transition-colors" data-astro-cid-5blmo7yk> Pricing </a> </li><li data-astro-cid-5blmo7yk> <a href="/contact" class="block py-3 px-4 font-bold text-gray-900 hover:bg-gray-50 rounded-lg transition-colors contact-trigger" data-astro-cid-5blmo7yk> Contact </a> </li>  <li class="pt-6 space-y-6" data-astro-cid-5blmo7yk> <!-- Populated by login.js: either Login/Get Started buttons (logged out) or avatar + Log Out (logged in) --> <div id="mobile-user-nav" class="space-y-3" data-astro-cid-5blmo7yk></div> <div class="pt-4 flex flex-col items-center" data-astro-cid-5blmo7yk> <p class="text-[11px] font-bold text-gray-400 uppercase tracking-[0.18em] mb-2" data-astro-cid-5blmo7yk>Download the TeamStats app</p> <div class="flex gap-5 justify-center"> <div class="flex flex-col items-center"> <a href="https://apps.apple.com/gb/app/teamstats-football-team-app/id1275644100" target="_blank" rel="noopener noreferrer" class="block w-40 sm:w-44"> <img src="https://assets.teamstats.net/img-m-320-100/logos/app-stores/app-store-badge.png?f=avif" alt="Download on the Apple App Store" loading="lazy" width="320" height="95" class="w-full h-auto shadow-lg"> </a> <div class="text-xs mt-1">⭐⭐⭐⭐⭐</div> </div> <div class="flex flex-col items-center"> <a href="https://play.google.com/store/apps/details?id=net.teamstats.app" target="_blank" rel="noopener noreferrer" class="block w-40 sm:w-44"> <img src="https://assets.teamstats.net/img-m-320-100/logos/app-stores/google-play-badge.png?f=avif" alt="Get it on Google Play" loading="lazy" width="320" height="95" class="w-full h-auto shadow-lg"> </a> <div class="text-xs mt-1">⭐⭐⭐⭐⭐</div> </div> </div> </div> </li>  </ul> </div> </div> </div> <script type="module">const w=window.blurManager;document.addEventListener("click",t=>{const e=t.target;if(!e)return;const n=e.closest(".open-login-modal"),a=e.closest(".trigger-signup");if(!n&&!a)return;if(!!e.closest(".drawer-side")){const r=document.getElementById("mobile-drawer"),l=document.getElementById("mobile-menu-toggle");r?.checked&&(r.checked=!1,l&&l.classList.remove("open"),w&&w.disable("mobile-drawer"))}n&&(t.preventDefault(),window.dispatchEvent(new CustomEvent("openLoginModal")))});const u=window.disableMobileDrawerBlur,g=()=>{const t=document.getElementById("directory-search-section"),e=document.getElementById("directory-search-input");t&&(t.scrollIntoView({behavior:"smooth",block:"start"}),window.setTimeout(()=>{if(e){e.focus();const n=e.value.length;try{e.setSelectionRange(n,n)}catch{}}},400))},h=()=>{const t=document.documentElement;if(t.__tsNavbarInit)return;t.__tsNavbarInit=!0;const e=document.getElementById("mobile-drawer"),n=document.getElementById("mobile-menu-toggle");e&&n&&e.addEventListener("change",()=>{e.checked?n.classList.add("open"):n.classList.remove("open")});const a=document.querySelector(".drawer-side");a&&e&&a.addEventListener("click",o=>{const d=o.target;!d||!d.closest("a[href]")||(e.checked=!1,n&&n.classList.remove("open"),u&&u("mobile-drawer"))}),(()=>{const{pathname:o}=window.location,d=c=>{if(!c)return"/";try{let s=new URL(c,window.location.origin).pathname;return s.length>1&&s.endsWith("/")&&(s=s.slice(0,-1)),s||"/"}catch{return c}},v=d(o);document.querySelectorAll(".drawer-side .mobile-nav-item a[href]").forEach(c=>{const m=c.getAttribute("href");if(!m||m.startsWith("http")||m.startsWith("#"))return;d(m)===v&&c.classList.add("text-primary")})})();const r=document.getElementById("directory-search-nav-item");r&&r.addEventListener("click",o=>{o.preventDefault(),g()});const l=document.getElementById("directory-search-mobile-nav-item");l&&e&&l.addEventListener("click",o=>{o.preventDefault(),e.checked=!1,n&&n.classList.remove("open"),u&&u("mobile-drawer"),window.setTimeout(()=>{g()},150)});const b=document.getElementById("mobile-directory-search-btn");b&&b.addEventListener("click",o=>{o.preventDefault(),g()})},y=document.querySelectorAll("li.menu-item"),f=()=>{y.forEach(t=>{const e=t.querySelector(".dropdown-content");e&&(e.classList.remove("block"),e.style.display="none"),t.classList.remove("active")}),document.body.classList.remove("dropdown-open")};y.forEach(t=>{const e=t.querySelector("a"),n=t.querySelector(".dropdown-content");if(!e||!n)return;e.addEventListener("click",i=>{i.preventDefault(),i.stopPropagation();const r=t.classList.contains("active");f(),r||(t.classList.add("active"),n.classList.add("block"),n.style.display="block",document.body.classList.add("dropdown-open"))}),n.querySelectorAll("a[href]").forEach(i=>{i.addEventListener("click",()=>{f()})})});document.addEventListener("click",t=>{t.target.closest("li.menu-item")||f()});document.addEventListener("keydown",t=>{t.key==="Escape"&&f()});document.readyState==="loading"?document.addEventListener("DOMContentLoaded",h,{once:!0}):h();document.addEventListener("astro:after-swap",()=>{const t=document.documentElement;t.__tsNavbarInit=!1,h()});</script>  <div class="hero relative flex items-center overflow-visible pt-24 lg:pt-36 lg:pb-30 pb-40" style="min-height: 600px;" data-astro-cid-lhnbf22g> <!-- Background slideshow --> <div class="hero-backgrounds absolute inset-0 z-0" data-astro-cid-lhnbf22g> <div class="hero-bg active" data-astro-cid-lhnbf22g> <picture> <source srcset="https://assets.teamstats.net/img-m-1000-75/backgrounds/kids-football-manager.jpg?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-1000-75/backgrounds/kids-football-manager.jpg?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-360-70/backgrounds/kids-football-manager.jpg?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-360-70/backgrounds/kids-football-manager.jpg?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-360-70/backgrounds/kids-football-manager.jpg" alt loading="eager" fetchpriority="high" width="360" height="640" class="w-full h-full object-cover"> </picture> </div><div class="hero-bg " data-astro-cid-lhnbf22g> <picture> <source srcset="https://assets.teamstats.net/img-m-1000-75/backgrounds/mary-dendy.jpg?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-1000-75/backgrounds/mary-dendy.jpg?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-360-70/backgrounds/mary-dendy.jpg?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-360-70/backgrounds/mary-dendy.jpg?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-360-70/backgrounds/mary-dendy.jpg" alt loading="lazy" width="360" height="640" class="w-full h-full object-cover"> </picture> </div><div class="hero-bg " data-astro-cid-lhnbf22g> <picture> <source srcset="https://assets.teamstats.net/img-m-1000-75/backgrounds/football-background-3.jpg?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-1000-75/backgrounds/football-background-3.jpg?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-360-70/backgrounds/football-background-3.jpg?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-360-70/backgrounds/football-background-3.jpg?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-360-70/backgrounds/football-background-3.jpg" alt loading="lazy" width="360" height="640" class="w-full h-full object-cover"> </picture> </div><div class="hero-bg " data-astro-cid-lhnbf22g> <picture> <source srcset="https://assets.teamstats.net/img-m-1000-75/backgrounds/football-coach-boys-training.jpg?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-1000-75/backgrounds/football-coach-boys-training.jpg?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-360-70/backgrounds/football-coach-boys-training.jpg?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-360-70/backgrounds/football-coach-boys-training.jpg?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-360-70/backgrounds/football-coach-boys-training.jpg" alt loading="lazy" width="360" height="640" class="w-full h-full object-cover"> </picture> </div> </div> <div class="hero-content relative z-20 max-w-6xl mx-auto w-full lg:px-4 grid grid-cols-1 md:grid-cols-12 gap-8 lg:gap-12 items-center" data-astro-cid-lhnbf22g> <div class="hero-text text-white text-center md:text-left md:col-span-8 lg:col-span-8" data-astro-cid-lhnbf22g> <h2 class="text-3xl md:text-4xl lg:text-5xl xl:text-6xl font-bold leading-tight mb-4 lg:mb-6 relative" style="min-height: 2.2em;" data-astro-cid-lhnbf22g> <span class="hero-headline active" data-astro-cid-lhnbf22g>Team Management</span> <span class="hero-headline" data-astro-cid-lhnbf22g>Team Admin</span> <span class="hero-headline" data-astro-cid-lhnbf22g>Team Organisation</span> <span class="hero-headline" data-astro-cid-lhnbf22g>Team Communication</span> <span class="hero-headline" data-astro-cid-lhnbf22g>Team Line-ups</span> <span class="hero-headline" data-astro-cid-lhnbf22g>Team Statistics</span> <span class="hero-headline" data-astro-cid-lhnbf22g>Team Finances</span> <span class="hero-headline-suffix block" data-astro-cid-lhnbf22g> Made Easy</span> </h2> <h1 class="text-sm md:text-base lg:text-xl text-white/95 mb-2 leading-relaxed" data-astro-cid-lhnbf22g>
TeamStats is the ultimate app for managing your football team.
</h1> <h3 class="hidden md:block text-lg lg:text-xl text-white/95 mb-6 lg:mb-8 leading-relaxed" data-astro-cid-lhnbf22g>
Everything you need in one powerful software platform.
</h3> <div class="hero-buttons flex flex-col sm:flex-row gap-3 lg:gap-4 items-center md:items-start justify-center md:justify-start" data-astro-cid-lhnbf22g> <button class="hidden md:inline-flex trigger-signup btn btn-secondary btn-lg uppercase font-semibold shadow-lg" data-astro-cid-lhnbf22g>
Get Started For Free
</button> <a href="#video" id="desktop-hero-watch-video" class="hidden md:inline-flex btn btn-ghost btn-lg text-white normal-case font-normal px-4 hover:bg-transparent hover:underline items-center gap-2 border border-white/70 hover:border-white" data-astro-cid-lhnbf22g> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="w-5 h-5 fill-current" data-astro-cid-lhnbf22g> <circle cx="12" cy="12" r="11" class="text-red-600" data-astro-cid-lhnbf22g></circle> <polygon points="10,8 16,12 10,16" class="text-white" data-astro-cid-lhnbf22g></polygon> </svg> <span data-astro-cid-lhnbf22g>or watch our video overview</span> </a> </div> <div class="mt-4 md:hidden flex justify-center" data-astro-cid-lhnbf22g> <div class="flex gap-5 justify-center"> <div class="flex flex-col items-center"> <a href="https://apps.apple.com/gb/app/teamstats-football-team-app/id1275644100" target="_blank" rel="noopener noreferrer" class="block w-40 sm:w-44"> <img src="https://assets.teamstats.net/img-m-320-100/logos/app-stores/app-store-badge.png?f=avif" alt="Download on the Apple App Store" loading="lazy" width="320" height="95" class="w-full h-auto shadow-lg"> </a> <div class="text-xs mt-1">⭐⭐⭐⭐⭐</div> </div> <div class="flex flex-col items-center"> <a href="https://play.google.com/store/apps/details?id=net.teamstats.app" target="_blank" rel="noopener noreferrer" class="block w-40 sm:w-44"> <img src="https://assets.teamstats.net/img-m-320-100/logos/app-stores/google-play-badge.png?f=avif" alt="Get it on Google Play" loading="lazy" width="320" height="95" class="w-full h-auto shadow-lg"> </a> <div class="text-xs mt-1">⭐⭐⭐⭐⭐</div> </div> </div> </div> </div> <div class="hero-phone flex justify-center lg:justify-end items-start relative -mb-[200px] md:col-span-4 lg:col-span-4" data-astro-cid-lhnbf22g> <div class="z-10" data-astro-cid-lhnbf22g> <div class="phone-frame phone-frame-shadow" role="img" aria-label="TeamStats mobile app screenshots" style="width: 340px; height: 680px; aspect-ratio: 340/680;" data-astro-cid-7xd7yi2v> <div class="phone-screen" data-astro-cid-7xd7yi2v> <div class="hero-screenshot active" data-astro-cid-7xd7yi2v> <picture> <source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/mobile-team-overview.png?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/mobile-team-overview.png?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/mobile-team-overview.png?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/mobile-team-overview.png?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-550-80/screenshots/mobile-team-overview.png" alt="Team overview on mobile" loading="eager" fetchpriority="high" width="550" height="1100" class="w-full h-full object-contain"> </picture> </div><div class="hero-screenshot " data-astro-cid-7xd7yi2v> <picture> <source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/mobile-admin-menu.png?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/mobile-admin-menu.png?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/mobile-admin-menu.png?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/mobile-admin-menu.png?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-550-80/screenshots/mobile-admin-menu.png" alt="Admin menu interface" loading="lazy" fetchpriority="low" width="550" height="1100" class="w-full h-full object-contain"> </picture> </div><div class="hero-screenshot " data-astro-cid-7xd7yi2v> <picture> <source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/availability-event-list-mobile.png?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/availability-event-list-mobile.png?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/availability-event-list-mobile.png?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/availability-event-list-mobile.png?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-550-80/screenshots/availability-event-list-mobile.png" alt="Event availability list" loading="lazy" fetchpriority="low" width="550" height="1100" class="w-full h-full object-contain"> </picture> </div><div class="hero-screenshot " data-astro-cid-7xd7yi2v> <picture> <source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/choose-availability.png?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/choose-availability.png?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/choose-availability.png?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/choose-availability.png?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-550-80/screenshots/choose-availability.png" alt="Select availability options" loading="lazy" fetchpriority="low" width="550" height="1100" class="w-full h-full object-contain"> </picture> </div><div class="hero-screenshot " data-astro-cid-7xd7yi2v> <picture> <source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/admin-team-lineup-mobile.jpg?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/admin-team-lineup-mobile.jpg?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/admin-team-lineup-mobile.jpg?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/admin-team-lineup-mobile.jpg?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-550-80/screenshots/admin-team-lineup-mobile.jpg" alt="Team lineup management" loading="lazy" fetchpriority="low" width="550" height="1100" class="w-full h-full object-contain"> </picture> </div><div class="hero-screenshot " data-astro-cid-7xd7yi2v> <picture> <source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/stats-team-home-mobile.jpg?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/stats-team-home-mobile.jpg?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/stats-team-home-mobile.jpg?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/stats-team-home-mobile.jpg?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-550-80/screenshots/stats-team-home-mobile.jpg" alt="Team statistics dashboard" loading="lazy" fetchpriority="low" width="550" height="1100" class="w-full h-full object-contain"> </picture> </div><div class="hero-screenshot " data-astro-cid-7xd7yi2v> <picture> <source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/finances-overview.png?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/finances-overview.png?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/finances-overview.png?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/finances-overview.png?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-550-80/screenshots/finances-overview.png" alt="Financial overview screen" loading="lazy" fetchpriority="low" width="550" height="1100" class="w-full h-full object-contain"> </picture> </div> </div> </div> <script type="module">document.addEventListener("DOMContentLoaded",()=>{document.querySelectorAll(".phone-screen").forEach((r,d)=>{const e=Array.from(r.querySelectorAll(".hero-screenshot"));if(e.length===0)return;let t=0;setInterval(()=>{const n=e[t],s=(t+1)%e.length,c=e[s];n.classList.add("exiting"),c.classList.add("active"),setTimeout(()=>{n.classList.remove("active","exiting"),t=s},400)},4e3)})});</script> </div> </div> </div> </div> <script type="module">const s=()=>{const e=Array.from(document.querySelectorAll(".hero-bg")),t=Array.from(document.querySelectorAll(".hero-headline"));let n=0,c=0;if(!e.length||!t.length)return;function l(){e[n].classList.remove("active"),n=(n+1)%e.length,e[n].classList.add("active")}function i(){const o=t[c];o.classList.add("fading-out"),setTimeout(()=>{o.classList.remove("active","fading-out"),c=(c+1)%t.length,t[c].classList.add("active")},100)}setInterval(()=>{i(),window.dispatchEvent(new CustomEvent("hero-cycle"))},4e3),setInterval(l,8e3);const d=document.getElementById("desktop-hero-watch-video");d&&d.addEventListener("click",o=>{o.preventDefault();const a=document.getElementById("openVideoModal");a&&a.click()})};document.readyState==="loading"?document.addEventListener("DOMContentLoaded",s):s();</script> <section class="pt-10 lg:pt-6 pb-8 lg:pb-10 bg-base-200" data-astro-cid-of2dwe7y> <div class="container mx-auto px-4 max-w-6xl" data-astro-cid-of2dwe7y> <div class="text-center pt-6 mb-6 lg:mb-8" data-astro-cid-of2dwe7y> <p class="text-sm text-base-content/90 tracking-wide" data-astro-cid-of2dwe7y>
Used around the world by clubs and teams from:
</p> </div> <div class="w-full inline-flex flex-nowrap overflow-hidden mask-[linear-gradient(to_right,transparent_0,black_64px,black_calc(100%-64px),transparent_100%)]" data-astro-cid-of2dwe7y> <ul class="flex items-center justify-center md:justify-start [&_li]:mx-4 lg:[&_li]:mx-8 [&_img]:max-w-none animate-infinite-scroll" data-astro-cid-of2dwe7y> <li data-astro-cid-of2dwe7y> <img src="https://assets.teamstats.net/img-m-180-100/logos/associations/The-FA-England-Football-Association.png?f=avif" alt="The FA Logo - English Football Association" loading="lazy" width="180" height="100" class="h-12 lg:h-16 w-auto" data-astro-cid-of2dwe7y> </li><li data-astro-cid-of2dwe7y> <img src="https://assets.teamstats.net/img-m-180-100/logos/associations/Irish-FA-Northern-Ireland-Football-Association.png?f=avif" alt="Northern Ireland FA Logo" loading="lazy" width="180" height="100" class="h-12 lg:h-16 w-auto" data-astro-cid-of2dwe7y> </li><li data-astro-cid-of2dwe7y> <img src="https://assets.teamstats.net/img-m-180-100/logos/associations/Scottish-FA-Scotland-Football-Association.png?f=avif" alt="Scottish FA logo" loading="lazy" width="180" height="100" class="h-12 lg:h-16 w-auto" data-astro-cid-of2dwe7y> </li><li data-astro-cid-of2dwe7y> <img src="https://assets.teamstats.net/img-m-180-100/logos/associations/United-States-Soccer-Federation-USA.png?f=avif" alt="United States Soccer Logo" loading="lazy" width="180" height="100" class="h-12 lg:h-16 w-auto" data-astro-cid-of2dwe7y> </li><li data-astro-cid-of2dwe7y> <img src="https://assets.teamstats.net/img-m-180-100/logos/associations/Welsh-FA-Wales-Football-Association.png?f=avif" alt="Welsh FA Logo" loading="lazy" width="180" height="100" class="h-12 lg:h-16 w-auto" data-astro-cid-of2dwe7y> </li><li data-astro-cid-of2dwe7y> <img src="https://assets.teamstats.net/img-m-180-100/logos/associations/Football-Association-Ireland-Eire.png?f=avif" alt="Eire Football Association Logo" loading="lazy" width="180" height="100" class="h-12 lg:h-16 w-auto" data-astro-cid-of2dwe7y> </li><li data-astro-cid-of2dwe7y> <img src="https://assets.teamstats.net/img-m-180-100/logos/associations/Czech-Republic-Football-Association.png?f=avif" alt="Czech Republic Football Association Logo" loading="lazy" width="180" height="100" class="h-12 lg:h-16 w-auto" data-astro-cid-of2dwe7y> </li><li data-astro-cid-of2dwe7y> <img src="https://assets.teamstats.net/img-m-180-100/logos/associations/Singapore-Football-Association.png?f=avif" alt="Singapore Football Association Logo" loading="lazy" width="180" height="100" class="h-12 lg:h-16 w-auto" data-astro-cid-of2dwe7y> </li><li data-astro-cid-of2dwe7y> <img src="https://assets.teamstats.net/img-m-180-100/logos/associations/Football-Federation-Australia-FFA.png?f=avif" alt="Australia FFA logo - Football Federation Australia" loading="lazy" width="180" height="100" class="h-12 lg:h-16 w-auto" data-astro-cid-of2dwe7y> </li> </ul> <ul class="flex items-center justify-center md:justify-start [&_li]:mx-4 lg:[&_li]:mx-8 [&_img]:max-w-none animate-infinite-scroll" aria-hidden="true" data-astro-cid-of2dwe7y> <li data-astro-cid-of2dwe7y> <img src="https://assets.teamstats.net/img-m-180-100/logos/associations/The-FA-England-Football-Association.png?f=avif" alt="The FA Logo - English Football Association" loading="lazy" width="180" height="100" class="h-12 lg:h-16 w-auto" data-astro-cid-of2dwe7y> </li><li data-astro-cid-of2dwe7y> <img src="https://assets.teamstats.net/img-m-180-100/logos/associations/Irish-FA-Northern-Ireland-Football-Association.png?f=avif" alt="Northern Ireland FA Logo" loading="lazy" width="180" height="100" class="h-12 lg:h-16 w-auto" data-astro-cid-of2dwe7y> </li><li data-astro-cid-of2dwe7y> <img src="https://assets.teamstats.net/img-m-180-100/logos/associations/Scottish-FA-Scotland-Football-Association.png?f=avif" alt="Scottish FA logo" loading="lazy" width="180" height="100" class="h-12 lg:h-16 w-auto" data-astro-cid-of2dwe7y> </li><li data-astro-cid-of2dwe7y> <img src="https://assets.teamstats.net/img-m-180-100/logos/associations/United-States-Soccer-Federation-USA.png?f=avif" alt="United States Soccer Logo" loading="lazy" width="180" height="100" class="h-12 lg:h-16 w-auto" data-astro-cid-of2dwe7y> </li><li data-astro-cid-of2dwe7y> <img src="https://assets.teamstats.net/img-m-180-100/logos/associations/Welsh-FA-Wales-Football-Association.png?f=avif" alt="Welsh FA Logo" loading="lazy" width="180" height="100" class="h-12 lg:h-16 w-auto" data-astro-cid-of2dwe7y> </li><li data-astro-cid-of2dwe7y> <img src="https://assets.teamstats.net/img-m-180-100/logos/associations/Football-Association-Ireland-Eire.png?f=avif" alt="Eire Football Association Logo" loading="lazy" width="180" height="100" class="h-12 lg:h-16 w-auto" data-astro-cid-of2dwe7y> </li><li data-astro-cid-of2dwe7y> <img src="https://assets.teamstats.net/img-m-180-100/logos/associations/Czech-Republic-Football-Association.png?f=avif" alt="Czech Republic Football Association Logo" loading="lazy" width="180" height="100" class="h-12 lg:h-16 w-auto" data-astro-cid-of2dwe7y> </li><li data-astro-cid-of2dwe7y> <img src="https://assets.teamstats.net/img-m-180-100/logos/associations/Singapore-Football-Association.png?f=avif" alt="Singapore Football Association Logo" loading="lazy" width="180" height="100" class="h-12 lg:h-16 w-auto" data-astro-cid-of2dwe7y> </li><li data-astro-cid-of2dwe7y> <img src="https://assets.teamstats.net/img-m-180-100/logos/associations/Football-Federation-Australia-FFA.png?f=avif" alt="Australia FFA logo - Football Federation Australia" loading="lazy" width="180" height="100" class="h-12 lg:h-16 w-auto" data-astro-cid-of2dwe7y> </li> </ul> </div> </div> </section> <section class="py-8 lg:py-12 bg-white"> <div class="container mx-auto px-4 max-w-6xl"> <div class="grid grid-cols-1 lg:grid-cols-2 gap-6 lg:gap-10 items-center"> <div class="order-1 lg:order-1 lg:pt-6 lg:pb-3"> <h2 class="text-2xl md:text-3xl lg:text-4xl font-bold mb-4 lg:mb-6">Work smarter and become a better team.</h2> <p class="text-base lg:text-lg mb-3 lg:mb-4 leading-relaxed">Running your own football team is a lot of hard work.</p> <p class="text-base lg:text-lg mb-3 lg:mb-4 leading-relaxed">All that planning, tracking and chasing means time, effort and hassle.</p> <p class="text-base lg:text-lg mb-3 lg:mb-4 leading-relaxed">We get it - because we do it too.</p> <p class="text-base lg:text-lg mb-3 lg:mb-4 leading-relaxed">TeamStats was created to make team management easier and more efficient.</p> <p class="text-base lg:text-lg mb-4 lg:mb-6 leading-relaxed">Our team management software, apps and websites will help to improve your team - on and off the pitch.</p> </div> <div class="order-2 lg:order-2 -mt-10"> <div class="device-showcase-container" style="
    --container-height-mobile: 320px;
    --container-height-desktop: 550px;
  " data-astro-cid-5svpmbcj> <div class="device-wrapper " style="
          --x-offset-desktop: 80px;
          --y-offset-desktop: 0px;
          --x-offset-mobile: -100px;
          --y-offset-mobile: 0px;
          --desktop-scale: 0.75;
          --mobile-scale: 0.5;
          --z-index: 1;
          --margin-top-desktop: 0px;
          --margin-top-mobile: 0px;
        " data-astro-cid-5svpmbcj>   <div class="laptop-frame" data-astro-cid-ptqbfvrg> <div class="laptop-screen" data-astro-cid-ptqbfvrg> <picture class="absolute inset-0 w-full h-full"> <source srcset="https://assets.teamstats.net/img-m-600-100/screenshots/desktop-team-home-1440.png?f=avif&v=130126-1" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-600-100/screenshots/desktop-team-home-1440.png?f=webp&v=130126-1" type="image/webp"> <img src="https://assets.teamstats.net/img-m-600-100/screenshots/desktop-team-home-1440.png" alt="TeamStats screenshot - team home on laptop" loading="lazy" class="absolute inset-0 w-full h-full object-cover"> </picture> </div> <div class="laptop-base" data-astro-cid-ptqbfvrg></div> </div>   </div><div class="device-wrapper hide-mobile" style="
          --x-offset-desktop: 280px;
          --y-offset-desktop: 70px;
          --x-offset-mobile: 50px;
          --y-offset-mobile: 70px;
          --desktop-scale: 0.8928571428571429;
          --mobile-scale: 0.2857142857142857;
          --z-index: 2;
          --margin-top-desktop: 0px;
          --margin-top-mobile: 0px;
        " data-astro-cid-5svpmbcj>    <div class="tablet-frame" data-astro-cid-aovdocaw> <div class="tablet-screen" data-astro-cid-aovdocaw> <picture class="w-full h-full"> <source srcset="https://assets.teamstats.net/img-m-600-100/screenshots/squad-player-profile-ipad.png?f=avif&v=130126-1" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-600-100/screenshots/squad-player-profile-ipad.png?f=webp&v=130126-1" type="image/webp"> <img src="https://assets.teamstats.net/img-m-600-100/screenshots/squad-player-profile-ipad.png" alt="TeamStats screenshot - team home on iPad" loading="lazy" class="w-full h-full object-cover"> </picture> </div> </div>  </div><div class="device-wrapper " style="
          --x-offset-desktop: -180px;
          --y-offset-desktop: 65px;
          --x-offset-mobile: 90px;
          --y-offset-mobile: 8px;
          --desktop-scale: 0.4117647058823529;
          --mobile-scale: 0.38235294117647056;
          --z-index: 3;
          --margin-top-desktop: 0px;
          --margin-top-mobile: 0px;
        " data-astro-cid-5svpmbcj> <div class="phone-frame-single" data-astro-cid-esjtk2be> <div class="phone-screen-single" data-astro-cid-esjtk2be> <picture class="w-full h-full"> <source srcset="https://assets.teamstats.net/img-m-600-100/screenshots/admin-team-lineup-mobile.png?f=avif&v=130126-1" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-600-100/screenshots/admin-team-lineup-mobile.png?f=webp&v=130126-1" type="image/webp"> <img src="https://assets.teamstats.net/img-m-600-100/screenshots/admin-team-lineup-mobile.png" alt="TeamStats screenshot - team line-up on iPhone" loading="lazy" class="w-full h-full object-contain"> </picture> </div> </div>     </div> </div> </div> </div> </div> </section> <section class="py-8 lg:py-12 bg-white"> <div class="container mx-auto px-4 max-w-5xl"> <div class="feature-testimonials-swiper swiper"> <div class="swiper-wrapper"> <div class="swiper-slide"> <div class="h-[384px] rounded-2xl border border-base-300 overflow-hidden"> <div class="relative h-full w-full"> <picture> <source srcset="https://assets.teamstats.net/img-m-800-80/photos/teams/Leafield-Athletic.jpg?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-800-80/photos/teams/Leafield-Athletic.jpg?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/teams/Leafield-Athletic.jpg?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/teams/Leafield-Athletic.jpg?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-500-75/photos/teams/Leafield-Athletic.jpg" alt="Mark Dodd - Manager, Leafield Athletic U15" loading="eager" width="500" height="500" class="absolute inset-0 w-full h-full object-cover"> </picture> <div class="absolute inset-0 bg-gradient-to-b from-black/0 via-black/60 to-black/95"></div> <div class="relative z-10 flex flex-col items-center justify-end h-full px-6 pb-6 text-center text-white"> <blockquote class="text-base md:text-lg lg:text-xl font-semibold leading-relaxed max-w-xl mx-auto mb-4">
"Lots of great features that really do save you time, money and a lot of hassle. Wish I&#39;d discovered it earlier!"
</blockquote> <div class="flex flex-col items-center gap-1"> <p class="font-bold text-xs md:text-sm">Mark Dodd</p> <p class="text-[11px] md:text-xs text-white/80">Manager, Leafield Athletic U15</p> <p class="text-[11px] md:text-xs text-yellow-300 mt-1">⭐⭐⭐⭐⭐</p> </div> </div> </div> </div> </div><div class="swiper-slide"> <div class="h-[384px] rounded-2xl border border-base-300 overflow-hidden"> <div class="relative h-full w-full"> <picture> <source srcset="https://assets.teamstats.net/img-m-800-80/photos/teams/FC-Bury-Vipers.jpg?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-800-80/photos/teams/FC-Bury-Vipers.jpg?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/teams/FC-Bury-Vipers.jpg?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/teams/FC-Bury-Vipers.jpg?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-500-75/photos/teams/FC-Bury-Vipers.jpg" alt="Jason Latham  - FC Bury Vipers" loading="lazy" width="500" height="500" class="absolute inset-0 w-full h-full object-cover"> </picture> <div class="absolute inset-0 bg-gradient-to-b from-black/0 via-black/60 to-black/95"></div> <div class="relative z-10 flex flex-col items-center justify-end h-full px-6 pb-6 text-center text-white"> <blockquote class="text-base md:text-lg lg:text-xl font-semibold leading-relaxed max-w-xl mx-auto mb-4">
"There isn&#39;t an area of TeamStats which doesn&#39;t work well and the detailed stats that are available have really captured the imagination of the players."
</blockquote> <div class="flex flex-col items-center gap-1"> <p class="font-bold text-xs md:text-sm">Jason Latham </p> <p class="text-[11px] md:text-xs text-white/80">FC Bury Vipers</p> <p class="text-[11px] md:text-xs text-yellow-300 mt-1">⭐⭐⭐⭐⭐</p> </div> </div> </div> </div> </div><div class="swiper-slide"> <div class="h-[384px] rounded-2xl border border-base-300 overflow-hidden"> <div class="relative h-full w-full"> <picture> <source srcset="https://assets.teamstats.net/img-m-800-80/photos/teams/Adam-Rousell-Islington-Villa.jpg?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-800-80/photos/teams/Adam-Rousell-Islington-Villa.jpg?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/teams/Adam-Rousell-Islington-Villa.jpg?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/teams/Adam-Rousell-Islington-Villa.jpg?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-500-75/photos/teams/Adam-Rousell-Islington-Villa.jpg" alt="Adam Rousell - Islington Villa" loading="lazy" width="500" height="500" class="absolute inset-0 w-full h-full object-cover"> </picture> <div class="absolute inset-0 bg-gradient-to-b from-black/0 via-black/60 to-black/95"></div> <div class="relative z-10 flex flex-col items-center justify-end h-full px-6 pb-6 text-center text-white"> <blockquote class="text-base md:text-lg lg:text-xl font-semibold leading-relaxed max-w-xl mx-auto mb-4">
"The app allows our club to keep records of our fixtures and squad but most importantly our results and match reports as the season goes through and all in one place that is easy to share and view."
</blockquote> <div class="flex flex-col items-center gap-1"> <p class="font-bold text-xs md:text-sm">Adam Rousell</p> <p class="text-[11px] md:text-xs text-white/80">Islington Villa</p> <p class="text-[11px] md:text-xs text-yellow-300 mt-1">⭐⭐⭐⭐⭐</p> </div> </div> </div> </div> </div><div class="swiper-slide"> <div class="h-[384px] rounded-2xl border border-base-300 overflow-hidden"> <div class="relative h-full w-full"> <picture> <source srcset="https://assets.teamstats.net/img-m-800-80/photos/teams/Adam-Rousell-Islington-Villa.jpg?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-800-80/photos/teams/Adam-Rousell-Islington-Villa.jpg?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/teams/Adam-Rousell-Islington-Villa.jpg?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/teams/Adam-Rousell-Islington-Villa.jpg?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-500-75/photos/teams/Adam-Rousell-Islington-Villa.jpg" alt="Adam Rousell - Ilsington Villa" loading="lazy" width="500" height="500" class="absolute inset-0 w-full h-full object-cover"> </picture> <div class="absolute inset-0 bg-gradient-to-b from-black/0 via-black/60 to-black/95"></div> <div class="relative z-10 flex flex-col items-center justify-end h-full px-6 pb-6 text-center text-white"> <blockquote class="text-base md:text-lg lg:text-xl font-semibold leading-relaxed max-w-xl mx-auto mb-4">
"As a small amateur club, in previous years we would have been manually counting appearances and goals from past paper teamsheets or tweets of results - this saves us so much time and administration efforts!"
</blockquote> <div class="flex flex-col items-center gap-1"> <p class="font-bold text-xs md:text-sm">Adam Rousell</p> <p class="text-[11px] md:text-xs text-white/80">Ilsington Villa</p> <p class="text-[11px] md:text-xs text-yellow-300 mt-1">⭐⭐⭐⭐⭐</p> </div> </div> </div> </div> </div><div class="swiper-slide"> <div class="h-[384px] rounded-2xl border border-base-300 overflow-hidden"> <div class="relative h-full w-full"> <picture> <source srcset="https://assets.teamstats.net/img-m-800-80/photos/teams/Pete-Holland-Normanby-Blacks.jpg?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-800-80/photos/teams/Pete-Holland-Normanby-Blacks.jpg?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/teams/Pete-Holland-Normanby-Blacks.jpg?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/teams/Pete-Holland-Normanby-Blacks.jpg?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-500-75/photos/teams/Pete-Holland-Normanby-Blacks.jpg" alt="Peter Holland - Normanby Blacks" loading="lazy" width="500" height="500" class="absolute inset-0 w-full h-full object-cover"> </picture> <div class="absolute inset-0 bg-gradient-to-b from-black/0 via-black/60 to-black/95"></div> <div class="relative z-10 flex flex-col items-center justify-end h-full px-6 pb-6 text-center text-white"> <blockquote class="text-base md:text-lg lg:text-xl font-semibold leading-relaxed max-w-xl mx-auto mb-4">
"As coaches, we love all the available statistics you can get from TeamStats. The more you put in, the more you get out and provides a great, almost professional football club type set of data for your team."
</blockquote> <div class="flex flex-col items-center gap-1"> <p class="font-bold text-xs md:text-sm">Peter Holland</p> <p class="text-[11px] md:text-xs text-white/80">Normanby Blacks</p> <p class="text-[11px] md:text-xs text-yellow-300 mt-1">⭐⭐⭐⭐⭐</p> </div> </div> </div> </div> </div><div class="swiper-slide"> <div class="h-[384px] rounded-2xl border border-base-300 overflow-hidden"> <div class="relative h-full w-full"> <picture> <source srcset="https://assets.teamstats.net/img-m-800-80/photos/teams/Tattenhoe-Reds.jpg?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-800-80/photos/teams/Tattenhoe-Reds.jpg?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/teams/Tattenhoe-Reds.jpg?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/teams/Tattenhoe-Reds.jpg?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-500-75/photos/teams/Tattenhoe-Reds.jpg" alt="Lee Willows - Tattenhoe Reds" loading="lazy" width="500" height="500" class="absolute inset-0 w-full h-full object-cover"> </picture> <div class="absolute inset-0 bg-gradient-to-b from-black/0 via-black/60 to-black/95"></div> <div class="relative z-10 flex flex-col items-center justify-end h-full px-6 pb-6 text-center text-white"> <blockquote class="text-base md:text-lg lg:text-xl font-semibold leading-relaxed max-w-xl mx-auto mb-4">
"My overall experience has given me the wow factor - I enjoy writing my team match reports on Monday morning.  I have used 3 different websites for my team and TeamStats is by far the best."
</blockquote> <div class="flex flex-col items-center gap-1"> <p class="font-bold text-xs md:text-sm">Lee Willows</p> <p class="text-[11px] md:text-xs text-white/80">Tattenhoe Reds</p> <p class="text-[11px] md:text-xs text-yellow-300 mt-1">⭐⭐⭐⭐⭐</p> </div> </div> </div> </div> </div><div class="swiper-slide"> <div class="h-[384px] rounded-2xl border border-base-300 overflow-hidden"> <div class="relative h-full w-full"> <picture> <source srcset="https://assets.teamstats.net/img-m-800-80/photos/teams/Tony-Woods-Real-Rosehill.jpg?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-800-80/photos/teams/Tony-Woods-Real-Rosehill.jpg?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/teams/Tony-Woods-Real-Rosehill.jpg?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/teams/Tony-Woods-Real-Rosehill.jpg?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-500-75/photos/teams/Tony-Woods-Real-Rosehill.jpg" alt="Tony Woods - Real Rosehill FC" loading="lazy" width="500" height="500" class="absolute inset-0 w-full h-full object-cover"> </picture> <div class="absolute inset-0 bg-gradient-to-b from-black/0 via-black/60 to-black/95"></div> <div class="relative z-10 flex flex-col items-center justify-end h-full px-6 pb-6 text-center text-white"> <blockquote class="text-base md:text-lg lg:text-xl font-semibold leading-relaxed max-w-xl mx-auto mb-4">
"A great user and player experience. Saves me so much time to enable me to spend more time coaching."
</blockquote> <div class="flex flex-col items-center gap-1"> <p class="font-bold text-xs md:text-sm">Tony Woods</p> <p class="text-[11px] md:text-xs text-white/80">Real Rosehill FC</p> <p class="text-[11px] md:text-xs text-yellow-300 mt-1">⭐⭐⭐⭐⭐</p> </div> </div> </div> </div> </div><div class="swiper-slide"> <div class="h-[384px] rounded-2xl border border-base-300 overflow-hidden"> <div class="relative h-full w-full"> <picture> <source srcset="https://assets.teamstats.net/img-m-800-80/photos/teams/kids-football-manager.jpg?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-800-80/photos/teams/kids-football-manager.jpg?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/teams/kids-football-manager.jpg?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/teams/kids-football-manager.jpg?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-500-75/photos/teams/kids-football-manager.jpg" alt="Martin Salter - Saxmundham Sports" loading="lazy" width="500" height="500" class="absolute inset-0 w-full h-full object-cover"> </picture> <div class="absolute inset-0 bg-gradient-to-b from-black/0 via-black/60 to-black/95"></div> <div class="relative z-10 flex flex-col items-center justify-end h-full px-6 pb-6 text-center text-white"> <blockquote class="text-base md:text-lg lg:text-xl font-semibold leading-relaxed max-w-xl mx-auto mb-4">
"I run a kids team and TeamStats allows me to get messages out to parents in bulk whilst the kids can log in and check our league standing and their own player stats . A great product which makes my life easier."
</blockquote> <div class="flex flex-col items-center gap-1"> <p class="font-bold text-xs md:text-sm">Martin Salter</p> <p class="text-[11px] md:text-xs text-white/80">Saxmundham Sports</p> <p class="text-[11px] md:text-xs text-yellow-300 mt-1">⭐⭐⭐⭐⭐</p> </div> </div> </div> </div> </div><div class="swiper-slide"> <div class="h-[384px] rounded-2xl border border-base-300 overflow-hidden"> <div class="relative h-full w-full"> <picture> <source srcset="https://assets.teamstats.net/img-m-800-80/photos/teams/Surbiton-Lions.jpg?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-800-80/photos/teams/Surbiton-Lions.jpg?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/teams/Surbiton-Lions.jpg?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/teams/Surbiton-Lions.jpg?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-500-75/photos/teams/Surbiton-Lions.jpg" alt="Philip Amuaku - Surbiton Lions" loading="lazy" width="500" height="500" class="absolute inset-0 w-full h-full object-cover"> </picture> <div class="absolute inset-0 bg-gradient-to-b from-black/0 via-black/60 to-black/95"></div> <div class="relative z-10 flex flex-col items-center justify-end h-full px-6 pb-6 text-center text-white"> <blockquote class="text-base md:text-lg lg:text-xl font-semibold leading-relaxed max-w-xl mx-auto mb-4">
"The finances section enables me to keep track of payments (or non-payment) from players, club expenditure and debts owed to the club"
</blockquote> <div class="flex flex-col items-center gap-1"> <p class="font-bold text-xs md:text-sm">Philip Amuaku</p> <p class="text-[11px] md:text-xs text-white/80">Surbiton Lions</p> <p class="text-[11px] md:text-xs text-yellow-300 mt-1">⭐⭐⭐⭐⭐</p> </div> </div> </div> </div> </div><div class="swiper-slide"> <div class="h-[384px] rounded-2xl border border-base-300 overflow-hidden"> <div class="relative h-full w-full"> <picture> <source srcset="https://assets.teamstats.net/img-m-800-80/photos/teams/Tony-Woods-Real-Rosehill.jpg?a=1?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-800-80/photos/teams/Tony-Woods-Real-Rosehill.jpg?a=1?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/teams/Tony-Woods-Real-Rosehill.jpg?a=1?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/teams/Tony-Woods-Real-Rosehill.jpg?a=1?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-500-75/photos/teams/Tony-Woods-Real-Rosehill.jpg?a=1" alt="Tony Woods - Real Rosehill FC" loading="lazy" width="500" height="500" class="absolute inset-0 w-full h-full object-cover"> </picture> <div class="absolute inset-0 bg-gradient-to-b from-black/0 via-black/60 to-black/95"></div> <div class="relative z-10 flex flex-col items-center justify-end h-full px-6 pb-6 text-center text-white"> <blockquote class="text-base md:text-lg lg:text-xl font-semibold leading-relaxed max-w-xl mx-auto mb-4">
"A great user and player experience. Saves me so much time to enable me to spend more time coaching."
</blockquote> <div class="flex flex-col items-center gap-1"> <p class="font-bold text-xs md:text-sm">Tony Woods</p> <p class="text-[11px] md:text-xs text-white/80">Real Rosehill FC</p> <p class="text-[11px] md:text-xs text-yellow-300 mt-1">⭐⭐⭐⭐⭐</p> </div> </div> </div> </div> </div><div class="swiper-slide"> <div class="h-[384px] rounded-2xl border border-base-300 overflow-hidden"> <div class="relative h-full w-full"> <picture> <source srcset="https://assets.teamstats.net/img-m-800-80/photos/teams/Kidderminster-Athletic.jpg?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-800-80/photos/teams/Kidderminster-Athletic.jpg?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/teams/Kidderminster-Athletic.jpg?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/teams/Kidderminster-Athletic.jpg?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-500-75/photos/teams/Kidderminster-Athletic.jpg" alt="Ian Horton - Kidderminster Athletic" loading="lazy" width="500" height="500" class="absolute inset-0 w-full h-full object-cover"> </picture> <div class="absolute inset-0 bg-gradient-to-b from-black/0 via-black/60 to-black/95"></div> <div class="relative z-10 flex flex-col items-center justify-end h-full px-6 pb-6 text-center text-white"> <blockquote class="text-base md:text-lg lg:text-xl font-semibold leading-relaxed max-w-xl mx-auto mb-4">
"Scheduling matches and training means we don&#39;t have to constantly send out texts or make calls."
</blockquote> <div class="flex flex-col items-center gap-1"> <p class="font-bold text-xs md:text-sm">Ian Horton</p> <p class="text-[11px] md:text-xs text-white/80">Kidderminster Athletic</p> <p class="text-[11px] md:text-xs text-yellow-300 mt-1">⭐⭐⭐⭐⭐</p> </div> </div> </div> </div> </div><div class="swiper-slide"> <div class="h-[384px] rounded-2xl border border-base-300 overflow-hidden"> <div class="relative h-full w-full"> <picture> <source srcset="https://assets.teamstats.net/img-m-800-80/photos/teams/Matt-Swanson-Bognor-Regis-Town-Girls.jpg?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-800-80/photos/teams/Matt-Swanson-Bognor-Regis-Town-Girls.jpg?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/teams/Matt-Swanson-Bognor-Regis-Town-Girls.jpg?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/teams/Matt-Swanson-Bognor-Regis-Town-Girls.jpg?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-500-75/photos/teams/Matt-Swanson-Bognor-Regis-Town-Girls.jpg" alt="Matt Swanson - Bognor Regis Town Girls" loading="lazy" width="500" height="500" class="absolute inset-0 w-full h-full object-cover"> </picture> <div class="absolute inset-0 bg-gradient-to-b from-black/0 via-black/60 to-black/95"></div> <div class="relative z-10 flex flex-col items-center justify-end h-full px-6 pb-6 text-center text-white"> <blockquote class="text-base md:text-lg lg:text-xl font-semibold leading-relaxed max-w-xl mx-auto mb-4">
"TeamStats provides a good platform to share team news and information and the players love having their own profiles and seeing the line ups professionally presented."
</blockquote> <div class="flex flex-col items-center gap-1"> <p class="font-bold text-xs md:text-sm">Matt Swanson</p> <p class="text-[11px] md:text-xs text-white/80">Bognor Regis Town Girls</p> <p class="text-[11px] md:text-xs text-yellow-300 mt-1">⭐⭐⭐⭐⭐</p> </div> </div> </div> </div> </div> </div> <div class="swiper-pagination mt-4"></div> </div> </div> <script type="module" src="/_astro/FeatureTestimonialSlider.astro_astro_type_script_index_0_lang.BB-svKMs.js"></script> </section> <section class="video-hero-section" id="video" data-astro-cid-ux2kju4p> <!-- Background video (muted, autoplay, loop) --> <div class="video-bg" data-astro-cid-ux2kju4p>  <video src="https://assets.teamstats.net/mainsite/assets/video/promo/Teamstats-Promo-No-Text-Screens-Only-2.mp4" data-lazy-src="https://assets.teamstats.net/mainsite/assets/video/promo/Teamstats-Promo-No-Text-Screens-Only-2.mp4" muted loop playsinline class="bg-video-element video-hero-bg" aria-label="Background video" data-astro-cid-ux2kju4p></video> <!-- Dark overlay for readability --> <div class="video-overlay" data-astro-cid-ux2kju4p></div> </div> <!-- Content overlay --> <div class="container mx-auto px-4 max-w-7xl" data-astro-cid-ux2kju4p> <div class="content-with-mockup" data-astro-cid-ux2kju4p> <div class="content-wrapper" data-astro-cid-ux2kju4p> <h2 class="hero-title" data-astro-cid-ux2kju4p>Discover more with our video tour</h2> <p class="hero-description" data-astro-cid-ux2kju4p>In just one minute, you&#39;ll find out how TeamStats can transform your team.</p> <!-- Play button -->
          <button id="openVideoModal" class="play-btn" aria-label="Play video in fullscreen" data-astro-cid-ux2kju4p> <svg viewBox="0 0 80 80" width="80" height="80" class="play-icon" data-astro-cid-ux2kju4p> <circle cx="40" cy="40" r="38" fill="rgba(220, 38, 38, 0.9)" stroke="#fff" stroke-width="2" data-astro-cid-ux2kju4p></circle> <path d="M32 26v28l24-14z" fill="#fff" data-astro-cid-ux2kju4p></path> </svg> <span class="sr-only" data-astro-cid-ux2kju4p>Play video</span> </button> </div> <!-- Optional phone mockup slot --> <div class="mockup-wrapper" data-astro-cid-ux2kju4p>  </div> </div> </div> <!-- Modal (native dialog) -->
    <dialog id="videoModal" class="video-modal" data-astro-cid-ux2kju4p> <div class="modal-content" data-astro-cid-ux2kju4p> <button id="closeVideoModal" class="close-btn" aria-label="Close video" data-astro-cid-ux2kju4p> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-astro-cid-ux2kju4p> <line x1="18" y1="6" x2="6" y2="18" data-astro-cid-ux2kju4p></line> <line x1="6" y1="6" x2="18" y2="18" data-astro-cid-ux2kju4p></line> </svg> </button> <div class="modal-video-wrapper" data-astro-cid-ux2kju4p> <iframe id="modalVideoElement" src="" title="TeamStats video tour" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen data-astro-cid-ux2kju4p></iframe> </div> </div> </dialog> </section>  <script>(function(){const modalVideoUrl = "https://www.youtube.com/embed/r8SvuQnKoYE?autoplay=1&rel=0&modestbranding=1";
const isModalYouTube = true;
const buttonMode = "video";

  // Only run video modal logic if in video mode
  if (buttonMode !== 'video') {
    // CTA mode - button is handled by signup-modal.js via trigger-signup class
    console.log('VideoHeroSection in CTA mode - signup handled by signup-modal.js');
  } else {
    // Video mode - setup modal
    // Wait for DOM to be fully loaded
    document.addEventListener('DOMContentLoaded', () => {
      // Use global BlurManager (loaded from blur-manager.js)
      const blurManager = window.blurManager;
        const modal = document.getElementById('videoModal');
        const openBtn = document.getElementById('openVideoModal');
        const closeBtn = document.getElementById('closeVideoModal');
        const videoElement = document.getElementById('modalVideoElement');
        
        // Debug: Check if elements exist
        if (!modal) {
          console.error('Video modal not found');
          return;
        }
        if (!openBtn) {
          console.error('Open button not found');
          return;
        }
        if (!videoElement) {
          console.error('Modal video element not found');
          return;
        }
      
      // Check if browser supports <dialog>
      if (typeof modal.showModal !== 'function') {
        console.warn('Browser does not support <dialog> element. Using fallback.');
        modal.style.display = 'none';
      }
      
      console.log('Modal video URL:', modalVideoUrl);
      console.log('Is YouTube:', isModalYouTube);

      // Open modal
      openBtn.addEventListener('click', (e) => {
        e.preventDefault();
        console.log('Play button clicked');
        
        try {
          // Set video source based on type
          if (isModalYouTube) {
            videoElement.src = modalVideoUrl;
            console.log('YouTube iframe src set to:', videoElement.src);
          } else {
            // For local video, just play it (src is already set in HTML)
            videoElement.play();
            console.log('Local video playing');
          }
          
          // Use showModal if supported, otherwise fallback
          if (typeof modal.showModal === 'function') {
            modal.showModal();
          } else {
            modal.style.display = 'flex';
            modal.setAttribute('open', '');
          }
          
          // Enable blur effect
          if (blurManager) {
            blurManager.enable('video-modal');
            console.log('Modal opened with blur effect');
          }
        } catch (error) {
          console.error('Error opening modal:', error);
          modal.style.display = 'flex';
          modal.setAttribute('open', '');
        }
      });

      // Close modal function
      const closeModal = () => {
        try {
          if (typeof modal.close === 'function') {
            modal.close();
          } else {
            modal.style.display = 'none';
            modal.removeAttribute('open');
          }
          
          // Stop video based on type
          if (isModalYouTube) {
            videoElement.src = '';
          } else {
            videoElement.pause();
            videoElement.currentTime = 0;
          }
          
          // Disable blur effect
          if (blurManager) {
            blurManager.disable('video-modal');
            console.log('Modal closed, blur disabled');
          }
        } catch (error) {
          console.error('Error closing modal:', error);
          modal.style.display = 'none';
          if (blurManager) {
            blurManager.disable('video-modal');
          }
        }
      };

      // Close button
      if (closeBtn) {
        closeBtn.addEventListener('click', (e) => {
          e.preventDefault();
          closeModal();
        });
      }

      // Close on backdrop click
      modal.addEventListener('click', (e) => {
        const rect = modal.getBoundingClientRect();
        const isInDialog = (
          rect.top <= e.clientY &&
          e.clientY <= rect.top + rect.height &&
          rect.left <= e.clientX &&
          e.clientX <= rect.left + rect.width
        );
        
        if (!isInDialog) {
          closeModal();
        }
      });

      // Close on Escape key
      document.addEventListener('keydown', (e) => {
        if (e.key === 'Escape' && modal.hasAttribute('open')) {
          closeModal();
        }
      });

      // Native close event
      modal.addEventListener('close', () => {
        if (isModalYouTube) {
          videoElement.src = '';
        } else {
          videoElement.pause();
          videoElement.currentTime = 0;
        }
        if (blurManager) {
          blurManager.disable('video-modal');
        }
      });
    }); // Close DOMContentLoaded
  } // Close else (video mode)
})();</script> <section class="pt-32 pb-4 lg:py-14 bg-white -mt-24 -mb-14 lg:mt-0"> <div class="container mx-auto px-4 max-w-6xl"> <div class="text-center mb-8 lg:mb-10"> <h2 class="text-2xl md:text-3xl lg:text-4xl font-bold mb-3 lg:mb-4 pt-8">Improve the way your football team is managed.</h2> <p class="text-base lg:text-xl text-base-content/70 leading-relaxed">
TeamStats gives you everything you need for better management, organisation, analysis and communication.
</p> </div>  <div class="block md:hidden mt-6"> <div class="transform-swiper swiper"> <div class="swiper-wrapper"> <!-- Organise --> <div class="swiper-slide"> <a href="/organise" class="card bg-gradient-to-b from-white to-base-200 border border-base-300 rounded-2xl cursor-pointer"> <div class="card-body items-center text-center"> <div class="mb-2"> <span class="inline-block rounded-full bg-blue-700 text-white text-xs font-semibold px-3 py-1 tracking-wide">ORGANISE</span> </div> <picture> <source srcset="https://assets.teamstats.net/img-m-300-90/icons/Football-2-icon.png?f=avif&v=130126-1" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-300-90/icons/Football-2-icon.png?f=webp&v=130126-1" type="image/webp"> <img src="https://assets.teamstats.net/img-m-300-90/icons/Football-2-icon.png" alt="football icon" loading="lazy" class="w-24 h-24 mb-4"> </picture> <h3 class="card-title text-lg">Organise your matches and training</h3> <p class="text-sm">
Manage your schedule, track who's available and plan your lineups
</p> <div class="card-actions mt-4"> <span class="text-primary font-semibold">Learn More</span> </div> </div> </a> </div> <!-- Analyse --> <div class="swiper-slide"> <a href="/analyse" class="card bg-gradient-to-b from-white to-base-200 border border-base-300 rounded-2xl cursor-pointer"> <div class="card-body items-center text-center"> <div class="mb-2"> <span class="inline-block rounded-full bg-red-600 text-white text-xs font-semibold px-3 py-1 tracking-wide">ANALYSE</span> </div> <picture> <source srcset="https://assets.teamstats.net/img-m-300-90/icons/Line-Chart-3-icon.png?f=avif&v=130126-1" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-300-90/icons/Line-Chart-3-icon.png?f=webp&v=130126-1" type="image/webp"> <img src="https://assets.teamstats.net/img-m-300-90/icons/Line-Chart-3-icon.png" alt="line chart icon" loading="lazy" class="w-24 h-24 mb-4"> </picture> <h3 class="card-title text-lg">Record and analyse your performances</h3> <p class="text-sm">
Auto-generated, in-depth match reports and statistics - just like the pros.
</p> <div class="card-actions mt-4"> <span class="text-primary font-semibold">Learn More</span> </div> </div> </a> </div> <!-- Manage --> <div class="swiper-slide"> <a href="/finances" class="card bg-gradient-to-b from-white to-base-200 border border-base-300 rounded-2xl cursor-pointer"> <div class="card-body items-center text-center"> <div class="mb-2"> <span class="inline-block rounded-full bg-green-600 text-white text-xs font-semibold px-3 py-1 tracking-wide">MANAGE</span> </div> <picture> <source srcset="https://assets.teamstats.net/img-m-300-90/icons/Coins-icon.png?f=avif&v=130126-1" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-300-90/icons/Coins-icon.png?f=webp&v=130126-1" type="image/webp"> <img src="https://assets.teamstats.net/img-m-300-90/icons/Coins-icon.png" alt="coins icon" loading="lazy" class="w-24 h-24 mb-4"> </picture> <h3 class="card-title text-lg">Manage your team and player finances</h3> <p class="text-sm">
Track every payment and receive card payments from team members.
</p> <div class="card-actions mt-4"> <span class="text-primary font-semibold">Learn More</span> </div> </div> </a> </div> <!-- Create --> <div class="swiper-slide"> <a href="/communicate" class="card bg-gradient-to-b from-white to-base-200 border border-base-300 rounded-2xl cursor-pointer"> <div class="card-body items-center text-center"> <div class="mb-2"> <span class="inline-block rounded-full bg-sky-600 text-white text-xs font-semibold px-3 py-1 tracking-wide">CREATE</span> </div> <picture> <source srcset="https://assets.teamstats.net/img-m-300-90/icons/Laptop-Phone-icon.png?f=avif&v=130126-1" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-300-90/icons/Laptop-Phone-icon.png?f=webp&v=130126-1" type="image/webp"> <img src="https://assets.teamstats.net/img-m-300-90/icons/Laptop-Phone-icon.png" alt="laptop and mobile phone icon" loading="lazy" class="w-24 h-24 mb-4"> </picture> <h3 class="card-title text-lg">Create your own team app and website</h3> <p class="text-sm">
Share fixtures, results, news and media with your team and supporters.
</p> <div class="card-actions mt-4"> <span class="text-primary font-semibold">Learn More</span> </div> </div> </a> </div> </div> <div class="swiper-pagination mt-4"></div> </div> </div>  <div class="hidden md:grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6"> <!-- Organise --> <a href="/organise" class="card bg-gradient-to-b from-white to-base-200 border border-base-300 rounded-2xl transition-colors cursor-pointer"> <div class="card-body items-center text-center"> <div class="mb-2"> <span class="inline-block rounded-full bg-blue-700 text-white text-xs font-semibold px-3 py-1 tracking-wide">ORGANISE</span> </div> <picture> <source srcset="https://assets.teamstats.net/img-m-300-90/icons/Football-2-icon.png?f=avif&v=130126-1" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-300-90/icons/Football-2-icon.png?f=webp&v=130126-1" type="image/webp"> <img src="https://assets.teamstats.net/img-m-300-90/icons/Football-2-icon.png" alt="football icon" loading="lazy" class="w-24 h-24 mb-4"> </picture> <h3 class="card-title text-lg">Organise your matches and training</h3> <p class="text-sm">
Manage your schedule, track who's available and plan your lineups
</p> <div class="card-actions mt-4"> <span class="text-primary font-semibold">Learn More</span> </div> </div> </a> <!-- Analyse --> <a href="/analyse" class="card bg-gradient-to-b from-white to-base-200 border border-base-300 rounded-2xl transition-colors cursor-pointer"> <div class="card-body items-center text-center"> <div class="mb-2"> <span class="inline-block rounded-full bg-red-600 text-white text-xs font-semibold px-3 py-1 tracking-wide">ANALYSE</span> </div> <picture> <source srcset="https://assets.teamstats.net/img-m-300-90/icons/Line-Chart-3-icon.png?f=avif&v=130126-1" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-300-90/icons/Line-Chart-3-icon.png?f=webp&v=130126-1" type="image/webp"> <img src="https://assets.teamstats.net/img-m-300-90/icons/Line-Chart-3-icon.png" alt="line chart icon" loading="lazy" class="w-24 h-24 mb-4"> </picture> <h3 class="card-title text-lg">Record and analyse your performances</h3> <p class="text-sm">
Auto-generated, in-depth match reports and statistics - just like the pros.
</p> <div class="card-actions mt-4"> <span class="text-primary font-semibold">Learn More</span> </div> </div> </a> <!-- Manage --> <a href="/finances" class="card bg-gradient-to-b from-white to-base-200 border border-base-300 rounded-2xl transition-colors cursor-pointer"> <div class="card-body items-center text-center"> <div class="mb-2"> <span class="inline-block rounded-full bg-green-600 text-white text-xs font-semibold px-3 py-1 tracking-wide">MANAGE</span> </div> <picture> <source srcset="https://assets.teamstats.net/img-m-300-90/icons/Coins-icon.png?f=avif&v=130126-1" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-300-90/icons/Coins-icon.png?f=webp&v=130126-1" type="image/webp"> <img src="https://assets.teamstats.net/img-m-300-90/icons/Coins-icon.png" alt="coins icon" loading="lazy" class="w-24 h-24 mb-4"> </picture> <h3 class="card-title text-lg">Manage your team and player finances</h3> <p class="text-sm">
Track every payment and receive card payments from team members.
</p> <div class="card-actions mt-4"> <span class="text-primary font-semibold">Learn More</span> </div> </div> </a> <!-- Create --> <a href="/communicate" class="card bg-gradient-to-b from-white to-base-200 border border-base-300 rounded-2xl transition-colors cursor-pointer"> <div class="card-body items-center text-center"> <div class="mb-2"> <span class="inline-block rounded-full bg-sky-600 text-white text-xs font-semibold px-3 py-1 tracking-wide">CREATE</span> </div> <picture> <source srcset="https://assets.teamstats.net/img-m-300-90/icons/Laptop-Phone-icon.png?f=avif&v=130126-1" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-300-90/icons/Laptop-Phone-icon.png?f=webp&v=130126-1" type="image/webp"> <img src="https://assets.teamstats.net/img-m-300-90/icons/Laptop-Phone-icon.png" alt="laptop and mobile phone icon" loading="lazy" class="w-24 h-24 mb-4"> </picture> <h3 class="card-title text-lg">Create your own team app and website</h3> <p class="text-sm">
Share fixtures, results, news and media with your team and supporters.
</p> <div class="card-actions mt-4"> <span class="text-primary font-semibold">Learn More</span> </div> </div> </a> </div> <!-- App Store Badges --> <div class="mt-10 lg:mt-16 flex justify-center md:-mb-10 lg:-mb-4 relative z-20"> <div class="flex gap-5 justify-center"> <div class="flex flex-col items-center"> <a href="https://apps.apple.com/gb/app/teamstats-football-team-app/id1275644100" target="_blank" rel="noopener noreferrer" class="block w-40 sm:w-44"> <img src="https://assets.teamstats.net/img-m-320-100/logos/app-stores/app-store-badge.png?f=avif" alt="Download on the Apple App Store" loading="lazy" width="320" height="95" class="w-full h-auto shadow-lg"> </a> <div class="text-xs mt-1">⭐⭐⭐⭐⭐</div> </div> <div class="flex flex-col items-center"> <a href="https://play.google.com/store/apps/details?id=net.teamstats.app" target="_blank" rel="noopener noreferrer" class="block w-40 sm:w-44"> <img src="https://assets.teamstats.net/img-m-320-100/logos/app-stores/google-play-badge.png?f=avif" alt="Get it on Google Play" loading="lazy" width="320" height="95" class="w-full h-auto shadow-lg"> </a> <div class="text-xs mt-1">⭐⭐⭐⭐⭐</div> </div> </div> </div> </div> <script type="module" src="/_astro/TransformSection.astro_astro_type_script_index_0_lang.DCAiXUT0.js"></script> </section> <section class="py-10 lg:py-14 bg-100" data-astro-cid-x4g36ggu> <div class="container mx-auto px-3 md:px-4 max-w-6xl pt-8" data-astro-cid-x4g36ggu> <div class="text-center mb-6 lg:mb-8 pt-14" data-astro-cid-x4g36ggu> <h2 class="text-2xl md:text-3xl lg:text-4xl font-bold mb-3 lg:mb-4" data-astro-cid-x4g36ggu>For use by all football teams and every team member</h2> <p class="text-base lg:text-xl text-base-content/70 pb-4 lg:pb-8 leading-relaxed text-center" data-astro-cid-x4g36ggu>
Management, players and team members can all use TeamStats to organise, communicate and collaborate.
</p> </div>  <div class="block md:hidden" data-astro-cid-x4g36ggu> <div class="for-use-by-swiper swiper" data-astro-cid-x4g36ggu> <div class="swiper-wrapper" data-astro-cid-x4g36ggu> <div class="swiper-slide" data-astro-cid-x4g36ggu> <a href="/team-communication-app#management-staff-officials" class="block" data-astro-cid-x4g36ggu> <div class="image-card" data-astro-cid-x4g36ggu> <picture> <source srcset="https://assets.teamstats.net/img-m-800-80/photos/kids-football-manager.jpg?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-800-80/photos/kids-football-manager.jpg?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/kids-football-manager.jpg?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/kids-football-manager.jpg?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-500-75/photos/kids-football-manager.jpg" alt="Football team management staff" loading="lazy" width="500" height="500"> </picture> <h3 data-astro-cid-x4g36ggu>Management</h3> </div> </a> </div> <div class="swiper-slide" data-astro-cid-x4g36ggu> <a href="/team-communication-app#players" class="block" data-astro-cid-x4g36ggu> <div class="image-card" data-astro-cid-x4g36ggu> <picture> <source srcset="https://assets.teamstats.net/img-m-800-80/photos/mary-dendy.jpg?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-800-80/photos/mary-dendy.jpg?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/mary-dendy.jpg?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/mary-dendy.jpg?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-500-75/photos/mary-dendy.jpg" alt="Football team players" loading="lazy" width="500" height="500"> </picture> <h3 data-astro-cid-x4g36ggu>Players</h3> </div> </a> </div> <div class="swiper-slide" data-astro-cid-x4g36ggu> <a href="/team-communication-app#parents-supporters" class="block" data-astro-cid-x4g36ggu> <div class="image-card" data-astro-cid-x4g36ggu> <picture> <source srcset="https://assets.teamstats.net/img-m-800-80/photos/soccer-moms.jpg?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-800-80/photos/soccer-moms.jpg?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/soccer-moms.jpg?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/soccer-moms.jpg?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-500-75/photos/soccer-moms.jpg" alt="Football team parents and supporters" loading="lazy" width="500" height="500"> </picture> <h3 data-astro-cid-x4g36ggu>Parents & Fans</h3> </div> </a> </div> </div> <div class="swiper-pagination mt-4" data-astro-cid-x4g36ggu></div> </div> </div>  <div class="hidden md:grid grid-cols-1 md:grid-cols-3 gap-5 md:gap-8" data-astro-cid-x4g36ggu> <a href="/team-communication-app#management-staff-officials" class="block" data-astro-cid-x4g36ggu> <div class="image-card" data-astro-cid-x4g36ggu> <picture> <source srcset="https://assets.teamstats.net/img-m-800-80/photos/kids-football-manager.jpg?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-800-80/photos/kids-football-manager.jpg?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/kids-football-manager.jpg?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/kids-football-manager.jpg?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-500-75/photos/kids-football-manager.jpg" alt="Football team management staff" loading="lazy" width="500" height="500"> </picture> <h3 data-astro-cid-x4g36ggu>Management</h3> </div> </a> <a href="/team-communication-app#players" class="block" data-astro-cid-x4g36ggu> <div class="image-card" data-astro-cid-x4g36ggu> <picture> <source srcset="https://assets.teamstats.net/img-m-800-80/photos/mary-dendy.jpg?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-800-80/photos/mary-dendy.jpg?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/mary-dendy.jpg?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/mary-dendy.jpg?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-500-75/photos/mary-dendy.jpg" alt="Football team players" loading="lazy" width="500" height="500"> </picture> <h3 data-astro-cid-x4g36ggu>Players</h3> </div> </a> <a href="/team-communication-app#parents-supporters" class="block" data-astro-cid-x4g36ggu> <div class="image-card" data-astro-cid-x4g36ggu> <picture> <source srcset="https://assets.teamstats.net/img-m-800-80/photos/soccer-moms.jpg?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-800-80/photos/soccer-moms.jpg?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/soccer-moms.jpg?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-500-75/photos/soccer-moms.jpg?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-500-75/photos/soccer-moms.jpg" alt="Football team parents and supporters" loading="lazy" width="500" height="500"> </picture> <h3 data-astro-cid-x4g36ggu>Parents & Fans</h3> </div> </a> </div> </div> <script type="module" src="/_astro/ForUseBySection.astro_astro_type_script_index_0_lang.Bzf7RamR.js"></script> </section> <section class="pt-16 pb-16 lg:py-24 bg-white lg:mt-0 overflow-hidden lg:overflow-visible" id="index-1"> <div class="container mx-auto px-4 max-w-6xl"> <div class="grid grid-cols-1 lg:grid-cols-2 gap-6 lg:gap-10 items-center "> <div class="lg:order-1 relative z-10 px-4 lg:px-4 "> <h2 class="mt-4 lg:mt-6 text-2xl md:text-3xl lg:text-4xl font-bold leading-tight mb-3 lg:mb-4"> Better team organisation gives you back your time </h2> <a href="/organise" class="block text-base lg:text-lg font-medium text-primary mb-4 lg:mb-5 leading-relaxed max-w-xl hover:underline"> Plan and organise your whole season, ensuring your team members always know the details that matter. </a> <div class="mb-6 lg:mb-8"> <button class="trigger-signup btn btn-primary btn-lg w-full sm:w-auto font-semibold mt-6 mb-6 pt-8 pb-8"> Get started for free </button> </div> <ul class="space-y-2 lg:space-y-3 mb-2 lg:mb-4"> <li class="flex items-start"> <svg class="w-4 h-4 text-primary mr-3 shrink-0 mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <circle cx="12" cy="12" r="6" stroke-width="2"></circle> </svg> <span class="text-base lg:text-lg text-base-content">Arrange matches, training, tournaments, presentations, tours and all other team events</span> </li><li class="flex items-start"> <svg class="w-4 h-4 text-primary mr-3 shrink-0 mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <circle cx="12" cy="12" r="6" stroke-width="2"></circle> </svg> <span class="text-base lg:text-lg text-base-content">Make sure you always have a full squad by automatically knowing who&#39;s available with plenty of time to spare.</span> </li><li class="flex items-start"> <svg class="w-4 h-4 text-primary mr-3 shrink-0 mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <circle cx="12" cy="12" r="6" stroke-width="2"></circle> </svg> <span class="text-base lg:text-lg text-base-content">Experiment with your line-ups to tweak your tactics for the next big game.</span> </li> </ul> <div class="mt-10 mb-4"> <a href="/organise" class="btn btn-outline btn-primary btn-lg inline-flex items-center gap-2 px-8 py-3 pt-8 pb-8"> <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path> </svg> <span>learn more about improving your team organisation</span> </a> </div> </div> <div class="lg:order-2"> <div class="device-showcase-container" style="
    --container-height-mobile: 450px;
    --container-height-desktop: 520px;
  " data-astro-cid-5svpmbcj> <div class="device-wrapper hide-mobile" style="
          --x-offset-desktop: -80px;
          --y-offset-desktop: 50px;
          --x-offset-mobile: -80px;
          --y-offset-mobile: 0px;
          --desktop-scale: 0.7058823529411765;
          --mobile-scale: 0.9411764705882353;
          --z-index: 1;
          --margin-top-desktop: 0px;
          --margin-top-mobile: 0px;
        " data-astro-cid-5svpmbcj> <div class="phone-frame-single" data-astro-cid-esjtk2be> <div class="phone-screen-single" data-astro-cid-esjtk2be> <picture class="w-full h-full"> <source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/admin-team-lineup-mobile.png?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/admin-team-lineup-mobile.png?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/admin-team-lineup-mobile.png?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/admin-team-lineup-mobile.png?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-550-80/screenshots/admin-team-lineup-mobile.png" alt="Better team organisation gives you back your time - phone view" loading="lazy" width="550" height="1100" class="w-full h-full object-contain"> </picture> </div> </div>     </div><div class="device-wrapper " style="
          --x-offset-desktop: 120px;
          --y-offset-desktop: 60px;
          --x-offset-mobile: 0px;
          --y-offset-mobile: 0px;
          --desktop-scale: 0.9411764705882353;
          --mobile-scale: 0.9411764705882353;
          --z-index: 2;
          --margin-top-desktop: 0px;
          --margin-top-mobile: 0px;
        " data-astro-cid-5svpmbcj>  <div class="phone-frame-video phone-frame-video-shadow" data-astro-cid-wc5sb4d6> <div class="phone-screen-video" data-astro-cid-wc5sb4d6> <video data-lazy-src="https://assets.teamstats.net/mainsite/assets/video/features/organisation.mp4" loop muted playsinline aria-label="Better team organisation gives you back your time - phone view" data-astro-cid-wc5sb4d6></video> </div> </div>    </div> </div> </div> </div> </div> </section><section class="pt-16 pb-16 lg:py-24 bg-[#f0f0f0] lg:mt-0 overflow-hidden lg:overflow-visible" id="index-2"> <div class="container mx-auto px-4 max-w-6xl"> <div class="grid grid-cols-1 lg:grid-cols-2 gap-6 lg:gap-10 items-center lg:flex-row-reverse"> <div class="lg:order-2 relative z-10 px-4 lg:px-4 "> <h2 class="mt-4 lg:mt-6 text-2xl md:text-3xl lg:text-4xl font-bold leading-tight mb-3 lg:mb-4"> Gain insights into your performance with match reports and team statistics </h2> <a href="/analyse" class="block text-base lg:text-lg font-medium text-primary mb-4 lg:mb-5 leading-relaxed max-w-xl hover:underline"> Your match details are used to generate stunning match reports with extensive stats for both team and players. </a> <div class="mb-6 lg:mb-8"> <button class="trigger-signup btn btn-primary btn-lg w-full sm:w-auto font-semibold mt-6 mb-6 pt-8 pb-8"> Get started for free </button> </div> <ul class="space-y-2 lg:space-y-3 mb-2 lg:mb-4"> <li class="flex items-start"> <svg class="w-4 h-4 text-primary mr-3 shrink-0 mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <circle cx="12" cy="12" r="6" stroke-width="2"></circle> </svg> <span class="text-base lg:text-lg text-base-content">Keep a detailed record of your season&#39;s performance with match reports that summarise every game.</span> </li><li class="flex items-start"> <svg class="w-4 h-4 text-primary mr-3 shrink-0 mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <circle cx="12" cy="12" r="6" stroke-width="2"></circle> </svg> <span class="text-base lg:text-lg text-base-content">A full range of advanced statistics for your team and players - automatically created for you.</span> </li><li class="flex items-start"> <svg class="w-4 h-4 text-primary mr-3 shrink-0 mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <circle cx="12" cy="12" r="6" stroke-width="2"></circle> </svg> <span class="text-base lg:text-lg text-base-content">Track and analyse your players&#39; performance with individual performance stats.</span> </li> </ul> <div class="mt-10 mb-4"> <a href="/analyse" class="btn btn-outline btn-primary btn-lg inline-flex items-center gap-2 px-8 py-3 pt-8 pb-8"> <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path> </svg> <span>learn more about performance analysis</span> </a> </div> </div> <div class="lg:order-1"> <div class="device-showcase-container" style="
    --container-height-mobile: 450px;
    --container-height-desktop: 480px;
  " data-astro-cid-5svpmbcj> <div class="device-wrapper hide-mobile" style="
          --x-offset-desktop: -200px;
          --y-offset-desktop: 90px;
          --x-offset-mobile: 0px;
          --y-offset-mobile: 0px;
          --desktop-scale: 1;
          --mobile-scale: 0.6;
          --z-index: 1;
          --margin-top-desktop: 0px;
          --margin-top-mobile: 0px;
        " data-astro-cid-5svpmbcj>   <div class="laptop-frame" data-astro-cid-ptqbfvrg> <div class="laptop-screen" data-astro-cid-ptqbfvrg> <picture class="absolute inset-0 w-full h-full"> <source srcset="https://assets.teamstats.net/img-m-1440-80/screenshots/match-report-desktop.png?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-1440-80/screenshots/match-report-desktop.png?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-800-75/screenshots/match-report-desktop.png?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-800-75/screenshots/match-report-desktop.png?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-800-75/screenshots/match-report-desktop.png" alt="Gain insights into your performance with match reports and team statistics - laptop view" loading="lazy" width="800" height="500" class="absolute inset-0 w-full h-full object-cover"> </picture> </div> <div class="laptop-base" data-astro-cid-ptqbfvrg></div> </div>   </div><div class="device-wrapper " style="
          --x-offset-desktop: 80px;
          --y-offset-desktop: 80px;
          --x-offset-mobile: 0px;
          --y-offset-mobile: 0px;
          --desktop-scale: 0.9411764705882353;
          --mobile-scale: 0.9411764705882353;
          --z-index: 2;
          --margin-top-desktop: 0px;
          --margin-top-mobile: 0px;
        " data-astro-cid-5svpmbcj>  <div class="phone-frame-video phone-frame-video-shadow" data-astro-cid-wc5sb4d6> <div class="phone-screen-video" data-astro-cid-wc5sb4d6> <video data-lazy-src="https://assets.teamstats.net/mainsite/assets/video/features/reports-stats.mp4" loop muted playsinline aria-label="Gain insights into your performance with match reports and team statistics - phone view" data-astro-cid-wc5sb4d6></video> </div> </div>    </div> </div> </div> </div> </div> </section><section class="pt-16 pb-16 lg:py-24 bg-white lg:mt-0 overflow-hidden lg:overflow-visible" id="index-3"> <div class="container mx-auto px-4 max-w-6xl"> <div class="grid grid-cols-1 lg:grid-cols-2 gap-6 lg:gap-10 items-center "> <div class="lg:order-1 relative z-10 px-4 lg:px-4 "> <h2 class="mt-4 lg:mt-6 text-2xl md:text-3xl lg:text-4xl font-bold leading-tight mb-3 lg:mb-4"> Simplified team and player finances </h2> <a href="/finances" class="block text-base lg:text-lg font-medium text-primary mb-4 lg:mb-5 leading-relaxed max-w-xl hover:underline"> We crunch the numbers so you don&#39;t have to.  Keep on top of all financial activity and receive player payments online. </a> <div class="mb-6 lg:mb-8"> <button class="trigger-signup btn btn-primary btn-lg w-full sm:w-auto font-semibold mt-6 mb-6 pt-8 pb-8"> Get started for free </button> </div> <ul class="space-y-2 lg:space-y-3 mb-2 lg:mb-4"> <li class="flex items-start"> <svg class="w-4 h-4 text-primary mr-3 shrink-0 mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <circle cx="12" cy="12" r="6" stroke-width="2"></circle> </svg> <span class="text-base lg:text-lg text-base-content">Record, assign and manage your payments, costs, fees, charges, expenses and fines.</span> </li><li class="flex items-start"> <svg class="w-4 h-4 text-primary mr-3 shrink-0 mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <circle cx="12" cy="12" r="6" stroke-width="2"></circle> </svg> <span class="text-base lg:text-lg text-base-content">Access a range of simple reports to show you all the information you need to know exactly where you stand.</span> </li><li class="flex items-start"> <svg class="w-4 h-4 text-primary mr-3 shrink-0 mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <circle cx="12" cy="12" r="6" stroke-width="2"></circle> </svg> <span class="text-base lg:text-lg text-base-content">Receive secure debit/credit card payments from your team members - get paid faster and more often.</span> </li> </ul> <div class="mt-10 mb-4"> <a href="/finances" class="btn btn-outline btn-primary btn-lg inline-flex items-center gap-2 px-8 py-3 pt-8 pb-8"> <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path> </svg> <span>learn more about managing your finances</span> </a> </div> </div> <div class="lg:order-2"> <div class="device-showcase-container" style="
    --container-height-mobile: 450px;
    --container-height-desktop: 520px;
  " data-astro-cid-5svpmbcj> <div class="device-wrapper hide-mobile" style="
          --x-offset-desktop: -80px;
          --y-offset-desktop: 50px;
          --x-offset-mobile: -80px;
          --y-offset-mobile: 0px;
          --desktop-scale: 0.7058823529411765;
          --mobile-scale: 0.9411764705882353;
          --z-index: 1;
          --margin-top-desktop: 0px;
          --margin-top-mobile: 0px;
        " data-astro-cid-5svpmbcj> <div class="phone-frame-single" data-astro-cid-esjtk2be> <div class="phone-screen-single" data-astro-cid-esjtk2be> <picture class="w-full h-full"> <source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/finances-overview.png?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/finances-overview.png?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/finances-overview.png?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-550-80/screenshots/finances-overview.png?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-550-80/screenshots/finances-overview.png" alt="Simplified team and player finances - phone view" loading="lazy" width="550" height="1100" class="w-full h-full object-contain"> </picture> </div> </div>     </div><div class="device-wrapper " style="
          --x-offset-desktop: 120px;
          --y-offset-desktop: 60px;
          --x-offset-mobile: 0px;
          --y-offset-mobile: 0px;
          --desktop-scale: 0.9411764705882353;
          --mobile-scale: 0.9411764705882353;
          --z-index: 2;
          --margin-top-desktop: 0px;
          --margin-top-mobile: 0px;
        " data-astro-cid-5svpmbcj>  <div class="phone-frame-video phone-frame-video-shadow" data-astro-cid-wc5sb4d6> <div class="phone-screen-video" data-astro-cid-wc5sb4d6> <video data-lazy-src="https://assets.teamstats.net/mainsite/assets/video/features/finances-overview.mp4" loop muted playsinline aria-label="Simplified team and player finances - phone view" data-astro-cid-wc5sb4d6></video> </div> </div>    </div> </div> </div> </div> </div> </section><section class="pt-16 pb-16 lg:py-24 bg-[#f0f0f0] lg:mt-0 overflow-hidden lg:overflow-visible" id="index-4"> <div class="container mx-auto px-4 max-w-6xl"> <div class="grid grid-cols-1 lg:grid-cols-2 gap-6 lg:gap-10 items-center lg:flex-row-reverse"> <div class="lg:order-2 relative z-10 px-4 lg:px-4 "> <h2 class="mt-4 lg:mt-6 text-2xl md:text-3xl lg:text-4xl font-bold leading-tight mb-3 lg:mb-4"> Transform team communciation and boost team member engagement </h2> <a href="/communicate" class="block text-base lg:text-lg font-medium text-primary mb-4 lg:mb-5 leading-relaxed max-w-xl hover:underline"> Management, players, parents and supporters can all use your team app and website to effectively communciate and collaborate. </a> <div class="mb-6 lg:mb-8"> <button class="trigger-signup btn btn-primary btn-lg w-full sm:w-auto font-semibold mt-6 mb-6 pt-8 pb-8"> Get started for free </button> </div> <ul class="space-y-2 lg:space-y-3 mb-2 lg:mb-4"> <li class="flex items-start"> <svg class="w-4 h-4 text-primary mr-3 shrink-0 mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <circle cx="12" cy="12" r="6" stroke-width="2"></circle> </svg> <span class="text-base lg:text-lg text-base-content">Your team app and website look and work the same on any device or platform - automatically synchronised with every update you make.</span> </li><li class="flex items-start"> <svg class="w-4 h-4 text-primary mr-3 shrink-0 mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <circle cx="12" cy="12" r="6" stroke-width="2"></circle> </svg> <span class="text-base lg:text-lg text-base-content">Share team news, documents, photos and video with your team members,  parents and fans.</span> </li><li class="flex items-start"> <svg class="w-4 h-4 text-primary mr-3 shrink-0 mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <circle cx="12" cy="12" r="6" stroke-width="2"></circle> </svg> <span class="text-base lg:text-lg text-base-content">Quickly contact your squad and contacts using multiple channels.</span> </li><li class="flex items-start"> <svg class="w-4 h-4 text-primary mr-3 shrink-0 mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <circle cx="12" cy="12" r="6" stroke-width="2"></circle> </svg> <span class="text-base lg:text-lg text-base-content">Schedule and send automated alerts for your matches, training and team events.</span> </li> </ul> <div class="mt-10 mb-4"> <a href="/communicate" class="btn btn-outline btn-primary btn-lg inline-flex items-center gap-2 px-8 py-3 pt-8 pb-8"> <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path> </svg> <span>learn more about better team communication</span> </a> </div> </div> <div class="lg:order-1"> <div class="device-showcase-container" style="
    --container-height-mobile: 450px;
    --container-height-desktop: 480px;
  " data-astro-cid-5svpmbcj> <div class="device-wrapper hide-mobile" style="
          --x-offset-desktop: -200px;
          --y-offset-desktop: 90px;
          --x-offset-mobile: 0px;
          --y-offset-mobile: 0px;
          --desktop-scale: 1;
          --mobile-scale: 0.6;
          --z-index: 1;
          --margin-top-desktop: 0px;
          --margin-top-mobile: 0px;
        " data-astro-cid-5svpmbcj>   <div class="laptop-frame" data-astro-cid-ptqbfvrg> <div class="laptop-screen" data-astro-cid-ptqbfvrg> <picture class="absolute inset-0 w-full h-full"> <source srcset="https://assets.teamstats.net/img-m-1440-80/screenshots/desktop-team-home-1440.png?f=avif" type="image/avif" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-1440-80/screenshots/desktop-team-home-1440.png?f=webp" type="image/webp" media="(min-width: 768px)"><source srcset="https://assets.teamstats.net/img-m-800-75/screenshots/desktop-team-home-1440.png?f=avif" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-800-75/screenshots/desktop-team-home-1440.png?f=webp" type="image/webp"> <img src="https://assets.teamstats.net/img-m-800-75/screenshots/desktop-team-home-1440.png" alt="Transform team communciation and boost team member engagement - laptop view" loading="lazy" width="800" height="500" class="absolute inset-0 w-full h-full object-cover"> </picture> </div> <div class="laptop-base" data-astro-cid-ptqbfvrg></div> </div>   </div><div class="device-wrapper " style="
          --x-offset-desktop: 80px;
          --y-offset-desktop: 80px;
          --x-offset-mobile: 0px;
          --y-offset-mobile: 0px;
          --desktop-scale: 0.9411764705882353;
          --mobile-scale: 0.9411764705882353;
          --z-index: 2;
          --margin-top-desktop: 0px;
          --margin-top-mobile: 0px;
        " data-astro-cid-5svpmbcj>  <div class="phone-frame-video phone-frame-video-shadow" data-astro-cid-wc5sb4d6> <div class="phone-screen-video" data-astro-cid-wc5sb4d6> <video data-lazy-src="https://assets.teamstats.net/mainsite/assets/video/features/communication-overview.mp4" loop muted playsinline aria-label="Transform team communciation and boost team member engagement - phone view" data-astro-cid-wc5sb4d6></video> </div> </div>    </div> </div> </div> </div> </div> </section><section class="pt-16 pb-16 lg:pt-24 lg:pb-16 bg-white" data-astro-cid-tegb73yx> <div class="container mx-auto px-4 max-w-6xl" data-astro-cid-tegb73yx> <div class="text-center mb-8 lg:mb-16" data-astro-cid-tegb73yx> <h2 class="text-2xl md:text-3xl lg:text-4xl font-bold mb-2" data-astro-cid-tegb73yx>
TeamStats is already helping thousands of teams just like yours
</h2> </div> <div class="overflow-hidden mask-[linear-gradient(to_right,transparent_0,black_64px,black_calc(100%-64px),transparent_100%)]" data-astro-cid-tegb73yx> <div class="logos-track" data-astro-cid-tegb73yx> <div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/Ashfield-Juniors-Football-Club-Glasgow.jpg" alt="Ashfield Juniors Football Club Glasgow" loading="lazy" data-astro-cid-tegb73yx> </div><div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/Bransgore-Youth-U9s.jpg" alt="Bransgore Youth U9s" loading="lazy" data-astro-cid-tegb73yx> </div><div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/Cottenham-Colts-U11-Black.png" alt="Cottenham Colts U11 Black" loading="lazy" data-astro-cid-tegb73yx> </div><div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/De-La-Salle-Girls-Manchester.jpg" alt="De La Salle Girls Manchester" loading="lazy" data-astro-cid-tegb73yx> </div><div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/FC-Bury-Vipers-U13.jpg" alt="FC Bury Vipers U13" loading="lazy" data-astro-cid-tegb73yx> </div><div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/Flitwick-Eagles-Girls-U11s.png" alt="Flitwick Eagles Girls U11s" loading="lazy" data-astro-cid-tegb73yx> </div><div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/kiveton-park-fc-u9.jpg" alt="Kiveton Park FC U9" loading="lazy" data-astro-cid-tegb73yx> </div><div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/Leafield-Athletic-U14-Colts.png" alt="Leafield Athletic U14 Colts" loading="lazy" data-astro-cid-tegb73yx> </div><div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/Prague-Raptors-FC.png" alt="Prague Raptors FC" loading="lazy" data-astro-cid-tegb73yx> </div><div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/Saxmundham-Sports-U13.jpg" alt="Saxmundham Sports U13" loading="lazy" data-astro-cid-tegb73yx> </div><div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/TJ-Sokol-Repy-06.png" alt="TJ Sokol Repy 06" loading="lazy" data-astro-cid-tegb73yx> </div><div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/Tower-Hill-U9.jpg" alt="Tower Hill U9" loading="lazy" data-astro-cid-tegb73yx> </div><div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/West-Yorkshire-Falcons-FC.jpg" alt="West Yorkshire Falcons FC" loading="lazy" data-astro-cid-tegb73yx> </div><div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/Whittlesey-Junior-FC.png" alt="Whittlesey Junior FC" loading="lazy" data-astro-cid-tegb73yx> </div><div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/Wythenshawe-Town-Mavericks-U12s.jpg" alt="Wythenshawe Town Mavericks U12s" loading="lazy" data-astro-cid-tegb73yx> </div> <div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/Ashfield-Juniors-Football-Club-Glasgow.jpg" alt="Ashfield Juniors Football Club Glasgow" loading="lazy" data-astro-cid-tegb73yx> </div><div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/Bransgore-Youth-U9s.jpg" alt="Bransgore Youth U9s" loading="lazy" data-astro-cid-tegb73yx> </div><div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/Cottenham-Colts-U11-Black.png" alt="Cottenham Colts U11 Black" loading="lazy" data-astro-cid-tegb73yx> </div><div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/De-La-Salle-Girls-Manchester.jpg" alt="De La Salle Girls Manchester" loading="lazy" data-astro-cid-tegb73yx> </div><div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/FC-Bury-Vipers-U13.jpg" alt="FC Bury Vipers U13" loading="lazy" data-astro-cid-tegb73yx> </div><div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/Flitwick-Eagles-Girls-U11s.png" alt="Flitwick Eagles Girls U11s" loading="lazy" data-astro-cid-tegb73yx> </div><div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/kiveton-park-fc-u9.jpg" alt="Kiveton Park FC U9" loading="lazy" data-astro-cid-tegb73yx> </div><div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/Leafield-Athletic-U14-Colts.png" alt="Leafield Athletic U14 Colts" loading="lazy" data-astro-cid-tegb73yx> </div><div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/Prague-Raptors-FC.png" alt="Prague Raptors FC" loading="lazy" data-astro-cid-tegb73yx> </div><div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/Saxmundham-Sports-U13.jpg" alt="Saxmundham Sports U13" loading="lazy" data-astro-cid-tegb73yx> </div><div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/TJ-Sokol-Repy-06.png" alt="TJ Sokol Repy 06" loading="lazy" data-astro-cid-tegb73yx> </div><div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/Tower-Hill-U9.jpg" alt="Tower Hill U9" loading="lazy" data-astro-cid-tegb73yx> </div><div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/West-Yorkshire-Falcons-FC.jpg" alt="West Yorkshire Falcons FC" loading="lazy" data-astro-cid-tegb73yx> </div><div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/Whittlesey-Junior-FC.png" alt="Whittlesey Junior FC" loading="lazy" data-astro-cid-tegb73yx> </div><div class="logo-item" data-astro-cid-tegb73yx> <img src="https://assets.teamstats.net/img-m-100-70/logos/team-logos/Wythenshawe-Town-Mavericks-U12s.jpg" alt="Wythenshawe Town Mavericks U12s" loading="lazy" data-astro-cid-tegb73yx> </div> </div> </div> </div> </section> <section class="pt-4 pb-6 lg:pt-6 lg:pb-8 bg-white"> <div class="container mx-auto px-4 max-w-6xl"> <div class="home-testimonials-swiper swiper"> <div class="swiper-wrapper"> <div class="swiper-slide"> <div class="h-[320px] md:h-[360px] lg:h-[380px] rounded-2xl border border-base-300 bg-base-100/95 overflow-hidden shadow-sm"> <div class="relative flex flex-col items-center text-center px-6 py-6 h-full bg-gradient-to-b from-base-100 to-base-200"> <div class="mb-3 flex flex-col items-center gap-1"> <picture> <source srcset="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg?f=avif&v=130126-1" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg?f=webp&v=130126-1" type="image/webp"> <img src="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg" alt="Martin Salter - Saxmundham Sports" loading="lazy" class="w-14 h-14 md:w-16 md:h-16 rounded-full object-cover border border-base-300 shadow-sm"> </picture> <p class="text-[11px] md:text-xs text-yellow-400">
⭐⭐⭐⭐⭐
</p> </div> <blockquote class="text-xs md:text-sm lg:text-sm font-medium leading-relaxed max-w-xs md:max-w-sm mx-auto mb-3 text-base-content">
"I run a kids team and this allows me to get messages out to parents in bulk whilst the kids can log in and check our league standing and their own player stats."
</blockquote> <div class="flex flex-col items-center gap-1 mt-auto"> <p class="font-bold text-xs md:text-sm text-base-content"> Martin Salter </p> <p class="text-[11px] md:text-xs text-base-content/70"> Saxmundham Sports </p> </div> </div> </div> </div><div class="swiper-slide"> <div class="h-[320px] md:h-[360px] lg:h-[380px] rounded-2xl border border-base-300 bg-base-100/95 overflow-hidden shadow-sm"> <div class="relative flex flex-col items-center text-center px-6 py-6 h-full bg-gradient-to-b from-base-100 to-base-200"> <div class="mb-3 flex flex-col items-center gap-1"> <picture> <source srcset="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg?f=avif&v=130126-1" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg?f=webp&v=130126-1" type="image/webp"> <img src="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg" alt="Holts76123 - Apple App Store Review" loading="lazy" class="w-14 h-14 md:w-16 md:h-16 rounded-full object-cover border border-base-300 shadow-sm"> </picture> <p class="text-[11px] md:text-xs text-yellow-400">
⭐⭐⭐⭐⭐
</p> </div> <blockquote class="text-xs md:text-sm lg:text-sm font-medium leading-relaxed max-w-xs md:max-w-sm mx-auto mb-3 text-base-content">
"I have been using TeamStats for 4 or so years and never encountered any issues. Seamless organising for youth football and clear availability – would highly recommend to any new coach."
</blockquote> <div class="flex flex-col items-center gap-1 mt-auto"> <p class="font-bold text-xs md:text-sm text-base-content"> Holts76123 </p> <p class="text-[11px] md:text-xs text-base-content/70"> Apple App Store Review </p> </div> </div> </div> </div><div class="swiper-slide"> <div class="h-[320px] md:h-[360px] lg:h-[380px] rounded-2xl border border-base-300 bg-base-100/95 overflow-hidden shadow-sm"> <div class="relative flex flex-col items-center text-center px-6 py-6 h-full bg-gradient-to-b from-base-100 to-base-200"> <div class="mb-3 flex flex-col items-center gap-1"> <picture> <source srcset="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg?f=avif&v=130126-1" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg?f=webp&v=130126-1" type="image/webp"> <img src="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg" alt="Kevin Mullany - Google Play App Store Review" loading="lazy" class="w-14 h-14 md:w-16 md:h-16 rounded-full object-cover border border-base-300 shadow-sm"> </picture> <p class="text-[11px] md:text-xs text-yellow-400">
⭐⭐⭐⭐⭐
</p> </div> <blockquote class="text-xs md:text-sm lg:text-sm font-medium leading-relaxed max-w-xs md:max-w-sm mx-auto mb-3 text-base-content">
"A great app to keep all the team members up to date with all our team events."
</blockquote> <div class="flex flex-col items-center gap-1 mt-auto"> <p class="font-bold text-xs md:text-sm text-base-content"> Kevin Mullany </p> <p class="text-[11px] md:text-xs text-base-content/70"> Google Play App Store Review </p> </div> </div> </div> </div><div class="swiper-slide"> <div class="h-[320px] md:h-[360px] lg:h-[380px] rounded-2xl border border-base-300 bg-base-100/95 overflow-hidden shadow-sm"> <div class="relative flex flex-col items-center text-center px-6 py-6 h-full bg-gradient-to-b from-base-100 to-base-200"> <div class="mb-3 flex flex-col items-center gap-1"> <picture> <source srcset="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg?f=avif&v=130126-1" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg?f=webp&v=130126-1" type="image/webp"> <img src="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg" alt="Ian Wilson - Google Play App Store Review" loading="lazy" class="w-14 h-14 md:w-16 md:h-16 rounded-full object-cover border border-base-300 shadow-sm"> </picture> <p class="text-[11px] md:text-xs text-yellow-400">
⭐⭐⭐⭐⭐
</p> </div> <blockquote class="text-xs md:text-sm lg:text-sm font-medium leading-relaxed max-w-xs md:max-w-sm mx-auto mb-3 text-base-content">
"Fantastic app – easy to use and great for keeping stats."
</blockquote> <div class="flex flex-col items-center gap-1 mt-auto"> <p class="font-bold text-xs md:text-sm text-base-content"> Ian Wilson </p> <p class="text-[11px] md:text-xs text-base-content/70"> Google Play App Store Review </p> </div> </div> </div> </div><div class="swiper-slide"> <div class="h-[320px] md:h-[360px] lg:h-[380px] rounded-2xl border border-base-300 bg-base-100/95 overflow-hidden shadow-sm"> <div class="relative flex flex-col items-center text-center px-6 py-6 h-full bg-gradient-to-b from-base-100 to-base-200"> <div class="mb-3 flex flex-col items-center gap-1"> <picture> <source srcset="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg?f=avif&v=130126-1" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg?f=webp&v=130126-1" type="image/webp"> <img src="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg" alt="JD17 - Apple App Store Review" loading="lazy" class="w-14 h-14 md:w-16 md:h-16 rounded-full object-cover border border-base-300 shadow-sm"> </picture> <p class="text-[11px] md:text-xs text-yellow-400">
⭐⭐⭐⭐⭐
</p> </div> <blockquote class="text-xs md:text-sm lg:text-sm font-medium leading-relaxed max-w-xs md:max-w-sm mx-auto mb-3 text-base-content">
"I have used TeamStats for many years – it’s a superb app for grassroots football, easy to use and effective. Great value for money and better than any of the alternatives I’ve tried."
</blockquote> <div class="flex flex-col items-center gap-1 mt-auto"> <p class="font-bold text-xs md:text-sm text-base-content"> JD17 </p> <p class="text-[11px] md:text-xs text-base-content/70"> Apple App Store Review </p> </div> </div> </div> </div><div class="swiper-slide"> <div class="h-[320px] md:h-[360px] lg:h-[380px] rounded-2xl border border-base-300 bg-base-100/95 overflow-hidden shadow-sm"> <div class="relative flex flex-col items-center text-center px-6 py-6 h-full bg-gradient-to-b from-base-100 to-base-200"> <div class="mb-3 flex flex-col items-center gap-1"> <picture> <source srcset="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg?f=avif&v=130126-1" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg?f=webp&v=130126-1" type="image/webp"> <img src="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg" alt="James Thornett - Apple App Store Review" loading="lazy" class="w-14 h-14 md:w-16 md:h-16 rounded-full object-cover border border-base-300 shadow-sm"> </picture> <p class="text-[11px] md:text-xs text-yellow-400">
⭐⭐⭐⭐⭐
</p> </div> <blockquote class="text-xs md:text-sm lg:text-sm font-medium leading-relaxed max-w-xs md:max-w-sm mx-auto mb-3 text-base-content">
"First used this as a parent when my son’s junior team were using it. Very easy to update availability and great to see all the detail on future schedule and past results and stats."
</blockquote> <div class="flex flex-col items-center gap-1 mt-auto"> <p class="font-bold text-xs md:text-sm text-base-content"> James Thornett </p> <p class="text-[11px] md:text-xs text-base-content/70"> Apple App Store Review </p> </div> </div> </div> </div><div class="swiper-slide"> <div class="h-[320px] md:h-[360px] lg:h-[380px] rounded-2xl border border-base-300 bg-base-100/95 overflow-hidden shadow-sm"> <div class="relative flex flex-col items-center text-center px-6 py-6 h-full bg-gradient-to-b from-base-100 to-base-200"> <div class="mb-3 flex flex-col items-center gap-1"> <picture> <source srcset="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg?f=avif&v=130126-1" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg?f=webp&v=130126-1" type="image/webp"> <img src="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg" alt="Paul Blayney - Google Play App Store Review" loading="lazy" class="w-14 h-14 md:w-16 md:h-16 rounded-full object-cover border border-base-300 shadow-sm"> </picture> <p class="text-[11px] md:text-xs text-yellow-400">
⭐⭐⭐⭐⭐
</p> </div> <blockquote class="text-xs md:text-sm lg:text-sm font-medium leading-relaxed max-w-xs md:max-w-sm mx-auto mb-3 text-base-content">
"A great app for helping to manage our team. Our players love knowing how many goals and assists they&#39;ve got compared to other players and it’s great for tracking availability."
</blockquote> <div class="flex flex-col items-center gap-1 mt-auto"> <p class="font-bold text-xs md:text-sm text-base-content"> Paul Blayney </p> <p class="text-[11px] md:text-xs text-base-content/70"> Google Play App Store Review </p> </div> </div> </div> </div><div class="swiper-slide"> <div class="h-[320px] md:h-[360px] lg:h-[380px] rounded-2xl border border-base-300 bg-base-100/95 overflow-hidden shadow-sm"> <div class="relative flex flex-col items-center text-center px-6 py-6 h-full bg-gradient-to-b from-base-100 to-base-200"> <div class="mb-3 flex flex-col items-center gap-1"> <picture> <source srcset="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg?f=avif&v=130126-1" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg?f=webp&v=130126-1" type="image/webp"> <img src="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg" alt="Paul Bessant - Google Play App Store Review" loading="lazy" class="w-14 h-14 md:w-16 md:h-16 rounded-full object-cover border border-base-300 shadow-sm"> </picture> <p class="text-[11px] md:text-xs text-yellow-400">
⭐⭐⭐⭐⭐
</p> </div> <blockquote class="text-xs md:text-sm lg:text-sm font-medium leading-relaxed max-w-xs md:max-w-sm mx-auto mb-3 text-base-content">
"If you&#39;re looking for an app to keep your club information all in one place then this is the app. Player availability, match details, line‑ups, match reports and finances – it has it all."
</blockquote> <div class="flex flex-col items-center gap-1 mt-auto"> <p class="font-bold text-xs md:text-sm text-base-content"> Paul Bessant </p> <p class="text-[11px] md:text-xs text-base-content/70"> Google Play App Store Review </p> </div> </div> </div> </div><div class="swiper-slide"> <div class="h-[320px] md:h-[360px] lg:h-[380px] rounded-2xl border border-base-300 bg-base-100/95 overflow-hidden shadow-sm"> <div class="relative flex flex-col items-center text-center px-6 py-6 h-full bg-gradient-to-b from-base-100 to-base-200"> <div class="mb-3 flex flex-col items-center gap-1"> <picture> <source srcset="https://assets.teamstats.net/img-m-800-100/photos/teams/FC-Bury-Vipers.jpg?f=avif&v=130126-1" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-800-100/photos/teams/FC-Bury-Vipers.jpg?f=webp&v=130126-1" type="image/webp"> <img src="https://assets.teamstats.net/img-m-800-100/photos/teams/FC-Bury-Vipers.jpg" alt="Jason Latham - FC Bury" loading="lazy" class="w-14 h-14 md:w-16 md:h-16 rounded-full object-cover border border-base-300 shadow-sm"> </picture> <p class="text-[11px] md:text-xs text-yellow-400">
⭐⭐⭐⭐⭐
</p> </div> <blockquote class="text-xs md:text-sm lg:text-sm font-medium leading-relaxed max-w-xs md:max-w-sm mx-auto mb-3 text-base-content">
"TeamStats has made scheduling games and knowing which players are available so much easier. Its reduced my time as a coach doing this significantly."
</blockquote> <div class="flex flex-col items-center gap-1 mt-auto"> <p class="font-bold text-xs md:text-sm text-base-content"> Jason Latham </p> <p class="text-[11px] md:text-xs text-base-content/70"> FC Bury </p> </div> </div> </div> </div><div class="swiper-slide"> <div class="h-[320px] md:h-[360px] lg:h-[380px] rounded-2xl border border-base-300 bg-base-100/95 overflow-hidden shadow-sm"> <div class="relative flex flex-col items-center text-center px-6 py-6 h-full bg-gradient-to-b from-base-100 to-base-200"> <div class="mb-3 flex flex-col items-center gap-1"> <picture> <source srcset="https://assets.teamstats.net/img-m-800-100/owain-roberts/img-tmf-100-70-100-693660-340279-340279_500_Owain-Roberts_169944.jpg?f=avif&v=130126-1" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-800-100/owain-roberts/img-tmf-100-70-100-693660-340279-340279_500_Owain-Roberts_169944.jpg?f=webp&v=130126-1" type="image/webp"> <img src="https://assets.teamstats.net/img-m-800-100/owain-roberts/img-tmf-100-70-100-693660-340279-340279_500_Owain-Roberts_169944.jpg" alt="Owain Roberts - Pentraeth FC" loading="lazy" class="w-14 h-14 md:w-16 md:h-16 rounded-full object-cover border border-base-300 shadow-sm"> </picture> <p class="text-[11px] md:text-xs text-yellow-400">
⭐⭐⭐⭐⭐
</p> </div> <blockquote class="text-xs md:text-sm lg:text-sm font-medium leading-relaxed max-w-xs md:max-w-sm mx-auto mb-3 text-base-content">
"A great collective hub to bring players together and a fantastic aid in team decision making. Would highly recommend any football club to adopt its use."
</blockquote> <div class="flex flex-col items-center gap-1 mt-auto"> <p class="font-bold text-xs md:text-sm text-base-content"> Owain Roberts </p> <p class="text-[11px] md:text-xs text-base-content/70"> Pentraeth FC </p> </div> </div> </div> </div><div class="swiper-slide"> <div class="h-[320px] md:h-[360px] lg:h-[380px] rounded-2xl border border-base-300 bg-base-100/95 overflow-hidden shadow-sm"> <div class="relative flex flex-col items-center text-center px-6 py-6 h-full bg-gradient-to-b from-base-100 to-base-200"> <div class="mb-3 flex flex-col items-center gap-1"> <picture> <source srcset="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg?f=avif&v=130126-1" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg?f=webp&v=130126-1" type="image/webp"> <img src="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg" alt="Stu - UTG! - Apple App Store Review" loading="lazy" class="w-14 h-14 md:w-16 md:h-16 rounded-full object-cover border border-base-300 shadow-sm"> </picture> <p class="text-[11px] md:text-xs text-yellow-400">
⭐⭐⭐⭐⭐
</p> </div> <blockquote class="text-xs md:text-sm lg:text-sm font-medium leading-relaxed max-w-xs md:max-w-sm mx-auto mb-3 text-base-content">
"This app is great for recording our grassroots football team’s stats. Easy to use and would recommend."
</blockquote> <div class="flex flex-col items-center gap-1 mt-auto"> <p class="font-bold text-xs md:text-sm text-base-content"> Stu - UTG! </p> <p class="text-[11px] md:text-xs text-base-content/70"> Apple App Store Review </p> </div> </div> </div> </div><div class="swiper-slide"> <div class="h-[320px] md:h-[360px] lg:h-[380px] rounded-2xl border border-base-300 bg-base-100/95 overflow-hidden shadow-sm"> <div class="relative flex flex-col items-center text-center px-6 py-6 h-full bg-gradient-to-b from-base-100 to-base-200"> <div class="mb-3 flex flex-col items-center gap-1"> <picture> <source srcset="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg?f=avif&v=130126-1" type="image/avif"><source srcset="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg?f=webp&v=130126-1" type="image/webp"> <img src="https://assets.teamstats.net/img-m-800-100/photos/teams/kids-football-manager.jpg" alt="JoanneWitter - Apple App Store Review" loading="lazy" class="w-14 h-14 md:w-16 md:h-16 rounded-full object-cover border border-base-300 shadow-sm"> </picture> <p class="text-[11px] md:text-xs text-yellow-400">
⭐⭐⭐⭐⭐
</p> </div> <blockquote class="text-xs md:text-sm lg:text-sm font-medium leading-relaxed max-w-xs md:max-w-sm mx-auto mb-3 text-base-content">
"Used the app over the last month and entered matches since the start of the season. Very helpful to monitor team stats and player stats including goals scored."
</blockquote> <div class="flex flex-col items-center gap-1 mt-auto"> <p class="font-bold text-xs md:text-sm text-base-content"> JoanneWitter </p> <p class="text-[11px] md:text-xs text-base-content/70"> Apple App Store Review </p> </div> </div> </div> </div> </div> <div class="swiper-pagination mt-4"></div> </div> <div class="text-center mt-16 mb-12"> <a href="/success-stories" class="text-primary hover:underline font-medium">
Read more of our user testimonials and team success stories
</a> </div> </div> <script type="module" src="/_astro/HomeTestimonialsSlider.astro_astro_type_script_index_0_lang.OyMdNw1G.js"></script> </section> <section class="pt-2 pb-8 lg:pt-3 lg:pb-10 bg-white"> <div class="container mx-auto px-4 max-w-6xl"> <div class="flex flex-wrap justify-center items-center gap-5"> <a href="https://play.google.com/store/apps/details?id=net.teamstats.app&showAllReviews=true" target="_blank" rel="noopener noreferrer" class="block w-40 sm:w-44 transition-transform hover:scale-105"> <img src="https://assets.teamstats.net/img-m-150-100/logos/app-stores/google-play-badge-reviews.png" alt="Google Play Store Reviews" class="w-full h-auto" loading="lazy"> </a><a href="https://apps.apple.com/gb/app/teamstats-football-team-app/id1275644100?mt=8" target="_blank" rel="noopener noreferrer" class="block w-40 sm:w-44 transition-transform hover:scale-105"> <img src="https://assets.teamstats.net/img-m-150-100/logos/app-stores/app-store-badge-reviews.png" alt="iOS App Store Reviews" class="w-full h-auto" loading="lazy"> </a><a href="https://www.capterra.com/reviews/172849/TeamStats?utm_source=vendor&utm_medium=badge&utm_campaign=capterra_reviews_badge" target="_blank" rel="noopener noreferrer" class="block w-40 sm:w-44 transition-transform hover:scale-105"> <img src="https://assets.capterra.com/badge/e2648189ae85a45695edeae732097b5e.png?v=2119767&p=172849" alt="Capterra Reviews" class="w-full h-auto" loading="lazy"> </a><a href="https://tinyurl.com/teamstats-google-reviews" target="_blank" rel="noopener noreferrer" class="block w-40 sm:w-44 transition-transform hover:scale-105"> <img src="https://assets.teamstats.net/img-m-150-100/logos/app-stores/google-reviews.png" alt="Google Reviews" class="w-full h-auto" loading="lazy"> </a> </div> </div> </section> <section class="video-hero-section" id="video" data-astro-cid-ux2kju4p> <!-- Background video (muted, autoplay, loop) --> <div class="video-bg" data-astro-cid-ux2kju4p>  <video src="https://assets.teamstats.net/mainsite/assets/video/backgrounds/Drone-Match-2.mp4" data-lazy-src="https://assets.teamstats.net/mainsite/assets/video/backgrounds/Drone-Match-2.mp4" muted loop playsinline class="bg-video-element video-hero-bg" aria-label="Background video" data-astro-cid-ux2kju4p></video> <!-- Dark overlay for readability --> <div class="video-overlay" data-astro-cid-ux2kju4p></div> </div> <!-- Content overlay --> <div class="container mx-auto px-4 max-w-7xl" data-astro-cid-ux2kju4p> <div class="content-with-mockup" data-astro-cid-ux2kju4p> <div class="content-wrapper" data-astro-cid-ux2kju4p> <h2 class="hero-title" data-astro-cid-ux2kju4p>Are you ready to kick off?</h2> <p class="hero-description" data-astro-cid-ux2kju4p>Registering your team is quick and easy. Just enter a few basic details and we&#39;ll do the rest.</p> <!-- CTA button - uses same classes as other Get Started buttons -->
          <button class="trigger-signup btn btn-primary btn-lg uppercase font-semibold" data-astro-cid-ux2kju4p> GET STARTED FOR FREE </button> </div> <!-- Optional phone mockup slot --> <div class="mockup-wrapper" data-astro-cid-ux2kju4p>  </div> </div> </div>  </section>  <script>(function(){const modalVideoUrl = "https://www.youtube.com/embed/undefined?autoplay=1&rel=0&modestbranding=1";
const isModalYouTube = true;
const buttonMode = "cta";

  // Only run video modal logic if in video mode
  if (buttonMode !== 'video') {
    // CTA mode - button is handled by signup-modal.js via trigger-signup class
    console.log('VideoHeroSection in CTA mode - signup handled by signup-modal.js');
  } else {
    // Video mode - setup modal
    // Wait for DOM to be fully loaded
    document.addEventListener('DOMContentLoaded', () => {
      // Use global BlurManager (loaded from blur-manager.js)
      const blurManager = window.blurManager;
        const modal = document.getElementById('videoModal');
        const openBtn = document.getElementById('openVideoModal');
        const closeBtn = document.getElementById('closeVideoModal');
        const videoElement = document.getElementById('modalVideoElement');
        
        // Debug: Check if elements exist
        if (!modal) {
          console.error('Video modal not found');
          return;
        }
        if (!openBtn) {
          console.error('Open button not found');
          return;
        }
        if (!videoElement) {
          console.error('Modal video element not found');
          return;
        }
      
      // Check if browser supports <dialog>
      if (typeof modal.showModal !== 'function') {
        console.warn('Browser does not support <dialog> element. Using fallback.');
        modal.style.display = 'none';
      }
      
      console.log('Modal video URL:', modalVideoUrl);
      console.log('Is YouTube:', isModalYouTube);

      // Open modal
      openBtn.addEventListener('click', (e) => {
        e.preventDefault();
        console.log('Play button clicked');
        
        try {
          // Set video source based on type
          if (isModalYouTube) {
            videoElement.src = modalVideoUrl;
            console.log('YouTube iframe src set to:', videoElement.src);
          } else {
            // For local video, just play it (src is already set in HTML)
            videoElement.play();
            console.log('Local video playing');
          }
          
          // Use showModal if supported, otherwise fallback
          if (typeof modal.showModal === 'function') {
            modal.showModal();
          } else {
            modal.style.display = 'flex';
            modal.setAttribute('open', '');
          }
          
          // Enable blur effect
          if (blurManager) {
            blurManager.enable('video-modal');
            console.log('Modal opened with blur effect');
          }
        } catch (error) {
          console.error('Error opening modal:', error);
          modal.style.display = 'flex';
          modal.setAttribute('open', '');
        }
      });

      // Close modal function
      const closeModal = () => {
        try {
          if (typeof modal.close === 'function') {
            modal.close();
          } else {
            modal.style.display = 'none';
            modal.removeAttribute('open');
          }
          
          // Stop video based on type
          if (isModalYouTube) {
            videoElement.src = '';
          } else {
            videoElement.pause();
            videoElement.currentTime = 0;
          }
          
          // Disable blur effect
          if (blurManager) {
            blurManager.disable('video-modal');
            console.log('Modal closed, blur disabled');
          }
        } catch (error) {
          console.error('Error closing modal:', error);
          modal.style.display = 'none';
          if (blurManager) {
            blurManager.disable('video-modal');
          }
        }
      };

      // Close button
      if (closeBtn) {
        closeBtn.addEventListener('click', (e) => {
          e.preventDefault();
          closeModal();
        });
      }

      // Close on backdrop click
      modal.addEventListener('click', (e) => {
        const rect = modal.getBoundingClientRect();
        const isInDialog = (
          rect.top <= e.clientY &&
          e.clientY <= rect.top + rect.height &&
          rect.left <= e.clientX &&
          e.clientX <= rect.left + rect.width
        );
        
        if (!isInDialog) {
          closeModal();
        }
      });

      // Close on Escape key
      document.addEventListener('keydown', (e) => {
        if (e.key === 'Escape' && modal.hasAttribute('open')) {
          closeModal();
        }
      });

      // Native close event
      modal.addEventListener('close', () => {
        if (isModalYouTube) {
          videoElement.src = '';
        } else {
          videoElement.pause();
          videoElement.currentTime = 0;
        }
        if (blurManager) {
          blurManager.disable('video-modal');
        }
      });
    }); // Close DOMContentLoaded
  } // Close else (video mode)
})();</script> <footer class="bg-neutral-900 text-neutral-100 pt-10 pb-8"> <div class="max-w-6xl mx-auto px-6"> <div class="grid grid-cols-2 md:grid-cols-4 gap-8 md:gap-10"> <div> <ul class="space-y-2 text-sm md:text-base"> <li> <a href="/" class="hover:text-white">Home</a> </li> <li> <a href="/all-teamstats-features" class="hover:text-white">Features</a> </li> <li> <a href="/pricing" class="hover:text-white">Pricing</a> </li> <li> <button class="signup-trigger hover:text-white">Sign Up</button> </li> <li> <a class="pt-3 hover:text-white" href="#" data-fancybox="" data-type="iframe" data-src="https://www.youtube.com/embed/r8SvuQnKoYE?autoplay=1&modestbranding=1&rel=0&iv_load_policy=3&controls=0">
Video Tour
</a> </li> <li> <a href="/advertise-to-football-teams-players" class="hover:text-white">Advertise</a> </li> </ul> </div> <div> <ul class="space-y-2 text-sm md:text-base"> <li> <a href="/teamstats-top-50-football-teams" class="hover:text-white">Top 50 Teams</a> </li> <li> <a href="/teams" class="hover:text-white">Team Directory</a> </li> <li> <a href="/leagues" class="hover:text-white">League Directory</a> </li> <li> <a href="/match-reports" class="hover:text-white">Match Reports</a> </li> <li> <a href="/football-coaching" class="hover:text-white">Football Coaching</a> </li> </ul> </div> <div> <ul class="space-y-2 text-sm md:text-base"> <li> <a href="/blog" class="hover:text-white">TeamStats Blog</a> </li> <li> <a href="/blog/write-for-us" class="hover:text-white">Write for us</a> </li> <li> <a class="external-link social-media hover:text-white" target="_blank" href="https://www.facebook.com/teamstats">
Like us on Facebook
</a> </li> <li> <a class="external-link social-media hover:text-white" target="_blank" href="https://x.com/teamstats">
Follow us on X
</a> </li> <li> <a class="external-link social-media hover:text-white" target="_blank" href="https://instagram.com/teamstatsapp">
Follow us on Instagram
</a> </li> <li> <a class="external-link social-media hover:text-white" target="_blank" href="http://youtube.com/teamstats">
Watch us on YouTube
</a> </li> </ul> </div> <div class="flex flex-col items-start justify-start"> <div class="space-y-3"> <a class="external-link app-store inline-block" href="https://apps.apple.com/gb/app/teamstats-football-team-app/id1275644100?mt=8" target="_blank"> <img alt="Download the TeamStats iOS app" class="mb-3 shadow-lg max-w-[160px] w-full h-auto" src="https://assets.teamstats.net/img-m-250-70/logos/app-stores/app-store-badge.png"> </a> <a class="external-link app-store inline-block" href="https://play.google.com/store/apps/details?id=net.teamstats.app" target="_blank"> <img alt="Download the TeamStats Android app" class="shadow-lg max-w-[160px] w-full h-auto" src="https://assets.teamstats.net/img-m-250-70/logos/app-stores/google-play-badge.png"> </a> </div> </div> </div> <div class="mt-8 pt-4 border-t border-neutral-800 text-xs md:text-sm text-neutral-300"> <div class="mb-1">
&copy; <span class="update-year">2026</span> Teamstats.net Limited
</div> <div class="flex flex-wrap items-center gap-3"> <a href="/teamstats-privacy-policy" class="hover:text-white">Privacy Policy</a> <a href="/teamstats-terms-of-use" class="hover:text-white">Terms of Use</a> </div> </div> </div> </footer>  </div> <!-- Sign In Modal --><input type="checkbox" id="signin-modal" class="modal-toggle"> <div class="modal"> <div class="modal-box"> <h3 class="font-bold text-lg">Sign In to Your Account</h3> <p class="py-4">Access your dashboard and manage your projects.</p> <div class="form-control"> <label class="label"> <span class="label-text">Email</span> </label> <input type="email" placeholder="Enter your email" class="input input-bordered"> </div> <div class="form-control mt-4"> <label class="label"> <span class="label-text">Password</span> </label> <input type="password" placeholder="Enter your password" class="input input-bordered"> </div> <div class="form-control mt-4"> <label class="cursor-pointer label"> <span class="label-text">Remember me</span> <input type="checkbox" class="checkbox checkbox-primary"> </label> </div> <div class="modal-action"> <label for="signin-modal" class="btn btn-ghost">Cancel</label> <button class="btn btn-primary">Sign In</button> </div> </div> </div> <!-- Get Started Modal --><input type="checkbox" id="getstarted-modal" class="modal-toggle"> <div class="modal"> <div class="modal-box max-w-lg"> <h3 class="font-bold text-lg">Get Started with YourSaaS</h3> <p class="py-4">Choose how you'd like to begin your journey.</p> <div class="space-y-4"> <div class="card bg-base-200 cursor-pointer hover:bg-base-300 transition-colors"> <div class="card-body p-4"> <h4 class="font-semibold">Start Free Trial</h4> <p class="text-sm text-base-content/70">14 days free, no credit card required</p> </div> </div> <div class="card bg-base-200 cursor-pointer hover:bg-base-300 transition-colors"> <div class="card-body p-4"> <h4 class="font-semibold">View Pricing</h4> <p class="text-sm text-base-content/70">See all plans and features</p> </div> </div> <div class="card bg-base-200 cursor-pointer hover:bg-base-300 transition-colors"> <div class="card-body p-4"> <h4 class="font-semibold">Book Demo</h4> <p class="text-sm text-base-content/70">Schedule a personalized walkthrough</p> </div> </div> </div> <div class="modal-action"> <label for="getstarted-modal" class="btn btn-ghost">Close</label> </div> </div> </div> <div id="login-modal" class="fixed inset-0 z-[9999] hidden items-center justify-center bg-black/50 backdrop-blur-sm" data-astro-cid-4iwzqplc> <div class="card w-full max-w-md bg-white shadow-2xl mx-4 max-h-[90vh] flex flex-col overflow-hidden" data-astro-cid-4iwzqplc> <!-- Header --> <div class="flex items-center justify-between px-4 py-4 border-b bg-white" data-astro-cid-4iwzqplc> <h2 class="text-lg font-semibold tracking-tight" data-astro-cid-4iwzqplc>Log in to TeamStats</h2> <button id="close-login-modal" class="btn btn-xs btn-circle btn-ghost" aria-label="Close" data-astro-cid-4iwzqplc> <svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" data-astro-cid-4iwzqplc> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" data-astro-cid-4iwzqplc></path> </svg> </button> </div> <div class="card-body flex-1 flex flex-col overflow-y-auto" data-astro-cid-4iwzqplc> <!-- Error Message --> <div id="login-error" class="alert alert-error hidden mb-4" data-astro-cid-4iwzqplc> <svg xmlns="http://www.w3.org/2000/svg" class="stroke-current shrink-0 h-6 w-6" fill="none" viewBox="0 0 24 24" data-astro-cid-4iwzqplc> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z" data-astro-cid-4iwzqplc></path> </svg> <span id="login-error-text" data-astro-cid-4iwzqplc></span> </div> <!-- Success Message --> <div id="login-success" class="hidden mb-4" data-astro-cid-4iwzqplc></div> <!-- Step 1: Login Form --> <div id="login-step-1" class="login-step flex flex-col flex-1" data-astro-cid-4iwzqplc> <form id="login-form" autocomplete="on" class="space-y-5" data-astro-cid-4iwzqplc> <div class="form-control" data-astro-cid-4iwzqplc> <label class="label pb-1" for="login-username" data-astro-cid-4iwzqplc> <span class="label-text text-sm font-semibold uppercase tracking-wide" data-astro-cid-4iwzqplc>Username or email address</span> </label> <input type="text" id="login-username" name="username" autocomplete="username" class="input input-bordered w-full bg-slate-50 text-base" required data-astro-cid-4iwzqplc> </div> <div class="form-control" data-astro-cid-4iwzqplc> <label class="label pb-1" for="login-password" data-astro-cid-4iwzqplc> <span class="label-text text-sm font-semibold uppercase tracking-wide" data-astro-cid-4iwzqplc>Password</span> </label> <input type="password" id="login-password" name="password" autocomplete="current-password" class="input input-bordered w-full bg-slate-50 text-base" required data-astro-cid-4iwzqplc> </div> <div class="form-control mt-6 mb-16" data-astro-cid-4iwzqplc> <button type="submit" class="btn btn-success w-full text-white text-base font-semibold tracking-wide" data-astro-cid-4iwzqplc>
LOG IN
</button> </div> </form> </div> <!-- Step: Team Selection (dynamically populated by login.js) --> <div id="login-step-teams" class="login-step hidden" data-astro-cid-4iwzqplc> <!-- Content injected by login.js after successful authentication --> </div> <!-- Step 2: Forgot Password --> <div id="login-step-2" class="login-step hidden" data-astro-cid-4iwzqplc> <div class="space-y-4" data-astro-cid-4iwzqplc> <p class="text-base-content/70" data-astro-cid-4iwzqplc>
Please enter your username OR your registered email address below - any matching account details will be emailed to you with further instructions
</p> <form id="forgot-password-form" class="space-y-4" data-astro-cid-4iwzqplc> <div class="form-control" data-astro-cid-4iwzqplc> <label class="label" for="forgot-username-email" data-astro-cid-4iwzqplc> <span class="label-text font-medium" data-astro-cid-4iwzqplc>Username or Email</span> </label> <input type="text" id="forgot-username-email" placeholder="Enter your username or email" class="input input-bordered w-full" required data-astro-cid-4iwzqplc> </div> <div class="form-control mt-6 mb-16" data-astro-cid-4iwzqplc> <button type="submit" class="btn btn-primary w-full text-sm font-semibold tracking-wide" data-astro-cid-4iwzqplc>
SUBMIT
</button> <p id="forgot-password-status" class="text-sm text-base-content/80 hidden" data-astro-cid-4iwzqplc></p> </div> </form> </div> </div> <!-- Footer: Forgot password link --> <div class="mt-auto pt-4 border-t text-center text-xs font-semibold tracking-wide text-primary" data-astro-cid-4iwzqplc> <a href="#" id="show-forgot-password" data-astro-cid-4iwzqplc>FORGOT PASSWORD?</a> </div> </div> </div> </div> <script type="module">let m=1;function r(t){m=t,document.querySelectorAll(".login-step").forEach(l=>l.classList.add("hidden"));const o=document.getElementById(`login-step-${t}`);o&&o.classList.remove("hidden");const n=document.querySelector("#login-modal h2");t===2?n&&(n.textContent="Forgot Password"):n&&(n.textContent="Log in to TeamStats");const e=document.getElementById("show-forgot-password"),s=e?.parentElement;e&&(e.textContent=t===2?"BACK TO LOG IN":"FORGOT PASSWORD?"),s&&(s.style.display=t===1||t===2?"":"none")}document.getElementById("show-forgot-password")?.addEventListener("click",t=>{t.preventDefault(),r(m===2?1:2)});document.getElementById("switch-to-signup")?.addEventListener("click",async t=>{t.preventDefault();const o=window.blurManager,n=document.getElementById("login-modal"),e=document.getElementById("full-page-overlay");n&&(n.classList.add("hidden"),n.classList.remove("flex")),e&&(e.classList.remove("hidden"),e.classList.add("flex")),o.disable("login-modal"),o.enable("signup-modal"),r(1)});document.getElementById("forgot-password-form")?.addEventListener("submit",async t=>{t.preventDefault();const o=t.target,n=document.getElementById("forgot-username-email"),e=document.getElementById("forgot-password-status"),s=o.querySelector('button[type="submit"]'),d=(n?.value||"").trim();if(d){e&&(e.classList.remove("hidden"),e.textContent="Sending reset instructions..."),s&&(s.disabled=!0,s.textContent="SENDING...");try{const i=window.getTeamStatsBaseUrl,u=`${(i?i():"https://www.teamstats.net").replace(/\/$/,"")}/api/user/forgottenPassword.asp?searchFor=${encodeURIComponent(d)}`,f=await fetch(u,{method:"GET",credentials:"include"});let c="If an account exists with that username or email, you will receive password reset instructions shortly.";try{const a=await f.json();a&&a.response&&typeof a.response.statusText=="string"&&(c=a.response.statusText)}catch{}e&&(e.textContent=c)}catch{e&&(e.textContent="There was a problem sending the reset email. Please try again in a moment.")}finally{s&&(s.disabled=!1,s.textContent="SUBMIT")}}});</script> <div id="full-page-overlay" class="fixed inset-0 z-9999 hidden items-center justify-center bg-black/50 backdrop-blur-sm" data-astro-cid-uc2ui6qy> <div class="card w-full max-w-lg bg-white shadow-2xl mx-4 max-h-[90vh] overflow-y-auto" data-astro-cid-uc2ui6qy> <div class="card-body" data-astro-cid-uc2ui6qy> <!-- Header --> <div class="flex items-start justify-between mb-6" data-astro-cid-uc2ui6qy> <div data-astro-cid-uc2ui6qy> <h2 id="signup-title" class="card-title text-3xl font-bold" data-astro-cid-uc2ui6qy>Sign Up</h2> <p id="signup-subtitle" class="text-base text-base-content/70 mt-1" data-astro-cid-uc2ui6qy>Free to join. No payment details required.</p> </div> <button class="btn btn-sm btn-circle btn-ghost" id="close-full-overlay" aria-label="Close" data-astro-cid-uc2ui6qy> <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor" data-astro-cid-uc2ui6qy> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" data-astro-cid-uc2ui6qy></path> </svg> </button> </div> <!-- Error Message --> <div id="signup-error" class="alert alert-error hidden mb-4" data-astro-cid-uc2ui6qy> <svg xmlns="http://www.w3.org/2000/svg" class="stroke-current shrink-0 h-6 w-6" fill="none" viewBox="0 0 24 24" data-astro-cid-uc2ui6qy> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z" data-astro-cid-uc2ui6qy></path> </svg> <span data-astro-cid-uc2ui6qy></span> </div> <!-- Step 1: Choose option --> <div id="step-1" class="signup-step space-y-5" data-astro-cid-uc2ui6qy> <button type="button" class="btn btn-success btn-lg w-full text-lg font-semibold tracking-wide" id="create-team-option" data-astro-cid-uc2ui6qy>
CREATE NEW TEAM
</button> <p class="text-base text-base-content/70 text-center max-w-md mx-auto" data-astro-cid-uc2ui6qy>Select this option if you are a team admin and want to set up a new team.</p> <div class="divider" data-astro-cid-uc2ui6qy>OR</div> <button type="button" class="btn btn-primary btn-lg w-full text-lg font-semibold tracking-wide" id="join-team-option" data-astro-cid-uc2ui6qy>
EXISTING TEAM
</button> <p class="text-base text-base-content/70 text-center max-w-md mx-auto" data-astro-cid-uc2ui6qy>Select this option if you want to be added to a team that is already registered.</p> </div> <!-- Step 2: Create new team --> <div id="step-2" class="signup-step hidden" data-astro-cid-uc2ui6qy> <form id="create-team-form" autocomplete="off" class="space-y-4" data-astro-cid-uc2ui6qy> <div class="form-control" data-astro-cid-uc2ui6qy> <label class="label" for="create-team-name" data-astro-cid-uc2ui6qy> <span class="label-text font-medium text-base" data-astro-cid-uc2ui6qy>Club/Team Name</span> </label> <input id="create-team-name" type="text" placeholder="Enter team name" class="input input-bordered w-full focus:input-primary text-base" required data-astro-cid-uc2ui6qy> </div> <div class="form-control" data-astro-cid-uc2ui6qy> <label class="label" for="create-email" data-astro-cid-uc2ui6qy> <span class="label-text font-medium text-base" data-astro-cid-uc2ui6qy>Your Email Address</span> </label> <input id="create-email" type="email" autocomplete="off" placeholder="Enter your email" class="input input-bordered w-full lowercase focus:input-primary text-base" required data-astro-cid-uc2ui6qy> </div> <div class="form-control" data-astro-cid-uc2ui6qy> <label class="label" for="create-fullname" data-astro-cid-uc2ui6qy> <span class="label-text font-medium text-base" data-astro-cid-uc2ui6qy>Your Full Name</span> </label> <input id="create-fullname" type="text" autocomplete="off" placeholder="Enter your full name" class="input input-bordered w-full focus:input-primary text-base" required data-astro-cid-uc2ui6qy> </div> <div class="form-control" data-astro-cid-uc2ui6qy> <label class="label" for="create-password" data-astro-cid-uc2ui6qy> <span class="label-text font-medium text-base" data-astro-cid-uc2ui6qy>Choose a Password</span> </label> <input id="create-password" type="password" autocomplete="off" placeholder="Enter password" class="input input-bordered w-full focus:input-primary text-base" required data-astro-cid-uc2ui6qy> </div> <div class="flex flex-col gap-3 pt-4" data-astro-cid-uc2ui6qy> <button id="signup-button" type="submit" class="btn btn-primary btn-lg w-full text-base" data-astro-cid-uc2ui6qy>Sign Up</button> <div id="loading-anim" class="hidden flex items-center justify-center gap-2 text-base-content/70" data-astro-cid-uc2ui6qy> <span class="loading loading-spinner loading-md" data-astro-cid-uc2ui6qy></span> <span data-astro-cid-uc2ui6qy>Creating your team...</span> </div> </div> </form> </div> <!-- Step 3: Join team - Enter details --> <div id="step-3" class="signup-step hidden" data-astro-cid-uc2ui6qy> <h3 class="text-2xl font-semibold mb-4 flex items-center gap-2" data-astro-cid-uc2ui6qy> <span class="text-2xl" data-astro-cid-uc2ui6qy>👤</span> Please enter your details
</h3> <form id="join-details-form" class="space-y-4" data-astro-cid-uc2ui6qy> <div class="form-control" data-astro-cid-uc2ui6qy> <label class="label" for="join-email" data-astro-cid-uc2ui6qy> <span class="label-text font-medium text-base" data-astro-cid-uc2ui6qy>What's your email address?</span> </label> <input type="email" id="join-email" placeholder="Enter your email" class="input input-bordered w-full focus:input-primary text-base" required data-astro-cid-uc2ui6qy> </div> <div class="form-control" data-astro-cid-uc2ui6qy> <label class="label" for="join-fullname" data-astro-cid-uc2ui6qy> <span class="label-text font-medium text-base" data-astro-cid-uc2ui6qy>What's your full name?</span> </label> <input type="text" id="join-fullname" placeholder="Enter your full name" class="input input-bordered w-full focus:input-primary text-base" required data-astro-cid-uc2ui6qy> </div> <div class="flex gap-3 pt-4" data-astro-cid-uc2ui6qy> <button type="button" class="btn btn-outline flex-1" id="back-to-step-1" data-astro-cid-uc2ui6qy>Back</button> <button type="submit" class="btn btn-primary flex-1" data-astro-cid-uc2ui6qy>Continue</button> </div> </form> </div> <!-- Step 4: Search for team --> <div id="step-4" class="signup-step hidden" data-astro-cid-uc2ui6qy> <h3 class="text-xl font-semibold mb-4 flex items-center gap-2" data-astro-cid-uc2ui6qy> <span class="text-2xl" data-astro-cid-uc2ui6qy>👕</span> What is your team called?
</h3> <form id="search-team-form" class="space-y-4" data-astro-cid-uc2ui6qy> <div class="form-control" data-astro-cid-uc2ui6qy> <label class="label" for="team-search" data-astro-cid-uc2ui6qy> <span class="label-text font-medium" data-astro-cid-uc2ui6qy>Search for and select your team</span> </label> <input type="text" id="team-search" placeholder="Minimum 3 characters" class="input input-bordered w-full focus:input-primary" data-astro-cid-uc2ui6qy> </div> <div id="team-results" class="space-y-2 max-h-64 overflow-y-auto" data-astro-cid-uc2ui6qy></div> <div class="pt-4" data-astro-cid-uc2ui6qy> <button type="button" class="btn btn-outline w-full" id="back-to-step-3" data-astro-cid-uc2ui6qy>Back</button> </div> </form> </div> <!-- Step 5: Confirm details --> <div id="step-5" class="signup-step hidden" data-astro-cid-uc2ui6qy> <h3 class="text-xl font-semibold mb-4" data-astro-cid-uc2ui6qy>Please check the following details are correct:</h3> <div class="bg-base-200 rounded-lg p-4 space-y-3 mb-6" data-astro-cid-uc2ui6qy> <div data-astro-cid-uc2ui6qy> <p class="text-sm font-medium text-base-content/70" data-astro-cid-uc2ui6qy>Your name:</p> <p class="text-base font-semibold" id="confirm-name" data-astro-cid-uc2ui6qy></p> </div> <div data-astro-cid-uc2ui6qy> <p class="text-sm font-medium text-base-content/70" data-astro-cid-uc2ui6qy>Your email:</p> <p class="text-base font-semibold" id="confirm-email" data-astro-cid-uc2ui6qy></p> </div> <div data-astro-cid-uc2ui6qy> <p class="text-sm font-medium text-base-content/70" data-astro-cid-uc2ui6qy>Your team name:</p> <p class="text-base font-semibold" id="confirm-team" data-astro-cid-uc2ui6qy></p> </div> </div> <div class="flex gap-3" data-astro-cid-uc2ui6qy> <button type="button" class="btn btn-outline flex-1" id="back-to-step-4" data-astro-cid-uc2ui6qy>Back</button> <button type="button" class="btn btn-primary flex-1" id="confirm-signup" data-astro-cid-uc2ui6qy>Confirm Details</button> </div> </div> </div> </div> </div> <!-- Team Selector Modal - Matches Login/Signup Modal Structure --><div id="team-selector-modal" class="fixed inset-0 z-[9999] hidden items-center justify-center bg-black/50 backdrop-blur-sm"> <div class="card w-full max-w-2xl bg-base-100 shadow-2xl mx-4 max-h-[90vh] overflow-y-auto"> <div class="card-body"> <div class="flex items-start justify-between mb-4"> <h3 class="card-title text-2xl font-bold">Select Your Team</h3> <button id="close-team-selector-modal" class="btn btn-sm btn-circle btn-ghost" aria-label="Close"> <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path> </svg> </button> </div> <ul id="team-selector-content" class="menu bg-base-200 rounded-box w-full"> <!-- Team items will be dynamically inserted here --> </ul> </div> </div> </div> <script type="module">const l=window.blurManager;document.getElementById("close-team-selector-modal")?.addEventListener("click",()=>{const e=document.getElementById("team-selector-modal");e&&(e.classList.add("hidden"),e.classList.remove("flex"),l&&(l.clearAll(),console.log("Team selector closed - ALL blurs cleared")))});document.getElementById("team-selector-modal")?.addEventListener("click",e=>{const t=document.getElementById("team-selector-modal");e.target===t&&(t.classList.add("hidden"),t.classList.remove("flex"),l&&(l.clearAll(),console.log("Team selector closed via backdrop - ALL blurs cleared")))});</script> <!-- BlurObserver - automatic blur management (deferred to not block render) --> <script src="/scripts/blur-observer.js?v=1770725899218" defer></script> <!-- URL Helpers - must load before login.js and signup-modal.js --> <script src="/scripts/url-helpers.js?v=1770725899218" defer></script> <!-- localForage for IndexedDB storage (Angular app compatibility) --> <script src="https://cdnjs.cloudflare.com/ajax/libs/localforage/1.10.0/localforage.min.js" defer></script> <!-- Login and Signup Scripts --> <script src="/scripts/login.js?v=1770725899218" defer></script> <script src="/scripts/signup-modal.js?v=1770725899218" defer></script> <script src="/scripts/modal-handlers.js?v=1770725899218" defer></script> <script src="/scripts/signup-button-handlers.js?v=1770725899218" defer></script> <!-- Video lazy loading and viewport playback --> <script src="/scripts/video-lazy-load.js?v=1770725899218" defer></script> <script src="/scripts/video-hero-lazy-load.js?v=1770725899218" defer></script> <!-- Global contact-trigger handler for Crisp chat --> <script src="/scripts/contact-trigger.js" defer></script> </body> </html>