*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:95px}
body{margin:0;background:#fff;color:#171717;font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
a:focus-visible,summary:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #555;outline-offset:6px}
nav{height:94px;max-width:1320px;margin:auto;padding:0 42px;display:flex;align-items:center;justify-content:space-between}
nav>div{display:flex;align-items:center;gap:32px;font-size:14px;font-weight:600}
.brand{font-size:32px;font-weight:900;letter-spacing:-1.9px}
.brand span{font-size:10px;vertical-align:top;letter-spacing:0;margin:5px}
.button{display:inline-flex;gap:38px;align-items:center;justify-content:center;padding:19px 25px;border-radius:40px;background:#171717;color:white;font-size:15px;font-weight:600;transition:transform .2s}.button:hover{transform:translateY(-2px)}
.button.secondary{background:#f0f0f0;color:#171717;border:1px solid #ddd}
.small{padding:13px 20px;font-size:13px}
.hero{margin:0 24px;text-align:center;border-radius:36px;background:radial-gradient(ellipse at 50% 85%,#ddd 0%,#f3f3f3 45%,#fafafa 78%);padding:62px 20px 24px;overflow:hidden}
.eyebrow{font-size:11px;font-weight:700;letter-spacing:2px;line-height:1.6}
.dot{display:inline-block;width:6px;height:6px;background:#171717;border-radius:50%;margin-right:7px;vertical-align:middle}
h1{font-size:clamp(54px,6.8vw,94px);line-height:1.01;letter-spacing:-6px;margin:24px 0}
h1 span{color:#737373}
.lead{font-size:18px;line-height:1.7;color:#606060;margin:0 0 26px}
.availability{font-size:12px;color:#777;margin-top:13px}
.hero-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.previewlabel{position:relative;z-index:3;background:#f3f3f3;padding:18px;margin:0 -20px -24px;font-size:10px;color:#777}
.showcase{display:flex;justify-content:center;align-items:flex-end;gap:22px;margin:52px auto 0;height:505px;max-width:880px}
.phone{position:relative;border:7px solid #242424;background:#fff;width:242px;height:480px;flex-shrink:0;border-radius:40px;padding:15px 13px 0;box-shadow:0 18px 32px #0002,inset 0 0 0 2px #aaa;overflow:hidden;text-align:left}
.island{position:absolute;top:8px;left:50%;transform:translateX(-50%);width:80px;height:20px;background:#171717;border-radius:25px}
.phonebar{display:flex;justify-content:space-between;font-size:9px;font-weight:700;padding:0 5px;margin:0 0 27px}
.phonebar span{font-size:7px}
.middle{height:500px;width:252px;z-index:2}
.side{height:443px}
.left{transform:rotate(-8deg) translateY(24px)}
.right{transform:rotate(8deg) translateY(24px)}
.minibrand{font-weight:900;font-size:28px;text-align:center;letter-spacing:-1.3px;margin:20px 0}
.phone h2{font-size:22px;text-align:center;line-height:1.05;letter-spacing:-1px;margin:15px 0 25px}
.searchmock{padding:12px;border:1px solid #bbb;border-radius:18px;font-size:10px}
.searchmock hr{border:0;border-top:1px solid #ddd;margin:13px 0}
.dates{display:flex;justify-content:space-between;font-size:6px;color:#555}
.dates b{display:inline-block;font-size:9px;color:#171717;margin-top:4px}
.mockbutton{margin-top:15px;padding:11px;text-align:center;background:#171717;color:white;border-radius:20px;font-size:10px;font-weight:bold}
.chips{display:flex;gap:8px;margin-top:9px;font-size:9px}
.chips span{border:1px solid #ddd;padding:9px 12px;border-radius:20px;flex:1}
.miniask{padding:15px 3px;font-size:12px}
.miniask p{font-size:10px;line-height:1.7;color:#666}
/* Match the app's four-tab glass navigation in the illustrative phone. */
.tabmock{position:absolute;bottom:10px;left:10px;right:10px;height:49px;border:1px solid #d9d9d9;border-radius:28px;padding:4px;display:flex;align-items:stretch;gap:2px;background:rgba(255,255,255,.94);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 3px 12px #00000012}
.tab-item{flex:1;min-width:0;border-radius:22px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:7px;font-weight:700;line-height:1;color:#555;border:1px solid transparent}
.tab-item svg{display:block;width:20px;height:20px;flex-shrink:0}
.tab-item.active{background:rgba(0,0,0,.08);color:#000;border-color:rgba(0,0,0,.06)}
.minihead{font-size:29px;font-weight:bold;letter-spacing:-1px;padding:6px}
.ocean{height:155px;margin:15px 0;border-radius:15px;position:relative;overflow:hidden;padding:11px;display:flex;flex-direction:column;justify-content:space-between;background:linear-gradient(125deg,#dbf0ff 0%,#e9f9f2 45%,#ffe9e0 100%);background-size:cover;background-blend-mode:multiply}
.ocean::before{content:"";position:absolute;inset:0;border-radius:15px;background:
linear-gradient(90deg,rgba(255,255,255,0.18),rgba(255,255,255,0)) 0 0/80px 100% no-repeat,
linear-gradient(180deg,rgba(255,255,255,0.12),rgba(255,255,255,0)) 0 0/100% 60px no-repeat,
radial-gradient(circle at 78% 20%,rgba(255,255,255,.4),rgba(255,255,255,0) 55%);
pointer-events:none}
.phonecaption{font-size:10px;line-height:1.6;color:#555}
.right .minibrand{font-size:18px;letter-spacing:-.6px}
.askbubble{background:#eee;border-radius:18px;padding:17px;font-size:12px;line-height:1.7;margin-top:24px}
.answer{padding:24px 8px;font-size:19px;line-height:1.2}
.answer p{font-size:11px;color:#666;line-height:1.8}.mocktag{font-size:9px;text-align:center;border-top:1px solid #eee;padding-top:13px}
.steps{max-width:1160px;margin:90px auto 0;padding:0 24px}
.step-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.step-grid article{border:1px solid #e5e5e5;border-radius:24px;padding:22px 22px 26px;background:#fafafa}
.step-pill{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:#171717;color:#fff;font-size:13px;font-weight:700;margin-bottom:14px}
.roadmap{max-width:1160px;margin:68px auto 0;padding:0 24px}
.timeline{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.phase{border:1px solid #e5e5e5;border-radius:24px;padding:22px;background:#fafafa}
.phase .phase-label{margin:0 0 8px;font-size:11px;font-weight:700;letter-spacing:1.5px;color:#555}
.phase.done{background:#fff;border-color:#cfcfcf}
.phase.now{background:#171717;color:#fff}
.phase.now .phase-label,.phase.now h3,.phase.now p{color:#fff}
.phase.next{background:#f3f3f3}
.intro{max-width:790px;margin:100px auto 50px;text-align:center;padding:0 24px}
h2{font-size:clamp(34px,4vw,54px);line-height:1.06;letter-spacing:-2.3px;margin:20px 0}
.intro>p:last-child{max-width:530px;margin:25px auto;line-height:1.8;color:#666;font-size:17px}
.features{max-width:1160px;margin:0 auto 105px;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding:0 24px}
.features article{border:1px solid #e5e5e5;border-radius:24px;padding:28px 26px 0;overflow:hidden;background:#fafafa}
.number{font-size:10px;letter-spacing:1.5px;color:#666}h3{font-size:30px;letter-spacing:-1.2px;line-height:1.1;margin:24px 0 15px}
.features p{font-size:14px;line-height:1.8;color:#606060}
.featurequote{font-size:23px;line-height:1.3;letter-spacing:-.7px;margin:35px -5px 30px;padding:24px 15px;background:#fff;border:1px solid #e5e5e5;border-radius:20px}
.visualocean{height:167px;margin:28px -26px 0;position:relative;overflow:hidden;border-top:1px solid #e4e4e4;background:
linear-gradient(160deg,#fef4e6 0,#dcefff 45%,#d7f3ff 100%)}
.visualocean::before{content:"";position:absolute;inset:0;background:
linear-gradient(100deg,rgba(255,255,255,.65),rgba(255,255,255,0) 52%),
linear-gradient(45deg,rgba(255,255,255,.35),rgba(255,255,255,0) 68%);
opacity:.85}
.visualocean::after{content:"";position:absolute;left:12px;right:12px;top:12px;bottom:12px;background:
radial-gradient(circle at 24% 30%,#ffffff 0 38px,#eaf5ff 39px 40px,transparent 0),
radial-gradient(circle at 74% 70%,#fff7e5 0 34px,#e8f8f8 35px 36px,transparent 0);
opacity:.6}

.photo-chip{display:inline-flex;align-items:center;justify-content:center;z-index:1;border-radius:999px;background:rgba(255,255,255,.85);backdrop-filter: blur(2px);font-size:10px;padding:6px 10px;max-width:100px;text-align:center;align-self:flex-start}
.ocean .photo-chip{margin:0 4px 4px 0;background:rgba(255,255,255,.92)}
.visualocean .photo-chip{position:relative;z-index:1;display:block;margin:10px 0 0 16px;background:rgba(255,255,255,.88)}
.proof{max-width:1160px;margin:0 auto 90px;padding:0 24px}
.proof-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.proof blockquote{margin:0;border:1px solid #e5e5e5;border-radius:24px;padding:24px;background:#fafafa;font-size:16px;line-height:1.7;color:#606060}
.download{background:#171717;color:#fff;border-radius:32px;max-width:1232px;margin:0 auto;padding:65px;display:grid;grid-template-columns:1.15fr 1fr;gap:70px}
.download p{font-size:15px;line-height:1.8;color:#aaa}
.download .eyebrow{font-size:10px;color:#aaa}
.release{display:inline-block;border:1px solid #777;border-radius:30px;padding:16px 22px;margin-top:20px;font-size:14px;font-weight:bold}
.download .android{font-size:12px}.download-buttons{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}.download-buttons .button{background:#fff;color:#171717}.download .button.secondary{background:#2f2f2f;color:#fff;border-color:#5a5a5a}
.launchcard{background:#272727;border:1px solid #444;border-radius:24px;padding:30px}.launchicon{font-size:27px;background:#fff;color:#171717;font-weight:bold;display:inline-grid;place-items:center;width:52px;height:52px;border-radius:14px}.launchcard h3{font-size:30px}.launchcard a{text-decoration:underline;font-size:14px}.launchcard .fine{font-size:11px;margin-top:24px}
.contact{max-width:1160px;margin:100px auto 0;padding:0 24px;display:grid;grid-template-columns:1fr 1.2fr;gap:65px;align-items:center}
.contact p{font-size:16px;line-height:1.8;color:#606060}.contact .contact-email{display:block;font-size:clamp(18px,2.3vw,27px);font-weight:700;letter-spacing:-.5px;text-decoration:underline;text-underline-offset:5px;overflow-wrap:anywhere;margin:20px 0 28px}
.contact-card{border:1px solid #ddd;border-radius:24px;background:#fafafa;padding:32px}.contact-card h3{margin-top:0}.contact-note{font-size:12px;margin-bottom:0}
.contact-form label{display:block;font-size:12px;font-weight:bold;text-transform:uppercase;letter-spacing:1px;margin:22px 0 10px}.contact-form input:not([type=hidden]),.contact-form textarea{display:block;width:100%;border:1px solid #ccc;border-radius:16px;background:white;color:#171717;padding:16px;font:inherit;font-size:16px}.contact-form textarea{resize:vertical;min-height:160px}
.contact-form .button{width:100%;border:0;cursor:pointer;margin-top:24px;font-family:inherit}.contact-form a{text-decoration:underline;overflow-wrap:anywhere}
.faq{max-width:1160px;margin:100px auto;display:grid;grid-template-columns:1fr 1.4fr;gap:65px;padding:0 24px}
details{border-bottom:1px solid #ddd;padding:22px 0}summary{font-weight:600;font-size:16px;cursor:pointer;line-height:1.4}details p{font-size:15px;line-height:1.8;color:#666}details a{text-decoration:underline}
.press-kit{max-width:1160px;margin:0 auto 72px;padding:0 24px}.press-kit p{font-size:16px;line-height:1.8;color:#666}.press-kit a{text-decoration:underline}
.legal{max-width:800px;padding:40px 24px;margin:auto}.legal h1{font-size:48px;letter-spacing:-2px}.legal h2{font-size:24px;letter-spacing:-.5px}.legal p{line-height:1.8;color:#555}
footer{border-top:1px solid #ddd;padding:35px 42px;display:flex;align-items:center;gap:28px}footer p{font-size:12px;color:#777}footer>div{margin-left:auto;display:flex;gap:24px;font-size:12px;color:#555}
@media(max-width:720px){nav{height:78px;padding:0 20px}nav>div{gap:16px}nav>div>a:not(.button){display:none}.brand{font-size:29px}.hero{margin:0 10px;padding:42px 14px 24px;border-radius:24px}h1{letter-spacing:-3px;font-size:53px}.lead{font-size:15px} .hero-actions{justify-content:space-around}.showcase{gap:0;height:450px;margin-top:36px}.middle{transform:scale(.88);transform-origin:bottom center;margin:0 -10px}.side{width:210px;opacity:.5;transform:scale(.75) rotate(-9deg) translateX(50px);margin-left:-150px}.right{transform:scale(.75) rotate(9deg) translateX(-50px);margin-left:0;margin-right:-150px}.intro{margin:65px auto 30px}h2{font-size:37px;letter-spacing:-1.6px}.features{grid-template-columns:1fr;gap:16px;margin-bottom:60px}.download{margin:0 10px;padding:30px 22px;grid-template-columns:1fr;gap:24px;border-radius:24px}.launchcard{padding:24px}.contact{grid-template-columns:1fr;gap:28px;margin:64px auto 0;align-items:start}.contact-card{padding:24px}.faq{grid-template-columns:1fr;gap:10px;margin:60px auto}footer{padding:30px 24px;flex-wrap:wrap;gap:16px}footer>div{margin-left:0;width:100%;flex-wrap:wrap}.step-grid,.timeline,.proof-grid{grid-template-columns:1fr;gap:16px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button{transition:none}}

/* Readable feature previews, with recognizable hotel imagery. */
.features article{display:flex;flex-direction:column;padding-bottom:24px}
.feature-demo{margin-top:auto;border:1px solid #e2e2e2;border-radius:18px;background:#fff;overflow:hidden;min-height:292px;text-align:left}
.features article>p{margin-bottom:28px}
.demo-label{display:block;font-size:9px;font-weight:700;letter-spacing:1px;color:#737373;line-height:1.5}
.ask-demo,.saved-demo{padding:18px}
.demo-prompt{margin:14px 0 18px;padding:13px;border-radius:14px;background:#f1f1f1;font-size:14px;line-height:1.5}
.ask-demo>strong{font-size:15px}
.ask-demo ul{margin:10px 0 0;padding-left:18px;font-size:12px;line-height:1.7;color:#555}
.hotel-demo>img{display:block;width:100%;height:166px;object-fit:cover;object-position:center}
.demo-details{padding:14px}
.demo-details>strong{display:block;font-size:18px;margin:8px 0 6px;letter-spacing:-.4px}
.demo-details>span:not(.demo-label){font-size:11px;color:#666}
.demo-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:12px}
.demo-tags span{border:1px solid #dedede;border-radius:12px;padding:5px 7px;font-size:9px;color:#555}
.saved-demo>strong{display:block;font-size:22px;letter-spacing:-.6px;margin:16px 0 8px}
.saved-status{font-size:11px;color:#555}
.saved-stay{display:flex;align-items:center;gap:11px;margin-top:18px;border-top:1px solid #eee;padding-top:16px}
.saved-stay img{width:75px;height:68px;object-fit:cover;border-radius:10px}
.saved-stay b{display:block;font-size:12px;line-height:1.4}
.saved-stay div>span{display:block;font-size:11px;color:#777;margin-top:6px}
.trip-checklist{display:flex;flex-direction:column;gap:8px;margin-top:17px;font-size:11px;color:#555}