/*
Theme Name: Antarktis Marathon Shop
Theme URI: https://shop.antarktismarathon.de/
Author: Antarktismarathon Chemnitz
Description: Shop-Theme für den Antarktismarathon Chemnitz. Übernimmt Farben, Schriften und Anmutung der Hauptseite antarktismarathon.de und erweitert sie um WooCommerce-Ansichten.
Version: 1.0.0
Requires at least: 6.5
Requires PHP: 8.0
License: GPLv2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: antarktis-shop
Tags: e-commerce, custom-colors, custom-menu, translation-ready
WC requires at least: 8.0
WC tested up to: 11.0
*/

/* ==========================================================================
   Design-Tokens - aus antarktismarathon.de uebernommen
   ========================================================================== */

:root {
	/* Farben */
	--am-navy:        #2c344c;  /* Kopfbereich, Primaerbuttons */
	--am-navy-deep:   #1e2540;  /* Kopfbereich-Verlauf unten */
	--am-navy-soft:   #3a4462;  /* Rahmen auf dunklem Grund */
	--am-teal:        #22a6a4;  /* Überschriften, Akzent */
	--am-teal-dark:   #157372;  /* Hover */
	--am-teal-deeper: #198483;
	--am-mint:        #e4f0ed;  /* helle Sektionsflaechen */
	--am-grey-bg:     #eceff2;
	--am-ink:         #090a0a;  /* Textfarbe */
	--am-grey:        #797f7f;  /* gedaempfter Text */
	--am-grey-line:   #dfe4e8;
	/* Orange der Hauptseite - im Shop derzeit nicht verwendet,
	   nur als Reserve dokumentiert. */
	--am-orange:      #e96f05;
	--am-orange-dark: #c85c02;
	--am-blue-pill:   #5881b0;  /* aktiver Navigationspunkt der Hauptseite */
	--am-white:       #ffffff;
	--am-error:       #d00f0a;

	/* Farbe aller Kauf-Aktionen (In den Warenkorb, Kasse, Bestellen).
	   Bewusst an einer Stelle gebündelt - ein Wechsel wirkt überall.
	   Türkis aus derselben Familie wie Überschriften und Preise. */
	--am-cta:         #157372;  /* Kontrast auf Weiß 5,6:1 */
	--am-cta-dark:    #0f5b5a;  /* Hover, 7,8:1 */
	--am-cta-text:    #ffffff;

	/* Signalflächen: Angebots-Fahne und Warenkorb-Zähler.
	   Helleres Türkis mit dunkler Schrift - weiße Schrift käme
	   hier nur auf 3,0:1 und wäre nicht barrierefrei. */
	--am-badge:       #22a6a4;
	--am-badge-text:  #010a1b;  /* Kontrast 6,7:1 */

	/* Schrift */
	--am-font-head: 'BioRhyme', Georgia, serif;
	--am-font-body: 'Cabin', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;

	/* Layout */
	--am-wrap: 1120px;
	--am-wrap-narrow: 760px;
	--am-radius: 4px;
	--am-radius-lg: 10px;
	--am-shadow: 0 2px 10px rgba(44, 52, 76, .08);
	--am-shadow-lift: 0 10px 28px rgba(44, 52, 76, .16);
	--am-transition: .18s ease;
}

/* ==========================================================================
   Grundlagen
   ========================================================================== */

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

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

body {
	margin: 0;
	font-family: var(--am-font-body);
	font-size: 17px;
	line-height: 1.65;
	color: var(--am-ink);
	background: var(--am-white);
	overflow-wrap: break-word;
}

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

a { color: var(--am-teal-dark); text-decoration: none; transition: color var(--am-transition); }
a:hover, a:focus { color: var(--am-teal); text-decoration: underline; }

h1, h2, h3, h4, h5, h6 {
	font-family: var(--am-font-head);
	color: var(--am-teal);
	line-height: 1.22;
	font-weight: 400;
	margin: 0 0 .6em;
	letter-spacing: -.01em;
}

h1 { font-size: clamp(1.9rem, 4vw, 2.9rem); }
h2 { font-size: clamp(1.5rem, 3vw, 2.1rem); }
h3 { font-size: clamp(1.2rem, 2.2vw, 1.5rem); }
h4 { font-size: 1.15rem; }

p { margin: 0 0 1.15em; }
ul, ol { margin: 0 0 1.15em; padding-left: 1.35em; }
li { margin-bottom: .35em; }

blockquote {
	margin: 1.6em 0;
	padding: .3em 0 .3em 1.3em;
	border-left: 3px solid var(--am-teal);
	color: var(--am-grey);
	font-style: italic;
}

hr { border: 0; border-top: 1px solid var(--am-grey-line); margin: 2.5em 0; }

code, pre {
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: .9em;
	background: var(--am-grey-bg);
	border-radius: var(--am-radius);
}
code { padding: .15em .4em; }
pre { padding: 1em; overflow-x: auto; }

table { width: 100%; border-collapse: collapse; margin-bottom: 1.5em; }
th, td { padding: .7em .8em; text-align: left; border-bottom: 1px solid var(--am-grey-line); }
th { font-weight: 600; background: var(--am-grey-bg); }

/* Tastatur-Fokus sichtbar halten */
:focus-visible {
	outline: 3px solid var(--am-teal);
	outline-offset: 2px;
	border-radius: 2px;
}

