:root {
    --mss-ink: #102a43;
    --mss-blue: #1e65a8;
    --mss-blue-deep: #134e83;
    --mss-sky: #e7f2f8;
    --mss-gold: #f7bd45;
    --mss-coral: #f27658;
    --mss-paper: #f8f8f3;
    --mss-white: #fff;
    --mss-muted: #617386;
    --mss-line: #d9e1e6;
    --mss-radius: 18px;
    --mss-font: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --mss-display: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--mss-paper); color: var(--mss-ink); font-family: var(--mss-font); -webkit-font-smoothing: antialiased; }
button, input, textarea { font: inherit; }
button { cursor: pointer; }
a { color: inherit; }
.mss-shell { overflow: hidden; }
.mss-skip { position: fixed; z-index: 99; top: 12px; left: 12px; padding: 12px 16px; transform: translateY(-150%); border-radius: 8px; background: var(--mss-ink); color: white; }
.mss-skip:focus { transform: translateY(0); }
.mss-topline { display: flex; min-height: 34px; align-items: center; justify-content: space-between; padding: 0 max(5.5vw, calc((100vw - 1320px) / 2)); background: var(--mss-ink); color: #d5e3ef; font-size: 10px; font-weight: 700; letter-spacing: .15em; }
.mss-topline a { color: #fff; text-decoration: none; font-size: 11px; letter-spacing: .02em; }
.mss-header { position: relative; z-index: 5; display: flex; width: min(1320px, 89%); min-height: 86px; align-items: center; justify-content: space-between; gap: 28px; margin: 0 auto; border-bottom: 1px solid var(--mss-line); }
.mss-brand { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 11px; color: var(--mss-ink); text-decoration: none; }
.mss-brand-mark { position: relative; display: flex; width: 36px; height: 36px; align-items: flex-end; gap: 3px; padding: 6px; border-radius: 11px; background: var(--mss-blue); transform: rotate(-4deg); }
.mss-brand-mark i { display: block; width: 6px; border-radius: 8px 8px 3px 3px; background: #fff; transform: skew(-12deg); }
.mss-brand-mark i:nth-child(1) { height: 12px; opacity: .68; }
.mss-brand-mark i:nth-child(2) { height: 19px; }
.mss-brand-mark i:nth-child(3) { height: 15px; background: var(--mss-gold); }
.mss-brand-name { font-family: var(--mss-display); font-size: 18px; font-weight: 800; letter-spacing: -.055em; }
.mss-brand-name b { color: var(--mss-blue); }
.mss-nav { display: flex; align-items: center; gap: clamp(18px, 2.8vw, 40px); }
.mss-nav a { color: #455b70; font-size: 13px; font-weight: 700; text-decoration: none; transition: color .18s ease; }
.mss-nav a:hover, .mss-nav a:focus-visible { color: var(--mss-blue); }
.mss-button { display: inline-flex; min-height: 52px; align-items: center; justify-content: center; gap: 23px; padding: 0 22px; border: 0; border-radius: 7px; background: var(--mss-blue); box-shadow: 0 8px 18px rgb(30 101 168 / .16); color: #fff; font-size: 14px; font-weight: 800; text-decoration: none; transition: background .18s ease, transform .18s ease, box-shadow .18s ease; }
.mss-button:hover { background: var(--mss-blue-deep); box-shadow: 0 10px 22px rgb(30 101 168 / .22); transform: translateY(-2px); }
.mss-button span { font-size: 17px; }
.mss-button-small { min-height: 43px; padding: 0 16px; font-size: 12px; }
.mss-home { width: min(1320px, 89%); margin: auto; }
.mss-hero { position: relative; display: grid; min-height: 630px; grid-template-columns: 1fr .9fr; align-items: center; gap: 36px; padding: 78px 0 76px; }
.mss-hero-copy { position: relative; z-index: 2; max-width: 640px; padding: 18px 0 34px; }
.mss-eyebrow { display: flex; align-items: center; gap: 9px; margin: 0 0 24px; color: var(--mss-blue); font-size: 10px; font-weight: 800; letter-spacing: .16em; line-height: 1.5; }
.mss-eyebrow > span:not(.mss-live-dot) { color: var(--mss-coral); }
.mss-live-dot { width: 8px; height: 8px; border-radius: 50%; background: #62b77b; box-shadow: 0 0 0 4px rgb(98 183 123 / .16); }
.mss-hero h1, .mss-section h2, .mss-join h2 { margin: 0; color: var(--mss-ink); font-family: var(--mss-display); font-size: clamp(54px, 7vw, 94px); font-weight: 800; letter-spacing: -.075em; line-height: .99; }
.mss-hero h1 em, .mss-section h2 em, .mss-join h2 em { color: var(--mss-blue); font-style: normal; }
.mss-hero-lead { max-width: 510px; margin: 27px 0 29px; color: #536a7e; font-size: clamp(16px, 1.45vw, 19px); line-height: 1.7; }
.mss-hero-actions { display: flex; align-items: center; gap: 27px; flex-wrap: wrap; }
.mss-text-link { display: inline-flex; align-items: center; gap: 12px; color: var(--mss-ink); font-size: 13px; font-weight: 800; text-decoration: none; }
.mss-text-link span { color: var(--mss-coral); font-size: 18px; transition: transform .18s ease; }
.mss-text-link:hover span { transform: translate(3px, -2px); }
.mss-hero-note { display: flex; align-items: center; gap: 12px; margin-top: 47px; color: var(--mss-muted); font-size: 12px; line-height: 1.6; }
.mss-hero-note strong { color: var(--mss-ink); }
.mss-note-star { display: grid; width: 36px; height: 36px; place-items: center; border-radius: 50%; background: #fff0cb; color: #c37e00; font-size: 20px; }
.mss-hero-art { position: relative; min-height: 455px; overflow: hidden; border-radius: 46% 46% 20px 20px / 35% 35% 20px 20px; background: linear-gradient(145deg, #d7edf4 0%, #b5d5e2 50%, #87bdcf 100%); box-shadow: 0 25px 70px rgb(16 42 67 / .12); }
.mss-hero-art::before { position: absolute; inset: 10% 12%; border: 1px solid rgb(255 255 255 / .5); border-radius: 50%; content: ""; }
.mss-hero-art::after { position: absolute; top: 51%; left: 50%; width: 72%; height: 72%; border: 1px solid rgb(255 255 255 / .4); border-radius: 50%; content: ""; transform: translate(-50%, -50%); }
.mss-art-label { position: absolute; z-index: 3; color: var(--mss-ink); font-size: 9px; font-weight: 800; letter-spacing: .18em; line-height: 1.55; }
.mss-art-label-top { top: 10%; left: 12%; }
.mss-art-label-top b { color: var(--mss-blue); font-size: 12px; }
.mss-art-label-bottom { right: 7%; bottom: 8%; display: flex; gap: 7px; }
.mss-art-label-bottom span { padding: 8px 10px; border: 1px solid rgb(16 42 67 / .2); border-radius: 99px; background: rgb(255 255 255 / .42); font-size: 8px; letter-spacing: .08em; }
.mss-ball { position: absolute; z-index: 2; display: grid; place-items: center; border-radius: 50%; box-shadow: 0 28px 34px rgb(16 42 67 / .2), inset -13px -16px 22px rgb(16 42 67 / .12), inset 8px 9px 15px rgb(255 255 255 / .65); }
.mss-ball-water { top: 25%; left: 16%; width: clamp(130px, 15vw, 190px); aspect-ratio: 1; background: radial-gradient(circle at 32% 25%, #ff9a79, #e64e39 72%); transform: rotate(-18deg); }
.mss-ball-seam { position: absolute; width: 112%; height: 37%; border: 2px solid rgb(255 255 255 / .8); border-right-color: transparent; border-left-color: transparent; border-radius: 50%; transform: rotate(42deg); }
.mss-ball-seam-two { width: 34%; height: 115%; border-color: transparent rgb(255 255 255 / .78); transform: rotate(42deg); }
.mss-ball-volley { right: 10%; bottom: 16%; width: clamp(150px, 17vw, 225px); aspect-ratio: 1; background: radial-gradient(circle at 32% 24%, #fff9df, #f1bb4d 75%); transform: rotate(20deg); }
.mss-ball-volley i, .mss-ball-volley span { position: absolute; width: 78%; height: 100%; border: 2px solid rgb(16 42 67 / .75); border-top-color: transparent; border-bottom-color: transparent; border-radius: 50%; }
.mss-ball-volley span:nth-child(1) { transform: rotate(0deg); }
.mss-ball-volley span:nth-child(2) { transform: rotate(60deg); }
.mss-ball-volley span:nth-child(3) { transform: rotate(-60deg); }
.mss-art-wave { position: absolute; z-index: 1; width: 50%; height: 40%; border: 2px solid rgb(255 255 255 / .58); border-radius: 50%; transform: rotate(-18deg); }
.mss-art-wave-one { bottom: 16%; left: 6%; }
.mss-art-wave-two { bottom: 8%; left: 12%; }
.mss-art-cross { position: absolute; z-index: 3; color: white; font-weight: 700; }
.mss-cross-one { top: 31%; right: 16%; font-size: 26px; }
.mss-cross-two { top: 57%; left: 13%; color: #fff6dc; font-size: 23px; }
.mss-hero-index { position: absolute; right: 0; bottom: 34px; display: flex; align-items: center; gap: 10px; color: #8293a2; font-size: 10px; font-weight: 800; letter-spacing: .1em; }
.mss-hero-index > span:first-child { color: var(--mss-blue); }
.mss-index-line { width: 37px; height: 1px; background: #bdcbd3; }
.mss-proof { display: grid; grid-template-columns: repeat(4, 1fr); margin: 0 0 108px; padding: 28px 0; border-top: 1px solid var(--mss-line); border-bottom: 1px solid var(--mss-line); }
.mss-proof > div { display: flex; min-height: 54px; align-items: center; gap: 14px; padding: 4px 20px; border-right: 1px solid var(--mss-line); }
.mss-proof > div:first-child { padding-left: 0; }
.mss-proof > div:last-child { border: 0; }
.mss-proof strong { flex: 0 0 auto; color: var(--mss-blue); font-family: var(--mss-display); font-size: 31px; font-weight: 800; letter-spacing: -.08em; }
.mss-proof strong span { color: var(--mss-coral); }
.mss-proof > div > span { max-width: 145px; color: var(--mss-muted); font-size: 11px; font-weight: 600; line-height: 1.45; }
.mss-section { padding: 84px 0; scroll-margin-top: 30px; }
.mss-intro { display: grid; grid-template-columns: .46fr 1.54fr; gap: 45px; padding-top: 0; }
.mss-section-side { position: relative; display: flex; flex-direction: column; justify-content: space-between; min-height: 330px; }
.mss-section-side .mss-eyebrow { max-width: 170px; align-items: flex-start; flex-direction: column; }
.mss-big-number { color: #e4e9e9; font-family: var(--mss-display); font-size: 120px; font-weight: 800; letter-spacing: -.12em; line-height: .8; }
.mss-section h2 { font-size: clamp(44px, 5.3vw, 68px); }
.mss-intro-lead { max-width: 750px; margin: 25px 0 48px; color: #536a7e; font-size: 17px; line-height: 1.75; }
.mss-value-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.mss-value-grid article { padding-top: 18px; border-top: 2px solid var(--mss-blue); }
.mss-value-grid article > span { color: var(--mss-coral); font-size: 9px; font-weight: 800; letter-spacing: .14em; }
.mss-value-grid h3 { margin: 13px 0 8px; font-family: var(--mss-display); font-size: 19px; letter-spacing: -.04em; }
.mss-value-grid p, .mss-section-heading > p { margin: 0; color: var(--mss-muted); font-size: 13px; line-height: 1.7; }
.mss-programs { margin: 36px calc((89vw - min(1320px, 89vw)) / -2); padding: 95px max(5.5vw, calc((100vw - 1320px) / 2)); background: #edf3f5; }
.mss-section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 45px; margin-bottom: 43px; }
.mss-section-heading .mss-eyebrow, .mss-news-heading .mss-eyebrow { margin-bottom: 17px; }
.mss-section-heading > p { max-width: 325px; margin-bottom: 7px; }
.mss-program-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 17px; }
.mss-program-card { position: relative; display: flex; min-height: 435px; flex-direction: column; padding: 25px; overflow: hidden; border-radius: var(--mss-radius); background: white; box-shadow: 0 12px 35px rgb(16 42 67 / .045); }
.mss-program-water { background: linear-gradient(155deg, white 50%, #e1f1f5); }
.mss-program-volley { background: linear-gradient(155deg, white 50%, #fff1da); }
.mss-program-prep { background: linear-gradient(155deg, white 50%, #e8eddf); }
.mss-card-top { display: flex; align-items: center; justify-content: space-between; color: #627588; font-size: 9px; font-weight: 800; letter-spacing: .16em; }
.mss-card-arrow { color: var(--mss-coral); font-size: 20px; }
.mss-sport-illustration { position: relative; display: grid; width: 115px; height: 105px; place-items: center; margin: 16px auto 17px; }
.mss-sport-illustration b { position: relative; z-index: 2; color: var(--mss-ink); font-family: var(--mss-display); font-size: 34px; font-weight: 800; }
.mss-water-icon i { position: absolute; width: 76px; height: 23px; border: 3px solid #4d9eb7; border-right: 0; border-left: 0; border-radius: 50%; transform: rotate(-22deg); }
.mss-water-icon i:nth-child(1) { top: 14px; left: 13px; }
.mss-water-icon i:nth-child(2) { top: 40px; left: 21px; border-color: #f27658; }
.mss-water-icon i:nth-child(3) { top: 66px; left: 12px; }
.mss-volley-icon i { position: absolute; width: 73px; height: 91px; border: 3px solid #df9841; border-top-color: transparent; border-bottom-color: transparent; border-radius: 50%; transform: rotate(45deg); }
.mss-volley-icon i:nth-child(2) { transform: rotate(-45deg); border-color: #1e65a8; border-top-color: transparent; border-bottom-color: transparent; }
.mss-volley-icon i:nth-child(3) { width: 100px; height: 70px; transform: rotate(0); border-color: #f27658; border-right-color: transparent; border-left-color: transparent; }
.mss-prep-icon i { position: absolute; width: 95px; height: 32px; border: 3px solid #5c8c77; border-right: 0; border-left: 0; border-radius: 50%; transform: rotate(-35deg); }
.mss-prep-icon i:nth-child(2) { transform: rotate(35deg); border-color: #e2a533; }
.mss-prep-icon i:nth-child(3) { width: 26px; height: 26px; border: 0; background: #f27658; }
.mss-program-card h3 { margin: 0 0 11px; font-family: var(--mss-display); font-size: 24px; font-weight: 800; letter-spacing: -.055em; }
.mss-program-card > p { margin: 0 0 23px; color: #5b7082; font-size: 12px; line-height: 1.7; }
.mss-card-meta { display: flex; flex-direction: column; gap: 5px; margin-top: auto; padding: 13px 0; border-top: 1px solid rgb(16 42 67 / .11); color: #667b8b; font-size: 10px; }
.mss-card-meta span:first-child { color: var(--mss-ink); font-weight: 800; }
.mss-card-link { display: flex; align-items: center; justify-content: space-between; padding-top: 8px; color: var(--mss-blue); font-size: 11px; font-weight: 800; text-decoration: none; }
.mss-card-link span { font-size: 17px; }
.mss-schedule { display: grid; grid-template-columns: .68fr 1.32fr; gap: 70px; }
.mss-schedule-heading .mss-eyebrow { align-items: flex-start; flex-direction: column; }
.mss-schedule-heading h2 { font-size: clamp(43px, 5vw, 64px); }
.mss-schedule-note { max-width: 300px; margin-top: 23px; color: var(--mss-muted); font-size: 13px; line-height: 1.7; }
.mss-schedule-block { padding: 0 0 28px; border-bottom: 1px solid var(--mss-line); }
.mss-schedule-block + .mss-schedule-block { padding-top: 27px; }
.mss-schedule-title { display: flex; align-items: center; gap: 11px; margin-bottom: 13px; }
.mss-schedule-title h3 { margin: 0; font-family: var(--mss-display); font-size: 17px; font-weight: 800; letter-spacing: -.04em; }
.mss-schedule-title small { color: var(--mss-muted); font-family: var(--mss-font); font-size: 11px; font-weight: 500; letter-spacing: 0; }
.mss-sport-dot { width: 10px; height: 10px; border-radius: 50%; }
.dot-water { background: #45a1bb; }
.dot-volley { background: #f0ac3c; }
.dot-prep { background: #6b9b7b; }
.mss-time-row { display: grid; grid-template-columns: 110px 1fr 1fr; gap: 10px; padding: 8px 0; border-top: 1px solid #e8edef; color: #5f7383; font-size: 11px; }
.mss-time-row b { color: var(--mss-ink); }
.mss-venue { display: grid; grid-template-columns: 1fr 1fr; gap: 5px 18px; padding: 12px 0; border-top: 1px solid #e8edef; font-size: 11px; }
.mss-venue strong { color: var(--mss-ink); }
.mss-venue > span { color: var(--mss-muted); }
.mss-venue p { grid-column: 1 / -1; margin: 2px 0 0; color: var(--mss-blue); font-weight: 700; }
.mss-clubs { margin: 20px calc((89vw - min(1320px, 89vw)) / -2); padding: 95px max(5.5vw, calc((100vw - 1320px) / 2)); background: var(--mss-ink); color: white; }
.mss-clubs .mss-section-heading h2 { color: white; }
.mss-clubs .mss-section-heading h2 em { color: var(--mss-gold); }
.mss-clubs .mss-section-heading > p { color: #b7c9d7; }
.mss-clubs .mss-eyebrow { color: #a8c7e2; }
.mss-clubs .mss-eyebrow > span { color: var(--mss-gold); }
.mss-club-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.mss-club-card { position: relative; min-height: 370px; padding: 31px; overflow: hidden; border-radius: var(--mss-radius); background: #173a58; }
.mss-club-rope { background: #1e486a; }
.mss-club-number { position: absolute; top: 6px; right: 20px; color: rgb(255 255 255 / .07); font-family: var(--mss-display); font-size: 100px; font-weight: 800; letter-spacing: -.1em; }
.mss-club-card .mss-eyebrow { position: relative; z-index: 1; margin: 5px 0 22px; font-size: 9px; }
.mss-club-card h3 { position: relative; z-index: 1; margin: 0 0 16px; color: white; font-family: var(--mss-display); font-size: 38px; font-weight: 800; letter-spacing: -.07em; line-height: 1.02; }
.mss-club-card > p:not(.mss-eyebrow) { max-width: 490px; color: #d1dee6; font-size: 12px; line-height: 1.75; }
.mss-club-foot { position: absolute; right: 31px; bottom: 26px; left: 31px; display: flex; justify-content: space-between; padding-top: 13px; border-top: 1px solid rgb(255 255 255 / .18); color: #f6c65d; font-size: 11px; font-weight: 700; }
.mss-pricing { padding-bottom: 88px; }
.mss-price-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; }
.mss-price-card { min-height: 260px; padding: 25px; border: 1px solid var(--mss-line); border-radius: var(--mss-radius); background: white; }
.mss-price-featured { border: 2px solid var(--mss-blue); box-shadow: 0 16px 38px rgb(30 101 168 / .1); }
.mss-price-label { color: var(--mss-blue); font-size: 9px; font-weight: 800; letter-spacing: .15em; }
.mss-price-card h3 { margin: 18px 0 8px; font-family: var(--mss-display); font-size: 23px; font-weight: 800; letter-spacing: -.05em; }
.mss-price { margin: 0 0 14px; color: var(--mss-blue); }
.mss-price strong { font-family: var(--mss-display); font-size: 34px; letter-spacing: -.07em; }
.mss-price small { color: var(--mss-muted); font-size: 11px; }
.mss-price-card > p:not(.mss-price) { min-height: 40px; margin: 0 0 14px; color: var(--mss-muted); font-size: 11px; line-height: 1.55; }
.mss-price-account { display: block; padding-top: 10px; border-top: 1px solid #e5ebee; color: #758593; font-size: 10px; }
.mss-pair-rate { display: flex; align-items: center; gap: 18px; margin-top: 17px; padding: 20px 23px; border-radius: 12px; background: #fff0cb; }
.mss-pair-icon { display: grid; width: 40px; height: 40px; flex: 0 0 auto; place-items: center; border-radius: 50%; background: white; color: var(--mss-blue); font-size: 20px; }
.mss-pair-rate > div { flex: 1; }
.mss-pair-rate strong { font-family: var(--mss-display); font-size: 13px; }
.mss-pair-rate p { margin: 5px 0 0; color: #66583a; font-size: 11px; line-height: 1.55; }
.mss-discount { color: #8a641d; font-size: 9px; font-weight: 800; letter-spacing: .12em; line-height: 1.6; text-align: right; }
.mss-payment-details { margin-top: 14px; color: var(--mss-muted); font-size: 11px; }
.mss-payment-details summary { width: fit-content; cursor: pointer; color: var(--mss-blue); font-weight: 800; }
.mss-payment-details > div { display: flex; flex-wrap: wrap; gap: 20px 40px; padding: 12px 0; }
.mss-payment-details p { margin: 0; line-height: 1.7; }
.mss-payment-details strong { color: var(--mss-ink); }
.mss-news { padding-top: 65px; border-top: 1px solid var(--mss-line); }
.mss-news-heading { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 34px; }
.mss-news-heading h2 { font-size: clamp(42px, 4.8vw, 60px); }
.mss-news-heading > .mss-text-link { margin-bottom: 9px; }
.mss-news-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.mss-news-card { min-width: 0; padding-bottom: 18px; border-bottom: 1px solid var(--mss-line); }
.mss-news-image { display: grid; height: 210px; place-items: center; overflow: hidden; border-radius: 12px; background: linear-gradient(145deg, #d7edf4, #9cc9d8); text-decoration: none; }
.mss-news-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.mss-news-card:hover .mss-news-image img { transform: scale(1.04); }
.mss-news-placeholder { color: rgb(16 42 67 / .2); font-family: var(--mss-display); font-size: 50px; font-weight: 800; letter-spacing: -.12em; }
.mss-news-meta { display: flex; justify-content: space-between; gap: 8px; margin: 16px 0 9px; color: #738697; font-size: 9px; font-weight: 700; }
.mss-news-meta span { color: var(--mss-blue); letter-spacing: .1em; text-transform: uppercase; }
.mss-news-card h3 { margin: 0 0 8px; font-family: var(--mss-display); font-size: 20px; font-weight: 800; letter-spacing: -.05em; line-height: 1.25; }
.mss-news-card h3 a { text-decoration: none; }
.mss-news-card > p { margin: 0 0 13px; color: var(--mss-muted); font-size: 11px; line-height: 1.6; }
.mss-news-more { display: inline-flex; gap: 8px; color: var(--mss-blue); font-size: 10px; font-weight: 800; text-decoration: none; }
.mss-news-empty { display: flex; align-items: center; gap: 20px; padding: 25px; border: 1px dashed #bdccd4; border-radius: 12px; }
.mss-empty-mark { color: var(--mss-coral); font-size: 28px; }
.mss-news-empty > div { flex: 1; }
.mss-news-empty h3 { margin: 0 0 4px; font-family: var(--mss-display); font-size: 17px; }
.mss-news-empty p { margin: 0; color: var(--mss-muted); font-size: 11px; }
.mss-join { position: relative; display: grid; grid-template-columns: 1fr .65fr; align-items: center; gap: 40px; margin: 50px 0 90px; padding: 62px 7%; overflow: hidden; border-radius: 22px; background: var(--mss-blue); color: white; }
.mss-join .mss-eyebrow { position: relative; z-index: 1; color: #bfe0f4; }
.mss-join h2 { position: relative; z-index: 1; color: white; font-size: clamp(43px, 5vw, 63px); }
.mss-join h2 em { color: var(--mss-gold); }
.mss-join-action { position: relative; z-index: 1; }
.mss-join-action p { margin: 0 0 20px; color: #d9eaf5; font-size: 13px; line-height: 1.7; }
.mss-button-light { background: var(--mss-gold); box-shadow: none; color: var(--mss-ink); }
.mss-button-light:hover { background: #ffd16a; color: var(--mss-ink); }
.mss-join-shape { position: absolute; right: 16%; bottom: -80px; color: rgb(255 255 255 / .08); font-family: var(--mss-display); font-size: 260px; font-weight: 800; letter-spacing: -.13em; line-height: 1; }
.mss-footer { padding: 0 max(5.5vw, calc((100vw - 1320px) / 2)); background: #0b2034; color: white; }
.mss-footer-main { display: grid; grid-template-columns: 1fr 1fr auto; align-items: center; gap: 30px; padding: 45px 0; }
.mss-brand-light { color: white; }
.mss-brand-light .mss-brand-name { color: white; }
.mss-brand-light .mss-brand-name b { color: var(--mss-gold); }
.mss-footer-main > p { margin: 0; color: #b6c8d7; font-size: 12px; line-height: 1.6; }
.mss-footer-mail { color: #d7e3ec; font-size: 12px; text-decoration: none; }
.mss-footer-bottom { display: flex; min-height: 55px; align-items: center; justify-content: space-between; gap: 15px; border-top: 1px solid rgb(255 255 255 / .14); color: #91a7b9; font-size: 10px; }
.mss-footer-bottom a { color: #c7d6e1; text-decoration: none; }

/* Ghost article and static page templates */
.gh-main { width: min(100%, 1100px); margin: 0 auto; padding: 46px 5.5% 90px; }
.gh-article-header, .gh-content { max-width: 820px; margin-right: auto; margin-left: auto; }
.gh-article-title { color: var(--mss-ink); font-family: var(--mss-display); font-size: clamp(38px, 6vw, 66px); letter-spacing: -.07em; line-height: 1.05; }
.gh-article-tag, .gh-article-meta a { color: var(--mss-blue); }
.gh-article-excerpt { color: var(--mss-muted); font-size: 18px; }
.gh-content { color: #344b5f; font-family: var(--mss-font); font-size: 17px; line-height: 1.8; }
.gh-content h2, .gh-content h3, .gh-content h4 { color: var(--mss-ink); font-family: var(--mss-display); letter-spacing: -.05em; }
.gh-content a { color: var(--mss-blue); }
.gh-content img { border-radius: 12px; }
.gh-comments, .gh-container { width: min(100%, 1100px); margin: 0 auto; padding: 30px 5.5%; }

@media (max-width: 900px) {
    .mss-header { width: 90%; gap: 15px; }
    .mss-nav { gap: 15px; }
    .mss-nav a { font-size: 11px; }
    .mss-hero { min-height: 550px; grid-template-columns: 1fr .82fr; gap: 17px; }
    .mss-hero-art { min-height: 370px; }
    .mss-proof > div { gap: 9px; padding: 3px 11px; }
    .mss-proof strong { font-size: 27px; }
    .mss-proof > div > span { font-size: 10px; }
    .mss-schedule { grid-template-columns: .58fr 1.42fr; gap: 32px; }
    .mss-program-card { padding: 20px; }
}
@media (max-width: 680px) {
    .mss-topline { min-height: 31px; padding: 0 5%; font-size: 8px; letter-spacing: .1em; }
    .mss-topline a { font-size: 9px; }
    .mss-header { width: 90%; min-height: 72px; flex-wrap: wrap; justify-content: space-between; gap: 8px; padding: 11px 0; }
    .mss-brand-mark { width: 31px; height: 31px; }
    .mss-brand-name { font-size: 16px; }
    .mss-header > .mss-button { min-height: 37px; gap: 10px; padding: 0 11px; font-size: 10px; }
    .mss-nav { order: 3; width: 100%; justify-content: space-between; gap: 7px; padding: 6px 0 1px; }
    .mss-nav a { font-size: 10px; }
    .mss-home { width: 90%; }
    .mss-hero { min-height: auto; grid-template-columns: 1fr; gap: 22px; padding: 55px 0 55px; }
    .mss-hero-copy { padding: 0; }
    .mss-hero h1 { font-size: clamp(57px, 16vw, 78px); }
    .mss-hero-lead { margin: 19px 0 22px; font-size: 15px; }
    .mss-hero-actions { align-items: flex-start; flex-direction: column; gap: 17px; }
    .mss-hero-note { margin-top: 25px; }
    .mss-hero-art { min-height: 330px; margin: 0 8px; border-radius: 44% 44% 18px 18px / 30% 30% 18px 18px; }
    .mss-ball-water { left: 16%; width: 145px; }
    .mss-ball-volley { right: 10%; bottom: 14%; width: 165px; }
    .mss-hero-index { bottom: 17px; }
    .mss-proof { grid-template-columns: 1fr 1fr; margin-bottom: 68px; padding: 14px 0; }
    .mss-proof > div { min-height: 64px; padding: 8px 10px; border-right: 0; }
    .mss-proof > div:nth-child(odd) { padding-left: 0; border-right: 1px solid var(--mss-line); }
    .mss-proof > div:nth-child(n+3) { border-top: 1px solid var(--mss-line); }
    .mss-proof strong { min-width: 50px; font-size: 28px; }
    .mss-proof > div > span { font-size: 9px; }
    .mss-section { padding: 60px 0; }
    .mss-intro { grid-template-columns: 1fr; gap: 14px; padding-top: 0; }
    .mss-section-side { min-height: auto; }
    .mss-section-side .mss-eyebrow { flex-direction: row; max-width: unset; margin-bottom: 13px; }
    .mss-big-number { display: none; }
    .mss-section h2 { font-size: clamp(43px, 12vw, 58px); }
    .mss-intro-lead { margin: 19px 0 28px; font-size: 14px; }
    .mss-value-grid { grid-template-columns: 1fr; gap: 20px; }
    .mss-value-grid article { padding-top: 13px; }
    .mss-value-grid h3 { margin: 8px 0 5px; font-size: 17px; }
    .mss-value-grid p { font-size: 12px; }
    .mss-programs, .mss-clubs { margin-right: -5.56%; margin-left: -5.56%; padding: 64px 5%; }
    .mss-section-heading { align-items: flex-start; flex-direction: column; gap: 16px; margin-bottom: 27px; }
    .mss-section-heading > p { font-size: 12px; }
    .mss-program-grid { grid-template-columns: 1fr; gap: 12px; }
    .mss-program-card { min-height: 390px; padding: 22px; }
    .mss-schedule { grid-template-columns: 1fr; gap: 28px; }
    .mss-schedule-heading .mss-eyebrow { flex-direction: row; }
    .mss-schedule-heading h2 { font-size: 49px; }
    .mss-schedule-note { margin-top: 15px; font-size: 12px; }
    .mss-time-row { grid-template-columns: 82px 1fr; font-size: 10px; }
    .mss-time-row span:last-child:nth-child(3) { grid-column: 2; }
    .mss-schedule-title h3 { font-size: 15px; }
    .mss-schedule-title small { display: block; margin-top: 3px; }
    .mss-venue { grid-template-columns: 1fr; gap: 4px; font-size: 10px; }
    .mss-venue p { grid-column: 1; }
    .mss-club-grid { grid-template-columns: 1fr; gap: 12px; }
    .mss-club-card { min-height: 330px; padding: 24px; }
    .mss-club-number { font-size: 82px; }
    .mss-club-card h3 { font-size: 34px; }
    .mss-club-foot { right: 24px; left: 24px; }
    .mss-price-grid { grid-template-columns: 1fr; gap: 10px; }
    .mss-price-card { min-height: auto; padding: 21px; }
    .mss-price-card > p:not(.mss-price) { min-height: auto; }
    .mss-pair-rate { align-items: flex-start; gap: 10px; padding: 15px; }
    .mss-pair-icon { width: 31px; height: 31px; }
    .mss-pair-rate p { font-size: 10px; }
    .mss-discount { display: none; }
    .mss-payment-details > div { flex-direction: column; gap: 10px; }
    .mss-news { padding-top: 48px; }
    .mss-news-heading { align-items: flex-start; flex-direction: column; gap: 15px; }
    .mss-news-grid { grid-template-columns: 1fr; gap: 24px; }
    .mss-news-image { height: 215px; }
    .mss-news-empty { align-items: flex-start; flex-wrap: wrap; padding: 18px; }
    .mss-news-empty > div { min-width: calc(100% - 60px); }
    .mss-news-empty > .mss-text-link { margin-left: 47px; }
    .mss-join { grid-template-columns: 1fr; gap: 18px; margin: 35px 0 60px; padding: 36px 25px; }
    .mss-join h2 { font-size: 46px; }
    .mss-join-action p { font-size: 12px; }
    .mss-join-shape { right: 1%; bottom: -15px; font-size: 150px; }
    .mss-footer { padding: 0 5%; }
    .mss-footer-main { grid-template-columns: 1fr; gap: 14px; padding: 32px 0; }
    .mss-footer-main > p { font-size: 11px; }
    .mss-footer-bottom { align-items: flex-start; flex-direction: column; justify-content: center; gap: 5px; padding: 13px 0; font-size: 9px; }
    .gh-main { padding: 34px 5% 60px; }
    .gh-article-title { font-size: 40px; }
    .gh-content { font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* Editorial, multi-page portal templates */
.mss-page { width: min(1160px, 90%); margin: 0 auto; }
.mss-breadcrumb { display: flex; flex-wrap: wrap; gap: 10px; padding: 24px 0 16px; color: #728294; font-size: 13px; }
.mss-breadcrumb a { color: var(--mss-blue); text-decoration: none; }
.mss-breadcrumb a:hover { text-decoration: underline; }
.mss-page-hero { display: grid; grid-template-columns: .92fr 1.08fr; align-items: center; gap: clamp(35px, 6vw, 82px); min-height: 500px; padding: 42px 0 70px; }
.mss-page-hero-copy { max-width: 510px; }
.mss-page-hero-copy .mss-eyebrow { margin-bottom: 18px; }
.mss-page-hero h1, .mss-listing-hero h1 { margin: 0; color: var(--mss-ink); font-family: var(--mss-display); font-size: clamp(45px, 6vw, 76px); font-weight: 750; letter-spacing: -.045em; line-height: 1.04; }
.mss-page-hero h1 em, .mss-listing-hero h1 em { color: var(--mss-blue); font-style: normal; }
.mss-page-hero-copy > p:not(.mss-eyebrow) { margin: 22px 0 26px; color: #536a7e; font-size: 18px; line-height: 1.75; }
.mss-page-hero-photo { position: relative; height: clamp(300px, 40vw, 465px); margin: 0; overflow: hidden; border-radius: 18px; background: #dce8ea; }
.mss-page-hero-photo::after { position: absolute; inset: 45% 0 0; background: linear-gradient(transparent, rgb(8 25 39 / .52)); content: ""; }
.mss-page-hero-photo img { width: 100%; height: 100%; object-fit: cover; }
.mss-page-hero-photo figcaption { position: absolute; z-index: 1; right: 20px; bottom: 17px; left: 20px; color: white; font-size: 13px; font-weight: 600; }
.mss-page-hero-water { --sport-accent: #2b90ac; }
.mss-page-hero-volley { --sport-accent: #cc9142; }
.mss-page-hero-prep { --sport-accent: #648e76; }
.mss-page-hero .mss-eyebrow { color: var(--sport-accent, var(--mss-blue)); }
.mss-page-body { width: min(820px, 100%); margin: 0 auto; padding: 12px 0 100px; }
.mss-page-body > section { padding: 42px 0 48px; border-top: 1px solid var(--mss-line); }
.mss-page-body > section:first-child { border-top: 0; }
.mss-page-body .mss-eyebrow { margin-bottom: 16px; }
.mss-page-body h2, .mss-feature-story h2 { margin: 0 0 20px; color: var(--mss-ink); font-size: clamp(32px, 4.3vw, 48px); font-weight: 700; letter-spacing: -.04em; line-height: 1.13; }
.mss-page-body h2 em { color: var(--mss-blue); font-style: normal; }
.mss-page-body p:not(.mss-eyebrow):not(.mss-data-note) { color: #455d70; font-size: 17px; line-height: 1.8; }
.mss-page-callout { margin: 12px 0 38px; padding: 27px 30px; border-left: 4px solid var(--mss-gold); border-radius: 0 12px 12px 0; background: #fff7e5; }
.mss-page-callout strong { color: var(--mss-ink); font-size: 19px; }
.mss-page-callout p { margin: 8px 0 0; color: #5f6570; font-size: 15px; line-height: 1.7; }
.mss-schedule-table { margin-top: 18px; border-top: 1px solid var(--mss-line); }
.mss-schedule-table > div { display: grid; grid-template-columns: 120px 1fr 1fr; gap: 14px; padding: 14px 10px; border-bottom: 1px solid var(--mss-line); color: #536a7e; font-size: 15px; line-height: 1.5; }
.mss-schedule-table > div:nth-child(even) { background: #f1f5f5; }
.mss-schedule-table b { color: var(--mss-ink); }
.mss-data-note { margin-top: 15px; color: #788694; font-size: 13px; line-height: 1.6; }
.mss-related-links { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 20px; }
.mss-related-links a { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 64px; padding: 16px; border: 1px solid var(--mss-line); border-radius: 10px; background: white; color: var(--mss-ink); font-size: 14px; font-weight: 650; text-decoration: none; transition: border-color .18s, transform .18s; }
.mss-related-links a:hover { transform: translateY(-2px); border-color: var(--mss-blue); }
.mss-related-links a span { color: var(--mss-blue); }
.mss-location-cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin-top: 24px; }
.mss-location-cards article { padding: 22px; border: 1px solid var(--mss-line); border-radius: 12px; background: white; }
.mss-location-cards h3 { margin: 0 0 9px; color: var(--mss-ink); font-size: 19px; letter-spacing: -.02em; }
.mss-location-cards p { margin: 0 0 13px; color: var(--mss-muted); font-size: 14px !important; line-height: 1.6 !important; }
.mss-location-cards span { display: block; color: var(--mss-blue); font-size: 14px; font-weight: 650; line-height: 1.65; }
.mss-result-photo { margin: 24px 0; }
.mss-result-photo img { display: block; width: 100%; max-height: 480px; border-radius: 14px; object-fit: cover; }
.mss-result-photo figcaption { margin-top: 9px; color: var(--mss-muted); font-size: 13px; line-height: 1.5; }
.mss-listing-hero { max-width: 820px; padding: 55px 0 60px; }
.mss-listing-hero .mss-eyebrow { margin-bottom: 18px; }
.mss-listing-hero > p:not(.mss-eyebrow) { max-width: 720px; margin: 20px 0 25px; color: #536a7e; font-size: 19px; line-height: 1.75; }
.mss-weekly-schedule, .mss-editorial-list { padding: 38px 0 54px; border-top: 1px solid var(--mss-line); }
.mss-page-content { margin: 0 0 28px; color: #455d70; font-size: 16px; line-height: 1.7; }
.mss-page-content:empty { display: none; }
.mss-page-content h2, .mss-page-content h3 { color: var(--mss-ink); letter-spacing: -.03em; }
.mss-page-content table { width: 100%; border-collapse: collapse; font-size: 14px; }
.mss-page-content th, .mss-page-content td { padding: 13px 12px; border-bottom: 1px solid var(--mss-line); text-align: left; vertical-align: top; }
.mss-page-content th { background: #edf3f5; color: var(--mss-ink); font-weight: 700; }
.mss-schedule-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 20px; }
.mss-schedule-section-head .mss-eyebrow { margin-bottom: 10px; }
.mss-schedule-section-head h2, .mss-bank-details h2 { margin: 0 0 8px; color: var(--mss-ink); font-size: 32px; letter-spacing: -.035em; }
.mss-schedule-section-head p:not(.mss-eyebrow) { margin: 0; color: var(--mss-muted); font-size: 15px; line-height: 1.6; }
.mss-schedule-section-head > a { color: var(--mss-blue); font-size: 14px; font-weight: 650; text-decoration: none; }
.mss-data-note-large { margin: 10px 0 70px; padding: 18px; border-radius: 10px; background: #eff4f5; }
.mss-price-grid-page { margin: 0 0 30px; }
.mss-price-grid-page .mss-price-card { padding: 28px; }
.mss-price-grid-page .mss-price-card h2 { margin: 20px 0 10px; font-size: 25px; letter-spacing: -.03em; }
.mss-price-grid-page .mss-price-card > p:not(.mss-price) { min-height: 70px; font-size: 14px; line-height: 1.65; }
.mss-bank-details { padding: 40px 0; }
.mss-bank-details > div { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
.mss-bank-details article { padding: 22px; border: 1px solid var(--mss-line); border-radius: 12px; background: white; }
.mss-bank-details h2 { font-size: 21px; }
.mss-bank-details article p { margin: 0 0 13px; color: var(--mss-muted); font-size: 14px; }
.mss-bank-details article strong { color: var(--mss-blue); font-size: 15px; letter-spacing: .025em; }
.mss-article-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.mss-article-card { min-width: 0; padding-bottom: 20px; border-bottom: 1px solid var(--mss-line); }
.mss-article-card-photo { display: grid; height: 235px; place-items: center; overflow: hidden; border-radius: 12px; background: #e8eff0; text-decoration: none; }
.mss-article-card-photo img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.mss-article-card:hover .mss-article-card-photo img { transform: scale(1.035); }
.mss-article-card h3 { margin: 0 0 9px; font-size: 21px; letter-spacing: -.025em; line-height: 1.3; }
.mss-article-card h3 a { text-decoration: none; }
.mss-article-card > p { margin: 0 0 14px; color: var(--mss-muted); font-size: 15px; line-height: 1.65; }
.mss-photo-fallback { color: #91a6b4; font-size: 16px; font-weight: 750; letter-spacing: .1em; }
.mss-empty-state { padding: 28px; border: 1px dashed #bdccd4; border-radius: 12px; background: #fff; }
.mss-empty-state h3 { margin: 0 0 7px; font-size: 20px; }
.mss-empty-state p { margin: 0; color: var(--mss-muted); font-size: 15px; line-height: 1.7; }
.mss-empty-state .mss-result-photo { margin-bottom: 0; }
.mss-feature-story { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 38px; padding: 44px 0 86px; }
.mss-feature-story figure { height: 330px; margin: 0; overflow: hidden; border-radius: 14px; }
.mss-feature-story img { width: 100%; height: 100%; object-fit: cover; }
.mss-feature-story h2 { font-size: 38px; }
.mss-feature-story > div > p:not(.mss-eyebrow) { color: var(--mss-muted); font-size: 16px; line-height: 1.7; }
@media (max-width: 900px) {
    .mss-header { flex-wrap: wrap; padding: 14px 0; }
    .mss-nav { order: 3; width: 100%; justify-content: center; gap: 17px; }
    .mss-nav a { font-size: 12px; }
    .mss-page-hero { gap: 28px; }
    .mss-article-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
    .mss-nav { justify-content: flex-start; overflow-x: auto; scrollbar-width: none; }
    .mss-nav::-webkit-scrollbar { display: none; }
    .mss-nav a { flex: 0 0 auto; padding: 5px 0; }
    .mss-page { width: 90%; }
    .mss-breadcrumb { gap: 7px; padding-top: 18px; font-size: 12px; }
    .mss-page-hero { grid-template-columns: 1fr; gap: 26px; min-height: unset; padding: 30px 0 45px; }
    .mss-page-hero h1, .mss-listing-hero h1 { font-size: clamp(43px, 12vw, 60px); }
    .mss-page-hero-copy > p:not(.mss-eyebrow) { margin: 16px 0 20px; font-size: 16px; }
    .mss-page-hero-photo { height: 290px; }
    .mss-page-body { padding-bottom: 65px; }
    .mss-page-body > section { padding: 32px 0 36px; }
    .mss-page-body h2, .mss-feature-story h2 { font-size: 34px; }
    .mss-page-body p:not(.mss-eyebrow):not(.mss-data-note) { font-size: 16px; }
    .mss-page-callout { padding: 21px; }
    .mss-schedule-table > div { grid-template-columns: 88px 1fr; gap: 6px 10px; padding: 12px 8px; font-size: 14px; }
    .mss-schedule-table > div span:nth-of-type(2) { grid-column: 2; }
    .mss-page-content { overflow-x: auto; }
    .mss-page-content table { min-width: 620px; }
    .mss-related-links, .mss-location-cards, .mss-bank-details > div { grid-template-columns: 1fr; }
    .mss-listing-hero { padding: 35px 0 40px; }
    .mss-listing-hero > p:not(.mss-eyebrow) { font-size: 16px; }
    .mss-schedule-section-head { align-items: flex-start; flex-direction: column; gap: 8px; }
    .mss-schedule-section-head h2 { font-size: 27px; }
    .mss-article-grid { grid-template-columns: 1fr; gap: 25px; }
    .mss-article-card-photo { height: 245px; }
    .mss-price-grid-page .mss-price-card > p:not(.mss-price) { min-height: unset; }
    .mss-feature-story { grid-template-columns: 1fr; gap: 23px; padding: 35px 0 60px; }
    .mss-feature-story figure { height: 250px; }
}
