:root{--bg:#050914;--bg2:#08111f;--panel:#0d1422;--panel2:#101827;--border:#22304a;--text:#f6f8ff;--muted:#aab3c5;--muted2:#7f8aa3;--blue:#4f7cff;--blue2:#72a1ff}
*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--text);background:radial-gradient(circle at 80% 8%,rgba(43,88,210,.22),transparent 35%),linear-gradient(180deg,#050914 0%,#07101c 100%)}a{color:inherit;text-decoration:none}
.nav{height:86px;display:flex;align-items:center;justify-content:space-between;padding:0 44px;position:sticky;top:0;z-index:20;background:rgba(5,9,20,.72);backdrop-filter:blur(16px);border-bottom:1px solid rgba(255,255,255,.04)}
.brand img{width:154px}.navlinks{display:flex;align-items:center;gap:34px;font-size:15px}.navlinks a.active{color:var(--blue2);position:relative}.navlinks a.active:after{content:"";position:absolute;left:50%;bottom:-15px;transform:translateX(-50%);width:28px;height:2px;background:var(--blue)}
.button{display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#356bff,#4f7cff);color:#fff!important;padding:16px 24px;border-radius:8px;font-weight:600;box-shadow:0 14px 40px rgba(79,124,255,.25);border:1px solid rgba(255,255,255,.12)}.button.small{padding:14px 22px}
main{max-width:1440px;margin:0 auto}.hero{min-height:560px;display:grid;grid-template-columns:46% 54%;align-items:center;padding:72px 86px 68px;border-bottom:1px solid var(--border);overflow:hidden}
.hero-copy{z-index:2}.eyebrow{margin:0 0 22px;color:var(--blue2);text-transform:uppercase;letter-spacing:.08em;font-size:14px;font-weight:700}
h1{font-size:62px;line-height:1.06;letter-spacing:-.055em;margin:0 0 28px}h2{font-size:36px;line-height:1.18;letter-spacing:-.03em;margin:0 0 24px}h3,p{margin-top:0}
.lead{color:#d6dbea;font-size:19px;line-height:1.62;max-width:560px;margin:0 0 26px}.small-lead{margin-bottom:0}
.hero-visual{position:relative;height:420px}.hero-visual img{position:absolute;right:-220px;top:-70px;width:930px;max-width:none;opacity:.92}
.why-exist{padding:72px 86px 66px;border-bottom:1px solid var(--border);background:linear-gradient(180deg,rgba(13,20,34,.72),rgba(7,16,28,.55))}
.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:52px}.why-item{padding-right:55px;border-right:1px solid var(--border)}.why-item:last-child{border-right:0}.why-item img{width:64px;height:64px;margin-bottom:24px}.why-item p{font-size:22px;line-height:1.45;color:#e4e8f5;margin:0}
.team{padding:70px 86px 58px}.team h2{font-size:34px}.team-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.team-card{position:relative;min-height:500px;overflow:hidden;border:1px solid var(--border);border-radius:10px;background:linear-gradient(180deg,rgba(16,24,39,.88),rgba(8,17,31,.9))}
.team-card.new-hire{border-color:var(--blue);box-shadow:0 0 30px rgba(79,124,255,.18)}.badge{position:absolute;top:12px;right:12px;background:var(--blue);color:#fff;border-radius:5px;padding:5px 8px;font-size:12px;font-weight:800;z-index:5}
.headshot{width:100%;height:180px;object-fit:cover;display:block}.team-body{padding:22px}.team-body h3{font-size:21px;margin:0 0 8px}.team-body .title{color:var(--blue2);font-size:14px;font-weight:600;margin:0 0 18px}.team-body p{font-size:14px;line-height:1.62;color:#cbd3e4}.social img{width:30px;height:30px;margin-top:14px}
.card{background:linear-gradient(180deg,rgba(16,24,39,.86),rgba(9,16,28,.86));border:1px solid var(--border);border-radius:14px;box-shadow:0 24px 70px rgba(0,0,0,.25)}
.approach{margin:22px 86px 62px;padding:42px;display:grid;grid-template-columns:92px 1fr;gap:30px;align-items:center}.approach img{width:74px;height:74px}.approach h2{font-size:25px;margin-bottom:10px}.approach p{color:var(--muted);font-size:17px;margin-bottom:8px}.approach .strong{color:#fff;font-weight:700}
.footer{max-width:1440px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1.2fr 1.2fr;gap:44px;padding:30px 86px 42px}.footer-brand img{width:168px;margin-bottom:14px}.footer p{font-size:15px;max-width:270px;color:var(--muted);line-height:1.6}.footer h4{font-size:14px;color:#fff;margin:12px 0 16px}.footer a{display:block;color:#d7dcea;margin:0 0 12px;font-size:14px}.socials{display:flex;gap:10px;margin-top:16px}.socials img{width:38px;height:38px}
.legal{max-width:1268px;margin:0 auto;padding:18px 0 36px;display:flex;justify-content:space-between;color:var(--muted2);font-size:13px;border-top:1px solid var(--border)}.legal a{margin-left:26px;color:var(--muted2)}
@media(max-width:1000px){.nav{padding:0 24px}.navlinks a:not(.button){display:none}.hero,.why-grid,.team-grid,.footer,.approach{grid-template-columns:1fr}.hero,.why-exist,.team{padding-left:24px;padding-right:24px}h1{font-size:44px}.hero-visual{height:230px}.hero-visual img{right:-310px;top:-160px}.why-item{border-right:0;border-bottom:1px solid var(--border);padding-bottom:28px}.approach{margin-left:24px;margin-right:24px}.legal{margin:0 24px;display:block}.legal span{display:block;margin-bottom:12px}}



/* ------------------------------------------------------------------
   TEAM CARD IMAGE CONTAINMENT FIX
   Keeps headshots clipped inside each card so heads do not extend above
   the card boundary. This preserves the rest of the About page styling.
------------------------------------------------------------------- */

.team-card{
  overflow:hidden !important;
}

.team-card .headshot,
.team-card img.headshot{
  width:100% !important;
  height:180px !important;
  max-height:180px !important;
  object-fit:cover !important;
  object-position:center top !important;
  display:block !important;
  margin:0 !important;
  border-radius:0 !important;
}



/* ------------------------------------------------------------------
   ABOUT PAGE DESKTOP-CANVAS LOCK
   Aligns the About page with the Home/Careers page behavior:
   - header, body, footer, and legal areas keep the designed desktop look
   - browser narrowing uses horizontal scroll instead of squeezing/reflowing
   - top logo gets breathing room
------------------------------------------------------------------- */

html,
body{
  min-width:1180px;
}

body{
  overflow-x:auto;
}

/* Match the shared desktop canvas */
.nav,
main,
.footer{
  width:1180px !important;
  max-width:1180px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

.legal{
  width:1044px !important;
  max-width:1044px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

/* Header polish + logo breathing room */
.nav{
  min-height:104px !important;
  height:auto !important;
  padding:24px 68px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
}

.brand img{
  width:184px !important;
  height:auto !important;
  display:block !important;
  transform:translateY(0) !important;
}

/* Keep full navigation visible and stable */
.navlinks{
  display:flex !important;
  align-items:center !important;
  gap:34px !important;
  font-size:15px !important;
}

.navlinks a,
.navlinks a:not(.button){
  display:inline-flex !important;
  align-items:center !important;
  line-height:1 !important;
}

/* Main body alignment */
main{
  overflow:visible !important;
}

.hero{
  grid-template-columns:46% 54% !important;
  min-height:560px !important;
  padding:72px 68px 68px !important;
}

.hero-visual{
  height:420px !important;
}

.hero-visual img{
  right:-220px !important;
  top:-70px !important;
  width:930px !important;
  max-width:none !important;
}

.why-exist{
  padding:72px 68px 66px !important;
}

.why-grid{
  display:grid !important;
  grid-template-columns:repeat(3,1fr) !important;
  gap:52px !important;
}

.why-item{
  border-right:1px solid var(--border) !important;
  border-bottom:0 !important;
  padding-right:55px !important;
  padding-bottom:0 !important;
}

.why-item:last-child{
  border-right:0 !important;
}

.team{
  padding:70px 68px 58px !important;
}

.team-grid{
  display:grid !important;
  grid-template-columns:repeat(5,1fr) !important;
  gap:16px !important;
}

.approach{
  margin:22px 68px 62px !important;
  display:grid !important;
  grid-template-columns:92px 1fr !important;
}

/* Footer alignment */
.footer{
  display:grid !important;
  grid-template-columns:2fr 1fr 1.2fr 1.2fr !important;
  gap:44px !important;
  padding:30px 68px 42px !important;
}

.legal{
  display:flex !important;
  justify-content:space-between !important;
}

.legal span{
  display:inline !important;
  margin-bottom:0 !important;
}

/* Preserve team card image containment */
.team-card{
  overflow:hidden !important;
}

.team-card .headshot,
.team-card img.headshot{
  width:100% !important;
  height:180px !important;
  max-height:180px !important;
  object-fit:cover !important;
  object-position:center top !important;
  display:block !important;
  margin:0 !important;
  border-radius:0 !important;
}

/* When browser is narrow, keep the desktop canvas and allow horizontal scroll */
@media(max-width:1000px){
  .nav,
  main,
  .footer{
    width:1180px !important;
    max-width:1180px !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }

  .legal{
    width:1044px !important;
    max-width:1044px !important;
    margin-left:68px !important;
    margin-right:0 !important;
  }

  .nav{
    min-height:104px !important;
    height:auto !important;
    padding:24px 68px !important;
  }

  .navlinks{
    display:flex !important;
    gap:34px !important;
  }

  .navlinks a,
  .navlinks a:not(.button){
    display:inline-flex !important;
  }

  .hero{
    grid-template-columns:46% 54% !important;
    padding:72px 68px 68px !important;
  }

  h1{
    font-size:62px !important;
  }

  .why-grid{
    grid-template-columns:repeat(3,1fr) !important;
  }

  .why-exist,
  .team{
    padding-left:68px !important;
    padding-right:68px !important;
  }

  .team-grid{
    grid-template-columns:repeat(5,1fr) !important;
  }

  .approach{
    margin-left:68px !important;
    margin-right:68px !important;
    grid-template-columns:92px 1fr !important;
  }

  .footer{
    grid-template-columns:2fr 1fr 1.2fr 1.2fr !important;
    padding-left:68px !important;
    padding-right:68px !important;
  }

  .legal{
    display:flex !important;
  }
}

/* ------------------------------------------------------------------
   ABOUT HERO TEXT CTA
   Subtle narrative link from About hero to the deeper Why GaussIQ page.
------------------------------------------------------------------- */

.hero-text-cta{
  display:inline-flex !important;
  align-items:center !important;
  gap:8px !important;
  margin-top:22px !important;
  color:var(--blue2) !important;
  font-size:16px !important;
  font-weight:600 !important;
  line-height:1.45 !important;
  letter-spacing:.005em !important;
  text-decoration:none !important;
  opacity:.96 !important;
  transition:opacity .18s ease, transform .18s ease;
}

.hero-text-cta span{
  display:inline-block !important;
  transform:translateY(-1px) !important;
  transition:transform .18s ease;
}

.hero-text-cta:hover{
  opacity:1 !important;
  transform:translateX(2px);
}

.hero-text-cta:hover span{
  transform:translate(3px,-1px) !important;
}

@media(max-width:1000px){
  .hero-text-cta{
    margin-top:22px !important;
    font-size:16px !important;
    font-weight:600 !important;
  }
}

.hero-text-cta span{
  display:inline-block;
  transform:translateY(-1px);
  transition:transform .18s ease;
}

.hero-text-cta:hover{
  opacity:1;
  transform:translateX(2px);
}

.hero-text-cta:hover span{
  transform:translate(3px,-1px);
}

@media(max-width:1000px){
  .hero-text-cta{
    font-size:16px !important;
  }
}



/* ------------------------------------------------------------------
   ABOUT TEAM STRUCTURE UPDATE
   Five executive cards in the main leadership row, with Carl Friedrich
   Gauss moved into a separate first-principles foundation card.
------------------------------------------------------------------- */

.team-grid{
  display:grid !important;
  grid-template-columns:repeat(5,1fr) !important;
  gap:16px !important;
}

.foundation-card{
  margin:82px 0 0 !important;
  padding:34px 42px !important;
  display:grid !important;
  grid-template-columns:170px 1fr !important;
  gap:34px !important;
  align-items:center !important;
  border-color:rgba(79,124,255,.42) !important;
  background:
    radial-gradient(circle at 14% 48%,rgba(79,124,255,.16),transparent 30%),
    linear-gradient(180deg,rgba(16,24,39,.88),rgba(9,16,28,.88)) !important;
}

.foundation-image-wrap{
  position:relative !important;
  width:150px !important;
  height:150px !important;
  border-radius:14px !important;
  overflow:hidden !important;
  border:1px solid rgba(79,124,255,.38) !important;
  background:rgba(7,16,28,.7) !important;
  box-shadow:0 0 34px rgba(79,124,255,.12) !important;
}

.foundation-headshot{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center top !important;
  display:block !important;
  opacity:.92 !important;
}

.foundation-copy .eyebrow{
  margin:0 0 12px !important;
}

.foundation-copy h3{
  font-size:25px !important;
  line-height:1.2 !important;
  letter-spacing:-.025em !important;
  margin:0 0 12px !important;
  color:#fff !important;
}

.foundation-copy p{
  font-size:16px !important;
  line-height:1.58 !important;
  color:var(--muted) !important;
  max-width:790px !important;
  margin:0 0 10px !important;
}

.foundation-copy p:last-child{
  margin-bottom:0 !important;
}

@media(max-width:1000px){
  .team-grid{
    grid-template-columns:repeat(5,1fr) !important;
  }

  .foundation-card{
    margin-top:82px !important;
    grid-template-columns:170px 1fr !important;
    padding:34px 42px !important;
  }
}



/* ------------------------------------------------------------------
   FINAL CARL FOUNDATION IMAGE SIZE FIX
   Forces the Carl Friedrich Gauss foundation image to use the same
   controlled image-frame behavior as the executive headshots.
------------------------------------------------------------------- */

.foundation-card{
  align-items:center !important;
  grid-template-columns:180px 1fr !important;
}

.foundation-image-wrap{
  position:relative !important;
  width:180px !important;
  height:180px !important;
  min-width:180px !important;
  max-width:180px !important;
  min-height:180px !important;
  max-height:180px !important;
  overflow:hidden !important;
  border-radius:12px !important;
  border:1px solid rgba(79,124,255,.38) !important;
  background:rgba(7,16,28,.7) !important;
  box-shadow:0 0 34px rgba(79,124,255,.12) !important;
}

.foundation-headshot{
  width:100% !important;
  height:180px !important;
  max-height:180px !important;
  object-fit:cover !important;
  object-position:center top !important;
  display:block !important;
  margin:0 !important;
  border-radius:0 !important;
  opacity:.92 !important;
}

@media(max-width:1000px){
  .foundation-card{
    grid-template-columns:180px 1fr !important;
  }

  .foundation-image-wrap{
    width:180px !important;
    height:180px !important;
    min-width:180px !important;
    max-width:180px !important;
    min-height:180px !important;
    max-height:180px !important;
  }

  .foundation-headshot{
    height:180px !important;
    max-height:180px !important;
  }
}


/* =========================================================
   FINAL ABOUT MOBILE RESPONSIVE + HAMBURGER NAV
   Keep this block at the very end of the file.
   Desktop layout remains unchanged; mobile overrides the 1180px
   desktop canvas lock and uses a checkbox-driven hamburger menu.
   ========================================================= */

/* Desktop: hide hamburger controls */
.menu-toggle,
.hamburger{
  display:none;
}

@media (max-width:1000px){

  html,
  body{
    min-width:0 !important;
    width:100% !important;
    max-width:100% !important;
    overflow-x:hidden !important;
  }

  body{
    overflow-x:hidden !important;
  }

  .nav,
  main,
  .footer,
  .legal{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }

  main{
    overflow:hidden !important;
  }

  /* Mobile header */
  .nav{
    position:sticky !important;
    top:0 !important;
    z-index:100 !important;
    min-height:96px !important;
    height:auto !important;
    padding:20px 24px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    background:rgba(5,9,20,.86) !important;
    backdrop-filter:blur(16px) !important;
    border-bottom:1px solid rgba(255,255,255,.05) !important;
  }

  .brand{
    position:relative !important;
    z-index:110 !important;
  }

  .brand img{
    width:142px !important;
    height:auto !important;
    display:block !important;
    transform:none !important;
  }

  .menu-toggle{
    position:absolute !important;
    opacity:0 !important;
    pointer-events:none !important;
    width:1px !important;
    height:1px !important;
  }

  .hamburger{
    display:flex !important;
    position:relative !important;
    z-index:110 !important;
    width:46px !important;
    height:46px !important;
    border:1px solid rgba(114,161,255,.36) !important;
    border-radius:12px !important;
    align-items:center !important;
    justify-content:center !important;
    flex-direction:column !important;
    gap:5px !important;
    background:rgba(16,24,39,.74) !important;
    box-shadow:0 12px 34px rgba(0,0,0,.18) !important;
    cursor:pointer !important;
  }

  .hamburger span{
    display:block !important;
    width:20px !important;
    height:2px !important;
    border-radius:999px !important;
    background:#f6f8ff !important;
    transition:transform .22s ease, opacity .18s ease !important;
  }

  .menu-toggle:checked + .hamburger span:nth-child(1){
    transform:translateY(7px) rotate(45deg) !important;
  }

  .menu-toggle:checked + .hamburger span:nth-child(2){
    opacity:0 !important;
  }

  .menu-toggle:checked + .hamburger span:nth-child(3){
    transform:translateY(-7px) rotate(-45deg) !important;
  }

  .navlinks{
    display:flex !important;
    position:absolute !important;
    left:24px !important;
    right:24px !important;
    top:calc(100% - 8px) !important;
    flex-direction:column !important;
    gap:0 !important;
    padding:14px !important;
    border:1px solid rgba(114,161,255,.26) !important;
    border-radius:14px !important;
    background:linear-gradient(180deg,rgba(16,24,39,.98),rgba(7,13,25,.98)) !important;
    box-shadow:0 24px 70px rgba(0,0,0,.34) !important;
    opacity:0 !important;
    visibility:hidden !important;
    transform:translateY(-8px) !important;
    pointer-events:none !important;
    transition:opacity .2s ease, transform .2s ease, visibility .2s ease !important;
    z-index:105 !important;
  }

  .menu-toggle:checked ~ .navlinks{
    opacity:1 !important;
    visibility:visible !important;
    transform:translateY(0) !important;
    pointer-events:auto !important;
  }

  .navlinks a,
  .navlinks a:not(.button){
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    width:100% !important;
    padding:16px 14px !important;
    border-bottom:1px solid rgba(34,48,74,.72) !important;
    color:#f6f8ff !important;
    font-size:16px !important;
    line-height:1.2 !important;
    white-space:normal !important;
  }

  .navlinks a:last-child{
    border-bottom:0 !important;
  }

  .navlinks a:hover,
  .navlinks a:focus,
  .navlinks a.active{
    color:var(--blue2) !important;
  }

  .navlinks a.active::after{
    display:none !important;
  }

  /* Mobile page layout */
  .hero{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    min-height:auto !important;
    padding:56px 28px 54px !important;
    overflow:hidden !important;
    border-bottom:1px solid var(--border) !important;
  }

  .hero-copy{
    width:100% !important;
    max-width:100% !important;
  }

  h1{
    font-size:42px !important;
    line-height:1.05 !important;
    letter-spacing:-0.052em !important;
  }

  h2{
    font-size:32px !important;
    line-height:1.14 !important;
  }

  .lead{
    width:100% !important;
    max-width:100% !important;
    font-size:17px !important;
    line-height:1.58 !important;
  }

  .hero-visual{
    height:215px !important;
    margin:36px -28px 0 !important;
    overflow:hidden !important;
    position:relative !important;
  }

  .hero-visual img{
    position:absolute !important;
    right:-250px !important;
    top:-106px !important;
    width:760px !important;
    max-width:none !important;
    opacity:.78 !important;
  }

  .why-exist{
    padding:52px 28px !important;
  }

  .why-grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:28px !important;
  }

  .why-item{
    border-right:0 !important;
    border-bottom:1px solid var(--border) !important;
    padding-right:0 !important;
    padding-bottom:26px !important;
  }

  .why-item:last-child{
    border-bottom:0 !important;
    padding-bottom:0 !important;
  }

  .why-item p{
    font-size:18px !important;
    line-height:1.5 !important;
  }

  .team{
    padding:52px 28px !important;
  }

  .team h2{
    font-size:32px !important;
    line-height:1.14 !important;
  }

  .team-grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:22px !important;
  }

  .team-card{
    min-height:auto !important;
  }

  .headshot,
  .team-card .headshot,
  .team-card img.headshot{
    height:260px !important;
    max-height:260px !important;
    object-fit:cover !important;
    object-position:center top !important;
  }

  .team-body{
    padding:24px !important;
  }

  .team-body p{
    font-size:15px !important;
    line-height:1.62 !important;
  }

  .foundation-card{
    display:block !important;
    margin:44px 0 0 !important;
    padding:28px 24px !important;
  }

  .foundation-image-wrap{
    width:160px !important;
    height:160px !important;
    min-width:160px !important;
    max-width:160px !important;
    min-height:160px !important;
    max-height:160px !important;
    margin:0 0 24px !important;
  }

  .foundation-headshot{
    height:160px !important;
    max-height:160px !important;
  }

  .foundation-copy h3{
    font-size:23px !important;
  }

  .foundation-copy p{
    font-size:15px !important;
    max-width:100% !important;
  }

  .approach{
    display:block !important;
    margin:28px 28px 54px !important;
    padding:28px 24px !important;
  }

  .approach img{
    width:58px !important;
    height:58px !important;
    margin-bottom:20px !important;
  }

  .approach h2{
    font-size:26px !important;
  }

  .footer{
    display:block !important;
    padding:46px 28px 34px !important;
  }

  .footer-brand img{
    width:152px !important;
  }

  .footer p{
    max-width:100% !important;
  }

  .footer > div{
    margin-bottom:30px !important;
  }

  .footer a{
    font-size:14px !important;
  }

  .socials img{
    width:36px !important;
    height:36px !important;
  }

  .legal{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding:18px 28px 34px !important;
    font-size:12px !important;
  }

  .legal span{
    display:block !important;
    margin-bottom:14px !important;
  }

  .legal a{
    margin-left:0 !important;
    margin-right:22px !important;
  }
}

