/*
Theme Name: 24ST Shop
Theme URI: https://24st-shop.de
Description: Professionelles Frontend für die 24ST Shops.
Author: 24ST
Template: storefront
Version: 2.0.0
Text Domain: 24st-shop
*/

/* ============================================================
   RESET / BASIS
   ============================================================ */

:root {
    --24-bg: #f5f4f1;
    --24-surface: #ffffff;
    --24-text: #111111;
    --24-muted: #777777;
    --24-border: rgba(17,17,17,.10);
    --24-accent: #111111;
    --24-radius: 2px;
    --24-max: 1440px;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0 !important;
    background: var(--24-bg) !important;
    color: var(--24-text);
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    overflow-x: hidden;
}

body,
button,
input,
textarea,
select {
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

a {
    color: inherit;
    text-decoration: none;
}

.site {
    margin: 0 !important;
}

.site-header,
.site-footer,
.storefront-breadcrumb,
.woocommerce-breadcrumb {
    display: none !important;
}

.content-area {
    width: 100% !important;
    margin: 0 !important;
}

.widget-area {
    display: none !important;
}

.site-content {
    margin: 0 !important;
    padding: 0 !important;
}

.col-full {
    max-width: none !important;
    padding: 0 !important;
    margin: 0 !important;
}


/* ============================================================
   SHOP-SPEZIFISCHE FARBEN
   ============================================================ */

.shop24-vintage {
    --24-bg: #f3f0eb;
    --24-accent: #181714;
}

.shop24-elektro {
    --24-bg: #f4f7f8;
    --24-accent: #0c1215;
}

.shop24-geschenk {
    --24-bg: #f8f3f2;
    --24-accent: #24191b;
}


/* ============================================================
   HEADER
   ============================================================ */

.shop24-header {
    position: absolute;
    z-index: 1000;
    top: 0;
    left: 0;
    width: 100%;
    color: #fff;
}

.shop24-header-inner {
    width: min(calc(100% - 64px), var(--24-max));
    min-height: 92px;
    margin: auto;
    display: grid;
    grid-template-columns: 220px 1fr 220px;
    align-items: center;
    gap: 20px;
}

.shop24-logo {
    display: flex;
    align-items: baseline;
    gap: 9px;
    font-weight: 800;
    letter-spacing: -.04em;
}

.shop24-logo-main {
    font-size: 25px;
}

.shop24-logo-shop {
    font-size: 10px;
    letter-spacing: .18em;
    opacity: .75;
}

.shop24-nav {
    display: flex;
    justify-content: center;
}

.shop24-menu {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 30px;
}

.shop24-menu li {
    margin: 0;
}

.shop24-menu a {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    opacity: .82;
    transition: opacity .25s ease;
}

.shop24-menu a:hover {
    opacity: 1;
}

.shop24-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

.shop24-action {
    width: 40px;
    height: 40px;
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    transition: background .25s ease, transform .25s ease;
}

.shop24-action:hover {
    background: rgba(255,255,255,.12);
    transform: translateY(-2px);
}

.shop24-icon {
    font-size: 19px;
    line-height: 1;
}

.shop24-cart-count {
    position: absolute;
    top: -3px;
    right: -3px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #fff;
    color: #111;
    font-size: 9px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 800;
}

.shop24-mobile-toggle,
.shop24-mobile-menu {
    display: none;
}


/* ============================================================
   HERO
   ============================================================ */

.shop24-hero {
    min-height: 790px;
    height: 92vh;
    max-height: 950px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    background: #111;
    color: #fff;
}

.shop24-hero-bg {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 75% 30%, rgba(255,255,255,.12), transparent 30%),
        radial-gradient(circle at 20% 80%, rgba(255,255,255,.07), transparent 35%),
        linear-gradient(125deg, #0d0d0c 0%, #20201d 45%, #111 100%);
}

.shop24-elektro .shop24-hero-bg {
    background:
        radial-gradient(circle at 75% 30%, rgba(76,182,255,.22), transparent 27%),
        radial-gradient(circle at 20% 80%, rgba(0,220,255,.08), transparent 32%),
        linear-gradient(125deg, #050708 0%, #11191d 50%, #050708 100%);
}

.shop24-geschenk .shop24-hero-bg {
    background:
        radial-gradient(circle at 75% 30%, rgba(255,170,170,.18), transparent 28%),
        radial-gradient(circle at 20% 80%, rgba(255,255,255,.08), transparent 35%),
        linear-gradient(125deg, #161011 0%, #302021 48%, #120e0f 100%);
}

.shop24-hero-content {
    position: relative;
    z-index: 3;
    width: min(calc(100% - 64px), var(--24-max));
    margin: auto;
    padding-top: 80px;
}

.shop24-eyebrow {
    display: block;
    margin-bottom: 24px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .25em;
    text-transform: uppercase;
    opacity: .65;
}

.shop24-hero h1 {
    max-width: 850px;
    margin: 0;
    font-size: clamp(58px, 8vw, 125px);
    line-height: .9;
    letter-spacing: -.065em;
    font-weight: 700;
}

.shop24-hero h1 em {
    font-family: Georgia, serif;
    font-weight: 400;
    letter-spacing: -.06em;
}

.shop24-hero p {
    max-width: 510px;
    margin: 35px 0;
    font-size: 16px;
    line-height: 1.7;
    color: rgba(255,255,255,.72);
}

.shop24-button {
    display: inline-flex;
    align-items: center;
    gap: 24px;
    padding: 17px 23px;
    background: #fff;
    color: #111;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    transition: transform .3s ease, padding .3s ease;
}

.shop24-button span {
    font-size: 17px;
    transition: transform .3s ease;
}

.shop24-button:hover {
    transform: translateY(-3px);
    padding-right: 28px;
}

.shop24-button:hover span {
    transform: translateX(4px);
}

.shop24-hero-orbit {
    position: absolute;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 50%;
    pointer-events: none;
}

.orbit-one {
    width: 620px;
    height: 620px;
    right: -100px;
    top: 50%;
    transform: translateY(-50%);
}

.orbit-two {
    width: 380px;
    height: 380px;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
}


/* ============================================================
   SECTIONS
   ============================================================ */

.shop24-section {
    width: min(calc(100% - 64px), var(--24-max));
    margin: auto;
    padding: 125px 0;
}

.shop24-intro {
    text-align: center;
}

.shop24-intro-inner {
    max-width: 720px;
    margin: auto;
}

.shop24-intro h2,
.shop24-section-heading h2,
.shop24-final-cta h2 {
    margin: 0;
    font-size: clamp(42px, 5vw, 76px);
    line-height: .95;
    letter-spacing: -.06em;
}

.shop24-intro p {
    max-width: 560px;
    margin: 28px auto 0;
    color: var(--24-muted);
    line-height: 1.8;
}


/* ============================================================
   KATEGORIEN
   ============================================================ */

.shop24-category-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-top: 1px solid var(--24-border);
    border-left: 1px solid var(--24-border);
}

.shop24-category-card {
    min-height: 280px;
    padding: 30px;
    border-right: 1px solid var(--24-border);
    border-bottom: 1px solid var(--24-border);
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: background .4s ease, transform .4s ease;
}

.shop24-category-card:hover {
    background: var(--24-surface);
    transform: translateY(-5px);
}

.shop24-category-number {
    font-size: 11px;
    color: var(--24-muted);
}

.shop24-category-name {
    font-size: clamp(25px, 3vw, 42px);
    letter-spacing: -.045em;
    font-weight: 650;
}

.shop24-category-arrow {
    position: absolute;
    right: 28px;
    top: 27px;
    font-size: 22px;
    transition: transform .3s ease;
}

.shop24-category-card:hover .shop24-category-arrow {
    transform: translate(4px, -4px);
}


/* ============================================================
   PRODUKTE
   ============================================================ */

.shop24-section-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 55px;
}

.shop24-text-link {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.shop24-text-link span {
    margin-left: 12px;
    font-size: 17px;
}

.shop24-product-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
}

.shop24-product-card {
    min-width: 0;
}

.shop24-product-image {
    aspect-ratio: 4 / 5;
    overflow: hidden;
    background: #e9e7e2;
}

.shop24-product-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .7s cubic-bezier(.2,.7,.2,1);
}

.shop24-product-card:hover img {
    transform: scale(1.045);
}

.shop24-product-info {
    padding: 17px 2px;
}

.shop24-product-info h3 {
    margin: 0 0 7px;
    font-size: 14px;
    font-weight: 600;
}

.shop24-product-info span {
    font-size: 13px;
    color: var(--24-muted);
}

.shop24-empty-products {
    padding: 100px 30px;
    text-align: center;
    background: var(--24-surface);
}

.shop24-empty-symbol {
    margin-bottom: 20px;
    font-size: 60px;
    font-weight: 800;
    letter-spacing: -.08em;
    opacity: .12;
}

.shop24-empty-products h3 {
    margin: 0;
    font-size: 28px;
    letter-spacing: -.04em;
}

.shop24-empty-products p {
    color: var(--24-muted);
}


/* ============================================================
   EDITORIAL
   ============================================================ */

.shop24-editorial-panel {
    min-height: 600px;
    padding: 70px;
    position: relative;
    overflow: hidden;
    background: #111;
    color: #fff;
    display: flex;
    align-items: center;
}

.shop24-editorial-number {
    position: absolute;
    right: -50px;
    bottom: -140px;
    font-size: 600px;
    line-height: 1;
    font-weight: 800;
    letter-spacing: -.12em;
    color: rgba(255,255,255,.035);
}

.shop24-editorial-content {
    position: relative;
    z-index: 2;
    max-width: 560px;
}

.shop24-editorial-content h2 {
    margin: 0;
    font-size: clamp(55px, 7vw, 100px);
    line-height: .9;
    letter-spacing: -.065em;
}

.shop24-editorial-content p {
    max-width: 440px;
    margin: 30px 0;
    color: rgba(255,255,255,.65);
    line-height: 1.7;
}

.shop24-button-light {
    background: #fff;
}


/* ============================================================
   FINAL CTA
   ============================================================ */

.shop24-final-cta {
    text-align: center;
    padding-top: 140px;
    padding-bottom: 150px;
}

.shop24-final-cta h2 {
    max-width: 900px;
    margin: 0 auto 45px;
}


/* ============================================================
   FOOTER
   ============================================================ */

.shop24-footer {
    background: #111;
    color: #fff;
    padding: 75px max(32px, calc((100vw - var(--24-max)) / 2)) 25px;
}

.shop24-footer-main {
    display: grid;
    grid-template-columns: 2fr repeat(3, 1fr);
    gap: 50px;
    padding-bottom: 70px;
}

.shop24-footer-logo {
    font-size: 42px;
    font-weight: 800;
    letter-spacing: -.07em;
}

.shop24-footer p {
    margin: 6px 0;
    color: rgba(255,255,255,.45);
    font-size: 11px;
    letter-spacing: .15em;
}

.shop24-footer h3 {
    margin: 5px 0 22px;
    font-size: 10px;
    letter-spacing: .16em;
    text-transform: uppercase;
    opacity: .45;
}

.shop24-footer a {
    display: block;
    width: fit-content;
    margin-bottom: 11px;
    color: rgba(255,255,255,.75);
    font-size: 12px;
    transition: color .2s ease;
}

.shop24-footer a:hover {
    color: #fff;
}

.shop24-footer-bottom {
    border-top: 1px solid rgba(255,255,255,.1);
    padding-top: 22px;
    display: flex;
    justify-content: space-between;
    color: rgba(255,255,255,.35);
    font-size: 10px;
    letter-spacing: .12em;
    text-transform: uppercase;
}


/* ============================================================
   ANIMATIONEN
   ============================================================ */

.shop24-reveal {
    opacity: 0;
    transform: translateY(35px);
    transition:
        opacity .8s cubic-bezier(.2,.7,.2,1),
        transform .8s cubic-bezier(.2,.7,.2,1);
}

.shop24-reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
}


/* ============================================================
   MOBILE
   ============================================================ */

@media (max-width: 900px) {

    .shop24-header-inner {
        width: calc(100% - 36px);
        min-height: 75px;
        grid-template-columns: 45px 1fr 90px;
    }

    .shop24-mobile-toggle {
        display: flex;
        width: 38px;
        height: 38px;
        border: 0;
        background: transparent;
        flex-direction: column;
        justify-content: center;
        gap: 5px;
        padding: 0;
        cursor: pointer;
    }

    .shop24-mobile-toggle span {
        width: 21px;
        height: 1px;
        background: #fff;
        display: block;
        transition: transform .25s ease;
    }

    .shop24-nav {
        display: none;
    }

    .shop24-logo {
        justify-content: center;
    }

    .shop24-actions {
        gap: 5px;
    }

    .shop24-action {
        width: 35px;
        height: 35px;
    }

    .shop24-mobile-menu {
        display: block;
        position: absolute;
        left: 0;
        right: 0;
        top: 75px;
        padding: 20px 25px 28px;
        background: rgba(15,15,15,.96);
        backdrop-filter: blur(20px);
        opacity: 0;
        visibility: hidden;
        transform: translateY(-10px);
        transition: opacity .25s ease, transform .25s ease, visibility .25s ease;
    }

    .shop24-header.mobile-open .shop24-mobile-menu {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }

    .shop24-mobile-nav {
        list-style: none;
        margin: 0;
        padding: 0;
    }

    .shop24-mobile-nav li {
        margin: 0;
        border-bottom: 1px solid rgba(255,255,255,.1);
    }

    .shop24-mobile-nav a {
        display: block;
        padding: 16px 0;
        color: #fff;
        font-size: 13px;
        text-transform: uppercase;
        letter-spacing: .08em;
    }

    .shop24-section {
        width: calc(100% - 36px);
        padding: 85px 0;
    }

    .shop24-hero {
        min-height: 700px;
        height: 90vh;
    }

    .shop24-hero-content {
        width: calc(100% - 36px);
        padding-top: 80px;
    }

    .shop24-hero h1 {
        font-size: clamp(55px, 16vw, 90px);
    }

    .shop24-hero p {
        font-size: 14px;
        max-width: 400px;
    }

    .shop24-hero-orbit {
        opacity: .6;
        right: -280px;
    }

    .shop24-category-grid {
        grid-template-columns: 1fr;
    }

    .shop24-category-card {
        min-height: 190px;
    }

    .shop24-product-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    .shop24-section-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .shop24-editorial-panel {
        min-height: 500px;
        padding: 45px 30px;
    }

    .shop24-editorial-number {
        font-size: 380px;
    }

    .shop24-footer {
        padding: 55px 25px 25px;
    }

    .shop24-footer-main {
        grid-template-columns: 1fr 1fr;
        gap: 45px 25px;
    }

    .shop24-footer-main > div:first-child {
        grid-column: 1 / -1;
    }

}

