/*
 * Jersey Bulls FC — Compliance hub + PolicyCard
 *
 * The /club/ compliance landing (13 Jun handover requirement): a dark editorial
 * grid of policy cards. Sharp + flat to match the Juve/PSG site language.
 *
 * Markup: previews/compliance.php, template-parts/card-policy.php · tokens: css/tokens.css
 */

/* ============================================================
 * Hub layout
 * ============================================================ */

.bulls-policy-hub {
	max-width: var(--content-full);
	margin: 0 auto;
	padding: var(--space-16) var(--gutter);
	color: var(--t-fg);
}
/* Desktop corner gutters — full-width containers carry their own inset on the
   site-wide fullscreen canvas. (.bulls-policy-page gets its own block below —
   the override must FOLLOW its base padding rule in source order.) */
@media (min-width: 1024px) {
	.bulls-policy-hub { padding-inline: clamp(72px, 7vw, 132px); }
}

.bulls-policy-hub__head {
	margin-bottom: var(--space-8);
	padding-bottom: var(--space-5);
	border-bottom: 1px solid var(--t-border-strong);
}

.bulls-policy-hub__kicker {
	margin: 0 0 var(--space-3);
	font-family: var(--ff-mono);
	font-size: var(--fs-50);
	letter-spacing: var(--ls-wider);
	text-transform: uppercase;
	color: var(--c-bulls-red-300);
}

.bulls-policy-hub__title {
	margin: 0;
	font-family: var(--ff-display);
	font-size: clamp(2.5rem, 6vw, 4.5rem);
	line-height: 0.92;
	letter-spacing: var(--ls-tight);
	text-transform: uppercase;
	color: var(--t-fg);
}

.bulls-policy-hub__lead {
	margin: var(--space-4) 0 0;
	max-width: 56ch;
	font-family: var(--ff-sans);
	font-size: var(--fs-200);
	line-height: var(--lh-base);
	color: var(--t-fg-muted);
}

/* ============================================================
 * Grid
 * ============================================================ */

.bulls-policy-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--space-2);
}

@media (max-width: 600px) {
	.bulls-policy-grid { grid-template-columns: 1fr; }
	.bulls-policy-hub { padding: var(--space-12) var(--gutter-sm); }
}

/* ============================================================
 * PolicyCard — dark flat tile, red baseline accent
 * ============================================================ */

.bulls-policy-card {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
	min-height: 220px;
	padding: var(--space-6);
	background: var(--t-panel);
	border: 1px solid var(--t-border);
	text-decoration: none;
	overflow: hidden;
	transition: background var(--motion-base) var(--ease-out), border-color var(--motion-base) var(--ease-out);
}

/* Thin red baseline — the single brand accent, grows on hover. */
.bulls-policy-card::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 3px;
	background: var(--c-bulls-red);
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform var(--motion-base) var(--ease-out);
}

.bulls-policy-card:hover,
.bulls-policy-card:focus-visible {
	background: var(--t-panel);
	border-color: var(--c-bulls-red);
	box-shadow: var(--shadow-lift);
}

.bulls-policy-card:hover::after,
.bulls-policy-card:focus-visible::after {
	transform: scaleX(1);
}

.bulls-policy-card:focus-visible {
	outline: 2px solid var(--c-focus-ring);
	outline-offset: 2px;
}

.bulls-policy-card__eyebrow {
	font-family: var(--ff-mono);
	font-size: var(--fs-50);
	letter-spacing: var(--ls-wider);
	text-transform: uppercase;
	color: var(--c-bulls-red-300);
}

.bulls-policy-card__title {
	margin: 0;
	font-family: var(--ff-display);
	font-size: var(--fs-500);
	line-height: var(--lh-snug);
	letter-spacing: var(--ls-snug);
	text-transform: uppercase;
	font-weight: var(--fw-bold);
	color: var(--t-fg);
}

.bulls-policy-card__blurb {
	margin: 0;
	font-family: var(--ff-sans);
	font-size: var(--fs-100);
	line-height: var(--lh-base);
	color: var(--t-fg-muted);
}

.bulls-policy-card__open {
	margin-top: auto;
	display: inline-flex;
	align-items: center;
	gap: var(--space-2);
	font-family: var(--ff-mono);
	font-size: var(--fs-50);
	letter-spacing: var(--ls-wide);
	text-transform: uppercase;
	color: var(--t-fg);
}

.bulls-policy-card__open span { transition: transform var(--motion-base) var(--ease-out); }
.bulls-policy-card:hover .bulls-policy-card__open span,
.bulls-policy-card:focus-visible .bulls-policy-card__open span { transform: translateX(4px); }

@media (prefers-reduced-motion: reduce) {
	.bulls-policy-card,
	.bulls-policy-card::after,
	.bulls-policy-card__open span { transition: none; }
}

/* ============================================================
 * Compliance / legal sub-page (PageHero + ToC + body + callout)
 * ============================================================ */

.bulls-policy-page {
	max-width: var(--content-full);
	margin: 0 auto;
	padding: var(--space-16) var(--gutter);
	color: var(--t-fg);
}
@media (min-width: 1024px) {
	.bulls-policy-page { padding-inline: clamp(72px, 7vw, 132px); }
}

