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

.collections-hero{

    padding:0;

    background:var(--rose-tint);

}

.collections-hero-inner{

    display:grid;

    grid-template-columns:1fr 1.25fr;

    align-items:center;

    min-height:460px;

}

/* Wider than the shared split-hero padding (60px sides, not 55px).
   Because this overrides the shared desktop value, it must also
   restate the shared responsive steps below (1200/768) itself -
   common.css's media-gated rule cannot win a specificity tie against
   this file's unconditional one, since this stylesheet loads after
   common.css regardless of viewport width. */
.collections-hero-text{

    padding:70px 60px 70px max(40px, calc((100vw - 1200px) / 2 + 20px));

}

.collections-hero-text p{

    max-width:420px;

}

.collections-hero-image{

    height:100%;

    min-height:460px;

}

/*=========================================================
EXPLORE COLLECTIONS
=========================================================*/

.collections-explore{

    padding:70px 0 80px;

}

.collections-explore .section-heading{

    text-align:center;

    margin-bottom:55px;

}

.collections-explore .section-heading h2{

    font-family:Inter,sans-serif;

    font-size:13px;

    font-weight:600;

    letter-spacing:2px;

    text-transform:uppercase;

    color:#3f302d;

    margin-bottom:12px;

}

.collections-explore .section-divider{

    margin:0 auto;

}

.collections-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:40px;

}

.collection-card{

    display:flex;

    flex-direction:column;

}

.collection-image{

    margin-bottom:24px;

    overflow:hidden;

    border-radius:2px;

    aspect-ratio:3/4;

}

.collection-image img{

    width:100%;

    height:100%;

    object-fit:cover;

    display:block;

}

.collection-content{

    flex:1;

    display:flex;

    flex-direction:column;

}

.collection-number{

    display:block;

    font-size:12px;

    letter-spacing:1.5px;

    color:#b77b6b;

    margin-bottom:12px;

    font-weight:600;

}

.collection-card h3{

    font-size:24px;

    font-weight:600;

    line-height:1.3;

    margin-bottom:14px;

    color:#2f2927;

}

.collection-card p{

    font-size:14px;

    line-height:1.7;

    color:#6b645f;

    margin-bottom:18px;

    flex:1;

}

/*=========================================================
CLOSING CTA
=========================================================*/

.collections-cta{

    padding:60px 0 80px;

}

/* Rose-tinted band: small image | heading+button | 3-item list */
.cta-band{

    display:grid;

    grid-template-columns:auto 1fr auto;

    align-items:center;

    gap:40px;

    background:#f2e5df;

    margin-bottom:50px;

    overflow:hidden;

}

.cta-band-image{

    width:160px;

    align-self:stretch;

    flex-shrink:0;

}

.cta-band-image img{

    width:100%;

    height:100%;

    object-fit:cover;

    display:block;

}

.cta-band-content{

    padding:28px 0;

}


.cta-band-content h3{

    font-size:20px;

    line-height:1.5;

    color:#2f2927;

    margin-bottom:18px;

    font-weight:400;

    max-width:420px;

}

.cta-band-content .btn-primary{

    display:inline-block;

}

.cta-band-list{

    display:flex;

    flex-direction:column;

    gap:14px;

    padding:28px 40px 28px 40px;

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

}

.band-list-item{

    display:flex;

    align-items:center;

    gap:12px;

}

.band-list-item img{

    width:22px;

    height:22px;

    flex-shrink:0;

    opacity:.8;

}

.band-list-item span{

    font-size:14px;

    color:#3f302d;

    white-space:nowrap;

}

/* Plain feature row below the band */
.features-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:40px;

    padding-top:40px;

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

}

.features-grid .feature-item{

    text-align:center;

    position:relative;

}

.features-grid .feature-item:not(:last-child)::after{

    content:"";

    position:absolute;

    right:-20px;

    top:6px;

    width:1px;

    height:55px;

    background:var(--border);

}

.features-grid .feature-item img{

    width:32px;

    height:32px;

    margin:0 auto 18px;

}

.features-grid .feature-item h4{

    font-size:14px;

    font-weight:600;

    line-height:1.4;

    margin-bottom:8px;

    color:#2f2927;

}

.features-grid .feature-item p{

    font-size:12px;

    line-height:1.6;

    color:#6b645f;

    margin:0;

}

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

@media(max-width:1200px){

.collections-hero-text{

    padding:60px 40px;

}

}

@media(max-width:992px){

.collections-hero-inner{

    grid-template-columns:1fr;

}

.collections-hero-image{

    min-height:320px;

    order:-1;

}

.cta-band{

    grid-template-columns:1fr;

    text-align:center;

    gap:0;

}

.cta-band-image{

    width:100%;

    height:220px;

}

.cta-band-content{

    padding:28px 32px;

}

.cta-band-content h3{

    max-width:none;

}

.cta-band-list{

    padding:24px 32px 32px;

    border-left:none;

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

    align-items:center;

}

.band-list-item{

    justify-content:center;

}

.features-grid{

    grid-template-columns:repeat(2,1fr);

    gap:30px;

}

.features-grid .feature-item:nth-child(2)::after{

    display:none;

}

}

@media(max-width:992px){

.collections-grid{

    grid-template-columns:repeat(2,1fr);

    gap:32px;

}

}

@media(max-width:768px){

.collections-hero-text{

    padding:45px 20px;

}

.collections-grid{

    grid-template-columns:1fr;

    gap:28px;

}


.cta-band{

    margin-bottom:40px;

}

.cta-band-image{

    height:180px;

}

.cta-band-content{

    padding:20px;

}

.cta-band-content h3{

    font-size:18px;

}

.cta-band-list{

    padding:16px 20px 20px;

}

.features-grid{

    grid-template-columns:1fr;

    gap:24px;

    padding-top:30px;

}

.features-grid .feature-item::after{

    display:none;

}

}