:root{--navy:#101825;--orange:#FF8A00;--red:#E31B2E;--off:#F7F9FC;--white:#fff;--ink:#151B24;--muted:#667180;--line:#DEE3E8;--shadow:0 20px 60px rgba(16,24,37,.08)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#fff;color:var(--ink);font-family:"DM Sans",Arial,sans-serif}.site{overflow:hidden;position:relative;isolation:isolate}.site:before{content:"";position:fixed;inset:0;z-index:-2;background-image:url("/assets/proctel-img-01.webp");background-position:center center;background-size:cover;background-repeat:no-repeat;pointer-events:none}.site:after{content:"";position:fixed;inset:0;z-index:-1;background:rgba(255,255,255,.24);pointer-events:none}a{text-decoration:none;color:inherit}button{font:inherit}
.nav{opacity:1;visibility:visible;pointer-events:auto;height:82px;position:fixed;z-index:100;left:0;right:0;top:0;padding:0 clamp(24px,6vw,92px);display:flex;align-items:center;justify-content:space-between;background:transparent;backdrop-filter:none;border-bottom:1px solid transparent;transition:background .35s ease,box-shadow .35s ease,height .35s ease,border-color .35s ease}.nav.nav-visible{opacity:1;visibility:visible;pointer-events:auto}.nav.scrolled{height:68px;background:rgba(255,255,255,.95);backdrop-filter:blur(14px);border-bottom:1px solid rgba(222,227,232,.5);box-shadow:0 10px 30px rgba(16,24,37,.07)}
.brand{display:block;width:190px;flex:0 0 auto}.brand img{display:block;width:100%;height:auto;max-height:64px;object-fit:contain;object-position:left center}.navlinks{display:flex;align-items:center;gap:30px;font-size:13px;font-weight:600;color:#303844}.navlinks a{position:relative}.navlinks a:not(.navcta):after{content:"";position:absolute;left:0;right:100%;bottom:-8px;height:2px;background:var(--orange);transition:.35s}.navlinks a:hover:after,.navlinks a.active:after{right:0}.navlinks a:hover,.navlinks a.active{color:var(--navy)}.navcta{padding:12px 18px;border:1px solid var(--navy);background:var(--navy);color:#fff;transition:.3s}.navcta:hover{background:var(--orange);border-color:var(--orange);transform:translateY(-2px)}.menu{display:none;background:none;border:0;color:var(--navy);font-size:26px}
.hero{height:clamp(700px,88vh,820px);min-height:700px;padding-top:0;position:relative;display:flex;align-items:center;justify-content:center;background:transparent;overflow:hidden}.heroGrid{display:none}.hero3d{position:absolute;inset:0;z-index:1}.heroCopy{position:relative;z-index:3;text-align:center;width:min(920px,90vw);margin-top:15px;pointer-events:none}.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:11px;font-weight:800;letter-spacing:.19em;color:#626C78}.eyebrow b{display:inline-block;width:34px;height:2px;background:linear-gradient(90deg,var(--orange),var(--red))}.hero h1{font-family:Manrope,sans-serif;font-size:clamp(52px,7.2vw,104px);line-height:.98;letter-spacing:-.065em;margin:24px auto 18px;font-weight:800;text-wrap:balance}.hero h1 .accent{background:linear-gradient(100deg,var(--orange),var(--red));-webkit-background-clip:text;background-clip:text;color:transparent}.hero p{font-size:18px;line-height:1.65;color:#586371;max-width:700px;margin:0 auto}.actions{display:flex;justify-content:center;gap:12px;margin-top:28px;pointer-events:auto}.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 20px;font-size:13px;font-weight:700;border-radius:2px;transition:.35s;position:relative;overflow:hidden}.btn:after{content:"";position:absolute;inset:0;transform:translateX(-120%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.32),transparent);transition:.7s}.btn:hover:after{transform:translateX(120%)}.primary{background:var(--orange);color:#fff}.primary:hover{transform:translateY(-3px);background:var(--red)}.outline{border:1px solid #9AA3AE;background:rgba(255,255,255,.88);color:var(--navy)}.outline:hover{border-color:var(--orange);color:var(--orange);transform:translateY(-3px)}.heroScroll{position:absolute;z-index:4;bottom:26px;left:6vw;color:#7B8591;font-size:9px;letter-spacing:.17em}.heroScroll:after{content:"";display:inline-block;width:45px;height:1px;background:#AAB1B9;margin-left:13px;vertical-align:middle}.heroBadge{position:absolute;z-index:3;right:6vw;bottom:28px;display:flex;align-items:center;gap:9px;font-size:10px;letter-spacing:.12em;color:#737D89}.heroBadge i{width:8px;height:8px;border-radius:50%;background:var(--orange);box-shadow:0 0 0 7px rgba(255,138,0,.08);animation:ping 2.2s ease-in-out infinite}
@keyframes ping{0%,100%{box-shadow:0 0 0 5px rgba(255,138,0,.08)}50%{box-shadow:0 0 0 10px rgba(255,138,0,.02)}}
section:not(.hero){position:relative;isolation:isolate;background:rgba(255,255,255,.60)}section:not(.hero) .floating-dots{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}section:not(.hero) .floating-dot{position:absolute;width:7px;height:7px;border-radius:0;opacity:.32;will-change:transform,opacity}section:not(.hero) .floating-dot.orange{background:var(--orange)}section:not(.hero) .floating-dot.red{background:var(--red)}section:not(.hero) .floating-dot.navy{background:var(--navy)}section:not(.hero)>*:not(.floating-dots){position:relative;z-index:1}@keyframes brandDotFloatA{0%,100%{transform:translate3d(0,18px,0);opacity:.12}50%{transform:translate3d(18px,-28px,0);opacity:.38}}@keyframes brandDotFloatB{0%,100%{transform:translate3d(0,-12px,0);opacity:.14}50%{transform:translate3d(-22px,22px,0);opacity:.34}}@keyframes brandDotFloatC{0%,100%{transform:translate3d(10px,10px,0);opacity:.10}50%{transform:translate3d(-14px,-24px,0);opacity:.30}}
section{padding:115px clamp(24px,8vw,120px)}.tag{font-size:10px;font-weight:800;letter-spacing:.18em;color:#7D8792;margin-bottom:30px}.introGrid,.twoCol{display:grid;grid-template-columns:1fr 1fr;gap:8vw}.intro h2,.twoCol h2,.sectionHead h2{font-family:Manrope,sans-serif;font-size:clamp(40px,5vw,72px);line-height:1.02;letter-spacing:-.055em;margin:0}.intro h2 em,.twoCol h2 em,.sectionHead h2 em{font-style:normal;color:var(--orange)}.lead{font-size:21px;line-height:1.55;color:#273140;margin-top:0}.body{line-height:1.78;color:var(--muted)}
.framework{background:rgba(247,249,252,.62)}.frameworkGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.feature{background:rgba(255,255,255,.82);border:1px solid rgba(222,227,232,.92);padding:30px;min-height:215px;position:relative;transition:.4s;overflow:hidden}.feature:before{content:"";position:absolute;left:0;top:0;width:100%;height:3px;background:linear-gradient(90deg,var(--orange),var(--red));transform:scaleX(0);transform-origin:left;transition:.5s}.feature:hover{transform:translateY(-7px);box-shadow:var(--shadow)}.feature:hover:before{transform:scaleX(1)}.feature h3{font:800 22px Manrope;margin:0 0 12px}.feature p{font-size:14px;line-height:1.65;color:var(--muted);margin:0}
.mission{background:rgba(255,255,255,.56)}.missionBox{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--line);background:rgba(247,249,252,.72)}.missionCell{padding:55px 50px;min-height:270px}.missionCell+.missionCell{border-left:1px solid var(--line)}.missionCell h3{font:800 12px Manrope;letter-spacing:.15em;color:var(--orange);margin:0 0 22px}.missionCell h2{font:800 37px Manrope;letter-spacing:-.045em;margin:0 0 15px}.missionCell p{line-height:1.7;color:var(--muted);max-width:540px}
.darkFeature{background:var(--navy);color:#fff;position:relative;overflow:hidden}.darkFeature:before{content:"";position:absolute;width:600px;height:600px;border:1px solid rgba(255,138,0,.16);border-radius:50%;right:-260px;top:-190px;animation:spin 28s linear infinite}.darkFeature:after{content:"";position:absolute;width:450px;height:450px;border:1px solid rgba(227,27,46,.13);border-radius:50%;right:-160px;top:-100px;animation:spin 20s linear infinite reverse}.darkFeature .tag{color:#A8B2BE}.darkFeature .sectionHead p{color:#B8C1CC}.darkFeature .sectionHead{position:relative;z-index:2}.darkFeature .sectionHead h2{color:#fff}.darkFeature .sectionHead h2 em{color:var(--orange)}.serviceGrid{position:relative;z-index:2;display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:#2B3543}.service{background:rgba(16,24,37,.97);min-height:280px;padding:28px;border:1px solid #263142;transition:.4s}.service:hover{transform:translateY(-6px);background:#162133}.service .symbol{font-size:28px;color:var(--orange);margin:20px 0 20px}.service h3{font:800 20px Manrope;margin:0 0 10px}.service p{font-size:13px;line-height:1.6;color:#B2BCC7;margin:0}.service a{display:inline-block;margin-top:22px;color:var(--orange);font-size:11px;font-weight:800} .darkFeature .service h3{color:#F7F9FC}.darkFeature .service p{color:#C2CDDA}.darkFeature .service a{color:var(--orange)}
.products{background:rgba(255,255,255,.60)}.productRail{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.product{min-height:380px;padding:26px 28px 30px;position:relative;border:1px solid var(--line);background:rgba(255,255,255,.78);display:flex;flex-direction:column;align-items:center;text-align:center;transition:.4s}.product:hover{transform:translateY(-7px);box-shadow:var(--shadow);border-color:#C9CFD6}.product:after{content:"";position:absolute;width:170px;height:170px;border:1px solid rgba(255,138,0,.15);border-radius:50%;right:-80px;bottom:-80px}.product>span{position:absolute;right:22px;top:18px;color:var(--orange);font-size:28px}.product h3{margin:6px 0 10px;font:800 23px Manrope;line-height:1.2}.product p{font-size:13px;line-height:1.65;color:var(--muted);max-width:420px}
.cardIcon{display:block;width:96px;height:96px;object-fit:contain;object-position:center top;margin:22px auto 10px}.service .cardIcon{width:124px;height:124px;margin:12px 0 4px;object-fit:contain;object-position:center top}.product .cardIcon{width:124px;height:124px;margin:24px auto 12px;object-fit:contain;object-position:center top}
.partners{background:rgba(247,249,252,.58)}.partnerGrid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}.partner{min-height:190px;padding:28px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:rgba(255,255,255,.80);transition:.35s;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.partner:hover{transform:translateY(-4px);box-shadow:var(--shadow);z-index:2}.partner img{width:min(78%,250px);height:120px;object-fit:contain;margin:15px auto 18px}.partner p{font-size:12px;color:var(--muted);line-height:1.55;margin:0}.allianceGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-top:40px}.alliance{background:rgba(255,255,255,.80);border:1px solid var(--line);padding:25px;min-height:250px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.alliance .region{font-size:10px;font-weight:800;letter-spacing:.12em;color:var(--orange);align-self:flex-start}.alliance img{width:min(82%,280px);height:95px;object-fit:contain;margin:20px auto}.alliance p{font-size:12px;line-height:1.6;color:var(--muted)}
.industries{background:rgba(255,255,255,.58)}.industryGrid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}.industry{position:relative;display:grid;grid-template-columns:92px 1fr 24px;align-items:center;gap:18px;min-height:155px;padding:24px 28px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:rgba(255,255,255,.76);transition:.35s}.industry .cardIcon{width:88px;height:88px;margin:0 auto;object-fit:contain}.industry h3{margin:0;font:800 19px Manrope;line-height:1.18;max-width:250px}.industry b{position:absolute;right:16px;top:12px;color:var(--orange);font-size:24px}.industry:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:#cfd6de}
.approach{background:rgba(247,249,252,.58)}.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:0;border-top:1px solid var(--line)}.step{padding:30px 22px 25px;border-right:1px solid var(--line);min-height:250px;position:relative}.step:last-child{border-right:0}.step h3{font:800 22px Manrope;margin:110px 0 10px}.step p{font-size:13px;line-height:1.65;color:var(--muted)}.step:after{content:"";position:absolute;top:-1px;left:0;width:0;height:3px;background:linear-gradient(90deg,var(--orange),var(--red));transition:.5s}.step:hover:after{width:100%}.approach .stepIcon{position:absolute;left:50%;top:18px;transform:translateX(-50%);width:88px;height:88px;object-fit:contain}
.global{background:#fff}.globalGrid{display:grid;grid-template-columns:1fr .92fr;gap:6vw;align-items:center}.mapVisual{height:620px;border:0;background:#fff;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;border-radius:0}.globeStage{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;touch-action:none;cursor:grab}.globeStage.dragging{cursor:grabbing}.globeCanvas{position:absolute;inset:0;width:100%;height:100%;z-index:1}.globeLabels{position:absolute;inset:0;z-index:5;pointer-events:none}.globeLabel{position:absolute;transform:translate(-50%,-50%);font:800 10px Manrope;letter-spacing:.06em;color:var(--navy);background:transparent;border:0;border-radius:0;padding:5px 6px 5px 22px;box-shadow:none;white-space:nowrap;transition:opacity .18s ease}.globeLabel:before{content:'';position:absolute;left:3px;top:8px;width:10px;height:13px;background:var(--orange);border-radius:8px 8px 8px 2px;transform:rotate(-45deg);box-shadow:0 1px 2px rgba(16,24,37,.08)}.globeLabel:after{content:'';position:absolute;left:7px;top:10px;width:3px;height:3px;border-radius:50%;background:#fff}.globeLabel small{display:block;color:var(--orange);font-size:8px;letter-spacing:.10em;margin-top:2px}.globeLabel.soon{color:var(--navy)}.globeLabel.soon small{color:var(--orange)}.globeHud{position:absolute;left:22px;top:20px;z-index:10;display:flex;flex-direction:column;gap:6px;font:800 9px Manrope;letter-spacing:.14em;color:#7A8592}.globeHud span{display:flex;align-items:center;gap:8px}.globeHud i{width:6px;height:6px;background:var(--orange);display:inline-block;box-shadow:0 0 0 5px rgba(255,138,0,.09);animation:globePing 2.5s ease-in-out infinite}.globeHud b{font-size:8px;color:var(--navy)}.globalCopy h2{font:800 48px Manrope;letter-spacing:-.055em;margin:0 0 18px}.location{border-top:1px solid var(--line);padding:24px 0}.location small{font:800 10px Manrope;letter-spacing:.14em;color:var(--orange)}.location h3{font:800 21px Manrope;margin:9px 0 7px}.location p{margin:0;font-size:13px;line-height:1.65;color:var(--muted)}.locationRegional h3{font-size:17px}.locationComing{padding-bottom:0}.locationComing h3{font-size:17px}
@keyframes globePing{0%,100%{box-shadow:0 0 0 5px rgba(255,138,0,.09)}50%{box-shadow:0 0 0 8px rgba(255,138,0,.03)}}
.contact{background:rgba(247,249,252,.62)}.contactBox{background:rgba(255,255,255,.82);border:1px solid var(--line);padding:60px;display:grid;grid-template-columns:1.1fr .9fr;gap:8vw;position:relative;overflow:hidden}.contactBox:after{content:"";position:absolute;width:520px;height:520px;border:1px solid rgba(255,138,0,.12);border-radius:50%;right:-260px;top:-220px}.contactBox h2{font:800 64px Manrope;letter-spacing:-.06em;margin:0 0 18px}.contactBox h2 em{color:var(--orange);font-style:normal}.contactBox p{line-height:1.7;color:var(--muted);max-width:620px}.contactList{position:relative;z-index:2}.contactItem{padding:20px 0;border-bottom:1px solid var(--line)}.contactItem small{font:800 10px Manrope;letter-spacing:.13em;color:var(--orange)}.contactItem a,.contactItem span{display:block;margin-top:7px;font-weight:700;color:var(--navy)}
footer{background:#fff;padding:78px clamp(24px,7vw,108px) 24px;border-top:1px solid var(--line);position:relative;overflow:hidden}footer:before{content:'';position:absolute;right:-120px;top:-170px;width:430px;height:430px;border:1px solid rgba(255,138,0,.12);border-radius:50%;pointer-events:none}footer:after{content:'';position:absolute;left:-180px;bottom:-220px;width:520px;height:280px;border-top:1px solid rgba(227,27,46,.08);border-radius:50%;transform:rotate(-8deg);pointer-events:none}.footerTop{display:grid;grid-template-columns:minmax(280px,1.55fr) .7fr .8fr .95fr;gap:64px;padding-bottom:58px;position:relative;z-index:1}.footerBrand{padding-right:24px}.footerLogo{width:205px;height:auto;display:block;margin:0 0 22px}.footerTop p{font-size:14px;line-height:1.8;color:var(--muted);max-width:430px;margin:0}.footerMeta{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px;max-width:420px}.footerMeta span{font:700 9px Manrope;letter-spacing:.1em;color:#687482;border:1px solid #dfe4e9;padding:8px 11px;border-radius:999px;background:#fff}.footerColumn{min-width:0}.footerHead{display:flex;align-items:center;gap:9px;font:800 10px Manrope;letter-spacing:.16em;color:var(--navy);margin-bottom:21px}.footerHead:before{content:'';width:6px;height:6px;border-radius:50%;background:var(--orange);box-shadow:0 0 0 4px rgba(255,138,0,.08)}.footerLinks{display:flex;flex-direction:column;gap:13px;font-size:13px;color:#515b67}.footerLinks a{position:relative;width:max-content;max-width:100%;transition:color .2s ease,transform .2s ease}.footerLinks a:after{content:'↗';font-size:10px;opacity:0;margin-left:7px;transition:opacity .2s ease}.footerLinks a:hover{color:var(--orange);transform:translateX(2px)}.footerLinks a:hover:after{opacity:.8}.footerConnect{border-left:1px solid var(--line);padding-left:28px}.footerConnectText{font-size:12px;line-height:1.7;color:var(--muted);max-width:220px;margin:0 0 18px}.footerCta{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:13px 17px;background:var(--navy);color:#fff;font-size:11px;font-weight:800;letter-spacing:.04em;transition:.25s ease}.footerCta:hover{background:var(--orange);transform:translateY(-2px)}.bottom{border-top:1px solid var(--line);padding-top:19px;display:flex;align-items:center;justify-content:space-between;gap:20px;color:#8b949e;font-size:10px;position:relative;z-index:1}.bottom span:last-child{letter-spacing:.04em}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .9s cubic-bezier(.2,.7,.2,1)}.reveal.show{opacity:1;transform:none}.stagger>*{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .8s cubic-bezier(.2,.7,.2,1)}.stagger.show>*{opacity:1;transform:none}.stagger.show>*:nth-child(2){transition-delay:.08s}.stagger.show>*:nth-child(3){transition-delay:.16s}.stagger.show>*:nth-child(4){transition-delay:.24s}.stagger.show>*:nth-child(5){transition-delay:.32s}.stagger.show>*:nth-child(6){transition-delay:.4s}
@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:1050px){.navlinks{gap:19px}.serviceGrid{grid-template-columns:repeat(2,1fr)}.steps{grid-template-columns:repeat(3,1fr)}.step:nth-child(3){border-right:0}.allianceGrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:800px){.navlinks{display:none;position:absolute;top:68px;left:0;right:0;background:rgba(255,255,255,.97);padding:24px 7vw;flex-direction:column;align-items:flex-start;border-bottom:1px solid var(--line);box-shadow:0 18px 35px rgba(16,24,37,.08)}.navlinks.open{display:flex}.menu{display:block}.brand{width:150px}.hero{height:760px}.hero h1{font-size:clamp(48px,11vw,74px)}.hero p{font-size:16px}.introGrid,.twoCol,.missionBox,.globalGrid,.contactBox{grid-template-columns:1fr}.missionCell+.missionCell{border-left:0;border-top:1px solid var(--line)}.frameworkGrid,.productRail{grid-template-columns:1fr 1fr}.partnerGrid,.industryGrid{grid-template-columns:1fr 1fr}.steps{grid-template-columns:1fr 1fr}.step:nth-child(2n){border-right:0}.serviceGrid{grid-template-columns:1fr 1fr}.contactBox{padding:42px}.contactBox h2{font-size:48px}.mapVisual{height:500px}.footerTop{grid-template-columns:1fr 1fr}.industry{min-height:145px;grid-template-columns:78px 1fr 20px;padding:22px}.industry .cardIcon{width:70px;height:70px}.industry h3{font-size:17px}}
@media(max-width:560px){section{padding:88px 6vw}.hero{height:730px;min-height:730px}.heroCopy{width:92vw}.hero h1{font-size:48px}.heroScroll,.heroBadge{display:none}.actions{flex-direction:column;align-items:center}.btn{width:210px;justify-content:center}.frameworkGrid,.productRail,.partnerGrid,.industryGrid,.serviceGrid,.steps,.allianceGrid{grid-template-columns:1fr}.step{border-right:0;border-bottom:1px solid var(--line)}.contactBox{padding:32px 25px}.contactBox h2{font-size:42px}.footerTop{grid-template-columns:1fr}.bottom{display:block;line-height:2}.footerBrand{padding-right:0}.footerConnect{border-left:0;border-top:1px solid var(--line);padding-left:0;padding-top:26px}.globalCopy h2{font-size:40px}.mapVisual{height:400px}.globeHud{left:14px;top:14px}.globeLabel{font-size:7px;padding:4px 5px}.globeLabel small{font-size:6px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal,.stagger>*{opacity:1;transform:none;transition:none}.darkFeature:before,.darkFeature:after,.heroBadge i,.globeHud i{animation:none}.btn:after{display:none}}

/* Supplied Proctel framework icon replacements */
.featureIcon{width:76px;height:76px;object-fit:contain;display:block;margin:0 0 18px auto;}
@media (max-width:700px){.featureIcon{width:62px;height:62px;margin-bottom:14px;}}



#products .product { overflow: hidden; }
#products .product .cardIcon {
  width: 138px !important;
  height: 138px !important;
  object-fit: contain !important;
  object-position: center center !important;
  flex: 0 0 138px;
  margin: 18px auto 14px !important;
}
#products .product h3 { min-height: 56px; display:flex; align-items:center; justify-content:center; margin-top: 2px; }
#products .product p { min-height: 44px; }
#about .feature {
  min-height: 245px;
  padding: 30px 30px 28px;
}
#about .featureIcon {
  width: 94px !important;
  height: 94px !important;
  object-fit: contain !important;
  object-position: center center !important;
  margin: 0 0 20px auto !important;
  flex: 0 0 94px;
}
#about .feature h3 { margin-top: 0; }
#about .feature p { max-width: 470px; }


/* =========================================================
   PROCESS FLOW — reproduce the supplied wave layout using the
   existing five supplied process icons and approved text.
   ========================================================= */
.process-section { padding-bottom: 125px; }
.process-intro { position:relative; z-index:2; }
.wave-process { position:relative; margin-top:42px; }
.process-wave {
  position:absolute; left:4%; right:4%; top:122px; width:92%; height:150px;
  overflow:visible; pointer-events:none; z-index:0;
}
.process-grid {
  position:relative; z-index:2;
  display:grid; grid-template-columns:repeat(5,minmax(0,1fr));
  gap:0; min-height:520px;
}
.process-step { position:relative; min-width:0; text-align:center; }
.process-icon-wrap {
  width:150px; height:150px; margin:0 auto; border-radius:50%;
  background:rgba(255,255,255,.96); border:1px solid rgba(222,227,232,.95);
  box-shadow:0 16px 36px rgba(16,24,37,.07);
  display:flex; align-items:center; justify-content:center; position:relative; z-index:3;
}
.process-icon-wrap:before {
  content:""; position:absolute; inset:-1px; border-radius:50%;
  border:3px solid transparent; border-top-color:var(--orange); border-left-color:var(--orange);
  transform:rotate(-24deg); pointer-events:none;
}
.process-icon { width:106px; height:106px; object-fit:contain; object-position:center center; display:block; }
.process-node {
  width:58px; height:58px; margin:-5px auto 0; border-radius:50%;
  background:#fff; border:2px solid var(--navy); display:flex; align-items:center; justify-content:center;
  position:relative; z-index:4;
}
.process-node:before {
  content:""; position:absolute; top:-42px; left:50%; width:1px; height:42px;
  background:var(--navy); transform:translateX(-50%);
}
.process-node span { font:800 15px Manrope,sans-serif; color:var(--orange); letter-spacing:.03em; }
.process-copy { padding:18px 18px 0; }
.process-copy h3 { margin:0; font:800 25px Manrope,sans-serif; letter-spacing:-.03em; color:var(--navy); }
.process-rule { width:46px; height:2px; background:var(--orange); margin:15px auto 18px; }
.process-copy p { margin:0 auto; max-width:210px; font-size:13px; line-height:1.8; color:#536070; }
@media (max-width:1050px) {
  .process-icon-wrap { width:128px; height:128px; }
  .process-icon { width:90px; height:90px; }
  .process-copy h3 { font-size:21px; }
  .process-copy p { font-size:12px; }
  .process-wave { top:108px; }
}
@media (max-width:800px) {
  .process-section { overflow:hidden; }
  .process-grid { grid-template-columns:1fr; gap:48px; min-height:0; }
  .process-wave { display:none; }
  .process-step { display:grid; grid-template-columns:128px 1fr; grid-template-rows:auto auto; column-gap:20px; text-align:left; align-items:center; }
  .process-icon-wrap { grid-row:1 / span 2; margin:0; width:128px; height:128px; }
  .process-node { grid-column:2; grid-row:1; margin:0; width:48px; height:48px; justify-self:start; }
  .process-node:before { display:none; }
  .process-copy { grid-column:2; grid-row:2; padding:8px 0 0; }
  .process-copy h3 { font-size:22px; }
  .process-rule { margin:9px 0 12px; }
  .process-copy p { margin:0; max-width:none; }
}
@media (max-width:560px) {
  #products .product .cardIcon { width:128px !important; height:128px !important; flex-basis:128px; }
  #about .featureIcon { width:86px !important; height:86px !important; flex-basis:86px; }
}

/* Section-specific supplied illustrations */
.illustrated-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) 280px;
  gap:42px;
  align-items:center;
  position:relative;
  z-index:2;
  margin-bottom:18px;
}
.illustrated-head > .reveal,
.illustrated-head > .process-intro{
  min-width:0;
}
.section-visual{
  width:280px;
  height:255px;
  display:flex;
  align-items:center;
  justify-content:center;
  justify-self:end;
  opacity:0;
  transform:translateX(28px) scale(.96);
  transition:opacity .85s ease, transform .95s cubic-bezier(.2,.7,.2,1);
}
.section-visual.show{
  opacity:1;
  transform:none;
}
.section-visual-img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  filter:drop-shadow(0 18px 24px rgba(16,24,37,.08));
  animation:proctelSectionFloat 7s ease-in-out infinite;
  transform-origin:center;
}
@keyframes proctelSectionFloat{
  0%,100%{transform:translate3d(0,0,0) rotate(0deg)}
  50%{transform:translate3d(0,-7px,0) rotate(.5deg)}
}
/* Give the supplied illustrations a little more breathing room in dense sections. */
.darkFeature .illustrated-head,
.products .illustrated-head,
.partners .illustrated-head,
.industries .illustrated-head,
.approach .illustrated-head{margin-bottom:30px}
.darkFeature .section-visual-img{filter:drop-shadow(0 18px 26px rgba(0,0,0,.18))}
.approach-head .section-visual{height:245px}
.mission-head .section-visual{height:250px}

