/* BitStream Visual 2.3.3 — keep the 2.3 features, restore the cleaner 2.2 visual rhythm. */
:root{--public-pad:clamp(18px,4vw,72px);--public-mobile-pad:16px}
.site-main,.page-ad-layout,.page-content{min-width:0;width:100%;max-width:100%}
.page-ad-layout{display:block!important;position:relative;grid-template-columns:none!important;grid-template-areas:none!important;overflow:visible}
.page-content{display:block!important;min-width:0}
.ad-rail{display:none!important;position:absolute;top:0;width:var(--ad-side);min-width:0;padding-top:58px!important;z-index:3}
.ad-rail-left{left:0}.ad-rail-right{right:0}
.ad-rail .ad-card{display:flex!important;flex-direction:column;gap:0;margin:18px 0!important;padding:0!important;word-break:break-word;overflow:hidden;width:100%;box-sizing:border-box;border:0!important}
.ad-rail .ad-card>img{display:block;width:100%!important;height:var(--ad-side-height,600px)!important;max-height:none!important;object-fit:cover;border-radius:0!important}
.ad-rail .ad-card>div{padding:12px;min-width:0}
.ad-rail .google-ad-host{margin:18px 0!important;overflow:visible;width:100%;min-height:var(--ad-side-height,600px);box-sizing:border-box}
.ad-rail .google-ad-host ins{display:block!important;width:100%!important;max-width:100%!important;min-height:var(--ad-side-height,600px)!important}
.google-ad-host:empty{display:none!important}.inline-ad-area:has(.google-ad-host:empty):not(:has(.ad-card)){display:none!important}

/* One consistent public gutter fixes the old header/logo misalignment. */
body:not(.editor-page) .site-header{padding-left:var(--public-pad)!important;padding-right:var(--public-pad)!important}
body:not(.editor-page) .hero,
body:not(.editor-page) .section,
body:not(.editor-page) .feature-grid,
body:not(.editor-page) .page-head,
body:not(.editor-page) .site-footer{padding-left:var(--public-pad)!important;padding-right:var(--public-pad)!important}
body:not(.editor-page) .compact-footer{padding-left:var(--public-pad)!important;padding-right:var(--public-pad)!important}
.about-head{max-width:none!important;width:100%!important;margin:0!important}
.about-head>p{max-width:780px}

/* 2.2 typography/card behavior remains the default on public pages. */
body:not(.editor-page) .section-title h2{font-size:1.5em;letter-spacing:normal;color:var(--ink);margin:0}
body:not(.editor-page) .section-title p{color:var(--muted)}
body:not(.editor-page) .template-card{display:grid;min-width:0}
body:not(.editor-page) .cards>*{min-width:0}
body:not(.editor-page) .tool-directory-grid>a,
body:not(.editor-page) .learning-card,
body:not(.editor-page) .about-story-card,
body:not(.editor-page) .person-card{min-width:0;overflow-wrap:anywhere}
body:not(.editor-page) img,body:not(.editor-page) video{max-width:100%}
.tool-directory-grid>a{padding:16px!important}
.tool-directory>section{margin-bottom:34px!important}
.compact-page-head{padding-top:46px!important;padding-bottom:28px!important}

/* Side ads use the outer desktop space; they never squeeze or overflow the page on smaller screens. */
@media(min-width:1700px){
  .page-ad-layout.has-left{padding-left:calc(var(--ad-side) + var(--ad-gap))}
  .page-ad-layout.has-right{padding-right:calc(var(--ad-side) + var(--ad-gap))}
  .page-ad-layout.has-left .ad-rail-left,.page-ad-layout.has-right .ad-rail-right{display:block!important}
  body.side-ad-left-active:not(.editor-page) .site-header{padding-left:calc(var(--public-pad) + var(--ad-side) + var(--ad-gap))!important}
  body.side-ad-right-active:not(.editor-page) .site-header{padding-right:calc(var(--public-pad) + var(--ad-side) + var(--ad-gap))!important}
}

