/* The existing native dialog supplies focus trapping and Escape behavior. */
.modal:has(.care-finder-content) { width:min(760px,calc(100% - 24px)); max-height:calc(100dvh - 32px); border-radius:24px; }
.care-finder-content { padding:38px; color:#423138; }
.care-finder-content h2 { margin:0 34px 12px 0; font-size:29px; line-height:1.2; font-weight:650; letter-spacing:-.6px; }
.care-finder-content .modal-text { margin:0 0 24px; max-width:580px; font-size:15px; line-height:1.6; }
.care-finder-progress { list-style:none; display:flex; gap:12px; margin:0 0 24px; padding:0; }
.care-finder-progress li { display:flex; flex:1; flex-direction:column; align-items:flex-start; gap:7px; color:#88747b; font-size:12px; line-height:1.4; border-top:3px solid #eee3e4; padding-top:10px; }
.care-finder-progress li span { display:none; }
.care-finder-progress .is-active { border-color:#a34664; color:#78374d; }
.care-finder-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.care-finder-option { display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:58px; padding:14px 16px; border:1px solid #e8d8dc; border-radius:14px; color:#4b343e; background:#fffdfb; text-align:left; font-size:15px; line-height:1.4; touch-action:manipulation; user-select:none; transition:background-color 140ms ease,border-color 140ms ease,transform 140ms cubic-bezier(.23,1,.32,1); }
.care-finder-option[aria-pressed="true"] { background:#f6e7ed; border-color:#a34b69; }
.care-finder-check { flex:none; color:#914360; opacity:0; }
.care-finder-option[aria-pressed="true"] .care-finder-check { opacity:1; }
.care-finder-option:active { transform:scale(.98); }
.care-finder-actions { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-top:24px; }
.care-finder-actions .primary-button { min-height:46px; }
.care-finder-privacy { color:#88747b; font-size:12px; line-height:1.5; margin:18px 0 0; }
.care-finder-summary { display:flex; flex-wrap:wrap; gap:7px; margin:0 0 24px; }
.care-finder-summary span { padding:6px 11px; border-radius:999px; color:#753c50; background:#f5e9ed; font-size:13px; }
.care-finder-products { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; margin-bottom:24px; }
.care-finder-products .product-card:only-child { grid-column:1/-1; width:min(300px,100%); justify-self:center; }
.care-finder-products .product-name { font-size:15px; }
.care-finder-products .product-media { aspect-ratio:1; }
.care-finder-result > .care-finder-catalog { display:flex; width:100%; justify-content:center; text-align:center; min-height:48px; }
.care-finder-result > .text-link { display:flex; margin:16px auto 0; min-height:44px; }
.care-finder-content button:focus-visible,.care-finder-content a:focus-visible { outline:2px solid #8a3d53; outline-offset:3px; }
@media (hover:hover) and (pointer:fine) { .care-finder-option:hover { border-color:#c28c9e; background:#fbf3f6; } }
@media (max-width:600px) {
  .modal:has(.care-finder-content) { max-height:calc(100dvh - 20px); border-radius:20px; }
  .care-finder-content { padding:30px 20px 24px; }
  .care-finder-content h2 { font-size:25px; }
  .care-finder-options { gap:8px; }
  .care-finder-option { padding:12px; font-size:14px; min-height:62px; }
  .care-finder-products { gap:12px; }
  .care-finder-products .product-name { font-size:14px; }
  .care-finder-products .product-price { font-size:18px; }
  .care-finder-actions { gap:12px; }
  .care-finder-actions .primary-button { font-size:14px; padding-inline:18px; }
  .care-finder-result > .care-finder-catalog { padding-inline:12px; font-size:14px; }
}
@media (max-width:360px) {
  .care-finder-content { padding-inline:16px; }
  .care-finder-options { grid-template-columns:minmax(0,1fr); }
  .care-finder-option { min-height:48px; }
  .care-finder-products { grid-template-columns:minmax(0,1fr); }
  .care-finder-products .product-card { width:min(280px,100%); justify-self:center; }
}
@media (prefers-reduced-motion:reduce) { .care-finder-option { transition:none; } }
/* Hover previews the same upward state as an opened question, without a second flip. */
.home-faq summary .icon { transition:transform 160ms var(--cloud-ease,cubic-bezier(.23,1,.32,1)); }
@media (hover:hover) and (pointer:fine) { .home-faq summary:hover .icon { transform:rotate(180deg); } }
@media (prefers-reduced-motion:reduce) { .home-faq summary .icon { transition:none; } }