@charset "UTF-8";
/* Source: style.css */
:root{--ink:#202020;--muted:#6f6f6f;--accent:#111111;--accent-dark:#050505;--soft:#eeeeee;--paper:#f8f8f8;--line:#e5e5e5;--ease:cubic-bezier(.22,1,.36,1);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none;font-size:16px;line-height:1.5;font-optical-sizing:auto}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:95px}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button,input{color:inherit}button{touch-action:manipulation}button:focus-visible,a:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid #767676;outline-offset:5px}h1,h2,h3,p,figure{margin:0}h1,h2,h3{font-weight:600;line-height:1.06;letter-spacing:-.045em}img{display:block;max-width:100%}svg.icon{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}svg.icon-library{position:absolute;width:0;height:0;overflow:hidden}.wrap{width:min(1120px,calc(100% - 80px));margin-inline:auto}.section-pad{padding-block:118px}.eyebrow{font-size:11px;font-weight:650;letter-spacing:.14em;line-height:1.5}.button{min-height:49px;display:inline-flex;align-items:center;justify-content:center;gap:16px;background:var(--accent);color:white;border:0;border-radius:99px;padding:13px 23px;font-size:14px;font-weight:550;transition:background .2s,transform .2s var(--ease)}.button:hover{background:#545454}.button:active{transform:scale(.97)}.button .icon{width:18px;height:18px}.button-small{padding:9px 18px;min-height:37px;font-size:12px;gap:10px}.text-link{display:inline-flex;align-items:center;gap:7px;color:var(--accent);font-size:15px;font-weight:550;min-height:44px}.text-link .icon{width:17px;height:17px;transition:transform .2s}.text-link:hover .icon{transform:translateX(3px)}.skip-link{position:fixed;top:-70px;left:20px;z-index:100;background:white;border-radius:8px;padding:12px 20px}.skip-link:focus{top:10px}
.site-header{position:sticky;top:0;z-index:30;background:rgba(248,248,248,.84);backdrop-filter:blur(20px) saturate(130%);-webkit-backdrop-filter:blur(20px) saturate(130%)}.nav-wrap{height:76px;width:min(1200px,calc(100% - 80px));margin:auto;display:flex;align-items:center;justify-content:space-between;gap:28px}.brand{display:inline-flex;align-items:center}.brand img{object-fit:contain}.desktop-nav{display:flex;gap:34px;margin-left:60px}.desktop-nav a{font-size:12px;color:#575757;min-height:44px;display:flex;align-items:center;transition:color .2s}.desktop-nav a:hover{color:var(--accent)}.menu-toggle{display:none}.mobile-nav[hidden]{display:none}
.hero{overflow:hidden}.hero-copy{text-align:center;padding-top:65px;position:relative;z-index:2}.hero .eyebrow{color:#696969;display:flex;justify-content:center;align-items:center;gap:8px}.little-dot{width:6px;height:6px;background:#727272;border-radius:50%}.hero h1{font-size:clamp(64px,7.8vw,104px);line-height:1.025;letter-spacing:-.065em;margin-top:23px}.hero h1 span{color:var(--accent)}.hero-description{font-size:18px;line-height:1.65;color:var(--muted);margin-top:25px;letter-spacing:-.018em}.hero-actions{display:flex;justify-content:center;align-items:center;gap:29px;margin-top:29px}.product-stage{height:692px;max-width:1200px;margin:49px auto 0;position:relative}.stage-glow{position:absolute;inset:8% 6% 1%;background:radial-gradient(ellipse at 50% 65%,#e2e2e2 0%,#ebebeb 30%,rgba(241,241,241,.65) 48%,transparent 70%);border-radius:50%}.stage-orbit{position:absolute;left:50%;top:50%;border:1px solid rgba(158,158,158,.16);border-radius:50%;transform:translate(-50%,-25%) rotate(-13deg);width:960px;height:300px}.orbit-two{width:1120px;height:405px;transform:translate(-50%,-29%) rotate(-13deg)}.phone{position:absolute;padding:7px;background:linear-gradient(110deg,#b8b8b8,#e9e9e9 18%,#818181 60%,#cbcbcb);border-radius:47px;box-shadow:inset 0 0 0 1px #929292,0 30px 48px -20px #38383845,0 4px 10px #38383820;overflow:hidden}.phone:before{content:"";position:absolute;inset:4px;border:3px solid #242424;border-radius:44px;z-index:2;pointer-events:none}.phone img{width:100%;height:auto;border-radius:39px}.phone-front{width:282px;left:calc(50% - 29px);top:5px;transform:rotate(9deg);z-index:3}.phone-back{width:264px;left:calc(50% - 269px);top:48px;transform:rotate(-10deg);z-index:2}.floating-note{position:absolute;background:rgba(255,255,255,.92);border:1px solid white;border-radius:19px;padding:19px 21px;display:flex;align-items:center;gap:15px;box-shadow:0 10px 40px #35353510;z-index:5;backdrop-filter:blur(16px)}.note-help{top:184px;left:4%;transform:rotate(-5deg)}.note-icon{display:grid;place-items:center;width:51px;height:56px;background:#ececec;border-radius:13px;color:#6a6a6a}.note-icon .icon{width:28px;height:28px}.floating-note strong{font-size:15px;display:block;letter-spacing:-.02em;font-weight:600}.note-eyebrow{font-size:8px;letter-spacing:.08em;color:#8c8c8c;display:block;margin-bottom:3px}.note-meta{font-size:10px;display:block;color:#8a8a8a;margin-top:5px}.note-done{right:2%;top:405px;transform:rotate(5deg);padding:17px 20px;gap:12px}.done-mark{height:37px;width:37px;display:grid;place-items:center;border-radius:50%;background:var(--soft);color:var(--accent)}.note-done div>span{font-size:11px;color:#838383;display:block;margin-top:2px}.note-heart{margin-left:15px;color:var(--accent);width:19px!important}.stage-caption{position:absolute;bottom:13px;left:0;right:0;text-align:center;font-size:10px;color:#7e7e7e;letter-spacing:.015em}.purpose-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;justify-content:center;gap:68px;padding-block:26px}.purpose-strip>span{display:flex;align-items:center;gap:12px;font-size:13px;color:#737373}.purpose-strip .icon{color:#636363;width:20px;height:20px}
.possibilities{background:#ffffff;margin-top:0}.section-heading{text-align:center}.section-heading h2,h2{font-size:clamp(38px,4.4vw,58px)}.section-heading .eyebrow{color:#7d7d7d;margin-bottom:20px}.section-heading h2 span,.how h2 span{color:#8e8e8e}.section-heading>p:last-child:not(.eyebrow){font-size:17px;line-height:1.6;color:var(--muted);margin-top:25px;letter-spacing:-.015em}.mode-tabs{display:flex;justify-content:center;gap:5px;background:#f1f1f1;padding:5px;border-radius:100px;width:max-content;max-width:100%;margin:43px auto 49px}.mode-tabs button{border:0;border-radius:99px;background:transparent;padding:13px 22px;font-size:13px;color:#6e6e6e;display:flex;align-items:center;gap:9px;min-height:45px;transition:background .2s,color .2s,box-shadow .2s}.mode-tabs button .icon{width:18px;height:18px}.mode-tabs button[aria-selected=true]{background:white;color:var(--accent);box-shadow:0 2px 6px #2b2b2b0b}.mode-tabs button:hover{color:var(--accent)}.use-case-panel{display:grid;grid-template-columns:1fr 1.05fr;gap:90px;align-items:center;min-height:440px}.use-case-copy{padding-left:29px}.feature-kicker{display:block;color:#838383;font-size:10px;letter-spacing:.12em;font-weight:600;margin-bottom:19px}.use-case-copy h3{font-size:40px;line-height:1.12;letter-spacing:-.045em}.use-case-copy>p{color:var(--muted);font-size:15px;line-height:1.75;margin-top:22px;max-width:360px}.feature-list{list-style:none;padding:0;margin:23px 0 19px;font-size:13px;color:#555555}.feature-list li{display:flex;align-items:center;gap:10px;margin-block:12px}.feature-list .icon{width:17px;height:17px;color:var(--accent)}.example-browser{background:#f4f4f4;padding:30px;border-radius:28px;min-height:407px}.example-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}.example-brand{font-size:23px;font-weight:600;letter-spacing:-.04em}.example-header>span:last-child{display:flex;align-items:center;gap:4px;font-size:11px;color:#818181}.example-header .icon{width:13px;height:13px}.example-list{display:grid;gap:12px}.example-card{display:flex;align-items:center;width:100%;text-align:left;gap:15px;padding:19px 17px;background:white;border:1px solid #ebebeb;border-radius:16px;transition:transform .25s var(--ease),box-shadow .25s}.example-card:hover{transform:translateY(-3px);box-shadow:0 8px 17px #33333310}.example-card:active{transform:scale(.98)}.example-card .task-icon{height:42px;width:42px;display:grid;place-items:center;background:#f3f3f3;border-radius:12px;color:#707070;flex-shrink:0}.example-card:nth-child(2) .task-icon{background:#efefef;color:#848484}.example-card:nth-child(3) .task-icon{background:#eeeeee;color:#7a7a7a}.example-text{flex:1;min-width:0}.example-text strong{display:block;font-size:13px;line-height:1.4;font-weight:550;letter-spacing:-.015em}.example-text small{display:block;color:#8a8a8a;font-size:10px;margin-top:5px}.example-price{font-size:13px;white-space:nowrap;font-weight:600;color:var(--accent);background:#f3f3f3;padding:5px 9px;border-radius:8px}.example-card>.icon{width:14px;color:#9e9e9e}.example-caption{font-size:10px;color:#828282;text-align:center;margin-top:22px}
.section-heading.left{text-align:left}.how{padding-block:110px 120px}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:34px;margin-top:52px}.step-visual{height:222px;display:flex;align-items:center;justify-content:center;background:#eeeeee;border-radius:22px;margin-bottom:30px;overflow:hidden;padding:23px}.mini-request{background:white;border:1px solid #e8e8e8;border-radius:15px;width:247px;padding:18px;box-shadow:0 10px 25px #3535350a;transform:rotate(-4deg)}.mini-label{display:flex;align-items:center;gap:5px;font-size:9px;color:#919191}.mini-label .icon{width:12px;height:12px}.mini-request>strong{display:block;font-size:12px;font-weight:550;letter-spacing:-.015em;margin-top:13px}.mini-request>div{display:flex;gap:6px;font-size:8px;color:#838383;margin-block:10px 18px}.mini-request>div>span{background:#f2f2f2;padding:3px 6px;border-radius:4px}.mini-publish{display:flex;align-items:center;justify-content:center;gap:6px;background:var(--accent);color:white;font-size:9px;border-radius:7px;padding:7px}.mini-publish .icon{width:12px;height:12px}.mini-conversation{width:260px}.chat-person{display:flex;align-items:center;gap:8px;margin-bottom:18px;font-size:10px}.chat-person small{display:block;font-size:8px;color:#8c8c8c;margin-top:2px}.avatar{display:grid;place-items:center;width:31px;height:31px;background:#d9d9d9;border-radius:50%;color:#5a5a5a;font-size:12px}.message{font-size:10px;padding:11px 12px;border-radius:11px;display:block;width:max-content;max-width:100%;box-shadow:0 3px 8px #3b3b3b04}.incoming{background:#ffffff;border-bottom-left-radius:3px}.outgoing{background:#e4e4e4;border-bottom-right-radius:3px;margin:9px 0 0 auto;display:flex;align-items:center;gap:6px}.outgoing .icon{width:11px;height:11px;color:var(--accent)}.mini-complete{display:flex;flex-direction:column;align-items:center}.complete-icon{display:grid;place-items:center;width:60px;height:60px;border-radius:50%;background:#e3e3e3;color:var(--accent);margin-bottom:17px;box-shadow:0 0 0 10px #e9e9e9}.complete-icon .icon{width:27px;height:27px}.mini-complete>strong{font-size:17px;letter-spacing:-.03em;font-weight:550}.mini-complete>span:last-child{font-size:10px;color:#8f8f8f;margin-top:6px}.step-number{font-size:11px;color:#939393;font-weight:600}.step h3{font-size:21px;letter-spacing:-.03em;margin-top:12px}.step>p{font-size:14px;color:var(--muted);line-height:1.75;margin-top:14px;max-width:310px}
.confidence{background:#171717;color:#ffffff}.confidence-inner{display:grid;grid-template-columns:1.1fr 1fr;gap:100px;padding-block:96px 99px}.confidence .eyebrow{color:#b1b1b1;margin-bottom:25px}.confidence h2{font-size:52px;line-height:1.08}.confidence h2 span{color:#bdbdbd}.confidence-copy>p:last-child{color:#c0c0c0;font-size:15px;line-height:1.8;margin-top:24px;max-width:350px}.confidence-features{display:grid;gap:31px;padding-top:5px}.confidence-features article{display:flex;gap:18px}.trust-icon{display:grid;place-items:center;flex-shrink:0;width:42px;height:42px;border:1px solid #575757;border-radius:13px;color:#d0d0d0}.trust-icon .icon{width:20px;height:20px}.confidence-features h3{font-size:16px;letter-spacing:-.015em;line-height:1.4;font-weight:500}.confidence-features p{font-size:13px;line-height:1.7;color:#b9b9b9;margin-top:6px;max-width:320px}
.faq{display:grid;grid-template-columns:1fr 1.35fr;gap:70px;padding-block:115px}.faq-intro .eyebrow{color:#868686;margin-bottom:21px}.faq-intro h2{font-size:43px}.faq-intro>p:last-child{font-size:15px;color:var(--muted);margin-top:21px;line-height:1.7}.faq-list{border-top:1px solid var(--line)}details{border-bottom:1px solid var(--line)}summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:23px 0;font-size:14px;font-weight:500;cursor:pointer}summary::-webkit-details-marker{display:none}.faq-plus{width:15px;height:15px;position:relative;flex-shrink:0;margin-right:2px}.faq-plus:before,.faq-plus:after{content:"";position:absolute;background:#777777;left:1px;right:1px;top:7px;height:1px}.faq-plus:after{transform:rotate(90deg);transition:transform .2s}details[open] .faq-plus:after{transform:rotate(0)}details>p{font-size:14px;line-height:1.8;color:var(--muted);padding:0 32px 24px 0}
.closing{text-align:center;background:#f0f0f0;padding:80px 0 79px}.closing-icon{margin:0 auto 28px;border-radius:18px;box-shadow:0 6px 17px #54545414}.closing .eyebrow{color:#8b8b8b;font-size:10px;margin-bottom:16px}.closing h2{font-size:68px;letter-spacing:-.055em}.closing p:not(.eyebrow){font-size:16px;color:#838383;margin:19px 0 26px}.closing-note{display:block;color:#858585;font-size:10px;margin-top:13px}.site-footer{display:flex;align-items:center;gap:35px;padding-block:35px}.site-footer>p{font-size:11px;color:#828282}.site-footer>div{margin-left:auto;display:flex;gap:25px;font-size:10px;color:#888888}.site-footer a:hover{color:var(--accent)}
dialog{border:1px solid #e6e6e6;border-radius:27px;width:min(510px,calc(100% - 32px));max-height:calc(100% - 40px);padding:0;color:var(--ink);background:#ffffff;box-shadow:0 30px 100px #1d1d1d30}dialog::backdrop{background:rgba(28,28,28,.4);backdrop-filter:blur(7px)}.dialog-shell{padding:36px;position:relative}.dialog-close{position:absolute;right:16px;top:15px;width:36px;height:36px;border:0;border-radius:50%;background:#f2f2f2;color:#6f6f6f;font-size:25px;line-height:1}.dialog-tag{font-size:9px;letter-spacing:.12em;color:#929292;font-weight:600}.dialog-icon{display:grid;place-items:center;width:54px;height:54px;background:#f1f1f1;color:var(--accent);border-radius:15px;margin:24px 0 20px}.dialog-icon .icon{width:27px;height:27px}.dialog-shell h2{font-size:32px;line-height:1.12;padding-right:10px}.dialog-shell>p:not(.dialog-disclaimer){font-size:14px;line-height:1.75;color:var(--muted);margin:17px 0}.dialog-facts{background:#f6f6f6;border-radius:14px;padding:3px 18px;margin-block:25px}.dialog-facts>div{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:13px 0}.dialog-facts>div+div{border-top:1px solid #eaeaea}.dialog-facts dt{font-size:12px;color:#838383}.dialog-facts dd{font-size:13px;text-align:right;margin:0;font-weight:550}.dialog-actions{display:flex;flex-direction:column;gap:9px}.save-button{background:transparent;border:0;border-radius:99px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:12px;padding:11px;color:var(--accent);min-height:44px}.save-button .icon{width:17px;height:17px}.save-button[aria-pressed=true] .icon{fill:var(--accent)}.dialog-disclaimer{font-size:10px;line-height:1.6;color:#979797;text-align:center;margin-top:18px}
@media(min-width:1400px){.hero-copy{padding-top:79px}.product-stage{margin-top:59px}}
@media(max-width:1050px){.wrap{width:calc(100% - 64px)}.product-stage{height:650px}.phone-front{width:265px}.phone-back{width:249px;left:calc(50% - 248px)}.note-help{left:3%;top:150px;transform:scale(.88) rotate(-5deg);transform-origin:left}.note-done{right:2%;top:440px;transform:scale(.88) rotate(5deg);transform-origin:right}.purpose-strip{gap:34px}.purpose-strip>span{font-size:11px;gap:8px}.use-case-panel{gap:45px}.use-case-copy{padding-left:0}.use-case-copy h3{font-size:34px}.example-browser{padding:23px}.example-card{gap:10px;padding:16px 12px}.example-card .task-icon{width:36px;height:39px}.example-text strong{font-size:12px}.example-price{font-size:11px;padding:4px 6px}.confidence-inner{gap:50px}.confidence h2{font-size:44px}.steps{gap:22px}.step-visual{padding:18px}.step h3{font-size:19px}.faq{gap:45px}.faq-intro h2{font-size:37px}}
@media(max-width:760px){html{scroll-padding-top:90px}.wrap{width:calc(100% - 40px)}.section-pad{padding-block:75px}.nav-wrap{height:66px;width:calc(100% - 40px);gap:14px}.brand img{width:105px;height:auto}.desktop-nav{display:none}.nav-wrap>.button{margin-left:auto;min-height:35px;font-size:11px;padding:8px 12px;gap:7px}.nav-wrap>.button .icon{width:14px;height:14px}.menu-toggle{display:flex;position:relative;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:32px;height:44px;background:transparent;border:0;padding:0}.menu-toggle span{width:19px;height:1px;background:var(--ink);transition:transform .2s}.menu-toggle[aria-expanded=true] span:first-child{transform:translateY(3px) rotate(45deg)}.menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-3px) rotate(-45deg)}.mobile-nav{padding:7px 25px 20px;display:grid;gap:4px;border-bottom:1px solid var(--line)}.mobile-nav a{font-size:15px;padding:13px 0}.hero-copy{padding-top:47px}.hero .eyebrow{font-size:9px;letter-spacing:.12em}.hero h1{font-size:clamp(52px,10.5vw,79px);letter-spacing:-.06em;margin-top:24px}.hero-description{font-size:15px;line-height:1.65;max-width:390px;margin:22px auto 0}.desktop-break{display:none}.hero-actions{gap:20px;margin-top:25px}.hero-actions .button{font-size:12px;min-height:45px;padding:12px 17px;gap:12px}.hero-actions .text-link{font-size:12px}.product-stage{height:555px;margin-top:44px}.phone-front{width:222px;left:calc(50% - 42px);top:8px;border-radius:38px;padding:6px}.phone-back{width:207px;left:calc(50% - 209px);top:39px;border-radius:37px;padding:6px}.phone:before{border-radius:35px;inset:3px}.phone img{border-radius:31px}.stage-glow{inset:0 -40% 0}.stage-orbit{width:670px;height:250px}.orbit-two{width:780px;height:350px}.note-help{top:137px;left:calc(50% - 263px);transform:scale(.69) rotate(-5deg)}.note-done{top:393px;right:calc(50% - 250px);transform:scale(.72) rotate(5deg)}.stage-caption{font-size:9px;bottom:7px}.purpose-strip{padding-block:22px;gap:0;justify-content:space-between}.purpose-strip>span{font-size:9px;max-width:105px;flex-direction:column;text-align:center;gap:8px;line-height:1.45}.purpose-strip .icon{height:19px;width:19px}.section-heading h2{font-size:42px;letter-spacing:-.05em}.section-heading .eyebrow{font-size:9px;margin-bottom:18px}.section-heading>p:last-child:not(.eyebrow){font-size:15px;margin-top:22px}.mode-tabs{margin:31px auto 35px;padding:4px;gap:0;width:100%;justify-content:space-between;max-width:470px}.mode-tabs button{padding:11px 12px;justify-content:center;font-size:11px;gap:6px;flex:1;white-space:nowrap}.mode-tabs button .icon{width:15px;height:15px}.use-case-panel{grid-template-columns:1fr;gap:30px;min-height:0}.use-case-copy{padding:0 5px;max-width:480px;margin:auto;width:100%}.use-case-copy h3{font-size:34px}.feature-kicker{font-size:9px;margin-bottom:15px}.use-case-copy>p{max-width:100%;font-size:14px;margin-top:18px}.feature-list{font-size:12px;margin:18px 0 10px}.feature-list li{margin-block:10px}.use-case-copy .text-link{font-size:13px}.example-browser{padding:25px;border-radius:22px;max-width:480px;width:100%;margin:auto;min-height:375px}.example-card{padding:17px 14px;gap:13px}.example-text strong{font-size:13px}.example-price{font-size:12px}.example-caption{font-size:9px}.section-heading.left{text-align:center}.steps{grid-template-columns:1fr;gap:42px;margin-top:36px;max-width:480px;margin-inline:auto}.step-visual{height:235px;margin-bottom:21px}.step h3{font-size:22px;margin-top:10px}.step>p{max-width:100%;font-size:14px;margin-top:12px}.mini-request{width:260px}.mini-conversation{width:270px}.mini-request>strong{font-size:14px}.mini-label{font-size:10px}.mini-request>div{font-size:9px}.mini-publish{font-size:10px}.chat-person{font-size:11px}.chat-person small{font-size:9px}.message{font-size:11px}.confidence-inner{grid-template-columns:1fr;gap:37px;padding-block:65px}.confidence h2{font-size:43px}.confidence-copy>p:last-child{font-size:14px;max-width:430px;margin-top:21px}.confidence .eyebrow{font-size:9px}.confidence-features{gap:27px}.confidence-features h3{font-size:15px}.confidence-features p{font-size:13px;max-width:100%}.confidence-features article{gap:14px}.faq{grid-template-columns:1fr;gap:30px}.faq-intro h2{font-size:40px}.faq-intro .eyebrow{font-size:9px}.faq-intro>p:last-child{font-size:14px;margin-top:16px}.faq-intro br{display:none}summary{font-size:13px;padding:22px 0}details>p{font-size:13px;padding-right:15px}.closing{padding:64px 0}.closing-icon{width:68px;height:68px;border-radius:16px;margin-bottom:23px}.closing h2{font-size:52px}.closing p:not(.eyebrow){font-size:14px;max-width:290px;margin:18px auto 25px}.closing .button{font-size:13px}.site-footer{flex-wrap:wrap;gap:15px;padding-block:28px}.site-footer>p{margin-left:auto;font-size:10px}.site-footer>div{width:100%;justify-content:space-between;margin-top:7px;font-size:10px}.dialog-shell{padding:29px 24px}.dialog-shell h2{font-size:28px}}
@media(max-width:400px){.hero-copy{padding-top:34px}.hero h1{font-size:53px}.hero-description{font-size:14px}.hero-actions{gap:15px}.product-stage{height:485px;margin-top:34px}.phone-front{width:194px;left:calc(50% - 34px)}.phone-back{width:180px;left:calc(50% - 181px)}.phone,.phone-back,.phone-front{border-radius:33px}.phone:before{border-radius:30px}.phone img{border-radius:26px}.note-help{left:calc(50% - 218px);top:129px;transform:scale(.58) rotate(-5deg)}.note-done{right:calc(50% - 196px);top:338px;transform:scale(.64) rotate(5deg)}.mode-tabs button{padding:10px 8px;font-size:10px;gap:4px}.mode-tabs button .icon{width:12px;height:12px}.example-browser{padding:19px}.example-card{padding:16px 11px;gap:9px}.example-text strong{font-size:11px}.example-text small{font-size:9px}.example-price{font-size:11px}.example-card>.icon{display:none}.section-heading h2{font-size:36px}.nav-wrap{gap:10px}.nav-wrap .brand img{width:97px}.site-footer>p{font-size:9px}}
@media(max-width:760px){.note-help{left:12px}.note-done{right:12px}.steps{grid-template-columns:minmax(0,1fr)}.step{min-width:0}.mini-request,.mini-conversation{max-width:100%}}
@media(max-width:400px){.hero h1{font-size:clamp(43px,13.6vw,53px)}.hero-actions{gap:12px}.hero-actions .button{font-size:11px;padding-inline:14px;gap:8px;white-space:nowrap}.hero-actions .text-link{font-size:11px;white-space:nowrap;gap:3px}.mode-tabs button{flex-direction:column;gap:6px;min-width:0;white-space:normal;padding:9px 6px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}
@media(prefers-reduced-transparency:reduce){.site-header{background:var(--paper);backdrop-filter:none}.floating-note{background:white;backdrop-filter:none}dialog::backdrop{backdrop-filter:none}}
@media(prefers-contrast:more){:root{--muted:#3d3d3d;--line:#a5a5a5}.eyebrow,.feature-kicker,.example-caption,.stage-caption,.closing-note{color:#4e4e4e}.site-header{background:var(--paper)}.example-card{border-color:#a5a5a5}.confidence-features p,.confidence-copy>p:last-child{color:#e8e8e8}}

/* Use the original hand-heart artwork as a luminance mask, matching the native app. */
.brand{gap:9px;color:#111}.brand-symbol{width:35px;height:21px;display:block;flex-shrink:0;overflow:visible}.brand-name{font-size:27px;line-height:1;font-weight:650;letter-spacing:-1.2px}.phone img{filter:grayscale(1)}.closing-icon{border-radius:20px;box-shadow:0 6px 17px #00000014}.button:hover{background:#333}.button:active{background:#000}
@media(max-width:760px){.brand-symbol{width:29px;height:18px}.brand-name{font-size:24px;letter-spacing:-1px}.brand{gap:7px}.closing-icon{border-radius:16px}}
@media(max-width:400px){.brand-symbol{width:27px;height:16px}.brand-name{font-size:23px}.brand{gap:6px}}

/* Match the iPhone app's BrandMark: system title2 bold with -0.7 tracking. */
.site-header .brand{gap:8px}
.site-header .brand-name{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:22px;font-weight:700;letter-spacing:-.7px;line-height:1.25;font-kerning:normal}

/* Source: motion.css */
/* A spatial stage built from the real Avuksi app, with a quiet static fallback. */
.hero{overflow:clip;background:#f5f5f5}
.hero-story{position:relative;height:calc(100svh + 460px);min-height:1160px}
.hero-cinema{position:sticky;top:76px;height:calc(100svh - 76px);min-height:680px;max-height:1000px;isolation:isolate;overflow:clip;--progress:0;--pointer-x:0;--pointer-y:0;--drift:0}
.scene-light{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 28%,#fff 0%,#ffffffc9 28%,transparent 64%),linear-gradient(145deg,#e8e8e8,#fafafa 48%,#dedede);z-index:-2}
.scene-light:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#f5f5f5 0%,transparent 22%,transparent 90%,#f5f5f5);z-index:2}
.scene-world,.scene-cards{position:absolute;inset:0;perspective:1400px;perspective-origin:50% 48%;transform-style:preserve-3d;pointer-events:none}
/* Separate 3D contexts keep the cards in front when phone planes rotate through them. */
.scene-world{z-index:0}.scene-cards{z-index:1}

.scene-ring{position:absolute;left:50%;top:44%;width:1500px;height:650px;border:1px solid #a1a1a140;border-radius:50%;box-shadow:0 1px 0 #fff;transform:translate3d(-50%,0,-180px) rotateX(67deg) rotateZ(-24deg)}
.ring-near{width:1800px;height:850px;top:30%;border-width:2px;opacity:.42;transform:translate3d(-50%,0,20px) rotateX(67deg) rotateZ(-24deg)}
.scene-grid{position:absolute;inset:45% -50% -80%;opacity:.3;background-image:linear-gradient(#9992 1px,transparent 1px),linear-gradient(90deg,#9992 1px,transparent 1px);background-size:80px 80px;transform:translateZ(-300px) rotateX(70deg);mask-image:radial-gradient(ellipse,#000,transparent 65%)}
.scene-device{position:absolute;left:50%;top:15%;width:260px;transform-style:preserve-3d;will-change:transform}
.device-back{margin-left:-600px;transform:translate3d(0,0,-120px) rotateX(9deg) rotateY(24deg) rotateZ(-16deg)}
.device-front{margin-left:336px;transform:translate3d(0,55px,40px) rotateX(8deg) rotateY(-26deg) rotateZ(14deg)}
.device-edge{position:relative;padding:7px;border-radius:44px;background:linear-gradient(115deg,#eee 0%,#aaa 10%,#f9f9f9 17%,#666 55%,#e0e0e0 85%,#8b8b8b);box-shadow:inset 0 0 0 1px #777,9px 10px 0 -5px #5e5e5e,14px 16px 0 -8px #c4c4c4,24px 38px 55px -30px #0009;overflow:hidden}
.device-edge:after{content:"";position:absolute;inset:4px;pointer-events:none;border:3px solid #111;border-radius:41px;z-index:3}
.device-edge img,.device-edge video{display:block;width:100%;height:auto;aspect-ratio:644/1400;object-fit:cover;border-radius:37px;background:#b9b9b9;filter:grayscale(1)}
.device-gloss{position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(115deg,#fff3,transparent 32%,transparent 70%,#fff1);z-index:2}
.scene-card{position:absolute;left:50%;display:flex;align-items:center;gap:13px;min-width:215px;padding:17px 20px;border:1px solid #fff;border-radius:21px;background:linear-gradient(130deg,#ffffffee,#f7f7f7f5);box-shadow:0 18px 40px -16px #0003,inset 0 0 0 1px #00000003;will-change:transform}
.scene-card-icon{display:grid;place-items:center;width:43px;height:43px;border-radius:14px;background:#ececec;color:#222;flex-shrink:0}
.scene-card-icon .icon{width:23px;height:23px}.scene-card small{display:block;font-size:8px;letter-spacing:.1em;color:#737373;line-height:1.6}.scene-card strong{display:block;font-size:17px;letter-spacing:-.04em;line-height:1.45;font-weight:600}.scene-price{margin-left:17px;font-size:20px;font-weight:600;letter-spacing:-.05em}.card-help{top:68%;margin-left:-315px;transform:translate3d(0,0,120px) rotateX(7deg) rotateY(12deg) rotateZ(-8deg)}.card-chat{top:59%;margin-left:114px;transform:translate3d(0,0,-40px) rotateY(-15deg) rotateZ(8deg)}.card-done{top:82%;margin-left:50px;min-width:210px;transform:translate3d(0,0,70px) rotateZ(4deg)}.card-done .scene-card-icon{background:#191919;color:white;border-radius:50%;width:35px;height:35px}.card-done small{letter-spacing:0;font-size:9px;margin-top:2px}
.hero-cinema .hero-copy{padding-top:clamp(76px,12vh,145px);width:min(660px,calc(100% - 40px));z-index:4;pointer-events:none;will-change:transform}
.hero-cinema .hero-copy a{pointer-events:auto}.hero-cinema h1{font-size:clamp(72px,7.1vw,104px);letter-spacing:-.067em}.hero-cinema h1 span{background:linear-gradient(110deg,#777,#1c1c1c 38%,#777);background-clip:text;-webkit-background-clip:text;color:transparent}.hero-cinema .hero-description{font-size:16px;line-height:1.7;margin-top:23px;color:#666}.hero-cinema .hero-actions{margin-top:27px}.hero-cinema .eyebrow{font-size:10px;letter-spacing:.18em}
.cinema-footer{position:absolute;bottom:20px;left:40px;right:40px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;justify-content:space-between;gap:15px;z-index:10;color:#656565}.cinema-footer p{font-size:9px;margin:0;grid-column:2}.motion-toggle{justify-self:end;display:flex;align-items:center;gap:7px;background:#ffffffb8;border:1px solid #d6d6d6;border-radius:30px;padding:9px 13px;min-height:40px;font-size:10px;backdrop-filter:blur(12px)}.motion-toggle[hidden]{display:none}.motion-toggle svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}.play-symbol{display:none}.motion-toggle[aria-pressed=true] .play-symbol{display:block}.motion-toggle[aria-pressed=true] .pause-symbol{display:none}
.hero .purpose-strip{position:relative;z-index:12;background:#f5f5f5}.motion-paused .scene-device,.motion-paused .scene-card{will-change:auto}
@media(min-width:1700px){.device-back{margin-left:-670px;width:280px}.device-front{margin-left:380px;width:280px}}
@media(max-width:1190px) and (min-width:761px){.scene-device{width:225px}.device-back{margin-left:-490px;top:24%}.device-front{margin-left:270px;top:27%}.hero-cinema h1{font-size:78px}.hero-cinema .hero-copy{padding-top:65px}.hero-cinema .hero-description{font-size:14px;max-width:380px;margin-inline:auto}.card-help{margin-left:-285px;top:75%}.card-chat{margin-left:100px;top:70%}.card-done{display:none}}
@media(max-width:760px){.hero-story{height:auto;min-height:0}.hero-cinema{position:relative;top:auto;height:1020px;min-height:0;max-height:none}.hero-cinema .hero-copy{padding-top:48px}.hero-cinema h1{font-size:clamp(54px,12.8vw,78px);margin-top:22px}.hero-cinema .hero-description{font-size:14px;max-width:360px;margin-top:22px}.hero-cinema .hero-actions{gap:22px;margin-top:25px}.hero-cinema .eyebrow{font-size:9px}.scene-world,.scene-cards{perspective:1100px;perspective-origin:50% 63%}.scene-device{top:455px;width:198px}.device-back{margin-left:-165px;transform:translate3d(0,0,-65px) rotateX(8deg) rotateY(22deg) rotateZ(-12deg)}.device-front{margin-left:-45px;transform:translate3d(0,-30px,30px) rotateX(6deg) rotateY(-20deg) rotateZ(12deg)}.device-edge{padding:6px;border-radius:38px}.device-edge:after{border-radius:35px;inset:3px}.device-edge img,.device-edge video{border-radius:31px}.scene-ring{top:59%;width:900px;height:480px}.ring-near{top:56%;width:1200px;height:650px}.scene-grid{inset:65% -150% -40%}.scene-card{padding:12px 14px;border-radius:17px;gap:9px;min-width:0}.scene-card strong{font-size:13px}.scene-card small{font-size:7px}.scene-card-icon{width:31px;height:34px;border-radius:10px}.scene-card-icon .icon{width:19px;height:19px}.scene-price{font-size:15px;margin-left:6px}.card-help{top:620px;margin-left:-173px;transform:translate3d(0,0,110px) rotateZ(-7deg)}.card-chat{display:none}.card-done{top:865px;margin-left:-45px;min-width:0;transform:translate3d(0,0,90px) rotateZ(5deg)}.card-done small{font-size:8px}.card-done .scene-card-icon{width:30px;height:30px}.cinema-footer{display:flex;left:20px;right:20px;bottom:16px}.cinema-footer p{margin:0;font-size:8px}.motion-toggle{font-size:9px;min-height:36px;padding:8px 10px}}
@media(max-width:400px){.hero-cinema{height:900px}.hero-cinema .hero-copy{padding-top:36px}.hero-cinema .hero-description{font-size:13px}.hero-cinema .hero-actions{gap:15px}.hero-cinema h1{font-size:clamp(45px,13.7vw,54px)}.scene-device{top:415px;width:190px}.device-back{margin-left:-158px}.device-front{margin-left:-40px}.card-help{top:565px;margin-left:-142px}.card-done{top:770px;margin-left:-50px}.device-edge{border-radius:35px}.device-edge:after{border-radius:32px}.device-edge img,.device-edge video{border-radius:29px}}
@media(prefers-reduced-motion:reduce){.hero-story{height:auto;min-height:0}.hero-cinema{position:relative;top:auto}.scene-device,.scene-card,.hero-copy{will-change:auto!important}.scene-world *,.scene-cards *,.hero-cinema .hero-copy{transition:none!important}}
@media(prefers-contrast:more){.hero-cinema h1 span{background:none;color:#222}.hero-cinema .hero-description,.cinema-footer{color:#333}.scene-card{border-color:#aaa}}

/* Two physical card surfaces keep the full scroll flip from mirroring text. */
.scene-card { transform-style: preserve-3d; }
.scene-card > span { backface-visibility: hidden; -webkit-backface-visibility: hidden; transform: translateZ(1px); }
.scene-card:after {
 content: ""; position: absolute; inset: -1px; border: inherit; border-radius: inherit;
 background: linear-gradient(145deg, #161618, #000 70%);
 box-shadow: inset 0 1px 0 #ffffff18;
 transform: rotateX(180deg) translateZ(1px);
 backface-visibility: hidden; -webkit-backface-visibility: hidden;
}

/* Source: presentation.css */
/* Product-led composition: generous space, optical type, restrained chrome. */
:root { font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
p { text-wrap: pretty; }
h1, h2, h3 { text-wrap: balance; }
html { scroll-padding-top: 88px; }
.site-header { border-bottom: 0; background: #e7ebefbd; }
.site-header {
  transform: translate3d(0, calc((-100% - 28px) * var(--header-progress, 0)), 0);
  opacity: calc(1 - var(--header-progress, 0));
}
.site-header.is-scroll-hidden { pointer-events: none; }
.site-header, .site-header.is-scroll-hidden { transform:none; opacity:1; pointer-events:auto; }
.site-header:has(:focus-visible) { transform: none; opacity: 1; pointer-events: auto; }
.site-header .brand { position: relative; }
.site-header .brand:focus-visible { outline: none; }
.site-header .brand:focus-visible::after { content: ""; position: absolute; inset: auto 0 -7px; height: 2px; background: currentColor; border-radius: 1px; }
@media (prefers-reduced-motion: reduce) { .site-header { transform: none; } }
.nav-wrap { height: 64px; max-width: 1160px; }
.desktop-nav { margin-left: 64px; gap: 36px; }
.desktop-nav a { font-size: 12px; }
.button-small { font-weight: 500; }
.hero-cinema { top: 64px; height: calc(100svh - 64px); }
.hero-cinema .hero-copy { width: min(690px, calc(100% - 40px)); padding-top: clamp(62px, 10vh, 115px); }
.hero-cinema .eyebrow { font-size: 19px; line-height: 1.2; font-weight: 600; letter-spacing: -.015em; }
.hero-cinema h1 { font-size: clamp(70px, 7.2vw,102px); font-weight: 650; line-height: 1.025; letter-spacing: -.052em; margin-top: 20px; }
.hero-cinema .hero-description { font-size: 23px; font-weight: 450; line-height: 1.35; letter-spacing: -.015em; margin-top: 24px; }
.hero-cinema .hero-actions { gap: 14px; margin-top: 29px; }
.hero-actions .button { min-height: 46px; font-size: 15px; font-weight: 450; padding: 12px 24px; }
.button.button-outline { color: var(--ink); background: transparent; border: 1px solid #000; }
.button.button-outline:hover { color: white; background: #000; }

.scene-grid { opacity: .15; }
.scene-ring { opacity: .45; }
.ring-near { opacity: .2; }
.scene-card { box-shadow: 0 16px 35px -18px #26333d50, inset 0 1px 0 #fff; }
.card-chat { opacity: .95; }
.hero .purpose-strip { border: 0; padding-block: 35px; gap: 70px; }
.purpose-strip>span { font-size: 14px; font-weight: 500; }

.section-pad { padding-block: 120px; }
.section-heading .eyebrow, .confidence .eyebrow, .faq-intro .eyebrow, .closing .eyebrow {
  font-size: 18px; font-weight: 600; line-height: 1.3; letter-spacing: -.015em; margin-bottom: 20px;
}
.section-heading h2, .faq-intro h2 { font-size: clamp(44px, 5.2vw, 68px); line-height: 1.06; letter-spacing: -.045em; font-weight: 650; }
.section-heading>p:last-child:not(.eyebrow) { font-size: 19px; letter-spacing: -.012em; line-height: 1.5; margin-top: 26px; }
.mode-tabs { margin: 48px auto 56px; padding: 5px; }
.mode-tabs button { padding: 10px 18px; min-height: 40px; gap: 7px; font-size: 12px; font-weight: 500; }
.mode-tabs button .icon { width: 15px; height: 15px; }
.use-case-panel { gap: 75px; padding: 52px; border-radius: 36px; background: #fff; box-shadow: 0 20px 60px -45px #26333d50; }
.use-case-copy { padding-left: 0; }
.feature-kicker:empty { display: none; }
.feature-kicker { font-size: 10px; letter-spacing: .08em; }
.use-case-copy h3 { font-size: 43px; line-height: 1.08; letter-spacing: -.04em; }
.use-case-copy>p { font-size: 16px; line-height: 1.6; }
.feature-list { font-size: 13px; }
.example-browser { padding: 28px; border-radius: 27px; }
.example-card { box-shadow: 0 6px 16px -12px #26333d40; }
.section-heading.left { text-align: left; }
.how { padding-block: 110px 120px; }
.steps { gap: 24px; margin-top: 50px; }
.step { min-width: 0; background: var(--surface); border-radius: 28px; padding: 24px 26px 32px; }
.step-visual { height: 245px; border-radius: 19px; padding: 18px; margin-bottom: 28px; }
.step-number { font-size: 13px; letter-spacing: .04em; }
.step h3 { font-size: 25px; line-height: 1.14; font-weight: 650; }
.step>p { font-size: 15px; line-height: 1.6; }
.mini-request { transform: rotate(-3deg); }
.mini-request>strong { font-size: 12px; }
.mini-complete>strong { font-size: 20px; }
.confidence-inner { padding-block: 120px; gap: 96px; }
.confidence h2 { font-size: 60px; line-height: 1.06; letter-spacing: -.045em; }
.confidence-copy>p:last-child { font-size: 18px; line-height: 1.6; max-width: 400px; }
.confidence-features { gap: 32px; }
.confidence-features h3 { font-size: 19px; font-weight: 600; }
.confidence-features p { font-size: 15px; line-height: 1.6; }
.trust-icon { width: 46px; height: 46px; border: 0; background: #dce2e94d; }
.faq-intro>p:last-child { font-size: 17px; }
summary { padding-block: 26px; font-size: 16px; }
details>p { font-size: 15px; }
.closing { --closing-title-size: clamp(64px, 7vw, 96px); padding-block: 100px; }
.closing h2 { font-size: var(--closing-title-size); letter-spacing: -.055em; font-weight: 650; }
.closing-icon { display: block; width: 88px; height: 88px; margin: 32px auto 0; color: #fff; background: transparent; border-radius: 0; box-shadow: none; }
.closing p:not(.eyebrow) { font-size: calc(var(--closing-title-size) * .46); line-height: 1.2; letter-spacing: -.03em; max-width: none; margin: 25px auto 32px; }
.closing .button { font-size: 16px; padding: 13px 26px; }
.app-downloads { display: flex; justify-content: center; flex-wrap: wrap; gap: 14px; }
.app-downloads .button { min-width: 220px; max-width: 100%; }
.closing-note { font-size: 12px; }
.site-footer { padding-block: 32px; }
.site-footer>p { font-size: 12px; }
.site-footer>div { width: 100%; margin-inline: auto; justify-content: center; text-align: center; font-size: 11px; align-items: center; flex-wrap: wrap; gap: 12px 24px; }
.button:active, .example-card:active { transition-duration: 90ms; }

/* Professionals: the app's skills profile and direct inquiry flow. */
.professionals { background: #e2e7ec; }
.professional-layout { display: grid; grid-template-columns: 1fr 1.05fr; gap: 70px; align-items: center; }
.professional-copy { min-width: 0; }
.professional-copy h2 { font-size: clamp(56px, 6.2vw, 80px); }
.professional-copy .professional-lead { font-size: 24px; line-height: 1.35; letter-spacing: -.025em; font-weight: 550; margin-top: 28px; }
.professional-copy .professional-description { max-width: 400px; font-size: 17px; line-height: 1.6; color: var(--muted); margin-top: 19px; }
.professional-copy .button { margin-top: 28px; font-size: 15px; }
.professional-visual { position: relative; margin: 0; min-width: 0; padding: 42px 32px 32px; border-radius: 36px; background: radial-gradient(ellipse at top left, var(--canvas-top), var(--canvas)); }
.professional-profile { position: relative; background: var(--glass); border: 1px solid var(--glass-rim); border-radius: 25px; padding: 24px; box-shadow: 0 24px 38px -26px #26333d70, inset 0 1px 0 #fff; transform: rotate(-3deg); }
.professional-card-heading { display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size: 12px; color: var(--muted); }
.professional-card-heading>span:first-child { display: flex; align-items: center; gap: 7px; font-weight: 600; }
.professional-card-heading .icon { width: 16px; height: 16px; }
.professional-identity { display: flex; gap: 13px; align-items: center; margin-top: 25px; }
.professional-avatar { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: #dce7f3; color: #2168c4; font-size: 24px; font-weight: 550; }
.professional-identity strong { display: block; font-size: 20px; letter-spacing: -.02em; }
.professional-identity>div>span { display: flex; align-items: center; gap: 4px; font-size: 12px; color: var(--muted); margin-top: 2px; }
.professional-identity .icon { width: 13px; height: 13px; }
.professional-profile h3 { font-size: 26px; line-height: 1.2; letter-spacing: -.025em; margin-top: 22px; text-wrap: initial; }
.professional-profile-details { margin: 24px 0 0; }
.professional-profile-details>div+div { margin-top: 19px; }
.professional-profile-details dt { font-size: 12px; font-weight: 650; margin-bottom: 6px; }
.professional-profile-details dd { margin: 0; font-size: 13px; line-height: 1.5; color: var(--muted); }
.professional-profile-details>div:last-child dd { display: flex; flex-wrap: wrap; gap: 5px; }
.professional-profile-details dd>span { padding: 5px 8px; border-radius: 7px; background: #dbe2e9; font-size: 11px; }
.professional-request { position: relative; display: flex; align-items: center; gap: 12px; padding: 18px 21px; margin: -7px -12px 0 34px; background: var(--glass); border: 1px solid white; border-radius: 21px; box-shadow: var(--glass-shadow); transform: rotate(3deg); }
.professional-request-icon { display: grid; place-items: center; width: 40px; height: 40px; flex: 0 0 auto; background: #e0e9f4; border-radius: 12px; }
.professional-request-icon .icon { width: 22px; height: 22px; }
.professional-request>div>span { display: block; color: var(--muted); font-size: 10px; }
.professional-request strong { display: block; font-size: 14px; line-height: 1.3; margin-top: 3px; }
.professional-request p { color: var(--muted); font-size: 11px; margin-top: 4px; }
.professional-visual figcaption { text-align: center; color: var(--muted); font-size: 10px; line-height: 1.5; margin-top: 28px; }
.professional-start { margin-top: 85px; scroll-margin-top: 24px; }
.professional-start>h3 { font-size: 32px; letter-spacing: -.035em; font-weight: 600; }
.professional-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; list-style: none; margin: 34px 0 0; padding: 0; }
.professional-steps li { border-top: 1px solid #adb5bd; padding-top: 22px; }
.professional-step-number { color: var(--muted); font-size: 12px; font-weight: 600; }
.professional-steps h4 { font-size: 21px; line-height: 1.25; letter-spacing: -.025em; margin-top: 12px; font-weight: 600; }
.professional-steps p { color: var(--muted); font-size: 15px; line-height: 1.6; margin-top: 12px; }
.professional-steps p strong, .professional-find p strong { font-weight: 600; }
.professional-find { display: flex; align-items: center; gap: 26px; border-radius: 25px; padding: 32px; margin-top: 48px; background: #f9fafb; }
.professional-find-icon { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 16px; background: #e1eeef; flex: 0 0 auto; }
.professional-find-icon .icon { width: 28px; height: 28px; }
.professional-find>div { flex: 1; }
.professional-find h3 { font-size: 24px; line-height: 1.2; letter-spacing: -.025em; font-weight: 600; }
.professional-find p { color: var(--muted); font-size: 15px; line-height: 1.6; margin-top: 10px; max-width: 560px; }
.professional-find .button { flex: 0 0 auto; font-size: 14px; }

/* Keep the next section below the viewport when the story snaps into place. */
.our-story { min-height: calc(100svh - 88px); display: flex; align-items: center; background: #f9fafb; }
.story-layout { display: grid; grid-template-columns: 1fr 1.1fr; gap: 96px; align-items: start; }
.story-copy { max-width: 560px; }
.story-copy p { color: var(--muted); font-size: 18px; line-height: 1.65; }
.story-copy p + p { margin-top: 24px; }
.story-copy .story-lead { color: var(--ink); font-size: 26px; font-weight: 500; line-height: 1.35; letter-spacing: -.02em; }

@media(max-width:1050px) and (min-width:761px) {
  .nav-wrap { gap: 18px; width: calc(100% - 48px); }
  .desktop-nav { gap: 18px; margin-left: 0; }
  .story-layout { gap: 48px; }
  .professional-layout { gap: 36px; }
  .professional-copy h2 { font-size: 59px; }
  .professional-copy .professional-lead { font-size: 21px; }
  .professional-visual { padding: 30px 21px 24px; }
  .professional-profile { padding: 21px; }
  .professional-profile h3 { font-size: 22px; }
  .professional-request { margin-left: 8px; padding: 16px; }
  .professional-find { gap: 20px; padding: 26px; }
}
@media(max-width:760px) {
  .professional-layout { grid-template-columns: minmax(0,1fr); gap: 38px; }
  .professional-copy h2 { font-size: 62px; }
  .professional-copy .professional-lead { font-size: 23px; }
  .professional-copy .professional-description { font-size: 16px; max-width: 460px; }
  .professional-visual { padding: 32px 26px 25px; max-width: 480px; width: 100%; margin-inline: auto; border-radius: 27px; }
  .professional-profile { padding: 22px; }
  .professional-profile h3 { font-size: 24px; }
  .professional-request { margin-left: 12px; padding: 16px; }
  .professional-start { margin-top: 52px; }
  .professional-start>h3 { font-size: 29px; }
  .professional-steps { grid-template-columns: minmax(0,1fr); gap: 25px; margin-top: 26px; }
  .professional-steps li { padding-top: 18px; }
  .professional-steps h4 { font-size: 22px; margin-top: 8px; }
  .professional-steps p { margin-top: 10px; }
  .professional-find { display: grid; grid-template-columns: minmax(0,1fr); gap: 18px; padding: 26px; margin-top: 32px; }
  .professional-find .button { justify-self: start; }
}
@media(max-width:400px) {
  .professional-visual { padding: 27px 20px 22px; }
  .professional-profile { padding: 19px; border-radius: 21px; }
  .professional-profile h3 { font-size: 21px; }
  .professional-request { margin-left: 0; padding: 14px; gap: 9px; }
  .professional-request strong { font-size: 12px; }
  .professional-card-heading { font-size: 11px; }
  .professional-start>h3 { font-size: 27px; }
}

@media(max-width:1190px) and (min-width:761px) {
  .hero-cinema .hero-copy { padding-top: 62px; }
  .hero-cinema h1 { font-size: 76px; }
  .hero-cinema .hero-description { font-size: 20px; max-width: 390px; }
  .use-case-panel { gap: 36px; padding: 35px; }
  .use-case-copy h3 { font-size: 35px; }
  .example-browser { padding: 20px; }
  .step { padding: 18px 20px 28px; }
  .step h3 { font-size: 22px; }
  .confidence h2 { font-size: 48px; }
  .confidence-inner { gap: 55px; }
}
@media(max-width:760px) {
  .nav-wrap { height: 66px; }
  .mobile-nav { text-align: right; }
  .hero-cinema { top: auto; height: 1020px; }
  .hero-cinema .hero-copy { padding-top: 44px; }
  .hero-cinema .eyebrow { font-size: 16px; }
  .hero-cinema h1 { font-size: clamp(52px, 12.4vw, 78px); margin-top: 17px; letter-spacing: -.055em; }
  .hero-cinema .hero-description { font-size: 19px; line-height: 1.4; max-width: 340px; margin-top: 22px; }
  .hero-cinema .hero-description .desktop-break { display: block; }
  .hero-cinema .hero-actions { gap: 12px; margin-top: 25px; }
  .hero-actions .button { font-size: 14px; padding: 11px 22px; min-height: 44px; }
  .hero .purpose-strip { gap: 15px; padding-block: 25px; }
  .purpose-strip>span { font-size: 10px; font-weight: 500; }
  .section-pad { padding-block: 76px; }
  .section-heading .eyebrow, .confidence .eyebrow, .faq-intro .eyebrow, .closing .eyebrow { font-size: 15px; margin-bottom: 18px; }
  .section-heading h2, .faq-intro h2 { font-size: 43px; }
  .section-heading>p:last-child:not(.eyebrow) { font-size: 17px; line-height: 1.5; }
  .mode-tabs { margin: 33px auto; }
  .mode-tabs button { font-size: 11px; padding: 12px 10px; }
  .use-case-panel { padding: 28px 20px 20px; border-radius: 26px; gap: 28px; }
  .use-case-copy { padding: 0; }
  .use-case-copy h3 { font-size: 34px; }
  .use-case-copy>p { font-size: 15px; }
  .example-browser { padding: 20px; border-radius: 20px; }
  .example-text strong { font-size: 11px; }
  .example-card { padding: 15px 12px; gap: 9px; }
  .example-card>.icon { display: none; }
  .example-price { font-size: 11px; }
  .section-heading.left { text-align: left; }
  .steps { gap: 20px; margin-top: 35px; }
  .step { padding: 20px 24px 30px; }
  .step-visual { height: 235px; margin-bottom: 24px; }
  .step h3 { font-size: 25px; }
  .step>p { font-size: 15px; }
  .confidence-inner { padding-block: 76px; gap: 40px; }
  .confidence h2 { font-size: 45px; }
  .confidence-copy>p:last-child { font-size: 17px; }
  .confidence-features h3 { font-size: 17px; }
  .confidence-features p { font-size: 15px; }
  .story-layout { grid-template-columns: 1fr; gap: 32px; }
  .story-copy p { font-size: 17px; }
  .story-copy .story-lead { font-size: 23px; }
  .faq-intro>p:last-child { font-size: 16px; }
  summary { font-size: 15px; }
  details>p { font-size: 14px; }
  .closing { padding-block: 75px; }
  .closing h2 { font-size: 61px; }
  .closing-icon { width: 72px; height: 72px; }
  .closing p:not(.eyebrow) { font-size: 17px; max-width: 320px; }
  .site-footer>p { font-size: 10px; }
}
@media(max-width:400px) {
  .hero-cinema { height: 920px; }
  .hero-cinema .hero-copy { padding-top: 35px; }
  .hero-cinema h1 { font-size: clamp(44px,13vw,52px); }
  .hero-cinema .hero-description { font-size: 17px; }
  .hero-cinema .hero-actions { gap: 10px; }
  .scene-device { top: 430px; }
  .section-heading h2, .faq-intro h2 { font-size: 37px; }
  .use-case-panel { padding: 25px 16px 16px; }
  .mode-tabs button { padding: 10px 6px; }
  .example-browser { padding: 18px 14px; }
  .example-card .task-icon { width: 29px; height: 34px; }
  .example-text strong { font-size: 11px; }
  .example-text small { font-size: 8px; }
  .example-price { font-size: 10px; padding: 4px; }
  .closing h2 { font-size: 53px; }
}
@media(prefers-reduced-motion:reduce) { .hero-cinema { top: auto; } }
@media(prefers-reduced-transparency:reduce) { .site-header { background: var(--surface); } }

button.text-link { background: none; border: 0; padding: 0; text-align: left; }

/* Reserve every scenario's footprint so the typewriter never shifts the layout. */
.use-case-copy .typewriter-title { display: grid; text-wrap: wrap; }
.typewriter-title > span { grid-area: 1 / 1; min-width: 0; white-space: nowrap; }
.typewriter-sizer { visibility: hidden; pointer-events: none; }
.typewriter-title.is-typing .typewriter-copy:after {
 content: ""; display: inline-block; width: 2px; height: .8em;
 margin-left: .04em; vertical-align: -.03em; background: #f5f5f7;
}

/* A complete use-case frame at the section's scroll stop. */
@media (min-width: 761px) {
 .possibilities { min-height: calc(100svh - 88px); padding-block: 24px; display: flex; align-items: center; }
 .possibilities .section-heading h2 { font-size: clamp(38px, 4vw, 54px); }
 .possibilities .section-heading > p:last-child { font-size: 16px; line-height: 1.4; margin-top: 12px; }
 .possibilities .mode-tabs { margin-block: 18px 22px; padding: 3px; gap: 3px; border-radius: 20px; }
 .possibilities .mode-tabs button { min-height: 34px; padding: 8px 12px; gap: 5px; font-size: 11px; line-height: 1.2; border-radius: 16px; }
 .possibilities .mode-tabs button .icon { width: 13px; height: 13px; }
 .possibilities .use-case-panel { min-height: 0; padding: 24px; gap: 32px; }
 .possibilities .use-case-copy h3 { font-size: clamp(26px, 2.6vw, 34px); }
 .possibilities .use-case-details > #feature-description { font-size: 14px; line-height: 1.45; margin-top: 28px; }
 .possibilities .feature-list { font-size: 12px; margin: 24px 0 6px; }
 .possibilities .feature-list li { margin-block: 10px; }
 .possibilities .text-link { font-size: 13px; min-height: 40px; }
 .possibilities .example-browser { min-height: 0; padding: 18px; }
 .possibilities .example-header { margin-bottom: 14px; }
 .possibilities .example-list { gap: 10px; }
 .possibilities .example-card { padding: 13px 12px; gap: 10px; }
 .possibilities .example-card .task-icon { width: 32px; height: 34px; }
 .possibilities .example-caption { margin-top: 10px; }
}

/* Source: dark-theme.css */
/* Black canvas, white typography, and quiet silver highlights. */
:root {
  color-scheme: dark;
  --canvas: #000;
  --canvas-top: #19191b;
  --surface: #101012;
  --surface-lower: #17171a;
  --input: #202023;
  --track: #161618;
  --ink: #f5f5f7;
  --muted: #b9bbc2;
  --accent: #fff;
  --accent-dark: #dedee3;
  --paper: #000;
  --soft: #202023;
  --line: #333338;
  --icon-red: #ff6975;
  --icon-green: #70d397;
  --icon-orange: #f6b46d;
  --icon-blue: #7bb5ff;
  --icon-purple: #ba98ff;
  --icon-teal: #6cd9df;
  --glass: #080809;
  --glass-rim: #ffffff30;
  --glass-shadow: 0 20px 48px -24px #000, inset 0 1px 0 #ffffff0d;
  --text-gradient: linear-gradient(165deg, #fff 15%, #f4f5f7 40%, #d4d7dd 68%, #969ca6 100%);
}

body { color: var(--ink); background: #000; }
::selection { color: #000; background: #eee; }
.site-header { background: #000000d9; border-bottom: 1px solid #ffffff14; }
.brand, .desktop-nav a, .mobile-nav a, .text-link { color: var(--ink); }
.desktop-nav a:hover, .text-link:hover { color: #fff; }
.mobile-nav { background: #000; }
.button, .mini-publish { background: #f5f5f7; color: #080809; }
.button:hover { background: #dcdce1; }
.button:active { background: #c9cbd1; }
.button .icon, .mini-publish .icon { color: inherit; }
.button.button-outline { color: #fff; background: #000; border-color: #74747c; }
.button.button-outline:hover { color: #000; background: #fff; border-color: #fff; }
.skip-link { color: #000; background: #fff; }
button:focus-visible, a:focus-visible, summary:focus-visible, [tabindex]:focus-visible { outline-color: #d9e4ff; }

.hero, .hero .purpose-strip, .possibilities, .professionals, .confidence, .our-story, .closing { color: var(--ink); background: #000; }
.scene-light { background: radial-gradient(ellipse at 50% 40%, #161619 0%, #060607 42%, #000 75%); }
.scene-light:after { background: linear-gradient(0deg, #000, transparent 24%, transparent 78%, #000); }
.scene-ring { border-color: #ffffff29; box-shadow: none; }
.scene-grid { background-image: linear-gradient(#ffffff12 1px, transparent 1px), linear-gradient(90deg, #ffffff12 1px, transparent 1px); }
.hero-cinema .hero-description, .hero .eyebrow, .cinema-footer, .purpose-strip>span { color: var(--muted); }
.little-dot { background: #fff; }
.device-edge img, .device-edge video, .phone img { filter: none; background: #000; }

.scene-card, .floating-note { color: #fff; background: #000; border-color: #ffffff38; box-shadow: 0 22px 50px -22px #000, inset 0 1px 0 #ffffff10; }
.card-chat { opacity: 1; }
.scene-card small, .note-eyebrow, .note-meta, .note-done div>span { color: #c1c3c9; }
.scene-card-icon, .note-icon { background: #17171a; color: #fff; }
.card-done .scene-card-icon { background: #10291b; color: var(--icon-green); }
.motion-toggle { color: #e5e5e9; background: #000; border-color: #49494e; }

.icon:has(use[href="#pin"]) { color: var(--icon-red); }
.icon:has(use[href="#heart"]), .icon:has(use[href="#bookmark"]) { color: var(--icon-purple); }
.icon:has(use[href="#box"]), .icon:has(use[href="#bag"]), .icon:has(use[href="#clock"]) { color: var(--icon-orange); }
.icon:has(use[href="#chat"]), .icon:has(use[href="#lock"]) { color: var(--icon-blue); }
.icon:has(use[href="#tools"]) { color: var(--icon-teal); }
.icon:has(use[href="#check"]), .icon:has(use[href="#leaf"]), .icon:has(use[href="#plus"]) { color: var(--icon-green); }

/* Keep small copy solid; the larger lettering carries the white gradient. */
.hero-cinema h1, h2, .use-case-copy h3 { color: #fff; }
.hero-cinema h1 span { background: none; color: inherit; }
.section-heading h2 span, .how h2 span, .confidence h2 span { color: inherit; }
@supports (background-clip: text) or (-webkit-background-clip: text) {
  .hero-cinema h1, h2, .use-case-copy h3 {
    background-image: var(--text-gradient);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
  }
  .hero-cinema h1 span { background: none; color: inherit; -webkit-text-fill-color: inherit; }
}

.section-heading .eyebrow, .feature-kicker, .example-header>span:last-child, .example-text small,
.example-caption, .feature-list, .step-number, .mini-label, .mini-request>div, .chat-person small,
.mini-complete>span:last-child, .confidence .eyebrow, .confidence-copy>p:last-child, .confidence-features p,
.faq-intro .eyebrow, .closing .eyebrow, .closing p:not(.eyebrow), .closing-note,
.site-footer>p, .site-footer>div { color: var(--muted); }
.professionals, .confidence, .our-story, .closing { border-top: 1px solid #1c1c20; }
.mode-tabs { background: var(--track); border: 1px solid var(--line); }
.mode-tabs button { color: #c4c5ca; }
.mode-tabs button:hover { color: #fff; }
.mode-tabs button[aria-selected=true] { color: #000; background: #f5f5f7; box-shadow: none; }
.mode-tabs button[aria-selected=true] .icon { color: inherit; }
.use-case-panel, .step, .professional-find { background: var(--surface); box-shadow: inset 0 0 0 1px #ffffff12; }
.example-browser, .professional-visual { background: linear-gradient(145deg, #202023, #111113); }
.example-card { background: #080809; border-color: #333338; box-shadow: none; }
.example-card:hover { border-color: #777780; box-shadow: 0 10px 24px #0004; }
.example-card .task-icon, .example-card:nth-child(2) .task-icon, .example-card:nth-child(3) .task-icon { background: #1c1c20; }
.example-price { color: #fff; background: #26262b; }
.example-card>.icon { color: #c1c3ca; }
.step-visual { background: #000; border: 1px solid #29292e; }
.mini-request, .incoming { background: #18181b; border-color: #36363c; box-shadow: var(--glass-shadow); }
.mini-request>div>span, .professional-profile-details dd>span { background: #29292f; }
.avatar, .professional-avatar { color: #fff; background: #303038; }
.outgoing { color: #fff; background: #303038; }
.complete-icon { background: #14261b; box-shadow: 0 0 0 10px #102017; }
.trust-icon { background: #19191d; border-color: #333338; }
.professional-profile, .professional-request { background: #000; border-color: #ffffff30; box-shadow: var(--glass-shadow); }
.professional-steps li { border-color: #48484f; }
.professional-request-icon, .professional-find-icon { background: #1d222c; }
.faq-plus:before, .faq-plus:after { background: #ddd; }
.site-footer { border-top: 1px solid #242428; }

dialog { color: var(--ink); background: #101012; border-color: #424248; box-shadow: 0 30px 100px #000b; }
dialog::backdrop { background: #000b; }
.dialog-close { color: #fff; background: #2b2b31; }
.dialog-tag, .dialog-disclaimer, .dialog-facts dt { color: var(--muted); }
.dialog-icon { background: #222228; }
.dialog-facts { background: #1b1b20; }
.dialog-facts>div+div { border-color: #39393f; }
.save-button { color: #fff; }
.save-button[aria-pressed=true] .icon { fill: var(--icon-purple); }

@media (prefers-reduced-transparency: reduce) {
  .site-header, .scene-card, .floating-note, .motion-toggle { background: #000; backdrop-filter: none; }
}
@media (prefers-contrast: more) {
  :root { --muted: #eee; --line: #8d8d95; }
  .hero-cinema h1, .hero-cinema h1 span, h2, .use-case-copy h3 { background: none; color: #fff; -webkit-text-fill-color: currentColor; }
  .hero-cinema .hero-description, .cinema-footer, .eyebrow, .feature-kicker, .example-caption, .closing-note { color: #eee; }
  .scene-card, .example-card, .professional-profile, .professional-request { border-color: #999; }
}
@media (forced-colors: active) {
  .hero-cinema h1, .hero-cinema h1 span, h2, .use-case-copy h3 { background: none; color: CanvasText; -webkit-text-fill-color: currentColor; }
}

/* Source: phones.css */
/* A continuous titanium sidewall, polished bezel and glass above the display. */
.scene-world { perspective: 1200px; }
.scene-device { --phone-radius: 44px; }
/* Independent transforms keep the idle float separate from scroll departure. */
@media (prefers-reduced-motion:no-preference) {
  .scene-device {
    --phone-float-distance:12px; --phone-float-roll:.75deg;
    animation:phone-idle-float 9s ease-in-out infinite paused;
  }
  .device-front { animation-duration:11s; animation-delay:-5.5s; }
  .scene-device.phone-float-active { animation-play-state:running; }
  .hero-cinema.phones-departing .scene-device { animation-play-state:paused; }
  @keyframes phone-idle-float {
    0%,100% { translate:0 var(--phone-float-distance); rotate:calc(-1 * var(--phone-float-roll)); }
    50% { translate:0 calc(-1 * var(--phone-float-distance)); rotate:var(--phone-float-roll); }
  }
}
@media (max-width:760px) and (prefers-reduced-motion:no-preference) {
  .scene-device { --phone-float-distance:8px; --phone-float-roll:.65deg; }
}
.device-shell { position: absolute; inset: 0; border-radius: var(--phone-radius); transform-style: preserve-3d; }
.device-shell span {
  position: absolute; inset: 0; border-radius: inherit;
  transform: translateZ(calc(var(--layer) * -.85px));
  background: linear-gradient(124deg, #b1b5bb 0%, #d7d9dc 3%, #767c84 10%, #434950 24%, #25292f 43%, #474c53 66%, #9a9fa5 85%, #d0d3d7 94%, #666c74 100%);
}
.device-shell span:first-child {
  background: #202329;
  box-shadow: inset 0 0 0 1px #a5aab1, inset 0 0 0 2px #42474f, 12px 38px 50px -10px #000d, 1px 4px 6px #000b;
}
.device-shell span:nth-child(2), .device-shell span:last-child { box-shadow: inset 0 0 0 1px #d7dce070; }
.device-edge {
  padding: 7px; border-radius: var(--phone-radius); transform: translateZ(1px);
  background: linear-gradient(135deg, #f0f1f3 0%, #adb2b9 4%, #3f454d 11%, #11151b 35%, #1d2229 62%, #6d747d 86%, #c6cbd1 95%, #555c65);
  box-shadow: inset 0 0 0 .7px #e8ebf1a6, inset 0 0 0 1.7px #626973, inset 0 0 0 3px #080a0e, 0 1px 2px #000;
}
.device-edge:after {
  inset: 3px; border: 1px solid #ffffff21; border-radius: calc(var(--phone-radius) - 3px);
  box-shadow: inset 1px 1px 1px #ffffff1a, inset -1px -1px 1px #000c;
}
.device-display { position: relative; overflow: hidden; isolation: isolate; border-radius: calc(var(--phone-radius) - 7px); background: #020305; }
.device-edge .app-screen { border-radius: inherit; aspect-ratio: 1206/2622; object-fit: cover; }
/* Tint only the existing glyphs, at the native app's rhythm. */
.app-notification-pulse {
  position:absolute; top:90.92296%; left:28.85572%; width:9.95025%; height:3.96644%;
  overflow:hidden; z-index:2; pointer-events:none;
}
.app-notification-pulse.notification-1 { left:63.68159%; }
.notification-red { animation:app-notification-red 2.4s ease-in-out infinite alternate paused; }
.notification-pulse-visible .notification-red { animation-play-state:running; }
.motion-paused .notification-red { animation-play-state:paused; }
@keyframes app-notification-red {
  from { opacity:0; }
  to { opacity:1; }
}
@media (prefers-reduced-motion:reduce), (prefers-reduced-data:reduce) {
  .app-notification-pulse { display:none; }
  .notification-red { animation:none; }
}
/* Keep cached HTML fallback phones free of screen reflections too. */
.device-gloss { display:none; }
.device-camera {
  position: absolute; left: 34.35%; top: 1.56%; width: 31.3%; height: 4.3%; border-radius: 30px; z-index: 3;
  background: linear-gradient(160deg, #08090c, #010103 60%);
  box-shadow: 0 0 0 .5px #ffffff14, inset 0 1px 1px #ffffff0d;
}
.device-camera span {
  position: absolute; right: 9%; top: 25%; height: 50%; aspect-ratio: 1; border-radius: 50%;
  background: radial-gradient(circle at 37% 30%, #a8b8d65c 0 6%, #2c3a564d 12%, #0c1423 25%, #030509 40%, #1d293c 55%, #080a10 65%);
  box-shadow: 0 0 0 1px #020305, 0 0 2px 1px #ffffff07;
}
.device-earpiece {
  position: absolute; left: 43%; top: 2px; width: 14%; height: 1.5px; border-radius: 3px;
  background: #020304; box-shadow: 0 1px 0 #ffffff1a;
}
.device-key {
  position: absolute; width: 11px; border: .6px solid #9ca3ad; border-radius: 3px;
  background: linear-gradient(90deg, #20252c, #818994 22%, #a2a9b2 40%, #545c67 64%, #2c323a);
  box-shadow: inset 0 1px 1px #e4e8ef8c, inset 0 -1px 1px #000c, 0 1px 2px #000b;
}
.key-power { right: -6px; top: 28%; height: 66px; transform: translateZ(-10px) rotateY(90deg); }
.key-volume-up, .key-volume-down, .key-action { left: -6px; transform: translateZ(-10px) rotateY(90deg); }
.key-action { top: 16%; height: 24px; }
.key-volume-up { top: 25%; height: 43px; }
.key-volume-down { top: 35%; height: 43px; }
.device-antenna { position: absolute; top: 13%; width: 19px; height: 2px; background: #33373e; box-shadow: 0 1px 0 #c0c4cb40; }
.antenna-left { left: -9px; transform: translateZ(-10px) rotateY(90deg); }
.antenna-right { right: -9px; transform: translateZ(-10px) rotateY(90deg); }
.device-port { position: absolute; left: 42%; bottom: -4px; width: 16%; height: 8px; border-radius: 5px; transform: translateZ(-10px) rotateX(90deg); background: #080b0f; box-shadow: 0 0 0 1px #949ca775, inset 0 1px 2px #000; }
.device-port:after { content: ""; position: absolute; left: 18%; right: 18%; top: 3px; height: 2px; border-radius: 2px; background: #434a54; }
.device-back { transform: translate3d(0,0,-100px) rotateX(13deg) rotateY(-24deg) rotateZ(-13deg); }
.device-front { transform: translate3d(0,55px,45px) rotateX(10deg) rotateY(26deg) rotateZ(12deg); }
@media (min-width:1191px) and (max-width:1699px) {
  .device-back { margin-left: -570px; }
  .device-front { margin-left: 300px; }
}
@media (max-width:760px) {
  .scene-world { perspective: 950px; }
  .scene-device { --phone-radius: 38px; }
  .device-back { transform: translate3d(0,0,-65px) rotateX(10deg) rotateY(-20deg) rotateZ(-10deg); }
  .device-front { transform: translate3d(0,-30px,30px) rotateX(8deg) rotateY(22deg) rotateZ(10deg); }
  .key-power { height: 48px; }
  .key-volume-up, .key-volume-down { height: 32px; }
  .key-action { height: 18px; }
}
@media (max-width:400px) { .scene-device { --phone-radius: 35px; } }

/* The fallback keeps its layout so the 3D renderer follows the same springs. */
.phone-render { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; visibility: hidden; }
.phone-render-ready .phone-render { visibility: visible; }
.phone-render-ready .scene-device { visibility: hidden; }

/* Fit the complete mobile composition inside the first, toolbar-safe viewport. */
@media (max-width:760px) {
  .hero-cinema { height: calc(100svh - 67px); min-height: 0; }
  .hero-cinema .hero-copy { padding-top: clamp(14px, 3svh, 26px); }
  .hero-cinema h1 { font-size: clamp(34px, 10.8vw, 52px); margin-top: 0; }
  .hero-cinema .hero-description { font-size: 16px; margin-top: 14px; line-height: 1.4; }
  .scene-world, .scene-cards {
    inset: auto; top: var(--mobile-scene-top, 190px); left: 50%;
    width: 360px; height: 430px; margin-left: -180px;
    transform: scale(var(--mobile-scene-scale, .8)); transform-origin: 50% 0;
    perspective-origin: 50% 50%;
  }
  .scene-device { width: 150px; top: 45px; --phone-radius: 28px; }
  .device-back { margin-left: -143px; }
  .device-front { margin-left: -25px; top: 55px; }
  .scene-card { padding: 9px 11px; gap: 7px; border-radius: 14px; }
  .scene-card strong { font-size: 12px; }
  .scene-card small { font-size: 6px; }
  .scene-card-icon, .card-done .scene-card-icon { width: 26px; height: 28px; }
  .scene-card-icon .icon { width: 17px; height: 17px; }
  .scene-price { font-size: 16px; margin-left: 5px; }
  .card-help { top: 235px; margin-left: -145px; }
  .card-chat { display: flex; top: 22px; margin-left: -20px; }
  .card-done { top: 365px; margin-left: -38px; }
  .card-done small { font-size: 7px; }
}

/* Keep the entire phone inside the stage throughout the desktop scroll. */
@media (min-width:761px) {
 .scene-device { width: min(260px, calc((100svh - 76px) * .32)); }
}
@media (min-width:761px) and (max-width:1190px) {
 .scene-device { width: min(225px, calc((100svh - 76px) * .32)); }
}

/* Source: professionals.css */
/* A focused spotlight for the people behind the skills. */
.hero-cinema .hero-description { max-width: 500px; margin-inline: auto; font-size: 18px; line-height: 1.5; text-wrap: pretty; }
.professionals { position: relative; overflow: clip; background: radial-gradient(ellipse at 76% 24%, #17302b66, transparent 48%), #000; }
.professionals:before { content: ''; position: absolute; inset: 0 8% auto; height: 1px; background: linear-gradient(90deg, transparent, #c9f0e9aa, transparent); }
.professional-label { display: inline-flex; gap: 10px; align-items: center; color: #b7e8db; }
.professional-label span { font-size: 24px; }
.professional-copy h2 { font-size: clamp(38px, 4.8vw, 68px); }
.professional-copy .professional-lead { max-width: 390px; font-size: 27px; }
.professional-visual { background: radial-gradient(ellipse at 50% 20%, #9fe6d025, transparent 70%); border: 1px solid #c9f0e925; padding-top: 54px; box-shadow: 0 0 90px -45px #91ddc6; }
.professional-profile { background: linear-gradient(135deg, #252c2b, #0c1010 65%); border-color: #bce9dc66; box-shadow: 0 28px 65px #000a, inset 0 1px 0 #ffffff50; }
.professional-avatar { color: #defbf1; background: linear-gradient(135deg, #598e7d, #1b4135); box-shadow: 0 0 0 5px #aee9d410; }
.professional-request { background: linear-gradient(120deg, #172621, #080d0b); border-color: #abebd866; box-shadow: 0 18px 40px #0009, 0 0 28px -12px #a3edce66; }
.professional-profile-details dd>span { background: #aee9d410; border: 1px solid #aee9d420; }
.professional-step-number { color: #b7e8db; }
.professional-steps li { border-image: linear-gradient(90deg, #b7e8db80, #ffffff15) 1; }
.professional-find { border: 1px solid #aee9d425; background: linear-gradient(120deg, #17201d, #101012); }
@media (hover:hover) and (prefers-reduced-motion:no-preference) {
 .professional-profile, .professional-request { transition: transform .5s ease, box-shadow .5s ease; }
 .professional-visual:hover .professional-profile { transform: rotate(-1deg) translateY(-5px); }
 .professional-visual:hover .professional-request { transform: rotate(1deg) translateY(-2px); }
}
@media(max-width:760px) {
 .hero-cinema .hero-description { font-size: 14px; max-width: 340px; line-height: 1.4; }
 .professional-copy h2 { font-size: clamp(48px, 12vw, 68px); }
 .professional-copy .professional-lead { font-size: 23px; }
 .professional-visual { padding-top: 36px; }
}

/* Store actions sit directly on the black canvas. */
.app-downloads { gap: 18px 42px; }
.closing .store-download, .closing .store-download:hover, .closing .store-download:active {
 color: #fff; background: transparent; border: 0; border-radius: 0;
 box-shadow: none; padding: 12px 0; min-width: 0; gap: 12px;
}
.store-download .store-logo { width: 28px; height: 30px; flex: 0 0 auto; }
.closing .store-download:hover { opacity: .78; }

/* Compact store actions beneath the introduction. */
.hero-downloads { margin-top: 12px; gap: 8px 22px; }
.hero-cinema .hero-downloads .store-download,
.hero-cinema .hero-downloads .store-download:hover,
.hero-cinema .hero-downloads .store-download:active {
 pointer-events: auto; color: #fff; background: transparent;
 border: 0; border-radius: 0; box-shadow: none; min-width: 0;
 min-height: 44px; padding: 6px 0; gap: 6px; font-size: 11px;
}
.hero-downloads .store-download .store-logo { width: 16px; height: 18px; }
.hero-cinema .hero-downloads .store-download:hover { opacity: .78; }
@media (max-width:760px) {
 .hero-downloads { margin-top: 5px; gap: 6px 18px; }
 .hero-cinema .hero-downloads .store-download { font-size: 10px; }
 .hero-downloads .store-download .store-logo { width: 15px; height: 17px; }
}

.app-downloads .browser-download-row { flex-basis: 100%; display: flex; justify-content: center; }
.hero-downloads .browser-download-row { margin-top: -8px; }

.professional-identity:first-child { margin-top: 0; }

/* Reserve the same text space so profile changes do not move the scroll stop. */
.professional-profile [data-professional-title] { white-space: pre-line; min-height: 2lh; }
.professional-profile [data-professional-experience] { min-height: 2lh; }
@media (max-width: 760px) {
 .professional-profile [data-professional-services] { min-height: 62px; align-content: flex-start; align-items: flex-start; }
}

/* Keep the professional profile within the desktop frame. */
@media (min-width: 761px) {
 .professionals { min-height: calc(100svh - 88px); display: flex; align-items: center; padding-block: 24px; }
 .professional-layout { gap: 40px; }
 .professional-visual { width: 100%; max-width: 440px; margin-inline: auto; padding: 20px 18px 18px; border-radius: 28px; }
 .professional-profile { padding: 16px; border-radius: 21px; }
 .professional-identity { margin-top: 12px; gap: 10px; }
 .professional-avatar { width: 40px; height: 40px; font-size: 20px; }
 .professional-profile h3 { font-size: 22px; margin-top: 12px; }
 .professional-profile-details { margin-top: 12px; }
 .professional-profile-details > div + div { margin-top: 10px; }
 .professional-profile-details dt { margin-bottom: 3px; }
 .professional-profile-details dd { font-size: 12px; line-height: 1.4; }
 .professional-profile-details dd > span { padding: 4px 6px; font-size: 10px; }
 .professional-request { margin: -5px -4px 0 18px; padding: 10px 12px; gap: 9px; border-radius: 17px; }
 .professional-request-icon { width: 32px; height: 32px; }
 .professional-request strong { font-size: 12px; }
 .professional-request p { font-size: 10px; }
 .professional-start { margin-top: 22px; }
 .professional-steps { margin-top: 0; gap: 28px; }
 .professional-steps li { padding-top: 0; }
 .professional-steps h4 { font-size: 19px; margin: 0; }
 .professional-steps p { font-size: 14px; line-height: 1.45; margin-top: 8px; }
}

@media (min-width:761px) {
 .professional-copy .professional-description { max-width:none; width:100%; }
}

@media (min-width:761px) {
 .confidence-copy > p:last-child { max-width:none; width:100%; }
}

/* Source: atmosphere.css */
/* A persistent misty silhouette below the opaque opening scene. */
body { isolation: isolate; }
.scene-light { background: #000; }
.brand-atmosphere { position: fixed; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; }
.atmosphere-mark {
 position: absolute; left: 50%; top: 49%; width: min(1400px, 125vw);
 transform: translate(-50%, -50%); transform-origin: center;
}
.atmosphere-mark svg { display: block; width: 100%; height: auto; overflow: visible; }
.atmosphere-logo { filter: blur(24px); opacity: .035; animation: logo-breathe 14s ease-in-out infinite; }
.atmosphere-bloom { filter: blur(85px); opacity: .045; animation: logo-bloom 14s ease-in-out infinite; }
.atmosphere-fog {
 position: absolute; inset: -20%; filter: blur(38px); opacity: .055;
 background: radial-gradient(ellipse at 24% 60%, #dce2ea 0%, transparent 38%), radial-gradient(ellipse at 76% 33%, #cdd5df 0%, transparent 32%);
 animation: mist-drift 24s ease-in-out infinite alternate;
}
.atmosphere-fog-far {
 opacity: .035; transform: rotate(180deg);
 background: radial-gradient(ellipse at 38% 70%, #e9edf1 0%, transparent 42%);
 animation: mist-drift-far 31s ease-in-out infinite alternate;
}
@keyframes logo-breathe {
 0%, 100% { opacity: .025; transform: translate(-50%, -50%) scale(.98); }
 50% { opacity: .055; transform: translate(-50%, -50%) scale(1.035); }
}
@keyframes logo-bloom {
 0%, 100% { opacity: .035; transform: translate(-50%, -50%) scale(1.02); }
 50% { opacity: .075; transform: translate(-50%, -50%) scale(1.085); }
}
@keyframes mist-drift {
 from { transform: translate3d(-3%, 2%, 0) scale(1); }
 to { transform: translate3d(4%, -3%, 0) scale(1.06); }
}
@keyframes mist-drift-far {
 from { transform: translate3d(4%, -2%, 0) rotate(180deg); }
 to { transform: translate3d(-4%, 3%, 0) rotate(180deg) scale(1.08); }
}
.brand-atmosphere.is-paused > div { animation-play-state: paused; }
@media (max-width:760px) {
 .atmosphere-mark { width: 165vw; top: 50%; }
 .atmosphere-logo { filter: blur(16px); }
 .atmosphere-bloom { filter: blur(48px); }
 .atmosphere-fog { filter: blur(24px); }
}
@media (prefers-reduced-motion: reduce) {
 .brand-atmosphere > div { animation: none; }
}
@media (prefers-contrast: more) {
 .brand-atmosphere { display: none; }
}

/* Let the lower page share one backdrop, without section rules. */
.possibilities, .confidence, .our-story, .closing { background: transparent; }
.possibilities { background: linear-gradient(#000, transparent 160px); }
.professionals { background: radial-gradient(ellipse at 76% 24%, #17302b40, transparent 48%); }
.site-header, .mobile-nav, .hero .purpose-strip, main > section, .professionals, .confidence, .our-story, .closing, .site-footer,
.faq-list, .faq-list details, .professional-steps li, .dialog-facts > div + div {
 border-top: 0; border-bottom: 0; border-image: none;
}
.professionals:before { content: none; }

/* Source: reveal.css */
/* Hold the next section behind the phones, fade it in, then release it into page flow. */
@media (prefers-reduced-motion: no-preference) {
 .has-scene-motion main { overflow-anchor: none; }
 .has-scene-motion .hero {
  position: relative; z-index: 2; overflow: visible;
  background: transparent; pointer-events: none;
 }
 .has-scene-motion .hero-story {
  /* Give the outward movement several screenfuls of native scrolling. */
  height: calc(100svh + clamp(2000px, 280svh, 3000px)); min-height: 0;
 }
 .has-scene-motion .hero-cinema { position: sticky; top: var(--scene-header, 64px); }
 .has-scene-motion .scene-light { opacity: var(--scene-backdrop, 1); }
 .has-scene-motion .hero-copy { opacity: var(--scene-copy, 1); }
 .has-scene-motion .scene-world, .has-scene-motion .scene-cards { opacity: var(--scene-trailing, 1); }
 .has-scene-motion .reveal-track {
  position: relative; z-index: 1;
  margin-top: calc(var(--reveal-top, -70px) - var(--reveal-story-height, calc(100svh + 900px)));
  height: calc(var(--reveal-content-height, 1000px) + var(--reveal-range, 964px));
  scroll-margin-top: calc(var(--reveal-pin-top, 0px) - var(--reveal-range, 964px) - var(--page-scroll-padding, 88px));
 }
 .has-scene-motion .possibilities {
  position: sticky; top: var(--reveal-pin-top, 0px);
  opacity: var(--reveal-opacity, 0);
  background: transparent; will-change: opacity;
 }
}
@media (max-width: 760px) and (prefers-reduced-motion: no-preference) {
 .has-scene-motion .hero-story { height: calc(100svh + clamp(1600px, 260svh, 2300px)); }
 .has-scene-motion .hero-cinema { top: var(--scene-header, 66px); }
 /* On phones the next section follows the entire phone scene in normal
    flow, entering from below instead of sharing its sticky viewport. */
 .has-scene-motion .reveal-track {
  margin-top: 0; height: auto; scroll-margin-top: 0;
 }
 .has-scene-motion .possibilities {
  position: relative; top: auto; opacity: 1; will-change: auto;
 }
}

/* Source: bloom.css */
/* Reference materials: luminous white lettering, frosted silver, charcoal glass. */
:root {
  --ink: #f9f9fd;
  --muted: #d1d3dd;
  --icon-red: #ff3049;
  --icon-blue: #2479ff;
  --icon-orange: #ff841f;
  --icon-teal: #40cbd9;
  --text-gradient: linear-gradient(165deg, #fff 10%, #fbfbff 48%, #d4d8e5 100%);
  --silver-surface: radial-gradient(ellipse at 8% 0%, #fff, #ffffff70 28%, transparent 65%),
    linear-gradient(118deg, #f4f2fb 0%, #e2e1ec 35%, #cdd0dd 70%, #f0eff7 100%);
  --silver-glow: inset 0 1px 2px #ffffffc9, inset 0 -1px 2px #ffffff80,
    0 0 4px #ffffff80, 0 0 18px #e5eaff40,
    0 0 40px #dbe5ff1a, 0 18px 38px #0007;
  --charcoal-glass: radial-gradient(ellipse at 12% 0%, #c2cbe57a, transparent 52%),
    linear-gradient(135deg, #343a46ee, #171b23f5 58%, #080b10fa);
  --charcoal-glow: inset 0 1px 2px #ffffffb3, inset 0 0 1px 1px #eef3ff40,
    0 -1px 4px #ffffff66, 0 0 18px #e2e9ff33,
    0 0 44px #d6e1ff1a, 0 24px 50px #0009;
  --type-bloom: 0 0 8px #ffffff40, 0 0 26px #dce5ff33;
  --small-type-bloom: 0 0 8px #e0e9ff30;
}

/* The opaque black opening scene reveals the large logo backdrop below it. */
html, body, .scene-light { background: #000; }
.scene-light:after { background: none; }
.professionals { background: transparent; }
.site-header, .mobile-nav { background: #000; }
.scene-ring { opacity: .14; border-color: #dbe5ff30; }
.scene-grid { opacity: .06; }

.hero-cinema h1, h2, .use-case-copy h3 { text-shadow: var(--type-bloom); }
.step h3, .confidence-features h3, .professional-profile h3, .professional-find h3,
.professional-start h3, .professional-steps h4, .example-brand, .mini-complete>strong {
  text-shadow: var(--small-type-bloom);
}
.hero-description, .section-heading>p, .confidence-copy>p, .story-copy p,
.closing p, .professional-lead, .professional-description {
  color: var(--muted); text-shadow: none;
}
.brand-symbol, .closing-icon { filter: drop-shadow(0 0 3px #ffffff80) drop-shadow(0 0 14px #dbe6ff40); }
.text-link, .desktop-nav a, .store-download { text-shadow: 0 0 9px #e9eeff30; }
.store-logo { filter: drop-shadow(0 0 6px #dce6ff40); }
.phone-render { filter: drop-shadow(0 0 3px #ffffff50) drop-shadow(0 0 14px #dce7ff33); }

/* Silver surfaces carry dark, crisp copy, like the location/category cards. */
.button:not(.store-download), .example-card, .professional-request,
.mini-request, .incoming, .dialog-facts, .dialog-close {
  color: #0a0c12; background: var(--silver-surface);
  border: 1px solid #fff; box-shadow: var(--silver-glow); text-shadow: none;
}
.button:not(.store-download):hover, .example-card:hover {
  color: #07090d; background: linear-gradient(118deg, #fff, #e3e6f1 65%, #f7f8ff);
  border-color: #fff;
  box-shadow: var(--silver-glow), 0 0 14px #ffffff40;
}
.button:not(.store-download):active { background: #c6cad8; }
.mode-tabs { background: none; border: 0; box-shadow: none; padding: 5px; border-radius: 23px; gap: 5px; }
.mode-tabs button { color: #c4c5ca; border-radius: 18px; text-shadow: none; }
.mode-tabs button:hover { color: #fff; }
.mode-tabs button[aria-selected=true] {
  color: #fff; background: radial-gradient(ellipse at 15% 0%, #626d8199, transparent 52%), #05070b;
  box-shadow: inset 0 1px 2px #ffffffb3, inset 0 0 0 1px #ffffff80,
    0 0 5px #ffffff80, 0 0 20px #e1e8ff40;
  text-shadow: var(--small-type-bloom);
}
.mode-tabs button[aria-selected=true] .icon { color: #fff; }
.mode-tabs button:not([aria-selected=true]) .icon { color: inherit; }
.example-card { border-radius: 18px; }
.example-text strong { color: #0b0e14; font-weight: 650; }
.example-text small { color: #505562; }
.example-price { color: #171b25; background: #ffffff4d; box-shadow: inset 0 0 0 1px #ffffff80; }
.example-card>.icon { color: #161b26; }
.example-card .task-icon, .example-card:nth-child(2) .task-icon, .example-card:nth-child(3) .task-icon {
  background: #ffffff50; border: 1px solid #ffffff8c; box-shadow: inset 0 1px 0 #fff8;
}
.example-card .icon:has(use[href="#heart"]), .example-card .icon:has(use[href="#bookmark"]) { color: #111; }
.example-card .icon:has(use[href="#tools"]), .example-card .icon:has(use[href="#bag"]) { color: #1269ee; }
.icon:has(use[href="#paint"]) { color: var(--icon-orange); }
.example-card .task-icon .icon, .professional-request-icon .icon, .trust-icon .icon {
  filter: drop-shadow(0 0 5px color-mix(in srgb, currentColor 40%, transparent));
}
.icon:has(use[href="#pin"]) { filter: drop-shadow(0 0 5px #ff304966); }
.example-card .task-icon .icon:has(use[href="#heart"]) { filter: none; }

/* Listing colours follow the task, so they stay consistent across tabs. */
.example-browser .example-card {
  --listing-tint: #b9dcff;
  --listing-edge: #d8edff;
  --listing-glow: #449dff;
  --listing-ink: #145699;
  background: radial-gradient(ellipse at 8% 0%, #ffffffd9, transparent 65%),
    linear-gradient(115deg, var(--listing-edge), var(--listing-tint) 70%, var(--listing-edge));
  border-color: var(--listing-edge);
  box-shadow: inset 0 1px 2px #ffffffc9, inset 0 -1px 1px #ffffff66,
    0 0 5px color-mix(in srgb, var(--listing-edge) 55%, transparent),
    0 0 22px color-mix(in srgb, var(--listing-glow) 24%, transparent), 0 10px 24px #0005;
}
.example-card[data-task="moving"], .example-card[data-task="cart"] {
  --listing-tint: #ffcd9c;
  --listing-edge: #ffe6cd;
  --listing-glow: #ff9b45;
  --listing-ink: #9a430b;
}
.example-card[data-task="dog"] {
  --listing-tint: #d3b5fa;
  --listing-edge: #eee0ff;
  --listing-glow: #ad79ff;
  --listing-ink: #69359b;
}
.example-card[data-task="painting"], .example-card[data-task="outdoor"] {
  --listing-tint: #9ee5c8;
  --listing-edge: #d7f8e8;
  --listing-glow: #42dba4;
  --listing-ink: #12664a;
}
.example-browser .example-card:hover {
  background: radial-gradient(ellipse at 12% 0%, #fff, transparent 75%),
    linear-gradient(115deg, var(--listing-edge), var(--listing-tint));
  border-color: #fff;
  box-shadow: inset 0 1px 2px #fff, 0 0 6px #ffffff80,
    0 0 28px color-mix(in srgb, var(--listing-glow) 35%, transparent), 0 10px 24px #0005;
}
.example-browser .example-card .task-icon {
  background: #ffffff4d;
  border-color: #ffffff80;
}
.example-browser .example-card .task-icon .icon, .example-browser .example-price {
  color: var(--listing-ink);
}
.example-browser .example-card .task-icon .icon { filter: none; }
.example-browser .example-price { background: #ffffff59; }

/* Keep the scenario copy and example cards directly on the page. */
.use-case-panel { background: none; border: 0; box-shadow: none; }
.step { background: none; border: 0; box-shadow: none; }

/* Dark glass frames the bright cards without flattening their contrast. */
.professional-profile, .professional-find, dialog {
  background: var(--charcoal-glass); box-shadow: var(--charcoal-glow);
  border: 1px solid #f5f7ff80;
}
.example-browser {
  background: radial-gradient(ellipse at 20% 0%, #b2c1dc29, transparent 65%), #0a0e1680;
  box-shadow: inset 0 1px 2px #edf3ff66, 0 0 18px #e5edff1a;
}
.example-brand { color: #fff; }
.example-header>span:last-child, .example-caption { color: #cbd1df; }
.professional-visual {
  background: none;
  border: 0;
  box-shadow: none;
}
.professional-label, .professional-step-number { color: #e2e9fb; }
.professional-avatar {
  color: #111b31; background: var(--silver-surface);
  box-shadow: var(--silver-glow); text-shadow: none;
}
.professional-profile-details dd>span {
  color: #eaf0ff; background: #b9cbe51c; border-color: #e5edff42;
  box-shadow: inset 0 1px 0 #ffffff24;
}
.professional-request>div>span, .professional-request p { color: #474d5b; }
.professional-request strong { color: #0b0e16; }
.professional-request-icon {
  background: var(--silver-surface); border: 1px solid #ffffffe0;
  box-shadow: inset 0 1px 1px #ffffffb3, 0 0 10px #e2ebff40;
}
.trust-icon { background: none; border: 0; box-shadow: none; }
.confidence-features .trust-icon { width: 34px; height: 28px; margin-top: 1px; }
.confidence-features .trust-icon .icon, .confidence-features .trust-icon img { width: 28px; height: 28px; }
.trust-lock, .trust-chat { color: #62aaff; }
.trust-handshake { color: #70e9b5; }
.trust-location { color: #ff6279; }
.professional-request-icon .icon { color: #146dff; }
.professional-find p { color: var(--muted); }
.step-visual {
  background: none;
  border: 0;
  box-shadow: none;
}
.mini-request>strong, .incoming { color: #11151d; }
.mini-label, .mini-request>div { color: #505665; }
.mini-request>div>span { background: #ffffff70; }
.mini-publish { background: #11151e; color: #fff; box-shadow: inset 0 1px 1px #ffffff80, 0 0 12px #ffffff40; }
.outgoing { background: #354053; box-shadow: inset 0 1px 1px #ffffff80, 0 0 14px #bccdf640; }
.complete-icon { background: #d9f7e6; color: #11683c; box-shadow: 0 0 5px #edfff080, 0 0 22px #b9fbd44d; }
.complete-icon .icon:has(use[href="#check"]) { color: #11683c; }
.mini-complete>span:last-child { color: #cbd4e6; }
.dialog-facts dt { color: #4d5362; }
.dialog-facts dd { color: #10151e; }
.dialog-icon { background: #ffffff17; box-shadow: inset 0 1px 0 #fff6, 0 0 15px #c8dcff2b; }
.dialog-close { color: #161b26; }

/* Give each how-it-works illustration a distinct colour, without outer cards. */
.how .step { --step-accent: #a6d8ff; --step-halo: #379bff; }
.how .step:nth-child(2) { --step-accent: #fff; --step-halo: #fff; }
.how .step:nth-child(3) { --step-accent: #9aefc8; --step-halo: #31d99c; }
.how .step h3 {
  color: #fff;
  text-shadow: 0 0 18px #ffffff3d;
}
.how .step > p { color: #fff; }
.how .step-visual {
  background: radial-gradient(ellipse at center, color-mix(in srgb, var(--step-halo) 12%, transparent), transparent 70%);
}
.how .mini-request {
  background: radial-gradient(ellipse at 8% 0%, #fff, transparent 65%),
    linear-gradient(125deg, #e7f5ff, #b5d9fc 65%, #d6edff);
  border-color: #d3ecff;
  box-shadow: inset 0 1px 2px #fff, 0 0 6px #b3deff70, 0 0 28px #3c9cff40, 0 18px 38px #0007;
}
.how .mini-label, .how .mini-request>div { color: #355678; }
.how .mini-label .icon { color: #1469c9; }
.how .mini-publish {
  background: linear-gradient(125deg, #206cda, #174bb0);
  box-shadow: inset 0 1px 1px #c5e9ff80, 0 0 14px #238aff40;
}
.how .chat-person .avatar {
  color: #222;
  background: linear-gradient(135deg, #fff, #d6d6d6);
  box-shadow: inset 0 1px 1px #ffffff80, 0 0 16px #ffffff40;
}
.how .incoming {
  color: #222;
  background: linear-gradient(125deg, #fff, #e9e9e9);
  border-color: #fff;
  box-shadow: inset 0 1px 2px #fff, 0 0 5px #ffffff70, 0 0 22px #ffffff40;
}
.how .outgoing {
  color: #222;
  background: linear-gradient(125deg, #f5f5f5, #cecece);
  box-shadow: inset 0 1px 1px #ffffff80, 0 0 20px #ffffff40;
}
.how .outgoing .icon { color: #555; }
.how .complete-icon {
  background: radial-gradient(circle at 30% 20%, #d0ffe9, #70e9b5 60%, #3ed599);
  box-shadow: inset 0 1px 2px #eafff8, 0 0 7px #a2ffd970, 0 0 30px #31d99c50, 0 0 62px #31d99c24;
}
.how .complete-icon, .how .complete-icon .icon:has(use[href="#check"]) { color: #075c3e; }
.how .mini-complete>strong { color: #b4f5d8; text-shadow: 0 0 18px #31d99c40; }

@media (max-width:760px) {
  .confidence-features .trust-icon { width: 24px; height: 22px; margin-top: 0; }
  .confidence-features .trust-icon .icon, .confidence-features .trust-icon img { width: 22px; height: 22px; }
  .mode-tabs { gap: 3px; padding: 4px; border-radius: 21px; }
  .mode-tabs button { border-radius: 16px; }
  .phone-render { filter: drop-shadow(0 0 3px #ffffff50) drop-shadow(0 0 10px #dce7ff33); }
}
@media (prefers-reduced-transparency:reduce) {
  .site-header, .mobile-nav { background: #000; }
  .professional-profile, .professional-find, dialog { background: #1b212d; }
}
@media (prefers-contrast:more), (forced-colors:active) {
  h1, h2, h3, h4, p, strong, .text-link, .desktop-nav a, .store-download { text-shadow: none !important; }
  .brand-symbol, .closing-icon, .phone-render, .store-logo, .icon { filter: none !important; }
  .use-case-panel, .step, .professional-profile, .professional-find, .professional-visual, .step-visual,
  .mode-tabs button[aria-selected=true], .complete-icon, .mini-publish, .outgoing { box-shadow: none; }
  .button:not(.store-download), .example-card, .professional-request, .mini-request, .incoming, .dialog-facts, .dialog-close {
    background: #f2f3f7; color: #05070a; box-shadow: none;
  }
  .hero-cinema h1, h2, .use-case-copy h3 { background: none; color: #fff; -webkit-text-fill-color: currentColor; }
  .how .step-visual { background: none; }
  .how .mini-request, .how .incoming { background: #f2f3f7; color: #05070a; box-shadow: none; }
  .how .mini-publish, .how .outgoing, .how .chat-person .avatar, .how .complete-icon { box-shadow: none; }
  .example-browser .example-card, .example-browser .example-card:hover { background: #f2f3f7; box-shadow: none; }
}

/* Source: mobile.css */
/* Desktop keeps the expanded content. Phones reveal the supporting detail on demand. */
.mobile-disclosure { min-width: 0; border: 0; }
.mobile-disclosure > summary { display: none; }
.mobile-carousel-controls { display: none; }
.professional-description-details > p { padding: 0; }
.use-case-details > #feature-description { color: var(--muted); font-size: 16px; line-height: 1.6; margin-top: 22px; max-width: 360px; padding: 0; }
.professional-start > summary, .professional-find > summary { display: block; padding: 0; pointer-events: none; }
.professional-start > summary h3 { font-size: 32px; letter-spacing: -.035em; font-weight: 600; }
.professional-start > summary::-webkit-details-marker, .professional-find > summary::-webkit-details-marker { display: none; }
.professional-find { display: grid; grid-template-columns: 1fr auto; gap: 8px 26px; }
.professional-find > summary { grid-column: 1; }
.professional-find-body { display: contents; }
.professional-find-body > p { grid-column: 1; grid-row: 2; margin: 0; }
.professional-find-body > .button { grid-column: 2; grid-row: 1 / 3; align-self: center; }
.confidence-extra-features { display: grid; gap: 32px; }

/* Phone layouts use one vertical reading order and toolbar-safe screen frames.
   Minimum heights allow enlarged text and open answers to remain scrollable. */
@media (max-width:760px) {
  html { --mobile-header-height:60px; --mobile-section-height:100svh; scroll-padding-top:0; scroll-behavior:smooth; }
  .wrap { width:calc(100% - 36px); }
  .site-header { position:fixed; inset:0 0 auto; width:100%; background:#000; backdrop-filter:none; -webkit-backdrop-filter:none; }
  .nav-wrap { width:calc(100% - 36px); height:60px; }
  /* Keep the dropdown outside header layout so it cannot move the phone scene. */
  .mobile-nav { position:absolute; inset:100% 18px auto auto; width:max-content; max-width:calc(100% - 36px); padding:10px 18px; border-radius:16px; background:rgba(0,0,0,.8); max-height:calc(100svh - 72px); max-height:calc(100dvh - 72px); overflow-y:auto; overscroll-behavior:contain; }
  main > section:not(.hero), .possibilities { min-height:100svh; }
  .possibilities, .professionals, .confidence, .our-story, .closing { display:flex; align-items:center; }
  .how { display:flex; flex-direction:column; justify-content:center; }
  .how > * { flex-shrink:0; }
  .faq { align-content:center; }
  .section-pad, .professionals, .how, .closing { padding-block:72px 24px; }
  .section-heading h2, .confidence h2, .faq-intro h2, .professional-copy h2 { font-size:clamp(28px,8.2vw,38px); line-height:1.08; letter-spacing:-.04em; }
  .section-heading > p:last-child:not(.eyebrow) { font-size:13px; line-height:1.4; margin-top:10px; }
  .section-heading .desktop-break { display:none; }
  main h1, main h2 { text-align:center; margin-inline:auto; }
  .professional-layout, .confidence-inner, .story-layout, .faq, .use-case-panel { grid-template-columns:minmax(0,1fr); }
  .mobile-disclosure > summary { display:none; }
  .mode-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:stretch; width:100%; max-width:380px; gap:3px; margin:12px auto; padding:0; }
  .mode-tabs button { flex:none; flex-direction:row; min-width:0; min-height:36px; width:100%; padding:8px 4px; font-size:clamp(10px,2.8vw,12px); line-height:1.2; white-space:nowrap; }
  .use-case-panel { padding:0; gap:14px; min-width:0; }
  .use-case-copy { padding:0; }
  .use-case-copy h3 { font-size:clamp(24px,6.7vw,28px); line-height:1.08; }
  .use-case-details { margin-top:12px; }
  .use-case-details > #feature-description { font-size:13px; line-height:1.4; margin:0; max-width:none; }
  .feature-list { font-size:12px; line-height:1.4; margin:10px 0 0; }
  .feature-list li { margin-block:5px; gap:8px; }
  .feature-list .icon { width:16px; height:16px; }
  .example-browser { display:block; min-width:0; min-height:0; padding:12px; border-radius:20px; }
  .example-header { margin:0 0 10px; }
  .example-brand { font-size:18px; }
  .example-header > span:last-child { font-size:10px; }
  .example-list, .steps { display:grid; grid-template-columns:minmax(0,1fr); grid-auto-flow:row; grid-auto-columns:auto; overflow:visible; scroll-snap-type:none; mask-image:none; -webkit-mask-image:none; }
  .example-list { gap:8px; margin:0; padding:0; }
  .example-card { min-width:0; min-height:58px; padding:10px 9px; gap:8px; border-radius:14px; scroll-snap-align:none; }
  .example-card .task-icon { width:27px; height:29px; }
  .example-text strong { font-size:12px; }
  .example-text small { font-size:10px; line-height:1.35; }
  .example-price { font-size:11px; padding:4px 6px; }
  .example-card > .icon { display:none; }

  .professional-layout { gap:20px; }
  .professional-copy .professional-description { font-size:14px; line-height:1.45; margin:14px 0 0; }
  .professional-visual { display:flex; flex-direction:column-reverse; gap:12px; padding:0; width:100%; max-width:none; }
  .professional-profile { padding:18px; border-radius:23px; transform:none; }
  .professional-identity { margin-top:0; gap:10px; }
  .professional-avatar { width:38px; height:38px; font-size:20px; }
  .professional-identity strong { font-size:21px; }
  .professional-identity > div > span { font-size:12px; }
  .professional-profile h3 { font-size:23px; line-height:1.12; margin-top:16px; }
  .professional-profile-details { margin-top:16px; }
  .professional-profile-details > div + div { margin-top:12px; }
  .professional-profile-details dt { font-size:13px; }
  .professional-profile-details dd { font-size:13px; line-height:1.4; }
  [data-professional-services] { display:flex; flex-direction:row; flex-wrap:wrap; align-items:center; gap:5px; }
  [data-professional-services] span { font-size:10px; padding:3px 7px; white-space:nowrap; }
  .professional-request { padding:12px; gap:10px; margin:0; border-radius:18px; transform:none; }
  .professional-request-icon { width:30px; height:30px; }
  .professional-request strong { font-size:13px; }
  .professional-request p, .professional-request > div > span { font-size:11px; margin-top:2px; }

  /* Three paired rows keep the whole explanation in one phone-sized frame. */
  .how { padding-block:64px 24px; min-height:100svh; justify-content:flex-start; }
  .steps { width:100%; max-width:560px; min-height:calc(100svh - 160px); margin:28px auto 0; padding:0; grid-template-rows:repeat(3, minmax(min-content,1fr)); align-items:center; gap:clamp(28px,5svh,48px); }
  .step { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); grid-template-areas:"title visual" "copy visual"; column-gap:clamp(16px,5vw,26px); row-gap:8px; align-content:center; padding:0; min-width:0; }
  .step h3 { grid-area:title; font-size:clamp(16px,4.6vw,20px); line-height:1.2; margin:0; }
  .step > p { grid-area:copy; font-size:clamp(11px,3.2vw,14px); line-height:1.45; margin:0; max-width:none; }
  .step-visual { grid-area:visual; align-self:center; min-width:0; height:auto; min-height:110px; padding:0; margin:0; overflow:visible; }
  .step-visual > div { transform:none; width:100%; max-width:none; min-width:0; flex-shrink:1; }
  .mini-request { padding:10px; border-radius:12px; }
  .mini-request > strong { font-size:clamp(8px,2.5vw,12px); line-height:1.25; margin-top:10px; }
  .mini-request > div { margin-block:8px; gap:4px; font-size:7px; }
  .mini-request > div > span { padding:3px 4px; }
  .mini-label, .mini-publish { font-size:clamp(6px,1.8vw,8px); gap:3px; }
  .mini-label .icon, .mini-publish .icon { width:9px; height:9px; flex-shrink:0; }
  .mini-publish { padding:6px 3px; }
  .chat-person { margin-bottom:12px; gap:5px; font-size:clamp(7px,2vw,10px); line-height:1.25; }
  .chat-person .avatar { width:22px; height:22px; flex-shrink:0; font-size:10px; }
  .message { font-size:clamp(7px,2vw,10px); line-height:1.35; padding:8px; }
  .outgoing { margin-top:10px; gap:3px; }
  .outgoing .icon { width:9px; height:9px; flex-shrink:0; }
  .complete-icon { width:42px; height:42px; margin-bottom:12px; }
  .complete-icon .icon { width:22px; height:22px; }
  .mini-complete > strong { font-size:clamp(12px,3.6vw,17px); line-height:1.2; text-align:center; }
  .mini-complete > span:last-child { font-size:clamp(7px,2vw,10px); line-height:1.4; text-align:center; }

  .confidence-inner { min-height:100svh; align-content:center; padding-block:64px 24px; gap:24px; }
  .confidence h2 { font-size:clamp(26px,7.2vw,32px); line-height:1.1; }
  .confidence-copy > p:last-child { font-size:13px; line-height:1.45; margin-top:12px; max-width:none; }
  .confidence-features, .confidence-extra-features { gap:clamp(18px,3svh,26px); }
  .confidence-features { padding-top:0; }
  .confidence-features article { gap:12px; align-items:flex-start; }
  .confidence-features article > div { min-width:0; }
  .trust-icon { width:24px; height:24px; }
  .trust-icon .icon, .trust-icon img { width:21px; height:21px; }
  .confidence-features h3 { font-size:14px; line-height:1.25; }
  .confidence-features p { font-size:12px; line-height:1.4; margin-top:5px; max-width:none; }
  .story-layout { gap:24px; }
  .story-copy p { font-size:15px; line-height:1.6; }
  .story-copy p + p { margin-top:18px; }
  .faq { gap:22px; }
  .faq-list summary { font-size:14px; padding-block:18px; line-height:1.4; }
  .faq-list details > p { font-size:14px; line-height:1.5; padding-right:0; }
  .closing { --closing-title-size:clamp(38px,11.8vw,55px); }
  .closing h2 { font-size:var(--closing-title-size); line-height:1.08; }
  .closing p:not(.eyebrow) { font-size:calc(var(--closing-title-size) * .46); line-height:1.2; max-width:none; margin:16px auto 26px; }
  .app-downloads { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:center; justify-items:center; gap:2px 12px; max-width:360px; margin-inline:auto; }
  .app-downloads .store-download { font-size:11px; gap:6px; min-height:44px; padding:8px 0; white-space:nowrap; width:auto; flex:none; }
  .app-downloads .browser-download-row { grid-column:1 / -1; width:100%; margin-top:0; }
  .app-downloads .store-logo { width:16px; height:18px; }
  .closing-icon { width:64px; height:64px; margin:28px auto 0; }
  .site-footer { padding-block:24px; }
  .site-footer > div { flex-direction:row; flex-wrap:wrap; justify-content:center; align-items:center; gap:10px 16px; font-size:10px; text-align:center; }
  .site-footer > div > a, .site-footer > div > span { white-space:nowrap; }

  /* A single native screen replaces the long pinned desktop animation runway. */
  .hero, .has-scene-motion .hero { overflow:clip; background:#000; }
  .hero-story, .has-scene-motion .hero-story { height:100svh; min-height:0; }
  .hero-cinema, .has-scene-motion .hero-cinema { position:relative; top:auto; height:100svh; min-height:0; max-height:none; }
  .hero-cinema .hero-copy { padding-top:76px; }
  .hero-cinema h1 { font-size:clamp(34px,10.8vw,46px); }
  .hero-cinema .hero-description { font-size:14px; line-height:1.4; margin-top:14px; }
  .hero-downloads { margin-top:12px; grid-template-columns:repeat(2,max-content); justify-content:center; column-gap:18px; }
  .hero-downloads .store-download { font-size:11px; }
  .hero-downloads .store-logo { width:16px; height:18px; }
  .has-scene-motion .reveal-track { margin:0; height:auto; scroll-margin-top:0; }
  .has-scene-motion .possibilities { position:relative; top:auto; opacity:1; will-change:auto; }
  .has-scene-motion .scene-light, .has-scene-motion .scene-world { opacity:1; }
  .scene-ring, .scene-grid, .scene-cards { display:none; }
  .phone-render-ready .scene-device { visibility:visible; }
  .phone-render { display:none; }
  .device-shell span { display:none; }
  .device-shell span:first-child, .device-shell span:nth-child(12), .device-shell span:last-child { display:block; }
  .device-gloss:before { will-change:auto; transform:none; }
  .brand-atmosphere > div { animation:none; }
  .atmosphere-logo { filter:blur(12px); opacity:.035; transform:translate(-50%,-50%); }
  .atmosphere-bloom, .atmosphere-fog { display:none; }
  .site-header, .example-browser, .professional-profile, .professional-request { backdrop-filter:none; -webkit-backdrop-filter:none; }
  .example-card, .professional-profile, .professional-request { box-shadow:inset 0 1px 1px #ffffff80, 0 0 10px #dce7ff24; }
}
@media (max-width:760px) and (max-height:740px) {
  .section-pad, .professionals, .how, .closing { padding-block:66px 18px; }
  .how { padding-block:40px 20px; }
  .steps { gap:24px; margin-top:24px; }
  .professional-layout { gap:16px; }
  .professional-profile { padding:14px; }
  .professional-profile h3 { font-size:21px; margin-top:12px; }
  .professional-profile-details { margin-top:12px; }
}
@media (max-width:760px) and (max-height:740px) {
  .possibilities { padding-block:60px 14px; }
  .possibilities .section-heading > p:last-child:not(.eyebrow) { font-size:12px; line-height:1.25; margin-top:8px; }
  .mode-tabs { margin-block:6px; }
  .use-case-panel { gap:8px; }
  .use-case-copy h3 { font-size:24px; }
  .use-case-details { margin-top:8px; }
  .use-case-details > #feature-description { font-size:12px; line-height:1.35; }
  .feature-list { font-size:11px; line-height:1.25; margin-top:6px; }
  .feature-list li { margin-block:3px; }
  .example-browser { padding:8px; }
  .example-header { margin-bottom:6px; line-height:18px; }
  .example-brand { font-size:16px; line-height:18px; }
  .example-list { gap:6px; }
  .example-card { min-height:44px; padding-block:6px; }
  .example-text strong { line-height:1.25; }
  .example-text small { margin-top:2px; }
  .professional-copy .professional-description { font-size:13px; line-height:1.4; margin-top:12px; }
  .professional-layout { gap:12px; }
  .professional-profile { padding:12px; }
  .professional-profile h3 { font-size:20px; }
  .professional-profile-details, .professional-profile-details > div + div { margin-top:10px; }
}
@media (max-width:760px) {
  .professional-visual:hover .professional-profile, .professional-visual:hover .professional-request { transform:none; }
}
/* Keep every trust point visible when the phone's browser bars reduce its height. */
@media (max-width:760px) and (max-height:620px) {
  .confidence-inner { padding-block:64px 18px; gap:18px; }
  .confidence h2 { font-size:24px; }
  .confidence-copy > p:last-child { font-size:12px; line-height:1.4; margin-top:10px; }
  .confidence-features, .confidence-extra-features { gap:14px; }
  .confidence-features article { gap:10px; }
  .confidence-features h3 { font-size:14px; line-height:1.2; }
  .confidence-features p { font-size:12px; line-height:1.4; margin-top:4px; }
}
@media (max-width:360px) and (max-height:620px) {
  .confidence h2 { font-size:22px; }
  .confidence-copy > p:last-child { font-size:11.5px; }
  .confidence-features, .confidence-extra-features { gap:12px; }
  .confidence-features h3 { font-size:13px; }
  .confidence-features p { font-size:11px; }
}

@media (max-width:760px) {
  .professional-visual { width:94%; margin-inline:auto; gap:10px; }
  .professional-profile { padding:13px; }
  .professional-avatar { width:32px; height:32px; font-size:18px; }
  .professional-identity strong { font-size:19px; }
  .professional-profile h3 { font-size:20px; margin-top:12px; }
  .professional-profile-details { margin-top:12px; }
  .professional-profile-details > div + div { margin-top:9px; }
  .professional-profile-details dt, .professional-profile-details dd { font-size:12px; }
  .professional-request { padding:10px; gap:8px; }
  .professional-request-icon { width:26px; height:26px; }
  .professional-request strong { font-size:12px; }
  .professional-request p, .professional-request > div > span { font-size:10px; }
}


@media (max-width:760px) {
  .closing .app-downloads { grid-template-columns:repeat(2,max-content); justify-content:center; column-gap:18px; }
}
@media (max-width:760px) and (max-height:740px) {
  .closing .app-downloads .store-download { font-size:10px; }
  .closing .app-downloads .store-logo { width:15px; height:17px; }
}

@media (max-width:760px) {
  .professional-copy .professional-description { text-align:center; }
}

@media (max-width:760px) {
  .professional-request { width:90%; align-self:center; padding:8px 10px; gap:7px; border-radius:15px; }
  .professional-request-icon { width:23px; height:23px; }
  .professional-request strong { font-size:11px; }
  .professional-request p, .professional-request > div > span { font-size:9px; line-height:1.3; }
}

@media (max-width:760px) {
  .mode-tabs { max-width:310px; gap:2px; }
  .mode-tabs button { min-height:30px; padding:6px 3px; font-size:clamp(9px,2.5vw,10px); }
  .possibilities .mode-tabs { margin-top:48px; }
  .possibilities .use-case-panel { row-gap:48px; }
}
@media (max-width:760px) and (max-height:740px) {
  .possibilities .mode-tabs { margin-top:40px; }
  .possibilities .use-case-panel { row-gap:40px; }
}

@media (min-width:761px) {
 .use-case-details > #feature-description { max-width:none; width:100%; }
}

/* Source: section-snap.css */
/* Let the browser settle each gesture, retaining native touch and wheel momentum. */
html { scroll-snap-type: y mandatory; }
main > section:not(.hero), .site-footer {
  scroll-snap-align: start;
  scroll-snap-stop: always;
}
/* Stable, full-height areas are independent of sticky/transformed content.
   The browser can scroll inside a section that is taller than the viewport. */
.has-section-stops main > section:not(.hero) {
  position: relative;
  scroll-snap-align: none;
}
.section-snap-point {
  position: absolute;
  inset-inline: 0;
  top: var(--snap-offset, 0px);
  height: var(--snap-height, 100svh);
  pointer-events: none;
  scroll-snap-align: start;
  scroll-snap-stop: always;
}
.has-section-stops .reveal-track::before { content: none; }
.site-footer { scroll-snap-align: end; }

/* The final frame must fill the screen even on tall displays. Align it to
   the viewport edge so the preceding FAQ cannot peek into its scroll stop. */
main > section.closing {
  min-height: 100svh;
  display: flex;
  align-items: center;
}
main > .closing, .closing > .section-snap-point {
  scroll-margin-top: calc(0px - var(--mobile-header-height, var(--page-scroll-padding, 88px)));
}

/* The opening scenes overlap. Stable, untransformed areas mark their resting
   positions without making the moving phones or sticky section snap targets. */
.hero-story::before, .reveal-track::before {
  content: '';
  display: block;
  position: absolute;
  inset: 0 0 auto;
  pointer-events: none;
  scroll-snap-align: start;
  scroll-snap-stop: always;
}
.hero-story::before { height: calc(100svh - 64px); }
.reveal-track { position: relative; }
.reveal-track::before { height: 100%; }

@media (prefers-reduced-motion: no-preference) {
  /* Cover the full story on desktop too: short gestures must not snap
     straight from the opening viewport to the end of the phone exit. */
  .has-scene-motion .hero-story::before { height: 100%; }
  .has-scene-motion .reveal-track::before {
    top: var(--reveal-range, 964px);
    height: var(--reveal-content-height, 1000px);
    scroll-margin-top: calc(var(--reveal-pin-top, 0px) - var(--page-scroll-padding, 88px));
  }
  .has-scene-motion .reveal-track > .section-snap-point {
    top: calc(var(--reveal-range, 964px) + var(--snap-offset, 0px));
    scroll-margin-top: calc(var(--reveal-pin-top, 0px) - var(--page-scroll-padding, 88px));
  }
}
@media (max-width: 760px) {
  /* An oversized snap area allows native scrolling through the phone exit.
     A one-screen area would snap even a short swipe straight past it. */
  .hero-story::before { height: 100%; }
  .has-scene-motion .reveal-track::before {
    top: 0; height: 100%; scroll-margin-top: 0;
  }
  .has-scene-motion .reveal-track > .section-snap-point {
    top: var(--snap-offset, 0px); scroll-margin-top: 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-snap-type: y proximity; scroll-behavior: auto; }
}

/* One scroll owner on Safari, Edge and touch devices: the browser. No JS
   spring, gesture cooldown, synthetic momentum or vertical-input lock. */
main, .site-footer { touch-action: pan-y pinch-zoom; }

/* Native iOS snapping: no touch interception or JS scroll animation. Each
   content frame is a snap stop; oversized/open content can scroll naturally. */
@media (max-width:760px) {
  html { scroll-snap-type:y mandatory; scroll-padding-top:0; overscroll-behavior-y:auto; }
  /* Stable section boundaries must not move while Safari's bars animate.
     Keep this a minimum so larger text and expanded content remain reachable. */
  main > section:not(.hero), .possibilities { min-height:var(--phone-frame,100svh); }
  .hero, .possibilities, main > section:not(.hero) { scroll-snap-align:start; scroll-snap-stop:always; scroll-margin-top:0; }
  main > .closing { scroll-margin-top:0; }
  .hero-story::before, .reveal-track::before { content:none; }
  .section-snap-point { display:none; }
  main, .site-footer { touch-action:pan-y pinch-zoom; }
  .site-footer { scroll-snap-align:end; scroll-snap-stop:always; }
}

/* Long-form reading temporarily has no snap targets, including the synthetic
   desktop markers. Restore ordinary section stops when the disclosure closes. */
html.is-reading-story, html.is-reading-story body { scroll-snap-type:none; }
html.is-reading-story :is(main > section, .possibilities, .closing-frame, .site-footer) {
  scroll-snap-align:none; scroll-snap-stop:normal;
}
html.is-reading-story .section-snap-point,
html.is-reading-story .hero-story::before,
html.is-reading-story .reveal-track::before { display:none; }

/* Source: confidence-headline.css */
/* Keep every message in the same grid cell so rotation never shifts the page. */
.confidence-copy { min-width: 0; }
#confidence-title {
  display: grid;
  background: none;
  color: #fff;
  -webkit-text-fill-color: currentColor;
}
#confidence-title .confidence-message {
  grid-area: 1 / 1;
  min-width: 0;
  align-self: start;
  opacity: 0;
  visibility: hidden;
  transition: opacity 360ms ease-in-out, visibility 360ms;
}
#confidence-title .confidence-message.is-active {
  opacity: 1;
  visibility: visible;
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
  #confidence-title .confidence-message {
    background-image: var(--text-gradient);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
  }
}
@media (prefers-reduced-motion: reduce) {
  #confidence-title .confidence-message { transition: none; }
}
@media (forced-colors: active) {
  #confidence-title .confidence-message {
    background: none;
    color: CanvasText;
    -webkit-text-fill-color: currentColor;
  }
}

/* Source: responsive.css */
/* Shared responsive geometry. Keep the established content and motion, while
   giving text, illustrations and spacing the available width and height. */
:root {
  --layout-screen:100svh;
  --layout-gutter:clamp(24px,4vw,80px);
}
@supports (height:100dvh) {
  :root { --layout-screen:100dvh; }
}
.professional-layout > *, .confidence-inner > *, .story-layout > *,
.faq > *, .steps > *, .use-case-panel > * { min-width:0; }

/* Shared measurement pose for both responsive layouts. */
.hero-cinema.measuring-phone-spacing .scene-device {
  animation:none !important; translate:none !important; rotate:none !important;
}

@media (min-width:761px) {
  :root {
    --desktop-title:clamp(38px,min(5vw,8svh),78px);
    --desktop-body:clamp(14px,min(1.15vw,2.1svh),19px);
    --desktop-gap:clamp(24px,4vw,72px);
    --desktop-pad:clamp(24px,6svh,88px);
    --desktop-phone-width:clamp(90px,min(18vw,calc((100svh - 190px) / 2.5)),300px);
    --desktop-phone-offset:clamp(210px,30vw,600px);
  }
  .wrap, .nav-wrap { width:min(1440px,calc(100% - var(--layout-gutter) * 2)); max-width:none; }
  main > section:not(.hero), .possibilities { min-height:calc(var(--layout-screen) - 88px); }
  .section-pad, .professionals, .how, .closing { padding-block:var(--desktop-pad); }
  .section-heading h2, .professional-copy h2, .confidence h2, .faq-intro h2 { font-size:var(--desktop-title); line-height:1.08; }
  .professional-copy .professional-description, .confidence-copy > p:last-child,
  .story-copy p, .use-case-details > #feature-description { font-size:var(--desktop-body); line-height:1.5; }
  #confidence-title .confidence-message { overflow-wrap:anywhere; hyphens:auto; }
  .professional-layout, .confidence-inner, .story-layout, .faq { gap:var(--desktop-gap); }
  .professional-layout { grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); }
  .confidence-inner { grid-template-columns:repeat(2,minmax(0,1fr)); min-height:calc(var(--layout-screen) - 88px); padding-block:var(--desktop-pad); align-items:center; }
  .story-layout { grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); }
  .faq { grid-template-columns:minmax(0,1fr) minmax(0,1.3fr); align-items:center; }
  .confidence-features, .confidence-extra-features { gap:clamp(32px,4.6svh,56px); }
  .confidence-features h3 { font-size:clamp(16px,min(1.45vw,2.5svh),22px); }
  .confidence-features p { font-size:clamp(13px,min(1.05vw,1.9svh),17px); line-height:1.5; }
  .faq-list summary { font-size:var(--desktop-body); padding-block:clamp(14px,2.5svh,28px); }
  .faq-list details > p { font-size:var(--desktop-body); }

  .hero-cinema, .has-scene-motion .hero-cinema { height:calc(var(--layout-screen) - 64px); min-height:0; max-height:none; }
  .hero-cinema { --desktop-phone-gap:28px; }
  .hero-cinema .hero-copy {
    /* Reserve the angled phone silhouettes before measuring the text gap. */
    width:min(690px,calc(100% - var(--desktop-phone-width) * 2.9 - var(--desktop-phone-gap) * 2 - 32px));
    padding-top:clamp(28px,8svh,96px);
  }
  .hero-cinema h1 { font-size:clamp(44px,min(7.2vw,12svh),104px); }
  .hero-cinema .hero-description { font-size:clamp(15px,min(1.3vw,2.5svh),20px); }
  .scene-device { width:var(--desktop-phone-width); top:clamp(70px,17svh,180px); }
  .device-back { margin-left:calc(0px - var(--desktop-phone-offset) - var(--desktop-phone-width) / 2); }
  .device-front {
    margin-left:calc(var(--desktop-phone-offset) - var(--desktop-phone-width) / 2);
    /* Raise the foreground phone, leaving room for its idle float. */
    top:calc(clamp(70px,17svh,180px) - clamp(56px,8svh,88px));
  }

  .possibilities .mode-tabs { margin-block:clamp(18px,3svh,32px); }
  .possibilities .use-case-panel { padding:clamp(16px,2vw,32px); gap:var(--desktop-gap); }
  .possibilities .example-browser { padding:clamp(14px,1.8vw,28px); }
  .possibilities .example-card { min-height:clamp(58px,8svh,88px); padding:clamp(10px,1.1vw,18px); }
  .example-text strong { font-size:clamp(12px,1.05vw,17px); }
  .example-text small { font-size:clamp(10px,.8vw,13px); }

  .how { display:flex; flex-direction:column; justify-content:center; }
  .how > .section-heading { width:100%; }
  .steps { width:100%; max-width:none; gap:clamp(16px,2.5vw,40px); margin-top:clamp(24px,5svh,56px); }
  .step { padding:clamp(8px,1.8vw,26px); }
  .step-visual { height:clamp(130px,24svh,280px); padding:clamp(8px,1.2vw,18px); margin-bottom:clamp(16px,2.5svh,28px); }
  .step h3 { font-size:clamp(20px,min(2vw,3.2svh),29px); }
  .step > p { font-size:var(--desktop-body); line-height:1.5; max-width:none; }
  .professional-visual { max-width:clamp(360px,36vw,520px); }
  .professional-profile { padding:clamp(14px,1.4vw,24px); }
  .professional-profile h3 { font-size:clamp(21px,min(2vw,3.5svh),29px); }
  .professional-profile-details dd { font-size:clamp(12px,1vw,16px); }
  .closing { --closing-title-size:clamp(56px,min(7vw,11svh),108px); }
  .closing h2 { font-size:var(--closing-title-size); }
}
@media (min-width:761px) and (max-width:1100px) {
  .professional-layout, .confidence-inner, .story-layout, .faq { grid-template-columns:minmax(0,1fr); }
  .professional-copy .professional-description, .confidence-copy > p:last-child { max-width:70ch; }
  .professional-visual { max-width:480px; }
  .desktop-nav { gap:clamp(12px,2vw,24px); margin-left:0; }
}

/* Every phone section starts its heading on the same line as the hero.
   Stable units keep Safari's toolbar animation from resizing snap areas.
   Minimum heights, rather than clipping or page-wide scaling, preserve zoom. */
@media (max-width:760px) {
  :root {
    --layout-screen:100svh;
    --phone-frame:100svh;
    --layout-gutter:clamp(16px,4.5vw,28px);
    --phone-title-top:clamp(72px,9.8svh,96px);
    --phone-bottom:clamp(18px,3svh,30px);
    --phone-heading:clamp(26px,min(8.2vw,4.8svh),40px);
    --phone-hero-heading:clamp(34px,min(10.8vw,6.2svh),52px);
    --phone-body:clamp(12px,min(3.4vw,1.9svh),15px);
    --phone-gap:clamp(16px,2.8svh,28px);
    --phone-large-gap:clamp(40px,5.8svh,56px);
    --phone-row-gap:clamp(14px,3svh,30px);
  }
  .wrap, .nav-wrap { width:calc(100% - var(--layout-gutter) * 2); }
  main > section:not(.hero), .possibilities {
    min-height:var(--phone-frame);
    padding-block:var(--phone-title-top) var(--phone-bottom);
  }
  .possibilities, main > .professionals, main > .our-story, main > section.closing { display:block; }
  .section-heading h2, .professional-copy h2, .confidence h2, .faq-intro h2 {
    font-size:var(--phone-heading); line-height:1.08; margin:0 auto; text-align:center;
  }
  .section-heading > p:last-child:not(.eyebrow),
  .professional-copy .professional-description, .confidence-copy > p:last-child,
  .use-case-details > #feature-description, .story-copy p {
    font-size:var(--phone-body); line-height:1.45;
  }
  .professional-layout, .story-layout { grid-template-columns:minmax(0,1fr); align-items:start; gap:var(--phone-gap); }
  .professional-copy .professional-description { margin-top:var(--phone-gap); }

  .hero-story, .has-scene-motion .hero-story { height:auto; min-height:var(--layout-screen); }
  .hero-cinema, .has-scene-motion .hero-cinema {
    height:var(--layout-screen);
    /* Keep controls and a usable phone preview reachable on short screens
       and with enlarged text. The section may grow instead of cutting off. */
    min-height:calc(var(--mobile-scene-top, 300px) + 180px);
  }
  /* Give the larger mobile headline breathing room below the fixed header. */
  .hero-cinema .hero-copy { padding-top:calc(var(--phone-title-top) + clamp(20px,3svh,28px)); }
  .hero-cinema h1 {
    --hero-display-size:clamp(39px,min(12.4vw,7.1svh),60px);
    font-size:var(--hero-display-size);
    line-height:1.025;
    /* Grow upward so the copy below and the phone stage keep their positions. */
    margin-top:calc((var(--phone-hero-heading) - var(--hero-display-size)) * 2.05);
  }
  .hero-cinema .hero-description { font-size:var(--phone-body); max-width:36ch; }
  .hero-cinema .hero-downloads .store-download, .closing .app-downloads .store-download { font-size:clamp(10px,2.8vw,12px); }
  .hero-downloads .store-download .store-logo, .closing .store-download .store-logo { width:clamp(15px,4vw,19px); height:clamp(17px,4.5vw,21px); }
  .hero-downloads, .closing .app-downloads { column-gap:clamp(14px,4.5vw,24px); }

  .possibilities .mode-tabs { max-width:min(100%,360px); margin-block:var(--phone-large-gap) 12px; }
  .mode-tabs button { font-size:clamp(9px,2.5vw,12px); padding-inline:clamp(3px,1vw,7px); }
  .possibilities .use-case-panel { row-gap:var(--phone-large-gap); }
  .use-case-copy h3 { font-size:clamp(24px,6.7vw,32px); }
  .use-case-details { margin-top:var(--phone-gap); }
  .feature-list { font-size:clamp(11px,3vw,13px); line-height:1.4; margin-top:clamp(10px,1.8svh,18px); }
  .feature-list li { margin-block:clamp(4px,.7svh,8px); }
  .example-browser { padding:clamp(10px,2.8vw,16px); }
  .example-brand { font-size:clamp(17px,4.6vw,22px); }
  .example-card { min-height:clamp(44px,min(14vw,7.4svh),66px); padding:clamp(7px,1.2svh,12px) clamp(8px,2.4vw,14px); }
  .example-text strong { font-size:clamp(11px,3.1vw,14px); }
  .example-text small { font-size:clamp(9px,2.55vw,12px); }
  .example-price { font-size:clamp(10px,2.8vw,13px); }

  .how { display:block; }
  .steps {
    width:100%; max-width:none; margin:var(--phone-gap) 0 0;
    min-height:max(0px,calc(var(--phone-frame) - var(--phone-title-top) - var(--phone-heading) * 1.08 - var(--phone-gap) - var(--phone-bottom)));
    grid-template-columns:minmax(0,1fr); grid-template-rows:repeat(3,minmax(min-content,1fr)); gap:var(--phone-row-gap);
  }
  .step { grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); column-gap:clamp(14px,4vw,26px); row-gap:clamp(5px,1svh,10px); padding:0; }
  .step h3 { font-size:clamp(16px,min(4.7vw,2.7svh),21px); line-height:1.16; }
  .step > p { font-size:clamp(11px,min(3.2vw,1.7svh),14px); line-height:1.4; }
  .step-visual { height:auto; min-height:clamp(90px,16svh,140px); padding:0; margin:0; }
  .mini-request { padding:clamp(8px,2.4vw,14px); }
  .mini-request > strong { font-size:clamp(8px,2.5vw,12px); }
  .message, .chat-person { font-size:clamp(7px,2.1vw,11px); }
  .complete-icon { width:clamp(36px,10.8vw,52px); height:clamp(36px,10.8vw,52px); }

  .professional-visual { width:100%; max-width:480px; margin-inline:auto; gap:clamp(8px,1.8svh,18px); }
  .professional-profile { padding:clamp(11px,3vw,18px); }
  .professional-avatar { width:clamp(30px,8.2vw,40px); height:clamp(30px,8.2vw,40px); }
  .professional-identity strong { font-size:clamp(18px,5vw,24px); }
  .professional-profile h3 { font-size:clamp(18px,min(5.2vw,3svh),25px); }
  .professional-profile-details dt, .professional-profile-details dd { font-size:clamp(11px,3vw,14px); }
  .professional-profile [data-professional-services] { min-height:0; gap:clamp(4px,1vw,7px); }
  .professional-profile-details [data-professional-services] > span { font-size:clamp(8.5px,2.45vw,11px); padding:3px 5px; }
  .professional-request { width:94%; padding:clamp(8px,2vw,12px); }
  .professional-request strong { font-size:clamp(10px,2.8vw,13px); }
  .professional-request p, .professional-request > div > span { font-size:clamp(9px,2.45vw,11px); }

  main > section.confidence { display:block; padding:0; }
  .confidence-inner {
    min-height:var(--phone-frame); padding-block:var(--phone-title-top) var(--phone-bottom);
    grid-template-columns:minmax(0,1fr); align-content:start; gap:var(--phone-gap);
  }
  .confidence-features, .confidence-extra-features { gap:clamp(24px,4.6svh,44px); }
  .confidence-features article { gap:clamp(9px,2.8vw,14px); }
  .confidence-features h3 { font-size:clamp(13px,min(3.7vw,2.2svh),17px); line-height:1.2; }
  .confidence-features p { font-size:clamp(11px,min(3.05vw,1.8svh),14px); line-height:1.4; }
  .confidence-features .trust-icon { width:clamp(20px,6vw,28px); height:clamp(20px,6vw,28px); }
  .trust-icon .icon, .trust-icon img { width:100%; height:100%; }
  .story-copy p + p { margin-top:var(--phone-gap); }
  .faq { grid-template-columns:minmax(0,1fr); align-content:start; gap:var(--phone-gap); }
  .faq-list summary { font-size:var(--phone-body); line-height:1.4; padding-block:clamp(12px,2.1svh,22px); }
  .faq-list details > p { font-size:var(--phone-body); }
  .closing { --closing-title-size:var(--phone-hero-heading); }
  .closing h2 { font-size:var(--closing-title-size); margin:0 auto; }
  .site-footer > div { font-size:clamp(10px,2.6vw,12px); gap:clamp(8px,2vw,14px) clamp(12px,3vw,20px); }
}
@media (max-width:760px) {
  @supports (height:100lvh) {
    /* Fill the screen with the bars collapsed, without changing section
       boundaries every time the bars expand or collapse during a swipe. */
    :root { --phone-frame:100lvh; }
  }
  #task-dialog { overscroll-behavior:contain; }
}
@media (max-width:760px) and (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; scroll-snap-type:y proximity; }
}

/* The closing message and global footer share one native scroll stop.
   Keep the footer in normal flow, reserving its actual wrapped height instead
   of placing a second full-screen section before it. Phone frames override
   this with a stable small-viewport minimum so Safari's bars cannot hide links. */
.closing-frame {
  display:flex;
  flex-direction:column;
  min-height:100svh;
  min-height:100dvh;
  scroll-snap-align:start;
  scroll-snap-stop:always;
  scroll-margin-top:-88px;
}
.closing-frame > .closing {
  display:flex;
  flex:1 0 auto;
  align-items:center;
  min-height:0;
  padding-block:clamp(16px,4svh,48px) clamp(12px,2svh,24px);
}
.closing-frame .closing p:not(.eyebrow) {
  margin:clamp(12px,2.2svh,25px) auto clamp(16px,3svh,32px);
}
.closing-frame .app-downloads { row-gap:2px; }
.closing-frame .closing-icon {
  width:clamp(36px,7svh,72px);
  height:clamp(36px,7svh,72px);
  margin:clamp(12px,2svh,24px) auto 0;
}
.closing-frame > .site-footer {
  flex:none;
  scroll-snap-align:none;
  scroll-snap-stop:normal;
  padding-block:clamp(12px,2svh,24px);
  padding-bottom:calc(clamp(12px,2svh,24px) + env(safe-area-inset-bottom,0px));
}
@media (max-width:760px) {
  .closing-frame { scroll-margin-top:0; }
}
@media (max-height:520px) {
  .closing-frame .closing { --closing-title-size:clamp(30px,8svh,44px); }
  .closing-frame .closing p:not(.eyebrow) { font-size:clamp(14px,4svh,20px); }
  .closing-frame .closing .store-download { min-height:36px; padding-block:4px; }
  .closing-frame .closing-icon { width:28px; height:28px; margin-top:8px; }
  .closing-frame > .site-footer { padding-top:8px; padding-bottom:calc(8px + env(safe-area-inset-bottom,0px)); }
}

@media (max-width:760px) {
  .use-case-details > #feature-description { text-align:center; }
}

@media (max-width:760px) {
  .use-case-details > .feature-list li { justify-content:center; text-align:center; }
}

@media (max-width:760px) {
  .faq.wrap { width:calc(100% - clamp(56px,14.4vw,80px)); margin-inline:auto; }
}

@media (max-width:760px) {
  .professional-visual { width:calc(100% - clamp(24px,6vw,40px)); margin-inline:auto; }
}

/* Give every part of the mobile possibilities section a shared inset. */
@media (max-width:760px) {
  .possibilities > .wrap { width:calc(100% - clamp(56px,14.4vw,80px)); margin-inline:auto; }
}

/* Compact phone tabs without affecting desktop controls. */
@media (max-width:760px) {
  .possibilities .mode-tabs { max-width:min(100%,300px); gap:2px; }
  .possibilities .mode-tabs button { min-height:30px; padding:6px 3px; font-size:clamp(9px,2.4vw,10px); line-height:1.2; }
}

/* Keep the desktop introduction together without a forced line break. */
@media (min-width:761px) {
  .possibilities .section-heading > p:last-child:not(.eyebrow) {
    max-width:none; white-space:nowrap; font-size:clamp(9px,1.08vw,16px);
  }
  .possibilities .section-heading > p .desktop-break { display:none; }
}

/* Center the visible desktop card against the complete left composition. */
@media (min-width:761px) {
  .possibilities .use-case-panel { align-items:center; }
  .possibilities .use-case-copy { align-self:center; }
  .possibilities .feature-kicker:empty { display:none; }
  .possibilities .example-browser { align-self:center; height:auto; min-height:0 !important; margin-block:0; }
  .possibilities .example-caption[hidden] { display:none; }
}

@media (min-width:761px) and (prefers-reduced-motion:no-preference) {
  .how .step-visual { animation:desktop-walkthrough-float 8s ease-in-out infinite; animation-play-state:paused; }
  .how .step:nth-child(2) .step-visual { animation-delay:-2.6s; }
  .how .step:nth-child(3) .step-visual { animation-delay:-5.2s; }
  .how.how-floating-active .step-visual { animation-play-state:running; }
  @keyframes desktop-walkthrough-float {
    0%,100% { translate:0 4px; }
    50% { translate:0 -4px; }
  }
}

@media (min-width:1101px) {
  .professional-layout { grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); column-gap:clamp(24px,2.5vw,40px); }
  .professional-copy .professional-description { max-width:none; width:100%; }
}

@media (min-width:761px) {
  .use-case-copy .possibilities-link { min-height:38px; padding:9px 18px; font-size:12px; gap:10px; }
  .use-case-copy .possibilities-link .icon { width:16px; height:16px; }
}

@media (min-width:761px) {
  .how .step > p { text-align:center; margin-inline:auto; }
}

/* Source: language.css */
/* A compact, keyboard-accessible switch without changing the page layout. */
.header-actions { display:flex; align-items:center; gap:14px; flex-shrink:0; }
.language-switch { display:flex; align-items:center; gap:4px; flex-shrink:0; }
.language-switch a {
  display:flex; align-items:center; justify-content:center;
  min-width:28px; min-height:44px; padding:4px;
  font-size:11px; font-weight:600; letter-spacing:.04em; color:var(--muted);
  text-underline-offset:5px;
}
.language-switch a[aria-current="page"] { color:var(--ink); text-decoration:underline; }
.language-switch a:hover { color:var(--ink); }
.site-header .nav-wrap { gap:clamp(12px,2vw,28px); }
.site-header .desktop-nav { margin-left:auto; }
html:lang(sv) .closing > .wrap > p:not(.eyebrow) { font-size:calc(var(--closing-title-size) * .36); }
@media (max-width:760px) {
  .header-actions { gap:10px; }
  .language-switch { gap:2px; }
  .language-switch a { font-size:8px; min-width:22px; padding-inline:3px; text-underline-offset:3px; }
  .legal-back { font-size:12px; }
}
@media (max-height:520px) {
  html:lang(sv) .closing-frame .closing > .wrap > p:not(.eyebrow) { font-size:clamp(12px,3.5svh,18px); }
}

/* Desktop overflow navigation stays out of the page layout. */
@media (min-width:761px) {
  .desktop-nav-more { position:relative; border:0; }
  .desktop-nav-more > summary {
    display:flex; align-items:center; justify-content:center; gap:7px;
    min-height:44px; padding:0; font-size:12px; font-weight:500;
    color:var(--ink); white-space:nowrap; list-style:none;
  }
  .desktop-nav-more > summary::-webkit-details-marker { display:none; }
  .desktop-nav-more > summary .icon { width:14px; height:14px; transform:rotate(90deg); }
  .desktop-nav-more[open] > summary .icon { transform:rotate(-90deg); }
  .desktop-nav-more-links {
    position:absolute; top:calc(100% + 8px); right:0;
    width:max-content; min-width:210px; max-width:calc(100vw - 48px);
    max-height:calc(100dvh - 100px); overflow-y:auto;
    padding:10px; border:1px solid #ffffff24; border-radius:16px;
    background:rgba(12,12,14,.97); box-shadow:0 12px 36px #0008;
  }
  .desktop-nav .desktop-nav-more-links a {
    padding:10px 14px; min-height:44px; border-radius:8px;
    font-size:13px; color:#eee; white-space:nowrap;
  }
  .desktop-nav .desktop-nav-more-links a:hover,
  .desktop-nav .desktop-nav-more-links a:focus-visible { background:#ffffff12; color:#fff; }
}

/* Source: story.css */
/* The complete story starts below its heading, using the full section width. */
main > section.our-story { padding-block:clamp(28px,4svh,52px) clamp(20px,3svh,40px); }
.our-story .story-layout { display:block; }
.our-story .section-heading h2 { text-align:left; margin:0 0 clamp(18px,3svh,30px); }
.our-story .story-copy { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; max-width:none; gap:clamp(28px,4vw,64px); }
.our-story .story-column { min-width:0; }
.our-story .story-copy h3 { font-size:clamp(17px,min(1.8vw,2.6svh),23px); line-height:1.18; margin:16px 0 8px; break-after:avoid; }
.our-story .story-copy h3:first-child { margin-top:0; }
.our-story .story-copy p, .our-story .story-copy li { font-size:clamp(13px,min(1.08vw,1.9svh),16px); line-height:1.43; color:var(--muted); orphans:3; widows:3; }
.our-story .story-copy p { break-inside:avoid; }
.our-story .story-copy p + p { margin-top:8px; }
.our-story .story-copy ul { margin:8px 0 12px; padding-left:20px; }
.our-story .story-copy li + li { margin-top:8px; }
@media (max-width:760px) {
 .our-story .story-layout { width:calc(100% - clamp(56px,14.4vw,80px)); margin-inline:auto; }
 .our-story .section-heading h2 { text-align:center; }
 .our-story .story-copy { grid-template-columns:minmax(0,1fr); row-gap:20px; }
 .our-story .story-copy h3, .our-story .story-copy p { text-align:center; }
 .our-story .story-copy h3 { font-size:18px; margin-top:20px; }
 .our-story .story-copy p, .our-story .story-copy li { font-size:13px; line-height:1.48; }
}

.story-toggle { display:none; }
.our-story #story-more-left > h3:first-child { margin-top:16px; }
@media (max-width:760px) {
  .our-story.has-story-toggle:not(.is-story-expanded) .story-more { display:none; }
  .our-story .story-toggle:not([hidden]) {
    display:block; width:fit-content; min-height:40px; margin:22px auto 0;
    padding:9px 20px; border:1px solid #ffffff30; border-radius:999px;
    background:#f5f5f7; color:#111; font:inherit; font-size:12px; font-weight:600;
    cursor:pointer; text-shadow:none;
  }
  .story-toggle:active { background:#dcdce2; }
  .story-toggle:focus-visible { outline:2px solid #2997ff; outline-offset:4px; }
  .our-story #story-more-left > h3:first-child { margin-top:24px; }
}

/* Keep the opening column centered; reveal the rest below it on desktop. */
@media (min-width:761px) {
  .our-story .section-heading h2 { text-align:center; }
  .our-story .story-copy { grid-template-columns:minmax(0,1fr); max-width:800px; margin-inline:auto; }
  .our-story .story-copy h3, .our-story .story-copy p { text-align:center; }
  .our-story.has-story-toggle:not(.is-story-expanded) #story-more-right { display:none; }
  .our-story .story-toggle:not([hidden]) {
    display:block; width:fit-content; min-height:40px; margin:24px auto 0;
    padding:9px 20px; border:1px solid #ffffff30; border-radius:999px;
    background:#f5f5f7; color:#111; font:inherit; font-size:13px; font-weight:600;
    cursor:pointer; text-shadow:none;
  }
  .our-story .story-toggle:focus-visible { outline:2px solid #2997ff; outline-offset:4px; }
  .our-story #story-more-right { margin-top:8px; }
  .our-story #story-more-right ul { width:fit-content; margin-inline:auto; text-align:left; }
}

/* More separation between the desktop story's headings and passages. */
@media (min-width:761px) {
  .our-story .story-layout .section-heading h2 { margin-bottom:clamp(24px,4svh,40px); }
  .our-story .story-copy h3 { margin-top:clamp(24px,3.5svh,36px); margin-bottom:clamp(14px,2svh,20px); }
  .our-story .story-copy h3:first-child { margin-top:0; }
  .our-story #story-more-left > h3:first-child { margin-top:clamp(28px,4svh,40px); }
  .our-story .story-copy p + p { margin-top:clamp(12px,1.8svh,18px); }
  .our-story #story-more-right { margin-top:clamp(24px,4svh,40px); }
}

/* Give each story passage breathing room on phone screens. */
@media (max-width:760px) {
  .our-story .story-copy p + p { margin-top:clamp(20px,3svh,30px); }
}

/* Equal spacing above and below the expanded desktop story control. */
@media (min-width:761px) {
  .our-story.is-story-expanded .story-copy { row-gap:0; }
  .our-story.is-story-expanded .story-toggle:not([hidden]) { margin-top:24px; margin-bottom:0; }
  .our-story.is-story-expanded #story-more-right { margin-top:24px; }
}

@media (min-width:761px) {
  .our-story .story-copy h3 { font-size:clamp(20px,min(2.1vw,3svh),27px); line-height:1.18; }
}

@media (min-width:761px) {
  .our-story.has-story-toggle:not(.is-story-expanded) #story-more-left { display:none; }
}

/* Give the desktop story control equal breathing room on both sides. */
@media (min-width:761px) {
  .our-story .story-toggle:not([hidden]),
  .our-story.is-story-expanded .story-toggle:not([hidden]) {
    margin-top:clamp(40px,6svh,64px);
    margin-bottom:clamp(40px,6svh,64px);
  }
}

/* Consistent story rhythm in every language. */
.our-story .story-origin { font-weight:700; }
@media(min-width:761px) {
 .our-story .story-copy h3 { margin-bottom:clamp(24px,3.5svh,36px); }
 .our-story .story-copy p + p { margin-top:clamp(24px,3.5svh,36px); }
}

/* Expanded reading content must not be pulled to a neighbouring snap target.
   Native page scrolling remains free until the reader closes the story. */
html:has(.our-story.is-story-expanded) { scroll-snap-type:none; }

/* Source: calculator.css */
/* A focused comparison surface: one control, one clear result. */
.savings-calculator .calculator-wrap { max-width:1120px; }
.savings-calculator .section-heading { margin-bottom:clamp(24px,4svh,40px); }
.calculator-panel {
 display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr);
 gap:clamp(32px,5vw,72px); align-items:center;
 padding:clamp(28px,4vw,52px); border:1px solid #ffffff1c;
 border-radius:32px; background:linear-gradient(145deg,#24262b,#151619 65%);
 box-shadow:inset 0 1px 0 #ffffff0d,0 20px 60px #0004;
 font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
 font-optical-sizing:auto; text-shadow:none;
}
.calculator-controls { display:grid; gap:16px; align-content:center; min-width:0; }
.calculator-controls > div { min-width:0; }
.calculator-controls label { display:block; font-size:12px; font-weight:500; color:#a5a5ad; margin-bottom:10px; letter-spacing:.015em; }
.calculator-controls > div:first-child { position:relative; }
.calculator-controls > div:first-child::after {
 content:""; position:absolute; right:20px; bottom:24px; width:7px; height:7px;
 border-right:1.5px solid #c9c9ce; border-bottom:1.5px solid #c9c9ce;
 transform:rotate(45deg); pointer-events:none;
}
.calculator-controls select {
 appearance:none; -webkit-appearance:none; width:100%; min-width:0;
 min-height:56px; padding:14px 42px 14px 18px;
 border:1px solid #ffffff20; border-radius:16px;
 background:#ffffff09; color:#f5f5f7; color-scheme:dark;
 font:inherit; font-size:16px; font-weight:500; line-height:1.4;
 box-shadow:inset 0 1px 0 #ffffff08; cursor:pointer;
 transition:background .15s,border-color .15s;
}
.calculator-controls select:hover { background:#ffffff10; border-color:#ffffff40; }
.calculator-controls select:active { background:#ffffff16; transition:none; }
.calculator-controls select:focus-visible { outline:3px solid #2997ff; outline-offset:4px; }
.calculator-controls select option { background:#202125; color:#f5f5f7; }
.calculator-scope { font-size:15px; font-weight:500; letter-spacing:-.015em; color:#f5f5f7; line-height:1.5; margin-top:4px; }
.calculator-conditions { font-size:12px; line-height:1.55; color:#aaaab2; }
.calculator-source { font-size:11px; line-height:1.55; color:#9898a0; }
.calculator-source a { color:#a9cfff; text-decoration:underline; text-underline-offset:3px; }
.calculator-source a:focus-visible { outline:2px solid #2997ff; outline-offset:3px; border-radius:2px; }
.calculator-checked { display:block; margin-top:3px; }
.calculator-fee { display:flex; align-items:center; justify-content:flex-start; gap:8px; font-size:12px; color:#aaaab2; padding-block:4px; }
.calculator-fee output { white-space:nowrap; font-size:14px; color:#f5f5f7; font-variant-numeric:tabular-nums; }
.calculator-results { display:flex; flex-direction:column; justify-content:center; gap:24px; min-width:0; }
.calculator-cost-heading { display:flex; justify-content:space-between; align-items:baseline; gap:16px; font-size:12px; line-height:1.45; color:#b9b9c0; }
.calculator-cost-heading > span { min-width:0; }
.calculator-cost-heading small { display:block; font-size:10px; color:#92929b; margin-top:3px; }
.calculator-cost-heading output { font-size:21px; font-weight:600; letter-spacing:-.025em; color:#f5f5f7; white-space:nowrap; font-variant-numeric:tabular-nums; }
.calculator-bar { height:7px; background:#ffffff09; border-radius:99px; overflow:hidden; margin-top:12px; }
.calculator-bar > span { display:block; height:100%; border-radius:inherit; background:#7c7d86; transition:width .35s cubic-bezier(.2,.8,.2,1); }
.calculator-bar .calculator-avuksi-bar { background:linear-gradient(90deg,#0071e3,#52acff); }
.calculator-saving { order:-1; text-align:left; padding:0 0 8px; }
.calculator-saving > span { font-size:13px; font-weight:500; color:#a5d8bc; }
.calculator-saving > output {
 display:block; font-size:clamp(44px,4.7vw,64px); line-height:1.1; font-weight:600;
 letter-spacing:-.055em; color:#f5f5f7; margin-top:10px; font-variant-numeric:tabular-nums;
}
.calculator-saving.is-extra-cost > span, .calculator-saving.is-extra-cost > output { color:#ffb780; }
.calculator-saving p { font-size:13px; color:#aaaab2; line-height:1.45; margin-top:10px; }
.calculator-note { color:var(--muted); font-size:11px; line-height:1.5; margin:20px auto 0; max-width:100%; text-align:center; text-wrap:pretty; }
.calculator-error { color:#ffb780; font-size:12px; line-height:1.5; }
@media(max-width:760px) {
 .savings-calculator .calculator-wrap { width:calc(100% - clamp(48px,12vw,72px)); }
 .calculator-panel { grid-template-columns:minmax(0,1fr); padding:clamp(20px,5.5vw,28px); gap:28px; border-radius:26px; }
 .calculator-controls { gap:12px; }
 .calculator-controls select { min-height:52px; padding:12px 34px 12px 14px; font-size:16px; border-radius:13px; }
 .calculator-controls > div:first-child::after { right:16px; bottom:23px; }
 .calculator-scope { font-size:13px; }
 .calculator-conditions { font-size:11px; line-height:1.5; }
 .calculator-results { gap:18px; }
 .calculator-saving { text-align:center; padding-bottom:4px; }
 .calculator-saving > output { font-size:clamp(38px,11vw,48px); margin-top:6px; }
 .calculator-saving > span, .calculator-saving p { font-size:12px; }
 .calculator-saving p { margin-top:6px; }
 .calculator-cost-heading output { font-size:18px; }
 .calculator-note { font-size:10px; }
}
@media(prefers-reduced-motion:reduce) { .calculator-bar > span, .calculator-controls select { transition:none; } }
@media(prefers-reduced-transparency:reduce) { .calculator-panel { background:#1c1c1e; } .calculator-controls select { background:#29292d; } }
@media(prefers-contrast:more) {
 .calculator-panel, .calculator-controls select { border-color:#a5a5ad; }
 .calculator-conditions, .calculator-source, .calculator-cost-heading, .calculator-cost-heading small, .calculator-fee, .calculator-saving p { color:#eee; }
}

@media (max-width:760px) {
 .calculator-controls label[for="calc-service"] { text-align:center; }
}

.calculator-detail-copy { display:grid; gap:16px; }
.calculator-details > summary { display:none; }
@media (max-width:760px) {
  .savings-calculator .section-heading { margin-bottom:16px; }
  .savings-calculator .section-heading > p { margin-top:12px; }
  .calculator-panel { padding:16px 18px; gap:16px; }
  .calculator-controls { gap:8px; }
  .calculator-controls label { margin-bottom:8px; }
  .calculator-controls select { min-height:44px; padding-block:9px; }
  .calculator-controls > div:first-child::after { bottom:20px; }
  .calculator-details > summary {
    display:list-item; padding:8px 0; min-height:36px; font-size:11px;
    color:#a9cfff; cursor:pointer; text-align:center;
  }
  .calculator-details > summary:focus-visible { outline:2px solid #2997ff; outline-offset:3px; }
  .calculator-detail-copy { gap:10px; padding-block:8px; }
  .calculator-results { gap:14px; }
  .calculator-saving { padding-bottom:0; }
  .calculator-saving > output { font-size:clamp(32px,9vw,40px); margin-top:4px; }
  .calculator-saving p { margin-top:4px; font-size:11px; }
  .calculator-cost-heading { font-size:11px; gap:10px; }
  .calculator-cost-heading output { font-size:17px; }
  .calculator-bar { margin-top:8px; height:6px; }
  .savings-calculator .calculator-note { margin-top:12px; }
}

/* Native options retain their full scope; the closed phone field uses a short label. */
.calculator-selected-label { display:none; }
@media (max-width:760px) {
  .calculator-controls select { color:transparent; -webkit-text-fill-color:transparent; }
  .calculator-controls select option { color:#f5f5f7; -webkit-text-fill-color:#f5f5f7; }
  .calculator-selected-label {
    display:flex; position:absolute; inset:auto 0 0; height:44px;
    align-items:center; justify-content:center; padding-inline:32px;
    pointer-events:none; color:#f5f5f7; font-size:clamp(12px,3.5vw,15px);
    line-height:1.2; font-weight:500; text-align:center;
  }
}

/* Source: community.css */
/* Private Avuksi is a coming-soon introduction, with no signup or launch action. */
.private-community .community-wrap { max-width:1120px; }
.private-community .section-heading { margin:0; text-align:center; }
.private-community .section-heading h2.community-wordmark {
 display:flex; align-items:baseline; justify-content:center; gap:.18em;
 font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
 font-size:clamp(48px,min(7vw,10svh),96px); line-height:1.12;
 white-space:nowrap; text-transform:none;
 background:none; color:var(--ink,#fff); -webkit-text-fill-color:currentColor;
}
.community-wordmark-name { font-weight:700; letter-spacing:-.035em; }
.community-wordmark-descriptor { font-size:.34em; font-weight:500; letter-spacing:.055em; }
@media(max-width:760px) {
 .mobile-nav .menu-community-wordmark {
  display:flex; align-items:baseline; justify-content:flex-end; gap:.18em;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:22px; line-height:1.12; white-space:nowrap;
 }
 .menu-community-wordmark .community-wordmark-descriptor { font-size:max(9px,.34em); }
 .menu-community-wordmark .community-wordmark-name { font-size:18px; }
}
.private-community .community-status { display:block; margin-top:20px; color:#a5e9c8; font-size:14px; font-weight:600; letter-spacing:.02em; }
.private-community .community-lead { max-width:760px; margin:28px auto 0; text-align:center; color:var(--muted); font-size:clamp(16px,1.5vw,21px); line-height:1.5; }
.community-benefits { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(28px,4vw,56px); margin-top:clamp(36px,7svh,72px); }
.community-benefits article { min-width:0; text-align:center; }
.community-benefits h3 { font-size:clamp(19px,1.9vw,25px); line-height:1.2; letter-spacing:-.025em; }
.community-benefits p { margin-top:12px; color:var(--muted); font-size:clamp(14px,1.2vw,17px); line-height:1.55; }
@media(min-width:761px) {
 /* Cancel the root's reserved header space at this section boundary.
    Keep a full viewport in normal flow so neither neighbour peeks in. */
 .private-community,
 .private-community > .section-snap-point { scroll-margin-top:-88px; }
 .private-community {
  min-height:100svh;
  min-height:100dvh;
  display:flex;
  align-items:center;
  padding-block:clamp(88px,10svh,128px) clamp(32px,6svh,64px);
 }
}
@media(max-width:760px) {
 .private-community .section-heading h2.community-wordmark { font-size:clamp(36px,9vw,52px); }
 .private-community .community-status { margin-top:16px; font-size:13px; }
 .private-community .community-lead { margin-top:24px; font-size:var(--phone-body,14px); line-height:1.5; }
 .community-benefits { grid-template-columns:minmax(0,1fr); gap:clamp(24px,4svh,36px); margin-top:clamp(28px,5svh,44px); text-align:center; }
 .community-benefits h3 { font-size:clamp(18px,4.8vw,22px); }
 .community-benefits p { max-width:36ch; margin:8px auto 0; font-size:var(--phone-body,14px); }
}
@media(prefers-contrast:more) {
 .private-community .community-status, .private-community .community-lead, .community-benefits p { color:#fff; }
}

/* Light, self-contained motion; no scroll handlers or animated filters. */
.community-icon { display:block; width:48px; height:48px; margin:0 auto 20px; color:#a7dcff; filter:drop-shadow(0 0 9px #70bdff38); }
.community-icon-help { color:#9ae4c3; filter:drop-shadow(0 0 9px #6bd8ab38); }
.community-icon-share { color:#ffd495; filter:drop-shadow(0 0 9px #ffc16c38); }
.community-icon svg { display:block; width:100%; height:100%; overflow:visible; }
.community-icon-motion { transform-origin:24px 24px; animation:community-icon-float 4.8s ease-in-out infinite; animation-play-state:paused; }
.community-icon-help .community-icon-motion { animation-name:community-icon-greet; animation-delay:-1.6s; }
.community-icon-share .community-icon-motion { animation-delay:-3.2s; }
.community-icons-active .community-icon-motion { animation-play-state:running; }
@keyframes community-icon-float { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-4px); } }
@keyframes community-icon-greet { 0%,100% { transform:rotate(-3deg); } 50% { transform:rotate(3deg) translateY(-2px); } }
@media(max-width:760px) {
 .community-icon { width:36px; height:36px; margin:0 auto 12px; }
}
@media(prefers-reduced-motion:reduce) {
 .community-icon-motion { animation:none; }
}
@media(prefers-contrast:more) {
 .community-icon { color:#fff; filter:none; }
}

/* A quiet mint glow that breathes without moving the surrounding layout. */
.private-community .community-status {
 text-shadow:0 0 12px #83e6b95c,0 0 24px #83e6b926;
 transform-origin:center;
 animation:community-status-breathe 3.2s ease-in-out infinite;
 animation-play-state:paused;
}
.private-community.community-icons-active .community-status { animation-play-state:running; }
@keyframes community-status-breathe {
 0%,100% { opacity:.76; transform:scale(1); }
 50% { opacity:1; transform:scale(1.025); }
}
@media(prefers-reduced-motion:reduce) {
 .private-community .community-status { animation:none; opacity:1; transform:none; }
}
@media(prefers-contrast:more) {
 .private-community .community-status { text-shadow:none; }
}

/* A slow, compositor-only breath keeps the closing layout stationary. */
.closing #closing-title,
.private-community #private-community-title {
 transform-origin:center;
 animation:closing-title-breathe 7s ease-in-out infinite;
 animation-play-state:paused;
}
.closing #closing-title.title-pulse-active,
.private-community #private-community-title.title-pulse-active { animation-play-state:running; }
@keyframes closing-title-breathe {
 0%,100% { scale:1; }
 50% { scale:1.035; }
}
@media(prefers-reduced-motion:reduce) {
 .closing #closing-title,
 .private-community #private-community-title { animation:none; scale:1; }
}

/* Source: opportunities.css */
/* Shared landing-page invitation. Keep it beside the existing checklist. */
.use-case-copy .possibilities-link {
  margin-top:clamp(22px,3svh,36px); max-width:100%; min-height:46px;
  padding:12px 19px; gap:12px; font-size:clamp(12px,1vw,15px);
  line-height:1.35; text-align:left;
}
.possibilities-link .icon { flex:none; }
@media(max-width:760px) {
  .use-case-copy .possibilities-link { margin-top:18px; min-height:44px; padding:10px 14px; font-size:11px; gap:8px; }
  .possibilities-link .icon { width:16px; height:16px; }
}

/* The reading page shares the site's materials and type, with native scrolling. */
.opportunities-page { background:#000; color:#f5f5f7; }
.opportunities-page .wrap, .opportunities-page .nav-wrap { width:min(1120px,calc(100% - 64px)); }
.opportunities-page .site-header { background:rgba(0,0,0,.9); }
.opportunities-page .nav-wrap { gap:24px; height:72px; }
.opportunities-page .brand { margin-right:auto; }
.opportunity-back { display:inline-flex; align-items:center; min-height:44px; gap:8px; font-size:13px; }
.opportunity-back .icon { width:18px; }
.opportunity-back:hover { text-decoration:underline; text-underline-offset:4px; }
.opportunities-page .brand-atmosphere > div { animation:none; }
.opportunities-page .atmosphere-mark { opacity:.025; }
.opportunities-page .atmosphere-fog { opacity:.025; }
.opportunity-hero { padding-block:clamp(68px,11vw,140px) clamp(54px,8vw,96px); text-align:center; }
.opportunity-hero h1 {
  max-width:18ch; margin:auto; font-size:clamp(42px,6.7vw,88px);
  line-height:1.04; letter-spacing:-.055em; font-weight:650;
  color:#f5f5f7; text-shadow:0 0 22px #e1e9ff35;
}
.opportunity-hero .opportunity-subtitle { margin:26px auto 0; font-size:clamp(22px,2.5vw,32px); line-height:1.25; font-weight:550; letter-spacing:-.025em; }
.opportunity-intro { max-width:740px; margin:24px auto 0; font-size:clamp(16px,1.6vw,20px); line-height:1.6; color:#c8c8d0; }
.opportunity-soon { margin-top:20px; font-size:13px; color:#a6eaca; }
.opportunity-nav { display:flex; flex-wrap:wrap; justify-content:center; gap:6px 26px; margin-top:32px; }
.opportunity-nav a { display:flex; align-items:center; min-height:44px; font-size:13px; color:#dddde3; text-decoration:underline; text-underline-offset:5px; }
.opportunity-section { padding-block:clamp(44px,7vw,86px); scroll-margin-top:88px; }
.opportunity-section h2 { max-width:20ch; font-size:clamp(32px,4.4vw,58px); line-height:1.08; letter-spacing:-.04em; }
.opportunity-section h3 { font-size:clamp(20px,2vw,26px); line-height:1.2; letter-spacing:-.025em; }
.opportunity-section p { color:#c8c8d0; font-size:clamp(15px,1.4vw,18px); line-height:1.65; }
.opportunity-section p + p { margin-top:16px; }
.opportunity-lead { max-width:820px; margin-top:24px; }
.opportunity-split { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:clamp(32px,6vw,80px); align-items:start; }
.opportunity-prose { max-width:72ch; }
.opportunity-prose h3 { margin-top:36px; }
.opportunity-prose h3 + p { margin-top:16px; }
.opportunity-highlight { display:block; margin-top:24px; color:#f5f5f7; font-size:clamp(17px,1.7vw,22px); line-height:1.5; font-weight:550; }
.opportunity-table-wrap { margin-top:32px; padding:clamp(14px,2.5vw,28px); border:1px solid #555e7080; border-radius:24px; background:linear-gradient(140deg,#29303b99,#090d1499); box-shadow:inset 0 1px 0 #ffffff35,0 0 24px #d9e8ff0a; }
.opportunity-table { width:100%; table-layout:fixed; border-collapse:collapse; font-size:clamp(12px,1.25vw,16px); }
.opportunity-table caption { text-align:left; font-size:20px; line-height:1.3; font-weight:600; margin-bottom:20px; }
.opportunity-table :is(th,td) { padding:15px 8px; text-align:right; vertical-align:top; overflow-wrap:anywhere; }
.opportunity-table th { color:#d5d5df; font-size:.82em; font-weight:500; line-height:1.4; }
.opportunity-table :is(th,td):first-child { text-align:left; width:40%; padding-left:0; }
.opportunity-table :is(th,td):last-child { padding-right:0; }
.opportunity-table td { color:#fff; }
.opportunity-table .saving { color:#a6eaca; font-weight:600; }
.opportunity-section .opportunity-note { font-size:12px; line-height:1.6; color:#b4b4c2; margin-top:20px; }
.opportunity-section .opportunity-total { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:12px; margin-top:22px; color:#dddde5; font-size:14px; }
.opportunity-total strong { font-size:clamp(28px,4vw,42px); line-height:1.1; color:#a6eaca; letter-spacing:-.04em; }
.opportunity-link { display:inline-flex; align-items:center; gap:10px; min-height:44px; margin-top:22px; color:#fff; font-size:14px; font-weight:550; text-decoration:underline; text-underline-offset:5px; }
.opportunity-categories { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:38px 68px; margin-top:40px; }
.opportunity-categories article { min-width:0; }
.opportunity-categories h3 { color:#b1d9ff; }
.opportunity-categories article:nth-child(3n+2) h3 { color:#cbb7ff; }
.opportunity-categories article:nth-child(3n) h3 { color:#a6eaca; }
.opportunity-categories p { margin-top:12px; }
.opportunity-future { margin-top:44px; max-width:900px; }
.opportunity-future h3 { color:#c9c9d1; }
.opportunity-future p { margin-top:12px; }
.opportunity-roles { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 30px; margin:26px 0 0; padding:0; list-style:none; color:#d8d8df; font-size:15px; line-height:1.6; }
.opportunity-roles li { padding-left:18px; position:relative; }
.opportunity-roles li::before { content:'·'; position:absolute; left:0; color:#a6eaca; }
.opportunity-journey { list-style:none; margin:0; padding:0; display:grid; gap:28px; }
.opportunity-journey p { margin-top:8px; }
.opportunity-close { padding-block:clamp(60px,10vw,120px) 48px; text-align:center; }
.opportunity-close h2 { max-width:18ch; margin:auto; font-size:clamp(34px,5vw,64px); line-height:1.08; letter-spacing:-.045em; }
.opportunity-close p { max-width:700px; margin:24px auto 0; color:#c8c8d0; font-size:clamp(16px,1.6vw,20px); line-height:1.6; }
.opportunity-close .button { margin-top:28px; font-size:14px; }
.opportunities-page .site-footer { padding-block:24px; }
.opportunities-page .site-footer > div { display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:12px 24px; }
.opportunities-page :is(a,summary):focus-visible { outline:2px solid #91c4ff; outline-offset:5px; }
@media(max-width:760px) {
  .opportunities-page .wrap, .opportunities-page .nav-wrap { width:calc(100% - clamp(56px,14.4vw,80px)); }
  .opportunities-page .nav-wrap { height:64px; gap:12px; }
  .opportunity-back { font-size:11px; }
  .opportunity-back .icon { display:none; }
  .opportunity-hero { padding-top:64px; }
  .opportunity-hero h1 { font-size:clamp(36px,9vw,56px); }
  .opportunity-hero .opportunity-subtitle { font-size:22px; }
  .opportunity-nav { gap:0 20px; margin-top:24px; }
  .opportunity-split, .opportunity-categories { grid-template-columns:minmax(0,1fr); gap:32px; }
  .opportunity-section h2 { text-align:center; margin-inline:auto; }
  .opportunity-section { scroll-margin-top:76px; }
  .opportunity-table-wrap { border-radius:20px; padding:16px 12px; }
  .opportunity-table { font-size:12px; }
  .opportunity-table :is(th,td) { padding:12px 5px; }
  .opportunity-table :is(th,td):first-child { width:36%; }
  .opportunity-roles { grid-template-columns:minmax(0,1fr); gap:12px; }
  .opportunities-page .atmosphere-bloom, .opportunities-page .atmosphere-fog { display:none; }
  .opportunities-page .site-footer > div { font-size:10px; gap:12px 16px; }
}
@media(prefers-reduced-motion:reduce) { html:has(.opportunities-page) { scroll-behavior:auto; } }
@media(prefers-contrast:more) { .opportunities-page p, .opportunity-nav a, .opportunity-table th { color:#fff; } }

/* A compact extra route to the possibilities page at the phone's closing frame. */
.closing .closing-options { display:none; }
@media(max-width:760px) {
  .closing .closing-options {
    display:inline-flex; justify-content:center; align-items:center;
    max-width:100%; min-height:44px; margin:20px auto 0;
    padding:10px 14px; gap:8px; font-size:11px; line-height:1.35;
    text-align:center;
  }
  .closing-options .icon { width:16px; height:16px; flex:none; }
}

@media(max-width:760px) {
  .opportunity-nav {
    display:grid; grid-template-columns:repeat(6,minmax(0,1fr));
    gap:8px clamp(6px,2vw,14px); max-width:560px; margin-inline:auto;
  }
  .opportunity-nav a { grid-column:span 2; justify-content:center; text-align:center; font-size:clamp(11px,3.2vw,13px); }
  .opportunity-nav a:nth-child(1) { grid-area:2 / 1 / auto / span 3; white-space:nowrap; position:relative; left:clamp(24px,7.5vw,36px); }
  .opportunity-nav a:nth-child(2) { grid-area:1 / 3 / auto / span 2; }
  .opportunity-nav a:nth-child(3) { grid-area:1 / 5 / auto / span 2; }
  .opportunity-nav a:nth-child(4) { grid-area:1 / 1 / auto / span 2; }
  .opportunity-nav a:nth-child(5) { grid-area:2 / 4 / auto / span 3; }
}

/* Useful service answers share the reading page's native, responsive layout. */
.service-answers { margin-top:32px; max-width:900px; }
.service-answer { scroll-margin-top:88px; border-bottom:1px solid #ffffff20; }
.service-answer summary { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:24px 0; color:#f5f5f7; font-size:clamp(17px,1.7vw,22px); line-height:1.4; cursor:pointer; list-style:none; }
.service-answer summary::-webkit-details-marker { display:none; }
.service-answer summary .icon { width:18px; height:18px; }
.service-answer[open] summary .icon { transform:rotate(45deg); }
.service-answer > p { max-width:75ch; margin:0; padding:0 0 24px; }
@media(max-width:760px) {
  .service-answer { scroll-margin-top:76px; }
  .service-answer summary { padding-block:20px; }
}

/* Source: waitlist.css */
/* The waitlist is revealed by a native, keyboard-accessible disclosure. */
.closing-frame .waitlist-disclosure {
  width:min(100%,480px);
  margin:clamp(48px,8svh,96px) auto 0;
  border:0;
  text-align:center;
}
.waitlist-disclosure > .waitlist-toggle {
  display:inline-flex; align-items:center; justify-content:center;
  min-height:44px; padding:12px 24px;
  border:1px solid #eee; border-radius:999px;
  background:#f5f5f7; color:#111;
  font-size:14px; line-height:1.3; font-weight:600; letter-spacing:0;
  text-shadow:none; list-style:none; cursor:pointer; touch-action:manipulation;
}
.waitlist-toggle::-webkit-details-marker { display:none; }
.waitlist-toggle::marker { content:""; }
.waitlist-disclosure > .waitlist-toggle:hover { background:#fff; }
.waitlist-disclosure > .waitlist-toggle:active { background:#e5e5e8; }
.closing-frame .waitlist {
  width:min(100%, 480px);
  margin:24px auto 0;
  text-align:left;
  text-shadow:none;
}
.closing-frame .closing .waitlist h3 {
  margin:0 0 10px;
  color:#fff;
  font-size:clamp(16px,1.5vw,20px);
  line-height:1.3;
  letter-spacing:-.02em;
  text-align:center;
}
.waitlist label { display:block; margin-bottom:6px; font-size:12px; color:#d2d2d7; }
.waitlist-controls { display:flex; gap:8px; }
.waitlist input[type="email"] {
  flex:1; min-width:0; width:100%; min-height:44px;
  border:1px solid #66666b; border-radius:12px; padding:10px 12px;
  background:rgba(20,20,24,.85); color:#fff;
  font:inherit; font-size:16px; line-height:1.3; box-shadow:none;
}
.waitlist button {
  flex:none; min-height:44px; padding:10px 15px;
  border:1px solid #eee; border-radius:12px;
  background:#f5f5f7; color:#111; font:inherit;
  font-size:13px; line-height:1.3; font-weight:600; cursor:pointer;
}
.waitlist button:hover { background:#fff; }
.waitlist button:disabled { cursor:default; opacity:.7; }
.waitlist :is(input,button,a):focus-visible { outline:2px solid #80bbff; outline-offset:4px; }
.closing-frame .closing .waitlist p {
  max-width:none; margin:8px 0 0; font-size:11px; line-height:1.45;
  letter-spacing:0; color:#b9b9c2; text-shadow:none; text-align:center;
}
.waitlist a { color:inherit; text-decoration:underline; text-underline-offset:2px; }
.closing-frame .closing .waitlist-status { min-height:1.45em; margin-top:6px; color:#fff; font-size:12px; }
.closing-frame .closing .waitlist-status[data-state="error"] { color:#ffb5b5; }
.waitlist-trap { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
/* Compact forms sit directly beneath either set of download buttons. */
.hero-copy .waitlist.launch-waitlist,
.closing .waitlist.launch-waitlist {
  position:relative; width:min(100%,420px); margin:16px auto 0;
  padding:0; text-align:left; text-shadow:none; pointer-events:auto;
}
.waitlist.launch-waitlist[hidden] { display:none; }
.hero-copy .waitlist.launch-waitlist h3,
.closing .waitlist.launch-waitlist h3 {
  margin:0 0 10px; font-size:16px; line-height:1.3; color:#fff;
  text-align:center; letter-spacing:-.02em;
}
.hero-copy .waitlist.launch-waitlist p,
.closing .waitlist.launch-waitlist p {
  max-width:none; margin:8px 0 0; padding:0; font-size:11px;
  line-height:1.45; color:#b9b9c2; text-align:center; letter-spacing:0;
}
.waitlist.launch-waitlist .waitlist-status:empty { display:none; }
.hero-copy .waitlist.launch-waitlist .waitlist-status[data-state="error"],
.closing .waitlist.launch-waitlist .waitlist-status[data-state="error"] { color:#ffb5b5; }
@media (max-width:760px) {
  .waitlist-disclosure > .waitlist-toggle { min-height:40px; padding:8px 16px; font-size:12px; }
  .closing-frame .waitlist { width:min(100%,400px); }
  .closing-frame .closing .waitlist h3 { font-size:16px; }
  .waitlist button { padding-inline:12px; font-size:12px; }
}
@media (max-height:700px) {
  .closing-frame > .closing { padding-block:12px 6px; }
  .closing-frame .closing h2 { font-size:clamp(32px,8svh,55px); }
  .closing-frame .closing > .wrap > p { margin:10px auto 12px; font-size:clamp(16px,3.5svh,24px); }
  .closing-frame .closing-icon { width:32px; height:32px; margin-top:8px; }
  .closing-frame .waitlist-disclosure { margin-top:40px; }
  .closing-frame .waitlist { margin-top:16px; }
  .closing-frame > .site-footer { padding-block:8px; padding-bottom:calc(8px + env(safe-area-inset-bottom,0px)); }
}

/* Source: cookie-consent.css */
.consent-banner[hidden], .consent-warning[hidden] { display:none; }
.consent-banner {
  position:fixed; z-index:1000; inset:auto 16px 16px; width:min(760px,calc(100% - 32px)); margin-inline:auto;
  max-height:60svh; overflow-y:auto; padding:22px; color:#f5f5f7; background:#111216f5;
  border:1px solid #62636c; border-radius:20px; box-shadow:0 12px 50px #0009,0 0 20px #dce6ff12;
  text-align:left; font-family:system-ui,sans-serif; padding-bottom:calc(22px + env(safe-area-inset-bottom,0px));
}
.consent-banner h2, .consent-dialog h2 { margin:0; color:#fff; font-size:21px; line-height:1.25; letter-spacing:-.02em; text-shadow:none; }
.consent-banner p, .consent-dialog p { margin:10px 0 0; color:#d0d0d7; font-size:13px; line-height:1.55; letter-spacing:0; text-shadow:none; }
.consent-banner a, .consent-dialog a { text-decoration:underline; text-underline-offset:3px; }
.consent-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; }
.consent-actions button, .consent-dialog-close {
  min-height:44px; border:1px solid #a3a3ae; border-radius:10px; background:#24252c; color:#fff;
  font:600 13px/1.3 system-ui,sans-serif; padding:10px 16px; cursor:pointer;
}
.consent-actions button:hover, .consent-dialog-close:hover { background:#383941; }
.consent-actions button:active { background:#45464f; }
.consent-dialog { width:min(560px,calc(100% - 32px)); max-height:85svh; padding:26px; border:1px solid #62636c; border-radius:22px; background:#111216; color:#fff; box-shadow:0 20px 80px #000a; }
.consent-dialog::backdrop { background:#000a; }
.consent-dialog-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.consent-dialog-close { font-size:22px; padding:6px 12px; flex:none; }
.consent-category { margin-top:24px; }
.consent-category label { display:flex; align-items:flex-start; gap:12px; font-size:15px; line-height:1.5; font-weight:600; }
.consent-category input { width:20px; height:20px; margin:1px 0 0; accent-color:#b9d9ff; flex:none; }
.consent-category p { margin-left:32px; }
.consent-settings-link { border:0; padding:0; background:none; color:inherit; font:inherit; cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
.consent-settings-link:hover { color:#fff; }
.consent-warning { text-align:center; padding:8px 16px; color:#fff; font:12px/1.5 system-ui,sans-serif; }
:is(.consent-banner,.consent-dialog) :is(button,input,a):focus-visible, .consent-settings-link:focus-visible { outline:2px solid #9ac9ff; outline-offset:4px; }
@media(max-width:760px) {
  .consent-banner { inset:auto 10px 10px; width:calc(100% - 20px); padding:18px; padding-bottom:calc(18px + env(safe-area-inset-bottom,0px)); border-radius:16px; }
  .consent-banner h2 { font-size:19px; }
  .consent-banner p { font-size:12px; }
  .consent-banner .consent-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-top:14px; }
  .consent-banner .consent-actions button { padding:9px 8px; font-size:12px; }
  .consent-banner .consent-actions button:last-child { grid-column:1 / -1; }
  .consent-dialog { padding:20px; }
}
@media(prefers-contrast:more) { .consent-banner,.consent-dialog { background:#000; border-color:#fff; } .consent-banner p,.consent-dialog p { color:#fff; } }

/* Source: phone-frames.css */
/* Phone-only full-screen frames. Natural content height is never clipped.
   Stable viewport units avoid relayout while browser toolbars animate. */
@media (max-width:760px) {
  :root {
    --phone-frame:100svh;
    --phone-frame-pad:clamp(24px,4svh,40px);
  }
  main > section:not(.hero):not(.confidence),
  .reveal-track > .possibilities {
    box-sizing:border-box;
    min-height:var(--phone-frame);
    height:auto;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding-block:calc(var(--phone-frame-pad) + env(safe-area-inset-top,0px)) calc(var(--phone-frame-pad) + env(safe-area-inset-bottom,0px));
  }
  main > section:not(.hero) > *,
  .reveal-track > .possibilities > * { flex-shrink:0; }
  main > section.confidence { padding:0; min-height:var(--phone-frame); }
  .confidence .confidence-inner {
    box-sizing:border-box;
    min-height:var(--phone-frame);
    height:auto;
    align-content:center;
    padding-block:calc(var(--phone-frame-pad) + env(safe-area-inset-top,0px)) calc(var(--phone-frame-pad) + env(safe-area-inset-bottom,0px));
  }
  /* These rows used to consume a whole viewport beneath the heading,
     leaving no free space for the complete composition to center. */
  .how .steps { min-height:0; grid-template-rows:repeat(3,minmax(min-content,auto)); gap:clamp(24px,5svh,48px); }
  .faq .faq-list { width:100%; }
  .closing-frame { min-height:var(--phone-frame); height:auto; }
  .closing-frame > .closing { flex:1 0 auto; justify-content:center; }
}

@media (max-width:760px) {
  .possibilities .possibilities-link { display:none; }
}

@media (max-width:760px) {
  .possibilities .mode-tabs { margin-top:clamp(20px,3svh,28px); margin-bottom:clamp(28px,4.5svh,44px); }
}

@media (max-width:760px) {
  .possibilities .mode-tabs { max-width:min(100%,252px); }
  .possibilities .mode-tabs button { min-height:26px; padding:4px 3px; font-size:clamp(8px,2.2vw,9px); }
}

@media (max-width:760px) {
  .closing-frame .closing .closing-options {
    min-height:30px; padding:6px 12px; font-size:9px; gap:6px;
    margin:clamp(32px,5svh,48px) auto 0;
  }
  .closing-frame .closing-options .icon { width:12px; height:12px; }
  .closing-frame .waitlist-disclosure { margin-top:16px; }
  .closing-frame .waitlist-disclosure > .waitlist-toggle {
    min-height:30px; padding:6px 14px; font-size:9px;
  }
}

@media (max-width:760px) {
  .possibilities .use-case-panel > .feature-list {
    width:max-content; max-width:100%; margin:0 auto; align-self:start;
  }
  .possibilities .use-case-panel > .feature-list li {
    justify-content:flex-start; text-align:left;
  }
}

/* One shared gap on both sides of the phone's nearby card. */
@media (max-width:760px) {
  .possibilities .use-case-panel { row-gap:clamp(44px,6svh,60px); }
  .possibilities .use-case-copy { padding-bottom:0; }
  .possibilities .use-case-details { margin-bottom:0; padding-bottom:0; }
  .possibilities #feature-description { margin-bottom:0; padding-bottom:0; }
  .possibilities .use-case-panel > .feature-list { margin-block:0; padding-block:0; }
  .possibilities .use-case-panel > .feature-list li:first-child { margin-top:0; }
  .possibilities .use-case-panel > .feature-list li:last-child { margin-bottom:0; }
}

@media (max-width:760px) {
  .possibilities #feature-title { text-align:center; width:100%; max-width:100%; margin-inline:auto; grid-template-columns:minmax(0,1fr); justify-items:stretch; }
  .possibilities #feature-title > span { text-align:center; width:100%; justify-self:stretch; }
}

/* Keep each description anchored in its shared tab footprint. */
@media (max-width:760px) {
  .possibilities #feature-description { display:block; }
}

@media (max-width:760px) {
  .how.wrap { width:calc(100% - clamp(56px,14.4vw,80px)); margin-inline:auto; }
  .how .step { column-gap:clamp(10px,2.8vw,16px); }
}

@media (max-width:760px) {
  .savings-calculator .calculator-note { font-size:8px; line-height:1.4; width:calc(100% - 28px); max-width:64ch; margin-inline:auto; text-wrap:balance; }
}

/* Keep the touch-scroll scene on a small compositor budget. */
@media (max-width:760px) {
  .scene-device { will-change:transform; }
  .device-shell span { display:none; }
  .device-shell span:nth-child(1), .device-shell span:nth-child(8),
  .device-shell span:nth-child(16), .device-shell span:nth-child(24) { display:block; }
  .device-shell span:first-child { box-shadow:inset 0 0 0 1px #a5aab1, 2px 8px 16px #0008; }
  .scene-ring, .scene-grid { display:none; }
  .has-scene-motion .hero-cinema.phones-departing .scene-device { animation-play-state:paused; }
}

@media (max-width:760px) {
  .professional-visual .professional-request { width:90%; margin-inline:auto; justify-self:center; }
}

@media (max-width:760px) {
  .possibilities .feature-list { font-size:clamp(13px,3.7vw,16px); line-height:1.5; }
  .possibilities .feature-list .icon { width:20px; height:20px; flex:none; }
  .possibilities .use-case-panel > .feature-list li { gap:10px; }
}

@media (max-width:760px) {
  .possibilities .example-card { min-height:var(--example-card-height,66px); }
}

@media (max-width:760px) {
  .professional-layout { --professional-card-gap:var(--phone-gap); gap:var(--professional-card-gap); }
  .professional-layout .professional-visual { gap:var(--professional-card-gap); }
}

@media (max-width:760px) and (prefers-reduced-motion:no-preference) {
  .how .step-visual {
    animation:phone-walkthrough-float 7s ease-in-out infinite;
    animation-play-state:paused;
  }
  .how .step:nth-child(2) .step-visual { animation-delay:-2.3s; }
  .how .step:nth-child(3) .step-visual { animation-delay:-4.6s; }
  .how.how-floating-active .step-visual { animation-play-state:running; }
  @keyframes phone-walkthrough-float {
    0%,100% { translate:0 1.5px; }
    50% { translate:0 -1.5px; }
  }
}

/* Give the safety introduction and each item room on compact screens. */
@media (max-width:760px) {
  .confidence .confidence-copy > p:last-child { margin-top:clamp(30px,5svh,44px); }
  .confidence .confidence-inner { row-gap:clamp(40px,6svh,56px); }
  .confidence .confidence-features,
  .confidence .confidence-extra-features { gap:clamp(32px,5svh,48px); }
}

/* Keep closing actions and footer together in the visible phone viewport. */
@media (max-width:760px) {
  .closing-frame {
    box-sizing:border-box;
    min-height:100svh;
    display:grid;
    grid-template-rows:minmax(min-content,1fr) auto;
    align-content:stretch;
  }
  .closing-frame > .closing {
    min-height:0;
    padding-block:clamp(12px,2svh,20px);
  }
  .closing-frame > .site-footer {
    align-self:end;
    margin-top:0;
    padding-top:12px;
    padding-bottom:calc(12px + env(safe-area-inset-bottom,0px));
    scroll-snap-align:none;
    scroll-snap-stop:normal;
  }
}

/* A single resting frame below the persistent header, at every screen size.
   Clip decorative overflow only; natural section height still grows with text. */
:root {
  --section-header-height:64px;
  --section-viewport:100svh;
  --section-frame:calc(var(--section-viewport) - var(--section-header-height));
}
@media (min-width:761px) {
  @supports (height:100dvh) {
    :root { --section-viewport:100dvh; }
  }
}
html { scroll-padding-top:var(--section-header-height); }
main > section:not(.hero), .reveal-track > .possibilities {
  box-sizing:border-box;
  min-height:var(--section-frame);
  overflow:clip;
  scroll-margin-top:0;
}
.confidence .confidence-inner { min-height:var(--section-frame); box-sizing:border-box; }
.closing-frame {
  min-height:var(--section-frame);
  scroll-margin-top:0;
  overflow:clip;
}
@media (max-width:760px) {
  :root {
    --section-header-height:60px;
    --phone-frame:var(--section-frame);
    --phone-balanced-pad:calc(var(--phone-frame-pad) + max(env(safe-area-inset-top,0px),env(safe-area-inset-bottom,0px)));
  }
  @supports (height:100lvh) {
    /* Stable upstream section heights prevent Safari's toolbar animation
       from moving the final frame and triggering another native snap. */
    :root { --section-viewport:100lvh; }
  }
  main > section:not(.hero):not(.confidence), .reveal-track > .possibilities {
    padding-block:var(--phone-balanced-pad);
    justify-content:center;
  }
  main > section.confidence { padding:0; }
  .confidence .confidence-inner {
    padding-block:var(--phone-balanced-pad);
    align-content:center;
  }
  /* Fit the footer even with browser bars visible. This minimum stays fixed
     during a swipe; expanded signup forms can still grow in normal flow. */
  .closing-frame { min-height:calc(100svh - var(--section-header-height)); }
  .closing-frame > .site-footer { scroll-snap-align:none; }
}

/* Center the collapsed story in the space below the persistent navigation. */
main > section.our-story {
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding-block:clamp(16px,3svh,32px);
}
.our-story .story-layout { flex:none; }
.our-story .section-heading h2 { margin-bottom:clamp(14px,2.5svh,26px); }
.our-story:not(.is-story-expanded) .story-copy :is(p,li) {
  font-size:var(--story-fit-size,clamp(12px,1.65svh,16px));
  line-height:1.4;
}
@media (max-width:760px) {
  main > section.our-story { padding-block:clamp(16px,3svh,24px); }
  .our-story:not(.is-story-expanded) .story-copy :is(p,li) {
    font-size:var(--story-fit-size,clamp(11px,min(3.2vw,1.65svh),13px));
    line-height:1.4;
  }
  .our-story .story-toggle:not([hidden]) { min-height:36px; margin-top:16px; padding-block:7px; }
}

/* One contained, stable departure stage. Following sections stay in flow. */
@media (prefers-reduced-motion:no-preference) {
  .has-scene-motion .hero {
    overflow:clip;
    background:#000;
    --departure-stage-height:calc(100svh - var(--section-header-height));
    --departure-distance:clamp(900px,150svh,1800px);
  }
  .has-scene-motion .hero-story {
    height:calc(var(--departure-stage-height) + var(--departure-distance));
    min-height:0;
  }
  .has-scene-motion .hero-cinema {
    position:sticky;
    top:var(--scene-header,var(--section-header-height));
    height:var(--departure-stage-height);
    min-height:0;
    max-height:none;
  }
  .has-scene-motion .reveal-track {
    margin-top:0;
    height:auto;
    scroll-margin-top:0;
  }
  .has-scene-motion .reveal-track .possibilities {
    position:relative;
    top:auto;
    opacity:1;
    will-change:auto;
  }
  .has-scene-motion .reveal-track > .section-snap-point {
    top:var(--snap-offset,0px);
    scroll-margin-top:0;
  }
}
@media (max-width:760px) and (prefers-reduced-motion:no-preference) {
  .has-scene-motion .hero { --departure-distance:clamp(700px,140svh,1300px); }
  .has-scene-motion .hero-cinema.phones-departing .scene-device { animation-play-state:paused; }
}

/* Expanded pricing details start higher, retaining room for the note below. */
@media (max-width:760px) {
  main > section.savings-calculator:has(.calculator-details[open]) {
    justify-content:flex-start;
    padding-top:12px;
    padding-bottom:24px;
  }
  .savings-calculator:has(.calculator-details[open]) .section-heading { margin-bottom:12px; }
  .savings-calculator:has(.calculator-details[open]) .calculator-panel { gap:12px; }
  .savings-calculator:has(.calculator-details[open]) .calculator-detail-copy { gap:8px; padding-block:6px; }
  .savings-calculator:has(.calculator-details[open]) .calculator-results { gap:10px; }
}

/* A consistent phone rhythm: related content stays grouped instead of stretching. */
@media (max-width:760px) {
  :root { --phone-section-top:clamp(28px,4svh,36px); --phone-content-gap:32px; }
  main > section:not(.hero):not(.confidence), .reveal-track > .possibilities {
    justify-content:flex-start;
    padding-block:var(--phone-section-top);
    gap:var(--phone-content-gap);
  }
  .possibilities > .wrap, .professionals > .wrap,
  .savings-calculator > .wrap, .private-community > .community-wrap {
    display:flex; flex-direction:column; gap:var(--phone-content-gap);
    min-height:0; justify-content:flex-start;
  }
  .possibilities .section-heading, .how > .section-heading,
  .savings-calculator .section-heading, .professional-copy.section-heading,
  .our-story .section-heading, .faq .faq-intro { margin-block:0; }
  .possibilities .mode-tabs { margin-top:20px; margin-bottom:28px; }
  .possibilities .use-case-panel { row-gap:32px; }
  .how .steps {
    flex:none; margin-block:0; min-height:0;
    gap:40px; align-content:start;
    grid-template-rows:repeat(3,minmax(min-content,auto));
  }
  .professional-layout { min-height:0; align-content:start; row-gap:32px; }
  .professional-layout .professional-visual { gap:24px; }
  .confidence .confidence-inner {
    padding-block:var(--phone-section-top); align-content:start; row-gap:32px;
  }
  .confidence .confidence-copy > p:last-child { margin-top:24px; }
  .confidence .confidence-features, .confidence .confidence-extra-features { gap:28px; }
  .our-story .story-layout { flex:none; display:flex; flex-direction:column; gap:28px; }
  .our-story .section-heading h2 { margin-bottom:0; }
  .our-story .story-copy p + p { margin-top:20px; }
  .faq .faq-list { flex:none; display:block; }
  .community-benefits { margin-top:0; row-gap:32px; }
}

@media (max-width:760px) {
  .possibilities .use-case-panel > .closing-options {
    display:flex; width:fit-content; max-width:100%; justify-self:center;
    min-height:34px; padding:8px 14px; font-size:10px; gap:8px;
    margin:0 auto; white-space:normal; text-align:center;
  }
  .possibilities .closing-options .icon { width:14px; height:14px; flex:none; }
}

/* The opening viewport is one snap area, not the whole departure runway.
   Native momentum animates through the phones and settles at the next section. */
.hero { scroll-snap-align:none; }
.hero-story { position:relative; }
.hero-story::before,
.has-scene-motion .hero-story::before {
  content:'';
  display:block;
  position:absolute;
  inset:0 0 auto;
  height:calc(100svh - var(--section-header-height));
  pointer-events:none;
  scroll-snap-align:start;
  scroll-snap-stop:always;
}
@media (max-width:760px) {
  .hero { scroll-snap-align:none; }
  .hero-story::before, .has-scene-motion .hero-story::before { content:''; display:block; }
}

/* Story copy uses the same readable body scale as other phone sections. */
@media (max-width:760px) {
  .our-story .story-copy :is(p,li),
  .our-story:not(.is-story-expanded) .story-copy :is(p,li) {
    font-size:var(--phone-body); line-height:1.45;
  }
}

.professional-opportunities-link {
  width:fit-content; max-width:100%; margin-top:24px;
  min-height:38px; padding:10px 16px; font-size:12px; line-height:1.4;
  gap:10px; white-space:normal;
}
.professional-opportunities-link .icon { width:16px; height:16px; flex:none; }
@media (max-width:760px) {
  .professional-layout > .professional-opportunities-link {
    justify-self:center; margin:0 auto; text-align:center;
    font-size:10px; padding:9px 14px; min-height:34px;
  }
}

/* Keep the mode controls close to their introduction, with more room below. */
@media (max-width:760px) {
  .possibilities > .wrap { gap:0; }
  .possibilities .section-heading > p { margin-bottom:0; }
  .possibilities .mode-tabs { margin-top:12px; margin-bottom:28px; }
  .possibilities .use-case-panel { row-gap:24px; }
  .possibilities .use-case-details { margin-top:18px; }
  .possibilities .use-case-panel > .closing-options { margin-top:0; }
}

@media (max-width:760px) {
  .confidence .confidence-copy > p { text-align:center; margin-inline:auto; }
}

@media (min-width:761px) {
  .professionals .professional-opportunities-link {
    min-height:48px; padding:12px 22px; font-size:16px; gap:12px;
    background:linear-gradient(135deg,#edf1ff,#cbd6fa);
    color:#000; border:1px solid #b7c8ff;
    box-shadow:inset 0 1px 0 #ffffffb3,0 0 16px #4169e12e;
  }
  .professionals .professional-opportunities-link .icon { width:20px; height:20px; }
  .professionals .professional-opportunities-link:hover { background:linear-gradient(135deg,#dfe7ff,#bacbf6); }
  .professionals .professional-opportunities-link:active { background:#b8c9f4; }
}

@media (max-width:760px) {
  .savings-calculator .section-heading > p { margin-top:28px; }
}

/* Reclaim the calculator's outer whitespace for its always-visible note. */
@media (max-width:760px) {
  main > section.savings-calculator,
  main > section.savings-calculator:has(.calculator-details[open]) {
    padding-top:8px; padding-bottom:16px;
  }
  .savings-calculator > .wrap { gap:12px; }
  .savings-calculator .section-heading,
  .savings-calculator:has(.calculator-details[open]) .section-heading { margin-bottom:0; }
  .savings-calculator .calculator-note { margin-top:0; margin-bottom:0; }
}

/* Private features read as left-aligned rows, with icons in a right rail. */
@media (max-width:760px) {
  .private-community .community-wrap { width:calc(100% - 48px); margin-inline:auto; }
  .private-community .community-lead { text-align:center; margin-inline:auto; max-width:none; }
  .private-community .community-benefits { gap:32px; }
  .private-community .community-benefits article {
    display:grid; grid-template-columns:minmax(0,1fr) 36px;
    column-gap:6px; padding-right:28px; row-gap:8px; text-align:left; align-items:start;
  }
  .private-community .community-benefits .community-icon {
    grid-column:2; grid-row:1 / 3; align-self:center;
    width:36px; height:36px; margin:0; justify-self:end;
  }
  .private-community .community-benefits h3 { grid-column:1; grid-row:1; margin:0; text-align:left; }
  .private-community .community-benefits p { grid-column:1; grid-row:2; margin:0; max-width:none; text-align:left; }
}

@media (max-width:760px) {
  .our-story .story-layout > .section-heading,
  .our-story .story-layout > .section-heading h2 {
    width:100%; max-width:none; text-align:center; margin-inline:auto;
  }
}

@media (min-width:761px) {
  .how .step > h3 { width:100%; text-align:center; margin-inline:auto; justify-self:center; }
}

@media (max-width:760px) {
  .private-community .community-wrap { row-gap:20px; }
  .private-community .community-lead { margin-top:0; }
}

@media (min-width:761px) {
  .possibilities .section-heading h2 { font-size:var(--desktop-title); line-height:1.08; }
}

@media (max-width:760px) {
  .professional-layout > .professional-opportunities-link { margin-top:-16px; }
}

/* The desktop action and neighbouring card share a common bottom edge. */
@media (min-width:761px) {
  .possibilities .use-case-panel { align-items:stretch; }
  .possibilities .use-case-copy { align-self:stretch; display:flex; flex-direction:column; padding-bottom:0; }
  .possibilities .use-case-copy .possibilities-link { align-self:flex-start; margin-top:auto; margin-bottom:0; }
  .possibilities .example-browser { align-self:end; margin-bottom:0; }
}

@media (max-width:760px) {
  .private-community .community-benefits :is(h3,p) { padding-left:12px; }
}

/* A single departure viewport, with an uninterrupted native scroll runway. */
@media(prefers-reduced-motion:no-preference) {
 .has-scene-motion .hero { --departure-distance:clamp(420px,80svh,900px); }
 .has-scene-motion .scene-world { transition:none; }
}
@media(min-width:761px) {
 /* Both opaque layers fade into the same page-wide atmosphere.
    The sticky scene must not cover the hero fade with solid black. */
 .hero { --hero-edge-fade:clamp(180px,24svh,300px); }
 .hero, .has-scene-motion .hero, .hero .scene-light {
  background:linear-gradient(to bottom,#000 calc(100% - var(--hero-edge-fade)),transparent 100%);
 }
 .possibilities .use-case-copy .possibilities-link { margin-top:auto; }
}
@media(max-width:760px) {
 .private-community .community-benefits article {
  column-gap:18px; padding-right:18px;
 }
 .private-community .community-benefits :is(h3,p) { padding-left:12px; }
 .professional-layout > .professional-opportunities-link { margin-top:0; }
 .how .step { grid-template-areas:"title title" "copy visual"; }
 .how .step > h3 {
  grid-column:1 / -1; white-space:nowrap;
  font-size:clamp(13px,3.8vw,20px); line-height:1.2;
 }
 .how .step .how-title-last-word { display:inline; }
 .how .step > p { grid-column:1; grid-row:2; }
 .how .step > .step-visual { grid-column:2; grid-row:2; }
 html[lang="en"] .savings-calculator .section-heading > p,
 html[lang="sv"] .savings-calculator .section-heading > p {
  white-space:nowrap; font-size:clamp(9px,2.55vw,14px);
 }
}

/* A white, unframed cross with a visible keyboard focus state. */
#task-dialog .dialog-close {
 background:transparent; background-image:none; color:#fff; border:0;
 border-radius:0; box-shadow:none; filter:none; text-shadow:none;
 min-width:44px; min-height:44px; font-size:32px;
}
#task-dialog .dialog-close:focus:not(:focus-visible) { outline:none; }
#task-dialog .dialog-close:focus-visible { outline:2px solid #a9cfff; outline-offset:2px; }
@media(max-width:760px) {
 .professional-layout { --professional-card-gap:24px; row-gap:24px; }
 .professional-layout .professional-visual { gap:var(--professional-card-gap); }
 .professional-layout > .professional-opportunities-link { margin-top:0; }
 .how .step > h3 { grid-area:title; }
}

/* Mobile phones stay in their opening pose and scroll with the page. */
@media(max-width:760px) {
 .hero-story, .has-scene-motion .hero-story { height:auto; min-height:0; }
 .hero-cinema, .has-scene-motion .hero-cinema {
  position:relative; top:auto; height:100svh;
  min-height:calc(var(--mobile-scene-top,300px) + 180px);
 }
}

/* Source: gig-workers.css */
/* Role comparison shares the site's section frame without restricting reading. */
main > .gig-workers {
  display: flex;
  align-items: center;
  height: auto;
}
.gig-workers-inner {
  display: grid;
  gap: clamp(32px, 5svh, 64px);
}
.gig-workers .section-heading { margin: 0; }
.gig-workers .section-heading h2 {
  max-width: 22ch;
  margin: 0 auto;
  font-size: var(--desktop-title, clamp(38px, min(5vw, 8svh), 78px));
  line-height: 1.08;
  text-align: center;
  text-wrap: balance;
}
.worker-role-comparison {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(32px, 6vw, 96px);
  max-width: 1160px;
  width: 100%;
  margin-inline: auto;
}
.worker-role { min-width: 0; }
.worker-role h3 {
  margin: 0 0 22px;
  text-align: center;
  font-size: clamp(25px, 2.2vw, 36px);
  line-height: 1.15;
  letter-spacing: -.035em;
  color: #fff;
}
.worker-role p, .worker-role-facts, .worker-role-help {
  font-size: var(--desktop-body, 18px);
  line-height: 1.6;
  color: #c9c9d0;
}
.worker-role p { margin: 0 0 20px; text-align: center; }
.worker-role .worker-role-question { color: #fff; font-weight: 600; }
.gig-workers .worker-role-help { margin: 0; text-align: center; color: #9ce4c6; }
.role-feed {
  display: none; position: relative; overflow: hidden;
  border-radius: 22px; background: #f4f5f7; isolation: isolate;
}
.role-feed-viewport { position: absolute; inset: 0; overflow: hidden; }
.role-feed-image {
  display: block; width: 100%; height: auto; max-width: none;
  transform: translateY(-37.4%);
}
.worker-role-phone-copy { display: none; }
@media (min-width: 761px) {
  .worker-role { display: flex; flex-direction: column; }
  .worker-role > .worker-role-long-copy:not(.worker-role-question) {
    margin-bottom: clamp(44px, 5svh, 64px);
  }
  /* Matching viewports line up beneath the two role descriptions. */
  .role-feed {
    display: block;
    position: relative;
    flex: 0 0 auto;
    contain: size;
    width: min(100%, 420px);
    height: clamp(150px, 22svh, 220px);
    min-height: 0;
    max-height: 220px;
    margin: auto auto 0;
    border-radius: 22px;
    overflow: hidden;
    background: #f4f5f7;
    isolation: isolate;
  }
}
@media (max-width: 760px) {
  .role-feed-professionals { display: none; }
  main > section.gig-workers#keikkalaiset {
    padding-block: var(--phone-section-top, 32px);
    min-height: var(--section-frame);
    justify-content: flex-start;
  }
  .gig-workers .wrap { width: calc(100% - 48px); max-width: 560px; }
  .gig-workers-inner { gap: clamp(12px, 2.2svh, 22px); }
  .gig-workers .section-heading { margin-bottom: clamp(16px, 2.5svh, 28px); }
  .gig-workers .section-heading h2 { font-size: clamp(23px, min(6.8vw, 4svh), 30px); }
  .worker-role-comparison { grid-template-columns: minmax(0, 1fr); gap: clamp(16px, 3svh, 26px); }
  .worker-role h3 { font-size: clamp(19px, min(5.4vw, 3svh), 23px); margin-bottom: 10px; text-align: center; }
  .worker-role .worker-role-long-copy { display: none; }
  .worker-role .worker-role-phone-copy { display: block; }
  .worker-role p, .worker-role-facts, .gig-workers .worker-role-help {
    font-size: clamp(12px, min(3.5vw, 2svh), 15px);
    line-height: 1.4;
  }
  .worker-role p { margin-bottom: 0; }
  .gig-workers .worker-role-help { font-size: clamp(11px, min(3.1vw, 1.8svh), 13px); text-wrap: balance; margin-top: clamp(8px, 1.5svh, 12px); }
  .worker-role > p:last-child { margin-bottom: 0; }
  .worker-role-professional > p:last-of-type { margin-bottom: 0; }
  .gig-workers-inner > .role-feed-gigs {
    display: block;
    height: clamp(240px, 38svh, 380px);
    min-height: 240px;
    width: 100%;
    margin: clamp(28px, 4svh, 40px) auto 0;
    contain: size;
    border-radius: 18px;
  }
}