/* Compact tool hero, November 2, 2026 (round two audit, batch three).
   On the free tool pages the tool's first input sits within the first screen:
   the hero keeps its eyebrow, H1, hook and calls to action but drops the tall
   photograph panel and most of its padding, and the tool section follows it
   closely. The explanatory sections now follow the tool on the page. */

main:has(> .hero-service--tool) > .breadcrumb{padding-top:6px;padding-bottom:6px}
.hero-service.hero-service--tool > .container > .breadcrumb{padding-top:8px;padding-bottom:0;margin:0}

.hero-service.hero-service--tool .hero-service__split{min-height:0;grid-template-columns:minmax(0,1fr)}
.hero-service.hero-service--tool .hero-service__media{display:none}
.hero-service.hero-service--tool .hero-service__copy{justify-content:flex-start;padding-top:12px;padding-bottom:16px;min-height:0}
.hero-service.hero-service--tool .hero-service__copy::after{display:none}
.hero-service.hero-service--tool .hero-service__copy > *{max-width:none}
.hero-service.hero-service--tool .hero-service__eyebrow{margin:0 0 6px}
.hero-service.hero-service--tool .hero-service__title{font-size:clamp(1.75rem,1.4rem + 1.4vw,2.4rem);line-height:1.05;letter-spacing:-.01em;max-width:none;margin:0 0 8px}
.hero-service.hero-service--tool .hero-service__lede{font-size:1rem;line-height:1.5;max-width:none;margin:0 0 12px}
.hero-service.hero-service--tool .btn-row{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:8px 16px;margin:0}
.hero-service.hero-service--tool .btn-row > a{flex:0 0 auto;width:auto;margin:0}
.hero-service.hero-service--tool .btn-row .btn,
.hero-service.hero-service--tool .btn-row .button{min-height:40px;padding:8px 14px;font-size:.9375rem}

/* The section that holds the tool starts close below the hero. */
.hero-service--tool + .section,
.hero-service--tool + .nj-planning > section:first-child{padding-top:8px}
.hero-service--tool + .section > .container > .workbench{padding-top:20px}

@media (max-width:767px){
  .hero-service.hero-service--tool .hero-service__copy{padding-top:10px;padding-bottom:14px}
  .hero-service.hero-service--tool .hero-service__eyebrow{font-size:.68rem;letter-spacing:.1em;line-height:1.3}
  .hero-service.hero-service--tool .hero-service__title{margin-bottom:6px}
  .hero-service.hero-service--tool .hero-service__lede{margin-bottom:10px}
  .hero-service.hero-service--tool .btn-row .btn,
  .hero-service.hero-service--tool .btn-row .button{min-height:38px;padding:7px 12px}
  .hero-service--tool + .section > .container > .workbench{padding-top:14px}
}

@media (min-width:1024px){
  .hero-service.hero-service--tool .hero-service__copy{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:40px;align-content:start}
  .hero-service.hero-service--tool .hero-service__copy > *{grid-column:1}
  .hero-service.hero-service--tool .hero-service__copy > .btn-row{grid-column:2;grid-row:1 / span 3;align-self:end;justify-content:flex-end}
  .hero-service.hero-service--tool .hero-service__lede{margin-bottom:0}
  .hero-service.hero-service--tool .hero-service__copy{padding-bottom:14px}
  .hero-service--tool + .section,
  .hero-service--tool + .nj-planning > section:first-child{padding-top:8px}
}

/* The introduction that used to sit above the tool now follows it. */
.tool-about > .container > .tool-about__lede{max-width:78ch;margin:0 0 20px;font-size:1.0625rem;line-height:1.6}
.tool-about > .container > .tool-intake{margin-bottom:0}
.tool-about > .container > .tool-intake + .tool-privacy,
.tool-about > .container > .tool-intake + .video-format-list{margin:16px 0 0}

/* Printing a free tool page (round two audit, batch four, November 2, 2026). A reader who prints the page instead of
   downloading a report gets the title and the results: the site header, the footer, the directory tile, the privacy
   banner and dialog, the newsletter box, every button, file input and form control in the tool, and the hero photo
   are left off the paper, and blocks that read as one unit stay on one page. Only pages that hold a tool workspace
   are affected; the planning builders that share this stylesheet print as before. The workbench layout itself (side
   panel off, results full width, plain findings first) is in workbench.css. The paper size stays the reader's choice. */
