/* Product photography occupies the left gutter; the existing resource card owns
   the right. The single image returns to normal document flow below 1280px. */
.article-body:has(.spotlight-product-rail) { position: relative; }
.spotlight-product-rail { margin: 0 auto 36px; max-width: 440px; }
.spotlight-product-rail--newsletter:empty { display: none; }
.spotlight-product-card { margin: 0; border: 1px solid var(--border); border-radius: 22px; background: #fff; box-shadow: 0 16px 44px rgba(26,32,44,.07), 0 2px 5px rgba(26,32,44,.03); overflow: hidden; }
.spotlight-product-eyebrow { display: flex; align-items: center; gap: 9px; padding: 17px 22px; border-bottom: 1px solid var(--border); font: 700 10.5px/1.4 var(--sans, sans-serif); letter-spacing: .16em; text-transform: uppercase; color: #fff; background: linear-gradient(90deg,var(--accent-deep,var(--ink,#33373f)),var(--accent)); border-bottom-color: transparent; }
.spotlight-product-dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 4px rgba(255,255,255,.14); }
.article-body .spotlight-product-rail .spotlight-product-eyebrow { height: 49px; box-sizing: border-box; padding-top: 0; padding-bottom: 0; padding-right: 26px; }
.spotlight-product-camera { display: block; flex: none; width: 18px; height: 18px; margin-left: auto; color: #fff; opacity: .9; }
.article-body .spotlight-product-image { position: relative; display: flex; align-items: center; justify-content: center; height: clamp(220px, 21vw, 330px); padding: 22px 18px 44px; background: linear-gradient(145deg, #fff, #f4f7f5); border: 0; text-decoration: none; }
.spotlight-product-image img { display: block; width: 100%; height: 100%; object-fit: contain; border-radius: 0; transition: transform .25s ease; }
.spotlight-product-image:hover img { transform: scale(1.025); }
/* Industry Spotlight previews fill the image area; the enlargement retains
   the complete original. Scope this treatment to the Spotlight edition. */
main[data-section="spotlight.html"] .article-body .spotlight-product-rail .spotlight-product-image {
  padding: 0; overflow: hidden;
}
main[data-section="spotlight.html"] .spotlight-product-image img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
}
.spotlight-product-expand { display: inline-flex; align-items: center; gap: 7px; position: absolute; right: 16px; bottom: 14px; padding: 6px 9px; border: 1px solid var(--border); border-radius: 6px; background: #fff; color: var(--text-muted); font: 600 11px/1.3 var(--sans, sans-serif); }
.article-body .spotlight-product-copy { display: block; padding: 21px 22px 19px; border-top: 1px solid var(--border); text-align: left; }
.spotlight-product-kind { display: block; color: var(--accent); font: 700 10px/1.4 var(--sans, sans-serif); letter-spacing: .11em; text-transform: uppercase; }
.article-body .spotlight-product-copy h2 { margin: 7px 0 9px; padding: 0; border: 0; font: 400 clamp(22px, 1.55vw, 28px)/1.15 Georgia, 'Times New Roman', serif; letter-spacing: -.025em; color: var(--text); }
.article-body .spotlight-product-copy h2::before { content: none; }
.article-body .spotlight-product-description { margin: 0 0 15px; color: var(--text-muted); font: 400 13px/1.55 var(--sans, sans-serif); }
.article-body .spotlight-product-rail .spotlight-product-card .spotlight-product-credit { display: flex; align-items: flex-start; gap: 8px; margin: 0; border: 0; padding: 10px 14px; border-top: 1px solid var(--border); background: #f7f7f8; color: #525866; text-align: left; text-decoration: none; font: 400 11.5px/1.45 var(--sans, sans-serif); }
.spotlight-product-credit > span:first-of-type { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.spotlight-product-credit-icon { flex: none; margin-top: 1px; color: var(--accent); }
.spotlight-product-credit:hover { color: var(--accent); }
.spotlight-product-card a:focus-visible { outline: 3px solid var(--accent); outline-offset: -4px; }
/* A complete product card also exists before a verified photograph is available. */
.spotlight-product-card--summary { display: flex; flex-direction: column; }
.spotlight-product-summary { flex: 1; display: flex; flex-direction: column; justify-content: center; padding: 24px 22px; }
.article-body .spotlight-product-summary h2 { margin: 12px 0 8px; padding: 0; border: 0; font: 400 26px/1.15 Georgia, 'Times New Roman', serif; letter-spacing: -.025em; overflow-wrap: anywhere; }
.article-body .spotlight-product-summary h2::before { content: none; }
.article-body .spotlight-product-summary .spotlight-product-generic { margin: 0 0 18px; color: var(--accent); font: 600 12px/1.5 var(--sans, sans-serif); }
.article-body .spotlight-product-rail .spotlight-product-card--summary .spotlight-product-summary .spotlight-product-description { margin: 0; font: 400 14px/1.6 var(--sans, sans-serif); text-wrap: pretty; }
.spotlight-product-card--summary > .spotlight-product-credit { flex: none; }
/* The sidebar newsletter keeps equal air between the card edge, its logo and
   the Pulse heading. 59.5% is 15% smaller than the original 70%-wide logo. */
.spotlight-product-rail .spotlight-newsletter.rnb-pulse { justify-content: flex-start; padding-top: 0; }
.spotlight-product-rail .spotlight-newsletter .spotlight-newsletter-brand {
  aspect-ratio: auto; max-height: none; margin-top: 0; margin-bottom: 0;
  padding: clamp(24px, 8cqw, 32px) 0;
}
.spotlight-product-rail .spotlight-newsletter-brand .rnb-logo {
  position: relative; top: auto; left: auto; width: 59.5%; margin: 0 auto;
}
.spotlight-product-rail .spotlight-newsletter .spotlight-newsletter-action { margin-top: auto; }
.spotlight-product-rail .spotlight-newsletter .spotlight-newsletter-note {
  white-space: nowrap; font-size: clamp(9px, 3.9cqw, 10.5px);
}
.spotlight-product-rail .spotlight-newsletter-note br { display: none; }
.spotlight-product-rail .spotlight-newsletter .spotlight-newsletter-points {
  padding-left: var(--spotlight-points-inset, 0px);
}
@media (min-width: 1280px) and (max-height: 800px) {
  .spotlight-product-rail .spotlight-newsletter .spotlight-newsletter-brand { padding-top: 20px; padding-bottom: 20px; }
}
@media (min-width: 1280px) {
  .spotlight-product-rail { position: absolute; top: 52px; bottom: 0; margin: 0; max-width: none; --rail-w: 250px; right: calc(100% - 24px + (min(50vw - 352px, 504px) - var(--rail-w)) / 2); left: max(376px - 50vw, -480px); pointer-events: none; }
  .spotlight-product-card { position: sticky; top: 146px; pointer-events: auto; }
}
@media (min-width: 1440px) { .spotlight-product-rail { --rail-w: 280px; } }
/* Match the entire product + newsletter stack (including its gap). The existing
   fit ladder still folds content when needed, now against the full rail height. */
.article-body:has(.spotlight-rail-stack) .article-contact--resource .contact-head {
  box-sizing: border-box;
  height: 49px;
  min-height: 49px;
  padding-top: 0;
  padding-bottom: 0;
}
@media (min-width: 1280px) {
  .article-body:not(:has(.spotlight-product-card)) .article-contact-rail > .contact-card.contact-card--spot {
    top: var(--spotlight-rail-top, 146px);
    height: var(--spotlight-rail-height, max(700px, calc(100vh - 164px)));
    max-height: var(--spotlight-rail-height, max(700px, calc(100vh - 164px)));
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  .article-body:has(.spotlight-rail-stack--newsletter) .article-contact-rail > .contact-card.contact-card--spot {
    max-height: var(--spotlight-rail-height, none);
  }
  .article-body:has(.spotlight-product-card) .article-contact-rail > .contact-card--rail {
    top: var(--spotlight-rail-top, 146px);
    height: var(--spotlight-rail-height, calc(100vh - 164px));
    max-height: var(--spotlight-rail-height, calc(100vh - 164px));
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  .article-body:has(.spotlight-rail-stack) .article-contact-rail > .contact-card--rail > * { flex-shrink: 0; }
  .article-body:has(.spotlight-rail-stack) .article-contact--resource { margin: 0; }
  .article-body:has(.spotlight-rail-stack) .article-contact--resource > .contact-card--rail { display: none; }
}
@media (min-width: 1280px) and (max-width: 1823px) {
  /* The taller card now reaches the fixed back-to-top control. Keep its
     disclosure text clear of that control without shortening either rail. */
  .article-body .article-contact-rail .contact-foot { padding-right: 68px; }
}
@media (min-width: 1280px) and (max-height: 800px) {
  .article-body .spotlight-product-image { height: clamp(120px, 28vh, 225px); }
  .article-body .spotlight-product-copy { padding: 15px 18px; }
  .article-body .spotlight-product-description { font-size: 12px; margin-bottom: 10px; }
}
/* Short landscape windows need normal scrolling so the whole card stays reachable. */
@media (min-width: 1280px) and (max-height: 620px) { .spotlight-product-card { position: static; } }
.spotlight-product-dialog { width: min(1100px, calc(100% - 32px)); max-height: calc(100dvh - 32px); margin: auto; padding: 54px 24px 22px; border: 1px solid var(--border); border-radius: 18px; background: #fff; color: var(--text); box-shadow: 0 24px 100px rgba(0,0,0,.25); }
.spotlight-product-dialog::backdrop { background: rgba(20,29,25,.72); backdrop-filter: blur(5px); }
.spotlight-product-dialog img { display: block; width: 100%; height: min(65dvh, 720px); object-fit: contain; }
.spotlight-product-dialog p { margin: 18px 0 0; font: 400 14px/1.6 var(--sans, sans-serif); }
.spotlight-product-close { position: absolute; top: 10px; right: 12px; min-height: 36px; padding: 7px 12px; border: 1px solid var(--border); border-radius: 999px; background: #fff; color: var(--text); font: 600 13px/1.4 var(--sans, sans-serif); cursor: pointer; }
.spotlight-product-close:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { .spotlight-product-image img { transition: none; } }
@media print { .spotlight-product-rail { position: static; max-width: 400px; margin: 24px auto; } .spotlight-product-card { position: static; box-shadow: none; break-inside: avoid; } .spotlight-product-expand { display: none; } }

/* Technology and newsletter form two equal rows at every size. The full caption
   is always visible; taller rails scroll to their bottom before sticking. */
.article-body .contact-card--spot .contact-head { box-sizing: border-box; height: 49px; flex: none; }
/* Paired links retain their full company/resource names at narrow card widths. */
.article-body .contact-card--spot .contact-pair .contact-row-text b {
  white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere;
}
.article-body .spotlight-product-rail .spotlight-product-card > figcaption { flex: none; margin: 0; padding: 0; }
.article-body .spotlight-product-rail .spotlight-product-card .spotlight-product-description {
  display: block; margin: 0; font-size: var(--spotlight-description-size, 13px); line-height: 1.4; text-wrap: balance;
}
.spotlight-product-description > span { display: block; white-space: nowrap; }
.spotlight-product-rail .spotlight-rail-stack { display: grid; grid-template-rows: repeat(2, minmax(0, 1fr)); }
.spotlight-product-rail .spotlight-rail-stack > .spotlight-newsletter { min-height: 0; margin-top: 0; }
@media (max-width: 1279px), (max-height: 700px) {
  .spotlight-product-rail .spotlight-rail-stack { grid-template-rows: repeat(2, 1fr); gap: 20px; }
  .spotlight-product-rail .spotlight-rail-stack > .spotlight-product-card { height: 100%; display: flex; flex-direction: column; }
  .article-body .spotlight-product-rail .spotlight-product-image { flex: 1 0 160px; }
}
@media (min-width: 1280px) and (max-height: 800px) {
  .article-body .spotlight-product-rail .spotlight-product-card .spotlight-product-copy { padding: 7px 14px; }
  .article-body .spotlight-product-rail .spotlight-product-card .spotlight-product-credit { padding-top: 8px; padding-bottom: 8px; font-size: 10.5px; }
}
.spotlight-product-rail .spotlight-rail-stack.spotlight-rail-natural {
  height: auto; grid-template-rows: repeat(2, 1fr);
}
.article-body .spotlight-rail-natural .spotlight-product-image { flex: 1 0 160px; }

/* The same newsletter remains available while verified product imagery is pending.
   A single card takes its natural height, without an empty image slot. */
.spotlight-product-rail .spotlight-rail-stack--newsletter {
  height: auto; grid-template-rows: auto;
}

/* Preserve sidebar sticking at every desktop height, including the content-sized
   fallback. A negative top offset keeps the bottom of a tall rail reachable. */
@media (min-width: 1280px) {
  .spotlight-product-rail .spotlight-rail-stack {
    position: sticky; top: var(--spotlight-sticky-top, var(--spotlight-top));
  }
  /* Size the photograph from its card, not its intrinsic pixels. Otherwise the
     content-sized fallback expands both equal rows around taller source images,
     pushing both rail headers behind the masthead even on a full-height desktop. */
  .article-body .spotlight-rail-stack .spotlight-product-image { contain: size; }
}