*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:#24213b;background:#faf8ff;font-family:Segoe UI,Arial,sans-serif}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button:disabled{opacity:.6;cursor:wait}a:focus-visible,button:focus-visible{outline:3px solid #9455e4;outline-offset:5px}.ambience{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden;background:radial-gradient(ellipse at 88% 18%,#e3d9f55e,transparent 42%),radial-gradient(ellipse at 10% 88%,#d8eee85c,transparent 38%),#f8f7fb}.site{max-width:1300px;margin:auto;padding:0 56px}.top{height:120px;display:flex;align-items:center;justify-content:space-between}.wordmark{display:flex;gap:13px;align-items:center;font-size:21px;font-weight:750;letter-spacing:-.5px}.brand-caption{display:block;font-size:10px;letter-spacing:.8px;font-weight:400;color:#8b829c;margin-top:4px}.sign-in{display:flex;gap:24px;align-items:center;font-size:14px;font-weight:600;padding:13px 21px;border:1px solid #ddd5eb;border-radius:30px;background:#ffffff70;transition:background .2s}.sign-in:hover{background:white}.hero{display:grid;grid-template-columns:1.05fr 1fr;gap:70px;align-items:center;padding:54px 0 100px}.eyebrow{font-size:9px;letter-spacing:1.6px;font-weight:700;color:#7e6b9d;display:flex;align-items:center;gap:8px}.eyebrow>span{width:7px;height:7px;background:#b086e1;border-radius:50%}h1{font-size:clamp(52px,5.7vw,78px);line-height:1.06;letter-spacing:-4px;font-weight:700;margin:28px 0}.accent{color:#8651d7}.lead{font-size:17px;color:#7b718b;line-height:1.8;margin:0 0 32px}.cta-row{display:flex;align-items:center;gap:26px}.cta{border:0;border-radius:17px;padding:19px 25px;min-height:58px;background:#8551dc;color:white;box-shadow:0 10px 30px #8454d52b;display:inline-flex;align-items:center;justify-content:center;gap:28px;font-size:14px;font-weight:600;transition:transform .2s,box-shadow .2s}.cta:hover{transform:translateY(-3px);box-shadow:0 15px 35px #8454d54a}.cta:active{transform:scale(.98)}.cta>span{font-size:20px}.secondary{font-size:13px;display:flex;gap:12px}.micro{font-size:10px;color:#9b90a8;margin:15px 0}.error{color:#a53e55;font-size:13px}.hero-demo{min-width:0;scroll-margin-top:30px}.demo-label{font-size:9px;letter-spacing:1.8px;color:#9a8eab;text-align:center;margin-bottom:19px;font-weight:600}.tabs{display:flex;gap:6px;background:#ede7f5;border-radius:15px;padding:5px;margin:0 auto 20px;max-width:410px}.tabs button{border:0;flex:1;border-radius:11px;padding:12px 8px;font-size:12px;color:#84778e;background:transparent;transition:background .2s,color .2s,box-shadow .2s}.tabs [aria-selected=true]{background:#fff;color:#7842c4;box-shadow:0 3px 10px #5d3a8210}.tabs [data-tab=daily][aria-selected=true]{color:#c17628}.tabs [data-tab=sales][aria-selected=true]{color:#218c83}.preview-wrap{position:relative;max-width:440px;margin:auto}.preview{border:1px solid #fff;border-radius:25px;background:#fff;box-shadow:0 25px 80px #6a449b17;overflow:hidden;transform:rotate(2deg);transition:transform .35s}.preview:hover{transform:rotate(0)}.preview-heading{display:flex;justify-content:space-between;align-items:center;padding:17px 23px;border-bottom:1px solid #f1edf7}.tiny-brand{display:flex;gap:8px;align-items:center;font-size:10px;font-weight:650}.window-dots{letter-spacing:3px;color:#d9d3e4}.preview-content{padding:24px}.preview-content h2{font-size:20px;letter-spacing:-.6px;margin:0 0 6px}.preview-subtitle{font-size:11px;color:#998ba9;margin:0 0 20px}.object-image{height:160px;border-radius:14px;overflow:hidden;position:relative}.object-image img{width:100%;height:100%;object-fit:cover;animation:appear .3s ease-out}.object-image>span{position:absolute;bottom:10px;left:12px;background:#ffffffed;padding:7px 11px;border-radius:8px;font-size:9px;color:#66517d}.object-name{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:17px 0}.object-name strong{font-size:13px}.object-name>span{font-size:10px;color:#978ca3}.sample-content{min-height:125px}.calendar-heading{display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#9b8eaa;margin:6px 0 15px}.calendar-heading strong{color:#635375}.calendar{display:grid;grid-template-columns:repeat(7,1fr);text-align:center;font-size:12px;gap:4px}.calendar span{padding:10px 0;background:#f7f5fb;border-radius:7px}.calendar .booked{background:#ffddb5;color:#a25b20}.sample-row{margin-top:17px;display:flex;align-items:center;gap:6px;font-size:10px;color:#95869f}.sample-row strong{margin-left:auto;color:#685576;font-weight:600}.status-dot{width:6px;height:6px;background:#d79241;border-radius:50%}.payment{display:grid;grid-template-columns:1fr auto;gap:7px;background:#f2eaff;padding:12px;border-radius:12px}.payment>span:first-child{font-size:10px;color:#8a73a5}.payment strong{font-size:25px;grid-column:1;grid-row:2}.payment small,.sale-price small{font-size:14px;font-weight:400}.paid{font-size:10px;color:#678c70;grid-row:2;grid-column:2;align-self:center}.sale-price{font-size:27px;font-weight:650;margin:3px 0 14px}.stages{display:flex;gap:5px}.stages span{background:#f1f2f4;flex:1;text-align:center;padding:9px 3px;border-radius:7px;font-size:9px;color:#9b8ca5}.stages .current{background:#d8f5ef;color:#258878}.floating-tag{position:absolute;bottom:-17px;left:-28px;background:#fff;padding:13px 20px;border-radius:13px;box-shadow:0 8px 30px #63518016;font-size:11px;color:#7a678c;display:flex;gap:10px;align-items:center;animation:bob 6s ease-in-out infinite}.floating-tag>span{color:#b085e9;font-size:18px}.preview-note{text-align:right;max-width:440px;margin:30px auto 0;color:#aaa0b5;font-size:9px}.benefits{border-top:1px solid #e7deef;border-bottom:1px solid #e7deef;padding:40px 0;display:grid;grid-template-columns:repeat(3,1fr);gap:60px}.number{display:inline-grid;place-items:center;width:33px;height:33px;border-radius:11px;font-size:11px;font-weight:700}.orange{background:#ffe5c6;color:#b87529}.purple{background:#ebdfff;color:#8d56cc}.teal{background:#d5f3e9;color:#3e9a83}.benefits h2{font-size:17px;letter-spacing:-.3px;margin:17px 0 9px}.benefits p{font-size:13px;line-height:1.8;color:#8b7d98;max-width:280px;margin:0}.closing{display:flex;justify-content:space-between;align-items:center;gap:25px;padding:70px 0}.closing h2{font-size:35px;letter-spacing:-1.3px;line-height:1.18;margin:16px 0 0}.closing .eyebrow{font-size:9px}footer{display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:1px solid #e7deef;padding:27px 0;color:#9b8da8;font-size:11px;flex-wrap:wrap}footer>span:first-child{font-weight:650;color:#6e5a82}footer small{font-size:10px}@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}@keyframes appear{from{opacity:.5;transform:scale(1.03)}to{opacity:1;transform:scale(1)}}@media(max-width:1000px){.site{padding:0 30px}.hero{gap:30px}h1{font-size:60px}.cta-row{gap:15px}.cta{padding:17px 20px;gap:15px}.floating-tag{left:-5px}}@media(max-width:760px){.site{padding:0 22px}.top{height:90px}.wordmark{font-size:18px;gap:8px}.wordmark img{width:41px;height:41px}.brand-caption{font-size:8px}.sign-in{font-size:12px;padding:11px 16px;gap:12px}.hero{grid-template-columns:1fr;gap:48px;padding:35px 0 65px}.eyebrow{font-size:8px;letter-spacing:1px}h1{font-size:clamp(46px,10vw,68px);letter-spacing:-2.8px;margin:24px 0}.lead{font-size:15px}.hero-demo{padding:0 5px}.hero-copy{max-width:500px}.preview{transform:rotate(1deg)}.preview-content{padding:20px}.preview-content h2{font-size:19px}.object-name{flex-wrap:wrap}.floating-tag{left:-8px}.benefits{grid-template-columns:1fr;gap:25px;padding:30px 0}.benefits article{display:grid;grid-template-columns:36px 1fr;column-gap:14px}.benefits h2{margin:3px 0 7px}.benefits p{grid-column:2;max-width:none}.closing{align-items:flex-start;flex-direction:column;padding:45px 0;gap:25px}.closing h2{font-size:31px}footer{flex-direction:column;align-items:flex-start;gap:12px;padding:24px 0}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* One-screen landing */
.site{height:100svh;display:flex;flex-direction:column}.top{height:90px;flex-shrink:0}.site>main{flex:1;min-height:0;display:flex;align-items:center}.hero{width:100%;padding:15px 0 25px;gap:55px}.benefits,.closing{display:none}footer{flex-shrink:0;padding:15px 0;font-size:10px}h1{font-size:clamp(46px,7.5svh,76px);margin:20px 0}.lead{font-size:15px;line-height:1.65;margin-bottom:24px}.preview-content{padding:19px 22px}.preview-content h2{font-size:18px}.object-image{height:clamp(95px,18svh,160px)}.preview-heading{padding:13px 22px}.preview-subtitle{margin-bottom:13px}.object-name{padding:13px 0}.demo-label{margin-bottom:13px}.tabs{margin-bottom:15px}.preview-note{margin-top:23px}.sample-content{min-height:110px}.floating-tag{padding:10px 17px} .error:empty{display:none}
@media(min-width:761px) and (max-height:720px){.top{height:73px}.hero{gap:40px;padding:5px 0 15px}.eyebrow{font-size:8px}h1{font-size:clamp(40px,8svh,58px);margin:14px 0}.lead{font-size:14px;margin-bottom:18px}.cta{padding:13px 20px;min-height:48px}.preview-content{padding:14px 19px}.preview-content h2{font-size:16px}.preview-heading{padding:9px 18px}.object-image{height:100px}.preview-subtitle{margin-bottom:10px}.sample-content{min-height:95px}.calendar span{padding:7px 0}.sample-row{margin-top:11px}.tabs button{padding:9px 6px}.demo-label{margin-bottom:9px}.tabs{margin-bottom:10px}.object-name{padding:10px 0}footer{padding:11px 0}}
@media(max-width:760px){.site{padding:0 22px}.top{height:76px}.hero{display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:24px;padding:8px 0 14px}.hero-copy{max-width:none}h1{font-size:clamp(40px,6.2svh,60px);line-height:1.02;margin:16px 0;letter-spacing:-2px}.lead{font-size:13px;line-height:1.55;margin-bottom:18px}.cta-row{gap:20px}.cta{min-height:48px;padding:13px 18px;font-size:13px}.micro{font-size:9px;margin:10px 0 0}.hero-demo{padding:0}.hero-demo .demo-label,.floating-tag,.preview-note{display:none}.tabs{max-width:none;margin-bottom:9px;padding:4px}.tabs button{padding:9px 5px;font-size:11px}.preview-wrap{max-width:none}.preview{transform:none;border-radius:17px}.preview-heading,.preview-subtitle,.sample-content{display:none}.preview-content{padding:12px;display:grid;grid-template-columns:100px 1fr;gap:6px 12px;align-items:center}.preview-content h2{font-size:15px;line-height:1.2;grid-column:2;grid-row:1;margin:0}.object-image{height:85px;grid-column:1;grid-row:1 / 3;border-radius:10px}.object-image>span{display:none}.object-name{display:block;grid-column:2;grid-row:2;padding:0}.object-name strong{font-size:11px;display:block;margin-bottom:5px}.object-name>span{font-size:10px}footer{flex-direction:row;gap:6px;padding:12px 0;font-size:9px}footer small{display:none}footer>span:first-child{display:none}.eyebrow{font-size:7px;letter-spacing:1px}}
@media(max-width:760px) and (max-height:650px){.top{height:63px}.hero{gap:15px}h1{font-size:38px;margin:11px 0}.lead{font-size:12px;margin-bottom:13px}.brand-caption{display:none}.object-image{height:65px}.preview-content{grid-template-columns:80px 1fr;padding:9px}.micro{font-size:8px}.preview-content h2{font-size:13px}.tabs button{padding:7px 3px}.cta{min-height:44px}footer{padding:8px 0}}
@media(max-height:480px){.site{height:auto;min-height:100svh}.top{height:60px}.hero{padding:10px 0 20px}}

