/* Terms page — KS HackZone
   Uses variables from layout.css (:root) */

   .terms-wrap{
    display:grid; gap:1rem; align-items:start;
    grid-template-columns: 260px 1fr;
  }
  @media (max-width: 980px){
    .terms-wrap{grid-template-columns:1fr}
  }
  
  /* Sticky Table of Contents */
  .toc{
    position:sticky; top:84px;
    background:linear-gradient(180deg,#ffffff24,#ffffff12);
    border:1px solid var(--stroke);
    border-radius:16px;
    box-shadow:var(--shadow);
    backdrop-filter: blur(12px) saturate(140%);
    padding:12px;
  }
  .toc h3{margin:.1rem 0 .3rem; font-size:1rem; letter-spacing:.2px}
  .toc a{
    display:block; padding:.36rem .5rem; border-radius:10px; color:var(--text);
    border:1px solid transparent;
  }
  .toc a:hover{background:var(--glass-2); border-color:var(--stroke)}
  .toc .sep{
    height:1px; margin:.4rem 0; border:0;
    background:linear-gradient(90deg, transparent, #a176ff55, transparent);
  }
  
  /* Document body */
  .doc{
    background:
      radial-gradient(260px 180px at 20% 0%, #8a64ff2a, transparent 60%),
      linear-gradient(180deg,#ffffff20,#ffffff10);
    border:1px solid var(--stroke);
    border-radius:var(--radius);
    box-shadow:var(--shadow);
    backdrop-filter: blur(12px) saturate(140%);
    padding:18px;
  }
  .doc header{margin-bottom:6px}
  .doc .pill{
    display:inline-flex; align-items:center; gap:.45rem;
    padding:.25rem .6rem; border-radius:999px; font-weight:700; letter-spacing:.2px;
    background:linear-gradient(180deg,#ffffff24,#ffffff12);
    border:1px solid var(--stroke);
  }
  .doc h1{margin:.4rem 0 0; font-size:clamp(1.6rem,2.2vw + 1rem,2.2rem)}
  .doc .lead{color:var(--muted); margin:.2rem 0 0}
  
  .doc h2{
    margin:1.1rem 0 .3rem; font-size:1.25rem;
    border-bottom:1px dashed #a176ff55; padding-bottom:.35rem
  }
  .doc h3{margin:.8rem 0 .2rem; font-size:1.05rem}
  .doc p{margin:.32rem 0}
  .doc ul{margin:.2rem 0 .2rem 1.1rem}
  .doc li{margin:.18rem 0}
  .doc a{color:var(--cyan); text-decoration:none}
  .doc a:hover{filter:brightness(1.08)}
  
  .kv{
    display:grid; grid-template-columns: 180px 1fr; gap:.4rem .8rem;
    padding:.6rem; border-radius:12px; border:1px dashed #7d69e955;
    background:linear-gradient(180deg,#ffffff18,#ffffff0e);
  }
  @media (max-width: 560px){
    .kv{grid-template-columns:1fr}
  }
  
  /* Callouts */
  .callout{
    margin:.6rem 0; padding:.7rem .8rem; border-radius:12px;
    border:1px solid var(--stroke);
    background:linear-gradient(180deg,#ffffff22,#ffffff10);
  }
  .callout.info{background:linear-gradient(180deg,#6be2ff22,#6be2ff10)}
  .callout.warn{background:linear-gradient(180deg,#ffd16633,#ffd16618)}
  .callout.danger{background:linear-gradient(180deg,#ff7f9d33,#ff7f9d18)}
  .callout strong{color:#fff}