@font-face{font-family:"Satoshi";src:url("/static/fonts/satoshi/Satoshi-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Satoshi";src:url("/static/fonts/satoshi/Satoshi-Medium.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Satoshi";src:url("/static/fonts/satoshi/Satoshi-Bold.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Satoshi";src:url("/static/fonts/satoshi/Satoshi-Black.woff2") format("woff2");font-weight:900;font-style:normal;font-display:swap}

.jr{--ease:cubic-bezier(0.23,1,0.32,1);--paper:#FFFFFF;--paper-2:#F4F4F6;--tint:#F1EDFE;--ink:#141418;--ink-soft:#5B5B66;--rule:#E4E4EA;--accent:#7C3AED;--accent-hover:#6D28D9;--accent-ink:#7C3AED;--on-accent:#FFFFFF;--sh:0 1px 2px rgba(20,20,24,0.06),0 14px 28px -14px rgba(20,20,24,0.22);font-family:"Satoshi",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;font-size:1.0625rem;line-height:1.6;color:var(--ink);background:var(--paper);color-scheme:light;position:relative;overflow-x:clip;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.jr.is-dark:not(:has(.jr-theme:checked)),.jr:not(.is-dark):has(.jr-theme:checked){--paper:#0E0F12;--paper-2:#17181D;--tint:#1D1832;--ink:#F2F2F5;--ink-soft:#A3A3AD;--rule:#2A2B32;--accent-ink:#A78BFA;--sh:none;color-scheme:dark}
.jr.is-dark:not(:has(.jr-theme:checked)) .jr-l,.jr:not(.is-dark):has(.jr-theme:checked) .jr-l{display:none}
.jr.is-dark:not(:has(.jr-theme:checked)) .jr-d,.jr:not(.is-dark):has(.jr-theme:checked) .jr-d{display:block}
.jr.is-dark:not(:has(.jr-theme:checked)) .jr-sun,.jr:not(.is-dark):has(.jr-theme:checked) .jr-sun{display:block}
.jr.is-dark:not(:has(.jr-theme:checked)) .jr-moon,.jr:not(.is-dark):has(.jr-theme:checked) .jr-moon{display:none}
.jr-night{--paper:#0E0F12;--paper-2:#17181D;--tint:#1D1832;--ink:#F2F2F5;--ink-soft:#A3A3AD;--rule:#2A2B32;--accent-ink:#A78BFA;--sh:none;color:var(--ink);background:var(--paper);color-scheme:dark}
.jr-night .jr-l{display:none}
.jr-night .jr-d{display:block}

.jr *,.jr *::before,.jr *::after{box-sizing:border-box}
:where(.jr) :is(h1,h2,h3,p,ul,figure,blockquote){margin:0}
:where(.jr) ul{padding:0;list-style:none}
:where(.jr) a{color:inherit;text-decoration:none}
:where(.jr) img,:where(.jr) svg{display:block;max-width:100%}
:where(.jr) img{height:auto}
:where(.jr) :is(button,input,select,summary){font:inherit;color:inherit}
.jr :focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:6px}
.jr-l{display:block}
.jr-d{display:none}
.jr-sun{display:none}
.jr-moon{display:block}

.jr-wrap{width:min(100% - 96px,1200px);margin-inline:auto}
.jr-sec{padding:112px 0}
.jr-sec--alt{background:var(--paper-2)}
.jr-head{display:flex;flex-direction:column;align-items:flex-start;gap:16px;max-width:680px}
.jr-h1{font-size:clamp(2.75rem,5.4vw,4.75rem);line-height:1.02;font-weight:900;letter-spacing:-0.035em;text-wrap:balance}
.jr-h1 em{font-style:normal;color:var(--accent-ink)}
.jr-h2{font-size:clamp(2rem,4.2vw,3.25rem);line-height:1.08;font-weight:900;letter-spacing:-0.03em;text-wrap:balance}
.jr-h3{font-size:clamp(1.5rem,2.4vw,2rem);line-height:1.15;font-weight:700;letter-spacing:-0.02em;text-wrap:balance}
.jr-lead{font-size:1.1875rem;line-height:1.55;color:var(--ink-soft);max-width:60ch}
.jr-p{color:var(--ink-soft);max-width:62ch}
.jr-p--ink{color:var(--ink)}

.jr-skip{position:absolute;left:16px;top:12px;z-index:100;padding:12px 20px;border-radius:999px;background:var(--ink);color:var(--paper);font-weight:700;transform:translateY(-300%)}
.jr-skip:focus{transform:translateY(0)}
.jr-progress{position:fixed;left:0;right:0;top:0;height:3px;background:var(--accent);transform:scaleX(0);transform-origin:0 50%;z-index:60;pointer-events:none}

.jr-nav{position:sticky;top:0;z-index:50;height:72px}
.jr-nav::before{content:"";position:absolute;inset:0;background:var(--paper);border-bottom:1px solid var(--rule)}
.jr-nav-in{position:relative;display:flex;align-items:center;gap:8px;height:100%}
.jr-brand{display:inline-flex;flex:none;align-items:center;gap:12px;min-height:44px;margin-right:auto;white-space:nowrap;font-weight:900;font-size:1.125rem;letter-spacing:-0.01em}
.jr-brand img{width:36px;height:36px;border-radius:9px}
.jr-links{display:flex;gap:4px;margin-right:16px}
.jr-links a{position:relative;display:inline-flex;align-items:center;min-height:44px;padding:0 12px;font-weight:500;color:var(--ink-soft)}
.jr-links a::after{content:"";position:absolute;left:12px;right:12px;bottom:8px;height:2px;background:var(--accent);transform:scaleX(0);transform-origin:0 50%;transition:transform 240ms var(--ease)}
.jr-links a:hover{color:var(--ink)}
.jr-links a:hover::after,.jr-links a:focus-visible::after{transform:scaleX(1)}
.jr-tgl{position:relative;width:44px;height:44px;flex:none}
.jr-tgl input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer;z-index:1}
.jr-tgl-ui{position:absolute;inset:0;display:grid;place-items:center;border:1px solid var(--rule);border-radius:999px;background:var(--paper);transition:transform 160ms var(--ease)}
.jr-tgl-ui svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.jr-tgl input:hover + .jr-tgl-ui{background:var(--paper-2)}
.jr-tgl input:active + .jr-tgl-ui{transform:scale(0.94)}
.jr-tgl input:focus-visible + .jr-tgl-ui{outline:2px solid var(--accent);outline-offset:3px}
.jr-burger{display:none}
.jr-burger .jr-x{display:none}
.jr:has(.jr-menu:checked) .jr-burger .jr-x{display:block}
.jr:has(.jr-menu:checked) .jr-burger .jr-bars{display:none}
.jr-menu-panel{display:none}
.jr-short{display:none}

.jr-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 24px;border:1.5px solid transparent;border-radius:999px;font-weight:700;text-align:center;white-space:nowrap;cursor:pointer;transition:transform 160ms var(--ease)}
.jr-btn--sm{min-height:44px;padding:0 20px}
.jr-btn--primary{background:var(--accent);color:var(--on-accent)}
.jr-btn--primary:hover{background:var(--accent-hover)}
.jr-btn--ghost{border-color:var(--ink);background:transparent;color:var(--ink)}
.jr-btn--ghost:hover{background:var(--paper-2)}
.jr-btn:hover{transform:translateY(-2px)}
.jr-btn:active{transform:translateY(0) scale(0.98)}
.jr-link{position:relative;display:inline-flex;align-items:center;align-self:flex-start;min-height:44px;font-weight:700;color:var(--accent-ink)}
.jr-link::after{content:"";position:absolute;left:0;right:0;bottom:8px;height:2px;background:currentColor;transform:scaleX(0.16);transform-origin:0 50%;transition:transform 280ms var(--ease)}
.jr-link:hover::after,.jr-link:focus-visible::after{transform:scaleX(1)}

/* 72px is the sticky nav height: the hero fills the first screen, so the next section starts at the fold */
.jr-hero{position:relative;display:flex;align-items:center;min-height:calc(100vh - 72px);min-height:calc(100svh - 72px);padding:72px 0}
.jr-hero-grid{display:grid;grid-template-columns:minmax(0,5.5fr) minmax(0,6.5fr);gap:48px;align-items:center}
/* two lines in every language: --fit narrows the longest translations */
.jr-hero .jr-h1{font-size:calc(clamp(2.25rem,4.4vw,4rem) * var(--fit,1))}
html:lang(tr) .jr-hero .jr-h1{--fit:0.93}
html:lang(uk) .jr-hero .jr-h1{--fit:0.9}
html:lang(cs) .jr-hero .jr-h1,html:lang(id) .jr-hero .jr-h1{--fit:0.85}
html:lang(el) .jr-hero .jr-h1{--fit:0.78}
.jr-hero-copy{display:flex;flex-direction:column;align-items:flex-start;gap:24px}
.jr-hero-copy > *{animation:jr-rise 480ms var(--ease) backwards;animation-delay:calc(var(--i,0) * 70ms)}
.jr-cta-row{display:flex;align-items:center;gap:16px 24px;flex-wrap:wrap}
.jr-badge{display:block;width:172px;height:57px;border-radius:10px;transition:transform 160ms var(--ease)}
.jr-badge:hover{transform:translateY(-2px)}
.jr-badge:active{transform:scale(0.98)}
.jr-badge svg{width:100%;height:100%}
.jr-badge rect{fill:#141418;stroke:#A6A6A6;stroke-width:0.6}
.jr-badge path,.jr-badge text{fill:#FFFFFF}
.jr-note{max-width:19ch;font-size:0.9375rem;line-height:1.4;color:var(--ink-soft)}
.jr-rating{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:500;color:var(--ink-soft)}
.jr-rating .jr-star{color:var(--accent-ink);letter-spacing:0.1em}
.jr-hero-art{position:relative}
.jr-hero-art img{width:100%;aspect-ratio:3147/2011;animation:jr-float 9s ease-in-out infinite}

.jr-cookie{position:fixed;left:0;right:0;bottom:16px;z-index:70;display:flex;align-items:center;gap:24px;width:min(100% - 32px,880px);margin-inline:auto;padding:16px 16px 16px 24px;border:1px solid var(--rule);border-radius:14px;background:var(--paper);box-shadow:var(--sh);animation:jr-slide 480ms var(--ease) 600ms backwards}
.jr-cookie p{flex:1;max-width:560px;font-size:0.9375rem;line-height:1.5;color:var(--ink-soft)}
.jr-cookie-btns{display:flex;gap:8px;flex:none}
.jr-ckb{position:relative;display:block}
.jr-ck{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer;z-index:1}
.jr-ck:focus-visible + .jr-btn{outline:2px solid var(--accent);outline-offset:3px}
.jr-ck:active + .jr-btn{transform:scale(0.98)}
.jr-ckb:hover .jr-btn--primary{background:var(--accent-hover)}
.jr-ckb:hover .jr-btn--ghost{background:var(--paper-2)}
.jr:has(.jr-ck:checked) .jr-cookie{display:none}



.jr-rows{display:flex;flex-direction:column;gap:16px;margin-top:48px}
.jr-row,.jr-marq{display:flex;width:max-content;animation:jr-marq 84s linear infinite}
.jr-row--rev{animation-direction:reverse;animation-duration:100s}
.jr-reviews:hover .jr-row{animation-play-state:paused}
.jr-rcard{flex:none;display:flex;flex-direction:column;gap:8px;width:360px;margin-right:16px;padding:24px;border:1px solid var(--rule);border-radius:14px;background:var(--paper)}
.jr-rcard .jr-star{color:var(--accent-ink);letter-spacing:0.12em}
.jr-rcard h3{font-size:1.0625rem;font-weight:700}
.jr-rcard p{color:var(--ink-soft)}
.jr-rcard cite{margin-top:auto;font-style:normal;font-weight:700;font-size:0.875rem}
.jr-sec--rev{overflow:hidden}

.jr-why{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:56px}
.jr-why-item{display:flex;flex-direction:column;gap:16px;padding:32px;border-radius:14px;background:var(--paper-2)}
.jr-why-item .jr-p--ink{color:var(--ink-soft)}
.jr-why-item h3{font-size:1.5rem;line-height:1.2;font-weight:700;letter-spacing:-0.015em}
.jr-story{display:flex;align-items:center;justify-content:space-between;gap:48px;margin-top:24px;padding:40px 48px;border:1px solid var(--rule);border-radius:14px}
.jr-story .jr-h3{font-size:clamp(1.5rem,2.6vw,2.25rem)}
.jr-story-copy{display:flex;flex-direction:column;gap:12px}

.jr-plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:56px;align-items:stretch}
.jr-plan{display:flex;flex-direction:column;gap:32px;padding:32px;border:1px solid var(--rule);border-radius:14px;background:var(--paper)}
/* ui-lint: allow colored-border */
.jr-plan--best{padding:31px;border:2px solid var(--accent)}
.jr-plan-top{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:32px}
.jr-plan-name{font-size:1.25rem;font-weight:700}
.jr-save{padding:4px 12px;border-radius:999px;background:var(--accent);color:var(--on-accent);font-size:0.875rem;font-weight:700}
.jr-plan-price{display:flex;flex-direction:column;gap:8px}
.jr-price{display:flex;align-items:baseline;gap:8px;min-height:3.5rem}
.jr-price b{font-size:3.5rem;font-weight:900;line-height:1;letter-spacing:-0.035em;font-variant-numeric:tabular-nums}
.jr-price span{color:var(--ink-soft);font-weight:500}
.jr-bill{color:var(--ink-soft)}
.jr-plan .jr-btn{margin-top:auto;width:100%}
.jr-fine{margin-top:24px;font-size:0.9375rem;color:var(--ink-soft)}

.jr-faq-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:72px;align-items:start}
.jr-faq-head{position:sticky;top:104px;display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.jr-qa{border-top:1px solid var(--rule)}
.jr-qa:last-of-type{border-bottom:1px solid var(--rule)}
.jr-qa summary{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:64px;padding:12px 0;list-style:none;font-size:1.125rem;font-weight:700;cursor:pointer}
.jr-qa summary::-webkit-details-marker{display:none}
.jr-qa summary svg{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;transition:transform 240ms var(--ease)}
.jr-qa[open] summary svg{transform:rotate(45deg)}
.jr-qa-a{padding:0 48px 24px 0;color:var(--ink-soft);max-width:58ch}
.jr-qa[open] .jr-qa-a{animation:jr-rise 320ms var(--ease) backwards}

.jr-road{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:48px;align-items:center;padding:48px 48px 0;overflow:hidden;border:1px solid var(--rule);border-radius:14px;background:var(--paper-2)}
.jr-road-copy{display:flex;flex-direction:column;align-items:flex-start;gap:16px;padding-bottom:48px}
.jr-road-art{display:grid;justify-items:center;align-self:end;height:340px;overflow:hidden}
.jr-road-art img{width:240px}

.jr-blog{margin-top:48px}
.jr-posts{display:none;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;animation:jr-pop 480ms var(--ease) backwards}
.jr-posts > li{display:flex}
.jr-post{display:flex;flex:1;flex-direction:column;gap:12px;min-height:340px;padding:32px;border:1px solid var(--rule);border-radius:14px;background:var(--paper);transition:transform 240ms var(--ease)}
.jr-post:hover{transform:translateY(-4px)}
.jr-post h3{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;font-size:1.375rem;line-height:1.25;font-weight:700;letter-spacing:-0.01em}
.jr-post p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:8;overflow:hidden;color:var(--ink-soft)}
.jr-post-meta{margin-top:auto;font-size:0.9375rem;font-weight:500;color:var(--ink-soft)}
.jr-blog-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:24px}
.jr-dots{display:flex}
.jr-dot{position:relative;width:44px;height:44px}
.jr-dot input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer;z-index:1}
.jr-dot-ui{position:absolute;left:50%;top:50%;width:12px;height:12px;margin:-6px 0 0 -6px;border:2px solid var(--ink-soft);border-radius:50%;transition:transform 160ms var(--ease)}
/* ui-lint: allow colored-border */
.jr-dot input:checked + .jr-dot-ui{border-color:var(--accent);background:var(--accent);transform:scale(1.25)}
.jr-dot input:focus-visible + .jr-dot-ui{outline:2px solid var(--accent);outline-offset:4px}

