:root {
            /* Brand Colors */
            --c-blue-primary: #56A9E2; /* Carolina */
            --c-blue-bright: #73C8FF;
            --c-blue-deep: #2F86C7;
            --c-blue-pale: #EAF7FF;
            --c-blue-ice: #F5FBFF;
            
            --c-neon-primary: #B8FF18; /* Tennis Green */
            --c-neon-bright: #9DFF00;
            --c-neon-soft: #E8FFC0;
            --c-neon-dark: #497D00;
            
            --c-charcoal-deep: #101820;
            --c-charcoal-soft: #29333C;
            --c-gray-light: #EDF1F4;
            --c-white: #FFFFFF;
            --c-yellow-accent: #EEFF46;

            /* Typography */
            --font-head: 'Archivo', sans-serif;
            --font-body: 'Inter', sans-serif;

            /* Layout */
            --max-w: 1400px;
            --section-pad: clamp(4rem, 8vw, 10rem);
            --container-pad: clamp(1.5rem, 4vw, 3rem);
        }

        /* Reduced Motion */
        @media (prefers-reduced-motion: reduce) {
            * {
                animation-duration: 0.01ms !important;
                animation-iteration-count: 1 !important;
                transition-duration: 0.01ms !important;
                scroll-behavior: auto !important;
            }
        }

        /* Reset & Base */
        * {
            box-sizing: border-box;
            margin: 0;
            padding: 0;
        }

        body {
            font-family: var(--font-body);
            background-color: var(--c-white);
            color: var(--c-charcoal-deep);
            line-height: 1.6;
            overflow-x: hidden;
            background-image: radial-gradient(circle at top right, var(--c-blue-ice), var(--c-white) 40%);
        }

        h1, h2, h3, h4, h5, h6, .font-head {
            font-family: var(--font-head);
            line-height: 1.1;
            text-transform: uppercase;
            font-weight: 800;
        }

        img {
            max-width: 100%;
            display: block;
            object-fit: cover;
        }

        a {
            text-decoration: none;
            color: inherit;
        }

        ul {
            list-style: none;
        }

        /* Custom Cursor */
        .cursor-dot {
            position: fixed;
            top: 0;
            left: 0;
            width: 12px;
            height: 12px;
            background-color: var(--c-neon-primary);
            border-radius: 50%;
            pointer-events: none;
            z-index: 9999;
            transform: translate(-50%, -50%);
            mix-blend-mode: difference;
            transition: width 0.2s, height 0.2s, background-color 0.2s;
            display: none; /* Enabled via JS on non-touch */
        }

        .cursor-dot.hovering {
            width: 40px;
            height: 40px;
            background-color: var(--c-blue-bright);
            mix-blend-mode: normal;
            opacity: 0.5;
        }

        /* Utilities */
        .container {
            max-width: var(--max-w);
            margin: 0 auto;
            padding: 0 var(--container-pad);
        }

        .text-stroke {
            -webkit-text-stroke: 1px var(--c-charcoal-deep);
            color: transparent;
        }
        
        .text-stroke-blue {
            -webkit-text-stroke: 1px var(--c-blue-primary);
            color: transparent;
        }

        .text-neon { color: var(--c-neon-primary); }
        .text-blue { color: var(--c-blue-primary); }
        .bg-blue { background-color: var(--c-blue-primary); }
        .bg-charcoal { background-color: var(--c-charcoal-deep); color: var(--c-white); }

        .eyebrow {
            font-family: var(--font-body);
            font-weight: 700;
            font-size: 0.875rem;
            letter-spacing: 0.1em;
            text-transform: uppercase;
            color: var(--c-blue-deep);
            display: flex;
            align-items: center;
            gap: 1rem;
            margin-bottom: 1rem;
        }
        
        .eyebrow::before {
            content: '';
            display: block;
            width: 24px;
            height: 2px;
            background-color: var(--c-neon-primary);
        }

        .eyebrow.light { color: var(--c-blue-bright); }

        /* Buttons */
        .btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: 1rem 2rem;
            font-family: var(--font-head);
            font-weight: 700;
            font-size: 1rem;
            letter-spacing: 0.05em;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            position: relative;
            overflow: hidden;
            cursor: pointer;
            border: none;
        }

        .btn-primary {
            background-color: var(--c-charcoal-deep);
            color: var(--c-white);
        }

        .btn-primary::after {
            content: '';
            position: absolute;
            top: 0; left: -100%;
            width: 100%; height: 100%;
            background-color: var(--c-neon-primary);
            transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            z-index: 1;
        }
        
        .btn-primary span {
            position: relative;
            z-index: 2;
            transition: color 0.3s;
        }

        .btn-primary:hover::after {
            transform: translateX(100%);
        }
        .btn-primary:hover span {
            color: var(--c-charcoal-deep);
        }

        .btn-neon {
            background-color: var(--c-neon-primary);
            color: var(--c-charcoal-deep);
        }
        .btn-neon:hover {
            background-color: var(--c-neon-bright);
            box-shadow: 0 0 20px rgba(184, 255, 24, 0.4);
        }

        .btn-outline {
            border: 2px solid var(--c-charcoal-deep);
            color: var(--c-charcoal-deep);
            background: transparent;
        }
        .btn-outline:hover {
            background: var(--c-charcoal-deep);
            color: var(--c-white);
        }
        .btn-outline.light {
            border-color: var(--c-white);
            color: var(--c-white);
        }
        .btn-outline.light:hover {
            background: var(--c-white);
            color: var(--c-charcoal-deep);
        }

        /* Animations (Scroll Reveal) */
        .reveal {
            opacity: 0;
            transform: translateY(30px);
            transition: all 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);
        }
        .reveal-left {
            opacity: 0;
            transform: translateX(-40px);
            transition: all 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);
        }
        .reveal.is-visible, .reveal-left.is-visible {
            opacity: 1;
            transform: translate(0);
        }
        .d-100 { transition-delay: 100ms; }
        .d-200 { transition-delay: 200ms; }
        .d-300 { transition-delay: 300ms; }

        /* Header — see assets/css/nav.css (single source of truth for the
           global navigation, loaded after this file on every page). */

        /* Hero Section */
        .hero {
            position: relative;
            min-height: 100vh;
            padding-top: 120px;
            display: flex;
            align-items: center;
            overflow: hidden;
            background: linear-gradient(135deg, var(--c-white) 0%, var(--c-blue-ice) 100%);
        }

        .hero-grid {
            display: grid;
            grid-template-columns: 1.2fr 1fr;
            gap: 4rem;
            position: relative;
            z-index: 10;
        }

        .hero-content {
            padding-bottom: 4rem;
        }

        .hero h1 {
            font-size: clamp(3rem, 7vw, 6rem);
            letter-spacing: -0.02em;
            margin-bottom: 1.5rem;
            line-height: 0.95;
            position: relative;
        }

        .hero h1 .stroke {
            display: block;
            color: transparent;
            -webkit-text-stroke: 2px var(--c-charcoal-deep);
            margin-left: 10%;
        }

        .hero-sub {
            font-size: clamp(1.125rem, 2vw, 1.5rem);
            font-weight: 500;
            color: var(--c-charcoal-soft);
            max-width: 600px;
            margin-bottom: 1rem;
        }
        
        .hero-desc {
            font-size: 1rem;
            color: var(--c-charcoal-soft);
            max-width: 500px;
            margin-bottom: 2.5rem;
        }

        .hero-actions {
            display: flex;
            gap: 1rem;
            align-items: center;
            flex-wrap: wrap;
        }

        /* Hero Visuals */
        .hero-visual {
            position: relative;
            height: 100%;
            min-height: 500px;
        }

        .hero-img-wrap {
            position: absolute;
            top: 10%;
            right: 0;
            width: 90%;
            height: 80%;
            border-radius: 20px;
            overflow: hidden;
            box-shadow: 0 30px 60px rgba(86, 169, 226, 0.2);
            transform: rotate(2deg);
            transition: transform 0.5s;
        }
        
        .hero-img-wrap:hover {
            transform: rotate(0deg) scale(1.02);
        }

        .hero-img-wrap img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            /* No filter: the hero photograph is shown in its original natural color. */
        }

        /* Abstract Background Elements */
        .bg-vector {
            position: absolute;
            z-index: 1;
            pointer-events: none;
        }
        
        .vector-1 {
            top: -10%; right: -5%;
            width: 60%; height: auto;
            opacity: 0.05;
        }

        /* Hero Animation Path */
        .hero-path-svg {
            position: absolute;
            top: 20%;
            left: 0;
            width: 100%;
            height: 100%;
            pointer-events: none;
            z-index: 5;
            overflow: visible;
        }

        .animated-path {
            fill: none;
            stroke: var(--c-neon-primary);
            stroke-width: 4;
            stroke-linecap: round;
            stroke-dasharray: 1000;
            stroke-dashoffset: 1000;
            animation: drawPath 3s cubic-bezier(0.4, 0, 0.2, 1) forwards;
            animation-delay: 0.5s;
        }

        .animated-ball {
            fill: var(--c-yellow-accent);
            opacity: 0;
            animation: moveBall 3s cubic-bezier(0.4, 0, 0.2, 1) forwards;
            animation-delay: 0.5s;
        }

        @keyframes drawPath {
            to { stroke-dashoffset: 0; }
        }

        @keyframes moveBall {
            0% { opacity: 1; offset-distance: 0%; }
            100% { opacity: 1; offset-distance: 100%; }
        }

        /* The old .level-indicator strip was replaced by the hero player
           progression track, which lives with the homepage in index.html. */

        @media (max-width: 900px) {
            .hero-grid { grid-template-columns: 1fr; }
            .hero-visual { display: none; } /* Simplified for mobile */
            .hero h1 .stroke { margin-left: 0; }
        }

        /* Story Section - Progression */
        .story-section {
            padding: var(--section-pad) 0;
            background-color: var(--c-charcoal-deep);
            color: var(--c-white);
            position: relative;
        }

        .story-header {
            text-align: center;
            margin-bottom: 5rem;
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .story-header h2 {
            font-size: clamp(2.5rem, 5vw, 4rem);
        }

        .progression-container {
            display: flex;
            position: relative;
        }

        /* Left side - Sticky Court Graphic */
        .progression-visual {
            width: 40%;
            position: sticky;
            top: 20vh;
            height: 60vh;
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .court-graphic {
            width: 100%;
            max-width: 300px;
            height: 100%;
            border: 2px solid rgba(255,255,255,0.1);
            position: relative;
        }
        
        .court-graphic::before {
            content: '';
            position: absolute;
            top: 50%; left: 0; width: 100%; height: 2px;
            background: rgba(255,255,255,0.1); /* Service line */
        }
        .court-graphic::after {
            content: '';
            position: absolute;
            top: 0; left: 50%; width: 2px; height: 100%;
            background: rgba(255,255,255,0.1); /* Center mark */
        }

        .neon-ball {
            position: absolute;
            width: 16px; height: 16px;
            background-color: var(--c-neon-primary);
            border-radius: 50%;
            box-shadow: 0 0 15px var(--c-neon-primary);
            transition: top 0.5s ease, left 0.5s ease;
            top: 10%; left: 10%;
        }

        /* Right side - Scrolling Content */
        .progression-content {
            width: 60%;
            padding-left: 4rem;
        }

        .stage-item {
            min-height: 50vh;
            display: flex;
            flex-direction: column;
            justify-content: center;
            opacity: 0.3;
            transition: opacity 0.4s, transform 0.4s;
            transform: translateX(20px);
        }

        .stage-item.active {
            opacity: 1;
            transform: translateX(0);
        }

        .stage-num {
            font-family: var(--font-head);
            font-size: 1.5rem;
            color: var(--c-neon-primary);
            margin-bottom: 1rem;
        }
        
        .stage-title {
            font-size: 2.5rem;
            margin-bottom: 1rem;
        }

        .stage-topics {
            display: flex;
            gap: 1rem;
            flex-wrap: wrap;
            margin-top: 1.5rem;
        }
        
        .topic-pill {
            padding: 0.5rem 1rem;
            border: 1px solid rgba(255,255,255,0.2);
            border-radius: 50px;
            font-size: 0.875rem;
            font-weight: 500;
        }

        @media (max-width: 768px) {
            .progression-container { flex-direction: column; }
            .progression-visual { display: none; }
            .progression-content { width: 100%; padding-left: 0; }
            .stage-item { min-height: auto; margin-bottom: 4rem; opacity: 1; transform: none; }
        }

        /* Service Sections Shared */
        .service-section {
            padding: var(--section-pad) 0;
            position: relative;
            overflow: hidden;
        }

        .service-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 4rem;
            align-items: center;
        }

        .service-grid.reverse {
            direction: rtl;
        }
        .service-grid.reverse > * {
            direction: ltr;
        }

        .service-content h2 {
            font-size: clamp(2.5rem, 4vw, 3.5rem);
            margin-bottom: 1.5rem;
        }

        .pricing-block {
            margin: 2rem 0;
            padding: 1.5rem;
            background: var(--c-gray-light);
            border-left: 4px solid var(--c-blue-primary);
        }

        .price-row {
            display: flex;
            justify-content: space-between;
            margin-bottom: 0.5rem;
            font-family: var(--font-head);
            font-weight: 700;
        }
        .price-row:last-child { margin-bottom: 0; }
        .price-amount { color: var(--c-blue-deep); font-size: 1.25rem; }

        .service-visual {
            position: relative;
            aspect-ratio: 4/5;
        }

        .service-img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            border-radius: 12px;
        }

        .vector-overlay {
            position: absolute;
            top: 0; left: 0; width: 100%; height: 100%;
            pointer-events: none;
            z-index: 2;
        }
        
        /* Specific Service Details */
        #tennis .service-grid {
            padding-right: 2rem;
        }
        #tennis .vector-overlay path {
            stroke: var(--c-neon-primary);
            stroke-dasharray: 500;
            stroke-dashoffset: 500;
            transition: stroke-dashoffset 1s ease;
        }
        #tennis.is-visible .vector-overlay path {
            stroke-dashoffset: 0;
        }

        #pickleball {
            background-color: var(--c-blue-pale);
        }
        
        #group {
            background-color: var(--c-white);
        }

        @media (max-width: 900px) {
            .service-grid, .service-grid.reverse {
                grid-template-columns: 1fr;
            }
            .service-visual { aspect-ratio: 16/9; }
        }

        /* Philosophy Section */
        .philosophy-section {
            padding: var(--section-pad) 0;
            background: var(--c-charcoal-deep);
            color: var(--c-white);
        }

        .phil-container {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 4rem;
        }

        .phil-interactive-court {
            position: relative;
            background: var(--c-blue-primary);
            border-radius: 12px;
            padding: 2rem;
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
        }

        .court-lines {
            width: 100%;
            height: auto;
            stroke: rgba(255,255,255,0.4);
            stroke-width: 2;
            fill: none;
        }
        
        .target-zone {
            fill: var(--c-neon-primary);
            opacity: 0;
            transition: opacity 0.3s;
        }
        
        .phil-content p {
            font-size: 1.25rem;
            color: rgba(255,255,255,0.7);
            margin-bottom: 2rem;
        }

        /* Location Section - The Map */
        .location-section {
            padding: var(--section-pad) 0;
            background: var(--c-white);
            position: relative;
            overflow: hidden;
        }

        .location-header {
            max-width: 700px;
            margin-bottom: 4rem;
        }
        .location-header h2 { font-size: clamp(2.5rem, 4vw, 3.5rem); }

        @keyframes pulse {
            0% { box-shadow: 0 0 0 0 rgba(184, 255, 24, 0.7); }
            70% { box-shadow: 0 0 0 15px rgba(184, 255, 24, 0); }
            100% { box-shadow: 0 0 0 0 rgba(184, 255, 24, 0); }
        }

        /* Experience Marquee */
        .marquee-section {
            background: var(--c-blue-primary);
            color: var(--c-white);
            padding: 3rem 0;
            overflow: hidden;
            display: flex;
            white-space: nowrap;
        }

        .marquee-content {
            display: flex;
            animation: marquee 20s linear infinite;
        }

        .marquee-item {
            font-family: var(--font-head);
            font-size: clamp(3rem, 6vw, 5rem);
            font-weight: 800;
            padding: 0 3rem;
            text-transform: uppercase;
        }
        
        .marquee-item.outline {
            -webkit-text-stroke: 2px var(--c-white);
            color: transparent;
        }

        @keyframes marquee {
            0% { transform: translateX(0); }
            100% { transform: translateX(-50%); }
        }

        .marquee-group { display:flex; align-items:center; flex:0 0 auto; }
        .marquee-dot { width:clamp(10px,1vw,14px); height:clamp(10px,1vw,14px); margin:0 clamp(1.2rem,2.5vw,2.5rem); flex:0 0 auto; border-radius:50%; background:var(--c-neon-primary); box-shadow:0 0 10px rgba(184,255,24,.4); }
        @media(max-width:600px){.marquee-section{padding:1.75rem 0}.marquee-item{font-size:clamp(2rem,10vw,3rem);padding:0 1.25rem}.marquee-dot{margin-inline:.75rem}}

        /* Video Review Section */
        .review-section {
            padding: var(--section-pad) 0;
            background: var(--c-charcoal-deep);
            color: var(--c-white);
            text-align: center;
            position: relative;
        }

        .review-content {
            max-width: 600px;
            margin: 0 auto;
            position: relative;
            z-index: 10;
        }

        .review-content h2 {
            font-size: clamp(2.5rem, 5vw, 4rem);
            margin-bottom: 1rem;
            color: var(--c-neon-primary);
        }

        .phone-frame-container {
            width: 250px;
            height: 500px;
            margin: 3rem auto;
            border: 8px solid var(--c-charcoal-soft);
            border-radius: 40px;
            position: relative;
            background: #000;
            box-shadow: 0 20px 50px rgba(0,0,0,0.5);
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
        }
        
        .phone-frame-container::before {
            content: 'REC •';
            position: absolute;
            top: 20px; left: 20px;
            color: red;
            font-family: var(--font-body);
            font-weight: bold;
            font-size: 0.8rem;
            animation: blink 1s infinite;
        }

        @keyframes blink {
            0%, 100% { opacity: 1; }
            50% { opacity: 0; }
        }

        .phone-graphic {
            width: 80%;
            opacity: 0.5;
        }

        /* Final CTA */
        .final-cta {
            padding: var(--section-pad) 0;
            background: var(--c-neon-primary);
            text-align: center;
        }

        .final-cta h2 {
            font-size: clamp(3rem, 7vw, 6rem);
            color: var(--c-charcoal-deep);
            margin-bottom: 2rem;
            line-height: 1;
        }
        
        .final-cta p {
            font-size: 1.25rem;
            color: var(--c-charcoal-soft);
            margin-bottom: 2rem;
            max-width: 600px;
            margin-left: auto;
            margin-right: auto;
            font-weight: 500;
        }

