/* ======================================================
   MIRKA ABOUT PAGE V1
   ====================================================== */

body.mirka-about-active{
    background:#f2ede1 !important;
    color:#28271f !important;
}

.mirka-about-page{
    width:min(1540px,calc(100% - 48px));
    margin:0 auto;
    background:#f2ede1;
}


/* HERO */

.mirka-about-hero{
    position:relative;
    min-height:610px;

    display:flex;
    align-items:center;

    background-position:center;
    background-size:cover;
    background-repeat:no-repeat;

    overflow:hidden;
}

.mirka-about-hero__shade{
    position:absolute;
    inset:0;

    background:
        linear-gradient(
            90deg,
            rgba(33,30,23,.60),
            rgba(33,30,23,.14) 60%,
            rgba(33,30,23,.04)
        );
}

.mirka-about-hero__copy{
    position:relative;
    z-index:2;

    width:min(430px,45%);

    margin-right:8%;
    color:#fff;
}

.mirka-about-hero__copy > span{
    display:block;
    margin-bottom:16px;

    font-size:10px;
    letter-spacing:.34em;
}

.mirka-about-hero__copy h1{
    margin:0 0 15px;

    font-size:54px;
    line-height:1.1;
    font-weight:400;
}

.mirka-about-hero__copy p{
    max-width:350px;
    margin:0;

    font-size:13px;
    line-height:2;
}


/* STORY */

.mirka-about-story{
    display:grid;
    grid-template-columns:.92fr 1.08fr;
    gap:70px;

    padding:72px 7%;
}

.mirka-about-story__copy h2,
.mirka-about-founder__copy h2,
.mirka-about-section-title h2{
    margin:5px 0 19px;

    font-size:36px;
    line-height:1.35;
    font-weight:400;
}

.mirka-about-eyebrow{
    display:block;

    color:#8d7960;
    font-size:10px;
    letter-spacing:.15em;
}

.mirka-about-story__copy > p,
.mirka-about-richtext{
    font-size:13px;
    line-height:2.05;
    color:#4f4b41;
}

.mirka-about-story__columns{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:28px;

    margin-top:27px;
}

.mirka-about-story__columns p{
    margin:0;

    font-size:11px;
    line-height:2;
    color:#625e54;
}

.mirka-about-story__gallery{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
}

.mirka-about-story__gallery img{
    width:100%;
    height:250px;

    display:block;
    object-fit:cover;
}

.mirka-about-story__gallery img:nth-child(3){
    height:330px;
}

.mirka-about-story__gallery img:nth-child(4){
    height:220px;
}


/* FOUNDER */

.mirka-about-founder{
    display:grid;
    grid-template-columns:1.4fr .72fr;
    gap:48px;
    align-items:center;

    padding:35px 7% 85px;
}

.mirka-about-founder__visuals{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
}

.mirka-about-founder__visuals img{
    width:100%;
    height:480px;

    object-fit:cover;
}

.mirka-about-founder__copy{
    padding-right:18px;
}

.mirka-about-founder__copy p{
    margin:0 0 13px;

    color:#58544a;

    font-size:12px;
    line-height:2;
}


/* CATEGORY SECTION */

.mirka-about-categories{
    padding:75px 7% 82px;
    border-top:1px solid rgba(70,67,57,.12);
}

.mirka-about-section-title{
    max-width:690px;

    margin:0 auto 35px;

    text-align:center;
}

.mirka-about-section-title > span{
    font-size:10px;
    letter-spacing:.26em;
    color:#8c8376;
}

.mirka-about-section-title p{
    margin:0;

    color:#777064;

    font-size:12px;
    line-height:1.9;
}

.mirka-about-category-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:16px;
}

.mirka-about-category-card{
    display:block;

    color:#29271f;
    text-decoration:none;

    background:#ece5d7;

    overflow:hidden;
}

.mirka-about-category-card__image{
    overflow:hidden;
}

.mirka-about-category-card__image img{
    display:block;

    width:100%;
    height:390px;

    object-fit:cover;

    transition:transform .5s ease;
}

.mirka-about-category-card:hover img{
    transform:scale(1.025);
}

.mirka-about-category-card__copy{
    padding:18px 18px 21px;
}

.mirka-about-category-card__copy h3{
    margin:0 0 8px;

    font-size:18px;
    font-weight:500;
}

.mirka-about-category-card__copy p{
    min-height:42px;

    margin:0 0 12px;

    color:#6e685d;

    font-size:10px;
    line-height:1.9;
}

.mirka-about-category-card__copy span{
    display:inline-block;

    padding-bottom:3px;

    border-bottom:1px solid #4b493f;

    font-size:10px;
}


/* ETHOS */

.mirka-about-ethos{
    padding:72px 7% 90px;

    background:#eee7da;
}

.mirka-about-ethos-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:45px;
}

.mirka-about-ethos-grid article{
    border-top:1px solid rgba(53,51,43,.27);

    padding-top:18px;
}

.mirka-about-ethos-grid article > span{
    color:#a88b5d;

    font-size:10px;
    letter-spacing:.12em;
}

.mirka-about-ethos-grid h3{
    margin:15px 0 9px;

    font-size:17px;
    font-weight:500;
}

.mirka-about-ethos-grid p{
    margin:0;

    color:#666055;

    font-size:11px;
    line-height:2;
}


/* BANNER */

.mirka-about-banner{
    position:relative;

    min-height:340px;

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

    background-size:cover;
    background-position:center;

    color:#fff;

    text-align:center;
}

.mirka-about-banner__overlay{
    position:absolute;
    inset:0;

    background:rgba(42,45,27,.62);
}

.mirka-about-banner__copy{
    position:relative;
    z-index:2;

    width:min(600px,90%);
}