.jr-cta{padding:112px 0 72px;background:var(--paper)}
.jr-cta-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:72px;align-items:end}
.jr-cta-copy{display:flex;flex-direction:column;align-items:flex-start;gap:24px}
.jr-news{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:48px;align-items:center;margin-top:96px;padding:48px;border-radius:14px;background:var(--paper-2)}
.jr-news-copy{display:flex;flex-direction:column;gap:8px}
.jr-news-form{display:flex;flex-direction:column;gap:12px}
.jr-form{display:flex;align-items:center;gap:8px;padding:6px;border:1px solid var(--rule);border-radius:999px;background:var(--paper)}
.jr-input{flex:1;min-width:0;min-height:48px;padding:0 20px;border:0;border-radius:999px;background:transparent;color:var(--ink)}
.jr-input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.jr-input::placeholder{color:var(--ink-soft);opacity:1}
.jr-news .jr-fine{margin-top:0;padding-left:20px}

.jr-foot{padding:96px 0 0;border-top:1px solid var(--rule);overflow:hidden}
.jr-foot-top{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,2fr) minmax(0,2fr) minmax(0,2fr);gap:48px}
.jr-foot-brand{display:flex;flex-direction:column;align-items:flex-start;gap:24px}
.jr-foot-h{font-size:1.0625rem;font-weight:700;color:var(--ink)}
.jr-foot-col{display:flex;flex-direction:column;gap:4px}
.jr-foot-col .jr-foot-h{margin-bottom:8px}
.jr-foot-col a{display:flex;align-items:center;min-height:44px;color:var(--ink-soft)}
.jr-foot-col a:hover,.jr-explore-links a:hover{color:var(--ink)}
.jr-explore{margin-top:72px;padding-top:32px;border-top:1px solid var(--rule)}
.jr-explore-links{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:48px;margin-top:16px}
.jr-explore-links a{display:flex;align-items:center;min-height:48px;border-bottom:1px solid var(--rule);color:var(--ink-soft)}
.jr-drawers{margin-top:48px}
.jr-drawer{border-top:1px solid var(--rule)}
.jr-drawer:last-child{border-bottom:1px solid var(--rule)}
.jr-drawer summary{display:flex;align-items:center;justify-content:space-between;min-height:56px;list-style:none;font-weight:700;cursor:pointer}
.jr-drawer summary::-webkit-details-marker{display:none}
.jr-drawer summary svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;transition:transform 240ms var(--ease)}
.jr-drawer[open] summary svg{transform:rotate(45deg)}
.jr-cols2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px;padding-bottom:16px}
.jr-cols2 a{display:flex;align-items:center;min-height:44px;color:var(--ink-soft)}
.jr-cols2 a:hover{color:var(--ink)}
.jr-lang{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.jr-lang select{min-height:44px;min-width:200px;padding:0 16px;border:1px solid var(--rule);border-radius:999px;background:var(--paper-2);font-size:1rem}
.jr-foot-base{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 32px;margin-top:48px;padding-top:24px;border-top:1px solid var(--rule);font-size:0.9375rem;color:var(--ink-soft)}
.jr-made{display:flex;flex-wrap:wrap;align-items:center;gap:8px 24px}
.jr-made-t{display:inline-flex;align-items:center;gap:8px}
.jr-made-t svg{width:18px;height:18px;fill:var(--accent-ink)}
.jr-person{display:inline-flex;align-items:center;gap:4px}
.jr-person-name{margin-right:8px;color:var(--ink);font-weight:500}
.jr-soc{display:grid;place-items:center;width:44px;height:44px;border-radius:999px;color:var(--ink-soft);transition:transform 160ms var(--ease)}
.jr-soc:hover{color:var(--ink);background:var(--paper-2);transform:translateY(-2px)}
.jr-soc svg{width:20px;height:20px;fill:currentColor}

@supports (animation-timeline:scroll()){
.jr-progress{animation:jr-grow linear both;animation-timeline:scroll(root)}
.jr-nav::before{opacity:0;animation:jr-navbg linear both;animation-timeline:scroll(root);animation-range:0 160px}
.jr-hero-art img{animation:jr-float 9s ease-in-out infinite,jr-par linear both;animation-timeline:auto,scroll(root);animation-range:normal,0 800px}
}
@supports (animation-timeline:view()){
.jr-reveal{animation:jr-reveal linear both;animation-timeline:view();animation-range:entry 0% entry 55%}
}

@keyframes jr-rise{from{opacity:0;transform:translateY(16px)}}
@keyframes jr-pop{from{opacity:0;transform:scale(0.98)}}
@keyframes jr-slide{from{opacity:0;transform:translateY(24px)}}
@keyframes jr-drop{from{opacity:0;transform:translateY(-8px)}}
@keyframes jr-reveal{from{opacity:0;transform:translateY(28px)}}
@keyframes jr-grow{to{transform:scaleX(1)}}
@keyframes jr-navbg{to{opacity:1}}
@keyframes jr-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes jr-par{to{translate:0 56px}}
@keyframes jr-marq{to{transform:translateX(-50%)}}

@media (max-width:1000px){
.jr-hero-grid,.jr-faq-grid,.jr-road,.jr-cta-grid,.jr-news{grid-template-columns:minmax(0,1fr)}
.jr-why,.jr-plans,.jr-posts{grid-template-columns:minmax(0,1fr)}
.jr-post{min-height:304px}
.jr-story{flex-direction:column;align-items:flex-start;gap:24px}
.jr-foot-top{grid-template-columns:repeat(2,minmax(0,1fr))}
.jr-foot-brand{grid-column:1 / -1}
.jr-explore-links{grid-template-columns:repeat(2,minmax(0,1fr))}
.jr-faq-head{position:static}
.jr-hero-art{order:-1}
.jr-links{display:none}
.jr-burger{display:block}
.jr:has(.jr-menu:checked) .jr-menu-panel{display:flex;flex-direction:column;position:absolute;left:0;right:0;top:72px;z-index:49;padding:8px 20px 24px;border-bottom:1px solid var(--rule);background:var(--paper);animation:jr-drop 220ms var(--ease) backwards}
.jr-menu-panel a{display:flex;align-items:center;min-height:52px;border-bottom:1px solid var(--rule);font-size:1.125rem;font-weight:700}
.jr-long{display:none}
.jr-short{display:inline}
.jr-cookie{flex-direction:column;align-items:stretch;gap:10px;padding:12px 16px 16px}
.jr-ckb{flex:1}
.jr-cookie-btns .jr-btn{width:100%}
}
@media (max-width:760px){
.jr-wrap{width:calc(100% - 32px)}
.jr-nav-in{gap:4px}
.jr-brand{gap:8px;font-size:1rem}
.jr-brand img{width:32px;height:32px}
.jr-nav .jr-btn--sm{padding:0 14px}
.jr-sec{padding:72px 0}
.jr-hero{padding:24px 0 48px}
.jr-hero-grid{gap:32px}
.jr-hero-copy{gap:20px}
.jr-rcard{width:300px}
.jr-why-item{padding:24px}
.jr-story{padding:28px 24px}
.jr-road{padding:32px 24px 0}
.jr-road-copy{padding-bottom:32px}
.jr-plan{padding:24px}
.jr-plan--best{padding:23px}
.jr-post{padding:24px}
.jr-cta{padding:72px 0 48px}
.jr-news{margin-top:64px;padding:28px 20px;gap:24px}
.jr-foot{padding:64px 0 0}
.jr-foot-top{grid-template-columns:minmax(0,1fr);gap:32px}
.jr-explore{margin-top:48px}
.jr-explore-links{grid-template-columns:minmax(0,1fr)}
.jr-cols2{grid-template-columns:minmax(0,1fr)}
.jr-qa-a{padding-right:0}
}

@media (prefers-reduced-motion:reduce){
.jr *,.jr *::before,.jr *::after{animation:none !important;transition:none !important}
.jr-row,.jr-marq{width:auto;flex-wrap:wrap;padding-inline:16px}
.jr-clone{display:none}
.jr-nav::before{opacity:1}
.jr-rows .jr-rcard{margin-bottom:16px}
}
@media (max-width:360px){
.jr-brand span{display:none}
}
.v-fig{display:block;flex:var(--g,1) 1 0;min-width:0}
.v-fig img{width:100%;height:auto}
.f-center{align-items:center;text-align:center;margin-inline:auto}
.f-center .jr-lead{margin-inline:auto}
.f-center .jr-link{align-self:center}
.fm-list{display:grid}
.fm-item{display:flex;flex-direction:column}
.fm-art img{width:100%;height:auto}
.fm-body{display:flex;flex-direction:column;gap:8px}
.fm-body h3{font-size:1.25rem;line-height:1.25;font-weight:700}
.fm-body p{color:var(--ink-soft)}

/* 1 Poster */
.f1-list{display:flex;flex-direction:column;gap:120px;margin-top:80px}
.f1-ch{display:flex;flex-direction:column;align-items:center;gap:48px}
.f1-copy{display:flex;flex-direction:column;align-items:center;gap:16px;max-width:680px;text-align:center}
.f1-h3{font-size:clamp(2rem,4vw,3.25rem);line-height:1.08;font-weight:900;letter-spacing:-0.03em;text-wrap:balance}
.f1-copy .jr-p{font-size:1.1875rem;line-height:1.55}
.f1-plate{display:flex;justify-content:center;gap:24px;width:100%;padding:56px;background:var(--paper-2);border-radius:14px}
.f1-ch:nth-child(even) .f1-plate{background:var(--tint)}
.f1-plate .v-fig{max-width:540px}
.f1-ch.one .f1-plate{width:min(100%,680px)}
.fm1-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:72px 40px;margin-top:72px}
.fm1-item{align-items:center;gap:28px;text-align:center}
.fm1-art{display:grid;place-items:center;width:100%;padding:40px 24px;background:var(--paper-2);border-radius:14px}
.fm1-item:nth-child(even) .fm1-art{background:var(--tint)}
.fm1-art img{width:min(100%,208px)}
.fm1-body{align-items:center;max-width:34ch}

