@charset "utf-8";
/* =====================================================================
   TK ROJA PŘÍBRAM — „Bílý kurt“
   Světlá varianta. Bílá plocha, klubová zelená #66B400, černé předěly.
   Struktura souboru i všechny selektory jsou shodné s tmavou verzí —
   mění se výhradně barvy, plochy, linky a stíny.
   ===================================================================== */

/* ---------- 1. TOKENY ---------- */
:root{
  /* plochy — bílá, jemná šedozelená, sytější šedozelená */
  --plocha:     #FFFFFF;
  --plocha-2:   #F4F7F1;
  --plocha-3:   #EAF0E4;
  --plocha-4:   #E1E9D8;

  /* text — černá a dvě šedozelené úrovně, obě nad 4,5:1 i na --plocha-3 */
  --text:       #0F1310;
  --text-2:     #45514A;
  --text-3:     #5F6E66;
  --cerna:      #0F1310;
  --paper:      #FFFFFF;

  /* zelená škála
     --zelena        plochy, tlačítka, linky (na ní se píše ČERNĚ)
     --zelena-tmava  velké nadpisy a čísla na bílé (4,5:1)
     --zelena-text   drobný text, odkazy, štítky na bílé i na --plocha-2 (5,8:1)
     --zelena-hluboka celé zelené předěly s bílým textem (8,1:1)
     --zelena-svetla  jemné zelené výplně, pruhy, hláška formuláře */
  --zelena:         #66B400;
  --zelena-tmava:   #4B8500;
  --zelena-text:    #3F7200;
  --zelena-hluboka: #2F5A00;
  --zelena-svetla:  #EAF6E0;

  /* text na zelených předělech */
  --na-zelene:     #FFFFFF;
  --na-zelene-2:   #D7E8C4;
  --na-zelene-akc: #BCEB7A;
  --na-jasne:      #0F1310;
  --na-jasne-2:    rgba(15,19,16,.76);

  /* linky */
  --linka:      rgba(15,19,16,.14);
  --linka-jemna:rgba(15,19,16,.08);

  /* stíny — měkké, nízké, šedozelené; nikdy tvrdá černá */
  --stin-1: 0 1px 2px rgba(15,19,16,.05);
  --stin-2: 0 2px 4px rgba(15,19,16,.04), 0 10px 24px rgba(47,90,0,.07);
  --stin-3: 0 4px 10px rgba(15,19,16,.06), 0 18px 40px rgba(47,90,0,.13);

  /* ---- zpětná kompatibilita s názvy z tmavé verze ----
     Jména používají i některé inline styly ve stránkách (--g-bright),
     proto zůstávají, jen dostala světlé hodnoty. */
  --ink:        var(--plocha);
  --ink-2:      var(--plocha);
  --ink-3:      var(--plocha-2);
  --ink-4:      var(--plocha-3);
  --g-bright:   #3F7200;   /* v HTML se používá na odkazy v textu — musí být čitelná */
  --g:          #66B400;
  --g-mid:      #4B8500;
  --g-deep:     #2F5A00;
  --g-night:    #EAF6E0;
  --mute:       var(--text-2);
  --faint:      var(--text-3);
  --line:       var(--linka);
  --line-soft:  var(--linka-jemna);
  --glass:      #FFFFFF;
  --glass-2:    var(--plocha-2);

  /* odstupy — násobky 4 */
  --s1: 4px;  --s2: 8px;  --s3: 12px; --s4: 16px;
  --s5: 24px; --s6: 32px; --s7: 40px; --s8: 56px;
  --s9: 80px; --s10: 120px;

  --wrap: 1240px;
  --nav-h: 84px;

  --ease: cubic-bezier(.2,.8,.2,1);

  color-scheme: light;
}

/* ---------- 2. RESET ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{
  scroll-behavior:smooth; -webkit-text-size-adjust:100%;
  /* Bez toho skok na kotvu (#prihlaska, #vyhody, #rezervace…) zastavil sekci
     přesně na horní hraně okna a přilepená hlavička jí uřízla nadtitulek. */
  scroll-padding-top:calc(var(--nav-h) + 12px);
}
body{
  margin:0;
  background:var(--plocha);
  color:var(--text);
  font-family:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  font-size:16px;
  line-height:1.65;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-decoration:none; }
button,input,select,textarea{ font:inherit; color:inherit; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{ margin:0; }
p{ margin:0; }
table{ border-collapse:collapse; width:100%; }

/* Zrno přes celý web tmavé verzi slušelo, na bílé se chová jako špína —
   ve světlé variantě je vypnuté. */

/* ---------- 3. TYPOGRAFIE ---------- */
.display{
  font-family:'Oswald','Inter',system-ui,sans-serif;
  font-weight:700;
  text-transform:uppercase;
  line-height:1.20;              /* háčky nad verzálkami se nesmí uříznout */
  letter-spacing:.005em;
  color:var(--text);
}
h1.display{ line-height:1.18; }
.eyebrow{
  font-size:11px; font-weight:700; text-transform:uppercase;
  letter-spacing:.20em; color:var(--zelena-text);
  display:inline-flex; align-items:center; gap:10px;
  line-height:1.5;
}
.eyebrow::before{
  content:""; width:26px; height:2px; background:var(--zelena); flex:none;
}
.eyebrow.no-dash::before{ display:none; }
.lead{ font-size:clamp(16px,1.55vw,19px); color:var(--text-2); line-height:1.72; }
.num{ font-variant-numeric:tabular-nums; }

/* ---------- 4. LAYOUT ---------- */
.wrap{ width:100%; max-width:var(--wrap); margin:0 auto; padding:0 24px; }
section{ position:relative; }
.sec{ padding:clamp(64px,9vw,var(--s10)) 0; }
.sec-head{ max-width:760px; margin-bottom:clamp(32px,4vw,56px); }
.sec-head h2{ font-size:clamp(30px,5vw,58px); margin-top:14px; }
.sec-head p{ margin-top:18px; }
.sec-head--split{ max-width:none; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,420px); gap:32px; align-items:end; }
@media (max-width:860px){ .sec-head--split{ grid-template-columns:1fr; align-items:start; } }

/* Střídání bílých a šedozelených pásem nahrazuje rytmus, který
   v tmavé verzi dělaly záře. Sudé sekce dostanou jemný podtón. */
main > section.sec:nth-of-type(even){ background:var(--plocha-2); }
main > section.sec:nth-of-type(even) + hr.rule{ display:none; }

.rule{ height:1px; background:var(--linka-jemna); border:0; margin:0; }

/* ---------- 5. SCROLL PROGRESS ---------- */
#progress{
  position:fixed; top:0; left:0; height:3px; width:0%;
  background:linear-gradient(90deg,var(--zelena-hluboka),var(--zelena-tmava),var(--zelena));
  z-index:10000; transition:width .08s linear;
}

/* ---------- 6. OZNAMOVACÍ PRUH ---------- */
#announce{
  position:relative; z-index:60;
  background:var(--zelena-svetla);
  border-bottom:1px solid rgba(102,180,0,.38);
  font-size:12.5px; letter-spacing:.04em;
  color:var(--text-2);
}
#announce .wrap{ display:flex; align-items:center; gap:14px; padding-top:9px; padding-bottom:9px; flex-wrap:wrap; }
#announce .dot{
  width:8px; height:8px; border-radius:50%; background:var(--zelena); flex:none;
  box-shadow:0 0 0 0 rgba(102,180,0,.6); animation:pulse 2.4s infinite;
}
@keyframes pulse{
  0%{ box-shadow:0 0 0 0 rgba(102,180,0,.55); }
  70%{ box-shadow:0 0 0 12px rgba(102,180,0,0); }
  100%{ box-shadow:0 0 0 0 rgba(102,180,0,0); }
}
#announce strong{ color:var(--text); font-weight:700; }
#announce span.txt{ color:var(--text-2); }
#announce a.more{
  color:var(--zelena-text); font-weight:700; border-bottom:1px solid rgba(63,114,0,.45);
  padding-bottom:1px;
}
#announce a.more:hover{ color:var(--zelena-hluboka); border-color:var(--zelena-hluboka); }
#announce button{
  margin-left:auto; background:none; border:0; color:var(--text-3); cursor:pointer;
  font-size:18px; line-height:1; border-radius:4px;
  /* Plocha pod prstem musí být aspoň 44x44 px, jinak se do křížku
     nedá na telefonu trefit. Vizuálně zůstává stejně velký. */
  display:inline-flex; align-items:center; justify-content:center;
  min-width:44px; min-height:44px; padding:0; margin-right:-10px;
}
#announce button:hover{ color:var(--text); }

/* ---------- 7. NAVIGACE ---------- */
header.nav{
  position:sticky; top:0; z-index:900;
  background:rgba(255,255,255,.86);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--linka-jemna);
  transition:background .3s var(--ease), border-color .3s var(--ease), box-shadow .3s var(--ease);
}
header.nav.scrolled{ background:rgba(255,255,255,.97); border-bottom-color:var(--linka); box-shadow:0 6px 22px rgba(15,19,16,.06); }
.nav-inner{
  height:var(--nav-h); display:flex; align-items:center; gap:12px;
}
.brand{ display:flex; align-items:center; gap:12px; flex:none; }
/* Na bílém podkladu hlavičky vždy ZÁKLADNÍ zelené logo (roja-logo.svg),
   bez jakékoli podkladové destičky — šev i písmo jsou vyseknuté
   a bílá hlavička jimi prosvítá. */
.brand .mark{
  display:grid; place-items:center; background:none; border-radius:0;
  padding:0; box-shadow:none;
}
/* Poměr oficiálního loga je 971,17:464 (2,093:1), takže výška 58px = šířka 121px —
   těsně nad minimální šířkou 120px z logomanuálu. Výška je dána, šířka se dopočítá. */
.brand .mark img{ height:58px; width:auto; display:block; }
/* ochranná zóna = ¼ průměru míčku (14,5px při výšce 58px) */
.brand{ padding-right:14px; }
/* Vedle loga nestojí žádný text — hlavičku drží logo vlevo, odkazy uprostřed
   a telefon s tlačítkem vpravo. Volné místo se proto dělí rovným dílem na obě
   strany navigace (margin:auto), aby logo nezůstalo osaměle přilepené ke kraji. */
