/* Enduris shared theme (was inline en-fonts/en-theme) — shared so AJAX page transitions keep styling */ :root{--color-black:10,9,18;--color-orange:212,43,30;}@font-face{font-family:"Geist";src:url(fonts/geist/geist-400.woff2) format("woff2");font-weight:400;font-display:swap}@font-face{font-family:"Geist";src:url(fonts/geist/geist-500.woff2) format("woff2");font-weight:500;font-display:swap}@font-face{font-family:"Geist";src:url(fonts/geist/geist-600.woff2) format("woff2");font-weight:600;font-display:swap}@font-face{font-family:"Geist Mono";src:url(fonts/geist/geistmono-500.woff2) format("woff2");font-weight:500;font-display:swap}@font-face{font-family:"Instrument Serif";src:url(fonts/geist/instrumentserif-400.woff2) format("woff2");font-weight:400;font-display:swap}body{font-family:"Geist",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif!important}.pretitle{font-family:"Geist Mono",ui-monospace,Menlo,monospace!important;font-size:clamp(12px,.9vw,14px)!important;font-weight:500!important;letter-spacing:.07em!important;line-height:1.1!important}.home__hero.bg--orange,.home__video.bg--orange,.prefooter.bg--orange{background-color:#0A0912!important}.home__hero .hero__title,.home__hero .hero__claim,.home__hero .pretitle,.home__hero .tag__name,.home__hero .tag__data,.home__hero .menu__item__link span,.prefooter .title,.prefooter .text__description,.prefooter .pretitle,.home__video .pretitle,.home__video .float--subtitle .pretitle{color:#e8e8ea!important}.home__hero .hero__logo,.home__hero .hero__logo__mobile{fill:#e8e8ea!important}.home__hero .button--full.button--black{background-color:#e8e8ea!important}.home__hero .button--full.button--black .button__text span{color:#0A0912!important}.home__hero .button--full.button--black .button-arrow{fill:#0A0912!important}.home__hero .hero__tags,.home__hero .hero__logo__container{border-color:rgba(232,232,234,.18)!important}.home__hero__column--left{grid-column:1/-1!important}.home__hero .hero__tags,.home__hero .hero__logo__container{display:none}.c__square{background-color:#6b6b73!important}.page__footer .menu__item__link,.page__footer .copyright,.page__footer .subfooter,.page__footer .subfooter a,.page__footer .pretitle,.page__footer .menu__langs,.page__footer .lang--active{color:#fff!important}.page__footer .footer__logo__inner svg{fill:#fff!important}.page__footer .c__square{background-color:#fff!important}.cta--dark{background-color:#0A0912!important}.cta--dark .title{color:#e8e8ea!important}.cta--dark .text__description{color:#9a9aa1!important}.cta--dark .pretitle{color:#9a9aa1!important}.cta--dark .c__square{background-color:#6b6b73!important}.cta--dark .button--full.button--black{background-color:#e8e8ea!important}.cta--dark .button--full.button--black .button__text span{color:#0A0912!important}.cta--dark .button--full.button--black .button-arrow{fill:#0A0912!important}.enduris-demo{--bg:#0a0a0b;--bg-1:#101012;--bg-2:#15151a;--line:#1f1f24;--line-2:#2a2a30;--ink-0:#fff;--ink-1:#e8e8ea;--ink-2:#9a9aa1;--ink-3:#6b6b73;--ink-4:#45454c;--red:#d42b1e;--sans:"Geist",-apple-system,BlinkMacSystemFont,sans-serif;--mono:"Geist Mono",ui-monospace,Menlo,monospace}.enduris-demo .chat{box-shadow:0 40px 90px -50px rgba(10,9,18,.45);border-radius:3px} /* Reduced motion */ @media (prefers-reduced-motion: reduce) { .enduris-demo *, .enduris-demo *::before, .enduris-demo *::after { animation-duration: 0.001ms !important; transition-duration: 0.001ms !important; } }.sec--dark{background-color:#0A0912}.sec--dark .title{color:#f2f1ec!important}.sec--dark .text__description{color:#b9b9c0!important}.sec--dark .text__description p{color:#b9b9c0!important}.sec--dark .pretitle{color:#8b8b93!important}.sec--dark .c__square{background-color:#6b6b73!important}.sec--dark .sec--dark__rule{border-top:1px solid rgba(255,255,255,.14);padding-top:clamp(2.5rem,5vh,4rem)}.home__hero{min-height:60vh;display:flex;align-items:flex-end}.home__hero>.wrp{width:100%}.home__hero .home__hero__inner{padding-bottom:clamp(2rem,4vh,3.5rem)}.home__hero .hero__title{max-width:calc(50% - (var(--grid-gutter) / 2));margin-top:clamp(1.5rem,3vh,2.5rem)}@media(min-width:981px){.header__logo__link .header__logo__text{display:inline-flex}}.header__logo__link{flex-direction:row!important;flex-wrap:nowrap!important;align-items:center!important;gap:0!important}.header__logo__link .header__logo__symbol,.header__logo__link .header__logo__text{height:1rem;align-items:center}.header__logo__link span svg{height:100%!important;width:auto!important;display:block}.prob-scroll .graph-morph__sticky{display:block!important;position:sticky;top:0;height:100vh;overflow:hidden}.prob-scroll .home-morph__inner{position:absolute!important;inset:0;display:block!important;width:100%;height:100%;place-items:initial}.prob-scroll canvas{width:100%!important;height:100%!important;object-fit:cover;display:block}.prob-scroll__scrim{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(10,9,18,.6) 0%,rgba(10,9,18,.12) 32%,rgba(10,9,18,.22) 58%,rgba(10,9,18,.9) 100%)}.prob-scroll__overlay{position:absolute;inset:0;pointer-events:none}.prob-scroll__overlay .wrp{height:100%;display:flex;flex-direction:column;justify-content:space-between;box-sizing:border-box;padding-top:calc(var(--header-height) + 2.5rem);padding-bottom:clamp(2.5rem,5vh,4rem)}.prob-scroll__head .title{color:#f2f1ec;max-width:15ch;margin-top:1rem}.prob-scroll__steps{position:relative;min-height:13rem}.prob-scroll__step{position:absolute;left:0;bottom:0;max-width:42ch;opacity:0;transform:translateY(14px);transition:opacity .6s var(--ease),transform .6s var(--ease)}.prob-scroll__step.is-active{opacity:1;transform:none}.prob-scroll__step .pretitle{color:#9a9aa1!important}.prob-scroll__step h3{color:#f2f1ec;margin-top:.6rem}.prob-scroll__step .text__description{color:#c4c4cb!important;margin-top:.75rem}.whynow-img{position:relative;overflow:visible}.whynow-img>.parallax__container{position:absolute!important;inset:0;z-index:0;height:100%}.whynow-img .image--back{position:absolute;inset:0;height:100%;width:100%}.whynow-img .image--back img{width:100%;height:100%;object-fit:cover}.whynow-img__scrim{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(10,9,18,.93) 0%,rgba(10,9,18,.74) 42%,rgba(10,9,18,.32) 100%)}.whynow-img>.wrp{position:relative;z-index:2}cross-image .cross{display:none!important}.enduris-demo .chat{border:1px solid rgba(255,255,255,.13)!important} .default__hero.bg--orange{background-color:#0A0912!important}.default__hero.bg--orange .title,.default__hero.bg--orange .hero__title,.default__hero.bg--orange .text__description,.default__hero.bg--orange .text__description p,.default__hero.bg--orange .pretitle{color:#e8e8ea!important}.bg--black .title,.bg--black h1,.bg--black h2,.bg--black h3,.bg--black h4{color:#f2f1ec!important} /* Opportunity: text flush-left in its column (remove the "right" 33% indent) */ .matrix--flush.matrix__section.right .matrix__main{padding-left:0!important} .matrix--flush.matrix__section.right .matrix__main .text__description{padding-right:0!important} /* Value: red strip on the HEADER only; numbered list stays light */ .list__block.sec--red > .pt--medium{background-color:#d42b1e!important;padding-top:clamp(1.75rem,3.5vh,2.5rem);padding-bottom:clamp(1.75rem,3.5vh,2.5rem)} .list__block.sec--red > .pt--medium .block__inner{padding-top:0;padding-bottom:0} .list__block.sec--red > .pt--medium .section__header{display:flex;flex-direction:column;justify-content:space-between;min-height:clamp(380px,52vh,640px);margin-bottom:0} .list__block.sec--red > .pt--medium .title,.list__block.sec--red > .pt--medium h2,.list__block.sec--red > .pt--medium .section__text,.list__block.sec--red > .pt--medium .section__text p{color:#fff!important} .list__block.sec--red > .pt--medium .pretitle{color:rgba(255,255,255,.8)!important} .list__block.sec--red > .pt--medium .c__square{background-color:#fff!important} /* Value list section (homepage): white background instead of grey-50 — section + the items (which carry their own grey). Item divider colour (grey-200) is left intact. */ [data-page="home"] .list--method{background-color:rgb(var(--color-white))!important} [data-page="home"] .list--method .list__item{background:rgb(var(--color-white))!important} /* cross-image masking reveal: bottom-to-top (initial state mostly clipped from top) */ .crossimg{clip-path:inset(90% 1.25rem 1.25rem 1.25rem)} /* Content images get a small rounded corner (matches the button radius). Background/cover images (.image--back, full-bleed parallax) are intentionally left sharp. The .crossimg clip-path images are rounded via `round var(--border-radius)` in the JS. */ .stack__item__image, .toggle__image, .intro__image{border-radius:var(--border-radius);overflow:hidden} /* Proof: white section background, dark cards/notes */ .post-it__section--method.post-it--light{background:#fff!important} .post-it--light .post-it__item{background:#0A0912!important;color:#e8e8ea!important;aspect-ratio:auto!important;border:1px solid rgba(255,255,255,.08)} .post-it--light .post-it__item .title,.post-it--light .post-it__item h3{color:#f2f1ec!important} .post-it--light .post-it__item .text__description,.post-it--light .post-it__item .text__description p{color:#9a9aa1!important} .post-it--light .post-it__item .pretitle{color:#8b8b93!important} .post-it--light .post-it__item .c__square{background-color:#d42b1e!important} /* ===== Enduris parts copilot demo (.endemo) ===== */ .endemo,.endemo *,.endemo *::before,.endemo *::after{box-sizing:border-box} .endemo{--e:cubic-bezier(.2,.7,.2,1);display:flex;flex-direction:column;height:900px;background:#0d0c14;border:1px solid rgba(255,255,255,.1);border-radius:10px;overflow:hidden; font-family:"Geist",-apple-system,BlinkMacSystemFont,sans-serif;color:#e8e8ea;line-height:1.45;letter-spacing:normal;box-shadow:0 50px 110px -55px rgba(0,0,0,.78);transition:opacity .46s var(--e)} .endemo.resetting{opacity:0} .endemo svg{display:block} /* top context bar */ .endemo__top{flex:0 0 auto;display:flex;align-items:center;gap:8px;padding:11px 16px;background:#0b0a11;border-bottom:1px solid rgba(255,255,255,.07);font-size:12px;color:#6b6b73;min-width:0} .endemo__crumb{color:#6b6b73} .endemo__sep{color:#3a3a42} .endemo__vin{font-family:"Geist Mono",ui-monospace,monospace;font-size:12px;font-weight:500;letter-spacing:-.01em;color:#e8e8ea;font-variant-numeric:tabular-nums} .endemo__recall{display:inline-flex;align-items:center;gap:4px;font-family:"Geist Mono",monospace;font-size:9.5px;letter-spacing:.04em;text-transform:uppercase;color:#f08a7e;background:rgba(212,43,30,.15);padding:3px 7px;border-radius:5px} .endemo__meta{color:#54545c;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0} /* main: catalog + detail panel, with the dock pinned across the bottom */ .endemo__main{position:relative;flex:1 1 auto;min-height:0;display:flex;padding-bottom:50px;overflow:hidden} /* catalog backdrop */ .endemo__catalog{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;border-right:1px solid rgba(255,255,255,.07)} .endemo__filter{flex:0 0 auto;display:flex;align-items:center;gap:8px;padding:9px 16px;border-bottom:1px solid rgba(255,255,255,.05)} .endemo__search{flex:0 1 230px;font-size:11.5px;color:#54545c;border:1px solid rgba(255,255,255,.07);border-radius:7px;padding:5px 10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .endemo__fchip{font-size:10.5px;color:#6b6b73;border:1px solid rgba(255,255,255,.06);border-radius:7px;padding:5px 9px;white-space:nowrap} .endemo__rows{flex:1 1 auto;min-height:0;overflow:hidden;-webkit-mask-image:linear-gradient(180deg,#000 80%,transparent);mask-image:linear-gradient(180deg,#000 80%,transparent)} .endemo__cgroup{display:flex;align-items:center;gap:8px;padding:7px 16px;background:rgba(255,255,255,.018);border-bottom:1px solid rgba(255,255,255,.05);font-family:"Geist Mono",monospace;font-size:9.5px;letter-spacing:.07em;text-transform:uppercase;color:#6b6b73} .endemo__cgroup em{margin-left:auto;font-style:normal;color:#45454c} .endemo__crow{display:grid;grid-template-columns:108px minmax(0,1fr) 112px 32px 68px;gap:10px;align-items:center;padding:7px 16px;border-bottom:1px solid rgba(255,255,255,.035);font-size:11.5px} .endemo__crow.is-flag{background:rgba(212,43,30,.07)} .endemo__cpn{font-family:"Geist Mono",monospace;font-size:10.5px;letter-spacing:-.02em;color:#9a9aa1} .endemo__cname{color:#c4c4cb;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .endemo__csup{color:#6b6b73;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .endemo__cqty{color:#54545c;text-align:right;font-family:"Geist Mono",monospace;font-size:10.5px} .endemo__cprice{color:#c4c4cb;text-align:right;font-family:"Geist Mono",monospace;font-size:10.5px} /* part detail panel (right pane) */ .endemo__detail{flex:0 0 452px;width:452px;display:flex;flex-direction:column;min-height:0;background:#0c0b12} .epd__head{flex:0 0 auto;display:flex;flex-direction:column;gap:5px;padding:13px 16px;border-bottom:1px solid rgba(255,255,255,.07)} .epd__idline{display:flex;align-items:center;gap:7px} .epd__pn{display:inline-flex;align-items:center;gap:6px;font-family:"Geist Mono",monospace;font-size:13px;font-weight:600;letter-spacing:-.01em;color:#f2f1ec} .epd__pn svg{width:13px;height:13px;color:#54545c} .epd__badge{font-family:"Geist Mono",monospace;font-size:8.5px;letter-spacing:.05em;text-transform:uppercase;color:#9a9aa1;background:rgba(255,255,255,.07);padding:3px 6px;border-radius:5px} .epd__badge--recall{color:#f08a7e;background:rgba(212,43,30,.15)} .epd__title{font-size:14px;font-weight:500;color:#e8e8ea;margin:1px 0 0;line-height:1.3} .epd__sub{font-size:11px;line-height:1.5;color:#6b6b73} .epd__sub b{font-weight:500;color:#9a9aa1;font-family:"Geist Mono",monospace} .epd__mono{font-family:"Geist Mono",monospace;color:#9a9aa1} .epd__scroll{flex:1 1 auto;min-height:0;overflow:hidden;-webkit-mask-image:linear-gradient(180deg,#000 92%,transparent);mask-image:linear-gradient(180deg,#000 92%,transparent)} .epd__sec{padding:13px 16px;border-bottom:1px solid rgba(255,255,255,.06)} .epd__sec--recall .epd__sechd{color:#f08a7e} .epd__sechd{display:flex;align-items:baseline;justify-content:space-between;gap:8px;font-size:12px;font-weight:500;color:#c4c4cb} .epd__sechd em{font-style:normal;font-family:"Geist Mono",monospace;font-size:9.5px;letter-spacing:.04em;color:#6b6b73} .epd__avail{color:#9a9aa1!important} .epd__rtext{margin:9px 0 0;font-size:11.5px;line-height:1.5;color:#9a9aa1} .epd__price{display:flex;align-items:baseline;gap:8px;margin-top:10px;font-size:24px;font-weight:600;color:#f2f1ec;font-variant-numeric:tabular-nums;line-height:1} .epd__price span{font-size:11px;font-weight:400;color:#6b6b73} .epd__note{margin:6px 0 0;font-size:11px;line-height:1.5;color:#6b6b73} .epd__imgs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:11px} .epd__img{display:flex;flex-direction:column;gap:5px} .epd__img>img,.epd__img>svg{aspect-ratio:1;width:100%;border-radius:7px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03)} .epd__img>img{object-fit:cover} .epd__img>svg{padding:22px;color:#3a3a42} .epd__img em{font-style:normal;font-size:9px;color:#54545c} .epd__rows{margin-top:9px;display:flex;flex-direction:column} .epd__row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:6px 0;border-top:1px solid rgba(255,255,255,.05);font-size:12px} .epd__row:first-child{border-top:0} .epd__row span{color:#6b6b73} .epd__row b{font-weight:500;color:#c4c4cb} .epd__lin{display:grid;grid-template-columns:78px minmax(0,1fr) auto;gap:10px;align-items:start;padding:8px 0;border-top:1px solid rgba(255,255,255,.05)} .epd__lin:first-of-type{margin-top:9px} .epd__linstate{font-family:"Geist Mono",monospace;font-size:9px;letter-spacing:.04em;text-transform:uppercase;color:#6b6b73;padding-top:1px} .epd__linstate.is-current{color:#e8e8ea;background:rgba(255,255,255,.09);border-radius:5px;padding:2px 6px;justify-self:start} .epd__linbody{display:flex;flex-direction:column;gap:1px;min-width:0} .epd__linbody b{font-family:"Geist Mono",monospace;font-size:11.5px;font-weight:500;color:#c4c4cb} .epd__linbody i{font-style:normal;font-size:11px;color:#6b6b73;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .epd__lindate{font-family:"Geist Mono",monospace;font-size:9.5px;color:#54545c} .epd__foot{flex:0 0 auto;display:flex;align-items:center;gap:10px;padding:11px 16px;border-top:1px solid rgba(255,255,255,.08);background:#0b0a11} .epd__qty{display:inline-flex;align-items:center;gap:2px;border:1px solid rgba(255,255,255,.12);border-radius:8px;padding:2px} .epd__qty span{display:grid;place-items:center;width:24px;height:24px;border-radius:6px;color:#9a9aa1} .epd__qty span svg{width:14px;height:14px} .epd__qty b{min-width:22px;text-align:center;font-family:"Geist Mono",monospace;font-size:12px;font-weight:500;color:#e8e8ea} .epd__addbtn{flex:1;text-align:center;font-size:12px;font-weight:600;color:#0a0912;background:#e8e8ea;border-radius:8px;padding:8px 12px} /* floating chat popover — the focus; fixed size, placed over its dock tab via JS */ .endemo__chat{position:absolute;left:18px;bottom:64px;width:464px;height:712px;display:flex;flex-direction:column;background:#16151f;border:1px solid rgba(255,255,255,.11);border-radius:14px;overflow:hidden;box-shadow:0 36px 80px -26px rgba(0,0,0,.74);z-index:5} .endemo__chathead{flex:0 0 auto;display:flex;align-items:center;gap:8px;padding:13px 16px;border-bottom:1px solid rgba(255,255,255,.06);font-size:13px;font-weight:600;color:#e8e8ea} .endemo__live{width:7px;height:7px;border-radius:50%;background:#d42b1e;animation:endemo-pulse 2.4s ease-in-out infinite} .endemo__thread{flex:1 1 auto;min-height:0;overflow-y:auto;padding:18px 16px;display:flex;flex-direction:column;gap:16px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.16) transparent} .endemo__thread::-webkit-scrollbar{width:5px} .endemo__thread::-webkit-scrollbar-thumb{background:rgba(255,255,255,.16);border-radius:999px} /* composer + send button */ .endemo__composer{flex:0 0 auto;display:flex;align-items:center;gap:9px;padding:11px 14px;border-top:1px solid rgba(255,255,255,.06)} .endemo__attach{flex:0 0 auto;width:0;height:32px;border-radius:7px;overflow:hidden;opacity:0;border:1px solid transparent;transition:width .34s var(--e),opacity .34s var(--e)} .endemo__attach img{width:100%;height:100%;object-fit:cover} .endemo__attach.show{width:42px;opacity:1;border-color:rgba(255,255,255,.14)} .endemo__field{flex:1 1 auto;min-width:0;position:relative;display:flex;align-items:center;justify-content:flex-start;overflow:hidden;height:20px} .endemo__cplace{position:absolute;left:0;font-size:13px;color:#9a9aa1} .endemo__cplace.hide{display:none} .endemo__typed{font-size:13px;color:#e8e8ea;white-space:nowrap} .endemo__caret{flex:0 0 auto;display:none;width:1.5px;height:15px;margin-left:1px;background:#e8e8ea} .endemo__caret.on{display:inline-block;animation:endemo-blink 1.05s steps(1) infinite} .endemo__cam{flex:0 0 auto;display:grid;place-items:center;width:32px;height:32px;border-radius:8px;color:#6b6b73} .endemo__cam svg{width:18px;height:18px} .endemo__send{flex:0 0 auto;display:grid;place-items:center;width:32px;height:32px;border-radius:8px;color:#54545c;background:rgba(255,255,255,.06);transition:background .22s var(--e),color .22s var(--e),transform .14s var(--e)} .endemo__send svg{width:16px;height:16px} .endemo__send.ready{background:#e8e8ea;color:#0a0912} .endemo__send.press{transform:scale(.9)} /* dock — a real toolbar: filled "secondary" Ask + open tab, ghost tabs, cart button */ .endemo__dock{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;gap:6px;height:54px;padding:0 14px;background:#0b0a11;border-top:1px solid rgba(255,255,255,.07)} .endemo__ask{flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 13px;border-radius:8px;font-size:12.5px;font-weight:500;color:#e8e8ea;background:rgba(255,255,255,.09)} .endemo__ask svg{width:14px;height:14px;color:#c4c4cb} .endemo__tabs{flex:1 1 auto;min-width:0;display:flex;align-items:center;gap:4px;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 30px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 30px),transparent)} .endemo__tab{flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;max-width:212px;height:34px;padding:0 12px;border-radius:8px;font-size:12.5px;font-weight:400;color:#7d7d86;background:transparent} .endemo__tablabel{overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .endemo__tab.is-active{color:#e8e8ea;background:rgba(255,255,255,.09)} .endemo__tabx{flex:0 0 auto;display:grid;place-items:center;margin-right:-2px;color:#8b8b93} .endemo__tabx svg{width:13px;height:13px} .endemo__ro{flex:0 0 auto;display:flex;align-items:center;gap:10px;margin-left:auto;padding-left:14px;border-left:1px solid rgba(255,255,255,.08)} .endemo__cart{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 12px;border-radius:8px;font-size:12.5px;font-weight:500;color:#e8e8ea;background:rgba(255,255,255,.09)} .endemo__cart svg{width:15px;height:15px;color:#c4c4cb} .endemo__robadge{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:6px;background:rgba(255,255,255,.15);font-family:"Geist Mono",monospace;font-size:10.5px;font-weight:600;color:#fff;font-variant-numeric:tabular-nums} .endemo__rototal{font-family:"Geist Mono",monospace;font-size:12.5px;color:#e8e8ea;font-variant-numeric:tabular-nums} .endemo__ro.pulse .endemo__robadge,.endemo__ro.pulse .endemo__rototal{animation:endemo-bump .6s var(--e)} /* messages */ .emsg{opacity:0;transform:translateY(8px);transition:opacity .42s var(--e),transform .42s var(--e)} .emsg.in{opacity:1;transform:none} .emsg--user{align-self:flex-end;max-width:86%;text-align:right} .emsg--ai{align-self:stretch} .emsg__from{display:block;font-family:"Geist Mono",monospace;font-size:9px;letter-spacing:.13em;text-transform:uppercase;color:#6b6b73;margin-bottom:10px} .emsg__turn{display:flex;flex-direction:column;gap:12px} .emsg__body{font-size:13px;line-height:1.55;margin:0;color:#d4d4db} .rise{opacity:0;transform:translateY(6px);transition:opacity .42s var(--e),transform .42s var(--e)} .rise.in{opacity:1;transform:none} /* user photo */ .endemo__photo{display:inline-block;border-radius:11px;overflow:hidden;border:1px solid rgba(255,255,255,.14);line-height:0} .endemo__photo img{display:block;width:164px;height:122px;object-fit:cover;filter:blur(7px);transform:scale(1.06);transition:filter .6s var(--e),transform .6s var(--e)} .endemo__photo.crisp img{filter:none;transform:none} .endemo__cap{display:block;margin-top:8px;font-size:13px;line-height:1.45;color:#c4c4cb} .emsg__utext{display:inline-block;text-align:left;background:#26242f;color:#e8e8ea;border-radius:14px 14px 5px 14px;padding:9px 13px;font-size:13px;line-height:1.45} /* ── chat cards (.ecard) — quiet hierarchy, one full-bleed rule, no boxes/pills/rails ── */ .ecard{display:flex;flex-direction:column;gap:15px;width:100%;background:#1a1922;border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:16px} .ecard__id{display:flex;flex-direction:column;gap:4px} .ecard__name{font-size:14.5px;font-weight:600;line-height:1.25;letter-spacing:-.01em;color:#f4f3ee} .ecard__meta{font-family:"Geist Mono",monospace;font-size:11px;letter-spacing:-.01em;color:#8b8b93} .ecard__rule{height:1px;margin:-1px -16px 0;background:rgba(255,255,255,.07)} .ecard__conf{display:flex;flex-direction:column;gap:9px} .ecard__confhd{display:flex;align-items:baseline;justify-content:space-between} .ecard__confhd span{font-family:"Geist Mono",monospace;font-size:9.5px;letter-spacing:.07em;text-transform:uppercase;color:#8b8b93} .ecard__confhd b{font-family:"Geist Mono",monospace;font-size:13px;font-weight:600;color:#f4f3ee;font-variant-numeric:tabular-nums} .ecard__track{height:3px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden} .ecard__track i{display:block;height:100%;width:0;border-radius:99px;background:#e8e8ea;transition:width 1.1s var(--e)} .ecard__reason{margin:0;font-size:12px;line-height:1.55;color:#9a9aa1} .ecard__verify{display:inline-flex;align-items:center;gap:7px;font-size:11px;color:#b4b4bb;opacity:0;transform:translateY(3px);transition:opacity .4s var(--e),transform .4s var(--e)} .ecard__verify.in{opacity:1;transform:none} .ecard__verify svg{width:13px;height:13px;color:#9a9aa1} .ecard__banner{display:flex;align-items:center;gap:8px;font-family:"Geist Mono",monospace;font-size:10px;letter-spacing:.05em;text-transform:uppercase} .ecard__banner svg{width:14px;height:14px;color:#e0584a} .ecard__banner span{color:#f08a7e;font-weight:500} .ecard__banner b{margin-left:auto;font-weight:500;color:#8b8b93} .ecard__sub{font-size:11.5px;color:#8b8b93;margin-top:-4px} .ecard__foot{display:flex;align-items:center;justify-content:space-between;gap:12px} .ecard__btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:36px;padding:0 15px;font-family:"Geist",sans-serif;font-size:12.5px;font-weight:600;color:#0a0912;background:#f4f3ee;border:1px solid #f4f3ee;border-radius:9px;cursor:pointer;transition:transform .12s var(--e),background .2s var(--e),color .2s var(--e),border-color .2s var(--e)} .ecard__btn svg{width:13px;height:13px} .ecard__btn.press{transform:scale(.97)} .ecard__btn.added{background:transparent;border-color:rgba(255,255,255,.16);color:#9a9aa1} /* bundle / kit card rows */ .ekit__hd{display:flex;align-items:baseline;justify-content:space-between;font-family:"Geist Mono",monospace;font-size:9.5px;letter-spacing:.07em;text-transform:uppercase;color:#8b8b93} .ekit__hd b{font-weight:500;color:#6b6b73} .ekit__list{display:flex;flex-direction:column;gap:13px} .ekit__row{display:flex;align-items:flex-start;justify-content:space-between;gap:14px} .ekit__rmain{display:flex;flex-direction:column;gap:2px;min-width:0} .ekit__rname{font-size:13px;font-weight:500;line-height:1.3;color:#e8e8ea} .ekit__rsub{font-family:"Geist Mono",monospace;font-size:10.5px;color:#8b8b93} .ekit__rprice{flex:0 0 auto;font-family:"Geist Mono",monospace;font-size:12px;color:#c4c4cb;font-variant-numeric:tabular-nums} .ekit__total{font-family:"Geist Mono",monospace;font-size:13px;font-weight:600;color:#f4f3ee;font-variant-numeric:tabular-nums} /* thinking dots */ .endemo__dots{display:inline-flex;gap:5px;align-items:center;height:14px} .endemo__dots i{width:6px;height:6px;border-radius:50%;background:#6b6b73;animation:endemo-bounce 1.2s ease-in-out infinite} .endemo__dots i:nth-child(2){animation-delay:.15s} .endemo__dots i:nth-child(3){animation-delay:.3s} @keyframes endemo-blink{0%,50%{opacity:1}50.01%,100%{opacity:0}} @keyframes endemo-pulse{0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(212,43,30,.45)}50%{opacity:.55;box-shadow:0 0 0 4px rgba(212,43,30,0)}} @keyframes endemo-bounce{0%,100%{opacity:.3;transform:translateY(0)}50%{opacity:1;transform:translateY(-3px)}} @keyframes endemo-bump{0%{transform:translateY(0)}35%{transform:translateY(-3px)}100%{transform:translateY(0)}} /* responsive — below desktop, the window becomes the chat alone */ @media (max-width:980px){ .endemo{height:auto} .endemo__main{display:block;padding-bottom:0;min-height:0} .endemo__catalog,.endemo__detail,.endemo__dock{display:none} .endemo__chat{position:static;left:auto;bottom:auto;width:100%;height:auto;border:0;border-radius:0;box-shadow:none;background:transparent;z-index:auto} .endemo__thread{min-height:520px} } @media (max-width:520px){.endemo__meta{display:none}} /* reduced motion — present the finished state, no animation */ @media (prefers-reduced-motion:reduce){ .endemo,.endemo *{transition:none!important;animation:none!important} .emsg,.rise,.ecard__verify{opacity:1;transform:none} .endemo__photo img{filter:none;transform:none} } /* ===== Problem-section capability grid ===== Built on the site's own column grid (12/8/4 cols with gutters) so the dividers land on the same gridlines as every other section — the middle divider lines up with the matrix below. */ .cap__grid{display:grid;grid-template-columns:repeat(var(--grid-columns),minmax(0,1fr));column-gap:var(--grid-gutter);border-top:1px solid rgba(255,255,255,.16);box-sizing:border-box;margin-inline:calc(var(--grid-margin) * -1);padding-inline:var(--grid-margin)} /* full-bleed: the border-box spans to the section edges (top border touches the edges) while the padded content box keeps the columns on the site gridlines. */ .cap{grid-column:span 3;box-sizing:border-box;padding:2.75rem 1.75rem 3rem var(--grid-margin);border-left:1px solid rgba(255,255,255,.16)} .cap:first-child{border-left:0;padding-left:0} .cap__icon{display:block;width:32px;height:32px;color:#ff5347;margin-bottom:1.5rem} .cap__icon svg{width:100%;height:100%;display:block} .cap__title{font-family:"Geist",sans-serif;font-weight:600;font-size:clamp(19px,1.45vw,23px);line-height:1.25;letter-spacing:-.01em;color:#f2f1ec;margin:0 0 .75rem} .cap__text{font-family:"Geist",sans-serif;font-size:clamp(15px,1.05vw,16.5px);line-height:1.55;color:#9a9aa1;margin:0;max-width:34ch} /* Tablet (8-col grid): 2 × 2 — vertical divider on the 4/8 gridline, horizontal between rows */ @media(max-width:980px) and (min-width:681px){ .cap{grid-column:span 4;padding:2.25rem 1.5rem 2.5rem var(--grid-margin)} .cap:nth-child(odd){border-left:0;padding-left:0} .cap:nth-child(n+3){border-top:1px solid rgba(255,255,255,.16)} } /* Mobile (4-col grid): clean 2 × 2 of icon + title (descriptions hidden so it fits the sticky viewport); vertical divider on the 2/4 gridline, horizontal between the two rows */ @media(max-width:680px){ .cap{grid-column:span 2;padding:1.9rem 1rem 2rem var(--grid-margin)} .cap:nth-child(odd){border-left:0;padding-left:0} .cap:nth-child(even){padding-right:0} .cap:nth-child(n+3){border-top:1px solid rgba(255,255,255,.16)} .cap__icon{width:26px;height:26px;margin-bottom:.85rem} .cap__title{font-size:1.05rem;line-height:1.22;margin:0} .cap__text{display:none} } /* ===== Loader: centered Enduris icon (blinds removed) ===== */ .preload[data-astro-cid-sckkx6r4]{background:#0A0912;opacity:1;transition:opacity .8s ease} .preload__top[data-astro-cid-sckkx6r4],.preload__bottom[data-astro-cid-sckkx6r4]{display:none!important} body.preload--out .preload[data-astro-cid-sckkx6r4]{opacity:0;pointer-events:none} body.preload--out /* Why Now: full-height section; headline pinned top (clears nav via sticky), paragraph at bottom */ /* Platform header: clean two-column intro (eyebrow+headline | lede), bottom-aligned */ .pf-header .grid__layout{align-items:end} @media(max-width:680px){.pf-header .grid__layout{align-items:stretch}} /* Request access form (repurposed contact page) */ /* Keep the STANDARD site layout: grid--half (50/50) + the bg--grey-50 column divider, which runs the full column height. Don't pad the SECTION (that pushed the grid + divider down) — instead clear the fixed nav with top padding INSIDE the columns, so the divider still starts at the very top. Override the right column's padding-top:0 so both clear the nav equally. */ .contact__form .contact__form--column .pt--large{padding-top:calc(var(--header-height,4.5rem) + clamp(1.5rem,3vh,2.5rem))} .contact__form .contact__form__main{border-bottom:0} /* Field strokes: 2px, soft by default, dark once a field has been visited (blur). Bottom strokes (not top) — no rule above the first field, one below the last. Applies to both the request and contact forms (they share .ra-form). */ /* Static 2px cap above the first field (non-interactive — never changes on focus/blur). */ .ra-form{border-top:2px solid rgba(var(--color-black),.14)} .ra-form .form__field{border-top:0;border-bottom:2px solid rgba(var(--color-black),.14);transition:border-bottom-color .4s ease} .ra-form .form__field:focus-within{border-bottom-color:rgb(var(--color-black))} /* Branded inline validation (replaces native bubbles): orange message under the field, red stroke. The slot is reserved (visibility, not display) so showing a message never grows/shifts the field. */ .ra-form .error__group{grid-column:1/-1;min-height:1rem;margin-top:.1rem} .ra-form .input--error{visibility:hidden;color:rgb(var(--color-orange));font-size:clamp(11px,.8125rem,16px);line-height:1.25} .ra-form .input--error.active{visibility:visible} .ra-form .form__field.has-error{border-bottom-color:rgb(var(--color-orange))} /* Message field (contact): full width below its label, with a sized textarea. */ .ra-msg-field{display:block} .ra-msg-field .field{padding-left:0} .ra-form .field__textarea{display:block;width:100%;min-height:6rem;margin-top:.5rem;box-sizing:border-box;font-size:clamp(16px,1.125rem,24px);line-height:1.25;cursor:text;resize:vertical} .ra-options{display:flex;flex-wrap:wrap;gap:.6rem 1.4rem;margin-top:.5rem} .ra-opt{opacity:.55} .ra-confirm{padding-top:1rem} /* Segment-first redesign: switcher reuses .ra-options (horizontal radios); panes/fields swap by segment. All token-based — no new aesthetic. */ .ra-segbar{border:0;padding:0;margin:0} .ra-segbar .form__options{flex-direction:row;flex-wrap:wrap;gap:.4rem 1.6rem;margin-top:.75rem} .ra-segbar .field--radio .field__input{font-size:clamp(16px,1.125rem,24px)} .ra-diff[hidden],.ra-confirm[hidden],.ra-error[hidden]{display:none} /* Headline uses the standard site-wide per-line mask reveal (single colour — the per-line mask can't keep an inline colour on the same line). line-text needs display:block. */ .ra-head{margin:0;max-width:75%} .ra-red{color:rgb(var(--color-orange))} /* Rule under the header: bleeds left to the viewport edge and right to the centre divider, using the same grid-margin offsets as the column's no-padding bleed (no hardcoded widths). */ /* Left column = two stacked sections filling the column: a header block that grows to fill the top, then a fixed foot the height of var(--header-height) (the same ~90px token used site-wide). The rule between them bleeds left to the viewport edge and right to the centre divider. */ .contact__form .contact__form--column:first-child .contact__form__main, .contact__form .contact__form--column:first-child .contact__form__main > div, .contact__form .contact__form--column:first-child .contact__form__main .wrp, .contact__form .contact__form--column:first-child .contact__form__main .block__inner{display:flex;flex-direction:column;flex:1 1 auto;min-height:0} .contact__form .section__title{flex:1 1 auto} .contact__form .contact__form--column:first-child .pb--xlarge{padding-bottom:0} .contact__form .ra-foot{flex:0 0 auto;height:var(--header-height);position:relative} .contact__form .ra-foot:before{content:"";position:absolute;top:0;left:var(--grid-margin-negative);right:var(--grid-margin-negative);height:1px;background:rgb(var(--color-grey-200))} /* One short subheader under the headline (hero/section pattern: masked title + support line). */ .ra-sub{margin-top:clamp(1.25rem,3vh,2rem);max-width:48ch} .ra-proof{margin-top:1.5rem;color:rgba(var(--color-black),.55)} .ra-error{margin-top:.75rem;color:rgb(var(--color-orange))} .ra-error a{text-decoration:underline} .ra-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden} /* Marquee strip (above the homepage video). Dark; GSAP drives the scroll + scroll-velocity. */ .marquee{background-color:rgb(var(--color-black));overflow:hidden;border-top:solid 1px rgba(255,255,255,.12);border-bottom:solid 1px rgba(255,255,255,.12);padding:2rem 0} .marquee__viewport{overflow:hidden;width:100%} .marquee__track{display:flex;align-items:center;width:max-content;white-space:nowrap;will-change:transform} .marquee__item{color:#f2f1ec} .marquee__sep{color:rgb(var(--color-orange));margin:0 1.75rem} /* Platform stack: larger pre-header above each card title (stays visible when cards collapse) */ .stack__pretitle{display:block;font-family:"Geist Mono",ui-monospace,monospace;font-size:clamp(12px,.9vw,14px);letter-spacing:.12em;text-transform:uppercase!important;font-weight:500;line-height:1.2;color:#0A0912;margin:0 0 2.25rem} /* Value section: highlight key payoff words in brand red */ .hl-underline{color:#d42b1e;font-weight:700} /* De-emphasize a headline lead-in to gray so the rest stays the strong color (light or dark mode). display:inline overrides SplitType's inline-block so the text flows continuously (no forced break). */ .title-lede{color:rgb(var(--color-grey-300));display:inline!important} /* Softer divider borders on light (grey-50) sections: grey-200 -> grey-100. Button outlines untouched. */ .bg--grey-50 .grid__column, .bg--grey-50 .list__item, .bg--grey-50 .stack__container, .bg--grey-50 .stack__item, .bg--grey-50 .toogle__box, .bg--grey-50 .values__container, .bg--grey-50 .vision__blocks, .bg--grey-50 .box, .bg--grey-50 .separator, .separator.bg--grey-50, .bg--grey-50 .grid__separator, .bg--grey-50 .figures__item, .bg--grey-50 .figures__list .grid__layout, .bg--grey-50 .matrix__main, .bg--grey-50 .intro__cross__grid, .bg--grey-50 .post-it__item{border-color:rgb(var(--color-grey-100))!important} /* Why Now: normal-flow section (no scroll-pin), ~60vh; headline grouped just above the paragraph, in the lower area over the image */ .whynow-img{min-height:0} .whynow-img__sticky{position:relative;height:auto;min-height:60vh;overflow:hidden} .whynow-img__sticky>.parallax__container{position:absolute!important;inset:0;z-index:0;height:100%} .whynow-img .wrp{position:relative;z-index:2;height:100%} .whynow-img__main{height:100%;display:flex;flex-direction:column;justify-content:flex-end;gap:1.5rem;box-sizing:border-box;padding-top:calc(var(--header-height) + clamp(1.5rem,4vh,3rem));padding-bottom:clamp(2.5rem,6vh,5rem)} @media(max-width:980px){.whynow-img{min-height:0}.whynow-img__sticky{position:relative;height:auto;min-height:100vh}.whynow-img__main{gap:3rem;padding-top:calc(var(--header-height) + 2rem)}} /* Value closing line: red reveal mask bars (this instance only) */ .lt--redmask .line--mask{background:#d42b1e} /* Footer subfooter row: mirror the footer menu's column grid EXACTLY (grid__column--third + its responsive breakpoints) and its per-column left padding, so copyright lines up under the brand column and Terms / Privacy line up under Explore / Connect at every width. */ .subfooter .grid__layout{display:grid!important;grid-template-columns:repeat(var(--grid-columns),1fr);column-gap:var(--grid-gutter);align-items:baseline} .subfooter__column{grid-column:span calc(var(--grid-columns) / 3)!important;text-align:left!important} .subfooter__column:first-child{padding-left:0!important} /* aligned to the grid edge — the brand column no longer has the (removed) inset-clip nudge */ .subfooter__column:nth-child(2),.subfooter__column:nth-child(3){padding-left:var(--grid-margin)!important} /* matches Explore/Connect .block__inner */ @media(max-width:980px) and (min-width:681px){.subfooter__column{grid-column:span calc(var(--grid-columns) / 2)!important}} @media(max-width:680px){ .subfooter .grid__layout{display:flex!important;grid-template-columns:none!important;flex-wrap:wrap;align-items:baseline;gap:.35rem 1.5rem} .subfooter__column{grid-column:auto!important;flex:0 0 auto!important;padding-left:0!important;width:auto!important} .subfooter__column:first-child{flex:0 0 100%!important} /* copyright on its own row; Terms + Privacy side by side below, no indent */ } /* Current-page nav/footer link: was opacity:.3 + pointer-events:none, which read as a broken link. Keep it gently de-emphasized but still legible and clickable. */ .menu__item__link.current{opacity:.6;pointer-events:auto} /* Legal documents (Terms, Privacy) */ .legal-doc{max-width:72ch} .legal-doc h2{font-family:"Geist",sans-serif;font-weight:600;font-size:clamp(17px,1.4vw,21px);line-height:1.25;letter-spacing:-.01em;color:#0A0912;margin:2.6rem 0 .8rem} .legal-doc h2:first-child{margin-top:0} .legal-doc h3{font-family:"Geist",sans-serif;font-weight:600;font-size:clamp(14px,1.1vw,16px);line-height:1.3;letter-spacing:-.005em;color:#0A0912;margin:1.7rem 0 .55rem} .legal-doc p,.legal-doc li{font-family:"Geist",sans-serif;font-size:15px;line-height:1.65;color:#3a3a40;margin:0 0 1rem} .legal-doc ul{margin:0 0 1.1rem;padding-left:1.25rem} .legal-doc li{margin-bottom:.45rem} .legal-doc a{color:#d42b1e;text-decoration:underline} .legal-doc strong{color:#0A0912;font-weight:600} .legal-doc .legal-caps{font-size:13px;line-height:1.55;color:#5a5a62} /* Platform stack: make the "/" (dash) match the number size */ .stack__item__order{align-items:center} .stack__item__order .dash{width:auto;height:auto;margin-top:0} .stack__item__order .dash-icon{height:clamp(12px,.9vw,14px);width:auto;display:block} /* Why Now headline: two-line reveal, second line brand red, tight as one headline */ .whynow-title line-text{display:block} .whynow-title h2{margin:0} .whynow-title--red{color:#d42b1e!important} .footer__coming-soon{opacity:.55;cursor:default} /* Careers job rows: hover slide (mirrors a-link:hover; careers uses plain placeholders) */ .solutions__list__section a:hover .solutions__item{border-color:rgb(var(--color-white));color:rgb(var(--color-black))} .solutions__list__section a:hover .solutions__item:before{transform:scaleY(1)} .solutions__list__section a:hover .solutions__item__order--1, .solutions__list__section a:hover .solutions__item__order--2, .solutions__list__section a:hover .solutions__item__content--1, .solutions__list__section a:hover .solutions__item__content--2, .solutions__list__section a:hover .solutions__item__media--1, .solutions__list__section a:hover .solutions__item__media--2{transform:translate3d(0,100%,0)} /* On hover the row reveals a white panel; force the (sec--dark forced-light) title text dark so it's readable. The forced-light !important breaks the template's inherited color transition, so re-add it here to animate the darken in sync with the panel reveal (was snapping = flicker). */ .solutions__list__section.sec--dark .solutions__item .title{transition:color .3s ease} .solutions__list__section.sec--dark a:hover .solutions__item .title{color:rgb(var(--color-black))!important} /* ===== Mobile cleanup: align custom homepage sections to design-system treatment ===== */ /* Hero: let the H1 use full width on phones (70% cap is desktop-only) */ @media(max-width:680px){.home__hero .hero__title{max-width:none}.home__hero{min-height:64vh}} /* WHYNOW: group headline + copy instead of space-between over 100vh (kills the big mid gap) */ @media(max-width:980px){.whynow-img__main{justify-content:center;gap:1.5rem;padding-bottom:clamp(2rem,5vh,3.5rem)}} @media(max-width:680px){.whynow-img__sticky{min-height:88vh}.whynow-img .text__description{max-width:none!important}} /* prob-scroll ("The problem"): comfortable mobile spacing, keep head top / steps bottom */ @media(max-width:680px){.prob-scroll__overlay .wrp{padding-top:calc(var(--header-height) + 1.5rem)}.prob-scroll__head .title{max-width:18ch}.prob-scroll__steps{min-height:11rem}.prob-scroll__step{max-width:none}} /* Side padding: these custom sections drop content straight into .wrp (1x grid-margin). Native sections nest in .block__inner for ~2x inset — match that on mobile/tablet. */ @media(max-width:980px){.prob-scroll__overlay .wrp,.wrp:has(> .enduris-demo),.wrp:has(> .cap__grid){padding-left:calc(var(--grid-margin) * 1.5);padding-right:calc(var(--grid-margin) * 1.5)}.whynow-img__main{padding-left:calc(var(--grid-margin) * .5);padding-right:calc(var(--grid-margin) * .5)}} /* Company "Why we win" figures panel: dark card + brand-red figures, readable light text (the template inherits orange for all text; our red is too dark for body copy) */ .figures__container{color:#f2f1ec} .figures__item__title{color:#d42b1e} .figures__item__subtitle{color:#f2f1ec} .figures__item__text{color:#b9b9c0} /* Mobile nav bar: use the Enduris wordmark instead of the icon */ @media(max-width:980px){.header__logo__link .header__logo__symbol{display:none}.header__logo__link .header__logo__text{display:inline-flex}} /* Desktop nav: space between logo icon and wordmark via margin (flex gap was not separating them) */ .header__logo__link .header__logo__symbol{margin-right:7px!important} /* Footer: 3-column nav moved into the sticky reveal area (replaces the big logo). Size to content; avoid double top border (enduris__window already has one). */ .enduris__window .footer__logo{aspect-ratio:auto} .enduris__window .footer__container{border-top:0} /* Company hero — full-bleed looping video background behind the default hero layout */ .company-hero--video{position:relative;overflow:hidden;min-height:92vh;display:flex} .company-hero--video .hero__default__main{flex:1;display:flex;flex-direction:column} .company-hero--video .hero__default__container, .company-hero--video .hero__default__top, .company-hero--video .hero__default__top>.wrp{width:100%;height:100%} /* native full-height hero grid pattern (mirrors .hero__background__main): centerline spans top→bottom */ .company-hero--video .hero__default__top .grid__layout{height:100%;grid-auto-rows:1fr} /* bottom-align the hero header (same intent as .home__hero align-items:flex-end) */ .company-hero--video .default__hero__column--left{display:flex;flex-direction:column;justify-content:flex-end} .company-hero__back{z-index:0} .company-hero__back video{display:block} .company-hero__scrim{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(10,9,18,.5) 0%,rgba(10,9,18,.15) 42%,rgba(10,9,18,.55) 78%,rgba(10,9,18,.88) 100%)} /* light grid divider + cross-hair lines so they read over the dark video */ .company-hero--video .hero__default__main .grid__column+.grid__column{border-color:rgba(232,232,234,.22)!important} .company-hero--video cross-hair .line{background-color:rgba(232,232,234,.38)!important} .company-hero--video cross-hair .number-right,.company-hero--video cross-hair .number-bottom{color:rgba(232,232,234,.65)!important} .company-hero--video cross-hair .cross-point{background:rgba(232,232,234,.85)!important} /* Team section — dark mode with sticky truck photo background (desktop only); white cards */ /* note: NO overflow:hidden here — it would break the sticky scroll column */ .post-it__section.team--photo{position:relative;background-color:#0A0912!important;border-bottom-color:rgba(255,255,255,.1)!important} /* sticky truck background, contained to the section: the absolute wrapper is bounded by the section, and the inner layer is sticky — so it pins while scrolling but never bleeds into the next section. No overflow:hidden, so the sticky text column keeps working. */ .team__back{display:none;z-index:0} @media(min-width:981px){ .team__back{display:block;position:absolute;inset:0} .team__back__img{position:sticky;top:0;height:100vh; background:linear-gradient(180deg,rgba(10,9,18,.62) 0%,rgba(10,9,18,.5) 40%,rgba(10,9,18,.72) 100%),url(/imgs/company/team-truck.webp) center bottom/cover no-repeat} } .post-it__section.team--photo .post-it__container{position:relative;z-index:2} /* light only the section header text */ .post-it__section.team--photo .post-it__main .title,.post-it__section.team--photo .post-it__main h2{color:#f2f1ec!important} .post-it__section.team--photo .post-it__main .text__description,.post-it__section.team--photo .post-it__main .text__description p{color:#b9b9c0!important} .post-it__section.team--photo .post-it__main .pretitle{color:#8b8b93!important} .post-it__section.team--photo .post-it__main .c__square{background-color:#d42b1e!important} /* white cards (were brand red/orange) */ .post-it__section.team--photo .post-it__item{background:#fff!important;color:#0A0912!important;border:1px solid rgba(10,9,18,.08)} .post-it__section.team--photo .post-it__item .title,.post-it__section.team--photo .post-it__item h3{color:#0A0912!important} .post-it__section.team--photo .post-it__item .text__description,.post-it__section.team--photo .post-it__item .text__description p{color:#45454c!important} .post-it__section.team--photo .post-it__item .pretitle{color:#6b6b73!important} .post-it__section.team--photo .post-it__item .c__square{background-color:#d42b1e!important} /* Separator above the "Why we win" list: the column tick was dangling because the template's .separator horizontal rule never applied (bg--grey-50 is on the section, not the .separator div). Add a horizontal divider at the bottom of the separator so the tick connects into it. */ .separator__section--method.bg--grey-50:has(+ .list__block) .grid__separator{border-bottom:1px solid rgb(var(--color-grey-200))} /* home__vision — rebalanced after the sub-line was removed: content-driven height, no space-between void */ .home__vision .vision__main{justify-content:flex-start;height:auto} .home__vision .vision__image{aspect-ratio:auto} /* (Problem-points mobile layout is now handled in the .cap__grid responsive block above.) */ /* Demo chat: fixed height on mobile so the window scrolls internally instead of growing as the conversation adds content */ @media(max-width:980px){ .endemo__chat{height:min(78vh,600px)} .endemo__thread{min-height:0} } /* Problem section: header-safe top padding; NO bottom padding so the cap grid (its dividers) reaches the section's bottom edge — full-bleed vertically. The caps keep their own bottom padding for text breathing room. */ .prob-scroll__overlay .wrp{padding-top:max(calc(var(--header-height) + 2rem),clamp(80px,11vh,140px));padding-bottom:0} /* Menu "From Build to Bay" panel: dark bg + centered white text; bg masks in on menu open, then JS scramble-reveals the text */ .menu__secondary .menu__secondary__column:last-child{justify-content:center;align-items:center;text-align:center;overflow:hidden} .menu__secondary .menu__secondary__column:last-child::after{content:"";position:absolute;inset:0;z-index:0;background:#0A0912;transform-origin:left;transform:scaleX(0);transition:transform 0s .6s} body.menu--opened .menu__secondary .menu__secondary__column:last-child::after{transform:scaleX(1);transition:transform .7s var(--menu-handle,cubic-bezier(.76,0,.24,1)) .3s} .menu__secondary .menu__secondary__column:last-child .pretitle{position:relative;z-index:1;margin:0;color:#fff;font-variant-numeric:tabular-nums} /* ===================== Nav menu: chatbox-style card ===================== */ /* Re-skin the menu interaction to match the chatbox: an auto-height white card that GROWS out of the top-right corner via a clip-path reveal (no reflow — fixed width), over a subtle dim (no blur), then content staggers in. Markup unchanged; .menu__grow is injected by initMenuCard(). Trigger + close handlers stay in the bundle (close-X, dim-click, link nav); Esc handled in initMenuCard. (clip-path is safe here — a static white card doing one transition, not a scroll-scrubbed image.) */ .menu__container{ position:fixed!important; top:.75rem!important; right:.75rem!important; left:auto!important; bottom:auto!important; width:400px!important; height:auto!important; max-width:calc(100vw - 2rem); border-radius:6px!important; overflow:hidden; background:rgb(var(--color-white)); filter:drop-shadow(0 24px 60px rgba(10,9,18,.4)); pointer-events:none; clip-path:inset(0 0 100% 100% round 6px); /* closed: collapsed at the top-right corner */ transition:clip-path 460ms var(--ease); /* site's signature easing (cubic-bezier .53,0,0,1) */ } body.menu--opened .menu__container{ clip-path:inset(0 0 0 0 round 6px); /* open: full card revealed (down + left) */ pointer-events:auto; } .menu__grow{display:flex;flex-direction:column;width:100%;min-width:0} .menu__main{height:auto!important;overflow:visible!important} .menu__main__inner{height:auto!important;justify-content:flex-start!important;gap:1.5rem} @media(max-width:639px){.menu__container{left:.75rem!important;right:.75rem!important;width:auto!important;max-width:none!important}} /* Subtle dim backdrop (no blur). */ .menu__back{background:rgba(10,9,18,.2)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;transition:opacity .25s var(--ease)!important} /* Smaller nav item type (was display-sized). */ .menu__primary .menu__item__link{font-size:1.5rem!important;line-height:1.25!important} /* No logo anywhere in the menu; close button sits at the top-right. */ .menu__header .menu__logo__link{display:none!important} .menu__header{justify-content:flex-end!important} .menu__close{margin-left:auto!important} /* "Build Intelligence" accent column removed; LinkedIn column goes full width. */ .menu__secondary{display:block!important} .menu__secondary .menu__secondary__column:last-child{display:none!important} .menu__secondary .menu__secondary__column:first-child{width:100%!important} /* Item entrance is GSAP-driven (initMenuCard): immediate, staggered opacity+y on the site's ease. Hide items only when JS will animate them, so a no-JS menu still shows its links. */ .menu__container.menu--js .menu__primary .menu__item__link, .menu__container.menu--js .menu__secondary .menu__item__link{opacity:0} /* Reduced motion: no grow/stagger — simple fade. */ @media (prefers-reduced-motion: reduce){ .menu__container{clip-path:none!important;opacity:0;transition:opacity .2s linear} body.menu--opened .menu__container{opacity:1} .menu__container.menu--js .menu__primary .menu__item__link, .menu__container.menu--js .menu__secondary .menu__item__link{opacity:1!important;transform:none!important} } /* ===================== Parts-copilot demo: chat empty state ===================== */ /* Mirrors the real app's "What are you working on?" copilot screen (heading + intro + suggestion chips), shown in the demo's chat thread before the scripted conversation plays. */ .enduris-demo .endemo__empty{display:flex;flex-direction:column;gap:1rem;padding:.25rem 0 .5rem;animation:endemo-emptyin .5s var(--ease,cubic-bezier(.53,0,0,1)) both} .enduris-demo .endemo__empty-h{margin:0;font-size:1.02rem;font-weight:600;letter-spacing:-.01em;color:var(--ink-1)} .enduris-demo .endemo__empty-p{margin:0;font-size:.78rem;line-height:1.55;color:var(--ink-2)} .enduris-demo .endemo__empty-sugs{display:flex;flex-direction:column;gap:.45rem;margin-top:.15rem} .enduris-demo .endemo__sug{display:flex;align-items:center;justify-content:space-between;gap:.5rem;width:100%;border:1px solid var(--line);background:var(--bg-1);border-radius:12px;padding:.55rem .7rem;font:inherit;font-size:.76rem;line-height:1.25;color:var(--ink-1);text-align:left;cursor:default} .enduris-demo .endemo__sug svg{flex:0 0 auto;width:13px;height:13px;color:var(--ink-3);opacity:.55} @keyframes endemo-emptyin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}} /* ===================== Header nav: order + icon-only menu ===================== */ /* Request access first, then the Menu button. */ .header__nav{justify-content:flex-end!important} .header__nav__item--contact{order:1;flex:0 0 auto!important;width:auto!important} .header__nav__item--contact .contact__trigger{width:auto!important;min-width:193px!important} /* content-sized + a touch wider */ .header__nav__item--menu{order:2;flex:0 0 auto!important;width:auto!important;min-width:0!important} /* Mobile: nav is display:block (not flex), so right-align the inline-flex menu icon with text-align. */ @media(max-width:680px){.header__nav{text-align:right!important}} /* Menu trigger: icon only — drop the "Menu" label + its divider border; shrink to fit the icon. */ .menu__trigger .button__text{display:none!important} .menu__trigger .menu__icon{border-left:0!important} .menu__trigger{padding:0!important;width:auto!important;flex:0 0 auto!important} /* Scroll-reveal images: fix the clip-path edge flicker (most visible on the left edge) by compositing the clipped element on its own layer and stabilizing the scaled image — stops per-frame edge re-rasterization. */ cross-image{transform:translateZ(0)} /* promote the overflow:hidden frame to its own layer so it statically clips the briefly-composited scaled image (kills the edge flicker even when the animating clip-path lags) */ /* Scroll-reveal cross-images (all instances): kill the clip-path-reveal flicker by NOT animating clip-path. The rounded inset frame is a STATIC clip-path (rasterized once → can't flicker); the image keeps its scroll zoom + parallax untouched. The bottom-to-top reveal is a one-shot transform wipe — a section- colored ::after overlay slides up via transform (pure GPU), driven by --vr (0 = covered → 1 = revealed). --vr-bg is set per-instance in JS from the section background so the reveal matches each section. */ .crossimg{overflow:hidden;position:relative;clip-path:inset(1.25rem round var(--border-radius))!important} @media(max-width:1024px){.crossimg{clip-path:inset(1rem round var(--border-radius))!important}} .crossimg img{will-change:transform;transform:translateZ(0)} .crossimg::after{content:"";position:absolute;inset:0;z-index:4;pointer-events:none;background:var(--vr-bg,rgb(var(--color-grey-50)));transform:translateY(calc(var(--vr,0) * -100%));will-change:transform} /* Demo detail panel: much smaller image thumbnails */ .epd__imgs{display:flex;gap:8px} .epd__img{flex:0 0 auto;width:60px} .epd__img>img,.epd__img>svg{width:60px;height:60px;aspect-ratio:auto} .epd__img>svg{padding:17px} .epd__img em{max-width:60px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} /* Demo: collapsed left nav rail (icons only) */ .endemo__main{padding-left:54px} .endemo__dock{left:54px} .endemo__rail{position:absolute;left:0;top:0;bottom:0;width:54px;display:flex;flex-direction:column;align-items:center;gap:3px;padding:11px 0;background:#0b0a11;border-right:1px solid rgba(255,255,255,.07);z-index:6} .endemo__rail__brand{flex:0 0 auto;width:32px;height:32px;display:grid;place-items:center;color:#d42b1e;margin-bottom:9px} .endemo__rail__brand svg{width:19px;height:19px} .endemo__navicon{flex:0 0 auto;width:38px;height:38px;display:grid;place-items:center;border-radius:9px;color:#6b6b73} .endemo__navicon svg{width:19px;height:19px} .endemo__navicon.is-active{background:rgba(255,255,255,.09);color:#e8e8ea} .endemo__rail__sp{flex:1 1 auto} .endemo__rail__foot{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:7px} .endemo__avatar{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#2a2933,#1b1a24);border:1px solid rgba(255,255,255,.14);font-family:"Geist Mono",monospace;font-size:10px;font-weight:600;letter-spacing:.02em;color:#c4c4cb} @media(max-width:980px){.endemo__rail{display:none}.endemo__main{padding-left:0}} /* Repair-tip note in the chat stream */ .etip{display:flex;flex-direction:column;gap:8px} .etip__hd{display:inline-flex;align-items:center;gap:7px;font-family:"Geist Mono",monospace;font-size:9.5px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:#e8e8ea} .etip__hd svg{width:13px;height:13px;color:#9a9aa1} .etip__body{font-size:13px;line-height:1.55;color:#d4d4db} /* Rail brand: real Enduris logomark (has its own fills), sized for the collapsed rail */ .endemo__rail__brand svg{width:26px;height:auto} /* Footer brand column (replaces the old Explore column): white Enduris wordmark + one-line description */ .page__footer .footer__brand{display:block} .page__footer .footer__brand svg{height:22px;width:auto;display:block;fill:#fff} .page__footer .footer__brand__desc{margin:0;max-width:30ch;color:#fff} /* Subfooter: regular-case legal links; left-align + group all three (was copyright-left / terms-center / privacy-right) */ .subfooter .legal__link{text-transform:none!important} @media(min-width:681px){ .subfooter .grid__layout{display:flex!important;grid-template-columns:none!important;justify-content:flex-start;align-items:baseline;flex-wrap:wrap;gap:.4rem 1.75rem} .subfooter__column,.subfooter__column:nth-child(2),.subfooter__column:nth-child(3){text-align:left!important;padding-left:0!important;grid-column:auto!important} } /* Prefooter CTA: dark crosshair lines instead of light (matches the orange-section grid-divider). */ .prefooter .prefooter__top{border-bottom-color:rgb(var(--color-black))!important} .prefooter .grid__column+.grid__column{border-left-color:rgb(var(--color-black))!important} /* Nav "Menu" button: white fill on hover. The icon half has its OWN hover-fill pseudo (.menu__icon:before, black by default) that must also be white, else that half stays dark and its black lines vanish. Whole button = white, text + hamburger lines dark. */ .menu__trigger:before{background-color:rgb(var(--color-white))!important} .menu__trigger .menu__icon:before{background-color:rgb(var(--color-white))!important} .menu__trigger:hover{color:rgb(var(--color-black))!important} .menu__trigger:hover .menu__icon{border-left-color:rgba(10,9,18,.12)!important} .menu__trigger:hover .menu__icon--line:before,.menu__trigger:hover .menu__icon--line:after{background-color:rgb(var(--color-black))!important} /* Word-reveal headings replaced the old / block reveals; keep the heading→button spacing the template gave line-text. */ reveal-text+.button,reveal-text+a-link{margin-top:1.25rem} /* ===================== Softening pass 1 ===================== */ /* Footer unit (the video CTA + the red footer) transitions full-frame → inset rounded card as you reach the page end. Driven by --fend (0→1, scrubbed to scroll). Uses margin (exact px inset, no vertical reflow — horizontal + bottom only) + border-radius + overflow:hidden instead of clip-path, because clip-path breaks