/* ============================================================
   BB Summity — shared design system CSS
   Used by all 4 public pages: index.html, technology.html,
   engineering.html, health-supply.html.

   Page-specific CSS (hero carousel on the homepage; page-banner
   on the 3 subpages; pricing/order-modal on technology.html only)
   stays in each page's own small inline <style> block — only
   what's genuinely identical across all 4 pages lives here.

   IMPORTANT: editing this file changes all 4 pages at once. This
   is the whole point (previously each page carried its own full
   copy of this CSS, and site-wide changes had to be hand-applied
   4 times — a real source of drift, see the .division/.connector/
   .division-head/.partners spacing fix below for a live example).
   ============================================================ */

:root{
    --ink:#0B1220;
    --ink-2:#111A2C;
    --steel:#FFFFFF;
    --steel-2:#F3F5F6;
    --white:#FFFFFF;
    --slate:#445063;
    --amber:#43784A;   /* brand green, from BB Summity logo */
    --teal:#1B4261;    /* brand navy, from BB Summity logo */
    --line-dark:rgba(11,18,32,0.10);
    --line-light:rgba(11,18,32,0.10);
    --ease:cubic-bezier(.22,.61,.36,1);
    --hero-x:clamp(20px,6vw,80px);
    /* Apple's own system font stack — resolves to San Francisco on Apple
       devices, with sane fallbacks elsewhere. No webfont download needed. */
    --font-sans:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Helvetica Neue",Helvetica,Arial,sans-serif;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  @media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto;}
    *{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;}
  }
  body{margin:0;background:var(--white);color:var(--ink);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;overflow-x:hidden;}
  h1,h2,h3,.display{font-family:var(--font-sans);font-weight:600;letter-spacing:-0.01em;margin:0;}
  .mono{font-family:var(--font-sans);letter-spacing:0.01em;}
  a{color:inherit;text-decoration:none;}
  svg{display:block;max-width:100%;}
  button{font-family:inherit;cursor:pointer;}
  :focus-visible{outline:2px solid var(--amber);outline-offset:3px;}
  .eyebrow{font-family:var(--font-sans);font-size:0.7rem;text-transform:uppercase;letter-spacing:0.16em;opacity:0.6;}
  header.nav{
    position:fixed;top:0;left:0;right:0;z-index:100;
    display:flex;align-items:center;justify-content:space-between;
    padding:16px clamp(20px,4vw,56px);
    background:rgba(255,255,255,0.86);backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%);
    border-bottom:1px solid transparent;color:var(--ink);
    transition:border-color .3s,box-shadow .3s,background .3s;
  }
  header.nav.is-scrolled{border-bottom-color:var(--line-light);box-shadow:0 8px 30px -20px rgba(11,18,32,0.35);}
  .nav-logo{display:flex;align-items:center;gap:10px;font-family:var(--font-sans);font-weight:700;font-size:1.05rem;letter-spacing:0.01em;}
  .nav-logo .mark{height:44px;width:auto;flex:none;}
  .nav-links{display:flex;gap:28px;list-style:none;margin:0;padding:0;}
  .nav-links a{font-size:0.85rem;opacity:0.72;transition:opacity 0.2s;position:relative;}
  .nav-links a:hover{opacity:1;}
  .nav-links a::after{content:"";position:absolute;left:0;right:100%;bottom:-4px;height:1px;background:currentColor;transition:right .25s var(--ease);}
  .nav-links a:hover::after{right:0;}
  .nav-cta{
    font-size:0.82rem;border:1px solid var(--line-light);padding:9px 18px;border-radius:6px;
    transition:border-color 0.2s,background 0.2s;
  }
  .nav-cta:hover{border-color:var(--amber);background:rgba(67,120,74,0.08);}
  .nav-right{display:flex;align-items:center;gap:16px;}
  .lang-switcher{display:flex;align-items:center;gap:6px;}
  .lang-switcher svg{width:16px;height:16px;opacity:0.6;flex:none;color:var(--ink);}
  .lang-switcher select{
    font-family:var(--font-sans);font-size:0.78rem;font-weight:600;letter-spacing:0.02em;
    border:1px solid var(--line-light);border-radius:6px;padding:7px 8px;
    background:transparent;color:var(--ink);cursor:pointer;
    transition:border-color 0.2s,background 0.2s;
    -webkit-appearance:none;-moz-appearance:none;appearance:none;
  }
  .lang-switcher select:hover{border-color:var(--amber);background:rgba(67,120,74,0.08);}
  .lang-switcher select:focus{outline:none;border-color:var(--amber);}
  @media (max-width:900px){.nav-links{display:none;}.nav-right{gap:10px;}}
  .btn{padding:12px 24px;border-radius:6px;font-size:0.9rem;font-weight:500;display:inline-block;border:1px solid transparent;transition:transform .25s var(--ease),background .25s,border-color .25s,box-shadow .25s;}
  .btn-amber{background:var(--amber);color:var(--ink);}
  .btn-amber:hover{transform:translateY(-2px);background:#5EA567;box-shadow:0 10px 24px -12px rgba(67,120,74,0.55);}
  .btn-amber:active{transform:translateY(0);}
  .btn-ghost-dark{border-color:var(--line-light);color:var(--ink);}
  .btn-ghost-dark:hover{border-color:var(--slate);transform:translateY(-2px);}
  .btn-ghost-dark:active{transform:translateY(0);}
  .btn-teal{background:var(--teal);color:#fff;}
  .btn-teal:hover{transform:translateY(-2px);background:#2B6899;box-shadow:0 10px 24px -12px rgba(27,66,97,0.55);}
  .btn-teal:active{transform:translateY(0);}
  .btn-ghost-light{border-color:var(--line-light);color:var(--ink);}
  .btn-ghost-light:hover{border-color:var(--slate);transform:translateY(-2px);}
  @media (max-width:760px){.stats{grid-template-columns:repeat(2,1fr);}}
  .partners{
    background:var(--white);border-bottom:1px solid var(--line-light);
    padding:28px clamp(20px,6vw,80px) 30px;
  }
  .partners .eyebrow{color:rgba(11,18,32,0.5);margin-bottom:26px;}
  .partner-row{
    display:flex;justify-content:center;align-items:center;gap:clamp(28px,6vw,72px);flex-wrap:wrap;
  }
  .partner-name{
    font-family:var(--font-sans);font-weight:600;font-size:clamp(1.1rem,2.4vw,1.5rem);
    color:rgba(11,18,32,0.4);letter-spacing:0.01em;
    transition:color 0.25s;
  }
  .partner-name:hover{color:var(--ink);}
  .division{padding:60px clamp(20px,6vw,80px) 24px;background:var(--white);}
  .division-alt{background:var(--steel-2);}
  .word-reveal-word{display:inline-block;opacity:0;transform:translateY(12px);animation:word-reveal-in .5s cubic-bezier(.22,.68,.32,1) forwards;}
  @keyframes word-reveal-in{to{opacity:1;transform:translateY(0);}}
  @media (prefers-reduced-motion: reduce){
    .word-reveal-word{opacity:1;transform:none;animation:none;}
  }
  .card-image{display:none;width:100%;height:140px;border-radius:10px;margin-bottom:14px;background-size:cover;background-position:center;background-color:var(--steel-2);}
  .card-image.has-image{display:block;}
  .division-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;border-bottom:1px solid var(--line-light);padding-bottom:24px;margin-bottom:36px;}
  .division-head .tag{display:flex;align-items:center;gap:10px;}
  .division-head .dot{width:10px;height:10px;border-radius:50%;flex:none;}
  .division-head h2{font-size:clamp(1.9rem,4vw,2.9rem);}
  .division-head p{max-width:46ch;opacity:0.68;font-size:0.98rem;line-height:1.6;margin-top:10px;}
  .division.tech .dot{background:var(--teal);}
  .division.eng .dot{background:var(--amber);}
  .division.med .dot{background:var(--teal);}
  .offer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line-light);border:1px solid var(--line-light);border-radius:16px;overflow:hidden;}
  .offer-grid-3{grid-template-columns:repeat(3,1fr);}
  @media (max-width:980px){.offer-grid,.offer-grid-3{grid-template-columns:repeat(2,1fr);}}
  @media (max-width:560px){.offer-grid,.offer-grid-3{grid-template-columns:1fr;}}
  .offer-card{background:var(--white);padding:32px 26px;min-height:230px;display:flex;flex-direction:column;justify-content:space-between;transition:background .3s,transform .4s var(--ease),box-shadow .4s var(--ease);}
  .offer-card:hover{transform:translateY(-6px);box-shadow:0 16px 40px -20px rgba(11,18,32,0.25);}
  .offer-card:hover{background:var(--steel-2);}
  .offer-card .icon{width:34px;height:34px;}
  .offer-card h3{font-size:1.08rem;margin-top:22px;line-height:1.2;}
  .offer-card p{font-size:0.85rem;opacity:0.68;line-height:1.55;margin-top:8px;}
  .offer-card .id{font-family:var(--font-sans);font-size:0.66rem;opacity:0.45;}
  .reveal{opacity:0;transform:translateY(24px);transition:opacity .8s var(--ease),transform .8s var(--ease);}
  .reveal.in{opacity:1;transform:translateY(0);}
  .offer-card.reveal.in:hover{transform:translateY(-6px);}
  .offer-grid .offer-card:nth-child(1){transition-delay:0s;}
  .offer-grid .offer-card:nth-child(2){transition-delay:.08s;}
  .offer-grid .offer-card:nth-child(3){transition-delay:.16s;}
  .offer-grid .offer-card:nth-child(4){transition-delay:.24s;}
  .offer-grid .offer-card:nth-child(5){transition-delay:.32s;}
  .offer-grid .offer-card:nth-child(n+6){transition-delay:.4s;}
  .chip-grid{display:flex;flex-wrap:wrap;gap:12px;}
  .chip{
    padding:11px 20px;border:1px solid var(--line-light);border-radius:100px;
    font-size:0.86rem;color:var(--ink);background:var(--white);
    transition:border-color 0.2s,background 0.2s;
  }
  .chip:hover{border-color:var(--amber);background:rgba(67,120,74,0.06);}
  .faq-list{display:flex;flex-direction:column;border-top:1px solid var(--line-light);}
  .faq-item{border-bottom:1px solid var(--line-light);padding:22px 4px;}
  .faq-item summary{
    cursor:pointer;font-family:var(--font-sans);font-weight:600;font-size:1.02rem;
    list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;
  }
  .faq-item summary::-webkit-details-marker{display:none;}
  .faq-item summary::after{
    content:"+";font-family:var(--font-sans);font-size:1.1rem;color:var(--amber);flex:none;
    transition:transform 0.25s var(--ease);
  }
  .faq-item[open] summary::after{transform:rotate(45deg);}
  .faq-item p{margin-top:12px;font-size:0.92rem;line-height:1.6;opacity:0.7;max-width:60ch;}
  .connector{display:flex;align-items:center;justify-content:center;padding:12px 0;background:var(--white);}
  .connector svg{width:min(640px,80vw);height:26px;}
  .connector line{stroke:var(--line-light);stroke-width:1.2;stroke-dasharray:3 6;}
  .connector circle{fill:var(--white);stroke:var(--slate);stroke-width:1.4;}
  .band{background:var(--white);color:var(--ink);text-align:center;padding:100px 24px;border-top:1px solid var(--line-light);border-bottom:1px solid var(--line-light);}
  .band h2{font-size:clamp(1.9rem,4vw,3rem);max-width:22ch;margin:0 auto;line-height:1.12;}
  .band p{margin-top:14px;opacity:0.68;font-size:1rem;}
  .band .hero-cta{margin-top:30px;justify-content:center;}
  footer{background:var(--white);color:rgba(11,18,32,0.68);padding:64px clamp(20px,6vw,80px) 32px;font-size:0.85rem;border-top:1px solid var(--line-light);}
  .footer-grid{display:grid;grid-template-columns:1.4fr repeat(5,1fr);gap:26px;padding-bottom:44px;border-bottom:1px solid var(--line-light);}
  @media (max-width:860px){.footer-grid{grid-template-columns:repeat(2,1fr);}}
  .footer-brand{display:flex;align-items:center;gap:8px;color:var(--ink);font-family:var(--font-sans);font-weight:700;font-size:1.05rem;margin-bottom:10px;}
  .footer-grid h4{font-family:var(--font-sans);font-size:0.68rem;text-transform:uppercase;letter-spacing:0.1em;color:var(--ink);opacity:0.75;margin-bottom:14px;}
  .footer-grid ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px;}
  .footer-grid a{opacity:0.7;transition:opacity 0.2s;}
  .footer-grid a:hover{opacity:1;}
  .footer-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:24px;flex-wrap:wrap;gap:12px;font-size:0.76rem;opacity:0.55;}
  .footer-bottom ul{list-style:none;display:flex;gap:18px;margin:0;padding:0;flex-wrap:wrap;}
  .footer-contact{list-style:none;margin:18px 0 0;padding:0;display:flex;flex-direction:column;gap:8px;font-size:0.82rem;}
  .footer-contact a{opacity:0.6;transition:opacity 0.2s;}
  .footer-contact a:hover{opacity:1;}
  .footer-social{display:flex;gap:14px;justify-content:center;padding-top:26px;}
  .footer-social a{
    width:34px;height:34px;border-radius:50%;border:1px solid var(--line-light);
    display:flex;align-items:center;justify-content:center;color:rgba(11,18,32,0.55);
    transition:border-color 0.2s,color 0.2s;
  }
  .footer-social a svg{width:15px;height:15px;}
  .footer-social a:hover{border-color:var(--amber);color:var(--ink);}
  .footer-partners{
    margin-top:36px;padding-top:32px;border-top:1px solid var(--line-light);
  }
  .footer-partners .eyebrow{color:rgba(11,18,32,0.45);margin-bottom:22px;}
  .footer-partners .partner-name{color:rgba(11,18,32,0.4);}
  .footer-partners .partner-name:hover{color:var(--ink);}