/* Shared final-site additions */
:focus-visible{outline:3px solid var(--c-neon-primary);outline-offset:4px}
.skip-link{position:fixed;left:1rem;top:-5rem;z-index:9999;background:var(--c-charcoal-deep);color:white;padding:.8rem 1rem}.skip-link:focus{top:1rem}
/* Nav toggle styling lives in assets/css/nav.css */
.inner-hero{padding:10rem 0 5rem;background:linear-gradient(135deg,var(--c-blue-pale),var(--c-white));overflow:hidden;position:relative}
/* Interior hero H1 — one tier below the landing heroes (index ~96px,
   philosophy ~82px). Was clamp(3.5rem,9vw,8rem)=128px, which made every
   interior page louder than the homepage. */
.inner-hero h1{font-size:clamp(2.9rem,6.4vw,5.25rem);line-height:.9;max-width:1000px}
.inner-hero p{max-width:680px;font-size:clamp(1.05rem,1.2vw,1.15rem);margin-top:2rem;color:var(--c-charcoal-soft)}
.inner-hero .orbit{position:absolute;width:32vw;height:32vw;border:2px solid var(--c-neon-primary);border-radius:50%;right:-10vw;top:5rem;animation:spin 14s linear infinite}
.orbit:after{content:'';position:absolute;width:22px;height:22px;background:var(--c-neon-primary);border-radius:50%;left:10%;top:10%;box-shadow:0 0 24px var(--c-neon-primary)}
@keyframes spin{to{transform:rotate(360deg)}}
.page-section{padding:7rem 0}.page-section.blue{background:var(--c-blue-primary)}.page-section.dark{background:var(--c-charcoal-deep);color:white}.page-section.ice{background:var(--c-ice)}
.page-grid{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center}.page-copy h2{font-size:clamp(2.8rem,6vw,5.8rem);line-height:.9;margin-bottom:1.5rem}.page-copy p{font-size:1.1rem;max-width:620px}
.feature-image{position:relative;min-height:520px;overflow:hidden;background:var(--c-blue-pale)}.feature-image img{width:100%;height:100%;position:absolute;object-fit:cover}.feature-image:after{content:'';position:absolute;inset:8%;border:2px solid var(--c-neon-primary);clip-path:polygon(0 0,100% 0,100% 30%,30% 100%,0 100%)}
.price-line{display:flex;justify-content:space-between;gap:2rem;border-top:1px solid currentColor;padding:1.2rem 0;font-weight:700}.price-line strong{font:800 1.3rem var(--font-head)}
.path-list{counter-reset:path}.path-row{counter-increment:path;display:grid;grid-template-columns:100px 1fr;gap:2rem;padding:3rem 0;border-top:1px solid rgba(16,24,32,.25)}.path-row:before{content:'0' counter(path);font:800 1rem var(--font-head);color:var(--c-blue-deep)}.path-row h3{font-size:clamp(2rem,4vw,4rem)}
.court-panel{position:relative;aspect-ratio:1/1.15;background:var(--c-blue-primary);border:4px solid white;overflow:hidden}.court-panel:before{content:'';position:absolute;inset:8%;border:3px solid white;background:linear-gradient(90deg,transparent 49.5%,white 49.5%,white 50.5%,transparent 50.5%),linear-gradient(0deg,transparent 49.5%,white 49.5%,white 50.5%,transparent 50.5%)}.court-panel .moving-ball{position:absolute;width:25px;height:25px;border-radius:50%;background:var(--c-neon-primary);left:16%;top:78%;box-shadow:0 0 20px var(--c-neon-primary);animation:courtMove 5s ease-in-out infinite alternate}
@keyframes courtMove{50%{left:72%;top:40%}100%{left:28%;top:12%}}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--c-charcoal-deep)}.step{background:white;padding:3rem 2rem}.step b{display:block;color:var(--c-blue-deep);font:800 3rem var(--font-head)}
.tag-cloud{display:flex;flex-wrap:wrap;gap:.6rem;margin:2rem 0}.tag{border:1px solid currentColor;padding:.65rem .9rem;font-weight:700;text-transform:uppercase;font-size:.75rem}
/* ===== Gallery grid (gallery.html) =====
   The image was previously position:absolute with no offsets, so inside a
   <button> (which centres its content) it resolved to its static position
   -- top:168px on a 340px card -- leaving the card's pale-blue background
   showing across the top half. The image is now a normal in-flow block that
   fills a fixed 4:3 card, and the card paints no background of its own. */
