/*! iStage · Pronájem techniky – stránka pronájmu s kalkulačkou a „Koupit | Půjčit“ na detailu produktu · v1.0.0
 *  Stránka pronájmu (kategorie /pronajem-chytrych-bryli--dronu--kamer-a-paddleboardu/): řádek skriptu v Záhlaví jí dá
 *  třídu html.rn-page (a vypne na ní modul Kategorie) – rozvržení platí hned od načtení, takže nic neposkočí.
 *  Detail produktu: panel .rn-box pod nákupním boxem (vkládá ho pronajem.js). ?rn=0 ukáže původní stránku.
 */

/* ---------- Písmo Poppins – stejné soubory jako bannery (složka homepage/fonts, licence OFL) ---------- */
@font-face{font-family:'HP Poppins';font-style:normal;font-weight:600;font-display:swap;src:url(/user/documents/homepage/fonts/poppins-600-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'HP Poppins';font-style:normal;font-weight:600;font-display:swap;src:url(/user/documents/homepage/fonts/poppins-600-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root { --rn-api: 1; }                               /* skript pronajem.js se připojí, jen když jsou načtené tyto styly */

/* ---------- 0) Barvy a písmo ---------- */
.rn-root, .rn-box {
  --rn-font: 'HP Poppins', 'Poppins', 'Nunito Sans', Arial, sans-serif;
  --rn-text: 'Nunito Sans', Arial, sans-serif;
  --rn-ink: #0b0d10; --rn-2: #55595f; --rn-3: #666b73; --rn-line: #e2e2df; --rn-line-2: #cdcdc9;
  --rn-soft: #f7f7f5; --rn-sunk: #f0f0ee; --rn-ok: #15803d; --rn-warn: #8f6000; --rn-bad: #b42318; --rn-focus: #0063c7;
  --rn-vi: #5b4ce6; --rn-vi-2: #4838d2; --rn-vi-bg: #f3f1ff; --rn-vi-line: #dcd6ff; --rn-vi-ink: #2a1f8f;
  font: 400 15px/1.6 var(--rn-text); color: var(--rn-2); text-align: left;
}
.rn-root *, .rn-box * { box-sizing: border-box; }
/* základ s nízkou vahou, aby ho třídy níže vždy přebily (šablona podtrhává odkazy a má vlastní okraje nadpisů) */
#content :where(.rn-root, .rn-box) :where(h1, h2, h3, p, ul, ol, li, dl, dt, dd, figure) { margin: 0; padding: 0; }
#content :where(.rn-root, .rn-box) :where(ul, ol) { list-style: none; }
#content :where(.rn-root, .rn-box) li::before { content: none; }
#content :is(.rn-root, .rn-box) a { text-decoration: none !important; }
#content :where(.rn-root, .rn-box) button { font-family: inherit; }
#content :where(.rn-root, .rn-box) img { max-width: 100%; height: auto; }
.rn-ico { display: inline-block; flex: none; width: 20px; height: 20px; vertical-align: middle; }
:is(.rn-root, .rn-box) :is(a, button, summary, select):focus-visible { outline: 3px solid var(--rn-focus); outline-offset: 2px; }

/* ---------- 1) Stránka pronájmu: bez levého sloupce kategorií, obsah na celou šířku; původní výpis skrytý ---------- */
html.rn-page:not(.rn-off) .content-wrapper-in > aside.sidebar { display: none !important; }
html.rn-page:not(.rn-off) .content-wrapper-in > main#content {
  flex: 1 1 100%; width: 100% !important; max-width: 100% !important; float: none; margin-left: 0; margin-right: 0;
  min-height: 100vh;                                 /* patička je při načtení pod okrajem okna (nic neposkočí) */
}
/* původní obsah kategorie se neukáže – kdyby se skript do 4 s nenačetl, zobrazí se (pojistka) */
html.rn-page:not(.rn-off) .content-wrapper-in > main#content > :not(.rn-root) {
  max-height: 0; overflow: hidden; visibility: hidden; margin: 0 !important; padding: 0 !important;
  animation: rn-orig 0s linear 4s forwards;
}
@keyframes rn-orig { to { max-height: none; overflow: visible; visibility: visible; } }
html.rn-page.rn-on:not(.rn-off) .content-wrapper-in > main#content > :not(.rn-root) { display: none !important; animation: none; }
/* záložka Heureky „Ověřeno zákazníky“ visí přes levých 36 px okna – obsah se odsadí jen tam, kde kontejner začíná blíž k okraji */
@media (min-width: 768px) {
  html.rn-page:not(.rn-off) { --rn-cw: 742px; }
  html.rn-page:not(.rn-off) .content-wrapper-in > main#content { padding-left: max(0px, calc(52px - (100vw - var(--rn-cw)) / 2)) !important; }
}
@media (min-width: 992px) { html.rn-page:not(.rn-off) { --rn-cw: 972px; } }
@media (min-width: 1200px) { html.rn-page:not(.rn-off) { --rn-cw: 1178px; } }
@media (min-width: 1440px) { html.rn-page:not(.rn-off) { --rn-cw: 1394px; } }
.rn-root { padding: 8px 0 24px; }
.rn-root > * + * { margin-top: 56px; }
.rn-sec, .rn-q, .rn-cta { scroll-margin-top: 24px; }

/* ---------- 2) Nadpisy, texty, tlačítka ---------- */
#content .rn-root .rn-h1 {
  margin: 14px 0 0; max-width: 16em; font-family: var(--rn-font) !important; font-size: clamp(30px, .9rem + 2vw, 50px) !important; font-weight: 600 !important;
  line-height: 1.06 !important; letter-spacing: -.03em; text-align: left; text-transform: none; color: var(--rn-ink) !important; text-wrap: balance;
}
#content :is(.rn-root, .rn-box) .rn-h2 {
  font-family: var(--rn-font) !important; font-size: clamp(24px, .8rem + 1vw, 30px) !important; font-weight: 600 !important; line-height: 1.15 !important;
  letter-spacing: -.02em; text-align: left; text-transform: none; color: var(--rn-ink) !important;
}
#content :is(.rn-root, .rn-box) .rn-h3 {
  font-family: var(--rn-text) !important; font-size: 16.5px !important; font-weight: 800 !important; line-height: 1.3 !important;
  letter-spacing: 0; text-align: left; text-transform: none; color: var(--rn-ink) !important;
}
#content .rn-eyebrow {
  display: inline-flex; align-items: center; gap: 8px; max-width: 100%; height: 28px; padding: 0 12px; border: 1px solid rgba(11, 13, 16, .08); border-radius: 999px;
  background: rgba(255, 255, 255, .88); font: 700 11px/1 var(--rn-text); letter-spacing: .1em; text-transform: uppercase; color: var(--rn-2);
}
#content .rn-eyebrow--vi { border-color: var(--rn-vi-line); background: #fff; color: var(--rn-vi-ink); }
.rn-eyebrow--vi .rn-ico { width: 16px; height: 16px; color: var(--rn-vi); }
.rn-sec-head { margin: 0 0 20px; }
#content .rn-sec-head .rn-eyebrow { margin-bottom: 10px; }
#content .rn-sub { margin: 8px 0 0; max-width: 70ch; line-height: 1.6; color: var(--rn-2); }

