/*
 * TIS FAQ. Desktop: Figma frame 1672 x 941 — heading, scene photo and help card on the left (896px), a
 * numbered accordion on the right (717px).
 */

.tis-faq {
	position: relative;
	background: linear-gradient(115deg, #fcfdff 0%, #f2f7ff 55%, #dfe9fd 100%);
	overflow: hidden;
}

/* Soft diagonal light bands across the right of the section (client design) */
.tis-faq::before,
.tis-faq::after {
	content: '';
	position: absolute;
	top: -20%;
	bottom: -20%;
	width: calc(150 * var(--tis-u));
	background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.55) 50%, rgba(255, 255, 255, 0) 100%);
	transform: rotate(24deg);
	pointer-events: none;
}

.tis-faq::before { right: calc(120 * var(--tis-u)); }
.tis-faq::after { right: calc(-40 * var(--tis-u)); width: calc(260 * var(--tis-u)); background: linear-gradient(90deg, rgba(189, 208, 246, 0) 0%, rgba(189, 208, 246, 0.45) 100%); }
.tis-faq__inner { z-index: 1; }

.tis-faq__soft {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: calc(58 * var(--tis-u));
	overflow: hidden;
	pointer-events: none;
}

.tis-faq__soft .tis-faq__soft-img { display: block; width: 100%; height: 100%; object-fit: cover; }

.tis-faq__inner {
	position: relative;
	display: grid;
	grid-template-columns: 896fr 717fr;
	align-items: start;
	padding-right: calc(59 * var(--tis-u));
	padding-left: 0;
}

/* ---------------------------------------------------------------------
 * Left column
 * ------------------------------------------------------------------ */
.tis-faq__left { min-width: 0; }

.tis-faq__eyebrow { gap: calc(21 * var(--tis-u)); margin-left: calc(102 * var(--tis-u)); }
.tis-faq__eyebrow .tis-eyebrow__line { width: calc(55 * var(--tis-u)); }

.tis-faq__title {
	margin: calc(12.6 * var(--tis-u)) 0 0 calc(100 * var(--tis-u));
	font-family: var(--tis-font-display);
	font-size: max(28px, calc(59 * var(--tis-u)));
	font-weight: 900;
	line-height: 1.08;
	color: var(--tis-ink);
}

.tis-faq__text {
	position: relative;
	z-index: 2;
	max-width: calc(730 * var(--tis-u));
	margin: calc(19.6 * var(--tis-u)) 0 0 calc(101 * var(--tis-u));
	font-size: max(15px, calc(22 * var(--tis-u)));
	font-weight: 400;
	line-height: 1.43;
	color: #495c83;
}

.tis-faq__text p { margin: 0 0 0.5em; }
.tis-faq__text p:last-child { margin-bottom: 0; }

.tis-faq__scene {
	--fl: 24%;
	--fr: 30%;
	--ft: 30%;
	--fb: 10%;
	position: relative;
	z-index: 1;
	width: calc(895 * var(--tis-u));
	height: calc(364 * var(--tis-u));
	margin-top: calc(-6.4 * var(--tis-u));
	overflow: hidden;
}

.tis-faq__scene .tis-faq__img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* Help card */
.tis-faq__help {
	position: relative;
	z-index: 2;
	display: grid;
	grid-template-columns: calc(98 * var(--tis-u)) minmax(0, 1fr) calc(233 * var(--tis-u));
	column-gap: calc(28 * var(--tis-u));
	align-items: start;
	width: calc(811 * var(--tis-u));
	min-height: calc(185 * var(--tis-u));
	margin: calc(1 * var(--tis-u)) 0 0 calc(56 * var(--tis-u));
	padding: calc(26 * var(--tis-u)) calc(33 * var(--tis-u)) calc(25 * var(--tis-u)) calc(30 * var(--tis-u));
	border: 1px solid rgba(255, 255, 255, 0.9);
	border-radius: calc(19 * var(--tis-u));
	background: rgba(255, 255, 255, 0.78);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	box-shadow: 0 18px 50px rgba(31, 66, 108, 0.12);
}

