/* =====================================================
   ZLATO Z OLIV – O NÁS V4
   Hero + Náš příběh
   ===================================================== */

body.zzo-about-page,
body:has(.zzo-about){
    background:#fffdf8;
}

/* Stránka přes celou šířku */
body.zzo-about-page .content-wrapper,
body.zzo-about-page .content-wrapper-in,
body.zzo-about-page .content,
body.zzo-about-page .content-inner,
body.zzo-about-page #content,
body:has(.zzo-about) .content-wrapper,
body:has(.zzo-about) .content-wrapper-in,
body:has(.zzo-about) .content,
body:has(.zzo-about) .content-inner,
body:has(.zzo-about) #content{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    float:none!important;
}

/* Schovat sidebar/breadcrumbs */
body.zzo-about-page .breadcrumbs,
body.zzo-about-page .sidebar,
body.zzo-about-page aside.sidebar,
body.zzo-about-page .content-wrapper-in > aside,
body:has(.zzo-about) .breadcrumbs,
body:has(.zzo-about) .sidebar,
body:has(.zzo-about) aside.sidebar,
body:has(.zzo-about) .content-wrapper-in > aside{
    display:none!important;
}

/* Schovat systémový nadpis stránky */
body.zzo-about-page .content-inner > h1,
body.zzo-about-page #content > h1,
body.zzo-about-page .content > h1,
body:has(.zzo-about) .content-inner > h1,
body:has(.zzo-about) #content > h1,
body:has(.zzo-about) .content > h1{
    display:none!important;
}

/* Schovat Shoptet diskuzi / komentáře */
body.zzo-about-page .discussion,
body.zzo-about-page #discussion,
body.zzo-about-page .discussion-wrapper,
body.zzo-about-page .comments,
body.zzo-about-page #comments,
body.zzo-about-page .add-comment,
body.zzo-about-page .rate-wrapper,
body:has(.zzo-about) .discussion,
body:has(.zzo-about) #discussion,
body:has(.zzo-about) .discussion-wrapper,
body:has(.zzo-about) .comments,
body:has(.zzo-about) #comments,
body:has(.zzo-about) .add-comment,
body:has(.zzo-about) .rate-wrapper{
    display:none!important;
}

/* Vlastní stránka */
.zzo-about{
    width:100%;
    margin:0;
    padding:0;
    background:#fffdf8;
    color:#253511;
    overflow:hidden;
}

.zzo-about *,
.zzo-about *:before,
.zzo-about *:after{
    box-sizing:border-box;
}

.zzo-about-container{
    width:min(1180px, calc(100% - 60px));
    margin:0 auto;
}

/* HERO */
.zzo-about-hero{
    position:relative;
    min-height:430px;
    display:flex;
    align-items:center;
    background:url("/user/documents/o-nas-hero.jpg") center 53% / cover no-repeat;
    overflow:hidden;
}

.zzo-about-hero-overlay{
    position:absolute;
    inset:0;
    background:linear-gradient(
        90deg,
        rgba(18,31,11,.88) 0%,
        rgba(18,31,11,.72) 34%,
        rgba(18,31,11,.28) 62%,
        rgba(18,31,11,.05) 100%
    );
}

.zzo-about-hero .zzo-about-container{
    position:relative;
    z-index:2;
}

.zzo-about-hero-content{
    width:520px;
    max-width:100%;
    padding:70px 0;
}

.zzo-about-eyebrow{
    margin-bottom:5px;
    color:#c9a442;
    font-family:Georgia,"Times New Roman",serif;
    font-size:25px;
    line-height:1.2;
}

.zzo-about-hero h1{
    margin:0 0 18px;
    color:#fff!important;
    font-family:Georgia,"Times New Roman",serif;
    font-size:64px!important;
    line-height:1.02!important;
    font-weight:400!important;
    letter-spacing:-1.5px;
}

.zzo-about-hero p{
    margin:0;
    color:#e0bc57!important;
    font-size:20px;
    line-height:1.5;
    font-weight:500;
}

