@font-face{font-family:"Teko";font-weight:700;font-style:normal;font-display:swap;src:url("../fonts/Teko_Bold.woff2") format("woff2")}
@font-face{font-family:"Teko";font-weight:600;font-style:normal;font-display:swap;src:url("../fonts/Teko_SemiBold.woff2") format("woff2")}
@font-face{font-family:"Roundo";font-weight:500;font-style:normal;font-display:swap;src:url("../fonts/Roundo_Medium.woff2") format("woff2")}
@font-face{font-family:"Roundo";font-weight:600;font-style:normal;font-display:swap;src:url("../fonts/Roundo_SemiBold.woff2") format("woff2")}
:root{
  color-scheme:dark;
  --bg:#0d0e0f; --bg2:#121415; --panel:#17191b; --panel-hi:#1f2224;
  --hair:#2a2e31; --hair-hi:#3a3f43;
  --txt:#d8d3c6; --dim:#8f8a7e; --dimmer:#6a665d; --sel:#f2eee3;
  --gold:#c9a450; --gold-hi:#e8c977; --gold-dk:#8f7230;
  --display:"Teko","DejaVu Sans Condensed",Impact,sans-serif;
  --body:"Roundo","DejaVu Sans",Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--txt);font-family:var(--body);font-weight:500;line-height:1.5;
 background-image:radial-gradient(ellipse at 50% -20%,#1c1e20 0%,var(--bg) 60%);
 display:flex;flex-direction:column;overflow:hidden}
a{color:var(--gold);text-decoration:none}
a:hover{color:var(--gold-hi)}
.wrap{max-width:1180px;margin:0 auto;padding:0 1.2rem;width:100%}

