/* Hands Handbook — use the same editorial tokens, fonts and spacing as Hands. */
.hb-page{
  --hb-bg:var(--color-bg);
  --hb-ink:var(--color-text);
  --hb-muted:var(--color-neutral-700);
  --hb-border:var(--color-divider);
  --hb-panel:color-mix(in srgb,var(--color-neutral-100) 70%,var(--color-bg));
  --hb-panel-strong:color-mix(in srgb,var(--color-neutral-100) 92%,var(--color-bg));
  --hb-orange:var(--color-accent-700);
  color:var(--hb-ink);background:var(--hb-bg);
  font:400 16px/1.6 var(--font-body);
  min-height:100vh;
}
.hb-page *{box-sizing:border-box}
.hb-page a{color:inherit}
.hb-page a:focus-visible,.hb-page input:focus-visible{
  outline:3px solid color-mix(in srgb,var(--color-accent) 65%,transparent);
  outline-offset:3px;
}
.hb-shell{width:min(1160px,calc(100% - 48px));margin-inline:auto}
.hb-page [hidden]{display:none!important}
.hb-sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* The canonical floating marketing header and complete footer are injected
   from Insights. Only the Handbook content has its own UI rules. */
.hb-page .site-head{margin-bottom:0}
.hb-page .site-head .mega-nav--learning>.mega-nav-trigger{color:var(--color-accent-700)}
.hb-page .site-head .mega-nav--learning>.mega-nav-trigger::after{opacity:.85}

/* Editorial hero: warm brand canvas, Caprasimo and a single prominent search. */
.hb-home{padding:clamp(28px,4vw,56px) 0 clamp(94px,10vw,145px)}
.hb-hero{
  isolation:isolate;position:relative;max-width:1060px;
  margin:0 auto; padding:clamp(60px,8vw,105px) 30px clamp(68px,7vw,92px);
  text-align:center;
}
.hb-hero::before{
  content:'';position:absolute;inset:0;z-index:-1;
  border:1px solid color-mix(in srgb,var(--color-accent-2) 14%,var(--hb-border));
  border-radius:clamp(26px,3vw,44px);
  background:
    radial-gradient(ellipse at 8% 4%,color-mix(in srgb,var(--color-accent-2-200) 54%,transparent),transparent 48%),
    radial-gradient(ellipse at 95% 95%,color-mix(in srgb,var(--color-accent-200) 42%,transparent),transparent 52%),
    color-mix(in srgb,var(--color-neutral-100) 35%,var(--hb-bg));
}
.hb-kicker{
  display:inline-flex;align-items:center;gap:8px;
  padding:7px 14px;
  border:1px solid color-mix(in srgb,var(--color-accent) 26%,transparent);
  border-radius:999px;
  background:color-mix(in srgb,var(--color-accent) 9%,var(--hb-bg));
  color:var(--hb-orange);
  font:750 11px/1.3 var(--font-body);letter-spacing:.11em;text-transform:uppercase;
}
.hb-hero h1{
  max-width:20ch;margin:20px auto 0;
  font:400 clamp(43px,5.7vw,74px)/1.06 var(--font-heading);
  letter-spacing:-.028em;text-wrap:balance;
}
.hb-hero>p{
  max-width:570px;margin:19px auto 0;
  color:var(--hb-muted);font:500 clamp(16px,1.6vw,19px)/1.55 var(--font-body);
}
.hb-search{
  display:flex;align-items:center;gap:16px;max-width:760px;
  min-height:72px;margin:39px auto 0;padding:14px 22px;
  border:1.5px solid color-mix(in srgb,var(--color-text) 17%,transparent);
  border-radius:22px;
  background:var(--hb-panel-strong);
  box-shadow:var(--shadow-sm),0 12px 34px color-mix(in srgb,var(--color-text) 5%,transparent);
  transition:border-color 160ms ease,box-shadow 160ms ease;
}
.hb-search:focus-within{
  border-color:var(--color-accent);
  box-shadow:0 0 0 4px color-mix(in srgb,var(--color-accent) 16%,transparent),var(--shadow-sm);
}
.hb-search>svg{color:var(--hb-orange);flex-shrink:0}
.hb-search input{
  flex:1;min-width:0;width:100%;padding:4px 0;
  color:var(--hb-ink);background:transparent;border:0;
  font:550 16px/1.45 var(--font-body);outline:none!important;box-shadow:none!important;
}
.hb-search input::placeholder{color:var(--hb-muted);opacity:.9}
.hb-search-shortcut{
  padding:5px 9px;border:1px solid var(--hb-border);border-radius:7px;
  color:var(--hb-muted);background:color-mix(in srgb,var(--hb-bg) 65%,transparent);
  font:650 11px/1.2 var(--font-body);white-space:nowrap;
}

