:root { color-scheme:light; --ink:#152d3b; --muted:#50616a; --accent:#234e60; --line:#d8dcd8; --paper:#f9f8f3; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:28px; }
body { margin:0; background:var(--paper); color:var(--ink); font:17px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; -webkit-font-smoothing:antialiased; }
a { color:var(--accent); text-underline-offset:.25em; }
a:hover { text-decoration-thickness:2px; }
button { font:inherit; }
:focus-visible { outline:3px solid #a14a25; outline-offset:5px; }
img { display:block; max-width:100%; height:auto; }
figure { margin:0; }
p { margin:0 0 18px; }
h1,h2,h3 { line-height:1.1; margin:0 0 22px; font-weight:500; }
h1,h2 { font-family:Georgia,"Times New Roman",serif; letter-spacing:-.045em; }
h1 { font-size:clamp(64px,7.5vw,104px); }
h2 { font-size:clamp(36px,4vw,56px); }
h3 { font-size:23px; letter-spacing:-.025em; font-weight:600; }
strong { font-weight:600; }
.site-header,main,.site-footer { width:min(1200px,calc(100% - 80px)); margin-inline:auto; }
.site-header { display:flex; align-items:center; justify-content:space-between; gap:24px; min-height:106px; border-bottom:1px solid var(--line); }
.brand { display:block; flex:0 1 216px; }
.site-header nav,.site-footer nav { display:flex; flex-wrap:wrap; gap:12px 30px; }
.site-header nav a { color:var(--ink); text-decoration:none; padding-block:12px; font-size:14px; }
.site-header nav a[aria-current] { text-decoration:underline; text-decoration-thickness:2px; }
.skip-link { position:absolute; top:-100px; left:20px; padding:12px; background:white; z-index:5; }
.skip-link:focus { top:12px; }
.intro { display:grid; grid-template-columns:1.1fr 1fr; gap:56px; align-items:center; padding:48px 0; }
.intro-copy { padding-block:24px; }
.app-identity { display:flex; align-items:center; gap:14px; margin-bottom:42px; }
.app-icon { border-radius:13px; width:56px; }
.eyebrow { color:var(--muted); font-size:13px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; margin-bottom:14px; }
.app-identity .eyebrow { margin:0; letter-spacing:.025em; text-transform:none; font-size:15px; color:var(--ink); }
.app-identity .eyebrow span { display:block; color:var(--muted); font-size:13px; font-weight:400; }
.beta-label { display:flex; align-items:center; gap:8px; font-size:12px; color:var(--muted); letter-spacing:.025em; }
.beta-label > span { width:6px; height:6px; border-radius:50%; background:#3a6d50; }
.lead { font-size:25px; line-height:1.4; letter-spacing:-.02em; margin-bottom:22px; }
.intro-copy > p:not(.lead):not(.beta-label) { color:var(--muted); max-width:425px; }
.actions { display:flex; align-items:center; flex-wrap:wrap; gap:18px 24px; margin:30px 0 18px; }
.button { display:inline-flex; align-items:center; gap:24px; padding:15px 22px; border-radius:5px; background:var(--ink); color:white; text-decoration:none; font-weight:600; font-size:16px; }
.button:hover { background:#294f63; }
.text-link { font-size:14px; }
.note { font-size:13px; color:var(--muted); }
.preview-stage { position:relative; background:#e7eceb; border-radius:4px 100px 4px 4px; padding:28px 32px 20px; overflow:hidden; }
.stage-label { display:block; text-transform:uppercase; font-size:10px; letter-spacing:.18em; color:#50626b; margin:0 0 18px; }
.intro-preview { width:min(100%,282px); margin:auto; }
.screen { width:100%; border:1px solid #d5dbda; border-radius:26px; background:white; box-shadow:0 16px 40px #182e3b12; }
figcaption { margin-top:14px; font-size:11px; color:var(--muted); text-align:center; }
.enlarge { display:flex; align-items:center; justify-content:center; gap:12px; background:none; border:0; border-bottom:1px solid currentColor; border-radius:0; margin:8px auto 0; padding:8px 0; font-size:12px; color:var(--ink); cursor:pointer; }
.enlarge:hover { color:#a14a25; }
.page-guide { display:flex; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.page-guide a { flex:1; display:flex; align-items:center; gap:20px; padding:23px 26px; text-decoration:none; color:var(--ink); font-size:15px; }
.page-guide a:first-child { border-right:1px solid var(--line); padding-left:0; }
.page-guide a > span:first-child { font-size:11px; color:var(--muted); }
.page-guide a > span:last-child { margin-left:auto; }
.page-guide a:hover { background:#eeeee7; }
.section { padding:76px 0; }
.section-heading { max-width:690px; margin-bottom:36px; }
.section-heading p { color:var(--muted); }
.screenshots { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.feature { padding:36px 36px 24px; border-radius:4px; }
.feature-events { background:#e7eddf; }
.feature-giving { background:#ebe5dc; }
.feature figcaption { text-align:left; margin:0 0 30px; max-width:380px; font-size:15px; }
.feature figcaption strong { color:var(--ink); display:block; font:36px/1.15 Georgia,"Times New Roman",serif; letter-spacing:-.035em; margin-bottom:14px; }
.feature figcaption span { display:block; }
.feature figcaption .feature-number { font-size:11px; letter-spacing:.13em; color:var(--muted); margin-bottom:28px; }
.feature .screen { width:min(100%,266px); margin:auto; }
.feature .enlarge { margin-top:18px; }
.sample-note { max-width:800px; margin:26px 0 0; }
.install { display:grid; grid-template-columns:1fr 1.2fr; gap:80px; padding:64px; background:var(--ink); color:#fff; margin-bottom:64px; border-radius:4px; }
.install .eyebrow,.install .section-heading p,.steps p,.steps li::before { color:#c8d5db; }
.install a { color:#fff; }
.install .install-mark { font:42px/1 Georgia,serif; letter-spacing:.08em; margin-top:42px; color:#c8b27c; }
.steps { list-style:none; margin:0; padding:0; counter-reset:steps; }
.steps li { counter-increment:steps; display:flex; gap:22px; padding:0 0 26px; margin-bottom:26px; border-bottom:1px solid #4c616d; }
.steps li:last-child { border:0; margin:0; padding:0; }
.steps li::before { content:counter(steps,decimal-leading-zero); font-size:12px; padding-top:5px; font-variant-numeric:tabular-nums; }
.steps h3 { font-size:20px; line-height:1.3; margin-bottom:10px; }
.steps p { font-size:15px; margin-bottom:12px; }
.steps a { font-size:14px; }
.steps strong { color:white; }
.steps .note { font-size:12px; }
.site-footer { display:flex; justify-content:space-between; gap:24px; flex-wrap:wrap; border-top:1px solid var(--line); padding:28px 0 36px; font-size:13px; }
.site-footer p { margin:0; color:var(--muted); }
.preview-open { overflow:hidden; }
dialog { border:0; border-radius:10px; padding:0 18px 18px; width:min(520px,calc(100% - 24px)); max-height:92dvh; background:var(--paper); color:var(--ink); }
dialog::backdrop { background:#102431c9; }
.dialog-bar { position:sticky; top:0; display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 0; background:var(--paper); }
.dialog-bar p { margin:0; font-size:12px; }
.dialog-bar button { border:1px solid var(--line); background:white; color:var(--ink); border-radius:4px; padding:8px 12px; font-size:13px; white-space:nowrap; cursor:pointer; }
#preview-image { width:100%; border-radius:10px; }
@media(max-width:1000px) { .site-header,main,.site-footer { width:calc(100% - 48px); } .intro { gap:32px; } .intro-preview { width:250px; } .intro .actions { align-items:flex-start; flex-direction:column; gap:14px; } .install { gap:40px; padding:40px; } }
@media(max-width:700px) { .site-header { min-height:88px; } .brand { flex-basis:175px; } .site-header nav { gap:16px; } .site-header nav a { font-size:12px; } .site-header nav a[href='/#about'] { display:none; } .intro { grid-template-columns:1fr; gap:30px; padding:36px 0; } .intro-copy { padding:0; } .app-identity { margin-bottom:30px; } h1 { font-size:76px; } .lead { font-size:24px; } .intro .actions { flex-direction:row; align-items:center; gap:20px; } .preview-stage { padding-top:20px; } .intro-preview { width:270px; } .page-guide a { padding:18px 14px; gap:12px; font-size:13px; } .section { padding:48px 0; } .screenshots { gap:16px; } .feature { padding:24px 20px; } .feature figcaption strong { font-size:28px; } .feature figcaption { font-size:14px; } .feature figcaption .feature-number { margin-bottom:20px; } .feature .screen { border-radius:18px; } .install { grid-template-columns:1fr; padding:32px 24px; gap:8px; margin-bottom:40px; } .install .install-mark { display:none; } .install .section-heading { margin-bottom:24px; } }
@media(max-width:460px) { .site-header,main,.site-footer { width:calc(100% - 36px); } .brand { flex-basis:155px; } .site-header { gap:12px; } .site-header nav { gap:14px; } h1 { font-size:64px; } .screenshots { grid-template-columns:1fr; } .feature { padding:30px 24px; } .feature figcaption strong { font-size:34px; } .feature .screen { width:246px; } .intro-preview { width:246px; } .preview-stage { padding-inline:20px; border-top-right-radius:64px; } .page-guide a { gap:8px; font-size:12px; } .site-footer nav { gap:14px 20px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
.beta-signup { max-width:425px; margin-top:28px; }
.beta-signup > label { display:block; font-size:14px; font-weight:600; margin-bottom:8px; }
.beta-signup input[type=email] { width:100%; border:1px solid #89979c; border-radius:5px; background:#fff; color:var(--ink); font:inherit; padding:12px 14px; margin-bottom:10px; }
.beta-signup .note { font-size:12px; line-height:1.55; margin-bottom:14px; }
.beta-signup .button { cursor:pointer; border:0; margin-top:12px; }
.beta-signup .button:disabled { opacity:.7; cursor:wait; }
.signup-trap { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.signup-status { font-size:14px; line-height:1.5; margin-top:12px; color:#8a341d; }
.signup-status:empty { margin:0; }
.signup-confirmation { font-size:16px; margin-top:28px; }
[hidden] { display:none !important; }
.signup-privacy { max-width:760px; padding-block:64px; }
.signup-privacy h1 { font-size:clamp(42px,6vw,68px); }
.signup-privacy h2 { font-size:30px; margin-top:36px; }

.button { border:0; cursor:pointer; }
.install-link { border:0; border-bottom:1px solid currentColor; background:none; color:#fff; font:inherit; font-size:14px; padding:0; cursor:pointer; text-align:left; }
#signup-dialog { padding:0 28px 30px; }
#signup-dialog h2 { margin:18px 0 14px; font-size:38px; }
.signup-intro { color:var(--muted); font-size:16px; }
#signup-dialog .beta-signup { margin-top:22px; }
#signup-dialog .beta-signup .button { width:100%; justify-content:center; }
@media(max-width:430px) { #signup-dialog { padding-inline:20px; } #signup-dialog h2 { font-size:32px; } }