/* Vihaar's full-width product story. Website only; no native app dependency. */
:root {
  --paper:#f5f2eb; --ink:#20251f; --muted:#5c625a; --accent:#bb3e2b;
  --line:#20251f26; --sage:#d9e3c6; --peach:#f1cfb6; --lavender:#dfd9eb;
  --serif:'Fraunces',Georgia,serif; --sans:'Outfit',system-ui,sans-serif;
  --ease-out:cubic-bezier(.23,1,.32,1); --ease-in-out:cubic-bezier(.77,0,.175,1);
  color-scheme:light;
}
* {box-sizing:border-box}
html {scroll-behavior:smooth;scroll-padding-top:94px}
body {margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.6 var(--sans);-webkit-font-smoothing:antialiased}
[hidden] {display:none!important}
h1,h2,h3,p,figure {margin:0}
h1,h2 {font-family:var(--serif);font-weight:400;letter-spacing:-.06em;line-height:1.03}
h2 {font-size:clamp(48px,5.6vw,96px)}
h3 {font-weight:500;line-height:1.2}
em {font-weight:inherit;color:var(--accent)}
a {color:inherit;text-underline-offset:5px}
button {font:inherit;cursor:pointer}
button,a,summary {-webkit-tap-highlight-color:transparent}
button:active,.button:active,.store-link:active {transform:scale(.97)}
button,a,summary {touch-action:manipulation}
:focus-visible {outline:3px solid var(--accent);outline-offset:6px}
img {display:block;width:100%;height:auto}
.shell {width:100%;padding-inline:clamp(22px,4.5vw,96px);margin:0}
.eyebrow,.visual-label,.story-number,.example-label {font-size:11px;letter-spacing:.15em;text-transform:uppercase;font-weight:500;line-height:1.5}
.eyebrow {display:flex;align-items:center;gap:12px}
.eyebrow::before {content:'';width:6px;height:6px;border-radius:50%;background:currentColor;flex-shrink:0}
.sun {display:none}
.skip-link {position:fixed;top:-100px;left:20px;z-index:100;padding:12px 20px;background:var(--ink);color:var(--paper)}
.skip-link:focus {top:12px}
.site-header {position:sticky;top:0;z-index:30;background:#f5f2ebee;backdrop-filter:blur(14px)}
.site-header::after {content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--accent);transform:scaleX(var(--reading-progress,0));transform-origin:left}
.nav-shell {min-height:88px;width:100%;padding:16px clamp(22px,4.5vw,96px);display:flex;justify-content:space-between;align-items:center;gap:28px;border-bottom:1px solid var(--line)}
.wordmark {font:600 40px/1 var(--serif);letter-spacing:-.075em;text-decoration:none;white-space:nowrap}
.wordmark span {color:var(--accent);font-size:.75em;display:inline-block;vertical-align:top;margin-left:4px}
.nav-shell nav {display:flex;gap:32px;margin-left:auto;margin-right:35px}
.nav-shell nav a {font-size:13px;text-decoration:none}
.button {display:inline-flex;align-items:center;justify-content:space-between;gap:36px;min-height:56px;border-radius:999px;background:var(--ink);color:var(--paper);padding:15px 26px;text-decoration:none;font-size:14px;transition:transform 160ms var(--ease-out),background 180ms ease}
.button span {font-size:20px}
.button.small {min-height:46px;padding:9px 20px;font-size:12px;gap:24px}
.text-link {display:inline-flex;align-items:center;gap:18px;font-size:14px;text-decoration:none;border-bottom:1px solid currentColor;padding-block:8px}
.mobile-chapters {display:none}
/* Opening panorama: the composition spans the viewport, not a centered card. */
.hero {position:relative;overflow:clip;padding-top:65px;background:var(--paper)}
.hero-copy {text-align:center;position:relative;z-index:2}
.hero-copy .eyebrow {justify-content:center}
.hero h1 {position:relative;font-size:clamp(68px,10vw,174px);line-height:.91;letter-spacing:-.075em;margin:30px auto 28px;width:fit-content}
.hero h1 em {display:inline-block}
@media (min-width:1100px) {
 .hero h1 {font-size:clamp(110px,11vw,230px);display:flex;align-items:baseline;gap:.2em;line-height:1.05;margin-top:32px}
 .hero h1 br {display:none}
 .hero-stage {margin-top:20px}
}
.lede {max-width:490px;margin:auto;font-size:17px;line-height:1.6;color:var(--muted)}
.hero-actions {display:flex;justify-content:center;align-items:center;gap:32px;margin-top:26px}
.availability {font-size:11px;margin-top:16px;color:var(--muted)}
.hero-stage {height:690px;position:relative;max-width:1600px;margin:30px auto 0;isolation:isolate}
.phone {display:block;width:270px;border:7px solid #252923;border-radius:40px;background:#f2f2f7;overflow:hidden;box-shadow:0 24px 38px -20px #20251f55;position:relative}
.phone img {border-radius:31px}
.hero-stage .phone {position:absolute;left:calc(50% - 135px);top:50px}
.hero-stage .phone-hero {z-index:3;transform:rotate(-3deg)}
.hero-companion-left {transform:translate(-270px,75px) rotate(-14deg);z-index:1}
.hero-companion-right {transform:translate(270px,75px) rotate(14deg);z-index:1}
.hero-backdrop-word {position:absolute;left:50%;top:80px;transform:translateX(-50%);font:500 clamp(190px,27vw,460px)/1 var(--serif);letter-spacing:-.07em;color:#d8ddcd;z-index:-2}
.orbit {position:absolute;width:85%;height:430px;border:1px solid #8b96704a;left:7.5%;top:130px;border-radius:50%;transform:rotate(-8deg);z-index:-1}
.stage-label {position:absolute;left:2%;top:160px;font-size:10px;letter-spacing:.12em;line-height:1.8;max-width:120px}
.hero-scroll {position:absolute;right:1%;bottom:45px;display:flex;align-items:center;gap:20px;text-decoration:none;font-size:12px}
.hero-scroll span:last-child {width:48px;height:48px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;font-size:22px}
.chapter-strip {display:grid;grid-template-columns:1.3fr repeat(4,1fr);align-items:center;gap:28px;padding-block:32px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--sage)}
.chapter-strip>span {font-size:9px;letter-spacing:.15em;max-width:150px}
.chapter-strip a {display:grid;grid-template-columns:1fr auto;text-decoration:none;font-size:17px;line-height:1.5}
.chapter-strip small {grid-column:1/-1;font-size:10px;color:var(--muted);margin-bottom:6px}
/* Every chapter has its own composition, all using real product captures. */
.your-way {padding-block:105px 0}
.your-way h2 {margin:22px 0 45px;font-size:clamp(58px,8vw,140px)}
.travel-modes {display:grid;grid-template-columns:1fr 1fr;gap:20px}
.travel-mode {background:#e4e6d5;overflow:hidden;padding:38px 38px 0;position:relative;border-radius:4px}
.travel-mode:nth-child(2) {background:#ebd7c8}
.mode-heading {display:flex;align-items:center;gap:12px;font-size:10px;letter-spacing:.12em;border-bottom:1px solid var(--line);padding-bottom:20px}
.mode-heading>span {font-size:22px}
.mode-heading small {margin-left:auto}
.travel-mode h3 {font:400 clamp(32px,3.5vw,58px)/1.06 var(--serif);letter-spacing:-.04em;margin-top:26px}
.travel-mode>p {max-width:410px;font-size:14px;color:#535a4d;margin-top:20px}
.mode-footer {font-size:10px;display:block;margin-top:20px}
.feature-chapter {display:grid;grid-template-columns:1fr 1fr;gap:0;padding:0;margin-top:100px;align-items:stretch;min-height:900px}
.chapter-copy {padding:80px clamp(28px,5vw,100px);align-self:center;min-width:0}
.chapter-copy h2 {margin:24px 0;font-size:clamp(46px,5.4vw,90px)}
.chapter-lede {font-size:19px;line-height:1.6;color:var(--muted);max-width:520px}
.chapter-detail {margin-top:28px;max-width:520px}
.chapter-detail h3,.chapter-copy>h3 {font-size:16px;margin-top:26px}
.chapter-detail p,.chapter-copy>p:not(.eyebrow):not(.chapter-lede) {font-size:14px;color:var(--muted);margin-top:10px;max-width:520px}
.chapter-visual {position:relative;overflow:clip;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;background:var(--sage);padding:70px 35px;min-width:0;isolation:isolate}
.chapter-visual .phone {width:clamp(230px,23vw,360px);z-index:2}
.panel-orbit {position:absolute;width:90%;height:70%;border:1px solid #5d76434a;border-radius:50%;transform:rotate(-25deg);z-index:-1}
.visual-label {position:absolute;top:32px;left:32px;font-size:9px}
.visual-caption,.chapter-visual>p {font-size:10px;max-width:280px;text-align:center;color:var(--muted);z-index:2}
.chapter-reverse .chapter-visual {grid-column:1;grid-row:1;background:var(--peach)}
.chapter-reverse .chapter-copy {grid-column:2;grid-row:1}
#visa {margin-top:0}
#visa .chapter-visual>.chapter-phone {transform:translate(65px,25px) rotate(8deg)}
#visa .supporting-phone {position:absolute;z-index:1;width:clamp(180px,20vw,290px);transform:translate(-90px,-20px) rotate(-12deg)}
#visa .visual-caption {position:absolute;bottom:24px;max-width:340px}
.honest-note {font-size:12px!important;border-left:2px solid #9a9e8f;padding-left:15px;margin-top:24px!important;color:var(--muted)}
.route-example {margin-top:28px;border-top:1px solid var(--line);padding-top:20px;max-width:520px}
.example-label {font-size:8px;color:var(--muted)}
.route-example ol {list-style:none;margin:20px 0 0;padding:0;border-left:1px solid #899579}
.route-example li {padding:8px 0 8px 18px;font-size:13px;position:relative;display:flex;gap:20px}
.route-example li::before {content:'';position:absolute;width:7px;height:7px;border-radius:50%;background:var(--accent);left:-4px;top:16px}
.route-example time {color:var(--muted);font-size:11px;padding-top:2px}
.offline-chapter {background:#253b31;color:#f5f2eb;position:relative;overflow:clip}
.offline-layout {display:grid;grid-template-columns:1fr 1fr;padding:95px clamp(28px,5vw,100px);gap:8vw;align-items:center}
.offline-copy h2 {margin:24px 0;font-size:clamp(50px,6vw,100px)}
.offline-copy em {color:#d6dfb8}
.offline-copy .chapter-lede,.offline-copy .honest-note {color:#c4cdc2}
.offline-demo {margin-top:34px;border:1px solid #9baa924f;border-radius:3px;padding:24px;background:#ffffff06}
.offline-demo-top {display:flex;gap:14px;align-items:center;font-size:15px}
.signal-icon {font-size:30px;color:#d6dfb8}
.offline-demo ul {list-style:none;padding:0;margin:20px 0}
.offline-demo li {display:flex;gap:20px;align-items:center;justify-content:space-between;border-top:1px solid #ffffff1c;padding:14px 0;font-size:12px}
.offline-demo strong {font-weight:400;color:#d6dfb8;text-align:right;max-width:120px;font-size:11px}
.offline-demo .connection-needed strong {color:#edc2ad}
.offline-demo .example-label {color:#acbba7}
.offline-screen {position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:center;gap:25px;min-width:0}
.offline-screen .phone {width:clamp(230px,23vw,350px);transform:rotate(8deg);z-index:2;border-color:#b7c5a8}
.offline-screen .visual-caption {color:#bcc6b6;max-width:300px}
.offline-orbit {position:absolute;width:110%;aspect-ratio:1;border-radius:50%;border:1px solid #a6bd8c55;top:12%;z-index:-1}
.offline-orbit::after {content:'';position:absolute;inset:35px;border-radius:50%;border:1px solid #a6bd8c33}
.offline-word {position:absolute;left:-8%;top:35%;font:400 clamp(100px,14vw,240px)/1 var(--serif);letter-spacing:-.07em;color:#ffffff12;z-index:-1}
.offline-badge {position:absolute;left:-2%;top:8%;z-index:3;padding:18px;background:#d6dfb8;color:#253b31;font-size:9px;letter-spacing:.12em;transform:rotate(-10deg)}
#stay {margin-top:0}
#stay .chapter-visual {background:var(--lavender)}
#stay .phone {transform:rotate(-7deg)}
.money-chapter {display:grid;grid-template-columns:1fr 1fr;padding:0;background:#ece4cb}
.money-copy {padding:90px clamp(28px,5vw,100px);align-self:center}
.money-copy h2 {margin:24px 0;font-size:clamp(46px,5.4vw,90px)}
.money-points {margin-top:35px}
.money-points article {display:grid;grid-template-columns:28px 1fr;gap:8px 14px;border-top:1px solid var(--line);padding:20px 0}
.money-points article>span {font-size:11px;color:var(--accent);padding-top:4px}
.money-points h3 {font-size:17px}
.money-points p {grid-column:2;font-size:13px;color:var(--muted);max-width:410px}
.money-visual {position:relative;overflow:clip;isolation:isolate;display:grid;place-items:center;min-height:800px;background:#e1d4a9}
.money-visual .phone {width:clamp(240px,23vw,345px);transform:rotate(9deg)}
.split-note {position:absolute;bottom:12%;left:5%;z-index:3;background:var(--paper);padding:24px;box-shadow:0 15px 35px #292b1c20;transform:rotate(-7deg);max-width:285px}
.split-note strong {display:block;font:400 28px/1.1 var(--serif);margin:16px 0}
.split-people {display:flex;padding:0 0 15px 7px}
.split-people i {font-style:normal;background:#dac6b9;border:2px solid var(--paper);border-radius:50%;width:36px;height:36px;display:grid;place-items:center;margin-left:-7px;font-size:12px}
.split-people i:nth-child(even) {background:#cdd5be}
.split-note p {font-size:11px;color:var(--muted)}
/* Product studio: one selectable collection with a full-size image index. */
.journey {padding-block:105px 90px;background:#e9eadd}
.section-heading {display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:end;margin-bottom:45px}
.section-heading>.eyebrow {grid-column:1/-1}
.section-heading>p:not(.eyebrow) {font-size:15px;max-width:380px;justify-self:end;color:var(--muted)}
.screen-switcher {display:flex;gap:5px;border-bottom:1px solid var(--line);overflow-x:auto;padding-bottom:16px;scrollbar-width:thin}
.screen-switcher button {border:0;background:transparent;color:var(--muted);padding:14px 20px;white-space:nowrap;border-radius:999px;font-size:13px;transition:background 200ms ease,color 200ms ease,transform 160ms var(--ease-out)}
.screen-switcher button[aria-pressed=true] {background:var(--ink);color:var(--paper)}
.preview-feedback:empty {display:none}
.preview-feedback {padding:16px;color:var(--accent)}
.app-story {display:grid;grid-template-columns:1fr 1fr;min-height:700px;gap:8vw;align-items:center;padding-top:45px}
.story-copy {padding-left:4vw;max-width:560px}
.story-number {color:var(--accent)}
.story-copy h3 {white-space:pre-line;font:400 clamp(40px,4.5vw,70px)/1.07 var(--serif);letter-spacing:-.05em;margin:24px 0}
.story-copy>p:not(.story-number):not(.screen-caption) {font-size:16px;color:var(--muted);max-width:440px}
.story-copy ul {list-style:none;padding:0;margin:28px 0;font-size:13px}
.story-copy li {padding:10px 0;border-bottom:1px solid var(--line)}
.story-copy li::before {content:'↗';margin-right:12px;color:var(--accent)}
.screen-caption {font-size:10px;color:var(--muted);margin-top:26px}
.story-stage {position:relative;display:flex;flex-direction:column;align-items:center;padding:40px;min-width:0;background:#d6dcc5;border-radius:50% 50% 4px 4px;isolation:isolate}
.story-stage .phone {width:260px}
.story-stamp {position:absolute;left:25px;top:50%;writing-mode:vertical-rl;font-size:8px;letter-spacing:.15em}
.screen-zoom {margin-top:22px;border:0;border-bottom:1px solid var(--line);background:none;font-size:12px;padding:10px 16px;color:var(--ink)}
.screen-ghost {position:absolute;inset:0;width:100%;pointer-events:none}
.gallery-note {margin-top:45px;text-align:center;font-size:10px;color:var(--muted)}
/* Dense information becomes a deliberate index instead of a wall of cards. */
.tool-directory {padding-block:100px;background:#e8e4d9}
.tool-filters {display:flex;gap:10px;flex-wrap:wrap;margin:35px 0 15px}
.tool-filters button {border:1px solid #59614f44;border-radius:999px;padding:12px 22px;background:transparent;color:var(--ink);font-size:12px;transition:background 180ms ease,color 180ms ease,transform 160ms var(--ease-out)}
.tool-filters button[aria-pressed=true] {background:var(--ink);color:var(--paper)}
.filter-summary {font-size:11px;color:var(--muted);margin-bottom:28px}
.feature-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 40px}
.feature-grid article {padding:28px 0;border-top:1px solid #69715f50;min-width:0;display:flex;flex-direction:column;align-items:flex-start}
.feature-grid article>span {font-size:9px;letter-spacing:.13em;color:var(--accent)}
.feature-grid h3 {font:400 clamp(24px,2.2vw,34px)/1.12 var(--serif);letter-spacing:-.03em;margin:16px 0}
.feature-grid p {font-size:13px;color:var(--muted);margin-bottom:17px;max-width:410px}
.feature-grid small,.feature-grid a {font-size:10px;margin-top:auto;color:#545d4d}
.feature-grid a {font-size:12px}
.data-section {padding-block:110px;background:#d9e2d6}
.data-section .section-heading h2 {font-size:clamp(48px,5.2vw,90px)}
.data-grid {display:grid;grid-template-columns:repeat(3,1fr);gap:50px;margin-top:60px}
.data-icon {display:grid;place-items:center;font-size:34px;border:1px solid #798b6a88;border-radius:50%;width:74px;height:74px;margin-bottom:26px}
.data-grid h3 {font:400 29px/1.15 var(--serif);letter-spacing:-.03em;margin-bottom:20px}
.data-grid p,.data-choices p {font-size:13px;color:#4c5948;margin-top:13px}
.data-choices {display:grid;grid-template-columns:1fr 1fr;gap:8vw;border-top:1px solid #798b6a66;padding-top:35px;margin-top:50px}
.data-choices h3 {font-size:16px}
.privacy-bottom {display:flex;align-items:end;justify-content:space-between;gap:35px;margin-top:45px;padding-top:30px;border-top:1px solid #798b6a66}
.privacy-bottom>p {max-width:600px;font-size:11px;color:#4c5948}
.privacy-bottom>div {display:flex;flex-direction:column;gap:12px;flex-shrink:0}
.privacy-bottom .text-link {font-size:12px}
.questions {display:grid;grid-template-columns:1fr 1.3fr;gap:8vw;padding-block:100px}
.questions h2 {margin:25px 0 30px}
.faq-list details {border-top:1px solid var(--line);padding:23px 0}
.faq-list details:last-child {border-bottom:1px solid var(--line)}
.faq-list summary {cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:17px;line-height:1.3}
.faq-list summary::-webkit-details-marker {display:none}
.faq-list summary::after {content:'+';font-size:26px;font-weight:400}
.faq-list details[open] summary::after {content:'−'}
.faq-list p {font-size:14px;color:var(--muted);padding:20px 30px 0 0;max-width:600px}
.download-section {position:relative;overflow:clip;background:#d5dfb8;padding-block:105px;text-align:center}
.download-inner {position:relative}
.download-inner>.eyebrow {justify-content:center}
.download-inner h2 {font-size:clamp(72px,10.5vw,180px);margin:28px 0;position:relative;z-index:1}
.download-inner h2 em {color:#415b35}
.download-inner>p:not(.eyebrow):not(.download-note) {font-size:17px;color:#4b5c3e}
.download-star {position:absolute;right:4%;top:25%;font:400 clamp(100px,19vw,300px)/1 var(--sans);color:#9cb17666}
.download-actions {display:flex;justify-content:center;gap:14px;margin-top:30px;position:relative;z-index:1}
.store-link {display:flex;gap:14px;align-items:center;padding:14px 25px;border-radius:12px;background:var(--ink);color:var(--paper);text-decoration:none;min-height:70px;text-align:left;transition:transform 160ms var(--ease-out)}
.store-link svg {width:30px;height:30px}
.store-link small {display:block;font-size:8px;letter-spacing:.12em}
.store-link strong {display:block;font-size:19px;font-weight:500}
.store-pending {background:transparent;color:#415039;border:1px solid #41503966}
.download-note {font-size:10px;color:#4b5c3e;margin-top:20px}
.site-footer {background:#202b24;color:#e7eadc;padding-block:50px 25px;overflow:clip}
.footer-top {display:flex;align-items:center;justify-content:space-between;gap:30px}
.footer-top>.wordmark {display:none}
.footer-top>p {font-size:17px;line-height:1.4}
.footer-top .text-link {font-size:13px}
.footer-word {font:400 clamp(130px,29vw,600px)/.9 var(--serif);letter-spacing:-.09em;margin:55px 0 35px;text-align:center;white-space:nowrap}
.footer-word>span {font:400 .55em/1 var(--sans);vertical-align:top;color:#c4d59b;margin-left:.1em}
.footer-bottom {display:flex;align-items:center;justify-content:space-between;gap:25px;border-top:1px solid #d6dfb833;padding-top:25px;font-size:10px;color:#bec8b5}
.footer-bottom nav {display:flex;gap:25px}
.footer-bottom a {text-decoration:none}
.screen-modal-open {overflow:hidden}
.screen-dialog {border:0;border-radius:20px;background:var(--paper);color:var(--ink);width:min(510px,calc(100% - 30px));max-height:90svh;padding:24px;overflow:auto}
.screen-dialog::backdrop {background:#152017c9;backdrop-filter:blur(8px)}
.dialog-heading {display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}
.dialog-heading h2 {font:500 19px/1.2 var(--sans);letter-spacing:0}
.dialog-heading button {border:0;background:var(--ink);color:var(--paper);padding:10px 15px;border-radius:999px;font-size:12px}
.screen-dialog>img {border-radius:15px;width:100%;height:auto}
.screen-dialog>p {font-size:10px;margin-top:16px;color:var(--muted)}
/* Entrances start only when JS observes the content. Without JS everything is visible. */
.motion-enter {opacity:0;transform:translateY(45px);transition:opacity 700ms var(--ease-out),transform 900ms var(--ease-out)}
.motion-enter.is-visible,.motion-enter:focus-within {opacity:1;transform:none}
@media (hover:hover) and (pointer:fine) {
 .button:hover {background:#415b35;transform:translateY(-2px)}
 .nav-shell nav a:hover,.text-link:hover {color:var(--accent)}
 .site-footer a:hover {color:#d6dfb8}
 .chapter-strip a:hover span {transform:translate(3px,-3px)}
 .chapter-strip a span {transition:transform 200ms var(--ease-out)}
 .tool-filters button:hover {background:#d6dcc5}
 .tool-filters button[aria-pressed=true]:hover {background:#415b35}
}
@media (min-width:1800px) {
 .hero-stage {height:780px}
 .hero-stage .phone {width:320px;left:calc(50% - 160px)}
 .hero-companion-left {transform:translate(-330px,70px) rotate(-14deg)}
 .hero-companion-right {transform:translate(330px,70px) rotate(14deg)}
}
@media (max-width:1000px) {
 .nav-shell nav {gap:18px;margin-right:0}
 .hero-stage {height:620px}
 .hero-stage .phone {width:240px;left:calc(50% - 120px)}
 .hero-companion-left {transform:translate(-210px,60px) rotate(-14deg)}
 .hero-companion-right {transform:translate(210px,60px) rotate(14deg)}
 .stage-label {top:25px}
 .chapter-strip {grid-template-columns:repeat(4,1fr);gap:20px}
 .chapter-strip>span {grid-column:1/-1;max-width:none}
 .travel-mode {padding:28px 25px 0}
 .feature-chapter {min-height:800px}
 .chapter-copy {padding:60px 30px}
 .chapter-visual {padding:60px 20px}
 .chapter-visual .phone {width:230px}
 .offline-layout {gap:40px}
 .feature-grid {gap:0 28px}
 .data-grid {gap:28px}
 .money-copy {padding:65px 30px}
 .split-note {left:0;bottom:10%;max-width:230px;padding:20px}
}
@media (max-width:700px) {
 html {scroll-padding-top:120px}
 h2 {font-size:47px}
 .nav-shell {min-height:70px;padding:14px 20px;gap:20px}
 .wordmark {font-size:34px}
 .nav-shell nav {display:none}
 .button.small {min-height:44px;gap:20px}
 .mobile-chapters {display:flex;gap:26px;padding:0 20px;font-size:10px;border-bottom:1px solid var(--line);background:#f5f2ebf5;position:sticky;top:72px;z-index:25;overflow:auto}
 .mobile-chapters a {text-decoration:none;white-space:nowrap;display:inline-flex;align-items:center;min-height:44px}
 .hero {padding-top:40px;padding-inline:18px}
 .hero h1 {font-size:clamp(67px,13.8vw,95px);margin:28px auto 24px}
 .hero-copy .eyebrow {font-size:9px}
 .lede {font-size:14px;max-width:350px}
 .hero-actions {gap:20px;flex-wrap:wrap;margin-top:22px}
 .hero-actions .button {min-height:49px;font-size:12px;gap:22px;padding:12px 20px}
 .hero-actions .text-link {font-size:11px;gap:10px}
 .availability {font-size:9px}
 .hero-stage {height:490px;margin-top:30px}
 .hero-stage .phone {width:174px;left:calc(50% - 87px);top:40px;border-width:5px;border-radius:28px}
 .hero-stage .phone img {border-radius:21px}
 .hero-companion-left {transform:translate(-130px,48px) rotate(-14deg)}
 .hero-companion-right {transform:translate(130px,48px) rotate(14deg)}
 .hero-backdrop-word {font-size:39vw;top:100px}
 .stage-label {display:none}
 .hero-scroll {bottom:8px;right:0;gap:14px;font-size:9px}
 .hero-scroll span:last-child {width:36px;height:36px;font-size:17px}
 .orbit {height:300px;width:120%;left:-10%;top:100px}
 .chapter-strip {grid-template-columns:1fr 1fr;padding-block:25px;gap:20px 30px}
 .chapter-strip a {font-size:17px}
 .chapter-strip small {font-size:9px;margin-bottom:2px}
 .chapter-strip>span {font-size:8px}
 .your-way {padding-block:65px 0}
 .your-way h2 {font-size:64px;margin:20px 0 28px}
 .eyebrow {font-size:9px}
 .travel-modes {grid-template-columns:1fr;gap:16px}
 .travel-mode {padding:26px 24px 0}
 .travel-mode h3 {font-size:39px}
 .travel-mode>p {font-size:13px}
 .feature-chapter {grid-template-columns:1fr;margin-top:65px;min-height:0}
 .chapter-copy {padding:55px 24px}
 .chapter-copy h2,.money-copy h2 {font-size:47px;margin:20px 0}
 .chapter-lede {font-size:16px}
 .chapter-detail p,.chapter-copy>p:not(.eyebrow):not(.chapter-lede) {font-size:13px}
 .chapter-detail {margin-top:24px}
 .chapter-visual {min-height:660px;padding:65px 24px 35px}
 .chapter-visual .phone {width:240px}
 .chapter-reverse .chapter-copy,.chapter-reverse .chapter-visual {grid-column:auto;grid-row:auto}
 #visa .chapter-visual>.chapter-phone {transform:translate(40px,15px) rotate(8deg);width:220px}
 #visa .supporting-phone {width:190px;transform:translate(-70px,-10px) rotate(-12deg)}
 #visa .chapter-visual {min-height:620px}
 .visual-label {top:25px;left:24px;font-size:8px}
 .offline-layout {grid-template-columns:1fr;gap:55px;padding:60px 24px}
 .offline-copy h2 {font-size:52px}
 .offline-demo {padding:20px}
 .offline-demo li {font-size:11px;gap:15px}
 .offline-demo strong {font-size:10px;min-width:90px}
 .offline-screen {padding:15px 0}
 .offline-screen .phone {width:235px}
 .offline-orbit {width:115%;top:10%}
 .offline-word {font-size:130px;left:0}
 .offline-badge {left:0;font-size:8px;padding:14px}
 .money-chapter {grid-template-columns:1fr}
 .money-copy {padding:60px 24px}
 .money-visual {min-height:660px}
 .money-visual .phone {width:245px}
 .split-note {left:20px;bottom:8%;max-width:220px;padding:18px}
 .split-note strong {font-size:24px}
 .journey {padding-block:65px}
 .section-heading {grid-template-columns:1fr;gap:20px;margin-bottom:30px}
 .section-heading>p:not(.eyebrow) {justify-self:start;font-size:13px}
 .screen-switcher {margin-right:-22px;padding-right:22px;gap:3px}
 .screen-switcher button {font-size:11px;padding:12px 16px}
 .app-story {grid-template-columns:1fr;gap:35px;min-height:0;padding-top:30px}
 .story-copy {padding:0}
 .story-copy h3 {font-size:39px;margin:20px 0}
 .story-copy>p:not(.story-number):not(.screen-caption) {font-size:14px}
 .story-copy ul {font-size:12px;margin:20px 0}
 .screen-caption {font-size:9px;margin-top:20px}
 .story-stage {padding:35px 20px 20px}
 .story-stage .phone {width:225px}
 .story-stamp {left:14px;font-size:7px}
 .gallery-note {font-size:9px;margin-top:32px}
 .tool-directory {padding-block:65px}
 .tool-filters {gap:8px;margin-top:28px}
 .tool-filters button {font-size:10px;padding:11px 15px}
 .tool-filters button,.screen-zoom,.dialog-heading button,.faq-list summary {min-height:44px}
 .feature-grid {grid-template-columns:1fr;gap:0}
 .feature-grid article {padding:23px 0}
 .feature-grid h3 {font-size:30px;margin:12px 0}
 .feature-grid p {font-size:13px}
 .feature-grid small {font-size:10px}
 .data-section {padding-block:65px}
 .data-section .section-heading h2 {font-size:46px}
 .data-grid {grid-template-columns:1fr;gap:30px;margin-top:35px}
 .data-grid article {border-top:1px solid #798b6a66;padding-top:25px}
 .data-icon {width:54px;height:54px;font-size:26px;margin-bottom:20px}
 .data-grid h3 {font-size:28px;margin-bottom:15px}
 .data-choices {grid-template-columns:1fr;gap:30px;margin-top:35px}
 .privacy-bottom {flex-direction:column;align-items:start;margin-top:30px}
 .questions {grid-template-columns:1fr;padding-block:65px;gap:35px}
 .faq-list summary {font-size:16px}
 .faq-list details {padding:20px 0}
 .faq-list p {font-size:13px;padding-right:0}
 .download-section {padding-block:65px}
 .download-inner h2 {font-size:65px;margin:25px 0}
 .download-inner>p:not(.eyebrow):not(.download-note) {font-size:14px}
 .download-star {top:30%;right:-8%;font-size:140px}
 .download-actions {gap:10px}
 .store-link {padding:12px 15px;gap:10px;min-height:62px}
 .store-link svg {width:23px;height:23px}
 .store-link strong {font-size:16px}
 .store-link small {font-size:7px}
 .site-footer {padding-block:30px 25px}
 .footer-top {align-items:start;gap:20px}
 .footer-top>p {font-size:13px}
 .footer-top .text-link {font-size:11px}
 .footer-word {font-size:28vw;margin:40px 0 30px}
 .footer-bottom {flex-wrap:wrap;gap:22px;font-size:9px}
 .footer-bottom nav {gap:20px;order:-1;width:100%}
 .footer-bottom nav a {display:inline-flex;align-items:center;min-height:44px}
}
@media (min-width:701px) and (max-width:1000px) {
}
@media (max-width:360px) {
 .hero h1 {font-size:64px}
 .hero-actions {gap:12px}
 .hero-stage .phone {width:155px;left:calc(50% - 77.5px)}
 .hero-stage {height:450px}
 .hero-companion-left {transform:translate(-110px,45px) rotate(-14deg)}
 .hero-companion-right {transform:translate(110px,45px) rotate(14deg)}
 .chapter-copy h2,.money-copy h2 {font-size:42px}
 .download-inner h2 {font-size:56px}
 .store-link {padding:12px;gap:8px}
 .store-link strong {font-size:14px}
}
@media (max-height:740px) {
}
@media (max-height:740px) and (max-width:700px) {
}
@media (prefers-reduced-motion:reduce) {
 html {scroll-behavior:auto}
 *,*::before,*::after {animation:none!important;transition-duration:0ms!important}
 .motion-enter {opacity:1;transform:none}
}
@media (prefers-reduced-motion:reduce) and (max-width:700px) {
}
/* Supporting pages share the visual system; policy text remains unchanged. */
.legal-container {padding:80px clamp(24px,5vw,100px) 100px;width:100%}
.legal-title {font-size:clamp(50px,7vw,120px);max-width:1200px}
.legal-date {margin:25px 0 55px;font-size:13px;color:var(--muted)}
.legal-layout {display:grid;grid-template-columns:1fr 2fr;gap:6vw;border-top:1px solid var(--line);padding-top:45px;align-items:start}
.legal-index {position:sticky;top:130px;font-size:12px;max-width:270px}
.legal-index>span {font-size:9px;letter-spacing:.14em;color:var(--muted)}
.legal-index nav {display:flex;flex-direction:column;gap:12px;margin:20px 0 30px}
.legal-index a {text-decoration:none}
.legal-body {max-width:800px;min-width:0;overflow-wrap:anywhere}
.legal-section {margin-bottom:40px}
.legal-body h2 {font-size:30px;letter-spacing:-.03em;line-height:1.2;margin:30px 0 20px;scroll-margin-top:120px}
.legal-body h3 {font-size:19px;margin:25px 0 15px}
.legal-body p,.legal-body li {font-size:15px;line-height:1.85;color:var(--muted)}
.legal-body p+p {margin-top:15px}
.legal-body li {margin-top:10px}
.legal-body a {color:var(--accent)}
@media (max-width:700px) {
 .legal-container {padding:45px 24px 65px}
 .legal-title {font-size:49px}
 .legal-date {margin-bottom:35px;font-size:12px}
 .legal-layout {grid-template-columns:1fr;gap:35px;padding-top:25px}
 .legal-index {position:static;max-width:none}
 .legal-index nav {gap:9px}
 .legal-body h2 {font-size:28px}
 .legal-body p,.legal-body li {font-size:14px}
}
/* Review polish: earlier product visibility and optional secondary detail. */
.hero {padding-top:30px}
.hero h1 {margin-block:20px 18px}
.hero .lede {font-size:16px;line-height:1.5}
.hero-actions {margin-top:18px}
.hero-stage {margin-top:12px;height:580px}
.hero-stage .phone {top:15px;width:235px;left:calc(50% - 117.5px)}
.hero .availability {font-size:12px;margin-top:10px}
.hero .hero-backdrop-word {top:25px}
.hero .orbit {top:60px}
@media (min-width:1100px) {
 .hero-copy {display:flex;flex-direction:column;align-items:center}
 .hero h1 {font-size:clamp(84px,8vw,156px)}
 .hero .lede {max-width:560px;text-align:center;margin:0 auto}
 .hero-actions {margin:22px 0 0;gap:24px;justify-content:center}
 .hero .availability {text-align:center;margin-top:12px}
 .hero-stage {height:550px}
 .hero-stage .phone {width:220px;left:calc(50% - 110px);border-width:6px}
 .hero .stage-label {top:100px}
}
.feature-grid {align-items:start;gap:0 35px}
.feature-grid article {padding:0;display:block}
.feature-disclosure {width:100%}
.feature-disclosure summary {position:relative;cursor:pointer;list-style:none;display:block;padding:22px 36px 22px 0;min-height:100px}
.feature-disclosure summary::-webkit-details-marker {display:none}
.feature-disclosure summary>span:first-child {font-size:11px;letter-spacing:.12em;color:var(--accent)}
.feature-disclosure h3 {font-size:26px;margin:10px 0 0}
.disclosure-mark {position:absolute;right:4px;top:50%;transform:translateY(-50%);font-size:25px;color:var(--muted)}
.feature-disclosure[open] .disclosure-mark {font-size:0}
.feature-disclosure[open] .disclosure-mark::after {content:'−';font-size:25px}
.feature-body {padding:0 24px 25px 0}
.feature-body p {font-size:15px;line-height:1.65;margin-bottom:15px}
.feature-body small {font-size:12px;display:block;line-height:1.5}
.feature-body a {font-size:13px}
.directory-hint {font-size:13px;color:var(--muted);margin:0 0 25px}
.feature-grid article:has(details[open]) {background:#f5f2eb66}
.screen-caption,.visual-caption,.chapter-visual>p,.gallery-note {font-size:12px;line-height:1.55}
.hero .eyebrow,.mobile-chapters,.footer-bottom,.download-note {font-size:12px}
.screen-dialog {width:min(760px,calc(100% - 28px))}
.dialog-heading {position:sticky;top:-24px;background:var(--paper);z-index:2;padding-block:12px;margin-bottom:8px}
.detail-zoom {border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--ink);padding:10px 18px;min-height:44px;font-size:13px;margin-bottom:15px}
.detail-zoom[aria-pressed=true] {background:var(--ink);color:var(--paper)}
.dialog-image-viewport {overflow:auto;max-height:65svh;overscroll-behavior:contain;border-radius:12px}
.dialog-image-viewport img {width:min(100%,460px);margin:auto;border-radius:12px}
.screen-dialog.is-detail-zoomed .dialog-image-viewport img {width:680px;max-width:none}
.screen-dialog>p {font-size:12px}
@media (max-width:1000px) and (min-width:701px) {
 .hero h1 {font-size:92px}
 .hero-stage .phone {width:220px;left:calc(50% - 110px)}
}
@media (max-width:700px) {
 .hero {padding-top:25px}
 .hero h1 {font-size:clamp(54px,11.7vw,78px);margin:20px auto 18px}
 .hero .lede {font-size:15px;max-width:350px}
 .hero-actions {gap:18px;margin-top:20px}
 .hero .availability {font-size:11px}
 .hero-stage {height:455px;margin-top:18px}
 .hero-stage .phone {width:165px;left:calc(50% - 82.5px);top:10px}
 .hero .hero-backdrop-word {top:70px}
 .hero .orbit {top:70px}
 .hero-copy .eyebrow {font-size:10px}
 .feature-grid {grid-template-columns:1fr}
 .feature-disclosure summary {min-height:96px;padding-block:19px}
 .feature-disclosure h3 {font-size:26px}
 .feature-body p {font-size:15px}
 .feature-body small,.gallery-note {font-size:12px}
 .chapter-detail p,.chapter-copy>p:not(.eyebrow):not(.chapter-lede),.money-points p {font-size:15px}
 .mobile-chapters {gap:23px;font-size:12px}
 .dialog-heading {top:-18px}
 .screen-dialog {padding:18px}
}
@media (max-width:360px) {
 .hero h1 {font-size:50px}
 .hero-actions {gap:12px}
 .hero-actions .text-link {font-size:11px}
 .hero-stage .phone {width:150px;left:calc(50% - 75px)}
 .hero-stage {height:425px}
 .mobile-chapters {gap:19px;font-size:11px}
}
/* Factual offline reference, separate from the real app capture. */
.offline-facts{margin-top:28px}.offline-facts table{width:100%;border-collapse:collapse;text-align:left;font-size:14px;margin:16px 0 22px}.offline-facts caption{text-align:left;color:#d0d8c7;margin-bottom:12px}.offline-facts th,.offline-facts td{padding:14px 10px;border-bottom:1px solid #ffffff30;vertical-align:top}.offline-facts thead th{color:#d0d8c7;font-weight:500}.offline-facts tbody th{font-weight:500;width:42%}
/* AA contrast for small text on the directory and document panels. */
.feature-disclosure summary>span:first-child{color:#a93222}
#visa .visual-caption{color:#4c554a}

/* A quiet transition from expense details into the interactive product tour. */
.journey{border-top:1px solid var(--line)}

/* One explorable screen collection, with ordinary links as a no-script fallback. */
#journey{position:relative}.section-anchor{position:absolute;top:0;left:0}
.screen-switcher{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;overflow:visible;padding-bottom:24px}
.screen-switcher button{min-height:48px;white-space:normal;padding:12px 14px;text-align:center;border:1px solid var(--line)}
.screenshot-index{margin-top:36px;border-top:1px solid var(--line);padding-top:16px}.screenshot-index summary{cursor:pointer;min-height:44px;padding:10px 0;font-size:14px}.screenshot-index ul{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px 24px;list-style:none;padding:15px 0;margin:0}.screenshot-index a{font-size:14px;display:inline-flex;align-items:center;min-height:44px}
.travel-mode{padding-bottom:38px}
@media(max-width:700px){.screen-switcher{grid-template-columns:repeat(2,minmax(0,1fr));margin-right:0;padding-right:0;gap:8px}.screen-switcher button{font-size:13px;min-height:44px}.screenshot-index ul{grid-template-columns:1fr 1fr}.travel-mode{padding-bottom:28px}}
/* A clear type scale: the hero leads, chapters explain, tools stay compact. */
.your-way>h2{font-size:clamp(42px,5vw,72px);margin:22px 0 32px}
.chapter-copy h2,.offline-copy h2,.money-copy h2,.section-heading h2,.data-section .section-heading h2,.questions h2{font-size:clamp(38px,4.3vw,64px);line-height:1.08;letter-spacing:-.045em}
.travel-mode h3{font-size:clamp(28px,3vw,40px);line-height:1.12}
.story-copy h3{font-size:clamp(30px,3.2vw,46px);line-height:1.12;letter-spacing:-.035em}
.feature-grid .feature-disclosure h3{font-size:24px;line-height:1.25}
.section-heading{margin-bottom:32px}.journey,.tool-directory,.data-section{padding-block:72px}
.preview-help{border-top:1px solid var(--line);padding-top:20px;margin-top:24px}.preview-help-label{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-bottom:6px}#story-location{font-size:14px;line-height:1.6}#story-guide{min-height:44px;margin-top:10px;font-size:14px}.mobile-preview-picker{display:none}
@media(max-width:700px){
 .chapter-copy h2,.offline-copy h2,.money-copy h2,.section-heading h2,.data-section .section-heading h2,.questions h2{font-size:36px;line-height:1.12}
 .your-way>h2{font-size:40px}.travel-mode h3{font-size:30px}.story-copy h3{font-size:30px;margin:16px 0}.journey,.tool-directory,.data-section{padding-block:48px}
 .has-preview .screen-switcher{display:none}.has-preview .mobile-preview-picker{display:block;position:sticky;top:116px;z-index:20;background:#e9eadd;padding:12px 0 14px;border-bottom:1px solid var(--line)}
 .mobile-preview-picker label{display:block;font-size:12px;color:var(--muted);margin-bottom:6px}.mobile-preview-picker select{width:100%;min-height:48px;font:500 16px/1.4 var(--sans);color:var(--ink);background:var(--paper);border:1px solid #5c625a;border-radius:12px;padding:10px 14px}
 .app-story{padding-top:20px;gap:24px}.story-stage{order:-1;padding:20px;border-radius:20px}.story-stage .phone{width:min(200px,52vw)}.story-stamp{display:none}.screen-zoom{margin-top:12px;min-height:44px}.story-copy{padding-left:0}.story-copy ul{margin:18px 0}.preview-help{margin-top:18px;padding-top:16px}
}
/* Switch to compact navigation before desktop links start wrapping. */
.nav-shell .button,.nav-shell .wordmark{flex-shrink:0;white-space:nowrap}
@media(min-width:701px) and (max-width:1000px){
 :root{--chapter-height:45px}html:not(:has(.mobile-chapters)){--chapter-height:0px}
 .nav-shell nav{display:none}
 .mobile-chapters{display:flex;gap:26px;padding:0 4.5vw;font-size:13px;border-bottom:1px solid var(--line);background:#f5f2ebf5;position:sticky;top:var(--site-header-height);z-index:25;overflow:auto}
 .mobile-chapters a{text-decoration:none;white-space:nowrap;display:inline-flex;align-items:center;min-height:44px}
}
/* Scroll depth belongs to the product panels, not a separate slogan scene. */
.scene-depth{position:absolute;left:calc(50% - min(21vw,310px));top:calc(50% - min(21vw,310px));width:clamp(280px,42vw,620px);aspect-ratio:1;border-radius:46% 54% 58% 42%;background:#ffffff38;border:1px solid #ffffff90;z-index:-1;pointer-events:none}
.scene-depth::after{content:'';position:absolute;inset:18%;border:1px solid #ffffffa0;border-radius:50%}
.offline-screen{isolation:isolate}.offline-screen .scene-depth{background:#d7e2c51a;border-color:#d7e2c54a}.offline-screen .scene-depth::after{border-color:#d7e2c54a}
.motion-enter{transform:translateY(58px);transition:opacity 600ms var(--ease-out),transform 700ms var(--ease-out)}
.motion-enter.is-visible,.motion-enter:focus-within{opacity:1;transform:none}
.motion-visual-enter{opacity:0;transform:translateY(65px) rotate(3deg) scale(.94);transition:opacity 500ms var(--ease-out),transform 750ms var(--ease-out)}
.motion-visual-enter.is-visible,.motion-visual-enter:focus-within{opacity:1;transform:none}
@media(max-width:700px){.scene-depth{width:340px;left:calc(50% - 170px);top:calc(50% - 170px)}.motion-enter{transform:translateY(36px)}.motion-enter.is-visible,.motion-enter:focus-within{transform:none}}
@media(prefers-reduced-motion:reduce){.scene-depth{display:none}.motion-enter,.motion-visual-enter{opacity:1;transform:none;transition:none!important}}
/* Shared reading rhythm: comfortable copy without inflating display headings. */
.chapter-detail p,.chapter-copy>p:not(.eyebrow):not(.chapter-lede),.money-points p,
.travel-mode>p,.data-grid p,.data-choices p,.faq-list p{font-size:15px;line-height:1.65}
.section-heading>p:not(.eyebrow){font-size:16px;line-height:1.6}
.chapter-copy h2,.offline-copy h2,.money-copy h2,.section-heading h2,
.travel-mode h3,.story-copy h3{ text-wrap:balance }
.data-grid{margin-top:40px}
.questions{padding-block:72px}
.tool-filters button{font-size:13px;min-height:44px}
.filter-summary,.directory-hint{font-size:13px;line-height:1.6}
@media(min-width:701px) and (max-width:1000px){
 .chapter-copy h2,.offline-copy h2,.money-copy h2,.section-heading h2{font-size:42px}
 #visa .chapter-visual>.chapter-phone{width:210px;transform:translate(35px,15px) rotate(8deg)}
 #visa .supporting-phone{width:170px;transform:translate(-55px,-10px) rotate(-12deg)}
 .feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .data-grid{grid-template-columns:1fr;gap:28px}
 .data-grid article{max-width:680px;border-top:1px solid #798b6a66;padding-top:24px}
 .data-grid h3{margin-bottom:12px}
 .offline-layout{grid-template-columns:1fr;gap:48px}
 .offline-copy{max-width:680px}
 .offline-screen .phone{width:260px}
 .offline-screen{padding-block:24px}
}
@media(max-width:700px){
 .chapter-copy,.money-copy{padding-block:48px}
 .offline-layout{padding-block:48px;gap:40px}
 .your-way{padding-top:48px}
 .feature-chapter{margin-top:48px}
 #visa,#stay{margin-top:0}
 .questions{padding-block:48px;gap:24px}
 .section-heading{gap:16px;margin-bottom:24px}
 .section-heading>p:not(.eyebrow){font-size:15px}
 .travel-mode>p,.story-copy>p:not(.story-number):not(.screen-caption),
 .data-grid p,.data-choices p,.faq-list p{font-size:15px;line-height:1.65}
 .story-copy ul{font-size:14px;line-height:1.6}
 .tool-filters button{font-size:13px;padding:11px 15px}
 .data-grid{margin-top:28px}
 .privacy-bottom>p{font-size:13px;line-height:1.65}
}