/* DriveTogether legal pages — v12 */
.legal-page {
  --legal-header-h: 76px;
  background:
    radial-gradient(900px 560px at 80% -4%, rgba(24, 158, 224, .13), transparent 68%),
    radial-gradient(760px 520px at -12% 30%, rgba(18, 84, 134, .11), transparent 70%),
    linear-gradient(180deg, #020914 0%, #04111e 48%, #020811 100%);
}
.legal-page::before {
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:.22;
  background-image:
    linear-gradient(rgba(71,196,238,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(71,196,238,.035) 1px, transparent 1px);
  background-size:72px 72px;
  mask-image:linear-gradient(to bottom, rgba(0,0,0,.7), transparent 72%);
}

/* Header aligned with the new landing page */
.legal-page .site-header {
  position:sticky;
  top:0;
  z-index:80;
  background:rgba(2, 9, 20, .72);
  border-bottom:1px solid rgba(96, 196, 238, .11);
  backdrop-filter:blur(22px) saturate(130%);
  box-shadow:0 14px 40px rgba(0,0,0,.18);
}
.legal-page .nav { min-height:var(--legal-header-h); padding:9px 0; }
.legal-page .brand { font-size:1rem; font-weight:670; letter-spacing:-.03em; text-transform:none; }
.legal-page .brand-mark { width:42px; height:42px; border-radius:12px; }
.legal-page .nav-main { gap:14px; }
.legal-page .nav-links {
  gap:2px;
  padding:0;
  border:0;
  background:transparent;
}
.legal-page .nav-links a {
  color:#9aabba;
  font-size:.78rem;
  font-weight:520;
  padding:9px 10px;
  border-radius:10px;
}
.legal-page .nav-links a:hover,
.legal-page .nav-links a:focus-visible {
  color:#f1fbff;
  background:rgba(54, 192, 239, .065);
}
.legal-page .language-switch {
  padding:3px;
  border-color:rgba(58, 195, 241, .22);
  background:rgba(4, 18, 31, .84);
}
.legal-page .language-switch button {
  min-width:48px;
  padding:7px 11px;
  font-size:.72rem;
  font-weight:620;
}
.legal-page .legal-google-play {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:36px;
  padding:0 14px;
  border:1px solid rgba(58, 203, 244, .36);
  border-radius:11px;
  background:linear-gradient(180deg, rgba(27, 173, 225, .18), rgba(20, 124, 180, .10));
  color:#eafbff;
  font-size:.74rem;
  font-weight:620;
  box-shadow:0 0 26px rgba(26, 173, 226, .08);
}
.legal-page .legal-google-play:hover { border-color:rgba(74, 215, 255, .62); color:white; }

/* Dedicated legal navigation */
.legal-tab-shell {
  position:sticky;
  top:var(--legal-header-h);
  z-index:70;
  padding:12px 0;
  border-bottom:1px solid rgba(86, 180, 225, .08);
  background:rgba(3, 12, 23, .72);
  backdrop-filter:blur(16px);
}
.legal-tabs {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  width:min(640px, 100%);
  margin:0 auto;
  padding:4px;
  border:1px solid rgba(80, 175, 222, .14);
  border-radius:999px;
  background:rgba(255,255,255,.018);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.02);
}
.legal-tabs a {
  flex:1 1 0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:38px;
  padding:0 14px;
  border-radius:999px;
  color:#8195a7;
  font-size:.75rem;
  font-weight:560;
  white-space:nowrap;
  border:1px solid transparent;
}
.legal-tabs a:hover { color:#dcf7ff; }
.legal-tabs a.is-active {
  color:#f4fbff;
  border-color:rgba(57, 204, 247, .46);
  background:linear-gradient(180deg, rgba(41, 186, 236, .16), rgba(22, 129, 183, .08));
  box-shadow:0 0 28px rgba(32, 181, 232, .14), inset 0 0 18px rgba(38, 181, 229, .05);
}
.legal-tabs svg { width:16px; height:16px; stroke:currentColor; stroke-width:1.7; fill:none; }

/* Page hero */
.legal-page main.site-shell.hero {
  width:min(1180px, calc(100% - 40px));
  padding:42px 0 80px;
}
.legal-page .doc {
  max-width:none;
  overflow:visible;
  border:0;
  background:transparent;
  box-shadow:none;
}
.legal-page .doc::before { display:none; }
.legal-page .content-card { padding:0; }
.legal-page .eyebrow {
  display:inline-flex;
  align-items:center;
  min-height:28px;
  margin:0 0 18px;
  padding:0 10px;
  border:1px solid rgba(56, 200, 244, .24);
  border-radius:999px;
  background:rgba(25, 157, 211, .07);
  color:#56d7fb;
  font-size:.67rem;
  font-weight:650;
  letter-spacing:.16em;
}
.legal-page .doc-meta {
  margin:0 0 26px;
  gap:7px;
}
.legal-page .pill {
  padding:7px 10px;
  border-color:rgba(83, 176, 220, .12);
  background:rgba(255,255,255,.018);
  color:#748a9d;
  font-size:.68rem;
}

.legal-hero-block {
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(0, 1fr) 270px;
  gap:40px;
  align-items:end;
  margin:0 0 34px;
  padding:clamp(30px, 5vw, 58px);
  border:1px solid rgba(73, 189, 235, .17);
  border-radius:30px;
  background:
    radial-gradient(380px 260px at 92% 12%, rgba(35, 183, 232, .13), transparent 72%),
    linear-gradient(145deg, rgba(9, 27, 43, .92), rgba(4, 16, 29, .78));
  box-shadow:0 30px 90px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.025);
}
.legal-hero-block::before {
  content:"";
  position:absolute;
  right:-80px;
  bottom:-150px;
  width:420px;
  height:420px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(33,184,235,.13), rgba(33,184,235,.02) 48%, transparent 70%);
  pointer-events:none;
}
.legal-hero-copy { position:relative; z-index:1; }
.legal-page .doc h1 {
  max-width:850px;
  margin:0;
  font-size:clamp(2.75rem, 5.7vw, 5.4rem);
  line-height:.98;
  letter-spacing:-.062em;
  font-weight:520;
}
.legal-page .doc h1 .accent-word { color:#38c9f4; }
.legal-page .doc .notice {
  max-width:760px;
  margin:24px 0 0;
  padding:0;
  border:0;
  background:transparent;
  color:#9fb3c3 !important;
  font-size:1rem;
  line-height:1.7;
}
.legal-hero-mark {
  position:relative;
  z-index:1;
  width:190px;
  height:190px;
  justify-self:end;
  display:grid;
  place-items:center;
  border:1px solid rgba(56, 207, 250, .26);
  border-radius:50%;
  background:
    radial-gradient(circle, rgba(26,175,229,.16), rgba(26,175,229,.035) 50%, transparent 72%);
  box-shadow:0 0 70px rgba(25, 170, 224, .12), inset 0 0 38px rgba(36, 186, 234, .05);
}
.legal-hero-mark::before,
.legal-hero-mark::after {
  content:"";
  position:absolute;
  border:1px solid rgba(61, 204, 246, .12);
  border-radius:50%;
}
.legal-hero-mark::before { inset:18px; }
.legal-hero-mark::after { inset:42px; }
.legal-hero-mark svg { width:68px; height:68px; stroke:#48d4f9; stroke-width:1.35; fill:none; filter:drop-shadow(0 0 20px rgba(58, 208, 247, .32)); }
.legal-hero-label {
  position:absolute;
  bottom:-13px;
  left:50%;
  transform:translateX(-50%);
  padding:6px 10px;
  border:1px solid rgba(53, 205, 246, .25);
  border-radius:999px;
  background:#05111e;
  color:#6edfff;
  font-size:.62rem;
  font-weight:650;
  letter-spacing:.12em;
  text-transform:uppercase;
  white-space:nowrap;
}

/* Main document layout */
.legal-layout {
  display:grid;
  grid-template-columns:260px minmax(0, 1fr);
  gap:24px;
  align-items:start;
}
.legal-aside {
  position:sticky;
  top:calc(var(--legal-header-h) + 82px);
  padding:18px;
  border:1px solid rgba(76, 177, 224, .14);
  border-radius:20px;
  background:linear-gradient(150deg, rgba(8, 24, 39, .84), rgba(4, 15, 27, .74));
  box-shadow:0 18px 48px rgba(0,0,0,.20);
}
.legal-aside-title {
  margin:0 0 12px;
  color:#738a9d;
  font-size:.64rem;
  font-weight:650;
  letter-spacing:.15em;
  text-transform:uppercase;
}
.legal-toc { display:grid; gap:3px; }
.legal-toc a {
  display:grid;
  grid-template-columns:28px minmax(0, 1fr);
  gap:9px;
  align-items:center;
  min-height:40px;
  padding:6px 8px;
  border:1px solid transparent;
  border-radius:11px;
  color:#869aaa;
  font-size:.71rem;
  font-weight:500;
  line-height:1.25;
}
.legal-toc a:hover,
.legal-toc a.is-current {
  color:#e8faff;
  border-color:rgba(52, 198, 240, .17);
  background:rgba(37, 172, 222, .065);
}
.legal-toc-index {
  display:grid;
  place-items:center;
  width:26px;
  height:26px;
  border:1px solid rgba(63, 196, 240, .18);
  border-radius:8px;
  color:#52d8fb;
  background:rgba(32, 159, 211, .06);
  font-size:.61rem;
}
.legal-support-card {
  margin-top:16px;
  padding-top:16px;
  border-top:1px solid rgba(82, 174, 220, .10);
  color:#718699;
  font-size:.68rem;
  line-height:1.5;
}
.legal-support-card a { display:inline-block; margin-top:8px; color:#57d7f8; font-weight:550; }

.legal-section-list { display:grid; gap:12px; min-width:0; }
.legal-section-card {
  position:relative;
  scroll-margin-top:160px;
  overflow:hidden;
  padding:28px 30px 30px;
  border:1px solid rgba(79, 175, 220, .13);
  border-radius:20px;
  background:linear-gradient(145deg, rgba(8, 24, 39, .82), rgba(4, 15, 27, .70));
  box-shadow:0 18px 50px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.018);
  transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.legal-section-card:hover {
  transform:translateY(-1px);
  border-color:rgba(64, 198, 241, .22);
  box-shadow:0 22px 60px rgba(0,0,0,.22), 0 0 28px rgba(27, 169, 219, .035);
}
.legal-section-card::after {
  content:"";
  position:absolute;
  right:-90px;
  top:-100px;
  width:220px;
  height:220px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(35,179,226,.055), transparent 70%);
  pointer-events:none;
}
.legal-section-heading {
  display:grid;
  grid-template-columns:38px minmax(0, 1fr);
  gap:13px;
  align-items:center;
  margin:0 0 18px;
}
.legal-section-number {
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  border:1px solid rgba(53, 203, 245, .24);
  border-radius:12px;
  background:linear-gradient(145deg, rgba(34, 179, 229, .12), rgba(20, 100, 151, .05));
  color:#54d8fb;
  font-size:.72rem;
  font-weight:650;
  box-shadow:0 0 22px rgba(28, 173, 223, .06);
}
.legal-page .doc .legal-section-card h2 {
  margin:0;
  padding:0;
  border:0;
  font-size:clamp(1.18rem, 2vw, 1.5rem);
  font-weight:560;
  letter-spacing:-.025em;
}
.legal-page .doc .legal-section-card h3 {
  margin:26px 0 9px;
  color:#d8e9f2;
  font-size:.98rem;
  font-weight:560;
  letter-spacing:-.012em;
}
.legal-page .doc .legal-section-card p,
.legal-page .doc .legal-section-card li {
  color:#9aafbf;
  font-size:.90rem;
  line-height:1.68;
}
.legal-page .doc .legal-section-card p { max-width:none; margin:11px 0; }
.legal-page .doc .legal-section-card ul,
.legal-page .doc .legal-section-card ol { max-width:none; margin:12px 0 14px; padding-left:1.28rem; }
.legal-page .doc .legal-section-card li { margin:4px 0; }
.legal-page .doc .legal-section-card strong { color:#dbeaf2; font-weight:580; }
.legal-page .doc .legal-section-card code {
  border-color:rgba(65, 198, 240, .17);
  background:rgba(40, 176, 222, .065);
}
.legal-page .doc .legal-section-card a { border-bottom-color:rgba(67, 205, 245, .18); }

/* Delete page gets a restrained warning accent */
.delete-page .legal-section-card:last-child { border-color:rgba(255, 111, 125, .13); }
.delete-page .legal-section-card:last-child .legal-section-number { border-color:rgba(255,111,125,.22); color:#ff8591; background:rgba(171,45,61,.07); }
.delete-page .legal-hero-block { background:radial-gradient(380px 260px at 92% 12%, rgba(37, 184, 232, .12), transparent 72%), linear-gradient(145deg, rgba(9, 27, 43, .92), rgba(4, 16, 29, .78)); }

.legal-page .site-footer {
  width:min(1180px, calc(100% - 40px));
  padding:0 0 46px;
  color:#5f7488;
}
.legal-page .site-footer p { display:flex; flex-wrap:wrap; gap:8px; align-items:center; padding-top:20px; }

@media (max-width: 980px) {
  .legal-page .nav-links { display:none; }
  .legal-page .legal-google-play { display:none; }
  .legal-layout { grid-template-columns:1fr; }
  .legal-aside { position:relative; top:auto; }
  .legal-toc { grid-template-columns:repeat(2, minmax(0,1fr)); }
  .legal-hero-block { grid-template-columns:1fr 170px; }
  .legal-hero-mark { width:150px; height:150px; }
}
@media (max-width: 720px) {
  .legal-page { --legal-header-h: 68px; }
  .legal-page .site-header { position:sticky; }
  .legal-page .nav { min-height:68px; flex-direction:row; align-items:center; padding:8px 0; }
  .legal-page .nav-main { margin-left:auto; width:auto; }
  .legal-page .language-switch { margin:0; }
  .legal-tab-shell { top:68px; padding:8px 0; }
  .legal-tabs { width:100%; border-radius:16px; }
  .legal-tabs a { min-height:36px; padding:0 8px; font-size:.68rem; }
  .legal-tabs svg { display:none; }
  .legal-page main.site-shell.hero { width:min(100% - 24px, 1180px); padding:30px 0 54px; }
  .legal-hero-block { grid-template-columns:1fr; gap:18px; padding:28px 22px 30px; border-radius:24px; }
  .legal-hero-mark { display:none; }
  .legal-page .doc h1 { font-size:clamp(2.45rem, 13vw, 4rem); line-height:1.02; }
  .legal-page .doc .notice { font-size:.92rem; }
  .legal-toc { grid-template-columns:1fr; }
  .legal-aside { padding:14px; border-radius:17px; }
  .legal-section-card { padding:22px 18px 24px; border-radius:17px; }
  .legal-section-heading { grid-template-columns:34px minmax(0,1fr); gap:10px; }
  .legal-section-number { width:34px; height:34px; border-radius:10px; }
  .legal-page .site-footer { width:min(100% - 24px, 1180px); }
}