/* Nur für Screenreader */
.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0 0 0 0);
	white-space: nowrap; border: 0;
}
.skip-link {
	position: absolute; left: -9999px; top: 0;
	z-index: 200;
	background: var(--am-navy); color: #fff;
	padding: .8em 1.3em; font-weight: 600;
}
.skip-link:focus { left: 1rem; top: 1rem; color: #fff; text-decoration: none; }

/* ==========================================================================
   Layout-Helfer
   ========================================================================== */

.am-wrap { width: 100%; max-width: var(--am-wrap); margin: 0 auto; padding: 0 22px; }
.am-wrap--narrow { max-width: var(--am-wrap-narrow); }

.am-section { padding: clamp(2.4rem, 6vw, 4.6rem) 0; }
.am-section--mint { background: var(--am-mint); }
.am-section--grey { background: var(--am-grey-bg); }

.am-section__head { text-align: center; max-width: 680px; margin: 0 auto clamp(1.8rem, 4vw, 3rem); }
.am-section__head p { color: var(--am-grey); margin-bottom: 0; }

.am-eyebrow {
	display: block;
	font-family: var(--am-font-body);
	font-size: .78rem;
	font-weight: 600;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--am-teal);
	margin-bottom: .7em;
}

/* ==========================================================================
   Kopfbereich - wie auf antarktismarathon.de
   Pinguin-Foto mit dunkler Überlagerung, zentrierte Navigation.
   Werte (Farben, Größen, Overlay) sind der Hauptseite entnommen.
   ========================================================================== */

.am-header {
	position: relative;
	/* Identisch zur Hauptseite: 70 % Deckung in #010a1b über dem Foto. */
	background-image:
		linear-gradient(rgba(1, 10, 27, .7), rgba(1, 10, 27, .7)),
		url("assets/img/header-antarktis.jpg");
	background-position: center center, center center;
	background-size: cover, cover;
	background-repeat: no-repeat, no-repeat;
	background-attachment: fixed, fixed;
	background-color: #010a1b;
	color: #fff;
}

.am-header__inner {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: .9rem;
	min-height: 168px;
	padding: 1.4rem 22px;
	max-width: var(--am-wrap);
	margin: 0 auto;
}

/* Eigenes Logo, falls im Customizer hinterlegt - sonst führt die
   Navigation selbst den Seitennamen, wie auf der Hauptseite. */
.am-header__logo { display: flex; justify-content: center; }
.am-header__logo img { max-height: 54px; width: auto; }

/* Dreispaltig: leere Spalte, Navigation, Aktionen.
   Die beiden Außenspalten sind gleich breit, dadurch sitzt die
   Navigation optisch mittig - auch wenn rechts Warenkorb steht. */
.am-header__bar {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 1rem;
}
.am-header__spacer { min-width: 0; }

/* Seitenname - nur sichtbar, wenn die Navigation eingeklappt ist */
.am-header__name { display: none; }

/* Navigation - zentriert, Werte aus der Hauptseite:
   Cabin 12px, Linkfarbe #e4f0ed, aktives Pill #5881b0 auf #090a0a,
   Radius 4px, Innenabstand 8px/10px. */
.am-nav { min-width: 0; }

.am-nav ul {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 2px;
	list-style: none;
	margin: 0;
	padding: 0;
}
.am-nav li { margin: 0; position: relative; }

.am-nav a {
	display: block;
	padding: 8px 10px;
	font-family: var(--am-font-body);
	font-size: 12px;
	font-weight: 400;
	line-height: 1.4;
	color: #e4f0ed;
	border-radius: 4px;
	white-space: nowrap;
	transition: background var(--am-transition), color var(--am-transition);
}
.am-nav a:hover, .am-nav a:focus {
	background: rgba(228, 240, 237, .16);
	color: #fff;
	text-decoration: none;
}

/* Aktiver Punkt: helles Pill mit dunkler Schrift */
.am-nav .current-menu-item > a,
.am-nav .current_page_item > a,
.am-nav .current-menu-parent > a,
.am-nav .current-menu-ancestor > a {
	background: #5881b0;
	color: #090a0a;
}
.am-nav .current-menu-item > a:hover,
.am-nav .current_page_item > a:hover {
	background: #6b93c0;
	color: #090a0a;
}

/* Untermenues */
.am-nav ul ul {
	position: absolute; top: 100%; left: 0; z-index: 60;
	display: block;
	min-width: 210px;
	background: #0b1526;
	border: 1px solid rgba(228, 240, 237, .18);
	border-radius: var(--am-radius);
	box-shadow: var(--am-shadow-lift);
	padding: .35rem;
	opacity: 0; visibility: hidden;
	transform: translateY(6px);
	transition: opacity var(--am-transition), transform var(--am-transition), visibility var(--am-transition);
}
.am-nav li:hover > ul,
.am-nav li:focus-within > ul { opacity: 1; visibility: visible; transform: translateY(0); }
.am-nav ul ul li { width: 100%; }
.am-nav ul ul a { padding: .5rem .7rem; font-size: .84rem; }

/* Kopf-Aktionen: Rücksprung zur Hauptseite + Warenkorb.
   Bewusst zurückhaltend, damit die zentrierte Navigation führt. */
.am-header__actions {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 6px;
	min-width: 0;
}

.am-header__home {
	display: inline-flex; align-items: center; gap: .35rem;
	padding: 8px 10px;
	font-size: 12px;
	color: rgba(228, 240, 237, .72);
	border-radius: 4px;
	white-space: nowrap;
	transition: background var(--am-transition), color var(--am-transition);
}
.am-header__home:hover, .am-header__home:focus {
	color: #fff; background: rgba(228, 240, 237, .16); text-decoration: none;
}