#content :is(.rn-root, .rn-box) .rn-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 46px; margin: 0; padding: 0 20px;
  border: 1px solid var(--rn-ink); border-radius: 14px; background: var(--rn-ink); color: #fff; font: 700 14.5px/1.2 var(--rn-text);
  text-align: center; text-decoration: none; white-space: nowrap; cursor: pointer; transition: background-color .15s, border-color .15s, color .15s, box-shadow .15s, transform .15s;
}
#content :is(.rn-root, .rn-box) .rn-btn:hover { background: #2b2e33; border-color: #2b2e33; color: #fff; }
#content :is(.rn-root, .rn-box) .rn-btn .rn-ico { width: 18px; height: 18px; }
#content :is(.rn-root, .rn-box) .rn-btn--vi { border-color: var(--rn-vi); background: var(--rn-vi); color: #fff; box-shadow: 0 12px 26px -14px rgba(91, 76, 230, .9); }
#content :is(.rn-root, .rn-box) .rn-btn--vi:hover { border-color: var(--rn-vi-2); background: var(--rn-vi-2); color: #fff; transform: translateY(-1px); }
#content :is(.rn-root, .rn-box) .rn-btn--line { border-color: var(--rn-line-2); background: #fff; color: var(--rn-ink); }
#content :is(.rn-root, .rn-box) .rn-btn--line:hover { border-color: var(--rn-ink); background: #fff; color: var(--rn-ink); }
#content .rn-root .rn-btn--light { border-color: #fff; background: #fff; color: var(--rn-ink); }
#content .rn-root .rn-btn--light:hover { border-color: #efeefe; background: #efeefe; color: var(--rn-ink); }
#content .rn-root .rn-btn--ghost { border-color: rgba(255, 255, 255, .35); background: transparent; color: #fff; }
#content .rn-root .rn-btn--ghost:hover { border-color: #fff; background: rgba(255, 255, 255, .08); color: #fff; }
#content :is(.rn-root, .rn-box) .rn-btn--sm { min-height: 40px; padding: 0 14px; border-radius: 12px; font-size: 13.5px; }
#content :is(.rn-root, .rn-box) .rn-btn--lg { min-height: 54px; padding: 0 24px; border-radius: 16px; font-size: 15.5px; }
#content :is(.rn-root, .rn-box) .rn-btn--full { width: 100%; }
#content :is(.rn-root, .rn-box) .rn-btn[disabled] { opacity: .55; cursor: default; transform: none; box-shadow: none; }
#content :is(.rn-root, .rn-box) .rn-btn.is-busy { position: relative; color: transparent !important; }
#content :is(.rn-root, .rn-box) .rn-btn.is-busy::after {
  content: ''; position: absolute; top: 50%; left: 50%; width: 20px; height: 20px; margin: -10px 0 0 -10px; border: 2.5px solid rgba(255, 255, 255, .45);
  border-top-color: #fff; border-radius: 50%; animation: rn-spin .7s linear infinite;
}
@keyframes rn-spin { to { transform: rotate(360deg); } }
#content :is(.rn-root, .rn-box) .rn-more { display: inline-flex; align-items: center; gap: 6px; font: 800 14px/1.2 var(--rn-text); color: var(--rn-ink); }
#content :is(.rn-root, .rn-box) .rn-more .rn-ico { width: 16px; height: 16px; transition: transform .15s; }
#content :is(.rn-root, .rn-box) .rn-more:hover span { text-decoration: underline; }
#content :is(.rn-root, .rn-box) .rn-more:hover .rn-ico { transform: translateX(3px); }
#content .rn-root .rn-more--s { margin-top: 4px; font-size: 13px; color: var(--rn-vi-ink); }
#content .rn-root .rn-inl { font-weight: 800; color: var(--rn-ink); text-decoration: underline !important; text-underline-offset: 2px; }

