/* =============================================================
   gogo24 – Storefront Child Theme
   Shop-Styles
   ============================================================= */

/* --- Base ---------------------------------------------------- */
body,
button,
input,
select,
textarea {
	font-family: var(--gogo24-font-body);
	color: var(--gogo24-text);
}

body {
	background: var(--gogo24-bg-soft);
}

h1, h2, h3, h4, h5, h6,
.site-header .site-branding .site-title,
.entry-title {
	font-family: var(--gogo24-font-head);
	font-weight: 600;
	letter-spacing: 0.02em;
}

h1, h2 {
	text-transform: uppercase;
}

a {
	color: var(--gogo24-red);
}
a:hover,
a:focus {
	color: var(--gogo24-dark);
}

/* --- Header -------------------------------------------------- */
.site-header {
	background-color: var(--gogo24-dark) !important;
	border-bottom: 3px solid var(--gogo24-yellow);
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

/* Logo: transparent, kompakt, ohne Hintergrund-Kasten.
   PNG enthält bereits 5 px Innenabstand zum Rand. */
.site-header .site-branding {
	background: transparent !important;
	padding: 0 !important;
	margin: 0 !important;
	display: flex;
	align-items: center;
}
.site-header .custom-logo-link,
.site-header .site-logo-link,
.site-header .site-logo-anchor {
	background: transparent !important;
	padding: 0 !important;
	margin: 0 !important;
	display: inline-flex;
	align-items: center;
	line-height: 0;
}
.site-header img.custom-logo,
.site-header .site-logo-link img,
.site-header .site-logo-anchor img {
	background: transparent !important;
	box-shadow: none !important;
	max-height: 62px;
	width: auto;
	height: auto;
	display: block;
}

/* Hauptnavigation als dunkle Leiste unter dem Logo (Mega-Nav-Stil) */
.storefront-primary-navigation {
	background-color: var(--gogo24-dark-2) !important;
	border-top: 1px solid #2a2d31;
}
.main-navigation {
	background-color: transparent !important;
}
.main-navigation ul.menu,
.main-navigation ul.nav-menu {
	background: transparent;
}
.site-header .site-search,
.site-header-cart {
	margin-top: 0;
}
.site-header .site-search {
	display: flex;
	justify-content: center;
}
.site-header .site-search .widget,
.site-header .site-search form {
	margin-left: auto;
	margin-right: auto;
}
.site-search .widget_product_search input[type="search"],
.site-search input[type="search"] {
	border-radius: 24px;
	border: 1px solid #353a3f;
	background: #fff;
	padding: 0.5em 1em;
}

@media (max-width: 768px) {
	.site-header .site-search {
		display: none !important;
	}

	.site-header .site-branding {
		float: none;
		width: 100%;
		text-align: center;
		display: flex;
		justify-content: center;
	}

	.site-header .custom-logo-link,
	.site-header .site-logo-link,
	.site-header .site-logo-anchor {
		display: inline-flex;
		justify-content: center;
	}

	.site-header img.custom-logo,
	.site-header .site-logo-link img,
	.site-header .site-logo-anchor img {
		max-height: 112px !important;
	}
}

/* --- Footer-Info-Block (Kontakt + Rechtliches) -------------- */
.gogo24-footer-info {
	background: var(--gogo24-dark);
	color: var(--gogo24-silver);
	padding: 2.5em 0 1.5em;
}
.gogo24-footer-info__grid {
	max-width: 1110px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 2.5em;
	padding: 0 1.5em;
	box-sizing: border-box;
}
.gogo24-footer-info__col {
	min-width: 0;
}
.gogo24-footer-info__col h3 {
	color: #ffffff;
	font-family: var(--gogo24-font-head);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	font-size: 1em;
	margin: 0 0 0.9em;
	padding-bottom: 0.4em;
	border-bottom: 2px solid var(--gogo24-yellow);
}
.gogo24-footer-info__col ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.gogo24-footer-info__col li {
	padding: 0.3em 0;
	line-height: 1.5;
}
.gogo24-footer-info__col a {
	color: var(--gogo24-silver);
	text-decoration: none;
}
.gogo24-footer-info__col a:hover {
	color: var(--gogo24-yellow);
}
.gogo24-footer-info__col p {
	margin: 0;
	line-height: 1.6;
}
.gogo24-footer-widerruf {
	margin-top: 0.9em !important;
}
.gogo24-footer-widerruf a:hover {
	color: #fff;
}
@media (max-width: 768px) {
	.gogo24-footer-info__grid { grid-template-columns: 1fr; gap: 1.6em; }
}

.site-header .site-branding a,
.site-header .site-title a {
	color: var(--gogo24-silver) !important;
	font-family: var(--gogo24-font-head);
	letter-spacing: 0.04em;
}

.main-navigation ul.menu li a,
.main-navigation ul.nav-menu li a {
	color: #ffffff;
	text-transform: uppercase;
	font-family: var(--gogo24-font-head);
	font-weight: 500;
	letter-spacing: 0.05em;
	padding: 0.6em 1em;
	border-bottom: 2px solid transparent;
	transition: border-color .15s ease, color .15s ease;
}

.main-navigation ul.menu li a:hover,
.main-navigation ul.menu li.current-menu-item > a,
.main-navigation ul.nav-menu li a:hover,
.main-navigation ul.nav-menu li.current-menu-item > a {
	color: var(--gogo24-yellow);
	border-bottom-color: var(--gogo24-yellow);
}

.site-header-cart .cart-contents {
	color: #ffffff !important;
}
.site-header-cart .cart-contents:hover {
	color: var(--gogo24-yellow) !important;
}

/* --- Buttons ------------------------------------------------- */
button,
input[type="button"],
input[type="reset"],
input[type="submit"],
.button,
.added_to_cart,
.widget a.button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce #content input.button,
.woocommerce-page a.button,
.woocommerce-page button.button,
.woocommerce-page input.button,
.woocommerce-page #respond input#submit,
.woocommerce-page #content input.button {
	background-color: var(--gogo24-red);
	color: #ffffff;
	border: 0;
	border-radius: 3px;
	font-family: var(--gogo24-font-head);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	font-weight: 600;
	padding: 0.85em 1.6em;
	transition: background-color .15s ease, color .15s ease, transform .05s ease;
	box-shadow: none;
	text-shadow: none;
}

