/* 33AutoPulse — доповнення до style.min.css
   Секції: assurance (гарантії), claim (страховий випадок), faq, розширений footer.
   Токени успадковані з style.css: --primary #dd293f, --wh, --black, Inter. */

/* Липка шапка перекривала заголовки при переході по якорях. */
section[id],
footer[id] {
	scroll-margin-top: 96px;
}

/* ---------- assurance: смуга гарантій під героєм ---------- */

.assurance {
	border-top: 1px solid rgba(255, 255, 255, .1);
	border-bottom: 1px solid rgba(255, 255, 255, .1);
}

.assurance__container {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
}

.assurance__item {
	flex: 1 1 220px;
	padding: 28px 32px 28px 0;
	display: flex;
	flex-direction: column;
	row-gap: 6px;
}

.assurance__item:not(:last-child) {
	border-right: 1px solid rgba(255, 255, 255, .1);
	margin-right: 32px;
}

.assurance__key {
	font-size: clamp(1.25rem, 1.1rem + .7vw, 1.75rem);
	font-weight: 700;
	line-height: 1.15;
	letter-spacing: -.02em;
	color: var(--primary);
}

.assurance__note {
	font-size: 15px;
	line-height: 1.5;
	color: rgba(255, 255, 255, .72);
}

/* ---------- claim: страховий випадок ---------- */

.claim__container {
	padding-top: 90px;
	padding-bottom: 90px;
}

.claim__title {
	max-width: 20ch;
	text-wrap: balance;
}

.claim__lead {
	max-width: 62ch;
	padding: 20px 0 48px 0;
	color: rgba(255, 255, 255, .78);
	line-height: 1.6;
	text-wrap: pretty;
}

.claim__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 48px;
	align-items: start;
}

.claim__subtitle {
	font-size: 20px;
	font-weight: 600;
	line-height: 1.3;
	padding-bottom: 20px;
}

.claim__list {
	list-style: none;
}

.claim__point {
	display: flex;
	align-items: baseline;
	column-gap: 14px;
	padding: 14px 0;
	line-height: 1.55;
	color: rgba(255, 255, 255, .82);
	border-top: 1px solid rgba(255, 255, 255, .1);
}

.claim__point:last-child {
	border-bottom: 1px solid rgba(255, 255, 255, .1);
}

.claim__point::before {
	content: "";
	flex: 0 0 auto;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--primary);
	transform: translateY(-3px);
}

.claim__point--plain::before {
	background: rgba(255, 255, 255, .35);
}

.claim__note {
	margin-top: 48px;
	padding: 28px 32px;
	border-radius: 20px;
	background: #1a1919;
}

.claim__note-title {
	font-size: 18px;
	font-weight: 600;
	padding-bottom: 10px;
}

.claim__note-text {
	color: rgba(255, 255, 255, .75);
	line-height: 1.6;
	max-width: 78ch;
	text-wrap: pretty;
}

.claim__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	margin-top: 40px;
}

/* ---------- faq ---------- */

.faq__container {
	padding-top: 90px;
	padding-bottom: 90px;
}

.faq__title {
	padding-bottom: 40px;
	text-wrap: balance;
}

.faq__list {
	max-width: 62rem;
	border-top: 1px solid rgba(255, 255, 255, .12);
}

.faq__item {
	border-bottom: 1px solid rgba(255, 255, 255, .12);
}

.faq__q {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	column-gap: 24px;
	padding: 24px 0;
	cursor: pointer;
	list-style: none;
	font-size: clamp(1.0625rem, 1rem + .25vw, 1.25rem);
	font-weight: 600;
	line-height: 1.4;
	transition: color .2s cubic-bezier(.22, 1, .36, 1);
}

.faq__q::-webkit-details-marker {
	display: none;
}

