:root {
  --bg-canvas: #0F1211;
  --light-bg-canvas: #F4F5F2;
  --bg-surface: #1A1E1D;
  --light-bg-surface: #FFFFFF;
  --bg-surface2: #242928;
  --light-bg-surface2: #F0F1EE;
  --text-primary: #F2F4F3;
  --light-text-primary: #15191A;
  --text-secondary: #A3ACA9;
  --light-text-secondary: #5B6366;
  --accent-keep: #3DBB93;
  --light-accent-keep: #11785F;
  --accent-onKeep: #06231A;
  --light-accent-onKeep: #FFFFFF;
  --accent-tint: #163329;
  --light-accent-tint: #E3F2EC;
  --accent-onTint: #8FE0C4;
  --light-accent-onTint: #0B5A47;
  --badge-best: #F5B700;
  --light-badge-best: #F5B700;
  --destructive: #C2410C;
  --light-destructive: #C2410C;
  --border-hairline: #2C3230;
  --light-border-hairline: #E2E5E0;
  --overlay-scrim: rgba(21,25,26,0.72);
  --light-overlay-scrim: rgba(21,25,26,0.72);
  --space-4: 4px;
  --space-8: 8px;
  --space-12: 12px;
  --space-16: 16px;
  --space-20: 20px;
  --space-24: 24px;
  --space-32: 32px;
  --type-largeTitle: 34px;
  --type-title1: 28px;
  --type-title2: 22px;
  --type-title3: 20px;
  --type-headline: 17px;
  --type-body: 17px;
  --type-subheadline: 15px;
  --type-footnote: 13px;
  --type-caption1: 12px;
  --type-caption2: 11px;
  --radius-card: 20px;
  --radius-smallCard: 16px;
  --radius-thumbnail: 12px;
  --size-primaryButtonHeight: 56px;
  --size-secondaryButtonHeight: 44px;
  --size-minTapTarget: 44px;
  --motion-standard: 250ms;
}
/* Website layout extensions of the copied BestKeeper DesignSystem tokens. */
:root {
  --font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --font-editorial: Georgia, "Times New Roman", serif;
  --font-mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --page-width: 1200px;
  --hero-type: clamp(64px, 6.6vw, 96px);
  --heading-type: clamp(36px, 4.4vw, 58px);
  --card-type: clamp(24px, 2.5vw, 32px);
  --section-space: calc(var(--space-32) * 3.5);
  --dim: color-mix(in srgb, var(--text-secondary) 70%, var(--bg-canvas));
  --line: color-mix(in srgb, var(--border-hairline) 85%, transparent);
  --mint-line: color-mix(in srgb, var(--accent-keep) 35%, transparent);
  --shadow: 0 var(--space-24) calc(var(--space-32) * 3) color-mix(in srgb, var(--bg-canvas) 85%, transparent);
  --page-gutter: var(--space-32);
  color-scheme: dark;
  background: var(--bg-canvas);
  color: var(--text-primary);
  font-family: var(--font-body);
  font-size: var(--type-body);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--space-32) * 3); }