.am-cart {
	position: relative;
	display: inline-flex; align-items: center; gap: .4rem;
	padding: 8px 10px;
	background: rgba(228, 240, 237, .14);
	color: #e4f0ed;
	border-radius: 4px;
	font-size: 12px; font-weight: 600;
	transition: background var(--am-transition), color var(--am-transition);
}
.am-cart:hover, .am-cart:focus {
	background: #5881b0; color: #090a0a; text-decoration: none;
}
.am-cart svg { width: 15px; height: 15px; flex-shrink: 0; }
.am-cart__count {
	min-width: 19px; height: 19px;
	display: inline-flex; align-items: center; justify-content: center;
	padding: 0 5px;
	background: var(--am-badge);
	color: var(--am-badge-text);
	border-radius: 10px;
	font-size: .7rem; font-weight: 700; line-height: 1;
}
.am-cart__count:empty, .am-cart__count[data-count="0"] { display: none; }

/* Mobile-Umschalter */
.am-nav-toggle {
	display: none;
	align-items: center; justify-content: center;
	width: 38px; height: 38px;
	background: transparent;
	border: 1px solid rgba(228, 240, 237, .28);
	border-radius: 4px;
	color: #e4f0ed; cursor: pointer;
	padding: 0;
}
.am-nav-toggle span {
	display: block; position: relative;
	width: 18px; height: 2px; background: #fff;
	transition: background var(--am-transition);
}
.am-nav-toggle span::before,
.am-nav-toggle span::after {
	content: ""; position: absolute; left: 0;
	width: 18px; height: 2px; background: #fff;
	transition: transform var(--am-transition);
}
.am-nav-toggle span::before { top: -6px; }
.am-nav-toggle span::after { top: 6px; }
.am-nav-toggle[aria-expanded="true"] span { background: transparent; }
.am-nav-toggle[aria-expanded="true"] span::before { transform: translateY(6px) rotate(45deg); }
.am-nav-toggle[aria-expanded="true"] span::after { transform: translateY(-6px) rotate(-45deg); }

/* ==========================================================================
   Hero
   ========================================================================== */

/* Setzt den Kopfbereich nach unten fort - beginnt exakt in dessen
   Grundton (#010a1b), damit keine Kante zwischen beiden entsteht. */