button:hover,
.button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce-page a.button:hover {
	background-color: var(--gogo24-dark);
	color: var(--gogo24-yellow);
}

.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt {
	background-color: var(--gogo24-red);
	color: #ffffff;
}
.woocommerce a.button.alt:hover {
	background-color: var(--gogo24-dark);
	color: var(--gogo24-yellow);
}

/* --- Produktkarten ------------------------------------------ */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
	background: #ffffff;
	border: 1px solid var(--gogo24-border);
	border-radius: 4px;
	padding: 1em;
	transition: box-shadow .2s ease, transform .15s ease;
}

.woocommerce ul.products li.product:hover {
	box-shadow: 0 6px 18px rgba(0,0,0,0.08);
	transform: translateY(-2px);
}

.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product h3 {
	font-family: var(--gogo24-font-head);
	font-size: 1.05em;
	color: var(--gogo24-dark);
	text-transform: none;
	min-height: 2.6em;
}

.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price {
	font-family: var(--gogo24-font-num);
	color: var(--gogo24-dark);
	font-weight: 700;
	font-size: 1.25em;
}

.woocommerce ul.products li.product .price ins,
.woocommerce div.product p.price ins {
	color: var(--gogo24-red);
	background: transparent;
	font-weight: 700;
}

/* --- Sale / Neu Badges -------------------------------------- */
.woocommerce span.onsale,
.woocommerce ul.products li.product .onsale {
	background-color: var(--gogo24-red);
	color: #ffffff;
	border-radius: 50%;
	min-height: 3em;
	min-width: 3em;
	padding: 0.6em;
	font-family: var(--gogo24-font-num);
	font-weight: 700;
	line-height: 1.6;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	top: 8px;
	left: 8px;
	right: auto;
}

