/* ==========================================================================
   Golf Club Cardinal
   Paleta a typografie navazují na návrh z Claude v aplikaci.
   Technické provedení: fonty self-hostované, žádné externí požadavky,
   obsah čitelný i bez JavaScriptu.
   ========================================================================== */

:root{
  --ink-d:   #14200C;   /* nejtmavší zeleň — tmavé plochy, nadpisy */
  --ink:     #2C3A1B;   /* běžný text */
  --muted:   #5C6949;   /* doplňkový text */
  --muted-l: #8A9470;   /* popisky, jemné detaily */
  --green:   #3C5A17;   /* akční zelená */
  --cream:   #F5F0E1;   /* hlavní pozadí */
  --cream-l: #FBF8EF;   /* světlejší plocha */
  --cream-d: #EDE6CF;   /* linky, oddělovače */
  --gold:    #E7DCA8;   /* prosluněný akcent */
  --red:     #DA1F26;   /* z loga — akcenty, čísla slev */

  --wrap: 1180px;
  --r: 2px;

  --f-head: Spectral, Georgia, 'Times New Roman', serif;
  --f-body: Barlow, 'Segoe UI', Helvetica, Arial, sans-serif;
}

*,*::before,*::after{ box-sizing:border-box }

html{ scroll-behavior:smooth; scroll-padding-top:84px; -webkit-text-size-adjust:100% }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto } }

body{
  margin:0; background:var(--cream); color:var(--ink);
  font:400 clamp(16px,.5vw + 14.6px,17px)/1.7 var(--f-body);
  -webkit-font-smoothing:antialiased; text-wrap:pretty;
}

img{ max-width:100%; height:auto; display:block }

a{ color:var(--green) }
a:focus-visible,button:focus-visible{
  outline:3px solid var(--red); outline-offset:3px; border-radius:2px;
}

.sr{
  position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}
.skip{
  position:absolute;left:-9999px;top:0;z-index:100;
  background:var(--ink-d);color:var(--cream);padding:.7rem 1.1rem;
}
.skip:focus{ left:0 }

.wrap{ width:min(100% - clamp(2rem,5vw,4.5rem), var(--wrap)); margin-inline:auto }

/* ---------- odkryv pri scrollu (jen ozdoba) ---------- */
.js [data-reveal]{ opacity:0; transform:translateY(14px) }
.js [data-reveal].is-in{
  opacity:1; transform:none;
  transition:opacity .6s cubic-bezier(.22,.61,.36,1), transform .6s cubic-bezier(.22,.61,.36,1);
}
@media (prefers-reduced-motion:reduce){
  .js [data-reveal]{ opacity:1; transform:none; transition:none }
}

/* ---------- typografie ---------- */
h1,h2,h3{
  font-family:var(--f-head); font-weight:500; line-height:1.1;
  letter-spacing:-.01em; margin:0 0 .55em; color:var(--ink-d);
}
h2{ font-size:clamp(30px,4.2vw,52px) }
h3{ font-size:clamp(20px,2.2vw,27px) }
.h2--light{ color:var(--cream-l) }

.eyebrow{
  font-size:12px; font-weight:600;
  letter-spacing:.22em; text-transform:uppercase;
  color:var(--red); margin:0 0 1.2rem;
}
.eyebrow i{ font-style:normal; opacity:.85 }
.eyebrow i::after{
  content:""; display:inline-block; width:26px; height:1px;
  background:currentColor; margin:0 .55rem 0 .55rem; vertical-align:.28em; opacity:.7;
}
.eyebrow--gold{ color:var(--gold) }

.lead{ font-size:clamp(17px,1.3vw,19px); color:var(--muted) }
.lead--light{ color:rgba(251,248,239,.86); max-width:58ch }
p{ margin:0 0 1.15rem; max-width:64ch }

.rule{ border:0; border-top:1px solid var(--cream-d); margin:2rem 0 1.4rem }
.rule--light{ border-top-color:rgba(231,220,168,.3); margin:2.2rem 0 2.4rem }

