.lux-feature-container { padding-top: 15px; }
.lux-feature-heading { align-items: flex-end; gap: 24px; margin: 0 0 26px; }
.lux-feature-eyebrow { display: block; margin-bottom: 10px; color: #88652f; font-size: 10px; font-weight: 600; letter-spacing: .19em; }
.lux-feature-heading h2 { max-width: 650px; font-size: clamp(22px, 2.2vw, 32px); font-weight: 500; letter-spacing: -.035em; line-height: 1.3; }
.lux-feature-container .lux-rail-controls button { width: 42px; height: 42px; background: #651d32; color: #ffe7ac; border-color: #651d32; transition: background .2s; }
.lux-feature-container .lux-rail-controls button:hover { background: #4b1424; color: #ffe7ac; }
.lux-feature-container .lux-rail-controls button:first-child svg { transform: rotate(180deg); }
.lux-feature-container .lux-hero-gallery { gap: 22px; grid-auto-columns: calc((100% - 44px)/3); padding: 5px 3px 18px; margin: 0 -3px; }
.lux-feature-container .lux-feature-card { display: block; height: 360px; border: 1px solid #e8e0d6; border-radius: 18px; background: #191919; transition: border-color .3s, box-shadow .3s; }
.lux-feature-card:hover, .lux-feature-card:focus-visible { border-color: #b69a6b; box-shadow: 0 9px 24px #41202b0b; }
.lux-feature-image { position: absolute; inset: 0; display: block; overflow: hidden; background: #191919; }
.lux-feature-image::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, #00000025, transparent 35%, #00000030 55%, #000000d9 100%); }
.lux-feature-card .lux-feature-image img { height: 100%; width: 100%; object-fit: cover; transition: transform .65s cubic-bezier(.2,.7,.2,1); }
.lux-feature-card:hover .lux-feature-image img { transform: scale(1.045); }
.lux-feature-seal, .lux-feature-rating { position: absolute; z-index: 1; top: 15px; display: inline-flex; align-items: center; gap: 6px; padding: 7px 10px; border-radius: 8px; font-size: 10px; }
.lux-feature-seal { left: 15px; background: #651d32; color: #ffe7ac; border: 1px solid #c6a66c80; }
.lux-feature-seal svg { width: 14px; height: 14px; }
.lux-feature-rating { right: 15px; background: #fffdf5f5; color: #3b2a24; font-weight: 600; }
.lux-feature-rating svg { width: 12px; height: 12px; color: #93702d; fill: currentColor; }
.lux-feature-rating small { font-size: 9px; font-weight: 400; }
.lux-feature-body { position: absolute; inset: auto 0 0; z-index: 2; display: flex; flex-direction: column; padding: 22px; }
.lux-feature-location { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; color: #f5e9da; font-size: 11px; line-height: 18px; }
.lux-feature-location svg { width: 13px; height: 13px; color: #ffe7ac; }
.lux-feature-name { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-width: 0; flex: 1; margin-top: 0; color: #fff; font-size: 25px; font-weight: 600; letter-spacing: -.035em; line-height: 1.2; }
.lux-feature-title-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 8px; }
.lux-feature-arrow { display: grid; place-items: center; width: 32px; height: 32px; flex-shrink: 0; border: 1px solid #c6a66c80; border-radius: 50%; background: #651d32; color: #ffe7ac; transition: transform .25s; }
.lux-feature-arrow svg { width: 15px; height: 15px; }
.lux-feature-card:hover .lux-feature-arrow { transform: rotate(-35deg); }
@media(max-width:1100px) { .lux-feature-container .lux-hero-gallery { grid-auto-columns: calc((100% - 22px)/2); } }
@media(max-width:760px) {
    .lux-feature-container { padding-top: 7px; }
    .lux-feature-heading { gap: 14px; margin-bottom: 18px; align-items: center; }
    .lux-feature-heading h2 { font-size: 23px; }
    .lux-feature-eyebrow { font-size: 9px; margin-bottom: 7px; }
    .lux-feature-container .lux-rail-controls { gap: 6px; }
    .lux-feature-container .lux-rail-controls button { width: 34px; height: 34px; }
    .lux-feature-container .lux-hero-gallery { grid-auto-columns: 88%; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; touch-action: pan-x pan-y pinch-zoom; }
    .lux-feature-container .lux-feature-card { scroll-snap-align: start; scroll-snap-stop: always; }
    .lux-feature-container .lux-feature-card { height: 320px; }
    .lux-feature-body { padding: 20px; }
    .lux-feature-name { font-size: 23px; }
}
@media(prefers-reduced-motion:reduce) { .lux-feature-card:hover .lux-feature-image img, .lux-feature-card:hover .lux-feature-arrow { transform: none; } }

.lux-feature-actions { display: flex; align-items: center; gap: 20px; flex-shrink: 0; }
.lux-feature-locate { display: inline-flex; align-items: center; gap: 7px; background: none; border: 0; color: #651d32; font-size: 11px!important; padding: 10px 0; }
.lux-feature-locate svg { width: 15px; height: 15px; }
.lux-salon-distance { color: #651d32; font-size: 10px; white-space: nowrap; }
.lux-feature-location .lux-salon-distance::before { content: '·'; padding: 0 5px; color: #9d8c7c; }
@media(max-width:760px) { .lux-feature-heading { flex-wrap: wrap; } .lux-feature-actions { width: 100%; justify-content: space-between; } }

.lux-location-status:empty { display: none; }
.lux-location-status { max-width: 190px; font-size: 10px; color: #75645c; }
.lux-feature-locate:disabled { opacity: .6; cursor: wait; }

.lux-feature-location .lux-salon-distance { color: #ffe7ac; }
.lux-feature-location .lux-salon-distance::before { color: #d9c5a7; }

.lux-feature-review { display: flex; align-items: center; gap: 6px; margin-top: 10px; min-width: 0; height: 18px; color: #f6ecdf; font-size: 10px; line-height: 18px; }
.lux-feature-review-mark { width: 12px; height: 18px; color: #ffe7ac; font-family: Georgia, serif; font-size: 25px; line-height: 26px; flex-shrink: 0; }
.lux-feature-review-text { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.lux-feature-navigation { display: flex; justify-content: flex-end; margin: 0 0 6px; }
.lux-feature-navigation .lux-rail-controls { gap: 4px; }
.lux-feature-container .lux-feature-navigation button { width: 36px; height: 36px; padding: 10px; border: 0; border-radius: 0; background: transparent; color: #651d32; }
.lux-feature-container .lux-feature-navigation button:hover { background: transparent; color: #4b1424; }
.lux-feature-navigation svg { width: 16px; height: 16px; }
.lux-feature-arrow { width: 18px; height: 18px; border: 0; border-radius: 0; background: transparent; }
.lux-feature-arrow svg { width: 14px; height: 14px; }
.lux-feature-locate { max-width: 100%; }
.lux-feature-locate span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }