:root { --ink:#12241f; --forest:#183d34; --lime:#d9ff54; --coral:#ff715b; --mist:#f1f5ef; --paper:#fbfcf8; --line:#d5ddd4; --muted:#5f6b64; --mono:'DM Mono',monospace; --sans:'Manrope',sans-serif; --radius:8px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:var(--sans); line-height:1.5; }
a { color:inherit; text-decoration:none; }
.layout { width:min(100% - 48px, 1216px); margin-inline:auto; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.site-header { align-items:center; display:flex; justify-content:space-between; left:0; padding:22px max(24px, calc((100vw - 1216px)/2)); position:absolute; right:0; top:0; z-index:3; }
.brand { align-items:center; display:inline-flex; font-weight:800; } .brand-logo { display:block; height:auto; width:118px; }
.brand-mark { color:#fff; font-family:var(--mono); font-size:1.32rem; letter-spacing:-.08em; line-height:1; }
.brand-mark span { color:var(--lime); }
.brand-name { color:#fff; font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; }
.main-nav { align-items:center; color:#fff; display:flex; gap:30px; font-size:.86rem; font-weight:600; }
.main-nav a { opacity:.85; transition:opacity 160ms ease; }
.main-nav a:hover,.main-nav a:focus-visible { opacity:1; }
.main-nav .nav-cta { border:1px solid rgba(255,255,255,.55); border-radius:100px; opacity:1; padding:9px 14px; }
.menu-toggle { display:none; }
.hero { color:#fff; isolation:isolate; min-height:720px; position:relative; display:grid; align-items:end; overflow:hidden; }
.hero-image,.hero-overlay { inset:0; position:absolute; z-index:-2; }
.hero-image { background:center/cover url('assets/padel-hero.png'); }
.hero-overlay { background:linear-gradient(90deg,rgba(8,29,23,.86) 0%,rgba(8,29,23,.5) 47%,rgba(8,29,23,.08) 100%); z-index:-1; }
.hero-content { padding-block:205px 112px; }
.eyebrow { color:var(--forest); font-family:var(--mono); font-size:.67rem; font-weight:500; letter-spacing:.1em; margin:0 0 18px; text-transform:uppercase; }
.eyebrow.light { color:var(--lime); }
h1,h2,h3,p { margin-top:0; }
h1 { font-size:clamp(3.2rem,8vw,7rem); letter-spacing:0; line-height:.94; margin-bottom:28px; max-width:800px; }
.hero-copy { font-size:1.06rem; line-height:1.65; max-width:450px; margin-bottom:31px; }
.button { align-items:center; border-radius:100px; display:inline-flex; font-size:.84rem; font-weight:800; gap:14px; justify-content:center; min-height:48px; padding:0 19px; transition:transform 180ms ease, background-color 180ms ease; }
.button:hover { transform:translateY(-2px); }.button:focus-visible,a:focus-visible,summary:focus-visible,button:focus-visible { outline:3px solid var(--lime); outline-offset:4px; }
.button-light { background:#fff; color:var(--ink); }.button-light:hover { background:var(--lime); }
.hero-footer { align-items:center; border-top:1px solid rgba(255,255,255,.25); display:flex; font-family:var(--mono); font-size:.65rem; justify-content:space-between; letter-spacing:.06em; padding-block:19px; text-transform:uppercase; }
.apps-section { padding-block:128px; }.section-heading { align-items:end; display:grid; gap:40px; grid-template-columns:1.15fr .85fr; margin-bottom:58px; }.section-heading h2,.support-banner h2,.support-intro h1 { font-size:clamp(2.3rem,4.8vw,4.5rem); letter-spacing:0; line-height:1.04; margin-bottom:0; }.section-heading > p { color:var(--muted); font-size:1rem; line-height:1.7; margin:0; max-width:410px; }
.app-grid { display:grid; gap:16px; grid-template-columns:repeat(3,minmax(0,1fr)); }.app-card { display:flex; flex-direction:column; min-height:520px; overflow:hidden; padding:22px; position:relative; }.app-card-top { display:flex; font-family:var(--mono); font-size:.63rem; justify-content:space-between; letter-spacing:.06em; text-transform:uppercase; }.app-index { opacity:.55; }.app-tag { border:1px solid currentColor; border-radius:100px; padding:5px 8px; }.app-card h3 { font-size:clamp(2rem,3.3vw,3rem); letter-spacing:0; line-height:1; margin:15px 0 12px; }.app-card p { font-size:.9rem; line-height:1.5; margin:0; max-width:230px; }.app-card a { align-items:center; display:flex; font-size:.83rem; font-weight:800; gap:8px; justify-content:space-between; margin-top:auto; padding-top:30px; }.app-card a span { font-size:1.2rem; }.club-card { background:var(--forest); color:#fff; }.sole-card { background:var(--lime); color:var(--ink); }.playoffs-card { background:var(--coral); color:#fff; }
.app-symbol { height:120px; margin-top:68px; position:relative; width:120px; }.app-logo { border-radius:var(--radius); overflow:hidden; }.app-logo img { display:block; height:100%; object-fit:cover; width:100%; }.app-symbol i { display:block; position:absolute; }.symbol-club { border:2px solid var(--lime); border-radius:50%; transform:rotate(-17deg); }.symbol-club i { background:var(--lime); border-radius:50%; height:12px; width:12px; }.symbol-club i:nth-child(1){left:21px;top:23px}.symbol-club i:nth-child(2){right:24px;top:47px}.symbol-club i:nth-child(3){bottom:22px;left:39px}.symbol-sole { transform:rotate(35deg); }.symbol-sole:before,.symbol-sole:after { background:var(--ink); content:''; position:absolute; }.symbol-sole:before { height:2px; inset:59px 0; }.symbol-sole:after { inset:0 59px; width:2px; }.symbol-sole i { background:var(--coral); border-radius:50%; height:24px; width:24px; }.symbol-sole i:nth-child(1){left:0;top:47px}.symbol-sole i:nth-child(2){top:0;left:47px}.symbol-sole i:nth-child(3){right:0;top:47px}.symbol-sole i:nth-child(4){bottom:0;left:47px}.symbol-playoffs { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; transform:rotate(-12deg); }.symbol-playoffs i { background:#fff; border-radius:50%; height:19px; position:static; width:19px; }.symbol-playoffs i:nth-child(2),.symbol-playoffs i:nth-child(5){background:var(--ink);}.symbol-playoffs i:nth-child(3){background:transparent}.symbol-playoffs i:nth-child(4){grid-column:2}.symbol-playoffs i:nth-child(6){grid-column:2;background:var(--lime);}
.support-banner { background:var(--forest); color:#fff; padding-block:106px; }.support-layout { align-items:end; display:grid; gap:54px; grid-template-columns:1fr .75fr; }.support-actions p { color:rgba(255,255,255,.72); line-height:1.7; max-width:380px; }.button-accent { background:var(--lime); color:var(--ink); margin-top:16px; }.button-accent:hover { background:#fff; }
.site-footer { align-items:center; display:grid; gap:18px; grid-template-columns:1.3fr 1fr 1fr auto; padding-block:32px; }.site-footer .brand-logo { width:132px; } .site-footer .brand-mark,.site-footer .brand-name { color:var(--ink); }.site-footer .brand-mark span { color:var(--coral); }.site-footer p,.site-footer a,.site-footer > span { color:var(--muted); font-size:.71rem; margin:0; }.site-footer a:hover { color:var(--ink); }
.support-page { background:var(--mist); }.support-header { position:relative; }.dark-brand .brand-mark,.dark-brand .brand-name { color:var(--ink); }.dark-brand .brand-mark span { color:var(--coral); }.back-link { align-items:center; display:inline-flex; font-size:.82rem; font-weight:800; gap:9px; }.support-main { min-height:calc(100vh - 146px); padding-block:112px 90px; }.support-intro { border-bottom:1px solid var(--line); padding-bottom:60px; }.support-intro h1 { max-width:900px; }.support-intro > p:last-child { color:var(--muted); font-size:1.03rem; line-height:1.7; margin:24px 0 0; max-width:520px; }.support-grid { display:grid; gap:16px; grid-template-columns:1.45fr .7fr; padding-top:28px; }.topics-panel { background:var(--paper); padding:34px; }.topics-panel h2,.contact-panel h2 { font-size:1.35rem; letter-spacing:0; margin-bottom:28px; }.topic-list { border-top:1px solid var(--line); }.topic-item { border-bottom:1px solid var(--line); }.topic-item summary { align-items:center; cursor:pointer; display:grid; font-size:.92rem; font-weight:800; gap:18px; grid-template-columns:30px 1fr 20px; list-style:none; padding:21px 0; }.topic-item summary::-webkit-details-marker { display:none; }.topic-item summary span { color:var(--muted); font-family:var(--mono); font-size:.67rem; }.topic-item summary b { font-size:1.25rem; font-weight:400; transition:transform 180ms ease; }.topic-item[open] summary b { transform:rotate(45deg); }.topic-item p { color:var(--muted); font-size:.86rem; line-height:1.6; margin:0; padding:0 0 20px 48px; }.contact-panel { background:var(--coral); color:#fff; padding:34px; }.contact-panel .eyebrow { color:#fff; opacity:.76; }.contact-panel p:not(.eyebrow) { font-size:.9rem; line-height:1.7; }.button-dark { background:var(--ink); color:#fff; margin-top:15px; }.button-dark:hover { background:#fff; color:var(--ink); }.compact-footer { border-top:1px solid var(--line); grid-template-columns:1fr auto; }
@media (max-width:720px) { .brand-logo { width:100px; } .site-footer .brand-logo { width:112px; } .layout { width:min(100% - 40px, 1216px); }.site-header { padding:18px 20px; }.brand-name { font-size:.62rem; }.main-nav { background:var(--ink); display:none; flex-direction:column; gap:22px; left:16px; padding:22px; position:absolute; right:16px; text-align:center; top:66px; }.main-nav.is-open { display:flex; }.menu-toggle { background:transparent; border:0; display:grid; gap:5px; padding:10px 0 10px 10px; }.menu-toggle span:not(.sr-only) { background:#fff; display:block; height:1px; width:22px; }.support-header .menu-toggle span:not(.sr-only) { background:var(--ink); }.hero { min-height:660px; }.hero-image { background-position:62% center; }.hero-overlay { background:linear-gradient(90deg,rgba(8,29,23,.86),rgba(8,29,23,.24)); }.hero-content { padding-block:195px 96px; }.hero-copy { font-size:.98rem; }.hero-footer { font-size:.57rem; }.section-heading,.support-layout,.support-grid { grid-template-columns:1fr; }.apps-section { padding-block:78px; }.section-heading { gap:22px; margin-bottom:38px; }.app-grid { grid-template-columns:1fr; }.app-card { min-height:390px; }.app-symbol { height:84px; margin-top:34px; transform:scale(.72); transform-origin:left top; }.symbol-sole { transform:rotate(35deg) scale(.72); }.symbol-playoffs { transform:rotate(-12deg) scale(.72); }.support-banner { padding-block:74px; }.support-layout { gap:28px; }.site-footer { grid-template-columns:1fr; padding-block:28px; }.support-main { padding-block:80px 60px; }.support-intro { padding-bottom:42px; }.topics-panel,.contact-panel { padding:25px; }.compact-footer { grid-template-columns:1fr; }.topic-item p { padding-left:0; } }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { scroll-behavior:auto !important; transition-duration:.01ms !important; animation-duration:.01ms !important; } }