/* MioSize brand v2 — sourced from the supplied blue brand guide.
   Separate from the base stylesheet so every vertical page gets the same system. */
:root{
 color-scheme:dark;
 --bg:#061426;--panel:#0B1F34;--line:#1C4A77;
 --ink:#F5FAFF;--muted:#AFCAE0;--mint:#00D2FF;--mint-l:#70E5FF;--blue:#007BFF;
 --brand-primary:#007BFF;--brand-cyan:#00D2FF;--brand-navy:#0B1F3B;--brand-light:#F8FAFC;
}
html{scroll-behavior:smooth}
body{
 background:
 radial-gradient(ellipse 52% 29% at 75% 8%,rgba(0,123,255,.15),transparent 80%),
 linear-gradient(180deg,#061426 0%,#051426 36%,#051323 100%);
 color:var(--ink);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
}
a:focus-visible,button:focus-visible{outline:3px solid #7ACFFF;outline-offset:3px}
em,.hero h1 em,.section h2 em{color:#00B5FF}
.topline{background:linear-gradient(90deg,#0C2541,#0B3451);color:#B5E9FF;font-size:11px;height:30px}
.pulse{background:var(--brand-cyan);box-shadow:0 0 0 4px #00D2FF22}
.header{background:#061427ed;border-bottom:1px solid #1D4A74;backdrop-filter:blur(14px)}
.nav{height:88px;gap:30px}
.brand{display:inline-flex;align-items:center;flex:0 0 auto}
.brand .miosize-wordmark{width:222px;height:auto;display:block;object-fit:contain}
.nav nav a{color:#D0E6FA;font-weight:650;font-size:13px}
.nav nav a:hover,.footer a:hover{color:#27C5FF}
.nav-action{border-color:#0578D9;color:#fff;padding:12px 21px;box-shadow:inset 0 0 0 1px #0083FF19}
.nav-action:hover{background:#0C2D4B}
.nav-action span{color:var(--brand-cyan)}
.shell{max-width:1240px}
.hero{
 min-height:650px;grid-template-columns:minmax(0,.97fr) minmax(0,1.03fr);
 gap:50px;padding-top:72px;padding-bottom:82px;position:relative;isolation:isolate
}
.hero:after{
 content:"";position:absolute;inset:auto -8% 12px;z-index:-1;height:85px;
 background:radial-gradient(ellipse at 65% 70%,#007BFF35,transparent 68%);
 pointer-events:none
}
.hero-copy{max-width:580px}
.eyebrow{color:#00C7FF;letter-spacing:.14em;font-size:11px}
.tiny-icon{font-size:20px;font-weight:900}
.hero h1{font-size:clamp(45px,4.7vw,69px);font-weight:850;line-height:1.085;letter-spacing:-.055em;margin:20px 0 24px;max-width:580px}
.hero-copy>p{color:#BBD0E4;font-size:16.5px;line-height:1.75;max-width:530px}
.hero .actions{margin:28px 0 20px}
.btn{min-height:52px;border-radius:12px;transition:background .2s,box-shadow .2s,transform .2s}
.btn.primary,.whitelabel .btn.primary{
 color:#031C33;border:1px solid #35D5FF;
 background:linear-gradient(115deg,#00D2FF 0%,#00A6FF 46%,#007BFF 100%);
 box-shadow:0 10px 24px #007BFF2E
}
.btn.primary:hover,.whitelabel .btn.primary:hover{background:linear-gradient(115deg,#73E7FF,#20B7FF);box-shadow:0 15px 30px #007BFF43}
.btn.ghost{background:#0A223C;border:1px solid #2772AE;color:#EAF4FF}
.btn.ghost:hover{background:#133F68}
.hero-caution{font-size:11.5px;color:#9EB8D0;max-width:500px}
.hero-caution .info{border-color:#549ED4;color:#B6E8FF}
.trustline{margin-top:29px;gap:14px;color:#BFD8EA;font-size:11px}
.trustline span{display:flex;align-items:center;gap:8px}
.trustline i{
 width:27px;height:27px;display:grid;place-items:center;color:#15CEFF;font-size:16px;
 border:1px solid #175E9B;border-radius:50%;background:#092948;margin-right:0
}
.hero-visual{
 height:508px;background:linear-gradient(145deg,#08203B,#071A30 62%,#061529);
 border:1px solid #1266A8;border-radius:22px;
 box-shadow:0 22px 60px #0009,0 0 50px #007BFF19;position:relative;overflow:hidden
}
.visual-grid{
 background-image:linear-gradient(#2FB9FF0E 1px,transparent 1px),linear-gradient(90deg,#2FB9FF0E 1px,transparent 1px);
 background-size:25px 25px;opacity:1;mask-image:none
}
.visual-grid:after{
 content:"";position:absolute;inset:0;
 background:radial-gradient(ellipse at 47% 52%,rgba(0,123,255,.22),transparent 63%);
}
.visual-top{font-size:10px;color:#B9E3FF;padding:18px 21px}
.visual-dot,.dot{background:#00D2FF;box-shadow:0 0 15px #00D2FF8A}
.alpha-tag{border:1px solid #187EBE;background:#071F36;color:#B6E9FF}
.visual-stage{display:grid;grid-template-columns:minmax(0,1fr) 42%;gap:8px;padding:0 26px 20px;min-height:0}
.scan-foot-area{height:100%;position:relative;min-height:0;display:flex;align-items:center;justify-content:center;padding:5px}
.scan-foot{height:100%;max-height:342px;width:100%;object-fit:contain;filter:drop-shadow(0 0 12px #007BFF66)}
.scan-corner{position:absolute;width:19px;height:19px;border-color:#00D2FF;border-style:solid;filter:drop-shadow(0 0 6px #00C3FF6B)}
.corner-tl{left:16%;top:8%;border-width:3px 0 0 3px}
.corner-tr{right:10%;top:8%;border-width:3px 3px 0 0}
.corner-bl{left:16%;bottom:11%;border-width:0 0 3px 3px}
.corner-br{right:10%;bottom:11%;border-width:0 3px 3px 0}
.scan-foot-ruler{position:absolute;left:8%;top:16%;bottom:18%;border-left:1px solid #00C3FF8A}
.scan-foot-ruler:before,.scan-foot-ruler:after{content:"";position:absolute;width:14px;height:1px;left:-7px;background:#00D2FF}
.scan-foot-ruler:before{top:0}.scan-foot-ruler:after{bottom:0}
.scan-foot-caption{position:absolute;bottom:1%;left:50%;transform:translateX(-50%);font-size:9px;font-weight:800;white-space:nowrap;color:#72D7FF;letter-spacing:.13em}
.scan-paper-area{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;min-width:0}
.scan-paper-hint{font-size:10px;font-weight:800;color:#79C8EE;letter-spacing:.12em}
.paper{
 width:clamp(88px,10vw,143px);height:clamp(135px,15vw,202px);
 background:linear-gradient(150deg,#F8FCFF 0%,#C7D9E8 100%);transform:none;border:1px solid #C6EBFF;
 box-shadow:0 0 0 6px #007BFF18,0 0 28px #00B6FF31
}
.paper span{font-size:clamp(27px,3vw,40px);color:#4B7094;font-weight:850}
.paper small{color:#5D7C97}
.paper-corner{border-color:#00BEFF;width:15px;height:15px}
.visual-bottom{background:#06172AE8;border-top:1px solid #1C5786;padding:16px 18px;gap:6px;letter-spacing:0}
.visual-bottom span{flex:1;text-align:center;white-space:normal;line-height:1.45;color:#3AC7FF;font-size:15px}
.visual-bottom span strong{display:block;color:#C4E7FF;font-size:10px;font-weight:650}
.metrics{background:#091E33;border-color:#174A75}
.metrics strong{color:#00B9FF}
.metrics span{color:#BDDAEF}
.section{padding-top:100px;padding-bottom:110px}
.section h2,.category-related h2{letter-spacing:-.045em}
.section-intro p{color:#B2C9DA}
.vertical-section .section-intro{
 display:grid;grid-template-columns:1.1fr .9fr;column-gap:50px;
 align-items:end;max-width:none;margin-bottom:35px
}
.vertical-section .section-intro .eyebrow{grid-column:1/-1;margin-bottom:9px}
.vertical-section .section-intro h2{margin:0;max-width:590px}
.vertical-section .section-intro p{margin:0;max-width:465px;font-size:15px}
.vertical-grid{gap:16px;grid-template-columns:repeat(3,minmax(0,1fr))}
.vertical-card{
 border-color:#16578A;background:linear-gradient(155deg,#0B2640,#08192D);
 border-radius:17px;padding:0 20px 20px;box-shadow:0 12px 22px #0002
}
.vertical-card:focus-within,.vertical-card:hover{border-color:#158FDC;box-shadow:0 20px 38px #007BFF12}
.vertical-card-image{
 height:225px;margin:0 -20px 18px;
 background:radial-gradient(ellipse at 50% 83%,#0E5E9C6B,transparent 65%),linear-gradient(160deg,#0D2945,#071B30);
 overflow:hidden
}
.vertical-card-image:before{
 content:"";position:absolute;left:7%;right:7%;bottom:15px;height:1px;
 background:linear-gradient(90deg,transparent,#1879BF,transparent)
}
.vertical-card-image img{height:194px;width:92%;object-fit:contain;filter:drop-shadow(0 13px 18px #020813B2)}
.vertical-card-image:hover img{transform:translateY(-4px) scale(1.02)}
.vertical-card:first-child .vertical-card-image img{
 height:216px;width:auto;max-width:94%;object-fit:contain;filter:drop-shadow(0 13px 17px #030B16B7)
}
.vertical-card h3{font-size:21px;letter-spacing:-.035em;margin-bottom:8px}
.vertical-card p{font-size:13px;color:#B4CBDD;line-height:1.62}
.vertical-card-actions{border-top-color:#225076}
.vertical-card-actions a{color:#38CCFF}
.vertical-hint{color:#97B4CE}
.features article,.status-table{border-color:#214E78}
.features article{background:linear-gradient(145deg,#0C2B47,#081C31)}
.feature-icon{background:#0A3C70;color:#37CFFF}
.small-status{color:#47C7FF}
.whitelabel{background:linear-gradient(125deg,#0C2946,#0A1D36);color:#EEF9FF;border-top:1px solid #154B7A;border-bottom:1px solid #154B7A}
.whitelabel .eyebrow{color:#65D9FF}
.whitelabel h2 em{color:#24BBFF}
.whitelabel p{color:#B4D1E6}
.partner-ui,.integration-demo{background:#112C4D;color:#F4FAFF;border-color:#2D6497;box-shadow:0 24px 70px #0005}
.partner-head small,.partner-content>small,.partner-bottom,.integration-demo small{color:#AFCBE0}
.fake-button{background:#007BFF}
.partner-live{background:#06395C;color:#7FDEFF}
.state-section .status-table>div{background:#09233B;border-color:#1C4A74}
.status.yes{background:#073F61;color:#9ADFFF}
.status.next{background:#0B3562;color:#8AC8FF}
.last-cta{background:linear-gradient(105deg,#073A6C,#081D36);border-color:#145686}
.footer{background:#04101E}
.footer .brand .miosize-wordmark{width:206px}
.footer p{color:#A3BFD4}
.footer-links{color:#B7CEE1}
.category-visual{
 background:radial-gradient(ellipse at 50% 70%,#0C56916A,transparent 65%),linear-gradient(155deg,#0E2B49,#081A30);
 border-color:#1767A4
}
.category-visual-label{border-color:#247CB4}
.category-visual-label span{color:#48D1FF}
.category-data{background:#0C2844;border-color:#1B588B}
.category-data li:before{color:#21C5FF}
.breadcrumbs{color:#A9C7DB}
.category-related-links a{border-color:#246FA6}
.category-related-links a:hover{background:#0B3D69}
@media(max-width:1090px){
 .nav{gap:17px}.nav nav{gap:13px}.brand .miosize-wordmark{width:195px}
 .hero{gap:23px}.hero h1{font-size:clamp(40px,5vw,60px)}
 .hero-visual{height:475px}
}
@media(max-width:820px){
 .nav{height:auto;min-height:72px;padding:10px 0;display:flex;flex-wrap:wrap}
 .nav nav{display:flex;order:3;width:100%;overflow-x:auto;gap:22px;padding:6px 0 3px;scrollbar-width:thin}
 .nav nav a{white-space:nowrap;font-size:12px}
 .brand .miosize-wordmark{width:185px}
 .hero{grid-template-columns:1fr;min-height:0;gap:32px;padding-top:54px}
 .hero h1{font-size:clamp(39px,7vw,58px)}
 .hero-visual{width:100%;max-width:620px;height:450px}
 .vertical-section .section-intro{grid-template-columns:1fr;gap:12px}
 .vertical-section .section-intro .eyebrow{grid-column:1}
 .vertical-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:590px){
 .shell{width:calc(100% - 32px)}
 .topline{font-size:9px;text-align:center;padding:6px 9px}
 .nav{gap:10px}.brand .miosize-wordmark{width:167px}
 .nav-action{padding:9px 13px;font-size:11px}
 .hero{padding-top:35px;padding-bottom:57px;gap:25px}
 .hero h1{font-size:clamp(36px,9vw,52px);max-width:470px}
 .hero-copy>p{font-size:14px}
 .hero .actions{flex-direction:column}.hero .actions .btn{width:100%}
 .hero-caution{font-size:11px}
 .trustline{gap:10px;flex-wrap:wrap;margin-top:20px}.trustline span{font-size:10px}
 .trustline i{height:24px;width:24px;font-size:13px}
 .hero-visual{height:392px;border-radius:17px}
 .visual-stage{padding:0 12px 15px;grid-template-columns:minmax(0,1fr) 43%}
 .scan-foot{max-height:280px}.scan-foot-area{min-height:0}
 .paper{width:95px;height:147px}
 .visual-bottom{padding:12px 7px}.visual-bottom span{font-size:12px}.visual-bottom span strong{font-size:8px}
 .visual-top{padding:14px;font-size:9px}
 .section{padding-top:65px;padding-bottom:72px}
 .vertical-grid{grid-template-columns:1fr;gap:14px}
 .vertical-card-image{height:225px}.vertical-card-image img{height:200px}
 .vertical-card:first-child .vertical-card-image img{height:216px}
 .category-hero{grid-template-columns:1fr}
 .category-visual{min-height:285px}
 .category-visual img{height:235px}
 .footer .brand .miosize-wordmark{width:185px}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* Final consistency: all secondary UI uses the brand blues, not leftover green. */
.partner-symbol{color:#00C8FF}
.partner-content>small{color:#BAD3EA}
.footer .brand{gap:0}
.footer .brand .miosize-wordmark{height:auto}
.vertical-card-actions a:focus-visible,.brand:focus-visible,.nav a:focus-visible{border-radius:4px}
@media(min-width:821px){.hero-visual{min-width:0}}

@media(max-width:820px){
 .header .nav{overflow:hidden}
 .header .nav nav{max-width:100%;min-width:0;flex-basis:100%;overflow-x:auto;overflow-y:hidden}
}

@media(max-width:590px){
 .header .nav nav{gap:13px}
 .header .nav nav a:nth-child(4){display:none}
}

html{overflow-x:clip}
body{overflow-x:clip}

/* Approved premium product photography replaces the old schematic category icons. */
.vertical-card:not(:first-child) .vertical-card-image img[src$=".webp"]{
 display:block;width:100%;height:100%;max-width:none;object-fit:cover;
 filter:none;transform:none;
 mask-image:linear-gradient(to bottom,transparent 0%,#000 7%,#000 87%,transparent 100%);
}
.vertical-card:not(:first-child) .vertical-card-image:hover img[src$=".webp"]{transform:scale(1.035)}
.category-visual img[src$=".webp"]{
 width:100%;height:330px;max-width:100%;object-fit:cover;border-radius:13px;
 mask-image:radial-gradient(ellipse at center,#000 55%,transparent 84%);
 filter:none;
}
.integration-demo img[src$=".webp"]{
 width:100%;max-width:350px;height:215px;object-fit:contain;border-radius:12px;
}
@media(max-width:700px){.category-visual img[src$=".webp"]{height:245px}}