.note{ font-family:var(--f-head); font-size:19px; color:var(--ink-d); font-style:italic }

/* ---------- tlacitka ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  font-size:13px; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; text-decoration:none;
  padding:.95rem 1.6rem; border-radius:var(--r); border:1px solid transparent;
  transition:background .22s ease, color .22s ease, border-color .22s ease, transform .22s ease;
}
.btn:hover{ transform:translateY(-1px) }
.btn--red{ background:var(--red); color:#fff }
.btn--red:hover{ background:#B8171D }
.btn--green{ background:var(--green); color:var(--cream-l) }
.btn--green:hover{ background:#2E4611 }
.btn--gold{ background:var(--gold); color:var(--ink-d) }
.btn--gold:hover{ background:#F0E7BE }
.btn--ghost{ background:transparent; color:var(--cream-l); border-color:rgba(251,248,239,.45) }
.btn--ghost:hover{ background:rgba(251,248,239,.12); border-color:var(--cream-l) }

/* ---------- hlavicka ---------- */
.hdr{
  position:sticky; top:0; z-index:50;
  background:var(--ink-d); border-bottom:2px solid var(--red);
}
.hdr__in{ display:flex; align-items:center; gap:1.6rem; padding:.7rem 0 }
.hdr__logo img{ width:132px }
.nav{ margin-left:auto; display:flex; gap:1.5rem }
.nav a{
  font-size:13px; font-weight:600; letter-spacing:.13em; text-transform:uppercase;
  color:var(--cream); text-decoration:none; padding:.45rem 0;
  border-bottom:2px solid transparent;
}
.nav a:hover{ border-bottom-color:var(--gold); color:#fff }
.hdr__cta{ padding:.7rem 1.2rem; font-size:12px }

.nav__btn{
  display:none; margin-left:auto; width:44px; height:38px;
  background:none; border:0; cursor:pointer; padding:8px 6px;
}
.nav__btn span:not(.sr){ display:block; height:2px; background:var(--cream); margin:5px 0 }
.nav-m{ display:none }

/* ---------- hero ---------- */
/* hero pres celou obrazovku, obsah vycentrovany vys —
   dole zustava volna fotka s mickem a botami jako na originalu */
.hero{
  position:relative; min-height:100svh; display:flex; align-items:center;
  padding:clamp(5rem,11vh,7.5rem) 0 clamp(8rem,24vh,14rem);
}
.hero{ overflow:hidden }
.hero__img{
  position:absolute; left:0; right:0; top:0; height:100vh; z-index:-2;
  transform:translate3d(0,var(--py,0),0); will-change:transform;
  background:url("bg/hero.jpg") center 55%/cover no-repeat;
}
.hero::after{
  content:""; position:absolute; inset:0; z-index:-1;
  background:
    linear-gradient(100deg, rgba(20,32,12,.80) 0%, rgba(20,32,12,.42) 46%, rgba(20,32,12,.10) 76%),
    linear-gradient(180deg, rgba(20,32,12,.30) 0%, rgba(20,32,12,0) 28%, rgba(20,32,12,.45) 100%);
}
.hero__in{ position:relative }

.hero__h1{ margin:0 0 1.5rem; line-height:0 }
.hero__h1 img{ width:min(100%,470px); filter:drop-shadow(0 4px 26px rgba(20,32,12,.5)) }

.hero__lead{
  font-family:var(--f-head); font-weight:500;
  font-size:clamp(28px,3.6vw,44px); line-height:1.15;
  color:var(--cream-l); margin:0 0 2rem; max-width:16ch;
  text-shadow:0 2px 20px rgba(20,32,12,.5);
}
.hero__cta{ display:flex; flex-wrap:wrap; gap:.8rem; margin-bottom:2.8rem }

.facts{
  list-style:none; margin:0; padding:1.9rem 0 0;
  display:flex; flex-wrap:wrap; gap:3rem;
  border-top:1px solid rgba(231,220,168,.35);
}
.facts li{ display:flex; flex-direction:column; gap:.2rem }
.facts b{
  font-family:var(--f-head); font-weight:500; font-size:clamp(30px,3.4vw,44px);
  line-height:1; color:var(--gold); font-variant-numeric:tabular-nums;
}
.facts span{
  font-size:11px; font-weight:600; letter-spacing:.18em;
  text-transform:uppercase; color:rgba(251,248,239,.78);
}

/* ---------- sekce ---------- */
.sec{ padding:clamp(4rem,8vw,7rem) 0; position:relative }
.sec--cream{ background:var(--cream) }
.sec--light{ background:var(--cream-l) }

/* fotografická sekce: obrázek je samostatná vrstva, aby s ní šlo hýbat */
.sec--photo{ overflow:hidden; isolation:isolate }
.pbg{
  position:absolute; left:0; right:0; top:0; height:100vh; z-index:-1;
  background-position:center; background-size:cover; background-repeat:no-repeat;
  transform:translate3d(0,var(--py,0),0); will-change:transform;
}
.sec--photo::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg,
    rgba(20,32,12,.94) 0%, rgba(20,32,12,.62) 12%,
    rgba(20,32,12,.52) 70%, rgba(20,32,12,.90) 100%);
}
.sec--photo > .wrap{ position:relative; z-index:1 }
.bg-hriste{ background-image:url("bg/7975792.jpg") }
.bg-kontakt{ background-image:url("bg/band.jpg"); background-position:center 62% }