.bulls-policy-page__hero {
	margin-bottom: var(--space-10);
	padding-bottom: var(--space-5);
	border-bottom: 1px solid var(--t-border-strong);
}

.bulls-policy-page__kicker {
	margin: 0 0 var(--space-3);
	font-family: var(--ff-mono);
	font-size: var(--fs-50);
	letter-spacing: var(--ls-wider);
	text-transform: uppercase;
	color: var(--c-bulls-red-300);
}

.bulls-policy-page__title {
	margin: 0;
	font-family: var(--ff-display);
	font-size: clamp(2.25rem, 5vw, 3.75rem);
	line-height: 0.95;
	letter-spacing: var(--ls-tight);
	text-transform: uppercase;
	color: var(--t-fg);
}

.bulls-policy-page__updated {
	margin: var(--space-4) 0 0;
	font-family: var(--ff-mono);
	font-size: var(--fs-50);
	letter-spacing: var(--ls-wide);
	text-transform: uppercase;
	color: var(--t-fg-muted);
}

.bulls-policy-page__grid {
	display: grid;
	grid-template-columns: 220px 1fr;
	gap: var(--space-10);
	align-items: start;
}

/* ----- "On this page" ToC ----- */

.bulls-policy-page__aside { position: sticky; top: var(--space-10); }

.bulls-policy-toc { border-left: 2px solid var(--t-border-strong); }

.bulls-policy-toc__head {
	padding: 0 0 var(--space-3) var(--space-4);
	font-family: var(--ff-mono);
	font-size: var(--fs-50);
	letter-spacing: var(--ls-wider);
	text-transform: uppercase;
	color: var(--c-bulls-red-300);
	list-style: none;
	cursor: default;
}
.bulls-policy-toc__head::-webkit-details-marker { display: none; }

.bulls-policy-toc__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
}

.bulls-policy-toc__list a {
	display: block;
	padding: var(--space-1) 0 var(--space-1) var(--space-4);
	margin-left: -2px;
	border-left: 2px solid transparent;
	font-family: var(--ff-sans);
	font-size: var(--fs-100);
	color: var(--t-fg-muted);
	text-decoration: none;
	transition: color var(--motion-fast) var(--ease-out), border-color var(--motion-fast) var(--ease-out);
}

.bulls-policy-toc__list a:hover,
.bulls-policy-toc__list a:focus-visible {
	color: var(--t-fg);
	border-left-color: var(--c-bulls-red);
}

/* ----- Body prose ----- */

.bulls-policy-page__body { max-width: 68ch; }

.bulls-policy-page__body h2 {
	margin: var(--space-8) 0 var(--space-3);
	font-family: var(--ff-display);
	font-size: var(--fs-500);
	line-height: var(--lh-snug);
	letter-spacing: var(--ls-snug);
	text-transform: uppercase;
	font-weight: var(--fw-bold);
	color: var(--t-fg);
	scroll-margin-top: var(--space-12);   /* clear the sticky header on anchor jump */
}
.bulls-policy-page__body h2:first-child { margin-top: 0; }

.bulls-policy-page__body p,
.bulls-policy-page__body li {
	font-family: var(--ff-sans);
	font-size: var(--fs-200);
	line-height: var(--lh-loose);
	color: var(--t-fg-body);
}

.bulls-policy-page__body p { margin: 0 0 var(--space-4); }
.bulls-policy-page__body ul { margin: 0 0 var(--space-4); padding-left: var(--space-5); }
.bulls-policy-page__body li { margin-bottom: var(--space-2); }
.bulls-policy-page__body strong { color: var(--t-fg); font-weight: var(--fw-semibold); }
.bulls-policy-page__body a { color: var(--c-bulls-red-300); text-decoration: underline; }
.bulls-policy-page__body a:hover { color: var(--t-fg); }

/* ----- Safeguarding callout ----- */

.bulls-policy-callout {
	margin-top: var(--space-12);
	padding: var(--space-6);
	background: var(--t-panel);
	border-left: 4px solid var(--c-bulls-red);
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--space-3);
}

.bulls-policy-callout__title {
	margin: 0;
	font-family: var(--ff-display);
	font-size: var(--fs-400);
	text-transform: uppercase;
	color: var(--t-fg);
}

.bulls-policy-callout__body {
	margin: 0;
	max-width: 60ch;
	font-family: var(--ff-sans);
	font-size: var(--fs-100);
	line-height: var(--lh-base);
	color: var(--t-fg-muted);
}

.bulls-policy-callout .bulls-cta-button { margin-top: var(--space-2); }

@media (max-width: 768px) {
	.bulls-policy-page__grid { grid-template-columns: 1fr; gap: var(--space-6); }
	/* ToC collapses to a disclosure on mobile (default open). */
	.bulls-policy-page__aside { position: static; }
	.bulls-policy-toc { border-left: 0; border-bottom: 1px solid var(--t-border-strong); padding-bottom: var(--space-3); }
	.bulls-policy-toc__head { cursor: pointer; padding-left: 0; }
	.bulls-policy-toc__head::-webkit-details-marker { display: inline; }
	.bulls-policy-toc__list a { padding-left: 0; border-left: 0; }
}