/*
Theme Name: LasS Minimal
Theme URI: https://www.lust-auf-schoene-schuhe.de/
Author: SABU GmbH
Description: Minimalistisches, abhaengigkeitsfreies Theme fuer die Landingpage "Lust auf schoene Schuhe". Gibt den Seiteninhalt aus der Datenbank aus. Keine Frameworks, keine externen Ressourcen, keine Google Fonts, kein Page Builder.
Version: 1.1.0
Requires at least: 6.7
Tested up to: 6.8
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: lass-minimal
Tags: one-column, custom-logo, custom-menu, accessibility-ready
*/

/* ---------------------------------------------------------------
   1. Tokens
   Farben und Masse uebernommen aus dem Bestand (Bootstrap 2 /
   Cheope): Container 940px, Basisschrift 14px/20px, Text #333,
   Markenrot #d4021d, Button-Hover-Verlauf nach #ea818e.
   --------------------------------------------------------------- */

:root {
	--lass-ink:        #333333;
	--lass-ink-soft:   #87888a;
	--lass-rule:       #e0e0e0;
	--lass-bg:         #ffffff;
	--lass-bg-alt:     #f7f7f7;
	--lass-accent:     #d4021d;
	--lass-accent-lt:  #ea818e;

	--lass-measure:    940px;
	--lass-gutter:     20px;

	/* Ausschliesslich lokal vorhandene Schriften - keine Web-/Google-Fonts. */
	--lass-font:       "Helvetica Neue", Helvetica, Arial, "Liberation Sans", sans-serif;
}

/* ---------------------------------------------------------------
   2. Reset / Basis
   --------------------------------------------------------------- */

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

html { -webkit-text-size-adjust: 100%; }

body {
	margin: 0;
	background: var(--lass-bg);
	color: var(--lass-ink);
	font-family: var(--lass-font);
	font-size: 14px;
	line-height: 20px;
}

img,
svg,
iframe,
video { max-width: 100%; height: auto; }

img { border: 0; }

a {
	color: var(--lass-accent);
	text-decoration: none;
}

a:hover,
a:focus { text-decoration: underline; }

:focus-visible {
	outline: 2px solid var(--lass-accent);
	outline-offset: 2px;
}

.lass-skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 100;
	background: var(--lass-bg);
	color: var(--lass-ink);
	padding: 10px 14px;
}

.lass-skip-link:focus { left: 0; }

.lass-wrap {
	width: 100%;
	max-width: var(--lass-measure);
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--lass-gutter);
	padding-right: var(--lass-gutter);
}

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

/* ---------------------------------------------------------------
   3. Kopfbereich
   Bestand: Logo links (span7), Servicemenue rechts (span5).
   --------------------------------------------------------------- */

.lass-header { padding: 25px 0 15px; }

.lass-header-inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 15px;
}

.lass-branding { margin: 0; }
.lass-branding img { max-height: 90px; width: auto; }

.lass-site-title {
	margin: 0;
	font-size: 24px;
	line-height: 1.2;
	font-weight: bold;
}

.lass-site-title a { color: var(--lass-ink); }

.lass-site-description {
	margin: 4px 0 0;
	font-size: 13px;
	color: var(--lass-ink-soft);
}

.lass-topbar ul {
	display: flex;
	flex-wrap: wrap;
	gap: 18px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 13px;
}

.lass-topbar a { color: var(--lass-ink-soft); }
.lass-topbar a:hover,
.lass-topbar a:focus { color: var(--lass-accent); }

/* ---------------------------------------------------------------
   4. Navigation
   --------------------------------------------------------------- */

.lass-nav {
	border-top: 1px solid var(--lass-rule);
	border-bottom: 1px solid var(--lass-rule);
	margin-bottom: 25px;
}

.lass-nav ul {
	display: flex;
	flex-wrap: wrap;
	gap: 0 28px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.lass-nav li { position: relative; }

.lass-nav a {
	display: block;
	padding: 12px 0;
	color: var(--lass-ink);
	font-size: 14px;
	font-weight: bold;
	text-transform: uppercase;
	letter-spacing: .04em;
}

.lass-nav a:hover,
.lass-nav a:focus,
.lass-nav .current-menu-item > a { color: var(--lass-accent); text-decoration: none; }

.lass-nav .sub-menu {
	display: none;
	position: absolute;
	left: 0;
	top: 100%;
	z-index: 20;
	min-width: 210px;
	flex-direction: column;
	gap: 0;
	background: var(--lass-bg);
	border: 1px solid var(--lass-rule);
	padding: 4px 0;
}

.lass-nav li:hover > .sub-menu,
.lass-nav li:focus-within > .sub-menu { display: flex; }

.lass-nav .sub-menu a {
	padding: 7px 14px;
	font-weight: normal;
	text-transform: none;
	letter-spacing: 0;
}

/* ---------------------------------------------------------------
   5. Inhalt
   --------------------------------------------------------------- */

.lass-main { padding-bottom: 40px; }

.lass-entry-title {
	margin: 0 0 18px;
	font-size: 26px;
	line-height: 1.25;
	font-weight: normal;
}

.lass-content > *:first-child { margin-top: 0; }
.lass-content > *:last-child  { margin-bottom: 0; }

.lass-content h1,
.lass-content h2,
.lass-content h3,
.lass-content h4 {
	margin: 26px 0 12px;
	line-height: 1.3;
	font-weight: normal;
}

.lass-content h1 { font-size: 26px; }
.lass-content h2 { font-size: 22px; }
.lass-content h3 { font-size: 18px; }
.lass-content h4 { font-size: 16px; }

.lass-content p,
.lass-content ul,
.lass-content ol { margin: 0 0 15px; }

.lass-content ul,
.lass-content ol { padding-left: 22px; }

.lass-content li { margin-bottom: 4px; }

.lass-content blockquote {
	margin: 20px 0;
	padding-left: 16px;
	border-left: 3px solid var(--lass-rule);
	font-style: italic;
	color: var(--lass-ink-soft);
}

.lass-content table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 18px;
}

