/* VITADERM — ukážka webu dermatovenerologickej ambulancie (AMANI Visual)
   Smer: svetlo, čistota, pokoj, presná typografia. Jedna paleta, jedna mierka písma, jeden systém tlačidiel a rozostupov.
   Zdieľané: ../../assets/css/fonts.css (Manrope, Schibsted Grotesk), ../../assets/css/scene.css (scéna dermatoskopu). */

:root {
  /* farby */
  --paper: #F7F6F2;
  --paper-2: #EFEDE7;
  --white: #FFFFFF;
  --cream: #EDE9E2;          /* pozadie úvodného obrazu */
  --scene-bg: #EBE8DC;       /* pozadie renderov dermatoskopu */
  --ink: #142220;
  --ink-2: #44504D;
  --ink-3: #5E6966;
  --line: #DAD7CF;
  --line-2: #E7E4DD;
  --green: #1D4E47;
  --green-2: #143A35;
  --green-tint: #EEF4F2;
  --mint: #A9C9C1;           /* akcent na tmavom pozadí */
  --skin: #C28D74;           /* teplý tón pokožky – iba drobné značky */
  --warn-bg: #F5E7DE;
  --warn-ink: #6E3A22;
  --err: #A3382A;
  /* písmo */
  --font-display: 'Schibsted Grotesk', 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-text: 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --t-h1: clamp(44px, 5.4vw, 80px);
  --t-h2: clamp(32px, 3.7vw, 52px);
  --t-h3: clamp(20px, 1.8vw, 24px);
  --t-lead: clamp(17px, 1.3vw, 19px);
  --t-body: 16px;
  --t-small: 14px;
  --t-label: 12.5px;
  /* rozostupy a tvary */
  --gutter: clamp(20px, 4vw, 56px);
  --maxw: 1240px;
  --sec: clamp(76px, 9vw, 132px);
  --r-sm: 10px;
  --r-md: 14px;
  --r-lg: 22px;
  --ease: cubic-bezier(.22, 1, .36, 1);
  /* výšky pevných prvkov */
  --pbar-h: 40px;
  --header-h: 72px;
  --info-h: 104px;
  /* premenné zdieľanej scény */
  --accent: var(--green);
  --scene-ink: var(--ink);
  --scene-paper: var(--scene-bg);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 16px); scrollbar-gutter: stable; }
