:root {
  --bg:#f4f3ec; --panel:#eeeee4; --ink:#153a59; --sub:#46586a;
  --green:#345e48; --line:#d6d9ca; --sky:#749eb7; --card:#fffdf7;
  --mark-navy:#153a59; --mark-sky:#749eb7; --button:#153a59; --button-ink:#fffdf7;
}
[data-theme="dark"] {
  --bg:#0e2438; --panel:#152e43; --ink:#f7f5ec; --sub:#bdcbd5;
  --green:#a7c8a8; --line:#365168; --sky:#9fbed0; --card:#19364d;
  --mark-navy:#f7f5ec; --mark-sky:#749eb7; --button:#d8e6e8; --button-ink:#153a59;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
/* Theme colors switch in one paint; only movement and interaction effects animate. */
body { margin:0; background:var(--bg); color:var(--ink); font-family:'Hanken Grotesk',Arial,sans-serif; }
a { color:inherit; text-underline-offset:5px; }
a:hover { text-decoration-thickness:2px; }
a:focus-visible,button:focus-visible,summary:focus-visible { outline:3px solid var(--green); outline-offset:5px; }
img { display:block; max-width:100%; height:auto; }
h1,h2,h3,p { margin-top:0; }
h1,h2,h3 { font-family:'Crimson Pro',Georgia,serif; font-weight:400; }
h1,h2 { text-wrap:balance; }
p { line-height:1.65; }
section[id] { scroll-margin-top:35px; }
.wrap { width:min(1240px,calc(100% - 96px)); margin:auto; }
.skip { position:absolute;top:-90px;left:20px;padding:12px;background:var(--ink);color:var(--bg);z-index:50; }
.skip:focus { top:10px; }
.top { display:flex; align-items:center; gap:35px; padding:30px 0; }
.brand { display:flex;align-items:center;gap:15px;text-decoration:none;flex-shrink:0; }
.brand>svg { width:64px;height:auto;display:block; }
.brand-name { font:34px/1 'Crimson Pro',Georgia,serif;letter-spacing:.01em; }
.top-nav { display:flex;gap:28px; margin-left:auto; font-size:13px; }
.top-nav a { text-decoration:none; }
.top-nav a:hover { color:var(--green);text-decoration:underline; }
.toggle { position:relative;flex:0 0 80px;width:80px;height:44px;padding:2px;border:0;border-radius:24px;background:transparent;cursor:pointer;-webkit-tap-highlight-color:transparent; }
.toggle-track { position:relative;display:block;width:76px;height:40px;overflow:hidden;border:1px solid #a8bfbd;border-radius:24px;background:#d9e7e4;box-shadow:inset 0 2px 4px #153a5914;transition:box-shadow .2s; }
.toggle-thumb { position:absolute;z-index:2;left:3px;top:3px;width:32px;height:32px;border-radius:50%;background:#fff9e9;box-shadow:0 2px 5px #153a5929,inset 0 0 0 1px #fff;transition:transform .45s cubic-bezier(.22,1,.36,1); }
.toggle-thumb svg { position:absolute;inset:6px;width:20px;height:20px;transition:opacity .25s,transform .45s cubic-bezier(.22,1,.36,1); }
.toggle-sun { color:#a7772b; }
.toggle-moon { color:#315a76;opacity:0;transform:rotate(-65deg) scale(.65); }
.toggle-cloud { position:absolute;width:20px;height:6px;right:8px;bottom:11px;border-radius:8px;background:#fffdf3;opacity:.85;transition:transform .4s,opacity .25s; }
.toggle-cloud:before,.toggle-cloud:after { content:'';position:absolute;bottom:1px;border-radius:50%;background:inherit; }
.toggle-cloud:before { width:10px;height:10px;left:3px; }.toggle-cloud:after { width:7px;height:7px;right:2px; }
.toggle-stars { position:absolute;inset:0;opacity:0;transform:translateX(8px);transition:opacity .3s,transform .4s; }
.toggle-stars i { position:absolute;width:3px;height:3px;left:14px;top:10px;background:#e1edf0;border-radius:50%; }
.toggle-stars i:nth-child(2) { left:25px;top:20px;width:2px;height:2px; }.toggle-stars i:nth-child(3) { left:12px;top:27px;width:2px;height:2px; }
.toggle:hover .toggle-track { box-shadow:inset 0 2px 4px #153a5914,0 0 0 3px #749eb720; }
.toggle:active .toggle-thumb { transform:scale(.92); }
[data-theme="dark"] .toggle-track { background:#17384e;border-color:#4b6e80; }
[data-theme="dark"] .toggle-thumb { transform:translateX(36px);background:#e3edf0; }
[data-theme="dark"] .toggle-sun { opacity:0;transform:rotate(65deg) scale(.65); }
[data-theme="dark"] .toggle-moon { opacity:1;transform:rotate(0) scale(1); }
[data-theme="dark"] .toggle-cloud { opacity:0;transform:translateY(12px); }
[data-theme="dark"] .toggle-stars { opacity:1;transform:translateX(0); }
[data-theme="dark"] .toggle:active .toggle-thumb { transform:translateX(36px) scale(.92); }
.hero { display:grid;grid-template-columns:1.5fr 1fr;align-items:end;gap:65px;padding:65px 0 90px; }
.hero-intro { padding-bottom:5px; }
.eyebrow { font-size:10px;letter-spacing:.18em;text-transform:uppercase;font-weight:600;color:var(--green);margin-bottom:20px; }
.hero h1 { font-size:clamp(56px,6.2vw,86px);line-height:1.03;letter-spacing:-.025em;margin:0; }
.hero h1 em { color:var(--green);font-weight:400; }
.lede { font-size:17px;color:var(--sub);max-width:425px;margin:0 0 28px; }
.hero-actions { display:flex;gap:22px;align-items:center;flex-wrap:wrap; }
.button { display:inline-flex;justify-content:center;align-items:center;gap:25px;min-height:49px;padding:14px 21px;background:var(--button);color:var(--button-ink);font-size:13px;font-weight:500;text-decoration:none;border:1px solid transparent;border-radius:3px; }
.button:hover { background:var(--green);color:var(--bg); }
.text-link { display:inline-block;font-size:13px;font-weight:500;text-decoration:none;border-bottom:1px solid var(--green);padding-bottom:3px; }
.small-note { font-size:11px;color:var(--sub);margin:18px 0 0; }
.section { padding:85px 0; }
h2 { font-size:clamp(36px,4vw,51px);line-height:1.05;letter-spacing:-.015em;margin-bottom:20px; }
.section-intro { display:flex;align-items:flex-end;justify-content:space-between;gap:60px;margin-bottom:42px; }
.section-intro h2 { margin-bottom:0; }
.section-intro>p { font-size:14px;max-width:335px;margin:0;color:var(--sub); }
.examples { background:var(--panel);border-top:1px solid var(--line);border-bottom:1px solid var(--line); }
.example-carousel { min-width:0; }
.carousel-track { display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;border-radius:12px;overscroll-behavior-x:contain; }
.carousel-track::-webkit-scrollbar { display:none; }
.carousel-track:focus-visible { outline:3px solid var(--green);outline-offset:6px; }
.example { flex:0 0 100%;min-width:0;scroll-snap-align:start;display:grid;grid-template-columns:1.65fr 1fr;align-items:center;gap:40px;padding:28px;background:var(--card);border:1px solid var(--line);border-radius:12px; }
.showcase { position:relative;display:block;min-width:0;padding:30px 55px 55px 24px;background:var(--showcase-color);text-decoration:none;border-radius:6px; }
.browser-frame { background:#fff;border:1px solid #cad0c9;border-radius:6px;overflow:hidden;box-shadow:0 12px 30px #152e4a20;transition:transform .35s; }
.browser-bar { display:flex;gap:5px;align-items:center;background:#f9faf7;padding:10px;color:#6b746f; }
.browser-bar i { width:5px;height:5px;border-radius:50%;background:#c4ccc2; }
.browser-bar span { font-size:8px;letter-spacing:.05em;margin:auto; }
.browser-frame>img { width:100%;aspect-ratio:1280/850;object-fit:cover;object-position:top; }
.phone-frame { position:absolute;width:23%;right:15px;bottom:34px;border:4px solid #24322e;border-radius:15px;overflow:hidden;box-shadow:0 9px 22px #182d253d;background:#24322e;transition:transform .35s; }
.phone-frame img { width:100%;aspect-ratio:390/844;object-fit:cover;object-position:top; }
.view-demo { position:absolute;left:24px;bottom:18px;font-size:11px;color:#253d33;background:#fffdf7e8;padding:4px 9px;border-radius:20px; }
.showcase:hover .browser-frame { transform:translateY(-4px); }.showcase:hover .phone-frame { transform:translateY(-7px); }
.example-label { padding:20px 20px 20px 0;min-width:0; }
.example-label .eyebrow { margin-bottom:18px;font-size:10px; }
.example-label h3 { font-size:clamp(32px,3.6vw,48px);line-height:1;letter-spacing:-.02em;margin-bottom:20px; }
.example-label h3 a { text-decoration:none; }
.example-label>p:not(.eyebrow) { font-size:15px;color:var(--sub);max-width:300px; }
.example-label .text-link { margin-top:12px;padding-bottom:8px; }.example-label .text-link span { margin-left:14px; }
.example-label .concept-caption { font-size:10px!important;margin:30px 0 0;opacity:.8; }
.carousel-controls { display:flex;justify-content:space-between;align-items:center;gap:24px;padding-top:24px; }
.carousel-controls[hidden] { display:none; }
.carousel-status { display:flex;align-items:baseline;gap:3px;flex:1;margin:0;font-size:15px;font-variant-numeric:tabular-nums; }
.carousel-current { font-weight:600; }.carousel-total { color:var(--sub);font-size:12px; }.carousel-name { margin-left:14px;font-size:12px;color:var(--sub); }
.carousel-dots { display:flex;gap:0; }
.carousel-dot { border:0;background:transparent;cursor:pointer;display:grid;place-items:center;width:36px;height:44px;padding:0; }
.carousel-dot span { width:6px;height:6px;border-radius:8px;background:var(--sky);opacity:.45;transition:width .25s,opacity .25s; }
.carousel-dot[aria-current="true"] span { width:25px;background:var(--green);opacity:1; }
.carousel-arrows { display:flex;gap:10px;flex:1;justify-content:flex-end; }
.carousel-arrow { width:47px;height:47px;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:50%;font:24px/1 Arial,sans-serif;cursor:pointer;transition:transform .2s; }
.carousel-arrow:hover:not(:disabled) { background:var(--ink);color:var(--bg);transform:translateY(-2px); }
.carousel-arrow:disabled { opacity:.3;cursor:default; }
.process-section { border-bottom:1px solid var(--line); }
.process-grid { display:grid;grid-template-columns:1fr 1fr;gap:95px; }
.process-grid>div>p:not(.eyebrow) { max-width:355px;font-size:14px;color:var(--sub); }
.steps { list-style:none;padding:0;margin:0; }
.steps li { display:flex;gap:25px;padding:24px 0;border-top:1px solid var(--line); }
.steps li:first-child { padding-top:0;border-top:0; }
.steps li:last-child { padding-bottom:0; }
.steps li>span { color:var(--green);font-size:11px;line-height:2.8; }
.steps h3 { font-size:27px;margin-bottom:8px; }
.steps p { color:var(--sub);font-size:14px;max-width:360px;margin:0; }
.faq-section { display:grid;grid-template-columns:1fr 1.3fr;gap:70px; }
.faq-section>div>p:not(.eyebrow) { font-size:14px;color:var(--sub); }
.faq-list details { border-top:1px solid var(--line);padding:22px 0; }
.faq-list details:last-child { border-bottom:1px solid var(--line); }
.faq-list summary { list-style:none;display:flex;gap:20px;align-items:center;justify-content:space-between;cursor:pointer;font-size:16px;line-height:1.5;font-weight:500; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary:after { content:'+';font-size:23px;font-weight:400;color:var(--green); }
.faq-list details[open] summary:after { content:'−'; }
.faq-list details p { font-size:14px;color:var(--sub);margin:15px 25px 0 0; }
.closing { background:var(--ink);color:var(--bg);padding:65px 0; }
.closing-inner { display:flex;align-items:center;justify-content:space-between;gap:40px; }
.closing .eyebrow { color:var(--bg);opacity:.8; }
.closing h2 { font-size:48px; }
.closing p:not(.eyebrow) { font-size:14px;opacity:.85;margin-bottom:0; }
.closing .button { background:var(--bg);color:var(--ink);font-size:16px;padding:20px 25px; }
.closing .button:hover { text-decoration:underline; }
footer { padding:40px 0 24px; }
.footer-inner { display:flex;justify-content:space-between;align-items:center;gap:35px; }
.footer-brand { display:flex;align-items:center;gap:14px;text-decoration:none;font:27px 'Crimson Pro',Georgia,serif; }
.footer-brand svg { width:48px;height:auto; }
.footer-brand small { display:block;font:11px/1.5 'Hanken Grotesk',Arial,sans-serif;margin-top:4px;color:var(--sub); }
.footer-inner nav { display:flex;gap:25px;font-size:12px; }
.footer-inner nav a { text-decoration:none; }
.footer-inner nav a:hover { text-decoration:underline; }
.footer-bottom { display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);padding-top:22px;margin-top:35px;font-size:10px;color:var(--sub); }
@media(max-width:1000px) {
  .wrap { width:calc(100% - 56px); }.hero{gap:35px;grid-template-columns:1.2fr 1fr;}.hero h1{font-size:64px;}.brand-name{font-size:29px;}.brand>svg{width:54px;}.top{gap:22px;}.top-nav{gap:18px;}.hero-actions{gap:17px}.process-grid{gap:50px}.faq-section{gap:40px}
}
@media(max-width:700px) {
  .wrap{width:calc(100% - 40px)}.top{padding:22px 0;gap:15px;flex-wrap:wrap}.brand{gap:10px}.brand-name{font-size:28px}.brand>svg{width:48px}.toggle{margin-left:auto}.top-nav{order:3;margin:5px 0 0;width:100%;gap:24px;font-size:12px;border-top:1px solid var(--line);padding-top:17px}.hero{grid-template-columns:1fr;padding:35px 0 50px;gap:25px}.hero h1{font-size:clamp(48px,11vw,65px);max-width:500px;line-height:1.04}.hero .eyebrow{font-size:9px}.lede{font-size:16px}.hero-actions{align-items:flex-start;gap:20px}.small-note{font-size:10px}.section{padding:55px 0}.section-intro{display:block;margin-bottom:30px}.section-intro>p{max-width:440px;margin-top:22px}h2{font-size:39px}.process-grid,.faq-section{grid-template-columns:1fr;gap:35px}.steps li:first-child{padding-top:20px;border-top:1px solid var(--line)}.faq-list details{padding:20px 0}.faq-list summary{font-size:15px}.closing{padding:50px 0}.closing-inner{display:block}.closing h2{font-size:40px}.closing .button{margin-top:30px;font-size:15px;padding:17px 21px}.footer-inner{align-items:flex-start;flex-direction:column;gap:30px}.footer-inner nav{gap:22px}.footer-bottom{font-size:9px;gap:15px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}body,.toggle *{transition:none}}
@media(max-width:380px){.brand-name{font-size:24px}.brand>svg{width:40px}.brand{gap:8px}.top{gap:10px}}

@media(max-width:1000px){.example{gap:25px;padding:20px;grid-template-columns:1.4fr 1fr}.showcase{padding:22px 35px 50px 18px}.example-label{padding-right:0}.example-label h3{font-size:35px}.example-label>p:not(.eyebrow){font-size:13px}.carousel-name{display:none}}
@media(max-width:700px){.example{grid-template-columns:1fr;gap:0;padding:14px;align-content:start}.showcase{padding:20px 37px 48px 14px}.phone-frame{right:10px;bottom:32px;border-width:3px;border-radius:10px}.browser-bar{padding:7px}.browser-bar span{font-size:6px}.browser-bar i{width:3px;height:3px}.view-demo{left:14px;bottom:13px;font-size:9px}.example-label{padding:24px 9px 13px;min-height:245px}.example-label .eyebrow{font-size:9px;margin-bottom:13px}.example-label h3{font-size:35px;margin-bottom:14px}.example-label>p:not(.eyebrow){max-width:100%;font-size:14px}.example-label .concept-caption{margin-top:22px}.carousel-controls{gap:8px;flex-wrap:wrap;padding-top:15px}.carousel-status{flex:1;font-size:14px}.carousel-dots{order:3;width:100%;justify-content:center}.carousel-dot{width:32px;flex:0 1 40px}.carousel-arrow{width:44px;height:44px}.carousel-arrows{gap:8px}.carousel-track{gap:14px}}
@media(prefers-reduced-motion:reduce){.carousel-track{scroll-behavior:auto}.browser-frame,.phone-frame,.carousel-dot span,.carousel-arrow{transition:none}}