/* Search results use the same warm editorial cards as Insights. */
.hb-results-meta{margin:23px auto 15px;max-width:760px;text-align:left;color:var(--hb-muted);font-size:13px;font-weight:700}
.hb-results{max-width:760px;margin-inline:auto;display:grid;gap:12px;text-align:left}
.hb-result{
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:23px 26px;border-radius:21px;
  border:1px solid var(--hb-border);background:var(--hb-panel-strong);
  text-decoration:none;box-shadow:inset 0 1px color-mix(in srgb,white 35%,transparent);
  transition:transform 180ms ease,border-color 180ms ease,box-shadow 180ms ease;
}
.hb-result:hover{color:var(--hb-ink);border-color:color-mix(in srgb,var(--color-accent) 45%,transparent);transform:translateY(-2px);box-shadow:var(--shadow-md)}
.hb-result h3{margin:7px 0 6px;font:400 21px/1.26 var(--font-heading);letter-spacing:-.014em}
.hb-result p{margin:0;color:var(--hb-muted);font-size:14px;line-height:1.58}
.hb-result>span:last-child{color:var(--hb-orange);font-size:22px}
.hb-result-category{font:750 11px/1.3 var(--font-body);color:var(--hb-orange);text-transform:uppercase;letter-spacing:.045em}
.hb-empty{
  padding:32px;border-radius:18px;border:1px dashed var(--hb-border);
  text-align:center;color:var(--hb-muted);
}

/* Topic exploration. */
.hb-browse{max-width:1120px;margin:clamp(48px,6vw,78px) auto 0}
.hb-section-heading{margin-bottom:25px}
.hb-section-heading h2,.hb-topic-section h2{
  font:400 clamp(27px,3.2vw,35px)/1.15 var(--font-heading);letter-spacing:-.025em;margin:0;
}
.hb-section-heading p{margin:9px 0 0;color:var(--hb-muted);font-size:15px}
.hb-category-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}
.hb-category{
  display:flex;flex-direction:column;align-items:flex-start;gap:7px;
  min-height:210px;padding:25px 25px 27px;
  background:var(--hb-panel);border:1px solid var(--hb-border);border-radius:25px;
  text-decoration:none;box-shadow:inset 0 1px color-mix(in srgb,white 43%,transparent);
  transition:border-color 180ms ease,transform 180ms ease,box-shadow 180ms ease;
}
.hb-category:nth-child(6n + 2),.hb-category:nth-child(6n + 5){
  background:color-mix(in srgb,var(--color-accent-2-100) 56%,var(--hb-panel));
}
.hb-category:hover{
  color:var(--hb-ink);transform:translateY(-3px);
  border-color:color-mix(in srgb,var(--color-accent) 46%,var(--hb-border));box-shadow:var(--shadow-md);
}
.hb-category-icon{
  display:grid;place-items:center;width:50px;height:50px;
  margin-bottom:16px;border-radius:16px;
  background:color-mix(in srgb,var(--color-accent) 10%,var(--hb-panel-strong));
  color:var(--hb-orange);
}
.hb-category:nth-child(6n + 2) .hb-category-icon,.hb-category:nth-child(6n + 5) .hb-category-icon{
  background:color-mix(in srgb,var(--color-accent-2) 15%,var(--hb-panel-strong));
  color:var(--color-accent-2-700);
}
.hb-category strong{
  display:block;font:400 22px/1.2 var(--font-heading);letter-spacing:-.015em;
}
.hb-category small{font:500 14px/1.42 var(--font-body);color:var(--hb-muted)}
.hb-topic-section{margin-top:clamp(45px,5vw,69px);scroll-margin-top:85px}
.hb-topic-section h2{font-size:29px;margin:0 0 19px}
.hb-topic-list{
  display:grid;overflow:hidden;border:1px solid var(--hb-border);
  border-radius:24px;background:var(--hb-panel);
}
.hb-topic{
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:21px 28px;border-bottom:1px solid var(--hb-border);
  text-decoration:none;transition:background 150ms ease;
}
.hb-topic:last-child{border-bottom:0}
.hb-topic:hover{background:color-mix(in srgb,var(--color-accent) 8%,var(--hb-panel));color:var(--hb-ink)}
.hb-topic>span:first-child{display:grid;gap:5px}
.hb-topic strong{font:750 16px/1.32 var(--font-body)}
.hb-topic small{font:500 14px/1.48 var(--font-body);color:var(--hb-muted)}
.hb-topic>span:last-child{color:var(--hb-orange);font-size:19px}
.hb-provider-links{padding:15px 26px;display:flex;flex-wrap:wrap;gap:8px}
.hb-provider-links a{
  font:650 12px/1.35 var(--font-body);padding:8px 14px;
  border:1px solid var(--hb-border);border-radius:999px;
  background:var(--hb-panel-strong);color:var(--hb-ink);text-decoration:none;
}
.hb-provider-links a:hover{color:var(--hb-orange);border-color:var(--color-accent)}