html.lite { scroll-behavior: auto; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
html.bk-open { overflow: hidden; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 400 var(--t-body)/1.6 var(--font-text); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; overflow-x: clip; text-rendering: optimizeLegibility; }
img, svg, canvas { display: block; max-width: 100%; }
a { color: inherit; }
button { font: inherit; color: inherit; }
h1, h2, h3, h4 { font-family: var(--font-display); font-weight: 500; letter-spacing: -.02em; margin: 0; text-wrap: balance; }
p { margin: 0; }
b, strong { font-weight: 650; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid var(--green); outline-offset: 3px; border-radius: 6px; }
.contact :focus-visible, .foot :focus-visible, .pbar :focus-visible { outline-color: var(--mint); }

.wrap { width: 100%; max-width: calc(var(--maxw) + 2 * var(--gutter)); margin-inline: auto; padding-inline: var(--gutter); }
.vh { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip { position: absolute; left: 12px; top: -80px; z-index: 200; background: var(--ink); color: var(--paper); padding: 12px 18px; border-radius: 999px; font-weight: 600; text-decoration: none; }
.skip:focus { top: 12px; }

/* ---------- typografické prvky ---------- */
.eyebrow { display: inline-block; position: relative; padding-left: 20px; font: 600 var(--t-label)/1.35 var(--font-text); letter-spacing: .14em; text-transform: uppercase; color: var(--green); }
.eyebrow::before { content: ''; position: absolute; left: 0; top: calc(.675em - 5px); width: 10px; height: 10px; border-radius: 50%; border: 1.5px solid currentColor; background: radial-gradient(circle, currentColor 0 1.6px, transparent 2.2px); }
.eyebrow--light { color: var(--mint); }
.lead { font-size: var(--t-lead); line-height: 1.6; color: var(--ink-2); max-width: 34em; }
.link { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; color: var(--green); font-weight: 650; font-size: 15px; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; text-decoration-color: rgba(29, 78, 71, .35); transition: color .2s, text-decoration-color .2s; }
.link:hover { color: var(--ink); text-decoration-color: currentColor; }
.link--light { color: var(--paper); text-decoration-color: rgba(247, 246, 242, .35); }
.link--light:hover { color: var(--white); }
.ticks { list-style: none; padding: 0; margin: 18px 0 0; display: grid; gap: 9px; }
.ticks li { position: relative; padding-left: 28px; font-size: 15.5px; line-height: 1.5; color: var(--ink); }
.ticks li::before { content: ''; position: absolute; left: 3px; top: .42em; width: 12px; height: 6.5px; border-left: 1.6px solid var(--green); border-bottom: 1.6px solid var(--green); transform: rotate(-45deg); }
.ticks--sm li { font-size: 15px; }

/* ---------- tlačidlá ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 0 26px; border-radius: 999px; border: 1px solid transparent; font: 650 15.5px/1 var(--font-text); letter-spacing: .005em; text-decoration: none; white-space: nowrap; cursor: pointer; transition: background-color .2s, color .2s, border-color .2s; -webkit-tap-highlight-color: transparent; }
.btn svg { width: 18px; height: 18px; flex: none; }
.btn--primary { background: var(--green); color: var(--white); }
.btn--primary:hover { background: var(--green-2); }
.btn--ghost { background: transparent; color: var(--ink); border-color: rgba(20, 34, 32, .24); }
.btn--ghost:hover { border-color: var(--ink); background: rgba(255, 255, 255, .55); }
.btn--light { background: var(--paper); color: var(--ink); }
.btn--light:hover { background: var(--white); }
.btn--sm { min-height: 44px; padding: 0 20px; font-size: 14.5px; }
/* hlavná výzva: telefonické objednanie (text + číslo pod ním) */
.btn--call { display: inline-grid; grid-template-columns: auto auto; grid-template-rows: auto auto; column-gap: 12px; row-gap: 5px; align-content: center; justify-content: start; min-height: 62px; padding: 9px 28px 9px 11px; text-align: left; white-space: nowrap; }
.btn--call .btn__ico { grid-column: 1; grid-row: 1 / span 2; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; background: rgba(255, 255, 255, .13); }
.btn--call .btn__ico svg { width: 19px; height: 19px; }
.btn--call .btn__label { grid-column: 2; grid-row: 1; line-height: 1.1; }
.btn--call .btn__num { grid-column: 2; grid-row: 2; font-weight: 500; font-size: 14px; line-height: 1.1; letter-spacing: .02em; opacity: .82; font-variant-numeric: tabular-nums; }
.btn--ghost.btn--call .btn__ico { background: var(--green-tint); color: var(--green); }
.btn--ghost.btn--call .btn__num { opacity: 1; color: var(--ink-2); }
/* vedľajší vstup do ukážky online objednávania (nesúperí s telefonickou výzvou) */
.demo-link { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; min-height: 44px; padding: 0; border: 0; background: none; color: var(--green); font: 650 15px/1.3 var(--font-text); text-align: left; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.demo-link svg { width: 18px; height: 18px; flex: none; }
.demo-link > span:not(.demo-tag) { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; text-decoration-color: rgba(29, 78, 71, .35); transition: color .2s, text-decoration-color .2s; }
.demo-link:hover > span:not(.demo-tag) { color: var(--ink); text-decoration-color: currentColor; }
.demo-tag { flex: none; display: inline-flex; align-items: center; padding: 5px 9px; border-radius: 999px; background: var(--warn-bg); color: var(--warn-ink); font: 650 10.5px/1 var(--font-text); letter-spacing: .1em; text-transform: uppercase; }
.demo-link--sm { font-size: 14px; gap: 8px; }
.demo-link--light { color: var(--paper); }
.demo-link--light > span:not(.demo-tag) { text-decoration-color: rgba(247, 246, 242, .4); }
.demo-link--light:hover > span:not(.demo-tag) { color: var(--white); }

/* ---------- lišta ukážky (portfólio) ---------- */
.pbar { background: var(--ink); color: rgba(247, 246, 242, .82); font-size: 13px; line-height: 1.3; position: relative; z-index: 60; }
.pbar__in { min-height: var(--pbar-h); display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.pbar__txt { display: flex; align-items: center; gap: 10px; min-width: 0; }
.pbar__label { min-width: 0; }
.nw { white-space: nowrap; }
.pbar__txt b { color: var(--white); font-weight: 650; }
.pbar__txt a { text-underline-offset: 3px; text-decoration-color: rgba(247, 246, 242, .35); }
.pbar__dot { width: 7px; height: 7px; border-radius: 50%; background: var(--skin); flex: none; }
.pbar__nav { display: flex; align-items: center; gap: 6px; flex: none; }
.pbar__back { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 10px; text-decoration: none; color: rgba(247, 246, 242, .9); }
.pbar__back:hover { color: var(--white); }
.pbar__cta { display: inline-flex; align-items: center; min-height: 30px; padding: 0 14px; border-radius: 999px; border: 1px solid rgba(247, 246, 242, .32); color: var(--white); font-weight: 650; text-decoration: none; transition: background-color .2s, border-color .2s; }
.pbar__cta:hover { background: rgba(247, 246, 242, .1); border-color: rgba(247, 246, 242, .6); }

/* ---------- hlavička ---------- */
.hdr { position: sticky; top: 0; z-index: 50; height: var(--header-h); background: rgba(237, 233, 226, .9); -webkit-backdrop-filter: saturate(1.2) blur(14px); backdrop-filter: saturate(1.2) blur(14px); border-bottom: 1px solid transparent; transition: background-color .3s, border-color .3s; }
.hdr.is-scrolled { background: rgba(247, 246, 242, .9); border-bottom-color: var(--line); }
.hdr__in { height: 100%; display: flex; align-items: center; gap: 20px; }
.brand { display: flex; align-items: center; gap: 12px; color: var(--ink); text-decoration: none; margin-right: auto; min-height: 44px; }
.brand__mark { width: 30px; height: 30px; color: var(--green); flex: none; }
.brand__txt { display: grid; gap: 5px; }
.brand__name { font: 500 17px/1 var(--font-display); letter-spacing: .2em; color: var(--ink); margin: 0; }
.brand__name b { font-weight: 700; color: var(--green); }
.brand__sub { font-size: 10.5px; line-height: 1; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); font-weight: 600; white-space: nowrap; }
.nav { display: flex; align-items: center; gap: 2px; }
.nav a { position: relative; display: inline-flex; align-items: center; min-height: 44px; padding: 0 14px; border-radius: 999px; font-size: 15px; font-weight: 550; color: var(--ink-2); text-decoration: none; transition: color .2s, background-color .2s; }
.nav a:hover { color: var(--ink); background: rgba(20, 34, 32, .05); }
.nav a.is-active { color: var(--ink); }
.nav a.is-active::after { content: ''; position: absolute; left: 50%; bottom: 6px; width: 4px; height: 4px; margin-left: -2px; border-radius: 50%; background: var(--green); }
.hdr__side { display: flex; align-items: center; gap: 14px; margin-left: 8px; }
.hdr__tel { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-weight: 650; font-size: 15px; color: var(--ink); text-decoration: none; font-variant-numeric: tabular-nums; white-space: nowrap; }
.hdr__tel svg { width: 18px; height: 18px; color: var(--green); }
.hdr__tel:hover span { text-decoration: underline; text-underline-offset: 4px; }
.hdr__book-t { white-space: nowrap; }
.hdr__menu { display: none; width: 44px; height: 44px; border-radius: 50%; border: 1px solid rgba(20, 34, 32, .2); background: transparent; cursor: pointer; align-items: center; justify-content: center; }
.hdr__menu i, .hdr__menu i::before, .hdr__menu i::after { display: block; width: 16px; height: 1.6px; background: var(--ink); border-radius: 2px; transition: transform .25s var(--ease), opacity .2s; }
.hdr__menu i { position: relative; }
.hdr__menu i::before, .hdr__menu i::after { content: ''; position: absolute; left: 0; }
.hdr__menu i::before { top: -5px; }
.hdr__menu i::after { top: 5px; }
.hdr__menu[aria-expanded="true"] i { background: transparent; }
.hdr__menu[aria-expanded="true"] i::before { transform: translateY(5px) rotate(45deg); }
.hdr__menu[aria-expanded="true"] i::after { transform: translateY(-5px) rotate(-45deg); }
.menu { position: absolute; left: 0; right: 0; top: 100%; background: var(--paper); border-bottom: 1px solid var(--line); box-shadow: 0 24px 48px rgba(20, 34, 32, .12); max-height: calc(100svh - var(--header-h)); overflow: auto; }
.menu__in { display: grid; padding-block: 8px 24px; }
.menu__in > a { display: flex; align-items: center; min-height: 52px; border-bottom: 1px solid var(--line-2); font: 500 19px/1.2 var(--font-display); text-decoration: none; color: var(--ink); }
.menu__info { margin-top: 18px; font-size: 13.5px; color: var(--ink-3); }
.menu__tel { display: inline-flex; min-height: 44px; align-items: center; font: 500 22px/1 var(--font-display); color: var(--green); text-decoration: none; }

/* ---------- úvod ---------- */
.hero { position: relative; background: var(--cream); overflow: hidden; display: flex; align-items: center; min-height: clamp(480px, calc(100svh - var(--pbar-h) - var(--header-h) - var(--info-h)), 880px); --hz: 1.1; --hx: .8; --hy: 0; --hoff: 5.5cqh; }
.hero__art { position: absolute; inset: 0; overflow: hidden; container-type: size; }
.hero__frame { position: absolute; left: 0; top: 0; width: calc(max(100cqw, 176.84cqh) * var(--hz)); aspect-ratio: 2400 / 1357; transform: translate(calc((100cqw - 100%) * var(--hx)), calc((100cqh - 100%) * var(--hy) + var(--hoff))); }
.hero__img { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero__reticle { position: absolute; left: 66.9%; top: 19%; width: 29.5%; aspect-ratio: 1; transform: translate(-50%, -50%); overflow: visible; fill: none; stroke: var(--ink); pointer-events: none; }
.hero__reticle circle, .hero__reticle path { vector-effect: none; }
.hero__reticle > circle { opacity: .22; }
.hero__reticle > path { opacity: .3; }
.ret__spin { opacity: .3; transform-box: fill-box; transform-origin: center; animation: ret-spin 140s linear infinite; }
@keyframes ret-spin { to { transform: rotate(360deg); } }
.hero__pin { position: absolute; left: 81.5%; top: 41%; transform: translateY(-50%); display: grid; gap: 3px; padding: 10px 0 10px 16px; border-left: 1px solid rgba(20, 34, 32, .35); text-decoration: none; color: var(--ink); white-space: nowrap; }
.hero__pin-k { font: 600 11.5px/1.2 var(--font-text); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); }
.hero__pin-v { font: 500 16px/1.25 var(--font-display); }
.hero__pin:hover .hero__pin-v { text-decoration: underline; text-underline-offset: 4px; }
.hero__cap { position: absolute; right: var(--gutter); bottom: 18px; font-size: 12px; color: var(--ink-3); letter-spacing: .02em; }
.hero__in { position: relative; z-index: 2; padding-block: 56px 72px; }
@media (min-width: 760px) and (max-height: 820px) {
  .hero__in { padding-block: 32px 40px; }
  .hero h1 { margin: 16px 0 18px; }
  .hero__cta { margin-top: 24px; }
  .hero__facts { margin-top: 24px; }
}
.hero__copy { max-width: 600px; }
.hero h1 { font-size: var(--t-h1); line-height: 1.01; letter-spacing: -.038em; margin: 22px 0 24px; }
.hero__lead { font-size: var(--t-lead); line-height: 1.6; color: var(--ink-2); max-width: 30em; }
.hero__lead b { color: var(--ink); font-weight: 650; }
.hero__cta { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; margin-top: 32px; }
.hero__facts { list-style: none; padding: 0; margin: 36px 0 0; display: flex; flex-wrap: wrap; gap: 10px 26px; font-size: 14px; font-weight: 550; color: var(--ink-2); }
.hero__facts li { display: inline-flex; align-items: center; gap: 9px; }
.hero__facts li::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: var(--green); }
html.lite .ret__spin { animation: none; }
@media (prefers-reduced-motion: reduce) { .ret__spin { animation: none; } }

/* ---------- praktické informácie ---------- */
.info { background: var(--paper); border-bottom: 1px solid var(--line); position: relative; z-index: 5; }
.info__in { display: grid; grid-template-columns: 1.15fr 1.1fr 1fr 1fr; min-height: var(--info-h); }
.info__cell { position: relative; padding: 18px 24px; border-left: 1px solid var(--line); display: flex; flex-direction: column; justify-content: center; }
.info__cell:first-child { border-left: 0; padding-left: 0; }
.info__k { font: 600 11.5px/1.3 var(--font-text); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 7px; }
.info__v { font: 500 17px/1.3 var(--font-display); color: var(--ink); display: flex; align-items: center; gap: 9px; }
.info__v a { text-decoration: none; }
.info__v a:hover { text-decoration: underline; text-underline-offset: 4px; }
.info__s { font-size: 13.5px; color: var(--ink-2); margin-top: 4px; }
.info__s a { color: var(--green); font-weight: 650; text-decoration: none; display: inline-flex; min-height: 28px; align-items: center; }
.info__s a:hover { text-decoration: underline; text-underline-offset: 3px; }
.info__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--ink-3); flex: none; display: none; }
[data-today].is-open .info__dot { display: block; background: #2F8A5F; box-shadow: 0 0 0 4px rgba(47, 138, 95, .16); }
[data-today].is-closed .info__dot { display: block; background: #A7A49B; }
.info__more { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; min-height: 44px; margin: -4px 0 -14px; padding: 0; border: 0; background: none; color: var(--green); font-weight: 650; font-size: 13.5px; cursor: pointer; }
.info__more svg { width: 12px; height: 12px; transition: transform .25s var(--ease); }
.info__more[aria-expanded="true"] svg { transform: rotate(180deg); }
.info__more:hover { text-decoration: underline; text-underline-offset: 3px; }
.week { position: absolute; left: -16px; top: calc(100% - 6px); z-index: 30; width: 330px; padding: 18px 20px; background: var(--white); border: 1px solid var(--line); border-radius: var(--r-md); box-shadow: 0 24px 60px rgba(20, 34, 32, .14); }
.week.is-up { top: auto; bottom: calc(100% - 10px); box-shadow: 0 -10px 60px rgba(20, 34, 32, .16); }
.week table { width: 100%; border-collapse: collapse; font-size: 14.5px; }
.week th, .week td { padding: 9px 0; border-bottom: 1px solid var(--line-2); text-align: left; font-weight: 500; }
.week td { text-align: right; font-variant-numeric: tabular-nums; }
.week tr:last-child th, .week tr:last-child td { border-bottom: 0; }
.week tr.is-closed { color: var(--ink-3); }
.week tr.is-today th, .week tr.is-today td { color: var(--green); font-weight: 700; }
.week tr.is-today th::after { content: 'dnes'; margin-left: 8px; padding: 2px 7px; border-radius: 999px; background: var(--green-tint); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; vertical-align: 1px; }
.week p { margin-top: 10px; font-size: 12.5px; color: var(--ink-3); line-height: 1.5; }

/* ---------- sekcie ---------- */
.sec { padding-block: var(--sec); }
.sec h2 { font-size: var(--t-h2); line-height: 1.07; letter-spacing: -.032em; margin-top: 16px; }
.sec__head { max-width: 760px; margin-bottom: clamp(36px, 5vw, 60px); }
.sec__head--row { max-width: none; display: flex; justify-content: space-between; align-items: flex-end; gap: 40px; }

/* ---------- služby ---------- */
.services { background: var(--paper); }
.services__grid { display: grid; grid-template-columns: minmax(0, 4.6fr) minmax(0, 7.4fr); gap: clamp(40px, 6vw, 96px); align-items: start; }
.services__head { position: sticky; top: calc(var(--header-h) + 36px); }
.services__head .lead { margin-top: 20px; }
.online { margin-top: 40px; padding: 26px 26px 18px; background: var(--white); border: 1px solid var(--line); border-radius: var(--r-lg); position: relative; overflow: hidden; }
.online::after { content: ''; position: absolute; right: -60px; top: -60px; width: 180px; height: 180px; border-radius: 50%; background: repeating-radial-gradient(circle, transparent 0 13px, rgba(29, 78, 71, .08) 13px 14px); pointer-events: none; }
.online__k { font: 600 11.5px/1.2 var(--font-text); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); }
.online h3 { font-size: 23px; margin: 8px 0 10px; }
.online p { font-size: 15px; color: var(--ink-2); }
.online__meta { display: flex; align-items: baseline; gap: 14px; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line-2); }
.online__meta b { font: 500 26px/1 var(--font-display); color: var(--ink); letter-spacing: -.02em; flex: none; }
.online__meta span { font-size: 13.5px; color: var(--ink-3); line-height: 1.45; }
.online .link { margin-top: 6px; font-size: 14.5px; }

