/*
Theme Name:   SEKER Technical Assurance
Theme URI:    https://ingenieurbuero-metallbau.de/
Description:  Child Theme fuer den Auftritt Independent Technical Assurance. Alle Gestaltungsgroessen sind zentral in theme.json hinterlegt. Das Parent Theme wird nicht veraendert.
Author:       Ingenieurbuero Seker
Template:     twentytwentyfive
Version: 0.8.0
Requires at least: 6.6
Tested up to: 6.9
Requires PHP: 8.0
Text Domain:  seker-ta
*/

/* Nur Feinheiten, die theme.json nicht abbildet.
   Farben und Abstaende NIE hier hart setzen, sondern als Token in theme.json. */

:root { --ta-transition: 160ms ease; }

/* Fokus sichtbar halten - Barrierefreiheit */
a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible {
	outline: 2px solid var(--wp--preset--color--akzent);
	outline-offset: 2px;
}

img { max-width: 100%; height: auto; }

/* Listen ohne Aufzaehlungszeichen (Footer, Aspektlisten) */
.is-style-none { list-style: none; padding-left: 0; margin-left: 0; }
.is-style-none li { margin: 0 0 .4rem 0; }

/* Karte */
.ta-card {
	background: var(--wp--preset--color--grund);
	border: 1px solid var(--wp--preset--color--linie);
	border-radius: var(--wp--custom--radius--m);
	padding: var(--wp--custom--abstand--l);
	height: 100%;
}

/* Kleine Auszeichnungszeile ueber einer Ueberschrift */
.ta-eyebrow {
	font-size: .8125rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--text-sekundaer);
	margin-bottom: var(--wp--custom--abstand--s);
}

/* Laufende Nummer vor einem Leistungstitel */
.ta-num {
	display: inline-block;
	font-variant-numeric: tabular-nums;
	font-size: .8125rem;
	letter-spacing: .1em;
	color: var(--wp--preset--color--akzent);
	border-bottom: 2px solid var(--wp--preset--color--akzent);
	padding-bottom: 2px;
	margin-bottom: var(--wp--custom--abstand--s);
}

/* Problemsituation: Frage abgesetzt vom Titel */
.ta-frage { color: var(--wp--preset--color--text-sekundaer); }

/* Prozesskette Buyer's Technical Representative */
.ta-kette { list-style: none; padding-left: 0; margin: 0; counter-reset: ta; }
.ta-kette li {
	counter-increment: ta;
	position: relative;
	padding: .55rem 0 .55rem 3.25rem;
	border-bottom: 1px solid var(--wp--preset--color--linie);
}
.ta-kette li:last-child { border-bottom: 0; }
.ta-kette li::before {
	content: counter(ta, decimal-leading-zero);
	position: absolute; left: 0; top: .55rem;
	font-variant-numeric: tabular-nums;
	font-size: .8125rem;
	color: var(--wp--preset--color--akzent);
	letter-spacing: .08em;
}

/* Schematische Darstellung des Inspection Report */
.ta-report {
	background: var(--wp--preset--color--grund);
	border: 1px solid var(--wp--preset--color--linie);
	border-radius: var(--wp--custom--radius--m);
	overflow: hidden;
}
.ta-report__kopf {
	background: var(--wp--preset--color--flaeche-tief);
	border-bottom: 1px solid var(--wp--preset--color--linie);
	padding: .75rem var(--wp--custom--abstand--m);
	font-size: .75rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--text-sekundaer);
}
.ta-report ol { list-style: none; margin: 0; padding: 0; counter-reset: rp; }
.ta-report li {
	counter-increment: rp;
	display: flex; gap: 1rem; align-items: baseline;
	padding: .6rem var(--wp--custom--abstand--m);
	border-bottom: 1px solid var(--wp--preset--color--linie);
	font-size: .9375rem;
}
.ta-report li:last-child { border-bottom: 0; }
.ta-report li::before {
	content: counter(rp, decimal-leading-zero);
	font-variant-numeric: tabular-nums;
	font-size: .75rem;
	color: var(--wp--preset--color--text-sekundaer);
	min-width: 1.75rem;
}

/* Qualifikationszeile */
.ta-quali { list-style: none; padding-left: 0; margin: 0; }
.ta-quali li {
	padding: .5rem 0;
	border-bottom: 1px solid var(--wp--preset--color--linie);
}
.ta-quali li:last-child { border-bottom: 0; }

/* Hinweisblock mit Akzentkante */
.ta-hinweis {
	border-left: 3px solid var(--wp--preset--color--akzent);
	padding: var(--wp--custom--abstand--s) 0 var(--wp--custom--abstand--s) var(--wp--custom--abstand--m);
}

@media (max-width: 480px) {
	.ta-card { padding: var(--wp--custom--abstand--m); }
	.ta-kette li { padding-left: 2.75rem; }
}


/* ---------------------------------------------------------------
   Navigation: Umschaltpunkt auf 1280 px verschieben.
   Der Kernblock wechselt erst unter 600 px auf das Overlay. Mit sieben
   Hauptpunkten bricht die Navigation dazwischen auf drei Zeilen um.
   Die folgenden Regeln spiegeln das Verhalten des Kernblocks unterhalb
   von 1280 px; die Regeln fuer den geoeffneten Zustand (.is-menu-open)
   stammen weiterhin aus dem Kern.
   --------------------------------------------------------------- */
@media (max-width: 1199px) {
	.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}
	.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
	}
}


/* Tabellen - Spaltenbreiten */
.wp-block-table table { width: 100%; }
.wp-block-table th { text-align: left; font-weight: 650; }
.wp-block-table td:first-child,
.wp-block-table th:first-child { white-space: nowrap; }

/* Luft vor Zwischenueberschriften */
.wp-block-column > h3:not(:first-child),
.wp-block-group > h3:not(:first-child) { margin-top: var(--wp--preset--spacing--30); }
.wp-block-column > .wp-block-list + h3,
.wp-block-group > .wp-block-list + h3 { margin-top: var(--wp--preset--spacing--40); }

/* Statementband */
.ta-statement h2 { color: #FFFFFF !important; font-size: var(--wp--preset--font-size--heading-lg) !important; line-height: 1.4; }
.ta-statement p { color: #C9CFD4 !important; }

/* Auftrag 09 - lange URLs und Woerter umbrechen statt ueberlaufen */
main a, main p, main li, main td { overflow-wrap: anywhere; }

/* Auftrag 09 - lange deutsche Komposita in Ueberschriften umbrechen */
main h1, main h2, main h3, main h4 { overflow-wrap: anywhere; hyphens: auto; }
main p, main li { hyphens: auto; }