.am-hero {
	position: relative;
	background: linear-gradient(180deg, #010a1b 0%, #101a30 55%, #16203a 100%);
	color: #fff;
	padding: clamp(3rem, 8vw, 6rem) 0;
	text-align: center;
	overflow: hidden;
}
.am-hero::after {
	content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 46px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1200' height='46' viewBox='0 0 1200 46' preserveAspectRatio='none'%3E%3Cpath d='M0 46 L0 26 C 180 2, 330 40, 520 22 S 880 0, 1200 24 L1200 46 Z' fill='%23ffffff'/%3E%3C/svg%3E") no-repeat center bottom / cover;
}
.am-hero h1 { color: #fff; margin-bottom: .5em; position: relative; z-index: 2; }
.am-hero__lead {
	max-width: 620px; margin: 0 auto 1.8em;
	font-size: 1.08rem;
	color: rgba(255, 255, 255, .84);
	position: relative; z-index: 2;
}
.am-hero .am-eyebrow { color: var(--am-teal); }
.am-hero__actions {
	display: flex; flex-wrap: wrap; gap: .8rem; justify-content: center;
	position: relative; z-index: 2;
}

/* ==========================================================================
   Buttons
   ========================================================================== */

.am-btn,
button, input[type="submit"], input[type="button"],
.wp-block-button__link {
	display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
	padding: .78em 1.6em;
	font-family: var(--am-font-body);
	font-size: .93rem; font-weight: 600;
	line-height: 1.2;
	color: #fff;
	background: var(--am-navy);
	border: 2px solid var(--am-navy);
	border-radius: var(--am-radius);
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	transition: all var(--am-transition);
}
.am-btn:hover, .am-btn:focus,
button:hover, input[type="submit"]:hover, .wp-block-button__link:hover {
	background: var(--am-teal-dark);
	border-color: var(--am-teal-dark);
	color: #fff;
	text-decoration: none;
	transform: translateY(-1px);
}

/* Kauf-Aktionen. Schriftfarbe muss explizit gesetzt werden: WooCommerce
   gibt a.button die Farbe #515151, und die generische Button-Regel oben
   greift nur auf <button>, nicht auf Anker. */
.am-btn--cta {
	background: var(--am-cta);
	border-color: var(--am-cta);
	color: var(--am-cta-text);
}
.am-btn--cta:hover, .am-btn--cta:focus {
	background: var(--am-cta-dark); border-color: var(--am-cta-dark); color: var(--am-cta-text);
}

.am-btn--ghost {
	background: transparent;
	border-color: rgba(255, 255, 255, .45);
	color: #fff;
}
.am-btn--ghost:hover, .am-btn--ghost:focus {
	background: rgba(255, 255, 255, .12);
	border-color: #fff; color: #fff;
}

.am-btn--outline {
	background: transparent; border-color: var(--am-navy); color: var(--am-navy);
}
.am-btn--outline:hover, .am-btn--outline:focus {
	background: var(--am-navy); color: #fff;
}

.am-btn--sm { padding: .55em 1.1em; font-size: .84rem; }

/* ==========================================================================
   Formularfelder
   ========================================================================== */

input[type="text"], input[type="email"], input[type="url"], input[type="password"],
input[type="search"], input[type="number"], input[type="tel"], input[type="date"],
textarea, select {
	width: 100%;
	padding: .7em .85em;
	font-family: var(--am-font-body);
	font-size: .95rem;
	color: var(--am-ink);
	background: #fff;
	border: 1px solid var(--am-grey-line);
	border-radius: var(--am-radius);
	transition: border-color var(--am-transition), box-shadow var(--am-transition);
}
input:focus, textarea:focus, select:focus {
	outline: none;
	border-color: var(--am-teal);
	box-shadow: 0 0 0 3px rgba(34, 166, 164, .16);
}
label { display: block; font-size: .88rem; font-weight: 600; margin-bottom: .35em; }

/* ==========================================================================
   Inhaltsbereich
   ========================================================================== */

.am-main { min-height: 55vh; }

.am-page-head {
	background: var(--am-mint);
	padding: clamp(2rem, 5vw, 3.4rem) 0;
	text-align: center;
}
.am-page-head h1 { margin-bottom: .25em; }
.am-page-head p { color: var(--am-grey); margin: 0; }

.am-content { padding: clamp(2.2rem, 5vw, 3.6rem) 0; }
.am-content > *:last-child { margin-bottom: 0; }

.am-entry-meta { font-size: .85rem; color: var(--am-grey); margin-bottom: 1.5em; }

/* Beitragsliste */
.am-posts { display: grid; gap: 1.8rem; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); }
.am-post-card {
	background: #fff;
	border: 1px solid var(--am-grey-line);
	border-radius: var(--am-radius-lg);
	overflow: hidden;
	transition: box-shadow var(--am-transition), transform var(--am-transition);
}
.am-post-card:hover { box-shadow: var(--am-shadow-lift); transform: translateY(-2px); }
.am-post-card__body { padding: 1.3rem; }
.am-post-card h2 { font-size: 1.25rem; margin-bottom: .4em; }

/* Blaetternavigation */
.am-pagination { margin-top: 2.5rem; text-align: center; }
.am-pagination .page-numbers {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 40px; height: 40px; padding: 0 .6em; margin: 0 .15em;
	border: 1px solid var(--am-grey-line);
	border-radius: var(--am-radius);
	color: var(--am-navy); font-size: .9rem; font-weight: 600;
}
.am-pagination .page-numbers:hover { border-color: var(--am-teal); color: var(--am-teal); text-decoration: none; }
.am-pagination .page-numbers.current {
	background: var(--am-navy); border-color: var(--am-navy); color: #fff;
}

/* ==========================================================================
   Fußzeile
   ========================================================================== */

.am-footer {
	background: var(--am-navy-deep);
	color: rgba(255, 255, 255, .74);
	padding: clamp(2.6rem, 6vw, 4rem) 0 0;
	font-size: .92rem;
}
.am-footer a { color: rgba(255, 255, 255, .74); }
.am-footer a:hover, .am-footer a:focus { color: var(--am-teal); text-decoration: none; }

.am-footer__cols {
	display: grid; gap: 2.2rem;
	grid-template-columns: repeat(auto-fit, minmax(215px, 1fr));
	padding-bottom: 2.6rem;
}
.am-footer h2, .am-footer h3 {
	font-family: var(--am-font-body);
	font-size: .78rem; font-weight: 700;
	letter-spacing: .15em; text-transform: uppercase;
	color: #fff;
	margin-bottom: 1.1em;
}
.am-footer ul { list-style: none; margin: 0; padding: 0; }
.am-footer li { margin-bottom: .55em; }

.am-footer__bottom {
	border-top: 1px solid rgba(255, 255, 255, .13);
	padding: 1.4rem 0;
	display: flex; flex-wrap: wrap; gap: .8rem 1.6rem;
	align-items: center; justify-content: space-between;
	font-size: .84rem;
}
.am-footer__bottom p { margin: 0; }
.am-footer__legal { display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; list-style: none; margin: 0; padding: 0; }
.am-footer__legal li { margin: 0; }

.am-footer__note {
	font-size: .84rem;
	color: rgba(255, 255, 255, .55);
	line-height: 1.55;
}

/* ==========================================================================
   WooCommerce
   ========================================================================== */

.woocommerce-page .am-content,
.woocommerce .am-content { padding-top: 2.2rem; }

/* Hinweisboxen */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-noreviews,
.woocommerce p.no-comments {
	padding: 1em 1.2em;
	margin: 0 0 1.8em;
	border-radius: var(--am-radius);
	border-left: 4px solid var(--am-teal);
	background: var(--am-mint);
	list-style: none;
	font-size: .93rem;
}
.woocommerce-message { border-left-color: var(--am-teal); }
.woocommerce-info { border-left-color: var(--am-navy); background: var(--am-grey-bg); }
.woocommerce-error { border-left-color: var(--am-error); background: #fdeceb; }
.woocommerce-message .button,
.woocommerce-info .button { float: right; margin-left: 1em; }

/* Produktraster */
.woocommerce ul.products {
	display: grid !important;
	gap: 1.8rem;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	list-style: none; margin: 0 0 2.5rem; padding: 0;
}
.woocommerce ul.products::before,
.woocommerce ul.products::after { content: none !important; display: none !important; }

.woocommerce ul.products li.product {
	width: 100% !important;
	margin: 0 !important;
	float: none !important;
	display: flex; flex-direction: column;
	background: #fff;
	border: 1px solid var(--am-grey-line);
	border-radius: var(--am-radius-lg);
	overflow: hidden;
	text-align: left;
	transition: box-shadow var(--am-transition), transform var(--am-transition);
}
.woocommerce ul.products li.product:hover {
	box-shadow: var(--am-shadow-lift);
	transform: translateY(-3px);
}
.woocommerce ul.products li.product a img {
	width: 100%; margin: 0;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	background: var(--am-grey-bg);
	box-shadow: none;
}
.woocommerce ul.products li.product .woocommerce-loop-product__link { display: block; }
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--am-font-head);
	font-size: 1.05rem !important;
	color: var(--am-navy);
	padding: 1rem 1.1rem .3rem !important;
	margin: 0;
	line-height: 1.3;
}
.woocommerce ul.products li.product .price {
	display: block;
	padding: 0 1.1rem;
	color: var(--am-teal-dark) !important;
	font-size: 1.05rem; font-weight: 600;
	font-family: var(--am-font-body);
	margin-bottom: .3rem;
}
.woocommerce ul.products li.product .price del { color: var(--am-grey); font-weight: 400; margin-right: .4em; }
.woocommerce ul.products li.product .price ins { text-decoration: none; }

