/* UI standards floor (docs/ui-standards-reference.html): 12px minimum text, 44px targets, 4.5:1 small-text contrast.
   Loaded last on every page so earlier layered sheets cannot drop below it. Inline links inside running text are exempt from the target rule.
   mobile.css enlarges a few of these on narrow screens, so those floors apply above 900px only. */

/* Controls and standalone links: 44px target at every width */
#site-navigation a,.nav-cta,.button,.intro-foot button,#play-quick,.quick-chapters button,
#gallery-source,#motion-toggle,.gallery-note a,.sales-workflow-foot a,.release-download,#packet-image-link,.packet-tabs button,.lean-footer nav a,
.detail-intro>a,.authority-strip>a,.detail-cta a,.workflow-detail-link,.case-actions a,.report-nav a,.capability-grid article>a{
  display:inline-flex;align-items:center;min-height:44px}
/* The wordmark stacks INTELLIGENCE under CUT//CLEAR, so it keeps block flow instead of a single flex row. */
.product-nav .brand,.report-nav .brand,.lean-footer .brand{display:inline-block;min-height:44px}
#motion-toggle{min-width:44px;padding:0 8px}
.quick-chapters button,.packet-tabs button{justify-content:center}
.quick-transcript summary,.questions summary,.integration-details summary{min-height:44px;display:flex;align-items:center}
.case-report footer a{min-height:44px}

/* Metadata, eyebrows and captions */
.eyebrow,.label,.example-label,.capture-zoom,.sales-section-label span,.sales-steps article>span,.cap-index,.studio span,
.quick-demo-head span,.quick-demo-controls span,.intro-foot span,.quick-demo>p:not(.readable-caption),#format-medium,.format-insight>span,.case-note,
.release-disclosure,.pilot-scope span,.gallery-note span,.lean-footer>span,
.packet-context span:first-child,.packet-masthead>span,.packet-title>span,.packet-title p,#packet-kicker,#packet-fields span,.packet-footer span,.packet-under span,
.clue-chain span,.clue-chain i,.mini-note span,.record-stack span,.record-stack b,.format-spec strong,
.film-card-copy small,.resource-links small,.resource-symbol,.resource-note,.planner-facts small,.planner-privacy,
.case-report .eyebrow,.case-report figcaption,.case-report footer,.case-report footer a,.steps li>span,.handoff-steps li>span,
.gallery-tabs button,.gallery-tabs button small,#packet-image-link,.integration-details summary span:last-child{font-size:12px!important;line-height:1.45}

/* Control labels */
.nav-cta,.nav-cta span,.button,.intro-foot button,.quick-chapters button,#gallery-source,#motion-toggle,.gallery-note a,
.sales-workflow-foot a,.release-download,.packet-tabs button,.lean-footer nav a,.detail-intro>a,.authority-strip>a,.detail-cta a,
.workflow-detail-link,.report-nav div>a:not(.button),.capability-grid article>a,.button span,.sales-workflow-foot a span,.release-download span,
.capability-grid article>a span,.packet-tabs button span,.gallery-tabs button span,.quick-transcript summary{font-size:13px!important}

/* Body copy */
.mini-note b,.clue-chain strong,.authority-strip p,.sales-workflow-foot p,.film-card-copy>span{font-size:13px!important;line-height:1.55}

@media(min-width:901px){
  .quick-demo>p.readable-caption,.release-proof span,.integration-details summary span,.pilot-details p{font-size:12px!important;line-height:1.45}
  #site-navigation>a,#play-quick,.questions summary,.integration-details summary{font-size:13px!important}
  .quick-transcript p,.questions details>p,#pilot-builder label,.format-spec p,#packet-copy{font-size:13px!important;line-height:1.55}
}

/* SVG icons. DM Sans and Manrope lack ↗ → ← ＋ ▷ Ⅱ ↻ ↺ ✓ ◎ ≠ ⌄, so those text glyphs fell back to a system font.
   arrow-out leaves the site or opens a new tab, file, viewer or email; arrow-next stays on the site; arrow-down downloads or jumps down the page.
   Every disclosure toggle shows plus when closed and minus when open. */
.arrow,.icon,.toggle-icon,.pilot-details li:before,.format-detail li:before,.professional-home .release-proof span:before{
  display:inline-block;flex:none;width:.85em;height:.85em;vertical-align:-.08em;background:currentColor;
  -webkit-mask:var(--glyph) center/contain no-repeat;mask:var(--glyph) center/contain no-repeat}
