@font-face { font-family: Lato; src: url('/home/assets/lato-regular.woff2') format('woff2'); font-weight: 400; font-display: swap; }
@font-face { font-family: Lato; src: url('/home/assets/lato-bold.woff2') format('woff2'); font-weight: 700; font-display: swap; }
@font-face { font-family: Lato; src: url('/home/assets/lato-black.woff2') format('woff2'); font-weight: 900; font-display: swap; }
:root { --bg:#fff; --panel:#f7f7f2; --border:#deded6; --text:#242424; --muted:#626262; --accent:#6b5900; --yellow:#ffe500; --ok:#626262; --wrap:1600px; --gutter:32px; color-scheme:light; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:112px; }
body { margin:0; background:var(--bg); color:var(--text); font:400 15px/1.7 Lato,Arial,sans-serif; -webkit-font-smoothing:antialiased; }
a { color:var(--accent); text-decoration:none; }
p a, li a { text-decoration:underline; text-underline-offset:4px; }
a:hover { text-decoration:underline; text-underline-offset:4px; }
a:focus-visible, summary:focus-visible { outline:3px solid #656565; outline-offset:5px; }
.top { position:sticky; z-index:20; top:0; border-bottom:1px solid var(--border); background:#fff; }
.top-inner { width:min(var(--wrap),calc(100% - var(--gutter) * 2)); margin-inline:auto; padding-block:17px; }
.top-nav { display:flex; align-items:center; justify-content:space-between; gap:25px; }
.brand { display:inline-flex; align-items:center; gap:10px; color:var(--text); font-size:25px; font-weight:900; letter-spacing:-1px; white-space:nowrap; }
.brand:hover { text-decoration:none; }
.brand img { display:block; width:34px; height:34px; border-radius:7px; }
.brand span { color:var(--accent); }
.brand .wordmark { color:var(--text); }
.brand .wordmark > span { color:var(--yellow); }
.top-links { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:8px 22px; font-size:13px; font-weight:700; }
.top-links a { display:inline-flex; align-items:center; min-height:40px; color:var(--muted); }
.top-links a[aria-current="page"], .top-links a:hover { color:var(--accent); text-decoration:underline; text-underline-offset:6px; }
.top-links .open-app { min-height:44px; border: 1px solid var(--yellow); border-radius:8px; padding:8px 18px; color: var(--text); background: var(--yellow); }
.top-links .open-app:hover { background: #ebd200; text-decoration:none; }
.wrap { width:min(var(--wrap),calc(100% - var(--gutter) * 2)); margin-inline:auto; }
main.wrap { padding:60px 0; }
h1,h2,h3 { font-weight:900; line-height:1.15; letter-spacing:-.035em; text-wrap:balance; }
h1 { font-size:clamp(38px,5vw,60px); margin:0 0 20px; }
h2 { font-size:30px; margin:55px 0 18px; }
h3 { font-size:21px; margin:0 0 12px; }
.lead { max-width:780px; font-size:17px; color:var(--muted); margin:0 0 30px; }
.grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:18px; margin:30px 0; }
.plan-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; margin-top:34px; }
.card { display:flex; flex-direction:column; min-height:100%; padding:28px; border:1px solid var(--border); border-radius:13px; background:#fff; }
.card.featured { border-color: #d8c43d; background: #fffbea; }
.badge { align-self:flex-start; display:inline-block; padding:4px 10px; margin-bottom:18px; border: 1px solid #d8c43d; border-radius:5px; background: var(--yellow); color: var(--text); font-size:10px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; }
.price { color:var(--text); font-size:43px; font-weight:900; letter-spacing:-.04em; line-height:1.2; margin:7px 0 19px; }
.price small { color:var(--muted); font-size:13px; font-weight:400; letter-spacing:0; }
.card p { color:var(--muted); margin:0 0 18px; font-size:14px; }
.card ul { margin:2px 0 0; padding:17px 0 0 17px; color:#565656; font-size:13px; border-top:1px solid var(--border); }
.card li { margin:8px 0; padding-left:3px; }
.card li::marker { color:#6f6f6f; }
.enterprise-card { grid-column:1/-1; display:grid; grid-template-columns:1fr 1.25fr; gap:0 50px; background:var(--panel); }
.enterprise-card h3,.enterprise-card .price,.enterprise-card p { grid-column:1; }
.enterprise-card p { margin-bottom:0; }
.enterprise-card ul { grid-column:2; grid-row:1/span 3; align-self:center; columns:2; column-gap:35px; margin:0; padding-top:0; border:0; }
.enterprise-card li { break-inside:avoid; }
.box { margin:20px 0; padding:23px 25px; border:1px solid var(--border); border-radius:10px; background:var(--panel); }
.muted { color:var(--muted); }
.ok { color:var(--ok); }
.faq details { margin:11px 0; border:1px solid var(--border); border-radius:9px; padding:0 20px; background:#fff; }
.faq details[open] { border-color:#aaaaaa; background:#f9f9f9; }
.faq summary { min-height:62px; padding:18px 0; color:var(--text); font-weight:700; line-height:1.6; cursor:pointer; }
.faq summary::marker { color:var(--accent); }
.faq p { margin:0 0 20px; color:var(--muted); font-size:14px; }
footer { display:flex; flex-wrap:wrap; align-items:center; gap:10px 23px; margin-top:45px; padding-top:23px; border-top:1px solid var(--border); font-size:13px; }
footer a { display:inline-flex; align-items:center; min-height:40px; }
footer .muted { margin-left:auto; }
@media(min-width:1440px) { :root{--gutter:48px} }
@media(max-width:1050px) { .top-links{gap:8px 15px} .plan-grid{grid-template-columns:repeat(2,minmax(0,1fr))} .enterprise-card ul{columns:1} }
@media(max-width:800px) { .top-nav{flex-wrap:wrap;gap:10px} .top-links{justify-content:flex-start;gap:5px 18px} .top-inner{padding-block:14px} .card{padding:25px} .enterprise-card{gap:0 30px} .price{font-size:39px} }
@media(max-width:600px) { .top-inner,.wrap{width:calc(100% - 40px)} .top-nav{position:relative} .top-inner{padding-block:14px} .brand{font-size:23px}.brand img{width:30px;height:30px} .top-links{gap:3px 15px;font-size:12px} .top-links a{min-height:34px} .top-links .open-app{position:absolute;top:11px;right:0;min-height:38px;padding:6px 14px} main.wrap{padding-top:38px} h1{font-size:38px} h2{font-size:27px;margin-top:42px} .lead{font-size:15px} .plan-grid{grid-template-columns:1fr;gap:16px} .card{padding:25px;border-radius:10px} .enterprise-card{display:flex} .enterprise-card ul{margin-top:18px;padding-top:17px;border-top:1px solid var(--border)} .price{font-size:43px} .box{padding:20px;border-radius:9px} .box h3{font-size:20px} footer .muted{margin-left:0;width:100%} }
@media(max-width:370px) { .top-inner,.wrap{width:calc(100% - 32px)} .top-links{gap:2px 11px;font-size:11px} .card{padding:23px} }
@media(prefers-reduced-motion:reduce) { html{scroll-behavior:auto} *,*::before,*::after{transition:none!important} }
