/* Care → Member Shop, captured from app.forhims.com. Scoped for later content replacement. */
#hims-care-reference{font-family:WorksSofia,Inter,sans-serif;font-size:16px;font-weight:500;background:#000;color:#fff;overflow:clip}
#hims-care-reference *{box-sizing:content-box}
#hims-care-reference :where(div,h2,p,ul,li,img,video,svg){margin:0;padding:0;border:0;font:inherit}
#hims-care-reference p{max-width:none;color:inherit}
#hims-care-reference img{display:block;max-width:none}
#hims-care-reference ul{list-style:none}
#hims-care-reference svg{display:block;fill:currentColor}
#hims-care-reference .section-rectangle{color:#000}
#hims-care-reference .card{ position: relative; }
#hims-care-reference .card-shadow{ position: absolute; inset: 0px 64px; border-radius: 45px; box-shadow: rgba(0, 0, 0, 0.12) 0px 27px 104px 0px; }
#hims-care-reference .card-content{ position: relative; width: 100%; height: 100%; clip-path: inset(0px 64px round 45px); will-change: clip-path; background-color: rgb(255, 255, 255); }
#hims-care-reference .card-content-phone-shim{ height: calc(-50vh + 41.8056vw); }
#hims-care-reference .card-content-phone-sticky{ position: sticky; z-index: 2; top: 0px; width: 100vw; height: 100vh; }
#hims-care-reference .card-content-phone{ position: relative; top: 50%; width: 100vw; transform: translateY(-50%); overflow-x: hidden; }
#hims-care-reference.hims-phone-wide .card-content-phone{ height: 83.6111vw; }
#hims-care-reference.hims-phone-tall .card-content-phone{ height: 100vh; }
#hims-care-reference .card-content-phone > img,#hims-care-reference .card-content-screen{ position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
#hims-care-reference .card-content-phone > img{ z-index: 1; width: auto; height: 100%; }
#hims-care-reference .card-content-screen{ z-index: 2; overflow: hidden; }
#hims-care-reference .card-content-list-sticky li,#hims-care-reference .card-content-screen > img,#hims-care-reference .card-content-screen > video{ position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; }
#hims-care-reference.hims-phone-wide .card-content-screen{ height: 39.8825vw; width: 18.8017vw; border-radius: 2.08333vw; }
#hims-care-reference.hims-phone-tall .card-content-screen{ height: 47.7vh; width: 22.4871vh; border-radius: 2.8vh; }
#hims-care-reference .card-content-list{ position: relative; left: calc(64px + 2.5vw); width: 23.6111vw; height: 500vh; }
#hims-care-reference .card-content-list-sticky{ position: sticky; top: 0px; width: 100%; height: 100vh; }
#hims-care-reference .card-content-list-sticky li{ display: flex; align-items: center; }
#hims-care-reference .card-content-list-sticky-copy{ will-change: transform, opacity; }
#hims-care-reference .card-content-list-sticky-copy p{ font-size: 2.43056vw; line-height: 118%; letter-spacing: -0.0475em; color: rgb(0, 0, 0); }
#hims-care-reference .p{ padding-top: 11.1111vw; padding-left: 11.1111vw; padding-right: 10.8333vw; }
#hims-care-reference .p p{ font-size: 5.90278vw; line-height: 6.80556vw; letter-spacing: -0.0475em; background-size: 100% auto; background-clip: text; -webkit-text-fill-color: transparent; }
#hims-care-reference #care .p p{ background-image: linear-gradient(93.37deg, rgb(150, 133, 255) -1.4%, rgb(209, 178, 202) 34.29%, rgb(181, 173, 225) 85.34%); }
#hims-care-reference #shop .p p{ background-image: linear-gradient(123.97deg, rgb(127, 191, 188) 10.62%, rgb(85, 107, 113) 49.7%, rgb(0, 0, 0) 89.61%); }
#hims-care-reference .section{ padding-top: 17.3611vw; }
#hims-care-reference .section-rectangle{ margin: auto; width: 25.8333vw; height: 25.8333vw; border-radius: 20%; box-shadow: rgba(0, 0, 0, 0.11) 0px 8px 127px 0px; display: flex; align-items: center; justify-content: center; background-color: rgb(255, 255, 255); }
#hims-care-reference .section-rectangle svg{ width: 9.30556vw; height: 10.1389vw; }
#hims-care-reference .section h2{ padding-top: 6.25vw; text-align: center; font-size: 15.2778vw; line-height: 15.2778vw; letter-spacing: -0.0575em; }
#hims-care-reference #care{ margin-top: 17.3611vw; background-color: rgb(0, 0, 0); color: rgb(255, 255, 255); }
#hims-care-reference #care .card-shadow{ display: none; }
#hims-care-reference #care .card-content{ clip-path: none; background-color: rgb(0, 0, 0); }
#hims-care-reference #care-card-0,#hims-care-reference #care-card-1{ position: relative; border-radius: 45px; }
#hims-care-reference #care-card-0{ margin-top: 13.8889vw; padding-top: 16.6667vw; margin-left: 64px; margin-right: 64px; box-shadow: rgba(0, 0, 0, 0.12) 0px 27px 104px 0px; overflow: hidden; background-size: cover; background-position: center top; background-repeat: no-repeat; background-image: url("/assets/optimized/background-w1600.ca401e31fe.opt.c34bcc8903.webp"); }
#hims-care-reference #care-card-0 p,#hims-care-reference #care-card-1 p{ letter-spacing: -0.0475em; text-align: center; }
#hims-care-reference #care-card-0 p{ position: relative; margin: auto; width: 53.4722vw; font-size: 3.05556vw; line-height: 3.61111vw; }
#hims-care-reference #care-card-0-phone{ position: relative; margin-left: -64px; width: 100vw; }
#hims-care-reference.hims-phone-wide #care-card-0-phone{ margin-top: -8.36111vw; height: 83.6111vw; }
#hims-care-reference.hims-phone-tall #care-card-0-phone{ margin-top: -20.9028vw; height: 100vh; }
#hims-care-reference #care-card-0-phone img{ position: absolute; top: 50%; left: 50%; width: auto; height: 100%; transform: translate(-50%, -50%); }
#hims-care-reference #care-card-1{ display: block; position: relative; margin-top: 32px; margin-left: 64px; margin-right: 64px; background-image: linear-gradient(90deg, rgb(53, 47, 51) 0px, rgb(41, 37, 38) 100%); }
#hims-care-reference #care-card-1 p{ padding-top: 25vw; padding-bottom: 6.25vw; margin-left: auto; margin-right: auto; font-size: 2.70833vw; line-height: 118%; }
#hims-care-reference #care-card-1-icon{ position: absolute; top: 11.1111vw; left: 0px; width: 100%; height: 8.05556vw; }
#hims-care-reference #care-card-1-icon div{ position: absolute; line-height: 115%; letter-spacing: -0.0125em; top: 0px; box-sizing: border-box; padding-top: 4.93056vw; width: 8.05556vw; height: 8.05556vw; background-color: rgb(255, 255, 255); border-radius: 100%; font-size: 1.38889vw; color: rgb(0, 0, 0); text-align: center; }
#hims-care-reference #care-card-1-icon div:nth-child(2),#hims-care-reference #care-card-1-icon div:nth-child(3){ left: calc(50% - 9.93056vw); box-shadow: rgba(0, 0, 0, 0.25) 0px 9px 46px 0px; }
#hims-care-reference #care-card-1-icon div:nth-child(2){ left: calc(50% - 4.02778vw); }
#hims-care-reference #care-card-1-icon div:nth-child(1){ left: calc(50% + 1.875vw); }
#hims-care-reference #care-card-1-icon svg{ position: absolute; top: 1.66667vw; left: calc(50% - 1.11111vw); width: 2.22222vw; height: 2.5vw; }
#hims-care-reference #care-card-1 p{ width: 29.0278vw; }
#hims-care-reference #care-card-2{ position: relative; margin-top: 32px; margin-left: 64px; margin-right: 64px; border-radius: 45px; background-image: linear-gradient(90deg, rgb(49, 44, 48) 0px, rgb(53, 47, 51) 50%, rgb(41, 37, 38) 100%); height: calc(75vw); min-height: 75vh; clip-path: inset(0px round 45px); }
#hims-care-reference .wrapper-half-speed{ position: absolute; width: 200%; height: calc(200% + 400vh); top: -100vh; transform: scale(0.5) translate(-50%, -50%); }
#hims-care-reference .item{ position: sticky; top: 0px; height: calc(133.3vh - 133.3vw); }
#hims-care-reference .clip{ position: absolute; width: 100%; top: 100vh; height: calc(100% + 211.85vw); overflow: hidden; }
#hims-care-reference .clip img{ width: auto; position: absolute; top: 0px; left: 50%; height: 100%; transform: translateX(-50%); }
#hims-care-reference #shop{ margin-top: -1px; background-color: rgb(0, 0, 0); color: rgb(255, 255, 255); }
#hims-care-reference #shop .card{ margin-top: 13.8889vw; background-color: rgb(255, 255, 255); }
#hims-care-reference #shop-card-bg{ position: absolute; left: 0px; }
#hims-care-reference #shop-card-bg{ top: -1px; width: 100%; height: calc(100% + 2px); background-color: rgb(0, 0, 0); }
#hims-care-reference #shop .p{ margin-top: -1px; margin-bottom: 11.1111vw; background-color: rgb(255, 255, 255); }
#hims-care-reference #shop .card-content{ background-image: linear-gradient(0deg, rgba(245, 240, 242, 0) 50%, rgba(180, 205, 196, 0.7) 100%); }
#hims-care-reference #shop-card-content-grid{ position: relative; width: 100vw; overflow-x: hidden; }
#hims-care-reference.hims-phone-wide #shop-card-content-grid{ top: -23.4111vw; height: 209.028vw; margin-bottom: -107.022vw; }
#hims-care-reference.hims-phone-tall #shop-card-content-grid{ top: -28vh; height: 250vh; margin-bottom: -128vh; }
#hims-care-reference #shop-card-content-grid img{ position: absolute; left: 50%; width: auto; height: 100%; transform: translateX(-50%); }
@media (max-width: 750px){#hims-care-reference .card-shadow{ left: 24px; right: 24px; border-radius: 16px; box-shadow: rgba(0, 0, 1, 0.184) 0px 22px 32px 0px; }
#hims-care-reference .card-content{ clip-path: inset(0px 16px round 24px); }
#hims-care-reference #shop .card-content-phone-sticky{ top: 18%; }
#hims-care-reference .card-content-list{ position: relative; left: 0px; margin-left: auto; margin-right: auto; width: 69.2308vw; height: 500vh; text-align: center; }
#hims-care-reference .card-content-list-sticky li{ display: block; }
#hims-care-reference #shop .card-content-list-sticky-copy{ margin-top: 50%; }
#hims-care-reference .card-content-list-sticky-copy p,#hims-care-reference .p p{ font-size: 5.12821vw; line-height: 118%; }
#hims-care-reference .p,#hims-care-reference .section h2{ padding-top: 10.2564vw; }
#hims-care-reference .p{ padding-left: 6.15385vw; padding-right: 5.12821vw; }
#hims-care-reference .p p{ font-size: 8.20513vw; }
#hims-care-reference .section{ padding-top: 41.0256vw; }
#hims-care-reference .section-rectangle{ width: 47.6923vw; height: 47.6923vw; box-shadow: rgba(0, 0, 0, 0.11) 0px 4px 61px 0px; }
#hims-care-reference .section-rectangle svg{ width: 17.1795vw; height: 18.7179vw; }
#hims-care-reference .section h2{ font-size: 23.0769vw; line-height: 23.0769vw; }
#hims-care-reference #care-card-0{ margin-left: 16px; margin-right: 16px; border-radius: 24px; }
#hims-care-reference #care-card-0 p{ width: 78.4615vw; font-size: 8.20513vw; line-height: 118%; }
#hims-care-reference #care-card-0-phone{ margin-left: -16px; }
#hims-care-reference.hims-phone-wide #care-card-0-phone{ height: calc(-26.7556px + 83.6111vw); }
#hims-care-reference.hims-phone-tall #care-card-0-phone{ height: 100vh; }
#hims-care-reference #care-card-1 p{ font-size: 6.15385vw; padding-bottom: 18.4615vw; }
#hims-care-reference #care-card-1-icon{ top: 22.5641vw; height: 20.8205vw; }
#hims-care-reference #care-card-1-icon div{ padding-top: 12.7436vw; width: 20.8205vw; height: 20.8205vw; font-size: 3.58974vw; }
#hims-care-reference #care-card-1-icon div:nth-child(2),#hims-care-reference #care-card-1-icon div:nth-child(3){ left: calc(50% - 25.6667vw); box-shadow: rgba(0, 0, 0, 0.25) 0px 9px 46px 0px; }
#hims-care-reference #care-card-1-icon div:nth-child(2){ left: calc(50% - 10.4103vw); }
#hims-care-reference #care-card-1-icon div:nth-child(1){ left: calc(50% + 4.84615vw); }
#hims-care-reference #care-card-1-icon svg{ top: 4.30769vw; left: calc(50% - 2.87179vw); width: 5.74359vw; height: 6.46154vw; }
#hims-care-reference #care-card-1 p{ padding-top: 55.3846vw; width: 66.1539vw; }
#hims-care-reference #care-card-1,#hims-care-reference #care-card-2{ margin-left: 16px; margin-right: 16px; border-radius: 24px; }
#hims-care-reference #care-card-1,#hims-care-reference #care-card-2{ margin-top: 16px; clip-path: inset(0px round 16px); }
#hims-care-reference #shop .p{ margin-bottom: 20.5128vw; }}
#hims-care-reference #care{margin-top:0}
#hims-care-reference .card-content-screen>img,#hims-care-reference .card-content-screen>video{object-fit:fill}
#hims-care-reference .card-content-list-sticky-copy{opacity:0}
#hims-care-reference #shop .p{margin-bottom:0;padding-bottom:11.1111vw}
@media(max-width:750px){#hims-care-reference #shop .p{padding-bottom:20.5128vw}}

/* YET content: preserve the reference composition with the supplied artwork. */
#hims-care-reference #care-card-0 p{width:min(72vw,1040px)}
#hims-care-reference #care-card-1 p{width:min(55vw,790px)}
#hims-care-reference #care-card-2.yet-conversation{height:75vw;min-height:75vh;aspect-ratio:auto;background:linear-gradient(90deg,#312c30,#352f33 50%,#292526)}
#hims-care-reference .yet-conversation .clip img{clip-path:inset(0 0 40.88785% 0)}
#hims-care-reference #shop-card-content-grid .development-mosaic{position:absolute;left:50%;top:0;transform:translateX(-50%);width:calc(209.028vw * 1920 / 4013);height:100%;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));grid-template-rows:repeat(4,minmax(0,1fr));gap:2.08333vw;box-sizing:border-box;padding-block:calc(209.028vw * 421 / 4013)}
#hims-care-reference #shop-card-content-grid .development-mosaic img{position:static;width:100%;height:100%;min-width:0;min-height:0;object-fit:cover;transform:none;border-radius:2.08333vw}
#hims-care-reference .development-mosaic img:nth-child(1){grid-area:1/1/3/3}
#hims-care-reference .development-mosaic img:nth-child(2){grid-area:1/3}
#hims-care-reference .development-mosaic img:nth-child(3){grid-area:1/4/2/6}
#hims-care-reference .development-mosaic img:nth-child(4){grid-area:2/3}
#hims-care-reference .development-mosaic img:nth-child(5){grid-area:2/4}
#hims-care-reference .development-mosaic img:nth-child(6){grid-area:2/5}
#hims-care-reference .development-mosaic img:nth-child(7){grid-area:3/1}
#hims-care-reference .development-mosaic img:nth-child(8){grid-area:3/2}
#hims-care-reference .development-mosaic img:nth-child(9){grid-area:3/3/4/5}
#hims-care-reference .development-mosaic img:nth-child(10){grid-area:3/5}
#hims-care-reference .development-mosaic img:nth-child(11){grid-area:4/1/5/3}
#hims-care-reference .development-mosaic img:nth-child(12){grid-area:4/4}
#hims-care-reference .development-mosaic img:nth-child(13){grid-area:4/5}
#hims-care-reference.hims-phone-tall #shop-card-content-grid .development-mosaic{width:calc(250vh * 1920 / 4013);padding-block:calc(250vh * 421 / 4013)}
@media(max-width:750px){
 #hims-care-reference #care-card-0 p{width:78.4615vw;font-size:6.15385vw;line-height:1.18}
 #hims-care-reference #care-card-1 p{width:72vw}
 #hims-care-reference #shop-card-content-grid .development-mosaic{gap:16px}
 #hims-care-reference #shop-card-content-grid .development-mosaic img{border-radius:16px}
}

/* Preserve the reference's native half-speed sticky composition. */
@media(prefers-reduced-motion:reduce){
 #hims-care-reference .yet-conversation .wrapper-half-speed{position:relative;top:auto;width:100%;height:100%;transform:none}
 #hims-care-reference .yet-conversation .item{position:static;height:100%}
 #hims-care-reference .yet-conversation .clip{top:0;height:100%}
 #hims-care-reference .yet-conversation .clip img{height:auto;width:100%;top:0}
}

@media(max-width:750px){#hims-care-reference #care-card-2.yet-conversation{min-height:55vh}}
