/* Trust Centre
   Extends the Masterminds design system. Brand tokens only:
   navy #003469, teal #00abb6, purple #a967aa, orange #f99f3f, mist #f4f7fa. */

.trust-page {
  --trust-line: #dce5ed;
  --trust-verified: #00abb6;
  --trust-practice: #a967aa;
  --trust-none: #8794a3;
}

/* ---------- Sticky in-page nav ---------- */

.trust-nav {
  position: sticky;
  top: 0;
  z-index: 40;
  background: rgba(255, 255, 255, .96);
  backdrop-filter: saturate(140%) blur(8px);
  border-bottom: 1px solid var(--trust-line);
}

.trust-nav__list {
  display: flex;
  gap: 2.4rem;
  margin: 0;
  padding: 0;
  list-style: none;
  overflow-x: auto;
  scrollbar-width: none;
}

.trust-nav__list::-webkit-scrollbar { display: none; }

.trust-nav__list a {
  display: block;
  padding: 1.8rem 0;
  font-size: var(--font-size--xs);
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #5a6672;
  text-decoration: none;
  white-space: nowrap;
  border-bottom: 3px solid transparent;
  transition: color .2s ease, border-color .2s ease;
}

.trust-nav__list a:hover,
.trust-nav__list a:focus-visible {
  color: #003469;
  border-bottom-color: #00abb6;
}

/* ---------- Status pills ---------- */

.trust-pill {
  display: inline-flex;
  align-items: center;
  gap: .8rem;
  font-size: var(--font-size--xxs);
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: .5rem 1.2rem;
  border-radius: 100px;
  border: 1px solid currentColor;
  line-height: 1.4;
  align-self: flex-start;
  width: fit-content;
}

.trust-pill::before {
  content: "";
  width: .8rem;
  height: .8rem;
  border-radius: 50%;
  background: currentColor;
  flex: none;
}

