/* Tripyana — Day Trips section (hub + trip pages).
   Claude, 29 Jul 2026.  Bump the filename on every edit and update the
   enqueue in mu-plugins/tripyana-trips-pages.php.  File is in optm-css_exc.

   Built on the site brand tokens (--tp-*) from tripyana-brand-v12.css.
   Logical properties only, so a single rule serves LTR and RTL.
   Prefix: tpt-  (tripyana trips)                                            */

.tpt {
	--tpt-cream: #f7f5ef;
	--tpt-gold: var(--tp-gold, #d4af37);
	--tpt-ink: var(--tp-emerald, #0c211a);
	--tpt-muted: var(--tp-muted, #4a5551);
	--tpt-line: var(--tp-line, #e7e3d7);
	--tpt-radius: var(--tp-radius, 1.25rem);
	color: var(--tpt-ink);
}

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

.tpt__wrap {
	max-width: var(--gb-container-width, 1200px);
	margin-inline: auto;
	padding-inline: clamp(1.1rem, 4vw, 2.5rem);
}

.tpt section { padding-block: clamp(2.6rem, 6vw, 4.4rem); }

/* ---- 1. Headings --------------------------------------------------------- */

.tpt__kicker {
	display: block;
	color: var(--tpt-gold);
	font-weight: 700;
	font-size: .9rem;
	letter-spacing: .06em;
	margin-block-end: .5rem;
}

.tpt__h2 {
	color: var(--tpt-ink);
	font-size: clamp(1.5rem, 3.2vw, 2.1rem);
	line-height: 1.3;
	margin-block: 0 .7rem;
}

.tpt__lede {
	color: var(--tpt-muted);
	font-size: 1.02rem;
	line-height: 1.9;
	max-width: 62ch;
	margin-block: 0 1.6rem;
}

.tpt__rule {
	inline-size: 5rem;
	block-size: .22rem;
	border-radius: 999px;
	background: linear-gradient(90deg, var(--tpt-gold), transparent);
	margin-block: 0 1.4rem;
}

/* ---- 2. Breadcrumb ------------------------------------------------------- */

.tpt-crumb {
	font-size: .87rem;
	color: var(--tpt-muted);
	padding-block: 1.1rem 0;
}
.tpt-crumb ol {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: .4rem .55rem;
	align-items: center;
}
.tpt-crumb a { color: var(--tpt-muted); text-decoration: none; }
.tpt-crumb a:hover { color: var(--tpt-gold); }
.tpt-crumb li + li::before {
	content: "›";
	margin-inline-end: .55rem;
	color: var(--tpt-line);
}
.tpt-crumb [aria-current="page"] { color: var(--tpt-ink); font-weight: 600; }

/* ---- 3. Hero ------------------------------------------------------------- */

.tpt-hero {
	background: var(--tpt-cream);
	border-block-end: 1px solid var(--tpt-line);
}
.tpt-hero h1 {
	color: var(--tpt-ink);
	font-size: clamp(1.75rem, 4.4vw, 2.7rem);
	line-height: 1.25;
	margin-block: 0 .9rem;
}
.tpt-hero__intro {
	color: var(--tpt-muted);
	font-size: 1.05rem;
	line-height: 1.95;
	max-width: 68ch;
	margin: 0;
}

/* ---- 4. Trust strip ------------------------------------------------------ */

.tpt-trust {
	background: #fff;
	border-block-end: 1px solid var(--tpt-line);
	padding-block: 1.1rem !important;
}
.tpt-trust__inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: .6rem 2rem;
}
.tpt-trust__item {
	display: inline-flex;
	align-items: center;
	gap: .55rem;
	font-size: .9rem;
	font-weight: 500;
	color: var(--tpt-ink);
}
.tpt-trust__item svg {
	flex: none;
	inline-size: 20px;
	block-size: 20px;
	stroke: var(--tpt-gold);
	fill: none;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}
@media (max-width: 700px) {
	.tpt-trust__inner {
		display: grid;
		grid-template-columns: 1fr;
		gap: .6rem;
		justify-items: start;
		max-inline-size: 24rem;
		margin-inline: auto;
	}
	.tpt-trust__item { align-items: flex-start; text-align: start; font-size: .86rem; line-height: 1.5; }
	.tpt-trust__item svg { margin-block-start: 1px; }
}

/* ---- 5. Trip cards ------------------------------------------------------- */

.tpt-group + .tpt-group { margin-block-start: 2.8rem; }

.tpt-group__title {
	display: flex;
	align-items: center;
	gap: .8rem;
	font-size: 1.15rem;
	font-weight: 700;
	color: var(--tpt-ink);
	margin-block: 0 1.3rem;
}
.tpt-group__title::after {
	content: "";
	flex: 1;
	block-size: 1px;
	background: var(--tpt-line);
}

.tpt-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
	gap: 1.5rem;
}

.tpt-card {
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid var(--tpt-line);
	border-radius: var(--tpt-radius);
	box-shadow: 0 8px 24px -14px rgba(12, 33, 26, .22);
	overflow: hidden;
	transition: transform .35s ease, box-shadow .35s ease;
}
.tpt-card:hover {
	transform: translateY(-6px);
	box-shadow: 0 26px 40px -20px rgba(12, 33, 26, .38), inset 0 3px 0 var(--tpt-gold);
}
.tpt-card--soon { opacity: .92; }
.tpt-card--soon:hover { transform: none; box-shadow: 0 8px 24px -14px rgba(12, 33, 26, .22); }

.tpt-card__media {
	position: relative;
	aspect-ratio: 4 / 3;
	background: var(--tpt-cream);
	overflow: hidden;
}
.tpt-card__media img {
	inline-size: 100%;
	block-size: 100%;
	object-fit: cover;
	display: block;
}

.tpt-badge {
	position: absolute;
	inset-block-start: .8rem;
	inset-inline-start: .8rem;
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	font-size: .76rem;
	font-weight: 700;
	padding: .34rem .7rem;
	border-radius: 999px;
	background: var(--tpt-ink);
	color: var(--tpt-gold);
}
.tpt-badge--soon { background: #6b6f6d; color: #fff; }

.tpt-card__body {
	display: flex;
	flex-direction: column;
	flex: 1;
	padding: 1.25rem 1.3rem 1.35rem;
}
.tpt-card__name {
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--tpt-ink);
	margin-block: 0 .5rem;
	line-height: 1.4;
}
.tpt-card__desc {
	color: var(--tpt-muted);
	font-size: .93rem;
	line-height: 1.8;
	margin-block: 0 .9rem;
}

.tpt-chips {
	display: flex;
	flex-wrap: wrap;
	gap: .4rem;
	margin-block-end: .9rem;
}
.tpt-chip {
	display: inline-flex;
	align-items: center;
	gap: .3rem;
	font-size: .78rem;
	font-weight: 600;
	color: var(--tpt-ink);
	background: var(--tpt-cream);
	border: 1px solid var(--tpt-line);
	border-radius: 999px;
	padding: .28rem .65rem;
}

.tpt-price {
	margin-block: auto 0;
	padding-block-start: .9rem;
	border-block-start: 1px dashed var(--tpt-line);
}
.tpt-price__row {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: .4rem;
}
.tpt-price__from { font-size: .82rem; color: var(--tpt-muted); }
.tpt-price__amount {
	font-size: 1.5rem;
	font-weight: 800;
	color: var(--tpt-ink);
	line-height: 1;
}
.tpt-price__unit { font-size: .84rem; color: var(--tpt-muted); }
.tpt-price__note {
	display: block;
	font-size: .8rem;
	color: var(--tpt-muted);
	margin-block-start: .3rem;
}
.tpt-price__cancel {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	font-size: .8rem;
	font-weight: 600;
	color: #1d6b4f;
	margin-block-start: .45rem;
}
.tpt-price__cancel svg {
	inline-size: 15px;
	block-size: 15px;
	flex: none;
	stroke: currentColor;
	fill: none;
	stroke-width: 2.2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.tpt-card__actions {
	display: flex;
	flex-wrap: wrap;
	gap: .55rem;
	margin-block-start: 1rem;
}
.tpt-card__actions .tp-btn { flex: 1 1 auto; }

.tpt-soon {
	display: block;
	font-size: .86rem;
	font-weight: 600;
	color: var(--tpt-muted);
	background: var(--tpt-cream);
	border: 1px dashed var(--tpt-line);
	border-radius: 999px;
	padding: .55rem .9rem;
	text-align: center;
	margin-block-start: 1rem;
}

/* ---- 6. Top picks -------------------------------------------------------- */

.tpt-pick { padding-block: 1.4rem; border-block-end: 1px solid var(--tpt-line); }
.tpt-pick:last-child { border-block-end: 0; }
.tpt-pick h3 {
	display: flex;
	align-items: center;
	gap: .6rem;
	font-size: 1.05rem;
	color: var(--tpt-ink);
	margin-block: 0 .5rem;
}
.tpt-pick__num {
	flex: none;
	inline-size: 1.9rem;
	block-size: 1.9rem;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: var(--tpt-ink);
	color: var(--tpt-gold);
	font-size: .85rem;
	font-weight: 700;
}
.tpt-pick p { color: var(--tpt-muted); line-height: 1.9; margin: 0; font-size: .96rem; }

/* ---- 7. Why Tripyana / comparison --------------------------------------- */

.tpt-why { background: var(--tpt-cream); }
.tpt-why__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 1.2rem;
	margin-block-end: 2rem;
}
.tpt-why__item {
	background: #fff;
	border: 1px solid var(--tpt-line);
	border-radius: var(--tpt-radius);
	padding: 1.2rem 1.25rem;
}
.tpt-why__item h3 {
	font-size: 1rem;
	color: var(--tpt-ink);
	margin-block: 0 .45rem;
}
.tpt-why__item p { font-size: .92rem; color: var(--tpt-muted); line-height: 1.8; margin: 0; }

.tpt-vs {
	inline-size: 100%;
	border-collapse: collapse;
	background: #fff;
	border: 1px solid var(--tpt-line);
	border-radius: var(--tpt-radius);
	overflow: hidden;
	font-size: .93rem;
}
.tpt-vs caption {
	caption-side: top;
	text-align: start;
	font-weight: 700;
	color: var(--tpt-ink);
	padding-block-end: .7rem;
}
.tpt-vs th,
.tpt-vs td {
	padding: .8rem .95rem;
	border-block-end: 1px solid var(--tpt-line);
	text-align: start;
	vertical-align: top;
}
.tpt-vs thead th { background: var(--tpt-ink); color: #fff; font-weight: 600; }
.tpt-vs thead th:first-child { color: var(--tpt-gold); }
.tpt-vs tbody th { font-weight: 600; color: var(--tpt-ink); inline-size: 34%; }
.tpt-vs tbody tr:last-child th,
.tpt-vs tbody tr:last-child td { border-block-end: 0; }
.tpt-vs__yes { color: #1d6b4f; font-weight: 600; }
.tpt-vs__no { color: #8a5b5b; }
.tpt-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* ---- 8. FAQ (native details/summary, tp-faq look) ----------------------- */

.tpt-faq__item {
	background: #fff;
	border: 1px solid var(--tpt-line);
	border-radius: var(--tpt-radius);
	margin-block-end: .7rem;
	overflow: hidden;
}
.tpt-faq__item[open] { box-shadow: 0 10px 26px -18px rgba(12, 33, 26, .32); }
.tpt-faq__item summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	cursor: pointer;
	list-style: none;
	padding: 1rem 1.2rem;
	font-weight: 700;
	color: var(--tpt-ink);
	font-size: .99rem;
	line-height: 1.6;
}
.tpt-faq__item summary::-webkit-details-marker { display: none; }
.tpt-faq__item summary::after {
	content: "";
	flex: none;
	inline-size: .62rem;
	block-size: .62rem;
	border-inline-end: 2px solid var(--tpt-gold);
	border-block-end: 2px solid var(--tpt-gold);
	transform: rotate(45deg);
	transition: transform .25s ease;
}
.tpt-faq__item[open] summary::after { transform: rotate(-135deg); }
.tpt-faq__body {
	padding: 0 1.2rem 1.15rem;
	color: var(--tpt-muted);
	line-height: 1.9;
	font-size: .95rem;
}
.tpt-faq__body a { color: var(--tpt-ink); text-decoration: underline; text-underline-offset: .18em; }
.tpt-faq__body a:hover { color: var(--tpt-gold); }

/* ---- 9. Trip page: price box -------------------------------------------- */

.tpt-pricebox {
	background: var(--tpt-ink);
	color: #fff;
	border-radius: var(--tpt-radius);
	padding: clamp(1.3rem, 3vw, 1.9rem);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1.2rem;
}
.tpt-pricebox__amount {
	font-size: clamp(1.8rem, 4vw, 2.4rem);
	font-weight: 800;
	color: var(--tpt-gold);
	line-height: 1;
	display: block;
}
.tpt-pricebox__from { font-size: .85rem; color: #cfd8d4; display: block; margin-block-end: .3rem; }
.tpt-pricebox__unit { font-size: .9rem; color: #cfd8d4; display: block; margin-block-start: .35rem; }
.tpt-pricebox__cancel {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	font-size: .86rem;
	font-weight: 600;
	color: #9fe0c0;
	margin-block-start: .55rem;
}
.tpt-pricebox__cancel svg {
	inline-size: 16px; block-size: 16px; flex: none;
	stroke: currentColor; fill: none; stroke-width: 2.2;
	stroke-linecap: round; stroke-linejoin: round;
}
.tpt-pricebox__actions { display: flex; flex-wrap: wrap; gap: .6rem; }

/* ---- 10. Highlights ------------------------------------------------------ */

.tpt-high {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(215px, 1fr));
	gap: .9rem;
	list-style: none;
	margin: 0;
	padding: 0;
}
.tpt-high li {
	display: flex;
	align-items: flex-start;
	gap: .6rem;
	background: #fff;
	border: 1px solid var(--tpt-line);
	border-radius: .9rem;
	padding: .85rem 1rem;
	font-size: .94rem;
	line-height: 1.65;
	color: var(--tpt-ink);
}
.tpt-high svg {
	flex: none;
	inline-size: 19px; block-size: 19px;
	margin-block-start: .12rem;
	stroke: var(--tpt-gold); fill: none;
	stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round;
}

/* ---- 11. Gallery --------------------------------------------------------- */

.tpt-gallery {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 1rem;
}
.tpt-gallery figure {
	margin: 0;
	border-radius: var(--tpt-radius);
	overflow: hidden;
	border: 1px solid var(--tpt-line);
	background: #fff;
}
.tpt-gallery img {
	inline-size: 100%;
	block-size: auto;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	display: block;
}
.tpt-gallery figcaption {
	font-size: .82rem;
	color: var(--tpt-muted);
	padding: .6rem .8rem .75rem;
	line-height: 1.6;
}

/* ---- 12. Itinerary ------------------------------------------------------- */

.tpt-itin { list-style: none; margin: 0; padding: 0; }
.tpt-itin li {
	position: relative;
	padding-inline-start: 2.4rem;
	padding-block-end: 1.5rem;
}
.tpt-itin li:last-child { padding-block-end: 0; }
.tpt-itin li::before {
	content: "";
	position: absolute;
	inset-block-start: .35rem;
	inset-inline-start: .48rem;
	inline-size: .72rem;
	block-size: .72rem;
	border-radius: 50%;
	background: var(--tpt-gold);
	box-shadow: 0 0 0 3px rgba(212, 175, 55, .22);
}
.tpt-itin li:not(:last-child)::after {
	content: "";
	position: absolute;
	inset-block-start: 1.3rem;
	inset-block-end: .1rem;
	inset-inline-start: .8rem;
	inline-size: 1px;
	background: var(--tpt-line);
}
.tpt-itin h3 { font-size: 1rem; color: var(--tpt-ink); margin-block: 0 .35rem; }
.tpt-itin p { font-size: .94rem; color: var(--tpt-muted); line-height: 1.85; margin: 0; }
.tpt-itin__opt {
	display: inline-block;
	font-size: .74rem;
	font-weight: 700;
	color: var(--tpt-ink);
	background: var(--tpt-cream);
	border: 1px solid var(--tpt-line);
	border-radius: 999px;
	padding: .16rem .55rem;
	margin-inline-start: .45rem;
	vertical-align: middle;
}

/* ---- 13. Included / not included ---------------------------------------- */

.tpt-incl {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
	gap: 1.2rem;
}
.tpt-incl__col {
	background: #fff;
	border: 1px solid var(--tpt-line);
	border-radius: var(--tpt-radius);
	padding: 1.2rem 1.3rem 1.3rem;
}
.tpt-incl__col h3 { font-size: 1rem; color: var(--tpt-ink); margin-block: 0 .8rem; }
.tpt-incl__col ul { list-style: none; margin: 0; padding: 0; }
.tpt-incl__col li {
	display: flex;
	align-items: flex-start;
	gap: .55rem;
	font-size: .93rem;
	line-height: 1.75;
	color: var(--tpt-muted);
	padding-block: .34rem;
}
.tpt-incl__col svg { flex: none; inline-size: 17px; block-size: 17px; margin-block-start: .2rem; fill: none; stroke-width: 2.3; stroke-linecap: round; stroke-linejoin: round; }
.tpt-incl--yes svg { stroke: #1d6b4f; }
.tpt-incl--no svg { stroke: #a06a6a; }

/* ---- 14. Know before you go --------------------------------------------- */

.tpt-know {
	background: #fffaf0;
	border: 1px solid #f0e0b8;
	border-radius: var(--tpt-radius);
	padding: 1.2rem 1.35rem 1.3rem;
}
.tpt-know h3 {
	display: flex; align-items: center; gap: .5rem;
	font-size: 1rem; color: var(--tpt-ink); margin-block: 0 .7rem;
}
.tpt-know h3 svg { inline-size: 20px; block-size: 20px; flex: none; stroke: #b8860b; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.tpt-know ul { margin: 0; padding-inline-start: 1.15rem; }
.tpt-know li { font-size: .94rem; line-height: 1.85; color: var(--tpt-muted); padding-block: .18rem; }
.tpt-know strong { color: var(--tpt-ink); }

/* ---- 15. Reviews (mirrors the homepage tgr- block, no star schema) ------ */

.tpt-rev__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 1.1rem;
}
.tpt-rev__card {
	background: #fff;
	border: 1px solid var(--tpt-line);
	border-radius: var(--tpt-radius);
	padding: 1.15rem 1.25rem 1.25rem;
	text-align: start;
}
.tpt-rev__head { display: flex; align-items: center; gap: .65rem; margin-block-end: .6rem; }
.tpt-rev__avatar {
	flex: none;
	inline-size: 2.3rem; block-size: 2.3rem;
	display: grid; place-items: center;
	border-radius: 50%;
	background: var(--tpt-ink);
	color: var(--tpt-gold);
	font-weight: 700;
}
.tpt-rev__name { font-weight: 700; color: var(--tpt-ink); font-size: .95rem; }
.tpt-rev__stars { color: #fbbc05; letter-spacing: .08em; font-size: .95rem; display: block; margin-block-end: .45rem; }
.tpt-rev__text { color: var(--tpt-muted); font-size: .93rem; line-height: 1.85; margin: 0; }
.tpt-rev__src {
	display: inline-flex; align-items: center; gap: .45rem;
	font-size: .84rem; color: var(--tpt-muted);
	margin-block-end: 1.2rem;
}

/* ---- 16. CTA band -------------------------------------------------------- */

.tpt-cta {
	background: var(--tpt-ink);
	color: #fff;
	text-align: center;
}
.tpt-cta h2 { color: #fff; font-size: clamp(1.4rem, 3.2vw, 2rem); margin-block: 0 .7rem; }
.tpt-cta p { color: #cfd8d4; line-height: 1.9; max-width: 58ch; margin-inline: auto; margin-block: 0 1.4rem; }
.tpt-cta__actions { display: flex; flex-wrap: wrap; gap: .7rem; justify-content: center; }
.tpt-cta .tp-btn--outline { color: #fff; border-color: rgba(255,255,255,.55); }
.tpt-cta .tp-btn--outline:hover { background: #fff; color: var(--tpt-ink); }

/* ---- 17. Build-your-own strip ------------------------------------------- */

.tpt-diy {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1.2rem;
	background: var(--tpt-cream);
	border: 1px solid var(--tpt-line);
	border-radius: var(--tpt-radius);
	padding: clamp(1.2rem, 3vw, 1.8rem);
}
.tpt-diy h2 { font-size: 1.2rem; color: var(--tpt-ink); margin-block: 0 .45rem; }
.tpt-diy p { color: var(--tpt-muted); font-size: .95rem; line-height: 1.8; margin: 0; max-width: 52ch; }

/* ---- 18. Booking form anchor -------------------------------------------- */

.tpt-book { background: var(--tpt-cream); }
.tpt-book__inner {
	background: #fff;
	border: 1px solid var(--tpt-line);
	border-radius: var(--tpt-radius);
	padding: clamp(1rem, 2.5vw, 1.6rem);
}

/* ---- 19. Outline buttons on dark backgrounds -----------------------------
   .tp-btn--outline is emerald-on-transparent by default, which disappears
   inside the emerald price box. Re-assert white on every dark surface here. */

.tpt-pricebox .tp-btn--outline,
.tpt-cta .tp-btn--outline {
	color: #fff;
	border-color: rgba(255, 255, 255, .6);
	background: transparent;
}
.tpt-pricebox .tp-btn--outline:hover,
.tpt-pricebox .tp-btn--outline:focus,
.tpt-cta .tp-btn--outline:hover,
.tpt-cta .tp-btn--outline:focus {
	background: #fff;
	color: var(--tpt-ink);
	border-color: #fff;
}

/* -------------------------------------------------------------------------
 * v3 — hero photograph and the image-credit line (29 Jul 2026)
 *
 * Every trip page now opens with a real photograph of its destination. The
 * figure sits below the intro text so the H1 stays the first thing read, and
 * uses the same 4/3 crop as the gallery and the cards.
 * ---------------------------------------------------------------------- */

.tpt-hero__media {
	margin: 1.6rem 0 0;
	border-radius: var(--tpt-radius, 10px);
	overflow: hidden;
	box-shadow: 0 10px 30px rgba(12, 33, 26, .13);
}
.tpt-hero__media img {
	display: block;
	inline-size: 100%;
	block-size: auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}
@media (max-width: 700px) {
	.tpt-hero__media { margin-block-start: 1.15rem; }
	.tpt-hero__media img { aspect-ratio: 4 / 3; }
}

/* Image credits — legally required for the CC BY / CC BY-SA photographs, so it
   stays visible, selectable and clickable. v4 (29 Jul 2026) makes it quieter
   while the Commons photos are still in place:

   - the site-wide rule `.entry-content p:not(.rank-math-breadcrumb p)` (0,2,2)
     was overriding the old `.tpt-credits p` (0,1,1) and rendering this line at
     17.5px. It scores (0,2,2) — :not() carries its argument specificity — so the
     selector below needs three classes to win outright. No !important used.
   - #878787 on white measures 3.59:1, above the 3:1 floor, with headroom for
     the cream background used elsewhere in the section stack.
   - no border, no background, no divider: the line reads as a footnote. */

.tpt .tpt-credits {
	/* beats the generic `.tpt section` clamp(2.6rem, 6vw, 4.4rem) — the
	   credit is a footnote, not a section, so it needs a small gap above and
	   enough below to clear the footer. */
	padding-block: 1.1rem 1.6rem;
}
.tpt .tpt-credits p.tpt-credits__line {
	margin: 0;
	color: #878787;
	font-size: .67rem;
	line-height: 1.65;
	letter-spacing: .1px;
}
.tpt .tpt-credits p.tpt-credits__line a {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 2px;
}
.tpt .tpt-credits p.tpt-credits__line a:hover,
.tpt .tpt-credits p.tpt-credits__line a:focus-visible {
	color: var(--tpt-ink, #0c211a);
}