.faq__q::after {
	content: "";
	flex: 0 0 auto;
	width: 14px;
	height: 14px;
	margin-top: 6px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M7 0v14M0 7h14' stroke='%23000' stroke-width='2'/%3E%3C/svg%3E") center/contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M7 0v14M0 7h14' stroke='%23000' stroke-width='2'/%3E%3C/svg%3E") center/contain no-repeat;
	transition: transform .25s cubic-bezier(.22, 1, .36, 1);
}

.faq__item[open] .faq__q {
	color: var(--primary);
}

.faq__item[open] .faq__q::after {
	transform: rotate(135deg);
}

.faq__a {
	padding: 0 40px 26px 0;
	max-width: 72ch;
	color: rgba(255, 255, 255, .78);
	line-height: 1.65;
	text-wrap: pretty;
}

.faq__a p:not(:last-child) {
	padding-bottom: 12px;
}

/* ---------- форма: honeypot + результат ---------- */

.form__trap {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
}

.form__result {
	margin-top: 18px;
	line-height: 1.55;
	font-weight: 500;
}

.form__result:empty {
	display: none;
}

.form__result--ok {
	color: #7ee08a;
}

.form__result--error {
	color: #ff8f9c;
}

/* ---------- footer ---------- */

/* Контентна зона була рівно 50% — три колонки в ній не вміщалися. */
.footer__content {
	width: auto;
	flex: 1 1 auto;
	min-width: 0;
}

.footer__map {
	width: auto;
	flex: 0 0 clamp(220px, 26%, 360px);
}

.footer__inner {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	gap: 32px 40px;
	align-items: start;
}

.footer__column,
.footer__column:nth-child(1),
.footer__column:nth-child(2),
.footer__column:nth-child(3) {
	width: auto;
}

.footer__nav {
	list-style: none;
}

.footer__nav li:not(:last-child) {
	margin-bottom: 12px;
}

.footer__nav a {
	color: rgba(255, 255, 255, .78);
	line-height: 1.5;
	transition: color .2s cubic-bezier(.22, 1, .36, 1);
}

.footer__legal {
	margin-top: 56px;
	padding-top: 28px;
	border-top: 1px solid rgba(255, 255, 255, .1);
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	gap: 20px 40px;
}

.footer__legal-title {
	color: rgba(255, 255, 255, .5);
	font-size: 14px;
	padding-bottom: 8px;
}

.footer__legal-text {
	color: rgba(255, 255, 255, .8);
	font-size: 15px;
	line-height: 1.6;
}

.footer__text {
	color: rgba(255, 255, 255, .5);
}

.footer__text a {
	color: rgba(255, 255, 255, .7);
	text-decoration: underline;
	text-underline-offset: 3px;
}

@media (any-hover: hover) {

	.footer__nav a:hover,
	.footer__text a:hover {
		color: var(--primary);
	}

	.faq__q:hover {
		color: var(--primary);
	}
}

@media (max-width: 991.98px) {
	.claim__container,
	.faq__container {
		padding-top: 60px;
		padding-bottom: 60px;
	}
}

