
body.home-reference .eyebrow{font-family: var(--font-mono); letter-spacing: 0.28em; text-transform: uppercase; color: var(--accent-bright); border: 1px solid var(--line); border-radius: var(--r-pill); background: rgba(var(--accent-rgb),.05); backdrop-filter: blur(6px); align-items: center; gap: 9px; padding: 8px 16px; font-size: 11.5px; display: inline-flex;}
body.home-reference .eyebrow .dot{background: var(--accent); width: 7px; height: 7px; box-shadow: 0 0 12px var(--accent); border-radius: 50%; animation: 1.8s ease 0s infinite normal none running pulse;}
body.home-reference .hero{padding: 170px 0px 90px; position: relative;}
body.home-reference .hero-grid{grid-template-columns: 1.05fr 0.95fr; align-items: center; gap: 50px; display: grid;}
body.home-reference .hero-centered{text-align: center; padding: 200px 0px 110px;}
body.home-reference .hero-centered .hero-left{flex-direction: column; align-items: center; max-width: 1180px; margin: 0px auto; display: flex;}
body.home-reference .hero-centered .hero-sub{max-width: 640px; margin-left: auto; margin-right: auto; font-size: 17px;}
body.home-reference .hero-centered .hero-cta{justify-content: center; gap: 16px; margin-top: 40px;}
body.home-reference .hero-centered .hero-cta .btn{padding: 18px 34px; font-size: 17px;}
body.home-reference .hero-centered .eyebrow{padding: 10px 20px; font-size: 12.5px;}
body.home-reference .hero-centered h1{width: 100%; max-width: 1200px; font-size: max(40px, min(5.7vw, 74px));}
body.home-reference .hero-centered h1 .line-mask{width: 100%; margin-bottom: -0.14em; padding: 0px 0.06em 0.14em; overflow: hidden;}
body.home-reference .hero-centered h1 .line-mask > span{width: 100%; display: block;}
body.home-reference .hero-centered .wrap{z-index: 2; position: relative;}
body.home-reference .showcase{z-index: 3; height: 260vh; margin-top: -100vh; position: relative;}
body.home-reference .showcase-sticky{pointer-events: none; align-items: center; height: 100vh; display: flex; position: sticky; top: 0px; overflow: hidden;}
body.home-reference .showcase-stage{justify-content: center; align-items: center; width: 100%; display: flex; position: relative;}
body.home-reference .mac{z-index: 1; transform-origin: 50% center; will-change: transform; pointer-events: auto; background: rgb(12, 12, 14); border: 1px solid rgba(255, 255, 255, 0.1); width: min(1280px, 96vw); margin-top: 230px; position: relative; overflow: hidden; box-shadow: rgba(0, 0, 0, 0.9) 0px 50px 110px -30px, rgba(0, 0, 0, 0.4) 0px 0px 0px 1px, rgba(255, 255, 255, 0.06) 0px 1px inset;}
body.home-reference .mac-bar{background: linear-gradient(rgb(23, 23, 26), rgb(16, 16, 19)); border-bottom: 1px solid rgba(255, 255, 255, 0.07); align-items: center; gap: 8px; padding: 11px 16px; display: flex;}
body.home-reference .mac-dot{border-radius: 50%; flex: 0 0 12px; width: 12px; height: 12px;}
body.home-reference .mac-dot.r{background: rgb(255, 95, 87);}
body.home-reference .mac-dot.y{background: rgb(254, 188, 46);}
body.home-reference .mac-dot.g{background: rgb(40, 200, 64);}
body.home-reference .mac-title{text-align: center; font-family: var(--font-mono); color: var(--faint); letter-spacing: 0.02em; white-space: nowrap; text-overflow: ellipsis; flex: 1 1 0%; margin-right: 44px; font-size: 12px; overflow: hidden;}
body.home-reference .mac-screen{aspect-ratio: 1911 / 888; object-fit: cover; object-position: center top; background-image: url("assets/hiove-platform.webp"); background-position: center top; background-size: cover; width: 100%; display: block;}
@media (max-width: 760px){body.home-reference .showcase{height: auto; margin-top: 0px;}
body.home-reference .showcase-sticky{pointer-events: auto; height: auto; padding: 10px 0px 50px; position: static;}
body.home-reference .mac{width: 100%; margin-top: 0px; border-radius: 14px !important; transform: none !important;}
body.home-reference .mac-title{margin-right: 30px; font-size: 10px;}}
body.home-reference .hero h1{font-family: var(--font-display); letter-spacing: -0.025em; margin: 30px 0px 0px; font-size: max(40px, min(5.7vw, 74px)); font-weight: 900; line-height: 1;}
body.home-reference .hero h1 .nowrap{white-space: nowrap;}
body.home-reference .hero h1 .l-hidden{display: none;}
body.home-reference .hero h1 .white{color: rgb(255, 255, 255); display: block;}
body.home-reference .hero h1 .orange{background-image: ; background-position-x: ; background-position-y: ; background-size: ; background-repeat: ; background-attachment: ; background-origin: ; background-color: ; color: rgba(0, 0, 0, 0); background-clip: text; display: block;}
body.home-reference .hero h1 .pro{color: rgb(255, 255, 255); margin-top: 0px; font-size: 1em; display: block;}
body.home-reference .hero-sub{color: var(--muted); text-wrap: pretty; max-width: 480px; margin: 26px 0px 0px; font-size: 18px; line-height: 1.62;}
body.home-reference .hero-sub b{color: var(--accent-bright); font-weight: 600;}
body.home-reference .hero-cta{flex-wrap: wrap; gap: 14px; margin-top: 34px; display: flex;}
body.home-reference .line-mask{display: block; overflow: hidden;}
body.home-reference .line-mask > span{display: block;}
body.home-reference .hero h1.hero-h1-m{font-family: var(--font-display); letter-spacing: -0.025em; margin: 24px 0px 0px; font-size: max(24px, min(7.2vw, 42px)); font-weight: 900; line-height: 1.05;}
body.home-reference .hero h1.hero-h1-m .ln{white-space: normal; text-wrap-style: balance; display: block; overflow: visible;}
body.home-reference .hero h1.hero-h1-m .white,body.home-reference .hero h1.hero-h1-m .orange{display: inline;}
body.home-reference .hero h1.hero-h1-m .pro{color: rgb(255, 255, 255); white-space: normal; margin-top: 0px; font-size: 1em; display: block;}
body.home-reference .hero-right{animation: panelIn 1.1s var(--ease-out) .15s backwards;}
body.home-reference .res-title{text-align: center; font-family: var(--font-display); color: rgb(255, 255, 255); margin-bottom: 46px; font-size: max(30px, min(3.6vw, 46px)); font-weight: 800;}
body.home-reference .res-split{grid-template-columns: 0.9fr 1.1fr; align-items: center; gap: 64px; display: grid;}
body.home-reference .res-side .section-head{text-align: left; max-width: 480px; margin: 0px 0px 30px;}
body.home-reference .res-side .section-title{font-size: max(32px, min(3.8vw, 50px));}
body.home-reference .res-side .section-head p{font-size: 16px;}
body.home-reference .res-stats{background: 0px 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; border-radius: 0px; grid-template-columns: 1fr 1fr; gap: 14px; display: grid; overflow: visible;}
body.home-reference .res-cell{text-align: left; border: 1px solid var(--line); border-radius: var(--r); max-width: none; transition: transform .35s var(--ease),border-color .35s; background: linear-gradient(rgb(17, 15, 13), rgb(10, 9, 8)); padding: 30px 28px 28px; position: relative; overflow: hidden;}
body.home-reference .res-cell::before{content: ""; background: linear-gradient(90deg,var(--accent),var(--accent-gold)); border-radius: 0px 0px 2px 2px; width: 44px; height: 2px; position: absolute; top: 0px; left: 28px;}
body.home-reference .res-cell::after{content: ""; pointer-events: none; opacity: 0; background: radial-gradient(90% 60% at 50% 0%,rgba(var(--accent-rgb),.14),transparent 70%); transition: opacity 0.35s; position: absolute; inset: 0px;}
body.home-reference .res-cell:hover{border-color: rgba(var(--accent-rgb),.4); transform: translateY(-4px);}
body.home-reference .res-cell:hover::after{opacity: 1;}
body.home-reference .res-cell:nth-child(2n){border-right: 1px solid var(--line);}
body.home-reference .res-cell:nth-last-child(-n+2){border-bottom: 1px solid var(--line);}
body.home-reference .res-cell:hover:nth-child(2n),body.home-reference .res-cell:hover:nth-last-child(-n+2){border-color: rgba(var(--accent-rgb),.4);}
body.home-reference .res-cell .v{font-family: var(--font-num); color: rgb(255, 255, 255); letter-spacing: -0.035em; font-size: max(36px, min(3.6vw, 52px)); font-weight: 800; line-height: 1;}
body.home-reference .res-cell .l{color: var(--muted); max-width: 200px; margin-top: 14px; font-size: 14px; line-height: 1.4;}
body.home-reference .res-cta{width: fit-content; margin: 0px; display: flex;}
@media (max-width: 980px){body.home-reference .hero-grid{grid-template-columns: 1fr; gap: 48px;}
body.home-reference .res-split{grid-template-columns: 1fr; gap: 32px;}
body.home-reference .res-stats{grid-template-columns: 1fr 1fr;}
body.home-reference .hero{padding-top: 140px;}
body.home-reference .hero-left{text-align: center; flex-direction: column; align-items: center; display: flex;}
body.home-reference .hero h1,body.home-reference .hero-sub{margin-left: auto; margin-right: auto;}
body.home-reference .hero-cta{justify-content: center;}
body.home-reference .res-stats{grid-template-columns: 1fr;}
body.home-reference .hero{padding: 116px 0px 54px;}
body.home-reference .hero h1{font-size: max(38px, min(11vw, 50px));}
body.home-reference .hero-sub{margin-top: 20px; font-size: 16px;}
body.home-reference .hero-centered .hero-sub{font-size: 16px;}
body.home-reference .hero-centered .hero-cta{gap: 11px; margin-top: 30px;}
body.home-reference .hero-centered .hero-cta .btn{padding: 15px 18px; font-size: 15px;}
body.home-reference .eyebrow,body.home-reference .hero-centered .eyebrow{padding: 7px 14px; font-size: 10.5px;}
body.home-reference .hero-cta{gap: 11px; width: 100%;}
body.home-reference .hero-cta .btn{flex: 1 1 0%; justify-content: center; padding: 15px 18px;}
body.home-reference .hero-right{justify-content: center; width: 100%; display: flex; overflow: hidden;}
body.home-reference .res-stats{gap: 0px;}
body.home-reference .res-stat{padding: 24px 20px;}}
@media (max-width: 400px){body.home-reference .res-stats{grid-template-columns: 1fr;}
body.home-reference .res-cell{border: 1px solid var(--line) !important;}
body.home-reference .hero h1{font-size: max(34px, min(11.5vw, 46px));}}
@media (max-width: 760px){
body.home-reference .eyebrow .dot,body.home-reference .res-status .d{animation: auto ease 0s 1 normal none running none !important;}}


