:root{--navy:#061338;--blue:#0866fb;--blue2:#1689ff;--light-blue:#eaf3ff;--muted:#7186ad;--border:#d3e0f5;--pale:#f8fbff;--page-width:1370px}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:104px}
body{margin:0;color:var(--navy);background:#fff;font-family:Calibri,Carlito,"Segoe UI",Arial,sans-serif;-webkit-font-smoothing:antialiased}
button,input,textarea,select{font:inherit}
a{color:inherit;text-decoration:none}
button{cursor:pointer}
:focus-visible{outline:3px solid #519cff;outline-offset:3px}
.skip-link{position:fixed;top:-80px;left:16px;padding:12px 18px;background:var(--navy);color:#fff;z-index:100}
.skip-link:focus{top:12px}
.site-header{background:#fff;position:relative;z-index:20}
.nav-shell{max-width:var(--page-width);height:136px;padding:0 24px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:35px}
.brand{display:flex;align-items:center;flex-shrink:0;line-height:1;height:68px}
.brand-logo{display:block;height:60px;width:auto;max-width:240px;object-fit:contain}
.desktop-nav{display:flex;gap:42px;align-items:center;margin-left:auto}
.desktop-nav a{font-size:18px;font-weight:500;white-space:nowrap;transition:color .18s}
.desktop-nav a:hover,.mobile-nav a:hover{color:var(--blue)}
.nav-actions{display:flex;align-items:center;gap:14px}
.button{display:inline-flex;align-items:center;justify-content:center;border-radius:2px;text-align:center;min-height:54px;padding:13px 24px;font-size:18px;font-weight:500;white-space:nowrap;border:1px solid transparent;transition:background .18s,border-color .18s,transform .18s,box-shadow .18s}
.button:hover{transform:translateY(-1px)}
.button--primary{color:#fff;background:#0663f9;border-color:#0663f9;box-shadow:0 3px 9px rgba(0,85,255,.04)}
.button--primary:hover{background:#004dd5;border-color:#004dd5}
.button--outline{color:var(--navy);background:#fff;border-color:#b6ccfa}
.button--outline:hover{border-color:var(--blue);background:#f8fbff}
.button--small{height:58px;min-height:58px;padding:0 29px;font-size:18px}
.sign-in{min-width:116px}.top-start{min-width:173px}
.menu-toggle,.mobile-nav{display:none}
.hero{position:relative;overflow:hidden;padding:102px 32px 45px;isolation:isolate;min-height:880px}
/* Hero wire graphics: preserve the original curve geometry exactly.
   On ultrawide monitors, expand only the straight tails—never scale the bends. */
.hero-wire-field{position:absolute;top:82px;z-index:0;height:350px;width:max(520px, calc(50vw - 475px));display:flex;align-items:stretch;pointer-events:none;overflow:hidden}
.hero-wire-field--left{left:0;justify-content:flex-end}
.hero-wire-field--right{right:0;justify-content:flex-start}
.hero-wire-cluster{display:block;width:520px;height:350px;flex:0 0 520px;object-fit:contain;max-width:none}
.hero-wire-tail{display:block;height:350px;width:calc(100% - 520px);min-width:0;flex:1 1 auto;object-fit:fill;max-width:none}
@media(max-width:1100px){.hero-wire-field{width:min(520px,43vw);height:auto;aspect-ratio:520/350;top:88px}.hero-wire-cluster{width:100%;height:100%;flex:1 1 auto}.hero-wire-tail{display:none}}
@media(max-width:600px){.hero-wire-field{width:50vw;opacity:.4;top:90px}.hero-wire-field--left{left:-16vw}.hero-wire-field--right{right:-16vw}}
.hero-content{text-align:center;position:relative;z-index:1;max-width:1050px;margin:auto}
.hero h1{margin:0;font-size:clamp(59px,7.3vw,106px);line-height:.89;letter-spacing:-.044em;font-weight:700}
.blue-text{color:var(--blue)}
.hero-subtitle{font-size:clamp(24px,2.25vw,32px);line-height:1.23;color:var(--muted);margin:24px 0 0;font-weight:400}
.hero-buttons{display:flex;justify-content:center;gap:17px;margin-top:41px}
.button--hero{min-width:204px;height:67px;font-size:20px}
.metrics{max-width:994px;margin:54px auto 0;display:grid;grid-template-columns:repeat(4,1fr);padding:0 12px}
.metric{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:66px;border-left:1px solid #c7dafa;text-align:center;gap:4px}
.metric:last-child{border-right:1px solid #c7dafa}
.metric strong{font-size:24px;letter-spacing:-.022em;font-weight:700}
.metric span{font-size:20px;color:var(--muted)}
.feature-row{width:min(100%,1300px);display:grid;grid-template-columns:repeat(4,1fr);margin:79px auto 0}
.feature{padding:5px 18px 3px;text-align:center;min-height:191px;border-right:1px solid #dbe8fc;scroll-margin-top:120px}
.feature:last-child{border-right:0}
.icon-square{width:78px;height:70px;display:grid;place-items:center;border-radius:6px;background:#e9f3ff;color:#006eff;margin:0 auto 22px}
.icon-square svg{width:39px;height:39px;display:block}
.feature h2{margin:0;font-size:25px;font-weight:700;letter-spacing:-.025em;line-height:1.15}
.feature p{margin:9px 0 0;font-size:21px;line-height:1.28;color:#758bb3}
.section-container{max-width:1190px;margin:auto;padding:0 28px}
.detail-section{padding:94px 0;scroll-margin-top:40px;border-top:1px solid #eef3fa}
.section-gray{background:var(--pale)}
.two-columns{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:100px}
.eyebrow{margin:0 0 14px;color:#0068ee;font-size:15px;letter-spacing:.18em;text-transform:uppercase;font-weight:700}
.detail-section h2,.contact-section h2{margin:0;font-size:clamp(34px,3.6vw,52px);line-height:1.07;letter-spacing:-.035em}
.detail-section p:not(.eyebrow),.contact-section p:not(.eyebrow){font-size:21px;line-height:1.45;color:#697fa6}
.location-section{display:grid;grid-template-columns:minmax(280px,.82fr) minmax(520px,1.18fr);align-items:center;gap:54px}
.text-link{display:inline-flex;margin-top:13px;font-size:20px;font-weight:700;color:var(--blue);gap:10px}
.text-link:hover{text-decoration:underline}
.location-diagram{min-height:390px;border:1px solid #d7e5fa;background:linear-gradient(180deg,#fff 0%,#fbfdff 100%);border-radius:18px;padding:24px;display:flex;align-items:center;justify-content:center;box-shadow:0 24px 60px rgba(20,77,133,.08)}
.topology-diagram{overflow:hidden}
.topology-svg{width:100%;height:auto;display:block;min-height:350px}
.topology-title{font-size:28px;font-weight:700;fill:#081a43;letter-spacing:-.02em}
.topology-caption{font-size:15px;fill:#6e83a5;letter-spacing:.01em}
.device-label{font-size:18px;font-weight:700;fill:#081a43}
.device-sub{font-size:13px;fill:#6d81a3}.device-meta{font-size:11px;fill:#93a6c3}.legend-pill{font-size:12px;font-weight:700;fill:#4f6e98}
.pricing-section{display:flex;align-items:center;justify-content:space-between;gap:35px}
.pricing-section>div{max-width:720px}
.contact-section{padding:100px 0;background:#fff;border-top:1px solid #edf2f9}
.contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:92px}
.contact-intro .contact-note{margin-top:48px;font-size:15px!important}
.contact-form{display:flex;flex-direction:column;gap:20px;padding:35px;border:1px solid #d5e1f4;border-radius:3px;box-shadow:0 18px 45px rgba(25,66,140,.04)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.contact-form label{display:flex;flex-direction:column;gap:7px;font-weight:700;font-size:17px}
.contact-form input,.contact-form select,.contact-form textarea{padding:12px 14px;border:1px solid #cbdaf1;border-radius:2px;background:#fff;color:var(--navy);min-width:0;outline-offset:3px;font-size:17px}
.contact-form textarea{resize:vertical}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:#0069ff}
.submit-button{align-self:flex-start;min-width:190px;gap:12px}
.honeypot{display:none!important}
.site-footer{background:#f8fbff;padding:35px 0;border-top:1px solid #e5eefb}
.footer-content{display:flex;align-items:center;justify-content:space-between;gap:20px;color:#7186a9;font-size:17px;flex-wrap:wrap}
.footer-brand{font-size:25px;font-weight:700;color:var(--navy)}
.footer-brand--logo img{display:block;height:36px;width:auto}
.portal-dialog{border:1px solid #cee0f8;padding:0;border-radius:3px;box-shadow:0 24px 80px rgba(2,26,72,.24);max-width:440px;width:calc(100% - 32px)}
.portal-dialog::backdrop{background:rgba(3,13,43,.45)}
.dialog-content{padding:34px;position:relative}
.dialog-content h2{font-size:31px;margin:0}
.dialog-content p:not(.eyebrow){color:#637b9b;font-size:19px;line-height:1.4;margin-bottom:26px}
.dialog-close{border:0;background:transparent;font-size:34px;position:absolute;right:17px;top:10px;color:#52688c}
@media(max-width:1180px){.nav-shell{height:112px}.desktop-nav{gap:22px;margin-left:15px}.desktop-nav a{font-size:17px}.brand-logo{height:53px;max-width:210px}.button--small{padding:0 18px;min-height:52px;height:52px}.top-start{min-width:auto}.sign-in{min-width:auto}.hero{padding-top:110px;min-height:auto;padding-bottom:82px}.hero h1{font-size:clamp(60px,6.2vw,80px)}.feature-row{margin-top:65px}}
@media(max-width:870px){.nav-shell{height:88px}.desktop-nav{display:none}.nav-actions{gap:9px}.menu-toggle{display:flex;border:1px solid #c6d8f4;background:#fff;width:48px;height:48px;flex-direction:column;gap:5px;justify-content:center;align-items:center;border-radius:2px}.menu-toggle span{width:19px;height:2px;background:#0b1940}.mobile-nav:not([hidden]){display:flex;position:absolute;left:0;right:0;top:88px;background:#fff;flex-direction:column;gap:0;box-shadow:0 12px 22px rgba(1,36,100,.09);border-top:1px solid #e8f0fb;padding:12px 28px 23px}.mobile-nav a,.mobile-nav button{padding:13px 8px;font-size:19px;display:block;background:none;border:0;text-align:left;color:var(--navy)}.mobile-nav .mobile-primary{margin-top:8px;background:#0663f9;color:white;text-align:center}.hero{padding-top:103px}.hero h1{font-size:clamp(49px,7.1vw,68px)}.hero-subtitle{font-size:25px}.feature-row{gap:0}.feature h2{font-size:23px}.feature p{font-size:18px}.metrics{margin-top:60px}.metric strong{font-size:21px}.metric span{font-size:18px}.two-columns,.location-section,.contact-grid{grid-template-columns:1fr;gap:30px}.pricing-section{align-items:flex-start}}
@media(max-width:600px){.nav-shell{padding:0 20px;height:76px}.brand-logo{height:42px;max-width:158px}.nav-actions .sign-in{display:none}.nav-actions .top-start{font-size:15px;min-height:40px;height:40px;padding:0 12px}.menu-toggle{height:40px;width:41px}.mobile-nav:not([hidden]){top:76px}.hero{padding:80px 19px 65px;min-height:auto}.hero h1{font-size:clamp(40px,10.5vw,62px);line-height:1.06;letter-spacing:-.037em}.hero-subtitle{font-size:21px;margin-top:22px}.desktop-break{display:none}.hero-buttons{gap:10px;margin-top:30px}.button--hero{height:53px;min-height:53px;min-width:0;width:50%;padding:8px;font-size:17px}.metrics{margin-top:59px;padding:0;grid-template-columns:repeat(2,1fr);row-gap:26px}.metric{min-height:58px}.metric:nth-child(2){border-right:1px solid #c7dafa}.metric strong{font-size:21px}.metric span{font-size:16px}.feature-row{grid-template-columns:repeat(2,1fr);margin-top:59px;row-gap:24px}.feature{min-height:180px;padding:4px 10px}.feature:nth-child(2){border-right:0}.feature h2{font-size:21px}.feature p{font-size:17px}.icon-square{width:66px;height:64px;margin-bottom:15px}.icon-square svg{width:34px;height:34px}.detail-section,.contact-section{padding:66px 0}.section-container{padding:0 20px}.detail-section h2,.contact-section h2{font-size:38px}.detail-section p:not(.eyebrow),.contact-section p:not(.eyebrow){font-size:19px}.location-diagram{padding:12px;min-height:250px}.topology-svg{min-height:240px}.topology-title{font-size:18px}.topology-caption{font-size:11px}.device-label{font-size:13px}.device-sub{font-size:10px}.device-meta,.legend-pill{display:none}.pricing-section{flex-direction:column}.form-grid{grid-template-columns:1fr}.contact-form{padding:24px}.footer-content{flex-direction:column;align-items:flex-start;gap:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}

/* On smaller screens, keep the natural proportions and soften the decorations. */
@media(max-width:1180px){.hero-wire-group{top:100px}}
@media(max-width:870px){
  .hero-wire-group{top:100px;width:48%;opacity:.55}
  .hero-wire-group--right{width:47.8%}
}
@media(max-width:600px){
  .hero-wire-group{top:92px;width:min(80vw,320px);opacity:.20}
  .hero-wire-group--left{left:-15vw}
  .hero-wire-group--right{width:min(79.7vw,319px);right:-15vw}
}

/* V3: Full-width, engineering-grade network topology (replaces the tiny split diagram). */
.network-section{padding:100px 0 94px;background:#fff;border-top:1px solid #eaf1fb;scroll-margin-top:35px}
.network-shell{width:min(100% - 56px,1360px);margin:0 auto}
.network-intro{display:grid;grid-template-columns:minmax(0,1.32fr) minmax(330px,.68fr);gap:48px;align-items:end;margin-bottom:34px}
.network-intro .eyebrow{margin-bottom:14px}
.network-intro h2{max-width:850px;margin:0;color:#07183e;font-size:clamp(42px,4.15vw,62px);line-height:1.05;letter-spacing:-.04em;font-weight:700}
.network-intro-side{padding-bottom:4px}
.network-intro-side p{font-size:21px;line-height:1.47;color:#6a7fa3;margin:0}
.network-intro-side .text-link{margin-top:15px;font-size:17px}
.network-figure{margin:0}
.network-figure-viewport{overflow-x:auto;overflow-y:hidden;border-radius:19px;box-shadow:0 28px 75px rgba(14,77,147,.08);scrollbar-color:#a7c8f2 #edf5ff;scrollbar-width:thin;outline-offset:4px}
.network-figure-viewport img{display:block;width:100%;height:auto;min-width:940px;max-width:none}
.network-figure figcaption{font-size:14px;color:#8393ad;margin-top:15px;text-align:right}
.network-figure-viewport::-webkit-scrollbar{height:10px}
.network-figure-viewport::-webkit-scrollbar-track{background:#edf5ff}
.network-figure-viewport::-webkit-scrollbar-thumb{background:#a7c8f2;border-radius:30px}

@media(max-width:870px){
  .network-section{padding:74px 0}
  .network-shell{width:calc(100% - 38px)}
  .network-intro{grid-template-columns:1fr;gap:14px;margin-bottom:24px}
  .network-intro h2{font-size:clamp(38px,6vw,55px)}
  .network-intro-side p{font-size:19px}
  .network-figure-viewport img{min-width:920px}
}
@media(max-width:600px){
  .network-shell{width:calc(100% - 30px)}
  .network-intro h2{font-size:38px}
  .network-figure-viewport img{min-width:850px}
  .network-figure figcaption{text-align:left;font-size:12px}
}

.network-mobile-hint{display:none}
@media(max-width:870px){.network-mobile-hint{display:block;margin:0 0 9px;color:#0066ff;font-size:14px;font-weight:700}}

/* Location roles on the enhanced broker-feed network diagram */
.network-site-notes{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:-8px 0 24px}
.network-site-note{display:inline-flex;align-items:center;gap:9px;border:1px solid #d5e6f8;background:#f9fcff;padding:11px 15px;font-size:16px;color:#547292}
.network-site-note strong{color:#0c2650;font-weight:700}
.network-site-note .site-indicator{width:9px;height:9px;border-radius:50%;background:#0b73f8}
.network-site-note--backup .site-indicator{background:#8ca1bb}
@media(max-width:600px){.network-site-notes{gap:9px;margin:0 0 17px}.network-site-note{font-size:14px;padding:9px 11px}}

/* Fade only the inward tips to keep the title completely clear. */
.hero-wire-field--left .hero-wire-cluster{
  -webkit-mask-image:linear-gradient(to right,#000 0%,#000 67%,rgba(0,0,0,.8) 72%,transparent 84%);
  mask-image:linear-gradient(to right,#000 0%,#000 67%,rgba(0,0,0,.8) 72%,transparent 84%);
}
.hero-wire-field--right .hero-wire-cluster{
  -webkit-mask-image:linear-gradient(to left,#000 0%,#000 76%,transparent 94%);
  mask-image:linear-gradient(to left,#000 0%,#000 76%,transparent 94%);
}

/* Native SVG image animations do not always inherit reduced-motion media
   preferences from the embedding page; explicitly swap to static SVGs. */
.hero-wire-cluster--static{display:none}
@media(prefers-reduced-motion:reduce){
  .hero-wire-cluster--animated{display:none}
  .hero-wire-cluster--static{display:block}
}

/* Orzon branded image scales proportionally on all devices */
.brand-logo{object-fit:contain;object-position:left center}
@media(max-width:600px){.brand-logo{max-width:172px;height:45px}}

/* Upticks.com header/footer: keep the full candlestick wordmark readable. */
.brand-logo{height:54px;max-width:295px}
.footer-brand--logo img{height:auto;max-height:42px;max-width:260px;width:auto}
@media(max-width:1180px){.brand-logo{height:47px;max-width:235px}}
@media(max-width:600px){.brand-logo{height:auto;max-width:177px;width:177px}}
/* Keep the wider Upticks wordmark and mobile navigation within the viewport. */
@media(max-width:600px){.brand-logo{width:clamp(132px,42vw,166px);max-width:166px;height:auto}}
@media(max-width:360px){.nav-actions .top-start{display:none}}