body { margin: 0; overflow-wrap: break-word; overflow-x: clip; }
a { color: inherit; text-decoration: none; text-underline-offset: var(--space-4); }
button { font: inherit; color: inherit; cursor: pointer; }
button, a { -webkit-tap-highlight-color: transparent; }
button:disabled { cursor: default; }
button, input { border-radius: 0; }
button:focus-visible, a:focus-visible, summary:focus-visible { outline: var(--space-4) solid var(--accent-onTint); outline-offset: var(--space-4); }
::selection { background: var(--accent-tint); color: var(--accent-onTint); }
[hidden] { display: none !important; }
img { display: block; max-width: 100%; object-fit: cover; }
svg { flex-shrink: 0; }
figure, p, h1, h2, h3 { margin: 0; }
h1, h2, h3 { font-weight: 500; line-height: 1.12; letter-spacing: -.045em; text-wrap: balance; }
h1 { font-size: var(--hero-type); }
h2 { font-size: var(--heading-type); }
h3 { font-size: var(--card-type); }
p { color: var(--text-secondary); }
strong { color: var(--text-primary); font-weight: 600; }
.container { width: min(var(--page-width), calc(100% - var(--page-gutter) * 2)); margin-inline: auto; }
.icon { width: var(--space-24); height: var(--space-24); vertical-align: middle; }
.section { padding-block: var(--section-space); }
.eyebrow { color: var(--accent-onTint); font-family: var(--font-mono); font-size: var(--type-caption2); font-weight: 500; letter-spacing: .12em; line-height: 1.6; margin-bottom: var(--space-24); }
.serif-word { color: var(--accent-onTint); font-family: var(--font-editorial); font-style: italic; font-weight: 400; letter-spacing: -.06em; }
.section-body { max-width: 48ch; font-size: var(--type-body); line-height: 1.8; margin-top: var(--space-24); }
.text-link { display: inline-flex; align-items: center; gap: var(--space-12); min-height: var(--size-minTapTarget); font-size: var(--type-subheadline); font-weight: 500; }
.text-link .icon { width: var(--space-20); height: var(--space-20); transition: transform var(--motion-standard); }
.text-link:hover { color: var(--accent-onTint); }
.text-link:hover .icon { transform: translateX(var(--space-4)); }
.button { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-16); min-height: var(--size-primaryButtonHeight); padding: var(--space-12) var(--space-24); border-radius: var(--space-32); border: 1px solid transparent; font-size: var(--type-subheadline); font-weight: 600; line-height: 1.4; transition: background var(--motion-standard), transform var(--motion-standard), border-color var(--motion-standard); }
.button:hover { transform: translateY(calc(var(--space-4) * -.5)); }
.primary { background: var(--accent-onTint); color: var(--accent-onKeep); }
.primary:hover { background: var(--text-primary); }
.secondary { background: transparent; border-color: var(--border-hairline); }
.secondary:hover { border-color: var(--accent-onTint); }
.skip-link { position: fixed; top: var(--space-8); left: var(--space-8); z-index: 100; background: var(--accent-onTint); color: var(--accent-onKeep); padding: var(--space-12) var(--space-20); transform: translateY(-180%); }
.skip-link:focus { transform: translateY(0); }
.site-header { border-bottom: 1px solid var(--line); position: relative; z-index: 20; }
.nav-shell { display: flex; align-items: center; justify-content: space-between; min-height: calc(var(--space-32) * 2.75); gap: var(--space-24); }
.brand { display: inline-flex; gap: var(--space-12); align-items: center; min-height: var(--size-minTapTarget); font-size: var(--type-title2); font-weight: 600; letter-spacing: -.045em; }
.brand-mark { width: var(--space-32); height: calc(var(--space-32) + var(--space-4)); color: var(--accent-onTint); }
.mark-spark { fill: var(--accent-onKeep); }
#main-nav { display: flex; gap: var(--space-32); align-items: center; }
#main-nav a { color: var(--text-secondary); font-size: var(--type-footnote); display: inline-flex; align-items: center; min-height: var(--size-minTapTarget); }
#main-nav a:hover { color: var(--text-primary); }
.nav-cta { display: inline-flex; align-items: center; justify-content: center; min-height: var(--size-secondaryButtonHeight); gap: var(--space-20); border: 1px solid var(--border-hairline); border-radius: var(--space-32); padding: var(--space-8) var(--space-20); font-size: var(--type-footnote); }
.nav-cta:hover { border-color: var(--accent-onTint); }
.nav-cta .icon { width: var(--space-16); height: var(--space-16); }
.menu-toggle { display: none; border: 1px solid var(--border-hairline); background: var(--bg-surface); width: var(--size-minTapTarget); height: var(--size-minTapTarget); border-radius: var(--radius-thumbnail); }
.hero { position: relative; display: grid; grid-template-columns: 1.06fr 1fr; align-items: center; gap: var(--space-16); padding-block: calc(var(--space-32) * 3.75) calc(var(--space-32) * 2.75); }
.hero::before { content: ''; position: absolute; width: 70%; height: 100%; top: 0; right: 0; z-index: -1; background: radial-gradient(ellipse, color-mix(in srgb, var(--accent-keep) 10%, transparent), transparent 65%); }
.hero .eyebrow { font-size: var(--type-caption2); margin-bottom: var(--space-24); letter-spacing: .09em; }
.hero h1 { line-height: 1.03; letter-spacing: -.065em; }
.hero-body { max-width: 44ch; margin-top: var(--space-32); font-size: var(--type-body); line-height: 1.8; }
.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-16) var(--space-24); margin-top: var(--space-32); }
.hero-actions .button { font-size: var(--type-footnote); padding-inline: var(--space-20); }
.hero-actions .text-link { font-size: var(--type-footnote); }
.availability { display: flex; align-items: center; gap: var(--space-8); margin-top: var(--space-24); font-size: var(--type-caption1); color: var(--text-secondary); }
.status-dot { width: calc(var(--space-4) * 1.5); height: calc(var(--space-4) * 1.5); border-radius: 50%; background: var(--accent-onTint); flex-shrink: 0; box-shadow: 0 0 var(--space-12) color-mix(in srgb, var(--accent-keep) 45%, transparent); }
.hero-figure { min-width: 0; margin-top: var(--space-16); }
.photo-stage { position: relative; aspect-ratio: 1.18; isolation: isolate; overflow: hidden; }
.photo-stage::before { position: absolute; content: ''; inset: -8% -3%; opacity: .26; background-image: linear-gradient(var(--border-hairline) 1px, transparent 1px), linear-gradient(90deg, var(--border-hairline) 1px, transparent 1px); background-size: var(--space-32) var(--space-32); mask-image: radial-gradient(ellipse, var(--bg-canvas), transparent 68%); }
.orbit { position: absolute; border: 1px solid var(--mint-line); border-radius: 50%; z-index: -1; opacity: .45; }
.orbit-one { width: 82%; height: 100%; left: 10%; top: -4%; transform: rotate(-25deg); }
.orbit-two { width: 105%; height: 76%; top: 10%; left: -2%; transform: rotate(-25deg); }
.back-photo { width: 48%; height: 69%; position: absolute; top: 14%; border-radius: var(--radius-smallCard); border: 1px solid var(--border-hairline); padding: var(--space-8); background: var(--bg-surface); box-shadow: var(--shadow); overflow: hidden; }
.back-photo img { width: 100%; height: 90%; border-radius: var(--space-8); filter: brightness(.68); }
.back-photo span { display: block; font-family: var(--font-mono); font-size: var(--type-caption2); color: var(--text-secondary); margin-top: var(--space-8); }
.back-left { left: 1%; transform: rotate(-13deg); }
.back-left img { object-position: 32% center; }
.back-right { right: 0; transform: rotate(13deg); }
.back-right img { object-position: 70% center; }
.keeper-photo { position: absolute; width: 62%; height: 83%; left: 19%; top: 3%; border: 1px solid var(--accent-onTint); border-radius: var(--radius-smallCard); padding: var(--space-8); background: var(--bg-surface); transform: rotate(-3deg); box-shadow: var(--shadow), 0 0 calc(var(--space-32) * 2) color-mix(in srgb, var(--accent-keep) 10%, transparent); }
.keeper-photo img { border-radius: var(--space-8); height: 100%; width: 100%; }
.keeper-photo::after { content: ''; position: absolute; inset: var(--space-8); border-radius: var(--space-8); background: linear-gradient(transparent 60%, var(--overlay-scrim)); }
.best-badge { display: inline-flex; gap: var(--space-8); align-items: center; background: var(--badge-best); color: var(--light-text-primary); border-radius: var(--space-32); padding: var(--space-8) var(--space-12); font-size: var(--type-caption1); font-weight: 600; line-height: 1.2; z-index: 2; }
.best-badge .icon { width: var(--space-16); height: var(--space-16); }
.keeper-photo .best-badge { position: absolute; top: var(--space-24); left: var(--space-20); }
.photo-bottom { position: absolute; bottom: var(--space-24); left: var(--space-20); right: var(--space-20); display: flex; flex-direction: column; gap: var(--space-8); z-index: 2; }
.photo-bottom > span:first-child { font-family: var(--font-mono); font-size: var(--type-caption2); color: var(--accent-onTint); }
.photo-bottom > span:last-child { display: flex; gap: var(--space-4); align-items: center; font-size: var(--type-caption1); color: var(--text-primary); }
.photo-bottom .icon { width: var(--space-16); height: var(--space-16); }
.local-chip { position: absolute; z-index: 5; bottom: 4%; left: 50%; transform: translateX(-50%); display: flex; align-items: center; justify-content: center; gap: var(--space-12); padding: var(--space-12) var(--space-16); background: var(--bg-surface); border: 1px solid var(--mint-line); border-radius: var(--radius-thumbnail); white-space: nowrap; box-shadow: var(--shadow); font-size: var(--type-caption1); }
.local-chip > .icon { color: var(--accent-onTint); width: var(--space-20); height: var(--space-20); }
.stage-cross { position: absolute; color: var(--accent-onTint); font-size: var(--type-title2); font-weight: 300; opacity: .5; }
.cross-one { top: 0; right: 13%; }.cross-two { bottom: 16%; left: 3%; }
.hero-figure figcaption { text-align: center; padding-top: var(--space-16); color: var(--text-secondary); font-size: var(--type-caption1); }
.hero-figure figcaption small { display: block; color: var(--text-secondary); font-family: var(--font-mono); font-size: var(--type-caption2); margin-top: var(--space-8); }
.promise-strip { border-block: 1px solid var(--line); display: grid; grid-template-columns: repeat(3,1fr); gap: var(--space-24); padding-block: var(--space-24); }
.promise-strip > div { display: flex; align-items: center; gap: var(--space-16); justify-content: center; }
.promise-strip > div + div { border-left: 1px solid var(--line); }
.promise-strip .icon { color: var(--accent-onTint); width: var(--space-24); height: var(--space-24); }
.promise-strip p { display: flex; flex-direction: column; gap: var(--space-4); font-size: var(--type-caption1); }
.promise-strip strong { font-size: var(--type-subheadline); }
.pick-section { display: grid; grid-template-columns: 1fr 1fr; gap: calc(var(--space-32) * 2); align-items: center; }
.pick-section h2 { font-size: clamp(36px,4vw,52px); }
.reason-line { display: flex; gap: var(--space-12); margin-top: var(--space-32); align-items: flex-start; }
.reason-line > .icon { color: var(--accent-onTint); margin-top: var(--space-4); }
.reason-line div { display: flex; flex-direction: column; gap: var(--space-4); font-size: var(--type-footnote); }
.reason-line span { color: var(--text-secondary); font-size: var(--type-caption1); }
.demo { border: 1px solid var(--line); border-radius: var(--radius-card); background: var(--bg-surface); padding: var(--space-20); box-shadow: 0 var(--space-16) calc(var(--space-32) * 2) color-mix(in srgb, var(--bg-canvas) 60%, transparent); }
.demo-heading { display: flex; justify-content: space-between; gap: var(--space-12); align-items: center; margin-bottom: var(--space-16); }
.demo-heading h3 { font-size: var(--type-headline); letter-spacing: -.025em; line-height: 1.5; }
.demo-heading p { font-size: var(--type-caption1); margin-top: var(--space-4); }
.demo-heading > .icon { color: var(--accent-onTint); }
.demo-photo { position: relative; aspect-ratio: 1.67; overflow: hidden; border-radius: var(--radius-thumbnail); }
.demo-photo > img { height: 100%; width: 100%; transition: object-position var(--motion-standard), transform var(--motion-standard); }
.demo-photo > .best-badge { position: absolute; top: var(--space-12); left: var(--space-12); }
.demo-photo .custom-pick { background: var(--accent-onTint); color: var(--accent-onKeep); }
.demo-shade { position: absolute; inset: 60% 0 0; background: linear-gradient(transparent, var(--overlay-scrim)); }
.demo-group { position: absolute; bottom: var(--space-12); left: var(--space-12); font-size: var(--type-caption1); color: var(--text-primary); }
.demo-options { display: grid; grid-template-columns: repeat(3,1fr); gap: var(--space-12); margin-top: var(--space-16); }
.demo-option { position: relative; padding: var(--space-4); border: 1px solid transparent; border-radius: var(--radius-thumbnail); background: var(--bg-surface2); transition: border-color var(--motion-standard); min-height: var(--size-minTapTarget); }
.demo-option:hover { border-color: var(--text-secondary); }
.demo-option[aria-pressed="true"] { border-color: var(--accent-onTint); background: var(--accent-tint); }
.demo-option > img { width: 100%; aspect-ratio: 1.9; height: auto; border-radius: var(--space-8); }
.demo-option:first-child > img { object-position: 25% center; filter: brightness(.8); }
.demo-option:last-child > img { object-position: 75% center; filter: brightness(.9); }
.demo-option > span { display: flex; justify-content: center; align-items: center; gap: var(--space-4); padding-block: var(--space-4); font-size: var(--type-caption2); }
.demo-option > span .icon { width: var(--space-12); height: var(--space-12); }
.selection-check { position: absolute; top: var(--space-8); right: var(--space-8); width: var(--space-16); height: var(--space-16); padding: calc(var(--space-4) / 2); border-radius: 50%; background: var(--accent-onTint); color: var(--accent-onKeep); opacity: 0; }
.demo-option[aria-pressed="true"] .selection-check { opacity: 1; }
.demo[data-selection="1"] .demo-photo > img { object-position: 25% center; transform: scale(1.06); }
.demo[data-selection="3"] .demo-photo > img { object-position: 75% center; transform: scale(1.12); }
.demo-status { color: var(--accent-onTint); display: flex; align-items: center; gap: var(--space-8); font-size: var(--type-caption1); margin-top: var(--space-16); }
.demo-status .icon { width: var(--space-16); height: var(--space-16); }
.demo-note { font-size: var(--type-caption2); margin-top: var(--space-8); }
.more-section { padding-top: calc(var(--space-32) * 1.5); }
.section-heading { margin-bottom: calc(var(--space-32) * 1.5); }
.feature-grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: var(--space-20); }
.feature-card { border-radius: var(--radius-card); border: 1px solid var(--line); background: var(--bg-surface); padding: var(--space-32); overflow: hidden; }
.feature-card p { font-size: var(--type-subheadline); line-height: 1.75; margin-top: var(--space-16); }
.card-copy h3 { line-height: 1.2; letter-spacing: -.035em; }
.swipe-card { grid-row: span 2; background: linear-gradient(140deg,var(--bg-surface),var(--accent-tint)); display: flex; flex-direction: column; }
.swipe-visual { width: 75%; max-width: calc(var(--space-32) * 10); margin: var(--space-32) auto var(--space-16); }
.month-row { display: flex; flex-direction: column; gap: var(--space-8); }
.month-row span { font-size: var(--type-caption2); font-family: var(--font-mono); letter-spacing: .1em; color: var(--text-secondary); }
.month-row strong { font-size: var(--type-title1); }
.swipe-stack { position: relative; aspect-ratio: .9; margin-top: var(--space-24); }
.swipe-stack > div { position: absolute; inset: var(--space-12) 0; border: 1px solid var(--mint-line); border-radius: var(--radius-smallCard); background: var(--bg-surface2); }
.swipe-stack > div:nth-child(1) { transform: rotate(8deg); }.swipe-stack > div:nth-child(2) { transform: rotate(-7deg); }
.swipe-stack > div:nth-child(3) { transform: rotate(-3deg); padding: var(--space-8); box-shadow: var(--shadow); }
.swipe-stack img { width: 100%; height: 100%; border-radius: var(--radius-thumbnail); object-position: 70% center; }
.swipe-stack > div > span { display: inline-flex; align-items: center; gap: var(--space-8); position: absolute; top: var(--space-24); right: var(--space-20); padding: var(--space-8) var(--space-12); border: 1px solid var(--accent-onTint); border-radius: var(--space-8); color: var(--accent-onTint); background: var(--accent-onKeep); transform: rotate(8deg); font-size: var(--type-footnote); }
.swipe-stack span .icon { width: var(--space-16); height: var(--space-16); }
.swipe-controls { display: flex; align-items: center; justify-content: center; gap: var(--space-20); margin-top: var(--space-16); }
.swipe-controls > span { display: grid; place-items: center; width: var(--size-primaryButtonHeight); height: var(--size-primaryButtonHeight); border: 1px solid var(--mint-line); border-radius: 50%; background: var(--bg-surface); }
.swipe-controls > span:last-child { color: var(--accent-onTint); background: var(--accent-tint); }
.feature-card .card-note { color: var(--text-secondary); font-size: var(--type-caption1); margin-top: var(--space-24); }
.swipe-card .card-note { text-align: center; margin-top: auto; padding-top: var(--space-16); color: var(--accent-onTint); }
.tidy-rows { margin-top: var(--space-24); display: flex; flex-direction: column; gap: var(--space-8); }
.tidy-rows > div { display: flex; align-items: center; gap: var(--space-12); background: var(--bg-surface2); border: 1px solid var(--line); border-radius: var(--radius-thumbnail); padding: var(--space-12) var(--space-16); font-size: var(--type-subheadline); }
.tidy-icon { color: var(--accent-onTint); }.tidy-rows > div > .icon { margin-left: auto; width: var(--space-16); height: var(--space-16); color: var(--text-secondary); }
.protection-card { position: relative; padding-right: calc(var(--space-32) * 3.5); }
.protection-card h3 { font-size: var(--type-title1); }
.protection-emblem { position: absolute; right: var(--space-24); top: var(--space-32); display: grid; place-items: center; width: calc(var(--space-32) * 2); height: calc(var(--space-32) * 2); border-radius: 50%; border: 1px solid var(--mint-line); background: var(--accent-tint); color: var(--accent-onTint); }
.protection-emblem .icon { width: var(--space-32); height: var(--space-32); }
.ledger-card { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: var(--space-16) var(--space-32); }
.ledger-card h3 { font-size: var(--type-title1); }.ledger-card .card-note { margin: 0; grid-column: 1 / -1; max-width: 76ch; }
.ledger-bars { display: flex; gap: var(--space-12); height: calc(var(--space-32) * 3); align-items: flex-end; border-bottom: 1px solid var(--line); }
.ledger-bars i { flex: 1; height: 40%; border-radius: var(--space-4) var(--space-4) 0 0; background: linear-gradient(var(--accent-keep),var(--accent-tint)); border: 1px solid var(--mint-line); }
.ledger-bars i:nth-child(3n+1) { height: 55%; }.ledger-bars i:nth-child(3n+2) { height: 70%; }.ledger-bars i:nth-child(4n) { height: 90%; }.ledger-bars i:nth-last-child(1) { height: 100%; background: var(--accent-onTint); }
.workflow { border-block: 1px solid var(--line); background: color-mix(in srgb,var(--bg-surface) 35%,var(--bg-canvas)); }
.steps { display: grid; grid-template-columns: repeat(3,1fr); gap: calc(var(--space-32) * 1.5); }
.step-no { display: block; padding-bottom: var(--space-24); margin-bottom: var(--space-24); border-bottom: 1px solid var(--mint-line); font-family: var(--font-mono); color: var(--accent-onTint); font-size: var(--type-footnote); }
.steps h3 { font-size: var(--type-title2); letter-spacing: -.03em; }.steps p { font-size: var(--type-subheadline); line-height: 1.8; margin-top: var(--space-16); }
.recovery-note { display: flex; align-items: flex-start; gap: var(--space-12); border-top: 1px solid var(--line); padding-top: var(--space-24); margin-top: calc(var(--space-32) * 1.5); font-size: var(--type-footnote); }
.recovery-note .icon { color: var(--accent-onTint); width: var(--space-20); height: var(--space-20); }
.privacy-section { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: calc(var(--space-32) * 2); }
.privacy-section h2 { line-height: 1.13; }.privacy-detail { color: var(--text-primary); font-size: var(--type-footnote); margin-top: var(--space-20); }
.privacy-section .text-link { margin-top: var(--space-16); color: var(--accent-onTint); }
.disclosure { font-size: var(--type-caption1); line-height: 1.8; color: var(--text-secondary); }.disclosure a { text-decoration: underline; color: var(--accent-onTint); }
.privacy-section .disclosure { margin-top: var(--space-24); max-width: 55ch; }
.privacy-visual { position: relative; padding: var(--space-32); min-width: 0; }
.privacy-ring { position: absolute; border: 1px solid var(--mint-line); border-radius: 50%; width: 90%; aspect-ratio: 1; top: 50%; left: 50%; transform: translate(-50%,-50%); opacity: .4; z-index: -1; }
.privacy-ring.ring-two { width: 110%; opacity: .15; }
.device-boundary { border: 1px solid var(--mint-line); border-radius: var(--radius-card); background: radial-gradient(ellipse at center,var(--accent-tint),var(--bg-canvas)); padding: var(--space-24); text-align: center; box-shadow: 0 0 calc(var(--space-32) * 3) color-mix(in srgb,var(--accent-keep) 8%,transparent); }
.device-label { display: flex; align-items: center; justify-content: center; gap: var(--space-8); color: var(--accent-onTint); font-family: var(--font-mono); font-size: var(--type-caption2); letter-spacing: .12em; }
.device-label .icon { width: var(--space-16); height: var(--space-16); }
.device-lock { display: grid; place-items: center; width: calc(var(--space-32) * 3); height: calc(var(--space-32) * 3); border: 1px solid var(--mint-line); border-radius: 30%; margin: var(--space-32) auto; background: linear-gradient(140deg,var(--accent-tint),var(--bg-canvas)); color: var(--accent-onTint); transform: rotate(-6deg); box-shadow: inset 0 0 var(--space-24) color-mix(in srgb,var(--accent-keep) 8%,transparent); }
.device-lock .icon { width: calc(var(--space-32) * 1.5); height: calc(var(--space-32) * 1.5); transform: rotate(6deg); }
.device-boundary h3 { font-size: var(--type-title3); letter-spacing: -.02em; }
.device-flow { display: flex; align-items: center; justify-content: space-between; gap: var(--space-8); margin-top: var(--space-32); padding-block: var(--space-24); border-block: 1px dashed var(--mint-line); }
.device-flow span { display: flex; flex-direction: column; align-items: center; gap: var(--space-8); font-size: var(--type-caption2); color: var(--text-secondary); }.device-flow .icon { color: var(--accent-onTint); }.device-flow i { font-style: normal; color: var(--accent-keep); }
.device-boundary > p { font-size: var(--type-caption2); margin-top: var(--space-24); }
.free-section { display: grid; grid-template-columns: 1fr 1fr; gap: calc(var(--space-32) * 2); border-block: 1px solid var(--line); padding-block: calc(var(--space-32) * 2); align-items: center; }.free-section p { line-height: 1.8; }.free-section .disclosure { margin-top: var(--space-16); }
.home-faq { display: grid; grid-template-columns: .85fr 1.15fr; gap: calc(var(--space-32) * 2); }.home-faq h2 { font-size: clamp(32px,3.4vw,44px); }.home-faq .text-link { margin-top: var(--space-24); }
.faq-list details { border-bottom: 1px solid var(--line); scroll-margin-top: var(--space-32); }.faq-list details:first-child { border-top: 1px solid var(--line); }
.faq-list summary { display: flex; align-items: center; justify-content: space-between; gap: var(--space-24); min-height: var(--size-primaryButtonHeight); padding-block: var(--space-24); cursor: pointer; list-style: none; font-size: var(--type-subheadline); font-weight: 500; }.faq-list summary::-webkit-details-marker { display: none; }.faq-list summary::marker { content: ''; }
.faq-list summary .icon { width: var(--space-20); height: var(--space-20); color: var(--text-secondary); transition: transform var(--motion-standard); }.faq-list details[open] summary .icon { transform: rotate(180deg); }
.faq-answer { padding-bottom: var(--space-24); padding-right: var(--space-24); font-size: var(--type-subheadline); line-height: 1.85; }.faq-answer a { text-decoration: underline; color: var(--accent-onTint); }
.launch-section { position: relative; text-align: center; border-top: 1px solid var(--line); isolation: isolate; overflow: hidden; }.launch-section::before { content: ''; position: absolute; inset: 0; z-index: -1; background: radial-gradient(ellipse at 50% 100%,color-mix(in srgb,var(--accent-keep) 17%,transparent),transparent 65%); }
.launch-section h2 { font-size: clamp(56px,7vw,88px); letter-spacing: -.055em; }.launch-section > .container > p:not(.eyebrow) { margin-top: var(--space-24); }.launch-section .availability { justify-content: center; font-size: var(--type-caption1); }
.coming-badge { display: inline-flex; align-items: center; gap: var(--space-12); border: 1px solid var(--mint-line); background: var(--accent-tint); border-radius: var(--space-32); padding: var(--space-16) var(--space-24); margin-top: var(--space-32); color: var(--accent-onTint); font-size: var(--type-subheadline); }.launch-section .text-link { margin-top: var(--space-24); color: var(--text-secondary); font-size: var(--type-footnote); }
.site-footer { border-top: 1px solid var(--line); padding-block: calc(var(--space-32) * 2) var(--space-24); }.footer-main { display: grid; grid-template-columns: 1.4fr .8fr .8fr 1.2fr; gap: var(--space-32); padding-bottom: calc(var(--space-32) * 2); }.footer-tagline { font-size: var(--type-subheadline); line-height: 1.65; margin-top: var(--space-16); }.footer-col .eyebrow { color: var(--text-secondary); margin-bottom: var(--space-16); font-size: var(--type-caption2); }.footer-col { display: flex; flex-direction: column; align-items: flex-start; }.footer-col > a { font-size: var(--type-footnote); min-height: var(--size-minTapTarget); display: inline-flex; align-items: center; gap: var(--space-8); }.footer-col > a:hover { color: var(--accent-onTint); }.footer-col p:not(.eyebrow) { font-size: var(--type-caption1); margin-top: var(--space-12); max-width: 28ch; }.footer-col .icon { width: var(--space-16); height: var(--space-16); }.footer-bottom { border-top: 1px solid var(--line); padding-top: var(--space-16); display: flex; gap: var(--space-24); justify-content: space-between; align-items: center; font-size: var(--type-caption2); }.footer-bottom a { min-height: var(--size-minTapTarget); display: inline-flex; align-items: center; white-space: nowrap; }
.legal-main, .support-main { padding-block: calc(var(--space-32) * 2.5) var(--section-space); }.legal-heading { max-width: calc(var(--space-32) * 27); margin-bottom: calc(var(--space-32) * 2); }.legal-heading h1, .support-heading h1 { font-size: clamp(44px,6vw,72px); }.legal-intro { font-size: var(--type-title3); line-height: 1.75; margin-top: var(--space-24); max-width: 65ch; }.legal-updated { font-family: var(--font-mono); font-size: var(--type-caption2); margin-top: var(--space-24); }
.legal-layout { display: grid; grid-template-columns: 1fr 2.6fr; gap: calc(var(--space-32) * 2); }.legal-toc nav { position: sticky; top: var(--space-32); }.legal-toc nav > a { display: block; font-size: var(--type-caption1); padding-block: var(--space-12); color: var(--text-secondary); min-height: var(--size-minTapTarget); }.legal-toc nav > a:hover { color: var(--accent-onTint); }.legal-toc nav > .text-link { margin-top: var(--space-24); color: var(--accent-onTint); display: inline-flex; }.legal-toc .eyebrow { margin-bottom: var(--space-12); }
.legal-summary { border: 1px solid var(--mint-line); border-radius: var(--radius-smallCard); padding: var(--space-24); background: var(--accent-tint); font-size: var(--type-subheadline); }.legal-summary > strong { display: block; font-size: var(--type-headline); }.legal-summary li { color: var(--text-primary); }.legal-content ul { padding-left: var(--space-24); margin-block: var(--space-16) 0; }.legal-content li { margin-top: var(--space-12); color: var(--text-secondary); }.legal-content > section { margin-top: calc(var(--space-32) * 1.5); scroll-margin-top: var(--space-32); }.legal-content h2 { font-size: var(--type-title2); letter-spacing: -.025em; line-height: 1.35; margin-bottom: var(--space-20); }.legal-content p { font-size: var(--type-subheadline); line-height: 1.9; margin-top: var(--space-16); }.legal-content a, .company-block a { text-decoration: underline; color: var(--accent-onTint); }.legal-content address { font-style: normal; font-size: var(--type-subheadline); line-height: 1.85; color: var(--text-secondary); margin-top: var(--space-16); }.legal-content li { font-size: var(--type-subheadline); line-height: 1.9; }
.table-scroll { overflow-x: auto; margin-top: var(--space-24); border: 1px solid var(--line); border-radius: var(--radius-thumbnail); }table { width: 100%; border-collapse: collapse; font-size: var(--type-footnote); line-height: 1.8; }caption { text-align: left; padding: var(--space-16); color: var(--text-secondary); font-size: var(--type-caption1); border-bottom: 1px solid var(--line); }th,td { padding: var(--space-16); text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); }th { font-weight: 500; }thead { background: var(--bg-surface); }tbody th { width: 28%; }td { color: var(--text-secondary); }tbody tr:last-child th,tbody tr:last-child td { border-bottom: 0; }
.legal-contact { border-top: 1px solid var(--line); margin-top: calc(var(--space-32) * 2); padding-top: var(--space-32); }.support-heading { margin-bottom: calc(var(--space-32) * 2); }.support-cards { display: grid; grid-template-columns: 1.2fr 1fr; gap: var(--space-24); }.support-contact,.recovery-card { border: 1px solid var(--line); border-radius: var(--radius-card); padding: var(--space-32); background: var(--bg-surface); }.support-cards h2 { font-size: var(--type-title1); letter-spacing: -.03em; line-height: 1.25; margin-top: var(--space-24); }.support-cards p { font-size: var(--type-subheadline); margin-top: var(--space-20); line-height: 1.8; }.round-icon { width: var(--size-primaryButtonHeight); height: var(--size-primaryButtonHeight); display: grid; place-items: center; border-radius: 50%; background: var(--accent-tint); color: var(--accent-onTint); border: 1px solid var(--mint-line); }.support-address { display: inline-flex; align-items: center; gap: var(--space-16); font-size: var(--type-title2); color: var(--accent-onTint); margin-top: var(--space-20); min-height: var(--size-minTapTarget); }.support-actions { display: flex; flex-wrap: wrap; gap: var(--space-12); margin-top: var(--space-24); }.support-actions .button { font-size: var(--type-footnote); }.support-cards .disclosure { font-size: var(--type-caption1); }.support-contact .copy-status { font-size: var(--type-caption1); color: var(--accent-onTint); margin-top: var(--space-12); }.copy-status:empty { display: none; }.recovery-card ol { padding-left: var(--space-24); color: var(--text-secondary); font-size: var(--type-subheadline); line-height: 1.85; }.recovery-card li { padding-left: var(--space-8); margin-top: var(--space-16); }.recovery-card li::marker { color: var(--accent-onTint); font-family: var(--font-mono); }.support-faq { max-width: calc(var(--space-32) * 28); margin-inline: auto; }.support-faq h2 { margin-bottom: var(--space-32); font-size: clamp(32px,4vw,44px); }.company-block { display: grid; grid-template-columns: 1.3fr 1fr; gap: calc(var(--space-32) * 2); border-top: 1px solid var(--line); padding-top: calc(var(--space-32) * 2); align-items: center; }.company-block h2 { font-size: var(--type-title1); }.company-block p { font-size: var(--type-subheadline); line-height: 1.9; margin-top: var(--space-20); }.company-block .eyebrow { margin-top: 0; font-size: var(--type-caption2); }.company-block address { font-size: var(--type-subheadline); line-height: 1.9; font-style: normal; color: var(--text-secondary); }.not-found { padding-block: calc(var(--space-32) * 4); min-height: 65vh; }.not-found h1 { font-size: var(--heading-type); }.not-found > p:not(.eyebrow) { margin-top: var(--space-24); max-width: 55ch; }
@media (min-width: 1600px) { :root { --section-space: calc(var(--space-32) * 4); } }
@media (max-width: 1050px) {
  :root { --hero-type: clamp(56px,7.5vw,78px); --section-space: calc(var(--space-32) * 2.75); }
  #main-nav { gap: var(--space-20); }.hero { padding-top: calc(var(--space-32) * 3); }.hero .eyebrow { max-width: 35ch; }.hero-actions { gap: var(--space-12); }.hero-actions .text-link { padding-inline: var(--space-8); }.pick-section,.privacy-section { gap: var(--space-32); }.hero-body br { display: none; }.footer-main { grid-template-columns: 1.2fr .8fr .8fr 1fr; gap: var(--space-20); }.nav-cta { gap: var(--space-12); padding-inline: var(--space-16); }.home-faq { gap: var(--space-32); }.support-cards { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 760px) {
  :root { --page-gutter: var(--space-24); --hero-type: clamp(60px,10vw,80px); --section-space: calc(var(--space-32) * 2.5); }
  .nav-shell { min-height: calc(var(--space-32) * 2.5); flex-wrap: wrap; padding-block: var(--space-12); gap: var(--space-12); }.brand { font-size: var(--type-title3); }.nav-cta { margin-left: auto; font-size: var(--type-caption1); }.menu-toggle:not([hidden]) { display: grid; place-items: center; order: 3; }#main-nav { order: 4; width: 100%; justify-content: space-between; gap: var(--space-12); padding-top: var(--space-8); border-top: 1px solid var(--line); }html[data-nav-ready="true"] .menu-toggle[aria-expanded="false"] ~ #main-nav { display: none; }
  .hero { grid-template-columns: 1fr; text-align: center; padding-block: calc(var(--space-32) * 2.5) calc(var(--space-32) * 1.5); gap: var(--space-32); }.hero .eyebrow { margin-inline: auto; max-width: none; font-size: var(--type-caption2); }.hero-body { margin-inline: auto; max-width: 45ch; }.hero-actions { justify-content: center; gap: var(--space-16); }.hero .availability { justify-content: center; }.hero-figure { width: 85%; max-width: calc(var(--space-32) * 16); margin-inline: auto; }.hero-figure figcaption { margin-top: var(--space-8); }.promise-strip { gap: var(--space-16); }.promise-strip > div { flex-direction: column; text-align: center; gap: var(--space-8); }.promise-strip strong { font-size: var(--type-footnote); }.promise-strip p { font-size: var(--type-caption2); }.promise-strip span { max-width: 19ch; }
  .pick-section,.privacy-section { grid-template-columns: 1fr; gap: calc(var(--space-32) * 1.5); }.pick-section h2 { font-size: var(--heading-type); }.section-copy .section-body { max-width: 60ch; }.demo { max-width: calc(var(--space-32) * 19); width: 100%; }.feature-grid { gap: var(--space-16); }.feature-card { padding: var(--space-24); }.feature-grid h3 { font-size: var(--type-title2); }.protection-card { padding-right: var(--space-24); }.protection-emblem { position: static; margin-bottom: var(--space-24); }.swipe-visual { width: 85%; }.swipe-controls { gap: var(--space-12); }.swipe-controls > span { width: var(--size-minTapTarget); height: var(--size-minTapTarget); }.steps { gap: var(--space-24); }.steps h3 { font-size: var(--type-title3); }.steps p { font-size: var(--type-footnote); }.privacy-visual { width: 100%; max-width: calc(var(--space-32) * 16); margin-inline: auto; padding-inline: var(--space-32); }.privacy-section .disclosure { max-width: none; }.free-section { gap: var(--space-32); }.home-faq { grid-template-columns: 1fr; gap: var(--space-32); }.home-faq h2 { font-size: var(--heading-type); }.home-faq .text-link { margin-top: var(--space-16); }.footer-main { grid-template-columns: 1.2fr 1fr; gap: var(--space-32); }.footer-bottom { flex-wrap: wrap; gap: var(--space-8) var(--space-24); }.footer-bottom > p:first-child { width: 100%; }.footer-bottom a { margin-left: auto; }
  .legal-layout { grid-template-columns: 1fr; gap: var(--space-32); }.legal-toc nav { position: static; }.legal-toc { border-block: 1px solid var(--line); padding-block: var(--space-20); }.legal-toc nav { display: flex; flex-wrap: wrap; gap: var(--space-4) var(--space-20); }.legal-toc .eyebrow { width: 100%; }.legal-toc nav > a { flex: 1 1 40%; padding-block: var(--space-8); }.legal-toc nav > .text-link { margin-top: 0; }.legal-heading { margin-bottom: var(--space-32); }.legal-intro { font-size: var(--type-headline); }.support-cards { grid-template-columns: 1fr; }.support-faq { padding-block: calc(var(--space-32) * 2); }.company-block { grid-template-columns: 1fr; gap: var(--space-24); }.support-heading { margin-bottom: var(--space-32); }
}
@media (max-width: 480px) {
  :root { --page-gutter: var(--space-20); --section-space: calc(var(--space-32) * 2); --hero-type: clamp(54px,14.2vw,68px); --heading-type: clamp(32px,9vw,42px); }
  .nav-cta { padding-inline: var(--space-12); gap: var(--space-8); }.nav-cta .icon { display: none; }.brand { gap: var(--space-8); }.brand-mark { width: var(--space-24); height: var(--space-32); }.hero { padding-top: calc(var(--space-32) * 2); }.hero .eyebrow { font-size: var(--type-caption2); letter-spacing: .05em; max-width: 34ch; }.hero-body { font-size: var(--type-subheadline); margin-top: var(--space-24); }.hero-actions { flex-direction: column; margin-top: var(--space-24); gap: var(--space-8); }.hero-figure { width: 100%; }.local-chip { gap: var(--space-8); font-size: var(--type-caption2); padding: var(--space-12); }.keeper-photo .best-badge { top: var(--space-16); left: var(--space-16); }.best-badge { font-size: var(--type-caption2); padding: var(--space-8); }.photo-bottom { bottom: var(--space-20); left: var(--space-16); right: var(--space-16); }.promise-strip { gap: var(--space-8); }.promise-strip > div { gap: var(--space-12); }.promise-strip > div + div { padding-left: var(--space-8); }.promise-strip span { line-height: 1.65; }.promise-strip .icon { width: var(--space-20); height: var(--space-20); }.feature-grid { grid-template-columns: 1fr; }.swipe-card { grid-row: auto; }.swipe-visual { width: 70%; }.swipe-stack { aspect-ratio: 1; }.protection-card { padding-right: calc(var(--space-32) * 3); }.protection-emblem { position: absolute; right: var(--space-20); top: var(--space-24); width: var(--size-primaryButtonHeight); height: var(--size-primaryButtonHeight); }.ledger-card { grid-template-columns: 1fr; }.ledger-card .card-note { grid-column: auto; }.ledger-bars { margin-top: var(--space-16); height: calc(var(--space-32) * 2); }.steps { grid-template-columns: 1fr; gap: var(--space-32); }.step-no { padding-bottom: var(--space-12); margin-bottom: var(--space-16); }.steps h3 { font-size: var(--type-title2); }.steps p { font-size: var(--type-subheadline); margin-top: var(--space-12); }.recovery-note { font-size: var(--type-caption1); }.privacy-visual { padding: var(--space-16); }.privacy-ring.ring-two { width: 100%; }.device-boundary { padding-inline: var(--space-16); }.free-section { grid-template-columns: 1fr; gap: var(--space-24); padding-block: calc(var(--space-32) * 1.5); }.free-section h2 br { display: none; }.free-section p { font-size: var(--type-subheadline); }.free-section .disclosure { font-size: var(--type-caption1); }.footer-main { grid-template-columns: 1fr 1fr; gap: var(--space-32) var(--space-20); }.footer-main > div:first-child { grid-column: 1 / -1; }.contact-col { grid-column: 1 / -1; }.footer-bottom > p:not(:first-child) { display: none; }.footer-bottom a { margin-left: 0; }.legal-main,.support-main { padding-top: calc(var(--space-32) * 1.5); }.legal-heading h1,.support-heading h1 { font-size: clamp(40px,11vw,56px); }.legal-updated { max-width: 35ch; line-height: 1.9; }.legal-toc nav > a { flex-basis: 100%; min-height: var(--size-minTapTarget); }.legal-summary { padding: var(--space-20); }.legal-content > section { margin-top: var(--space-32); }.table-scroll th,.table-scroll td { padding: var(--space-12); font-size: var(--type-caption1); }.support-contact,.recovery-card { padding: var(--space-24); }.support-actions { flex-direction: column; }.support-address { font-size: var(--type-title3); }.support-cards h2 { font-size: var(--type-title2); }.demo { padding: var(--space-16); }.demo-options { gap: var(--space-8); }.demo-status { align-items: flex-start; }.demo-status .icon { margin-top: var(--space-4); }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; }*,*::before,*::after { transition: none !important; animation: none !important; } }
@media (max-width: 380px) { .nav-cta { display: none; }.menu-toggle { margin-left: auto; } }
@media (prefers-contrast: more) { :root { --text-secondary: var(--text-primary); --dim: var(--text-primary); --line: var(--text-secondary); } }
@media print { :root { color-scheme: light; --bg-canvas: white; --bg-surface: white; --bg-surface2: white; --text-primary: black; --text-secondary: black; --accent-onTint: black; --accent-tint: white; --line: black; --mint-line: black; }.site-header,.site-footer,.legal-toc,.menu-toggle,.skip-link { display: none; }.legal-layout { display: block; }.container { width: 100%; }.legal-main { padding: 0; }.legal-content a { color: black; text-decoration: underline; }.legal-content section { break-inside: avoid; }.legal-summary { border: 1px solid black; } }