@media (max-width: 520px) {

    .shop24-hero {
        min-height: 650px;
    }

    .shop24-hero h1 {
        font-size: 54px;
    }

    .shop24-intro h2,
    .shop24-section-heading h2,
    .shop24-final-cta h2 {
        font-size: 43px;
    }

    .shop24-product-grid {
        grid-template-columns: 1fr 1fr;
    }

    .shop24-product-info h3 {
        font-size: 12px;
    }

    .shop24-editorial-panel {
        min-height: 450px;
    }

    .shop24-editorial-content h2 {
        font-size: 54px;
    }

}


/* =========================================================
   24ST FINAL FRONTEND OVERRIDES
   ========================================================= */

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

body.shop24-site {
    background: #f5f6f7 !important;
    color: #111820 !important;
    overflow-x: hidden;
}


/* HEADER ------------------------------------------------- */

.shop24-header {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    z-index: 1000 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.shop24-header-inner {
    width: min(1320px, calc(100% - 64px)) !important;
    height: 92px !important;
    margin: 0 auto !important;

    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 40px !important;
}


/* LOGO */

.shop24-logo {
    display: inline-flex !important;
    align-items: baseline !important;
    gap: 10px !important;
    color: #fff !important;
    text-decoration: none !important;
    flex-shrink: 0 !important;
}

.shop24-logo-main {
    font-size: 24px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
}

.shop24-logo-shop {
    font-size: 10px !important;
    font-weight: 700 !important;
    letter-spacing: 2px !important;
    opacity: .75 !important;
}


/* NAVIGATION */

.shop24-nav {
    flex: 1 !important;
    display: flex !important;
    justify-content: center !important;
    min-width: 0 !important;
}

.shop24-menu {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 34px !important;

    margin: 0 !important;
    padding: 0 !important;

    list-style: none !important;
}

.shop24-menu > li {
    position: relative !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
}

.shop24-menu > li > a {
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;

    padding: 10px 0 !important;

    color: rgba(255,255,255,.86) !important;
    text-decoration: none !important;

    font-size: 12px !important;
    font-weight: 650 !important;
    letter-spacing: .4px !important;
    white-space: nowrap !important;
}

.shop24-menu > li > a:hover {
    color: #fff !important;
}


/* UNTERMENÜ NICHT MEHR DAUERHAFT ANZEIGEN */

.shop24-menu .sub-menu {
    position: absolute !important;

    top: calc(100% + 12px) !important;
    left: 50% !important;
    transform: translateX(-50%) translateY(8px) !important;

    min-width: 210px !important;

    margin: 0 !important;
    padding: 12px !important;

    display: block !important;

    list-style: none !important;

    background: rgba(16,22,27,.97) !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    border-radius: 12px !important;

    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;

    transition:
        opacity .2s ease,
        transform .2s ease,
        visibility .2s ease !important;
}

.shop24-menu > li:hover > .sub-menu {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;

    transform: translateX(-50%) translateY(0) !important;
}

.shop24-menu .sub-menu li {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
}

.shop24-menu .sub-menu a {
    display: block !important;

    padding: 9px 12px !important;

    color: rgba(255,255,255,.78) !important;
    text-decoration: none !important;

    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;

    border-radius: 7px !important;
}

.shop24-menu .sub-menu a:hover {
    color: #fff !important;
    background: rgba(255,255,255,.08) !important;
}


/* ACTIONS */

.shop24-actions {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    flex-shrink: 0 !important;
}

.shop24-action {
    width: 42px !important;
    height: 42px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    color: #fff !important;
    text-decoration: none !important;

    border: 1px solid rgba(255,255,255,.20) !important;
    border-radius: 50% !important;

    background: rgba(255,255,255,.04) !important;

    transition: .2s ease !important;
}

.shop24-action:hover {
    background: rgba(255,255,255,.10) !important;
    transform: translateY(-1px) !important;
}

.shop24-icon {
    font-size: 18px !important;
    line-height: 1 !important;
}

.shop24-cart {
    position: relative !important;
}

.shop24-cart-count {
    position: absolute !important;

    top: -4px !important;
    right: -4px !important;

    min-width: 17px !important;
    height: 17px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 0 4px !important;

    background: #fff !important;
    color: #111820 !important;

    border-radius: 20px !important;

    font-size: 9px !important;
    font-weight: 800 !important;
}


/* MAIN */

.shop24-main {
    margin: 0 !important;
    padding: 0 !important;
}


/* HERO --------------------------------------------------- */

.shop24-hero {
    position: relative !important;

    min-height: 760px !important;

    display: flex !important;
    align-items: center !important;

    overflow: hidden !important;

    padding: 120px 0 100px !important;
}


/* Hintergrund */

.shop24-hero::before {
    content: "" !important;

    position: absolute !important;
    inset: 0 !important;

    background:
        radial-gradient(
            circle at 78% 42%,
            rgba(70,115,145,.25),
            transparent 34%
        ),
        radial-gradient(
            circle at 22% 65%,
            rgba(20,85,105,.28),
            transparent 38%
        ),
        linear-gradient(
            135deg,
            #0b1115 0%,
            #111b21 48%,
            #080d11 100%
        ) !important;

    z-index: 0 !important;
}


/* dekorative Kreise */

.shop24-hero::after {
    content: "" !important;

    position: absolute !important;

    width: 560px !important;
    height: 560px !important;

    right: -40px !important;
    top: 90px !important;

    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: 50% !important;

    box-shadow:
        0 0 0 110px rgba(255,255,255,.025),
        0 0 0 220px rgba(255,255,255,.015) !important;

    z-index: 0 !important;
}

.shop24-hero > * {
    position: relative !important;
    z-index: 2 !important;
}

.shop24-hero .shop24-container,
.shop24-hero > div {
    position: relative !important;
    z-index: 2 !important;
}


/* HERO TEXT */

.shop24-hero h1,
.shop24-hero .shop24-hero-title,
.shop24-hero .shop24-title {
    color: #fff !important;
}

.shop24-hero h1 em,
.shop24-hero .shop24-hero-title em,
.shop24-hero .shop24-title em {
    color: rgba(255,255,255,.62) !important;
}

.shop24-hero p {
    color: rgba(255,255,255,.72) !important;
}

.shop24-hero a {
    text-decoration: none !important;
}


/* BUTTON */

.shop24-hero .shop24-button,
.shop24-hero .shop24-text-link,
.shop24-hero a[class*="button"] {
    display: inline-flex !important;
    align-items: center !important;
    gap: 18px !important;

    padding: 17px 24px !important;

    background: #fff !important;
    color: #111820 !important;

    font-size: 12px !important;
    font-weight: 800 !important;
    letter-spacing: .6px !important;

    border-radius: 2px !important;

    transition: .2s ease !important;
}

.shop24-hero .shop24-button:hover,
.shop24-hero .shop24-text-link:hover,
.shop24-hero a[class*="button"]:hover {
    transform: translateY(-2px) !important;
    background: #e9eef1 !important;
}


/* GENERISCHE INHALTSBEREICHE */

.shop24-section {
    position: relative !important;
    padding: 110px 0 !important;
}

.shop24-container {
    width: min(1320px, calc(100% - 64px)) !important;
    margin: 0 auto !important;
}


/* MOBILE */

.shop24-mobile-toggle {
    display: none !important;
}

.shop24-mobile-menu {
    display: none !important;
}


/* RESPONSIVE */

@media (max-width: 1100px) {

    .shop24-header-inner {
        width: min(100% - 40px, 1320px) !important;
        gap: 20px !important;
    }

    .shop24-menu {
        gap: 18px !important;
    }

    .shop24-menu > li > a {
        font-size: 11px !important;
    }

}


@media (max-width: 850px) {

    .shop24-nav {
        display: none !important;
    }

    .shop24-mobile-toggle {
        display: flex !important;

        width: 42px !important;
        height: 42px !important;

        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 5px !important;

        padding: 0 !important;

        background: transparent !important;
        border: 1px solid rgba(255,255,255,.2) !important;
        border-radius: 50% !important;
    }

    .shop24-mobile-toggle span {
        width: 16px !important;
        height: 1px !important;
        background: #fff !important;
    }

    .shop24-mobile-menu {
        display: none !important;

        padding: 15px 24px 25px !important;

        background: rgba(10,15,19,.98) !important;
        border-top: 1px solid rgba(255,255,255,.08) !important;
    }

    .shop24-header.mobile-open .shop24-mobile-menu {
        display: block !important;
    }

    .shop24-mobile-nav,
    .shop24-mobile-nav ul {
        margin: 0 !important;
        padding: 0 !important;
        list-style: none !important;
    }

    .shop24-mobile-nav a {
        display: block !important;
        padding: 11px 0 !important;

        color: #fff !important;
        text-decoration: none !important;

        font-size: 14px !important;
    }

    .shop24-mobile-nav .sub-menu {
        padding-left: 15px !important;
    }

    .shop24-hero {
        min-height: 680px !important;
    }

}


@media (max-width: 600px) {

    .shop24-header-inner {
        width: calc(100% - 32px) !important;
        height: 78px !important;
    }

    .shop24-logo-main {
        font-size: 21px !important;
    }

    .shop24-logo-shop {
        font-size: 8px !important;
    }

    .shop24-action {
        width: 38px !important;
        height: 38px !important;
    }

    .shop24-hero {
        min-height: 650px !important;
        padding-top: 110px !important;
    }

    .shop24-container {
        width: calc(100% - 32px) !important;
    }

}


/* =========================================================
   24ST – GLOBAL SHOP SYSTEM
   Gilt für Startseite + ALLE WooCommerce-Seiten
   ========================================================= */


/* ---------------------------------------------------------
   GRUNDLAGEN
   --------------------------------------------------------- */

html {
    background: #f4f6f7 !important;
}

body.shop24-site {
    background: #f4f6f7 !important;
    color: #151b20 !important;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI",
                 Roboto, Helvetica, Arial, sans-serif !important;
}

body.shop24-site *,
body.shop24-site *::before,
body.shop24-site *::after {
    box-sizing: border-box;
}

body.shop24-site a {
    color: #151b20;
}

body.shop24-site a:hover {
    color: #526979;
}

body.shop24-site button,
body.shop24-site input,
body.shop24-site select,
body.shop24-site textarea {
    font-family: inherit;
}


/* ---------------------------------------------------------
   HEADER
   Startseite = transparent
   Unterseiten = eigener Hintergrund
   --------------------------------------------------------- */

body.shop24-site:not(.home) .shop24-header {
    position: relative !important;
    background: #10171c !important;
}

body.shop24-site:not(.home) .shop24-header-inner {
    height: 82px !important;
}

body.shop24-site:not(.home) .shop24-logo,
body.shop24-site:not(.home) .shop24-menu > li > a,
body.shop24-site:not(.home) .shop24-action {
    color: #fff !important;
}

body.shop24-site:not(.home) .shop24-action {
    border-color: rgba(255,255,255,.20) !important;
}


/* ---------------------------------------------------------
   SEITEN-CONTAINER
   --------------------------------------------------------- */

body.shop24-site .site-main,
body.shop24-site .content-area,
body.shop24-site .woocommerce,
body.shop24-site .shop24-main {
    width: 100% !important;
}

body.shop24-site .woocommerce {
    max-width: 1320px !important;
    margin: 0 auto !important;
    padding: 80px 32px 120px !important;
}


/* ---------------------------------------------------------
   SEITENÜBERSCHRIFTEN
   --------------------------------------------------------- */

body.shop24-site .woocommerce-products-header,
body.shop24-site .page-header {
    margin-bottom: 45px !important;
}

body.shop24-site .woocommerce-products-header__title,
body.shop24-site .woocommerce-products-header h1,
body.shop24-site .page-title,
body.shop24-site .entry-title {
    margin: 0 0 15px !important;

    color: #10171c !important;

    font-size: clamp(38px, 5vw, 72px) !important;
    line-height: 1.02 !important;
    font-weight: 750 !important;
    letter-spacing: -2.5px !important;
}


/* ---------------------------------------------------------
   BREADCRUMBS
   --------------------------------------------------------- */

body.shop24-site .woocommerce-breadcrumb {
    margin: 0 0 35px !important;

    color: #66737c !important;

    font-size: 12px !important;
}

body.shop24-site .woocommerce-breadcrumb a {
    color: #394852 !important;
    text-decoration: none !important;
}

body.shop24-site .woocommerce-breadcrumb a:hover {
    color: #111820 !important;
}


/* ---------------------------------------------------------
   SHOP SORTIERUNG
   --------------------------------------------------------- */

body.shop24-site .woocommerce-ordering {
    margin-bottom: 30px !important;
}

body.shop24-site .woocommerce-result-count {
    color: #68757d !important;
    font-size: 13px !important;
}

body.shop24-site .woocommerce-ordering select {
    min-height: 44px !important;

    padding: 0 38px 0 14px !important;

    color: #172027 !important;
    background: #fff !important;

    border: 1px solid #d5dce0 !important;
    border-radius: 5px !important;
}


/* ---------------------------------------------------------
   PRODUKT-GRID
   --------------------------------------------------------- */

body.shop24-site ul.products {
    display: grid !important;

    grid-template-columns:
        repeat(4, minmax(0, 1fr)) !important;

    gap: 34px 22px !important;

    margin: 0 !important;
    padding: 0 !important;

    list-style: none !important;
}

body.shop24-site ul.products::before,
body.shop24-site ul.products::after {
    display: none !important;
}

body.shop24-site ul.products li.product {
    width: auto !important;
    margin: 0 !important;

    padding: 0 !important;

    background: transparent !important;
}

body.shop24-site ul.products li.product a {
    text-decoration: none !important;
}


/* Produktbild */

body.shop24-site ul.products li.product img {
    width: 100% !important;
    aspect-ratio: 1 / 1.08 !important;

    object-fit: cover !important;

    margin: 0 0 18px !important;

    border-radius: 4px !important;

    background: #e8ecee !important;

    transition:
        transform .35s ease,
        opacity .35s ease !important;
}

body.shop24-site ul.products li.product:hover img {
    transform: scale(1.025) !important;
}


/* Produktname */

body.shop24-site ul.products li.product .woocommerce-loop-product__title {
    margin: 0 0 8px !important;

    color: #10171c !important;

    font-size: 15px !important;
    line-height: 1.35 !important;
    font-weight: 650 !important;
}


/* Preis */

body.shop24-site ul.products li.product .price {
    color: #4e5d66 !important;

    font-size: 14px !important;
    font-weight: 500 !important;
}

body.shop24-site ul.products li.product .price ins {
    color: #111820 !important;
}

body.shop24-site ul.products li.product .price del {
    color: #89949b !important;
}


/* ---------------------------------------------------------
   BADGES
   --------------------------------------------------------- */

body.shop24-site span.onsale {
    top: 14px !important;
    left: 14px !important;

    min-height: auto !important;
    min-width: auto !important;

    padding: 7px 10px !important;

    background: #10171c !important;
    color: #fff !important;

    border-radius: 2px !important;

    font-size: 10px !important;
    font-weight: 750 !important;
    letter-spacing: .5px !important;
}


/* ---------------------------------------------------------
   EINZELPRODUKT
   --------------------------------------------------------- */

body.shop24-site div.product {
    color: #151b20 !important;
}

body.shop24-site div.product .product_title {
    color: #10171c !important;

    font-size: clamp(34px, 4vw, 58px) !important;
    line-height: 1.03 !important;
    font-weight: 750 !important;
    letter-spacing: -2px !important;
}

body.shop24-site div.product .price {
    color: #172027 !important;

    font-size: 22px !important;
    font-weight: 650 !important;
}

body.shop24-site div.product .woocommerce-product-details__short-description,
body.shop24-site div.product .woocommerce-product-details__short-description p {
    color: #53616a !important;
    line-height: 1.7 !important;
}

body.shop24-site div.product .woocommerce-product-gallery img {
    border-radius: 5px !important;
}


/* ---------------------------------------------------------
   BUTTONS
   --------------------------------------------------------- */

body.shop24-site .button,
body.shop24-site button.button,
body.shop24-site input.button,
body.shop24-site a.button,
body.shop24-site .woocommerce a.button,
body.shop24-site .woocommerce button.button,
body.shop24-site .woocommerce input.button {
    min-height: 46px !important;

    padding: 13px 21px !important;

    background: #111820 !important;
    color: #fff !important;

    border: 1px solid #111820 !important;
    border-radius: 3px !important;

    font-size: 12px !important;
    font-weight: 750 !important;
    letter-spacing: .3px !important;

    text-decoration: none !important;

    transition:
        background .2s ease,
        transform .2s ease,
        border-color .2s ease !important;
}

body.shop24-site .button:hover,
body.shop24-site button.button:hover,
body.shop24-site input.button:hover,
body.shop24-site a.button:hover {
    background: #344550 !important;
    border-color: #344550 !important;
    color: #fff !important;

    transform: translateY(-1px) !important;
}


/* ---------------------------------------------------------
   FORMULARE
   --------------------------------------------------------- */

body.shop24-site input.input-text,
body.shop24-site input[type="text"],
body.shop24-site input[type="email"],
body.shop24-site input[type="tel"],
body.shop24-site input[type="password"],
body.shop24-site input[type="number"],
body.shop24-site textarea,
body.shop24-site select {
    min-height: 46px !important;

    padding: 11px 13px !important;

    background: #fff !important;
    color: #151b20 !important;

    border: 1px solid #cfd7dc !important;
    border-radius: 4px !important;

    outline: none !important;
}

body.shop24-site textarea {
    min-height: 130px !important;
}

body.shop24-site input:focus,
body.shop24-site textarea:focus,
body.shop24-site select:focus {
    border-color: #657985 !important;
    box-shadow: 0 0 0 3px rgba(75,100,115,.10) !important;
}


/* Labels */

body.shop24-site label {
    color: #26333b !important;

    font-size: 12px !important;
    font-weight: 650 !important;
}


/* ---------------------------------------------------------
   WARENKORB
   --------------------------------------------------------- */

body.shop24-site .woocommerce-cart-form,
body.shop24-site .cart-collaterals,
body.shop24-site .woocommerce-checkout-review-order,
body.shop24-site .woocommerce-checkout-payment,
body.shop24-site .woocommerce-form-login,
body.shop24-site .woocommerce-form-register,
body.shop24-site .woocommerce-MyAccount-content,
body.shop24-site .woocommerce-MyAccount-navigation {
    background: #fff !important;

    border: 1px solid #e0e5e8 !important;
    border-radius: 6px !important;
}

body.shop24-site .woocommerce-cart-form {
    padding: 25px !important;
}

body.shop24-site .cart-collaterals {
    padding: 25px !important;
}

body.shop24-site table.shop_table {
    border: 0 !important;
    color: #151b20 !important;
}

body.shop24-site table.shop_table th {
    color: #56636b !important;

    font-size: 11px !important;
    text-transform: uppercase !important;
    letter-spacing: .6px !important;
}

body.shop24-site table.shop_table td {
    color: #202b32 !important;
}


/* ---------------------------------------------------------
   CHECKOUT
   --------------------------------------------------------- */

body.shop24-site .woocommerce-checkout {
    color: #151b20 !important;
}

body.shop24-site #customer_details,
body.shop24-site #order_review {
    color: #151b20 !important;
}

