*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px;background:#000;color:#ebebeb;font-family:"Space Grotesk",sans-serif}body{margin:0;padding:24px}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}a:focus-visible,button:focus-visible{outline:2px solid #00d9ff;outline-offset:5px}.shell{max-width:1600px;margin:auto;background:#0c0c0c;border:0;border-radius:40px;overflow:hidden;position:relative;box-shadow:0 30px 100px #000}.noise{position:absolute;inset:0;pointer-events:none;opacity:.15;z-index:2;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 180 180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.25' filter='url(%23n)'/%3E%3C/svg%3E");mix-blend-mode:soft-light}header{position:relative;z-index:5;display:flex;align-items:center;justify-content:space-between;padding:30px 48px}.brand{display:flex;align-items:center;gap:10px;font-size:22px;font-weight:600;letter-spacing:-1px}.brand>.logo-tile:first-child{display:grid;place-items:center;width:37px;height:37px;border-radius:12px;background:#00d9ff;color:#000;font-size:25px;font-weight:700}.brand-period{font-size:10px;align-self:flex-start;margin-left:-5px;margin-top:4px}nav{display:flex;gap:28px;padding:16px 26px;border:1px solid #ffffff0d;border-radius:99px;background:#ffffff0d;backdrop-filter:blur(16px);font-size:12px;color:#ffffffb3}nav a:hover{color:#00d9ff}.header-right{display:flex;align-items:center;gap:24px}.mono,.status,.eyebrow,.project-meta,.project-status,.card-label,.chart-caption,.more-services>span,.portrait-note,.contact-bottom>span,.footer-line{font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:1.4px}.status{display:flex;align-items:center;gap:8px;font-size:8px;letter-spacing:1.4px}.status i{display:inline-block;width:6px;height:6px;background:#00d9ff;border-radius:50%;animation:pulse 2s infinite}@keyframes pulse{50%{opacity:.4;box-shadow:0 0 10px #00d9ff80}}.white-button{background:#ebebeb;color:#000;padding:14px 20px;border-radius:99px;font-size:12px;font-weight:500}.white-button span{margin-left:14px}.hero{position:relative;display:grid;grid-template-columns:7fr 5fr;min-height:650px;padding:73px 64px 60px;isolation:isolate}.grid-backdrop{position:absolute;inset:0;background:linear-gradient(#ffffff05 1px,transparent 1px),linear-gradient(90deg,#ffffff05 1px,transparent 1px);background-size:60px 60px;mask-image:linear-gradient(90deg,transparent,#000);z-index:-2}.glow{position:absolute;border-radius:50%;filter:blur(120px);pointer-events:none;z-index:-1}.glow-one{right:30px;top:70px;width:450px;height:400px;background:#00d9ff;opacity:.11}.eyebrow{display:flex;align-items:center;gap:10px;color:#ffffff80;font-size:9px}.spark{color:#00d9ff;font-size:20px}.hero h1{font-size:clamp(76px,7.7vw,120px)!important;line-height:.9;letter-spacing:-.065em;font-weight:500;margin:32px 0}.hero h1 em{font-weight:400;background:linear-gradient(100deg,#00d9ff 15%,#ebebeb);background-clip:text;-webkit-background-clip:text;color:transparent}.hero-copy>p{font-size:16px;color:#ffffff80;line-height:1.7;max-width:410px}.hero-actions{display:flex;align-items:center;gap:25px;margin-top:30px}.lime-button{display:inline-flex;align-items:center;gap:25px;background:#00d9ff;color:#000;font-size:13px;font-weight:700;border-radius:99px;padding:17px 24px;box-shadow:0 0 30px #00d9ff2a;transition:transform .25s cubic-bezier(.4,0,.2,1)}.lime-button:hover{transform:scale(1.05)}.quiet-link{font-size:11px;color:#fff9}.quiet-link span{margin-left:10px}.hero-proof{display:flex;align-items:center;gap:15px;margin-top:45px;font-size:11px;color:#c3c3c3}.proof-dots{display:flex;padding-left:0}.proof-dots b{width:30px;height:30px;border-radius:50%;border:2px solid #0c0c0c;background:#252825;display:grid;place-items:center;font-size:8px;margin-left:-6px;font-weight:400}.proof-dots b:first-child{margin-left:0}.proof-dots b:last-child{background:#00d9ff;color:black}.hero-proof small{display:block;font-family:"JetBrains Mono",monospace;font-size:7px;letter-spacing:1.2px;color:#fff5;margin-top:6px}.glass{background:#ffffff08;backdrop-filter:blur(16px);border:1px solid #ffffff1a;border-radius:24px;box-shadow:0 15px 45px #0004}.app-icon{width:19px;height:19px;display:grid;place-items:center;border-radius:5px;background:#00d9ff;color:#000;font-weight:700}.window-dots{margin-left:auto;letter-spacing:3px}.project-meta{font-size:7px;color:#fff5}.project-title{font-size:24px;letter-spacing:-1px;margin:15px 0 18px}.project-status{display:block;font-size:6px;color:#00d9ff;letter-spacing:1px;margin-top:9px}.check{width:18px;height:18px;border:1px solid #00d9ff30;border-radius:50%;display:grid;place-items:center;color:#00d9ff;font-size:9px}.orbit{position:absolute;border:1px solid #ffffff07;width:480px;height:480px;border-radius:50%;top:-50px;left:-30px;z-index:-1}.orbit-two{width:360px;height:360px;top:10px;left:30px}.floating-icon{font-size:22px;color:#00d9ff}.ai-cursor{position:absolute;right:15px;bottom:47px;display:flex;align-items:start;gap:0;transform:rotate(-7deg);z-index:3}.ai-cursor svg{width:23px;height:23px;fill:#00d9ff;stroke:#070a03;stroke-width:1}.ai-cursor span{background:#00d9ff;color:#000;font-size:9px;border-radius:4px;padding:7px;margin-top:17px}@keyframes float{0%,100%{translate:0 0}50%{translate:0 -10px}}.audience{border-top:1px solid #ffffff0c;border-bottom:1px solid #ffffff0c;padding:26px 64px;display:flex;align-items:center;justify-content:space-between}.audience>span{font-family:"JetBrains Mono",monospace;font-size:8px;color:#fff4;letter-spacing:1.2px}.audience>div{display:flex;gap:35px;font-size:18px;letter-spacing:-.6px;color:#fff9}.audience i{font-style:normal;color:#00d9ff;font-size:14px}.expertise{padding:85px 64px 75px}.section-heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:36px}.mono{color:#ffffff60;font-size:9px}.section-heading h2,.methodology h2{font-size:47px!important;font-weight:400;line-height:1.07;letter-spacing:-.06em;margin:20px 0 0}.section-heading>p{font-size:13px;line-height:1.7;color:#fff6;margin-bottom:0}.bento{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:235px 235px;gap:16px}.bento-card{border:1px solid #ffffff1a;border-radius:32px;padding:28px;background:#ffffff03;overflow:hidden;transition:border-color .3s cubic-bezier(.4,0,.2,1)}.bento-card:hover{border-color:#00d9ff66}.large{grid-column:span 2;grid-row:span 2;background:radial-gradient(ellipse at bottom,#00d9ff0b,transparent),#ffffff03}.tall{grid-row:span 2}.card-label{display:flex;justify-content:space-between;color:#fff5;font-size:7px;letter-spacing:1px}.card-label>span{color:#00d9ff;font-size:15px}.bento h3{font-size:31px;letter-spacing:-1.6px;font-weight:400;line-height:1.1;margin:27px 0 12px}.bento p{font-size:12px;color:#fff6;line-height:1.65;margin:0}.bar-chart{display:flex;align-items:end;height:175px;margin-top:24px;gap:10px;border-bottom:1px solid #ffffff15;background:repeating-linear-gradient(to top,transparent 0,transparent 43px,#ffffff08 43px,#ffffff08 44px)}.bar-chart div{flex:1;height:var(--height);border-radius:7px 7px 0 0;background:linear-gradient(#00d9ff,#00d9ff20);opacity:.65}.bar-chart div:nth-child(3n){opacity:.35}.bar-chart div:last-child{opacity:1}.chart-caption{display:flex;justify-content:space-between;font-size:6px;color:#fff4;letter-spacing:1px;margin-top:12px}.swatches{display:flex;margin-top:45px}.swatches span{width:30px;height:70px;border:1px solid #ffffff20;border-radius:15px;background:#00d9ff;margin-right:-3px;transform:rotate(-15deg);transform-origin:bottom}.swatches span:nth-child(2){background:#087cff;transform:rotate(-5deg)}.swatches span:nth-child(3){background:#ebebeb;transform:rotate(5deg)}.swatches span:nth-child(4){background:#232323;transform:rotate(15deg)}.design-sample{border-top:1px solid #ffffff12;margin-top:35px;padding-top:22px;font-size:65px;letter-spacing:-5px}.design-sample span{display:block;font-size:10px;letter-spacing:0;color:#fff5;line-height:1.6}.accent{background:#00d9ff;color:#000}.accent .card-label,.accent .card-label span{color:#0008}.accent h3{font-size:26px;margin-top:27px}.accent a{font-size:10px;display:flex;justify-content:space-between;margin-top:25px}.small h3{font-size:25px;margin:12px 0 7px}.small p{font-size:11px}.shield{font-size:24px;color:#00d9ff;margin-top:14px}.more-services{display:flex;align-items:center;justify-content:space-between;margin-top:30px;color:#fff5}.more-services>span{font-size:7px;letter-spacing:1px}.more-services p{font-size:10px}.more-services b{color:#00d9ff;margin:0 12px;font-weight:400}.methodology{background:#e5e5e5;color:#000;border-radius:64px 64px 0 0;padding:80px 64px;display:grid;grid-template-columns:1fr 1fr;gap:75px}.methodology .mono{color:#0006}.method-intro{font-size:13px;color:#0007;line-height:1.7;margin:23px 0 27px}.methodology ol{list-style:none;padding:0;margin:0}.methodology li{display:flex;gap:18px;align-items:start;border-top:1px solid #0002;padding:22px 0}.methodology li>span{width:32px;height:32px;display:grid;place-items:center;border:1px solid #0003;border-radius:50%;font-family:"JetBrains Mono",monospace;font-size:9px;flex-shrink:0}.methodology h3{font-size:16px;font-weight:500;margin:3px 0 7px;letter-spacing:-.5px}.methodology li p{font-size:11px;color:#0007;margin:0;line-height:1.6}.portrait-wrap{position:relative;align-self:center;min-width:0;height:470px}.portrait-circle{width:350px;height:350px;border-radius:50%;overflow:hidden;margin:auto;background:#ccc}.portrait-circle img{width:100%;height:100%;object-fit:cover;object-position:center 42%;filter:grayscale(1)}.portrait-note{position:absolute;top:15px;right:0;writing-mode:vertical-rl;font-size:7px}.testimonial{position:absolute;bottom:20px;left:0;width:100%;background:#fafafa80;border-color:#fff9;padding:25px;box-shadow:0 15px 40px #0001}.quote-mark{font-size:42px;line-height:.5;color:#0005}.testimonial>p{font-size:23px;letter-spacing:-.8px;line-height:1.2;margin:12px 0 20px}.testimonial>div{display:flex;align-items:center;gap:10px;font-size:10px}.testimonial-avatar{width:28px;height:28px;background:#000;color:#00d9ff;border-radius:50%;display:grid;place-items:center;font-size:8px}.testimonial small{display:block;font-size:7px;color:#0006;margin-top:4px}.testimonial a{margin-left:auto;font-size:20px}.testimonial .illustration-note{font-size:6px;margin-top:15px}.contact{position:relative;isolation:isolate;background:#000;padding:70px 64px 50px;overflow:hidden}.watermark{position:absolute;top:35px;right:25px;font-size:160px;font-weight:700;letter-spacing:-12px;color:#ffffff0d;z-index:-1}.contact-top{display:flex;justify-content:space-between;align-items:center}.contact h2{font-size:68px!important;letter-spacing:-4px;font-weight:400;line-height:1.05;margin:45px 0 35px}.contact h2 em{color:#00d9ff;font-weight:400}.mega-button{position:relative;overflow:hidden;display:flex;justify-content:space-between;align-items:center;background:#00d9ff;color:#000;border-radius:28px;font-size:25px;letter-spacing:-1px;padding:28px 32px;font-weight:500;isolation:isolate}.mega-button:before{content:"";position:absolute;inset:0;background:#fff;transform:translateY(100%);transition:transform .4s cubic-bezier(.4,0,.2,1);z-index:-1}.mega-button:hover:before{transform:translateY(0)}.mega-button>span:last-child{font-size:35px}.contact-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:25px;font-size:11px;color:#fff7}.contact-bottom>span{font-size:7px;letter-spacing:1px}footer{padding:35px 64px 20px;background:#000;border-top:1px solid #ffffff12}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:35px}.footer-grid .brand{font-size:20px}.footer-grid .brand>.logo-tile:first-child{width:30px;height:30px;font-size:20px;border-radius:10px}.footer-grid p{font-size:11px;color:#fff5;margin:15px 0 28px}.footer-grid .mono{font-size:6px;letter-spacing:1px}.footer-links,.footer-connect{display:flex;align-items:start;flex-direction:column;gap:12px;font-size:11px;color:#fff8}.footer-links .mono,.footer-connect .mono{margin-bottom:7px}.social-links{display:flex;gap:10px;margin:3px 0}.social-links a{display:grid;place-items:center;width:29px;height:29px;border:1px solid #ffffff30;border-radius:50%;font-size:13px}.policy-button{background:none;border:0;color:#fff5;padding:0;font-size:9px}.footer-line{display:flex;justify-content:space-between;margin-top:35px;padding-top:20px;border-top:1px solid #ffffff12;font-size:6px;color:#fff4;letter-spacing:1px}dialog{background:#151515;color:#ebebeb;border:1px solid #ffffff30;border-radius:32px;padding:35px;max-width:440px;font-family:"Space Grotesk",sans-serif}dialog::backdrop{background:#000a;backdrop-filter:blur(16px)}dialog h2{font-weight:500}dialog p{font-size:15px;line-height:1.7;color:#aaa}dialog a{font-size:13px;color:#00d9ff}.close-dialog{position:absolute;right:18px;top:14px;border:0;background:none;color:#aaa;font-size:22px}@media(min-width:1500px){.hero{min-height:720px;padding-top:100px}}@media(max-width:1150px){header{padding:25px 35px}.header-right .status{display:none}.hero{padding:55px 40px}.hero-actions{gap:16px}.hero h1{font-size:82px!important}.hero-copy>p{max-width:350px}.audience,.expertise,.methodology,.contact,footer{padding-left:40px;padding-right:40px}.audience>div{gap:20px;font-size:15px}.bento-card{padding:23px}.bento h3{font-size:26px}.methodology{gap:40px}.portrait-circle{width:300px;height:300px}.hero-actions .quiet-link{font-size:9px}.lime-button{padding:16px 19px;font-size:11px}.more-services{display:block}}@media(max-width:900px){nav{gap:17px;padding:13px 18px}.brand{font-size:18px}.white-button{font-size:10px}.hero{grid-template-columns:1fr;gap:40px}.hero h1{font-size:100px!important}.hero-copy>p{max-width:450px}.hero-copy{text-align:center}.eyebrow,.hero-actions,.hero-proof{justify-content:center}.hero-copy>p{margin-left:auto;margin-right:auto}.audience{display:block;text-align:center}.audience>div{justify-content:center;margin-top:18px}.section-heading h2,.methodology h2{font-size:39px!important}.bento{grid-template-columns:repeat(2,1fr);grid-template-rows:auto}.large{min-height:460px}.tall{grid-row:span 2;min-height:470px}.accent,.small{min-height:220px}.methodology{grid-template-columns:1fr;gap:30px}.portrait-wrap{width:450px;max-width:100%;margin:auto}.portrait-circle{width:350px;height:350px}.contact h2{font-size:58px!important}.header-right{gap:0}}@media(max-width:600px){body{padding:10px}.shell{border-radius:32px}header{padding:22px 20px}nav{display:none}.brand{font-size:17px}.brand>.logo-tile:first-child{width:31px;height:31px;font-size:21px}.white-button{padding:11px 14px}.hero{padding:40px 22px 45px;gap:30px;overflow:hidden}.hero h1{font-size:clamp(62px,15.3vw,90px)!important;margin:26px 0}.eyebrow{font-size:6px;letter-spacing:1px;gap:6px}.hero-copy>p{font-size:14px}.hero-actions{flex-direction:column;gap:19px}.lime-button{padding:16px 24px;font-size:12px}.hero-proof{margin-top:28px;font-size:9px}.hero-proof small{font-size:6px}.project-title{font-size:20px}.ai-cursor{right:-10px;bottom:10px}.orbit{width:350px;height:350px}.orbit-two{width:270px;height:270px}.audience{padding:25px 20px}.audience>div{gap:12px;flex-wrap:wrap;font-size:13px}.audience>div i{font-size:10px}.expertise{padding:55px 22px}.section-heading{display:block}.section-heading h2,.methodology h2{font-size:34px!important}.section-heading>p{font-size:12px;margin-top:22px}.bento{grid-template-columns:1fr;gap:13px}.bento-card{grid-column:auto;grid-row:auto;border-radius:32px;padding:25px}.large{min-height:425px}.tall{min-height:350px}.swatches{margin-top:25px}.design-sample{display:flex;align-items:center;gap:30px;margin-top:22px;padding-top:16px}.design-sample span{font-size:11px}.accent{min-height:230px}.small{min-height:230px}.bento h3{font-size:30px}.bento p{font-size:13px}.card-label{font-size:8px}.more-services p{font-size:11px;line-height:1.8}.more-services b{margin:0 5px}.methodology{border-radius:40px 40px 0 0;padding:55px 24px 40px}.methodology li p{font-size:12px}.method-intro{font-size:13px}.portrait-wrap{height:430px}.portrait-circle{width:280px;height:280px;max-width:100%}.testimonial{padding:23px;bottom:15px}.testimonial>p{font-size:22px}.portrait-note{right:-10px}.contact{padding:50px 24px 35px}.contact-top .status{display:none}.contact h2{font-size:46px!important;letter-spacing:-2.5px;margin:30px 0}.watermark{font-size:100px;right:10px;top:60px;letter-spacing:-7px}.mega-button{padding:22px;font-size:18px;border-radius:24px}.mega-button>span:last-child{font-size:26px}.contact-bottom{display:block;font-size:11px}.contact-bottom>span{display:block;margin-top:15px;font-size:6px}footer{padding:30px 24px 20px}.footer-grid{grid-template-columns:1fr 1fr;gap:28px}.footer-grid>div:first-child{grid-column:1/-1}.footer-grid p{margin-bottom:18px}.footer-grid .mono{font-size:7px}.footer-line{font-size:5px;letter-spacing:.5px}.footer-connect{font-size:10px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.status i{animation:none}*{transition:none!important}}