.photo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.photo-card{
  position:relative;
  display:block;
  width:100%;
  aspect-ratio:4/3;
  margin:0;
  padding:0;
  border:1px solid rgba(16,24,32,.1);
  border-radius:6px;
  overflow:hidden;
  background:none;
  cursor:pointer;
  box-shadow:0 6px 18px rgba(16,24,32,.06);
  transition:box-shadow .3s ease;
}
.photo-card:hover{box-shadow:0 12px 30px rgba(16,24,32,.12)}
.photo-card img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  transition:transform .5s cubic-bezier(.2,.8,.2,1);
}
.photo-card:hover img{transform:scale(1.03)}
/* Targeted crop helpers - higher specificity than .photo-card img so no
   !important is needed. Apply per image only where the subject is cut. */
.photo-card img.gallery-image--top{object-position:center 12%}
.photo-card img.gallery-image--center{object-position:center center}
.photo-card img.gallery-image--portrait{object-position:center 22%}
@media(max-width:1023px){.photo-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:599px){.photo-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){
  .photo-card,.photo-card img{transition:none}
  .photo-card:hover img{transform:none}
}
.filter-bar{display:flex;gap:.6rem;flex-wrap:wrap;margin-bottom:2rem}.filter-btn{border:1px solid var(--c-charcoal-deep);background:white;padding:.7rem 1rem;font-weight:700}.filter-btn.active{background:var(--c-neon-primary)}
.article-wrap{max-width:800px;margin:auto}.article-wrap h2{font-size:clamp(1.75rem,3.4vw,2.4rem);margin:3rem 0 1rem}.article-wrap p,.article-wrap li{font-size:1.12rem;line-height:1.8}.article-wrap ul{padding-left:1.2rem}
.journal-index{padding-top:clamp(4.5rem,7vw,6rem)}
.journal-index-heading{margin-bottom:1.5rem;color:var(--c-blue-deep)}
.journal-grid{display:grid;gap:clamp(3.5rem,5vw,4.5rem)}
.journal-secondary-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1.5rem,2.5vw,2rem)}
.journal-card{min-width:0;background:#f7fbfe;border:1px solid rgba(16,24,32,.12);border-radius:8px;overflow:hidden}
.journal-card-link{display:grid;height:100%;color:inherit;text-decoration:none}
.journal-card-featured .journal-card-link{grid-template-columns:minmax(0,1.18fr) minmax(320px,.82fr);align-items:stretch}
.journal-card-media{aspect-ratio:16/10;overflow:hidden;background:var(--c-charcoal-soft)}
.journal-card-featured .journal-card-media{aspect-ratio:auto;min-height:430px}
.journal-card-media img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.journal-card-featured .journal-card-media img{object-position:center 48%}
.journal-card-content{display:flex;flex-direction:column;align-items:flex-start;padding:clamp(1.5rem,3vw,2.5rem)}
.journal-category{display:flex;align-items:center;gap:.65rem;margin-bottom:1rem;color:var(--c-blue-deep);font-family:var(--font-display);font-size:.76rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.journal-category::before{content:"";width:26px;height:3px;background:var(--c-neon-primary)}
.journal-card h2{margin:0 0 1rem;font-size:clamp(1.7rem,2.6vw,2.6rem);line-height:1.06;transition:color .25s ease}
.journal-card-featured h2{font-size:clamp(2.5rem,4vw,4.25rem)}
.journal-card p{margin:0 0 1.75rem;color:var(--c-charcoal);font-size:1rem;line-height:1.7}
.journal-read{display:inline-flex;align-items:center;gap:.55rem;margin-top:auto;color:var(--c-charcoal-deep);font-family:var(--font-display);font-size:.82rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.journal-read span{color:var(--c-neon-dark);font-size:1.15rem;transition:transform .25s ease}
.journal-card-link:hover .journal-card-media img{transform:scale(1.02)}
.journal-card-link:hover h2{color:var(--c-blue-deep)}
.journal-card-link:hover .journal-read span{transform:translateX(4px)}
.journal-card-link:focus-visible{outline:3px solid var(--c-neon-primary);outline-offset:-5px}
@media(max-width:800px){.journal-index{padding-top:4.5rem}.journal-grid{gap:2rem}.journal-secondary-grid{grid-template-columns:1fr;gap:2rem}.journal-card-featured .journal-card-link{grid-template-columns:1fr}.journal-card-featured .journal-card-media{aspect-ratio:16/10;min-height:0}.journal-card-featured h2{font-size:clamp(2rem,8vw,2.4rem)}.journal-card h2{font-size:clamp(1.65rem,7vw,1.9rem)}.journal-card-content{padding:1.5rem}.journal-card p{font-size:1rem}}
@media(prefers-reduced-motion:reduce){.journal-card-media img,.journal-card h2,.journal-read span{transition:none}.journal-card-link:hover .journal-card-media img,.journal-card-link:hover .journal-read span{transform:none}}
.contact-actions{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.contact-actions a{padding:2.5rem;background:white;color:var(--c-charcoal-deep);font:800 1.4rem var(--font-head)}
.inner-hero.contact-hero{isolation:isolate;display:flex;align-items:center;height:clamp(600px,calc(47.5vw + 115px),800px);min-height:0;padding:clamp(6.5rem,8vw,7.5rem) 0 3rem;background:var(--c-charcoal-deep)}
.contact-hero-media{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.contact-hero-media video{display:block;width:100%;height:100%;object-fit:cover;object-position:center center;filter:none;opacity:1}
.contact-hero::before{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(8,17,26,.9) 0%,rgba(8,17,26,.76) 38%,rgba(8,17,26,.38) 68%,rgba(8,17,26,.16) 100%)}
.contact-hero>.container{position:relative;z-index:2;width:100%}
.contact-hero .orbit{z-index:1;opacity:.34}
.contact-hero .eyebrow{color:var(--c-blue-bright)}
/* Contact hero keeps its dark-image treatment; sizing comes from the shared
   interior-hero scale rather than a bespoke clamp. */
.inner-hero.contact-hero h1{max-width:9ch;color:var(--c-white);text-shadow:0 4px 28px rgba(0,0,0,.42)}
.contact-hero h1 .text-blue{color:var(--c-blue-bright)}
.contact-hero p{color:rgba(255,255,255,.94);text-shadow:0 2px 16px rgba(0,0,0,.58)}
.contact-form-panel{margin-top:2rem}.contact-form-panel h2{font-size:clamp(2rem,3.6vw,3.25rem);line-height:.95;margin-bottom:1rem}.contact-form-panel>p{margin-bottom:1.5rem;color:rgba(255,255,255,.78)}.ghl-form-embed{width:100%;min-width:0;overflow:visible}.ghl-form-embed iframe{display:block;width:100%;min-height:743px}
.contact-conversion{padding:clamp(4.5rem,7vw,6.5rem) 0}.contact-conversion-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(440px,1.15fr);gap:clamp(3rem,6vw,6.5rem);align-items:start}.contact-conversion-copy{padding-top:clamp(1rem,3vw,2.25rem)}.contact-conversion-copy h2{font-size:clamp(3rem,5.4vw,5.4rem)}.contact-conversion-copy>p{max-width:540px;margin-top:1rem;color:rgba(255,255,255,.76);line-height:1.7}.contact-conversion .contact-actions{margin-top:2.25rem}.contact-conversion .contact-actions a{position:relative;min-height:132px;display:flex;align-items:flex-end;padding:1.5rem;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.07);color:var(--c-white);transition:background .2s,border-color .2s,transform .2s}.contact-conversion .contact-actions a::before{content:'';position:absolute;top:1.25rem;left:1.5rem;width:10px;height:10px;border-radius:50%;background:var(--c-neon-primary)}.contact-conversion .contact-actions a:hover{background:rgba(255,255,255,.12);border-color:var(--c-blue-bright);transform:translateY(-2px)}.contact-conversion .tag-cloud{margin:1.25rem 0 0}.contact-conversion .tag{color:rgba(255,255,255,.72);border-color:rgba(255,255,255,.25)}.contact-conversion .contact-form-panel{min-width:0;margin:0;padding:clamp(.75rem,1.5vw,1.25rem);background:var(--c-white);border:1px solid rgba(92,184,255,.35);border-radius:18px;box-shadow:0 28px 70px rgba(0,0,0,.3)}.contact-conversion .ghl-form-embed{overflow:hidden;border-radius:10px}.contact-conversion .ghl-form-embed iframe{border-radius:10px!important}
@media(max-width:800px){.inner-hero.contact-hero{height:auto;min-height:clamp(560px,120vw,640px);padding:6.75rem 0 3.5rem}.contact-hero::before{background:linear-gradient(90deg,rgba(8,17,26,.88),rgba(8,17,26,.58))}.inner-hero.contact-hero h1{max-width:9ch}.contact-hero p{max-width:36ch}}
@media(max-width:768px){.contact-conversion{padding:4rem 0}.contact-conversion-grid{grid-template-columns:minmax(0,1fr);gap:2.5rem}.contact-conversion-copy{padding-top:0}.contact-conversion-copy h2{font-size:clamp(2.8rem,13vw,4.25rem)}.contact-conversion .contact-actions{grid-template-columns:1fr}.contact-conversion .contact-actions a{min-height:112px}.contact-conversion .contact-form-panel{padding:.5rem;border-radius:14px}.contact-conversion .ghl-form-embed{border-radius:9px}}
@media(max-width:800px){.page-grid{grid-template-columns:1fr;gap:2.5rem}.page-section{padding:4rem 0}.feature-image{min-height:390px}.steps{grid-template-columns:1fr}.path-row{grid-template-columns:55px minmax(0,1fr)}.blog-list a{grid-template-columns:1fr;gap:.75rem}.contact-actions{grid-template-columns:1fr}.inner-hero{padding-top:8rem}.inner-hero .orbit{width:65vw;height:65vw;opacity:.5}}
@media(max-width:800px){.hero{padding-top:105px}.hero-visual{display:block;min-height:260px;order:2}.hero-img-wrap{height:260px}.hero-content{padding-bottom:0}.progression-visual{display:block;width:100%;height:310px;position:relative;top:auto;margin-bottom:3rem}.court-graphic{height:280px;max-width:220px;margin:auto}.progression-content{width:100%}}
@media(prefers-reduced-motion:reduce){.orbit,.moving-ball{animation:none!important}}

/* ===== Coverage map card (shared with index.html) ===== */
.map-container{position:relative;isolation:isolate;width:100%;border-radius:20px;overflow:hidden;background:#AFD6F0;box-shadow:0 24px 70px rgba(16,24,32,.12),0 0 0 1px rgba(16,24,32,.05)}
/* The SVG uses preserveAspectRatio="slice", so the card's aspect ratio decides the
   crop. Taller cards on narrow screens zoom in and keep place labels readable. */
.map-container{aspect-ratio:1160/580}
@media(max-width:999px){.map-container{aspect-ratio:16/9}}
@media(max-width:600px){.map-container{aspect-ratio:5/4}}
.coverage-map{display:block;width:100%;height:100%;object-fit:fill}
.map-legend{position:absolute;left:1.25rem;bottom:1.25rem;display:flex;flex-wrap:wrap;gap:.4rem 1.1rem;padding:.7rem 1rem;border-radius:12px;background:rgba(255,255,255,.9);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 6px 20px rgba(16,24,32,.1),0 0 0 1px rgba(16,24,32,.05);opacity:0;transform:translateY(10px);transition:opacity .7s ease .5s,transform .7s ease .5s}
.location-section.is-visible .map-legend,.reveal.is-visible .map-legend{opacity:1;transform:translateY(0)}
.legend-item{display:inline-flex;align-items:center;gap:.45rem;font-family:var(--font-body);font-size:.72rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--c-charcoal-soft);white-space:nowrap}
.legend-pin{width:14px;height:19px;flex-shrink:0}

/* City chips (locations page court-access list) */
.city-grid{display:flex;flex-wrap:wrap;gap:.65rem;margin:2rem 0;padding:0;list-style:none}
.city-chip{display:inline-flex;align-items:center;gap:.5rem;padding:.55rem 1.05rem;border-radius:999px;background:var(--c-white);font-family:var(--font-body);font-weight:600;font-size:.85rem;color:var(--c-charcoal-deep);box-shadow:0 1px 2px rgba(16,24,32,.06),0 4px 14px rgba(16,24,32,.05),0 0 0 1px rgba(16,24,32,.08);transition:transform .25s ease,box-shadow .25s ease}
.city-chip::before{content:'';width:8px;height:8px;border-radius:50%;background:var(--c-blue-primary);flex-shrink:0}
.city-chip:hover{transform:translateY(-2px);box-shadow:0 3px 6px rgba(16,24,32,.08),0 10px 24px rgba(16,24,32,.1),0 0 0 1px rgba(16,24,32,.08)}
.city-chip--home{background:var(--c-charcoal-deep);color:var(--c-white)}
.city-chip--home::before{background:var(--c-neon-primary)}
.city-chip--home em{font-style:normal;font-size:.6rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--c-neon-primary)}
.city-chip--muted{background:transparent;box-shadow:0 0 0 1px rgba(16,24,32,.14);color:var(--c-charcoal-soft)}
.city-chip--muted::before{background:#9DB2C0}
@media(max-width:600px){.city-chip{font-size:.78rem;padding:.5rem .85rem}}
.map-footnote{margin-top:1rem;font-family:var(--font-body);font-size:.85rem;color:var(--c-charcoal-soft);opacity:.75}
@media(max-width:760px){.map-legend{left:0;right:0;bottom:0;border-radius:0;box-shadow:none;background:rgba(255,255,255,.92);border-top:1px solid rgba(16,24,32,.06);justify-content:center;gap:.3rem .55rem;padding:.5rem .35rem}.legend-item{font-size:.55rem;letter-spacing:.02em;gap:.3rem}.legend-pin{width:11px;height:15px}}
@media(prefers-reduced-motion:reduce){.map-legend{transition:none;opacity:1;transform:none}}

/* Additive founder story and reusable philosophy court */
.section-intro{max-width:760px;margin-bottom:clamp(2.5rem,5vw,5rem)}
.about-story{overflow:hidden}.about-timeline{position:relative;display:grid;gap:1rem;max-width:980px;margin-left:auto}.about-timeline::before{content:'';position:absolute;left:35px;top:2rem;bottom:2rem;width:2px;background:linear-gradient(var(--c-neon-primary),var(--c-blue-primary))}.timeline-step{position:relative;display:grid;grid-template-columns:72px 1fr;gap:1.4rem;padding:1.6rem;border-radius:18px;background:var(--c-white);box-shadow:0 10px 35px rgba(16,24,32,.07)}.timeline-number{position:relative;z-index:1;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--c-charcoal-deep);color:var(--c-neon-primary);font:800 .76rem var(--font-head)}.timeline-step h3{font-size:clamp(1.35rem,2.5vw,2rem);margin-bottom:.55rem}.timeline-step p{margin:0;max-width:760px}.about-story-link{display:flex;gap:1rem;flex-wrap:wrap;margin:2rem 0 0 88px}.about-book em{color:var(--c-blue-deep);font-weight:700}
.philosophy-lab{background:var(--c-charcoal-deep);color:var(--c-white)}.philosophy-lab h2,.philosophy-lab h3{color:var(--c-white)}.philosophy-experience{display:grid;grid-template-columns:minmax(320px,.9fr) minmax(0,1.1fr);gap:clamp(2rem,6vw,7rem);align-items:start}.philosophy-sticky{position:sticky;top:120px}.concept-court{--ball-x:72.5%;--ball-y:53%;--sh-lg:84px;--sh-md:72px;position:relative;aspect-ratio:4/5;max-height:680px;border:2px solid rgba(255,255,255,.72);background:#2f86c7;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.3)}.court-lines{position:absolute;inset:5%;border:2px solid rgba(255,255,255,.75);background:linear-gradient(90deg,transparent 49.7%,rgba(255,255,255,.7) 50%,transparent 50.3%),linear-gradient(0deg,transparent 49.7%,rgba(255,255,255,.85) 50%,transparent 50.3%)}.court-lines::before,.court-lines::after{content:'';position:absolute;left:19%;right:19%;height:1px;background:rgba(255,255,255,.72)}.court-lines::before{top:25%}.court-lines::after{bottom:25%}.court-player{position:absolute;width:18px;height:18px;border-radius:50%;background:var(--c-white);border:4px solid var(--c-charcoal-deep);transition:all .65s cubic-bezier(.2,.8,.2,1)}.player-a{left:17.5%;bottom:14%}.player-b{left:25%;top:12%;opacity:0}.player-c{right:25%;top:12%;opacity:0}.court-ball{position:absolute;left:var(--ball-x);top:var(--ball-y);width:16px;height:16px;border-radius:50%;background:var(--c-neon-primary);box-shadow:0 0 22px var(--c-neon-primary);transition:all .65s cubic-bezier(.2,.8,.2,1)}.court-path{position:absolute;left:20%;bottom:18%;width:58%;height:44%;border:4px solid var(--c-neon-primary);border-top:0;border-left:0;border-radius:0 0 100% 0;filter:drop-shadow(0 0 6px rgba(184,255,24,.45));transform-origin:left bottom;transition:all .65s ease}.court-label{position:absolute;left:1rem;bottom:1rem;max-width:80%;font:800 clamp(.8rem,1.5vw,1.1rem) var(--font-head);letter-spacing:.12em;color:var(--c-neon-primary)}.concept-step{min-height:58vh;padding:clamp(2rem,6vw,5rem) 0;border-top:1px solid rgba(255,255,255,.16);opacity:.42;transition:opacity .35s}.concept-step:first-child{border-top:0}.concept-step.is-active{opacity:1}.concept-step>span{font:700 .72rem var(--font-head);letter-spacing:.13em;text-transform:uppercase;color:var(--c-neon-primary)}.concept-step h3{margin:.65rem 0 1rem;font-size:clamp(1.8rem,4vw,3.5rem)}.concept-step p{font-size:clamp(1rem,1.45vw,1.2rem);color:rgba(255,255,255,.78)}.concept-step a{display:inline-block;margin-top:1rem;color:var(--c-neon-primary);font-weight:800}.mental-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;padding:0;list-style:none;counter-reset:mental}.mental-steps li{counter-increment:mental;padding:.75rem .4rem;border:1px solid rgba(184,255,24,.5);text-align:center;font-size:.72rem;font-weight:800;text-transform:uppercase}.mental-steps li::before{content:counter(mental) '. ';color:var(--c-neon-primary)}.court-ghost{position:absolute;left:48.2%;bottom:12.5%;width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.85);opacity:0}
.ghost-r{left:51%}
.court-link{position:absolute;left:47%;bottom:29.5%;width:24%;height:2px;background:var(--c-neon-primary);box-shadow:0 0 8px rgba(184,255,24,.5);opacity:0;transition:opacity .65s ease}
.court-kitchen{position:absolute;left:5%;right:5%;top:38%;bottom:38%;border-top:2px solid rgba(255,255,255,.8);border-bottom:2px solid rgba(255,255,255,.8);background:rgba(184,255,24,.05);opacity:0;transition:opacity .65s ease}
.court-node{position:absolute;width:10px;height:10px;border-radius:50%;background:var(--c-neon-primary);box-shadow:0 0 12px rgba(184,255,24,.65);opacity:0;transform:scale(.6);transition:opacity .5s ease,transform .5s ease}
.court-node::after{content:attr(data-stage);position:absolute;top:calc(100% + 5px);left:50%;transform:translateX(-50%);font:700 7.5px var(--font-body);letter-spacing:1.1px;text-transform:uppercase;color:rgba(255,255,255,.85);white-space:nowrap}
.node-1{left:26%;top:68%}.node-2{left:40%;top:63%}.node-3{left:54%;top:63%}.node-4{left:68%;top:68%}
/* 01 Forehand: quarter-ellipse rises from the racket-drop beside the player,
   shallow first (drop + forward) then steep through the contact ball to a
   high finish. The grow animation replays the release on each activation. */
.concept-court:not([data-concept]) .court-path,.concept-court[data-concept=forehand] .court-path{animation:fhGrow 1.1s ease-out both}
.concept-court[data-concept=forehand] .player-a{left:17.5%;bottom:14%}
/* 02 Split step / recovery: opponent contact cue, readiness pulse with ghost
   footprints, lateral move to the shot, then recovery toward home. */
.concept-court[data-concept=recovery]{--ball-x:29%;--ball-y:12%}
.concept-court[data-concept=recovery] .court-path{opacity:0}
.concept-court[data-concept=recovery] .player-a{left:47%;bottom:13%;animation:rcMove 4.6s cubic-bezier(.3,0,.2,1) .2s both}
.concept-court[data-concept=recovery] .player-c{opacity:1;right:62%;top:10%}
.concept-court[data-concept=recovery] .court-ball{animation:rcPulse 2.4s ease-out .1s both}
.concept-court[data-concept=recovery] .ghost-l{animation:rcGhostL 4.6s ease-out .2s both}
.concept-court[data-concept=recovery] .ghost-r{animation:rcGhostR 4.6s ease-out .2s both}
/* 03 Serve: toss line offset to the server, leaning slightly into the court;
   ball rises from the hand and pulses at the contact apex. */
.concept-court[data-concept=serve]{--ball-x:54%;--ball-y:16%}
.concept-court[data-concept=serve] .court-path{left:56.5%;bottom:11%;width:4%;height:70%;border:0;border-left:3px solid var(--c-neon-primary);border-radius:0;transform:rotate(-5deg);animation:svGrow 1s ease-out .15s both}
.concept-court[data-concept=serve] .player-a{left:56%;bottom:9%}
.concept-court[data-concept=serve] .court-ball{animation:svToss 2.8s cubic-bezier(.3,0,.25,1) .2s both}
/* 04 Singles: no trajectory - the opponent/ball shifts sides and the player
   recovers off-center toward the side that closes the open angles. */
.concept-court[data-concept=singles]{--ball-x:64%;--ball-y:12%}
.concept-court[data-concept=singles] .court-path{opacity:0}
.concept-court[data-concept=singles] .player-a{left:56%;bottom:14%;animation:sgMove 5s ease-in-out .2s both}
.concept-court[data-concept=singles] .player-c{opacity:1;right:29%;top:11%;animation:oppMove 5s ease-in-out .2s both}
.concept-court[data-concept=singles] .court-ball{animation:oppBall 5s ease-in-out .2s both}
/* 05 Doubles: two partners shift laterally as one connected pair. */
.concept-court[data-concept=doubles]{--ball-x:64%;--ball-y:12%}
.concept-court[data-concept=doubles] .court-path{opacity:0}
.concept-court[data-concept=doubles] .player-a{left:44%;bottom:28%;animation:dbMove 5s ease-in-out .2s both}
.concept-court[data-concept=doubles] .player-b{opacity:1;left:70%;top:auto;bottom:28%;animation:dbMove 5s ease-in-out .2s both}
.concept-court[data-concept=doubles] .player-c{opacity:1;right:29%;top:11%;animation:oppMove 5s ease-in-out .2s both}
.concept-court[data-concept=doubles] .court-ball{animation:oppBall 5s ease-in-out .2s both}
.concept-court[data-concept=doubles] .court-link{opacity:.3;animation:dbMove 5s ease-in-out .2s both}
/* 06 Pickleball: kitchen lines appear; incoming drive is absorbed, then a
   short, low, soft arc bridges the net and drops inside the far kitchen. */
.concept-court[data-concept=pickleball]{--ball-x:55.5%;--ball-y:41.5%}
.concept-court[data-concept=pickleball] .court-kitchen{opacity:1}
.concept-court[data-concept=pickleball] .court-path{left:52.5%;bottom:36%;width:9%;height:23%;border:0;border-right:3px solid var(--c-neon-primary);border-radius:0 100% 100% 0;opacity:.9;animation:pbGrow 2.6s ease-out .15s both}
.concept-court[data-concept=pickleball] .player-a{left:52%;bottom:31%}
.concept-court[data-concept=pickleball] .player-c{opacity:1;right:62%;top:8%}
.concept-court[data-concept=pickleball] .court-ball{animation:pbBall 3.4s cubic-bezier(.35,0,.3,1) .15s both}
/* 07 Mental reset: no trajectory - four stage nodes light in sequence. */
.concept-court[data-concept=mental] .court-path{opacity:0}
.concept-court[data-concept=mental] .court-ball{opacity:0}
.concept-court[data-concept=mental] .player-a{left:47%;bottom:42%}
.concept-court[data-concept=mental] .court-node{opacity:.45;transform:scale(.85)}
.concept-court[data-concept=mental] .node-1{animation:ndLight .7s ease-out .3s both}
.concept-court[data-concept=mental] .node-2{animation:ndLight .7s ease-out .9s both}
.concept-court[data-concept=mental] .node-3{animation:ndLight .7s ease-out 1.5s both}
.concept-court[data-concept=mental] .node-4{animation:ndLight .7s ease-out 2.1s both}
@keyframes fhGrow{0%{width:10%;height:9%;opacity:.25}60%{opacity:1}100%{width:58%;height:44%;opacity:1}}
@keyframes svGrow{0%{height:8%;opacity:.2}100%{height:70%;opacity:1}}
@keyframes svToss{0%{left:57%;top:84%;transform:scale(1)}46%{left:54.5%;top:17.5%}55%{transform:scale(1.45)}64%{transform:scale(1)}100%{left:54%;top:16%;transform:scale(1)}}
@keyframes rcMove{0%{transform:none}8%{transform:scale(1.42)}14%{transform:scale(1)}34%{transform:translate(calc(-1*var(--sh-lg)),-12px)}58%{transform:translate(calc(-1*var(--sh-lg)),-12px)}90%,100%{transform:none}}
@keyframes rcPulse{0%,100%{transform:scale(1)}8%{transform:scale(1.5)}16%{transform:scale(1)}24%{transform:scale(1.3)}32%{transform:scale(1)}}
@keyframes rcGhostL{0%,4%{opacity:0;transform:none}9%{opacity:.9}20%{transform:translateX(-9px)}32%,100%{opacity:0;transform:translateX(-9px)}}
@keyframes rcGhostR{0%,4%{opacity:0;transform:none}9%{opacity:.9}20%{transform:translateX(9px)}32%,100%{opacity:0;transform:translateX(9px)}}
@keyframes oppBall{0%{left:54%;top:13%}22%,34%{left:30%;top:12%}56%,100%{left:64%;top:12%}}
@keyframes oppMove{0%{right:55%}22%,34%{right:63%}56%,100%{right:29%}}
@keyframes sgMove{0%,36%{transform:translateX(calc(-1*var(--sh-lg)))}58%,100%{transform:none}}
@keyframes dbMove{0%,36%{transform:translateX(calc(-1*var(--sh-md)))}58%,100%{transform:none}}
@keyframes pbBall{0%{left:32%;top:11%;transform:scale(1)}26%{left:55%;top:62%}31%{transform:scale(.8)}38%{left:55.5%;top:62%;transform:scale(1)}60%{left:61.5%;top:51%}80%{left:55.5%;top:41.5%}86%{transform:scale(1.3)}94%,100%{left:55.5%;top:41.5%;transform:scale(1)}}
@keyframes pbGrow{0%,32%{height:5%;opacity:0}46%{opacity:.9}100%{height:23%;opacity:.9}}
@keyframes ndLight{0%{opacity:.45;transform:scale(.85)}55%{opacity:1;transform:scale(1.4)}100%{opacity:1;transform:scale(1)}}
@media(max-width:800px){.philosophy-experience{grid-template-columns:1fr}.philosophy-sticky{position:relative;top:auto}.concept-court{aspect-ratio:4/3;max-height:none}.concept-step{min-height:0;padding:2.5rem 0;opacity:1}.about-story-link{margin-left:0}}
@media(max-width:520px){.timeline-step{grid-template-columns:48px 1fr;padding:1.1rem;gap:.75rem}.about-timeline::before{left:32px}.timeline-number{width:34px;height:34px}.mental-steps{grid-template-columns:repeat(2,1fr)}.concept-court{--sh-lg:52px;--sh-md:42px}}
@media(prefers-reduced-motion:reduce){.court-player,.court-ball,.court-path,.concept-step,.court-node,.court-link,.court-kitchen,.court-ghost{transition:none;animation:none!important}.concept-step{opacity:1}.concept-court[data-concept=mental] .court-node{opacity:1;transform:scale(1)}.court-ghost{opacity:0!important}}

/* Compact, discoverable navigation and mobile QA refinements */
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--c-neon-primary);outline-offset:4px}.article-byline{margin:.25rem 0 2rem;color:var(--c-blue-deep);font-weight:700}
:target{scroll-margin-top:110px}
@media(max-width:800px){.inner-hero{padding-top:7.25rem}.article-wrap{max-width:720px}:target{scroll-margin-top:86px}}
@media(max-width:430px){.inner-hero{padding-top:6.75rem}.inner-hero .eyebrow{font-size:.7rem;gap:.55rem}.inner-hero p{margin-top:1.25rem}.gallery-lightbox{padding-top:3.25rem}}