.pilot-details li:before,.format-detail li:before,.professional-home .release-proof span:before{content:''}
.arrow-out{--glyph:url("assets/icons/arrow-out.svg")}
.arrow-next,.pilot-details li:before,.format-detail li:before{--glyph:url("assets/icons/arrow-next.svg")}
.arrow-down{--glyph:url("assets/icons/arrow-down.svg")}
.arrow-back{--glyph:url("assets/icons/arrow-back.svg")}
.icon-play{--glyph:url("assets/icons/play.svg")}
.icon-pause{--glyph:url("assets/icons/pause.svg")}
.icon-replay{--glyph:url("assets/icons/replay.svg")}
.icon-plus{--glyph:url("assets/icons/plus.svg")}
.icon-neq{--glyph:url("assets/icons/not-equal.svg")}
.icon-chevron{transition:transform .18s;--glyph:url("assets/icons/chevron-down.svg")}
details[open]>summary .icon-chevron{transform:rotate(180deg)}
.icon-authority{--glyph:url("assets/icons/authority.svg")}
.professional-home .release-proof span:before{--glyph:url("assets/icons/check.svg")}
.toggle-icon{--glyph:url("assets/icons/plus.svg")}
details[open]>summary .toggle-icon,.menu-toggle[aria-expanded=true] .toggle-icon{--glyph:url("assets/icons/minus.svg")}
@media(max-width:900px){
  .quick-transcript summary:before{content:'';display:inline-block;flex:none;width:.85em;height:.85em;background:currentColor;
    -webkit-mask:var(--glyph) center/contain no-repeat;mask:var(--glyph) center/contain no-repeat;
    --glyph:url("assets/icons/plus.svg")}
  .quick-transcript[open] summary:before{content:'';
    --glyph:url("assets/icons/minus.svg")}
}

/* Hover: only on hover-capable pointers, never a size or layout change, and separate from the focus outline.
   Outlined CTAs take a cyan border and tint; text controls turn cyan; an arrow moves 3px in its own direction. */