/* 2 Bands */
.fv2{padding-bottom:0}
.f2-bands{margin-top:72px}
.f2-band{padding:96px 0}
.f2-band:nth-child(odd){background:var(--paper-2)}
.f2-row{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:72px;align-items:center}
.f2-band:nth-child(even) .f2-row{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.f2-band:nth-child(even) .f2-copy{order:2}
.f2-copy{display:flex;flex-direction:column;gap:16px}
.f2-plate{display:grid;place-items:center;padding:40px;background:var(--tint);border-radius:14px}
.f2-plate .v-fig{flex:none;width:100%;max-width:560px}
.fm2-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:56px}
.fm2-item{display:grid;grid-template-columns:160px minmax(0,1fr);gap:32px;align-items:center;padding:32px;border:1px solid var(--rule);border-radius:14px;background:var(--paper)}
.fm2-art img{width:160px}
.fm2-all{display:grid;place-items:center;padding:32px;border-radius:14px;background:var(--tint)}

/* 3 Sticky copy */
.f3-list{margin-top:32px}
.f3-ch{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:72px;align-items:start;padding:96px 0;border-top:1px solid var(--rule)}
.f3-ch:first-child{border-top:0}
.f3-copy{position:sticky;top:120px;display:flex;flex-direction:column;gap:16px}
.f3-art{display:flex;flex-direction:column;align-items:center;gap:24px}
.f3-art .v-fig{flex:none;width:100%;max-width:640px;padding:32px;background:var(--paper-2);border-radius:14px}
.f3-ch:nth-child(even) .f3-art .v-fig{background:var(--tint)}
.f3m-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:72px;align-items:start}
.f3m-head{position:sticky;top:120px}
.fm3-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 24px}
.fm3-item{gap:16px}
.fm3-art{display:grid;place-items:center;padding:24px 16px;background:var(--paper);border-radius:14px}
.fm3-item:nth-child(even) .fm3-art{background:var(--tint)}
.fm3-art img{width:min(100%,160px)}

