/* StruXure.co site chrome: the Kinetech family header, scroll bubble and map footer (ported from
   kinetech-scheme-lab-20261028/hubspot-staging/theme/kinetech-v3/modules/kt-switch-header.module/module.css, 6 Nov 2026),
   then StruXure's additions at the end: logo size, the App Store notice and the drawn elevation in the footer. */
/* Kinetech site chrome 2026: Switcher 1 header, scroll pill, map footer. Prototype source for kt-switch-header / kt-switch-footer. */
.kc *{box-sizing:border-box}
.kc{font-family:Montserrat,system-ui,-apple-system,sans-serif;color:#21242C;-webkit-font-smoothing:antialiased;line-height:1.4}
.kc a{text-decoration:none;color:inherit}
.kc button{font:inherit;margin:0;line-height:1}
.kc .cv{width:10px;height:6px;flex:none;display:inline-block;transition:transform .2s}
.kc .w{width:min(100% - 48px,1180px);margin-inline:auto}
html{scroll-padding-top:100px}
/* header bar. Keep the .kc-h class name: the switch drafts hide their old section-nav row with html:has(.kc-h) */
.kc-h{position:sticky;top:0;z-index:1000;background:#F2FAFC;border-bottom:1px solid #D5DEE3;transition:transform .25s ease,opacity .2s}
.kc-h .w{display:flex;align-items:center;gap:22px;height:76px}
.kc-lock{display:flex;align-items:center;gap:14px;flex:none}
.kc-logo img{height:24px;width:auto;display:block}
.kc-sl{width:1px;height:22px;background:#B9C6CE}
.kc-sw{position:relative}
.kc-swb{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 12px;border-radius:8px;background:#fff;border:1px solid #D5DEE3;color:#102D7B;font-weight:600;font-size:15px;cursor:pointer;white-space:nowrap}
.kc-swb:hover,.kc-open .kc-swb{border-color:#027AA2}
.kc-open .kc-swb{box-shadow:0 0 0 3px rgba(2,122,162,.12)} .kc-open .kc-swb .cv{transform:rotate(180deg)}
.kc-nav{display:flex;align-items:center;gap:4px;margin-left:auto}
.kc-l{display:inline-flex;align-items:center;gap:6px;padding:8px 10px;font-size:14.4px;color:#4A5568;background:none;border:0;cursor:pointer;white-space:nowrap;border-radius:0}
.kc-l:hover,.kc-l.lit{color:#027AA2;box-shadow:inset 0 -2px 0 #027AA2}
.kc-l[aria-current=page]{color:#102D7B;font-weight:600}
.kc-dd{position:relative}
.kc-sub{position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%);min-width:250px;display:none;flex-direction:column;background:#fff;border-radius:10px;box-shadow:0 0 0 1px rgba(16,45,123,.08),0 14px 30px rgba(16,45,123,.14);padding:6px;z-index:5}
.kc-dd.open .kc-sub{display:flex}
@media (hover:hover){.kc-dd:hover .kc-sub{display:flex}.kc-dd:hover::after{content:"";position:absolute;left:0;right:0;top:100%;height:12px}}
.kc-sub a{font-size:14px;color:#4A5568;padding:9px 12px;border-radius:6px}.kc-sub a:hover{background:#F2FAFC;color:#027AA2}
.kc-cta{flex:none;display:inline-flex;align-items:center;height:44px;padding:10px 24px;border-radius:8px;background:#027AA2;color:#fff!important;font-weight:600;font-size:14px;white-space:nowrap}
.kc-cta:hover{background:#02688A}
.kc-burger{display:none;margin-left:auto;border:1px solid #D5DEE3;border-radius:8px;padding:9px 12px;background:#fff;color:#21242C;font-weight:600;font-size:13.5px;cursor:pointer}
/* switcher panel (Switcher 1: four districts) */
.kc-pan{position:absolute;top:calc(100% + 18px);left:-6px;width:600px;background:#fff;border-radius:14px;box-shadow:0 0 0 1px rgba(16,45,123,.08),0 24px 48px rgba(16,45,123,.16);display:none;overflow:hidden;z-index:10}
.kc-open .kc-pan{display:block}
.kc-g{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:16px}
.kc-c{position:relative;display:block;border:1px solid #E3EBF0;border-radius:10px;padding:10px 12px 12px;background:#FBFDFE;transition:border-color .15s,background .15s}
.kc-c:hover{border-color:#9FCFE0;background:#fff}
.kc-c img{display:block;width:100%;height:96px;object-fit:cover;object-position:center;margin-bottom:6px;border-radius:6px}
.kc-c b{display:flex;align-items:center;gap:6px;font-weight:600;font-size:15px;color:#102D7B}
.kc-c small{display:block;font-size:12px;color:#6B7785;margin-top:2px}
.kc-c.cur{border-color:#027AA2;background:#F2FAFC}
.kc-here{position:absolute;top:10px;right:10px;font-weight:600;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:#fff;background:#102D7B;border-radius:4px;padding:3px 6px}
.kc-ph{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;background:#F2FAFC;border-top:1px solid #E3EBF0;font-size:13px;color:#4A5568}
.kc-ph a:first-child{font-weight:600;color:#102D7B}.kc-ph span{display:flex;gap:14px;flex-wrap:wrap}.kc-ph a:hover{color:#027AA2}
/* phone drawer */
.kc-drawer{display:none;border-top:1px solid #D5DEE3;background:#fff;padding:6px 16px 16px}
.kc-menu .kc-drawer{display:grid}
.kc-drawer a{padding:12px 0;border-bottom:1px solid #EEF2F4;font-weight:500;font-size:15px;color:#21242C}
.kc-drawer .h{padding:14px 0 4px;font-weight:600;font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:#6B7785}
.kc-drawer .kc-cta{margin-top:14px;justify-content:center;height:48px}
/* scroll pill */
.kc-pill{position:fixed;top:12px;left:50%;z-index:1001;display:flex;align-items:center;gap:12px;max-width:calc(100% - 24px);background:rgba(255,255,255,.92);-webkit-backdrop-filter:blur(12px) saturate(1.4);backdrop-filter:blur(12px) saturate(1.4);border:1px solid #D5DEE3;border-radius:999px;padding:6px 6px 6px 16px;box-shadow:0 10px 30px rgba(16,45,123,.14);font-size:13.5px;color:#4A5568;transform:translate(-50%,-140%);opacity:0;transition:transform .3s cubic-bezier(.2,.8,.2,1),opacity .2s;overflow:visible}
.kc-scrolled .kc-pill{transform:translate(-50%,0);opacity:1}
.kc-scrolled .kc-h:not(.kc-open):not(.kc-menu){transform:translateY(-100%);opacity:0;pointer-events:none}
.kc-pill img{height:18px;display:block}.kc-pill .d{width:1px;height:16px;background:#C9D5DD;flex:none}
.kc-pill .s{display:inline-flex;align-items:center;gap:6px;color:#102D7B;font-weight:600;background:none;border:0;cursor:pointer;padding:6px 2px}
.kc-pill .pg{color:#027AA2;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:22ch}
.kc-pill .kc-cta{height:34px;padding:0 14px;border-radius:999px;font-size:13px}
.kc-pill .pr{position:absolute;left:18px;right:18px;bottom:-1px;height:2px;border-radius:2px;background:linear-gradient(#00AEE6,#00AEE6) left/var(--p,0%) 100% no-repeat}
.kc-pill .kc-pan{top:calc(100% + 12px);left:50%;transform:translateX(-50%)}
.kc-pill.kc-open .kc-pan{display:block}
/* footer */
.kc-f{background:linear-gradient(#fff,#F2FAFC);border-top:1px solid #D5DEE3;color:#4A5568;font-size:14px}
.kc-f .top{display:grid;grid-template-columns:1fr 1.15fr;gap:40px;align-items:center;padding:52px 0 24px}
.kc-f h2{margin:0 0 8px;font-weight:600;font-size:26px;line-height:1.25;color:#102D7B;letter-spacing:-.01em}
.kc-f .top p{margin:0 0 18px;max-width:42ch}
.kc-f .mp{position:relative}.kc-f .mp img{display:block;width:100%;height:auto}
.kc-f .ml{position:absolute;transform:translate(-50%,-50%);font-weight:600;font-size:12.5px;background:#fff;color:#21242C;border-radius:6px;padding:5px 9px;box-shadow:0 1px 3px rgba(16,45,123,.2);white-space:nowrap}
.kc-f .ml:hover{color:#027AA2}.kc-f .ml.cur{background:#102D7B;color:#fff}.kc-f .ml small{font-weight:500;opacity:.75;margin-left:4px;font-size:11px}
.kc-f .cols{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;padding:28px 0;border-top:1px solid #D5DEE3}
.kc-f .col{display:flex;flex-direction:column;gap:8px}
.kc-f .col b{font-weight:600;font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:#21242C;margin-bottom:2px}
.kc-f .col.here b{color:#027AA2}.kc-f .col a:hover{color:#027AA2}
.kc-f .bot{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:16px 0 28px;border-top:1px solid #D5DEE3;font-size:12.5px}
.kc-f .bot img{height:20px;display:block}.kc-f .soc{display:flex;gap:14px}
/* focus */
.kc a:focus-visible,.kc button:focus-visible{outline:2px solid #027AA2;outline-offset:3px;border-radius:6px}
@media (prefers-reduced-motion:reduce){.kc-h,.kc-pill,.kc .cv{transition:none}}
/* small screens */
@media (max-width:1239px){.kc-nav,.kc-h .kc-cta{display:none}.kc-burger{display:inline-block}}
@media (max-width:760px){
  .kc .w{width:calc(100% - 32px)}.kc-h .w{height:64px;gap:10px}
  .kc-logo img{height:20px}.kc-swb{height:34px;font-size:14px;padding:0 10px}
  .kc-pan{position:fixed;left:12px;right:12px;top:72px;width:auto}
  .kc-h .kc-sw{position:static}.kc-h .kc-pan{position:absolute;top:calc(100% + 8px);left:12px;right:12px} /* under the header wherever it sits, so the App Store bar above cannot push the header into the panel (bot, 9 Nov) */
  .kc-g{padding:12px;gap:8px}.kc-c img{height:70px}.kc-c b{font-size:13.5px}
  .kc-ph{flex-direction:column;align-items:flex-start;gap:8px}
  .kc-pill{gap:10px;padding-left:12px}.kc-pill .pg,.kc-pill .d2{display:none}
  .kc-pill .kc-pan{position:fixed;top:64px;left:12px;right:12px;transform:none}
  .kc-f .top{grid-template-columns:1fr;padding-top:36px}.kc-f h2{font-size:21px}.kc-f .ml{font-size:11px;padding:4px 7px}
  .kc-f .cols{grid-template-columns:1fr 1fr}
}
/* old-theme pages set button fonts with high specificity; pin ours */
.kc button{font-family:Montserrat,system-ui,-apple-system,sans-serif!important;letter-spacing:normal!important;text-transform:none!important;line-height:1!important}
.kc .kc-swb{font-size:15px!important;font-weight:600!important}
.kc button.kc-l{font-size:14.4px!important;font-weight:400!important}
.kc-pill button{font-size:13.5px!important;font-weight:600!important}
.kc button.kc-l{color:#4A5568!important}.kc button.kc-l[aria-expanded=true]{color:#102D7B!important}
.kc .kc-burger{font-size:13.5px!important;font-weight:600!important;color:#21242C!important}

/* pages that keep the browser's default 8px body margin (document-style pages) */
body:has(> #kc-header),body:has(> .kc){margin:0}
/* old theme styles any .col (width/flex/centering); pin the footer columns */
.kc-f .cols>.col{width:auto!important;max-width:none!important;min-width:0!important;flex:none!important;float:none!important;padding:0!important;margin:0!important;justify-content:flex-start!important;align-items:flex-start!important;align-self:start!important;text-align:left!important}
.kc-scrolled.kc-atfoot .kc-pill{transform:translate(-50%,-140%);opacity:0;pointer-events:none}
/* Max, 5 Nov: header spans the page like the live one, bigger logo */
.kc-h .w{width:calc(100% - 48px);max-width:1760px;height:84px}
.kc-h .kc-logo img{height:44px}
.kc-h .kc-lock{gap:18px}.kc-h .kc-sl{height:30px}
@media (max-width:760px){.kc-h .w{width:calc(100% - 32px);height:64px}.kc-h .kc-logo img{height:30px}.kc-h .kc-lock{gap:12px}.kc-h .kc-sl{height:24px}}
.kc button.kc-l,.kc button.kc-l:hover,.kc button.kc-l:focus,.kc button.kc-l:active,.kc button.kc-l[aria-expanded=true]{background:none!important;box-shadow:none!important;border:0!important}
.kc button.kc-l:hover,.kc .kc-dd.open>button.kc-l{color:#102D7B!important}
.kc .kc-burger,.kc .kc-burger:hover,.kc .kc-burger:focus,.kc .kc-burger[aria-expanded=true]{background:#fff!important;border:1px solid #D5DEE3!important;box-shadow:none!important}
/* offset for anything sticky on the page: clears the full header, then the pill once scrolled */
html{--kc-top:85px}html.kc-scrolled{--kc-top:74px}
@media (max-width:760px){html{--kc-top:66px}html.kc-scrolled{--kc-top:74px}}
/* see-through bar over a hero (landing pages) */
.kc-h.kc-ov{position:absolute;left:0;right:0;top:0;background:transparent;border-bottom:1px solid rgba(255,255,255,.18)}
.kc-ov:not(.kc-menu) .kc-sl{background:rgba(255,255,255,.4)}
.kc-ov:not(.kc-menu) .kc-swb{background:rgba(255,255,255,.12)!important;border-color:rgba(255,255,255,.5)!important;color:#fff!important}
.kc-ov:not(.kc-menu) button.kc-l,.kc-ov:not(.kc-menu) a.kc-l{color:#fff!important}
.kc-ov:not(.kc-menu) .kc-burger{background:rgba(255,255,255,.12)!important;border-color:rgba(255,255,255,.5)!important;color:#fff!important}
.kc-h.kc-ov.kc-menu{background:#F2FAFC;border-bottom-color:#D5DEE3}
.kc-h.kc-ov:not(.kc-menu){background:linear-gradient(rgba(6,14,32,.55),rgba(6,14,32,0))}
/* long section labels on phones: short label, and the switcher shrinks before the menu button moves */
.kc-swb .ls,.kc-swb2 .ls{display:none}
@media (max-width:760px){.kc-swb .lf,.kc-swb2 .lf{display:none}.kc-swb .ls,.kc-swb2 .ls{display:inline}
  .kc-h .kc-lock{flex:0 1 auto;min-width:0}.kc-h .kc-sw{min-width:0}.kc-h .kc-swb{max-width:100%;overflow:hidden;text-overflow:ellipsis}.kc-burger{flex:none}}
/* footer map on phones: drop "· you are here" so the current label stays inside the screen (the dark fill already marks it) */
@media (max-width:760px){.kc-f .ml small{display:none}}
.kc-pill .s{white-space:nowrap}
/* pill logo collapsed to 0px wide on phones (flex shrink); keep it, and tighten the pill so the CTA stays inside */
.kc-pill>a{flex:none}.kc-pill img{width:auto}
@media (max-width:760px){.kc-pill{gap:8px;padding-left:12px;width:max-content}.kc-pill img{height:15px}.kc-pill .kc-cta{padding:0 11px;flex:none}.kc .kc-pill .kc-swb2{font-size:13px!important}.kc-pill .kc-sw{min-width:0}}
/* ".kc button{margin:0}" outranked the burger's margin-left:auto, so on phones it sat next to the switcher instead of the right edge */
.kc-h .kc-burger{margin-left:auto}
/* pill CTA: full words; .kc-short (set by fit() in chrome.js) swaps in the short form */
.kc-pill .kc-cta .ls{display:none}.kc-pill.kc-short .kc-cta .lf{display:none}.kc-pill.kc-short .kc-cta .ls{display:inline}
/* bubble menu. Desktop: the section menu sits folded inside the bubble and opens on hover; the bubble stays centred and
   widens evenly both ways. Phones and tablets: a Menu button opens the same drawer as the header. */
.kc-pill .pn{display:flex;align-items:center;gap:2px;max-width:0;opacity:0;overflow:hidden;white-space:nowrap;transition:max-width .32s cubic-bezier(.2,.8,.2,1),opacity .2s}
.kc-pill.kc-x .pn{max-width:760px;opacity:1}
.kc-pill.kc-xd .pn{overflow:visible}
.kc-pill .pg{transition:max-width .32s cubic-bezier(.2,.8,.2,1),opacity .15s}
.kc-pill.kc-x .pg{max-width:0;opacity:0}
.kc-pill[data-sec="kt"]:not(.kc-x) .d2{display:none}
.kc-pill .pn .kc-l{font-size:13.5px;padding:6px 9px}
.kc-pill .pn .kc-sub{top:calc(100% + 14px)}
.kc-pill .kc-pmb{display:none}
.kc-pill .kc-pdr{display:none}
@media (max-width:1239px),(hover:none){
  .kc-pill .pn{display:none}
  .kc-pill .kc-pmb{display:inline-flex;flex-direction:column;justify-content:center;gap:4px;flex:none;width:34px;height:34px;padding:0 9px;border-radius:999px;border:1px solid #D5DEE3!important;background:#fff!important;cursor:pointer}
  .kc-pill .kc-pmb i{display:block;height:1.5px;background:#102D7B;border-radius:1px}
  .kc-pill.kc-pm .kc-pdr{display:grid;position:fixed;top:64px;left:12px;right:12px;max-height:calc(100vh - 88px);overflow:auto;border:1px solid #D5DEE3;border-radius:14px;box-shadow:0 14px 30px rgba(16,45,123,.16)}
}
@media (max-width:760px){
  /* phones: the bubble shows the logo mark only, to make room for the Menu button */
  .kc-pill>a{width:16px;overflow:hidden}.kc-pill>a img{max-width:none}
}
.kc-pill .kc-cta{flex:none;min-width:max-content}
/* size the bubble to its content; a fixed box at left:50% is otherwise capped at half the viewport */
.kc-pill{width:max-content}
.kc-f .top.kc-dup{display:none}
.kc-f .top.kc-dup+.cols{border-top:0}

/* HubSpot: the header lands inside the module's wrapper divs, which would trap position:sticky.
   They take no box, so the header sticks to the page as it does in the prototype. The empty mount
   holds the header's height until the script runs, so the page doesn't jump. */
.kt-site-header,.kt-site-header>.hs_cos_wrapper,.kt-site-footer,.kt-site-footer>.hs_cos_wrapper{display:contents}
/* On the old themes the header and footer come in through global partials, which HubSpot wraps in one more div. */
[data-global-resource-path]:has(>.kt-site-header),[data-global-resource-path]:has(>.kt-site-footer){display:contents}
/* The old themes make .body-wrapper a scroll box on phones (overflow:auto), which stops the header sticking.
   clip still hides sideways spill without making a scroll box. */
.body-wrapper:has(.kt-site-header){overflow:clip}
.kc-mount-ov{min-height:0}
.kc-skip{position:absolute;left:-9999px;top:8px;z-index:2000;background:#fff;color:#102d7b;padding:10px 16px;border-radius:8px;font:600 15px Montserrat,system-ui,sans-serif}
.kc-skip:focus{left:16px}
.kc-mount{min-height:85px}
@media (max-width:760px){.kc-mount{min-height:65px}}
.kc-mount-f{min-height:0}
/* HubSpot draws its Tools sprocket (only for people logged into HubSpot) fixed at the top right, on top of
   "Start a conversation" (1280-1680px) and the Menu button (under 1280px), so those clicks opened HubSpot Tools.
   Drop it below the header (6 Nov 2026). */
html body div.hs-tools-menu{top:104px!important}
@media (max-width:760px){html body div.hs-tools-menu{top:80px!important}}

/* Smallest phones (under 341px): drop the bubble's logo so a long industry name and the button both fit (6 Nov 2026) */
@media (max-width:340px){.kc-pill>a:first-child,.kc-pill>.d:not(.d2){display:none}}

/* Old landing-page banners put their text box at z-index 9999 (/upenn), which sat on top of the floating bubble and
   swallowed its clicks until the banner scrolled away. Keep that 9999 inside the banner (6 Nov 2026). */
.hs-banner-image{isolation:isolate}
/* App Store bar (live site) */
.sx-bar { position: relative; background: var(--navy); color: var(--on-navy); font-size: 13.5px; line-height: 1.3; }
.sx-bar .w { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 40px; padding-right: 48px; flex-wrap: wrap; }
.sx-new { background: var(--blue); color: #0a1f5c; font-weight: 700; font-size: 12px; padding: 2px 8px; border-radius: 4px; }
.sx-bar a { color: #fff; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.sx-bx { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); width: 40px; height: 40px; display: grid; place-items: center; background: none; border: 0; color: var(--on-navy); cursor: pointer; border-radius: 8px; }
.sx-bx svg { width: 12px; height: 12px; }
.sx-bx:hover { color: #fff; background: rgba(255, 255, 255, .08); }
.sx-nobar .sx-bar { display: none; }
@media (max-width: 520px) { .sx-bar .sx-bl { display: none; } }

/* sx: StruXure's logo is a two-line lockup, so it sits taller than Kinetech's wordmark */
.kc-h .sx-lg img { height: 40px; width: auto; }
.kc-pill .sx-lg img { height: 24px; width: auto; display: block; max-width: none; }
@media (max-width: 600px) { .kc-h .sx-lg img { height: 34px; } }
/* sx: footer keeps the family layout; the job's elevation runs along the top of the link columns */
.kc-f .sx-f-art { margin: 8px 0 0; border-bottom: 1px solid #D5DEE3; }
.kc-f .sx-f-art:empty { display: none; }
.kc-f .sx-f-art svg { display: block; width: 100%; height: auto; }
.kc-f .col .b2 { margin-top: 18px; }
.kc-f .col .adr { display: block; color: #4A5568; line-height: 1.5; margin: 4px 0 8px; }
