/*
Theme Name: TEAM SNOR Interim
Theme URI: https://snor.at
Author: TEAM SNOR
Author URI: https://snor.at
Description: Einseitige Interims-Website für TEAM SNOR: Einstieg, Hinweis auf das Portfolio, Haltung, Leistungen, betreute Marken, Kontakt. Schwarz und Weiß, Archivo lokal eingebunden.
Version: 1.0.0
Requires at least: 6.6
Tested up to: 6.8
Requires PHP: 8.0
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: teamsnor-interim
*/

/* ---------- Grundlagen ---------- */

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
[id] { scroll-margin-top: 24px; }

h1, h2 { font-stretch: 125%; }

a:hover { text-underline-offset: 4px; text-decoration-thickness: 1px; }
:where(a, button, input, select, textarea, summary):focus-visible { outline: 2px solid #000; outline-offset: 3px; }

/* ---------- Typo-Klassen ---------- */

.ts-label, h2.ts-label {
	font-size: 12px !important; font-weight: 600 !important; letter-spacing: 0.12em !important;
	text-transform: uppercase; font-stretch: 100%; line-height: 1.4 !important; color: #5E5E5E; margin: 0;
}
.ts-display {
	font-size: var(--wp--preset--font-size--display) !important; line-height: 0.88 !important;
	font-weight: 700 !important; letter-spacing: -0.03em !important; font-stretch: 125%; margin: 0;
}
.ts-lead { font-size: var(--wp--preset--font-size--lead); line-height: 1.25; letter-spacing: -0.015em; }
.ts-gross { font-size: var(--wp--preset--font-size--gross); line-height: 1.4; }
.ts-grau, .ts-grau a { color: #5E5E5E; }
.ts-mass { max-width: 820px; margin-left: 0 !important; margin-right: auto !important; }

.is-style-platzhalter { color: #5E5E5E; }
.is-style-platzhalter::before {
	content: "Platzhalter"; display: block; margin-bottom: 6px;
	font-size: 12px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase;
}

/* ---------- Abschnitte ---------- */

.ts-linie-oben { border-top: 1px solid #000; padding-top: 20px !important; }
.ts-linie-hell { border-top: 1px solid #E3E3E3; padding-top: 16px !important; }
.ts-abschnitt { margin-top: clamp(104px, 11vw, 184px) !important; }
.ts-abschnitt-klein { margin-top: clamp(48px, 6vw, 96px) !important; }
.wp-block-columns { gap: 24px; }
.ts-spalten-luftig { row-gap: 48px !important; }
.ts-nummer { font-size: 12px; font-weight: 600; letter-spacing: 0.12em; color: #5E5E5E; margin: 0; }
.ts-schritt { font-size: 26px !important; }
.ts-punkte { border-top: 1px solid #E3E3E3; padding-top: 10px; line-height: 2.2; font-weight: 500; }

.ts-haltung {
	max-width: 1100px; margin-left: 0 !important; margin-right: auto !important;
	font-size: clamp(30px, 3.8vw, 56px) !important; line-height: 1.1 !important; font-weight: 500; letter-spacing: -0.025em;
}

/* ---------- Portfolio-Hinweis ---------- */

.ts-portfolio-hinweis { background: #000; color: #fff; padding: clamp(28px, 4vw, 56px) !important; gap: 24px 40px !important; }
.ts-portfolio-hinweis .ts-label { color: #BDBDBD; }
.ts-portfolio-text { flex: 1 1 420px; }
.ts-portfolio-satz { font-size: clamp(24px, 3vw, 44px) !important; line-height: 1.12; font-weight: 500; letter-spacing: -0.02em; margin-top: 16px !important; }
.ts-portfolio-link { margin: 0; font-size: clamp(17px, 1.8vw, 26px); font-weight: 600; overflow-wrap: anywhere; }
.ts-portfolio-link a { color: #fff; text-decoration: underline; text-underline-offset: 6px; text-decoration-thickness: 2px; }

/* ---------- Marken ---------- */

.ts-markenliste {
	font-size: clamp(28px, 4.2vw, 64px) !important; line-height: 1.12; font-weight: 500;
	letter-spacing: -0.025em; margin-top: clamp(32px, 4vw, 64px) !important;
}

/* ---------- Kontaktband ---------- */

.ts-kontaktband { background: #000; color: #fff; padding-top: clamp(72px, 8vw, 128px) !important; padding-bottom: clamp(72px, 8vw, 128px) !important; }
.ts-kontaktband a { color: #fff; }
.ts-kontaktband .ts-label, .ts-kontaktband .ts-grau, .ts-kontaktband .ts-grau a { color: #BDBDBD; }
.ts-mail-gross {
	font-size: clamp(34px, 7vw, 112px) !important; line-height: 1 !important; font-weight: 600 !important;
	letter-spacing: -0.045em !important; overflow-wrap: anywhere; margin: 24px 0 16px !important;
}

/* ---------- Kopf- und Fußzeile ---------- */

.ts-kopf { padding-top: 24px; padding-bottom: 24px; }
.ts-kopf .wp-block-site-logo img { width: 64px; height: 64px; }
@media (max-width: 600px) { .ts-kopf .wp-block-site-logo img { width: 48px; height: 48px; } }
.ts-kopf .wp-block-navigation__responsive-container.is-menu-open { padding: 24px clamp(20px, 4.5vw, 64px); }
.ts-kopf .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	gap: 16px; font-size: 32px; font-weight: 600; font-stretch: 125%;
}
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close { min-width: 44px; min-height: 44px; font-weight: 600; }

.ts-fuss { font-size: 15px; padding-top: 32px; padding-bottom: 40px; }
.ts-fuss .wp-block-site-logo img { width: 48px; height: 48px; }