/* Motion TWINSreality – schválené efekty (Claude, 31. 10. 2026, faza4-92). Triedy pridáva motion-plus.js; bez neho (alebo pri
   „obmedzenom pohybe“) sa nič z toho neuplatní a stránka vyzerá ako doteraz. ChatGPT: jemnosť efektov sa ladí tu. */
:root{--mx-ease:cubic-bezier(.22,.72,.16,1)}

/* ---------- 1) nadpisy: riadky spod masky + rozmazané → ostré ---------- */
.mx-head .mx-line{display:block;clip-path:inset(-.4em -.35em -.24em -.35em)}
.mx-head .mx-line-in{display:block;translate:0 135%;opacity:0;filter:blur(10px);transition:translate 1.05s var(--mx-ease) calc(var(--i,0)*95ms),opacity .75s ease calc(var(--i,0)*95ms),filter 1s ease calc(var(--i,0)*95ms)}
.mx-head.is-in .mx-line-in{translate:0 0;opacity:1;filter:blur(0)}
.mx-head.is-done .mx-line{clip-path:none}
.mx-head.is-done .mx-line-in{filter:none;transition:none}

/* ---------- 2) prechody sekcií ako listovanie katalógom (titulka) ---------- */
html:not([data-twins-page]) main{background:#0f1613}
.mx-sheet-prev{transform-origin:50% 100%;scale:calc(1 - .03 * var(--mx-sheet,0))}
.mx-sheet-shade{position:absolute;inset:0;z-index:40;background:#070c0a;opacity:calc(.5 * var(--mx-sheet,0));pointer-events:none}
.about-teaser.mx-sheet-prev{opacity:calc(1 - .5 * var(--mx-sheet,0))}
.mx-sheet-next{position:relative;z-index:2;margin-top:-28px;border-radius:28px 28px 0 0;box-shadow:0 -28px 70px -34px #000c}
.mx-sheet-inner{position:relative;z-index:2;box-shadow:0 -28px 70px -34px #000c}
@media(max-width:700px){.mx-sheet-next{margin-top:-20px;border-radius:20px 20px 0 0}}

/* ---------- 3) 3D karusel: tieň na podlahe a hĺbka pri výstupe ---------- */
.mx-floor{position:absolute;left:16%;right:16%;top:calc(var(--library-track-height,700px) * .74);height:clamp(70px,9vw,150px);z-index:0;border-radius:50%;background:radial-gradient(closest-side,#000000b3,#00000000);filter:blur(14px);opacity:calc(.6 * var(--mx-in,0));pointer-events:none}
.mx-vignette{position:absolute;left:0;right:0;top:0;height:var(--library-track-height,700px);z-index:3;background:radial-gradient(ellipse 58% 64% at 50% 46%,#0b110e00 38%,#0b110ee6 100%);opacity:var(--mx-out,0);pointer-events:none}
.offers-track{transform-origin:50% 42%}
body.overview .mx-floor,body.overview .mx-vignette{display:none}

/* ---------- 5) veľké fotky: maska, zmenšenie, jemný pohyb v ráme ---------- */
.mx-drift>img{scale:1.08;translate:0 var(--mx-drift,0%)}
.mx-photo{clip-path:inset(11% 9% round 22px);transition:clip-path 1.35s var(--mx-ease)}
.mx-photo>img{scale:1.2;transition:scale 1.7s var(--mx-ease)}
.mx-photo.is-in{clip-path:inset(0 round 10px)}
.mx-photo.is-in>img{scale:1.08}
.mx-photo.is-done{clip-path:none}

/* ---------- 6) pätička: písmená TWINS vychádzajú spod línie podľa rolovania (hodnoty --d/--b nastavuje JS), potom odlesk (faza4-95).
   Tvar ani hrúbka loga sa nemenia – animuje sa len poloha, ostrosť a svetlo. ---------- */
.mx-rise{clip-path:inset(-.4em -.3em 0 -.3em)}
.mx-rise .wordmark-twins{position:relative}
.mx-rise .mx-ch{display:inline-block;translate:0 calc(var(--d,0) * (.86em + 30px));filter:blur(calc(var(--b,0) * 1px));will-change:translate,filter}
.mx-rise .wordmark-estate{translate:0 calc(var(--d,0) * (1.6em + 30px));filter:blur(calc(var(--b,0) * 1px));opacity:calc(1 - var(--d,0))}
.mx-sheen{position:absolute;left:0;top:0;white-space:nowrap;color:transparent;pointer-events:none;opacity:0;
 background:linear-gradient(100deg,#d6ba8400 41%,#d9bf8ae6 50%,#d6ba8400 59%) 100% 0/300% 100% no-repeat;-webkit-background-clip:text;background-clip:text}
.mx-sheen.go{animation:mx-sheen 2.4s cubic-bezier(.4,0,.2,1) .2s both} /* zlatý odlesk prejde zľava doprava */
@keyframes mx-sheen{0%{background-position:100% 0;opacity:1}92%{opacity:1}100%{background-position:0 0;opacity:0}}

/* ---------- veľký nápis za referenciami: „Klient je vždy na prvom mieste.“ (faza4-99, namiesto „Miesto. Pre vás.“) ---------- */
.about>.big-type[data-big="promise"]{white-space:normal;font-size:clamp(50px,9.6vw,172px);line-height:.95}
.about>.big-type[data-big="promise"] .outline{display:block}
@media(max-width:700px){.about>.big-type[data-big="promise"]{font-size:clamp(40px,11.4vw,80px)}}

/* ---------- počet ponúk makléra v karte (faza4-101, číslo dopĺňa agent-stats.js) ---------- */
.person-caption .person-count{color:#8a6d33;font-weight:500;white-space:nowrap}

@media(prefers-reduced-motion:reduce){
 .mx-head .mx-line-in,.mx-photo,.mx-photo>img{transition:none!important;translate:none!important;opacity:1!important;filter:none!important;clip-path:none!important}
 .mx-sheet-prev{scale:none}.mx-sheet-shade{display:none}
}