/* Isolated component CSS: no dependency on a generated Tailwind safelist. */
.plp-highlight{display:grid;min-width:0;grid-column:span 1;container-type:inline-size;margin:0;list-style:none;background:#f7f7f5;color:#242824;border-radius:14px;overflow:hidden}
.plp-highlight__inner{display:grid;gap:22px;padding:22px;align-content:center;position:relative;overflow-wrap:anywhere}
.plp-highlight__copy h2{font-size:clamp(1.15rem,3cqi,1.8rem);line-height:1.2;font-weight:600;margin:0 0 14px}
.plp-highlight__copy p{white-space:pre-line;line-height:1.6;margin:0 0 16px;font-size:1.05rem;font-weight:600}
.plp-highlight__copy ul{list-style:disc;padding-left:20px;margin:0 0 20px;font-size:.85rem;line-height:1.7}
.plp-highlight__copy ul>li::marker{content:"✓  ";}
.plp-highlight__cta{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:12px 16px;border-radius:8px;background:#f56600;color:#fff;font-weight:600;line-height:1.3;text-decoration:none}
.plp-highlight__cta:hover{background:#dd5b00;color:#fff}
/* Oversized circle is clipped by the highlight; it never intercepts clicks. */
.plp-highlight__copy,.plp-highlight__choices{position:relative;z-index:1}
.plp-highlight__picture{display:flex;align-items:center;justify-content:center;min-width:0;position:relative;isolation:isolate;z-index:0}
.plp-highlight__picture::before{content:"";position:absolute;width:max(160%,85cqi);aspect-ratio:1;right:-5%;top:50%;transform:translateY(-50%);border-radius:50%;background:rgb(245 102 0 / 7%);z-index:-1;pointer-events:none}
.plp-highlight__picture img{display:block;width:100%;height:auto;max-height:430px;object-fit:contain;aspect-ratio:1/1}
.plp-highlight__choices{min-width:0}.plp-highlight__choices fieldset{border:0;min-width:0;padding:0;margin:0 0 16px}
.plp-highlight__choices legend{font-size:.85rem;font-weight:600;margin-bottom:8px}
.plp-highlight__values{display:grid;grid-template-columns:repeat(auto-fit,minmax(74px,1fr));gap:8px}
.plp-highlight__choice{position:relative;min-width:0;min-height:44px;border:1px solid #c7c7c1;border-radius:8px;padding:6px;background:#fff;color:#242824;text-align:center;font-size:.75rem;line-height:1.3;cursor:pointer}
.plp-highlight__choice img{width:100%;height:65px;object-fit:contain;margin:0 0 6px}
.plp-highlight__choice[aria-pressed=true]{border-color:#f56600;background:#fff7f1}
.plp-highlight__check{display:none;position:absolute;right:3px;top:3px;border-radius:50%;width:18px;height:18px;background:#15803d;color:white;font-weight:bold;line-height:18px}
.plp-highlight__choice[aria-pressed=true] .plp-highlight__check{display:block}
.plp-highlight :is(button,a):focus-visible{outline:3px solid #a54200;outline-offset:3px}
.plp-highlight__hint{font-size:.7rem;line-height:1.5;margin:0}
.plp-highlight__status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@media(min-width:640px){.plp-highlight--span-2,.plp-highlight--span-3,.plp-highlight--span-4{grid-column:span 2}}
@media(min-width:1024px){.plp-highlight--span-3,.plp-highlight--span-4{grid-column:span 3}}
@media(min-width:1280px){.plp-highlight--span-4{grid-column:span 4}}
.products-list .plp-highlight{grid-column:span 1}
@container(min-width:520px){.plp-highlight__inner{grid-template-columns:1fr 1fr}.plp-highlight__choices{grid-column:1/-1}.plp-highlight__values{grid-template-columns:repeat(auto-fit,minmax(85px,120px))}}
@container(min-width:640px){.plp-highlight__inner{grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);padding:30px;gap:26px;align-items:center}.plp-highlight__inner:has(>.plp-highlight__picture):has(>.plp-highlight__choices){grid-template-columns:minmax(0,1fr) minmax(0,1.25fr) minmax(0,.85fr)}.plp-highlight__choices{grid-column:auto}.plp-highlight__values{grid-template-columns:repeat(auto-fit,minmax(74px,1fr))}}
.plp-highlight__inner:not(:has(>.plp-highlight__picture)):not(:has(>.plp-highlight__choices)){grid-template-columns:minmax(0,1fr)}
/* Full-bleed picture remains an accessible responsive image, not a CSS URL. */
.plp-highlight[data-display-mode=background] .plp-highlight__inner{isolation:isolate;grid-template-columns:minmax(0,1fr);align-content:end;gap:16px;padding:240px 18px 18px;min-height:520px}
/* The wash follows the content layout, independently of the cropped photo. */
.plp-highlight[data-display-mode=background] .plp-highlight__inner::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(180deg,rgb(249 247 245 / 0) 80px,rgb(249 247 245 / 45%) 170px,rgb(249 247 245 / 96%) 240px,rgb(249 247 245 / 98%) 100%)}
.plp-highlight[data-display-mode=background] .plp-highlight__picture{position:absolute;inset:0;z-index:-1;isolation:auto;pointer-events:none}
.plp-highlight[data-display-mode=background] .plp-highlight__picture::before{content:none}
.plp-highlight[data-display-mode=background] .plp-highlight__picture img{width:100%;height:100%;max-height:none;aspect-ratio:auto;object-fit:cover;object-position:center}
.plp-highlight[data-display-mode=background][data-image-position=left] .plp-highlight__picture img{object-position:left center}
.plp-highlight[data-display-mode=background][data-image-position=right] .plp-highlight__picture img{object-position:right center}
.plp-highlight[data-display-mode=background] :is(.plp-highlight__copy,.plp-highlight__choices){grid-column:1;min-width:0;padding:18px;border-radius:10px;color:#242824;background:transparent}
.plp-highlight[data-display-mode=background] .plp-highlight__choice{background:transparent}
/* Keep the editorial hierarchy compact enough for the light area of the image. */
.plp-highlight[data-display-mode=background] .plp-highlight__copy{width:100%;max-width:22rem}
.plp-highlight[data-display-mode=background] .plp-highlight__copy h2{font-size:clamp(1.5rem,3.8cqi,2.375rem);font-weight:700;line-height:1.15;letter-spacing:-.025em;margin-bottom:14px;text-wrap:balance}
.plp-highlight[data-display-mode=background] .plp-highlight__copy p{max-width:28ch;font-size:1rem;font-weight:600;line-height:1.5;margin-bottom:24px;text-wrap:pretty}
.plp-highlight[data-display-mode=background] .plp-highlight__copy ul{padding-left:20px;margin-bottom:26px;font-size:.875rem;font-weight:500;line-height:1.5}
.plp-highlight[data-display-mode=background] .plp-highlight__copy ul>li{padding-left:4px;margin-bottom:7px}
.plp-highlight[data-display-mode=background] .plp-highlight__copy ul>li:last-child{margin-bottom:0}
.plp-highlight[data-display-mode=background] .plp-highlight__copy ul>li::marker{color:#f56600;font-weight:700}
.plp-highlight[data-display-mode=background] .plp-highlight__cta{min-height:48px;padding:13px 18px;font-size:.9375rem;font-weight:700;max-width:100%}
@container(min-width:640px){
    .plp-highlight[data-display-mode=background] .plp-highlight__inner{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);align-content:center;align-items:center;min-height:420px;padding:24px;gap:20px}
    .plp-highlight[data-display-mode=background] .plp-highlight__inner::before{--plp-copy-width:min(22rem,calc((100% - 68px)/2.2));--plp-fade-width:var(--plp-default-fade,clamp(80px,13cqi,130px));--plp-copy-edge:var(--plp-default-left-edge,calc(24px + var(--plp-copy-width)));--plp-left-wash:linear-gradient(90deg,rgb(249 247 245 / 99%),rgb(249 247 245 / 96%) var(--plp-copy-edge),rgb(249 247 245 / 88%) calc(var(--plp-copy-edge) + var(--plp-fade-width)*.2),rgb(249 247 245 / 60%) calc(var(--plp-copy-edge) + var(--plp-fade-width)*.4),rgb(249 247 245 / 30%) calc(var(--plp-copy-edge) + var(--plp-fade-width)*.6),rgb(249 247 245 / 10%) calc(var(--plp-copy-edge) + var(--plp-fade-width)*.8),rgb(249 247 245 / 0) calc(var(--plp-copy-edge) + var(--plp-fade-width)));background:var(--plp-left-wash)}
    .plp-highlight[data-display-mode=background] .plp-highlight__inner:has(>.plp-highlight__choices){grid-template-columns:minmax(0,1.05fr) minmax(0,.8fr) minmax(0,.95fr)}
    .plp-highlight[data-display-mode=background] .plp-highlight__inner:has(>.plp-highlight__choices)::before{--plp-copy-width:min(22rem,calc((100% - 88px)*.375));--plp-choice-width:calc((100% - 88px)*.3392857143);--plp-choice-edge:var(--plp-default-right-edge,calc(24px + var(--plp-choice-width)));background:var(--plp-left-wash),linear-gradient(270deg,rgb(249 247 245 / 98%),rgb(249 247 245 / 94%) var(--plp-choice-edge),rgb(249 247 245 / 52%) calc(var(--plp-choice-edge) + var(--plp-fade-width)*.2),rgb(249 247 245 / 52%) calc(var(--plp-choice-edge) + var(--plp-fade-width)*.4),rgb(249 247 245 / 24%) calc(var(--plp-choice-edge) + var(--plp-fade-width)*.6),rgb(249 247 245 / 7%) calc(var(--plp-choice-edge) + var(--plp-fade-width)*.8),rgb(249 247 245 / 0) calc(var(--plp-choice-edge) + var(--plp-fade-width)))}
    .plp-highlight[data-display-mode=background] .plp-highlight__choices{grid-column:3;grid-row:1}
    .plp-highlight[data-display-mode=background] .plp-highlight__copy{grid-row:1}
}
@media(prefers-reduced-motion:reduce){.plp-highlight *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Approved gradient widths: highlight 1, category 4. Mobile wash is unchanged. */
.plp-highlight[data-plp-highlight="1"][data-category="4"][data-display-mode=background] .plp-highlight__inner{--plp-default-left-edge:23%;--plp-default-right-edge:0%;--plp-default-fade:40%}

