/* ============================================================
   Basketball Free Throw Tracker — landing page
   Layers on top of v2-editorial.css (data-accent="amber").
   ============================================================ */

/* Hero watercolor art — mobile-safe (see baseball-swing-counter.css note):
   no base drop-shadow filter (iOS won't paint large filtered PNGs), shadow
   desktop-only, height-capped on mobile so it can't overflow the fold. */
.bft-hero-art{margin:0}
.bft-hero-art img{display:block;width:100%;max-width:520px;height:auto;margin:0 auto}
@media(min-width:781px){
    .bft-hero-art img{filter:drop-shadow(0 14px 30px rgba(245,158,11,.18))}
}
@media(max-width:780px){
    .bft-hero-art img{max-width:400px;max-height:54vh;width:auto}
}

.bft-steps{max-width:1240px;margin:0 auto;padding:0 1.5rem;display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
.bft-step{display:flex;gap:1rem;align-items:flex-start;padding:1.5rem;border:1px solid var(--rule);border-radius:14px;background:var(--paper)}
.bft-step-n{flex:0 0 auto;font-size:2rem;font-weight:800;font-style:italic;line-height:1;color:var(--accent-deep)}
.bft-step h3{font-size:1.125rem;font-weight:800;letter-spacing:-.01em;margin:.1rem 0 .35rem;color:var(--ink)}
.bft-step p{font-size:.9rem;line-height:1.5;color:var(--muted);margin:0}

@media(min-width:781px){.bft-features{grid-template-columns:repeat(3,1fr)}}
@media(min-width:521px) and (max-width:780px){.bft-features{grid-template-columns:repeat(2,1fr)}}

.bft-features .bft-pro{position:relative}
.bft-features .bft-pro::after{content:"PRO";position:absolute;top:.9rem;right:.9rem;font-family:'JetBrains Mono',monospace;font-size:.5625rem;font-weight:700;letter-spacing:.14em;color:#fff;background:var(--accent-deep);padding:.2rem .4rem;border-radius:5px}

@media(max-width:780px){.bft-steps{grid-template-columns:1fr;gap:1rem}}
@media(max-width:640px){.bft-steps{padding:0 1rem}}