/* GEOsphere Health: Strategic Advisory, its four pages, and Solutions (Kate's pages of 2026-10-14).
   The same night sky, type and rings-and-dots as the home page. Each page opens under a turning Milky Way, with a diagram drawn in the
   lines of the mark that keeps moving while it is on screen. Motion rules as on the home page: loops move only by transform or opacity,
   they rest while their section is off screen (the script marks it data-off), and all of it stops for visitors who ask for less motion. */
html{scroll-behavior:smooth}
body{margin:0;background:#06090c}
a{color:#66b2ff}a:hover{color:#ffffff}
.geo *{box-sizing:border-box}
.geo ::selection{background:#007bff;color:#fff}
.geo a:focus-visible,.geo button:focus-visible{outline:2px solid #d4af37;outline-offset:4px}
.rule{display:block;width:44px;height:2px;margin:0 0 26px;background:#d4af37}
.wrap{max-width:1360px;margin:0 auto;padding:0 clamp(20px,5vw,80px)}
.h2{margin:0;font-family:'Antonio',sans-serif;font-weight:600;font-size:clamp(36px,4.6vw,68px);line-height:1.04;text-transform:uppercase;color:#fff}
.eyebrow{margin:0;font-family:'Martian Mono',monospace;font-size:13px;line-height:1.6;letter-spacing:.26em;text-transform:uppercase;color:#d4af37}
@keyframes turn{to{transform:rotate(360deg)}}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes twinkle{0%,100%{opacity:.15}50%{opacity:.85}}
[data-off] :not(.rv),[data-off] :not(.rv)::before,[data-off] :not(.rv)::after{animation-play-state:paused}

/* the hero words rise in; scroll reveal where the browser supports it, fully visible everywhere else */
.up{animation:up .9s cubic-bezier(.2,.7,.2,1) both}
@keyframes up{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@supports (animation-timeline: view()){
  .rv{animation:rise linear both;animation-timeline:view();animation-range:entry 0% entry 42%}
  @keyframes rise{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:none}}
}

/* buttons, as on the home page */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:space-between;gap:18px;min-height:58px;padding:7px 7px 7px 28px;border-radius:34px;border:1px solid transparent;font-family:'Martian Mono',monospace;font-size:12px;line-height:1.45;letter-spacing:.13em;text-transform:uppercase;text-align:left;text-decoration:none;text-wrap:balance;cursor:pointer;overflow:hidden;transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s,background .3s,border-color .3s,color .3s}
.btn .go{flex:0 0 44px;width:44px;height:44px;display:grid;place-items:center;border-radius:50%;transition:background .3s,color .3s}
.btn .go svg{transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.btn:hover{transform:translateY(-2px)}
.btn:hover .go svg{transform:translateX(3px)}
.btn--solid{background:#fff;color:#06090c;box-shadow:0 0 0 1px rgba(255,255,255,.9),0 16px 36px -12px rgba(0,123,255,.9)}
.btn--solid .go{background:#0068d6;color:#fff}
.btn--solid:hover{color:#06090c;box-shadow:0 0 0 1px #fff,0 20px 44px -10px #007bff}
.btn--solid:hover .go{background:#d4af37;color:#06090c}
.btn--solid::after{content:"";position:absolute;top:0;bottom:0;left:0;width:34%;background:linear-gradient(90deg,rgba(0,123,255,0),rgba(0,123,255,.22),rgba(0,123,255,0));transform:translateX(-130%) skewX(-20deg);animation:btnsheen 6.5s ease-in-out infinite;pointer-events:none}
@keyframes btnsheen{0%,62%{transform:translateX(-130%) skewX(-20deg)}92%,100%{transform:translateX(430%) skewX(-20deg)}}
.mail{color:#fff;text-decoration:none;border-bottom:2px solid #007bff;display:inline-block;padding:9px 0 3px;transition:color .3s,border-color .3s}
.mail:hover{color:#d4af37;border-bottom-color:#d4af37}
.foot a{color:#a9b7c2;text-decoration:none}
.foot a:hover{color:#fff}

/* ---------- THE HERO ----------
   Three layers of sky: the Milky Way (the photograph seen through the dome, alone), turning very slowly about a point off to the right;
   a wheel of real stars turning a little faster in front of it; and single stars that flare now and then. A veil keeps the words clear.
   The page's diagram stands to the right of the words (behind them, faint, on phones), follows the pointer a little, and lags the scroll. */
.ah{position:relative;overflow:hidden;background:#04070b;border-bottom:1px solid rgba(255,255,255,.14);--gut:clamp(20px,3.6vw,64px)}
.ah-sky{position:absolute;inset:0;pointer-events:none;transform:translateY(calc(var(--sy,0) * .3px))}
.ah-mw{position:absolute;left:var(--mwx,74%);top:var(--mwy,30%);width:max(118vw,1300px);aspect-ratio:1;margin:calc(max(118vw,1300px) / -2) 0 0 calc(max(118vw,1300px) / -2);background:url(/img/dome-sky.webp) center / 100% 100% no-repeat;border-radius:50%;-webkit-mask-image:radial-gradient(circle,#000 30%,rgba(0,0,0,.6) 46%,transparent 64%);mask-image:radial-gradient(circle,#000 30%,rgba(0,0,0,.6) 46%,transparent 64%);opacity:.72;transform:rotate(var(--mwr,0deg));animation:mwturn 900s linear infinite}
@keyframes mwturn{from{transform:rotate(var(--mwr,0deg))}to{transform:rotate(calc(var(--mwr,0deg) - 360deg))}}
.ah-st{position:absolute;left:var(--mwx,74%);top:var(--mwy,30%);width:max(150vw,1700px);aspect-ratio:1;margin:calc(max(150vw,1700px) / -2) 0 0 calc(max(150vw,1700px) / -2);background:url(/img/stars.webp) 0 0 / 560px auto;opacity:.9;animation:turn 520s linear infinite reverse}
.ah-st::after{content:"";position:absolute;inset:0;background:url(/img/stars.webp) 37% 61% / 760px auto;animation:twinkle 5.3s ease-in-out infinite}
.ah-veil{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(4,7,11,.9) 0%,rgba(4,7,11,.62) 42%,rgba(4,7,11,.16) 78%),linear-gradient(180deg,rgba(4,7,11,.7) 0%,rgba(4,7,11,0) 26%,rgba(4,7,11,0) 70%,#06090c 100%)}
.tw{position:absolute;width:2px;height:2px;margin:-1px 0 0 -1px;border-radius:50%;background:#fff;box-shadow:0 0 4px rgba(170,205,255,.65);animation:tw 7s ease-in-out infinite}
.tw::before,.tw::after{content:"";position:absolute;left:50%;top:50%;width:13px;height:1px;margin:-.5px 0 0 -6.5px;background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.65),rgba(255,255,255,0))}
.tw::after{transform:rotate(90deg)}
@keyframes tw{0%,100%{opacity:.08;transform:scale(.4)}7%{opacity:.7;transform:scale(1)}15%{opacity:.12;transform:scale(.45)}57%{opacity:.08;transform:scale(.4)}64%{opacity:.55;transform:scale(.85)}72%{opacity:.08;transform:scale(.4)}}
.shoot{position:absolute;left:70%;top:110px;width:160px;height:1.5px;border-radius:2px;background:linear-gradient(90deg,rgba(215,232,255,.95),rgba(215,232,255,0));opacity:0;animation:shoot 22s linear 3s infinite}
@keyframes shoot{0%{opacity:0;transform:rotate(-22deg) translateX(0)}.5%{opacity:1}3%{opacity:1}4.4%{opacity:0;transform:rotate(-22deg) translateX(-540px)}100%{opacity:0;transform:rotate(-22deg) translateX(-540px)}}
.ah-in{position:relative;z-index:1;padding:0 var(--gut)}
.ah-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:30px 0}
.brand{display:flex;align-items:center;gap:16px;min-height:44px;text-decoration:none;color:#fff}
.brand img{width:54px;height:54px}
.brand span{font-family:'Martian Mono',monospace;font-weight:500;font-size:17px;letter-spacing:.12em;text-transform:uppercase}
.ah-body{position:relative;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:clamp(24px,4vw,72px);align-items:center;max-width:1360px;padding:clamp(40px,6vw,96px) 0 clamp(64px,8vw,120px)}
.ah-txt{position:relative;z-index:1;min-width:0}
.ah-h1{margin:0;font-family:'Antonio',sans-serif;font-weight:700;font-size:clamp(42px,4.5vw,76px);line-height:.98;letter-spacing:-.005em;text-transform:uppercase;color:#007bff;text-shadow:0 0 34px rgba(0,123,255,.3)}
.ah-h1 span{display:block}
.ah-h1--xl{font-size:clamp(64px,10.4vw,168px);line-height:.92}
.ah-sub{margin:clamp(26px,3vw,40px) 0 0;max-width:640px;font-size:clamp(20px,1.8vw,26px);line-height:1.38;color:#fff;text-shadow:0 2px 16px rgba(6,9,12,.95)}
.ah-lead{margin:clamp(28px,3.4vw,48px) 0 0;max-width:720px;font-size:clamp(22px,2.3vw,34px);line-height:1.32;color:#fff;text-shadow:0 2px 16px rgba(6,9,12,.95)}
.ah-lead em{font-style:normal;color:#d4af37}
.crumb{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;margin:0 0 clamp(26px,3vw,40px);font-family:'Martian Mono',monospace;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:#a9b7c2}
.crumb a{display:inline-flex;align-items:center;gap:10px;min-height:44px;color:#fff;text-decoration:none;border-bottom:1px solid transparent;transition:border-color .3s,color .3s}
.crumb a:hover{color:#fff;border-bottom-color:#d4af37}
.crumb svg{flex:0 0 auto}
.ah-tag{display:flex;align-items:center;gap:14px;margin:0 0 22px;font-family:'Martian Mono',monospace;font-size:12.5px;line-height:1.55;letter-spacing:.2em;text-transform:uppercase;color:#d4af37}
.ah-tag::before{content:"";flex:0 0 28px;height:1px;background:#d4af37}
.ah-art{position:relative;width:100%;max-width:520px;justify-self:end;aspect-ratio:1;pointer-events:none;transform:translateY(calc(var(--sy,0) * -.12px))}
.ah-art-in{position:absolute;inset:0;transform:translate(calc(var(--px,0) * 18px),calc(var(--py,0) * 12px));transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.ah-art svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.halo{position:absolute;inset:8%;border-radius:50%;background:radial-gradient(circle,rgba(0,123,255,.3),rgba(0,123,255,0) 64%);animation:halo 6s ease-in-out infinite}
@keyframes halo{0%,100%{transform:scale(.88);opacity:.55}50%{transform:scale(1.08);opacity:1}}
.rays{position:absolute;inset:-6%;border-radius:50%;background:repeating-conic-gradient(from 0deg,rgba(102,178,255,.1) 0deg 1.4deg,rgba(102,178,255,0) 1.4deg 25.714deg);-webkit-mask-image:radial-gradient(circle,transparent 22%,#000 36%,transparent 68%);mask-image:radial-gradient(circle,transparent 22%,#000 36%,transparent 68%);animation:turn 160s linear infinite reverse}

/* ---------- THE DIAGRAMS ----------
   Drawn in the mark's lines: thin white strokes, the blue of the rings, gold points. Every stroke is given pathLength="1", so it can draw
   itself in (.dr). After that each diagram keeps one slow loop of its own. */
.d *{fill:none;stroke:rgba(255,255,255,.72);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;transform-box:fill-box;transform-origin:center}
.d .b{stroke:#66b2ff}
.d .bb{stroke:#1f88ff;stroke-width:2.2;filter:drop-shadow(0 0 6px rgba(0,123,255,.85))}
.d .f{stroke:rgba(255,255,255,.28)}
.d .gd{fill:#d4af37;stroke:none;filter:drop-shadow(0 0 6px rgba(212,175,55,.8))}
.d .gl{stroke:#d4af37;stroke-width:2}
.d .lt{fill:rgba(102,178,255,.14);stroke:none}
/* Lines that draw themselves, or carry a travelling light, are measured with pathLength="1"; Chrome mis-measures those dashes on a
   line that keeps its width at any size (vector-effect), which left gaps in the rings of the mark. So these lines scale with their drawing. */
.d .dr,.d .run,.d-emp .trend,.d-pay .chk{vector-effect:none}
.dr{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 2.2s cubic-bezier(.6,0,.2,1) forwards;animation-delay:var(--dd,.2s)}
/* a light that travels along a line: a short dash run along the line's length, again and again */
.run{stroke-dasharray:.07 1;stroke-dashoffset:1.07;animation:run var(--rt,3.6s) linear infinite;animation-delay:var(--rd,0s)}
.run.bb{stroke-width:2.6}
@keyframes run{to{stroke-dashoffset:0}}
.run--back{animation-direction:reverse}
.pulse{animation:pulse 3.2s ease-in-out infinite;animation-delay:var(--pd,0s)}
@keyframes pulse{0%,100%{transform:scale(1);opacity:.55}45%{transform:scale(1.18);opacity:1}}

/* Strategic Advisory: the mark at the centre, four audiences around it, light running both ways along the lines between */
.d-hub .ring{stroke:rgba(255,255,255,.4)}
.d-hub .node{animation:node 8s linear infinite;animation-delay:var(--nd,0s)}
@keyframes node{0%,100%{stroke:rgba(255,255,255,.45)}6%,22%{stroke:#66b2ff}30%{stroke:rgba(255,255,255,.45)}}
.d-hub .nlit{opacity:0;animation:nlit 8s ease-in-out infinite;animation-delay:var(--nd,0s)}
@keyframes nlit{0%,100%{opacity:0;transform:scale(.7)}8%,22%{opacity:1;transform:scale(1)}32%{opacity:0;transform:scale(1.25)}}

/* Providers & Health Systems: the hospital; its windows light one after another; a pulse runs along the ground and climbs */
.d-prov .win{fill:rgba(255,206,130,.9);stroke:none;opacity:.12;animation:win 6s ease-in-out infinite;animation-delay:var(--wd,0s)}
@keyframes win{0%,100%{opacity:.1}18%,60%{opacity:.62}78%{opacity:.1}}
/* Self-Insured Employers: the institution; three bars of spending settle as the trend line draws across them */
.d-emp .bar{fill:rgba(0,123,255,.28);stroke:#66b2ff;transform-origin:50% 100%;animation:bar 6s cubic-bezier(.5,0,.2,1) infinite;animation-delay:var(--bd,0s)}
@keyframes bar{0%{transform:scaleY(.25)}30%,72%{transform:scaleY(1)}92%,100%{transform:scaleY(.25)}}
.d-emp .trend{stroke-dasharray:1;stroke-dashoffset:1;animation:trend 6s cubic-bezier(.5,0,.2,1) infinite}
@keyframes trend{0%,12%{stroke-dashoffset:1}42%,74%{stroke-dashoffset:0}92%,100%{stroke-dashoffset:-1}}
.d-emp .tip{animation:tip 6s ease-in-out infinite}
@keyframes tip{0%,38%{opacity:0;transform:scale(.3)}46%,74%{opacity:1;transform:scale(1)}88%,100%{opacity:0;transform:scale(.3)}}
/* Payers & TPAs: the shield; a line of light reads each claim before it goes, each one turns blue, then the check is drawn */
.d-pay .scan{transform-box:view-box;animation:scan 6s cubic-bezier(.45,0,.3,1) infinite}
@keyframes scan{0%,6%{transform:translateY(0);opacity:0}10%{opacity:1}58%{transform:translateY(74px);opacity:1}64%,100%{transform:translateY(74px);opacity:0}}
.d-pay .row{animation:row 6s linear infinite;animation-delay:var(--rw,0s)}
@keyframes row{0%,14%{stroke:rgba(255,255,255,.35)}18%,84%{stroke:#66b2ff}92%,100%{stroke:rgba(255,255,255,.35)}}
.d-pay .chk{stroke:#d4af37;stroke-width:3;stroke-dasharray:1;stroke-dashoffset:1;animation:chk 6s ease-out infinite}
@keyframes chk{0%,62%{stroke-dashoffset:1;opacity:1}72%,86%{stroke-dashoffset:0;opacity:1}96%,100%{stroke-dashoffset:0;opacity:0}}
/* Brokers & Benefits Advisors: two rings, the advisor's and GEO's, come together; where they meet, the light gathers */
.d-brk .ra{animation:ra 7s cubic-bezier(.5,0,.2,1) infinite}
.d-brk .rb{animation:rb 7s cubic-bezier(.5,0,.2,1) infinite}
@keyframes ra{0%,100%{transform:translateX(-22px)}40%,70%{transform:none}}
@keyframes rb{0%,100%{transform:translateX(22px)}40%,70%{transform:none}}
.d-brk .lens{opacity:0;animation:lens 7s ease-in-out infinite}
@keyframes lens{0%,30%,100%{opacity:0}48%,66%{opacity:1}}
.d-brk .orbit{transform-box:view-box;animation:turn 9s linear infinite}
.d-brk .orbit--b{animation-duration:12s;animation-direction:reverse}
/* Solutions: an orrery about the mark. Five orbits, one for each step, each with its light; a wave leaves the mark and lights the
   orbits outward in turn, each light turning gold as its orbit lights; a thin beam rises from the mark. */
.d-hub .core-turn,.d-sol .core-turn{transform-origin:200px 200px;transform-box:view-box;animation:turn 120s linear infinite}
.d-sol .core-turn{transform-origin:200px 210px;animation-duration:90s}
.d-sol .ring{stroke:rgba(255,255,255,.5)}
.d-sol .orb{stroke:rgba(255,255,255,.4)}
.d-sol .orb--far{stroke:rgba(255,255,255,.16)}
.d-sol .orb-lit{stroke:#1f88ff;stroke-width:2.2;filter:drop-shadow(0 0 6px rgba(0,123,255,.9));opacity:0;animation:olit 7.5s ease-in-out infinite;animation-delay:var(--sd,0s)}
@keyframes olit{0%,100%{opacity:0}5%{opacity:1}22%{opacity:.4}40%{opacity:0}}
.d-sol .pl{fill:#dbe8ff;stroke:none;filter:drop-shadow(0 0 5px rgba(170,205,255,.95));animation:pl 7.5s ease-in-out infinite;animation-delay:var(--sd,0s)}
@keyframes pl{0%,100%{fill:#dbe8ff}5%,26%{fill:#ffd97a}40%{fill:#dbe8ff}}
.d-sol .wave{stroke:#66b2ff;stroke-width:1.6;opacity:0;animation:wave 7.5s cubic-bezier(.3,.1,.3,1) infinite}
@keyframes wave{0%{opacity:.9;transform:scale(.3)}40%{opacity:.25}48%,100%{opacity:0;transform:scale(6.4)}}
.d-sol .beam{stroke:none;transform-origin:50% 100%;animation:sbeam 7.5s ease-in-out infinite}
@keyframes sbeam{0%,100%{opacity:.25;transform:scaleY(.7)}10%,30%{opacity:1;transform:scaleY(1)}60%{opacity:.35}}

/* ---------- THE WORDS UNDER THE HERO ---------- */
.intro{padding:clamp(72px,10vw,150px) 0 clamp(56px,7vw,110px)}
.intro-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(32px,6vw,96px);align-items:start}
.lead{margin:0;font-size:clamp(22px,2.2vw,32px);line-height:1.4;color:#fff}
.body-t{margin:0;color:#dbe4ea}
.body-t + .body-t{margin-top:22px}
.intro-side{padding-top:clamp(0px,1.2vw,14px);border-left:1px solid rgba(255,255,255,.16);padding-left:clamp(24px,3vw,44px)}

/* where we deliver value: dark glass cards in a six-column grid (three to a row; four cards make two rows of two, five make three
   then two). A card lights when most of it is on screen: its corner glows, its line fills, its ring turns. */
.vals-sec{padding:clamp(72px,10vw,150px) 0;border-top:1px solid rgba(255,255,255,.14);background:linear-gradient(180deg,#06090c 0%,#0a121a 100%)}
.vals{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px;margin-top:clamp(40px,5vw,72px)}
.vc{grid-column:span 2;position:relative;overflow:hidden;display:flex;flex-direction:column;gap:18px;padding:clamp(22px,2.2vw,32px) clamp(20px,2vw,30px) clamp(26px,2.6vw,36px);background:linear-gradient(155deg,#0f1d29 0%,#080d12 58%,#06090c 100%);border:1px solid rgba(255,255,255,.13);transition:transform .45s cubic-bezier(.2,.7,.2,1),border-color .45s}
.vals--4 .vc{grid-column:span 3}
.vals--5 .vc:nth-child(n+4){grid-column:span 3}
.vc:nth-child(2){--dl:.08s}.vc:nth-child(3){--dl:.16s}.vc:nth-child(4){--dl:.24s}.vc:nth-child(5){--dl:.32s}
.vc::before{content:"";position:absolute;inset:0;background:radial-gradient(260px circle at var(--mx,18%) var(--my,12%),rgba(0,123,255,.22),rgba(0,123,255,0) 70%);opacity:0;transition:opacity .6s var(--dl,0s);pointer-events:none}
.vc[data-on]::before,.vc:hover::before{opacity:1}
.vc::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:2px;background:linear-gradient(90deg,#007bff,#66b2ff);transform:scaleX(0);transform-origin:0 50%;transition:transform 1s cubic-bezier(.2,.7,.2,1) var(--dl,0s)}
.vc[data-on]::after{transform:scaleX(1)}
.vc:hover{transform:translateY(-6px);border-color:rgba(102,178,255,.5)}
.vc-top{position:relative;display:flex;align-items:center;justify-content:space-between}
.vc-n{font-family:'Martian Mono',monospace;font-size:12px;letter-spacing:.18em;color:#d4af37}
.vc-o{width:46px;height:46px;overflow:visible}
.vc-o circle{fill:none;stroke:rgba(255,255,255,.3);stroke-width:1.2;vector-effect:non-scaling-stroke}
.vc-o .o2{stroke:#66b2ff;stroke-dasharray:18 120;transform-origin:center;transform-box:fill-box;opacity:.3;transition:opacity .8s var(--dl,0s)}
.vc[data-on] .vc-o .o2{opacity:1;animation:turn 7s linear infinite}
.vc-o .o3{fill:#d4af37;stroke:none;transform-origin:center;transform-box:fill-box;transform:scale(0);transition:transform .8s cubic-bezier(.2,.7,.2,1) var(--dl,0s)}
.vc[data-on] .vc-o .o3{transform:scale(1)}
.vc h3{position:relative;margin:0;font-family:'Antonio',sans-serif;font-weight:600;font-size:clamp(25px,2.1vw,32px);line-height:1.08;text-transform:uppercase;color:#fff}
.vc p{position:relative;margin:0;font-size:17px;line-height:1.5;color:#c3ced6}

/* the closing: the mark, large, turns at the right and its rings light one by one; the words and the way to the form at the left */
.close{position:relative;overflow:hidden;padding:clamp(88px,12vw,170px) 0;background:#04070b;border-top:1px solid rgba(255,255,255,.14)}
.close-sky{position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(1px 1px at 20px 30px,#fff,transparent),radial-gradient(1px 1px at 90px 140px,#cfe4ff,transparent),radial-gradient(1.5px 1.5px at 160px 60px,#fff,transparent),radial-gradient(1px 1px at 230px 190px,#fff,transparent),radial-gradient(1px 1px at 280px 90px,#9cc7ff,transparent),radial-gradient(1.5px 1.5px at 120px 250px,#fff,transparent),radial-gradient(1px 1px at 40px 210px,#fff,transparent);background-size:300px 300px;opacity:.55;animation:twinkle 7s ease-in-out infinite}
.close-mark{position:absolute;right:max(-14vw,-220px);top:50%;width:clamp(420px,52vw,780px);aspect-ratio:1;margin-top:calc(clamp(420px,52vw,780px) / -2);pointer-events:none;opacity:.9}
.close-mark .spin{position:absolute;inset:0;animation:turn 200s linear infinite}
.close-mark svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.close-mark circle{fill:none;stroke:rgba(255,255,255,.22);stroke-width:1;vector-effect:non-scaling-stroke}
.close-mark .cl{stroke:#1f88ff;stroke-width:1.8;opacity:0;filter:drop-shadow(0 0 8px rgba(0,123,255,.9));animation:clring 10.5s ease-in-out infinite}
@keyframes clring{0%,100%{opacity:0}5%,16%{opacity:1}24%{opacity:0}}
.close-mark .cg{fill:#d4af37;stroke:none;filter:drop-shadow(0 0 10px rgba(212,175,55,.9))}
.close-veil{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#04070b 0%,rgba(4,7,11,.86) 44%,rgba(4,7,11,.2) 100%)}
.close-txt{position:relative;max-width:760px}
.close-txt p.body-t{margin-top:28px;font-size:clamp(19px,1.5vw,22px);line-height:1.55}
.close-go{margin-top:clamp(36px,4vw,56px)}

/* the other three audiences, at the foot of each audience page */
.more{padding:clamp(64px,8vw,110px) 0;border-top:1px solid rgba(255,255,255,.14)}
.more-h{display:inline-flex;align-items:center;gap:12px;min-height:44px;margin:0 0 clamp(24px,3vw,40px);font-family:'Martian Mono',monospace;font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:#d4af37;text-decoration:none;border-bottom:1px solid transparent}
.more-h:hover{color:#d4af37;border-bottom-color:#d4af37}
.more-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}

/* an audience as a card: on the Strategic Advisory page (large, two to a row) and at the foot of each audience page (small) */
.ac{position:relative;overflow:hidden;display:flex;flex-direction:column;min-height:100%;padding:clamp(22px,2.4vw,36px);background:linear-gradient(155deg,#0f1d29 0%,#080d12 58%,#06090c 100%);border:1px solid rgba(255,255,255,.14);color:#fff;text-decoration:none;transition:transform .45s cubic-bezier(.2,.7,.2,1),border-color .45s}
.ac::before{content:"";position:absolute;inset:0;background:radial-gradient(320px circle at var(--mx,80%) var(--my,30%),rgba(0,123,255,.22),rgba(0,123,255,0) 70%);opacity:0;transition:opacity .6s;pointer-events:none}
.ac:hover::before,.ac[data-on]::before{opacity:1}
.ac::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:2px;background:linear-gradient(90deg,#007bff,#66b2ff);transform:scaleX(0);transform-origin:0 50%;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.ac:hover::after{transform:scaleX(1)}
.ac:hover{color:#fff;transform:translateY(-6px);border-color:rgba(102,178,255,.55)}
.ac-ico{position:relative;width:56px;height:56px;margin:0 0 22px}
.ac-ico svg{width:100%;height:100%;overflow:visible}
.ac h3{position:relative;margin:0;font-family:'Antonio',sans-serif;font-weight:600;font-size:clamp(26px,2.3vw,36px);line-height:1.06;text-transform:uppercase}
.ac p{position:relative;margin:12px 0 0;font-size:17px;line-height:1.45;color:#c3ced6}
.ac .go{position:relative;display:block;margin-top:auto;padding-top:26px;color:#66b2ff}
.ac .go svg{display:block;transition:transform .3s}
.ac:hover .go svg{transform:translateX(8px)}
/* the large cards carry their page's diagram, faint, in the corner; it brightens and comes forward on hover */
.ac-art{position:absolute;right:-6%;bottom:-14%;width:58%;max-width:340px;aspect-ratio:1;pointer-events:none;opacity:.32;transform:scale(.94);transition:opacity .6s,transform .8s cubic-bezier(.2,.7,.2,1)}
.ac-art svg{width:100%;height:100%;overflow:visible}
.ac:hover .ac-art,.ac[data-on] .ac-art{opacity:.62}
.ac:hover .ac-art{transform:scale(1)}
.acs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:clamp(40px,5vw,72px)}
.acs .ac{min-height:clamp(300px,26vw,380px);padding-right:44%}
.more .ac{padding-bottom:26px}
.more .ac h3{font-size:clamp(23px,1.9vw,28px)}
.more .ac p{font-size:16px}

/* Strategic Advisory: the heading of the four audiences, centred, as in Kate's picture */
.aud{padding:clamp(72px,10vw,150px) 0;border-top:1px solid rgba(255,255,255,.14)}
.aud-h{text-align:center}
.aud-h .rule{margin-left:auto;margin-right:auto}
.aud-h p{margin:20px auto 0;max-width:720px;font-size:clamp(19px,1.6vw,23px);line-height:1.45;color:#dbe4ea}

/* Powered by GEO RIIH: three rings, one for each part, come together; where all three meet, the gold point */
.riih{position:relative;overflow:hidden;padding:clamp(72px,9vw,130px) 0;background:#0b141a;border-top:1px solid rgba(255,255,255,.14);text-align:center}
.riih-d{display:block;width:min(100%,520px);height:auto;margin:0 auto clamp(28px,3vw,44px);overflow:visible}
.riih-d circle{fill:none;stroke:rgba(255,255,255,.55);stroke-width:1.3;vector-effect:non-scaling-stroke;transform-box:fill-box;transform-origin:center;transition:transform 1.6s cubic-bezier(.2,.7,.2,1),stroke 1.2s}
.riih-d .r1{transform:translateX(-70px)}
.riih-d .r3{transform:translateX(70px)}
.riih-d .r2{transform:translateY(-14px)}
.riih[data-on] .riih-d .r1,.riih[data-on] .riih-d .r2,.riih[data-on] .riih-d .r3{transform:none;stroke:#66b2ff}
.riih-d .rg{fill:#d4af37;stroke:none;transform:scale(0);transition:transform .9s cubic-bezier(.2,.7,.2,1) 1.1s;filter:drop-shadow(0 0 10px rgba(212,175,55,.9))}
.riih[data-on] .riih-d .rg{transform:scale(1)}
.riih-d .rh{fill:rgba(0,123,255,.5);stroke:none;opacity:0;transition:opacity 1.2s 1s;filter:blur(14px)}
.riih[data-on] .riih-d .rh{opacity:1;animation:halo 6s ease-in-out 2.2s infinite}
.riih-h{margin:0;font-family:'Antonio',sans-serif;font-weight:600;font-size:clamp(32px,4vw,58px);line-height:1.06;text-transform:uppercase;color:#fff}
.riih-h sup{font-size:.36em;vertical-align:top;position:relative;top:.3em;margin-left:.06em}
.riih-parts{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px 18px;max-width:1160px;margin:clamp(24px,3vw,36px) auto 0;font-size:clamp(18px,1.6vw,22px);line-height:1.4;color:#dbe4ea}
.riih-parts span{padding:10px 18px;border:1px solid rgba(255,255,255,.18);border-radius:40px;background:rgba(6,9,12,.5)}
.riih-parts b{font-weight:400;color:#d4af37;font-size:1.3em;line-height:1}
/* Kate, 2026-10-15: one line where all three fit; where they do not, Experienced top left, Specialized top right and Shared below
   in the middle. The markup keeps her original order (Shared first), which the one-line layout shows. */
@media (max-width:1199px){
  .riih-parts{display:grid;grid-template-columns:auto auto auto;grid-template-areas:"e p1 s" "p2 p2 p2" "sh sh sh";justify-content:center;justify-items:center;gap:8px 18px}
  .riih-parts span:nth-of-type(1){grid-area:sh}
  .riih-parts span:nth-of-type(2){grid-area:e}
  .riih-parts span:nth-of-type(3){grid-area:s}
  .riih-parts b:nth-of-type(1){grid-area:p1}
  .riih-parts b:nth-of-type(2){grid-area:p2}
}

/* Solutions: the five steps. A rail runs through them and fills with gold as the page moves down past them; each step lights as the
   gold reaches it. Side by side on wide screens, one under another (the rail down their left side) on narrower ones. */
.appr{padding:clamp(72px,10vw,150px) 0;border-top:1px solid rgba(255,255,255,.14);background:linear-gradient(180deg,#06090c 0%,#0a121a 100%)}
.steps{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;margin-top:clamp(48px,6vw,88px)}
.steps-rail{position:absolute;left:0;right:0;top:0;height:1px;background:rgba(255,255,255,.22)}
.steps-rail i{position:absolute;inset:-1px 0;background:linear-gradient(90deg,#d4af37 0%,#d4af37 92%,#fff3cc 100%);box-shadow:0 0 12px rgba(212,175,55,.7);transform-origin:0 50%;transform:scaleX(var(--p,1))}
.st{position:relative;padding:34px 26px 0 0}
.st::before{content:"";position:absolute;left:0;top:-6px;width:11px;height:11px;border-radius:50%;background:#06090c;border:1px solid rgba(255,255,255,.5);transition:background .5s,border-color .5s,box-shadow .5s,transform .5s}
.st.on::before{background:#d4af37;border-color:#d4af37;box-shadow:0 0 14px rgba(212,175,55,.85);transform:scale(1.25)}
.st-n{margin:0 0 14px;font-family:'Martian Mono',monospace;font-size:12px;letter-spacing:.2em;color:#7d8d99;transition:color .5s}
.st h3{margin:0;font-family:'Antonio',sans-serif;font-weight:600;font-size:clamp(28px,2.6vw,40px);line-height:1.06;text-transform:uppercase;color:#fff;opacity:.4;transition:opacity .6s}
.st p{margin:16px 0 0;font-size:17px;line-height:1.5;color:#c3ced6;opacity:.45;transition:opacity .6s}
.st.on .st-n{color:#d4af37}
.st.on h3,.st.on p{opacity:1}

/* ---------- SMALLER SCREENS ---------- */
@media (max-width:1100px){
  .acs .ac{padding-right:clamp(22px,2.4vw,36px)}
  .ac-art{width:46%;opacity:.2}
  .acs .ac h3,.acs .ac p{max-width:68%}
}
@media (max-width:1000px){
  .ah-body{grid-template-columns:minmax(0,1fr)}
  .ah-art{position:absolute;right:-12%;top:2%;width:min(78vw,480px);opacity:.42;z-index:0}
  .ah-txt{z-index:1}
  .ah-h1{text-shadow:0 0 3px #06090c,0 0 10px #06090c,0 0 22px #06090c,0 0 44px rgba(6,9,12,.85)}
  .intro-grid{grid-template-columns:minmax(0,1fr)}
  .intro-side{border-left:0;padding-left:0;border-top:1px solid rgba(255,255,255,.16);padding-top:28px}
  .vc,.vals--4 .vc,.vals--5 .vc:nth-child(n+4){grid-column:span 3}
  .vals--5 .vc:nth-child(5){grid-column:1 / -1}
  .more-g{grid-template-columns:minmax(0,1fr)}
  .close-mark{opacity:.5}
  .steps{grid-template-columns:minmax(0,1fr);gap:0;padding-left:34px}
  .steps-rail{left:5px;right:auto;top:6px;bottom:0;width:1px;height:auto}
  .steps-rail i{inset:0 -1px;background:linear-gradient(180deg,#d4af37 0%,#d4af37 92%,#fff3cc 100%);transform-origin:50% 0;transform:scaleY(var(--p,1))}
  .st{padding:0 0 40px}
  .st::before{left:-34px;top:2px}
}
@media (max-width:900px){
  .brand img{width:38px;height:38px;margin-right:-6px}
  .brand span{font-size:11px;letter-spacing:.06em}
  .btn{min-height:56px;padding:6px 6px 6px 22px;gap:12px;font-size:11.5px;letter-spacing:.09em}
}
@media (max-width:700px){
  .acs{grid-template-columns:minmax(0,1fr)}
  .acs .ac{min-height:0}
  .acs .ac h3,.acs .ac p{max-width:none}
  .ac-art{width:44%;right:-8%;bottom:auto;top:-6%}
  .vals{grid-template-columns:minmax(0,1fr)}
  .vc,.vals--4 .vc,.vals--5 .vc:nth-child(n+4),.vals--5 .vc:nth-child(5){grid-column:auto}
  .btn--solid{display:flex;width:100%}
  .riih-parts{display:flex;flex-direction:column;gap:10px}
  .riih-parts span{width:100%}
  .riih-parts span:nth-of-type(2){order:1}
  .riih-parts b:nth-of-type(1){order:2}
  .riih-parts span:nth-of-type(3){order:3}
  .riih-parts b:nth-of-type(2){order:4}
  .riih-parts span:nth-of-type(1){order:5}
  .close-mark{right:-40%;top:auto;bottom:-10%;margin-top:0;opacity:.4}
  .close-veil{background:linear-gradient(180deg,rgba(4,7,11,.9) 0%,rgba(4,7,11,.7) 60%,rgba(4,7,11,.4) 100%)}
}
@media (max-width:360px){
  .brand{gap:10px}
  .brand img{width:34px;height:34px;margin-right:-4px}
  .brand span{font-size:10.5px;letter-spacing:0}
  .ah-h1{font-size:11.2vw}
  .ah-h1--xl{font-size:15vw}
  .em{font-size:6vw !important}
  .mail{padding:13px 0 7px}
}
@media (max-width:340px){
  .brand span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .brand{min-width:44px}
  .brand img{margin-right:0}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .geo *,.geo *::before,.geo *::after{animation:none !important;transition:none !important}
  .dr,.d-emp .trend,.d-pay .chk{stroke-dashoffset:0}
  .run{stroke-dasharray:none;opacity:.5}
  .d-hub .nlit,.d-emp .tip,.d-brk .lens{opacity:1}
  .d-sol .orb-lit{opacity:.5}
}