/* ZMRAZU.CZ – SPODNI OBSAH HOMEPAGE */
.zm-home-story{max-width:1180px;margin:0 auto;padding:55px 15px 70px;box-sizing:border-box}.zm-home-story *,.zm-home-story *::before,.zm-home-story *::after{box-sizing:border-box}.zm-home-kicker{display:inline-block;margin-bottom:12px;padding:7px 13px;border-radius:999px;background:#fff0ef;color:#b72d2d;font-size:12px;font-weight:700;letter-spacing:.03em}.zm-home-story h2{margin:0 0 16px;color:#25313c;font-size:34px;line-height:1.2}.zm-home-story h3{margin:0 0 8px;color:#25313c;font-size:20px;line-height:1.3}.zm-home-story p{margin:0 0 16px;color:#667481;font-size:16px;line-height:1.7}.zm-home-split{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:center;margin-bottom:80px}.zm-home-copy,.zm-home-photo{min-width:0}.zm-home-photo img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:24px;box-shadow:0 14px 35px rgba(30,45,60,.1)}.zm-home-checks{display:flex;flex-wrap:wrap;gap:9px;margin:22px 0 26px}.zm-home-checks span{display:inline-flex;align-items:center;padding:8px 12px;border-radius:999px;background:#f3f7f0;color:#40543a;font-size:14px;font-weight:700}.zm-home-btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:11px 23px;border-radius:12px;background:#c93636;color:#fff!important;font-size:15px;font-weight:700;text-decoration:none!important;transition:transform .2s ease,background .2s ease}.zm-home-btn:hover{background:#a92727;transform:translateY(-2px)}.zm-home-text-link{display:inline-block;margin-top:3px;color:#c93636!important;font-size:16px;font-weight:700;text-decoration:none!important}.zm-home-section-title{max-width:720px;margin:0 auto 30px;text-align:center}.zm-home-section-title p{max-width:650px;margin:0 auto}.zm-home-process{margin:0 0 80px;padding:45px 35px;background:#fff8f7;border:1px solid #f4dfdd;border-radius:26px}.zm-home-process-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.zm-home-process-card{position:relative;min-width:0;padding:26px;background:#fff;border:1px solid #eadfdd;border-radius:18px}.zm-home-process-icon{width:52px;height:52px;display:flex;align-items:center;justify-content:center;margin-bottom:18px;border-radius:14px;background:#fff0ef;font-size:24px}.zm-home-process-number{position:absolute;top:20px;right:20px;color:#d7b1ae;font-size:14px;font-weight:800}.zm-home-split-reverse{margin-bottom:80px}.zm-home-uses{margin-bottom:80px}.zm-home-uses-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.zm-home-use-card{overflow:hidden;background:#fff;border:1px solid #e5e8ec;border-radius:20px;box-shadow:0 8px 24px rgba(30,45,60,.05)}.zm-home-use-card img{display:block;width:100%;aspect-ratio:16/8;object-fit:cover}.zm-home-use-card>div{padding:21px 22px 23px}.zm-home-use-card p{margin-bottom:0}.zm-home-cta{padding:48px 30px;border-radius:26px;background:linear-gradient(135deg,#b71c1c 0%,#d63a3a 100%);color:#fff;text-align:center}.zm-home-cta-icon{margin-bottom:10px;font-size:36px}.zm-home-cta h2{color:#fff}.zm-home-cta p{max-width:650px;margin:0 auto 24px;color:rgba(255,255,255,.88)}.zm-home-btn-light{background:#fff;color:#b72d2d!important}.zm-home-btn-light:hover{background:#fff5f4}@media(max-width:991px){.zm-home-split{gap:35px}.zm-home-story h2{font-size:30px}.zm-home-process{padding:35px 25px}}@media(max-width:767px){.zm-home-story{padding:35px 10px 50px}.zm-home-story h2{font-size:27px}.zm-home-story h3{font-size:20px}.zm-home-story p{font-size:16px;line-height:1.65}.zm-home-split{grid-template-columns:1fr;gap:26px;margin-bottom:55px}.zm-home-split .zm-home-copy{order:1}.zm-home-split .zm-home-photo{order:2}.zm-home-split-reverse .zm-home-photo{order:1}.zm-home-split-reverse .zm-home-copy{order:2}.zm-home-photo img{aspect-ratio:4/3;border-radius:18px}.zm-home-checks{flex-direction:column;align-items:flex-start;gap:7px}.zm-home-btn{width:100%}.zm-home-process{margin-bottom:55px;padding:28px 16px;border-radius:20px}.zm-home-process-grid{grid-template-columns:1fr;gap:12px}.zm-home-process-card{padding:22px}.zm-home-uses{margin-bottom:55px}.zm-home-uses-grid{grid-template-columns:1fr;gap:15px}.zm-home-use-card img{aspect-ratio:16/9}.zm-home-use-card>div{padding:18px}.zm-home-cta{padding:35px 18px;border-radius:20px}}

/* ==========================================================
   ZMRAZU.CZ – VÝBĚR VELIKOSTI BALENÍ
   ----------------------------------------------------------
   Karty 30 g / 50 g / 100 g / 1000 g
   Mobile first
   Sáčky s logem Zmrazu
   ========================================================== */


/* ----------------------------------------------------------
   1. CELÝ BLOK VÝBĚRU BALENÍ
   ---------------------------------------------------------- */

.zm-v {
    margin: 12px 0 18px;
}


/* Nadpis "Vyberte velikost balení" */
.zm-v strong {
    display: block;
    margin-bottom: 9px;
}


/* ----------------------------------------------------------
   2. ROZLOŽENÍ KARET
   ----------------------------------------------------------
   Mobil: 2 karty vedle sebe
   ---------------------------------------------------------- */

.zm-c {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
}


/* ----------------------------------------------------------
   3. VZHLED JEDNÉ KARTY
   ---------------------------------------------------------- */

.zm-b {
    position: relative;

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

    gap: 5px;

    min-height: 110px;
    padding: 7px;

    border: 1.5px solid #ddd;
    border-radius: 14px;

    background: #fff;

    font: 700 15px inherit;

    cursor: pointer;
}


/* ----------------------------------------------------------
   4. GRAFICKÝ SÁČEK S LOGEM ZMRAZU
   ----------------------------------------------------------
   Sáček je vytvořený pomocí CSS.
   Logo se načítá ze Shoptetu.
   ---------------------------------------------------------- */

.zm-b:before {
    content: "";

    display: block;

    width: 40px;
    height: 55px;

    border: 1px solid #ccc;
    border-radius: 4px 4px 9px 9px;

    background:
        url("https://www.zmrazu.cz/user/documents/upload/05b36ee7-4405-4bdf-830d-2e94f943a3.png")
        center 58% / 72% auto no-repeat,

        linear-gradient(
            #eee 0 8px,
            #fff 10px,
            #f8f8f8
        );

    box-shadow: 0 3px 7px #0002;
}


/* ----------------------------------------------------------
   5. VELIKOSTI JEDNOTLIVÝCH SÁČKŮ
   ----------------------------------------------------------
   1. karta = nejmenší balení
   2. karta = druhé balení
   3. karta = třetí balení
   4. karta = největší balení
   ---------------------------------------------------------- */

/* 30 g */
.zm-b:nth-child(1):before {
    width: 40px;
    height: 55px;
}

/* 50 g */
.zm-b:nth-child(2):before {
    width: 45px;
    height: 62px;
}

/* 100 g */
.zm-b:nth-child(3):before {
    width: 50px;
    height: 69px;
}

/* 1000 g */
.zm-b:nth-child(4):before {
    width: 57px;
    height: 78px;
}


/* ----------------------------------------------------------
   6. AKTIVNÍ / VYBRANÁ VARIANTA
   ---------------------------------------------------------- */

.zm-b.on {
    border-color: #79a878;
    background: #f2f8f1;
}


/* Zelená fajfka v pravém horním rohu */
.zm-b.on:after {
    content: "✓";

    position: absolute;
    top: 6px;
    right: 7px;

    width: 21px;
    height: 21px;

    border-radius: 50%;

    background: #568b54;
    color: #fff;

    line-height: 21px;
}


/* ----------------------------------------------------------
   7. SKRYTÍ PŮVODNÍHO VÝBĚRU SHOPTETU
   ----------------------------------------------------------
   Původní varianty dál fungují na pozadí.
   Zákazník místo nich vidí naše karty.
   ---------------------------------------------------------- */

.zm-hide {
    display: none !important;
}


/* Skryje původní nadpis "Varianty" */
.detail-grid-title {
    display: none !important;
}


/* ----------------------------------------------------------
   8. DESKTOP / TABLET
   ----------------------------------------------------------
   Od 768 px zobrazíme všechny 4 varianty vedle sebe.
   ---------------------------------------------------------- */

@media (min-width: 768px) {

    .zm-c {
        grid-template-columns: repeat(4, 1fr);
        gap: 10px;
    }

    .zm-b {
        min-height: 125px;
        font-size: 16px;
    }

}


/* ==========================================================
   KONEC – VÝBĚR VELIKOSTI BALENÍ
   ========================================================== */