/* ============================================================================
   AVAVA Radio — Privacy policy
   Own styles for privacy.html. Everything shared (header, crumbs, page intro,
   footer, mono/dim helpers, ember buttons) lives in style.css.

   01. Section frame and headings
   02. The short version
   03. What we never do
   04. What we do keep
   05. Cookies — the inspector table
   06. Who else sees anything
   07. What you can ask for — the request form
   08. The paperwork
   09. Responsive ≤1100px / ≤760px
   ========================================================================= */

/* ------------------------------------------- 01. frame and headings ----- */
.pv-sec { padding-top: 0; padding-bottom: 0; }
.pv-sec--first { padding-top: 40px; }   /* the handoff's gap from the header to the first block */
.pv-sec--last { padding-bottom: 60px; }
/* the rules between the sections of this page are a touch stronger */
.page .divider { background: var(--i18); }

.pv-head { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 16px; padding: 16px 0; }
.pv-h { margin: 0; font: 700 clamp(24px, 3.2vw, 52px) / .95 'Bricolage Grotesque', sans-serif; letter-spacing: -.045em; text-transform: uppercase; }
.pv-h--s { font-size: clamp(20px, 2.2vw, 32px); line-height: 1; letter-spacing: -.04em; }

/* every section opens on a rule and breathes under it */
.pv-rule { border-top: 2px solid var(--ink); padding-top: clamp(16px, 2vw, 26px); }
.pv-rule--soft { border-top: 2px solid var(--i5); padding-top: clamp(16px, 2vw, 26px); }

.pv-sub { margin: 0; font: 700 clamp(16px, 1.7vw, 21px) / 1.1 'Bricolage Grotesque', sans-serif; letter-spacing: -.03em; text-transform: uppercase; text-wrap: pretty; }
.pv-sub--s { font-size: 19px; letter-spacing: -.035em; }
.pv-x { font: 400 14px / 1.5 Archivo, sans-serif; color: var(--i6); text-wrap: pretty; }
.pv-x--s { font-size: 14px; line-height: 1.45; color: var(--i7); }
.pv-x--m { font: 400 15px / 1.55 Archivo, sans-serif; color: var(--i7); }

.pv-foot { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; padding-top: 8px; }
.pv-foot--rule { margin-top: clamp(16px, 2vw, 22px); padding-top: 16px; border-top: 1px solid var(--i16); }
.pv-foot--plain { padding-top: 0; }

/* ---------------------------------------------- 02. the short version --- */
.pv-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--i18); }

/* the hairlines between the cells are the grid's own background */
.pv-cells { display: grid; grid-template-columns: repeat(auto-fit, minmax(215px, 1fr)); gap: 1px; background: var(--i14); margin-top: clamp(18px, 2.4vw, 28px); list-style: none; }
.pv-cell { display: flex; flex-direction: column; gap: 12px; min-width: 0; padding: 24px 22px 20px; background: var(--paper); }
.pv-cell--on { background: color-mix(in srgb, var(--accent) 9%, transparent); box-shadow: inset 2px 0 0 var(--accent); }
.pv-n { font: 800 clamp(46px, 6vw, 86px) / .86 Orbitron, sans-serif; }
.pv-cell .mono { color: var(--i5); }
.pv-cell--on .pv-n, .pv-cell--on .mono { color: var(--accent); }

.pv-lede { display: flex; align-items: flex-end; flex-wrap: wrap; gap: clamp(20px, 3vw, 48px); padding-top: clamp(20px, 2.6vw, 30px); }
.pv-said { flex: 1 1 560px; min-width: 0; font: 400 clamp(19px, 2.2vw, 29px) / 1.35 'Instrument Serif', serif; font-style: italic; text-wrap: pretty; }
.pv-ask { display: flex; flex-direction: column; gap: 7px; flex: none; }
.pv-mail { font-family: 'DM Mono', ui-monospace, monospace; font-size: 15px; letter-spacing: .06em; color: var(--accent); word-break: break-word; }
.pv-mail:hover { color: var(--ink); }