/* Philosophy landing hero: the section owns the height; media simply fills it. */
.philosophy-hero{isolation:isolate;display:flex;align-items:center;position:relative;width:100%;height:auto;min-height:0;aspect-ratio:1280/720;margin-top:var(--nav-h);padding-block:clamp(8.5rem,14vh,10.5rem) clamp(4rem,7vh,5.5rem);overflow:hidden;background:var(--c-charcoal-deep)}
.philosophy-hero-media{position:absolute;inset:0;z-index:0;width:100%;height:100%;overflow:hidden;pointer-events:none}
.philosophy-hero-video{display:block;width:100%;height:100%;object-fit:contain;object-position:center center;filter:none;opacity:1;transform:none}
.philosophy-hero::before{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(10,20,30,.82) 0%,rgba(10,20,30,.64) 28%,rgba(10,20,30,.3) 48%,rgba(10,20,30,.08) 66%,transparent 79%)}
.philosophy-hero::after{content:'';position:absolute;inset:auto 0 0;height:18%;z-index:1;pointer-events:none;background:linear-gradient(0deg,rgba(10,20,30,.24),transparent)}
.philosophy-hero .orbit{z-index:2;width:min(30vw,470px);height:min(30vw,470px);right:-12vw;top:14%;opacity:.14;border-width:1.5px}
.philosophy-hero .orbit:after{width:13px;height:13px;box-shadow:0 0 16px var(--c-neon-primary)}
.philosophy-hero>.container{position:relative;z-index:3;width:100%}
.philosophy-hero-copy{width:min(62%,760px)}
.philosophy-hero .eyebrow{color:var(--c-blue-bright)}
.philosophy-hero h1{max-width:14ch;color:var(--c-white);font-size:clamp(3.15rem,5.7vw,5.5rem);line-height:.9;text-shadow:0 4px 26px rgba(8,15,22,.58)}
.philosophy-hero h1 .text-blue{color:var(--c-blue-bright)}
.philosophy-hero p{max-width:56ch;margin-top:1.5rem;font-size:clamp(1rem,1.15vw,1.2rem);color:rgba(255,255,255,.95);text-shadow:0 2px 14px rgba(8,15,22,.72)}

