/* =========================================================
   MÜLLER INTERIÉRY — vizuální styl v3 (říjen 2026)
   Podle zadání klienta: prémiové pojetí ve směru HANÁK / Sykora,
   velká typografie, fotky přes celou šířku, střídání světlých
   a tmavých sekcí, champagne gold jen jako doplněk.
   Písma: Cormorant Garamond (nadpisy) + Manrope (text).
   Barvy: #111111 · #C89A5A · #F8F6F2 · #3A3A3A
   ========================================================= */

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body, h1, h2, h3, h4, p, figure, blockquote, dl, dd, ul, ol { margin: 0; padding: 0; }
ul, ol { list-style: none; }
img, svg, video { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }

/* ---------- Tokeny ---------- */
:root{
  --black:   #111111;
  --black-2: #171716;
  --black-3: #1F1E1C;
  --grey:    #3A3A3A;
  --white:   #F8F6F2;
  --paper:   #FFFFFF;
  --sand:    #EEE8DF;
  --gold:    #C89A5A;
  --gold-lt: #DDBB8A;
  --gold-ink:#9C733C;          /* zlatá pro drobný text na světlém podkladu */

  --t-dark:  #F3EFE8;          /* text na tmavém */
  --t-dark-2:#A9A39A;
  --t-light: #111111;          /* text na světlém */
  --t-light-2:#5E5A55;

  --ln-dark: rgba(243,239,232,.14);
  --ln-light:rgba(17,17,17,.12);

  --serif: "Cormorant Garamond", "Cormorant", Georgia, "Times New Roman", serif;
  --sans:  "Manrope", "Helvetica Neue", Arial, system-ui, sans-serif;

  --pad: clamp(20px, 4.6vw, 80px);
  --max: 1600px;
  --sec: clamp(88px, 11vw, 190px);
  --ease: cubic-bezier(.19,1,.22,1);
  --ease-2: cubic-bezier(.65,0,.35,1);
}

body{
  background: var(--white);
  color: var(--t-light);
  font-family: var(--sans);
  font-size: clamp(15px, .25vw + 14.2px, 17px);
  font-weight: 400;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
body.is-locked { overflow: hidden; }
::selection { background: var(--gold); color: var(--black); }
:focus-visible { outline: 1px solid var(--gold); outline-offset: 4px; }

.skip{ position: absolute; left: 12px; top: -80px; z-index: 300; background: var(--gold); color: var(--black); padding: 12px 18px; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; }
.skip:focus { top: 12px; }

.wrap{ width: 100%; max-width: var(--max); margin-inline: auto; padding-inline: var(--pad); }
.sec{ position: relative; padding-block: var(--sec); }
.sec--dark{ background: var(--black); color: var(--t-dark); }
.sec--sand{ background: var(--sand); }
.sec--paper{ background: var(--paper); }

/* ---------- Typografie ---------- */
.eyebrow{
  display: inline-flex; align-items: center; gap: 16px;
  font-size: 11px; font-weight: 600; letter-spacing: .32em; text-transform: uppercase;
  color: var(--gold-ink);
}
.sec--dark .eyebrow, .on-dark .eyebrow { color: var(--gold); }
.eyebrow::before{ content: ""; width: 44px; height: 1px; background: currentColor; }
.eyebrow--bare::before { display: none; }

.h-xxl, .h-xl, .h-l, .h-m{
  font-family: var(--serif); font-weight: 300; letter-spacing: -.02em;
  line-height: .96; text-wrap: balance;
}
.h-xxl { font-size: clamp(56px, 9.4vw, 168px); line-height: .9; }
.h-xl  { font-size: clamp(46px, 6.6vw, 118px); }
.h-l   { font-size: clamp(38px, 4.8vw, 84px); line-height: 1; }
.h-m   { font-size: clamp(28px, 2.7vw, 44px); line-height: 1.06; }
.h-xxl em, .h-xl em, .h-l em, .h-m em { font-style: italic; color: var(--gold); font-weight: 300; }
.sec:not(.sec--dark) .h-xl em, .sec:not(.sec--dark) .h-l em { color: var(--gold-ink); }

.lead{ font-size: clamp(17px, .6vw + 14.6px, 21px); line-height: 1.6; font-weight: 300; }
.muted{ color: var(--t-light-2); }
.sec--dark .muted, .on-dark .muted { color: var(--t-dark-2); }
.gold{ color: var(--gold); }

/* Odhalování řádků nadpisu */
.ln{ display: block; overflow: hidden; padding-bottom: .08em; margin-bottom: -.08em; }
.ln > span{ display: block; }
.js .rv .ln > span{ transform: translateY(108%); }
.js .rv.in .ln > span{ transform: none; transition: transform 1.25s var(--ease); }
.js .rv.in .ln:nth-child(2) > span { transition-delay: .09s; }
.js .rv.in .ln:nth-child(3) > span { transition-delay: .18s; }
.js .rv.in .ln:nth-child(4) > span { transition-delay: .27s; }

.js .fade{ opacity: 0; transform: translateY(34px); }
.js .fade.in{ opacity: 1; transform: none; transition: opacity 1.1s var(--ease), transform 1.3s var(--ease); }
.js .fade.d1.in { transition-delay: .12s; } .js .fade.d2.in { transition-delay: .24s; } .js .fade.d3.in { transition-delay: .36s; }
/* Pojistka: po doběhnutí se stav dorovná natvrdo (zamrzlý kompozitor ve webview) */
.js .settled, .js .settled .ln > span { opacity: 1 !important; transform: none !important; transition: none !important; }

.js .mask{ clip-path: inset(0 0 100% 0); }
.js .mask.in{ clip-path: inset(0 0 0 0); transition: clip-path 1.5s var(--ease); }
.js .mask > img{ transform: scale(1.18); }
.js .mask.in > img{ transform: scale(1); transition: transform 2s var(--ease); }
.js .mask.settled { clip-path: none !important; }
.js .mask.settled > img { transform: none !important; }

/* ---------- Tlačítka a odkazy ---------- */
.btn{
  --b: var(--gold);
  position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 16px;
  min-height: 56px; padding: 0 30px;
  font-size: 11.5px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase;
  border: 1px solid var(--b); overflow: hidden; isolation: isolate;
  transition: color .5s var(--ease), border-color .5s var(--ease);
}
.btn svg{ width: 18px; height: 18px; flex: none; transition: transform .5s var(--ease); }
.btn:hover svg { transform: translateX(5px); }
.btn::before{
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: var(--b); transform: scaleY(0); transform-origin: bottom;
  transition: transform .55s var(--ease);
}
.btn:hover::before, .btn:focus-visible::before { transform: scaleY(1); }
.btn--gold{ background: var(--gold); color: var(--black); }
.btn--gold::before { background: var(--gold-lt); }
.btn--line{ color: var(--t-dark); --b: var(--t-dark); border-color: rgba(243,239,232,.5); }
.btn--line:hover, .btn--line:focus-visible { color: var(--black); }
.btn--dark{ background: var(--black); color: var(--t-dark); --b: var(--black); }
.btn--dark::before { background: var(--grey); }
.btns{ display: flex; flex-wrap: wrap; gap: 14px; }

.tl{
  display: inline-flex; align-items: center; gap: 12px;
  font-size: 11.5px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase;
  color: var(--gold-ink); padding-block: 6px; position: relative;
}
.sec--dark .tl, .on-dark .tl { color: var(--gold); }
.tl svg{ width: 18px; height: 18px; transition: transform .5s var(--ease); }
.tl::after{ content: ""; position: absolute; left: 0; right: 30px; bottom: 0; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: right; transition: transform .6s var(--ease); }
.tl:hover::after { transform: scaleX(1); transform-origin: left; }
.tl:hover svg { transform: translateX(6px); }

/* ---------- Úvodní clona ---------- */
.intro-veil{
  position: fixed; inset: 0; z-index: 400; background: var(--black);
  display: none; place-items: center;
}
.js .intro-veil.is-on{ display: grid; }
.intro-veil__in{ display: grid; justify-items: center; gap: 22px; }
.intro-veil img{ width: min(46vw, 260px); opacity: 0; transform: translateY(14px); animation: veilLogo .9s var(--ease) .1s forwards; }
.intro-veil i{ display: block; width: 180px; height: 1px; background: var(--gold); transform: scaleX(0); animation: veilLine .9s var(--ease) .35s forwards; }
.intro-veil.is-out{ transform: translateY(-100%); transition: transform 1s var(--ease-2); }
@keyframes veilLogo { to { opacity: 1; transform: none; } }
@keyframes veilLine { to { transform: scaleX(1); } }

/* ---------- Hlavička ---------- */
.hd{
  position: fixed; inset: 0 0 auto; z-index: 100;
  color: var(--t-dark);
  transition: background .6s var(--ease), transform .6s var(--ease), border-color .6s var(--ease);
  border-bottom: 1px solid transparent;
}
.hd::before{ content: ""; position: absolute; inset: 0 0 -40px; z-index: -1; background: linear-gradient(rgba(10,10,10,.55), rgba(10,10,10,0)); pointer-events: none; transition: opacity .6s; }
.hd.is-solid{ background: rgba(17,17,17,.94); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border-bottom-color: var(--ln-dark); }
.hd.is-solid::before { opacity: 0; }
.hd.is-away { transform: translateY(-100%); }
.hd__in{ display: flex; align-items: center; gap: clamp(20px, 3vw, 56px); height: 96px; transition: height .6s var(--ease); }
.hd.is-solid .hd__in { height: 76px; }

.brand{ display: inline-grid; justify-items: center; gap: 6px; line-height: 1; flex: none; }
.brand img{ width: clamp(118px, 9vw, 150px); height: auto; }
.brand span{ font-size: 9.5px; font-weight: 500; letter-spacing: .62em; margin-right: -.62em; color: var(--gold); }

.nav{ display: flex; align-items: center; gap: clamp(18px, 2.2vw, 40px); margin-left: auto; }
.nav a{
  position: relative; font-size: 11px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase;
  padding-block: 8px; color: rgba(243,239,232,.86); transition: color .3s;
}
.nav a::after{ content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--gold); transform: scaleX(0); transform-origin: right; transition: transform .5s var(--ease); }
.nav a:hover, .nav a[aria-current="page"] { color: #fff; }
.nav a:hover::after, .nav a[aria-current="page"]::after { transform: scaleX(1); transform-origin: left; }
.hd__cta{ min-height: 46px; padding: 0 22px; font-size: 10.5px; color: var(--gold); border-color: rgba(200,154,90,.7); }
.hd__cta:hover { color: var(--black); }

.burger{ display: none; width: 48px; height: 48px; margin-left: auto; margin-right: -12px; position: relative; }
.burger span, .burger span::before{ position: absolute; left: 12px; width: 24px; height: 1px; background: currentColor; transition: transform .5s var(--ease), top .4s var(--ease); }
.burger span{ top: 20px; }
.burger span::before{ content: ""; left: 0; top: 7px; }
.burger[aria-expanded="true"] span { transform: translateY(3.5px) rotate(45deg); }
.burger[aria-expanded="true"] span::before { top: 0; transform: rotate(-90deg); }

.menu{
  position: fixed; inset: 0; z-index: 90; background: var(--black); color: var(--t-dark);
  display: none; overflow-y: auto; padding: 120px var(--pad) 40px;
}
.menu.is-open{ display: block; }
.menu__list li{ border-bottom: 1px solid var(--ln-dark); }
.menu__list a{ display: flex; align-items: baseline; gap: 18px; padding: 16px 0; font-family: var(--serif); font-weight: 300; font-size: clamp(32px, 8.4vw, 54px); line-height: 1.05; }
.menu__list small{ font-family: var(--sans); font-size: 10px; letter-spacing: .24em; color: var(--gold); }
.menu__foot{ margin-top: 34px; display: grid; gap: 14px; font-size: 15px; }
.menu__foot a:not(.btn) { color: var(--t-dark-2); }
.menu__foot .btn { margin-top: 10px; }

@media (max-width: 1180px){
  .nav, .hd__cta { display: none; }
  .burger { display: block; }
  .hd__in { height: 76px; }
  .brand img { width: 118px; }
}

/* ---------- Hero: filmové přiblížení při scrollu ---------- */
.hx{ position: relative; height: 185vh; background: var(--black); color: var(--t-dark); }
.hx__stick{ position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden; }
.hx__media{ position: absolute; inset: 0; transform: scale(calc(1 + var(--p, 0) * .22)); transform-origin: 60% 55%; will-change: transform; }
.hx__slide{ position: absolute; inset: 0; opacity: 0; transition: opacity 2s var(--ease-2); }
.hx__slide.is-on{ opacity: 1; }
.hx__slide img{ width: 100%; height: 100%; object-fit: cover; animation: kb 14s linear both; animation-play-state: paused; }
.hx__slide.is-on img { animation-play-state: running; }
@keyframes kb { from { transform: scale(1.1); } to { transform: scale(1); } }
.hx__shade{
  position: absolute; inset: 0; pointer-events: none;
  background:
    linear-gradient(90deg, rgba(10,10,10,.82) 0%, rgba(10,10,10,.55) 38%, rgba(10,10,10,.12) 72%),
    linear-gradient(0deg, rgba(10,10,10,.7) 0%, rgba(10,10,10,0) 40%);
  opacity: calc(1 + var(--p, 0) * .2);
}
.hx__dim{ position: absolute; inset: 0; background: var(--black); opacity: calc(var(--p, 0) * .72); pointer-events: none; }
.hx__txt{
  position: absolute; inset: auto 0 0; padding-bottom: clamp(96px, 15vh, 170px);
  opacity: calc(1 - var(--p, 0) * 2.4);
  transform: translateY(calc(var(--p, 0) * -90px));
}
.hx__txt .eyebrow { margin-bottom: clamp(22px, 3vh, 36px); color: var(--gold); }
.hx__txt .h-xxl { max-width: 11ch; }
.hx__sub{ margin-top: clamp(24px, 3.4vh, 40px); max-width: 44ch; color: rgba(243,239,232,.86); }
.hx__sub b { font-weight: 400; color: var(--gold); }
.hx__txt .btns { margin-top: clamp(28px, 4vh, 48px); }
.hx__after{
  position: absolute; inset: 0; display: grid; place-items: center; text-align: center; padding: var(--pad);
  opacity: calc((var(--p, 0) - .45) * 3); pointer-events: none;
  transform: translateY(calc((1 - var(--p, 0)) * 60px));
}
.hx__after p{ font-family: var(--serif); font-weight: 300; font-size: clamp(40px, 6.4vw, 112px); line-height: 1; letter-spacing: -.02em; }
.hx__after p em { color: var(--gold); }
.hx__after small{ display: block; margin-top: 28px; font-size: 11px; letter-spacing: .34em; text-transform: uppercase; color: var(--t-dark-2); }

.hx__bar{
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 3;
  opacity: calc(1 - var(--p, 0) * 3);
}
.hx__bar .wrap{ display: flex; align-items: center; justify-content: space-between; gap: 24px; height: 76px; border-top: 1px solid var(--ln-dark); }
.dots{ display: flex; align-items: center; gap: 18px; font-size: 11px; font-weight: 600; letter-spacing: .16em; color: var(--t-dark-2); }
.dots button{ display: flex; align-items: center; gap: 14px; padding: 10px 0; color: inherit; transition: color .3s; }
.dots button i{ display: block; width: 0; height: 1px; background: var(--gold); transition: width .8s var(--ease); }
.dots button.is-on { color: var(--t-dark); }
.dots button.is-on i { width: 56px; }
.hx__cap{ font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--t-dark-2); text-align: right; }
.hx__cap b { color: var(--t-dark); font-weight: 500; }
.scrollcue{ display: flex; align-items: center; gap: 14px; font-size: 10px; letter-spacing: .3em; text-transform: uppercase; color: var(--t-dark-2); }
.scrollcue i{ width: 1px; height: 34px; background: linear-gradient(var(--gold), transparent); animation: cue 2.2s var(--ease-2) infinite; transform-origin: top; }
@keyframes cue { 0% { transform: scaleY(0); } 50% { transform: scaleY(1); transform-origin: top; } 51% { transform-origin: bottom; } 100% { transform: scaleY(0); transform-origin: bottom; } }
@media (max-width: 760px){
  .hx { height: 150vh; }
  .hx__shade { background: linear-gradient(0deg, rgba(10,10,10,.9) 0%, rgba(10,10,10,.55) 55%, rgba(10,10,10,.3) 100%); }
  .hx__txt { padding-bottom: 104px; }
  .hx__cap, .scrollcue { display: none; }
  .hx__txt .btns .btn { flex: 1 1 100%; }
}

