/* Sora and Inter (SIL Open Font License), self-hosted copies of the Google Fonts files, latin + latin-ext subsets only. */
@font-face{ font-family:'Inter'; font-style:normal; font-weight:400; font-display:swap; src:url(/assets/fonts/inter-latin-ext.woff2) format('woff2'); unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face{ font-family:'Inter'; font-style:normal; font-weight:400; font-display:swap; src:url(/assets/fonts/inter-latin.woff2) format('woff2'); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face{ font-family:'Inter'; font-style:normal; font-weight:500; font-display:swap; src:url(/assets/fonts/inter-latin-ext.woff2) format('woff2'); unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face{ font-family:'Inter'; font-style:normal; font-weight:500; font-display:swap; src:url(/assets/fonts/inter-latin.woff2) format('woff2'); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face{ font-family:'Inter'; font-style:normal; font-weight:600; font-display:swap; src:url(/assets/fonts/inter-latin-ext.woff2) format('woff2'); unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face{ font-family:'Inter'; font-style:normal; font-weight:600; font-display:swap; src:url(/assets/fonts/inter-latin.woff2) format('woff2'); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face{ font-family:'Sora'; font-style:normal; font-weight:500; font-display:swap; src:url(/assets/fonts/sora-latin-ext.woff2) format('woff2'); unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face{ font-family:'Sora'; font-style:normal; font-weight:500; font-display:swap; src:url(/assets/fonts/sora-latin.woff2) format('woff2'); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face{ font-family:'Sora'; font-style:normal; font-weight:600; font-display:swap; src:url(/assets/fonts/sora-latin-ext.woff2) format('woff2'); unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face{ font-family:'Sora'; font-style:normal; font-weight:600; font-display:swap; src:url(/assets/fonts/sora-latin.woff2) format('woff2'); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face{ font-family:'Sora'; font-style:normal; font-weight:700; font-display:swap; src:url(/assets/fonts/sora-latin-ext.woff2) format('woff2'); unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face{ font-family:'Sora'; font-style:normal; font-weight:700; font-display:swap; src:url(/assets/fonts/sora-latin.woff2) format('woff2'); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

  :root{
    /* Shared by index, about, privacy and support.
     Palette taken from the logo's facets */
    --bg:#f6f9fa; --surface:#ffffff; --line:#dde7eb; --line-strong:#c4d5dc;
    --ink:#0f2733; --body:#3b5361; --muted:#6b8290;
    --teal:#2e98b8; --teal-deep:#1d6f8a; --teal-soft:#e4f2f6; --cyan:#bfe3ea; --slate:#6d90a2;
    --display:"Sora",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
    --sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
    --mono:ui-monospace,"SF Mono","Cascadia Code",Menlo,Consolas,monospace;
    --radius:16px;
  }
  *{ box-sizing:border-box; }
  html{ scroll-behavior:smooth; scroll-padding-top:76px; }
  body{ margin:0; background:var(--bg); color:var(--body); font-family:var(--sans); line-height:1.65; -webkit-font-smoothing:antialiased; }
  img{ max-width:100%; height:auto; display:block; }
  a{ color:var(--teal-deep); }
  .wrap{ max-width:1120px; margin:0 auto; padding:0 24px; }
  .eyebrow{ font-family:var(--mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--teal-deep); font-weight:600; }
  h1,h2,h3,h4{ font-family:var(--display); color:var(--ink); letter-spacing:-.02em; }

  /* ---- header ---- */
  header{ position:sticky; top:0; z-index:20; background:rgba(255,255,255,.88); backdrop-filter:saturate(1.4) blur(12px); border-bottom:1px solid var(--line); }
  .bar{ display:flex; align-items:center; justify-content:space-between; height:68px; gap:16px; }
  .brand{ display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--ink); font-family:var(--display); font-weight:700; font-size:19px; letter-spacing:-.02em; }
  .brand img{ width:34px; height:34px; }
  .right{ display:flex; align-items:center; gap:24px; }
  .nav{ display:flex; gap:22px; font-size:14.5px; }
  .nav a{ color:var(--body); text-decoration:none; }
  .nav a:hover{ color:var(--teal-deep); }
  @media (max-width:760px){
    .bar{ flex-wrap:wrap; height:auto; padding-top:10px; row-gap:6px; }
    .right{ display:contents; }
    .lang{ margin-left:auto; }
    .nav{ order:3; width:100%; gap:18px; overflow-x:auto; padding:2px 0 10px; font-size:14px; white-space:nowrap; }
  }
  .lang{ display:inline-flex; border:1px solid var(--line-strong); border-radius:9px; overflow:hidden; font-family:var(--mono); font-size:12px; }
  .lang button{ border:0; background:#fff; color:var(--muted); padding:6px 11px; cursor:pointer; }
  .lang button[aria-pressed="true"]{ background:var(--teal-deep); color:#fff; font-weight:600; }

  /* ---- buttons ---- */
  .btn{ display:inline-flex; align-items:center; gap:8px; padding:12px 20px; border-radius:11px; font-weight:600; font-size:15px; text-decoration:none; border:1px solid transparent; transition:transform .15s, box-shadow .2s, background .2s; }
  .btn.primary{ background:var(--teal-deep); color:#fff; box-shadow:0 8px 22px -12px rgba(29,111,138,.8); }
  .btn.primary:hover{ background:#175c73; transform:translateY(-1px); }
  .btn.ghost{ background:#fff; color:var(--ink); border-color:var(--line-strong); }
  .btn svg.li{ width:18px; height:18px; flex:none; }
  .btn.ghost:hover{ border-color:var(--teal); transform:translateY(-1px); }

  /* ---- hero ---- */
  .hero{ padding:88px 0 72px; background:
      radial-gradient(900px 420px at 85% 0%, rgba(191,227,234,.55), transparent 60%),
      linear-gradient(180deg,#ffffff, var(--bg)); border-bottom:1px solid var(--line); }
  .hero-grid{ display:grid; grid-template-columns:1.35fr .8fr; gap:48px; align-items:center; }
  @media (max-width:860px){ .hero-grid{ grid-template-columns:1fr; } .hero-mark{ display:none; } .hero{ padding:64px 0 56px; } }
  .hero h1{ font-size:clamp(38px,5.6vw,60px); line-height:1.05; margin:16px 0 0; font-weight:700; text-wrap:balance; }
  .hero .lede{ font-size:clamp(17px,2vw,19px); margin:22px 0 0; max-width:60ch; }
  .cta{ display:flex; gap:12px; flex-wrap:wrap; margin-top:32px; }
  .stats{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-top:44px; max-width:640px; }
  .stat{ background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:16px 18px; }
  .stat b{ display:block; font-family:var(--display); font-size:26px; color:var(--ink); letter-spacing:-.02em; line-height:1.1; }
  .stat span{ display:block; font-size:13.5px; color:var(--muted); margin-top:4px; }
  @media (max-width:520px){ .stats{ grid-template-columns:1fr; } }
  .hero-mark{ justify-self:center; width:100%; max-width:340px; filter:drop-shadow(0 30px 40px rgba(29,111,138,.18)); }

  /* ---- sections ---- */
  section.block{ padding:84px 0; }
  section.alt{ background:var(--surface); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
  .sec-head{ max-width:66ch; }
  /* the key phrase of a heading in the brand teal; a gradient on page titles */
  h1 em.hl, h2 em.hl{ font-style:normal; color:var(--teal-deep); }
  h1 em.hl{ background:linear-gradient(95deg,var(--teal-deep) 0%,var(--teal) 75%); -webkit-background-clip:text; background-clip:text; color:transparent; }
  .sec-head h2{ font-size:clamp(28px,3.6vw,40px); line-height:1.15; margin:12px 0 0; text-wrap:balance; }
  .sec-head p{ margin:14px 0 0; font-size:17px; }

  /* consulting */
  .services{ margin-top:40px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
  @media (max-width:960px){ .services{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
  @media (max-width:620px){ .services{ grid-template-columns:1fr; } }
  .svc{ background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:26px; transition:border-color .2s, box-shadow .2s; }
  .svc:hover{ border-color:var(--cyan); box-shadow:0 18px 40px -26px rgba(29,111,138,.45); }
  .svc .ic{ width:40px; height:40px; border-radius:10px; background:var(--teal-soft); display:grid; place-items:center; color:var(--teal-deep); }
  .svc .ic svg{ width:22px; height:22px; }
  .svc h3{ font-size:18px; margin:16px 0 8px; }
  .svc p{ margin:0; font-size:15px; }
  .svc.cta-card{ background:var(--teal-deep); border-color:var(--teal-deep); color:#e6f3f6; }
  .svc.cta-card h3{ color:#fff; margin-top:0; }
  .svc.cta-card p{ margin-bottom:18px; }
  .note{ margin-top:22px; background:var(--teal-soft); border:1px solid var(--cyan); border-radius:var(--radius); padding:18px 22px; }
  .note p{ margin:0; color:var(--ink); font-weight:500; }

  /* founder */
  .founder{ margin-top:40px; display:grid; grid-template-columns:300px 1fr; gap:44px; align-items:start; }
  @media (max-width:820px){ .founder{ grid-template-columns:1fr; } .founder .photo{ max-width:260px; } }
  .photo{ border-radius:20px; overflow:hidden; border:1px solid var(--line); box-shadow:0 24px 50px -30px rgba(15,39,51,.45); background:var(--teal-soft); }
  .founder .who{ font-family:var(--display); font-size:26px; color:var(--ink); font-weight:700; margin:0; }
  .founder .role{ color:var(--teal-deep); font-weight:600; margin:2px 0 16px; }
  .founder .bio{ font-size:16.5px; margin:0 0 18px; }
  .chips{ display:flex; flex-wrap:wrap; gap:8px; margin:0 0 26px; padding:0; list-style:none; }
  .chips li{ font-size:13px; background:var(--bg); border:1px solid var(--line); border-radius:999px; padding:5px 12px; color:var(--ink); }
  .timeline{ list-style:none; margin:0; padding:0; border-left:2px solid var(--cyan); }
  .timeline li{ position:relative; padding:0 0 18px 22px; }
  .timeline li::before{ content:""; position:absolute; left:-7px; top:7px; width:12px; height:12px; border-radius:50%; background:#fff; border:2px solid var(--teal); }
  .timeline li:first-child::before{ background:var(--teal); }
  .timeline .yr{ font-family:var(--mono); font-size:12.5px; color:var(--muted); }
  .timeline .what{ display:block; color:var(--ink); font-weight:600; font-size:15.5px; }
  .timeline .where{ display:block; font-size:14.5px; }
  .founder .links{ margin-top:8px; display:flex; gap:12px; flex-wrap:wrap; }

  /* products */
  .products{ margin-top:40px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
  @media (max-width:820px){ .products{ grid-template-columns:1fr; } }
  .prod{ background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:30px; display:flex; flex-direction:column; }
  /* product screenshots run edge to edge across the top of the card */
  .prod .shot{ margin:-30px -30px 24px; border-radius:var(--radius) var(--radius) 0 0; overflow:hidden; background:var(--ink); }
  .prod .shot img{ display:block; width:100%; }
  .demo-link{ align-self:flex-start; display:inline-flex; align-items:center; gap:9px; margin:-4px 0 22px; font-weight:600; font-size:14.5px; color:var(--teal-deep); }
  .demo-link::before{ content:""; border-left:9px solid currentColor; border-top:6px solid transparent; border-bottom:6px solid transparent; }
  dialog.demo{ padding:0; border:0; border-radius:18px; background:#0b1116; width:min(360px, 92vw); max-height:94vh; overflow:hidden; }
  dialog.demo::backdrop{ background:rgba(8,22,30,.75); }
  .demo-bar{ display:flex; justify-content:space-between; align-items:center; gap:12px; padding:10px 12px 10px 16px; color:#e6f0f3; font-size:14px; }
  .demo-bar button{ background:none; border:1px solid rgba(230,240,243,.3); border-radius:999px; color:inherit; font:inherit; padding:4px 12px; cursor:pointer; }
  dialog.demo video{ display:block; width:100%; height:auto; max-height:calc(94vh - 52px); aspect-ratio:9/16; background:#000; }
  .badge{ align-self:flex-start; font-family:var(--mono); font-size:11.5px; letter-spacing:.03em; color:var(--teal-deep); background:var(--teal-soft); border:1px solid var(--cyan); border-radius:999px; padding:4px 11px; }
  .prod h3{ font-size:22px; margin:14px 0 8px; }
  .prod > p{ margin:0 0 16px; }
  .feat{ list-style:none; padding:0; margin:0 0 22px; display:grid; gap:9px; }
  .feat li{ position:relative; padding-left:22px; font-size:14.5px; }
  .feat li::before{ content:"→"; position:absolute; left:0; color:var(--teal); font-weight:700; }
  .stores{ margin-top:auto; display:flex; gap:12px; flex-wrap:wrap; align-items:center; }
  .stores img{ height:52px; width:auto; }
  .stores img.apple{ height:39px; }
  .prod .actions{ margin-top:auto; display:flex; gap:10px; flex-wrap:wrap; }

  /* contact */
  .contact{ margin-top:40px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
  @media (max-width:760px){ .contact{ grid-template-columns:1fr; } }
  .panel{ background:var(--bg); border:1px solid var(--line); border-radius:var(--radius); padding:28px; }
  .panel h3{ font-size:17px; margin:0 0 16px; }
  .panel dl{ margin:0; }
  .panel dt{ font-family:var(--mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); }
  .panel dd{ margin:4px 0 16px; color:var(--ink); overflow-wrap:anywhere; }
  .panel dd:last-child{ margin-bottom:0; }
  .panel a{ text-decoration:none; }
  .panel a:hover{ text-decoration:underline; }

  footer{ padding:32px 0 48px; font-size:13.5px; color:var(--muted); }
  .foot{ display:flex; justify-content:space-between; gap:18px; flex-wrap:wrap; }
  .foot a{ color:var(--teal-deep); text-decoration:none; }

  html.js .reveal{ opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease; }
  html.js .reveal.in{ opacity:1; transform:none; }
  a:focus-visible,.btn:focus-visible,.lang button:focus-visible{ outline:2px solid var(--teal); outline-offset:3px; border-radius:10px; }
  @media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } html.js .reveal{ opacity:1; transform:none; transition:none; } }

  /* founder teaser (home) */
  .teaser{ margin-top:36px; display:grid; grid-template-columns:150px 1fr; gap:32px; align-items:center;
    background:var(--bg); border:1px solid var(--line); border-radius:20px; padding:30px; }
  @media (max-width:640px){ .teaser{ grid-template-columns:1fr; } }
  .teaser img{ width:150px; height:150px; border-radius:50%; object-fit:cover; border:4px solid #fff; box-shadow:0 14px 30px -18px rgba(15,39,51,.6); }
  .teaser .who{ font-family:var(--display); font-size:22px; color:var(--ink); font-weight:700; margin:0; }
  .teaser .role{ color:var(--teal-deep); font-weight:600; margin:2px 0 10px; }
  .teaser p.sum{ margin:0 0 16px; font-size:16px; }
  .teaser .links{ display:flex; gap:10px; flex-wrap:wrap; }
  .teaser .stats{ margin:6px 0 18px; max-width:none; }
  .teaser .stat{ background:var(--surface); }

  /* product cards: a link on to the product's own page, and the CC BY credit for the screenshots */
  .more-link{ align-self:flex-start; font-weight:600; font-size:15px; color:var(--teal-deep); margin:-2px 0 20px; }
  .credit{ margin:18px 0 0; font-size:12.5px; color:var(--muted); }

  /* product page (recaptube.html) */
  .app-hero .wrap{ display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:56px; align-items:center; }
  .app-hero .stores{ margin-top:26px; }
  .app-hero .fine{ margin:14px 0 0; font-size:14px; color:var(--muted); }
  .app-demo{ margin:0; }
  .app-demo video{ display:block; width:100%; height:auto; aspect-ratio:9/16; border-radius:22px; background:#0e0e10; box-shadow:0 30px 60px -30px rgba(15,39,51,.55); }
  .app-demo figcaption{ margin-top:10px; font-size:12.5px; color:var(--muted); text-align:center; }
  @media (max-width:820px){ .app-hero .wrap{ grid-template-columns:1fr; gap:36px; } .app-demo{ max-width:280px; margin:0 auto; } }
  .gallery{ margin-top:30px; display:grid; grid-auto-flow:column; grid-auto-columns:minmax(200px,1fr); gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:10px; }
  .gallery img{ width:100%; height:auto; border-radius:16px; scroll-snap-align:start; border:1px solid var(--line); }
  .feats{ margin-top:30px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
  @media (max-width:900px){ .feats{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
  @media (max-width:560px){ .feats{ grid-template-columns:1fr; } }
  .feats .svc h3{ margin-top:0; }
  .feats .svc p{ margin:6px 0 0; }
  .app-help{ margin-top:30px; display:flex; flex-wrap:wrap; gap:10px; }

  /* page hero for inner pages */
  .page-hero{ padding:72px 0 40px; background:linear-gradient(180deg,#ffffff,var(--bg)); border-bottom:1px solid var(--line); }
  .page-hero h1{ font-size:clamp(34px,5vw,50px); line-height:1.08; margin:14px 0 0; text-wrap:balance; }
  .page-hero .lede{ font-size:clamp(17px,2vw,19px); margin:18px 0 0; max-width:64ch; }

  /* long-form documents (privacy, support) */
  .doc{ padding-top:56px; padding-bottom:24px; }
  .doc .col{ max-width:72ch; }
  .doc h1{ font-size:clamp(32px,4.8vw,46px); line-height:1.08; margin:14px 0 0; text-wrap:balance; }
  .doc .lead{ font-size:clamp(17px,2vw,19px); color:var(--body); margin:18px 0 0; }
  .doc .updated{ font-family:var(--mono); font-size:12px; letter-spacing:.04em; color:var(--muted); margin-top:12px; }
  .doc h2{ font-size:clamp(21px,2.6vw,25px); margin:44px 0 10px; padding-top:26px; border-top:1px solid var(--line); }
  .doc h3{ font-size:17px; font-weight:600; margin:26px 0 6px; }
  .doc p,.doc li{ font-size:15.5px; }
  .doc p{ margin:0 0 14px; }
  .doc p.sub{ color:var(--muted); font-size:14.5px; }
  .doc ul{ padding-left:20px; margin:0 0 14px; }
  .doc li{ margin:0 0 8px; }
  .doc li::marker{ color:var(--teal); }
  .doc a{ text-decoration:none; }
  .doc a:hover{ text-decoration:underline; }
  .doc .card{ margin:28px 0 8px; padding:22px 24px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); }
  .doc .card .k{ font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); }
  .doc .card .v{ overflow-wrap:anywhere; font-family:var(--display); font-size:20px; font-weight:600; color:var(--ink); margin:6px 0 10px; }
  .doc .card .sub{ margin:0; }
  footer{ border-top:1px solid var(--line); }