:root {
  --paper: #feffff;
  --surface: #f8f8f8;
  --ink: #1a1a1a;
  --muted: #696969;
  --line: #e6e8eb;
  --accent: #171717;
  --blue: #dce8f5;
  --purple: #e8e1f5;
  --peach: #fbe8d8;
  --on-accent: #fff;
  --hover: #353535;
  --media-surface: #f5f5f5;
  --soft-surface: #f2f2f2;
  --chrome: #fafafa;
  color-scheme: light;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 86px; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
a, button { -webkit-tap-highlight-color: transparent; }
a:focus-visible, button:focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; }
::selection { background: #e5e5e5; color: var(--ink); }
h1, h2, h3, p, figure { margin: 0; }
.shell { width: min(1200px, calc(100% - 96px)); margin-inline: auto; }
.skip-link { position: fixed; z-index: 50; top: -70px; left: 16px; padding: 12px 18px; background: var(--ink); color: var(--paper); }
.skip-link:focus { top: 16px; }
.site-header { position: sticky; top: 0; z-index: 20; background: var(--paper); height: 82px; display: flex; align-items: center; gap: 64px; }
.brand { display: inline-flex; align-items: center; gap: 9px; font-size: 27px; font-weight: 650; letter-spacing: -.8px; }
.brand img { object-fit: contain; border-radius: 7px; }
nav { display: flex; gap: 28px; font-size: 13px; }
nav a { color: var(--muted); }
nav a:hover { color: var(--accent); }
.header-actions { display: flex; align-items: center; gap: 24px; margin-left: auto; }
.language { border: 0; background: none; color: var(--muted); font-size: 11px; padding: 10px 0; cursor: pointer; }
.nav-app { background: var(--accent); color: var(--on-accent); border-radius: 50px; padding: 9px 16px; font-size: 12px; white-space: nowrap; }
.nav-app:hover { background: var(--hover); }
.hero { padding-top: 76px; }
.hero-copy { max-width: 755px; }
h1 { font-size: clamp(34px, 3.65vw, 50px); line-height: 1.12; font-weight: 500; letter-spacing: -1.9px; }
.intro { color: var(--muted); max-width: 550px; font-size: 16px; line-height: 1.65; margin-top: 24px; }
.hero-actions { display: flex; gap: 12px; margin-top: 29px; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 43px; border: 1px solid transparent; padding: 11px 20px; border-radius: 50px; font-size: 13px; font-weight: 500; transition: background .18s, border-color .18s; }
.primary { color: var(--on-accent); background: var(--accent); }
.primary:hover { background: var(--hover); }
.secondary { border-color: #d7d7d7; color: var(--ink); background: transparent; }
.secondary:hover { background: #f3f3f3; border-color: #b0b0b0; }
.media { position: relative; border-radius: 22px; overflow: hidden; background: var(--surface); aspect-ratio: 4 / 3; }
.media-placeholder { height: 100%; min-height: inherit; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 11px; padding: 24px; color: var(--muted); text-align: center; }
.media-placeholder svg { width: 33px; height: 33px; stroke: currentColor; stroke-width: 1; opacity: .6; margin-bottom: 5px; }
.media-placeholder span { font-size: 12px; line-height: 1.5; }
.media-placeholder small { font-size: 10px; color: var(--muted); line-height: 1.5; }
.media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hero-media { aspect-ratio: 16 / 7.5; margin-top: 56px; background: var(--media-surface); }
.hero-media .media-placeholder { border: 1px solid var(--line); border-radius: inherit; }
.hero-media .media-placeholder svg { width: 43px; height: 43px; }
.blue, .budget, .insights { background: var(--blue); }
.purple, .bills { background: var(--purple); }
.peach { background: var(--peach); }
.availability { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-block: 24px; border-bottom: 1px solid var(--line); font-size: 11px; color: var(--muted); }
.availability strong { color: var(--ink); font-weight: 500; }
.availability a:hover { color: var(--accent); }
.section { padding-block: 88px; }
h2 { font-size: 37px; font-weight: 500; letter-spacing: -1.4px; line-height: 1.18; }
.demo { padding-bottom: 20px; }
.demo-heading { text-align: center; max-width: 740px; margin: 0 auto 39px; }
.demo-heading p { max-width: 560px; margin: 18px auto 0; color: var(--muted); font-size: 15px; line-height: 1.7; }
.demo-stage { position: relative; border: 1px solid var(--line); border-radius: 22px; background: var(--media-surface); overflow: hidden; }
.demo-tabs { position: absolute; z-index: 3; top: 25px; left: 50%; transform: translateX(-50%); display: flex; gap: 4px; padding: 5px; border-radius: 12px; background: var(--paper); border: 1px solid var(--line); max-width: calc(100% - 120px); overflow-x: auto; }
.demo-tabs button { flex-shrink: 0; padding: 11px 19px; border: 0; border-radius: 8px; background: transparent; color: var(--muted); font-size: 12px; white-space: nowrap; cursor: pointer; }
.demo-tabs button[aria-selected="true"] { color: var(--on-accent); background: var(--accent); }
.demo-tabs button:hover { color: var(--ink); }
.demo-tabs button:focus-visible { outline-offset: -3px; }
.demo-panel { position: relative; aspect-ratio: 16 / 9; }
.demo-panel:focus-visible { outline: 2px solid var(--accent); outline-offset: -3px; }
.demo-video { width: 100%; height: 100%; object-fit: contain; background: var(--media-surface); display: block; }
.demo-video[hidden], .demo-placeholder[hidden], .demo-playback[hidden] { display: none; }
.demo-placeholder { position: absolute; inset: 90px 25px 85px; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 20px; text-align: center; color: var(--muted); }
.demo-placeholder svg { width: 48px; height: 36px; stroke: currentColor; stroke-width: 1; opacity: .55; }
.demo-placeholder p { font-size: 13px; line-height: 1.7; }
.demo-caption { position: relative; padding: 21px 28px; border-top: 1px solid var(--line); color: var(--muted); font-size: 13px; line-height: 1.7; min-height: 65px; background: var(--paper); }
.demo-playback { position: absolute; z-index: 4; top: 28px; right: 25px; width: 39px; height: 39px; padding: 9px; border: 1px solid var(--line); border-radius: 50%; background: var(--paper); color: var(--ink); cursor: pointer; }
.demo-playback svg { width: 20px; height: 20px; }
.demo-pause-icon { display: none; }
.demo-playback[data-playing="true"] .demo-play-icon { display: none; }
.demo-playback[data-playing="true"] .demo-pause-icon { display: block; }
.features > h2 { margin-bottom: 34px; }
.feature-grid { display: grid; gap: 14px; }
.large-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.small-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 56px; }
.feature-grid article { min-width: 0; }
.feature-grid h3 { font-size: 20px; line-height: 1.3; font-weight: 500; letter-spacing: -.6px; margin-top: 22px; margin-bottom: 9px; }
.feature-grid p { color: var(--muted); font-size: 14px; line-height: 1.65; max-width: 550px; }
.feature-note { display: block; color: var(--muted); font-size: 10px; line-height: 1.7; margin-top: 10px; }
.small-grid h3 { font-size: 19px; }
.small-grid p { font-size: 13px; }
.workflow { border-top: 1px solid var(--line); }
.workflow-title { max-width: 790px; margin-bottom: 68px; }
.muted { color: var(--muted); }
.workflow-row { display: grid; grid-template-columns: 1fr 1fr; align-items: end; gap: 64px; }
.workflow-row + .workflow-row { margin-top: 86px; }
.workflow-copy { padding-bottom: 8px; }
.step-number { display: block; color: var(--muted); font-size: 27px; letter-spacing: -1px; margin-bottom: 17px; }
.workflow h3 { font-size: 30px; font-weight: 500; letter-spacing: -1.1px; line-height: 1.2; margin-bottom: 14px; }
.workflow-copy p, .about p:not(.eyebrow) { font-size: 15px; line-height: 1.7; color: var(--muted); }
.workflow-copy p { max-width: 430px; margin-bottom: 16px; }
.text-link { display: inline-block; color: var(--accent); font-size: 13px; line-height: 1.7; }
.text-link:hover { color: var(--ink); }
.devices { border-top: 1px solid var(--line); }
.devices-heading { text-align: center; max-width: 760px; margin: 0 auto 40px; }
.devices-heading p { max-width: 550px; margin: 18px auto 0; color: var(--muted); font-size: 15px; line-height: 1.7; }
.devices-layout { display: grid; grid-template-columns: 1.4fr 1fr; gap: 64px; align-items: center; }
.devices-showcase { min-width: 0; }
.device-stage { display: flex; justify-content: center; align-items: center; min-height: 545px; padding: 25px 0; }
.device-stage:focus-visible { outline: 2px solid var(--accent); outline-offset: 8px; }
.device-frame { width: 100%; overflow: hidden; border: 1px solid var(--line); border-radius: 22px; background: var(--media-surface); }
.device-chrome { height: 33px; display: flex; align-items: center; justify-content: center; gap: 8px; position: relative; border-bottom: 1px solid var(--line); background: var(--chrome); color: var(--muted); font-size: 10px; }
.device-dots { position: absolute; left: 14px; display: flex; gap: 5px; }
.device-dots i { display: block; width: 5px; height: 5px; border-radius: 50%; background: #bdbdbd; }
.device-screen { position: relative; aspect-ratio: 16 / 10; background: var(--media-surface); overflow: hidden; }
.device-placeholder { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 13px; padding: 20px; text-align: center; color: var(--muted); }
.device-placeholder svg { width: 32px; height: 32px; stroke: currentColor; stroke-width: 1; opacity: .55; }
.device-placeholder-label { font-size: 12px; line-height: 1.6; }
.device-placeholder small { font-size: 10px; line-height: 1.6; }
.device-image, .device-video { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: contain; background: var(--media-surface); }
.device-image[hidden], .device-video[hidden], .device-placeholder[hidden] { display: none; }
.device-frame[data-device="tablet"] { width: 90%; max-width: 470px; border: 8px solid #242424; border-radius: 24px; padding: 11px 5px; background: #242424; }
.device-frame[data-device="tablet"] .device-screen { aspect-ratio: 4 / 3; border-radius: 9px; }
.device-frame[data-device="tablet"] .device-chrome, .device-frame[data-device="phone"] .device-chrome { display: none; }
.device-frame[data-device="phone"] { width: 228px; border: 6px solid #242424; border-radius: 32px; padding: 0; background: #242424; position: relative; }
.device-frame[data-device="phone"]::after { content: ''; position: absolute; top: 8px; left: 50%; transform: translateX(-50%); width: 61px; height: 14px; border-radius: 20px; background: #242424; pointer-events: none; }
.device-frame[data-device="phone"] .device-screen { aspect-ratio: 9 / 19.5; border-radius: 25px; }
.device-tabs { display: flex; justify-content: center; gap: 4px; width: fit-content; max-width: 100%; padding: 5px; margin: 13px auto 0; border: 1px solid var(--line); border-radius: 12px; background: var(--chrome); }
.device-tabs button { border: 0; background: transparent; border-radius: 8px; padding: 11px 20px; color: var(--muted); font-size: 12px; cursor: pointer; }
.device-tabs button[aria-selected="true"] { background: var(--accent); color: var(--on-accent); }
.device-tabs button:not([aria-selected="true"]):hover { color: var(--ink); }
.device-tabs button:focus-visible { outline-offset: -3px; }
.device-copy h3 { font-size: 29px; line-height: 1.2; letter-spacing: -1px; font-weight: 500; margin-bottom: 17px; }
.device-copy p { max-width: 345px; color: var(--muted); font-size: 15px; line-height: 1.75; margin-bottom: 21px; }
.privacy { border-block: 1px solid var(--line); }
.privacy-heading { max-width: 650px; margin: 0 auto 48px; text-align: center; }
.privacy-heading .eyebrow { margin-bottom: 14px; color: var(--accent); }
.privacy-heading > p:last-child { margin-top: 18px; color: var(--muted); font-size: 15px; line-height: 1.7; }
.privacy-panels { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.privacy-panel { padding: 32px; background: var(--surface); border: 1px solid var(--line); border-radius: 20px; }
.privacy-panel h3 { display: flex; align-items: center; gap: 12px; padding-bottom: 21px; border-bottom: 1px solid var(--line); font-size: 21px; font-weight: 550; letter-spacing: -.5px; }
.privacy-panel svg { width: 22px; height: 22px; flex-shrink: 0; fill: none; stroke: var(--accent); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.privacy-panel ul { padding: 0 0 0 16px; margin: 23px 0 0; }
.privacy-panel li { padding-left: 3px; color: var(--muted); font-size: 14px; line-height: 1.7; }
.privacy-panel li + li { margin-top: 17px; }
.privacy-panel strong { color: var(--ink); font-weight: 550; }
.privacy-panel li::marker { color: #919191; font-size: 10px; }
.privacy-footer { max-width: 600px; margin: 27px auto 0; text-align: center; }
.privacy-footer p { color: var(--muted); font-size: 12px; line-height: 1.7; margin-bottom: 14px; }
@media (max-width: 700px) {
  .privacy-heading { margin-bottom: 27px; }
  .privacy-heading > p:last-child { font-size: 13px; }
  .privacy-panels { grid-template-columns: 1fr; gap: 14px; }
  .privacy-panel { padding: 23px; border-radius: 17px; }
  .privacy-panel h3 { font-size: 18px; }
  .privacy-panel li { font-size: 13px; }
}

.about { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.eyebrow { font-size: 10px; color: var(--muted); letter-spacing: .12em; margin-bottom: 25px; }
.about h2 { margin-bottom: 24px; }
.about p:not(.eyebrow) { max-width: 445px; margin-bottom: 17px; }
.about .text-link { margin-top: 5px; }
.studio-media { background: var(--soft-surface); }
.reviews { border-top: 1px solid var(--line); }
.reviews-heading { display: flex; align-items: end; justify-content: space-between; gap: 40px; margin-bottom: 35px; }
.reviews-intro { margin-top: 18px; color: var(--muted); font-size: 14px; line-height: 1.7; }
.store-ratings { display: flex; flex-shrink: 0; gap: 40px; }
.store-rating { display: flex; flex-direction: column; gap: 7px; }
.store-name { font-size: 12px; color: var(--muted); }
.store-name span { margin-left: 7px; }
.rating-number { font-size: 38px; line-height: 1.1; font-weight: 500; letter-spacing: -1.2px; }
.rating-number > span { font-size: 16px; color: var(--muted); letter-spacing: 0; margin-left: 4px; }
.rating-count { font-size: 11px; color: var(--muted); }
.store-rating:hover .store-name { color: var(--accent); }
.review-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.review-card { min-width: 0; padding: 26px; border: 1px solid var(--line); background: var(--paper); display: flex; flex-direction: column; }
.review-person { display: flex; align-items: center; gap: 10px; }
.review-avatar { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 35px; height: 35px; border-radius: 50%; background: var(--soft-surface); color: var(--accent); font-size: 13px; }
.review-person h3 { font-size: 13px; font-weight: 500; line-height: 1.4; }
.review-person > div > span { color: var(--muted); font-size: 10px; }
.review-stars { margin-left: auto; white-space: nowrap; font-size: 10px; letter-spacing: 1px; color: var(--accent); }
.review-card blockquote { margin: 24px 0; flex: 1; }
.review-card blockquote p { font-size: 18px; line-height: 1.5; letter-spacing: -.35px; }
.review-source { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: var(--muted); font-size: 10px; line-height: 1.5; }
.review-source:hover { color: var(--accent); }
.reviews-note { margin-top: 23px; color: var(--muted); font-size: 11px; line-height: 1.7; max-width: 700px; }
.faq { border-top: 1px solid var(--line); }
.faq-heading { text-align: center; margin-bottom: 46px; }
.faq-heading p { margin-top: 15px; font-size: 15px; line-height: 1.7; color: var(--muted); }
.faq-heading a { color: var(--accent); }
.faq-heading a:hover { text-decoration: underline; }
.faq-list { max-width: 800px; margin-inline: auto; border-top: 1px solid var(--line); }
.faq-item { border-bottom: 1px solid var(--line); }
.faq-item summary { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 23px 0; cursor: pointer; list-style: none; font-size: 15px; font-weight: 500; line-height: 1.5; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; border-radius: 2px; }
.faq-item summary:hover { color: var(--accent); }
.faq-icon { position: relative; width: 16px; height: 16px; flex-shrink: 0; color: var(--muted); }
.faq-icon::before, .faq-icon::after { content: ''; position: absolute; background: currentColor; }
.faq-icon::before { top: 7px; left: 2px; width: 12px; height: 1px; }
.faq-icon::after { top: 2px; left: 7px; width: 1px; height: 12px; }
.faq-item[open] .faq-icon::after { display: none; }
.faq-answer { max-width: 700px; padding: 0 32px 23px 0; }
.faq-answer p { font-size: 14px; line-height: 1.8; color: var(--muted); }
@media (max-width: 700px) {
  .faq-heading { margin-bottom: 29px; }
  .faq-heading p { font-size: 13px; }
  .faq-item summary { font-size: 14px; gap: 18px; padding: 21px 0; }
  .faq-answer { padding-right: 20px; }
  .faq-answer p { font-size: 13px; }
}
.download { border-top: 1px solid var(--line); padding-bottom: 98px; }
.download p { color: var(--muted); font-size: 15px; line-height: 1.7; margin-top: 18px; max-width: 510px; }
.download-actions { display: flex; gap: 13px; align-items: center; flex-wrap: wrap; margin-top: 29px; }
.download-actions .text-link { margin-left: 14px; }
.site-footer { border-top: 1px solid var(--line); padding-top: 34px; padding-bottom: 28px; }
.footer-top { display: flex; justify-content: space-between; align-items: flex-start; padding-bottom: 50px; }
.footer-top p { color: var(--muted); font-size: 11px; margin-bottom: 9px; }
.footer-top > div > a { font-size: 14px; }
.footer-top > div > a:hover { color: var(--accent); }
.footer-bottom { display: flex; justify-content: space-between; gap: 20px; font-size: 10px; color: var(--muted); }
.footer-bottom > div { display: flex; gap: 25px; }
.entry-page .site-header { justify-content: space-between; }
.entry-main { max-width: 740px; padding-block: 68px 90px; }
.entry-home { display: inline-flex; gap: 12px; color: var(--muted); font-size: 12px; margin-bottom: 32px; }
.entry-main h1 { font-size: 48px; }
.entry-main .eyebrow { margin-bottom: 18px; }
.entry-main .intro { margin-top: 22px; font-size: 15px; max-width: 610px; }
.entry-options { display: grid; gap: 16px; margin-block: 34px; }
.entry-option { border: 1px solid var(--line); padding: 28px; }
.entry-option h2 { font-size: 23px; letter-spacing: -.6px; margin-bottom: 14px; }
.entry-option p { font-size: 13px; line-height: 1.8; color: var(--muted); margin-bottom: 20px; }
.entry-option.secondary { background: var(--surface); }
.text-button { padding: 0; color: var(--accent); gap: 12px; }
.entry-note { font-size: 12px; line-height: 1.8; color: var(--muted); margin-top: 14px; }
.entry-note a { color: var(--accent); }
@media (max-width: 1000px) {
  .shell { width: calc(100% - 64px); }
  .site-header { gap: 38px; }
  .hero { padding-top: 62px; }
  h1 { font-size: 43px; }
  .section { padding-block: 72px; }
  .workflow-row, .about, .devices-layout { gap: 38px; }
  .review-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .reviews-heading { align-items: start; }
  .store-ratings { gap: 25px; }
  .small-grid h3 { font-size: 17px; }
  .workflow h3 { font-size: 27px; }
}
@media (max-width: 700px) {
  .shell { width: calc(100% - 40px); }
  .site-header { height: 73px; gap: 24px; }
  nav { display: none; }
  .brand { font-size: 25px; }
  .brand img { width: 26px; height: 26px; }
  .header-actions { gap: 19px; }
  .nav-app { font-size: 11px; padding: 8px 12px; }
  .hero { padding-top: 46px; }
  h1 { font-size: clamp(31px, 8.4vw, 43px); letter-spacing: -1.2px; line-height: 1.13; }
  .intro { font-size: 14px; line-height: 1.75; margin-top: 21px; }
  .hero-actions { flex-wrap: wrap; gap: 10px; margin-top: 25px; }
  .button { font-size: 12px; padding: 11px 17px; }
  .media { border-radius: 16px; }
  .device-frame[data-device="web"] { border-radius: 16px; }
  .hero-media { margin-top: 37px; aspect-ratio: 4 / 3; }
  .availability { flex-wrap: wrap; row-gap: 13px; column-gap: 20px; font-size: 10px; padding-block: 22px; }
  .availability > p:first-child { flex-basis: 100%; }
  .section { padding-block: 57px; }
  h2 { font-size: 30px; letter-spacing: -.95px; }
  .demo { padding-bottom: 5px; }
  .demo-heading { margin-bottom: 28px; }
  .demo-heading p { font-size: 13px; }
  .demo-stage { border-radius: 16px; }
  .demo-tabs { top: 14px; left: 14px; right: 14px; transform: none; max-width: none; padding: 4px; border-radius: 10px; }
  .demo-tabs button { padding: 10px 12px; font-size: 11px; }
  .demo-panel { aspect-ratio: 4 / 3; }
  .demo-placeholder { inset: 73px 20px 27px; gap: 14px; }
  .demo-placeholder svg { width: 38px; }
  .demo-placeholder p { font-size: 11px; }
  .demo-caption { padding: 16px 19px; font-size: 12px; min-height: 75px; }
  .demo-playback { top: auto; right: 14px; bottom: 14px; }
  .features > h2 { margin-bottom: 27px; }
  .large-grid, .small-grid { grid-template-columns: 1fr; gap: 37px; }
  .small-grid { margin-top: 38px; }
  .feature-grid .media { aspect-ratio: 4 / 3; }
  .feature-grid h3, .small-grid h3 { font-size: 20px; margin-top: 18px; }
  .feature-grid p, .small-grid p { font-size: 13px; }
  .workflow-title { margin-bottom: 34px; }
  .workflow-row { grid-template-columns: 1fr; gap: 29px; }
  .workflow-row + .workflow-row { margin-top: 48px; }
  .workflow-row.reverse .media { order: 2; }
  .workflow h3 { font-size: 25px; letter-spacing: -.8px; }
  .workflow-copy p, .about p:not(.eyebrow) { font-size: 13px; }
  .step-number { font-size: 23px; margin-bottom: 14px; }
  .workflow-copy { padding: 0; }
  .devices-layout { grid-template-columns: 1fr; gap: 31px; }
  .devices-heading { margin-bottom: 22px; }
  .devices-heading p { font-size: 13px; }
  .device-stage { min-height: 465px; padding: 15px 0; }
  .device-frame[data-device="phone"] { width: 190px; }
  .device-frame[data-device="tablet"] { width: 100%; border-width: 6px; }
  .device-chrome { font-size: 9px; }
  .device-dots { left: 9px; gap: 3px; }
  .device-copy h3 { font-size: 25px; letter-spacing: -.8px; }
  .device-copy p { max-width: none; font-size: 13px; margin-bottom: 15px; }
  .device-tabs { margin-top: 4px; }
  .device-tabs button { padding: 10px 15px; font-size: 11px; }
  .about { grid-template-columns: 1fr; gap: 25px; }
  .about { gap: 33px; }
  .about h2 { margin-bottom: 20px; }
  .reviews-heading { flex-direction: column; gap: 27px; margin-bottom: 27px; }
  .reviews-intro { font-size: 13px; }
  .store-ratings { width: 100%; gap: 38px; }
  .rating-number { font-size: 32px; }
  .review-grid { grid-template-columns: 1fr; gap: 13px; }
  .review-card { padding: 23px; }
  .review-card blockquote p { font-size: 18px; }
  .reviews-note { font-size: 10px; }
  .download { padding-bottom: 60px; }
  .download p { font-size: 13px; }
  .download-actions .text-link { margin-left: 0; flex-basis: 100%; margin-top: 7px; }
  .footer-top { gap: 25px; padding-bottom: 35px; }
  .footer-top p { font-size: 9px; }
  .footer-top > div > a { font-size: 12px; }
  .footer-bottom { flex-wrap: wrap; row-gap: 18px; font-size: 9px; }
  .footer-bottom > span:last-child { display: none; }
  .entry-main { padding-block: 40px 60px; }
  .entry-main h1 { font-size: 39px; }
  .entry-main .intro { font-size: 14px; }
  .entry-option { padding: 23px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}

:root[data-theme="dark"] {
  --paper: #141414; --surface: #1d1d1d; --ink: #f3f3f3;
  --muted: #a9a9a9; --line: #343434; --accent: #f3f3f3;
  --on-accent: #171717; --hover: #d6d6d6;
  --media-surface: #202020; --soft-surface: #292929; --chrome: #252525;
  --blue: #252a32; --purple: #2b2733; --peach: #332b26;
  color-scheme: dark;
}
:root[data-theme="dark"] .secondary { border-color: #454545; }
:root[data-theme="dark"] .secondary:hover { background: #252525; border-color: #777; }
:root[data-theme="dark"] ::selection { background: #555; color: #fff; }
.theme-toggle { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; flex-shrink: 0; border: 1px solid var(--line); border-radius: 50%; background: var(--paper); color: var(--ink); padding: 8px; cursor: pointer; }
.theme-toggle:hover { background: var(--surface); }
.theme-toggle svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.theme-sun { display: none; }
[data-theme="dark"] .theme-moon { display: none; }
[data-theme="dark"] .theme-sun { display: block; }
.entry-page .theme-toggle { margin-left: auto; }
@media (max-width: 700px) { .site-header { gap: 12px; } .header-actions { gap: 10px; } .theme-toggle { width: 30px; height: 30px; padding: 7px; } }

/* Product screenshots keep their real UI; only the presentation frame is styled. */
.media.media-screenshot {
  display: flex; align-items: center; justify-content: center;
  padding: clamp(18px, 3vw, 42px);
  background: linear-gradient(145deg, var(--soft-surface), var(--media-surface));
  border: 1px solid var(--line);
}
.media-screenshot img {
  width: auto; height: auto; max-width: 100%; max-height: 100%; object-fit: contain;
  border-radius: 12px; border: 1px solid #00000012;
  box-shadow: 0 14px 40px #00000012;
}
.media-portrait img { height: 100%; width: auto; border-radius: 18px; }
.hero-media.media-screenshot { aspect-ratio: 16 / 10; }
.media-demo-badge {
  position: absolute; top: 14px; left: 16px; color: var(--muted);
  font-size: 9px; letter-spacing: 1.4px; line-height: 1;
}
.media-preview-note { text-align: center; font-size: 11px; color: var(--muted); margin-top: 18px; line-height: 1.6; }
@media (max-width: 600px) {
  .media.media-screenshot { padding: 24px 16px 16px; }
  .media-demo-badge { top: 10px; left: 12px; font-size: 8px; }
  .media-screenshot img { border-radius: 8px; }
  .media-portrait img { border-radius: 14px; }
}

.large-grid .media-portrait, .studio-media.media-portrait { aspect-ratio: 1; padding: 28px; }
.small-grid .media-portrait { aspect-ratio: 4 / 5; padding: 28px; }
@media (max-width:600px) {
  .large-grid .media-portrait, .small-grid .media-portrait, .studio-media.media-portrait { aspect-ratio: 4 / 5; padding: 24px; }
}

/* An authentic mist photograph forms a soft neutral backdrop behind the sharp screen. */
.media.media-screenshot { isolation: isolate; background: #d6d6d6; }
.media-screenshot::before {
  content: ''; position: absolute; inset: -36px; z-index: -1;
  background-image: url('/profile-assets/backgrounds/mist.jpg'); background-size: cover; background-position: center;
  filter: blur(20px) grayscale(1) brightness(1.12); opacity: .84; transform: scale(1.08);
  pointer-events: none;
}
.media-screenshot::after {
  content: ''; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(135deg, #ffffff20, #00000010); pointer-events: none;
}
.media-screenshot img { position: relative; box-shadow: 0 16px 45px #00000025; }
.media-demo-badge { z-index: 1; color: #4b4b4b; }
:root[data-theme="dark"] .media.media-screenshot { background: #252525; }
:root[data-theme="dark"] .media-screenshot::before { opacity: .22; }
:root[data-theme="dark"] .media-demo-badge { color: #d0d0d0; }

.media-backdrop { position: relative; isolation: isolate; overflow: hidden; background: #d6d6d6; border-radius: 22px; }
.media-backdrop::before {
  content: ''; position: absolute; inset: -36px; z-index: -1;
  background-image: url('/profile-assets/backgrounds/mist.jpg'); background-size: cover; background-position: center;
  filter: blur(20px) grayscale(1) brightness(1.12); opacity: .84; transform: scale(1.08); pointer-events: none;
}
.device-stage.media-backdrop { padding: 30px; }
.device-stage.media-backdrop .device-frame { box-shadow: 0 16px 45px #00000025; }
.demo-panel.media-backdrop .demo-video { background: transparent; padding: 28px; }
:root[data-theme="dark"] .media-backdrop { background: #252525; }
:root[data-theme="dark"] .media-backdrop::before { opacity: .22; }
@media (max-width:600px) {
  .media-backdrop { border-radius: 16px; }
  .device-stage.media-backdrop { padding: 18px; }
  .demo-panel.media-backdrop .demo-video { padding: 16px; }
}

.media[data-media="record"]::before { background-position: 50% 30%; }
.media[data-media="wallets"]::before { background-position: 50% 65%; }
.media[data-media="budget"]::before { background-position: 50% 42%; }
.media[data-media="bills"]::before { background-position: 50% 75%; }

.media-demo-badge { padding: 5px 7px; border-radius: 5px; background: #ffffffb8; }
:root[data-theme="dark"] .media-demo-badge { background: #171717b8; }

/* Ollo AI: practical feature explanations, without simulated conversations. */
.ollo-ai { border-block: 1px solid var(--line); }
.ai-heading { max-width: 700px; margin-bottom: 42px; }
.ai-heading .eyebrow { margin-bottom: 18px; }
.ai-heading > p:last-child { max-width: 570px; margin-top: 20px; color: var(--muted); font-size: 16px; line-height: 1.75; }
.ai-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.ai-feature { padding: 30px; border: 1px solid var(--line); border-radius: 22px; background: var(--surface); }
.ai-feature > svg { width: 28px; height: 28px; stroke: var(--ink); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; margin-bottom: 24px; }
.ai-feature h3 { font-size: 22px; font-weight: 500; letter-spacing: -.6px; margin-bottom: 14px; }
.ai-feature > p { color: var(--muted); font-size: 14px; line-height: 1.75; min-height: 100px; }
.ai-example { border-top: 1px solid var(--line); margin-top: 24px; padding-top: 20px; }
.ai-example span { color: var(--muted); font-size: 10px; }
.ai-example p { font-size: 14px; line-height: 1.65; margin-top: 8px; }
.ai-bottom { display: flex; justify-content: space-between; gap: 42px; padding-top: 36px; }
.ai-bottom > div:first-child { max-width: 670px; }
.ai-bottom h3 { font-size: 19px; font-weight: 500; margin-bottom: 10px; }
.ai-bottom p { font-size: 13px; line-height: 1.75; color: var(--muted); }
.ai-bottom .ai-conditions { font-size: 11px; margin-top: 12px; }
.ai-actions { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; flex-shrink: 0; }
.ai-actions .text-link { font-size: 12px; }
@media (max-width:1000px) { .site-header { gap: 28px; } nav { gap: 20px; } .ai-feature { padding: 24px; } }
@media (max-width:700px) {
  .site-header { height: auto; min-height: 72px; flex-wrap: wrap; padding-top: 16px; padding-bottom: 12px; gap: 12px; }
  .site-header nav { display: flex; order: 3; flex-basis: 100%; gap: 20px; overflow-x: auto; padding: 8px 0 2px; font-size: 11px; }
  .site-header nav a { white-space: nowrap; }
  .ai-grid { grid-template-columns: 1fr; }
  .ai-feature { border-radius: 16px; }
  .ai-feature > p { min-height: 0; }
  .ai-bottom { flex-direction: column; gap: 24px; }
  .ai-heading { margin-bottom: 28px; }
  .ai-heading > p:last-child { font-size: 14px; }
  #ollo-ai { scroll-margin-top: 120px; }
}

.ai-assistant { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; border-bottom: 1px solid var(--line); padding: 28px 0; }
.ai-assistant h3 { font-size: 22px; font-weight: 500; letter-spacing: -.6px; }
.ai-assistant p { color: var(--muted); font-size: 14px; line-height: 1.75; max-width: 680px; }
@media (max-width:700px) { .ai-assistant { grid-template-columns: 1fr; gap: 12px; } }

/* Store brands use the official self-hosted Font Awesome SVGs. */
.brand-icon { width:20px; height:20px; flex-shrink:0; object-fit:contain; }
.store-button { gap:10px; }
.primary .brand-icon { filter:invert(1); }
[data-theme="dark"] .brand-icon { filter:invert(1); }
[data-theme="dark"] .primary .brand-icon { filter:none; }
.site-header { gap:36px; }
.site-header nav { gap:21px; white-space:nowrap; }
.download { display:grid; grid-template-columns:1.3fr 1fr; align-items:center; gap:70px; }
.download .eyebrow { margin-bottom:18px; }
.download-more { display:flex; gap:22px; flex-wrap:wrap; margin-top:25px; }
.download-note { font-size:11px!important; line-height:1.7; margin-top:24px!important; }
.download-visual { position:relative; height:410px; border:1px solid var(--line); border-radius:22px; overflow:hidden; display:flex; justify-content:center; align-items:center; }
.download-visual > img { position:relative; z-index:1; height:85%; width:auto; max-width:82%; object-fit:contain; border-radius:14px; box-shadow:0 12px 35px #0002; }
.footer-top { gap:35px; }
.footer-identity { max-width:250px; }
.footer-identity > p { margin-top:17px; line-height:1.7; }
.social-links { display:flex; gap:9px; margin-top:18px; }
.social-links a { display:inline-flex; justify-content:center; align-items:center; width:35px; height:35px; border:1px solid var(--line); border-radius:50%; }
.social-links a:hover { background:var(--surface); }
.social-links .brand-icon { width:16px; height:16px; }
.footer-column { display:flex; flex-direction:column; gap:12px; }
.footer-column h3 { font-size:12px; font-weight:600; margin-bottom:5px; letter-spacing:0; }
.footer-column > a { font-size:12px!important; color:var(--muted); }
.footer-column > a:hover { color:var(--ink); }
.footer-column p { margin:0; }
.page-heading { padding-block:75px 48px; }
.page-heading .eyebrow { margin-bottom:22px; }
.page-heading h1 { max-width:760px; }
.page-heading .intro { max-width:660px; }
.plans { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.plan-card { display:flex; flex-direction:column; align-items:flex-start; border:1px solid var(--line); border-radius:22px; padding:36px; }
.premium-plan { background:var(--surface); }
.plan-card h2 { margin-top:22px; }
.plan-description { color:var(--muted); font-size:14px; line-height:1.7; margin-top:16px; }
.plan-card ul { padding-left:18px; margin:28px 0 32px; font-size:14px; line-height:2.2; }
.plan-card .button { margin-top:auto; }
.package-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-top:30px; }
.package-grid article { border:1px solid var(--line); border-radius:16px; padding:24px; }
.package-grid h3 { font-size:19px; letter-spacing:-.5px; }
.package-grid p,.pricing-note { color:var(--muted); font-size:13px; line-height:1.8; }
.package-grid p { margin-top:12px; }
.pricing-note { max-width:870px; margin-block:28px 18px; }
.pricing-help { padding-bottom:80px; display:flex; align-items:center; justify-content:space-between; gap:25px; }
.pricing-help h2 { font-size:26px; }
.download-platforms { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.platform-card { border:1px solid var(--line); border-radius:22px; padding:32px; }
.platform-card > .brand-icon,.platform-web-icon { width:32px; height:32px; margin-bottom:35px; }
.platform-web-icon { stroke:currentColor; stroke-width:1.5; }
.platform-card h2 { font-size:27px; letter-spacing:-.8px; }
.platform-card p { color:var(--muted); font-size:13px; line-height:1.8; margin-block:16px 28px; }
.download-guidance { display:grid; grid-template-columns:1fr 1fr; gap:65px; }
.download-guidance h2 { font-size:26px; }
.download-guidance p { color:var(--muted); font-size:14px; line-height:1.8; margin-block:20px; }
@media(max-width:1100px) { .site-header {gap:25px;} .site-header nav {gap:15px;font-size:12px;} .header-actions {gap:16px;} .footer-top {flex-wrap:wrap;} .download {gap:35px;} }
@media(max-width:760px) { .site-header nav {gap:20px;font-size:11px;} .download {grid-template-columns:1fr;gap:35px;} .download-visual {height:360px;border-radius:16px;} .footer-top {display:grid;grid-template-columns:1fr 1fr;gap:35px 20px;} .footer-identity,.footer-contact {grid-column:1/-1;} .footer-bottom > div {flex-wrap:wrap;gap:16px;} .page-heading {padding-block:48px 35px;} .plans,.download-platforms,.download-guidance {grid-template-columns:1fr;} .plan-card,.platform-card {padding:26px;border-radius:16px;} .package-grid {grid-template-columns:1fr 1fr;gap:12px;} .package-grid article {padding:20px;} .pricing-help {align-items:flex-start;flex-direction:column;gap:20px;padding-bottom:60px;} .download-guidance {gap:40px;} .download-actions {flex-wrap:wrap;} }
.footer-identity > .brand { font-size:27px!important; }
@media(max-width:800px) { .site-header {height:auto;min-height:72px;flex-wrap:wrap;padding-block:16px 12px;gap:12px;} .site-header nav {display:flex;order:3;flex-basis:100%;overflow-x:auto;padding:8px 0 2px;} .header-actions {gap:10px;} }

.reviews-controls { display:flex; justify-content:flex-end; margin:0 0 18px; }
.reviews-pause { border:1px solid var(--line); border-radius:50px; padding:8px 14px; background:var(--paper); color:var(--muted); font-size:11px; cursor:pointer; }
.reviews-pause:hover { color:var(--ink); background:var(--surface); }
.review-marquee { --review-card-width:calc((min(1200px, 100vw - 96px) - 48px) / 4); display:grid; gap:16px; overflow:hidden; }
.review-lane { overflow:hidden; }
.review-track { display:flex; gap:16px; width:max-content; animation:review-drift 55s linear infinite; }
.review-lane:nth-child(2) .review-track { animation-direction:reverse; animation-duration:65s; }
.review-group { display:flex; gap:16px; }
.review-marquee .review-card { width:var(--review-card-width); flex:0 0 var(--review-card-width); min-height:370px; border-radius:16px; padding:22px; }
.review-marquee .review-person { flex-wrap:wrap; }
.review-marquee .review-person > div { min-width:0; max-width:calc(100% - 45px); }
.review-marquee .review-person h3 { overflow-wrap:anywhere; }
.review-marquee .review-stars { width:100%; margin-left:45px; }
.review-marquee .review-card blockquote p { font-size:17px; }
.review-marquee.is-paused .review-track,.review-marquee:hover .review-track,.review-marquee:focus-within .review-track { animation-play-state:paused; }
@keyframes review-drift { to { transform:translateX(calc(-50% - 8px)); } }
@media(max-width:1100px) { .review-marquee { --review-card-width:calc((100vw - 80px - 32px) / 3); } }
@media(max-width:700px) { .review-marquee { --review-card-width:calc((100vw - 40px - 16px) / 2); } }
@media(max-width:480px) { .review-marquee { --review-card-width:calc(100vw - 64px); } }
@media(prefers-reduced-motion:reduce) { .review-lane { overflow-x:auto; } .review-track { animation:none; } .review-group[aria-hidden="true"] { display:none; } }

.roadmap-board { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.roadmap-column-heading { display:flex; align-items:center; gap:10px; margin-bottom:22px; }
.roadmap-column-heading h2 { font-size:17px; font-weight:600; letter-spacing:-.4px; }
.roadmap-dot { width:8px;height:8px; border-radius:50%;flex-shrink:0;background:var(--ink); }
.roadmap-dot.planned { background:transparent;border:1px solid var(--muted); }
.roadmap-dot.available { background:var(--muted); }
.roadmap-items { display:grid;gap:14px; }
.roadmap-card { border:1px solid var(--line); border-radius:16px; padding:24px; background:var(--paper); }
.roadmap-column:first-child .roadmap-card { background:var(--surface); }
.roadmap-card h3 { font-size:18px;line-height:1.4;letter-spacing:-.4px;font-weight:500; }
.roadmap-card p { margin-top:13px;color:var(--muted);font-size:13px;line-height:1.8; }
.roadmap-note { padding-block:30px 65px; }
.roadmap-note p { max-width:800px;color:var(--muted);font-size:12px;line-height:1.8; }
.roadmap-feedback { border-top:1px solid var(--line);padding-block:55px 80px; }
.roadmap-feedback h2 { font-size:29px; }
.roadmap-feedback p { margin-block:18px 25px;max-width:590px;color:var(--muted);font-size:14px;line-height:1.8; }
@media(max-width:800px) { .roadmap-board { grid-template-columns:1fr;gap:35px; } .roadmap-card { padding:23px; } .roadmap-note {padding-bottom:45px;} }

.menu-toggle,.menu-close { width:34px;height:34px;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:50%;background:var(--paper);color:var(--ink);padding:8px;cursor:pointer; }
.menu-toggle { display:none; }
.menu-toggle svg,.menu-close svg { width:18px;height:18px;stroke:currentColor;stroke-width:1.6; }
.menu-close { display:inline-flex; }
.mobile-menu { position:fixed;inset:78px 14px auto auto;margin:0;width:min(360px,calc(100vw - 28px));max-height:calc(100dvh - 100px);overflow:auto;padding:24px;border:1px solid var(--line);border-radius:20px;background:var(--paper);color:var(--ink);box-shadow:0 20px 65px #0002; }
.mobile-menu::backdrop { background:#0005; }
.mobile-menu-top { display:flex;justify-content:space-between;align-items:center;margin-bottom:20px; }
.mobile-menu-top h2 { font-size:19px;letter-spacing:-.5px; }
.mobile-menu nav { display:flex;flex-direction:column;gap:0;font-size:16px; }
.mobile-menu nav a { padding:14px 0;border-bottom:1px solid var(--line);color:var(--ink); }
.mobile-menu nav a:last-child { border-bottom:0; }
.mobile-menu-app { display:flex;margin-top:22px;width:100%; }
html.menu-open { overflow:hidden; }
@media(max-width:1100px) { .site-header { flex-wrap:nowrap;padding-block:0;height:72px;min-height:72px;gap:12px; } .site-header > nav { display:none; } .header-actions {gap:10px;} .header-actions > .nav-app {display:none;} .menu-toggle {display:inline-flex;} html {scroll-padding-top:80px;} }

.docs-hub { padding-bottom:80px; }
.docs-search { max-width:640px;margin-bottom:28px; }
.docs-search label { display:block;font-size:12px;margin-bottom:10px; }
.docs-search input { width:100%;padding:15px 18px;border:1px solid var(--line);border-radius:12px;font:inherit;font-size:14px;background:var(--paper);color:var(--ink); }
.docs-search input:focus-visible { outline:2px solid var(--accent);outline-offset:3px; }
.docs-search-status { color:var(--muted);font-size:11px;margin-top:10px; }
.docs-start { display:block;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:28px;margin-bottom:24px; }
.docs-start h2 { font-size:23px;letter-spacing:-.5px; }
.docs-start p { color:var(--muted);font-size:14px;margin-top:12px;line-height:1.7; }
.guide-list { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px; }
.guide-card { position:relative;border:1px solid var(--line);border-radius:16px;padding:26px; }
.guide-card:hover { background:var(--surface); }
.guide-card h2 { font-size:20px;line-height:1.4;letter-spacing:-.5px;padding-right:14px; }
.guide-card p { font-size:13px;line-height:1.8;color:var(--muted);margin-top:15px; }
.guide-card-arrow { position:absolute;right:20px;top:28px;color:var(--muted);font-size:13px; }
.guide-card[hidden],.docs-empty[hidden] { display:none; }
.docs-empty { color:var(--muted);padding-block:35px; }
.docs-support { margin-top:55px;display:flex;align-items:center;justify-content:space-between;gap:20px; }
.docs-support h2 { font-size:27px; }
.docs-layout { display:grid;grid-template-columns:240px minmax(0,1fr);gap:70px;padding-block:48px 80px; }
.docs-sidebar { position:sticky;top:110px;height:max-content;max-height:calc(100dvh - 140px);overflow:auto;padding-right:15px; }
.docs-sidebar .eyebrow { margin-bottom:15px;font-size:10px; }
.docs-sidebar nav,.docs-mobile-topics nav { display:flex;flex-direction:column;gap:4px;font-size:12px; }
.docs-sidebar a,.docs-mobile-topics nav a { display:block;padding:9px 12px;border-radius:8px;line-height:1.5; }
.docs-sidebar a[aria-current],.docs-mobile-topics a[aria-current] { background:var(--surface);color:var(--ink);font-weight:600; }
.docs-article { max-width:780px;min-width:0; }
.docs-breadcrumb { color:var(--muted);font-size:11px;line-height:1.8;margin-bottom:25px; }
.docs-article h1 { font-size:clamp(30px,3.5vw,43px);line-height:1.2;letter-spacing:-1.3px; }
.docs-lead { color:var(--muted);font-size:16px;line-height:1.8;margin-top:20px; }
.docs-meta { border-bottom:1px solid var(--line);padding-block:22px 28px;margin-bottom:30px; }
.docs-meta p { color:var(--muted);font-size:11px;line-height:1.8; }
.docs-article section h2 { font-size:24px;letter-spacing:-.6px;margin-bottom:22px; }
.docs-steps { padding-left:23px;display:grid;gap:19px;font-size:15px;line-height:1.9; }
.docs-steps li { padding-left:7px; }
.docs-steps li::marker { font-weight:600; }
.docs-tip { border:1px solid var(--line);border-radius:16px;background:var(--surface);padding:25px;margin-top:35px; }
.docs-tip h2 { font-size:17px;letter-spacing:-.3px;margin-bottom:12px; }
.docs-tip p { color:var(--muted);font-size:14px;line-height:1.8; }
.docs-photo { position:relative;isolation:isolate;border-radius:18px;overflow:hidden;border:1px solid var(--line);height:350px;margin-top:30px;display:flex;justify-content:center;align-items:center;padding:25px 25px 50px; }
.docs-photo img { position:relative;z-index:1;max-width:100%;height:100%;object-fit:contain;border-radius:10px;box-shadow:0 10px 25px #0002; }
.docs-photo figcaption { position:absolute;bottom:15px;left:12px;right:12px;text-align:center;font-size:10px;background:var(--paper);color:var(--muted);padding:7px;border-radius:8px; }
.docs-next { display:flex;gap:20px;justify-content:space-between;margin-top:45px;border-top:1px solid var(--line);padding-top:25px; }
.docs-next a { flex:1;max-width:48%; }
.docs-next small { display:block;color:var(--muted);font-size:11px;margin-bottom:9px; }
.docs-next span { font-size:14px;line-height:1.6; }
.docs-article-support { margin-top:35px;color:var(--muted);font-size:13px;line-height:1.8; }
.docs-article-support p { margin-bottom:8px; }
.docs-mobile-topics { display:none; }
@media(max-width:1000px) { .guide-list {grid-template-columns:repeat(2,minmax(0,1fr));} .docs-layout {gap:35px;grid-template-columns:200px minmax(0,1fr);} }
@media(max-width:760px) { .guide-list {grid-template-columns:1fr;} .docs-layout {grid-template-columns:1fr;padding-top:35px;} .docs-sidebar {display:none;} .docs-mobile-topics {display:block;margin-bottom:25px;border:1px solid var(--line);border-radius:12px;padding:14px;} .docs-mobile-topics summary {cursor:pointer;font-size:13px;} .docs-mobile-topics nav {margin-top:14px;} .docs-mobile-topics nav a {white-space:normal;} .docs-support {align-items:flex-start;flex-direction:column;} .docs-photo {height:300px;} .docs-start {padding:24px;} .docs-steps {font-size:14px;} }

.review-body { flex:1; margin:24px 0; }
.review-summary-label { display:block; font-size:10px; color:var(--muted); margin-bottom:10px; }
.review-summary { font-size:15px; line-height:1.75; letter-spacing:-.15px; }
.review-marquee .review-card blockquote { border-top:1px solid var(--line); padding-top:14px; margin:18px 0 0; }
.review-marquee .review-card blockquote p { font-size:13px; color:var(--muted); line-height:1.6; }

.assistant-copy .eyebrow { font-size:11px;margin-bottom:15px; }
.ai-assistant .assistant-copy h3 { font-size:clamp(27px,3vw,36px);line-height:1.25;letter-spacing:-1px;max-width:400px;margin-bottom:20px; }
.ai-assistant .assistant-context { font-size:13px;margin-top:15px; }
.assistant-copy .text-link { display:inline-block;margin-top:22px;font-size:13px; }
.assistant-examples { display:grid;gap:12px; }
.ai-assistant .assistant-examples-label { font-size:12px;margin-bottom:4px; }
.assistant-question { border:1px solid var(--line);border-radius:16px;background:var(--surface);padding:18px 22px; }
.assistant-question span { font-size:10px;color:var(--muted); }
.ai-assistant .assistant-question p { font-size:15px;line-height:1.6;color:var(--ink);margin-top:8px; }
@media(max-width:700px) { .ai-assistant { gap:28px; } }