/* ---------- Úvod: interiéry navržené pro život ---------- */
.about{ display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .8fr) minmax(0, 1.15fr); gap: clamp(28px, 4vw, 80px); align-items: center; }
.about__txt p + p { margin-top: 1em; }
.about__txt .tl { margin-top: 26px; }
.about__img{ position: relative; aspect-ratio: 4/5; overflow: hidden; }
.about__img img{ width: 100%; height: 100%; object-fit: cover; }
.about__tag{ position: absolute; left: 0; bottom: 0; background: var(--white); padding: 18px 26px 0 0; font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: var(--t-light-2); }
@media (max-width: 1100px){ .about { grid-template-columns: 1fr 1fr; } .about__img { grid-column: 1 / -1; aspect-ratio: 16/10; order: -1; } }
@media (max-width: 700px){ .about { grid-template-columns: 1fr; } }

.pillars{ display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); margin-top: clamp(64px, 8vw, 128px); border-top: 1px solid var(--ln-light); }
.pillar{ padding: clamp(26px, 3vw, 44px) clamp(18px, 2vw, 34px) 0 0; display: grid; grid-template-columns: 48px minmax(0,1fr); gap: 20px; }
.pillar + .pillar { padding-left: clamp(18px, 2vw, 34px); border-left: 1px solid var(--ln-light); }
.pillar svg{ width: 44px; height: 44px; color: var(--gold); stroke-width: 1.1; }
.pillar h3{ font-size: 11.5px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; margin-bottom: 8px; }
.pillar p{ font-size: 14px; line-height: 1.6; color: var(--t-light-2); }
@media (max-width: 1100px){ .pillars { grid-template-columns: 1fr 1fr; } .pillar:nth-child(3) { border-left: 0; padding-left: 0; } .pillar:nth-child(n+3) { border-top: 1px solid var(--ln-light); margin-top: 26px; } }
@media (max-width: 600px){ .pillars { grid-template-columns: 1fr; } .pillar, .pillar + .pillar { border-left: 0; padding-left: 0; } .pillar + .pillar { border-top: 1px solid var(--ln-light); margin-top: 26px; } }

/* ---------- Slider projektů přes celou šířku ---------- */
.ps{ position: relative; height: 100vh; height: 100svh; min-height: 620px; background: var(--black); color: var(--t-dark); overflow: hidden; touch-action: pan-y; user-select: none; }
.ps__slide{ position: absolute; inset: 0; clip-path: inset(0 0 0 100%); z-index: 1; }
.ps__slide.is-on{ clip-path: inset(0 0 0 0); z-index: 2; transition: clip-path 1.4s var(--ease-2); }
.ps__slide.is-back.is-on { clip-path: inset(0 0 0 0); }
.ps__slide.was{ clip-path: inset(0 0 0 0); z-index: 1; }
.ps__slide.is-settled{ transition: none !important; clip-path: none !important; }
.ps__slide img{ width: 100%; height: 100%; object-fit: cover; transform: scale(1.12); transition: transform 2.4s var(--ease); }
.ps__slide.is-on img{ transform: scale(1); }
.ps__slide::after{ content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10,10,10,.8) 0%, rgba(10,10,10,.35) 45%, rgba(10,10,10,.05) 75%), linear-gradient(0deg, rgba(10,10,10,.7), rgba(10,10,10,0) 45%); }
.ps__head{ position: absolute; z-index: 5; inset: 0 0 auto; padding-top: clamp(110px, 16vh, 180px); pointer-events: none; }
.ps__head .h-xl { max-width: 9ch; margin-top: 26px; }
.ps__head .tl { pointer-events: auto; margin-top: 30px; }
.ps__foot{ position: absolute; z-index: 5; inset: auto 0 0; }
.ps__foot .wrap{ display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: end; gap: 30px; padding-bottom: clamp(34px, 6vh, 64px); }
.ps__info{ min-height: 110px; }
.ps__info .n{ font-size: 11px; font-weight: 600; letter-spacing: .24em; color: var(--gold); }
.ps__info h3{ font-family: var(--serif); font-weight: 300; font-size: clamp(30px, 3.4vw, 54px); line-height: 1.05; margin: 10px 0 12px; }
.ps__info p{ font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--t-dark-2); }
.ps__info > * { transition: opacity .6s var(--ease), transform .8s var(--ease); }
.ps.is-moving .ps__info > * { opacity: 0; transform: translateY(14px); }
.ps__ctrl{ display: flex; align-items: center; gap: 22px; }
.ps__count{ font-size: 12px; font-weight: 600; letter-spacing: .14em; color: var(--t-dark-2); min-width: 72px; text-align: right; }
.ps__count b { color: var(--t-dark); font-weight: 600; }
.arrow{ width: 64px; height: 64px; border: 1px solid rgba(243,239,232,.4); display: grid; place-items: center; transition: background .4s, border-color .4s, color .4s; }
.arrow svg{ width: 20px; height: 20px; }
.arrow:hover{ background: var(--gold); border-color: var(--gold); color: var(--black); }
.ps__prog{ position: absolute; z-index: 6; left: 0; right: 0; bottom: 0; height: 2px; background: rgba(243,239,232,.12); }
.ps__prog i{ display: block; height: 100%; background: var(--gold); width: var(--w, 25%); transition: width 1s var(--ease); }
@media (max-width: 760px){
  .ps { min-height: 560px; height: 88svh; }
  .ps__slide::after { background: linear-gradient(0deg, rgba(10,10,10,.88), rgba(10,10,10,.25) 70%); }
  .ps__foot .wrap { grid-template-columns: 1fr; }
  .ps__ctrl { justify-content: space-between; }
  .arrow { width: 54px; height: 54px; }
}

