/* Quiet seasonal surfaces, using the calendar's established holiday colours. */
.dsf-holiday-types { padding-block: var(--dsf-space-7); background: var(--dsf-color-surface); scroll-margin-block-start: calc(var(--dsf-header-height, 5rem) + 1rem); }
.dsf-holiday-types__lead { max-inline-size: var(--dsf-measure); margin-block-start: var(--dsf-space-3); color: var(--dsf-color-muted); }
.dsf-holiday-types__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--dsf-space-5); margin-block-start: var(--dsf-space-5); padding: 0; list-style: none; }
.dsf-holiday-types__grid > li { display: flex; min-inline-size: 0; }
.dsf-holiday-types__card[data-holiday-type="winterferien"] { --holiday-accent: #5372C0; }
.dsf-holiday-types__card[data-holiday-type="osterferien"] { --holiday-accent: #327B62; }
.dsf-holiday-types__card[data-holiday-type="pfingstferien"] { --holiday-accent: #8A5DB3; }
.dsf-holiday-types__card[data-holiday-type="sommerferien"] { --holiday-accent: #B67A14; }
.dsf-holiday-types__card[data-holiday-type="herbstferien"] { --holiday-accent: #BF613E; }
.dsf-holiday-types__card[data-holiday-type="weihnachtsferien"] { --holiday-accent: #2F657C; }
.dsf-holiday-types__card {
	display: flex;
	flex-direction: column;
	gap: var(--dsf-space-3);
	inline-size: 100%;
	min-block-size: 13rem;
	padding: var(--dsf-space-5);
	border: 1px solid color-mix(in srgb, var(--holiday-accent) 22%, var(--dsf-color-surface));
	border-radius: var(--dsf-radius-large);
	background: color-mix(in srgb, var(--holiday-accent) 6%, var(--dsf-color-surface));
	color: var(--dsf-color-primary);
	text-decoration: none;
	transition: border-color var(--dsf-duration-fast) var(--dsf-ease), background-color var(--dsf-duration-fast) var(--dsf-ease);
}
.dsf-holiday-types__title { display: flex; align-items: center; gap: var(--dsf-space-3); }
.dsf-holiday-types__title > svg { flex-shrink: 0; color: var(--holiday-accent); }
.dsf-holiday-types__title h3 { font-size: var(--dsf-text-lead); font-weight: 800; line-height: 1.35; }
.dsf-holiday-types__card > p { flex: 1; color: var(--dsf-color-muted); font-size: var(--dsf-text-small); }
.dsf-holiday-types__cta { display: flex; align-items: center; justify-content: space-between; gap: var(--dsf-space-3); margin-block-start: var(--dsf-space-3); font-size: var(--dsf-text-small); font-weight: 600; }
.dsf-holiday-types__cta svg { flex-shrink: 0; color: var(--holiday-accent); transition: transform var(--dsf-duration-fast) var(--dsf-ease); }
.dsf-holiday-types__card:focus-visible .dsf-holiday-types__cta { text-decoration: underline; text-underline-offset: 0.2em; }
.dsf-holiday-types__card:focus-visible .dsf-holiday-types__cta svg { transform: translateX(3px); }
@media (hover: hover) {
	.dsf-holiday-types__card:hover { border-color: var(--holiday-accent); background: color-mix(in srgb, var(--holiday-accent) 10%, var(--dsf-color-surface)); color: var(--dsf-color-primary); }
	.dsf-holiday-types__card:hover .dsf-holiday-types__cta { text-decoration: underline; text-underline-offset: 0.2em; }
	.dsf-holiday-types__card:hover .dsf-holiday-types__cta svg { transform: translateX(3px); }
}
@media (max-width: 64rem) { .dsf-holiday-types__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 38rem) { .dsf-holiday-types { padding-block: var(--dsf-space-6); } .dsf-holiday-types__grid { grid-template-columns: minmax(0, 1fr); gap: var(--dsf-space-4); } .dsf-holiday-types__card { min-block-size: 0; } }
@media print { .dsf-holiday-types__card { break-inside: avoid; } }