.nav-links{ display:flex; align-items:center; gap:2px; margin-left:auto; margin-right:auto; }
.nav-links a{
  font-size:12.5px; font-weight:600; letter-spacing:.10em; text-transform:uppercase;
  color:var(--text-2); padding:10px 9px; border-radius:6px; position:relative;
  white-space:nowrap;
  transition:color .2s var(--ease), background .2s var(--ease);
}
.nav-links a::after{
  content:""; position:absolute; left:9px; right:9px; bottom:4px; height:2px;
  background:var(--zelena); transform:scaleX(0); transform-origin:left; transition:transform .28s var(--ease);
}
.nav-links a:hover, .nav-links a:focus-visible{ color:var(--text); }
.nav-links a:hover::after, .nav-links a.active::after{ transform:scaleX(1); }
.nav-links a.active{ color:var(--text); }
.nav-cta{ display:flex; align-items:center; flex:none; margin-left:6px; }
.btn-block{
  display:inline-flex; align-items:center; gap:8px;
  height:44px; padding:0 20px;
  font-family:'Oswald',sans-serif; font-size:13px; font-weight:600;
  letter-spacing:.12em; text-transform:uppercase; line-height:1;
  border-radius:6px; border:1px solid transparent; cursor:pointer;
  transition:transform .2s var(--ease), background .2s var(--ease), box-shadow .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease);
}
.btn-green{ background:var(--zelena); color:var(--na-jasne); font-weight:700; box-shadow:var(--stin-1); }
.btn-green:hover{ background:var(--zelena-hluboka); color:var(--paper); transform:translateY(-2px); box-shadow:0 10px 24px rgba(47,90,0,.24); }
.btn-ghost{ background:transparent; color:var(--text); border-color:rgba(15,19,16,.22); }
.btn-ghost:hover{ border-color:var(--zelena); color:var(--zelena-text); background:var(--zelena-svetla); transform:translateY(-2px); }
.nav-phone{
  display:none; font-size:13px; font-weight:600; letter-spacing:.04em;
  color:var(--text-2); padding:0 10px; white-space:nowrap;
}
.nav-phone:hover{ color:var(--zelena-text); }
@media (min-width:1360px){ .nav-phone{ display:inline-block; } }

.burger{
  display:none; width:46px; height:46px; border-radius:8px;
  border:1px solid var(--linka); background:var(--plocha); cursor:pointer;
  align-items:center; justify-content:center; flex-direction:column; gap:5px; flex:none;
  margin-left:auto;
}
.burger span{ display:block; width:20px; height:2px; background:var(--text); transition:transform .3s var(--ease), opacity .2s; }
.burger.open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.burger.open span:nth-child(2){ opacity:0; }
.burger.open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

@media (max-width:1119px){
  .nav-links{ display:none; }
  .nav-cta .btn-ghost{ display:none; }
  .burger{ display:flex; }
  .nav-cta{ margin-left:auto; }
}
@media (max-width:560px){
  .nav-cta .btn-green{ height:40px; padding:0 13px; font-size:11.5px; letter-spacing:.08em; }
  /* ÚZKÝ DISPLEJ: celé logo by kleslo pod minimálních 120px šířky,
     proto <picture> podá samotnou značku (roja-znacka.svg) — čtverec 1:1,
     42px je bezpečně nad minimem 24px. */
  .brand .mark img{ height:42px; }
  .brand{ padding-right:10px; }
}

/* mobilní panel */
#mobile{
  position:fixed; inset:0; z-index:950;
  background:var(--plocha); padding:calc(var(--nav-h) + 20px) 24px 40px;
  transform:translateY(-100%); transition:transform .42s var(--ease), visibility .42s;
  overflow-y:auto; display:flex; flex-direction:column;
  /* Zavřený panel odsunutý transformem zůstával v pořadí tabulátoru —
     druhý Tab pak poslal fokus do neviditelného tlačítka. Viditelnost
     ho vyřadí a odloží se tak, aby zůstala animace zasunutí. */
  visibility:hidden;
}
#mobile.open{ transform:translateY(0); visibility:visible; transition:transform .42s var(--ease); }
#mobile .close{
  /* Polohu dopočítá skript podle hamburgeru, ať se zavírá tam, kde se
     otevíralo. Hodnoty níž platí, dokud skript nedoběhne. */
  position:absolute; top:var(--zavirak-top,16px); right:var(--zavirak-right,18px); width:44px; height:44px;
  background:var(--plocha-2); border:1px solid var(--linka); border-radius:8px;
  color:var(--text); font-size:22px; line-height:1; cursor:pointer;
}
#mobile nav{ display:flex; flex-direction:column; }
#mobile nav a{
  font-family:'Oswald',sans-serif; font-size:26px; font-weight:600;
  text-transform:uppercase; letter-spacing:.04em; line-height:1.35;
  padding:14px 0; border-bottom:1px solid var(--linka-jemna);
  display:flex; align-items:baseline; gap:14px; color:var(--text);
}
#mobile nav a i{
  font-style:normal; font-size:11px; font-weight:700; color:var(--zelena-text);
  letter-spacing:.1em; font-family:'Inter',sans-serif;
}
#mobile nav a:hover{ color:var(--zelena-text); }
#mobile .m-foot{ margin-top:32px; display:grid; gap:12px; }
#mobile .m-foot a.big{
  display:flex; align-items:center; justify-content:center; height:54px;
  border-radius:8px; font-family:'Oswald',sans-serif; letter-spacing:.12em;
  text-transform:uppercase; font-size:14px; font-weight:700;
}
#mobile .m-foot .g{ background:var(--zelena); color:var(--na-jasne); }
#mobile .m-foot .o{ border:1px solid var(--linka); color:var(--text); }
#mobile .m-meta{ margin-top:26px; font-size:13px; color:var(--text-2); line-height:1.9; }
#mobile .m-meta b{ color:var(--text); }

/* ---------- 8. HERO ---------- */
.hero{
  position:relative; min-height:calc(72svh - var(--nav-h));
  display:flex; flex-direction:column; justify-content:flex-end;
  padding-top:clamp(40px,6vw,76px); overflow:hidden;
  border-bottom:1px solid var(--linka-jemna);
  background:linear-gradient(180deg, var(--plocha) 0%, var(--plocha) 34%, var(--plocha-2) 100%);
}
.hero-bg{ position:absolute; inset:0; z-index:0; pointer-events:none; }
.hero-bg svg{ position:absolute; left:50%; bottom:-4%; transform:translateX(-50%); width:min(1900px,180%); height:auto; opacity:1; }
/* Na černé stačily slabé zelené čáry; na bílé je potřeba přidat krytí,
   jinak z kurtu v perspektivě nezůstane nic. */
.hero-bg svg stop[stop-opacity=".34"]{ stop-opacity:.55; }
.hero-bg svg stop[stop-opacity=".62"]{ stop-opacity:.92; }
.hero-bg svg stop[stop-opacity=".28"]{ stop-opacity:.48; }
.hero-bg svg stop[stop-opacity=".13"]{ stop-opacity:.09; }
.hero-bg svg g[stroke-opacity=".14"]{ stroke-opacity:.34; }
.hero-bg svg line[stroke-opacity=".45"]{ stroke-opacity:.85; }
.hero-bg svg g[opacity=".5"]{ opacity:.9; }
/* Reflektory z tmavé verze by na bílé byly šmouha. Zůstává jediný,
   velmi jemný šedozelený podtón u paty hero. */
.glow{ position:absolute; border-radius:50%; filter:blur(90px); pointer-events:none; }
.glow-a, .glow-b{ display:none; }
.glow-c{ width:min(1100px,120vw); height:520px; left:50%; transform:translateX(-50%); bottom:-24%; background:radial-gradient(ellipse at center, rgba(102,180,0,.16), transparent 68%); }
.hero-veil{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(to top, rgba(244,247,241,.94) 0%, rgba(244,247,241,.42) 24%, rgba(255,255,255,.10) 56%, rgba(255,255,255,.58) 100%);
}
.hero-inner{ position:relative; z-index:2; padding-bottom:clamp(32px,4vw,52px); }
.hero-chip{
  display:inline-flex; align-items:center; gap:9px; min-height:30px; padding:5px 14px;
  background:var(--zelena); color:var(--na-jasne); border-radius:3px;
  font-size:11px; font-weight:800; letter-spacing:.16em; text-transform:uppercase;
  line-height:1.35;   /* na úzkém displeji se text zalomí a nesmí přetéct ze štítku */
}
.hero-chip .b{ width:7px; height:7px; flex:none; border-radius:50%; background:var(--na-jasne); }
h1.hero-title{
  margin-top:20px;
  font-size:clamp(42px,8.2vw,116px);
  letter-spacing:-.012em;
  line-height:1.18;                  /* dřív 1.08 — háček Ř narážel do řádku nad ním */
  padding-top:.08em;                 /* prostor pro Ř / Í nad verzálkami */
}
/* Zelený svit nadpisu je pryč — na bílé si zelená vystačí sama. */
h1.hero-title .g{ color:var(--zelena-tmava); }
.hero-sub{
  margin-top:22px; max-width:600px; font-size:clamp(16px,1.7vw,20px);
  color:var(--text-2); line-height:1.65;
}
.hero-sub b{ color:var(--text); font-weight:600; }
.hero-actions{ margin-top:32px; display:flex; flex-wrap:wrap; gap:12px; align-items:center; }
.hero-actions .btn-block{ height:54px; padding:0 26px; font-size:14px; }
.hero-price{
  display:inline-flex; align-items:baseline; gap:8px; padding:0 4px;
  font-family:'Oswald',sans-serif; color:var(--text);
}
.hero-price b{ font-size:28px; font-weight:700; letter-spacing:.01em; }
.hero-price span{ font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-3); font-family:'Inter',sans-serif; font-weight:600; }

/* pás čísel pod hero — ČERNÝ PŘEDĚL s bílými čísly */
.hero-stats{
  position:relative; z-index:2;
  border-top:0;
  background:var(--cerna);
  border-radius:14px; overflow:hidden;
  margin-bottom:clamp(18px,3vw,32px);
  box-shadow:0 18px 44px rgba(15,19,16,.16);
  /* Oddělovací linky dělá mezera mřížky podbarvená zespodu — ať je údajů
     kolik chce a zalomí se do kolika řádků chce, nikde nezůstane linka
     navíc ani prázdné okno. */
  display:grid; grid-template-columns:repeat(5,minmax(0,1fr));
  gap:1px; background:rgba(255,255,255,.14);
}
.hero-stats .cell{
  padding:24px 20px 26px; background:var(--cerna);
  transition:background .3s var(--ease);
}
/* Údajů je pět. Když se mřížka zalomí na tři nebo dva sloupce, poslední
   z nich zbude na řádku sám — roztáhneme ho, aby vedle něj nezůstalo
   světlé okno z podbarvené mezery. */