/* --- Trust-Bar ---------------------------------------------- */
.gogo24-trust-bar {
	background: var(--gogo24-dark-2);
	color: var(--gogo24-text-on-dark);
	padding: 1.6em 0;
	border-top: 1px solid #2a2d31;
	border-bottom: 3px solid var(--gogo24-yellow);
}

.gogo24-trust-bar ul {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.5em;
	list-style: none;
	margin: 0;
	padding: 0;
	text-align: center;
}

.gogo24-trust-bar li {
	font-size: 0.95em;
	line-height: 1.4;
}

.gogo24-trust-bar li strong {
	color: var(--gogo24-yellow);
	font-family: var(--gogo24-font-head);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	display: block;
	margin-bottom: 0.2em;
}

@media (max-width: 768px) {
	.gogo24-trust-bar ul {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* --- Footer -------------------------------------------------- */
.site-footer {
	background-color: var(--gogo24-dark) !important;
	color: var(--gogo24-silver) !important;
}

.site-footer h1,
.site-footer h2,
.site-footer h3,
.site-footer .widget-title {
	color: #ffffff !important;
	font-family: var(--gogo24-font-head);
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.site-footer a {
	color: var(--gogo24-silver) !important;
}
.site-footer a:hover {
	color: var(--gogo24-yellow) !important;
}

/* --- Formulare ---------------------------------------------- */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
input[type="search"],
textarea,
select {
	border: 1px solid var(--gogo24-border);
	border-radius: 3px;
	padding: 0.7em 0.9em;
	background: #ffffff;
}
input:focus,
textarea:focus,
select:focus {
	outline: none;
	border-color: var(--gogo24-red);
	box-shadow: 0 0 0 2px rgba(227,6,19,0.15);
}

/* --- Tabellen / Cart ---------------------------------------- */
.woocommerce table.shop_table {
	border-radius: 4px;
	border-color: var(--gogo24-border);
}
.woocommerce table.shop_table th {
	background: var(--gogo24-dark);
	color: #ffffff;
	font-family: var(--gogo24-font-head);
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

/* --- Kategorien-Kacheln (Homepage) -------------------------- */
.gogo24-cat-grid {
background: linear-gradient(180deg, #ffffff 0%, var(--gogo24-bg-soft) 100%);
padding: 2.5em 0 2em;
}
.gogo24-cat-grid .col-full { padding-left: 1em; padding-right: 1em; }
.gogo24-cat-grid__title {
text-align: center;
font-family: var(--gogo24-font-head);
text-transform: uppercase;
letter-spacing: 0.06em;
margin: 0 0 1.2em;
font-size: 1.6em;
color: var(--gogo24-dark);
}
.gogo24-cat-grid__title::after {
content: "";
display: block;
width: 60px;
height: 3px;
background: var(--gogo24-yellow);
margin: 0.5em auto 0;
}
.gogo24-cat-grid__list {
list-style: none;
margin: 0;
padding: 0;
display: grid;
grid-template-columns: repeat(6, 1fr);
gap: 1em;
}
@media (max-width: 992px) {
.gogo24-cat-grid__list { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 540px) {
.gogo24-cat-grid__list { grid-template-columns: repeat(2, 1fr); }
}
.gogo24-cat-grid__item a {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 0.5em;
background: #fff;
border: 1px solid var(--gogo24-border);
border-radius: 6px;
padding: 1.2em 0.6em;
text-align: center;
color: var(--gogo24-dark);
text-decoration: none;
font-family: var(--gogo24-font-head);
font-weight: 600;
text-transform: uppercase;
font-size: 0.9em;
letter-spacing: 0.04em;
transition: transform .15s ease, box-shadow .2s ease, border-color .15s ease;
min-height: 110px;
}
.gogo24-cat-grid__item a:hover {
transform: translateY(-3px);
box-shadow: 0 8px 20px rgba(0,0,0,0.08);
border-color: var(--gogo24-yellow);
color: var(--gogo24-red);
}
.gogo24-cat-grid__icon {
font-size: 1.8em;
color: var(--gogo24-red);
line-height: 1;
}

/* --- Hauptnavigation: Kategorien-Style ---------------------- */
.main-navigation ul.menu li a,
.main-navigation ul.nav-menu li a {
padding: 0.4em 1em;
font-size: 0.85em;
}
.main-navigation ul.menu > li:first-child > a,
.main-navigation ul.nav-menu > li:first-child > a {
padding-left: 0;
}

/* --- Site-Header-Layout (Logo links, Suche mittig, Cart rechts) --- */
@media (min-width: 768px) {
.site-header .col-full {
display: grid;
grid-template-columns: auto 1fr auto;
align-items: center;
gap: 2em;
}
.site-header .site-branding { grid-column: 1; }
.site-header .site-search,
.site-header .widget_product_search { grid-column: 2; }
ul.site-header-cart,
.site-header-cart {
	grid-column: 3;
	margin: 0;
	display: flex !important;
	flex-wrap: nowrap;
	align-items: center;
	gap: 0.6em;
	white-space: nowrap;
	min-width: max-content;
	flex: 0 0 auto;
}
ul.site-header-cart li,
.site-header-cart li {
	display: inline-flex;
	align-items: center;
	width: auto !important;
	float: none !important;
	margin: 0 !important;
}
.storefront-primary-navigation {
grid-column: 1 / -1;
margin-top: 0.6em;
}
}

/* --- Cart-Button im Header: nur Korb-Icon mit Zahl-Badge --- */
.site-header-cart .cart-contents {
	position: relative;
	background: transparent !important;
	color: var(--gogo24-yellow) !important;
	padding: 0 !important;
	border-radius: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	line-height: 1;
	/* Etwaige Text-Nodes (z.B. „1 item“ aus altem WC-Fragment in sessionStorage)
	   unsichtbar machen – nur das Icon (::after) und das .count-Badge bleiben sichtbar. */
	font-size: 0 !important;
	text-indent: 0 !important;
}
.site-header-cart .cart-contents:hover {
	background: transparent !important;
	color: #fff !important;
}
/* Storefronts Korb-Icon (::after FontAwesome) eigenständig setzen –
   wir verlassen uns nicht auf font-family-Vererbung von .cart-contents
   (font-size:0 dort würde sonst auch das Icon ausblenden). */
.site-header-cart .cart-contents::after {
	font-family: "Font Awesome 5 Free" !important;
	font-weight: 900 !important;
	content: "\f291" !important; /* fa-shopping-bag */
	font-size: 26px !important;
	line-height: 1 !important;
	height: auto !important;
	width: auto !important;
	float: none !important;
	display: inline-block !important;
	color: inherit !important;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-style: normal;
	font-variant: normal;
}
/* Subtotal-Text (falls vom Original-Storefront via AJAX-Fragments wieder eingefügt) ausblenden */
.site-header-cart .cart-contents .amount,
.site-header-cart .cart-contents__total {
	display: none !important;
}
/* Zahl-Badge direkt am Korb (oben rechts, leicht überlappend) */
.site-header-cart .cart-contents .count {
	position: absolute;
	top: 2px;
	right: 2px;
	min-width: 1px;
	height: 10px;
	padding: 0 4px;
	background: var(--gogo24-red);
	color: #fff !important;
	border-radius: 8px;
	font-family: var(--gogo24-font-num);
	font-size: 10px;
	font-weight: 700;
	line-height: 16px;
	text-align: center;
	letter-spacing: 0;
	opacity: 1 !important;
	box-shadow: 0 0 0 2px var(--gogo24-dark);
	pointer-events: none;
	display: inline-block !important;
}
.site-header-cart .cart-contents[data-count="0"] .count {
	display: none !important;
}

/* --- Mini-Cart-Dropdown (Widget) --------------------------- */
/* Storefront positioniert das Dropdown mit width:100% relativ zu .site-header-cart.
   Da unser .site-header-cart jetzt nur 40 px breit ist, müssen wir Breite und
   Position manuell setzen und Storefronts Hover-Logik beibehalten. */
.site-header-cart .widget_shopping_cart {
	white-space: normal;
	width: 360px !important;
	max-width: calc(100vw - 2em);
	padding: 1em 1.1em !important;
	background: #ffffff !important;
	color: var(--gogo24-text) !important;
	border: 1px solid var(--gogo24-border);
	border-radius: 6px;
	box-shadow: 0 12px 28px rgba(0,0,0,0.18);
	top: 100% !important;
	left: auto !important;
	right: -999em;
	font-size: 0.95em !important;
}
.site-header-cart:hover .widget_shopping_cart,
.site-header-cart.focus .widget_shopping_cart {
	left: auto !important;
	right: 0 !important;
}
.site-header-cart .widget_shopping_cart .product_list_widget {
	margin: 0 0 0.8em;
	padding: 0;
	list-style: none;
}
.site-header-cart .widget_shopping_cart .product_list_widget li {
	display: grid;
	grid-template-columns: 48px 1fr auto;
	grid-column-gap: 0.7em;
	align-items: start;
	padding: 0.6em 0 !important;
	border-bottom: 1px solid var(--gogo24-border);
	width: auto;
	float: none;
	margin: 0;
}
.site-header-cart .widget_shopping_cart .product_list_widget li:last-child {
	border-bottom: 0;
}
.site-header-cart .widget_shopping_cart .product_list_widget li a {
	color: var(--gogo24-dark);
	text-decoration: none;
	font-weight: 500;
	line-height: 1.3;
}
.site-header-cart .widget_shopping_cart .product_list_widget li img {
	grid-column: 1;
	grid-row: 1 / span 2;
	width: 48px !important;
	max-width: 48px !important;
	height: auto;
	margin: 0 !important;
	float: none;
	border: 1px solid var(--gogo24-border);
	border-radius: 4px;
	background: #fff;
}
.site-header-cart .widget_shopping_cart .product_list_widget li > a:not(.remove) {
	grid-column: 2;
	grid-row: 1;
}
.site-header-cart .widget_shopping_cart .product_list_widget li .quantity {
	grid-column: 2;
	grid-row: 2;
	font-size: 0.85em;
	color: #555;
	font-family: var(--gogo24-font-num);
}
.site-header-cart .widget_shopping_cart .product_list_widget li .remove {
	grid-column: 3;
	grid-row: 1;
	position: static !important;
	margin: 0 !important;
	color: #888 !important;
	font-size: 1.1em;
	line-height: 1;
}
.site-header-cart .widget_shopping_cart .product_list_widget li .remove:hover {
	color: var(--gogo24-red) !important;
	background: transparent !important;
}
.site-header-cart .widget_shopping_cart .total {
	padding: 0.8em 0 0 !important;
	margin: 0 0 0.8em !important;
	border-top: 2px solid var(--gogo24-dark) !important;
	border-bottom: 0 !important;
	font-family: var(--gogo24-font-head);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--gogo24-text) !important;
	text-align: left;
	background: transparent !important;
}
.site-header-cart .widget_shopping_cart .total .amount,
.site-header-cart .widget_shopping_cart .total strong {
	color: var(--gogo24-red);
	font-family: var(--gogo24-font-num);
	font-weight: 700;
}
/* Zusätzliche Zeilen, die manche Plugins (z.B. Germanized) im Mini-Cart einfügen */
.site-header-cart .widget_shopping_cart .includes_tax,
.site-header-cart .widget_shopping_cart .woocommerce-shipping-destination,
.site-header-cart .widget_shopping_cart .woocommerce-mini-cart__total,
.site-header-cart .widget_shopping_cart .wc-gzd-additional-info,
.site-header-cart .widget_shopping_cart .wc-gzd-shipping-costs-info,
.site-header-cart .widget_shopping_cart .wc-gzd-additional-info-shipping-costs,
.site-header-cart .widget_shopping_cart .wc-gzd-additional-info-shipping_costs_info,
.site-header-cart .widget_shopping_cart small.includes_tax,
.site-header-cart .widget_shopping_cart .woocommerce-mini-cart__buttons,
.site-header-cart .widget_shopping_cart p {
	background: transparent !important;
	color: var(--gogo24-text) !important;
}
.site-header-cart .widget_shopping_cart a {
	color: var(--gogo24-dark) !important;
}
.site-header-cart .widget_shopping_cart a:hover {
	color: var(--gogo24-red) !important;
}
.site-header-cart .widget_shopping_cart p.buttons {
	display: flex;
	flex-direction: column;
	gap: 0.5em;
	margin: 0;
	padding: 0 !important;
	background: transparent !important;
}
.site-header-cart .widget_shopping_cart p.buttons a.button {
	display: block;
	width: 100%;
	text-align: center;
	padding: 0.7em 1em;
	font-size: 0.9em;
	margin: 0;
}
.site-header-cart .widget_shopping_cart p.buttons a.checkout {
	background: var(--gogo24-dark);
	color: var(--gogo24-yellow) !important;
}
.site-header-cart .widget_shopping_cart p.buttons a.checkout:hover {
	background: var(--gogo24-yellow);
	color: var(--gogo24-dark) !important;
}
.site-header-cart .widget_shopping_cart small.includes_tax,
.site-header-cart .widget_shopping_cart small {
	display: block;
	font-size: 0.78em;
	color: #666;
	font-family: var(--gogo24-font-body);
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
	margin-top: 0.2em;
}

/* --- Produktkarten: Bild zentriert, gleiche Höhe ----------- */
.woocommerce ul.products li.product a img,
.woocommerce-page ul.products li.product a img {
background: #fff;
border-radius: 4px;
margin-bottom: 0.8em;
}
.woocommerce ul.products li.product .button {
width: 100%;
text-align: center;
margin-top: 0.6em;
}

/* =============================================================
   Phase 2 – Startseite (Hero, USP-Strip, Produkt-Sektionen)
   und Mobile-Optimierung
   ============================================================= */

/* --- Frontpage-Wrapper: Sektionen full-bleed ---------------- */
.gogo24-frontpage #main {
margin: 0 !important;
padding: 0 !important;
max-width: none !important;
width: 100%;
}
.gogo24-frontpage .gogo24-frontpage__content {
max-width: 1110px;
margin: 2.5em auto;
padding: 0 1.5em;
font-size: 1em;
line-height: 1.6;
}

/* Standard-Page-Title auf der Frontpage ausblenden – Hero übernimmt */
body.page-template-template-frontpage .entry-header,
body.page-template-template-frontpage .page-header {
display: none;
}

/* --- Hero ---------------------------------------------------- */
.gogo24-hero {
background:
linear-gradient(135deg, rgba(17,19,21,0.85) 0%, rgba(31,34,38,0.95) 100%),
radial-gradient(circle at 20% 30%, rgba(255,203,5,0.15) 0%, transparent 60%),
radial-gradient(circle at 80% 70%, rgba(227,6,19,0.18) 0%, transparent 55%),
var(--gogo24-dark);
color: #fff;
padding: 4.5em 1.5em 4em;
text-align: center;
border-bottom: 4px solid var(--gogo24-yellow);
position: relative;
overflow: hidden;
}
.gogo24-hero__inner {
max-width: 900px;
margin: 0 auto;
position: relative;
z-index: 2;
}
.gogo24-hero__eyebrow {
margin: 0 0 0.6em;
color: var(--gogo24-silver);
font-family: var(--gogo24-font-head);
letter-spacing: 0.2em;
text-transform: uppercase;
font-size: 0.85em;
}
.gogo24-hero__title {
margin: 0 0 0.6em;
font-family: var(--gogo24-font-head);
font-weight: 700;
font-size: clamp(2.2em, 6vw, 4em);
line-height: 1.05;
text-transform: uppercase;
letter-spacing: 0.02em;
color: #fff;
}
.gogo24-hero__title .accent-yellow { color: var(--gogo24-yellow); }
.gogo24-hero__title .accent-red    { color: var(--gogo24-red); }
.gogo24-hero__sub {
margin: 0.4em auto 1.6em;
max-width: 640px;
color: var(--gogo24-text-on-dark);
font-size: clamp(1em, 1.6vw, 1.15em);
line-height: 1.5;
}
.gogo24-hero__cta {
display: flex;
flex-wrap: wrap;
gap: 0.8em;
justify-content: center;
margin: 0;
}
.gogo24-hero__btn {
font-size: 1.05em;
padding: 1em 2.2em !important;
}
.gogo24-hero__btn-ghost {
display: inline-block;
padding: 1em 1.6em;
border: 2px solid var(--gogo24-silver);
color: #fff !important;
border-radius: 3px;
font-family: var(--gogo24-font-head);
text-transform: uppercase;
font-weight: 500;
letter-spacing: 0.06em;
font-size: 0.95em;
text-decoration: none;
transition: border-color .15s ease, color .15s ease, background .15s ease;
}
.gogo24-hero__btn-ghost:hover,
.gogo24-hero__btn-ghost:focus {
border-color: var(--gogo24-yellow);
color: var(--gogo24-yellow) !important;
background: rgba(255,203,5,0.08);
}
@media (max-width: 540px) {
.gogo24-hero { padding: 3em 1.2em 2.6em; }
.gogo24-hero__btn,
.gogo24-hero__btn-ghost {
width: 100%;
text-align: center;
}
}

/* --- USP-Strip (Frontpage) ---------------------------------- */
.gogo24-usp {
background: var(--gogo24-dark-2);
color: var(--gogo24-text-on-dark);
padding: 1.4em 1.5em;
border-bottom: 1px solid #2a2d31;
}
.gogo24-usp__list {
max-width: 1110px;
margin: 0 auto;
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 1.2em;
padding: 0;
list-style: none;
text-align: center;
}
.gogo24-usp__list li {
font-size: 0.9em;
line-height: 1.35;
}
.gogo24-usp__list strong {
display: block;
color: var(--gogo24-yellow);
font-family: var(--gogo24-font-head);
text-transform: uppercase;
letter-spacing: 0.05em;
margin-bottom: 0.15em;
font-size: 1em;
}
.gogo24-usp__list span {
color: var(--gogo24-silver);
}
@media (max-width: 768px) {
.gogo24-usp__list { grid-template-columns: repeat(2, 1fr); gap: 1em; }
}

/* --- Produkt-Sektionen (Bestseller, Sale) ------------------- */
.gogo24-products {
padding: 2.8em 0 2em;
background: #fff;
}
.gogo24-products--soft {
background: var(--gogo24-bg-soft);
}
.gogo24-products .col-full {
max-width: 1110px;
margin: 0 auto;
padding: 0 1.5em;
box-sizing: border-box;
}
.gogo24-products__header {
text-align: center;
margin: 0 0 1.6em;
}
.gogo24-products__title {
font-family: var(--gogo24-font-head);
text-transform: uppercase;
letter-spacing: 0.06em;
font-size: 1.6em;
margin: 0;
color: var(--gogo24-dark);
}
.gogo24-products__title::after {
content: "";
display: block;
width: 60px;
height: 3px;
background: var(--gogo24-red);
margin: 0.5em auto 0;
}
.gogo24-products--soft .gogo24-products__title::after {
background: var(--gogo24-yellow);
}
.gogo24-products__sub {
margin: 0.6em 0 0;
color: #555;
font-size: 0.95em;
}
/* WC-Loop innerhalb unserer Sektion: Margins der Default-Wrapper-Boxen neutralisieren */
.gogo24-products .woocommerce {
margin: 0;
}
.gogo24-products ul.products {
margin: 0 !important;
}

/* --- Mobile: Header & Navigation ---------------------------- */
@media (max-width: 767px) {
.site-header {
padding: 0.6em 0 !important;
}
.site-header .col-full {
padding-left: 1em;
padding-right: 1em;
}
.site-header .site-branding {
text-align: left;
}
.site-header img.custom-logo {
max-height: 32px;
}
/* Cart-Icon rechts oben sichtbar lassen */
.site-header-cart {
position: absolute;
top: 0.7em;
right: 1em;
}
/* Storefront blendet die Suche unterhalb ein – wir geben ihr Luft */
.site-header .site-search,
.site-header .widget_product_search {
margin: 0.6em 0 0 !important;
}
/* Mega-Nav: Hauptnavigation klappt bei Storefront per Toggle.
   Wir sorgen dafür, dass der Toggle-Button gut sichtbar ist. */
.storefront-primary-navigation {
padding: 0;
}
button.menu-toggle,
.menu-toggle {
background: var(--gogo24-yellow) !important;
color: var(--gogo24-dark) !important;
font-family: var(--gogo24-font-head) !important;
text-transform: uppercase;
letter-spacing: 0.06em;
border-radius: 3px !important;
margin: 0.6em 1em !important;
/*padding: 0.7em 1em !important;*/
}
.main-navigation ul.menu li a,
.main-navigation ul.nav-menu li a {
padding: 0.9em 1em !important;
font-size: 1em !important;
border-bottom: 1px solid #2a2d31;
}
}

/* --- Mobile: Produktraster ---------------------------------- */
@media (max-width: 540px) {
.woocommerce ul.products[class*="columns-"] li.product,
.woocommerce-page ul.products[class*="columns-"] li.product {
width: 48% !important;
float: left !important;
margin: 0 4% 1.2em 0 !important;
}
.woocommerce ul.products[class*="columns-"] li.product:nth-child(2n),
.woocommerce-page ul.products[class*="columns-"] li.product:nth-child(2n) {
margin-right: 0 !important;
}
.woocommerce ul.products[class*="columns-"] li.product:nth-child(2n+1),
.woocommerce-page ul.products[class*="columns-"] li.product:nth-child(2n+1) {
clear: left;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title {
font-size: 0.95em;
min-height: 2.4em;
}
.woocommerce ul.products li.product .price {
font-size: 1.1em;
}
}

/* --- Mobile: Cart / Checkout / Tabellen --------------------- */
@media (max-width: 768px) {
.woocommerce table.shop_table_responsive tr td,
.woocommerce-page table.shop_table_responsive tr td {
padding: 0.7em 0.8em !important;
}
.woocommerce-cart .wc-proceed-to-checkout .checkout-button {
font-size: 1em;
padding: 1em 1.2em;
}
.gogo24-products {
padding: 2em 0 1.5em;
}
.gogo24-products__title {
font-size: 1.3em;
}
.gogo24-cat-grid {
padding: 1.8em 0 1.4em;
}
}

/* --- Mobile: Footer-Info bereits responsive (siehe oben) --- */

/* --- Reduzierter Motion-Modus (a11y) ------------------------ */
@media (prefers-reduced-motion: reduce) {
.woocommerce ul.products li.product:hover { transform: none; }
.gogo24-cat-grid__item a:hover { transform: none; }
.gogo24-hero__btn-ghost,
.button { transition: none !important; }
}