/* Veřejné stránky klub-os.cz — jen marketing, aplikace používá app.css. */
body.marketing main { padding-top: 8px; }
body.marketing h1 { font-size: 32px; line-height: 1.2; margin: 0 0 14px; }
body.marketing h2 { font-size: 22px; margin: 34px 0 10px; }
body.marketing h3 { font-size: 16px; margin: 0 0 6px; }
body.marketing p { line-height: 1.6; }
body.marketing .lead { font-size: 18px; color: var(--muted); max-width: 680px; }
@media (max-width: 600px) { body.marketing h1 { font-size: 26px; } }

.crumbs { font-size: 13px; color: var(--muted); padding: 10px 0 0; }
.crumbs a { color: var(--muted); }

.hero { padding: 46px 0 30px; max-width: 760px; }
.hero .cta { margin-top: 22px; display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.hero .note { font-size: 13px; color: var(--muted); }
.btn.big { padding: 11px 22px; font-size: 16px; }

.features { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 16px; }
.features .card { margin: 0; }
.features .ico { font-size: 22px; display: block; margin-bottom: 8px; }

.steps { counter-reset: step; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.steps li { list-style: none; background: var(--card); border: 1px solid var(--line);
  border-radius: 10px; padding: 16px; }
.steps li::before { counter-increment: step; content: counter(step);
  display: inline-flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; border-radius: 99px; background: var(--green-soft);
  color: var(--green); font-weight: 700; font-size: 14px; margin-bottom: 8px; }
.steps { padding: 0; }

.priceplan { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; align-items: start; }
.priceplan .price { font-size: 34px; font-weight: 700; color: var(--green); margin: 6px 0; }
.priceplan .per { font-size: 14px; color: var(--muted); font-weight: 400; }
.ticks { padding-left: 0; list-style: none; }
.ticks li { padding: 5px 0 5px 24px; position: relative; }
.ticks li::before { content: "✓"; position: absolute; left: 0; color: var(--green-mid); font-weight: 700; }

.faq details { background: var(--card); border: 1px solid var(--line); border-radius: 10px;
  padding: 12px 16px; margin-bottom: 10px; }
.faq summary { cursor: pointer; font-weight: 600; }
.faq details[open] summary { margin-bottom: 8px; }

.sports { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 14px; }

.ctaband { background: var(--green); color: #fff; border-radius: 12px; padding: 28px 22px;
  text-align: center; margin: 40px 0 10px; }
.ctaband h2 { margin-top: 0; color: #fff; }
.ctaband p { color: #d1fae5; max-width: 560px; margin: 0 auto 16px; }
.ctaband .btn { background: #fff; color: var(--green); font-weight: 600; }

.site-footer { border-top: 1px solid var(--line); background: #fff; padding: 28px 0 20px; margin-top: 50px; }
.foot-grid { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 24px; }
@media (max-width: 700px) { .foot-grid { grid-template-columns: 1fr; } }
.foot-brand { font-weight: 700; font-size: 18px; margin: 0 0 6px; }
.foot-brand span { color: var(--green-mid); }
.foot-h { font-weight: 600; font-size: 13px; text-transform: uppercase;
  letter-spacing: .04em; color: var(--muted); margin: 0 0 8px; }
.site-footer ul { list-style: none; padding: 0; margin: 0; }
.site-footer li { padding: 3px 0; font-size: 14px; }
.foot-bottom { padding-top: 18px; }