.acc { border-top: 1px solid var(--line); }
.acc__item { border-bottom: 1px solid var(--line); }
.acc__h { margin: 0; font: inherit; letter-spacing: 0; }
.acc__btn { width: 100%; display: grid; grid-template-columns: 34px 30px minmax(0, 1fr) 38px; align-items: center; gap: 18px; padding: 24px 0; min-height: 44px; border: 0; background: none; text-align: left; cursor: pointer; color: var(--ink); -webkit-tap-highlight-color: transparent; }
.acc__no { font: 500 13px/1 var(--font-display); color: var(--ink-3); letter-spacing: .02em; }
.acc__ico { width: 30px; height: 30px; fill: none; stroke: var(--green); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.acc__title { display: block; font: 500 var(--t-h3)/1.2 var(--font-display); letter-spacing: -.018em; }
.acc__sum { display: block; margin-top: 5px; font-size: 14.5px; color: var(--ink-2); line-height: 1.45; }
.acc__pm { position: relative; width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--line); transition: background-color .25s, border-color .25s; }
.acc__pm::before, .acc__pm::after { content: ''; position: absolute; left: 50%; top: 50%; width: 12px; height: 1.6px; margin: -.8px 0 0 -6px; background: var(--ink); border-radius: 2px; transition: transform .3s var(--ease), background-color .25s; }
.acc__pm::after { transform: rotate(90deg); }
.acc__btn:hover .acc__pm { border-color: var(--ink); }
.acc__btn:hover .acc__title { color: var(--green-2); }
.acc__btn[aria-expanded="true"] .acc__pm { background: var(--green); border-color: var(--green); }
.acc__btn[aria-expanded="true"] .acc__pm::before, .acc__btn[aria-expanded="true"] .acc__pm::after { background: var(--white); }
.acc__btn[aria-expanded="true"] .acc__pm::after { transform: rotate(0deg); }
.acc__panel { padding: 0 0 34px calc(34px + 30px + 36px); }
.acc__panel.is-opening { animation: acc-in .45s var(--ease); }
@keyframes acc-in { from { opacity: 0; transform: translateY(-6px); } }
.acc__body { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 28px; align-items: start; }
.acc__main p { color: var(--ink-2); font-size: 16px; }
.acc__main p + p { margin-top: 12px; }
.acc__price { background: var(--white); border: 1px solid var(--line-2); border-radius: var(--r-md); padding: 16px 20px 14px; }
.acc__ph { font: 600 11.5px/1.3 var(--font-text); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 6px; }
.acc__price dl { margin: 0; }
.acc__price dl div { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 10px 0; border-top: 1px solid var(--line-2); }
.acc__price dl div:first-child { border-top: 0; }
.acc__price dt { font-size: 14px; line-height: 1.4; color: var(--ink-2); }
.acc__price dd { margin: 0; font: 500 16px/1.2 var(--font-display); white-space: nowrap; }
.acc__price .ticks { margin-top: 10px; }
.acc__pn { font-size: 13px; color: var(--ink-3); margin-top: 8px; padding-top: 10px; border-top: 1px solid var(--line-2); }
.acc__act { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 24px; margin-top: 24px; }

