/* ==========================================================================
   DORIC · SECTION 13 — Footer
   ========================================================================== */

.d-footer {
	background: var(--d-obsidian);
	border-top: var(--d-hairline) solid var(--d-border);
	padding-block: var(--d-s9) var(--d-s7);
}

.d-footer__top {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 0;
}

.d-footer__brand { margin-bottom: var(--d-s7); }

/* ── The three link groups ──────────────────────────────────────────────────
   Collapsed rows, one under another, so the footer is a wordmark, three
   lines and the policies until someone asks for more. <details> does the
   work: it opens without script and stays open for print and find-in-page.
   ------------------------------------------------------------------------- */

.d-facc { border-top: var(--d-hairline) solid var(--d-border-faint); }

.d-facc__summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--d-s4);
	/* The row is the tap target; it needs no padding of its own to reach 44. */
	min-height: var(--d-tap);
	cursor: pointer;
	list-style: none;
}

.d-facc__summary::-webkit-details-marker { display: none; }
.d-facc__summary:hover .d-footer__coltitle { color: var(--d-text); }
.d-facc__summary .d-footer__coltitle { margin-bottom: 0; transition: color var(--d-dur-fast) var(--d-ease-out); }

/* A plus that becomes a minus. */
.d-facc__icon {
	position: relative;
	flex: none;
	width: 11px;
	height: 11px;
	color: var(--d-text-muted);
}

.d-facc__icon::before,
.d-facc__icon::after {
	content: '';
	position: absolute;
	inset-block: 50%;
	inset-inline: 0;
	border-top: var(--d-hairline) solid currentColor;
}

.d-facc__icon::after {
	transform: rotate(90deg);
	transition: transform var(--d-dur-base) var(--d-ease-out);
}

.d-facc[open] .d-facc__icon::after { transform: rotate(0deg); }
.d-facc__body { padding-bottom: var(--d-s4); }

/* The last row closes the stack. */
.d-facc:last-of-type { border-bottom: var(--d-hairline) solid var(--d-border-faint); }

.d-footer__statement {
	margin-top: var(--d-s4);
	max-width: 34ch;
	font-size: var(--d-fs-small);
	line-height: 1.7;
	color: var(--d-text-muted);
}

.d-footer__social {
	display: flex;
	gap: var(--d-s2);
	margin-top: var(--d-s6);
	margin-left: calc(var(--d-s3) * -1);
}

.d-footer__social a {
	display: grid;
	place-items: center;
	width: var(--d-tap);
	height: var(--d-tap);
	color: var(--d-text-muted);
	transition: color var(--d-dur-fast) var(--d-ease-out);
}

.d-footer__social a:hover { color: var(--d-accent); }

.d-footer__coltitle { margin-bottom: var(--d-s5); }
.d-footer__coltitle--sub { margin-top: var(--d-s8); }

.d-footer__col ul { display: grid; gap: var(--d-s1); }

.d-footer__col a,
.d-footer__col span {
	display: inline-flex;
	align-items: center;
	min-height: 30px;
	font-size: var(--d-fs-small);
	color: var(--d-text-muted);
	transition: color var(--d-dur-fast) var(--d-ease-out);
}

.d-footer__col a:hover { color: var(--d-text); }
.d-footer__contact span { color: var(--d-text-faint); }

/* ── Bottom bar ─────────────────────────────────────────────────────────── */

.d-footer__bottom {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: var(--d-s4) var(--d-s7);
	margin-top: var(--d-s11);
	padding-top: var(--d-s6);
	border-top: var(--d-hairline) solid var(--d-border-faint);
}

.d-footer__copy { font-size: var(--d-fs-small); color: var(--d-text-muted); }

.d-footer__legal { display: flex; flex-wrap: wrap; gap: var(--d-s3) var(--d-s7); }

.d-footer__legal a {
	display: inline-flex;
	align-items: center;
	min-height: 32px;
	font-size: var(--d-fs-small);
	color: var(--d-text-muted);
	transition: color var(--d-dur-fast) var(--d-ease-out);
}

.d-footer__legal a:hover { color: var(--d-text); }

/* ── Studio credit ──────────────────────────────────────────────────────────
   Its own line beneath the legal row, so it never competes with the copyright
   for space at mid widths. Deliberately the quietest type on the page: the
   label recedes and the name carries.
   ------------------------------------------------------------------------- */

.d-footer__credit {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--d-s2);
	margin-top: var(--d-s5);
	font-size: var(--d-fs-micro);
	letter-spacing: var(--d-ls-label);
	text-transform: uppercase;
	color: var(--d-text-muted);
}

.d-footer__creditname {
	color: var(--d-text-2);
	transition: color var(--d-dur-fast) var(--d-ease-out);
}

a.d-footer__creditname {
	display: inline-flex;
	align-items: center;
	min-height: 32px;
	border-bottom: var(--d-hairline) solid transparent;
}

a.d-footer__creditname:hover {
	color: var(--d-accent);
	border-bottom-color: currentColor;
}

/* ── Breakpoints ────────────────────────────────────────────────────────── */

@media (min-width: 768px) and (max-width: 1023px) {
	.d-footer { padding-block: var(--d-s11) var(--d-s9); }
}

@media (min-width: 1024px) {
	.d-footer { padding-block: var(--d-s12) var(--d-s9); }

	/* The wordmark on the left, the three rows stacked on the right. */
	.d-footer__top {
		grid-template-columns: 1.7fr minmax(0, 1fr);
		column-gap: clamp(48px, 8vw, 160px);
		row-gap: 0;
		align-items: start;
	}

	.d-footer__brand { grid-column: 1; grid-row: 1 / span 4; margin-bottom: 0; }
	.d-facc { grid-column: 2; }
}