.mirka-about-banner__copy > span{
    font-size:10px;
    letter-spacing:.3em;
}

.mirka-about-banner__copy h2{
    margin:12px 0 8px;

    font-size:36px;
    font-weight:400;
}

.mirka-about-banner__copy p{
    margin:0 auto 20px;

    font-size:11px;
    line-height:2;
}

.mirka-about-banner__copy a{
    display:inline-flex;

    min-height:38px;

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

    padding:0 24px;

    border:1px solid rgba(255,255,255,.75);

    color:#fff;

    text-decoration:none;

    font-size:10px;
}


/* TABLET */

@media(max-width:1000px){

    .mirka-about-page{
        width:calc(100% - 32px);
    }

    .mirka-about-story{
        gap:35px;
        padding-inline:4%;
    }

    .mirka-about-founder{
        gap:30px;
        padding-inline:4%;
    }

    .mirka-about-categories,
    .mirka-about-ethos{
        padding-inline:4%;
    }

}


/* MOBILE */

@media(max-width:767px){

    .mirka-about-page{
        width:100%;
    }

    .mirka-about-hero{
        min-height:480px;
        background-position:center;
    }

    .mirka-about-hero__shade{
        background:
            linear-gradient(
                0deg,
                rgba(30,29,23,.58),
                rgba(30,29,23,.12)
            );
    }

    .mirka-about-hero__copy{
        width:calc(100% - 40px);

        margin:0 20px;

        align-self:flex-end;

        padding-bottom:42px;
    }

    .mirka-about-hero__copy h1{
        font-size:42px;
    }

    .mirka-about-story,
    .mirka-about-founder{
        display:flex;
        flex-direction:column;

        padding:50px 18px;
    }

    .mirka-about-story__columns{
        grid-template-columns:1fr;
        gap:12px;
    }

    .mirka-about-story__gallery{
        gap:6px;
    }

    .mirka-about-story__gallery img,
    .mirka-about-story__gallery img:nth-child(3),
    .mirka-about-story__gallery img:nth-child(4){
        height:190px;
    }

    .mirka-about-founder__visuals{
        gap:6px;
    }

    .mirka-about-founder__visuals img{
        height:300px;
    }

    .mirka-about-founder__copy{
        padding:0;
    }

    .mirka-about-story__copy h2,
    .mirka-about-founder__copy h2,
    .mirka-about-section-title h2{
        font-size:28px;
    }

    .mirka-about-categories,
    .mirka-about-ethos{
        padding:50px 18px;
    }

    .mirka-about-category-grid{
        grid-template-columns:1fr;
        gap:22px;
    }

    .mirka-about-category-card__image img{
        height:390px;
    }

    .mirka-about-ethos-grid{
        grid-template-columns:1fr;
        gap:30px;
    }

    .mirka-about-banner{
        min-height:290px;
    }

    .mirka-about-banner__copy h2{
        font-size:28px;
    }

}

/* /MIRKA ABOUT PAGE V1 */

/* ======================================================
   MIRKA ABOUT HEADER SAFETY FIX V1.1
   ====================================================== */

body.mirka-about-active .mirka-shop-header{
    width:100% !important;
    max-width:none !important;
}

body.mirka-about-active .mirka-shop-header svg{
    width:20px !important;
    height:20px !important;
    max-width:20px !important;
    max-height:20px !important;
    display:block !important;
    overflow:visible !important;
    fill:none !important;
    stroke:currentColor !important;
    stroke-width:1.5 !important;
}

body.mirka-about-active .mirka-shop-icon{
    width:40px !important;
    height:40px !important;
    min-width:40px !important;
    max-width:40px !important;
    min-height:40px !important;
    max-height:40px !important;

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

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

    border-radius:50% !important;
    box-sizing:border-box !important;
}

body.mirka-about-active .mirka-shop-brand{
    width:auto !important;
    height:auto !important;
    max-width:none !important;

    display:flex !important;
    align-items:center !important;
    flex-direction:row !important;
    gap:12px !important;
}

body.mirka-about-active .mirka-shop-brand__circle{
    width:58px !important;
    height:58px !important;
    min-width:58px !important;
    max-width:58px !important;
    min-height:58px !important;
    max-height:58px !important;

    flex:0 0 58px !important;

    overflow:hidden !important;
    border-radius:50% !important;
}

body.mirka-about-active .mirka-shop-brand__circle img{
    display:block !important;

    width:58px !important;
    height:58px !important;
    min-width:58px !important;
    max-width:58px !important;

    object-fit:cover !important;
}

body.mirka-about-active .mirka-shop-brand__text{
    width:auto !important;
    height:auto !important;

    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
}

body.mirka-about-active .mirka-shop-brand__text strong{
    font-size:16px !important;
    line-height:1 !important;
}

body.mirka-about-active .mirka-shop-brand__text small{
    font-size:8px !important;
    line-height:1 !important;
}

body.mirka-about-active .mirka-shop-actions{
    display:flex !important;
    align-items:center !important;
    gap:8px !important;
}

/* mobile */
@media(max-width:767px){

    body.mirka-about-active .mirka-shop-brand__circle,
    body.mirka-about-active .mirka-shop-brand__circle img{
        width:48px !important;
        height:48px !important;
        min-width:48px !important;
        max-width:48px !important;
    }

    body.mirka-about-active .mirka-shop-brand__circle{
        flex-basis:48px !important;
    }

    body.mirka-about-active .mirka-shop-icon{
        width:38px !important;
        height:38px !important;
        min-width:38px !important;
        max-width:38px !important;
        min-height:38px !important;
        max-height:38px !important;
    }

}

/* /MIRKA ABOUT HEADER SAFETY FIX V1.1 */
