/* Public pages share the homepage vocabulary, with task-specific compositions. */
.public-flow main { overflow: clip; }
.public-flow .container { max-width: 1180px; }
.public-flow main > section { border: 0; background: transparent; padding-block: clamp(2.5rem,6vw,5.5rem); }
.public-flow .section-bridge { display: none; }
.public-flow h1,.public-flow h2 { font-weight: 500; letter-spacing: -.05em; }
.public-flow .page-intro h1 { font-size: clamp(2.65rem,5.2vw,4.65rem); line-height: 1.04; max-width: 17ch; }
.public-flow h2 { font-size: clamp(2rem,3.4vw,3.1rem); line-height: 1.1; }
.public-flow .lede { font-size: 1.1rem; line-height: 1.65; max-width: 36rem; }
.public-flow .label { letter-spacing: .09em; font-size: .72rem; }
.public-flow .btn { border-radius: 100px; padding-inline: 1.5rem; min-height: 46px; }
.public-flow .btn-secondary { border-color: transparent; background: transparent; text-decoration: underline; text-underline-offset: 5px; padding-inline: .3rem; }
.public-flow .hero-actions { gap: 1.2rem; }
.public-flow .hero-aside { border: 0; padding: 0; margin-top: 1.5rem; }
.public-flow a:focus-visible,.public-flow button:focus-visible,.public-flow summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; }
.public-icon { width: 36px; height: 36px; color: var(--accent); flex-shrink: 0; }
.public-accent { color: var(--accent); }
.public-split { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(2rem,6vw,5rem); align-items: center; }
.public-flow .section-head { max-width: 48rem; margin-bottom: 2.5rem; }
.public-flow .prose { max-width: 40rem; }
.public-flow .prose p { line-height: 1.75; }
.public-flow .qa { max-width: 45rem; }
.public-flow .qa details { border-color: var(--rule); }
.public-flow .qa summary { padding-block: 1.15rem; }
.public-flow .public-close { background: radial-gradient(ellipse at 75% 40%,#e8eaff88,transparent 65%); padding-block: 4rem 5rem; }
.public-close h2 { max-width: 21ch; }
.public-close .lede { margin-block: 1.25rem; }
.public-flow .masthead .btn { min-height: 40px; }
/* An explicit illustration: readable without motion, no simulated live status. */
.preview-illustration { margin: 0; padding: 2rem 1rem; position: relative; }
.preview-illustration::before { content:''; position:absolute; inset:-10%; background:radial-gradient(ellipse,#e4e7ff,transparent 68%); z-index:-1; }
.preview-sheet { background: white; padding: 2rem; border-radius: 18px; box-shadow: 0 20px 55px #2728480d; }
.preview-sheet .public-icon { width: 44px; height: 44px; }
.preview-sheet h3 { font-size: 1.7rem; font-weight:500; letter-spacing:-.04em; margin: 1.5rem 0 .6rem; }
.preview-sheet p { font-size:.9rem; color:var(--muted); margin:0; }
.preview-approval { display:flex; align-items:center; gap:.8rem; margin:1.2rem 0 0 2rem; background:var(--paper); border-radius:12px; padding:1rem; font-size:.85rem; }
.preview-illustration figcaption { font-size:.72rem; color:var(--muted); margin-top:1rem; }
.public-flow .flow-steps { display:block; max-width:54rem; margin:0 auto; counter-reset: none; }
.public-flow .fstep { position:relative; border:0; border-radius:0; background:none; box-shadow:none; padding:0 0 3rem 5.5rem; margin:0; min-height:0; }
.public-flow .fstep:last-child { padding-bottom:0; }
.public-flow .fstep::before { display:none; }
.public-flow .fstep:not(:last-child)::after { content:''; position:absolute; left:1.1rem; top:3.1rem; bottom:.8rem; width:1px; background:linear-gradient(#414bff66,#414bff15); transform-origin:top; }
.public-flow .fstep > .public-icon { position:absolute; left:0; top:0; }
.public-flow .fstep-n { position:static; display:inline; font-size:.7rem; margin-right:.65rem; color:var(--accent); }
.public-flow .fstep-who { display:inline; font-size:.7rem; letter-spacing:.08em; }
.public-flow .fstep h3 { font-size:1.5rem; font-weight:500; letter-spacing:-.025em; margin:.8rem 0; }
.public-flow .fstep p { max-width:38rem; line-height:1.7; }
.public-flow .fstep.reveal { opacity:1; transform:none; }
.public-flow .service-groups { display:flex; gap:2.5rem; }
.public-flow .service-groups > article { flex:1; border:0; padding:0; background:none; }
.public-flow .service-groups h3 { margin:1rem 0 .7rem; font-size:1.15rem; }
.public-flow .service-groups p { font-size:.95rem; line-height:1.65; }
.public-benefits { display:grid; grid-template-columns:1fr 1fr; gap:2.5rem 4rem; }
.public-benefits h3 { margin:1rem 0 .7rem; font-size:1.15rem; }
.public-benefits p { font-size:.95rem; line-height:1.7; }
.public-flow .pricing-intro .price-rows { max-width:none; margin:0; gap:1.5rem; }
.public-flow .pricing-intro .price-row { border:0; padding:0; }
.public-flow .pricing-intro .price-figure { font-size:clamp(3rem,5.5vw,4.5rem); font-weight:500; letter-spacing:-.06em; }
.public-price-panel { padding:2rem 0; }
.public-price-panel .note { font-size:.85rem; line-height:1.65; margin-top:1.8rem; }
.public-price-panel .hero-actions { margin-top:1.5rem; }
.public-flow .public-pricing-details { display:grid; grid-template-columns:.8fr 1.2fr; gap:3rem; align-items:start; }
.public-pricing-details h2 { max-width:17ch; }
/* Example websites keep their own identities; the gallery is an editorial frame. */
.public-examples main > .hero { padding-bottom:2rem; }
.public-examples main > .public-gallery { padding-top:0; }
.public-flow .example-list { display:grid; gap:5rem; }
.example-entry { display:grid; grid-template-columns:1.4fr .8fr; gap:3rem; align-items:center; }
.example-entry:nth-child(even) { grid-template-columns:.8fr 1.4fr; }
.example-entry:nth-child(even) .example-visual { order:2; }
.example-entry h2 { font-size:clamp(1.8rem,3vw,2.7rem); }
.example-entry .work-frame { aspect-ratio:1.35; border:0; border-radius:14px; box-shadow:0 16px 40px #2222220c; }
.example-entry .work-item { display:block; }
.example-entry p { font-size:.95rem; line-height:1.7; }
.example-entry .example-caption { display:block; color:var(--muted); font-size:.72rem; margin-top:.8rem; }
.example-entry .example-links { display:flex; flex-direction:column; align-items:start; gap:.6rem; margin-top:1.3rem; }
.example-links a { min-height:44px; display:inline-flex; align-items:center; text-underline-offset:5px; }
.public-founder { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center; }
.founder-signature { padding:2rem 0; }
.founder-signature .public-icon { width:50px; height:50px; margin-bottom:1.5rem; }
.public-help-actions { display:flex; flex-direction:column; gap:1.5rem; }
.public-help-actions a { display:flex; gap:1rem; align-items:center; text-decoration:none; min-height:64px; }
.public-help-actions strong { display:block; font-size:1.1rem; font-weight:500; }
.public-help-actions small { display:block; color:var(--muted); font-size:.85rem; margin-top:.35rem; }
.public-help-actions a:hover strong { text-decoration:underline; text-underline-offset:5px; }
.urgent-contact { margin-top:2rem; border-left:2px solid var(--accent); padding-left:1rem; font-size:.9rem; }
.public-flow .help-search :is(input,button) { border-radius:12px; }
.public-flow .help-search button { border-radius:100px; }
.public-flow .topic-heading { display:flex; gap:.8rem; align-items:center; }
.public-flow .kb-list { max-width:48rem; }
.public-flow.public-document main > section { padding-block:2rem; }
.public-document .hero h1 { font-weight:500; }
.public-document .container { max-width:1000px; }
.public-document .prose,.public-document .kb-body { max-width:42rem; }
.public-trade .trade-hero-photo { width:100%; height:auto; aspect-ratio:1.12; object-fit:cover; border-radius:45% 45% 12px 12px; }
.public-trade .trade-points { display:grid; grid-template-columns:repeat(3,1fr); gap:2.5rem; }
.trade-points > div { border:0; padding:0; }
.trade-points dt { margin:1rem 0 .6rem; font-size:1.2rem; font-weight:500; }
.trade-points dd { margin:0; font-size:.95rem; line-height:1.7; }
.public-flow .sales-flow { max-width:48rem; padding-top:2rem; }
.public-flow .sales-flow h1 { font-size:clamp(2.4rem,4vw,3.4rem); margin:.8rem 0 1rem; font-weight:500; }
.public-flow .sales-flow .lede { font-size:1rem; line-height:1.5; }
.public-flow .sales-flow > p { font-size:.9rem; }
.public-flow .sales-flow form { margin-top:1.5rem; }
.public-flow .sales-flow input:not([type=checkbox]),.public-flow .sales-flow textarea { border-radius:10px; background:#fff; }
.public-flow .sales-flow label { margin:.8rem 0; }
.public-flow .sales-flow .label { color:var(--accent); }
.public-flow .sales-flow legend { font-weight:500; }
.public-flow .sales-flow fieldset { margin-top:1rem; }
.public-flow .sales-flow > details { font-size:.9rem; }
@media(prefers-reduced-motion:no-preference) {
 .flow-playing .preview-sheet { animation: public-arrive .7s both; }
 .flow-playing .preview-approval { animation: public-arrive .7s .7s both; }
 .public-flow .flow-playing .fstep::after { animation:public-connect .8s both; }
}
@keyframes public-arrive { from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none} }
@keyframes public-connect { from{transform:scaleY(0)}to{transform:scaleY(1)} }
@media(max-width:52rem) {
 .public-split,.public-founder,.public-flow .public-pricing-details { grid-template-columns:1fr; gap:2rem; }
 .preview-illustration { max-width:34rem; }
 .public-price-panel { padding-top:0; }
 .example-entry,.example-entry:nth-child(even) { grid-template-columns:1.2fr 1fr; gap:2rem; }
 .public-flow .service-groups { gap:1.5rem; }
 .public-trade .trade-points { grid-template-columns:1fr 1fr; }
}
@media(max-width:40rem) {
 .public-flow main > section { padding-block:2.5rem; }
 .public-flow .page-intro h1 { font-size:clamp(2.4rem,10.5vw,3.4rem); }
 .public-flow .lede { font-size:1rem; }
 .public-flow .fstep { padding-left:3.5rem; }
 .public-flow .fstep h3 { font-size:1.25rem; }
 .public-flow .fstep p { font-size:.9rem; }
 .public-flow .service-groups { display:grid; gap:2rem; }
 .public-benefits { gap:2rem 1.25rem; }
 .public-benefits h3 { font-size:1.05rem; }
 .example-entry,.example-entry:nth-child(even) { grid-template-columns:1fr; gap:1.3rem; }
 .example-entry:nth-child(even) .example-visual { order:0; }
 .public-flow .example-list { gap:3rem; }
 .public-examples .page-intro h1 { max-width:14ch; }
 .public-trade .trade-points { grid-template-columns:1fr; }
 .public-flow .sales-flow { padding-top:1.25rem; }
 .public-flow .sales-flow h1 { font-size:2.3rem; }
 .public-flow .sales-flow form { margin-top:1rem; }
 .public-flow .footer { padding-bottom:6rem; }
}
@media(prefers-reduced-motion:reduce) { .public-flow *, .public-flow *::after { animation:none!important; transition:none!important; } }