/* Brighter neon cyan with concentrated luminous edges. */
.brand>.logo-tile:first-child{box-shadow:0 0 12px #00d9ff65,0 0 30px #00d9ff35}
.lime-button{background:#00d9ff;box-shadow:0 0 12px #00d9ff80,0 0 38px #00d9ff55,inset 0 1px 0 #b7f7ff}
.lime-button:hover{box-shadow:0 0 18px #00d9ffb0,0 0 55px #00d9ff70}
.hero h1 em{background-image:linear-gradient(105deg,#00d9ff 10%,#67eeff 60%,#ebebeb);filter:drop-shadow(0 0 16px #00d9ff35)}
.glow-one{background:#00d9ff;opacity:.2}

.app-icon,.ai-cursor span{box-shadow:0 0 16px #00d9ff65}
.floating-icon,.spark,.check,.card-label>span{text-shadow:0 0 12px #00d9ff90}
.bar-chart div{opacity:.85;box-shadow:0 0 14px #00d9ff30}
.bar-chart div:last-child{box-shadow:0 0 22px #00d9ff65}
.accent{box-shadow:0 0 28px #00d9ff18}
.mega-button{box-shadow:0 0 35px #00d9ff25}
@keyframes pulse{50%{opacity:.65;box-shadow:0 0 8px #00d9ff,0 0 20px #00d9ff90}}
/* Neon accents across every section. */
.expertise{background:radial-gradient(ellipse at 100% 40%,#00d9ff0a,transparent 55%)}
.section-heading .mono,.methodology .mono,.contact-top>.mono,.footer-links>.mono,.footer-connect>.mono{color:#00d9ff;text-shadow:0 0 12px #00d9ff45}
.bento-card:not(.accent){border-color:#00d9ff28;box-shadow:inset 0 1px 0 #00d9ff0c,0 0 24px #00d9ff06}
.bento-card:hover{border-color:#00d9ff90;box-shadow:0 0 28px #00d9ff20}
.bento-card .card-label{color:#8beeff}.bento-card.accent .card-label{color:#0009}
.swatches span:first-child{box-shadow:0 0 20px #00d9ff70}.swatches span:nth-child(2){background:#009fff;box-shadow:0 0 14px #009fff40}
.shield{color:#00d9ff;text-shadow:0 0 18px #00d9ff90}
.chart-caption span:last-child,.more-services>span{color:#00d9ff;text-shadow:0 0 10px #00d9ff40}
.methodology{background:radial-gradient(ellipse at 95% 30%,#00d9ff15,transparent 55%),#e5e5e5}
.methodology .mono{color:#00758b;text-shadow:none}
.methodology li>span{background:#00d9ff;border-color:#00d9ff;color:#00151a;box-shadow:0 0 16px #00d9ff45}
.portrait-circle{border:2px solid #00d9ff;box-shadow:0 0 20px #00d9ff50,0 0 65px #00d9ff20}
.testimonial{border-color:#00d9ff75;box-shadow:0 15px 40px #0001,0 0 30px #00d9ff20}
.testimonial a{color:#006d82}.testimonial-avatar{box-shadow:0 0 12px #00d9ff60}
.contact{background:radial-gradient(ellipse at 100% 55%,#00d9ff0d,transparent 60%),#000}
.contact h2 em{color:#00d9ff;text-shadow:0 0 28px #00d9ff30}
.mega-button{box-shadow:0 0 18px #00d9ff50,0 0 55px #00d9ff25,inset 0 1px 0 #b7f7ff}
.contact-bottom>a:hover,.footer-links>a:hover,.footer-connect>a:hover,.footer-line>a:hover,.policy-button:hover{color:#00d9ff;text-shadow:0 0 12px #00d9ff60}
footer{border-top-color:#00d9ff30;background:radial-gradient(ellipse at 0 100%,#00d9ff09,transparent 65%),#000}
.social-links a{border-color:#00d9ff70;color:#00d9ff;box-shadow:0 0 12px #00d9ff12}
.social-links a:hover{background:#00d9ff;color:#000;box-shadow:0 0 20px #00d9ff60}
.footer-line{border-top-color:#00d9ff25}
dialog{border-color:#00d9ff70;box-shadow:0 0 40px #00d9ff20}

.brand>.logo-tile:first-child{background:#00d9ff0b;border:1px solid #00d9ff45;box-shadow:0 0 18px #00d9ff20}.logo-tile img{width:29px;height:29px;display:block}.app-icon{background:transparent}.app-icon img{width:22px;height:22px}.footer-grid .logo-tile img{width:25px;height:25px}@media(max-width:600px){.logo-tile img{width:25px;height:25px}}
/* Text-only DevMundus wordmark. */
.brand{gap:0;font-size:25px;font-weight:600;letter-spacing:-1.2px;line-height:1}
.brand>.wordmark-accent:first-child,.brand>.wordmark-accent{display:inline;width:auto;height:auto;background:none;border:0;border-radius:0;box-shadow:none;color:#00d9ff;font-size:inherit;font-weight:inherit;text-shadow:0 0 15px #00d9ff30}
.brand-period{margin-left:4px;margin-top:0;font-size:9px;color:#ffffff60}
.footer-grid .brand{font-size:25px}
@media(max-width:600px){.brand,.footer-grid .brand{font-size:22px}}

/* Keep the footer text wordmark free of legacy icon dimensions. */
.footer-grid .brand{display:inline-flex;align-items:baseline;gap:0;white-space:nowrap}
.footer-grid .brand>.wordmark-accent{display:inline;width:auto;height:auto;padding:0;margin:0;background:none;border:0;border-radius:0;box-shadow:none;font-size:inherit;font-weight:inherit;line-height:inherit;color:#00d9ff}
.brand>.wordmark-cursor{color:#00d9ff;font-size:inherit;font-weight:inherit;line-height:inherit;margin-left:2px;text-shadow:0 0 15px #00d9ff30}

/* Brighter floating hero panels against the existing dark canvas. */











.delivery-progress{margin:0 0 17px}.delivery-progress>div:first-child{display:flex;justify-content:space-between;font-size:8px;color:#c4d9e9}.delivery-progress strong{font-weight:500;color:#8af1ff}.progress-track{height:4px;background:#ffffff18;border-radius:4px;margin:8px 0}.progress-track>span{display:block;width:40%;height:100%;border-radius:4px;background:#00d9ff;box-shadow:0 0 10px #00d9ff55}.delivery-stages{display:flex;justify-content:space-between;font-size:6px;color:#92a7b8}.delivery-stages .complete{color:#d0edf5}.delivery-stages .current{color:#00d9ff}.floating-label{display:block;font-family:"JetBrains Mono",monospace;font-size:6px;letter-spacing:1px;color:#a8efff;margin-bottom:7px}.integration-state{display:block;font-size:7px;color:#d9edf7;margin-top:9px}.integration-state i{display:inline-block;width:4px;height:4px;border-radius:50%;background:#00d9ff;margin-right:4px}.assurance-label{display:flex!important;align-items:center;justify-content:space-between;font-size:7px!important;letter-spacing:1px;margin-right:0!important;margin-bottom:11px}.assurance-label small{font-size:5px;color:#9ab7ce;letter-spacing:.4px}.assurance-check{color:#00d9ff;margin-right:6px}.test-bar{display:inline-block;width:30px;height:3px;background:#00d9ff;margin-left:5px;box-shadow:0 0 7px #00d9ff55}.ai-cursor{right:-12px;bottom:54px}
@media(max-width:600px){.floating-icon{font-size:18px}.ai-cursor{right:-15px;bottom:67px}.ai-cursor span{font-size:7px}.project-title{font-size:19px}.delivery-stages{font-size:5px}}




/* Frosted-white floating dashboard cards. */



















/* Slightly lighter frost on the hero cards. */



/* Softer gray frost, less bright than the white panels. */




/* Distinct muted colors for each floating hero card. */













/* Blue, black, and white glass gradients for the floating cards. */















/* Floating cards match the site's obsidian and neon-cyan palette. */















/* Solid surfaces for the floating hero cards. */



/* Neutral charcoal cards with restrained cyan status accents. */











/* Lighten only the backdrop behind the floating cards. */


.hero .grid-backdrop{background-image:linear-gradient(#ffffff0b 1px,transparent 1px),linear-gradient(90deg,#ffffff0b 1px,transparent 1px)}

/* Seamless ambient light behind the cards, without a visible panel. */


/* Small white surfaces within the charcoal floating cards. */









/* White surfaces on all three floating cards. */


















/* Black text across the white floating cards. */


/* Readable assurance heading and example label. */





/* Larger text throughout the remaining floating cards. */




















/* Original panel dimensions with larger typography retained. */















.assurance-icon{width:20px;height:20px;flex-shrink:0;color:#007d99}
/* Test progress with a visible unfinished end. */

.test-bar>span{display:block;width:72.667%;height:100%;background:#00b8db;border-radius:4px}


.blocked-bug-icon{display:inline-block;width:16px;height:16px;vertical-align:middle;margin-left:4px;color:#007d99}





.ai-heading-icon{width:20px;height:20px;flex-shrink:0;color:#007d99}
/* Match typography between the AI and Security & QA cards. */



/* Neon wordmark glow echoes the primary call to action. */
header .brand>.wordmark-accent,.footer-grid .brand>.wordmark-accent,header .brand>.wordmark-cursor,.footer-grid .brand>.wordmark-cursor{color:#00d9ff;text-shadow:0 0 4px #00d9ffb0,0 0 12px #00d9ff85,0 0 28px #00d9ff55,0 0 45px #00d9ff25}
header .brand,.footer-grid .brand{color:#f5fdff;text-shadow:0 0 10px #00d9ff20}
/* Ensure the neon wordmark wins over earlier first-child styles. */
header .brand>.wordmark-accent:first-child,.footer-grid .brand>.wordmark-accent:first-child,header .brand>.wordmark-accent,.footer-grid .brand>.wordmark-accent,header .brand>.wordmark-cursor,.footer-grid .brand>.wordmark-cursor{color:#00e5ff!important;text-shadow:0 0 2px #b5faff,0 0 7px #00d9ff,0 0 18px #00d9ff,0 0 35px #00d9ffb0!important;filter:drop-shadow(0 0 8px #00d9ff65)}
header .brand>.wordmark-accent:first-child,.footer-grid .brand>.wordmark-accent:first-child,header .brand>.wordmark-accent,.footer-grid .brand>.wordmark-accent,header .brand>.wordmark-cursor,.footer-grid .brand>.wordmark-cursor{color:#00d9ff!important;text-shadow:0 0 6px #00d9ff55,0 0 14px #00d9ff30!important;filter:none}
/* Subtle white glow on the dev portion of both wordmarks. */
header .brand,.footer-grid .brand{color:#f5fdff;text-shadow:0 0 6px #ffffff55,0 0 14px #ffffff30}
/* Blinking terminal cursor on the text wordmark. */
.brand>.wordmark-cursor{animation:wordmark-blink 1.1s step-end infinite}
@keyframes wordmark-blink{0%,100%{opacity:1}50%{opacity:0}}
@media(prefers-reduced-motion:reduce){.brand>.wordmark-cursor{animation:none}}
/* Smooth fade for the wordmark cursor. */
.brand>.wordmark-cursor{animation:wordmark-cursor-fade 1.6s ease-in-out infinite}
@keyframes wordmark-cursor-fade{0%,15%,100%{opacity:1}50%,65%{opacity:.08}}
@media(prefers-reduced-motion:reduce){.brand>.wordmark-cursor{animation:none}}
/* Smooth appearance followed by an instant cursor disappearance. */
.brand>.wordmark-cursor{animation:wordmark-cursor-appear 1.6s linear infinite}
@keyframes wordmark-cursor-appear{0%{opacity:0;animation-timing-function:ease-out}45%{opacity:1;animation-timing-function:step-end}75%{opacity:0}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.brand>.wordmark-cursor{animation:none}}
/* Instant appearance followed by a smooth fade-out. */
.brand>.wordmark-cursor{animation:wordmark-cursor-disappear 1.6s linear infinite}
@keyframes wordmark-cursor-disappear{0%,25%{opacity:1}25%{animation-timing-function:ease-in-out}75%,100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.brand>.wordmark-cursor{animation:none}}
/* Quicker smooth cursor fade in both directions. */
.brand>.wordmark-cursor{animation:wordmark-cursor-fade 1.1s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.brand>.wordmark-cursor{animation:none}}
.brand>.wordmark-cursor{animation:wordmark-cursor-fade 1.6s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.brand>.wordmark-cursor{animation:none}}
/* Crisp on/off cursor blink without fading. */
.brand>.wordmark-cursor{animation:wordmark-blink 1.6s step-end infinite}
@media(prefers-reduced-motion:reduce){.brand>.wordmark-cursor{animation:none}}
.brand>.wordmark-cursor{animation:wordmark-blink 1.5s step-end infinite}
@media(prefers-reduced-motion:reduce){.brand>.wordmark-cursor{animation:none}}


/* Identical wordmark glow in header and footer. */
header .brand,.footer-grid .brand{color:#f5fdff;text-shadow:0 0 6px #ffffff55,0 0 14px #ffffff30}
header .brand>.wordmark-accent:first-child,.footer-grid .brand>.wordmark-accent:first-child,header .brand>.wordmark-accent,.footer-grid .brand>.wordmark-accent,header .brand>.wordmark-cursor,.footer-grid .brand>.wordmark-cursor{color:#00d9ff!important;text-shadow:0 0 6px #00d9ff55,0 0 14px #00d9ff30!important;filter:none;font-size:inherit;font-weight:inherit}
/* Reuse the footer wordmark's size in the header. */
header .brand,.footer-grid .brand{font-size:25px;line-height:1;font-weight:600;letter-spacing:-1.2px}
@media(max-width:600px){header .brand,.footer-grid .brand{font-size:22px}}
/* Shared layout and rendering for both text wordmarks. */
header .brand,.footer-grid .brand{display:inline-flex;align-items:baseline;gap:0;white-space:nowrap;font-family:"Space Grotesk",sans-serif;font-size:25px;font-weight:600;line-height:1;letter-spacing:-1.2px;font-synthesis:none;-webkit-font-smoothing:antialiased}
@media(max-width:600px){header .brand,.footer-grid .brand{font-size:22px}}
header .brand,.footer-grid .brand{display:flex;width:max-content}
/* Clean text wordmarks without glow. */
header .brand,.footer-grid .brand,header .brand>.wordmark-accent:first-child,.footer-grid .brand>.wordmark-accent:first-child,header .brand>.wordmark-accent,.footer-grid .brand>.wordmark-accent,header .brand>.wordmark-cursor,.footer-grid .brand>.wordmark-cursor{text-shadow:none!important;filter:none!important}
/* Subtle glow on the primary hero button. */
.lime-button{box-shadow:0 0 10px #00d9ff25,inset 0 1px 0 #b7f7ff}
.lime-button:hover{box-shadow:0 0 14px #00d9ff35,inset 0 1px 0 #b7f7ff}


.hero h1{font-size:clamp(62px,6.1vw,94px)!important}
@media(max-width:900px){.hero h1{font-size:clamp(62px,9vw,90px)!important}}
@media(max-width:600px){.hero h1{font-size:clamp(40px,10.2vw,60px)!important}}
/* Original hero headline typography with the new wording. */
.hero h1{font-size:clamp(76px,7.7vw,120px)!important;line-height:.9;letter-spacing:-.065em;font-weight:500}
.hero h1 em{font-weight:400}
@media(max-width:1150px){.hero h1{font-size:82px!important}}
@media(max-width:900px){.hero h1{font-size:100px!important}}
@media(max-width:600px){.hero h1{font-size:clamp(62px,15.3vw,90px)!important}}
/* Keep Innovation without together above the accent line. */
.hero h1{font-size:clamp(48px,4.5vw,70px)!important}
.headline-first-line{white-space:nowrap}
@media(max-width:1150px){.hero h1{font-size:clamp(42px,4.5vw,52px)!important}}
@media(max-width:900px){.hero h1{font-size:clamp(45px,7.5vw,68px)!important}}
@media(max-width:600px){.hero h1{font-size:clamp(28px,7.7vw,45px)!important}}
.hero h1{font-size:clamp(50px,4.8vw,75px)!important}
@media(max-width:1150px){.hero h1{font-size:clamp(44px,4.8vw,55px)!important}}
@media(max-width:900px){.hero h1{font-size:clamp(48px,8vw,72px)!important}}
@media(max-width:600px){.hero h1{font-size:clamp(30px,8vw,48px)!important}}
.hero h1{font-size:clamp(54px,5.2vw,82px)!important}
@media(max-width:1150px){.hero h1{font-size:clamp(46px,5.2vw,60px)!important}}
@media(max-width:900px){.hero h1{font-size:clamp(50px,8.6vw,78px)!important}}
@media(max-width:600px){.hero h1{font-size:clamp(31px,8.5vw,51px)!important}}
.hero h1{font-size:clamp(58px,5.6vw,88px)!important}
@media(max-width:1150px){.hero h1{font-size:clamp(48px,5.6vw,64px)!important}}
@media(max-width:900px){.hero h1{font-size:clamp(53px,9.2vw,83px)!important}}
@media(max-width:600px){.hero h1{font-size:clamp(32px,9vw,54px)!important}}
.hero h1{font-size:clamp(62px,6vw,94px)!important}
@media(max-width:1150px){.hero h1{font-size:clamp(50px,6vw,69px)!important}}
@media(max-width:900px){.hero h1{font-size:clamp(56px,9.8vw,88px)!important}}
@media(max-width:600px){.hero h1{font-size:clamp(33px,9.5vw,57px)!important}}
/* Fit the new two-line slogan within the hero column. */
.hero h1{font-size:clamp(46px,4.3vw,68px)!important}
@media(max-width:1150px){.hero h1{font-size:clamp(38px,4.3vw,49px)!important}}
@media(max-width:900px){.hero h1{font-size:clamp(45px,7.2vw,65px)!important}}
@media(max-width:600px){.hero h1{font-size:clamp(27px,7.4vw,44px)!important}}
/* Larger slogan with more separation between its lines. */
.hero h1{font-size:clamp(69px,6.45vw,102px)!important;line-height:1.15}
@media(max-width:1150px){.hero h1{font-size:clamp(57px,6.45vw,73.5px)!important}}
@media(max-width:900px){.hero h1{font-size:clamp(67.5px,10.8vw,97.5px)!important}}
@media(max-width:600px){.hero h1{font-size:clamp(40.5px,11.1vw,66px)!important}}
/* Restore the original hero headline. */
.hero h1{font-size:clamp(76px,7.7vw,120px)!important;line-height:.9;letter-spacing:-.065em;font-weight:500}
@media(max-width:1150px){.hero h1{font-size:82px!important}}
@media(max-width:900px){.hero h1{font-size:100px!important}}
@media(max-width:600px){.hero h1{font-size:clamp(62px,15.3vw,90px)!important}}
.ai-heading-symbol{display:inline-block;flex-shrink:0;width:20px;text-align:center;font-family:"Space Grotesk",sans-serif;font-size:23px;line-height:1;color:#007d99}
/* Smaller main dashboard; floating companion cards retain their sizes. */

/* Original width with a shorter dashboard content area. */



/* Main dashboard at 80% of its original width. */

/* Restore the dashboard width, retaining its shorter height. */

/* Slightly lighter background for the main hero. */
.hero{background:#14191f}
/* Restore the hero; brighten only the ambient backdrop behind the cards. */
.hero{background:transparent}


.audience>span{color:#ffffff99}
.hero-actions .quiet-link{font-size:14px}
.hero-actions .lime-button{font-size:14px}
.hero-proof{font-size:13px}
.hero-proof small{font-family:"Space Grotesk",sans-serif;font-size:12px;letter-spacing:0;color:#ffffff80;margin-top:8px}
/* Consistent text size throughout the audience row. */
.audience>span,.audience>div,.audience>div i{font-size:14px}
.audience>span{font-size:11.2px}
/* Allow room for the italic period inside the gradient text box. */
.hero h1 em{display:inline-block;padding-right:.16em;margin-right:-.16em}
/* Preserve italic descenders within the gradient text area. */
.hero h1 em{padding-bottom:.2em;margin-bottom:-.2em;vertical-align:baseline}
.hero-actions .quiet-link{color:#ffffffbf}
.hero-actions .lime-button{gap:12px}
.hero-actions .lime-button>span{font-size:21px;font-weight:700;line-height:1}
.specialty-row{display:flex;align-items:center;flex-wrap:wrap;gap:10px 15px}
.specialty{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.specialty svg{width:16px;height:16px;stroke:#00d9ff;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.specialty-spark{color:#00d9ff;font-size:19px;line-height:1}
@media(max-width:900px){.specialty-row{justify-content:center}}


/* Place the engineering-team cursor beside the dashboard tabs. */




/* A soft sparkle sweeps across the expertise link from left to right. */
.hero-actions .quiet-link{position:relative;display:inline-block;overflow:hidden;padding:4px 0}
.hero-actions .quiet-link::after{content:"";position:absolute;top:0;bottom:0;left:-45%;width:35%;pointer-events:none;background:linear-gradient(90deg,transparent,#00d9ff15 30%,#ffffffb3 50%,#00d9ff25 70%,transparent);transform:skewX(-18deg);mix-blend-mode:screen;filter:blur(1px);animation:expertise-sparkle 4s ease-in-out infinite}
@keyframes expertise-sparkle{0%,15%{left:-45%;opacity:0}22%{opacity:.75}52%{left:115%;opacity:.75}60%,100%{left:115%;opacity:0}}
@media(prefers-reduced-motion:reduce){.hero-actions .quiet-link::after{animation:none;display:none}}
/* Thinking-style shimmer contained within the link's lettering. */
.hero-actions .quiet-link::after{display:none}
.hero-actions .quiet-link{font-weight:700;background:linear-gradient(100deg,#657580 0%,#657580 38%,#fff 48%,#fff 52%,#657580 62%,#657580 100%);background-size:260% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;animation:expertise-text-shimmer 3.6s linear infinite}
@keyframes expertise-text-shimmer{0%{background-position:150% 0}100%{background-position:-150% 0}}
@media(prefers-reduced-motion:reduce){.hero-actions .quiet-link{animation:none;background:none;color:#a6b3bc}}
/* Dimensional UI diagrams for product security, QA, and AI. */
.visual-bento{grid-template-rows:270px 270px}.visual-bento .card-label{font-size:8px;letter-spacing:.7px}.visual-bento h3{font-size:30px}.visual-bento p{font-size:12px}.prodsec-card{position:relative;background:radial-gradient(ellipse at 50% 80%,#00d9ff12,transparent 65%),#101418!important}.security-visual{position:relative;height:255px;margin-top:12px;perspective:700px}.defense-plane{position:absolute;left:22%;width:58%;height:116px;transform:rotateX(58deg) rotateZ(-30deg);border-radius:16px;border:1px solid #ffffff35;background:#172a32;box-shadow:8px 12px 0 #071118,8px 13px 0 #00d9ff25,0 20px 35px #0006;overflow:hidden}.defense-plane>span{position:absolute;top:12px;left:15px;font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:2px;color:#a9d1dd;z-index:1}.plane-data{top:135px;background:#17232c}.plane-api{top:86px;background:#21353f}.plane-app{top:36px;background:#2d4650;border-color:#00d9ff80}.plane-grid{position:absolute;inset:0;background:linear-gradient(#00d9ff12 1px,transparent 1px),linear-gradient(90deg,#00d9ff12 1px,transparent 1px);background-size:25px 25px}.shield-core{position:absolute;left:49%;top:52px;width:59px;height:68px;border-radius:16px;display:grid;place-items:center;background:#0c191fe8;border:1px solid #00d9ff88;box-shadow:0 0 20px #00d9ff25;transform:translateX(-50%) rotate(-10deg);animation:defense-bob 6s ease-in-out infinite}.shield-core svg{width:42px;height:42px;color:#00d9ff}.security-orbit{position:absolute;width:210px;height:210px;border:1px dashed #00d9ff30;left:50%;top:10px;transform:translateX(-50%) rotateX(40deg);border-radius:50%}.security-callout{position:absolute;font-family:"JetBrains Mono",monospace;font-size:8px;letter-spacing:0;background:#192126;border:1px solid #ffffff20;padding:8px 10px;border-radius:8px;color:#c8dbe4}.callout-left{left:0;top:125px}.callout-right{right:0;top:70px}.security-callout i{display:inline-block;width:4px;height:4px;background:#00d9ff;border-radius:50%;margin-right:4px}.security-callout b{color:#00d9ff;margin-left:6px}.visual-footer{display:flex;align-items:center;gap:12px;font-family:"JetBrains Mono",monospace;font-size:8px;color:#a1b0ba;border-top:1px solid #ffffff12;padding-top:16px}.visual-footer i{width:3px;height:3px;background:#00d9ff;border-radius:50%}.visual-footer a{margin-left:auto;color:#00d9ff;font-size:18px}.test-visual{position:relative;height:228px;margin-top:28px;perspective:700px}.test-sheet{position:absolute;left:3%;width:94%;height:185px;border-radius:15px;border:1px solid #ffffff25;transform:rotateY(-14deg) rotateZ(-8deg);box-shadow:0 15px 30px #0005}.sheet-back{top:22px;left:13%;background:#1b343d;width:80%}.sheet-middle{top:12px;left:8%;width:85%;background:#354952}.sheet-front{top:0;background:#dbe8ed;color:#152e3c;padding:14px;overflow:hidden;animation:defense-bob 6s ease-in-out -2s infinite}.test-sheet-header{display:flex;justify-content:space-between;font-family:"JetBrains Mono",monospace;font-size:7px;letter-spacing:.4px}.test-sheet-header b{font-size:12px}.test-matrix{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:14px}.test-matrix span{display:grid;place-items:center;height:20px;background:#fff8;border:1px solid #163c5016;border-radius:5px;color:#087f99;font-size:11px}.test-matrix .test-running{background:#00d9ff35}.test-sheet-bottom{display:flex;justify-content:space-between;margin-top:12px;font-family:"JetBrains Mono",monospace;font-size:6px}.test-sheet-bottom i{width:30px;height:3px;background:#00a9cd;margin-top:3px}.test-scan{position:absolute;top:35px;bottom:23px;width:10px;left:-10px;background:#00d9ff25;filter:blur(5px);animation:test-sweep 5s linear infinite}.qa-types{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.qa-types span{font-family:"JetBrains Mono",monospace;font-size:6px;letter-spacing:.3px;border:1px solid #ffffff18;border-radius:5px;padding:5px;color:#aebcc5}.ai-visual-card{padding:22px!important}.ai-visual-card h3{font-size:25px;margin:9px 0 7px}.ai-visual-card p{color:#001c28aa;font-size:11px}.ai-visual-card .card-label span{color:#001b2880}.agent-visual{position:relative;height:92px;margin:6px -5px 0}.agent-lines{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:#00233465;stroke-width:1;stroke-dasharray:4 3}.agent-core{position:absolute;left:50%;top:26px;transform:translateX(-50%);width:42px;height:42px;background:#092732;color:#00d9ff;border-radius:14px;display:grid;place-items:center;font-size:28px;box-shadow:0 7px 0 #00617d50,0 11px 18px #003b4e35}.agent-node{position:absolute;width:33px;height:24px;background:#e8fbffb0;border:1px solid #00304630;border-radius:7px;display:grid;place-items:center;font-family:"JetBrains Mono",monospace;font-size:7px;box-shadow:0 4px 0 #00617d30}.node-a{left:0;top:8px}.node-b{right:0;top:8px}.node-c{left:0;bottom:7px}.node-d{right:0;bottom:7px}.agent-packet{position:absolute;width:4px;height:4px;border-radius:50%;background:#fff;top:25px;left:30px;animation:agent-flow 3s ease-in-out infinite}.integration-visual{display:flex;align-items:center;justify-content:center;height:90px;margin-top:6px;perspective:600px}.plug-block{width:51px;height:48px;display:grid;place-items:center;background:#263d48;border:1px solid #ffffff30;border-radius:13px;color:#d9e7ee;font-family:"JetBrains Mono",monospace;font-size:20px;box-shadow:0 6px 0 #0d1b23;transform:rotateY(-18deg) rotateZ(-7deg)}.ai-plug{color:#00d9ff;background:#12343f;transform:rotateY(18deg) rotateZ(7deg);font-size:29px}.connection-wire{height:2px;width:26px;background:#00d9ff60;position:relative}.connection-wire i{position:absolute;left:0;top:-2px;width:6px;height:6px;background:#00d9ff;border-radius:50%;animation:connection-flow 2s ease-in-out infinite}.integration-visual-card h3{font-size:25px;margin:8px 0 10px}.integration-visual-card p{font-size:11px}@keyframes defense-bob{50%{translate:0 -6px}}@keyframes test-sweep{to{left:110%}}@keyframes agent-flow{0%{left:14%;top:22px;opacity:0}20%{opacity:1}50%{left:50%;top:44px}80%{opacity:1}100%{left:84%;top:72px;opacity:0}}@keyframes connection-flow{50%{left:20px}}
@media(max-width:1150px){.visual-bento{grid-template-rows:280px 280px}.visual-bento h3{font-size:26px}.security-visual{height:262px}.security-callout{font-size:7px;padding:6px}.qa-types span{font-size:5px}.ai-visual-card h3{font-size:22px}.ai-visual-card .card-label{font-size:6px}.integration-visual-card h3{font-size:22px}}
@media(max-width:900px){.visual-bento{grid-template-rows:auto}.prodsec-card{min-height:535px}.qa-visual-card{min-height:520px}.ai-visual-card,.integration-visual-card{min-height:265px}.agent-visual{max-width:240px;margin:10px auto}.test-visual{height:250px}.test-sheet{height:200px}.test-matrix span{height:23px}}
@media(max-width:600px){.prodsec-card,.qa-visual-card{min-height:0}.visual-bento h3{font-size:31px}.visual-bento p{font-size:13px}.security-visual{height:260px}.defense-plane{width:62%;left:20%}.security-callout{font-size:8px}.qa-visual-card .test-visual{max-width:250px;margin:32px auto 0;height:240px}.qa-types{justify-content:center}.qa-types span{font-size:7px}.ai-visual-card{padding:25px!important}.ai-visual-card .card-label{font-size:8px}.ai-visual-card h3{font-size:30px}.ai-visual-card .agent-visual{height:110px;max-width:270px}.ai-visual-card p{font-size:13px}.integration-visual-card h3{font-size:29px}.integration-visual-card p{font-size:13px}}
@media(prefers-reduced-motion:reduce){.shield-core,.sheet-front,.test-scan,.agent-packet,.connection-wire i{animation:none}}
.visual-bento .qa-visual-card h3{font-size:26px;letter-spacing:-1.2px}
.visual-bento .integration-visual-card{padding-bottom:20px}
.visual-bento .integration-visual-card .integration-visual{height:76px}
@media(max-width:600px){.visual-bento .qa-visual-card h3{font-size:31px}}
/* Separate defense-in-depth layers and expose their labels. */
.prodsec-card .security-visual{height:280px;margin-top:8px}
.prodsec-card .plane-app{top:8px}
.prodsec-card .plane-api{top:96px}
.prodsec-card .plane-data{top:184px}
.prodsec-card .defense-plane{height:92px}
.prodsec-card .defense-plane>span{font-size:12px;font-weight:500;letter-spacing:1.5px;color:#ecfaff;top:14px;left:16px}
.prodsec-card .shield-core{top:19px}
.prodsec-card .callout-left{top:138px}
.prodsec-card .callout-right{top:55px}
.prodsec-card .security-orbit{height:255px;top:4px}
@media(max-width:600px){.prodsec-card .security-visual{height:285px}.prodsec-card .defense-plane>span{font-size:12px}}
/* Original vertical spacing with horizontally staggered security layers. */
.prodsec-card .security-visual{height:255px;margin-top:12px}
.prodsec-card .defense-plane{height:116px}
.prodsec-card .plane-app{top:36px;left:32%}
.prodsec-card .plane-api{top:86px;left:21%}
.prodsec-card .plane-data{top:135px;left:10%}
.prodsec-card .shield-core{top:52px;left:59%}
.prodsec-card .callout-left{top:125px}
.prodsec-card .callout-right{top:70px}
.prodsec-card .security-orbit{height:210px;top:10px}
@media(max-width:600px){.prodsec-card .security-visual{height:260px}.prodsec-card .defense-plane{width:58%}}
/* Position the shield as protection for the complete layer stack. */
.prodsec-card .shield-core{left:9%;top:40px;width:48px;height:56px;transform:translateX(-50%) rotate(-8deg)}
.prodsec-card .shield-core svg{width:34px;height:34px}
.prodsec-card .shield-core::after{content:"";position:absolute;left:100%;top:50%;width:32px;height:1px;background:#00d9ff70}
.prodsec-card .callout-left{left:0;top:215px}
/* A clearly defined trust perimeter enclosing the complete product stack. */
.prodsec-card .security-orbit.trust-boundary{width:96%;height:238px;left:50%;top:8px;transform:translateX(-50%);border:1.5px dashed #00d9ff80;border-radius:48%;background:#00d9ff04;box-shadow:0 0 18px #00d9ff08}
.prodsec-card .callout-left{left:5%;top:225px;color:#cdeaf2;border-color:#00d9ff65;background:#101c23}
.prodsec-card .shield-core{left:9%;top:38px}
@media(max-width:600px){.prodsec-card .security-orbit.trust-boundary{width:100%;height:242px}}
/* Trust changes are illustrated at the crossings between layers. */
.prodsec-card .plane-data{z-index:1}.prodsec-card .plane-api{z-index:3}.prodsec-card .plane-app{z-index:5}
.layer-trust-cut{position:absolute;width:62%;height:92px;transform:rotateX(58deg) rotateZ(-30deg);border:1.5px dashed #00d9ffb0;border-radius:16px;background:#00d9ff08;pointer-events:none;box-shadow:0 0 14px #00d9ff0b}
.trust-cut-request{top:59px;left:26%;z-index:4}.trust-cut-data{top:109px;left:15%;z-index:2}
.layer-trust-cut>span{position:absolute;left:-7px;top:50%;width:12px;height:12px;background:#00d9ff;border:2px solid #071b24;border-radius:3px;box-shadow:0 0 14px #00d9ff80}
.boundary-note{position:absolute;display:flex;align-items:center;gap:7px;z-index:8;background:#101b22ef;border:1px solid #00d9ff45;border-radius:8px;padding:7px 9px;box-shadow:0 5px 15px #0004}
.boundary-request{left:0;top:99px}.boundary-data{left:0;top:185px}
.boundary-note::after{content:"";position:absolute;left:100%;top:50%;width:28px;border-top:1px dashed #00d9ff85}
.boundary-gate{display:grid;place-items:center;width:20px;height:23px;border:1px solid #00d9ff70;border-radius:5px;font-family:"JetBrains Mono",monospace;font-size:8px;color:#00d9ff;flex-shrink:0}
.boundary-note strong{display:block;font-size:10px;font-weight:500;color:#e1f4fa}.boundary-note small{display:block;margin-top:3px;font-family:"JetBrains Mono",monospace;font-size:6px;color:#a1bbc8;letter-spacing:.1px}
.prodsec-card .shield-core{z-index:7;left:94%;top:18px;width:35px;height:40px}.prodsec-card .shield-core svg{width:26px;height:26px}.prodsec-card .shield-core::after{display:none}
@media(max-width:600px){.boundary-note strong{font-size:10px}.boundary-note small{font-size:6px}.boundary-request{top:105px}.boundary-data{top:190px}}
/* Visible gaps and dotted trust boundaries between the layers. */
.prodsec-card .security-visual{height:285px}
.prodsec-card .plane-app{top:20px}
.prodsec-card .plane-api{top:100px}
.prodsec-card .plane-data{top:180px}
.prodsec-card .layer-trust-cut{height:0;width:63%;border:0;border-top:3px dotted #00d9ff;border-radius:0;background:none;box-shadow:none;transform:rotate(-18deg);transform-origin:center}
.prodsec-card .trust-cut-request{top:101px;left:25%;z-index:4}
.prodsec-card .trust-cut-data{top:181px;left:14%;z-index:2}
.prodsec-card .layer-trust-cut>span{top:-7px}
.prodsec-card .boundary-request{top:94px}
.prodsec-card .boundary-data{top:174px}
@media(max-width:600px){.prodsec-card .security-visual{height:290px}}
/* Connected intelligence: streams converge through an AI agent. */
.intelligence-flow{position:relative;isolation:isolate;margin:30px 0 42px;height:360px;border:1px solid #ffffff13;border-radius:24px;overflow:hidden;background:#090e12}
.flow-caption{position:absolute;inset:24px 26px auto;display:flex;justify-content:space-between;gap:16px;font:9px "JetBrains Mono",monospace;letter-spacing:1.1px;color:#a6b3bf;z-index:2}
.flow-live{display:flex;align-items:center;gap:8px}.flow-live i{width:5px;height:5px;background:#00d9ff;border-radius:50%}
.flow-ribbons{position:absolute;left:0;top:44px;width:100%;height:280px;overflow:visible}.flow-band{stroke-width:38;opacity:.8}
/* Extra clearance for straight banners following the curved lanes. */
.flow-band:not(.center-overpass){stroke-width:39.9}.flow-output-band{opacity:.95}.flow-travel path{stroke:#ffffffd9;stroke-width:3;stroke-dasharray:20 12 4 24;animation:flow-stream 4s linear infinite}.flow-travel path:nth-child(2){animation-delay:-1.3s}.flow-travel path:nth-child(3){animation-delay:-2.6s}
@keyframes flow-stream{to{stroke-dashoffset:-120}}
.flow-tag{position:absolute;left:10%;display:flex;align-items:center;gap:8px;background:#101a23ef;color:#eaf8ff;border:1px solid #ffffff2b;padding:9px 12px;border-radius:99px;font-size:12px;box-shadow:0 6px 18px #0003;z-index:2}.flow-tag span{font-size:16px;color:#00d9ff}.flow-tag-security{top:100px;transform:rotate(12deg)}.flow-tag-quality{top:168px}.flow-tag-automation{top:235px;transform:rotate(-12deg)}
.flow-hub{position:absolute;top:119px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;z-index:3;white-space:nowrap}.flow-hub-ring{height:116px;width:116px;border-radius:50%;padding:5px;background:conic-gradient(from 45deg,#00d9ff,#dffaff,#0877d9,#00d9ff);box-shadow:0 0 0 9px #0a121b,0 12px 35px #0009}.flow-hub-ring>span{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;background:#f4f8fb;color:#09314b;font-size:65px;line-height:1}.flow-hub strong{margin-top:17px;font-size:19px;font-weight:500;color:#fff}.flow-hub small{margin-top:7px;font:8px "JetBrains Mono",monospace;letter-spacing:1px;color:#8eacbd}.flow-outcomes{position:absolute;left:68%;top:132px;display:flex;flex-direction:column;gap:12px;z-index:2}.flow-outcomes>span{width:max-content;border:1px solid #b8eaff42;border-radius:99px;padding:7px 12px;background:#0b2734;color:#e5faff;font-size:12px;box-shadow:0 4px 14px #0003}.flow-outcomes b{color:#00d9ff;margin-right:6px;font-weight:500}
@media(max-width:900px){.flow-caption{font-size:7px}.flow-live{display:none}.flow-tag{left:4%;font-size:10px;padding:7px 9px}.flow-outcomes{left:70%}.flow-outcomes>span{font-size:10px;padding:6px 8px}.flow-hub-ring{width:94px;height:94px}.flow-hub{top:130px}.flow-hub-ring>span{font-size:52px}}
@media(max-width:600px){.intelligence-flow{height:340px;margin:26px -10px 30px;border-radius:18px}.flow-caption{inset:20px 16px auto;font-size:7px;letter-spacing:.5px}.flow-ribbons{width:170%;max-width:none;left:-35%;top:50px;height:240px}.flow-tag{left:3%;font-size:8px;gap:4px}.flow-tag span{font-size:12px}.flow-tag-security{top:96px}.flow-tag-quality{top:163px}.flow-tag-automation{top:230px}.flow-hub{top:136px}.flow-hub-ring{width:72px;height:72px;box-shadow:0 0 0 6px #0a121b,0 8px 25px #0008}.flow-hub-ring>span{font-size:42px}.flow-hub strong{font-size:14px;margin-top:13px}.flow-hub small{font-size:6px;letter-spacing:.3px}.flow-outcomes{left:auto;right:3%;top:137px;gap:13px}.flow-outcomes>span{font-size:8px;padding:6px}.flow-outcomes b{margin-right:3px}}
@media(prefers-reduced-motion:reduce){.flow-travel path{animation:none}}
/* Labels travel with the streams; the agent cycles through its disciplines. */
.moving-flow-chip{opacity:0;pointer-events:none}.moving-flow-chip rect{fill:#18374bee;stroke:#c3edff55;stroke-width:1}.moving-flow-chip text{fill:#f1fbff;font:11px "JetBrains Mono",monospace;letter-spacing:.1px}.resolved-chip rect{fill:#075268;stroke:#a9efff66}.flow-ribbons{z-index:1}.flow-hub-ring{position:relative;background:#d9faff}.flow-hub-ring::before{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(#00d9ff,#eafaff,#157cff,#00d9ff);animation:hub-orbit 9s linear infinite;z-index:-1}.flow-hub-ring{background:none;isolation:isolate}.flow-hub-ring .hub-icon-stage{position:relative;overflow:hidden}.hub-cycle-icon{position:absolute;inset:25%;width:50%;height:50%;fill:none;stroke:#123448;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;opacity:0;animation:hub-icon-cycle 12s linear infinite}.hub-icon-security{animation-delay:-9s}.hub-icon-qa{animation-delay:-6s}.hub-icon-code{animation-delay:-3s}
@keyframes hub-orbit{to{transform:rotate(360deg)}}
@keyframes hub-icon-cycle{0%,2%{opacity:0;transform:translateY(5px) scale(.92)}5%,21%{opacity:1;transform:translateY(0) scale(1)}25%,100%{opacity:0;transform:translateY(-5px) scale(.96)}}
@media(prefers-reduced-motion:reduce){.flow-hub-ring::before,.hub-cycle-icon{animation:none}.hub-icon-ai{opacity:1}.moving-flow-chip{display:none}}
@keyframes hub-icon-cycle{0%,21%{opacity:1;transform:translateY(0) scale(1)}25%,96%{opacity:0;transform:translateY(-4px) scale(.96)}100%{opacity:1;transform:translateY(0) scale(1)}}
.flow-ribbons .center-overpass{opacity:1}
/* Keep the flow bands flat against the section background. */
.flow-section .flow-band{filter:none}
/* Visible processing ring, stable center, and matching wordmark. */
.flow-hub-ring::before{z-index:0;background:conic-gradient(from 0deg,#e9fcff 0deg,#00d9ff 65deg,#1171e8 145deg,#193147 205deg,#193147 280deg,#00d9ff 330deg,#e9fcff 360deg);animation:hub-orbit 3s linear infinite}
.flow-hub-ring .hub-icon-stage{z-index:1}
.flow-hub .flow-wordmark{margin-top:17px;font-size:19px;letter-spacing:-1px;gap:0;font-weight:600;line-height:1.2}
.flow-item-icon{fill:none;stroke:#d8f6ff;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:600px){.flow-hub .flow-wordmark{font-size:14px;margin-top:13px}}
@media(prefers-reduced-motion:reduce){.flow-hub-ring::before{animation:none}}
.moving-flow-chip .flow-bug-emoji{font-family:"Segoe UI Emoji","Apple Color Emoji",sans-serif;font-size:15px;letter-spacing:0}
/* Shared treatment for every incoming tool icon and pill. */
.incoming-chip > rect{fill:#18374b;stroke:#8cbed066;stroke-width:1}
.incoming-chip > text{fill:#f1fbff;font-weight:500}
.flow-item-icon{stroke:#8cecff;stroke-width:2;filter:none}
.moving-flow-chip .flow-item-icon rect{fill:none;stroke:inherit;stroke-width:inherit}
.resolved-chip rect{fill:#b7e86b;stroke:#d5f3a3}.resolved-chip text{fill:#203714;font-weight:500}
.resolved-chip rect{fill:#075268;stroke:#a9efff66}.resolved-chip text{fill:#f1fbff;font-weight:400}.flow-outcome-check{fill:none;stroke:#8cecff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
/* A stronger processing arc around the stable center icon. */
.flow-hub-ring{padding:8px;box-shadow:0 0 0 8px #0a121b,0 0 18px #00d9ff26,0 12px 35px #0009}
.flow-hub-ring::before{background:conic-gradient(from 0deg,#f3feff 0deg,#9cefff 25deg,#00d9ff 90deg,#147cff 150deg,#172b40 180deg,#172b40 310deg,#00d9ff 345deg,#f3feff 360deg);animation:hub-orbit 2s linear infinite}
@media(max-width:600px){.flow-hub-ring{padding:6px;box-shadow:0 0 0 6px #0a121b,0 0 14px #00d9ff26}}
@media(prefers-reduced-motion:reduce){.flow-hub-ring::before{animation:none}}
.flow-hub-ring::before{background:conic-gradient(from 0deg,#00d9ff 0deg,#00c8f0 40deg,#079bcf 80deg,#11669e 120deg,#184164 155deg,#172b40 190deg,#172b40 265deg,#184164 290deg,#11669e 315deg,#079bcf 335deg,#00c8f0 350deg,#00d9ff 360deg);animation:hub-orbit 1.5s linear infinite}
@media(prefers-reduced-motion:reduce){.flow-hub-ring::before{animation:none}}
.hub-icon-stage .hub-cycle-icon{stroke:#123448;stroke-width:1.8;animation:hub-work-cycle 9s linear infinite}
.hub-icon-stage .hub-work-qa{animation-delay:-6s}.hub-icon-stage .hub-work-security{animation-delay:-3s}
@keyframes hub-work-cycle{0%,29%{opacity:1;transform:translateY(0) scale(1)}33.333%,96%{opacity:0;transform:translateY(-4px) scale(.94)}100%{opacity:1;transform:translateY(0) scale(1)}}
@media(prefers-reduced-motion:reduce){.hub-icon-stage .hub-cycle-icon{animation:none;opacity:0}.hub-icon-stage .hub-work-development{opacity:1}}
/* Activity inside the processing hub. */
.work-code-line{stroke-dasharray:10;stroke-dashoffset:10;animation:work-type 1.8s ease-in-out infinite}.work-code-line.line-two{animation-delay:.2s}.work-code-line.line-three{animation-delay:.4s}.work-code-caret{animation:work-caret .65s step-end infinite;stroke:#079bcf}.work-code-brackets{animation:work-brackets 1.8s ease-in-out infinite;transform-origin:center}
@keyframes work-type{0%,12%{stroke-dashoffset:10}40%,80%{stroke-dashoffset:0}100%{stroke-dashoffset:10}}
@keyframes work-caret{50%{opacity:0}}
@keyframes work-brackets{50%{transform:scaleX(1.05);stroke:#079bcf}}
.work-qa-check{stroke:#078da2;stroke-dasharray:20;stroke-dashoffset:20;animation:work-check 2s ease-in-out infinite}.work-qa-check.check-two{animation-delay:.4s}.work-qa-progress{stroke:#078da2;stroke-dasharray:18;stroke-dashoffset:18;animation:work-type 2s ease-in-out infinite;animation-delay:.7s}
@keyframes work-check{0%,10%{stroke-dashoffset:20}40%,85%{stroke-dashoffset:0}100%{stroke-dashoffset:20}}
.work-security-scan{stroke:#00badc;stroke-width:3;opacity:.65;animation:work-scan 1.7s ease-in-out infinite}.work-security-lock{animation:work-lock 1.7s ease-in-out infinite;transform-origin:24px 27px}
@keyframes work-scan{0%{transform:translateY(-9px);opacity:0}20%{opacity:.8}80%{opacity:.8}100%{transform:translateY(32px);opacity:0}}
@keyframes work-lock{0%,100%{stroke:#123448;transform:scale(1)}50%{stroke:#078da2;transform:scale(1.06)}}
@media(prefers-reduced-motion:reduce){.hub-icon-stage svg *{animation:none!important;stroke-dashoffset:0}.work-security-scan{display:none}}
.hub-icon-stage .hub-work-security{animation-delay:-3s}
.cyber-code-stage{animation:cyber-code-phase 9s linear infinite;animation-delay:-3s}
.cyber-code-scan{stroke:#00badc;stroke-width:2.5;animation:cyber-scan-phase 9s linear infinite;animation-delay:-3s}
.cyber-protected-stage{opacity:0;transform-origin:24px 24px;animation:cyber-shield-phase 9s ease-out infinite;animation-delay:-3s}
.cyber-protected-check{stroke:#078da2;stroke-dasharray:24;stroke-dashoffset:24;animation:cyber-check-phase 9s ease-out infinite;animation-delay:-3s}
@keyframes cyber-code-phase{0%,15%{opacity:1}19%,100%{opacity:0}}
@keyframes cyber-scan-phase{0%{transform:translateY(0);opacity:0}2%{opacity:1}13%{transform:translateY(19px);opacity:1}16%,100%{transform:translateY(19px);opacity:0}}
@keyframes cyber-shield-phase{0%,15%{opacity:0;transform:scale(.8)}19%{opacity:1;transform:scale(1.08)}22%,30%{opacity:1;transform:scale(1)}33.333%,100%{opacity:0;transform:scale(1)}}
@keyframes cyber-check-phase{0%,19%{stroke-dashoffset:24}25%,100%{stroke-dashoffset:0}}
@media(prefers-reduced-motion:reduce){.cyber-code-stage,.cyber-code-scan{display:none}.cyber-protected-stage{opacity:1;transform:none}.cyber-protected-check{stroke-dashoffset:0}}
/* QA checks are drawn once during its turn, then stay complete. */
.hub-work-qa .work-qa-check.check-one{animation:qa-first-check 9s ease-out infinite;animation-delay:-6s}
.hub-work-qa .work-qa-check.check-two{animation:qa-second-check 9s ease-out infinite;animation-delay:-6s}
.hub-work-qa .work-qa-progress{animation:qa-complete-progress 9s ease-out infinite;animation-delay:-6s}
@keyframes qa-first-check{0%,4%{stroke-dashoffset:20}11%,100%{stroke-dashoffset:0}}
@keyframes qa-second-check{0%,12%{stroke-dashoffset:20}20%,100%{stroke-dashoffset:0}}
@keyframes qa-complete-progress{0%,21%{stroke-dashoffset:18}28%,100%{stroke-dashoffset:0}}
@media(prefers-reduced-motion:reduce){.hub-work-qa .work-qa-check,.hub-work-qa .work-qa-progress{animation:none;stroke-dashoffset:0}}
/* Keep the completed checklist hidden across the loop reset. */
.hub-icon-stage .hub-work-qa{animation-name:qa-icon-cycle}
@keyframes qa-icon-cycle{0%{opacity:0;transform:translateY(4px) scale(.94)}2%,29%{opacity:1;transform:translateY(0) scale(1)}33.333%,100%{opacity:0;transform:translateY(-4px) scale(.94)}}
@media(prefers-reduced-motion:reduce){.hub-icon-stage .hub-work-qa{animation:none}}
.flow-section{padding:0 64px 40px}.flow-section .intelligence-flow{margin:0}
@media(max-width:900px){.flow-section{padding:0 32px 32px}}
@media(max-width:600px){.flow-section{padding:0 12px 26px}.flow-section .intelligence-flow{margin:0}}
/* Give the outcomes section a clear opening after the hero. */
.flow-section{padding:72px 64px 64px;border-top:1px solid #ffffff14;border-bottom:1px solid #ffffff0d;background:#090c0f}
.flow-section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;margin-bottom:36px}.flow-section-heading .mono{color:#00d9ff;font-size:9px;letter-spacing:1.5px}.flow-section-heading h2{font-size:clamp(34px,3.6vw,52px)!important;font-weight:400;line-height:1.08;letter-spacing:-2px;margin:18px 0 0}.flow-section-heading>p{font-size:14px;line-height:1.7;color:#a6b3bf;margin:0 0 4px}
@media(max-width:900px){.flow-section{padding:56px 32px 48px}.flow-section-heading{align-items:flex-start;flex-direction:column;gap:20px}.flow-section-heading h2{letter-spacing:-1.5px}}
@media(max-width:600px){.flow-section{padding:44px 22px 36px}.flow-section-heading{margin-bottom:26px}.flow-section-heading h2{font-size:34px!important}.flow-section-heading>p{font-size:12px}.flow-section-heading .mono{font-size:8px}.flow-section .intelligence-flow{margin:0 -10px}}
/* Streams run edge to edge within the page shell. */
.flow-section .intelligence-flow{margin:0 -64px;border:0;border-radius:0;background:transparent}
.flow-section .flow-caption{left:64px;right:64px}
@media(max-width:900px){.flow-section .intelligence-flow{margin:0 -32px}.flow-section .flow-caption{left:32px;right:32px}}
@media(max-width:600px){.flow-section .intelligence-flow{margin:0 -22px}.flow-section .flow-caption{left:22px;right:22px}}
.flow-section .flow-caption{font-size:12px;letter-spacing:1.1px}
@media(max-width:900px){.flow-section .flow-caption{font-size:10px}.flow-section .flow-live{display:flex}}
@media(max-width:600px){.flow-section .flow-caption{font-size:8px;letter-spacing:.5px;flex-direction:column;gap:8px}}
.flow-hub small{font-size:11px;letter-spacing:1.2px}
@media(max-width:600px){.flow-hub small{font-size:8px;letter-spacing:.6px}}
.flow-hub-ring .hub-icon-stage{background:#090e12;display:flex;align-items:center;justify-content:center}
.flow-hub-ring .hub-wordmark{font-size:15px;letter-spacing:-.8px;gap:0;line-height:1;color:#fff;font-weight:600}
.flow-hub small{margin-top:18px}
@media(max-width:900px){.flow-hub-ring .hub-wordmark{font-size:12px}}
@media(max-width:600px){.flow-hub-ring .hub-wordmark{font-size:9px;letter-spacing:-.5px}.flow-hub small{margin-top:14px}}
.flow-hub{top:99px}.flow-hub-ring{width:156px;height:156px}.flow-hub-ring .hub-wordmark{font-size:21px;letter-spacing:-1px}
@media(max-width:900px){.flow-hub{top:112px}.flow-hub-ring{width:130px;height:130px}.flow-hub-ring .hub-wordmark{font-size:17px}}
@media(max-width:600px){.flow-hub{top:119px}.flow-hub-ring{width:106px;height:106px}.flow-hub-ring .hub-wordmark{font-size:14px;letter-spacing:-.7px}}
/* Four selectable processing treatments. */
.spinner-options{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:20px}.spinner-options button{border:1px solid #ffffff24;background:#ffffff05;color:#9facb8;border-radius:99px;font:12px "Space Grotesk",sans-serif;padding:9px 14px;transition:background .2s,color .2s}.spinner-options button[aria-pressed=true]{border-color:#00d9ff80;background:#00d9ff12;color:#dcfaff}.spinner-options button:hover{color:#fff}
.flow-hub-ring[data-spinner]{padding:5px;background:#133347;box-shadow:0 0 0 7px #0a121b,0 12px 35px #0009}
.flow-hub-ring[data-spinner=orbital]::before{background:repeating-conic-gradient(from 0deg,#143347 0deg,#143347 60deg,#146181 92deg,#00d9ff 118deg,#b4f5ff 120deg);animation:hub-orbit 3s linear infinite}
.flow-hub-ring[data-spinner=orbital]::after{content:"";position:absolute;inset:-3px;border-radius:50%;background:radial-gradient(circle at 50% 2%,#e5fbff 0 2px,#00d9ff 3px,transparent 6px),radial-gradient(circle at 92% 74%,#e5fbff 0 2px,#00d9ff 3px,transparent 6px),radial-gradient(circle at 8% 74%,#e5fbff 0 2px,#00d9ff 3px,transparent 6px);animation:hub-orbit 3s linear infinite;pointer-events:none;z-index:3}
.flow-hub-ring[data-spinner=segmented]::before{background:repeating-conic-gradient(#00d9ff 0deg,#00a2db 76deg,transparent 76deg,transparent 120deg);animation:segment-process 2.4s ease-in-out infinite}
@keyframes segment-process{0%,100%{transform:rotate(0deg);opacity:.55}50%{transform:rotate(120deg);opacity:1}}
.flow-hub-ring[data-spinner=radar]::before{background:conic-gradient(from 0deg,transparent 0deg,transparent 220deg,#00d9ff18 250deg,#00d9ff88 315deg,#9ef3ff 358deg,transparent 360deg);animation:hub-orbit 2.8s linear infinite}
.flow-hub-ring[data-spinner=radar] .hub-icon-stage::after{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(transparent 0deg,transparent 285deg,#00d9ff05 310deg,#00d9ff33 358deg,transparent 360deg);animation:hub-orbit 2.8s linear infinite;pointer-events:none}
.flow-hub-ring[data-spinner=progress]::before{background:conic-gradient(#90eeff 0deg,#00d9ff 210deg,#143347 210deg,#143347 360deg);mask:repeating-conic-gradient(#000 0deg,#000 12deg,transparent 12deg,transparent 20deg);animation:hub-orbit 3s steps(18) infinite}
@media(max-width:600px){.spinner-options{gap:6px;margin-top:8px}.spinner-options button{font-size:10px;padding:8px 11px}.flow-hub-ring[data-spinner]{padding:4px}}
@media(prefers-reduced-motion:reduce){.flow-hub-ring[data-spinner]::before,.flow-hub-ring[data-spinner]::after,.flow-hub-ring[data-spinner] .hub-icon-stage::after{animation:none}}
/* Place orbit heads on the track's exact radius, 120 degrees apart. */
.flow-hub-ring[data-spinner=orbital]::after{background:radial-gradient(circle at 50% 5.5px,#e5fbff 0 2px,#00d9ff 3px,transparent 6px),radial-gradient(circle at calc(93.30127% - 4.76314px) calc(75% - 2.75px),#e5fbff 0 2px,#00d9ff 3px,transparent 6px),radial-gradient(circle at calc(6.69873% + 4.76314px) calc(75% - 2.75px),#e5fbff 0 2px,#00d9ff 3px,transparent 6px)}
@media(max-width:600px){.flow-hub-ring[data-spinner=orbital]::after{background:radial-gradient(circle at 50% 5px,#e5fbff 0 2px,#00d9ff 3px,transparent 6px),radial-gradient(circle at calc(93.30127% - 4.33013px) calc(75% - 2.5px),#e5fbff 0 2px,#00d9ff 3px,transparent 6px),radial-gradient(circle at calc(6.69873% + 4.33013px) calc(75% - 2.5px),#e5fbff 0 2px,#00d9ff 3px,transparent 6px)}}
/* Aligned capability cards with one consistent illustration system. */
.capability-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.capability-card{min-width:0;display:flex;flex-direction:column;padding:28px 24px 22px;border:1px solid #38526377;border-radius:24px;background:#10171d;overflow:hidden}.cap-card-top{display:flex;justify-content:space-between;align-items:center;font:9px "JetBrains Mono",monospace;letter-spacing:1px;color:#8fb4c6}.cap-card-top a{color:#75ccdf;font:20px "Space Grotesk",sans-serif}.capability-card h3{font-size:28px;line-height:1.15;letter-spacing:-1px;font-weight:400;margin:24px 0 14px;min-height:65px;max-width:250px;color:#f4f8fb}.capability-card>p{font-size:13px;line-height:1.7;color:#9bacb8;margin:0;min-height:88px}.cap-illustration{width:100%;margin:12px auto 18px;aspect-ratio:360/280;display:grid;place-items:center}.cap-illustration svg{display:block;width:100%;height:auto;max-height:290px;overflow:visible}.cap-illustration text{font:9px "JetBrains Mono",monospace;letter-spacing:.7px}.cap-card-tags{display:flex;flex-wrap:wrap;gap:6px;border-top:1px solid #ffffff12;padding-top:18px;margin-top:auto}.cap-card-tags span{font:7px "JetBrains Mono",monospace;letter-spacing:.5px;color:#91afbf;padding:6px 7px;border-radius:5px;background:#ffffff05;border:1px solid #ffffff0c}.cap-ai-links{animation:cap-data 8s linear infinite}.cap-ai-orbit{transform-origin:180px 136px;animation:cap-orbit 12s linear infinite}.cap-qa-scan{animation:cap-scan 4s ease-in-out infinite}.cap-shield{animation:cap-shield-breathe 4s ease-in-out infinite}
@keyframes cap-data{to{stroke-dashoffset:-64}}@keyframes cap-orbit{to{transform:rotate(360deg)}}@keyframes cap-scan{0%,100%{transform:translateY(0);opacity:.1}50%{transform:translateY(103px);opacity:.5}}@keyframes cap-shield-breathe{50%{opacity:.6}}
@media(max-width:1100px){.capability-grid{gap:12px}.capability-card{padding:24px 18px 20px}.capability-card h3{font-size:25px}.capability-card>p{font-size:12px;min-height:103px}.cap-card-tags span{font-size:6px;padding:5px}}
@media(max-width:900px){.capability-grid{grid-template-columns:1fr}.capability-card{display:grid;grid-template-columns:1fr 1fr;column-gap:28px;padding:28px}.cap-card-top{grid-column:1}.capability-card h3{grid-column:1;min-height:0;margin:20px 0 14px;max-width:none}.capability-card>p{grid-column:1;min-height:0}.cap-illustration{grid-column:2;grid-row:1/5;margin:0;align-self:center}.cap-card-tags{grid-column:1;margin-top:20px}}
@media(max-width:600px){.capability-card{display:flex;padding:25px 22px;border-radius:22px}.capability-card h3{font-size:29px;max-width:260px}.capability-card>p{font-size:13px}.cap-illustration{max-width:340px;margin:16px auto 12px}.cap-card-tags{margin-top:0}.cap-card-tags span{font-size:7px;padding:6px}.cap-card-top{font-size:9px}}
@media(prefers-reduced-motion:reduce){.cap-illustration *{animation:none!important}}
.ai-core-lights{animation:ai-core-pulse 2.4s ease-in-out infinite}.ai-depth-visual .ai-depth-core{filter:drop-shadow(0 9px 7px #0005)}
@keyframes ai-core-pulse{50%{opacity:.3}}
@media(prefers-reduced-motion:reduce){.ai-depth-packets{display:none}.ai-core-lights{animation:none}}

/* AI capability: layered agent interface. */
.cap-illustration .ai-agent-interface text{font-family:"Space Grotesk",sans-serif;letter-spacing:.25px;font-size:7px}.cap-illustration .ai-agent-interface .agent-ui-title{font-size:10px;font-weight:500}.cap-illustration .ai-agent-interface .agent-ui-copy{font-size:8px;letter-spacing:0}.cap-illustration .ai-agent-interface .agent-ui-micro{font-size:6px;letter-spacing:.6px}.agent-status,.agent-thinking{animation:agent-activity 2.6s ease-in-out infinite}.agent-execution-progress{stroke-dasharray:46;animation:agent-execute 5s ease-in-out infinite}.agent-tool-running{transform-box:fill-box;transform-origin:center;animation:agent-tool-turn 5s linear infinite}@keyframes agent-activity{50%{opacity:.35}}@keyframes agent-execute{0%,10%{stroke-dashoffset:38}70%,100%{stroke-dashoffset:0}}@keyframes agent-tool-turn{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.ai-agent-interface *{animation:none!important}}

/* Activity displays on the isometric agent tiles. */
.ai-prompt-type,.ai-tool-execution,.ai-result-line{stroke-dasharray:1;stroke-dashoffset:0;animation:ai-surface-write 6s ease-in-out infinite}.ai-tool-execution{animation-delay:1s}.ai-result-one{animation-delay:2s}.ai-result-two{animation-delay:2.4s}.ai-result-three{animation-delay:2.8s}.ai-prompt-caret{animation:ai-surface-caret 1.2s step-end infinite}.ai-feedback-trace,.ai-feedback-point{animation:ai-surface-signal 3s ease-in-out infinite}.ai-feedback-point{animation-delay:.5s}@keyframes ai-surface-write{0%,8%{stroke-dashoffset:1}42%,90%{stroke-dashoffset:0}100%{stroke-dashoffset:1}}@keyframes ai-surface-caret{50%{opacity:0}}@keyframes ai-surface-signal{50%{opacity:.45}}@media(prefers-reduced-motion:reduce){.ai-live-surfaces *,.ai-agent-star{animation:none!important;stroke-dashoffset:0}}

/* QA suite activity, staggered without an initial completed flash. */
.cap-illustration .qa-suite-label{font-size:7px;letter-spacing:.45px}.cap-illustration .qa-run-title{font-size:9px;letter-spacing:.7px}.cap-illustration .qa-run-footer{font-size:6px;letter-spacing:.5px}.qa-suite-check,.qa-suite-bar{stroke-dasharray:1;stroke-dashoffset:1;animation-duration:8s;animation-iteration-count:infinite;animation-fill-mode:both}.qa-suite-check{animation-name:qa-suite-check-draw}.qa-suite-bar{animation-name:qa-suite-progress}.qa-suite-1{animation-delay:.8s}.qa-suite-2{animation-delay:1.6s}.qa-run-dot{animation:qa-run-active 2s ease-in-out infinite}@keyframes qa-suite-check-draw{0%,23%{stroke-dashoffset:1;opacity:1}32%,82%{stroke-dashoffset:0;opacity:1}92%,100%{stroke-dashoffset:0;opacity:0}}@keyframes qa-suite-progress{0%,5%{stroke-dashoffset:1;opacity:1}26%,82%{stroke-dashoffset:0;opacity:1}92%,100%{stroke-dashoffset:0;opacity:0}}@keyframes qa-run-active{50%{opacity:.35}}@media(prefers-reduced-motion:reduce){.qa-suite-visual *{animation:none!important;stroke-dashoffset:0;opacity:1}}

/* Product security: aligned layers and anchored protection. */
.sec-plane-scan{animation:sec-layer-sweep 6s ease-in-out infinite}.sec-anchored-shield{animation:sec-shield-confirm 6s ease-in-out infinite}@keyframes sec-layer-sweep{0%,10%{transform:translateY(-50px);opacity:0}20%{opacity:.2}65%{transform:translateY(95px);opacity:.2}75%,100%{transform:translateY(95px);opacity:0}}@keyframes sec-shield-confirm{0%,65%,100%{opacity:.8}75%,85%{opacity:1}}@media(prefers-reduced-motion:reduce){.security-layer-visual *{animation:none!important}.sec-plane-scan{display:none}}

/* Inspect, find, resolve, then confirm protection. One shared 10s cycle. */
.sec-inspector{animation:sec-inspect-route 10s ease-in-out infinite;opacity:0}.sec-found-bug{animation:sec-bug-resolve 10s ease-in-out infinite;transform-origin:0 0;opacity:0}.sec-fix-pulse{animation:sec-fix-ring 10s ease-out infinite;transform-origin:0 0;opacity:0}.sec-success-shield{animation:sec-protection-result 10s ease-in-out infinite;opacity:0}
@keyframes sec-inspect-route{0%{transform:translate(194px,64px);opacity:0}5%,12%{transform:translate(194px,64px);opacity:1}24%{transform:translate(269px,122px);opacity:1}36%{transform:translate(112px,195px);opacity:1}48%,57%{transform:translate(145px,151px);opacity:1}61%{transform:translate(145px,154px) scale(.94);opacity:1}66%{transform:translate(145px,146px);opacity:0}100%{transform:translate(145px,146px);opacity:0}}
@keyframes sec-bug-resolve{0%,39%{opacity:0;transform:scale(1)}45%,57%{opacity:1;transform:scale(1)}61%{opacity:1;transform:scale(1.3,.18)}65%,100%{opacity:0;transform:scale(.4,.1)}}
@keyframes sec-fix-ring{0%,59%{opacity:0;transform:scale(.5)}61%{opacity:.8;transform:scale(.6)}69%,100%{opacity:0;transform:scale(2.4)}}
@keyframes sec-protection-result{0%,66%{opacity:0}73%,92%{opacity:1}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.security-layer-visual .sec-inspector,.security-layer-visual .sec-found-bug,.security-layer-visual .sec-fix-pulse{display:none}.security-layer-visual .sec-success-shield{animation:none!important;opacity:1}}

/* Connected security layers and restrained hover feedback. */
.security-layer-visual{transition:transform .35s ease,filter .35s ease;transform-origin:center}.sec-layer-connections,.sec-side-badge{transition:filter .35s ease}.capability-card:has(.security-layer-visual):hover .security-layer-visual{transform:translateY(-3px);filter:drop-shadow(0 7px 9px #0003)}.capability-card:has(.security-layer-visual):hover .sec-layer-connections,.capability-card:has(.security-layer-visual):hover .sec-side-badge{filter:drop-shadow(0 0 3px #49c9e033)}@media(prefers-reduced-motion:reduce){.security-layer-visual{transition:none}.capability-card:has(.security-layer-visual):hover .security-layer-visual{transform:none}}

/* Continuous, quiet float; no scanning sweep. */
.security-layer-visual{animation:security-stack-float 5s ease-in-out infinite;transition:none;filter:drop-shadow(0 5px 8px #0002)}.capability-card:has(.security-layer-visual):hover .security-layer-visual{filter:drop-shadow(0 5px 8px #0002)}.capability-card:has(.security-layer-visual):hover .sec-layer-connections,.capability-card:has(.security-layer-visual):hover .sec-side-badge{filter:none}@keyframes security-stack-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}@media(prefers-reduced-motion:reduce){.security-layer-visual{animation:none;transform:none}}

/* Capability palette: black, blue, cyan and white shared with the hero and flow. */
/* Stealth finish shared by all service cards: soft gloss, quiet edges, and depth. */
.expertise .capability-card{position:relative;background:radial-gradient(ellipse at 15% 0%,#ffffff14 0%,#ffffff06 32%,transparent 62%),linear-gradient(155deg,#18222b 0%,#10171d 48%,#0a1117 100%);border:0;box-shadow:0 18px 34px #0006,0 4px 9px #0004;transition:transform .22s ease,box-shadow .22s ease}
/* A fading reflection strengthens the gloss only while a card is hovered. */
.expertise .capability-card::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(ellipse at 25% 18%,#ffffff16 0%,#ffffff08 25%,transparent 65%);mask-image:radial-gradient(ellipse at center,#000 35%,transparent 72%);opacity:0;transition:opacity .25s ease}
@media(hover:hover){.expertise .capability-card:hover::before{opacity:1}}
@media(prefers-reduced-motion:reduce){.expertise .capability-card::before{transition:none}}
@media(hover:hover){.expertise .capability-card:hover{transform:translateY(-4px);box-shadow:0 24px 42px #0008,0 7px 14px #0005}}
@media(prefers-reduced-motion:reduce){.expertise .capability-card{transition:none}.expertise .capability-card:hover{transform:none}}
.expertise .cap-card-top{color:#43c9ec}
.expertise .cap-card-top a{color:#00d9ff}
.expertise .capability-card h3{color:#ffffff}
.expertise .capability-card>p{color:#bacbd8}
.expertise .cap-card-tags{border-top-color:#17415b}
.expertise .cap-card-tags span{background:#061b2a;border-color:#144362;color:#bceaff}


/* Match capability illustration labels to the security tile labels. */
.cap-illustration .qa-suite-visual text,.cap-illustration .ai-depth-visual text{font-size:10.5px!important;font-weight:400}

/* AI status: illuminate in sequence, then reset together. */
.ai-status-light{opacity:1;visibility:hidden;transition:none!important;animation:ai-status-one 3s steps(1,end) infinite}.ai-status-two{animation-name:ai-status-two}.ai-status-three{animation-name:ai-status-three}
@keyframes ai-status-one{0%,90%,100%{visibility:hidden}15%{visibility:visible}}
@keyframes ai-status-two{0%,90%,100%{visibility:hidden}35%{visibility:visible}}
@keyframes ai-status-three{0%,90%,100%{visibility:hidden}55%{visibility:visible}}
@media(prefers-reduced-motion:reduce){.ai-status-light{animation:none;opacity:1;visibility:visible}}

/* Keep security layers stationary and align the AI illustration visually. */
.capability-card .security-layer-visual,.capability-card:has(.security-layer-visual):hover .security-layer-visual{animation:none;transform:none;transition:none}
.capability-card:has(.security-layer-visual):hover .sec-layer-connections,.capability-card:has(.security-layer-visual):hover .sec-side-badge{filter:none}
.cap-illustration .ai-depth-visual{transform:translateY(-10px)}







/* A broad pulse follows the sleeve surface with aligned cross-sections. */
.security-sleeve-pulse-cell{opacity:0;animation:security-sleeve-surface-pulse 4.56s linear infinite}
@keyframes security-sleeve-surface-pulse{0%,22%,100%{opacity:0}4%{opacity:.3}8%{opacity:.7}11%{opacity:.85}14%{opacity:.7}18%{opacity:.3}}
@media(prefers-reduced-motion:reduce){.security-sleeve-moving-pulse{display:none}.security-sleeve-pulse-cell{animation:none}}

/* Match the outcomes section to the page-four background. */
.flow-section{background:radial-gradient(ellipse at 95% 30%,#00d9ff15,transparent 55%),#e5e5e5;border-top-color:#00000012;border-bottom-color:#00000012;color:#10171d}
.flow-section-heading h2{color:#10171d}
.flow-section-heading>p{color:#465c69}
.flow-section .flow-hub small{color:#24536a;position:relative;top:18px;font-size:13px}
@media(max-width:600px){.flow-section .flow-hub small{font-size:10px}}

/* Light hub treatment for the light outcomes section. */
.flow-section .flow-hub-ring[data-spinner=orbital]{background:transparent;box-shadow:none;filter:none}
/* Preserve the original hub color. */
.flow-section .flow-hub-ring .hub-icon-stage{background:#203b52}
.flow-section .flow-hub-ring .hub-wordmark{color:#f5fdff}
.flow-section .hub-wordmark .wordmark-accent{color:#00d9ff;text-shadow:none}

/* Orbit lights fade into the light section instead of a dark ring. */
.flow-section .flow-hub-ring[data-spinner=orbital]{background:transparent;box-shadow:none;filter:none}
.flow-section .flow-hub-ring[data-spinner=orbital]::before{background:repeating-conic-gradient(from 0deg,transparent 0deg 48deg,#009dc708 65deg,#00a9d333 85deg,#00afd899 108deg,#00b8db 118deg,#c8f8ff 120deg);-webkit-mask:none;mask:none}

/* Reference-inspired checkmark wordmark; outlined SVG needs no font download. */
header .brand,.footer-grid .brand{align-items:center}
.brand .brand-wordmark{display:block;width:154px;height:auto;max-width:100%;flex-shrink:0}
.flow-hub-ring .hub-wordmark{width:85%;display:flex;align-items:center;justify-content:center}
.flow-hub-ring .hub-wordmark .brand-wordmark{width:100%;height:auto}
@media(max-width:600px){header .brand .brand-wordmark,.footer-grid .brand .brand-wordmark{width:132px}}



/* Header logo: 25% smaller than the previous desktop/mobile sizes. */
header .brand .brand-wordmark{width:115.5px}
@media(max-width:600px){header .brand .brand-wordmark{width:99px}}

/* Premium button redesign — navbar + hero. */
.white-button{
  display:inline-flex;align-items:center;gap:12px;
  background:#ffffff0d;backdrop-filter:blur(16px);
  color:#f5fdff;
  padding:12px 20px;border-radius:99px;
  font-size:12px;font-weight:600;letter-spacing:.3px;
  border:1px solid #00d9ff40;
  transition:background .25s,color .25s,border-color .25s,box-shadow .25s,transform .25s;
}
.white-button span{
  display:inline-grid;place-items:center;line-height:1;
  width:18px;height:18px;
  color:#00d9ff;
  transition:transform .25s,color .25s;
}
.white-button span svg,.hero-actions .lime-button>span svg{display:block;width:100%;height:100%}
.white-button:hover{
  background:#00d9ff;border-color:#00d9ff;color:#000;
  box-shadow:0 0 24px #00d9ff55;
  transform:translateY(-1px);
}
.white-button:hover span{color:#000}

.hero-actions .lime-button{
  background:linear-gradient(135deg,#8cecff 0%,#00d9ff 50%,#00b8db 100%);
  color:#000;font-weight:700;gap:14px;
  padding:12px 20px;
  box-shadow:0 10px 30px #00d9ff2a;
  transition:transform .25s cubic-bezier(.4,0,.2,1),box-shadow .25s;
}
.hero-actions .lime-button>span{
  display:inline-grid;place-items:center;line-height:1;
  width:20px;height:20px;
  transition:transform .25s;
}
.hero-actions .lime-button:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 40px #00d9ff50;
}
.hero-actions .lime-button:focus:not(:focus-visible){outline:none}

/* Arrow micro-animation: the tip travels up the diagonal, then the dots appear. */
.white-button span svg circle,.hero-actions .lime-button>span svg circle{opacity:1;transform-box:fill-box;transform-origin:center}
.white-button:hover span svg circle,.hero-actions .lime-button:hover>span svg circle{animation:dot-appear .13s ease both}
.white-button:hover span svg circle:nth-of-type(1),.hero-actions .lime-button:hover>span svg circle:nth-of-type(1){animation-delay:.18s}
.white-button:hover span svg circle:nth-of-type(2),.hero-actions .lime-button:hover>span svg circle:nth-of-type(2){animation-delay:.23s}
.white-button:hover span svg circle:nth-of-type(3),.hero-actions .lime-button:hover>span svg circle:nth-of-type(3){animation-delay:.28s}
.white-button:hover span svg path,.hero-actions .lime-button:hover>span svg path{animation:tip-move .26s cubic-bezier(.4,0,.2,1) both}
@keyframes dot-appear{from{opacity:0;transform:scale(.3)}to{opacity:1;transform:scale(1)}}
@keyframes tip-move{from{transform:translate(-5px,5px);opacity:0}to{transform:translate(0,0);opacity:1}}

@media(prefers-reduced-motion:reduce){
  .white-button,.white-button span,.hero-actions .lime-button,.hero-actions .lime-button>span{transition:none}
  .white-button span svg circle,.hero-actions .lime-button>span svg circle{opacity:1;animation:none;transform:none}
  .white-button:hover span svg path,.hero-actions .lime-button:hover>span svg path{animation:none;transform:none}
}


/* Center the services headline across all three cards. */
.expertise>.section-heading{justify-content:center;text-align:center}
.expertise>.section-heading>div{width:100%;min-width:0}
.expertise>.section-heading h2{max-width:none;white-space:nowrap;font-size:clamp(14px,3.8vw,52px)!important;letter-spacing:-.045em}

/* Quiet network globe, cropped into the upper-right corner of page two. */
.flow-section{position:relative;isolation:isolate;overflow:hidden}
.flow-corner-globe{position:absolute;top:-116px;right:-106px;width:clamp(300px,30.6vw,422px);height:auto;max-width:none;opacity:.82;pointer-events:none;user-select:none;z-index:-1;mask-image:linear-gradient(115deg,transparent 8%,#000 48%)}
@media(max-width:760px){.flow-corner-globe{width:332px;top:-123px;right:-179px;opacity:.6}}

/* Keep section artwork contained. */
.expertise,#approach{position:relative;isolation:isolate;overflow:hidden}




/* Service links share the hero button's diagonal tip and trailing-dot animation. */
.expertise .cap-card-top a{display:inline-grid;place-items:center;width:24px;height:24px;flex:none}
.expertise .cap-card-top a svg{display:block;width:24px;height:24px;overflow:visible}
.expertise .cap-card-top a svg circle{opacity:1;transform-box:fill-box;transform-origin:center}
@media(hover:hover){
 .expertise .capability-card:hover .cap-card-top svg circle{animation:dot-appear .13s ease both}
 .expertise .capability-card:hover .cap-card-top svg circle:nth-of-type(1){animation-delay:.18s}
 .expertise .capability-card:hover .cap-card-top svg circle:nth-of-type(2){animation-delay:.23s}
 .expertise .capability-card:hover .cap-card-top svg circle:nth-of-type(3){animation-delay:.28s}
 .expertise .capability-card:hover .cap-card-top svg path{animation:tip-move .26s cubic-bezier(.4,0,.2,1) both}
}
.expertise .cap-card-top a:focus-visible svg circle{animation:dot-appear .13s ease both}
.expertise .cap-card-top a:focus-visible svg circle:nth-of-type(1){animation-delay:.18s}
.expertise .cap-card-top a:focus-visible svg circle:nth-of-type(2){animation-delay:.23s}
.expertise .cap-card-top a:focus-visible svg circle:nth-of-type(3){animation-delay:.28s}
.expertise .cap-card-top a:focus-visible svg path{animation:tip-move .26s cubic-bezier(.4,0,.2,1) both}
@media(prefers-reduced-motion:reduce){
 .expertise .capability-card .cap-card-top a svg circle,
 .expertise .capability-card .cap-card-top a svg path{animation:none!important;opacity:1;transform:none}
}

/* Larger, easier-to-read service card titles. */
.expertise .capability-card h3{font-size:36px;line-height:1.15;max-width:none;min-height:83px}
@media(min-width:901px) and (max-width:1100px){.expertise .capability-card h3{font-size:32px;min-height:74px}}
@media(max-width:900px){.expertise .capability-card h3{min-height:0}}


/* Increase the service category labels, independently of the main headlines. */
.expertise .cap-card-top{font-size:18px;line-height:1.35;letter-spacing:1px;gap:12px}


/* Compact service cards after removing the capability tags. */
.expertise .capability-card{padding-bottom:16px}
.expertise .cap-illustration{margin-bottom:0}

/* Match the hero CTA arrow on the expertise link. */
.hero-actions .quiet-link .btn-arrow{display:inline-block;width:20px;height:20px;margin-left:10px;vertical-align:middle;color:#a6b3bc}
.hero-actions .quiet-link .btn-arrow svg{display:block;width:100%;height:100%}
.hero-actions .quiet-link .btn-arrow circle{transform-box:fill-box;transform-origin:center}
.hero-actions .quiet-link:hover .btn-arrow circle{animation:dot-appear .13s ease both}
.hero-actions .quiet-link:hover .btn-arrow circle:nth-of-type(1){animation-delay:.18s}
.hero-actions .quiet-link:hover .btn-arrow circle:nth-of-type(2){animation-delay:.23s}
.hero-actions .quiet-link:hover .btn-arrow circle:nth-of-type(3){animation-delay:.28s}
.hero-actions .quiet-link:hover .btn-arrow path{animation:expertise-arrow-down .26s cubic-bezier(.4,0,.2,1) both}
@media(prefers-reduced-motion:reduce){.hero-actions .quiet-link:hover .btn-arrow circle,.hero-actions .quiet-link:hover .btn-arrow path{animation:none}}

@keyframes expertise-arrow-down{0%{transform:translateY(-4px);opacity:0}100%{transform:translateY(0);opacity:1}}

/* Expertise hover: a gentle lift and clean white reveal. */
.hero-actions .quiet-link{transition:transform .22s ease,color .22s ease}
.hero-actions .quiet-link:hover,.hero-actions .quiet-link:focus-visible{transform:translateY(-2px);color:#fff;animation-play-state:paused}
.hero-actions .quiet-link:hover .btn-arrow,.hero-actions .quiet-link:focus-visible .btn-arrow{color:#fff}
.hero-actions .quiet-link:hover .btn-arrow circle,.hero-actions .quiet-link:hover .btn-arrow path{animation:none;transform:none;opacity:1}
@media(prefers-reduced-motion:reduce){.hero-actions .quiet-link:hover,.hero-actions .quiet-link:focus-visible{transform:none}}

/* Alternating section themes: light services, dark outcomes. */
.expertise{background:radial-gradient(ellipse at 100% 40%,#00b9df0d,transparent 55%),#e5e5e5;color:#10171d}
.expertise>.section-heading h2{color:#10171d}

.flow-section{background:radial-gradient(ellipse at 95% 30%,#00d9ff12,transparent 55%),#090e12;color:#ebf3f8;border-top-color:#ffffff14;border-bottom-color:#ffffff0d}
.flow-section-heading h2{color:#ebf3f8}
.flow-section-heading>p{color:#a6b3bf}
.flow-section .flow-hub small{color:#9cc7da}
.flow-section .flow-corner-globe{filter:brightness(1.8)}
.flow-section .flow-band{filter:none}



/* Match the service cards to the DM logo tile's navy palette. */
.expertise .capability-card{background:radial-gradient(ellipse at 15% 0%,#ffffff14 0%,#ffffff06 32%,transparent 62%),linear-gradient(145deg,#174a85 0%,#10376a 48%,#08234b 100%)}

/* Match the outcomes hub to the navy service cards. */
.flow-section .flow-hub-ring .hub-icon-stage{background:radial-gradient(ellipse at 15% 0%,#ffffff14 0%,#ffffff06 32%,transparent 62%),linear-gradient(145deg,#174a85 0%,#10376a 48%,#08234b 100%)}


/* Draw the circuit brain once on entry, preserving its completed state. */
.brain-awaiting .brain-circuit-line,.brain-awaiting .brain-circuit-terminal{stroke-dasharray:1;stroke-dashoffset:1;opacity:0}
.brain-drawing .brain-circuit-line{animation:brain-circuit-draw calc(var(--trace-duration) / 5.0625) linear calc(var(--trace-delay) / 5.0625) both}
.brain-drawing .brain-circuit-terminal{animation:brain-circuit-draw .088889s linear .493827s both}
@keyframes brain-circuit-draw{0%{stroke-dashoffset:1;opacity:0}1%{opacity:1}100%{stroke-dashoffset:0;opacity:1}}
@media(prefers-reduced-motion:reduce){.ai-circuit-brain .brain-circuit-line,.ai-circuit-brain .brain-circuit-terminal{animation:none;stroke-dashoffset:0;opacity:1}}

/* Shield and lock complete once when the security illustration enters view. */
.cap-illustration .security-shield-visual{transform:translateY(-10px)}
.security-awaiting .security-draw{stroke-dasharray:1;stroke-dashoffset:1;opacity:0}
.security-awaiting .security-shackle{transform:translateY(-12px)}
.security-playing .security-draw{animation:brain-circuit-draw calc(var(--draw-duration) / 1.6875) linear calc(var(--draw-delay) / 1.6875) both}
.security-playing .security-shackle{animation:security-lock-close  .237038s cubic-bezier(.22,.7,.3,1) 1.007408s both}
@keyframes security-lock-close{from{transform:translateY(-12px)}to{transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.security-shield-visual .security-draw{animation:none;stroke-dashoffset:0;opacity:1}.security-shield-visual .security-shackle{animation:none;transform:none}}

/* The clipboard stays fixed; only checklist contents animate, once. */
.cap-illustration .qa-clipboard-visual{transform:translateY(-10px)}
.qa-clipboard-awaiting .qa-check-item{opacity:0}
.qa-clipboard-awaiting .qa-clipboard-draw{stroke-dasharray:1;stroke-dashoffset:1;opacity:0}
.qa-clipboard-playing .qa-check-item{animation:qa-check-appear .126984s ease-out calc(var(--item-delay) / 2.3625) both}
.qa-clipboard-playing .qa-clipboard-draw{animation:brain-circuit-draw calc(var(--qa-duration) / 2.3625) linear calc(var(--qa-delay) / 2.3625) both}
@keyframes qa-check-appear{from{opacity:0;transform:scale(.75)}to{opacity:1;transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.qa-clipboard-visual .qa-check-item{animation:none;opacity:1;transform:none}.qa-clipboard-visual .qa-clipboard-draw{animation:none;stroke-dashoffset:0;opacity:1}}

/* Light contact finale continues the alternating section palette. */
#contact{background:#e7ecef;color:#153247;border-radius:44px 44px 0 0;padding-top:72px}
#contact .watermark{display:none}
#contact .contact-top>.mono{color:#526f80;text-shadow:none}
#contact .status{color:#526f80}
#contact .status i{background:#087e9e;animation:none}
#contact h2{color:#153247}
#contact h2 em{color:#087e9e;text-shadow:none}
#contact .mega-button{background:#12345b;color:#f4f9fc;border-radius:22px;box-shadow:0 12px 28px #142c441c,inset 0 1px 0 #ffffff18;transition:box-shadow .25s}
#contact .mega-button:before{background:#1c4972}
#contact .mega-button:hover{box-shadow:0 14px 30px #142c4426}
#contact .mega-button>span:last-child{color:#79d9ec}
#contact .mega-button:focus-visible,#contact .contact-bottom>a:focus-visible{outline:2px solid #087e9e;outline-offset:5px}
#contact .contact-bottom{color:#526b7b;padding-top:8px}
#contact .contact-bottom>a:hover{color:#087e9e;text-shadow:none}
@media(max-width:700px){#contact{border-radius:28px 28px 0 0;padding-top:48px}#contact .mega-button{border-radius:18px}}

/* Contact finale shares the service cards' navy surface and diagram palette. */
#contact .contact-layout{display:grid;grid-template-columns:.92fr 1.08fr;gap:56px;margin-top:48px;align-items:center}
#contact .contact-intro h2{font-size:clamp(36px,4.2vw,56px)!important;letter-spacing:-2.6px;line-height:1.1;margin:0 0 24px}
#contact .contact-intro>p{max-width:350px;font-size:16px;line-height:1.7;color:#526b7b;margin:0 0 40px}
#contact .contact-email{display:inline-flex;align-items:center;gap:12px;font-size:15px;color:#153247;overflow-wrap:anywhere}
#contact .contact-email span{color:#087e9e;font-size:22px}
#contact .contact-location{font:9px "JetBrains Mono",monospace;letter-spacing:1px;color:#526b7b;margin-top:22px;line-height:1.8}
#contact .contact-form{position:relative;isolation:isolate;margin:0;min-width:0;padding:34px;border-radius:24px;overflow:hidden;background:radial-gradient(ellipse at 15% 0%,#ffffff14 0%,#ffffff06 32%,transparent 62%),linear-gradient(145deg,#174a85 0%,#10376a 48%,#08234b 100%);box-shadow:0 18px 34px #0003,0 4px 9px #0002}
#contact .contact-form::before{content:"";position:absolute;z-index:-1;pointer-events:none;right:-14px;top:-15px;width:190px;height:170px;background-image:radial-gradient(circle,#8addec 1px,transparent 1.2px);background-size:8px 8px;opacity:.12;clip-path:polygon(28% 2%,69% 9%,97% 0,100% 71%,78% 87%,51% 73%,29% 97%,9% 65%,19% 45%,0 20%)}
#contact .form-eyebrow{margin:0 0 28px;font:10px "JetBrains Mono",monospace;letter-spacing:1.7px;color:#8edceb}
#contact .contact-fields{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:22px}
#contact .contact-field{display:flex;flex-direction:column;gap:9px;margin-bottom:22px;min-width:0}
#contact .contact-fields .contact-field{margin-bottom:0}
#contact .contact-field label{font-size:13px;font-weight:400;color:#e4f0fa}
#contact .field-optional{font-size:11px;color:#acc8de}
#contact input,#contact select,#contact textarea{box-sizing:border-box;width:100%;min-width:0;border:1px solid #91b5d45c;border-radius:8px;background:#103362;color:#f2f8fc;font:400 14px "Space Grotesk",sans-serif;padding:14px;outline:none;transition:border-color .2s,background .2s}
#contact input,#contact select{min-height:49px;color-scheme:dark}
#contact select option{background:#103362;color:#f2f8fc}
#contact textarea{resize:vertical;min-height:125px;line-height:1.6}
#contact input::placeholder,#contact textarea::placeholder{color:#a8c3d9;opacity:1}
#contact input:hover,#contact select:hover,#contact textarea:hover{border-color:#9ec9e48c}
#contact input:focus,#contact select:focus,#contact textarea:focus{border-color:#7bd9ed;background:#153d6f;box-shadow:none;outline:1px solid #7bd9ed;outline-offset:1px}
#contact .contact-submit{display:flex;align-items:center;justify-content:space-between;width:100%;border:0;border-radius:10px;padding:17px 20px;background:#8ed9e9;color:#10304c;font:500 16px "Space Grotesk",sans-serif;cursor:pointer;box-shadow:none;transition:background .2s}
#contact .contact-submit>span:last-child{font-size:24px;line-height:1;color:#10304c;transition:transform .2s}
#contact .contact-submit:hover{background:#b0e8f2}
#contact .contact-submit:hover>span:last-child{transform:translate(2px,-2px)}
#contact .contact-submit:focus-visible{outline:2px solid #e1f8ff;outline-offset:4px}
#contact .contact-email:focus-visible{outline:2px solid #087e9e;outline-offset:4px}
#contact .contact-form-note{font-size:11px;line-height:1.6;color:#acc8de;margin:14px 0 0}
#contact .contact-form noscript{color:#e4f0fa;font-size:12px}
@media(max-width:1000px){#contact .contact-layout{gap:32px;grid-template-columns:.85fr 1.15fr}#contact .contact-form{padding:28px}#contact .contact-fields{grid-template-columns:1fr;gap:18px}#contact .contact-email{font-size:13px}}
@media(max-width:700px){#contact .contact-layout{grid-template-columns:1fr;gap:34px;margin-top:32px}#contact .contact-intro h2{font-size:40px!important;letter-spacing:-2px}#contact .contact-intro>p{margin-bottom:22px}#contact .contact-form{padding:26px 22px;border-radius:22px}#contact .contact-fields{grid-template-columns:1fr}#contact input,#contact select,#contact textarea{font-size:16px}}
@media(prefers-reduced-motion:reduce){#contact .contact-submit>span:last-child{transition:none;transform:none}}

/* Keep the dark ecosystem-to-contact transition straight. */
#contact{border-radius:0;padding-top:116px}
#contact::before{content:"";position:absolute;top:0;left:0;right:0;height:44px;background:#090e12;border-radius:0;pointer-events:none}
@media(max-width:700px){#contact{border-radius:0;padding-top:76px}#contact::before{height:28px;border-radius:0}}

/* Keep the curved transition free of a straight divider at its corners. */
.flow-section{border-bottom:0}

/* Four service cards retain the shared navy finish and illustration scale. */
@media(min-width:901px){
 .expertise .capability-grid-four{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
 .capability-grid-four .capability-card{display:grid;grid-template-columns:1.15fr .85fr;column-gap:12px;padding:28px 24px}
 .capability-grid-four .cap-card-top{grid-column:1/-1}
 .expertise .capability-grid-four h3{grid-column:1;font-size:32px;min-height:0;margin:24px 0 14px}
 .capability-grid-four .capability-card>p{grid-column:1;min-height:0;font-size:13px}
 .expertise .capability-grid-four .cap-illustration{grid-column:2;grid-row:2/4;align-self:center;margin:12px 0 0}
}
.cap-illustration .hiring-visual{transform:translateY(-10px)}
.cap-illustration .hiring-dialogue text{font:500 23px "Space Grotesk",sans-serif;letter-spacing:0;fill:#eef5f8}
.hiring-handshake{transform-origin:180px 174px}
.hiring-dialogue{transform-origin:180px 88px}
.hiring-awaiting .hiring-dialogue{opacity:0}
.hiring-playing .hiring-grip{animation:hiring-grip-dip 1.8s ease-in-out both}
.hiring-playing .hiring-sleeve-left{animation:hiring-left-bend 1.8s ease-in-out both}
.hiring-playing .hiring-cuff-left{animation:hiring-left-cuff-bend 1.8s ease-in-out both}
.hiring-playing .hiring-sleeve-right{animation:hiring-right-bend 1.8s ease-in-out both}
.hiring-playing .hiring-cuff-right{animation:hiring-right-cuff-bend 1.8s ease-in-out both}
.hiring-playing .hiring-dialogue{animation:hiring-dialogue-in .35s cubic-bezier(.2,.8,.2,1) 1.15s both}
@keyframes hiring-grip-dip{0%,12%,52%,100%{transform:translateY(0)}32%{transform:translateY(20px)}75%{transform:translateY(12px)}}
@keyframes hiring-left-bend{
 0%,12%,52%,100%{d:path("M57 125L108 125L115 137L97 172L57 172Z")}
 32%{d:path("M57 125L108 145L115 157L97 192L57 172Z")}
 75%{d:path("M57 125L108 137L115 149L97 184L57 172Z")}
}
@keyframes hiring-left-cuff-bend{
 0%,12%,52%,100%{d:path("M98 129L105 139L88 174")}
 32%{d:path("M98 149L105 159L88 194")}
 75%{d:path("M98 141L105 151L88 186")}
}
@keyframes hiring-right-bend{
 0%,12%,52%,100%{d:path("M259 130L300 125L300 172L269 174Z")}
 32%{d:path("M259 150L300 125L300 172L269 194Z")}
 75%{d:path("M259 142L300 125L300 172L269 186Z")}
}
@keyframes hiring-right-cuff-bend{
 0%,12%,52%,100%{d:path("M270 133L279 175")}
 32%{d:path("M270 153L279 195")}
 75%{d:path("M270 145L279 187")}
}
@keyframes hiring-dialogue-in{from{opacity:0;transform:translateY(7px) scale(.85)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(prefers-reduced-motion:reduce){.hiring-visual .hiring-handshake,.hiring-visual .hiring-handshake *,.hiring-visual .hiring-dialogue{animation:none!important;transform:none;opacity:1}}

/* Keep the enquiry content above its decorative background. */
#contact{position:relative;isolation:isolate;overflow:hidden}
#contact .contact-top,#contact .contact-layout{position:relative;z-index:1}
.shell>footer{border-top:0}

/* Contact submission states preserve the existing navy form treatment. */
#contact .contact-honeypot{display:none}
#contact .contact-submit:disabled{cursor:wait;opacity:.75}
#contact .contact-submit:disabled>span:last-child{transform:none}
#contact .contact-form-note[data-state="success"]{color:#b5ebdc}
#contact .contact-form-note[data-state="error"]{color:#ffd5c9}

/* Turnstile stays within the existing navy enquiry card. */
#contact .contact-verification{margin:0 0 20px;min-width:0}
#contact #contact-turnstile{min-height:65px;max-width:100%}
#contact #contact-verification-status{margin:8px 0 0;color:#acc8de;font-size:11px;line-height:1.5}





/* Keep the service selector full-width beneath company and optional phone. */
#contact .contact-fields .contact-field-wide{grid-column:1 / -1}

/* Legible, compact footer and persistent navigation back to the header. */
.shell>footer{padding:36px 4.8% 44px}
footer .footer-grid{grid-template-columns:minmax(0,1.4fr) minmax(0,.8fr) minmax(0,1fr);gap:40px;align-items:start}
footer .footer-links,footer .footer-connect{font-size:14px;line-height:1.6;gap:10px;color:#bfcedb}
footer .footer-grid .mono{font-size:11px;line-height:1.5;letter-spacing:1.2px;color:#8cecff;text-shadow:none;margin-bottom:6px}
footer .footer-grid .footer-copyright{font:400 11px/1.6 "Space Grotesk",sans-serif;color:#8fa5b9;margin:18px 0 0;letter-spacing:.3px}
footer .footer-linkedin{display:inline-flex;align-items:center;gap:9px}
footer .footer-linkedin svg{width:18px;height:18px;flex:none;color:#8cecff}
footer .footer-links>a:hover,footer .footer-connect>a:hover{color:#8cecff;text-shadow:none}
.floating-back-top{position:fixed;z-index:50;right:22px;bottom:22px;display:grid;place-items:center;width:44px;height:44px;border:1px solid #8cecff66;border-radius:50%;background:#103047;color:#b5efff;box-shadow:0 4px 14px #0004;transition:background .2s,transform .2s}
.floating-back-top svg{width:21px;height:21px}
.floating-back-top:hover{background:#174268;transform:translateY(-2px)}
@media(max-width:700px){footer .footer-grid{grid-template-columns:1fr 1fr;gap:28px 20px}footer .footer-brand{grid-column:1/-1}footer .footer-connect a{overflow-wrap:anywhere}.floating-back-top{right:14px;bottom:14px}.shell>footer{padding:30px 24px 64px}}
@media(max-width:400px){footer .footer-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.floating-back-top{transition:none}}

/* Hide the return control throughout the header and first page. */
.floating-back-top{opacity:0;visibility:hidden;pointer-events:none}
.floating-back-top.is-visible{opacity:1;visibility:visible;pointer-events:auto}