.trust-pill--verified { color: #00818a; }
.trust-pill--practice { color: #8a4d8b; }
.trust-pill--none { color: #6b7784; }

.cb--navy .trust-pill--verified { color: #4fd3dc; }
.cb--navy .trust-pill--practice { color: #d3a4d4; }
.cb--navy .trust-pill--none { color: #a9b6c4; }

/* ---------- Certificate cards ---------- */

.trust-certs {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--gutter);
}

@media (min-width: 769px) {
  .trust-certs { grid-template-columns: repeat(3, 1fr); }
}

.trust-cert {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
  background: #fff;
  border: 1px solid var(--trust-line);
  border-top: 4px solid var(--trust-accent, #00abb6);
  border-radius: .6rem;
  padding: 3.2rem;
  height: 100%;
  transition: transform .2s ease, box-shadow .2s ease;
}

.trust-cert:hover {
  transform: translateY(-4px);
  box-shadow: 0 1.2rem 3.2rem rgba(0, 52, 105, .1);
}

.trust-cert--teal { --trust-accent: #00abb6; }
.trust-cert--purple { --trust-accent: #a967aa; }
.trust-cert--orange { --trust-accent: #f99f3f; }

.trust-cert h3 {
  margin: 0;
  font-size: var(--font-size--m);
}

.trust-cert__meta {
  font-size: var(--font-size--s);
  color: #5a6672;
  line-height: 1.4;
}

.trust-cert__scope {
  font-size: var(--font-size--s);
  color: #5a6672;
  line-height: 1.45;
  padding-top: 1.6rem;
  border-top: 1px solid var(--trust-line);
  margin-top: auto;
}

.trust-cert__scope strong {
  display: block;
  color: #003469;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: var(--font-size--xs);
  margin-bottom: .6rem;
}

.trust-cert__link {
  display: inline-flex;
  align-items: center;
  gap: .8rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: var(--font-size--xs);
  color: #003469;
  text-decoration: none;
}

.trust-cert__link:hover { color: #00abb6; }
.trust-cert__link span[aria-hidden] { transition: transform .2s ease; }
.trust-cert__link:hover span[aria-hidden] { transform: translateX(4px); }

/* ---------- Two-column control panels ---------- */

.trust-panels {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--gutter);
}

@media (min-width: 769px) {
  .trust-panels { grid-template-columns: repeat(2, 1fr); }
}

.trust-panel {
  background: #fff;
  border: 1px solid var(--trust-line);
  border-radius: .6rem;
  padding: 3.2rem;
}

.cb--navy .trust-panel {
  background: rgba(255, 255, 255, .06);
  border-color: rgba(255, 255, 255, .16);
}

.trust-panel > h3 {
  margin: 0 0 2rem;
  font-size: var(--font-size--m);
  padding-bottom: 1.6rem;
  border-bottom: 1px solid var(--trust-line);
}

.cb--navy .trust-panel > h3 { border-bottom-color: rgba(255, 255, 255, .16); }

.trust-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 1.8rem;
}

.trust-list li {
  position: relative;
  padding-left: 3rem;
  font-size: var(--font-size--s);
  line-height: 1.45;
  color: #3d4854;
}

.cb--navy .trust-list li { color: rgba(255, 255, 255, .82); }

.trust-list li strong { color: #003469; }
.cb--navy .trust-list li strong { color: #fff; }

.trust-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .45em;
  width: 1.6rem;
  height: 1rem;
  border-left: 2px solid var(--trust-mark, #00abb6);
  border-bottom: 2px solid var(--trust-mark, #00abb6);
  transform: rotate(-45deg);
}

.trust-list--purple { --trust-mark: #a967aa; }
.cb--navy .trust-list { --trust-mark: #4fd3dc; }
.cb--navy .trust-list--purple { --trust-mark: #d3a4d4; }

/* ---------- Compliance grid ---------- */

.trust-reg {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--gutter);
}

@media (min-width: 769px) {
  .trust-reg { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1200px) {
  .trust-reg { grid-template-columns: repeat(3, 1fr); }
}

.trust-reg__item {
  background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: .6rem;
  padding: 3rem;
  display: flex;
  flex-direction: column;
  gap: 1.4rem;
}

.trust-reg__item h3 {
  margin: 0;
  font-size: var(--font-size--m);
  color: #fff;
}

.trust-reg__item p {
  font-size: var(--font-size--s);
  line-height: 1.45;
  color: rgba(255, 255, 255, .8);
}

.trust-reg__item a {
  color: #4fd3dc;
  text-decoration: underline;
  text-underline-offset: .3rem;
}

.trust-reg__item a:hover { color: #fff; }

/* ---------- Document request lists ---------- */

.trust-docs {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--gutter);
}

@media (min-width: 769px) {
  .trust-docs { grid-template-columns: repeat(2, 1fr); }
}

.trust-doc-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.trust-doc-list li {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 2rem;
  padding: 1.6rem 0;
  border-bottom: 1px solid var(--trust-line);
  font-size: var(--font-size--s);
  line-height: 1.4;
  color: #3d4854;
}

.trust-doc-list li:first-child { padding-top: 0; }

.trust-doc-list a {
  color: #003469;
  font-weight: 700;
  text-decoration: none;
  border-bottom: 2px solid #00abb6;
}

.trust-doc-list a:hover { color: #00abb6; }

.trust-doc-list__tag {
  flex: none;
  font-size: var(--font-size--xxs);
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #6b7784;
}

/* ---------- Entity / contact split ---------- */

.trust-entity {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--gutter);
}

@media (min-width: 769px) {
  .trust-entity { grid-template-columns: 1fr 1fr; }
}

.trust-entity__card {
  background: #fff;
  border: 1px solid var(--trust-line);
  border-left: 4px solid #003469;
  border-radius: .6rem;
  padding: 3.2rem;
}

.trust-entity__card--alert { border-left-color: #f99f3f; }

.trust-entity__card h3 {
  margin: 0 0 1.6rem;
  font-size: var(--font-size--m);
}

.trust-entity__card p {
  font-size: var(--font-size--s);
  line-height: 1.5;
  color: #3d4854;
}

.trust-entity__card p + p { margin-top: 1.4rem; }

.trust-entity__card a {
  color: #003469;
  font-weight: 700;
  border-bottom: 2px solid #00abb6;
  text-decoration: none;
}

.trust-entity__card a:hover { color: #00abb6; }

.trust-entity__data {
  display: grid;
  gap: 1.2rem;
  margin-top: 1.6rem;
  padding-top: 1.6rem;
  border-top: 1px solid var(--trust-line);
}

.trust-entity__row {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 1.6rem;
  font-size: var(--font-size--s);
  line-height: 1.4;
}

.trust-entity__row dt {
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: var(--font-size--xs);
  color: #6b7784;
}

.trust-entity__row dd {
  margin: 0;
  color: #003469;
  font-weight: 700;
}

/* ---------- Honest caveat callout ---------- */

.trust-caveat {
  margin-top: var(--gutter);
  padding: 2.8rem 3.2rem;
  border-radius: .6rem;
  background: rgba(249, 159, 63, .1);
  border: 1px solid rgba(249, 159, 63, .35);
  font-size: var(--font-size--s);
  line-height: 1.5;
  color: #3d4854;
}

.cb--navy .trust-caveat {
  background: rgba(249, 159, 63, .12);
  border-color: rgba(249, 159, 63, .4);
  color: rgba(255, 255, 255, .85);
}

.trust-caveat strong {
  display: block;
  color: #003469;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: var(--font-size--xs);
  margin-bottom: .8rem;
}

.cb--navy .trust-caveat strong { color: #f9c88f; }

@media (prefers-reduced-motion: reduce) {
  .trust-cert,
  .trust-cert__link span[aria-hidden] { transition: none; }
  .trust-cert:hover { transform: none; }
}

.trust-doc-list li:last-child { border-bottom: 0; padding-bottom: 0; }

/* Keep anchored headings clear of the sticky nav (and the site's fixed header). */
.trust-page :is(#certificates, #security, #compliance, #nis2, #privacy, #entity) {
  scroll-margin-top: 16rem;
}

/* ---------- Back to top ---------- */

.trust-totop {
  position: fixed;
  right: max(2rem, 2.5vw);
  bottom: max(2rem, 2.5vw);
  z-index: 45;
  gap: .8rem;
  min-height: 4.8rem;
  padding: 0 2rem;
  border-radius: 100px;
  font-size: var(--font-size--xs);
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #003469;
  color: #fff;
  font-size: var(--font-size--m);
  line-height: 1;
  text-decoration: none;
  box-shadow: 0 .6rem 1.8rem rgba(0, 52, 105, .28);
  opacity: 0;
  visibility: hidden;
  transform: translateY(1rem);
  transition: opacity .25s ease, transform .25s ease, visibility .25s, background .2s ease;
}

.trust-totop:hover,
.trust-totop:focus-visible { background: #00abb6; color: #fff; }

/* Revealed by JS once the reader is past the hero; see site behaviour below. */
.trust-totop.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
  .trust-totop { transition: none; }
}

/* ---------- Density ---------- */

.trust-page .cb { padding-top: clamp(4.8rem, 4vw, 6.4rem); padding-bottom: clamp(4.8rem, 4vw, 6.4rem); }
.trust-page .cb__heading { margin-bottom: clamp(2.4rem, 2.5vw, 3.6rem); }
.trust-page .trust-cert,
.trust-page .trust-panel,
.trust-page .trust-reg__item,
.trust-page .trust-entity__card { padding: 2.6rem; }
.trust-page .trust-list { gap: 1.3rem; }
.trust-page .trust-doc-list li { padding: 1.2rem 0; }
.trust-page .service-summary-section { padding-bottom: clamp(3.6rem, 3vw, 4.8rem); }

#trust-top-anchor { position: absolute; top: 0; scroll-margin-top: 0; }

/* Keep the control clear of the footer partner logos. */
.trust-totop__label { line-height: 1; }

/* Designation names read as chips above their explanation. */
.trust-cert__meta > strong {
  display: inline-block;
  background: rgba(0, 171, 182, .12);
  color: #00727a;
  border-radius: 100px;
  padding: .3rem 1.2rem;
  font-size: var(--font-size--xs);
  letter-spacing: .04em;
  margin: 0 .6rem .8rem 0;
}

.trust-cert__note { display: block; margin-top: .4rem; }

/* ---------- Print ---------- */

/* This is the page a procurement or security reviewer prints and attaches to a
   questionnaire, so on paper everything that only serves a browsing visitor is
   dropped: the site nav, the language flags, the in-page jump bar, the
   back-to-top control, the hero photograph and the whole footer. The logo and
   the h1 stay, because the sheet has to say whose statement it is. Link
   addresses are printed after their text, since a printed reference the
   reviewer cannot follow is worth nothing. */
@media print {
  .page-header__top-inner__nav,
  .lang-switch,
  .trust-nav,
  .trust-totop,
  .page-footer,
  .page-header__hero figure,
  .cb__content__buttons { display: none !important; }

  /* The header pins itself and the hero paints white text over a photograph
     and a skewed navy gradient. On paper the gradient would swallow a whole
     sheet and leave the title unreadable, so the band collapses to plain flow
     on white: the theme sets the hero background with !important and draws the
     gradient in a ::after, so both have to be named. */
  .page-header,
  .page-header__top { position: static; background: #fff; }
  .page-header__top-inner { display: block; }
  .page-header__hero {
    display: block;
    min-height: 0 !important;
    height: auto;
    background: #fff !important;
    color: #000;
  }
  .page-header__hero-content {
    position: static;
    display: block;
    width: auto;
    min-height: 0;
    margin: 0;
    /* The theme reserves 17rem here for the fixed header that is now gone. */
    padding: 1.6rem 0 0 !important;
  }
  .page-header__hero-content::after { display: none; }
  /* .header-type--short sets a 40rem minimum on both, at a higher specificity
     than the bare class, so the body class has to be named to release it. */
  .header-type--short .page-header__hero,
  .header-type--short .page-header__hero-content { min-height: 0; }

  /* The wordmark is a white SVG, so on white paper only its three dots would
     show. There is no dark version of the mark in the repository, so it is
     printed on its own navy ground instead of being recoloured by guesswork.
     print-color-adjust keeps that one block when backgrounds are switched off. */
  .page-header__top-inner__logo {
    display: inline-block;
    width: auto;
    padding: 1.2rem 1.6rem;
    background: #003469;
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
  }
  .page-header__top-inner__logo img { width: 15rem; height: auto; }

  body { background: #fff; color: #000; }
  .trust-page .cb { padding: 1.6rem 0; background: #fff !important; }
  .trust-page h1,
  .trust-page h2,
  .trust-page h3,
  .trust-page p,
  .trust-page li,
  .trust-page dt,
  .trust-page dd,
  .trust-page strong,
  .trust-page span,
  .trust-page a { color: #000 !important; }

  /* The compliance band is navy on screen, so its status pills are drawn in
     light tints that disappear on white. Put them back to a readable weight
     and print the pill outline so verified still reads apart from practice. */
  .trust-pill,
  .cb--navy .trust-pill { color: #000 !important; border-color: #000; }

  /* A certificate, a panel or a register entry split across two sheets is the
     thing a reviewer complains about, so each block is kept whole. */
  table, tr, th,
  .trust-cert,
  .trust-panel,
  .trust-reg__item,
  .trust-entity__card,
  .trust-doc-list li,
  .service-summary__item { break-inside: avoid; }

  .trust-cert,
  .trust-panel,
  .trust-reg__item,
  .trust-entity__card { border: 1px solid #000; }

  /* The reviewer has paper, not a browser, so every address is spelled out.
     Site paths print as written and resolve against the page address the
     browser prints in its own footer. */
  .trust-page main a[href^="http"]::after,
  .trust-page main a[href^="/"]::after {
    content: " (" attr(href) ")";
    font-size: .85em;
    font-weight: 400;
    word-break: break-all;
  }
  /* The section jump links resolve to nothing off the page. */
  .trust-page main a[href^="#"]::after { content: none; }

  /* The certificate link label is set in uppercase with wide tracking. That is
     fine for two words on screen, but a printed address has to be typed back
     exactly, and paths are case sensitive, so the address is set plainly. */
  .trust-cert__link::after,
  .trust-doc-list a::after {
    text-transform: none;
    letter-spacing: 0;
  }
}