/* ---------- scéna dermatoskopu (úpravy zdieľanej scény) ---------- */
.story { --accent: var(--green); color: var(--ink); background: var(--scene-bg); height: 340svh; min-height: 2600px; }
/* celý pripnutý záber je pod pevnou hlavičkou – vrch prístroja sa nikdy neschová */
.story__stage { top: var(--header-h); height: calc(100svh - var(--header-h)); min-height: 560px; background: var(--scene-bg); }
.story__media { background: var(--scene-bg); }
.story__top { top: 22px; color: var(--ink-3); font-size: 11.5px; letter-spacing: .14em; opacity: 1; }
.story__copy { max-width: min(33%, 480px); gap: 18px; }
.story__copy--low { bottom: 17%; }
.story__copy h2 { font-size: clamp(38px, 4.3vw, 62px); line-height: 1.03; letter-spacing: -.035em; }
.story__copy .lead { font-size: 17px; max-width: 26em; }
.story .co__label { max-width: 250px; }
.story .co__label b { font-family: var(--font-display); font-weight: 500; font-size: 18px; color: var(--ink); }
.story .co__label span { font-size: 14.5px; line-height: 1.45; color: var(--ink-2); opacity: 1; }
.story .co__line { stroke: var(--ink); opacity: .45; }
.story .co__ring { stroke: var(--green); }
.story .co__box { background: rgba(247, 246, 242, .94); border: 1px solid var(--line); color: var(--ink); }
.story .co__box span { color: var(--ink-2); }
.story__cta { position: absolute; right: var(--gutter); bottom: 88px; z-index: 5; }
.story__loading { right: auto; left: 50%; bottom: 66px; transform: translateX(-50%); color: var(--ink-3); }
/* jemné zjednotenie pozadia pod textom (šum renderu) */
.story__media::after { background: linear-gradient(90deg, rgba(235, 232, 220, .78) 0%, rgba(235, 232, 220, .5) 18%, rgba(235, 232, 220, 0) 34%, rgba(235, 232, 220, 0) 80%, rgba(235, 232, 220, .92) 89%, rgba(235, 232, 220, .92) 100%); }
.story__footer { color: var(--ink-2); font-size: 11px; }
.story__track::before { opacity: .18; }
.pause-story { min-height: 44px; padding: 0 16px; border-radius: 999px; border: 1px solid rgba(20, 34, 32, .3); background: rgba(247, 246, 242, .5); cursor: pointer; opacity: 1; color: var(--ink); }
.pause-story:hover { border-color: var(--ink); }
.story.is-static { background: var(--scene-bg); }
.story.is-static .story__stage { top: auto; height: auto; min-height: 0; padding-top: var(--sec); padding-bottom: var(--sec); }
.story.is-static .story__copy { max-width: 40em; }
.story.is-static .story__cta { position: static; order: 3; justify-self: start; margin: 0 var(--gutter) 28px; }
.story.is-static .story__static { order: 4; }
.story.is-static .story__footer { order: 5; }

/* ---------- lekárka ---------- */
.doctor { background: var(--paper-2); }
.doctor__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(40px, 6vw, 96px); align-items: center; }
.doctor__role { margin-top: 14px; font-size: 15px; font-weight: 650; color: var(--green); }
.doctor__id > p:not(.eyebrow):not(.doctor__role) { margin-top: 18px; color: var(--ink-2); font-size: 16.5px; max-width: 30em; }
.facts { margin: 36px 0 0; display: grid; border-top: 1px solid var(--line); }
.facts div { display: grid; grid-template-columns: minmax(130px, 38%) 1fr; gap: 20px; align-items: baseline; padding: 16px 0; border-bottom: 1px solid var(--line); }
.facts dt { font: 500 22px/1.15 var(--font-display); letter-spacing: -.02em; color: var(--ink); }
.facts dd { margin: 0; font-size: 14.5px; color: var(--ink-2); line-height: 1.45; }
.doctor__quote { position: relative; margin: 0; padding: clamp(32px, 4.5vw, 64px); background: var(--white); border-radius: var(--r-lg); overflow: hidden; }
.doctor__quote::after { content: ''; position: absolute; right: -120px; bottom: -120px; width: 360px; height: 360px; border-radius: 50%; background: repeating-radial-gradient(circle, transparent 0 17px, rgba(194, 141, 116, .12) 17px 18px); pointer-events: none; }
.doctor__q { width: 40px; height: 30px; color: var(--skin); margin-bottom: 26px; }
.doctor__quote blockquote { margin: 0; position: relative; z-index: 1; }
.doctor__big { font: 500 clamp(22px, 2.2vw, 31px)/1.32 var(--font-display); letter-spacing: -.018em; color: var(--ink); }
.doctor__quote blockquote p + p { margin-top: 20px; font-size: 16.5px; color: var(--ink-2); max-width: 36em; }
.doctor__quote figcaption { position: relative; z-index: 1; display: grid; gap: 2px; margin-top: 30px; padding-top: 20px; border-top: 1px solid var(--line-2); font-size: 14px; color: var(--ink-3); }
.doctor__quote figcaption b { font-size: 15.5px; color: var(--ink); }

