/* 2026-10-13 v1.1
 * - Overrode the global `* + p` 5px margin so the intro keeps its designed spacing.
 * 2026-10-13 v1.0
 * - Added the full-width Collection closing feature based on the lead homepage hero slide.
 */

.collection-feature { position:relative; display:flex; align-items:flex-end; width:100%; min-height:560px; margin-top:0; overflow:hidden; isolation:isolate; background:#25201d; }
.collection-feature-image { position:absolute; z-index:0; inset:0; display:block; width:100%; height:100%; object-fit:cover; object-position:70% 50%; filter:saturate(.78) contrast(1.05) brightness(.88); }
.collection-feature-gradient { position:absolute; z-index:1; inset:0; pointer-events:none; background:linear-gradient(90deg,rgba(6,4,4,.88),rgba(6,4,4,.58) 45%,rgba(6,4,4,.1)); }
.collection-feature-copy { position:relative; z-index:2; box-sizing:border-box; width:min(1480px,calc(100vw - 80px)); margin:0 auto; padding:120px 0 80px; }
.collection-feature .collection-feature-kicker { margin:0 0 16px; color:#d0c2b6!important; font:700 11px/1.3 "avenir-lt-pro",sans-serif; letter-spacing:.16em; }
.collection-feature h2 { max-width:880px; margin:0; color:#f6f3ec!important; font-family:'Reem Kufi',sans-serif; font-size:clamp(40px,4.4vw,64px); font-weight:300; line-height:1.02; letter-spacing:.035em; text-transform:uppercase; }
.collection-feature .collection-feature-intro { max-width:620px; margin:20px 0 0!important; color:#f6f3ec!important; font:400 18px/1.5 "avenir-lt-pro",sans-serif; }
.collection-feature-actions { display:flex; gap:12px; margin-top:28px; }
.collection-feature-actions .button { display:flex; justify-content:space-between; gap:clamp(22px,3vw,42px); max-width:100%; color:#f6f3ec!important; border-color:rgba(246,243,236,.7)!important; }

@media only screen and (max-width: 767px) {
    .collection-feature { min-height:600px; }
    .collection-feature-image { object-position:78% 30%; }
    .collection-feature-gradient { background:linear-gradient(0deg,rgba(6,4,4,.92),rgba(6,4,4,.6) 45%,rgba(6,4,4,.08)); }
    .collection-feature-copy { width:calc(100vw - 40px); padding:120px 0 48px; }
    .collection-feature h2 { font-size:clamp(34px,10vw,44px); }
    .collection-feature .collection-feature-intro { margin-top:14px!important; font-size:16px; line-height:1.4; }
    .collection-feature-actions { margin-top:24px; }
    .collection-feature-actions .button:is(a, button) { flex:1 1 auto; min-height:48px; padding:0 18px; gap:16px; font-size:12px; }
}