/* ==========================================================================
   Calculator + My Pets (calc work stream). Loaded after main.css.
   ========================================================================== */
.hm-calc,.hm-pets-wrap,.hm-club{--calc-focus:0 0 0 3px #fff,0 0 0 6px var(--hm-olive);--calc-muted:#6B6B66;--calc-warn:#9E4A16}
.hm-calc{position:relative}
.hm-calc *,.hm-pets-wrap *{box-sizing:border-box}
.hm-calc [hidden],.hm-pets-wrap [hidden]{display:none!important}

/* progress */
.hm-calc__head{margin-bottom:6px}
.hm-calc__progress{height:8px;background:var(--hm-cream-2);border-radius:4px;overflow:hidden;margin-bottom:14px}
.hm-calc__progress span{display:block;width:100%;height:100%;background:var(--hm-olive);transform-origin:right center;transform:scaleX(.143);transition:transform .3s ease}
.hm-calc__stepnum{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--calc-muted);margin:0 0 4px}
.hm-calc__stepnum b{color:var(--hm-ink)}
.hm-calc__stepname{color:var(--hm-olive-dark);font-weight:700}
.hm-calc__stepname::before{content:"";display:inline-block;width:4px;height:4px;border-radius:50%;background:var(--hm-line);margin-inline-end:8px;vertical-align:middle}

/* steps: fixed-height stage, slide on transform/opacity only */
.hm-calc__steps{position:relative;min-height:380px}
.hm-calc__step{display:none;border:0;padding:0;margin:0;min-width:0}
.hm-calc__step.is-active{display:block}
.hm-calc__step.is-measure{display:block;position:absolute;inset:0 0 auto 0;visibility:hidden;pointer-events:none}
.hm-calc__step.is-enter-next{animation:hm-slide-next .26s ease both}
.hm-calc__step.is-enter-back{animation:hm-slide-back .26s ease both}
@keyframes hm-slide-next{from{opacity:0;transform:translateX(-24px)}to{opacity:1;transform:none}}
@keyframes hm-slide-back{from{opacity:0;transform:translateX(24px)}to{opacity:1;transform:none}}
.hm-calc__q{display:block;float:none;width:100%;padding:0;font-size:clamp(20px,2.2vw,24px);font-weight:800;color:var(--hm-ink);line-height:1.25;margin:0 0 6px;outline:none}
.hm-calc__q:focus-visible{outline:none;box-shadow:none;text-decoration:underline;text-decoration-color:var(--hm-olive);text-underline-offset:6px}
.hm-calc__hint{color:var(--calc-muted);font-size:14px;margin:0 0 16px}
.hm-calc__opt{font-weight:500;color:var(--calc-muted);font-size:13px}
.hm-calc__help{display:block;font-size:12.5px;color:var(--calc-muted);margin-top:6px}
.hm-calc__prefill{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;background:var(--hm-olive-soft);border-radius:var(--hm-radius-md);padding:10px 14px;margin:0 0 16px;font-size:14px;color:var(--hm-ink)}