/* ---------- návšteva ---------- */
.visit { background: var(--paper); }
.steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.step { display: flex; flex-direction: column; padding: 30px 30px 28px; background: var(--white); border: 1px solid var(--line); border-radius: var(--r-lg); }
.step__no { display: flex; align-items: center; gap: 14px; margin-bottom: 44px; font: 500 15px/1 var(--font-display); color: var(--green); }
.step__no::after { content: ''; flex: 1; height: 1px; background: var(--line); }
.step h3 { font-size: 25px; line-height: 1.15; margin-bottom: 12px; }
.step p:not(.step__no):not(.step__tag) { color: var(--ink-2); font-size: 15.5px; }
.step a { color: var(--green); font-weight: 650; white-space: nowrap; }
.step__tag { margin-top: auto; padding-top: 26px; display: flex; align-items: center; gap: 9px; font-size: 13.5px; font-weight: 650; color: var(--green); }
.step__tag::before { content: ''; width: 10px; height: 5.5px; border-left: 1.6px solid currentColor; border-bottom: 1.6px solid currentColor; transform: rotate(-45deg) translateY(-2px); }
.visit__notes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: 20px; }
.note { padding: 26px 30px 28px; background: var(--paper-2); border-radius: var(--r-lg); }
.note h3 { font-size: 19px; margin-bottom: 10px; }
.note p { font-size: 15px; color: var(--ink-2); }
.note .ticks { margin-top: 12px; gap: 7px; }

/* ---------- cenník ---------- */
.prices { background: var(--white); }
.prices__meta { max-width: 440px; font-size: 15px; color: var(--ink-2); }
.pfilter { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 34px; }
.pchip { min-height: 44px; padding: 0 20px; border-radius: 999px; border: 1px solid var(--line); background: transparent; font: 650 14px/1 var(--font-text); color: var(--ink-2); cursor: pointer; transition: background-color .2s, color .2s, border-color .2s; }
.pchip:hover { border-color: var(--ink); color: var(--ink); }
.pchip[aria-pressed="true"] { background: var(--ink); border-color: var(--ink); color: var(--paper); }
.plist { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(32px, 5vw, 72px); align-items: start; }
.pgroup[data-group="vys"] { grid-column: 1; grid-row: 1; }
.pgroup[data-group="est"] { grid-column: 1; grid-row: 2; }
.pgroup[data-group="adm"] { grid-column: 1; grid-row: 3; }
.pgroup[data-group="zak"] { grid-column: 2; grid-row: 1 / span 3; }
.plist.is-filtered { display: block; max-width: 760px; }
.pgroup { margin-bottom: 40px; }
.pgroup h3 { font: 650 12px/1.2 var(--font-text); letter-spacing: .14em; text-transform: uppercase; color: var(--green); padding-bottom: 14px; border-bottom: 1px solid var(--ink); }
.pgroup dl { margin: 0; }
.pgroup dl div { display: flex; justify-content: space-between; align-items: baseline; gap: 24px; padding: 13px 0; border-bottom: 1px solid var(--line-2); }
.pgroup dt { font-size: 15.5px; line-height: 1.45; color: var(--ink); }
.pgroup dd { margin: 0; font: 500 17px/1.2 var(--font-display); white-space: nowrap; }
.prices__foot { display: flex; justify-content: space-between; align-items: center; gap: 16px 32px; padding: 20px 26px; background: var(--paper); border-radius: var(--r-md); }
.prices__foot p { font-size: 15px; color: var(--ink-2); max-width: 46em; }
.prices__foot p b { color: var(--ink); }
.prices__act { flex: none; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 24px; }

/* ---------- otázky ---------- */
.faq { background: var(--paper); }
.faq__grid { display: grid; grid-template-columns: minmax(0, 4.6fr) minmax(0, 7.4fr); gap: clamp(40px, 6vw, 96px); align-items: start; }
.faq__head { position: sticky; top: calc(var(--header-h) + 36px); }
.faq__head > p:not(.eyebrow) { margin: 18px 0 24px; color: var(--ink-2); font-size: 16.5px; max-width: 26em; }
.qa { border-bottom: 1px solid var(--line); }
.qa:first-child { border-top: 1px solid var(--line); }
.qa summary { display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 22px 0; min-height: 44px; cursor: pointer; list-style: none; font: 500 19px/1.35 var(--font-display); letter-spacing: -.01em; -webkit-tap-highlight-color: transparent; }
.qa summary::-webkit-details-marker { display: none; }
.qa summary:hover span { color: var(--green-2); }
.qa summary i { position: relative; flex: none; width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--line); transition: background-color .25s, border-color .25s; }
.qa summary i::before, .qa summary i::after { content: ''; position: absolute; left: 50%; top: 50%; width: 11px; height: 1.6px; margin: -.8px 0 0 -5.5px; background: var(--ink); border-radius: 2px; transition: transform .3s var(--ease), background-color .25s; }
.qa summary i::after { transform: rotate(90deg); }
.qa[open] summary i { background: var(--green); border-color: var(--green); }
.qa[open] summary i::before, .qa[open] summary i::after { background: var(--white); }
.qa[open] summary i::after { transform: rotate(0deg); }
.qa__a { padding: 0 58px 24px 0; }
.qa__a p { color: var(--ink-2); font-size: 16px; max-width: 40em; }
.qa__a a { color: var(--green); font-weight: 650; white-space: nowrap; }
.qa[open] .qa__a { animation: acc-in .4s var(--ease); }

/* ---------- kontakt ---------- */
.contact { background: var(--ink); color: var(--paper); }
.contact h2 { color: var(--paper); max-width: 14em; }
.contact__top { display: flex; justify-content: space-between; align-items: flex-end; gap: 32px 48px; flex-wrap: wrap; padding-bottom: 48px; border-bottom: 1px solid rgba(247, 246, 242, .14); }
.contact__call p { font-size: 13px; letter-spacing: .12em; text-transform: uppercase; font-weight: 650; color: var(--mint); margin-bottom: 10px; }
.contact__tel { display: inline-flex; align-items: center; min-height: 48px; font: 500 clamp(32px, 4vw, 54px)/1 var(--font-display); letter-spacing: -.025em; color: var(--paper); text-decoration: none; white-space: nowrap; }
.contact__tel:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 8px; }
.contact__act { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 24px; margin-top: 22px; }
.contact__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; padding-top: 44px; }
.cbox h3 { font: 650 12px/1.2 var(--font-text); letter-spacing: .14em; text-transform: uppercase; color: var(--mint); margin-bottom: 16px; }
.cbox p { font-size: 16.5px; color: rgba(247, 246, 242, .92); line-height: 1.6; }
.cbox p + p { margin-top: 8px; }
.cbox .cbox__s { font-size: 14px; color: rgba(247, 246, 242, .66); }
.cbox__mail { font: 500 19px/1.3 var(--font-display); }
.cbox .link { margin-top: 6px; }
.hours { width: 100%; max-width: 340px; border-collapse: collapse; font-size: 15.5px; }
.hours th, .hours td { padding: 8px 0; border-bottom: 1px solid rgba(247, 246, 242, .12); text-align: left; font-weight: 500; color: rgba(247, 246, 242, .92); }
.hours td { text-align: right; font-variant-numeric: tabular-nums; }
.hours tr.is-closed th, .hours tr.is-closed td { color: rgba(247, 246, 242, .55); border-bottom: 0; }