body.shop24-site .woocommerce-checkout h3 {
    color: #10171c !important;

    font-size: 24px !important;
    font-weight: 700 !important;
}

body.shop24-site .woocommerce-checkout #order_review_heading {
    margin-top: 0 !important;
}


/* ---------------------------------------------------------
   MEIN KONTO
   --------------------------------------------------------- */

body.shop24-site .woocommerce-MyAccount-navigation {
    padding: 12px !important;
}

body.shop24-site .woocommerce-MyAccount-navigation ul {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

body.shop24-site .woocommerce-MyAccount-navigation li {
    margin: 0 !important;
}

body.shop24-site .woocommerce-MyAccount-navigation a {
    display: block !important;

    padding: 12px 14px !important;

    color: #34444e !important;

    text-decoration: none !important;

    border-radius: 4px !important;
}

body.shop24-site .woocommerce-MyAccount-navigation .is-active a,
body.shop24-site .woocommerce-MyAccount-navigation a:hover {
    background: #edf1f3 !important;
    color: #10171c !important;
}

body.shop24-site .woocommerce-MyAccount-content {
    padding: 30px !important;
}


/* ---------------------------------------------------------
   MESSAGES
   --------------------------------------------------------- */

body.shop24-site .woocommerce-message,
body.shop24-site .woocommerce-info,
body.shop24-site .woocommerce-error {
    color: #26343c !important;

    background: #fff !important;

    border-top: 3px solid #526774 !important;
    border-radius: 4px !important;

    box-shadow: none !important;
}

body.shop24-site .woocommerce-message::before,
body.shop24-site .woocommerce-info::before {
    color: #526774 !important;
}


/* ---------------------------------------------------------
   PAGINATION
   --------------------------------------------------------- */

body.shop24-site .woocommerce-pagination {
    margin-top: 60px !important;
}

body.shop24-site .woocommerce-pagination ul {
    border: 0 !important;
}

body.shop24-site .woocommerce-pagination li {
    border: 0 !important;
}

body.shop24-site .woocommerce-pagination a,
body.shop24-site .woocommerce-pagination span {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 40px !important;
    height: 40px !important;

    margin: 0 4px !important;

    border: 1px solid #d6dde1 !important;
    border-radius: 3px !important;

    color: #26343c !important;
    background: #fff !important;

    text-decoration: none !important;
}

body.shop24-site .woocommerce-pagination .current {
    background: #111820 !important;
    color: #fff !important;
    border-color: #111820 !important;
}


/* ---------------------------------------------------------
   FOOTER
   --------------------------------------------------------- */

.shop24-footer {
    background: #10171c !important;
    color: rgba(255,255,255,.72) !important;
}

.shop24-footer a {
    color: rgba(255,255,255,.72) !important;
}

.shop24-footer a:hover {
    color: #fff !important;
}

.shop24-footer h3,
.shop24-footer-logo {
    color: #fff !important;
}


/* ---------------------------------------------------------
   MOBILE SHOP
   --------------------------------------------------------- */

@media (max-width: 900px) {

    body.shop24-site .woocommerce {
        padding: 55px 20px 80px !important;
    }

    body.shop24-site ul.products {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 28px 15px !important;
    }

}


@media (max-width: 600px) {

    body.shop24-site .woocommerce {
        padding: 40px 16px 65px !important;
    }

    body.shop24-site .woocommerce-products-header__title,
    body.shop24-site .woocommerce-products-header h1,
    body.shop24-site .page-title,
    body.shop24-site .entry-title {
        font-size: 40px !important;
        letter-spacing: -1.5px !important;
    }

    body.shop24-site ul.products {
        grid-template-columns: 1fr !important;
    }

    body.shop24-site div.product .product_title {
        font-size: 36px !important;
    }

    body.shop24-site .woocommerce-MyAccount-content {
        padding: 20px !important;
    }

}


/* ---------------------------------------------------------
   SICHERHEIT: KEINE HELL AUF HELL / DUNKEL AUF DUNKEL
   --------------------------------------------------------- */

body.shop24-site .woocommerce,
body.shop24-site .woocommerce-page {
    color: #151b20 !important;
}

body.shop24-site .woocommerce h1,
body.shop24-site .woocommerce h2,
body.shop24-site .woocommerce h3,
body.shop24-site .woocommerce h4,
body.shop24-site .woocommerce h5,
body.shop24-site .woocommerce h6 {
    color: #10171c !important;
}

body.shop24-site .woocommerce p,
body.shop24-site .woocommerce li,
body.shop24-site .woocommerce span:not(.onsale),
body.shop24-site .woocommerce td,
body.shop24-site .woocommerce th {
    color: inherit;
}



/* =========================================================
   24ST PREMIUM LAYOUT
   Einheitlicher Abstand / Content-Rahmen für ALLE Shops
   ========================================================= */


/* ---------------------------------------------------------
   GLOBALER CONTENT-RAHMEN
   --------------------------------------------------------- */

.shop24-header-inner,
.shop24-container,
.shop24-section > .shop24-container,
.shop24-footer-main,
.shop24-footer-bottom {
    width: min(1380px, calc(100% - 120px)) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}


/* ---------------------------------------------------------
   HEADER
   --------------------------------------------------------- */

.shop24-header-inner {
    height: 88px !important;
}


/* ---------------------------------------------------------
   HERO – NICHT MEHR AM RAND
   --------------------------------------------------------- */

.shop24-hero {
    padding-top: 150px !important;
    padding-bottom: 115px !important;

    padding-left: 0 !important;
    padding-right: 0 !important;

    min-height: 760px !important;
}


/*
 * Der eigentliche Hero-Inhalt bekommt einen
 * festen, zentrierten Rahmen.
 */

.shop24-hero > div:first-child,
.shop24-hero > .shop24-container {
    width: min(1380px, calc(100% - 120px)) !important;

    margin-left: auto !important;
    margin-right: auto !important;

    padding-left: 0 !important;
    padding-right: 0 !important;
}


/* Falls der Hero einen direkten Textblock enthält */

.shop24-hero .shop24-hero-content {
    width: min(680px, 55%) !important;
    margin-left: 0 !important;
}


/* ---------------------------------------------------------
   HERO TYPOGRAFIE
   --------------------------------------------------------- */

.shop24-hero h1,
.shop24-hero .shop24-hero-title,
.shop24-hero .shop24-title {
    max-width: 720px !important;

    margin-left: 0 !important;
    margin-right: 0 !important;

    font-size: clamp(58px, 6.3vw, 104px) !important;

    line-height: .91 !important;

    letter-spacing: -4px !important;

    overflow-wrap: normal !important;
    word-break: normal !important;
}


/* Text */

.shop24-hero p {
    max-width: 570px !important;

    margin-top: 34px !important;

    font-size: 16px !important;
    line-height: 1.65 !important;
}


/* Button */

.shop24-hero .shop24-button,
.shop24-hero .shop24-text-link,
.shop24-hero a[class*="button"] {
    margin-top: 28px !important;
}


/* ---------------------------------------------------------
   HERO RECHTS – DEKORATION NICHT ÜBER TEXT
   --------------------------------------------------------- */

.shop24-hero::after {
    right: max(
        calc((100vw - 1380px) / 2 - 40px),
        20px
    ) !important;

    top: 130px !important;

    width: min(540px, 38vw) !important;
    height: min(540px, 38vw) !important;
}


/* ---------------------------------------------------------
   SEKTIONEN
   --------------------------------------------------------- */

.shop24-section {
    padding-top: 120px !important;
    padding-bottom: 120px !important;
}


/* ---------------------------------------------------------
   KATEGORIEN
   --------------------------------------------------------- */

.shop24-category-grid,
.shop24-categories,
.shop24-grid {
    width: 100% !important;
}


/* ---------------------------------------------------------
   WOOCOMMERCE-SEITEN
   --------------------------------------------------------- */

body.shop24-site .woocommerce {
    width: min(1380px, calc(100% - 120px)) !important;

    max-width: none !important;

    margin-left: auto !important;
    margin-right: auto !important;

    padding-left: 0 !important;
    padding-right: 0 !important;

    padding-top: 90px !important;
    padding-bottom: 130px !important;
}


/* Shop Überschrift */

body.shop24-site .woocommerce-products-header {
    margin-bottom: 55px !important;
}


/* Produktgrid */

body.shop24-site ul.products {
    width: 100% !important;
}


/* ---------------------------------------------------------
   EINZELPRODUKT
   --------------------------------------------------------- */

body.shop24-site div.product {
    width: 100% !important;
}


/* ---------------------------------------------------------
   WARENKORB / CHECKOUT
   --------------------------------------------------------- */

body.shop24-site .woocommerce-cart-form,
body.shop24-site .cart-collaterals,
body.shop24-site .woocommerce-checkout-review-order,
body.shop24-site .woocommerce-checkout-payment {
    width: 100% !important;
}


/* ---------------------------------------------------------
   FOOTER
   --------------------------------------------------------- */

.shop24-footer-main {
    padding-top: 85px !important;
    padding-bottom: 70px !important;
}

.shop24-footer-bottom {
    padding-top: 22px !important;
    padding-bottom: 22px !important;
}


/* ---------------------------------------------------------
   GROSSE BILDSCHIRME
   --------------------------------------------------------- */

@media (min-width: 1700px) {

    .shop24-header-inner,
    .shop24-container,
    .shop24-section > .shop24-container,
    .shop24-footer-main,
    .shop24-footer-bottom,
    body.shop24-site .woocommerce,
    .shop24-hero > div:first-child,
    .shop24-hero > .shop24-container {
        width: min(1480px, calc(100% - 160px)) !important;
    }

    .shop24-hero h1,
    .shop24-hero .shop24-hero-title,
    .shop24-hero .shop24-title {
        font-size: clamp(72px, 6vw, 112px) !important;
    }

}


/* ---------------------------------------------------------
   TABLET
   --------------------------------------------------------- */

@media (max-width: 1100px) {

    .shop24-header-inner,
    .shop24-container,
    .shop24-section > .shop24-container,
    .shop24-footer-main,
    .shop24-footer-bottom,
    body.shop24-site .woocommerce,
    .shop24-hero > div:first-child,
    .shop24-hero > .shop24-container {
        width: calc(100% - 64px) !important;
    }

    .shop24-hero h1,
    .shop24-hero .shop24-hero-title,
    .shop24-hero .shop24-title {
        font-size: clamp(54px, 7vw, 82px) !important;
        letter-spacing: -3px !important;
    }

}


/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media (max-width: 700px) {

    .shop24-header-inner,
    .shop24-container,
    .shop24-section > .shop24-container,
    .shop24-footer-main,
    .shop24-footer-bottom,
    body.shop24-site .woocommerce,
    .shop24-hero > div:first-child,
    .shop24-hero > .shop24-container {
        width: calc(100% - 36px) !important;
    }

    .shop24-hero {
        min-height: 690px !important;

        padding-top: 125px !important;
        padding-bottom: 80px !important;
    }

    .shop24-hero .shop24-hero-content {
        width: 100% !important;
    }

    .shop24-hero h1,
    .shop24-hero .shop24-hero-title,
    .shop24-hero .shop24-title {
        max-width: 100% !important;

        font-size: clamp(48px, 13vw, 68px) !important;

        line-height: .94 !important;
        letter-spacing: -2.5px !important;
    }

    .shop24-hero p {
        max-width: 100% !important;

        font-size: 14px !important;
    }

    .shop24-hero::after {
        width: 360px !important;
        height: 360px !important;

        right: -130px !important;
        top: 240px !important;
    }

    .shop24-section {
        padding-top: 75px !important;
        padding-bottom: 75px !important;
    }

    body.shop24-site .woocommerce {
        padding-top: 55px !important;
        padding-bottom: 80px !important;
    }

}



/* =========================================================
   24ST – FEINABSTIMMUNG
   Links ausgerichtet, aber mit sauberem Seitenabstand
   ========================================================= */

.shop24-header-inner,
.shop24-container,
.shop24-footer-main,
.shop24-footer-bottom,
body.shop24-site .woocommerce,
.shop24-hero > div:first-child,
.shop24-hero > .shop24-container {
    width: min(1280px, calc(100% - 96px)) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}


/* Hero-Inhalt bewusst links halten */

.shop24-hero > div:first-child,
.shop24-hero > .shop24-container {
    display: block !important;
}

.shop24-hero .shop24-hero-content {
    width: min(600px, 52%) !important;
    margin-left: 0 !important;
    margin-right: auto !important;
}


/* Überschrift kleiner und kontrollierter */

.shop24-hero h1,
.shop24-hero .shop24-hero-title,
.shop24-hero .shop24-title {
    max-width: 650px !important;

    font-size: clamp(52px, 5.2vw, 82px) !important;
    line-height: .94 !important;
    letter-spacing: -3px !important;
}


/* Beschreibung */

.shop24-hero p {
    max-width: 500px !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
}


/* Hero etwas kompakter */

.shop24-hero {
    min-height: 700px !important;
    padding-top: 125px !important;
    padding-bottom: 90px !important;
}


/* Rechte Dekoration etwas kleiner */

.shop24-hero::after {
    width: min(470px, 34vw) !important;
    height: min(470px, 34vw) !important;
}


/* Allgemeine Überschriften etwas kompakter */

body.shop24-site .woocommerce-products-header__title,
body.shop24-site .woocommerce-products-header h1,
body.shop24-site .page-title,
body.shop24-site .entry-title {
    font-size: clamp(38px, 4vw, 60px) !important;
    letter-spacing: -2px !important;
}


/* Desktop */

@media (min-width: 1101px) {

    .shop24-header-inner,
    .shop24-container,
    .shop24-footer-main,
    .shop24-footer-bottom,
    body.shop24-site .woocommerce,
    .shop24-hero > div:first-child,
    .shop24-hero > .shop24-container {
        width: min(1280px, calc(100% - 96px)) !important;
    }

}


/* Tablet */

@media (max-width: 1100px) {

    .shop24-header-inner,
    .shop24-container,
    .shop24-footer-main,
    .shop24-footer-bottom,
    body.shop24-site .woocommerce,
    .shop24-hero > div:first-child,
    .shop24-hero > .shop24-container {
        width: calc(100% - 64px) !important;
    }

}


/* Mobil */

@media (max-width: 700px) {

    .shop24-header-inner,
    .shop24-container,
    .shop24-footer-main,
    .shop24-footer-bottom,
    body.shop24-site .woocommerce,
    .shop24-hero > div:first-child,
    .shop24-hero > .shop24-container {
        width: calc(100% - 36px) !important;
    }

    .shop24-hero .shop24-hero-content {
        width: 100% !important;
    }

    .shop24-hero h1,
    .shop24-hero .shop24-hero-title,
    .shop24-hero .shop24-title {
        font-size: clamp(44px, 12vw, 64px) !important;
        letter-spacing: -2px !important;
    }

}


/* =========================================================
   24ST HERO – LINKSBÜNDIG UND KOMPAKT
   ========================================================= */

.shop24-hero {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
}

/* Der Hero-Inhalt sitzt bewusst links innerhalb des Rahmens */
.shop24-hero > div:first-child,
.shop24-hero > .shop24-container {
    width: min(1280px, calc(100% - 96px)) !important;

    margin-left: auto !important;
    margin-right: auto !important;

    text-align: left !important;
}

/* Inhalt selbst links halten */
.shop24-hero .shop24-hero-content {
    width: 540px !important;
    max-width: 48% !important;

    margin-left: 0 !important;
    margin-right: auto !important;

    text-align: left !important;
}


/* Überschrift kleiner */
.shop24-hero h1,
.shop24-hero .shop24-hero-title,
.shop24-hero .shop24-title {
    max-width: 600px !important;

    font-size: clamp(50px, 4.8vw, 76px) !important;
    line-height: .95 !important;

    letter-spacing: -2.8px !important;

    margin-left: 0 !important;
    margin-right: 0 !important;
}


/* Beschreibung kompakter */
.shop24-hero p {
    max-width: 500px !important;

    margin-left: 0 !important;
    margin-right: 0 !important;

    font-size: 14px !important;
    line-height: 1.6 !important;
}


/* Button */
.shop24-hero .shop24-button,
.shop24-hero .shop24-text-link,
.shop24-hero a[class*="button"] {
    margin-left: 0 !important;
}


/* Rechte Gestaltung weiter nach rechts */
.shop24-hero::after {
    right: max(
        calc((100vw - 1280px) / 2 - 40px),
        20px
    ) !important;
}


/* =========================================================
   DESKTOP
   ========================================================= */

@media (min-width: 1101px) {

    .shop24-hero > div:first-child,
    .shop24-hero > .shop24-container {
        width: min(1280px, calc(100% - 96px)) !important;
    }

}


/* =========================================================
   GROSSE MONITORE
   ========================================================= */

@media (min-width: 1600px) {

    .shop24-hero > div:first-child,
    .shop24-hero > .shop24-container {
        width: min(1280px, calc(100% - 140px)) !important;
    }

    .shop24-hero .shop24-hero-content {
        width: 560px !important;
    }

}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1100px) {

    .shop24-hero > div:first-child,
    .shop24-hero > .shop24-container {
        width: calc(100% - 64px) !important;
    }

    .shop24-hero .shop24-hero-content {
        width: 55% !important;
        max-width: 55% !important;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

    .shop24-hero > div:first-child,
    .shop24-hero > .shop24-container {
        width: calc(100% - 36px) !important;
    }

    .shop24-hero .shop24-hero-content {
        width: 100% !important;
        max-width: 100% !important;
    }

    .shop24-hero h1,
    .shop24-hero .shop24-hero-title,
    .shop24-hero .shop24-title {
        font-size: clamp(44px, 12vw, 64px) !important;
        letter-spacing: -2px !important;
    }

}


/* =========================================================
   24ST HERO – FINAL POSITION
   Tatsächlicher Hero-Inhalt
   ========================================================= */

.shop24-hero {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    overflow: hidden !important;
}


/* DER TATSÄCHLICHE INHALT */

.shop24-hero .shop24-hero-content {
    position: relative !important;
    z-index: 10 !important;

    width: min(600px, 42vw) !important;
    max-width: 600px !important;

    margin-left: max(
        48px,
        calc((100vw - 1280px) / 2)
    ) !important;

    margin-right: 0 !important;

    text-align: left !important;
}


/* Eyebrow */

.shop24-hero .shop24-eyebrow {
    display: block !important;

    margin-bottom: 22px !important;

    color: rgba(255,255,255,.68) !important;

    font-size: 10px !important;
    font-weight: 700 !important;
    letter-spacing: 2px !important;
}


/* HAUPTÜBERSCHRIFT */

.shop24-hero .shop24-hero-content h1 {
    margin: 0 !important;

    max-width: 620px !important;

    color: #fff !important;

    font-size: clamp(52px, 4.7vw, 78px) !important;
    line-height: .94 !important;

    letter-spacing: -3px !important;

    text-align: left !important;
}


/* Kursiver zweiter Teil */

.shop24-hero .shop24-hero-content h1 em {
    color: rgba(255,255,255,.64) !important;
}


/* Beschreibung */

.shop24-hero .shop24-hero-content p {
    max-width: 500px !important;

    margin: 30px 0 0 !important;

    color: rgba(255,255,255,.72) !important;

    font-size: 14px !important;
    line-height: 1.65 !important;

    text-align: left !important;
}


/* BUTTON */

.shop24-hero .shop24-hero-content .shop24-button {
    display: inline-flex !important;
    align-items: center !important;
    gap: 20px !important;

    margin-top: 30px !important;

    padding: 16px 22px !important;

    background: #fff !important;
    color: #111820 !important;

    text-decoration: none !important;

    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: .5px !important;

    border-radius: 2px !important;
}


/* RECHTE DEKORATION */

.shop24-hero .shop24-hero-orbit {
    pointer-events: none !important;
}


/* =========================================================
   GROSSE BILDSCHIRME
   ========================================================= */

@media (min-width: 1600px) {

    .shop24-hero .shop24-hero-content {
        margin-left: max(
            60px,
            calc((100vw - 1280px) / 2)
        ) !important;
    }

}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1100px) {

    .shop24-hero .shop24-hero-content {
        width: 52% !important;
        max-width: 560px !important;

        margin-left: 48px !important;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

    .shop24-hero .shop24-hero-content {
        width: calc(100% - 36px) !important;
        max-width: none !important;

        margin-left: 18px !important;
        margin-right: 18px !important;
    }

    .shop24-hero .shop24-hero-content h1 {
        font-size: clamp(44px, 12vw, 64px) !important;
        line-height: .95 !important;
        letter-spacing: -2px !important;
    }

    .shop24-hero .shop24-hero-content p {
        font-size: 14px !important;
    }

}


/* HERO – weiter links positionieren */
.shop24-hero .shop24-hero-content {
    margin-left: 90px !important;
    margin-right: 0 !important;
    width: 560px !important;
    max-width: 560px !important;
}

/* Große Bildschirme */
@media (min-width: 1600px) {
    .shop24-hero .shop24-hero-content {
        margin-left: 110px !important;
    }
}

/* Tablet */
@media (max-width: 1100px) {
    .shop24-hero .shop24-hero-content {
        margin-left: 55px !important;
        width: 52% !important;
        max-width: 560px !important;
    }
}

/* Handy */
@media (max-width: 700px) {
    .shop24-hero .shop24-hero-content {
        margin-left: 24px !important;
        margin-right: 24px !important;
        width: calc(100% - 48px) !important;
        max-width: none !important;
    }
}


/* =========================================================
   24ST HERO – DESKTOP FINAL POSITION
   ========================================================= */

.shop24-hero {
    display: block !important;
    position: relative !important;
}

.shop24-hero .shop24-hero-content {
    position: absolute !important;
    z-index: 20 !important;

    left: clamp(120px, 15vw, 280px) !important;
    top: 50% !important;

    transform: translateY(-50%) !important;

    width: 560px !important;
    max-width: 560px !important;

    margin: 0 !important;

    text-align: left !important;
}


/* Überschrift kompakter */

.shop24-hero .shop24-hero-content h1 {
    font-size: clamp(52px, 4.2vw, 72px) !important;
    line-height: .94 !important;
    letter-spacing: -2.5px !important;

    max-width: 560px !important;
}


/* Beschreibung */

.shop24-hero .shop24-hero-content p {
    max-width: 520px !important;
}


/* =========================================================
   SEHR GROSSE BILDSCHIRME
   ========================================================= */

@media (min-width: 1800px) {

    .shop24-hero .shop24-hero-content {
        left: 14vw !important;
    }

}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1100px) {

    .shop24-hero .shop24-hero-content {
        left: 60px !important;
        width: 520px !important;
        max-width: calc(100% - 120px) !important;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

    .shop24-hero .shop24-hero-content {
        position: absolute !important;

        left: 24px !important;
        right: 24px !important;

        width: auto !important;
        max-width: none !important;

        top: 50% !important;
        transform: translateY(-50%) !important;
    }

    .shop24-hero .shop24-hero-content h1 {
        font-size: clamp(42px, 12vw, 60px) !important;
        letter-spacing: -2px !important;
    }

}


/* =========================================================
   24ST – HOMEPAGE SECTIONS
   Premium Light Sections
   ========================================================= */


/* ---------------------------------------------------------
   ALLGEMEIN
   --------------------------------------------------------- */

.shop24-section {
    position: relative;
    width: min(1280px, calc(100% - 80px));
    margin: 0 auto;
    padding: 110px 0;
}

.shop24-home {
    background: #f5f6f7;
    color: #111820;
}


/* ---------------------------------------------------------
   INTRO
   --------------------------------------------------------- */

.shop24-intro {
    padding-top: 125px;
    padding-bottom: 85px;
    background: #f5f6f7;
}

.shop24-intro-inner {
    max-width: 760px;
}

.shop24-intro .shop24-eyebrow,
.shop24-section-heading .shop24-eyebrow {
    display: block;
    margin-bottom: 18px;

    font-size: 10px;
    font-weight: 800;
    letter-spacing: 2px;

    color: #69737c;
}

.shop24-intro h2 {
    margin: 0 0 22px;

    font-size: clamp(38px, 4vw, 60px);
    line-height: 1;
    letter-spacing: -2px;

    color: #111820;
}

.shop24-intro p {
    max-width: 620px;

    margin: 0;

    color: #68727b;

    font-size: 17px;
    line-height: 1.7;
}


/* ---------------------------------------------------------
   KATEGORIEN
   --------------------------------------------------------- */

.shop24-categories {
    padding-top: 20px;
    padding-bottom: 120px;

    background: #f5f6f7;
}

.shop24-category-grid {
    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 14px;
}

.shop24-category-card {
    position: relative;

    min-height: 250px;

    padding: 30px;

    display: flex;
    flex-direction: column;
    justify-content: space-between;

    background: #ffffff;

    border: 1px solid rgba(17,24,32,.08);

    color: #111820;

    text-decoration: none;

    overflow: hidden;

    transition:
        transform .35s ease,
        box-shadow .35s ease,
        background .35s ease,
        color .35s ease;
}

.shop24-category-card:hover {
    transform: translateY(-6px);

    background: #111820;

    color: #ffffff;

    box-shadow: 0 20px 50px rgba(17,24,32,.14);
}

.shop24-category-number {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1px;

    color: #9aa2a9;

    transition: color .3s ease;
}

.shop24-category-card:hover .shop24-category-number {
    color: rgba(255,255,255,.55);
}

.shop24-category-name {
    font-size: 27px;
    font-weight: 700;
    letter-spacing: -1px;
}

.shop24-category-arrow {
    position: absolute;

    right: 28px;
    bottom: 24px;

    font-size: 24px;

    transition:
        transform .3s ease,
        color .3s ease;
}

.shop24-category-card:hover .shop24-category-arrow {
    transform: translate(4px,-4px);
}


/* ---------------------------------------------------------
   PRODUKTE
   --------------------------------------------------------- */

.shop24-products {
    background: #ffffff;
}

.shop24-section-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    margin-bottom: 45px;
}