/* ---------- Karty realizací ---------- */
.headrow{ display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 26px 40px; margin-bottom: clamp(44px, 5vw, 80px); }
.cards{ display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: clamp(14px, 1.6vw, 28px); align-items: start; }
.card{ display: block; position: relative; }
.card:nth-child(2) { margin-top: clamp(40px, 7vw, 120px); }
.card:nth-child(3) { margin-top: clamp(20px, 3.4vw, 60px); }
.card__im{ position: relative; overflow: hidden; aspect-ratio: 4/5; background: var(--sand); }
.card:first-child .card__im { aspect-ratio: 4/5.2; }
.card__im img{ width: 100%; height: 100%; object-fit: cover; transition: transform 1.6s var(--ease); }
.card:hover .card__im img { transform: scale(1.06); }
.card__im::after{ content: ""; position: absolute; inset: 0; background: rgba(17,17,17,0); transition: background .8s var(--ease); }
.card:hover .card__im::after { background: rgba(17,17,17,.12); }
.card__row{ display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--ln-light); }
.card__row h3{ font-family: var(--serif); font-weight: 400; font-size: clamp(24px, 2vw, 32px); line-height: 1.1; }
.card__row p{ margin-top: 8px; font-size: 10.5px; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; color: var(--t-light-2); }
.card__row svg{ width: 22px; height: 22px; color: var(--gold-ink); margin-top: 8px; flex: none; transition: transform .6s var(--ease); }
.card:hover .card__row svg { transform: translateX(8px); }
@media (max-width: 900px){
  .cards { grid-template-columns: 1fr 1fr; }
  .card:first-child { grid-column: 1 / -1; }
  .card:first-child .card__im { aspect-ratio: 16/11; }
  .card:nth-child(2), .card:nth-child(3) { margin-top: 0; }
}
@media (max-width: 560px){ .cards { grid-template-columns: 1fr; } }

/* ---------- Obří typografický seznam služeb ---------- */
.big{ border-top: 1px solid var(--ln-dark); }
.big__row{
  position: relative; display: grid; grid-template-columns: 70px minmax(0,1fr) minmax(0, 30ch) 64px; align-items: center; gap: clamp(14px, 2vw, 40px);
  padding: clamp(18px, 2.2vw, 30px) 0; border-bottom: 1px solid var(--ln-dark);
}
.big__n{ font-size: 11px; font-weight: 600; letter-spacing: .22em; color: var(--gold); }
.big__t{
  font-family: var(--serif); font-weight: 300; font-size: clamp(38px, 6.4vw, 112px); line-height: .98; letter-spacing: -.025em;
  transition: transform .9s var(--ease), color .5s;
}
.big__d{ font-size: 14px; line-height: 1.6; color: var(--t-dark-2); transition: color .5s; }
.big__go{ justify-self: end; width: 56px; height: 56px; border: 1px solid var(--ln-dark); display: grid; place-items: center; transition: background .5s, border-color .5s, color .5s, transform .8s var(--ease); }
.big__go svg { width: 20px; height: 20px; }
.big__thumb { display: none; }
@media (hover: hover) and (min-width: 1000px){
  .big:hover .big__row .big__t { color: rgba(243,239,232,.28); }
  .big .big__row:hover .big__t { color: var(--t-dark); transform: translateX(34px); font-style: italic; }
  .big__row:hover .big__d { color: var(--t-dark); }
  .big__row:hover .big__go { background: var(--gold); border-color: var(--gold); color: var(--black); transform: rotate(-45deg); }
}
.peek{
  position: fixed; left: 0; top: 0; z-index: 4; width: clamp(260px, 22vw, 380px); aspect-ratio: 4/5;
  pointer-events: none; overflow: hidden; opacity: 0; transform: translate(-50%, -50%) scale(.85) rotate(-3deg);
  transition: opacity .5s var(--ease), transform .7s var(--ease);
}
.peek.is-on{ opacity: 1; transform: translate(-50%, -50%) scale(1) rotate(0); }
.peek img{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .5s; }
.peek img.is-on { opacity: 1; }
@media (hover: none), (max-width: 999px){ .peek { display: none; } }
@media (max-width: 999px){
  .big__row { grid-template-columns: 84px minmax(0,1fr) 44px; }
  .big__n { display: none; }
  .big__thumb { display: block; width: 84px; aspect-ratio: 1; object-fit: cover; }
  .big__d { grid-column: 2 / 3; margin-top: -6px; }
  .big__t { font-size: clamp(30px, 7.4vw, 56px); }
  .big__go { width: 44px; height: 44px; grid-row: 1; grid-column: 3; }
}

/* ---------- Postup spolupráce ---------- */
.steps{ display: grid; grid-template-columns: repeat(6, minmax(0,1fr)); border-top: 1px solid var(--ln-light); }
.step{ padding: clamp(28px, 3vw, 44px) clamp(14px, 1.4vw, 26px) 0 0; }
.step + .step { padding-left: clamp(14px, 1.4vw, 26px); border-left: 1px solid var(--ln-light); }
.step b{ display: block; font-family: var(--serif); font-weight: 300; font-size: clamp(54px, 5vw, 86px); line-height: .9; color: var(--gold); letter-spacing: -.02em; }
.step h3{ margin-top: 22px; font-size: 12px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; }
.step p{ margin-top: 10px; font-size: 14px; line-height: 1.6; color: var(--t-light-2); }
@media (max-width: 1100px){ .steps { grid-template-columns: repeat(3, 1fr); row-gap: 40px; } .step:nth-child(4) { border-left: 0; padding-left: 0; } }
@media (max-width: 640px){ .steps { grid-template-columns: 1fr 1fr; } .step:nth-child(odd) { border-left: 0; padding-left: 0; } .step:nth-child(4) { border-left: 1px solid var(--ln-light); padding-left: clamp(14px, 1.4vw, 26px); } }

/* ---------- Virtuální realita: rozhlédněte se ---------- */
.vr{ display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(36px, 6vw, 120px); align-items: center; }
.vr__view{ position: relative; aspect-ratio: 5/4; overflow: hidden; background: var(--black-3); cursor: crosshair; }
.vr__view img{ position: absolute; top: -8%; left: -18%; width: 136%; height: 116%; max-width: none; object-fit: cover;
  transform: translate3d(var(--vx, 0px), var(--vy, 0px), 0); transition: transform 1.2s var(--ease); }
.vr__view::after{ content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(ellipse 72% 78% at 50% 50%, transparent 55%, rgba(10,10,10,.75) 100%); }
.vr__hud{ position: absolute; inset: 18px; z-index: 2; pointer-events: none; }
.vr__hud::before, .vr__hud::after{ content: ""; position: absolute; width: 26px; height: 26px; border: 1px solid rgba(243,239,232,.6); }
.vr__hud::before{ left: 0; top: 0; border-right: 0; border-bottom: 0; }
.vr__hud::after{ right: 0; bottom: 0; border-left: 0; border-top: 0; }
.vr__cross{ position: absolute; left: 50%; top: 50%; width: 38px; height: 38px; margin: -19px 0 0 -19px; border: 1px solid rgba(243,239,232,.55); border-radius: 50%; }
.vr__cross::after{ content: ""; position: absolute; left: 50%; top: 50%; width: 4px; height: 4px; margin: -2px 0 0 -2px; background: var(--gold); border-radius: 50%; }
.vr__label{ position: absolute; left: 22px; top: 22px; z-index: 3; display: inline-flex; gap: 12px; align-items: center; font-size: 10.5px; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; color: var(--gold); padding: 10px 14px; background: rgba(17,17,17,.6); backdrop-filter: blur(8px); }
.vr__label svg { width: 20px; height: 20px; }
.vr__hint{ position: absolute; right: 22px; bottom: 22px; z-index: 3; font-size: 10.5px; letter-spacing: .22em; text-transform: uppercase; color: var(--t-dark); }
.vr__pts{ margin-top: clamp(30px, 3vw, 44px); border-top: 1px solid var(--ln-dark); }
.vr__pts li{ display: grid; grid-template-columns: 54px minmax(0,1fr); gap: 16px; padding: 20px 0; border-bottom: 1px solid var(--ln-dark); }
.vr__pts b{ font-size: 11px; font-weight: 600; letter-spacing: .22em; color: var(--gold); padding-top: 3px; }
.vr__pts strong{ display: block; font-weight: 500; letter-spacing: .02em; margin-bottom: 4px; }
.vr__pts p{ font-size: 14.5px; color: var(--t-dark-2); line-height: 1.6; }
@media (max-width: 1000px){ .vr { grid-template-columns: 1fr; } .vr__view { order: -1; } }

/* ---------- Ocenění a hodnocení ---------- */
.proof{ display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(36px, 6vw, 120px); align-items: start; }
.award{ position: sticky; top: 120px; }
.award__n{ font-family: var(--serif); font-weight: 300; font-size: clamp(140px, 16vw, 280px); line-height: .8; color: var(--gold-ink); letter-spacing: -.04em; }
.award__t{ margin-top: 18px; font-family: var(--serif); font-size: clamp(26px, 2.4vw, 38px); line-height: 1.1; }
.award__s{ margin-top: 12px; font-size: 11px; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; color: var(--t-light-2); }
.revs{ display: grid; gap: 0; border-top: 1px solid var(--ln-light); }
.rev{ padding: clamp(28px, 3vw, 48px) 0; border-bottom: 1px solid var(--ln-light); display: grid; grid-template-columns: 54px minmax(0,1fr); gap: 20px; }
.rev__q{ font-family: var(--serif); font-size: 84px; line-height: .7; color: var(--gold); }
.rev p{ font-family: var(--serif); font-weight: 300; font-size: clamp(24px, 2.4vw, 40px); line-height: 1.2; letter-spacing: -.01em; }
.rev cite{ display: block; margin-top: 18px; font-style: normal; font-size: 11px; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; color: var(--t-light-2); }
.rev cite b { color: var(--t-light); font-weight: 600; }
.proof .tl { margin-top: 30px; }
@media (max-width: 900px){ .proof { grid-template-columns: 1fr; } .award { position: static; } }