/* ---------- pätička ---------- */
.foot { background: #0E1917; color: rgba(247, 246, 242, .66); font-size: 14px; padding-block: 56px 36px; }
.foot__top { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.4fr) minmax(0, 1.2fr); gap: 32px 48px; padding-bottom: 36px; border-bottom: 1px solid rgba(247, 246, 242, .1); }
.foot .brand__name { color: var(--paper); font-size: 18px; margin-bottom: 12px; }
.foot .brand__name b { color: var(--mint); }
.foot__brand p:not(.brand__name) { max-width: 22em; line-height: 1.55; }
.foot__nav { display: flex; flex-wrap: wrap; align-content: flex-start; gap: 0 22px; }
.foot__nav a { display: inline-flex; align-items: center; min-height: 44px; color: rgba(247, 246, 242, .88); text-decoration: none; }
.foot__nav a:hover { color: var(--white); text-decoration: underline; text-underline-offset: 4px; }
.foot__co { line-height: 1.7; }
.foot__pv { display: flex; justify-content: space-between; align-items: center; gap: 20px 40px; flex-wrap: wrap; padding-top: 28px; }
.foot__pv p { max-width: 44em; line-height: 1.6; }
.foot__pv p b { color: var(--paper); }
.foot__pv a:not(.btn):not(.link) { color: rgba(247, 246, 242, .9); text-underline-offset: 3px; }
.foot__act { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 20px; }
.lite-toggle { min-height: 44px; padding: 0 16px; border-radius: 999px; border: 1px solid rgba(247, 246, 242, .24); background: transparent; color: rgba(247, 246, 242, .88); font: 650 13px/1 var(--font-text); cursor: pointer; }
.lite-toggle:hover { border-color: rgba(247, 246, 242, .6); }