.shop24-section-heading h2 {
    margin: 0;

    font-size: clamp(38px, 4vw, 58px);
    line-height: 1;
    letter-spacing: -2px;

    color: #111820;
}

.shop24-text-link {
    display: inline-flex;
    align-items: center;
    gap: 12px;

    padding-bottom: 5px;

    border-bottom: 1px solid #111820;

    color: #111820;

    font-size: 12px;
    font-weight: 800;
    letter-spacing: .5px;

    text-decoration: none;

    transition: gap .25s ease;
}

.shop24-text-link:hover {
    gap: 18px;
}


/* Produktgrid */

.shop24-product-grid {
    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 18px;
}

.shop24-product-card {
    background: #f5f6f7;

    overflow: hidden;

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}

.shop24-product-card:hover {
    transform: translateY(-5px);

    box-shadow: 0 18px 45px rgba(17,24,32,.10);
}

.shop24-product-card a {
    display: block;

    color: inherit;

    text-decoration: none;
}

.shop24-product-image {
    aspect-ratio: 1 / 1;

    display: flex;
    align-items: center;
    justify-content: center;

    overflow: hidden;

    background: #e9ecef;
}

.shop24-product-image img {
    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform .6s ease;
}

.shop24-product-card:hover .shop24-product-image img {
    transform: scale(1.045);
}


