/* THEME */
.pay-page{
	--bg:#0e0f13; --bg-soft:#14161d; --card:#171925; --card-2:#1b1e2b;
	--text:#e9e9f2; --text-dim:#b9bbcc; --border:rgba(255,255,255,.08);
	--accent-1:#ff2a6d; --accent-2:#8a2be2;
	--accent-grad:linear-gradient(90deg,var(--accent-1),var(--accent-2));
	--shadow-accent:0 12px 28px rgba(255,42,109,.25),0 8px 22px rgba(138,43,226,.22);
}

/* BASE */
.payments-standalone{overflow-x:hidden;}
.pay-page,.pay-page *{box-sizing:border-box;}
.pay-page{color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;}
.pay-header,.pay-section,.pay-footer,.pay-toc{width:min(1200px,92vw);margin-inline:auto;}
a{color:inherit;text-decoration:none;}
/* никакие картинки не вылезают */
.pay-page img{max-width:100%;height:auto;display:block;}

/* HEADER */
.pay-header{
	display:flex;justify-content:space-between;align-items:center;gap:24px;
	padding:22px 0 16px;position:relative;
}
.pay-header__logo img{max-width:220px;}
.pay-header__cta{flex:0 0 auto;}
.pay-header .pay-btn{max-width:280px;}
.pay-header::after{
	content:"";position:absolute;left:50%;transform:translateX(-50%);
	bottom:-10px;width:100vw;height:6px;border-radius:4px;
	background:var(--accent-grad);box-shadow:var(--shadow-accent);
}

/* BUTTON */
.pay-btn{
	display:inline-block;padding:14px 22px;font-weight:700;letter-spacing:.2px;
	background:var(--accent-grad);color:#fff;border-radius:14px;
	border:1px solid rgba(255,255,255,.12);
	box-shadow:0 10px 24px rgba(255,42,109,.35),0 8px 22px rgba(138,43,226,.35),inset 0 0 0 1px rgba(255,255,255,.2);
	text-align:center;transition:transform .15s ease,box-shadow .2s ease,filter .2s ease;
}
.pay-btn:hover{transform:translateY(-1px);filter:brightness(1.05);box-shadow:0 16px 36px rgba(255,42,109,.45),0 12px 30px rgba(138,43,226,.45),inset 0 0 0 1px rgba(255,255,255,.28);}
.pay-btn:active{transform:translateY(0);}

/* SECTION LAYOUT */
.pay-section{
	padding:56px 0;display:grid;align-items:start;row-gap:20px;
	column-gap:clamp(20px,3vw,40px);
	grid-template-columns:1.05fr .95fr;
	grid-template-areas:
		"content media"
		"table   table"
		"cta     cta";
}
.pay-section__content{grid-area:content;}
.pay-section__media{grid-area:media;}
.pay-section__table{grid-area:table;overflow:auto;-webkit-overflow-scrolling:touch;border-radius:14px;}
.pay-section__cta{grid-area:cta;display:flex;justify-content:center;gap:12px;}
.pay-section__content :where(h1,h2,h3){margin:0 0 .6em;}
.pay-section__content :where(p,ul,ol){color:var(--text-dim);line-height:1.65;}
.pay-section__media img{width:100%;border-radius:16px;box-shadow:0 10px 24px rgba(0,0,0,.35);}

/* зеркальные секции (десктоп) */
.pay-section--2,.pay-section--4,.pay-section--6{
	grid-template-areas:
		"media content"
		"table table"
		"cta   cta";
}