/* 4 Card stack */
.f4-stack{margin-top:56px}
.f4-card{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:56px;align-items:center;margin-bottom:40px;padding:56px;background:var(--paper-2);border:1px solid var(--rule);border-radius:14px;box-shadow:var(--sh)}
.f4-card:nth-child(even){background:var(--tint)}
.f4-copy{display:flex;flex-direction:column;gap:16px}
.f4-art{display:flex;justify-content:center}
.f4-art .v-fig{flex:none;width:min(100%,540px)}
@media (min-width:1001px) and (min-height:760px){
.f4-card{position:sticky;top:calc(96px + var(--i) * 12px);min-height:560px}
}
.fm4-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:56px}
.fm4-item{gap:24px;padding:32px 28px;background:var(--paper-2);border:1px solid var(--rule);border-radius:14px}
.fm4-art{order:2;display:grid;place-items:center}
.fm4-art img{width:min(100%,184px)}

/* 5 Bento */
.f5-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;margin-top:56px}
.f5-tile{display:flex;flex-direction:column;gap:32px;padding:40px;background:var(--paper-2);border-radius:14px;color:var(--ink)}
.f5-tile.jr-night{background:var(--paper-2)}
.f5-tint{background:var(--tint)}
.f5-w12{grid-column:span 12;display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);align-items:center;gap:48px}
.f5-w7{grid-column:span 7}
.f5-w6{grid-column:span 6}
.f5-w5{grid-column:span 5}
.f5-copy{display:flex;flex-direction:column;gap:12px}
.f5-art{margin-top:auto;display:flex;justify-content:center;gap:16px}
.f5-art .v-fig{max-width:520px}
.f5-w7 .f5-art .v-fig,.f5-w6 .f5-art .v-fig,.f5-w5 .f5-art .v-fig{flex:none;width:100%}
.f5-acc{--ink:#FFFFFF;--ink-soft:#EDE9FE;background:var(--accent);color:#FFFFFF}
.f5-acc .jr-p{color:var(--ink-soft)}
.fm5-list{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin-top:56px}
.fm5-item{gap:24px;padding:32px 24px;background:var(--paper);border:1px solid var(--rule);border-radius:14px;color:var(--ink)}
.fm5-art{display:grid;place-items:center}
.fm5-art img{width:min(100%,168px)}
.fm5-item:nth-child(1),.fm5-item:nth-child(8),.fm5-item:nth-child(9){grid-column:span 2;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;align-items:center;padding:32px 40px}
.fm5-item:nth-child(1) .fm5-art,.fm5-item:nth-child(8) .fm5-art,.fm5-item:nth-child(9) .fm5-art{order:2}
.fm5-item:nth-child(1) .fm5-art img,.fm5-item:nth-child(8) .fm5-art img,.fm5-item:nth-child(9) .fm5-art img{width:min(100%,212px)}
.fm5-item:nth-child(1){background:var(--accent);border-color:transparent;--ink:#FFFFFF;--ink-soft:#EDE9FE}
.fm5-item:nth-child(8){background:var(--tint);border-color:transparent}
.fm5-item:nth-child(1) .fm-body p{color:var(--ink-soft)}
.fm5-item:nth-child(1) .fm-body h3,.fm5-item:nth-child(8) .fm-body h3,.fm5-item:nth-child(9) .fm-body h3{font-size:1.5rem;line-height:1.2;letter-spacing:-0.02em}

/* 6 Big type */
.fv6 .jr-h2{font-size:clamp(3.25rem,7.5vw,6.5rem);line-height:1;letter-spacing:-0.045em}
.f6-list{margin-top:64px}
.f6-ch{padding:88px 0;border-top:1px solid var(--rule)}
.f6-h3{max-width:18ch;font-size:clamp(2.5rem,5vw,4.25rem);line-height:1.02;font-weight:900;letter-spacing:-0.04em;text-wrap:balance}
.f6-text{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px;max-width:1000px;margin-top:32px}
.f6-art{display:flex;justify-content:center;gap:24px;margin-top:56px;padding:48px;background:var(--paper-2);border-radius:14px}
.f6-ch:nth-child(even) .f6-art{background:var(--tint)}
.f6-art .v-fig{max-width:540px}
.f6-ch.one .f6-art{width:min(100%,660px)}
.fm6-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:0 48px;margin-top:56px}
.fm6-item{flex-direction:row;align-items:center;gap:28px;padding:40px 0;border-top:1px solid var(--rule)}
.fm6-art{flex:none;width:168px}
.fm6-body h3{font-size:1.5rem;line-height:1.15;font-weight:900;letter-spacing:-0.02em}

/* 7 Night gallery */
.f7-list{display:flex;flex-direction:column;gap:96px;margin-top:72px}
.f7-ch{display:flex;flex-direction:column;gap:32px}
.f7-ch.one{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:56px;align-items:center}
.f7-ch.one .f7-cap{display:flex;flex-direction:column;gap:16px}
.f7-stage{display:flex;justify-content:center;gap:24px;padding:56px;background:var(--paper-2);border:1px solid var(--rule);border-radius:14px}
.f7-ch:nth-child(even) .f7-stage{background:var(--tint)}
.f7-stage .v-fig{max-width:520px}
.f7-ch.one .f7-stage .v-fig{max-width:480px}
.f7-cap{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:56px;align-items:start}
.f7-text{display:flex;flex-direction:column;gap:16px}
.fv7 .jr-p,.fm7 .fm-body p{color:#C8C8D0}
.fm7{padding-top:0}
.fm7 .jr-wrap{padding-top:96px;border-top:1px solid var(--rule)}
.fm7-list{display:flex;flex-wrap:wrap;justify-content:center;gap:56px 24px;margin-top:56px}
.fm7-item{flex:0 0 calc((100% - 96px) / 5);align-items:center;gap:20px;text-align:center}
.fm7-art{display:grid;place-items:center;width:100%;padding:28px 12px;background:var(--paper-2);border:1px solid var(--rule);border-radius:14px}
.fm7-item:nth-child(even) .fm7-art{background:var(--tint)}
.fm7-art img{width:min(100%,168px)}
.fm7-body h3{font-size:1.125rem}

/* 8 Lavender cards */
.f8-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;margin-top:56px}
.f8-card{display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--rule);border-radius:14px;background:var(--paper)}
.f8-plate{display:grid;place-items:center;padding:40px;background:var(--tint)}
.f8-plate .v-fig{flex:none;width:min(100%,440px)}
.f8-copy{display:flex;flex-direction:column;flex:1;gap:12px;padding:32px}
.fm8-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;margin-top:56px}
.fm8-item{overflow:hidden;border:1px solid var(--rule);border-radius:14px;background:var(--paper)}
.fm8-art{display:grid;place-items:center;padding:32px 24px;background:var(--tint)}
.fm8-art img{width:min(100%,184px)}
.fm8-body{flex:1;padding:24px}

