/* OwnEssays — Free Nursing Templates
   Scoped styles for the resource hub + its 6 resource pages.
   Everything is namespaced under .nt so the theme is never touched. */

.nt {
	--nt-navy: #0a1f4a;
	--nt-navy-2: #12306e;
	--nt-pink: #fb3568;
	--nt-blue: #1e63c8;
	--nt-green: #33853f;
	--nt-purple: #7b52d3;
	--nt-teal: #0d8578;
	--nt-rose: #c02a4d;
	--nt-amber: #f0a323;
	--nt-text: #4a5568;
	--nt-muted: #68778d;
	--nt-line: #e3eaf3;
	--nt-bg: #f6f9fc;
	--nt-radius: 14px;
	--nt-shadow: 0 2px 10px rgba(10, 31, 74, .06);
	--nt-shadow-flat: 0 1px 2px rgba(10, 31, 74, .04);
	--nt-shadow-lg: 0 14px 34px rgba(10, 31, 74, .12);

	/* vertical rhythm — one scale used by every section */
	--nt-gap: 24px;
	--nt-pad-x: 28px;
	--nt-pad-section: 56px;
	--nt-pad-hero: 52px;

	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	color: var(--nt-text);
	line-height: 1.5;
	font-size: 16px;
	-webkit-font-smoothing: antialiased;
}

/* full-bleed: escape the theme's fixed-width .container so section backgrounds
   span the viewport. 100vw ignores the scrollbar, so the page itself is clipped
   horizontally — scoped to this section only, via the body class. */
.nt-bleed {
	width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

/* `clip` and not `hidden`: hidden turns the body into a scroll container, which
   silently kills every position:sticky inside it. clip trims the 100vw bleed
   without that side effect. */
body.oe-nursing-templates { overflow-x: hidden; overflow-x: clip; }

/* the theme wraps the whole page in #page.site { overflow: hidden }, which is a
   scroll container and therefore kills sticky everywhere inside. `clip` trims
   exactly the same way without that side effect — scoped to these pages only. */
body.oe-nursing-templates #page.site { overflow: hidden; overflow: clip; }

/* the theme frames pages with its own padding + title bar; this section
   manages its own rhythm and starts flush under the site header */
body.oe-nursing-templates .page-title-bar { display: none; }
body.oe-nursing-templates #page-content { padding-top: 0; padding-bottom: 0; }
body.oe-nursing-templates .page-main-content > article { margin: 0; padding: 0; }

.nt-wrap {
	/* the site's home page runs its content out to ~1420px; 1160 looked narrow
	   next to it and squeezed the 4- and 5-across rows */
	max-width: 1400px;
	margin: 0 auto;
	padding: 0 var(--nt-pad-x);
}

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

.nt img { max-width: 100%; height: auto; display: block; }

.nt h1, .nt h2, .nt h3, .nt h4 {
	color: var(--nt-navy);
	margin: 0 0 .4em;
	line-height: 1.2;
	font-weight: 800;
}

.nt p { margin: 0 0 1em; }
.nt p:last-child { margin-bottom: 0; }

/* ---------- entrance animation ----------
   .nt-js is added by the script, so without JS everything is simply visible. */
.nt-js [data-nt-anim] {
	opacity: 0;
	transform: translateY(18px);
	transition: opacity .55s cubic-bezier(.22, .61, .36, 1), transform .55s cubic-bezier(.22, .61, .36, 1);
	transition-delay: var(--nt-delay, 0ms);
	will-change: opacity, transform;
}

.nt-js [data-nt-anim].nt-in {
	opacity: 1;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	.nt-js [data-nt-anim] {
		opacity: 1;
		transform: none;
		transition: none;
	}
	.nt * { animation: none !important; }
}

/* ---------- hero ---------- */
.nt-hero {
	background: linear-gradient(180deg, #f7fafd 0%, #eef4fb 100%);
	padding: var(--nt-pad-hero) 0 calc(var(--nt-pad-hero) + 8px);
}

.nt-hero__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 56px;
	align-items: center;
}

/* sized so "Nursing Templates" stays on one line inside the half-width column,
   as in the design; it drops to two lines only on narrow screens */
.nt-hero__title {
	font-size: clamp(34px, 3.9vw, 50px);
	letter-spacing: -.02em;
	margin-bottom: 20px;
	text-transform: uppercase;
}

.nt-hero__title span { display: block; }
.nt-hero__title .nt-hl { color: var(--nt-pink); }

.nt-hero__lead {
	font-size: clamp(18px, 2vw, 22px);
	font-weight: 700;
	color: var(--nt-navy-2);
	margin-bottom: 14px;
	line-height: 1.4;
}

.nt-hero__text { font-size: 17px; max-width: 30em; }

.nt-hero__media img {
	border-radius: var(--nt-radius);
	box-shadow: var(--nt-shadow-lg);
}

/* wide variant — used when the downloadable document is landscape, so the
   preview reads better full width than squeezed into a side column */
.nt-rhero__top {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 52px;
	align-items: center;
	margin-bottom: 44px;
}

.nt-rhero__top .nt-badges { margin-bottom: 0; }

/* full grid width, not a narrower centred block: sitting directly under the
   two-column row above, any inset reads as a misalignment rather than intent */
.nt-rhero__wide-media { max-width: none; margin: 0; }

@media (max-width: 860px) {
	.nt-rhero__top { grid-template-columns: 1fr; gap: 32px; margin-bottom: 32px; }
}

/* hero feature row */
.nt-features {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 26px;
	margin-top: 40px;
}

.nt-feature__ico {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 2px solid var(--nt-pink);
	color: var(--nt-pink);
	margin-bottom: 12px;
	transition: transform .25s ease, box-shadow .25s ease;
}

.nt-feature:hover .nt-feature__ico {
	transform: translateY(-3px);
	box-shadow: 0 8px 18px rgba(251, 53, 104, .22);
}

.nt-feature__ico svg { width: 20px; height: 20px; }
.nt-feature b { display: block; color: var(--nt-navy); font-size: 15px; }
.nt-feature span { font-size: 14px; color: var(--nt-muted); }

/* ---------- sections ---------- */
.nt-section { padding: var(--nt-pad-section) 0; }
.nt-section--alt { background: var(--nt-bg); }
.nt-section--tight { padding: calc(var(--nt-pad-section) - 16px) 0; }
/* consecutive related sections would otherwise stack both paddings */
.nt-section--flush { padding-top: 0; }

.nt-section__head {
	text-align: center;
	max-width: 44em;
	margin: 0 auto 48px;
}

.nt-h2 {
	font-size: clamp(26px, 3.4vw, 36px);
	display: inline-block;
	padding-bottom: 12px;
	position: relative;
	margin-bottom: 16px;
}

.nt-h2::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: 0;
	transform: translateX(-50%);
	width: 54px;
	height: 3px;
	border-radius: 2px;
	background: var(--nt-pink);
}

.nt-section__head p { font-size: 17px; line-height: 1.45; color: var(--nt-muted); }

/* ---------- resource cards ---------- */
.nt-cards {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--nt-gap);
}

.nt-cards--two {
	grid-template-columns: repeat(2, 1fr);
}

.nt-card {
	background: #fff;
	border: 1px solid var(--nt-line);
	border-radius: var(--nt-radius);
	box-shadow: var(--nt-shadow);
	padding: 24px 22px 22px;
	display: flex;
	flex-direction: column;
	position: relative;
	transition: box-shadow .25s ease, transform .25s ease, border-color .25s ease;
}

.nt-card:hover {
	box-shadow: var(--nt-shadow-lg);
	transform: translateY(-4px);
	border-color: #d3e0ef;
}

.nt-card__ico {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	position: absolute;
	top: -14px;
	left: 22px;
	box-shadow: 0 4px 10px rgba(10, 31, 74, .18);
	transition: transform .25s ease;
}

.nt-card:hover .nt-card__ico { transform: scale(1.08) rotate(-4deg); }
.nt-card__ico svg { width: 20px; height: 20px; }

.nt-card__thumb {
	border: 1px solid var(--nt-line);
	border-radius: 10px;
	overflow: hidden;
	margin: 16px 0 18px;
	background: #fff;
}

/* source renders differ in aspect ratio — crop to a common one so the row stays even */
.nt-card__thumb img {
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	transition: transform .5s cubic-bezier(.22, .61, .36, 1);
}

.nt-card:hover .nt-card__thumb img { transform: scale(1.04); }

.nt-card__title { font-size: 19px; margin-bottom: 10px; }
.nt-card__desc { font-size: 15px; color: var(--nt-muted); flex: 1 1 auto; margin-bottom: 20px; }

/* ---------- buttons ---------- */
.nt-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	font-weight: 700;
	font-size: 14px;
	letter-spacing: .02em;
	text-transform: uppercase;
	padding: 13px 18px;
	border-radius: 8px;
	border: 1.5px solid currentColor;
	text-decoration: none;
	background: #fff;
	transition: background .2s ease, color .2s ease, box-shadow .2s ease, transform .2s ease;
	width: 100%;
}

