/* Shared legal-page layout (Terms of Service, Privacy Policy): a page
   hero, long-form sections, and a sticky "On this page" TOC. Enqueued
   on page-terms-of-service.php and page-privacy-policy.php. */

  /* ===== PAGE HERO ===== */
  .page-hero{background:var(--bg);color:var(--white);padding:70px 0 54px;}
  .page-hero .tag{color:var(--blue-1);font-size:14px;font-weight:600;margin-bottom:14px;}
  .page-hero h1{font-size:clamp(30px,4.4vw,44px);font-weight:700;letter-spacing:-.02em;line-height:1.12;}
  .page-hero p{margin-top:12px;color:var(--muted);font-size:14.5px;}

  /* ===== BODY LAYOUT (content + sticky "On this page" TOC, same
     1fr/30%-with-min-width:0 pattern used by the blog's post/TOC split,
     so long words in the legal text can never push the TOC off-canvas) ===== */
  .tos-body{padding:70px 0 110px;background:var(--white);}
  /* align-items is left at its default (stretch) on purpose -- the TOC
     column must stretch to match .tos-main's full height, or there's no
     room below the short nav for position:sticky to actually stick. */
  .tos-layout{display:grid;grid-template-columns:1fr 280px;gap:60px;}
  .tos-main{min-width:0;}

  .tos-section{padding-bottom:40px;margin-bottom:40px;border-bottom:1px solid #EEF0F4;}
  .tos-section:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0;}
  .tos-section h2{
    font-size:21px;font-weight:700;letter-spacing:-.01em;margin-bottom:16px;scroll-margin-top:24px;
  }
  .tos-section p{color:#333A47;font-size:14.5px;line-height:1.75;margin-bottom:14px;}
  .tos-section p:last-child{margin-bottom:0;}
  .tos-section p a{color:var(--blue-2);font-weight:600;word-break:break-word;}
  .tos-lettered{
    list-style:lower-alpha;margin:0 0 14px 22px;color:#333A47;font-size:14.5px;line-height:1.75;
  }
  .tos-lettered li{padding-left:4px;margin-bottom:6px;}
  .tos-bullets{
    list-style:disc;margin:0 0 14px 22px;color:#333A47;font-size:14.5px;line-height:1.75;
  }
  .tos-bullets li{padding-left:4px;margin-bottom:6px;}

  /* ===== STICKY TOC ===== */
  .tos-toc-wrap{position:relative;}
  .tos-toc{position:sticky;top:100px;}
  .tos-toc-label{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted-dark);margin-bottom:14px;}
  .tos-toc ul{list-style:none;display:flex;flex-direction:column;gap:2px;border-left:2px solid #EEF0F4;}
  .tos-toc-link{
    display:block;padding:7px 0 7px 16px;font-size:13px;color:var(--muted-dark);line-height:1.4;
    border-left:2px solid transparent;margin-left:-2px;transition:color .2s,border-color .2s;
  }
  .tos-toc-link:hover{color:var(--ink);}
  .tos-toc-link.active{color:var(--blue-2);font-weight:600;border-left-color:var(--blue-2);}

  /* ===== RESPONSIVE ===== */
  @media (max-width:980px){
    .tos-layout{grid-template-columns:1fr 220px;gap:40px;}
  }
  @media (max-width:780px){
    .tos-layout{grid-template-columns:1fr;}
    .tos-toc-wrap{order:-1;}
    .tos-toc{position:relative;top:0;border:1px solid #EEF0F4;border-radius:14px;padding:18px 20px;margin-bottom:20px;}
    .tos-toc ul{max-height:220px;overflow-y:auto;}
  }
  @media (max-width:640px){
    .page-hero{padding:56px 0 44px;}
    .tos-body{padding:50px 0 70px;}
  }
  @media (max-width:520px){
    .wrap{padding:0 20px;}
  }
