/* A compact sales story that changes with the business. Scoped away from About. */
#hero.sales-hero {
    --sales-ink: #132b4c; --sales-muted: #61768f; --sales-blue: #106cdb;
    --sales-small: calc(var(--bs-body-font-size) * .72);
    --hero-display: clamp(calc(var(--bs-body-font-size) * 2.1), 9.3cqi, calc(var(--bs-body-font-size) * 3.1));
    background: radial-gradient(ellipse at 15% 40%, #edf5ff, transparent 48%), radial-gradient(ellipse at 98% 0, #f1f0ff77, transparent 43%), #fafcff;
    padding-block: 6.6rem 2.8rem; overflow: clip;
}
#hero.sales-hero .sales-hero-row { --bs-gutter-x: 3rem; }
#hero.sales-hero .hero-5-txt { max-width: 29rem; }
#hero.sales-hero .hero-5-txt h1 { font-size: var(--hero-display) !important; font-weight: 700; line-height: 1.28; letter-spacing: -.055em; color: var(--hero-ink); margin: 0; text-wrap: balance; overflow-wrap: normal; }
[dir="rtl"] #hero.sales-hero .hero-5-txt h1 { line-height: 1.5; letter-spacing: -.025em; }
#hero.sales-hero .hero-5-txt h1 > span + span { margin-block-start: 0; font-weight: 780; color: var(--sales-blue); }
@supports (background-clip: text) {
    #hero.sales-hero .hero-5-txt h1 > span + span { background-image: linear-gradient(100deg, #2678e2, #0756c1 70%, #078dab); background-clip: text; -webkit-background-clip: text; color: transparent; }
}
#hero.sales-hero .hero-5-txt > p.fs-18 { max-width: 37ch; font-size: var(--bs-body-font-size); line-height: 1.95; margin-block-start: 1.1rem; }
#hero .sales-eyebrow { display: flex; align-items: center; gap: .45rem; margin-block-end: .85rem; font-size: calc(var(--bs-body-font-size) * .78); font-weight: 600; color: #5279a8; }
#hero .sales-eyebrow > span { color: #167ee7; font-size: calc(var(--bs-body-font-size) * 1.2); }
#hero .sales-hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 1.35rem; margin-block-start: 1.6rem; }
#hero .sales-primary { display: inline-flex; align-items: center; gap: 1.6rem; padding: .7rem 1.1rem; border-radius: .65rem; border: 1px solid #146fdd; background: linear-gradient(135deg, #2087ec, #0756c7); color: #fff; box-shadow: inset 0 1px 0 #ffffff40, 0 4px 12px #096bd022; font-size: calc(var(--bs-body-font-size) * .87); font-weight: 650; transition: transform .2s; }
#hero .sales-primary:hover { color: #fff; transform: translateY(-2px); }
#hero .sales-primary > span { font-size: calc(var(--bs-body-font-size) * 1.1); }
[dir="rtl"] #hero .sales-primary > span { transform: scaleX(-1); }
#hero .sales-try { display: inline-flex; align-items: center; gap: .65rem; color: #456589; font-size: calc(var(--bs-body-font-size) * .85); font-weight: 600; }
#hero .sales-try:hover { color: #0b6bdb; }
[dir="ltr"] #hero .sales-try > span { transform: scaleX(-1); }
#hero .sales-symbols { position: absolute; width: 0; height: 0; overflow: hidden; }
#hero .sales-experience { position: relative; margin: 0; color: var(--sales-ink); text-align: start; scroll-margin-top: 6rem; isolation: isolate; container-type: inline-size; }
#hero .sales-scene { position: relative; aspect-ratio: 520 / 365; }
#hero .sales-scene svg:not(.sales-headphones):not(.sales-thread):not(.sales-object) { width: 1.1rem; height: 1.1rem; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
#hero .sales-orbit { position: absolute; left: 2%; top: 13%; width: 63%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle at 50% 50%, #dfeeffbb, #e9f3ff77 56%, transparent 57%); border: 1px solid #c7def544; }
#hero .sales-orbit::before { content: ''; position: absolute; inset: 11%; border-radius: 50%; border: 1px dashed #96bde53b; }
#hero .sales-orbit::after { content: ''; position: absolute; inset: -12%; border-radius: 50%; background-image: radial-gradient(#80a6d333 .75px, transparent .75px); background-size: 13px 13px; z-index: -1; mask-image: radial-gradient(circle, #000, transparent 68%); }
#hero .sales-thread { position: absolute; inset: 0; width: 100%; height: 100%; stroke: #7fa9da; stroke-width: 1.3; stroke-dasharray: 3 6; opacity: .65; }
#hero .sales-customer { position: absolute; right: 1%; top: 2%; width: 65%; display: flex; align-items: center; gap: .6rem; padding: .65rem .8rem; border: 1px solid #dde8f6; background: #ffffffed; border-radius: .85rem .85rem .15rem .85rem; box-shadow: 0 6px 20px -12px #355d9360; transform: rotate(-2deg); }
#hero .sales-customer-icon { display: grid; place-items: center; width: 1.8rem; height: 1.8rem; flex-shrink: 0; border-radius: .6rem; color: #199567; background: #e9f7f0; }
#hero .sales-customer-label { display: block; font-size: calc(var(--bs-body-font-size) * .59); color: #7b8ca1; margin-block-end: .05rem; }
#hero .sales-customer p { margin: 0; color: #304d71; font-size: clamp(calc(var(--bs-body-font-size) * .66), 2.35cqi, calc(var(--bs-body-font-size) * .77)); line-height: 1.75; }
#hero .sales-product-stage { position: absolute; left: -1%; top: 16%; width: 51%; text-align: center; transition: transform .45s ease; }
#hero .sales-headphones { display: block; width: 100%; height: auto; filter: drop-shadow(0 10px 7px #325e8d17); }
#hero .sales-art-frame { position: relative; width: 88%; margin-inline: auto; aspect-ratio: 260 / 255; }
#hero .sales-art { position: absolute; inset: 0; opacity: 0; transform: translateY(14px) scale(.87) rotate(-7deg); transition: opacity .55s, transform .65s cubic-bezier(.22, 1, .36, 1); pointer-events: none; }
#hero .sales-art.is-active { opacity: 1; transform: translateY(0) scale(1) rotate(0); }
#hero .sales-object { display: block; width: 100%; height: auto; filter: drop-shadow(0 8px 6px #325e8d12); }
#hero .sales-art.is-active .sales-art-accent { animation: sales-art-float 4.5s ease-in-out infinite; }
#hero .sales-experience.is-paused .sales-art-accent { animation-play-state: paused; }
#hero .sales-business-row { display: flex; align-items: center; justify-content: center; gap: .55rem; margin: 0 0 1rem; }
#hero .sales-business-row > span { font-size: calc(var(--bs-body-font-size) * .64); color: #6683a5; white-space: nowrap; }
#hero .sales-businesses { display: flex; gap: .12rem; border: 1px solid #d6e4f6; border-radius: 5rem; padding: .22rem; background: linear-gradient(180deg, #ffffffeb, #ecf4ffb5); box-shadow: inset 0 1px 0 #fff, 0 7px 20px -13px #21589466; }
#hero .sales-businesses button { display: inline-flex; align-items: center; justify-content: center; gap: .32rem; min-height: 2rem; border: 1px solid transparent; background: transparent; color: #6b83a1; font: inherit; font-size: calc(var(--bs-body-font-size) * .7); font-weight: 600; padding: .28rem .62rem; border-radius: 5rem; line-height: 1.4; white-space: nowrap; transition: color .2s, background .2s, box-shadow .2s; }
#hero .sales-businesses svg { display: block; width: .8rem; height: .8rem; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
#hero .sales-businesses button[aria-pressed="true"] { color: #fff; border-color: #2164af; background: linear-gradient(140deg, #338fe6, #1b5aa8); box-shadow: inset 0 1px 0 #ffffff40, 0 3px 7px #1557a52b; }
#hero .sales-businesses button:hover:not([aria-pressed="true"]) { color: #185faa; background: #dcecff88; }
#hero .sales-motion { width: 2.05rem; height: 2.05rem; flex: 0 0 2.05rem; display: grid; place-items: center; background: linear-gradient(150deg, #fff, #ecf4ff); color: #497aaf; border: 1px solid #c9ddf4; border-radius: 50%; padding: 0; box-shadow: inset 0 1px 0 #fff, 0 3px 8px #245f9e0d; transition: border-color .2s, color .2s, box-shadow .2s; }
#hero .sales-motion svg { display: block; width: .85rem; height: .85rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
#hero .sales-motion:hover { color: #135fb5; border-color: #78a9df; box-shadow: 0 3px 10px #245f9e1a; }
#hero .sales-motion[hidden] { display: none; }
#hero .sales-product-caption { display: flex; flex-direction: column; align-items: center; width: 78%; gap: .05rem; margin: -.4rem auto 0 0; padding: .22rem .5rem; border: 1px solid #d7e5f4; border-radius: .65rem; background: #ffffffab; box-shadow: 0 3px 8px #203d6005; }
#hero .sales-product-caption strong { color: #315985; font-size: calc(var(--bs-body-font-size) * .8); letter-spacing: -.03em; }
#hero .sales-product-caption > span { color: #5b7ba0; font-size: calc(var(--bs-body-font-size) * .65); }
#hero .sales-product-detail { display: block; width: 78%; margin: .25rem auto 0 0; font-size: calc(var(--bs-body-font-size) * .63); color: #6d88a6; }
#hero .sales-answer { position: absolute; right: 0; top: 27%; width: 55%; padding: .7rem .85rem; border-radius: .95rem .95rem .95rem .18rem; color: #fff; background: linear-gradient(135deg, #215b9a, #10386e 65%, #143862); border: 1px solid #3a6da7; box-shadow: inset 0 1px 0 #ffffff26, 0 12px 28px -13px #153f8077; }
#hero .sales-answer-heading { display: flex; gap: .5rem; align-items: center; }
#hero .sales-agent-mark { display: grid; place-items: center; width: 1.9rem; height: 1.9rem; background: #ffffff12; border: 1px solid #ffffff30; border-radius: .65rem; color: #c8e5ff; }
#hero .sales-answer-heading strong { color: #fff; font-size: calc(var(--bs-body-font-size) * .86); line-height: 1.6; }
#hero .sales-answer-heading small { display: block; color: #a6c9ed; font-size: calc(var(--bs-body-font-size) * .55); font-weight: 400; line-height: 1.5; }
#hero .sales-answer-spark { margin-inline-start: auto; color: #a6d5ff; opacity: .65; }
#hero .sales-answer > p { margin: .55rem 0 .65rem; font-size: clamp(calc(var(--bs-body-font-size) * .69), 2.45cqi, calc(var(--bs-body-font-size) * .82)); color: #e9f3ff; line-height: 1.8; min-height: 5.4em; }
#hero .sales-knowledge { display: flex; align-items: center; gap: .3rem; border-top: 1px solid #ffffff17; padding-block-start: .5rem; color: #a1c5ee; font-size: calc(var(--bs-body-font-size) * .58); line-height: 1.6; }
#hero .sales-knowledge svg { width: .75rem !important; height: .75rem !important; }
#hero .sales-result { position: absolute; right: 3%; bottom: 0; width: 53%; display: flex; align-items: center; gap: .5rem; background: #fffffff5; border: 1px solid #d9e8e5; box-shadow: 0 7px 17px -11px #325b8566; border-radius: .7rem; padding: .65rem .7rem; }
#hero .sales-result-icon { display: grid; place-items: center; width: 1.8rem; height: 1.8rem; flex-shrink: 0; background: #e9f7f1; color: #2b9473; border-radius: .55rem; }
#hero .sales-result strong { display: block; color: #3b7263; font-size: calc(var(--bs-body-font-size) * .72); font-weight: 650; line-height: 1.7; }
#hero .sales-result [data-sales-skill] { display: block; color: #6a8c84; font-size: calc(var(--bs-body-font-size) * .6); line-height: 1.7; }
#hero .sales-result-tick { margin-inline-start: auto; color: #7eab9f; font-size: calc(var(--bs-body-font-size) * .78); }
#hero .sales-scene[data-product="budget"] { --product-light: #d3b78e; --product-mid: #a68559; --product-dark: #6b5338; }
#hero .sales-scene[data-situation="order"] .sales-result { background: #f0fbf5; border-color: #a5d7c1; box-shadow: 0 5px 20px -10px #24926755; }
#hero .sales-scene[data-situation="order"] .sales-result-icon { background: #249875; color: #fff; }
#hero .sales-interaction { margin: 1rem .2rem 0; }
#hero .sales-interaction > p { display: flex; align-items: center; justify-content: center; gap: .5rem; margin: 0 0 .55rem; font-size: calc(var(--bs-body-font-size) * .68); color: #6783a5; line-height: 1.7; }
#hero .sales-interaction > p > span { display: inline-block; color: #88a6ca; transform: rotate(-12deg); font-size: calc(var(--bs-body-font-size) * 1.1); }
#hero .sales-choices { display: flex; justify-content: center; gap: .4rem; }
#hero .sales-choices button { display: inline-flex; align-items: center; justify-content: center; gap: .65rem; padding: .48rem .65rem; border-radius: .55rem; border: 1px solid #d8e4f4; color: #587595; background: #ffffffb5; font: inherit; font-size: calc(var(--bs-body-font-size) * .73); font-weight: 550; line-height: 1.6; transition: background .2s, border-color .2s, transform .2s; }
#hero .sales-choices button > span { color: #8ca4c2; font-size: calc(var(--bs-body-font-size) * .75); }
#hero .sales-choices button[aria-pressed="true"] { color: #175eaf; background: #eaf3ff; border-color: #91bbea; box-shadow: 0 2px 6px #2d6ebb08; }
#hero .sales-choices button:hover { background: #eaf3ff; border-color: #7faee6; transform: translateY(-2px); }
#hero .sales-choices button[data-sales-situation="order"][aria-pressed="true"] { background: #eaf8f0; border-color: #96ceb5; color: #278061; }
#hero .sales-experience figcaption { color: #798da5; font-size: calc(var(--bs-body-font-size) * .56); text-align: center; line-height: 1.7; margin: .7rem 0 0; }
#hero .sales-experience noscript p { font-size: var(--sales-small); }
#hero .sales-experience button:focus-visible, #hero .sales-try:focus-visible, #hero .sales-primary:focus-visible { outline: 2px solid #2c7edc; outline-offset: 4px; }
#hero .sales-scene.is-changing .sales-customer { animation: sales-question .4s both; }
#hero .sales-scene.is-changing .sales-answer { animation: sales-answer .55s both; }
#hero .sales-scene.is-changing .sales-product-stage { animation: sales-product .55s both; }
#hero .sales-scene.is-changing .sales-result { animation: sales-result .6s both; }
#hero .sales-scene.is-changing .sales-thread { animation: sales-thread .6s both; }
@keyframes sales-question { from { opacity: .3; transform: translateY(-8px) rotate(-2deg); } to { opacity: 1; transform: translateY(0) rotate(-2deg); } }
@keyframes sales-answer { from { opacity: .35; transform: translateY(8px) scale(.985); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes sales-product { 0% { transform: translateY(0); } 40% { transform: translateY(-7px) rotate(-3deg); } 100% { transform: translateY(0); } }
@keyframes sales-result { 0%, 25% { opacity: 0; transform: translateY(-9px); } 100% { opacity: 1; transform: translateY(0); } }
@keyframes sales-thread { from { stroke-dashoffset: 50; opacity: 1; } to { stroke-dashoffset: 0; opacity: .65; } }
@keyframes sales-art-float { 50% { translate: 0 -5px; } }
@media (min-width: 1400px) {
    #hero.sales-hero { padding-block: 7.5rem 3.5rem; }
    #hero .sales-experience { max-width: 34rem; margin-inline: auto; }
}
@media (min-width: 992px) and (max-width: 1199px) {
    #hero.sales-hero { padding-block-start: 10.5rem; }
    #hero.sales-hero .sales-hero-row { --bs-gutter-x: 2rem; }
    #hero .sales-business-row > span { display: none; }
    #hero .sales-scene { aspect-ratio: 490 / 370; }
    #hero .sales-answer { top: 28%; width: 57%; padding: .7rem; }
    #hero .sales-product-stage { top: 19%; }
}
@media (max-width: 991px) {
    #hero.sales-hero { padding-block: 2rem 2.5rem; }
    #hero.sales-hero .hero-5-txt { max-width: 34rem; }
    #hero .sales-eyebrow, #hero .sales-hero-actions { justify-content: center; }
    #hero .sales-hero-preview { margin: 2.5rem auto 0; max-width: 36rem; }
}
@media (max-width: 575px) {
    #hero.sales-hero { padding-block: 1.8rem 2rem; --hero-display: clamp(calc(var(--bs-body-font-size) * 2), 10.4cqi, calc(var(--bs-body-font-size) * 2.5)); }
    #hero.sales-hero .container { padding-inline: 1.1rem; }
    #hero.sales-hero .hero-5-txt > p.fs-18 { font-size: calc(var(--bs-body-font-size) * .92); line-height: 1.9; margin-block-start: .8rem; }
    #hero .sales-eyebrow { font-size: calc(var(--bs-body-font-size) * .72); }
    #hero .sales-hero-actions { margin-block-start: 1.2rem; }
    #hero .sales-hero-preview { margin-block-start: 2rem; }
    #hero .sales-scene { aspect-ratio: auto; height: 23.5rem; }
    #hero .sales-customer { width: 83%; top: 1%; right: 1%; padding: .6rem .7rem; }
    #hero .sales-customer p { font-size: calc(var(--bs-body-font-size) * .75); }
    #hero .sales-product-stage { left: 0; top: 21%; width: 53%; }
    #hero .sales-orbit { left: -7%; top: 17%; width: 75%; }
    #hero .sales-answer { top: 34%; right: 0; width: 63%; padding: .7rem; }
    #hero .sales-answer > p { font-size: calc(var(--bs-body-font-size) * .74); min-height: 7.2em; margin-block: .45rem; }
    #hero .sales-answer-heading small { display: none; }
    #hero .sales-agent-mark { width: 1.6rem; height: 1.6rem; }
    #hero .sales-result { bottom: 0; right: 1%; width: 68%; padding: .55rem; }
    #hero .sales-product-caption { width: 68%; padding-inline: .35rem; }
    #hero .sales-product-detail { width: 68%; line-height: 1.6; font-size: calc(var(--bs-body-font-size) * .62); }
    #hero .sales-thread { display: none; }
    #hero .sales-choices { gap: .3rem; }
    #hero .sales-choices button { gap: .4rem; padding: .5rem .45rem; font-size: calc(var(--bs-body-font-size) * .71); }
    #hero .sales-interaction > p { font-size: calc(var(--bs-body-font-size) * .72); }
    #hero .sales-experience figcaption { font-size: calc(var(--bs-body-font-size) * .59); }
    #hero .sales-business-row { gap: .4rem; }
    #hero .sales-businesses button { padding-inline: .42rem; gap: .25rem; font-size: calc(var(--bs-body-font-size) * .68); }
    #hero .sales-business-row > span { display: none; }
}
@media (max-width: 359px) {
    #hero .sales-scene { height: 25rem; }
    #hero .sales-answer { width: 65%; top: 34%; }
    #hero .sales-customer { width: 92%; }
    #hero .sales-product-stage { top: 23%; width: 52%; }
    #hero .sales-product-caption, #hero .sales-product-detail { width: 65%; }
    #hero .sales-businesses button:not([aria-pressed="true"]) svg { display: none; }
    #hero .sales-choices button { gap: .25rem; font-size: calc(var(--bs-body-font-size) * .67); }
    #hero .sales-result { width: 78%; }
}
.theme--dark #hero.sales-hero { --sales-ink: #e4edfb; --sales-muted: #a6bdd8; background: radial-gradient(ellipse at 15% 40%, #1b3456, transparent 52%), #101a2a; }
.theme--dark #hero.sales-hero .hero-5-txt h1 > span + span { background: none; color: #8fbcff; }
.theme--dark #hero .sales-eyebrow, .theme--dark #hero .sales-try { color: #9dbde5; }
.theme--dark #hero .sales-orbit { background: radial-gradient(circle, #284c7677, #1d385a55 56%, transparent 57%); border-color: #47699344; }
.theme--dark #hero .sales-customer, .theme--dark #hero .sales-result, .theme--dark #hero .sales-product-caption { background: #203651; border-color: #375579; }
.theme--dark #hero .sales-customer p, .theme--dark #hero .sales-product-caption strong { color: #d2e4fc; }
.theme--dark #hero .sales-product-caption > span, .theme--dark #hero .sales-product-detail, .theme--dark #hero .sales-interaction > p { color: #9cbbdf; }
.theme--dark #hero .sales-result strong { color: #a4d8c3; }
.theme--dark #hero .sales-result [data-sales-skill] { color: #9dbeb4; }
.theme--dark #hero .sales-choices button { background: #203650; border-color: #3c597d; color: #abc6e9; }
.theme--dark #hero .sales-choices button[aria-pressed="true"] { background: #284c76; border-color: #6d9dd7; color: #d6e8ff; }
.theme--dark #hero .sales-scene[data-situation="order"] .sales-result { background: #1c4139; border-color: #437f6b; }
.theme--dark #hero .sales-choices button[data-sales-situation="order"][aria-pressed="true"] { background: #20493c; color: #b0e4cb; }
.theme--dark #hero .sales-businesses { background: #203650; border-color: #3c597d; }
.theme--dark #hero .sales-businesses button { color: #a8c4e7; }
.theme--dark #hero .sales-businesses { box-shadow: inset 0 1px 0 #ffffff0a, 0 7px 20px -13px #000; }
.theme--dark #hero .sales-businesses button[aria-pressed="true"] { background: linear-gradient(140deg, #338fe6, #1b5aa8); color: #fff; }
.theme--dark #hero .sales-businesses button:hover:not([aria-pressed="true"]) { background: #31547c; color: #d5e7ff; }
.theme--dark #hero .sales-motion { background: #203650; border-color: #47698e; color: #b5d3f5; box-shadow: inset 0 1px 0 #ffffff10; }
@media (prefers-reduced-motion: reduce) {
    #hero .sales-experience *, #hero .sales-primary { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
