/* 01.fitness – SEKCE stroj (detail /vybaveni/{slug}/, návrh detail-1 až detail-6). */
#stroj{--sekce-py:56px;padding-bottom:88px}
#stroj .stroj-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,580px);gap:64px;align-items:center}
#stroj .stroj-uvod{display:flex;flex-direction:column;gap:22px;align-items:flex-start}
#stroj .sek-h{font-size:80px}
#stroj .stroj-procvicis-titul{font-size:13px;font-weight:800;color:var(--text-seda);margin-top:4px}
#stroj .stroj-tagy{margin:-12px 0 0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:8px}
#stroj .stroj-tagy li{padding:8px 14px;border:1.5px solid #cfc9bf;font-weight:800;font-size:14px}
#stroj .stroj-akce{display:flex;align-items:center;gap:28px;flex-wrap:wrap;margin-top:12px}
#stroj .stroj-foto{position:relative;display:flex;align-items:center;justify-content:center;aspect-ratio:580/650;background:var(--beton);padding:40px;overflow:hidden}
#stroj .stroj-foto img{position:relative;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
#stroj .stroj-foto.je-placeholder img{opacity:.5}
#stroj .stroj-ghost{position:absolute;left:30px;top:50px;font-size:280px;-webkit-text-stroke:2px #d8c9ae}