/* Five-stage tennis-training storyline directly beneath the hero paragraph. */
.player-development{position:relative;width:min(100%,740px);margin-top:clamp(2rem,4vh,3rem);padding-top:1.35rem;color:#fff}
.player-development-label{font:700 .64rem var(--font-body);letter-spacing:.2em;text-transform:uppercase;color:var(--c-blue-bright)}
.development-track{position:absolute;left:0;right:0;top:3.25rem;height:18px;pointer-events:none}
.development-track-base,.development-track-progress{position:absolute;left:0;right:0;top:8px;height:2px;border-radius:999px}
.development-track-base{background:rgba(255,255,255,.25)}
.development-track-progress{right:auto;width:100%;background:var(--c-neon-primary);box-shadow:0 0 8px rgba(184,255,24,.55);transform:scaleX(0);transform-origin:left center;animation:developmentLine 8s cubic-bezier(.45,0,.2,1) infinite}
.development-ball{position:absolute;left:0;top:0;width:18px;height:18px;border:2px solid rgba(16,24,32,.45);border-radius:50%;background:var(--c-neon-primary);box-shadow:0 0 14px rgba(184,255,24,.9);animation:developmentBallTravel 8s cubic-bezier(.45,0,.2,1) infinite}
.development-ball::after{content:'';position:absolute;inset:3px;border-top:1px solid rgba(16,24,32,.45);border-radius:50%;transform:rotate(-24deg)}
.development-stages{position:relative;z-index:1;display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin:2.55rem 0 0;padding:0;list-style:none}
.development-stages li{--stage-delay:0s;position:relative;min-width:0;padding:1.45rem .4rem 0;text-align:center;opacity:.62;animation:developmentStageActive 8s ease-in-out var(--stage-delay) infinite}
.development-stages li:first-child{padding-left:0;text-align:left}.development-stages li:last-child{padding-right:0;text-align:right}
.development-stages li:nth-child(2){--stage-delay:1.4s}.development-stages li:nth-child(3){--stage-delay:2.8s}.development-stages li:nth-child(4){--stage-delay:4.2s}.development-stages li:nth-child(5){--stage-delay:5.6s}
.development-node{position:absolute;left:50%;top:-5px;width:12px;height:12px;border:2px solid var(--c-neon-primary);border-radius:50%;background:var(--c-charcoal-deep);transform:translateX(-50%);animation:developmentNodeActive 8s ease-in-out var(--stage-delay) infinite}
.development-stages li:first-child .development-node{left:0;transform:none}.development-stages li:last-child .development-node{left:auto;right:0;transform:none}
.development-stages b,.development-stages small{display:block}.development-stages b{font:800 clamp(.9rem,1.15vw,1.05rem) var(--font-head);letter-spacing:.04em;white-space:nowrap}.development-stages small{margin-top:.28rem;font-size:clamp(.75rem,.9vw,.86rem);font-weight:500;line-height:1.35;color:rgba(255,255,255,.84)}
@keyframes developmentLine{0%{transform:scaleX(0)}72%,88%{transform:scaleX(1)}100%{transform:scaleX(0)}}
@keyframes developmentBallTravel{0%{left:0}72%,88%{left:calc(100% - 18px)}100%{left:0}}
@keyframes developmentStageActive{0%,19%,100%{opacity:.62}4%,15%{opacity:1;text-shadow:0 0 14px rgba(115,200,255,.28)}}
@keyframes developmentNodeActive{0%,19%,100%{background:var(--c-charcoal-deep);box-shadow:none}4%,15%{background:var(--c-neon-primary);box-shadow:0 0 12px rgba(184,255,24,.9)}}

@media(max-width:1024px){.philosophy-hero-copy{width:min(68%,720px)}.philosophy-hero h1{font-size:clamp(2.75rem,6vw,3.75rem)}.philosophy-hero p{margin-top:1rem}.player-development{margin-top:1.25rem}.development-stages b{font-size:clamp(.88rem,1.3vw,.96rem)}.development-stages small{font-size:clamp(.74rem,1vw,.8rem)}}
@media(max-width:768px){.philosophy-hero{align-items:flex-start;min-height:auto;aspect-ratio:auto;padding-block:7.5rem 4rem}.philosophy-hero-media{inset:0 0 auto;height:auto;aspect-ratio:1280/720}.philosophy-hero::before{background:linear-gradient(90deg,rgba(10,20,30,.86),rgba(10,20,30,.42) 82%,rgba(10,20,30,.16))}.philosophy-hero::after{height:46%;background:linear-gradient(0deg,rgba(10,20,30,.58),transparent)}.philosophy-hero-copy{width:100%;max-width:700px}.philosophy-hero h1{max-width:15ch;font-size:clamp(2.65rem,9vw,4rem)}.philosophy-hero .orbit{width:58vw;height:58vw;right:-27vw;top:12%;opacity:.11}.player-development{width:min(100%,560px);margin-top:2rem;padding:1.15rem 1.15rem 1rem;border:1px solid rgba(115,200,255,.22);border-radius:14px;background:linear-gradient(145deg,rgba(7,16,25,.56),rgba(16,24,32,.32));box-shadow:0 16px 38px rgba(3,10,17,.16);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.player-development-label{font-size:.7rem;color:var(--c-blue-bright)}.development-track{left:1.15rem;right:auto;top:54.5px;width:20px;height:280px}.development-track-base,.development-track-progress{left:9px;right:auto;top:10px;width:2px;height:calc(4 * 65px)}.development-track-base{background:rgba(255,255,255,.34)}.development-track-progress{transform:scaleY(0);transform-origin:center top;animation-name:developmentLineVertical}.development-ball{left:0;top:0;width:20px;height:20px;animation-name:developmentBallTravelVertical}.development-stages{grid-template-columns:1fr;gap:0;margin:1.4rem 0 0;padding-left:2.8rem}.development-stages li,.development-stages li:first-child,.development-stages li:last-child{min-height:65px;padding:.02rem 0 0;text-align:left}.development-node,.development-stages li:first-child .development-node,.development-stages li:last-child .development-node{left:-2.74rem;right:auto;top:.14rem;width:13px;height:13px;transform:none}.development-stages b{font-size:.9rem;letter-spacing:.04em}.development-stages small{margin-top:.22rem;font-size:.78rem;color:rgba(255,255,255,.82)}@keyframes developmentLineVertical{0%{transform:scaleY(0)}72%,88%{transform:scaleY(1)}100%{transform:scaleY(0)}}@keyframes developmentBallTravelVertical{0%{top:0}72%,88%{top:calc(4 * 65px)}100%{top:0}}}
@media(max-width:440px){.philosophy-hero{min-height:auto;padding-block:6.75rem 3.5rem}.philosophy-hero h1{font-size:clamp(2.35rem,10.7vw,3.15rem)}.philosophy-hero p{font-size:1rem;margin-top:1.15rem}.player-development{margin-top:1.65rem;padding:1rem .9rem .85rem}.development-track{left:.9rem;top:52px;height:272px}.development-track-base,.development-track-progress{height:calc(4 * 63px)}.development-stages{padding-left:2.7rem}.development-stages li,.development-stages li:first-child,.development-stages li:last-child{min-height:63px}.development-node,.development-stages li:first-child .development-node,.development-stages li:last-child .development-node{left:-2.64rem}.development-stages b{font-size:.95rem}.development-stages small{font-size:.8rem}@keyframes developmentBallTravelVertical{0%{top:0}72%,88%{top:calc(4 * 63px)}100%{top:0}}}
@media(prefers-reduced-motion:reduce){.development-track-progress,.development-ball,.development-stages li,.development-node{animation:none}.development-track-progress{transform:scaleX(1)}.development-ball{left:calc(100% - 18px)}.development-stages li{opacity:1}@media(max-width:768px){.development-track-progress{transform:scaleY(1)}.development-ball{left:0;top:calc(4 * 65px)}}@media(max-width:440px){.development-ball{top:calc(4 * 63px)}}}.gallery-lightbox{width:min(92vw,1100px);height:min(90vh,800px);border:0;padding:3.5rem 1rem 1rem;background:var(--c-charcoal-deep);overflow:hidden}.gallery-lightbox::backdrop{background:rgba(16,24,32,.88)}.gallery-lightbox img{width:100%;height:100%;object-fit:contain}.lightbox-close{position:absolute;right:1rem;top:1rem;border:1px solid var(--c-neon-primary);background:transparent;color:white;padding:.55rem .8rem;font-weight:800;cursor:pointer}


/* =========================================================
   LESSONS PAGE — scoped to body.page-lessons
   Editorial three-format layout: 01 tennis / 02 pickleball / 03 group.
   Reuses the shared .reveal observer; children stagger off .is-visible.
   ========================================================= */

/* Sticky format rail (desktop only) */
.page-lessons .lesson-rail{display:none}
.page-lessons .lesson-rail-inner{display:flex;align-items:center;gap:clamp(1.5rem,3vw,3rem);position:relative;padding-block:.9rem}
.page-lessons .lesson-rail-track{position:absolute;left:var(--container-pad);right:var(--container-pad);bottom:0;height:2px;background:rgba(16,24,32,.1)}
.page-lessons .lesson-rail-fill{position:absolute;inset:0 auto 0 0;width:33.333%;background:var(--c-neon-primary);box-shadow:0 0 10px rgba(157,255,0,.5);transition:width .6s cubic-bezier(.65,0,.35,1)}
.page-lessons .lesson-rail-item{display:inline-flex;align-items:center;gap:.55rem;font:700 .78rem var(--font-body);letter-spacing:.14em;text-transform:uppercase;color:var(--c-charcoal-soft);opacity:.5;transition:opacity .35s ease,color .35s ease}
.page-lessons .lesson-rail-num{font-family:var(--font-head);font-weight:800;color:var(--c-blue-primary)}
.page-lessons .lesson-rail-item:hover,.page-lessons .lesson-rail-item.is-current{opacity:1;color:var(--c-charcoal-deep)}
.page-lessons .lesson-rail-item.is-current .lesson-rail-num{color:var(--c-blue-deep)}

/* Sticks below the fixed header (91px once .scrolled shrinks its padding). */
@media(min-width:1024px){
  .page-lessons .lesson-rail{display:block;position:sticky;top:91px;z-index:40;background:rgba(255,255,255,.88);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid rgba(16,24,32,.06)}
  .page-lessons .program{scroll-margin-top:148px}
}

/* Editorial intro */
.page-lessons .format-intro{padding:clamp(4rem,7vw,6.5rem) 0 clamp(2rem,4vw,3rem);background:var(--c-white)}
.page-lessons .format-intro-title{font-size:clamp(2.6rem,6vw,5.2rem);line-height:.9;margin-bottom:1.25rem}
.page-lessons .format-intro-line{max-width:560px;font-size:1.05rem;color:var(--c-charcoal-soft)}

/* Program sections: background rhythm */
.page-lessons .program{padding:clamp(3.5rem,7vw,7rem) 0;scroll-margin-top:96px;position:relative;overflow:hidden}
.page-lessons .program--tennis{background:var(--c-white)}
.page-lessons .program--pickleball{background:linear-gradient(160deg,var(--c-blue-ice) 0%,var(--c-blue-pale) 100%)}
.page-lessons .program--group{background:#F7F7F5}

/* The section itself never moves; its children carry the motion. */
.page-lessons .program.reveal,.page-lessons .format-intro.reveal{opacity:1;transform:none;transition:none}

/* Layout: copy stacked left, media spanning right. On mobile the DOM order
   (head -> figure -> body) is exactly the required vertical order. */
.page-lessons .program-grid{display:grid;grid-template-columns:1fr 1fr;column-gap:clamp(2.5rem,5vw,5.5rem);row-gap:clamp(1.5rem,3vw,2.5rem);align-items:center}
.page-lessons .program-head{grid-column:1;grid-row:1;align-self:end}
.page-lessons .program-body{grid-column:1;grid-row:2;align-self:start}
.page-lessons .program-figure{grid-column:2;grid-row:1/span 2;align-self:center;margin:0;position:relative}
.page-lessons .program--flip .program-head,.page-lessons .program--flip .program-body{grid-column:2}
.page-lessons .program--flip .program-figure{grid-column:1}

/* Index + title */
.page-lessons .program-index{display:flex;align-items:center;gap:1rem;margin-bottom:1.1rem}
.page-lessons .program-num{font:800 clamp(1.1rem,1.6vw,1.35rem) var(--font-head);letter-spacing:.1em;color:var(--c-blue-deep)}
.page-lessons .program-rule{height:2px;width:clamp(40px,6vw,84px);background:var(--c-neon-primary)}
.page-lessons .program-title{font-size:clamp(2.4rem,5.4vw,4.6rem);line-height:.88;letter-spacing:-.01em}

/* Body copy */
.page-lessons .program-desc{font-size:1.08rem;max-width:460px;color:var(--c-charcoal-soft);margin-bottom:clamp(1.5rem,3vw,2.25rem)}

/* Pricing: thin separators, strong type, never a table */
.page-lessons .program-pricing{max-width:460px;margin-bottom:clamp(1.75rem,3vw,2.5rem);border-bottom:1px solid rgba(16,24,32,.14)}
.page-lessons .fee-row{display:flex;align-items:baseline;justify-content:space-between;gap:1.25rem;padding:.95rem 0;border-top:1px solid rgba(16,24,32,.14)}
.page-lessons .price-label{font:600 .78rem var(--font-body);letter-spacing:.14em;text-transform:uppercase;color:var(--c-charcoal-soft);white-space:nowrap}
.page-lessons .price-value{font:800 clamp(1.35rem,2.2vw,1.75rem) var(--font-head);color:var(--c-charcoal-deep);white-space:nowrap}
.page-lessons .price-unit{font-size:.55em;font-weight:700;letter-spacing:.06em;color:var(--c-charcoal-soft);margin-left:.1em}

/* Imagery: natural colour, modest radius, intentional crop */
.page-lessons .program-media{position:relative;aspect-ratio:4/3;border-radius:20px;overflow:hidden;background:var(--c-blue-pale);box-shadow:0 26px 60px rgba(16,24,32,.14),0 0 0 1px rgba(16,24,32,.05)}
.page-lessons .program-media img{width:100%;height:100%;object-fit:cover;filter:none}
.page-lessons .program--tennis .program-media img{object-position:center 35%}
.page-lessons .program--pickleball .program-media img{object-position:62% center}
.page-lessons .program--group .program-media img{object-position:center 40%}

/* Restrained trajectory / court graphics around the image */
.page-lessons .program-graphic{position:absolute;width:clamp(180px,26vw,300px);height:auto;pointer-events:none;z-index:2}
.page-lessons .program-graphic--tennis{right:-4%;bottom:-7%}
.page-lessons .program-graphic--pickle{left:-5%;bottom:-6%}
.page-lessons .program-graphic--group{right:-5%;top:-8%}
.page-lessons .pg-court,.page-lessons .pg-net,.page-lessons .pg-kitchen{stroke:var(--c-blue-primary);stroke-width:2;stroke-linecap:round;opacity:.5}
.page-lessons .pg-kitchen{stroke-dasharray:7 7;opacity:.7}
.page-lessons .pg-arc{stroke:var(--c-neon-primary);stroke-width:3.2;stroke-linecap:round;filter:drop-shadow(0 0 6px rgba(157,255,0,.45))}
.page-lessons .pg-ball{fill:var(--c-neon-primary);filter:drop-shadow(0 0 8px rgba(157,255,0,.6))}
.page-lessons .pg-mark{stroke:var(--c-blue-deep);stroke-width:2;opacity:.75}
.page-lessons .pg-mark circle{fill:none}
.page-lessons .pg-reset{stroke:var(--c-neon-primary);stroke-width:2;fill:none;opacity:.55}
.page-lessons .pg-cover{stroke:var(--c-blue-primary);stroke-width:2;stroke-linecap:round;stroke-dasharray:5 6;opacity:.6}
.page-lessons .pg-dots circle{fill:var(--c-neon-primary);stroke:var(--c-white);stroke-width:2.5}

/* ---------- Reveal choreography ---------- */
.page-lessons .program-head,
.page-lessons .program-figure,
.page-lessons .program-body,
.page-lessons .format-intro .eyebrow,
.page-lessons .format-intro-title,
.page-lessons .format-intro-line{opacity:0;transform:translateY(26px);transition:opacity .75s cubic-bezier(.2,.8,.2,1),transform .75s cubic-bezier(.2,.8,.2,1)}

.page-lessons .is-visible .program-head,
.page-lessons .is-visible .program-figure,
.page-lessons .is-visible .program-body,
.page-lessons .format-intro.is-visible .eyebrow,
.page-lessons .format-intro.is-visible .format-intro-title,
.page-lessons .format-intro.is-visible .format-intro-line{opacity:1;transform:none}

.page-lessons .is-visible .program-figure{transition-delay:.14s}
.page-lessons .is-visible .program-body{transition-delay:.24s}
.page-lessons .format-intro.is-visible .format-intro-title{transition-delay:.1s}
.page-lessons .format-intro.is-visible .format-intro-line{transition-delay:.2s}

/* Pricing lines draw in one after another */
.page-lessons .fee-row{clip-path:inset(0 100% 0 0);transition:clip-path .7s cubic-bezier(.65,0,.35,1)}
.page-lessons .is-visible .fee-row{clip-path:inset(0 0 0 0);transition-delay:.42s}
.page-lessons .is-visible .fee-row+.fee-row{transition-delay:.56s}

/* Court/trajectory graphics animate subtly on entry */
.page-lessons .pg-arc{stroke-dasharray:340;stroke-dashoffset:340;transition:stroke-dashoffset 1.15s cubic-bezier(.65,0,.35,1) .35s}
.page-lessons .is-visible .pg-arc{stroke-dashoffset:0}
.page-lessons .pg-ball,.page-lessons .pg-reset,.page-lessons .pg-mark,.page-lessons .pg-dots circle{opacity:0;transition:opacity .6s ease 1.15s}
.page-lessons .is-visible .pg-ball{opacity:1}
.page-lessons .is-visible .pg-mark{opacity:.75}
.page-lessons .is-visible .pg-reset{opacity:.55}
.page-lessons .is-visible .pg-dots circle{opacity:1}
.page-lessons .pg-dots circle:nth-child(2){transition-delay:1.28s}
.page-lessons .pg-dots circle:nth-child(3){transition-delay:1.41s}
.page-lessons .pg-dots circle:nth-child(4){transition-delay:1.54s}

/* Closing CTA now uses the shared .final-cta component (assets/css/widgets.css) */

/* ---------- Responsive ---------- */
@media(max-width:1023px){
  .page-lessons .program-graphic{width:clamp(150px,24vw,220px)}
}

@media(max-width:900px){
  .page-lessons .program-grid{grid-template-columns:1fr}
  .page-lessons .program .program-head,
  .page-lessons .program .program-body,
  .page-lessons .program .program-figure,
  .page-lessons .program--flip .program-head,
  .page-lessons .program--flip .program-body,
  .page-lessons .program--flip .program-figure{grid-column:1;grid-row:auto}
  .page-lessons .program-figure{margin:.5rem 0 1.75rem}
  .page-lessons .program-desc,.page-lessons .program-pricing{max-width:none}
  .page-lessons .program-media{aspect-ratio:4/3;border-radius:16px}
  .page-lessons .program-graphic{width:clamp(130px,34vw,180px)}
  .page-lessons .program-graphic--tennis{right:-2%;bottom:-5%}
  .page-lessons .program-graphic--pickle{left:-3%;bottom:-5%}
  .page-lessons .program-graphic--group{right:-3%;top:-6%}
}

@media(max-width:520px){
  .page-lessons .program-title{font-size:clamp(2rem,9vw,2.9rem)}
  .page-lessons .price-label{font-size:.7rem;letter-spacing:.1em}
  .page-lessons .price-value{font-size:1.3rem}
  .page-lessons .program-cta{width:100%}
}

@media(max-width:400px){
  .page-lessons .program-title{font-size:clamp(1.8rem,9.5vw,2.5rem)}
  .page-lessons .price-label{font-size:.66rem;letter-spacing:.07em}
}

@media(prefers-reduced-motion:reduce){
  .page-lessons .program-head,.page-lessons .program-figure,.page-lessons .program-body,
  .page-lessons .format-intro .eyebrow,.page-lessons .format-intro-title,.page-lessons .format-intro-line,
  .page-lessons .format-intro-line{opacity:1;transform:none}
  .page-lessons .fee-row{clip-path:none}
  .page-lessons .pg-arc{stroke-dashoffset:0}
  .page-lessons .pg-ball,.page-lessons .pg-dots circle{opacity:1}
  .page-lessons .pg-mark{opacity:.75}
  .page-lessons .pg-reset{opacity:.55}
}

/* Philosophy concept asset stage: one swappable editorial graphic per concept. */
.concept-visual{margin:0;overflow:hidden;border:1px solid rgba(255,255,255,.16);border-radius:22px;background:#0b141d;box-shadow:0 30px 80px rgba(0,0,0,.34),0 0 0 1px rgba(115,200,255,.05)}
.concept-assets{position:relative;aspect-ratio:4/5;overflow:hidden;background:linear-gradient(145deg,#162b3a,#0b141d)}
.concept-asset{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.018);transition:opacity .55s ease,transform .75s cubic-bezier(.2,.8,.2,1)}
.concept-asset.is-active{z-index:1;opacity:1;transform:scale(1)}
.concept-visual-caption{position:relative;z-index:2;display:grid;grid-template-columns:auto 1fr;gap:1rem;align-items:center;min-height:82px;padding:1.15rem 1.35rem;background:#101820;border-top:1px solid rgba(184,255,24,.28)}
.concept-visual-index{font:800 .72rem var(--font-head);letter-spacing:.14em;color:var(--c-neon-primary);white-space:nowrap}
.concept-visual-title{font:800 clamp(.92rem,1.45vw,1.18rem) var(--font-head);line-height:1.05;letter-spacing:.04em;text-align:right;color:var(--c-white)}
@media(max-width:800px){
  .philosophy-experience{display:block}
  .philosophy-sticky{position:sticky;top:86px;z-index:5;margin:0 calc(-1*var(--container-pad)) 1.5rem}
  .concept-visual{border-width:1px 0;border-radius:0;box-shadow:0 18px 42px rgba(0,0,0,.32)}
  .concept-assets{aspect-ratio:16/9}
  .concept-visual-caption{min-height:62px;padding:.85rem var(--container-pad)}
  .concept-visual-title{font-size:clamp(.8rem,3.2vw,1rem)}
  .concept-list{position:relative;z-index:1}
  .concept-step{padding:3.25rem 0;scroll-margin-top:calc(86px + 62vw)}
}
@media(max-width:440px){
  .philosophy-sticky{top:78px}
  .concept-visual-caption{min-height:58px;gap:.65rem;padding:.75rem var(--container-pad)}
  .concept-visual-index{font-size:.62rem}
  .concept-visual-title{font-size:.78rem}
  .concept-step{padding:2.75rem 0}
}
@media(prefers-reduced-motion:reduce){.concept-asset{transition:none;transform:none}}