:root {
  --ink: #171717;
  --ink-2: #2a2a2a;
  --slate: #666666;
  --slate-dark: #565656;
  --blue: #171717;
  --blue-dark: #333;
  --blue-soft: #f6f6f6;
  --blue-pale: #fafafa;
  --mint: #666666;
  --mint-soft: #f4f4f4;
  --amber: #858585;
  --violet: #8f8f8f;
  --red: #797979;
  --white: #ffffff;
  --warm-white: #fafafa;
  --border: #e8e8e8;
  --border-dark: rgba(255,255,255, .14);
  --shadow-xs: 0 1px 2px rgba(27,27,27, .05);
  --shadow-sm: 0 4px 16px rgba(27,27,27, .06);
  --shadow-lg: 0 24px 70px rgba(27,27,27, .13);
  --radius-sm: 0;
  --radius: 0;
  --radius-lg: 0;
  --shell: 1280px;
  --header-height: 72px;
}

* { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--header-height) + 24px);
}

body {
  margin: 0;
  color: var(--ink);
  background: var(--warm-white);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body.menu-open { overflow: hidden; }

img { display: block; max-width: 100%; }
a { color: inherit; }
button, input { font: inherit; }
button { color: inherit; }

.skip-link {
  position: fixed;
  z-index: 1000;
  top: 8px;
  left: 8px;
  padding: 10px 16px;
  color: var(--white);
  background: var(--ink);
  border-radius: 0;
  transform: translateY(-140%);
  transition: transform .2s ease;
}
.skip-link:focus { transform: translateY(0); }

.shell {
  width: min(calc(100% - 48px), var(--shell));
  margin-inline: auto;
}

.section { padding: 132px 0; }
.section-small { padding: 104px 0; }

.site-header {
  position: sticky;
  z-index: 100;
  top: 0;
  height: var(--header-height);
  border-bottom: 1px solid rgba(232,232,232, .9);
  background: rgba(252,252,252, .88);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  transition: box-shadow .2s ease, background .2s ease;
}

.site-header.scrolled {
  background: rgba(255,255,255, .94);
  box-shadow: none;
}

.header-inner {
  height: 100%;
  display: flex;
  align-items: center;
  gap: 32px;
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--ink);
  font-size: 19px;
  font-weight: 750;
  letter-spacing: -.03em;
  text-decoration: none;
  white-space: nowrap;
}

.brand img { width: 30px; height: 30px; }

.desktop-nav {
  display: flex;
  align-items: center;
  gap: 28px;
  margin-left: auto;
}

.desktop-nav a,
.sign-in {
  color: var(--slate-dark);
  font-size: 14px;
  font-weight: 550;
  text-decoration: none;
  transition: color .2s ease;
}

.desktop-nav a:hover,
.sign-in:hover { color: var(--blue); }
.desktop-nav .docs-link { color: var(--ink); }

.header-actions { display: flex; align-items: center; gap: 20px; }

.button {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 0 22px;
  border: 1px solid transparent;
  border-radius: 0;
  font-size: 15px;
  font-weight: 650;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  transition: color .2s ease, background .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}

.button:hover { transform: translateY(-1px); }
.button:focus-visible, a:focus-visible, button:focus-visible, summary:focus-visible { outline: 3px solid rgba(131,131,131, .25); outline-offset: 3px; }

.button-small { min-height: 40px; padding-inline: 17px; font-size: 14px; }

.button-primary {
  color: var(--white);
  background: var(--blue);
  box-shadow: none;
}
.button-primary:hover { background: var(--blue-dark); box-shadow: none; }

.button-secondary {
  color: var(--ink);
  background: var(--white);
  border-color: #d6d6d6;
  box-shadow: none;
}
.button-secondary:hover { border-color: #a4a4a4; box-shadow: none; }

.button-white { color: var(--ink); background: var(--white); }
.button-white:hover { background: var(--blue-soft); }
.button-dark-outline { color: var(--white); border-color: rgba(255,255,255,.34); background: rgba(255,255,255,.05); }
.button-dark-outline:hover { border-color: rgba(255,255,255,.7); background: rgba(255,255,255,.1); }

.menu-toggle, .mobile-nav { display: none; }

.hero {
  position: relative;
  min-height: calc(100vh - var(--header-height));
  min-height: 760px;
  display: flex;
  align-items: center;
  overflow: hidden;
  padding-top: 102px;
  padding-bottom: 108px;
  background:
    linear-gradient(rgba(131,131,131,.028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(131,131,131,.028) 1px, transparent 1px),
    radial-gradient(circle at 82% 22%, rgba(131,131,131,.10), transparent 30%),
    var(--warm-white);
  background-size: 40px 40px, 40px 40px, auto, auto;
}

.hero::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 170px;
  background: linear-gradient(transparent, var(--warm-white));
  pointer-events: none;
}

.hero-glow {
  position: absolute;
  width: 440px;
  height: 440px;
  right: -200px;
  top: 30%;
  border-radius: 0;
  background: rgba(147,147,147, .13);
  filter: blur(70px);
}

.hero-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(560px, 1.08fr);
  align-items: center;
  gap: 72px;
}

.eyebrow {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 22px;
  color: var(--blue);
  font-size: 12px;
  font-weight: 750;
  letter-spacing: .14em;
  line-height: 1.2;
  text-transform: uppercase;
}

.eyebrow > span { width: 22px; height: 2px; background: currentColor; }
.eyebrow.light { color: #c6c6c6; }

.hero h1 {
  max-width: 680px;
  margin: 0;
  font-size: clamp(48px, 4.6vw, 68px);
  font-weight: 730;
  letter-spacing: -.055em;
  line-height: 1.045;
}

.hero-lead {
  max-width: 620px;
  margin: 28px 0 0;
  color: var(--slate-dark);
  font-size: 19px;
  line-height: 1.65;
}

.hero-actions { display: flex; gap: 12px; margin-top: 34px; }
.hero-docs { margin-top: 21px; }

.text-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--blue);
  font-size: 14px;
  font-weight: 650;
  text-decoration: none;
}
.text-link:hover span { transform: translateX(2px); }
.text-link span { transition: transform .2s ease; }

.hero-proof {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 9px;
  margin: 35px 0 0;
  color: var(--slate);
  font-size: 12px;
  font-weight: 550;
}
.hero-proof i { width: 3px; height: 3px; border-radius: 0; background: #a4a4a4; }

.hero-product {
  position: relative;
  border: 1px solid rgba(214,214,214, .9);
  border-radius: 0;
  background: rgba(255,255,255, .92);
  box-shadow: none;
  overflow: hidden;
  transform: perspective(1400px) rotateY(-2deg) rotateX(1deg);
}

.hero-product::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 10% -15% -25% 16%;
  background: rgba(131,131,131,.18);
  filter: blur(55px);
}

.hero-product-top {
  height: 50px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 0 18px;
  border-bottom: 1px solid var(--border);
  color: var(--slate-dark);
  background: #fcfcfc;
  font-size: 12px;
  font-weight: 650;
}

