:root {
  --water-ink: #244f5e;
  --water: #2d5c6b;
  --water-muted: #5e7e87;
  --water-mint: #bfd8d2;
  --water-soft: #edf5f5;
  --water-line: #c8dcde;
}

body { background: var(--paper); }

.eyebrow { color: var(--water); }

.swim-header .primary-nav { gap: clamp(16px, 2.4vw, 31px); }

.language-switch {
  display: flex;
  flex-shrink: 0;
  padding: 3px;
  border-radius: 999px;
  background: var(--water-soft);
}

.language-switch a {
  min-width: 36px;
  min-height: 36px;
  padding: 5px 8px;
  border: 0;
  border-radius: 50%;
  color: var(--water-ink);
  background: transparent;
  font: 700 11px/1 var(--font-body);
  cursor: pointer;
}

.language-switch a[aria-current="page"] {
  color: var(--paper);
  background: var(--water);
}

.swim-hero {
  padding: clamp(18px, 3vw, 36px) 0 0;
  display: grid;
  grid-template-columns: minmax(310px, .78fr) minmax(520px, 1.22fr);
  column-gap: clamp(42px, 6vw, 84px);
  align-items: center;
}

.swim-hero__heading { padding: 12px 0 42px; }

.swim-title {
  margin: 15px 0 24px;
  display: flex;
  align-items: center;
  gap: 18px;
}

.swim-title img {
  width: clamp(58px, 6vw, 78px);
  height: clamp(62px, 6.5vw, 83px);
  object-fit: contain;
}

.swim-title h1 {
  margin: 0;
  color: var(--ink);
  font: 400 clamp(58px, 6.4vw, 88px)/.94 var(--font-display);
  letter-spacing: -.045em;
}

.swim-hero__lead {
  max-width: 470px;
  margin: 0 0 18px;
  color: var(--ink);
  font: 400 clamp(24px, 2.4vw, 34px)/1.24 var(--font-display);
}

.swim-hero__intro {
  max-width: 490px;
  margin: 0;
  color: var(--muted);
  font-size: 16px;
  line-height: 1.68;
}

.swim-visual {
  position: relative;
  margin: 0;
  align-self: stretch;
}

.swim-visual::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 22px -18px 48px 24px;
  border-radius: 78px 14px 78px 14px;
  background: var(--water-mint);
}

.swim-visual__image {
  height: clamp(390px, 39vw, 520px);
  overflow: hidden;
  border-radius: 78px 14px 78px 14px;
  background: var(--water-soft);
}

.swim-visual__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 58% 50%;
}

.swim-visual figcaption {
  margin: 10px 12px 0 0;
  color: var(--water-muted);
  font-size: 12px;
  line-height: 1.5;
  text-align: right;
}

.lesson-summary {
  grid-column: 1 / -1;
  margin-top: clamp(28px, 4vw, 54px);
  padding: 30px 0 34px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 28px;
  align-items: center;
  background: var(--soft);
  box-shadow: 0 0 0 100vmax var(--soft);
  clip-path: inset(0 -100vmax);
}

.lesson-summary dl {
  margin: 0;
  display: grid;
  grid-template-columns: 1.25fr 1fr 1fr;
  gap: clamp(24px, 4vw, 58px);
}

.lesson-summary dl > div { min-width: 0; }
.lesson-summary dt {
  margin-bottom: 6px;
  color: var(--water);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.lesson-summary dd { margin: 0; }
.lesson-summary strong {
  display: block;
  color: var(--ink);
  font: 400 20px/1.3 var(--font-display);
}

.lesson-summary small {
  display: block;
  margin-top: 5px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.swim-cta {
  min-height: 55px;
  padding: 12px 22px;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 26px;
  border-radius: 8px 28px 8px 28px;
  color: var(--paper);
  background: var(--water);
  font-weight: 700;
  text-decoration: none;
  transition: background 150ms ease, border-radius 150ms ease;
}

.swim-cta:hover {
  border-radius: 28px 8px 28px 8px;
  background: var(--water-ink);
}

.language-note {
  grid-column: 1 / -1;
  margin: 0;
  padding: 16px 20px;
  display: flex;
  gap: 10px;
  color: var(--water-ink);
  background: var(--water-soft);
  border-radius: 8px 28px 8px 28px;
  font-size: 13px;
}

.language-note[hidden] { display: none !important; }
.language-note strong { flex-shrink: 0; }

.instructor-band { background: var(--paper); }

.instructor {
  padding-block: clamp(58px, 6vw, 82px);
  display: grid;
  grid-template-columns: minmax(190px, .46fr) minmax(180px, .48fr) minmax(430px, 1.3fr);
  gap: clamp(28px, 4vw, 58px);
  align-items: start;
}

.instructor__title { padding-top: 22px; }
.instructor__title h2,
.section-header h2,
.contact h2 {
  margin: 8px 0 17px;
  color: var(--ink);
  font: 400 clamp(42px, 4.3vw, 58px)/1.04 var(--font-display);
  letter-spacing: -.035em;
}

.credentials {
  margin: 0;
  color: var(--water);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.65;
}

.instructor__portrait {
  margin: 0;
  overflow: hidden;
  aspect-ratio: 4 / 5;
  border-radius: 58px 10px 58px 10px;
  background: var(--water-soft);
}

.instructor__portrait img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 48%;
}

.instructor__copy { padding-top: 17px; }
.section-lead {
  max-width: 650px;
  margin: 0 0 18px;
  color: var(--ink);
  font: 400 clamp(27px, 2.7vw, 37px)/1.2 var(--font-display);
}

.instructor__copy > p:not(.section-lead) {
  max-width: 720px;
  margin: 0;
  color: var(--text);
}

.teaching-points {
  margin-top: 28px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px 34px;
}

.teaching-points article {
  position: relative;
  padding-left: 16px;
}

.teaching-points article::before {
  content: "";
  position: absolute;
  top: .72em;
  left: 0;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--water);
}