.woocommerce ul.products li.product .button {
	margin: auto 1.1rem 1.1rem;
	background: var(--am-cta);
	border-color: var(--am-cta);
	color: var(--am-cta-text);
	font-size: .87rem;
	padding: .65em 1.1em;
}
.woocommerce ul.products li.product .button:hover {
	background: var(--am-cta-dark); border-color: var(--am-cta-dark); color: var(--am-cta-text);
}
.woocommerce ul.products li.product .added_to_cart {
	display: block; margin: 0 1.1rem 1.1rem; font-size: .82rem; font-weight: 600;
}

/* Angebots-Fahne */
.woocommerce span.onsale {
	position: absolute; top: .8rem; left: .8rem; z-index: 5;
	min-height: auto; min-width: auto;
	padding: .3em .7em;
	background: var(--am-badge);
	color: var(--am-badge-text);
	border-radius: var(--am-radius);
	font-family: var(--am-font-body);
	font-size: .74rem; font-weight: 700;
	letter-spacing: .04em; text-transform: uppercase;
	line-height: 1.4;
	margin: 0;
}
.woocommerce ul.products li.product, .woocommerce div.product { position: relative; }

/* Sortierung + Ergebniszahl */
.woocommerce .woocommerce-result-count { color: var(--am-grey); font-size: .88rem; margin-bottom: 1.5em; }
.woocommerce .woocommerce-ordering select { width: auto; min-width: 210px; }

/* Einzelprodukt */
.woocommerce div.product { margin-bottom: 3rem; }

/* Floats der zweispaltigen Ansicht einschliessen. Ohne das laeuft die
   Bildspalte in die Fusszeile, wenn ein Produkt weder Reiter noch
   verwandte Artikel hat - dann fehlt jedes clearende Element. */
.woocommerce div.product::after {
	content: "";
	display: table;
	clear: both;
}
.woocommerce div.product .product_title {
	font-size: clamp(1.6rem, 3.4vw, 2.4rem);
	color: var(--am-teal);
	margin-bottom: .4em;
}
.woocommerce div.product p.price,
.woocommerce div.product span.price {
	font-family: var(--am-font-body);
	font-size: 1.6rem; font-weight: 700;
	color: var(--am-navy);
	margin-bottom: .8em;
}
.woocommerce div.product p.price del { font-size: 1.05rem; color: var(--am-grey); font-weight: 400; }
.woocommerce div.product .woocommerce-product-details__short-description { margin-bottom: 1.6em; }
.woocommerce div.product form.cart { margin-bottom: 2em; }
.woocommerce div.product form.cart .button {
	background: var(--am-cta); border-color: var(--am-cta);
	color: var(--am-cta-text);
	padding: .85em 1.9em; font-size: 1rem;
}
.woocommerce div.product form.cart .button:hover {
	background: var(--am-cta-dark); border-color: var(--am-cta-dark); color: var(--am-cta-text);
}
.woocommerce div.product .quantity { margin-right: .7em; }
.woocommerce .quantity input.qty {
	width: 76px; text-align: center; padding: .72em .4em;
}
.woocommerce div.product .product_meta {
	font-size: .87rem; color: var(--am-grey);
	padding-top: 1.2em; border-top: 1px solid var(--am-grey-line);
}
.woocommerce div.product .product_meta > span { display: block; margin-bottom: .35em; }

/* --------------------------------------------------------------------------
   Variantenauswahl (Größe)

   WooCommerce gibt die Auswahl als <table class="variations"> aus, mit der
   Bezeichnung in einer eigenen Zelle - das erzeugt den grauen Kasten. Hier
   wird die Tabelle auf Blocksatz umgestellt und die Auswahl als anklickbare
   Felder dargestellt (assets/js/variations.js). Ohne JavaScript bleibt das
   normale Auswahlfeld sichtbar und nutzbar.
   -------------------------------------------------------------------------- */

.woocommerce div.product form.cart table.variations {
	display: block;
	width: 100%;
	border: 0;
	margin: 0 0 1.5em;
	background: none;
}
.woocommerce div.product form.cart table.variations tbody,
.woocommerce div.product form.cart table.variations tr,
.woocommerce div.product form.cart table.variations th,
.woocommerce div.product form.cart table.variations td {
	display: block;
	width: auto;
	padding: 0;
	border: 0;
	background: none;
	text-align: left;
}
.woocommerce div.product form.cart table.variations tr + tr { margin-top: 1.2em; }

/* Bezeichnung des Attributs */
.woocommerce div.product form.cart table.variations th.label label {
	display: block;
	margin: 0 0 .6em;
	font-family: var(--am-font-body);
	font-size: .78rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--am-navy);
}

/* Auswahlfeld: sichtbar ohne JavaScript, ausgeblendet sobald die
   Felder erzeugt sind (Klasse wird per Skript gesetzt). */
.woocommerce div.product form.cart table.variations select { max-width: 320px; }
.woocommerce div.product form.cart table.variations select.am-select-replaced { display: none; }

/* Anklickbare Größen */
.am-swatches {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
}

.am-swatch {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 54px;
	padding: .62em .9em;
	background: #fff;
	color: var(--am-navy);
	border: 2px solid var(--am-grey-line);
	border-radius: var(--am-radius);
	font-family: var(--am-font-body);
	font-size: .95rem;
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
	transition: border-color var(--am-transition), background var(--am-transition), color var(--am-transition);
}
.am-swatch:hover:not(:disabled) {
	border-color: var(--am-teal);
	color: var(--am-teal-dark);
	background: #fff;
	transform: none;
}
.am-swatch.is-selected,
.am-swatch.is-selected:hover {
	background: var(--am-cta);
	border-color: var(--am-cta);
	color: var(--am-cta-text);
}