/* ---------- Závěrečná výzva ---------- */
.cta{ position: relative; min-height: 88vh; display: grid; align-items: center; background: var(--black); color: var(--t-dark); overflow: hidden; }
.cta__bg{ position: absolute; inset: -8% 0; }
.cta__bg img{ width: 100%; height: 100%; object-fit: cover; transform: translateY(var(--py, 0px)); }
.cta::after{ content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10,10,10,.2) 0%, rgba(10,10,10,.55) 45%, rgba(10,10,10,.92) 70%); }
.cta__box{ position: relative; z-index: 2; margin-left: auto; width: min(100%, 620px); padding-block: var(--sec); }
.cta__box .h-xl { margin-top: 26px; }
.cta__box .lead { margin-top: 26px; color: rgba(243,239,232,.82); }
.cta__box .btns { margin-top: 40px; }
.cta__tel{ display: inline-flex; margin-top: 30px; font-family: var(--serif); font-size: clamp(28px, 2.6vw, 40px); color: var(--t-dark); border-bottom: 1px solid var(--ln-dark); transition: color .3s, border-color .3s; }
.cta__tel:hover { color: var(--gold); border-color: var(--gold); }
@media (max-width: 760px){ .cta::after { background: linear-gradient(0deg, rgba(10,10,10,.95) 30%, rgba(10,10,10,.6)); } }

/* ---------- Patička s obřím logem ---------- */
.ft{ background: #0B0B0B; color: var(--t-dark); padding-top: clamp(80px, 9vw, 150px); overflow: hidden; }
.ft__top{ display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: clamp(30px, 4vw, 70px); }
.ft__claim{ font-family: var(--serif); font-weight: 300; font-size: clamp(30px, 2.8vw, 46px); line-height: 1.08; }
.ft__claim em { color: var(--gold); }
.ft h4{ font-size: 10.5px; font-weight: 600; letter-spacing: .26em; text-transform: uppercase; color: var(--gold); margin-bottom: 22px; }
.ft ul{ display: grid; gap: 10px; }
.ft li a, .ft address{ font-size: 14.5px; font-style: normal; color: var(--t-dark-2); line-height: 1.7; transition: color .3s; }
.ft li a:hover { color: var(--t-dark); }
.ft__soc{ display: flex; gap: 10px; margin-top: 30px; }
.ft__soc a{ width: 46px; height: 46px; border: 1px solid var(--ln-dark); display: grid; place-items: center; transition: background .4s, border-color .4s, color .4s; }
.ft__soc a:hover { background: var(--gold); border-color: var(--gold); color: var(--black); }
.ft__soc svg { width: 18px; height: 18px; }
.ft__mega{ margin-top: clamp(70px, 9vw, 150px); position: relative; }
.ft__mega img{ width: 100%; height: auto; opacity: .95; }
.ft__mega span{ position: absolute; right: 0; bottom: -2px; font-size: clamp(10px, 1vw, 15px); letter-spacing: .6em; color: var(--gold); }
.ft__bar{ display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 30px; padding-block: 28px; margin-top: clamp(26px, 3vw, 44px); border-top: 1px solid var(--ln-dark); font-size: 12px; color: var(--t-dark-2); }
.ft__bar nav{ display: flex; gap: 24px; }
.ft__bar a:hover { color: var(--t-dark); }
@media (max-width: 1000px){ .ft__top { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px){ .ft__top { grid-template-columns: 1fr; } }

/* ---------- Vlastní kurzor (jen myš) ---------- */
.cur{
  position: fixed; left: 0; top: 0; z-index: 250; pointer-events: none;
  width: 104px; height: 104px; margin: -52px 0 0 -52px; border-radius: 50%;
  background: var(--gold); color: var(--black);
  display: none; place-items: center; text-align: center;
  font-size: 10px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase;
  transform: translate3d(var(--cx, -200px), var(--cy, -200px), 0) scale(0);
  transition: transform .45s var(--ease);
}
@media (hover: hover) and (pointer: fine){ .cur { display: grid; } }
.cur.is-on{ transform: translate3d(var(--cx), var(--cy), 0) scale(1); }

/* ---------- Přechod mezi stránkami ---------- */
.curtain{
  position: fixed; inset: 0; z-index: 350; background: var(--black); pointer-events: none;
  transform: translateY(100%); display: grid; place-items: center;
}
.curtain img{ width: min(40vw, 200px); opacity: .9; }
.enter .curtain{ transform: none; }
.curtain.is-up{ transform: translateY(-100%); transition: transform .95s var(--ease-2); }
.curtain.is-gone{ display: none; }
.curtain.is-down{ display: grid; transform: none; transition: transform .5s var(--ease-2); animation: curtIn .5s var(--ease-2); }
@keyframes curtIn { from { transform: translateY(100%); } to { transform: none; } }

/* ---------- Běžící text ---------- */
.mq{ overflow: hidden; white-space: nowrap; padding-block: clamp(26px, 3vw, 46px); border-block: 1px solid var(--ln-light); }
.sec--dark .mq, .mq--dark { border-color: var(--ln-dark); }
.mq--dark { background: var(--black); color: var(--t-dark); }
.mq__in{ display: inline-flex; will-change: transform; }
.mq__in span{
  display: inline-flex; align-items: center; gap: clamp(26px, 3vw, 56px); padding-right: clamp(26px, 3vw, 56px);
  font-family: var(--serif); font-weight: 300; font-size: clamp(54px, 8.6vw, 150px); line-height: 1; letter-spacing: -.02em;
}
.mq__in span em { font-style: italic; color: var(--gold); }
.mq__in span::after{ content: ""; width: .18em; height: .18em; background: var(--gold); transform: rotate(45deg); flex: none; }
.mq--outline .mq__in span { color: transparent; -webkit-text-stroke: 1px rgba(17,17,17,.35); }
.mq--dark.mq--outline .mq__in span { -webkit-text-stroke-color: rgba(243,239,232,.3); }

/* ---------- Text rozsvěcovaný slovo po slovu ---------- */
.words{ font-family: var(--serif); font-weight: 300; font-size: clamp(32px, 4.2vw, 72px); line-height: 1.12; letter-spacing: -.015em; max-width: 22ch; }
.words .w{ opacity: .14; transition: opacity .5s var(--ease); }
.words .w.on{ opacity: 1; }
.words em{ font-style: italic; color: var(--gold-ink); }
.sec--dark .words em { color: var(--gold); }

/* ---------- Fotka, která se při scrollu rozevře do celé šířky ---------- */
.ex{ position: relative; height: 230vh; background: var(--white); }
.ex--dark{ background: var(--black); }
.ex__stick{ position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden; display: grid; place-items: center; }
.ex__frame{
  position: absolute; left: 50%; top: 50%;
  width: calc(38vw + var(--e, 0) * 62vw); height: calc(52vh + var(--e, 0) * 48vh);
  transform: translate(-50%, -50%); overflow: hidden;
}
.ex__frame img{ width: 100%; height: 100%; object-fit: cover; transform: scale(calc(1.25 - var(--e, 0) * .25)); }
.ex__frame::after{ content: ""; position: absolute; inset: 0; background: rgba(10,10,10, calc(var(--e, 0) * .55)); }
.ex__words{ position: absolute; inset: 0; display: flex; align-items: center; justify-content: space-between; padding-inline: var(--pad); pointer-events: none; z-index: 2; }
.ex__words span{
  font-family: var(--serif); font-weight: 300; font-size: clamp(44px, 8vw, 150px); line-height: 1; letter-spacing: -.03em; color: var(--t-light);
  transform: translateX(calc(var(--e, 0) * var(--dir, -1) * 40vw)); opacity: calc(1 - var(--e, 0) * 1.6);
}
.ex__words span:last-child { --dir: 1; font-style: italic; color: var(--gold-ink); }
.ex__center{
  position: absolute; z-index: 3; inset: 0; display: grid; place-items: center; text-align: center; color: var(--t-dark); padding: var(--pad);
  opacity: calc((var(--e, 0) - .6) * 3); transform: translateY(calc((1 - var(--e, 0)) * 50px));
}
.ex__center .h-xl em { color: var(--gold); }
.ex__center p.eyebrow { justify-content: center; color: var(--gold); margin-bottom: 26px; }
.ex__center .btns { justify-content: center; margin-top: 34px; }
@media (max-width: 760px){
  .ex { height: 190vh; }
  .ex__frame { width: calc(70vw + var(--e, 0) * 30vw); height: calc(44vh + var(--e, 0) * 56vh); }
  .ex__words { flex-direction: column; justify-content: center; gap: 56vh; }
}

/* ---------- Vodorovná galerie řízená svislým scrollem ---------- */
.hs{ position: relative; background: var(--black); color: var(--t-dark); }
.hs__stick{ position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden; display: flex; flex-direction: column; justify-content: center; }
.hs__head{ padding-top: 110px; }
.hs__track{ display: flex; gap: clamp(18px, 2vw, 34px); padding-inline: var(--pad); margin-top: clamp(26px, 4vh, 50px); will-change: transform; }
.hs__item{ flex: none; width: clamp(300px, 34vw, 560px); display: block; }
.hs__item:nth-child(3n+2) { width: clamp(320px, 44vw, 720px); }
.hs__im{ overflow: hidden; height: clamp(260px, 52vh, 600px); }
.hs__im img{ width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--ease); }
.hs__item:hover .hs__im img { transform: scale(1.06); }
.hs__cap{ display: flex; justify-content: space-between; gap: 14px; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--ln-dark); }
.hs__cap h3{ font-family: var(--serif); font-weight: 300; font-size: clamp(22px, 2vw, 32px); line-height: 1.1; }
.hs__cap span{ font-size: 11px; font-weight: 600; letter-spacing: .22em; color: var(--gold); padding-top: 8px; }
.hs__end{ flex: none; width: clamp(260px, 26vw, 420px); display: grid; align-content: center; gap: 24px; padding-right: var(--pad); }
.hs__bar{ position: absolute; left: var(--pad); right: var(--pad); bottom: clamp(24px, 4vh, 44px); height: 1px; background: var(--ln-dark); }
.hs__bar i{ display: block; height: 100%; width: 0; background: var(--gold); }
@media (max-width: 760px){
  .hs__stick { position: relative; height: auto; padding-block: var(--sec); }
  .hs__head { padding-top: 0; }
  .hs__track { overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 14px; }
  .hs__item, .hs__item:nth-child(3n+2) { width: 80vw; scroll-snap-align: start; }
  .hs__im { height: 58vh; max-height: 460px; }
  .hs__bar { display: none; }
}

