: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}
.terms-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;
}
.terms-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}
.terms-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%
  );
}
.terms-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));
  z-index:1;
}
.terms-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}
.terms-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)}
.socials{display:flex;align-items:center;gap:12px;margin-top:14px}
.socials a{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;margin:0}
.socials img{display:block;width:38px;height:38px;margin:0}
.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,.terms-layout,.legal-notice{margin-left:68px;margin-right:0}.toc{position:static}}

/* ------------------------------------------------------------------
   FINAL TERMS HERO VISUAL INTEGRATION
   Matches the final privacy page treatment so the shared hero image
   feels embedded in the page rather than boxed inside the image area.
------------------------------------------------------------------- */

.terms-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;
}


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

   The desktop CSS intentionally locks the page shell to 1180px.
   This mobile override resets that fixed canvas on phones, adds
   a checkbox-driven hamburger menu, and hides the side TOC on
   mobile so the terms content reads cleanly.
   ========================================================= */

.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,
  .terms-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 */
  .terms-hero{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    min-height:auto !important;
    padding:56px 28px 44px !important;
    overflow:hidden !important;
  }

  .terms-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;
  }

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

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

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

  /* Terms body.
     Hide the side navigation on mobile; the long TOC makes the
     content feel broken on phone-sized screens. */
  .terms-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;
  }
}