@charset "UTF-8";
/* ==========================================================================
   RDM PARTS — Zendesk Guide theme
   Written from scratch against the live rdmparts.com (Shopware 6) storefront.
   The header, navigation, USP bar and footer are 1:1 ports: the class names,
   metrics and colours below were measured on the storefront so a customer
   moving between the shop and the help center sees one continuous site.
   ========================================================================== */

/* ---------- 1. Tokens ----------------------------------------------------- */

:root {
  --rdm-green: #279A24;
  --rdm-green-dark: #1F7B1D;
  --rdm-green-soft: #d4ebd3;
  --rdm-lime: #CAE235;
  --rdm-highlight: #EE8C2F;
  --rdm-on-brand: #FFFFFF;

  --rdm-bar: #252A2C;
  --rdm-nav-bg: #EEEEEE;
  --rdm-nav-text: #2B3136;
  --rdm-nav-divider: rgba(43, 49, 54, .18);
  --rdm-ink: #2B3136;
  --rdm-slate: #4a545b;
  /* #798490 is the storefront value but only reaches 3.81:1 on white, so
     secondary body copy uses a darker neighbour and the footer a lighter one. */
  --rdm-muted: #68727d;
  --rdm-muted-soft: #798490;
  --rdm-footer-text: #8C99A6;
  --rdm-line: #e5e5e5;
  --rdm-soft: #f9f9f9;
  --rdm-field: #eee;
  --rdm-white: #FFFFFF;

  --rdm-danger: #e52427;
  --rdm-success: #3cc261;
  --rdm-info: #189eff;
  --rdm-warning: #fbd464;

  /* green fills stay on brand; green *text* uses the darker brand green so it
     clears 4.5:1 on white (#279A24 only reaches 3.66:1) */
  --rdm-green-text: var(--rdm-green-dark);
  /* white-on-green only reaches 3.66:1 at --rdm-green, so filled controls use
     the darker brand green (5.37:1). Set this to var(--rdm-green) to match the
     storefront button colour exactly and accept the lower contrast. */
  --rdm-green-cta: var(--rdm-green-dark);
  --rdm-link: #1F7B1D;
  --rdm-link-hover: #186117;
  --rdm-link-visited: #1F7B1D;

  --rdm-font: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  --rdm-font-heading: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;

  --rdm-container: 1400px;
  --rdm-gutter: 20px;
  --rdm-radius: 4px;
  --rdm-pill: 23px;
  --rdm-shadow: 0 1px 3px rgba(0, 0, 0, .08);
  --rdm-shadow-lg: 0 8px 24px rgba(0, 0, 0, .12);
  --rdm-focus: 0 0 0 .125rem #fff, 0 0 0 .2rem rgba(39, 154, 36, .6);
}

/* ---------- 2. Reset ------------------------------------------------------ */

*, *::before, *::after { box-sizing: border-box; }

html {
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  background: var(--rdm-white);
  color: var(--rdm-ink);
  font-family: var(--rdm-font);
  font-size: 14px;
  line-height: 21px;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

main { display: block; flex: 1 0 auto; }

img, svg, video { max-width: 100%; }
img { border-style: none; height: auto; }
svg:not(:root) { overflow: hidden; }

button, input, optgroup, select, textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: inherit;
  margin: 0;
}
button, [type="button"], [type="submit"], [type="reset"] { -webkit-appearance: button; }
button::-moz-focus-inner, [type="button"]::-moz-focus-inner { border-style: none; padding: 0; }
button { overflow: visible; text-transform: none; }
textarea { overflow: auto; }
[hidden] { display: none !important; }
hr { box-sizing: content-box; height: 0; overflow: visible; border: 0; border-top: 1px solid var(--rdm-line); margin: 2rem 0; }
b, strong { font-weight: 700; }
small { font-size: 80%; }
code, kbd, samp, pre { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 1em; }

/* ---------- 3. Typography ------------------------------------------------- */

h1, h2, h3, h4, h5, h6 {
  font-family: var(--rdm-font-heading);
  color: var(--rdm-ink);
  font-weight: 700;
  margin: 0 0 .5em;
}
h1 { font-size: 36px; line-height: 40px; }
h2 { font-size: 28px; line-height: 34px; }
h3 { font-size: 24px; line-height: 33px; }
h4 { font-size: 20px; line-height: 24px; }
h5 { font-size: 16px; line-height: 21px; }
h6 { font-size: 14px; line-height: 20px; }

p { margin: 0 0 1rem; }
ul, ol { margin: 0 0 1rem; padding-left: 1.4em; }

a { color: var(--rdm-link); text-decoration: none; background-color: transparent; }
a:hover { color: var(--rdm-link-hover); text-decoration: underline; }
a:visited { color: var(--rdm-link-visited); }

:focus-visible {
  outline: 2px solid var(--rdm-green);
  outline-offset: 2px;
  border-radius: var(--rdm-radius);
}

/* ---------- 4. Layout & utilities ---------------------------------------- */

.rdm-container {
  width: 100%;
  max-width: var(--rdm-container);
  margin-inline: auto;
  padding-inline: var(--rdm-gutter);
}

.rdm-section { padding: 40px 0; }
.rdm-section-soft { background: var(--rdm-soft); }
.rdm-section-head { margin-bottom: 20px; }
.rdm-section-title { font-size: 24px; line-height: 33px; margin: 0; }