/* option cards (radios stay focusable for keyboard / arrow keys) */
.hm-calc__cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.hm-calc__cards--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.hm-calc__cards--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.hm-calc__card,.hm-body-card{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:44px;border:2px solid var(--hm-line);border-radius:var(--hm-radius-lg);padding:18px 14px;text-align:center;cursor:pointer;background:var(--hm-cream-accent);transition:border-color .15s,background .15s,transform .15s,box-shadow .15s;user-select:none;-webkit-tap-highlight-color:transparent}
.hm-calc__card:hover,.hm-body-card:hover{border-color:var(--hm-olive);transform:translateY(-1px)}
.hm-calc__card input,.hm-body-card input,.hm-calc__chip input,.hm-calc__check input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.hm-calc__card.is-selected,.hm-body-card.is-selected,.hm-calc__card:has(input:checked),.hm-body-card:has(input:checked){border-color:var(--hm-olive);background:var(--hm-olive-soft);box-shadow:var(--hm-shadow)}
.hm-calc__card:focus-within,.hm-body-card:focus-within,.hm-calc__chip:focus-within,.hm-calc__check:focus-within{box-shadow:var(--calc-focus)}
.hm-calc__card:has(input:focus:not(:focus-visible)),.hm-body-card:has(input:focus:not(:focus-visible)),.hm-calc__chip:has(input:focus:not(:focus-visible)),.hm-calc__check:has(input:focus:not(:focus-visible)){box-shadow:none}
.hm-calc__card:has(input:checked:focus:not(:focus-visible)),.hm-body-card:has(input:checked:focus:not(:focus-visible)){box-shadow:var(--hm-shadow)}
.hm-calc__card:has(input:focus-visible),.hm-body-card:has(input:focus-visible),.hm-calc__chip:has(input:focus-visible),.hm-calc__check:has(input:focus-visible){box-shadow:var(--calc-focus)}
.hm-calc__card:has(input:checked:focus-visible),.hm-body-card:has(input:checked:focus-visible){box-shadow:var(--calc-focus),var(--hm-shadow)}
.hm-calc__card svg{width:44px;height:44px;color:var(--hm-olive);margin:0 auto 8px}
.hm-calc__card strong{display:block;color:var(--hm-ink);font-size:17px}
.hm-calc__card small{color:var(--calc-muted);font-size:12.5px;line-height:1.35;margin-top:2px}
.hm-calc__card--photo{padding:0;overflow:hidden;justify-content:flex-start}
.hm-calc__card-art{display:grid;place-items:center;width:100%;aspect-ratio:1/1;max-height:220px;background:var(--hm-cream-2);border-radius:calc(var(--hm-radius-lg) - 2px) calc(var(--hm-radius-lg) - 2px) 0 0;overflow:hidden}
.hm-calc__card-art img{width:100%;height:100%;object-fit:cover;display:block}
.hm-calc__card-art svg{width:56px;height:56px;margin:0}
.hm-calc__card--photo strong{padding:12px 12px 14px}
.hm-calc__card--photo.is-selected .hm-calc__card-art,.hm-calc__card--photo:has(input:checked) .hm-calc__card-art{background:#fff}

/* body condition: original illustration when in the media library, inline drawing otherwise */
.hm-body-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.hm-body-card{padding:14px 12px 16px}
.hm-body-card__art{display:block;width:100%;height:96px}
.hm-body-card__pic{display:grid;place-items:center;width:100%;height:100%}
.hm-body-card__pic img{width:100%;height:100%;object-fit:contain;display:block}
.hm-body-card__pic svg{width:100%;height:100%;max-width:200px;color:var(--hm-ink)}
.hm-body-card strong{display:block;margin-top:8px;color:var(--hm-ink);font-size:16px}
.hm-body-card small{color:var(--calc-muted);font-size:12.5px;display:block;line-height:1.35}

/* chips + checks */
.hm-calc__chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.hm-calc__chip{position:relative;display:inline-flex;align-items:center;min-height:44px;border:2px solid var(--hm-line);border-radius:var(--hm-radius-pill);padding:8px 18px;cursor:pointer;background:var(--hm-cream-accent);font-size:15px;font-weight:600;color:var(--hm-ink);transition:background .15s,border-color .15s,color .15s;-webkit-tap-highlight-color:transparent}
.hm-calc__chip.is-selected,.hm-calc__chip:has(input:checked){background:var(--hm-olive);color:#fff;border-color:var(--hm-olive)}
.hm-calc__chip:hover{border-color:var(--hm-olive)}
.hm-calc__check{position:relative;display:flex;align-items:center;gap:12px;min-height:44px;padding:12px 14px;border:2px solid var(--hm-line);border-radius:var(--hm-radius-md);background:var(--hm-cream-accent);cursor:pointer;max-width:520px}
.hm-calc__check::before{content:"";flex:none;width:22px;height:22px;border-radius:6px;border:2px solid var(--hm-olive);background:#fff;display:grid;place-items:center;transition:background .15s}
.hm-calc__check.is-selected::before,.hm-calc__check:has(input:checked)::before{background:var(--hm-olive) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 4 4L19 6'/%3E%3C/svg%3E") center/16px no-repeat}
.hm-calc__check strong{display:block;color:var(--hm-ink);font-size:15px}
.hm-calc__check small{display:block;color:var(--calc-muted);font-size:12.5px}

/* fields */
.hm-calc__row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.hm-calc__row--age{margin-top:14px}
.hm-calc__field{margin-bottom:0}
.hm-calc__field label{display:block;font-weight:700;color:var(--hm-ink);margin-bottom:6px}
.hm-calc__field input{width:100%;height:52px;border:2px solid var(--hm-line);border-radius:var(--hm-radius-md);padding:0 14px;font:inherit;font-size:17px;background:#fff;color:var(--hm-ink);transition:border-color .15s,box-shadow .15s}
.hm-calc__field input:hover{border-color:#cfc6b4}
.hm-calc__field input:focus{outline:none;border-color:var(--hm-olive)}
.hm-calc__field input:focus-visible{outline:none;box-shadow:var(--calc-focus)}
.hm-calc__field input::placeholder{color:#B5B0A5}
.hm-calc__unit{position:relative;display:flex;align-items:center;direction:ltr}
.hm-calc__unit input{direction:ltr;text-align:left;padding-left:16px;padding-right:72px;font-variant-numeric:tabular-nums}
.hm-calc__unit span{position:absolute;right:16px;top:50%;transform:translateY(-50%);font-size:14px;font-weight:700;color:var(--calc-muted);pointer-events:none;direction:rtl}
.hm-calc__unit--big{max-width:280px}
.hm-calc__unit--big input{height:60px;font-size:24px;font-weight:700}
.hm-calc__field--weight,.hm-calc__field--name{max-width:420px}
.hm-calc__unit input::-webkit-outer-spin-button,.hm-calc__unit input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.hm-calc__unit input[type=number]{-moz-appearance:textfield;appearance:textfield}
.hm-calc__step.has-error .hm-calc__field input,.hm-calc__step.has-error .hm-calc__unit input{border-color:var(--hm-err,#B3261E)}
.hm-calc__err{margin:10px 0 0;font-size:14px;font-weight:600;color:var(--hm-err,#B3261E);background:var(--hm-err-bg,#FDECEC);border:1px solid var(--hm-err-line,#F3C4C4);border-radius:var(--hm-radius-md);padding:8px 12px}
.hm-calc__note{display:block;font-size:13.5px;color:var(--hm-text);background:var(--hm-cream-2);border-radius:var(--hm-radius-md);padding:10px 12px;margin:14px 0 0;line-height:1.5}
.hm-calc__note svg{width:18px;height:18px;color:var(--hm-olive);vertical-align:-4px;margin-inline-end:6px}
.hm-calc__note--soft{background:var(--hm-olive-soft)}
.hm-calc__note--warn{background:#FCEBDD;color:var(--calc-warn)}
.hm-calc__track{font-size:13.5px;color:var(--calc-muted);margin:-6px 0 12px;text-align:center}

/* nav */
.hm-calc__nav{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:22px;padding-top:16px;border-top:1px solid var(--hm-line);background:#fff}
.hm-calc__nav .hm-btn{min-width:130px}
.hm-calc__nav .hm-btn:focus-visible{outline:none;box-shadow:var(--calc-focus)}
.hm-calc__nav .hm-btn--buy:focus-visible,.hm-calc__nav .hm-btn--primary:focus-visible{box-shadow:0 0 0 3px #fff,0 0 0 6px var(--hm-ink)}
.hm-calc__nav-spacer{flex:1}

/* result */
.hm-calc__result[aria-live]{outline:none}
.hm-calc__result-hero{position:relative;background:linear-gradient(135deg,#537F28,#456B21);color:#fff;border-radius:var(--hm-radius-lg);padding:26px 24px 22px;text-align:center;margin-bottom:14px;outline:none}
.hm-calc__result-hero small{display:block;opacity:.95;font-size:15px}
.hm-calc__result-hero .big{font-size:clamp(48px,6vw,64px);font-weight:800;line-height:1.05;margin:4px 0 6px;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.hm-calc__result-hero #hm-r-cost-sub{font-size:13.5px;opacity:.9;max-width:52ch;margin-inline:auto;line-height:1.45}
.hm-calc__result-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:14px}
.hm-calc__result-box{background:var(--hm-cream-accent);border:1px solid var(--hm-line);border-radius:var(--hm-radius-md);padding:14px 12px;text-align:center}
.hm-calc__result-box strong{display:block;font-size:26px;color:var(--hm-olive-dark);line-height:1.15;font-variant-numeric:tabular-nums}
.hm-calc__result-box span{font-size:14.5px;line-height:1.35;color:var(--calc-muted);display:block;margin-top:3px}
.hm-calc__result-box--pack{background:#fff;border-color:var(--hm-olive)}
.hm-calc__result-box--pack strong{color:var(--hm-orange-dark)}
#hm-r-pack.hm-lead{font-size:17px;line-height:1.6;margin:0 0 6px;color:var(--hm-ink)}
#hm-r-pack.hm-lead strong{color:var(--hm-olive);font-weight:700}
#hm-r-context{margin-top:10px}
#hm-r-allergy{margin-top:10px}

/* pick tiles */
.hm-cost{margin-top:18px}
.hm-cost h3{font-size:18px;margin:0 0 4px}
.hm-pick{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:12px;max-height:none;overflow:visible;padding:0}
.hm-pick__item{position:relative;min-height:44px;background:#fff;border:2px solid var(--hm-line);border-radius:var(--hm-radius-md);padding:12px 10px 10px;text-align:center;cursor:pointer;font:inherit;color:var(--hm-ink);display:flex;flex-direction:column;gap:3px;align-items:center;transition:border-color .15s,box-shadow .15s,transform .15s;-webkit-tap-highlight-color:transparent}
.hm-pick__item:hover{border-color:var(--hm-olive);transform:translateY(-1px)}
.hm-pick__item:focus-visible{outline:none;box-shadow:var(--calc-focus)}
.hm-pick__item.is-on{border-color:var(--hm-olive);background:var(--hm-olive-soft);box-shadow:var(--hm-shadow)}
.hm-pick__item.is-on::after{content:"\2713";position:absolute;top:8px;left:8px;width:24px;height:24px;border-radius:50%;background:var(--hm-olive);color:#fff;font-size:14px;display:grid;place-items:center}
.hm-pick__item img,.hm-pick__ph{width:72px;height:72px;object-fit:cover;border-radius:10px;background:var(--hm-cream-2);display:block}
.hm-pick__name{font-weight:700;font-size:13.5px;color:var(--hm-ink);line-height:1.25;min-height:2.5em;display:flex;align-items:center}
.hm-pick__sub{font-size:11.5px;color:var(--calc-muted)}
.hm-pick__day{font-weight:800;color:var(--hm-olive-dark);font-size:16px;margin-top:2px}
.hm-pick__day2{font-size:11.5px;color:var(--calc-muted)}
.hm-pick__rec{position:absolute;top:8px;right:8px;background:var(--hm-olive);color:#fff;font-size:10.5px;font-weight:700;border-radius:999px;padding:3px 8px;max-width:calc(100% - 44px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hm-pick__more{border-style:dashed;justify-content:center;color:var(--hm-olive-dark);background:var(--hm-cream-accent)}
.hm-sum{margin-top:14px;background:#fff;border:1px solid var(--hm-line);border-radius:var(--hm-radius-md);overflow:hidden}
.hm-sum__scroll{overflow-x:auto}
.hm-sum table{width:100%;border-collapse:collapse;font-size:14px}
.hm-sum th{font-size:12px;color:var(--calc-muted);font-weight:600;text-align:right;padding:10px;border-bottom:1px solid var(--hm-line);white-space:nowrap}
.hm-sum td{padding:10px;border-bottom:1px solid var(--hm-line);vertical-align:middle;white-space:nowrap;font-variant-numeric:tabular-nums}
.hm-sum td:first-child{white-space:normal;min-width:160px}
.hm-sum td small{display:block;color:var(--calc-muted);font-size:11.5px;font-weight:400}
.hm-sum td b{color:var(--hm-olive-dark);font-size:16px}
.hm-sum tr.is-avg td{background:var(--hm-olive-soft);font-weight:700}
.hm-sum__foot{padding:10px 12px;font-size:12.5px;color:var(--calc-muted)}

/* CTAs */
.hm-calc__ctas{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:18px;padding-top:16px;border-top:1px solid var(--hm-line)}
.hm-calc__ctas .hm-btn{flex:1 1 220px;min-height:52px}
.hm-calc__ctas .hm-btn:focus-visible{outline:none;box-shadow:var(--calc-focus)}
.hm-calc__ctas .hm-btn--buy:focus-visible{box-shadow:0 0 0 3px #fff,0 0 0 6px var(--hm-ink)}
.hm-calc__save-msg{margin:12px 0 0;font-size:14px;font-weight:600;border-radius:var(--hm-radius-md);padding:10px 12px;background:var(--hm-cream-2);color:var(--hm-ink)}
.hm-calc__save-msg.is-ok{background:var(--hm-olive-soft);color:var(--hm-olive-dark)}
.hm-calc__save-msg.is-err{background:var(--hm-err-bg,#FDECEC);color:var(--hm-err,#B3261E)}
.hm-calc__save-msg a{font-weight:700;text-decoration:underline}
.hm-trial--calc{margin-top:22px;min-width:0}
.hm-trial--calc>*{min-width:0}
.hm-trial--calc .hm-trial__cards{min-width:0}
.hm-trial--calc .hm-card{min-width:0}
.hm-trial--calc .hm-card__actions .hm-btn{white-space:normal;line-height:1.2}
.hm-calc__again{margin:18px 0 0;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.hm-calc__again-link{font-size:14px;font-weight:700;text-decoration:underline;text-underline-offset:3px}
.hm-calc .hm-btn:disabled,.hm-calc .hm-btn.is-disabled{opacity:.55;cursor:not-allowed;transform:none}

/* embedded on a product page: tighter top spacing */
.hm-calc--embedded{margin-top:0}

/* ---- My Pets ---- */
.hm-pets-page__intro{margin-bottom:16px}
.hm-pets__lead{font-size:14px;color:var(--calc-muted);margin:0 0 14px}
.hm-pets__demo{display:inline-block;font-size:13px;font-weight:700;color:var(--calc-warn);background:#FCEBDD;border-radius:var(--hm-radius-pill);padding:6px 12px;margin-bottom:14px}
.hm-pets__unsaved{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;background:var(--hm-olive-soft);border-radius:var(--hm-radius-md);padding:12px 14px;margin-bottom:16px;font-size:14px;color:var(--hm-ink)}
.hm-pets{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:16px}
.hm-pet{position:relative;background:var(--hm-cream-accent);border:2px solid var(--hm-line);border-radius:var(--hm-radius-lg);padding:18px;display:flex;flex-direction:column;gap:10px;transition:border-color .15s,box-shadow .15s}
.hm-pet.is-active{border-color:var(--hm-olive);box-shadow:var(--hm-shadow)}
.hm-pet__head{display:flex;align-items:center;gap:12px}
.hm-pet__who{flex:1;min-width:0}
.hm-pet__who strong{font-size:18px;color:var(--hm-ink);display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hm-pet__who span{font-size:13px;color:var(--calc-muted)}
.hm-pet__avatar{width:52px;height:52px;flex:none;border-radius:50%;background:var(--hm-olive-soft);display:grid;place-items:center;color:var(--hm-olive-dark)}
.hm-pet__active{display:none;align-items:center;gap:4px;font-size:12px;font-weight:700;color:#fff;background:var(--hm-olive);border-radius:999px;padding:4px 10px}
.hm-pet__active svg{width:14px;height:14px}
.hm-pet.is-active .hm-pet__active{display:inline-flex}
.hm-pet__stats{display:grid;grid-template-columns:1fr 1fr;gap:6px;font-size:13px;color:var(--calc-muted)}
.hm-pet__stats div{background:#fff;border-radius:var(--hm-radius-md);padding:8px 10px}
.hm-pet__stats b{display:block;color:var(--hm-olive-dark);font-size:15px;line-height:1.3}
.hm-pet__meta{display:flex;flex-wrap:wrap;gap:6px}
.hm-pet__meta span{font-size:12px;background:#fff;border:1px solid var(--hm-line);border-radius:999px;padding:3px 10px;color:var(--hm-text)}
.hm-pet__meta .hm-pet__allergy{background:#FCEBDD;border-color:#F3D3BC;color:var(--calc-warn)}
.hm-pet__actions{display:flex;gap:8px;margin-top:auto;flex-wrap:wrap}
.hm-pet__actions .hm-btn{min-height:44px}
.hm-pet__actions .hm-btn:focus-visible{outline:none;box-shadow:var(--calc-focus)}
.hm-pet__remove:hover{border-color:var(--hm-err,#B3261E);color:var(--hm-err,#B3261E);background:var(--hm-err-bg,#FDECEC)}
.hm-pet__msg{margin:0;font-size:13px;color:var(--hm-olive-dark)}
.hm-pet__msg.is-err{color:var(--hm-err,#B3261E)}
.hm-pet.is-busy{opacity:.6;pointer-events:none}
.hm-pet.is-leaving{opacity:0;transform:scale(.97);transition:opacity .2s,transform .2s}
.hm-pet--add{align-items:center;justify-content:center;text-align:center;border-style:dashed;color:var(--calc-muted);min-height:180px;text-decoration:none}
.hm-pet--add:hover{border-color:var(--hm-olive);color:var(--hm-olive-dark)}
.hm-pet--add:focus-visible{outline:none;box-shadow:var(--calc-focus)}
.hm-pet--add svg{width:40px;height:40px;color:var(--hm-olive)}
.hm-pet--add strong{color:var(--hm-ink);font-size:16px}
.hm-pet--add small{font-size:13px}
.hm-pets__empty{text-align:center;background:var(--hm-cream-accent);border:1px dashed var(--hm-line);border-radius:var(--hm-radius-lg);padding:36px 20px;max-width:560px;margin-inline:auto}
.hm-pets__empty-ico{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--hm-olive-soft);color:var(--hm-olive-dark);margin:0 auto 12px}
.hm-pets__empty-ico svg{width:32px;height:32px}
.hm-pets__empty h3{font-size:20px;margin-bottom:6px}
.hm-pets__empty p{color:var(--hm-text);font-size:15px;margin:0 auto 16px;max-width:44ch}
.hm-club__box{background:var(--hm-cream-accent);border:1px dashed var(--hm-line);border-radius:var(--hm-radius-lg);padding:32px 20px;text-align:center;max-width:560px}
.hm-club__ico{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--hm-olive-soft);color:var(--hm-olive-dark);margin:0 auto 12px}
.hm-club__ico svg{width:30px;height:30px}
.hm-club__box h3{font-size:20px;margin-bottom:6px}
.hm-club__box p{color:var(--hm-text);font-size:15px}

/* ---- responsive ---- */
@media (max-width:820px){
  .hm-calc__cards--4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hm-calc__result-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hm-pick{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hm-sum{overflow-x:auto}
  .hm-sum th:nth-child(4),.hm-sum td:nth-child(4){display:none}
}
@media (max-width:640px){
  .hm-calc{padding:18px 14px 14px;border-radius:var(--hm-radius-lg)}
  .hm-calc__steps{min-height:360px}
  .hm-calc__cards--2{gap:10px}
  .hm-calc__card{padding:16px 10px}
  .hm-calc__card-art{max-height:150px}
  .hm-body-cards{grid-template-columns:1fr;gap:10px}
  .hm-body-card{flex-direction:row;text-align:right;gap:12px;padding:10px 12px;align-items:center}
  .hm-body-card__art{width:118px;height:64px;flex:none}
  .hm-body-card strong{margin-top:0}
  .hm-body-card .hm-body-card__art+strong{flex:1}
  .hm-body-card small{flex-basis:100%;display:none}
  .hm-body-card__text{flex:1}
  .hm-calc__row{grid-template-columns:1fr}
  .hm-calc__unit--big{max-width:none}
  .hm-calc__nav{position:sticky;bottom:0;z-index:5;margin:18px 0 0;padding:12px 0 calc(12px + env(safe-area-inset-bottom));box-shadow:0 -10px 16px -6px rgba(60,50,20,.08)}
  .hm-calc__nav .hm-btn{min-width:0;flex:1}
  .hm-calc__nav .hm-btn--ghost{flex:0 0 auto;min-width:96px}
  .hm-calc__result-hero{padding:22px 16px 18px}
  .hm-calc__result-hero .big{font-size:52px}
  .hm-calc__result-box strong{font-size:22px}
  .hm-pick__item img,.hm-pick__ph{width:64px;height:64px}
  .hm-sum td:first-child{min-width:120px}
  .hm-sum th,.hm-sum td{padding:8px 6px;font-size:13px}
  .hm-sum td:last-child{white-space:normal;min-width:70px}
  .hm-calc__ctas .hm-btn{flex:1 1 100%}
  .hm-pets{grid-template-columns:1fr}
  .hm-trial--calc .hm-trial__cards{grid-template-columns:1fr}
  .hm-trial--calc{padding:16px 14px}
  .hm-pets__unsaved .hm-btn{width:100%}
}
@media (prefers-reduced-motion:reduce){
  .hm-calc *,.hm-pets-wrap *{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .hm-calc__card:hover,.hm-body-card:hover,.hm-pick__item:hover{transform:none}
}

/* PM fix K-02 */
@media (max-width:640px){.hm-calc__result .hm-calc__stats,.hm-calc__result-grid{align-items:stretch}.hm-calc__result-box{height:100%}}
/* PM fix: real body-condition images keep to the 96px art box */
.hm-calc .hm-body-card__pic{overflow:hidden}
.hm-calc .hm-body-card__pic img{width:auto;max-width:100%;height:96px;max-height:100%;object-fit:contain;mix-blend-mode:multiply}
@media (max-width:640px){.hm-calc .hm-body-card__pic img{height:64px}}

/* Typography boost (David, Aug 19): the calculator text was too small; the instruction line is now the loudest element after the question */
.hm-calc__stepnum{font-size:15px}
.hm-calc__q{font-size:clamp(24px,2.6vw,30px)}
.hm-calc__hint{font-size:clamp(16px,1.6vw,18px);color:var(--hm-text);margin:0 0 18px;line-height:1.55}
.hm-calc__opt{font-size:14.5px}
.hm-calc__help{font-size:14.5px}
.hm-calc__card strong{font-size:19px}
.hm-calc__card small{font-size:14.5px;line-height:1.4}
.hm-body-card strong{font-size:17.5px}
.hm-body-card small{font-size:14px}
.hm-calc__chip{font-size:16.5px}
.hm-calc__check strong{font-size:16.5px}
.hm-calc__check small{font-size:14px}
.hm-calc__unit span{font-size:15px}
.hm-calc__err{font-size:15.5px}
.hm-calc__note{font-size:15.5px}
.hm-calc__track{font-size:15px}
.hm-calc__prefill{font-size:15.5px}
.hm-calc__result-hero small{font-size:16.5px}
.hm-calc__result-hero #hm-r-cost-sub{font-size:15px}
.hm-calc__result-box span{font-size:16px}
#hm-r-pack.hm-lead{font-size:19px}
.hm-pick__name{font-size:15px}
.hm-pick__sub,.hm-pick__day2{font-size:13px}
.hm-sum table{font-size:15px}
.hm-sum th{font-size:13px}
.hm-sum td small{font-size:13px}
.hm-sum__foot{font-size:14px}
.hm-pets__lead{font-size:15.5px}
.hm-calc__save-msg{font-size:15px}
.hm-calc__card--photo strong{padding:12px 12px 2px}
.hm-calc__card--photo small{padding:0 12px 14px;margin-top:0}

/* step 7: current diet + freezer sub-question */
.hm-calc__sub{margin-top:18px;padding-top:14px;border-top:1px dashed var(--hm-line)}
.hm-calc__hint--q{margin:0 0 10px}
.hm-calc__hint--q strong{color:var(--hm-ink,inherit)}
#hm-pick-note{margin:0 0 12px}
@media (max-width:640px){.hm-calc__cards--4{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* step 4: activity clip (real video, loaded only on step 4) */
.hm-act-stage{position:relative;margin-top:14px;aspect-ratio:16/7;overflow:hidden;border-radius:14px;background:#e9e4d8}
@media (max-width:640px){.hm-act-stage{aspect-ratio:16/9}}
.hm-act-stage__poster,.hm-act-stage__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.hm-act-stage__video{opacity:0;transition:opacity .45s}
.hm-act-stage.is-playing .hm-act-stage__video{opacity:1}
.hm-act-stage.is-still .hm-act-stage__poster{animation:hm-kb 14s ease-in-out infinite alternate}
@keyframes hm-kb{from{transform:scale(1)}to{transform:scale(1.08)}}
@media (prefers-reduced-motion:reduce){.hm-act-stage.is-still .hm-act-stage__poster{animation:none}}

/* compact */
.hm-calc{padding:clamp(16px,2.4vw,26px)}
.hm-calc__progress{margin-bottom:12px;height:6px}
.hm-calc__stepnum{margin-bottom:2px}
.hm-calc__q{font-size:clamp(20px,2.4vw,26px);margin-bottom:4px}
.hm-calc__hint{margin-bottom:10px;font-size:13px}
.hm-calc__steps{min-height:0}
.hm-calc__cards{gap:10px}
.hm-calc__card{padding:12px 10px}
.hm-calc__card small{font-size:11.5px}
.hm-body-card{padding:10px}
.hm-calc__field{margin-bottom:10px}
.hm-calc__nav{margin-top:14px;padding-top:12px}
.hm-act-stage{aspect-ratio:16/6;margin-top:12px}
.hm-calc__sub{margin-top:12px;padding-top:10px}

/* product page: collapsed calculator for a customer with a saved pet */
.hm-calc-saved{display:flex;align-items:center;justify-content:space-between;gap:12px 18px;flex-wrap:wrap;background:#fff;border:1px solid var(--hm-line);border-radius:var(--hm-radius-xl);padding:14px 20px;max-width:900px;margin:0 auto}
.hm-calc-saved__text{margin:0;font-size:15px;color:var(--hm-ink)}
.hm-calc-saved__text b{color:var(--hm-olive)}
/* 11.9.2026 David from his phone: the small helper text under the fields reads too light on iPhone. Darker and one size up. */
.hm-calc__help{color:#55554F;font-size:15px}
/* 11.9.2026 desktop: the step slides in with a transform animation (fill-mode both), which leaves the step as its own stacking context,
   so the breed suggestion list (z-index 30 inside the step) was painted UNDER the "חזרה" button that comes later in the DOM.
   Lifting the active step above the nav fixes the overlap without touching the animation. */
.hm-calc__step.is-active{position:relative;z-index:2}
/* 11.9.2026 evening: no-freeze packs shown to a dog that has a freezer carry a small tag */
.hm-pick__tag{display:block;margin-top:4px;font-size:.8em;font-weight:600;color:#4F4F48}
/* 12.9.2026 David: out-of-stock packs stay visible in the calculator list, greyed, not selectable */
.hm-pick__item.is-oos{opacity:.6;cursor:default;filter:grayscale(.35)}
.hm-pick__item.is-oos:hover{transform:none;box-shadow:none}
.hm-pick__oos{display:block;margin-top:6px;font-size:.8em;font-weight:700;color:#8A4A1F}