.intro{ max-width:720px }
.grid-2{ display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(2rem,4vw,3.4rem); align-items:start }
.grid-2--fees{ grid-template-columns:.85fr 1.15fr }

/* ---------- Vite ze ---------- */
.know{
  background:var(--cream-l); border:1px solid var(--cream-d);
  border-top:3px solid var(--red); border-radius:var(--r);
  padding:clamp(1.5rem,2.6vw,2.1rem);
}
.know h3{ margin-bottom:1.1rem }
.know ol{ list-style:none; margin:0; padding:0; counter-reset:vz }
.know li{
  counter-increment:vz; position:relative; padding:.75rem 0 .75rem 2.3rem;
  border-top:1px solid var(--cream-d); font-size:15.5px; color:var(--muted);
}
.know li:first-child{ border-top:0 }
.know li::before{
  content:counter(vz,decimal-leading-zero);
  position:absolute; left:0; top:.95rem;
  font-size:11px; font-weight:700; letter-spacing:.08em; color:var(--red);
}

/* ---------- scorecard ---------- */
.card{
  margin-top:2.4rem; background:var(--cream-l);
  border-radius:var(--r); overflow:hidden;
  box-shadow:0 30px 70px -34px rgba(0,0,0,.9);
}
.score{ width:100%; border-collapse:collapse; table-layout:fixed }
.score th:nth-child(1),.score td:nth-child(1){ width:52% }
.score th:nth-child(2),.score td:nth-child(2){ width:28% }
.score th:nth-child(3),.score td:nth-child(3){ width:20% }
.score thead th{
  background:var(--ink-d); color:var(--gold);
  font-weight:600; font-size:11px;
  letter-spacing:.19em; text-transform:uppercase;
  text-align:left; padding:1rem 1.6rem;
}
.score .num{ text-align:right }
.score tbody th,.score tbody td{
  padding:1.25rem 1.6rem; border-top:1px solid var(--cream-d); vertical-align:middle;
}
.score tbody th{
  text-align:left; font-family:var(--f-head); font-weight:500;
  font-size:clamp(19px,1.7vw,23px); color:var(--ink-d);
}
.score tbody th em{
  display:block; font-style:normal; font-family:var(--f-body);
  font-size:11px; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:var(--muted-l); margin-top:.2rem;
}
.score tbody td{ font-size:15px; color:var(--muted) }
.score td.num b{
  font-family:var(--f-head); font-size:clamp(30px,3.2vw,40px); font-weight:600;
  line-height:1; color:var(--red); font-variant-numeric:tabular-nums;
}
.score td.num b i{ font-style:normal; font-size:.44em; vertical-align:.9em; margin-left:.08em }
.score tbody tr:hover{ background:#fff }
.card__note{
  margin:0; padding:1.05rem 1.6rem; border-top:1px solid var(--cream-d);
  font-size:14px; color:var(--muted); max-width:none;
}

/* ---------- vyuka: pulena sekce ---------- */
.sec--split{ position:relative }
.split{ display:grid; grid-template-columns:1fr 1fr; min-height:clamp(420px,58vh,600px) }
.split{ position:relative; overflow:hidden }
.split__img{ position:relative; overflow:hidden }
.split__img::before{
  content:""; position:absolute; left:0; right:0; top:0; height:100vh;
  background:url("bg/7741985.jpg") center/cover no-repeat;
  transform:translate3d(0,var(--py,0),0); will-change:transform;
}
.split__box{ background:var(--cream-l); display:flex; align-items:center }
.split__inner{ padding:clamp(2.4rem,5vw,4.5rem); width:min(100%, 640px) }

/* ---------- dokumenty ---------- */
.dl{ display:grid; gap:.65rem; margin-top:1.7rem }
.dl--stack{ margin-top:2rem }
.dl__item{
  display:flex; flex-direction:column; gap:.1rem;
  padding:.95rem 1.2rem; text-decoration:none;
  background:var(--cream); border:1px solid var(--cream-d);
  border-left:3px solid var(--red); border-radius:var(--r);
  transition:border-color .22s ease, transform .22s ease, background .22s ease;
}
.dl__item:hover{ background:#fff; border-color:var(--muted-l); border-left-color:var(--red); transform:translateX(3px) }
.dl__t{ font-family:var(--f-head); font-weight:500; font-size:17px; color:var(--ink-d) }
.dl__m{ font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--muted-l) }

/* ---------- poplatky ---------- */
.fees{ list-style:none; margin:0; padding:0 }
.fees li{
  display:flex; align-items:baseline; gap:1.2rem;
  padding:1rem 0; border-bottom:1px solid var(--cream-d);
}
.fees li:first-child{ border-top:1px solid var(--cream-d) }
.fees__n{ font-family:var(--f-head); font-size:19px; color:var(--ink-d) }
.fees__n em{
  display:block; font-style:normal; font-family:var(--f-body);
  font-size:11px; font-weight:600; letter-spacing:.12em; text-transform:uppercase;
  color:var(--muted-l); margin-top:.1rem;
}
.fees__v{
  margin-left:auto; font-family:var(--f-head); font-weight:600; font-size:21px;
  color:var(--ink-d); font-variant-numeric:tabular-nums; white-space:nowrap;
}

/* ---------- loga ---------- */
.logos{
  list-style:none; margin:2.2rem 0 0; padding:0;
  display:grid; grid-template-columns:repeat(2,1fr); gap:1rem;
}
.logos li{
  display:flex; align-items:center; justify-content:center;
  background:#fff; border:1px solid var(--cream-d); border-radius:var(--r);
  padding:1rem 1.4rem; min-height:104px;
  transition:border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}
.logos li:hover{
  border-color:var(--muted-l);
  box-shadow:0 14px 30px -22px rgba(20,32,12,.8);
  transform:translateY(-2px);
}
.logos img{ max-height:48px; max-width:170px; width:auto; object-fit:contain }
.logos--lg img{ max-height:58px; max-width:196px }
.logos__h{
  margin-top:clamp(2.8rem,5vw,3.8rem);
  font-size:clamp(22px,2.4vw,30px); color:var(--green);
}
@media (min-width:820px){ .logos,.logos--lg{ grid-template-columns:repeat(3,1fr) } }

/* ---------- kontakt ---------- */
.kontakt{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1.6rem,4vw,3rem) }
.klabel{
  font-size:11px; font-weight:700; letter-spacing:.2em; text-transform:uppercase;
  color:var(--red); margin:0 0 .9rem;
}
.addr{ font-style:normal; line-height:1.9; color:var(--cream-l) }
.mail{ margin:0 0 1.1rem }
.mail a{ color:var(--gold); text-decoration:none; border-bottom:1px solid rgba(231,220,168,.4) }
.mail a:hover{ border-bottom-color:var(--gold) }
.kmeta{ margin:0; color:rgba(251,248,239,.78); line-height:1.8 }
.kmeta b{ color:var(--cream-l); font-weight:600 }

