/*
Theme Name:        EMO 2026
Theme URI:         https://emosystems.de/
Author:            EMO Systems GmbH
Author URI:        https://emosystems.de/
Description:       Apple-inspired classic WordPress theme for the 2026 emosystems.de redesign. Hand-authored, no parent theme, no page builder, no theme.json.
Version:           0.1.0
Requires at least: 6.0
Requires PHP:      8.0
License:           Proprietary, EMO Systems GmbH
Text Domain:       emo2026
*/

/* Theme styles are authored by hand, start here. */

/* ---------- Base reset ----------
 *
 * Deliberately minimal: only the user-agent defaults that actively fight the
 * layout. This is NOT a normalize.css, and it must not grow into one, a
 * blanket `box-sizing: border-box` would silently resize every component that
 * was authored against the content-box default.
 *
 * body margin: the UA default is 8px on all four sides. It went unnoticed
 * because the page background and the navbar are both white, so the 8px strip
 * above the sticky bar was invisible, but it made the header read as 57px tall
 * (8 + 48 + 1px border) with the logo centred in only the lower 48px of it,
 * i.e. about 4.5px low. It also inset every full-bleed band by 8px on each
 * side. Zeroing it is the fix for both.
 */
html {
	/* Stop mobile Safari from inflating text in landscape. */
	-webkit-text-size-adjust: 100%;
}

body {
	margin: 0;
	/* Sticky footer: the page is a full-height flex column, the main
	   content flexes to absorb spare height, so on short pages (404,
	   thin legal pages) the footer still sits at the viewport bottom.
	   Safe with the position:sticky header, nothing sets overflow on
	   html/body. 100vh line is the fallback for engines without dvh. */
	min-height: 100vh;
	min-height: 100dvh;
	display: flex;
	flex-direction: column;
}

main#main {
	flex: 1 0 auto;
}

/* WooCommerce single-product pages wrap main#main in the WC fallback
   wrapper <div id="primary" class="content-area">; pass the flex
   stretch through it so main still absorbs the spare height. */
#primary.content-area {
	flex: 1 0 auto;
	display: flex;
	flex-direction: column;
}

#primary.content-area > main#main {
	flex: 1 0 auto;
}

.site-footer {
	flex-shrink: 0;
	margin-top: auto;
}

/* WP-required accessibility primitive: visually hide an element while keeping
   it readable by screen readers. */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}
.screen-reader-text:focus {
	background-color: #f1f1f1;
	clip: auto !important;
	clip-path: none;
	color: #21759b;
	display: block;
	font-size: 1rem;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}

/* Typographic ground. Every subsystem sets its own face from the tokens,
 * but anything unstyled used to fall through to the browser serif default,
 * which is how Times leaked into the first catalog build. The body rule
 * makes the token stack the floor for everything. */
body {
	font-family: var(--font-sans, "Inter", "Helvetica Neue", Helvetica, Arial, sans-serif);
}

/* ISO/IEC 11801 augmented classes (E_A, F_A): the A sits small and
 * lowered after the class letter, the way the standard writes it. Set
 * here because the class appears in the shop, on product pages and in
 * the comparison table. line-height: 0 keeps the line box steady. */
sub.emo-class-sub {
	font-size: 0.72em;
	line-height: 0;
	vertical-align: baseline;
	position: relative;
	bottom: -0.22em;
	margin-left: 0.04em;
}