:root{
  --navy:#0f172a;--navy2:#172033;--ink:#1f2937;--muted:#64748b;--line:#e5e7eb;
  --panel:#f8fafc;--white:#fff;--blue:#2563eb;--teal:#0f766e;--orange:#ea580c;
  --purple:#7c3aed;--radius:22px;--shadow:0 18px 50px rgba(15,23,42,.08);
  --shadow-sm:0 10px 30px rgba(15,23,42,.06);--max:1180px
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:#fff;line-height:1.65}
a{color:inherit;text-decoration:none} img{max-width:100%;display:block}
.container{width:min(var(--max),calc(100% - 40px));margin:auto}
.section{padding:56px 0}.soft,.trust-section{background:var(--panel)}
h1,h2,h3,h4{line-height:1.1;margin:0 0 14px;color:var(--navy)}
h1{font-size:clamp(2.2rem,4.6vw,3.8rem);letter-spacing:-.04em;max-width:900px}
h2{font-size:clamp(1.6rem,2.9vw,2.5rem);letter-spacing:-.03em}
h3{font-size:1.22rem} p{margin:0 0 14px}
.lead{font-size:clamp(1.08rem,2vw,1.32rem);color:var(--muted);max-width:820px}
.eyebrow{display:inline-flex;align-items:center;gap:.5rem;font-size:.78rem;font-weight:900;letter-spacing:.13em;text-transform:uppercase;color:var(--blue);margin-bottom:14px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 19px;border-radius:999px;font-weight:850;border:1px solid var(--navy);transition:.22s ease;cursor:pointer}
.btn-primary{background:var(--navy);color:#fff}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(15,23,42,.18)}
.btn-secondary{background:#fff;color:var(--navy)}.btn-secondary:hover{background:var(--panel);transform:translateY(-2px)}
.btn-row,.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}

/* Navigation */
header,.site-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.92);backdrop-filter:blur(14px);border-bottom:1px solid rgba(229,231,235,.9)}
.nav{display:flex;align-items:center;justify-content:space-between;min-height:76px;gap:24px}
.brand{display:flex;align-items:center;gap:10px;font-weight:950;font-size:1.25rem;color:var(--navy);flex:0 0 auto}
.brand img{height:44px;width:auto;display:block}.logo-mark,.logo-svg{display:none!important}
.nav-links{display:flex;gap:18px;align-items:center;font-weight:750;font-size:.91rem}
.nav-links>a,.nav-item>a{padding:26px 0}
.nav-links a:hover{color:var(--blue)} .nav-cta{padding:11px 16px!important;border-radius:999px;background:var(--navy);color:#fff!important}
.nav-item{position:relative}
.nav-item>a{display:flex;align-items:center;gap:5px}
.chev{font-size:.65em;opacity:.55}
.dropdown{position:absolute;left:-15px;top:calc(100% - 5px);min-width:235px;padding:9px;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 18px 45px rgba(15,23,42,.13);opacity:0;visibility:hidden;transform:translateY(-7px);transition:.18s;z-index:120}
.dropdown a{display:block;padding:10px 12px;border-radius:10px;color:var(--navy)!important;white-space:nowrap}
.dropdown a:hover{background:#f1f5f9;color:var(--blue)!important}
.pillar-connect .dropdown a:hover{color:var(--blue)!important}
.pillar-protect .dropdown a:hover{color:var(--teal)!important}
.pillar-supply .dropdown a:hover{color:var(--orange)!important}
.pillar-support .dropdown a:hover{color:var(--purple)!important}
.nav-item:hover .dropdown,.nav-item:focus-within .dropdown{opacity:1;visibility:visible;transform:none}
.mobile-toggle{display:none;border:0;background:none;font-size:1.45rem}

/* Home hero */
.hero{position:relative;overflow:hidden;padding:64px 0 52px;background:radial-gradient(circle at 85% 15%,rgba(37,99,235,.11),transparent 33%),radial-gradient(circle at 80% 65%,rgba(124,58,237,.09),transparent 30%),linear-gradient(180deg,#fff 0%,#f8fbff 100%)}
.hero:before,.page-hero:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.35;background-image:linear-gradient(rgba(37,99,235,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(37,99,235,.08) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.45),transparent 76%)}
.hero-inner,.hero-grid{position:relative;z-index:2}.hero-grid{display:grid;grid-template-columns:1.18fr .82fr;gap:50px;align-items:center}
.strap{display:inline-flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:24px;font-weight:800;color:var(--muted);font-size:.88rem;letter-spacing:.08em;text-transform:uppercase}.strap b{color:var(--navy)}
.hero-copy{font-size:1.2rem;color:var(--muted);max-width:780px}.trust-line{margin-top:22px;display:flex;gap:18px;flex-wrap:wrap;color:var(--muted);font-size:.95rem;font-weight:700}.trust-line span:before{content:"✓";color:var(--teal);font-weight:900;margin-right:7px}
.hero-visual{position:relative;min-height:420px}.orbit{position:absolute;border:1px solid rgba(37,99,235,.18);border-radius:50%;animation:spin 18s linear infinite}.orbit.one{width:360px;height:360px;right:20px;top:30px}.orbit.two{width:265px;height:265px;right:67px;top:77px;animation-direction:reverse;animation-duration:13s}
.node{position:absolute;width:54px;height:54px;border-radius:16px;display:grid;place-items:center;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);font-weight:900;color:var(--blue);font-size:.82rem}.n1{right:130px;top:8px}.n2{right:0;top:170px}.n3{right:144px;bottom:0}.n4{left:18px;top:176px}
.core{position:absolute;right:105px;top:140px;width:165px;height:165px;border-radius:40px;background:linear-gradient(135deg,var(--navy),#1e3a8a);display:grid;place-items:center;color:#fff;box-shadow:0 28px 70px rgba(37,99,235,.22)}.core svg{width:84px;height:84px}@keyframes spin{to{transform:rotate(360deg)}}

/* Inner-page hero */
.page-hero{position:relative;overflow:hidden;padding:56px 0;min-height:500px;display:flex;align-items:center;background:radial-gradient(circle at 88% 14%,rgba(37,99,235,.11),transparent 31%),linear-gradient(180deg,#fff,#f8fbff)}

/* Slow light-to-dark breathing overlay, sits above the base gradient and grid pattern, below all text/content */
.hero-fade{position:absolute;inset:0;background:rgba(6,10,25,.34);opacity:0;pointer-events:none;animation:hero-breathe 11s ease-in-out infinite alternate;z-index:0}
@keyframes hero-breathe{0%{opacity:0}100%{opacity:1}}
.page-hero .container{position:relative;z-index:2}

/* Home pillars */
.pillars-wrap{margin-top:-28px;position:relative;z-index:4}.pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.pillar{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow-sm);transition:.28s;min-height:210px;position:relative;overflow:hidden}.pillar:hover{transform:translateY(-7px);box-shadow:var(--shadow)}
.pillar:after{content:"";position:absolute;right:-40px;bottom:-45px;width:120px;height:120px;border-radius:50%;opacity:.08;background:currentColor}.pillar-icon{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;color:#fff;font-weight:900;margin-bottom:30px}
.connect{color:var(--blue)}.connect .pillar-icon{background:var(--blue)}.protect{color:var(--teal)}.protect .pillar-icon{background:var(--teal)}.supply{color:var(--orange)}.supply .pillar-icon{background:var(--orange)}.support{color:var(--purple)}.support .pillar-icon{background:var(--purple)}.pillar h3{margin-bottom:8px}.pillar p{color:var(--muted);margin:0}

/* Layout primitives */
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.card{border:1px solid var(--line);border-radius:var(--radius);padding:28px;background:#fff;box-shadow:var(--shadow-sm)}.card p{color:var(--muted)}
.statement{max-width:900px;font-size:clamp(1.35rem,2.4vw,2rem);line-height:1.28;font-weight:800;letter-spacing:-.02em;color:var(--navy);margin-bottom:28px}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:22px}.step{border-top:3px solid var(--blue);padding:24px 4px 0}.step-num{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--navy);color:#fff;font-weight:900;margin-bottom:18px}
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:24px}.service{border:1px solid var(--line);border-radius:var(--radius);padding:28px;transition:.25s;background:#fff}.service:hover{transform:translateY(-4px);box-shadow:var(--shadow-sm);border-color:#cbd5e1}.service .tag{font-size:.78rem;font-weight:900;color:var(--blue);text-transform:uppercase;letter-spacing:.08em}.service p{color:var(--muted)}
.work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.work-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px;min-height:310px;display:flex;flex-direction:column;justify-content:space-between}.work-label{font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:900}.work-card p{color:var(--muted)}.work-meta{font-size:.92rem;font-weight:800;color:var(--navy)}
.health{background:linear-gradient(135deg,var(--navy),#172554 55%,#1d4ed8);color:#fff;border-radius:32px;padding:48px;position:relative;overflow:hidden}.health h2,.health h3{color:#fff}.health p{color:#dbeafe;max-width:780px}
.startup{background:linear-gradient(180deg,#fff7ed,#fff)}.startup-box{border:1px solid #fed7aa;border-radius:28px;padding:42px;background:rgba(255,255,255,.78)}

/* Inner content */
.content{max-width:900px}.content.wide{max-width:none}.content h2{margin-top:50px}.content h3{margin-top:32px}.content ul,.card ul{padding-left:22px}.content li,.card li{margin:8px 0}
.jump-nav{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}.jump-nav a{padding:9px 13px;border:1px solid var(--line);border-radius:999px;background:#fff;font-size:.9rem;font-weight:750;color:var(--navy)}.jump-nav a:hover{border-color:#bfdbfe;color:var(--blue)}
.notice{border-left:4px solid var(--blue);background:#eff6ff;padding:20px 22px;border-radius:0 16px 16px 0;margin:28px 0}.notice.warning{border-left-color:var(--orange);background:#fff7ed}.notice.success{border-left-color:var(--teal);background:#f0fdfa}
.comparison{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:22px 0}.tier{border:1px solid var(--line);border-radius:var(--radius);padding:28px;background:#fff}.tier.featured{border-color:#93c5fd;box-shadow:0 12px 40px rgba(37,99,235,.10)}.tier-label{font-size:.75rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase;color:var(--blue)}
.process{counter-reset:step;display:grid;gap:16px;margin:28px 0}.process-item{display:grid;grid-template-columns:52px 1fr;gap:16px;align-items:start;padding:18px 0;border-top:1px solid var(--line)}.process-item:before{counter-increment:step;content:counter(step);width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--navy);color:#fff;font-weight:900}
.map-card{min-height:260px;border-radius:28px;border:1px solid var(--line);background:radial-gradient(circle at 50% 50%,rgba(37,99,235,.12),transparent 12%),linear-gradient(45deg,#f8fafc 25%,#fff 25%,#fff 50%,#f8fafc 50%,#f8fafc 75%,#fff 75%);background-size:auto,36px 36px;display:grid;place-items:center;text-align:center;padding:32px}
.text-link{font-weight:800;color:var(--blue)}.text-link:hover{text-decoration:underline}

/* Added visual blocks */
.section-band{background:linear-gradient(180deg,#f8fbff,#fff)}.visual-split{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:center}.visual-art{background:linear-gradient(180deg,#f8fbff,#eef6ff);border:1px solid var(--line);border-radius:28px;padding:30px;min-height:330px;display:grid;place-items:center}.visual-flow{display:flex;gap:12px;align-items:center;justify-content:center;flex-wrap:wrap}.flow-node{background:#fff;border:1px solid var(--line);border-radius:16px;padding:15px 17px;font-weight:850;color:var(--navy);box-shadow:0 8px 24px rgba(15,23,42,.06)}.flow-arrow{font-size:1.4rem;color:var(--blue);font-weight:900}
.feature-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.feature-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:26px;box-shadow:0 10px 30px rgba(15,23,42,.05)}.feature-card p{color:var(--muted)}.brand-icon{width:48px;height:48px;border-radius:50%;border:2px solid var(--blue);display:grid;place-items:center;color:var(--blue);font-weight:900;margin-bottom:18px}.brand-rule{height:2px;background:linear-gradient(90deg,var(--blue),#93c5fd,transparent);margin:22px 0}

/* FAQ and CTA */
.faq-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:40px}details{border-top:1px solid var(--line);padding:18px 0}details:last-child{border-bottom:1px solid var(--line)}summary{cursor:pointer;font-weight:800;color:var(--navy);font-size:1.06rem;transition:color .18s ease}details p{color:var(--muted);max-width:850px;margin-top:12px}
.final-cta{text-align:center;background:var(--panel)}.final-cta p{max-width:720px;margin:0 auto 26px;color:var(--muted)}

/* Footer */
footer{background:var(--navy);color:#cbd5e1;padding:52px 0 30px}.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:36px}footer h3,footer h4{color:#fff;font-size:1rem}footer a{display:block;margin:7px 0;color:#cbd5e1}footer a:hover{color:#fff}.footer-grid .sub{padding-left:12px;font-size:.9em;opacity:.88}.footer-bottom{border-top:1px solid rgba(255,255,255,.12);padding-top:22px;margin-top:34px;font-size:.9rem;color:#94a3b8}

/* Animation */
.js .reveal{opacity:0;transform:translateY(18px);transition:.6s ease}.js .reveal.visible{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.js .reveal{opacity:1;transform:none;transition:none}}

@media(max-width:1100px){
 .nav-links{gap:12px;font-size:.86rem}
}
@media(max-width:920px){
 .hero-grid,.visual-split,.faq-grid,.grid-2{grid-template-columns:1fr}
 .pillars,.services-grid,.work-grid,.grid-3,.grid-4,.steps,.comparison,.feature-cards{grid-template-columns:1fr 1fr}
 .footer-grid{grid-template-columns:1fr 1fr}
 .nav-links{display:none;position:absolute;left:20px;right:20px;top:68px;flex-direction:column;align-items:flex-start;background:#fff;border:1px solid var(--line);padding:20px;border-radius:18px;box-shadow:var(--shadow)}
 .nav-links.open{display:flex}.mobile-toggle{display:block}.nav-links>a,.nav-item>a{padding:8px 0}
 .dropdown{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;padding:0 0 0 14px;display:block;background:transparent}
 .dropdown a{padding:7px 0}.hero-visual{min-height:330px}
}
@media(max-width:640px){
 .section{padding:40px 0}.hero{padding:56px 0 44px}.page-hero{padding:48px 0 40px;min-height:0}
 .pillars,.services-grid,.work-grid,.grid-3,.grid-4,.steps,.footer-grid,.comparison,.feature-cards{grid-template-columns:1fr}
 .health{padding:34px 26px}.hero-actions .btn,.btn-row .btn{width:100%}.pillars-wrap{margin-top:-12px}
}


/* ===== v1.2 navigation refinement ===== */
.nav{
  min-height:82px;
}
.nav-links{
  gap:20px;
  font-size:.93rem;
  white-space:nowrap;
}
.nav-links>a,
.nav-item>a{
  padding:28px 0;
}
.nav-cta{
  padding:11px 18px!important;
  margin-left:2px;
}
.dropdown{
  top:calc(100% - 7px);
}
@media(max-width:1180px){
  .nav-links{gap:14px;font-size:.87rem}
}
@media(max-width:1040px){
  .nav-links{
    display:none;
    position:absolute;
    left:20px;
    right:20px;
    top:72px;
    flex-direction:column;
    align-items:stretch;
    gap:2px;
    white-space:normal;
    background:#fff;
    border:1px solid var(--line);
    padding:18px;
    border-radius:18px;
    box-shadow:var(--shadow);
    max-height:calc(100vh - 95px);
    overflow:auto;
  }
  .nav-links.open{display:flex}
  .mobile-toggle{display:block}
  .nav-links>a,.nav-item>a{padding:9px 4px}
  .nav-item{width:100%}
  .dropdown{
    position:static;
    opacity:1;
    visibility:visible;
    transform:none;
    display:block;
    box-shadow:none;
    border:0;
    border-left:2px solid #dbeafe;
    border-radius:0;
    margin:1px 0 8px 6px;
    padding:0 0 0 13px;
    min-width:0;
    background:transparent;
  }
  .dropdown a{padding:7px 4px}
  .nav-cta{text-align:center;margin-top:7px}
}


/* ===== v1.3 clean navigation ===== */
.nav-links{
  gap:30px;
  font-size:.96rem;
}
.nav-links>a,.nav-item>a{padding:28px 0}
.services-menu{min-width:285px}
@media(max-width:1040px){
  .nav-links{gap:2px}
  .nav-links>a,.nav-item>a{padding:9px 4px}
}


/* ===== v1.4 four-pillar navigation ===== */
.nav{min-height:84px}
.pillar-nav{
  gap:8px;
  align-items:center;
  margin-left:auto;
}
.pillar-nav>.nav-item>a{
  padding:28px 14px;
  font-size:.9rem;
  letter-spacing:.055em;
  font-weight:900;
}
.pillar-connect>a{color:var(--blue)}
.pillar-protect>a{color:var(--teal)}
.pillar-supply>a{color:var(--orange)}
.pillar-support>a{color:var(--purple)}
.pillar-connect>a:hover{color:var(--blue)}
.pillar-protect>a:hover{color:var(--teal)}
.pillar-supply>a:hover{color:var(--orange)}
.pillar-support>a:hover{color:var(--purple)}

.pillar-connect>a:after,
.pillar-protect>a:after,
.pillar-supply>a:after,
.pillar-support>a:after{
  content:"";
  display:block;
  height:2px;
  margin-top:5px;
  transform:scaleX(0);
  transition:transform .2s ease;
  transform-origin:left;
  background:currentColor;
}
.pillar-nav>.nav-item:hover>a:after{transform:scaleX(1)}
.secondary-nav{
  display:flex;
  align-items:center;
  gap:18px;
  padding-left:22px;
  margin-left:10px;
  border-left:1px solid var(--line);
  font-size:.9rem;
  font-weight:750;
}
.secondary-nav>a:not(.nav-cta){color:var(--muted)}
.secondary-nav>a:not(.nav-cta):hover{color:var(--navy)}
.support-menu{min-width:260px}

@media(max-width:1080px){
  .pillar-nav{gap:3px}
  .pillar-nav>.nav-item>a{padding:28px 8px;font-size:.82rem}
  .secondary-nav{gap:12px;padding-left:14px;margin-left:4px;font-size:.84rem}
}

@media(max-width:920px){
  .pillar-nav{
    display:none;
    position:absolute;
    left:20px;
    right:20px;
    top:72px;
    flex-direction:column;
    align-items:stretch;
    gap:3px;
    white-space:normal;
    background:#fff;
    border:1px solid var(--line);
    padding:18px;
    border-radius:18px;
    box-shadow:var(--shadow);
    max-height:calc(100vh - 95px);
    overflow:auto;
  }
  .pillar-nav.open{display:flex}
  .pillar-nav>.nav-item>a{padding:10px 4px;font-size:.9rem}
  .secondary-nav{
    border-left:0;
    border-top:1px solid var(--line);
    padding:14px 0 0;
    margin:10px 0 0;
    flex-direction:column;
    align-items:stretch;
    gap:3px;
  }
  .secondary-nav>a{padding:9px 4px}
  .secondary-nav .nav-cta{text-align:center}
}


/* ===== v1.5 homepage brand pillar icons ===== */
.pillars-wrap{
  margin-top:-28px;
  position:relative;
  z-index:4;
}
.pillar{
  display:block;
  color:var(--ink);
}
.pillar-brand-icon{
  width:96px;
  height:96px;
  object-fit:contain;
  margin:0 0 22px;
  transition:transform .25s ease;
}
.pillar:hover .pillar-brand-icon{
  transform:translateY(-3px) scale(1.025);
}
.pillar.connect h3{color:var(--blue)}
.pillar.protect h3{color:var(--teal)}
.pillar.supply h3{color:var(--orange)}
.pillar.support h3{color:var(--purple)}
.pillar p{color:var(--muted)}
@media(max-width:640px){
  .pillar-brand-icon{width:88px;height:88px}
}


/* ==========================================================
   v1.6 NAVIGATION DROPDOWN FIX
   Host-safe stacking, hover bridge and overflow protection
   ========================================================== */

/* Make sure no ancestor clips the menus */
header,
.site-header,
.nav,
.nav-links,
.pillar-nav,
.nav-item {
  overflow: visible !important;
}

/* Keep the complete header/navigation above page content */
header,
.site-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 10000 !important;
  isolation: isolate;
}

.nav {
  position: relative !important;
  z-index: 10001 !important;
}

.nav-links,
.pillar-nav {
  position: relative !important;
  z-index: 10002 !important;
}

.nav-item {
  position: relative !important;
  z-index: 10003 !important;
}

/* Dropdown sits directly underneath the nav item with no dead hover gap */
.nav-item > .dropdown {
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  margin-top: 0 !important;
  min-width: 250px;
  z-index: 20000 !important;

  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: translateY(6px) !important;

  background: #fff !important;
  border: 1px solid var(--line) !important;
  border-radius: 16px !important;
  box-shadow: 0 22px 55px rgba(15,23,42,.18) !important;
  padding: 10px !important;

  transition:
    opacity .15s ease,
    transform .15s ease,
    visibility .15s ease !important;
}

/* Invisible bridge extends the hoverable area between link and menu */
.nav-item > .dropdown::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -10px;
  height: 10px;
}

/* Open on mouse hover OR keyboard focus */
.nav-item:hover > .dropdown,
.nav-item:focus-within > .dropdown,
.nav-item > .dropdown:hover {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateY(0) !important;
}

.nav-item > .dropdown a {
  position: relative;
  z-index: 1;
  display: block !important;
  padding: 11px 13px !important;
  border-radius: 10px !important;
  white-space: nowrap !important;
}

/* Prevent hero / decorative layers from ever covering the menu */
.hero,
.page-hero,
.hero::before,
.page-hero::before,
.hero-visual,
.pillars-wrap,
section,
main {
  z-index: auto;
}

.hero,
.page-hero,
main {
  position: relative;
}

/* Mobile remains click/toggle based and the children are visible */
@media (max-width: 920px) {
  header,
  .site-header {
    isolation: auto;
  }

  .pillar-nav {
    z-index: 20000 !important;
  }

  .nav-item > .dropdown {
    position: static !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: none !important;
    box-shadow: none !important;
    border: 0 !important;
    border-left: 2px solid #dbeafe !important;
    border-radius: 0 !important;
    padding: 0 0 0 14px !important;
    margin: 2px 0 9px 6px !important;
    min-width: 0 !important;
    background: transparent !important;
  }

  .nav-item > .dropdown::before {
    display: none;
  }

  .nav-item > .dropdown a {
    white-space: normal !important;
    padding: 8px 4px !important;
  }
}


/* ==========================================================
   v1.7 AUTHENTICITY / COLOUR / HUMANITY
   ========================================================== */

/* Clearer wordmark: GWB + Tec */
.brand-wordmark{
  display:inline-flex;
  align-items:baseline;
  gap:7px;
  white-space:nowrap;
  line-height:1;
  letter-spacing:-.035em;
}
.brand-gwb{
  font-size:1.7rem;
  font-weight:950;
  color:#1769d2;
}
.brand-tec{
  font-size:1.52rem;
  font-weight:700;
  color:#687386;
}
.footer-brand .brand-gwb{color:#57a9ff}
.footer-brand .brand-tec{color:#d5deea}

/* More colourful inner-page heroes */
.page-hero{
  color:#fff;
  padding:60px 0 48px;
  background:
    radial-gradient(circle at 88% 12%, rgba(255,255,255,.16), transparent 28%),
    linear-gradient(135deg,#0f284b 0%,#1455a6 56%,#198bd0 100%) !important;
}
.page-hero h1,.page-hero h2,.page-hero h3{color:#fff}
.page-hero .lead,.page-hero p{color:rgba(255,255,255,.84)}
.page-hero .eyebrow{color:#bfe2ff}
.page-hero .btn-secondary{color:var(--navy)}
.page-hero:before{
  opacity:.18 !important;
  background-image:
    linear-gradient(rgba(255,255,255,.14) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.14) 1px,transparent 1px) !important;
}
.theme-connect .page-hero{
  background:
    radial-gradient(circle at 88% 12%,rgba(255,255,255,.18),transparent 30%),
    linear-gradient(135deg,#083b68,#0879b8 58%,#31b5dd) !important;
}
.theme-protect .page-hero{
  background:
    radial-gradient(circle at 88% 12%,rgba(255,255,255,.16),transparent 30%),
    linear-gradient(135deg,#073e47,#0f766e 58%,#1ba99b) !important;
}
.theme-supply .page-hero{
  background:
    radial-gradient(circle at 88% 12%,rgba(255,255,255,.16),transparent 30%),
    linear-gradient(135deg,#7c2d12,#c2410c 55%,#fb923c) !important;
}
.theme-support .page-hero{
  background:
    radial-gradient(circle at 88% 12%,rgba(255,255,255,.16),transparent 30%),
    linear-gradient(135deg,#2e1065,#6d28d9 58%,#a78bfa) !important;
}

/* Per-pillar section colour throughout the page, not just the hero */
.theme-connect .soft{background:linear-gradient(180deg,#eff6ff,#f8fbff)}
.theme-protect .soft{background:linear-gradient(180deg,#f0fdfa,#f7fefc)}
.theme-supply .soft{background:linear-gradient(180deg,#fff7ed,#fffaf6)}
.theme-support .soft{background:linear-gradient(180deg,#f5f3ff,#fbfaff)}

.theme-connect .eyebrow{color:var(--blue)}
.theme-protect .eyebrow{color:var(--teal)}
.theme-supply .eyebrow{color:var(--orange)}
.theme-support .eyebrow{color:var(--purple)}

.theme-connect .notice{border-left-color:var(--blue);background:#eff6ff}
.theme-protect .notice{border-left-color:var(--teal);background:#f0fdfa}
.theme-supply .notice{border-left-color:var(--orange);background:#fff7ed}
.theme-support .notice{border-left-color:var(--purple);background:#f5f3ff}
.theme-connect .notice.success,.theme-protect .notice.success,.theme-supply .notice.success,.theme-support .notice.success{border-left-color:var(--teal);background:#f0fdfa}

.theme-connect .tier.featured{border-color:#93c5fd;box-shadow:0 12px 40px rgba(37,99,235,.10)}
.theme-protect .tier.featured{border-color:#5eead4;box-shadow:0 12px 40px rgba(15,118,110,.10)}
.theme-supply .tier.featured{border-color:#fdba74;box-shadow:0 12px 40px rgba(234,88,12,.10)}
.theme-support .tier.featured{border-color:#c4b5fd;box-shadow:0 12px 40px rgba(124,58,237,.10)}
.theme-connect .tier.featured .tier-label{color:var(--blue)}
.theme-protect .tier.featured .tier-label{color:var(--teal)}
.theme-supply .tier.featured .tier-label{color:var(--orange)}
.theme-support .tier.featured .tier-label{color:var(--purple)}

.theme-connect .process-item:before{background:var(--blue)}
.theme-protect .process-item:before{background:var(--teal)}
.theme-supply .process-item:before{background:var(--orange)}
.theme-support .process-item:before{background:var(--purple)}

.theme-connect .text-link,.theme-connect .work-meta a{color:var(--blue)}
.theme-protect .text-link,.theme-protect .work-meta a{color:var(--teal)}
.theme-supply .text-link,.theme-supply .work-meta a{color:var(--orange)}
.theme-support .text-link,.theme-support .work-meta a{color:var(--purple)}

/* Decorative hero badge — the brand pillar icon in a floating card, mirrors the homepage photo card */
.hero-badge{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:210px;height:210px;z-index:2;background:#fff;border-radius:50%;box-shadow:0 25px 60px rgba(0,0,0,.28);display:grid;place-items:center;padding:26px}
.hero-badge img{width:100%;height:100%;object-fit:contain}
.page-hero .container{position:relative}

/* Slow pulsing rings emanating from the hero badge */
.hero-badge::before,.hero-badge::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:50%;
  border:2px solid rgba(255,255,255,.65);
  animation:hero-ring-pulse 4.6s ease-out infinite;
  pointer-events:none;
}
.hero-badge::after{animation-delay:2.3s}
@keyframes hero-ring-pulse{
  0%{transform:scale(1);opacity:.55}
  100%{transform:scale(1.7);opacity:0}
}

/* Fallback slow rings for heroes without an icon badge (company pages, homepage) */
.page-hero:not(:has(.hero-badge))::after,
.human-hero::after{
  content:"";
  position:absolute;
  top:50%;
  right:70px;
  width:190px;
  height:190px;
  border-radius:50%;
  border:2px solid rgba(255,255,255,.32);
  transform:translateY(-50%) scale(1);
  animation:hero-ring-pulse-bg 4.6s ease-out infinite;
  pointer-events:none;
  z-index:1;
}
@keyframes hero-ring-pulse-bg{
  0%{transform:translateY(-50%) scale(1);opacity:.4}
  100%{transform:translateY(-50%) scale(1.85);opacity:0}
}
@media(max-width:920px){
  .page-hero:not(:has(.hero-badge))::after,.human-hero::after{display:none}
}

@media(max-width:1100px){.hero-badge{width:170px;height:170px;right:0}}
@media(max-width:920px){.hero-badge{display:none}}

/* Crisp brand icon badge used inline within content sections */
.icon-badge{width:64px;height:64px;border-radius:18px;display:grid;place-items:center;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-sm);padding:12px;margin-bottom:18px}
.icon-badge img{width:100%;height:100%;object-fit:contain}
.icon-badge.lg{width:88px;height:88px;padding:16px}

/* Photo panel — real photography inside a content section, pairs with visual-split */
.photo-panel{border-radius:28px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow-sm);min-height:280px}
.photo-panel img{width:100%;height:100%;object-fit:cover;display:block;min-height:280px}

/* Homepage hero becomes human, colourful and less generic */
.human-hero{
  position:relative;
  overflow:hidden;
  padding:60px 0 52px;
  color:#fff;
  background:
    linear-gradient(120deg,#0b1f3b 0%,#124a8b 48%,#0a78b8 100%) !important;
}
.human-hero h1{color:#fff;max-width:700px}
.human-hero .hero-copy{color:rgba(255,255,255,.84);max-width:720px}
.human-hero:before{
  opacity:.13;
  mask-image:none;
  background-image:
    linear-gradient(rgba(255,255,255,.12) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.12) 1px,transparent 1px);
}
.hero-content{position:relative;z-index:3}
.customer-strap{
  display:inline-flex;
  gap:8px;
  align-items:center;
  margin-bottom:20px;
  padding:8px 13px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:999px;
  background:rgba(255,255,255,.09);
  backdrop-filter:blur(10px);
  color:#d9edff;
  font-weight:750;
  animation:strap-in .8s ease both;
}
.customer-strap strong{color:#fff}
@keyframes strap-in{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:none}
}
.btn-light{
  background:#fff;
  border-color:#fff;
  color:#102544;
}
.btn-light:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(0,0,0,.18)}
.btn-ghost{
  color:#fff;
  border-color:rgba(255,255,255,.45);
  background:rgba(255,255,255,.06);
}
.btn-ghost:hover{background:rgba(255,255,255,.12);transform:translateY(-2px)}

.local-proof{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:28px;
}
.local-proof span{
  padding:7px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.09);
  color:#dcecff;
  font-size:.84rem;
  font-weight:700;
}

.hero-photo-wrap{position:relative;z-index:3}
.hero-photo-card{
  position:relative;
  border-radius:30px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.22);
  box-shadow:0 30px 70px rgba(0,0,0,.24);
  transform:none;
}
.hero-photo-card img{
  width:100%;
  height:455px;
  object-fit:cover;
  object-position:58% center;
}
.photo-caption{
  position:absolute;
  left:18px;
  right:18px;
  bottom:18px;
  display:flex;
  align-items:flex-start;
  gap:11px;
  padding:14px 16px;
  border-radius:17px;
  background:rgba(9,25,48,.82);
  backdrop-filter:blur(12px);
  color:#fff;
}
.photo-caption small{color:#d3e5f8}
.photo-dot{
  width:10px;height:10px;border-radius:50%;
  background:#5eead4;
  margin-top:6px;
  box-shadow:0 0 0 5px rgba(94,234,212,.12);
  flex:0 0 auto;
}
.hero-glow{
  position:absolute;
  border-radius:50%;
  filter:blur(6px);
  opacity:.55;
  pointer-events:none;
  animation:hero-float 8s ease-in-out infinite alternate;
}
.hero-glow-one{
  width:360px;height:360px;
  background:rgba(56,189,248,.25);
  right:-80px;top:-90px;
}
.hero-glow-two{
  width:260px;height:260px;
  background:rgba(45,212,191,.16);
  left:38%;bottom:-150px;
  animation-delay:-3s;
}
@keyframes hero-float{
  from{transform:translate3d(0,0,0) scale(1)}
  to{transform:translate3d(18px,14px,0) scale(1.08)}
}

/* Authenticity / USP */
.authenticity-section{
  background:#fff;
  padding-top:84px;
}
.authenticity-grid{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:60px;
  align-items:start;
}
.auth-points{display:grid;gap:14px}
.auth-points article{
  padding:23px 24px;
  border:1px solid var(--line);
  border-radius:20px;
  background:linear-gradient(135deg,#fff,#f7fbff);
  box-shadow:var(--shadow-sm);
}
.auth-points strong{
  display:block;
  color:var(--navy);
  font-size:1.08rem;
  margin-bottom:5px;
}
.auth-points p{margin:0;color:var(--muted)}

/* Reused real-world image from existing GWBrix website */
.story-photo{
  border-radius:28px;
  overflow:hidden;
  box-shadow:var(--shadow);
  min-height:410px;
}
.story-photo img{
  width:100%;
  height:100%;
  min-height:410px;
  object-fit:cover;
  object-position:62% center;
}

/* Locality */
.locality-band{
  overflow:hidden;
  background:#0f284b;
  color:#dcecff;
  border-top:1px solid rgba(255,255,255,.08);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.locality-track{
  display:flex;
  justify-content:center;
  gap:18px;
  align-items:center;
  padding:15px 22px;
  white-space:nowrap;
  font-weight:750;
  font-size:.88rem;
  letter-spacing:.02em;
}
.locality-track b{color:#38bdf8}

.local-contact-section{background:#f7fbff}
.area-pills{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:22px;
}
.area-pills span{
  padding:8px 11px;
  border:1px solid #dbe5f0;
  background:#fff;
  border-radius:999px;
  font-size:.86rem;
  font-weight:700;
  color:#38506b;
}
.local-map-card{
  background:
    radial-gradient(circle at 52% 44%,rgba(37,99,235,.18),transparent 10%),
    linear-gradient(45deg,#eef6ff 25%,#fff 25%,#fff 50%,#eef6ff 50%,#eef6ff 75%,#fff 75%);
  background-size:auto,34px 34px;
}
.map-pin{
  width:58px;height:58px;
  display:grid;place-items:center;
  margin:0 auto 14px;
  border-radius:50%;
  background:#1769d2;
  color:#fff;
  font-size:1.7rem;
  box-shadow:0 12px 28px rgba(23,105,210,.22);
}

/* Slightly more visual rhythm */
.card,.service,.work-card,.feature-card,.pillar,.tier{
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}
.card:hover,.service:hover,.work-card:hover,.feature-card:hover{
  transform:translateY(-4px);
  box-shadow:0 16px 36px rgba(15,23,42,.09);
}
.pillar:hover{transform:translateY(-6px)}
.tier:hover{transform:translateY(-4px)}

/* Hover picks up the page's pillar colour, not just the nav */
.theme-connect .card:hover,.theme-connect .service:hover,.theme-connect .feature-card:hover,.theme-connect .tier:hover,.theme-connect .pillar:hover{border-color:var(--blue);box-shadow:0 16px 36px rgba(37,99,235,.14)}
.theme-protect .card:hover,.theme-protect .service:hover,.theme-protect .feature-card:hover,.theme-protect .tier:hover,.theme-protect .pillar:hover{border-color:var(--teal);box-shadow:0 16px 36px rgba(15,118,110,.14)}
.theme-supply .card:hover,.theme-supply .service:hover,.theme-supply .feature-card:hover,.theme-supply .tier:hover,.theme-supply .pillar:hover{border-color:var(--orange);box-shadow:0 16px 36px rgba(234,88,12,.14)}
.theme-support .card:hover,.theme-support .service:hover,.theme-support .feature-card:hover,.theme-support .tier:hover,.theme-support .pillar:hover{border-color:var(--purple);box-shadow:0 16px 36px rgba(124,58,237,.14)}

.theme-connect .jump-nav a:hover{border-color:var(--blue);color:var(--blue)}
.theme-protect .jump-nav a:hover{border-color:var(--teal);color:var(--teal)}
.theme-supply .jump-nav a:hover{border-color:var(--orange);color:var(--orange)}
.theme-support .jump-nav a:hover{border-color:var(--purple);color:var(--purple)}

.theme-connect .btn-secondary:hover{border-color:var(--blue);color:var(--blue)}
.theme-protect .btn-secondary:hover{border-color:var(--teal);color:var(--teal)}
.theme-supply .btn-secondary:hover{border-color:var(--orange);color:var(--orange)}
.theme-support .btn-secondary:hover{border-color:var(--purple);color:var(--purple)}

.theme-connect details:hover summary{color:var(--blue)}
.theme-protect details:hover summary{color:var(--teal)}
.theme-supply details:hover summary{color:var(--orange)}
.theme-support details:hover summary{color:var(--purple)}

@media(max-width:920px){
  .authenticity-grid{grid-template-columns:1fr;gap:32px}
  .hero-photo-card{transform:none}
  .hero-photo-card img{height:360px}
  .locality-track{justify-content:flex-start;overflow-x:auto}
}
@media(max-width:640px){
  .human-hero{padding:76px 0 68px}
  .hero-photo-card img{height:300px}
  .photo-caption{position:static;border-radius:0}
  .customer-strap{font-size:.82rem}
}

/* ==========================================================
   Reviews + partner marquee
   ========================================================== */
.reviews-summary{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:28px}
.review-stars{color:#f5a623;font-size:1.3rem;letter-spacing:2px}
.reviews-summary-text{font-weight:800;color:var(--navy)}
.reviews-summary-text span{font-weight:600;color:var(--muted)}
.review-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.review-card{border:1px solid var(--line);border-radius:var(--radius);padding:24px;background:#fff;box-shadow:var(--shadow-sm)}
.review-card .review-stars{font-size:1rem;display:block;margin-bottom:10px}
.review-card p{color:var(--ink);font-size:.97rem;margin-bottom:14px}
.review-card .reviewer{font-size:.88rem;font-weight:800;color:var(--navy)}
.review-card .reviewer span{display:block;font-weight:600;color:var(--muted);font-size:.85rem}
.google-badge{display:inline-flex;align-items:center;gap:8px;font-weight:800;color:var(--navy);font-size:.9rem}

.marquee{overflow:hidden;position:relative;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee-track{display:flex;align-items:center;gap:56px;width:max-content;animation:marquee-scroll 28s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
.partner-badge{font-weight:900;font-size:1.15rem;letter-spacing:-.01em;color:#94a3b8;white-space:nowrap;transition:color .2s ease}
.partner-badge:hover{color:var(--navy)}
.partner-badge img{height:34px;width:auto;display:block;filter:grayscale(1);opacity:.55;transition:filter .2s ease,opacity .2s ease}
.partner-badge:hover img{filter:grayscale(0);opacity:1}
@keyframes marquee-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

@media(max-width:768px){
  .review-grid{grid-template-columns:1fr}
}


/* ==========================================================
   v1.8 MOBILE NAVIGATION FIX
   ========================================================== */
@media (max-width: 1040px) {
  header,
  .site-header { overflow: visible !important; }

  .nav { position: relative !important; }

  .mobile-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
    color: var(--navy);
    font-size: 1.45rem;
    line-height: 1;
    cursor: pointer;
    position: relative;
    z-index: 30002;
  }

  .nav-links.pillar-nav {
    display: none;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: calc(100% + 8px) !important;
    width: auto !important;
    margin: 0 !important;
    flex-direction: column;
    align-items: stretch;
    gap: 2px;
    white-space: normal;
    background: #fff;
    border: 1px solid var(--line);
    padding: 14px;
    border-radius: 18px;
    box-shadow: 0 22px 55px rgba(15,23,42,.18);
    max-height: calc(100dvh - 110px);
    overflow-y: auto !important;
    overflow-x: hidden !important;
    z-index: 30000 !important;
  }

  .nav-links.pillar-nav.open { display: flex; }

  .pillar-nav > .nav-item { width: 100%; }

  .pillar-nav > .nav-item > a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 12px 8px !important;
    font-size: .92rem;
  }

  .pillar-nav > .nav-item > a::after { display: none !important; }
  .pillar-nav .chev { transition: transform .18s ease; font-size: .7rem; }
  .pillar-nav .nav-item.submenu-open > a .chev { transform: rotate(180deg); }

  /* Collapse pillar children on mobile; parent row opens them. */
  .pillar-nav .nav-item > .dropdown {
    display: none !important;
    position: static !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: none !important;
    box-shadow: none !important;
    border: 0 !important;
    border-left: 2px solid #dbeafe !important;
    border-radius: 0 !important;
    padding: 2px 0 4px 14px !important;
    margin: 0 0 7px 8px !important;
    min-width: 0 !important;
    background: transparent !important;
  }

  .pillar-nav .nav-item.submenu-open > .dropdown { display: block !important; }
  .pillar-nav .nav-item > .dropdown a {
    white-space: normal !important;
    padding: 9px 6px !important;
  }

  .secondary-nav {
    width: 100%;
    border-left: 0;
    border-top: 1px solid var(--line);
    padding: 12px 0 0;
    margin: 8px 0 0;
    flex-direction: column;
    align-items: stretch;
    gap: 2px;
  }

  .secondary-nav > a { padding: 10px 8px !important; }
  .secondary-nav .nav-cta { margin: 6px 0 0 !important; text-align: center; }
}

@media (max-width: 640px) {
  .nav-links.pillar-nav {
    left: -4px !important;
    right: -4px !important;
    border-radius: 14px;
  }
}

/* ==========================================================
   v1.9 TOP CONTACT BAR + FOOTER CONTACT
   ========================================================== */
.topbar{background:var(--navy);color:#cbd5e1;font-size:.85rem}
.topbar-inner{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:36px}
.topbar-contact{display:flex;gap:20px;flex-wrap:wrap}
.topbar a{color:#fff;font-weight:600}.topbar a:hover{text-decoration:underline}
.footer-contact a{color:#fff;font-weight:600}
@media (max-width:640px){.topbar-tag{display:none}.topbar-inner{justify-content:center}}
@media (max-width:1040px){.nav-links.pillar-nav{max-height:calc(100dvh - 150px)}}

/* ==========================================================
   v1.9 CASE STUDY PAGES
   ========================================================== */
.case-grid{display:grid;grid-template-columns:2fr 1fr;gap:32px;align-items:start}
.case-facts{margin:0}
.case-facts dt{font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:900;margin-top:18px}
.case-facts dt:first-child{margin-top:0}
.case-facts dd{margin:4px 0 0;font-weight:700;color:var(--navy)}
.case-facts a{color:var(--blue)}
.case-quote{margin:14px 0 0;background:var(--navy);color:#e2e8f0;border-radius:var(--radius);padding:clamp(24px,5vw,48px)}
.case-quote blockquote{margin:0;max-width:860px;font-size:1.08rem}
.case-quote figcaption{margin-top:20px;color:#fff;font-weight:800}
.case-quote figcaption span{display:block;font-weight:500;color:#94a3b8}
@media (max-width:920px){.case-grid{grid-template-columns:1fr}}
.case-related a{color:var(--blue);text-decoration:underline}
.case-card{padding:0;overflow:hidden;justify-content:flex-start;gap:0}
.case-card>div{padding:0 26px}
.case-card>div:last-child{padding:4px 26px 26px;margin-top:auto}
.case-card-logo{display:grid;place-items:center;height:180px;border-bottom:1px solid var(--line);margin-bottom:22px;padding:24px}
.case-card-logo img{max-height:132px;max-width:100%;width:auto;object-fit:contain}
.case-tags{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 18px}
.case-tags span{padding:4px 10px;border:1px solid #dbe5f0;border-radius:999px;font-size:.78rem;font-weight:700;color:var(--navy);background:#fff}
.case-involved-title{margin-top:36px}
.case-involved{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.case-involved>div{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px 10px;box-shadow:var(--shadow-sm);font-weight:800;font-size:.86rem;line-height:1.25;color:var(--navy)}
.case-involved svg{width:34px;height:34px;fill:none;stroke:var(--blue);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:920px){.case-involved{grid-template-columns:repeat(3,1fr)}}
@media (max-width:520px){.case-involved{grid-template-columns:repeat(2,1fr)}}
/* Pillar colour coding for case study tiles and tags */
.p-connect{--pc:var(--blue)}.p-protect{--pc:var(--teal)}.p-supply{--pc:var(--orange)}.p-support{--pc:var(--purple)}
.case-involved>div[class^="p-"]{border-top:4px solid var(--pc)}
.case-involved>div[class^="p-"] svg{stroke:var(--pc)}
.case-tags span[class^="p-"]{color:var(--pc);border-color:color-mix(in srgb,var(--pc) 35%,#fff);background:color-mix(in srgb,var(--pc) 7%,#fff)}
.footer-legal{font-size:.8rem;line-height:1.5;color:#94a3b8;margin:0 0 14px}

/* Cookie consent banner */
.cookie-banner{position:fixed;left:16px;right:16px;bottom:16px;z-index:20000;max-width:760px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 22px 55px rgba(15,23,42,.18);padding:20px 22px;display:flex;gap:18px;align-items:center}
.cookie-banner[hidden]{display:none}
.cookie-banner p{margin:0;font-size:.92rem;color:var(--ink)}
.cookie-banner a{color:var(--blue);text-decoration:underline}
.cookie-actions{display:flex;gap:10px;flex:0 0 auto}
.cookie-actions .btn{border:1px solid var(--navy)}
@media (max-width:640px){.cookie-banner{flex-direction:column;align-items:stretch}.cookie-actions .btn{flex:1}}
.consent-placeholder{border:1px dashed #cbd5e1;border-radius:var(--radius);padding:28px;text-align:center;background:var(--panel)}
.consent-placeholder[hidden]{display:none}
.footer-bottom a,.footer-bottom button{display:inline;margin:0;color:#cbd5e1;background:none;border:0;padding:0;font:inherit;cursor:pointer;text-decoration:underline}
.policy a,.text-button{color:var(--blue);text-decoration:underline}
.text-button{background:none;border:0;padding:0;font:inherit;cursor:pointer}