.mapwrap{
  margin-top:clamp(2rem,4vw,3rem);
  border:1px solid rgba(231,220,168,.28); border-radius:var(--r); overflow:hidden;
}
.map{
  display:block; width:100%; height:clamp(280px,38vh,400px); border:0;
  filter:saturate(.82) contrast(1.02);
}
.mapbar{
  padding:1.1rem clamp(1.2rem,2.5vw,1.8rem);
  border-top:1px solid rgba(231,220,168,.28);
  display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap;
  color:rgba(251,248,239,.82);
}
.mapbar__btns{ display:flex; gap:.6rem; flex-wrap:wrap }
.mapbar .btn{ padding:.65rem 1.1rem; font-size:11px }
.mapnote{
  margin:0; padding:0 clamp(1.2rem,2.5vw,1.8rem) 1rem;
  font-size:11px; color:rgba(251,248,239,.5); max-width:none;
}
.mapnote a{ color:rgba(251,248,239,.7) }

/* ---------- paticka ---------- */
.foot{ background:var(--ink-d); color:var(--muted-l); padding:1.8rem 0 }
.foot__in{ display:flex; align-items:center; justify-content:space-between; gap:1.2rem; flex-wrap:wrap }
.foot__logo{ width:118px; opacity:.85 }
.foot p{ margin:0; font-size:13px }