/* ---------------------------------------------------------
   EDITORIAL
   --------------------------------------------------------- */

.shop24-editorial {
    background: #111820;
    color: #ffffff;
}

.shop24-editorial-inner {
    display: grid;

    grid-template-columns: 1.1fr .9fr;

    gap: 100px;

    align-items: center;
}

.shop24-editorial h2 {
    margin: 0;

    max-width: 760px;

    font-size: clamp(42px, 5vw, 76px);
    line-height: .95;
    letter-spacing: -3px;

    color: #ffffff;
}

.shop24-editorial p {
    margin: 25px 0 0;

    max-width: 470px;

    color: rgba(255,255,255,.65);

    font-size: 16px;
    line-height: 1.7;
}


/* ---------------------------------------------------------
   CTA
   --------------------------------------------------------- */

.shop24-cta {
    background: #f5f6f7;

    text-align: center;
}

.shop24-cta-inner {
    max-width: 800px;
    margin: 0 auto;
}

.shop24-cta h2 {
    margin: 0;

    font-size: clamp(42px, 5vw, 72px);
    line-height: .95;
    letter-spacing: -3px;

    color: #111820;
}

.shop24-cta p {
    max-width: 560px;

    margin: 25px auto 0;

    color: #68727b;

    line-height: 1.7;
}


/* ---------------------------------------------------------
   FOOTER
   --------------------------------------------------------- */

.shop24-footer {
    background: #0d1318;
    color: #ffffff;
}

.shop24-footer a {
    color: rgba(255,255,255,.68);

    transition: color .25s ease;
}

.shop24-footer a:hover {
    color: #ffffff;
}


/* ---------------------------------------------------------
   REVEAL ANIMATION
   --------------------------------------------------------- */

.shop24-reveal {
    opacity: 1;
    transform: translateY(0);
}

.js .shop24-reveal {
    opacity: 0;
    transform: translateY(25px);

    transition:
        opacity .7s ease,
        transform .7s cubic-bezier(.2,.7,.2,1);
}

.js .shop24-reveal.shop24-visible {
    opacity: 1;
    transform: translateY(0);
}


/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 1000px) {

    .shop24-section {
        width: min(100% - 48px, 760px);
        padding: 85px 0;
    }

    .shop24-category-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .shop24-product-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .shop24-editorial-inner {
        grid-template-columns: 1fr;

        gap: 40px;
    }

}


@media (max-width: 700px) {

    .shop24-section {
        width: calc(100% - 36px);
        padding: 70px 0;
    }

    .shop24-intro {
        padding-top: 80px;
    }

    .shop24-category-grid,
    .shop24-product-grid {
        grid-template-columns: 1fr;
    }

    .shop24-category-card {
        min-height: 190px;
    }

    .shop24-section-heading {
        display: block;
    }

    .shop24-section-heading .shop24-text-link {
        margin-top: 25px;
    }

    .shop24-editorial h2,
    .shop24-cta h2 {
        letter-spacing: -2px;
    }

}

/* =========================================================
   24ST – HERO ZURÜCK AUF FUNKTIONIERENDEN ZUSTAND
   ========================================================= */

.shop24-hero {
    color: #ffffff !important;
}


/* Hintergrund */

.shop24-vintage .shop24-hero-bg,
.shop24-elektro .shop24-hero-bg,
.shop24-geschenk .shop24-hero-bg {
    background:
        radial-gradient(
            circle at 75% 30%,
            rgba(76,182,255,.14),
            transparent 30%
        ),
        radial-gradient(
            circle at 20% 80%,
            rgba(0,220,255,.06),
            transparent 35%
        ),
        linear-gradient(
            125deg,
            #0a1419 0%,
            #132630 50%,
            #0b1115 100%
        ) !important;
}


/* Hero-Schrift */

.shop24-hero .shop24-eyebrow {
    color: rgba(255,255,255,.72) !important;
}

.shop24-hero .shop24-hero-content h1,
.shop24-hero .shop24-hero-content h1 em {
    color: #ffffff !important;
}

.shop24-hero .shop24-hero-content h1 em {
    opacity: .72 !important;
}

.shop24-hero .shop24-hero-content p {
    color: rgba(255,255,255,.82) !important;
}


/* Button */

.shop24-hero .shop24-button {
    background: #ffffff !important;
    color: #111111 !important;
    border-color: #ffffff !important;
}


/* Header */

.shop24-header,
.shop24-header a,
.shop24-logo,
.shop24-nav .shop24-menu > li > a {
    color: #ffffff !important;
}


/* =========================================================
   24ST – MENÜ DROPDOWN
   Dropdown bleibt beim Wegfahren vom Hauptpunkt offen
   ========================================================= */

.shop24-menu > li {
    position: relative !important;
}

/* Unsichtbare Brücke zwischen Hauptmenü und Dropdown */
.shop24-menu > li.has-children::after,
.shop24-menu > li.menu-item-has-children::after {
    content: "";

    position: absolute;

    left: 0;
    top: 100%;

    width: 100%;
    height: 14px;

    background: transparent;

    z-index: 99998;

    display: block;
}

/* Dropdown */
.shop24-menu > li > .sub-menu {
    position: absolute !important;

    top: calc(100% + 8px) !important;
    left: 0 !important;

    min-width: 220px !important;

    margin: 0 !important;
    padding: 10px 0 !important;

    background: #ffffff !important;

    z-index: 99999 !important;

    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;

    box-shadow: 0 18px 45px rgba(0,0,0,.22) !important;

    transition:
        opacity .15s ease,
        visibility .15s ease !important;
}

