:root{--navy:#071b34;--ink:#14243a;--muted:#657184;--blue:#0064d2;--blue2:#001e82;--purple:#5e50bf;--magenta:#a0168c;--cyan:#00a6c8;--line:#e5e9ef;--paper:#f6f8fb;--white:#fff;--max:1200px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;color:var(--ink);font-family:'DM Sans',Arial,sans-serif;font-size:16px;line-height:1.65;background:#fff;overflow-x:hidden}p{font-size:17px;line-height:1.75;color:#566477;margin:0 0 18px}h1,h2,h3{font-family:Manrope,'DM Sans',sans-serif;line-height:1.08;letter-spacing:-.045em;margin:0;font-weight:800}h2{font-size:clamp(38px,5vw,64px)}h2 span{color:#98a7ba}h2 em,h1 em{font-style:normal;color:#69b9ff}.section{padding:110px max(6vw,24px)}.section>*{max-width:var(--max);margin-left:auto;margin-right:auto}.reading-progress{height:3px;position:fixed;top:0;left:0;right:0;z-index:1000;background:transparent}.reading-progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,#0064d2,#a0168c)}.topbar{height:76px;position:fixed;top:3px;left:0;right:0;z-index:100;background:rgba(255,255,255,.92);backdrop-filter:blur(16px);border-bottom:1px solid rgba(220,226,235,.8);display:flex;align-items:center;padding:0 5vw;gap:28px}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);min-width:205px}.brand-mark{width:36px;height:36px;border-radius:11px;background:var(--navy);color:#fff;display:grid;place-items:center;font-weight:800;font-size:16px;position:relative}.brand-mark span{color:#36b9ff}.brand-name{font:800 11px Manrope;letter-spacing:.08em;line-height:1.3}.brand-name small{display:block;font:500 9px 'DM Sans';color:#778397;letter-spacing:.12em}.desktop-nav{display:flex;gap:24px;margin:auto}.desktop-nav a,.contact-link{font-size:16px;font-weight:700;color:#536175;text-decoration:none}.desktop-nav a:hover,.contact-link:hover{color:var(--blue)}.contact-link{border:1px solid #d6dfeb;padding:10px 16px;border-radius:30px;color:var(--ink)}.contact-link span{color:var(--blue);padding-left:8px}.menu-toggle,.mobile-menu{display:none}
.hero{min-height:760px;background:var(--navy);color:#fff;position:relative;overflow:hidden;padding:180px max(7vw,28px) 80px;display:flex;align-items:center}.hero-inner{width:min(650px,55%);position:relative;z-index:2}.hero-glow{position:absolute;width:800px;height:800px;border-radius:50%;background:radial-gradient(circle,rgba(0,100,210,.25),transparent 67%);right:-150px;top:-120px}.hero-grid{position:absolute;inset:0;opacity:.1;background-image:linear-gradient(rgba(255,255,255,.18) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.18) 1px,transparent 1px);background-size:68px 68px;mask-image:linear-gradient(90deg,transparent,#000)}.eyebrow,.section-kicker,.micro-label{font-size:16px;font-weight:800;letter-spacing:.17em;color:#4d87ca;display:flex;align-items:center;gap:12px}.hero .eyebrow{color:#a4c5e8}.pulse{width:7px;height:7px;border-radius:50%;background:#45d5b0;box-shadow:0 0 0 5px #45d5b01c}.eyebrow-line{width:45px;height:1px;background:#57708e}.hero h1{font-size:clamp(58px,7.4vw,102px);margin:35px 0 24px;line-height:.99}.hero-copy{max-width:560px;color:#c0cddd;font-size:19px}.hero-meta{display:flex;gap:34px;margin-top:52px;border-top:1px solid #ffffff25;padding-top:22px}.hero-meta div{display:flex;flex-direction:column;gap:5px}.hero-meta small{font-size:9px;color:#86a1bf;letter-spacing:.15em}.hero-meta strong{font-size:16px;color:#fff}.scroll-cue{position:absolute;top:590px;display:flex;align-items:center;gap:12px;color:#94aac4;text-decoration:none;font-size:9px;letter-spacing:.18em}.scroll-cue span{width:25px;height:1px;background:#69b9ff}.hero-art{position:absolute;width:470px;height:470px;right:8%;top:180px;border-radius:50%;display:grid;place-items:center;transform:translateZ(0)}.orbit{position:absolute;border:1px solid #6a9bc74b;border-radius:50%;inset:25px;animation:spin 36s linear infinite}.orbit-b{inset:80px;border-style:dashed;animation-direction:reverse;animation-duration:55s}.system-core{width:140px;height:140px;border-radius:38px;background:linear-gradient(145deg,#0064d2,#35237f);box-shadow:0 20px 80px #0064d255;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;z-index:2}.system-core b{font-size:48px;line-height:1}.system-core span{font-size:9px;letter-spacing:.16em;text-align:center}.orbit-card{position:absolute;background:#102b4b;border:1px solid #41658b;color:#d9e8f7;border-radius:12px;padding:13px 15px;font-size:16px;box-shadow:0 12px 35px #0004;z-index:3}.orbit-card b{color:#69b9ff;margin-left:12px}.card-a{top:42px;left:145px}.card-b{right:-3px;top:205px}.card-c{bottom:42px;left:105px}.card-d{left:-5px;top:210px}.mini-dot{width:7px;height:7px;border-radius:50%;display:inline-block;margin-right:8px}.blue{background:#0064d2}.purple{background:#a0168c}.cyan{background:#00a6c8}.pink{background:#f05aa6}.art-caption{position:absolute;bottom:-5px;color:#8ba8c7;font-size:9px;letter-spacing:.2em}.connector{position:absolute;height:1px;width:80px;background:#5e8ab8;opacity:.6}.c1{transform:rotate(35deg);top:115px;left:95px}.c2{transform:rotate(-12deg);right:60px;top:210px}.c3{transform:rotate(-35deg);bottom:110px;left:90px}.c4{transform:rotate(25deg);left:45px;top:250px}
.intro-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:8vw;margin-top:45px}.intro-text p{max-width:690px}.callout{margin-top:30px;padding:22px 25px;border-left:3px solid var(--blue);background:#f2f6fc;display:flex;gap:15px;align-items:flex-start}.callout strong{font:700 17px/1.5 Manrope}.quote-mark{font:800 40px Georgia;color:var(--blue);line-height:.8}.context-strip{margin-top:65px;padding:24px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.context-strip div{display:flex;flex-direction:column;gap:7px}.context-strip small{font-size:9px;letter-spacing:.14em;color:#8793a3}.context-strip b{font-size:16px}
.dark-section{background:var(--navy);color:#fff}.section-kicker.light{color:#85b9ed}.section-heading{display:grid;grid-template-columns:1.1fr .8fr;align-items:end;gap:8vw;margin-top:30px;margin-bottom:55px}.section-heading h2{font-size:clamp(42px,5.6vw,70px)}.section-heading p{color:#b2c1d3;max-width:450px}.contrib-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.contrib-card{background:#102b4b;border:1px solid #254666;border-radius:17px;padding:25px 22px;min-height:285px;position:relative;transition:transform .25s,border-color .25s}.contrib-card:hover{transform:translateY(-7px);border-color:#4f9fe7}.number{position:absolute;right:20px;top:20px;color:#7593b2;font:700 11px Manrope}.contrib-icon{width:48px;height:48px;border-radius:14px;background:#0064d229;color:#7dc4ff;display:grid;place-items:center;font-size:25px;margin-bottom:30px}.contrib-card h3{font-size:19px;margin-bottom:12px}.contrib-card p{font-size:16px;color:#b2c1d3;line-height:1.6}.tag{font-size:9px;letter-spacing:.1em;color:#7db7ed;position:absolute;bottom:20px}.role-note{font-size:16px;color:#aabbd0;margin-top:25px!important;border-top:1px solid #ffffff24;padding-top:18px}.role-note b{color:#fff}
.light-heading{color:var(--ink)}.light-heading p{color:#627084}.foundation-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:55px;margin-top:45px;align-items:center}.foundation-copy h3,.component-intro h3{font:800 32px/1.15 Manrope;letter-spacing:-.04em;margin:15px 0}.foundation-copy p{font-size:16px}.palette-chips{display:flex;gap:7px;margin-top:25px;flex-wrap:wrap}.palette-chips span{width:27px;height:27px;border-radius:7px;box-shadow:0 2px 5px #0002}.palette-figure{margin:0;background:#f6f7f9;border:1px solid var(--line);border-radius:16px;padding:15px;box-shadow:0 18px 50px #152b4610}.palette-figure img{display:block;width:100%;height:auto;max-height:850px;object-fit:contain}.palette-figure figcaption,.caption-note{font-size:16px;color:#8994a4;margin-top:12px}.component-intro{margin-top:100px}.component-intro p{max-width:600px}.component-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-top:28px}.component-tab{border:1px solid #dce3ed;background:white;color:#627084;padding:10px 17px;border-radius:30px;font:700 12px 'DM Sans';cursor:pointer;transition:.2s}.component-tab.active,.component-tab:hover{background:var(--navy);color:white;border-color:var(--navy)}.component-stage{margin-top:18px;background:#f5f7fa;border:1px solid #e7ebf1;border-radius:18px;padding:35px;display:grid;grid-template-columns:.7fr 1fr;gap:40px;min-height:310px;align-items:center}.stage-index{font-size:16px;color:var(--blue);letter-spacing:.15em;font-weight:800}.stage-copy h3{font-size:29px;margin:12px 0}.stage-copy p,.stage-copy li{font-size:16px;color:#5d6b7d}.stage-copy ul{padding-left:18px}.stage-copy li{margin:5px 0}.stage-visual{display:flex;gap:20px;align-items:center;justify-content:center;min-height:220px}.demo-accordion{background:#fff;border:1px solid #e3e8ef;border-radius:10px;width:58%;padding:12px 18px;box-shadow:0 10px 30px #102b4b0d}.demo-accordion.compact{width:35%;padding:12px}.demo-row{padding:14px 4px;border-bottom:1px solid #e7ebef;display:flex;justify-content:space-between;font-size:16px;font-weight:700;color:#5c6674}.demo-row b{color:var(--blue);font-size:17px}.demo-row.active{color:#152b46}.demo-row.hover{color:var(--blue)}.demo-row.muted{color:#b1b8c2}.demo-nested{padding:12px 15px;border-left:2px solid #8c74d8;margin:6px 0 6px 10px;font-size:16px;line-height:2.1;color:#718094}.demo-nested span{color:var(--blue)}
.component-mosaic{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;margin-top:20px}.mosaic-card{grid-column:span 3;border:1px solid var(--line);border-radius:16px;padding:25px;background:#fff;min-height:270px;overflow:hidden}.mosaic-card h3{font-size:24px;margin:13px 0 8px}.mosaic-card p{font-size:16px;max-width:450px}.mosaic-top{display:flex;justify-content:space-between;color:#8a96a5;font-size:9px;font-weight:800;letter-spacing:.14em}.mosaic-top b{color:var(--blue)}.fake-table{border:1px solid #e5e9ef;border-radius:8px;margin-top:16px;overflow:hidden}.fake-tr{display:grid;grid-template-columns:1.3fr 1fr .7fr;gap:10px;padding:10px 12px;border-bottom:1px solid #edf0f4;font-size:16px;color:#5b6878}.fake-tr:last-child{border:0}.fake-tr.head{background:#f0f2f5;color:#647184;font-weight:700}.fake-tr i{font-style:normal}.status-pill{background:#e1f5eb;color:#13844d;padding:3px 8px;border-radius:20px}.alert-demo{display:flex;flex-direction:column;gap:5px;background:#eef5ff;border-left:3px solid #0064d2;padding:12px 14px;margin-top:12px;font-size:16px}.alert-demo b{color:#0064d2}.alert-demo span{color:#68778a}.alert-demo a{color:#0064d2;font-weight:700}.alert-demo.warning{background:#fff1f1;border-color:#d0021b}.alert-demo.warning b{color:#c51f36}.modal-demo{background:#fff;border:1px solid #e0e5ec;border-top:3px solid #0064d2;box-shadow:0 10px 30px #0c254018;padding:18px 20px;margin-top:16px;max-width:390px}.modal-bar{display:flex;justify-content:space-between;color:#8b96a5}.modal-demo>b{font-size:16px}.modal-demo p{font-size:16px;margin:6px 0 18px}.modal-actions{display:flex;justify-content:space-between;color:#0064d2;font-size:16px}.crumb-demo{margin-top:24px;background:#f4f6f9;padding:16px;border-radius:8px;font-size:16px;color:#8793a3}.crumb-demo b{color:#26364a}.nav-demo{display:flex;justify-content:space-between;align-items:center;padding:16px;border:1px solid #e6ebf0;margin-top:10px;border-radius:7px;font-size:16px;color:#7b8797}.nav-demo b{font-size:22px;color:#0064d2}.button-demo{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}.button-demo button{background:#0064d2;border:1px solid #0064d2;color:white;padding:10px 14px;border-radius:3px;font:700 11px 'DM Sans'}.button-demo .secondary{background:white;color:#0064d2}.button-demo .disabled{background:#f1f2f4;color:#aab1bb;border-color:#e1e4e8}.caption-note{margin-top:16px!important}
.responsive-section{background:#f5f7fa}.responsive-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:45px;align-items:center}.responsive-grid h2{font-size:clamp(40px,5vw,62px);margin:22px 0}.breakpoint-list{margin-top:30px}.breakpoint-list div{display:grid;grid-template-columns:60px 1fr 80px;gap:12px;align-items:center;padding:11px 0;border-bottom:1px solid #dfe5ed}.breakpoint-list b{font:800 17px Manrope;color:#0064d2}.breakpoint-list span{font-size:16px;color:#5e6c7e}.breakpoint-list i{height:6px;background:#dbe3ee;border-radius:8px;position:relative}.breakpoint-list i:after{content:"";display:block;height:6px;background:linear-gradient(90deg,#0064d2,#5e50bf);border-radius:8px;width:var(--w,80%)}.breakpoint-list div:nth-child(1) i:after{--w:25%}.breakpoint-list div:nth-child(2) i:after{--w:50%}.breakpoint-list div:nth-child(3) i:after{--w:72%}.breakpoint-list div:nth-child(4) i:after{--w:100%}.device-scene{height:420px;position:relative;display:flex;align-items:center;justify-content:center;gap:20px;perspective:900px}.device{background:#18283d;border-radius:22px;padding:8px;box-shadow:0 25px 55px #152b4626;position:relative;transition:transform .25s}.device:hover{transform:translateY(-7px) rotateY(-3deg)}.device-screen{background:white;border-radius:15px;height:100%;padding:14px 10px;overflow:hidden}.device.phone{width:110px;height:230px;z-index:3}.device.tablet{width:205px;height:290px;z-index:2}.device.desktop{width:300px;height:210px;z-index:1}.device>span{position:absolute;bottom:-27px;left:0;right:0;text-align:center;font-size:9px;letter-spacing:.12em;color:#6f7d8f}.device-notch{position:absolute;width:35px;height:5px;border-radius:5px;background:#18283d;top:5px;left:calc(50% - 17px);z-index:2}.screen-brand{font-size:16px;font-weight:800;color:#0064d2;display:flex;justify-content:space-between;border-bottom:1px solid #e7ebef;padding-bottom:12px}.screen-brand span{font-size:9px;color:#8793a3}.screen-line{height:6px;width:65%;background:#e4eaf1;border-radius:6px;margin:14px 0}.screen-line.long{width:95%}.screen-line.short{width:45%}.screen-card{height:55px;background:#eff4fa;border-left:3px solid #0064d2;margin:12px 0;border-radius:3px}.screen-card.small{height:35px;background:#f7eff9;border-color:#a0168c}.screen-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.screen-grid i{height:45px;background:#eef3f9;border-radius:4px}
.governance-flow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;gap:12px;align-items:center}.flow-step{background:#102b4b;border:1px solid #274765;border-radius:13px;padding:20px;min-height:180px}.flow-step span{color:#6ab7f7;font:800 12px Manrope}.flow-step b{display:block;font:800 18px Manrope;margin:15px 0 7px}.flow-step p{font-size:16px;color:#b1c1d3;line-height:1.5}.flow-arrow{color:#6ab7f7;font-size:22px}.governance-bottom{display:grid;grid-template-columns:1fr 1fr;gap:10vw;margin-top:55px;padding-top:35px;border-top:1px solid #ffffff24}.governance-bottom h3{font-size:32px;margin-top:15px}.governance-bottom p{color:#b3c1d2}
.quality-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:45px}.quality-item{border:1px solid var(--line);border-radius:15px;padding:25px}.quality-item>span{font-size:9px;letter-spacing:.14em;color:#6e7c90;font-weight:800}.quality-item h3{font-size:20px;margin:25px 0 10px}.quality-item p{font-size:16px}.state-pills{display:flex;flex-wrap:wrap;gap:6px;margin-top:22px}.state-pills b{font-size:16px;padding:7px 9px;border:1px solid #dfe5ed;border-radius:5px;color:#596a7f}.state-pills b:nth-child(2){color:#0064d2;border-color:#0064d2}.state-pills b:nth-child(4){background:#0064d2;color:#fff}.mini-breakpoints{display:flex;align-items:end;gap:9px;height:60px;margin-top:20px}.mini-breakpoints i{font-style:normal;background:linear-gradient(180deg,#0064d2,#5e50bf);width:25px;border-radius:4px 4px 0 0;color:white;text-align:center;font-size:8px;padding-top:8px}.mini-breakpoints i:nth-child(1){height:25px}.mini-breakpoints i:nth-child(2){height:37px}.mini-breakpoints i:nth-child(3){height:48px}.mini-breakpoints i:nth-child(4){height:60px}.feedback-sample{display:flex;gap:12px;background:#eef5ff;border-left:3px solid #0064d2;padding:15px;margin-top:20px;color:#0064d2;font-size:16px}.feedback-sample small{color:#66788c}
.reflection{background:#f6f8fb}.reflection-grid{display:grid;grid-template-columns:1fr 1fr;gap:10vw;margin-top:40px}.reflection-grid p{font-size:17px}.takeaway-row{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-top:55px;border-top:1px solid #dfe5ed;padding-top:22px}.takeaway-row div{display:flex;gap:12px;align-items:center}.takeaway-row b{font:800 13px Manrope;color:#0064d2}.takeaway-row span{font-size:16px;font-weight:700}
.evidence{padding-top:75px;padding-bottom:75px}.evidence-box{background:#eef3f9;border-radius:18px;padding:40px;display:grid;grid-template-columns:1fr 1fr;gap:8vw}.evidence-box h2{font-size:38px;margin:15px 0}.evidence-box p{font-size:16px}.evidence-list div{padding:13px 0;border-bottom:1px solid #d9e1eb;display:flex;flex-direction:column;gap:5px}.evidence-list b{font-size:16px}.evidence-list span{font-size:16px;color:#667487}.closing{background:linear-gradient(125deg,#061b35,#0a3260);padding:100px 24px;text-align:center;color:#fff}.closing .micro-label{justify-content:center;color:#8ebce8}.closing h2{font-size:clamp(48px,7vw,82px);margin:25px 0 35px}.closing-cta{display:inline-flex;gap:35px;align-items:center;border:1px solid #6ba5dc;color:white;text-decoration:none;border-radius:40px;padding:14px 23px;font-size:16px;font-weight:700}.closing-cta span{color:#6ab7f7}.footer{background:#041326;color:#fff;padding:30px 6vw}.footer-top{display:flex;align-items:center;justify-content:space-between;padding-bottom:25px;border-bottom:1px solid #ffffff20}.footer-brand{color:#fff}.footer-brand .brand-mark{background:#12345b}.footer-brand .brand-name small{color:#8fa6c0}.back-link,.top-link{color:#b9c8d8;text-decoration:none;font-size:16px}.back-link:hover,.top-link:hover{color:#fff}.footer-bottom{display:flex;justify-content:space-between;gap:25px;padding-top:22px;color:#91a3b9;font-size:16px}.socials{display:flex;gap:17px;align-items:center;flex-wrap:wrap}.socials b{font-size:9px;letter-spacing:.12em;color:#6e8bab}.socials a{color:#c3d0df;text-decoration:none;font-size:16px}.socials a:hover{color:#69b9ff}
@keyframes spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
@media(max-width:1000px){.desktop-nav{gap:13px}.desktop-nav a{font-size:16px}.hero-art{right:-5%;transform:scale(.82)}.hero-inner{width:60%}.contrib-grid{grid-template-columns:repeat(2,1fr)}.governance-flow{grid-template-columns:1fr 20px 1fr;row-gap:15px}.flow-arrow:nth-of-type(4){display:none}.flow-step{min-height:150px}.component-stage{gap:20px}.device-scene{transform:scale(.9)}}
@media(max-width:720px){.topbar{height:65px;padding:0 20px}.desktop-nav,.topbar>.contact-link{display:none}.menu-toggle{display:block;margin-left:auto;border:0;background:none;font-size:22px;color:var(--ink)}.mobile-menu{display:none;position:fixed;top:68px;left:12px;right:12px;background:white;z-index:99;padding:14px;border:1px solid var(--line);border-radius:14px;box-shadow:0 20px 40px #102b4b22}.mobile-menu.open{display:flex;flex-direction:column}.mobile-menu a{padding:13px;color:var(--ink);text-decoration:none;border-bottom:1px solid #edf0f4;font-weight:700;font-size:16px}.hero{min-height:860px;padding:140px 24px 70px;align-items:flex-start}.hero-inner{width:100%}.hero h1{font-size:clamp(55px,14vw,78px)}.hero-copy{font-size:17px}.hero-meta{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:35px}.hero-art{top:auto;bottom:20px;right:calc(50% - 210px);transform:scale(.67);transform-origin:center bottom}.scroll-cue{top:auto;bottom:300px}.section{padding:75px 22px}.intro-grid,.section-heading,.foundation-layout,.responsive-grid,.governance-bottom,.reflection-grid,.evidence-box{grid-template-columns:1fr;gap:25px}.context-strip{grid-template-columns:1fr 1fr;row-gap:22px}.contrib-grid{grid-template-columns:1fr 1fr}.contrib-card{min-height:310px;padding:20px 16px}.contrib-card h3{font-size:17px}.contrib-card p{font-size:16px}.component-stage{grid-template-columns:1fr;padding:22px}.stage-visual{min-height:200px}.demo-accordion{width:60%}.demo-accordion.compact{width:36%}.component-mosaic{grid-template-columns:1fr}.mosaic-card{grid-column:span 1}.device-scene{height:340px;transform:scale(.72);transform-origin:center}.governance-flow{grid-template-columns:1fr;gap:8px}.flow-arrow{transform:rotate(90deg);text-align:center}.flow-arrow:nth-of-type(4){display:block}.flow-step{min-height:auto}.quality-grid{grid-template-columns:1fr}.takeaway-row{grid-template-columns:1fr 1fr;row-gap:20px}.evidence-box{padding:25px}.footer-top,.footer-bottom{align-items:flex-start;flex-direction:column}.socials{gap:12px}.footer{padding:28px 22px}.closing{padding:80px 22px}.palette-figure{padding:8px}.palette-figure img{max-height:650px}}
@media(max-width:420px){.contrib-grid{grid-template-columns:1fr}.contrib-card{min-height:260px}.context-strip{grid-template-columns:1fr 1fr}.hero-meta strong{font-size:16px}.component-tab{padding:9px 12px}.component-stage{padding:18px}.stage-visual{gap:8px}.demo-accordion{width:62%;padding:8px}.demo-accordion.compact{width:35%;padding:8px}.demo-row{font-size:16px;padding:11px 2px}.device-scene{margin-left:-40px;margin-right:-40px;transform:scale(.62)}.takeaway-row{grid-template-columns:1fr}}

/* Comparison slider and progressive reveal */
.comparison-block{display:grid;grid-template-columns:.75fr 1.25fr;gap:45px;align-items:center;margin-top:75px;padding:30px;background:#f6f8fb;border:1px solid #e5eaf0;border-radius:18px}
.comparison-block h3{font:800 30px/1.12 Manrope;letter-spacing:-.04em;margin:15px 0}
.comparison-block p{font-size:16px}
.comparison-widget{height:235px;position:relative;overflow:hidden;border-radius:12px;background:#e8edf4;--split:50%}
.compare-panel{position:absolute;inset:0;padding:18px;display:flex;flex-direction:column;justify-content:space-between}
.compare-panel>span{font-size:9px;font-weight:800;letter-spacing:.12em}
.compare-before{background:#e8ebf0;color:#647184}
.compare-after{background:#e7f1fc;color:#164c86;clip-path:inset(0 0 0 var(--split))}
.compare-fragment{background:white;border:1px solid #dce3eb;border-radius:9px;padding:14px;width:75%;box-shadow:0 8px 20px #14243a0d}
.compare-fragment b{display:block;font-size:13px;margin-bottom:12px}
.compare-fragment i{display:block;height:6px;width:80%;background:#e5e9ef;border-radius:5px;margin:8px 0}
.compare-fragment i:nth-of-type(2){width:54%}
.compare-fragment button{background:#0064d2;border:0;color:white;border-radius:4px;padding:7px 12px;font-size:10px;margin:4px 0}
.compare-fragment small{display:block;color:#8591a0;font-size:10px;margin-top:7px}
.compare-divider{position:absolute;top:0;bottom:0;left:var(--split);width:2px;background:#fff;box-shadow:0 0 0 1px #0064d2;pointer-events:none}
.compare-range{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0}
.desktop-nav a.active{color:#0064d2}
.js-reveal{opacity:0;transform:translateY(18px);transition:opacity .65s ease,transform .65s ease}
.js-reveal.is-visible{opacity:1;transform:translateY(0)}
@media(max-width:720px){.comparison-block{grid-template-columns:1fr;padding:22px;gap:10px}.comparison-widget{height:210px}}
@media(prefers-reduced-motion:reduce){.js-reveal{opacity:1;transform:none}}

/* Supplied portfolio brand assets */
.brand{display:flex;align-items:center;min-width:0}
.brand-logo{display:block;width:78px;height:78px;object-fit:contain;border-radius:50%}
.footer-brand .brand-logo{width:72px;height:72px}
@media(max-width:760px){.brand-logo{width:62px;height:62px}.footer-brand .brand-logo{width:60px;height:60px}}

/* Original screen evidence gallery */
.original-evidence{background:#f7f9fc}
.evidence-gallery-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin:55px 0 22px}
.evidence-gallery-head h3{font:800 28px/1.1 Manrope;margin:10px 0 0;letter-spacing:-.04em}
.gallery-search{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #dce3eb;border-radius:999px;padding:0 16px;height:44px;min-width:230px;color:#65758a}
.gallery-search input{border:0;outline:0;background:transparent;min-width:0;width:100%;font:500 14px 'DM Sans',sans-serif;color:#152238}
.gallery-filters{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 25px}
.gallery-filter{border:1px solid #d6deea;background:#fff;color:#526176;border-radius:999px;padding:9px 14px;font:600 12px 'DM Sans',sans-serif;cursor:pointer;transition:.2s}
.gallery-filter:hover,.gallery-filter.active{background:#071f45;border-color:#071f45;color:#fff}
.original-screen-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.original-screen-card{display:flex;flex-direction:column;text-align:left;padding:0;border:1px solid #e1e7ef;background:#fff;border-radius:13px;overflow:hidden;cursor:zoom-in;min-width:0;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}
.original-screen-card:hover{transform:translateY(-4px);border-color:#9ab9e5;box-shadow:0 14px 34px #102d5015}
.original-screen-image{height:245px;display:flex;align-items:center;justify-content:center;padding:13px;background:#eef1f5;overflow:hidden}
.original-screen-image img{width:100%;height:100%;object-fit:contain;display:block}
.original-screen-meta{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 15px;min-height:69px}
.original-screen-meta b{display:block;color:#17253b;font:700 13px/1.35 'DM Sans',sans-serif}
.original-screen-meta small{display:block;color:#7a8798;font:500 11px/1.4 'DM Sans',sans-serif;margin-top:4px}
.original-screen-meta i{font-style:normal;color:#0064d2;font-size:18px}
.gallery-note{font-size:14px!important;color:#6e7b8d;margin-top:18px}
.original-screen-card[hidden]{display:none}
.screen-lightbox{position:fixed;inset:0;z-index:1000;background:rgba(4,10,20,.94);display:none;align-items:center;justify-content:center;padding:65px 80px}
.screen-lightbox.open{display:flex}
.screen-lightbox figure{margin:0;max-width:min(1100px,86vw);max-height:86vh;display:flex;flex-direction:column;align-items:center;gap:12px}
.screen-lightbox figure img{display:block;max-width:100%;max-height:78vh;width:auto;height:auto;object-fit:contain;background:#fff;box-shadow:0 20px 70px #0008}
.screen-lightbox figcaption{color:#fff;font:500 13px 'DM Sans',sans-serif;text-align:center}
.lightbox-close,.lightbox-prev,.lightbox-next{position:absolute;border:1px solid #ffffff50;background:#ffffff16;color:#fff;border-radius:50%;width:46px;height:46px;font-size:25px;cursor:pointer}
.lightbox-close{top:22px;right:24px}.lightbox-prev{left:22px;top:50%;transform:translateY(-50%)}.lightbox-next{right:22px;top:50%;transform:translateY(-50%)}
body.lightbox-open{overflow:hidden}
@media(max-width:900px){.original-screen-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.original-screen-image{height:220px}}
@media(max-width:600px){.evidence-gallery-head{align-items:stretch;flex-direction:column}.gallery-search{width:100%;box-sizing:border-box}.original-screen-grid{grid-template-columns:1fr;gap:13px}.original-screen-image{height:250px}.screen-lightbox{padding:60px 16px}.screen-lightbox figure{max-width:100%;max-height:82vh}.screen-lightbox figure img{max-height:72vh}.lightbox-prev{left:8px}.lightbox-next{right:8px}}
@media(prefers-reduced-motion:reduce){.original-screen-card{transition:none}}
