/*
 * Investor - Debenture Club.
 *
 * Read from cp-all-designer investor/debenture/debenture-club/ and
 * css/investor-debenture-club.css, over the tokens of css/app.css it uses:
 * --r 141 (14px), --r-lg 142 (20px), --sh-sm 159, --sh 160.
 *
 * The band and the head are the investor parent's, and so is the way a
 * question folds. Every measure a Style control states is stated on the
 * control for each tier, and not here.
 */

/* What a Style control names: each state's own colour. The rules below say which is showing. */
.custom-investor-debenture-club {
	--custom-club-rail: #F5F8FC;
	--custom-club-tab-ink: #475569;
	--custom-club-tab-lit-ink: #16418C;
	--custom-club-tab-lit: #FFFFFF;
	--custom-club-tab-on-ink: #FFFFFF;
	--custom-club-tab-on: #16418C;
	--custom-club-heading: #16418C;
	--custom-club-copy: #475569;
	--custom-club-rule: #EEF2F7;
	--custom-club-button: #16418C;
	--custom-club-button-lit: #0E1E54;
	--custom-club-button-ink: #FFFFFF;
	--custom-club-link: #3D8CB8;
	--custom-club-link-lit: #16418C;
	--custom-club-question: #F5F8FC;
	--custom-club-question-open: #FFFFFF;
	--custom-club-question-ink: #16418C;
	--custom-club-mark: #16418C;
	--custom-club-mark-open: #CE2929;
}

/* ------------------------------------------------------------------ */
/* The rail of tabs — investor-debenture-club.css:12-38                */
/* ------------------------------------------------------------------ */

.custom-investor-debenture-club .custom-investor-debenture-club__tabs {
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0;
}

.custom-investor-debenture-club .custom-investor-debenture-club__rail {
	display: flex;
	flex-wrap: wrap;
	box-sizing: border-box;
	width: fit-content;
	max-width: 100%;
	margin: 0 auto;
	border-radius: 1000px;
	background-color: var(--custom-club-rail);
}

