/* Care shares the approved perfume catalog's hero, toolbar, product grid,
   editorial mosaic and featured card components. */
.care-view{background:#fff;min-height:100dvh}
.care-hero{background:#726b63}
.care-hero--category .hero-media img{object-position:50% 52%}
.care-hero--category .hero-media__scrim{background:linear-gradient(180deg,rgba(0,0,0,.06),transparent 31%,rgba(0,0,0,.15) 51%,rgba(0,0,0,.77) 100%)}
.care-card .product-photo{background:#fff}
.care-card .photo-primary{object-fit:contain;transform:none}
/* Four bestseller images across the all-care journey: the opening hand cream
   plus three interludes. Filtered pages retain only their distinct hero. */
.care-editorial{background:#6b5b50}
.care-editorial__eyebrow{display:block;font-size:11px;line-height:1.35;letter-spacing:.035em}
.care-editorial .story-banner__title{max-width:88%;text-transform:lowercase}
.care-editorial--gels .story-banner__link img{object-position:50% 45%}
.care-editorial--lotions .story-banner__link img{object-position:50% 55%}
.care-editorial--body .story-banner__link img{object-position:50% 50%}
@media(hover:hover) and (pointer:fine){
  .care-card:not(.has-secondary):hover .photo-primary{opacity:1}
}

/* Exact-packshot placeholders are visually neutral and never borrow another SKU. */
.care-awaiting-photo{--care-tint:#e4dfd6;position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;padding:clamp(12px,2vw,26px);background:radial-gradient(circle at 86% 16%,#fff7 0 17%,transparent 58%),linear-gradient(150deg,#f5f3ef,var(--care-tint));text-align:left;color:#2d302e;overflow:hidden}
.care-awaiting-photo--basil{--care-tint:#d6dfd2}
.care-awaiting-photo--saffron{--care-tint:#e2ceb9}
.care-awaiting-photo--sage{--care-tint:#d6dfdb}
.care-awaiting-photo--vanilla{--care-tint:#e7dac7}
.care-awaiting-photo--black-tea{--care-tint:#d7cec2}
.care-awaiting-photo--ylang{--care-tint:#e5d6df}
.care-awaiting-photo--jasmine{--care-tint:#dfddd3}
.care-awaiting-photo--pomegranate{--care-tint:#e5d3cf}
.care-card .product-photo .care-awaiting-photo__logo,.care-pdp .pdp-slide .care-awaiting-photo__logo{position:static;inset:auto;display:block;width:clamp(70px,8vw,116px);height:auto;object-fit:contain;filter:brightness(0);transform:none}
.care-awaiting-photo__details{display:flex;flex-direction:column;gap:9px;max-width:100%;line-height:1.12;letter-spacing:-.025em}
.care-awaiting-photo__details>span{font-size:clamp(11px,1.05vw,16px);letter-spacing:0}
.care-awaiting-photo__details>strong{font-size:clamp(18px,2.5vw,38px);font-weight:400;overflow-wrap:break-word}
.care-awaiting-photo__note{font-size:10px;line-height:1.25;color:#77746f}
@media(max-width:679px){
  .care-card .care-awaiting-photo{padding:12px}
  .care-card .care-awaiting-photo__details{gap:5px}
  .care-card .care-awaiting-photo__details>strong{font-size:clamp(17px,4.5vw,22px)}
  .care-card .care-awaiting-photo__note{font-size:9px}
}
@media(min-width:680px){
  /* Same mobile-to-desktop cutoff as the perfume catalog. */
  #careView>.hero,#careGrid,#careGridSecond{display:none!important}
}

/* Product details retain their product-specific photography and information. */
.care-pdp .pdp-gallery-stage{background:#fff}
.care-pdp .pdp-slide{background:#fff}
.care-pdp .pdp-slide img{object-fit:contain;object-position:50% 50%;transform:none}
/* Show the *whole* portrait editorial shot in product galleries. Cover was
   cutting off the top of hand-cream tubes on narrow mobile screens. */
.care-pdp--gallery .pdp-slide:nth-child(2) img{object-fit:contain}
.care-pdp .pdp-slide.care-pdp-awaiting{position:relative;overflow:hidden}
.care-pdp-awaiting .care-awaiting-photo{padding:clamp(24px,5vw,54px)}
.care-pdp-awaiting .care-awaiting-photo__details>strong{font-size:clamp(34px,6vw,64px)}
.care-pdp-awaiting .care-awaiting-photo__note{font-size:13px}
.care-pdp .pdp-description{margin-top:0;padding-top:12px}
.care-pdp .pdp-disclosures{margin-top:31px}
.care-pdp .pdp-name-ru{margin-bottom:16px}
.care-pdp .pdp-recommendations__track .care-card{flex-basis:clamp(143px,42vw,206px)}
.search-result strong,.search-result small{display:block;font-weight:400}
.search-result small{font-size:11px;color:#888;margin-top:5px}
@media(min-width:760px){
  .care-pdp .pdp-slide img{object-fit:contain}
  .care-pdp .pdp-description{padding-top:0}
}
@media(max-width:759px){
  .care-pdp--gallery .pdp-gallery-track{overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory}
  .care-pdp .pdp-slide{height:clamp(380px,49svh,475px);aspect-ratio:auto}
  .care-pdp .pdp-slide:first-child img{transform:none;object-position:center;padding:0 11px}
  .care-pdp .pdp-description{padding-top:12px}
}
@media(max-width:679px){
  /* Source packshots are square: match their ratio so no colored letterbox
     strips appear above and below a lotion, gel or hand cream. */
  .care-card .product-photo{aspect-ratio:1/1}
  /* A deliberately composed editorial crop at perfume-banner scale, with a
     common height so the page does not jump when switching care categories. */
  .care-hero{height:clamp(265px,36svh,330px)}
  .care-hero[data-care-category="all"] .hero-media img{object-position:50% 17%}
  .care-hero[data-care-category="hands"] .hero-media img{object-position:50% 20%}
  .care-hero[data-care-category="lotions"] .hero-media img{object-position:50% 55%}
  .care-editorial .story-banner__link{height:clamp(255px,35svh,330px)}
  .care-editorial .story-banner__shade{background:linear-gradient(180deg,rgba(0,0,0,.025),transparent 42%,rgba(0,0,0,.75) 100%)}
  .care-editorial .story-banner__content{padding:25px 24px 28px;gap:13px}
  .care-editorial .story-banner__title{font-size:clamp(35px,9.2vw,52px);line-height:.95}
}