/* 9 Asymmetric */
.f9-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:64px 32px;margin-top:56px}
.f9-card{display:flex;flex-direction:column;gap:28px}
.f9-card:nth-child(4n+1),.f9-card:nth-child(4n){grid-column:span 7}
.f9-card:nth-child(4n+2),.f9-card:nth-child(4n+3){grid-column:span 5}
.f9-plate{flex:1;display:grid;place-items:center;padding:48px;background:var(--paper-2);border-radius:14px}
.f9-card:nth-child(4n+1) .f9-plate,.f9-card:nth-child(4n) .f9-plate{background:var(--tint)}
.f9-plate .v-fig{flex:none;width:min(100%,500px)}
.f9-copy{display:flex;flex-direction:column;gap:12px}
.fm9-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:56px 40px;margin-top:56px}
.fm9-item{gap:24px}
.fm9-art{display:grid;place-items:center;padding:32px 24px;background:var(--paper-2);border-radius:14px}
.fm9-item:nth-child(even) .fm9-art{background:var(--tint)}
.fm9-art img{width:min(100%,200px)}

/* 10 Floating card */
.f10-list{display:flex;flex-direction:column;gap:80px;margin-top:72px}
.f10-ch{display:flex;flex-direction:column}
.f10-plate{display:flex;justify-content:center;gap:24px;padding:48px 48px 136px;background:var(--paper-2);border-radius:14px}
.f10-ch:nth-child(even) .f10-plate{background:var(--tint)}
.f10-plate .v-fig{max-width:520px}
.f10-card{position:relative;display:flex;flex-direction:column;gap:12px;width:min(100%,560px);margin:-112px 0 0 48px;padding:32px;background:var(--paper);border:1px solid var(--rule);border-radius:14px;box-shadow:var(--sh)}
.f10-ch:nth-child(even) .f10-card{margin-left:auto;margin-right:48px}
.fm10-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:56px 24px;margin-top:56px}
.fm10-art{display:grid;place-items:center;padding:32px 24px 96px;background:var(--paper-2);border-radius:14px}
.fm10-item:nth-child(even) .fm10-art{background:var(--tint)}
.fm10-art img{width:min(100%,196px)}
.fm10-body{position:relative;margin:-72px 16px 0;padding:24px;background:var(--paper);border:1px solid var(--rule);border-radius:14px;box-shadow:var(--sh)}