/* Hauptpunkt + unsichtbare Brücke + Dropdown */
.shop24-menu > li:hover > .sub-menu,
.shop24-menu > li:focus-within > .sub-menu {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

/* Untermenü selbst */
.shop24-menu .sub-menu li {
    position: relative !important;
}

.shop24-menu .sub-menu a {
    display: block !important;

    padding: 11px 18px !important;

    background: #ffffff !important;

    color: #111111 !important;

    white-space: nowrap !important;

    text-decoration: none !important;
}

.shop24-menu .sub-menu a:hover {
    background: #ff5a00 !important;
    color: #ffffff !important;
}


/* =========================================================
   24ST – ORANGE AKZENTE
   Blau bleibt Hintergrundfarbe.
   Akzente werden Orange.
   ========================================================= */

:root {
    --shop24-orange: #ff5a00;
}


/* Navigation Hover */

.shop24-menu > li > a:hover,
.shop24-menu > li.current-menu-item > a,
.shop24-menu > li.current-menu-ancestor > a {
    color: #ff5a00 !important;
}


/* Such- und Warenkorb-Akzente */

.shop24-action:hover,
.shop24-cart:hover {
    border-color: #ff5a00 !important;
    color: #ff5a00 !important;
}


/* Warenkorb Anzahl */

.shop24-cart-count {
    background: #ff5a00 !important;
    color: #ffffff !important;
}


/* Orange statt blauer Fokus-/Hover-Akzente */

.shop24-button:hover {
    border-color: #ff5a00 !important;
}

.shop24-text-link:hover {
    color: #ff5a00 !important;
    border-color: #ff5a00 !important;
}


/* Kategorie-Akzente */

.shop24-category-arrow {
    color: #ff5a00 !important;
}

.shop24-category-card:hover .shop24-category-arrow {
    color: #111111 !important;
}


/* Eyebrow / kleine Akzenttexte */

.shop24-intro .shop24-eyebrow,
.shop24-section-heading .shop24-eyebrow,
.shop24-editorial .shop24-eyebrow,
.shop24-cta .shop24-eyebrow {
    color: #ff5a00 !important;
}


/* Buttons */

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
button,
input[type="submit"] {
    background: #ff5a00 !important;
    border-color: #ff5a00 !important;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
button:hover,
input[type="submit"]:hover {
    background: #e94d00 !important;
    border-color: #e94d00 !important;
}


/* Links auf WooCommerce-Seiten */

.woocommerce a:not(.button):hover {
    color: #ff5a00 !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

    .shop24-menu > li::after {
        display: none !important;
    }

    .shop24-menu > li > .sub-menu {
        position: static !important;

        width: 100% !important;
        min-width: 0 !important;

        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;

        box-shadow: none !important;
    }

}

/* 24ST – HERO KREISE KOMPLETT AUSBLENDEN */
.shop24-hero .shop24-hero-orbit {
    display: none !important;
}

/* =========================================================
   24ST – NEU ENTDECKT / PRODUKTBEREICH PREMIUM
   Für alle 3 Shops
   ========================================================= */

.shop24-products {
    position: relative;
    padding: 110px 6vw 125px !important;
    background: #f5f5f3 !important;
    overflow: hidden;
}

.shop24-products::before {
    content: "";
    position: absolute;
    top: 0;
    left: 6vw;
    width: 70px;
    height: 3px;
    background: #ff5a00;
}

.shop24-products .shop24-section-heading {
    position: relative;
    z-index: 2;
    max-width: 1250px;
    margin: 0 auto 55px !important;
}

.shop24-products .shop24-eyebrow {
    display: inline-block;
    margin-bottom: 14px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: #ff5a00 !important;
}

.shop24-products .shop24-section-heading h2 {
    margin: 0 !important;
    font-size: clamp(42px, 5vw, 78px) !important;
    line-height: .95 !important;
    letter-spacing: -.045em !important;
    font-weight: 600 !important;
    color: #111 !important;
}

.shop24-products .shop24-section-heading p {
    max-width: 560px;
    margin: 22px 0 0 !important;
    font-size: 17px;
    line-height: 1.7;
    color: #666;
}

/* Produktkarten */
.shop24-products .products {
    position: relative;
    z-index: 2;
    max-width: 1250px;
    margin: 0 auto !important;
}

.shop24-products .product {
    background: #fff;
    border: 0 !important;
    box-shadow: 0 12px 40px rgba(0,0,0,.06);
    transition:
        transform .35s ease,
        box-shadow .35s ease;
}

.shop24-products .product:hover {
    transform: translateY(-8px);
    box-shadow: 0 24px 55px rgba(0,0,0,.12);
}

.shop24-products .product img {
    transition: transform .6s cubic-bezier(.2,.7,.2,1);
}

.shop24-products .product:hover img {
    transform: scale(1.04);
}

.shop24-products .woocommerce-loop-product__title {
    padding: 20px 20px 4px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #111 !important;
}

.shop24-products .price {
    padding: 0 20px 20px;
    font-size: 15px !important;
    color: #555 !important;
}

.shop24-products .button {
    margin: 0 20px 22px !important;
    width: calc(100% - 40px);
}

/* Unterschiedliche hochwertige Akzentstimmung je Shop */
.shop24-vintage .shop24-products::before {
    background: #ff5a00;
}

.shop24-elektro .shop24-products::before {
    background: #ff5a00;
}

.shop24-geschenk .shop24-products::before {
    background: #ff5a00;
}

/* Mobile */
@media (max-width: 700px) {

    .shop24-products {
        padding: 75px 24px 85px !important;
    }

    .shop24-products::before {
        left: 24px;
    }

    .shop24-products .shop24-section-heading {
        margin-bottom: 35px !important;
    }

    .shop24-products .shop24-section-heading h2 {
        font-size: 42px !important;
    }

}


/* =========================================================
   24ST – HERO: SCHLICHTES ORANGE
   ========================================================= */

.shop24-hero .shop24-hero-bg {
    background: #b83f00 !important;
}

/* Alle bisherigen Kreis-/Orbit-Elemente entfernen */
.shop24-hero .shop24-hero-orbit {
    display: none !important;
}

/* Keine zusätzlichen Kreis-/Glow-Effekte */
.shop24-hero::before,
.shop24-hero::after,
.shop24-hero .shop24-hero-bg::before,
.shop24-hero .shop24-hero-bg::after {
    display: none !important;
    content: none !important;
}


/* 24ST – HERO FINAL: SCHLICHTES DUNKELORANGE */
.shop24-hero,
.shop24-hero .shop24-hero-bg {
    background: #b84a0b !important;
    background-image: none !important;
}

.shop24-hero .shop24-hero-orbit,
.shop24-hero::before,
.shop24-hero::after,
.shop24-hero .shop24-hero-bg::before,
.shop24-hero .shop24-hero-bg::after {
    display: none !important;
    background: none !important;
    border: 0 !important;
    box-shadow: none !important;
    content: none !important;
}


/* 24ST VINTAGE – HERO HINTERGRUND ERZWINGEN */
.shop24-vintage .shop24-hero,
.shop24-vintage .shop24-hero .shop24-hero-bg {
    background: #b84a0b !important;
    background-image: none !important;
}

.shop24-vintage .shop24-hero .shop24-hero-orbit {
    display: none !important;
}

/* =========================================================
   24ST – EDITORIAL + CTA + FOOTER PREMIUM
   Für alle 3 Shops
   ========================================================= */

/* ---------------------------------------------------------
   AUSGEWÄHLT. ANDERS.
   --------------------------------------------------------- */

.shop24-editorial {
    position: relative;
    min-height: 430px;
    padding: 105px 7vw !important;
    background: #151515 !important;
    color: #fff !important;
    overflow: hidden;
}

.shop24-editorial::before {
    content: "";
    position: absolute;
    top: 0;
    left: 7vw;
    width: 70px;
    height: 3px;
    background: #ff5a00;
}

.shop24-editorial::after {
    content: "24";
    position: absolute;
    right: 4vw;
    bottom: -100px;
    font-size: clamp(300px, 35vw, 620px);
    line-height: .8;
    font-weight: 700;
    letter-spacing: -.08em;
    color: rgba(255,255,255,.035);
    pointer-events: none;
}

.shop24-editorial > * {
    position: relative;
    z-index: 2;
}

.shop24-editorial .shop24-eyebrow {
    display: block;
    margin-bottom: 18px;
    color: #ff5a00 !important;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .24em;
    text-transform: uppercase;
}

.shop24-editorial h2 {
    max-width: 720px;
    margin: 0 !important;
    font-size: clamp(48px, 6vw, 86px) !important;
    line-height: .94 !important;
    letter-spacing: -.05em !important;
    font-weight: 500 !important;
    color: #fff !important;
}

.shop24-editorial p {
    max-width: 530px;
    margin: 28px 0 30px !important;
    color: rgba(255,255,255,.65) !important;
    font-size: 16px;
    line-height: 1.7;
}

.shop24-editorial .shop24-button {
    display: inline-flex;
    align-items: center;
    gap: 18px;
    min-height: 48px;
    padding: 0 24px;
    background: #ff5a00 !important;
    border: 1px solid #ff5a00 !important;
    color: #fff !important;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    text-decoration: none;
    transition: transform .25s ease, background .25s ease;
}

.shop24-editorial .shop24-button:hover {
    background: #e94d00 !important;
    border-color: #e94d00 !important;
    color: #fff !important;
    transform: translateY(-2px);
}


/* ---------------------------------------------------------
   CTA – BEREIT?
   --------------------------------------------------------- */

.shop24-cta {
    position: relative;
    padding: 125px 24px 130px !important;
    background: #f3f3f1 !important;
    text-align: center;
    overflow: hidden;
}

.shop24-cta::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 0;
    width: 90px;
    height: 3px;
    background: #ff5a00;
    transform: translateX(-50%);
}

.shop24-cta .shop24-eyebrow {
    display: block;
    margin-bottom: 18px;
    color: #ff5a00 !important;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .25em;
    text-transform: uppercase;
}

.shop24-cta h2 {
    max-width: 850px;
    margin: 0 auto !important;
    font-size: clamp(42px, 5vw, 72px) !important;
    line-height: .98 !important;
    letter-spacing: -.045em !important;
    font-weight: 500 !important;
    color: #171717 !important;
}

.shop24-cta p {
    max-width: 540px;
    margin: 24px auto 32px !important;
    color: #666 !important;
    line-height: 1.7;
}

.shop24-cta .shop24-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 0 28px;
    background: #ff5a00 !important;
    border: 1px solid #ff5a00 !important;
    color: #fff !important;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    text-decoration: none;
    transition: .25s ease;
}

.shop24-cta .shop24-button:hover {
    background: #e94d00 !important;
    border-color: #e94d00 !important;
    transform: translateY(-2px);
}


/* ---------------------------------------------------------
   FOOTER – 24ST ORANGE
   --------------------------------------------------------- */

.shop24-footer {
    position: relative;
    background: #b84a0b !important;
    color: #fff !important;
    border: 0 !important;
}

.shop24-footer::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: rgba(255,255,255,.18);
}

.shop24-footer-main {
    padding: 75px 7vw 60px !important;
    background: #b84a0b !important;
}

.shop24-footer-brand {
    color: #fff !important;
}

.shop24-footer-brand strong,
.shop24-footer-brand span {
    color: #fff !important;
}

.shop24-footer a {
    color: rgba(255,255,255,.82) !important;
    text-decoration: none;
    transition: color .2s ease;
}

.shop24-footer a:hover {
    color: #fff !important;
}

.shop24-footer h3,
.shop24-footer h4,
.shop24-footer .shop24-footer-title {
    color: #fff !important;
}

.shop24-footer .shop24-footer-label {
    color: rgba(255,255,255,.55) !important;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .2em;
    text-transform: uppercase;
}

.shop24-footer-bottom {
    padding: 18px 7vw !important;
    background: rgba(0,0,0,.12) !important;
    border-top: 1px solid rgba(255,255,255,.14) !important;
    color: rgba(255,255,255,.6) !important;
}

.shop24-footer-bottom a {
    color: rgba(255,255,255,.65) !important;
}


/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media (max-width: 700px) {

    .shop24-editorial {
        min-height: 420px;
        padding: 75px 24px !important;
    }

    .shop24-editorial::before {
        left: 24px;
    }

    .shop24-editorial h2 {
        font-size: 48px !important;
    }

    .shop24-editorial::after {
        right: -80px;
        font-size: 300px;
    }

    .shop24-cta {
        padding: 85px 24px 90px !important;
    }

    .shop24-cta h2 {
        font-size: 43px !important;
    }

    .shop24-footer-main {
        padding: 55px 24px 45px !important;
    }

    .shop24-footer-bottom {
        padding: 18px 24px !important;
    }

}


/* =========================================================
   24ST – FINAL DESIGN FÜR UNTEREN HOMEPAGE-BEREICH
   ========================================================= */

/* AUSGEWÄHLT. ANDERS. */
body.shop24-site .shop24-editorial {
    width: 100% !important;
    min-height: 520px !important;
    box-sizing: border-box !important;
    padding: 120px 8vw !important;
    background: #151515 !important;
    color: #fff !important;
    position: relative !important;
    overflow: hidden !important;
}

body.shop24-site .shop24-editorial::before {
    content: "" !important;
    position: absolute !important;
    left: 8vw !important;
    top: 0 !important;
    width: 80px !important;
    height: 4px !important;
    background: #ff5a00 !important;
}

body.shop24-site .shop24-editorial::after {
    content: "24" !important;
    position: absolute !important;
    right: 3vw !important;
    bottom: -100px !important;
    font-size: 600px !important;
    line-height: .8 !important;
    font-weight: 700 !important;
    color: rgba(255,255,255,.035) !important;
    pointer-events: none !important;
}

body.shop24-site .shop24-editorial h2 {
    position: relative !important;
    z-index: 5 !important;
    max-width: 800px !important;
    margin: 0 !important;
    color: #fff !important;
    font-size: clamp(52px, 6vw, 90px) !important;
    line-height: .92 !important;
    letter-spacing: -.05em !important;
}

body.shop24-site .shop24-editorial .shop24-eyebrow {
    position: relative !important;
    z-index: 5 !important;
    color: #ff5a00 !important;
}

body.shop24-site .shop24-editorial p {
    position: relative !important;
    z-index: 5 !important;
    max-width: 550px !important;
    color: rgba(255,255,255,.7) !important;
}


/* CTA */
body.shop24-site .shop24-cta {
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 130px 24px !important;
    background: #f4f4f2 !important;
    text-align: center !important;
    position: relative !important;
}

body.shop24-site .shop24-cta::before {
    content: "" !important;
    display: block !important;
    width: 90px !important;
    height: 4px !important;
    margin: 0 auto 35px !important;
    background: #ff5a00 !important;
}

body.shop24-site .shop24-cta .shop24-eyebrow {
    color: #ff5a00 !important;
}

body.shop24-site .shop24-cta h2 {
    color: #171717 !important;
    font-size: clamp(44px, 5vw, 76px) !important;
    line-height: .95 !important;
    letter-spacing: -.05em !important;
    margin: 0 auto !important;
    max-width: 900px !important;
}