/* Workspace ads are floating/dismissible only; they reserve zero layout width. */
.workspace-ad-popup{position:fixed;left:50%;transform:translateX(-50%);z-index:115;width:min(640px,calc(100vw - 32px));display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid #d7e2ef;border-radius:15px;background:#fff;box-shadow:0 18px 55px rgba(15,23,42,.22);color:#0f172a}
.workspace-ad-popup.workspace-ad-top{top:82px}.workspace-ad-popup.workspace-ad-bottom{bottom:20px}
.has-running-header .workspace-ad-popup.workspace-ad-top{top:110px}.has-running-footer .workspace-ad-popup.workspace-ad-bottom{bottom:48px}
.workspace-ad-popup>img{width:72px;height:54px;object-fit:cover;border-radius:9px;flex:0 0 auto}
.workspace-ad-copy{display:grid;gap:2px;min-width:0;flex:1}.workspace-ad-copy small{font-size:9px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#c2410c}.workspace-ad-copy b{font-size:12px}.workspace-ad-copy span{font-size:10px;line-height:1.45;color:#64748b;overflow-wrap:anywhere}
.workspace-ad-close{position:absolute;right:6px;top:5px;width:26px;height:26px;border:0;border-radius:50%;background:#eef2f7;color:#475569;font-size:18px;line-height:1;cursor:pointer}.workspace-ad-popup>.btn{margin-right:24px;flex:0 0 auto}
html[data-theme="dark"] .workspace-ad-popup{background:#101c2e;border-color:#2a3e59;color:#eef5ff}html[data-theme="dark"] .workspace-ad-copy span{color:#9fb3ce}

/* Responsive safety: no horizontal page overflow and no cramped two-column directories. */
@media(max-width:1100px){.tool-directory-grid{grid-template-columns:1fr!important}.learning-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:860px){body:not(.editor-page) .site-header{gap:16px}.site-header nav{display:none!important}.header-actions{margin-left:auto}.brand span{white-space:nowrap}}
@media(max-width:700px){
  :root{--public-pad:var(--public-mobile-pad)}
  body:not(.editor-page) .site-header{padding-left:var(--public-mobile-pad)!important;padding-right:var(--public-mobile-pad)!important}
  body:not(.editor-page) .hero,body:not(.editor-page) .section,body:not(.editor-page) .feature-grid,body:not(.editor-page) .page-head,body:not(.editor-page) .site-footer{padding-left:var(--public-mobile-pad)!important;padding-right:var(--public-mobile-pad)!important}
  .learning-grid{grid-template-columns:1fr!important}.tool-directory-grid{grid-template-columns:1fr!important}
  .workspace-ad-popup{align-items:flex-start;flex-wrap:wrap;padding:12px}.workspace-ad-popup>img{width:58px;height:46px}.workspace-ad-popup>.btn{margin-right:28px;margin-left:auto}
  .page-head h1,.compact-page-head h1{font-size:clamp(30px,9vw,40px)!important}
}

.template-library-title{margin:28px 0 14px}.tool-thumb-v22{display:grid;place-items:center;align-content:center;gap:8px;background:linear-gradient(145deg,#f8fbff,var(--tool-color,#eef4ff));color:#24415f;text-align:center;overflow:hidden}.tool-thumb-v22 span{font-size:34px;line-height:1}.tool-thumb-v22 b{font-size:11px;padding:0 10px}.pricing-cards-compact .price{min-width:0}.learning-grid{margin-top:18px;margin-bottom:22px}.learning-card-copy{min-width:0}


/* Center public user authentication cards within their available container. */
body.visual-public-body:not(.cms-body) .modern-auth-shell {
  grid-template-columns: minmax(0, 1fr);
}
body.visual-public-body:not(.cms-body) .modern-auth-shell > .auth-card {
  width: min(500px, 100%);
  min-width: 0;
  margin-inline: auto;
}
@media (max-width: 600px) {
  body.visual-public-body:not(.cms-body) .modern-auth-shell {
    padding: 24px 0;
  }
  body.visual-public-body:not(.cms-body) .modern-auth-shell > .auth-card {
    padding: 24px 20px;
  }
}