.teaching-points h3 {
  margin: 0 0 5px;
  color: var(--ink);
  font: 400 22px/1.25 var(--font-display);
}

.teaching-points p {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.55;
}

.practical {
  padding-block: clamp(56px, 6vw, 82px);
  background: var(--soft);
  box-shadow: 0 0 0 100vmax var(--soft);
  clip-path: inset(0 -100vmax);
}

.section-header {
  margin-bottom: 38px;
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr);
  gap: 44px;
  align-items: end;
}

.section-header h2 { margin-bottom: 0; }
.section-header > p {
  max-width: 460px;
  margin: 0;
  color: var(--muted);
}

.practical__grid {
  display: grid;
  grid-template-columns: minmax(270px, .72fr) minmax(0, 1.28fr);
  gap: clamp(50px, 7vw, 96px);
  align-items: start;
}

.pool-card {
  display: grid;
  grid-template-columns: 115px 1fr;
  gap: 18px 24px;
  align-items: start;
}

.pool-sign {
  grid-row: 1 / 3;
  width: 110px;
  height: 110px;
  display: flex;
  align-items: baseline;
  justify-content: center;
  padding-top: 17px;
  border-radius: 60px 10px 60px 10px;
  color: var(--water-ink);
  background: var(--water-mint);
}

.pool-sign strong { font: 400 55px/1 var(--font-display); }
.pool-sign span { font: 400 20px/1 var(--font-display); }
.pool-card h3 {
  margin: 10px 0 8px;
  color: var(--ink);
  font: 400 28px/1.2 var(--font-display);
}

.pool-card address { color: var(--text); font-style: normal; line-height: 1.55; }
.pool-card > p { grid-column: 1 / -1; margin: 6px 0 0; color: var(--muted); }
.pool-links {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 12px 24px;
}

.pool-links a {
  color: var(--accent);
  font-weight: 700;
  text-underline-offset: 6px;
  text-decoration-thickness: 1px;
}

.fact-table { margin: 0; }
.fact-table > div {
  padding: 17px 0;
  display: grid;
  grid-template-columns: 150px 1fr;
  gap: 30px;
  border-top: 1px solid var(--hairline);
}