.stroj-kostce{background:var(--antracit);padding:34px var(--gut)}
.stroj-kostce dl{margin:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.stroj-kostce dl>div{padding:0 24px;border-left:1px solid #4a4543}
.stroj-kostce dl>div:first-child{padding-left:0;border-left:0}
.stroj-kostce dt{font-family:var(--heading);font-weight:800;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--zlata-na-tmave)}
.stroj-kostce dd{margin:8px 0 0;font-size:16px;line-height:1.45;color:#fff;font-weight:600}

/* Co zabírá – svaly stroje na postavě (barvy postavy ve web/css/postava.css) */
.stroj-svaly{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,420px);gap:64px;align-items:center;--mm-v:#e3cfa6}
@supports (color:color-mix(in srgb,red,blue)){.stroj-svaly{--mm-v:color-mix(in srgb,var(--zlata) 42%,#f4f1ea)}}
.stroj-svaly-text{display:flex;flex-direction:column;gap:22px;align-items:flex-start}
.stroj-svaly h2{font-size:56px}
.stroj-svaly-skupina{display:flex;flex-direction:column;gap:10px}
.stroj-svaly-titul{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:800;color:var(--text-seda)}
.stroj-svaly .lg{display:inline-block;width:12px;height:12px;border-radius:3px;background:var(--zlata)}
.stroj-svaly .lg-v{background:var(--mm-v)}
.stroj-svaly-tagy{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.stroj-svaly-tagy li{padding:8px 14px;background:#fff;font-weight:700;font-size:14px}
.stroj-svaly-tagy.je-hlavni li{background:var(--zlata);color:var(--text);font-weight:800}
.stroj-svaly-figura{margin:0;display:flex;flex-direction:column;gap:14px}
.stroj-svaly-figura figcaption{display:flex;flex-direction:column;gap:12px;align-items:center}
.stroj-svaly-popisky{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:4%;width:100%;text-align:center;font-family:var(--heading);font-weight:800;font-size:14px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-seda)}
.stroj-svaly-pohlavi{display:inline-flex;border:1.5px solid #cfc9bf;background:#fff}
.stroj-svaly-pohlavi button{min-height:36px;padding:0 14px;border:0;background:none;color:var(--text-seda);font-weight:800;font-size:13px;cursor:pointer}
.stroj-svaly-pohlavi button[aria-pressed=true]{background:var(--antracit);color:#fff}

.stroj-navod-hlava{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,420px);gap:64px;align-items:end}
.stroj-navod-hlava>div{display:flex;flex-direction:column;gap:22px}
.stroj-navod-hlava h2{font-size:64px}
.stroj-cviky{margin:56px 0 0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.stroj-cviky>li{display:flex;flex-direction:column;gap:12px}
.stroj-video{display:block;width:100%;aspect-ratio:16/11;background:#ece9e2;object-fit:cover}
.stroj-video.je-placeholder{position:relative;display:flex;align-items:center;justify-content:center;background-color:#ece9e2;background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.55) 0 14px,transparent 14px 28px)}
.stroj-play{width:64px;height:64px;border-radius:50%;background:var(--antracit);position:relative}
.stroj-play::after{content:'';position:absolute;left:26px;top:21px;border-left:16px solid #fff;border-top:11px solid transparent;border-bottom:11px solid transparent}
.stroj-video-pozn{position:absolute;left:14px;bottom:12px;font-size:12px;color:var(--text-seda)}
.stroj-cviky h3{font-size:30px;margin:6px 0 0}
.stroj-cviky h3 span{font-size:20px;color:var(--zlata-text);margin-right:4px}
.stroj-cvik-procvicis{font-size:14px;font-weight:800;color:var(--text-seda)}
.stroj-kroky{margin:4px 0 0;padding:0;list-style:none;counter-reset:krok;display:flex;flex-direction:column;gap:8px}
.stroj-kroky li{counter-increment:krok;display:grid;grid-template-columns:24px minmax(0,1fr);font-size:15px;line-height:1.55;color:var(--text-seda)}
.stroj-kroky li::before{content:counter(krok) '.';font-weight:800;color:var(--zlata-text)}
.stroj-pozor{background:var(--beton);padding:12px 14px;font-size:14px;line-height:1.5;margin-top:4px}

.stroj-bezpecnost{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:64px;align-items:start}
.stroj-bezpecnost h2{font-size:48px}
.stroj-bezpecnost ol{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.stroj-bezpecnost li{border-top:2px solid var(--antracit);padding-top:18px;display:flex;flex-direction:column;gap:10px}
.stroj-bezpecnost li .w-d{font-size:40px;color:var(--zlata-text)}
.stroj-bezpecnost li p{font-size:15px;line-height:1.55;font-weight:600}

.stroj-dalsi{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:48px;align-items:stretch}
.stroj-qr{background:var(--antracit);color:#fff;padding:32px 30px;display:flex;flex-direction:column;gap:16px}
.stroj-qr svg{width:40px;height:40px;color:var(--zlata-na-tmave)}
.stroj-qr h2{font-size:36px;color:#fff}
.stroj-qr p{font-size:14px;line-height:1.6;color:var(--na-tmave)}
.stroj-souv{display:flex;flex-direction:column;gap:22px;grid-column:2}
.stroj-dalsi>.stroj-souv:only-child{grid-column:1 / -1}
.stroj-souv h2{font-size:36px}
.stroj-souv ul{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.stroj-souv li>a,.stroj-souv li>div{display:flex;flex-direction:column;gap:6px;color:var(--text)}
.stroj-souv-foto{display:flex;align-items:center;justify-content:center;aspect-ratio:1/1;background:var(--beton);padding:16px;margin-bottom:8px}
.stroj-souv-foto img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
.stroj-souv strong{font-weight:800;font-size:16px}
.stroj-souv span:not(.stroj-souv-foto){font-size:14px;color:var(--text-seda)}
.stroj-souv a:hover strong{color:var(--zlata-text)}

.stroj-cta{display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap;--sekce-py:88px}
.stroj-cta h2{font-size:80px;color:var(--text)}

@media(max-width:1250px){
  #stroj .stroj-hero{grid-template-columns:1fr 1fr;gap:40px}
  #stroj .sek-h{font-size:56px}
  #stroj .stroj-ghost{font-size:200px}
  .stroj-navod-hlava{grid-template-columns:1fr;gap:20px}
  .stroj-svaly{grid-template-columns:minmax(0,1fr) minmax(0,340px);gap:40px}
  .stroj-svaly h2{font-size:44px}
  .stroj-navod-hlava h2{font-size:52px}
  .stroj-cviky{grid-template-columns:1fr 1fr}
  .stroj-bezpecnost{grid-template-columns:1fr;gap:32px}
  .stroj-dalsi{grid-template-columns:1fr}
  .stroj-souv{grid-column:1}
  .stroj-cta h2{font-size:60px}
}
@media(max-width:760px){
  #stroj{--sekce-py:32px;padding-bottom:56px}
  #stroj .stroj-hero{grid-template-columns:1fr}
  #stroj .stroj-foto{order:-1;padding:24px}
  #stroj .sek-h{font-size:44px}
  #stroj .stroj-ghost{font-size:150px;left:14px;top:20px}
  .stroj-kostce dl{grid-template-columns:1fr 1fr;row-gap:20px}
  .stroj-kostce dl>div{padding:0 12px}
  .stroj-kostce dl>div:nth-child(odd){padding-left:0;border-left:0}
  .stroj-navod-hlava h2{font-size:40px}
  .stroj-svaly{grid-template-columns:1fr;gap:28px}
  .stroj-svaly h2{font-size:36px}
  .stroj-svaly-figura{max-width:340px;width:100%;margin:0 auto}
  .stroj-cviky{grid-template-columns:1fr;gap:40px;margin-top:32px}
  .stroj-bezpecnost ol{grid-template-columns:1fr}
  .stroj-bezpecnost h2{font-size:36px}
  .stroj-souv ul{grid-template-columns:1fr 1fr}
  .stroj-cta h2{font-size:44px}
}