/* SOL Growth — shared top bar (every marketing page).
   One component, scoped under .tb so it sits safely on both page families (unified.css and the
   older redesign.css pages). 14px regular links, one row at every width, dropdowns for the five
   divisions and the company pages, phone + Contact on the right, a full-screen dark menu on phones.
   Tone: .tb--overlay floats transparent over a dark hero and turns to paper once the page scrolls. */
.tb{--tb-ink:#1A1916;--tb-muted:#5E5B53;--tb-line:#E6E0D5;--tb-paper:#FBF9F5;--tb-teal:#0F8B8D;--tb-gold:#C8922A;
  position:sticky;top:0;z-index:80;width:100%;font-family:Inter,"Noto Sans Arabic",system-ui,sans-serif;
  background:color-mix(in srgb,var(--tb-paper) 88%,transparent);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);
  border-bottom:1px solid var(--tb-line);color:var(--tb-ink);transition:background-color .3s cubic-bezier(.16,1,.3,1),color .3s,border-color .3s}
.tb *{box-sizing:border-box}
.tb a{color:inherit;text-decoration:none}
.tb-row{max-width:1240px;margin-inline:auto;padding-inline:24px;height:72px;display:flex;align-items:center;gap:28px}
.tb-logo{display:flex;align-items:center;flex:none}
.tb-logo img{height:26px;width:auto;max-width:none;display:block;transition:filter .3s}
.tb-nav{display:flex;align-items:center;gap:4px;margin-inline-start:8px}
.tb-nav>a,.tb-dd>button{font:inherit;font-size:14px;font-weight:400;line-height:1;white-space:nowrap;color:inherit;opacity:.78;
  background:none;border:0;cursor:pointer;padding:10px 12px;border-radius:999px;display:inline-flex;align-items:center;gap:6px;transition:opacity .2s,background-color .2s}
.tb-nav>a:hover,.tb-dd>button:hover,.tb-dd.open>button{opacity:1}
.tb-nav>a[aria-current="page"]{opacity:1;font-weight:500}
.tb-chev{width:12px;height:12px;flex:none;transition:transform .2s cubic-bezier(.16,1,.3,1)}
.tb-dd{position:relative}
.tb-dd.open .tb-chev{transform:rotate(180deg)}
.tb-menu{position:absolute;top:calc(100% + 10px);inset-inline-start:0;min-width:236px;padding:8px;border-radius:16px;background:#fff;color:var(--tb-ink);
  border:1px solid var(--tb-line);box-shadow:0 24px 60px -24px rgba(26,25,22,.35);opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .2s cubic-bezier(.16,1,.3,1),transform .2s cubic-bezier(.16,1,.3,1),visibility 0s linear .2s}
