.benefit-strip {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 15px;
    padding-block: 18px;
    border-block: 1px solid var(--line);
}
.benefit-strip > div {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 76px;
    padding: 14px;
    background: var(--blue);
    border-radius: 5px;
}
.benefit-strip .icon {
    width: 28px;
    height: 28px;
}
.benefit-strip > div:nth-child(1) .icon {
    color: var(--orange);
}
.benefit-strip > div:nth-child(2) .icon {
    color: #21705a;
}
.benefit-strip > div:nth-child(3) .icon {
    color: #b55b00;
}
.benefit-strip > div:nth-child(4) .icon {
    color: var(--green);
}
.benefit-strip b,
.benefit-strip small {
    display: block;
}
.benefit-strip b {
    font-size: 12px;
}
.benefit-strip small {
    font-size: 10px;
    color: var(--muted);
    line-height: 1.4;
    margin-top: 3px;
}
.category-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}
.category-card {
    background: white;
    border: 1px solid var(--line);
    border-radius: 6px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition:
        transform 0.2s,
        box-shadow 0.2s;
}
.category-image {
    position: relative;
    height: 180px;
    overflow: hidden;
}
.category-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.category-image .pill {
    position: absolute;
    top: 9px;
    left: 9px;
    font-size: 9px;
}
.category-card-body {
    padding: 15px;
    display: flex;
    flex-direction: column;
    flex: 1;
}
.category-card h3 {
    font-size: 15px;
    margin-bottom: 8px;
}
.category-card p {
    font-size: 11px;
    color: var(--muted);
    margin-bottom: 18px;
}
.category-card .text-link {
    margin-top: auto;
    justify-content: space-between;
    font-size: 10px;
}
.steps {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}
.step-number {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    background: var(--blue);
    color: var(--navy);
    font-weight: 800;
    font-size: 18px;
    border-radius: 5px;
    margin-bottom: 18px;
}
.steps > article:first-child .step-number {
    background: var(--orange);
    color: var(--ink);
}
.steps > article:last-child .step-number {
    background: var(--green);
    color: white;
}
.steps h3 {
    font-size: 16px;
    margin-bottom: 12px;
}
.steps p {
    font-size: 12px;
    color: var(--muted);
}
.quote-banner {
    background: var(--navy);
    padding: 45px;
    border-radius: 10px;
    color: white;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 45px;
}
.quote-banner h2 {
    color: white;
    font-size: 29px;
    margin-bottom: 15px;
}
.quote-banner p {
    font-size: 12px;
    max-width: 650px;
    color: #d7deeb;
    margin-bottom: 20px;
}
.quote-banner small {
    font-size: 10px;
    color: #c2cfdf;
}
.quote-banner .eyebrow {
    background: var(--orange);
    color: var(--ink);
    padding: 2px 6px;
    width: fit-content;
}
.quote-banner > .button {
    white-space: nowrap;
    min-width: 230px;
}

@media (max-width: 1200px) {
    
    
    
    
    
    
    
    
    
    .category-image {
        height: 150px;
    }
}
@media (max-width: 980px) {
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    .benefit-strip {
        grid-template-columns: repeat(2, 1fr);
    }
    .category-grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 12px;
    }
    .category-image {
        height: 135px;
    }
    .category-card-body {
        padding: 12px;
    }
    .category-card h3 {
        font-size: 12px;
    }
    .category-card p {
        font-size: 10px;
    }
    .quote-banner {
        padding: 30px;
        gap: 25px;
    }
    .quote-banner h2 {
        font-size: 24px;
    }
    .quote-banner > .button {
        min-width: 170px;
        font-size: 11px;
    }
}
@media (max-width: 700px) {
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    .benefit-strip {
        gap: 8px;
        padding-block: 13px;
    }
    .benefit-strip > div {
        padding: 11px;
        gap: 8px;
    }
    .benefit-strip .icon {
        width: 22px;
        height: 22px;
    }
    .benefit-strip b {
        font-size: 10px;
    }
    .benefit-strip small {
        font-size: 9px;
    }
    .category-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }
    .category-image {
        height: 145px;
    }
    .category-card-body {
        padding: 13px;
    }
    .category-card h3 {
        font-size: 13px;
    }
    .category-card p {
        font-size: 10px;
        margin-bottom: 14px;
    }
    .category-card .text-link {
        font-size: 9px;
    }
    .steps {
        grid-template-columns: 1fr;
        gap: 14px;
    }
    .steps .panel {
        padding: 22px;
    }
    .steps h3 {
        font-size: 16px;
    }
    .quote-banner {
        flex-direction: column;
        align-items: start;
        padding: 25px;
        gap: 22px;
    }
    .quote-banner h2 {
        font-size: 22px;
    }
    .quote-banner p {
        font-size: 11px;
    }
    .quote-banner > .button {
        width: 100%;
        font-size: 12px;
    }
    .quote-banner small {
        font-size: 9px;
    }
}