/* Responsive: stack the supplied illustration under the section intro rather than letting it collide with text. */
@media (max-width:900px){
  .illustrated-head{
    grid-template-columns:1fr;
    gap:18px;
  }
  .section-visual{
    width:220px;
    height:205px;
    justify-self:center;
    margin:0 auto;
  }
  .section-visual-img{max-width:220px}
  .approach-head .section-visual,
  .mission-head .section-visual{height:205px}
}
@media (prefers-reduced-motion:reduce){
  .section-visual-img{animation:none}
  .section-visual{transition:none;opacity:1;transform:none}
}


/* FINAL QC OVERRIDES — supplied assets, alignment, visibility, process fidelity */
#about .frameworkGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;}
#about .feature{min-height:300px;padding:30px 32px 32px;display:flex;flex-direction:column;align-items:stretch;text-align:left;overflow:visible;}
#about .featureIcon{display:block;width:108px !important;height:108px !important;object-fit:contain !important;object-position:center !important;margin:0 auto 22px !important;flex:0 0 108px;}
#about .feature h3{margin:0 0 12px;text-align:left;}
#about .feature p{margin:0;max-width:none;text-align:left;}
#products .productRail{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;}
#products .product{min-height:380px;overflow:hidden;align-items:center;text-align:center;padding:26px 28px 30px;}
#products .product .cardIcon{width:138px !important;height:138px !important;object-fit:contain !important;object-position:center !important;margin:18px auto 14px !important;flex:0 0 138px;}
#products .product h3{min-height:56px;display:flex;align-items:center;justify-content:center;margin:2px 0 10px;text-align:center;}
#products .product p{min-height:44px;margin:0;display:flex;align-items:flex-start;justify-content:center;text-align:center;}
.process-icon-wrap{width:150px;height:150px;margin:0 auto;background:transparent;border:0;box-shadow:none;display:flex;align-items:center;justify-content:center;position:relative;z-index:3;}
.process-icon-wrap:before{display:none !important;content:none !important;}
.process-icon{width:150px;height:150px;object-fit:contain;object-position:center;display:block;}
.process-node{margin:-5px auto 0;}
@media (max-width:1050px){#about .frameworkGrid{grid-template-columns:repeat(2,minmax(0,1fr));}.process-icon-wrap,.process-icon{width:128px;height:128px;}}
@media (max-width:800px){#about .frameworkGrid{grid-template-columns:1fr;}#about .feature{min-height:0;}.process-icon-wrap,.process-icon{width:128px;height:128px;}}


/* FINAL ICON QC — supplied artwork is authoritative */
#approach .process-icon-wrap{
  width:168px !important;
  height:168px !important;
  margin:0 auto !important;
  border-radius:50%;
  background:rgba(255,255,255,.98) !important;
  border:0 !important;
  box-shadow:0 16px 36px rgba(16,24,37,.07) !important;
  overflow:visible !important;
}
#approach .process-icon-wrap:before{display:none !important;}
#approach .process-icon{
  width:168px !important;
  height:168px !important;
  max-width:none !important;
  max-height:none !important;
  object-fit:contain !important;
  object-position:center center !important;
  display:block !important;
  flex:0 0 auto !important;
}
#approach .process-step{overflow:visible !important;}
#approach .process-copy{position:relative;z-index:5;}
#approach .process-copy h3,
#approach .process-copy p,
#approach .process-copy .process-rule{visibility:visible !important;opacity:1 !important;}

