/* The alphabetic baseline, rather than the font's invisible descent area,
   meets the end of each grid-sized text block. Every line repeats in 16px units. */
:root{
  --leading-display-grid:64px;
  --leading-section-grid:48px;
  --leading-text-grid:32px;
  --leading-small-grid:24px;
  --space-heading-copy:32px;
}
@supports(text-box-trim:trim-both) and (height:calc-size(auto,round(up,size,32px))){
  #top :is(main,.site-footer) :is(h1,h2,h3,h4,h5,h6,p,blockquote,li,dt,dd,
    .type-display,.type-section,.type-title,.type-body,.type-small,
    .image-placeholder-label,.image-placeholder-title,.image-placeholder-type,
    .outcome-copy,.tiny-number,.image-original-label,.font-choice-sample,.micro,.aspect-name){
    text-box-trim:trim-both;
    text-box-edge:cap alphabetic;
    align-content:end;
    height:calc-size(auto,round(up,size,var(--grid-unit)));
    line-height:var(--baseline-leading,var(--leading-text-grid));
  }
  #top main :is(h1,.type-display){--baseline-leading:var(--leading-display-grid)}
  #top main :is(h2,.type-section,.visual-tagline,.solution-title,.font-choice-sample),
  #top main .solution-invitation h3{--baseline-leading:var(--leading-section-grid)}
  /* Only the small text styles use the tighter leading. */
  #top :is(main,.site-footer) :is(
    .type-small,.eyebrow,.breadcrumb,.category-line,.tiny-number,.micro,
    .image-placeholder-label,.image-placeholder-type,.image-original-label,.image-brief,
    .image-direction p,.image-original-example :is(p,blockquote,li),.aspect-example p,
    .story-label,.step-label,.story-step p,.story-note,.proof-list li,.other-solutions p,
    .employee-support-card>p,.employee-example :is(p,li),
    .product-card ul:not(.product-card__features)>li,
    .detail-note,.download-note,.spec-list :is(dt,dd),.support-strip p,.format-strip p,
    .template-grid dd,.industry-product p,.solution-story .quote-panel p,
    .footer-column li,.footer-inner p,.footer-copyright,.source-link
  ){--baseline-leading:var(--leading-small-grid)}
  #top main :is(.conversation:not(.solution-invitation) .eyebrow,
    .report-example .disclosure-content>p:not(.eyebrow)){
    --baseline-leading:var(--leading-text-grid);
  }
  #top :is(main,.site-footer) :is(h1,h2,h3,h4,h5,h6,blockquote){margin-block:0 32px}
  #top :is(main,.site-footer) p{margin-block:0 16px}
  #top main .section-heading h2:not(:has(+p)),
  #top main .wearables-introduction,
  #top :is(main,.site-footer) p:last-child{margin-bottom:0}
  #top main .hero-category{margin-bottom:32px}
  #top main .hero-lead{margin-bottom:32px}
  #top main .section-heading .eyebrow{margin-bottom:32px}
  #top main .employee-support-card>p{margin-block:0}
  #top main .employee-support-grid .employee-support-card>p{align-content:start}
  #top main .employee-support-card h3{min-height:0}
  #top main .employee-support-card .image-brief{min-height:96px}
  #top main .image-brief{margin-block:16px}
  #top main .wearable-card .image-brief{margin-top:0}
  #top main .image-original-label{display:block;margin-bottom:16px}
  #top main .image-original-example{margin-block:16px}
  #top main .image-original-example :is(p,blockquote,li){margin-block:0 16px}
  #top main .image-original-example>:last-child{margin-bottom:0}
  #top main .image-direction p{margin-top:16px}
  #top main .hero-image-focus,.image-frame{gap:16px}
  .image-frame{min-height:calc-size(min-content,round(up,size,32px))}
  .image-frame>*{flex-shrink:0}
  .hero-image-focus{height:calc-size(auto,round(up,size,32px))}
  .product-card,.solutions-grid.four .solution-card{border:0;box-shadow:inset 0 0 0 1px #ccc}
  /* Paint photographic card outlines above their images without shifting the grid. */
  .product-card.product-card--photographic,
  .solutions-grid.four .solution-card--photographic{position:relative;box-shadow:none}
  .product-card.product-card--photographic::after,
  .solutions-grid.four .solution-card--photographic::after{
    content:"";position:absolute;inset:0;border-radius:inherit;
    box-shadow:inset 0 0 0 1px #ccc;pointer-events:none;
  }
  .aspect-list{border:0;box-shadow:inset 0 1px var(--line)}
  .aspect-label{padding-top:0}
  #top main .image-plan-how .image-frame{min-height:256px}
  #top main .technical .micro{margin-bottom:16px}
  .solutions-grid.four .solution-invitation{box-shadow:none;align-items:start;align-content:start}
  .solution-invitation .conversation-aside{border:0;box-shadow:inset 1px 0 var(--line)}
  #top main .solutions-grid.four .solution-card h3{min-height:64px}
  #top main .solutions-grid.four .solution-invitation h3{min-height:0}
  #top main .solutions-grid.four .solution-invitation .eyebrow{margin-bottom:16px}
  #top main .solutions-grid.four .solution-invitation .conversation-aside p{margin-bottom:32px}
  #top main .product-card :is(ul,li){margin-block:0 16px}
  #top main .product-card li{padding-block:16px;border:0;box-shadow:inset 0 1px #e5e5e5}
  #top main .product-card li:last-child{margin-bottom:0}
  #top .footer-intro .brand{margin-bottom:32px}
  #top .footer-column h2{margin-block:0 32px}
  #top .footer-column ul{gap:0}
  #top .site-footer .footer-column li{margin:0;height:auto;min-height:32px;text-box-trim:none;align-content:start}
}
@media(max-width:800px){
  :root{--leading-display-grid:48px}
  .solution-invitation .conversation-aside{box-shadow:inset 0 1px var(--line)}
}