.lass-content th,
.lass-content td {
	padding: 8px 10px;
	border: 1px solid var(--lass-rule);
	text-align: left;
}

.lass-content figure { margin: 20px 0; }

.lass-content figcaption {
	margin-top: 6px;
	font-size: 12px;
	color: var(--lass-ink-soft);
}

.alignleft   { float: left;  margin: 0 20px 12px 0; }
.alignright  { float: right; margin: 0 0 12px 20px; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.alignwide,
.alignfull   { max-width: 100%; }

/* --- Call-to-Action (Shortcode [call_two]) ------------------------
   Bestand: <div class="call-to-action-two"> mit .incipit + .call-btn,
   untereinander, linksbuendig.                                     */

.lass-cta { margin: 25px 0; }

.lass-cta-text > *:first-child { margin-top: 0; }
.lass-cta-text > *:last-child  { margin-bottom: 0; }

.lass-cta-action { margin: 15px 0 0; }

.lass-cta--horizontal {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 15px;
}

.lass-cta--horizontal .lass-cta-action { margin: 0; }

/* --- Button -------------------------------------------------------
   Bestand: .btn.btn-large, Flaeche #D4021D, Text #FFFFFF,
   Hover-Verlauf #D4021D -> #ea818e, Radius 5px, Padding 9px 14px.   */

.lass-content .lass-button,
.lass-content a.button,
.lass-content a.btn {
	display: inline-block;
	padding: 9px 14px;
	background-color: var(--lass-accent);
	color: #ffffff;
	font-size: 16px;
	line-height: normal;
	text-align: center;
	text-decoration: none;
	border: 0;
	border-radius: 5px;
	cursor: pointer;
}

.lass-content .lass-button--large { padding: 11px 22px; }

.lass-content .lass-button:hover,
.lass-content .lass-button:focus,
.lass-content a.button:hover,
.lass-content a.button:focus,
.lass-content a.btn:hover,
.lass-content a.btn:focus {
	color: #ffffff;
	text-decoration: none;
	background-image: linear-gradient(to bottom, var(--lass-accent) 0%, var(--lass-accent-lt) 100%);
}

/* ---------------------------------------------------------------
   6. Fussbereich
   Bestand: SABU-Logo links, Linkliste rechts.
   --------------------------------------------------------------- */

.lass-footer {
	border-top: 1px solid var(--lass-rule);
	padding: 22px 0 30px;
	font-size: 13px;
	color: var(--lass-ink-soft);
}

.lass-footer-inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 15px;
}

.lass-footer-mark { margin: 0; }
.lass-footer-mark img { max-height: 48px; width: auto; }

.lass-footer-meta {
	margin: 0;
	text-align: right;
	line-height: 1.6;
}

.lass-footer a { color: var(--lass-ink-soft); }
.lass-footer a:hover,
.lass-footer a:focus { color: var(--lass-accent); }

.lass-footer ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 4px 14px;
	margin: 0 0 4px;
	padding: 0;
	list-style: none;
}

.lass-colophon { margin: 0; }

/* --- Zurueck nach oben ------------------------------------------- */

.lass-to-top {
	display: inline-block;
	margin-top: 12px;
	padding: 5px 10px;
	background-color: var(--lass-accent);
	color: #ffffff !important;
	font-size: 12px;
	border-radius: 3px;
}

.lass-to-top:hover,
.lass-to-top:focus { text-decoration: none; opacity: .85; }

/* ---------------------------------------------------------------
   7. Mobil
   --------------------------------------------------------------- */

@media (max-width: 767px) {
	.lass-header { padding: 18px 0 12px; }
	.lass-header-inner { justify-content: center; text-align: center; }
	.lass-branding img { max-height: 70px; }
	.lass-topbar ul { justify-content: center; }
	.lass-nav ul { gap: 0 18px; }
	.lass-nav a { padding: 10px 0; font-size: 13px; }
	.lass-nav .sub-menu { position: static; border: 0; padding: 0 0 0 14px; }
	.lass-footer-inner { justify-content: center; text-align: center; }
	.lass-footer-meta { text-align: center; }
	.lass-footer ul { justify-content: center; }
	.lass-content h2 { font-size: 20px; }
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: .01ms !important;
		transition-duration: .01ms !important;
		scroll-behavior: auto !important;
	}
}