/* Readable homepage copy and consistent space between headings and text. */
:root{--muted:#526575}
.section h2{margin:0 0 1.4rem;line-height:1.1}
.section-head>p{margin-top:0;line-height:1.75}
.section-head{margin-bottom:2.5rem}
.feature p,.feature ul,.price-card>p,.price-card li,.use-list p,.step p{line-height:1.7}
.feature ul{font-size:14px}
.feature h3{line-height:1.4;margin-bottom:1rem}
.feature p{margin-top:0}
.feature ul{margin-top:1.5rem}
.feature li{margin:.55rem 0}
.feature .icon{margin-bottom:1.5rem}
.feature-board span,.extras,.wiki-sample{font-size:14px;line-height:1.6}
.feature-board b{margin-top:.35rem}
.extras span{padding:.55rem .9rem}
.step{padding:20px 18px;margin-bottom:12px}
.step strong{line-height:1.45;margin-bottom:10px}
.demo-row{padding:20px 18px;line-height:1.6}
.demo-row small{font-size:14px;margin-top:6px}
.stage-title span,.stage-note,.demo-bottom,.demo-bottom small{font-size:14px;line-height:1.65}
.status{font-size:12px;padding:5px 9px}
.mini-tabs div{font-size:14px;line-height:1.5}
.mini-tabs strong{font-size:17px;margin-top:6px}
.demo-bottom .fake-btn{font-size:13px;padding:9px 12px}
.use-list{gap:30px 26px}
.use-list article{padding-top:20px}
.use-list h3{line-height:1.4;margin-bottom:14px}
.use-list p{margin-top:0}
.audience .wrap>div>p{line-height:1.75}
.pricing-head>div>p{line-height:1.7}
.price-card h3{margin:14px 0 18px;line-height:1.4}
.price-card>p{min-height:82px}
.price-meta,.price span,.pricing-note{font-size:15px;line-height:1.65}
.price-meta{min-height:50px;margin-top:10px}
.price{margin-top:28px}
.price strong{margin-right:6px}
.price-card li{margin:10px 0}
.price-card ul{margin-top:24px}
.billing-toggle button{font-size:15px}
.plan{font-size:13px}
.tag{font-size:11px}
.pricing-note{margin-top:28px}
.faq-intro{line-height:1.7;margin-top:0;margin-bottom:32px}
.faq summary{line-height:1.5}
.faq details p{margin-top:18px;line-height:1.75}
.contact-intro p{line-height:1.75;margin-top:20px}
.contact-form label,.contact-form input,.contact-form textarea,.contact-form .consent{line-height:1.6}
.contact-form label{gap:8px}
footer,.footer-legal a,footer a{font-size:14px;line-height:1.65}
#tok-prace .flow-toolbar{font-size:13px;line-height:1.6;flex-wrap:wrap;letter-spacing:.06em}
#tok-prace .flow-toolbar button{font-size:14px;padding:8px 12px}
#tok-prace .flow-controls button{padding:20px 8px}
#tok-prace .flow-controls button span{font-size:13px}
#tok-prace .flow-explanation{padding:28px 30px 14px;min-height:130px}
#tok-prace .flow-explanation strong{line-height:1.5}
#tok-prace .flow-explanation p{line-height:1.75;margin-top:16px;max-width:850px}
#tok-prace .flow-footnote{font-size:14px;line-height:1.7;color:#52684a;padding-top:18px}
#tok-prace .node-sub{font-size:11px;fill:#52684a}
#tok-prace .node-value{font-size:11px;fill:#44643a}
#tok-prace .return-label{font-size:11px;fill:#52684a}
#tok-prace .flow-toolbar{color:#52684a}
#tok-prace .flow-controls button{color:#52684a}
#tok-prace .input text,#tok-prace .node-number,#tok-prace .connector-label{fill:#52684a}
footer .wrap{gap:24px;align-items:flex-start}
footer .wrap>div{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:12px 20px;max-width:760px}
footer .wrap>div a{margin:0}
@media(max-width:700px){footer .wrap>div{justify-content:flex-start}}
@media(max-width:760px){
 .section h2{margin-bottom:1.2rem;line-height:1.12}
 .price-card>p{min-height:0}
 .price-meta{min-height:0}
 .demo-row{align-items:flex-start;flex-wrap:wrap;gap:10px}
 .stage-title{flex-wrap:wrap}
 .mini-tabs{grid-template-columns:1fr}
 .use-list{gap:26px 20px}
 #tok-prace .flow-toolbar{font-size:12px;letter-spacing:.03em}
 #tok-prace .flow-explanation{padding:24px 18px 10px}
 #tok-prace .flow-controls button{font-size:14px}
 #tok-prace .flow-controls button span{font-size:12px}
 #tok-prace .flow-footnote{font-size:14px}
}
@media(max-width:760px){.feature-grid{grid-template-columns:minmax(0,1fr)}.feature.wide{grid-column:auto;grid-template-columns:minmax(0,1fr)}.feature,.wiki-sample{min-width:0}}

/* Contact has its own space between site navigation and account actions. */
.nav{grid-template-columns:minmax(145px,1fr) auto minmax(150px,.7fr) auto}
.nav-actions{gap:20px}
.nav-contact{justify-self:center;white-space:nowrap;font-size:.9rem;font-weight:600}
.nav nav .nav-contact-mobile{display:none}
@media(max-width:1100px){.nav{grid-template-columns:1fr auto auto;column-gap:32px}}
@media(max-width:700px){.nav{grid-template-columns:1fr auto;column-gap:12px}.nav-contact{display:none}.nav nav .nav-contact-mobile{display:block}}

/* Visible entry points to the practical guides and real demo screenshots. */
.practice-guides h2{font-size:clamp(28px,2.4vw,38px);line-height:1.25;letter-spacing:-.025em;margin:16px 0 20px;max-width:850px}
.practice-intro{font-size:18px;line-height:1.7;max-width:850px;margin:0 0 32px;color:var(--muted)}
.practice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.practice-card{display:flex;flex-direction:column;min-width:0;border:1px solid var(--line);border-radius:18px;overflow:hidden;text-decoration:none;color:var(--ink);background:white;transition:border-color .2s}
.practice-card:hover{border-color:var(--green)}
.practice-card:focus-visible{outline:3px solid var(--green);outline-offset:5px}
.practice-card img{display:block;width:100%;height:auto;border-bottom:1px solid var(--line)}
.practice-copy{display:flex;flex-direction:column;flex:1;padding:26px}
.practice-copy h3{font-size:23px;line-height:1.35;margin:0 0 16px}
.practice-copy p{font-size:17px;line-height:1.7;margin:0 0 24px;color:var(--muted)}
.practice-more{font-size:16px;line-height:1.5;font-weight:700;color:var(--green);margin-top:auto}
.practice-note{font-size:15px;line-height:1.7;color:var(--muted);margin:24px 0 0}
@media(max-width:850px){.practice-grid{grid-template-columns:1fr}.practice-copy{padding:24px}.practice-card img{max-height:none}}