@media print{
  body:has(:is(.tool-workspace,.video-workspace)) :is(.skip-link,.site-header,.practice-utility,.breadcrumb,.directory-tile,.site-footer,.privacy-banner,.privacy-center,.newsletter-signup,.site-progress){display:none!important}
  body:has(:is(.tool-workspace,.video-workspace)) .hero-service--tool :is(.btn-row,.hero-service__media){display:none!important}
  body:has(:is(.tool-workspace,.video-workspace)) .hero-service.hero-service--tool,
  body:has(:is(.tool-workspace,.video-workspace)) .hero-service.hero-service--tool *{color:#07191f!important;background:transparent!important;box-shadow:none!important;text-shadow:none!important}
  body:has(:is(.tool-workspace,.video-workspace)) .hero-service.hero-service--tool::before,
  body:has(:is(.tool-workspace,.video-workspace)) .hero-service.hero-service--tool::after,
  body:has(:is(.tool-workspace,.video-workspace)) .hero-service.hero-service--tool *::before,
  body:has(:is(.tool-workspace,.video-workspace)) .hero-service.hero-service--tool *::after{display:none!important}
  body:has(:is(.tool-workspace,.video-workspace)) :is(.btn-row,.cta-band .btn,.review-credit .btn){display:none!important}
  /* Paper is white: the page backdrop and the dark bands drop their fill, and their light text turns dark so it stays
     legible whether or not the reader prints background graphics. */
  html:has(:is(.tool-workspace,.video-workspace)),body:has(:is(.tool-workspace,.video-workspace)){background:#fff!important}
  body:has(:is(.tool-workspace,.video-workspace)) main>section{background:transparent!important}
  body:has(:is(.tool-workspace,.video-workspace)) :is(.cta-band,.tool-intake),
  body:has(:is(.tool-workspace,.video-workspace)) :is(.cta-band,.tool-intake) *{color:#07191f!important;background:transparent!important;border-color:#c3d3d9!important}
  :is(.tool-workspace,.video-workspace){-webkit-print-color-adjust:exact;print-color-adjust:exact;box-shadow:none!important}
  :is(.tool-workspace,.video-workspace) :is(button,.btn,input,select,textarea,label:has(>input,>select,>textarea),.tool-actions,.tool-split-control,.video-inputs,.video-controls,.video-notes,.photo-input,.photo-notes,.photo-mode,.video-mode){display:none!important}
  /* Paper is narrower than 1024 pixels, so the touch target sizes meant for phones are undone in print. */
  :is(.tool-workspace,.video-workspace) :is(a,summary,.tool-plain-link){min-height:0!important}
  :is(.tool-workspace,.video-workspace) :is(.tool-plain-link,.tool-triage a:not(.btn),.tool-consult a:not(.btn)){display:inline!important}
  /* Scroll boxes would clip on paper, so they open to their full height. */
  :is(.tool-workspace,.video-workspace) :is(.photo-canvas-scroll,.readable-table-wrap,.tool-table-wrap,.tool-field-results,pre){max-height:none!important;overflow:visible!important}
  /* Pictures keep their shape and stop at four inches tall, so an original and its view can share a sheet. */
  :is(.tool-workspace,.video-workspace) :is(canvas,img,video){width:auto!important;height:auto!important;max-width:100%!important;max-height:4in!important}
  :is(.tool-workspace,.video-workspace) svg{max-width:100%!important;height:auto}
  :is(.tool-workspace,.video-workspace) .photo-canvas-scroll{background:none!important}
  :is(.tool-workspace,.video-workspace) .photo-pixel-box{display:none!important}
  :is(.tool-workspace,.video-workspace) :is(code,pre,.tool-hash,td,th,dd){overflow-wrap:anywhere}
  :is(.tool-workspace,.video-workspace) pre{white-space:pre-wrap}
  :is(.tool-workspace,.video-workspace) :is(code,pre,.tool-hash){font-family:ui-monospace,"SFMono-Regular","Cascadia Mono",Consolas,"Liberation Mono","DejaVu Sans Mono",Menlo,monospace}
  /* Break guards: a row, a card, a finding with its how line, a figure with its caption and a heading with what follows. */
  :is(.tool-workspace,.video-workspace) thead{display:table-header-group}
  :is(.tool-workspace,.video-workspace) :is(tr,figure,canvas,img,.tool-triage-card,.tool-plain-finding,.tool-plain-how,.tool-plain-closing,.tool-consult,.tool-stamp,.tool-hash,.readable-card,.readable-facts>div,.readable-record,.photo-image-panel,.video-training-sample){break-inside:avoid;page-break-inside:avoid}
  :is(.tool-workspace,.video-workspace) :is(h2,h3,h4,caption,.tool-plain-finding,.tool-plain-findings-lede,.tool-triage-head){break-after:avoid;page-break-after:avoid}
  :is(.tool-workspace,.video-workspace) :is(h2,h3,h4){break-inside:avoid;page-break-inside:avoid}
  :is(.tool-workspace,.video-workspace) :is(h2,h3)::after{content:"";display:block;height:3em;margin-bottom:-3em}
  :is(.tool-workspace,.video-workspace) p{orphans:3;widows:3}
}