.window-dots { display: flex; gap: 5px; }
.window-dots span { width: 7px; height: 7px; border-radius: 0; background: #d6d6d6; }
.window-dots span:first-child { background: #cacaca; }
.window-dots span:nth-child(2) { background: #cccccc; }
.window-dots span:last-child { background: #c3c3c3; }

.live-status { justify-self: end; display: inline-flex; align-items: center; gap: 6px; color: var(--mint); }
.live-status i { width: 6px; height: 6px; border-radius: 0; background: var(--mint); box-shadow: none; }

.hero-workflow {
  min-height: 365px;
  display: grid;
  grid-template-columns: 1fr 46px .78fr;
  align-items: center;
  gap: 10px;
  padding: 28px 26px 20px;
}

.hero-photo-card {
  position: relative;
  border: 1px solid var(--border);
  border-radius: 0;
  background: var(--white);
  box-shadow: none;
  overflow: hidden;
}

.card-label {
  height: 35px;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 0 11px;
  color: var(--slate-dark);
  border-bottom: 1px solid var(--border);
  background: #ffffff;
  font-size: 12px;
  font-weight: 650;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.card-label span { color: var(--blue); }

.source-photo-wrap { position: relative; height: 250px; overflow: hidden; background: #f2f2f2; }
.source-photo-wrap img { width: 100%; height: 100%; object-fit: cover; }

.face-frame {
  position: absolute;
  top: 29%;
  left: 35%;
  width: 31%;
  height: 42%;
  border: 1px solid rgba(255,255,255,.7);
  border-radius: 0;
  box-shadow: none;
}
.face-frame span { position: absolute; width: 13px; height: 13px; border-color: #939393; border-style: solid; }
.face-frame span:nth-child(1) { top:-2px; left:-2px; border-width:2px 0 0 2px; border-radius: 0; }
.face-frame span:nth-child(2) { top:-2px; right:-2px; border-width:2px 2px 0 0; border-radius: 0; }
.face-frame span:nth-child(3) { bottom:-2px; left:-2px; border-width:0 0 2px 2px; border-radius: 0; }
.face-frame span:nth-child(4) { bottom:-2px; right:-2px; border-width:0 2px 2px 0; border-radius: 0; }

.result-card { justify-self: center; width: 100%; }
.result-card > img { width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; }
.result-size { padding: 7px 8px; color: var(--slate); border-top: 1px solid var(--border); font: 12px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace; text-align: center; }

.flow-arrow { display: flex; align-items: center; }
.flow-arrow span { flex: 1; border-top: 1px dashed #a4a4a4; }
.flow-arrow svg { width: 22px; fill: none; stroke: var(--blue); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.hero-checks {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 7px;
  padding: 0 26px 22px;
}
.hero-checks div { padding: 9px 8px; color: var(--slate-dark); border: 1px solid #e3e3e3; border-radius: 0; background: var(--mint-soft); font-size: 12px; font-weight: 650; text-align: center; white-space: nowrap; }
.hero-checks span { color: var(--mint); margin-right: 3px; }

.api-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 13px 18px;
  border-top: 1px solid var(--border);
  background: #1b1b1b;
  color: #a4a4a4;
  font-size: 12px;
}
.api-status code { font: inherit; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.api-status b { color: #c6c6c6; font-weight: 600; }
.api-status > span { color: #a9a9a9; font-weight: 700; }

.proof-band { position: relative; z-index: 2; border-block: 1px solid var(--border); background: var(--white); }
.proof-grid { min-height: 122px; display: grid; grid-template-columns: repeat(4, 1fr); align-items: center; }
.proof-grid > div { display: flex; flex-direction: column; gap: 2px; padding-left: 32px; border-left: 1px solid var(--border); }
.proof-grid > div:first-child { padding-left: 0; border-left: 0; }
.proof-grid strong { font-size: 17px; letter-spacing: -.02em; }
.proof-grid span { color: var(--slate); font-size: 13px; }

.section-heading { margin-bottom: 58px; }
.section-heading.centered { max-width: 800px; margin-inline: auto; text-align: center; }
.section-heading.centered .eyebrow { justify-content: center; }
.section-heading h2, .specs-copy h2, .faq-intro h2, .privacy-heading h2, .api-bridge-copy h2 {
  margin: 0;
  font-size: clamp(38px, 4vw, 50px);
  font-weight: 700;
  letter-spacing: -.045em;
  line-height: 1.1;
}
.section-heading > p:last-child, .specs-copy > p, .split-heading > p, .faq-intro > p, .privacy-heading p, .api-bridge-copy > p {
  color: var(--slate);
  font-size: 17px;
  line-height: 1.7;
}
.section-heading.centered > p:last-child { max-width: 700px; margin: 20px auto 0; }

.capabilities { background: var(--warm-white); }
.bento-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 18px; }
.bento-card { position: relative; min-width: 0; border: 1px solid var(--border); border-radius: 0; background: var(--white); overflow: hidden; }
.bento-card h3 { margin: 0 0 10px; font-size: 23px; letter-spacing: -.025em; line-height: 1.25; }
.bento-card p { margin: 0; color: var(--slate); font-size: 15px; line-height: 1.65; }
.bento-large { min-height: 440px; display: grid; grid-template-columns: .8fr 1.2fr; padding: 34px 0 0 34px; background: linear-gradient(140deg, #ffffff 30%, #f9f9f9); }
.bento-small { min-height: 211px; padding: 28px; }
.feature-index { position: absolute; z-index: 4; top: 28px; right: 28px; color: var(--blue); font: 700 12px/1 ui-monospace, SFMono-Regular, Menlo, monospace; }
.bento-copy { position: relative; z-index: 2; align-self: start; }
.bento-large .bento-copy { padding-top: 92px; }

.crop-visual { position: relative; align-self: end; justify-self: end; width: 94%; height: 380px; margin-top: 30px; border: 1px solid #e4e4e4; border-width: 1px 0 0 1px; border-radius: 0; background: #f3f3f3; overflow: hidden; }
.crop-visual img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.crop-visual::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(131,131,131,.035) 1px,transparent 1px),linear-gradient(rgba(131,131,131,.035) 1px,transparent 1px); background-size:22px 22px; }
.guide { position: absolute; z-index: 2; left: 5%; right: 5%; border-top: 1px dashed rgba(131,131,131,.72); }
.guide::before, .guide::after { content:""; position:absolute; top:-3px; width:5px; height:5px; border-radius: 0; background:var(--blue); }
.guide::before { left:0; }.guide::after { right:0; }
.guide-top { top: 21%; }.guide-eyes { top: 39%; }.guide-bottom { top: 75%; }
.measurement { position:absolute; z-index:3; right:5%; padding:4px 7px; color:var(--blue); border:1px solid #d5d5d5; border-radius: 0; background:rgba(255,255,255,.9); font-size:12px; font-weight:700; }
.measurement-head { top:24%; }.measurement-eye { top:42%; }

.feature-icon { width: 42px; height: 42px; display:flex; align-items:center; justify-content:center; margin-bottom: 32px; color: var(--blue); border: 1px solid #e9e9e9; border-radius: 0; background: var(--blue-soft); }
.feature-icon svg, .solution-icon svg, .product-icon svg { width: 22px; height: 22px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.background-compare { display:grid; grid-template-columns:repeat(2,1fr); gap:9px; margin-top:24px; }
.background-compare figure { position:relative; margin:0; border:1px solid var(--border); border-radius: 0; background:#f4f4f4; overflow:hidden; }
.background-compare img { width:100%; height:145px; object-fit:cover; object-position:center 20%; }
.background-compare figcaption { position:absolute; left:7px; bottom:7px; padding:3px 6px; color:var(--slate-dark); border:1px solid rgba(232,232,232,.9); border-radius: 0; background:rgba(255,255,255,.9); font-size:12px; font-weight:700; line-height:1.2; }
.mini-check-list { display:flex; gap:6px; margin:20px 0 0; padding:0; list-style:none; }
.mini-check-list li { padding:6px 8px; color:#414141; border:1px solid #e3e3e3; border-radius: 0; background:var(--mint-soft); font-size:12px; font-weight:650; white-space:nowrap; }
.mini-check-list span { margin-right:2px; }

.visual-output { background:#fbfbfb; }
.output-options { display:flex; flex-wrap:wrap; gap:6px; margin-top:20px; }
.output-options span { padding:6px 8px; color:var(--blue-dark); border:1px solid #e9e9e9; border-radius: 0; background:#ffffff; font-size:12px; font-weight:650; line-height:1.2; }

.custom-spec-callout { display:flex; align-items:center; justify-content:space-between; gap:28px; margin-top:18px; padding:22px 25px; border:1px solid #e9e9e9; border-radius: 0; background:var(--blue-pale); }
.custom-spec-callout p { margin:0; color:var(--slate-dark); font-size:14px; }
.custom-spec-callout strong { color:var(--ink); }

.demo-section { background: #f7f7f7; border-block:1px solid #efefef; }
.demo-shell { border:1px solid #dfdfdf; border-radius: 0; background:#ffffff; box-shadow: none; overflow:hidden; }
.demo-toolbar { min-height:82px; display:flex; align-items:center; gap:15px; padding:14px 20px; border-bottom:1px solid var(--border); background:#fcfcfc; }
.demo-step { display:flex; align-items:center; gap:8px; color:var(--slate-dark); font-size:12px; font-weight:650; white-space:nowrap; }
.demo-step b { width:22px; height:22px; display:inline-flex; align-items:center; justify-content:center; color:var(--blue); border-radius: 0; background:var(--blue-soft); font-size:12px; }
.sample-list, .document-tabs { display:flex; gap:7px; }
.sample-button { width:42px; height:42px; padding:3px; border:1px solid var(--border); border-radius: 0; background:#ffffff; cursor:pointer; transition:.2s ease; overflow:hidden; }
.sample-button img { width:100%; height:100%; object-fit:cover; border-radius: 0; }
.sample-button:hover, .sample-button.active { border-color:var(--blue); box-shadow: none; }
.toolbar-separator { align-self:stretch; width:1px; margin-inline:4px; background:var(--border); }
.document-tab { min-height:38px; padding:0 12px; color:var(--slate-dark); border:1px solid var(--border); border-radius: 0; background:#ffffff; font-size:12px; font-weight:650; cursor:pointer; transition:.2s ease; white-space:nowrap; }
.document-tab:hover, .document-tab.active { color:#ffffff; border-color:var(--ink); background:var(--ink); }

.demo-content { display:grid; grid-template-columns:.78fr 72px 1.22fr; min-height:540px; padding:28px; background:linear-gradient(135deg,#fdfdfd,#f9f9f9); }
.demo-image-panel { min-width:0; display:flex; flex-direction:column; border:1px solid var(--border); border-radius: 0; background:#ffffff; overflow:hidden; }
.panel-heading { height:48px; display:flex; align-items:center; justify-content:space-between; padding:0 16px; border-bottom:1px solid var(--border); }
.panel-heading span { font-size:12px; font-weight:700; }
.panel-heading small { color:var(--slate); font-size:12px; text-transform:uppercase; letter-spacing:.08em; }
.demo-image-wrap { position:relative; min-height:0; flex:1; display:flex; align-items:center; justify-content:center; padding:26px; background-color:#f1f1f1; background-image:linear-gradient(45deg,#ebebeb 25%,transparent 25%),linear-gradient(-45deg,#ebebeb 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#ebebeb 75%),linear-gradient(-45deg,transparent 75%,#ebebeb 75%); background-position:0 0,0 8px,8px -8px,-8px 0; background-size:16px 16px; }
.original-wrap img { width:100%; max-height:410px; object-fit:contain; }
.demo-processing { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; }
.demo-processing > span { height:70px; border-left:1px dashed #c9c9c9; }
.demo-processing > div { display:flex; gap:4px; }
.demo-processing i { width:5px; height:5px; border-radius: 0; background:#c6c6c6; animation:pulse 1.2s infinite ease-in-out; }
.demo-processing i:nth-child(2){animation-delay:.15s}.demo-processing i:nth-child(3){animation-delay:.3s}
.demo-processing svg { width:28px; fill:none; stroke:var(--blue); stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.demo-result-grid { min-height:0; flex:1; display:grid; grid-template-columns:1fr 1.04fr; }
.result-wrap { border-right:1px solid var(--border); }
.result-wrap img { width:auto; height:auto; max-width:88%; max-height:380px; box-shadow:0 4px 14px rgba(0,0,0,.12),0 1px 3px rgba(0,0,0,.07); transition:opacity .18s ease, transform .3s ease; }
.result-wrap.loading img { opacity:.15; transform:scale(.98); }
.demo-loader { position:absolute; z-index:2; inset:0; display:none; align-items:center; justify-content:center; }
.result-wrap.loading .demo-loader { display:flex; }
.demo-loader span { width:30px; height:30px; border:3px solid #e9e9e9; border-top-color:var(--blue); border-radius: 0; animation:spin .7s linear infinite; }
.spec-card { display:flex; flex-direction:column; min-width:0; padding:20px; }
.spec-card-head { display:flex; align-items:center; justify-content:space-between; padding-bottom:14px; border-bottom:1px solid var(--border); font-size:12px; font-weight:700; }
.spec-card-head i { width:7px; height:7px; border-radius: 0; background:var(--mint); box-shadow: none; }
.spec-card dl { margin:8px 0 0; }
.spec-card dl > div { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 0; border-bottom:1px solid #f1f1f1; }
.spec-card dt { color:var(--slate); font-size:12px; }
.spec-card dd { margin:0; color:var(--ink); font-size:12px; font-weight:650; text-align:right; }
.color-dot { display:inline-block; width:8px; height:8px; margin-right:3px; border:1px solid #d6d6d6; border-radius: 0; background:#ffffff; vertical-align:middle; }
.spec-checks { display:flex; flex-direction:column; gap:8px; margin-top:auto; padding-top:18px; }
.spec-checks span { display:flex; align-items:center; gap:7px; color:#414141; font-size:12px; font-weight:650; }
.spec-checks i { width:17px; height:17px; display:inline-flex; align-items:center; justify-content:center; border-radius: 0; background:var(--mint-soft); font-style:normal; }
.demo-cta { min-height:88px; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:18px 24px; border-top:1px solid var(--border); }
.demo-cta p { display:flex; flex-direction:column; margin:0; font-size:13px; }
.demo-cta p span { color:var(--slate); font-size:12px; }
.demo-cta > div { display:flex; gap:9px; }

.api-bridge { color:#ffffff; background:#1b1b1b; overflow:hidden; }
.api-bridge-grid { display:grid; grid-template-columns:1fr .92fr; align-items:center; gap:90px; }
.api-bridge-copy h2 { max-width:620px; color:#ffffff; }
.api-bridge-copy > p { max-width:640px; color:#bbbbbb; margin:22px 0 0; }
.api-bridge-copy .docs-note { padding-left:16px; border-left:2px solid #9d9d9d; color:#979797; font-size:13px; }
.bridge-actions { display:flex; gap:10px; margin-top:30px; }
.code-window { border:1px solid var(--border-dark); border-radius: 0; background:#141414; box-shadow: none; overflow:hidden; }
.code-tabs { height:49px; display:flex; align-items:center; gap:22px; padding:0 18px; color:#747474; border-bottom:1px solid var(--border-dark); font-size:12px; }
.code-tabs span { height:49px; display:flex; align-items:center; }
.code-tabs .active { color:#ffffff; border-bottom:2px solid #b2b2b2; }
.code-tabs small { margin-left:auto; color:#747474; font-size:12px; }
.code-window pre { margin:0; padding:25px 24px; overflow:auto; color:#d6d6d6; font:12px/1.9 ui-monospace,SFMono-Regular,Menlo,monospace; }
.code-purple{color:#d2d2d2}.code-muted{color:#a4a4a4}.code-blue{color:#bbbbbb}.code-green{color:#a9a9a9}
.code-response { display:flex; justify-content:space-between; align-items:center; padding:13px 18px; color:#a4a4a4; border-top:1px solid var(--border-dark); background:#181818; font-size:12px; }
.code-response span { color:#a9a9a9; font-weight:650; }
.code-response code { font:inherit; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; }

.specs-section { background:#ffffff; }
.specs-grid { display:grid; grid-template-columns:1fr .82fr; align-items:center; gap:100px; }
.specs-copy > p { max-width:640px; margin:22px 0 0; }
.country-tags { display:flex; flex-wrap:wrap; gap:8px; margin:30px 0 0; }
.country-tags span { padding:7px 11px; color:var(--slate-dark); border:1px solid var(--border); border-radius: 0; background:#ffffff; font-size:12px; font-weight:600; }
.specs-copy .specs-note { margin:27px 0 24px; padding-left:15px; border-left:2px solid var(--blue); font-size:13px; }
.spec-definition-card { border:1px solid var(--border); border-radius: 0; background:#fbfbfb; box-shadow: none; overflow:hidden; }
.definition-head { display:flex; align-items:center; justify-content:space-between; padding:20px 22px; border-bottom:1px solid var(--border); background:#ffffff; }
.definition-head > div { display:flex; flex-direction:column; }
.definition-head span { color:var(--slate); font-size:12px; text-transform:uppercase; letter-spacing:.08em; }
.definition-head strong { margin-top:3px; font:12px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace; }
.definition-status { display:flex; align-items:center; gap:7px; color:#414141 !important; font-weight:700; }
.definition-status i { width:7px; height:7px; border-radius: 0; background:var(--mint); }
.passport-preview { position:relative; height:250px; display:flex; align-items:center; justify-content:center; padding:24px; background:linear-gradient(rgba(131,131,131,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(131,131,131,.035) 1px,transparent 1px),#f5f5f5; background-size:20px 20px; overflow:hidden; }
.passport-preview img { height:205px; width:205px; object-fit:cover; box-shadow: none; }
.preview-lines span { position:absolute; left:21%; right:21%; border-top:1px dashed rgba(131,131,131,.5); }
.preview-lines span:first-child{top:31%}.preview-lines span:nth-child(2){top:47%}.preview-lines span:last-child{top:74%}
.definition-list { display:grid; grid-template-columns:repeat(2,1fr); padding:10px 22px; background:#ffffff; }
.definition-list > div { display:flex; flex-direction:column; gap:3px; padding:12px 0; border-bottom:1px solid #f1f1f1; }
.definition-list > div:nth-child(even){padding-left:20px;border-left:1px solid #f1f1f1}.definition-list > div:last-child{border-bottom:0}
.definition-list span { color:var(--slate); font-size:12px; }
.definition-list strong { font-size:12px; }
.definition-list i { display:inline-block; width:8px; height:8px; border:1px solid #d6d6d6; border-radius: 0; background:#ffffff; }
.definition-footer { padding:14px 22px; color:var(--slate); border-top:1px solid var(--border); background:#fcfcfc; font-size:12px; }

.solutions-section { background:#fafafa; border-block:1px solid #efefef; }
.split-heading { display:grid; grid-template-columns:1.2fr .8fr; align-items:end; gap:100px; }
.split-heading > p { margin:0 0 4px; }
.solution-grid { display:grid; grid-template-columns:repeat(4,1fr); border-block:1px solid var(--border); }
.solution-grid article { position:relative; min-height:330px; padding:34px 28px; border-left:1px solid var(--border); }
.solution-grid article:first-child { border-left:0; }
.solution-card-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 32px; }
.solution-number { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; min-height: 32px; color: #666; font: 14px/1 ui-monospace, SFMono-Regular, Menlo, monospace; }
.solution-grid h3 { margin:46px 0 12px; font-size:20px; letter-spacing:-.025em; line-height:1.25; }
.solution-grid p { margin:0; color:var(--slate); font-size:14px; line-height:1.7; }
.solution-icon { width:42px; height:42px; display:flex; align-items:center; justify-content:center; border-radius: 0; }
.solution-icon.blue{color:var(--blue);background:var(--blue-soft)}.solution-icon.mint{color:#505050;background:var(--mint-soft)}.solution-icon.amber{color:#6d6d6d;background:#f6f6f6}.solution-icon.violet{color:var(--violet);background:#f7f7f7}

.privacy-section { position:relative; color:#ffffff; background:#1d1d1d; overflow:hidden; }
.privacy-section::before { content:""; position:absolute; inset:0; opacity:.13; background-image:linear-gradient(rgba(255,255,255,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.12) 1px,transparent 1px); background-size:48px 48px; mask-image:linear-gradient(to bottom,black,transparent 80%); }
.privacy-orb { position:absolute; top:-250px; right:-170px; width:650px; height:650px; border-radius: 0; background:rgba(131,131,131,.32); filter:blur(90px); }
.privacy-section .shell { position:relative; }
.privacy-heading { display:grid; grid-template-columns:1.1fr .9fr; align-items:end; gap:100px; margin-bottom:62px; }
.privacy-heading h2 { color:#ffffff; }
.privacy-heading p { color:#bbbbbb; margin:0 0 20px; }
.light-link { color:#d5d5d5; }
.privacy-grid { display:grid; grid-template-columns:repeat(4,1fr); border:1px solid var(--border-dark); border-radius: 0; background:rgba(255,255,255,.035); overflow:hidden; }
.privacy-grid article { min-height:250px; padding:28px; border-left:1px solid var(--border-dark); }
.privacy-grid article:first-child { border-left:0; }
.privacy-grid article > span { display:inline-block; margin-bottom:66px; color:#c6c6c6; font:12px/1 ui-monospace,SFMono-Regular,Menlo,monospace; }
.privacy-grid h3 { margin:0 0 12px; font-size:18px; }
.privacy-grid p { margin:0; color:#a4a4a4; font-size:13px; line-height:1.7; }

.products-section { background:#ffffff; }
.products-heading { margin-bottom:50px; }
.product-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.product-card { position:relative; min-height:240px; padding:28px 80px 28px 28px; color:var(--ink); border:1px solid var(--border); border-radius: 0; background:#ffffff; text-decoration:none; transition:.25s ease; }
.product-card:hover { border-color:#d5d5d5; background:#fbfbfb; transform:translateY(-3px); box-shadow: none; }
.product-icon { width:45px; height:45px; display:flex; align-items:center; justify-content:center; color:var(--blue); border-radius: 0; background:var(--blue-soft); }
.product-card h3 { margin:32px 0 9px; font-size:18px; letter-spacing:-.02em; }
.product-card p { max-width:430px; margin:0; color:var(--slate); font-size:13px; line-height:1.7; }
.product-card > span { position:absolute; right:24px; bottom:25px; color:var(--blue); font-size:12px; font-weight:650; }

.faq-section { background:#fafafa; border-top:1px solid #efefef; }
.faq-grid { display:grid; grid-template-columns:.65fr 1.35fr; align-items:start; gap:100px; }
.faq-intro { position:sticky; top:120px; }
.faq-intro h2 { margin-bottom:25px; }
.faq-intro > p { margin:0 0 5px; }
.faq-list { border-top:1px solid #d6d6d6; }
.faq-list details { border-bottom:1px solid #d6d6d6; }
.faq-list summary { position:relative; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:23px 44px 23px 0; cursor:pointer; font-size:16px; font-weight:650; list-style:none; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary span::before, .faq-list summary span::after { content:""; position:absolute; top:50%; right:7px; width:14px; border-top:1.5px solid var(--ink); transition:transform .2s ease; }
.faq-list summary span::after { transform:rotate(90deg); }
.faq-list details[open] summary span::after { transform:rotate(0); }
.faq-list details p { max-width:760px; margin:-4px 0 24px; padding-right:45px; color:var(--slate); font-size:14px; line-height:1.75; }
.faq-list details p a { color:var(--blue); }

.final-cta { padding:0 0 36px; background:#fafafa; }
.final-cta-inner { position:relative; padding:82px 90px; color:#ffffff; border-radius: 0; background:linear-gradient(125deg,#6c6c6c,#838383 58%,#989898); overflow:hidden; text-align:center; }
.final-cta-inner::before { content:""; position:absolute; width:360px; height:360px; left:-170px; bottom:-230px; border:1px solid rgba(255,255,255,.2); border-radius: 0; box-shadow: none; }
.final-cta .eyebrow { position:relative; justify-content:center; color:#e9e9e9; }
.final-cta h2 { position:relative; max-width:820px; margin:0 auto; font-size:clamp(38px,4vw,52px); letter-spacing:-.045em; line-height:1.1; }
.final-cta p { position:relative; max-width:650px; margin:20px auto 0; color:#e9e9e9; font-size:16px; }
.final-actions { position:relative; display:flex; justify-content:center; gap:10px; margin-top:30px; }
.final-cta small { position:relative; display:block; margin-top:27px; color:#dfdfdf; font-size:12px; }
.final-cta small a { color:#ffffff; }
.cta-decoration { position:absolute; top:33px; right:38px; display:flex; gap:5px; transform:rotate(-12deg); }
.cta-decoration span { width:7px; height:50px; border-radius: 0; background:rgba(255,255,255,.11); }
.cta-decoration span:nth-child(2){height:75px}.cta-decoration span:nth-child(3){height:34px}

.site-footer { padding:78px 0 28px; color:#cbcbcb; background:#141414; }
.site-footer .brand { color:#ffffff; }
.footer-grid { display:grid; grid-template-columns:1.35fr repeat(3,.65fr); gap:70px; padding-bottom:64px; }
.footer-brand p { max-width:330px; margin:20px 0 0; color:#8b8b8b; font-size:13px; line-height:1.7; }
.footer-grid nav { display:flex; flex-direction:column; align-items:flex-start; gap:11px; }
.footer-grid nav h2 { margin:0 0 8px; color:#ffffff; font-size:12px; }
.footer-grid nav a { color:#9b9b9b; font-size:12px; text-decoration:none; }
.footer-grid nav a:hover { color:#ffffff; }
.footer-bottom { display:flex; justify-content:space-between; padding-top:25px; color:#747474; border-top:1px solid rgba(255,255,255,.1); font-size:12px; }

.reveal { opacity: 1; }
@keyframes pulse { 0%,80%,100%{opacity:.35;transform:scale(.8)}40%{opacity:1;transform:scale(1)} }
@keyframes spin { to { transform:rotate(360deg); } }

@media (max-width: 1120px) {
  .desktop-nav { gap:18px; }
  .desktop-nav a { font-size:13px; }
  .hero-grid { grid-template-columns:1fr 1fr; gap:44px; }
  .hero h1 { font-size:52px; }
  .hero-workflow { grid-template-columns:1fr 34px .78fr; padding-inline:18px; }
  .hero-checks { padding-inline:18px; }
  .mini-check-list { flex-wrap:wrap; }
  .demo-toolbar { flex-wrap:wrap; }
  .toolbar-separator { display:none; }
  .api-bridge-grid, .specs-grid { gap:60px; }
  .solution-grid article { padding-inline:20px; }
  .footer-grid { gap:38px; }
}

@media (max-width: 960px) {
  :root { --header-height: 66px; }
  .shell { width:min(calc(100% - 36px),var(--shell)); }
  .section { padding:96px 0; }
  .desktop-nav, .header-actions { display:none; }
  .menu-toggle { width:42px; height:42px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; margin-left:auto; padding:0; border:0; border-radius: 0; background:transparent; }
  .menu-toggle span { width:20px; border-top:2px solid var(--ink); transition:.2s ease; }
  .menu-toggle[aria-expanded="true"] span:first-child { transform:translateY(7px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity:0; }
  .menu-toggle[aria-expanded="true"] span:last-child { transform:translateY(-7px) rotate(-45deg); }
  .mobile-nav { position:fixed; z-index:99; inset:var(--header-height) 0 0; display:flex; flex-direction:column; gap:0; padding:20px 18px 30px; background:#ffffff; visibility:hidden; opacity:0; transform:translateY(-8px); transition:.2s ease; }
  .mobile-nav.open { visibility:visible; opacity:1; transform:translateY(0); }
  .mobile-nav > a:not(.button) { padding:15px 4px; border-bottom:1px solid var(--border); color:var(--ink); font-size:16px; font-weight:600; text-decoration:none; }
  .mobile-nav .button { margin-top:20px; }
  .hero { min-height:auto; padding:94px 0 100px; }
  .hero-grid { grid-template-columns:1fr; gap:64px; }
  .hero-copy { max-width:720px; }
  .hero-product { width:min(100%,680px); margin-inline:auto; transform:none; }
  .proof-grid { grid-template-columns:repeat(2,1fr); }
  .proof-grid > div { min-height:100px; justify-content:center; }
  .proof-grid > div:nth-child(3) { padding-left:0; border-left:0; border-top:1px solid var(--border); }
  .proof-grid > div:nth-child(4) { border-top:1px solid var(--border); }
  .bento-grid { grid-template-columns:1fr 1fr; }
  .bento-large { grid-column:1/-1; }
  .demo-content { grid-template-columns:1fr; gap:18px; }
  .demo-processing { min-height:52px; flex-direction:row; }
  .demo-processing > span { height:0; width:60px; border-left:0; border-top:1px dashed #c9c9c9; }
  .demo-processing svg { transform:rotate(90deg); }
  .demo-image-panel { min-height:440px; }
  .demo-result-grid { min-height:390px; }
  .api-bridge-grid, .specs-grid { grid-template-columns:1fr; }
  .code-window { max-width:680px; width:100%; }
  .spec-definition-card { max-width:620px; width:100%; margin-inline:auto; }
  .split-heading, .privacy-heading { grid-template-columns:1fr; gap:24px; }
  .solution-grid { grid-template-columns:repeat(2,1fr); }
  .solution-grid article:nth-child(3) { border-left:0; border-top:1px solid var(--border); }
  .solution-grid article:nth-child(4) { border-top:1px solid var(--border); }
  .privacy-grid { grid-template-columns:repeat(2,1fr); }
  .privacy-grid article:nth-child(3) { border-left:0; border-top:1px solid var(--border-dark); }
  .privacy-grid article:nth-child(4) { border-top:1px solid var(--border-dark); }
  .faq-grid { grid-template-columns:1fr; gap:50px; }
  .faq-intro { position:static; max-width:600px; }
  .final-cta-inner { padding-inline:45px; }
  .footer-grid { grid-template-columns:1.2fr repeat(3,.8fr); gap:24px; }
}

@media (max-width: 680px) {
  .shell { width:min(calc(100% - 28px),var(--shell)); }
  .section { padding:78px 0; }
  .section-small { padding:76px 0; }
  .brand { font-size:17px; }
  .hero { padding-top:72px; }
  .hero h1 { font-size:42px; letter-spacing:-.05em; }
  .hero-lead { font-size:17px; }
  .hero-actions, .bridge-actions, .final-actions { flex-direction:column; align-items:stretch; }
  .hero-actions .button, .bridge-actions .button, .final-actions .button { width:100%; }
  .hero-proof { align-items:flex-start; flex-direction:column; gap:4px; }
  .hero-proof i { display:none; }
  .hero-product-top { grid-template-columns:1fr 1fr; }
  .hero-product-top > span:nth-child(2) { display:none; }
  .hero-workflow { min-height:0; grid-template-columns:1fr 28px .82fr; padding:18px 12px 14px; }
  .source-photo-wrap { height:190px; }
  .card-label { font-size:12px; }
  .hero-checks { grid-template-columns:1fr; padding:0 12px 14px; }
  .hero-checks div { font-size:12px; }
  .proof-grid { grid-template-columns:1fr; padding-block:8px; }
  .proof-grid > div, .proof-grid > div:nth-child(3), .proof-grid > div:nth-child(4) { min-height:82px; padding-left:0; border-left:0; border-top:1px solid var(--border); }
  .proof-grid > div:first-child { border-top:0; }
  .section-heading h2, .specs-copy h2, .faq-intro h2, .privacy-heading h2, .api-bridge-copy h2 { font-size:36px; }
  .section-heading { margin-bottom:42px; }
  .bento-grid { grid-template-columns:1fr; }
  .bento-large { min-height:610px; grid-template-columns:1fr; padding:28px 0 0 28px; }
  .bento-large .bento-copy { padding-top:52px; padding-right:24px; }
  .crop-visual { width:92%; height:370px; margin-top:30px; }
  .bento-small { min-height:240px; }
  .custom-spec-callout { align-items:flex-start; flex-direction:column; }
  .demo-toolbar { align-items:flex-start; flex-direction:column; padding:18px; }
  .sample-list { width:100%; }
  .sample-button { width:46px; height:46px; }
  .document-tabs { width:100%; overflow-x:auto; padding-bottom:3px; }
  .document-tab { flex:0 0 auto; }
  .demo-content { padding:12px; }
  .demo-image-panel { min-height:350px; }
  .demo-result-grid { grid-template-columns:1fr; }
  .result-wrap { min-height:310px; border-right:0; border-bottom:1px solid var(--border); }
  .spec-card { min-height:300px; }
  .demo-cta { align-items:flex-start; flex-direction:column; }
  .demo-cta > div { width:100%; flex-direction:column; }
  .demo-cta .button { width:100%; }
  .api-bridge-grid { gap:45px; }
  .code-window pre { padding:20px 16px; font-size:12px; }
  .country-tags { gap:6px; }
  .definition-list { grid-template-columns:1fr; }
  .definition-list > div:nth-child(even) { padding-left:0; border-left:0; }
  .solution-grid, .privacy-grid, .product-grid { grid-template-columns:1fr; }
  .solution-grid article, .solution-grid article:nth-child(3), .solution-grid article:nth-child(4) { min-height:275px; border-left:0; border-top:1px solid var(--border); }
  .solution-grid article:first-child { border-top:0; }
  .privacy-grid article, .privacy-grid article:nth-child(3), .privacy-grid article:nth-child(4) { min-height:220px; border-left:0; border-top:1px solid var(--border-dark); }
  .privacy-grid article:first-child { border-top:0; }
  .privacy-grid article > span { margin-bottom:42px; }
  .product-card { padding-right:28px; }
  .product-card > span { position:static; display:inline-block; margin-top:18px; }
  .faq-list summary { font-size:15px; }
  .final-cta { padding-bottom:14px; }
  .final-cta-inner { width:calc(100% - 20px); padding:66px 20px; border-radius: 0; }
  .footer-grid { grid-template-columns:1fr 1fr; gap:45px 25px; }
  .footer-brand { grid-column:1/-1; }
  .footer-grid nav:last-child { grid-column:1/-1; }
  .footer-bottom { align-items:flex-start; flex-direction:column; gap:6px; }
}

/* Four all-in-one API highlights. */
.proof-grid { grid-template-columns: repeat(4, 1fr); }

@media (max-width: 680px) {
  .proof-grid { grid-template-columns: 1fr; }
  .proof-grid > div,
  .proof-grid > div:nth-child(3),
  .proof-grid > div:nth-child(4) {
    min-height: 96px;
    padding: 20px 0;
    border-left: 0;
    border-top: 1px solid #ccc;
  }
  .proof-grid > div:first-child { border-top: 0; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}


/* Photographic specimens, monochrome ink, square geometry. */
.site-header, .site-header.scrolled { background: #fafafa; backdrop-filter: none; -webkit-backdrop-filter: none; }
.brand { font-size: 21px; letter-spacing: -.06em; }
.button { font-weight: 500; }
.button:hover, .product-card:hover { transform: none; }
.button-primary { background: #171717; }
.button-primary:hover { background: #383838; }
.button-secondary { background: transparent; border-color: #bbb; }
.button:focus-visible, a:focus-visible, button:focus-visible, summary:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.section { padding-block: 96px; }
.hero.section { min-height: 690px; padding-block: 88px 80px; background: #fafafa; }
.hero::after, .hero-product::before, .crop-visual::after, .final-cta-inner::before { display: none; }
.hero-grid { grid-template-columns: 1fr 1.08fr; gap: 62px; }
.hero h1 { font-size: clamp(58px, 5.5vw, 80px); font-weight: 500; line-height: 1.02; letter-spacing: -.065em; }
.hero h1 > span { color: #777; }
.eyebrow { color: #555; font: 12px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .09em; }
.eyebrow > span { display: none; }
.hero-lead { max-width: 460px; margin-top: 28px; font-size: 17px; line-height: 1.75; }
.hero-actions { gap: 10px; margin-top: 30px; }
.hero-docs { font-size: 12px; text-decoration: underline; text-underline-offset: 4px; }
.hero-proof { margin-top: 32px; font-size: 12px; }
.hero-product { align-self: center; background: #efefef; border: 1px solid #c8c8c8; transform: none; }
.hero-product-top { height: 52px; grid-template-columns: 1fr auto; background: transparent; padding-inline: 22px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-weight: 400; }
.live-status { color: #666; font-size: 12px; }
.hero-workflow { min-height: 320px; grid-template-columns: 1fr 30px 1fr; gap: 10px; padding: 32px 22px 24px; }
.hero-photo-card { border-color: #ccc; }
.card-label { height: 35px; padding-inline: 10px; gap: 8px; font: 12px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace; }
.source-photo-wrap { height: auto; aspect-ratio: 1; }
.source-photo-wrap img { object-fit: cover; }
.source-card { align-self: start; }
.source-card::after { content: "Original image"; display: block; padding: 7px 8px; border-top: 1px solid #ddd; color: #666; font: 12px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace; text-align: center; }
.hero-checks { padding: 0 22px 24px; gap: 0; }
.hero-checks div { padding: 4px; border: 0; background: transparent; font-size: 12px; font-weight: 400; }
.hero-checks span { color: #171717; }
.api-status { background: #171717; padding: 16px 22px; color: #ccc; }
.api-status b, .api-status > span { color: #fff; font-weight: 400; }
.proof-band { background: #fafafa; border-color: #ccc; }
.proof-grid { min-height: 114px; }
.proof-grid strong { font-size: 26px; font-weight: 500; letter-spacing: -.045em; }
.proof-grid span { font: 12px/1.6 ui-monospace, SFMono-Regular, Menlo, monospace; text-transform: uppercase; letter-spacing: .05em; }
.section-heading.centered { max-width: none; text-align: left; margin-inline: 0; }
.section-heading.centered .eyebrow { justify-content: flex-start; }
.section-heading.centered > p:last-child { max-width: 600px; margin: 18px 0 0; }
.section-heading h2, .specs-copy h2, .faq-intro h2, .privacy-heading h2, .api-bridge-copy h2 { font-weight: 500; font-size: clamp(34px, 3.3vw, 46px); letter-spacing: -.045em; line-height: 1.13; }
.section-heading > p:last-child, .specs-copy > p, .split-heading > p, .faq-intro > p, .privacy-heading p, .api-bridge-copy > p { font-size: 15px; }
.bento-grid { grid-template-columns: 1fr 1fr; gap: 0; border-top: 1px solid #ccc; border-left: 1px solid #ccc; }
.bento-card { border: 0; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; background: transparent; }
.bento-card h3 { font-size: 22px; font-weight: 500; }
.bento-card p { font-size: 14px; }
.bento-large { min-height: 360px; padding: 32px; grid-template-columns: 1fr 1fr; align-items: center; gap: 22px; }
.bento-large .bento-copy { padding-top: 56px; }
.bento-small { padding: 32px; min-height: 236px; }
.crop-visual { width: 100%; height: auto; aspect-ratio: 413 / 531; margin: 26px 0 0; border: 1px solid #ccc; background: #fff; align-self: center; }
.crop-visual img { object-fit: cover; object-position: center top; }
.crop-caption { position: absolute; bottom: 0; inset-inline: 0; padding: 8px 4px; color: #333; background: rgba(255,255,255,.94); font: 12px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace; text-align: center; }
.feature-index { top: 20px; right: 20px; color: #777; font-weight: 400; }
.feature-icon { width: 28px; height: 28px; border: 0; background: transparent; margin-bottom: 22px; }
.background-compare { max-width: 290px; gap: 16px; }
.background-compare figure { background: #eee; }
.background-compare img { height: 166px; object-fit: cover; object-position: center 20%; }
.background-compare figcaption { position: static; background: #fff; padding: 8px; border: 0; border-bottom: 1px solid #ddd; font-size: 12px; }
.mini-check-list { flex-wrap: wrap; }
.mini-check-list li, .output-options span { background: transparent; color: #555; border-color: #ccc; font-weight: 400; font-size: 12px; }
.custom-spec-callout { background: transparent; border: 0; border-bottom: 1px solid #ccc; margin-top: 0; padding: 22px 0; }
.custom-spec-callout .text-link { font-size: 12px; flex-shrink: 0; }
.demo-section { background: #eee; border-color: #ccc; }
.demo-shell { border-color: #bbb; }
.demo-toolbar { background: #fff; min-height: 86px; }
.demo-step b { color: #fff; background: #222; }
.sample-button:hover, .sample-button.active { outline: 2px solid #222; outline-offset: 2px; }
.demo-content { background: #e7e7e7; min-height: 480px; }
.demo-image-wrap { background: #f3f3f3; }
.result-wrap { background: #fff; }
.spec-card-head i, .spec-checks i { background: #eee; color: #222; }
.spec-checks span { color: #555; }
.demo-processing i { background: #333; animation: none; }
.demo-cta { background: #fff; }
.api-bridge { background: #191919; }
.api-bridge-copy > p { color: #bbb; }
.api-bridge-copy .docs-note { color: #aaa; border-color: #666; }
.eyebrow.light { color: #bbb; }
.code-window { background: #222; border-color: #555; }
.code-tabs, .code-tabs small { color: #aaa; }
.code-tabs .active { border-color: #eee; }
.code-purple, .code-blue { color: #eee; }
.code-green, .code-muted { color: #bbb; }
.code-response { background: #222; color: #bbb; }
.code-response span { color: #eee; }
.specs-section { background: #fafafa; }
.spec-definition-card { background: #eee; }
.passport-preview { background: #eaeaea; height: 270px; }
.passport-preview img { height: 218px; width: 218px; object-fit: cover; }
.definition-status { color: #555 !important; }
.definition-status i { background: #444; }
.country-tags { gap: 0; border-top: 1px solid #ccc; border-left: 1px solid #ccc; }
.country-tags span { flex: 1 0 33.333%; padding: 11px; font-weight: 400; background: transparent; border: 0; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; }
.solutions-section { background: #eee; border-top: 1px solid #ddd; }
.solution-grid { border-color: #ccc; background: transparent; }
.solution-grid article { min-height: 260px; }
.solution-grid h3, .privacy-grid h3 { font-weight: 500; }
.solution-icon, .solution-icon.blue, .solution-icon.mint, .solution-icon.amber, .solution-icon.violet { color: #333; background: transparent; }
.privacy-section { background: #fafafa; color: #171717; border-block: 1px solid #ccc; }
.privacy-heading h2 { color: #171717; }
.privacy-heading p, .privacy-section .eyebrow { color: #666; }
.privacy-section .light-link { color: #171717; }
.privacy-grid { border-color: #ccc; background: transparent; }
.privacy-grid article { border-color: #ccc; }
.privacy-grid article > span { color: #777; }
.privacy-grid h3 { color: #171717; }
.privacy-grid p { color: #666; }
.products-section { background: #fafafa; }
.product-grid { gap: 0; border-top: 1px solid #ccc; border-left: 1px solid #ccc; }
.product-card { min-height: 220px; background: transparent; border: 0; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; padding: 28px; }
.product-card:hover { background: #eee; border-color: #ccc; }
.product-icon { width: 28px; height: 28px; background: transparent; }
.product-card h3 { font-weight: 500; margin-top: 20px; }
.product-card > span { position: static; display: inline-block; margin-top: 22px; text-decoration: underline; text-underline-offset: 4px; }
.faq-section { background: #eee; }
.final-cta { padding: 0; background: #191919; }
.final-cta-inner { width: min(calc(100% - 48px), var(--shell)); padding: 80px 0; background: #191919; text-align: left; }
.final-cta .eyebrow, .final-actions { justify-content: flex-start; }
.final-cta h2 { margin: 0; font-weight: 500; font-size: clamp(42px, 4.5vw, 64px); }
.final-cta p { margin: 22px 0 0; color: #bbb; }
.final-cta small { color: #aaa; }
.site-footer { background: #191919; border-top: 1px solid #444; }
.footer-brand p, .footer-grid nav a { color: #bbb; }
.footer-bottom { color: #aaa; }
@media (max-width: 1120px) {
  .hero-grid { gap: 32px; }
  .hero h1 { font-size: 64px; }
  .hero-actions { flex-wrap: wrap; }
  .hero-workflow { padding-inline: 14px; gap: 6px; grid-template-columns: 1fr 22px 1fr; }
  .hero-checks { padding-inline: 10px; }
  .hero-checks div { font-size: 12px; }
  .bento-large { padding: 24px; gap: 16px; }
}
@media (max-width: 960px) {
  .hero-grid { grid-template-columns: 1fr 1fr; }
  .hero h1 { font-size: 55px; }
  .hero-product { max-width: none; }
  .hero-workflow { min-height: 240px; }
  .hero-checks { grid-template-columns: 1fr; }
  .hero-checks div { font-size: 12px; text-align: left; padding-left: 5px; }
  .hero-lead { font-size: 15px; }
  .bento-large { grid-template-columns: 1fr; }
  .bento-large .bento-copy { padding-top: 24px; }
  .crop-visual { max-width: 175px; justify-self: center; }
  .privacy-grid article:nth-child(3), .privacy-grid article:nth-child(4) { border-color: #ccc; }
}
@media (max-width: 680px) {
  .shell { width: calc(100% - 36px); }
  .section, .section-small { padding-block: 64px; }
  .hero.section { padding-block: 48px; }
  .hero-grid { grid-template-columns: 1fr; gap: 36px; }
  .hero h1 { font-size: clamp(50px, 12vw, 72px); }
  .hero-lead { font-size: 16px; }
  .hero-actions { flex-direction: row; }
  .hero-actions .button { width: auto; padding-inline: 14px; font-size: 13px; }
  .hero-proof { margin-top: 22px; }
  .hero-product-top { padding-inline: 14px; }
  .hero-product-top > span:nth-child(2) { display: inline-flex; }
  .hero-workflow { min-height: 0; padding: 22px 14px 18px; grid-template-columns: 1fr 22px 1fr; }
  .source-photo-wrap { height: auto; }
  .hero-checks { padding: 0 14px 16px; }
  .proof-grid { grid-template-columns: 1fr 1fr; padding: 0; }
  .proof-grid > div, .proof-grid > div:nth-child(3), .proof-grid > div:nth-child(4) { min-height: 95px; padding: 16px 10px; border: 0; }
  .proof-grid > div:nth-child(even) { border-left: 1px solid #ccc; }
  .proof-grid > div:nth-child(n+3) { border-top: 1px solid #ccc; }
  .proof-grid strong { font-size: 23px; }
  .proof-grid span { font-size: 12px; }
  .bento-grid { grid-template-columns: 1fr; }
  .bento-large { min-height: 0; padding: 28px; grid-template-columns: 1fr 1fr; }
  .bento-large .bento-copy { padding: 12px 0 0; }
  .crop-visual { height: auto; width: 100%; margin-top: 18px; }
  .crop-caption { font-size: 12px; }
  .bento-card h3 { font-size: 20px; }
  .bento-card p { font-size: 13px; }
  .custom-spec-callout .text-link { flex-shrink: 1; }
  .country-tags span { flex-basis: 50%; }
  .privacy-grid article, .privacy-grid article:nth-child(3), .privacy-grid article:nth-child(4) { border-color: #ccc; min-height: 185px; }
  .final-cta-inner { padding: 64px 0; }
  .final-cta h2 { font-size: 42px; }
  .footer-grid { gap: 36px 20px; }
}


/* Readable type and consistent controls across desktop, tablet, and phone. */
svg { display: block; flex-shrink: 0; }
.brand img { flex-shrink: 0; }
.button { min-height: 48px; line-height: 1.4; text-align: center; }
.button > span, .text-link > span { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 1.2em; height: 1.2em; line-height: 1; }
.text-link { width: max-content; max-width: 100%; line-height: 1.5; }
.feature-icon, .solution-icon, .product-icon { width: 32px; height: 32px; flex-shrink: 0; }
.feature-icon svg, .solution-icon svg, .product-icon svg { width: 24px; height: 24px; }
.hero-product-top { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px; height: auto; min-height: 52px; padding-block: 14px; }
.hero-photo-card { min-width: 0; }
.source-card { align-self: center; }
.source-card::after { display: none; }
.card-label { height: auto; min-height: 40px; font-size: 12px; line-height: 1.5; letter-spacing: 0; text-transform: none; }
.result-size { display: flex; flex-direction: column; justify-content: center; gap: 3px; min-height: 58px; font-size: 12px; }
.flow-arrow { align-self: center; justify-content: center; }
.flow-arrow > span { display: none; }
.flow-arrow svg { width: 24px; height: 24px; }
.hero-checks { display: flex; flex-wrap: wrap; gap: 10px 18px; }
.hero-checks div { display: flex; align-items: flex-start; gap: 6px; width: max-content; max-width: 100%; flex: 0 0 auto; padding: 0; font-size: 12px; line-height: 1.5; white-space: normal; text-align: left; }
.hero-checks span, .mini-check-list span { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 16px; height: 18px; margin: 0; font-style: normal; }
.api-status { gap: 8px 16px; flex-wrap: wrap; font-size: 12px; }
.proof-grid > div { min-width: 0; padding-right: 20px; }
.proof-grid strong { line-height: 1.25; }
.proof-grid span { margin-top: 6px; text-transform: none; letter-spacing: 0; font-family: inherit; font-size: 14px; line-height: 1.5; }
.crop-caption { position: static; display: block; border-top: 1px solid #ddd; font-size: 12px; }
.crop-visual { aspect-ratio: auto; }
.crop-visual img { height: auto; aspect-ratio: 413 / 531; }
.background-compare figcaption { font-size: 13px; }
.mini-check-list li { display: flex; align-items: flex-start; gap: 5px; width: max-content; max-width: 100%; flex: 0 0 auto; white-space: normal; }
.mini-check-list li, .output-options span { font-size: 13px; line-height: 1.5; }
.feature-index { line-height: 1.5; }
.demo-toolbar { flex-wrap: wrap; gap: 16px; }
.sample-list { gap: 10px; padding: 3px; }
.sample-button { width: 48px; height: 48px; flex-shrink: 0; }
.document-tabs { flex-wrap: wrap; gap: 8px; padding: 3px; overflow: visible; }
.document-tab { min-height: 44px; font-size: 14px; }
.demo-step { font-size: 14px; }
.demo-step b { width: 26px; height: 26px; flex-shrink: 0; }
.demo-result-grid { grid-template-columns: minmax(0, 1fr) minmax(220px, 1fr); }
.panel-heading { min-height: 48px; height: auto; gap: 12px; padding-block: 12px; }
.panel-heading span { font-size: 14px; }
.spec-card-head { font-size: 14px; gap: 12px; }
.spec-card dt, .spec-card dd { font-size: 13px; }
.spec-card dl > div { align-items: baseline; }
.spec-checks span { font-size: 13px; }
.spec-checks i { flex-shrink: 0; font-size: 12px; line-height: 1; }
.spec-card-head i, .definition-status i { flex-shrink: 0; }
.color-dot, .definition-list i { width: 10px; height: 10px; vertical-align: baseline; }
.demo-cta p, .demo-cta p span { font-size: 14px; }
.code-window pre { font-size: 14px; line-height: 1.8; }
.code-tabs, .code-tabs small, .code-response { font-size: 13px; }
.definition-list strong { font-size: 15px; }
.definition-list span, .definition-head span, .definition-footer { font-size: 13px; }
.definition-head { gap: 16px; flex-wrap: wrap; }
.definition-head strong { font-size: 14px; }
.country-tags span { font-size: 14px; }
.faq-list summary { min-height: 56px; line-height: 1.5; }
.faq-list summary span { position: absolute; right: 0; top: 50%; width: 28px; height: 28px; transform: translateY(-50%); }
.faq-list summary span::before, .faq-list summary span::after { right: 7px; transform-origin: center; }
.final-cta small { font-size: 13px; }
.footer-grid nav h2, .footer-grid nav a { font-size: 14px; }
.footer-bottom { font-size: 12px; }
@media (min-width: 961px) and (max-width: 1120px) {
  .demo-content { grid-template-columns: .7fr 40px 1.3fr; padding: 18px; }
  .demo-image-wrap { padding: 16px; }
  .header-inner { gap: 20px; }
  .desktop-nav { gap: 14px; }
  .header-actions { gap: 12px; }
}
@media (max-width: 960px) {
  .hero-grid { grid-template-columns: 1fr; gap: 40px; }
  .hero-product { width: min(100%, 640px); }
  .hero-lead { max-width: 600px; font-size: 17px; }
  .hero-workflow { min-height: 0; }
  .hero-checks { gap: 10px 18px; }
  .hero-checks div { font-size: 12px; padding: 0; }
  .bento-large { grid-template-columns: 1fr 1fr; }
  .crop-visual { max-width: 220px; }
  .menu-toggle { width: 48px; height: 48px; flex-shrink: 0; cursor: pointer; }
  .mobile-nav { overflow-y: auto; max-height: calc(100dvh - var(--header-height)); padding-bottom: max(24px, env(safe-area-inset-bottom)); }
  .mobile-nav > a { flex-shrink: 0; }
  .demo-processing { min-height: 32px; gap: 0; }
  .demo-processing > div, .demo-processing > span { display: none; }
  .proof-grid > div { padding: 20px; }
  .proof-grid > div:first-child, .proof-grid > div:nth-child(3) { padding-left: 0; }
}
@media (max-width: 680px) {
  .hero.section { min-height: 0; padding-block: 40px 48px; }
  .hero h1 { font-size: clamp(46px, 11.5vw, 64px); line-height: 1.06; }
  .hero-lead { font-size: 18px; line-height: 1.75; margin-top: 24px; }
  .hero-actions { flex-direction: column; align-items: stretch; gap: 12px; }
  .hero-actions .button { width: 100%; font-size: 16px; }
  .hero-docs { min-height: 44px; margin-top: 12px; font-size: 16px; }
  .hero-proof { margin-top: 12px; font-size: 16px; line-height: 1.6; }
  .eyebrow { font-size: 14px; letter-spacing: .06em; }
  .hero-product-top { padding-inline: 12px; }
  .hero-workflow { padding: 18px 10px; grid-template-columns: minmax(0, 1fr) 22px minmax(0, 1fr); gap: 6px; }
  .card-label { padding-inline: 8px; }
  .result-size { padding-inline: 4px; font-size: 14px; }
  .hero-checks { flex-direction: column; padding: 0 12px 18px; gap: 8px; }
  .hero-checks div { font-size: 15px; }
  .api-status { padding: 14px 12px; }
  .proof-grid > div, .proof-grid > div:nth-child(3), .proof-grid > div:nth-child(4) { padding: 20px 12px; min-height: 112px; }
  .proof-grid strong { font-size: 24px; }
  .proof-grid span { font-size: 15px; line-height: 1.5; }
  .section-heading { margin-bottom: 32px; }
  .section-heading h2, .specs-copy h2, .faq-intro h2, .privacy-heading h2, .api-bridge-copy h2 { font-size: 34px; line-height: 1.18; }
  .section-heading > p:last-child, .specs-copy > p, .split-heading > p, .faq-intro > p, .privacy-heading p, .api-bridge-copy > p,
  .bento-card p, .solution-grid p, .privacy-grid p, .product-card p, .faq-list details p, .footer-brand p { font-size: 18px; line-height: 1.7; }
  .bento-large { grid-template-columns: 1fr; padding: 28px 24px 24px; gap: 20px; }
  .bento-large .bento-copy { padding: 12px 0 0; }
  .crop-visual { width: min(100%, 240px); max-width: 240px; margin-top: 0; }
  .crop-caption { font-size: 14px; }
  .bento-small { padding: 28px 24px; min-height: 0; }
  .bento-card h3 { font-size: 24px; line-height: 1.3; }
  .feature-icon { margin-bottom: 20px; }
  .background-compare { width: 100%; max-width: 340px; gap: 12px; }
  .background-compare img { height: auto; aspect-ratio: 4 / 5; }
  .custom-spec-callout { gap: 16px; }
  .custom-spec-callout p { font-size: 16px; line-height: 1.7; }
  .custom-spec-callout .text-link { font-size: 16px; }
  .text-link { overflow-wrap: anywhere; }
  .demo-toolbar { padding: 18px 14px; }
  .document-tabs { gap: 8px; }
  .document-tab { flex: 1 1 auto; padding-inline: 12px; }
  .demo-content { padding: 10px; gap: 10px; min-height: 0; }
  .demo-result-grid { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .demo-image-panel { min-height: 0; }
  .demo-image-wrap { padding: 20px; }
  .original-wrap { min-height: 260px; }
  .original-wrap img { max-height: 320px; }
  .result-wrap { min-height: 300px; }
  .result-wrap img { max-width: calc(100% - 16px); max-height: 300px; }
  .spec-card { min-height: 0; padding: 20px 16px; }
  .spec-card dt, .spec-card dd { font-size: 16px; }
  .spec-checks { padding-top: 20px; }
  .demo-cta { padding: 20px 16px; gap: 18px; }
  .demo-cta p { gap: 6px; font-size: 16px; }
  .demo-cta > div { gap: 12px; }
  .code-window pre { padding: 20px 16px; font-size: 15px; }
  .definition-list > div { flex-direction: row; align-items: baseline; justify-content: space-between; gap: 16px; }
  .definition-list strong { text-align: right; }
  .definition-list span, .definition-footer { font-size: 16px; }
  .solution-grid article { padding: 28px 24px; min-height: 0; }
  .solution-grid h3 { margin-top: 24px; font-size: 24px; }
  .privacy-grid article, .privacy-grid article:nth-child(3), .privacy-grid article:nth-child(4) { padding: 24px; min-height: 0; }
  .privacy-grid article > span { margin-bottom: 24px; }
  .privacy-grid h3, .product-card h3 { font-size: 24px; line-height: 1.35; }
  .product-card { padding: 28px 24px; }
  .product-card > span { font-size: 16px; }
  .faq-list summary { font-size: 18px; padding-block: 20px; }
  .faq-list details p { padding-right: 12px; }
  .faq-intro .text-link { font-size: 16px; }
  .final-cta-inner { width: calc(100% - 36px); }
  .final-cta h2 { font-size: 38px; line-height: 1.15; }
  .final-cta small { font-size: 16px; line-height: 1.7; overflow-wrap: anywhere; }
  .footer-grid { gap: 32px 20px; }
  .footer-grid nav { gap: 0; }
  .footer-grid nav h2 { margin-bottom: 10px; font-size: 16px; }
  .footer-grid nav a { display: flex; align-items: center; min-height: 44px; font-size: 16px; padding-block: 8px; }
  .footer-bottom { font-size: 15px; line-height: 1.6; }
  /* Secondary labels stay legible alongside the larger mobile body text. */
  .button, .button-small, .document-tab, .demo-step, .panel-heading span,
  .spec-card-head, .spec-checks span, .demo-cta p span, .country-tags span,
  .definition-list strong, .definition-head strong { font-size: 16px; }
  .hero-product-top, .live-status, .card-label, .api-status,
  .panel-heading small, .definition-head span, .feature-index,
  .code-tabs, .code-tabs small, .code-response { font-size: 14px; }
  .background-compare figcaption, .mini-check-list li, .output-options span { font-size: 15px; }
  .hero-checks span, .mini-check-list span { height: 22px; }
  .hero-proof, .specs-copy .specs-note, .api-bridge-copy .docs-note { font-size: 16px; }
  .solution-number { font-size: 16px; }
  .result-size { min-height: 68px; }
  .final-cta p { font-size: 18px; line-height: 1.7; }
}

/* Stack proof points anywhere the mobile navigation is active. Vertical
   dividers look like stray rules once this section becomes narrow. */
@media (max-width: 960px) {
  .proof-grid { grid-template-columns: 1fr; }
  .proof-grid > div,
  .proof-grid > div:nth-child(even),
  .proof-grid > div:nth-child(3),
  .proof-grid > div:nth-child(4) {
    min-height: 96px;
    padding: 20px 0;
    border-left: 0;
    border-top: 1px solid #ccc;
  }
  .proof-grid > div:first-child { border-top: 0; }
}