.custom-investor-debenture-club .custom-investor-debenture-club__tab {
	--custom-press-ink: var(--custom-club-tab-ink);
	--custom-press-ground: transparent;
	--custom-press-edge: transparent;
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	border: 0;
	border-radius: 1000px;
	font-family: inherit;
	font-weight: 500;
	line-height: 1.5;
	letter-spacing: 0;
	text-transform: none;
	white-space: nowrap;
	cursor: pointer;
	transition: background-color 280ms cubic-bezier(0.2, 0.8, 0.2, 1),
	            color 280ms cubic-bezier(0.2, 0.8, 0.2, 1),
	            box-shadow 280ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.custom-investor-debenture-club .custom-investor-debenture-club__tab:hover {
	--custom-press-ink: var(--custom-club-tab-lit-ink);
	--custom-press-ground: var(--custom-club-tab-lit);
}

.custom-investor-debenture-club .custom-investor-debenture-club__tab:focus-visible {
	outline: 2px solid #50A3D5;
	outline-offset: 2px;
}

.custom-investor-debenture-club .custom-investor-debenture-club__tab[aria-selected="true"] {
	--custom-press-ink: var(--custom-club-tab-on-ink);
	--custom-press-ground: var(--custom-club-tab-on);
	--custom-press-shadow: 0 6px 18px rgba(22, 65, 140, 0.22);
	font-weight: 600;
}

/* ------------------------------------------------------------------ */
/* A panel — investor-debenture-club.css:42-66                         */
/* ------------------------------------------------------------------ */

.custom-investor-debenture-club .custom-investor-debenture-club__panel {
	box-sizing: border-box;
	margin: 0 auto;
	animation: custom-investor-debenture-club-fade 380ms cubic-bezier(0.2, 0.8, 0.2, 1) both;
}

.custom-investor-debenture-club .custom-investor-debenture-club__panel[hidden] {
	display: none;
}

.custom-investor-debenture-club .custom-investor-debenture-club__panel:focus-visible {
	outline: 2px solid #50A3D5;
	outline-offset: 4px;
}

@keyframes custom-investor-debenture-club-fade {
	from {
		opacity: 0;
		transform: translateY(10px);
	}
	to {
		opacity: 1;
		transform: none;
	}
}

.custom-investor-debenture-club .custom-investor-debenture-club__heading {
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0;
	padding: 0;
	color: var(--custom-club-heading);
	font-family: inherit;
	font-style: normal;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: 0;
	text-transform: none;
}

/* the ruled line the design repeats above each group of questions */
.custom-investor-debenture-club .custom-investor-debenture-club__kicker {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0;
	padding: 0;
	color: var(--custom-club-heading);
	font-weight: 600;
	line-height: 1.5;
	letter-spacing: 0;
}

.custom-investor-debenture-club .custom-investor-debenture-club__kicker::after {
	content: "";
	flex: 1 1 auto;
	height: 2px;                           /* investor-debenture-club.css:66 measures 1px */
	background-color: var(--custom-club-rule);
}

/* ------------------------------------------------------------------ */
/* Words — investor-debenture-club.css:69-75, 138-144                  */
/* ------------------------------------------------------------------ */

.custom-investor-debenture-club .custom-investor-debenture-club__copy {
	color: var(--custom-club-copy);
	font-weight: 300;
	line-height: 1.75;
	letter-spacing: 0;
}

.custom-investor-debenture-club .custom-investor-debenture-club__copy p {
	margin: 0;
	padding: 0;
}

.custom-investor-debenture-club .custom-investor-debenture-club__copy ul {
	margin: 0;
	padding: 0 0 0 40px;
	list-style: disc;
}

.custom-investor-debenture-club .custom-investor-debenture-club__letter {
	margin-top: 24px;                      /* investor-debenture-club.css:69 (25.92 capped at 24) */
}

.custom-investor-debenture-club .custom-investor-debenture-club__letter p + p {
	margin-top: 16px;                      /* investor-debenture-club.css:75 (17.28 capped at 16) */
}

/* ------------------------------------------------------------------ */
/* The code to scan — investor-debenture-club.css:77-91                */
/* ------------------------------------------------------------------ */

.custom-investor-debenture-club .custom-investor-debenture-club__code {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 18px;                             /* investor-debenture-club.css:79 (20.16 capped at 18) */
	width: fit-content;
	margin: 40px auto 0;                   /* investor-debenture-club.css:80 (43.2 capped at 40) */
	text-align: center;
}

/* qr-download-7app.png is 500 by 500 */
.custom-investor-debenture-club .custom-investor-debenture-club__code-picture {
	box-sizing: border-box;
	width: 202px;                          /* investor-debenture-club.css:84 (201.6) */
	aspect-ratio: 1 / 1;
	border: 2px solid var(--custom-club-rule);   /* investor-debenture-club.css:85 measures 1px */
	border-radius: 14px;
}

.custom-investor-debenture-club .custom-investor-debenture-club__code-words {
	margin: 0;
	padding: 0;
	color: var(--custom-club-heading);
	font-size: 16px;                       /* investor-debenture-club.css:89 (15.84) */
	font-weight: 500;
	line-height: 1.6;
	letter-spacing: 0;
}

/* guide-all-member-register.jpg is 1024 by 730 — investor-debenture-club.css:92-96 */
.custom-investor-debenture-club .custom-investor-debenture-club__guide {
	box-sizing: border-box;
	width: 100%;
	aspect-ratio: 1024 / 730;
	margin: 36px 0 0;                      /* investor-debenture-club.css:92 (37.44 capped at 36) */
	border: 2px solid var(--custom-club-rule);   /* investor-debenture-club.css:95 measures 1px */
	border-radius: 20px;
}

/* ------------------------------------------------------------------ */
/* The button — investor-debenture-club.css:98-113                     */
/* ------------------------------------------------------------------ */

.custom-investor-debenture-club .custom-investor-debenture-club__button {
	--custom-press-ink: var(--custom-club-button-ink);
	--custom-press-ground: var(--custom-club-button);
	--custom-press-edge: transparent;
	display: flex;
	align-items: center;
	box-sizing: border-box;
	gap: 10px;
	width: fit-content;
	max-width: 100%;
	margin: 40px auto 0;                   /* investor-debenture-club.css:101 (43.2 capped at 40) */
	padding: 14px 28px;                    /* investor-debenture-club.css:102 (15.84 capped at 14 / 31.68 capped at 28) */
	border: 0;
	border-radius: 1000px;
	font-size: 16px;                       /* investor-debenture-club.css:105 (15.84) */
	font-weight: 600;
	line-height: 1.6;
	letter-spacing: 0;
	overflow-wrap: anywhere;
	transition: background-color 250ms cubic-bezier(0.2, 0.8, 0.2, 1),
	            transform 250ms cubic-bezier(0.2, 0.8, 0.2, 1),
	            box-shadow 250ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.custom-investor-debenture-club a.custom-investor-debenture-club__button:hover {
	--custom-press-ground: var(--custom-club-button-lit);
	--custom-press-shadow: 0 18px 44px -14px rgba(22, 65, 140, 0.2);   /* --sh */
	transform: translateY(-2px);
}

.custom-investor-debenture-club .custom-investor-debenture-club__button svg {
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

/* ------------------------------------------------------------------ */
/* The terms — investor-debenture-club.css:116-126                     */
/* ------------------------------------------------------------------ */

.custom-investor-debenture-club .custom-investor-debenture-club__terms {
	margin: 56px 0 0;                      /* investor-debenture-club.css:117 (57.6 capped at 56) */
	padding: 0;
	font-size: 16px;                       /* investor-debenture-club.css:119 (15.84) */
	font-weight: 500;
	line-height: 1.6;
	letter-spacing: 0;
	text-align: center;
}

.custom-investor-debenture-club .custom-investor-debenture-club__terms a,
.custom-investor-debenture-club .custom-investor-debenture-club__terms span {
	--custom-press-ink: var(--custom-club-link);
	--custom-press-edge: transparent;
}

.custom-investor-debenture-club .custom-investor-debenture-club__terms a,
.custom-investor-debenture-club .custom-investor-debenture-club__terms a:hover,
.custom-investor-debenture-club .custom-investor-debenture-club__terms a:focus {
	text-decoration: underline;
	text-underline-offset: 4px;            /* investor-debenture-club.css:124 measures 3px */
}

.custom-investor-debenture-club .custom-investor-debenture-club__terms a:hover {
	--custom-press-ink: var(--custom-club-link-lit);
}

/* ------------------------------------------------------------------ */
/* The steps — investor-debenture-club.css:129-150                     */
/* ------------------------------------------------------------------ */

.custom-investor-debenture-club .custom-investor-debenture-club__step {
	margin-top: 36px;                      /* investor-debenture-club.css:129 (37.44 capped at 36) */
}

.custom-investor-debenture-club .custom-investor-debenture-club__step:first-of-type {
	margin-top: 24px;                      /* investor-debenture-club.css:130 (25.92 capped at 24) */
}

.custom-investor-debenture-club .custom-investor-debenture-club__step-title {
	margin: 0 0 8px;
	padding: 0;
	color: var(--custom-club-heading);
	font-family: inherit;
	font-size: 18px;                       /* investor-debenture-club.css:133 (17.28) */
	font-style: normal;
	font-weight: 600;
	line-height: 1.6;
	letter-spacing: 0;
	text-transform: none;
}

.custom-investor-debenture-club .custom-investor-debenture-club__step p + p {
	margin-top: 10px;
}

/* the step pictures are 800 by 450 */
.custom-investor-debenture-club .custom-investor-debenture-club__step-picture {
	box-sizing: border-box;
	width: 100%;
	aspect-ratio: 800 / 450;
	margin: 20px 0 0;                      /* investor-debenture-club.css:145 (20.16 capped at 20) */
	border: 2px solid var(--custom-club-rule);   /* investor-debenture-club.css:148 measures 1px */
	border-radius: 20px;
}

/* ------------------------------------------------------------------ */
/* The index of questions — investor-debenture-club.css:153-163        */
/* ------------------------------------------------------------------ */

.custom-investor-debenture-club .custom-investor-debenture-club__index-scroll {
	overflow-x: auto;
	margin-top: 24px;                      /* investor-debenture-club.css:154 (25.92 capped at 24) */
	border: 2px solid var(--custom-club-rule);   /* investor-debenture-club.css:156 measures 1px */
	border-radius: 14px;
}

.custom-investor-debenture-club table.custom-investor-debenture-club__index {
	width: 100%;
	margin: 0;
	border: 0;
	border-collapse: collapse;
	line-height: 1.6;
}

.custom-investor-debenture-club .custom-investor-debenture-club__index th,
.custom-investor-debenture-club .custom-investor-debenture-club__index td {
	padding: 14px 16px;                    /* investor-debenture-club.css:159 (14.4 capped at 14 / 17.28 capped at 16) */
	border: 0;
	border-bottom: 2px solid var(--custom-club-rule);   /* investor-debenture-club.css:159 measures 1px */
	background-color: transparent;
	font-size: inherit;
	text-align: left;
}

.custom-investor-debenture-club .custom-investor-debenture-club__index th {
	background-color: var(--custom-club-rail);
	color: var(--custom-club-heading);
	font-weight: 600;
}

.custom-investor-debenture-club .custom-investor-debenture-club__index td {
	color: var(--custom-club-copy);
	font-weight: 300;
}

.custom-investor-debenture-club .custom-investor-debenture-club__index tbody tr:last-child td {
	border-bottom: 0;
}

/* ------------------------------------------------------------------ */
/* The questions — investor-debenture-club.css:165-226                 */
/* ------------------------------------------------------------------ */

.custom-investor-debenture-club .custom-investor-debenture-club__questions {
	display: flex;
	flex-direction: column;
	margin: 20px 0 0;                      /* investor-debenture-club.css:177 (20.16 capped at 20) */
	padding: 0;
}

.custom-investor-debenture-club .custom-investor-debenture-club__question {
	margin: 0;
	padding: 0;
	border: 2px solid transparent;         /* investor-debenture-club.css:182 measures 1px */
	border-radius: 14px;
	background-color: var(--custom-club-question);
	transition: border-color 300ms cubic-bezier(0.2, 0.8, 0.2, 1), background-color 300ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.custom-investor-debenture-club .custom-investor-debenture-club__question.is-open {
	border-color: var(--custom-club-rule);
	background-color: var(--custom-club-question-open);
	box-shadow: 0 6px 18px -6px rgba(22, 65, 140, 0.14);   /* --sh-sm */
}

.custom-investor-debenture-club .custom-investor-debenture-club__question-head {
	margin: 0;
	padding: 0;
	font: inherit;
	letter-spacing: 0;
	text-transform: none;
}

.custom-investor-debenture-club .custom-investor-debenture-club__question-toggle {
	--custom-press-ink: var(--custom-club-question-ink);
	--custom-press-ground: none;
	--custom-press-edge: transparent;
	display: flex;
	align-items: center;
	box-sizing: border-box;
	width: 100%;
	gap: 18px;                             /* investor-debenture-club.css:189 (20.16 capped at 18) */
	margin: 0;
	padding: 20px 24px;                    /* investor-debenture-club.css:190 (21.6 capped at 20 / 25.92 capped at 24) */
	border: 0;
	border-radius: 14px;
	font-family: inherit;
	letter-spacing: 0;
	text-align: left;
	text-transform: none;
	cursor: pointer;
}

.custom-investor-debenture-club .custom-investor-debenture-club__question-toggle:focus-visible {
	outline: 2px solid #50A3D5;
	outline-offset: -2px;
}

.custom-investor-debenture-club .custom-investor-debenture-club__question-number {
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background-color: var(--custom-club-mark);
	color: #FFFFFF;
	font-size: 12px;
	font-weight: 600;
	line-height: 1;
}

.custom-investor-debenture-club .custom-investor-debenture-club__question-words {
	flex: 1 1 auto;
	min-width: 0;
	font-size: 16px;                       /* investor-debenture-club.css:204 (15.84) */
	font-weight: 500;
	line-height: 1.5;
}

/* the sign: a chevron of two bars on a disc, turned over and reddened when open */
.custom-investor-debenture-club .custom-investor-debenture-club__question-sign {
	flex: 0 0 auto;
	position: relative;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background-color: var(--custom-club-mark);
	transition: transform 300ms cubic-bezier(0.2, 0.8, 0.2, 1), background-color 300ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.custom-investor-debenture-club .custom-investor-debenture-club__question-sign::before,
.custom-investor-debenture-club .custom-investor-debenture-club__question-sign::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 10px;
	height: 2px;
	border-radius: 2px;
	background-color: #FFFFFF;
}

.custom-investor-debenture-club .custom-investor-debenture-club__question-sign::before {
	/* investor-debenture-club.css:262 — half the bar back and 3px left, as one even move */
	transform: translate(-8px, -50%) rotate(45deg);
}

.custom-investor-debenture-club .custom-investor-debenture-club__question-sign::after {
	/* investor-debenture-club.css:263 — half the bar back and 3px right */
	transform: translate(-2px, -50%) rotate(-45deg);
}

.custom-investor-debenture-club .custom-investor-debenture-club__question.is-open .custom-investor-debenture-club__question-sign {
	transform: rotate(180deg);
	background-color: var(--custom-club-mark-open);
}

/* investor-debenture-club.css:221-222 — the answer opens over 350ms */
.custom-investor-debenture-club .custom-investor-debenture-club__answer {
	transition: grid-template-rows 350ms cubic-bezier(0.2, 0.8, 0.2, 1), visibility 0s linear 350ms;
}

.custom-investor-debenture-club .custom-investor-debenture-club__question.is-open > .custom-investor-debenture-club__answer {
	transition: grid-template-rows 350ms cubic-bezier(0.2, 0.8, 0.2, 1), visibility 0s;
}

/* the answer stands under the question's words, clear of its number */
.custom-investor-debenture-club .custom-investor-debenture-club__answer-body {
	padding: 0 24px 20px 70px;             /* investor-debenture-club.css:225-226: 28 + 18 + 24 on the left */
	line-height: 1.7;
}

/* ------------------------------------------------------------------ */
/* Tablet — 768px to 1024px                                            */
/* ------------------------------------------------------------------ */

@media (max-width: 1024px) {
	/* investor-debenture-club.css:230-234 — the rail scrolls rather than breaking its pill in two */
	.custom-investor-debenture-club .custom-investor-debenture-club__rail {
		flex-wrap: nowrap;
		overflow-x: auto;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
	}
	.custom-investor-debenture-club .custom-investor-debenture-club__rail::-webkit-scrollbar {
		display: none;
	}
	.custom-investor-debenture-club .custom-investor-debenture-club__letter,
	.custom-investor-debenture-club .custom-investor-debenture-club__index-scroll,
	.custom-investor-debenture-club .custom-investor-debenture-club__step:first-of-type {
		margin-top: 18px;                  /* 16.56 floored at 18 */
	}
	.custom-investor-debenture-club .custom-investor-debenture-club__letter p + p {
		margin-top: 12px;                  /* 11.04 floored at 12 */
	}
	.custom-investor-debenture-club .custom-investor-debenture-club__code {
		gap: 12px;                         /* 12.88 */
		margin-top: 28px;                  /* 27.6 floored at 28 */
	}
	.custom-investor-debenture-club .custom-investor-debenture-club__code-picture {
		width: 150px;                      /* 128.8 floored at 150 */
	}
	.custom-investor-debenture-club .custom-investor-debenture-club__code-words,
	.custom-investor-debenture-club .custom-investor-debenture-club__button,
	.custom-investor-debenture-club .custom-investor-debenture-club__terms,
	.custom-investor-debenture-club .custom-investor-debenture-club__question-words {
		font-size: 14px;                   /* 10.12 floored at 14 */
	}
	.custom-investor-debenture-club .custom-investor-debenture-club__guide,
	.custom-investor-debenture-club .custom-investor-debenture-club__step {
		margin-top: 24px;                  /* 23.92 floored at 24 */
	}
	.custom-investor-debenture-club .custom-investor-debenture-club__button {
		margin-top: 28px;                  /* 27.6 floored at 28 */
		padding: 10px 20px;                /* 10.12 / 20.24 */
	}
	.custom-investor-debenture-club .custom-investor-debenture-club__terms {
		margin-top: 36px;                  /* 36.8 */
	}
	.custom-investor-debenture-club .custom-investor-debenture-club__step-title {
		font-size: 16px;                   /* 11.04 floored at 16 */
	}
	.custom-investor-debenture-club .custom-investor-debenture-club__step-picture,
	.custom-investor-debenture-club .custom-investor-debenture-club__questions {
		margin-top: 14px;                  /* 12.88 floored at 14 */
	}
	.custom-investor-debenture-club .custom-investor-debenture-club__index th,
	.custom-investor-debenture-club .custom-investor-debenture-club__index td {
		padding: 10px 12px;                /* 9.2 floored at 10 / 11.04 floored at 12 */
	}
	.custom-investor-debenture-club .custom-investor-debenture-club__question-toggle {
		gap: 12px;                         /* 12.88 */
		padding: 14px 16px;                /* 13.8 floored at 14 / 16.56 */
	}
	.custom-investor-debenture-club .custom-investor-debenture-club__answer-body {
		padding: 0 18px 16px 60px;         /* 28 + 14 + 18 on the left */
	}
}

/* ------------------------------------------------------------------ */
/* Mobile — up to 767px (investor-debenture-club.css:230-246)          */
/* ------------------------------------------------------------------ */

@media (max-width: 767px) {
	.custom-investor-debenture-club .custom-investor-debenture-club__rail {
		width: 100%;
	}
	.custom-investor-debenture-club .custom-investor-debenture-club__code {
		align-items: flex-start;
		gap: 12px;
		text-align: left;
	}
	.custom-investor-debenture-club .custom-investor-debenture-club__button {
		padding: 10px 20px;
	}
	.custom-investor-debenture-club .custom-investor-debenture-club__terms {
		margin-top: 36px;
	}
	.custom-investor-debenture-club .custom-investor-debenture-club__question-toggle {
		align-items: flex-start;
		gap: 12px;
		padding: 14px 16px;
	}
	.custom-investor-debenture-club .custom-investor-debenture-club__question-number {
		width: 24px;
		height: 24px;
		margin-top: 2px;
		font-size: 10px;
	}
	.custom-investor-debenture-club .custom-investor-debenture-club__question-sign {
		width: 28px;
		height: 28px;
		margin-top: 2px;
	}
	.custom-investor-debenture-club .custom-investor-debenture-club__answer-body {
		padding: 0 16px 16px 16px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.custom-investor-debenture-club .custom-investor-debenture-club__panel {
		animation: none;
	}
	.custom-investor-debenture-club .custom-investor-debenture-club__tab,
	.custom-investor-debenture-club .custom-investor-debenture-club__button,
	.custom-investor-debenture-club .custom-investor-debenture-club__question,
	.custom-investor-debenture-club .custom-investor-debenture-club__question-sign,
	.custom-investor-debenture-club .custom-investor-debenture-club__answer {
		transition: none;
	}
}
