/* Around the Hill — Figma 439:12071. Hodnoty calc(N * var(--u)) = design px pri 1920. */
.ar-top, .ar-acts, .ar-cal { background: #fff; }

/* ---------------------------------------------------------------- hero (foto 439:12072 FILL 1920x1056, videt horni 746) */
.ar-top { position: relative; }
.ar-top .cs-phero__media img.ar-hero__img { object-position: 50% 21.5%; }
.ar-top .cs-phero__band { position: relative; box-shadow: 0 4px 16.7px rgba(0, 0, 0, .35); }
/* prepinace WINTER / SUMMER v modrem pasu (912:28796 / 912:28801: x=779 a 915, y=831) */
.ar-filter { position: absolute; z-index: 2; left: calc(779 * var(--u)); top: calc(831 * var(--u)); display: flex; gap: calc(21 * var(--u)); color: #fff; }
.ar-filter__sw { display: inline-flex; align-items: center; gap: calc(8.5 * var(--u)); min-height: max(44px, calc(61 * var(--u))); padding: 0 calc(8.5 * var(--u)); font-weight: 700; font-size: max(11px, calc(12.8 * var(--u))); line-height: 1.22; letter-spacing: 0; text-transform: uppercase; color: #fff; }
.ar-filter__track { position: relative; flex: none; width: max(34px, calc(43 * var(--u))); height: max(16px, calc(20 * var(--u))); border-radius: 999px; background: rgba(255, 255, 255, .25); transition: background-color .2s; }
.ar-filter__track::after { content: ""; position: absolute; top: 3px; left: 3px; width: calc(100% * 14 / 43); aspect-ratio: 1; border-radius: 50%; background: #d9d9d9; transition: transform .2s var(--ease); }
.ar-filter__sw[aria-pressed="true"] .ar-filter__track { background: #fff; }
.ar-filter__sw[aria-pressed="true"] .ar-filter__track::after { transform: translateX(calc(max(34px, calc(43 * var(--u))) - 100% - 6px)); }
.ar-filter__sw[aria-pressed="false"] { opacity: .7; }

/* ---------------------------------------------------------------- mrizka aktivit (439:12367: x=56, y=1158, 4 x 429x650, mezera 30) */
.ar-acts { max-width: var(--maxw); margin-inline: auto; padding: calc(47 * var(--u)) calc(57 * var(--u)) calc(70 * var(--u)) calc(56 * var(--u)); }
.ar-acts__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: calc(30 * var(--u)); border-radius: 10px; box-shadow: inset 0 4px 49.9px rgba(0, 0, 0, .25), inset 0 4px 62.2px rgba(0, 0, 0, .25); } /* 439:12367 INNER_SHADOW */
.ar-acts.is-collapsed .ar-card--more { display: none; }
.ar-card { position: relative; height: calc(650 * var(--u)); border-radius: 10px; overflow: hidden; background: #303030; color: #fff; isolation: isolate; scroll-margin-top: 120px; }
.ar-card[hidden] { display: none; }
.ar-card > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform .6s var(--ease); }
.ar-card::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(0, 23, 122, .92) 0%, rgba(0, 23, 122, .55) 55%, rgba(0, 23, 122, 0) 100%); opacity: 0; transition: opacity .35s var(--ease); }
.ar-card__body { position: absolute; left: 0; right: 0; bottom: 0; padding: 0 calc(32 * var(--u)) calc(27 * var(--u)); display: flex; flex-direction: column; align-items: center; text-align: center; gap: 12px; }
.ar-card__h { order: 3; font-weight: 700; font-size: max(13px, calc(16 * var(--u))); line-height: 1.22; letter-spacing: 0; text-transform: uppercase; text-shadow: 0 1px 6px rgba(0, 0, 0, .35); }
.ar-card__h a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.ar-card__p, .ar-card__season { max-height: 0; overflow: hidden; opacity: 0; transition: opacity .35s var(--ease), max-height .45s var(--ease); }
.ar-card__p { order: 1; font-weight: 500; font-size: max(13px, calc(15 * var(--u))); line-height: 1.45; letter-spacing: .2px; }
.ar-card__season { order: 2; font-weight: 700; font-size: max(10px, calc(12 * var(--u))); letter-spacing: 1px; text-transform: uppercase; color: var(--c-gold); }
@media (hover: hover) {
  .ar-card:hover > img { transform: scale(1.04); }
  .ar-card:hover::before, .ar-card:focus-within::before { opacity: 1; }
  .ar-card:hover .ar-card__p, .ar-card:focus-within .ar-card__p { max-height: 22em; opacity: 1; }
  .ar-card:hover .ar-card__season, .ar-card:focus-within .ar-card__season { max-height: 3em; opacity: 1; }
}
.ar-card:target::before { opacity: 1; }
.ar-card:target .ar-card__p { max-height: 22em; opacity: 1; }
.ar-card:target .ar-card__season { max-height: 3em; opacity: 1; }
.ar-acts__empty { margin-top: 24px; text-align: center; font-weight: 600; color: var(--c-navy); }

/* Show more (912:28623: text y=4598, ikona 48x48 r16 y=4639, A day y=4704) */
.ar-acts:has(.ar-more:not([hidden])) { padding-bottom: calc(17 * var(--u)); }
.ar-more { display: flex; flex-direction: column; align-items: center; gap: calc(21 * var(--u)); margin: calc(70 * var(--u)) auto 0; color: var(--c-navy); }
.ar-more__t { font-weight: 500; font-size: max(12px, calc(16 * var(--u))); line-height: 1.22; letter-spacing: 0; text-transform: uppercase; }
.ar-more__ico { display: grid; place-items: center; width: max(40px, calc(48 * var(--u))); height: max(40px, calc(48 * var(--u))); border-radius: 16px; background: var(--c-navy); color: #fff; font-weight: 700; font-size: max(24px, calc(30 * var(--u))); line-height: 1; transition: transform .25s var(--ease), background-color .2s; }
.ar-more[aria-expanded="true"] .ar-more__ico { transform: rotate(45deg); }
.ar-more:hover .ar-more__ico { background: var(--c-navy-3); }

/* ---------------------------------------------------------------- Activity calendar (439:13088: nadpis x=147 y=6490, tabulka x=233 y=6582, 1372 sirka) */
.ar-cal__in { position: relative; max-width: var(--maxw); margin-inline: auto; padding: calc(110 * var(--u)) 0 calc(143 * var(--u)); }
.ar-cal__head { padding-left: calc(147 * var(--u)); }
.ar-cal__h { font-weight: 700; font-size: max(28px, calc(45 * var(--u))); line-height: 1.147; letter-spacing: .3px; text-transform: uppercase; color: var(--c-navy-4); }
.ar-cal__legend { position: absolute; left: calc(1185 * var(--u)); top: calc(120 * var(--u)); width: calc(420 * var(--u)); min-width: 300px; display: flex; justify-content: space-between; flex-wrap: wrap; padding-top: calc(6 * var(--u) + 14px); font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 19px; letter-spacing: 0; color: #1f2f7a; }
.ar-cal__legend-bar { position: absolute; left: 0; right: 0; top: 0; height: 6px; border-radius: 3px; background: linear-gradient(90deg, #1f2f7a 0%, #3d4fa3 40%, #bfc6e6 70%, #f2f3f8 100%); }
.ar-cal__legend-mid { text-align: center; }
.ar-cal__legend-off { color: #6b6f8f; }
.ar-cal__scroll { margin: calc(40 * var(--u)) 0 0 calc(233 * var(--u)); width: calc(1372 * var(--u)); padding: 0 calc(30 * var(--u)) calc(30 * var(--u)) 0; background: #fff; }
.ar-cal__table { width: 100%; table-layout: fixed; border-collapse: collapse; }
.ar-cal__table thead td, .ar-cal__table tbody th { width: calc(200 * var(--u)); min-width: 120px; }
.ar-cal__table thead tr { border: 1px solid #eee; border-right: 0; border-left: 0; }
.ar-cal__table thead th { height: calc(62 * var(--u)); min-height: 40px; border-left: 1px solid #f0f0f0; text-align: center; font-weight: 400; font-size: max(10px, calc(11 * var(--u))); letter-spacing: .3px; color: #888; }
.ar-cal__table abbr { text-decoration: none; }
.ar-cal__table tbody tr { border-bottom: 1px solid #f9f9f9; }
.ar-cal__table tbody th { height: calc(35 * var(--u)); min-height: 28px; padding: 0 calc(15 * var(--u)) 0 0; text-align: right; font-weight: 600; font-size: max(9px, calc(10 * var(--u))); line-height: 1.3; letter-spacing: .3px; text-transform: uppercase; color: var(--c-navy); }
.ar-cal__table tbody td { padding: 0; vertical-align: middle; }
.ar-cal__track { position: relative; display: block; height: 6px; border-radius: 3px; background: #e8e8e8; }
.ar-cal__bar { position: absolute; top: 0; bottom: 0; border-radius: 3px; background: #1a3675; }
.ar-cal__bar--edge { background: linear-gradient(90deg, #e8e8e8 0%, var(--c-navy) 37%, var(--c-navy) 54%, #e8e8e8 100%); }

/* ---------------------------------------------------------------- tablet / mobil */
@media (max-width: 1023px) {
  .ar-filter { position: static; padding: 0 var(--gut) 8px; background: var(--c-navy); margin-top: -1px; gap: 16px; }
  .ar-acts { padding: 32px var(--gut) 56px; }
  .ar-acts__grid { grid-template-columns: repeat(3, 1fr); gap: 16px; }
  .ar-card { height: auto; aspect-ratio: 429 / 650; }
  .ar-card__body { padding: 0 16px 20px; }
  .ar-more { margin-top: 40px; gap: 12px; }
  .ar-acts:has(.ar-more:not([hidden])) { padding-bottom: 48px; }
  .ar-cal__in { padding: 56px 0 64px; }
  .ar-cal__head { padding-inline: var(--gut); }
  .ar-cal__legend { position: relative; left: auto; top: auto; margin-top: 20px; width: 100%; max-width: 420px; }
  .ar-cal__scroll { width: auto; margin: 24px 0 0; padding: 0 var(--gut) 16px; overflow-x: auto; }
  .ar-cal__table { min-width: 860px; }
  .ar-cal__table thead td, .ar-cal__table tbody th { width: 150px; }
  .ar-cal__table tbody th { height: 36px; font-size: 10px; }
}
@media (max-width: 767px) {
  .ar-acts { padding-inline: 16px; }
  .ar-acts__grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .ar-card__body { padding: 0 10px 14px; }
  .ar-cal__head, .ar-cal__scroll { padding-inline: 16px; }
}
/* Figma "menu" 439:12072: foto + prechod #00177a -> pruhledna pres 1056 px */
.ar-top .cs-phero__media::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: calc(1056 * var(--u)); background: linear-gradient(180deg, rgba(0, 23, 122, .55) 0%, rgba(14, 41, 110, 0) 100%); pointer-events: none; }