/* Ankersen Drake · the consent notice (public/consent/ad-consent.js).
   Self-contained: it is served into the Next pages and into the
   consultation product's own HTML, so it uses the house values directly,
   with the site's tokens where they exist (the product supplies its own
   --serif and --sans). The owner's final consent correction, 14 October:
   a slightly translucent charcoal panel, the house sans at 12px, no
   heading, no border, no shadow, the on-dark outlined button; the
   preferences as a compact view of the same panel. The owner's pre-publish
   corrections, 15 October: the panel sits at the BOTTOM RIGHT (it was
   bottom left, where it covered the homepage's opening copy and action),
   16px from the corner, and on desktop and iPad it is a compact CARD
   rather than a 680px strip: the sentence above, Accept all and Reject
   non-essential side by side beneath it, Preferences discreetly under
   them, the height from the content. The owner's post-launch refinement
   (15 October, the site live): smaller and more discreet still on desktop
   and iPad, 340px wide at 11.5px / 1.28 with 24px buttons at a quieter
   weight and border; the iPad-held-portrait strip reduced in proportion;
   the phone's approved compact full-width layout untouched (its own
   values are restated in its block so nothing above reaches it). */
.adc {
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 140; /* above the header (130), beneath the opening plate (150) and the Portfolio viewer (200) */
  box-sizing: border-box;
  width: min(340px, calc(100vw - 32px));
  margin: 0;
  padding: 10px 12px 9px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
  background: rgba(35, 36, 40, 0.92); /* --dark-panel #232428 at 92% */
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  color: var(--on-dark, #f9f7f4);
  border: 0;
  border-radius: 0;
  box-shadow: none;
  font-family: var(--sans, "Instrument Sans", "Inter", "Helvetica Neue", Arial, sans-serif);
  font-size: 0.71875rem; /* 11.5px */
  line-height: 1.28;
  text-align: left;
}
.adc:focus { outline: none; }
.adc * { box-sizing: border-box; }
.adc-text {
  flex: 1 1 100%; /* the sentence takes the card's width; the actions sit beneath it */
  margin: 0;
  color: var(--on-dark-86, rgba(249, 247, 244, 0.86));
}
.adc-text[hidden] { display: none; }
.adc-plink {
  color: inherit;
  text-decoration: underline;
  text-decoration-color: rgba(249, 247, 244, 0.45);
  text-underline-offset: 0.16em;
  white-space: nowrap;
}
.adc-plink:hover { color: var(--on-dark, #f9f7f4); text-decoration-color: var(--on-dark, #f9f7f4); }
/* The actions: Accept all and Reject non-essential side by side, and
   Preferences on its own line beneath them, at the left (a grid, so the
   text control keeps its own width rather than stretching across). */
.adc-actions {
  display: grid;
  grid-template-columns: max-content max-content;
  align-items: center;
  justify-content: start;
  gap: 6px 12px;
  margin: 0;
  flex: 1 1 100%;
}
.adc-actions[hidden] { display: none; }
.adc-actions > .adc-link { grid-column: 1 / -1; justify-self: start; }
/* Accept and Reject: the site's outlined on-dark box (.on-ink
   .btn--secondary), lower and quieter here (24px, the label at 10.4px,
   the type and the rule a little softer than the header's), the same
   size and colour for both; neither is the "primary". */
.adc-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 4px 9px 3px;
  font-family: inherit;
  font-weight: 500;
  font-size: 0.65rem;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  line-height: 1.4;
  color: var(--on-dark-86, rgba(249, 247, 244, 0.86));
  background: transparent;
  border: 1px solid rgba(255, 255, 255, 0.32);
  border-radius: 0;
  cursor: pointer;
  white-space: nowrap;
  transition: background-color 180ms cubic-bezier(0.22, 0.6, 0.32, 1), border-color 180ms cubic-bezier(0.22, 0.6, 0.32, 1);
}
.adc-btn:hover {
  background: var(--btn-dark-hover, rgba(20, 19, 18, 0.92));
  color: var(--parchment, #f1f0eb);
  border-color: var(--parchment, #f1f0eb);
}
.adc-link {
  padding: 2px 0;
  font-family: inherit;
  font-size: 0.65rem;
  line-height: 1.4;
  color: rgba(249, 247, 244, 0.72); /* discreet: 7.5:1 on the card's charcoal */
  background: none;
  border: 0;
  border-radius: 0;
  text-decoration: underline;
  text-decoration-color: rgba(249, 247, 244, 0.35);
  text-underline-offset: 0.16em;
  cursor: pointer;
}
.adc-link:hover { color: var(--on-dark, #f9f7f4); text-decoration-color: var(--on-dark, #f9f7f4); }
.adc-btn:focus-visible,
.adc-link:focus-visible,
.adc-plink:focus-visible,
.adc-check:focus-visible {
  outline: 2px solid var(--parchment, #f1f0eb);
  outline-offset: 2px;
}
/* The preferences: the same bar, its sentence and actions put away, three
   one-line rows and the two actions; no dividers, small controls. */
.adc-prefs { flex: 1 1 100%; margin: 0; }
.adc-prefs[hidden] { display: none; }
.adc-row {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 4px 0; /* a 24px pitch: each small checkbox keeps a clear 24px target circle (WCAG 2.5.8) */
}
.adc-check {
  flex: none;
  width: 12px;
  height: 12px;
  margin: 2px 0 0;
  accent-color: var(--parchment, #f1f0eb);
}
.adc-check:disabled { opacity: 0.55; }
.adc-rowLabel { margin: 0; cursor: pointer; }
.adc-rowName {
  font-weight: 500;
  color: var(--on-dark, #f9f7f4);
}
.adc-rowText { color: var(--on-dark-86, rgba(249, 247, 244, 0.86)); }
.adc-prefs .adc-actions { margin-top: 5px; }
/* An iPad held portrait (768 to 1023px wide: the iPad mini, iPad and iPad
   Air): the homepage's copy runs across almost the whole window at its
   foot, so the 146px card reached the heading and the first line of the
   introduction. Here the notice keeps the approved low strip of the
   earlier correction (564px at 820, 512px at 768: its left edge clear of
   Explore Services, its top below the introduction). The iPad Pro held
   portrait (1032px) and every landscape iPad take the card. */
@media (min-width: 768px) and (max-width: 1023px) and (orientation: portrait) {
  .adc {
    width: min(640px, calc(100vw - 256px));
    padding: 9px 12px;
    gap: 7px 16px;
    line-height: 1.3;
  }
  .adc-text { flex: 1 1 300px; }
  .adc-actions { display: flex; flex-wrap: wrap; flex: 0 0 auto; }
  .adc-actions > .adc-link { grid-column: auto; }
}
@media (max-width: 599px) {
  .adc {
    left: 10px;
    right: 10px;
    bottom: 10px;
    width: auto;
    padding: 10px 12px 9px;
    gap: 8px 10px;
    font-size: 0.75rem;
    line-height: 1.35; /* the approved phone layout, unchanged by the desktop card */
    max-height: calc(100dvh - 20px);
    overflow-x: hidden;
    overflow-y: auto;
  }
  .adc-text { flex-basis: 100%; }
  /* The approved phone layout, unchanged: the three actions in one
     wrapping row across the bar, Preferences moving to a second line
     rather than being clipped at the edge; the buttons, the text control
     and the preference rows at the sizes approved on 14 October. */
  .adc-actions { display: flex; flex-wrap: wrap; flex: 1 1 100%; gap: 6px 12px; }
  .adc-actions > .adc-link { grid-column: auto; }
  .adc-btn { min-height: 30px; padding: 6.7px 10px 5.3px; font-size: 0.6875rem; letter-spacing: 0.1em; color: var(--parchment, #f1f0eb); border-color: rgba(255, 255, 255, 0.4); }
  .adc-link { font-size: 0.6875rem; color: var(--on-dark-86, rgba(249, 247, 244, 0.86)); text-decoration-color: rgba(249, 247, 244, 0.45); }
  .adc-row { padding: 5px 0; }
  .adc-check { width: 13px; height: 13px; }
  .adc-prefs .adc-actions { margin-top: 6px; }
}
@media (prefers-reduced-motion: reduce) {
  .adc-btn { transition: none; }
}
