/* Additions on top of the reference stylesheets: language switch, the visible Log in link, the
   Microsoft sign-in button, and right-to-left fixes. Keep reference CSS untouched - put overrides
   here so a re-import never loses them. */
.bp-nav-items .bp-lang,.bp-nav-items .bp-nav-login{font-weight:500;white-space:nowrap}
.bp-nav-items .bp-lang{border:1px solid currentColor;border-radius:999px;padding:.2rem .7rem;font-size:.85em;opacity:.85}
.bp-nav-items .bp-lang:hover{opacity:1}
.ms-signin{display:inline-flex;align-items:center;gap:.6rem;justify-content:center}
.ms-signin svg{flex:none}

/* RIGHT-TO-LEFT. dir="rtl" mirrors flex rows and text alignment on its own; these cover the
   places the reference positions things with physical left/right. */
[dir="rtl"] body{font-family:"Noto Kufi Arabic","Segoe UI","Tahoma",system-ui,sans-serif}
[dir="rtl"] .crumb span,[dir="rtl"] .bp-platform-link span[aria-hidden="true"]{transform:scaleX(-1)}
[dir="rtl"] .bp-platform-dropdown,[dir="rtl"] .bp-pages-dropdown{left:auto;right:0}
[dir="rtl"] .bp-faq-answer,[dir="rtl"] .prose,[dir="rtl"] .card{text-align:right}
[dir="rtl"] .article-toc{border-left:0;border-right:1px solid currentColor}

/* The skip link is for keyboard users: hidden until it receives focus. */
.skip{position:absolute;top:0;inset-inline-start:0;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;z-index:1000}
.skip:focus{width:auto;height:auto;clip-path:none;inset-inline-start:1rem;top:1rem;padding:.6rem 1rem;background:#111;color:#fff}

/* COLOUR CONTRAST (WCAG 2.1 AA, 4.5:1 for text). The reference stylesheets use several light grey/blue-grey text
   colours and pastel accents that measure 2.5-4.4:1 on their backgrounds. Same hues, darkened just enough to pass.
   Do not edit the reference CSS: change the values here. Verify with `npm run a11y -- dist --strict`. */
/* neutral grey text */
.module-tabs button:not([aria-selected=true]){color:#595960}
.stage-topline>span,.team-copy>p,.insight-section>p{color:#595960}
/* the "phase" dots animate their colour; the resting colour was #aaa/#999 */
.phase-track span{color:#5b6672}
@keyframes phase{0%,30%{color:#171717}34%,100%{color:#5b6672}}
@keyframes color-phase{0%,30%{color:var(--scene-accent)}34%,100%{color:#5b6672}}
/* blue-grey text (home, agents, discover, help) */
.bp-industry-heading .eyebrow,.bp-industry-heading>p,.bp-industry-tabs button:not([aria-selected=true]),.bp-industry-copy .eyebrow,
#industry-description,#industry-tags>li,.bp-knowledge .eyebrow,.bp-faq .eyebrow,.bp-knowledge-heading>p,.bp-resource-copy>p,
.bp-editorial-sheet>span,.bp-guide-sheet>span,.bp-guide-sheet>div,.bp-knowledge-quick>span,.bp-knowledge-quick>a,
.bi-number,.bi-role,.section-heading>p,.demo-frame-bar,.tender-result small,.score-breakdown,.demo-phase-strip small,
.page-how li>p,.page-related small,.workflow span,[id^=feature-]>div:first-child>p{color:#4b6075}
.bp-guide-sheet i{color:#6a5590}
.agent-handoff span{color:#3556c9}
/* page accent colours (text on the tinted backgrounds) */
body{--accent:#2f65a3}
body.theme-review{--accent:#6a4d94}
body.theme-prepare{--accent:#7d5a22}
body.theme-manage{--accent:#23695e}
body.theme-insights{--accent:#8f4f3d}

/* IMPORTED PAGES UNDER THE REDESIGNED CHROME (Book a demo, Request access, How it works, Help). They load this file
   and src/styles/bp.css; the :has(.s-head) scope keeps these rules off the pages that still use the old navigation. */
/* their heroes were padded to clear the old absolutely-positioned 78px bar; the sticky header is now in flow */
body.internal-page:has(.s-head) .inner-hero{padding-top:calc(115px - var(--header-h,72px))}
@media(max-width:760px){body.internal-page:has(.s-head) .inner-hero{padding-top:calc(105px - var(--header-h,72px))}}
/* designed on white; the redesigned base sets a tinted page colour */
body.internal-page:has(.s-head){background:#fff}
body.internal-page:has(.s-head) #search-count{color:#5f6b7a}
/* HERO of those pages: not in the reference design, so it follows the site's own pattern (the .s-hero block in
   src/styles/pages.css: gradient, 1320px content column, eyebrow, 5.6vw / 500 headline, 1.3vw lede). The scene image
   and its two cards beside the headline are decoration; the pattern is text only, so they are not drawn. */
body.internal-page:has(.s-head) .inner-hero{max-width:none;margin:0;overflow:visible;padding:clamp(56px,7vw,104px) 0 clamp(40px,5vw,72px);background:radial-gradient(1000px 500px at 85% 0%,#e6eefb,transparent 60%),radial-gradient(800px 400px at 0% 100%,#eef4fb,transparent 60%)}
body.internal-page:has(.s-head) .inner-hero>.visual-hero-grid{max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter)}
/* the artifact's heroes carry no visible breadcrumb (the BreadcrumbList JSON-LD stays in the head) */
body.internal-page:has(.s-head) .inner-hero>.crumb{display:none}
body.internal-page:has(.s-head) .visual-hero-grid{display:block}
body.internal-page:has(.s-head) .visual-scene{display:none}
body.internal-page:has(.s-head) .visual-hero-copy .kicker{display:flex;align-items:center;gap:12px;margin:0;font-size:12.5px;font-weight:600;letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--navy)}
body.internal-page:has(.s-head) .visual-hero-copy .kicker::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--teal);box-shadow:0 0 0 4px #3a9a9222}
body.internal-page:has(.s-head) .visual-hero-copy h1{margin:20px 0 0;max-width:14em;font-weight:500;font-size:clamp(40px,5.6vw,84px);line-height:1;letter-spacing:-.058em;text-wrap:balance}
body.internal-page:has(.s-head) .visual-hero-copy>p{margin:22px 0 0;max-width:40em;font-size:clamp(16.5px,1.3vw,20px);line-height:1.7;color:var(--ink-2)}
body.internal-page:has(.s-head) .hero-shortcuts{margin-top:28px}
:lang(ar) body.internal-page:has(.s-head) .visual-hero-copy h1,body.internal-page:has(.s-head):lang(ar) .visual-hero-copy h1,[dir="rtl"] body.internal-page:has(.s-head) .visual-hero-copy h1{line-height:1.3;font-size:clamp(36px,5vw,72px)}
[dir="rtl"] body.internal-page:has(.s-head) .visual-hero-copy>p{line-height:1.95}
/* one typeface across the site: these pages inherited DM Sans (and Noto Kufi Arabic in Arabic) from the reference CSS */
body.internal-page:has(.s-head){font-family:var(--font-body)}
