@font-face { font-family: "Space Grotesk"; font-style: normal; font-weight: 500 700; font-display: swap; src: url("/fonts/space-grotesk-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 400 600; font-display: swap; src: url("/fonts/inter-latin-400-normal.woff2") format("woff2"); }

:root {
  color-scheme: dark;
  --bg: #111011;
  --surface: #201e1f;
  --text: #f4f1ee;
  --muted: #aaa3a4;
  --line: rgba(244, 241, 238, 0.14);
  --orange: #ff7a00;
  --red: #e30613;
  font-family: Inter, system-ui, sans-serif;
}

* { box-sizing: border-box; }
html { background: var(--bg); scroll-behavior: smooth; }
body { margin: 0; color: var(--text); background: radial-gradient(circle at 76% 12%, rgba(227, 6, 19, 0.17), transparent 28rem), var(--bg); line-height: 1.6; }
a { color: inherit; }
a:focus-visible, button:focus-visible { outline: 3px solid var(--orange); outline-offset: 4px; }
.skip-link { position: fixed; top: 0.75rem; left: 0.75rem; z-index: 5; transform: translateY(-180%); padding: 0.65rem 0.85rem; border-radius: 0.5rem; color: #111011; background: var(--text); font-weight: 700; }
.skip-link:focus { transform: translateY(0); }
.security-header, .security-hero, .catalogue-section, .security-footer { width: min(100% - 2rem, 1180px); margin-inline: auto; }
.security-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 82px; border-bottom: 1px solid var(--line); }
.security-header img { display: block; width: 142px; height: auto; }
.back-link { color: var(--text); text-decoration: none; font-weight: 600; }
.back-link:hover { color: var(--orange); }
.security-hero { padding: clamp(4rem, 11vw, 8rem) 0 clamp(3.25rem, 8vw, 5rem); max-width: 930px; margin-inline: max(1rem, calc((100% - 1180px) / 2)); }
.eyebrow { margin: 0 0 0.9rem; color: var(--orange); font: 500 0.72rem/1.4 "IBM Plex Mono", ui-monospace, monospace; letter-spacing: 0.18em; }
h1, h2 { margin: 0; font-family: "Space Grotesk", Inter, sans-serif; line-height: 1.06; letter-spacing: -0.03em; }
h1 { max-width: 13ch; font-size: clamp(2.6rem, 7vw, 5.7rem); }
h2 { font-size: clamp(2rem, 4vw, 3.4rem); }
.security-hero > p:not(.eyebrow), .catalogue-heading > p:not(.eyebrow) { max-width: 58ch; color: var(--muted); font-size: clamp(1rem, 1.8vw, 1.15rem); }
.hero-link { display: inline-flex; gap: 0.5rem; align-items: center; margin-top: 1.2rem; color: var(--text); text-decoration: none; font-weight: 700; }
.hero-link:hover { color: var(--orange); }
.catalogue-section { padding: clamp(2.75rem, 6vw, 5rem); border: 1px solid var(--line); border-radius: 1.5rem 1.5rem 0 0; background: rgba(32, 30, 31, 0.9); }
.catalogue-heading { max-width: 700px; }
.provider-notice { max-width: 720px; margin-top: 2rem; padding: 1.25rem; border: 1px solid rgba(255, 122, 0, 0.4); border-radius: 0.9rem; background: rgba(255, 122, 0, 0.07); }
.provider-notice p { margin: 0.35rem 0; color: var(--muted); }
.provider-notice strong { color: var(--text); }
.provider-notice a { color: #ffc06f; text-underline-offset: 0.2em; }
.load-catalogue { min-height: 44px; margin-top: 1rem; padding: 0.7rem 1rem; border: 0; border-radius: 0.7rem; color: #fff; background: linear-gradient(135deg, var(--red), var(--orange)); font: 600 0.92rem/1.2 Inter, system-ui, sans-serif; cursor: pointer; }
.load-catalogue:hover { filter: brightness(1.08); }
.catalogue-mount { margin-top: 2rem; }
.catalogue-frame { display: block; width: 100%; min-height: 280px; border: 0; border-radius: 0.8rem; background: #fff; }
.catalogue-status, .noscript-notice { color: var(--muted); }
.security-footer { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; padding: 1.7rem 0 2.5rem; color: var(--muted); font-size: 0.9rem; }
.security-footer nav { display: flex; gap: 1.2rem; }
.security-footer a { color: var(--text); }
@media (max-width: 600px) {
  .security-header img { width: 116px; }
  .security-hero { padding-top: 3.5rem; }
  .catalogue-section { width: 100%; border-inline: 0; border-radius: 0; padding-inline: 1rem; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }