@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/Inter-400.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/Inter-500.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/Inter-600.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/Inter-700.woff2') format('woff2')}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/Poppins-600.woff2') format('woff2')}
@font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/Poppins-700.woff2') format('woff2')}
/* ---- Brand tokens (re-pickleball brand kit) ---- */
:root {
  --teal:#012126; --green:#01DB95; --white:#FFFFFF; --mint:#DDF8ED; --slate:#31575A;
  --lgray:#F4F7F7; --mgray:#31575A; --border:#DCE5E5;
  --bg:var(--white); --text:var(--teal); --muted:#31575A; --surface:var(--lgray); --soft:var(--mint);
  --panel:var(--teal); --panel-text:#FFFFFF; --panel-muted:#DCE5E5; --line:var(--border);
  --btn:var(--teal); --btn-text:#FFFFFF; --accent-ink:var(--teal);
  --mapbg:#F4F7F7; --street:#DCE5E5; --court:#FFFFFF; --court-line:#31575A;
  color-scheme: light;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}


html { scroll-padding-top:env(safe-area-inset-top,0px); -webkit-text-size-adjust:100%; }
*,*::before,*::after { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--text); font-family:Inter,'Segoe UI',system-ui,sans-serif; font-size:17px; line-height:1.65; }
img { max-width:100%; display:block; }
a { color:inherit; }
.wrap { max-width:1120px; margin:0 auto; padding:0 24px; }
.narrow { max-width:720px; }
h1,h2,h3 { line-height:1.15; margin:0; letter-spacing:-0.01em; }
h1 { font-size:clamp(2.1rem, 5.2vw, 3.6rem); font-weight:700; }
h2 { font-size:clamp(1.6rem, 3.4vw, 2.4rem); font-weight:700; }
h3 { font-size:1.15rem; font-weight:700; }
p { margin:0 0 1em; }
.muted { color:var(--muted); }
.btn { display:inline-flex; align-items:center; justify-content:center; min-height:52px; padding:14px 28px; border-radius:10px; background:var(--btn); color:var(--btn-text); font-weight:700; text-decoration:none; font-size:1.02rem; transition:transform .15s ease; }
.btn:hover { transform:translateY(-1px); }
.btn-green { background:var(--green); color:#012126; }
:focus-visible { outline:3px solid var(--green); outline-offset:3px; }

/* header */
header.top { padding:22px 0; }
header.top .wrap { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.logo img { height:17px; width:auto; }



.toplink { font-weight:600; font-size:.95rem; text-decoration:none; border-bottom:2px solid var(--green); padding-bottom:2px; }

/* hero */
.hero { padding:28px 0 72px; }
.hero .wrap { display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center; }
.hero .lede { font-size:1.15rem; color:var(--muted); max-width:34em; margin:22px 0 30px; }
.buyline { display:flex; flex-wrap:wrap; align-items:center; gap:14px 20px; }
.buyline small { color:var(--muted); font-size:.9rem; }
.map { width:100%; max-width:520px; justify-self:end; }
.map svg { width:100%; height:auto; }
.mapbg { fill:var(--mapbg); }
.st { stroke:var(--street); stroke-width:16; }
.ct { fill:var(--court); stroke:var(--court-line); stroke-width:2; }
.net { stroke:var(--court-line); stroke-width:2; }
.yc { fill:var(--green); stroke:#012126; stroke-width:4; }
.ynet { stroke:#012126; stroke-width:3; }
.pinbg { fill:#012126; }
.pint { fill:#FFFFFF; font:600 15px Poppins,Inter,sans-serif; }
.nc { opacity:0; transform-box:fill-box; transform-origin:center; animation:pop .45s cubic-bezier(.3,1.4,.6,1) forwards; }
@keyframes pop { from { opacity:0; transform:scale(.6); } to { opacity:1; transform:scale(1); } }
.mapcap { font-size:.9rem; color:var(--muted); text-align:center; margin-top:10px; }
@media (prefers-reduced-motion: reduce) { .nc { animation:none; opacity:1; } .btn { transition:none; } }

/* section rhythm */
section { padding:84px 0; }
.band { background:var(--surface); }
.soft { background:var(--soft); }

/* signals */
.signals-head { max-width:760px; }
.signals-head p { font-size:1.15rem; }
.timeline { list-style:none; margin:44px 0 0; padding:0; display:grid; grid-template-columns:repeat(3,1fr); gap:28px; border-top:2px solid var(--text); }
.timeline li { padding-top:20px; }
.when { font-weight:700; font-size:.95rem; color:var(--muted); display:block; margin-bottom:6px; }
.timeline .big { font-size:1.55rem; font-weight:700; line-height:1.2; display:block; margin-bottom:8px; }
.timeline p { font-size:.98rem; margin:0; }
.src { font-size:.82rem; color:var(--muted); display:block; margin-top:10px; }

/* statement */
.statement { text-align:left; }
.statement .line { font-size:clamp(1.9rem, 4.6vw, 3.2rem); font-weight:700; line-height:1.12; max-width:15em; }
.cols { display:grid; grid-template-columns:1fr 1fr; gap:48px; margin-top:44px; }
.cols h3 { margin-bottom:10px; }
.reason { list-style:none; padding:0; margin:14px 0 0; }
.reason li { padding:12px 0 12px 34px; border-bottom:1px solid var(--line); position:relative; }
.reason li::before { content:""; position:absolute; left:4px; top:22px; width:14px; height:14px; border-radius:50%; background:var(--green); box-shadow:0 0 0 3px var(--soft); }

/* honesty panel */
.panel { background:var(--panel); color:var(--panel-text); border-radius:28px; padding:56px; display:grid; grid-template-columns:1fr 1fr; gap:48px; }
.panel p { color:var(--panel-muted); }
.panel h2 { color:var(--panel-text); }
.panel .tip { background:rgba(1,219,149,.12); border:1px solid rgba(1,219,149,.45); border-radius:18px; padding:24px 26px; color:var(--panel-text); }
.panel .tip strong { color:var(--green); display:block; margin-bottom:6px; }
.panel .tip p { color:var(--panel-text); margin:0; }

/* inside */
.inside-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:56px; margin-top:40px; align-items:start; }
.counts { list-style:none; padding:0; margin:0; }
.counts li { display:grid; grid-template-columns:76px 1fr; gap:16px; padding:18px 0; border-bottom:1px solid var(--line); }
.counts .n { font-size:2.4rem; font-weight:700; line-height:1; color:var(--text); }
.counts .n.word { font-size:1.25rem; padding-top:6px; }
.counts b { display:block; }
.counts span { color:var(--muted); font-size:.95rem; }
.map-goals { background:var(--bg); border:1px solid var(--line); border-radius:22px; padding:28px; }
.map-goals > p { margin-bottom:6px; }
.goalrow { display:grid; grid-template-columns:200px 1fr; gap:14px; padding:14px 0; border-top:1px solid var(--line); }
.goal { font-weight:600; margin:0; font-size:.95rem; }
.tlist { list-style:none; padding:0; margin:0; display:flex; flex-wrap:wrap; gap:8px; }
.tlist li { background:var(--soft); border-radius:999px; padding:4px 12px; font-size:.88rem; font-weight:500; }

/* samples */
.samples { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:40px; }
.samples figure { margin:0; }
.samples img { border-radius:10px; border:1px solid var(--line); box-shadow:0 18px 40px -24px rgba(1,33,38,.45); background:#fff; }
.samples figcaption { font-size:.92rem; color:var(--muted); margin-top:12px; }

/* 7 days */
.days { list-style:none; padding:0; margin:40px 0 0; display:grid; grid-template-columns:repeat(7,1fr); gap:12px; counter-reset:d; }
.days li { counter-increment:d; background:var(--bg); border:1px solid var(--line); border-radius:18px; padding:18px 16px; font-size:.95rem; line-height:1.45; }
.days li::before { content:"Day " counter(d); display:block; font-weight:700; font-size:.85rem; color:var(--muted); margin-bottom:8px; }
.days li:last-child { background:var(--panel); color:var(--panel-text); border-color:var(--panel); }
.days li:last-child::before { color:var(--green); }

/* fit */
.fit { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:36px; }
.fit div { border-radius:22px; padding:30px; border:1px solid var(--line); }
.fit .yes { background:var(--soft); border-color:transparent; }
.fit h3 { margin-bottom:10px; }
.fit p { margin:0; }

/* buy */
.buy { display:grid; grid-template-columns:.8fr 1.2fr; gap:56px; align-items:center; }
.cover { max-width:340px; border-radius:8px; box-shadow:0 30px 60px -30px rgba(1,33,38,.6); border:1px solid var(--line); }
.price { font-size:3rem; font-weight:700; line-height:1; margin:18px 0 6px; }
.terms { list-style:none; padding:0; margin:22px 0 28px; }
.terms li { padding:6px 0 6px 30px; position:relative; }
.terms li::before { content:""; position:absolute; left:2px; top:13px; width:16px; height:9px; border-left:3px solid var(--green); border-bottom:3px solid var(--green); transform:rotate(-45deg); }
.placeholder { background:#FFF4C2; color:#5A4500; border-radius:6px; padding:0 6px; font-weight:600; }

/* faq */
details { border-bottom:1px solid var(--line); padding:4px 0; }
summary { cursor:pointer; list-style:none; font-weight:600; padding:18px 40px 18px 0; position:relative; min-height:44px; }
summary::-webkit-details-marker { display:none; }
summary::after { content:""; position:absolute; right:8px; top:26px; width:10px; height:10px; border-right:2.5px solid var(--text); border-bottom:2.5px solid var(--text); transform:rotate(45deg); transition:transform .2s; }
details[open] summary::after { transform:rotate(-135deg); top:31px; }
details p { color:var(--muted); padding-right:30px; }

/* close */
.close { text-align:center; padding:96px 0; }
.close .line { font-size:clamp(1.7rem, 4vw, 2.7rem); font-weight:700; line-height:1.2; max-width:22em; margin:0 auto 32px; }
footer { border-top:1px solid var(--line); padding:40px 0 56px; font-size:.85rem; color:var(--muted); }
footer ol { padding-left:18px; margin:10px 0 0; }
footer li { margin-bottom:4px; }

@media (max-width: 960px) {
  .hero .wrap, .inside-grid, .buy, .panel, .cols { grid-template-columns:1fr; }
  .map { justify-self:center; max-width:440px; }
  .days { grid-template-columns:repeat(2,1fr); }
  .timeline { grid-template-columns:1fr; gap:0; }
  .timeline li { padding:20px 0; border-bottom:1px solid var(--line); }
  .panel { padding:36px 26px; }
}
@media (max-width: 640px) {
  body { font-size:16px; }
  section { padding:60px 0; }
  .samples { grid-template-columns:1fr; max-width:400px; }
  .fit { grid-template-columns:1fr; }
  .goalrow { grid-template-columns:1fr; gap:8px; }
  .days { grid-template-columns:1fr; }
  .buy .cover { max-width:240px; }
}

/* re-pickleball brand: Poppins headings, Inter body, Deep Teal banner and footer. */
h1,h2,h3,.statement .line,.close .line,.timeline .big,.counts .n,.price{font-family:Poppins,Inter,'Segoe UI',sans-serif;letter-spacing:-.035em}
header.top{background:var(--teal)}
header.top .logo img{height:27px}
header.top .toplink{color:#fff}
footer{background:var(--teal);color:#DCE5E5;border-top:0}
.u1{margin:0}
.u2{animation-delay:0.35s}
.u3{animation-delay:0.55s}
.u4{animation-delay:0.75s}
.u5{animation-delay:0.95s}
.u6{animation-delay:1.15s}
.u7{animation-delay:1.35s}
.u8{animation-delay:1.55s}
.u9{animation-delay:1.75s}
.u10{animation-delay:1.95s}
.u11{animation-delay:2.15s}
.u12{animation-delay:2.35s}
.u13{animation-delay:2.55s}
.u14{animation-delay:2.75s}
.u15{animation-delay:2.95s}
.u16{animation-delay:3.15s}
.u17{animation-delay:3.35s}
.u18{animation-delay:3.55s}
.u19{animation-delay:3.75s}
.u20{margin-top:18px}
.u21{padding-top:0}
.u22{align-self:center}
.u23{max-width:40em;margin-top:14px}
.u24{font-size:.92rem;margin-bottom:14px}
.u25{max-width:46em;margin-top:32px}
.u26{margin-top:8px}
.u27{font-size:.88rem;margin-top:14px}
.u28{margin-bottom:18px}