#industries .industry{
  min-width:0 !important;
  overflow:visible !important;
}
#industries .industry .cardIcon{
  width:110px !important;
  height:100px !important;
  max-width:none !important;
  max-height:none !important;
  margin:0 auto !important;
  object-fit:contain !important;
  object-position:center center !important;
  display:block !important;
}
#industries .industry h3{
  overflow-wrap:anywhere;
  visibility:visible !important;
  opacity:1 !important;
}
@media (max-width:1050px){
  #approach .process-icon-wrap,
  #approach .process-icon{width:148px !important;height:148px !important;}
  #industries .industry .cardIcon{width:96px !important;height:88px !important;}
}
@media (max-width:800px){
  #approach .process-step{overflow:visible !important;}
  #approach .process-icon-wrap{
    width:128px !important;height:128px !important;
  }
  #approach .process-icon{
    width:128px !important;height:128px !important;
  }
}


/* FINAL LOGO QC — use supplied artwork only; preserve aspect ratio and alignment */
#partners .partnerGrid {
  align-items: stretch;
}
#partners .partner {
  min-height: 220px;
  padding: 30px 28px 24px;
  display: grid;
  grid-template-rows: 132px auto;
  align-content: center;
  justify-items: center;
  text-align: center;
  box-sizing: border-box;
}
#partners .partner img {
  display: block;
  width: min(82%, 260px);
  height: 132px;
  margin: 0 auto 18px;
  object-fit: contain;
  object-position: center;
  max-width: 100%;
  max-height: 132px;
}
#partners .partner p {
  margin: 0;
  width: 100%;
  line-height: 1.55;
}

#partners .allianceGrid {
  align-items: stretch;
  gap: 22px;
  margin-top: 40px;
}
#partners .alliance {
  min-height: 330px;
  padding: 28px 26px 24px;
  display: grid;
  grid-template-rows: auto 150px minmax(74px, auto);
  align-content: start;
  justify-items: center;
  text-align: center;
  box-sizing: border-box;
}
#partners .alliance .region {
  width: 100%;
  min-height: 18px;
  margin: 0;
  align-self: start;
  text-align: left;
}
#partners .alliance > img {
  display: block;
  width: min(88%, 300px);
  height: 150px;
  margin: 0 auto;
  object-fit: contain;
  object-position: center;
  max-width: 100%;
  max-height: 150px;
  align-self: center;
}
#partners .alliance p {
  width: 100%;
  margin: 10px 0 0;
  align-self: end;
  line-height: 1.65;
}
#partners .allianceLogoPair {
  width: 100%;
  height: 150px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin: 0 auto;
  overflow: visible;
}
#partners .allianceLogoPair img {
  display: block;
  height: 86px;
  width: auto;
  max-width: 47%;
  object-fit: contain;
  object-position: center;
  margin: 0;
  flex: 0 1 auto;
}
#partners .allianceLogoPair .procurinereLogo {
  max-width: 46%;
}
#partners .allianceLogoPair .procurescoreLogo {
  max-width: 48%;
}

@media (max-width: 1050px) {
  #partners .allianceGrid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 760px) {
  #partners .partnerGrid { grid-template-columns: 1fr; }
  #partners .allianceGrid { grid-template-columns: 1fr; gap: 16px; }
  #partners .partner { min-height: 205px; }
  #partners .alliance { min-height: 315px; }
}


/* FINAL LOGO SCALE — supplied transparent artwork, visually balanced with the rest of the site */
#partners .partner img[alt="Dataman Aarogya"],
#partners .partner img[alt="TEROTAM"]{
  width: min(72%, 220px) !important;
  height: 92px !important;
  max-width: 220px !important;
  max-height: 92px !important;
  object-fit: contain !important;
  object-position: center center !important;
  margin: 0 auto 18px !important;
}
#partners .partner:has(img[alt="Dataman Aarogya"]),
#partners .partner:has(img[alt="TEROTAM"]){
  grid-template-rows: 108px auto !important;
}

/* PROCESS MOTION — scroll-triggered, sequential and deliberately restrained */
#approach .process-wave path{
  stroke-dasharray: 1400;
  stroke-dashoffset: 1400;
  transition: stroke-dashoffset 1.8s cubic-bezier(.22,.8,.24,1);
}
#approach .process-wave path:nth-of-type(2){
  stroke-dasharray: 1400;
  stroke-dashoffset: 1400;
  transition-delay:.18s;
}
#approach .process-step{
  opacity:0;
  transform:translateY(42px) scale(.97);
  transition:opacity .7s ease, transform .85s cubic-bezier(.2,.8,.25,1);
  will-change:transform,opacity;
}
#approach .process-step:nth-child(1){transition-delay:.12s}
#approach .process-step:nth-child(2){transition-delay:.28s}
#approach .process-step:nth-child(3){transition-delay:.44s}
#approach .process-step:nth-child(4){transition-delay:.60s}
#approach .process-step:nth-child(5){transition-delay:.76s}
#approach.is-inview .process-wave path{stroke-dashoffset:0}
#approach.is-inview .process-step{opacity:1;transform:none}

#approach .process-icon-wrap{
  transition:transform .8s cubic-bezier(.2,.8,.25,1), filter .6s ease;
}
#approach.is-inview .process-step:nth-child(1) .process-icon-wrap{transition-delay:.12s}
#approach.is-inview .process-step:nth-child(2) .process-icon-wrap{transition-delay:.28s}
#approach.is-inview .process-step:nth-child(3) .process-icon-wrap{transition-delay:.44s}
#approach.is-inview .process-step:nth-child(4) .process-icon-wrap{transition-delay:.60s}
#approach.is-inview .process-step:nth-child(5) .process-icon-wrap{transition-delay:.76s}
#approach.is-inview .process-icon-wrap{animation:processFloat 4.8s ease-in-out infinite}
#approach.is-inview .process-step:nth-child(2) .process-icon-wrap{animation-delay:.45s}
#approach.is-inview .process-step:nth-child(3) .process-icon-wrap{animation-delay:.9s}
#approach.is-inview .process-step:nth-child(4) .process-icon-wrap{animation-delay:1.35s}
#approach.is-inview .process-step:nth-child(5) .process-icon-wrap{animation-delay:1.8s}
@keyframes processFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-6px)}
}
#approach .process-icon{
  transition:transform .7s cubic-bezier(.2,.8,.25,1), filter .5s ease;
}
#approach .process-step:hover .process-icon{transform:scale(1.045) rotate(-1deg)}
#approach .process-step:hover .process-icon-wrap{filter:drop-shadow(0 18px 26px rgba(16,24,37,.10))}
#approach .process-node{
  transition:transform .45s cubic-bezier(.2,.8,.25,1), background .35s ease;
}
#approach .process-step:hover .process-node{transform:scale(1.08)}

/* Small moving pulse travelling across the connector after the flow is revealed */
#approach .wave-process:after{
  content:"";
  position:absolute;
  left:4%; top:122px;
  width:9px; height:9px; border-radius:50%;
  background:var(--orange);
  box-shadow:0 0 0 0 rgba(255,138,0,.32);
  opacity:0;
  transform:translateX(0);
  pointer-events:none;
}
#approach.is-inview .wave-process:after{
  opacity:1;
  animation:processTravel 4.2s cubic-bezier(.45,.05,.55,.95) 1.2s infinite,
            processPulse 1.8s ease-in-out 1.2s infinite;
}
@keyframes processTravel{
  0%{left:4%; transform:translateX(0)}
  100%{left:96%; transform:translateX(-100%)}
}
@keyframes processPulse{
  0%,100%{box-shadow:0 0 0 0 rgba(255,138,0,.30)}
  50%{box-shadow:0 0 0 9px rgba(255,138,0,0)}
}

@media (max-width:800px){
  #approach .process-step{opacity:1;transform:none;transition:none}
  #approach .process-wave:after{display:none}
}
@media (prefers-reduced-motion:reduce){
  #approach .process-wave path,
  #approach .process-step{transition:none !important}
  #approach .process-wave path{stroke-dashoffset:0 !important}
  #approach .process-step{opacity:1 !important;transform:none !important}
  #approach .process-icon-wrap{animation:none !important}
  #approach .wave-process:after{animation:none !important;display:none}
}


/* =========================================================
   PROCTEL — RECREATED PROCESS FLOW
   Final visual correction: process icons are intentionally
   smaller and aligned with the scale of the other section icons.
   ========================================================= */
#approach .process-section,
#approach.process-section{overflow:visible;}

#approach .wave-process{
  position:relative;
  margin-top:34px;
  min-height:430px;
}

/* Smaller, consistent icon treatment */
#approach .process-icon-wrap{
  width:112px !important;
  height:112px !important;
  margin:0 auto !important;
  padding:0 !important;
  border-radius:50%;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  overflow:visible !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  position:relative;
  z-index:3;
}

#approach .process-icon-wrap:before{display:none !important;}

#approach .process-icon{
  width:112px !important;
  height:112px !important;
  max-width:112px !important;
  max-height:112px !important;
  min-width:112px !important;
  min-height:112px !important;
  object-fit:contain !important;
  object-position:center !important;
  display:block !important;
  flex:0 0 112px !important;
  transform:none !important;
}

/* Keep the wave visually connected to the smaller artwork */
#approach .process-wave{
  top:92px !important;
  left:4% !important;
  width:92% !important;
  height:150px !important;
}

#approach .wave-process:after{
  top:92px !important;
}

#approach .process-node{
  width:56px !important;
  height:56px !important;
  margin:-2px auto 0 !important;
  position:relative;
  z-index:5;
}

#approach .process-node:before{
  top:-30px !important;
  height:30px !important;
}

#approach .process-copy{
  padding:15px 14px 0 !important;
}

#approach .process-copy h3{
  font-size:24px !important;
  line-height:1.15 !important;
}

#approach .process-copy p{
  max-width:205px !important;
  font-size:13px !important;
  line-height:1.72 !important;
}

/* Re-enable the intended reveal animation which was previously
   neutralized by a later QC rule. */
#approach .process-step{
  opacity:0 !important;
  transform:translateY(28px) scale(.985) !important;
  transition:opacity .7s ease, transform .8s cubic-bezier(.2,.8,.25,1) !important;
}
#approach .process-step:nth-child(1){transition-delay:.08s !important}
#approach .process-step:nth-child(2){transition-delay:.20s !important}
#approach .process-step:nth-child(3){transition-delay:.32s !important}
#approach .process-step:nth-child(4){transition-delay:.44s !important}
#approach .process-step:nth-child(5){transition-delay:.56s !important}

#approach.is-inview .process-step{
  opacity:1 !important;
  transform:none !important;
}

#approach .process-wave path{
  stroke-dasharray:1400 !important;
  stroke-dashoffset:1400 !important;
  transition:stroke-dashoffset 1.7s cubic-bezier(.22,.8,.24,1) !important;
}
#approach .process-wave path:nth-of-type(2){transition-delay:.16s !important}
#approach.is-inview .process-wave path{stroke-dashoffset:0 !important}

