:root {  --sc-canvas: #08090b;  --sc-surface: #101217;  --sc-ink: #f4f2ef;  --sc-ink-soft: #9a9ba1;  --sc-accent: #d8ff3e;  --sc-accent-ink: #08090b;  --sc-hairline: color-mix(in oklab, var(--sc-ink) 12%, transparent); --sc-hairline-strong: color-mix(in oklab, var(--sc-ink) 22%, transparent);  --sc-font-display: "Instrument Sans", "Geist", system-ui, sans-serif; --sc-font-text: "Geist", system-ui, sans-serif; --sc-font-mono: "Geist Mono", ui-monospace, monospace;  --sc-t-xs: clamp(0.75rem, 0.72rem + 0.15vw, 0.82rem); --sc-t-sm: clamp(0.875rem, 0.84rem + 0.18vw, 0.95rem); --sc-t-base: clamp(1rem, 0.96rem + 0.22vw, 1.125rem); --sc-t-lg: clamp(1.2rem, 1.1rem + 0.5vw, 1.5rem); --sc-t-xl: clamp(1.6rem, 1.35rem + 1.2vw, 2.25rem); --sc-t-2xl: clamp(2.1rem, 1.6rem + 2.4vw, 3.4rem); --sc-t-3xl: clamp(2.8rem, 1.9rem + 4.2vw, 5rem); --sc-t-4xl: clamp(3.4rem, 1.9rem + 6.6vw, 7.5rem); --sc-track-tight: -0.035em; --sc-track-snug: -0.02em; --sc-track-normal: -0.005em; --sc-track-wide: 0.08em; --sc-leading-none: 0.94; --sc-leading-tight: 1.06; --sc-leading-body: 1.62; --sc-measure: 62ch;  --sc-1: 0.25rem; --sc-2: 0.5rem; --sc-3: 0.75rem; --sc-4: 1rem; --sc-5: 1.5rem; --sc-6: 2rem; --sc-7: 3rem; --sc-8: 4rem; --sc-9: 6rem; --sc-10: 8rem; --sc-11: 12rem;  --sc-section: clamp(4.5rem, 9vw, 11rem); --sc-gutter: clamp(1.25rem, 5vw, 5.5rem); --sc-maxw: 82rem;  --sc-r-sm: 6px; --sc-r-md: 12px; --sc-r-lg: 20px; --sc-r-pill: 999px;  --sc-shadow-color: 220 40% 2%; --sc-e1: 0 1px 2px hsl(var(--sc-shadow-color) / 0.28), 0 2px 6px -1px hsl(var(--sc-shadow-color) / 0.20); --sc-e2: 0 2px 4px hsl(var(--sc-shadow-color) / 0.24), 0 8px 18px -4px hsl(var(--sc-shadow-color) / 0.30); --sc-e3: 0 4px 8px hsl(var(--sc-shadow-color) / 0.22), 0 18px 40px -8px hsl(var(--sc-shadow-color) / 0.38), 0 48px 90px -24px hsl(var(--sc-shadow-color) / 0.30);  --sc-edge: inset 0 1px 0 color-mix(in oklab, var(--sc-ink) 10%, transparent);  --sc-ease-out: cubic-bezier(0.23, 1, 0.32, 1); --sc-ease-in-out: cubic-bezier(0.77, 0, 0.175, 1); --sc-ease-drawer: cubic-bezier(0.32, 0.72, 0, 1); --sc-d-fast: 160ms; --sc-d-base: 240ms; --sc-d-slow: 420ms; --sc-z-stage: 1; --sc-z-copy: 20; --sc-z-chrome: 60; }  *, *::before, *::after { box-sizing: border-box; } html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; } @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } } body { margin: 0; background: var(--sc-canvas); color: var(--sc-ink); font-family: var(--sc-font-text); font-size: var(--sc-t-base); line-height: var(--sc-leading-body); letter-spacing: var(--sc-track-normal); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; font-synthesis-weight: none; overflow-x: clip; } img, video, canvas, svg { display: block; max-width: 100%; } button, input, select, textarea { font: inherit; color: inherit; }  ::selection { background: var(--sc-accent); color: var(--sc-accent-ink); } :root { caret-color: var(--sc-accent); accent-color: var(--sc-accent); } :focus-visible { outline: 2px solid var(--sc-accent); outline-offset: 3px; border-radius: var(--sc-r-sm); } :where(a) { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 0.22em; } @supports (scrollbar-color: auto) { html { scrollbar-color: color-mix(in oklab, var(--sc-ink) 26%, transparent) transparent; scrollbar-width: thin; } } :where(table, .sc-nums, [data-sc-count]) { font-variant-numeric: tabular-nums; }  .sc-display { font-family: var(--sc-font-display); font-weight: 500; line-height: var(--sc-leading-none); letter-spacing: var(--sc-track-tight); text-wrap: balance; margin: 0; } .sc-display--xl { font-size: var(--sc-t-4xl); } .sc-display--lg { font-size: var(--sc-t-3xl); } .sc-display--md { font-size: var(--sc-t-2xl); letter-spacing: var(--sc-track-snug); } .sc-lede { font-size: var(--sc-t-lg); line-height: 1.44; letter-spacing: var(--sc-track-snug); color: var(--sc-ink); max-width: 46ch; text-wrap: pretty; margin: 0; } .sc-body { max-width: var(--sc-measure); color: var(--sc-ink-soft); text-wrap: pretty; margin: 0; } .sc-label { font-family: var(--sc-font-mono); font-size: var(--sc-t-xs); letter-spacing: var(--sc-track-wide); text-transform: uppercase; color: var(--sc-ink-soft); }  .sc-wrap { width: 100%; max-width: var(--sc-maxw); margin-inline: auto; padding-inline: var(--sc-gutter); } .sc-section { padding-block: var(--sc-section); }  .sc-stack > * + * { margin-top: var(--sc-4); } .sc-stack > :is(h1,h2,h3) { margin-top: var(--sc-7); } .sc-stack > :is(h1,h2,h3):first-child { margin-top: 0; } .sc-rule { height: 1px; border: 0; background: var(--sc-hairline); margin: 0; }  .sc-act--pinned { position: relative; } .sc-stage { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: clip; z-index: var(--sc-z-stage); }  .sc-stage :is(video[data-sc-scrub], canvas[data-sc-sequence], .sc-stage__poster) { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; } video[data-sc-scrub] { opacity: 0; transition: opacity 380ms var(--sc-ease-out); } .sc-has-clip video[data-sc-scrub] { opacity: 1; }  .sc-stage__poster { z-index: 0; transition: opacity 380ms var(--sc-ease-out); } .sc-has-clip .sc-stage__poster { opacity: 0; }  .sc-scrim { position: absolute; inset: 0; pointer-events: none; z-index: 1; background: linear-gradient( var(--sc-scrim-angle, 180deg), color-mix(in oklab, var(--sc-canvas) var(--sc-scrim-a, 78%), transparent) 0%, color-mix(in oklab, var(--sc-canvas) 30%, transparent) 42%, transparent 68%); }  .sc-scrim--bottom { --sc-scrim-angle: 0deg; } .sc-scrim--left { --sc-scrim-angle: 90deg; } .sc-scrim--right { --sc-scrim-angle: 270deg; }  .sc-scrim--lead { background: linear-gradient(to top right, color-mix(in oklab, var(--sc-canvas) 94%, transparent) 0%, color-mix(in oklab, var(--sc-canvas) 72%, transparent) 30%, color-mix(in oklab, var(--sc-canvas) 30%, transparent) 52%, transparent 72%); } .sc-scrim--trail { background: linear-gradient(to top left, color-mix(in oklab, var(--sc-canvas) 94%, transparent) 0%, color-mix(in oklab, var(--sc-canvas) 72%, transparent) 30%, color-mix(in oklab, var(--sc-canvas) 30%, transparent) 52%, transparent 72%); }  .sc-scrim--band { background: linear-gradient(to top, color-mix(in oklab, var(--sc-canvas) 94%, transparent) 0%, color-mix(in oklab, var(--sc-canvas) 74%, transparent) 22%, color-mix(in oklab, var(--sc-canvas) 30%, transparent) 42%, transparent 58%); } .sc-scrim--vignette { background: radial-gradient(120% 90% at 50% 45%, transparent 40%, color-mix(in oklab, var(--sc-canvas) 70%, transparent) 100%); }  .sc-copy { position: absolute; z-index: var(--sc-z-copy); inset-inline: var(--sc-gutter); max-width: min(46rem, 76vw); will-change: opacity, transform; } .sc-copy--lead { left: var(--sc-gutter); bottom: clamp(3rem, 12vh, 9rem); }  .sc-copy--center { inset-inline: auto; left: 50%; top: 50%; translate: -50% -50%; text-align: center; } .sc-copy--trail { inset-inline: auto; right: var(--sc-gutter); bottom: clamp(3rem, 12vh, 9rem); text-align: right; }  [data-sc-cue] { opacity: 0; will-change: opacity, transform; } .sc-ready [data-sc-cue] { transition: none; }  .sc-split { display: inline-block; overflow: hidden; vertical-align: top; }  .sc-split--line { display: block; padding-bottom: 0.14em; margin-bottom: -0.14em; } .sc-split__i { display: inline-block; will-change: transform, opacity; } .sc-is-split { opacity: 1 !important; }  [data-sc-pan] { display: flex; will-change: transform; }  [data-sc-reveal] { will-change: clip-path; } [data-sc-parallax] { will-change: transform; }  [data-sc-in], [data-sc-stagger] > * { opacity: 0; transform: translate3d(0, 14px, 0); transition: opacity 620ms var(--sc-ease-out), transform 620ms var(--sc-ease-out); } [data-sc-in].sc-in, [data-sc-stagger] > .sc-in { opacity: 1; transform: none; }  [data-sc-tilt] { transform-style: preserve-3d; will-change: transform; } [data-sc-magnet] { will-change: transform; }  [data-sc-spotlight] { isolation: isolate; } :where([data-sc-spotlight]) { position: relative; } [data-sc-spotlight]::after { content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 2; background: radial-gradient( 28rem 28rem at calc(var(--sc-mx, 0.5) * 100%) calc(var(--sc-my, 0.5) * 100%), color-mix(in oklab, var(--sc-accent) 16%, transparent), transparent 70%); opacity: 0; transition: opacity var(--sc-d-slow) var(--sc-ease-out); } [data-sc-spotlight]:hover::after { opacity: 1; }  [data-sc-mode="worldflight"] { position: relative; } .sc-world { position: fixed; inset: 0; overflow: clip; z-index: var(--sc-z-stage); background: var(--sc-canvas); }  .sc-world__seg { position: absolute; inset: 0; opacity: 0; will-change: opacity; } .sc-world__seg > :is(video, img, canvas) { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }  .sc-world__poster { z-index: 0; transform-origin: 50% 50%; transition: opacity 420ms var(--sc-ease-out); } .sc-world__seg > video { z-index: 1; } .sc-world__seg.sc-has-clip .sc-world__poster { opacity: 0; }  video[data-sc-scrub].sc-has-clip { opacity: 1; }  .sc-world__copy { position: fixed; inset: 0; z-index: var(--sc-z-copy); pointer-events: none; } .sc-world__scrim { position: absolute; inset: 0; pointer-events: none; z-index: 0; } [data-sc-copy] { opacity: 0; pointer-events: none; will-change: opacity, transform; } .sc-ready [data-sc-copy] { transition: none; }  .sc-world__spacer { pointer-events: none; }  [data-sc-progress] { position: fixed; inset: 0 0 auto 0; height: 2px; z-index: var(--sc-z-chrome); background: var(--sc-accent); transform-origin: 0 50%; transform: scaleX(0); will-change: transform; }  .sc-grain { position: fixed; inset: 0; pointer-events: none; z-index: 3; opacity: 0.045; } .sc-grain::before { content: ""; position: absolute; inset: -50%; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3'/></filter><rect width='140' height='140' filter='url(/vendor/scrollcraft/%23n)'/></svg>"); }  @media (prefers-reduced-motion: reduce) {  [data-sc-in], [data-sc-stagger] > * { transform: none; transition-duration: 220ms; } [data-sc-parallax], [data-sc-pan], .sc-split__i { transform: none !important; }  [data-sc-reveal] { clip-path: none !important; }  [data-sc-act="pan"] .sc-stage, [data-sc-act="pan"] [data-sc-stage] { overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain; scroll-snap-type: x proximity; } [data-sc-pan] > * { scroll-snap-align: center; } [data-sc-spotlight]::after { display: none; }  .sc-world__poster, [data-sc-copy] { transform: none !important; } }  @media (max-width: 860px) { .sc-copy { inset-inline: var(--sc-gutter); max-width: none; } .sc-copy--trail { text-align: left; } .sc-stage { height: 100svh; }  .sc-scrim--trail { background: linear-gradient(to top, color-mix(in oklab, var(--sc-canvas) 94%, transparent) 0%, color-mix(in oklab, var(--sc-canvas) 74%, transparent) 22%, color-mix(in oklab, var(--sc-canvas) 30%, transparent) 42%, transparent 58%); } }  @font-face { font-family: 'Sentient'; src: url('/fonts/Sentient-400.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; } @font-face { font-family: 'Sentient'; src: url('/fonts/Sentient-500.woff2') format('woff2'); font-weight: 500; font-style: normal; font-display: swap; } @font-face { font-family: 'Sentient'; src: url('/fonts/Sentient-700.woff2') format('woff2'); font-weight: 700; font-style: normal; font-display: swap; } @font-face { font-family: 'Switzer'; src: url('/fonts/Switzer-300.woff2') format('woff2'); font-weight: 300; font-style: normal; font-display: swap; } @font-face { font-family: 'Switzer'; src: url('/fonts/Switzer-400.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; } @font-face { font-family: 'Switzer'; src: url('/fonts/Switzer-500.woff2') format('woff2'); font-weight: 500; font-style: normal; font-display: swap; } @font-face { font-family: 'Switzer'; src: url('/fonts/Switzer-600.woff2') format('woff2'); font-weight: 600; font-style: normal; font-display: swap; } @font-face { font-family: 'Switzer'; src: url('/fonts/Switzer-700.woff2') format('woff2'); font-weight: 700; font-style: normal; font-display: swap; } :root {  --radius-karta: 0px; --radius-tlacitko: 0px; --radius-obrazek: 0px; --radius-input: 0px; --radius-stitek: 0px;  --sekce-tesna: 4rem;  --sekce: 7rem;  --sekce-vzduch: 10rem;   --color-bg: #FFFFFF;  --color-bg-light: #FFFFFF;  --color-povrch: #F7F8F6;  --color-text: #12241E;  --color-text-light: #55685F;  --color-primary: #0B3B2E;  --color-primary-deep: #062A21;  --color-accent: #C3996A;  --color-accent-hover: #A47D4F; --color-white: #FFFFFF;   --font-heading: 'Sentient', 'Iowan Old Style', Georgia, serif; --font-body: 'Switzer', -apple-system, 'Segoe UI', sans-serif;  --transition-fast: 0.2s ease; --transition-smooth: 0.5s cubic-bezier(0.25, 1, 0.5, 1); --transition-bounce: 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275); } * { margin: 0; padding: 0; box-sizing: border-box; } html { scroll-behavior: smooth; } body { font-family: var(--font-body); color: var(--color-text); background-color: var(--color-bg); line-height: 1.6; overflow-x: hidden; }  h1, h2, h3, h4 { font-family: var(--font-heading); color: var(--color-primary); font-weight: 400;  line-height: 1.1; letter-spacing: -0.02em; text-wrap: balance; } h4 { letter-spacing: 0; } p { margin-bottom: 1rem; } a { text-decoration: none; color: inherit; transition: color var(--transition-fast); }  .container { max-width: 1400px; margin: 0 auto; padding: 0 5%; }  .btn-primary, .btn-secondary { border-radius: var(--radius-tlacitko); display: inline-block; padding: 1rem 2.5rem; font-weight: 500; font-family: var(--font-body); transition: all var(--transition-smooth); border: 1px solid transparent; cursor: pointer; text-align: center; } .btn-primary:hover, .btn-secondary:hover { transform: translateY(-3px) scale(1.02); box-shadow: 0 10px 20px rgba(0,0,0,0.1); } .btn-primary { background-color: var(--color-accent);  color: var(--color-white); } .btn-primary:hover { background-color: var(--color-accent-hover); }  .btn-secondary { background-color: transparent; color: var(--color-primary); border: 1px solid var(--color-primary); } .btn-secondary:hover { background-color: var(--color-primary); color: var(--color-white); }  .hero .btn-secondary, .hero-services .btn-secondary, .cds-hero .btn-secondary, .bg-primary .btn-secondary, .hh-cta .btn-secondary, .smart-filter-section .btn-secondary, .hodnoty .btn-secondary, .sluzby-predel .btn-secondary, .approach-cinema .btn-secondary, .cds-cesta .btn-secondary { color: var(--color-white); border-color: var(--color-white); } .hero .btn-secondary:hover, .hero-services .btn-secondary:hover, .cds-hero .btn-secondary:hover, .bg-primary .btn-secondary:hover, .hh-cta .btn-secondary:hover, .smart-filter-section .btn-secondary:hover, .hodnoty .btn-secondary:hover, .sluzby-predel .btn-secondary:hover, .approach-cinema .btn-secondary:hover, .cds-cesta .btn-secondary:hover { background-color: var(--color-white); color: var(--color-primary); }  .btn-small { padding: 0.6rem 1.2rem; font-size: 0.9rem; } .btn-text { display: inline-flex; align-items: center; gap: 0.5rem; color: var(--color-accent); font-weight: 600; font-size: 0.95rem; } .btn-text .lucide { width: 18px; height: 18px; transition: transform var(--transition-fast); } .btn-text:hover .lucide { transform: translateX(4px); } .btn-full { width: 100%; }  .navbar { position: fixed; top: 0; left: 0; width: 100%; z-index: 100; padding: 1.5rem 0; transition: all var(--transition-smooth); } .navbar.scrolled { background-color: var(--color-white); padding: 1rem 0; box-shadow: 0 4px 20px rgba(0,0,0,0.05); }  .nav-karta {  --header-h: 112px; } .nav-karta .navbar, .nav-karta .navbar.scrolled { top: 16px; left: 50%; width: min(1256px, calc(100% - 32px)); transform: translateX(-50%); background-color: var(--color-white); border-radius: 0; border: 1px solid rgba(11, 59, 46, 0.08); box-shadow: 0 12px 32px rgba(11, 59, 46, 0.10); padding: 0.75rem 0; } .nav-karta .navbar .nav-container { padding-inline: 1.5rem; } .nav-karta .navbar.scroll-hidden:not(.menu-open) { transform: translateX(-50%); opacity: 1; pointer-events: auto; } @media (max-width: 767px) { .nav-karta { --header-h: 96px; } .nav-karta .navbar, .nav-karta .navbar.scrolled { top: 10px; width: calc(100% - 20px); } .nav-karta .navbar .nav-container { padding-inline: 1rem; } } .navbar.scrolled .logo, .navbar.scrolled .nav-links a, .navbar.scrolled .menu-toggle { color: var(--color-primary); } .navbar.scrolled .logo span { color: var(--color-accent); } .navbar.scrolled .btn-primary { color: var(--color-white); }  :root {  --reveal-dur: 0.7s; --reveal-ease: cubic-bezier(0.22, 0.61, 0.36, 1); --reveal-shift: 22px; }  .reveal { opacity: 1; transform: none; transition: opacity var(--reveal-dur) var(--reveal-ease), transform var(--reveal-dur) var(--reveal-ease); will-change: opacity, transform; } @media (prefers-reduced-motion: no-preference) { html.js-pripraveno:not([data-noanim]) .reveal { opacity: 0; transform: translate3d(0, var(--reveal-shift), 0); } html.js-pripraveno:not([data-noanim]) .reveal.active { opacity: 1; transform: translate3d(0, 0, 0); } }  html.reveal-pojistka .reveal:not(.active) { opacity: 1 !important; transform: none !important; transition: none !important; }  .process-step:nth-child(1).reveal { transition-delay: 0.1s; } .process-step:nth-child(2).reveal { transition-delay: 0.3s; } .process-step:nth-child(3).reveal { transition-delay: 0.5s; } .trust-item:nth-child(1).reveal { transition-delay: 0.1s; } .trust-item:nth-child(2).reveal { transition-delay: 0.2s; } .trust-item:nth-child(3).reveal { transition-delay: 0.3s; } .nav-container { max-width: 1400px; margin: 0 auto; padding: 0 5%; display: flex; justify-content: space-between; align-items: center; } .logo { font-family: var(--font-heading); font-size: 1.4rem; font-weight: 600; color: var(--color-white); letter-spacing: 1px; text-transform: uppercase; } .logo span { font-family: var(--font-body); font-size: 0.8rem; font-weight: 300; display: block; letter-spacing: 3px; color: var(--color-accent); } .nav-links { display: flex; align-items: center; gap: 2.5rem; } .nav-links a:not(.btn-primary) { color: var(--color-white); font-size: 0.9rem; font-weight: 400; position: relative; padding: 0.45rem 0.9rem; letter-spacing: 0.02em; transition: color 0.22s ease; }  .nav-links a:not(.btn-primary)::before { content: ''; position: absolute; inset: 0; background: var(--color-accent); border-radius: 0; opacity: 0; transform: scaleX(0.75) scaleY(0.7); transition: opacity 0.22s ease, transform 0.22s cubic-bezier(0.34, 1.56, 0.64, 1); z-index: -1; } .nav-links a:not(.btn-primary):hover { color: var(--color-white); } .nav-links a:not(.btn-primary):hover::before { opacity: 1; transform: scaleX(1) scaleY(1); }  .navbar.scrolled .nav-links a:not(.btn-primary) { color: var(--color-primary); } .navbar.scrolled .nav-links a:not(.btn-primary)::before { background: var(--color-accent); } .navbar.scrolled .nav-links a:not(.btn-primary):hover { color: var(--color-white); } .menu-toggle { display: none; background: none; border: none; color: var(--color-white); cursor: pointer; }  .hero { position: relative; height: 100vh; min-height: 700px; display: flex; align-items: flex-end;  padding-bottom: 5rem; } .hero-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; background-image: url('/assets/hero.png'); background-size: cover; background-position: center; z-index: -2; } .hero-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%;    background: linear-gradient(to bottom, rgba(11, 59, 46, 0.18) 0%, rgba(11, 59, 46, 0.42) 55%, rgba(11, 59, 46, 0.78) 100%); z-index: -1; } .hero-content { width: 100%; max-width: 1400px; margin: 0 auto; padding: 0 5%; } .hero-text-wrapper { max-width: 800px; color: var(--color-white); animation: fadeInUp 1s ease forwards; } .hero-subtitle { font-size: 1.1rem; text-transform: uppercase; letter-spacing: 2px; color: var(--color-accent); margin-bottom: 1rem; } .hero-title {  font-size: clamp(2.5rem, 4vw, 3.25rem); letter-spacing: -0.02em; color: var(--color-white); line-height: 1.1; margin-bottom: 1.5rem; } .hero-description { font-size: 1.1rem; font-weight: 300; opacity: 0.9; margin-bottom: 2.5rem; max-width: 550px; } .hero-cta { display: flex; gap: 1rem; }  .section { padding: var(--sekce) 0 calc(var(--sekce) * 0.72); }  .section.sekce-tesna { padding: var(--sekce-tesna) 0 calc(var(--sekce-tesna) * 0.75); }  .section.sekce-vzduch { padding: var(--sekce-vzduch) 0 calc(var(--sekce-vzduch) * 0.7); } .section-subtitle { display: block; font-size: 0.9rem; text-transform: uppercase; letter-spacing: 2px; color: var(--color-accent); margin-bottom: 1rem; } .section-title { font-size: 2.5rem; margin-bottom: 1.5rem; } .section-text { color: var(--color-text-light); max-width: 600px; } .text-center { text-align: center; } .text-center .section-text, .text-center .section-title { margin-left: auto; margin-right: auto; } .bg-light { background-color: var(--color-bg-light); }  .btn-primary { background: var(--color-accent);  color: var(--color-text) !important; text-decoration: none; transition: var(--transition-smooth); } .bg-primary { background-color: var(--color-primary); color: var(--color-white); } .bg-primary .section-subtitle { color: var(--color-accent); } .bg-primary .section-title, .bg-primary h3, .bg-primary strong { color: var(--color-white); } .bg-primary p, .bg-primary .faq-inner { color: rgba(255, 255, 255, 0.8); } .bg-primary .review-card { background: rgba(255, 255, 255, 0.05); border: 1px solid rgba(255, 255, 255, 0.1); box-shadow: none; } .bg-primary .review-card p, .bg-primary .review-card strong { color: var(--color-white); }  .about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6rem; align-items: center; } .about-features { display: flex; flex-wrap: wrap; gap: 2rem; margin-top: 2rem; padding-top: 2rem; border-top: 1px solid rgba(0,0,0,0.1); } .feature-item { display: flex; align-items: center; gap: 0.8rem; font-weight: 500; } .feature-item .lucide { color: var(--color-accent); } .about-image-wrapper { position: relative; } .about-image-wrapper::before { content: ''; position: absolute; top: -20px; left: -20px; width: 100%; height: 100%; border: 1px solid var(--color-accent); z-index: 0; } .about-image-placeholder { position: relative; width: 100%; aspect-ratio: 4/5; background-color: var(--color-primary); z-index: 1; display: flex; align-items: center; justify-content: center; color: var(--color-white); font-family: var(--font-heading); font-style: italic; font-size: 1.2rem; opacity: 0.8; }  .section-header { margin-bottom: 4rem; } .catalog-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 2.5rem; } .property-card { background: var(--color-white); display: flex; flex-direction: column; overflow: hidden; transition: transform var(--transition-smooth), box-shadow var(--transition-smooth); box-shadow: 0 10px 30px rgba(0,0,0,0.03); } .property-card:hover { transform: translateY(-10px); box-shadow: 0 20px 40px rgba(0,0,0,0.08); } .card-image { position: relative; width: 100%; aspect-ratio: 4/3; overflow: hidden; } .card-image img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1); } .property-card:hover .card-image img { transform: scale(1.05);  } .card-badge { position: absolute; top: 1rem; left: 1rem; background: var(--color-white); color: var(--color-primary); padding: 0.4rem 1rem; font-size: 0.8rem; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; } .card-content { padding: 2rem; display: flex; flex-direction: column; gap: 1rem; flex-grow: 1; } .card-title { font-size: 1.375rem; font-family: var(--font-body); font-weight: 500; } .card-specs { display: flex; align-items: center; gap: 1.2rem; font-size: 0.9rem; color: var(--color-text-light); } .card-specs span { display: flex; align-items: center; gap: 0.4rem; } .card-specs .lucide { width: 16px; height: 16px; color: var(--color-accent); color: var(--color-text-light); } .card-price { font-size: 1.5rem; font-weight: 400; font-family: var(--font-heading); color: var(--color-primary); margin-bottom: auto; }  .services-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 3rem; } .service-card { padding: 3rem 2rem; background: var(--color-white); border: 1px solid rgba(11, 59, 46, 0.08); border-radius: var(--radius-karta); box-shadow: 0 1px 2px rgba(6, 42, 33, .04), 0 8px 24px -12px rgba(6, 42, 33, .10); transition: all var(--transition-smooth); text-align: center; } .service-card:hover { border-top-color: var(--color-accent); box-shadow: 0 15px 30px rgba(0,0,0,0.05); }  .service-ikona { display: flex; align-items: center; justify-content: center; box-sizing: content-box; width: 24px; height: 24px; padding: 14px; margin-bottom: 1rem; background: rgba(11, 59, 46, .07); border-radius: 50%; color: var(--color-primary); stroke-width: 1.75; transition: background-color .35s, color .35s; } .service-icon { width: 60px; height: 60px; background: var(--color-bg-light); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 1.5rem; color: var(--color-accent); } .service-card h3 { font-size: 1.125rem; font-family: var(--font-body); font-weight: 500; margin-bottom: 1rem; } .service-card p { color: var(--color-text-light); font-size: 0.95rem; }  .contact-wrapper { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; background: var(--color-primary); color: var(--color-white); padding: 5rem; border-radius: var(--radius-karta); overflow: hidden; } .contact .section-title { color: var(--color-white); } .contact-details { margin-top: 3rem; display: flex; flex-direction: column; gap: 1.5rem; } .contact-link { display: flex; align-items: center; gap: 1rem; font-size: 1.1rem; } .contact-link:hover { color: var(--color-accent); } .contact-link .lucide { color: var(--color-accent); color: var(--color-bg); } .contact-form { background: var(--color-white); padding: 3rem; color: var(--color-text); border-radius: var(--radius-karta); } .form-group { margin-bottom: 1.5rem; } .form-group label { display: block; margin-bottom: 0.5rem; font-size: 0.9rem; font-weight: 500; } .form-group input, .form-group textarea { width: 100%; padding: 1rem; border: 1px solid rgba(0,0,0,0.1); font-family: var(--font-body); background: var(--color-bg); transition: border-color var(--transition-fast); } .form-group input:focus, .form-group textarea:focus { outline: none; border-color: var(--color-accent); }  .footer-modern { background: var(--color-primary); color: rgba(255, 255, 255, 0.7); padding: 5rem 0 2rem; position: relative; border-top: 1px solid rgba(255, 255, 255, 0.05); } .footer-modern-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1.5fr; gap: 4rem; margin-bottom: 4rem; } .footer-col h4 { color: var(--color-white); font-size: 1.2rem; margin-bottom: 1.5rem; font-family: var(--font-heading); letter-spacing: 0.5px; } .footer-brand-col .logo { color: var(--color-white); display: inline-block; margin-bottom: 1rem; } .footer-brand-col p { line-height: 1.6; margin-bottom: 2rem; max-width: 90%; }  .footer-partner-logo { display: block; width: 150px; height: auto; margin-bottom: 2rem; } .social-links-modern { display: flex; gap: 1rem; } .social-links-modern a { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: var(--radius-tlacitko); background: rgba(255, 255, 255, 0.05); color: var(--color-white); transition: all var(--transition-fast); } .social-links-modern a:hover { background: var(--color-accent); transform: translateY(-3px); } .social-links-modern a svg, .social-links-modern a i { width: 20px !important; height: 20px !important; stroke: #ffffff !important; stroke-width: 2px !important; fill: none !important; display: block !important; } .footer-nav, .footer-contact-info { list-style: none; padding: 0; margin: 0; } .footer-nav li, .footer-contact-info li { margin-bottom: 1rem; } .footer-nav a { color: rgba(255, 255, 255, 0.7); transition: color var(--transition-fast); display: inline-block; } .footer-nav a:hover { color: var(--color-accent); transform: translateX(5px); } .footer-contact-info li { display: flex; align-items: center; gap: 0.8rem; } .footer-contact-info i { color: var(--color-accent); width: 18px; height: 18px; } .footer-bottom { display: flex; justify-content: space-between; align-items: center; padding-top: 2rem; border-top: 1px solid rgba(255, 255, 255, 0.1); font-size: 0.9rem; } .footer-legal { display: flex; gap: 1.5rem; } .footer-legal a {  color: rgba(255, 255, 255, 0.65); transition: color var(--transition-fast); } .footer-legal a:hover { color: var(--color-white); }    .trust-number { display: block; font-family: var(--font-heading); font-size: 3.5rem; color: var(--color-accent); line-height: 1; margin-bottom: 0.5rem; } .trust-label { font-size: 0.9rem; text-transform: uppercase; letter-spacing: 1px; color: var(--color-text-light); }   .intent-section { background-color: var(--color-white); } .intent-grid-v2 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; } .intent-card-v2 { position: relative; height: 350px; border-radius: var(--radius-karta); overflow: hidden; display: flex; align-items: flex-end; padding: 2.5rem; text-decoration: none; color: var(--color-white); background-color: var(--color-primary); background-size: cover; background-position: center;  transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), box-shadow 0.4s cubic-bezier(0.165, 0.84, 0.44, 1); }  .partners { padding: 3.5rem 0 4rem;  background: transparent; } .partners-title { text-align: center; font-size: 0.78rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--color-text-light); margin: 0 0 1.75rem; } .partners-marquee-wrapper { overflow: hidden; width: 100%; display: flex; } .partners-marquee-track { --marquee-duration: 55s; display: flex; width: max-content; animation: partners-scroll var(--marquee-duration) linear infinite; will-change: transform; backface-visibility: hidden; } .partners-marquee-set { display: flex; align-items: center; gap: 4rem; padding-right: 4rem; flex: 0 0 auto; } @keyframes partners-scroll { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(-50%, 0, 0); } } .partner-logo { width: 150px; height: 44px; object-fit: contain; flex-shrink: 0; opacity: 0.55; transition: opacity 0.3s ease; } .partner-logo:hover { opacity: 0.9; } @media (max-width: 767px) { .partners { padding: 2rem 0 2.25rem; } .partners-marquee-set { gap: 2.5rem; padding-right: 2.5rem; } .partner-logo { width: 118px; height: 36px; } } @media (prefers-reduced-motion: reduce) { .partners-marquee-track { animation: none; } .partners-marquee-wrapper { overflow-x: auto; } } .intent-card-v2:hover { transform: translateY(-5px); box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15); }  .intent-resales { background-image: url('/assets/resales-v2.jpg'); } .intent-novostavby { background-image: url('/assets/novostavby-v2.jpg'); } .intent-prodej { background-image: url('/assets/prodej-v2.jpg'); } .intent-card-v2::before { content: ''; position: absolute; inset: 0; background: linear-gradient(to top, rgba(10, 18, 12, 0.97) 0%, rgba(10, 18, 12, 0.6) 45%, rgba(10, 18, 12, 0.15) 80%, transparent 100%); transition: opacity var(--transition-smooth); z-index: 1; } .intent-card-v2:hover::before { background: linear-gradient(to top, rgba(10, 18, 12, 0.99) 0%, rgba(10, 18, 12, 0.75) 50%, rgba(10, 18, 12, 0.25) 85%, transparent 100%); } .intent-card-v2 .intent-content { position: relative; z-index: 2; width: 100%; } .intent-card-v2 h2 { font-size: 1.75rem; margin-bottom: 0.5rem; color: var(--color-white); font-family: var(--font-heading); } .intent-card-v2 p { font-size: 0.95rem; color: rgba(255, 255, 255, 0.9); max-width: 100%;  max-height: 0; opacity: 0; overflow: hidden; margin-bottom: 0; transition: max-height 0.5s ease, opacity 0.5s ease, margin-bottom 0.4s ease; } .intent-card-v2:hover p, .intent-card-v2:focus-visible p { max-height: 200px; opacity: 1; margin-bottom: 1.5rem; }  @media (hover: none), (prefers-reduced-motion: reduce) { .intent-card-v2 p { max-height: none; opacity: 1; margin-bottom: 1.5rem; }  .intent-card-v2 .btn-text { max-height: none; opacity: 1; transform: none; } .intent-card-v2:hover { transform: none; } }  .intent-card-v2 .btn-text { color: var(--color-accent); max-height: 0; opacity: 0; overflow: hidden; transform: translateY(8px); transition: max-height 0.45s var(--transition-smooth), opacity 0.35s ease, transform 0.45s var(--transition-smooth); } .intent-card-v2:hover .btn-text, .intent-card-v2:focus-visible .btn-text, .intent-card-v2.je-videt .btn-text { max-height: 2rem; opacity: 1; transform: translateY(0); } @media (max-width: 1100px) { .intent-grid-v2 { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 900px) { .intent-grid-v2 { grid-template-columns: 1fr; } .intent-card-v2 { height: 300px; } }    .about-split-article { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: center; } .about-image-side .lukas-img { width: 100%; aspect-ratio: 4/5; object-fit: cover;  object-position: center 18%; border-radius: var(--radius-obrazek); } .about-signature { margin-top: 3rem; padding-top: 1.5rem; border-top: 1px solid rgba(0,0,0,0.1); } .about-signature strong { display: block; font-family: var(--font-heading); font-size: 1.5rem; color: var(--color-primary); } .about-signature span { color: var(--color-text-light); }  .process-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3rem; margin-top: 4rem; } .process-step { position: relative; padding: 2.5rem; background: var(--color-bg-light); border-radius: var(--radius-karta); overflow: hidden; } .process-step .step-number { position: absolute; top: -15px; right: 10px; font-family: var(--font-heading); font-size: 8rem; color: var(--color-white); opacity: 0.7; line-height: 1; z-index: 0; } .process-step h3, .process-step p { position: relative; z-index: 1; }  .stats-split { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: center; } .stats-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; margin-top: 3rem; } .trust-bar { background-color: var(--color-white); padding: 3rem 0; position: relative; z-index: 10; } .trust-grid {  display: grid; grid-template-columns: repeat(3, 1fr); align-items: start; gap: 2rem; }  .trust-grid-4 { grid-template-columns: repeat(4, 1fr); } .trust-item { text-align: center; display: flex; flex-direction: column; align-items: center; min-width: 0; } .trust-number { display: block; font-size: 3rem; color: var(--color-accent); margin-bottom: 0.5rem; } .trust-number i { width: 88px; height: 88px; stroke-width: 1.1; } .trust-label { font-size: 1rem; font-weight: 500; color: var(--color-primary); text-transform: uppercase; letter-spacing: 1px; } .stat-box { background: var(--color-white); padding: 2rem 1.5rem; text-align: center; box-shadow: 0 10px 30px rgba(0,0,0,0.03); border-radius: var(--radius-karta); transition: var(--transition-smooth); } .stat-box:hover { transform: translateY(-5px); box-shadow: 0 15px 35px rgba(0,0,0,0.08); } .stat-val { font-family: var(--font-heading); font-size: 2.5rem; color: var(--color-primary); margin-bottom: 0.2rem; } .stat-desc { font-size: 0.85rem; color: var(--color-text-light); text-transform: uppercase; font-weight: 500; } .stats-img-side img { width: 100%; aspect-ratio: 1/1; object-fit: cover; border-radius: var(--radius-obrazek); }  .catalog-filters { display: flex; justify-content: center; gap: 1rem; margin-bottom: 3rem; margin-top: 2rem; flex-wrap: wrap; } .filter-btn { padding: 0.6rem 1.5rem; background: transparent; border: 1px solid var(--color-text-light); color: var(--color-text); border-radius: var(--radius-tlacitko); cursor: pointer; font-family: var(--font-body); transition: all var(--transition-fast); } .filter-btn:hover, .filter-btn.active { background: var(--color-primary); color: var(--color-white); border-color: var(--color-primary); } .catalog-grid.new-catalog { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 1rem;  margin-top: 3rem; } .property-overlay-card { position: relative; height: 500px; overflow: hidden; cursor: pointer; transition: var(--transition-smooth); } .property-overlay-card:hover, .property-overlay-card:focus-within {  transform: translateY(-10px) scale(1.035); box-shadow: 0 30px 60px rgba(11, 59, 46, 0.22); z-index: 2; } .property-overlay-card img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.8s var(--transition-smooth); } .property-overlay-card:hover img {  transform: scale(1.02); } .po-content { position: absolute; inset: 0; padding: 2rem 1.5rem; display: flex; flex-direction: column; justify-content: space-between; background: linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.2) 60%, rgba(0,0,0,0) 100%); color: var(--color-white); } .po-badge { align-self: flex-start; background: var(--color-primary); color: var(--color-white); padding: 0.4rem 1rem; border-radius: var(--radius-stitek); font-size: 0.8rem; font-weight: 500; } .po-bottom { margin-top: auto; } .po-bottom h3 { color: var(--color-white); font-size: 1.375rem; margin-bottom: 0.5rem; } .po-specs { font-size: 0.95rem; opacity: 0.9; margin-bottom: 0.8rem; display: flex; align-items: center; gap: 1.5rem; } .po-specs span { display: flex; align-items: center; gap: 0.5rem; } .po-specs i { width: 16px; height: 16px; } .po-price { font-size: 1.6rem; font-family: var(--font-heading); color: var(--color-accent); font-weight: 600; } .property-overlay-card.hidden { display: none; }  .reels-slider-wrapper { margin-top: 3rem; overflow-x: auto; padding-bottom: 2rem; scrollbar-width: none; } .reels-slider-wrapper::-webkit-scrollbar { display: none; } .reels-grid { display: none; } .reel-item { position: relative; width: 100%; height: 100%; display: block; } .reel-item img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--transition-smooth); } .reel-play { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 60px; height: 60px; background: rgba(255,255,255,0.2); backdrop-filter: blur(5px); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--color-white); transition: transform var(--transition-fast); } .reel-item:hover .reel-play { transform: translate(-50%, -50%) scale(1.1); background: var(--color-accent); } .reel-item:hover img { transform: scale(1.03); }  .reviews-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 2rem; margin-top: 4rem; } .review-card { background: var(--color-white); padding: 3rem 2.5rem; text-align: left; transition: var(--transition-smooth); box-shadow: 0 10px 30px rgba(0,0,0,0.03); } .review-card:hover { transform: translateY(-8px); box-shadow: 0 20px 40px rgba(0,0,0,0.1); } .review-card .stars { color: var(--color-accent); margin-bottom: 1rem; font-size: 1.2rem; letter-spacing: 2px; } .review-card p { font-style: italic; color: var(--color-text); margin-bottom: 1.5rem; } .review-card strong { font-family: var(--font-heading); }   .faq-grid { display: grid; grid-template-columns: minmax(280px, 5fr) 7fr; gap: clamp(2rem, 5vw, 4.5rem); align-items: start; } .faq-uvod { position: sticky; top: calc(var(--header-h, 90px) + 2rem); } .faq-uvod .section-title { text-align: left; margin-bottom: 1rem; } .faq-uvod .section-subtitle { text-align: left; display: block; } .faq-uvod-text { color: var(--color-text-light); line-height: 1.65; max-width: 42ch; margin-bottom: 1.75rem; } .faq-uvod-cta { display: inline-flex; align-items: center; gap: 0.6rem; color: var(--color-primary); font-weight: 600; text-decoration: none; padding: 0.85rem 1.6rem; border: 1.5px solid var(--color-primary); border-radius: var(--radius-tlacitko); transition: var(--transition-fast); } .faq-uvod-cta:hover { background: var(--color-primary); color: var(--color-white); } .faq-uvod-cta i { width: 18px; height: 18px; } .faq-accordion { margin: 0; counter-reset: faq; } .faq-item { counter-increment: faq; background: var(--color-white); border: 1px solid rgba(11, 59, 46, 0.1); border-radius: var(--radius-karta); margin-bottom: 0.9rem; padding: 0 1.5rem; transition: border-color 0.25s ease, box-shadow 0.25s ease; } .faq-item:hover { border-color: rgba(195, 153, 106, 0.55); } .faq-item:has(.faq-question.active) { border-color: var(--color-accent); box-shadow: 0 12px 32px rgba(11, 59, 46, 0.08); } .faq-question { width: 100%; text-align: left; padding: 1.35rem 0; background: transparent; border: none; font-size: 1.1rem; font-family: var(--font-heading); color: var(--color-primary); cursor: pointer; display: flex; justify-content: flex-start; text-align: left; align-items: center; gap: 1rem; } .faq-question::before { content: counter(faq, decimal-leading-zero); font-family: var(--font-body); font-size: 0.78rem; font-weight: 600; letter-spacing: 0.05em; color: var(--color-accent); flex-shrink: 0; align-self: flex-start; padding-top: 0.3rem; } .faq-question > i { margin-left: auto; flex-shrink: 0; } .faq-question i { transition: transform var(--transition-fast); } .faq-question.active i { transform: rotate(180deg); } .faq-answer { display: grid; grid-template-rows: 0fr; transition: grid-template-rows var(--transition-smooth); } .faq-inner { overflow: hidden; color: var(--color-text-light); line-height: 1.6; } .faq-question.active + .faq-answer { grid-template-rows: 1fr; } .faq-question.active + .faq-answer .faq-inner { padding-bottom: 1.5rem; } .faq-inner { padding-left: 2.1rem; }  .footer-newsletter-col p { margin-bottom: 1.5rem; font-size: 0.95rem; } .newsletter-form-modern { display: flex; position: relative; } .newsletter-form-modern input { width: 100%; padding: 1rem 1.5rem; background: rgba(255, 255, 255, 0.05); border: 1px solid rgba(255, 255, 255, 0.1); border-right: none; border-radius: var(--radius-input); color: var(--color-white); font-size: 0.95rem; transition: border-color var(--transition-fast); } .newsletter-form-modern input:focus { outline: none; border-color: var(--color-accent); } .newsletter-form-modern input::placeholder { color: rgba(255, 255, 255, 0.4); } .newsletter-form-modern button { width: 50px; border-radius: var(--radius-tlacitko); background: var(--color-accent); color: var(--color-white); border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background var(--transition-fast); } .newsletter-form-modern button:hover { background: var(--color-accent-hover); } .newsletter-form-modern button i { width: 18px; height: 18px; margin-left: -2px; } @media (max-width: 1100px) { .footer-modern-grid { grid-template-columns: 1fr 1fr; } } @media (max-width: 900px) { .trust-grid, .trust-grid-4 { grid-template-columns: 1fr; gap: 1rem; } .trust-number { font-size: 2.5rem; } .intent-grid { grid-template-columns: 1fr; } .about-split-article { grid-template-columns: 1fr; gap: 3rem; } .process-grid { grid-template-columns: 1fr; } .stats-split { grid-template-columns: 1fr; gap: 3rem; } .catalog-filters { gap: 0.5rem; } .filter-btn { font-size: 0.9rem; padding: 0.5rem 1rem; } } @media (max-width: 768px) {  .footer-modern-grid { grid-template-columns: 1fr; gap: 2.5rem; text-align: center; } .footer-col { align-items: center; } .footer-brand-col .logo { display: block; } .footer-partner-logo { margin-inline: auto; } .footer-brand-col p { max-width: 100%; } .social-links-modern { justify-content: center; } .footer-nav li a, .footer-contact-info li { justify-content: center; } .footer-contact-info li { display: flex; align-items: center; gap: 0.5rem; } .newsletter-form-modern { margin-left: auto; margin-right: auto; } .footer-bottom { flex-direction: column; gap: 1rem; text-align: center; } .footer-legal { flex-wrap: wrap; justify-content: center; } .footer-modern { padding: 3.5rem 0 2rem; } }  @keyframes fadeInUp { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } }  .locations-slider-wrapper { position: relative; max-width: 1400px; margin: 3rem auto 0; padding: 0 4rem 4rem;  } .swiper { width: 100%; padding-top: 2rem; padding-bottom: 3rem; } .swiper-slide { background-position: center; background-size: cover;  width: 300px; height: 420px; cursor: pointer; border-radius: var(--radius-obrazek); overflow: hidden; position: relative; box-shadow: 0 15px 40px rgba(0,0,0,0.5); } .swiper-slide img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease; } .swiper-slide::after { content: ''; position: absolute; inset: 0; background: rgba(0,0,0,0); transition: background 0.5s ease; z-index: 1; pointer-events: none; } .swiper-slide:hover::after { background: rgba(0,0,0,0.5); } .swiper-slide:hover img { transform: scale(1.05); } .slide-content { position: absolute; bottom: 0; left: 0; width: 100%; padding: 3rem 1.5rem 2.5rem; background: linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0) 100%); color: var(--color-white); text-align: left; z-index: 2; } .slide-content h3 { color: var(--color-white); font-size: 1.5rem; margin-bottom: 0; transform: translateY(1rem); transition: transform 0.4s ease, margin-bottom 0.4s ease; } .slide-content p { font-size: 0.95rem; margin-bottom: 0; opacity: 0; max-height: 0; transform: translateY(1rem); transition: all 0.4s ease; overflow: hidden; } .swiper-slide:hover .slide-content h3 { transform: translateY(0); margin-bottom: 0.5rem; } .swiper-slide:hover .slide-content p { opacity: 0.9; max-height: 100px; transform: translateY(0); }  .swiper-btn-prev, .swiper-btn-next { position: absolute; top: 50%; transform: translateY(-50%); width: 50px; height: 50px; background: transparent; border: 1px solid rgba(255,255,255,0.3); border-radius: 50%; color: var(--color-white); display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 10; transition: all var(--transition-fast); } .swiper-btn-prev:hover, .swiper-btn-next:hover { background: var(--color-white); color: var(--color-primary); } .swiper-btn-prev { left: -2rem; } .swiper-btn-next { right: -2rem; }  #zivot .swiper-btn-prev, #zivot .swiper-btn-next { color: var(--color-primary); border-color: rgba(11, 59, 46, 0.1); } #zivot .swiper-btn-prev:hover, #zivot .swiper-btn-next:hover { background: var(--color-primary); color: var(--color-white); }  #locationsSwiper .swiper-pagination, #zivotSwiper .swiper-pagination { display: none !important; } .swiper-pagination { bottom: 0 !important; } .swiper-pagination-bullet { width: 10px; height: 10px; background: rgba(255,255,255,0.4) !important; opacity: 1 !important; transition: all var(--transition-smooth) !important; border-radius: 50%; } .swiper-pagination-bullet-active { background: var(--color-white) !important; width: 32px !important; border-radius: 10px !important; }  @media (max-width: 900px) { .about-grid, .contact-wrapper { grid-template-columns: 1fr; } .contact-wrapper { padding: 3rem 2rem; } .hero-title { font-size: 2.5rem; } .swiper-slide { width: 280px; height: 380px; } .locations-slider-wrapper { padding: 0 0 3rem; } .swiper-btn-prev, .swiper-btn-next { display: none; } }  @media (max-width: 1100px) { .nav-links { position: fixed; top: 0; right: -100%; height: 100vh; width: 85%; max-width: 350px; background: var(--color-bg); flex-direction: column; justify-content: flex-start; padding: 6rem 2.5rem 3rem; transition: right var(--transition-smooth); box-shadow: -10px 0 30px rgba(0,0,0,0.1); z-index: 101; } .nav-links.active { right: 0; } .nav-links::after { content: 'Lukáš Hutta Real Estate'; position: absolute; bottom: 2rem; left: 2.5rem; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 2px; color: var(--color-text-light); opacity: 0.5; } .nav-links a:not(.btn-primary) { color: var(--color-primary); font-size: 1.4rem; font-family: var(--font-heading); width: 100%; padding: 1rem 0; border-bottom: 1px solid rgba(0,0,0,0.05); } .nav-links .btn-primary { width: 100%; margin-top: 2rem; text-align: center; padding: 1.2rem; font-size: 1.1rem; border-radius: var(--radius-tlacitko); } .menu-toggle { display: block; position: relative; z-index: 102;  } .navbar.scrolled .menu-toggle { color: var(--color-primary); } } @media (max-width: 768px) {  .hero-subtitle {  display: inline-block; font-size: 0.82rem; letter-spacing: 1.5px; padding: 0.4rem 0.9rem; border: 1px solid rgba(255, 255, 255, 0.28); border-radius: var(--radius-stitek); background: rgba(255, 255, 255, 0.12); backdrop-filter: blur(6px); color: var(--color-white); margin-bottom: 1.25rem; } .hero-description { font-size: 1.0625rem; margin-bottom: 2rem; } .hero-cta { flex-direction: column; align-items: flex-start; gap: 0.75rem; }  .hero {  padding-bottom: clamp(4rem, 13vh, 9rem); }  .section { padding: 5rem 0; } .container { padding: 0 1.5rem; }  .section-title, .section h2 { font-size: 1.75rem; line-height: 1.1; }  .btn-primary, .btn-secondary { min-height: 52px; padding: 0.85rem 1.75rem; }  .hero-cta .btn-primary, .hero-cta .btn-secondary { width: auto; min-height: 52px; padding: 0.85rem 1.75rem; display: inline-flex; align-items: center; justify-content: center; } }  .nav-overlay { position: fixed; inset: 0; background: rgba(11, 59, 46, 0.4); backdrop-filter: blur(4px); z-index: 100; opacity: 0; visibility: hidden; transition: all var(--transition-smooth); } .nav-overlay.active { opacity: 1; visibility: visible; }  .reels-slider-container { max-width: 1400px; margin: 3rem auto 0; padding: 0 5%; } .reels-pagination { position: relative !important; bottom: 0 !important; margin-top: 2rem; } .reels-pagination .swiper-pagination-bullet { background: var(--color-primary) !important; opacity: 0.3 !important; } .reels-pagination .swiper-pagination-bullet-active { opacity: 1 !important; width: 25px !important; }  .property-card, .intent-card-v2, .stat-box, .review-card, .process-step { border-radius: var(--radius-karta);  box-shadow: 0 4px 12px rgba(0,0,0,0.03); } .property-card:active, .intent-card-v2:active { transform: scale(0.98); }  .back-to-top { display: none !important; }  .bottom-nav { display: none !important; }  .costa-hero { position: relative; min-height: 62vh; display: flex; align-items: center; justify-content: center; text-align: center; background: url('/assets/costa-del-sol.jpg') center/cover no-repeat; color: var(--color-white); padding: 3rem 2rem; overflow: hidden; }  @media (hover: hover) and (min-width: 1024px) { .costa-hero { background-attachment: fixed; } } .costa-hero::before { content: ''; position: absolute; inset: 0;  background: linear-gradient(to bottom, rgba(11, 59, 46, 0.34) 0%, rgba(11, 59, 46, 0.46) 45%, rgba(6, 42, 33, 0.74) 100%); z-index: 1; } .costa-hero-content { position: relative; z-index: 2; max-width: 800px; } .costa-hero-subtitle { text-transform: uppercase; letter-spacing: 4px; font-size: 0.9rem; margin-bottom: 1rem; opacity: 0.9; } .costa-hero-title { font-size: clamp(2.5rem, 6vw, 4.5rem); color: var(--color-accent); margin-bottom: 1.5rem; line-height: 1.1; text-shadow: 0 2px 20px rgba(0,0,0,0.3); } .costa-hero-info { font-size: 1.2rem; margin-bottom: 1.5rem; font-family: var(--font-body); opacity: 0.9; } .costa-hero-stats { display: flex; justify-content: center; gap: 3rem; margin-bottom: 2rem; } .costa-stat { display: flex; flex-direction: column; } .costa-stat-val { font-size: 2.5rem; font-family: var(--font-heading); color: var(--color-accent); } .costa-stat-label { font-size: 0.8rem; text-transform: uppercase; letter-spacing: 1px; } .btn-white { display: inline-block; background: var(--color-accent);  color: var(--color-text); padding: 1.2rem 2.5rem; text-transform: uppercase; font-weight: 600; font-size: 0.9rem; letter-spacing: 1px; border-radius: var(--radius-tlacitko); transition: var(--transition-smooth); text-decoration: none; position: relative; z-index: 5; } .btn-white:hover { background: var(--color-white); color: var(--color-primary); transform: translateY(-5px); box-shadow: 0 15px 30px rgba(0,0,0,0.2); } @media (max-width: 768px) { .costa-hero-stats { flex-direction: column; gap: 2rem; margin-bottom: 3rem; } .costa-hero-title { font-size: 2.5rem; } .btn-white { padding: 1rem 1.5rem; font-size: 0.8rem; width: 90%; max-width: 300px; } }  .process-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem; } .process-card { background: var(--color-white); padding: 3rem 2rem; border-radius: var(--radius-karta); position: relative; box-shadow: 0 10px 30px rgba(0,0,0,0.03); transition: transform var(--transition-smooth), box-shadow var(--transition-smooth), border-color var(--transition-smooth); border: 1px solid rgba(0,0,0,0.03); overflow: hidden; }  .process-card:hover { border-color: var(--color-accent); } .process-number { position: absolute; top: -20px; right: -10px; font-size: 8rem; font-weight: 800; color: rgba(0,0,0,0.03); font-family: var(--font-heading); line-height: 1; z-index: 0; transition: color var(--transition-smooth); } .process-card:hover .process-number { color: rgba(11, 59, 46, 0.07); }  .process-icon { width: 52px; height: 52px; background: rgba(11, 59, 46, .07); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--color-primary); margin-bottom: 2rem; position: relative; z-index: 1; transition: background-color .35s, color .35s; } .process-icon svg { width: 24px; height: 24px; stroke-width: 1.75; } .process-card h3 { font-size: 1.125rem; margin-bottom: 1rem; position: relative; z-index: 1; } .process-card p { color: var(--color-text-light); font-size: 0.95rem; line-height: 1.6; margin: 0; position: relative; z-index: 1; } @media (max-width: 1024px) { .process-grid { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 768px) { .process-grid { grid-template-columns: 1fr; } }  .approach-split-section { padding: 6rem 0; overflow: hidden; } .approach-split-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center; } .approach-image-side { position: relative; padding: 2rem 0 2rem 2rem; } .approach-image-wrapper { position: relative; z-index: 2; box-shadow: 0 20px 50px rgba(0,0,0,0.1); } .approach-img { width: 100%; height: auto; display: block; object-fit: cover; aspect-ratio: 4/5; border-radius: var(--radius-obrazek); } .approach-accent-box { position: absolute; top: -2rem; left: -2rem; width: 60%; height: 60%; background: var(--color-accent); z-index: -1; } .approach-text-side { padding-right: 2rem; } .approach-features { display: flex; flex-direction: column; gap: 2.5rem; margin-top: 2rem; } .approach-feature { display: flex; gap: 0.8rem; align-items: flex-start; }  .approach-icon { width: 52px; height: 52px; min-width: 52px; background: rgba(11, 59, 46, .07); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--color-primary); transition: background-color .35s, color .35s; } .approach-icon svg { width: 24px; height: 24px; stroke-width: 1.75; } .approach-feature-content h3 { font-size: 1.25rem; margin-bottom: 0.5rem; color: var(--color-text); } .approach-feature-content p { color: var(--color-text-light); line-height: 1.6; margin: 0; } @media (max-width: 900px) { .approach-split-grid { grid-template-columns: 1fr; gap: 3rem; } .approach-image-side { padding: 2rem 2rem 0 0; order: 2; } .approach-accent-box { top: -1rem; right: -1rem; left: auto; } .approach-text-side { padding-right: 0; order: 1; } }  .mapa-sekce { padding: 0 0 4rem; } .mapa-hlavicka { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.25rem; } .mapa-hlavicka p { color: var(--color-text-light); font-size: 0.9rem; margin: 0; }  #mapa-nabidky .leaflet-tile-pane { filter: saturate(0.62) contrast(0.96) brightness(1.03); } #mapa-nabidky { height: 460px; width: 100%; border-radius: var(--radius-obrazek, 4px); overflow: hidden; z-index: 1; background: var(--color-bg-light); } @media (max-width: 768px) { #mapa-nabidky { height: 340px; } }  .hh-marker span { display: block; width: 18px; height: 18px; border-radius: 50%; border: 3px solid var(--color-white); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35); transition: transform 0.2s ease; } .hh-marker-aktivni span { transform: scale(1.35); } .leaflet-popup-content-wrapper.hh-popup-wrap, .hh-popup-wrap .leaflet-popup-content-wrapper { border-radius: var(--radius-karta, 4px); padding: 0; overflow: hidden; } .hh-popup-wrap .leaflet-popup-content { margin: 0; width: 210px !important; } .hh-popup { display: block; text-decoration: none; color: var(--color-text); } .hh-popup img { width: 100%; height: 110px; object-fit: cover; display: block; } .hh-popup-titul { display: block; font-family: var(--font-heading); font-size: 0.95rem; padding: 0.6rem 0.75rem 0.15rem; } .hh-popup-meta { display: block; font-size: 0.8rem; color: var(--color-text-light); padding: 0 0.75rem 0.7rem; }  .property-overlay-card.je-zvyraznena { outline: 3px solid var(--color-accent); outline-offset: 3px; }   .property-card, .intent-card-v2, .stat-box, .process-step, .process-card { box-shadow: 0 12px 32px rgba(11, 59, 46, 0.09); } .btn-primary, .btn-secondary { padding-left: 2.8rem; padding-right: 2.8rem; }  .property-card, .property-overlay-card, .intent-card-v2, .card-image { overflow: hidden; } .back-to-top { bottom: 1.5rem; }  .property-overlay-card, .card-image, .review-card, .hero-image-side img, .faq-item { border-radius: var(--radius-karta); overflow: hidden; } .form-group input, .form-group textarea, .filter-group select, .filter-form select, .filter-form input[type="text"] { border-radius: var(--radius-input); } .card-badge, .po-badge, .trust-item .trust-label, .section-subtitle { border-radius: var(--radius-stitek); } .newsletter-form-modern input, .newsletter-form-modern button { border-radius: var(--radius-tlacitko); }  .ig-frame { position: relative; margin-top: 3rem; } .ig-carousel { --ig-w: 260; position: relative; height: 510px; display: flex; align-items: center; justify-content: center; user-select: none; -webkit-user-select: none; touch-action: pan-y; } .ig-card { position: absolute; width: calc(var(--ig-w) * 1px); height: calc(var(--ig-w) * 16 / 9 * 1px); border-radius: var(--radius-obrazek); overflow: hidden; background: var(--color-primary); box-shadow: 0 24px 48px -20px rgba(11, 59, 46, 0.35); transition: transform 0.55s cubic-bezier(0.5, 0, 0.2, 1), opacity 0.55s ease, box-shadow 0.4s ease; will-change: transform, opacity; cursor: pointer; } .ig-card.is-center { box-shadow: 0 34px 70px -24px rgba(11, 59, 46, 0.45); } .ig-card video, .ig-card .ig-card__foto { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; } .ig-card__play { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 64px; height: 64px; border: 0; border-radius: 50%; background: rgba(11, 59, 46, 0.72); color: var(--color-white); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: transform 0.25s ease, opacity 0.25s ease; } .ig-card__play:hover { transform: translate(-50%, -50%) scale(1.08); background: var(--color-accent); } .ig-card:not(.is-center) .ig-card__play, .ig-card.is-playing .ig-card__play { opacity: 0; pointer-events: none; } .ig-card__source { position: absolute; right: 0.7rem; bottom: 0.7rem; width: 34px; height: 34px; border-radius: 50%; background: rgba(11, 59, 46, 0.6); color: var(--color-white); display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity 0.25s ease; z-index: 3; } .ig-card.is-center .ig-card__source { opacity: 0.85; } .ig-arrows { pointer-events: none; } .ig-nav-btn { pointer-events: auto; position: absolute; top: 50%; transform: translateY(-50%); width: 48px; height: 48px; border: 0; border-radius: 50%; background: var(--color-primary); color: var(--color-white); display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 60; transition: background 0.2s ease; } .ig-nav-btn:hover { background: var(--color-accent); } #ig-prev { left: max(8px, calc(50% - 640px)); } #ig-next { right: max(8px, calc(50% - 640px)); } @media (max-width: 900px) { .ig-carousel { --ig-w: 215; height: 430px; } } @media (max-width: 560px) { .ig-carousel { --ig-w: 165; height: 335px; } .ig-nav-btn { width: 40px; height: 40px; } } @media (prefers-reduced-motion: reduce) { .ig-card { transition: opacity 0.2s ease; } }  .faq-vice { display: none; margin: 1.5rem auto 0; border-color: var(--color-primary); color: var(--color-primary); border-radius: var(--radius-tlacitko); } .faq-vice:hover { background: var(--color-primary); color: var(--color-white); } @media (max-width: 900px) { .faq-grid { grid-template-columns: 1fr; } .faq-uvod { position: static; } } @media (max-width: 768px) { .faq-accordion:not(.je-rozbalene) .faq-item:nth-child(n+4) { display: none; } .faq-accordion:not(.je-rozbalene) ~ .faq-vice, .faq-vice { display: block; } .faq-accordion.je-rozbalene ~ .faq-vice { display: none; } }  .lok-popup { position: fixed; inset: 0; z-index: 500; display: flex; align-items: center; justify-content: center; padding: 1rem; } .lok-popup[hidden] { display: none; } .lok-popup-pozadi { position: absolute; inset: 0; background: rgba(15, 22, 17, 0.65); backdrop-filter: blur(2px); } .lok-popup-okno { position: relative; width: min(880px, 100%); max-height: min(86vh, 640px); background: var(--color-bg); border-radius: var(--radius-karta); overflow: hidden; box-shadow: 0 30px 80px rgba(0, 0, 0, 0.4); display: flex; flex-direction: column; } .lok-popup-zavrit { position: absolute; top: 0.9rem; right: 0.9rem; z-index: 5; width: 40px; height: 40px; border: 0; border-radius: 50%; background: var(--color-primary); color: var(--color-white); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background 0.2s ease; } .lok-popup-zavrit:hover { background: var(--color-accent); } .lok-popup-obsah { display: grid; grid-template-columns: 1fr 1fr; min-height: 420px; } .lok-popup-text { padding: 2.5rem; overflow-y: auto; } .lok-popup-text h3 { font-family: var(--font-heading); font-size: 1.375rem; margin: 0.25rem 0 1rem; } .lok-popup-text p { color: var(--color-text-light); line-height: 1.65; } .lok-popup-text ul { list-style: none; margin: 1.25rem 0 1.75rem; padding: 0; display: flex; flex-direction: column; gap: 0.6rem; } .lok-popup-text li { display: flex; gap: 0.6rem; align-items: baseline; font-size: 0.92rem; } .lok-popup-text li::before { content: ''; flex: 0 0 8px; height: 8px; border-radius: 50%; background: var(--color-accent); background: var(--color-primary); transform: translateY(-1px); } .lok-popup-mapa { min-height: 320px; background: var(--color-bg-light); } .lok-popup-mapa .leaflet-tile-pane { filter: saturate(0.62) contrast(0.96) brightness(1.03); } @media (max-width: 760px) { .lok-popup-okno { max-height: 92vh; } .lok-popup-obsah { grid-template-columns: 1fr; min-height: 0; } .lok-popup-mapa { min-height: 240px; order: -1; } .lok-popup-text { padding: 1.5rem; } }  .nav-dropdown { position: relative; display: inline-flex; align-items: center; } .nav-dropdown-spoust { display: inline-flex; align-items: center; gap: 0.3rem; } .nav-dropdown-spoust svg { width: 14px; height: 14px; transition: transform 0.25s ease; } .nav-dropdown-menu { position: absolute; top: calc(100% + 0.9rem); left: 50%; transform: translateX(-50%) translateY(6px); min-width: 220px; background: var(--color-white); border: 1px solid rgba(11, 59, 46, 0.08); border-radius: var(--radius-karta); box-shadow: 0 18px 44px rgba(11, 59, 46, 0.16); padding: 0.5rem; display: flex; flex-direction: column; opacity: 0; visibility: hidden; transition: opacity 0.22s ease, transform 0.22s ease, visibility 0s linear 0.22s; z-index: 1200; }  .nav-dropdown::after { content: ''; position: absolute; top: 100%; left: -1rem; right: -1rem; height: 1rem; } @media (hover: hover) and (min-width: 1101px) { .nav-dropdown:hover .nav-dropdown-menu, .nav-dropdown:focus-within .nav-dropdown-menu { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); transition-delay: 0s; } .nav-dropdown:hover .nav-dropdown-spoust svg { transform: rotate(180deg); } } .nav-dropdown-menu a { display: block; padding: 0.65rem 0.9rem; border-radius: var(--radius-input); color: var(--color-primary) !important; font-size: 0.92rem; transition: background 0.15s ease; } .nav-dropdown-menu a:hover { background: var(--color-bg-light); color: var(--color-accent) !important; }  @media (max-width: 1100px) { .nav-dropdown { flex-direction: column; align-items: stretch; } .nav-dropdown-spoust svg { display: none; } .nav-dropdown-menu { position: static; transform: none; opacity: 1; visibility: visible; box-shadow: none; border: 0; background: transparent; padding: 0 0 0 1.1rem; min-width: 0; } .nav-dropdown::after { display: none; } .nav-dropdown-menu a { font-size: 1rem; padding: 0.45rem 0; color: inherit !important; } }  .lok-ram { position: relative; margin-top: 3rem; } .lok-karusel { --lok-w: 300; position: relative; height: 470px; display: flex; align-items: center; justify-content: center; user-select: none; -webkit-user-select: none; touch-action: pan-y; } .lok-karta { position: absolute; width: calc(var(--lok-w) * 1px); height: calc(var(--lok-w) * 1.4 * 1px); border-radius: var(--radius-obrazek); overflow: hidden; background: var(--color-primary); box-shadow: 0 22px 46px -18px rgba(0, 0, 0, 0.55); transition: transform 0.55s cubic-bezier(0.5, 0, 0.2, 1), opacity 0.55s ease, box-shadow 0.4s ease; will-change: transform, opacity; cursor: pointer; } .lok-karta img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; } .lok-karta::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to top, rgba(10, 18, 12, 0.9) 0%, rgba(10, 18, 12, 0.25) 45%, transparent 75%); } .lok-karta-obsah { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; padding: 1.5rem; color: var(--color-white); } .lok-karta-obsah h3 { font-family: var(--font-heading); font-size: 1.375rem; margin-bottom: 0.35rem; color: var(--color-white); } .lok-karta-obsah p { font-size: 0.9rem; color: rgba(255, 255, 255, 0.85); opacity: 0; max-height: 0; transition: opacity 0.4s ease, max-height 0.4s ease; }  .lok-karta.je-stred .lok-karta-obsah p { opacity: 1; max-height: 80px; } .lok-karta.je-stred { box-shadow: 0 34px 64px -20px rgba(0, 0, 0, 0.65); } .lok-sipka { position: absolute; top: 50%; transform: translateY(-50%); width: 48px; height: 48px; border: 1px solid rgba(255, 255, 255, 0.35); border-radius: 50%; background: rgba(255, 255, 255, 0.08); color: var(--color-white); display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 60; transition: background 0.2s ease, border-color 0.2s ease; } .lok-sipka:hover { background: var(--color-accent); border-color: var(--color-accent); } .lok-prev { left: max(8px, calc(50% - 640px)); } .lok-next { right: max(8px, calc(50% - 640px)); } .lok-tecky { display: flex; justify-content: center; gap: 0.5rem; margin-top: 2rem; } .lok-tecka { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 50%; background: rgba(255, 255, 255, 0.3); cursor: pointer; transition: background 0.25s ease, width 0.25s ease; } .lok-tecka.je-aktivni { width: 24px; border-radius: 0; background: var(--color-accent); } @media (max-width: 900px) { .lok-karusel { --lok-w: 240; height: 390px; } } @media (max-width: 560px) { .lok-karusel { --lok-w: 178; height: 310px; }  .lok-sipka { width: 40px; height: 40px; top: auto; bottom: -8px; transform: none; } .lok-prev { left: 22%; } .lok-next { right: 22%; } .lok-tecky { margin-top: 4.2rem; } .lok-karta-obsah { padding: 0.9rem; } .lok-karta-obsah h3 { font-size: 1.125rem; } .lok-karta-obsah p { font-size: 0.82rem; } } @media (prefers-reduced-motion: reduce) { .lok-karta { transition: opacity 0.2s ease; } }  .hh-cta { position: relative; background: var(--color-primary); color: var(--color-white); padding: 6rem 0; overflow: hidden; } .hh-cta::before { content: ''; position: absolute; inset: 0; background: linear-gradient(135deg, rgba(11, 59, 46, 0.92) 0%, var(--color-primary-deep) 100%); z-index: 0; } .hh-cta-inner { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: clamp(2rem, 4vw, 3.5rem); align-items: flex-start; }  .hh-cta-karta { flex: 0 0 300px; display: flex; flex-direction: column; gap: 1.25rem; align-items: flex-start; min-width: 0; } .hh-cta-karta img { width: 100%; aspect-ratio: 300 / 340; object-fit: cover; object-position: center top; border-radius: var(--radius-obrazek); } .hh-cta-karta-meta { display: flex; flex-direction: column; gap: 0.75rem; width: 100%; } .hh-cta-jmeno { font-family: var(--font-heading); font-weight: 600; font-size: 1.35rem; color: var(--color-white); margin: 0; } .hh-cta-role { font-size: 0.92rem; color: rgba(255, 255, 255, 0.6); margin: -0.45rem 0 0; } .hh-cta-kontakty { display: flex; flex-direction: column; gap: 0.65rem; } .hh-cta-kontakt { display: inline-flex; align-items: center; gap: 0.7rem; color: rgba(255, 255, 255, 0.88); text-decoration: none; font-size: 0.95rem; transition: var(--transition-fast); } .hh-cta-kontakt:hover { color: var(--color-accent); } .hh-cta-kontakt i, .hh-cta-kontakt svg { width: 18px; height: 18px; flex: 0 0 18px; color: var(--color-accent); }  .hh-cta-form-wrap { flex: 1 1 420px; background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.1); border-radius: var(--radius-karta); padding: clamp(1.5rem, 4vw, 2.75rem); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); min-width: 0; } .hh-cta-form-wrap .section-subtitle { color: var(--color-accent); } .hh-cta-form-wrap h2 { font-family: var(--font-heading); font-size: clamp(1.5rem, 2.6vw, 1.75rem); color: var(--color-white); line-height: 1.1; margin: 0.35rem 0 0.75rem; } .hh-cta-form-wrap > p { color: rgba(255, 255, 255, 0.75); margin-bottom: 1.75rem; max-width: 52ch; }  .hh-cta .form-group label { color: rgba(255, 255, 255, 0.7); font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.04em; } .hh-cta .form-group input, .hh-cta .form-group textarea, .hh-cta .form-group select { width: 100%; border: 1px solid rgba(255, 255, 255, 0.25); border-radius: var(--radius-input); background: rgba(255, 255, 255, 0.08); color: var(--color-white); padding: 0.85rem 1rem; font-family: var(--font-body); font-size: 1rem; transition: var(--transition-fast); } .hh-cta .form-group select option { color: var(--color-text); } .hh-cta .form-group input::placeholder, .hh-cta .form-group textarea::placeholder { color: rgba(255, 255, 255, 0.4); } .hh-cta .form-group input:focus, .hh-cta .form-group textarea:focus, .hh-cta .form-group select:focus { outline: none; border-color: var(--color-accent); background: rgba(255, 255, 255, 0.12); } .hh-cta .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; } .hh-cta .contact-form, .hh-cta form { background: none; padding: 0; box-shadow: none; border-radius: 0; display: flex; flex-direction: column; gap: 1.1rem; } .hh-cta .btn-primary, .hh-cta button[type="submit"] { background: var(--color-accent);  color: var(--color-text); border: none; border-radius: var(--radius-tlacitko); padding: 1rem 2rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; font-size: 0.9rem; cursor: pointer; transition: var(--transition-smooth); } .hh-cta button[type="submit"]:hover { background: var(--color-accent-hover); transform: translateY(-2px); } .hh-cta .gdpr-poznamka { color: rgba(255, 255, 255, 0.72) !important; font-size: 0.85rem; } @media (max-width: 900px) { .hh-cta { padding: 4.5rem 0; } .hh-cta-inner { flex-direction: column; } .hh-cta-karta { flex-basis: auto; width: 100%; max-width: 320px; } .hh-cta .form-row { grid-template-columns: 1fr; } }   .hero::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: clamp(48px, 7vh, 90px); background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.06) 45%, rgba(255, 255, 255, 0.28) 72%, rgba(255, 255, 255, 0.68) 89%, var(--color-white) 100%); pointer-events: none; z-index: 2; }   .lok-karta-obsah { display: flex; flex-direction: column; align-items: flex-start; gap: 0.35rem; transition: padding-bottom 0.45s cubic-bezier(0.5, 0, 0.2, 1); } .lok-karta-cta { display: inline-flex; align-items: center; gap: 0.45rem; margin-top: 0.15rem; padding: 0; background: none; border: none; color: var(--color-accent); font-family: var(--font-body); font-size: 0.9rem; font-weight: 600; cursor: pointer; white-space: nowrap;  max-height: 0; opacity: 0; overflow: hidden; transform: translateY(10px); pointer-events: none; transition: max-height 0.4s cubic-bezier(0.5, 0, 0.2, 1), opacity 0.3s ease 0.12s, transform 0.4s cubic-bezier(0.5, 0, 0.2, 1) 0.08s; } .lok-karta-cta svg { width: 17px; height: 17px; transition: transform var(--transition-fast); } .lok-karta-cta:hover svg { transform: translateX(4px); } .lok-karta.je-stred .lok-karta-cta { max-height: 2rem; opacity: 1; transform: translateY(0); pointer-events: auto; } @media (max-width: 560px) { .lok-karta-cta { font-size: 0.82rem; }  .lok-karta.je-stred .lok-karta-obsah p { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } }  .approach-cinema { position: relative; background: url('/img/foto/benalmadena-marina.jpg') center 30%/cover no-repeat; overflow: hidden; } @media (min-width: 1024px) { .approach-cinema { background-attachment: fixed; } } .approach-cinema-obsah { position: relative; z-index: 2; padding: clamp(5rem, 10vw, 8rem) 0; background: linear-gradient(to bottom, var(--color-primary) 0%, rgba(11, 59, 46, 0.88) 10%, rgba(11, 59, 46, 0.74) 24%, rgba(11, 59, 46, 0.78) 82%, var(--color-bg) 100%); color: var(--color-white); } .approach-cinema-head { max-width: 720px; margin-bottom: 3rem; } .approach-cinema-head .section-subtitle { color: var(--color-accent); display: block; text-align: left; } .approach-cinema-head .section-title { color: var(--color-white); text-align: left; font-size: clamp(1.9rem, 3.2vw, 2.5rem); } .approach-zvyraz { color: rgba(255, 255, 255, 0.62); } .approach-cinema-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1.25rem; } .approach-cinema-card { background: rgba(255, 255, 255, 0.07); border: 1px solid rgba(255, 255, 255, 0.12); border-radius: var(--radius-karta); padding: 1.75rem; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1), background 0.3s ease; } .approach-cinema-card:hover { transform: translateY(-6px); background: rgba(255, 255, 255, 0.11); }  .approach-cinema-card .approach-icon { width: 52px; height: 52px; min-width: 52px; display: flex; align-items: center; justify-content: center; background: rgba(255, 255, 255, .10); border-radius: 50%; color: var(--color-accent); margin-bottom: 1.1rem; transition: background-color .35s, color .35s; }  .approach-cinema-card .approach-icon svg { width: 24px; height: 24px; stroke-width: 1.75; } .approach-cinema-card h3 { font-family: var(--font-heading); font-size: 1.125rem; margin-bottom: 0.6rem; color: var(--color-white); } .approach-cinema-card p { color: rgba(255, 255, 255, 0.78); line-height: 1.65; font-size: 0.95rem; }  .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; }  @media (max-width: 767px) {  .menu-toggle { display: flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; margin-right: -10px;  }  .lok-tecka { position: relative; } .lok-tecka::after { content: ''; position: absolute; left: 50%; top: 50%; width: 44px; height: 44px; transform: translate(-50%, -50%); } .hh-cta-kontakt, .sidebar-contact-link { min-height: 44px; padding: 0.35rem 0; } .footer-links a, .footer-legal a { display: inline-block; padding: 0.5rem 0; }  .footer-nav a, .footer-contact-info a { display: inline-block; padding: 0.55rem 0; } .lok-sipka { width: 44px; height: 44px; }  .lok-karta-cta { min-height: 32px; padding: 0.35rem 0; }   .form-group label, .hh-cta .form-group label, .filter-group label, label, .kstat-lbl, .pj-fact-lbl, .pj-link-eyebrow, .partners-title, .costa-stat-label { font-size: 0.85rem;  } .po-badge { font-size: 0.85rem; } .hero-subtitle, .btn-white, .btn-text { font-size: 0.9rem;  } }  .hodnoty { position: relative; background: var(--color-primary-deep); color: var(--color-white); isolation: isolate; }  .hod-fotky { position: absolute; inset: 0; z-index: 0; } .hod-foto { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.06); transition: opacity 0.9s ease, transform 1.6s cubic-bezier(0.22, 0.61, 0.36, 1); } .hod-foto.je-aktivni { opacity: 0.85; transform: scale(1); } .hod-pin { position: sticky; top: 0; min-height: 100vh; display: flex; align-items: center; overflow: hidden;  z-index: 1; }  .hod-pin::after { content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none;  background: linear-gradient(100deg, rgba(6, 42, 33, 0.95) 0%, rgba(6, 42, 33, 0.88) 34%, rgba(6, 42, 33, 0.55) 62%, rgba(6, 42, 33, 0.22) 100%); } .hod-mriz { position: relative; z-index: 2; } .hod-mriz { display: grid; grid-template-columns: minmax(0, 620px) 1fr 200px; gap: 3rem; align-items: center; width: 100%; padding-top: 4rem; padding-bottom: 4rem; } .hod-hlava { grid-column: 1 / -1; } .hod-panel { grid-column: 1 / 2; } .hod-osa { grid-column: 3 / 4; } .hod-hlava .section-title { color: var(--color-white); margin-bottom: 0; }  .hod-panel { display: grid; align-items: start; min-height: 260px; } .hod-krok { grid-area: 1 / 1; max-width: 640px; opacity: 0; transform: translateY(26px); transition: opacity 0.55s ease, transform 0.55s cubic-bezier(0.22, 0.61, 0.36, 1); pointer-events: none; } .hod-krok.je-aktivni { opacity: 1; transform: translateY(0); pointer-events: auto; } .hod-cislo { display: block; font-family: var(--font-heading); font-size: clamp(3.5rem, 7vw, 5.5rem); line-height: 1; color: var(--color-accent); margin-bottom: 0.75rem; } .hod-krok i, .hod-krok svg { width: 26px; height: 26px; color: var(--color-accent); margin-bottom: 1rem; } .hod-krok h3 {  color: var(--color-white); font-family: var(--font-heading); font-size: clamp(1.6rem, 3vw, 2.3rem); line-height: 1.15; margin-bottom: 0.9rem; } .hod-krok p { font-size: 1.05rem; line-height: 1.7; color: rgba(255, 255, 255, 0.82); max-width: 52ch; }  .hod-osa ol { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.35rem; }  .hod-osa { text-shadow: 0 1px 14px rgba(6, 42, 33, 0.95); } .hod-bod { display: flex; align-items: center; gap: 0.85rem; width: 100%; min-height: 44px; padding: 0; background: none; border: 0; cursor: pointer; text-align: left; font-family: var(--font-body); font-size: 0.9rem; color: rgba(255, 255, 255, 0.72); transition: color 0.3s ease; } .hod-bod-linka { flex: 0 0 34px; height: 2px; background: rgba(255, 255, 255, 0.55); transition: flex-basis 0.4s cubic-bezier(0.22, 0.61, 0.36, 1), background 0.3s ease; } .hod-bod:hover { color: rgba(255, 255, 255, 0.8); } .hod-bod:hover .hod-bod-linka { background: rgba(255, 255, 255, 0.5); } .hod-bod.je-aktivni { color: var(--color-white); } .hod-bod.je-aktivni .hod-bod-linka { flex-basis: 62px; background: var(--color-accent); } @media (max-width: 1024px) { .hod-mriz { grid-template-columns: minmax(0, 1fr); gap: 2.5rem; } .hod-osa { display: none; } }  @media (max-width: 767px), (prefers-reduced-motion: reduce) { .hodnoty { height: auto !important; } .hod-fotky { display: none; } .hod-pin { position: static; min-height: 0; background: none; } .hod-panel { display: flex; flex-direction: column; gap: 3rem; min-height: 0; } .hod-krok { grid-area: auto; opacity: 1; transform: none; pointer-events: auto; padding-bottom: 2rem; border-bottom: 1px solid rgba(255, 255, 255, 0.12); } .hod-krok:last-child { border-bottom: 0; padding-bottom: 0; } .hod-cislo { font-size: 2.75rem; } }  @media (min-width: 768px) { .hodnoty:not(.is-pinned) .hod-panel { align-items: center; } }  .breadcrumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem; font-size: 0.85rem; color: var(--color-text-light); margin-bottom: 1.5rem; } .breadcrumbs a { color: var(--color-text-light); text-decoration: none; } .breadcrumbs a:hover { color: var(--color-accent); } .breadcrumbs .bc-current { color: var(--color-primary); font-weight: 500; } .breadcrumbs .bc-sep { opacity: 0.5; } .breadcrumbs-svetle { color: rgba(255, 255, 255, 0.72); } .breadcrumbs-svetle a { color: rgba(255, 255, 255, 0.72); } .breadcrumbs-svetle a:hover { color: var(--color-accent); } .breadcrumbs-svetle .bc-current { color: var(--color-white); }  .section.pravni-sekce { padding-top: 10rem; min-height: 70vh; } .pravni-titulek { text-align: left; } .pravni-text { line-height: 1.8; color: var(--color-text); font-size: 1.05rem; } .pravni-text .pravni-nadpis, .pravni-nadpis { font-family: var(--font-heading); margin-top: 2rem; margin-bottom: 1rem; font-size: 1.5rem; color: var(--color-primary); } .pravni-seznam { margin-left: 1.5rem; margin-bottom: 1.5rem; }  .katalog-odkaz-cely { text-align: center; margin-top: 2rem; }  .nabidka-prazdna { color: var(--color-text-light); text-align: center; padding: 3rem; }  .nl-msg { font-size: .8rem; margin-top: .5rem; color: #3fb950; }  #sluzby .sluzby-hlava { margin-bottom: 3rem; }   .hero-services { height: 80vh; min-height: 600px; background-color: var(--color-primary); } .hero-services .hero-text-wrapper { max-width: 65%;  } .hero-services .hero-content { display: flex; justify-content: space-between; align-items: center; width: 100%; } .hero-services.split-hero { display: flex; flex-direction: row; padding-top: 100px;  padding-bottom: 0; align-items: stretch; } .hero-text-side { flex: 0 0 60%; display: flex; flex-direction: column; justify-content: center; padding: 4rem 5%; position: relative; z-index: 2; } .hero-image-side { flex: 0 0 40%; position: relative; } .hero-image-side img { width: 100%; height: 100%; object-fit: cover; display: block; } @media (max-width: 900px) { .hero-services.split-hero { flex-direction: column; height: auto; } .hero-text-side { flex: 1; padding-top: 6rem; } .hero-image-side { height: 400px; flex: none; } }  .urgency-widget { background: rgba(255, 255, 255, 0.1); backdrop-filter: blur(10px); border: 1px solid rgba(255, 255, 255, 0.2); padding: 1.5rem; border-radius: 8px; margin-top: 2rem; max-width: 300px; } .urgency-title { font-size: 0.8rem; text-transform: uppercase; letter-spacing: 1px; color: var(--color-accent); margin-bottom: 0.5rem; } .urgency-number { font-size: 2rem; font-family: var(--font-heading); color: var(--color-white); margin-bottom: 1rem; } .progress-bar-container { width: 100%; height: 6px; background: rgba(255, 255, 255, 0.2); border-radius: 3px; overflow: hidden; margin-bottom: 0.5rem; } .progress-bar-fill { height: 100%; background: var(--color-accent); width: 0;  } .progress-text { font-size: 0.85rem; color: var(--color-accent); }  .smart-filter-section { background: var(--color-primary); padding: 3.5rem 0 3rem; color: var(--color-white); position: relative; overflow: hidden; } .smart-filter-section::before { content: ''; position: absolute; inset: 0; background: linear-gradient(135deg, rgba(11, 59, 46, 0.55) 0%, rgba(6, 42, 33, 0.95) 100%); pointer-events: none; } .smart-filter-section .container { position: relative; z-index: 1; } .smart-filter-section .section-title { color: var(--color-white); text-align: left; } .smart-filter-section > .container > p { color: rgba(255, 255, 255, 0.7) !important; } .filter-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 1rem; margin-top: 1.75rem; align-items: end; background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.1); border-radius: var(--radius-karta); padding: 1.5rem; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); } .filter-group { display: flex; flex-direction: column; gap: 0.45rem; } .filter-group label { font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: rgba(255, 255, 255, 0.65); } .filter-group select { padding: 0.9rem 2.4rem 0.9rem 1rem; border: 1px solid rgba(255, 255, 255, 0.25); border-radius: var(--radius-input); font-family: var(--font-body); font-size: 0.98rem; background-color: rgba(255, 255, 255, 0.08); color: var(--color-white); cursor: pointer; appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23C3996A' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 0.9rem center; transition: border-color 0.2s ease, background-color 0.2s ease; } .filter-group select:hover { border-color: rgba(255, 255, 255, 0.45); } .filter-group select:focus { outline: none; border-color: var(--color-accent); background-color: rgba(255, 255, 255, 0.12); } .filter-group select option { color: var(--color-text); background: var(--color-white); } .filter-checkbox { display: flex; align-items: center; gap: 0.7rem; cursor: pointer; background: rgba(195, 153, 106, 0.14); padding: 0.9rem 1rem; border: 1px solid rgba(195, 153, 106, 0.4); border-radius: var(--radius-input); transition: background 0.2s ease; } .filter-checkbox:hover { background: rgba(195, 153, 106, 0.22); } .filter-checkbox input { width: 18px; height: 18px; accent-color: var(--color-accent); } .filter-checkbox span { color: var(--color-white); font-weight: 500; font-size: 0.95rem; } .filter-results-text { margin-top: 1.4rem; font-size: 0.95rem; color: rgba(255, 255, 255, 0.75); display: flex; align-items: center; gap: 1rem; } .results-bar { flex: 1; max-width: 200px; height: 4px; background: rgba(255, 255, 255, 0.15); border-radius: 2px; overflow: hidden; } .results-fill { height: 100%;  background: var(--color-bg); width: 30%; border-radius: 2px; transition: width 0.5s ease; }  .card-roi { color: var(--color-accent-hover); font-weight: 600; font-size: 0.95rem; margin-top: 0.5rem; display: flex; align-items: center; gap: 0.4rem; } .badge-tip { background: var(--color-accent); color: var(--color-white); } .badge-rezervovano { background: var(--color-text-light); color: var(--color-white); }  .edu-list { display: flex; flex-direction: column; gap: 2rem; margin-top: 3rem; } .edu-item { border-radius: var(--radius-karta); display: flex; gap: 1.5rem; align-items: flex-start; padding: 2rem; background: var(--color-white); border: 1px solid rgba(11, 59, 46, .08); box-shadow: 0 1px 2px rgba(6, 42, 33, .04), 0 8px 24px -12px rgba(6, 42, 33, .10); }  .edu-icon { width: 52px; height: 52px; min-width: 52px; background: rgba(11, 59, 46, .07);  color: var(--color-primary); display: flex; align-items: center; justify-content: center; border-radius: 50%; transition: background-color .35s, color .35s; } .edu-icon svg { width: 24px; height: 24px; stroke-width: 1.75; } .edu-content h3 { margin-bottom: 0.5rem; font-size: 1.125rem; }  .process-timeline-hz { display: flex; justify-content: space-between; margin-top: 4rem; position: relative; } .process-timeline-hz::before { content: ''; position: absolute; top: 25px; left: 5%; right: 5%; height: 2px; background: rgba(0,0,0,0.1); z-index: 0; } .timeline-step { position: relative; z-index: 1; text-align: center; width: 22%; background: var(--color-bg); } .step-dot { width: 50px; height: 50px; background: var(--color-white); border: 2px solid var(--color-accent); color: var(--color-accent); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-family: var(--font-heading); font-size: 1.2rem; margin: 0 auto 1.5rem; } .timeline-step h3 { font-size: 1.125rem; margin-bottom: 0.5rem; } .timeline-step p { font-size: 0.9rem; color: var(--color-text-light); } @media (max-width: 768px) { .process-timeline-hz { flex-direction: column; gap: 3rem; } .process-timeline-hz::before { top: 0; left: 25px; width: 2px; height: 100%; } .timeline-step { width: 100%; display: flex; text-align: left; gap: 1.5rem; background: transparent; } .step-dot { margin: 0; min-width: 50px; } }  .timeline-vertical { position: relative; margin-top: 4rem; padding-left: 2rem; } .timeline-vertical::before { content: ''; position: absolute; top: 0; left: 0; width: 2px; height: 100%; background: rgba(0,0,0,0.1); } .timeline-v-step { position: relative; padding-bottom: 3rem; } .timeline-v-dot { position: absolute; left: -2.4rem; top: 0; width: 14px; height: 14px; background: var(--color-white); border: 3px solid var(--color-primary); border-radius: 50%; } .timeline-v-step.final .timeline-v-dot { background: var(--color-primary); border-color: var(--color-primary); } .timeline-v-content { background: var(--color-white); padding: 2rem; border-radius: var(--radius-karta); box-shadow: 0 5px 15px rgba(0,0,0,0.03); } .timeline-v-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 1rem; } .timeline-v-duration { font-size: 0.85rem;  color: var(--color-text-light); text-transform: uppercase; font-weight: 600; }  .garance-karta { max-width: 800px; margin: 0 auto; text-align: left; padding: 3rem; background: var(--color-white); border-left: 1px solid var(--color-primary); border-radius: var(--radius-karta); position: relative; } .garance-karta h3 { font-size: 1.125rem; margin-bottom: 0.75rem; } .garance-text { font-size: 1.0625rem; color: var(--color-text) !important; margin-bottom: 0; position: relative; z-index: 1; }  .sticky-cta-banner { background: var(--color-primary); color: var(--color-white); padding: 4rem 0; } .sticky-cta-content { display: flex; justify-content: space-between; align-items: center; } .sticky-cta-text h4 { font-size: 1.2rem; margin-bottom: 0.2rem; } .sticky-cta-text p { font-size: 0.9rem; color: rgba(255,255,255,0.7); margin: 0; } @media (max-width: 768px) { .sticky-cta-content { flex-direction: column; text-align: center; gap: 1rem; } }  .metrics-bar { display: flex; gap: 2rem; margin-top: 2rem; } .metric-item { display: flex; flex-direction: column; } .metric-val { font-family: var(--font-heading); font-size: 2rem; color: var(--color-accent); line-height: 1.2; } .metric-label { font-size: 0.8rem; text-transform: uppercase; color: rgba(255,255,255,0.7); }  .payment-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: rgba(0,0,0,0.1); border: 1px solid rgba(0,0,0,0.1); } .payment-box { background: var(--color-white); padding: 3rem 2rem; text-align: center; } .payment-title { font-size: 0.9rem; text-transform: uppercase; letter-spacing: 1px; color: var(--color-text-light); margin-bottom: 1rem; } .payment-amount { font-family: var(--font-heading); font-size: 2.5rem; color: var(--color-primary); margin-bottom: 0.5rem; } .payment-desc {  color: var(--color-text-light); font-weight: 500; } @media (max-width: 768px) { .payment-grid { grid-template-columns: 1fr; } }  .split-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; } .qualify-card { background: var(--color-white); padding: 3rem; box-shadow: 0 5px 15px rgba(0,0,0,0.03); } .qualify-card h3 { margin-bottom: 2rem; font-size: 1.5rem; } .qualify-list { list-style: none; margin-bottom: 2rem; } .qualify-list li { display: flex; align-items: center; gap: 1rem; margin-bottom: 1rem; font-size: 1.05rem; } .qualify-list li .lucide { color: var(--color-accent); min-width: 20px; } .qualify-card.alt { background: var(--color-bg-light); }  .valuation-form-container { background: var(--color-white); padding: 4rem; box-shadow: 0 15px 40px rgba(0,0,0,0.05); margin-top: -5rem; position: relative; z-index: 10; } .val-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; } .val-form-full { grid-column: 1 / -1; } .radio-group { display: flex; gap: 1.5rem; margin-top: 0.5rem; } .radio-group label { display: flex; align-items: center; gap: 0.5rem; font-weight: 400; cursor: pointer; } @media (max-width: 768px) { .val-form-grid { grid-template-columns: 1fr; } .valuation-form-container { padding: 2rem; margin-top: 0; } }  .hh-prodej-pas { display: flex; align-items: center; justify-content: space-between; gap: 2rem; flex-wrap: wrap; background: var(--color-white); border: 1px solid rgba(11, 59, 46, 0.1); border-radius: var(--radius-karta); padding: 2rem 2.5rem; } .hh-prodej-pas h3 { font-family: var(--font-heading); font-size: 1.375rem; color: var(--color-primary); margin-bottom: 0.35rem; } .hh-prodej-pas p { color: var(--color-text-light); margin: 0; } .hh-prodej-pas .btn-primary { flex-shrink: 0; }  .timeline-v-header h3 { font-size: 1.125rem; margin: 0; } .timeline-v-krok-cislo { color: var(--color-primary); margin-right: 0.5rem; } .timeline-v-kanaly { font-size: 0.85rem; color: var(--color-text-light); text-transform: uppercase; font-weight: 600; letter-spacing: 0.04em; margin-bottom: 1rem; } .hero-description { font-size: 1.1rem; max-width: 550px; } .hero-services .hero-description { color: rgba(255, 255, 255, 0.9); }  .sluzby-predel { position: relative; min-height: 46vh; display: flex; align-items: center; background-color: var(--color-primary-deep); background-size: cover; background-position: center; color: var(--color-white); padding: 5rem 0; overflow: hidden; isolation: isolate; } .sluzby-predel::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(105deg, rgba(6, 42, 33, .93) 0%, rgba(6, 42, 33, .84) 34%, rgba(11, 59, 46, .62) 62%, rgba(6, 42, 33, .34) 100%); } .sluzby-predel > .container { width: 100%; } .sluzby-predel-obsah { max-width: 620px; } .sluzby-predel .section-subtitle { display: block; text-align: left; color: rgba(255, 255, 255, 0.75); margin-bottom: 1rem; } .sluzby-predel h2 { color: var(--color-white); font-size: clamp(1.75rem, 3.4vw, 2.5rem); margin-bottom: 1.25rem; } .sluzby-predel p { color: rgba(255, 255, 255, 0.82); font-size: 1.05rem; max-width: 52ch; margin-bottom: 0; } @media (max-width: 768px) { .sluzby-predel { min-height: 0; padding: 3.5rem 0; }  .sluzby-predel::after { background: linear-gradient(180deg, rgba(6, 42, 33, .30) 0%, rgba(6, 42, 33, .62) 38%, rgba(6, 42, 33, .88) 100%); } .sluzby-predel { align-items: flex-end; min-height: 0; padding: 14rem 0 3rem; background-position: center 28%; } }  :root { --ease-out: cubic-bezier(.16, 1, .3, 1); --hairline: rgba(11, 59, 46, .16); } body { -webkit-font-smoothing: antialiased; } ::selection { background: #d9c2a3; color: var(--color-primary-deep); } :focus-visible { outline: 2px solid currentColor; outline-offset: 5px; } [hidden] { display: none !important; } button, a, input, select, textarea { touch-action: manipulation; } input, select, textarea { font-size: max(1rem, 16px); } .sort-select, .sheet-sort-select, .price-inputs input { font-size: 16px; } section[id] { scroll-margin-top: 96px; } .btn-primary, .navbar.scrolled .btn-primary { color: var(--color-primary-deep); } .btn-primary, .btn-secondary { transition: background-color .2s, color .2s, border-color .2s; } .btn-primary:hover, .btn-secondary:hover { transform: none; box-shadow: none; } .btn-primary:hover { background: #d3ad80; color: var(--color-primary-deep); } .section-subtitle { color: var(--color-text-light); } .hh-cta .section-subtitle, .hod-hlava .section-subtitle { color: #dce5df; } .btn-text { color: var(--color-primary); min-height: 44px; } .sluzby-predel .btn-text, .intent-content .btn-text { color: white; }  .navbar { background: transparent; padding: 12px 0; transition: background-color .2s, box-shadow .2s; } .navbar.scrolled { padding: 12px 0; background: var(--color-bg); box-shadow: 0 1px 0 var(--hairline); } .service-page .navbar .logo, .service-page .navbar .nav-links a:not(.btn-primary), .service-page .navbar .menu-toggle { color: var(--color-primary); } .service-page .navbar .logo span { color: var(--color-text-light); } .logo { font-weight: 500; font-size: 21px; letter-spacing: .025em; } .logo span { font-size: 11px; font-weight: 400; color: #dbc5a8; letter-spacing: .2em; } .navbar:not(.scrolled) .logo span { color: white; } .service-page .navbar:not(.scrolled) .logo span { color: var(--color-text-light); } .navbar.scrolled .logo span { color: var(--color-text-light); } .nav-links { gap: 1.25rem; } .nav-links a:not(.btn-primary)::before { border-radius: var(--radius-input); background: rgba(255,255,255,.12); } .navbar.scrolled .nav-links a:not(.btn-primary):hover { color: var(--color-primary); } .navbar.scrolled .nav-links a:not(.btn-primary)::before { background: var(--color-bg-light); } .nav-dropdown-menu a:hover { color: var(--color-primary) !important; }  .hero { background-color: var(--color-primary-deep); isolation: isolate; padding-top: 120px; min-height: 620px; height: 92svh; max-height: 900px; } .hero-bg { z-index: -2; } .hero-text-wrapper { animation: none; } .hero-title { font-weight: 400; max-width: 19ch; } .hero-description { font-weight: 400; opacity: 1; max-width: 49ch; } .hero-subtitle { color: #fff; font-size: 13px; letter-spacing: .09em; } .hero-overlay { background: linear-gradient(180deg,rgba(6,42,33,.72),transparent 220px), linear-gradient(90deg,rgba(6,42,33,.8),rgba(6,42,33,.15)), linear-gradient(0deg,rgba(6,42,33,.35),transparent 80%); } .trust-bar { background: var(--color-bg); padding: 28px 0; border-bottom: 1px solid var(--hairline); } .trust-grid { gap: 1.5rem; } .trust-item { display: flex; flex-direction: row; justify-content: center; align-items: center; gap: 12px; }  .trust-number { color: var(--color-primary); font-size: 1rem; margin: 0; line-height: 1; width: 40px; height: 40px; min-width: 40px; border-radius: 50%; background: rgba(11, 59, 46, .07); display: flex; align-items: center; justify-content: center; transition: background-color .35s, color .35s; } .trust-number svg { width: 18px; height: 18px; stroke-width: 1.75; } .trust-label { font-size: 14px; text-transform: none; letter-spacing: 0; } .hod-cislo { color: #e4d7c6; font-weight: 400; } .hod-krok > svg { display: none; } .hod-krok { transition: opacity .25s, transform .3s var(--ease-out); } .hod-foto { transform: none; transition: opacity .3s; } .hod-krok p { line-height: 1.6; } .hod-bod { color: #e3e9e5; } .hod-bod-linka { transition: background-color .2s; } .home-listing-controls { display: none; }  @media (max-width: 1100px) { .nav-links { visibility: hidden; overflow-y: auto; height: 100dvh; gap: 8px; padding: 84px 24px 32px; overscroll-behavior: contain; } .nav-links.active { visibility: visible; } .nav-links::after { display: none; } .nav-links a:not(.btn-primary) { font-size: 20px; padding: 10px 0; min-height: 44px; } .nav-dropdown-menu a:not(.btn-primary) { font-family: var(--font-body); font-size: 16px; } .nav-links .btn-primary { margin-top: 12px; padding: 14px 16px; font-size: 16px; } .menu-toggle { min-height: 44px; min-width: 44px; } .menu-toggle[aria-expanded="true"] { color: var(--color-primary); } .nav-overlay { backdrop-filter: none; } } @media (max-width: 767px) { .navbar, .navbar.scrolled { padding: 10px 0; } .logo { font-size: 19px; } .logo span { font-size: 10px; } .hero { height: auto; min-height: min(760px, 100svh); max-height: none; padding: 150px 0 72px; } .hero-content { padding-inline: 24px; } .hero-title { font-size: 40px; line-height: 1.1; margin-bottom: 20px; } .hero-description { font-size: 17px; line-height: 1.55; margin-bottom: 24px; } .hero-subtitle { font-size: 12px; padding: 0; border: 0; border-radius: 0; background: none; backdrop-filter: none; margin-bottom: 18px; } .hero-cta { gap: 10px; } .trust-bar { padding: 20px 0; } .trust-grid, .trust-grid.trust-grid-4 { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 14px 24px; } .trust-item { justify-content: flex-start; gap: 8px; } .trust-label { font-size: 13px; line-height: 1.35; } .trust-number svg { width: 18px; height: 18px; } .section { padding-block: 56px; } .section-title, .section h2 { line-height: 1.2; } .intent-section .section-header { text-align: left; margin-bottom: 24px !important; } .intent-grid-v2 { gap: 16px; } .intent-card-v2 { min-height: 240px; height: 240px; } .hod-mriz { padding-block: 56px; gap: 28px; } .hod-panel { gap: 0; } .hod-krok { display: grid; grid-template-columns: 36px minmax(0,1fr); gap: 0 12px; padding: 24px 0; max-width: none; } .hod-krok:first-child { padding-top: 0; } .hod-cislo { grid-column: 1; grid-row: 1 / 3; font-size: 25px; margin: 2px 0 0; } .hod-krok h3 { grid-column: 2; font-size: 23px; line-height: 1.2; margin-bottom: 8px; } .hod-krok p { grid-column: 2; font-size: 16px; line-height: 1.55; margin-bottom: 0; } .about-image-side { max-height: 460px; overflow: hidden; border-radius: var(--radius-obrazek); } .about-image-side img { height: 100%; width: 100%; object-fit: cover; object-position: center 30%; } .about-split-article { gap: 28px; } #katalog .section-header { text-align: left; } #katalog .catalog-filters { justify-content: flex-start; gap: 8px; margin-block: 24px; } #katalog .filter-btn { min-height: 44px; font-size: 14px; } #homepage-listings-grid { display: grid; grid-auto-flow: column; grid-auto-columns: 86%; grid-template-columns: none; gap: 16px; overflow-x: auto; scroll-snap-type: x proximity; scroll-padding-inline: 0; padding: 0 0 16px; scrollbar-width: thin; scrollbar-color: #9caea4 transparent; } #homepage-listings-grid .property-overlay-card { scroll-snap-align: start; min-width: 0; height: 410px; transform: none; } .home-listing-controls { display: flex; justify-content: space-between; align-items: center; margin-top: 8px; gap: 16px; color: var(--color-text-light); font-size: 14px; } .home-listing-arrows { display: flex; gap: 8px; } .home-listing-arrows button { width: 44px; height: 44px; border: 1px solid var(--hairline); border-radius: 50%; background: transparent; color: var(--color-primary); cursor: pointer; } .home-listing-arrows button:disabled { opacity: .35; cursor: default; } .hh-cta .form-group input, .hh-cta .form-group textarea { font-size: 16px; } .hh-cta-inner { gap: 32px; } .hh-cta-karta img { max-height: 340px; object-fit: cover; object-position: center 25%; } .lok-karta-cta { min-height: 44px; } } @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { animation: none !important; transition-duration: .01ms !important; scroll-behavior: auto !important; } .hod-krok { opacity: 1; transform: none; } .hod-mriz { display: block; } .hod-panel { margin-top: 32px; } .hod-osa { display: none; } }  .service-page .hero-services.split-hero { background: var(--color-bg); color: var(--color-text); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .95fr); gap: 5%; height: auto; min-height: 0; padding: 132px max(5%, calc((100vw - 1256px)/2)) 64px; align-items: center; } .service-page .hero-text-side { padding: 0; display: block; } .service-page .hero-title { color: var(--color-primary); max-width: 17ch; margin-bottom: 24px; } .service-page .hero-description { color: var(--color-text-light); font-size: 18px; line-height: 1.6; max-width: 47ch; margin-bottom: 24px !important; } .service-page .hero-subtitle { color: var(--color-text-light); font-size: 13px; margin-bottom: 20px; } .service-page .hero-text-side > ul { color: var(--color-text-light) !important; font-size: 15px; line-height: 1.5; margin-bottom: 24px !important; } .service-page .hero-text-side > ul svg { color: var(--color-primary) !important; } .service-page .hero-cta { flex-wrap: wrap; gap: 12px; margin-bottom: 0 !important; } .service-page .hero-cta .btn-secondary { color: var(--color-primary); border-color: var(--hairline); } .service-page .hero-cta a { padding: 14px 22px; font-size: 15px; min-height: 52px; } .service-page .hero-image-side { height: 550px; width: 100%; border-radius: var(--radius-obrazek); overflow: hidden; } .service-page .hero-image-side img { border-radius: 0; object-position: center; } .service-page .section { padding-block: 80px; } .service-page .section-title.text-center, .service-page .section-text.text-center { text-align: left; margin-left: 0 !important; } .service-page section:has(.edu-list) > .container { display: grid; grid-template-columns: .8fr 1.2fr; gap: 16px 64px; align-items: start; } .service-page section:has(.edu-list) .section-title { grid-column: 1; max-width: 18ch; text-align: left; } .service-page section:has(.edu-list) .section-text { grid-column: 1; } .service-page .edu-list { grid-column: 2; grid-row: 1 / span 3; margin: 0; gap: 0; } .service-page .edu-item { padding: 24px 0; border-radius: 0; background: transparent; box-shadow: none; border-bottom: 1px solid var(--hairline); gap: 20px; } .service-page .edu-item:first-child { padding-top: 0; } .service-page .edu-item:last-child { padding-bottom: 0; border-bottom: 0; }  .service-page .edu-icon { margin-bottom: 0; } .service-page .edu-content h3 { font-size: 25px; line-height: 1.2; margin-bottom: 10px; } .service-page .edu-content p { max-width: 55ch; color: var(--color-text-light); margin: 0; } .service-page .process-grid { gap: 0; } .service-page .process-card { background: transparent; border-radius: 0; box-shadow: none; border: 0; border-top: 1px solid var(--hairline); padding: 24px 24px 0 0; text-align: left; } .service-page .process-number { position: static; opacity: 1; color: var(--color-text-light); font-size: 22px; line-height: 1; margin-bottom: 24px; }  .service-page .process-card h3 { font-size: 22px; line-height: 1.2; } .service-page .process-card p { color: var(--color-text-light); } .service-page .service-card, .service-page .calc-card { padding: 24px 24px 24px 0; border: 0; border-top: 1px solid var(--hairline); border-radius: 0; box-shadow: none; background: transparent; text-align: left; }  .service-page .calc-card h3, .service-page .service-card h3 { font-size: 25px; line-height: 1.2; } .service-page .garance-karta { background: transparent; padding: 0; border: 0; max-width: 760px; } .service-page .garance-karta .section-title, .service-page .garance-karta .garance-text { color: white !important; } .service-page .garance-text { font-size: 18px; line-height: 1.65; } .service-page .timeline-v-content { background: transparent; box-shadow: none; border: 0 !important; padding: 0 0 8px 24px; } .service-page .timeline-v-header h3 { font-size: 25px; line-height: 1.2; } .service-page .timeline-v-duration { text-transform: none; letter-spacing: 0; } .service-page .timeline-v-step { padding-bottom: 36px; } .service-page .payment-grid { border: 0; border-radius: var(--radius-karta); overflow: hidden; } .service-page .payment-box { text-align: left; padding: 28px; } .service-page .filter-form { box-shadow: none; backdrop-filter: none; background: transparent; border: 0; padding: 0; } .service-page .filter-group label { color: #dae4df; font-size: 13px; text-transform: none; letter-spacing: 0; } .service-page .filter-group select { font-size: 16px; min-height: 52px; } .service-page .results-bar { display: none; } .service-page .sluzby-predel .container { width: 100%; } @media (max-width: 900px) { .service-page .hero-services.split-hero { grid-template-columns: 1fr 1fr; padding: 116px 24px 48px; gap: 24px; } .service-page .hero-image-side { height: 500px; } .service-page .hero-title { font-size: 40px; } .service-page .hero-description { font-size: 17px; } .service-page section:has(.edu-list) > .container { column-gap: 32px; } } @media (max-width: 767px) { .service-page .hero-services.split-hero { grid-template-columns: 1fr; padding: 112px 24px 40px; gap: 28px; } .service-page .hero-text-side { padding: 0; } .service-page .hero-title { font-size: 40px; line-height: 1.1; max-width: 16ch; margin-bottom: 18px; } .service-page .hero-subtitle { margin-bottom: 14px; font-size: 12px; } .service-page .hero-description { font-size: 17px; line-height: 1.55; margin-bottom: 20px !important; } .service-page .hero-image-side { height: 230px; } .service-page .hero-cta { flex-direction: row; align-items: center; } .service-page .hero-cta a { padding: 13px 18px; font-size: 14px; } .service-page .hero-text-side > ul { font-size: 14px; order: 3; } .service-page .section { padding-block: 56px; } .service-page .smart-filter-section { padding-block: 36px; } .service-page .filter-form { grid-template-columns: 1fr 1fr; gap: 16px 12px; } .service-page .filter-group select { padding-left: 10px; } .service-page .filter-group:has(.filter-checkbox) { grid-column: 1 / -1; } .service-page section:has(.edu-list) > .container { display: block; } .service-page .edu-list { margin-top: 32px; } .service-page .edu-content h3 { font-size: 23px; } .service-page .edu-item { gap: 14px; } .service-page .calc-grid { grid-template-columns: 1fr; gap: 0; } .service-page .service-card, .service-page .calc-card { padding: 24px 0; } .service-page .services-grid { gap: 0; } .service-page .process-grid { display: block; } .service-page .process-card { display: grid; grid-template-columns: 32px 1fr; column-gap: 16px; padding: 24px 0; } .service-page .process-number { grid-row: 1 / span 2; margin: 2px 0 0; font-size: 20px; } .service-page .process-card h3, .service-page .process-card p { grid-column: 2; } .service-page .process-card p { margin: 0; } .service-page .timeline-v-content { padding-left: 12px; } .service-page .timeline-v-header h3 { font-size: 23px; } .service-page .payment-box { padding: 24px; } }  .cds-mesto-btn.btn-text { color: var(--color-primary); } @media (max-width: 560px) { .cds-hero { padding-top: 132px; padding-bottom: 104px; } .cds-hero h1 { font-size: 40px; line-height: 1.1; } .cds-kpi { grid-template-columns: 1fr 1fr; margin-top: -48px; } .cds-kpi-bunka { padding: 20px 16px; } .cds-kpi-bunka:nth-child(2) { border-top: 0; }  .cds-kpi-bunka:nth-child(even) { border-left: 1px solid var(--hairline); } }  .hodnoty:not(.is-pinned) { height: auto !important; } .hodnoty:not(.is-pinned) .hod-pin { position: relative; min-height: 0; } .hodnoty:not(.is-pinned) .hod-fotky, .hodnoty:not(.is-pinned) .hod-osa { display: none; } .hodnoty:not(.is-pinned) .hod-panel { display: flex; flex-direction: column; gap: 0; } .hodnoty:not(.is-pinned) .hod-krok { opacity: 1; transform: none; pointer-events: auto; grid-area: auto; } .hodnoty:not(.is-pinned) .hod-mriz { grid-template-columns: 1fr; } @media (min-width: 768px) { .hodnoty:not(.is-pinned) .hod-krok { padding-block: 24px; } } html { scroll-behavior: auto; } html[data-noanim] *, html[data-noanim] *::before, html[data-noanim] *::after { transition: none !important; animation: none !important; } .locations .section-subtitle { color: #dce5df; } .service-page .garance-karta[style] .garance-text { color: var(--color-text) !important; } .catalog-title { font-size: 32px; line-height: 1.15; max-width: 20ch; margin: 0 0 24px; } .form-status { margin: 18px 0 0; padding: 14px 16px; background: var(--color-bg); color: var(--color-primary-deep); border-radius: var(--radius-input); font-size: 15px; line-height: 1.5; } .form-status:empty { display: none; } @media (max-width: 767px) { .catalog-title { font-size: 28px; } .service-page div:has(> .garance-karta) { grid-template-columns: minmax(0,1fr) !important; } .service-page .garance-karta[style] { padding: 24px !important; } }  .hod-krok { transition: none; transform: none; } a.property-overlay-card { display: block; } .costa-hero { background-attachment: scroll; } .costa-hero::before { background: linear-gradient(180deg,rgba(6,42,33,.7),rgba(6,42,33,.8)); } .costa-hero-title, .costa-stat-val { color: white; text-shadow: none; } .costa-hero-subtitle { letter-spacing: .1em; } .lok-karta-cta { min-height: 44px; } .hh-cta .form-group input, .hh-cta .form-group textarea, .newsletter-form-modern input, .filter-group select { font-size: 16px; } .service-page p { max-width: 65ch; } .service-page .section-text { max-width: 65ch !important; } .po-price, .cds-count, .catalog-title, .payment-amount { font-variant-numeric: tabular-nums; } .listing-empty { grid-column: 1 / -1; max-width: 660px; padding: 24px 0; } .listing-empty p { font-size: 18px; color: var(--color-text-light); margin-bottom: 24px; } .listing-empty-link { display: inline-flex; padding: 16px; text-decoration: underline; text-underline-offset: 4px; } .cds-foto-blok { margin-bottom: 40px; } @media (max-width: 767px) { .cds-dlazdice-cislo, .cds-dlazdice-cislo .cds-count { font-size: 32px; line-height: 1.15; } .lightbox.active .lightbox-nav { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; top: auto; bottom: 32px; transform: none; } .lightbox.active .lightbox-prev { left: 24px; } .lightbox.active .lightbox-next { right: 24px; } } .hod-cislo { letter-spacing: -.02em; }  :root { --radius-karta: 0px; --radius-tlacitko: 0px; --radius-obrazek: 0px; --radius-input: 0px; --radius-stitek: 0px;  --sc-canvas: var(--color-bg); --sc-surface: var(--color-bg-light); --sc-ink: #12241E; --sc-ink-soft: #55685F; --sc-accent: #C3996A; --sc-accent-ink: #062A21; --sc-font-display: 'Sentient', serif; --sc-font-text: 'Switzer', sans-serif; --sc-r-sm: 0px; --sc-r-md: 0px; --sc-r-lg: 0px; } html, body { overflow-x: clip; } body { letter-spacing: normal; } body img, body video, body iframe, body figure { border-radius: 0 !important; } body :is(button, input, textarea, select, article, .contact-wrapper, .contact-form, .nav-dropdown-menu, .lok-popup-okno, .cookie-banner, .cookie-modal, .po-badge, .pj-lb__counter, .pj-feature, .detail-feature, .filter-sheet) { border-radius: 0 !important; } .hero { height: 100svh; min-height: 100svh; max-height: none; padding: 120px 0 clamp(56px, 8vh, 104px); overflow: clip; } .hero::after { display: none; } .hero-bg { height: 112%; top: -6%; } .hero-poster { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; } .hero video.hero-bg { pointer-events: none; } .hero:not(.hero-video-playing) video.hero-bg { opacity: 0 !important; } .hero > .hero-overlay { pointer-events: none; } .hero-video-playing video.hero-bg { opacity: 1 !important; } .hero-video-playing .hero-poster { visibility: hidden; } .hero-video-start { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: transparent; z-index: -1; cursor: pointer; } .hero-video-start:focus-visible { outline: 2px solid white; outline-offset: -8px; } .hero video::-webkit-media-controls, .hero video::-webkit-media-controls-start-playback-button { display: none !important; } .hero-overlay { background: linear-gradient(180deg,rgba(6,42,33,.82),rgba(6,42,33,.72) 76px,transparent 180px), radial-gradient(ellipse at 0% 90%,rgba(6,42,33,.9),rgba(6,42,33,.45) 42%,transparent 78%); } .hero-title { max-width: 19ch; font-size: clamp(44px, 4.5vw, 70px); line-height: 1.08; } .hero-description { max-width: 48ch; } .trust-bar { position: relative; z-index: 1; } .property-overlay-card:hover, .property-overlay-card:focus-within { transform: none; box-shadow: none; } .property-overlay-card img, .property-overlay-card:hover img { transform: none; } .po-bottom::after { content: 'Prohlédnout nabídku  ↗'; display: block; font: 500 14px/1.4 var(--font-body); margin-top: 18px; text-decoration: underline; text-underline-offset: 5px; } .intent-card-v2, .service-page .hero-image-side { transition: transform .4s cubic-bezier(.2,.75,.25,1); } .nav-links { transition-property: transform, opacity, visibility; } @media (min-width: 901px) and (hover: hover) and (pointer: fine) { .intent-card-v2:hover { transform: translateY(-6px); } } @media (max-width: 1100px) { .navbar { --mobile-header-height: 68px; padding-top: max(12px, env(safe-area-inset-top)); } .navbar .nav-container { min-height: 44px; padding-inline: max(24px, 5vw); } .navbar .logo { line-height: 1.25; } .navbar.menu-open { background: var(--color-bg); } .navbar.menu-open .logo { color: var(--color-primary); } .navbar.menu-open .logo span { color: #856039; } .nav-links { top: calc(var(--mobile-header-height) + max(0px, env(safe-area-inset-top) - 12px)); right: 0; width: 100%; max-width: none; height: calc(100dvh - var(--mobile-header-height) - max(0px, env(safe-area-inset-top) - 12px)); padding: 24px max(24px, 5vw) max(32px, env(safe-area-inset-bottom)); align-items: stretch; gap: 8px; box-shadow: none; transform: translateX(100%); opacity: 0; transition: transform .38s cubic-bezier(.2,.75,.25,1), opacity .25s, visibility .38s; } .nav-links.active { transform: translateX(0); opacity: 1; } .nav-dropdown { width: 100%; flex-shrink: 0; } .nav-links > a { flex-shrink: 0; } .nav-links a:not(.btn-primary) { border: 0; font-family: var(--font-body); font-size: 22px; line-height: 1.35; letter-spacing: -.01em; } .nav-links .nav-dropdown-menu { padding: 4px 0 8px 16px; gap: 2px; } .nav-links .nav-dropdown-menu a:not(.btn-primary) { font-size: 16px; } .navbar .nav-links a:not(.btn-primary):hover { color: var(--color-primary); } .nav-links a:not(.btn-primary)::before { display: none; } .nav-links .btn-primary { margin-top: 20px; } .navbar .menu-toggle { display: flex; align-items: center; justify-content: center; margin-right: 0; flex-shrink: 0; } .nav-overlay { transition: opacity .38s ease, visibility .38s; } } @media (max-width: 767px) { .navbar, .navbar.scrolled { --mobile-header-height: 64px; padding-top: max(10px, env(safe-area-inset-top)); } .nav-links { top: calc(64px + max(0px, env(safe-area-inset-top) - 10px)); height: calc(100dvh - 64px - max(0px, env(safe-area-inset-top) - 10px)); } } @media (max-width: 767px) { .hero { height: 100svh; min-height: 100svh; max-height: none; padding: 104px 0 48px; } .hero-title { font-size: clamp(38px, 10.25vw, 48px); margin-bottom: 18px; } .hero-description { font-size: 17px; line-height: 1.5; margin-bottom: 22px; } .hero-overlay { background: linear-gradient(180deg,rgba(6,42,33,.82),rgba(6,42,33,.72) 66px,transparent 150px),linear-gradient(0deg,rgba(6,42,33,.88),rgba(6,42,33,.45) 50%,transparent 85%); } .po-bottom::after { margin-top: 12px; font-size: 13px; } } @media (max-width: 767px) and (max-height: 700px) { .hero { padding-bottom: 28px; } .hero-subtitle { margin-bottom: 12px; } .hero-title { font-size: 36px; } .hero-description { font-size: 16px; margin-bottom: 16px; } .hero-cta { flex-direction: row; flex-wrap: wrap; } .hero-cta a { font-size: 14px; padding: 14px 16px; } } @media (prefers-reduced-motion: reduce) { .hero-bg, .property-overlay-card, .property-overlay-card:hover, .po-bottom, .intent-card-v2:hover, [data-sc-in], [data-sc-reveal] { transform: none !important; transition: none !important; clip-path: none !important; opacity: 1 !important; } } html[data-noanim] :is([data-sc-in], [data-sc-reveal]) { opacity: 1 !important; transform: none !important; clip-path: none !important; }  :root { --motion-surface: cubic-bezier(.22,1,.36,1); --gold-on-dark: #efd0a0; --gold-on-light: #856039; } .trust-bar { background: #fff; border: 0; box-shadow: none; } .trust-item { border: 0; padding-block: 8px; } .trust-bar::before, .trust-bar::after, .trust-item::before, .trust-item::after { content: none; } .trust-number:has(svg), .trust-number:has(i) { display: inline-flex; } .trust-label { font-size: 14px; font-weight: 600; letter-spacing: .015em; } .navbar .logo span, .navbar:not(.scrolled) .logo span { color: var(--gold-on-dark); } .navbar.scrolled .logo span, .service-page .navbar .logo span, .service-page .navbar:not(.scrolled) .logo span { color: var(--gold-on-light); } #o-mne { padding-bottom: 0; } .partners { padding-block: clamp(64px,7.5vw,108px); display: flex; flex-direction: column; align-items: center; gap: 28px; } .partners-title { width: 100%; margin: 0; padding-inline: 24px; text-align: center !important; letter-spacing: .09em; font-size: 11px; } .partners-marquee-wrapper { flex: 0 0 auto; } .costa-stat-val, .costa-hero-subtitle { color: var(--gold-on-dark); opacity: 1; } .costa-hero-info, .costa-stat-label { color: #fff; opacity: 1; }  .costa-hero-title { color: var(--color-accent); opacity: 1; } .costa-hero .btn-white { background: var(--color-accent); color: var(--color-primary-deep); border: 1px solid transparent; } .costa-hero .btn-white:hover { background: #d3ad80; color: var(--color-primary-deep); } :is(.btn-primary,.btn-secondary,.btn-white) { position: relative; isolation: isolate; overflow: visible; transform: translate3d(0,0,0); box-shadow: none; transition: transform .55s var(--motion-surface), background-color .45s ease, color .35s ease, border-color .35s ease; } :is(.btn-primary,.btn-secondary,.btn-white)::after { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; box-shadow: 0 5px 9px rgba(6,24,18,.08),0 18px 32px -10px rgba(6,24,18,.28); opacity: 0; transform: translateY(5px) scale(.96); transition: opacity .55s var(--motion-surface),transform .65s var(--motion-surface); } :is(.btn-primary,.btn-secondary,.btn-white) svg { transition: transform .55s var(--motion-surface); } .property-overlay-card, .property-overlay-card.reveal { isolation: isolate; overflow: visible; box-shadow: none; transition: transform .75s var(--motion-surface); } .property-overlay-card::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; box-shadow: 0 8px 16px -8px rgba(6,24,18,.14),0 28px 48px -18px rgba(6,24,18,.3); opacity: 0; transform: translateY(7px) scale(.97); transition: opacity .75s var(--motion-surface),transform .85s var(--motion-surface); } .po-media { position: absolute; inset: 0; overflow: hidden; } .property-overlay-card .po-media img { transform: scale(1); transition: transform 1.15s var(--motion-surface); } .property-overlay-card .po-content { transition: background-color .7s ease; } .property-overlay-card .po-bottom { transform: translateY(0); transition: transform .75s var(--motion-surface); } .po-bottom::after { text-decoration: none; letter-spacing: .01em; transition: transform .7s var(--motion-surface),color .5s ease; } .property-overlay-card:hover,.property-overlay-card:focus-within { box-shadow: none; } @media (hover:hover) and (pointer:fine) { :is(.btn-primary,.btn-secondary,.btn-white):is(:hover,:focus-visible) { transform: translate3d(0,-3px,0); box-shadow: none; } :is(.btn-primary,.btn-secondary,.btn-white):is(:hover,:focus-visible)::after { opacity: 1; transform: translateY(2px) scale(1); } :is(.btn-primary,.btn-secondary,.btn-white):is(:hover,:focus-visible) svg { transform: translateX(3px); } .property-overlay-card:is(:hover,:focus-visible) { transform: translate3d(0,-6px,0) scale(1.006); box-shadow: none; } .property-overlay-card:is(:hover,:focus-visible)::before { opacity: 1; transform: translateY(3px) scale(1); } .property-overlay-card:is(:hover,:focus-visible) .po-media img { transform: scale(1.035); } .property-overlay-card:is(:hover,:focus-visible) .po-content { background-color: rgba(6,42,33,.08); } .property-overlay-card:is(:hover,:focus-visible) .po-bottom { transform: translateY(-5px); } .property-overlay-card:is(:hover,:focus-visible) .po-bottom::after { transform: translateX(5px); color: var(--gold-on-dark); } } :is(.btn-primary,.btn-secondary,.btn-white):active { transform: translateY(-1px); transition-duration: .12s; } .hodnoty.is-pinned .hod-krok { transform: translateY(12px); transition: opacity .16s ease,transform .55s var(--motion-surface); } .hodnoty.is-pinned .hod-krok.je-aktivni { transform: translateY(0); transition: opacity .5s ease .16s,transform .8s var(--motion-surface) .1s; } .hodnoty.is-pinned .hod-foto { transform: scale(1.035); transition: opacity 1.05s ease,transform 1.8s var(--motion-surface); } .hodnoty.is-pinned .hod-foto.je-aktivni { transform: scale(1); } .hod-bod { transition: color .4s ease; } .hod-bod-linka { transition: background-color .4s ease,transform .6s var(--motion-surface); transform: scaleX(.72); transform-origin: right; } .hod-bod.je-aktivni .hod-bod-linka { transform: scaleX(1); } @media (max-width:767px) { .partners { padding-block: 64px; gap: 24px; } .trust-bar { padding-block: 18px; } } @media (prefers-reduced-motion:reduce) { :is(.btn-primary,.btn-secondary,.btn-white),:is(.btn-primary,.btn-secondary,.btn-white)::after, .property-overlay-card,.property-overlay-card::before,.property-overlay-card .po-media img,.property-overlay-card .po-bottom,.po-bottom::after, .hodnoty .hod-krok,.hodnoty .hod-foto,.hod-bod,.hod-bod-linka { transition: none !important; transform: none !important; } }  .intent-card-v2.reveal { transition: transform .75s var(--motion-surface); } .po-bottom h3 { font-family: var(--font-body); font-weight: 500; font-size: 20px; line-height: 1.25; letter-spacing: -.02em; } .po-price { font-weight: 400; } @media (prefers-reduced-motion:reduce) { .property-overlay-card.reveal,.intent-card-v2.reveal { transition: none!important; } } .catalog-pagination { display:flex; flex-direction:column; align-items:center; gap:20px; padding:36px 0 16px; } .catalog-pagination p { color:var(--color-text-light); font-size:14px; margin:0; }  @media (max-width: 1100px) { .navbar.menu-open .logo span { color: #856039; } } .hero-benefits li { display: flex; align-items: flex-start; gap: 8px; } .hero-benefits li svg { flex: 0 0 16px; margin-top: .25em; } .support-assurance { display: flex; align-items: flex-start; justify-content: center; gap: 8px; } .support-assurance svg { flex-shrink: 0; margin-top: .15em; } .hod-step-photo { display: none; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; margin-bottom: 24px; } @media (max-width: 900px) { .hodnoty:not(.is-pinned) .hod-step-photo { display: block; } } @media (prefers-reduced-motion: reduce) { .hodnoty:not(.is-pinned) .hod-step-photo { display: block; } } html[data-noanim] .hodnoty:not(.is-pinned) .hod-step-photo { display: block; } .catalog-location { color: var(--color-primary); font-size: 16px; margin: 8px 0 0; }  .property-overlay-card.inquiry-only .po-bottom::after { content: 'Poptat projekt  ↗'; }  .navbar.scrolled .menu-toggle svg, .navbar.menu-open .menu-toggle svg { color: var(--color-primary); }  .navbar { transition: background-color .2s, box-shadow .2s, transform .3s ease, opacity .3s ease; }   .navbar:not(.scrolled):not(.menu-open) { background: linear-gradient(to bottom, rgba(4, 22, 17, .5), rgba(4, 22, 17, 0)); box-shadow: none; } .service-page .navbar:not(.scrolled):not(.menu-open) { background: transparent; } .navbar:not(.scrolled):not(.menu-open) :is(.logo,.menu-toggle) { color:#fff; text-shadow:0 1px 3px rgba(0,0,0,.65); } .navbar:not(.scrolled):not(.menu-open) .logo span { color:var(--gold-on-dark); } .navbar.scrolled, .navbar.menu-open { background:var(--color-bg,#FDFBF7); } .navbar.scrolled :is(.logo,.menu-toggle), .navbar.menu-open :is(.logo,.menu-toggle) { color:var(--color-primary); text-shadow:none; } .navbar:is(.scrolled,.menu-open) .logo span { color:var(--gold-on-light); } @media (min-width:1101px) { .navbar:not(.scrolled) .nav-links > a:not(.btn-primary), .navbar:not(.scrolled) .nav-dropdown-spoust { color:#fff; text-shadow:0 1px 3px rgba(0,0,0,.65); } } .navbar.coast-hidden:not(:has(:focus-visible)):not(.menu-open) { transform: translateY(-100%); opacity: 0; pointer-events: none; } @media (prefers-reduced-motion: reduce) { .navbar { transition: none; } } @media (max-width: 1100px) { .navbar.scroll-hidden:not(:has(:focus-visible)):not(.menu-open) { transform: translateY(-100%); opacity: 0; pointer-events: none; } } .project-inquiry{width:min(620px,calc(100% - 2rem));max-height:calc(100dvh - 2rem);margin:auto;padding:0;border:0;border-radius:0;background:#fff;color:var(--color-text);box-shadow:0 24px 80px rgba(0,0,0,.28)} .project-inquiry::backdrop{background:rgba(5,24,19,.72);backdrop-filter:blur(5px)} .project-inquiry__panel{position:relative;padding:clamp(1.5rem,5vw,3rem);overflow:auto} .project-inquiry__panel h2{margin:.35rem 2rem .6rem 0;color:var(--color-primary);font-family:var(--font-heading);font-size:clamp(1.65rem,4vw,2.25rem);line-height:1.12} .project-inquiry__intro{margin:0 0 1.5rem;color:var(--color-text-light)} .project-inquiry__close{position:absolute;right:1rem;top:1rem;width:44px;height:44px;border:1px solid rgba(11,59,46,.2);border-radius:0;background:#fff;color:var(--color-primary);font-size:1.8rem;cursor:pointer} .project-inquiry :focus-visible{outline:2px solid var(--color-accent);outline-offset:3px} body:has(.project-inquiry[open]){overflow:hidden} @media(prefers-reduced-motion:reduce){.project-inquiry,.project-inquiry::backdrop{scroll-behavior:auto}}   .hero-image-side--vyrazny { flex: 0 0 46%; } @media (max-width: 900px) { .hero-image-side--vyrazny { flex: none; height: 460px; } } .hero-image-kenburns { overflow: hidden; } .hero-image-kenburns img { transform-origin: center center; will-change: transform; } @media (prefers-reduced-motion: no-preference) { html.js-pripraveno:not([data-noanim]) .hero-image-kenburns img { animation: sluzby-kenburns 20s cubic-bezier(.25, .1, .25, 1) both; } } @keyframes sluzby-kenburns { from { transform: scale(1); } to { transform: scale(1.06); } }  .resales-fallback-title { font-family: var(--font-heading); font-size: 1.6rem; color: var(--color-primary); margin-bottom: .75rem; } .fallback-nabidka-label { grid-column: 1 / -1; margin: 2.5rem 0 1rem; font-size: .8rem; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: var(--color-text-light); }  .service-page .katalog-cta-p { max-width: none; }  #novostavby-load-more { width: fit-content; }  .proc-hotovou-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 4rem; align-items: start; margin-top: 3rem; } .proc-hotovou-photo { position: sticky; top: 120px; border-radius: var(--radius-obrazek, var(--radius-karta)); overflow: hidden; aspect-ratio: 4 / 5; } .proc-hotovou-photo img { width: 100%; height: 100%; object-fit: cover; display: block; } .proc-hotovou-list { display: flex; flex-direction: column; } .proc-hotovou-item { display: flex; gap: 1.5rem; padding: 2rem 0; border-top: 1px solid var(--hairline, rgba(11, 59, 46, .16)); transition: padding-left .35s cubic-bezier(.22, 1, .36, 1); } .proc-hotovou-item:last-child { border-bottom: 1px solid var(--hairline, rgba(11, 59, 46, .16)); } .proc-hotovou-num { font-family: var(--font-heading); font-size: 1.5rem;  color: var(--color-primary); opacity: .7; min-width: 2.5ch; line-height: 1.4; transition: opacity .35s; } .proc-hotovou-content h3 { font-size: 1.25rem; margin-bottom: .5rem; } .proc-hotovou-content p { color: var(--color-text-light); margin: 0; } @media (hover: hover) and (pointer: fine) { .proc-hotovou-item:hover { padding-left: .75rem; } .proc-hotovou-item:hover .proc-hotovou-num { opacity: 1; } } @media (max-width: 900px) { .proc-hotovou-grid { grid-template-columns: 1fr; gap: 2rem; } .proc-hotovou-photo { position: static; aspect-ratio: 16 / 10; } } novostavba-proc-* výš (čísla, hairline), jen bez foto sloupce — na celou šířku kontejneru, max-width jen kvůli čitelnosti dlouhého textu na širokém desktopu. */ .nakup-proc-rows { display: flex; flex-direction: column; max-width: 880px; margin: 0 auto; } .nakup-proc-row { display: flex; gap: 1.5rem; padding: 1.75rem 0; border-top: 1px solid var(--hairline, rgba(11, 59, 46, .16)); transition: padding-left .35s cubic-bezier(.22, 1, .36, 1); } .nakup-proc-row:last-child { border-bottom: 1px solid var(--hairline, rgba(11, 59, 46, .16)); } .nakup-proc-num { font-family: var(--font-heading); font-size: 1.5rem;  color: var(--color-primary); opacity: .7; min-width: 2.5ch; line-height: 1.4; transition: opacity .35s; } .nakup-proc-row h3 { font-size: 1.2rem; margin-bottom: .4rem; } .nakup-proc-row p { color: var(--color-text-light); margin: 0; } @media (hover: hover) and (pointer: fine) { .nakup-proc-row:hover { padding-left: .75rem; } .nakup-proc-row:hover .nakup-proc-num { opacity: 1; } }  .novostavba-proc-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 4rem; align-items: center; margin-top: 3rem; } .novostavba-proc-rows { display: flex; flex-direction: column; } .novostavba-proc-row { display: flex; gap: 1.5rem; padding: 1.75rem 0; border-top: 1px solid var(--hairline, rgba(11, 59, 46, .16)); transition: padding-left .35s cubic-bezier(.22, 1, .36, 1); } .novostavba-proc-row:last-child { border-bottom: 1px solid var(--hairline, rgba(11, 59, 46, .16)); } .novostavba-proc-num { font-family: var(--font-heading); font-size: 1.5rem;  color: var(--color-primary); opacity: .7; min-width: 2.5ch; line-height: 1.4; transition: opacity .35s; } .novostavba-proc-row h3 { font-size: 1.2rem; margin-bottom: .4rem; } .novostavba-proc-row p { color: var(--color-text-light); margin: 0; } .novostavba-proc-photo { border-radius: var(--radius-obrazek, var(--radius-karta)); overflow: hidden; aspect-ratio: 3 / 4; } .novostavba-proc-photo img { width: 100%; height: 100%; object-fit: cover; display: block; } @media (hover: hover) and (pointer: fine) { .novostavba-proc-row:hover { padding-left: .75rem; } .novostavba-proc-row:hover .novostavba-proc-num { opacity: 1; } } @media (max-width: 900px) { .novostavba-proc-grid { grid-template-columns: 1fr; gap: 2rem; } .novostavba-proc-photo { order: -1; aspect-ratio: 16 / 10; } }  .jak-timeline { position: relative; } .jak-linka-progress { position: absolute; top: 0; left: 0; width: 2px; height: 100%; background: var(--color-accent); transform: scaleY(0); transform-origin: top; } .jak-krok-znacka { position: absolute; left: -2.65rem; top: -3px; width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--color-white); border: 2px solid var(--color-primary); color: var(--color-primary); font-family: var(--font-heading); font-size: .95rem; transition: background-color .35s, border-color .35s, color .35s; }  .jak-krok.is-active .jak-krok-znacka { background: var(--color-accent); border-color: var(--color-accent); color: var(--color-primary-deep); } .jak-timeline .timeline-v-content { border: 1px solid rgba(11, 59, 46, .08); } .jak-timeline .timeline-v-header { align-items: baseline; } @media (max-width: 768px) { .jak-krok-znacka { left: -2.35rem; width: 28px; height: 28px; font-size: .85rem; } }  @media (prefers-reduced-motion: no-preference) { html.js-pripraveno:not([data-noanim]) [data-nastup] > *, html.js-pripraveno:not([data-noanim]) [data-nastup] [data-nastup-prvek] { opacity: 0; } } html.nastup-pojistka [data-nastup] > *, html.nastup-pojistka [data-nastup] [data-nastup-prvek] { opacity: 1 !important; transform: none !important; filter: none !important; }  .nastup-radek { display: block; }  @media (hover: hover) and (pointer: fine) {  .property-card, .service-card, .process-card, .calc-card, .garance-karta, .edu-item, .cds-mesto, .cds-kpi-bunka { transition: transform .35s cubic-bezier(.22, 1, .36, 1), box-shadow .35s cubic-bezier(.22, 1, .36, 1); } .property-card:hover, .service-card:hover, .process-card:hover, .calc-card:hover, .garance-karta:hover, .edu-item:hover, .cds-mesto:hover, .cds-kpi-bunka:hover { transform: translateY(-6px); box-shadow: 0 1px 2px rgba(6, 42, 33, .06), 0 20px 40px -16px rgba(6, 42, 33, .22); }  .btn-primary:active, .btn-secondary:active { transform: scale(.97); transition-duration: 0s; }  .edu-item:hover .edu-icon, .process-card:hover .process-icon, .service-card:hover .service-ikona, .calc-card:hover .calc-ikona, .trust-item:hover .trust-number { background-color: var(--color-primary); color: var(--color-white); }  .approach-cinema-card:hover .approach-icon { background-color: rgba(255, 255, 255, .92); color: var(--color-primary-deep); }  .faq-topic-body a, .cds-route-facts a { background-image: linear-gradient(currentColor, currentColor); background-repeat: no-repeat; background-position: 0 100%; background-size: 0% 1px; text-decoration: none !important; transition: background-size .35s cubic-bezier(.22, 1, .36, 1); } .faq-topic-body a:hover, .cds-route-facts a:hover { background-size: 100% 1px; }  .btn-text .lucide, .faq-topics-contact-link > span:last-child { transition: transform .35s cubic-bezier(.22, 1, .36, 1); } .btn-text:hover .lucide, .faq-topics-contact-link:hover > span:last-child { transform: translateX(4px); } }  @media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: reduce) { .property-card, .service-card, .process-card, .calc-card, .garance-karta, .edu-item, .cds-mesto, .cds-kpi-bunka { transition: box-shadow .35s ease, background-color .35s ease; } .property-card:hover, .service-card:hover, .process-card:hover, .calc-card:hover, .garance-karta:hover, .edu-item:hover, .cds-mesto:hover, .cds-kpi-bunka:hover { transform: none; box-shadow: 0 1px 2px rgba(6, 42, 33, .06), 0 12px 24px -12px rgba(6, 42, 33, .18); } .btn-primary:active, .btn-secondary:active { transform: none; } .btn-text:hover .lucide, .faq-topics-contact-link:hover > span:last-child { transform: none; } }