/* ==========================================================================
   Royal Enfield Garage — stránka /testovaci-jizda/ (titulka/re/re_page_testovaci_jizda.php).
   Jízdy podle motorek (#jizdy) a testovací trasy (#trasy).
   Staví na proměnných a třídách z re.css (--ink, --night, --paper, --red, --muted,
   --line, --gutter, --fzd, .re-eyebrow, .re-btn). Vše s prefixem .tj-, načítá jen tato stránka.
   Mobil je základ, širší obrazovky přidávají sloupce.
   ========================================================================== */

/* ---------- Úvod ---------- */
.tj-fakta{list-style:none;margin:26px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 26px;font-size:calc(14px + 14*var(--fzd));color:var(--muted)}
.tj-fakta li{display:flex;align-items:baseline;gap:7px}
.tj-fakta b{color:var(--ink);font-weight:800}
.tj-intro .tj-intro-akce{margin-top:26px}
.tj-intro-pujcovna{margin-top:14px}

/* ---------- Společné ---------- */
.tj-label{display:block;font-size:calc(11px + 11*var(--fzd));font-weight:800;letter-spacing:.14em;line-height:1.4;text-transform:uppercase;color:var(--red);margin-bottom:5px}
.tj-kicker{font-size:calc(11px + 11*var(--fzd));font-weight:800;letter-spacing:.14em;line-height:1.4;text-transform:uppercase;color:var(--muted)}
.tj-meta{display:grid;grid-template-columns:1fr 1fr;gap:1px;margin:0;background:var(--line);border:1px solid var(--line);border-radius:3px;overflow:hidden}
.tj-meta div{background:white;padding:10px 12px;min-width:0}
.tj-meta dt{font-size:calc(10px + 10*var(--fzd));font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.tj-meta dd{margin:2px 0 0;font-size:calc(15px + 15*var(--fzd));font-weight:800;line-height:1.35}
.tj-detail{border-top:1px solid var(--line)}
.tj-detail summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:50px;font-size:calc(14px + 14*var(--fzd));font-weight:800}
.tj-detail summary::-webkit-details-marker{display:none}
.tj-detail summary svg{width:20px;height:20px;stroke-width:2;transition:transform .2s var(--ease)}
.tj-detail[open] summary svg{transform:rotate(180deg)}
.tj-detail summary:focus-visible{outline:2px solid var(--red);outline-offset:3px}
.tj-detail-in{display:grid;gap:18px;padding:2px 0 10px}
.tj-cols{display:grid;gap:16px}
.tj-cols ul{margin:0;padding-left:18px;font-size:calc(14px + 14*var(--fzd));line-height:1.55}
.tj-cols li+li{margin-top:4px}
.tj-mapa{display:flex;flex-wrap:wrap;align-items:center;gap:16px}
.tj-qr{flex:0 0 auto;display:block;padding:6px;background:white;border:1px solid var(--line);border-radius:3px;line-height:0}
.tj-qr img{width:112px;height:112px}
.tj-mapa-akce{flex:1 1 190px;min-width:0;display:flex;flex-direction:column;align-items:stretch;gap:8px}
.tj-mapa-akce .re-btn{width:100%;gap:12px;padding-inline:14px}
.tj-mapa-akce .re-text-link{align-self:flex-start;gap:12px}
.tj-poznamka{max-width:980px}