@media(hover:hover) and (pointer:fine){
  .nav-cta{transition:border-color .18s,background-color .18s,color .18s}
  .nav-cta:hover{border-color:var(--cyan);background-color:#52d5e01a;color:#fff}
  .menu-toggle{transition:color .18s}
  .menu-toggle:hover{color:var(--cyan)}
  .nav-cta:hover .arrow-next,.button:hover .arrow-next,a:hover>.arrow-next{transform:translateX(3px)}
  .button:hover .arrow-down,a:hover>.arrow-down{transform:translateY(2px)}
  .button:hover .arrow-out,a:hover>.arrow-out{transform:translate(2px,-2px)}
  a:hover>.arrow-back{transform:translateX(-3px)}
  .arrow{transition:transform .18s}

  /* Text controls on dark surfaces turn cyan; ones already tinted cyan brighten and underline instead. */
  .quick-transcript summary,#motion-toggle,.questions summary,.integration-details summary,.format-tabs button,
  .report-nav div>a:not(.button),.case-report footer a,#play-quick{transition:color .18s,background-color .18s,border-color .18s}
  .quick-transcript summary:hover,#motion-toggle:hover,.questions summary:hover,.integration-details summary:hover,
  .report-nav div>a:not(.button):hover,.case-report footer a:hover,.professional-home .gallery-note #motion-toggle:hover{color:var(--cyan)}
  #play-quick:hover{color:#fff;text-decoration:underline;text-underline-offset:4px}
  .format-tabs button:hover{color:var(--cyan)!important;background-color:#52d5e01a!important}
  /* Boxed chapter buttons take a cyan border and tint. */
  .quick-chapters button:hover{border-color:var(--cyan)!important;background-color:#52d5e026!important}
  /* Cream surfaces use the dark teal accent so hovered text keeps 4.5:1. */
  .final-scene .questions summary:hover{color:#15575f}
  .packet-tabs button:hover,.packet-tabs button:hover span{color:#15575f!important}
  .packet-tabs button:hover{background-color:#15575f14!important}
  /* Form fields take a cyan border; inline links in running text underline; logotype links dim slightly. */
  #pilot-builder select:hover{border-color:var(--cyan)!important}
  main p a:hover{text-decoration:underline;text-underline-offset:3px}
  .brand{transition:filter .18s}
  .brand:hover{filter:brightness(.82)}
  #close-screenshot:hover,#close-film:hover{filter:brightness(1.08)}
}
/* The outlined use-case button inherited cinema.css's solid light-cyan hover fill under near-white text (about 1.2:1).
   That rule is not pointer-gated, so a tap on a touch screen showed it too; this override applies everywhere. */
.professional-home .format-question .button:hover{background:#52d5e01a;border-color:var(--cyan);color:#fff}
/* Touch screens keep no hover residue after a tap. */
@media(hover:none){.button:hover span,.nav-cta:hover span{transform:none}}

/* Small text contrast. Gallery tabs sit on a dark panel; the release packet and case report are cream paper. */
.professional-home .gallery-tabs button:not(.active),.professional-home .gallery-tabs button small{color:#a8b0ba!important}
.packet-masthead>span,.packet-title>span,.packet-title p,#packet-kicker,#packet-copy,.packet-footer span,
.packet-tabs button[aria-selected=false],.packet-tabs button[aria-selected=false] span{color:#46565c!important}
.case-report .case-summary .eyebrow,.case-report .case-register .eyebrow{color:#34564c}
.case-report .case-number{color:#5c614e}
.professional-home .pilot-invitation .eyebrow{color:#46604f}

/* Menu shows from 900px down, but product.css only cleared the browser button chrome at 760px and below,
   so 761 to 900px rendered a light-gray default button. */
.product-nav .menu-toggle{background:none;border:0;color:#e4e5e5}

/* sales.css gives these grids a percentage gap at every width. Once they stack, a percentage row gap is
   sized as zero and then added back, so content spills past the container: the packet card was clipped
   at 700px and below, and the format panel overran its footnote at 701 to 760px. */
.professional-home .release-layout,.professional-home .format-panel{row-gap:30px}

/* One page frame on every page: a 5% gutter (16px at 320px) until content reaches the 1440px maximum, then
   centered. Header, sections, footer and inner layouts share the same left and right content edges. */
.product-nav,.report-nav,#main>section,#main>.detail-intro,#main>.detail-cta,.case-report main>section,.lean-footer,.case-report>footer{
  max-width:none!important;margin-inline:0!important;padding-inline:max(5%,(100% - 1440px)/2)!important}
.example-heading,.tour-layout,.gallery-note,.release-layout{max-width:none!important;margin-inline:0!important}
#main>nav,#main>div:not(.detail-intro):not(.detail-cta){max-width:none!important;margin-inline:0!important;padding-inline:max(5%,(100% - 1440px)/2)!important}
/* Notes between sections keep their reading width; only their left edge moves onto the frame. */
#main>p{margin-inline:max(5%,(100% - 1440px)/2)!important;padding-inline:0!important}

/* The homepage review tiles anchored their copy to the bottom of a fixed-ratio box, so a wrapping heading ran up over
   the code label (also on the published Sites v48). Copy now sits in flow under a reserved label row; the ratio is a minimum. */
.visual-shot{display:flex!important;flex-direction:column;padding:10px 12px 12px 10px;overflow:visible!important;clip-path:inset(0)}
.visual-shot>.shot-code{position:relative!important;inset:auto!important;align-self:flex-start;margin-bottom:auto}
.visual-shot>div{position:relative!important;inset:auto!important;margin-top:12px}
/* Tile copy sat directly on the photo: measured against the brightest 5% of pixels behind each line, the small
   kickers fell to 1.02:1 and a 22px heading to 3.5:1. A scrim fades in above the kicker and holds 78-88% charcoal
   behind the copy, which keeps every line above 4.5:1 even over a white pixel. The top of the photo stays clear. */
.visual-shot>div{margin:0 -12px -12px -10px;padding:26px 12px 12px 10px;
  background:linear-gradient(rgba(6,12,16,0),rgba(6,12,16,.78) 22px,rgba(6,12,16,.88));text-shadow:0 1px 2px rgba(0,0,0,.5)}
/* Workflow's opening still had the same problem (caption label at 3.72:1); the caption box now spans the frame with
   the same scrim, keeping its original text offsets as padding. */
.opening-frame figcaption{left:0!important;right:0!important;bottom:0!important;padding:26px 20px 25px 28px;
  background:linear-gradient(rgba(6,12,16,0),rgba(6,12,16,.78) 22px,rgba(6,12,16,.88));text-shadow:0 1px 2px rgba(0,0,0,.5)}
@media(max-width:700px){.opening-frame figcaption{padding:26px 20px 16px}}
/* Capabilities captions faded in over their full height, so a label that wraps at 320px sat on a faint part (4.29:1). */
.engine-chapter figcaption{background:linear-gradient(rgba(8,13,16,0),rgba(8,13,16,.82) 30px,rgba(8,13,16,.9))!important}

/* Product demo capped main at 1440px, so the 5% gutter resolved inside it at wide widths; the frame now does the centering. */
.film-case main{max-width:none!important;margin-inline:0!important}
/* v48's journey-index hover darkens the link to #233126, which left the step numbers at 4.49:1. */
.journey-index a>small{color:#8fab96}
/* Five stage buttons at 12px labels overflow each other on narrow phones, so the row wraps to three columns. */
@media(max-width:480px){.demo-steps{grid-template-columns:repeat(3,minmax(0,1fr))!important}}

/* v48 small-text floor. Generated from measurements at one width per breakpoint interval on all 12 pages; each selector
   is anchored on a class or id and matches only text under 12px in its interval, so no text shrinks. The INTELLIGENCE
   line under the wordmark is part of the logotype and is exempt. */
#accessibility div>span.buyer-kicker,#affairs div>span.buyer-kicker,#brief-result>span.chapter-label,#creative div>span.buyer-kicker,
#engine-animation figure>figcaption,#engine-documentary figure>figcaption,#engine-drama figure>figcaption,#engine-thriller figure>figcaption,
#film-pair figure>figcaption>span,#film-tab-0>small,#film-tab-1>small,#film-tab-2>small,#genre-animation div>span.engine-kicker,
#genre-documentary div>span.engine-kicker,#genre-drama div>span.engine-kicker,#genre-thriller div>span.engine-kicker,#main>p.engine-evidence-note,
#post div>span.buyer-kicker,#release div>span.buyer-kicker,#review-journey>p.example-disclosure,#tab-access>small,#tab-approval>small,
#tab-campaign>small,#tab-claims>small,#tab-rights>small,#tab-story>small,.aligned-intro>span.chapter-label,.brief-panel dl>div>dt,
.brief-panel>div.panel-foot,.brief-panel>div.panel-label,.buyer-intro>span.buyer-kicker,.buyer-section.buyer-entry>span.buyer-kicker,
.buyer-section.conversion-grid article>span.buyer-kicker,.buyer-section.pilot-timeline>span.buyer-kicker,.buyer-section>span.buyer-kicker,
.cap-catalog div>span.chapter-label,.caption-frame>span,.case-explanation div>span,.case-readout div>span,.case-story>p.case-example,
.case-story>span.chapter-label,.case-visual>div.visual-caption,.chapter-copy>span.chapter-label,.compact-value div>span.buyer-kicker,.cut-row>span,
.decision-panel>span.chapter-label,.demo-bottom>span,.demo-evidence>span,.demo-intro>span.engine-kicker,.demo-picture-caption>span,.demo-picture>p,
.demo-top>span.sim-badge,.demo-work>p.engine-kicker,.edit-instruction>span,.edit-panel>div.panel-label,.engine-answer>span,
.engine-chapter-copy>p.engine-tags,.engine-chapter-copy>span.engine-kicker,.engine-chapter-nav a>small,.engine-page-intro>span.engine-kicker,
.engine-proof>p,.evidence-frame figcaption>span,.film-bottom div>span.film-eyebrow,.film-controls>span,.film-detail>span,
.film-intro div>p.film-eyebrow,.film-meta>span,.film-nextsteps>p,.film-note div>span.film-eyebrow,.film-premise>span,.film-review>p.film-disclosure,
.film-stagebar span>i,.film-stagebar>span,.genre-strip a>span>small,.journey-index a>small,.journey-intro div>p.chapter-label,.nav-more-panel a>small,
.open-case-heading>span.buyer-kicker,.opening-frame figcaption>span,.pilot-form-section div>span.chapter-label,.pilot-questions>span.chapter-label,
.profile-list>p.profile-note,.profile-section div>span.chapter-label,.rail-foot>small,.rail-project>small,.resource-feature div>span.chapter-label,
.resource-rows a>span,.revision-panel ol>li>span,.revision-panel>div.panel-foot,.revision-panel>div.panel-label,.sample-findings article>div>strong,
.sample-findings article>p.sample-authority,.sample-findings article>span.chapter-label,.sample-findings>span.chapter-label,
.sample-outcome div>span.chapter-label,.sample-source p>code,.sample-source>p,.scope-visual>span.visual-overline,.timeline-track>b,
.timeline-track>b.reveal-segment,.timeline-track>i,.type-visual>span.visual-overline,.use-intro>span.chapter-label,.value-opening>span.engine-for,
.value-opening>span.engine-kicker,.value-output div>span,.value-output>span,.visual-caption>span,.visual-delivery>span,
.visual-review>p.visual-disclosure,.visual-shot div>small,.visual-shot>span.shot-code,.visual-slate span>b,.visual-slate>small,.visual-slate>span,
.visual-team p>span,.workflow-close>p,.workflow-close>p.cap-endnote,.workflow-close>span.chapter-label,.workflow-details div>span.chapter-label,
.workspace-brand>small,.workspace-context div>span,.workspace-context>span.workspace-condition,.workspace-main>div.workspace-notice,
.workspace-notice>span{font-size:12px!important;line-height:1.45}
#brief-result>button,.demo-actions>button.engine-primary,.demo-close>a.engine-primary,.demo-cut-switch>button,.demo-steps>button,.demo-top>button,
.demo-top>label,.film-intro div>a.film-back,.rail-foot>a{font-size:13px!important}
@media(max-width:700px){
  .case-explanation>p.case-boundary,.demo-steps button>span,.visual-shot div>span,.visual-team p>strong{font-size:12px!important;line-height:1.45}
  .case-tablist>button,.engine-actions>a,.engine-actions>a.engine-primary,.film-controls>button,.journey-index>a{font-size:13px!important}
}
@media(min-width:701px){
  .rail-project>p.rail-label,.use-intro-bottom>span,.workspace-rail>div.rail-foot,.workspace-rail>p.rail-label{font-size:12px!important;line-height:1.45}
}
@media(max-width:900px){#pilot-builder>label{font-size:13px!important}}
@media(min-width:901px){.nav-more>summary{font-size:13px!important}}

/* v48 targets: standalone links, summaries and form controls that measured under 44px. align-content centers the
   label in the taller box without changing block layout; inline links become inline-block so the height applies. */
.engine-actions>a,.visual-delivery>a,.film-nextsteps>a,.workflow-close>a.quiet-case-link,.rail-foot>a,.engine-proof>summary,
.buyer-section.pilot-timeline details>summary,#demo-genre,#demo-reset,#demo-next{min-height:44px;align-content:center}
.case-bottom>a,.compact-value div>a,.pilot-prep>a,.engine-chapter-copy>a,.demo-close>a,.buyer-link,.pilot-form-section div>a,
.film-intro div>a.film-back,.sample-source>a,#genre-thriller div>a,#genre-drama div>a,#genre-documentary div>a,#genre-animation div>a,
.case-explanation>a.case-link,.edit-panel>a,.decision-panel>a{display:inline-block;min-height:44px;align-content:center}
.journey-index>a{min-width:44px}

/* v48 hover, following the reference hover rule. Solid buttons brighten, bordered controls and cards take a cyan
   border, text controls and summaries turn cyan, and the demo wordmark dims. All v48 surfaces here are dark. */
@media(hover:hover) and (pointer:fine){
  #demo-next,.demo-close>a.engine-primary,#film-play,#walkthrough-form>button,.demo-cut-switch>button{transition:filter .18s}
  #demo-next:hover,.demo-close>a.engine-primary:hover,#film-play:hover,#walkthrough-form>button:hover,.demo-cut-switch>button:hover{filter:brightness(1.08)}
  #demo-reset,#film-next,.demo-steps>button,.case-screen,.resource-feature,.resource-rows>a,#demo-genre,#walkthrough-form select{transition:border-color .18s,color .18s}
  #demo-reset:hover,#film-next:hover,.demo-steps>button:hover,.case-screen:hover,.resource-feature:hover,.resource-rows>a:hover,
  #demo-genre:hover,#walkthrough-form select:hover{border-color:var(--cyan)!important}
  .nav-more>summary,.engine-proof>summary,.cap-details summary,.pilot-timeline summary,.pilot-questions summary,.profile-list summary,
  .handoff-details summary,.demo-close>a:not(.engine-primary),.rail-foot>a,[id^=film-tab-]{transition:color .18s}
  .nav-more>summary:hover,.engine-proof>summary:hover,.cap-details summary:hover,.pilot-timeline summary:hover,.pilot-questions summary:hover,
  .profile-list summary:hover,.handoff-details summary:hover,.demo-close>a:not(.engine-primary):hover,.rail-foot>a:hover,
  [id^=film-tab-]:hover,[id^=film-tab-]:hover small,.case-screen:hover>span,.resource-rows>a:hover h3,.resource-feature:hover h2{color:var(--cyan)!important}
  .workspace-brand{transition:filter .18s}
  .workspace-brand:hover{filter:brightness(.82)}
  /* Genre tiles only zoom their image, which some pages turn off. The label sits on the photo, so it underlines
     instead of changing color and keeps its measured contrast. */
  .genre-strip a:hover>span{text-decoration:underline!important;text-underline-offset:4px}
}