:root{--navy:#0B1F5C;--navy2:#14307A;--blue:#0097CC;--orange:#E8792B;--ink:#1C212D;--grey:#5A6270;--line:#DCE3EC;--tint:#F3F6FA;--lblue:#E6F4FB;--lor:#FDEFE4;--r:14px}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font:16px/1.6 "Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;color:var(--ink);background:#fff}
a{color:var(--blue)}h1,h2,h3,h4{color:var(--navy);line-height:1.25;margin:0 0 .5em}h2{font-size:1.9rem}h3{font-size:1.15rem}h4{font-size:1rem}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}.narrow{max-width:860px}
.btn{display:inline-block;background:var(--orange);color:#fff;border:0;border-radius:999px;padding:.75em 1.4em;font-weight:600;text-decoration:none;cursor:pointer;font-size:1rem}
.btn:hover{filter:brightness(1.07)}.btn.sm{padding:.5em 1em;font-size:.9rem}.btn.ghost{background:transparent;color:var(--navy);border:2px solid var(--navy)}.btn.ghost.light{color:#fff;border-color:#fff}
.top{position:sticky;top:0;z-index:20;background:#fff;border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;gap:20px;height:70px}.logo img{height:36px;display:block}
.top nav{display:flex;gap:16px;flex:1;justify-content:flex-start;flex-wrap:wrap}.top nav a{color:var(--ink);text-decoration:none;font-size:.92rem;padding:4px 0;border-bottom:2px solid transparent}
.top nav a[aria-current]{color:var(--navy);font-weight:700;border-color:var(--orange)}.menu{display:none;background:none;border:0;font-size:1.6rem}
.hero{position:relative;color:#fff;background:linear-gradient(90deg,rgba(11,31,92,.97) 0,rgba(11,31,92,.92) 42%,rgba(11,31,92,.35) 75%,rgba(11,31,92,.15)),var(--photo) var(--focus)/cover no-repeat;padding:84px 0 92px;border-bottom:6px solid var(--orange)}
.hero h1{color:#fff;font-size:3rem;max-width:640px;letter-spacing:-.01em}.hero .sub{max-width:600px;font-size:1.15rem;color:#E4EAF5}
.eyebrow,.kicker{text-transform:uppercase;letter-spacing:.12em;font-size:.78rem;font-weight:700;color:var(--orange);margin:0 0 .6em}.hero .eyebrow{color:#FFB37A}
.crumbs{font-size:.85rem;margin:0 0 1.4em;color:#C9D3E8}.crumbs a{color:#C9D3E8}.ctas{display:flex;gap:14px;flex-wrap:wrap;margin-top:1.6em}
.block{padding:64px 0}.block.tint{background:var(--tint)}.block+.block:not(.tint):not(.cta){padding-top:8px}
.lead{font-size:1.08rem;color:var(--grey);max-width:860px}.lead.small{font-size:.98rem}.src{font-size:.82rem;color:var(--grey);margin-top:14px}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-top:20px}
.stat{background:var(--navy);color:#fff;border-radius:var(--r);padding:22px}.stat:nth-child(even){background:var(--navy2)}.stat b{display:block;font-size:2rem;color:#FFB37A;line-height:1.1}.stat span{font-size:.92rem;color:#DDE5F3}
.stats.sm .stat b{font-size:1.5rem}
.cards{display:grid;gap:18px;margin-top:22px}.c2{grid-template-columns:repeat(2,1fr)}.c3{grid-template-columns:repeat(3,1fr)}.c4{grid-template-columns:repeat(4,1fr)}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:22px;box-shadow:0 2px 10px rgba(11,31,92,.05);color:inherit;text-decoration:none;display:block}
a.card:hover{border-color:var(--blue);box-shadow:0 6px 20px rgba(0,151,204,.15)}
.card p{margin:.3em 0;color:#39404D}.tag{font-size:.88rem;color:var(--navy)!important;background:var(--lblue);border-radius:10px;padding:8px 10px;margin-top:12px!important}
.ic{width:34px;height:34px;fill:none;stroke:var(--blue);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;margin-bottom:8px}
.num{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--orange);color:#fff;font-weight:700;margin-bottom:10px}.cards .card:nth-child(even) .num{background:var(--blue)}
.more{display:inline-block;margin-top:10px;font-weight:600;color:var(--blue);text-decoration:none}
.svc-h{display:flex;gap:12px;align-items:flex-start}.svc-h .ic{flex:none}details summary{cursor:pointer;font-weight:600;color:var(--navy);margin:10px 0}
.tbl{overflow-x:auto;margin-top:18px;border-radius:var(--r);border:1px solid var(--line)}table{border-collapse:collapse;width:100%;font-size:.94rem}
th{background:var(--navy);color:#fff;text-align:left;padding:12px 14px;font-weight:600}td{padding:11px 14px;border-top:1px solid var(--line);vertical-align:top}tbody tr:nth-child(even) td{background:#F7F9FC}
td ul{margin:0;padding-left:18px}td:first-child{font-weight:600;color:var(--navy)}
.tabs{margin-top:18px}.tablist{display:flex;gap:6px;flex-wrap:wrap;border-bottom:2px solid var(--line)}
.tablist button{background:none;border:0;padding:10px 16px;font:inherit;font-weight:600;color:var(--grey);cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-2px}
.tablist button[aria-selected=true]{color:var(--navy);border-color:var(--orange)}.tabpanel{padding-top:16px}
.callout{border-left:6px solid var(--blue);background:var(--lblue);border-radius:var(--r);padding:22px 26px}.callout.orange{border-color:var(--orange);background:var(--lor)}.callout p{margin:.4em 0}
.regnote{font-size:.85rem;color:var(--grey);background:var(--tint);border-radius:var(--r);padding:16px 20px}
.creds{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:18px}.cred{display:flex;gap:10px;background:#fff;border-radius:var(--r);padding:18px;border:1px solid var(--line)}.cred b{display:block;color:var(--navy)}.cred span{font-size:.88rem;color:var(--grey)}
.cta{background:var(--navy);color:#fff}.cta h2{color:#fff}.cta-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:40px}.offices{display:grid;grid-template-columns:1fr 1fr;gap:6px 24px;font-size:.9rem;color:#D3DCEE}.offices b{color:#FFB37A}
.form{background:#fff;color:var(--ink);border-radius:var(--r);padding:24px;display:grid;gap:12px}.form label{display:grid;gap:4px;font-size:.88rem;font-weight:600;color:var(--navy)}.form input,.form textarea,select,input[type=search]{font:inherit;padding:10px 12px;border:1px solid var(--line);border-radius:10px;width:100%}
.ok{color:#14803C;font-size:.9rem}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}.chips button{border:1px solid var(--line);background:#fff;border-radius:999px;padding:6px 14px;font:inherit;font-size:.88rem;cursor:pointer;color:var(--navy)}.chips button.on{background:var(--navy);color:#fff;border-color:var(--navy)}
.pill{display:inline-block;background:var(--lblue);color:var(--navy);border-radius:999px;padding:2px 10px;font-size:.8rem;font-weight:600;margin:2px 4px 2px 0}
.threat dl{margin:10px 0 0;font-size:.9rem}.threat dt{font-weight:700;color:var(--orange);font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;margin-top:8px}.threat dd{margin:2px 0}
.layers{margin-top:20px;display:grid;gap:14px}.roof,.base{border-radius:var(--r);padding:16px;text-align:center;font-weight:600}.roof{background:var(--navy);color:#fff}.base{background:var(--lor);color:var(--ink)}
.pillars{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}.pillar{background:var(--tint);border-radius:var(--r);padding:0 0 12px;overflow:hidden;display:grid;gap:8px}.pillar h4{background:var(--blue);color:#fff;margin:0;padding:12px;text-align:center}.pillar.o h4{background:var(--orange)}
.pillar span{background:#fff;margin:0 10px;border-radius:10px;padding:10px;font-size:.88rem;text-align:center;border:1px solid var(--line)}
.life th:first-child,.life tbody th{background:var(--blue);width:120px}.life tbody tr:nth-child(even) th{background:var(--orange)}.life tbody th{color:#fff}
.acc details{border:1px solid var(--line);border-radius:var(--r);padding:4px 18px;margin-top:10px;background:#fff}.acc ol{margin:0 0 14px}
.finder{display:grid;grid-template-columns:1.4fr 1fr;gap:24px;margin-top:18px}.finder ol{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.finder li{display:flex;justify-content:space-between;gap:16px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:14px 16px}
.yn{display:flex;gap:6px;flex:none}.yn button{border:1px solid var(--line);background:#fff;border-radius:999px;padding:6px 14px;font:inherit;cursor:pointer}.yn button.on[data-v="1"]{background:var(--orange);color:#fff;border-color:var(--orange)}.yn button.on[data-v="0"]{background:var(--tint)}
.result{background:var(--navy);color:#fff;border-radius:var(--r);padding:24px;align-self:start;position:sticky;top:90px}.result h3{color:#fff}.result .out{display:grid;gap:8px;margin:10px 0 18px}.result .out div{background:rgba(255,255,255,.1);border-radius:10px;padding:10px 12px}.result .out small{color:#FFB37A;display:block}
.countdown{display:grid;grid-template-columns:260px 1fr;gap:24px;align-items:center;margin-top:18px}.days{background:var(--orange);color:#fff;border-radius:var(--r);padding:26px;text-align:center}.days b{display:block;font-size:3.4rem;line-height:1}
.phases{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.phases li{background:var(--tint);border-radius:var(--r);padding:16px;border-top:4px solid var(--line)}.phases li.now{border-color:var(--orange);background:var(--lor)}.phases b{display:block;color:var(--navy)}
.radar{list-style:none;margin:10px 0 0;padding:0 0 0 18px;border-left:3px solid var(--line)}.radar li{position:relative;display:grid;grid-template-columns:110px 1fr auto;gap:14px;padding:9px 0}
.radar li:before{content:"";position:absolute;left:-27px;top:14px;width:14px;height:14px;border-radius:50%;background:var(--blue);border:3px solid #fff}.radar li.up:before{background:var(--orange)}.radar li.up span{font-weight:600}.radar b{color:var(--navy)}.radar em{font-style:normal;font-size:.78rem;color:var(--grey)}
.heat td{text-align:center;font-weight:600;font-size:.85rem}.heat .h3{background:#E8792B!important;color:#fff}.heat .h2{background:#FAC496!important}.heat .h1{background:#E2EAF4!important}.heat tbody th{background:#fff;color:var(--ink);font-weight:600;border-top:1px solid var(--line)}
.heat thead button{background:none;border:0;color:#fff;font:inherit;font-weight:600;cursor:pointer}.heat .dim{opacity:.25}.heat tr.sel th{color:var(--orange)}
.feats{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.feat{border:1px solid var(--line);border-radius:var(--r);padding:16px 18px}.feat ul{margin:6px 0;padding-left:18px;font-size:.93rem}.deliv{font-size:.9rem;background:var(--lblue);border-radius:10px;padding:8px 10px;margin:8px 0 0}
.stepper .track{display:grid;grid-template-columns:repeat(9,1fr);gap:8px;margin-top:18px}.track button{border:0;border-radius:12px;background:var(--tint);padding:12px 8px;font:inherit;font-size:.82rem;cursor:pointer;color:var(--navy);text-align:center}
.track button span{display:grid;place-items:center;width:30px;height:30px;margin:0 auto 6px;border-radius:50%;background:var(--navy);color:#fff;font-weight:700}.track button.on{background:var(--navy);color:#fff}.track button.on span{background:var(--orange)}
.panel{border:1px solid var(--line);border-radius:var(--r);padding:22px;margin-top:14px}.three{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:16px}.three>div{background:var(--tint);border-radius:12px;padding:14px}.panel .nav{display:flex;justify-content:space-between;margin-top:14px}
.libbar{display:grid;gap:4px;margin-top:16px}.libcard .ref{font-size:.85rem;color:var(--blue);font-weight:600}
.config{display:grid;grid-template-columns:1fr 1.3fr;gap:24px;margin-top:18px}.sel{display:grid;gap:14px;align-content:start}.sel label{display:grid;gap:4px;font-weight:600;color:var(--navy)}
.quote{background:var(--navy);color:#fff;border-radius:var(--r);padding:26px}.quote h4{color:#fff;margin-top:14px}.quote .fee{display:block;font-size:2.2rem;color:#FFB37A;line-height:1.15}.quote .svcname{color:#C9D3E8}.quote ul{padding-left:18px}.quote .src{color:#C9D3E8}
.level{border-top:6px solid var(--blue)}.level.l1{border-color:var(--navy)}.level.l2{border-color:var(--orange)}.purpose{font-weight:700;color:var(--navy)!important}
.sizes{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:16px}.sizes div{background:var(--tint);border-radius:12px;padding:14px}.sizes b{display:block;color:var(--navy)}.sizes span{font-size:.9rem;color:var(--grey)}
.roles{display:grid;grid-template-columns:1fr 1.4fr;gap:24px;margin-top:18px}.rolebtns{display:grid;gap:8px}.rolebtns button{text-align:left;border:1px solid var(--line);background:#fff;border-radius:12px;padding:12px 16px;font:inherit;cursor:pointer;color:var(--navy);font-weight:600}.rolebtns button.on{background:var(--navy);color:#fff}
.rolecard{background:var(--lor);border-radius:var(--r);padding:28px;border-left:6px solid var(--orange);align-self:start}.rolecard .v{font-size:1.25rem;color:var(--navy)}
.faq .cat{margin-top:26px}.qa{border:1px solid var(--line);border-radius:12px;padding:2px 18px;margin-top:8px}.qa summary{display:flex;gap:12px;font-weight:600}.qa summary span{color:var(--orange);flex:none;min-width:28px}.qa p{margin:0 0 14px 40px;color:#39404D}
.hubcard img{width:100%;height:190px;object-fit:cover;border-radius:10px;margin-bottom:12px;background:var(--tint)}
.post{padding:30px 0 40px;border-top:1px solid var(--line)}.post .dek{font-size:1.15rem;color:var(--grey)}.post .by{font-style:italic;color:var(--grey)}.ill{background:var(--lor);border-radius:10px;padding:10px 14px;font-size:.88rem}
.banner{width:100%;border-radius:var(--r);margin:10px 0}.post figure{margin:16px 0}.post figure img{width:100%;border:1px solid var(--line);border-radius:12px}figcaption{font-size:.85rem;color:var(--grey);text-align:center}
.profile{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:16px 0}.profile div{background:var(--tint);border-radius:12px;padding:12px}.profile b{display:block;color:var(--navy);font-size:.85rem}
.foot{background:#08163F;color:#BFC9DD;padding:48px 0 24px;font-size:.92rem}.fgrid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:30px}.foot h4{color:#fff}.foot a{display:block;color:#BFC9DD;text-decoration:none;line-height:1.9}.flogo{height:40px}.foot .small{font-size:.78rem;margin-top:26px;color:#8E9AB5}
.sticky{position:fixed;right:22px;bottom:22px;z-index:30;box-shadow:0 8px 24px rgba(0,0,0,.2)}
[hidden]{display:none!important}
@media(max-width:1000px){.c3,.c4,.creds,.pillars{grid-template-columns:repeat(2,1fr)}.finder,.config,.roles,.cta-grid,.countdown{grid-template-columns:1fr}.stepper .track{grid-template-columns:repeat(3,1fr)}.feats{grid-template-columns:1fr}.top nav{display:none}.menu{display:block;margin-left:auto}.nav-open .top nav{display:flex;position:absolute;top:70px;left:0;right:0;background:#fff;flex-direction:column;padding:12px 24px;border-bottom:1px solid var(--line)}.bar .btn.sm{display:none}}
@media(max-width:640px){.c2,.c3,.c4,.creds,.pillars,.phases,.sizes,.profile,.three,.fgrid{grid-template-columns:1fr}.hero h1{font-size:2.1rem}.hero{padding:56px 0 64px}h2{font-size:1.5rem}.radar li{grid-template-columns:1fr}.finder li{flex-direction:column;align-items:flex-start}
td{display:block;border:0}td:before{content:attr(data-h);display:block;font-size:.75rem;color:var(--grey);font-weight:600}thead{display:none}tr{display:block;border-top:1px solid var(--line);padding:6px 0}.heat td,.life td{display:table-cell}.heat thead,.life thead{display:table-header-group}.heat td:before,.life td:before{display:none}}
body.shot .top,body.shot .foot,body.shot .sticky,body.shot main>section:not(.keep),body.shot .hero:not(.keep){display:none}body.shot .block{padding:28px 0}body.shot .result{position:static}

/* Header menu: always one line. Links and gaps shrink with the screen; below 1200px (where the logo,
   ten links and the button no longer fit side by side) the links move into the ☰ menu. */
.top nav{flex-wrap:nowrap;gap:clamp(10px,1vw,16px);min-width:0}
.top nav a{white-space:nowrap;font-size:clamp(.82rem,.75vw,.92rem)}
.bar .logo,.bar .btn.sm{flex-shrink:0;white-space:nowrap}
@media(max-width:1200px){
  .top nav{display:none}
  .menu{display:block;margin-left:auto}
  .top .logo{display:block}
  .nav-open .top nav{display:flex;position:absolute;top:70px;left:0;right:0;background:#fff;flex-direction:column;gap:4px;padding:12px 24px;border-bottom:1px solid var(--line)}
  .nav-open .top nav a{font-size:.95rem;padding:8px 0}
  .bar .btn.sm{display:none}
}
.nav-open .sticky{display:none}   /* the floating CTA would cover the last links of the open menu */

/* Back to Top (bottom-left) and Prev Page (bottom-right, just left of the floating "Book a scoping call",
   on the same line — site.js sets --cta-w/--cta-h from that button) — the main site's float-buttons.css
   look in the Board-Level orange: circle, thin SVG arrow, label above, soft pulse. Hidden until the page
   is scrolled (html[data-scrolled], set in site.js). */
.bl-float{position:fixed;z-index:31;width:44px;height:44px;border-radius:50%;background:#E8792B;box-shadow:0 6px 16px -4px rgba(232,121,43,.55);text-decoration:none;transition:opacity .35s ease,transform .35s ease,visibility .35s,background-color .3s ease}
.bl-top{left:22px;bottom:calc(22px + (var(--cta-h,44px) - 44px) / 2)}
.bl-back{right:calc(22px + var(--cta-w,44px) + 28px);bottom:calc(22px + (var(--cta-h,44px) - 44px) / 2)}
.bl-float[hidden]{display:none}
html:not([data-scrolled]) .bl-float{opacity:0;visibility:hidden;pointer-events:none;transform:translateY(16px)}
.bl-float i{display:block;width:100%;height:100%;background:center/20px 20px no-repeat}
.bl-top i{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19V5M5 12l7-7 7 7'/%3E%3C/svg%3E");animation:bl-up 1.6s ease-in-out infinite}
.bl-back i{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 12H5M12 19l-7-7 7-7'/%3E%3C/svg%3E");animation:bl-left 1.6s ease-in-out infinite}
.bl-float::after{content:"";position:absolute;inset:0;border-radius:50%;box-shadow:0 0 0 0 rgba(232,121,43,.5);animation:bl-pulse 2.4s ease-out infinite;pointer-events:none}
.bl-back::after{animation-delay:1.2s}
.bl-float span{position:absolute;left:50%;bottom:calc(100% + 6px);transform:translateX(-50%);white-space:nowrap;font-size:12px;font-weight:700;line-height:1.2;color:#E8792B;transition:color .3s ease}
.bl-float:hover{transform:translateY(-3px);background:#cf6419}
.bl-float:hover span{color:#cf6419}
.bl-float:hover i{animation-duration:.8s}
.nav-open .bl-float{display:none}
@keyframes bl-pulse{0%{box-shadow:0 0 0 0 rgba(232,121,43,.5)}70%{box-shadow:0 0 0 8px rgba(232,121,43,0)}100%{box-shadow:0 0 0 0 rgba(232,121,43,0)}}
@keyframes bl-up{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes bl-left{0%,100%{transform:translateX(0)}50%{transform:translateX(-3px)}}
@media (prefers-reduced-motion:reduce){.bl-float::after,.bl-float i{animation:none}.bl-float:hover{transform:none}}
/* desktop menu: links spread evenly across the bar, with breathing room before the button */
@media(min-width:1201px){.top nav{justify-content:space-between;padding-right:clamp(16px,2.5vw,40px)}}
/* phones: Back to Top, Prev Page and the floating CTA share one short line — tighten them so they fit */
@media(max-width:575px){
  .sticky{right:12px;bottom:14px}
  .bl-float{width:40px;height:40px}
  .bl-top{left:12px;bottom:calc(14px + (var(--cta-h,40px) - 40px) / 2)}
  .bl-back{right:calc(12px + var(--cta-w,40px) + 28px);bottom:calc(14px + (var(--cta-h,40px) - 40px) / 2)}
  .bl-top span{left:0;transform:none}   /* centred, "Back to Top" would run off the screen edge */
  .bl-float span{font-size:11px}
}
@media(max-width:340px){.bl-float span{display:none}}   /* too narrow for both labels */

/* Floating "Book a scoping call": a round icon button like Back to Top / Prev Page (calendar icon,
   "Book a Call" label above). The link text stays in the markup for screen readers, hidden visually. */
.sticky{width:44px;height:44px;padding:0;border-radius:50%;font-size:0;line-height:0;color:transparent;overflow:visible;background:#E8792B url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4.5' width='18' height='16.5' rx='2.5'/%3E%3Cpath d='M16 2.5v4M8 2.5v4M3 10h18M9 15.2l2 2 4-4'/%3E%3C/svg%3E") center/21px 21px no-repeat;box-shadow:0 6px 16px -4px rgba(232,121,43,.55);transition:transform .35s ease,background-color .3s ease}
.sticky::before{content:"Book a Call";position:absolute;left:50%;transform:translateX(-50%);bottom:calc(100% + 6px);white-space:nowrap;font-size:12px;font-weight:700;line-height:1.2;color:#E8792B}
.sticky::after{content:"";position:absolute;inset:0;border-radius:50%;box-shadow:0 0 0 0 rgba(232,121,43,.5);animation:bl-pulse 2.4s ease-out infinite .6s;pointer-events:none}
.sticky:hover{transform:translateY(-3px);background-color:#cf6419;filter:none}
@media(max-width:575px){.sticky{width:40px;height:40px;background-size:19px 19px}.sticky::before{font-size:11px}}
@media(max-width:340px){.sticky::before{display:none}}
@media (prefers-reduced-motion:reduce){.sticky::after{animation:none}.sticky:hover{transform:none}}

/* Breadcrumb: the main site's style (assets/css/breadcrumb.css) — navy "Home" pill with a house icon,
   chevrons between items, current page in orange. Icons are SVG here (no Font Awesome on these pages).
   [aria-label] lifts these above the old .intro .crumbs colours. A light version sits on the dark hero. */
.crumbs[aria-label]{margin:0 0 1.1em;font-size:14px;line-height:1.4}
.crumbs[aria-label] ol{display:flex;flex-wrap:wrap;align-items:center;gap:4px 0;list-style:none;margin:0;padding:0}
.crumbs[aria-label] li{display:flex;align-items:center;color:#5b6b80}
.crumbs[aria-label] li+li::before{content:"";width:7px;height:11px;margin:0 12px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 7 11'%3E%3Cpath d='M1 1l4.5 4.5L1 10' fill='none' stroke='%23a3b1c2' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
.crumbs[aria-label] li a{color:#15416e;font-weight:500;text-decoration:none;padding:4px 2px;border-bottom:1px solid transparent;transition:color .2s,border-color .2s}
.crumbs[aria-label] li a:hover{color:#f07f22;border-bottom-color:#f07f22}
.crumbs[aria-label] li[aria-current] span{color:#f07f22;font-weight:600}
.crumbs[aria-label] .crumbs-home{display:inline-flex;align-items:center;gap:7px;padding:5px 12px;border:0;border-radius:20px;background:#15416e;color:#fff;font-size:13px}
.crumbs[aria-label] .crumbs-home::before{content:"";width:14px;height:14px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M12 3 2 11.5h3V21h5.5v-6h3v6H19v-9.5h3z'/%3E%3C/svg%3E") center/contain no-repeat}
.crumbs[aria-label] li a.crumbs-home:hover{background:#f07f22;color:#fff;border-bottom-color:transparent}
.hero .crumbs[aria-label] li{color:#C9D3E8}
.hero .crumbs[aria-label] li a{color:#E4EAF5}
.hero .crumbs[aria-label] li a:hover{color:#FFB37A;border-bottom-color:#FFB37A}
.hero .crumbs[aria-label] li[aria-current] span{color:#FFB37A}
.hero .crumbs[aria-label] .crumbs-home{background:rgba(255,255,255,.14);color:#fff}
.hero .crumbs[aria-label] li a.crumbs-home:hover{background:#f07f22}
@media(max-width:767px){
  .crumbs[aria-label]{font-size:12.5px}
  .crumbs[aria-label] li+li::before{margin:0 8px}
  .crumbs[aria-label] .crumbs-home{padding:5px 9px;font-size:0;gap:0}   /* icon only on phones, as on the main site */
}

/* Insights articles (case studies etc.): same width as the article cards above them, not the 860px .narrow */
#articles .wrap.narrow{max-width:1180px}

/* Overview breadcrumb: its own light strip between the menu bar and the first section (as on the
   main site), not on the banner. */
.crumbs.crumbs-bar{margin:0;background:#f4f7fb;border-bottom:1px solid #e3e9f1}
.crumbs.crumbs-bar ol{padding:14px 0}
@media(max-width:767px){.crumbs.crumbs-bar ol{padding:10px 0}}

/* Footer: brand | page links (two columns, so the list isn't one tall stack) | contact, aligned at the
   top; headings and the legal note line up with the columns; the note is justified. */
.foot .fgrid{grid-template-columns:1.2fr 1.4fr .9fr;gap:48px;align-items:start}
.foot .fgrid>div:first-child p{margin-top:16px;max-width:300px;line-height:1.6}
.foot .fgrid>div:nth-child(2){display:grid;grid-template-columns:1fr 1fr;column-gap:32px}
.foot .fgrid>div:nth-child(2) h4{grid-column:1/-1}
.foot h4{margin:0 0 12px;font-size:1rem;line-height:1.3}
.foot a:hover{color:#fff}
.foot .small{text-align:justify;text-justify:inter-word;hyphens:auto;line-height:1.7;padding-top:22px;border-top:1px solid rgba(255,255,255,.08)}
@media(max-width:1000px){.foot .fgrid{grid-template-columns:1fr 1fr;gap:32px}.foot .fgrid>div:first-child{grid-column:1/-1}}
@media(max-width:575px){.foot .fgrid{grid-template-columns:1fr}.foot .small{text-align:left}}
.foot .small.wrap{border-top:0;background:linear-gradient(rgba(255,255,255,.08),rgba(255,255,255,.08)) center top/calc(100% - 48px) 1px no-repeat}   /* divider in line with the text, not the wrap padding */

/* floating buttons (Back to Top / Prev Page / Book a Call): the main site's green */
.bl-float, .sticky { background-color: #18ba60 !important; box-shadow: 0 6px 16px -4px rgba(24, 186, 96, .55) !important; }
.bl-float:hover, .sticky:hover { background-color: #12a152 !important; }
.bl-float span, .sticky::before { color: #18ba60 !important; }
.bl-float:hover span { color: #12a152 !important; }
.bl-float::after, .sticky::after { animation-name: bl-pulse-green !important; }
@keyframes bl-pulse-green { 0% { box-shadow: 0 0 0 0 rgba(24, 186, 96, .5); } 70% { box-shadow: 0 0 0 8px rgba(24, 186, 96, 0); } 100% { box-shadow: 0 0 0 0 rgba(24, 186, 96, 0); } }

/* "Book a Call" stands out in the orange (Back to Top / Prev Page stay green) */
.sticky { background-color: #E8792B !important; box-shadow: 0 6px 16px -4px rgba(232, 121, 43, .55) !important; }
.sticky:hover { background-color: #cf6419 !important; }
.sticky::before { color: #E8792B !important; }
.sticky::after { animation-name: bl-pulse !important; }

/* menu bar: keep it inside the 1180px layout and give all the room between the logo and the button to the tabs
   (spread with space-between): drop the empty padding after the last tab, even gaps at both ends */
.top .bar{gap:28px}
@media(min-width:1201px){.top nav{padding-right:0;gap:12px}.top nav a{font-size:.84rem}}   /* fixed size: the bar never outgrows the 1180px layout */

/* tabs a little bolder (the active one stays 700) */
.top nav a{font-weight:600}

/* logo box has a fixed size (the SVG is 1506×273, so 36px tall = 199px wide): if the image ever fails to load, its
   long alt text stays inside this box instead of widening the bar and pushing the tabs onto the button */
.bar .logo { overflow: hidden; }
.bar .logo img, .hero-logo img { width: auto; aspect-ratio: 1506 / 273; max-width: 100%; overflow: hidden; color: transparent; font-size: 0; }
.bar .logo img { height: 36px; width: 199px; }