body.shop24-site .shop24-cta p {
    color: #666 !important;
    max-width: 550px !important;
    margin: 25px auto 35px !important;
}


/* =========================================================
   FOOTER ORANGE
   ========================================================= */

body.shop24-site .shop24-footer {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #b84a0b !important;
    color: #fff !important;
}

body.shop24-site .shop24-footer-main {
    display: grid !important;
    grid-template-columns: 2fr 1fr 1fr 1fr !important;
    gap: 60px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 75px 8vw !important;
    background: #b84a0b !important;
}

body.shop24-site .shop24-footer-logo {
    color: #fff !important;
    font-size: 34px !important;
    font-weight: 800 !important;
    letter-spacing: -.05em !important;
}

body.shop24-site .shop24-footer-main p {
    color: rgba(255,255,255,.7) !important;
}

body.shop24-site .shop24-footer-main h3 {
    margin: 0 0 18px !important;
    color: #fff !important;
    font-size: 11px !important;
    letter-spacing: .18em !important;
    text-transform: uppercase !important;
}

body.shop24-site .shop24-footer-main a {
    display: block !important;
    margin: 0 0 10px !important;
    color: rgba(255,255,255,.75) !important;
    text-decoration: none !important;
}

body.shop24-site .shop24-footer-main a:hover {
    color: #fff !important;
}

body.shop24-site .shop24-footer-bottom {
    display: flex !important;
    justify-content: space-between !important;
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 18px 8vw !important;
    background: rgba(0,0,0,.14) !important;
    border-top: 1px solid rgba(255,255,255,.15) !important;
    color: rgba(255,255,255,.6) !important;
}


/* MOBILE */
@media (max-width: 700px) {

    body.shop24-site .shop24-editorial {
        min-height: 450px !important;
        padding: 80px 24px !important;
    }

    body.shop24-site .shop24-editorial h2 {
        font-size: 50px !important;
    }

    body.shop24-site .shop24-editorial::after {
        font-size: 300px !important;
    }

    body.shop24-site .shop24-cta {
        padding: 85px 24px !important;
    }

    body.shop24-site .shop24-cta h2 {
        font-size: 44px !important;
    }

    body.shop24-site .shop24-footer-main {
        grid-template-columns: 1fr 1fr !important;
        gap: 35px !important;
        padding: 55px 24px !important;
    }

    body.shop24-site .shop24-footer-bottom {
        padding: 18px 24px !important;
    }
}


/* =========================================================
   24ST ZENTRALE LANDINGPAGE
========================================================= */

body.shop24-central{
    margin:0!important;
    background:#080d14!important;
    color:#fff;
    font-family:Arial,Helvetica,sans-serif
}

.shop24-central *,
.shop24-central *::before,
.shop24-central *::after{
    box-sizing:border-box
}

.central-header{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    z-index:1000;
    border-bottom:1px solid rgba(255,255,255,.08)
}

.central-header-inner{
    max-width:1400px;
    margin:auto;
    padding:22px 40px;
    display:flex;
    align-items:center;
    justify-content:space-between
}

.central-logo{
    display:inline-flex;
    align-items:baseline;
    gap:8px;
    text-decoration:none!important;
    color:#fff!important
}

.central-logo-main{
    font-size:30px;
    font-weight:900;
    letter-spacing:-2px
}

.central-logo-sub{
    font-size:10px;
    font-weight:700;
    letter-spacing:3px;
    color:#ff5a00
}

.central-nav{
    display:flex;
    gap:38px
}

.central-nav a{
    color:rgba(255,255,255,.8)!important;
    text-decoration:none!important;
    font-size:13px;
    font-weight:600;
    transition:.25s
}

.central-nav a:hover{
    color:#ff5a00!important
}

.central-header-button{
    border:1px solid rgba(255,255,255,.3);
    color:#fff!important;
    padding:12px 20px;
    text-decoration:none!important;
    font-size:12px;
    font-weight:700;
    transition:.25s
}

.central-header-button:hover{
    background:#ff5a00;
    border-color:#ff5a00
}

