/* Klemmshop Sonderangebote – passend zum bestehenden Klemmshop Designsystem */
:root{
    --kss-green:#246f49;
    --kss-green-dark:#174b32;
    --kss-green-soft:#eaf5ee;
    --kss-ink:#1b2420;
    --kss-muted:#68716c;
    --kss-paper:#f7f8f5;
    --kss-line:#e2e6e2;
    --kss-sale:#ea6b2d;
    --kss-sale-dark:#b94717;
    --kss-sale-soft:#fff0e8;
    --kss-radius:24px;
}

.ks-sale-hub,
.ks-sale-hub__content{font-family:"Open Sans",Arial,sans-serif;color:var(--kss-ink)}
.ks-sale-hub *,.ks-sale-hub__content *{box-sizing:border-box}

.ks-sale-hub{margin:0 0 28px}
.ks-sale-hub__hero{
    position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(420px,.92fr);gap:34px;
    padding:54px 56px;border-radius:30px;background:linear-gradient(135deg,#18231d 0%,#213a2b 58%,#28563b 100%);color:#fff;
    box-shadow:0 18px 55px rgba(18,31,24,.13)
}
.ks-sale-hub__hero:before{content:"";position:absolute;right:-100px;top:-170px;width:430px;height:430px;border-radius:50%;background:rgba(255,255,255,.045)}
.ks-sale-hub__hero:after{content:"";position:absolute;right:220px;bottom:-180px;width:330px;height:330px;border-radius:50%;background:rgba(234,107,45,.10)}
.ks-sale-hub__hero-copy,.ks-sale-hub__visual{position:relative;z-index:2}
.ks-sale-hub__kicker{display:block;margin-bottom:10px;color:var(--kss-green);font-size:.76rem;font-weight:800;letter-spacing:.095em;text-transform:uppercase}
.ks-sale-hub__hero .ks-sale-hub__kicker{color:#aee0c0}
.ks-sale-hub h1,.ks-sale-hub h2,.ks-sale-hub h3,.ks-sale-hub__content h2{font-family:Montserrat,"Open Sans",Arial,sans-serif}
.ks-sale-hub__hero h1{max-width:670px;margin:0 0 18px;font-size:clamp(2.25rem,4vw,4.25rem);line-height:1.02;font-weight:800;letter-spacing:-.045em;color:#fff}
.ks-sale-hub__hero-copy>p{max-width:690px;margin:0;color:rgba(255,255,255,.79);font-size:1.04rem;line-height:1.72}
.ks-sale-hub__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.ks-sale-hub__button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 19px;border:1px solid transparent;border-radius:12px;font-weight:800;text-decoration:none!important;transition:transform .18s ease,background .18s ease,border-color .18s ease}
.ks-sale-hub__button:hover{transform:translateY(-2px);text-decoration:none!important}
.ks-sale-hub__button--primary{color:#fff!important;background:var(--kss-sale);box-shadow:0 8px 23px rgba(234,107,45,.25)}
.ks-sale-hub__button--primary:hover{background:#f17639}
.ks-sale-hub__button--secondary{color:#fff!important;border-color:rgba(255,255,255,.25);background:rgba(255,255,255,.07)}
.ks-sale-hub__button--secondary:hover{background:rgba(255,255,255,.13)}

.ks-sale-hub__trust{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:32px}
.ks-sale-hub__trust>span{padding:13px 14px;border:1px solid rgba(255,255,255,.11);border-radius:13px;background:rgba(255,255,255,.055)}
.ks-sale-hub__trust b,.ks-sale-hub__trust small{display:block}
.ks-sale-hub__trust b{font-size:.81rem;color:#fff}
.ks-sale-hub__trust small{margin-top:3px;color:rgba(255,255,255,.61);font-size:.69rem;line-height:1.4}

.ks-sale-hub__visual{min-height:390px;align-self:center}
.ks-sale-hub__product{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:16px;border-radius:21px;background:#fff;color:var(--kss-ink)!important;text-decoration:none!important;box-shadow:0 18px 45px rgba(0,0,0,.19);transition:transform .22s ease,box-shadow .22s ease}
.ks-sale-hub__product:hover{box-shadow:0 25px 54px rgba(0,0,0,.25);text-decoration:none!important}
.ks-sale-hub__product img{width:100%;height:calc(100% - 35px);object-fit:contain}
.ks-sale-hub__product-name{width:100%;margin-top:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;font-size:.72rem;font-weight:800}
.ks-sale-hub__discount{position:absolute;z-index:3;left:12px;top:12px;padding:6px 9px;border-radius:999px;background:var(--kss-sale);color:#fff;font-size:.62rem;font-weight:900;letter-spacing:.04em;box-shadow:0 6px 16px rgba(234,107,45,.25)}
.ks-sale-hub__product--tree{left:0;top:55px;width:39%;height:245px;transform:rotate(-5deg)}
.ks-sale-hub__product--tree:hover{transform:rotate(-3deg) translateY(-5px)}
.ks-sale-hub__product--motor{right:2%;top:10px;width:36%;height:210px;transform:rotate(5deg)}
.ks-sale-hub__product--motor:hover{transform:rotate(3deg) translateY(-5px)}
.ks-sale-hub__product--car{right:11%;bottom:0;width:54%;height:235px;transform:rotate(-1deg)}
.ks-sale-hub__product--car:hover{transform:rotate(0) translateY(-5px)}

.ks-sale-hub__content{margin:0 0 26px}
.ks-sale-hub__intro{padding:30px 0 8px}
.ks-sale-hub__section-head{display:flex;justify-content:space-between;gap:24px;align-items:flex-end;margin-bottom:22px}
.ks-sale-hub__section-head h2{margin:0 0 8px;font-size:clamp(1.65rem,2.5vw,2.35rem);line-height:1.12;font-weight:800;letter-spacing:-.035em;color:var(--kss-ink)}
.ks-sale-hub__section-head p{max-width:800px;margin:0;color:var(--kss-muted);font-size:.94rem;line-height:1.65}
.ks-sale-hub__facts{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.ks-sale-hub__facts article{display:flex;align-items:flex-start;gap:13px;padding:18px;border:1px solid var(--kss-line);border-radius:17px;background:#fff;box-shadow:0 8px 28px rgba(24,35,29,.035)}
.ks-sale-hub__fact-icon{flex:0 0 38px;width:38px;height:38px;display:flex;align-items:center;justify-content:center;border-radius:11px;background:var(--kss-sale-soft);color:var(--kss-sale-dark);font-size:1.05rem;font-weight:900}
.ks-sale-hub__facts strong,.ks-sale-hub__facts small{display:block}
.ks-sale-hub__facts strong{font-size:.87rem;color:var(--kss-ink)}
.ks-sale-hub__facts small{margin-top:4px;color:var(--kss-muted);font-size:.76rem;line-height:1.5}
.ks-sale-hub__notice{display:flex;align-items:flex-start;gap:12px;margin-top:14px;padding:15px 17px;border-radius:15px;background:var(--kss-paper);border:1px solid var(--kss-line)}
.ks-sale-hub__notice-badge{flex:0 0 auto;padding:5px 9px;border-radius:999px;background:var(--kss-green-soft);color:var(--kss-green-dark);font-size:.67rem;font-weight:900;text-transform:uppercase;letter-spacing:.05em}
.ks-sale-hub__notice p{margin:0;color:var(--kss-muted);font-size:.8rem;line-height:1.55}
.ks-sale-hub__notice strong{color:var(--kss-ink)}

/* Nur auf der Sonderangebote-Seite die normalen NOVA-Produktkarten etwas aufwerten. */
body:has(.ks-sale-hub) .productbox{border-radius:18px!important;transition:transform .2s ease,box-shadow .2s ease!important}
body:has(.ks-sale-hub) .productbox:hover{transform:translateY(-4px);box-shadow:0 15px 38px rgba(23,27,36,.095)!important}
body:has(.ks-sale-hub) .productbox-inner{border-radius:18px!important;overflow:hidden}
body:has(.ks-sale-hub) .productbox-title a{font-weight:800!important;color:var(--kss-ink)!important}
body:has(.ks-sale-hub) .productbox .price_wrapper,
body:has(.ks-sale-hub) .productbox .price{font-weight:800}
body:has(.ks-sale-hub) .btn-primary{border-color:var(--kss-green)!important;background:var(--kss-green)!important}
body:has(.ks-sale-hub) .btn-primary:hover{border-color:var(--kss-green-dark)!important;background:var(--kss-green-dark)!important}

@media(max-width:991.98px){
    .ks-sale-hub__hero{grid-template-columns:1fr;padding:42px 34px}
    .ks-sale-hub__visual{min-height:325px;max-width:620px;width:100%;margin:0 auto}
    .ks-sale-hub__product--tree{left:5%;width:33%;height:215px}
    .ks-sale-hub__product--motor{right:7%;width:31%;height:185px}
    .ks-sale-hub__product--car{right:22%;width:45%;height:205px}
}
@media(max-width:767.98px){
    .ks-sale-hub__hero{padding:31px 22px;border-radius:22px}
    .ks-sale-hub__hero h1{font-size:2.25rem}
    .ks-sale-hub__trust,.ks-sale-hub__facts{grid-template-columns:1fr}
    .ks-sale-hub__visual{min-height:285px}
    .ks-sale-hub__product--tree{left:0;width:38%;height:185px}
    .ks-sale-hub__product--motor{right:0;width:35%;height:160px}
    .ks-sale-hub__product--car{right:18%;width:54%;height:180px}
    .ks-sale-hub__section-head{display:block}
}
@media(max-width:479.98px){
    .ks-sale-hub__actions{display:grid;grid-template-columns:1fr}
    .ks-sale-hub__button{width:100%}
    .ks-sale-hub__visual{min-height:235px}
    .ks-sale-hub__product{padding:10px;border-radius:15px}
    .ks-sale-hub__product-name{font-size:.6rem}
    .ks-sale-hub__discount{left:7px;top:7px;padding:4px 6px;font-size:.52rem}
    .ks-sale-hub__product--tree{height:150px}
    .ks-sale-hub__product--motor{height:135px}
    .ks-sale-hub__product--car{height:145px}
}

/* v1.1: dynamische Angebotskarten + Leerzustand */
.ks-sale-hub__product--1 { transform: rotate(-3deg); }
.ks-sale-hub__product--2 { transform: translateY(22px) rotate(2deg); }
.ks-sale-hub__product--3 { transform: translateY(-8px) rotate(4deg); }
.ks-sale-hub__product--1:hover,
.ks-sale-hub__product--2:hover,
.ks-sale-hub__product--3:hover { transform: translateY(-5px) rotate(0); }

.ks-sale-hub__product-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    aspect-ratio: 1;
    border-radius: 14px;
    background: rgba(255,255,255,.92);
    color: var(--ks-sale-accent, #e46f2b);
    font: 800 4rem/1 Montserrat, Arial, sans-serif;
}

.ks-sale-hub--empty .ks-sale-hub__hero {
    min-height: 440px;
}

.ks-sale-hub__empty-visual {
    position: relative;
    min-height: 330px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 18px;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 28px;
    background: rgba(255,255,255,.07);
    overflow: hidden;
}

.ks-sale-hub__empty-visual::before,
.ks-sale-hub__empty-visual::after {
    content: "";
    position: absolute;
    width: 170px;
    height: 70px;
    border-radius: 18px;
    background: rgba(255,255,255,.06);
    transform: rotate(-12deg);
}
.ks-sale-hub__empty-visual::before { left: -30px; top: 40px; }
.ks-sale-hub__empty-visual::after { right: -35px; bottom: 30px; transform: rotate(14deg); }

.ks-sale-hub__empty-percent {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 145px;
    height: 145px;
    border-radius: 34px;
    color: #fff;
    background: var(--ks-sale-accent, #e46f2b);
    box-shadow: 0 18px 45px rgba(0,0,0,.2);
    font: 800 5rem/1 Montserrat, Arial, sans-serif;
}

.ks-sale-hub__empty-label {
    max-width: 260px;
    color: rgba(255,255,255,.8);
    text-align: center;
    font-weight: 700;
}

.ks-sale-hub__no-products {
    display: grid;
    grid-template-columns: auto minmax(0,1fr) auto;
    align-items: center;
    gap: 24px;
    padding: 30px;
    border: 1px solid #e2e7e4;
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 10px 35px rgba(23,27,36,.06);
}

.ks-sale-hub__no-products-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    border-radius: 20px;
    color: #fff;
    background: var(--ks-sale-accent, #e46f2b);
    font: 800 2.3rem/1 Montserrat, Arial, sans-serif;
}

.ks-sale-hub__no-products h2 { margin: 3px 0 8px; }
.ks-sale-hub__no-products p { margin: 0; color: #68736d; }
.ks-sale-hub__no-products-actions { display: flex; flex-direction: column; gap: 8px; min-width: 200px; }
.ks-sale-hub__no-products-actions a {
    display: inline-flex;
    justify-content: space-between;
    gap: 10px;
    padding: 11px 14px;
    border-radius: 10px;
    color: #1e6840;
    background: #edf7f1;
    font-weight: 700;
}
.ks-sale-hub__no-products-actions a:first-child { color: #fff; background: #1e6840; }

@media (max-width: 767.98px) {
    .ks-sale-hub__no-products { grid-template-columns: 1fr; }
    .ks-sale-hub__no-products-icon { width: 58px; height: 58px; }
    .ks-sale-hub__no-products-actions { min-width: 0; }
}

/* v1.4 – Hero-Slider: keine überlappenden Produktkarten mehr */
.ks-sale-slider {
    position: relative;
    z-index: 2;
    align-self: center;
    width: 100%;
    max-width: 520px;
    min-width: 0;
    margin: 0 auto;
    padding: 0 54px 38px;
}
.ks-sale-slider__viewport {
    position: relative;
    overflow: hidden;
    border-radius: 26px;
}
.ks-sale-slider__track {
    position: relative;
    min-height: 400px;
}
.ks-sale-slider__slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    visibility: hidden;
    transform: translateX(28px) scale(.98);
    transition: opacity .38s ease, transform .38s ease, visibility .38s ease;
    pointer-events: none;
}
.ks-sale-slider__slide.is-active {
    position: relative;
    opacity: 1;
    visibility: visible;
    transform: translateX(0) scale(1);
    pointer-events: auto;
}
.ks-sale-slider__product {
    position: relative;
    display: grid;
    grid-template-rows: minmax(0,1fr) auto auto;
    min-height: 400px;
    padding: 24px 24px 21px;
    border: 1px solid rgba(255,255,255,.38);
    border-radius: 26px;
    background: #fff;
    color: var(--kss-ink)!important;
    text-decoration: none!important;
    box-shadow: 0 22px 55px rgba(0,0,0,.22);
}
.ks-sale-slider__product:hover {
    color: var(--kss-ink)!important;
    text-decoration: none!important;
    box-shadow: 0 28px 65px rgba(0,0,0,.28);
}
.ks-sale-slider__image {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 285px;
    padding: 6px 8px 12px;
}
.ks-sale-slider__image img {
    display: block;
    width: 100%;
    height: 285px;
    object-fit: contain;
    transition: transform .25s ease;
}
.ks-sale-slider__product:hover .ks-sale-slider__image img { transform: scale(1.025); }
.ks-sale-slider__name {
    display: -webkit-box;
    min-height: 42px;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    margin-top: 2px;
    font-family: Montserrat,"Open Sans",Arial,sans-serif;
    font-size: .93rem;
    line-height: 1.4;
    font-weight: 800;
    text-align: center;
}
.ks-sale-slider__cta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 12px;
    color: var(--kss-green-dark);
    font-size: .78rem;
    font-weight: 800;
}
.ks-sale-slider__arrow {
    position: absolute;
    z-index: 5;
    top: calc(50% - 18px);
    width: 42px;
    height: 42px;
    padding: 0;
    border: 1px solid rgba(255,255,255,.24);
    border-radius: 50%;
    color: #fff;
    background: rgba(255,255,255,.10);
    box-shadow: 0 10px 25px rgba(0,0,0,.13);
    font: 400 2rem/38px Arial,sans-serif;
    text-align: center;
    cursor: pointer;
    backdrop-filter: blur(4px);
    transition: background .18s ease, transform .18s ease;
}
.ks-sale-slider__arrow:hover,
.ks-sale-slider__arrow:focus-visible {
    color: #fff;
    background: var(--kss-sale);
    transform: scale(1.06);
    outline: none;
}
.ks-sale-slider__arrow--prev { left: 2px; }
.ks-sale-slider__arrow--next { right: 2px; }
.ks-sale-slider__dots {
    position: absolute;
    left: 54px;
    right: 54px;
    bottom: 8px;
    z-index: 6;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 7px;
}
.ks-sale-slider__dot {
    width: 8px;
    height: 8px;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: rgba(255,255,255,.34);
    cursor: pointer;
    transition: width .2s ease, background .2s ease;
}
.ks-sale-slider__dot.is-active {
    width: 24px;
    background: var(--kss-sale);
}
@media (prefers-reduced-motion: reduce) {
    .ks-sale-slider__slide,
    .ks-sale-slider__image img,
    .ks-sale-slider__dot { transition: none!important; }
}
@media(max-width:991.98px){
    .ks-sale-slider { max-width: 570px; }
    .ks-sale-slider__track,.ks-sale-slider__product { min-height: 370px; }
    .ks-sale-slider__image,.ks-sale-slider__image img { min-height: 0; height: 260px; }
}
@media(max-width:575.98px){
    .ks-sale-slider { padding: 0 40px 34px; }
    .ks-sale-slider__track,.ks-sale-slider__product { min-height: 330px; }
    .ks-sale-slider__product { padding: 18px 17px 17px; border-radius: 20px; }
    .ks-sale-slider__viewport { border-radius: 20px; }
    .ks-sale-slider__image { min-height: 0; padding-bottom: 8px; }
    .ks-sale-slider__image img { height: 220px; }
    .ks-sale-slider__arrow { width: 34px; height: 34px; top: calc(50% - 17px); font-size: 1.65rem; line-height: 31px; }
    .ks-sale-slider__arrow--prev { left: 0; }
    .ks-sale-slider__arrow--next { right: 0; }
    .ks-sale-slider__dots { left: 40px; right: 40px; }
}

/* v1.6: Preisersparnis pro Produkt – NUR auf der Sonderangebote-Seite. */
.ks-sale-card-price-details{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:6px;
    margin-top:5px;
}
.ks-sale-card-old-price{
    color:#747c77;
    font-size:.74rem;
    font-weight:500;
    line-height:1.35;
}
.ks-sale-card-old-price del{
    text-decoration-thickness:1px;
    text-decoration-color:#9b5b42;
}
.ks-sale-card-saving{
    display:inline-flex;
    align-items:center;
    flex-wrap:wrap;
    gap:5px;
    width:max-content;
    max-width:100%;
    padding:5px 8px;
    border:1px solid rgba(234,107,45,.22);
    border-radius:999px;
    background:var(--kss-sale-soft);
    color:var(--kss-sale-dark);
    font-size:.74rem;
    font-weight:700;
    line-height:1.2;
}
.ks-sale-card-saving strong{
    color:var(--kss-sale-dark);
    font-size:.78rem;
    font-weight:900;
}
.ks-sale-card-saving-percent{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:21px;
    padding:2px 7px;
    border-radius:999px;
    background:var(--kss-sale);
    color:#fff;
    font-size:.69rem;
    font-weight:900;
    white-space:nowrap;
}
.ks-sale-card-saving--list{
    margin-top:7px;
}
@media(max-width:479.98px){
    .ks-sale-card-saving{
        padding:5px 7px;
        font-size:.7rem;
    }
    .ks-sale-card-saving strong{font-size:.74rem}
    .ks-sale-card-saving-percent{font-size:.66rem}
}