/* Codex visual layer: service-specific line art, subtle backgrounds and scroll-linked motion. */
:root{--visual-blue:#075cc4;--visual-ink:#132c4b;--visual-paper:#f4f8fd}
/* Show the supplied Codex mark and wordmark without the slogan printed beneath it. */
.brand img,.footer-brand img,.page-brand img,.footer-logo img,.logo-panel img,.story-logo{clip-path:inset(0 0 9.3% 0)}
.brand-copy small,.page-brand small,.footer-brand small,.footer-logo small{font-size:8px;letter-spacing:.2em;color:#68788d}
/* A faint technical pattern gives each large background a little depth without competing with text. */
.hero,.page-hero{background-image:url('codex-tech-pattern.svg'),radial-gradient(ellipse at 86% 25%,#eaf3ff 0,transparent 36%),linear-gradient(120deg,#fff 45%,#f7faff);background-repeat:repeat,no-repeat,no-repeat;background-size:320px 320px,auto,auto}
.section.wash{background-image:url('codex-tech-pattern.svg'),linear-gradient(145deg,#f5f8fc,#f9fbfe);background-repeat:repeat,no-repeat;background-size:320px 320px,cover}
.story-visual{background-image:url('codex-tech-pattern.svg'),linear-gradient(145deg,#eaf3ff,#f7faff);background-size:300px,cover}
/* Animated logo: a restrained rise/fall, with a rotating orbit in the hero lockup. */
.brand img,.page-brand img,.footer-brand img,.footer-logo img{animation:codex-logo-drift 6s ease-in-out infinite;transform-origin:center}
.logo-panel{isolation:isolate}.logo-panel:after{content:"";position:absolute;inset:11%;border:1px solid #075cc422;border-radius:50%;z-index:-1;animation:codex-orbit 18s linear infinite}.logo-panel:before{content:"";position:absolute;inset:5%;border:1px dashed #075cc41b;border-radius:50%;z-index:-1;animation:codex-orbit 26s linear infinite reverse}.logo-panel img{animation:codex-logo-drift 4.8s ease-in-out infinite}
@keyframes codex-logo-drift{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes codex-orbit{to{transform:rotate(360deg)}}
/* Scroll-following Codex chevrons move down and back up with the reader. */
.scroll-motif{position:fixed;z-index:8;right:1.2vw;top:46vh;width:clamp(70px,11vw,150px);height:clamp(70px,11vw,150px);color:#075cc4;opacity:.105;pointer-events:none;transform:translate3d(0,var(--scroll-shift,0px),0) rotate(var(--scroll-angle,0deg));transition:transform .12s linear;mix-blend-mode:multiply}.scroll-motif svg{width:100%;height:100%;overflow:visible;animation:motif-breathe 5.5s ease-in-out infinite}@keyframes motif-breathe{0%,100%{scale:1}50%{scale:1.045}}body[dir=rtl] .scroll-motif{right:auto;left:1.2vw;transform:translate3d(0,var(--scroll-shift,0px),0) rotate(calc(var(--scroll-angle,0deg) * -1))}
/* Each homepage service gets its own tinted illustration in the card background. */
.service{--service-accent:#075cc4;--service-tint:#f5f9ff;position:relative;isolation:isolate;background-image:url('codex-tech-pattern.svg'),radial-gradient(circle at 100% 100%,var(--service-tint),transparent 54%),linear-gradient(135deg,#fff,#fcfdff);background-size:240px,auto,cover;border-color:#e1e8f1}
.service:nth-child(2){--service-accent:#147b83;--service-tint:#effaf8}.service:nth-child(3){--service-accent:#8051b4;--service-tint:#f7f1ff}.service:nth-child(4){--service-accent:#b26720;--service-tint:#fff7ec}.service:nth-child(5){--service-accent:#3e5caf;--service-tint:#f0f3ff}.service:nth-child(6){--service-accent:#16815b;--service-tint:#eff9f3}
.service-icon{position:relative;width:50px;height:50px;border:1px solid color-mix(in srgb,var(--service-accent) 18%,white);border-radius:16px;background:linear-gradient(145deg,#fff,var(--service-tint));color:var(--service-accent);box-shadow:0 7px 22px color-mix(in srgb,var(--service-accent) 9%,transparent);z-index:2}.service-icon:after{content:"";position:absolute;inset:-5px;border:1px dashed color-mix(in srgb,var(--service-accent) 22%,transparent);border-radius:20px;pointer-events:none}.service-watermark{position:absolute;right:-18px;bottom:-24px;width:148px;height:148px;color:var(--service-accent);opacity:.105;z-index:0;pointer-events:none;transform:rotate(-8deg);transition:transform .4s,opacity .4s}.service-watermark svg{width:100%;height:100%}.service:hover .service-watermark{opacity:.17;transform:rotate(0) scale(1.06)}.service>*:not(.service-watermark){position:relative;z-index:1}body[dir=rtl] .service-watermark{right:auto;left:-18px;transform:rotate(8deg)}body[dir=rtl] .service:hover .service-watermark{transform:rotate(0) scale(1.06)}
/* Large, service-specific line drawings in the individual detail-page backgrounds. */
.page-watermark{position:absolute;right:clamp(20px,8vw,130px);top:18%;width:clamp(150px,26vw,330px);height:clamp(150px,26vw,330px);color:var(--page-accent,#075cc4);opacity:.105;pointer-events:none;z-index:0}.page-watermark svg{width:100%;height:100%;animation:watermark-drift 9s ease-in-out infinite}.page-hero .container>*:not(.page-watermark){position:relative;z-index:1}.page-hero{isolation:isolate}.page-hero:after{z-index:0;border-color:#075cc426}.service-page{--page-accent:#075cc4;--page-glow:#eaf3ff}.service-page .page-hero{background-image:url('codex-tech-pattern.svg'),radial-gradient(circle at 84% 27%,var(--page-glow),transparent 34%),linear-gradient(115deg,#fff,#f8fbff)}.service-data{--page-accent:#075cc4;--page-glow:#e5f0ff}.service-it{--page-accent:#147b83;--page-glow:#e5f7f4}.service-marketing{--page-accent:#8051b4;--page-glow:#f2eaff}.service-employment{--page-accent:#b26720;--page-glow:#fff1de}.service-business{--page-accent:#3e5caf;--page-glow:#e9edff}.service-financial{--page-accent:#16815b;--page-glow:#e7f5ec}
@keyframes watermark-drift{0%,100%{transform:translateY(0) rotate(-5deg)}50%{transform:translateY(-13px) rotate(3deg)}}.detail-card{position:relative;overflow:hidden;background-image:url('codex-tech-pattern.svg'),linear-gradient(145deg,#fff,#fbfdff);background-size:210px,cover}.detail-card:after{content:"";position:absolute;width:96px;height:96px;right:-60px;bottom:-60px;border:1px solid color-mix(in srgb,var(--page-accent,#075cc4) 20%,transparent);border-radius:50%;pointer-events:none}.detail-icon{width:48px;height:48px;position:relative;border-radius:16px;background:linear-gradient(140deg,#fff,var(--page-glow,#eaf3ff));color:var(--page-accent,#075cc4);border:1px solid color-mix(in srgb,var(--page-accent,#075cc4) 15%,white)}.detail-icon svg{width:24px;height:24px}.process-step .number{display:inline-flex;align-items:center;gap:8px}.process-step .number:after{content:"";width:40px;border-top:1px dashed color-mix(in srgb,var(--page-accent,#075cc4) 40%,transparent)}
/* The online-system cards carry their own category illustration in the background. */
.system-card{background-image:url('codex-tech-pattern.svg'),linear-gradient(140deg,#fff,var(--tile-bg,#f6f9ff));background-size:230px,cover}.sys-icon{position:relative;background:linear-gradient(145deg,#fff,var(--tile-bg,#edf4ff));border:1px solid color-mix(in srgb,var(--tile-color,#075cc4) 22%,white);color:var(--tile-color,#075cc4)}.sys-icon:after{content:"";position:absolute;inset:-5px;border:1px dashed color-mix(in srgb,var(--tile-color,#075cc4) 24%,transparent);border-radius:50%}.system-card:after{opacity:.32}
/* Fine decorations remain behind body copy on every page. */
.section.wash,.section:not(.wash),.page-section{position:relative;isolation:isolate}.section.wash>.container,.section:not(.wash)>.container,.page-section>.container{position:relative;z-index:1}.section:not(.wash){background-image:url('codex-tech-pattern.svg');background-repeat:repeat;background-size:360px 360px}.industry-note{background-image:url('codex-tech-pattern.svg'),linear-gradient(135deg,#10213b,#143761);background-size:240px,cover}.cta-band{background-image:url('codex-tech-pattern.svg'),linear-gradient(115deg,#075cc4,#073c91);background-size:260px,cover}
@media(max-width:680px){.scroll-motif{width:70px;height:70px;right:-8px;opacity:.08}.page-watermark{right:6vw;top:16%;width:130px;height:130px;opacity:.075}.service-watermark{width:118px;height:118px}}
@media(prefers-reduced-motion:reduce){.brand img,.page-brand img,.footer-brand img,.footer-logo img,.logo-panel img,.logo-panel:before,.logo-panel:after,.page-watermark svg,.scroll-motif svg{animation:none!important}.scroll-motif{transition:none!important}}

/* A vivid, photographic hero with several independently floating capability cards. */
.hero-art{min-height:450px;perspective:1100px;transform-style:preserve-3d;animation:hero-art-arrive 1s .1s cubic-bezier(.2,.8,.2,1) both}
.logo-panel{width:min(430px,92%);aspect-ratio:1.16/1;overflow:hidden;border-radius:30px;transform-origin:center;animation:hero-photo-float 7s ease-in-out infinite;box-shadow:0 32px 90px #102d5440}
.logo-panel .hero-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 47%;clip-path:none;border-radius:inherit;filter:saturate(.93) contrast(1.02);animation:hero-photo-zoom 18s ease-in-out infinite alternate;transform-origin:center}
.hero-brand-chip{position:absolute;z-index:3;left:15px;bottom:15px;display:flex;gap:9px;align-items:center;background:#ffffffed;border:1px solid #ffffffc9;border-radius:14px;padding:7px 12px;box-shadow:0 10px 30px #0a244b33;backdrop-filter:blur(10px);font:800 10px Manrope,sans-serif;letter-spacing:.08em;color:#172741}
.hero-brand-chip img{width:30px;height:34px;object-fit:contain;clip-path:inset(0 0 9.3% 0);animation:none!important}
.hero-brand-chip small{display:block;font:700 8px 'DM Sans',sans-serif;letter-spacing:.2em;color:#68788d;margin-top:3px}
.photo-credit{position:absolute;z-index:3;right:12px;bottom:12px;padding:5px 8px;border-radius:8px;background:#10213ba6;color:#fff!important;font-size:8px!important;letter-spacing:.02em;backdrop-filter:blur(8px)}
.hero-art .float-card{z-index:4;min-width:152px;max-width:190px;border-radius:15px;padding:13px 15px;animation:hero-card-drift 5.4s ease-in-out infinite;will-change:transform;box-shadow:0 18px 48px #0c2a5126}
.hero-art .float-card b{font-size:12px}.hero-art .float-card>span:last-child{font-size:10px}
.hero-art .fc1{top:7%;left:-1%;animation-delay:-.5s}.hero-art .fc2{bottom:8%;right:-1%;animation-delay:-2.1s}
.hero-art .fc3{top:8%;right:0%;animation-delay:-3.2s}.hero-art .fc4{bottom:7%;left:0%;animation-delay:-1.4s}
.hero-art .fc-icon{width:29px;height:29px;border-radius:10px;animation:icon-pop 3.8s ease-in-out infinite}
@keyframes hero-art-arrive{from{opacity:0;transform:translateY(26px) rotateX(5deg) scale(.96)}to{opacity:1;transform:translateY(0) rotateX(0) scale(1)}}
@keyframes hero-photo-float{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-9px) rotate(1deg)}}
@keyframes hero-photo-zoom{from{transform:scale(1)}to{transform:scale(1.075)}}
@keyframes hero-card-drift{0%,100%{transform:translate3d(0,0,0) rotate(-1deg)}50%{transform:translate3d(0,-13px,0) rotate(1deg)}}
@keyframes icon-pop{0%,100%{transform:scale(1)}50%{transform:scale(1.09) rotate(-7deg)}}
/* More noticeable reveal motion as each section enters the viewport. */
.reveal{opacity:0;filter:blur(5px);transform:translateY(34px) scale(.975);transition:opacity .85s ease,filter .85s ease,transform .85s cubic-bezier(.18,.72,.2,1)}
.reveal.is-visible{opacity:1;filter:blur(0);transform:translateY(0) scale(1)}
.service.reveal:nth-child(3n+2),.hero-art .fc3{transition-delay:.1s;animation-delay:-3.2s}
.service.reveal:nth-child(3n),.hero-art .fc4{transition-delay:.2s}
.hero-art .fc2{transition-delay:.3s}
.scroll-motif{opacity:.15}
.email-contact-link{display:flex;align-items:center;justify-content:center;gap:4px;margin-top:12px;padding:11px 14px;border:1px solid #dbe7f5;border-radius:12px;background:linear-gradient(135deg,#fbfdff,#f1f7ff);color:#0755b5;font-size:11px;transition:transform .25s,box-shadow .25s,border-color .25s}
.email-contact-link:hover{transform:translateY(-2px);border-color:#a9c8ef;box-shadow:0 10px 28px #0e3b7515}.email-contact-link b{font-weight:800}
@media(max-width:900px){.hero-art{min-height:400px}.logo-panel{width:min(390px,90%)}}
@media(max-width:680px){.hero-art{min-height:350px}.logo-panel{width:min(310px,88%);aspect-ratio:1.05/1;border-radius:25px}.hero-art .float-card{min-width:130px;max-width:156px;padding:10px 11px}.hero-art .float-card b{font-size:10px}.hero-art .float-card>span:last-child{font-size:9px}.hero-art .fc1{left:-2%;top:0}.hero-art .fc2{right:-2%;bottom:0}.hero-art .fc3{top:0;right:-3%}.hero-art .fc4{left:-2%;bottom:0}.photo-credit{font-size:7px!important;right:8px;bottom:8px}.hero-brand-chip{left:9px;bottom:9px;padding:5px 8px}.hero-brand-chip img{width:25px;height:29px}body[dir=rtl] .hero-brand-chip{left:auto;right:9px}body[dir=rtl] .photo-credit{right:auto;left:8px}}
@media(prefers-reduced-motion:reduce){.hero-art,.logo-panel,.logo-panel .hero-photo,.hero-art .float-card,.hero-art .fc-icon{animation:none!important}.reveal{opacity:1;filter:none;transform:none;transition:none}.scroll-motif{opacity:.08}}

/* Distinct editorial photography for each service detail page. */
.page-hero .container{position:relative;padding-right:clamp(330px,39%,410px)}
.service-hero-photo{position:absolute;right:0;top:122px;width:clamp(290px,35%,390px);height:255px;margin:0;overflow:hidden;border-radius:24px;border:1px solid #ffffffc7;box-shadow:0 28px 70px #0d2c5226;isolation:isolate;z-index:2;animation:service-photo-enter .8s .15s both cubic-bezier(.2,.8,.2,1)}
.service-hero-photo:before{content:"";position:absolute;inset:0;background:linear-gradient(145deg,#075cc43b,transparent 45%,#0e25413a);z-index:1;pointer-events:none}
.service-hero-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .9s cubic-bezier(.2,.7,.2,1),filter .5s;filter:saturate(.92)}
.service-hero-photo:hover img{transform:scale(1.065);filter:saturate(1.08)}
.service-hero-photo figcaption{position:absolute;z-index:2;bottom:10px;right:10px;padding:5px 9px;border-radius:999px;background:#10213bbd;color:#fff;font-size:9px;line-height:1.4;backdrop-filter:blur(8px)}
body[dir=rtl] .page-hero .container{padding-right:0;padding-left:clamp(330px,39%,410px)}
body[dir=rtl] .service-hero-photo{right:auto;left:0}
@keyframes service-photo-enter{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:760px){.page-hero .container,body[dir=rtl] .page-hero .container{padding-right:0;padding-left:0}.service-hero-photo{position:relative;right:auto;left:auto;top:auto;width:100%;height:clamp(190px,55vw,270px);margin:24px 0 0;border-radius:20px}}
@media(prefers-reduced-motion:reduce){.service-hero-photo{animation:none}.service-hero-photo img{transition:none}}

.skip-link{position:absolute;top:-100px;left:16px;z-index:1000;padding:12px 16px;background:#10213b;color:#fff;border-radius:10px}.skip-link:focus{top:12px}

.lang,.language{display:inline-flex;align-items:center;text-decoration:none;cursor:pointer}html[dir="rtl"] .skip-link{left:auto;right:16px}