@media (max-width: 520px){body.home-reference .hero-cta{flex-direction: column;}
body.home-reference .hero-cta .btn{width: 100%;}}
body.home-reference .res-side .section-head{margin-bottom: 28px;}
body.home-reference .hw-grid{list-style: none;}
body.home-reference .hw-cell{text-align: center; flex-direction: column; justify-content: center; align-items: center; gap: 18px; min-height: 190px; padding: 36px 24px; display: flex;}
body.home-reference .hw-cell::before{left: 50%; transform: translate(-50%);}
body.home-reference .hw-ic{background: rgba(var(--accent-rgb),.12); border: 1px solid rgba(var(--accent-rgb),.3); width: 56px; height: 56px; color: var(--accent); border-radius: 14px; place-items: center; display: grid;}
body.home-reference .hw-ic svg{width: 26px; height: 26px;}
body.home-reference .hw-l{font-family: var(--font-display); color: rgb(17, 17, 17); max-width: 180px; font-size: 17px; font-weight: 700; line-height: 1.3;}
body.home-reference .hw-cta{flex-wrap: wrap; align-items: center; gap: 18px; max-width: none; display: flex;}
body.home-reference .hw-note{color: var(--muted); max-width: 230px; font-size: 13px; line-height: 1.4;}
@media (max-width: 980px){body.home-reference .hw-grid{grid-template-columns: 1fr 1fr; gap: 14px;}
body.home-reference .hw-cell{min-height: 0px; padding: 26px 18px; border: 1px solid var(--line) !important;}}
@media (max-width: 400px){body.home-reference .hw-l{font-size: 15px;}}
body.home-reference .hw-btn{padding: 18px 34px; font-size: 17px;}
body.home-reference .hw-note{color: var(--faint); flex: 1 1 0%; align-items: center; gap: 8px; min-width: 150px; max-width: none; display: inline-flex;}
body.home-reference .hw-note svg{flex: 0 0 16px; width: 16px; height: 16px;}
body.home-reference .hw-chart{color: rgb(17, 17, 17); max-width: 460px; margin-top: 38px;}
body.home-reference .hw-chart svg{width: 100%; height: auto; display: block;}
body.home-reference .howworks .res-split{align-items: start;}
@media (max-width: 980px){body.home-reference .hw-chart{max-width: 420px; margin: 26px auto 0px;}
body.home-reference .hw-note{flex-basis: 100%;}}
body.home-reference .hero-evolution.hero-centered{isolation: isolate; padding: 132px 0px 22px;}
body.home-reference .hero-evolution .hero-left{max-width: 1120px;}
body.home-reference .hero-evolution.hero-centered h1{letter-spacing: -0.045em; margin-top: 24px; font-size: max(36px, min(4.5vw, 60px)); line-height: 1.1;}
body.home-reference .hero-evolution.hero-centered h1 .line-mask{margin-bottom: 0px; padding-bottom: 0.1em;}
body.home-reference .hero-evolution.hero-centered h1 .line-mask > span{text-wrap: balance;}
body.home-reference .hero-evolution.hero-centered h1 .hero-final-line,body.home-reference .hero-evolution.hero-centered h1 .lpro{letter-spacing: -0.05em; margin-top: 3px; font-size: max(48px, min(6.4vw, 84px)); line-height: 1.08;}
body.home-reference .hero-evolution h1 .hero-final-line > span,body.home-reference .hero-evolution h1 .lpro > span,body.home-reference .hero-evolution h1.hero-h1-m .pro{color: rgba(0, 0, 0, 0); background: linear-gradient(105deg, rgb(255, 223, 189) 5%, rgb(255, 174, 104) 30%, rgb(255, 121, 55) 65%, rgb(255, 89, 28) 100%) text;}
body.home-reference .hero-evolution.hero-centered .hero-cta{gap: 12px; width: auto; max-width: 650px; margin-top: 30px;}
body.home-reference .hero-evolution.hero-centered .hero-cta .btn{border-radius: 14px; justify-content: center; min-height: 56px; padding: 16px 28px; font-size: 15px;}
body.home-reference .hero-evolution .btn-primary{background: rgb(249, 97, 32); border: 1px solid rgb(255, 136, 74); min-width: 190px; box-shadow: rgba(255, 95, 24, 0.75) 0px 8px 24px -14px, rgba(255, 255, 255, 0.16) 0px 1px inset;}
body.home-reference .hero-evolution .btn-primary:hover{background: rgb(255, 115, 43); box-shadow: rgba(255, 95, 24, 0.75) 0px 12px 30px -15px;}
body.home-reference .hero-evolution .btn-ghost{background: rgb(23, 23, 23); border-color: rgba(255, 255, 255, 0.16);}
body.home-reference .hero-evolution .btn-ghost:hover{background: rgb(34, 34, 34); border-color: rgba(255, 255, 255, 0.3);}
body.home-reference .hero-evolution .btn:focus-visible{outline-offset: 5px; outline: rgb(255, 177, 110) solid 2px;}
body.home-reference .hero-demo-note{color: rgb(163, 163, 163); justify-content: center; align-items: center; gap: 7px; margin-top: 14px; font-size: 12px; line-height: 1.5; display: flex;}
body.home-reference .hero-demo-note svg{color: rgb(238, 156, 87); width: 14px; height: 14px; display: block;}
body.home-reference .hero-evolution.hero-centered .eyebrow{letter-spacing: 0.18em; color: rgb(200, 200, 200); backdrop-filter: none; background: rgb(19, 19, 19); border-color: rgba(255, 255, 255, 0.12); padding: 8px 14px; font-size: 10px;}
body.home-reference .hero-evolution .eyebrow .dot{background: rgb(255, 121, 47); width: 5px; height: 5px; animation: auto ease 0s 1 normal none running none; box-shadow: rgba(255, 115, 43, 0.45) 0px 0px 10px;}