/* A real city stretching to the horizon, with a light veil for the content. */

.site{position:relative;z-index:1}
.lead{color:#655a74}.micro{color:#82718e}.secondary{color:#5b456f}.brand-caption{color:#776586}
footer{color:#675576;border-color:#ffffff8c}footer small{color:#776586}
@media(max-width:760px){}

/* Keep supporting copy legible against the detailed city photograph. */
.hero-copy{position:relative;isolation:isolate}
.hero-copy::before{content:"";position:absolute;inset:-26px -24px;z-index:-1;pointer-events:none;background:#fffdfaf2;border:1px solid #ffffffd9;border-radius:28px;box-shadow:0 18px 60px #22153820;filter:none}
.lead{font-size:17px;line-height:1.65;color:#40344f;font-weight:500}
.micro{font-size:12px;color:#51405f;font-weight:500;line-height:1.6}
.secondary{font-size:14px;color:#493457;font-weight:600}
.eyebrow{font-size:10px;color:#634a7c}.brand-caption{color:#604c72}
.demo-label{font-size:10px;color:#644d7c}.tabs button{color:#675372}
.preview-subtitle{color:#74627f;font-size:12px}.object-name>span{color:#715c80}
.preview-note{font-size:11px;color:#5e476e;background:#ffffffc9;padding:5px 10px;border-radius:8px;display:table;margin-right:0}
footer{font-size:11px;color:#4f3d5d;background:#faf8ffd9;border-radius:10px 10px 0 0;padding-left:12px;padding-right:12px}footer small{font-size:11px;color:#5c486b}
@media(min-width:761px) and (max-height:720px){.lead{font-size:16px}.micro{font-size:11px}}
@media(max-width:760px){.hero-copy::before{inset:-18px -12px;border-radius:22px;filter:none}.lead{font-size:14px;line-height:1.6}.micro{font-size:11px}.eyebrow{font-size:8px}.secondary{font-size:13px}.tabs button{font-size:12px}footer{font-size:10px}.object-name>span{font-size:11px}.brand-caption{font-size:9px}}
@media(max-width:760px) and (max-height:650px){.lead{font-size:13px}.micro{font-size:10px}}

/* Readable cards let the city keep its natural contrast. */
.wordmark{background:#fffdfaf2;padding:10px 14px;border-radius:18px;box-shadow:0 4px 20px #22153809}
.sign-in{background:#fffdfaf5;border-color:#fff}
.demo-label{display:table;margin-left:auto;margin-right:auto;background:#fffdfaf2;padding:9px 13px;border-radius:10px;letter-spacing:1.3px}
.tabs{background:#eee7f7f5;border:1px solid #ffffffb3}
.preview-note{background:#fffdfaf2}
footer{background:#fffdfaf2}
@media(max-width:760px){.wordmark{padding:8px 10px;border-radius:14px}.hero-demo .demo-label,.preview-note{display:none}}

/* Translucent surfaces retain the night lights without softening the text. */
.hero-copy::before{background:#fffdfabd;border-color:#ffffffad;backdrop-filter:blur(4px) saturate(115%);-webkit-backdrop-filter:blur(4px) saturate(115%)}
.wordmark,.sign-in,.demo-label,.preview-note,.floating-tag,footer{background:#fffdfac7;backdrop-filter:blur(4px) saturate(115%);-webkit-backdrop-filter:blur(4px) saturate(115%)}
.preview{background:#fffdfac7;backdrop-filter:blur(4px) saturate(115%);-webkit-backdrop-filter:blur(4px) saturate(115%);border-color:#ffffffad}
.tabs{background:#eee7f7c7;backdrop-filter:blur(4px) saturate(115%);-webkit-backdrop-filter:blur(4px) saturate(115%)}
.tabs [aria-selected=true]{background:#ffffffe0}
.preview-subtitle,.calendar-heading,.object-name>span,.sample-row{color:#594662}
@supports not (backdrop-filter:blur(4px)){.hero-copy::before,.preview,.wordmark,.sign-in,.demo-label,.preview-note,.floating-tag,footer{background:#fffdfae8}}

/* Distinct accents for the message, demo action, and sign-in action. */
:root{--headline-accent:#087f8c;--demo-accent:#b9472b;--demo-hover:#a03922}
:root[data-landing-palette="sky"]{--headline-accent:#2462ba;--demo-accent:#a63466;--demo-hover:#8b2853}
:root[data-landing-palette="violet"]{--headline-accent:#713f9b;--demo-accent:#a15b05;--demo-hover:#884b00}
:root[data-landing-palette="berry"]{--headline-accent:#a13f64;--demo-accent:#165e9e;--demo-hover:#104d84}
.accent{color:var(--headline-accent);transition:color .22s}
.cta{background:var(--demo-accent);box-shadow:0 8px 24px #20152e26;transition:background .22s,transform .2s,box-shadow .2s}
.cta:hover{background:var(--demo-hover);box-shadow:0 12px 28px #20152e38}
.sign-in{background:#263b62;color:#fff;border:1px solid #ffffff38;box-shadow:0 5px 16px #0c183126;backdrop-filter:none;-webkit-backdrop-filter:none;transition:background .2s,transform .2s}
.sign-in:hover{background:#172b4d;transform:translateY(-2px)}
/* This comparison panel only appears when the colours preview is opened. */
.color-review{position:fixed;z-index:20;bottom:24px;left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100vw - 24px);padding:14px 16px;background:#fffdfaf5;border:1px solid #fff;border-radius:18px;box-shadow:0 12px 45px #080a185c;color:#30283d;backdrop-filter:blur(12px)}
.color-review-top{display:flex;align-items:center;justify-content:space-between;gap:25px;margin-bottom:10px}.color-review-top strong{font-size:12px;font-weight:650}.color-review-close{border:0;border-radius:8px;background:#ebe6f2;color:#5b486c;padding:7px 11px;font-size:11px;min-height:30px}
.color-options{display:flex;gap:7px}.color-option{--word:#087f8c;--action:#b9472b;position:relative;border:1px solid #e2dbe9;background:#fff;border-radius:10px;padding:10px 12px 10px 44px;color:#574c63;font-size:11px;min-height:43px;white-space:nowrap}.color-option[data-palette="sky"]{--word:#2462ba;--action:#a63466}.color-option[data-palette="violet"]{--word:#713f9b;--action:#a15b05}.color-option[data-palette="berry"]{--word:#a13f64;--action:#165e9e}.color-option::before,.color-option::after{content:"";position:absolute;width:15px;height:15px;border:2px solid white;border-radius:50%;left:12px;top:50%;transform:translateY(-50%);background:var(--word)}.color-option::after{left:23px;background:var(--action)}.color-option[aria-pressed="true"]{border-color:#6c5c89;box-shadow:inset 0 0 0 1px #6c5c89;background:#f5f1fb;color:#30243f}.color-option:hover{background:#f4f0f9}
@media(max-width:760px){.color-review{bottom:14px;width:calc(100vw - 24px);padding:12px}.color-options{display:grid;grid-template-columns:1fr 1fr;gap:7px}.color-option{padding-right:8px;padding-left:40px;font-size:10px;min-width:0}.color-review-top{margin-bottom:9px}.color-review-top strong{font-size:11px}}

/* A real-material desktop surrounds the application. */
.ambience{background:#eae8e2 url('/office-background.png') center center/cover no-repeat}
.hero-copy::before{background:#fffefaad;border:1px solid #ffffffbd;box-shadow:0 14px 45px #403a2410;backdrop-filter:none;-webkit-backdrop-filter:none}
.preview{background:#fffffff2;box-shadow:8px 24px 50px #403a242b}
.wordmark,.demo-label{background:transparent;box-shadow:none}
footer{background:#ffffff8a;border-color:#dedad0}
.color-review{box-shadow:0 12px 40px #30243f25}
@media(max-width:760px){.ambience{background-size:auto 100%;background-position:100% center}.hero-copy::before{background:#fffefac9}.top{position:relative;z-index:1}}

/* The brand sits directly on the desktop, without a glass panel. */
.wordmark{background:transparent;border:0;border-radius:0;padding:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}

/* Contrast for the walnut desktop. */
.wordmark{color:#fff8eb;text-shadow:0 1px 4px #21140e45}.wordmark img{filter:none}.brand-caption{color:#f3e3d0}.demo-label{color:#fff3df;text-shadow:0 1px 3px #21140e80}.hero-copy::before{background:#fffefade}


/* Clearer glass reveals the walnut grain. */
.hero-copy::before{background:#fffefaa6;border-color:#ffffff80}.preview{background:#fffefac2;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);border-color:#ffffff80}.tabs{background:#eee7f79e;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.floating-tag,.preview-note{background:#fffdfaa6;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}footer{background:#ffffff66}

