/* Rozcestník klientské zóny (beforeLoginPage.html a -en). Písma a barvy
   podle brand manuálu, stejně jako site.css: Gelica jen Regular,
   Switzer 300/400, žádné tučné řezy. */
@font-face{font-family:"Gelica";src:url("fonts/gelica-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Switzer";src:url("fonts/switzer-300.woff2") format("woff2");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:"Switzer";src:url("fonts/switzer-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}

:root{
  --ink:#1B1C1C;
  --paper:#FBFAF5;
  --white:#FFFFFF;
  --lime:#E1F25E;
  --line:#DCDDDD;
  --muted:#6B6D6D;
  --soft:#F1F1ED;
  --display:"Gelica",Georgia,"Times New Roman",serif;
  --body:"Switzer",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--body);font-weight:400;background:var(--paper);color:var(--ink);line-height:1.5;font-synthesis:none;-webkit-font-smoothing:antialiased;min-height:100vh;display:flex;flex-direction:column}
b,strong{font-weight:400}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.zone-card.dark :focus-visible{outline-color:var(--lime)}

.wrap{width:100%;max-width:1120px;margin:0 auto;padding:0 24px}

/* hlavička */
.top{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding-top:22px;padding-bottom:22px}
.brand{display:flex;align-items:center;gap:14px}
.brand img{width:104px}
.brand .sub{font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);padding-left:14px;border-left:1px solid var(--line);line-height:1.6}
.top-actions{display:flex;align-items:center;gap:14px}
.btn-ghost{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border:1px solid var(--line);border-radius:999px;background:var(--white);font-size:.86rem;transition:.16s}
.btn-ghost:hover{border-color:var(--ink)}
.lang-switch{display:flex;align-items:center;gap:2px;font-size:.78rem;letter-spacing:.08em}
.lang-switch a,.lang-switch span{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%}
.lang-switch span{background:var(--ink);color:var(--white)}
.lang-switch a{color:var(--muted)}
.lang-switch a:hover{color:var(--ink)}

/* úvod */
main{flex:1 0 auto}
.hero{padding:clamp(48px,9vh,96px) 0 40px;display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.45fr);gap:48px;align-items:end}
.eyebrow{display:flex;align-items:center;gap:12px;font-size:.74rem;letter-spacing:.18em;text-transform:uppercase}
.eyebrow::before{content:"";width:36px;height:4px;border-radius:999px;background:var(--lime)}
h1{font-family:var(--display);font-weight:400;font-size:clamp(2.8rem,6.4vw,5.4rem);letter-spacing:-.025em;line-height:.98;margin-top:18px}
.mark{background:linear-gradient(transparent 62%,var(--lime) 62%,var(--lime) 92%,transparent 92%)}
.lead{color:var(--muted);font-size:1.05rem;font-weight:300}

/* karty */
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;padding-bottom:88px}
.zone-card{position:relative;display:flex;flex-direction:column;min-height:330px;padding:32px;border-radius:28px;background:var(--white);border:1px solid var(--line);transition:.18s}
.zone-card:hover{border-color:var(--ink);transform:translateY(-2px)}
.zone-card.dark{background:var(--ink);border-color:var(--ink);color:var(--white)}
.zone-head{display:flex;justify-content:space-between;align-items:center;gap:12px}
.zone-n{font-size:.74rem;letter-spacing:.14em;color:var(--muted)}
.dark .zone-n{color:#9EA0A0}
.tag{font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;padding:5px 10px;border-radius:999px;background:var(--soft)}
.dark .tag{background:rgba(255,255,255,.1);color:#D9DADA}
.zone-card h2{font-family:var(--display);font-weight:400;font-size:clamp(1.9rem,3vw,2.6rem);line-height:1.04;letter-spacing:-.015em;margin-top:auto;padding-top:48px}
.zone-card p{margin-top:10px;color:var(--muted);max-width:40ch}
.dark p{color:#B9BBBB}
.btn{align-self:flex-start;display:inline-flex;align-items:center;gap:10px;min-height:48px;margin-top:28px;padding:0 24px;border-radius:999px;font-size:.92rem;transition:.16s}
.btn::after{content:"";width:8px;height:8px;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg);margin-left:2px}
.btn.ink{background:var(--ink);color:var(--white)}
.btn.lime{background:var(--lime);color:var(--ink)}
.zone-card:hover .btn.ink{background:var(--lime);color:var(--ink)}
.zone-card:hover .btn.lime{background:var(--white)}
/* Celá karta je klikací přes odkaz v tlačítku. */
.btn.stretch::before{content:"";position:absolute;inset:0;border-radius:28px}

/* patička */
.foot{border-top:1px solid var(--line)}
.foot .wrap{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;padding-top:22px;padding-bottom:22px;font-size:.82rem;color:var(--muted)}
.foot a{color:var(--ink);border-bottom:1px solid var(--ink)}

@media(max-width:860px){
  .hero{grid-template-columns:1fr;gap:18px;padding-top:40px}
  .grid{grid-template-columns:1fr}
  .zone-card{min-height:0;padding:26px}
  .zone-card h2{padding-top:36px}
}
@media(max-width:560px){
  .wrap{padding:0 18px}
  .brand .sub{display:none}
  .btn-ghost{padding:0 13px;font-size:.8rem}
  .btn{width:100%;justify-content:center}
}