/* ---------- Obří logo v patičce vyroste při scrollu ---------- */
.ft__mega img{ transform: translateY(calc((1 - var(--g, 1)) * 40%)) scale(calc(.92 + var(--g, 1) * .08)); transform-origin: bottom center; opacity: calc(.15 + var(--g, 1) * .8); }

/* ---------- Hero podstránek (tmavý, s přiblížením při scrollu) ---------- */
.ph{ position: relative; height: 150vh; background: var(--black); color: var(--t-dark); }
.ph__stick{ position: sticky; top: 0; height: 100vh; height: 100svh; min-height: 560px; overflow: hidden; }
.ph__media{ position: absolute; inset: 0; transform: scale(calc(1.08 + var(--p, 0) * .2)); transform-origin: 50% 60%; }
.ph__media img{ width: 100%; height: 100%; object-fit: cover; }
.ph__stick::after{ content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(90deg, rgba(10,10,10,.8) 0%, rgba(10,10,10,.45) 45%, rgba(10,10,10,.15) 80%), linear-gradient(0deg, rgba(10,10,10,.75), rgba(10,10,10,0) 50%);
}
.ph__dim{ position: absolute; inset: 0; z-index: 1; background: var(--black); opacity: calc(var(--p, 0) * .75); pointer-events: none; }
.ph__txt{ position: absolute; z-index: 2; inset: 104px 0 0; display: flex; align-items: flex-end; padding-bottom: clamp(56px, 10vh, 120px);
  opacity: calc(1 - var(--p, 0) * 1.8); transform: translateY(calc(var(--p, 0) * -70px)); }
.ph__txt .wrap { width: 100%; }
.ph__txt .h-xxl { font-size: clamp(46px, min(8.4vw, 14vh), 150px); max-width: 13ch; margin-top: 26px; }
.ph__sub{ margin-top: 26px; max-width: 50ch; color: rgba(243,239,232,.84); }
.crumbs{ display: flex; flex-wrap: wrap; gap: 10px; font-size: 10.5px; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; color: var(--t-dark-2); margin-bottom: 22px; }
.crumbs a:hover { color: var(--gold); }
.crumbs span[aria-current] { color: var(--gold); }
@media (max-width: 760px){
  .ph { height: 125vh; }
  .ph__stick::after { background: linear-gradient(0deg, rgba(10,10,10,.92) 10%, rgba(10,10,10,.45) 65%, rgba(10,10,10,.35)); }
}

/* Hero: text se drží pod hlavičkou i na nízkých obrazovkách */
.hx__txt{ inset: 104px 0 0; display: flex; align-items: flex-end; }
.hx__txt > .wrap { width: 100%; }
.hx .h-xxl { font-size: clamp(46px, min(9.4vw, 15.5vh), 168px); }
@media (max-height: 620px) and (min-width: 761px){
  .hx__sub { margin-top: 16px; }
  .hx__txt .btns { margin-top: 20px; }
  .hx__txt .eyebrow { margin-bottom: 14px; }
  .hx__txt { padding-bottom: 92px; }
  .btn { min-height: 48px; }
}
.step b, .award__n, .h-xxl, .h-xl, .h-l, .h-m, .ps__info h3, .cta__tel, .big__t { font-variant-numeric: lining-nums; font-feature-settings: "lnum" 1; }
.cta::after{ background: linear-gradient(90deg, rgba(10,10,10,.35) 0%, rgba(10,10,10,.72) 38%, rgba(10,10,10,.95) 62%); }
/* Ikona menu bez přechodů (ve webview se přechody zasekávají) */
.burger span, .burger span::before { transition: none; }
@media (max-width: 760px){
  .ps__slide::after { background: linear-gradient(180deg, rgba(10,10,10,.78) 0%, rgba(10,10,10,.25) 42%, rgba(10,10,10,.35) 60%, rgba(10,10,10,.9) 100%); }
}
.ph__txt .h-xxl { max-width: 16ch; }

/* ---------- Úpravy po připomínkách (28. 9.) ---------- */
/* Obří seznam služeb — menší a kompaktnější */
.big__row{ padding: clamp(12px, 1.4vw, 20px) 0; grid-template-columns: 60px minmax(0,1fr) minmax(0, 30ch) 48px; }
.big__t{ font-size: clamp(30px, 3.6vw, 60px); }
.big__d{ font-size: 13.5px; }
.big__go{ width: 46px; height: 46px; }
.big .big__row:hover .big__t { transform: translateX(22px); }
@media (max-width: 999px){ .big__row { grid-template-columns: 72px minmax(0,1fr) 40px; } .big__thumb { width: 72px; } .big__t { font-size: clamp(26px, 6.4vw, 42px); } .big__go { width: 40px; height: 40px; } }

/* Realizace — obyčejný posuvný pás místo zamknutého scrollu */
.hs{ height: auto !important; }
.hs__stick{ position: relative; height: auto; overflow: visible; display: block; padding-block: var(--sec); }
.hs__head{ padding-top: 0; }
.hs__ctrl{ display: flex; align-items: center; gap: 14px; }
.hs__ctrl .tl { margin-right: 14px; }
.hs__track{
  overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; cursor: grab;
  padding-bottom: 6px; scroll-padding-inline: var(--pad); transform: none !important;
}
.hs__track::-webkit-scrollbar{ display: none; }
.hs__track.is-drag{ cursor: grabbing; scroll-behavior: auto; }
.hs__track.is-drag .hs__item { pointer-events: none; }
.hs__item, .hs__end{ scroll-snap-align: start; }
.hs__im{ height: clamp(300px, 46vh, 520px); }
.hs__bar{ position: relative; left: auto; right: auto; bottom: auto; margin: clamp(24px, 3vw, 40px) var(--pad) 0; }
@media (max-width: 760px){
  .hs__track { scroll-snap-type: x mandatory; }
  .hs__ctrl .arrow { display: none; }
  .hs__bar { display: block; }
}

/* Vlastní kurzor: nad šipkami a odkazy se skryje */
.cur{ transition: transform .35s var(--ease), opacity .2s; }

/* =========================================================
   ZLATÉ LOGO (vektor z EPS klienta) a decentní zlaté akcenty
   ========================================================= */
.lg{ display: block; width: 100%; height: auto; overflow: visible; }
.lg path{ fill: currentColor; }