/* -------------------------------------------- 03. what we never do ------ */
/* the columns are separated by their own right-hand rule, not by a gap */
.pv-nevers { display: grid; grid-template-columns: repeat(auto-fit, minmax(215px, 1fr)); list-style: none; }
.pv-never { display: flex; flex-direction: column; gap: 9px; min-width: 0; padding: 0 clamp(14px, 1.6vw, 22px); border-right: 1px solid var(--i16); }
.pv-never:first-child { padding-left: 0; }
.pv-never:last-child { padding-right: 0; border-right: 0; }
.pv-never-t { display: flex; align-items: baseline; gap: 9px; }

/* ------------------------------------------- 04. what we do keep -------- */
.pv-groups { display: flex; flex-direction: column; gap: clamp(18px, 2.2vw, 28px); }
.pv-group { display: flex; align-items: baseline; flex-wrap: wrap; gap: 12px; }
.pv-group--2 { padding-top: 6px; }
.pv-keeps { display: grid; grid-template-columns: repeat(auto-fit, minmax(245px, 1fr)); gap: clamp(14px, 1.8vw, 24px); list-style: none; }
.pv-keep { display: flex; flex-direction: column; gap: 10px; min-width: 0; padding: 18px; border: 1px solid var(--i16); }
.pv-keep--on { border-color: color-mix(in srgb, var(--accent) 55%, transparent); background: color-mix(in srgb, var(--accent) 8%, transparent); }
.pv-kept { font: 800 clamp(22px, 2.3vw, 32px) / 1 Orbitron, sans-serif; }
.pv-keep--on .pv-kept, .pv-keep--on .pv-sub { color: var(--accent); }
.pv-keep-f { display: flex; align-items: center; gap: 10px; margin-top: auto; padding-top: 10px; border-top: 1px solid var(--i14); }
.pv-keep-f .push { color: var(--i5); }
.pv-keep--on .pv-keep-f { border-top-color: color-mix(in srgb, var(--accent) 30%, transparent); }
.pv-keep--on .pv-keep-f .push { color: var(--accent); }

/* ------------------------------------------ 05. the cookie inspector ---- */
.pv-table { border: 1px solid var(--i16); }
.pv-tbar { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; padding: 11px 16px; border-bottom: 1px solid var(--i16); background: var(--i10); }
.pv-thead, .pv-row {
  display: grid;
  grid-template-columns: clamp(120px, 14vw, 170px) clamp(110px, 12vw, 150px) clamp(76px, 8vw, 100px) minmax(0, 1fr) clamp(120px, 13vw, 160px);
  gap: clamp(10px, 1.4vw, 18px);
}
.pv-thead { padding: 10px 16px; border-bottom: 1px solid var(--i14); }
.pv-rows { list-style: none; }
.pv-row { align-items: baseline; padding: 15px 16px; border-bottom: 1px solid var(--i14); }
.pv-row:last-child { border-bottom: 0; }
.pv-row--on { background: color-mix(in srgb, var(--accent) 7%, transparent); }
.pv-ck { font-family: 'DM Mono', ui-monospace, monospace; font-size: 14px; letter-spacing: .02em; word-break: break-all; }
.pv-row--on .pv-ck { color: var(--accent); }
.pv-val { font-family: 'DM Mono', ui-monospace, monospace; font-size: 14px; color: var(--i78); word-break: break-all; }
.pv-flags { text-align: right; }