.hero-stats .cell:hover{ background:#1D211E; }
.hero-stats .v{
  font-family:'Oswald',sans-serif; font-weight:700; color:var(--paper);
  font-size:clamp(30px,4vw,52px); line-height:1.1; letter-spacing:-.01em;
  display:flex; align-items:baseline; gap:4px;
}
.hero-stats .v i{ font-style:normal; color:var(--na-zelene-akc); font-size:.5em; }
.hero-stats .k{
  margin-top:8px; font-size:10.5px; font-weight:700; letter-spacing:.15em;
  text-transform:uppercase; color:rgba(255,255,255,.72); line-height:1.6;
}
@media (max-width:1100px){
  .hero-stats{ grid-template-columns:repeat(3,minmax(0,1fr)); }
  .hero-stats .cell:last-child{ grid-column:span 2; }
}
@media (max-width:760px){
  .hero-stats{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .hero-stats .cell{ padding:20px 16px 22px; }
  .hero-stats .cell:last-child{ grid-column:span 2; }
}

/* ---------- 9. KARTY ---------- */
/* Sklo z tmavé verze na bílé nic neudělá — kartu drží bílá plocha,
   šedá linka a nízký šedozelený stín. */
.card{
  position:relative; background:var(--plocha);
  border:1px solid var(--linka); border-radius:12px;
  padding:26px; overflow:hidden; box-shadow:var(--stin-1);
  transition:border-color .3s var(--ease), transform .3s var(--ease), background .3s var(--ease), box-shadow .3s var(--ease);
}
/* zelený kurzor-highlight — sdílený pro všechny typy karet */
.card, .court, .group, .event, .coach, .term, .partner{ position:relative; }
.card::before, .court::before, .group::before, .event::before,
.coach::before, .term::before, .partner::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:0;
  background:radial-gradient(240px circle at var(--mx,50%) var(--my,50%), rgba(102,180,0,.10), transparent 62%);
  transition:opacity .3s var(--ease);
}
.card:hover::before, .court:hover::before, .group:hover::before, .event:hover::before,
.coach:hover::before, .term:hover::before, .partner:hover::before{ opacity:1; }
.card > *, .court > *, .group > *, .event > *, .coach > *, .term > *, .partner > *{ position:relative; z-index:1; }
.card:hover{ border-color:rgba(102,180,0,.55); transform:translateY(-4px); background:var(--plocha); box-shadow:var(--stin-3); }
.card .idx{
  font-family:'Oswald',sans-serif; font-size:12px; font-weight:600; letter-spacing:.18em;
  color:var(--zelena-text); display:block; margin-bottom:14px;
}
.card h3{ font-family:'Oswald',sans-serif; font-weight:600; text-transform:uppercase; letter-spacing:.02em;
  font-size:clamp(19px,2vw,23px); line-height:1.3; color:var(--text); }
.card p{ margin-top:12px; color:var(--text-2); font-size:15px; }

.grid-3{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.grid-2{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.grid-4{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; }
@media (max-width:1000px){ .grid-3{ grid-template-columns:repeat(2,minmax(0,1fr)); } .grid-4{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:680px){ .grid-3,.grid-2,.grid-4{ grid-template-columns:minmax(0,1fr); } }

/* ---------- 10. O KLUBU ---------- */
.about{ display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:clamp(28px,5vw,64px); align-items:start; }
@media (max-width:940px){ .about{ grid-template-columns:1fr; } }
.about p + p{ margin-top:16px; }
.about .quote{
  margin-top:28px; padding:22px 24px; border-left:3px solid var(--zelena);
  background:var(--zelena-svetla);
  border-radius:0 10px 10px 0;
}
.about .quote p{ color:var(--text); font-size:16.5px; line-height:1.7; font-style:italic; }
.about .quote cite{ display:block; margin-top:12px; font-style:normal; font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--text-2); }

.feat{ display:grid; gap:1px; background:var(--linka); border:1px solid var(--linka); border-radius:12px; overflow:hidden; box-shadow:var(--stin-1); }
.feat .row{
  background:var(--plocha); padding:20px 22px; display:flex; gap:16px; align-items:flex-start;
  transition:background .3s var(--ease);
}
.feat .row:hover{ background:var(--plocha-2); }
.feat .ic{ flex:none; width:38px; height:38px; border-radius:9px; background:var(--zelena-svetla); border:1px solid rgba(102,180,0,.38); display:grid; place-items:center; }
.feat .ic svg{ width:19px; height:19px; stroke:var(--zelena-text); fill:none; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.feat h4{ font-family:'Oswald',sans-serif; font-size:15px; font-weight:600; text-transform:uppercase; letter-spacing:.06em; color:var(--text); line-height:1.4; }
.feat p{ margin-top:5px; font-size:14px; color:var(--text-2); line-height:1.6; }

/* ---------- 11. KURTY ---------- */
.court{
  position:relative; border:1px solid var(--linka); border-radius:14px;
  background:var(--plocha); display:flex; flex-direction:column; overflow:hidden;
  box-shadow:var(--stin-1);
  transition:border-color .3s var(--ease), transform .3s var(--ease), box-shadow .3s var(--ease);
}
.court::before{ border-radius:14px; }
.court:hover{ border-color:rgba(102,180,0,.5); transform:translateY(-5px); box-shadow:var(--stin-3); }
.court .visual{
  height:172px; position:relative; overflow:hidden;
  border-bottom:1px solid var(--linka); border-radius:13px 13px 0 0;
  background:var(--plocha-3);
}
.court .visual svg{ position:absolute; inset:0; width:100%; height:100%; }
.court .badge{
  position:absolute; top:14px; left:14px; z-index:2;
  height:26px; padding:0 11px; display:inline-flex; align-items:center;
  background:var(--paper); border:1px solid rgba(102,180,0,.5); border-radius:3px;
  font-size:10px; font-weight:800; letter-spacing:.15em; text-transform:uppercase; color:var(--zelena-text);
  box-shadow:var(--stin-1);
}
.court .body{ padding:24px; flex:1; display:flex; flex-direction:column; }
.court .count{
  font-family:'Oswald',sans-serif; font-size:clamp(38px,5vw,58px); font-weight:700;
  color:var(--text); line-height:1.15; letter-spacing:-.01em;   /* čárka nad í ve slově „Navíc“ */
}
.court h3{ margin-top:6px; font-family:'Oswald',sans-serif; font-size:20px; font-weight:600;
  text-transform:uppercase; letter-spacing:.04em; color:var(--zelena-text); line-height:1.35; }
.court p{ margin-top:12px; font-size:14.5px; color:var(--text-2); }
.court ul{ margin-top:18px; padding-top:16px; border-top:1px solid var(--linka-jemna); display:grid; gap:9px; }
.court li{ font-size:13.5px; color:var(--text-2); display:flex; gap:10px; align-items:flex-start; line-height:1.55; }
.court li::before{ content:"›"; color:var(--zelena-text); font-weight:700; flex:none; }

/* ---------- 12. ŠKOLA ---------- */
/* Zvýrazněný panel: JASNĚ ZELENÁ plocha s černým textem. Je to jeden
   ze dvou výrazných zelených předělů na stránce. */
.school-hero{
  position:relative; border:0; border-radius:16px;
  background:var(--zelena);
  padding:clamp(26px,4vw,44px); overflow:hidden;
  display:grid; grid-template-columns:minmax(0,1fr) auto; gap:28px; align-items:center;
  box-shadow:0 14px 36px rgba(47,90,0,.18);
  color:var(--na-jasne);
}
.school-hero::after{
  content:""; position:absolute; right:-90px; top:-90px; width:340px; height:340px; border-radius:50%;
  background:rgba(255,255,255,.14); pointer-events:none;
}
.school-hero .when{ position:relative; z-index:1; }
.school-hero h3{ font-family:'Oswald',sans-serif; font-size:clamp(24px,3.4vw,40px); font-weight:700;
  text-transform:uppercase; color:var(--na-jasne); line-height:1.2; padding-top:.04em; }
.school-hero p{ margin-top:14px; max-width:620px; color:var(--na-jasne-2); }
.school-hero .eyebrow{ color:var(--na-jasne); }
.school-hero .eyebrow::before{ background:var(--na-jasne); }
.school-hero .hero-chip{ background:var(--cerna); color:var(--paper); }
.school-hero .hero-chip .b{ background:var(--na-zelene-akc); }
.school-hero .btn-green{ background:var(--cerna); color:var(--paper); box-shadow:0 6px 18px rgba(15,19,16,.22); }
.school-hero .btn-green:hover{ background:#000; color:var(--paper); }
.school-hero .btn-ghost{ border-color:rgba(15,19,16,.42); color:var(--na-jasne); }
.school-hero .btn-ghost:hover{ background:rgba(255,255,255,.22); border-color:var(--cerna); color:var(--na-jasne); }

/* Odkazy v bezicim textu obou JASNE ZELENYCH predelu (.school-hero i
   .price-hero). V HTML maji natvrdo inline style="color:var(--g-bright)",
   coz je #3F7200 — na plose #66B400 jen 2,24:1, takze odkaz prakticky
   zmizi (na 404.html „info@tkroja.cz“ a „728 459 217“). Inline zapis
   prebije jen !important. Cerna ma na klubove zelene 8,13:1 a podtrzeni
   drzi odkaz rozeznatelny i bez barvy. */
.school-hero p a[style*="--g-bright"],
.price-hero p a[style*="--g-bright"]{
  color:var(--na-jasne) !important;
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:3px;
  font-weight:600;
}
.school-hero p a[style*="--g-bright"]:hover,
.price-hero p a[style*="--g-bright"]:hover{
  color:var(--zelena-hluboka) !important;
  text-decoration-thickness:2px;
}
.school-date{
  position:relative; z-index:1; flex:none; text-align:center;
  border:1px solid rgba(15,19,16,.12); border-radius:12px; padding:20px 26px; background:var(--paper);
  box-shadow:0 8px 22px rgba(15,19,16,.10);
}
.school-date .d{ font-family:'Oswald',sans-serif; font-size:52px; font-weight:700; color:var(--zelena-hluboka); line-height:1.05; }
.school-date .m{ font-size:12px; letter-spacing:.18em; text-transform:uppercase; color:var(--text); font-weight:700; margin-top:4px; }
.school-date .t{ font-size:12px; color:var(--text-2); margin-top:8px; letter-spacing:.06em; }
@media (max-width:780px){ .school-hero{ grid-template-columns:1fr; } }

.groups{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-top:26px; }
@media (max-width:1000px){ .groups{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .groups{ grid-template-columns:1fr; } }
.group{
  border:1px solid var(--linka); border-radius:12px; background:var(--plocha); padding:22px;
  box-shadow:var(--stin-1); overflow:hidden;
  transition:border-color .3s var(--ease), background .3s var(--ease), transform .3s var(--ease), box-shadow .3s var(--ease);
}
.group:hover{ border-color:rgba(102,180,0,.5); transform:translateY(-3px); box-shadow:var(--stin-2); }
.group .age{ font-family:'Oswald',sans-serif; font-size:12px; letter-spacing:.16em; color:var(--zelena-text); text-transform:uppercase; font-weight:600; }
.group h4{ margin-top:10px; font-family:'Oswald',sans-serif; font-size:20px; font-weight:600; text-transform:uppercase; color:var(--text); line-height:1.3; }
.group p{ margin-top:10px; font-size:14px; color:var(--text-2); line-height:1.6; }

/* trenéři */
.coaches{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin-top:26px; }
@media (max-width:900px){ .coaches{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .coaches{ grid-template-columns:1fr; } }
.coach{
  display:flex; gap:18px; align-items:center; padding:20px;
  border:1px solid var(--linka); border-radius:12px; background:var(--plocha);
  box-shadow:var(--stin-1); overflow:hidden;
  transition:border-color .3s var(--ease), transform .3s var(--ease), box-shadow .3s var(--ease);
}
.coaches.two{ grid-template-columns:repeat(2,minmax(0,1fr)); }
.coaches.four{ grid-template-columns:repeat(4,minmax(0,1fr)); }
@media (max-width:1000px){ .coaches.four{ grid-template-columns:1fr 1fr; } }
@media (max-width:900px){ .coaches.two{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .coaches.two,.coaches.four{ grid-template-columns:1fr; } }
.coach:hover{ border-color:rgba(102,180,0,.5); transform:translateY(-3px); box-shadow:var(--stin-2); }
.avatar{
  flex:none; width:60px; height:60px; border-radius:50%;
  background:var(--zelena);
  display:grid; place-items:center;
  font-family:'Oswald',sans-serif; font-size:19px; font-weight:700; color:var(--na-jasne); letter-spacing:.02em;
  box-shadow:inset 0 -2px 0 rgba(15,19,16,.12);
}
.coach .n{ font-family:'Oswald',sans-serif; font-size:18px; font-weight:600; color:var(--text); line-height:1.35; }
.coach .r{ margin-top:4px; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--zelena-text); font-weight:700; }

/* ---------- TRENÉŘI S FOTKOU ----------
   Klub fotí trenéry na mobil na výšku (675×1200) a obličej bývá v horní
   třetině záběru. Do kolečka o průměru 60 px se z takového snímku vejde
   hlavně plot za zády, proto má karta fotku na výšku a výřez posunutý
   nad střed. Kdo fotku zatím nemá, dostane stejně velkou dlaždici
   s iniciálami, ať v řadě nevznikne díra.
   Pravidla výše (vodorovná .coach) zůstávají — platí všude, kde se
   třída .foto na mřížku nedá. */
/* Kolik trenérů je ve skupině, tolik sloupců — třídu sl-1 až sl-4 dává
   šablona. Ve čtyřsloupcové mřížce nechávali dva trenéři prázdnou polovinu
   řady; roztáhnout je na polovinu šířky ale nejde, ze svislého portrétu by
   zbyl vodorovný pás. Karta má proto strop šířky a řada se vystředí.
   (Třída, ne vlastní vlastnost v inline stylu — ta by přebila media query
   a na tabletu by mřížka zůstala čtyřsloupcová.) */
.coaches.foto{
  /* Karty se drží svého obsahu. Při natažení na výšku řádku by po rozbalení
     medailonku sousedům narostly prázdné bílé plochy až k jeho konci. */
  align-items:start; justify-content:center;
  grid-template-columns:repeat(4,minmax(0,290px));
}
.coaches.foto.sl-3{ grid-template-columns:repeat(3,minmax(0,290px)); }
.coaches.foto.sl-2{ grid-template-columns:repeat(2,minmax(0,290px)); }
.coaches.foto.sl-1{ grid-template-columns:minmax(0,290px); }
.coaches.foto.two{ grid-template-columns:repeat(2,minmax(0,590px)); }
.coaches.foto.two.sl-1{ grid-template-columns:minmax(0,880px); }
/* Dokud trenér nemá vyplněný medailonek, je pravá půlka dlaždice prázdná —
   užší karta drží lepší poměr. Po doplnění textu v administraci se rozšíří. */
.coaches.foto.two.bez-bio{ grid-template-columns:repeat(2,minmax(0,510px)); }
.coaches.foto.two.bez-bio.sl-1{ grid-template-columns:minmax(0,510px); }
.coaches.foto .coach{ display:flex; flex-direction:column; align-items:stretch; gap:0; padding:0; }

/* pruh nad skupinou: „V čele týmu · 2 trenéři“ */
.coach-pruh{
  display:flex; align-items:center; gap:14px;
  margin:30px 0 -8px; font-size:11px; font-weight:700;
  letter-spacing:.2em; text-transform:uppercase; color:var(--zelena-text);
}
.coach-pruh .cara{ flex:1; height:1px; background:var(--linka-jemna); }
.coach-pruh b{ font-weight:700; color:var(--text-3); letter-spacing:.14em; }

.coach-foto{
  position:relative; aspect-ratio:4/5; max-height:400px; overflow:hidden;
  background:var(--plocha-3); border-bottom:1px solid var(--linka-jemna);
}
.coach-foto img{
  display:block; width:100%; height:100%; object-fit:cover;
  /* výřez nad středem — jinak se useknou hlavy */
  object-position:50% 26%;
  transition:transform .6s var(--ease);
}
.coach:hover .coach-foto img{ transform:scale(1.04); }

/* dlaždice bez fotky — tichá, ať na mřížce nepřebije skutečné snímky */
.coach-foto--zadna{
  background:linear-gradient(168deg, var(--plocha) 0%, #F7FBF2 46%, var(--zelena-svetla) 100%);
}
.coach-foto--zadna .avatar{
  position:absolute; top:30%; left:50%; transform:translate(-50%,-50%);
  width:50%; height:auto; aspect-ratio:1;
  background:var(--plocha); color:var(--zelena-hluboka);
  border:1.5px solid rgba(102,180,0,.42);
  box-shadow:0 10px 24px rgba(47,90,0,.10);
  font-size:clamp(19px,2vw,27px);
}

/* text pod fotkou — role nahoře jako u ostatních karet webu */
.coach-tx{ display:flex; flex-direction:column; padding:14px 16px 16px; }
.coach-tx .r{ margin:0 0 5px; }
.coach-tx .n{ font-size:16.5px; }

/* dvojice v čele týmu — fotka vlevo, text vpravo.
   Minimální výška drží fotku vedoucích aspoň tak velkou jako u sboru pod
   nimi; bez ní by krátký text kartu smrskl a hierarchie by byla naruby. */
.coaches.foto.two .coach{
  display:grid; grid-template-columns:minmax(0,44%) minmax(0,1fr);
  min-height:clamp(280px,24vw,360px);
}
/* Fotka u široké dlaždice se drží u horní hrany a má vlastní poměr stran.
   Kdyby se roztahovala na výšku karty, u trenéra s dlouhým medailonkem by
   z portrétu zbyl svislý pruh zdi s kusem hlavy dole. */
.coaches.foto.two .coach-foto{
  align-self:start; width:100%; height:auto; aspect-ratio:5/6; max-height:440px;
  border-bottom:0; border-right:1px solid var(--linka-jemna);
}
.coaches.foto.two .coach-tx{ align-self:center; padding:clamp(20px,2.2vw,30px); }
.coaches.foto.two .n{
  font-size:clamp(19px,1.9vw,24px); text-transform:uppercase; letter-spacing:.01em; line-height:1.22;
}
/* Medailonek v úzké kartě sboru. Dlouhý text se sem nevejde, je proto
   schovaný pod rozbalovátkem; krátký se vypíše rovnou. */
.coach-bio--karta{ margin-top:9px; font-size:13.5px; line-height:1.6; color:var(--text-2); }
.coach-bio--karta p{ margin:0 0 .7em; }
.coach-bio--karta p:last-child{ margin-bottom:0; }
.coach-bio--karta .coach-vic{ margin-top:0; }
.coach-bio--karta .coach-vic > p{ margin:.7em 0 0; }
.coaches.foto.two .coach-bio{ margin-top:11px; font-size:14.5px; line-height:1.66; color:var(--text-2); max-width:64ch; }
.coaches.foto.two .coach-bio p{ margin:0 0 .8em; }
.coaches.foto.two .coach-bio p:last-child{ margin-bottom:0; }
/* rozbalení zbytku medailonku — bez kousku javascriptu, umí to prohlížeč sám */
.coach-vic{ margin-top:10px; }
.coach-vic summary{
  display:inline-flex; align-items:center; gap:7px; cursor:pointer; width:max-content;
  font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--zelena-text); list-style:none;
}
.coach-vic summary::-webkit-details-marker{ display:none; }
.coach-vic summary::after{
  content:""; width:7px; height:7px; border-right:2px solid currentColor; border-bottom:2px solid currentColor;
  transform:translateY(-2px) rotate(45deg); transition:transform .25s var(--ease);
}
.coach-vic[open] summary::after{ transform:translateY(1px) rotate(-135deg); }
.coach-vic summary:hover{ color:var(--zelena-hluboka); }
.coach-vic > p{ margin:.8em 0 0; }
.coaches.foto.two .coach-rok{ margin-top:7px; font-size:12.5px; color:var(--text-3); }
.coaches.foto.two .coach-rok b{ color:var(--text-2); font-variant-numeric:tabular-nums; }
.coaches.foto.two .coach-foto--zadna .avatar{ width:44%; font-size:clamp(22px,2.4vw,32px); }

@media (max-width:1000px){
  .coaches.foto, .coaches.foto.sl-3{ grid-template-columns:repeat(3,minmax(0,290px)); }
}
@media (max-width:860px){
  .coaches.foto, .coaches.foto.sl-3, .coaches.foto.sl-2{ grid-template-columns:repeat(2,minmax(0,290px)); }
  /* .bez-bio je uvedená všude, kde se přepisuje .two — má o třídu vyšší
     specificitu a bez ní by pravidlo z media query neprošlo. */
  .coaches.foto.two, .coaches.foto.two.sl-1,
  .coaches.foto.two.bez-bio, .coaches.foto.two.bez-bio.sl-1{ grid-template-columns:minmax(0,590px); }
}
@media (max-width:560px){
  /* Jeden sloupec by z poloportrétů udělal plakáty — mřížka zůstává po dvou. */
  .coaches.foto, .coaches.foto.sl-3, .coaches.foto.sl-2{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .coaches.foto.sl-1, .coaches.foto.two, .coaches.foto.two.sl-1,
  .coaches.foto.two.bez-bio, .coaches.foto.two.bez-bio.sl-1{ grid-template-columns:minmax(0,1fr); }
  .coach-tx{ padding:12px 13px 14px; }
  .coach-tx .n{ font-size:15px; }
  .coach-tx .r{ font-size:10px; letter-spacing:.12em; }
  /* Na telefonu jde fotka nad text. Vedle sebe by na medailonek zbyl sloupec
     široký sotva na tři slova. */
  .coaches.foto.two .coach{ grid-template-columns:minmax(0,1fr); min-height:0; }
  .coaches.foto.two .coach-foto{
    aspect-ratio:4/5; max-height:340px;
    border-right:0; border-bottom:1px solid var(--linka-jemna);
  }
  .coaches.foto.two .coach-tx{ align-self:auto; padding:14px 16px 18px; }
  .coaches.foto.two .n{ font-size:18px; }
  .coaches.foto.two .coach-bio{ font-size:13.5px; line-height:1.6; }
  .coach-pruh{ font-size:10px; letter-spacing:.16em; margin-top:24px; }
}

/* ---------- 13. CENÍK ---------- */
.tabs{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:26px; }
.tab{
  height:46px; padding:0 22px; border-radius:8px; cursor:pointer;
  background:var(--plocha); border:1px solid var(--linka); color:var(--text-2);
  font-family:'Oswald',sans-serif; font-size:13px; font-weight:600; letter-spacing:.12em; text-transform:uppercase;
  box-shadow:var(--stin-1);
  transition:all .25s var(--ease);
}
.tab:hover{ color:var(--text); border-color:rgba(15,19,16,.28); }
.tab[aria-selected="true"]{ background:var(--zelena); border-color:var(--zelena); color:var(--na-jasne); font-weight:700; box-shadow:0 8px 20px rgba(47,90,0,.22); }
.panel[hidden]{ display:none; }
.panel{ animation:fade .35s var(--ease); }
@keyframes fade{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }

/* Cenový panel: JASNĚ ZELENÁ plocha s černým textem — velké číslo nese sekci. */
.price-hero{
  display:flex; flex-wrap:wrap; align-items:center; gap:clamp(20px,4vw,48px);
  border:0; border-radius:14px;
  background:var(--zelena);
  padding:clamp(22px,3vw,34px); margin-bottom:22px;
  box-shadow:0 14px 36px rgba(47,90,0,.18);
  color:var(--na-jasne);
}
.price-hero .big{ display:flex; align-items:baseline; gap:10px; }
.price-hero .big b{ font-family:'Oswald',sans-serif; font-size:clamp(54px,9vw,96px); font-weight:700; color:var(--na-jasne); line-height:1.1; letter-spacing:-.02em; }
.price-hero .big span{ font-family:'Oswald',sans-serif; font-size:clamp(18px,2.4vw,26px); color:var(--na-jasne-2); font-weight:500; }
.price-hero .txt{ flex:1 1 280px; min-width:0; }
.price-hero .txt h4{ font-family:'Oswald',sans-serif; font-size:19px; font-weight:600; text-transform:uppercase; color:var(--na-jasne); letter-spacing:.04em; line-height:1.35; }
.price-hero .txt p{ margin-top:8px; font-size:14.5px; color:var(--na-jasne-2); }
.price-hero .btn-green{ background:var(--cerna); color:var(--paper); box-shadow:0 6px 18px rgba(15,19,16,.22); }
.price-hero .btn-green:hover{ background:#000; color:var(--paper); }
.price-hero .btn-ghost{ border-color:rgba(15,19,16,.42); color:var(--na-jasne); }
.price-hero .btn-ghost:hover{ background:rgba(255,255,255,.22); border-color:var(--cerna); color:var(--na-jasne); }

.tbl-wrap{ border:1px solid var(--linka); border-radius:12px; overflow:hidden; background:var(--plocha); box-shadow:var(--stin-1); }
.tbl-scroll{ overflow-x:auto; scrollbar-width:thin; scrollbar-color:var(--zelena) var(--plocha-3); }
.tbl-scroll::-webkit-scrollbar{ height:6px; }
.tbl-scroll::-webkit-scrollbar-track{ background:var(--plocha-3); }
.tbl-scroll::-webkit-scrollbar-thumb{ background:var(--zelena); border-radius:3px; }
/* Na úzkém displeji se tabulka nevejde — ať je na první pohled vidět, že se posouvá. */
@media (max-width:560px){
  .tbl-wrap::after{
    content:"\2190\a0 tabulku posunete do stran \a0\2192"; display:block;
    padding:10px 16px 12px; border-top:1px solid var(--linka-jemna);
    font-size:10.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
    color:var(--text-3); text-align:center;
  }
}
table.pt{ min-width:520px; }
table.pt caption{
  text-align:left; padding:18px 22px 14px; font-family:'Oswald',sans-serif;
  font-size:15px; font-weight:600; letter-spacing:.10em; text-transform:uppercase; color:var(--text);
  border-bottom:1px solid var(--linka);
}
table.pt th{
  text-align:left; padding:12px 22px; font-size:10.5px; font-weight:700; letter-spacing:.14em;
  text-transform:uppercase; color:var(--text-2); background:var(--plocha-2);
  border-bottom:1px solid var(--linka); white-space:nowrap;
}
table.pt th:not(:first-child), table.pt td:not(:first-child){ text-align:right; }
table.pt td{
  padding:14px 22px; font-size:14.5px; color:var(--text);
  border-bottom:1px solid var(--linka-jemna);
}
table.pt tbody tr:last-child td{ border-bottom:0; }
table.pt tbody tr{ transition:background .2s var(--ease); }
table.pt tbody tr:hover{ background:var(--zelena-svetla); }
table.pt td.p{ font-family:'Oswald',sans-serif; font-size:17px; font-weight:600; color:var(--zelena-text); white-space:nowrap; }
table.pt td.free{ color:var(--zelena-text); font-weight:700; }
.note{ margin-top:16px; font-size:13px; color:var(--text-3); line-height:1.7; }
.note b{ color:var(--text-2); }
.two-tbl{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
@media (max-width:920px){ .two-tbl{ grid-template-columns:1fr; } }

.perks{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:22px; }
@media (max-width:700px){ .perks{ grid-template-columns:1fr; } }
.perk{ display:flex; gap:12px; align-items:flex-start; padding:14px 16px; border:1px solid var(--linka); border-radius:9px; background:var(--plocha); font-size:14px; color:var(--text-2); line-height:1.55; box-shadow:var(--stin-1); }
.perk svg{ flex:none; width:17px; height:17px; margin-top:3px; stroke:var(--zelena-text); fill:none; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }
.perk b{ color:var(--text); font-weight:600; }

/* ---------- 14. AKCE / TURNAJE ---------- */
.events{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
@media (max-width:980px){ .events{ grid-template-columns:1fr 1fr; } }
@media (max-width:660px){ .events{ grid-template-columns:1fr; } }
.event{
  border:1px solid var(--linka); border-radius:12px; background:var(--plocha);
  padding:24px; position:relative; overflow:hidden; box-shadow:var(--stin-1);
  transition:border-color .3s var(--ease), transform .3s var(--ease), box-shadow .3s var(--ease);
}
.event::after{
  content:""; position:absolute; left:0; top:0; width:3px; height:100%;
  background:linear-gradient(var(--zelena),var(--zelena-hluboka)); opacity:0; transition:opacity .3s var(--ease);
}
.event:hover{ border-color:rgba(102,180,0,.5); transform:translateY(-4px); box-shadow:var(--stin-3); }
.event:hover::after{ opacity:1; }
.event .tag{
  display:inline-block; padding:4px 10px; border-radius:3px;
  font-size:10px; font-weight:800; letter-spacing:.15em; text-transform:uppercase;
}
.tag-green{ background:var(--zelena-svetla); color:var(--zelena-text); border:1px solid rgba(102,180,0,.45); }
.tag-white{ background:var(--plocha-3); color:var(--text); border:1px solid var(--linka); }
.event h3{ margin-top:16px; font-family:'Oswald',sans-serif; font-size:21px; font-weight:600; text-transform:uppercase; color:var(--text); line-height:1.3; }
.event p{ margin-top:12px; font-size:14.5px; color:var(--text-2); }
.event .meta{ margin-top:18px; padding-top:14px; border-top:1px solid var(--linka-jemna); display:flex; flex-wrap:wrap; gap:14px; font-size:12.5px; color:var(--text-3); }
.event .meta span b{ color:var(--text); font-weight:600; }

.teams{ margin-top:26px; border:1px solid var(--linka); border-radius:12px; overflow:hidden; box-shadow:var(--stin-1); }
.teams .hd{ padding:16px 22px; border-bottom:1px solid var(--linka); background:var(--plocha-2);
  font-family:'Oswald',sans-serif; font-size:14px; letter-spacing:.12em; text-transform:uppercase; color:var(--text); font-weight:600; }
.teams .list{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); background:var(--plocha); }
@media (max-width:900px){ .teams .list{ grid-template-columns:1fr 1fr; } }
@media (max-width:480px){ .teams .list{ grid-template-columns:1fr; } }
.teams .it{ padding:18px 22px; border-right:1px solid var(--linka-jemna); border-bottom:1px solid var(--linka-jemna); background:var(--plocha); }
.teams .it:last-child{ border-right:0; }
.teams .it b{ display:block; font-family:'Oswald',sans-serif; font-size:15px; font-weight:600; color:var(--text); text-transform:uppercase; letter-spacing:.04em; line-height:1.4; }
.teams .it span{ display:block; margin-top:5px; font-size:12.5px; color:var(--text-2); }

/* ---------- 15. NOVINKY (řádkový seznam) ---------- */
.news{ border-top:1px solid var(--linka); }
.news-row{
  display:grid; grid-template-columns:180px minmax(0,1fr) auto; gap:clamp(18px,3vw,34px);
  align-items:center; padding:26px 0; border-bottom:1px solid var(--linka-jemna);
  transition:background .3s var(--ease); position:relative;
}
.news-row:hover{ background:var(--zelena-svetla); }
.news-thumb{ height:112px; border-radius:10px; overflow:hidden; border:1px solid var(--linka); position:relative; background:var(--plocha-3); }
.news-thumb svg{ position:absolute; inset:0; width:100%; height:100%; }
.news-body .d{ font-size:11px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:var(--zelena-text); }
.news-body h3{ margin-top:10px; font-family:'Oswald',sans-serif; font-size:clamp(19px,2.3vw,26px); font-weight:600;
  text-transform:uppercase; color:var(--text); line-height:1.3; transition:color .25s var(--ease); }
.news-row:hover .news-body h3{ color:var(--zelena-text); }
.news-body p{ margin-top:10px; font-size:14.5px; color:var(--text-2); max-width:70ch; }
.news-go{
  flex:none; width:46px; height:46px; border-radius:50%; border:1px solid var(--linka);
  display:grid; place-items:center; color:var(--text); transition:all .3s var(--ease); background:var(--plocha);
}
.news-row:hover .news-go{ border-color:var(--zelena); background:var(--zelena); color:var(--na-jasne); transform:translateX(4px); }
.news-go svg{ width:17px; height:17px; stroke:currentColor; fill:none; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }
@media (max-width:820px){
  .news-row{ grid-template-columns:120px minmax(0,1fr); }
  .news-thumb{ height:90px; }
  .news-go{ display:none; }
}
@media (max-width:520px){
  .news-row{ grid-template-columns:1fr; }
  .news-thumb{ height:130px; }
}

/* ---------- 16. TÁBORY ---------- */
.camp{
  border:1px solid rgba(102,180,0,.34); border-radius:16px; overflow:hidden;
  background:var(--zelena-svetla);
  box-shadow:var(--stin-2);
}
.camp-top{ padding:clamp(26px,4vw,44px); border-bottom:1px solid rgba(15,19,16,.10); }
.camp-top h3{ margin-top:14px; font-family:'Oswald',sans-serif; font-size:clamp(26px,4vw,46px); font-weight:700;
  text-transform:uppercase; color:var(--text); line-height:1.2; padding-top:.04em; }
.camp-top p{ margin-top:16px; max-width:640px; color:var(--text-2); }
.terms{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
@media (max-width:760px){ .terms{ grid-template-columns:1fr; } }
.term{ padding:26px clamp(22px,3vw,32px); border-right:1px solid rgba(15,19,16,.10); transition:background .3s var(--ease); }
.term:last-child{ border-right:0; }
.term:hover{ background:rgba(255,255,255,.7); }
.term .no{ font-family:'Oswald',sans-serif; font-size:11px; letter-spacing:.18em; color:var(--zelena-text); font-weight:600; text-transform:uppercase; }
.term .dt{ margin-top:10px; font-family:'Oswald',sans-serif; font-size:clamp(22px,2.6vw,28px); font-weight:600; color:var(--text); line-height:1.3; }
.term .yr{ margin-top:6px; font-size:13px; color:var(--text-2); }
.camp-bottom{ padding:clamp(22px,3vw,32px); display:flex; flex-wrap:wrap; gap:22px; align-items:center; justify-content:space-between; border-top:1px solid rgba(15,19,16,.10); }
.camp-prices{ display:flex; flex-wrap:wrap; gap:26px; }
.camp-prices div .l{ font-size:10.5px; letter-spacing:.15em; text-transform:uppercase; color:var(--text-2); font-weight:700; }
.camp-prices div .v{ margin-top:6px; font-family:'Oswald',sans-serif; font-size:26px; font-weight:600; color:var(--zelena-hluboka); line-height:1.2; }

/* ---------- 17. PARTNEŘI ---------- */
/* Poděkování partnerům: mřížka BÍLÝCH dlaždic s logy. Loga jsou barevná
   — zlatá, červená, modrá — a čitelná jsou jen na bílé, proto sekce
   zůstává světlá a zelená z ní zbyla jen jako okraj při najetí myší.
   Všechna loga dostávají společně vysoký box a object-fit: contain,
   aby působila opticky stejně velká i při různých proporcích. */
/* Partnerů je lichý počet, takže poslední řádek nikdy nevyjde plný.
   Mřížka proto stojí na flexu a nedopočítaný řádek se vystředí — díra
   po kraji by vypadala jako chyba, vystředěná trojice jako záměr. */
.partners{ --mezera:clamp(12px,1.3vw,18px); display:flex; flex-wrap:wrap;
  justify-content:center; gap:var(--mezera); }
.partners > *{ flex:0 1 calc((100% - 3 * var(--mezera)) / 4); }
@media (max-width:1040px){ .partners > *{ flex-basis:calc((100% - 2 * var(--mezera)) / 3); } }
@media (max-width:700px){  .partners > *{ flex-basis:calc((100% - var(--mezera)) / 2); } }

.partner{
  display:flex; flex-direction:column; align-items:center; justify-content:flex-start;
  padding:clamp(20px,2.2vw,28px) clamp(14px,1.6vw,22px) clamp(18px,2vw,24px);
  background:var(--plocha); border:1px solid var(--linka); border-radius:14px;
  box-shadow:var(--stin-1); text-align:center; text-decoration:none; color:var(--text);
  transition:border-color .3s var(--ease), transform .3s var(--ease), box-shadow .3s var(--ease);
}
.partner::before{ display:none; }
.partner:hover{ border-color:rgba(102,180,0,.55); transform:translateY(-4px); box-shadow:var(--stin-2); }

/* Box pro logo má pevnou výšku, rozměry obrázku se dopočítají samy —
   nic se neroztáhne ani nerozmaže. */
.partner .p-logo{
  display:flex; align-items:center; justify-content:center;
  width:100%; max-width:200px; margin-left:auto; margin-right:auto;
  height:clamp(58px,6vw,76px);
}
.partner .p-logo img{ max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain; }

/* Partner, na kterého logo nemáme, dostane název vysázený typograficky —
   ve stejně vysokém boxu, ať v mřížce nevznikne díra. */
.partner .p-nazev{
  display:flex; align-items:center; justify-content:center;
  min-height:clamp(58px,6vw,76px);
  font-family:'Oswald',sans-serif; font-weight:600; line-height:1.12;
  font-size:clamp(19px,2.2vw,26px); letter-spacing:.02em; text-transform:uppercase;
  color:var(--zelena-hluboka); padding:0 4px; hyphens:auto;
}
.partner .pn{
  margin-top:clamp(12px,1.5vw,18px);
  font-family:'Oswald',sans-serif; font-size:14.5px; font-weight:600;
  text-transform:uppercase; letter-spacing:.07em; color:var(--text); line-height:1.35;
  transition:color .3s var(--ease);
}
a.partner:hover .pn{ color:var(--zelena-text); }
.partner .pr{ margin-top:7px; font-size:11px; letter-spacing:.13em; text-transform:uppercase;
  color:var(--text-3); line-height:1.5; }
.partner .p-nazev + .pr{ margin-top:clamp(12px,1.5vw,18px); }
/* Dlaždice jsou nově na bílé — obrys při procházení klávesnicí musí být tmavý. */
.partners a:focus-visible{ outline-color:var(--zelena-hluboka); }

/* ---------- 18. KONTAKT ---------- */
.contact{ display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:clamp(28px,4vw,54px); align-items:start; }
@media (max-width:960px){ .contact{ grid-template-columns:minmax(0,1fr); } }
.cbox{ border:1px solid var(--linka); border-radius:12px; background:var(--plocha); overflow:hidden; box-shadow:var(--stin-1); }
.crow{ padding:20px 24px; border-bottom:1px solid var(--linka-jemna); display:flex; gap:16px; align-items:flex-start; }
.crow:last-child{ border-bottom:0; }
.crow .l{ font-size:10.5px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:var(--text-3); width:104px; flex:none; padding-top:3px; line-height:1.6; }
.crow .v{ font-size:15.5px; color:var(--text); line-height:1.65; min-width:0; }
/* Telefon a e-mail na kontaktu měly klikací plochu vysokou 20 px a hned
   pod nimi začínal popisek — klepnutí o kousek níž nic neudělalo. */
.crow .v a{
  border-bottom:1px solid rgba(102,180,0,.5); transition:color .2s;
  display:inline-block; padding:8px 0; margin:-8px 0;
}
.crow .v a:hover{ color:var(--zelena-text); }
.crow .v small{ display:block; font-size:13px; color:var(--text-2); margin-top:4px; }
.map-link{
  margin-top:18px; display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:20px 24px; border:1px solid var(--linka); border-radius:12px; background:var(--plocha);
  box-shadow:var(--stin-1);
  transition:border-color .3s var(--ease), background .3s var(--ease), box-shadow .3s var(--ease);
}
.map-link:hover{ border-color:rgba(102,180,0,.5); background:var(--zelena-svetla); box-shadow:var(--stin-2); }
.map-link b{ font-family:'Oswald',sans-serif; font-size:15px; font-weight:600; text-transform:uppercase; letter-spacing:.06em; color:var(--text); line-height:1.4; }
.map-link span{ display:block; font-size:13px; color:var(--text-2); margin-top:4px; }
.map-link .arr{ flex:none; color:var(--zelena-text); font-size:22px; }

/* formulář */
form.book{ border:1px solid var(--linka); border-radius:14px; background:var(--plocha); padding:clamp(22px,3vw,34px); box-shadow:var(--stin-2); }
form.book h3{ font-family:'Oswald',sans-serif; font-size:clamp(21px,2.6vw,28px); font-weight:600; text-transform:uppercase; color:var(--text); line-height:1.3; }
form.book > p.hint{ margin-top:10px; font-size:14px; color:var(--text-2); }
.fgrid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:24px; }
@media (max-width:560px){ .fgrid{ grid-template-columns:1fr; } }
.field{ display:flex; flex-direction:column; gap:7px; min-width:0; }
.field.full{ grid-column:1 / -1; }
.field label{ font-size:10.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--text-2); }
.field input, .field select, .field textarea{
  background:var(--plocha); border:1px solid var(--linka); border-radius:8px;
  padding:13px 14px; color:var(--text); width:100%;
  /* 16 px je nejmenší velikost, u které Safari na iPhonu po klepnutí
     do pole nepřiblíží celou stránku. */
  font-size:16px;
  transition:border-color .2s var(--ease), background .2s var(--ease), box-shadow .2s var(--ease);
}
.field textarea{ min-height:104px; resize:vertical; }
/* sedozelena: 5,07:1 na bile a 4,66:1 na #FDF3F2 v chybnem poli,
   a pritom zretelne svetlejsi nez vyplnena hodnota (--text) */
.field input::placeholder, .field textarea::placeholder{ color:#66716B; }
.field input:focus, .field select:focus, .field textarea:focus{
  outline:none; border-color:var(--zelena); background:var(--plocha); box-shadow:0 0 0 3px rgba(102,180,0,.18);
}
.field select option{ background:var(--plocha); color:var(--text); }
/* jediná další barva na webu: červená u chyb formuláře */
.field .err{ font-size:12px; color:#C0281F; font-weight:600; display:none; }
.field.invalid input, .field.invalid select, .field.invalid textarea{ border-color:#C0281F; background:#FDF3F2; }
.field.invalid .err{ display:block; }
/* Neviditelný cíl pro odkazy, které slibují formulář. Díky
   scroll-padding-top na html doskočí pod přilepenou hlavičku. */
.kotva{ display:block; height:0; overflow:hidden; }
/* Skok na nevyplněné pole musí skončit pod přilepenou hlavičkou,
   jinak se do něj píše naslepo. */
.field, .consent{ scroll-margin-top:calc(var(--nav-h) + 16px); }
.consent{ display:flex; gap:11px; align-items:flex-start; margin-top:18px; font-size:13px; color:var(--text-2); line-height:1.6; }
.consent input{ width:22px; height:22px; margin-top:0; flex:none; accent-color:var(--zelena); }
/* Nezaškrtnutý souhlas se dřív nijak neoznačil a formulář jen mlčky nešel
   odeslat. Teď se chová stejně jako nevyplněné pole — červený rámeček
   a věta, co je potřeba udělat. */
.consent.invalid{ color:#8C1F18; }
.consent.invalid input{ outline:2px solid #C0281F; outline-offset:3px; border-radius:4px; }
.consent .err{ display:none; margin-top:6px; font-size:12px; color:#C0281F; font-weight:600; }
.consent.invalid .err{ display:block; }
form.book button[type="submit"]{ margin-top:22px; width:100%; height:54px; justify-content:center; font-size:14px; }
.form-ok{
  display:none; margin-top:18px; padding:16px 18px; border-radius:10px;
  border:1px solid rgba(102,180,0,.5); background:var(--zelena-svetla);
  color:var(--text); font-size:14.5px; line-height:1.6;
}
.form-ok.show{ display:block; animation:fade .35s var(--ease); }

/* hláška nad formulářem po návratu z odeslat.php (?odeslano=1 / ?chyba=1) */
.form-stav{
  display:block; margin-bottom:18px; padding:16px 18px; border-radius:10px;
  border:1px solid rgba(102,180,0,.5); background:var(--zelena-svetla);
  color:var(--text); font-size:14.5px; line-height:1.6;
  animation:fade .35s var(--ease);
}
.form-stav[hidden]{ display:none; }
.form-stav b{ font-weight:700; color:var(--text); }
.form-stav a{ color:var(--zelena-text); font-weight:600; white-space:nowrap; }
.form-stav--chyba{ border-color:rgba(192,40,31,.45); background:#FDF3F2; }
.form-stav--chyba a{ color:#A0221A; }

/* ---------- 19. PATIČKA ---------- */
/* Patička zůstává černá — uzavírá stránku a nese klubové logo. */
footer{ border-top:0; background:var(--cerna); color:rgba(255,255,255,.72); position:relative; overflow:hidden; }
footer::before{
  content:""; position:absolute; left:50%; transform:translateX(-50%); top:-160px;
  width:min(900px,110vw); height:300px; border-radius:50%;
  background:radial-gradient(ellipse at center, rgba(102,180,0,.16), transparent 70%); filter:blur(60px); pointer-events:none;
}
.f-top{ position:relative; padding-block:clamp(48px,6vw,80px) 40px; display:grid; grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr)); gap:36px; }
@media (max-width:940px){ .f-top{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .f-top{ grid-template-columns:1fr; } }
/* Černá patička = tmavý podklad, tedy VŽDY bílá negativní varianta loga.
   Nové logo je průhledné SVG, takže bílá podkladová destička odpadla —
   šev i písmo jsou vyseknuté a prosvítá jimi černé pozadí patičky. */
.f-brand .mark{
  display:inline-block; background:none; border-radius:0;
  padding:0; box-shadow:none;
}
/* výška 60px = šířka 126px, nad minimem 120px */
.f-brand .mark img{ height:60px; width:auto; display:block; }
.f-brand p{ margin-top:20px; font-size:14px; color:rgba(255,255,255,.66); max-width:34ch; line-height:1.7; }
.f-col h4{ font-family:'Oswald',sans-serif; font-size:12px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:#8FD11A; line-height:1.5; }
.f-col ul{ margin-top:16px; display:grid; gap:10px; }
.f-col li{ font-size:14px; color:rgba(255,255,255,.66); line-height:1.6; }
/* Odkaz v patičce měl výšku jednoho řádku (17 px) — o polovinu méně,
   než se dá na telefonu spolehlivě trefit. Odsazení dá prstu plochu,
   aniž by se rozjela sazba: záporný okraj vrátí řádkování zpět. */
.f-col a{
  font-size:14px; color:rgba(255,255,255,.66); line-height:1.6;
  display:inline-block; padding:7px 0; margin:-7px 0;
}
.f-col a:hover{ color:#8FD11A; }
.f-bot{
  position:relative; border-top:1px solid rgba(255,255,255,.12); padding-block:22px 30px;
  display:flex; flex-wrap:wrap; gap:14px; justify-content:space-between; align-items:center;
  font-size:12.5px; color:rgba(255,255,255,.55);
}
.f-bot a:hover{ color:#8FD11A; }

/* ---------- 20. REVEAL + PŘÍSTUPNOST ---------- */
.rv{ opacity:0; transform:translateY(24px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.rv.in{ opacity:1; transform:none; }
.rv.d1{ transition-delay:.08s; } .rv.d2{ transition-delay:.16s; }
.rv.d3{ transition-delay:.24s; } .rv.d4{ transition-delay:.32s; }

a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible{
  outline:2px solid var(--zelena-hluboka); outline-offset:3px; border-radius:4px;
}
footer a:focus-visible, .hero-stats a:focus-visible, .cta-pas a:focus-visible{ outline-color:var(--na-zelene-akc); }
.skip{
  position:absolute; left:-9999px; top:0; z-index:10001;
  background:var(--zelena); color:var(--na-jasne); padding:12px 18px; font-weight:700; border-radius:0 0 8px 0;
}
.skip:focus{ left:0; }
.sr{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
  .rv{ opacity:1; transform:none; }
}

/* ---------- 21. VÍCESTRÁNKOVÝ WEB (doplněk k původnímu návrhu) ---------- */
.nav-links a.je-aktivni{ color:var(--text); }
.nav-links a.je-aktivni::after{ transform:scaleX(1); }
#mobile nav a.je-aktivni{ color:var(--zelena-text); }

/* hlavička podstránky — místo nočního svitu jemný šedozelený podtón a zelená linka */
.page-hero{
  position:relative; overflow:hidden;
  background:linear-gradient(180deg, var(--plocha) 0%, var(--plocha-2) 100%);
  border-bottom:1px solid var(--linka-jemna);
  padding:clamp(44px,6vw,88px) 0 clamp(36px,5vw,64px);
}
.page-hero::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:3px;
  background:linear-gradient(90deg, var(--zelena) 0%, var(--zelena) 22%, transparent 22%);
}
.page-hero .glow-a, .page-hero .glow-b, .page-hero .glow-c{ display:none; }
.page-hero .inner{ position:relative; z-index:2; max-width:820px; }
.page-hero h1{ margin-top:16px; font-size:clamp(34px,6vw,72px); line-height:1.18; padding-top:.06em; }
.page-hero h1 .g{ color:var(--zelena-tmava); }
.page-hero p.lead{ margin-top:20px; max-width:70ch; }
.drobky{
  position:relative; z-index:2; display:flex; flex-wrap:wrap; gap:8px; align-items:center;
  font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--text-3); line-height:1.6; margin-bottom:20px;
}
.drobky a:hover{ color:var(--zelena-text); }
.drobky span[aria-hidden]{ color:var(--zelena-tmava); }

/* pás s výzvou k akci na konci podstránky — HLUBOCE ZELENÝ předěl */
.cta-pas{
  border:0; border-radius:16px; overflow:hidden;
  background:var(--zelena-hluboka);
  padding:clamp(26px,4vw,44px);
  display:flex; flex-wrap:wrap; gap:24px; align-items:center; justify-content:space-between;
  box-shadow:0 16px 40px rgba(47,90,0,.22);
}
.cta-pas h3{
  font-family:'Oswald',sans-serif; font-size:clamp(22px,3vw,34px); font-weight:700;
  text-transform:uppercase; color:var(--paper); line-height:1.22; padding-top:.04em;
}
.cta-pas p{ margin-top:12px; color:var(--na-zelene-2); max-width:62ch; }
.cta-pas .akce{ display:flex; flex-wrap:wrap; gap:12px; }
.cta-pas .akce .btn-block{ height:52px; padding:0 24px; }
.cta-pas .btn-green{ background:var(--paper); color:var(--zelena-hluboka); box-shadow:0 6px 18px rgba(15,19,16,.18); }
.cta-pas .btn-green:hover{ background:var(--zelena-svetla); color:var(--zelena-hluboka); }
.cta-pas .btn-ghost{ border-color:rgba(255,255,255,.45); color:var(--paper); }
.cta-pas .btn-ghost:hover{ background:rgba(255,255,255,.14); border-color:var(--paper); color:var(--paper); }
.cta-pas .eyebrow{ color:var(--na-zelene-akc); }
.cta-pas .eyebrow::before{ background:var(--na-zelene-akc); }
.cta-pas .lead, .cta-pas .note{ color:var(--na-zelene-2); }
.cta-pas a:not(.btn-block){ color:var(--na-zelene-akc); }

/* ---------- 22. PRÁVNÍ DOKUMENTY ---------- */
.dok-ucinnost{ margin-top:22px; }
.sec--dok{ padding-top:clamp(48px,6vw,80px); }

.dokument{ max-width:60ch; }   /* ≈ 70–75 znaků na řádek — délka řádku pro souvislé čtení */
.dokument h2{
  font-family:'Oswald','Inter',system-ui,sans-serif;
  font-size:clamp(19px,2.3vw,25px); font-weight:700;
  text-transform:uppercase; letter-spacing:.01em;
  line-height:1.32; padding-top:.08em;   /* prostor pro háčky nad verzálkami */
  color:var(--zelena-tmava);
  margin-top:clamp(38px,4.4vw,56px); padding-bottom:2px;
}
.dokument h2:first-child{ margin-top:0; }
.dokument h2 + p{ margin-top:14px; }
.dokument p{
  margin-top:15px; color:var(--text-2);
  font-size:clamp(15px,1.15vw,16.5px); line-height:1.85;
}
.dokument p a{ color:var(--zelena-text); border-bottom:1px solid rgba(63,114,0,.4); }
.dokument p a:hover{ color:var(--text); border-bottom-color:var(--text); }

/* odkazy na zbylé dva dokumenty */
.dok-dalsi{ margin-top:clamp(56px,7vw,88px); padding-top:clamp(28px,3.4vw,40px); border-top:1px solid var(--linka); }
.dok-dalsi-nadpis{
  font-family:'Oswald',sans-serif; font-size:12px; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase; color:var(--zelena-text); line-height:1.5;
}
.dok-dalsi-mriz{ margin-top:18px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
@media (max-width:680px){ .dok-dalsi-mriz{ grid-template-columns:1fr; } }
.dok-karta{
  display:block; position:relative; padding:22px 52px 22px 22px;
  border:1px solid var(--linka); border-radius:14px; background:var(--plocha);
  box-shadow:var(--stin-1);
  transition:border-color .3s var(--ease), background .3s var(--ease), transform .3s var(--ease), box-shadow .3s var(--ease);
}
.dok-karta:hover{ border-color:rgba(102,180,0,.5); background:var(--zelena-svetla); transform:translateY(-2px); box-shadow:var(--stin-2); }
.dok-karta-podtitul{
  display:block; font-size:10.5px; font-weight:800; letter-spacing:.16em;
  text-transform:uppercase; color:var(--text-3); line-height:1.5;
}
.dok-karta-nazev{
  display:block; margin-top:9px; font-family:'Oswald',sans-serif;
  font-size:clamp(17px,2vw,21px); font-weight:600; text-transform:uppercase;
  letter-spacing:.01em; color:var(--text); line-height:1.35; padding-top:.04em;
}
.dok-karta:hover .dok-karta-nazev{ color:var(--zelena-text); }
.dok-karta-sip{ position:absolute; right:22px; top:50%; transform:translateY(-50%); color:var(--zelena-tmava); font-size:20px; line-height:1; }
.dok-karta:hover .dok-karta-sip{ color:var(--zelena-text); }
.dok-dalsi .note{ margin-top:20px; max-width:60ch; }

/* řádek Dokumenty v patičce */
.f-docs{
  position:relative; border-top:1px solid rgba(255,255,255,.12); padding-block:20px;
  display:flex; flex-wrap:wrap; align-items:baseline; gap:10px 24px;
}
.f-docs h4{
  font-family:'Oswald',sans-serif; font-size:12px; font-weight:600; letter-spacing:.16em;
  text-transform:uppercase; color:#8FD11A; line-height:1.5;
}
.f-docs ul{ display:flex; flex-wrap:wrap; gap:8px 24px; }
.f-docs a{ font-size:14px; color:rgba(255,255,255,.66); line-height:1.6; }
.f-docs a:hover{ color:#8FD11A; }
.f-docs-od{ font-size:12.5px; color:rgba(255,255,255,.55); line-height:1.6; margin-left:auto; }
@media (max-width:560px){ .f-docs-od{ margin-left:0; } }

/* ---------- 23. DEKORATIVNÍ SVG VE STRÁNKÁCH ---------- */
/* Ilustrace v HTML mají barvy zapsané atributy a počítaly s černým
   podkladem. CSS je přebarvuje, aby fungovaly na světlé ploše —
   v HTML se tím pádem nic měnit nemusí. */
svg rect[fill="#131A0D"], svg rect[fill="#101507"], svg rect[fill="#121A0C"]{ fill:var(--plocha-3); }
svg stop[stop-color="#22261F"]{ stop-color:#DFE7D8; }
svg stop[stop-color="#12150F"]{ stop-color:#CBD7C1; }
svg stop[stop-color="#16300B"]{ stop-color:#E2EFD5; }
svg stop[stop-color="#0B1408"]{ stop-color:#CCDEBB; }
svg stop[stop-color="#12200E"]{ stop-color:#E0EDD6; }
svg stop[stop-color="#0B120A"]{ stop-color:#CBDCC0; }
svg circle[fill="#8A9682"], svg circle[fill="#C2CBBB"]{ fill:#7C8A75; }
svg g[stroke="#F5F7F3"], svg g[stroke="#EAF6E0"]{ stroke:var(--cerna); stroke-opacity:.42; }
/* jasně zelená #7BD400 je na bílé nečitelná — dekorace dostane tmavší odstín */
svg [stroke="#7BD400"]{ stroke:var(--zelena-tmava); }
svg [fill="#7BD400"]{ fill:var(--zelena-tmava); }
svg stop[stop-color="#7BD400"]{ stop-color:var(--zelena-tmava); }
/* náhledy novinek a ilustrace kurtů: na černé stačilo 35—40% krytí,
   na světlé ploše by z kresby zbyl stín — krytí se zvyšuje */
/* Kresba byla nastavena pro cerny podklad; na svetle karte (--plocha-3)
   by z ni zbyl stin. Vsechna kryti se dorovnavaji na stejnou silu. */
.news-thumb svg [stroke-opacity=".55"],
.news-thumb svg [stroke-opacity=".5"],
.news-thumb svg [stroke-opacity=".45"],
.news-thumb svg [stroke-opacity=".38"],
.news-thumb svg [stroke-opacity=".36"],
.news-thumb svg [stroke-opacity=".35"],
.news-thumb svg [stroke-opacity=".34"]{ stroke-opacity:.8; }
.news-thumb svg [stroke-opacity=".2"],
.news-thumb svg [stroke-opacity=".18"]{ stroke-opacity:.42; }
.news-thumb svg [fill-opacity=".6"],
.news-thumb svg [fill-opacity=".55"],
.news-thumb svg [fill-opacity=".5"]{ fill-opacity:.95; }
.news-thumb svg [fill-opacity=".22"]{ fill-opacity:.55; }
/* Kresba byla dvoubarevna: sekce 23 preklapi jen #7BD400, #66B400 zapsana
   v temz obrazku zustavala jasna a mela proti --plocha-3 jen 1,9:1. */
.news-thumb svg [stroke="#66B400"]{ stroke:var(--zelena-tmava); }
.court .visual svg [stroke-opacity=".34"],
.court .visual svg [stroke-opacity=".30"],
.court .visual svg [stroke-opacity=".3"]{ stroke-opacity:.5; }

/* ---------- PLATEBNÍ METODY V PATIČCE ----------
   Loga Google Pay a Apple Pay mají tmavý text a na černé patičce by zanikla.
   Leží proto na světlé dlaždici, kde si každá značka udrží svoje barvy. */
.f-platby{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
  gap:14px 22px; padding-top:clamp(18px,2.2vw,26px);
  border-top:1px solid rgba(255,255,255,.10);
}
.f-platby .platby{
  display:block; background:#fff; border-radius:12px;
  padding:clamp(10px,1.2vw,15px) clamp(14px,1.8vw,22px);
  line-height:0; transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
.f-platby .platby:hover{ transform:translateY(-2px); box-shadow:0 10px 26px -14px rgba(0,0,0,.6); }
.f-platby .platby img{ display:block; width:100%; max-width:430px; height:auto; }
.f-platby .platby-popis{
  font-size:12px; letter-spacing:.1em; text-transform:uppercase;
  color:rgba(255,255,255,.55); line-height:1.5;
}
.f-platby .platby-popis b{ color:rgba(255,255,255,.82); font-weight:600; }
@media (max-width:700px){
  .f-platby{ justify-content:center; text-align:center; }
  .f-platby .platby img{ max-width:340px; }
}

/* ---------- POSUVNÍK STRÁNKY ----------
   Výchozí posuvník Windows je široký šedý pruh se šipkami a na webu působí
   jako cizí těleso. Zúžíme ho a obarvíme klubovou zelenou, stejně jako
   u vodorovných tabulek v ceníku. Neschováváme ho — návštěvník potřebuje
   vidět, kde na stránce je, a u dlouhých stránek je to zásadní. */
html{ scrollbar-width:thin; scrollbar-color:var(--zelena) var(--plocha-2); }
html::-webkit-scrollbar{ width:10px; }
html::-webkit-scrollbar-track{ background:var(--plocha-2); }
html::-webkit-scrollbar-thumb{
  background:var(--zelena); border-radius:10px;
  border:2px solid var(--plocha-2);
}
html::-webkit-scrollbar-thumb:hover{ background:var(--zelena-tmava); }

/* ---------- FOTKA AREÁLU V HERO SEKCI ----------
   Skutečná fotka kurtů místo kreslené grafiky. Leží úplně vespod a překrývá ji
   bílý závoj, aby zůstala jen jako podkres a černý text nad ní byl plně čitelný.
   Dole závoj houstne, takže se fotka plynule rozpustí do bílé plochy pod hero. */
.hero::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(180deg,
      rgba(255,255,255,.86) 0%,
      rgba(255,255,255,.46) 13%,
      rgba(255,255,255,0) 27%),
    linear-gradient(180deg,
      rgba(255,255,255,0) 58%,
      rgba(255,255,255,.72) 86%,
      rgba(255,255,255,.99) 100%),
    /* Zarážky jsou v pixelech, ne v procentech okna: odstavec končí vždy
       na 624 px, kdežto procenta se s oknem posouvala a v šířkách kolem
       800-1000 px zbyl konec vět na holém modrém kurtu. */
    linear-gradient(94deg,
      rgba(255,255,255,.95) 0px,
      rgba(255,255,255,.92) 260px,
      rgba(255,255,255,.66) 600px,
      rgba(255,255,255,.22) 900px,
      rgba(255,255,255,.08) 1200px),
    url("../img/areal-hero.jpg");
  background-size:cover, cover, cover, cover;
  background-position:center, center, center, center 46%;
  background-repeat:no-repeat, no-repeat, no-repeat, no-repeat;
}
/* Text a tlačítka musí ležet nad fotkou. */
.hero-inner{ z-index:2; }
/* Kreslený kurt v perspektivě by se s fotkou pral — ztlumíme ho na náznak. */
.hero .hero-bg{ opacity:0; }  /* kresbu kurtu nahradila fotka */

@media (max-width:760px){
  /* Na mobilu stačí menší soubor a závoj může být hustší — text je přes celou šířku. */
  .hero::before{
    background-image:
      linear-gradient(180deg,
        rgba(255,255,255,.90) 0%,
        rgba(255,255,255,.50) 13%,
        rgba(255,255,255,0) 27%),
      linear-gradient(180deg,
        rgba(255,255,255,0) 52%,
        rgba(255,255,255,.80) 84%,
        rgba(255,255,255,.99) 100%),
      linear-gradient(180deg,
        rgba(255,255,255,.80) 0%,
        rgba(255,255,255,.78) 55%,
        rgba(255,255,255,.76) 100%),
      url("../img/areal-hero-mobil.jpg");
    background-size:cover, cover, cover, cover;
    background-position:center, center, center, center 50%;
    background-repeat:no-repeat, no-repeat, no-repeat, no-repeat;
  }
}
@media (prefers-reduced-motion:reduce){ .hero::before{ background-attachment:scroll; } }