.central-hero{
    min-height:100vh;
    position:relative;
    overflow:hidden;
    display:flex;
    align-items:center;
    background:
        radial-gradient(circle at 75% 35%,rgba(255,90,0,.14),transparent 28%),
        radial-gradient(circle at 20% 80%,rgba(30,100,180,.15),transparent 35%),
        linear-gradient(135deg,#060a10,#0d1723 55%,#05080d)
}

.central-hero-grid{
    position:absolute;
    inset:0;
    background-image:
        linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
    background-size:70px 70px
}

.central-glow{
    position:absolute;
    border-radius:50%;
    pointer-events:none;
    animation:centralFloat 8s ease-in-out infinite
}

.central-glow-one{
    width:520px;
    height:520px;
    right:-150px;
    top:15%;
    border:1px solid rgba(255,90,0,.18);
    box-shadow:0 0 100px rgba(255,90,0,.08),inset 0 0 80px rgba(255,90,0,.05)
}

.central-glow-two{
    width:280px;
    height:280px;
    right:18%;
    bottom:-100px;
    border:1px solid rgba(255,255,255,.08);
    animation-delay:-3s
}

@keyframes centralFloat{
    0%,100%{transform:translateY(0) rotate(0)}
    50%{transform:translateY(-22px) rotate(3deg)}
}

.central-hero-content{
    position:relative;
    z-index:5;
    width:min(1200px,calc(100% - 80px));
    margin:auto;
    padding-top:80px
}

.central-eyebrow{
    display:inline-flex;
    align-items:center;
    gap:10px;
    color:#ff5a00;
    font-size:11px;
    font-weight:800;
    letter-spacing:3px
}

.central-eyebrow>span{
    display:block;
    width:28px;
    height:1px;
    background:#ff5a00
}

.central-hero h1{
    max-width:850px;
    margin:25px 0;
    font-size:clamp(58px,8vw,120px);
    line-height:.9;
    letter-spacing:-6px;
    font-weight:800
}

.central-hero h1 em,
.central-about h2 em,
.central-future h2 em,
.central-final h2 em{
    color:#ff5a00;
    font-style:normal
}

.central-hero p{
    max-width:580px;
    color:rgba(255,255,255,.68);
    font-size:18px;
    line-height:1.7;
    margin-bottom:35px
}

.central-main-button{
    display:inline-flex;
    align-items:center;
    gap:25px;
    padding:16px 23px;
    background:#ff5a00;
    color:#fff!important;
    text-decoration:none!important;
    font-size:12px;
    font-weight:800;
    letter-spacing:1px;
    transition:.25s
}

.central-main-button span{
    font-size:20px;
    line-height:0
}

.central-main-button:hover{
    background:#e94d00;
    transform:translateY(-3px);
    box-shadow:0 15px 40px rgba(255,90,0,.22)
}

.central-scroll{
    position:absolute;
    bottom:35px;
    left:50%;
    transform:translateX(-50%);
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:10px;
    color:rgba(255,255,255,.45);
    font-size:9px;
    letter-spacing:3px
}

.central-scroll i{
    display:block;
    width:1px;
    height:45px;
    background:linear-gradient(#ff5a00,transparent);
    animation:scrollLine 2s ease-in-out infinite
}

@keyframes scrollLine{
    0%,100%{opacity:.3;transform:scaleY(.6)}
    50%{opacity:1;transform:scaleY(1)}
}

.central-shops{
    background:#f4f4f2;
    color:#101318;
    padding:130px 40px
}

.central-section-head{
    max-width:1400px;
    margin:0 auto 60px;
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    gap:50px
}

.central-section-head h2{
    margin:18px 0 0;
    font-size:clamp(55px,7vw,100px);
    line-height:.85;
    letter-spacing:-5px
}

.central-section-head h2 em{
    color:#ff5a00;
    font-style:normal
}

.central-section-head>p{
    max-width:350px;
    color:#666;
    font-size:16px;
    line-height:1.6
}

.central-shop-grid{
    max-width:1400px;
    margin:auto;
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:18px
}

.central-shop-card{
    position:relative;
    min-height:620px;
    overflow:hidden;
    display:flex;
    align-items:flex-end;
    color:#fff!important;
    text-decoration:none!important;
    background:#151a20;
    transition:.45s
}

.central-shop-card:hover{
    transform:translateY(-10px);
    box-shadow:0 30px 70px rgba(0,0,0,.2)
}

.central-card-bg{
    position:absolute;
    inset:0;
    transition:transform .7s cubic-bezier(.2,.8,.2,1)
}

.central-shop-card:hover .central-card-bg{
    transform:scale(1.08)
}

.central-vintage .central-card-bg{
    background:
        radial-gradient(circle at 70% 30%,rgba(220,170,110,.5),transparent 28%),
        linear-gradient(145deg,#3c2a20,#191412 65%,#0d0b0a)
}

.central-elektro .central-card-bg{
    background:
        radial-gradient(circle at 70% 30%,rgba(50,150,255,.35),transparent 28%),
        linear-gradient(145deg,#142331,#0b121a 65%,#06090d)
}

.central-geschenk .central-card-bg{
    background:
        radial-gradient(circle at 70% 30%,rgba(255,100,100,.35),transparent 28%),
        linear-gradient(145deg,#392124,#1b1114 65%,#0c090a)
}

.central-shop-card:after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(transparent 30%,rgba(0,0,0,.82))
}

.central-card-number{
    position:absolute;
    top:30px;
    right:30px;
    z-index:3;
    font-size:12px;
    font-weight:800;
    letter-spacing:2px;
    color:rgba(255,255,255,.5)
}

.central-card-content{
    position:relative;
    z-index:4;
    padding:40px
}

.central-card-label{
    color:#ff5a00;
    font-size:10px;
    font-weight:800;
    letter-spacing:3px
}

.central-card-content h3{
    margin:18px 0;
    font-size:clamp(32px,3vw,48px);
    line-height:.95;
    letter-spacing:-2px
}

.central-card-content h3 em{
    display:block;
    color:rgba(255,255,255,.55);
    font-style:normal
}

.central-card-content p{
    max-width:350px;
    color:rgba(255,255,255,.65);
    font-size:14px;
    line-height:1.6;
    margin-bottom:30px
}

.central-card-link{
    display:inline-flex;
    align-items:center;
    gap:15px;
    color:#fff;
    font-size:11px;
    font-weight:800;
    letter-spacing:1px
}

.central-card-link strong{
    color:#ff5a00;
    font-size:20px;
    transition:.25s
}

.central-shop-card:hover .central-card-link strong{
    transform:translateX(7px)
}

.central-about{
    position:relative;
    overflow:hidden;
    padding:150px 40px;
    background:#0b1119;
    color:#fff
}

.central-about-glow{
    position:absolute;
    width:600px;
    height:600px;
    right:-250px;
    top:-200px;
    border-radius:50%;
    border:1px solid rgba(255,90,0,.12);
    box-shadow:0 0 100px rgba(255,90,0,.06)
}

.central-about-inner{
    position:relative;
    z-index:2;
    max-width:1400px;
    margin:auto;
    display:grid;
    grid-template-columns:.7fr 1.3fr;
    gap:80px
}

.central-about h2{
    margin:0 0 35px;
    font-size:clamp(50px,6vw,90px);
    line-height:.9;
    letter-spacing:-5px
}

.central-about-text p{
    max-width:700px;
    color:rgba(255,255,255,.62);
    font-size:18px;
    line-height:1.8
}

.central-future{
    background:#f4f4f2;
    color:#101318;
    padding:140px 40px;
    overflow:hidden
}

.central-future-inner{
    position:relative;
    max-width:1400px;
    margin:auto;
    min-height:400px;
    display:flex;
    align-items:center
}

.central-future-number{
    position:absolute;
    right:-20px;
    bottom:-110px;
    font-size:500px;
    line-height:.8;
    font-weight:900;
    color:rgba(255,90,0,.07);
    letter-spacing:-40px
}

.central-future-content{
    position:relative;
    z-index:2
}

.central-future h2{
    margin:20px 0;
    font-size:clamp(55px,7vw,100px);
    line-height:.85;
    letter-spacing:-5px
}

.central-future p{
    max-width:550px;
    color:#666;
    font-size:17px;
    line-height:1.7
}

.central-final{
    background:#ff5a00;
    color:#fff;
    padding:130px 40px;
    text-align:center
}

.central-final .central-eyebrow{
    color:#fff
}

.central-final .central-eyebrow>span{
    background:#fff
}

.central-final h2{
    margin:25px 0 40px;
    font-size:clamp(55px,7vw,105px);
    line-height:.85;
    letter-spacing:-5px
}

.central-final h2 em{
    color:#111
}

.central-final .central-main-button{
    background:#111
}

.central-final .central-main-button:hover{
    background:#fff;
    color:#111!important
}

.central-footer{
    background:#080b10;
    color:#fff;
    padding:70px 40px 25px
}

.central-footer-inner{
    max-width:1400px;
    margin:auto;
    display:grid;
    grid-template-columns:2fr 1fr 1fr;
    gap:80px;
    padding-bottom:60px
}

.central-footer-brand p{
    color:rgba(255,255,255,.45);
    font-size:13px
}

.central-footer-column{
    display:flex;
    flex-direction:column;
    gap:12px
}

.central-footer-column strong{
    color:#ff5a00;
    font-size:10px;
    letter-spacing:2px;
    margin-bottom:8px
}

.central-footer-column a{
    color:rgba(255,255,255,.6)!important;
    text-decoration:none!important;
    font-size:13px
}

.central-footer-column a:hover{
    color:#ff5a00!important
}

.central-footer-bottom{
    max-width:1400px;
    margin:auto;
    padding-top:25px;
    border-top:1px solid rgba(255,255,255,.08);
    display:flex;
    justify-content:space-between;
    color:rgba(255,255,255,.3);
    font-size:10px;
    letter-spacing:1px
}

@media(max-width:900px){

    .central-nav,
    .central-header-button{
        display:none
    }

    .central-header-inner{
        padding:20px
    }

    .central-hero-content{
        width:calc(100% - 40px)
    }

    .central-shops{
        padding:90px 20px
    }

    .central-section-head{
        display:block
    }

    .central-section-head>p{
        margin-top:25px
    }

    .central-shop-grid{
        grid-template-columns:1fr
    }

    .central-shop-card{
        min-height:520px
    }

    .central-about{
        padding:90px 20px
    }

    .central-about-inner{
        grid-template-columns:1fr;
        gap:40px
    }

    .central-future{
        padding:90px 20px
    }

    .central-footer{
        padding:60px 20px 20px
    }

    .central-footer-inner{
        grid-template-columns:1fr 1fr;
        gap:40px
    }

    .central-footer-brand{
        grid-column:1/-1
    }

    .central-footer-bottom{
        flex-direction:column;
        gap:10px
    }
}

@media(max-width:600px){

    .central-hero{
        min-height:800px
    }

    .central-hero h1{
        font-size:58px
    }

    .central-hero p{
        font-size:16px
    }

    .central-shop-card{
        min-height:500px
    }

    .central-card-content{
        padding:30px
    }

    .central-about h2,
    .central-future h2,
    .central-final h2{
        letter-spacing:-3px
    }

    .central-footer-inner{
        grid-template-columns:1fr
    }
}


/* 24ST Zentrale Landingpage – Hero Überschrift */
.shop24-central .central-hero h1 {
    color: #ffffff !important;
}

.shop24-central .central-hero h1 em {
    color: #ff5a00 !important;
}


/* Zentrale Landingpage – gesamte Hero-Überschrift weiß */
.shop24-central .central-hero h1,
.shop24-central .central-hero h1 em {
    color: #ffffff !important;
}


/* HERO: "Eine Plattform." definitiv weiß */
body.shop24-central .central-hero .central-hero-content h1,
body.shop24-central .central-hero .central-hero-content h1 em {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}


/* 24ST ABOUT – "Eine Plattform." weiß */
body.shop24-central .central-about h2 {
    color: #ffffff !important;
}

body.shop24-central .central-about h2 em {
    color: #ff5a00 !important;
}


/* =========================================================
   24ST – PROFESSIONELLER WARENKORB
   Gilt für Vintage, Elektro und Geschenk
   ========================================================= */

.v24-cart-page {
    --v24-cart-bg: #f7f7f7;
    --v24-cart-card: #ffffff;
    --v24-cart-text: #171717;
    --v24-cart-muted: #737373;
    --v24-cart-border: rgba(0,0,0,.09);
}

/* Cart Block */
.woocommerce-cart .wp-block-woocommerce-cart {
    max-width:1240px;
    margin:0 auto;
    padding:60px 20px 90px;
}

.woocommerce-cart .wp-block-woocommerce-cart__filled-cart {
    width:100%;
}

/* Allgemeine Karten */
.woocommerce-cart .wc-block-cart-items,
.woocommerce-cart .wc-block-cart__totals-title,
.woocommerce-cart .wc-block-components-totals-wrapper {
    border-color:var(--v24-cart-border) !important;
}

/* Produktliste */
.woocommerce-cart .wc-block-cart-items {
    background:#fff;
    border:1px solid var(--v24-cart-border);
    border-radius:24px;
    overflow:hidden;
}

/* Produktbilder */
.woocommerce-cart .wc-block-cart-item__image img {
    border-radius:16px;
}

/* Produktname */
.woocommerce-cart .wc-block-components-product-name {
    color:var(--v24-cart-text) !important;
    font-weight:750;
    text-decoration:none !important;
}

/* Preise */
.woocommerce-cart .wc-block-formatted-money-amount,
.woocommerce-cart .wc-block-components-product-price__value,
.woocommerce-cart .wc-block-components-product-metadata {
    color:var(--v24-cart-text);
}

/* Entfernen-Link */
.woocommerce-cart .wc-block-cart-item__remove-link {
    color:#777 !important;
    font-size:13px;
}

/* Mengensteuerung */
.woocommerce-cart .wc-block-components-quantity-selector {
    border:1px solid var(--v24-cart-border);
    border-radius:999px;
    background:#fff;
}

/* Zusammenfassung */
.woocommerce-cart .wc-block-cart__totals-title {
    font-size:24px;
    font-weight:800;
    color:#171717;
}

.woocommerce-cart .wc-block-components-totals-wrapper {
    background:#fff;
    border:1px solid var(--v24-cart-border);
    border-radius:24px;
    padding:25px;
}

/* Checkout Button */
.woocommerce-cart .wc-block-cart__submit-button,
.woocommerce-cart .wc-block-components-button {
    min-height:52px;
    border:0 !important;
    border-radius:999px !important;
    background:#171717 !important;
    color:#fff !important;
    font-weight:800 !important;
    box-shadow:none !important;
}

.woocommerce-cart .wc-block-cart__submit-button:hover,
.woocommerce-cart .wc-block-components-button:hover {
    opacity:.90;
}

/* Weiter einkaufen */
.woocommerce-cart .wc-block-cart__submit-container::before {
    display:none !important;
}

.woocommerce-cart .wp-block-button a,
.woocommerce-cart .wc-block-components-button {
    transition:transform .2s ease,opacity .2s ease;
}

.woocommerce-cart .wp-block-button a:hover,
.woocommerce-cart .wc-block-components-button:hover {
    transform:translateY(-1px);
}

/* Gutscheincode */
.woocommerce-cart .wc-block-components-totals-coupon {
    border-color:var(--v24-cart-border);
}

.woocommerce-cart .wc-block-components-totals-coupon input {
    min-height:46px;
    border-radius:999px;
    border:1px solid var(--v24-cart-border);
}

/* Leer-Warenkorb */
.woocommerce-cart .wc-block-cart__empty-cart {
    max-width:760px;
    margin:70px auto;
    padding:60px 30px;
    text-align:center;
    background:#fff;
    border:1px solid var(--v24-cart-border);
    border-radius:28px;
}

.woocommerce-cart .wc-block-cart__empty-cart h2 {
    margin-bottom:12px;
    font-size:34px;
    letter-spacing:-.04em;
}

.woocommerce-cart .wc-block-cart__empty-cart p {
    color:var(--v24-cart-muted);
}

/* Mobile */
@media (max-width:700px) {

    .woocommerce-cart .wp-block-woocommerce-cart {
        padding:40px 12px 65px;
    }

    .woocommerce-cart .wc-block-cart-items,
    .woocommerce-cart .wc-block-components-totals-wrapper {
        border-radius:18px;
    }

    .woocommerce-cart .wc-block-cart__totals-title {
        font-size:21px;
    }

    .woocommerce-cart .wc-block-cart__empty-cart {
        margin:40px auto;
        padding:45px 20px;
        border-radius:22px;
    }
}


/* =========================================================
   24ST – CART DESKTOP LAYER FIX
   WooCommerce Cart immer oberhalb von Theme-Overlays
   ========================================================= */

body.woocommerce-cart .shop24-main,
body.woocommerce-cart .site-main,
body.woocommerce-cart .content-area,
body.woocommerce-cart .entry-content,
body.woocommerce-cart .woocommerce {
    position:relative !important;
    z-index:2000 !important;
    opacity:1 !important;
    visibility:visible !important;
}

body.woocommerce-cart .site-main {
    background:#fff !important;
}

body.woocommerce-cart .entry-content {
    background:#fff !important;
}

body.woocommerce-cart .woocommerce-cart-form,
body.woocommerce-cart .cart-collaterals,
body.woocommerce-cart .cart_totals {
    position:relative !important;
    z-index:2001 !important;
    opacity:1 !important;
    visibility:visible !important;
}

body.woocommerce-cart .woocommerce-cart-form table.shop_table {
    position:relative !important;
    z-index:2002 !important;
}

body.woocommerce-cart .wc-block-cart,
body.woocommerce-cart .wp-block-woocommerce-cart {
    position:relative !important;
    z-index:2002 !important;
    background:#fff !important;
    opacity:1 !important;
    visibility:visible !important;
}

/* Verhindert, dass alte Seiten-Overlays den Cart verdecken */
body.woocommerce-cart .shop24-main::before,
body.woocommerce-cart .shop24-main::after,
body.woocommerce-cart .content-area::before,
body.woocommerce-cart .content-area::after {
    pointer-events:none !important;
}


/* =========================================================
   24ST – CHECKOUT DESKTOP FIX
   WooCommerce Kasse immer sichtbar
   ========================================================= */

body.woocommerce-checkout .shop24-main,
body.woocommerce-checkout .site-main,
body.woocommerce-checkout .content-area,
body.woocommerce-checkout .entry-content,
body.woocommerce-checkout .woocommerce {
    position:relative !important;
    z-index:2000 !important;
    opacity:1 !important;
    visibility:visible !important;
}

body.woocommerce-checkout .site-main,
body.woocommerce-checkout .entry-content {
    background:#fff !important;
}

body.woocommerce-checkout .woocommerce-checkout {
    position:relative !important;
    z-index:2001 !important;
    opacity:1 !important;
    visibility:visible !important;
}

/* WooCommerce Checkout Blocks */
body.woocommerce-checkout .wc-block-checkout,
body.woocommerce-checkout .wp-block-woocommerce-checkout {
    position:relative !important;
    z-index:2002 !important;
    background:#fff !important;
    opacity:1 !important;
    visibility:visible !important;
}

/* Verhindert, dass alte Theme-Overlays die Kasse verdecken */
body.woocommerce-checkout .shop24-main::before,
body.woocommerce-checkout .shop24-main::after,
body.woocommerce-checkout .content-area::before,
body.woocommerce-checkout .content-area::after {
    pointer-events:none !important;
}


/* =========================================================
   24ST – MOBILE SHOP: 4 PRODUKTE NEBENEINANDER
   Gilt für Vintage, Elektro und Geschenk
   ========================================================= */

@media (max-width:640px) {

    body.shop24-site .v24-shop-page ul.products {
        display:grid !important;
        grid-template-columns:repeat(4,minmax(0,1fr)) !important;
        gap:8px !important;
        width:100% !important;
    }

    body.shop24-site .v24-shop-page ul.products li.product {
        width:auto !important;
        max-width:none !important;
        margin:0 !important;
        padding:0 !important;
    }

    body.shop24-site .v24-shop-page ul.products li.product a img {
        width:100% !important;
        aspect-ratio:1 / 1 !important;
        height:auto !important;
        object-fit:cover !important;
        border-radius:10px !important;
        margin-bottom:8px !important;
    }

    body.shop24-site .v24-shop-page ul.products li.product .woocommerce-loop-product__title {
        font-size:12px !important;
        line-height:1.2 !important;
        margin:0 0 5px !important;
    }

    body.shop24-site .v24-shop-page ul.products li.product .price {
        font-size:12px !important;
        line-height:1.2 !important;
    }

    body.shop24-site .v24-shop-page ul.products li.product .button {
        font-size:10px !important;
        padding:7px 8px !important;
        margin-top:7px !important;
        border-radius:999px !important;
        width:100% !important;
        text-align:center !important;
    }

}

/* =========================================================

/* 24ST MOBILE SHOP – IMMER 4 PRODUKTE PRO REIHE */
@media screen and (max-width: 700px) {

    body.shop24-site ul.products,
    body.woocommerce-shop ul.products,
    body.tax-product_cat ul.products,
    body.woocommerce ul.products,
    body.shop24-site .v24-shop-page ul.products {
        display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        grid-auto-flow: row !important;
        gap: 16px 7px !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        float: none !important;
        clear: none !important;
        box-sizing: border-box !important;
    }

    body.shop24-site ul.products::before,
    body.shop24-site ul.products::after,
    body.woocommerce-shop ul.products::before,
    body.woocommerce-shop ul.products::after,
    body.tax-product_cat ul.products::before,
    body.tax-product_cat ul.products::after {
        display: none !important;
        content: none !important;
    }

    body.shop24-site ul.products li.product,
    body.woocommerce-shop ul.products li.product,
    body.tax-product_cat ul.products li.product,
    body.woocommerce ul.products li.product {
        display: block !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        float: none !important;
        clear: none !important;
        box-sizing: border-box !important;
    }

    body.shop24-site ul.products li.product a,
    body.woocommerce-shop ul.products li.product a,
    body.tax-product_cat ul.products li.product a {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
    }

    body.shop24-site ul.products li.product img,
    body.woocommerce-shop ul.products li.product img,
    body.tax-product_cat ul.products li.product img {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 1 / 1 !important;
        object-fit: cover !important;
        margin: 0 0 5px !important;
        border-radius: 8px !important;
    }

    body.shop24-site ul.products li.product .woocommerce-loop-product__title,
    body.woocommerce-shop ul.products li.product .woocommerce-loop-product__title,
    body.tax-product_cat ul.products li.product .woocommerce-loop-product__title {
        display: block !important;
        font-size: 10px !important;
        line-height: 1.15 !important;
        margin: 0 0 3px !important;
        padding: 0 !important;
    }

    body.shop24-site ul.products li.product .price,
    body.woocommerce-shop ul.products li.product .price,
    body.tax-product_cat ul.products li.product .price {
        display: block !important;
        font-size: 10px !important;
        line-height: 1.15 !important;
        margin: 0 !important;
    }

    body.shop24-site ul.products li.product .button,
    body.woocommerce-shop ul.products li.product .button,
    body.tax-product_cat ul.products li.product .button {
        display: none !important;
    }
}