.pv-after { display: grid; grid-template-columns: minmax(0, 1fr) clamp(220px, 24vw, 300px); gap: clamp(18px, 2.4vw, 36px); align-items: center; padding-top: 20px; }
.pv-clear { display: flex; flex-direction: column; gap: 10px; text-align: center; }
.pv-btn { padding: 13px 18px; border: 1px solid var(--accent); background: none; font-family: 'DM Mono', ui-monospace, monospace; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; line-height: normal; color: var(--accent); cursor: pointer; }
.pv-btn:hover { background: var(--accent); color: #fff; }

/* --------------------------------------- 06. who else sees anything ----- */
.pv-firms { display: grid; grid-template-columns: repeat(auto-fit, minmax(235px, 1fr)); gap: clamp(14px, 1.8vw, 28px); list-style: none; }
.pv-firm { display: flex; flex-direction: column; gap: 9px; min-width: 0; padding: 16px; border: 1px solid var(--i16); transition: border-color .16s ease; }
.pv-firm:hover { border-color: var(--accent); }
.pv-firm-t { display: flex; align-items: baseline; gap: 10px; }
.pv-firm-t .push { white-space: nowrap; }
.pv-firm .pv-sub { font-size: clamp(17px, 1.8vw, 23px); }   /* the companies carry a slightly larger name */
.pv-firm .pv-x { color: var(--i68); }
.pv-firm-l { margin-top: auto; padding-top: 9px; border-top: 1px solid var(--i14); }

/* ------------------------------------- 07. what you can ask for --------- */
.pv-rights { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(20px, 2.6vw, 40px); align-items: stretch; }
.pv-list { display: flex; flex-direction: column; min-width: 0; }
.pv-list ul { list-style: none; }
.pv-rq-l { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; gap: 14px; align-items: baseline; padding: 13px 0; border-bottom: 1px dashed var(--i18); cursor: pointer; }
.pv-rq-l:hover { border-bottom-color: var(--accent); }
.pv-rq-n { color: var(--i4); }
.pv-rq-b { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.pv-rq-b .pv-x--s { color: var(--i6); }
.pv-rq-t { font: 600 16px / 1.2 Archivo, sans-serif; }
.pv-tag { flex: none; padding: 5px 9px; border: 1px solid var(--i22); font-family: 'DM Mono', ui-monospace, monospace; font-size: 12px; letter-spacing: .14em; line-height: normal; color: var(--i5); white-space: nowrap; }
/* a marked right wears the accent, and its tag is filled in */
.pv-rq-l:has(input:checked) .pv-rq-n, .pv-rq-l:has(input:checked) .pv-rq-t { color: var(--accent); }
.pv-rq-l:has(input:checked) .pv-tag { border-color: var(--accent); background: var(--accent); color: #fff; }
.pv-rq-l:has(input:focus-visible) { outline: 2px solid var(--accent); outline-offset: 2px; }
.pv-list-f { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; padding-top: 16px; }
.js-pv-all { border: 0; background: none; cursor: pointer; }

.pv-form { position: relative; display: flex; flex-direction: column; min-width: 0; background: var(--sheet); border: 1px solid var(--i14); }
.pv-perf { display: flex; justify-content: space-between; padding: 10px 18px; }
.pv-perf:first-child { border-bottom: 1px dashed var(--i18); }
.pv-perf:last-child { border-top: 1px dashed var(--i18); }
.pv-perf > i { width: 7px; height: 7px; border-radius: 50%; background: var(--i2); box-shadow: inset 0 1px 2px var(--i4); }
.pv-form-b { display: flex; flex-direction: column; gap: 14px; padding: 20px; }
.pv-form-h { display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; gap: 16px; padding-bottom: 12px; border-bottom: 2px solid var(--i5); }
.pv-form-t { display: flex; flex-direction: column; gap: 5px; }
.pv-firm-n { font: 700 21px / 1.1 'Bricolage Grotesque', sans-serif; letter-spacing: -.035em; text-transform: uppercase; }
.pv-stamp { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 8px 14px; border: 2px solid var(--accent); color: var(--accent); transform: rotate(-3deg); }
.pv-stamp .mono { color: var(--accent); }
.pv-stamp-d { opacity: .75; }

.pv-field { display: grid; grid-template-columns: clamp(88px, 10vw, 116px) minmax(0, 1fr); gap: 10px; align-items: baseline; }
.pv-line { display: block; min-width: 0; font-family: 'DM Mono', ui-monospace, monospace; font-size: 13px; line-height: 1.6; border-bottom: 1px dotted var(--i28); text-wrap: pretty; }
.pv-line--dim { color: var(--i4); }
.pv-line--a { color: var(--accent); word-break: break-word; }

.pv-sums { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding-top: 12px; border-top: 1px dashed var(--i18); list-style: none; }
.pv-sums li { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.pv-sums b { font: 800 19px / 1 Orbitron, sans-serif; font-weight: 800; }
.pv-due { color: var(--accent); }

.pv-send { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; padding-top: 12px; }
.pv-file { padding: 12px 18px; letter-spacing: .18em; line-height: normal; }
.pv-file:hover { background: var(--shell); color: #fff; }
.pv-print { border: 0; background: none; cursor: pointer; }
.pv-print:hover { color: var(--accent); }

/* ---------------------------------------------- 08. the paperwork ------- */
.pv-record { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: clamp(24px, 3.4vw, 56px); align-items: start; }
.pv-ver { display: flex; flex-direction: column; gap: 8px; flex: none; }
.pv-v { font: 900 clamp(70px, 11vw, 160px) / .8 Orbitron, sans-serif; color: var(--accent); }
.pv-signed { font: 400 clamp(17px, 1.8vw, 23px) / 1.3 'Instrument Serif', serif; font-style: italic; padding-top: 8px; }

.pv-paper { display: flex; flex-direction: column; gap: clamp(16px, 2vw, 24px); min-width: 0; }
.pv-edits { list-style: none; }
.pv-edit { display: grid; grid-template-columns: minmax(84px, auto) minmax(0, 1fr); gap: clamp(12px, 1.6vw, 22px); align-items: baseline; padding: 12px 0; border-bottom: 1px solid var(--i14); }
.pv-edit:first-child { padding-top: 0; }
.pv-edit:last-child { border-bottom: 0; }
.pv-edit .mono { white-space: nowrap; }
.pv-edit:first-child .pv-x--m { color: var(--i78); }
.pv-edit .pv-x--m { line-height: 1.5; color: var(--i6); }   /* the log lines sit on the tighter leading of the prototype */

/* the hairlines of the details strip are the grid's own background */
.pv-legals { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 1px; background: var(--i14); border-top: 2px solid var(--ink); list-style: none; }
.pv-legal { display: flex; flex-direction: column; gap: 5px; min-width: 0; padding: 14px 16px; background: var(--paper); }
.pv-legal-v { font: 600 15px / 1.3 Archivo, sans-serif; word-break: break-word; }
.pv-legal-m { font-family: 'DM Mono', ui-monospace, monospace; font-size: 15px; word-break: break-word; }

/* ------------------------------------------------- 09. responsive ------- */
@media (max-width: 1100px) {
  .pv-rights, .pv-after { grid-template-columns: minmax(0, 1fr); }
  .pv-record { grid-template-columns: minmax(0, 1fr); }
  .pv-clear { text-align: left; }
}

@media (max-width: 760px) {
  .pv-sec--last { padding-bottom: 40px; }
  .pv-cell { padding: 18px 16px 16px; }
  .pv-ask { flex: 1 1 100%; min-width: 0; }   /* the contact block takes the row on the narrowest phones */
  .pv-never { padding: 14px 0; border-right: 0; border-bottom: 1px solid var(--i16); }
  .pv-never:last-child { border-bottom: 0; }
  .pv-keeps, .pv-firms { grid-template-columns: minmax(0, 1fr); }
  /* the inspector turns into cards: the table's columns do not fit a phone */
  .pv-thead { display: none; }
  .pv-row { grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .pv-flags { text-align: left; }
  .pv-sums { grid-template-columns: minmax(0, 1fr); }
  .pv-stamp { align-self: flex-start; }
}