:root{
  --bg:#050914;
  --bg2:#08111f;
  --panel:#0d1422;
  --panel2:#101827;
  --border:#22304a;
  --text:#f6f8ff;
  --muted:#aab3c5;
  --muted2:#7f8aa3;
  --blue:#4f7cff;
  --blue2:#72a1ff;
  --page-max:1180px;
  --content-max:1044px;
  --gutter:68px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{min-width:1180px}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at 78% 6%,rgba(43,88,210,.24),transparent 34%),
    linear-gradient(180deg,#050914 0%,#07101c 100%);
  overflow-x:auto;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto}
.nav,main,.footer{width:var(--page-max);max-width:var(--page-max);margin-left:auto;margin-right:auto}
.nav{
  min-height:104px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:24px var(--gutter);
  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:184px;height:auto;display:block}
.navlinks{display:flex;align-items:center;gap:34px;font-size:15px;color:#fff}
.navlinks a{display:inline-flex;align-items:center;line-height:1;opacity:.92}
.navlinks a:hover{color:var(--blue2);opacity:1}
main{overflow:visible}
.privacy-hero{
  min-height:470px;
  display:grid;
  grid-template-columns:43% 57%;
  column-gap:28px;
  align-items:center;
  padding:70px var(--gutter) 76px;
  border-bottom:1px solid var(--border);
  overflow:hidden;
  position:relative;
}
.privacy-copy{position:relative;z-index:3;width:430px;max-width:430px}
.eyebrow{margin:0 0 18px;color:var(--blue2);text-transform:uppercase;letter-spacing:.105em;font-size:12px;font-weight:800}
h1{font-size:48px;line-height:1.04;letter-spacing:-.055em;margin:0 0 24px;font-weight:800}
.lead{color:#d6dbea;font-size:17px;line-height:1.62;margin:0 0 24px;max-width:430px}
.updated{display:inline-flex;color:#d6dbea;font-size:14px;line-height:1;border:1px solid rgba(114,161,255,.28);border-radius:999px;background:rgba(16,24,39,.65);padding:11px 14px;margin:0}
.privacy-visual{
  position:relative;
  z-index:1;
  height:330px;
  overflow:hidden;

  -webkit-mask-image:linear-gradient(
    90deg,
    transparent 0%,
    #000 10%,
    #000 90%,
    transparent 100%
  );

  mask-image:linear-gradient(
    90deg,
    transparent 0%,
    #000 10%,
    #000 90%,
    transparent 100%
  );
}
.privacy-visual img{
  position:absolute;
  right:-210px;
  top:-58px;
  width:900px;
  max-width:none;
  opacity:.82;
  filter:
    drop-shadow(0 0 18px rgba(79,124,255,.12))
    drop-shadow(0 0 46px rgba(79,124,255,.06));
}
.privacy-hero::after{content:"";position:absolute;top:0;left:390px;width:190px;height:100%;background:linear-gradient(
    90deg,
    rgba(5,9,20,0),
    rgba(5,9,20,.52),
    rgba(5,9,20,0)
  );pointer-events:none;z-index:2}
.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)}
.legal-notice{width:var(--content-max);max-width:var(--content-max);margin:54px auto 0;padding:30px 36px;border-color:rgba(79,124,255,.42)}
.legal-notice p:last-child{margin-bottom:0}
.privacy-layout{width:var(--content-max);max-width:var(--content-max);margin:42px auto 74px;display:grid;grid-template-columns:260px 1fr;gap:34px;align-items:start}
.toc{position:sticky;top:130px;padding:24px;border:1px solid var(--border);border-radius:14px;background:rgba(9,16,28,.72)}
.toc a{display:block;color:#cbd3e4;font-size:14px;line-height:1.35;padding:10px 0;border-bottom:1px solid rgba(34,48,74,.70)}
.toc a:last-child{border-bottom:0}
.toc a:hover{color:var(--blue2)}
.policy{padding:44px 50px}
.policy section{padding:0 0 36px;margin:0 0 36px;border-bottom:1px solid rgba(34,48,74,.85)}
.policy section:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}
h2{font-size:30px;line-height:1.16;letter-spacing:-.03em;margin:0 0 18px;color:#fff}
h3{font-size:17px;line-height:1.35;margin:24px 0 10px;color:#fff}
p,li{color:var(--muted);font-size:16px;line-height:1.68}
p{margin:0 0 16px}
ul{margin:14px 0 0;padding-left:22px}
li{padding-left:4px;margin:0 0 10px}
.policy a,.contact-card a{color:var(--blue2)}
.contact-card{margin-top:18px;border:1px solid rgba(114,161,255,.28);border-radius:12px;background:rgba(16,24,39,.66);padding:22px;color:#d6dbea;font-size:16px;line-height:1.7}
.footer{display:grid;grid-template-columns:2fr 1fr 1.35fr 1.2fr;gap:44px;padding:30px var(--gutter) 42px;color:var(--text)}
.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}.footer a:hover{color:var(--blue2)}
.legal{width:var(--content-max);max-width:var(--content-max);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)}.legal a:hover{color:var(--blue2)}
@media(max-width:1179px){.nav,main,.footer{margin-left:0;margin-right:0}.legal,.privacy-layout,.legal-notice{margin-left:68px;margin-right:0}.toc{position:static}}


/* ------------------------------------------------------------------
   FINAL FOOTER SOCIAL ICON FIX
   Targets both possible footer social wrappers:
   - .socials = home page pattern
   - .footer-social = privacy page fallback
   Keeps LinkedIn + Email side by side.
------------------------------------------------------------------- */

.footer .socials,
.footer .footer-social{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:12px !important;
  margin-top:14px !important;
}

.footer .socials a,
.footer .footer-social a{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:38px !important;
  height:38px !important;
  margin:0 !important;
}

.footer .socials img,
.footer .footer-social img{
  display:block !important;
  width:38px !important;
  height:38px !important;
  margin:0 !important;
}

/* ------------------------------------------------------------------
   FINAL PRIVACY HERO VISUAL INTEGRATION
   Creates environmental glow so the hero graphic feels embedded in
   the page rather than boxed inside the image area.
------------------------------------------------------------------- */

.privacy-visual::before{
  content:"";
  position:absolute;
  inset:-10%;
  background:
    radial-gradient(
      circle at 62% 48%,
      rgba(79,124,255,.18),
      rgba(79,124,255,.06) 28%,
      transparent 62%
    );
  pointer-events:none;
  z-index:0;
}

.privacy-visual img{
  z-index:1;
}


/* =========================================================
   FINAL PRIVACY MOBILE FIX + HAMBURGER NAV
   Keep this block at the very end of styles.css.

   Why this is needed:
   The desktop CSS intentionally locks html/body and the page
   shell to 1180px. On mobile, that pushes the hamburger/menu
   offscreen unless the shell widths are explicitly reset.
   ========================================================= */

.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,
  .privacy-layout,
  .legal-notice{
    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:1000 !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,.92) !important;
    backdrop-filter:blur(16px) !important;
    border-bottom:1px solid rgba(255,255,255,.05) !important;
  }

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

  .brand img{
    width:142px !important;
    height:auto !important;
    display:block !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:1010 !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,.76) !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:1005 !important;
  }

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

  .navlinks a{
    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;
    opacity:1 !important;
  }

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

  /* Mobile hero */
  .privacy-hero{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    min-height:auto !important;
    padding:56px 28px 44px !important;
    overflow:hidden !important;
  }

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

  .eyebrow{
    font-size:12px !important;
  }

  h1{
    width:100% !important;
    max-width:100% !important;
    font-size:40px !important;
    line-height:1.06 !important;
    letter-spacing:-0.052em !important;
  }

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

  .updated{
    font-size:13px !important;
  }

  .privacy-visual{
    height:210px !important;
    margin:28px -28px 0 !important;
    overflow:hidden !important;
    -webkit-mask-image:none !important;
    mask-image:none !important;
  }

  .privacy-visual img{
    right:-255px !important;
    top:-92px !important;
    width:760px !important;
    max-width:none !important;
    opacity:.72 !important;
  }

  .privacy-hero::after{
    display:none !important;
  }

  /* Privacy policy body.
     Hide the side navigation on mobile; it is the primary reason
     the policy area feels broken on phones. */
  .privacy-layout{
    display:block !important;
    padding:0 28px 54px !important;
    margin:34px 0 0 !important;
  }

  .toc{
    display:none !important;
  }

  .policy{
    width:100% !important;
    max-width:100% !important;
    padding:32px 26px !important;
    border-radius:14px !important;
  }

  .policy section{
    padding-bottom:30px !important;
    margin-bottom:30px !important;
  }

  .policy section:last-child{
    margin-bottom:0 !important;
    padding-bottom:0 !important;
  }

  h2{
    font-size:28px !important;
    line-height:1.16 !important;
  }

  h3{
    font-size:17px !important;
  }

  p,
  li{
    font-size:15.5px !important;
    line-height:1.68 !important;
  }

  ul{
    padding-left:20px !important;
  }

  .contact-card{
    padding:20px !important;
    font-size:15.5px !important;
  }

  /* Footer */
  .footer{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:30px !important;
    padding:40px 28px !important;
  }

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

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

  .footer .socials{
    justify-content:flex-start !important;
  }

  .legal{
    display:block !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;
  }
}

