:root { --navy: #1D3978; --turq: #45BCE0; --turq-dark: #1b7fa0; --sky: #EAF5FA; --white: #fff; --ink: #15243A; --muted: #617186; --line: #d6e3ec; --radius: 14px; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font: 17px/1.6 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; color: var(--ink); background: var(--white); }
img { max-width: 100%; height: auto; }
a { color: var(--navy); text-decoration-color: var(--turq); text-underline-offset: 3px; }
a:hover { color: var(--turq-dark); }
h1, h2, h3 { line-height: 1.2; color: var(--navy); margin: 0 0 .5em; }
h1 { font-size: clamp(2rem, 5vw, 3.2rem); } h2 { font-size: clamp(1.45rem, 3vw, 2rem); margin-top: 1.4em; } h3 { font-size: 1.2rem; }
.container { width: min(1120px, 100% - 32px); margin-inline: auto; }
.narrow { max-width: 640px; }
.skip { position: absolute; left: -999px; } .skip:focus { left: 8px; top: 8px; background: #fff; padding: 8px; z-index: 10; }
:focus-visible { outline: 3px solid var(--turq); outline-offset: 2px; }
.muted { color: var(--muted); } .small { font-size: .85rem; }
/* nagłówek */
.site-header { position: sticky; top: 0; z-index: 5; background: rgba(255,255,255,.96); backdrop-filter: blur(6px); border-bottom: 1px solid var(--line); }
.bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 68px; }
.brand { display: flex; align-items: center; gap: 12px; font-weight: 800; font-size: 1.25rem; color: var(--navy); text-decoration: none; }
.brand img { height: 46px; width: auto; border-radius: 4px; }
nav a { margin-left: 22px; text-decoration: none; font-weight: 600; color: var(--ink); } nav a:hover { color: var(--turq-dark); }
.nav-toggle { display: none; }
/* przyciski */
.btn { display: inline-block; background: var(--turq); color: #08253a; font-weight: 700; padding: .7em 1.3em; border-radius: 999px; border: 2px solid var(--turq); text-decoration: none; cursor: pointer; font-size: 1rem; transition: transform .15s, background .15s; }
.btn:hover { background: #6acbe9; color: #08253a; transform: translateY(-1px); }
.btn.ghost { background: transparent; color: var(--navy); border-color: var(--navy); } .btn.ghost:hover { background: var(--sky); color: var(--navy); }
.hero .btn.ghost { color: #fff; border-color: #fff; } .hero .btn.ghost:hover { background: rgba(255,255,255,.14); color: #fff; }
.btn.block { display: block; text-align: center; }
.more { font-weight: 700; }
/* hero */
.hero { color: #fff; position: relative; overflow: hidden; isolation: isolate;
  background: radial-gradient(900px 520px at 82% 10%, rgba(69,188,224,.30), transparent 62%),
              linear-gradient(135deg, rgba(29,57,120,.97) 0%, rgba(19,38,79,.97) 100%),
              var(--hero, none) center/cover, var(--navy); }
/* Motyw z logo klubu: duża, wyblakła figura po prawej, zanikająca ku tekstowi */
.hero::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .17; pointer-events: none;
  background: url("../img/logo.jpg") right 7% center / auto 125% no-repeat;
  -webkit-mask-image: linear-gradient(to left, #000 25%, transparent 85%); mask-image: linear-gradient(to left, #000 25%, transparent 85%); }
.hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: linear-gradient(90deg, var(--turq), transparent 70%); }
.hero-in { position: relative; padding: 88px 0 84px; max-width: 1120px; }
.hero h1 { color: #fff; margin-bottom: .25em; } .eyebrow { color: var(--turq); text-transform: uppercase; letter-spacing: .18em; font-weight: 700; font-size: .85rem; margin: 0 0 .4em; }
.lead { font-size: 1.2rem; max-width: 56ch; } .hero .cta { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 28px; }
.page-head { background: var(--sky); padding: 40px 0 28px; border-bottom: 4px solid var(--turq); } .page-head h1 { margin-bottom: .2em; } .page-head .lead { color: var(--ink); margin: 0; }
.lead-dark { font-size: 1.15rem; }
.section { padding: 56px 0; } .section.alt { background: var(--sky); } .section.alt > .container { padding: 0; }
.section h2:first-child { margin-top: 0; }
.two { display: grid; grid-template-columns: 1.4fr 1fr; gap: 40px; }
/* karty */
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 22px; }
.card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; } .pad { padding: 18px 20px; }
.photo-card { text-decoration: none; color: inherit; display: block; transition: box-shadow .2s, transform .2s; } .photo-card:hover { box-shadow: 0 10px 30px rgba(29,57,120,.14); transform: translateY(-2px); }
.photo-card img, .photo-card .ph { width: 100%; aspect-ratio: 16/10; object-fit: cover; display: block; }
.ph { background: url("../img/logo.jpg") center / auto 70% no-repeat, linear-gradient(135deg, #dcebf3, #eef6fa); background-blend-mode: soft-light, normal; opacity: .9; }
.empty { background: #fff; border: 2px dashed var(--line); border-radius: var(--radius); padding: 28px; text-align: center; color: var(--muted); }
.t-card { display: grid; grid-template-columns: 340px 1fr; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; margin-bottom: 20px; }
.t-card.featured { box-shadow: 0 12px 36px rgba(29,57,120,.12); border-top: 5px solid var(--turq); }
.t-img { width: 100%; height: 100%; min-height: 200px; object-fit: cover; } .t-body { padding: 22px 26px; } .t-body h3 { font-size: 1.5rem; } .t-body h3 a { text-decoration: none; } .meta { margin: .3em 0 .8em; }
.age-chip { display: inline-block; margin: 0 0 .7em; padding: .35em 1em; border-radius: 10px; background: var(--navy); color: #fff; font-weight: 800; font-size: 1.05rem; letter-spacing: .01em; border-left: 6px solid var(--turq); }
.badge { display: inline-block; font-size: .78rem; font-weight: 700; padding: .25em .8em; border-radius: 999px; background: var(--sky); color: var(--navy); margin: 0 0 .6em; }
.badge.open { background: #d8f2e3; color: #1d5a37; } .badge.cancelled { background: #fbe0de; color: #8f2118; } .badge.finished, .badge.closed { background: #e8edf2; color: var(--muted); }
.countdown { font-size: 1.05rem; background: var(--sky); padding: .6em 1em; border-radius: 10px; display: inline-block; } .countdown b { color: var(--navy); font-variant-numeric: tabular-nums; }
.row-card { display: flex; gap: 20px; align-items: center; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 14px 20px; margin-bottom: 12px; }
.row-card > div:nth-child(2) { flex: 1; } .row-card h3 { margin: 0; }
.when { min-width: 120px; display: flex; flex-direction: column; border-left: 4px solid var(--turq); padding-left: 12px; } .when b { color: var(--navy); font-size: 1.2rem; } .when span { color: var(--muted); font-size: .9rem; }
.thumb { border-radius: 8px; object-fit: cover; }
.trainer-teaser { display: flex; gap: 20px; align-items: center; background: var(--sky); border-radius: var(--radius); padding: 24px; } .trainer-teaser img { width: 130px; height: 130px; border-radius: 50%; object-fit: cover; }
.trainer-grid { display: grid; grid-template-columns: 320px 1fr; gap: 40px; } .trainer-photo { width: 100%; border-radius: var(--radius); }
/* treść */
.prose-wide { max-width: 900px; } .t-layout.container { max-width: 1120px; }
.t-layout { display: grid; grid-template-columns: 1fr 340px; gap: 40px; align-items: start; } .t-layout .prose-wide { max-width: none; }
.side { display: grid; gap: 18px; position: sticky; top: 90px; } .side h2 { font-size: 1.15rem; margin-top: 0; } .side-img { border-radius: 8px; }
.desc h2 { font-size: 1.2rem; border-bottom: 2px solid var(--turq); display: inline-block; padding-bottom: 2px; } .desc p { margin: .3em 0; }
.article-img { width: 100%; border-radius: var(--radius); margin-bottom: 1em; }
.table-wrap { overflow-x: auto; } table.plist { width: 100%; border-collapse: collapse; font-size: .95rem; } .plist th, .plist td { text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--line); } .plist th { background: var(--sky); color: var(--navy); }
.cal-links { display: grid; gap: 8px; } .cal-links .btn { text-align: center; padding: .5em 1em; }
/* lokalizacje */
.loc-hero { position: relative; min-height: 340px; background: var(--navy); color: #fff; display: flex; align-items: flex-end; overflow: hidden; }
.loc-hero img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; } .loc-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(transparent 30%, rgba(21,36,58,.85)); }
.loc-hero .container { position: relative; z-index: 1; padding-bottom: 28px; } .loc-hero h1 { color: #fff; margin: 0; }
.gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; } .gallery img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 10px; display: block; }
.map { width: 100%; height: 360px; border: 0; border-radius: var(--radius); }
dialog#lightbox { border: 0; border-radius: var(--radius); max-width: 94vw; padding: 12px; } dialog#lightbox::backdrop { background: rgba(10,20,40,.8); } dialog#lightbox img { max-width: 90vw; max-height: 76vh; display: block; margin: 8px auto; } dialog#lightbox form { text-align: right; }
/* kalendarz, zakładki, filtry */
.tabs { display: inline-flex; border: 2px solid var(--navy); border-radius: 999px; overflow: hidden; margin: 8px 0 20px; } .tabs a { padding: .4em 1.4em; text-decoration: none; font-weight: 600; } .tabs a.on { background: var(--navy); color: #fff; }
.filters { display: flex; gap: 14px; flex-wrap: wrap; align-items: end; margin-bottom: 8px; } .filters label { display: flex; flex-direction: column; font-size: .85rem; color: var(--muted); } select, input[type=email], input[type=text] { font: inherit; padding: .55em .8em; border: 1px solid #b8c8d6; border-radius: 10px; background: #fff; color: var(--ink); }
.cal-nav { display: flex; align-items: center; justify-content: space-between; } .cal-nav h2 { margin: 0; } .cal-nav a { font-size: 1.6rem; text-decoration: none; padding: 0 14px; }
.year-chips { display: flex; flex-wrap: wrap; gap: 6px; } .year-chips a { padding: .15em .7em; border-radius: 999px; background: var(--sky); text-decoration: none; font-size: .85rem; } .year-chips a.on { background: var(--navy); color: #fff; }
.cal-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.cal-h { background: var(--sky); font-weight: 700; text-align: center; padding: 6px; font-size: .85rem; color: var(--navy); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.cal-d { min-height: 96px; padding: 4px 6px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); font-size: .8rem; } .cal-d.out { background: #f6f9fb; color: #a3b1bf; } .cal-d.today .num { background: var(--turq); border-radius: 999px; padding: 0 6px; font-weight: 700; }
.ev { display: block; background: var(--navy); color: #fff; padding: 2px 6px; border-radius: 6px; margin-top: 3px; text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } a.ev:hover { background: var(--turq-dark); color: #fff; }
/* newsletter i stopka */
.newsletter { display: grid; gap: 10px; } .newsletter .check { display: flex; gap: 8px; font-size: .85rem; align-items: flex-start; } .newsletter .check input { margin-top: .3em; }
.hp { position: absolute; left: -9999px; }
.msg { padding: .6em 1em; border-radius: 10px; margin: 0; } .msg.success { background: #d8f2e3; color: #1d5a37; } .msg.error { background: #fbe0de; color: #8f2118; }
.newsletter-section { background: var(--navy); color: #fff; text-align: center; } .newsletter-section h2 { color: #fff; } .newsletter-section .newsletter { text-align: left; } .newsletter-section a { color: var(--turq); }
.site-footer { background: #13264f; color: #dce7f5; padding: 48px 0 20px; } .site-footer a { color: #fff; } .site-footer a:hover { color: var(--turq); }
.foot-grid { display: grid; grid-template-columns: 1.2fr 1fr 1.4fr; gap: 40px; } .foot-grid nav a { display: block; margin: 0 0 6px; font-weight: 400; } .foot-logo { border-radius: 4px; margin-bottom: 10px; } .copy { margin-top: 30px; font-size: .85rem; color: #9fb3d1; }
.compact label:not(.check) { font-size: .8rem; }
@media (max-width: 860px) {
  .two, .trainer-grid, .t-layout, .foot-grid { grid-template-columns: 1fr; } .hero-in { padding: 52px 0 48px; } .hero::before { opacity: .12; background-position: right -40px center; }
  .t-card { grid-template-columns: 1fr; } .t-img { min-height: 180px; max-height: 220px; } .side { position: static; }
  .nav-toggle { display: block; background: var(--navy); color: #fff; border: 0; border-radius: 10px; padding: .5em 1em; font: inherit; }
  nav#nav { display: none; position: absolute; left: 0; right: 0; top: 68px; background: #fff; border-bottom: 1px solid var(--line); padding: 8px 16px 16px; } .nav-open nav#nav { display: block; } nav#nav a { display: block; margin: 0; padding: 10px 0; }
  .row-card { flex-wrap: wrap; } .thumb { display: none; } .cal-d { min-height: 64px; font-size: .7rem; } .ev { font-size: .68rem; padding: 1px 3px; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } html { scroll-behavior: auto; } }
/* plan tygodnia */
.week { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
.day { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 10px; min-height: 120px; }
.day h3 { margin: 0 0 8px; font-size: .95rem; display: flex; justify-content: space-between; align-items: baseline; border-bottom: 2px solid var(--turq); padding-bottom: 4px; }
.day h3 .short { display: none; } .day h3 small { color: var(--turq-dark); font-weight: 700; font-size: .7rem; text-transform: uppercase; }
.day.today { border-color: var(--navy); box-shadow: 0 0 0 2px rgba(29,57,120,.15); }
.day.empty { background: #f7fafc; } .day .none { color: #a3b1bf; margin: 0; }
.slot { display: flex; flex-direction: column; gap: 2px; padding: 8px 0; border-bottom: 1px dashed var(--line); font-size: .85rem; line-height: 1.3; } .slot:last-child { border-bottom: 0; }
.slot .time { color: var(--navy); font-size: 1rem; } .slot .name { font-weight: 600; }
.lvl { align-self: flex-start; font-size: .7rem; font-weight: 700; padding: .1em .6em; border-radius: 999px; background: var(--sky); color: var(--navy); }
.lvl.intermediate { background: #d9ecf7; } .lvl.advanced { background: var(--navy); color: #fff; }
@media (max-width: 1000px) { .week { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) { .week { grid-template-columns: 1fr; } .day.empty { display: none; } .day { min-height: 0; } }
.month-h { margin: 28px 0 12px; font-size: 1.2rem; }
.age-chip.sm { font-size: .85rem; padding: .2em .8em; margin: .3em 0 0; border-left-width: 4px; }
.row-card > .btn { flex-shrink: 0; white-space: nowrap; }