#approach.is-inview .process-icon-wrap{
  animation:proctelProcessFloat 4.8s ease-in-out infinite !important;
}
#approach.is-inview .process-step:nth-child(2) .process-icon-wrap{animation-delay:.35s !important}
#approach.is-inview .process-step:nth-child(3) .process-icon-wrap{animation-delay:.70s !important}
#approach.is-inview .process-step:nth-child(4) .process-icon-wrap{animation-delay:1.05s !important}
#approach.is-inview .process-step:nth-child(5) .process-icon-wrap{animation-delay:1.40s !important}

@keyframes proctelProcessFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-5px)}
}

#approach .process-step:hover .process-icon{
  transform:scale(1.035) !important;
}
#approach .process-step:hover .process-icon-wrap{
  filter:drop-shadow(0 10px 18px rgba(16,24,37,.10)) !important;
}

/* Mobile: keep the icons compact rather than letting them become oversized */
@media (max-width:800px){
  #approach .wave-process{min-height:0;margin-top:28px;}
  #approach .process-wave{display:none !important;}
  #approach .process-step{
    opacity:1 !important;
    transform:none !important;
    transition:none !important;
    display:grid;
    grid-template-columns:112px 1fr;
    grid-template-rows:auto auto;
    column-gap:18px;
    text-align:left;
    align-items:center;
  }
  #approach .process-icon-wrap,
  #approach .process-icon{
    width:112px !important;
    height:112px !important;
    min-width:112px !important;
    min-height:112px !important;
  }
  #approach .process-node{
    grid-column:2;
    grid-row:1;
    width:48px !important;
    height:48px !important;
    margin:0 !important;
    justify-self:start;
  }
  #approach .process-node:before{display:none !important;}
  #approach .process-copy{grid-column:2;grid-row:2;padding:7px 0 0 !important;}
}

@media (max-width:560px){
  #approach .process-step{grid-template-columns:94px 1fr;column-gap:14px;}
  #approach .process-icon-wrap,
  #approach .process-icon{
    width:94px !important;
    height:94px !important;
    min-width:94px !important;
    min-height:94px !important;
  }
  #approach .process-copy h3{font-size:20px !important;}
}

@media (prefers-reduced-motion:reduce){
  #approach .process-step{
    opacity:1 !important;
    transform:none !important;
    transition:none !important;
  }
  #approach .process-wave path{
    stroke-dashoffset:0 !important;
    transition:none !important;
  }
  #approach .process-icon-wrap{animation:none !important;}
}


/* =========================================================================
   PROCTEL — FINAL DESIGN LAYER
   1. Section rhythm & contrast repair
   2. Card system (services / products / sectors / partners)
   3. Global footprint section rebuilt as real text
   4. Footer with the full stacked logo
   5. Capability detail views ("tabs")
   6. Motion system
   ========================================================================= */

:root{
  --ease: cubic-bezier(.22,.72,.24,1);
  --easeOut: cubic-bezier(.16,1,.3,1);
  --ring: 0 0 0 1px rgba(16,24,37,.07);
  --lift: 0 26px 60px -22px rgba(16,24,37,.24);
  --liftSm: 0 14px 34px -14px rgba(16,24,37,.20);
}

/* -------------------------------------------------------------- 1. RHYTHM */
/* The page used semi-transparent sections stacked over a fixed background
   image, which made every surface a slightly different muddy grey and forced
   a chain of !important patches. Surfaces are now opaque and deliberate. */

.site:after{background:rgba(255,255,255,.42) !important}

.site section:not(.hero){background:#fff}
.framework{background:#F7F9FC !important}
.mission{background:#fff !important}
.products{background:#F7F9FC !important}
.partners{background:#fff !important}
.industries{background:#F7F9FC !important}
.approach{background:#fff !important}
.contact{background:#F5F7FA !important}

.site section:not(.hero){padding-top:104px;padding-bottom:104px}

/* Section heads breathe more and cap their measure. */
.sectionHead h2,.intro h2,.twoCol h2{text-wrap:balance;max-width:16ch}
.sectionHead p{font-size:16px;line-height:1.7;max-width:60ch;margin-top:20px}
.tag{margin-bottom:22px;display:inline-flex;align-items:center;gap:9px}
.tag:before{content:"";width:20px;height:2px;background:linear-gradient(90deg,var(--orange),var(--red));flex:0 0 auto}
.darkFeature .tag:before{background:linear-gradient(90deg,var(--orange),var(--red))}

/* The floating brand squares were dense enough to read as visual noise. */
.site section:not(.hero) .floating-dot{opacity:.18 !important}

/* --------------------------------------------------- 2. SERVICES (DARK) */
/* Previously this navy section was overpainted white by two later override
   blocks, leaving a white-on-white heading bug that was itself patched.
   The dark band is restored, so the page keeps its contrast rhythm. */

#services{background:var(--navy) !important;color:#fff !important;overflow:hidden}
#services .floating-dot{opacity:.20 !important}
#services .floating-dot.navy{background:#5C6B80 !important}
#services .tag{color:#96A2B1 !important}
#services .sectionHead h2{color:#fff !important}
#services .sectionHead h2 em{color:var(--orange) !important}
#services .sectionHead p{color:#AFBAC7 !important}
#services .reveal{opacity:0;transform:translateY(26px)}
#services .reveal.show{opacity:1;transform:none}

#services .serviceGrid{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;background:transparent;margin-top:18px;
}
#services .service{
  position:relative;display:flex;flex-direction:column;
  min-height:0;padding:30px 30px 26px;
  background:linear-gradient(160deg,#16202F 0%,#101825 100%);
  border:1px solid #253143;border-radius:3px;
  transition:transform .55s var(--easeOut),border-color .4s ease,box-shadow .5s ease;
  overflow:hidden;cursor:pointer;
}
#services .service:before{
  content:"";position:absolute;left:0;top:0;height:2px;width:100%;
  background:linear-gradient(90deg,var(--orange),var(--red));
  transform:scaleX(0);transform-origin:left;transition:transform .6s var(--easeOut);
}
#services .service:after{
  content:"";position:absolute;right:-90px;bottom:-90px;width:200px;height:200px;
  border:1px solid rgba(255,138,0,.16);border-radius:50%;
  transition:transform .7s var(--easeOut);
}
#services .service:hover,#services .service:focus-visible{
  transform:translateY(-8px);border-color:#3A4A61;
  box-shadow:0 30px 60px -28px rgba(0,0,0,.8);
}
#services .service:hover:before{transform:scaleX(1)}
#services .service:hover:after{transform:scale(1.16)}
#services .service:focus-visible{outline:2px solid var(--orange);outline-offset:3px}

#services .service .cardIcon{
  width:96px !important;height:96px !important;
  margin:4px 0 18px !important;object-fit:contain;object-position:left center;
  transition:transform .6s var(--easeOut);
}
#services .service:hover .cardIcon{transform:translateY(-4px) scale(1.05)}
#services .service h3{
  font:800 19px/1.28 Manrope,sans-serif;color:#F7F9FC;
  margin:0 0 10px;letter-spacing:-.02em;
}
#services .service p{
  font-size:13px;line-height:1.7;color:#A9B5C4;margin:0 0 20px;flex:1 1 auto;
}
#services .service .cardCta{
  display:flex;align-items:center;gap:8px;margin-top:auto;
  font:800 10px Manrope,sans-serif;letter-spacing:.14em;color:var(--orange);
  border-top:1px solid #253143;padding-top:16px;width:100%;
}
#services .service .cardCta i{
  font-style:normal;transition:transform .45s var(--easeOut);display:inline-block;
}
#services .service:hover .cardCta i{transform:translateX(5px)}
#services .service .cardNo{
  position:absolute;right:24px;top:22px;
  font:800 11px Manrope,sans-serif;letter-spacing:.1em;color:#33415A;
}

/* --------------------------------------------------------- 3. PRODUCTS */
#products .productRail{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:18px}
#products .product{
  min-height:0;padding:28px 28px 24px;background:#fff;
  border:1px solid var(--line);border-radius:3px;cursor:pointer;
  transition:transform .55s var(--easeOut),box-shadow .5s ease,border-color .4s ease;
}
#products .product:hover{transform:translateY(-8px);box-shadow:var(--lift);border-color:#C7D0DA}
#products .product:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
/* The bare corner arrow is retired now that each card carries a labelled
   "VIEW DETAILS" action — two arrows on one card read as noise. */
#products .product>span{display:none}
#products .product .cardIcon{
  width:118px !important;height:118px !important;
  margin:14px auto 14px !important;transition:transform .6s var(--easeOut);
}
#products .product:hover .cardIcon{transform:translateY(-5px) scale(1.05)}
#products .product h3{min-height:0 !important;font-size:20px;margin:2px 0 9px}
#products .product p{min-height:0 !important;font-size:13px;line-height:1.65;margin:0 0 18px}
#products .product .cardCta{
  display:flex;align-items:center;gap:8px;margin-top:auto;width:100%;
  justify-content:center;border-top:1px solid var(--line);padding-top:15px;
  font:800 10px Manrope,sans-serif;letter-spacing:.14em;color:var(--orange);
  position:static;
}
#products .product .cardCta i{
  font-style:normal;transition:transform .45s var(--easeOut);display:inline-block;
}
#products .product:hover .cardCta i{transform:translateX(5px)}

/* --------------------------------------------------- 4. FRAMEWORK CARDS */
#about .feature{
  background:#fff;border-radius:3px;min-height:0;
  transition:transform .55s var(--easeOut),box-shadow .5s ease,border-color .4s ease;
}
#about .feature:hover{transform:translateY(-7px);box-shadow:var(--lift)}
#about .featureIcon{width:88px !important;height:88px !important;transition:transform .6s var(--easeOut)}
#about .feature:hover .featureIcon{transform:translateY(-4px) scale(1.05)}
#about .feature h3{font-size:20px;letter-spacing:-.02em}
#about .feature p{font-size:14px;line-height:1.7}

/* ------------------------------------------- 5b. SECTION ILLUSTRATIONS */
/* The supplied HD artwork is trimmed to its own bounds and transparent, so
   it can sit a little larger than the previous low-res set without crowding
   the copy beside it. */
.site .illustrated-head{
  grid-template-columns:minmax(0,1fr) clamp(240px,23vw,318px);
  gap:clamp(28px,3.6vw,52px);
}
.site .section-visual,
.site .approach-head .section-visual,
.site .mission-head .section-visual{
  width:100%;height:clamp(206px,21vw,282px);
}
.site .section-visual-img{max-width:100%}
@media(max-width:900px){
  .site .illustrated-head{grid-template-columns:1fr}
  .site .section-visual,
  .site .approach-head .section-visual,
  .site .mission-head .section-visual{
    width:min(250px,64vw);height:auto;justify-self:center;margin:0 auto;
  }
  .site .section-visual-img{max-width:none}
}

/* ------------------------------------------------------------ 5. SECTORS */
/* Each tile now opens its own sector page. */
#industries .industry{
  background:#fff;cursor:pointer;
  transition:transform .5s var(--easeOut),box-shadow .5s ease,border-color .4s ease;
}
#industries .industry:hover{transform:translateY(-4px);box-shadow:var(--liftSm)}
#industries .industry:focus-visible{outline:2px solid var(--orange);outline-offset:-2px}
/* Ten tiles never divided evenly into three columns, which left "Global"
   stranded on a row of its own. A stacked tile carries five across, so the
   set reads as a deliberate 5 x 2 block. */
@media(min-width:1024px){
  #industries .industryGrid{grid-template-columns:repeat(5,minmax(0,1fr))}
}
@media(max-width:1023px){
  #industries .industryGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:420px){
  #industries .industryGrid{grid-template-columns:1fr}
}
#industries .industry{
  display:flex;flex-direction:column;align-items:flex-start;
  gap:0;min-height:0;padding:26px 22px 22px;text-align:left;
}
#industries .industry .cardIcon{
  width:74px !important;height:74px !important;
  margin:0 0 16px !important;object-position:left center;
}
#industries .industry h3{
  font:800 16px/1.28 Manrope,sans-serif;max-width:none;letter-spacing:-.02em;
}
#industries .industry b{right:18px;top:14px;font-size:19px}
#industries .industry .sectorCta{
  display:flex;align-items:center;gap:7px;
  margin-top:14px;font:800 9px Manrope,sans-serif;letter-spacing:.15em;
  color:var(--orange);opacity:0;transform:translateY(4px);
  transition:opacity .35s ease,transform .4s var(--easeOut);
}
#industries .industry:hover .sectorCta,
#industries .industry:focus-visible .sectorCta{opacity:1;transform:none}
#industries .industry .sectorCta i{
  font-style:normal;display:inline-block;transition:transform .4s var(--easeOut);
}
#industries .industry:hover .sectorCta i{transform:translateX(4px)}
@media(hover:none){
  #industries .industry .sectorCta{opacity:1;transform:none}
}
#industries .industry .cardIcon{transition:transform .6s var(--easeOut)}
#industries .industry:hover .cardIcon{transform:scale(1.07)}
#industries .industry b{transition:transform .45s var(--easeOut)}
#industries .industry:hover b{transform:translate(3px,-3px)}

/* ----------------------------------------------------------- 6. PARTNERS */
#partners .partner,#partners .alliance{
  background:#fff;transition:transform .5s var(--easeOut),box-shadow .5s ease;
}
#partners .partner:hover,#partners .alliance:hover{transform:translateY(-5px);box-shadow:var(--liftSm)}
#partners .partner img,#partners .alliance>img,#partners .allianceLogoPair img{
  transition:transform .6s var(--easeOut);
}
#partners .partner:hover img,#partners .alliance:hover>img{transform:scale(1.05)}

/* ------------------------------------------------------------ 6b. APPROACH */
/* The process grid reserved 520px per step and the wave 430px, leaving a
   deep empty band under the five steps. The steps now size to their content;
   the connector wave is absolutely positioned and is unaffected. */
@media(min-width:801px){
  #approach .wave-process{min-height:0 !important;margin-top:30px}
  #approach .process-grid{min-height:0 !important}
  #approach .process-copy{padding-bottom:0 !important}
}
#approach.process-section{padding-bottom:104px !important}