/* Nicht lieferbare Größe: erkennbar, aber nicht anklickbar */
.am-swatch.is-unavailable,
.am-swatch:disabled {
	background: var(--am-grey-bg);
	border-color: var(--am-grey-bg);
	color: var(--am-grey);
	cursor: not-allowed;
	text-decoration: line-through;
	transform: none;
}

/* "Auswahl aufheben" - WooCommerce blendet den Link selbst ein und aus */
.woocommerce div.product form.cart .reset_variations {
	display: inline-block;
	margin-top: .8em;
	font-size: .84rem;
	color: var(--am-grey);
	text-decoration: underline;
}
.woocommerce div.product form.cart .reset_variations:hover { color: var(--am-teal); }

/* Preis und Verfügbarkeit der gewählten Variante */
.woocommerce div.product form.cart .woocommerce-variation-price { margin-bottom: .9em; }
.woocommerce div.product form.cart .woocommerce-variation-price .price {
	font-size: 1.35rem;
	margin: 0;
}
.woocommerce div.product form.cart .woocommerce-variation-availability p { margin: 0 0 .8em; font-size: .9rem; }

/* Menge und Kauf-Button in einer Zeile */
.woocommerce div.product form.cart .woocommerce-variation-add-to-cart {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .6rem;
}
.woocommerce div.product form.cart .woocommerce-variation-add-to-cart .quantity { margin: 0; }

/* Deaktivierter Kauf-Button, solange keine Größe gewählt ist.
   Vorher war er nur blass eingefärbt - jetzt klar als inaktiv erkennbar. */
.woocommerce div.product form.cart .button:disabled,
.woocommerce div.product form.cart .button.disabled,
.woocommerce div.product form.cart .button[disabled] {
	background: var(--am-grey-bg);
	border-color: var(--am-grey-bg);
	color: var(--am-grey);
	cursor: not-allowed;
	opacity: 1;
	transform: none;
}

/* Produktgalerie */
.woocommerce div.product div.images { margin-bottom: 2em; }
.woocommerce div.product div.images img { border-radius: var(--am-radius-lg); }
.woocommerce div.product div.images .flex-control-thumbs { margin-top: .8rem; display: flex; gap: .6rem; }
.woocommerce div.product div.images .flex-control-thumbs li { width: auto; margin: 0; }
.woocommerce div.product div.images .flex-control-thumbs img { border-radius: var(--am-radius); }

/* Reiter */
.woocommerce div.product .woocommerce-tabs ul.tabs {
	padding: 0; margin: 0 0 1.6em;
	border-bottom: 1px solid var(--am-grey-line);
	display: flex; flex-wrap: wrap; gap: .3rem;
}
.woocommerce div.product .woocommerce-tabs ul.tabs::before { display: none; }
.woocommerce div.product .woocommerce-tabs ul.tabs li {
	background: transparent; border: 0; border-radius: 0;
	margin: 0; padding: 0;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after { display: none; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	display: block; padding: .7em 1.1em;
	font-family: var(--am-font-body);
	font-weight: 600; font-size: .92rem;
	color: var(--am-grey);
	border-bottom: 3px solid transparent;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a,
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover {
	color: var(--am-navy); border-bottom-color: var(--am-teal); text-decoration: none;
}
.woocommerce div.product .woocommerce-tabs .panel > h2:first-child { font-size: 1.35rem; }

/* Warenkorb */
.woocommerce table.shop_table {
	border: 1px solid var(--am-grey-line);
	border-radius: var(--am-radius-lg);
	border-collapse: separate;
	border-spacing: 0;
	overflow: hidden;
}
.woocommerce table.shop_table th {
	background: var(--am-mint);
	font-family: var(--am-font-body);
	font-size: .82rem; font-weight: 700;
	letter-spacing: .06em; text-transform: uppercase;
	color: var(--am-navy);
	padding: .95em .9em;
}
.woocommerce table.shop_table td { padding: 1em .9em; border-top: 1px solid var(--am-grey-line); }
.woocommerce table.cart img { width: 62px; border-radius: var(--am-radius); }
.woocommerce a.remove {
	color: var(--am-error) !important;
	font-size: 1.4rem; line-height: 1; width: 22px; height: 22px;
}
.woocommerce a.remove:hover { background: var(--am-error) !important; color: #fff !important; }

.woocommerce .cart-collaterals .cart_totals,
.woocommerce-page .cart-collaterals .cart_totals { width: 100%; }
.woocommerce .cart_totals h2 { font-size: 1.3rem; }
.woocommerce-cart .cart-collaterals .cart_totals table { margin-bottom: 1.4em; }
.woocommerce .wc-proceed-to-checkout { padding: 0; }
.woocommerce .wc-proceed-to-checkout a.checkout-button {
	display: block; width: 100%;
	background: var(--am-cta); border-color: var(--am-cta);
	color: var(--am-cta-text);
	font-size: 1rem; padding: .9em 1.5em;
}
.woocommerce .wc-proceed-to-checkout a.checkout-button:hover {
	background: var(--am-cta-dark); border-color: var(--am-cta-dark); color: var(--am-cta-text);
}
.woocommerce .cart .actions .coupon { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: 1rem; }
.woocommerce .cart .actions .coupon input[type="text"] { width: auto; min-width: 180px; }

/* Kasse */
.woocommerce-checkout h3 { font-size: 1.3rem; margin-bottom: 1em; }
.woocommerce form .form-row { padding: 0; margin-bottom: 1.1em; }
.woocommerce form .form-row label { font-size: .88rem; }
.woocommerce form .form-row .required { color: var(--am-error); text-decoration: none; }
.woocommerce-checkout #payment {
	background: var(--am-grey-bg);
	border-radius: var(--am-radius-lg);
	padding: 1.4rem;
}
.woocommerce-checkout #payment ul.payment_methods { border-bottom: 1px solid var(--am-grey-line); padding: 0 0 1.2em; }
.woocommerce-checkout #payment div.form-row { padding: 1.2em 0 0; }
.woocommerce-checkout #payment #place_order {
	width: 100%;
	background: var(--am-cta); border-color: var(--am-cta);
	color: var(--am-cta-text);
	font-size: 1.05rem; padding: .9em 1.5em;
}
.woocommerce-checkout #payment #place_order:hover {
	background: var(--am-cta-dark); border-color: var(--am-cta-dark); color: var(--am-cta-text);
}
.woocommerce-checkout-review-order-table tfoot th,
.woocommerce-checkout-review-order-table tfoot td { font-weight: 700; }
.woocommerce-checkout-review-order-table .order-total td { font-size: 1.2rem; color: var(--am-navy); }

