@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Nunito+Sans:opsz,wght@6..12,400;6..12,600;6..12,700;6..12,800;6..12,900&family=Playfair+Display:ital,wght@0,600;0,700;1,600&display=swap');

:root { --ink:#123b5d; --teal:#3f9297; --cream:#fffaf3; --paper:#fff6e9; --sun:#ffae23; --coral:#f57a61; --sage:#94ab59; --moss:#506b48; --line:rgba(18,59,93,.13); }
* { box-sizing:border-box; }
body { margin:0; background:#fffdf9; color:var(--ink); font-family:"Nunito Sans",sans-serif; }
button { font:inherit; cursor:pointer; }
.site-header { max-width:1240px; display:flex; justify-content:space-between; align-items:center; padding:24px 32px; margin:auto; border-bottom:1px solid var(--line); }
.brand { text-decoration:none; color:var(--ink); font-weight:900; font-size:20px; letter-spacing:-.6px; display:flex; align-items:center; gap:8px; }
.brand-mark { width:26px; height:26px; display:grid; place-items:center; color:white; border-radius:50% 50% 46% 46%; background:var(--teal); font-size:12px; }
.header-note,.stage-toolbar,footer { font-family:"DM Mono",monospace; font-size:11px; letter-spacing:.03em; text-transform:uppercase; color:#688096; }
.intro { max-width:1240px; padding:78px 32px 38px; margin:auto; }
.eyebrow,.landing-kicker { margin:0 0 14px; font-family:"DM Mono",monospace; font-size:11px; text-transform:uppercase; letter-spacing:.12em; font-weight:500; }
.eyebrow { color:#37868c; }
h1 { max-width:740px; margin:0; font-size:clamp(48px,7vw,94px); line-height:.95; letter-spacing:-.075em; font-weight:900; }
.intro-copy { max-width:530px; margin:26px 0 0; font-size:17px; line-height:1.65; color:#557087; }
.direction-picker { max-width:1240px; margin:auto; padding:0 32px 40px; display:grid; grid-template-columns:repeat(5,1fr); gap:10px; }
.direction { min-height:120px; padding:16px; border:1px solid var(--line); border-radius:16px; background:white; text-align:left; transition:.2s transform,.2s background,.2s border-color,.2s box-shadow; color:var(--ink); }
.direction:hover { transform:translateY(-3px); border-color:rgba(18,59,93,.35); box-shadow:0 10px 20px rgba(18,59,93,.08); }
.direction.active { background:var(--ink); color:white; border-color:var(--ink); }
.direction span,.direction strong,.direction small { display:block; }
.direction .number { font-family:"DM Mono",monospace; font-size:10px; margin-bottom:18px; opacity:.65; }
.direction strong { font-size:16px; letter-spacing:-.4px; }
.direction small { margin-top:4px; font-size:11px; line-height:1.25; opacity:.7; }
.stage { max-width:1240px; margin:0 auto 62px; padding:0 32px; }
.stage-toolbar { border-top:1px solid var(--line); padding:15px 2px; display:flex; justify-content:space-between; }
.landing { display:none; position:relative; isolation:isolate; min-height:640px; overflow:hidden; border-radius:25px; box-shadow:0 24px 65px rgba(31,62,75,.14); }
.landing.is-visible { display:block; animation:appear .3s ease-out; }
.landing-page .landing { min-height:100svh; border-radius:0; box-shadow:none; }
@keyframes appear { from { opacity:.2; transform:translateY(8px); } to { opacity:1; transform:none; } }
.landing nav { position:absolute; z-index:10; top:0; left:0; width:100%; padding:29px 40px; display:flex; justify-content:space-between; align-items:center; font-size:13px; font-weight:800; }
.mini-logo { font-size:17px; letter-spacing:-.5px; font-weight:900; }
.landing h2 { margin:0; letter-spacing:-.075em; font-weight:900; line-height:.9; }
.landing p { margin:0; }

/* 01: sunny illustrated hero */
.landing-sunlit { background:#fff9ee; }
.landing-sunlit nav { color:var(--ink); }
.sun { position:absolute; z-index:-1; width:105px; height:105px; right:12%; top:17%; background:var(--sun); border-radius:50%; box-shadow:0 0 0 16px rgba(255,174,35,.08); }
.cloud { position:absolute; z-index:-1; width:112px; height:35px; border-radius:40px; background:#d9e9e6; opacity:.72; }
.cloud:before,.cloud:after { content:""; position:absolute; bottom:0; border-radius:50%; background:inherit; }.cloud:before { width:48px;height:48px;left:20px; }.cloud:after { width:63px;height:63px;right:12px; }
.cloud-one { top:21%; left:52%; }.cloud-two { top:40%; right:3%; transform:scale(.65); }
.sunlit-copy { position:absolute; z-index:3; left:10%; top:31%; width:46%; }.sunlit-copy h1 { max-width:none; font-size:clamp(50px,6vw,84px); line-height:.9; letter-spacing:-.075em; font-weight:900; }.sunlit-copy > p { max-width:330px; margin-top:20px; font-size:17px; line-height:1.5; color:#557087; }
.notify-button,.paper-button,.outline-button { border:0; border-radius:999px; margin-top:42px; padding:14px 20px; font-weight:900; font-size:13px; }.notify-button { display:flex; width:fit-content; align-items:center; background:var(--ink); color:white; }.notify-button span { padding-left:12px; color:#f7b540; font-size:18px; }
.play-scene i { position:absolute; display:block; }.hill { z-index:1; bottom:-40px; border-radius:50% 50% 0 0; }.hill-one { width:78%;height:230px;right:-20%;background:#9fb867; }.hill-two { width:74%;height:150px;left:-12%;bottom:-48px;background:#758f58; }
.playground-asset { position:absolute; z-index:3; width:660px; max-width:none; right:2%; bottom:-65px; mix-blend-mode:multiply; }.bottom-note { position:absolute; z-index:4; bottom:28px; left:10%; font-size:12px; font-weight:800; color:white; }

/* 02: search-forward map */
.landing-search { background:#0c5269; color:#fff9ee; }.landing-search nav { color:#fff9ee; }.pill { padding:7px 11px;border:1px solid rgba(255,255,255,.4);border-radius:100px;font-family:"DM Mono",monospace;text-transform:uppercase;font-size:9px;letter-spacing:.06em; }.search-layout { min-height:640px; display:grid;grid-template-columns:1.02fr .98fr;align-items:center;padding:100px 9% 65px;gap:32px; }.search-layout h2 { font-size:clamp(52px,6vw,82px); }.search-layout .landing-kicker { color:#b3dad5; }.fake-search { margin-top:28px; display:grid;grid-template-columns:32px 1fr 32px;align-items:center;gap:8px;max-width:440px;padding:7px 8px 7px 15px;background:#fffdf8;color:#6b8490;border-radius:12px;font-size:13px; }.fake-search span:first-child { font-size:25px;line-height:1; }.fake-search b { display:grid;place-items:center;width:32px;height:32px;background:#f6a726;border-radius:8px;color:var(--ink);font-size:18px; }.under-search { max-width:380px;margin-top:18px!important;color:#bfdbd8;font-size:14px;line-height:1.6; }.search-map { position:relative;height:370px;background:#d1e5d2;border-radius:28px;overflow:hidden;transform:rotate(3deg);box-shadow:20px 20px 0 rgba(255,255,255,.1); }.map-road { position:absolute;background:#fff8ed;display:block;border-radius:50%; }.road-a { width:500px;height:55px;top:40px;left:-75px;transform:rotate(37deg); }.road-b { width:500px;height:40px;bottom:70px;left:-110px;transform:rotate(-21deg); }.road-c { width:40px;height:480px;right:130px;top:-80px;transform:rotate(24deg); }.pin { position:absolute;display:grid;place-items:center;width:45px;height:45px;background:#f47d61;border-radius:50% 50% 50% 0;transform:rotate(-45deg);color:white;font-style:normal;box-shadow:0 4px 0 rgba(18,59,93,.14); }.pin::first-letter { transform:rotate(45deg); }.pin-a { top:65px;right:60px; }.pin-b { left:75px;bottom:97px;background:#0c5269; }.pin-c { top:182px;left:185px;background:#f6a726; }.map-card { position:absolute;bottom:18px;right:18px;width:205px;padding:15px;border-radius:16px;background:#fffdf8;color:var(--ink);box-shadow:0 10px 25px rgba(18,59,93,.15); }.map-card span,.map-card strong,.map-card small { display:block; }.map-card span { color:#4b9294;text-transform:uppercase;font-family:"DM Mono",monospace;font-size:9px; }.map-card strong { margin:3px 0;font-size:16px; }.map-card small { font-size:10px;color:#69808c; }.search-wave { position:absolute;bottom:-110px;left:-10%;width:125%;height:210px;border-radius:50% 50% 0 0;background:#f5b73d;transform:rotate(-4deg); }

/* 03: paper, tape and community notes */
.landing-bulletin { background:#f9bd3e;color:#163c5c; }.landing-bulletin nav { color:var(--ink); }.bulletin-title { position:absolute;z-index:2;left:10%;top:26%;width:42%; }.bulletin-title .landing-kicker { color:#9b572e; }.bulletin-title h2 { font-family:"Playfair Display",serif;font-size:clamp(48px,6vw,79px);letter-spacing:-.065em;line-height:.93; }.bulletin-title > p:not(.landing-kicker) { margin-top:18px;max-width:340px;line-height:1.55;font-size:16px; }.paper-button { background:var(--ink);color:#fffdf8;border-radius:5px;transform:rotate(-1.5deg); }.paper-stack { position:absolute;right:9%;top:18%;width:42%;height:460px; }.paper { position:absolute;width:210px;height:210px;padding:25px;background:#fff8eb;box-shadow:11px 13px 0 rgba(18,59,93,.12); }.paper span { display:block;font-size:38px;color:var(--coral); }.paper b,.paper small {display:block;}.paper b { font-size:24px;letter-spacing:-1px; }.paper small { margin-top:5px;color:#6d7f76;font-size:12px; }.paper-one { top:11px;left:45px;transform:rotate(-7deg); }.paper-two { top:112px;right:12px;transform:rotate(9deg);background:#cde1d9; }.paper-two span { color:#e99f25; }.paper-three { bottom:20px;left:92px;transform:rotate(-2deg);background:#f57a61;color:white; }.paper-three small { color:#fff2da; }.paper-three span { color:#163c5c; }.tape { position:absolute;z-index:3;width:80px;height:26px;background:rgba(228,214,172,.85); }.tape-one { top:0;left:107px;transform:rotate(-12deg); }.tape-two { top:111px;right:-1px;transform:rotate(37deg); }

/* 04: navy app teaser */
.landing-pocket { background:#082f4a;color:#fffdf8; }.landing-pocket nav { color:#fffdf8; }.pocket-status { font-family:"DM Mono",monospace;font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#a9cfc9; }.pocket-status i { display:inline-block;width:8px;height:8px;border-radius:50%;background:#ffb42b;margin-right:6px; }.pocket-copy { position:absolute;z-index:3;left:11%;top:26%;max-width:42%; }.pocket-copy .landing-kicker { color:#81c2bf; }.pocket-copy h2 { font-size:clamp(51px,6.2vw,86px); }.pocket-copy > p:not(.landing-kicker) { margin-top:20px;max-width:320px;color:#b9d3d6;font-size:16px;line-height:1.55; }.outline-button { background:transparent;color:#fffdf8;border:1px solid #93c6c2;border-radius:4px; }.phone { position:absolute;z-index:4;right:16%;bottom:-53px;width:270px;height:510px;padding:45px 20px 25px;border:9px solid #d1e2dc;border-bottom:0;border-radius:35px 35px 0 0;background:#fff8ed;color:var(--ink);box-shadow:18px 0 0 rgba(95,166,162,.36); }.phone-top { position:absolute;top:12px;left:50%;width:75px;height:8px;border-radius:8px;background:#183d5c;transform:translateX(-50%); }.phone > p { color:#648191;font-size:12px; }.phone > b { display:block;margin-top:4px;font-size:25px;letter-spacing:-1px; }.phone-map { position:relative;height:205px;margin-top:17px;border-radius:17px;background:#b9d8c3;overflow:hidden; }.phone-map:before,.phone-map:after {content:"";position:absolute;background:#fff8ed;border-radius:50%;}.phone-map:before {width:260px;height:25px;top:70px;left:-30px;transform:rotate(25deg);}.phone-map:after {width:25px;height:240px;right:78px;top:-10px;transform:rotate(22deg);}.phone-map i { position:absolute;z-index:2;width:22px;height:22px;border-radius:50% 50% 50% 0;background:#f47d61;transform:rotate(-45deg); }.phone-map i:nth-child(1){top:45px;left:55px;}.phone-map i:nth-child(2){top:105px;right:45px;background:#f6ab26;}.phone-map i:nth-child(3){bottom:17px;left:95px;background:#16405c;}.place-row { display:flex;gap:10px;align-items:center;margin-top:13px; }.place-row span { display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:#f7bd3d; }.place-row b,.place-row small { display:block; }.place-row b {font-size:12px;}.place-row small {font-size:10px;color:#688191;}.pocket-orbit { position:absolute;z-index:2;border:1px solid rgba(174,219,213,.55);border-radius:100px;padding:9px 13px;font-family:"DM Mono",monospace;font-size:10px;letter-spacing:.05em;color:#bce2dc; }.orbit-one {right:43%;top:25%;transform:rotate(-10deg);}.orbit-two {right:9%;top:23%;transform:rotate(8deg);}.orbit-three {right:42%;bottom:19%;transform:rotate(7deg);}

/* 05: soft editorial end card */
.landing-meadow { background:#f7f4e9;color:#274e49; }.landing-meadow nav { color:#274e49; }.meadow-copy { position:absolute;z-index:3;left:11%;top:24%;max-width:48%; }.meadow-copy .landing-kicker { color:#798f57; }.meadow-copy h2 { font-family:"Playfair Display",serif;font-size:clamp(52px,6.5vw,90px);font-weight:600;letter-spacing:-.07em;line-height:.9; }.meadow-copy > p:not(.landing-kicker) { margin-top:20px;max-width:340px;font-size:16px;line-height:1.6;color:#667970; }.meadow-signup { display:flex;align-items:center;justify-content:space-between;width:330px;margin-top:30px;padding:5px 5px 5px 16px;border-bottom:1px solid #80986d;color:#8b9784;font-size:12px; }.meadow-signup button { padding:11px 16px;border:0;border-radius:999px;background:#416f6b;color:white;font-weight:800;font-size:12px; }.meadow-art { position:absolute;right:8%;bottom:0;width:47%;height:100%;overflow:hidden; }.meadow-hill { position:absolute;right:-18%;bottom:-16%;width:120%;height:54%;border-radius:50% 50% 0 0;background:#a8ba70; }.arch { position:absolute;bottom:105px;border-radius:130px 130px 0 0; }.arch-a { width:205px;height:325px;left:22%;background:#4b9190; }.arch-b { width:135px;height:220px;left:38%;background:#f6b33b; }.arch:after { content:"";position:absolute;left:30%;bottom:0;width:40%;height:72%;border-radius:80px 80px 0 0;background:#f7f4e9; }.flower { position:absolute;z-index:3;font-size:57px;font-style:normal;color:#ef7a62; }.flower-a { right:15%;top:25%; }.flower-b { left:5%;top:17%;color:#e4ab38;transform:scale(.62); }.flower-c { left:35%;bottom:20%;color:#f8f1df; }.meadow-footer { position:absolute;bottom:28px;left:11%;font-size:12px;font-weight:800;color:#6f855d; }

footer { max-width:1240px; margin:auto; padding:0 32px 42px; } footer span { padding:0 5px; }
@media (max-width:850px) { .site-header{padding:19px 22px}.header-note{display:none}.intro{padding:54px 22px 30px}.direction-picker{padding:0 22px 30px;grid-template-columns:repeat(2,1fr)}.direction:last-child{grid-column:span 2}.stage{padding:0 22px}.stage-hint{display:none}.landing{min-height:590px}.landing nav{padding:22px 24px}.sunlit-copy,.bulletin-title,.pocket-copy,.meadow-copy{left:8%;top:20%;max-width:67%;width:67%}.playground-asset{width:530px;right:-8px;bottom:-35px}.search-layout{grid-template-columns:1fr;padding:105px 8% 35px}.search-map{height:230px;transform:none}.phone{right:6%;transform:scale(.76);transform-origin:bottom}.pocket-orbit{display:none}.paper-stack{right:-9%;transform:scale(.75);transform-origin:right top}.meadow-art{right:-15%;width:65%;opacity:.7}.meadow-copy{max-width:70%;width:70%} }
@media (max-width:520px) { h1{font-size:51px}.intro-copy{font-size:15px}.direction-picker{grid-template-columns:1fr}.direction:last-child{grid-column:auto}.direction{min-height:86px}.direction .number{margin-bottom:7px}.landing{min-height:585px;border-radius:18px}.landing-page .landing{min-height:100svh;border-radius:0}.landing nav{font-size:11px}.mini-logo{font-size:15px}.sunlit-copy,.bulletin-title,.pocket-copy,.meadow-copy{top:21%;left:8%;width:84%;max-width:84%}.sunlit-copy h1,.search-layout h2,.pocket-copy h2,.meadow-copy h2{font-size:54px}.sunlit-copy > p,.pocket-copy > p:not(.landing-kicker){font-size:14px}.sun{right:7%;top:15%;transform:scale(.65)}.cloud-one{left:56%;top:30%;transform:scale(.6)}.landing-page .hill{display:none}.playground-asset{width:395px;right:-60px;bottom:-110px;opacity:.78}.bottom-note{left:8%;bottom:24px;padding:10px 12px;border-radius:999px;background:rgba(255,250,243,.9);color:var(--ink);font-size:10px}.search-layout{padding:98px 8% 25px}.search-layout h2{font-size:50px}.search-map{height:210px}.map-card{transform:scale(.78);transform-origin:bottom right}.bulletin-title h2{font-size:52px}.paper-stack{right:-36%;top:48%;transform:scale(.63);transform-origin:right top}.phone{right:-13%;transform:scale(.67);transform-origin:bottom}.pocket-copy{max-width:64%;width:64%}.meadow-art{right:-42%;width:102%;opacity:.5}.meadow-signup{width:245px}.meadow-copy > p:not(.landing-kicker){font-size:14px}.stage-toolbar{font-size:9px}footer{padding:0 22px 32px;font-size:9px} }