/* ---------- responzivita ---------- */
@media (max-width:980px){
  .grid-2,.grid-2--fees{ grid-template-columns:1fr }
  .split{ grid-template-columns:1fr; min-height:0 }
  .split__img{ min-height:300px }
  .split__inner{ width:100%; max-width:var(--wrap); margin-inline:auto }
  .kontakt{ grid-template-columns:1fr 1fr }
}

@media (max-width:900px){
  .nav,.hdr__cta{ display:none }
  .nav__btn{ display:block }
  .nav-m{
    display:grid; max-height:0; overflow:hidden;
    background:var(--ink-d); transition:max-height .28s ease;
  }
  .nav-m.is-open{ max-height:420px }
  .nav-m a{
    font-size:14px; font-weight:600; letter-spacing:.13em; text-transform:uppercase;
    color:var(--cream); text-decoration:none; padding:.95rem 1.2rem;
    border-top:1px solid rgba(231,220,168,.16);
  }
}

@media (max-width:640px){
  .hdr__logo img{ width:112px }
  .hero__h1 img{ width:min(100%,320px) }
  .hero__cta .btn{ flex:1 1 auto }
  .facts{ display:grid; grid-template-columns:repeat(3,1fr); gap:1rem }
  .facts b{ font-size:26px }
  .facts span{ font-size:10px; letter-spacing:.1em; line-height:1.35 }
  .kontakt{ grid-template-columns:1fr; gap:2rem }
  .mapbar{ flex-direction:column; align-items:flex-start }

  .score thead{ display:none }
  .score,.score tbody,.score tr,.score th,.score td{ display:block; width:100% }
  .score tbody tr{ border-top:1px solid var(--cream-d); padding:.7rem 0 }
  .score tbody tr:first-child{ border-top:0 }
  .score tbody th{ border:0; padding:.2rem 1.3rem }
  .score tbody td{ border:0; padding:.2rem 1.3rem; display:flex; align-items:baseline; gap:.9rem }
  .score tbody td::before{
    content:attr(data-l); font-size:10px; font-weight:600; letter-spacing:.16em;
    text-transform:uppercase; color:var(--muted-l); min-width:5.4em;
  }
  .score td.num{ text-align:left }
}