/* OKHBOT V2.6.22 | One public shell for ALL marketing pages.
   Approved homepage is the design source of truth for headers, background, layout and footer.
   Workspaces keep their existing independent layout and prototype-role tools. */
.ok22-public-site{
  --ok22-paper:#faf9ff;
  --ok22-canvas:#f7f6ff;
  --ok22-ink:#20203d;
  --ok22-violet:#6656e9;
  --ok22-content:1280px;
  --ok22-gutter:72px;
  background:var(--ok22-paper);
  color:var(--ok22-ink);
}
/* Every page, including the footer and header, uses the homepage 1280px geometry. */
.ok22-public-site .wrap,
body.ok17-public-active .ok22-public-site .wrap,
.ok22-public-site .ok20-hero-grid,
.ok22-public-site .ok21-hero-grid{
  width:min(var(--ok22-content),calc(100% - var(--ok22-gutter)));
  max-width:none;
  margin-inline:auto;
}
.ok22-public-site .ok265-home{background:var(--ok22-paper)}
.ok22-public-site .ok265-home>.header{
  height:auto;
  position:sticky;
  top:0;
  z-index:40;
  background:transparent;
  border:0;
  border-bottom:1px solid rgba(107,105,176,.10);
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  transition:background .3s,box-shadow .3s,border-color .3s,backdrop-filter .3s;
}
.ok22-public-site .ok265-home>.header .header-inner{
  height:84px;
  min-height:0;
  transition:height .3s;
}
.ok22-public-site .ok265-home>.header .desktop-links{gap:30px}
.ok22-public-site .ok265-home>.header .desktop-links a{font-size:16px;font-weight:800}
.ok22-public-site .ok265-home>.header .brand img{max-height:58px;object-fit:contain}
.ok22-public-site .ok265-home>.header .header-actions .btn{
  background:var(--ok22-violet);
  border-color:var(--ok22-violet);
  border-radius:12px;
}
body.ok264-scrolled .ok22-public-site .ok265-home>.header,
body.ok17-public-active.ok264-scrolled .ok22-public-site .ok265-home>.header{
  background:rgba(250,250,255,.94);
  border-bottom-color:rgba(107,105,176,.1);
  box-shadow:0 5px 26px rgba(40,40,80,.055);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
body.ok264-scrolled .ok22-public-site .ok265-home>.header .header-inner{height:67px}
/* Public pages truly share the homepage animated top canvas, not an isolated hero surface. */
.ok22-public-site .ok22-public-frame>.ok261-public-page,
.ok22-public-site .ok22-public-frame>.ok17-designers-page,
.ok22-public-site .ok22-public-frame>.ok17-simple-page{
  position:relative;
  z-index:1;
  background:transparent;
}
.ok22-public-site .ok22-public-frame .ok20-design-hero,
.ok22-public-site .ok22-public-frame .ok21-hero{
  background:transparent;
}
.ok22-public-site .ok22-public-frame .ok20-design-hero{min-height:610px}
.ok22-public-site .ok22-public-frame .ok21-hero{min-height:610px}
/* Public sections follow the homepage edge spacing and consistent neutral surfaces. */
.ok22-public-site .ok20-design-types,
.ok22-public-site .ok21-steps,
.ok22-public-site .ok21-template-section{
  background:var(--ok22-canvas);
}
.ok22-public-site .ok20-portfolio,
.ok22-public-site .ok21-pricing,
.ok22-public-site .ok21-faq,
.ok22-public-site .ok20-faq{
  background:var(--ok22-paper);
}
.ok22-public-site .ok20-pricing,
.ok22-public-site .ok21-showroom{
  background:linear-gradient(180deg,#f7f6ff,#f3f1ff);
}
.ok22-public-site :is(.ok20-design-types,.ok20-portfolio,.ok20-pricing,.ok20-faq,.ok21-steps,.ok21-showroom,.ok21-template-section,.ok21-pricing,.ok21-faq){
  padding-block:86px;
}
/* Exact same footer structure, width, and color from home through secondary pages. */
.ok22-public-site>.footer,
body.ok17-public-active .ok22-public-site>.footer,
body.ok264-home-active .ok22-public-site>.footer{
  background:linear-gradient(180deg,#f8f6ff 0%,#f1effe 100%);
  border:0;
  padding:55px 0 20px;
  margin:0;
  width:100%;
}
.ok22-public-site>.footer .footer-grid{grid-template-columns:2fr 1fr 1fr;gap:65px}
.ok22-public-site>.footer .foot-bottom{margin-top:30px;padding-top:18px;border-top:1px solid #e2dff3}
/* No prototype toolbar should exist at all on a marketing URL. */
.ok22-public-site>.prototype-rail{display:none!important}
@media(max-width:900px){
 .ok22-public-site{--ok22-gutter:48px}
 .ok22-public-site :is(.ok20-design-types,.ok20-portfolio,.ok20-pricing,.ok20-faq,.ok21-steps,.ok21-showroom,.ok21-template-section,.ok21-pricing,.ok21-faq){padding-block:72px}
}
@media(max-width:760px){
 .ok22-public-site .ok265-home>.header .header-inner{height:70px}
 body.ok264-scrolled .ok22-public-site .ok265-home>.header .header-inner{height:66px}
 .ok22-public-site .ok265-home>.header .desktop-links{display:none}
 .ok22-public-site>.footer .footer-grid{grid-template-columns:1fr 1fr;gap:20px}
 .ok22-public-site>.footer .foot-bottom{flex-direction:column}
}
@media(max-width:480px){
 .ok22-public-site{--ok22-gutter:32px}
 .ok22-public-site :is(.ok20-design-types,.ok20-portfolio,.ok20-pricing,.ok20-faq,.ok21-steps,.ok21-showroom,.ok21-template-section,.ok21-pricing,.ok21-faq){padding-block:58px}
 .ok22-public-site>.footer{padding:42px 0 20px}
}
@media(prefers-reduced-motion:reduce){
 .ok22-public-site .ok265-home>.header .header-inner{transition:none}
}