/* Vše o nákupu (rozcestník) a Časté dotazy (témata) — po vzoru Vlasima v prvcích návrhu AŠVY:
   dlaždice s rámečkem inkoustem a stínem při najetí, akordeon dotazů (parts/akordeon.css)
   a tmavá karta kontaktu jako „Potřebujete poradit s výběrem?“ na Objednávce. */

.as-nakup { background: var(--as-bila); }
.as-nakup__in { max-width: var(--as-sirka); margin: 0 auto; padding: 48px var(--as-okraj) 72px; }
.as-nakup__nadpis { font-size: 30px; line-height: 1.15; margin: 0 0 18px; }

/* Rozcestník */
.as-rozcestnik { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.as-rozcestnik__dlazdice {
	position: relative;
	display: grid;
	gap: 4px;
	height: 100%;
	padding: 20px 52px 20px 22px;
	background: var(--as-bila);
	border: var(--as-ramecek);
	border-radius: 20px;
	color: var(--as-inkoust);
	transition: transform .15s ease, box-shadow .15s ease;
}
.as-rozcestnik__dlazdice:hover,
.as-rozcestnik__dlazdice:focus-visible { transform: translateY(-3px); box-shadow: 6px 6px 0 var(--as-merunka); color: var(--as-inkoust); }
.as-rozcestnik__nazev { font-family: var(--as-pismo-nadpis); font-size: 18px; font-weight: 800; line-height: 1.3; }
.as-rozcestnik__popis { font-size: 14px; line-height: 1.5; color: var(--as-text-2); }
.as-rozcestnik__sipka {
	position: absolute;
	right: 20px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 18px;
	font-weight: 800;
	color: var(--as-terakota);
}

/* Nejčastější otázky pod rozcestníkem */
.as-nakup__faq { max-width: 860px; margin: 56px auto 0; }
.as-nakup__faq .as-nakup__nadpis { text-align: center; }
.as-nakup__vse { margin-top: 22px; }
.as-nakup__faq .as-nakup__vse { display: flex; width: max-content; margin: 22px auto 0; }

/* Časté dotazy: dlaždice témat se skokem na kotvu, témata pod sebou */
.as-nakup--faq .as-nakup__in { max-width: calc(940px + 2 * var(--as-okraj)); }
.as-faq-temata { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px; margin-bottom: 44px; }
.as-faq-temata__dlazdice {
	position: relative;
	display: grid;
	gap: 2px;
	padding: 16px 44px 16px 18px;
	background: var(--as-levandule);
	border: var(--as-ramecek);
	border-radius: 18px;
	color: var(--as-inkoust);
	transition: transform .15s ease, box-shadow .15s ease;
}
.as-faq-temata__dlazdice:hover,
.as-faq-temata__dlazdice:focus-visible { transform: translateY(-2px); box-shadow: 5px 5px 0 var(--as-merunka); color: var(--as-inkoust); }
.as-faq-temata__nazev { font-size: 15.5px; font-weight: 800; line-height: 1.3; }
.as-faq-temata__pocet { font-size: 13px; font-weight: 600; color: var(--as-sede); }
.as-faq-temata__sipka { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); font-weight: 800; color: var(--as-terakota); }
.as-faq-tema { scroll-margin-top: 100px; }
.as-faq-tema + .as-faq-tema { margin-top: 48px; }

/* Kontakt pod oběma stránkami */
.as-nakup-kontakt { background: var(--as-bila); }
.as-nakup-kontakt__in { max-width: var(--as-sirka); margin: 0 auto; padding: 0 var(--as-okraj) 88px; }
.as-nakup-kontakt__karta {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
	gap: 32px;
	align-items: center;
	background: var(--as-inkoust);
	color: var(--as-bila);
	border-radius: 28px;
	padding: 36px 40px;
	box-shadow: 8px 8px 0 var(--as-merunka);
}
.as-nakup-kontakt__stitek { font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--as-merunka); margin-bottom: 8px; }
.as-nakup-kontakt__nadpis { font-size: 30px; line-height: 1.15; color: var(--as-bila); margin: 0 0 10px; }
.as-nakup-kontakt__text p { font-size: 15.5px; line-height: 1.6; color: #D9DDEB; margin: 0 0 14px; }
.as-nakup-kontakt__odkaz { font-weight: 800; color: var(--as-bila); border-bottom: 2.5px solid var(--as-merunka); }
.as-nakup-kontakt__odkaz:hover { color: var(--as-merunka); }
.as-nakup-kontakt__cesty { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.as-nakup-kontakt__cesta {
	display: grid;
	gap: 3px;
	padding: 18px 20px;
	border-radius: 18px;
	background: rgba(255, 255, 255, .08);
	border: 2px solid rgba(255, 255, 255, .18);
	color: var(--as-bila);
	min-width: 0;
}
.as-nakup-kontakt__cesta:hover { border-color: var(--as-merunka); color: var(--as-bila); }
.as-nakup-kontakt__cesta strong { font-family: var(--as-pismo-nadpis); font-size: 20px; font-weight: 800; line-height: 1.3; color: var(--as-merunka); overflow-wrap: anywhere; }
.as-nakup-kontakt__popisek { font-size: 12.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #C9CEDF; }
.as-nakup-kontakt__pod { font-size: 13px; font-weight: 600; color: #C9CEDF; }

@media (max-width: 1024px) {
	.as-rozcestnik { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.as-nakup-kontakt__karta { grid-template-columns: minmax(0, 1fr); gap: 22px; }
}

@media (max-width: 768px) {
	.as-nakup__in { padding: 28px var(--as-okraj) 48px; }
	.as-nakup__nadpis { font-size: 24px; margin-bottom: 14px; }
	.as-rozcestnik { grid-template-columns: minmax(0, 1fr); gap: 12px; }
	.as-rozcestnik__dlazdice { padding: 16px 46px 16px 18px; border-radius: 16px; }
	.as-rozcestnik__nazev { font-size: 16.5px; }
	.as-rozcestnik__popis { font-size: 13.5px; }
	.as-nakup__faq { margin-top: 40px; }
	.as-nakup__faq .as-nakup__nadpis { text-align: left; }
	.as-nakup__faq .as-nakup__vse { margin-left: 0; }
	.as-faq-temata { grid-template-columns: minmax(0, 1fr); gap: 10px; margin-bottom: 32px; }
	.as-faq-tema + .as-faq-tema { margin-top: 36px; }
	.as-nakup-kontakt__in { padding-bottom: 56px; }
	.as-nakup-kontakt__karta { padding: 24px 20px; border-radius: 22px; box-shadow: 5px 5px 0 var(--as-merunka); }
	.as-nakup-kontakt__nadpis { font-size: 24px; }
	.as-nakup-kontakt__cesty { grid-template-columns: minmax(0, 1fr); gap: 10px; }
	.as-nakup-kontakt__cesta strong { font-size: 18px; }
}
