:root{--cyan:#05a6c4;--cyan-soft:#7ed8e8;--navy:#00283c;--ink:#f7fcfd;--muted:rgba(247,252,253,.74);--line:rgba(255,255,255,.22);--safe-top:max(3.2vh,env(safe-area-inset-top));--safe-bottom:max(2.8vh,env(safe-area-inset-bottom))}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#00283c;color:var(--ink);font-family:Montserrat,Arial,sans-serif;overscroll-behavior:none;-webkit-tap-highlight-color:transparent}
button{font:inherit}
.display-app{position:relative;width:100%;height:100%;min-height:100%;overflow:hidden;background:radial-gradient(circle at 80% 5%,#087994 0,transparent 42%),#00283c;isolation:isolate;touch-action:none}
.display-stage{position:absolute;inset:0;overflow:hidden;background:#00283c;user-select:none}
.display-image-layer{position:absolute;inset:0;background-position:center;background-size:cover;transform:scale(1.035);transition:opacity .9s ease,transform 10s cubic-bezier(.2,.7,.2,1);will-change:opacity,transform}
.display-image-layer--next{opacity:0}
.display-stage.is-running .display-image-layer{transform:scale(1.12)}
.display-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,24,37,.34) 0%,rgba(0,29,44,.2) 29%,rgba(0,28,42,.46) 49%,rgba(0,28,43,.95) 76%,#00283c 100%),linear-gradient(90deg,rgba(0,40,60,.3),rgba(0,40,60,.08) 62%,rgba(0,25,38,.17));pointer-events:none}
.display-gridlines{position:absolute;inset:0;opacity:.1;background-image:linear-gradient(90deg,transparent calc(50% - .5px),#fff 50%,transparent calc(50% + .5px)),linear-gradient(180deg,transparent calc(25% - .5px),#fff 25%,transparent calc(25% + .5px));pointer-events:none}
.display-header{position:absolute;z-index:5;top:var(--safe-top);left:5.5vw;right:5.5vw;display:flex;align-items:flex-start;justify-content:space-between;gap:4vw}
.display-brand{position:relative;display:flex;align-items:center;gap:1.1vw;width:auto;min-width:clamp(192px,31vw,380px);height:clamp(58px,7vh,112px);padding:.72vh 1.55vw;overflow:hidden;border:1px solid rgba(255,255,255,.23);border-left:clamp(3px,.35vw,6px) solid rgba(5,166,196,.95);border-radius:clamp(8px,1vw,16px);background:linear-gradient(110deg,rgba(0,40,60,.78),rgba(0,63,83,.5));box-shadow:0 13px 38px rgba(0,23,34,.2);backdrop-filter:blur(15px) saturate(1.12)}
.display-brand::after{position:absolute;right:0;bottom:0;left:0;height:2px;background:linear-gradient(90deg,var(--cyan),rgba(126,216,232,.12),transparent);content:''}
.display-brand img{display:block;width:clamp(40px,5.7vw,82px);height:clamp(40px,5.7vw,82px);object-fit:contain}
.display-brand strong{max-width:25vw;color:#fff;font-size:clamp(12px,1.55vw,23px);font-weight:600;letter-spacing:.13em;line-height:1.22;text-transform:uppercase;text-shadow:0 2px 12px rgba(0,20,30,.32)}
.display-header-copy{display:grid;max-width:43vw;gap:.65vh;padding-top:1.1vh;text-align:right;text-shadow:0 3px 18px rgba(0,20,30,.45)}
.display-header-copy span{font-size:clamp(10px,1.35vw,21px);font-weight:700;letter-spacing:.2em;text-transform:uppercase}
.display-header-copy strong{font-size:clamp(13px,1.75vw,28px);font-weight:400;line-height:1.35}
.display-counter{position:absolute;z-index:5;top:22vh;right:5.5vw;display:flex;align-items:center;gap:1.3vw;color:#fff;text-shadow:0 3px 16px rgba(0,20,30,.5)}
.display-counter strong{font-size:clamp(34px,6.8vw,84px);font-weight:300;line-height:1}
.display-counter span{width:clamp(40px,8vw,110px);height:1px;background:rgba(255,255,255,.58)}
.display-counter small{font-size:clamp(12px,1.7vw,26px);font-weight:600}
.display-property{position:absolute;z-index:6;left:5.5vw;right:5.5vw;bottom:20.5vh;display:grid;justify-items:start;max-width:89vw;transform:translateY(0);transition:opacity .42s ease,transform .55s cubic-bezier(.2,.8,.2,1)}
.display-property.is-leaving{opacity:0;transform:translateY(2.2vh)}
.display-badges{display:flex;gap:1vw;margin-bottom:1.4vh}
.display-badges span{display:inline-flex;align-items:center;min-height:clamp(30px,3.5vh,54px);padding:.65vh 1.7vw;border:1px solid rgba(255,255,255,.46);border-radius:999px;background:rgba(0,40,60,.32);backdrop-filter:blur(12px);font-size:clamp(10px,1.35vw,20px);font-weight:700;letter-spacing:.11em;text-transform:uppercase}
.display-badges span:first-child{border-color:transparent;background:var(--cyan)}
.display-location{margin:0 0 1vh;color:#d6f4f8;font-size:clamp(14px,2.2vw,34px);font-weight:600;letter-spacing:.06em;text-shadow:0 4px 20px rgba(0,20,30,.5);text-transform:uppercase}
.display-property h1{max-width:93%;margin:0;color:#fff;font-size:clamp(34px,5.8vw,82px);font-weight:500;letter-spacing:-.035em;line-height:1.1;text-wrap:balance;text-shadow:0 5px 24px rgba(0,18,29,.55)}
.display-facts{display:flex;flex-wrap:wrap;gap:0;margin-top:2.2vh;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.display-fact{display:grid;gap:.35vh;min-width:20vw;padding:1.25vh 2vw 1.25vh 0;margin-right:2vw;border-right:1px solid var(--line)}
.display-fact:last-child{border-right:0}
.display-fact strong{font-size:clamp(18px,2.8vw,40px);font-weight:600}
.display-fact span{color:var(--muted);font-size:clamp(9px,1.15vw,17px);font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.display-price{margin:1.55vh 0 0;color:#fff;font-size:clamp(32px,5.2vw,74px);font-weight:700;letter-spacing:-.035em;text-shadow:0 4px 22px rgba(0,18,28,.48)}
.display-footer{position:absolute;z-index:7;right:5.5vw;bottom:var(--safe-bottom);left:5.5vw;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:3.2vw;padding-top:2vh;border-top:1px solid var(--line)}
.display-contact{display:grid;grid-template-columns:clamp(62px,8vw,116px) minmax(0,1fr);align-items:center;gap:1.8vw;min-width:0}
.display-contact>img{width:clamp(62px,8vw,116px);height:clamp(62px,8vw,116px);border:2px solid rgba(255,255,255,.7);border-radius:50%;background:#e8f7f9;object-fit:cover;object-position:center 25%;box-shadow:0 10px 30px rgba(0,17,27,.32)}
.display-contact>div{display:grid;gap:.35vh;min-width:0;overflow:hidden}
.display-contact span,.display-qr span{color:var(--cyan-soft);font-size:clamp(9px,1.1vw,16px);font-weight:700;letter-spacing:.13em;text-transform:uppercase}
.display-contact strong{overflow:hidden;font-size:clamp(15px,2vw,30px);font-weight:600;text-overflow:ellipsis;white-space:nowrap}
.display-contact small{display:grid;min-width:0;gap:.12vh;color:var(--muted);font-size:clamp(10px,1.25vw,18px);line-height:1.38}
.display-contact small em{display:block;min-width:0;max-width:100%;font-style:normal;overflow-wrap:anywhere}
.display-qr{display:flex;align-items:center;gap:1.5vw;text-align:right}
.display-qr>div:first-child{display:grid;gap:.45vh}
.display-qr strong{font-size:clamp(15px,2vw,30px);font-weight:600}
.display-qr-image{position:relative;display:grid;place-items:center;width:clamp(78px,11vw,156px);height:clamp(78px,11vw,156px);overflow:hidden;border:clamp(5px,.65vw,10px) solid #fff;border-radius:clamp(8px,1vw,15px);background:#fff;box-shadow:0 10px 34px rgba(0,17,27,.3)}
.display-qr-image img{position:relative;z-index:2;width:100%;height:100%;object-fit:contain}
.display-qr-image span{position:absolute;color:#58717d;font-size:1rem}
.display-progress{position:absolute;z-index:9;right:0;bottom:0;left:0;height:clamp(5px,.45vh,9px);overflow:hidden;background:rgba(255,255,255,.13)}
.display-progress i{display:block;width:0;height:100%;background:linear-gradient(90deg,#00a5c3,#8ce4ef);box-shadow:0 0 15px rgba(30,207,235,.5)}
.display-progress.is-animating i{animation:displayProgress var(--slide-duration,10s) linear forwards}
.display-hit{position:absolute;z-index:8;top:14vh;bottom:14vh;width:22%;padding:0;border:0;background:transparent;cursor:pointer}
.display-hit--previous{left:0}.display-hit--next{right:0}
.display-swipe-hint{position:absolute;z-index:7;left:50%;bottom:17.6vh;display:none;align-items:center;gap:1.1vw;padding:.8vh 1.5vw;border:1px solid rgba(255,255,255,.3);border-radius:999px;background:rgba(0,40,60,.35);color:rgba(255,255,255,.76);font-size:clamp(9px,1vw,15px);font-weight:600;letter-spacing:.12em;text-transform:uppercase;transform:translateX(-50%);backdrop-filter:blur(9px)}
.display-swipe-hint span{font-size:1.6em;line-height:.8}
.display-loading,.display-empty{position:absolute;z-index:20;inset:0;display:grid;place-content:center;justify-items:center;gap:2.2vh;padding:8vw;background:radial-gradient(circle at 60% 30%,#087e98,#00283c 62%);text-align:center}
.display-loading img{width:clamp(90px,18vw,230px);animation:displayPulse 2s ease-in-out infinite}.display-loading span{font-size:clamp(14px,2vw,28px);font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.display-empty img{width:clamp(120px,24vw,300px);filter:drop-shadow(0 16px 35px rgba(0,20,30,.2))}.display-empty p{max-width:720px;margin:0;font-size:clamp(22px,4vw,56px);font-weight:400;line-height:1.35}.display-empty small{color:var(--cyan-soft);font-size:clamp(13px,1.8vw,24px);letter-spacing:.14em;text-transform:uppercase}
.display-status{position:absolute;z-index:30;right:2vw;bottom:2vh;max-width:70vw;padding:.65em 1em;border-radius:999px;background:rgba(0,40,60,.88);color:#fff;font-size:clamp(10px,1vw,15px);opacity:0;pointer-events:none;transform:translateY(12px);transition:opacity .25s,transform .25s}.display-status.is-visible{opacity:1;transform:none}.display-status.is-error{background:#8e303a}
.display-install{position:fixed;z-index:40;top:calc(var(--safe-top) + clamp(68px,8vh,122px));left:50%;padding:.85em 1.25em;border:1px solid rgba(255,255,255,.42);border-radius:999px;background:rgba(0,40,60,.82);color:#fff;font-size:clamp(11px,1.35vw,18px);font-weight:700;letter-spacing:.05em;box-shadow:0 12px 34px rgba(0,20,30,.3);transform:translateX(-50%);backdrop-filter:blur(14px);cursor:pointer}.display-install:active{transform:translateX(-50%) scale(.97)}
@keyframes displayPulse{50%{opacity:.55;transform:scale(.94)}}
@keyframes displayProgress{from{width:0}to{width:100%}}
@keyframes displayImageFade{from{opacity:0}to{opacity:1}}
@keyframes displayImageFocus{from{opacity:0;filter:blur(10px) brightness(.78)}to{opacity:1;filter:blur(0) brightness(1)}}
@keyframes displayImageWipe{from{opacity:.35;clip-path:inset(0 0 0 100%)}to{opacity:1;clip-path:inset(0)}}
body[data-image-transition="fade"] .display-image-layer.is-image-entering{animation:displayImageFade .62s ease}
body[data-image-transition="focus"] .display-image-layer.is-image-entering{animation:displayImageFocus .68s ease}
body[data-image-transition="wipe"] .display-image-layer.is-image-entering{animation:displayImageWipe .7s cubic-bezier(.2,.74,.22,1)}
@media (pointer:coarse){.display-swipe-hint{display:flex}.display-hit{display:none}}
@media (max-width:700px) and (orientation:portrait){.display-footer{gap:1.8vw}.display-contact{grid-template-columns:clamp(68px,16vw,82px) minmax(0,1fr);gap:2.3vw}.display-contact>img{width:clamp(68px,16vw,82px);height:clamp(68px,16vw,82px)}.display-contact small{gap:.12vh;font-size:clamp(9px,2.2vw,12px);line-height:1.35}.display-qr>div:first-child{display:none}.display-qr-image{width:clamp(74px,17vw,92px);height:clamp(74px,17vw,92px)}.display-swipe-hint{bottom:calc(var(--safe-bottom) + clamp(88px,18vw,102px))}}
@media (min-width:701px) and (orientation:portrait){.display-footer{grid-template-columns:minmax(0,1fr) auto;gap:2.2vw}.display-contact{grid-template-columns:clamp(92px,10vw,124px) minmax(0,1fr)}.display-contact>img{width:clamp(92px,10vw,124px);height:clamp(92px,10vw,124px)}.display-contact small{gap:.18vh}.display-fact{min-width:12vw;margin-right:1.1vw;padding-right:1.1vw}.display-qr{gap:1vw}.display-qr-image{width:clamp(112px,15vw,174px);height:clamp(112px,15vw,174px)}.display-swipe-hint{bottom:calc(var(--safe-bottom) + clamp(122px,16vw,185px))}}
@media (orientation:landscape){.display-header{z-index:8;top:3.2vh;left:4vw;right:4vw}.display-brand{min-width:min(24vw,310px);height:min(7.5vh,84px);gap:.8vw;padding:.55vh 1.1vw}.display-brand img{width:clamp(34px,4.6vw,64px);height:clamp(34px,4.6vw,64px)}.display-brand strong{max-width:16vw;font-size:clamp(11px,1.3vw,19px)}.display-counter{top:19vh;right:4vw}.display-property{top:clamp(142px,19vh,210px);right:39vw;bottom:4vh;left:4vw;align-content:end;max-width:58vw;min-height:0}.display-property h1{max-width:100%;font-size:clamp(28px,min(3.65vw,6.4vh),62px);line-height:1.08}.display-location{font-size:clamp(13px,min(1.8vw,3.2vh),29px)}.display-fact{min-width:8.5vw;margin-right:1vw;padding-right:1vw}.display-price{font-size:clamp(30px,min(4vw,7vh),64px)}.display-footer{left:auto;right:4vw;bottom:4vh;width:33vw;grid-template-columns:1fr;gap:2.4vh;padding:2.4vh;border:1px solid rgba(255,255,255,.22);border-radius:18px;background:rgba(0,40,60,.52);backdrop-filter:blur(16px)}.display-qr{justify-content:space-between}.display-swipe-hint{bottom:5vh}.display-progress{height:5px}}
@media (orientation:landscape) and (max-height:620px){.display-brand{height:min(6.5vh,58px)}.display-brand img{width:clamp(30px,4vw,50px);height:clamp(30px,4vw,50px)}.display-brand strong{font-size:clamp(10px,1.15vw,16px)}.display-property{top:clamp(104px,18vh,132px);bottom:3vh}.display-property h1{font-size:clamp(25px,min(3.25vw,6vh),48px)}.display-badges{margin-bottom:.8vh}.display-facts{margin-top:1.2vh}.display-fact{padding:.7vh 1.5vw .7vh 0}.display-price{margin-top:.8vh}}
@media (max-height:760px){.display-property{bottom:18vh}.display-property h1{font-size:clamp(27px,5vw,54px)}.display-counter{top:18vh}.display-footer{gap:2vw}}
@media (prefers-reduced-motion:reduce){.display-image-layer,.display-property{transition:none}.display-stage.is-running .display-image-layer{transform:none}}
body[data-transition="fade"] .display-image-layer{transform:none!important;transition-duration:1.15s}
body[data-transition="slide"][data-direction="next"] .display-property.is-leaving{transform:translateX(-4vw)}
body[data-transition="slide"][data-direction="previous"] .display-property.is-leaving{transform:translateX(4vw)}
body[data-transition="focus"] .display-image-layer{transform:scale(1.02);transition:opacity 1.05s ease,transform 10s cubic-bezier(.18,.72,.2,1),filter .85s ease;filter:saturate(.92)}
body[data-transition="focus"] .display-stage.is-running .display-image-layer{transform:scale(1.09);filter:saturate(1.05)}
body[data-transition="focus"] .display-property.is-leaving{opacity:0;transform:scale(.965)}
body[data-transition="rise"] .display-image-layer{transform:scale(1.08) translateY(0);transition:opacity .9s ease,transform 10s cubic-bezier(.2,.7,.2,1)}
body[data-transition="rise"] .display-stage.is-running .display-image-layer{transform:scale(1.13) translateY(-1.2%)}
body[data-transition="rise"] .display-property{transition:opacity .48s ease,transform .68s cubic-bezier(.18,.82,.24,1)}
body[data-transition="rise"] .display-property.is-leaving{opacity:0;transform:translateY(5vh)}
