/* ============================================================
   LEGAL PAGES (Privacy Policy, Cookie Policy). One readable column
   on the dark v8hub field, using the site's own type and colours.
   ============================================================ */
.v8hub .dhero.dhero-center.legal-hero{min-height:58vh;padding:150px 0 70px}
.v8hub .legal{position:relative;z-index:1;padding:40px 0 110px}
.v8hub .legal-in{max-width:760px;margin:0 auto;padding:0 24px}
.v8hub .legal-updated{font-size:var(--fs-meta);letter-spacing:.18em;text-transform:uppercase;color:var(--gold-light);margin:0 0 36px}
.v8hub .legal h2{font-family:var(--font-display);font-size:clamp(1.5rem,2.6vw,2rem);line-height:1.2;color:var(--cream);margin:56px 0 16px}
.v8hub .legal h2:first-of-type{margin-top:0}
.v8hub .legal h3{font-family:var(--font-display);font-size:1.25rem;color:var(--cream);margin:32px 0 10px}
.v8hub .legal p,.v8hub .legal li{font-weight:300;color:rgba(255,250,241,.82);line-height:1.75}
.v8hub .legal p{margin:0 0 16px}
.v8hub .legal ul{margin:0 0 18px;padding-left:1.2em;list-style:disc}
.v8hub .legal li{margin:0 0 8px}
.v8hub .legal li::marker{color:var(--gold-light)}
.v8hub .legal strong{font-weight:600;color:var(--cream)}
.v8hub .legal a{color:var(--gold-light);text-decoration:underline;text-underline-offset:3px}
.v8hub .legal a:hover{color:var(--cream)}
/* 44px tap area for every link, text position unchanged (padding offset by margin) */
.v8hub .legal a{display:inline-block;padding:12px 2px;margin:-12px -2px}
.v8hub .legal li > a:only-child{min-width:44px;text-align:center}
/* tables wrap their text; the frame only scrolls if a cell truly cannot fit */
.v8hub .legal .legal-table{overflow-x:auto;margin:6px 0 24px;border:1px solid rgba(255,250,241,.12);border-radius:12px}
.v8hub .legal table{width:100%;border-collapse:collapse;font-size:.95rem}
.v8hub .legal th,.v8hub .legal td{text-align:left;vertical-align:top;padding:12px 14px;border-bottom:1px solid rgba(255,250,241,.1);color:rgba(255,250,241,.82);font-weight:300}
.v8hub .legal th{font-family:var(--font-body);font-weight:600;font-size:var(--fs-meta);letter-spacing:.12em;text-transform:uppercase;color:var(--gold-light)}
.v8hub .legal tr:last-child td{border-bottom:0}
.v8hub .legal .legal-card{background:rgba(255,250,241,.05);border:1px solid rgba(208,165,74,.3);border-radius:14px;padding:20px 22px;margin:8px 0 24px}
.v8hub .legal .legal-card p:last-child{margin-bottom:0}
@media(max-width:767px){
  .v8hub .dhero.dhero-center.legal-hero{min-height:48vh;padding:120px 0 50px}
  .v8hub .legal{padding:28px 0 80px}
  .v8hub .legal h2{margin-top:44px}
  /* phones: each table row becomes a small stacked card */
  .v8hub .legal .legal-table{border:0;overflow:visible}
  .v8hub .legal table,.v8hub .legal tbody,.v8hub .legal tr,.v8hub .legal td{display:block;width:100%}
  .v8hub .legal thead{display:none}
  .v8hub .legal tr{background:rgba(255,250,241,.04);border:1px solid rgba(255,250,241,.12);border-radius:12px;padding:12px 14px;margin:0 0 10px}
  .v8hub .legal td{padding:2px 0;border:0}
  .v8hub .legal td:first-child{font-weight:600;color:var(--cream);margin-bottom:2px;word-break:break-word}
  .v8hub .legal td:not(:first-child)::before{display:block;font-size:var(--fs-meta);letter-spacing:.12em;text-transform:uppercase;color:var(--gold-light);margin-top:8px}
  .v8hub .legal .t-basis td:nth-child(2)::before{content:"Lawful basis"}
  .v8hub .legal .t-cookies td:nth-child(2)::before{content:"What it does"}
  .v8hub .legal .t-cookies td:nth-child(3)::before{content:"How long"}
  /* long-form text reads left-aligned on phones, unlike the centred page heads */
  .v8hub .legal-in, .v8hub .legal-in p, .v8hub .legal-in h2, .v8hub .legal-in h3, .v8hub .legal-in li{text-align:left}
}
