/* ==========================================================================
   Makman — AI recepčná pre ubytovanie
   Farby, písma a rozmery sú v :root. Stačí zmeniť tam.
   ========================================================================== */

:root {
  --paper: #F4EEE3;
  --paper-2: #EAE1CF;
  --card: #FFFCF5;
  --ink: #1B1813;
  --ink-2: #4B463C;
  --muted: #857D6F;
  --line: rgba(27, 24, 19, .13);
  --line-2: rgba(27, 24, 19, .3);
  --red: #D93D14;
  --red-soft: #F7D9CB;
  --green: #2A7A4B;
  --brass: #BE8B3A;

  --font-display: "Fraunces", "Iowan Old Style", Georgia, serif;
  --font-sans: "Familjen Grotesk", "Helvetica Neue", Arial, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --font-hand: "Caveat", "Segoe Print", cursive;

  --wrap: 1320px;
  --gutter: clamp(16px, 4vw, 48px);
  --nav-h: 72px;
  --ease: cubic-bezier(.2, .75, .15, 1);
  --shadow: 0 1px 0 rgba(255, 255, 255, .7) inset, 0 28px 60px -32px rgba(60, 40, 10, .38), 0 10px 24px -14px rgba(60, 40, 10, .22);

  --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .3 0 0 0 0 .22 0 0 0 0 .12 0 0 0 .16 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --ink-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.55' numOctaves='3'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -2.6 0 0 0 2.25'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23f)'/%3E%3C/svg%3E");
}