.nt-btn svg { width: 16px; height: 16px; flex: 0 0 auto; }
.nt-btn:hover { background: currentColor; text-decoration: none; transform: translateY(-1px); }
.nt-btn:hover span { color: #fff; }
.nt-btn:hover svg { stroke: #fff; color: #fff; }
.nt-btn:focus-visible { outline: 3px solid rgba(30, 99, 200, .35); outline-offset: 2px; }

.nt-btn--solid {
	background: var(--nt-pink);
	border-color: var(--nt-pink);
	color: #fff;
	width: auto;
	padding: 16px 30px;
	font-size: 15px;
	box-shadow: 0 6px 16px rgba(251, 53, 104, .28);
}

.nt-btn--solid:hover {
	background: #e02757;
	border-color: #e02757;
	box-shadow: 0 10px 24px rgba(251, 53, 104, .36);
	transform: translateY(-2px);
}

.nt-btn--solid span, .nt-btn--solid:hover span { color: #fff; }

/* colour variants */
.nt-c-pink   { color: var(--nt-pink); }
.nt-c-blue   { color: var(--nt-blue); }
.nt-c-green  { color: var(--nt-green); }
.nt-c-purple { color: var(--nt-purple); }
.nt-c-teal   { color: var(--nt-teal); }

.nt-bg-pink   { background: var(--nt-pink); }
.nt-bg-blue   { background: var(--nt-blue); }
.nt-bg-green  { background: var(--nt-green); }
.nt-bg-purple { background: var(--nt-purple); }
.nt-bg-teal   { background: var(--nt-teal); }

/* ---------- trust strip ---------- */
.nt-trust {
	background: #eef4fb;
	border: 1px solid var(--nt-line);
	border-radius: var(--nt-radius);
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0;
	overflow: hidden;
}

.nt-trust__item {
	display: flex;
	gap: 16px;
	padding: 26px 26px;
	border-right: 1px solid #dde7f3;
}

.nt-trust__item:last-child { border-right: 0; }
.nt-trust__item svg { width: 30px; height: 30px; flex: 0 0 auto; color: var(--nt-navy-2); }
.nt-trust__item b { display: block; color: var(--nt-navy); font-size: 15px; }
.nt-trust__item span { font-size: 14px; color: var(--nt-muted); }

/* ---------- bottom CTA band ---------- */
.nt-band {
	background: var(--nt-navy);
	color: #cdd8ea;
	padding: 42px 0;
}

.nt-band__grid {
	display: grid;
	grid-template-columns: 1fr 1.2fr auto;
	gap: 34px;
	align-items: center;
}

.nt-band__brand { color: #fff; font-size: 20px; font-weight: 800; }
.nt-band__brand span { display: block; font-size: 13px; font-weight: 400; color: #9fb0cc; }
.nt-band__note { font-size: 14px; line-height: 1.6; }
.nt-band__cta { text-align: center; }
.nt-band__cta small { display: block; margin-top: 10px; font-size: 12.5px; color: #9fb0cc; }

/* ---------- responsive ---------- */
@media (max-width: 1024px) {
	.nt { --nt-pad-section: 48px; --nt-pad-hero: 44px; }
	.nt-cards { grid-template-columns: repeat(2, 1fr); }
	.nt-band__grid { grid-template-columns: 1fr; text-align: center; }
	.nt-band__cta { text-align: center; }
}

@media (max-width: 860px) {
	.nt-hero__grid { grid-template-columns: 1fr; gap: 34px; }
	.nt-trust { grid-template-columns: 1fr; }
	.nt-trust__item { border-right: 0; border-bottom: 1px solid #dde7f3; }
	.nt-trust__item:last-child { border-bottom: 0; }
}

@media (max-width: 560px) {
	.nt { --nt-pad-section: 46px; --nt-pad-hero: 38px; --nt-gap: 18px; }
	.nt-cards, .nt-cards--two { grid-template-columns: 1fr; }
	.nt-features { grid-template-columns: 1fr; gap: 18px; }
	.nt-section__head { margin-bottom: 34px; }
	.nt { --nt-pad-x: 18px; }
}

/* =========================================================================
   RESOURCE PAGES (the six children of the hub)
   ========================================================================= */

.nt {
	/* SOAP colour system, fixed by the brief: S blue, O green, A orange, P purple */
	--nt-s: #1e63c8;
	--nt-o: #33853f;
	--nt-a: #ab6316;
	--nt-p: #7b52d3;
}

/* ---------- breadcrumbs ---------- */
.nt-crumbs {
	font-size: 14px;
	color: var(--nt-muted);
	padding: 18px 0 0;
}

/* the crumbs sit outside a bleed section, so the theme container would pin them
   to a narrower width than the content below — give them the same escape */
.nt-crumbs.nt-wrap {
	width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	max-width: 100vw;
	padding-left: max(var(--nt-pad-x), calc(50vw - 700px + var(--nt-pad-x)));
	padding-right: max(var(--nt-pad-x), calc(50vw - 700px + var(--nt-pad-x)));
}

.nt-crumbs a { color: var(--nt-blue); text-decoration: none; }
.nt-crumbs a:hover { text-decoration: underline; }
.nt-crumbs span { margin: 0 8px; opacity: .5; }

/* ---------- resource hero ---------- */
.nt-rhero { padding: 44px 0 var(--nt-pad-hero); }

.nt-rhero__grid {
	display: grid;
	grid-template-columns: 1.02fr 1fr;
	gap: 48px;
	align-items: stretch;
}

/* when the live document runs taller than the copy, the copy column sticks so
   the download stays in reach instead of leaving dead space beside the sheet */
@media (min-width: 861px) {
	.nt-rhero__grid > div:first-child {
		align-self: start;
		position: sticky;
		top: 96px;
	}
}

.nt-rhero__head { display: flex; gap: 20px; align-items: center; margin-bottom: 20px; }

.nt-rhero__ico {
	width: 74px;
	height: 74px;
	border-radius: 18px;
	background: #e8f0fb;
	color: var(--nt-blue);
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
}

.nt-rhero__ico svg { width: 34px; height: 34px; }
.nt-rhero h1 { font-size: clamp(27px, 3vw, 37px); margin: 0; letter-spacing: -.018em; line-height: 1.15; }
.nt-rhero__intro { font-size: 17px; line-height: 1.5; max-width: 34em; }

.nt-badges {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 14px;
	margin: 30px 0 34px;
}

.nt-badge { text-align: center; }

.nt-badge__ico {
	width: 46px;
	height: 46px;
	margin: 0 auto 8px;
	border-radius: 50%;
	border: 2px solid #cddcf0;
	color: var(--nt-blue);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform .25s ease, border-color .25s ease;
}

.nt-badge:hover .nt-badge__ico { transform: translateY(-3px); border-color: var(--nt-blue); }
.nt-badge b {
	display: block;
	font-size: 11px;
	letter-spacing: .03em;
	text-transform: uppercase;
	color: var(--nt-navy);
	font-weight: 700;
	line-height: 1.35;
	/* two lines' worth, so a one-line and a two-line label still line up */
	min-height: 2.7em;
}

/* ---------- download box ---------- */
.nt-dlbox {
	border: 1px solid var(--nt-line);
	border-radius: var(--nt-radius);
	background: #fff;
	box-shadow: var(--nt-shadow-flat);
	padding: 24px;
}

.nt-dlbox__title {
	font-size: 13px;
	letter-spacing: .06em;
	text-transform: uppercase;
	font-weight: 800;
	color: var(--nt-navy);
	margin-bottom: 16px;
}

.nt-dl {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 16px 18px;
	border-radius: 10px;
	text-decoration: none;
	color: #fff;
	margin-bottom: 12px;
	transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}

.nt-dl:hover { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(10, 31, 74, .18); filter: brightness(1.05); text-decoration: none; }
.nt-dl:last-of-type { margin-bottom: 0; }
.nt-dl--pdf { background: #1a4fa0; }
.nt-dl--word { background: #2e7d4f; }
.nt-dl__ico { width: 40px; height: 40px; border-radius: 8px; background: rgba(255, 255, 255, .18); display: flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.nt-dl__ico svg { width: 20px; height: 20px; color: #fff; }
.nt-dl__text { display: block; }
.nt-dl b { display: block; color: #fff; font-size: 16px; line-height: 1.25; }
/* NB: never use a bare `.nt-dl span` here — it also matches the icon span and
   beats .nt-dl__ico on specificity, which knocks the icon out of its centre. */
.nt-dl__sub { display: block; color: rgba(255, 255, 255, .82); font-size: 13px; }

/* "want everything" kit nudge */
.nt-kit {
	margin-top: 16px;
	border: 1px solid #f2e0b4;
	background: #fdf8ec;
	border-radius: 10px;
	padding: 16px 18px;
	display: flex;
	gap: 14px;
	align-items: flex-start;
}

.nt-kit svg { width: 26px; height: 26px; color: var(--nt-amber); flex: 0 0 auto; }
.nt-kit b { display: block; color: var(--nt-navy); font-size: 15px; }
.nt-kit p { font-size: 14px; color: #7a6534; margin: 2px 0 8px; }
.nt-kit a { color: var(--nt-blue); font-weight: 700; font-size: 14px; text-decoration: none; }
.nt-kit a:hover { text-decoration: underline; }

.nt-rhero__media img { border-radius: var(--nt-radius); box-shadow: var(--nt-shadow-lg); border: 1px solid var(--nt-line); }

/* the downloadable document itself, presented as a sheet of paper */
.nt-rhero__media .nt-sheet { max-width: 560px; margin-left: auto; }

.nt-sheet {
	background: #fff;
	border: 1px solid var(--nt-line);
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 18px 44px rgba(10, 31, 74, .16);
	transition: transform .3s ease, box-shadow .3s ease;
}

.nt-sheet:hover { transform: translateY(-3px); box-shadow: 0 24px 56px rgba(10, 31, 74, .2); }
.nt-sheet img { width: 100%; display: block; border: 0; border-radius: 0; box-shadow: none; }

/* ---------- S/O/A/P cards ---------- */
.nt-soap {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--nt-gap);
}

.nt-soap__card {
	background: #fff;
	border: 1px solid var(--nt-line);
	border-radius: 12px;
	padding: 24px 22px;
	transition: border-color .25s ease, box-shadow .25s ease;
	/* body copy runs to different lengths; let it stretch so the example box
	   (or list) sits on the same line in every card of the row */
	display: flex;
	flex-direction: column;
}

.nt-soap__card > p { flex: 1 1 auto; }
.nt-soap__card > .nt-list { flex: 1 1 auto; }

.nt-soap__card:hover { border-color: #d5e0ee; box-shadow: 0 6px 18px rgba(10, 31, 74, .06); }

.nt-soap__letter {
	width: 32px;
	height: 32px;
	line-height: 1;
	border-radius: 9px;
	background: var(--nt-c, var(--nt-blue));
	color: #fff;
	font-weight: 700;
	font-size: 15px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 12px;
}

.nt-soap__name { font-size: 15px; font-weight: 700; color: var(--nt-c, var(--nt-blue)); letter-spacing: .01em; margin-bottom: 2px; }
.nt-soap__sub { font-size: 13.5px; color: var(--nt-muted); margin-bottom: 14px; }
.nt-soap__card p { font-size: 14.5px; line-height: 1.5; }

.nt-soap__ex {
	margin-top: 16px;
	padding-top: 14px;
	border-top: 1px solid var(--nt-line);
	font-size: 13.5px;
	line-height: 1.5;
	color: var(--nt-muted);
}

/* the divider is a visible rule, so side-by-side cards need a common floor or
   it sits at a different height in each one; single-column needs no floor */
@media (min-width: 561px) {
	.nt-soap__ex { min-height: 118px; }
}

.nt-soap__ex b { display: block; color: var(--nt-c, var(--nt-blue)); font-size: 10.5px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; margin-bottom: 5px; }

/* tick / warn lists inside cards */
.nt-list { list-style: none; margin: 0 0 12px; padding: 0; }
.nt-list li { position: relative; padding-left: 24px; font-size: 14.5px; margin-bottom: 7px; }
.nt-list li::before { content: "✓"; position: absolute; left: 0; top: -1px; color: var(--nt-c, var(--nt-green)); font-weight: 800; }
.nt-list--box li::before { content: "☐"; color: var(--nt-c, var(--nt-blue)); font-weight: 400; }

.nt-hint {
	font-size: 13px;
	line-height: 1.5;
	padding: 0 0 0 13px;
	border-left: 2px solid currentColor;
	margin-top: 14px;
	/* the copy runs 2-3 lines depending on the section; a floor keeps every
	   tip block the same height so they line up across the four cards */
	min-height: 102px;
}
.nt-hint b { text-transform: uppercase; letter-spacing: .09em; font-size: 10.5px; font-weight: 700; display: block; margin-bottom: 3px; }
.nt-hint--tip { color: #2f7a4a; }
.nt-hint--warn { color: #a35c1c; }
.nt-hint span, .nt-hint { color: inherit; }

/* ---------- compact takeaway strip ----------
   Replaces the heavy two-column callout: the reference shows these as a light
   horizontal band of short ticks, which reads faster and repeats less. */
.nt-ticks {
	background: transparent;
	border: 1px solid var(--nt-line);
	border-radius: 12px;
	padding: 26px 28px;
}

.nt-ticks__head { display: flex; align-items: center; gap: 13px; margin-bottom: 18px; }

.nt-ticks__head span {
	width: 38px; height: 38px; flex: 0 0 auto;
	border-radius: 9px;
	background: var(--nt-amber);
	color: #fff;
	display: flex; align-items: center; justify-content: center;
}

.nt-ticks__head svg { width: 18px; height: 18px; }
.nt-ticks__head b { color: var(--nt-navy); font-size: 11px; text-transform: uppercase; letter-spacing: .1em; font-weight: 700; }

.nt-ticks ul {
	list-style: none; margin: 0; padding: 0;
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 18px 22px;
}

.nt-ticks li {
	position: relative;
	padding-left: 24px;
	font-size: 14px;
	line-height: 1.5;
	color: var(--nt-text);
}

.nt-ticks li::before {
	content: "✓";
	position: absolute; left: 0; top: -1px;
	color: var(--nt-amber);
	font-weight: 800;
}

@media (max-width: 1024px) { .nt-ticks ul { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 640px)  { .nt-ticks ul { grid-template-columns: 1fr; } .nt-ticks { padding: 20px 20px; } }

/* ---------- slim logic band ----------
   A second full callout box next to the takeaways looked repetitive; this is a
   quieter band that carries the same idea. */
.nt-logic { text-align: center; }
.nt-logic__label {
	font-size: 12px; letter-spacing: .09em; text-transform: uppercase;
	font-weight: 800; color: var(--nt-muted); margin-bottom: 16px;
}
.nt-logic p { max-width: 62ch; margin: 16px auto 0; font-size: 15px; line-height: 1.5; color: var(--nt-muted); }

/* ---------- wide CTA bar ---------- */
.nt-bar {
	display: grid;
	grid-template-columns: auto 1fr auto;
	gap: 22px;
	align-items: center;
	background: #fff;
	border: 1px solid var(--nt-line);
	border-radius: var(--nt-radius);
	box-shadow: var(--nt-shadow-flat);
	padding: 24px 28px;
	transition: box-shadow .25s ease, transform .25s ease;
}

.nt-bar:hover { box-shadow: var(--nt-shadow-lg); transform: translateY(-2px); }

/* quieter sibling: used next to a primary "next resource" card */
.nt-bar--soft { background: #f6f9fc; box-shadow: none; }
.nt-bar--soft:hover { background: #fff; box-shadow: var(--nt-shadow); }
.nt-bar__ico { width: 50px; height: 50px; border-radius: 13px; background: #f0ecfb; color: var(--nt-purple); display: flex; align-items: center; justify-content: center; }
.nt-bar__ico svg { width: 25px; height: 25px; }
.nt-bar b { display: block; color: var(--nt-navy); font-size: 17px; }
.nt-bar__desc { display: block; font-size: 14.5px; color: var(--nt-muted); }
.nt-bar .nt-bar__ico { color: var(--nt-purple); }
/* the compare bar and the next-resource card sit one above the other; a shared
   minimum keeps their buttons on the same left edge */
.nt-bar .nt-btn,
.nt-next .nt-btn { width: auto; white-space: nowrap; min-width: 238px; }

@media (max-width: 780px) { .nt-bar .nt-btn, .nt-next .nt-btn { min-width: 0; } }

@media (max-width: 780px) {
	.nt-bar { grid-template-columns: auto 1fr; }
	.nt-bar .nt-btn { grid-column: 1 / -1; width: 100%; }
}

/* ---------- connector arrows between SOAP cards ---------- */
@media (min-width: 1025px) {
	.nt-soap--flow .nt-soap__card { position: relative; }
	.nt-soap--flow .nt-soap__card::after {
		content: "";
		position: absolute;
		top: 44px;
		right: -16px;
		width: 9px; height: 9px;
		border-top: 2px solid #c6d4e6;
		border-right: 2px solid #c6d4e6;
		transform: rotate(45deg);
		z-index: 1;
	}
	.nt-soap--flow .nt-soap__card:last-child::after { display: none; }
}

/* ---------- two-up: what's inside / how to use it ---------- */
.nt-duo { display: grid; grid-template-columns: 1fr 1fr; gap: var(--nt-gap); align-items: start; }

.nt-panel {
	background: #fff;
	border: 1px solid var(--nt-line);
	border-radius: var(--nt-radius);
	padding: 26px 28px;
	height: 100%;
}

.nt-panel h3 {
	display: flex; align-items: center; gap: 10px;
	font-size: 11px; letter-spacing: .1em; text-transform: uppercase;
	color: var(--nt-muted); margin-bottom: 20px; font-weight: 700;
}

.nt-panel h3 span { display: none; }

/* the pair is equal height; spread the shorter list so neither panel ends
   with a block of dead space */
.nt-panel { display: flex; flex-direction: column; }

.nt-panel ul {
	list-style: none; margin: 0; padding: 0;
	flex: 1 1 auto;
	display: flex; flex-direction: column;
	justify-content: space-between;
	gap: 10px;
}

.nt-uses { flex: 1 1 auto; justify-content: space-between; }

.nt-panel li {
	position: relative; padding-left: 30px; margin-bottom: 12px;
	font-size: 15px; color: var(--nt-text);
}

.nt-panel li:last-child { margin-bottom: 0; }

.nt-panel li::before {
	content: "";
	position: absolute; left: 0; top: 3px;
	width: 18px; height: 18px; border-radius: 50%;
	background: var(--nt-blue);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/13px no-repeat, linear-gradient(#000,#000);
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/13px no-repeat;
}

/* three "use it to" rows with coloured icon discs */
.nt-uses { display: flex; flex-direction: column; gap: 18px; }
.nt-use { display: flex; gap: 15px; align-items: flex-start; }

.nt-use__ico {
	width: 44px; height: 44px; flex: 0 0 auto;
	border-radius: 50%;
	background: var(--nt-tint, #e8f0fb);
	color: var(--nt-c, var(--nt-blue));
	display: flex; align-items: center; justify-content: center;
	transition: transform .25s ease;
}

.nt-use:hover .nt-use__ico { transform: translateY(-3px) scale(1.05); }
.nt-use__ico svg { width: 20px; height: 20px; stroke-width: 2.05; }
.nt-use b { display: block; color: var(--nt-navy); font-size: 16px; }
.nt-use__desc { display: block; font-size: 14.5px; color: var(--nt-muted); }
/* raised specificity so a future `.nt-use span`-style rule cannot mute the icon */
.nt-use .nt-use__ico { color: var(--nt-c, var(--nt-blue)); }

@media (max-width: 860px) { .nt-duo { grid-template-columns: 1fr; } }

/* ---------- callouts ---------- */
.nt-callout {
	border-radius: var(--nt-radius);
	padding: 26px 28px;
	display: flex;
	gap: 18px;
	align-items: flex-start;
	border: 1px solid #f2e0b4;
	background: #fdf8ec;
}

.nt-callout--info { border-color: #cfe0f5; background: #eff5fd; }
.nt-callout__ico { width: 46px; height: 46px; border-radius: 50%; background: var(--nt-amber); color: #fff; display: flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.nt-callout--info .nt-callout__ico { background: var(--nt-blue); }
.nt-callout__ico svg { width: 22px; height: 22px; }
.nt-callout h3 { font-size: 17px; text-transform: uppercase; letter-spacing: .03em; margin-bottom: 12px; }
.nt-callout__cols { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 30px; }
.nt-callout .nt-list li::before { color: var(--nt-green); }

/* ---------- S + O -> A -> P flow ---------- */
.nt-flow {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 14px;
	flex-wrap: wrap;
	margin: 6px 0 14px;
}

.nt-flow__pill { border-radius: 999px; padding: 9px 20px; font-weight: 800; font-size: 14px; color: #fff; letter-spacing: .04em; }

/* even 4-up grid so definition pills never wrap 3 + 1 */
.nt-flow--grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 14px;
	max-width: 1000px;
	margin: 0 auto 4px;
	/* the flex variant centres items; in the grid they must stretch, or a pill
	   whose text wraps to two lines sits higher than its neighbours */
	align-items: stretch;
}

.nt-flow--grid .nt-flow__pill {
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 11px 14px;
	font-size: 13.5px;
	line-height: 1.35;
}

@media (max-width: 900px) { .nt-flow--grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .nt-flow--grid { grid-template-columns: 1fr; } }
.nt-flow__arrow { color: var(--nt-muted); font-size: 18px; }

/* ---------- numbered habits ---------- */
.nt-habits { display: grid; grid-template-columns: repeat(5, 1fr); gap: var(--nt-gap); counter-reset: nt-habit; }

.nt-habit {
	background: #fff;
	border: 1px solid var(--nt-line);
	border-radius: var(--nt-radius);
	padding: 22px 18px;
	box-shadow: var(--nt-shadow-flat);
	transition: transform .25s ease, box-shadow .25s ease;
}

.nt-habit:hover { transform: translateY(-3px); box-shadow: var(--nt-shadow-lg); }
.nt-habit__n { width: 38px; height: 38px; border-radius: 50%; background: var(--nt-pink); color: #fff; font-weight: 800; font-size: 19px; display: flex; align-items: center; justify-content: center; margin-bottom: 12px; }
.nt-habit b { display: block; color: var(--nt-navy); font-size: 15.5px; margin-bottom: 5px; }
.nt-habit span { font-size: 14px; color: var(--nt-muted); }

/* ---------- key/definition row ----------
   Long text inside a pill wrapped to two lines while its neighbours stayed on
   one, which read as broken; a letter chip plus wrapping text is stable. */
.nt-rules {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
}

.nt-rule {
	display: flex;
	align-items: center;
	gap: 13px;
	background: #fff;
	border: 1px solid var(--nt-line);
	border-left: 2px solid var(--nt-c, var(--nt-blue));
	border-radius: 12px;
	padding: 14px 16px;
	text-align: left;
	transition: box-shadow .25s ease;
}

.nt-rule:hover { box-shadow: 0 6px 18px rgba(10, 31, 74, .06); }

.nt-rule__k {
	width: 32px; height: 32px; flex: 0 0 auto;
	border-radius: 9px;
	background: var(--nt-c, var(--nt-blue));
	color: #fff;
	font-weight: 800; font-size: 15px; line-height: 1;
	display: flex; align-items: center; justify-content: center;
}

.nt-rule__t { font-size: 14px; color: var(--nt-text); line-height: 1.4; }

@media (max-width: 900px) { .nt-rules { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .nt-rules { grid-template-columns: 1fr; } }

/* ---------- numbered process flow ----------
   Rebuilt as live text: the supplied reference PNG had its captions overflowing
   the cards and colliding with each other, and a raster cannot be re-flowed. */
.nt-flowsteps {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 18px;
}

.nt-flowstep {
	position: relative;
	background: #fff;
	border: 1px solid var(--nt-line);
	border-radius: 12px;
	padding: 22px 20px;
	display: flex;
	flex-direction: column;
	transition: border-color .25s ease, box-shadow .25s ease;
}

.nt-flowstep:hover { border-color: #d5e0ee; box-shadow: 0 6px 18px rgba(10, 31, 74, .06); }

.nt-flowstep__head { display: flex; align-items: center; gap: 11px; margin-bottom: 12px; }

.nt-flowstep__n {
	width: 34px;
	height: 34px;
	flex: 0 0 auto;
	border-radius: 9px;
	background: var(--nt-c, var(--nt-blue));
	color: #fff;
	font-weight: 700;
	font-size: 14px;
	line-height: 1;
	display: flex;
	align-items: center;
	justify-content: center;
}

.nt-flowstep b {
	color: var(--nt-c, var(--nt-blue));
	font-size: 14.5px;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .04em;
	line-height: 1.2;
}

.nt-flowstep span.nt-flowstep__q { font-size: 14.5px; color: var(--nt-muted); }

/* connector chevrons, aligned with the number row */
@media (min-width: 1025px) {
	.nt-flowstep::after {
		content: "";
		position: absolute;
		top: 36px;
		right: -13px;
		width: 8px;
		height: 8px;
		border-top: 2px solid #c6d4e6;
		border-right: 2px solid #c6d4e6;
		transform: rotate(45deg);
	}
	.nt-flowstep:last-child::after { display: none; }
}

@media (max-width: 1024px) { .nt-flowsteps { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 640px)  { .nt-flowsteps { grid-template-columns: 1fr; } }

/* ---------- steps (assessment workflow / care plan) ---------- */
.nt-steps { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }

.nt-step {
	background: #fff;
	border: 1px solid var(--nt-line);
	border-radius: 12px;
	padding: 20px 18px;
	border-left: 2px solid var(--nt-c, var(--nt-teal));
	transition: border-color .25s ease, box-shadow .25s ease;
}

.nt-step:hover { box-shadow: 0 6px 18px rgba(10, 31, 74, .06); }

.nt-step b { display: block; color: var(--nt-navy); font-size: 15px; letter-spacing: .01em; margin-bottom: 6px; }
.nt-step span { font-size: 14px; color: var(--nt-muted); }

/* worked example: finding -> risk -> action -> follow-up */
.nt-chain { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--nt-gap); }

.nt-chain__item {
	background: #fff;
	border: 1px solid var(--nt-line);
	border-radius: 12px;
	padding: 20px;
	position: relative;
	transition: box-shadow .25s ease;
}

.nt-chain__item:hover { box-shadow: 0 6px 18px rgba(10, 31, 74, .06); }

.nt-chain__item b { display: block; font-size: 10.5px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: var(--nt-teal); margin-bottom: 9px; }
.nt-chain__item p { font-size: 14.5px; }

/* ---------- document rendered as live HTML ----------
   Replaces the flattened PDF-page image: real text (selectable, searchable,
   translatable, and sharp at any zoom) instead of a raster. */
.nt-doc {
	background: #fff;
	border: 1px solid var(--nt-line);
	border-radius: 14px;
	box-shadow: 0 18px 44px rgba(10, 31, 74, .10);
	overflow: hidden;
}

.nt-doc__head { text-align: center; padding: 30px 26px 22px; }
.nt-doc__head h2 { font-weight: 800; font-size: clamp(20px, 2.4vw, 27px); letter-spacing: .01em; margin-bottom: 6px; }
.nt-doc__head p { font-size: 15px; color: var(--nt-muted); }

/* the four-colour band */
.nt-doc__strip { display: grid; grid-template-columns: repeat(4, 1fr); }

.nt-doc__band {
	background: var(--nt-c);
	color: #fff;
	text-align: center;
	padding: 14px 12px 16px;
}

.nt-doc__band i { display: block; font-style: normal; font-weight: 700; font-size: 17px; line-height: 1; margin-bottom: 7px; }
.nt-doc__band b { display: block; font-size: 12.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; margin-bottom: 4px; }
.nt-doc__band span { display: block; font-size: 12.5px; line-height: 1.35; color: rgba(255, 255, 255, .9); }

/* the four quadrants */
.nt-doc__grid { display: grid; grid-template-columns: 1fr 1fr; }

.nt-doc__cell {
	padding: 22px 24px;
	border-right: 1px solid var(--nt-line);
	border-bottom: 1px solid var(--nt-line);
}

.nt-doc__cell:nth-child(2n) { border-right: 0; }
.nt-doc__cell:nth-last-child(-n+2) { border-bottom: 0; }

.nt-doc__title { display: flex; align-items: center; gap: 9px; margin-bottom: 10px; }

.nt-doc__title span {
	width: 22px; height: 22px; flex: 0 0 auto;
	border-radius: 6px;
	background: var(--nt-c);
	color: #fff;
	font-weight: 700; font-size: 12px; line-height: 1;
	display: flex; align-items: center; justify-content: center;
}

.nt-doc__title b { color: var(--nt-c); font-size: 14px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.nt-doc__q { font-size: 14px; font-weight: 700; color: var(--nt-navy); margin-bottom: 8px; }

.nt-doc__cell ul { list-style: none; margin: 0 0 12px; padding: 0; }
.nt-doc__cell li { position: relative; padding-left: 15px; font-size: 14px; line-height: 1.5; margin-bottom: 4px; }
.nt-doc__cell li::before { content: "•"; position: absolute; left: 2px; color: var(--nt-c); font-weight: 800; }

.nt-doc__ex, .nt-doc__warn { font-size: 13.5px; line-height: 1.45; margin-bottom: 7px; }
.nt-doc__ex { color: var(--nt-text); font-style: italic; }
.nt-doc__ex b { color: var(--nt-c); font-style: normal; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; font-size: 10.5px; margin-right: 5px; }
.nt-doc__warn { color: var(--nt-muted); }
.nt-doc__warn b { color: #c8452f; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; font-size: 10.5px; margin-right: 5px; }
.nt-doc__warn:last-child, .nt-doc__ex:last-child { margin-bottom: 0; }

@media (max-width: 780px) {
	.nt-doc__strip { grid-template-columns: repeat(2, 1fr); }
	.nt-doc__grid { grid-template-columns: 1fr; }
	.nt-doc__cell { border-right: 0; }
	.nt-doc__cell:nth-last-child(-n+2) { border-bottom: 1px solid var(--nt-line); }
	.nt-doc__cell:last-child { border-bottom: 0; }
}

/* compact variant: the document sitting in the hero column */
.nt-doc--compact {
	display: flex;
	flex-direction: column;
	height: 100%;
}

.nt-doc--compact .nt-doc__head { padding: 20px 20px 14px; }
.nt-doc--compact .nt-doc__head h2 { font-weight: 800; font-size: 21px; margin-bottom: 3px; }
.nt-doc--compact .nt-doc__head p { font-size: 13.5px; }
.nt-doc--compact .nt-doc__band { padding: 9px 7px 11px; }
.nt-doc--compact .nt-doc__band i { font-size: 14.5px; margin-bottom: 4px; }
.nt-doc--compact .nt-doc__band b { font-size: 11px; letter-spacing: .05em; margin-bottom: 2px; }
.nt-doc--compact .nt-doc__band span { font-size: 11px; line-height: 1.3; }

/* the quadrants absorb the remaining height, so nothing is left blank */
.nt-doc--compact .nt-doc__grid { flex: 1 1 auto; }
.nt-doc--compact .nt-doc__cell { padding: 13px 15px; display: flex; flex-direction: column; }
.nt-doc--compact .nt-doc__title { gap: 7px; margin-bottom: 7px; }
.nt-doc--compact .nt-doc__title span { width: 19px; height: 19px; border-radius: 5px; font-size: 10.5px; }
.nt-doc--compact .nt-doc__title b { font-size: 12.5px; letter-spacing: .04em; }
.nt-doc--compact .nt-doc__q { font-size: 12.5px; margin-bottom: 5px; }
.nt-doc--compact .nt-doc__cell ul { margin-bottom: 8px; }
.nt-doc--compact .nt-doc__cell li { font-size: 12.5px; line-height: 1.4; margin-bottom: 2px; padding-left: 12px; }
.nt-doc--compact .nt-doc__ex, .nt-doc--compact .nt-doc__warn { font-size: 12px; line-height: 1.35; margin-bottom: 5px; }
.nt-doc--compact .nt-doc__ex b, .nt-doc--compact .nt-doc__warn b { font-size: 10px; margin-right: 4px; }
.nt-doc--compact .nt-doc__warn { margin-top: auto; margin-bottom: 0; }

@media (max-width: 1100px) {
	.nt-doc--compact .nt-doc__cell li { font-size: 12px; }
}

/* ---------- printable form rendered as live HTML ----------
   Same job as .nt-doc but for the fill-in sheets: a meta row, then S/O/A/P
   sections with a coloured tab, field labels and either a ruled blank or the
   worked-example text. */
.nt-form {
	background: #fff;
	border: 1px solid var(--nt-line);
	border-radius: 14px;
	box-shadow: 0 18px 44px rgba(10, 31, 74, .10);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	height: 100%;
}

.nt-form__head { text-align: center; padding: 20px 22px 14px; border-bottom: 1px solid var(--nt-line); }
.nt-form__head h2 { font-size: 21px; letter-spacing: .01em; margin-bottom: 3px; }
.nt-form__head p { font-size: 13px; color: var(--nt-muted); }

.nt-form__meta {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 10px 16px;
	padding: 13px 20px;
	background: #fbfcfe;
	border-bottom: 1px solid var(--nt-line);
}

.nt-form__meta div { min-width: 0; }
.nt-form__meta b { display: block; font-size: 10.5px; letter-spacing: .07em; text-transform: uppercase; color: var(--nt-muted); margin-bottom: 3px; }
.nt-form__meta span { display: block; font-size: 13px; color: var(--nt-navy); }

/* the theme styles bare spans like form fields (30px tall, 12px radius), which
   turned these blanks into curved boxes — reset every box property explicitly
   and raise the specificity so the theme cannot win */
body.oe-nursing-templates .nt-blank {
	display: block;
	height: 13px;
	margin: 0;
	padding: 0;
	border: 0;
	border-bottom: 1px solid #d7e0ec;
	border-radius: 0;
	background: none;
	box-shadow: none;
	line-height: 1;
	min-height: 0;
}

.nt-form__sec { display: grid; grid-template-columns: 30px 1fr; border-bottom: 1px solid var(--nt-line); }
.nt-form__sec:last-child { border-bottom: 0; }
.nt-form__tab {
	background: var(--nt-c, var(--nt-blue));
	color: #fff;
	font-weight: 700;
	font-size: 14px;
	display: flex;
	align-items: flex-start;
	justify-content: center;
	padding-top: 12px;
}

.nt-form__body { padding: 11px 16px 13px; min-width: 0; }
.nt-form__sectitle { font-size: 12.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--nt-c, var(--nt-blue)); margin-bottom: 8px; display: flex; align-items: center; gap: 7px; }
.nt-form__sectitle > svg { width: 16px; height: 16px; flex: 0 0 auto; stroke-width: 1.9; }
.nt-form__sectitle b { font-weight: 700; }
.nt-form__sectitle i { font-style: normal; font-weight: 400; letter-spacing: .01em; text-transform: none; color: var(--nt-muted); font-size: 12.5px; }

.nt-form__f { margin-bottom: 9px; }
.nt-form__f:last-child { margin-bottom: 0; }
.nt-form__f b { display: block; font-size: 12.5px; font-weight: 700; color: var(--nt-navy); margin-bottom: 3px; line-height: 1.35; }
.nt-form__v { font-size: 13px; line-height: 1.45; color: var(--nt-text); margin: 0; }

/* the sections share the leftover height so the sheet fills its column */
.nt-form--fill .nt-form__sec { align-items: stretch; }
.nt-form--fill { justify-content: flex-start; }

@media (max-width: 620px) {
	.nt-form__meta { grid-template-columns: repeat(2, 1fr); }
	.nt-form__body { padding: 10px 13px 12px; }
	/* name and hint each wrap on a phone; let the hint take its own line
	   instead of running as a second ragged column beside the title */
	.nt-form__sectitle { flex-wrap: wrap; }
	.nt-form__sectitle i { flex: 1 1 100%; margin-left: 23px; }
}

/* ---------- checklist cards (2-up, per the section layout reference) ---------- */
.nt-checks { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--nt-gap); }

.nt-check {
	border: 1px solid var(--nt-line);
	border-radius: 12px;
	overflow: hidden;
	background: #fff;
	transition: box-shadow .25s ease;
}

.nt-check:hover { box-shadow: 0 6px 18px rgba(10, 31, 74, .06); }

.nt-check__head {
	display: flex;
	align-items: center;
	/* the hint carries flex-basis:100%, so it needs a wrap to drop onto its own
	   line under the name instead of squeezing the title into two columns */
	flex-wrap: wrap;
	gap: 4px 11px;
	padding: 13px 18px;
	background: var(--nt-tint, #f2f6fb);
	border-bottom: 1px solid var(--nt-line);
}

.nt-check__head span {
	width: 26px; height: 26px; flex: 0 0 auto;
	border-radius: 8px;
	background: var(--nt-c, var(--nt-blue));
	color: #fff;
	font-weight: 700; font-size: 13px; line-height: 1;
	display: flex; align-items: center; justify-content: center;
}

.nt-check__head b { color: var(--nt-c, var(--nt-blue)); font-size: 14px; letter-spacing: .04em; text-transform: uppercase; }

.nt-check ul { list-style: none; margin: 0; padding: 4px 18px 8px; }

.nt-check li {
	position: relative;
	padding: 11px 0 11px 27px;
	font-size: 14.5px;
	line-height: 1.45;
	border-bottom: 1px solid #eff3f8;
}

.nt-check li:last-child { border-bottom: 0; }

.nt-check li::before {
	content: "";
	position: absolute; left: 0; top: 13px;
	width: 15px; height: 15px;
	border: 1.5px solid #c3d1e2;
	border-radius: 4px;
}

/* the whole-note check spans the row */
/* the printed checklist pairs an outline icon with the letter chip and a hint */
.nt-check__head em { font-style: normal; display: flex; color: var(--nt-c); opacity: .85; }
.nt-check__head em svg { width: 19px; height: 19px; stroke-width: 1.7; }
.nt-check__head i {
	font-style: normal;
	font-weight: 400;
	text-transform: none;
	letter-spacing: .01em;
	color: var(--nt-muted);
	font-size: 12.5px;
	flex: 1 1 100%;
	margin-top: -2px;
}

.nt-check--wide { grid-column: 1 / -1; }
.nt-check--wide ul { columns: 2; column-gap: 44px; padding-bottom: 14px; }
.nt-check--wide li { break-inside: avoid; }

@media (max-width: 860px) { .nt-checks { grid-template-columns: 1fr; } .nt-check--wide ul { columns: 1; } }

/* ---------- document frames for the checklist and the table sheets ---------- */
.nt-docframe {
	background: #fff;
	border: 1px solid var(--nt-line);
	border-radius: 14px;
	box-shadow: 0 18px 44px rgba(10, 31, 74, .10);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	height: 100%;
}

.nt-docframe__head { text-align: center; padding: 20px 22px 14px; border-bottom: 1px solid var(--nt-line); }
.nt-docframe__head h2 { font-size: 21px; margin-bottom: 3px; }
.nt-docframe__head p { font-size: 13px; color: var(--nt-muted); }
.nt-docframe__body { padding: 16px; flex: 1 1 auto; }

/* the meta row sits flush between head and body, like the printed sheet's header */
.nt-docframe .nt-form__meta { border-top: 0; }
.nt-docframe__foot {
	padding: 12px 16px 14px;
	border-top: 1px solid var(--nt-line);
	background: #fbfcfe;
	font-size: 12.5px;
	line-height: 1.45;
	color: var(--nt-text);
}
.nt-docframe__foot { display: flex; align-items: flex-start; gap: 9px; }
.nt-docframe__foot b { color: var(--nt-navy); }
.nt-docframe__foot > svg { width: 16px; height: 16px; flex: 0 0 auto; color: var(--nt-teal); margin-top: 1px; }

/* inline choice fields (Priority: High / Moderate / Low) — a CSS box rather than
   the ☐ character, which does not render in every font the theme may fall back to */
.nt-opts { display: flex; flex-wrap: wrap; gap: 3px 13px; margin-top: 3px; }
.nt-opts span { position: relative; padding-left: 17px; font-size: 12.5px; line-height: 1.4; color: var(--nt-navy); }
.nt-opts span::before {
	content: "";
	position: absolute;
	left: 0;
	top: 2px;
	width: 12px;
	height: 12px;
	border: 1px solid #b9c8dc;
	border-radius: 3px;
	background: #fff;
}

/* fill-in fields inside a table cell need tighter rhythm than in a form sheet */
.nt-table .nt-form__f { margin-bottom: 10px; }
.nt-table .nt-form__f:last-child { margin-bottom: 0; }
.nt-table .nt-form__f b { font-size: 12px; }

/* checklist inside a document frame: tighter than the full-page version */
.nt-docframe .nt-checks { gap: 12px; height: 100%; }
.nt-docframe .nt-check { border-radius: 10px; }
.nt-docframe .nt-check__head { padding: 9px 13px; }
.nt-docframe .nt-check__head span { width: 22px; height: 22px; border-radius: 6px; font-size: 12px; }
.nt-docframe .nt-check__head b { font-size: 13px; }
.nt-docframe .nt-check ul { padding: 2px 13px 6px; }
.nt-docframe .nt-check li { padding: 7px 0 7px 22px; font-size: 12.5px; line-height: 1.35; }
.nt-docframe .nt-check li::before { top: 9px; width: 12px; height: 12px; border-radius: 3px; }

/* table inside a document frame */
.nt-docframe .nt-tablewrap { border: 0; border-radius: 0; }
.nt-docframe .nt-table { min-width: 760px; font-size: 13.5px; }
.nt-docframe .nt-table th { padding: 12px 13px; font-size: 11px; }
.nt-docframe .nt-table td { padding: 13px; }
.nt-docframe .nt-table li { font-size: 12.5px; line-height: 1.4; margin-bottom: 5px; }

@media (max-width: 860px) { .nt-docframe .nt-checks { grid-template-columns: 1fr; } }

/* ---------- labelled rows ----------
   Long labels ("Patient Profile & Current Concern") do not fit a 5-across card
   row; the reference lays them out as label + description rows instead. */
.nt-rows { display: flex; flex-direction: column; gap: 12px; }

.nt-row {
	display: grid;
	grid-template-columns: 260px 1fr;
	align-items: stretch;
	border: 1px solid var(--nt-line);
	border-radius: 12px;
	overflow: hidden;
	background: #fff;
	transition: box-shadow .25s ease;
}

.nt-row:hover { box-shadow: 0 6px 18px rgba(10, 31, 74, .06); }

.nt-row__label {
	display: flex;
	align-items: center;
	padding: 16px 20px;
	background: var(--nt-c, var(--nt-blue));
	color: #fff;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .07em;
	text-transform: uppercase;
	line-height: 1.35;
}

.nt-row__text { display: flex; align-items: center; padding: 16px 22px; font-size: 14.5px; color: var(--nt-text); }

/* neutral variant for the worked example */
.nt-rows--soft .nt-row__label { background: #f2f6fb; color: var(--nt-navy-2); }
.nt-rows--soft .nt-row { border-radius: 10px; }

@media (max-width: 720px) {
	.nt-row { grid-template-columns: 1fr; }
	.nt-row__label { padding: 12px 18px; }
	.nt-row__text { padding: 14px 18px; }
}

/* ---------- data table (worked example) ----------
   Wide content scrolls inside its own container so the page never does. */
.nt-tablewrap {
	overflow-x: auto;
	border: 1px solid var(--nt-line);
	border-radius: 12px;
	background: #fff;
	-webkit-overflow-scrolling: touch;
}

/* the theme centres every table cell; a fill-in sheet and a worked example
   both have to read left-aligned, so state it explicitly and outrank the theme */
body.oe-nursing-templates .nt-table td,
body.oe-nursing-templates .nt-table th { text-align: left; }

/* a th cannot become a flex container without breaking the table, so the icon
   stays inline and is nudged onto the cap height of the label */
.nt-table th svg { width: 14px; height: 14px; stroke-width: 1.9; display: inline-block; vertical-align: -3px; margin-right: 6px; }
.nt-docframe .nt-table th svg { width: 14px; height: 14px; vertical-align: -2px; margin-right: 5px; }

.nt-table {
	width: 100%;
	min-width: 900px;
	border-collapse: collapse;
	font-size: 13.5px;
	line-height: 1.5;
}

.nt-table th {
	text-align: left;
	vertical-align: bottom;
	padding: 16px 18px;
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: var(--nt-c, var(--nt-navy));
	border-bottom: 1px solid var(--nt-line);
	background: #fbfcfe;
	white-space: nowrap;
}

.nt-table td {
	vertical-align: top;
	padding: 18px;
	color: var(--nt-text);
	border-right: 1px solid var(--nt-line);
}

.nt-table td:last-child, .nt-table th:last-child { border-right: 0; }
.nt-table ul { list-style: none; margin: 0; padding: 0; }
.nt-table li { position: relative; padding-left: 15px; margin-bottom: 7px; }
.nt-table li:last-child { margin-bottom: 0; }
.nt-table li::before { content: "·"; position: absolute; left: 3px; top: -2px; font-weight: 800; color: var(--nt-muted); }

.nt-scrollhint { font-size: 12.5px; color: var(--nt-muted); margin-top: 10px; text-align: center; }
@media (min-width: 1000px) { .nt-scrollhint { display: none; } }

/* ---------- mistakes list (✗ instead of ✓) ---------- */
.nt-list--x li::before { content: "✕"; color: #c8452f; font-size: 12px; top: 1px; }

/* ---------- photo band ----------
   One full-bleed photograph per page, used to break up a document-heavy layout.
   The gradient runs horizontally so the picture stays visible on the right while
   the copy on the left keeps its contrast. All photos are CC0 — no credit line. */
.nt-photo {
	position: relative;
	min-height: 420px;
	display: flex;
	align-items: center;
	background: #0a1f4a;
	overflow: hidden;
}

.nt-photo picture, .nt-photo img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 46%;
}

.nt-photo::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(96deg, rgba(8, 25, 60, .94) 0%, rgba(8, 25, 60, .86) 30%,
		                       rgba(8, 25, 60, .52) 56%, rgba(8, 25, 60, .18) 78%, rgba(8, 25, 60, .06) 100%),
		linear-gradient(180deg, rgba(8, 25, 60, .18) 0%, rgba(8, 25, 60, 0) 40%);
}

.nt-photo__inner { position: relative; z-index: 1; width: 100%; padding: 46px 0; }
.nt-photo__text { max-width: 34rem; }

.nt-photo__label {
	display: flex;
	align-items: center;
	gap: 11px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: #a9c8ff;
	margin-bottom: 14px;
}

.nt-photo__label::before {
	content: "";
	width: 28px;
	height: 2px;
	background: var(--nt-pink);
	flex: 0 0 auto;
}

.nt-photo h2 {
	color: #fff;
	font-size: clamp(23px, 2.7vw, 33px);
	line-height: 1.22;
	letter-spacing: -.015em;
	margin: 0 0 12px;
}

.nt-photo p {
	color: rgba(255, 255, 255, .9);
	font-size: 16.5px;
	line-height: 1.55;
	margin: 0;
}

@media (max-width: 860px) {
	.nt-photo::after {
		background:
			linear-gradient(180deg, rgba(8, 25, 60, .35) 0%, rgba(8, 25, 60, .72) 46%, rgba(8, 25, 60, .93) 100%);
	}
	.nt-photo { min-height: 340px; align-items: flex-end; }
	.nt-photo__inner { padding: 34px 0 30px; }
	.nt-photo__text { max-width: none; }
	.nt-photo p { font-size: 15.5px; }
}

/* ---------- closing note band ---------- */
.nt-closing {
	display: flex;
	gap: 16px;
	align-items: flex-start;
	background: #eff5fd;
	border: 1px solid #cfe0f5;
	border-radius: 12px;
	padding: 22px 26px;
}

.nt-closing svg { width: 26px; height: 26px; flex: 0 0 auto; color: var(--nt-blue); }
.nt-closing b { display: block; color: var(--nt-navy); font-size: 16px; margin-bottom: 3px; }
.nt-closing span { font-size: 14.5px; color: var(--nt-muted); }

/* two-up: mistakes beside next-resource */
.nt-split { display: grid; grid-template-columns: 1fr 1fr; gap: var(--nt-gap); align-items: start; }
/* two short cards stacked against one tall one, so a half-empty column cannot
   leave a hole beside it */
.nt-stack { display: grid; gap: var(--nt-gap); align-content: start; }
@media (max-width: 860px) { .nt-split { grid-template-columns: 1fr; } }

/* ---------- next resource ---------- */
.nt-next {
	background: #fff;
	border: 1px solid var(--nt-line);
	border-radius: var(--nt-radius);
	box-shadow: var(--nt-shadow-flat);
	padding: 22px 26px;
	display: grid;
	grid-template-columns: auto 1fr auto;
	gap: 20px;
	align-items: center;
	transition: box-shadow .25s ease, transform .25s ease;
}

.nt-next:hover { box-shadow: var(--nt-shadow-lg); transform: translateY(-2px); }
.nt-next__ico { width: 48px; height: 48px; border-radius: 12px; background: #f0ecfb; color: var(--nt-purple); display: flex; align-items: center; justify-content: center; }
.nt-next__ico svg { width: 24px; height: 24px; }
.nt-next small { display: block; font-size: 12px; letter-spacing: .05em; text-transform: uppercase; color: var(--nt-purple); font-weight: 700; }
.nt-next b { display: block; font-size: 18px; color: var(--nt-navy); }
.nt-next__desc { display: block; font-size: 14.5px; color: var(--nt-muted); }
.nt-next .nt-next__ico { color: var(--nt-purple); }

/* pairs of "next" links side by side */
.nt-next-pair { display: grid; grid-template-columns: 1fr 1fr; gap: var(--nt-gap); }
.nt-next-pair .nt-next { grid-template-columns: auto 1fr; }
.nt-next-pair .nt-next .nt-btn { grid-column: 1 / -1; }

/* ---------- small disclaimer ---------- */
/* the disclaimer no longer gets a band of its own — it closes the section it
   sits in, so it needs its own separation from the block above */
.nt-note + *, * + .nt-note { margin-top: var(--nt-gap); }

.nt-note {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	font-size: 13.5px;
	color: var(--nt-muted);
	background: #f6f9fc;
	border: 1px solid var(--nt-line);
	border-radius: 10px;
	padding: 14px 18px;
}

.nt-note svg { width: 19px; height: 19px; flex: 0 0 auto; color: var(--nt-muted); margin-top: 1px; }

/* ---------- responsive (resource pages) ---------- */
@media (max-width: 1024px) {
	.nt-rhero__grid { grid-template-columns: 1fr; gap: 34px; }
	.nt-soap { grid-template-columns: repeat(2, 1fr); }
	.nt-habits { grid-template-columns: repeat(3, 1fr); }
	.nt-steps { grid-template-columns: repeat(3, 1fr); }
	.nt-chain { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 780px) {
	.nt-next { grid-template-columns: auto 1fr; }
	.nt-next .nt-btn { grid-column: 1 / -1; }
	.nt-next-pair { grid-template-columns: 1fr; }
	.nt-callout__cols { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
	.nt-soap, .nt-habits, .nt-steps, .nt-chain { grid-template-columns: 1fr; }
	.nt-badges { grid-template-columns: repeat(2, 1fr); }
	.nt-rhero { padding: 30px 0 var(--nt-pad-hero); }
	.nt-rhero__head { gap: 14px; }
	.nt-rhero__ico { width: 58px; height: 58px; border-radius: 15px; }
	.nt-callout { padding: 22px 20px; flex-direction: column; gap: 14px; }
}

/* ---------- icon system ----------
   All icons share a 24-unit viewBox, so a constant stroke-width renders at a
   different thickness for every icon size (1.33px at 16px, 2.5px at 30px).
   Normalise per size: stroke-width = 24 * 1.7 / rendered-size. */
.nt svg { stroke-width: 1.7; }
.nt-btn svg          { width: 16px; height: 16px; stroke-width: 2.55; }
.nt-badge__ico svg,
.nt-feature__ico svg,
.nt-card__ico svg,
.nt-dl__ico svg,
.nt-note svg         { width: 20px; height: 20px; stroke-width: 2.05; }
.nt-callout__ico svg { width: 22px; height: 22px; stroke-width: 1.85; }
.nt-next__ico svg    { width: 24px; height: 24px; stroke-width: 1.7; }
.nt-kit svg          { width: 26px; height: 26px; stroke-width: 1.57; }
.nt-trust__item svg  { width: 30px; height: 30px; stroke-width: 1.36; }
.nt-rhero__ico svg   { width: 34px; height: 34px; stroke-width: 1.2; }


/* ---------- care-plan sheet ----------
   HTML rendition of the client's infographic: a header band of badge groups, five
   colour-coded column cards (icon + name + purpose, numbered slots, a tinted
   footer strip each) and a full-width notes row. */
.nt-cpmeta {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 14px 26px;
	padding: 16px 20px;
	background: #fbfcfe;
	border-bottom: 1px solid var(--nt-line);
}

.nt-cpmeta__g { display: flex; align-items: center; gap: 14px; min-width: 0; }
.nt-cpmeta__g + .nt-cpmeta__g { border-left: 1px solid var(--nt-line); padding-left: 26px; }
.nt-cpmeta__g > i {
	flex: 0 0 auto;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--nt-teal);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
}
.nt-cpmeta__g > i svg { width: 21px; height: 21px; }
.nt-cpmeta__g > div { flex: 1 1 auto; min-width: 0; }
.nt-cpmeta__g p { display: flex; align-items: baseline; gap: 9px; margin: 0 0 7px; }
.nt-cpmeta__g p:last-child { margin-bottom: 0; }
.nt-cpmeta__g b { flex: 0 0 auto; font-size: 12px; font-weight: 700; color: var(--nt-navy); }
.nt-cpmeta__g .nt-blank { flex: 1 1 auto; }

.nt-cp {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 12px;
	padding: 16px;
}

.nt-cp__col {
	display: flex;
	flex-direction: column;
	border: 1px solid var(--nt-line);
	border-radius: 11px;
	overflow: hidden;
	background: #fff;
	min-width: 0;
}

.nt-cp__head {
	display: flex;
	gap: 10px;
	padding: 12px 13px;
	min-height: 78px;
	background: var(--nt-tint);
	border-bottom: 1px solid var(--nt-line);
}
.nt-cp__head > i { flex: 0 0 auto; color: var(--nt-c); }
.nt-cp__head > i svg { width: 24px; height: 24px; stroke-width: 1.7; }
.nt-cp__head b {
	display: block;
	color: var(--nt-c);
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	line-height: 1.25;
	margin-bottom: 3px;
}
.nt-cp__head em { display: block; font-style: italic; font-size: 12px; line-height: 1.35; color: var(--nt-text); }

.nt-cp__body { flex: 1 1 auto; padding: 12px 13px; }
.nt-cp__slot { padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px dashed #e1e8f2; }
.nt-cp__slot:last-child { border-bottom: 0; margin-bottom: 0; padding-bottom: 0; }
.nt-cp__slot b { display: block; font-size: 12px; font-weight: 700; color: var(--nt-navy); margin-bottom: 5px; line-height: 1.35; }

.nt-cp__foot { margin: 0 13px 13px; padding: 10px 12px; background: var(--nt-tint); border-radius: 9px; }
.nt-cp__foot p { display: flex; align-items: center; gap: 7px; margin: 0 0 7px; }
.nt-cp__foot svg { width: 15px; height: 15px; flex: 0 0 auto; color: var(--nt-c); stroke-width: 1.8; }
.nt-cp__foot b { font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--nt-c); line-height: 1.3; }
.nt-cp__foot .nt-blank { margin-bottom: 6px; }
.nt-cp__foot .nt-blank:last-child { margin-bottom: 0; }

.nt-cp__notes {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0 16px 16px;
	padding: 12px 16px;
	background: #f6f9fc;
	border: 1px solid var(--nt-line);
	border-radius: 10px;
}
.nt-cp__notes > i { flex: 0 0 auto; color: var(--nt-teal); display: flex; }
.nt-cp__notes > i svg { width: 22px; height: 22px; }
.nt-cp__notes > b { flex: 0 0 auto; font-size: 11.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--nt-teal); }
.nt-cp__notes > div { flex: 1 1 auto; }
.nt-cp__notes .nt-blank { margin-bottom: 8px; }
.nt-cp__notes .nt-blank:last-child { margin-bottom: 0; }

@media (max-width: 1100px) {
	.nt-cp { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 860px) {
	.nt-cpmeta { grid-template-columns: 1fr; }
	.nt-cpmeta__g + .nt-cpmeta__g { border-left: 0; padding-left: 0; border-top: 1px solid var(--nt-line); padding-top: 14px; }
	.nt-cp { grid-template-columns: 1fr; }
	.nt-cp__notes { flex-wrap: wrap; }
}


/* ---------- nursing assessment sheet ----------
   HTML rendition of the client's reference: a badge header band, seven numbered
   colour-coded cards, the twelve-row system table and the medication grid. */
.nt-afmeta {
	display: flex;
	gap: 16px;
	padding: 15px 18px;
	background: #fbfcfe;
	border-bottom: 1px solid var(--nt-line);
}
.nt-afmeta > i {
	flex: 0 0 auto;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background: var(--nt-s);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
}
.nt-afmeta > i svg { width: 22px; height: 22px; }
.nt-afmeta > div {
	flex: 1 1 auto;
	min-width: 0;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 9px 22px;
}
.nt-afmeta p { display: flex; align-items: baseline; gap: 8px; margin: 0; min-width: 0; }
.nt-afmeta b { flex: 0 0 auto; font-size: 11.5px; font-weight: 700; color: var(--nt-navy); white-space: nowrap; }
.nt-afmeta .nt-blank { flex: 1 1 auto; min-width: 40px; }
.nt-afmeta .nt-opts { flex: 1 1 auto; margin-top: 0; gap: 2px 10px; }
.nt-afmeta--wide { grid-column: span 2; }   /* gender keeps its three tick boxes on one line */

.nt-af__top, .nt-af__main, .nt-af__pair { display: grid; gap: 12px; }
.nt-af__top  { grid-template-columns: 1fr 1fr 1.15fr; padding: 14px 16px 0; }
.nt-af__main { grid-template-columns: 1.05fr 1fr; padding: 12px 16px; align-items: start; }
.nt-af__right { display: grid; gap: 12px; align-content: start; }
/* grid items default to min-width:auto, which lets the wide tables push the sheet
   past its frame — pin them to 0 so .nt-af__scroll does the scrolling instead */
.nt-af__top > *, .nt-af__main > *, .nt-af__pair > *, .nt-af__left, .nt-af__right { min-width: 0; }
.nt-af__pair { grid-template-columns: 1fr 1fr; }

.nt-af__card {
	display: flex;
	flex-direction: column;
	border: 1px solid var(--nt-line);
	border-radius: 11px;
	overflow: hidden;
	background: #fff;
	min-width: 0;
}
.nt-af__head {
	display: flex;
	align-items: center;
	gap: 9px;
	padding: 10px 13px;
	background: var(--nt-tint);
	border-bottom: 1px solid var(--nt-line);
}
.nt-af__head > i { flex: 0 0 auto; color: var(--nt-c); display: flex; }
.nt-af__head > i svg { width: 21px; height: 21px; }
.nt-af__head b {
	color: var(--nt-c);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	line-height: 1.25;
}
.nt-af__body { flex: 1 1 auto; padding: 11px 13px 13px; }
.nt-af__body > em { display: block; font-style: italic; font-size: 11.5px; line-height: 1.4; color: var(--nt-muted); margin-bottom: 9px; }
.nt-af__f { margin-bottom: 9px; }
.nt-af__f:last-child { margin-bottom: 0; }
.nt-af__f b { display: block; font-size: 11.5px; font-weight: 700; color: var(--nt-navy); margin-bottom: 4px; line-height: 1.35; }
.nt-af__f .nt-blank + .nt-blank { margin-top: 7px; }

.nt-af__checkgrid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 4px 10px; margin-bottom: 11px; }
.nt-af__checkgrid .nt-opts { display: block; margin: 0; }
.nt-af__checkgrid .nt-opts span { display: block; margin-bottom: 5px; }
.nt-af__risks .nt-opts { display: grid; grid-template-columns: 1fr 1fr; gap: 5px 10px; margin: 0 0 10px; }

/* the system table: an icon-led row per body system, findings and notes ruled */
.nt-af__scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.nt-af__sys, .nt-af__meds { width: 100%; border-collapse: collapse; }
.nt-af__sys { min-width: 380px; }
.nt-af__meds { min-width: 420px; }
/* the theme centres every table cell — these sheets must read left-aligned */
body.oe-nursing-templates .nt-af__sys th,
body.oe-nursing-templates .nt-af__sys td,
body.oe-nursing-templates .nt-af__meds th,
body.oe-nursing-templates .nt-af__meds td { text-align: left; }
.nt-af__sys thead th, .nt-af__meds thead th {
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .07em;
	text-transform: uppercase;
	color: var(--nt-c);
	text-align: left;
	padding: 6px 8px;
	background: color-mix(in srgb, var(--nt-tint) 60%, #fff);
	border-bottom: 1px solid var(--nt-line);
}
.nt-af__sys tbody th {
	display: flex;
	align-items: center;
	gap: 7px;
	font-size: 11.5px;
	font-weight: 700;
	color: var(--nt-navy);
	text-align: left;
	padding: 7px 8px;
	white-space: nowrap;
}
.nt-af__sys tbody th svg { width: 15px; height: 15px; flex: 0 0 auto; color: var(--nt-c); }
.nt-af__sys td, .nt-af__meds td { padding: 7px 8px; border-bottom: 1px solid #eef2f8; vertical-align: middle; }
.nt-af__sys tbody tr:last-child td, .nt-af__sys tbody tr:last-child th { border-bottom: 0; }
.nt-af__sys tbody th { border-bottom: 1px solid #eef2f8; }
.nt-af__sys td:nth-child(3) { width: 26%; }
.nt-af__sys td { font-size: 11px; white-space: nowrap; }
.nt-af__meds th, .nt-af__meds td { border-right: 1px solid #eef2f8; font-size: 11px; }
.nt-af__meds th:last-child, .nt-af__meds td:last-child { border-right: 0; }
.nt-af__meds td { height: 26px; }

.nt-af__important {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0 16px 16px;
	padding: 11px 15px;
	background: #fdf8ec;
	border: 1px solid #f3e3c4;
	border-radius: 10px;
	font-size: 12px;
	line-height: 1.45;
	color: var(--nt-text);
}
.nt-af__important > i { flex: 0 0 auto; color: var(--nt-a); display: flex; }
.nt-af__important > i svg { width: 21px; height: 21px; }
.nt-af__important span { flex: 1 1 auto; }
.nt-af__important b { color: var(--nt-navy); }
.nt-af__important p { display: flex; align-items: baseline; gap: 8px; margin: 0; flex: 0 0 150px; }
.nt-af__important p .nt-blank { flex: 1 1 auto; }

@media (max-width: 1100px) {
	.nt-af__top { grid-template-columns: 1fr 1fr; }
	.nt-af__main { grid-template-columns: 1fr; }
}
@media (max-width: 1100px) {
	.nt-afmeta > div { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 700px) {
	.nt-afmeta > div { grid-template-columns: 1fr; }
	.nt-af__top, .nt-af__pair { grid-template-columns: 1fr; }
	.nt-af__checkgrid { grid-template-columns: 1fr 1fr; }
	.nt-af__risks .nt-opts { grid-template-columns: 1fr; }
	.nt-afmeta { flex-wrap: wrap; }
}


/* ---------- rail sheets (quick guide, worked example) ----------
   A coloured rail carrying the letter, icon and section name, the body beside it
   and a boxed "Includes / Examples" column, as on the client's artwork. */
.nt-rails { display: flex; flex-direction: column; gap: 12px; padding: 16px; }

.nt-rail {
	display: grid;
	grid-template-columns: 104px 1fr minmax(180px, .62fr);
	border: 1px solid var(--nt-line);
	border-radius: 12px;
	overflow: hidden;
	background: #fff;
}
.nt-rail--med { grid-template-columns: 104px 1fr 84px minmax(170px, .58fr); }

.nt-rail__rail { background: var(--nt-c); color: #fff; text-align: center; padding: 14px 8px 12px; }
.nt-rail__rail > span { display: block; font-size: 34px; font-weight: 800; line-height: 1; }
.nt-rail__badge { margin-top: 10px; padding-top: 10px; border-top: 1px solid rgba(255, 255, 255, .35); }
.nt-rail__badge svg { width: 24px; height: 24px; margin: 0 auto 5px; display: block; }
.nt-rail__badge b { display: block; font-size: 10px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }

.nt-rail__main { padding: 14px 16px; min-width: 0; }
.nt-rail__main h3 { font-size: 13.5px; font-weight: 700; color: var(--nt-c); margin: 0 0 7px; }
.nt-rail__main p { font-size: 13px; line-height: 1.5; color: var(--nt-text); margin: 0; }
.nt-rail__main ul { list-style: none; margin: 0; padding: 0; }
.nt-rail__main li { position: relative; padding-left: 15px; font-size: 12.5px; line-height: 1.45; margin-bottom: 5px; color: var(--nt-text); }
.nt-rail__main li:last-child { margin-bottom: 0; }
.nt-rail__main li::before { content: ""; position: absolute; left: 2px; top: 7px; width: 5px; height: 5px; border-radius: 50%; background: var(--nt-c); }

.nt-rail__med { display: flex; align-items: center; justify-content: center; }
.nt-rail__med i { width: 54px; height: 54px; border-radius: 50%; background: var(--nt-tint); color: var(--nt-c); display: flex; align-items: center; justify-content: center; }
.nt-rail__med svg { width: 26px; height: 26px; }

.nt-rail__side { padding: 14px 16px; border-left: 1px solid var(--nt-line); min-width: 0; }
.nt-rail__side > b { display: block; font-size: 12.5px; font-weight: 700; color: var(--nt-c); margin-bottom: 7px; }
.nt-rail__side ul { list-style: none; margin: 0; padding: 0; }
.nt-rail__side li { position: relative; padding-left: 15px; font-size: 12.5px; line-height: 1.45; margin-bottom: 5px; color: var(--nt-text); }
.nt-rail__side li:last-child { margin-bottom: 0; }
.nt-rail__side li::before { content: ""; position: absolute; left: 2px; top: 7px; width: 5px; height: 5px; border-radius: 50%; background: var(--nt-c); }

.nt-rail__note {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 12px 16px;
	background: #fdf8ec;
	border: 1px solid #f3e3c4;
	border-radius: 10px;
	font-size: 12.5px;
	line-height: 1.5;
	color: var(--nt-text);
}
.nt-rail__note > i { flex: 0 0 auto; color: var(--nt-a); display: flex; }
.nt-rail__note svg { width: 20px; height: 20px; }
.nt-rail__note b { color: var(--nt-navy); }

@media (max-width: 900px) {
	.nt-rail, .nt-rail--med { grid-template-columns: 78px 1fr; }
	.nt-rail__med { display: none; }
	.nt-rail__side { grid-column: 2; border-left: 0; border-top: 1px solid var(--nt-line); padding-top: 11px; }
	.nt-rail__rail { grid-row: span 2; }
	.nt-rail__rail > span { font-size: 26px; }
}

/* ---------- blank SOAP sheet ----------
   Four field cards with a patient-information / vitals / follow-up rail beside
   them, mirroring the printed template. */
.nt-st__chips { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; padding: 16px 16px 0; }
.nt-st__chip { display: flex; align-items: center; gap: 9px; padding: 8px 12px; border-radius: 9px; background: var(--nt-c); color: #fff; }
.nt-st__chip > span { font-size: 19px; font-weight: 800; line-height: 1; }
.nt-st__chip b { font-size: 10.5px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }

.nt-st__grid { display: grid; grid-template-columns: 1fr minmax(220px, .42fr); gap: 12px; padding: 12px 16px; align-items: start; }
.nt-st__grid > * { min-width: 0; }
.nt-st__cards { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.nt-st__rail { display: grid; gap: 12px; align-content: start; }

.nt-st__card, .nt-st__side { border: 1px solid var(--nt-line); border-radius: 11px; overflow: hidden; background: #fff; min-width: 0; }
.nt-st__head, .nt-st__sidehead { display: flex; align-items: center; gap: 9px; padding: 9px 13px; background: var(--nt-tint); border-bottom: 1px solid var(--nt-line); color: var(--nt-c); }
.nt-st__head i, .nt-st__sidehead i { flex: 0 0 auto; display: flex; }
.nt-st__head svg, .nt-st__sidehead svg { width: 19px; height: 19px; }
.nt-st__head > span { font-size: 15px; font-weight: 800; line-height: 1; }
.nt-st__head b, .nt-st__sidehead b { font-size: 11.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }

.nt-st__list { list-style: none; margin: 0; padding: 11px 13px 13px; }
.nt-st__list li { margin-bottom: 9px; }
.nt-st__list li:last-child { margin-bottom: 0; }
.nt-st__list b { display: block; font-size: 11.5px; font-weight: 700; color: var(--nt-navy); margin-bottom: 4px; line-height: 1.35; }

.nt-st__fields { padding: 11px 13px 13px; }
.nt-st__fields p { display: flex; align-items: baseline; gap: 9px; margin: 0 0 9px; }
.nt-st__fields p:last-child { margin-bottom: 0; }
.nt-st__fields b { flex: 0 0 auto; font-size: 11.5px; font-weight: 700; color: var(--nt-navy); }
.nt-st__fields .nt-blank { flex: 1 1 auto; }

.nt-st__vitals { width: 100%; border-collapse: collapse; }
body.oe-nursing-templates .nt-st__vitals th,
body.oe-nursing-templates .nt-st__vitals td { text-align: left; }
.nt-st__vitals th { font-size: 11.5px; font-weight: 700; color: var(--nt-navy); padding: 7px 13px; white-space: nowrap; }
.nt-st__vitals td { padding: 7px 6px; border-bottom: 1px solid #eef2f8; }
.nt-st__vitals td:last-child { font-size: 10.5px; color: var(--nt-muted); padding-right: 13px; white-space: nowrap; width: 1%; }
.nt-st__vitals tr:last-child td { border-bottom: 0; }

.nt-st__fu { padding: 11px 13px 13px; }
.nt-st__fu p { display: flex; align-items: center; gap: 9px; margin: 0 0 9px; }
.nt-st__fu p:last-child { margin-bottom: 0; }
.nt-st__fu span { flex: 0 0 auto; width: 12px; height: 12px; border: 1px solid #b9c8dc; border-radius: 3px; background: #fff; }
.nt-st__fu .nt-blank { flex: 1 1 auto; }

.nt-st__notes { display: flex; align-items: center; gap: 12px; margin: 0 16px 16px; padding: 12px 15px; background: #f6f9fc; border: 1px solid var(--nt-line); border-radius: 10px; }
.nt-st__notes > i { flex: 0 0 auto; color: var(--nt-s); display: flex; }
.nt-st__notes svg { width: 20px; height: 20px; }
.nt-st__notes > b { flex: 0 0 auto; font-size: 11.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--nt-s); }
.nt-st__notes > div { flex: 1 1 auto; }
.nt-st__notes .nt-blank { margin-bottom: 8px; }
.nt-st__notes .nt-blank:last-child { margin-bottom: 0; }

@media (max-width: 1000px) {
	.nt-st__grid { grid-template-columns: 1fr; }
	.nt-st__rail { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 700px) {
	.nt-st__chips { grid-template-columns: 1fr 1fr; }
	.nt-st__cards, .nt-st__rail { grid-template-columns: 1fr; }
	.nt-st__notes { flex-wrap: wrap; }
}


/* ---------- horizontal scroll on phones ----------
   The theme's footer rows carry WPBakery's -15px gutters and stick out 15px past
   the viewport. Our pages swapped `overflow: hidden` for `overflow: clip` (hidden
   made a scroll container and killed every position: sticky), but `clip` on <body>
   is deliberately NOT propagated to the viewport the way `hidden` is — so the page
   could still be dragged sideways. Clip it at the footer instead: same containment,
   no scroll container anywhere near the sticky copy column. */
body.oe-nursing-templates .page-footer-wrapper {
	overflow-x: hidden;
	overflow-x: clip;
}