/* TABLES */
.withdrawal-table,.pay-table{
	width:100%;min-width:680px; /* создаёт горизонтальную прокрутку в контейнере */
	border-collapse:separate;border-spacing:0;background:var(--card);
	color:var(--text);border:1px solid var(--border);border-radius:14px;overflow:hidden;
	box-shadow:0 14px 36px rgba(0,0,0,.35);
}
.withdrawal-table thead th,.pay-table thead th{
	background:var(--accent-grad);color:#fff;text-align:left;font-weight:700;padding:14px 16px;border-bottom:none;
}
.withdrawal-table tbody td,.pay-table tbody td{padding:14px 16px;color:var(--text-dim);border-bottom:1px solid var(--border);}
.withdrawal-table tbody tr:nth-child(2n),.pay-table tbody tr:nth-child(2n){background:var(--card-2);}
.withdrawal-table tbody tr:hover,.pay-table tbody tr:hover{background:#202433;}

/* FAQ */
.pay-section--7{
	grid-template-columns:1fr;
	grid-template-areas:"faqtitle" "faqlist";
	row-gap:18px;
}
.pay-faq__title{
	grid-area:faqtitle;display:inline-block;margin:0 auto;
	background:var(--accent-grad);color:#fff;padding:10px 18px;border-radius:999px;
	box-shadow:var(--shadow-accent);text-align:center;
}
.pay-faq__list{grid-area:faqlist;display:grid;gap:14px;margin:0;padding:0;}
.pay-faq__item{
	background:var(--card);border:1px solid var(--border);border-radius:14px;
	box-shadow:0 12px 24px rgba(0,0,0,.35);overflow:hidden;margin:0;
}
.pay-faq__item[open]{box-shadow:0 16px 36px rgba(0,0,0,.45);}
.pay-faq__item>summary{
	cursor:pointer;list-style:none;user-select:none;position:relative;
	font-weight:700;color:#fff;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02));
	padding:16px 56px 16px 18px;
}
.pay-faq__item>summary::-webkit-details-marker{display:none;}
.pay-faq__item>summary::after{
	content:"";position:absolute;right:18px;top:50%;transform:translateY(-50%);
	width:0;height:0;border-top:8px solid transparent;border-bottom:8px solid transparent;border-left:12px solid #ff4d88;
	filter:drop-shadow(0 2px 6px rgba(255,77,136,.6));transition:transform .2s ease,filter .2s ease,border-left-color .2s ease;
}
.pay-faq__item[open]>summary::after{transform:translateY(-50%) rotate(90deg);filter:drop-shadow(0 4px 10px rgba(138,43,226,.6));border-left-color:#a259ff;}
.pay-faq__a{padding:14px 18px 18px;color:var(--text-dim);background:var(--bg-soft);border-top:1px solid var(--border);}

/* AUTHOR */
.pay-author{
	background:var(--card);border:1px solid var(--border);border-radius:16px;box-shadow:0 12px 24px rgba(0,0,0,.35);
	padding:18px;display:grid;grid-template-columns:180px 1fr;grid-template-rows:auto auto;
	grid-template-areas:"photo msg" "meta msg";column-gap:18px;row-gap:12px;
}
.pay-author__photo{
	grid-area:photo;align-self:start;border-radius:16px;overflow:hidden;
	width:100%;height:180px; /* аккуратная карточка */
}
.pay-author__photo img{
	width:100%;height:100%;object-fit:cover;display:block;
}
.pay-author__info{grid-area:meta;align-self:start;}
.pay-author__name{margin:4px 0 2px;}
.pay-author__job{margin:0 0 10px;color:var(--text-dim);}
.pay-author__msg{grid-area:msg;background:transparent;border:0;padding:0;box-shadow:none;color:var(--text-dim);}

/* FOOTER */
.pay-footer{
	margin-top:60px;padding:30px 0 24px;position:relative;display:grid;row-gap:22px;
	grid-template-columns:1fr 1fr;grid-template-areas:"logo nav" "contacts contacts";
}
.pay-footer__logo{grid-area:logo;}
.pay-footer__logo img{max-width:260px;}
.pay-footer__nav{grid-area:nav;justify-self:center;}
.pay-footer__nav-list{margin:0;padding:0;display:flex;gap:18px;list-style:none;}
.pay-footer__nav-item a{color:var(--text-dim);padding:6px 8px;border-radius:8px;transition:background .15s ease,color .15s ease;}
.pay-footer__nav-item a:hover{color:#fff;background:rgba(255,255,255,.06);}
.pay-footer__contacts{grid-area:contacts;text-align:center;color:var(--text-dim);}
.pay-footer__contacts a{color:#fff;text-decoration:underline;text-underline-offset:3px;}
.pay-footer__meta{margin:0;}
.pay-footer__meta .pay-dot{display:inline-block;margin:0 .5ch;opacity:.6;}
.pay-footer::before{
	content:"";position:absolute;left:50%;transform:translateX(-50%);
	top:-10px;width:100vw;height:6px;border-radius:4px;background:var(--accent-grad);box-shadow:var(--shadow-accent);
}

/* TOC */
.pay-toc{
	margin:20px auto 48px;position:relative;background:var(--card);
	border:1px solid var(--border);border-radius:16px;box-shadow:0 12px 24px rgba(0,0,0,.35);
	padding:14px 18px;
}
.pay-toc::before{
	content:"";position:absolute;left:14px;right:14px;top:-8px;height:6px;border-radius:4px;background:var(--accent-grad);box-shadow:var(--shadow-accent);
}
.pay-toc__nav{width:100%;}
.pay-toc__list{margin:0;padding:4px;list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:12px 16px;}
.pay-toc__link{
	display:inline-flex;align-items:center;gap:.5ch;padding:10px 14px;border-radius:999px;color:var(--text-dim);
	background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.02));
	border:1px solid var(--border);
	box-shadow:0 6px 14px rgba(0,0,0,.25),inset 0 0 0 1px rgba(255,255,255,.06);
	transition:transform .12s ease,box-shadow .18s ease,color .12s ease,background .18s ease;white-space:nowrap;
}
.pay-toc__link:hover,.pay-toc__link:focus-visible{
	background:var(--accent-grad);color:#fff;box-shadow:var(--shadow-accent),inset 0 0 0 1px rgba(255,255,255,.22);
	transform:translateY(-1px);outline:none;
}
.pay-toc__link.is-active,.pay-toc__link[aria-current="true"]{
	background:var(--accent-grad);color:#fff;box-shadow:var(--shadow-accent),inset 0 0 0 1px rgba(255,255,255,.22);
}
.pay-section{scroll-margin-top:14px;}

/* RESPONSIVE */

/* планшет/мобильный столбец: СНАЧАЛА КАРТИНКА, ПОТОМ ТЕКСТ — для всех секций */
@media (max-width:980px){
	.pay-section{
		grid-template-columns:1fr;
		grid-template-areas:
			"media"
			"content"
			"table"
			"cta";
	}
	/* кнопки не растягиваем на десктопе — убираем flex:1; только мобильный ниже */
	.pay-author{
		grid-template-columns:1fr;grid-template-areas:"photo" "meta" "msg";
	}
	.pay-header__logo img{max-width:180px;}
}

/* мобильные правки + защита от переполнений */
@media (max-width:720px){
	/* шапка: 50/50 — слева логотип, справа кнопка */
	.pay-header{
		display:grid;grid-template-columns:1fr 1fr;grid-template-areas:"logo cta";gap:12px;align-items:center;
	}
	.pay-header__logo{grid-area:logo;}
	.pay-header__cta{grid-area:cta;justify-self:end;width:100%;}
	.pay-header__logo img{max-width:100%;}
	.pay-header .pay-btn{width:100%;max-width:none;}

	/* таблицы прокручиваются, кнопки под ними — в одну колонку, но в пределах контента */
	.withdrawal-table,.pay-table{min-width:600px;}
	.pay-section__cta{flex-direction:column;align-items:stretch;gap:10px;}
	.pay-section__cta .pay-btn{width:100%;}

	/* FAQ — заголовок виден по центру, карточки без боковых отступов */
	.pay-faq__title{display:block;margin-inline:auto;text-align:center;}
	.pay-faq__list{gap:12px;margin:0;padding:0;}
	.pay-faq__item{margin:0;border-radius:14px;}
	.pay-faq__item>summary{padding:14px 48px 14px 14px;}
	.pay-faq__item>summary::after{right:14px;}

	/* автор — полноразмерная фотокарточка сверху */
	.pay-author__photo{height:220px;}
}

/* футер в одну колонку, по центру */
@media (max-width:780px){
	.pay-footer{
		grid-template-columns:1fr;
		grid-template-areas:"logo" "nav" "contacts";
		row-gap:16px;justify-items:center;text-align:center;
	}
	.pay-footer__logo img{margin-inline:auto;}
	.pay-footer__nav-list{justify-content:center;flex-wrap:wrap;gap:12px 16px;}
}

/* самые маленькие экраны */
@media (max-width:640px){
	.pay-btn{width:100%;}
	.pay-toc{padding:12px;}
	.pay-toc::before{left:10px;right:10px;}
	.pay-toc__list{gap:10px 12px;}
	.pay-toc__link{padding:9px 12px;}
}
/* === FIX: FAQ остаётся своей сеткой на мобиле, заголовок виден === */
@media (max-width:980px){
	/* медиаприоритет для всех секций, КРОМЕ FAQ */
	.pay-section:not(.pay-section--7){
		grid-template-columns:1fr;
		grid-template-areas:
			"media"
			"content"
			"table"
			"cta";
	}

	/* FAQ хранит собственные области */
	.pay-section--7{
		grid-template-columns:1fr;
		grid-template-areas:
			"faqtitle"
			"faqlist";
		row-gap:18px;
	}
}

/* заголовок FAQ как на десктопе */
.pay-faq__title{
	display:inline-block;           /* чтобы «пилюля» занимала свою ширину */
	margin:0 auto;                  /* по центру */
	background:var(--accent-grad);
	color:#fff;
	padding:10px 18px;
	border-radius:999px;
	box-shadow:var(--shadow-accent);
	text-align:center;
}

/* карточки FAQ без лев. отступов и без внешних маргинов */
.pay-faq__list{margin:0;padding:0;}
.pay-faq__item{margin:0;border-radius:14px;}
.pay-faq__item>summary{padding:16px 56px 16px 18px;} /* компакт слева на мобиле уже ок */

/* === AUTHOR: мобильная карточка в один столбец (без внутренней плашки) === */
@media (max-width: 980px){
	.pay-author{
		display:flex !important;          /* вместо grid */
		flex-direction:column;
		gap:12px;
		padding:16px;
		background:var(--card);
		border:1px solid var(--border);
		border-radius:16px;
		box-shadow:0 12px 24px rgba(0,0,0,.35);
	}

	/* не даём детям «расширять» контейнер и случайно скрываться */
	.pay-author > *{min-width:0; display:block !important; visibility:visible !important;}

	/* квадратная фотка сверху */
	.pay-author__photo{
		order:1;
		width:100%;
		aspect-ratio:1/1;          /* квадрат */
		height:auto !important;     /* перебиваем фикс-высоты */
		border-radius:12px;
		overflow:hidden;
	}
	.pay-author__photo img{
		width:100%; height:100%; object-fit:cover; display:block;
	}

	/* имя и должность под фото */
	.pay-author__info{
		order:2; text-align:center; align-self:stretch;
	}
	.pay-author__name{margin:6px 0 2px; font-weight:700; font-size:1.06rem; color:#fff;}
	.pay-author__job{margin:0 0 6px; color:var(--text-dim);}

	/* сообщение — без отдельной «внутренней» карточки */
	.pay-author__msg{
		order:3;
		background:transparent !important;
		border:0 !important;
		box-shadow:none !important;
		padding:0 !important;
		color:var(--text-dim);
		line-height:1.6;
		overflow-wrap:break-word;
	}
}