.zzo-about-ornament{
    width:190px;
    margin-top:24px;
    display:flex;
    align-items:center;
    gap:10px;
    color:#c9a442;
}

.zzo-about-ornament span{
    height:1px;
    flex:1;
    background:#c9a442;
}

.zzo-about-ornament strong{
    font-size:25px;
    line-height:1;
    font-weight:400;
}

/* NÁŠ PŘÍBĚH */
.zzo-about-story{
    padding:64px 0 40px;
    background:#fffdf8;
}

.zzo-about-story-grid{
    display:grid;
    grid-template-columns:minmax(320px, 1fr) minmax(380px, 1.12fr);
    align-items:stretch;
    background:#fffdf8;
}

.zzo-about-story-text{
    padding:46px 44px 46px 8px;
}

.zzo-about-story-text h2{
    margin:0 0 26px;
    color:#253511;
    font-family:Georgia,"Times New Roman",serif;
    font-size:56px;
    line-height:1.05;
    font-weight:400;
    letter-spacing:-.8px;
}

.zzo-about-story-text p{
    margin:0 0 22px;
    color:#2f3726;
    font-size:22px;
    line-height:1.65;
    font-weight:400;
}

.zzo-about-story-text p strong{
    font-weight:700;
    color:#253511;
}

.zzo-about-story-media{
    min-height:520px;
    overflow:hidden;
    border-radius:2px;
    box-shadow:0 18px 40px rgba(39,48,25,.10);
}

.zzo-about-story-media img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
}

/* RESPONSIVE */
@media (max-width:991px){
    .zzo-about-story{
        padding:46px 0 26px;
    }

    .zzo-about-story-grid{
        grid-template-columns:1fr;
        gap:24px;
    }

    .zzo-about-story-text{
        padding:0;
    }

    .zzo-about-story-text h2{
        font-size:42px;
        margin-bottom:20px;
    }

    .zzo-about-story-text p{
        font-size:18px;
        line-height:1.7;
        margin-bottom:18px;
    }

    .zzo-about-story-media{
        min-height:380px;
    }
}

@media (max-width:767px){
    .zzo-about-container{
        width:calc(100% - 36px);
    }

    .zzo-about-hero{
        min-height:400px;
        background-position:62% center;
    }

    .zzo-about-hero-overlay{
        background:linear-gradient(
            90deg,
            rgba(18,31,11,.92) 0%,
            rgba(18,31,11,.75) 64%,
            rgba(18,31,11,.38) 100%
        );
    }

    .zzo-about-hero-content{
        width:100%;
        padding:65px 0;
    }

    .zzo-about-eyebrow{
        font-size:20px;
    }

    .zzo-about-hero h1{
        font-size:45px!important;
    }

    .zzo-about-hero p{
        font-size:17px;
    }

    .zzo-about-story{
        padding:40px 0 18px;
    }

    .zzo-about-story-text h2{
        font-size:36px;
    }

    .zzo-about-story-text p{
        font-size:17px;
        line-height:1.68;
    }

    .zzo-about-story-media{
        min-height:300px;
    }
}


/* =====================================================
   NECHCEME MÍT VŠECHNO / HODNOTY
   ===================================================== */