/* Konto */
.woocommerce-account .woocommerce-MyAccount-navigation ul { list-style: none; padding: 0; margin: 0 0 2rem; }
.woocommerce-account .woocommerce-MyAccount-navigation li { margin: 0; border-bottom: 1px solid var(--am-grey-line); }
.woocommerce-account .woocommerce-MyAccount-navigation li a {
	display: block; padding: .75em .2em; font-weight: 600; font-size: .93rem; color: var(--am-navy);
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { color: var(--am-teal); }
.woocommerce-account .woocommerce-MyAccount-content { min-width: 0; }
.woocommerce form.login, .woocommerce form.register {
	border: 1px solid var(--am-grey-line);
	border-radius: var(--am-radius-lg);
	padding: 1.6rem;
}

/* Produktfilter-Widgets */
.woocommerce .widget_price_filter .ui-slider .ui-slider-range { background: var(--am-teal); }
.woocommerce .widget_price_filter .ui-slider .ui-slider-handle { background: var(--am-navy); border-radius: 50%; }
.woocommerce .widget_price_filter .price_slider_wrapper .ui-widget-content { background: var(--am-grey-line); }

/* Brotkrumen */
.woocommerce .woocommerce-breadcrumb {
	font-size: .85rem; color: var(--am-grey); margin: 0 0 1.6em;
}
.woocommerce .woocommerce-breadcrumb a { color: var(--am-grey); }
.woocommerce .woocommerce-breadcrumb a:hover { color: var(--am-teal); }

/* Sternebewertung */
.woocommerce .star-rating span { color: var(--am-cta); }
.woocommerce p.stars a { color: var(--am-cta); }

/* Verwandte Produkte / Upsells */
.woocommerce .related > h2,
.woocommerce .upsells > h2,
.woocommerce .cross-sells > h2 { font-size: 1.5rem; margin-bottom: 1.2em; }

/* Leerer Warenkorb */
.woocommerce .cart-empty { font-size: 1.15rem; }
.woocommerce .return-to-shop { margin-top: 1.4em; }

/* Produktsuche */
.woocommerce .woocommerce-product-search { display: flex; gap: .5rem; }
.woocommerce .woocommerce-product-search button { flex-shrink: 0; }

/* ==========================================================================
   WooCommerce Germanized - gesetzliche Pflichtangaben
   (inkl. MwSt., zzgl. Versandkosten, Lieferzeit, Grundpreis)
   ========================================================================== */

.wc-gzd-additional-info {
	margin: 0;
	padding: 0;
	list-style: none;
	font-family: var(--am-font-body);
	font-size: .78rem;
	line-height: 1.5;
	color: var(--am-grey);
}
.wc-gzd-additional-info li,
.wc-gzd-additional-info p { margin: 0; }
.wc-gzd-additional-info a { color: var(--am-grey); text-decoration: underline; }
.wc-gzd-additional-info a:hover { color: var(--am-teal); }

/* Im Produktraster direkt unter den Preis einrücken.
   Germanized gibt jede Angabe als eigenen Block aus - deshalb hier ohne
   Abstand zwischen ihnen, nur der letzte bekommt Luft nach unten. */
.woocommerce ul.products li.product .wc-gzd-additional-info {
	padding: 0 1.1rem;
	margin: 0;
}
.woocommerce ul.products li.product .wc-gzd-additional-info:last-of-type {
	padding-bottom: .75rem;
}

/* Auf der Einzelproduktseite etwas mehr Luft */
.woocommerce div.product .wc-gzd-additional-info {
	margin: -.4em 0 1.4em;
	font-size: .82rem;
}

/* Lieferzeit hervorheben - die interessiert Kaufende am meisten */
.wc-gzd-additional-info .wc-gzd-additional-info-loop-delivery-time,
.wc-gzd-additional-info .delivery-time-info {
	color: var(--am-teal-dark);
	font-weight: 600;
}

/* Grundpreis */
.wc-gzd-additional-info .price-unit { display: block; }

/* Pflicht-Checkboxen an der Kasse */
.woocommerce-checkout .wc-gzd-checkbox-placeholder,
.woocommerce form .form-row.wc-gzd-checkbox-placeholder {
	background: var(--am-mint);
	border-radius: var(--am-radius);
	padding: .9em 1.1em;
	margin-bottom: 1em;
	font-size: .88rem;
}
.woocommerce-checkout .wc-gzd-checkbox-placeholder label { font-weight: 400; display: inline; }

/* Hinweisleiste "Bestellung abschicken" */
.wc-gzd-order-submit { margin-top: 1.2em; }

/* Widerrufs- und Datenschutzhinweise im Bestellabschluss */
.woocommerce-checkout .wc-gzd-legal-checkbox-text { color: var(--am-ink); }

/* ==========================================================================
   Startseite des Shops
   ========================================================================== */

.am-features { display: grid; gap: 1.6rem; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); }
.am-feature { text-align: center; padding: 1.6rem 1.2rem; }
.am-feature__icon {
	width: 46px; height: 46px; margin: 0 auto 1rem;
	color: var(--am-teal);
}
.am-feature h3 { font-size: 1.12rem; margin-bottom: .4em; }
.am-feature p { color: var(--am-grey); font-size: .93rem; margin: 0; }