.fact-table > div:last-child { border-bottom: 1px solid var(--hairline); }
.fact-table dt {
  color: var(--water);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.fact-table dd { margin: 0; color: var(--text); }
.fact-table dd strong { color: var(--ink); }
.fact-table dd p { margin: 7px 0 0; }
.pending {
  display: inline-block;
  margin-bottom: 2px;
  padding: 3px 10px;
  border-radius: 20px;
  color: var(--water-ink);
  background: var(--water-mint);
  font-size: 11px;
  font-weight: 700;
}

.contact-band { background: var(--water-soft); }
.contact {
  padding-block: clamp(56px, 6vw, 82px);
  display: grid;
  grid-template-columns: minmax(270px, .9fr) minmax(210px, .62fr) minmax(320px, 1fr);
  gap: clamp(34px, 5vw, 70px);
  align-items: start;
}

.contact h2 { margin-bottom: 20px; }
.contact__copy > p { margin: 0; color: var(--text); }
.contact__details { padding-top: 30px; }
.contact__details dl { margin: 0; }
.contact__details dl > div { padding: 12px 0; border-top: 1px solid var(--water-line); }
.contact__details dl > div:last-child { border-bottom: 1px solid var(--water-line); }
.contact__details dt { color: var(--water); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.contact__details dd { margin: 4px 0 0; color: var(--ink); font: 400 22px/1.3 var(--font-display); }
.draft-note { margin: 13px 0 0; color: var(--water-muted); font-size: 12px; line-height: 1.5; }

.contact-prep {
  padding: 29px 32px 31px;
  border-radius: 10px 50px 10px 50px;
  background: var(--paper);
}

.contact-prep h3 { margin: 0 0 16px; color: var(--ink); font: 400 25px/1.24 var(--font-display); }
.contact-prep ul { margin: 0; padding-left: 20px; }
.contact-prep li { padding-left: 4px; color: var(--text); }
.contact-prep li + li { margin-top: 8px; }
.contact-prep li::marker { color: var(--water); }

.site-footer { background: var(--paper); }

@media (max-width: 1080px) {
  .swim-hero { grid-template-columns: minmax(280px, .8fr) minmax(430px, 1.2fr); column-gap: 42px; }
  .swim-visual__image { height: 440px; }
  .instructor { grid-template-columns: 190px 180px 1fr; gap: 30px; }
  .teaching-points { gap: 20px; }
  .practical__grid { gap: 54px; }
  .contact { grid-template-columns: .85fr .62fr 1fr; gap: 34px; }
}

/* Plavecká stránka má o jednu položku navigace a jazykovou volbu navíc,
   proto přechází do kompaktní hlavičky dříve než domovská stránka. */
@media (max-width: 900px) {
  .swim-header {
    min-height: 82px;
    grid-template-columns: 1fr auto;
    gap: 10px;
    background: var(--paper);
  }

  .swim-header .brand { font-size: 29px; }
  .swim-header .brand img { width: 40px; height: 49px; }
  .swim-header .location {
    grid-column: 1;
    grid-row: 2;
    margin: -20px 0 9px 48px;
    padding: 0;
    font-size: 12px;
  }

  .swim-header .menu-button {
    grid-column: 2;
    grid-row: 1 / 3;
    width: 48px;
    height: 48px;
    padding: 0;
    border: 0;
    display: grid;
    place-items: center;
    color: var(--ink);
    background: transparent;
    cursor: pointer;
  }

  .swim-header .menu-button__label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
  }

  .swim-header .menu-button__icon {
    width: 27px;
    height: 18px;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
  }

  .swim-header .menu-button__icon i {
    width: 27px;
    height: 1px;
    display: block;
    background: var(--ink);
    transition: transform 160ms ease;
  }

  .swim-header .menu-button[aria-expanded="true"] i:first-child { transform: translateY(4.5px) rotate(45deg); }
  .swim-header .menu-button[aria-expanded="true"] i:last-child { transform: translateY(-4.5px) rotate(-45deg); }

  .swim-header .primary-nav {
    position: absolute;
    top: 100%;
    left: calc(-1 * var(--pad));
    right: calc(-1 * var(--pad));
    width: auto;
    justify-self: stretch;
    display: none;
    padding: 14px var(--pad) 28px;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    background: var(--paper);
    border-block: 1px solid var(--hairline);
  }

  .swim-header .primary-nav.is-open { display: flex; }
  .swim-header .primary-nav > a {
    min-height: 57px;
    color: var(--ink);
    font: 400 26px/1.2 var(--font-display);
    text-decoration: none;
  }

  .swim-header .primary-nav > a + a { border-top: 1px solid var(--hairline); }
  .swim-header .language-switch { align-self: flex-start; margin-top: 15px; }
}

@media (max-width: 880px) {
  .swim-hero { grid-template-columns: minmax(260px, .9fr) minmax(350px, 1.1fr); gap: 30px; }
  .swim-title { gap: 12px; }
  .swim-visual__image { height: 380px; }
  .lesson-summary { grid-template-columns: 1fr; }
  .lesson-summary dl { gap: 24px; }
  .swim-cta { justify-self: start; }
  .instructor { grid-template-columns: 180px 180px 1fr; gap: 24px; }
  .teaching-points { grid-template-columns: 1fr; gap: 16px; }
  .practical__grid { grid-template-columns: .8fr 1.2fr; gap: 36px; }
  .fact-table > div { grid-template-columns: 110px 1fr; gap: 20px; }
  .contact { grid-template-columns: 1fr 1fr; }
  .contact-prep { grid-column: 1 / -1; }
}

@media (max-width: 768px) {
  .swim-header .primary-nav { gap: 0; }
  .language-switch { align-self: flex-start; margin-top: 15px; }
  .language-switch a { min-width: 43px; min-height: 43px; }

  .swim-hero {
    padding-top: 18px;
    grid-template-columns: 1fr;
  }

  .swim-hero__heading { padding-bottom: 2px; }
  .swim-title { margin-block: 12px 17px; }
  .swim-title h1 { font-size: 62px; }
  .swim-hero__lead { max-width: 560px; font-size: 28px; }
  .swim-visual { margin-top: 13px; }
  .swim-visual::before { inset: 14px -9px 39px 15px; border-radius: 54px 10px 54px 10px; }
  .swim-visual__image { height: min(62vw, 410px); border-radius: 54px 10px 54px 10px; }
  .lesson-summary { margin-top: 30px; padding-block: 26px 30px; }
  .lesson-summary dl { grid-template-columns: 1fr 1fr 1fr; }

  .instructor { grid-template-columns: minmax(140px, .62fr) 1fr; padding-block: 52px; }
  .instructor__title { padding-top: 8px; }
  .instructor__portrait { grid-column: 1; }
  .instructor__copy { grid-column: 2; grid-row: 1 / 3; }
  .instructor__title h2,
  .section-header h2,
  .contact h2 { font-size: 42px; }
  .section-lead { font-size: 29px; }
  .teaching-points { grid-template-columns: 1fr 1fr; }

  .practical { padding-block: 52px; }
  .section-header { grid-template-columns: 1fr; gap: 12px; margin-bottom: 31px; }
  .section-header > p { margin-left: 7%; }
  .practical__grid { grid-template-columns: 1fr; gap: 37px; }
  .pool-card { grid-template-columns: 105px 1fr; }
  .pool-sign { width: 100px; height: 100px; }
  .fact-table > div { grid-template-columns: 125px 1fr; }

  .contact { padding-block: 52px; grid-template-columns: 1fr 1fr; }
  .contact__details { padding-top: 12px; }
}

@media (max-width: 560px) {
  .swim-title img { width: 51px; height: 57px; }
  .swim-title h1 { font-size: 52px; }
  .swim-hero__lead { font-size: 25px; }
  .swim-hero__intro { font-size: 15px; }
  .swim-visual__image { height: 255px; }
  .swim-visual__image img { object-position: 61% 50%; }
  .swim-visual figcaption { margin-right: 0; font-size: 11px; }

  .lesson-summary dl { grid-template-columns: 1fr; gap: 17px; }
  .lesson-summary dl > div { display: grid; grid-template-columns: 61px 1fr; gap: 13px; }
  .lesson-summary dt { margin: 2px 0 0; }
  .lesson-summary strong { font-size: 19px; }
  .swim-cta { width: 100%; }
  .language-note { display: block; }
  .language-note span { display: block; margin-top: 5px; }

  .instructor { grid-template-columns: 112px 1fr; gap: 20px; padding-block: 47px; }
  .instructor__title h2 { font-size: 37px; }
  .credentials { font-size: 11px; }
  .instructor__portrait { grid-column: 2; grid-row: 1; width: 100%; max-width: 150px; justify-self: end; border-radius: 34px 8px 34px 8px; }
  .instructor__copy { grid-column: 1 / -1; grid-row: auto; padding-top: 5px; }
  .section-lead { font-size: 27px; }
  .instructor__copy > p:not(.section-lead) { font-size: 14px; line-height: 1.58; }
  .teaching-points { gap: 18px 16px; }
  .teaching-points h3 { font-size: 19px; }
  .teaching-points p { font-size: 13px; }

  .section-header h2,
  .contact h2 { font-size: 36px; }
  .section-header > p { margin-left: 0; font-size: 14px; }
  .pool-card { grid-template-columns: 90px 1fr; gap: 16px; }
  .pool-sign { width: 86px; height: 86px; padding-top: 14px; border-radius: 44px 8px 44px 8px; }
  .pool-sign strong { font-size: 45px; }
  .pool-sign span { font-size: 17px; }
  .pool-card h3 { margin-top: 5px; font-size: 25px; }
  .pool-card address { font-size: 14px; }
  .pool-card > p { font-size: 14px; line-height: 1.55; }
  .fact-table > div { grid-template-columns: 94px 1fr; gap: 15px; padding-block: 14px; }
  .fact-table dt { font-size: 10px; }
  .fact-table dd { font-size: 14px; line-height: 1.52; }

  .contact { grid-template-columns: 1fr; gap: 26px; }
  .contact__details { padding-top: 0; }
  .contact-prep { grid-column: auto; padding: 25px 24px 28px; border-radius: 8px 38px 8px 38px; }
  .contact-prep h3 { font-size: 23px; }
}

@media (prefers-reduced-motion: reduce) {
  .swim-cta { transition: none; }
}

/* DEP01: native language links retain the original control geometry. */
.language-switch a { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
.language-options a { text-decoration: none; }