/* ---------- Jízdy podle motorek ---------- */
.tj-rychle{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 30px}
.tj-rychle a{display:inline-flex;align-items:center;min-height:44px;padding:8px 16px;border:1px solid var(--line);border-radius:999px;background:white;font-size:calc(13px + 13*var(--fzd));font-weight:700;line-height:1.25;transition:border-color .18s,background .18s}
.tj-rychle a:hover{border-color:var(--ink);background:var(--paper)}
.tj-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;align-items:start}
.tj-card{display:flex;flex-direction:column;min-width:0;background:white;border:1px solid var(--line);border-radius:4px;overflow:hidden;scroll-margin-top:90px}
.tj-card:target{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink)}
.tj-card-foto{position:relative;aspect-ratio:14/9;display:flex;align-items:center;justify-content:center;padding:16px;background:var(--paper)}
.tj-card-foto img{width:100%;height:100%;object-fit:contain}
.tj-card-cas{position:absolute;left:12px;top:12px;padding:5px 9px;border-radius:3px;background:var(--night);color:white;font-size:calc(12px + 12*var(--fzd));font-weight:800;line-height:1.3}
.tj-card-body{display:flex;flex-direction:column;gap:14px;padding:20px 18px 8px}
.tj-card h3{margin-top:-6px}
.tj-pro{font-size:calc(15px + 15*var(--fzd));line-height:1.55}
.tj-trasa-info strong{display:block;font-size:calc(16px + 16*var(--fzd));line-height:1.35}
.tj-trasa-info p,.tj-smer p{margin-top:4px;font-size:calc(14px + 14*var(--fzd));line-height:1.55;color:var(--muted);overflow-wrap:anywhere}
.tj-rezervovat{width:100%;justify-content:space-between;gap:16px}
.tj-popis{font-size:calc(15px + 15*var(--fzd));line-height:1.6}
.tj-specs{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px;margin:0}
.tj-specs div{border-left:2px solid var(--red);padding-left:10px;min-width:0}
.tj-specs dt{font-size:calc(10px + 10*var(--fzd));font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.tj-specs dd{margin:1px 0 0;font-weight:800;font-size:calc(15px + 15*var(--fzd))}
.tj-profil{display:grid;gap:6px}
.tj-skore{display:grid;grid-template-columns:minmax(92px,auto) 1fr 22px;align-items:center;gap:10px;font-size:calc(13px + 13*var(--fzd))}
.tj-skore b{text-align:right}
.tj-bar{display:block;height:6px;border-radius:3px;background:var(--line);overflow:hidden}
.tj-bar i{display:block;width:0;height:100%;background:var(--red)}
.tj-s1 i{width:10%}.tj-s2 i{width:20%}.tj-s3 i{width:30%}.tj-s4 i{width:40%}.tj-s5 i{width:50%}
.tj-s6 i{width:60%}.tj-s7 i{width:70%}.tj-s8 i{width:80%}.tj-s9 i{width:90%}.tj-s10 i{width:100%}
.tj-jizdy .tj-poznamka{margin-top:26px}

/* ---------- Testovací trasy (tmavá sekce) ---------- */
.tj-start{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px 40px;margin-bottom:20px;padding:22px 20px;border:1px solid #ffffff26;border-radius:4px;background:#ffffff08}
.tj-start .re-btn{width:100%;justify-content:space-between;gap:16px}
.tj-trasy .tj-label{color:#e9e3d8}
.tj-start-adresa{font-size:calc(16px + 16*var(--fzd));line-height:1.5;color:#d8d3ca}
.tj-start-adresa strong{color:white}
.tj-trasy-pozn{max-width:980px;font-size:calc(14px + 14*var(--fzd));line-height:1.6;color:#b9b6af}
.tj-trasy-pozn strong{color:white}
.tj-kat-blok{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;margin-top:40px}
.tj-kat{font-size:calc(24px + 24*var(--fzh));letter-spacing:-.03em}
.tj-trasa{display:flex;flex-direction:column;gap:16px;min-width:0;padding:20px 18px 8px;border:1px solid #ffffff21;border-radius:4px;background:#ffffff0a;scroll-margin-top:90px}
.tj-trasa:target{border-color:#ffffff80}
.tj-trasa-head{display:flex;align-items:flex-start;gap:14px}
.tj-cislo{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:50px;height:50px;border-radius:3px;background:var(--red);color:white;font-size:24px;font-weight:800;line-height:1}
.tj-trasa .tj-kicker{color:#a5a099}
.tj-trasa h4{margin-top:2px;font-size:calc(20px + 20*var(--fzh));line-height:1.2;letter-spacing:-.025em}
.tj-sub{margin-top:5px;font-size:calc(14px + 14*var(--fzd));line-height:1.5;color:#b9b6af}
.tj-trasy .tj-meta{background:#ffffff26;border-color:#ffffff26}
.tj-trasy .tj-meta div{background:var(--night)}
.tj-trasy .tj-meta dt{color:#a5a099}
.tj-trasy .tj-smer p{color:#d8d3ca}
.tj-trasy .tj-detail{border-color:#ffffff26}
.tj-trasy .tj-cols ul{color:#d8d3ca}
.tj-trasy .tj-qr{border-color:transparent}
.tj-mapa-akce small{font-size:calc(12px + 12*var(--fzd));line-height:1.45;color:#a5a099}
.tj-trasy .tj-poznamka{margin-top:30px}

/* ---------- Mobil ---------- */
@media(max-width:767px){
  .tj-intro-akce .re-btn{flex:1 1 100%;justify-content:space-between}
  .tj-fakta{flex-direction:column;gap:6px}
  .tj-rychle{gap:6px;margin-bottom:24px}
  .tj-rychle a{padding:8px 13px}
  .tj-qr img{width:88px;height:88px}
  .tj-mapa{gap:12px}
  .tj-mapa-akce{flex-basis:170px}
}

/* ---------- Tablet a výš ---------- */
@media(min-width:700px){
  .tj-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
  .tj-cols{grid-template-columns:1fr 1fr}
  .tj-jizdy .tj-cols{grid-template-columns:minmax(0,1fr)}
}
@media(min-width:768px){
  .tj-start{padding:26px 30px}
  .tj-start .re-btn{width:auto}
}
@media(min-width:900px){
  .tj-kat-blok{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
  .tj-kat{grid-column:1/-1}
  .tj-trasa{padding:26px 26px 10px}
}
@media(min-width:1200px){
  .tj-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .tj-card-body{padding:22px 22px 10px}
}
@media(min-width:1700px){
  .tj-kat-blok{grid-template-columns:minmax(220px,.62fr) repeat(2,minmax(0,1fr));gap:24px}
  .tj-kat{grid-column:auto;padding-top:22px;border-top:2px solid var(--red)}
  .tj-qr img{width:128px;height:128px}
}
@media(min-width:2200px){
  .tj-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
}
