:root {
    --green:#0b5d3b;
    --deep:#063d2b;
    --forest:#0d4e38;
    --cream:#f6f1e7;
    --paper:#fffdf8;
    --brown:#a96f42;
    --gold:#e1b658;
    --ink:#16271f;
    --muted:#66766e;
    --line:rgba(14,65,45,.12);
    --shadow:0 24px 70px rgba(4,44,31,.14);
}

* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; overflow-x:hidden; color:var(--ink); background:var(--paper); font-family:Pretendard,-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans KR",Arial,sans-serif; -webkit-font-smoothing:antialiased; }
body.menu-open { overflow:hidden; }
button, a { font:inherit; -webkit-tap-highlight-color:transparent; }
a { color:inherit; }
img { max-width:100%; }
.skip-link { position:fixed; z-index:9999; top:8px; left:8px; padding:10px 14px; border-radius:8px; color:#fff; background:var(--deep); text-decoration:none; transform:translateY(-160%); }
.skip-link:focus { transform:translateY(0); }

.site-header { position:fixed; z-index:1000; top:0; left:0; right:0; border-bottom:1px solid transparent; transition:background .25s,border-color .25s,box-shadow .25s; }
.site-header.is-scrolled { border-color:rgba(255,255,255,.08); background:rgba(6,61,43,.92); box-shadow:0 8px 28px rgba(3,35,24,.18); backdrop-filter:blur(16px); }
.header-inner { width:min(1180px,calc(100% - 40px)); height:76px; display:flex; align-items:center; justify-content:space-between; margin:0 auto; }
.brand { display:inline-flex; align-items:center; gap:9px; color:#fff; text-decoration:none; }
.brand img { width:45px; height:45px; object-fit:contain; transform:rotate(-4deg); }
.brand strong { padding-bottom:2px; font-size:17px; font-weight:900; letter-spacing:-.7px; line-height:1.2; }
.brand strong span { color:#d9a36e; }
.site-nav { display:flex; align-items:center; gap:32px; color:rgba(255,255,255,.8); }
.site-nav a { font-size:12px; font-weight:800; text-decoration:none; transition:color .2s; }
.site-nav a:hover { color:#fff; }
.site-nav .nav-start { padding:11px 17px; border:1px solid rgba(255,255,255,.24); border-radius:999px; color:var(--deep); background:var(--cream); }
.menu-toggle { display:none; width:42px; height:42px; place-items:center; align-content:center; gap:4px; padding:0; border:1px solid rgba(255,255,255,.18); border-radius:12px; background:rgba(255,255,255,.08); cursor:pointer; }
.menu-toggle span { width:17px; height:2px; border-radius:3px; background:#fff; transition:.2s; }

.hero { position:relative; min-height:900px; overflow:hidden; color:#fff; background:linear-gradient(145deg,#043122 0%,#0a5138 58%,#174f3b 100%); }
.hero::before { content:""; position:absolute; inset:0; opacity:.13; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='84' height='84' viewBox='0 0 84 84'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='.6' d='M42 0v84M0 42h84M12.3 12.3l59.4 59.4M71.7 12.3L12.3 71.7'/%3E%3C/svg%3E"); }
.hero-glow { position:absolute; border-radius:50%; filter:blur(2px); pointer-events:none; }
.hero-glow--one { width:520px; height:520px; top:-230px; right:-80px; background:radial-gradient(circle,rgba(85,193,135,.18),transparent 68%); }
.hero-glow--two { width:480px; height:480px; left:-250px; bottom:-200px; background:radial-gradient(circle,rgba(213,159,102,.16),transparent 68%); }
.hero-inner { position:relative; z-index:2; width:min(1120px,calc(100% - 48px)); min-height:830px; display:grid; grid-template-columns:.9fr 1.1fr; align-items:center; gap:50px; margin:0 auto; padding:112px 0 70px; }
.eyebrow { display:inline-flex; align-items:center; gap:8px; color:#ddb386; font-size:10px; font-weight:900; letter-spacing:2px; }
.eyebrow i { width:22px; height:1px; background:currentColor; }
.eyebrow--dark { color:var(--brown); }
.hero-copy h1 { margin:20px 0 18px; font-size:clamp(64px,7vw,96px); font-weight:900; line-height:.93; letter-spacing:-6px; }
.hero-copy h1 span { color:#dcb386; }
.hero-copy > p { margin:0; color:rgba(255,255,255,.78); font-size:18px; font-weight:600; line-height:1.65; letter-spacing:-.4px; }
.mobile-break { display:none; }
.hero-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:32px; }
.button { height:52px; display:inline-flex; align-items:center; justify-content:center; gap:16px; padding:0 22px; border-radius:15px; font-size:12px; font-weight:900; text-decoration:none; transition:transform .2s,box-shadow .2s; }
.button:hover { transform:translateY(-2px); }
.button--primary { color:var(--deep); background:var(--cream); box-shadow:0 12px 28px rgba(1,30,20,.26); }
.button--primary b { font-size:17px; }
.button--ghost { border:1px solid rgba(255,255,255,.2); color:#fff; background:rgba(255,255,255,.07); }
.hero-note { display:flex; align-items:center; gap:7px; margin-top:20px; color:rgba(255,255,255,.55); font-size:10px; }
.hero-note span { width:18px; height:18px; display:grid; place-items:center; border-radius:50%; color:#fff; background:rgba(255,255,255,.12); font-size:9px; }

.hero-visual { position:relative; min-height:620px; display:grid; place-items:center; }
.orbit { position:absolute; border:1px solid rgba(255,255,255,.09); border-radius:50%; }
.orbit--one { width:530px; height:530px; }
.orbit--two { width:440px; height:440px; border-style:dashed; animation:orbit 24s linear infinite; }
@keyframes orbit { to { transform:rotate(360deg); } }
.phone { position:relative; z-index:2; width:300px; height:612px; padding:10px; border:1px solid rgba(255,255,255,.3); border-radius:43px; background:#10271f; box-shadow:0 42px 85px rgba(1,26,17,.42),inset 0 0 0 2px rgba(255,255,255,.04); transform:rotate(2deg); }
.phone-speaker { position:absolute; z-index:4; top:17px; left:50%; width:72px; height:18px; border-radius:20px; background:#10271f; transform:translateX(-50%); }
.phone-screen { height:100%; overflow:hidden; border-radius:34px; color:var(--ink); background:#f8f7f2; }
.mock-header { height:55px; display:flex; align-items:center; justify-content:space-between; padding:8px 14px 4px; background:var(--cream); }
.mock-brand { display:flex; align-items:center; gap:4px; }
.mock-brand img { width:31px; height:31px; object-fit:contain; transform:rotate(-4deg); }
.mock-brand b { color:var(--deep); font-size:9px; letter-spacing:-.3px; }
.mock-brand b span { color:var(--brown); }
.mock-header > i { width:26px; height:26px; display:block; border-radius:9px; background:linear-gradient(#e6ebe7,#d8dfda); }
.mock-trip { height:49px; display:grid; grid-template-columns:1fr auto; grid-template-rows:auto auto; align-content:center; padding:0 15px; border-bottom:1px solid #e5e9e6; background:#fff; }
.mock-trip small { color:var(--brown); font-size:6px; font-weight:900; letter-spacing:1px; }
.mock-trip strong { font-size:13px; }
.mock-trip b { grid-column:2; grid-row:1/3; align-self:center; color:#849189; }
.mock-legend { height:42px; display:flex; align-items:center; gap:5px; overflow:hidden; padding:0 11px; background:#fff; }
.mock-legend span { flex:0 0 auto; padding:6px 8px; border-radius:999px; color:#66756d; background:#f0f3f1; font-size:6px; font-weight:800; }
.mock-legend .is-active { color:#fff; background:var(--green); }
.mock-map { position:relative; height:386px; overflow:hidden; background:#e9e3d8; }
.mock-map::before { content:""; position:absolute; inset:0; opacity:.5; background-image:linear-gradient(18deg,transparent 44%,#cdd4c9 45%,#cdd4c9 48%,transparent 49%),linear-gradient(100deg,transparent 42%,#d6cfc1 43%,#d6cfc1 47%,transparent 48%); background-size:86px 74px,110px 92px; }
.street { position:absolute; z-index:1; height:10px; border:2px solid #fff; border-right:0;border-left:0;background:#c5cbbf; transform-origin:left center; }
.street--one { width:400px; top:83px; left:-35px; transform:rotate(28deg); }
.street--two { width:370px; top:240px; left:-25px; transform:rotate(-18deg); }
.street--three { width:370px; top:-20px; left:105px; transform:rotate(82deg); }
.street--four { width:330px; top:330px; left:20px; transform:rotate(-65deg); }
.map-label { position:absolute; z-index:2; color:#7d837c; font-size:6px; transform:rotate(-18deg); }
.map-label--one { top:214px; left:40px; }
.map-label--two { top:120px; right:33px; transform:rotate(28deg); }
.pin { position:absolute; z-index:4; width:31px; height:31px; display:grid; place-items:center; border:3px solid #fff; border-radius:50% 50% 50% 8px; color:#fff; font-size:7px; font-style:normal; font-weight:900; box-shadow:0 5px 9px rgba(22,48,37,.22); transform:rotate(-45deg); transition:opacity .42s ease,filter .42s ease; }
.pin::after { content:attr(data-label); transform:rotate(45deg); }
.pin--must::before { content:"★"; position:absolute; top:-7px; left:-5px; color:#3a2b1c; font-size:10px; line-height:1; -webkit-text-stroke:.7px #fff4d8; paint-order:stroke fill; transform:rotate(45deg); text-shadow:0 1px 2px rgba(58,43,28,.3); }
.pin--must { animation:mock-must-pulse 2.1s ease-in-out infinite; }
.pin--orange { background:#e5782e; }.pin--gold { background:#dca82f; }.pin--brown { background:#7a5132; }.pin--green { background:#2e8b57; }
.pin--one { top:63px; left:56px; }.pin--two { top:135px; right:44px; }.pin--three { top:212px; left:34px; }.pin--four { top:265px; right:48px; }
.hotel-star { position:absolute; z-index:5; top:177px; left:137px; color:#ffd21f; font-size:25px; font-style:normal; line-height:1; -webkit-text-stroke:2px #111; filter:drop-shadow(0 2px 2px rgba(255,255,255,.8)); transition:opacity .42s ease,filter .42s ease; }
.pin.is-outside,.hotel-star.is-outside { opacity:.12; filter:grayscale(1); }
.user-dot { position:absolute; z-index:5; top:166px; left:88px; width:17px; height:17px; border:3px solid #fff; border-radius:50%; background:#1976d2; box-shadow:0 0 0 0 rgba(25,118,210,.26); animation:mock-user-pulse 2s ease-out infinite; }
.user-dot::after { content:""; position:absolute; inset:-5px; border:1px solid rgba(25,118,210,.32); border-radius:50%; animation:mock-user-ring 2s ease-out infinite; }
@keyframes mock-user-pulse { 55% { box-shadow:0 0 0 9px rgba(25,118,210,.08); } 100% { box-shadow:0 0 0 12px rgba(25,118,210,0); } }
@keyframes mock-user-ring { 0% { opacity:.8; transform:scale(.65); } 100% { opacity:0; transform:scale(1.45); } }
@keyframes mock-must-pulse { 0%,100% { box-shadow:0 5px 9px rgba(22,48,37,.22),0 0 0 0 rgba(255,210,31,0); } 50% { box-shadow:0 5px 9px rgba(22,48,37,.22),0 0 0 4px rgba(255,210,31,.2); } }
.place-preview { position:absolute; z-index:7; left:14px; right:14px; bottom:13px; display:grid; gap:2px; padding:12px; border-radius:14px; background:rgba(255,255,255,.97); box-shadow:0 10px 25px rgba(25,46,37,.18); }
.place-preview small { color:#a16a20; font-size:6px; font-weight:900; }.place-preview strong { font-size:11px; }.place-preview span { color:#76827b; font-size:6px; }
.mock-toolbar { height:60px; display:grid; grid-template-columns:48px 1fr 50px; align-items:center; gap:4px; padding:6px 7px; background:#fff; }
.mock-toolbar button { height:43px; display:grid; place-items:center; align-content:center; gap:1px; padding:0; border:0; border-radius:10px; color:#fff; background:var(--brown); }
.mock-toolbar button:last-child { background:var(--green); }
.mock-toolbar button i { font-size:14px; font-style:normal; }.mock-toolbar button span { font-size:5px; font-weight:900; }
.mock-toolbar > div { display:grid; grid-template-columns:repeat(4,1fr); gap:2px; }
.mock-toolbar b { height:27px; display:grid; place-items:center; border-radius:7px; color:#7d8781; background:#f2f4f2; font-size:5px; }.mock-toolbar b.is-active { color:#fff; background:var(--deep); }
.floating-card { position:absolute; z-index:3; display:grid; gap:3px; padding:12px 15px; border:1px solid rgba(255,255,255,.12); border-radius:14px; color:#fff; background:rgba(6,50,35,.88); box-shadow:0 15px 36px rgba(1,28,18,.25); backdrop-filter:blur(12px); }
.floating-card b { font-size:10px; }.floating-card span { color:rgba(255,255,255,.58); font-size:7px; }
.floating-card--near { top:125px; right:-2px; }.floating-card--must { left:5px; bottom:105px; }.floating-card--must b { color:#ffd984; }
.hero-bottom { position:absolute; z-index:3; left:50%; bottom:0; width:min(1120px,calc(100% - 48px)); height:70px; display:flex; align-items:center; justify-content:center; gap:24px; border-top:1px solid rgba(255,255,255,.1); color:rgba(255,255,255,.52); font-size:9px; font-weight:700; transform:translateX(-50%); }
.hero-bottom i { width:3px; height:3px; border-radius:50%; background:#d9a36e; }

.section { padding:110px 0; }
.section-inner { width:min(1120px,calc(100% - 48px)); margin:0 auto; }
.section-heading { max-width:620px; }
.section-heading h2 { margin:14px 0 15px; font-size:clamp(34px,4vw,53px); line-height:1.12; letter-spacing:-2.5px; }
.section-heading h2 em { color:var(--brown); font-style:normal; }
.section-heading > p { margin:0; color:var(--muted); font-size:14px; line-height:1.8; }
.section-heading--center { max-width:none; text-align:center; }

.problem { background:var(--cream); }
.problem-grid { display:grid; grid-template-columns:.92fr 1.08fr; align-items:center; gap:80px; }
.problem-cards { display:grid; gap:12px; }
.problem-cards article { display:grid; grid-template-columns:48px 1fr; align-items:center; gap:16px; padding:21px 22px; border:1px solid rgba(15,72,49,.08); border-radius:18px; background:rgba(255,255,255,.7); box-shadow:0 8px 25px rgba(30,65,50,.05); }
.problem-cards article > span { width:43px; height:43px; display:grid; place-items:center; border-radius:14px; color:#fff; background:var(--green); font-size:9px; font-weight:900; }
.problem-cards article:nth-child(2) > span { background:var(--brown); }.problem-cards article:nth-child(3) > span { color:var(--deep); background:#e4bd66; }
.problem-cards strong { font-size:14px; }.problem-cards p { margin:5px 0 0; color:var(--muted); font-size:10px; line-height:1.6; }

.steps { background:#fff; }
.step-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:44px; }
.step-card { position:relative; overflow:hidden; min-height:300px; padding:31px; border:1px solid var(--line); border-radius:24px; background:#fbfcfa; }
.step-card::after { content:""; position:absolute; right:-55px; bottom:-70px; width:160px; height:160px; border-radius:50%; background:rgba(11,93,59,.05); }
.step-card > i { position:absolute; top:24px; right:26px; color:#b8c0bb; font-size:10px; font-style:normal; font-weight:900; }
.step-word { color:var(--deep); font-size:43px; font-weight:900; letter-spacing:-3px; }.step-word span { color:var(--brown); }
.step-card h3 { margin:60px 0 10px; font-size:17px; letter-spacing:-.7px; }.step-card p { margin:0; color:var(--muted); font-size:11px; line-height:1.75; }
.step-card:nth-child(2) { background:#f7f2e9; }.step-card:nth-child(3) { color:#fff; background:var(--deep); }.step-card:nth-child(3) .step-word { color:#fff; }.step-card:nth-child(3) h3 { color:#fff; }.step-card:nth-child(3) p { color:rgba(255,255,255,.65); }.step-card:nth-child(3) > i { color:rgba(255,255,255,.35); }

.features { color:#fff; background:var(--deep); }
.features .section-heading > p { color:rgba(255,255,255,.56); }
.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:45px; }
.feature-card { min-height:245px; padding:25px; border:1px solid rgba(255,255,255,.09); border-radius:22px; background:rgba(255,255,255,.055); }
.feature-card--wide { grid-column:span 2; }
.feature-card--accent { background:linear-gradient(145deg,#805432,#a46c3f); }
.feature-icon { width:42px; height:42px; display:grid; place-items:center; margin-bottom:28px; border:1px solid rgba(255,255,255,.14); border-radius:13px; color:#f1c987; background:rgba(255,255,255,.07); font-size:17px; font-weight:900; }
.feature-card small { color:#d4a96f; font-size:8px; font-weight:900; letter-spacing:1.6px; }.feature-card h3 { margin:8px 0 9px; font-size:17px; letter-spacing:-.6px; }.feature-card p { max-width:510px; margin:0; color:rgba(255,255,255,.58); font-size:10px; line-height:1.75; }
.distance-demo { display:grid; grid-template-columns:repeat(5,1fr); gap:5px; max-width:410px; margin-top:25px; }.distance-demo b { height:33px; display:grid; place-items:center; border-radius:9px; color:rgba(255,255,255,.6); background:rgba(255,255,255,.08); font-size:8px; }.distance-demo b.is-active { color:var(--deep); background:var(--cream); }
.mini-pins { display:flex; gap:8px; margin-top:23px; }.mini-pins i { width:20px; height:20px; display:block; border:2px solid #fff; border-radius:50% 50% 50% 5px; background:#e5782e; transform:rotate(-45deg); }.mini-pins i:nth-child(2){background:#dca82f}.mini-pins i:nth-child(3){background:#7a5132}.mini-pins i:nth-child(4){background:#7b5aa6}.mini-pins i:last-child{width:24px;color:#ffd21f;border:0;border-radius:0;background:transparent;font-size:22px;font-style:normal;line-height:1;-webkit-text-stroke:1px #fff;transform:none}
.clean-chips { display:flex; gap:7px; margin-top:23px; }.clean-chips b { padding:8px 10px; border-radius:999px; color:#d6ecdD; background:rgba(79,169,115,.16); font-size:8px; }.clean-chips b:last-child { color:#ffdc92; background:rgba(225,182,88,.15); }

.situations { background:var(--cream); }
.situation-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:42px; }
.situation-grid article { min-height:230px; display:flex; flex-direction:column; justify-content:flex-end; padding:26px; overflow:hidden; border-radius:23px; color:#fff; background:linear-gradient(160deg,#174f3a,#063d2b); box-shadow:0 13px 34px rgba(5,50,34,.13); }
.situation-grid article:nth-child(2) { background:linear-gradient(160deg,#a87448,#70462c); }.situation-grid article:nth-child(3) { background:linear-gradient(160deg,#3d6e59,#183f30); }
.situation-grid span { margin-bottom:auto; color:rgba(255,255,255,.48); font-size:8px; font-weight:900; letter-spacing:2px; }.situation-grid h3 { margin:0 0 7px; font-size:21px; }.situation-grid p { margin:0; color:rgba(255,255,255,.65); font-size:10px; line-height:1.65; }

.download { padding-top:70px; padding-bottom:70px; background:#fff; }
.download-inner { position:relative; width:min(1120px,calc(100% - 48px)); min-height:390px; display:grid; grid-template-columns:.75fr 1.25fr; align-items:center; gap:45px; overflow:hidden; margin:0 auto; padding:45px 70px; border-radius:32px; color:#fff; background:linear-gradient(135deg,#063d2b,#0b5d3b); box-shadow:var(--shadow); }
.download-inner::after { content:"GO"; position:absolute; right:-20px; bottom:-75px; color:rgba(255,255,255,.045); font-size:260px; font-weight:900; line-height:1; }
.download-inner > img { position:relative; z-index:1; width:min(100%,270px); justify-self:center; filter:drop-shadow(0 24px 25px rgba(1,27,18,.24)); transform:rotate(-5deg); }
.download-copy { position:relative; z-index:2; }.download-copy h2 { margin:11px 0 12px; font-size:45px; line-height:1.05; letter-spacing:-2.5px; }.download-copy h2 strong { color:#f1c987; font-weight:900; }.download-copy h2 strong span { color:rgba(255,255,255,.72); font-size:.58em; letter-spacing:-1px; }.download-copy > p { margin:0; color:rgba(255,255,255,.62); font-size:12px; line-height:1.7; }
.store-buttons { display:flex; flex-wrap:wrap; gap:8px; margin-top:26px; }
.store-button { min-width:155px; height:54px; display:flex; align-items:center; gap:10px; padding:0 14px; border:1px solid rgba(255,255,255,.14); border-radius:13px; color:#fff; background:rgba(255,255,255,.07); text-decoration:none; }
.store-button > span { width:27px; height:27px; display:grid; place-items:center; border-radius:9px; background:rgba(255,255,255,.1); font-size:12px; font-weight:900; }.store-button div { display:grid; }.store-button small { color:rgba(255,255,255,.5); font-size:6px; font-weight:800; letter-spacing:.6px; }.store-button strong { font-size:10px; }.store-button--web { color:var(--deep); background:var(--cream); }.store-button--web > span { color:#fff; background:var(--green); }.store-button--web small { color:#7b877f; }.store-button.is-disabled { opacity:.5; cursor:not-allowed; }

.site-footer { width:min(1120px,calc(100% - 48px)); display:grid; grid-template-columns:1fr auto; gap:35px; margin:0 auto; padding:50px 0 35px; }
.brand--footer { color:var(--deep); }.brand--footer img { width:40px; height:40px; }.site-footer p { margin:11px 0 0; color:var(--muted); font-size:10px; line-height:1.6; }.footer-links { display:flex; align-items:flex-start; gap:22px; padding-top:14px; }.footer-links a { color:#536159; font-size:10px; font-weight:800; text-decoration:none; }.site-footer > small { grid-column:1/-1; padding-top:22px; border-top:1px solid var(--line); color:#9ba49f; font-size:8px; }
.back-to-top { position:fixed; z-index:890; right:20px; bottom:20px; width:44px; height:44px; display:grid; place-items:center; padding:0; border:1px solid rgba(255,255,255,.8); border-radius:50%; color:#fff; background:rgba(6,61,43,.9); box-shadow:0 9px 24px rgba(5,53,36,.24); backdrop-filter:blur(8px); cursor:pointer; opacity:0; visibility:hidden; transform:translateY(10px); transition:opacity .2s,visibility .2s,transform .2s; }
.back-to-top.is-visible { opacity:1; visibility:visible; transform:translateY(0); }
.back-to-top svg { width:20px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.floating-start { position:fixed; z-index:900; right:18px; bottom:calc(18px + env(safe-area-inset-bottom)); width:62px; height:62px; display:none; place-items:center; align-content:center; gap:1px; border:3px solid rgba(255,255,255,.9); border-radius:50%; color:#fff; background:var(--green); box-shadow:0 10px 25px rgba(5,53,36,.3); text-decoration:none; }.floating-start span { font-size:13px; font-weight:900; }.floating-start b { font-size:7px; }

.reveal { opacity:0; transform:translateY(24px); transition:opacity .7s ease,transform .7s ease; }.reveal--delay { transition-delay:.12s; }.reveal--delay-2 { transition-delay:.24s; }.reveal.is-visible { opacity:1; transform:translateY(0); }

@media (max-width: 900px) {
    .header-inner { width:calc(100% - 30px); }
    .menu-toggle { display:grid; }
    .menu-toggle[aria-expanded="true"] span:nth-child(1) { transform:translateY(6px) rotate(45deg); }.menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity:0; }.menu-toggle[aria-expanded="true"] span:nth-child(3) { transform:translateY(-6px) rotate(-45deg); }
    .site-nav { position:fixed; z-index:-1; top:0; left:0; right:0; min-height:100vh; display:grid; place-content:center; gap:25px; padding:90px 28px 40px; color:#fff; background:rgba(4,48,33,.98); opacity:0; visibility:hidden; transition:.22s; }.site-nav.is-open { opacity:1; visibility:visible; }.site-nav a { font-size:22px; text-align:center; }.site-nav .nav-start { margin-top:12px; padding:16px 24px; font-size:14px; }
    .hero { min-height:auto; }.hero-inner { min-height:auto; grid-template-columns:1fr; gap:30px; padding-top:132px; padding-bottom:110px; }.hero-copy { text-align:center; }.hero-copy h1 { font-size:72px; }.hero-actions { justify-content:center; }.hero-note { justify-content:center; }.hero-visual { min-height:625px; }.hero-bottom { display:none; }
    .problem-grid { grid-template-columns:1fr; gap:43px; }.section-heading { max-width:700px; }
    .feature-grid { grid-template-columns:repeat(2,1fr); }.feature-card--wide { grid-column:span 2; }
    .download-inner { grid-template-columns:.7fr 1.3fr; padding:42px; }
}

@media (max-width: 640px) {
    .header-inner { height:66px; }.brand img { width:39px; height:39px; }.brand strong { font-size:15px; }
    .hero-inner,.section-inner,.download-inner,.site-footer { width:calc(100% - 30px); }
    .hero-inner { padding-top:105px; padding-bottom:78px; }.hero-copy h1 { margin-top:16px; font-size:59px; line-height:.96; letter-spacing:-4px; }.hero-copy > p { font-size:15px; }.mobile-break { display:block; }
    .hero-actions { display:grid; grid-template-columns:1fr 1fr; gap:7px; margin-top:25px; }.button { height:49px; padding:0 10px; border-radius:13px; font-size:10px; }.button--primary { gap:8px; }
    .hero-visual { min-height:535px; margin-top:10px; }.orbit--one { width:390px; height:390px; }.orbit--two { width:330px; height:330px; }.phone { width:252px; height:514px; border-radius:37px; }.phone-screen { border-radius:29px; }.mock-header { height:47px; }.mock-trip { height:41px; }.mock-legend { height:35px; }.mock-map { height:323px; }.mock-toolbar { height:50px; }.place-preview { bottom:10px; }.floating-card--near { top:75px; right:-8px; }.floating-card--must { left:-8px; bottom:67px; }
    .section { padding:78px 0; }.section-heading h2 { font-size:34px; letter-spacing:-1.8px; }.section-heading > p { font-size:12px; }
    .problem-grid { gap:31px; }.problem-cards article { grid-template-columns:40px 1fr; padding:17px; }.problem-cards article > span { width:38px; height:38px; }.problem-cards p { font-size:9px; }
    .step-grid,.situation-grid { grid-template-columns:1fr; }.step-grid { margin-top:28px; }.step-card { min-height:245px; padding:25px; }.step-card h3 { margin-top:40px; }
    .feature-grid { grid-template-columns:1fr; margin-top:30px; }.feature-card,.feature-card--wide { grid-column:auto; min-height:220px; }.feature-icon { margin-bottom:23px; }
    .situation-grid { margin-top:28px; }.situation-grid article { min-height:210px; }
    .download { padding:35px 0; }.download-inner { grid-template-columns:1fr; gap:8px; padding:31px 22px; border-radius:25px; text-align:center; }.download-inner > img { width:145px; }.download-copy h2 { font-size:38px; }.store-buttons { display:grid; grid-template-columns:1fr; }.store-button { width:100%; justify-content:center; }.download-inner::after { font-size:170px; }
    .site-footer { grid-template-columns:1fr; gap:22px; padding-bottom:100px; }.footer-links { padding-top:0; }.site-footer > small { grid-column:1; }.floating-start { display:grid; }.back-to-top { right:25px; bottom:calc(91px + env(safe-area-inset-bottom)); width:40px; height:40px; }
}

@media (max-width: 360px) {
    .hero-copy h1 { font-size:52px; }.hero-actions { grid-template-columns:1fr; }.hero-visual { transform:scale(.92); margin-right:-14px; margin-left:-14px; }.section-heading h2 { font-size:31px; }.floating-card { padding:10px 12px; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior:auto; }
    *,*::before,*::after { animation:none!important; transition:none!important; }
    .reveal { opacity:1; transform:none; }
}