/*
Theme Name: LOLWERK Coming Soon
Theme URI: https://lolwerk.com
Author: LOLWERK
Description: Minimalistische Startseite für LOLWERK, solange die richtige Website entsteht. Texte, E-Mail und Social-Links sind unter Design › Customizer › LOLWERK Startseite änderbar. Schriften liegen lokal im Theme (keine Google-Fonts-Verbindung).
Version: 1.1.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: lolwerk
*/

/* ---------- Schriften (lokal, DSGVO-freundlich) ---------- */
@font-face {
	font-family: "Anton";
	src: url("assets/fonts/anton-latin-400-normal.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Montserrat";
	src: url("assets/fonts/montserrat-latin-500-normal.woff2") format("woff2");
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Montserrat";
	src: url("assets/fonts/montserrat-latin-600-normal.woff2") format("woff2");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Montserrat";
	src: url("assets/fonts/montserrat-latin-700-normal.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

/* ---------- Farben ---------- */
:root {
	--lw-pink: #FC3799;
	--lw-lime: #CDF211;
	--lw-ink: #141114;
	--lw-text: #FFFFFF;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

html,
body {
	margin: 0;
	padding: 0;
}

body {
	min-height: 100vh;
	min-height: 100svh;
	background: var(--lw-pink);
	color: var(--lw-text);
	font-family: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
	font-weight: 600;
	-webkit-font-smoothing: antialiased;
}

a {
	color: var(--lw-text);
	text-underline-offset: 4px;
	text-decoration-thickness: 2px;
}
a:hover {
	text-decoration-thickness: 3px;
}
a:focus-visible {
	outline: 3px solid var(--lw-text);
	outline-offset: 4px;
	border-radius: 4px;
}

.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* ---------- Startseite ---------- */
.lw-page {
	min-height: 100vh;
	min-height: 100svh;
	display: flex;
	flex-direction: column;
	padding: clamp(24px, 4vw, 48px) clamp(20px, 4vw, 48px);
}

.lw-main {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	gap: clamp(28px, 4vh, 44px);
	padding: 24px 0 48px;
}

.lw-logo {
	display: block;
	width: min(52vw, 280px);
	height: auto;
	animation: lw-float 5s ease-in-out infinite;
	transform-origin: 20% 100%;
}

.lw-status {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	padding: 9px 16px;
	border: 2px solid var(--lw-text);
	border-radius: 999px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}
.lw-status__dot {
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: var(--lw-text);
	animation: lw-pulse 1.6s ease-in-out infinite;
}

.lw-title {
	margin: 0;
	font-family: "Anton", Impact, "Arial Narrow", sans-serif;
	font-weight: 400;
	font-size: clamp(52px, 9vw, 120px);
	line-height: 0.95;
	text-transform: uppercase;
	letter-spacing: 0.005em;
}

.lw-text {
	margin: 0;
	max-width: 30em;
	font-size: clamp(16px, 1.6vw, 19px);
	line-height: 1.6;
}

.lw-links {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px 28px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 16px;
	font-weight: 700;
}
.lw-links a {
	display: inline-block;
	padding: 10px 0;
}

.lw-footer {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 8px 24px;
	font-size: 13px;
	font-weight: 600;
}
.lw-footer p {
	margin: 0;
}
.lw-footer nav {
	display: flex;
	gap: 20px;
}

/* ---------- Unterseiten (Impressum, Datenschutz) ---------- */
.lw-legal {
	width: 100%;
	max-width: 720px;
	margin: 0 auto;
	padding: 32px 0 64px;
}
.lw-legal__home img {
	display: block;
	width: 96px;
	height: auto;
}
.lw-legal h1 {
	margin: 40px 0 24px;
	font-family: "Anton", Impact, "Arial Narrow", sans-serif;
	font-weight: 400;
	font-size: clamp(40px, 6vw, 64px);
	line-height: 1;
	text-transform: uppercase;
}
.lw-legal__content {
	font-size: 16px;
	line-height: 1.7;
}
.lw-legal__content h2,
.lw-legal__content h3 {
	margin: 2em 0 0.5em;
	font-weight: 700;
	line-height: 1.3;
}

/* ---------- Bewegung ---------- */
@keyframes lw-float {
	0%, 100% { transform: rotate(-2deg) translateY(0); }
	50% { transform: rotate(2deg) translateY(-6px); }
}
@keyframes lw-pulse {
	0%, 100% { opacity: 1; transform: scale(1); }
	50% { opacity: 0.35; transform: scale(0.75); }
}
@media (prefers-reduced-motion: reduce) {
	.lw-logo,
	.lw-status__dot {
		animation: none;
	}
}

@media (max-width: 560px) {
	.lw-footer {
		justify-content: center;
		text-align: center;
	}
}