.grain{position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.055;mix-blend-mode:screen;
 background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .9 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
header,main,footer,.subnav{position:relative;z-index:1}

/* brúsené zlato */
.logo .lap,.logo .plugin,h1,.tile .name{
  background:linear-gradient(100deg,#8f7230 0%,#d9b765 18%,#f3dc9a 32%,#b8953f 50%,#e5c674 68%,#9a7b35 86%,#d9b765 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent}

/* ===== hlavička + hlavné menu ===== */
.top{border-bottom:1px solid var(--hair);background:linear-gradient(#141617,#0f1011);flex:none}
.nav{display:flex;align-items:center;gap:1.5rem;padding:.7rem 1.2rem;flex-wrap:wrap}
.logo{display:flex;flex-wrap:wrap;column-gap:.55rem;align-items:baseline;line-height:1;max-width:max-content}
.logo .lap{font-family:var(--display);font-weight:700;font-size:2.4rem;letter-spacing:2px}
.logo .plugin{font-family:var(--display);font-weight:600;font-size:2.4rem;letter-spacing:2px}
.logo .motto{flex-basis:100%;color:var(--dimmer);font-size:.62rem;letter-spacing:2.5px;text-transform:uppercase;margin-top:.4rem}
.menu{margin-left:auto;display:flex;gap:.4rem}
.menu a{font-family:var(--display);font-weight:600;color:var(--dim);letter-spacing:1.5px;font-size:1.4rem;padding:.35rem 1rem;border-radius:4px;border:1px solid transparent}
.menu a:hover{color:var(--gold-hi)}
.menu a.on{color:var(--gold-hi);border-color:var(--gold-dk);background:linear-gradient(var(--panel-hi),var(--panel))}

/* ===== záložky produktov sekcie ===== */
.subnav{flex:none;background:#0b0c0d;border-bottom:1px solid var(--hair)}
.subnav .wrap{display:flex;align-items:stretch;gap:.2rem;overflow-x:auto}
.subnav .label{font-family:var(--display);font-weight:600;letter-spacing:1.5px;color:var(--dimmer);font-size:1rem;padding:.6rem 1rem .6rem 0;border-right:1px solid var(--hair);margin-right:.6rem;align-self:center}
.subnav a{font-family:var(--display);font-weight:700;letter-spacing:1.2px;font-size:1.3rem;color:var(--dim);padding:.6rem 1.1rem;border-bottom:2px solid transparent;white-space:nowrap}
.subnav a small{font-family:var(--body);font-size:.6rem;letter-spacing:1.5px;color:var(--dimmer);margin-left:.4rem;text-transform:uppercase}
.subnav a:hover{color:var(--sel)}
.subnav a.on{color:var(--gold-hi);border-bottom-color:var(--gold)}

/* ===== obrazovka ===== */
main{flex:1;min-height:0;display:flex;flex-direction:column}
.screen{flex:1;min-height:0;display:flex;flex-direction:column;padding:1.2rem 0 .8rem}
.screen>.wrap{flex:1;min-height:0;display:flex;flex-direction:column}
.kicker{font-size:.74rem;letter-spacing:3px;text-transform:uppercase;color:var(--dim)}
h1{margin:.1rem 0 0;font-family:var(--display);font-weight:600;font-size:3.6rem;letter-spacing:4px;line-height:1}

/* domov */
.screen.home{text-align:center;justify-content:center}
.screen.home>.wrap{justify-content:center}
.screen.home h1{font-size:5.4rem;letter-spacing:3px}
.screen.home .quote{color:var(--txt);opacity:.8;max-width:58rem;margin:1.1rem auto 0;font-size:.95rem;border:0;padding:0}
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:2.4rem}
.tile{display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:.1rem;padding:1.2rem 1.4rem 1.3rem;
 background:linear-gradient(#1a1c1e,#131516);border:1px solid var(--hair);border-radius:6px;border-top:2px solid var(--gold-dk);
 box-shadow:0 20px 40px -28px #000}
.tile:hover{border-color:var(--gold)}
.tile .num{font-size:.75rem;letter-spacing:3px;color:var(--dimmer)}
.tile .name{font-family:var(--display);font-weight:600;font-size:2.9rem;letter-spacing:2px;line-height:1}
.tile .sub{color:var(--dim);font-size:.85rem;margin-top:.4rem}
.body.center{max-width:40rem;margin:1rem auto 0;color:var(--dim)}

/* výber produktu v sekcii */
.pick{display:grid;grid-template-columns:1fr;grid-auto-rows:max-content;gap:1rem;margin-top:1rem;align-content:start;overflow:auto;min-height:0}
.unit{display:block;background:linear-gradient(#1a1c1e,#131516);border:1px solid var(--hair);border-radius:6px;overflow:hidden;
 box-shadow:0 20px 40px -28px #000,inset 0 1px 0 #ffffff0a}
.unit:hover{border-color:var(--gold)}
.unit img{display:block;width:100%;height:auto;border-top:1px solid #0a0b0c}
.unit .blank{height:150px;display:flex;align-items:center;justify-content:center;border-top:1px solid #0a0b0c}
.unit .blank span{font-family:var(--display);font-weight:700;font-size:3.2rem;letter-spacing:3px;color:#2d3134}
.unit .meta{padding:.6rem 1.1rem .7rem}
.unit .series{font-size:.7rem;letter-spacing:3px;text-transform:uppercase;color:var(--dimmer)}
.unit h3{margin:.1rem 0 .4rem;font-family:var(--display);font-weight:600;font-size:1.9rem;letter-spacing:3px;line-height:1;color:var(--sel)}
.unit .line{display:flex;gap:.9rem;align-items:center;flex-wrap:wrap}
.unit.soon{opacity:.7}
.ver{color:var(--dimmer);font-size:.74rem;letter-spacing:2px;text-transform:uppercase}
.tag{font-family:var(--display);font-weight:600;font-size:1.1rem;letter-spacing:1.5px;padding:.14rem .6rem .02rem;border-radius:3px;line-height:1.3;margin-right:.5rem}
.tag.free{border:1px solid var(--gold);color:var(--gold)}
.tag.paid{background:var(--gold);color:#1a1507}
.tag.dim{border:1px solid var(--hair-hi);color:var(--dim)}

/* ===== produkt na jednej obrazovke ===== */
.screen.product .head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.screen.product .ver{margin-top:.4rem;display:flex;align-items:center}
.cta{display:flex;gap:.7rem;flex-wrap:wrap}
.btn{display:inline-block;padding:.5rem 1.2rem .4rem;border-radius:4px;border:1px solid var(--hair-hi);color:var(--sel);cursor:pointer;
 font-family:var(--display);font-weight:600;letter-spacing:1.2px;font-size:1.2rem;line-height:1.2;background:linear-gradient(var(--panel-hi),var(--panel))}
.btn:hover{border-color:var(--gold);color:var(--gold-hi)}
.btn.gold{color:#1a1507;border-color:#b08f3f;background:linear-gradient(170deg,#efd48a 0%,#c9a450 45%,#a98634 100%);text-shadow:0 1px 0 #ffffff55}
.btn.gold:hover{filter:brightness(1.08);color:#1a1507}
.panelshot{margin:.9rem 0 0;overflow-x:auto;background:var(--panel);border:1px solid var(--hair);border-radius:6px;padding:.5rem;flex:none;
 box-shadow:0 30px 60px -30px #000,inset 0 1px 0 #ffffff0d}
.panelshot img{display:block;width:100%;max-height:34vh;object-fit:contain;height:auto;border-radius:3px}
.sheet{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;padding-bottom:12rem;scrollbar-width:none}
.sheet::-webkit-scrollbar,.pick::-webkit-scrollbar{display:none}
.pick{scrollbar-width:none}
.sheet>input{position:absolute;opacity:0;pointer-events:none}

.tabs{flex:none;margin-top:.9rem}
.tabbar{display:flex;gap:.2rem;border-bottom:1px solid var(--hair);flex:none;align-items:center}
.tabbar .cta{margin-left:auto;margin-right:1rem;padding-bottom:.35rem}
.tabbar .btn{font-size:1.1rem;padding:.4rem 1rem .3rem}
.tabbar label{font-family:var(--display);font-weight:600;letter-spacing:1.2px;font-size:1.25rem;color:var(--dim);padding:.45rem 1rem;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px}
.tabbar label:hover{color:var(--sel)}
.pane{display:none;padding:1rem .2rem 0}
#t-about:checked~.tabs .pane.about,#t-features:checked~.tabs .pane.features,#t-download:checked~.tabs .pane.download,#t-new:checked~.tabs .pane.new{display:block}
#t-about:checked~.tabs .tabbar label[for=t-about],#t-features:checked~.tabs .tabbar label[for=t-features],
#t-download:checked~.tabs .tabbar label[for=t-download],#t-new:checked~.tabs .tabbar label[for=t-new]{color:var(--gold-hi);border-bottom-color:var(--gold)}

.lead{color:var(--txt);max-width:64rem;margin:0 0 .9rem;font-size:1rem}
.body{color:var(--dim);max-width:64rem}
.chain{display:flex;flex-wrap:wrap;gap:.45rem;align-items:center;margin:.4rem 0 .9rem;color:var(--dim);font-size:.76rem;letter-spacing:2px;text-transform:uppercase}
.chain span{background:var(--panel);border:1px solid var(--hair);border-radius:4px;padding:.3rem .7rem;color:var(--sel)}
.chain span.in{border-color:var(--gold);color:var(--gold)}
.chain i{font-style:normal;color:var(--dimmer)}
.quote{border-left:3px solid var(--gold);padding:.2rem 0 .2rem 1.2rem;color:var(--dim);max-width:52rem;font-size:.92rem;margin:.6rem 0 0}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:.8rem}
.card{background:var(--panel);border:1px solid var(--hair);border-radius:6px;padding:.9rem 1rem;border-top:2px solid var(--gold-dk)}
.card h3{margin:0 0 .3rem;font-family:var(--display);font-weight:600;color:var(--sel);font-size:1.45rem;letter-spacing:1px}
.card h3 small{font-family:var(--body);color:var(--dimmer);letter-spacing:2px;font-size:.66rem;margin-left:.6rem}
.card p{margin:0;color:var(--dim);font-size:.86rem}
.dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:.8rem}
.dl a{display:block;background:var(--panel);border:1px solid var(--hair);border-radius:6px;padding:.9rem 1.1rem;color:var(--sel)}
.dl a:hover{border-color:var(--gold)}
.dl .fmt{font-family:var(--display);font-weight:600;font-size:1.8rem;letter-spacing:1px}
.dl .os{color:var(--dim);font-size:.78rem;letter-spacing:2px;text-transform:uppercase}
.dl .zip{color:var(--dimmer);font-size:.72rem;margin-top:.3rem;word-break:break-all}
.note{color:var(--dim);font-size:.88rem;margin:.9rem 0 0;max-width:64rem}
.note p{margin:0 0 .6rem}
.note code,.body code{background:var(--panel);border:1px solid var(--hair);border-radius:3px;padding:.05rem .4rem;color:var(--sel);font-size:.82rem}

footer{flex:none;border-top:1px solid var(--hair);background:#0b0c0d;padding:.6rem 0;color:var(--dimmer);font-size:.72rem;letter-spacing:1.5px}
footer .wrap{display:flex;gap:1.2rem;align-items:center;flex-wrap:wrap}
footer .stripe{width:38px;height:3px;background:linear-gradient(90deg,#8f7230,#f3dc9a,#8f7230);border-radius:2px}
footer a{margin-left:auto;color:var(--dim)}

@media(max-width:760px){
  body{overflow:auto}
  h1{font-size:2.4rem}.screen.home h1{font-size:2.6rem}
  .tiles{grid-template-columns:1fr}
  .pick{grid-template-columns:1fr}
  .menu{margin-left:0}
  .panelshot img{max-height:none}
  footer a{margin-left:0}
}