/* Terms, privacy and contact pages. Tokens and chrome copied from index.html. */
:root{
  --black:oklch(0.19 0.008 350); --stock:oklch(0.975 0 0); --stock-2:oklch(0.93 0 0);
  --ink:oklch(0.2 0.008 350); --ink-2:oklch(0.4 0.008 350);
  --on-black:oklch(0.97 0 0); --on-black-2:oklch(0.84 0.012 350);
  --pink:oklch(0.69 0.25 356); --pink-ink:oklch(0.5 0.22 356);
  --rule:oklch(0.84 0 0); --rule-dark:oklch(0.36 0.01 350);
  --display:"Anybody","Archivo","Helvetica Neue",Arial,sans-serif;
  --sans:"Atkinson Hyperlegible Next","Helvetica Neue",Arial,sans-serif;
  --gutter:clamp(16px,4vw,48px);
  color-scheme:light;
}
*{box-sizing:border-box}
body{margin:0; background:var(--stock); color:var(--ink); font-family:var(--sans); font-size:18px; line-height:1.6; -webkit-font-smoothing:antialiased}
:focus-visible{outline:3px solid var(--pink); outline-offset:3px}
a{color:inherit; text-underline-offset:.22em; text-decoration-thickness:1px}
.wrap{width:100%; max-width:1280px; margin-inline:auto; padding-inline:var(--gutter)}
.skip{position:fixed; left:12px; top:-80px; background:var(--pink); color:var(--black); padding:10px 14px; font-weight:700; text-decoration:none}
.skip:focus{top:12px}

.mast{background:var(--black); color:var(--on-black); border-bottom:1px solid var(--rule-dark)}
.mast .wrap{display:flex; align-items:center; gap:24px; height:64px}
.logo{padding-block:10px; font-family:var(--display); font-weight:900; font-variation-settings:"wdth" 58; font-size:26px; text-transform:uppercase; text-decoration:none; margin-right:auto; line-height:1}
.logo b{color:var(--pink)}
.mast nav{display:flex; gap:22px; font-size:16px; font-weight:600}
.mast nav a{color:var(--on-black); text-decoration:none}
.mast nav a:hover,.mast nav a[aria-current]{color:var(--pink)}
@media(max-width:560px){
  .mast .wrap{flex-wrap:wrap; height:auto; padding-block:12px 4px; row-gap:2px}
  .logo{font-size:22px}
  .mast nav{width:100%; gap:22px}
  .mast nav a{padding-block:10px}
}

.doc{max-width:72ch; padding-block:clamp(40px,7vw,88px)}
.doc h1{font-family:var(--display); font-weight:900; font-variation-settings:"wdth" 62; font-size:clamp(44px,8vw,88px); line-height:.9; text-transform:uppercase; margin:0 0 14px}
.doc .updated{color:var(--ink-2); font-size:16px; margin:0 0 36px}
.doc h2{font-family:var(--display); font-weight:800; font-variation-settings:"wdth" 80; font-size:20px; text-transform:uppercase; margin:40px 0 10px; padding-top:16px; border-top:1px solid var(--rule)}
.doc p,.doc li{margin:0 0 12px; text-wrap:pretty}
.doc ul{padding-left:1.2em; margin:0 0 12px}
.doc table{border-collapse:collapse; width:100%; font-size:16px; margin:0 0 12px}
.doc th,.doc td{text-align:left; vertical-align:top; padding:8px 10px 8px 0; border-bottom:1px solid var(--rule)}

/* contact form */
.form{display:grid; gap:16px; margin-top:28px}
.in{display:flex; flex-direction:column; gap:5px}
.in label{font-size:15px; font-weight:700}
.in input,.in select,.in textarea{width:100%; min-height:46px; padding:10px 12px; background:#fff; border:1.5px solid var(--ink); border-radius:0; font:inherit; font-size:17px}
.in textarea{resize:vertical; min-height:160px}
.in input:focus,.in select:focus,.in textarea:focus{outline:3px solid var(--pink); outline-offset:0}
.in small{font-size:15px; color:var(--ink-2)}
.hp{position:absolute; left:-9999px}
.btn{justify-self:start; min-height:48px; padding:12px 22px; border:2px solid var(--pink); border-radius:0; background:var(--pink); color:var(--black); font:inherit; font-weight:700; font-size:16px; cursor:pointer}
.btn:hover{background:var(--black); color:var(--pink)}
.sent{display:none; padding:14px 16px; border:2px solid var(--ink); background:#fff; font-weight:600}
.sent:target{display:block}

footer{background:var(--black); color:var(--on-black-2); padding-block:28px; font-size:16px}
footer .wrap{display:flex; flex-wrap:wrap; justify-content:space-between; gap:10px 28px}
footer a{color:var(--on-black); display:inline-block; padding-block:5px}
footer .links{display:flex; flex-wrap:wrap; gap:2px 20px}
footer .wrap{align-items:center}
footer .social{display:flex; gap:4px; margin:-11px auto -11px -11px}
footer .social a{display:grid; place-items:center; width:44px; height:44px; padding:0; color:var(--on-black)}
footer .social a:hover{color:var(--pink)}
.cookie-link{background:none; border:0; padding:5px 0; color:var(--on-black); font:inherit; text-decoration:underline; text-underline-offset:.22em; text-decoration-thickness:1px; cursor:pointer}