/* ---------- objednanie (dialóg) ---------- */
.bk { padding: 0; border: 0; margin: auto; width: min(720px, calc(100vw - 32px)); max-width: none; max-height: min(880px, calc(100dvh - 32px)); border-radius: var(--r-lg); background: var(--paper); color: var(--ink); box-shadow: 0 40px 120px rgba(10, 20, 18, .35); overflow: hidden; }
.bk[open] { display: flex; }
.bk::backdrop { background: rgba(14, 25, 23, .52); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.bk__box { display: flex; flex-direction: column; width: 100%; min-height: 0; max-height: inherit; }
.bk[open] .bk__box { animation: bk-in .4s var(--ease); }
@keyframes bk-in { from { opacity: 0; transform: translateY(14px) scale(.985); } }
html.lite .bk[open] .bk__box, html.lite .acc__panel.is-opening, html.lite .qa[open] .qa__a { animation: none; }
@media (prefers-reduced-motion: reduce) { .bk[open] .bk__box, .acc__panel.is-opening, .qa[open] .qa__a { animation: none; } }
.bk__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; padding: 24px 28px 0; }
.bk__tag { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 10px; padding: 6px 11px; border-radius: 999px; background: var(--warn-bg); color: var(--warn-ink); font: 650 11.5px/1 var(--font-text); letter-spacing: .1em; text-transform: uppercase; }
.bk__tag::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--skin); }
.bk__head h2 { font-size: 30px; line-height: 1.15; letter-spacing: -.028em; }
.bk__x { flex: none; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; border: 1px solid var(--line); background: transparent; cursor: pointer; }
.bk__x svg { width: 18px; height: 18px; }
.bk__x:hover { border-color: var(--ink); }
.bk__steps { list-style: none; margin: 20px 28px 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.bk__steps li { display: flex; align-items: center; gap: 8px; padding-top: 11px; border-top: 2px solid var(--line); font-size: 13px; color: var(--ink-3); font-weight: 550; min-width: 0; }
.bk__steps li span { flex: none; width: 22px; height: 22px; display: grid; place-items: center; border-radius: 50%; border: 1px solid currentColor; font-size: 11.5px; font-weight: 700; }
.bk__steps li.is-done { border-top-color: var(--green); color: var(--ink-2); }
.bk__steps li.is-done span { background: var(--green-tint); border-color: var(--green); color: var(--green); }
.bk__steps li[aria-current="step"] { border-top-color: var(--green); color: var(--ink); font-weight: 700; }
.bk__steps li[aria-current="step"] span { background: var(--green); border-color: var(--green); color: var(--white); }
.bk__steps.is-intro li { color: var(--ink-2); }
.bk__form { display: flex; flex-direction: column; flex: 1; min-height: 0; }
.bk__scroll { flex: 1; min-height: 0; overflow: auto; overscroll-behavior: contain; padding: 26px 28px 30px; }
.bk__step h3 { font-size: 22px; letter-spacing: -.02em; margin-bottom: 18px; outline: none; }
.bk fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.bk legend { padding: 0; margin-bottom: 12px; font-weight: 650; font-size: 15px; }
.bk legend span, .field label span { font-weight: 450; color: var(--ink-3); }
.opts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.opt, .day, .chip { position: relative; display: block; cursor: pointer; }
.opt input, .day input, .chip input { position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; margin: 0; cursor: pointer; }
.opt > span, .day > span { position: relative; display: grid; gap: 3px; min-height: 72px; align-content: center; padding: 14px 16px 14px 48px; background: var(--white); border: 1px solid var(--line); border-radius: var(--r-md); transition: border-color .2s, box-shadow .2s, background-color .2s; }
.opt > span::before, .day > span::before { content: ''; position: absolute; left: 17px; top: 50%; width: 18px; height: 18px; margin-top: -9px; border: 1.5px solid #8C938F; border-radius: 50%; background: var(--white); transition: border-color .2s, box-shadow .2s, background-color .2s; }
.day > span::before { border-radius: 5px; }
.opt b, .day b { font-size: 15.5px; font-weight: 650; line-height: 1.3; }
.opt small, .day small { font-size: 13px; color: var(--ink-2); line-height: 1.35; font-variant-numeric: tabular-nums; }
.opt:hover > span, .day:hover > span { border-color: #A9ADA8; }
.opt input:checked + span, .day input:checked + span { border-color: var(--green); box-shadow: inset 0 0 0 1px var(--green); background: #F4F8F6; }
.opt input:checked + span::before { border-color: var(--green); background: var(--green); box-shadow: inset 0 0 0 3.5px var(--white); }
.day input:checked + span::before { border-color: var(--green); background: var(--green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m3.5 8.5 3 3 6-7' fill='none' stroke='%23fff' stroke-width='2'/%3E%3C/svg%3E") center / 14px no-repeat; }
.opt input:focus-visible + span, .day input:focus-visible + span, .chip input:focus-visible + span { outline: 2px solid var(--green); outline-offset: 2px; }
.days { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.days legend { grid-column: 1 / -1; }
.day > span { padding: 14px 12px 14px 42px; }
.day > span::before { left: 14px; }
.win { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 26px; }
.win legend { width: 100%; }
.chip > span { display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px; border-radius: 999px; border: 1px solid var(--line); background: var(--white); font-size: 14.5px; font-weight: 600; transition: background-color .2s, color .2s, border-color .2s; }
.chip input:checked + span { background: var(--ink); border-color: var(--ink); color: var(--paper); }
.field { display: grid; gap: 7px; margin-top: 18px; }
.bk__step .field:first-of-type { margin-top: 0; }
.field--short { max-width: 280px; margin-top: 26px !important; }
.field label { font-weight: 650; font-size: 14.5px; }
.field input, .field textarea { width: 100%; min-height: 50px; padding: 12px 14px; border: 1px solid #C4C1B8; border-radius: var(--r-sm); background: var(--white); color: var(--ink); font: 16px/1.4 var(--font-text); transition: border-color .2s, box-shadow .2s; }
.field textarea { min-height: 96px; resize: vertical; }
.field input:focus, .field textarea:focus { outline: none; border-color: var(--green); box-shadow: 0 0 0 3px rgba(29, 78, 71, .18); }
.field [aria-invalid="true"] { border-color: var(--err); box-shadow: 0 0 0 3px rgba(163, 56, 42, .12); }
.hint { font-size: 13px; color: var(--ink-3); }
.err { margin-top: 8px; font-size: 13.5px; font-weight: 650; color: var(--err); display: flex; gap: 8px; align-items: flex-start; }
.err::before { content: '!'; flex: none; width: 17px; height: 17px; border-radius: 50%; background: var(--err); color: var(--white); font-size: 11px; line-height: 17px; text-align: center; margin-top: 1px; }
.field .err { margin-top: 0; }
.sum { margin: 0; border-top: 1px solid var(--line); }
.sum div { display: grid; grid-template-columns: 150px minmax(0, 1fr) auto; gap: 16px; align-items: center; padding: 3px 0; border-bottom: 1px solid var(--line); }
.sum dt { font-size: 13.5px; color: var(--ink-3); }
.sum dd { margin: 0; font-weight: 650; font-size: 15px; overflow-wrap: anywhere; }
.sum dd.is-empty { font-weight: 450; color: var(--ink-3); }
.sum button { min-height: 44px; padding: 0 4px; border: 0; background: none; color: var(--green); font-weight: 650; font-size: 13.5px; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.bk__lead { font-size: 16.5px; line-height: 1.6; color: var(--ink-2); max-width: 36em; }
.bk__call { margin-top: 26px; padding-top: 22px; border-top: 1px solid var(--line); }
.bk__call p { font-size: 14.5px; font-weight: 650; color: var(--ink); margin-bottom: 12px; }
.bk__note { margin: -6px 0 20px; padding: 12px 14px; border-radius: var(--r-sm); background: var(--green-tint); color: var(--green-2); font-size: 14px; line-height: 1.5; }
.field input::placeholder { color: #8C938F; opacity: 1; }
.bk__done .bk__similar { margin: 28px auto 0; padding-top: 18px; border-top: 1px solid var(--line); font-size: 14px; color: var(--ink-3); }
.bk__similar a { color: var(--green); font-weight: 650; text-underline-offset: 3px; white-space: nowrap; }
.bk__warn { margin-top: 18px; padding: 14px 16px; border-radius: var(--r-sm); background: var(--warn-bg); color: var(--warn-ink); font-size: 14px; line-height: 1.5; }
.bk__foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 28px; border-top: 1px solid var(--line); background: var(--paper); }
.bk__count { font-size: 13px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.bk__foot [data-bk-back][disabled] { visibility: hidden; }
.bk__done { text-align: center; padding: 8px 0 4px; }
.bk__ok { width: 64px; height: 64px; margin: 0 auto 18px; color: var(--green); }
.bk__done h3 { font-size: 26px; }
.bk__done p { max-width: 30em; margin: 0 auto 12px; color: var(--ink-2); font-size: 15.5px; }
.bk__done p b { color: var(--ink); }
.bk__doneact { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; margin-top: 26px; }

/* ---------- vstupy do záberu (iba transform/opacity) ---------- */
html.js:not(.lite) .rv { opacity: 0; transform: translate3d(0, 22px, 0); transition: opacity .9s var(--ease), transform .9s var(--ease); }
html.js:not(.lite) .rv.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { html.js .rv { opacity: 1 !important; transform: none !important; transition: none !important; } }

/* =================== responzívne =================== */
@media (max-width: 1180px) {
  .hero__pin { display: none; }
  .acc__body { grid-template-columns: minmax(0, 1fr); gap: 20px; }
}
/* číslo v hlavičke len tam, kde sa zmestí vedľa tlačidla „Objednať sa telefonicky“ */
@media (max-width: 1179px) { .hdr__tel { display: none; } }
@media (min-width: 961px) and (max-width: 1080px) {
  .hdr__in { gap: 14px; }
  .hdr__side { margin-left: 0; }
  .nav a { padding: 0 10px; }
}
@media (max-width: 1080px) {
  .services__grid, .faq__grid { grid-template-columns: minmax(0, 1fr); }
  .services__head, .faq__head { position: static; }
  .services__head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 48px; align-items: start; }
  .services__head .online { grid-column: 2; grid-row: 1 / span 3; margin-top: 0; }
  .doctor__grid { grid-template-columns: minmax(0, 1fr); }
  .info__in { grid-template-columns: 1.25fr 1fr 1fr; }
  .info__cell:last-child { display: none; }
}
@media (max-width: 960px) {
  .nav { display: none; }
  .hdr__menu { display: inline-flex; }
  .hero { --hz: 1; --hx: 1; }
  .hero__copy { max-width: 46%; }
  .hero h1 { font-size: clamp(40px, 5.6vw, 56px); }
  .steps, .visit__notes { grid-template-columns: minmax(0, 1fr); }
  .step__no { margin-bottom: 24px; }
  .contact__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .foot__top { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .foot__co { grid-column: 1 / -1; }
  /* scéna na tablete/mobile: text hore, rozklad pod ním */
  .story { height: 300svh; min-height: 2000px; }
  .story__copy, .story__copy--low { top: 64px; bottom: auto; max-width: none; }
  .story__copy .lead { display: block; font-size: 15.5px; max-width: 30em; }
  .story__cta { display: none; }
  .story.is-static .story__cta { display: inline-flex; }
}
/* tablet na výšku: obraz nad textom (samostatná kompozícia) */
@media (min-width: 760px) and (max-width: 1100px) and (orientation: portrait) {
  .hero { display: block; min-height: 0; --hz: 1.25; --hx: .75; --hy: 0; }
  .hero__art { position: relative; inset: auto; height: clamp(360px, 40svh, 480px); }
  .hero__in { padding-block: 44px 60px; }
  .hero__copy { max-width: 640px; }
  .hero h1 { font-size: clamp(48px, 7vw, 64px); }
}
@media (max-width: 759px) {
  :root { --header-h: 60px; --pbar-h: 44px; --gutter: 20px; --info-h: 0px; }
  body { font-size: 15.5px; }
  .pbar { font-size: 12px; }
  .pbar__txt { line-height: 1.25; padding-block: 4px; }
  .hero .eyebrow { font-size: 11.5px; letter-spacing: .1em; }
  .pbar__long { display: none; }
  .pbar__hide { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .pbar__back { min-width: 44px; min-height: 44px; justify-content: center; padding: 0; font-size: 17px; }
  .pbar__cta { min-height: 32px; padding: 0 12px; }
  .pbar__in { gap: 8px; }
  .brand__mark { width: 26px; height: 26px; }
  .brand__name { font-size: 15.5px; letter-spacing: .17em; }
  .brand__sub { font-size: 9.5px; letter-spacing: .12em; }
  .hdr__in { gap: 10px; }
  .hdr__side { gap: 8px; margin-left: 0; }
  .hdr__book { padding: 0 16px; font-size: 13px; line-height: 1.12; text-align: center; }
  .hdr__book-t > span { display: block; }

  /* úvod: samostatná mobilná kompozícia – obraz, potom text */
  .hero { display: block; min-height: 0; --hz: 1.62; --hx: .72; --hy: 0; }
  .hero__art { position: relative; inset: auto; height: clamp(280px, 42svh, 380px); }
  .hero__reticle { opacity: .9; }
  .hero__cap { left: var(--gutter); right: auto; bottom: 12px; max-width: 110px; font-size: 11px; line-height: 1.35; }
  .hero__in { padding-block: 26px 40px; }
  .hero__copy { max-width: none; }
  .hero h1 { font-size: clamp(36px, 10.6vw, 46px); margin: 14px 0 16px; }
  .hero__lead { font-size: 16px; }
  .hero__cta { margin-top: 24px; }
  .hero__cta .btn--call { width: 100%; justify-content: center; }
  .bk__call .btn--call { width: 100%; justify-content: center; }
  .bk__doneact .btn { width: 100%; }
  .bk__doneact .btn--call { justify-content: center; }
  .hero__facts { margin-top: 24px; gap: 8px 18px; font-size: 13.5px; }

  .info__in { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); min-height: 0; }
  .info__cell, .info__cell:first-child { padding: 16px 0 16px 16px; border-left: 1px solid var(--line); border-top: 1px solid var(--line); }
  .info__cell:nth-child(odd) { padding-left: 0; border-left: 0; }
  .info__cell--hours { grid-column: 1 / -1; padding-left: 0; border-left: 0; border-top: 0; }
  .info__cell:nth-child(2) { border-left: 0; padding-left: 0; }
  .info__cell:nth-child(3) { border-left: 1px solid var(--line); padding-left: 16px; }
  .info__cell:last-child { display: flex; grid-column: 1 / -1; border-left: 0; padding-left: 0; }
  .info__v { font-size: 16px; }
  .info__s { font-size: 13px; }
  .info__more { min-height: 44px; margin-bottom: -10px; }
  .week { position: static; width: auto; margin: 10px 0 6px; box-shadow: none; }

  .sec h2 { font-size: clamp(30px, 8.4vw, 38px); }
  .sec__head { margin-bottom: 30px; }
  .sec__head--row { display: block; }
  .prices__meta { margin-top: 16px; }
  .services__head { display: contents; }
  .services__grid { gap: 0; }
  .services__head .eyebrow { order: 0; }
  .services__head h2 { order: 1; }
  .services__head .lead { order: 2; margin: 16px 0 28px; font-size: 16.5px; }
  .acc { order: 3; }
  .services__head .online { order: 4; grid-column: auto; grid-row: auto; margin-top: 32px; }
  .acc__btn { grid-template-columns: 28px minmax(0, 1fr) 36px; gap: 14px; padding: 20px 0; }
  .acc__no { display: none; }
  .acc__ico { width: 26px; height: 26px; }
  .acc__title { font-size: 19px; }
  .acc__sum { font-size: 13.5px; }
  .acc__pm { width: 36px; height: 36px; }
  .acc__panel { padding: 0 0 28px; }
  .acc__price { padding: 14px 16px 12px; }

  .story { height: 280svh; min-height: 1800px; }
  .story__copy, .story__copy--low { top: 50px; bottom: auto; left: var(--gutter); right: var(--gutter); }
  .story__copy h2 { font-size: clamp(30px, 8.6vw, 40px); }
  .story__copy .lead { font-size: 15px; }
  .story__top { top: 18px; font-size: 10.5px; letter-spacing: .12em; }
  .story__top span.story__top-l { display: none; }
  .story__top span.story__top-r:last-child { display: inline; }
  .story__footer > span:first-child { display: none; }
  .story .co__box { bottom: 84px; }

  .doctor__quote { padding: 28px 22px; border-radius: var(--r-md); }
  .doctor__big { font-size: 21px; }
  .facts div { grid-template-columns: minmax(0, 1fr); gap: 2px; padding: 14px 0; }
  .facts dt { font-size: 20px; }

  .step { padding: 24px 22px; border-radius: var(--r-md); }
  .step h3 { font-size: 22px; }
  .note { padding: 22px; border-radius: var(--r-md); }

  .pfilter { flex-wrap: nowrap; overflow-x: auto; margin-inline: calc(-1 * var(--gutter)); padding-inline: var(--gutter); scrollbar-width: none; margin-bottom: 26px; }
  .pfilter::-webkit-scrollbar { display: none; }
  .pchip { flex: none; padding: 0 16px; }
  .plist { display: block; }
  .pgroup dl div { gap: 16px; padding: 12px 0; }
  .pgroup dt { font-size: 14.5px; }
  .pgroup dd { font-size: 16px; }
  .prices__foot { flex-direction: column; align-items: flex-start; padding: 18px; }

  .qa summary { font-size: 17px; padding: 18px 0; }
  .qa__a { padding-right: 0; }
  .qa__a p { font-size: 15.5px; }

  .contact__top { padding-bottom: 36px; }
  .contact__grid { grid-template-columns: minmax(0, 1fr); gap: 32px; padding-top: 32px; }
  .contact__tel { font-size: clamp(30px, 9.4vw, 40px); }
  .foot__top { grid-template-columns: minmax(0, 1fr); }
  .foot__pv { flex-direction: column; align-items: flex-start; }

  /* dialóg na celú obrazovku */
  .bk { width: 100vw; height: 100dvh; max-height: 100dvh; border-radius: 0; margin: 0; }
  .bk__head { padding: 18px 20px 0; }
  .bk__head h2 { font-size: 26px; }
  .bk__steps { margin: 16px 20px 0; gap: 4px; }
  .bk__steps li { font-size: 11.5px; gap: 6px; }
  .bk__steps li span { width: 20px; height: 20px; font-size: 10.5px; }
  .bk__scroll { padding: 22px 20px 26px; }
  .bk__step h3 { font-size: 20px; }
  .opts { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .opt > span { min-height: 64px; }
  .days { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
  .days legend { margin-bottom: 10px; }
  .bk__foot { padding: 12px 20px calc(12px + env(safe-area-inset-bottom)); }
  .bk__count { display: none; }
  .bk__foot [data-bk-next] { flex: 1 1 auto; max-width: 290px; margin-left: auto; white-space: normal; line-height: 1.25; text-align: center; min-height: 48px; padding: 8px 18px; }
  .sum div { grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; padding: 10px 0; }
  .sum dt { grid-column: 1; }
  .sum dd { grid-column: 1; }
  .sum div button { grid-column: 2; grid-row: 1 / span 2; }
}
@media (max-width: 400px) {
  .brand__sub { display: none; }
  .brand__mark { display: none; }
  .bk__steps li { font-size: 0; justify-content: center; }
  .bk__head h2 { font-size: 23px; }
  .bk__tag { line-height: 1.25; letter-spacing: .07em; }
  .bk__steps li[aria-current="step"] { font-size: 11.5px; justify-content: flex-start; }
}
@media (max-width: 374px) {
  .pbar__dot { display: none; }
  .pbar__txt { font-size: 11px; }
  .pbar__cta { padding: 0 10px; font-size: 11px; }
}
@media (max-width: 359px) {
  .pbar__txt { font-size: 11px; gap: 7px; }
  .pbar__cta { padding: 0 10px; font-size: 11.5px; }
  .hdr__book { padding: 0 13px; font-size: 12.5px; }
}
@media (max-width: 960px) {
  .story__media::after { background: linear-gradient(180deg, rgba(235, 232, 220, .85) 0%, rgba(235, 232, 220, .55) 22%, rgba(235, 232, 220, 0) 38%); }
}
@media (max-width: 759px) and (max-height: 740px) {
  .story__copy .lead { display: none; }
}