/* Hlavička: MÜLLER v teplé bílé, linka a podtitul ve zlaté; po najetí celé zlaté */
.brand{ display: block; width: clamp(128px, 10vw, 168px); color: #F3EFE8; transition: color .5s var(--ease); }
.brand .lg__ln, .brand .lg__s path{ fill: var(--gold); }
.brand:hover { color: var(--gold); }
.brand .lg__w path{ transition: transform .6s var(--ease); transform-box: fill-box; }
.brand:hover .lg__w path{ transform: translateY(-6%); transition-delay: calc(var(--i) * 30ms); }
@media (max-width: 1180px){ .brand { width: 128px; } }
.hd.is-solid{ border-bottom-color: rgba(200,154,90,.22); }

/* Úvodní animace loga (úvodní stránka) */
.intro-veil{ background: #0B0B0B; }
.intro-veil__in{ position: relative; width: min(72vw, 460px); color: var(--gold); overflow: hidden; padding: 10px 0; }
.intro-veil .lg__w path{ transform-box: fill-box; transform-origin: 50% 100%; opacity: 0; transform: translateY(60%) scaleY(1.15);
  animation: lgUp .9s var(--ease) forwards; animation-delay: calc(.15s + var(--i) * .07s); }
.intro-veil .lg__ln{ transform-box: fill-box; transform-origin: 50% 50%; transform: scaleX(0); animation: lgLine .9s var(--ease-2) .75s forwards; }
.intro-veil .lg__s path{ opacity: 0; animation: lgFade .7s var(--ease) 1.05s forwards; }
.intro-veil__in::after{
  content: ""; position: absolute; top: -20%; bottom: -20%; left: -40%; width: 30%;
  background: linear-gradient(100deg, rgba(255,240,210,0), rgba(255,240,210,.55), rgba(255,240,210,0));
  mix-blend-mode: overlay; transform: skewX(-18deg) translateX(0); animation: lgGlint 1s var(--ease-2) 1.45s forwards;
}
@keyframes lgUp { to { opacity: 1; transform: none; } }
@keyframes lgLine { to { transform: scaleX(1); } }
@keyframes lgFade { to { opacity: 1; } }
@keyframes lgGlint { to { left: 130%; } }
.intro-veil.is-out{ transform: translateY(-100%); transition: transform 1.1s var(--ease-2); }

/* Opona mezi stránkami se zlatým logem */
.curtain img{ width: min(46vw, 240px); opacity: 1; }

/* Obří logo v patičce — zlatý přechod */
.ft__mega{ color: var(--gold); }
.ft__mega .lg path{ fill: url(#mi-gold); }
.ft__mega .lg{ transform: translateY(calc((1 - var(--g, 1)) * 30%)) scale(calc(.94 + var(--g, 1) * .06)); transform-origin: bottom center; opacity: calc(.2 + var(--g, 1) * .8); }
.ft__mega img{ display: none; }

/* Zlaté linky u nadpisů se při odkrytí „nakreslí“ */
.js .rv .eyebrow::before, .js .rv .tag::before{ transform: scaleX(0); transform-origin: left; }
.js .rv.in .eyebrow::before, .js .rv.in .tag::before{ transform: scaleX(1); transition: transform 1.2s var(--ease) .15s; }
.js .rv.settled .eyebrow::before, .js .rv.settled .tag::before{ transform: none; transition: none; }

/* Zlaté tlačítko — jemný lesk při najetí */
.btn--gold{ overflow: hidden; }
.btn--gold::after{
  content: ""; position: absolute; top: 0; bottom: 0; left: -60%; width: 40%; z-index: 0; pointer-events: none;
  background: linear-gradient(100deg, rgba(255,255,255,0), rgba(255,255,255,.45), rgba(255,255,255,0)); transform: skewX(-20deg);
}
.btn--gold:hover::after{ left: 130%; transition: left .9s var(--ease-2); }

/* =========================================================
   FINÁLNÍ ÚPRAVY PODLE KLIENTA (29. 9.)
   ========================================================= */

/* ---- Hlavička: telefon + plné zlaté tlačítko, položka Virtuální realita ---- */
.hd__in{ gap: clamp(16px, 2vw, 40px); }
.nav{ gap: clamp(14px, 1.5vw, 30px); }
.nav a{ font-size: 10.5px; letter-spacing: .18em; }
.hd__tel{ display: inline-flex; align-items: center; gap: 9px; font-size: 13px; font-weight: 500; letter-spacing: .04em; color: #F3EFE8; white-space: nowrap; transition: color .3s; }
.hd__tel svg{ width: 16px; height: 16px; color: var(--gold); }
.hd__tel:hover { color: var(--gold); }
.hd__cta.btn--gold{ min-height: 48px; padding: 0 24px; font-size: 10.5px; color: var(--black); border-color: var(--gold); }
@media (max-width: 1440px){ .hd__tel { display: none; } }
@media (max-width: 1280px){ .nav, .hd__cta { display: none; } .burger { display: block; } }

/* ---- 1) Úvodní animace: kovové zlaté logo ---- */
.intro-veil .lg path{ fill: url(#mi-gold); }
.intro-veil__in{ width: min(74vw, 520px); }
.intro-veil__in::after{ mix-blend-mode: soft-light; background: linear-gradient(100deg, rgba(255,245,225,0), rgba(255,245,225,.9), rgba(255,245,225,0)); }

/* ---- Přechod mezi stránkami: opona s kovovým logem ---- */
.curtain{ background: #0B0B0B; }
.curtain img { display: none; }
.curtain__logo{ position: relative; width: min(56vw, 300px); overflow: hidden; padding: 6px 0; }
.curtain__logo .lg path{ fill: url(#mi-gold); }
.curtain.is-down .lg__w path{ transform-box: fill-box; opacity: 0; transform: translateY(55%); animation: lgUp .55s var(--ease) forwards; animation-delay: calc(.08s + var(--i) * .035s); }
.curtain.is-down .lg__ln{ transform-box: fill-box; transform: scaleX(0); animation: lgLine .5s var(--ease-2) .3s forwards; }
.curtain.is-down .lg__s path{ opacity: 0; animation: lgFade .4s var(--ease) .38s forwards; }
.lg-glint{ position: absolute; top: -20%; bottom: -20%; left: -45%; width: 32%; pointer-events: none; mix-blend-mode: soft-light; transform: skewX(-18deg);
  background: linear-gradient(100deg, rgba(255,245,225,0), rgba(255,245,225,.95), rgba(255,245,225,0)); }
.curtain.is-down .lg-glint{ animation: lgGlint .7s var(--ease-2) .45s forwards; }
.enter .curtain .lg-glint{ animation: lgGlint .8s var(--ease-2) .05s forwards; }

/* ---- 2) Interiéry navržené pro život — černé pozadí ---- */
.ab2 .about__txt .lead { color: #F3EFE8; }
.ab2 .about__img{ overflow: visible; isolation: isolate; }
.ab2 .about__par{ position: absolute; inset: 0; overflow: hidden; }
.ab2 .about__par img{ width: 100%; height: 100%; object-fit: cover; }
.about__frame{ position: absolute; inset: 22px -22px -22px 22px; border: 1px solid rgba(200,154,90,.55); pointer-events: none; z-index: -1;
  transform: translate(-22px, -22px); opacity: 0; transition: transform 1.4s var(--ease) .5s, opacity 1s .5s; }
.ab2 .about__img.in .about__frame, .ab2 .about__img.settled .about__frame{ transform: none; opacity: 1; }
.js .ab2 .mask.settled { clip-path: none !important; }
.ab2 .pillars{ border-top-color: var(--ln-dark); }
.ab2 .pillar + .pillar{ border-left-color: var(--ln-dark); }
.ab2 .pillar p{ color: var(--t-dark-2); }
.ab2 .pillar h3{ color: #F3EFE8; }
@media (max-width: 1100px){ .ab2 .pillar:nth-child(n+3) { border-top-color: var(--ln-dark); } }
@media (max-width: 600px){ .ab2 .pillar + .pillar { border-top-color: var(--ln-dark); } .about__frame { inset: 12px -12px -12px 12px; } }
.pillar svg *{ stroke-dasharray: 1; stroke-dashoffset: 1; }
.pillar.in svg *{ stroke-dashoffset: 0; transition: stroke-dashoffset 1.8s var(--ease) .25s; }
.pillar.settled svg *{ stroke-dashoffset: 0; transition: none; }
.ab2 .pillar:hover svg{ color: var(--gold-lt); }

/* ---- 4) Rozevření fotky — černé pozadí ---- */
.ex--dark .ex__words span{ color: #F3EFE8; }
.ex--dark .ex__words span:last-child{ color: var(--gold); }

/* ---- 8) Spolupráce: obrázek vpravo se mění s textem ---- */
.st8__grid{ display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(36px, 6vw, 120px); align-items: start; }
.st8 .words{ max-width: 20ch; font-size: clamp(30px, 3.4vw, 58px); }
.st8__head{ margin-top: clamp(70px, 9vw, 150px); }
.st8__steps{ margin-top: clamp(34px, 4vw, 56px); border-top: 1px solid var(--ln-light); }
.st8__step{ display: grid; grid-template-columns: clamp(64px, 6vw, 96px) minmax(0,1fr); gap: 18px; padding: clamp(24px, 3vw, 40px) 0; border-bottom: 1px solid var(--ln-light); opacity: .38; transition: opacity .6s var(--ease); }
.st8__step.is-on{ opacity: 1; }
.st8__step b{ font-family: var(--serif); font-weight: 300; font-size: clamp(40px, 3.8vw, 64px); line-height: .9; color: var(--gold); font-variant-numeric: lining-nums; }
.st8__step h3{ font-size: 12.5px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; margin-top: 6px; }
.st8__step p{ margin-top: 10px; font-size: 15px; color: var(--t-light-2); max-width: 46ch; }
.st8__media{ position: sticky; top: 110px; }
.st8__frame{ position: relative; aspect-ratio: 4/5; overflow: hidden; background: var(--sand); }
.st8__frame figure{ position: absolute; inset: 0; clip-path: inset(100% 0 0 0); transition: clip-path 1.1s var(--ease-2); }
.st8__frame figure.is-on{ clip-path: inset(0 0 0 0); z-index: 2; }
.st8__frame figure.was{ clip-path: inset(0 0 0 0); z-index: 1; transition: none; }
.st8__frame figure.is-settled{ transition: none !important; clip-path: none !important; }
.st8__frame img{ width: 100%; height: 100%; object-fit: cover; transform: scale(1.12); transition: transform 1.8s var(--ease); }
.st8__frame figure.is-on img{ transform: scale(1); }
.st8__frame figcaption{ position: absolute; left: 20px; bottom: 20px; z-index: 3; padding: 9px 14px; background: rgba(17,17,17,.72); backdrop-filter: blur(6px); font-size: 10.5px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: #F3EFE8; }
.st8__count{ position: absolute; right: 20px; top: 20px; z-index: 4; font-size: 12px; font-weight: 600; letter-spacing: .16em; color: rgba(243,239,232,.8); padding: 8px 12px; background: rgba(17,17,17,.55); }
.st8__count b{ color: var(--gold); }
.st8__bar{ position: absolute; left: 0; right: 0; bottom: 0; height: 3px; z-index: 4; background: rgba(17,17,17,.25); }
.st8__bar i{ display: block; height: 100%; width: 16.66%; background: var(--gold); transition: width .8s var(--ease); }
@media (max-width: 900px){
  .st8__grid{ grid-template-columns: 1fr; }
  .st8__media{ order: -1; position: sticky; top: 76px; z-index: 5; margin-inline: calc(var(--pad) * -1); }
  .st8__frame{ aspect-ratio: 16/10; }
  .st8 .st8__txt { position: relative; z-index: 1; }
}

/* ---- 13) Zlaté logo nad spodním pásem ---- */
.flogo{ background: #0B0B0B; color: var(--gold); padding: clamp(90px, 11vw, 180px) 0 clamp(60px, 7vw, 110px); text-align: center; overflow: hidden; }
.flogo__in{ position: relative; width: min(64vw, 720px); margin-inline: auto; overflow: hidden; padding: 8px 0; }
.flogo .lg path{ fill: url(#mi-gold); }
.flogo .lg__w path{ transform-box: fill-box; opacity: 0; transform: translateY(70%); }
.flogo .lg__ln{ transform-box: fill-box; transform: scaleX(0); }
.flogo .lg__s path{ opacity: 0; }
.flogo.in .lg__w path{ opacity: 1; transform: none; transition: opacity 1s var(--ease), transform 1.2s var(--ease); transition-delay: calc(var(--i) * .08s); }
.flogo.in .lg__ln{ transform: none; transition: transform 1.2s var(--ease-2) .6s; }
.flogo.in .lg__s path{ opacity: 1; transition: opacity 1s var(--ease) .9s; }
.flogo.settled .lg__w path, .flogo.settled .lg__ln, .flogo.settled .lg__s path{ opacity: 1; transform: none; transition: none; }
.flogo__glint{ position: absolute; top: -20%; bottom: -20%; left: -45%; width: 28%; pointer-events: none; mix-blend-mode: soft-light; transform: skewX(-18deg);
  background: linear-gradient(100deg, rgba(255,245,225,0), rgba(255,245,225,.9), rgba(255,245,225,0)); }
.flogo.in .flogo__glint{ animation: flGlint 7s var(--ease-2) 1.6s infinite; }
@keyframes flGlint { 0% { left: -45%; } 22% { left: 130%; } 100% { left: 130%; } }
.flogo__claim{ margin-top: clamp(28px, 3vw, 44px); display: inline-flex; align-items: center; gap: 18px; font-size: 11px; font-weight: 600; letter-spacing: .34em; text-transform: uppercase; color: var(--t-dark-2); }
.flogo__claim i{ width: 6px; height: 6px; background: var(--gold); transform: rotate(45deg); }
@media (max-width: 600px){ .flogo__in { width: 84vw; } .flogo__claim { letter-spacing: .2em; gap: 10px; font-size: 10px; } }

/* ---- 12) Spodní pás: realizace + výrazné bílé písmo ---- */
.mq--show{ background: #0B0B0B; color: #F3EFE8; border-block: 1px solid var(--ln-dark); padding-block: clamp(34px, 4vw, 60px); }
.mq--show .mq__in{ align-items: center; }
.mq--show .mq__in span{ font-size: clamp(46px, 6.4vw, 112px); font-weight: 300; color: #F3EFE8; }
.mq--show .mq__in span em{ color: var(--gold); }
.mq--show .mq__in span.mq__ph::after{ display: none; }
.mq--show .mq__ph img{ height: clamp(120px, 13vw, 210px); width: auto; aspect-ratio: 4/3; object-fit: cover; }
.mq--show .mq__in span:not(.mq__ph)::after{ width: .14em; height: .14em; }

/* staré obří logo v patičce už se nepoužívá */
.ft__mega{ display: none; }
.ft{ padding-top: clamp(70px, 8vw, 120px); }

/* ---- Stránka Virtuální realita ---- */
.vr-hud{ position: absolute; inset: 96px clamp(16px, 3vw, 44px) clamp(16px, 3vw, 44px); z-index: 1; pointer-events: none; }
.vr-hud span{ position: absolute; width: 38px; height: 38px; border: 1px solid rgba(200,154,90,.7); }
.vr-hud span:nth-child(1){ left: 0; top: 0; border-right: 0; border-bottom: 0; }
.vr-hud span:nth-child(2){ right: 0; top: 0; border-left: 0; border-bottom: 0; }
.vr-hud span:nth-child(3){ left: 0; bottom: 0; border-right: 0; border-top: 0; }
.vr-hud span:nth-child(4){ right: 0; bottom: 0; border-left: 0; border-top: 0; }
.vr-hud i{ position: absolute; left: 0; right: 0; top: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(200,154,90,.8), transparent); animation: hudScan 5s var(--ease-2) infinite; }
@keyframes hudScan { 0% { top: 0; opacity: 0; } 10% { opacity: 1; } 90% { opacity: 1; } 100% { top: 100%; opacity: 0; } }
.vrs__n{ font-family: var(--serif); font-size: 1.9em; letter-spacing: 0; line-height: 1; margin-right: 6px; font-weight: 400; }
.vrs .tag{ flex-wrap: wrap; }
.vrs__key{ margin-top: 26px; padding-left: 20px; border-left: 2px solid var(--gold); font-size: clamp(17px, 1.3vw, 20px); line-height: 1.55; color: var(--fg); }
.vrs__key strong { font-weight: 600; }
.vrs__note{ margin-top: 16px; font-size: 13.5px; font-style: italic; color: var(--fg2); }
.vrs__sign{ margin-top: 34px; font-size: 11px; font-weight: 600; letter-spacing: .3em; color: var(--gold); }
.vrs__sign em{ display: block; margin-top: 8px; font-family: var(--serif); font-size: 22px; letter-spacing: 0; font-weight: 300; color: #F3EFE8; }
.vcheck{ border-top: 1px solid var(--ln); align-self: center; }
.vcheck li{ display: grid; grid-template-columns: 40px minmax(0,1fr); gap: 14px; align-items: center; padding: 18px 0; border-bottom: 1px solid var(--ln);
  font-family: var(--serif); font-size: clamp(20px, 1.7vw, 27px); line-height: 1.25; opacity: .25; transform: translateX(-14px); transition: opacity .7s var(--ease), transform .9s var(--ease); }
.vcheck li i{ position: relative; width: 30px; height: 30px; border: 1px solid var(--gold); border-radius: 50%; }
.vcheck li i::after{ content: ""; position: absolute; left: 10px; top: 6px; width: 7px; height: 12px; border-right: 1.5px solid var(--gold); border-bottom: 1.5px solid var(--gold); transform: rotate(45deg) scale(0); transition: transform .5s var(--ease) .2s; }
.vcheck li.on{ opacity: 1; transform: none; }
.vcheck li.on i{ background: rgba(200,154,90,.1); }
.vcheck li.on i::after{ transform: rotate(45deg) scale(1); }
.ar{ position: relative; aspect-ratio: 4/3; overflow: hidden; }
.ar img{ width: 100%; height: 100%; object-fit: cover; filter: brightness(.82); }
.ar__grid{ position: absolute; inset: 0; background-image: linear-gradient(rgba(200,154,90,.18) 1px, transparent 1px), linear-gradient(90deg, rgba(200,154,90,.18) 1px, transparent 1px); background-size: 48px 48px; mix-blend-mode: screen; }
.ar__scan{ position: absolute; left: 0; right: 0; height: 30%; top: -30%; background: linear-gradient(180deg, transparent, rgba(200,154,90,.35) 85%, rgba(242,210,160,.9)); animation: arScan 4s var(--ease-2) infinite; }
@keyframes arScan { 0% { top: -30%; } 70% { top: 100%; } 100% { top: 100%; } }
.ar__box{ position: absolute; left: 30%; top: 38%; width: 42%; height: 40%; border: 1px dashed rgba(242,210,160,.9); display: flex; align-items: flex-start; justify-content: flex-end; animation: arBox 4s var(--ease-2) infinite; }
.ar__box b{ transform: translateY(-100%); padding: 6px 10px; background: var(--gold); color: var(--black); font-size: 10px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
@keyframes arBox { 0%, 40% { opacity: 0; transform: scale(.94); } 55%, 100% { opacity: 1; transform: none; } }
.ar__tag{ position: absolute; left: 18px; top: 18px; padding: 9px 14px; background: rgba(17,17,17,.7); backdrop-filter: blur(6px); font-size: 10.5px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--gold); }
.price{ border: 1px solid rgba(200,154,90,.45); padding: clamp(28px, 3.4vw, 52px); background: linear-gradient(160deg, rgba(200,154,90,.1), rgba(200,154,90,0) 60%); }
.price__k{ font-size: 10.5px; font-weight: 700; letter-spacing: .3em; text-transform: uppercase; color: var(--gold); }
.price__t{ margin-top: 18px; font-family: var(--serif); font-size: clamp(28px, 2.4vw, 38px); color: #F3EFE8; }
.price__v{ margin-top: 8px; font-family: var(--serif); font-weight: 300; font-size: clamp(64px, 6vw, 100px); line-height: 1; color: var(--gold); font-variant-numeric: lining-nums; }
.price__v small{ font-size: .3em; color: var(--t-dark-2); margin-right: 8px; }
.price__v span{ font-size: .4em; }
.price__r{ margin-top: 14px; font-size: 15px; color: #F3EFE8; }
.price__l{ margin: 22px 0 28px; border-top: 1px solid var(--ln-dark); }
.price__l li{ padding: 14px 0 14px 22px; position: relative; border-bottom: 1px solid var(--ln-dark); font-size: 14px; color: var(--t-dark-2); }
.price__l li::before{ content: ""; position: absolute; left: 0; top: 1.4em; width: 10px; height: 1px; background: var(--gold); }
@media (max-width: 900px){ .st8__frame { aspect-ratio: auto; height: min(34vh, 58vw); } }
@media (max-height: 620px) and (min-width: 761px){ .hx__txt .eyebrow { display: none; } }
.mq--show .mq__ph img{ max-width: none; width: clamp(160px, 17.4vw, 280px); height: auto; aspect-ratio: 4/3; object-fit: cover; }
.ar__scan{ height: 18%; background: linear-gradient(180deg, rgba(200,154,90,0), rgba(200,154,90,.1) 88%, rgba(242,210,160,.75) 99%, rgba(242,210,160,0)); }
.nav a{ white-space: nowrap; }
@media (max-width: 1640px){ .hd__tel { display: none; } }
/* Kovová textura z loga klienta: úvodní animace, přechody, logo nad patičkou */
.intro-veil .lg path, .curtain__logo .lg path, .flogo .lg path{ fill: url(#mi-tex); }

/* 1a (30. 9.): slova Navrženo / pro život nesmí na začátku zasahovat do fotky */
.ex__frame{ width: calc(30vw + var(--e, 0) * 70vw); height: calc(46vh + var(--e, 0) * 54vh); }
.ex__words span{ font-size: clamp(38px, 5.4vw, 104px); }
.ex__words{ padding-inline: clamp(20px, 3.2vw, 60px); }
@media (max-width: 760px){ .ex__frame { width: calc(78vw + var(--e, 0) * 22vw); height: calc(34vh + var(--e, 0) * 66vh); } .ex__words span { font-size: clamp(38px, 12vw, 64px); } .ex__words { gap: 50vh; } }

/* 3a (30. 9.): spodní pás jen s písmem, menší, bez fotek */
.mq--show .mq__ph{ display: none !important; }
.mq--show .mq__in span{ font-size: clamp(34px, 3.8vw, 64px); }
.mq--show{ padding-block: clamp(26px, 2.8vw, 40px); }

/* Sekce VR na úvodní stránce podle návrhu klienta (30. 9.) */
.vrh{ position: relative; min-height: min(100svh, 980px); display: grid; align-items: center; background: var(--black); color: var(--t-dark); overflow: hidden; }
.vrh__bg{ position: absolute; inset: -6% 0; }
.vrh__bg img{ width: 100%; height: 100%; object-fit: cover; object-position: 60% 50%; }
.vrh::after{ content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10,10,10,.82) 0%, rgba(10,10,10,.55) 34%, rgba(10,10,10,0) 62%); pointer-events: none; }
.vrh__in{ position: relative; z-index: 2; padding-block: clamp(110px, 12vw, 180px); }
.vrh__box{ max-width: 560px; position: relative; padding: clamp(10px, 1vw, 16px) 0 0 clamp(18px, 2vw, 34px); border-left: 1px solid rgba(200,154,90,.35); }
.vrh__box .eyebrow{ margin-bottom: 26px; }
.vrh__box .lead{ margin-top: 28px; max-width: 34ch; color: rgba(243,239,232,.88); }
.vrh__box .btns{ margin-top: 36px; }
@media (max-width: 760px){ .vrh { min-height: 0; align-items: end; } .vrh::after { background: linear-gradient(0deg, rgba(10,10,10,.95) 45%, rgba(10,10,10,.5) 72%, rgba(10,10,10,.1)); } .vrh__in { padding-top: 58vw; padding-bottom: 60px; } .vrh__bg img { object-position: 12% 50%; } }
@media (max-width: 760px){ .vrh__box .eyebrow { letter-spacing: .2em; line-height: 1.6; } }

/* Mobil (30. 9.): seznam služeb bez fotek – název nahoře, popis pod ním, šipka vpravo */
@media (max-width: 999px){
  .big__row { grid-template-columns: minmax(0,1fr) 40px; column-gap: 18px; row-gap: 8px; align-items: center; }
  .big__n, .big__thumb { display: none; }
  .big__t { grid-column: 1; grid-row: 1; margin: 0; padding: 0; }
  .big__d { grid-column: 1; grid-row: 2; margin-top: 0; max-width: 40ch; }
  .big__go { grid-column: 2; grid-row: 1 / span 2; align-self: center; }
}
/* Mobil: obrázek v sekci Jak probíhá spolupráce se lepí úplně nahoru, když hlavička odjede */
@media (max-width: 900px){
  .st8__media { transition: top .35s var(--ease); }
  body:has(.hd.is-away) .st8__media { top: 0; }
}

/* ===== Připomínky klienta 30. 9. večer (1q–7q) ===== */
/* 1q – O nás: fotka bratrů zarovnaná k hornímu okraji, víc místa nad hlavami, bez přiblížení */
.ph--onas .ph__media{ transform: scale(calc(1 + var(--p, 0) * .06)); transform-origin: 50% 0; }
.ph.ph--onas .ph__media img{ object-position: 50% 0; }
.ph--onas .ph__media{ top: clamp(64px, 11vh, 120px); }
.ph--onas .ph__media::before{ content: ""; position: absolute; inset: 0 0 auto; height: 38%; z-index: 1; pointer-events: none; background: linear-gradient(180deg, #0A0A0A 0%, rgba(10,10,10,.6) 35%, rgba(10,10,10,0)); }
/* 2q – úvod, sekce VR: celá fotka v poměru 16:9, bez přiblížení */
@media (min-width: 761px){
  .vrh{ min-height: calc(100vw * 9 / 16); }
  .vrh__in{ padding-block: clamp(56px, 5.5vw, 110px); }
  .vrh__bg{ inset: 0; }
  .vrh__bg img{ object-position: 50% 50%; }
}
/* 3q + 6q – VR náhled (Kuchyně, stránka VR): širší záběr, rozhlížení jen jemně */
.vr__view{ aspect-ratio: 16/10; }
.vr__view img{ top: -3%; left: -5%; width: 110%; height: 106%; }
/* hero stránky VR: celá sestava v záběru, jen jemné přiblížení při scrollu */
.ph--vr .ph__media{ transform: scale(calc(1 + var(--p, 0) * .08)); }
/* 4q – efekt „matrix“ na velké fotce s brýlemi: mřížka, přejíždějící čára a rozsvěcující se čtverečky */
.vrwide{ position: relative; --c: clamp(34px, 3.6vw, 60px); }
.vrwide::before{ content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background-image: linear-gradient(rgba(200,154,90,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(200,154,90,.07) 1px, transparent 1px); background-size: var(--c) var(--c); mix-blend-mode: screen; }
.mx__grid{ position: absolute; inset: 0; z-index: 1; pointer-events: none; background-image: linear-gradient(rgba(242,210,160,.42) 1px, transparent 1px), linear-gradient(90deg, rgba(242,210,160,.42) 1px, transparent 1px); background-size: var(--c) var(--c); mix-blend-mode: screen;
  -webkit-mask-image: linear-gradient(180deg, transparent 40%, rgba(0,0,0,.25) 46%, #000 49.8%, transparent 50.2%); mask-image: linear-gradient(180deg, transparent 40%, rgba(0,0,0,.25) 46%, #000 49.8%, transparent 50.2%);
  -webkit-mask-size: 100% 300%; mask-size: 100% 300%; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; animation: mxMask 5s linear infinite; }
@keyframes mxMask { 0% { -webkit-mask-position: 0 75%; mask-position: 0 75%; } 80%, 100% { -webkit-mask-position: 0 25%; mask-position: 0 25%; } }
.mx__scan{ position: absolute; left: 0; right: 0; top: 0; height: 2px; z-index: 2; pointer-events: none; background: linear-gradient(90deg, rgba(242,210,160,0), rgba(242,210,160,.95) 20%, rgba(242,210,160,.95) 80%, rgba(242,210,160,0)); box-shadow: 0 0 18px 3px rgba(200,154,90,.55); animation: mxScan 5s linear infinite; }
@keyframes mxScan { 0% { top: 0%; opacity: 0; } 5% { opacity: 1; } 75% { opacity: 1; } 80%, 100% { top: 100%; opacity: 0; } }
.mx__sq{ position: absolute; z-index: 1; pointer-events: none; left: calc(var(--c) * var(--x)); top: calc(var(--c) * var(--y)); width: var(--c); height: var(--c); background: rgba(200,154,90,.28); border: 1px solid rgba(242,210,160,.8); opacity: 0; animation: mxSq 5s var(--ease-2) infinite; animation-delay: var(--d, 0s); }
@keyframes mxSq { 0%, 100% { opacity: 0; } 8%, 22% { opacity: 1; } 34% { opacity: 0; } }
.mx__tag{ z-index: 3; }
@media (max-width: 760px){ .vrwide{ --c: 28px; } .mx__sq:nth-of-type(n+4){ display: none; } }
/* 5q – stránka VR, sekce 04: fotka úplně nahoře, text pod ní ve dvou sloupcích */
.vrs .vrframe{ aspect-ratio: 16/9; }
.vrs04{ display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); column-gap: clamp(36px, 6vw, 110px); align-items: start; }
.vrs04 > .rv{ grid-column: 1; grid-row: 1 / span 6; }
.vrs04 > p{ grid-column: 2; }
.vrs04 > p:first-of-type{ margin-top: 0; }
@media (max-width: 900px){ .vrs04{ grid-template-columns: 1fr; } .vrs04 > .rv, .vrs04 > p{ grid-column: 1; grid-row: auto; } .vrs04 > p:first-of-type{ margin-top: 24px; } }
/* 7q – působnost v patičce */
.ft__area{ display: flex; align-items: center; gap: 18px; margin-top: clamp(34px, 4vw, 56px); font-family: var(--serif); font-size: clamp(22px, 2vw, 32px); line-height: 1.3; color: var(--t-dark); }
.ft__area i{ flex: 0 0 46px; height: 1px; background: var(--gold); }
.ft__area em{ color: var(--gold); }
@media (max-width: 600px){ .ft__area{ align-items: flex-start; } .ft__area i{ flex-basis: 26px; margin-top: .7em; } }

/* 1w (1. 10.) – velká slova „Navrženo / pro život“ zmizí dřív, než se objeví nadpis uprostřed, aby se nepřekrývala */
.ex__words span{ opacity: clamp(0, calc(1 - var(--e, 0) * 2.2), 1); }
.ex__center{ opacity: clamp(0, calc((var(--e, 0) - .55) * 3), 1); }
.ex__center .h-xl, .ex__center .h-xl em{ font-weight: 300; }
.hx__sub b{ font-weight: 400; }
/* 2w – odkazy Firmy.cz a profil na Googlu pod sebou */
.award .acts{ flex-direction: column; align-items: flex-start; gap: 16px; }
.award > .tl{ display: flex; width: max-content; } .award > .tl + .tl{ margin-top: 16px; }

/* Rychlý dotaz přes WhatsApp (plovoucí tlačítko) */
.wa{ position: fixed; left: clamp(14px, 1.6vw, 26px); bottom: clamp(14px, 1.6vw, 26px); z-index: 80; display: inline-flex; align-items: center; gap: 12px; padding: 8px 20px 8px 8px; border-radius: 999px; background: rgba(17,17,17,.94); border: 1px solid rgba(200,154,90,.5); color: #F3EFE8; box-shadow: 0 10px 30px rgba(0,0,0,.28); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  opacity: 0; transform: translateY(16px); pointer-events: none; transition: opacity .5s var(--ease), transform .5s var(--ease), border-color .4s; }
.wa.is-on{ opacity: 1; transform: none; pointer-events: auto; }
.wa:hover{ border-color: var(--gold); }
.wa__ic{ width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; background: #25D366; color: #fff; flex: none; }
.wa__ic svg{ width: 24px; height: 24px; }
.wa__t{ display: flex; flex-direction: column; line-height: 1.15; font-size: 13px; font-weight: 600; letter-spacing: .04em; white-space: nowrap; }
.wa__t small{ font-size: 10px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--gold); margin-top: 3px; }
body.is-locked .wa{ opacity: 0; pointer-events: none; }
@media (max-width: 600px){ .wa{ padding: 6px 16px 6px 6px; gap: 10px; } .wa__ic{ width: 38px; height: 38px; } .wa__t{ font-size: 12px; } }
@media print{ .wa{ display: none; } }

/* Klicove slovo v hlavnim nadpisu H1: vypada jako drobny nadpis nad sloganem (SEO, 3. 10.) */
.h1k-wrap{ margin-top: 0 !important; }
.h1k{ display: flex; width: fit-content; max-width: 100%; font-family: var(--sans); font-style: normal; line-height: 1.5; letter-spacing: .32em; margin-bottom: 26px; }
.hx__txt .h1k{ margin-bottom: clamp(22px, 3vh, 36px); color: var(--gold); }
.ph__txt .h1k, .lgx__txt .h1k{ color: var(--gold); }
.lgx__txt .h1k{ margin-inline: auto; margin-bottom: 22px; }
@media (max-width: 760px){ .hx__txt .h1k{ margin-bottom: 14px; } .h1k{ letter-spacing: .22em; } }
@media (max-height: 620px) and (min-width: 761px){ .hx__txt .h1k{ display: none; } }

/* Lišta se souhlasem s cookies */
.ck{ position: fixed; z-index: 90; right: clamp(12px, 1.6vw, 26px); bottom: clamp(12px, 1.6vw, 26px); width: min(460px, calc(100vw - 24px)); padding: 20px 22px; background: rgba(17,17,17,.97); color: #F3EFE8; border: 1px solid rgba(200,154,90,.45); box-shadow: 0 18px 50px rgba(0,0,0,.35); }
.ck[hidden]{ display: none !important; }
.ck__t{ font-size: 13.5px; line-height: 1.6; color: rgba(243,239,232,.86); }
.ck__t strong{ color: #F3EFE8; font-weight: 600; }
.ck__t a{ color: var(--gold); text-decoration: underline; text-underline-offset: 3px; }
.ck__b{ display: flex; gap: 10px; margin-top: 16px; }
.ck__b button{ flex: 1; font: inherit; font-size: 11px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; padding: 13px 14px; cursor: pointer; border: 1px solid rgba(243,239,232,.3); background: none; color: #F3EFE8; transition: border-color .3s, background .3s; }
.ck__b button:hover{ border-color: var(--gold); }
.ck__b .ck__yes{ background: var(--gold); border-color: var(--gold); color: var(--black); }
.ck:not([hidden]) ~ .wa{ opacity: 0 !important; pointer-events: none !important; }
/* mapa Google na Kontaktu: načte se po souhlasu nebo po kliknutí */
.mapc{ position: relative; height: clamp(320px, 42vw, 520px); background: #1A1917 url("../img/kk-okno-1280.jpg") center/cover; display: grid; place-items: center; }
.mapc::before{ content: ""; position: absolute; inset: 0; background: rgba(17,17,17,.78); }
.mapc.is-on::before{ display: none; }
.mapc iframe{ position: absolute; inset: 0; display: block; width: 100%; height: 100%; border: 0; filter: grayscale(1) contrast(1.05); }
.mapc__in{ position: relative; text-align: center; color: #F3EFE8; padding: 24px; }
.mapc__in p{ font-family: var(--serif); font-size: clamp(24px, 2.4vw, 36px); line-height: 1.2; }
.mapc__in small{ display: block; margin-top: 10px; font-size: 13px; color: rgba(243,239,232,.7); }
.mapc__b{ display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 22px; }

/* Netlify vkládá na bezplatném tarifu plovoucí nápis „Powered by Netlify“ — návštěvníkům ho nezobrazujeme */
#nl-badge-frame{ display: none !important; }