/* Online satış ana sayfası: ortak marka dili ve bölüm ayrımı. */
.storefront-home{--ink:#1d2938;--muted:#596777;--blue:#f4f6f3;background:#fff;color:var(--ink);font-family:Inter,system-ui,sans-serif}.storefront-home :is(h1,h2,h3,.store-hero-tiles strong){font-family:Inter,system-ui,sans-serif;letter-spacing:-.035em}.storefront-home h1{font-size:clamp(34px,3.5vw,52px);font-weight:750}.storefront-home h2{font-size:clamp(26px,2.7vw,36px);line-height:1.2}.storefront-home .section{padding-block:56px}.storefront-home .eyebrow{font-size:11px;letter-spacing:.1em}.storefront-home .muted{font-size:16px;line-height:1.75}.storefront-home .section-row{gap:24px;margin-bottom:28px}.storefront-home .section-row h2{margin-bottom:12px}.storefront-home .category-card{border-radius:12px;box-shadow:none}.storefront-home .category-image{height:auto;aspect-ratio:1.55;background:#f2f4f0}.storefront-home .category-image img{object-fit:contain}.storefront-home .category-card-body{padding:20px}.storefront-home .category-card h3{font-size:19px;line-height:1.3}.storefront-home .category-card p{font-size:14px;line-height:1.75;color:var(--muted)}.storefront-home .category-card .text-link{font-size:13px;min-height:44px}.store-home-featured{background:#f4f6f3;border-block:1px solid #e4e9e3}.store-home-process{background:#eef3ef;border-block:1px solid #dce5dd}.storefront-home .steps .panel{border-radius:12px;background:#fff;border-color:#dce5dd;padding:26px}.storefront-home .steps h3{font-size:21px;line-height:1.3}.storefront-home .steps p{font-size:15px;line-height:1.75;color:var(--muted)}.storefront-home .step-number{background:#ffecd1;color:#955000;border-radius:10px}.storefront-home .steps .panel:nth-child(2) .step-number{background:#e2eedf;color:#3e7045}.storefront-home .steps .panel:nth-child(3) .step-number{background:#d4eade;color:#246247}.storefront-home .store-home-showcase{margin-block:0;padding-block:40px}.store-home-showcase img{width:100%;height:auto;border-radius:14px}.storefront-home .quote-banner{background:#e0ebe2;color:#263e34;border:1px solid #cbd8cf;border-radius:14px}.storefront-home .quote-banner h2{color:#263e34}.storefront-home .quote-banner p{font-size:15px;line-height:1.75;color:#465d50}.storefront-home .quote-banner small{color:#50645a}.storefront-home .benefit-strip>div{background:#f4f6f3;border:1px solid #e2e8e1;border-radius:10px}.storefront-home .benefit-strip b{font-size:14px}.storefront-home .benefit-strip small{font-size:12px}
@media(max-width:1000px){.storefront-home .category-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.storefront-home .section{padding-block:36px}.storefront-home .section-row{align-items:flex-start;gap:16px}.storefront-home .category-card-body{padding:16px}.storefront-home .category-card h3{font-size:17px}.storefront-home .category-card p{font-size:13px}.storefront-home .category-grid{gap:14px}.storefront-home .steps{grid-template-columns:1fr}.storefront-home .store-home-showcase{padding-block:28px}.storefront-home .quote-banner{padding:26px}.storefront-home .muted{font-size:15px}}
@media(max-width:400px){.storefront-home .category-grid{grid-template-columns:1fr}}
@media(max-width:700px){.storefront-home .section-row{flex-direction:column;align-items:flex-start}.storefront-home .section-row>.button{align-self:flex-start}}

.storefront-home :is(.product-card-body,.category-card-body)>p{display:none}.storefront-home :is(.product-card,.category-card) h3{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.35;min-height:2.7em;margin-bottom:14px}.storefront-home .store-step-heading{display:flex;align-items:center;gap:12px;margin-bottom:12px}.storefront-home .store-step-heading h3{margin:0}.storefront-home .store-step-heading .step-number{display:grid;place-items:center;flex:0 0 42px;width:42px;height:42px;margin:0}.storefront-home .store-step-heading .icon{width:23px;height:23px}.storefront-home :is(.category-grid,.product-grid):focus-visible{outline:2px solid var(--orange);outline-offset:5px}
@media(max-width:700px){.storefront-home :is(.category-grid,.product-grid){display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:78%;gap:14px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;padding-bottom:12px;align-items:stretch}.storefront-home :is(.category-card,.product-card){scroll-snap-align:start;transform:none}.storefront-home .steps .panel{padding:20px}.storefront-home .store-step-heading{gap:10px;margin-bottom:10px}.storefront-home .steps h3{font-size:18px}.storefront-home .steps p{font-size:14px;line-height:1.6;margin:0}.storefront-home .store-step-heading .step-number{flex-basis:36px;width:36px;height:36px}.storefront-home .store-step-heading .icon{width:21px;height:21px}}
.store-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:48px;align-items:center;padding-block:48px 32px}.store-hero-copy h1{margin:0 0 18px;line-height:1.12;max-width:620px}.store-hero-copy h1 em{font-style:normal;white-space:nowrap;color:var(--orange-display)}.storefront-home .store-hero-copy>p{color:var(--muted);max-width:540px;margin-bottom:28px}.store-hero-actions{display:flex;flex-wrap:wrap;gap:12px}.store-hero-actions .button{font-size:15px;padding-inline:22px}.store-hero-tiles{display:grid;grid-template-columns:1.2fr 1fr;grid-template-rows:repeat(2,minmax(0,1fr));gap:14px;height:440px}.store-hero-tiles a{position:relative;overflow:hidden;border-radius:var(--zo-radius-card);background:var(--zo-sage)}.store-hero-tiles a:first-child{grid-row:span 2}.store-hero-tiles img{width:100%;height:100%;object-fit:cover;transition:transform .3s}.store-hero-tiles a:hover img{transform:scale(1.04)}.store-hero-tiles span{position:absolute;inset:auto 0 0;display:flex;flex-direction:column;gap:2px;padding:40px 18px 16px;background:linear-gradient(transparent,#101823d9);color:#fff}.store-hero-tiles small{font-size:11px;font-weight:700;letter-spacing:.08em;color:#ffd7a3}.store-hero-tiles strong{font-size:17px;line-height:1.3}
@media(max-width:980px){.store-hero{grid-template-columns:1fr;gap:28px}.store-hero-tiles{height:380px}}
@media(max-width:700px){.store-hero{padding-block:28px 20px}.store-hero-actions{display:grid;grid-template-columns:1fr}.store-hero-actions .button{width:100%}.store-hero-tiles{height:300px;gap:10px}.store-hero-tiles span{padding:32px 12px 12px}.store-hero-tiles strong{font-size:15px}}
@media(prefers-reduced-motion:reduce){.store-hero-tiles img{transition:none}}
@supports(scrollbar-width:thin){@media(max-width:700px){.storefront-home :is(.category-grid,.product-grid){scrollbar-width:thin}}}
/* Kategori kartları tam satırlara sığmadığında son satır ortalanır; yarım ve sağı boş bir ızgara kalmaz. */
@media(min-width:701px){.storefront-home .category-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:20px}.storefront-home .category-grid>.category-card{flex:0 0 calc((100% - 60px)/4)}}
@media(min-width:701px) and (max-width:1000px){.storefront-home .category-grid{gap:14px}.storefront-home .category-grid>.category-card{flex-basis:calc((100% - 14px)/2)}}

/* Promosyon ve popüler ürünler: masaüstünde dört sütun, dar ekranlarda iki sütun. */
.storefront-home .promotion-grid,
.storefront-home .store-home-featured .product-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
}
.storefront-home .promotion-grid > .category-card { min-width: 0; }
.storefront-home .promotion-grid .category-card-body p:empty { display: none; }
.store-home-all-products { display: flex; justify-content: center; margin-top: 32px; }
@media (max-width: 1000px) {
    .storefront-home .promotion-grid,
    .storefront-home .store-home-featured .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
}
@media (max-width: 700px) {
    .storefront-home .store-home-featured .product-grid { grid-auto-flow: row; grid-auto-columns: auto; overflow: visible; padding-bottom: 0; }
    .storefront-home .promotion-grid .category-card-body { padding: 12px; }
    .storefront-home .promotion-grid .category-card h3 { font-size: 15px; }
    .storefront-home .promotion-grid .text-link { font-size: 11px; }
}