@media (max-width: 767.98px) {
	.assurance__item {
		flex: 1 1 100%;
		padding: 20px 0;
	}

	.assurance__item:not(:last-child) {
		border-right: 0;
		margin-right: 0;
		border-bottom: 1px solid rgba(255, 255, 255, .1);
	}

	.claim__note {
		padding: 24px 20px;
	}

	.footer__legal {
		margin-top: 40px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.faq__q,
	.faq__q::after,
	.footer__nav a,
	.footer__text a {
		transition: none;
	}
}

/* ============ сторінки-тексти (послуги, райони, блог) ============ */

/* ---------- хлібні крихти ---------- */

.crumbs {
	padding-top: 110px;
	font-size: 14px;
	line-height: 1.5;
	color: rgba(255, 255, 255, .5);
}

.crumbs__container {
	max-width: 94.5rem;
	margin: 0 auto;
	padding: 0 3rem;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 8px;
}

.crumbs a {
	color: rgba(255, 255, 255, .7);
}

.crumbs__sep {
	color: rgba(255, 255, 255, .25);
}

.crumbs [aria-current] {
	color: rgba(255, 255, 255, .95);
}

/* ---------- довгий текст ---------- */

.prose__container {
	max-width: 94.5rem;
	margin: 0 auto;
	padding: 48px 3rem 80px;
}

.prose__h1 {
	font-size: clamp(2.125rem, 1.35rem + 3.1vw, 4rem);
	line-height: 1.08;
	letter-spacing: -.02em;
	text-wrap: balance;
	max-width: 20ch;
}

.prose__meta {
	display: block;
	margin-top: 20px;
	font-size: 14px;
	color: rgba(255, 255, 255, .5);
}

.prose__lead {
	margin-top: 28px;
	max-width: 68ch;
	font-size: clamp(1.0625rem, 1rem + .35vw, 1.375rem);
	line-height: 1.55;
	color: rgba(255, 255, 255, .88);
	text-wrap: pretty;
}

.prose__container > p {
	margin-top: 20px;
	max-width: 68ch;
	line-height: 1.7;
	color: rgba(255, 255, 255, .78);
	text-wrap: pretty;
}

.prose__block {
	margin-top: 56px;
	max-width: 68ch;
}

.prose__h2 {
	font-size: clamp(1.375rem, 1.2rem + .8vw, 1.875rem);
	font-weight: 600;
	line-height: 1.25;
	letter-spacing: -.01em;
	text-transform: none;
	text-wrap: balance;
	padding-bottom: 16px;
}

.prose__block p {
	margin-top: 14px;
	line-height: 1.7;
	color: rgba(255, 255, 255, .78);
	text-wrap: pretty;
}

.prose__block .claim__list {
	margin-top: 8px;
}

/* ---------- перелік сторінок (послуги / райони / статті) ---------- */

.cards {
	margin-top: 48px;
	border-top: 1px solid rgba(255, 255, 255, .12);
}

.cards__item {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: baseline;
	column-gap: 32px;
	padding: 26px 0;
	border-bottom: 1px solid rgba(255, 255, 255, .12);
	transition: border-color .2s cubic-bezier(.22, 1, .36, 1);
}

.cards__item::after {
	content: "→";
	grid-column: 2;
	grid-row: 1 / span 3;
	align-self: center;
	color: rgba(255, 255, 255, .35);
	font-size: 20px;
	transition: transform .25s cubic-bezier(.22, 1, .36, 1), color .2s;
}

.cards__title {
	display: block;
	font-size: clamp(1.125rem, 1.05rem + .35vw, 1.5rem);
	font-weight: 600;
	line-height: 1.3;
	text-wrap: balance;
	transition: color .2s cubic-bezier(.22, 1, .36, 1);
}

.cards__text {
	display: block;
	margin-top: 8px;
	max-width: 62ch;
	line-height: 1.6;
	color: rgba(255, 255, 255, .68);
	text-wrap: pretty;
}

.cards__meta {
	display: block;
	margin-top: 10px;
	font-size: 14px;
	color: rgba(255, 255, 255, .45);
}

/* ---------- «читайте також» ---------- */

.related {
	margin-top: 64px;
	padding-top: 24px;
	border-top: 1px solid rgba(255, 255, 255, .12);
}

.related__title {
	font-size: 14px;
	color: rgba(255, 255, 255, .5);
	padding-bottom: 14px;
}

.related__list {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 10px 28px;
}

.related__list a {
	color: rgba(255, 255, 255, .82);
	line-height: 1.5;
	text-decoration: underline;
	text-decoration-color: rgba(255, 255, 255, .25);
	text-underline-offset: 4px;
	transition: color .2s cubic-bezier(.22, 1, .36, 1), text-decoration-color .2s;
}

@media (any-hover: hover) {
	.cards__item:hover {
		border-bottom-color: rgba(221, 41, 63, .55);
	}

	.cards__item:hover .cards__title,
	.cards__item:hover::after {
		color: var(--primary);
	}

	.cards__item:hover::after {
		transform: translateX(4px);
	}

	.crumbs a:hover,
	.related__list a:hover {
		color: var(--primary);
		text-decoration-color: currentColor;
	}
}

@media (max-width: 991.98px) {
	.crumbs {
		padding-top: 92px;
	}

	.prose__container {
		padding: 32px 3rem 56px;
	}

	.prose__block {
		margin-top: 40px;
	}
}

@media (max-width: 767.98px) {
	.crumbs__container,
	.prose__container {
		padding-left: 1rem;
		padding-right: 1rem;
	}

	.cards__item {
		column-gap: 16px;
		padding: 20px 0;
	}
}

@media (prefers-reduced-motion: reduce) {
	.cards__item,
	.cards__item::after,
	.cards__title,
	.related__list a {
		transition: none;
	}
}

/* Після хлібних крихт секція не потребує повного верхнього відступу. */
.crumbs + .claim .claim__container {
	padding-top: 32px;
}

/* ---------- ілюстрації на текстових сторінках ---------- */

.prose__hero {
	margin: 32px 0 0;
	border-radius: 20px;
	overflow: hidden;
	background: #1a1919;
	aspect-ratio: 16 / 9;
}

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

.figure {
	margin-top: 40px;
	max-width: 68ch;
}

.figure__media {
	border-radius: 16px;
	overflow: hidden;
	background: #1a1919;
	aspect-ratio: 16 / 9;
}

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

.figure__caption {
	margin-top: 12px;
	font-size: 14px;
	line-height: 1.55;
	color: rgba(255, 255, 255, .55);
	text-wrap: pretty;
}

@media (max-width: 767.98px) {
	.prose__hero {
		border-radius: 14px;
	}
}

.figure__media--svg {
	aspect-ratio: auto;
	background: #131313;
	padding: 8px;
}

.figure__media--svg svg {
	display: block;
	width: 100%;
	height: auto;
}

/* ---------- плаваюча кнопка WhatsApp ---------- */

.wa {
	position: fixed;
	right: clamp(16px, 4vw, 32px);
	bottom: calc(clamp(16px, 4vw, 32px) + env(safe-area-inset-bottom, 0px));
	z-index: 60;
	width: 58px;
	height: 58px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: #25d366;
	color: #fff;
	box-shadow: 0 10px 30px rgba(0, 0, 0, .45);
	transition: transform .25s cubic-bezier(.22, 1, .36, 1), box-shadow .25s;
}

.wa__icon {
	position: relative;
	z-index: 1;
	width: 32px;
	height: 32px;
}

/* Пульсація — кільце, що розходиться. Саму кнопку не рухаємо, щоб не смикався палець. */
.wa__pulse {
	position: absolute;
	inset: 0;
	border-radius: 50%;
	background: #25d366;
	opacity: .55;
	animation: wa-pulse 2.4s cubic-bezier(.22, 1, .36, 1) infinite;
}

@keyframes wa-pulse {
	0% { transform: scale(1); opacity: .5; }
	70% { transform: scale(1.9); opacity: 0; }
	100% { transform: scale(1.9); opacity: 0; }
}

@media (any-hover: hover) {
	.wa:hover {
		transform: scale(1.06);
		box-shadow: 0 14px 36px rgba(0, 0, 0, .55);
	}
}

@media (prefers-reduced-motion: reduce) {
	.wa,
	.wa__pulse {
		animation: none;
		transition: none;
	}
}

/* ---------- кнопки: більше не злипаються ---------- */

.claim__actions {
	margin-bottom: 48px;
}

.claim__actions:last-child {
	margin-bottom: 0;
}

@media (max-width: 767.98px) {
	/* на вузькому екрані ширина по контенту давала рвані краї */
	.claim__actions {
		flex-direction: column;
		align-items: stretch;
		gap: 12px;
	}

	.claim__actions .btn,
	.main__row .btn,
	.repair__link.btn {
		width: 100%;
	}

	.wa {
		width: 54px;
		height: 54px;
	}

	.wa__icon {
		width: 29px;
		height: 29px;
	}
}