/* ------------------------------------------------- 7. GLOBAL FOOTPRINT */
/* The whole section was a single 3 MB flattened image with baked-in text —
   unselectable, unsearchable, and unable to reflow. Rebuilt as a real
   two-column layout with the globe illustration as the only image. */

#global{padding:104px clamp(24px,8vw,120px) !important;background:#fff !important;overflow:visible !important}
#global .globalWrap{
  display:grid;grid-template-columns:1.02fr .98fr;
  gap:clamp(32px,5vw,80px);align-items:center;
}
#global .globeArt{position:relative;min-width:0}
#global .globeArt img{
  display:block;width:100%;height:auto;
  animation:globeDrift 13s ease-in-out infinite;transform-origin:center;
}
@keyframes globeDrift{
  0%,100%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(0,-12px,0) scale(1.012)}
}
#global .globalCopy{min-width:0}
#global .globalCopy h2{
  font:800 clamp(36px,4.2vw,58px)/1.03 Manrope,sans-serif;
  letter-spacing:-.055em;margin:0 0 20px;
}
#global .globalCopy h2 em{font-style:normal;color:var(--orange)}
#global .globalCopy .lede{
  font-size:16px;line-height:1.75;color:var(--muted);
  margin:0 0 8px;max-width:52ch;
}
#global .locationList{margin-top:14px}
#global .location{border-top:1px solid var(--line);padding:22px 0}
#global .location:last-child{border-bottom:1px solid var(--line)}
#global .location small{font:800 10px Manrope,sans-serif;letter-spacing:.14em;color:var(--orange)}
#global .location h3{font:800 20px Manrope,sans-serif;margin:8px 0 6px;letter-spacing:-.02em}
#global .location p{margin:0;font-size:13px;line-height:1.7;color:var(--muted)}
#global .officeRow{
  display:flex;flex-wrap:wrap;gap:8px;margin-top:26px;
}
#global .officeRow span{
  font:700 10px Manrope,sans-serif;letter-spacing:.1em;color:#4A5666;
  border:1px solid var(--line);border-radius:999px;padding:9px 14px;background:#fff;
  transition:border-color .35s ease,color .35s ease,transform .35s var(--easeOut);
}
#global .officeRow span:hover{border-color:var(--orange);color:var(--navy);transform:translateY(-2px)}
#global .officeRow span:before{
  content:"";display:inline-block;width:5px;height:5px;border-radius:50%;
  background:var(--orange);margin-right:8px;vertical-align:middle;
}
@media(max-width:900px){
  #global .globalWrap{grid-template-columns:1fr;gap:34px}
  #global .globeArt{max-width:520px;margin:0 auto}
}

/* -------------------------------------------------------------- 8. FOOTER */
/* Footer now carries the FULL stacked lockup (mark + wordmark + tagline)
   rather than a duplicate of the compact header lockup. */
