body .sp-heading{
	margin-top:var(--spacing-8)
}
.sp-contents ol{
	display:grid;
	gap:var(--spacing-2);
	list-style:none;
	margin:0;
	padding:0;
	font:var(--body-l-regular);
	letter-spacing:var(--letter-spacing-l)
}
.sp-contents ol li.level{
	font:var(--body-m-regular);
	letter-spacing:var(--letter-spacing-m);
	margin-left:var(--spacing-5)
}
.sp-contents ol li a{
	border-bottom:1px dashed;
	padding-bottom:2px
}
.sp-text,
.sp-quote,
.sp-caption{
	display:grid;
	gap:var(--spacing-4);
	font:var(--body-l-regular);
	letter-spacing:var(--letter-spacing-l)
}
.sp-text p,
.sp-quote p,
.sp-caption p,
.sp-complex-faq-multiple p{
	padding:0;
	margin:0
}
.sp-text strong,
.sp-quote strong,
.sp-caption strong,
.sp-complex-faq-multiple strong{
	background-color:var(--secondary-default);
	color:var(--text-body-09)
}
.sp-text ul,
.sp-quote ul,
.sp-caption ul,
.sp-complex-faq-multiple ul,
.sp-text ol,
.sp-quote ol,
.sp-caption ol,
.sp-complex-faq-multiple ol{
	padding-left:var(--spacing-7)
}
.sp-quote{
	padding:var(--spacing-5);
	border-radius:var(--radius-md);
	background-color:var(--tertiary-default);
	border:1px solid var(--border-light);
	font:var(--body-m-regular);
	letter-spacing:var(--letter-spacing-m)
}
.sp-caption{
	padding:var(--spacing-5);
	border-radius:var(--radius-md);
	background-color:var(--secondary-default);
	font:var(--body-m-regular);
	letter-spacing:var(--letter-spacing-m)
}
.sp-image{
	display:grid;
	gap:var(--spacing-1)
}
.sp-image img{
	border-radius:var(--radius-sm)
}
.sp-image .caption{
	font:var(--body-s-regular);
	letter-spacing:var(--letter-spacing-s);
	color:var(--text-body-07)
}
.sp-image.realsize{
	justify-content:center
}
.sp-image.realsize img{
	width:fit-content;
	max-width:100%
}
.sp-link-multiple{
	display:flex;
	flex-wrap:wrap;
	gap:var(--spacing-3);
}
.sp-complext-htag-text{
	display:grid;
	grid-template-columns:300px 1fr;
	gap:var(--spacing-5)
}
.sp-complext-htag-text .sp-heading{
	position:sticky;
	top:var(--spacing-11);
	height:fit-content
}
.sp-complex-prefs-multiple .items{
	margin:var(--spacing-7) 0;
	display:grid;
	gap:var(--spacing-5);
	grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
}
.sp-complex-prefs-multiple .items .item{
	display: grid;
	gap: var(--spacing-4);
	background: var(--bg-surface-white);
	border-radius: var(--radius-sm);
	box-shadow:var(--shadow-card);
	padding: var(--spacing-5);
	align-content: baseline
}
.sp-complex-prefs-multiple .items .item .pic{
	border-radius:var(--radius-sm)
}
.sp-complex-prefs-multiple .items .item .content{
	display: grid;
	gap: var(--spacing-1)
}
.sp-complex-prefs-multiple .items .item .content .title{
	font:var(--body-xl-bold);
	letter-spacing:var(--letter-spacing-xl)
}
.sp-complex-prefs-multiple .items .item .content .description{
	font:var(--body-l-regular);
	letter-spacing:var(--letter-spacing-l)
}
.sp-complex-prefs-multiple .items .item .content .description p{
	margin:0;
	padding:0
}
.sp-linked-elements{
	display:grid;
	gap:var(--spacing-2)
}




/* Container */
.sp-complex-faq-multiple .items {
    display: grid;
    gap: var(--spacing-2);
}

/* Item (details) */
.sp-complex-faq-multiple .items .item {
    font: var(--body-m-regular);
    letter-spacing: var(--letter-spacing-m);
    display: block; /* details должен быть блочным */
    border-radius: var(--radius-sm);
    background-color: var(--bg-surface-005);
    border: 1px solid var(--border-light);
    transition: background-color 0.3s ease;
    padding: var(--spacing-2) var(--spacing-4) 0;
    overflow: hidden;
}

.sp-complex-faq-multiple .items .item:hover {
    background-color: var(--bg-surface-01);
}