body.home-reference .showcase-evolution.showcase{--scene-progress: 0; z-index: 1; isolation: isolate; height: calc(220px + min(52vw, 620px)); margin-top: 0px;}
body.home-reference .showcase-evolution .showcase-sticky{pointer-events: auto; height: auto; padding: 0px 0px 96px; display: block; position: sticky; top: 74px; overflow: clip;}
body.home-reference .showcase-evolution .showcase-scenery{z-index: -1; pointer-events: none; opacity: 0.8; position: absolute; inset: 0px -7%; mask-image: linear-gradient(rgba(0, 0, 0, 0), rgb(0, 0, 0) 18%, rgb(0, 0, 0) 76%, rgba(0, 0, 0, 0));}
body.home-reference .showcase-scenery img{object-fit: cover; object-position: center 58%; width: 100%; height: 100%;}
body.home-reference .showcase-evolution .showcase-stage{perspective: 1400px; padding: 0px 32px;}
body.home-reference .showcase-evolution .mac{width: 100%; max-width: 1030px; transform: translateY(calc((1 - var(--scene-progress))*10px)) rotateX(calc((1 - var(--scene-progress))*6deg)) scale(calc(.97 + var(--scene-progress)*.03)); transform-origin: center bottom; border-color: rgba(255, 255, 255, 0.18); border-radius: 20px; margin: 0px; box-shadow: rgb(0, 0, 0) 0px 28px 75px -15px, rgba(255, 255, 255, 0.1) 0px 1px inset;}
body.home-reference .showcase-evolution .mac-bar{background: linear-gradient(rgb(27, 27, 27), rgb(20, 20, 20)); border-bottom-color: rgba(255, 255, 255, 0.1); padding: 12px 17px;}
body.home-reference .showcase-evolution .mac-dot{flex-basis: 8px; width: 8px; height: 8px;}
body.home-reference .showcase-evolution .mac-title{color: rgb(170, 170, 170); margin-right: 30px; font-size: 10px;}
body.home-reference .showcase-evolution .mac-screen{aspect-ratio: 1911 / 888;}
body.home-reference .showcase-caption{color: rgb(174, 156, 141); letter-spacing: 0.02em; justify-content: center; align-items: center; gap: 12px; margin-top: 24px; font-size: 10px; display: flex; position: relative;}
body.home-reference .showcase-playback{color: rgb(255, 172, 91); background: rgb(27, 27, 27); border: 1px solid rgba(255, 255, 255, 0.16); border-radius: 50%; place-items: center; width: 32px; height: 32px; transition: background 0.2s, transform 0.2s; display: grid;}
body.home-reference .showcase-playback:hover{background: rgb(40, 40, 40); transform: scale(1.06);}
body.home-reference .showcase-playback:focus-visible{outline-offset: 4px; outline: rgb(255, 172, 91) solid 2px;}
body.home-reference .showcase-playback svg{fill: none; stroke: currentcolor; stroke-width: 2px; stroke-linecap: round; stroke-linejoin: round; width: 14px; height: 14px;}
@media (min-width: 761px) and (max-width: 980px){body.home-reference .hero-evolution.hero-centered{padding-top: 118px;}
body.home-reference .hero-evolution.hero-centered h1{font-size: max(34px, min(4.3vw, 44px));}
body.home-reference .hero-evolution.hero-centered h1 .hero-final-line,body.home-reference .hero-evolution.hero-centered h1 .lpro{font-size: max(43px, min(5.8vw, 60px));}
body.home-reference .showcase-evolution .showcase-stage{padding: 0px 14px;}}
@media (max-width: 760px){body.home-reference .hero-evolution.hero-centered{padding: 100px 0px 14px;}
body.home-reference .hero-evolution.hero-centered h1.hero-h1-m{letter-spacing: -0.035em; margin-top: 22px; font-size: max(25px, min(7.7vw, 48px)); line-height: 1.14;}
body.home-reference .hero-evolution.hero-centered h1.hero-h1-m .ln:last-child{margin-top: 7px; font-size: 1.08em;}
body.home-reference .hero-evolution.hero-centered .hero-cta{gap: 10px; width: auto; max-width: 460px; margin-top: 24px;}
body.home-reference .hero-evolution.hero-centered .hero-cta .btn{white-space: normal; min-height: 52px; padding: 15px 22px; font-size: 15px;}
body.home-reference .hero-demo-note{margin-top: 13px; font-size: 11px;}
body.home-reference .showcase-evolution.showcase{height: auto; margin-top: 0px;}
body.home-reference .showcase-evolution .showcase-sticky{padding: 14px 0px 48px; position: relative; top: auto;}
body.home-reference .showcase-evolution .showcase-stage{padding: 0px;}
body.home-reference .showcase-evolution .showcase-scenery{opacity: 0.68; display: block; inset: 0px -32% -5%;}
body.home-reference .showcase-evolution .mac{border-radius: 12px !important; transform: none !important;}
body.home-reference .showcase-evolution .mac-bar{gap: 5px; padding: 9px 11px;}
body.home-reference .showcase-evolution .mac-dot{flex-basis: 6px; width: 6px; height: 6px;}
body.home-reference .showcase-evolution .mac-title{margin-right: 21px; font-size: 8px;}
body.home-reference .showcase-caption{letter-spacing: 0px; gap: 9px; margin-top: 18px; font-size: 9px;}}
@media (max-width: 520px){body.home-reference .hero-evolution.hero-centered .hero-cta{grid-template-columns: 1fr; gap: 9px; width: 100%; max-width: 350px; display: grid;}
body.home-reference .hero-evolution.hero-centered .hero-cta .btn{width: 100%; min-width: 0px;}
body.home-reference .hero-evolution.hero-centered .eyebrow{letter-spacing: 0.15em; font-size: 9px;}}
@media (prefers-reduced-motion: reduce){body.home-reference .showcase-evolution.showcase{height: auto; margin-top: 12px;}
body.home-reference .showcase-evolution .showcase-sticky{position: relative; top: auto;}
body.home-reference .showcase-evolution .mac{will-change: auto; transform: none;}
body.home-reference .hero-evolution .line-mask > span,body.home-reference .hero-evolution .ln,body.home-reference .hero-evolution .dot{animation: auto ease 0s 1 normal none running none !important;}
body.home-reference .showcase-playback{transition: none;}}
body.home-reference .howworks.howworks-evolution{padding: 42px 0px 72px;}
body.home-reference .howworks.howworks-evolution .res-split{grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr); align-items: center; gap: max(32px, min(5vw, 76px));}
body.home-reference .howworks-evolution .res-side,body.home-reference .howworks-evolution .hw-grid{min-width: 0px;}
body.home-reference .howworks-evolution .res-side .section-head{max-width: 520px; margin-bottom: 26px;}
body.home-reference .howworks-evolution .res-side .section-title{letter-spacing: -0.035em; text-wrap: balance; font-size: max(32px, min(3.4vw, 46px)); line-height: 1.08;}
body.home-reference .howworks-evolution .section-head p{text-wrap: pretty; max-width: 44ch; margin-top: 18px; font-size: 16px; line-height: 1.65;}
body.home-reference .howworks-evolution .hw-cta{gap: 14px;}
body.home-reference .howworks-evolution .hw-btn{flex-shrink: 0; padding: 16px 26px; font-size: 15px;}
body.home-reference .howworks-evolution .hw-note{min-width: 125px; max-width: 220px; font-size: 12px; line-height: 1.5;}
body.home-reference .howworks-evolution .hw-chart{background-image: linear-gradient(rgba(0, 0, 0, 0.04) 1px, rgba(0, 0, 0, 0) 1px), linear-gradient(90deg, rgba(0, 0, 0, 0.04) 1px, rgba(0, 0, 0, 0) 1px); background-size: 42px 42px; border-bottom: 1px solid rgba(0, 0, 0, 0.08); max-width: 460px; margin: 28px 0px 0px; padding: 4px 8px 0px; position: relative; mask-image: linear-gradient(90deg, rgba(0, 0, 0, 0), rgb(0, 0, 0) 9%, rgb(0, 0, 0) 91%, rgba(0, 0, 0, 0));}
body.home-reference .howworks-evolution .hw-chart svg{overflow: visible;}
body.home-reference .howworks-evolution .hw-grid{gap: 16px; margin: 0px; padding: 0px;}
body.home-reference .light-zone .howworks-evolution .hw-cell{text-align: left; background: rgb(255, 255, 255); border-color: rgba(0, 0, 0, 0.09); border-radius: 22px; justify-content: flex-end; align-items: flex-start; gap: 22px; min-height: 204px; padding: 26px; transform: none; box-shadow: rgba(0, 0, 0, 0.24) 0px 12px 28px -24px, rgb(255, 255, 255) 0px 1px inset;}
body.home-reference .howworks-evolution .hw-cell::before{opacity: 0.75; width: 34px; left: 26px; transform: none;}
body.home-reference .howworks-evolution .hw-step-no{font-family: var(--font-mono); letter-spacing: 0.04em; color: gray; font-size: 13px; font-weight: 500; position: absolute; top: 21px; right: 23px;}
body.home-reference .howworks-evolution .hw-ic{color: rgb(223, 73, 13); background: rgb(242, 242, 242); border-color: rgba(0, 0, 0, 0.08); border-radius: 16px; width: 54px; height: 54px; box-shadow: rgba(255, 255, 255, 0.9) 0px 1px inset, rgba(0, 0, 0, 0.2) 0px 8px 20px -16px;}
body.home-reference .howworks-evolution .hw-l{letter-spacing: -0.015em; text-wrap: balance; max-width: 180px; font-size: 19px; line-height: 1.24;}
body.home-reference .howworks-evolution a:focus-visible{outline-offset: 5px; outline: rgb(223, 73, 13) solid 3px;}
@media (max-width: 980px){body.home-reference .howworks.howworks-evolution .res-split{grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr); gap: 28px;}
body.home-reference .light-zone .howworks-evolution .hw-cell{min-height: 186px; padding: 22px;}
body.home-reference .howworks-evolution .hw-l{font-size: 17px;}
body.home-reference .howworks-evolution .hw-note{flex-basis: 100%; max-width: 100%;}}
@media (max-width: 700px){body.home-reference .howworks.howworks-evolution{padding: 26px 0px 60px;}
body.home-reference .howworks.howworks-evolution .res-split{grid-template-columns: minmax(0px, 1fr); gap: 28px;}
body.home-reference .howworks-evolution .res-side .section-head{max-width: 580px;}
body.home-reference .howworks-evolution .res-side .section-title{max-width: 17ch; font-size: max(30px, min(6.8vw, 40px));}
body.home-reference .howworks-evolution .hw-chart{max-width: 460px; margin-top: 22px;}
body.home-reference .howworks-evolution .hw-cta{align-items: flex-start;}}
@media (max-width: 400px){body.home-reference .howworks-evolution .hw-grid{gap: 10px;}
body.home-reference .light-zone .howworks-evolution .hw-cell{border-radius: 18px; gap: 18px; min-height: 182px; padding: 20px 17px;}
body.home-reference .howworks-evolution .hw-cell::before{left: 17px;}
body.home-reference .howworks-evolution .hw-step-no{font-size: 11px; top: 14px; right: 14px;}
body.home-reference .howworks-evolution .hw-ic{border-radius: 13px; width: 44px; height: 44px;}
body.home-reference .howworks-evolution .hw-ic svg{width: 23px; height: 23px;}
body.home-reference .howworks-evolution .hw-l{overflow-wrap: anywhere; font-size: 16px;}}
@media (prefers-reduced-motion: reduce){body.home-reference .howworks-evolution .hw-cell{transition: none; transform: none;}}
body.home-reference .protag-evolution .protag-cta{flex-direction: column; justify-self: end; gap: 12px; width: 100%; max-width: 285px; display: flex;}
body.home-reference .protag-evolution .protag-cta .btn{white-space: normal; text-align: center; justify-content: center; min-height: 55px; padding: 16px 22px; font-size: 15px; line-height: 1.4; transition: transform 0.2s, background 0.2s, border-color 0.2s, box-shadow 0.2s;}
body.home-reference .protag-evolution .protag-btn-w{color: rgb(23, 23, 23); background: rgb(245, 245, 245); border: 1px solid rgb(255, 255, 255); box-shadow: rgba(0, 0, 0, 0.6) 0px 8px 28px -15px;}
body.home-reference .protag-evolution .protag-btn-w:hover{background: rgb(255, 255, 255); transform: translateY(-3px); box-shadow: rgba(0, 0, 0, 0.6) 0px 12px 32px -12px;}
body.home-reference .protag-evolution .protag-btn-o{color: rgb(245, 245, 245); background: rgba(20, 20, 20, 0.73); border-color: rgba(255, 255, 255, 0.25);}
body.home-reference .protag-evolution .protag-btn-o:hover{background: rgb(36, 36, 36); border-color: rgb(234, 165, 104); transform: translateY(-3px);}
@media (max-width: 760px){body.home-reference .protag-evolution .protag-cta{flex-direction: row; justify-self: start; gap: 10px; max-width: none;}
body.home-reference .protag-evolution .protag-cta .btn{flex: 1 1 0%; min-width: 0px; padding: 15px 17px; font-size: 14px;}}
@media (max-width: 520px){body.home-reference .protag-evolution .protag-cta{flex-direction: column;}
body.home-reference .protag-evolution .protag-cta .btn{min-height: 51px;}}
@media (prefers-reduced-motion: reduce){body.home-reference .protag-evolution .protag-cta .btn{transition: none;}
body.home-reference .protag-evolution .protag-cta .btn:hover{transform: none;}}
/* Integration resets: remove earlier visual treatments on the matched areas. */
@font-face{font-family:Archivo;src:url('fonts/archivo-latin.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
@font-face{font-family:'JetBrains Mono';src:url('fonts/jetbrainsmono-latin.woff2') format('woff2');font-style:normal;font-weight:100 800;font-display:swap}
body.home-reference{--muted:#cecece;--faint:#a1a1a1;--line:#ffffff1f;--card:#141414;--card-2:#1b1b1b}
body.home-reference .wrap{max-width:1240px;padding-inline:28px}
body.home-reference .hero-evolution::before,body.home-reference .hero-evolution::after{display:none}
body.home-reference .hero-evolution{background:none;min-height:0}
body.home-reference .hero-evolution h1 .hero-final-line .white{color:transparent;-webkit-text-fill-color:transparent}
body.home-reference .hero-evolution .hero-left{gap:0}
body.home-reference .showcase-evolution.showcase{height:auto;--scene-progress:1}
body.home-reference .showcase-evolution .showcase-sticky{position:relative;top:auto}
body.home-reference .showcase-evolution .mac{transform:none!important;opacity:1}
body.home-reference .showcase-glow{display:none}
body.home-reference .howworks-evolution .section-head{opacity:1;transform:none;animation:none}
body.home-reference .howworks-evolution .hw-grid,body.home-reference .howworks-evolution .hw-cta{opacity:1;transform:none;animation:none}
body.home-reference .howworks-evolution .hw-cell::after{display:none}
body.home-reference .howworks-evolution .hw-btn{border:0;border-radius:12px;background:var(--accent);box-shadow:0 10px 24px -10px rgba(var(--accent-rgb),.5)}
body.home-reference .howworks-evolution .hw-ic::before,body.home-reference .howworks-evolution .hw-ic::after{display:none}
body.home-reference .protag-evolution .protag-cta{align-items:stretch;flex-direction:column}
@media(max-width:980px){body.home-reference .wrap{padding-inline:18px}}
@media(max-width:760px){body.home-reference .hero-evolution.hero-centered h1.hero-h1-m .pro{color:transparent;-webkit-text-fill-color:transparent}body.home-reference .hero-evolution .hero-demo-note{margin-top:13px}}

body.home-reference section[id]{scroll-margin-top:84px}
body.home-reference .howworks-evolution .section-title{font-weight:800}
body.home-reference .howworks-evolution .section-head p{margin-left:0;margin-right:0}
body.home-reference .howworks-evolution .hw-cell::before{display:block}
body.home-reference :is(.hero-evolution,.howworks-evolution,.protag-evolution) .btn{font-weight:700;letter-spacing:normal;line-height:1.55}



