/* Public website contract. Composition stays with each page; these roles, paper,
   chrome and controls are shared with the server-rendered Journal. */
@import './fonts.css';
@font-face{font-family:'IBM Plex Mono';src:url('/blog/assets/fonts/journal-mono.woff2') format('woff2');font-weight:400 500;font-style:normal;font-display:swap}
.marketing-site,body:has(.journal-root){
  --site-font:'Satoshi',Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --site-mono:'IBM Plex Mono',monospace;
  --site-h1:clamp(42px,5.4vw,76px);--site-h2:clamp(30px,3.9vw,52px);
  --site-h3:clamp(23px,2.2vw,30px);--site-h4:21px;--site-h5:18px;
  --site-body:18px;--site-lead:20px;--site-small:14px;--site-caption:12px;--site-eyebrow:11px;
  --site-ink:#0f0f10;--site-secondary:#2b2d31;--site-muted:#62666d;
  --site-paper:#fff;--site-surface:#f4f5f6;--site-border:rgba(15,15,16,.12);
  --site-nav:rgba(255,255,255,.9);--site-grid:rgba(15,15,16,.024);
  --site-wash:linear-gradient(135deg,#fff 0%,#f8f8f6 52%,#f1f1ef 100%);
  --site-texture:url('/marketing/media/7c1d89ffcff0a31c.webp');--site-paper-shade:linear-gradient(transparent,transparent);
  --font:var(--site-font);--mono:var(--site-mono);--ink:var(--site-ink);--gray:var(--site-muted);
  --paper:var(--site-paper);--paper-2:var(--site-surface);--line:var(--site-border);--line-2:var(--site-border);
  --ease:cubic-bezier(.22,.9,.24,1);
  font-family:var(--site-font);color:var(--site-ink);font-size:var(--site-body);line-height:1.65;
}
html[data-journal-theme=dark] :is(.marketing-site,body:has(.journal-root)){
  --site-ink:#f4f4f1;--site-secondary:#d6d6d2;--site-muted:#aaaab0;
  --site-paper:#0e0e0e;--site-surface:#1a1a1a;--site-border:#303030;
  --site-nav:rgba(14,14,14,.9);--site-grid:rgba(255,255,255,.035);
  --site-wash:linear-gradient(135deg,#111 0%,#161615 52%,#1d1d1b 100%);
  --site-paper-shade:linear-gradient(rgba(14,14,14,.94),rgba(14,14,14,.94));
  color-scheme:dark;
}
body.marketing-site,body:has(.journal-root){margin:0;position:relative;isolation:isolate;background-color:var(--site-paper);background-image:var(--site-paper-shade),var(--site-texture);background-position:center;background-size:cover;background-attachment:fixed;background-repeat:no-repeat;overflow-x:clip}
body.marketing-site::before,body:has(.journal-root)::before{content:'';position:fixed;inset:0;z-index:0;pointer-events:none;opacity:1;background:linear-gradient(to right,var(--site-grid) 1px,transparent 1px);background-size:calc(100% / 6) 100%;mask-image:linear-gradient(to bottom,#000,transparent 92%)}
body.marketing-site>:not(dialog),body:has(.journal-root)>:not(dialog){position:relative;z-index:1}
.marketing-site *, .marketing-site *::before,.marketing-site *::after{box-sizing:border-box}
.marketing-site .wrap{width:100%;max-width:1320px;margin-inline:auto;padding-inline:clamp(22px,4vw,52px)}
.marketing-site :is(.hero,.page-hero){padding-top:96px!important}
.marketing-site .page-hero .hero-copy{align-self:start}
.marketing-site .pricing-hero-grid{align-items:start}
.marketing-site :is(.h-display,.journal-hero h1,.article-title){font:900 var(--site-h1)/1.02 var(--site-font);letter-spacing:-.035em}
.marketing-site :is(.h2,.h-section,.journal-cta h2,.section-head h2,.legal-hero h1){font:900 var(--site-h2)/1.08 var(--site-font);letter-spacing:-.03em}
.marketing-site :is(.featured h2,.article-body h2,.legal-content h2){font:700 var(--site-h3)/1.2 var(--site-font);letter-spacing:-.025em}
.marketing-site :is(.post-card h3,.journal-card h3,.article-body h3,.cognitive-copy h3,.ctitle,.bp-card-title){font:700 var(--site-h4)/1.3 var(--site-font);letter-spacing:-.02em}
.marketing-site :is(.article-body h4,.legal-content h3){font:700 var(--site-h4)/1.3 var(--site-font)}
.marketing-site :is(.article-body h5,.legal-content h4,.legal-content h5){font:700 var(--site-h5)/1.4 var(--site-font)}
.marketing-site :is(.lede,.hero-intro p,.article-deck){font:400 var(--site-lead)/1.6 var(--site-font)!important;color:var(--site-muted)}
.marketing-site :is(.journal-prose,.journal-prose p,.journal-prose li,.featured-copy p,.journal-card p,.cta-inner p,.cognitive-copy p,.review p,.reviews-head p,.bp-card-desc,.card-desc,.cdesc,.pricing-faq p,.next-move p,.plan-description,.plan-desc,.legal-content p,.legal-content li){font-size:var(--site-body);line-height:1.65}
.marketing-site :is(.journal-prose p,.journal-card p,.featured-copy p,.cta-inner p,.cognitive-copy p,.bp-card-desc,.card-desc,.cdesc,.plan-description,.plan-desc,.legal-content p,.legal-content li){color:var(--site-muted)}
.marketing-site :is(.journal-prose .direct-answer p,.journal-prose li){color:var(--site-ink)}
.marketing-site :is(blockquote,.journal-prose blockquote p){font:400 var(--site-lead)/1.6 var(--site-font);color:var(--site-ink)}
.marketing-site :is(.micro,.eyebrow,.journal-prose .micro,.takeaways>h2,.article-toc h2,.article-aside h2){font:500 var(--site-eyebrow)/1.6 var(--site-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--site-muted)}
.marketing-site .eyebrow{display:inline-flex;align-items:center;gap:10px;min-height:18px;margin-bottom:26px}
.marketing-site .eyebrow::before{content:'';width:22px;height:1px;flex:none;background:currentColor}
.marketing-site .eyebrow.is-typewriting::after{content:'';width:1px;height:1em;background:currentColor;animation:site-caret .72s steps(1,end) infinite}
@keyframes site-caret{50%{opacity:0}}
.marketing-site .journal-hero h1{margin-top:0}
.marketing-site :is(.it,.soft){font-style:italic;font-weight:300;letter-spacing:-.01em}
.marketing-site :is(figcaption,.journal-meta,.updated-note,.footer-copy,.pricing-fineprint){font-size:var(--site-caption);line-height:1.6;color:var(--site-muted)}
.marketing-site :is(.article-toc a,.aside-box p,.copy-button,.article-byline,.author span){font-size:var(--site-small);line-height:1.55}
.marketing-site .dark{--site-ink:#f4f4f1;--site-muted:#aaaab0}
/* One header/footer, one geometry, including mobile navigation. */
.marketing-header-host,body.marketing-site>noddis-header{position:static!important;z-index:auto!important}
.marketing-site .nav{position:fixed;inset:0 0 auto;z-index:100;border-bottom:1px solid transparent;transition:background .3s,border-color .3s}
.marketing-site .nav.scrolled,.marketing-site .nav.is-open{background:var(--site-nav);backdrop-filter:blur(14px);border-bottom-color:var(--site-border)}
.marketing-site .nav-inner{display:flex;align-items:center;justify-content:space-between;height:72px;gap:20px}
.marketing-site .logo{display:inline-flex;align-items:center;gap:9px;font:750 18px/1.5 var(--site-font);letter-spacing:-.025em;text-decoration:none;color:var(--site-ink)}
.marketing-site .logo-mark{width:30px;height:30px;object-fit:contain;flex:none}
html[data-journal-theme=dark] .nav .logo-mark{filter:grayscale(1) brightness(2)}
.marketing-site .nav-links{display:flex;align-items:center;gap:36px;font:500 14px/1.5 var(--site-font)}
.marketing-site .nav-links a,.marketing-site .nav-cta .login{color:var(--site-muted);text-decoration:none}
.marketing-site .nav-links a.cur,.marketing-site .nav-links a:hover,.marketing-site .nav-cta .login:hover{color:var(--site-ink)}
.marketing-site .nav-cta{display:flex;align-items:center;gap:20px;font:500 14px/1.5 var(--site-font)}
.marketing-site .btn,.marketing-site .button{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:100px;padding:11px 18px;font:500 15px/1.5 var(--site-font);text-decoration:none;cursor:pointer}
.marketing-site .btn-ink,.marketing-site .button{background:var(--site-ink);color:var(--site-paper)}
.marketing-site .nav-cta .btn{padding:9px 16px;font-size:14px}
.marketing-site .button.secondary,.marketing-site .btn-ghost{background:transparent;border:1px solid var(--site-border);color:var(--site-ink)}
.marketing-site .nav-burger{display:none;width:40px;height:40px;align-items:center;justify-content:center;flex-direction:column;gap:4px;border:0;border-radius:10px;background:none;padding:0;cursor:pointer}
.marketing-site .nav-burger span{width:20px;height:2px;background:var(--site-ink)}
.marketing-site .nav-burger[aria-expanded=true] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.marketing-site .nav-burger[aria-expanded=true] span:nth-child(2){opacity:0}
.marketing-site .nav-burger[aria-expanded=true] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.marketing-site .nav-mobile{display:none;background:var(--site-paper);border-top:1px solid var(--site-border);padding:14px clamp(22px,4vw,52px) 20px;max-height:calc(100dvh - 72px);overflow:auto}
.marketing-site .nav-mobile a{display:block;padding:13px 2px;font:500 15px/1.5 var(--site-font);color:var(--site-ink);border-bottom:1px solid var(--site-border);text-decoration:none}
.marketing-site .nav-mobile-actions{display:flex;flex-direction:column;gap:10px;margin-top:14px}
.marketing-site .nav-mobile .nav-mobile-login{border:1px solid var(--site-border);border-radius:100px;text-align:center}
.marketing-site .nav-mobile .nav-mobile-cta{border:0;border-radius:100px;text-align:center;background:var(--site-ink);color:var(--site-paper)}
.marketing-site .footer{border-top:1px solid #303030;padding:42px 0;background:#0f0f10;color:#aaaab0}
.marketing-site .footer-inner{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:30px;min-height:48px}
.marketing-site .footer .logo{color:#fff}
.marketing-site .footer-links{display:flex;justify-content:center;align-items:center;gap:22px;flex-wrap:wrap;font:400 14px/1.5 var(--site-font)}
.marketing-site .footer-links a{color:#aaaab0;text-decoration:none}
.marketing-site .footer-links a:hover{color:#fff}
.marketing-site .footer-copy{font-family:var(--site-mono);letter-spacing:.12em;text-transform:uppercase;color:#aaaab0}
/* Article-specific composition inherits the site roles and background. */
.journal.marketing-site{background:transparent;--font-sans:var(--site-font);--font-mono:var(--site-mono);--bg:var(--site-paper);--text:var(--site-ink);--muted:var(--site-muted);--line:var(--site-border);--surface:var(--site-surface);--header-h:72px}
.marketing-site .journal-article-header{padding-top:96px}
.marketing-site .article-toc,.marketing-site .article-aside{position:sticky;top:96px;align-self:start;max-height:calc(100dvh - 120px);overflow-y:auto;scrollbar-width:thin}
.marketing-site .article-layout{grid-template-columns:minmax(140px,180px) minmax(0,700px) minmax(140px,180px);gap:32px}
.marketing-site .journal-pagination{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:48px;padding-top:24px;border-top:1px solid var(--site-border)}
.marketing-site .journal-pagination [aria-disabled=true]{opacity:.4;cursor:default}
.marketing-site .skip-link{z-index:101}
@media(max-width:1080px){.marketing-site .article-layout{grid-template-columns:150px minmax(0,1fr)}.marketing-site .article-aside{display:block;grid-column:2;position:static;max-height:none}.marketing-site .footer-inner{grid-template-columns:1fr;text-align:center;justify-items:center}.marketing-site .nav-links{gap:20px}}
@media(max-width:860px){.marketing-site .nav-links,.marketing-site .nav-cta .login,.marketing-site .nav-cta>.btn{display:none!important}.marketing-site .nav-burger{display:flex}.marketing-site .nav.is-open .nav-mobile{display:block}}
@media(max-width:820px){.marketing-site .article-layout{display:block}.marketing-site .article-toc{display:block;position:static;max-height:none;margin-bottom:32px}.marketing-site .article-aside{margin-top:32px}.marketing-site .article-body{font-size:var(--site-body)}}
@media(max-width:640px){.marketing-site{--site-h1:clamp(40px,10vw,58px);--site-body:18px;--site-lead:20px}.marketing-site :is(.hero,.page-hero){padding-top:96px!important}.marketing-site .journal-pagination{gap:8px}.marketing-site .journal-pagination .button{padding:10px 13px}.marketing-site .journal-pagination .micro{letter-spacing:.04em}}
@media(hover:none) and (pointer:coarse),(max-width:1400px){body.marketing-site,body:has(.journal-root){background:var(--site-wash)!important;background-attachment:scroll!important}body.marketing-site::before,body:has(.journal-root)::before{position:absolute}}
@media(prefers-reduced-motion:reduce){.marketing-site .is-typewriting::after{animation:none}.marketing-site{scroll-behavior:auto}}
.marketing-site .article-mobile-tools{display:none}
/* Both tools remain in view on narrow screens without covering the article. */
@media(max-width:1080px){
  .marketing-site .article-mobile-tools{display:flex;position:sticky;top:72px;z-index:30;align-items:center;justify-content:space-between;gap:16px;padding:12px 0;background:var(--site-paper);border-block:1px solid var(--site-border);margin-bottom:32px;font-size:14px}
  .marketing-site .article-mobile-tools summary{cursor:pointer;min-height:24px}
  .marketing-site .article-mobile-tools nav{position:absolute;top:100%;left:0;right:0;max-height:calc(100dvh - 160px);overflow-y:auto;padding:12px 18px;background:var(--site-paper);border:1px solid var(--site-border);box-shadow:0 12px 24px #0002}
  .marketing-site .article-mobile-tools nav a{display:block;padding:10px 0;line-height:1.4}
  .marketing-site .article-mobile-tools .copy-fallback{font-size:12px}
  .marketing-site .article-layout{display:block}
  .marketing-site .article-toc,.marketing-site .article-aside{display:none}
  .marketing-site .article-body section{scroll-margin-top:144px}
}
/* Top-layer dialogs must not inherit a page's decorative stacking rules. */
body.marketing-site>dialog.website-dialog,body:has(.journal-root)>dialog.website-dialog{position:fixed;z-index:auto}
.marketing-site .site-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* The same button interaction contract on every public page. */
.marketing-site .btn{transition:transform .25s var(--ease),background .25s,color .25s,border-color .25s}
.marketing-site .btn-ink:hover{background:var(--site-secondary);transform:translateY(-2px)}
.marketing-site .btn-ghost:hover{background:var(--site-surface);border-color:var(--site-ink);transform:translateY(-2px)}
.marketing-site .btn:focus-visible{outline:2px solid var(--site-ink);outline-offset:4px}
@media(prefers-reduced-motion:reduce){.marketing-site .btn{transition:none}.marketing-site .btn:hover{transform:none}}

/* CTA band */
.marketing-site .journal-cta {
  background: var(--invert-bg, #0e0e0e);
  color: var(--invert-text, #fafaf8);
  padding: 80px 0;
  position: relative;
  overflow: hidden;
  border-top: 1px solid var(--invert-line, #303030);
}
.marketing-site .cta-word {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 0;
  pointer-events: none;
  user-select: none;
  text-align: center;
  font-weight: 900;
  font-size: min(25vw, 26rem);
  line-height: 0.72;
  letter-spacing: -0.04em;
  color: rgba(255, 255, 255, 0.05);
  white-space: nowrap;
  transform: translateY(18%);
}
.marketing-site .cta-inner {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1.3fr 0.7fr;
  gap: 64px;
  align-items: end;
}
.marketing-site .journal-cta .micro {
  color: var(--invert-muted, #a7a7a2);
}
.marketing-site .journal-cta h2 {
  margin: 18px 0 0;
  max-width: 18ch;
  text-wrap: balance;
}
.marketing-site .journal-cta p {
  color: var(--invert-muted, #a7a7a2);
  max-width: 42ch;
  margin: 0 0 28px;
}
.marketing-site .journal-cta .button {
  min-height: 48px;
  border: 1px solid var(--invert-text, #fafaf8);
  transition: transform .2s ease, background .2s ease;
  background: var(--invert-text, #fafaf8);
  border-color: var(--invert-text, #fafaf8);
  color: var(--invert-bg, #0e0e0e);
}
.marketing-site .journal-cta .button:hover {
  transform: translateY(-2px);
  opacity: 0.9;
}
.marketing-site .journal-cta .button:active{transform:none}

noddis-cta{display:block}
@media(max-width:820px){.marketing-site .cta-inner{grid-template-columns:1fr;gap:28px}}
@media(max-width:600px){.marketing-site .journal-cta{padding:60px 0}}
@media(prefers-reduced-motion:reduce){.marketing-site .journal-cta .button{transition:none;transform:none}}