.am-cta-band {
	background: var(--am-navy);
	color: #fff;
	text-align: center;
	padding: clamp(2.4rem, 6vw, 4rem) 0;
}
.am-cta-band h2 { color: #fff; }
.am-cta-band p { color: rgba(255, 255, 255, .8); max-width: 560px; margin: 0 auto 1.6em; }

/* ==========================================================================
   Responsiv
   ========================================================================== */

@media (max-width: 900px) {
	/* Feststehender Hintergrund ruckelt auf Touchgeräten - hier mitscrollen. */
	.am-header { background-attachment: scroll, scroll; }

	.am-header__inner { min-height: 0; padding: .8rem 22px; gap: 0; }

	/* Zweispaltig: Seitenname links, Aktionen rechts, Navigation klappt darunter. */
	.am-header__bar { grid-template-columns: 1fr auto; gap: .5rem; }

	.am-nav-toggle { display: inline-flex; }

	.am-header__name {
		display: block;
		font-family: var(--am-font-body);
		font-size: 13px;
		font-weight: 600;
		letter-spacing: .06em;
		text-transform: uppercase;
		line-height: 1.25;
		color: #e4f0ed;
	}
	.am-header__name:hover, .am-header__name:focus { color: #fff; text-decoration: none; }

	.am-nav {
		grid-column: 1 / -1;
		grid-row: 2;
		display: none;
		padding-bottom: .4rem;
	}
	.am-nav.is-open { display: block; }
	.am-nav ul { flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 0; }
	.am-nav li { border-top: 1px solid rgba(228, 240, 237, .14); }
	.am-nav a { padding: .8rem .4rem; font-size: .95rem; border-radius: 0; white-space: normal; }
	.am-nav .current-menu-item > a,
	.am-nav .current_page_item > a { border-radius: 4px; }

	.am-nav ul ul {
		position: static;
		opacity: 1; visibility: visible; transform: none;
		background: transparent; border: 0; box-shadow: none;
		min-width: 0;
		padding: 0 0 0 1rem;
	}

	.am-header__home span { display: none; }
	.am-header__logo { justify-content: flex-start; margin-bottom: .6rem; }
}

@media (max-width: 600px) {
	body { font-size: 16px; }
	.am-wrap { padding: 0 16px; }
	.am-header__inner { padding: .7rem 16px; }
	.woocommerce ul.products { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 1rem; }
	.woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: .95rem !important; padding: .8rem .8rem .25rem !important; }
	.woocommerce ul.products li.product .price { padding: 0 .8rem; font-size: .95rem; }
	.woocommerce ul.products li.product .button { margin: auto .8rem .8rem; font-size: .82rem; }
	.woocommerce ul.products li.product .wc-gzd-additional-info { padding: 0 .8rem; }
	.woocommerce ul.products li.product .wc-gzd-additional-info:last-of-type { padding-bottom: .6rem; }
	.am-footer__bottom { flex-direction: column; align-items: flex-start; }
	.woocommerce table.shop_table_responsive tr td { text-align: right; }
	.woocommerce table.shop_table_responsive tr td::before { float: left; font-weight: 700; }
}

/* Sehr schmale Displays: einspaltiges Raster. Zweispaltig bliebe zu wenig
   Platz - lange Produktnamen wie "Antarktismarathon" würden im Wort brechen. */
@media (max-width: 430px) {
	.woocommerce ul.products { grid-template-columns: 1fr; }
	.woocommerce ul.products li.product .woocommerce-loop-product__title {
		font-size: 1.05rem !important;
	}
	.woocommerce ul.products li.product a img { aspect-ratio: 4 / 3; }
}

/* Produktnamen an Silben trennen statt hart im Wort umbrechen */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce div.product .product_title {
	overflow-wrap: break-word;
	hyphens: auto;
}

/* Zweispaltiges Einzelprodukt ab Tablet */
@media (min-width: 768px) {
	.woocommerce div.product div.images { width: 48%; float: left; margin-right: 4%; }
	.woocommerce div.product div.summary { width: 48%; float: left; margin-bottom: 0; }
	.woocommerce div.product .woocommerce-tabs,
	.woocommerce div.product .related,
	.woocommerce div.product .upsells { clear: both; padding-top: 1.5rem; }

	.woocommerce-cart .cart-collaterals .cart_totals { width: 42%; float: right; }
	.woocommerce-account .woocommerce-MyAccount-navigation { width: 24%; float: left; }
	.woocommerce-account .woocommerce-MyAccount-content { width: 71%; float: right; }
}

@media (min-width: 992px) {
	.woocommerce .col2-set .col-1,
	.woocommerce-page .col2-set .col-1 { width: 48%; float: left; }
	.woocommerce .col2-set .col-2,
	.woocommerce-page .col2-set .col-2 { width: 48%; float: right; }
}

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

/* Druck */
@media print {
	.am-header, .am-footer, .am-nav, .am-cart, .am-hero::after { display: none !important; }
	body { font-size: 12pt; color: #000; }
	a { color: #000; text-decoration: underline; }
}