.tb-dd.open .tb-menu{opacity:1;visibility:visible;transform:none;transition:opacity .2s cubic-bezier(.16,1,.3,1),transform .2s cubic-bezier(.16,1,.3,1)}
.tb-menu a{display:block;padding:10px 12px;border-radius:10px;font-size:14px;line-height:1.3}
.tb-menu a small{display:block;font-size:12px;color:var(--tb-muted);margin-top:2px}
.tb-menu a:hover{background:#F4F1EA}
.tb-tools{margin-inline-start:auto;display:flex;align-items:center;gap:6px}
.tb-tools>a,.tb-lang{font:inherit;font-size:14px;font-weight:400;white-space:nowrap;color:inherit;opacity:.78;background:none;border:0;cursor:pointer;
  padding:10px 10px;display:inline-flex;align-items:center;gap:8px;transition:opacity .2s}
.tb-tools>a:hover,.tb-lang:hover{opacity:1}
.tb-ico{width:16px;height:16px;flex:none}
.tb-phone span{direction:ltr;unicode-bidi:isolate}
.tb-cta{font:inherit;font-size:14px;font-weight:500;white-space:nowrap;padding:10px 18px;border-radius:999px;background:var(--tb-ink);color:#fff!important;opacity:1!important;
  margin-inline-start:6px;transition:transform .2s cubic-bezier(.16,1,.3,1),background-color .2s}
.tb-cta:hover{transform:scale(1.03);background:var(--tb-teal)}
.tb-cta:active{transform:scale(.97)}
.tb-burger{display:none;width:44px;height:44px;border-radius:12px;border:1px solid currentColor;border-color:color-mix(in srgb,currentColor 25%,transparent);
  background:none;color:inherit;cursor:pointer;align-items:center;justify-content:center;margin-inline-start:auto}
.tb-burger svg{width:20px;height:20px}

/* over a dark hero */
.tb--overlay{position:fixed;inset-inline:0;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;border-color:transparent;color:#fff}
.tb--overlay .tb-logo img{filter:brightness(0) invert(1)}
.tb--overlay .tb-cta{background:#fff;color:var(--tb-ink)!important}
.tb--overlay .tb-cta:hover{background:#fff}
.tb--overlay.tb--solid{background:color-mix(in srgb,var(--tb-paper) 92%,transparent);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);
  border-color:var(--tb-line);color:var(--tb-ink)}
.tb--overlay.tb--solid .tb-logo img{filter:none}
.tb--overlay.tb--solid .tb-cta{background:var(--tb-ink);color:#fff!important}

/* full-screen menu (phones and small tablets) */
.tb-sheet{position:fixed;inset:0;z-index:90;background:#0E0D0B;color:#fff;display:flex;flex-direction:column;padding:20px 24px 28px;overflow-y:auto;
  opacity:0;visibility:hidden;transition:opacity .3s cubic-bezier(.16,1,.3,1),visibility 0s linear .3s}
.tb-sheet.open{opacity:1;visibility:visible;transition:opacity .3s cubic-bezier(.16,1,.3,1)}
.tb-sheet-top{display:flex;align-items:center;justify-content:space-between;height:52px}
.tb-sheet-top img{height:24px;width:auto;filter:brightness(0) invert(1)}
.tb-x{width:44px;height:44px;border:1px solid rgba(255,255,255,.2);border-radius:12px;background:none;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center}
.tb-x svg{width:20px;height:20px}
.tb-sheet h4{margin:26px 0 6px;font-size:12px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.tb-sheet nav a{display:block;padding:12px 0;font-size:22px;font-weight:600;border-bottom:1px solid rgba(255,255,255,.1);color:#fff;text-decoration:none}
.tb-sheet-foot{margin-top:28px;display:grid;gap:10px}
.tb-sheet-foot a,.tb-sheet-foot button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;border-radius:999px;font:inherit;font-size:15px;
  border:1px solid rgba(255,255,255,.22);background:none;color:#fff;text-decoration:none;cursor:pointer}
.tb-sheet-foot .tb-sheet-cta{background:#fff;color:#1A1916;border-color:#fff;font-weight:600}
.tb-sheet-foot span[dir]{unicode-bidi:isolate}
html.tb-lock,html.tb-lock body{overflow:hidden}

@media (max-width:1180px){.tb-row{gap:16px}}
@media (max-width:1020px){.tb-nav,.tb-tools{display:none}.tb-burger{display:flex}}
@media (prefers-reduced-motion:reduce){.tb,.tb *{transition:none!important}}

/* Shared photo band — two photographs under a page hero (About, How we work, Careers, Social,
   Support, Insights). Lives here because this file is already on every page of both families. */
.pband{padding:8px 0 72px}
.pband-in{max-width:1180px;margin-inline:auto;padding-inline:24px;display:grid;grid-template-columns:1.55fr 1fr;gap:14px}
.pband figure{margin:0;position:relative;border-radius:20px;overflow:hidden;background:#F4F1EA;aspect-ratio:16/10;box-shadow:0 24px 50px -30px rgba(26,25,22,.45)}
.pband figure:last-child{aspect-ratio:auto}
.pband img{width:100%;height:100%;object-fit:cover;display:block}
.pband figcaption{position:absolute;inset-inline-start:14px;bottom:14px;max-width:calc(100% - 28px);padding:8px 12px;border-radius:10px;
  background:rgba(14,13,11,.62);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);color:#fff;font-size:13px;line-height:1.4}
@media (max-width:760px){.pband-in{grid-template-columns:1fr}.pband figure:last-child{aspect-ratio:4/3}}

/* The older pages (redesign.css) restyle bare links; pin the button colours. */
.tb .tb-cta{background:var(--tb-ink)!important;color:#fff!important}
.tb .tb-cta:hover{background:var(--tb-teal)!important}
.tb.tb--overlay:not(.tb--solid) .tb-cta{background:#fff!important;color:var(--tb-ink)!important}
/* The older pages padded their heroes for a fixed 68–70px bar; this bar takes its own space. */
.careers-hero{padding-top:0!important;min-height:60vh!important}
.page-hero{padding-top:72px!important}
.hero-social{padding-top:40px!important}
