
:root{
  --bg:#050b14;--bg-2:#081321;--panel:#0b192b;--panel-2:#10243c;
  --text:#f5f8fc;--soft:#d8e4ef;--muted:#91a5bb;--line:#243c5a;
  --accent:#35d4f1;--accent-2:#8c70ff;--success:#43d9ac;
  --max:1540px;--radius:18px;--radius-sm:12px;
  --shadow:0 28px 70px rgba(0,0,0,.36);
  --type-body-sm:.82rem;--type-support:.76rem;--type-label:.70rem;
  --space-1:8px;--space-2:12px;--space-3:18px;--space-4:24px;--space-5:36px;--space-6:56px;--space-7:84px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:82px}
body{margin:0;min-height:100vh;color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.55;background:radial-gradient(circle at 82% -4%,rgba(40,83,150,.56),transparent 30%),linear-gradient(180deg,#06101d 0%,#071321 57%,#040a12 100%);overflow-x:hidden}
a{color:inherit;text-decoration:none}a:hover{color:var(--accent)}button{font:inherit}img,svg{display:block;max-width:100%}
.container{width:min(var(--max),100%);margin:auto;padding-left:24px;padding-right:24px}
.page-progress{position:fixed;top:0;left:0;z-index:9999;height:3px;width:0;background:linear-gradient(90deg,var(--accent),var(--accent-2));box-shadow:0 0 18px rgba(53,212,241,.58);pointer-events:none}
html[data-theme="dark"] .page-progress{height:4px;background:linear-gradient(90deg,#64efff 0%,#35d4f1 46%,#a48cff 100%);box-shadow:0 0 8px rgba(100,239,255,.95),0 0 20px rgba(53,212,241,.72)}
.ambient{position:fixed;z-index:-2;width:46vw;height:46vw;min-width:420px;min-height:420px;border-radius:50%;filter:blur(110px);opacity:.15;pointer-events:none}
.ambient-a{top:-12vh;right:-16vw;background:radial-gradient(circle,rgba(53,212,241,.8),transparent 68%)}
.ambient-b{bottom:-22vh;left:-15vw;background:radial-gradient(circle,rgba(140,112,255,.75),transparent 68%)}
.site-header{
  position:sticky;
  top:12px;
  z-index:100;
  width:min(var(--max),calc(100% - 32px));
  margin:12px auto 0;
  border:1px solid rgba(36,60,90,.82);
  border-radius:17px;
  background:rgba(5,11,20,.86);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  box-shadow:0 10px 30px rgba(0,0,0,.16);
  transition:background .2s ease,border-color .2s ease,box-shadow .2s ease
}
.site-header.is-scrolled{background:rgba(5,11,20,.97);border-color:rgba(53,212,241,.22);box-shadow:0 16px 38px rgba(0,0,0,.28)}
.nav-row{min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{font-weight:900;letter-spacing:-.03em;font-size:1rem}
.nav-links{display:flex;gap:24px}.nav-links a{position:relative;color:var(--soft);font-size:.85rem;font-weight:700}.nav-links a:after{content:"";position:absolute;left:0;right:0;bottom:-10px;height:2px;background:linear-gradient(90deg,var(--accent),var(--accent-2));transform:scaleX(0);transition:transform .22s ease}.nav-links a:hover:after,.nav-links a.active:after{transform:scaleX(1)}
.eyebrow,.section-label{color:var(--accent);text-transform:uppercase;letter-spacing:.12em;font-size:.7rem;font-weight:900}
.section-heading h2{letter-spacing:-.055em}
.hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}.button{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:12px 20px;border:1px solid transparent;border-radius:11px;background:linear-gradient(90deg,var(--accent),#4ba8ff);color:#041019;font-size:.86rem;font-weight:850;transition:transform .2s ease,box-shadow .2s ease}.button.secondary{border-color:var(--line);background:rgba(8,19,33,.55);color:var(--text)}.button:after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 18%,rgba(255,255,255,.38) 45%,transparent 72%);transform:translateX(-125%);transition:transform .55s ease}.button:hover{transform:translateY(-2px);box-shadow:0 16px 30px rgba(0,0,0,.28)}.button:hover:after{transform:translateX(125%)}
.section{padding:76px 0}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:28px}.section-heading h2{margin:7px 0 0;font-size:clamp(2.1rem,4vw,3.2rem);line-height:1}.section-heading p{max-width:500px;margin:0;color:var(--muted)}
.reveal{opacity:0;transform:translateY(16px);transition:opacity .5s ease var(--delay,0ms),transform .5s cubic-bezier(.22,1,.36,1) var(--delay,0ms)}.reveal.visible{opacity:1;transform:none}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
@media(max-width:760px){
  .site-header{top:8px;width:calc(100% - 16px);margin-top:8px;border-radius:14px}
  .nav-row{min-height:0;display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px 14px;padding-top:10px;padding-bottom:10px}
  .nav-positioning{grid-column:1;grid-row:1}
  .nav-social{grid-column:2;grid-row:1}
  .nav-links{grid-column:1/-1;grid-row:2;width:100%;justify-content:space-between;gap:12px}
  .section-heading{align-items:flex-start;flex-direction:column}
}
@media(max-width:520px){.container{padding-left:18px;padding-right:18px}.nav-links a{font-size:.72rem}}
@media(pointer:coarse){.ambient{opacity:.09}.button:hover{transform:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}.ambient{display:none}}


.solution-heading-v3{margin-top:24px}
.solution-grid-v3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.solution-card-v3{--project:var(--accent);--mx:50%;--my:50%;position:relative;isolation:isolate;overflow:hidden;min-height:390px;display:flex;flex-direction:column;padding:22px;border:1px solid var(--line);border-radius:17px;background:radial-gradient(circle at 90% 8%,color-mix(in srgb,var(--project) 15%,transparent),transparent 34%),linear-gradient(145deg,#0e1e33,#081321);opacity:1!important;transform:none!important;transition:transform .25s cubic-bezier(.22,1,.36,1),border-color .22s ease,box-shadow .22s ease}
.solution-card-v3::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(340px circle at var(--mx) var(--my),color-mix(in srgb,var(--project) 18%,transparent),transparent 68%);opacity:0;transition:opacity .22s ease}
.solution-card-v3:hover{transform:translateY(-8px)!important;border-color:var(--project);box-shadow:0 30px 62px rgba(0,0,0,.36),0 0 0 1px color-mix(in srgb,var(--project) 17%,transparent)}
.solution-card-v3:hover::before{opacity:1}
.solution-meta-v3{display:flex;justify-content:space-between;color:var(--project);font-size:.64rem;font-weight:850;text-transform:uppercase;letter-spacing:.09em}
.solution-card-v3 h3{margin:19px 0 18px;font-size:1.24rem;letter-spacing:-.025em}
.solution-outcome-v3{padding:13px;border-left:2px solid var(--project);background:rgba(8,19,33,.72)}
.solution-outcome-v3 span{display:block;color:var(--project);font-size:.63rem;font-weight:850;text-transform:uppercase;letter-spacing:.08em}
.solution-outcome-v3 strong{display:block;margin-top:5px;color:var(--soft);font-size:.78rem;line-height:1.4}
.solution-card-v3>a{width:max-content;margin-top:auto;padding-top:18px;color:var(--project);font-size:.76rem;font-weight:800}
[hidden]{display:none!important}
@media(max-width:1080px){.solution-grid-v3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:720px){.solution-grid-v3{grid-template-columns:1fr}}

#foundation{padding-top:64px}

.solution-card-v3{
  min-height:340px;
  transition:
    transform .28s cubic-bezier(.22,1,.36,1),
    border-color .24s ease,
    box-shadow .24s ease;
}
.solution-icon-v3{
  width:54px;
  height:54px;
  display:grid;
  place-items:center;
  margin-top:18px;
  border:1px solid color-mix(in srgb,var(--project) 55%,var(--line));
  border-radius:15px;
  background:color-mix(in srgb,var(--project) 7%,#081321);
  color:var(--project);
  font-size:1.55rem;
  font-weight:900;
  transition:transform .28s ease,box-shadow .28s ease;
}
.solution-card-v3:hover .solution-icon-v3{
  transform:translateY(-4px) rotate(-3deg) scale(1.07);
  box-shadow:0 0 24px color-mix(in srgb,var(--project) 18%,transparent);
}
.solution-card-v3 h3{
  min-height:58px;
  margin-top:16px;
}
.solution-card-v3>a{
  position:relative;
}
.solution-card-v3>a::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-4px;
  width:100%;
  height:1px;
  background:var(--project);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .22s ease;
}
.solution-card-v3:hover>a::after{transform:scaleX(1)}

.recruiter-cta{
  display:grid;
  grid-template-columns:1.25fr .75fr;
  gap:30px;
  align-items:center;
  padding:30px;
  border:1px solid var(--line);
  border-radius:22px;
  background:
    radial-gradient(circle at 90% 10%,rgba(53,212,241,.12),transparent 34%),
    linear-gradient(145deg,rgba(15,29,49,.98),rgba(8,19,33,.98));
  box-shadow:0 24px 54px rgba(0,0,0,.24);
}
.recruiter-cta h2{
  max-width:760px;
  margin:10px 0 10px;
  font-size:clamp(2rem,3.7vw,3rem);
  line-height:1;
  letter-spacing:-.045em;
}
.recruiter-cta p{
  max-width:760px;
  margin:0;
  color:var(--muted);
}
.recruiter-cta .hero-actions{
  justify-content:flex-end;
  margin-top:0;
}

@media(max-width:1000px){
  .recruiter-cta{grid-template-columns:1fr}
  .recruiter-cta .hero-actions{justify-content:flex-start}
}
@media(max-width:650px){
  .recruiter-cta{padding:22px}
}


/* Shared identity + compact CTA typography */
:root{--identity-weight:300}
.heroX-intro h1{font-weight:var(--identity-weight)!important}
.recruiter-cta{
  grid-template-columns:1.35fr .65fr;
  gap:22px;
  padding:22px 28px;
  border-radius:17px;
}
.recruiter-cta h2.eyebrow{
  max-width:760px;
  margin:0;
  color:var(--accent);
  font-size:.9rem!important;
  font-weight:700!important;
  line-height:1.35!important;
  letter-spacing:.06em!important;
  text-transform:uppercase!important;
}
.recruiter-cta p{
  max-width:760px;
  margin:8px 0 0;
  color:var(--muted);
  font-size:var(--type-body-sm);
  font-weight:400;
  line-height:1.58;
  letter-spacing:0;
  text-transform:none;
}
.recruiter-cta .hero-actions{gap:14px}
@media(max-width:1000px){
  .recruiter-cta{grid-template-columns:1fr}
}

/* Page transitions */
.pt-overlay{position:fixed;inset:0;background:#030914;opacity:0;pointer-events:none;z-index:9999;transition:opacity .34s ease}
.pt-overlay.pt-show{opacity:1;pointer-events:all}

/* Solution page nav — three floating circles */
.cpn-prev-btn,.cpn-next-btn{position:fixed;top:50%;transform:translateY(-50%);width:52px;height:52px;border-radius:50%;border:1px solid rgba(255,255,255,.16);background:rgba(3,9,20,.88);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:rgba(255,255,255,.5);display:flex;align-items:center;justify-content:center;gap:6px;font-size:22px;text-decoration:none;z-index:8000;overflow:hidden;white-space:nowrap;transition:width .45s cubic-bezier(.4,0,.2,1),border-radius .45s,border-color .18s,color .18s,background .18s,padding .45s;box-shadow:0 4px 20px rgba(0,0,0,.4)}
.cpn-prev-btn{left:16px}
.cpn-next-btn{right:16px}
.cpn-prev-btn:hover,.cpn-next-btn:hover{border-color:rgba(53,212,241,.55);color:#35d4f1;background:rgba(3,9,20,.97)}
.cpn-close-btn{position:fixed;top:82px;right:20px;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.15);background:rgba(3,9,20,.88);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:rgba(255,255,255,.45);display:flex;align-items:center;justify-content:center;font-size:17px;text-decoration:none;z-index:8000;transition:border-color .18s,color .18s,background .18s;box-shadow:0 4px 20px rgba(0,0,0,.4)}
.cpn-close-btn:hover{border-color:rgba(53,212,241,.55);color:#35d4f1;background:rgba(3,9,20,.97)}
.cpn-hint-lbl{opacity:0;max-width:0;overflow:hidden;font-size:11px;color:#35d4f1;transition:opacity .25s,max-width .35s cubic-bezier(.4,0,.2,1);flex-shrink:0;pointer-events:none}
@keyframes cpn-pulse{0%{box-shadow:0 4px 20px rgba(0,0,0,.4),0 0 0 0 rgba(53,212,241,.65)}100%{box-shadow:0 4px 20px rgba(0,0,0,.4),0 0 0 16px rgba(53,212,241,0)}}
@keyframes cpn-pulse-light{0%{box-shadow:0 4px 20px rgba(13,31,53,.14),0 0 0 0 rgba(8,145,178,.5)}100%{box-shadow:0 4px 20px rgba(13,31,53,.14),0 0 0 16px rgba(8,145,178,0)}}
.cpn-pulsing{animation:cpn-pulse 1.1s ease infinite}
html[data-theme="light"] .cpn-pulsing{animation:cpn-pulse-light 1.1s ease infinite}

/* Nav social button: scale + tooltip on hover */
.nav-soc-btn{position:relative}
@media(pointer:fine){
  a.nav-soc-btn,button.nav-soc-btn{transition:border-color .18s,color .18s,transform .18s}
  a.nav-soc-btn:hover,button.nav-soc-btn:hover{transform:scale(1.18)}
  .nav-soc-btn::after{content:attr(aria-label);position:absolute;top:calc(100% + 9px);left:50%;transform:translateX(-50%) translateY(-4px);background:rgba(3,9,20,.93);border:1px solid rgba(255,255,255,.1);color:#f5f8fc;font-size:10px;font-weight:700;padding:4px 9px;border-radius:6px;white-space:nowrap;pointer-events:none;opacity:0;z-index:9999;letter-spacing:.04em;transition:opacity .18s,transform .18s}
  .nav-soc-btn:hover::after{opacity:1;transform:translateX(-50%) translateY(0)}
  html[data-theme="light"] .nav-soc-btn::after{background:rgba(13,31,53,.92);border-color:rgba(0,0,0,.1)}
}

/* Solution card CTA — consistent hover reveal */
.solution-card-v3:hover .card-cta{opacity:1}

/* Floating theme pill button */

/* ── Light theme ─────────────────────────────────────── */
html[data-theme="light"]{
  --bg:#f0f5fb;--bg-2:#e8f0f8;--panel:#ffffff;--panel-2:#f4f8fd;
  --text:#0d1f35;--soft:#2a4060;--muted:#607898;--line:#c0d5e8;
  --accent:#0891b2;--accent-2:#6c50e0;--success:#16a87a;
  --shadow:0 28px 70px rgba(13,31,53,.10);
  --case-panel:rgba(255,255,255,.95);
  --case-border:rgba(13,31,53,.16);
}
html[data-theme="light"] body{background:radial-gradient(circle at 82% -4%,rgba(150,200,240,.35),transparent 30%),linear-gradient(180deg,#f0f5fb 0%,#e8f0f8 57%,#f2f7fc 100%)}
html[data-theme="light"] .site-header{background:rgba(240,245,251,.9);border-color:rgba(192,213,232,.82);box-shadow:0 10px 30px rgba(13,31,53,.07)}
html[data-theme="light"] .site-header.is-scrolled{background:rgba(240,245,251,.98);box-shadow:0 16px 38px rgba(13,31,53,.10);border-color:rgba(10,176,204,.24)}
html[data-theme="light"] .ambient-a{background:radial-gradient(circle,rgba(10,176,204,.5),transparent 68%);opacity:.25}
html[data-theme="light"] .ambient-b{background:radial-gradient(circle,rgba(108,80,224,.5),transparent 68%);opacity:.18}
html[data-theme="light"] .solution-card-v3{background:radial-gradient(circle at 90% 8%,color-mix(in srgb,var(--project) 8%,transparent),transparent 34%),linear-gradient(145deg,#ffffff,#f4f8fd)}
html[data-theme="light"] .solution-outcome-v3{background:rgba(244,248,253,.85)}
html[data-theme="light"] .recruiter-cta{background:radial-gradient(circle at 90% 10%,rgba(10,176,204,.08),transparent 34%),linear-gradient(145deg,rgba(255,255,255,.98),rgba(244,248,253,.98))}
html[data-theme="light"] .button.secondary{background:rgba(244,248,253,.85)}
html[data-theme="light"] .pt-overlay{background:#f0f5fb}
html[data-theme="light"] .sp-click-cue{color:#0891b2;opacity:.85}
/* Card CTA overlay on light cards */
html[data-theme="light"] .card-cta{background:rgba(240,245,251,.93);border-top-color:var(--project)}
html[data-theme="light"] .section-heading .sp-disc{color:#607898}
html[data-theme="light"] .nav-soc-btn{border-color:rgba(192,213,232,.8);color:#607898}
html[data-theme="light"] .nav-soc-btn:hover{border-color:color-mix(in srgb,#0ab0cc 55%,transparent);color:#0ab0cc}
/* Solution page nav circles */
html[data-theme="light"] .cpn-prev-btn,html[data-theme="light"] .cpn-next-btn,html[data-theme="light"] .cpn-close-btn{background:rgba(255,255,255,.97);border-color:rgba(8,145,178,.35);color:rgba(8,145,178,.85);box-shadow:0 4px 20px rgba(13,31,53,.14)}
html[data-theme="light"] .cpn-prev-btn:hover,html[data-theme="light"] .cpn-next-btn:hover,html[data-theme="light"] .cpn-close-btn:hover{border-color:rgba(8,145,178,.65);color:#0891b2;background:rgba(255,255,255,1);box-shadow:0 6px 24px rgba(13,31,53,.18)}
html[data-theme="light"] .cpn-hint-lbl{color:#0ab0cc}
html[data-theme="light"] .glass-panel{background:linear-gradient(145deg,#ffffff,#f4f8fd);border-color:rgba(13,31,53,.12);box-shadow:0 20px 48px rgba(13,31,53,.06),inset 0 1px 0 rgba(255,255,255,.8)}
html[data-theme="light"] .glass-panel:hover{border-color:rgba(10,176,204,.55)}
html[data-theme="light"] .glance-item strong{color:#0d1f35}
html[data-theme="light"] .section-intro p{color:#607898}


/* Shared across sub-pages */
html[data-theme="light"] .page-lead{color:#607898}
html[data-theme="light"] .cta-copy p{color:#2a4060}

/* Shared light-mode heading used by Contact and any sub-page panel heading. */
html[data-theme="light"] .panel-heading{color:#0891b2}

.sol-two-col{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px}
.sol-two-col-wide{display:grid;grid-template-columns:1.1fr 0.9fr;gap:20px;margin-bottom:20px}
.sol-col-label{font-size:.65rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
@media(max-width:820px){.sol-two-col,.sol-two-col-wide{grid-template-columns:1fr}}

/* Experience compact career grid */
.career-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:4px}
.career-item{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-sm);padding:14px 16px}
.career-item-top{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:4px}
.career-role{font-size:.8rem;font-weight:700;color:var(--text)}
.career-date{font-size:.67rem;color:var(--muted);white-space:nowrap;flex-shrink:0}
.career-org{font-size:.7rem;color:var(--muted);margin-bottom:6px}
.career-desc{font-size:.72rem;color:var(--soft);line-height:1.5}
.career-tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.career-tag{font-size:.62rem;font-weight:600;letter-spacing:.04em;padding:2px 7px;border:1px solid var(--line);border-radius:20px;color:var(--muted)}
@media(max-width:768px){.career-grid{grid-template-columns:1fr}}

/* === UI CONSISTENCY PASS — shared typography + solution-card CTA safety === */
/* Keep the global site typography authoritative on detailed solution pages. */
html body{
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:16px;
}
body .p3-content .hero h1{
  font-size:clamp(1.7rem,2.8vw,2.4rem);
  line-height:1.1;
  letter-spacing:-.02em;
  font-weight:800;
}
body .p3-content .hero-lead{
  font-size:clamp(.95rem,1.35vw,1.12rem);
  line-height:1.62;
}
body .p3-content .section-label{
  font-size:.7rem;
  letter-spacing:.12em;
}

/* Homepage solution cards: Business Outcome is a full container,matching the card language. */
body .solution-card-v3 .solution-outcome-v3{
  border:1px solid color-mix(in srgb,var(--project) 28%,var(--line));
  border-left:2px solid var(--project);
  border-radius:9px;
}

/* Reserve real layout space for the CTA so it can never cover Business Outcome. */
body .solution-card-v3 .card-cta{
  position:relative;
  inset:auto;
  flex:0 0 auto;
  width:auto;
  min-height:34px;
  margin:14px -22px -22px;
  box-sizing:border-box;
  opacity:0;
  pointer-events:none;
}
body .solution-card-v3:hover .card-cta,body .solution-card-v3:focus-within .card-cta{
  opacity:1;
}
@media(hover:none),(pointer:coarse){
  body .solution-card-v3 .card-cta{opacity:1}
}



/* === LIGHT MODE — solution icon tiles === */
html[data-theme="light"] .solution-icon-v3{
  background:color-mix(in srgb,var(--project) 10%,#ffffff);
  border-color:color-mix(in srgb,var(--project) 42%,#d7e3ee);
  color:var(--project);
}
html[data-theme="light"] .solution-card-v3:hover .solution-icon-v3{
  box-shadow:0 0 22px color-mix(in srgb,var(--project) 14%,transparent);
}

/* Approved CTA treatment; baseline sizing/layout preserved */
.button{font-weight:600}
html[data-theme="light"] .button{background:linear-gradient(90deg,#0891b2,#4ba8ff);color:#fff;border-color:transparent}
html[data-theme="light"] .button.secondary{background:#fff;color:#0d1f35;border-color:#bfd2e3}

/* === HERO FINAL PARITY + CUBE DOT STABILITY === */
/* Operational Value now uses the exact same desktop card geometry as Architecture / Agents. */
html body .heroX .heroX-valuebox{
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
}
html body .heroX .heroX-valuebox article{
  position:relative!important;
  height:70px!important;
  margin:8px 0!important;
  display:grid!important;
  grid-template-columns:62px 1fr!important;
  align-items:center!important;
  padding:0 18px!important;
  border:1px solid rgba(65,181,229,.28)!important;
  border-radius:11px!important;
  background:linear-gradient(90deg,rgba(5,36,61,.78),rgba(8,46,76,.52))!important;
  box-shadow:inset 0 0 18px rgba(31,163,225,.035),0 7px 18px rgba(0,0,0,.10)!important;
  overflow:visible!important;
}
html body .heroX .heroX-valuebox article.violet{border-color:rgba(147,112,255,.38)!important}
html body .heroX .heroX-valuebox article.teal{border-color:rgba(44,225,205,.38)!important}
html body .heroX .heroX-valuebox article>i{font-size:34px!important}
html body .heroX .heroX-valuebox article div b{
  display:block!important;
  margin-top:0!important;
  font-size:12px!important;
  line-height:1.15!important;
  letter-spacing:.03em!important;
}
html body .heroX .heroX-valuebox article div small{
  display:block!important;
  margin-top:4px!important;
  font-size:10px!important;
  line-height:1.2!important;
  letter-spacing:0!important;
}

@media(min-width:1201px){
  html body .heroX .heroX-agents,html body .heroX .heroX-value{
    padding-left:25px!important;
    padding-right:25px!important;
  }
}

/* One exact square-node specification for every handoff point. */
html body .heroX .heroX-enterprise .hx-out-port,html body .heroX .heroX-agents .hx-in-port,html body .heroX .heroX-agents .hx-out-port,html body .heroX .heroX-valuebox .hx-value-port{
  top:50%!important;
  width:10px!important;
  height:10px!important;
  border-radius:3px!important;
  transform:translateY(-50%)!important;
  background:rgba(67,229,251,.48)!important;
  box-shadow:0 0 0 2px rgba(6,37,61,.98),0 0 5px rgba(67,229,251,.35)!important;
  overflow:visible!important;
}
html body .heroX .heroX-enterprise .hx-out-port,html body .heroX .heroX-agents .hx-out-port{
  right:-5px!important;
  left:auto!important;
}
html body .heroX .heroX-agents .hx-in-port,html body .heroX .heroX-valuebox .hx-value-port{
  left:-5px!important;
  right:auto!important;
}

/* Dark-mode cube dots keep one resting luminance.
   The wave still moves and recolors dots,but cannot create near-white brightness spikes. */
html:not([data-theme="light"]) body .heroX .heroX-ai .hx-cube-dots circle{
  fill:url(#hx-cube-travel-gradient)!important;
  opacity:.56!important;
  filter:none!important;
  stroke:none!important;
}

/* Light-mode Intelligence Fabric uses explicit face colors.
   These classes are created dynamically by the lifecycle script, so keep them
   here even though they do not appear in the static HTML markup. */
html[data-theme="light"] body .heroX .heroX-ai .hx-cube-dots .hx-dot-top{
  fill:#18b8dd!important;
}
html[data-theme="light"] body .heroX .heroX-ai .hx-cube-dots .hx-dot-left{
  fill:#08a9c8!important;
}
html[data-theme="light"] body .heroX .heroX-ai .hx-cube-dots .hx-dot-right{
  fill:#6670ea!important;
}
html[data-theme="light"] body .heroX .heroX-ai .hx-cube-dots circle{
  opacity:.78!important;
  filter:none!important;
  stroke:none!important;
}

html[data-theme="light"] body .heroX .heroX-valuebox article{
  background:rgba(255,255,255,.58)!important;
  border-color:rgba(8,145,178,.22)!important;
  box-shadow:0 7px 18px rgba(13,31,53,.055)!important;
}
html[data-theme="light"] body .heroX .heroX-valuebox article.violet{border-color:rgba(147,112,255,.28)!important}
html[data-theme="light"] body .heroX .heroX-valuebox article.teal{border-color:rgba(44,225,205,.28)!important}


/* Shared portfolio header presentation used by landing and detail pages. */
.nav-positioning{display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-decoration:none;white-space:nowrap}
.nav-name{color:var(--text);font-size:.74rem;font-weight:850;letter-spacing:.09em;line-height:1.1}
.nav-subtitle{color:var(--accent);font-size:.58rem;font-weight:700;letter-spacing:.16em;line-height:1.1;text-transform:uppercase}
.nav-social{display:flex;align-items:center;gap:7px}
.nav-soc-btn{width:28px;height:28px;border:1px solid #1e3248;border-radius:6px;display:flex;align-items:center;justify-content:center;color:#5a7a94;font-size:15px;text-decoration:none;transition:border-color .18s,color .18s}
.nav-soc-btn:hover{border-color:#35d4f166;color:#35d4f1}
.theme-header-host{display:flex;align-items:center;margin-left:0}
.theme-toggle-btn{padding:0;background:transparent;cursor:pointer;flex:0 0 28px;appearance:none}
@media(max-width:1050px){.nav-name{font-size:.68rem;letter-spacing:.07em}.nav-subtitle{font-size:.54rem;letter-spacing:.12em}}
@media(max-width:720px){.theme-header-host{margin-left:0}}


/* Hero capability tooltips must render above the connector SVG.
   Connector SVG is z-index:5,so the AI zone must sit above that stacking context. */
html body .heroX .heroX-ai{
  z-index:7!important;
}
html body .heroX .heroX-ai .heroX-caps{
  position:relative;
  z-index:8!important;
  overflow:visible!important;
}

/* Light-mode connector ports: replace the dark-mode outline with a clean cyan/light edge. */
html[data-theme="light"] body .heroX .heroX-enterprise .hx-out-port,html[data-theme="light"] body .heroX .heroX-agents .hx-in-port,html[data-theme="light"] body .heroX .heroX-agents .hx-out-port,html[data-theme="light"] body .heroX .heroX-valuebox .hx-value-port{
  background:#45bfd5!important;
  box-shadow:0 0 0 2px rgba(234,245,251,.98),0 0 5px rgba(25,151,183,.38)!important;
}
html[data-theme="light"] body .heroX .heroX-enterprise .hx-out-port.hx-port-live,html[data-theme="light"] body .heroX .heroX-agents .hx-in-port.hx-port-live,html[data-theme="light"] body .heroX .heroX-agents .hx-out-port.hx-port-live,html[data-theme="light"] body .heroX .heroX-valuebox .hx-value-port.hx-port-live{
  background:#00aeca!important;
  box-shadow:0 0 0 2px rgba(234,245,251,.98),0 0 10px rgba(8,184,210,.76)!important;
}

/* Shared inner-page foundation: Contact, Experience and Framework. */
.case-wrap{width:min(1380px,100%);margin:auto;padding:24px 32px}
.page-kicker{color:var(--case-cyan);font-size:.78rem;font-weight:900;letter-spacing:.09em;text-transform:uppercase;margin-bottom:14px}
.page-title{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;font-size:clamp(1.7rem,2.8vw,2.4rem);line-height:1.1;letter-spacing:-.02em;margin:0 0 16px;font-weight:200!important}
.reveal-case{opacity:0;transform:translateY(14px);transition:opacity .55s ease,transform .55s cubic-bezier(.22,1,.36,1)}
.reveal-case.visible{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal-case{opacity:1;transform:none}}


/* GLOBAL FLOATING FOOTER */
.site-footer{
  width:min(var(--max),calc(100% - 32px));
  margin:28px auto 18px;
  border:1px solid rgba(36,60,90,.78);
  border-radius:18px;
  background:linear-gradient(145deg,rgba(10,22,38,.96),rgba(5,13,24,.98));
  box-shadow:0 18px 46px rgba(0,0,0,.20);
  overflow:hidden
}
.site-footer-inner{padding:28px 30px 16px}
.site-footer-grid{
  display:grid;
  grid-template-columns:1.25fr .72fr .95fr .68fr 1fr;
  gap:28px;
  align-items:start
}
.footer-identity h2,.footer-group h3{
  margin:0 0 14px;
  color:var(--text);
  font-size:.72rem;
  font-weight:850;
  letter-spacing:.09em;
  text-transform:uppercase
}
.footer-identity p,.footer-group a,.footer-group span{
  display:block;
  margin:0 0 8px;
  color:var(--muted);
  font-size:.75rem;
  line-height:1.45;
  text-decoration:none
}
.footer-group a{width:max-content;max-width:100%;transition:color .18s ease,transform .18s ease}
.footer-group a:hover{color:var(--accent);transform:translateX(2px)}
.footer-static{cursor:default}
.site-footer-bottom{
  margin-top:20px;
  padding-top:14px;
  border-top:1px solid rgba(36,60,90,.62);
  color:var(--muted);
  font-size:.68rem;
  letter-spacing:.02em
}
html[data-theme="light"] .site-footer{
  border-color:rgba(192,213,232,.82);
  background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(244,248,253,.98));
  box-shadow:0 18px 46px rgba(13,31,53,.08)
}
html[data-theme="light"] .site-footer-bottom{border-top-color:rgba(192,213,232,.72)}
@media(max-width:1050px){
  .site-footer-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:900px){
  .site-footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 34px}
}
@media(max-width:560px){
  .site-footer{width:calc(100% - 16px);margin:22px auto 10px;border-radius:14px}
  .site-footer-inner{padding:22px 20px 14px}
  .site-footer-grid{grid-template-columns:1fr;gap:22px}
}
