/* Pink Mayhem — shared styles for the legal pages (terms, privacy, cookies).
   Tokens are copied from the :root block in index.html. If a token changes
   there, change it here too. The homepage keeps its CSS inline on purpose. */

:root{
  --concrete:#EDEAE4;
  --concrete-deep:#E2DED6;
  --ink:#17151A;
  --ink-soft:#2A262F;
  --slate:#5E5A63;
  --stone:#A9A4AE;
  --c1:#E5384A;
  --c6:#2D6BE4;
  --c8:#D6249F;
  --rosewood:#17151A;
  --rosewood-deep:#000000;
  --ash:#EDEAE4;
  --rose:#F2C8DE;
  --plum:#D6249F;
  --brass:#EFB700;
  --maxw:820px;
  --gut:clamp(20px,5vw,64px);
}
*{box-sizing:border-box}
body{
  margin:0;background:var(--ash);color:var(--ink);
  font-family:"Chivo",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-weight:400;font-size:16.5px;line-height:1.68;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit}
.wrap{max-width:var(--maxw);margin:0 auto;padding-left:var(--gut);padding-right:var(--gut)}
.eyebrow{
  font-family:"Chivo Mono",ui-monospace,monospace;font-size:11.5px;font-weight:500;
  letter-spacing:.22em;text-transform:uppercase;
}

/* nav — matches the homepage bar so the pages do not feel detached */
.nav{background:var(--rosewood);color:var(--ash);border-bottom:1px solid rgba(233,220,216,.14)}
.nav__inner{max-width:1180px;margin:0 auto;padding:0 var(--gut);height:64px;display:flex;align-items:center;gap:28px}
.brand{font-family:"Archivo",system-ui,sans-serif;font-weight:800;font-size:18px;letter-spacing:-.005em;text-decoration:none;white-space:nowrap}
.brand span{color:var(--brass)}
.nav__back{margin-left:auto;font-size:13.5px;text-decoration:none;color:var(--stone);transition:color .18s}
.nav__back:hover{color:var(--ash)}
.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;z-index:99;background:var(--brass);color:#000;padding:10px 14px;border-radius:6px}

/* document head */
.doc__head{background:var(--rosewood);color:var(--ash);padding:clamp(52px,7vw,88px) 0 clamp(34px,4vw,52px)}
.doc__head .eyebrow{color:var(--brass);display:block;margin-bottom:20px}
.doc__head h1{
  font-family:"Rubik Spray Paint","Permanent Marker",cursive;font-weight:400;
  font-size:clamp(34px,6vw,58px);line-height:1.14;margin:0;
}
.doc__meta{margin-top:22px;font-family:"Chivo Mono",ui-monospace,monospace;font-size:12.5px;color:var(--stone);line-height:1.9}

/* document body — monochrome by design: these are documents, not marketing */
.doc{padding:clamp(48px,6vw,76px) 0 clamp(64px,8vw,104px)}
.doc h2{
  font-family:"Archivo",system-ui,sans-serif;font-weight:800;font-size:clamp(19px,2.2vw,23px);
  letter-spacing:-.01em;line-height:1.2;margin:2.4em 0 .7em;
}
.doc h2:first-child{margin-top:0}
.doc h3{
  font-family:"Archivo",system-ui,sans-serif;font-weight:700;font-size:16.5px;
  margin:1.7em 0 .5em;
}
.doc p,.doc li{color:var(--ink-soft)}
.doc p{margin:0 0 1.05em}
.doc ul,.doc ol{margin:0 0 1.2em;padding-left:1.3em}
.doc li{margin-bottom:.5em}
.doc a{color:#9B1273;text-decoration:underline;text-underline-offset:2px}
.doc a:hover{color:var(--plum)}
.doc strong{font-weight:600;color:var(--ink)}
.doc__lede{font-size:17.5px;color:var(--slate);margin-bottom:2em}
.doc dl{margin:0 0 1.4em}
.doc dt{font-weight:600;margin-top:.9em}
.doc dd{margin:.2em 0 0;color:var(--ink-soft)}

/* part divider — Terms runs two audiences in one document */
.part{
  margin:3.4em 0 0;padding-top:1.6em;border-top:2px solid var(--ink);
}
.part .eyebrow{color:#8A5A5F;display:block;margin-bottom:10px}
.part h2{margin-top:0}

/* callout — used sparingly for the things a reader must not miss */
.callout{
  background:var(--concrete-deep);border-left:3px solid var(--plum);
  padding:18px 20px;margin:1.6em 0;font-size:15.5px;
}
.callout p:last-child{margin-bottom:0}
.callout b{display:block;margin-bottom:6px}

/* table for retention periods */
.tbl{width:100%;border-collapse:collapse;margin:0 0 1.6em;font-size:15px}
.tbl th,.tbl td{text-align:left;padding:11px 12px;border-bottom:1px solid rgba(23,21,26,.14);vertical-align:top}
.tbl th{font-family:"Chivo Mono",ui-monospace,monospace;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--slate);font-weight:500}
@media(max-width:560px){.tbl,.tbl tbody,.tbl tr,.tbl td,.tbl th{display:block}.tbl th{border:0;padding-bottom:2px}.tbl td{border:0;padding-top:0}.tbl tr{border-bottom:1px solid rgba(23,21,26,.14);padding:10px 0}}

/* footer — cut down from the homepage footer */
.foot{background:var(--rosewood);color:var(--stone);padding:clamp(40px,5vw,60px) 0;font-size:13.5px;line-height:1.75}
.foot__links{display:flex;flex-wrap:wrap;gap:20px;margin-bottom:20px}
.foot__links a{color:var(--ash);text-decoration:none;border-bottom:1px solid rgba(233,220,216,.3);padding-bottom:2px}
.foot__links a:hover{border-bottom-color:var(--brass)}
.foot__legal{margin:0}