/* ===========================================================================
   SPONSOR PAGE
   Built from "Sponsor Page.dc.html", the signed-off Claude Design.

   LOADED ON THE SPONSOR PAGE ONLY. Everything is namespaced .atc-sp so it
   cannot leak, and because the page it replaces was Elementor-templated:
   content.css deliberately excludes that template, so this page has no
   article baseline underneath it and sets everything it needs.

   THE FORM IS A CROSS-ORIGIN IFRAME. Nothing here can reach inside HubSpot's
   fields. Only .atc-sp-form and its embed wrapper are ours. Do not add rules
   targeting HubSpot's internals; they will silently do nothing.

   The design is authored in inline styles at 1440px. Values are carried over
   as drawn, with tokens substituted where the token exists.
   =========================================================================== */

.atc-sp {
	background: var(--atc-white, #FFFFFF);
	color: var(--atc-black, #0A0A0A);
	font-family: var(--atc-font, "Poppins", -apple-system, sans-serif);
}
.atc-sp *,
.atc-sp *::before,
.atc-sp *::after { box-sizing: border-box; }

.atc-sp__inner { max-width: 1200px; margin: 0 auto; }

/* --- shared type ------------------------------------------------------- */
.atc-sp-eyebrow {
	margin: 0 0 30px;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}
.atc-sp-eyebrow--muted  { color: var(--atc-ink-500, #767676); }
.atc-sp-eyebrow--yellow { color: var(--atc-yellow, #FFE600); margin-bottom: 14px; }
.atc-sp-eyebrow--ink    { color: var(--atc-ink-700, #2E2E2E); margin-bottom: 12px; }

.atc-sp-h2 {
	margin: 0;
	font-size: 38px;
	font-weight: 800;
	line-height: 1.02;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	text-wrap: balance;
}
.atc-sp-h2--sm     { font-size: 32px; }
.atc-sp-h2--centre { text-align: center; margin-bottom: 36px; }
.atc-sp-h2--light  { color: var(--atc-white, #FFFFFF); font-size: 40px; margin-bottom: 18px; }

.atc-sp-body { margin: 0 0 18px; font-size: 19px; line-height: 1.6; color: var(--atc-ink-700, #2E2E2E); }
.atc-sp-body:last-child { margin-bottom: 0; }
.atc-sp-lede { margin: 0 0 18px; font-size: 19px; line-height: 1.6; color: var(--atc-ink-300, #CFCFCF); max-width: 56ch; }

.atc-sp-headrow { display: flex; align-items: flex-end; gap: 20px; margin-bottom: 26px; }
.atc-sp-headrow__icon { height: 56px; width: auto; display: block; }
.atc-sp-headrow--stack { align-items: flex-end; margin-bottom: 14px; }
.atc-sp-headrow--stack .atc-sp-headrow__icon { height: 52px; }
.atc-sp-headrow--stack .atc-sp-eyebrow { margin-bottom: 10px; color: var(--atc-ink-600, #565656); }

/* --- buttons ------------------------------------------------------------ */
.atc-sp-btn {
	display: inline-block;
	border-radius: 999px;
	padding: 18px 34px;
	font-size: 13px;
	font-weight: 800;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	text-decoration: none;
	line-height: 1;
	transition: transform 160ms var(--atc-ease, cubic-bezier(.22,1,.36,1));
}
.atc-sp-btn:hover, .atc-sp-btn:focus { transform: translateY(-2px); }
.atc-sp-btn:focus-visible { outline: 3px solid var(--atc-yellow, #FFE600); outline-offset: 3px; }
.atc-sp-btn--yellow { background: var(--atc-yellow, #FFE600); color: var(--atc-black, #0A0A0A); }
.atc-sp-btn--yellow:hover, .atc-sp-btn--yellow:focus { color: var(--atc-black, #0A0A0A); }
.atc-sp-btn--black  { background: var(--atc-black, #0A0A0A); color: var(--atc-white, #FFFFFF); padding: 19px 38px; }
.atc-sp-btn--black:hover, .atc-sp-btn--black:focus { color: var(--atc-white, #FFFFFF); }
.atc-sp-btn--ghost  { border: 2px solid var(--atc-white, #FFFFFF); color: var(--atc-white, #FFFFFF); padding: 16px 32px; }
.atc-sp-btn--ghost:hover, .atc-sp-btn--ghost:focus { color: var(--atc-white, #FFFFFF); }
.atc-sp-btn--sm { padding: 13px 22px; font-size: 12px; letter-spacing: 0.1em; }

/* --- hero --------------------------------------------------------------- */
.atc-sp-hero { background: var(--atc-black, #0A0A0A); padding: 64px 24px 72px; }
.atc-sp-hero__grid {
	display: grid;
	grid-template-columns: minmax(340px, 1.25fr) minmax(280px, 1fr);
	gap: 64px;
	align-items: start;
}
.atc-sp-hero__title {
	margin: 0 0 28px;
	font-size: 62px;
	font-weight: 800;
	line-height: 1.02;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	color: var(--atc-white, #FFFFFF);
	text-wrap: balance;
}
.atc-sp-hero__copy .atc-sp-lede:last-of-type { margin-bottom: 34px; }
.atc-sp-hero__actions { display: flex; gap: 14px; flex-wrap: wrap; }

.atc-sp-stats { border: 2px solid var(--atc-yellow, #FFE600); border-radius: 20px; padding: 32px; }
.atc-sp-stats .atc-sp-eyebrow { margin-bottom: 26px; }
.atc-sp-stats__list { display: flex; flex-direction: column; gap: 22px; margin: 0; }
.atc-sp-stats__rule { height: 2px; background: var(--atc-ink-700, #2E2E2E); }
.atc-sp-stats__value {
	margin: 0;
	font-size: 44px;
	font-weight: 800;
	line-height: 1;
	letter-spacing: -0.02em;
	color: var(--atc-white, #FFFFFF);
	font-variant-numeric: tabular-nums;
}
.atc-sp-stats__value.is-accent { color: var(--atc-yellow, #FFE600); }
.atc-sp-stats__label {
	margin: 8px 0 0;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--atc-ink-400, #A3A3A3);
}

/* --- who's listening ---------------------------------------------------- */
.atc-sp-audience { background: var(--atc-white, #FFFFFF); padding: 88px 24px; }
.atc-sp-audience__grid {
	display: grid;
	grid-template-columns: minmax(300px, 1fr) minmax(300px, 1fr);
	gap: 64px;
	align-items: start;
}
.atc-sp-proof { display: flex; flex-direction: column; gap: 18px; }
.atc-sp-proof__card {
	border: 2px solid var(--atc-black, #0A0A0A);
	border-radius: 18px;
	box-shadow: 6px 6px 0 0 var(--atc-yellow, #FFE600);
	padding: 26px;
}
.atc-sp-proof__head { margin: 0; display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; }
.atc-sp-proof__figure { font-size: 40px; font-weight: 800; line-height: 1; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.atc-sp-proof__label { font-size: 15px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.02em; }
.atc-sp-proof__note { margin: 12px 0 0; font-size: 16px; line-height: 1.5; color: var(--atc-ink-600, #565656); }

/* --- logo wall ---------------------------------------------------------- */
.atc-sp-wall { background: var(--atc-ink-100, #F2F2F2); padding: 70px 24px; }
.atc-sp-wall__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.atc-sp-wall__cell {
	min-height: 104px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 16px;
	text-decoration: none;
}
.atc-sp-wall__cell img { width: auto; max-width: 100%; object-fit: contain; display: block; }
.atc-sp-wall__cell--open {
	text-align: center;
	font-size: 13px;
	font-weight: 800;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	line-height: 1.3;
	border: 2px solid var(--atc-black, #0A0A0A);
	border-radius: 14px;
	color: var(--atc-black, #0A0A0A);
}
.atc-sp-wall__cell--open:hover, .atc-sp-wall__cell--open:focus {
	background: var(--atc-yellow, #FFE600);
	color: var(--atc-black, #0A0A0A);
}

/* --- how we work -------------------------------------------------------- */
.atc-sp-how { background: var(--atc-white, #FFFFFF); padding: 88px 24px; }
.atc-sp-how__grid {
	display: grid;
	grid-template-columns: minmax(300px, 1fr) minmax(300px, 1.1fr);
	gap: 64px;
	align-items: start;
}
.atc-sp-how__lead { margin: 0; font-size: 24px; font-weight: 800; text-transform: uppercase; line-height: 1.06; letter-spacing: -0.02em; }
.atc-sp-how .atc-sp-body { margin-bottom: 20px; }
.atc-sp-how .atc-sp-body + .atc-sp-body { margin-bottom: 28px; }
.atc-sp-plate {
	background: var(--atc-yellow, #FFE600);
	border: 2px solid var(--atc-black, #0A0A0A);
	border-radius: 18px;
	box-shadow: 8px 8px 0 0 var(--atc-black, #0A0A0A);
	padding: 26px;
}
.atc-sp-plate__text { margin: 0; font-size: 20px; font-weight: 800; text-transform: uppercase; line-height: 1.15; letter-spacing: -0.02em; }

/* --- one-off opportunities ---------------------------------------------- */
.atc-sp-oneoff { background: var(--atc-black, #0A0A0A); padding: 88px 24px; }
.atc-sp-oneoff__head { margin-bottom: 36px; }
.atc-sp-oneoff__head .atc-sp-lede { max-width: 60ch; margin-bottom: 0; }
.atc-sp-oneoff__list {
	list-style: none;
	margin: 0 0 22px;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
	gap: 0 56px;
	border-top: 2px solid var(--atc-ink-700, #2E2E2E);
}
.atc-sp-oneoff__row {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 20px;
	padding: 15px 0;
	border-bottom: 2px solid var(--atc-ink-700, #2E2E2E);
}
/* The design leaves the final row in each column without a rule. */
.atc-sp-oneoff__row:nth-last-child(-n+2) { border-bottom: 0; }
.atc-sp-oneoff__name {
	font-size: 18px;
	font-weight: 800;
	text-transform: uppercase;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: var(--atc-white, #FFFFFF);
}
.atc-sp-oneoff__name.is-accent { color: var(--atc-yellow, #FFE600); }
.atc-sp-oneoff__limit {
	flex: 0 0 auto;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--atc-ink-400, #A3A3A3);
}
.atc-sp-oneoff__note { font-size: 15px; line-height: 1.6; color: var(--atc-ink-400, #A3A3A3); margin: 0 0 40px; max-width: 70ch; }
.atc-sp-oneoff__foot {
	border-top: 2px solid var(--atc-ink-700, #2E2E2E);
	padding-top: 34px;
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 32px;
	flex-wrap: wrap;
}
.atc-sp-oneoff__cta {
	margin: 0 0 18px;
	font-size: 22px;
	font-weight: 800;
	text-transform: uppercase;
	line-height: 1.1;
	letter-spacing: -0.02em;
	color: var(--atc-white, #FFFFFF);
}
.atc-sp-oneoff__links { display: flex; gap: 12px; flex-wrap: wrap; }

/* --- yearly partnerships ------------------------------------------------ */
.atc-sp-year { background: var(--atc-white, #FFFFFF); padding: 88px 24px; }
.atc-sp-year__lede { max-width: 62ch; margin-bottom: 40px; }
.atc-sp-year__grid {
	display: grid;
	grid-template-columns: minmax(300px, 1.1fr) minmax(280px, 1fr);
	gap: 28px;
	align-items: stretch;
}
.atc-sp-tier { border: 2px solid var(--atc-black, #0A0A0A); border-radius: 24px; padding: 38px; }
.atc-sp-tier--gold   { background: var(--atc-yellow, #FFE600); box-shadow: 12px 12px 0 0 var(--atc-black, #0A0A0A); }
.atc-sp-tier--silver { background: var(--atc-white, #FFFFFF); box-shadow: 12px 12px 0 0 var(--atc-yellow, #FFE600); }
.atc-sp-tier__head { margin: 0 0 22px; display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.atc-sp-tier__badge {
	background: var(--atc-black, #0A0A0A);
	color: var(--atc-yellow, #FFE600);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	padding: 8px 18px;
	border-radius: 999px;
}
.atc-sp-tier__badge--dark { color: var(--atc-white, #FFFFFF); }
.atc-sp-tier__count { font-size: 11px; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: var(--atc-ink-700, #2E2E2E); }
.atc-sp-tier--silver .atc-sp-tier__count { color: var(--atc-ink-600, #565656); }
.atc-sp-tier__title { margin: 0 0 18px; font-size: 32px; font-weight: 800; text-transform: uppercase; line-height: 1.05; letter-spacing: -0.02em; }
.atc-sp-tier__text { margin: 0 0 26px; font-size: 18px; line-height: 1.55; color: var(--atc-ink-700, #2E2E2E); }
.atc-sp-tier--silver .atc-sp-tier__text { color: var(--atc-ink-600, #565656); }
.atc-sp-tier__logos { display: flex; align-items: center; gap: 32px; flex-wrap: wrap; padding-top: 24px; border-top: 2px solid rgba(10, 10, 10, 0.2); }
.atc-sp-tier--silver .atc-sp-tier__logos { gap: 24px; border-top-color: var(--atc-ink-200, #E6E6E6); }
.atc-sp-tier__logos img { width: auto; display: block; }
.atc-sp-tier__foot { margin: 16px 0 0; font-size: 11px; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: var(--atc-ink-700, #2E2E2E); }
.atc-sp-tier--silver .atc-sp-tier__foot { color: var(--atc-ink-600, #565656); }
.atc-sp-year__cta { display: flex; justify-content: center; margin-top: 40px; }

/* --- questions ---------------------------------------------------------- */
.atc-sp-faq { background: var(--atc-ink-100, #F2F2F2); padding: 88px 24px; }
.atc-sp-faq .atc-sp-h2 { margin-bottom: 40px; }
.atc-sp-faq__list { display: flex; flex-direction: column; gap: 14px; max-width: 900px; }
.atc-sp-faq__item { background: var(--atc-white, #FFFFFF); border: 2px solid var(--atc-black, #0A0A0A); border-radius: 18px; overflow: hidden; }
.atc-sp-faq__summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 26px 28px; list-style: none; cursor: pointer; }
.atc-sp-faq__summary::-webkit-details-marker { display: none; }
.atc-sp-faq__summary:focus-visible { outline: 3px solid var(--atc-yellow, #FFE600); outline-offset: -3px; }
.atc-sp-faq__q { font-size: 22px; font-weight: 800; text-transform: uppercase; line-height: 1.15; letter-spacing: -0.02em; }
.atc-sp-faq__plus {
	flex: 0 0 34px;
	width: 34px;
	height: 34px;
	border-radius: 999px;
	background: var(--atc-yellow, #FFE600);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	font-weight: 800;
	line-height: 1;
	transition: transform 200ms var(--atc-ease, cubic-bezier(.22,1,.36,1));
}
.atc-sp-faq__item[open] .atc-sp-faq__plus { transform: rotate(45deg); }
.atc-sp-faq__a { padding: 0 28px 26px; }
.atc-sp-faq__a p { margin: 0; font-size: 17px; line-height: 1.6; color: var(--atc-ink-700, #2E2E2E); max-width: 70ch; }

/*
 * ANCHOR TARGETS CLEAR THE STICKY HEADER.
 *
 * The nav is sticky at every width, so an in-page jump otherwise lands with
 * the target's first line hidden underneath it. 104px matches the value the
 * episode contents list already uses, so the two behave the same.
 */
.atc-sp [id] { scroll-margin-top: 104px; }

/* --- enquire ------------------------------------------------------------ */
.atc-sp-enquire { background: var(--atc-black, #0A0A0A); padding: 88px 24px; }
.atc-sp-enquire__grid {
	display: grid;
	grid-template-columns: minmax(300px, 1fr) minmax(320px, 1fr);
	gap: 64px;
	align-items: start;
}
.atc-sp-enquire .atc-sp-h2--light { margin-bottom: 22px; }
.atc-sp-enquire .atc-sp-lede { max-width: 52ch; }
.atc-sp-enquire .atc-sp-lede:last-of-type { margin-bottom: 32px; }
.atc-sp-host { display: flex; align-items: center; gap: 18px; }
.atc-sp-host__photo { width: 76px; height: 76px; border-radius: 999px; object-fit: cover; object-position: top; background: var(--atc-yellow, #FFE600); display: block; }
.atc-sp-host__name { margin: 0; font-size: 20px; font-weight: 800; color: var(--atc-white, #FFFFFF); }
.atc-sp-host__role { margin: 5px 0 0; font-size: 11px; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: var(--atc-ink-400, #A3A3A3); }

.atc-sp-form { background: var(--atc-white, #FFFFFF); border-radius: 24px; padding: 36px; }
.atc-sp-form .atc-sp-eyebrow { color: var(--atc-ink-600, #565656); margin-bottom: 20px; }
/*
 * The embed is HubSpot's iframe. It sizes itself, so this only guarantees it
 * has room and never overflows the card. Do NOT set a fixed height: the form
 * grows when a validation message appears, and a fixed height would hide the
 * submit button with no error anywhere.
 */
.atc-sp-form__embed { min-height: 320px; }
/* Released once the frame reports a real height, so the success message is
   not followed by 300px of empty card. */
.atc-sp-form__embed.is-sized { min-height: 0; }
.atc-sp-form__embed iframe { max-width: 100% !important; }
.atc-sp-form__note { margin: 16px 0 0; font-size: 11px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: var(--atc-ink-500, #767676); text-align: center; }

/* --- tablet ------------------------------------------------------------- */
@media only screen and (max-width: 1024px) {
	.atc-sp-hero__grid,
	.atc-sp-audience__grid,
	.atc-sp-how__grid,
	.atc-sp-year__grid,
	.atc-sp-enquire__grid { grid-template-columns: 1fr; gap: 40px; }
	.atc-sp-hero__title { font-size: 48px; }
	.atc-sp-wall__grid { grid-template-columns: repeat(3, 1fr); }
	/* Single column, so only the true last row loses its rule. */
	.atc-sp-oneoff__row:nth-last-child(-n+2) { border-bottom: 2px solid var(--atc-ink-700, #2E2E2E); }
	.atc-sp-oneoff__row:last-child { border-bottom: 0; }
}

/* --- mobile, against the 390px artboards -------------------------------- */
@media only screen and (max-width: 767px) {
	.atc-sp-hero { padding: 24px 18px 30px; }
	.atc-sp-hero__title { font-size: 34px; margin-bottom: 20px; }
	.atc-sp-lede { font-size: 16px; }
	.atc-sp-hero__actions { flex-direction: column; gap: 10px; }
	.atc-sp-hero__actions .atc-sp-btn { text-align: center; padding: 17px; font-size: 12px; }

	/* The artboard puts the four stats in a 2x2 grid with no rules. */
	.atc-sp-stats { border-radius: 16px; padding: 20px; }
	.atc-sp-stats__list { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
	.atc-sp-stats__rule { display: none; }
	.atc-sp-stats__value { font-size: 28px; }
	.atc-sp-stats__label { font-size: 10px; letter-spacing: 0.1em; margin-top: 6px; }

	.atc-sp-audience,
	.atc-sp-how,
	.atc-sp-oneoff,
	.atc-sp-year,
	.atc-sp-faq,
	.atc-sp-enquire { padding: 40px 18px; }
	.atc-sp-wall { padding: 36px 18px; }

	.atc-sp-h2 { font-size: 28px; }
	.atc-sp-h2--light { font-size: 30px; }
	.atc-sp-h2--sm { font-size: 24px; }
	.atc-sp-body { font-size: 16px; }
	.atc-sp-headrow__icon { height: 42px; }
	.atc-sp-headrow--stack .atc-sp-headrow__icon { height: 40px; }

	.atc-sp-wall__grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
	.atc-sp-wall__cell { min-height: 80px; padding: 10px; }

	.atc-sp-how__lead { font-size: 20px; }
	.atc-sp-plate { padding: 20px; box-shadow: 6px 6px 0 0 var(--atc-black, #0A0A0A); }
	.atc-sp-plate__text { font-size: 17px; }

	.atc-sp-oneoff__list { grid-template-columns: 1fr; gap: 0; }
	.atc-sp-oneoff__name { font-size: 16px; }
	.atc-sp-oneoff__foot { align-items: stretch; }
	.atc-sp-oneoff__links { flex-direction: column; }
	.atc-sp-oneoff__links .atc-sp-btn { text-align: center; }
	.atc-sp-oneoff__foot > .atc-sp-btn { text-align: center; }

	.atc-sp-tier { padding: 24px; border-radius: 18px; }
	.atc-sp-tier--gold   { box-shadow: 6px 6px 0 0 var(--atc-black, #0A0A0A); }
	.atc-sp-tier--silver { box-shadow: 6px 6px 0 0 var(--atc-yellow, #FFE600); }
	.atc-sp-tier__title { font-size: 24px; }
	.atc-sp-tier__text { font-size: 16px; }
	.atc-sp-year__cta .atc-sp-btn { width: 100%; text-align: center; }

	.atc-sp-faq__summary { padding: 20px; gap: 14px; }
	.atc-sp-faq__q { font-size: 18px; }
	.atc-sp-faq__a { padding: 0 20px 20px; }

	.atc-sp-form { padding: 22px; border-radius: 18px; }
}