footer{background:linear-gradient(180deg,#fff 0%,#F7F9FC 100%)}
.footerTop{grid-template-columns:minmax(300px,1.5fr) .68fr .78fr .95fr;gap:52px}
.footerLogo{
  width:clamp(210px,17vw,258px) !important;height:auto !important;
  margin:0 0 26px !important;display:block;
}
.footerBrand>p{margin-top:0}
/* keeps the tag row from wrapping to a lone orphan chip */
.footerMeta{max-width:342px}
.footerConnectText{margin-bottom:20px !important}
.footerConnect .footerLinks{gap:12px;margin-bottom:22px}
.footerConnect .footerLinks a{word-break:break-word}
.footerCta{margin-top:2px}
@media(max-width:1050px){
  .footerTop{grid-template-columns:1fr 1fr;gap:44px}
  .footerConnect{border-left:0;padding-left:0}
}
@media(max-width:640px){
  .footerTop{grid-template-columns:1fr;gap:38px}
  .footerLogo{width:min(240px,72vw) !important}
  /* an earlier mobile rule flips this to display:block, which would run the
     two credit lines together — restore the flex column explicitly */
  .bottom{display:flex !important;flex-direction:column;align-items:flex-start;gap:8px;line-height:1.7}
}

/* ==================================================== 9. CAPABILITY PAGES */
/*  Real pages, not a modal. The site's own header is shared with these
    pages; what they add is a sticky sub-navigation — breadcrumb, a rail of
    sibling pages, and a "Browse all" panel for jumping across groups.    */

body.pv-active{background:#fff}
/* The site stylesheet styles bare `section` elements (115px padding, tinted
   backgrounds). Page-view sections must opt out before their own rules land. */
.pv section{padding:0;background:transparent;isolation:auto;position:relative}
.pv .dBlock{padding:clamp(34px,3.6vw,48px) clamp(24px,4vw,64px) 0}
.pv .dBlock + .dBlock{padding-top:clamp(28px,3vw,40px)}
.pv .dCta{padding:clamp(34px,4vw,52px);background:var(--navy)}

/* The site header is fixed, so the page must start below it — otherwise
   the sticky sub-bar is pushed down over the top of the hero. */
.pv{position:relative;min-height:100vh;background:#fff;padding-top:68px}
.pv[hidden]{display:none !important}

/* --- the shared site header, pinned solid over these pages --- */
body.pv-active .nav{
  height:68px;background:rgba(255,255,255,.97);backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(222,227,232,.7);
  box-shadow:0 10px 30px rgba(16,24,37,.06);
}
body.pv-active .site{display:none}

/* --- reading progress --- */
.pvProgress{
  position:fixed;left:0;top:0;height:2px;width:100%;z-index:120;
  background:linear-gradient(90deg,var(--orange),var(--red));
  transform:scaleX(0);transform-origin:left;pointer-events:none;
}

/* --- sticky sub-navigation --- */
.pvSub{
  position:sticky;top:68px;z-index:40;background:rgba(255,255,255,.97);
  backdrop-filter:blur(14px);border-bottom:1px solid var(--line);
  transition:box-shadow .35s ease;
}
.pvSub.is-stuck{box-shadow:0 14px 30px -22px rgba(16,24,37,.4)}
.pvSubTop{
  display:flex;align-items:center;
  padding:15px clamp(20px,4vw,64px) 12px;
}
.pvCrumb{
  display:flex;align-items:center;gap:9px;flex-wrap:wrap;min-width:0;
  font:700 11px Manrope,sans-serif;letter-spacing:.08em;color:#8A95A2;
}
.pvCrumb a,.pvCrumb .crumbGroup{
  color:#8A95A2;background:none;border:0;padding:0;cursor:pointer;
  font:inherit;letter-spacing:inherit;transition:color .25s ease;
}
.pvCrumb a:hover,.pvCrumb .crumbGroup:hover{color:var(--orange)}
.pvCrumb i{font-style:normal;color:#C8D0DA}
.pvCrumb span{color:var(--navy);font-weight:800}
/* The group segment of the breadcrumb is what opens the browse panel. */
.pvCrumb .crumbGroup{text-decoration:underline;text-decoration-color:transparent;
  text-underline-offset:4px;transition:color .25s ease,text-decoration-color .25s ease}
.pvCrumb .crumbGroup:hover{text-decoration-color:var(--orange)}
.pv.mega-open .pvCrumb .crumbGroup{color:var(--orange);text-decoration-color:var(--orange)}

/* sibling rail */
.pvSubRail{
  overflow-x:auto;overflow-y:hidden;scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 22px,#000 calc(100% - 22px),transparent 100%);
          mask-image:linear-gradient(90deg,transparent 0,#000 22px,#000 calc(100% - 22px),transparent 100%);
}
.pvSubRail::-webkit-scrollbar{display:none}
.pvSubRailInner{
  display:flex;gap:6px;width:max-content;min-width:100%;
  padding:0 clamp(20px,4vw,64px) 11px;
}
.pvSubRailInner a{
  flex:0 0 auto;position:relative;padding:9px 15px;border-radius:999px;
  font:600 12.5px Manrope,sans-serif;color:#5A6675;white-space:nowrap;
  border:1px solid transparent;
  transition:background .28s ease,color .28s ease,border-color .28s ease;
}
.pvSubRailInner a:hover{background:#F2F5F8;color:var(--navy)}
.pvSubRailInner a.is-active{
  background:var(--navy);color:#fff;font-weight:700;border-color:var(--navy);
}

/* --- browse-all panel --- */
.pvMega{
  border-top:1px solid var(--line);background:#fff;
  box-shadow:0 26px 50px -30px rgba(16,24,37,.45);
  max-height:min(66vh,560px);overflow-y:auto;overscroll-behavior:contain;
  animation:pvMegaIn .34s var(--easeOut);
}
.pvMega[hidden]{display:none}
@keyframes pvMegaIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.pvMegaInner{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(22px,3vw,54px);
  padding:clamp(26px,3vw,40px) clamp(20px,4vw,64px);
  max-width:1320px;
}
.pvMegaCol .pvMegaHeading{
  display:flex;align-items:center;gap:9px;margin:0 0 14px;
  font:800 9.5px Manrope,sans-serif;letter-spacing:.19em;color:#95A0AE;
}
.pvMegaCol .pvMegaHeading span{
  font-size:9px;color:var(--orange);background:rgba(255,138,0,.1);
  border-radius:999px;padding:3px 8px;letter-spacing:.06em;
}
.pvMegaCol ul{list-style:none;margin:0;padding:0}
.pvMegaCol li + li{margin-top:2px}
.pvMegaCol a{
  display:flex;align-items:baseline;gap:11px;padding:9px 12px;border-radius:2px;
  font-size:13.5px;line-height:1.45;color:#3E4A59;
  transition:background .25s ease,color .25s ease,padding-left .3s var(--easeOut);
}
.pvMegaCol a b{
  flex:0 0 auto;font:800 9.5px Manrope,sans-serif;letter-spacing:.06em;color:#B9C3CE;
  transition:color .25s ease;
}
.pvMegaCol a:hover{background:#F5F8FC;color:var(--navy);padding-left:16px}
.pvMegaCol a:hover b{color:var(--orange)}
.pvMegaCol a.is-active{background:#F5F8FC;color:var(--navy);font-weight:700}
.pvMegaCol a.is-active b{color:var(--orange)}
.pvMegaFoot{
  grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:22px;
  border-top:1px solid var(--line);padding-top:18px;margin-top:4px;
}
.pvMegaFoot a{
  font:800 10px Manrope,sans-serif;letter-spacing:.13em;color:#8A95A2;
  transition:color .25s ease;
}
.pvMegaFoot a:hover{color:var(--orange)}

.pvMain{min-width:0;padding-bottom:96px}
.pvMain:focus{outline:none}

/* --- responsive --- */
@media(max-width:900px){
  .pvMegaInner{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:800px){
  .pvSubTop{padding-top:12px;padding-bottom:9px}
  .pvMega{max-height:min(60vh,460px)}
}
@media(max-width:560px){
  .pvMegaInner{grid-template-columns:1fr;gap:22px}
  .pvCrumb{font-size:10px;gap:7px}
  .pvMain{padding-bottom:70px}
}

/* --- page hero --- */
.pvHero{
  position:relative;overflow:hidden;
  background:linear-gradient(168deg,#F5F8FC 0%,#fff 70%);
  border-bottom:1px solid var(--line);
}
.pvHero:before{
  content:"";position:absolute;right:-210px;top:-260px;width:560px;height:560px;
  border:1px solid rgba(255,138,0,.16);border-radius:50%;pointer-events:none;
}
.pvHero:after{
  content:"";position:absolute;right:-130px;top:-180px;width:380px;height:380px;
  border:1px solid rgba(227,27,46,.10);border-radius:50%;pointer-events:none;
}
.pvHeroInner{
  position:relative;z-index:2;
  padding:clamp(30px,3.6vw,48px) clamp(24px,4vw,64px) clamp(34px,3.6vw,48px);
  max-width:1180px;
}
.pvCrumb{
  display:flex;align-items:center;gap:9px;flex-wrap:wrap;
  font:700 10.5px Manrope,sans-serif;letter-spacing:.1em;color:#8A95A2;
  margin-bottom:24px;
}
.pvCrumb a{color:#8A95A2;transition:color .25s ease}
.pvCrumb a:hover{color:var(--orange)}
.pvCrumb i{font-style:normal;color:#C3CBD5}
.pvCrumb span{color:var(--navy)}
.pvHero .dKind{
  display:inline-flex;align-items:center;gap:9px;
  font:800 10px Manrope,sans-serif;letter-spacing:.18em;color:#7D8792;
  margin-bottom:16px;
}
.pvHero .dKind:before{
  content:"";width:20px;height:2px;
  background:linear-gradient(90deg,var(--orange),var(--red));
}
.pvHero h1{
  font:800 clamp(31px,4vw,56px)/1.03 Manrope,sans-serif;
  letter-spacing:-.055em;margin:0 0 20px;max-width:18ch;text-wrap:balance;
  color:var(--navy);
}
.pvHero .dLede{font-size:16.5px;line-height:1.72;color:#48535F;max-width:64ch;margin:0}
.pvHero .dChips{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.pvHero .dChips span{
  font:700 10px Manrope,sans-serif;letter-spacing:.1em;color:#3E4A59;
  background:#fff;border:1px solid var(--line);border-radius:999px;padding:9px 15px;
}
.pvHero .dStats{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));
  gap:1px;background:var(--line);border:1px solid var(--line);
  margin-top:32px;max-width:960px;
}
.pvHero .dStats div{background:#fff;padding:22px 22px 20px}
.pvHero .dStats b{
  display:block;font:800 clamp(27px,3vw,37px) Manrope,sans-serif;
  letter-spacing:-.05em;line-height:1;
  background:linear-gradient(100deg,var(--orange),var(--red));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.pvHero .dStats small{display:block;margin-top:10px;font-size:11.5px;line-height:1.6;color:var(--muted)}

/* --- cross-links to capability pages (sector pages) --- */
.pvLinks{display:grid;grid-template-columns:repeat(auto-fit,minmax(268px,1fr));gap:14px}
.pvLink{
  display:flex;flex-direction:column;position:relative;overflow:hidden;
  background:#fff;border:1px solid var(--line);border-radius:3px;padding:24px 24px 20px;
  transition:transform .5s var(--easeOut),box-shadow .45s ease,border-color .35s ease;
}
.pvLink:before{
  content:"";position:absolute;left:0;top:0;width:100%;height:2px;
  background:linear-gradient(90deg,var(--orange),var(--red));
  transform:scaleX(0);transform-origin:left;transition:transform .55s var(--easeOut);
}
.pvLink:hover{transform:translateY(-5px);box-shadow:var(--liftSm);border-color:#CFD7E0}
.pvLink:hover:before{transform:scaleX(1)}
.pvLinkKind{
  font:800 9px Manrope,sans-serif;letter-spacing:.17em;color:var(--orange);margin-bottom:12px;
}
.pvLink h3{font:800 17px/1.3 Manrope,sans-serif;margin:0 0 9px;color:var(--navy);letter-spacing:-.025em}
.pvLink p{font-size:13.5px;line-height:1.7;color:var(--muted);margin:0 0 18px}
.pvLinkGo{
  margin-top:auto;padding-top:14px;border-top:1px solid var(--line);
  font:800 10px Manrope,sans-serif;letter-spacing:.13em;color:var(--orange);
}
.pvLinkGo i{font-style:normal;display:inline-block;transition:transform .45s var(--easeOut)}
.pvLink:hover .pvLinkGo i{transform:translateX(5px)}


/* --- block shell --- */
.dBlock{padding:clamp(34px,3.6vw,48px) clamp(24px,4vw,58px) 0}
.dBlock + .dBlock{padding-top:clamp(28px,3vw,40px)}
.dHead{margin-bottom:28px;max-width:74ch}
.dHead .dEyebrow{
  display:inline-flex;align-items:center;gap:9px;
  font:800 9.5px Manrope,sans-serif;letter-spacing:.17em;color:#8A95A2;margin-bottom:15px;
}
.dHead .dEyebrow:before{content:"";width:16px;height:2px;background:var(--orange)}
.dHead h2{
  font:800 clamp(23px,2.6vw,33px)/1.16 Manrope,sans-serif;
  letter-spacing:-.04em;margin:0;color:var(--navy);text-wrap:balance;
}
.dHead p{font-size:15px;line-height:1.72;color:var(--muted);margin:15px 0 0;max-width:70ch}

/* --- cards --- */
.dCards{display:grid;grid-template-columns:repeat(auto-fit,minmax(268px,1fr));gap:14px}
.dCard{
  position:relative;background:#fff;border:1px solid var(--line);border-radius:3px;
  padding:24px 24px 22px;transition:transform .5s var(--easeOut),box-shadow .45s ease,border-color .35s ease;
}
.dCard:before{
  content:"";position:absolute;left:0;top:0;width:100%;height:2px;
  background:linear-gradient(90deg,var(--orange),var(--red));
  transform:scaleX(0);transform-origin:left;transition:transform .55s var(--easeOut);
}
.dCard:hover{transform:translateY(-5px);box-shadow:var(--liftSm);border-color:#CFD7E0}
.dCard:hover:before{transform:scaleX(1)}
.dCard .dNo,.dCard .dBadge{
  display:inline-flex;align-items:center;justify-content:center;
  font:800 10px Manrope,sans-serif;letter-spacing:.08em;margin-bottom:15px;
}
.dCard .dNo{
  width:30px;height:30px;border-radius:50%;color:var(--orange);
  border:1px solid rgba(255,138,0,.4);background:rgba(255,138,0,.06);
}
.dCard .dBadge{
  min-width:52px;height:26px;padding:0 11px;border-radius:2px;
  background:var(--navy);color:#fff;letter-spacing:.12em;font-size:9.5px;
}
.dCard h3{font:800 16.5px/1.35 Manrope,sans-serif;margin:0 0 10px;letter-spacing:-.02em;color:var(--navy)}
.dCard p{font-size:13.5px;line-height:1.72;color:var(--muted);margin:0}

/* --- chain (value chain columns) --- */
.dChain{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;position:relative}
.dChainCol{
  background:#fff;border:1px solid var(--line);border-radius:3px;
  padding:24px 22px;position:relative;overflow:hidden;
  transition:transform .5s var(--easeOut),box-shadow .45s ease;
}
.dChainCol:hover{transform:translateY(-5px);box-shadow:var(--liftSm)}
.dChainCol .k{
  display:inline-block;font:800 10px Manrope,sans-serif;letter-spacing:.14em;
  color:#fff;background:var(--navy);padding:7px 12px;border-radius:2px;margin-bottom:16px;
}
.dChainCol:nth-child(2) .k{background:var(--orange)}
.dChainCol:nth-child(3) .k{background:var(--red)}
.dChainCol h3{font:800 17px/1.3 Manrope,sans-serif;margin:0 0 16px;color:var(--navy);letter-spacing:-.02em}
.dChainCol ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.dChainCol li{
  font-size:13px;line-height:1.55;color:#4B5666;
  background:#F7F9FC;border:1px solid #E8ECF1;border-radius:2px;padding:10px 13px;
}

/* --- steps --- */
.dSteps{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
.dStep{
  position:relative;background:#fff;border:1px solid var(--line);border-radius:3px;
  padding:24px 22px 22px;transition:transform .5s var(--easeOut),box-shadow .45s ease;
}
.dStep:hover{transform:translateY(-5px);box-shadow:var(--liftSm)}
.dStep .n{
  display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:30px;
  padding:0 11px;border-radius:2px;background:var(--navy);color:var(--orange);
  font:800 11px Manrope,sans-serif;letter-spacing:.1em;margin-bottom:16px;
}
.dStep h3{font:800 16.5px/1.3 Manrope,sans-serif;margin:0 0 8px;color:var(--navy);letter-spacing:-.02em}
.dStep p{font-size:13.5px;line-height:1.72;color:var(--muted);margin:0}
.dStep ul{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:7px}
.dStep li{
  font-size:12.5px;line-height:1.6;color:#4B5666;padding-left:15px;position:relative;
}
.dStep li:before{
  content:"";position:absolute;left:0;top:8px;width:5px;height:5px;
  background:var(--orange);border-radius:50%;
}

/* --- stack (layered architecture) --- */
.dStack{display:flex;flex-direction:column;gap:9px}
.dLayer{
  display:grid;grid-template-columns:112px 1fr;gap:20px;align-items:center;
  background:#fff;border:1px solid var(--line);border-radius:3px;padding:20px 22px;
  transition:transform .45s var(--easeOut),box-shadow .4s ease,border-color .35s ease;
}
.dLayer:hover{transform:translateX(5px);box-shadow:var(--liftSm);border-color:#CFD7E0}
.dLayer:first-child{background:var(--navy);border-color:var(--navy)}
.dLayer:first-child h3{color:#fff}
.dLayer:first-child p{color:#A9B5C4}
.dLayer:first-child .k{background:var(--orange);color:#fff;border-color:transparent}
.dLayer .k{
  display:inline-flex;align-items:center;justify-content:center;height:28px;padding:0 12px;
  border:1px solid var(--line);border-radius:2px;background:#F7F9FC;
  font:800 10px Manrope,sans-serif;letter-spacing:.12em;color:var(--navy);
}
.dLayer h3{font:800 16px/1.3 Manrope,sans-serif;margin:0 0 5px;color:var(--navy);letter-spacing:-.02em}
.dLayer p{font-size:13px;line-height:1.65;color:var(--muted);margin:0}
.dStackArrow{
  text-align:center;color:var(--orange);font-size:13px;letter-spacing:.4em;
  margin:-3px 0;user-select:none;
}
@media(max-width:600px){
  .dLayer{grid-template-columns:1fr;gap:12px}
  .dLayer .k{justify-self:start}
}

/* --- pills --- */
.dPills{display:grid;grid-template-columns:repeat(auto-fit,minmax(268px,1fr));gap:14px}
.dPillGroup{
  background:#fff;border:1px solid var(--line);border-radius:3px;padding:24px 22px;
  transition:transform .5s var(--easeOut),box-shadow .45s ease;
}
.dPillGroup:hover{transform:translateY(-5px);box-shadow:var(--liftSm)}
.dPillGroup h3{font:800 16.5px Manrope,sans-serif;margin:0 0 3px;color:var(--navy);letter-spacing:-.02em}
.dPillGroup .sub{font-size:12px;color:var(--orange);font-weight:700;letter-spacing:.03em;margin:0 0 14px}
.dPillGroup h3+.tagRow{margin-top:14px}
.tagRow{display:flex;flex-wrap:wrap;gap:7px}
.tagRow span{
  font-size:12px;line-height:1;color:#3E4A59;background:#F7F9FC;
  border:1px solid #E4E9EE;border-radius:999px;padding:9px 13px;
  transition:border-color .3s ease,color .3s ease,transform .3s var(--easeOut);
}
.tagRow span:hover{border-color:var(--orange);color:var(--navy);transform:translateY(-2px)}

/* --- roles --- */
.dRoles{display:grid;grid-template-columns:repeat(auto-fit,minmax(272px,1fr));gap:14px}
.dRole{
  background:#fff;border:1px solid var(--line);border-radius:3px;padding:22px;
  display:flex;flex-direction:column;
  transition:transform .5s var(--easeOut),box-shadow .45s ease,border-color .35s ease;
}
.dRole:hover{transform:translateY(-5px);box-shadow:var(--liftSm);border-color:#CFD7E0}
.dRole h3{font:800 15.5px/1.32 Manrope,sans-serif;margin:0 0 14px;color:var(--navy);letter-spacing:-.02em}
.dRole .tagRow{margin-bottom:16px}
.dRole .roleFoot{
  margin-top:auto;padding-top:13px;border-top:1px solid var(--line);
  font:700 9.5px Manrope,sans-serif;letter-spacing:.13em;color:#8A95A2;
}

/* --- tiers --- */
.dTiers{display:grid;grid-template-columns:repeat(auto-fit,minmax(248px,1fr));gap:14px}
.dTier{
  background:#fff;border:1px solid var(--line);border-radius:3px;padding:24px 22px;
  display:flex;flex-direction:column;position:relative;overflow:hidden;
  transition:transform .5s var(--easeOut),box-shadow .45s ease;
}
.dTier:before{
  content:"";position:absolute;left:0;top:0;width:100%;height:3px;
  background:linear-gradient(90deg,var(--orange),var(--red));
  transform:scaleX(0);transform-origin:left;transition:transform .55s var(--easeOut);
}
.dTier:hover{transform:translateY(-6px);box-shadow:var(--lift)}
.dTier:hover:before{transform:scaleX(1)}
.dTier .k{
  display:inline-block;font:800 9.5px Manrope,sans-serif;letter-spacing:.16em;
  color:var(--orange);margin-bottom:12px;
}
.dTier h3{font:800 17px/1.3 Manrope,sans-serif;margin:0 0 12px;color:var(--navy);letter-spacing:-.025em}
.dTier>p{font-size:13px;line-height:1.68;color:var(--muted);margin:0 0 14px}
.dTier ul{list-style:none;margin:0 0 16px;padding:0;display:flex;flex-direction:column;gap:8px}
.dTier li{font-size:13px;line-height:1.5;color:#4B5666;padding-left:16px;position:relative}
.dTier li:before{content:"›";position:absolute;left:0;top:-1px;color:var(--orange);font-weight:800}
.dTier .tierFoot{
  margin-top:auto;padding-top:14px;border-top:1px solid var(--line);
  font-size:12px;line-height:1.6;color:#8A95A2;font-style:italic;
}

/* --- list columns --- */
.dLists{display:grid;grid-template-columns:repeat(auto-fit,minmax(272px,1fr));gap:14px}
.dList{
  background:#fff;border:1px solid var(--line);border-radius:3px;padding:24px 22px;
  transition:transform .5s var(--easeOut),box-shadow .45s ease;
}
.dList:hover{transform:translateY(-5px);box-shadow:var(--liftSm)}
.dList h3{font:800 16.5px/1.32 Manrope,sans-serif;margin:0 0 6px;color:var(--navy);letter-spacing:-.02em}
.dList .sub{font-size:13px;line-height:1.68;color:var(--muted);margin:0 0 15px}
.dList h3+ul{margin-top:15px}
.dList ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.dList li{font-size:13.5px;line-height:1.6;color:#4B5666;padding-left:20px;position:relative}
.dList li:before{
  content:"";position:absolute;left:0;top:7px;width:6px;height:6px;
  background:var(--orange);border-radius:50%;
}
.dList.isCheck li:before{
  content:"✓";background:none;width:auto;height:auto;top:-1px;left:0;
  color:var(--orange);font-weight:800;font-size:12px;
}
.dList.isNum{counter-reset:dl}
.dList.isNum li{padding-left:34px;counter-increment:dl;min-height:24px}
.dList.isNum li:before{
  content:counter(dl,decimal-leading-zero);background:none;width:auto;height:auto;
  top:0;left:0;color:var(--orange);font:800 11px Manrope,sans-serif;letter-spacing:.06em;
}

/* --- table --- */
.dTableWrap{overflow-x:auto;border:1px solid var(--line);border-radius:3px;background:#fff}
.dTable{border-collapse:collapse;width:100%;min-width:520px}
.dTable th{
  text-align:left;font:800 9.5px Manrope,sans-serif;letter-spacing:.16em;color:#fff;
  background:var(--navy);padding:15px 20px;white-space:nowrap;
}
.dTable td{
  padding:15px 20px;font-size:13.5px;line-height:1.65;color:#4B5666;
  border-top:1px solid var(--line);vertical-align:top;
}
.dTable td:first-child{font-weight:700;color:var(--navy);white-space:nowrap}
.dTable tr{transition:background .25s ease}
.dTable tbody tr:hover{background:#F7F9FC}

/* --- note --- */
.dNote{
  display:flex;gap:16px;align-items:flex-start;
  background:#F7F9FC;border:1px solid var(--line);border-left:3px solid var(--orange);
  border-radius:2px;padding:20px 24px;margin-top:16px;
}
.dNote.isWarn{border-left-color:var(--red);background:#FDF5F6}
.dNote i{
  flex:0 0 auto;font-style:normal;font-size:13px;color:var(--orange);
  font-weight:800;line-height:1.7;
}
.dNote.isWarn i{color:var(--red)}
.dNote p{margin:0;font-size:14px;line-height:1.75;color:#3E4A59}
.dBlock.isNoteBlock{padding-top:16px !important}
.dBlock.isNoteBlock .dNote{margin-top:0}

/* --- detail CTA --- */
.dCta{
  margin:clamp(46px,5vw,68px) clamp(24px,4vw,58px) 0;
  background:var(--navy);color:#fff;border-radius:3px;
  padding:clamp(34px,4vw,52px);position:relative;overflow:hidden;
}
.dCta:after{
  content:"";position:absolute;right:-160px;bottom:-200px;width:460px;height:460px;
  border:1px solid rgba(255,138,0,.18);border-radius:50%;pointer-events:none;
}
.dCta h2{
  font:800 clamp(24px,2.9vw,36px)/1.12 Manrope,sans-serif;
  letter-spacing:-.045em;margin:0 0 14px;max-width:20ch;
}
.dCta h2 em{font-style:normal;color:var(--orange)}
.dCta p{font-size:14.5px;line-height:1.72;color:#AFBAC7;margin:0 0 26px;max-width:56ch}
.dCta .dCtaRow{display:flex;flex-wrap:wrap;gap:10px;position:relative;z-index:2}
.dCta a{
  display:inline-flex;align-items:center;gap:9px;padding:14px 20px;border-radius:2px;
  font:800 11px Manrope,sans-serif;letter-spacing:.08em;transition:.35s var(--easeOut);
}
.dCta a.solid{background:var(--orange);color:#fff}
.dCta a.solid:hover{background:var(--red);transform:translateY(-3px)}
.dCta a.ghost{border:1px solid #37455A;color:#fff}
.dCta a.ghost:hover{border-color:var(--orange);color:var(--orange);transform:translateY(-3px)}

/* --- prev / next --- */
.dNav{
  display:grid;grid-template-columns:1fr 1fr;gap:14px;
  margin:22px clamp(24px,4vw,58px) 0;
}
.dNav button{
  background:#fff;border:1px solid var(--line);border-radius:3px;cursor:pointer;
  padding:20px 22px;text-align:left;
  transition:transform .45s var(--easeOut),box-shadow .4s ease,border-color .35s ease;
}
.dNav button:last-child{text-align:right}
.dNav button:hover{transform:translateY(-4px);box-shadow:var(--liftSm);border-color:#CFD7E0}
.dNav small{
  display:block;font:800 9.5px Manrope,sans-serif;letter-spacing:.15em;
  color:var(--orange);margin-bottom:9px;
}
.dNav strong{
  display:block;font:800 15px/1.32 Manrope,sans-serif;color:var(--navy);letter-spacing:-.02em;
}
.dNav button:disabled{opacity:.35;cursor:default;transform:none;box-shadow:none}
@media(max-width:560px){.dNav{grid-template-columns:1fr}.dNav button:last-child{text-align:left}}

/* --- entrance motion inside the panel --- */
/* --- count-aware grids ---
   auto-fit alone settles on 3 columns and leaves a 4-item block with an
   orphan card on its own row. Item counts are published as data-n so each
   block can pick a balanced shape. */
@media(min-width:900px){
  /* text-heavy cards read better two-up than squeezed four-up */
  .dCards[data-n="4"],.dCards[data-n="2"],
  .dLists[data-n="4"],.dLists[data-n="2"]{grid-template-columns:repeat(2,minmax(0,1fr))}
  /* short-list blocks carry four across comfortably */
  .dTiers[data-n="4"],.dTiers[data-n="8"],
  .dPills[data-n="4"],.dPills[data-n="8"],
  .dSteps[data-n="4"],.dSteps[data-n="8"]{grid-template-columns:repeat(4,minmax(0,1fr))}
  .dCards[data-n="8"]{grid-template-columns:repeat(4,minmax(0,1fr))}
  .dSteps[data-n="6"],.dCards[data-n="6"],.dCards[data-n="9"],
  .dRoles[data-n="6"]{grid-template-columns:repeat(3,minmax(0,1fr))}
  .dSteps[data-n="5"],.dTiers[data-n="5"]{grid-template-columns:repeat(5,minmax(0,1fr))}
}
@media(min-width:640px) and (max-width:899px){
  .dCards,.dChain,.dSteps,.dPills,.dRoles,.dTiers,.dLists{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media(max-width:639px){
  .dCards,.dChain,.dSteps,.dPills,.dRoles,.dTiers,.dLists{grid-template-columns:1fr}
}

.dRise{opacity:0;transform:translateY(20px);transition:opacity .6s ease,transform .7s var(--easeOut)}
.dRise.in{opacity:1;transform:none}
.dCards>*,.dChain>*,.dSteps>*,.dPills>*,.dRoles>*,.dTiers>*,.dLists>*,.dStack>*,.dStats>*{
  opacity:0;transform:translateY(16px);
  transition:opacity .55s ease,transform .65s var(--easeOut);
}
.dRise.in .dCards>*,.dRise.in .dChain>*,.dRise.in .dSteps>*,.dRise.in .dPills>*,
.dRise.in .dRoles>*,.dRise.in .dTiers>*,.dRise.in .dLists>*,.dRise.in .dStack>*,
.pvHero .dStats>*{opacity:1;transform:none}
.dRise.in .dCards>*:nth-child(2),.dRise.in .dChain>*:nth-child(2),.dRise.in .dSteps>*:nth-child(2),
.dRise.in .dPills>*:nth-child(2),.dRise.in .dRoles>*:nth-child(2),.dRise.in .dTiers>*:nth-child(2),
.dRise.in .dLists>*:nth-child(2),.dRise.in .dStack>*:nth-child(2),.pvHero .dStats>*:nth-child(2){transition-delay:.06s}
.dRise.in .dCards>*:nth-child(3),.dRise.in .dChain>*:nth-child(3),.dRise.in .dSteps>*:nth-child(3),
.dRise.in .dPills>*:nth-child(3),.dRise.in .dRoles>*:nth-child(3),.dRise.in .dTiers>*:nth-child(3),
.dRise.in .dLists>*:nth-child(3),.dRise.in .dStack>*:nth-child(3),.pvHero .dStats>*:nth-child(3){transition-delay:.12s}
.dRise.in .dCards>*:nth-child(4),.dRise.in .dSteps>*:nth-child(4),.dRise.in .dPills>*:nth-child(4),
.dRise.in .dRoles>*:nth-child(4),.dRise.in .dTiers>*:nth-child(4),.dRise.in .dStack>*:nth-child(4),
.pvHero .dStats>*:nth-child(4){transition-delay:.18s}
.dRise.in .dCards>*:nth-child(5),.dRise.in .dSteps>*:nth-child(5),.dRise.in .dPills>*:nth-child(5),
.dRise.in .dRoles>*:nth-child(5){transition-delay:.24s}
.dRise.in .dCards>*:nth-child(n+6),.dRise.in .dSteps>*:nth-child(n+6),
.dRise.in .dPills>*:nth-child(n+6),.dRise.in .dRoles>*:nth-child(n+6){transition-delay:.3s}



/* ======================================================== 10. MOTION */
/* Reveals now translate less and add a slight scale + blur settle, so the
   page reads as composed rather than as blocks sliding in. */
.reveal{
  opacity:0;transform:translateY(24px) scale(.995);filter:blur(6px);
  transition:opacity .85s ease,transform .95s var(--easeOut),filter .8s ease;
}
.reveal.show{opacity:1;transform:none;filter:none}
.stagger>*{
  opacity:0;transform:translateY(20px);filter:blur(4px);
  transition:opacity .7s ease,transform .8s var(--easeOut),filter .65s ease;
}
.stagger.show>*{opacity:1;transform:none;filter:none}
.stagger.show>*:nth-child(2){transition-delay:.07s}
.stagger.show>*:nth-child(3){transition-delay:.14s}
.stagger.show>*:nth-child(4){transition-delay:.21s}
.stagger.show>*:nth-child(5){transition-delay:.28s}
.stagger.show>*:nth-child(6){transition-delay:.35s}
.stagger.show>*:nth-child(7){transition-delay:.42s}
.stagger.show>*:nth-child(8){transition-delay:.49s}
.stagger.show>*:nth-child(9){transition-delay:.56s}

/* Headline mask-reveal.
   Scoped to headings that actually sit inside a .reveal element, so a heading
   whose section never receives .show (e.g. #approach) is never left clipped.
   Both forms are covered: .reveal as an ancestor, and .reveal as the heading's
   own container (#global .globalCopy). */
.reveal .sectionHead h2,
.reveal .missionCell h2,
.reveal.globalCopy h2{
  clip-path:inset(0 0 108% 0);
  transition:clip-path 1.05s var(--easeOut);
}
.reveal.show .sectionHead h2,
.reveal.show .missionCell h2,
.reveal.show.globalCopy h2{clip-path:inset(0 0 -22% 0)}

/* Scroll progress bar on the main page */
.scrollProgress{
  position:fixed;left:0;top:0;height:2px;z-index:110;
  background:linear-gradient(90deg,var(--orange),var(--red));
  transform:scaleX(0);transform-origin:left;width:100%;
  transition:opacity .3s ease;opacity:0;pointer-events:none;
}
.nav.scrolled ~ .scrollProgress,body.scrolled .scrollProgress{opacity:1}

@media (prefers-reduced-motion:reduce){
  .reveal,.stagger>*{opacity:1 !important;transform:none !important;filter:none !important;transition:none !important}
  .reveal .sectionHead h2,.reveal .missionCell h2,.reveal.globalCopy h2{clip-path:none !important;transition:none !important}
  .pvHero,.pvSubRailInner a,.pvMega{transition:none !important;animation:none !important}
  .dRise,.dCards>*,.dChain>*,.dSteps>*,.dPills>*,.dRoles>*,.dTiers>*,.dLists>*,.dStack>*,.dStats>*{
    opacity:1 !important;transform:none !important;transition:none !important;
  }
  #global .globeArt img{animation:none !important}
  .scrollProgress{display:none}
}

/* ---------------------------------------------------- 11. RESPONSIVE */
@media(max-width:1050px){
  #services .serviceGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  #products .productRail{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:720px){
  #services .serviceGrid,#products .productRail{grid-template-columns:1fr}
  .site section:not(.hero){padding-top:78px;padding-bottom:78px}
  .dBlock{padding-left:20px;padding-right:20px}
  .dHero{padding-left:20px;padding-right:20px}
  .dCta,.dNav{margin-left:20px;margin-right:20px}
}

/* ============================================== 12. RESILIENCE & PRINT */
/* Most of this page starts at opacity:0 and is only revealed when an
   IntersectionObserver fires. That is fine while everything works, but it
   means the content is invisible — not merely unanimated — if the observer
   never delivers: JavaScript off, an old browser, a print job, a crawler or
   screenshot service that does not composite. These rules and the matching
   safety net in the engine make the revealed state the fallback. */

html.no-js .reveal,
html.no-js .stagger > *,
html.no-js .section-visual,
html.no-js .dRise,
html.no-js #approach .process-step,
html.no-js .dCards>*,
html.no-js .dChain>*,
html.no-js .dSteps>*,
html.no-js .dPills>*,
html.no-js .dRoles>*,
html.no-js .dTiers>*,
html.no-js .dLists>*,
html.no-js .dStack>*,
html.no-js .dStats>*{
  opacity:1 !important;transform:none !important;
}
html.no-js #approach .process-wave path{stroke-dashoffset:0 !important}

/* Set by the engine once everything has had its chance to animate. */
html.reveal-fallback .reveal,
html.reveal-fallback .stagger > *,
html.reveal-fallback .section-visual,
html.reveal-fallback .dRise,
html.reveal-fallback #approach .process-step,
html.reveal-fallback .dCards>*,
html.reveal-fallback .dChain>*,
html.reveal-fallback .dSteps>*,
html.reveal-fallback .dPills>*,
html.reveal-fallback .dRoles>*,
html.reveal-fallback .dTiers>*,
html.reveal-fallback .dLists>*,
html.reveal-fallback .dStack>*,
html.reveal-fallback .dStats>*{
  opacity:1 !important;transform:none !important;
}
html.reveal-fallback #approach .process-wave path{stroke-dashoffset:0 !important}

@media print{
  /* Never print a page whose content is still waiting to fade in. */
  .reveal,.stagger > *,.section-visual,.dRise,#approach .process-step,
  .dCards>*,.dChain>*,.dSteps>*,.dPills>*,.dRoles>*,.dTiers>*,.dLists>*,.dStack>*,.dStats>*{
    opacity:1 !important;transform:none !important;
  }
  #approach .process-wave path{stroke-dashoffset:0 !important}

  /* Chrome and Safari drop background colours when printing, which would
     turn the navy Services band and page CTAs into white-on-white. */
  #services,.dCta,.dStack .dLayer.isCore,.pvSubRailInner a.is-active{
    background:#fff !important;color:var(--ink) !important;
    border:1px solid #999 !important;
  }
  #services .service{background:#fff !important;border:1px solid #999 !important}
  #services .sectionHead h2,#services .service h3,.dCta h2{color:#000 !important}
  #services .service p,#services .sectionHead p,.dCta p{color:#333 !important}
  #services .tag,#services .service .cardCta{color:#555 !important}

  .nav,.pvSub,.pvMega,.pvProgress,.floating-dots,.hero3d,
  .heroScroll,.heroBadge,.dNav,.sectorCta,.cardCta{display:none !important}
  .pv{padding-top:0 !important}
  body,.site,.pv{background:#fff !important}
  a[href^="http"]:after,a[href^="mailto"]:after{
    content:" (" attr(href) ")";font-size:10px;color:#555;
  }
  .dCard,.dStep,.dTier,.dRole,.dPillGroup,.dList,.dChainCol,.dLayer,
  .feature,.product,.industry,.partner,.alliance{
    break-inside:avoid;page-break-inside:avoid;
  }
  h1,h2,h3{break-after:avoid;page-break-after:avoid}
  section{padding:24px 0 !important}
}

/* ------------------------------------------------- 13. CONTRAST REPAIR */
/* Measured against WCAG 2.1 AA (4.5:1 for text under 18.66px bold / 24px).
   These were the failures; each is darkened only as far as it needs to go. */
.tag{color:#69737F}                        /* was #7D8792  3.46:1 -> 5.2:1  */
.bottom{color:#6B747E}                     /* was #8b949e  3.08:1 -> 5.0:1  */
.pvCrumb,.pvCrumb a,.pvCrumb .crumbGroup{color:#69737F}   /* 3.04 -> 5.2:1 */
.dHead .dEyebrow{color:#69737F}            /* 3.04:1 -> 5.2:1               */
.dNav small{color:#69737F}                 /* 2.36:1 -> 5.2:1               */
.pvMegaCol .pvMegaHeading{color:#69737F}               /* 2.65:1 -> 5.2:1               */
.pvMegaCol a b{color:#8A95A2}              /* number gutter, decorative     */

/* Footer and nav links were 17px tall — under the 24px minimum target size
   (WCAG 2.5.8). Padding grows the hit area without moving anything. */
.footerLinks{gap:6px}
.footerLinks a{padding:5px 0}
.bottom{padding-top:22px;padding-bottom:6px}

/* --------------------------------------------------- 14. SKIP LINK */
.skipLink{
  position:absolute;left:14px;top:-60px;z-index:200;
  padding:12px 18px;background:var(--navy);color:#fff;border-radius:2px;
  font:800 11px Manrope,sans-serif;letter-spacing:.1em;
  transition:top .2s var(--easeOut);
}
.skipLink:focus{top:14px}

/* ==================================== 15. LEGAL PAGES & 404 */

/* --- legal: a single measured column, prose first --- */
.pv.is-legal .pvHeroInner,
.pv.is-legal .dBlock{max-width:820px}
.pv.is-legal .pvHero h1{font-size:clamp(34px,4vw,54px)}
.pvUpdated{
  margin:18px 0 0;font:700 11px Manrope,sans-serif;
  letter-spacing:.08em;color:#69737F;
}

.prose{max-width:72ch}
.prose h2{
  margin:0 0 16px;font:800 21px/1.3 Manrope,sans-serif;
  letter-spacing:-.02em;color:var(--navy);
}
.prose p{margin:0 0 16px;font-size:15px;line-height:1.78;color:#414D5C}
.prose p:last-child{margin-bottom:0}
.prose a{
  color:var(--orange);text-decoration:underline;
  text-underline-offset:3px;text-decoration-thickness:1px;
}
.prose a:hover{color:var(--red)}
.prose .proseList{margin:0 0 16px;padding:0;list-style:none}
.prose .proseList li{
  position:relative;padding-left:22px;margin-bottom:9px;
  font-size:15px;line-height:1.7;color:#414D5C;
}
.prose .proseList li:before{
  content:"";position:absolute;left:2px;top:10px;
  width:6px;height:6px;border-radius:50%;background:var(--orange);
}
.prose .dTable th{width:22%;white-space:nowrap}
.prose .dTable code{
  font:600 12px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  color:#4A5765;background:#F2F5F8;padding:2px 6px;border-radius:2px;
}

/* --- unmistakable placeholders: these must never ship unnoticed --- */
.todoBox{
  border:1px solid #E9B44C;border-left:4px solid #E9B44C;
  background:#FFF9EC;padding:20px 24px;border-radius:3px;max-width:72ch;
}
.todoBox strong{
  display:block;margin-bottom:8px;
  font:800 10px Manrope,sans-serif;letter-spacing:.16em;
  text-transform:uppercase;color:#8A6414;
}
.todoBox p{margin:0;font-size:14px;line-height:1.72;color:#6B5210}
.todoInline{
  background:#FFF1C9;border-bottom:1px dashed #C79A2E;
  padding:1px 6px;border-radius:2px;color:#7A5B10;font-weight:600;
}

/* --- 404 --- */
.pv.is-404 .nfHero{border-bottom:1px solid var(--line)}
.pv.is-404 .nfHero .dKind{color:var(--red)}
.pv.is-404 .nfHero .dKind:before{background:var(--red)}
.nfWanted{margin:16px 0 0;font-size:13px;color:#69737F}
.nfWanted code{
  font:600 12.5px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  color:#414D5C;background:#F2F5F8;padding:3px 8px;border-radius:2px;
  word-break:break-all;
}
/* The .dCta button styles are scoped to the navy CTA block and use white
   text; the 404 hero is light, so its actions need their own treatment. */
.nfActions{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.nfActions a{
  display:inline-flex;align-items:center;gap:9px;padding:15px 22px;border-radius:2px;
  font:800 11px Manrope,sans-serif;letter-spacing:.1em;
  transition:transform .35s var(--easeOut),background .3s ease,border-color .3s ease,color .3s ease;
}
.nfActions a.solid{background:var(--orange);color:#fff}
.nfActions a.solid:hover{background:var(--red);transform:translateY(-2px)}
.nfActions a.ghost{border:1px solid #9AA3AE;background:rgba(255,255,255,.9);color:var(--navy)}
.nfActions a.ghost:hover{border-color:var(--orange);color:var(--orange);transform:translateY(-2px)}
.nfGrid{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(18px,2.4vw,36px);
}
.nfCol h2{
  margin:0 0 14px;font:800 9.5px Manrope,sans-serif;
  letter-spacing:.19em;color:#69737F;text-transform:uppercase;
}
.nfCol ul{list-style:none;margin:0;padding:0}
.nfCol li+li{margin-top:3px}
.nfCol a{
  display:block;padding:7px 10px;border-radius:2px;
  font-size:13.5px;line-height:1.45;color:#3E4A59;
  transition:background .25s ease,color .25s ease,padding-left .3s var(--easeOut);
}
.nfCol a:hover{background:#F5F8FC;color:var(--navy);padding-left:14px}

@media(max-width:900px){.nfGrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){
  .nfGrid{grid-template-columns:1fr;gap:22px}
  .prose .dTable th{width:auto;white-space:normal}
}

/* --- footer legal row --- */
.footerLegal{
  display:flex;flex-wrap:wrap;gap:18px;align-items:center;
}
.footerLegal a{
  font-size:10px;color:#8b949e;letter-spacing:.03em;
  transition:color .2s ease;
}
.footerLegal a:hover{color:var(--orange)}
@media(max-width:700px){
  .bottom{flex-direction:column;align-items:flex-start;gap:12px}
}



/* AURA hero — replaces the standard pvHero on /services/agentic-ai/ */
.auraHero{position:relative;overflow:hidden;isolation:isolate;background:#02040A;color:#fff}
.auraSky{position:absolute;inset:0;z-index:0;pointer-events:none}
.auraSky>*{position:absolute;display:block}
.auraNeb{left:30%;top:-10%;width:82%;height:120%}
.auraSky .stars{left:0;top:0;width:1px;height:1px;border-radius:50%;opacity:.85}
.auraSky .bright{opacity:1;animation:auraTwinkle 7s ease-in-out infinite}
.auraSky .veil{inset:0;background:linear-gradient(90deg,rgba(2,4,10,.97) 0%,rgba(2,4,10,.82) 32%,rgba(2,4,10,.15) 58%,rgba(2,4,10,0) 100%)}
.auraInner{position:relative;z-index:1;max-width:1320px;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:48px;align-items:center;
  padding:clamp(48px,6vw,88px) clamp(24px,4vw,64px) clamp(40px,4vw,60px)}
.auraKicker{display:flex;align-items:center;gap:12px;font:700 11px/1.4 Manrope,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.62)}
.auraKicker:before{content:"";flex:0 0 28px;height:1px;background:var(--orange,#FF8A00)}
.auraHero h1{margin:26px 0 22px;font-family:Manrope,sans-serif;color:#fff}
.auraWord{display:block;font-weight:700;font-size:clamp(64px,8vw,120px);line-height:.9;letter-spacing:.03em;
  background:linear-gradient(180deg,#fff 35%,#AEB7C6 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.auraTag{display:block;margin-top:20px;max-width:15em;font-weight:600;font-size:clamp(22px,2.3vw,32px);line-height:1.22;letter-spacing:-.015em;color:rgba(255,255,255,.92)}
.auraTag em{font-style:normal;color:#FFB072}
.auraLede{font-size:17px;line-height:1.72;color:rgba(255,255,255,.72);max-width:540px;margin:0 0 28px}
.auraSteps{display:flex;flex-wrap:wrap;align-items:center;row-gap:10px;margin:0 0 34px;padding:0;list-style:none;font:600 13px/1 Manrope,sans-serif;color:rgba(255,255,255,.85)}
.auraSteps li{display:flex;align-items:center}
.auraSteps li+li:before{content:"";width:26px;height:1px;background:rgba(255,255,255,.26);margin:0 14px}
.auraSteps i{font-style:normal;font-size:10.5px;letter-spacing:.1em;color:#FF9D45;margin-right:8px}
.auraCtas{display:flex;flex-wrap:wrap;gap:12px}
.auraCtas a{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 22px;border-radius:10px;font:700 14px Manrope,sans-serif;text-decoration:none;transition:transform .25s ease,background .25s ease,border-color .25s ease}
.auraCtas a:hover{transform:translateY(-1px)}
.auraCtas .solid{background:linear-gradient(90deg,#B91C1C,#C2410C);color:#fff;box-shadow:0 10px 26px -14px rgba(194,65,12,.9)} /* white text >= 5.1:1 (WCAG AA) */
.auraCtas .ghost{color:#fff;border:1px solid rgba(255,255,255,.28)}
.auraCtas .ghost:hover{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.45)}
.auraCtas a:focus-visible{outline:2px solid #FF9D45;outline-offset:3px}
.auraViz{position:relative;width:100%;max-width:500px;aspect-ratio:1;justify-self:center}
.auraViz svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.auraLink{fill:none;stroke:rgba(255,255,255,.15);stroke-width:1;vector-effect:non-scaling-stroke}
.auraLink.chain{stroke:rgba(255,196,150,.38)}
.auraStar{fill:#fff}
.auraGlow{fill:url(#aStarGlow)}
.auraPulse{fill:#FFD2A6;filter:drop-shadow(0 0 3px #FF9A3D)}
.auraLabel{position:absolute;transform:translate(var(--tx,-50%),var(--ty,14px));white-space:nowrap;font:700 10.5px/1 Manrope,sans-serif;letter-spacing:.16em;
  text-transform:uppercase;color:rgba(255,255,255,.74);text-shadow:0 0 6px #02040A,0 0 2px #02040A}
.auraLabel.top{--ty:calc(-100% - 14px)}
.auraLabel.start{--tx:-6px}
.auraLabel.end{--tx:calc(-100% + 6px)}
.auraLabel.core{--ty:34px;font-size:11.5px;letter-spacing:.34em;color:#fff}
.auraStatsNote{grid-column:1/-1;margin:16px 0 -32px;font:700 10.5px/1.4 Manrope,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.auraStats{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid rgba(255,255,255,.12);border-bottom:1px solid rgba(255,255,255,.12)}
.auraStats div{padding:22px 24px 22px 0}
.auraStats div+div{padding-left:24px;border-left:1px solid rgba(255,255,255,.1)}
.auraStats b{display:block;font:700 30px/1 Manrope,sans-serif;color:#fff;margin-bottom:8px}
.auraStats small{display:block;font-size:12px;line-height:1.5;color:rgba(255,255,255,.62)}
@keyframes auraTwinkle{50%{opacity:.5}}
@media (max-width:1024px){.auraInner{grid-template-columns:minmax(0,1fr)}.auraViz{max-width:440px}
  .auraNeb{left:-30%;width:160%;top:auto;bottom:-4%;height:66%}
  .auraSky .veil{background:linear-gradient(180deg,rgba(2,4,10,.92) 0%,rgba(2,4,10,.6) 40%,rgba(2,4,10,.1) 100%)}
  .auraStats{grid-template-columns:repeat(2,minmax(0,1fr))}.auraStats div:nth-child(3){padding-left:0;border-left:0}
  .auraStats div:nth-child(n+3){border-top:1px solid rgba(255,255,255,.1)}}
@media (max-width:560px){.auraViz{max-width:340px}.auraLabel{font-size:9px;letter-spacing:.1em}.auraLabel.core{font-size:10px;letter-spacing:.28em}
  .auraCtas a{flex:1 1 100%}.auraStats{grid-template-columns:minmax(0,1fr)}
  .auraStats div,.auraStats div+div{padding-left:0;border-left:0}.auraStats div+div{border-top:1px solid rgba(255,255,255,.1)}}
@media (prefers-reduced-motion:reduce){.auraSky .bright{animation:none}.auraPulse{display:none}}


/* WCAG 2.1 AA: brand orange #FF8A00 is 2.3:1 on white, so orange TEXT on light sections uses deeper tones.
   #D96A00 >= 3.3:1 (large headings), #B45309 >= 4.8:1 (small labels). Decorative orange and dark sections unchanged. */
#products .sectionHead h2 em,#partners .sectionHead h2 em,#industries .sectionHead h2 em,#approach .sectionHead h2 em,
.globalCopy h2 em,.contactBox h2 em{color:#D96A00 !important}
.missionCell h3,.process-node span,.location small,.contactItem small{color:#B45309 !important}
#contact .tag{color:#5F6975 !important}

/* SEO layout safeguards and semantic card links. */
img{max-width:100%}
.cardTitleLink:focus-visible{outline:3px solid var(--orange);outline-offset:5px}
.service,.product,.industry{position:relative}
.cardTitleLink:after{content:"";position:absolute;inset:0;z-index:2}
.no-js .dRise,.no-js .reveal,.no-js .stagger>*,.no-js .section-visual,.no-js #approach .process-step{opacity:1!important;transform:none!important}
.no-js .dRise,.no-js .reveal,.no-js .stagger>*,.reveal-fallback .reveal,.reveal-fallback .stagger>*{filter:none!important}
.no-js .hero3d{display:none}
.missionLabel{font:800 12px Manrope;letter-spacing:.12em}
@media(max-width:900px){.no-js .nav{position:relative;height:auto;min-height:82px;flex-wrap:wrap}.no-js .navlinks{display:flex;position:static;flex-wrap:wrap;width:100%;gap:16px;padding:16px;background:#fff}.no-js #menu{display:none}.no-js .pv{padding-top:0}}