/*
 * Resources hub — /resources/ (blocks/resource-hub/). Handle "tfp-resource-hub",
 * after tfp-industry for the --ind-* tokens (live colours and type now, the
 * rebrand behind its switch). Theme rules: 1px borders instead of elevation,
 * radius 4px, no box-shadows, no gradients, colour fades only, yellow never as
 * text on a light surface. Navy hero by default; the light version follows
 * html[data-theme="light"] like the homepage and the Speak page.
 */

.rh {
	--rh-ink: var(--ind-ink, #0D3556);
	--rh-blue: var(--ind-blue, #005B97);
	--rh-yellow: var(--ind-yellow, #FAC410);
	--rh-text: var(--ind-text, #2B3440);
	--rh-muted: #5F6B78;
	--rh-n50: var(--ind-n50, #F3F4F6);
	--rh-n100: var(--ind-n100, #E7E9ED);
	--rh-n200: var(--ind-n200, #D3D8DE);
	--rh-line: rgba(255, 255, 255, .18);
	--rh-radius: var(--ind-radius, 4px);
	--rh-gap: var(--ind-gap, 24px);
	--rh-fade: var(--ind-fade, color .15s ease-out, background-color .15s ease-out, border-color .15s ease-out);
	color: var(--rh-text);
}
.rh-wrap { width: 100%; max-width: 1312px; margin: 0 auto; padding-left: clamp(1.25rem, 3.5vw, 4rem); padding-right: clamp(1.25rem, 3.5vw, 4rem); }
.rh [hidden] { display: none !important; }
.rh ul, .rh ol { list-style: none; margin: 0; padding: 0; }
/* margin only: a padding reset here (0,1,1) outranks .rh-file / .rh-chapter (0,1,0) and strips their padding. */
.rh li { margin: 0; }
.rh-card, .rh-linkrow, .rh-video { padding: 0; }
.rh li::before { content: none; }
.rh-ico { display: block; flex: 0 0 auto; width: 20px; height: 20px; }

/* ---- Hero: title, search, chips ---------------------------------------- */

.rh-hero { background: var(--rh-ink); color: #fff; padding: clamp(2.5rem, 5vw, 4.5rem) 0 clamp(2rem, 4vw, 3.25rem); }
.rh-crumb { margin: 0 0 1.25rem; font-size: 12px; line-height: 18px; letter-spacing: .08em; text-transform: uppercase; color: var(--rh-yellow); }
.rh-crumb a { color: inherit !important; text-decoration: none !important; }
.rh-crumb a:hover { text-decoration: underline !important; }
.rh-crumb .breadcrumb_last { color: inherit; font-weight: 400; }
.rh-hero__title { margin: 0 0 1rem; max-width: 20ch; color: #fff; font-size: clamp(34px, 4.2vw, 56px); line-height: 1.06; letter-spacing: -.02em; text-wrap: balance; }
.rh-hero__lead { margin: 0 0 2rem; max-width: 62ch; font-size: clamp(17px, 1.35vw, 19px); line-height: 1.6; color: rgba(255, 255, 255, .86); }

.rh-search { margin: 0 0 1.5rem; max-width: 760px; }
.rh-search__label { display: block; margin: 0 0 .5rem; font-size: 14px; line-height: 20px; font-weight: 700; color: #fff; }
.rh-search__field { position: relative; display: flex; align-items: center; }
.rh-search__field .rh-ico { position: absolute; left: 16px; width: 22px; height: 22px; color: var(--rh-muted); pointer-events: none; }
.rh .rh-search__input {
	width: 100%;
	height: 56px;
	margin: 0;
	padding: 0 16px 0 50px;
	border: 1px solid #fff;
	border-radius: var(--rh-radius);
	background: #fff;
	box-shadow: none;
	color: var(--rh-text);
	font-size: 17px;
	line-height: 24px;
}
.rh .rh-search__input:focus { outline: 3px solid var(--rh-yellow); outline-offset: 2px; border-color: #fff; box-shadow: none; }
.rh-search__hint { margin: .5rem 0 0; font-size: 13px; line-height: 20px; color: rgba(255, 255, 255, .74); }

.rh-chips { display: flex; flex-wrap: wrap; gap: .5rem; }
.rh-chip {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 1rem;
	border: 1px solid var(--rh-line);
	border-radius: var(--rh-radius);
	color: #fff;
	font-weight: 600;
	font-size: 15px;
	line-height: 20px;
	text-decoration: none !important;
	transition: var(--rh-fade);
}
.rh-chip:hover,
.rh-chip:focus-visible { border-color: #fff; color: #fff; }
.rh-chip.is-active { background: var(--rh-yellow); border-color: var(--rh-yellow); color: var(--rh-ink); }

/* ---- Sections ---------------------------------------------------------- */

.rh-status, .rh-empty { margin-top: 1.75rem; font-size: 15px; line-height: 22px; color: var(--rh-muted); }
.rh-empty p { margin: 0; padding: 1.5rem; border: 1px solid var(--rh-n200); border-radius: var(--rh-radius); background: var(--rh-n50); color: var(--rh-text); }
.rh-section { padding: clamp(2.75rem, 5vw, 5rem) 0; border-top: 1px solid var(--rh-n100); scroll-margin-top: 110px; }
/* Every second section that is on the page is tinted — by position, not by name, so switching one off (the training
   manual, 2026-09-19) never leaves two grey bands back to back. */
#rh-results > .rh-section:nth-of-type(even) { background: var(--rh-n50); }
#rh-results > .rh-section:first-of-type { border-top: 0; }
#rh-results { scroll-margin-top: 110px; }
.rh-head { margin: 0 0 1.75rem; max-width: 760px; }
.rh-head-row { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: .5rem 2rem; margin-bottom: 1.75rem; }
.rh-head-row .rh-head { margin-bottom: 0; }
.rh-head-links { display: flex; flex-wrap: wrap; gap: .25rem 1.5rem; margin: 0; }
.rh-eyebrow { margin: 0 0 .5rem; font-size: 13px; line-height: 16px; letter-spacing: .08em; text-transform: uppercase; color: var(--rh-blue); }
.rh-h2 { margin: 0; font-size: clamp(26px, 2.6vw, 34px); line-height: 1.18; letter-spacing: -.01em; }
.rh-intro { margin: .75rem 0 0; font-size: 17px; line-height: 1.6; color: var(--rh-muted); }

/* Cards: one shape for case studies and articles (16:10 like .ind-tile). */
.rh-cards { display: grid; grid-template-columns: 1fr; gap: var(--rh-gap); }
@media (min-width: 640px)  { .rh-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .rh-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.rh-card { display: flex; }
.rh-card__link { display: flex; flex-direction: column; width: 100%; border: 1px solid var(--rh-n200); border-radius: var(--rh-radius); background: #fff; color: inherit; overflow: hidden; text-decoration: none !important; transition: var(--rh-fade); }
.rh-card__link:hover, .rh-card__link:focus-visible { border-color: var(--rh-blue); }
.rh-card__media { display: block; position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: var(--rh-n100); }
.rh-card__img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; }
.rh-card__body { display: flex; flex-direction: column; align-items: flex-start; gap: .6rem; flex: 1 1 auto; padding: 20px; }
.rh-tag { display: inline-block; padding: 3px 8px; border: 1px solid var(--rh-n200); border-radius: var(--rh-radius); font-size: 12px; line-height: 16px; letter-spacing: .06em; text-transform: uppercase; color: var(--rh-blue); background: #fff; }
.rh-tag--case-study { border-color: var(--rh-ink); background: var(--rh-ink); color: #fff; }
.rh-card__title { font-size: 20px; line-height: 26px; font-weight: 700; color: var(--rh-ink); }
.rh-card__summary { font-size: 16px; line-height: 25px; color: var(--rh-text); }
.rh-card__cta { margin-top: auto; padding-top: .5rem; font-weight: 700; color: var(--rh-blue); }

/* Downloads: outlined rows — icon, what it is, type and size, one action. */
.rh-files { display: grid; grid-template-columns: 1fr; gap: 1.25rem; }
@media (min-width: 900px) { .rh-files { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--rh-gap); } }
.rh-file { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 1.25rem 1.5rem; align-items: start; padding: clamp(1.5rem, 2.2vw, 2rem); border: 1px solid var(--rh-n200); border-radius: var(--rh-radius); background: #fff; }
.rh-file__icon { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: var(--rh-radius); background: var(--rh-ink); color: #fff; }
.rh-file__icon .rh-ico { width: 24px; height: 24px; }
.rh-file__text { display: flex; flex-direction: column; gap: .5rem; min-width: 0; padding-top: .15rem; }
.rh-file__title { font-size: 18px; line-height: 24px; font-weight: 700; color: var(--rh-ink); }
.rh-file__note { font-size: 15px; line-height: 23px; color: var(--rh-text); }
.rh-file__meta { margin-top: .15rem; font-size: 12px; line-height: 18px; letter-spacing: .06em; text-transform: uppercase; color: var(--rh-muted); }
.rh-file__btn { grid-column: 2; justify-self: start; display: inline-flex; align-items: center; gap: .5rem; min-height: 44px; padding: 0 1rem; border: 1px solid var(--rh-ink); border-radius: var(--rh-radius); color: var(--rh-ink); font-weight: 700; font-size: 15px; text-decoration: none !important; transition: var(--rh-fade); }
.rh-file__btn:hover, .rh-file__btn:focus-visible { background: var(--rh-ink); color: #fff; }
.rh-file__btn .rh-ico { width: 18px; height: 18px; }

/* Training manual: a numbered list of chapter rows. */
.rh-chapters { border: 1px solid var(--rh-n200); border-radius: var(--rh-radius); background: #fff; }
.rh-chapter { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .35rem 1.5rem; align-items: center; padding: 20px 24px; border-top: 1px solid var(--rh-n100); }
.rh .rh-chapter:first-child { border-top: 0; }
.rh-chapter__label { grid-column: 1; font-size: 12px; line-height: 16px; letter-spacing: .08em; text-transform: uppercase; color: var(--rh-blue); }
.rh-chapter__title { grid-column: 1; font-size: 17px; line-height: 24px; font-weight: 700; color: var(--rh-ink); }
.rh-chapter__topics { grid-column: 1; font-size: 14px; line-height: 21px; color: var(--rh-muted); }
.rh-chapter__dl { grid-column: 2; grid-row: 1 / span 3; display: inline-flex; align-items: center; gap: .5rem; min-height: 44px; padding: 0 .9rem; border: 1px solid var(--rh-n200); border-radius: var(--rh-radius); color: var(--rh-ink); font-size: 13px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; text-decoration: none !important; transition: var(--rh-fade); }
.rh-chapter__dl:hover, .rh-chapter__dl:focus-visible { border-color: var(--rh-ink); background: var(--rh-ink); color: #fff; }
.rh-chapter__dl .rh-ico { width: 18px; height: 18px; }
@media (max-width: 639px) { .rh-chapter { grid-template-columns: 1fr; } .rh-chapter__dl { grid-column: 1; grid-row: auto; justify-self: start; margin-top: .5rem; } }

/* Standards and safety links: two-line rows, the external mark trailing. */
.rh-links { display: grid; grid-template-columns: 1fr; border: 1px solid var(--rh-n200); border-radius: var(--rh-radius); background: #fff; }
@media (min-width: 900px) { .rh-links { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.rh-linkrow { border-top: 1px solid var(--rh-n100); margin-top: -1px; }
@media (min-width: 900px) { .rh .rh-linkrow:nth-child(odd) { border-right: 1px solid var(--rh-n100); } }
.rh-linkrow__a { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 72px; height: 100%; padding: 14px 20px; color: var(--rh-ink); text-decoration: none !important; transition: var(--rh-fade); }
.rh-linkrow__a:hover, .rh-linkrow__a:focus-visible { background: var(--rh-n50); color: var(--rh-blue); }
.rh-linkrow__text { display: flex; flex-direction: column; gap: .15rem; min-width: 0; }
.rh-linkrow__title { font-size: 16px; line-height: 23px; font-weight: 700; }
.rh-linkrow__host { font-size: 12px; line-height: 18px; letter-spacing: .04em; color: var(--rh-muted); }
.rh-linkrow__a .rh-ico, .rh-linkrow__arrow { color: var(--rh-blue); }

/* Glossary: native <details>, two columns where there is room. */
.rh-terms { display: grid; grid-template-columns: 1fr; gap: .5rem var(--rh-gap); align-items: start; }
@media (min-width: 900px) { .rh-terms { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.rh-term { border: 1px solid var(--rh-n200); border-radius: var(--rh-radius); background: #fff; }
.rh-term[open] { border-color: var(--rh-ink); }
.rh-term__name { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 52px; padding: 12px 16px; cursor: pointer; list-style: none; font-size: 17px; line-height: 24px; font-weight: 700; color: var(--rh-ink); }
.rh-term__name::-webkit-details-marker { display: none; }
.rh-term__name::marker { content: ""; }
.rh-term__name:hover { color: var(--rh-blue); }
.rh-term__name .rh-ico { color: var(--rh-blue); transition: transform .15s ease-out; }
.rh-term[open] > .rh-term__name .rh-ico { transform: rotate(180deg); }
.rh-term__def { padding: 0 16px 16px; font-size: 16px; line-height: 1.65; }
.rh-term__def > :first-child { margin-top: 0; }
.rh-term__def > :last-child { margin-bottom: 0; }
.rh-term__def a { color: var(--rh-blue); }

/* Videos: a card is a link to YouTube; the script plays it in the dialog instead. */
.rh-videos { display: grid; grid-template-columns: 1fr; gap: var(--rh-gap); }
@media (min-width: 640px)  { .rh-videos { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .rh-videos { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.rh-video__link { display: flex; flex-direction: column; gap: .35rem; height: 100%; border: 1px solid var(--rh-n200); border-radius: var(--rh-radius); background: #fff; color: var(--rh-ink); overflow: hidden; text-decoration: none !important; transition: var(--rh-fade); }
.rh-video__link:hover, .rh-video__link:focus-visible { border-color: var(--rh-blue); }
.rh-video__media { display: block; position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: var(--rh-ink); }
.rh-video__img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; }
.rh-video__play { position: absolute; left: 50%; top: 50%; display: inline-flex; align-items: center; justify-content: center; width: 56px; height: 56px; margin: -28px 0 0 -28px; border-radius: 50%; background: var(--rh-yellow); color: var(--rh-ink); }
.rh-video__play .rh-ico { width: 24px; height: 24px; margin-left: 3px; fill: currentColor; }
.rh-video__title { padding: 12px 16px 0; font-size: 17px; line-height: 24px; font-weight: 700; }
.rh-video__meta { padding: 0 16px 16px; margin-top: auto; font-size: 12px; line-height: 18px; letter-spacing: .06em; text-transform: uppercase; color: var(--rh-muted); }

.rh-dialog { width: min(960px, calc(100vw - 2rem)); max-width: none; padding: 0; border: 1px solid var(--rh-ink); border-radius: var(--rh-radius); background: var(--rh-ink); color: #fff; }
.rh-dialog::backdrop { background: rgba(7, 22, 38, .82); }
.rh-dialog__bar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 8px 8px 8px 16px; }
.rh-dialog__title { margin: 0; font-size: 16px; line-height: 22px; color: #fff; }
.rh-dialog__close { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 1px solid var(--rh-line); border-radius: var(--rh-radius); background: transparent; color: #fff; cursor: pointer; }
.rh-dialog__close:hover, .rh-dialog__close:focus-visible { border-color: #fff; }
.rh-dialog__frame { position: relative; aspect-ratio: 16 / 9; background: #000; }
.rh-dialog__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* ---- Closing band ------------------------------------------------------ */

.rh-band { background: var(--rh-ink); color: #fff; padding: clamp(2.5rem, 4.5vw, 4rem) 0; }
.rh-band__grid { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.25rem 3rem; }
.rh-band__heading { margin: 0 0 .4rem; color: #fff; font-size: clamp(24px, 2.4vw, 32px); line-height: 1.2; }
.rh-band__copy { margin: 0; max-width: 60ch; font-size: 17px; line-height: 1.6; color: rgba(255, 255, 255, .86); }
.rh-band__cta { margin: 0; }
.rh-band__cta .button { margin: 0; }

/* ---- Light version (html[data-theme="light"], the header toggle) -------- */

html[data-theme="light"] .rh-hero { background: #fff; color: var(--rh-ink); border-bottom: 1px solid var(--rh-n100); }
html[data-theme="light"] .rh-crumb { color: var(--rh-blue); }
html[data-theme="light"] .rh-hero__title { color: var(--rh-ink); }
html[data-theme="light"] .rh-hero__lead, html[data-theme="light"] .rh-search__hint { color: var(--rh-muted); }
html[data-theme="light"] .rh-search__label { color: var(--rh-ink); }
html[data-theme="light"] .rh .rh-search__input { border-color: var(--rh-n200); }
html[data-theme="light"] .rh .rh-search__input:focus { outline-color: var(--rh-blue); border-color: var(--rh-blue); }
html[data-theme="light"] .rh-chip { border-color: var(--rh-n200); color: var(--rh-ink); background: #fff; }
html[data-theme="light"] .rh-chip:hover, html[data-theme="light"] .rh-chip:focus-visible { border-color: var(--rh-blue); color: var(--rh-blue); }
html[data-theme="light"] .rh-chip.is-active { background: var(--rh-ink); border-color: var(--rh-ink); color: #fff; }
html[data-theme="light"] .rh-band { background: var(--rh-yellow); color: var(--rh-ink); }
html[data-theme="light"] .rh-band__heading { color: var(--rh-ink); }
html[data-theme="light"] .rh-band__copy { color: var(--ind-steel, #204368); }
html[data-theme="light"] .rh-band__cta .button { background: var(--rh-ink); border-color: var(--rh-ink); color: #fff; }   /* a yellow button cannot sit on the yellow band */

@media (prefers-reduced-motion: reduce) { .rh * { transition: none !important; } }

/* Brochures & guides from the downloads library (document cards, blocks/document-list/document-card.css). */
.rh-docs { gap: var(--rh-gap, 24px); }
.rh-doc { display: flex; }
.rh-doc > .dc { flex: 1 1 auto; }
@media (min-width: 1024px) { .rh-docs.dl-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }