/*==================================================
MAISON CINNAMONN
COLLECTIONS
==================================================*/


/*==================================================
HERO
==================================================*/

.collections-hero{

    background:var(--color-background);

    padding-top:180px;

}

.collections-heading{

    width:min(900px,90%);

    margin:0 auto;

    text-align:center;

}

.collections-heading h1{

    margin:20px 0 25px;

}

.collections-heading p{

    font-family:var(--font-serif);

    font-size:2rem;

    color:var(--color-text);

}

.collections-hero-image{

    width:min(1750px,95%);

    margin:120px auto 0;

    overflow:hidden;

}

.collections-hero-image img{

    width:100%;

    height:88vh;

    min-height:720px;

    object-fit:cover;

}



/*==================================================
EDITORIAL INTRO
==================================================*/

.editorial-intro{

    padding:220px 0;

    background:var(--color-background);

}

.editorial-intro .container-sm{

    width:min(900px,90%);

    margin:auto;

    text-align:center;

}

.editorial-intro h2{

    max-width:820px;

    margin:0 auto;

}

.editorial-intro p{

    max-width:560px;

    margin:40px auto 0;

}

/*==================================================
CHAPTERS
==================================================*/

.chapter{

    width:min(1750px,94%);

    margin:0 auto;

    padding:220px 0;

}

.chapter-image{

    width:100%;

    overflow:hidden;

}

.chapter-image img{

    width:100%;

    height:90vh;

    min-height:760px;

    object-fit:cover;

    transition:transform 8s ease;

}

.chapter:hover .chapter-image img{

    transform:scale(1.02);

}


/*==================================================
CONTENT
==================================================*/

.chapter-content{

    width:min(520px,90%);

    margin:90px auto 0;

    text-align:center;

}

.chapter-number{

    display:block;

    margin-bottom:18px;

    font-family:var(--font-sans);

    font-size:.68rem;

    letter-spacing:.45em;

    text-transform:uppercase;

    color:var(--color-accent);

}

.chapter-content h2{

    margin-bottom:24px;

}

.chapter-content p{

    max-width:420px;

    margin:0 auto 42px;

}

.chapter-content a{

    display:inline-block;

    font-family:var(--font-sans);

    font-size:.70rem;

    letter-spacing:.32em;

    text-transform:uppercase;

    padding-bottom:8px;

    border-bottom:1px solid var(--color-border);

    transition:var(--transition);

}

.chapter-content a:hover{

    opacity:.55;

}

/*==================================================
EDITORIAL CLOSING
==================================================*/

.editorial-closing{

    padding:260px 0;

    background:var(--color-surface);

}

.editorial-closing .container-sm{

    width:min(900px,90%);

    margin:auto;

    text-align:center;

}

.editorial-closing h2{

    max-width:820px;

    margin:22px auto 35px;

}

.editorial-closing p{

    max-width:560px;

    margin:0 auto 60px;

}

.editorial-closing .consultation-button{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:18px 46px;

    border:1px solid var(--color-border);

    font-family:var(--font-sans);

    font-size:.70rem;

    letter-spacing:.35em;

    text-transform:uppercase;

    transition:var(--transition);

}

.editorial-closing .consultation-button:hover{

    background:var(--color-text);

    color:#FFF;

}



/*==================================================
RESPONSIVE
==================================================*/

@media(max-width:1200px){

.collections-hero{

padding-top:150px;

}

.collections-hero-image img{

height:70vh;

min-height:600px;

}

.chapter{

padding:170px 0;

}

.chapter-image img{

height:70vh;

min-height:560px;

}

}



@media(max-width:768px){

.collections-hero{

padding-top:120px;

}

.collections-heading{

width:92%;

}

.collections-heading p{

font-size:1.5rem;

}

.collections-hero-image{

margin-top:70px;

}

.collections-hero-image img{

height:60vh;

min-height:420px;

}

.editorial-intro{

padding:120px 0;

}

.editorial-intro p{

margin-top:28px;

}

.chapter{

padding:120px 0;

}

.chapter-image img{

height:420px;

min-height:420px;

}

.chapter-content{

margin-top:60px;

width:92%;

}

.editorial-closing{

padding:140px 0;

}

}