/* Documentation: compact navigation with an editorial reading column. */
.hb-document-shell{padding-block:clamp(42px,5vw,78px) 115px}
.hb-breadcrumb{display:flex;align-items:center;gap:10px;color:var(--hb-muted);font:700 13px/1.4 var(--font-body)}
.hb-breadcrumb a{color:inherit;text-decoration:none}
.hb-breadcrumb a:hover{color:var(--hb-orange)}
.hb-document-grid{display:grid;grid-template-columns:235px minmax(0,1fr);align-items:start;gap:clamp(32px,5vw,77px);margin-top:56px}
.hb-article-side{position:sticky;top:106px;padding:24px;border:1px solid var(--hb-border);border-radius:23px;background:var(--hb-panel)}
.hb-side-label{margin:0;font:750 11px/1.35 var(--font-body);color:var(--hb-muted);text-transform:uppercase;letter-spacing:.085em}
.hb-back{display:block;margin:17px 0 23px;color:var(--hb-orange)!important;font:750 14px/1.45 var(--font-body);text-decoration:none}
.hb-side-list{display:grid;gap:14px}
.hb-side-list a{color:var(--hb-muted);text-decoration:none;font:600 13px/1.48 var(--font-body)}
.hb-side-list a:hover{color:var(--hb-orange)}
.hb-article{min-width:0;max-width:770px}
.hb-article>.hb-kicker{background:transparent;border:0;padding:0;border-radius:0}
.hb-article h1{
  max-width:18ch;margin:18px 0 15px;
  font:400 clamp(39px,4.9vw,62px)/1.07 var(--font-heading);
  letter-spacing:-.024em;text-wrap:balance;
}
.hb-article-intro{
  margin:0 0 34px;padding-bottom:34px;border-bottom:1px solid var(--hb-border);
  color:var(--hb-muted);font:500 19px/1.6 var(--font-body);
}
.hb-article-content{font:500 16px/1.78 var(--font-body)}
.hb-article-content h2{margin:42px 0 14px;font:400 29px/1.25 var(--font-heading);letter-spacing:-.02em}
.hb-article-content h3{margin:28px 0 11px;font:750 20px/1.3 var(--font-body)}
.hb-article-content p{margin:0 0 21px}
.hb-article-content ul,.hb-article-content ol{margin:0 0 24px;padding-left:27px}
.hb-article-content li{padding-left:5px;margin:8px 0}
.hb-article-content li::marker{color:var(--hb-orange);font-weight:700}
.hb-article-content a{color:var(--hb-orange);text-decoration:underline;text-underline-offset:3px}
.hb-article-content strong{font-weight:750}
.hb-article-content code{padding:2px 6px;border-radius:6px;background:var(--color-neutral-200)}
.hb-article-footer{
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  border-top:1px solid var(--hb-border);margin-top:52px;padding-top:26px;
}
.hb-article-footer p{font-weight:750;margin:0}
.hb-article-footer a{
  color:var(--hb-orange);text-decoration:none;
  font:750 14px/1.4 var(--font-body);
}
.hb-article-footer a:hover{text-decoration:underline;text-underline-offset:4px}

@media(max-width:940px){
  .hb-category-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hb-document-grid{grid-template-columns:minmax(0,1fr);gap:24px;margin-top:32px}
  .hb-article-side{position:static;display:flex;align-items:center;gap:16px;padding:0;background:transparent;border:0}
  .hb-side-label,.hb-side-list{display:none}
  .hb-back{margin:0}
}
@media(max-width:620px){
  .hb-shell{width:min(100% - 32px,1160px)}
  .hb-home{padding-top:15px;padding-bottom:90px}
  .hb-hero{padding:65px 19px 65px;border-radius:25px}
  .hb-hero::before{border-radius:25px}
  .hb-hero h1{font-size:clamp(38px,10vw,51px)}
  .hb-hero>p{font-size:16px}
  .hb-kicker{font-size:10px}
  .hb-search{margin-top:28px;padding:12px 16px;min-height:59px;border-radius:17px;gap:10px}
  .hb-search input{font-size:14px}
  .hb-search-shortcut{display:none}
  .hb-browse{margin-top:52px}
  .hb-section-heading h2,.hb-topic-section h2{font-size:28px}
  .hb-category-grid{grid-template-columns:1fr;gap:12px}
  .hb-category{min-height:175px;padding:21px 22px;border-radius:20px}
  .hb-category-icon{margin-bottom:9px}
  .hb-category strong{font-size:21px}
  .hb-topic-list{border-radius:19px}
  .hb-topic{padding:18px 19px}
  .hb-provider-links{padding:13px 19px}
  .hb-result{padding:19px}
  .hb-result h3{font-size:19px}
  .hb-article h1{font-size:40px}
  .hb-article-intro{font-size:17px}
  .hb-article-footer{flex-direction:column;align-items:start}
  .hb-document-shell{padding-bottom:85px}
}
@media(prefers-reduced-motion:reduce){
  .hb-page *{transition:none!important;scroll-behavior:auto!important}
}