.visibility-hidden {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

.skip-navigation {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 1000;
  padding: 12px 20px;
  background: var(--rdm-green);
  color: #fff;
  font-weight: 600;
}
.skip-navigation:focus { left: 0; color: #fff; text-decoration: none; }

.meta-group { display: flex; gap: 10px; flex-wrap: wrap; }
.meta-data { color: var(--rdm-muted); font-size: 13px; }
.icon-lock { color: var(--rdm-muted); flex: none; }
.icon-star { color: var(--rdm-highlight); flex: none; }
.user-avatar { border-radius: 50%; display: block; }

/* ---------- 5. Buttons ---------------------------------------------------- */

.btn,
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px 20px;
  min-height: 40px;
  font-family: var(--rdm-font);
  font-size: 14px;
  font-weight: 600;
  line-height: 21px;
  border: 1px solid transparent;
  border-radius: var(--rdm-radius);
  cursor: pointer;
  text-decoration: none;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease;
  background: none;
}
.btn:hover, .button:hover { text-decoration: none; }
.btn:focus-visible, .button:focus-visible { box-shadow: var(--rdm-focus); outline: 0; }

/* a:visited outranks a single class, so each button names its own visited
   colour — otherwise a visited link turns green-on-green */
.btn-primary,
.btn-primary:visited,
.button-primary,
.button-primary:visited {
  background: var(--rdm-green-cta);
  border-color: var(--rdm-green-cta);
  color: var(--rdm-on-brand);
}
.btn-primary:hover, .button-primary:hover {
  background: var(--rdm-green-dark);
  border-color: var(--rdm-green-dark);
  color: var(--rdm-on-brand);
}

.btn-secondary,
.btn-secondary:visited {
  background: var(--rdm-bar);
  border-color: var(--rdm-bar);
  color: #fff;
}
.btn-secondary:hover { background: #14181a; border-color: #14181a; color: #fff; }

.btn-outline,
.btn-outline:visited,
.button:not(.button-primary),
.button:not(.button-primary):visited {
  background: transparent;
  border-color: var(--rdm-green-text);
  color: var(--rdm-green-text);
}
.btn-outline:hover,
.button:not(.button-primary):hover {
  background: var(--rdm-green);
  border-color: var(--rdm-green);
  color: #fff;
}

.btn-outline-light,
.btn-outline-light:visited { background: transparent; border-color: var(--rdm-slate); color: #fff; }
.btn-outline-light:hover { background: #fff; border-color: #fff; color: var(--rdm-bar); }

.btn-light,
.btn-light:visited { background: var(--rdm-soft); border-color: var(--rdm-line); color: var(--rdm-ink); }
.btn-light:hover { border-color: var(--rdm-green-text); color: var(--rdm-green-text); }

.btn-block { display: flex; width: 100%; }
.btn-sm { min-height: 32px; padding: 4px 12px; font-size: 13px; }
.btn + .btn { margin-top: 8px; }
.btn-block + .btn-block { margin-top: 8px; }

/* ==========================================================================
   6. HEADER — 1:1 port of the rdmparts.com storefront header
   ========================================================================== */

.header-main {
  position: sticky;
  top: 0;
  z-index: 991;
  background: #fff;
  border-bottom: 1px solid var(--rdm-line);
}

/* --- top bar --- */

.top-bar {
  display: none;
  border-bottom: 1px solid var(--rdm-line);
}
.top-bar-nav {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  min-height: 34px;
}
.top-bar-nav-item {
  display: flex;
  align-items: center;
  margin-right: 16px;
}
.top-bar-nav-item:last-child { margin-right: 0; }
.top-bar-service {
  margin-right: auto;
  font-size: 12px;
  line-height: 18px;
  color: var(--rdm-ink);
}
.top-bar-nav-link,
.top-bar-nav-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0;
  border: 0;
  background: none;
  color: var(--rdm-ink);
  font-family: var(--rdm-font);
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  cursor: pointer;
}
.top-bar-nav-link:hover,
.top-bar-nav-btn:hover { color: var(--rdm-green); text-decoration: none; }
.top-bar-list { min-width: 160px; }
.top-bar-list-item { display: block; }

/* --- header row --- */

.header-row {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 16px 0;
}

.header-logo-col {
  flex: 0 0 auto;
  padding: 0;
  margin: 0;
}
.header-logo-main-link { display: inline-flex; align-items: center; gap: 12px; vertical-align: top; }
.header-logo-main-link:hover { text-decoration: none; }
.header-logo-main-img { display: block; width: auto; height: 64px; }
.header-logo-name { font-size: 16px; font-weight: 700; color: var(--rdm-ink); }

.header-search-col {
  flex: 1 1 auto;
  display: flex;
  justify-content: center;
  min-width: 0;
}
.header-search { width: 100%; max-width: 640px; }

.header-actions-col {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
  padding: 8px;
}

/* clear routes back into the shop — agreed with RDM on 6 October */
.header-btn { min-height: 40px; padding: 8px 16px; white-space: nowrap; }
.header-btn svg { flex: none; }
.header-actions-col .btn + .btn { margin-top: 0; }
.header-btn-label-short { display: none; }

/* "Service" after the logo: marks this as the service portal, not the shop */
.header-logo-suffix {
  padding-left: 12px;
  border-left: 1px solid var(--rdm-line);
  color: var(--rdm-green-text);
  font-size: 20px;
  font-weight: 600;
  line-height: 28px;
  letter-spacing: .01em;
}

.header-actions-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 40px;
  padding: 2px 12px;
  border: 1px solid transparent;
  border-radius: var(--rdm-radius);
  background: none;
  color: var(--rdm-bar);
  font-family: var(--rdm-font);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
}
.header-actions-btn:hover,
.header-actions-btn:hover .icon { color: var(--rdm-green); text-decoration: none; }
.header-actions-btn:focus-visible { box-shadow: var(--rdm-focus); outline: 0; }

.header-main .icon {
  display: inline-flex;
  width: 22px;
  height: 22px;
  color: var(--rdm-bar);
}
.header-main .icon svg { width: 100%; height: 100%; display: block; }

.header-cart-btn { width: auto; }
.header-cart-total { margin-left: 8px; font-size: 12px; font-weight: 600; line-height: 21px; white-space: nowrap; }

.nav-main-toggle-btn { display: none; }

/* --- search field (Zendesk {{search}} helper, RDM pill) --- */

.header-search-form {
  position: relative;
  display: flex;
  width: 100%;
}
.header-search-form input[type="search"] {
  order: 1;
  flex: 1 1 auto;
  min-width: 0;
  height: 47px;
  padding: 12px;
  background: var(--rdm-field);
  border: 1px solid var(--rdm-slate);
  border-right: 0;
  border-radius: var(--rdm-pill) 0 0 var(--rdm-pill);
  color: var(--rdm-ink);
  font-family: var(--rdm-font);
  font-size: 14px;
  line-height: 21px;
  appearance: none;
  -webkit-appearance: none;
}
.header-search-form input[type="search"]::placeholder { color: var(--rdm-ink); opacity: 1; }
.header-search-form input[type="search"]:focus { outline: 0; border-color: var(--rdm-slate); }
.header-search-form input[type="search"]::-webkit-search-decoration,
.header-search-form input[type="search"]::-webkit-search-cancel-button,
.header-search-form input[type="search"]::-webkit-search-results-button,
.header-search-form input[type="search"]::-webkit-search-results-decoration { -webkit-appearance: none; }

/* clear button, injected by script.js — sits between field and submit */
.header-search-form .clear-button {
  order: 2;
  display: none;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 47px;
  padding: 0;
  border: 1px solid var(--rdm-slate);
  border-left: 0;
  border-right: 0;
  border-radius: 0;
  background: var(--rdm-field);
  color: var(--rdm-slate);
  cursor: pointer;
}
.header-search-form .clear-button:hover { color: var(--rdm-green); }
.search-has-value .clear-button { display: flex; }

.header-search-form [type="submit"] {
  order: 3;
  flex: 0 0 46px;
  width: 46px;
  height: 47px;
  padding: 0;
  border: 1px solid var(--rdm-slate);
  border-left: 0;
  border-radius: 0 var(--rdm-pill) var(--rdm-pill) 0;
  background: var(--rdm-field) no-repeat center / 22px 22px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%232B3136' d='M10.09 16.32 4.71 21.71a1 1 0 0 1-1.42-1.42l5.39-5.38A7.94 7.94 0 0 1 7 10a8 8 0 1 1 8 8 7.94 7.94 0 0 1-4.91-1.68ZM15 16a6 6 0 1 0-6-6 6 6 0 0 0 6 6Z'/%3E%3C/svg%3E");
  font-size: 0;
  color: transparent;
  cursor: pointer;
}
.header-search-form [type="submit"]:hover {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23279A24' d='M10.09 16.32 4.71 21.71a1 1 0 0 1-1.42-1.42l5.39-5.38A7.94 7.94 0 0 1 7 10a8 8 0 1 1 8 8 7.94 7.94 0 0 1-4.91-1.68ZM15 16a6 6 0 1 0-6-6 6 6 0 0 0 6 6Z'/%3E%3C/svg%3E");
}

/* instant-search results panel */
.search-container { position: relative; }
.header-search-form [role="listbox"],
.header-search-form + [role="listbox"] {
  border: 1px solid var(--rdm-line);
  border-radius: var(--rdm-radius);
  box-shadow: var(--rdm-shadow-lg);
  background: #fff;
}

/* ==========================================================================
   7. MAIN NAVIGATION — 1:1 port
   ========================================================================== */

.nav-main {
  position: relative;
  z-index: 990;
  background: var(--rdm-nav-bg);
  border-bottom: 1px solid var(--rdm-line);
}
.main-navigation-menu {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
}
.main-navigation-link {
  position: relative;
  display: flex;
  align-items: center;
  flex: 1 1 auto;
  min-height: 53.5px;
  padding: 8px 8px 8px 24px;
  color: var(--rdm-nav-text);
  font-size: 15px;
  line-height: 22.5px;
  text-decoration: none;
}
.main-navigation-link:first-child { padding-left: 0; }
.main-navigation-link:not(:first-child)::after {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 60%;
  background: var(--rdm-nav-divider);
}
.main-navigation-link:hover,
.main-navigation-link:visited { color: var(--rdm-nav-text); text-decoration: none; }
.main-navigation-link:hover .main-navigation-link-main-text { color: var(--rdm-green-text); }
.main-navigation-link-text { display: block; line-height: 18.75px; }
.main-navigation-link-main-text {
  font-size: 15px;
  font-weight: 700;
  line-height: 18.75px;
  color: var(--rdm-nav-text);
  transition: color .15s ease;
}
.main-navigation-link-sub-text {
  font-size: 14px;
  font-weight: 400;
  line-height: 17.5px;
  color: var(--rdm-nav-text);
  opacity: .75;
}
.main-navigation-link.is-mobile-only { display: none; }
.main-navigation-link[aria-current="page"] .main-navigation-link-main-text { color: var(--rdm-green-text); }
/* the section menu is filled by script.js; hold the bar's height meanwhile */
.js-section-nav { min-height: 53.5px; }

/* ==========================================================================
   8. USP BAR — 1:1 port
   ========================================================================== */

.usp-bar {
  padding: 16px 0;
  border-bottom: 1px solid var(--rdm-line);
  background: #fff;
  color: var(--rdm-ink);
  font-size: 14px;
  font-weight: 600;
  line-height: 21px;
}
.usp-row { display: flex; margin: 0 calc(var(--rdm-gutter) * -1); }
.usp-col {
  flex: 0 0 25%;
  max-width: 25%;
  padding: 0 var(--rdm-gutter);
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.usp-col.is-center { justify-content: center; }
.usp-col.is-end { justify-content: flex-end; }
.usp-bar .icon { display: inline-flex; width: 17px; height: 17px; color: var(--rdm-green); flex: none; }
.usp-bar .icon svg { width: 100%; height: 100%; display: block; }
.usp-accent { color: var(--rdm-highlight); }
.usp-bar .phone-number { color: var(--rdm-ink); font-weight: 600; }
.usp-bar .phone-number:hover { color: var(--rdm-green); text-decoration: none; }

/* ==========================================================================
   9. FOOTER — 1:1 port
   ========================================================================== */

.footer-main {
  flex: none;
  margin-top: 48px;
  background: var(--rdm-bar);
  color: var(--rdm-footer-text);
  font-size: 14px;
  line-height: 21px;
}
.footer-main a { color: var(--rdm-footer-text); }
.footer-main a:hover { color: #fff; text-decoration: none; }
/* buttons keep their own colours inside the dark footer */
.footer-main .btn-primary,
.footer-main .btn-primary:hover { color: var(--rdm-on-brand); }
.footer-main .btn-outline-light { color: #fff; }
.footer-main .btn-outline-light:hover { color: var(--rdm-bar); }

.footer-columns {
  display: flex;
  margin: 0 calc(var(--rdm-gutter) * -1);
  padding: 40px;
}
.footer-column { flex: 1 1 0; max-width: none; padding: 8px 0; min-width: 0; }
.footer-column + .footer-column { padding-left: 20px; }

.footer-column-headline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0;
  padding: 0 0 16px;
  color: #fff;
  font-family: var(--rdm-font-heading);
  font-size: 16px;
  font-weight: 700;
  line-height: 21px;
}
.footer-column-toggle { display: none; color: #fff; }

.footer-contact-hotline { margin: 0 0 16px; color: var(--rdm-footer-text); white-space: pre-line; }
.footer-contact-form { line-height: 24px; }
.footer-contact-label strong { color: #fff; font-weight: 700; }
.footer-contact-form a { overflow-wrap: anywhere; }

.footer-link-list { margin: 0; padding: 0; list-style: none; }
.footer-link-item { padding: 2px 0; }
.footer-link { color: var(--rdm-footer-text); }
.footer-link:hover { color: #fff; text-decoration: none; }

.socials { display: flex; gap: 16px; margin: 16px 0 0; padding: 0; list-style: none; }
.social-link { display: inline-flex; opacity: .9; transition: opacity .15s ease; }
.social-link:hover { opacity: 1; }
.social-link img { width: 25px; height: 24px; display: block; }

.footer-cta-text { margin: 0 0 16px; }

.footer-logos {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  padding: 16px 0;
  border-top: 1px solid var(--rdm-slate);
}
.footer-brand { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.footer-brand img { width: 64px; height: 64px; display: block; }
.footer-legal { font-size: 12px; line-height: 18px; color: var(--rdm-footer-text); }

.payment-wrapper { display: flex; align-items: center; flex-wrap: wrap; }
.footer-logo { margin: 8px 8px 8px 0; }
.footer-logo:last-child { margin-right: 0; }
.footer-logo-image { max-width: 40px; max-height: 35px; display: block; }

/* ==========================================================================
   10. Shared page components
   ========================================================================== */

.container-divider { border-top: 1px solid var(--rdm-line); }

.sub-nav {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
  padding: 20px 0;
}
.sub-nav .search-container { margin-left: auto; flex: 0 1 380px; min-width: 240px; }
.sub-nav .header-search-form input[type="search"] { height: 40px; padding: 8px 14px; }
.sub-nav .header-search-form [type="submit"],
.sub-nav .header-search-form .clear-button { height: 40px; }

.breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 13px;
}
.breadcrumbs li { color: var(--rdm-muted); }
.breadcrumbs li + li::before { content: "/"; margin: 0 8px; color: var(--rdm-line); }
.breadcrumbs a { color: var(--rdm-muted); }
.breadcrumbs a:hover { color: var(--rdm-green-text); text-decoration: none; }

.page-header { margin-bottom: 28px; }
.page-header h1 { margin: 0 0 8px; }
.page-header-description { max-width: 70ch; margin: 0; color: var(--rdm-muted); font-size: 16px; line-height: 24px; }

/* Dropdowns */
.dropdown { position: relative; display: inline-block; }
.dropdown-toggle { cursor: pointer; }
.dropdown-toggle > * { vertical-align: middle; }
.dropdown-menu {
  display: none;
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  z-index: 1000;
  min-width: 200px;
  padding: 6px 0;
  background: #fff;
  border: 1px solid var(--rdm-line);
  border-radius: var(--rdm-radius);
  box-shadow: var(--rdm-shadow-lg);
  text-align: start;
}
.dropdown-menu-end { left: auto; right: 0; }
.dropdown-toggle[aria-expanded="true"] + .dropdown-menu,
.dropdown-menu.is-open { display: block; }
.dropdown-menu a,
.dropdown-menu [role="menuitem"],
.dropdown-menu [role="menuitemradio"] {
  display: block;
  width: 100%;
  padding: 8px 20px;
  border: 0;
  background: none;
  color: var(--rdm-ink);
  font-family: var(--rdm-font);
  font-size: 14px;
  line-height: 21px;
  text-align: start;
  white-space: nowrap;
  cursor: pointer;
}
.dropdown-menu a:hover,
.dropdown-menu [role="menuitem"]:hover,
.dropdown-menu [role="menuitemradio"]:hover {
  background: var(--rdm-soft);
  color: var(--rdm-green);
  text-decoration: none;
}
.dropdown-menu .dropdown-header { padding: 6px 20px; color: var(--rdm-muted); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.dropdown-menu .separator,
.dropdown-menu [role="separator"] { height: 1px; margin: 6px 0; background: var(--rdm-line); border: 0; }
.dropdown-chevron-icon { transition: transform .15s ease; }
[aria-expanded="true"] .dropdown-chevron-icon { transform: rotate(180deg); }

/* Forms */
label { display: block; margin-bottom: 6px; color: var(--rdm-ink); font-weight: 600; }
input[type="text"], input[type="email"], input[type="password"], input[type="number"],
input[type="tel"], input[type="url"], input[type="date"], input[type="datetime-local"],
select, textarea {
  width: 100%;
  padding: 9px 12px;
  background: #fff;
  border: 1px solid var(--rdm-line);
  border-radius: var(--rdm-radius);
  color: var(--rdm-ink);
  font-family: var(--rdm-font);
  font-size: 14px;
  line-height: 21px;
  transition: border-color .15s ease, box-shadow .15s ease;
}
input:focus, select:focus, textarea:focus {
  outline: 0;
  border-color: var(--rdm-green);
  box-shadow: 0 0 0 3px rgba(39, 154, 36, .18);
}
input[type="checkbox"], input[type="radio"] { width: auto; accent-color: var(--rdm-green); }
textarea { min-height: 140px; resize: vertical; }
.form { padding-bottom: 48px; }
.form-field { margin-bottom: 18px; }
.form-field .hint, .form-field .nesty-input { color: var(--rdm-muted); }
.upload-dropzone {
  padding: 24px;
  border: 2px dashed var(--rdm-line);
  border-radius: var(--rdm-radius);
  background: var(--rdm-soft);
  color: var(--rdm-muted);
  text-align: center;
}
.upload-dropzone:hover { border-color: var(--rdm-green); }

/* Notifications */
.notification, .alert {
  margin: 16px 0;
  padding: 12px 16px;
  border: 1px solid var(--rdm-line);
  border-radius: var(--rdm-radius);
  background: var(--rdm-soft);
}
.notification-error, .alert-danger { border-color: rgba(229, 36, 39, .4); background: rgba(229, 36, 39, .07); color: #8f1416; }
.notification-success, .alert-success { border-color: rgba(39, 154, 36, .4); background: var(--rdm-green-soft); color: #1a6a18; }
.notification-inline { margin: 8px 0; }

/* Badges & status labels */
.badge {
  display: inline-block;
  padding: 0 8px;
  border-radius: 50px;
  background: var(--rdm-green-cta);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  line-height: 20px;
}
.status-label {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 50px;
  background: var(--rdm-field);
  color: var(--rdm-ink);
  font-size: 12px;
  font-weight: 700;
  line-height: 18px;
}
.status-label-open, .status-label-new { background: rgba(229, 36, 39, .12); color: #a3191b; }
.status-label-pending { background: rgba(251, 212, 100, .35); color: #7a5c00; }
.status-label-solved, .status-label-closed { background: var(--rdm-green-soft); color: #1a6a18; }
.status-label-answered { background: rgba(24, 158, 255, .12); color: #0b5f9e; }

/* Pagination */
.pagination { display: flex; justify-content: center; gap: 6px; margin: 32px 0 0; padding: 0; list-style: none; }
.pagination li a, .pagination li span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  padding: 0 10px;
  border: 1px solid var(--rdm-line);
  border-radius: var(--rdm-radius);
  color: var(--rdm-ink);
  font-weight: 600;
}
.pagination li a:hover { border-color: var(--rdm-green); color: var(--rdm-green-text); text-decoration: none; }
.pagination .pagination-current, .pagination li.current span {
  background: var(--rdm-green-cta);
  border-color: var(--rdm-green-cta);
  color: #fff;
}

/* Tables */
table { width: 100%; border-collapse: collapse; }
th, td { padding: 10px 12px; border: 1px solid var(--rdm-line); text-align: left; }
th { background: var(--rdm-soft); font-weight: 700; }

/* ==========================================================================
   11. Home page
   ========================================================================== */

.rdm-hero {
  position: relative;
  padding: 40px 0;
  background: var(--rdm-bar) center / cover no-repeat;
  color: #fff;
}
.rdm-hero::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 4px;
  background: linear-gradient(90deg, var(--rdm-green) 0%, var(--rdm-lime) 100%);
}
.rdm-hero-inner { max-width: 760px; margin: 0 auto; text-align: center; }
.rdm-hero-title { margin: 0 0 10px; color: #fff; font-size: 32px; line-height: 40px; }
.rdm-hero-subtitle { margin: 0; color: rgba(255, 255, 255, .82); font-size: 16px; line-height: 24px; }

/* default home page intro: no heavy band, the header already brands the page */
.rdm-intro { padding: 40px 0 4px; }
.rdm-intro-inner { max-width: 720px; }
.rdm-intro-title { margin: 0 0 8px; font-size: 32px; line-height: 40px; }
.rdm-intro-subtitle { margin: 0; color: var(--rdm-muted); font-size: 16px; line-height: 24px; }
.rdm-intro-search { max-width: 640px; margin-top: 20px; }

.rdm-quick-actions-section { padding: 20px 0 8px; }
.rdm-quick-actions {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.rdm-quick-action {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  height: 100%;
  padding: 18px;
  background: #fff;
  border: 1px solid var(--rdm-line);
  border-radius: var(--rdm-radius);
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.rdm-quick-action:hover {
  border-color: var(--rdm-green);
  box-shadow: var(--rdm-shadow);
  transform: translateY(-1px);
  text-decoration: none;
}
.rdm-quick-action-icon {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: var(--rdm-radius);
  background: var(--rdm-green-soft);
  color: #1a6a18;
}
.rdm-quick-action-accent .rdm-quick-action-icon { background: var(--rdm-lime); color: var(--rdm-bar); }
.rdm-quick-action-body { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.rdm-quick-action-title { color: var(--rdm-ink); font-size: 15px; font-weight: 700; }
.rdm-quick-action-desc { color: var(--rdm-muted); font-size: 13px; line-height: 19px; }

.rdm-blocks {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.rdm-block { display: flex; }
.rdm-block-link {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
  padding: 22px;
  background: #fff;
  border: 1px solid var(--rdm-line);
  border-top: 3px solid var(--rdm-green);
  border-radius: var(--rdm-radius);
  transition: box-shadow .15s ease, transform .15s ease;
}
.rdm-block:hover .rdm-block-link { box-shadow: var(--rdm-shadow-lg); transform: translateY(-2px); }
.rdm-block-title {
  color: var(--rdm-ink);
  font-size: 18px;
  font-weight: 700;
  line-height: 24px;
}
.rdm-block-title:hover { color: var(--rdm-green-text); text-decoration: none; }
.rdm-block-desc { margin: 0; color: var(--rdm-muted); font-size: 14px; line-height: 21px; }

/* the sections inside a category — what actually tells a visitor what is in it */
.rdm-block-sections { margin: 2px 0 0; padding: 0; list-style: none; }
.rdm-block-sections li { padding: 5px 0; border-bottom: 1px solid var(--rdm-line); }
.rdm-block-sections li:last-child { border-bottom: 0; }
.rdm-block-sections a {
  display: block;
  color: var(--rdm-ink);
  font-size: 14px;
  line-height: 20px;
}
.rdm-block-sections a:hover { color: var(--rdm-green-text); text-decoration: none; }
.rdm-block-more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: auto;
  padding-top: 8px;
  color: var(--rdm-green-text);
  font-size: 13px;
  font-weight: 700;
}

.rdm-promoted {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 0 24px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.rdm-promoted-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 0;
  border-bottom: 1px solid var(--rdm-line);
  color: var(--rdm-ink);
  font-weight: 600;
}
.rdm-promoted-link:hover { color: var(--rdm-green-text); text-decoration: none; }
.rdm-promoted-icon { flex: none; color: var(--rdm-green-text); }

/* intro on top, cards in one row of equal columns however many are switched
   on; from 1200px the intro moves beside them. Stacked on phones. */
.rdm-contact-band {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 20px;
  align-items: center;
  padding: 28px;
  background: var(--rdm-soft);
  border: 1px solid var(--rdm-line);
  border-radius: var(--rdm-radius);
}
.rdm-contact-title { margin: 0 0 8px; font-size: 24px; line-height: 30px; }
.rdm-contact-text { margin: 0; color: var(--rdm-muted); }
.rdm-contact-list {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.rdm-contact-card {
  display: flex;
  align-items: center;
  gap: 12px;
  height: 100%;
  padding: 14px;
  background: #fff;
  border: 1px solid var(--rdm-line);
  border-radius: var(--rdm-radius);
}
.rdm-contact-card:hover { border-color: var(--rdm-green); text-decoration: none; }
.rdm-contact-card-icon {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--rdm-green-soft);
  color: #1a6a18;
}
.rdm-contact-card-body { display: flex; flex-direction: column; min-width: 0; }
.rdm-contact-card-label { color: var(--rdm-muted); font-size: 12px; }
.rdm-contact-card-value {
  overflow: hidden;
  color: var(--rdm-ink);
  font-size: 14px;
  font-weight: 700;
  white-space: nowrap;
  text-overflow: ellipsis;
}

@media (min-width: 1200px) {
  .rdm-contact-band { grid-template-columns: minmax(260px, 1fr) minmax(0, 2fr); gap: 32px; }
}
@media (min-width: 768px) and (max-width: 899px) {
  .rdm-contact-card { gap: 10px; padding: 12px; }
  .rdm-contact-card-icon { width: 32px; height: 32px; }
  .rdm-contact-card-value { font-size: 13px; }
}

.rdm-community-band { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.rdm-community-text { margin: 0; color: var(--rdm-muted); }

.recent-activity h3, .recent-activity-header { font-size: 24px; line-height: 33px; }
.recent-activity-list { margin: 0; padding: 0; list-style: none; }
.recent-activity-item { padding: 14px 0; border-bottom: 1px solid var(--rdm-line); }
.recent-activity-item-parent { color: var(--rdm-muted); font-size: 13px; }
.recent-activity-item-link { color: var(--rdm-ink); font-weight: 600; }
.recent-activity-item-link:hover { color: var(--rdm-green-text); text-decoration: none; }
.recent-activity-controls { display: flex; gap: 8px; margin-top: 16px; }
/* with comments switched off, the comment count in Zendesk's block goes too */
.is-without-comments .recent-activity-item-comment { display: none; }

/* ==========================================================================
   12. Category & section pages
   ========================================================================== */

.category-container, .section-container { padding-bottom: 40px; }

.section-tree { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 24px; }
.section-tree .section { padding: 22px; background: #fff; border: 1px solid var(--rdm-line); border-radius: var(--rdm-radius); }
.section-tree-title { margin: 0 0 10px; font-size: 18px; line-height: 24px; }
.section-tree-title a { color: var(--rdm-ink); }
.section-tree-title a:hover { color: var(--rdm-green-text); text-decoration: none; }

.article-list { margin: 0; padding: 0; list-style: none; }
.article-list-item { display: flex; align-items: center; gap: 8px; padding: 9px 0; border-bottom: 1px solid var(--rdm-line); }
.article-list-item:last-child { border-bottom: 0; }
.article-list-link { color: var(--rdm-ink); font-weight: 500; }
.article-list-link:hover { color: var(--rdm-green-text); text-decoration: none; }
.see-all-articles { display: inline-block; margin-top: 12px; font-size: 13px; font-weight: 700; }

.section-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; margin: 0 0 24px; padding: 0; list-style: none; }
.section-list-item a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  background: #fff;
  border: 1px solid var(--rdm-line);
  border-radius: var(--rdm-radius);
  color: var(--rdm-ink);
  font-weight: 600;
}
.section-list-item a:hover { border-color: var(--rdm-green); color: var(--rdm-green-text); text-decoration: none; }
.section-subscribe { margin-top: 12px; }

/* ==========================================================================
   13. Article page
   ========================================================================== */

.article-container { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 40px; padding-bottom: 40px; }
.article-sidebar { min-width: 0; }
.article { min-width: 0; }

.sidenav-title { display: block; margin-bottom: 10px; color: var(--rdm-muted); font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.collapsible-sidebar-toggle { display: none; }
.collapsible-sidebar-body ul { margin: 0; padding: 0; list-style: none; }
.sidenav-item {
  display: block;
  padding: 8px 12px;
  border-left: 2px solid transparent;
  border-radius: 0 var(--rdm-radius) var(--rdm-radius) 0;
  color: var(--rdm-ink);
  font-size: 14px;
}
.sidenav-item:hover { background: var(--rdm-soft); color: var(--rdm-green-text); text-decoration: none; }
.sidenav-item.current-article, .sidenav-item.current {
  border-left-color: var(--rdm-green);
  background: var(--rdm-green-soft);
  color: #1a6a18;
  font-weight: 700;
}
.article-sidebar-item { display: inline-block; margin-top: 10px; font-size: 13px; font-weight: 700; }

.article-header { margin-bottom: 20px; }
.article-title { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 0 0 10px; font-size: 32px; line-height: 38px; }
.article-author { display: flex; align-items: center; gap: 10px; color: var(--rdm-muted); font-size: 13px; }
.avatar .user-avatar, .article-avatar .user-avatar { width: 30px; height: 30px; }
.article-subscribe { margin-top: 12px; }

.article-body { color: var(--rdm-ink); font-size: 15px; line-height: 1.65; }
.article-body > *:first-child { margin-top: 0; }
.article-body h1, .article-body h2, .article-body h3, .article-body h4 { margin: 1.6em 0 .5em; }
.article-body h2 { font-size: 24px; line-height: 32px; }
.article-body h3 { font-size: 19px; line-height: 26px; }
.article-body p { margin: 0 0 1em; }
.article-body ul, .article-body ol { margin: 0 0 1em; padding-left: 1.4em; }
.article-body li { margin-bottom: .35em; }
.article-body img { border-radius: var(--rdm-radius); }
.article-body a { font-weight: 600; text-decoration: underline; }
.article-body blockquote {
  margin: 1.5em 0;
  padding: 12px 20px;
  border-left: 3px solid var(--rdm-green);
  background: var(--rdm-soft);
}
.article-body code { padding: .15em .4em; border-radius: 3px; background: var(--rdm-field); font-size: .92em; }
.article-body pre { padding: 16px; border-radius: var(--rdm-radius); background: var(--rdm-bar); color: #f4f4f4; overflow-x: auto; }
.article-body pre code { padding: 0; background: none; color: inherit; }
.article-body table { display: block; margin: 1.5em 0; overflow-x: auto; }

.article-attachments { margin-top: 28px; }
.attachments { margin: 0; padding: 0; list-style: none; }
.attachment-item {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 8px;
  padding: 10px 12px;
  border: 1px solid var(--rdm-line);
  border-radius: var(--rdm-radius);
}
.attachment-icon { color: var(--rdm-muted); }

.content-tags { margin-top: 28px; }
.content-tag-list { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 0; padding: 0; list-style: none; }
.content-tag-item a, .content-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 12px;
  border: 1px solid var(--rdm-line);
  border-radius: 50px;
  background: var(--rdm-soft);
  color: var(--rdm-ink);
  font-size: 13px;
}
.content-tag-item a:hover { border-color: var(--rdm-green); color: var(--rdm-green-text); text-decoration: none; }

.article-footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-top: 32px; }
.share { display: flex; gap: 8px; margin: 0; padding: 0; list-style: none; }
.share li a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: 1px solid var(--rdm-line);
  border-radius: 50%;
  color: var(--rdm-muted);
}
.share li a:hover { border-color: var(--rdm-green); color: var(--rdm-green-text); }
.article-comment-count { display: inline-flex; align-items: center; gap: 6px; color: var(--rdm-muted); }

.article-votes {
  margin-top: 28px;
  padding: 24px;
  border: 1px solid var(--rdm-line);
  border-radius: var(--rdm-radius);
  background: var(--rdm-soft);
  text-align: center;
}
.article-votes-question { margin: 0 0 14px; font-size: 16px; line-height: 21px; }
.article-votes-controls { display: flex; justify-content: center; gap: 10px; }
.article-vote { min-width: 90px; }
.article-votes-count { display: block; margin-top: 12px; color: var(--rdm-muted); }

.article-more-questions { margin-top: 24px; color: var(--rdm-muted); text-align: center; }
.article-return-to-top { margin-top: 20px; text-align: center; }
.article-return-to-top a { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; color: var(--rdm-green-text); }
.article-return-to-top-icon { transform: rotate(180deg); }

.article-relatives { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 32px; margin-top: 40px; }
.article-relatives h3 { font-size: 16px; line-height: 21px; }
.article-relatives ul { margin: 0; padding: 0; list-style: none; }
.article-relatives li { padding: 7px 0; border-bottom: 1px solid var(--rdm-line); }

/* Comments */
.article-comments, .comments { margin-top: 44px; }
.comment-overview { display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; margin-bottom: 18px; }
.comment-heading { margin: 0; font-size: 20px; line-height: 26px; }
.comment-callout { margin: 0; color: var(--rdm-muted); }
.comment-sorter { margin-left: auto; }
.comment-list { margin: 0; padding: 0; list-style: none; }
.comment { padding: 20px 0; border-top: 1px solid var(--rdm-line); }
.comment-author { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.comment-avatar .user-avatar { width: 34px; height: 34px; }
.comment-meta { display: flex; flex-direction: column; }
.comment-body { font-size: 15px; line-height: 1.6; }
.comment-form { margin-top: 24px; }
.comment-official { border-left: 3px solid var(--rdm-green); padding-left: 16px; }

/* ==========================================================================
   14. Search results
   ========================================================================== */

.search-results { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 40px; padding-bottom: 32px; }
.search-results-sidebar, .search-results-column { min-width: 0; }
.search-results-subheading { margin: 0 0 20px; font-size: 20px; line-height: 26px; }
.filters-in-section { margin-bottom: 26px; }
.multibrand-filter-list { margin: 0; padding: 0; list-style: none; }
.multibrand-filter-list .sidenav-item { display: flex; justify-content: space-between; gap: 8px; }
.sidenav-item.current .doc-count, .sidenav-item.current-article .doc-count { color: #1a6a18; }
.multibrand-filter-list--collapsed li:nth-child(n + 6) { display: none; }
.multibrand-filter-list--collapsed .see-all-filters-item { display: block; }
.doc-count { color: var(--rdm-muted); }
.see-all-filters {
  padding: 8px 12px;
  border: 0;
  background: none;
  color: var(--rdm-green-text);
  font-family: var(--rdm-font);
  font-weight: 700;
  cursor: pointer;
}

.search-results-list { margin: 0; padding: 0; list-style: none; }
.search-results-list > li { padding: 20px 0; border-bottom: 1px solid var(--rdm-line); }
.search-result-title-container { display: flex; justify-content: space-between; gap: 16px; }
.search-result-title { margin: 0 0 6px; font-size: 17px; line-height: 24px; }
.search-result-title a { color: var(--rdm-ink); }
.search-result-title a:hover { color: var(--rdm-green-text); text-decoration: none; }
.search-result-icons { display: flex; gap: 12px; flex: none; color: var(--rdm-muted); font-size: 13px; }
.search-result-meta-container { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 6px; }
.search-result-breadcrumbs { font-size: 12px; }
.search-result-description { margin: 0; color: var(--rdm-ink); line-height: 1.6; }
.no-results { padding: 48px 0; text-align: center; }
.no-results .headline { margin: 20px 0 8px; font-size: 20px; font-weight: 700; }
.no-results .action-prompt { color: var(--rdm-muted); }

/* ==========================================================================
   15. Requests, profile, community
   ========================================================================== */

.my-activities-nav { background: var(--rdm-soft); border-bottom: 1px solid var(--rdm-line); }
.collapsible-nav-toggle { display: none; }
.collapsible-nav-list { display: flex; gap: 4px; margin: 0; padding: 0; list-style: none; }
.collapsible-nav-list li a {
  display: inline-block;
  padding: 14px 16px;
  border-bottom: 3px solid transparent;
  color: var(--rdm-ink);
  font-weight: 600;
}
.collapsible-nav-list li a:hover { color: var(--rdm-green-text); text-decoration: none; }
.collapsible-nav-list li.current a { border-bottom-color: var(--rdm-green); color: var(--rdm-green-text); }

.my-activities-header { padding: 28px 0 16px; }
.my-activities-header h1 { margin: 0; }
.my-activities-following-header { display: flex; align-items: center; gap: 16px; margin-bottom: 16px; }

.request-container { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 40px; padding-bottom: 40px; }
.request-main, .request-sidebar { min-width: 0; }
.request-breadcrumbs { padding-top: 20px; }
.request-title { margin: 24px 0 20px; }
.request-details { padding: 20px; border: 1px solid var(--rdm-line); border-radius: var(--rdm-radius); background: var(--rdm-soft); }
.request-details dt { color: var(--rdm-muted); font-size: 13px; }
.request-details dd { margin: 0 0 12px; font-weight: 600; }

.striped-list { margin: 0; padding: 0; list-style: none; }
.striped-list-item { padding: 14px 0; border-bottom: 1px solid var(--rdm-line); }

.profile-header { padding: 32px 0; background: var(--rdm-soft); border-bottom: 1px solid var(--rdm-line); }
.profile-info { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.profile-avatar .user-avatar { width: 72px; height: 72px; }
.profile-nav { margin: 24px 0; }

.post { padding-bottom: 40px; }
.post-header { margin-bottom: 16px; }
.post-title { margin: 0 0 8px; }
.post-body { font-size: 15px; line-height: 1.65; }
.post-list { margin: 0; padding: 0; list-style: none; }
.post-list-item { padding: 16px 0; border-bottom: 1px solid var(--rdm-line); }
.community-badge {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 50px;
  background: var(--rdm-green-soft);
  color: #1a6a18;
  font-size: 12px;
  font-weight: 700;
}
.community-badge-achievements, .community-badge-titles { display: flex; gap: 8px; flex-wrap: wrap; margin: 8px 0 0; padding: 0; list-style: none; }

.error-page { max-width: var(--rdm-container); margin: 0 auto; padding: 72px var(--rdm-gutter); text-align: center; }
.error-page h1 { margin-bottom: 8px; font-size: 48px; line-height: 54px; }
.error-page h2 { color: var(--rdm-muted); font-size: 20px; font-weight: 600; }

/* ==========================================================================
   16. Responsive
   ========================================================================== */

@media (min-width: 992px) {
  .top-bar { display: block; }
  /* 64px logo with 16px above and below, so it sits centred between the
     top bar and the menu (the storefront's fixed 85px row no longer fits) */
  /* the top bar scrolls away, the logo + search row stays pinned */
  .header-main { top: -35px; }
}

@media (max-width: 1199px) {
  .main-navigation-link { padding-left: 16px; }
  .main-navigation-link-main-text { font-size: 14px; }
  .main-navigation-link-sub-text { font-size: 13px; }
}

@media (max-width: 991px) {
  /* sm–md: white header, logo left, search on its own row (as on the storefront) */
  .header-row { flex-wrap: wrap; gap: 12px; padding: 12px 0; }
  .header-logo-col { order: 2; margin: 0; padding: 0; }
  .header-actions-col { order: 3; margin-left: auto; padding: 0; }
  .header-search-col { order: 4; flex: 1 0 100%; }
  .nav-main-toggle-btn { display: inline-flex; order: -1; }
  .header-logo-main-img { height: 52px; }

  .nav-main { display: none; }
  .nav-main.is-open { display: block; }
  .main-navigation-menu { flex-direction: column; padding: 8px 0; }
  .js-section-nav { min-height: 0; }
  .main-navigation-link { flex: none; min-height: 0; padding: 14px 0; }
  .main-navigation-link:first-child { padding-left: 0; }
  .main-navigation-link:not(:first-child)::after {
    top: 0;
    left: 0;
    width: 100%;
    height: 1px;
    transform: none;
    background: var(--rdm-nav-divider);
  }
  .main-navigation-link.is-mobile-only { display: flex; }
  .main-navigation-link-sub-text { display: none; }

  .usp-row { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .usp-col { flex: 0 0 auto; max-width: none; white-space: nowrap; }
  .usp-col.is-center, .usp-col.is-end { justify-content: flex-start; }

  .footer-columns { flex-direction: column; margin: 0; padding: 8px 0 24px; }
  .footer-column { flex: none; max-width: none; padding: 0; border-bottom: 1px solid var(--rdm-slate); }
  .footer-column + .footer-column { padding-left: 0; }
  .footer-column:last-child { border-bottom: 0; }
  .footer-column-headline { padding: 16px 0; cursor: pointer; }
  .footer-column-toggle { display: inline-flex; }
  .footer-column-headline[aria-expanded="true"] .footer-column-toggle { transform: rotate(180deg); }
  .footer-column-content { display: none; padding-bottom: 16px; }
  .footer-column-content.is-open { display: block; }

  .article-container, .search-results, .request-container { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .article-sidebar, .search-results-sidebar { order: 2; }
  .rdm-quick-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
  :root { --rdm-gutter: 16px; }
  .rdm-contact-list { grid-auto-flow: row; grid-template-columns: minmax(0, 1fr); }
  .rdm-contact-band { padding: 20px; }
  h1 { font-size: 28px; line-height: 34px; }
  h2 { font-size: 22px; line-height: 28px; }
  .article-title { font-size: 24px; line-height: 30px; }
  .rdm-hero { padding: 28px 0; }
  .rdm-hero-title { font-size: 26px; line-height: 32px; }
  .rdm-hero-subtitle { font-size: 15px; }
  .rdm-intro { padding: 28px 0 4px; }
  .rdm-intro-title { font-size: 24px; line-height: 30px; }
  .rdm-intro-subtitle { font-size: 15px; }
  .rdm-section { padding: 28px 0; }
  .rdm-quick-actions { grid-template-columns: minmax(0, 1fr); }
  .section-tree { grid-template-columns: minmax(0, 1fr); }
  .sub-nav { gap: 12px; }
  .sub-nav .search-container { flex: 1 0 100%; margin-left: 0; }
  .article-footer { justify-content: flex-start; }
  .footer-logos { justify-content: flex-start; }
}

/* xs: the storefront switches to a dark header with the logo centred on a
   white band, then the action row, then the search field. */
@media (max-width: 575px) {
  .header-main { background: var(--rdm-bar); }
  .header-main .icon,
  .header-main .header-actions-btn { color: #fff; }
  .header-main .header-actions-btn:hover,
  .header-main .header-actions-btn:hover .icon { color: var(--rdm-lime); }

  .header-row {
    align-items: center;
    gap: 0;
    margin-inline: calc(var(--rdm-gutter) * -1);
    padding: 0;
  }

  .header-logo-col {
    order: 0;
    flex: 0 0 100%;
    max-width: 100%;
    margin: 16px 0;
    padding: 16px var(--rdm-gutter);
    background: #fff;
    text-align: center;
  }
  .header-logo-main-link { justify-content: center; }
  .header-logo-main-img { height: 60px; margin-inline: auto; }

  .header-actions-col {
    order: 1;
    flex: 0 0 100%;
    max-width: 100%;
    margin: 0;
    padding: 8px var(--rdm-gutter);
  }
  .nav-main-toggle-btn { margin-right: auto; }
  .header-main .header-btn-back { border-color: rgba(255, 255, 255, .45); color: #fff; }
  .header-main .header-btn-back:hover { background: #fff; color: var(--rdm-bar); }
  .header-btn { min-height: 36px; padding: 6px 12px; font-size: 13px; }
  .header-btn-label-long { display: none; }
  .header-btn-label-short { display: inline; }
  .header-actions-col { gap: 6px; min-width: 0; }
  .header-logo-suffix { font-size: 18px; }

  .header-search-col {
    order: 2;
    flex: 0 0 100%;
    max-width: 100%;
    padding: 0 var(--rdm-gutter) 16px;
  }
  .header-search-form input[type="search"],
  .header-search-form [type="submit"],
  .header-search-form .clear-button { height: 50px; }

  .usp-bar { display: none; }
  .header-cart-total { display: none; }
  .header-cart-btn { width: 48px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ---------- 17. Print ----------------------------------------------------- */

@media print {
  .header-main, .nav-main, .usp-bar, .footer-main, .sub-nav,
  .article-sidebar, .article-votes, .article-relatives, .article-comments,
  .skip-navigation { display: none !important; }
  body { display: block; }
  .article-body { font-size: 12pt; }
  a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 10pt; color: #555; }
}

/* ==========================================================================
   18. Remaining Help Center surfaces
   Every class the Zendesk page templates emit — community, profiles,
   requests, service catalog, votes, tables — skinned to the RDM system so
   no page can fall back to unstyled markup.
   ========================================================================== */

/* --- layout wrappers used by the Zendesk page templates ------------------ */

.container {
  width: 100%;
  max-width: var(--rdm-container);
  margin-inline: auto;
  padding-inline: var(--rdm-gutter);
}
.category-content, .section-content, .article-content, .article-info { min-width: 0; }
.rdm-contact-intro { min-width: 0; }
.rdm-promoted-item { min-width: 0; }

/* --- hero used by the community / service catalog list pages ------------- */

.hero, .community-hero, .service-catalog-hero {
  position: relative;
  padding: 56px 0;
  background: var(--rdm-bar) center / cover no-repeat;
  color: #fff;
  text-align: center;
}
.hero::after, .community-hero::after, .service-catalog-hero::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 4px;
  background: linear-gradient(90deg, var(--rdm-green) 0%, var(--rdm-lime) 100%);
}
.hero-inner {
  max-width: 760px;
  margin: 0 auto;
  padding-inline: var(--rdm-gutter);
}
.hero h1, .hero h2, .community-hero h1, .service-catalog-hero h1 { color: #fff; }
.hero .header-search-form, .community-hero .header-search-form { max-width: 640px; margin: 0 auto; }
.hero .header-search-form input[type="search"],
.community-hero .header-search-form input[type="search"] { background: #fff; border-color: #fff; }
.hero .header-search-form [type="submit"],
.community-hero .header-search-form [type="submit"] { background-color: #fff; border-color: #fff; }
.search-icon { display: none; }
.service-catalog-main-content, .service-catalog-breadcrumbs { padding-bottom: 40px; }

/* --- generic block grid (community topics, service list) ----------------- */

.blocks { margin-bottom: 32px; }
.blocks-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.blocks-item { display: flex; }
.blocks-item-link {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
  padding: 22px;
  background: #fff;
  border: 1px solid var(--rdm-line);
  border-top: 3px solid var(--rdm-green);
  border-radius: var(--rdm-radius);
  transition: box-shadow .15s ease, transform .15s ease;
}
.blocks-item-link:hover { box-shadow: var(--rdm-shadow-lg); transform: translateY(-2px); text-decoration: none; }
.blocks-item-title { color: var(--rdm-ink); font-size: 18px; font-weight: 700; line-height: 24px; }
.blocks-item-description { color: var(--rdm-muted); font-size: 14px; line-height: 21px; }

.promoted-articles { margin: 0; padding: 0; list-style: none; }
.promoted-articles-item { padding: 10px 0; border-bottom: 1px solid var(--rdm-line); }
.promoted-articles-item a { display: inline-flex; align-items: center; gap: 8px; color: var(--rdm-ink); font-weight: 600; }
.promoted-articles-item a:hover { color: var(--rdm-green); text-decoration: none; }

/* --- buttons: remaining Zendesk variants -------------------------------- */

.button-large { min-height: 48px; padding: 12px 24px; font-size: 15px; }
.button-secondary { background: var(--rdm-bar); border-color: var(--rdm-bar); color: #fff; }
.button-secondary:hover { background: #14181a; border-color: #14181a; color: #fff; }
.split-button { display: inline-flex; }
.split-button > *:first-child { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.split-button > *:last-child { border-top-left-radius: 0; border-bottom-left-radius: 0; margin-left: -1px; }

/* --- collapsible toggles ------------------------------------------------- */

.collapsible-nav, .collapsible-sidebar { position: relative; }
.collapsible-nav-toggle-icon, .collapsible-sidebar-toggle-icon { color: var(--rdm-ink); }
.collapsible-nav .x-icon, .collapsible-sidebar .x-icon { display: none; }
.collapsible-nav[aria-expanded="true"] .chevron-icon,
.collapsible-sidebar[aria-expanded="true"] .chevron-icon { display: none; }
.collapsible-nav[aria-expanded="true"] .x-icon,
.collapsible-sidebar[aria-expanded="true"] .x-icon { display: inline-block; }
.collapsible-sidebar-title { display: block; margin-bottom: 10px; color: var(--rdm-muted); font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.collapsible-nav-border { border-bottom: 1px solid var(--rdm-line); }

/* --- votes --------------------------------------------------------------- */

.vote { display: inline-flex; align-items: center; gap: 6px; }
.vote-up, .vote-down {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border: 1px solid var(--rdm-line);
  border-radius: var(--rdm-radius);
  background: #fff;
  color: var(--rdm-muted);
  cursor: pointer;
}
.vote-up:hover, .vote-down:hover { border-color: var(--rdm-green); color: var(--rdm-green-text); }
.vote-voted { border-color: var(--rdm-green); background: var(--rdm-green-soft); color: #1a6a18; }
.vote-sum { min-width: 24px; color: var(--rdm-ink); font-weight: 700; text-align: center; }
.article-vote-up, .article-vote-down { min-width: 90px; }
.article-vote-label { color: var(--rdm-muted); }
.article-share, .post-share { display: flex; gap: 8px; }
.article-comment-count-icon, .search-result-votes-icon, .search-result-meta-count-icon { color: var(--rdm-muted); }
.search-result-votes, .search-result-meta-count { display: inline-flex; align-items: center; gap: 4px; }

/* --- comments ------------------------------------------------------------ */

.comment-wrapper, .comment-container { display: flex; flex-direction: column; gap: 10px; }
.comment-info { display: flex; flex-direction: column; gap: 10px; }
.comment-labels { display: flex; gap: 8px; flex-wrap: wrap; }
.comment-actions-container, .comment-actions { display: flex; align-items: center; gap: 12px; }
.comment-actions-container { margin-top: 10px; }
.comment-vote { display: inline-flex; align-items: center; gap: 6px; }
.comment-attachments, .request-attachments { margin-top: 12px; }
.comment-pending { opacity: .7; }
.comment-form-controls { display: flex; justify-content: flex-end; gap: 8px; margin-top: 12px; }
.comment-ccs { margin-top: 12px; }
.comment-link { color: var(--rdm-muted); font-size: 13px; }
.attachment-meta { display: flex; gap: 10px; }
.attachment-meta-item { color: var(--rdm-muted); font-size: 13px; }

/* --- community ----------------------------------------------------------- */

.community-header { margin-bottom: 24px; }
.community-name-and-title-badges { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.community-badge-title, .community-badge-achievement {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 50px;
  background: var(--rdm-green-soft);
  color: #1a6a18;
  font-size: 12px;
  font-weight: 700;
}
.community-badge-achievements-rest { color: #1a6a18; font-size: 12px; }
.community-featured-posts, .community-activity { margin-bottom: 32px; }
.community-follow { margin: 12px 0; }
.community-footer {
  margin-top: 40px;
  padding: 28px;
  border: 1px solid var(--rdm-line);
  border-radius: var(--rdm-radius);
  background: var(--rdm-soft);
  text-align: center;
}
.community-footer-title { margin: 0 0 12px; font-size: 20px; }

.topics, .topics-list, .posts-list { margin: 0; padding: 0; list-style: none; }
.topic-header { margin-bottom: 20px; }
.topic-filters { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
.post-list-item, .posts-list > li { padding: 16px 0; border-bottom: 1px solid var(--rdm-line); }
.post-container { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 40px; padding-bottom: 40px; }
.post-content, .post-sidebar { min-width: 0; }
.post-sidebar-title { display: block; margin-bottom: 10px; color: var(--rdm-muted); font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.post-info, .post-info-container { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.post-author { display: flex; align-items: center; gap: 10px; }
.post-avatar .user-avatar { width: 34px; height: 34px; }
.post-meta { color: var(--rdm-muted); font-size: 13px; }
.post-footer, .post-actions, .post-actions-wrapper { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.post-footer { margin-top: 24px; }
.post-comments { margin-top: 40px; }
.post-comment-count, .post-overview-count { color: var(--rdm-muted); font-size: 13px; }
.post-overview-item { display: flex; align-items: center; gap: 8px; }
.post-vote { display: inline-flex; align-items: center; gap: 6px; }
.post-to-community { margin: 16px 0; }
.no-posts-with-filter, .no-activity, .no-activities { padding: 32px 0; color: var(--rdm-muted); text-align: center; }

.status-label-featured, .status-label-pinned { background: rgba(202, 226, 53, .35); color: #5c6a00; }
.status-label-official { background: var(--rdm-green-soft); color: #1a6a18; }
.status-label-pending-moderation { background: rgba(251, 212, 100, .35); color: #7a5c00; }
.escalation-badge { display: inline-block; padding: 2px 8px; border-radius: 50px; background: rgba(229, 36, 39, .12); color: #a3191b; font-size: 12px; font-weight: 700; }

/* --- profiles ------------------------------------------------------------ */

.basic-info { min-width: 0; }
.basic-info .name { margin: 0; font-size: 28px; line-height: 34px; }
.basic-info .description { color: var(--rdm-muted); }
.profile-stats { display: flex; gap: 32px; flex-wrap: wrap; margin-top: 16px; }
.profile-stats-counters { display: flex; gap: 32px; flex-wrap: wrap; }
.stat { display: flex; flex-direction: column; }
.stat-value { color: var(--rdm-ink); font-size: 20px; font-weight: 700; }
.stat-label { color: var(--rdm-muted); font-size: 13px; }

.profile-section { padding: 32px 0; border-bottom: 1px solid var(--rdm-line); }
.profile-section-header { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
.profile-section-title { margin: 0; font-size: 20px; line-height: 26px; }
.profile-section-description { color: var(--rdm-muted); }
.profile-section-sorter { margin-left: auto; }

.profile-activity-list, .profile-badges-items { margin: 0; padding: 0; list-style: none; }
.profile-activity-contribution, .profile-contribution { padding: 14px 0; border-bottom: 1px solid var(--rdm-line); }
.profile-activity-header, .profile-contribution-header { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.profile-activity-icon, .profile-contribution-icon, .private-activity-icon, .profile-private-icon { color: var(--rdm-muted); flex: none; }
.profile-activity-description, .profile-contribution-body { color: var(--rdm-muted); font-size: 13px; }
.profile-contribution-title { font-weight: 600; }
.profile-contribution-breadcrumbs { color: var(--rdm-muted); font-size: 12px; }
.profile-private-badge { display: inline-flex; align-items: center; gap: 4px; color: var(--rdm-muted); font-size: 12px; }
.private-activity { opacity: .75; }

.profile-badges-items { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; }
.profile-badges-item { display: flex; align-items: center; gap: 12px; padding: 12px; border: 1px solid var(--rdm-line); border-radius: var(--rdm-radius); }
.profile-badges-item-image { flex: none; width: 40px; height: 40px; }
.profile-badges-item-title, .profile-badges-item-metadata-title { font-weight: 700; }
.profile-badges-item-description, .profile-badges-item-metadata-description { color: var(--rdm-muted); font-size: 13px; }
.user-profile-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.icon-agent { color: var(--rdm-green); }

/* --- tables & striped lists (requests, contributions, following) --------- */

.table, .my-activities-table, .contributions-table, .subscriptions-table {
  width: 100%;
  border-collapse: collapse;
}
.my-activities-table th, .contributions-table th, .subscriptions-table th, .table th {
  padding: 10px 12px;
  border: 0;
  border-bottom: 2px solid var(--rdm-line);
  background: none;
  color: var(--rdm-muted);
  font-size: 13px;
  font-weight: 700;
  text-align: left;
}
.my-activities-table td, .contributions-table td, .subscriptions-table td, .table td {
  padding: 14px 12px;
  border: 0;
  border-bottom: 1px solid var(--rdm-line);
  vertical-align: top;
}
.my-activities-sub-nav { margin-bottom: 16px; }
.subscriptions-subscribe { text-align: right; }

.striped-list-item { display: flex; align-items: center; gap: 16px; }
.striped-list-info { flex: 1 1 auto; min-width: 0; }
.striped-list-title { display: block; color: var(--rdm-ink); font-weight: 600; }
.striped-list-title:hover { color: var(--rdm-green-text); text-decoration: none; }
.striped-list-count { display: flex; gap: 20px; flex: none; }
.striped-list-count-item { display: flex; flex-direction: column; align-items: center; color: var(--rdm-muted); font-size: 12px; }
.striped-list-number { color: var(--rdm-ink); font-size: 16px; font-weight: 700; }

/* --- forms: remaining Zendesk pieces ------------------------------------- */

.form-header { margin-bottom: 20px; }
.hbs-form .form-field, .hbs-form label { max-width: 100%; }
.form-field .optional, .optional { color: var(--rdm-muted); font-weight: 400; }
.form-field .options, .options { margin-top: 6px; }
.suggestion-list { margin: 8px 0 0; padding: 0; list-style: none; }
.suggestion-list li { padding: 6px 0; border-bottom: 1px solid var(--rdm-line); }
.ccs-input, .request-collaborators { margin-bottom: 18px; }
.request-follow-up { margin-top: 16px; color: var(--rdm-muted); }
.mark-as-solved { margin-top: 12px; }
.actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 16px; }
.content-tags-add-hint { color: var(--rdm-muted); font-size: 13px; }

/* --- search-result sidebar tags ------------------------------------------ */

.sidenav-subitem { display: inline-block; }
.filter-name { overflow: hidden; text-overflow: ellipsis; }
.sidenav-tag { padding: 4px 0; }
.close-icon { flex: none; }

/* --- responsive additions ------------------------------------------------ */

@media (max-width: 991px) {
  .post-container { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .post-sidebar { order: 2; }
  .profile-stats, .profile-stats-counters { gap: 20px; }

  .collapsible-nav-toggle, .collapsible-sidebar-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border: 1px solid var(--rdm-line);
    border-radius: var(--rdm-radius);
    background: #fff;
    cursor: pointer;
  }
  .collapsible-nav-list { display: none; flex-direction: column; }
  .collapsible-nav[aria-expanded="true"] .collapsible-nav-list { display: flex; }
  .collapsible-nav-list li.current a { border-bottom: 0; border-left: 3px solid var(--rdm-green); }

  .my-activities-table, .contributions-table, .subscriptions-table { display: block; overflow-x: auto; }
}

/* --- last-mile helpers ---------------------------------------------------- */

.article-meta { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.meta-group-opposite { margin-left: auto; }
.profile-stats-activity { display: flex; flex-direction: column; gap: 4px; }
.profile-badges-item-metadata { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.rdm-recent-activity { padding-top: 8px; }