/* ledovastena.cz — téma podle loga Ledová stěna Vír (ledová modrá #3ea8db); stránka Via ferrata má červenou z loga Via ferrata Vír (#c5442c). */
:root {
  --ink: #06121c; --ink2: #0b1f30; --ink3: #13324d; --paper: #eff4f7; --paper2: #dfe8ee; --card: #fff;
  --text: #182630; --mute: #536574; --line: #cfdbe3; --dtext: #e4eef5; --dmute: #9fb6c7;
  --acc: #3ea8db; --acc2: #1677ad; --on-acc: #03121c;
  --frost: linear-gradient(160deg, rgba(6, 22, 36, .7), rgba(6, 22, 36, .48) 60%, rgba(20, 80, 120, .42));
}
/* via ferrata: červená z loga */
body.t-ferrata { --acc: #e0583d; --acc2: #b23a22; --on-acc: #fff; --ink3: #3a1a14; }
body.t-ferrata .stripe { background: repeating-linear-gradient(55deg, #c5442c 0 16px, var(--ink) 16px 32px); }
.door.is-ferrata { --dacc: #ff7a5c; } .door.is-ferrata .btn-acc { background: #c5442c; color: #fff; }
.brand img { height: 52px; } @media (max-width: 520px) { .brand img { height: 42px; } }
/* led: jemné „jinovatkové“ zrno v tmavých sekcích */
.sec-dark { background: radial-gradient(1200px 500px at 85% 0%, rgba(62, 168, 219, .12), transparent 60%), var(--ink); }
.hero h1 strong, .hero h1 em { color: #8fd4f5; }
/* trasy ferrat */
.route { display: grid; grid-template-columns: 300px 1fr; gap: 0; background: var(--card); clip-path: var(--clip); box-shadow: 0 14px 40px rgba(6, 18, 28, .07); }
.route + .route { margin-top: 20px; }
.route-i { position: relative; margin: 0; background: var(--ink2); } .route-i img { display: block; width: 100%; height: 100%; min-height: 260px; object-fit: cover; }
.route-b { padding: clamp(24px, 3vw, 40px); }
.route-tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 16px; padding: 0; list-style: none; }
.route-tags li { padding: 7px 12px; font: 600 .72rem/1 var(--disp); letter-spacing: .14em; text-transform: uppercase; background: var(--paper2); clip-path: var(--clip-s); }
.route-tags li.is-grade { color: #fff; background: var(--acc2); }
@media (max-width: 760px) { .route { grid-template-columns: 1fr; } .route-i img { min-height: 220px; max-height: 300px; } }
/* časová osa spolku */
.tl { position: relative; margin: 0; padding: 0 0 0 28px; list-style: none; border-left: 2px solid var(--acc); }
.tl li { position: relative; margin: 0 0 26px; } .tl li::before { content: ""; position: absolute; left: -36px; top: 4px; width: 14px; height: 14px; background: var(--acc); clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); }
.tl b { display: block; margin-bottom: 4px; font: 500 1.6rem/1 var(--disp); color: var(--acc); } .tl p { margin: 0; }
.sec-dark .tl p { color: var(--dtext); }
/* topo průvodce */
.topo { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); gap: 12px; }
.topo a { display: block; background: #fff; padding: 8px; clip-path: var(--clip-s); } .topo img { display: block; width: 100%; aspect-ratio: 3 / 4; object-fit: cover; }
.topo span { display: block; padding: 8px 2px 2px; font: 600 .72rem/1.2 var(--disp); letter-spacing: .14em; text-transform: uppercase; color: var(--ink); }
.partners { gap: 18px; } .partners a { display: grid; place-items: center; width: 200px; height: 110px; padding: 16px; background: #fff; clip-path: var(--clip-s); box-shadow: 0 8px 30px rgba(6, 18, 28, .07); }
.partners img { height: auto; max-height: 76px; max-width: 160px; filter: none; opacity: 1; }
/* půjčovna: rychlá volba Ledová stěna / Via ferrata v hlavičce stránky */
.pick { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 34px; max-width: 760px; }
.pick a { position: relative; isolation: isolate; display: flex; flex-direction: column; justify-content: flex-end; min-height: 170px; padding: 20px 22px; color: #fff; text-decoration: none; overflow: hidden; clip-path: var(--clip); }
.pick img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease); }
.pick a::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(4, 10, 16, .1), rgba(4, 10, 16, .85)); }
.pick a:hover img { transform: scale(1.06); }
.pick small { font: 500 .68rem/1 var(--disp); letter-spacing: .24em; text-transform: uppercase; color: var(--acc); } .pick b { font: 600 1.3rem/1.15 var(--disp); letter-spacing: .06em; text-transform: uppercase; }
.pick a.is-ferrata small { color: #ff7a5c; }
@media (max-width: 560px) { .pick { grid-template-columns: 1fr; } .pick a { min-height: 130px; } }
/* propojení termín ↔ vybavení */
.link-diag { display: grid; grid-template-columns: 1fr auto 1fr; gap: 18px; align-items: center; margin-top: 44px; }
.link-diag > div { padding: 22px 24px; background: var(--card); clip-path: var(--clip); box-shadow: 0 10px 40px rgba(6, 18, 28, .06); }
.link-diag h3 { margin: 0 0 6px; } .link-diag p { margin: 0; color: var(--mute); font-size: .96rem; }
.link-diag .mid { display: grid; place-items: center; width: 64px; height: 64px; padding: 0; color: var(--on-acc); background: var(--acc); clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); }
@media (max-width: 760px) { .link-diag { grid-template-columns: 1fr; } .link-diag .mid { margin: 0 auto; transform: rotate(90deg); } }
.price-tag { display: inline-flex; align-items: baseline; gap: 10px; margin: 6px 0 22px; padding: 14px 22px; color: var(--on-acc); background: var(--acc); clip-path: var(--clip-s); }
.price-tag b { font: 600 2.2rem/1 var(--disp); } .price-tag span { font: 500 .78rem/1.2 var(--disp); letter-spacing: .16em; text-transform: uppercase; }
/* sektory Ledové stěny (kresba z návštěvního řádu 2026) */
.sektory-map { margin: 0; padding: clamp(14px, 2.4vw, 30px); background: #fff; clip-path: var(--clip); } .sektory-map img { display: block; width: 100%; height: auto; }
.acc .prose ol { margin: 0 0 1em; padding-left: 1.4em; } .acc .prose ol li { margin: 0 0 .5em; padding-left: .2em; }
/* Desatero vírských ferrat */
.desatero { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
.desatero li { position: relative; padding: 24px 26px 22px 86px; background: rgba(255, 255, 255, .05); box-shadow: inset 0 0 0 1px var(--dline); clip-path: var(--clip); }
.desatero li span { position: absolute; left: 24px; top: 20px; font: 300 2.4rem/1 var(--disp); color: var(--acc); }
.desatero h3 { margin: 0 0 .45em; color: #fff; font-size: 1.05rem; } .desatero p { margin: 0; color: var(--dmute); font-size: .97rem; }
.desatero-end { margin: 26px 0 0; font: 400 1.3rem/1.4 var(--serif); font-style: italic; color: var(--dtext); }
@media (max-width: 860px) { .desatero { grid-template-columns: 1fr; } .desatero li { padding-left: 74px; } }