/* ---------- 3) Úvod ---------- */
.rn-hero {
  position: relative; isolation: isolate; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 32px; align-items: center;
  padding: 44px 48px; border: 1px solid rgba(11, 13, 16, .06); border-radius: 30px; overflow: hidden;
  background: radial-gradient(60% 90% at 100% 0%, rgba(91, 76, 230, .16), rgba(91, 76, 230, 0) 62%), radial-gradient(50% 80% at 70% 100%, rgba(0, 118, 225, .07), rgba(0, 118, 225, 0) 60%), linear-gradient(180deg, #f8f8f6, #f0f0ed);
}
#content .rn-lead { margin: 16px 0 0; max-width: 60ch; font-size: 17px; line-height: 1.6; color: var(--rn-2); }
#content .rn-facts { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 0; }
#content .rn-facts li {
  display: inline-flex; align-items: center; gap: 8px; min-height: 38px; padding: 8px 14px; border: 1px solid rgba(11, 13, 16, .08); border-radius: 999px;
  background: rgba(255, 255, 255, .92); font: 700 13.5px/1.3 var(--rn-text); color: var(--rn-ink);
}
.rn-facts .rn-ico { width: 18px; height: 18px; color: var(--rn-vi); }
.rn-hero-act { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.rn-hero-pics { position: relative; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.rn-hero-pic {
  position: relative; display: block; overflow: hidden; aspect-ratio: 1 / 1; border: 1px solid rgba(11, 13, 16, .06); border-radius: 22px; background: #fff;
  box-shadow: 0 24px 40px -30px rgba(11, 13, 16, .55);
}
.rn-hero-pic img { display: block; width: 100%; height: 100%; object-fit: contain; padding: 10%; }
.rn-hero-pic--2, .rn-hero-pic--4 { transform: translateY(18px); }
.rn-hero-pic em {
  position: absolute; left: 10px; bottom: 10px; max-width: calc(100% - 20px); overflow: hidden; padding: 5px 10px; border-radius: 999px; background: rgba(11, 13, 16, .78);
  font: 700 11.5px/1.2 var(--rn-text); font-style: normal; color: #fff; white-space: nowrap; text-overflow: ellipsis;
}

/* ---------- 4) Technika k pronájmu ---------- */
#content .rn-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
#content .rn-card {
  display: flex; flex-direction: column; min-width: 0; overflow: hidden; border: 1px solid var(--rn-line); border-radius: 22px; background: #fff;
  transition: border-color .15s, box-shadow .2s, transform .2s;
}
#content .rn-card:hover { border-color: var(--rn-line-2); box-shadow: 0 22px 40px -30px rgba(11, 13, 16, .55); transform: translateY(-2px); }
.rn-card-img { display: block; aspect-ratio: 1 / 1; background: var(--rn-soft); }
.rn-card-img img { display: block; width: 100%; height: 100%; object-fit: contain; padding: 8%; mix-blend-mode: multiply; }
.rn-card-b { display: flex; flex-direction: column; flex: 1 1 auto; padding: 16px 18px 18px; }
#content .rn-card-k { font: 700 11px/1.2 var(--rn-text); letter-spacing: .08em; text-transform: uppercase; color: var(--rn-vi-ink); }
#content .rn-card-t { margin-top: 6px; font: 600 18px/1.25 var(--rn-font) !important; letter-spacing: -.01em; color: var(--rn-ink) !important; text-transform: none; }
#content .rn-card-t a { color: inherit; }
#content .rn-card-t a:hover { text-decoration: underline !important; text-underline-offset: 2px; }
#content .rn-card-price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; min-height: 26px; margin-top: 8px; font-size: 14px; color: var(--rn-2); }
.rn-card-price b { font: 700 18px/1.2 var(--rn-font); color: var(--rn-ink); }
.rn-card-price small { font-size: 12.5px; color: var(--rn-3); }
#content .rn-card-meta { display: grid; gap: 6px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--rn-line); font-size: 13.5px; line-height: 1.4; color: var(--rn-2); }
#content .rn-card-meta li { display: flex; align-items: flex-start; gap: 8px; }
#content .rn-card-meta li[hidden] { display: none; }
.rn-card-meta .rn-ico { width: 16px; height: 16px; margin-top: 1px; color: var(--rn-3); }
.rn-card-act { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; padding-top: 16px; }

/* ---------- 5) Kalkulačka ---------- */
.rn-calc { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 28px; padding: 26px; border: 1px solid var(--rn-line); border-radius: 26px; background: #fff; }
.rn-calc-l { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.rn-field { min-width: 0; }
#content .rn-label { display: block; margin: 0 0 10px; font: 800 13.5px/1.2 var(--rn-text); color: var(--rn-ink); }
.rn-select { position: relative; }
#content .rn-select select {                          /* šablona dává selectu max. 400 px a inline-block */
  box-sizing: border-box; display: block; width: 100%; max-width: none !important; height: 54px; margin: 0; padding: 0 44px 0 16px; border: 1px solid var(--rn-line-2); border-radius: 16px; background: #fff;
  font: 700 16px/1.2 var(--rn-text); color: var(--rn-ink); cursor: pointer; -webkit-appearance: none; appearance: none;
}
#content .rn-select select:focus { border-color: var(--rn-ink); outline: 0; box-shadow: 0 0 0 3px rgba(0, 99, 199, .22); }
.rn-select > .rn-ico { position: absolute; top: 50%; right: 16px; width: 20px; height: 20px; margin-top: -10px; color: var(--rn-3); pointer-events: none; }
.rn-days { display: flex; flex-wrap: wrap; gap: 8px; }
#content :is(.rn-root, .rn-box) .rn-chip {
  display: inline-flex; flex-direction: column; align-items: center; justify-content: center; min-width: 76px; min-height: 44px; margin: 0; padding: 6px 14px;
  border: 1px solid var(--rn-line-2); border-radius: 999px; background: #fff; font: 700 14px/1.15 var(--rn-text); color: var(--rn-ink); cursor: pointer;
  transition: background-color .15s, border-color .15s, color .15s;
}
#content :is(.rn-root, .rn-box) .rn-chip:hover { border-color: var(--rn-ink); }
#content :is(.rn-root, .rn-box) .rn-chip.is-on { border-color: var(--rn-ink); background: var(--rn-ink); color: #fff; }
#content :is(.rn-root, .rn-box) .rn-chip small { font-size: 10.5px; font-weight: 700; color: var(--rn-warn); }
#content :is(.rn-root, .rn-box) .rn-chip.is-on small { color: #ffd98a; }
#content :is(.rn-root, .rn-box) .rn-chip.is-ask:not(.is-on) { border-style: dashed; color: var(--rn-2); }
#content .rn-root .rn-chip.is-sk { cursor: default; border-color: var(--rn-line); background: var(--rn-sunk); }
#content .rn-avail { min-height: 21px; margin-top: 10px; font-size: 13.5px; font-weight: 700; color: var(--rn-3); }
#content .rn-avail.is-ok { color: var(--rn-ok); }
#content .rn-avail.is-ask { color: var(--rn-warn); }
.rn-calc-pic { position: relative; flex: 1 1 auto; display: grid; place-items: center; min-height: 220px; margin: 0; overflow: hidden; border-radius: 20px; background: var(--rn-soft); }
.rn-calc-pic[hidden] { display: none; }
.rn-calc-pic img { display: block; width: auto; max-width: 78%; max-height: 280px; object-fit: contain; mix-blend-mode: multiply; }
#content .rn-calc-pic figcaption {
  position: absolute; left: 12px; right: 12px; bottom: 12px; font: 700 12.5px/1.4 var(--rn-text); color: var(--rn-2); text-align: center;
}
#content .rn-calc-pic figcaption:empty { display: none; }
#content .rn-note { display: flex; align-items: flex-start; gap: 10px; margin-top: 0; padding: 14px 16px; border-radius: 16px; background: var(--rn-soft); font-size: 13.5px; line-height: 1.5; color: var(--rn-2); }
.rn-note .rn-ico { width: 18px; height: 18px; margin-top: 1px; color: var(--rn-3); }
.rn-calc-r { min-width: 0; }
.rn-sum { display: flex; flex-direction: column; gap: 14px; height: 100%; padding: 22px; border-radius: 20px; background: var(--rn-soft); }
.rn-sum-top { display: flex; align-items: center; gap: 14px; min-width: 0; }
.rn-sum-top img { flex: none; width: 72px; height: 72px; padding: 6px; border-radius: 16px; background: #fff; object-fit: contain; }
.rn-sum-top > div { min-width: 0; }
#content .rn-sum-k { font: 700 11px/1.2 var(--rn-text); letter-spacing: .08em; text-transform: uppercase; color: var(--rn-vi-ink); }
#content .rn-sum-t { margin-top: 3px; font: 600 18px/1.25 var(--rn-font); color: var(--rn-ink); }
#content .rn-kv { display: grid; gap: 0; }
#content .rn-kv p { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid rgba(11, 13, 16, .07); font-size: 14.5px; color: var(--rn-2); }
#content .rn-kv p:last-child { border-bottom: 0; }
#content .rn-kv span small { font-size: 12px; color: var(--rn-3); }
#content .rn-kv b { flex: none; font: 800 15px/1.3 var(--rn-text); color: var(--rn-ink); text-align: right; font-variant-numeric: tabular-nums; }
#content .rn-kv b .rn-newlink { display: inline-flex; align-items: center; gap: 4px; color: var(--rn-ink); text-decoration: underline !important; text-underline-offset: 2px; }
.rn-newlink .rn-ico { width: 14px; height: 14px; }
#content .rn-kv.is-sk p span, #content .rn-kv.is-sk p b, .rn-total.is-sk span, .rn-total.is-sk b { color: transparent; }
#content .rn-kv.is-sk p::after { content: ''; flex: 0 0 70px; height: 12px; border-radius: 6px; background: #e6e6e3; }
#content .rn-total { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding-top: 12px; border-top: 1px solid rgba(11, 13, 16, .14); }
.rn-total span { font: 700 16px/1.3 var(--rn-text); color: var(--rn-ink); }
.rn-total b { font: 600 26px/1.1 var(--rn-font); letter-spacing: -.02em; color: var(--rn-ink); }
#content .rn-fine { display: flex; align-items: flex-start; gap: 8px; font-size: 13px; line-height: 1.5; color: var(--rn-3); }
.rn-fine .rn-ico { width: 16px; height: 16px; margin-top: 1px; color: var(--rn-vi); }
#content .rn-alt { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px 12px; font-size: 13.5px; color: var(--rn-3); }
#content .rn-alt a { display: inline-flex; align-items: center; gap: 6px; font-weight: 800; color: var(--rn-ink); }
#content .rn-alt a:hover span { text-decoration: underline; }
.rn-alt .rn-ico { width: 16px; height: 16px; }
#content .rn-msg { display: flex; align-items: flex-start; gap: 8px; padding: 10px 12px; border-radius: 12px; background: #fff; font-size: 13.5px; font-weight: 700; line-height: 1.45; }
#content .rn-msg[hidden] { display: none; }
#content .rn-msg.is-ok { background: #e9f6ee; color: var(--rn-ok); }
#content .rn-msg.is-bad { background: #fdeae7; color: var(--rn-bad); }
.rn-msg .rn-ico { width: 18px; height: 18px; }
#content .rn-err { display: flex; align-items: flex-start; gap: 8px; padding: 12px 14px; border-radius: 14px; background: #fff8e6; font-size: 14px; font-weight: 700; color: #5c4300; }
.rn-err .rn-ico { width: 18px; height: 18px; color: #a86f00; }

/* ---------- 6) Jak pronájem probíhá, podmínky, otázky, ke koupi, kontakt ---------- */
#content .rn-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
#content .rn-steps li { position: relative; padding: 22px; border: 1px solid var(--rn-line); border-radius: 22px; background: #fff; }
.rn-step-n { display: grid; place-items: center; width: 38px; height: 38px; margin-bottom: 14px; border-radius: 50%; background: var(--rn-vi); color: #fff; font: 600 15px/1 var(--rn-font); }
#content .rn-steps p { margin-top: 6px; line-height: 1.6; }
#content .rn-info { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
#content .rn-info li { display: flex; align-items: flex-start; gap: 14px; padding: 20px; border: 1px solid var(--rn-line); border-radius: 20px; background: #fff; }
.rn-info-i { display: grid; place-items: center; flex: none; width: 42px; height: 42px; border-radius: 13px; background: var(--rn-vi-bg); color: var(--rn-vi); }
#content .rn-info p { margin-top: 6px; font-size: 14px; line-height: 1.55; }
.rn-faq { display: grid; gap: 8px; max-width: 900px; }
.rn-q { border: 1px solid var(--rn-line); border-radius: 16px; background: #fff; transition: border-color .15s, box-shadow .15s; }
.rn-q[open] { border-color: var(--rn-line-2); box-shadow: 0 12px 28px -22px rgba(11, 13, 16, .5); }
#content .rn-q summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 18px; border-radius: 16px; font: 800 15.5px/1.35 var(--rn-text); color: var(--rn-ink); list-style: none; cursor: pointer; }
.rn-q summary::-webkit-details-marker { display: none; }
.rn-q summary::marker { content: ''; }
.rn-q-chev { color: var(--rn-3); transition: transform .2s; }
.rn-q[open] .rn-q-chev { transform: rotate(180deg); }
.rn-a { padding: 0 18px 18px; line-height: 1.65; }
#content .rn-sale { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
#content .rn-sale-a {
  position: relative; display: flex; align-items: center; gap: 14px; min-height: 96px; padding: 12px 44px 12px 12px; border: 1px solid var(--rn-line); border-radius: 18px;
  background: #fff; color: var(--rn-ink); transition: border-color .15s, box-shadow .15s;
}
#content .rn-sale-a:hover { border-color: var(--rn-ink); box-shadow: 0 12px 26px -18px rgba(11, 13, 16, .5); }
.rn-sale-a img { flex: none; width: 72px; height: 72px; border-radius: 12px; background: var(--rn-soft); object-fit: contain; mix-blend-mode: multiply; }
.rn-sale-b { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.rn-sale-b b { font: 800 14.5px/1.3 var(--rn-text); color: var(--rn-ink); }
.rn-sale-b small { font: 700 14px/1.2 var(--rn-text); color: var(--rn-2); }
.rn-sale-go { position: absolute; top: 50%; right: 16px; width: 18px; height: 18px; margin-top: -9px; color: var(--rn-3); }
#content .rn-cta {
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 20px 28px; padding: 30px 34px; border-radius: 26px; color: rgba(255, 255, 255, .8);
  background: var(--rn-ink); background-image: radial-gradient(60% 120% at 100% 0%, rgba(91, 76, 230, .55), rgba(91, 76, 230, 0) 62%);
}
#content .rn-cta .rn-h2 { color: #fff !important; }
#content .rn-cta p { margin-top: 8px; }
.rn-cta-act { display: flex; flex-wrap: wrap; gap: 10px; }

/* ---------- 7) Detail produktu – panel pronájmu pod nákupním boxem ---------- */
#content .rn-box { margin: 16px 0 0; padding: 18px 20px 20px; border: 1px solid var(--rn-vi-line); border-radius: 20px; background: var(--rn-vi-bg); }
.rn-box-top { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px 16px; }
#content .rn-box-h { display: inline-flex; align-items: center; gap: 8px; font: 800 15px/1.3 var(--rn-text); color: var(--rn-vi-ink); }
.rn-box-h .rn-ico { width: 18px; height: 18px; color: var(--rn-vi); }
.rn-seg { display: inline-flex; padding: 4px; border-radius: 999px; background: rgba(255, 255, 255, .8); box-shadow: inset 0 0 0 1px var(--rn-vi-line); }
#content .rn-seg button {
  min-height: 36px; margin: 0; padding: 0 16px; border: 0; border-radius: 999px; background: transparent; font: 700 13.5px/1 var(--rn-text); color: var(--rn-2); cursor: pointer;
  transition: background-color .15s, color .15s, box-shadow .15s;
}
#content .rn-seg button.is-on { background: #fff; color: var(--rn-ink); box-shadow: 0 2px 8px -3px rgba(42, 31, 143, .35); }
#content .rn-box--solo .rn-seg { padding: 0; background: none; box-shadow: none; }
#content .rn-box--solo .rn-seg button { min-height: 40px; padding: 0 18px; background: var(--rn-vi); color: #fff; }
#content .rn-box--solo .rn-seg button.is-on { background: var(--rn-vi-2); color: #fff; box-shadow: none; }
#content .rn-box-tease-t { margin-top: 10px; font-size: 14px; line-height: 1.55; color: var(--rn-2); }
.rn-box-tease[hidden] { display: none !important; }
.rn-box-body { display: grid; gap: 14px; margin-top: 14px; }
.rn-box-body[hidden] { display: none !important; }
#content .rn-box-load { font-size: 14px; font-weight: 700; color: var(--rn-3); }
#content .rn-kv--box p { font-size: 14.5px; }
#content .rn-kv-av.is-ok b { color: var(--rn-ok); }
#content .rn-kv-av.is-ask b { color: var(--rn-warn); }
.rn-box-act { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; }
.rn-box-links { display: inline-flex; flex-wrap: wrap; gap: 6px 16px; }
#content .rn-box-links a { display: inline-flex; align-items: center; gap: 6px; font: 800 13.5px/1.3 var(--rn-text); color: var(--rn-ink); }
#content .rn-box-links a:hover span { text-decoration: underline; }
.rn-box-links .rn-ico { width: 16px; height: 16px; }
/* produkt k pronájmu: „Zvolte variantu“ nahrazuje výběr délky; řádky o doručení a vrácení do 14 dnů k pronájmu nepatří */
html.rn-detail-rent:not(.rn-off) .buy-box .vyber-var,
html.rn-detail-rent:not(.rn-off) .p-info-wrapper .pd-info { display: none !important; }
html.rn-detail-rent:not(.rn-off) #content .rn-box { margin-top: 12px; }
/* nákupní produkt v režimu Půjčit: nákupní tlačítko, řádky o doručení nákupu a lišta s cenou dole se schovají (pronájem je v panelu) */
html.rn-rent:not(.rn-off) .p-info-wrapper .buy-box .add-to-cart,
html.rn-rent:not(.rn-off) .p-info-wrapper .buy-box .vyber-var,
html.rn-rent:not(.rn-off) .p-info-wrapper .pd-info,
html.rn-rent:not(.rn-off) .pd-bar { display: none !important; }
/* bez tlačítka pod cenou by zůstala dvojitá mezera (16 + 16 px) */
html.rn-rent:not(.rn-off) .p-info-wrapper .buy-box .p-final-price-wrapper:has(+ .add-to-cart:last-child, + .vyber-var:last-child) { margin-bottom: 0; }

/* ---------- 8) Užší obrazovky ---------- */
@media (max-width: 1199px) {
  #content .rn-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #content .rn-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #content .rn-info { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #content .rn-sale { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 991px) {
  .rn-hero { grid-template-columns: minmax(0, 1fr); padding: 34px 32px; }
  .rn-hero-pics { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
  .rn-hero-pic--2, .rn-hero-pic--4 { transform: none; }
  .rn-calc { grid-template-columns: minmax(0, 1fr); gap: 22px; padding: 20px; }
  .rn-calc-pic { display: none; }                  /* na užší obrazovce stačí malá fotka v souhrnu */
}
@media (max-width: 767px) {
  .rn-root > * + * { margin-top: 40px; }
  .rn-sec, .rn-q, .rn-cta { scroll-margin-top: 124px; }  /* pod přilepenou hlavičkou na mobilu (54 + 52 px) */
  .rn-hero { gap: 22px; padding: 26px 20px 24px; border-radius: 24px; }
  #content .rn-lead { font-size: 15.5px; }
  .rn-hero-pics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rn-hero-pic:nth-child(n+3) { display: none; }
  .rn-hero-act { flex-direction: column; }
  #content .rn-hero-act .rn-btn { width: 100%; white-space: normal; }
  #content .rn-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .rn-card-b { padding: 12px 12px 14px; }
  #content .rn-card-t { font-size: 15.5px !important; }
  .rn-card-price b { font-size: 16px; }
  #content .rn-card-meta { font-size: 12.5px; }
  .rn-card-act { flex-direction: column; align-items: stretch; }
  #content .rn-card-act .rn-btn { width: 100%; }
  #content .rn-card-act .rn-more { justify-content: center; }
  .rn-calc { padding: 16px; border-radius: 22px; }
  .rn-sum { padding: 16px; }
  .rn-total b { font-size: 23px; }
  #content .rn-steps, #content .rn-info, #content .rn-sale { grid-template-columns: minmax(0, 1fr); }
  #content .rn-q summary { padding: 14px 16px; font-size: 15px; }
  .rn-a { padding: 0 16px 16px; }
  #content .rn-cta { flex-direction: column; align-items: stretch; padding: 24px 20px; }
  .rn-cta-act { flex-direction: column; }
  #content .rn-cta .rn-btn { width: 100%; }
  #content .rn-box { padding: 16px; }
  .rn-box-act { flex-direction: column; align-items: stretch; }
  #content .rn-box-act .rn-btn { width: 100%; }
}
@media (max-width: 767px) {
  .rn-card-price small { flex-basis: 100%; }
  #content .rn-card-act .rn-btn .rn-ico { display: none; }
}
@media (max-width: 359px) {
  #content .rn-cards { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .rn-root *, .rn-box * { transition: none !important; }
  #content .rn-card:hover, #content :is(.rn-root, .rn-box) .rn-btn--vi:hover { transform: none; }
}