/* Question (summary) */
.sp-complex-faq-multiple .items .item .question {
    font: var(--body-l-bold);
    letter-spacing: var(--letter-spacing-l);
    cursor: pointer;
    margin: 0;
    min-height: 48px;
    padding-bottom: var(--spacing-2);
    user-select: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-align: left;
    position: relative;
    list-style: none; /* Убираем стандартный маркер */
}

/* Скрываем маркер в Webkit */
.sp-complex-faq-multiple .items .item .question::-webkit-details-marker {
    display: none;
}

/* Сброс стилей заголовка внутри summary */
.sp-complex-faq-multiple .items .item .question h3 {
    margin: 0;
    font: inherit;
    display: inline;
}

/* Focus Visible (A11y) */
.sp-complex-faq-multiple .items .item .question:focus-visible {
    outline: 2px solid var(--color-primary, #005bff);
    outline-offset: -2px;
    border-radius: var(--radius-sm);
    z-index: 10;
}

/* Icon rotation */
.sp-complex-faq-multiple .items .item .question svg {
    transform: rotate(90deg);
    transition: transform 0.4s ease;
    fill: currentColor;
    flex-shrink: 0;
}

/* Answer */
.sp-complex-faq-multiple .items .item .answer {
    font: var(--body-l-regular);
    letter-spacing: var(--letter-spacing-l);
    display: grid;
    gap: var(--spacing-4);
    overflow: hidden;
    height: 0; /* JS управляет высотой, по умолчанию закрыто */
    opacity: 0;
    transform: translateY(-10px);
    transition: opacity 0.3s ease, transform 0.3s ease;
}

/* --- STATE: OPEN --- */

.sp-complex-faq-multiple .items .item[open] {
    background: var(--bg-surface-white);
    padding-bottom: var(--spacing-4);
}

[data-theme="dark"] .sp-complex-faq-multiple .items .item[open] {
    background: var(--bg-surface-02);
}

.sp-complex-faq-multiple .items .item[open] .question svg {
    transform: rotate(270deg);
}

.sp-complex-faq-multiple .items .item[open] .answer {
    height: auto; /* Fallback, если JS отключен */
    opacity: 1;
    transform: translateY(0);
}




.sp-complex-achievements-multiple .items{
	display:grid;
	grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
	gap:var(--spacing-5);
	justify-content:center
}
.sp-complex-achievements-multiple .item{
	display:flex;
	flex-direction:column;
	gap:var(--spacing-2);
	text-align:center;
	padding:var(--spacing-4) 0
}
.sp-complex-achievements-multiple .item .title p{
	margin:0;
	font:var(--font-heading-h1);
	font-size:clamp(48px, 6vw, 96px);
	line-height:1;
	letter-spacing:var(--letter-spacing-xl);
	font-weight:var(--font-weight-bold);
	background:linear-gradient(135deg, var(--gradient-heading-start) 0%, var(--gradient-heading-end) 100%);
	-webkit-background-clip:text;
	-webkit-text-fill-color:transparent;
	background-clip:text;
	text-fill-color:transparent
}
.sp-complex-achievements-multiple .item .description p{
	margin:0;
	font:var(--body-l-medium);
	color:var(--text-body-07);
	letter-spacing:var(--letter-spacing-l)
}

.sp-code {
	font:var(--body-s-regular);
	letter-spacing:var(--letter-spacing-s);
	font-family: var(--font-code);
    background-color: var(--bg-surface-01);
    color: var(--text-body-095);
    padding:0 var(--spacing-5);
    border-radius:var(--radius-xs);
    border: 1px solid var(--border-dark)
}

.sp-code p{
	padding:0;
	margin:0
}
/* Media Queries */
@media (max-width: 767px) {
    .sp-complex-faq-multiple {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 479px) {
    .sp-complex-faq-multiple .items .item {
        font: var(--body-m-regular);
        letter-spacing: var(--letter-spacing-m);
    }
	.sp-complex-achievements-multiple .item .title p{
		font-size:64px
	}
}

/* Reduced Motion (A11y) */
@media (prefers-reduced-motion: reduce) {
    .sp-complex-faq-multiple .items .item .answer,
    .sp-complex-faq-multiple .items .item .question svg,
    .sp-complex-faq-multiple .items .item {
        transition: none !important;
        animation: none !important;
    }
}

/* High Contrast Mode (Windows A11y) */
@media (forced-colors: active) {
    .sp-complex-faq-multiple .items .item {
        border: 1px solid ButtonText;
    }
    .sp-complex-faq-multiple .items .item .question svg {
        fill: ButtonText;
    }
    .sp-complex-faq-multiple .items .item[open] {
        border: 2px solid Highlight;
    }
}