/* ---------- základ ---------- */
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 0; interpolate-size: allow-keywords; }
body {
  margin: 0;
  font-family: var(--font-sans);
  font-size: 17px;
  line-height: 1.55;
  color: var(--ink);
  background: var(--grain), var(--paper);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: clip;
}
img, svg { display: block; max-width: 100%; }
a { color: inherit; }
p, h1, h2, h3, dl, dd, ol, ul, blockquote, figure { margin: 0; }
ol, ul { padding: 0; list-style: none; }
button, input, select, textarea { font: inherit; color: inherit; }
::selection { background: var(--red); color: #fff; }
:focus-visible { outline: 2.5px solid var(--red); outline-offset: 3px; border-radius: 6px; }

.wrap { width: 100%; max-width: var(--wrap); margin-inline: auto; padding-inline: var(--gutter); }
main > section { overflow-x: clip; }

.skip {
  position: absolute; left: 12px; top: -60px; z-index: 200;
  background: var(--ink); color: var(--paper); padding: 10px 16px; border-radius: 10px; text-decoration: none;
}
.skip:focus { top: 12px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* ---------- typografia ---------- */
.h2 {
  font-family: var(--font-display);
  font-weight: 380;
  font-size: clamp(2.3rem, 1.2rem + 3.4vw, 4.6rem);
  line-height: .98;
  letter-spacing: -.032em;
  font-variation-settings: "opsz" 144, "SOFT" 40;
  text-wrap: balance;
}
.h2 em, .hero__title em {
  font-style: italic;
  color: var(--red);
  font-variation-settings: "opsz" 144, "SOFT" 100;
}
.lead { font-size: 19px; line-height: 1.5; color: var(--ink-2); max-width: 36em; margin-top: 22px; }
.note { font-size: 13.5px; color: var(--muted); margin-top: 18px; max-width: 40em; }

.kicker {
  display: flex; align-items: center; gap: 12px;
  font-family: var(--font-mono); font-size: 12px; letter-spacing: .12em; text-transform: uppercase;
  color: var(--ink-2); margin-bottom: 22px;
}

.badge {
  display: inline-block; font-family: var(--font-mono); font-size: 10.5px; font-weight: 700; letter-spacing: .06em;
  padding: 1px 6px; border: 1px solid var(--line-2); border-radius: 5px; color: var(--ink-2); vertical-align: 1px;
}

.scribble { font-family: var(--font-hand); font-weight: 700; color: var(--red); line-height: 1; }

/* ---------- tlačidlá ---------- */
.btn {
  --h: 60px;
  position: relative;
  display: inline-flex; align-items: center; justify-content: center; gap: 14px;
  min-height: var(--h); padding: 0 12px 0 26px;
  border: 0; border-radius: 999px;
  font-family: var(--font-sans); font-size: 17px; font-weight: 700; letter-spacing: -.005em;
  text-decoration: none; cursor: pointer; white-space: nowrap;
  transition: transform .35s var(--ease), background-color .25s, color .25s, box-shadow .35s var(--ease);
}
.btn__arrow {
  display: inline-grid; place-items: center; width: 38px; height: 38px; border-radius: 50%;
  background: rgba(255, 255, 255, .2); font-size: 18px; transition: transform .35s var(--ease);
}
.btn:hover .btn__arrow { transform: translateX(4px) rotate(-8deg); }
.btn--primary {
  background: var(--red); color: #fff;
  box-shadow: inset 0 -3px 0 rgba(0, 0, 0, .16), 0 14px 30px -14px rgba(217, 61, 20, .8);
}
/* dierka ako na visačke kufra */
.btn--primary::before {
  content: ""; width: 10px; height: 10px; border-radius: 50%; flex: none;
  background: var(--paper); box-shadow: inset 0 1.5px 2px rgba(0, 0, 0, .35); margin-left: -8px;
}
.btn--primary:hover { transform: translateY(-2px); box-shadow: inset 0 -3px 0 rgba(0, 0, 0, .16), 0 20px 36px -14px rgba(217, 61, 20, .85); }
.btn--line { background: transparent; color: var(--ink); box-shadow: inset 0 0 0 1.5px var(--ink); padding: 0 26px 0 22px; gap: 10px; }
.btn--line:hover { background: var(--ink); color: var(--paper); }
.btn--ink { background: var(--ink); color: var(--paper); }
.btn--ink:hover { background: var(--red); }
.btn--sm { --h: 44px; font-size: 15px; padding: 0 18px; }
.btn--block { width: 100%; }

.live-dot {
  position: relative; width: 9px; height: 9px; border-radius: 50%; background: #2FA35F; flex: none;
}
.live-dot::after {
  content: ""; position: absolute; inset: -4px; border-radius: 50%; border: 2px solid #2FA35F; opacity: 0;
  animation: ping 2s var(--ease) infinite;
}
@keyframes ping { 0% { transform: scale(.4); opacity: .9; } 100% { transform: scale(1.6); opacity: 0; } }

/* ---------- navigácia ---------- */
.nav {
  position: fixed; inset: 0 0 auto; z-index: 50; height: var(--nav-h);
  transition: background-color .3s, box-shadow .3s, transform .4s var(--ease);
}
.nav.is-stuck {
  background: rgba(244, 238, 227, .94);
  -webkit-backdrop-filter: saturate(1.4) blur(12px); backdrop-filter: saturate(1.4) blur(12px);
  box-shadow: 0 1px 0 var(--line);
}
.nav__inner { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.logo { display: inline-flex; align-items: center; text-decoration: none; }
.logo__img { width: auto; height: 34px; }
.nav__links { display: flex; gap: 30px; font-size: 15px; font-weight: 500; }
.nav__links a { text-decoration: none; position: relative; }
.nav__links a::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -4px; height: 1.5px; background: currentColor;
  transform: scaleX(0); transform-origin: right; transition: transform .35s var(--ease);
}
.nav__links a:hover::after { transform: scaleX(1); transform-origin: left; }
.nav__actions { display: flex; align-items: center; gap: 20px; }

/* ==========================================================================
   HERO
   ========================================================================== */
.hero { position: relative; padding-top: calc(var(--nav-h) + clamp(32px, 6vh, 72px)); }
.hero__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(28px, 4vw, 64px); align-items: center; }

.hero__for {
  display: inline-flex; align-items: center; gap: 9px; margin-bottom: 20px;
  padding: 7px 14px 7px 11px; border-radius: 999px; background: var(--ink); color: var(--paper); font-size: 14.5px;
}
.hero__for svg { width: 11px; height: 17px; color: var(--red); }
.hero__for strong { font-weight: 700; }

/* H1 obaľuje tabuľu aj slogan, vzhľad určujú vnútorné triedy */
.hero__h1 { font-size: inherit; font-weight: inherit; }

/* tabuľa s preklápacími písmenami */
.board { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 14px; margin-bottom: clamp(20px, 3vh, 30px); }
.board__label { font-family: var(--font-mono); font-size: 12.5px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-2); }
.board__cells { display: inline-flex; gap: 3px; padding: 5px; background: #2A2620; border-radius: 9px; box-shadow: inset 0 2px 4px rgba(0, 0, 0, .5), 0 1px 0 rgba(255, 255, 255, .6); }
.flap {
  --fh: 36px;
  position: relative; display: inline-block; width: calc(var(--fh) * .72); height: var(--fh);
  perspective: 240px; font-family: var(--font-mono); font-weight: 700; font-size: calc(var(--fh) * .6);
  color: #F6EEDF; text-align: center;
}
.flap > span {
  position: absolute; left: 0; right: 0; height: 50%; overflow: hidden;
  background: #16130F; backface-visibility: hidden; -webkit-backface-visibility: hidden;
}
.flap > span > i { position: absolute; left: 0; right: 0; height: 200%; line-height: var(--fh); font-style: normal; }
.flap > span > i::before { content: attr(data-c); }
.flap .f-t, .flap .f-ft { top: 0; border-radius: 4px 4px 0 0; transform-origin: 50% 100%; }
.flap .f-b, .flap .f-fb { bottom: 0; border-radius: 0 0 4px 4px; transform-origin: 50% 0; }
.flap .f-t > i, .flap .f-ft > i { top: 0; }
.flap .f-b > i, .flap .f-fb > i { top: -100%; }
.flap .f-b, .flap .f-fb { background: #1E1A15; }
.flap .f-fb { transform: rotateX(90deg); }
.flap::after { content: ""; position: absolute; left: 0; right: 0; top: calc(50% - .5px); height: 1px; background: rgba(0, 0, 0, .8); z-index: 3; }

.hero__title {
  display: block;
  font-family: var(--font-display);
  font-weight: 360;
  font-size: clamp(3rem, 1.2rem + 5.4vw, 7.2rem);
  line-height: .9;
  letter-spacing: -.036em;
  word-spacing: .05em;
  font-variation-settings: "opsz" 144, "SOFT" 30;
}
.hero__title .line { display: block; }
.ring-pill {
  display: inline-flex; align-items: center; gap: 8px; vertical-align: middle; transform: translateY(-.12em);
  margin-left: .22em; padding: 6px 16px 6px 6px; border-radius: 999px;
  background: var(--card); box-shadow: inset 0 0 0 1.5px var(--ink);
  font-family: var(--font-sans); font-size: clamp(13px, .7rem + .35vw, 17px); font-weight: 600; letter-spacing: 0; line-height: 1;
  font-style: normal; color: var(--ink); white-space: nowrap;
}
.ring-pill svg {
  width: 2.2em; height: 2.2em; padding: .5em; border-radius: 50%; background: var(--red); color: #fff;
  animation: ring 2.6s ease-in-out infinite; transform-origin: 50% 50%;
}
.ring-pill b { font-family: var(--font-mono); font-size: 1.05em; }
@keyframes ring {
  0%, 60%, 100% { transform: rotate(0); }
  64% { transform: rotate(-16deg); } 68% { transform: rotate(14deg); } 72% { transform: rotate(-12deg); }
  76% { transform: rotate(10deg); } 80% { transform: rotate(-6deg); } 84% { transform: rotate(0); }
}

.hero__lead { font-size: clamp(17px, .9rem + .3vw, 19.5px); line-height: 1.52; color: var(--ink-2); max-width: 35em; margin: clamp(20px, 3vh, 30px) 0 clamp(24px, 3.4vh, 34px); }
.hero__lead strong { color: var(--ink); font-weight: 700; }

/* --- vyskúšať Emu: číslo na ukážkový Hotel Slovensko --- */
.tryema { position: relative; max-width: 620px; scroll-margin: calc(var(--nav-h) + 24px); }
.tryema__top { display: flex; justify-content: flex-end; margin-bottom: 8px; }
.scribble--try { display: flex; align-items: flex-end; gap: 4px; margin: 0 26px -6px 0; font-size: 24px; white-space: nowrap; transform: rotate(-3deg); }
.scribble--try svg { width: 34px; height: 26px; transform: rotate(98deg) scaleY(-1); }

.dial {
  display: flex; align-items: center; gap: 14px; padding: 7px 7px 7px 10px; text-decoration: none; color: var(--ink);
  background: var(--card); border-radius: 999px; box-shadow: inset 0 0 0 1.5px var(--ink), 0 18px 34px -24px rgba(60, 40, 10, .45);
  transition: box-shadow .25s, transform .25s var(--ease);
}
.dial:hover { box-shadow: inset 0 0 0 2px var(--red), 0 22px 38px -24px rgba(60, 40, 10, .55); }
.dial:focus-visible { outline: none; box-shadow: inset 0 0 0 2px var(--red), 0 0 0 4px rgba(217, 61, 20, .18); }
.dial__ring { position: relative; display: grid; place-items: center; flex: none; width: 46px; height: 46px; border-radius: 50%; background: #2FA35F; color: #fff; }
.dial__ring svg { width: 22px; height: 22px; animation: ring 2.4s ease-in-out infinite; }
.dial__ring::before, .dial__ring::after { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px solid #2FA35F; animation: ripple 2.4s var(--ease) infinite; }
.dial__ring::after { animation-delay: .6s; }
.dial__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.dial__label { font-family: var(--font-mono); font-size: 11.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dial__num { font-family: var(--font-display); font-size: clamp(22px, 1rem + 1vw, 28px); font-weight: 450; line-height: 1; letter-spacing: -.01em; white-space: nowrap; font-variation-settings: "opsz" 72, "SOFT" 50; }
.dial__btn { --h: 54px; flex: none; }
.dial:hover .dial__btn .btn__arrow { transform: translateX(4px) rotate(-8deg); }

.dial__tips { margin-top: 12px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 14px; }
.dial__tips-label { font-family: var(--font-mono); font-size: 12px; color: var(--muted); }
.dial__tips q { font-family: var(--font-hand); font-size: 22px; font-weight: 600; line-height: 1.1; color: #22303F; quotes: "„" "“"; }

.hero__proof { display: flex; align-items: center; gap: 8px; margin-top: 14px; font-family: var(--font-mono); font-size: 12.5px; color: var(--ink-2); }
.hero__proof::before {
  content: ""; width: 15px; height: 15px; flex: none; border-radius: 50%; background: var(--green)
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6 12.5 4 4L18 8' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 11px no-repeat;
}
.hero__proof b { color: var(--ink); }

/* ochrana formulára s dopytom (Cloudflare Turnstile) */
.captcha:empty { display: none; }
.captcha { margin-top: 12px; }


/* --- ukážka hovoru --- */
.hero__stage { position: relative; padding: 34px 0 186px; }
.fob {
  position: absolute; z-index: 3; left: calc(100% - 470px - 62px); top: 30px; width: 70px; height: auto;
  transform-origin: 50% 11%; animation: swing 5.5s ease-in-out infinite; filter: drop-shadow(0 10px 12px rgba(60, 30, 10, .25));
}
.fob__no { font-family: var(--font-display); font-size: 64px; font-weight: 500; fill: #FFF3E6; font-variation-settings: "opsz" 144, "SOFT" 100; }
.fob__txt { font-family: var(--font-mono); font-size: 12px; font-weight: 700; letter-spacing: 2.5px; fill: rgba(255, 243, 230, .8); }
@keyframes swing { 0%, 100% { transform: rotate(9deg); } 50% { transform: rotate(-7deg); } }

.call {
  position: relative; z-index: 1; width: min(100%, 470px); margin-left: auto;
  background: var(--card); border-radius: 26px; padding: 20px 24px 22px;
  box-shadow: var(--shadow), 0 0 0 1px var(--line);
  transform: rotate(-1.4deg);
}
.call__head { display: flex; align-items: center; justify-content: space-between; font-family: var(--font-mono); font-size: 11.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-2); }
.call__status { display: inline-flex; align-items: center; gap: 9px; font-weight: 700; }
.rec-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--red); animation: blink 1.2s steps(2, jump-none) infinite; }
.call.is-ringing .rec-dot { background: #2FA35F; animation-duration: .5s; }
@keyframes blink { 0% { opacity: 1; } 100% { opacity: .25; } }
.call__timer { font-weight: 600; letter-spacing: .04em; }
.call__who { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin: 14px 0 6px; padding-bottom: 16px; border-bottom: 1.5px dashed var(--line-2); }
.call__hotel { font-family: var(--font-display); font-size: 27px; font-weight: 450; letter-spacing: -.02em; line-height: 1.05; font-variation-settings: "opsz" 72, "SOFT" 60; }
.call__caller { font-family: var(--font-mono); font-size: 12px; color: var(--muted); margin-top: 6px; }

.wave { display: flex; align-items: center; gap: 3px; height: 38px; flex: none; }
.wave i {
  display: block; width: 3px; height: 100%; border-radius: 3px; background: var(--ink);
  transform: scaleY(.16); transform-origin: 50% 50%; transition: background-color .3s;
}
.wave.is-guest i, .wave.is-ai i { animation: bar .9s ease-in-out infinite alternate; }
.wave.is-ai i { background: var(--red); }
@keyframes bar { 0% { transform: scaleY(.16); } 100% { transform: scaleY(var(--s, .8)); } }

.call__lines {
  position: relative; display: flex; flex-direction: column; justify-content: flex-start;
  height: 292px; overflow: hidden; scroll-behavior: smooth;
}
.call__lines.has-slip::after { content: ""; flex: none; height: var(--slip-room, 0px); }
.call__lines.is-scrolled { -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 44px); mask-image: linear-gradient(to bottom, transparent 0, #000 44px); }
.call__ring {
  position: absolute; left: 24px; right: 24px; top: 150px; z-index: 1;
  display: flex; flex-direction: column; align-items: center; gap: 4px; text-align: center;
  font-family: var(--font-display); font-size: 24px; letter-spacing: -.01em; line-height: 1.15;
  opacity: 0; transform: translateY(8px); transition: opacity .35s, transform .45s var(--ease); pointer-events: none;
}
.call__ring small { font-family: var(--font-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); margin-top: 6px; }
.call.is-ringing .call__ring { opacity: 1; transform: none; }
.call__ring-icon {
  position: relative; display: grid; place-items: center; width: 64px; height: 64px; margin-bottom: 14px; border-radius: 50%;
  background: #2FA35F; color: #fff;
}
.call__ring-icon svg { width: 28px; height: 28px; animation: ring 1.1s ease-in-out infinite; }
.call__ring-icon::before, .call__ring-icon::after {
  content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px solid #2FA35F; animation: ripple 1.6s var(--ease) infinite;
}
.call__ring-icon::after { animation-delay: .5s; }
@keyframes ripple { 0% { transform: scale(1); opacity: .8; } 100% { transform: scale(1.9); opacity: 0; } }
.cl { margin-top: 14px; flex: none; }
.cl:first-child { margin-top: 16px; }
.cl__who { display: block; font-family: var(--font-mono); font-size: 10.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); margin-bottom: 3px; }
.cl p { font-size: 15.5px; line-height: 1.42; }
.cl--ai { padding-left: 13px; box-shadow: inset 2.5px 0 0 var(--red); }
.cl--ai .cl__who { color: var(--red); }
.js .call__lines .cl { display: none; }
.js .call__lines .cl.is-on { display: block; }
.js .call__lines .w { opacity: .12; transition: opacity .18s; }
.js .call__lines .w.on { opacity: 1; }
.dots { display: inline-flex; gap: 4px; padding: 6px 0; }
.dots i { width: 6px; height: 6px; border-radius: 50%; background: var(--red); animation: dot 1s ease-in-out infinite; }
.dots i:nth-child(2) { animation-delay: .15s; } .dots i:nth-child(3) { animation-delay: .3s; }
@keyframes dot { 0%, 100% { opacity: .25; transform: translateY(0); } 50% { opacity: 1; transform: translateY(-3px); } }

/* potvrdenka z tlačiarne */
.slip {
  position: absolute; z-index: 2; right: -34px; bottom: 0; width: 236px;
  transform: rotate(4deg); filter: drop-shadow(0 18px 20px rgba(60, 40, 10, .22)) drop-shadow(0 2px 3px rgba(60, 40, 10, .15));
}
.slip__paper {
  background: #FFFEF9; padding: 18px 18px 26px; font-family: var(--font-mono); font-size: 11.5px; line-height: 1.35;
  -webkit-mask: conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) 50% / 12px 100%;
  mask: conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) 50% / 12px 100%;
}
.slip__hotel { text-align: center; font-weight: 700; font-size: 12.5px; letter-spacing: .12em; text-transform: uppercase; }
.slip__sub { text-align: center; color: var(--muted); margin: 2px 0 10px; padding-bottom: 10px; border-bottom: 1.5px dashed var(--line-2); }
.slip dl > div { display: flex; justify-content: space-between; gap: 10px; padding: 2.5px 0; }
.slip dt { color: var(--ink-2); }
.slip dd { font-weight: 700; text-align: right; }
.slip .slip__total { margin: 8px 0 6px; padding: 8px 0; border-block: 1.5px dashed var(--line-2); font-size: 14px; }
.slip__stamp { position: absolute; right: 10px; bottom: 26px; }
.js .slip { opacity: 0; }
.js .slip.is-printed { opacity: 1; }
.js .slip.is-printing { opacity: 1; }
.js .slip.is-printing .slip__paper { animation: print 1.5s steps(16, end) both; }
@keyframes print {
  0% { clip-path: inset(0 0 100% 0); transform: translateY(-40px); }
  100% { clip-path: inset(0 0 0 0); transform: translateY(0); }
}

/* pečiatky */
.stamp {
  display: inline-flex; flex-direction: column; align-items: center; gap: 2px;
  padding: 6px 12px 5px; border: 3px solid currentColor; border-radius: 8px;
  font-family: var(--font-mono); font-size: 19px; font-weight: 700; letter-spacing: .14em; line-height: 1; text-transform: uppercase;
  transform: rotate(-13deg); opacity: .88; mix-blend-mode: multiply;
  -webkit-mask-image: var(--ink-mask); mask-image: var(--ink-mask); -webkit-mask-size: 160px; mask-size: 160px;
  pointer-events: none;
}
.stamp small { font-size: 11px; letter-spacing: .1em; }
.stamp--green { color: var(--green); }
.stamp--red { color: var(--red); }
.stamp--big { font-size: 34px; padding: 10px 20px 8px; border-width: 4px; }
.js .slip__stamp { opacity: 0; }
.js .slip__stamp.is-on { animation: stamp .45s cubic-bezier(.3, 1.6, .5, 1) both; }
@keyframes stamp {
  0% { opacity: 0; transform: rotate(-4deg) scale(2.3); }
  100% { opacity: .88; transform: rotate(-13deg) scale(1); }
}

/* pozdravy: pás s jazykmi medzi „Dňom na recepcii“ a kalkulačkou */
.langs { padding-top: clamp(36px, 5vw, 56px); }
.langs + .bill { padding-top: clamp(70px, 9vw, 110px); }
.greet {
  display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 28px;
  padding: 18px 0 18px var(--gutter);
  border-block: 1.5px solid var(--ink);
}
@media (min-width: 1321px) { .greet { padding-left: calc((100vw - var(--wrap)) / 2 + var(--gutter)); } }
.greet__cap { font-family: var(--font-mono); font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; line-height: 1.5; color: var(--ink-2); }
.greet__rail { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.greet__track { display: flex; align-items: center; width: max-content; animation: marquee 42s linear infinite; }
.greet__track span { font-family: var(--font-display); font-style: italic; font-size: clamp(28px, 1.2rem + 1.6vw, 46px); font-weight: 350; letter-spacing: -.02em; white-space: nowrap; font-variation-settings: "opsz" 144, "SOFT" 100; }
.greet__track .cyr { font-family: "Iowan Old Style", "Times New Roman", serif; }
.greet__track i {
  width: 11px; height: 17px; margin: 0 26px; flex: none; background: var(--red);
  border-radius: 50% 50% 45% 45% / 36% 36% 64% 64%; transform: rotate(18deg);
  -webkit-mask: radial-gradient(circle at 50% 26%, #0000 2.2px, #000 2.8px); mask: radial-gradient(circle at 50% 26%, #0000 2.2px, #000 2.8px);
}
.greet:hover .greet__track { animation-play-state: paused; }
@keyframes marquee { to { transform: translateX(-50%); } }

/* ==========================================================================
   1 · DEŇ NA RECEPCII
   ========================================================================== */
.day {
  --sky: #E6E6EE;
  position: relative;
  height: calc(var(--steps, 6) * 58vh + 100vh);
  background: var(--grain), var(--sky);
  transition: background-color .2s linear;
}
.day__pin {
  position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden;
  display: flex; flex-direction: column; justify-content: center; justify-content: safe center;
  padding: calc(var(--nav-h) + 10px) 0 22px;
}
.day__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 40px; margin-bottom: clamp(18px, 3.4vh, 38px); }
.day__intro { max-width: 700px; }
.day .h2 { font-size: clamp(2rem, 1rem + 3vw, 4.1rem); }
.day__sub { font-size: 17px; color: var(--ink-2); margin-top: 14px; max-width: 34em; }
.day .kicker { margin-bottom: 16px; }

.clock { display: flex; align-items: flex-end; gap: 14px; flex: none; }
.clock__icon { width: 40px; height: 40px; margin-bottom: 14px; color: var(--red); }
.clock__icon svg { width: 100%; height: 100%; }
.clock__time {
  font-family: var(--font-display); font-weight: 330; font-size: clamp(4.2rem, 2.2rem + 5vw, 8.4rem); line-height: .8;
  letter-spacing: -.02em; font-variation-settings: "opsz" 144, "SOFT" 20; display: flex;
}
.clock__time span { display: inline-block; width: .6em; text-align: center; }
.clock__time b { font-weight: 330; width: .3em; text-align: center; animation: blink 1s steps(2, jump-none) infinite; }
.clock__phase { font-family: var(--font-mono); font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-2); margin-bottom: 12px; width: 7.5em; }

.day__viewport { position: relative; }
.day__track {
  --pad: max(var(--gutter), calc((100vw - var(--wrap)) / 2 + var(--gutter)));
  display: flex; align-items: stretch; gap: 22px; width: max-content; padding-left: var(--pad);
  will-change: transform;
}
.shift {
  position: relative; flex: none; width: clamp(290px, 29vw, 400px);
  display: flex; flex-direction: column; gap: 12px;
  background: var(--card); border-radius: 22px; padding: 22px 22px 18px;
  box-shadow: 0 0 0 1px var(--line), 0 20px 40px -30px rgba(60, 40, 10, .4);
  opacity: .55; transform: translateY(8px) scale(.985);
  transition: opacity .5s var(--ease), transform .6s var(--ease), box-shadow .5s;
}
.shift.is-active { opacity: 1; transform: none; box-shadow: 0 0 0 1.5px var(--ink), var(--shadow); }
.shift.is-past { opacity: .32; }
.shift__meta { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.shift__time { font-family: var(--font-mono); font-size: 13px; font-weight: 700; padding: 4px 8px; border-radius: 7px; background: var(--ink); color: var(--paper); }
.shift.is-active .shift__time { background: var(--red); color: #fff; }
.chip { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-mono); font-size: 11.5px; font-weight: 600; padding: 4px 10px; border-radius: 999px; box-shadow: inset 0 0 0 1px var(--line-2); }
.chip svg { width: 13px; height: 13px; }
.shift__title { font-family: var(--font-display); font-size: 25px; font-weight: 450; line-height: 1.08; letter-spacing: -.02em; font-variation-settings: "opsz" 72, "SOFT" 50; }
.shift__ctx { font-size: 14.5px; line-height: 1.45; color: var(--ink-2); }

.bubbles { display: flex; flex-direction: column; gap: 8px; margin-top: 2px; }
.bubble { max-width: 90%; padding: 10px 14px; font-size: 14.5px; line-height: 1.4; border-radius: 16px; }
.bubble--guest { align-self: flex-start; background: var(--paper-2); border-bottom-left-radius: 5px; }
.bubble--ai { align-self: flex-end; background: var(--ink); color: #FBF6EC; border-bottom-right-radius: 5px; }
.bubble--short { padding: 8px 14px; }
.js .day:not(.is-static) .shift:not(.is-seen) .bubble,
.js .day:not(.is-static) .shift:not(.is-seen) .lines li { opacity: 0; transform: translateY(10px); }
.shift .bubble, .shift .lines li { transition: opacity .45s var(--ease), transform .55s var(--ease); }
.shift.is-seen .bubble:nth-child(2), .shift.is-seen .lines li:nth-child(2) { transition-delay: .45s; }
.shift.is-seen .bubble:nth-child(3), .shift.is-seen .lines li:nth-child(3) { transition-delay: .9s; }

.lines { display: flex; flex-direction: column; gap: 6px; }
.lines li { display: grid; grid-template-columns: auto 1fr; gap: 2px 10px; align-items: baseline; padding: 9px 12px; border-radius: 12px; background: var(--paper); font-size: 14px; }
.lines__no { font-family: var(--font-mono); font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); grid-row: span 2; }
.lines b { font-family: var(--font-mono); font-size: 11px; letter-spacing: .04em; color: var(--green); }
.lines b.is-handoff { color: var(--red); }

.shift__result {
  display: flex; align-items: center; gap: 8px; margin-top: auto; padding-top: 12px; border-top: 1.5px dashed var(--line-2);
  font-family: var(--font-mono); font-size: 12px; font-weight: 600; color: var(--green);
}
.shift__result svg { width: 17px; height: 17px; flex: none; padding: 2px; border-radius: 50%; background: var(--green); color: #fff; }

.shift-cta {
  flex: none; width: clamp(290px, 29vw, 400px); display: flex; flex-direction: column; justify-content: flex-end; gap: 14px;
  padding: 26px 24px 24px; border-radius: 22px; color: #fff;
  background: radial-gradient(circle at 90% 0%, rgba(255, 190, 150, .45), transparent 55%), var(--red);
  box-shadow: 0 24px 40px -26px rgba(150, 40, 10, .7);
}
.shift-cta__kicker { font-family: var(--font-mono); font-size: 11.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; opacity: .85; margin-bottom: auto; }
.shift-cta__title { font-family: var(--font-display); font-size: clamp(2rem, 1.3rem + 1.6vw, 2.9rem); font-weight: 380; line-height: 1; letter-spacing: -.03em; font-variation-settings: "opsz" 144, "SOFT" 40; }
.shift-cta__title em { font-style: italic; color: #FFE3C8; font-variation-settings: "opsz" 144, "SOFT" 100; }
.shift-cta__text { font-size: 15.5px; line-height: 1.45; }
.shift-cta .btn { align-self: flex-start; margin-top: 6px; }

.ruler { margin-top: clamp(18px, 3.2vh, 34px); }
.ruler__sky {
  height: 6px; border-radius: 6px;
  background: linear-gradient(90deg, #9AA3C7 0%, #B9B7D6 18%, #F2B38E 27%, #F6D98E 40%, #F4E7B8 50%, #F6D98E 62%, #EE9C73 76%, #B7A6CE 86%, #9AA3C7 100%);
}
.ruler__scale { position: relative; height: 36px; }
.ruler__scale .tick { position: absolute; top: 0; width: 1px; height: 7px; background: var(--line-2); }
.ruler__scale .tick.is-major { height: 12px; background: var(--ink); }
.ruler__scale .tick span { position: absolute; top: 15px; left: 50%; transform: translateX(-50%); font-family: var(--font-mono); font-size: 10.5px; color: var(--muted); }
.ruler__scale .ev {
  position: absolute; top: -12px; width: 18px; height: 18px; margin-left: -9px; padding: 0; border: 0; border-radius: 50%;
  background: var(--card); box-shadow: inset 0 0 0 2px var(--ink); cursor: pointer; transition: background-color .3s, transform .3s var(--ease);
}
.ruler__scale .ev.is-done { background: var(--ink); }
.ruler__scale .ev:hover { transform: scale(1.2); }
.ruler__marker { position: absolute; top: -30px; width: 2px; height: 52px; margin-left: -1px; background: var(--red); z-index: 2; pointer-events: none; }
.ruler__marker::before { content: ""; position: absolute; top: -6px; left: 50%; width: 12px; height: 12px; margin-left: -6px; border-radius: 50%; background: var(--red); box-shadow: 0 0 0 4px rgba(217, 61, 20, .2); }

/* ==========================================================================
   2 · KALKULAČKA
   ========================================================================== */
.bill { padding: clamp(90px, 12vw, 150px) 0; }
.bill__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(40px, 7vw, 100px); align-items: start; }
.sliders { margin: 40px 0 44px; display: grid; gap: 30px; }
.range { display: block; }
.range__top { display: flex; justify-content: space-between; align-items: baseline; gap: 20px; margin-bottom: 8px; font-size: 16px; color: var(--ink-2); }
.range output { font-family: var(--font-display); font-size: 34px; font-weight: 450; letter-spacing: -.02em; color: var(--ink); line-height: 1; white-space: nowrap; font-variant-numeric: tabular-nums; }
.range input {
  --fill: 20%;
  -webkit-appearance: none; appearance: none; width: 100%; height: 30px; margin: 0; background: transparent; cursor: pointer;
}
.range input::-webkit-slider-runnable-track { height: 4px; border-radius: 4px; background: linear-gradient(90deg, var(--red) 0 var(--fill), var(--line-2) var(--fill)); }
.range input::-moz-range-track { height: 4px; border-radius: 4px; background: var(--line-2); }
.range input::-moz-range-progress { height: 4px; border-radius: 4px; background: var(--red); }
.range input::-webkit-slider-thumb {
  -webkit-appearance: none; width: 28px; height: 28px; margin-top: -12px; border-radius: 50%;
  background: var(--card); border: 2.5px solid var(--ink); box-shadow: 0 4px 10px rgba(60, 40, 10, .25); transition: transform .2s var(--ease);
}
.range input::-moz-range-thumb { width: 24px; height: 24px; border-radius: 50%; background: var(--card); border: 2.5px solid var(--ink); box-shadow: 0 4px 10px rgba(60, 40, 10, .25); }
.range input:active::-webkit-slider-thumb { transform: scale(1.15); background: var(--red); border-color: var(--red); }
.range input:focus-visible { outline: none; }
.range input:focus-visible::-webkit-slider-thumb { box-shadow: 0 0 0 4px rgba(217, 61, 20, .35); }

.folio-wrap { position: sticky; top: calc(var(--nav-h) + 30px); }
.folio-shadow { filter: drop-shadow(0 30px 34px rgba(60, 40, 10, .2)) drop-shadow(0 3px 4px rgba(60, 40, 10, .12)); transform: rotate(1.2deg); }
.folio {
  position: relative; background: #FFFEF8; padding: 36px clamp(22px, 3vw, 38px) 46px; font-family: var(--font-mono); font-size: 13.5px;
  -webkit-mask: conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) 50% / 16px 100%;
  mask: conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) 50% / 16px 100%;
}
.folio__head { text-align: center; padding-bottom: 18px; border-bottom: 1.5px dashed var(--line-2); }
.folio__title { font-weight: 700; letter-spacing: .16em; text-transform: uppercase; font-size: 12.5px; }
.folio__guest { color: var(--muted); margin-top: 4px; }
.folio__guest span { color: var(--ink); font-weight: 600; }
.folio__rows > div { display: flex; justify-content: space-between; gap: 16px; padding: 13px 0; border-bottom: 1.5px dotted var(--line-2); }
.folio__rows dt { color: var(--ink-2); }
.folio__rows dd { font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
.folio__total { display: grid; gap: 6px; padding: 26px 0 24px; }
.folio__total > span { font-weight: 700; letter-spacing: .14em; text-transform: uppercase; font-size: 12px; }
.folio__total strong {
  font-family: var(--font-display); font-weight: 400; font-size: clamp(3rem, 2rem + 3vw, 5.2rem); line-height: .95; letter-spacing: -.035em;
  color: var(--red); font-variant-numeric: tabular-nums; font-variation-settings: "opsz" 144, "SOFT" 30;
}
.folio__total small { color: var(--ink-2); font-size: 13px; }
.folio__total small span { font-weight: 700; color: var(--ink); }
.folio__vs { display: grid; gap: 8px; padding: 14px 16px; border-radius: 12px; background: var(--paper); }
.folio__vs > div { display: flex; justify-content: space-between; gap: 12px; }
.folio__vs span { color: var(--ink-2); }
.folio__vs b { white-space: nowrap; }
.folio__vs b[data-f="payback"] { color: var(--green); }
.folio__vs.is-poor b[data-f="payback"] { color: var(--red); }
.folio__total { position: relative; }
.folio__stamp { position: absolute; right: -4px; top: 20px; font-size: 24px; transform: rotate(-16deg); }
.folio.is-bump .folio__total strong { animation: bump .5s var(--ease); }
@keyframes bump { 40% { transform: scale(1.03); } }

/* ==========================================================================
   3 · CENNÍK
   ========================================================================== */
.rates { padding: clamp(90px, 12vw, 150px) 0 clamp(70px, 8vw, 100px); background: var(--grain), var(--paper-2); }
.rates__head { max-width: 820px; margin-bottom: clamp(40px, 5vw, 60px); }

/* balíky v stĺpcoch: lístky ako na recepcii */
.plans__kicker { font-family: var(--font-mono); font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-2); margin-bottom: 30px; }
.plans { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; align-items: stretch; }
.plan {
  --pad-x: 24px;
  position: relative; display: flex; flex-direction: column; gap: 14px; padding: 26px var(--pad-x) 24px; border-radius: 20px;
  background: #FFFEF8; transition: transform .45s var(--ease);
}
.plan:hover { transform: translateY(-6px); }

.plan__head { display: grid; gap: 10px; }
.plan__name { font-family: var(--font-mono); font-size: 13px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
.plan__flag {
  position: absolute; top: 22px; right: 20px; transform: rotate(-3deg);
  padding: 5px 11px; border-radius: 999px; background: var(--red); color: #fff; white-space: nowrap;
  font-family: var(--font-mono); font-size: 10.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
}

.plan__price { display: flex; align-items: baseline; gap: 4px; line-height: 1; white-space: nowrap; }
.plan__num { font-family: var(--font-display); font-size: clamp(3.4rem, 2rem + 2.2vw, 4.6rem); font-weight: 400; letter-spacing: -.045em; font-variation-settings: "opsz" 144, "SOFT" 40; }
.plan__cur { font-family: var(--font-display); font-size: 1.9rem; font-weight: 400; margin-left: 2px; }
.plan__price small { font-family: var(--font-sans); font-size: 14.5px; font-weight: 500; color: var(--ink-2); margin-left: 4px; }
.plan__price .plan__od { margin: 0 6px 0 0; }
.plan__tagline { font-family: var(--font-display); font-size: 20px; font-weight: 450; line-height: 1.2; letter-spacing: -.01em; font-variation-settings: "opsz" 72, "SOFT" 50; }
.plan__who { font-size: 14.5px; line-height: 1.45; color: var(--ink-2); }

/* odtrhávacia čiara s výrezmi ako na lístku */
.plan__tiles {
  position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px;
  margin: 6px 0 0; padding-top: 18px;
}
.plan__tiles::before {
  content: ""; position: absolute; top: -2px; left: calc(var(--pad-x) * -1 + 13px); right: calc(var(--pad-x) * -1 + 13px);
  border-top: 2px dashed var(--line-2);
}
.plan__tiles > div { display: flex; flex-direction: column-reverse; justify-content: flex-end; gap: 3px; padding: 10px 8px; border-radius: 12px; background: var(--paper); text-align: center; }
.plan__tiles dd { font-family: var(--font-display); font-size: 19px; font-weight: 450; line-height: 1.05; letter-spacing: -.01em; overflow-wrap: anywhere; }
.plan__tiles dt { font-family: var(--font-mono); font-size: 9.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-2); line-height: 1.3; }

.plan__feats { display: grid; align-content: start; gap: 9px; margin-bottom: 10px; font-size: 14.5px; line-height: 1.4; color: var(--ink-2); }
.plan__feats li { position: relative; padding-left: 24px; }
.plan__feats li::before {
  content: ""; position: absolute; left: 0; top: 2px; width: 16px; height: 16px; border-radius: 50%; background: var(--red)
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6 12.5 4 4L18 8' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 11px no-repeat;
}
.plan__feats b { color: var(--ink); }
.plan__cta { margin-top: auto; width: 100%; --h: 52px; font-size: 16px; }

@supports (grid-template-rows: subgrid) {
  @media (min-width: 821px) {
    .plans { row-gap: 0; }
    .plan { display: grid; grid-row: span 7; grid-template-rows: subgrid; align-content: start; }
    .plan__cta { align-self: end; }
  }
}

/* odporúčaný balík: tmavý lístok */
.plan--star { background: var(--ink); color: var(--paper); }
.plan--star .plan__price small, .plan--star .plan__who, .plan--star .plan__feats, .plan--star .plan__tiles dt { color: rgba(244, 238, 227, .72); }
.plan--star .plan__feats b { color: var(--paper); }
.plan--star .plan__tagline { color: #FFE3C8; }
.plan--star .plan__tiles::before { border-color: rgba(244, 238, 227, .28); }
.plan--star .plan__tiles > div { background: rgba(244, 238, 227, .08); }

/* na mieru: prerušovaný rám */
.plan--custom { background: transparent; box-shadow: inset 0 0 0 1.5px var(--line-2); }
.plan--custom:hover { box-shadow: inset 0 0 0 1.5px var(--ink); }
/* lem výrezov rovnakou čiarou ako okraj karty (maska nechá len vnútorný polkruh) */
.plan--custom::before, .plan--custom::after {
  content: ""; position: absolute; top: calc(var(--cut, -100px) - 13.5px); width: 27px; height: 27px; border-radius: 50%;
  box-shadow: inset 0 0 0 1.5px var(--line-2); pointer-events: none; transition: box-shadow .45s var(--ease);
}
.plan--custom::before { left: -13.5px; }
.plan--custom::after { right: -13.5px; }
.plan--custom:hover::before, .plan--custom:hover::after { box-shadow: inset 0 0 0 1.5px var(--ink); }
.plan--custom .plan__tiles > div { background: rgba(255, 254, 248, .6); }
.plan--custom .plan__tiles dd { font-size: 14px; overflow-wrap: normal; hyphens: manual; }
.plan--custom .plan__feats li::before { background-color: var(--ink); }

/* chatbot: vodorovný lístok s odtrhávacou čiarou */
.chatplan {
  position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, 340px); align-items: stretch;
  border-radius: 20px; background: #FFFEF8;
}
.chatplan-wrap { margin-top: 34px; }
.chatplan__info { display: grid; align-content: start; gap: 12px; padding: 28px 32px; }
.chatplan__title { font-family: var(--font-display); font-size: clamp(22px, 1rem + .9vw, 28px); font-weight: 450; line-height: 1.15; letter-spacing: -.015em; font-variation-settings: "opsz" 72, "SOFT" 50; max-width: 22em; }
.chatplan__text { font-size: 15.5px; line-height: 1.5; color: var(--ink-2); max-width: 36em; }
.chatplan__channels { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.chatplan__channels li { padding: 7px 12px; border-radius: 10px; box-shadow: inset 0 0 0 1.5px var(--line-2); color: var(--ink-2); font-family: var(--font-mono); font-size: 12px; font-weight: 600; letter-spacing: .04em; }
.chatplan__channels li.is-included { background: var(--ink); box-shadow: none; color: var(--paper); }
.chatplan__feats { margin: 2px 0 4px; }
.chatplan__side { position: relative; display: grid; align-content: center; gap: 12px; padding: 28px 30px; }
.chatplan__side::before { content: ""; position: absolute; top: 13px; bottom: 13px; left: -1px; border-left: 2px dashed var(--line-2); }
.chatplan .plan__num { font-size: clamp(2.8rem, 2rem + 1.4vw, 3.6rem); }
.chatplan .plan__cur { font-size: 1.5rem; }
.chatplan__fine { font-family: var(--font-mono); font-size: 12px; color: var(--ink-2); }
.chatplan__deal { padding: 9px 12px; border-radius: 10px; background: var(--red-soft); color: #8E2708; font-size: 14px; line-height: 1.4; }
.chatplan .plan__cta { margin-top: 4px; }

.rates__fine { margin-top: 18px; font-family: var(--font-mono); font-size: 12.5px; color: var(--ink-2); }

.rates__extras { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: clamp(40px, 6vw, 90px); align-items: center; margin-top: clamp(60px, 8vw, 100px); }
.rack__title, .guestbook__title { font-family: var(--font-mono); font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-2); margin-bottom: 22px; }
.rack__tags { display: flex; flex-wrap: wrap; gap: 14px 12px; }
.rack__tags li { --r: -2deg; filter: drop-shadow(0 6px 8px rgba(60, 40, 10, .14)); transform: rotate(var(--r)); transform-origin: 14px 50%; transition: transform .6s cubic-bezier(.3, 1.7, .5, 1); }
.rack__tags li:nth-child(3n + 2) { --r: 2.2deg; }
.rack__tags li:nth-child(3n) { --r: -.8deg; }
.rack__tags li:hover { transform: rotate(calc(var(--r) * -3)); }
.rack__tags span {
  position: relative; display: block; padding: 11px 18px 11px 34px; font-size: 15px; font-weight: 600;
  background: var(--card); clip-path: polygon(15px 0, 100% 0, 100% 100%, 15px 100%, 0 50%);
}
.rack__tags span::before {
  content: ""; position: absolute; left: 13px; top: 50%; width: 9px; height: 9px; margin-top: -4.5px; border-radius: 50%;
  background: var(--paper-2); box-shadow: inset 0 1px 2px rgba(0, 0, 0, .35), 0 0 0 2.5px var(--brass);
}
.rack__tags li:nth-child(4n + 1) span { background: #FFF8EA; }
.rack__tags li:nth-child(5) span { background: var(--red); color: #fff; }

.guarantee { max-width: 30em; }
@keyframes spin { to { transform: rotate(360deg); } }
.guarantee h3 { font-family: var(--font-display); font-size: 28px; font-weight: 450; line-height: 1.1; letter-spacing: -.02em; margin-bottom: 8px; }
.guarantee p { font-size: 16px; color: var(--ink-2); }
.guarantee p a { color: var(--ink); font-weight: 700; white-space: nowrap; text-underline-offset: 3px; }

.guestbook { margin-top: clamp(60px, 8vw, 100px); }
/* skutočný výsledok klienta */
.proof { margin-top: clamp(60px, 8vw, 100px); }
.proof__card {
  display: flex; align-items: center; gap: clamp(24px, 5vw, 72px); padding: clamp(28px, 4vw, 52px) clamp(24px, 4vw, 56px);
  border-radius: 24px; color: #fff;
  background: radial-gradient(circle at 12% 0%, rgba(255, 190, 150, .35), transparent 45%), var(--red);
  box-shadow: 0 30px 60px -34px rgba(150, 40, 10, .75);
}
.proof__num {
  flex: none; font-family: var(--font-display); font-weight: 400; font-size: clamp(3.6rem, 2rem + 5vw, 7rem); line-height: .9;
  letter-spacing: -.04em; color: #FFE3C8; font-variation-settings: "opsz" 144, "SOFT" 40; white-space: nowrap;
}
.proof__num b { display: inline-block; font-weight: inherit; font-variant-numeric: tabular-nums; }
.proof__num span { display: block; font-family: var(--font-mono); font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: rgba(255, 255, 255, .85); margin-top: 10px; }
.proof__text { font-family: var(--font-display); font-size: clamp(20px, 1rem + .8vw, 28px); font-weight: 400; line-height: 1.3; letter-spacing: -.01em; max-width: 30em; }
.proof__text b { font-weight: 500; color: #FFE3C8; }
.proof__sig { margin-top: 14px; font-family: var(--font-mono); font-size: 12.5px; color: rgba(255, 255, 255, .8); }
.guestbook__notes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 3vw, 36px); }
.note-card {
  --r: -1.4deg;
  position: relative; padding: 30px 24px 22px 46px; transform: rotate(var(--r));
  background:
    linear-gradient(90deg, transparent 32px, rgba(217, 61, 20, .35) 32px 33.5px, transparent 33.5px),
    repeating-linear-gradient(180deg, transparent 0 31px, rgba(60, 90, 140, .16) 31px 32px),
    #FFFDF6;
  background-position: 0 0, 0 14px, 0 0;
  box-shadow: 0 18px 30px -22px rgba(60, 40, 10, .45), 0 0 0 1px var(--line);
  transition: transform .5s var(--ease);
}
.note-card:nth-child(2) { --r: 1.1deg; margin-top: 18px; }
.note-card:nth-child(3) { --r: -.6deg; }
.note-card:hover { transform: rotate(0) translateY(-4px); }
.note-card::before {
  content: ""; position: absolute; top: -12px; left: 50%; width: 92px; height: 26px; margin-left: -46px;
  background: rgba(233, 214, 170, .75); transform: rotate(-3deg); box-shadow: 0 1px 2px rgba(0, 0, 0, .08);
}
.note-card blockquote { font-family: var(--font-hand); font-size: 27px; font-weight: 500; line-height: 1.18; color: #22303F; }
.note-card__sig { margin-top: 18px; font-weight: 700; font-size: 15px; }
.note-card__sig span { display: block; font-family: var(--font-mono); font-size: 11.5px; font-weight: 400; color: var(--muted); margin-top: 2px; }

/* ==========================================================================
   4 · OTÁZKY
   ========================================================================== */
.faq { padding: clamp(90px, 12vw, 150px) 0; }
.faq__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(40px, 7vw, 100px); align-items: start; }
.faq__side { position: sticky; top: calc(var(--nav-h) + 30px); }
.faq__hint { margin-top: 26px; font-size: 16px; color: var(--ink-2); max-width: 26em; }
.faq__hint a { color: var(--red); font-weight: 700; text-decoration-thickness: 1.5px; text-underline-offset: 3px; white-space: nowrap; }
.faq__list { border-top: 2px solid var(--ink); }
.faq details { border-bottom: 1.5px solid var(--line-2); }
.faq summary {
  position: relative; list-style: none; cursor: pointer; padding: 24px 64px 24px 0;
  font-family: var(--font-display); font-size: clamp(20px, 1rem + .7vw, 26px); font-weight: 420; line-height: 1.2; letter-spacing: -.015em;
  font-variation-settings: "opsz" 72, "SOFT" 50; transition: color .25s;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after {
  content: ""; position: absolute; right: 4px; top: 50%; width: 38px; height: 38px; margin-top: -19px; border-radius: 50%;
  box-shadow: inset 0 0 0 1.5px var(--ink);
  background:
    linear-gradient(var(--ink), var(--ink)) center / 14px 1.8px no-repeat,
    linear-gradient(var(--ink), var(--ink)) center / 1.8px 14px no-repeat;
  transition: transform .45s var(--ease), background-color .3s;
}
.faq summary:hover { color: var(--red); }
.faq details[open] summary::after {
  transform: rotate(135deg); background-color: var(--red); box-shadow: none;
  background-image: linear-gradient(#fff, #fff), linear-gradient(#fff, #fff);
}
.faq details p { padding: 0 64px 26px 0; font-size: 16.5px; line-height: 1.6; color: var(--ink-2); max-width: 40em; }
.faq details::details-content { block-size: 0; overflow: hidden; transition: block-size .45s var(--ease), content-visibility .45s allow-discrete; }
.faq details[open]::details-content { block-size: auto; }

/* ==========================================================================
   5 · REZERVÁCIA
   ========================================================================== */
.book {
  position: relative; padding: clamp(90px, 11vw, 140px) 0; color: #fff;
  background: var(--red);
  background-image: radial-gradient(circle at 12% 0%, rgba(255, 190, 150, .35), transparent 45%), var(--grain);
}
.book__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(40px, 6vw, 90px); align-items: center; }
.kicker--light { color: rgba(255, 255, 255, .85); }
.h2--xl { font-size: clamp(2.5rem, 1.2rem + 3.8vw, 5rem); }
.book .h2 em { color: #FFE3C8; }
.book .lead { color: #fff; }
.steps { margin-top: 40px; border-top: 1.5px solid rgba(255, 255, 255, .35); }
.steps li { display: grid; grid-template-columns: 64px 1fr; gap: 10px; padding: 18px 0; border-bottom: 1.5px solid rgba(255, 255, 255, .35); }
.steps b { font-family: var(--font-display); font-style: italic; font-weight: 400; font-size: 30px; line-height: 1; font-variation-settings: "opsz" 144, "SOFT" 100; color: #FFE3C8; }
.steps h3 { font-family: var(--font-display); font-weight: 450; font-size: 22px; line-height: 1.15; letter-spacing: -.01em; }
.steps p { font-size: 15.5px; margin-top: 4px; color: #fff; }
.scribble--book { margin-top: 28px; font-size: 28px; color: #FFE3C8; transform: rotate(-2deg); display: inline-block; }
.scribble--book a { color: inherit; text-underline-offset: 4px; white-space: nowrap; }

.card-form {
  position: relative; background: var(--card); color: var(--ink); border-radius: 20px;
  padding: clamp(22px, 3vw, 34px); box-shadow: 0 40px 80px -30px rgba(70, 15, 0, .6), 0 0 0 1px rgba(0, 0, 0, .05);
  transform: rotate(1.2deg); transition: transform .6s var(--ease);
}
.card-form:focus-within { transform: rotate(0); }
.card-form__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; padding-bottom: 16px; margin-bottom: 8px; border-bottom: 3px double var(--ink); }
.card-form__title { font-family: var(--font-mono); font-weight: 700; font-size: 15px; letter-spacing: .16em; text-transform: uppercase; }
.card-form__en { font-family: var(--font-display); font-style: italic; color: var(--muted); font-size: 15px; margin-top: 2px; }
.card-form__no { font-family: var(--font-mono); font-size: 13px; font-weight: 700; color: var(--red); padding: 5px 9px; border: 1.5px solid var(--red); border-radius: 7px; white-space: nowrap; }
.field { display: block; padding-top: 18px; border: 0; margin: 0; min-width: 0; }
.field > label, .field > legend {
  display: block; padding: 0; font-family: var(--font-mono); font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-2); margin-bottom: 4px;
}
.field small { text-transform: none; letter-spacing: 0; font-weight: 400; color: var(--muted); }
.field input {
  width: 100%; padding: 8px 0 9px; border: 0; border-bottom: 1.5px solid var(--line-2); border-radius: 0; background: transparent;
  font-size: 18px; transition: border-color .25s, box-shadow .25s;
}
.field input::placeholder { color: #BDB4A4; }
.field input:focus { outline: none; border-color: var(--red); box-shadow: 0 1.5px 0 var(--red); }
.field input[aria-invalid="true"] { border-color: var(--red); }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 22px; }
.field--chips legend { float: left; width: 100%; margin-bottom: 10px; }
.field--chips .chips { clear: both; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chips label { position: relative; cursor: pointer; }
.chips input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.chips span {
  display: inline-block; padding: 8px 15px; border-radius: 999px; font-size: 15px; font-weight: 600;
  box-shadow: inset 0 0 0 1.5px var(--line-2); transition: background-color .2s, color .2s, box-shadow .2s;
}
.chips label:hover span { box-shadow: inset 0 0 0 1.5px var(--ink); }
.chips input:checked + span { background: var(--ink); color: var(--paper); box-shadow: none; }
.chips input:focus-visible + span { outline: 2.5px solid var(--red); outline-offset: 2px; }
.card-form .btn { margin-top: 26px; }
.card-form .btn[disabled] { opacity: .7; cursor: progress; }
.card-form__fine { margin-top: 14px; font-size: 12.5px; line-height: 1.5; color: var(--muted); }
.card-form__fine a { color: var(--ink-2); white-space: nowrap; }
.form-error { margin-top: 16px; padding: 10px 14px; border-radius: 10px; background: var(--red-soft); color: #8E2708; font-size: 14.5px; font-weight: 600; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.card-form__done { text-align: center; padding: 40px 10px 20px; }
.card-form__done .stamp { opacity: .9; margin-bottom: 26px; animation: stamp .5s cubic-bezier(.3, 1.6, .5, 1) both; }
.card-form__done h3 { font-family: var(--font-display); font-weight: 400; font-size: 40px; letter-spacing: -.02em; line-height: 1.05; }
.card-form__done p { margin: 12px auto 0; max-width: 26em; color: var(--ink-2); }

/* ==========================================================================
   6 · KONTAKT
   ========================================================================== */
.contact { padding: clamp(80px, 10vw, 130px) 0 clamp(20px, 3vw, 40px); }
.contact__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(40px, 6vw, 90px); align-items: end; }
.contact__list { border-top: 2px solid var(--ink); }
.contact__list li { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; flex-wrap: wrap; padding: 22px 0; border-bottom: 1.5px solid var(--line-2); }
.contact__label { font-family: var(--font-mono); font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-2); }
.contact__value {
  font-family: var(--font-display); font-size: clamp(22px, 1rem + 1.2vw, 32px); font-weight: 420; letter-spacing: -.015em;
  text-decoration: none; transition: color .25s; font-variation-settings: "opsz" 72, "SOFT" 50; overflow-wrap: anywhere;
}
.contact__value:hover { color: var(--red); }

/* ==========================================================================
   PÄTA
   ========================================================================== */
.foot { padding: clamp(40px, 5vw, 64px) 0 28px; overflow: hidden; }
.foot__cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px; padding: 36px 0; border-top: 1.5px solid var(--ink); font-size: 15.5px; color: var(--ink-2); }
.foot__cols a { display: block; text-decoration: none; margin-bottom: 4px; color: var(--ink); font-weight: 600; }
.foot__cols a:hover { color: var(--red); }
.foot__reg { margin: 6px 0 10px; font-size: 13px; line-height: 1.45; color: var(--muted); }
.foot__label { font-family: var(--font-mono); font-size: 11.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); margin-bottom: 12px; }
.foot__copy { font-family: var(--font-mono); font-size: 12px; color: var(--muted); padding-top: 16px; border-top: 1px solid var(--line); }

/* ==========================================================================
   MOBILNÁ LIŠTA
   ========================================================================== */
.mbar {
  position: fixed; left: 10px; right: 10px; bottom: max(10px, env(safe-area-inset-bottom)); z-index: 45;
  display: none; align-items: center; gap: 8px; padding: 6px; border-radius: 999px;
  background: rgba(255, 252, 245, .94); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  box-shadow: 0 0 0 1px var(--line), 0 16px 30px -12px rgba(60, 40, 10, .45);
  transform: translateY(160%); transition: transform .5s var(--ease);
}
.mbar.is-visible { transform: none; }
.mbar__num { display: inline-flex; align-items: center; gap: 8px; padding: 0 10px 0 14px; font-family: var(--font-mono); font-size: 14px; font-weight: 700; color: var(--ink); text-decoration: none; white-space: nowrap; }
.mbar .btn svg { width: 18px; height: 18px; flex: none; }
.mbar .btn { flex: 1; min-width: 0; gap: 8px; padding: 0 16px; }
.mbar .btn::before { display: none; }

/* ==========================================================================
   Objavovanie pri skrolovaní
   ========================================================================== */
.js [data-reveal] .wd { display: inline-block; opacity: 0; transform: translateY(.45em) rotate(2deg); transition: opacity .7s var(--ease), transform .9s var(--ease); transition-delay: calc(var(--i) * 45ms); }
.js [data-reveal].is-in .wd { opacity: 1; transform: none; }

/* ==========================================================================
   RESPONZIVITA
   ========================================================================== */
/* hero sa na desktope zmestí na jednu obrazovku aj na nižších notebookoch */
@media (min-width: 981px) {
  .hero { display: flex; flex-direction: column; min-height: 100vh; min-height: 100svh; padding-top: calc(var(--nav-h) + clamp(12px, 3.6vh, 64px)); }
  .hero__grid { flex: 1; }
  .hero__title { font-size: clamp(2.8rem, min(1.2rem + 5.4vw, 10.4vh + 1rem), 6.1rem); }
  .board { margin-bottom: clamp(12px, 2.6vh, 30px); }
  .flap { --fh: clamp(30px, 4.8vh, 36px); }
  .hero__lead { margin: clamp(12px, 2.4vh, 30px) 0 clamp(16px, 3.2vh, 34px); }
  .hero__stage { padding: clamp(10px, 2.6vh, 34px) 0 clamp(110px, 19vh, 186px); }
  .call__lines { height: clamp(180px, 31vh, 292px); }
}
@media (min-width: 981px) and (max-height: 800px) {
  .hero__lead { font-size: 16.5px; line-height: 1.46; }
  .tryema__top { margin-bottom: 6px; }
  .dial__tips { margin-top: 8px; }
}
@media (min-width: 981px) and (max-height: 660px) {
  .hero__title { font-size: clamp(2.8rem, min(1.2rem + 5.4vw, 9.4vh + 1rem), 6.1rem); }
}

@media (max-width: 1180px) {
  .nav__links { gap: 22px; }
}

@media (max-width: 980px) {
  .hero__grid { grid-template-columns: 1fr; }
  .hero__stage { max-width: 520px; width: 100%; margin: 10px auto 0; padding-bottom: 150px; }
  .fob { left: -14px; top: 6px; width: 60px; }
  .rates__extras { grid-template-columns: 1fr; }
  .plans { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 30px; }
}

@media (max-width: 820px) {
  :root { --nav-h: 62px; }
  body { font-size: 16px; }
  .nav__links { display: none; }
  .logo__img { height: 28px; }
  .mbar { display: flex; }

  .bill__grid, .faq__grid, .book__grid, .contact__grid { grid-template-columns: 1fr; }
  .contact__list li { flex-direction: column; align-items: flex-start; gap: 8px; }
  .folio-wrap, .faq__side { position: static; }
  .bill__copy .btn { display: none; }

  /* balíky vedľa seba na posúvanie prstom */
  .plans {
    grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: min(84%, 340px); gap: 12px;
    overflow-x: auto; scroll-snap-type: x mandatory; margin-inline: calc(var(--gutter) * -1); padding: 18px var(--gutter) 18px;
    scroll-padding-inline: var(--gutter); scrollbar-width: none;
  }
  .plans::-webkit-scrollbar { display: none; }
  .plan { scroll-snap-align: start; }
  .plans__kicker::after { content: " · potiahnite →"; font-weight: 400; letter-spacing: .06em; text-transform: none; color: var(--muted); }
  .chatplan { grid-template-columns: 1fr; }
  .chatplan__info { padding: 24px 22px; }
  .chatplan__side { padding: 22px; }
  .chatplan__side::before { top: -1px; bottom: auto; left: 13px; right: 13px; border-left: 0; border-top: 2px dashed var(--line-2); }

  .guestbook__notes { grid-template-columns: 1fr; gap: 26px; max-width: 460px; }
  .proof__card { flex-direction: column; align-items: flex-start; gap: 14px; }
  .proof__text { font-size: 16.5px; }
  .note-card:nth-child(2) { margin-top: 0; }

  .steps { margin-top: 30px; }
  .foot__cols { grid-template-columns: 1fr; gap: 24px; }
  .foot { padding-bottom: 96px; }

  /* deň na recepcii: kompaktnejší */
  .day { height: calc(var(--steps, 6) * 72vh + 100vh); }
  .day__pin { padding-bottom: calc(78px + env(safe-area-inset-bottom)); } /* miesto pre mobilnú lištu */
  .day__head { flex-direction: column; align-items: flex-start; gap: 10px; }
  .day__sub { display: none; }
  .clock { position: absolute; right: var(--gutter); top: calc(var(--nav-h) + 12px); gap: 8px; flex-direction: column; align-items: flex-end; }
  .clock__time { font-size: 3.6rem; }
  .clock__icon { display: none; }
  .clock__phase { margin: 0; width: auto; font-size: 11px; }
  .day .kicker { margin-bottom: 12px; }
  .day .h2 { font-size: clamp(1.9rem, 1rem + 4vw, 2.6rem); max-width: 9.5em; }
  .shift, .shift-cta { width: min(84vw, 380px); }
}

@media (max-width: 560px) {
  .hero__title { font-size: clamp(2.7rem, 1.2rem + 7.6vw, 3.6rem); line-height: .94; }
  .ring-pill { font-size: 12.5px; padding: 4px 12px 4px 4px; margin-left: .12em; }
  .tryema__top { margin-bottom: 8px; }
  .scribble--try { font-size: 21px; margin-right: 6px; }
  .scribble--try svg { display: none; }
  .dial { flex-wrap: wrap; gap: 12px 14px; padding: 14px; border-radius: 24px; }
  .dial__btn { --h: 56px; width: 100%; }
  .dial__tips q { font-size: 20px; }
  .flap { --fh: 30px; }
  .call { padding: 18px 18px 18px; border-radius: 22px; }
  .call__hotel { font-size: 23px; }
  .call__lines { height: 262px; }
  .cl p { font-size: 15px; }
  .wave { gap: 2px; }
  .wave i:nth-child(n + 15) { display: none; }
  .fob { display: none; }
  .slip { width: 214px; right: -4px; }
  .greet { grid-template-columns: 1fr; gap: 10px; padding-left: 0; }
  .greet__cap { padding-left: var(--gutter); }
  .greet__cap br { display: none; }
  .field-row { grid-template-columns: 1fr; }
  .card-form { transform: none; }
  .faq summary { padding-right: 54px; }
  .faq details p { padding-right: 0; }
  .range output { font-size: 28px; }
  .range__top { font-size: 15px; }
}

@media (max-width: 820px) and (max-height: 760px) {
  .shift__ctx { display: none; }
  .day .kicker { display: none; }
}
@media (max-height: 860px) and (min-width: 821px) {
  .day__sub { display: none; }
  .day .h2 { font-size: clamp(2rem, 1rem + 2.4vw, 3.4rem); }
  .clock__time { font-size: clamp(3.8rem, 2rem + 4vw, 6.6rem); }
}
@media (max-height: 740px) and (min-width: 821px) {
  .shift__ctx, .day .kicker { display: none; }
  .day__head { margin-bottom: 16px; }
  .shift { padding: 18px 20px 14px; gap: 10px; }
}

/* deň na recepcii: zhustenie, keď sa nezmestí na výšku (triedy pridáva JS) */
.day.fit-1 .day__sub { display: none; }
.day.fit-1 .day__head { margin-bottom: 14px; }
.day.fit-2 .shift__ctx, .day.fit-2 .kicker { display: none; }
.day.fit-3 .shift { padding: 16px 18px 12px; gap: 9px; }
.day.fit-3 .shift__title { font-size: 20px; }
.day.fit-3 .bubble { padding: 8px 12px; font-size: 13.5px; }
.day.fit-3 .bubbles { gap: 6px; }
.day.fit-3 .lines li { padding: 7px 10px; }
.day.fit-3 .ruler { margin-top: 12px; }
.day.fit-3 .shift-cta { padding: 20px; gap: 10px; }
.day.fit-3 .shift-cta__title { font-size: 1.9rem; }

/* ---------- menej pohybu ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
  .greet__track { animation: none; }
  .day { height: auto; }
  .day__pin { position: relative; height: auto; padding: 100px 0 60px; }
  .day__viewport { overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: max(var(--gutter), calc((100vw - var(--wrap)) / 2 + var(--gutter))); padding-bottom: 12px; }
  .day__track { padding-right: var(--gutter); }
  .shift { opacity: 1; transform: none; scroll-snap-align: start; }
  .ruler, .clock { display: none; }
}

/* ==========================================================================
   Lístky: priesvitné výrezy na odtrhávacej čiare
   ========================================================================== */
.plans, .chatplan-wrap { filter: drop-shadow(0 0 .6px rgba(27, 24, 19, .45)) drop-shadow(0 22px 22px rgba(60, 40, 10, .12)); }
[data-cut] { --cut: -100px; --r: 12px; }
[data-cut="y"] {
  -webkit-mask: radial-gradient(circle var(--r) at 0 var(--cut), #0000 calc(var(--r) - .5px), #000 var(--r)),
                radial-gradient(circle var(--r) at 100% var(--cut), #0000 calc(var(--r) - .5px), #000 var(--r));
  -webkit-mask-composite: source-in;
  mask: radial-gradient(circle var(--r) at 0 var(--cut), #0000 calc(var(--r) - .5px), #000 var(--r)),
        radial-gradient(circle var(--r) at 100% var(--cut), #0000 calc(var(--r) - .5px), #000 var(--r));
  mask-composite: intersect;
}
[data-cut="x"] {
  -webkit-mask: radial-gradient(circle var(--r) at var(--cut) 0, #0000 calc(var(--r) - .5px), #000 var(--r)),
                radial-gradient(circle var(--r) at var(--cut) 100%, #0000 calc(var(--r) - .5px), #000 var(--r));
  -webkit-mask-composite: source-in;
  mask: radial-gradient(circle var(--r) at var(--cut) 0, #0000 calc(var(--r) - .5px), #000 var(--r)),
        radial-gradient(circle var(--r) at var(--cut) 100%, #0000 calc(var(--r) - .5px), #000 var(--r));
  mask-composite: intersect;
}