.tis-faq__help-icon {
	width: max(64px, calc(98 * var(--tis-u)));
	height: max(64px, calc(98 * var(--tis-u)));
	margin-top: calc(6 * var(--tis-u));
	background: radial-gradient(circle at 50% 50%, #004bff 0 52%, #e3ecff 54% 100%);
	color: #fff;
}

.tis-faq__help-icon svg { width: max(32px, calc(47 * var(--tis-u))); height: max(32px, calc(47 * var(--tis-u))); }

.tis-faq__help-copy { min-width: 0; padding-top: calc(10 * var(--tis-u)); }

.tis-faq__help-eyebrow { gap: 0; font-size: max(12px, calc(16 * var(--tis-u))); }

.tis-faq__help-title {
	margin: calc(0.6 * var(--tis-u)) 0 0;
	font-size: max(20px, calc(30 * var(--tis-u)));
	font-weight: 700;
	line-height: 1.4;
	color: var(--tis-ink);
}

.tis-faq__help-text {
	max-width: calc(364 * var(--tis-u));
	margin: calc(7 * var(--tis-u)) 0 0;
	font-size: max(13px, calc(14 * var(--tis-u)));
	font-weight: 400;
	line-height: 1.55;
	color: #4c6089;
}

.tis-faq__help-actions { display: flex; flex-direction: column; gap: calc(16 * var(--tis-u)); }

.tis-faq__btn {
	min-height: calc(54 * var(--tis-u));
	padding: 0 calc(20 * var(--tis-u));
	border-radius: calc(12 * var(--tis-u));
	font-size: max(14px, calc(18 * var(--tis-u)));
}

.tis-faq__btn--secondary { flex-direction: row-reverse; color: var(--tis-primary); }
.tis-faq__btn--secondary:hover,
.tis-faq__btn--secondary:focus-visible { color: #fff; }

/* ---------------------------------------------------------------------
 * Accordion
 * ------------------------------------------------------------------ */
.tis-faq__list {
	display: grid;
	row-gap: calc(11 * var(--tis-u));
	margin-top: calc(29 * var(--tis-u));
	min-width: 0;
}

.tis-faq__item {
	position: relative;
	border-radius: calc(16 * var(--tis-u));
	background: var(--tis-white);
	overflow: hidden;
}

.tis-faq__item[open] { margin-bottom: calc(2 * var(--tis-u)); }

/* Open state: soft highlight card inset inside the white one */
.tis-faq__item::before {
	content: '';
	position: absolute;
	inset: calc(7 * var(--tis-u)) calc(9 * var(--tis-u)) calc(8 * var(--tis-u));
	border-radius: calc(12 * var(--tis-u));
	background: transparent;
	transition: background-color 0.25s ease;
	pointer-events: none;
}

.tis-faq__item[open]::before { background: #f1f6ff; }

.tis-faq__summary {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	gap: calc(33 * var(--tis-u));
	min-height: calc(76 * var(--tis-u));
	padding: 0 calc(33 * var(--tis-u)) 0 calc(32 * var(--tis-u));
	list-style: none;
	cursor: pointer;
}

.tis-faq__summary::-webkit-details-marker { display: none; }
.tis-faq__summary:focus-visible { outline: 2px solid var(--tis-primary); outline-offset: -4px; border-radius: 16px; }
.tis-faq__item[open] > .tis-faq__summary { min-height: calc(83 * var(--tis-u)); padding-top: calc(7 * var(--tis-u)); }

.tis-faq__num {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: none;
	width: max(34px, calc(45 * var(--tis-u)));
	height: max(34px, calc(45 * var(--tis-u)));
	border-radius: 50%;
	background: var(--tis-soft);
	color: var(--tis-primary);
	font-size: max(15px, calc(21 * var(--tis-u)));
	font-weight: 500;
	line-height: 1;
	transition: background-color 0.25s ease, color 0.25s ease;
}

.tis-faq__item[open] .tis-faq__num { background: var(--tis-primary); color: #fff; }

.tis-faq__question {
	flex: 1;
	min-width: 0;
	margin: 0;
	font-family: var(--tis-font-body);
	font-size: max(15px, calc(21 * var(--tis-u)));
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: -0.033em;
	color: var(--tis-ink);
}

.tis-faq__toggle {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: none;
	width: max(30px, calc(38 * var(--tis-u)));
	height: max(30px, calc(38 * var(--tis-u)));
	border-radius: 50%;
	background: var(--tis-soft);
	color: var(--tis-primary);
	transition: background-color 0.25s ease, transform 0.25s ease;
}

.tis-faq__toggle svg,
.tis-faq__toggle i { width: max(16px, calc(23 * var(--tis-u))); height: max(16px, calc(23 * var(--tis-u))); font-size: max(16px, calc(23 * var(--tis-u))); }
.tis-faq__toggle-open,
.tis-faq__toggle-close { display: inline-flex; }
.tis-faq__toggle-close { display: none; }
.tis-faq__item[open] .tis-faq__toggle-open { display: none; }
.tis-faq__item[open] .tis-faq__toggle-close { display: inline-flex; }
.tis-faq__summary:hover .tis-faq__toggle { background: #d4e3ff; }

.tis-faq__answer {
	position: relative;
	z-index: 1;
	padding: calc(0 * var(--tis-u)) calc(44 * var(--tis-u)) calc(28.2 * var(--tis-u)) calc(110 * var(--tis-u));
	font-size: max(14px, calc(16 * var(--tis-u)));
	font-weight: 400;
	line-height: 1.6;
	color: #3e5582;
}

.tis-faq__answer p { margin: 0 0 0.6em; }
.tis-faq__answer p:last-child { margin-bottom: 0; }

/* ---------------------------------------------------------------------
 * Tablet
 * ------------------------------------------------------------------ */
@media (max-width: 1024px) {
	.tis-faq__inner { grid-template-columns: 1fr; padding-left: var(--tis-gutter); padding-right: var(--tis-gutter); }
	.tis-faq__eyebrow { gap: 14px; margin-left: 0; }
	.tis-faq__eyebrow .tis-eyebrow__line { width: 36px; }
	.tis-faq__title { margin: 14px 0 0; font-size: 44px; }
	.tis-faq__text { max-width: 680px; margin: 18px 0 0; font-size: 18px; }
	.tis-faq__scene { width: calc(100% + 2 * var(--tis-gutter)); height: clamp(240px, 46vw, 380px); margin: 32px calc(-1 * var(--tis-gutter)) 0; }
	.tis-faq__help { grid-template-columns: 76px minmax(0, 1fr); gap: 20px; width: auto; min-height: 0; margin: -28px 0 0; padding: 24px; border-radius: 18px; box-shadow: 0 18px 44px rgba(31, 66, 108, 0.1); }
	.tis-faq__help-icon { width: 76px; height: 76px; }
	.tis-faq__help-icon svg { width: 36px; height: 36px; }
	.tis-faq__help-copy { padding-top: 0; }
	.tis-faq__help-title { font-size: 26px; }
	.tis-faq__help-text { max-width: none; font-size: 14px; }
	.tis-faq__help-actions { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; gap: 14px; }
	.tis-faq__btn { flex: 1 1 200px; min-height: 52px; border-radius: 12px; font-size: 16px; padding: 0 20px; }
	.tis-faq__list { row-gap: 12px; margin-top: 40px; }
	.tis-faq__item { border-radius: 16px; }
	.tis-faq__summary { min-height: 72px; gap: 18px; padding: 0 20px; }
	.tis-faq__item[open] > .tis-faq__summary { min-height: 79px; padding-top: 7px; }
	.tis-faq__item::before { inset: 7px 8px 8px; border-radius: 12px; }
	.tis-faq__num { width: 40px; height: 40px; font-size: 18px; }
	.tis-faq__question { font-size: 18px; }
	.tis-faq__toggle { width: 34px; height: 34px; }
	.tis-faq__answer { padding: 0 26px 26px 78px; font-size: 15px; }
}

/* ---------------------------------------------------------------------
 * Mobile
 * ------------------------------------------------------------------ */
@media (max-width: 767px) {
	.tis-faq__title { font-size: 30px; }
	.tis-faq__text { font-size: 16px; }
	.tis-faq__help { grid-template-columns: 1fr; padding: 22px 20px; }
	.tis-faq__help-icon { width: 64px; height: 64px; }
	.tis-faq__help-actions { grid-column: auto; flex-direction: column; }
	.tis-faq__btn { flex: none; width: 100%; }
	.tis-faq__summary { gap: 14px; padding: 0 16px; }
	.tis-faq__num { width: 36px; height: 36px; font-size: 16px; }
	.tis-faq__question { font-size: 16px; }
	.tis-faq__answer { padding: 0 20px 22px 66px; font-size: 14px; }
}