@media (max-width:1000px){
.f2-row,.f3-ch,.f6-text,.f7-cap,.f5-w12,.f4-card,.f3m-grid,.f7-ch.one{grid-template-columns:minmax(0,1fr)}
.f2-band:nth-child(even) .f2-row{grid-template-columns:minmax(0,1fr)}
.f2-band:nth-child(even) .f2-copy{order:0}
.f2-row,.f3-ch,.f7-cap,.f5-w12,.f4-card,.f3m-grid,.f7-ch.one{gap:32px}
.f6-text{gap:16px}
.f2-band{padding:64px 0}
.f3-ch{padding:64px 0}
.f3-copy,.f3m-head{position:static}
.f5-w7,.f5-w6,.f5-w5{grid-column:span 12}
.f1-plate,.f7-stage,.f6-art{padding:40px}
.fm1-list,.fm4-list,.fm8-list,.fm9-list,.fm10-list,.fm6-list,.fm3-list,.fm5-list{grid-template-columns:repeat(2,minmax(0,1fr))}
.fm2-list{grid-template-columns:minmax(0,1fr)}
.fm5-item:nth-child(1),.fm5-item:nth-child(8),.fm5-item:nth-child(9){grid-column:span 2}
.fm7-item{flex-basis:calc((100% - 48px) / 3)}
.fm10-list{gap:56px 24px}
.f8-grid{gap:32px}
.f9-grid{gap:32px}
.f9-card:nth-child(n){grid-column:span 6}
.f6-ch{padding:56px 0}
.f10-plate{padding:40px 32px 128px}
.f10-card{margin-left:32px}
.f10-ch:nth-child(even) .f10-card{margin-right:32px}
}
@media (max-width:760px){
.f1-list{gap:80px;margin-top:56px}
.f1-plate,.f7-stage,.f6-art,.f10-plate{flex-direction:column;padding:20px;gap:16px}
.f10-plate{padding-bottom:96px}
.f1-plate .v-fig,.f7-stage .v-fig,.f6-art .v-fig,.f10-plate .v-fig{flex:none;width:100%;max-width:none}
.f2-plate{padding:20px}
.f3-art .v-fig{padding:20px}
.f4-card{padding:28px}
.f5-tile{padding:28px}
.f5-art{flex-direction:column;gap:16px}
.f5-art .v-fig{flex:none;width:100%;max-width:none}
.f6-h3{font-size:clamp(2.25rem,11vw,3rem)}
.fv6 .jr-h2{font-size:clamp(3rem,15vw,4rem)}
.f7-list{gap:64px}
.f8-grid,.f9-grid{grid-template-columns:minmax(0,1fr)}
.f9-card:nth-child(n){grid-column:auto}
.f8-plate,.f9-plate{padding:24px}
.f8-copy{padding:24px}
.f10-card{margin:-72px 16px 0;width:auto;padding:24px}
.f10-ch:nth-child(even) .f10-card{margin-left:16px;margin-right:16px}
.fm1-list,.fm3-list,.fm4-list,.fm5-list,.fm6-list,.fm8-list,.fm9-list,.fm10-list{grid-template-columns:minmax(0,1fr)}
.fm1-list{gap:56px}
.fm5-item:nth-child(1),.fm5-item:nth-child(8),.fm5-item:nth-child(9){grid-column:auto;grid-template-columns:minmax(0,1fr);padding:28px}
.fm5-item:nth-child(1) .fm5-art,.fm5-item:nth-child(8) .fm5-art,.fm5-item:nth-child(9) .fm5-art{order:0}
.fm7-item{flex-basis:100%}
.fm2-item{grid-template-columns:minmax(0,1fr);gap:20px;padding:24px;justify-items:center;text-align:center}
.fm2-art img{width:170px}
.fm7 .jr-wrap{padding-top:64px}
.fm6-item{padding:32px 0}
}
.jr-blog:has(#jr-bp-0:checked) #bp0{display:grid}
.jr-blog:has(#jr-bp-1:checked) #bp1{display:grid}
.jr-blog:has(#jr-bp-2:checked) #bp2{display:grid}


.mx1-head{max-width:none;flex-direction:row;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 48px}
.mx1-h2{font-size:clamp(2.5rem,5.4vw,4.5rem);line-height:1.02;letter-spacing:-0.035em}
.mx1-t{position:relative;display:flex;align-items:center;gap:20px;padding:24px;border-radius:14px;color:var(--ink);transition:transform 240ms var(--ease)}
@media (hover:hover){.mx1-t:hover{transform:translateY(-4px);box-shadow:var(--sh)}} /* ui-lint: allow hover-lift (owner allows hover motion on transform) */
@media (forced-colors:active){.mx1-t{border:1px solid CanvasText}}
.mx1-g1{background:var(--tint)}
.mx1-g2{background:var(--paper-2)}
.mx1-g3{--ink:#FFFFFF;--ink-soft:#EDE9FE;background:var(--accent)}
.mx1-g4{background:var(--paper-2);border:1px solid var(--rule)}
.mx1-body{flex:1;display:flex;flex-direction:column;gap:10px;min-width:0;overflow-wrap:anywhere}
.mx1-body h3{font-size:clamp(1.25rem,1.7vw,1.5rem);line-height:1.15;font-weight:900;letter-spacing:-0.03em;text-wrap:balance}
.mx1-body p{font-size:1rem;line-height:1.5;color:color-mix(in srgb,var(--ink) 80%,var(--paper))}
.mx1-g3 .mx1-body p{color:#FFFFFF}
.mx1-art{order:-1;display:flex;flex:none;gap:10px}
.mx1-art img{width:100%;height:auto;vertical-align:top}
.mx1-cmp .mx1-art{width:112px}
.mx1-grid,.mx1-cols{margin:40px 0 0;padding:0;list-style:none}

.mx1-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px}
.mx1-wide .mx1-art img{width:112px}
.mx1-wide .mx1-body h3{font-size:1.625rem}
.mx1-wide .mx1-body p{font-size:1.0625rem}
.mx1-cmp[data-item="smart"] .mx1-art{width:124px}
.mx1-cmp[data-item="smart"] .mx1-body h3{font-size:1.5rem}
.mx1-cmp[data-item="smart"] .mx1-body p{font-size:1.0625rem}
.mx1-wide[data-item="custom"] .mx1-art img{width:124px}
@media (min-width:1001px) and (max-width:1295px){
.mx1-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.mx1-grid > li{grid-column:auto !important;grid-row:auto !important}
.mx1-grid > li:last-child{grid-column:1 / -1 !important}
.mx1-cmp .mx1-art{width:92px}
.mx1-wide .mx1-art img,.mx1-wide[data-item="custom"] .mx1-art img{width:76px}
}
@media (max-width:760px){
.mx1-wide{flex-direction:column;align-items:stretch}
.mx1-wide .mx1-art{order:1}
.mx1-wide .mx1-art img{width:calc(50% - 5px);max-width:130px}
}

@media (max-width:1000px){
.mx1-grid{grid-template-columns:minmax(0,1fr) !important}
.mx1-grid > li{grid-column:auto !important;grid-row:auto !important}
}
@media (max-width:760px){
.mx1-sec .jr-wrap{width:calc(100% - 32px)}
.mx1-t{padding:20px !important;gap:16px}
.mx1-cmp .mx1-art{width:96px}
.mx1-body h3{font-size:1.25rem}
}


/* Sections below And Many More: Why, Pricing, FAQ, Roadmap, Blog, CTA. Prefix lo-. */
.jr{--lo-on-accent:#F3EDFF}

.lo-head{max-width:720px}
.lo-btn-on{white-space:normal;border-color:#FFFFFF;background:#FFFFFF;color:#1B0F3A}
.lo-btn-on:hover{background:#F3EDFF}
.lo-plan--best .lo-btn-on:focus-visible{outline-color:#FFFFFF}
html:has(:where(#reviews,#why-justread,#pricing,#faq,#roadmap,#blog,#cta,#footer) :focus-visible){scroll-padding-top:88px}
.lo-fine{margin-top:32px;font-size:0.9375rem;color:var(--ink-soft)}
.lo-head h2,.lo-faq-title h2,.lo-price b,.lo-btn-on,.lo-why-item h3,.lo-story-h,.lo-plan-name,.lo-post h3,.lo-cta-h,.lo-log-text{overflow-wrap:anywhere}


/* Why: one calm reading layout, no tiles, no colour, neutral hairlines */
.lo-why-sec{padding:112px 0}
.lo-why-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);column-gap:72px;align-items:start}
.lo-why-grid .lo-head{position:sticky;top:104px}
.lo-why{margin:0;padding:0;list-style:none}
.lo-why-item{display:flex;flex-direction:column;gap:12px;padding:36px 0;border-top:1px solid var(--rule)}
.lo-why-item:first-child{padding-top:0;border-top:0}
.lo-why-item h3,.lo-story-h{font-size:clamp(1.5rem,2.2vw,2rem);line-height:1.15;font-weight:900;letter-spacing:-0.025em;text-wrap:balance} /* ui-lint: allow weight (Satoshi Black is the display weight in design.md) */
.lo-why-lede{font-size:1.1875rem;line-height:1.5;font-weight:500;color:var(--ink)}
.lo-why-body{color:var(--ink-soft)}
.lo-story{display:flex;flex-direction:column;align-items:flex-start;gap:20px;padding-top:36px;border-top:1px solid var(--rule)}
.lo-story-copy{display:flex;flex-direction:column;gap:12px}
.lo-story .jr-btn{white-space:normal;max-width:100%;text-align:left}
.lo-story-lead{max-width:44ch;font-size:1.1875rem;line-height:1.5;color:var(--ink-soft)}


/* Pricing */
.lo-price-sec{padding:128px 0;background:var(--paper-2)}
.lo-plans{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.14fr) minmax(0,1fr);gap:16px;margin-top:84px;align-items:stretch}
.lo-plan{display:flex;flex-direction:column;justify-content:space-between;gap:40px;padding:36px;border-radius:14px;background:var(--paper)}
.lo-plan--best{margin-block:-20px;padding:56px 40px;background:var(--accent);color:#FFFFFF}
.lo-plan-top{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:32px}
.lo-plan-name{font-size:1.25rem;font-weight:700}
.lo-save{padding:4px 14px;border-radius:999px;background:#FFFFFF;color:#5B21B6;font-size:0.9375rem;font-weight:700}
.lo-plan-price{display:flex;flex-direction:column;gap:8px}
.lo-price{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 8px;min-height:4.25rem}
.lo-price b{font-size:clamp(3rem,4.4vw,3.75rem);font-weight:900;line-height:1;letter-spacing:-0.035em;font-variant-numeric:tabular-nums} /* ui-lint: allow weight (Satoshi Black is the display weight in design.md) */
.lo-plan--best .lo-price b{font-size:clamp(3.5rem,5.6vw,4.75rem)}
.lo-price span{font-size:1.125rem;font-weight:500;color:var(--ink-soft)}
.lo-bill{color:var(--ink-soft)}
.lo-plan--best .lo-price span,.lo-plan--best .lo-bill{color:var(--lo-on-accent)}
.lo-plan .jr-btn{width:100%}
.lo-price-sec .lo-fine{margin-top:52px}

/* FAQ: one neutral column of flat rows under a header row (the same header as And Many More and the blog) */
.lo-faq-sec{padding:96px 0}
.lo-faq-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 48px}
.lo-faq-title{display:flex;flex-direction:column;align-items:flex-start;gap:16px;max-width:760px}
.lo-faq-list{margin-top:56px;border-bottom:1px solid var(--rule)}
.lo-qa{border-top:1px solid var(--rule)}
.lo-qa summary{display:flex;align-items:center;justify-content:space-between;gap:32px;min-height:80px;padding:18px 0;list-style:none;font-size:clamp(1.1875rem,1.8vw,1.4375rem);line-height:1.3;font-weight:700;letter-spacing:-0.015em;cursor:pointer}
.lo-qa summary::-webkit-details-marker{display:none}
.lo-qa summary:hover{color:var(--accent-ink)}
.lo-qa summary:focus-visible{outline:2px solid var(--accent-ink);outline-offset:2px;border-radius:8px}
.lo-qa summary svg{flex:none;box-sizing:border-box;width:40px;height:40px;padding:10px;border-radius:50%;background:var(--paper-2);fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;transition:transform 240ms var(--ease)}
.lo-qa[open] summary svg{transform:rotate(45deg);background:var(--tint);color:var(--accent-ink)}
.lo-qa-a{max-width:60ch;margin:0;padding:0 72px 32px 0;color:var(--ink-soft)}
.lo-qa[open] .lo-qa-a{animation:jr-rise 320ms var(--ease) backwards}

/* Roadmap and changelog: a band of its own. It opens with the same header row as the FAQ and the Blog; under it one card holds the changelog, the newest release leading and the two before it stacked beside it. */
.lo-road-sec{padding:64px 0;background:var(--paper-2);scroll-margin-top:96px}
.lo-road-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 48px}
.lo-road-title{display:flex;flex-direction:column;align-items:flex-start;gap:16px;max-width:760px}
.lo-log{--lo-surface:var(--paper);margin-top:48px;padding:8px 32px 32px;border:1px solid var(--rule);border-radius:16px;background:var(--lo-surface)}
.jr.is-dark:not(:has(.jr-theme:checked)) .lo-log,.jr:not(.is-dark):has(.jr-theme:checked) .lo-log{--lo-surface:color-mix(in srgb,var(--paper-2) 94%,#FFFFFF)}
.lo-log-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:0 24px;padding:8px 0;border-bottom:1px solid var(--rule)}
.lo-log-h{font-size:1.25rem;line-height:1.3;font-weight:700;letter-spacing:-0.01em}
.lo-log-list{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);margin:0;padding:0;list-style:none}
.lo-rel{display:flex;flex-direction:column;gap:8px;min-width:0}
.lo-rel:first-child{grid-row:1 / span 2;gap:12px;padding:24px 48px 0 0;border-right:1px solid var(--rule)}
.lo-rel:nth-child(2){padding:24px 0 16px 48px}
.lo-rel:nth-child(3){padding:16px 0 0 48px;border-top:1px solid var(--rule)}
.lo-log-meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;min-height:28px;font-size:0.9375rem;color:var(--ink-soft)}
.lo-log-v{padding:2px 12px;border-radius:999px;background:var(--paper-2);color:var(--ink);font-weight:700;font-variant-numeric:tabular-nums}
.lo-rel:first-child .lo-log-v{background:var(--accent);color:#FFFFFF}
.lo-log-n{font-variant-numeric:tabular-nums}
.lo-log-n::before{content:"\00B7";margin-right:12px}
.lo-log-text{margin:0;font-size:1.0625rem;line-height:1.45;color:var(--ink);text-wrap:balance}
.lo-rel:first-child .lo-log-text{font-size:clamp(1.5rem,2.9vw,2.25rem);line-height:1.2;font-weight:700;letter-spacing:-0.02em}

/* Blog: the newest post leads on the accent across both columns, the next four are two cards per row */
.lo-blog-sec{padding:96px 0;scroll-margin-top:96px}
.lo-blog-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 48px}
.lo-posts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:48px 0 0;padding:0;list-style:none}
.lo-post-li{display:flex}
.lo-post-li:first-child{grid-column:1 / -1}
.lo-post{flex:1;min-width:0;overflow-wrap:anywhere;display:flex;flex-direction:column;gap:12px;padding:24px 28px 28px;border-radius:14px;background:var(--paper-2);color:var(--ink);transition:transform 240ms var(--ease)}
@media (hover:hover){.lo-post:hover{transform:translateY(-4px);box-shadow:var(--sh)}} /* ui-lint: allow hover-lift (owner allows hover motion on transform) */
.lo-post:hover h3{color:var(--accent-ink)}
.lo-post:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.lo-post h3{font-size:clamp(1.25rem,1.7vw,1.5rem);line-height:1.2;font-weight:700;letter-spacing:-0.02em;text-wrap:balance}
.lo-post p{font-size:1rem;line-height:1.5;color:var(--ink-soft)}
.lo-post-meta{order:-1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 12px;font-size:0.9375rem;color:var(--ink-soft)}
.lo-post-cat{padding:1px 10px;border-radius:999px;background:var(--tint);color:var(--accent-ink);font-weight:700}
.lo-post-meta > [aria-hidden]{display:none}
.lo-post--lead{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);grid-template-areas:"meta meta" "title text";column-gap:48px;row-gap:20px;align-items:end;padding:36px 40px 40px;background:var(--accent);color:#FFFFFF}
.lo-post--lead .lo-post-meta{grid-area:meta;justify-content:flex-start;gap:6px 16px;color:var(--lo-on-accent)}
.lo-post--lead .lo-post-cat{background:#FFFFFF;color:#5B21B6}
.lo-post--lead h3,.lo-post--lead:hover h3{grid-area:title;font-size:clamp(1.75rem,3.2vw,2.75rem);line-height:1.08;font-weight:900;letter-spacing:-0.03em;color:#FFFFFF} /* ui-lint: allow weight (Satoshi Black is the display weight in design.md) */
.lo-post--lead p{grid-area:text;font-size:1.125rem;line-height:1.5;color:var(--lo-on-accent)}
.lo-post--lead:focus-visible{outline-color:var(--ink)}

/* CTA: type only, no image, no form */
.lo-cta{padding:112px 0 96px}
.lo-cta-wrap{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);column-gap:64px;align-items:end}
.lo-cta-h{font-size:clamp(3rem,7.2vw,6.5rem);line-height:0.96;font-weight:900;letter-spacing:-0.04em;text-wrap:balance} /* ui-lint: allow weight (Satoshi Black is the display weight in design.md) */
.lo-cta-side{display:flex;flex-direction:column;align-items:flex-start;gap:20px;padding-bottom:8px}
.lo-cta-rate{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;color:var(--ink-soft)}
.lo-cta-rate .jr-star{color:var(--accent-ink);letter-spacing:0.12em}

@media (max-width:1000px){
  .lo-why-sec,.lo-price-sec{padding:96px 0}
  .lo-faq-sec,.lo-blog-sec{padding:72px 0}
  .lo-road-sec{padding:48px 0}
  .lo-why-grid{grid-template-columns:minmax(0,1fr);row-gap:40px}
  .lo-why-grid .lo-head{position:static}
  .lo-plans{grid-template-columns:minmax(0,1fr);margin-top:56px}
  .lo-plan--best{margin-block:0;padding:44px 36px}
  .lo-log-list{grid-template-columns:minmax(0,1fr)}
  .lo-rel:first-child{grid-row:auto;padding:24px 0;border-right:0}
  .lo-rel:nth-child(2),.lo-rel:nth-child(3){padding:24px 0 0;border-top:1px solid var(--rule)}
  .lo-rel:nth-child(2){padding-bottom:24px}
  .lo-post--lead{grid-template-columns:minmax(0,1fr);grid-template-areas:"meta" "title" "text";row-gap:16px;padding:32px 32px 36px}
  .lo-cta{padding:96px 0 72px}
  .lo-cta-wrap{grid-template-columns:minmax(0,1fr);row-gap:40px}
}
@media (max-width:760px){
  #features,#reviews,#why-justread,#pricing,#faq,#cta{scroll-margin-top:24px}
  .lo-why-sec,.lo-price-sec{padding:72px 0}
  .lo-faq-sec,.lo-blog-sec{padding:64px 0}
  .lo-faq-list{margin-top:32px}
  .lo-why-item{padding:28px 0}
  .lo-why-item:first-child{padding-top:0}
  .lo-story{padding-top:28px}
  .lo-plan,.lo-plan--best{padding:28px 24px}
  .lo-price-sec .lo-fine{margin-top:32px}
  .lo-qa summary{min-height:72px;gap:16px;font-size:1.125rem}
  .lo-qa-a{padding:0 0 24px}
  .lo-log{margin-top:32px;padding:8px 20px 24px}
  .lo-rel:first-child{padding:20px 0 24px}
  .lo-posts{grid-template-columns:minmax(0,1fr);gap:12px;margin-top:32px}
  .lo-post{padding:20px 20px 24px}
  .lo-post--lead{padding:24px 20px 28px}
  .lo-cta{padding:72px 0 56px}
}
@media (prefers-reduced-motion:reduce){
  .lo-qa[open] .lo-qa-a{animation:none}
}
@media (forced-colors:active){
  .lo-plan,.lo-log,.lo-post{border:1px solid CanvasText}
  .lo-qa{border-top:1px solid CanvasText}
  .lf-drawer{border-top:1px solid CanvasText}
}

/* Loved by Readers: two endless belts. Three identical sets per belt, the track slides exactly one set, so the strip never shows a gap and never jumps. */
.lw-rev{overflow:hidden;background:var(--paper)}
.lw-belts{display:flex;flex-direction:column;gap:16px;margin-top:48px}
.lw-belt{--w:340;--v:27;overflow:hidden}
.lw-track{display:flex;width:max-content;margin:0;padding:0;animation:lw-run calc(8 * (var(--w) + 16) / var(--v) * 1s) linear infinite;will-change:transform} /* ui-lint: allow loop-motion (the owner asked for an endless reviews strip) */
.lw-belt--rev .lw-track{animation-direction:reverse}
@media (hover:hover){.lw-belts:hover .lw-track{animation-play-state:paused}}
.lw-card{flex:none;display:flex;flex-direction:column;gap:8px;width:calc(var(--w) * 1px);margin-right:16px;padding:24px;border:1px solid var(--rule);border-radius:14px;background:var(--paper)}
.lw-card .jr-star{color:var(--accent-ink);letter-spacing:0.12em}
.lw-card h3{font-size:1.0625rem;line-height:1.3;font-weight:700}
.lw-card p{color:var(--ink-soft)}
.lw-card cite{margin-top:auto;padding-top:4px;font-style:normal;font-weight:700;font-size:0.875rem}
@keyframes lw-run{to{transform:translateX(calc(-100% / 3))}}
@media (max-width:760px){.lw-belt{--w:296;--v:22}}
@media (prefers-reduced-motion:reduce){
.lw-belts{width:min(100% - 96px,1200px);margin-inline:auto}
.lw-track{width:auto;flex-wrap:wrap;gap:16px;animation:none}
.lw-card{flex:1 1 280px;width:auto;margin-right:0}
.lw-clone,.lw-belt--b{display:none}
}
@media (prefers-reduced-motion:reduce) and (max-width:760px){.lw-belts{width:calc(100% - 32px)}}

/* Footer: the live footer. Four columns (Explore is the wide one, a plain two-column list), plain links 28 px apart with no rule and no underline, two closed drawers, the bar with logo, copyright and both makers. */
.lf{padding:72px 0 0;border-top:1px solid var(--rule)}
.lf-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr) minmax(0,1fr) minmax(0,1fr);gap:48px 32px;padding-bottom:56px;border-bottom:1px solid var(--rule)}
.lf-h{margin:0;font-size:0.9375rem;line-height:20px;font-weight:700;color:var(--ink)}
.lf-links{display:flex;flex-direction:column;margin:12px 0 0;padding:0;list-style:none}
.lf-links li{margin:0;break-inside:avoid}
.lf-links a{display:flex;align-items:center;min-height:28px;min-width:44px;font-size:0.9375rem;line-height:20px;color:var(--ink-soft);text-decoration:none;border:0}
.lf-links a:hover,.lf-links a:focus-visible{color:var(--ink);text-decoration:none;border:0}
.lf-col--guides .lf-links{display:block;columns:2;column-gap:32px}
.lf-lang select{width:100%;max-width:220px;min-height:44px;margin-top:12px;padding:0 12px;border:1px solid var(--rule);border-radius:8px;background:var(--paper-2);color:var(--ink);font:inherit;font-size:1rem;cursor:pointer}
.lf-cta{display:inline-flex;align-items:center;gap:6px;min-height:44px;margin-top:8px;font-size:0.9375rem;font-weight:700;line-height:20px;color:var(--ink);text-decoration:none;border:0;overflow-wrap:anywhere}
.lf-cta::after{content:"\2192"}
.lf-cta:hover,.lf-cta:focus-visible{text-decoration:none}
.lf-drawers{display:flex;flex-direction:column}
.lf-drawer{border-bottom:1px solid var(--rule)}
.lf-drawer summary{display:flex;align-items:center;gap:10px;min-height:52px;list-style:none;font-size:0.9375rem;font-weight:700;color:var(--ink-soft);cursor:pointer}
.lf-drawer summary::-webkit-details-marker{display:none}
.lf-drawer summary::before{content:"+";width:14px;font-size:1.25rem;font-weight:500;line-height:1;text-align:center;transition:transform 200ms var(--ease)}
.lf-drawer[open] summary::before{transform:rotate(45deg)}
.lf-drawer summary:hover,.lf-drawer summary:focus-visible{color:var(--ink)}
.lf-drawer > .lf-links{flex-direction:row;flex-wrap:wrap;gap:0 28px;margin:0;padding:0 0 20px}
.lf-badges{display:flex;flex-wrap:wrap;align-items:center;gap:8px 24px;padding:4px 0 24px}
.lf-badges a{display:inline-flex;align-items:center;min-height:44px;font-size:0.9375rem;color:var(--ink-soft);text-decoration:none;border:0;transition:opacity 200ms var(--ease)}
.lf-badges a:has(img){opacity:0.7}
.lf-badges a:hover,.lf-badges a:focus-visible{opacity:1;color:var(--ink);text-decoration:none}
.lf-badges img{height:32px;width:auto}
.lf-badges img[src$="saasbison.png"]{filter:invert(1)}
.lf-badges [class$="-for-light-bg"]{display:none}
.lf-bar{margin-top:0;padding:28px 0 48px;border-top:0}
.lf-id{display:flex;flex-wrap:wrap;align-items:center;gap:8px 20px}
.lf-logo{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:0.9375rem;font-weight:700;letter-spacing:-0.02em;color:var(--ink);text-decoration:none;border:0}
.lf-logo img{width:22px;height:22px;border-radius:6px}
.lf-id p{margin:0;font-size:0.9375rem;color:var(--ink-soft)}
@media (max-width:1000px){
.lf-top{grid-template-columns:repeat(3,minmax(0,1fr))}
.lf-col--guides{grid-column:span 2}
}
@media (max-width:760px){
.lf{padding:56px 0 0}
.lf-top{grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 16px;padding-bottom:40px}
.lf-col--guides{grid-column:1 / -1}
.lf-bar{flex-direction:column;align-items:flex-start;padding:24px 0 40px}
}
@media (max-width:480px){
.lf-top{grid-template-columns:minmax(0,1fr)}
}


/* The canvas board set this in its own wrapper; the live page needs it on the body */
body{margin:0}
/* Touch: footer link rows grow to a 44px target where a finger is the pointer; the desktop rhythm stays the canvas one */
@media (max-width:1024px),(pointer:coarse){.lf-links a{min-height:44px}}
/* Consent: common.js shows the bar (display:flex) only for a visitor who has not answered yet */
#cookie-consent-container{display:none}

/* Image viewer: a click on a screenshot opens it large over the blurred page (static/js/lightbox.js, a native modal dialog) */
[data-zoom]{cursor:zoom-in}
html:has(.jr-lb[open]){overflow:hidden}
.jr-lb{position:fixed;inset:0;box-sizing:border-box;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:64px 16px;border:0;background:transparent;overflow:hidden;opacity:0;touch-action:pinch-zoom;transition:opacity 200ms ease,display 200ms allow-discrete,overlay 200ms allow-discrete}
.jr-lb[open]{display:flex;align-items:center;justify-content:center;opacity:1}
/* ui-lint: allow glass */
.jr-lb::backdrop{background:rgba(8,9,12,0);backdrop-filter:blur(0);-webkit-backdrop-filter:blur(0);transition:background-color 200ms ease,backdrop-filter 200ms ease,display 200ms allow-discrete,overlay 200ms allow-discrete}
/* ui-lint: allow glass */
.jr-lb[open]::backdrop{background:rgba(8,9,12,0.62);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
@starting-style{.jr-lb[open]{opacity:0}}
/* ui-lint: allow glass */
@starting-style{.jr-lb[open]::backdrop{background:rgba(8,9,12,0);backdrop-filter:blur(0);-webkit-backdrop-filter:blur(0)}}
.jr-lb-img{display:block;flex:none;max-width:100%;max-height:100%;object-fit:contain}
.jr-lb-close{position:absolute;top:12px;right:12px;display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,0.2);color:#fff;cursor:pointer;transition:background-color 160ms ease}
.jr-lb-close:hover{background:rgba(255,255,255,0.32)}
.jr-lb-close:focus-visible{outline:2px solid #fff;outline-offset:2px}
.jr-lb-close svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
@media (prefers-reduced-motion:reduce){.jr-lb,.jr-lb::backdrop,.jr-lb-close{transition:none}}