.zzo-about-values{
    position:relative;
    padding:58px 0 54px;
    background:
        radial-gradient(circle at 12% 20%, rgba(201,164,66,.08), transparent 28%),
        linear-gradient(135deg,#16250d 0%,#203513 55%,#13220c 100%);
    color:#fff;
    overflow:hidden;
}

.zzo-about-values:before{
    content:"";
    position:absolute;
    inset:0;
    opacity:.08;
    pointer-events:none;
    background-image:
        radial-gradient(circle at 20px 20px, #c9a442 1px, transparent 1.4px);
    background-size:34px 34px;
}

.zzo-about-values .zzo-about-container{
    position:relative;
    z-index:1;
}

.zzo-about-values-grid{
    display:grid;
    grid-template-columns:minmax(300px,.95fr) minmax(560px,1.65fr);
    gap:56px;
    align-items:center;
}

.zzo-about-values-intro{
    padding-right:16px;
}

.zzo-about-values-intro h2{
    margin:0 0 24px;
    color:#d4ad48!important;
    font-family:Georgia,"Times New Roman",serif;
    font-size:42px!important;
    line-height:1.13!important;
    font-weight:400!important;
    letter-spacing:-.4px;
}

.zzo-about-values-intro p{
    margin:0 0 16px;
    color:#f4f0e7!important;
    font-size:17px;
    line-height:1.7;
}

.zzo-about-values-items{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    align-items:stretch;
}

.zzo-about-value{
    position:relative;
    padding:8px 20px 4px;
    text-align:center;
}

.zzo-about-value + .zzo-about-value{
    border-left:1px solid rgba(201,164,66,.45);
}

.zzo-about-value-icon{
    width:58px;
    height:58px;
    margin:0 auto 15px;
    color:#d4ad48;
}

.zzo-about-value-icon svg{
    width:100%;
    height:100%;
    display:block;
    fill:none;
    stroke:currentColor;
    stroke-width:2;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.zzo-about-value h3{
    margin:0 0 10px;
    color:#fff!important;
    font-family:Georgia,"Times New Roman",serif;
    font-size:20px!important;
    line-height:1.2!important;
    font-weight:600!important;
}

.zzo-about-value p{
    margin:0;
    color:#ece7db!important;
    font-size:14px;
    line-height:1.55;
}

@media (max-width:1100px){
    .zzo-about-values-grid{
        grid-template-columns:1fr;
        gap:38px;
    }

    .zzo-about-values-intro{
        max-width:760px;
        padding-right:0;
    }
}

@media (max-width:767px){
    .zzo-about-values{
        padding:44px 0 38px;
    }

    .zzo-about-values-intro h2{
        font-size:34px!important;
    }

    .zzo-about-values-intro p{
        font-size:16px;
    }

    .zzo-about-values-items{
        grid-template-columns:1fr 1fr;
        gap:26px 0;
    }

    .zzo-about-value{
        padding:4px 16px;
    }

    .zzo-about-value:nth-child(3){
        border-left:0;
    }
}

@media (max-width:520px){
    .zzo-about-values-items{
        grid-template-columns:1fr;
    }

    .zzo-about-value,
    .zzo-about-value + .zzo-about-value,
    .zzo-about-value:nth-child(3){
        border-left:0;
    }

    .zzo-about-value + .zzo-about-value{
        border-top:1px solid rgba(201,164,66,.35);
        padding-top:24px;
    }
}


/* =====================================================
   V6 – oprava ikon + lepší šířka levého titulku
   ===================================================== */

.zzo-about-values-grid{
    grid-template-columns:minmax(410px,1.15fr) minmax(650px,1.85fr);
    gap:48px;
}

.zzo-about-values-intro h2{
    font-size:38px!important;
    line-height:1.12!important;
}

.zzo-about-value-icon svg{
    display:none!important;
}

.zzo-about-value-icon{
    width:58px;
    height:58px;
    background-position:center;
    background-repeat:no-repeat;
    background-size:58px 58px;
}

.zzo-about-value:nth-child(1) .zzo-about-value-icon{
    background-image:url("/user/documents/vyber.svg");
}

.zzo-about-value:nth-child(2) .zzo-about-value-icon{
    background-image:url("/user/documents/kvalita.svg");
}

.zzo-about-value:nth-child(3) .zzo-about-value-icon{
    background-image:url("/user/documents/chut.svg");
}

.zzo-about-value:nth-child(4) .zzo-about-value-icon{
    background-image:url("/user/documents/duvera.svg");
}

@media (max-width:1100px){
    .zzo-about-values-grid{
        grid-template-columns:1fr;
    }
}