/* Hero --------------------------------------------------------------- */

.pt-badge {
	display: inline-block;
	background: var(--pt-brand-100);
	color: var(--pt-brand-700);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.4px;
	text-transform: uppercase;
	padding: 5px 12px;
	border-radius: 999px;
	margin-bottom: 10px;
}

.pt-lede {
	font-size: 19px;
	line-height: 1.6;
	color: #3A4658;
	margin: 0 0 20px;
}

/* Call-to-action rows ------------------------------------------------ */

.pt-ctas {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 0 0 8px;
	padding: 0;
	list-style: none;
}

.pt-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 48px;
	padding: 12px 22px;
	border-radius: 10px;
	font-size: 16px;
	font-weight: 600;
	text-decoration: none;
	transition: background 0.15s ease, border-color 0.15s ease;
}

.pt-btn--primary { background: var(--pt-brand-700); color: #fff; }
.pt-btn--primary:hover { background: #2D4F8C; color: #fff; }

.pt-btn--ghost {
	background: #fff;
	color: var(--pt-brand-700);
	border: 1.5px solid var(--pt-brand-500);
}

.pt-btn--ghost:hover { background: var(--pt-brand-50); color: var(--pt-brand-700); }

/* Quick answers ------------------------------------------------------ */

.pt-quick {
	background: var(--pt-brand-50);
	border: 1px solid var(--pt-brand-100);
	border-radius: 18px;
	padding: 22px 24px;
	margin: 0;
	list-style: none;
	display: grid;
	gap: 12px;
}

.pt-quick li {
	margin: 0;
	padding-left: 26px;
	position: relative;
	font-size: 16.5px;
	line-height: 1.55;
	color: var(--pt-ink-600);
}

.pt-quick li::before {
	content: "";
	position: absolute;
	left: 4px;
	top: 9px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--pt-brand-500);
}

.pt-quick strong { color: var(--pt-ink-900); font-weight: 600; }

/* Weight table ------------------------------------------------------- */

/* Six columns of numbers do not fit a phone. Pounds and kilograms share a
   cell so the table stays at four columns and stays readable at 375px. */
.pt-table-wrap {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border: 1px solid #E2E7EF;
	border-radius: 14px;
	margin: 0 0 12px;
}

.pt-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 16px;
	font-variant-numeric: tabular-nums;
	min-width: 520px;
}

.pt-table caption {
	caption-side: top;
	text-align: left;
	padding: 14px 18px 0;
	font-size: 14.5px;
	color: var(--pt-ink-600);
}

.pt-table th,
.pt-table td {
	padding: 12px 18px;
	border-bottom: 1px solid #EDF1F7;
	text-align: right;
	white-space: nowrap;
}

.pt-table thead th {
	background: var(--pt-brand-50);
	color: var(--pt-ink-900);
	font-weight: 600;
	font-size: 14.5px;
	border-bottom: 1px solid #DCE4F0;
}

/* Age is a label, not a measurement, so it reads left while the numbers
   stay right-aligned and their digits line up down the column. */
.pt-table th:first-child,
.pt-table td:first-child {
	text-align: left;
	font-weight: 600;
	color: var(--pt-ink-900);
}

.pt-table tbody tr:last-child td { border-bottom: none; }
.pt-table tbody tr:nth-child(even) { background: #FAFCFF; }

.pt-table .pt-sub {
	display: block;
	font-size: 13.5px;
	font-weight: 400;
	color: var(--pt-ink-600);
}

/* Related breeds ----------------------------------------------------- */

.pt-related {
	display: grid;
	grid-template-columns: 1fr;
	gap: 14px;
	list-style: none;
	margin: 0;
	padding: 0;
}

@media (min-width: 620px) {
	.pt-related { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.pt-related li {
	margin: 0;
	background: #fff;
	border: 1px solid #E2E7EF;
	border-radius: 18px;
	padding: 18px;
}

.pt-related h3 {
	font-size: 17px;
	margin: 0 0 4px;
	line-height: 1.3;
}

.pt-related h3 a { color: var(--pt-ink-900); text-decoration: none; }
.pt-related h3 a:hover { color: var(--pt-brand-700); }

.pt-related p {
	font-size: 14.5px;
	color: var(--pt-ink-600);
	margin: 0 0 12px;
	font-variant-numeric: tabular-nums;
}

.pt-related .pt-mini {
	font-size: 14.5px;
	font-weight: 600;
	color: var(--pt-brand-700);
	text-decoration: none;
}

.pt-related .pt-mini:hover { text-decoration: underline; }

/* Next steps --------------------------------------------------------- */

.pt-next {
	display: grid;
	grid-template-columns: 1fr;
	gap: 14px;
	list-style: none;
	margin: 0;
	padding: 0;
}

@media (min-width: 620px) {
	.pt-next { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.pt-next li {
	margin: 0;
	border: 1px solid #E2E7EF;
	border-radius: 18px;
	transition: border-color 0.15s ease, transform 0.15s ease;
}

.pt-next li:hover { border-color: var(--pt-brand-500); transform: translateY(-2px); }

@media (prefers-reduced-motion: reduce) {
	.pt-next li { transition: none; }
	.pt-next li:hover { transform: none; }
}

.pt-next a {
	display: block;
	padding: 18px 20px;
	text-decoration: none;
	color: inherit;
}

.pt-next b {
	display: block;
	font-size: 16.5px;
	font-weight: 600;
	color: var(--pt-brand-700);
	margin-bottom: 4px;
}

.pt-next span {
	display: block;
	font-size: 14.5px;
	line-height: 1.5;
	color: var(--pt-ink-600);
}

/* Meta row ----------------------------------------------------------- */

.pt-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 14px;
	margin: 0 0 16px;
}

.pt-meta .pt-badge { margin-bottom: 0; }

.pt-updated {
	font-size: 14.5px;
	color: var(--pt-ink-600);
}

/* Size-class archive -------------------------------------------------- */

.pt-sizepage { margin-bottom: 2.5rem; }
.pt-sizepage .pt-table td:first-child { white-space: normal; }
.pt-sizepage .pt-table td:first-child a { color: var(--pt-brand-700); text-decoration: none; font-weight: 600; }
.pt-sizepage .pt-table td:first-child a:hover { text-decoration: underline; }
.pt-sizepage .pt-ctas { margin-top: 18px; }

.pt-sizepage h2 {
	font-size: clamp(22px, 2.6vw, 28px);
	margin: 2.25rem 0 0.6rem;
}

.pt-sizepage h2:first-of-type { margin-top: 1.75rem; }

.pt-sizepage p { margin: 0 0 1rem; }

.pt-src {
	font-size: 14.5px;
	color: var(--pt-ink-600);
	border-top: 1px solid var(--pt-line);
	padding-top: 14px;
	margin-top: 2rem;
}

.pt-src a { color: var(--pt-brand-700); }

/* Master chart: five classes across, so it needs more room than the others */
.pt-table--wide { min-width: 720px; }
.pt-table--wide th .pt-sub { font-weight: 400; }

/* Body condition scale */
.pt-bcs td:first-child { white-space: nowrap; }
.pt-bcs .pt-bcs-band { font-weight: 600; }
.pt-bcs tr.is-ideal { background: #DDF3E9; }
.pt-bcs tr.is-ideal td:first-child { color: #14663F; }