/* Trading mit Plan – ergänzende Stile zum theme.json */

body { -webkit-font-smoothing: antialiased; }
.wp-site-blocks { overflow-x: clip; }

/* ---------- Buttons ---------- */
.wp-block-button__link { display: inline-flex; align-items: center; gap: 10px; min-height: 48px; text-decoration: none; }
.wp-block-button:not(.is-style-outline) .wp-block-button__link::after {
	content: ""; width: 16px; height: 16px; flex: 0 0 auto; background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%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 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
}
.wp-block-button.is-style-outline .wp-block-button__link:hover { border-color: var(--wp--preset--color--teal) !important; color: var(--wp--preset--color--teal) !important; background: #fff !important; }
.wp-block-button.is-style-navy .wp-block-button__link { background-color: var(--wp--preset--color--navy); color: #fff; }
.wp-block-button.is-style-navy .wp-block-button__link:hover { background-color: #1f3a66; color: #fff; }

/* ---------- Überschrift mit Linie ---------- */
.wp-block-heading.is-style-linie::after {
	content: ""; display: block; width: 56px; height: 2px; margin-top: 14px; background: var(--wp--preset--color--teal);
}
.wp-block-heading.is-style-linie.has-text-align-center::after { margin-left: auto; margin-right: auto; }
.tmp-unterzeile { max-width: 62ch; margin-left: auto !important; margin-right: auto !important; }

/* ---------- Kopfbereich ---------- */
.tmp-kopf { background: #fff; }
.tmp-kopf > .wp-block-group { min-height: 64px; }
.tmp-logo, .tmp-logo img { display: block; margin: 0; }

/* ---------- Hero ---------- */
.tmp-hero.wp-block-cover { align-items: center; }
.tmp-hero .wp-block-cover__image-background {
	left: auto !important; width: 66% !important;
	-webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.55) 18%, #000 38%), linear-gradient(180deg, #000 78%, transparent 100%);
	-webkit-mask-composite: source-in;
	mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.55) 18%, #000 38%), linear-gradient(180deg, #000 78%, transparent 100%);
	mask-composite: intersect;
}
.tmp-hero .wp-block-cover__inner-container { position: static; }
.tmp-hero .wp-block-cover__inner-container > * { position: relative; z-index: 1; }
.tmp-hero .tmp-handschrift {
	position: absolute !important; z-index: 2; top: 30px; right: clamp(16px, 5vw, 80px); margin: 0 !important;
	font-size: clamp(1.3rem, 2.2vw, 1.9rem); font-weight: 500; line-height: 1.15; transform: rotate(-7deg);
}
.tmp-hero .tmp-hero-text > * + * { margin-top: 20px; }
.tmp-hero h1 { margin: 0; }
.tmp-feats { max-width: 680px; }
.tmp-feat { padding: 4px 18px; }
.tmp-feat:first-child { padding-left: 0; }
.tmp-feat + .tmp-feat { border-left: 1px solid var(--wp--preset--color--linie); }
.tmp-feat figure, .tmp-feat img { margin: 0; flex: 0 0 auto; }
.tmp-feat p { margin: 0; }

@media (max-width: 860px) {
	.tmp-hero.wp-block-cover { padding-top: 250px !important; min-height: 0 !important; }
	.tmp-hero .wp-block-cover__image-background {
		width: 100% !important; height: 240px !important; bottom: auto !important;
		-webkit-mask-image: linear-gradient(180deg, #000 70%, transparent 100%); mask-image: linear-gradient(180deg, #000 70%, transparent 100%);
	}
	.tmp-hero .tmp-handschrift { top: 14px; right: 16px; font-size: 1.2rem; }
	.tmp-feats { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
	.tmp-feat { padding: 6px 12px 6px 0; }
	.tmp-feat + .tmp-feat { border-left: 0; }
}

/* ---------- Struktur. Ruhe. Plan. ---------- */
.tmp-drei > .wp-block-column { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 0 clamp(12px, 3vw, 36px); }
.tmp-drei > .wp-block-column > * { margin: 0 !important; }
.tmp-drei > .wp-block-column + .wp-block-column { border-left: 1px solid var(--wp--preset--color--linie); }
.tmp-drei h3 { margin-top: 6px !important; }
.tmp-drei p { max-width: 34ch; }
.tmp-thumb { width: 100%; }
.tmp-thumb img { width: 100%; border-radius: 12px; box-shadow: 0 8px 22px -14px rgba(21, 41, 74, .4); }
@media (max-width: 781px) {
	.tmp-drei { gap: 34px !important; }
	.tmp-drei > .wp-block-column + .wp-block-column { border-left: 0; }
}

/* Icon im Kreis */
.wp-block-image.is-style-icon-kreis {
	width: 76px; height: 76px; border-radius: 50%; background: var(--wp--preset--color--kreis);
	display: grid !important; place-items: center; margin-left: auto; margin-right: auto;
}
.wp-block-image.is-style-icon-kreis img { width: 36px !important; height: 36px; }

/* ---------- Karten ---------- */
.wp-block-group.is-style-karte { box-shadow: 0 1px 2px rgba(21, 41, 74, .05), 0 10px 30px -16px rgba(21, 41, 74, .25); }
.wp-block-group.is-style-karte > * { margin-left: 0 !important; margin-right: 0 !important; }
.wp-block-group.is-style-karte figure { margin-top: 0; margin-bottom: 0; }
.tmp-karten > .wp-block-column { display: flex; }
.tmp-karten > .wp-block-column > .wp-block-group { width: 100%; }
@media (max-width: 980px) {
	.tmp-karten { flex-wrap: wrap !important; }
	.tmp-karten > .wp-block-column { flex-basis: calc(50% - 9px) !important; flex-grow: 0 !important; }
}
@media (max-width: 560px) {
	.tmp-karten > .wp-block-column { flex-basis: 100% !important; }
}

/* ---------- Track & Tax ---------- */
.tmp-eyebrow { font-size: .74rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; }
.tmp-foto img { border-radius: 10px; box-shadow: 0 10px 30px -16px rgba(21, 41, 74, .35); }
.tmp-foto { margin: 0; }

/* Liste mit Haken */
.wp-block-list.is-style-haken { list-style: none; padding-left: 0; display: flex; flex-direction: column; gap: 9px; color: var(--wp--preset--color--navy); font-size: .95rem; }
.wp-block-list.is-style-haken li { position: relative; padding-left: 30px; margin: 0; }
.wp-block-list.is-style-haken li::before { content: ""; position: absolute; left: 0; top: 2px; width: 20px; height: 20px; border-radius: 50%; background: var(--wp--preset--color--teal); }
.wp-block-list.is-style-haken li::after { content: ""; position: absolute; left: 6px; top: 7px; width: 8px; height: 5px; border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(-45deg); }

/* ---------- Box "Der Kompass wächst" ---------- */
.tmp-box figure, .tmp-box img { margin: 0; flex: 0 0 auto; }
.tmp-box-text > * { margin-left: 0 !important; margin-right: 0 !important; max-width: none !important; }
.tmp-box-text p { margin: 0; }
@media (min-width: 761px) { .tmp-box { flex-wrap: nowrap !important; } }
@media (max-width: 760px) { .tmp-box-text { flex-basis: calc(100% - 70px) !important; } }

/* ---------- Abschluss ---------- */
.tmp-abschluss p { max-width: 62ch; margin-left: auto; margin-right: auto; }

/* ---------- Fußbereich ---------- */
.tmp-fuss p { margin: 0; }
.tmp-claim { min-width: 220px; }
.tmp-links a { color: var(--wp--preset--color--navy); text-decoration: none; }
.tmp-links a:hover { color: var(--wp--preset--color--teal); }
.tmp-fuss .wp-block-separator { border-top-width: 1px; opacity: 1; }

/* Buttons nicht umbrechen */
.wp-block-button__link { white-space: nowrap; }
.tmp-box .wp-block-buttons { flex-shrink: 0; }
@media (max-width: 760px) {
	.tmp-box { flex-direction: column; align-items: flex-start !important; }
	.tmp-box-text { flex-basis: auto !important; width: 100%; }
}