/* WarmGearReport: gift-guide.html (heated gifts for people who are always cold), sorted by body zone.
   Shared blocks are in hub.css. */
.gift-hero .byline{margin-top:1rem}
.gift-hero .phero__lede{max-width:40rem;text-wrap:pretty}

/* where they get cold: one tile per body zone */
.zonepick{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem}
.zonepick__item{display:flex;flex-direction:column;border-radius:var(--r-m);background:#fff;box-shadow:var(--sh-1);overflow:hidden;text-decoration:none;color:var(--ink);transition:transform .2s,box-shadow .2s}
.zonepick__item:hover{transform:translateY(-3px);box-shadow:var(--sh-2)}
.zonepick__img{position:relative;aspect-ratio:4/3;background:var(--frost)}
.zonepick__img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.zonepick__body{position:relative;display:grid;gap:.1rem;padding:1.5rem .8rem .85rem}
.zonepick__ico{position:absolute;left:.8rem;top:-1.25rem;display:grid;place-items:center;width:2.5rem;height:2.5rem;border-radius:13px;background:var(--ember-600);color:#fff;box-shadow:var(--sh-1)}
.zonepick b{font:700 1.02rem/1.2 var(--display)}
.zonepick small{font-size:.78rem;font-weight:650;color:var(--muted)}
.zonepick__item:last-child:nth-child(odd){grid-column:1/-1}

/* shopping for: personas that jump to their zones */
.shopfor{display:grid;gap:.6rem;margin-top:1.25rem;padding:1rem 1.1rem;border-radius:var(--r-l);background:#fff;border:1px solid var(--line)}
.shopfor__head{display:flex;align-items:center;gap:.4rem;font-weight:750;color:var(--ink)}
.shopfor__head .ic{color:var(--ember-600)}
.shopfor .subtopics a small{white-space:nowrap}

/* one section per zone */
.giftzone{padding-block:clamp(1.75rem,1.25rem + 2vw,3rem)}
.giftzone--tint{background:linear-gradient(180deg,rgb(234 241 248/0),#eaf1f8 12%,#eaf1f8 88%,rgb(234 241 248/0))}
.giftzone .head{margin-bottom:1.25rem}
.giftzone__grid{display:grid;gap:.85rem;align-items:stretch}
.giftzone__tips{display:grid;gap:.85rem;margin-top:.85rem}
.giftzone .prod h3{font-size:1rem}
.prod__tip{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.45rem;margin-top:.75rem;padding:.6rem .7rem;border-radius:12px;background:var(--glow-tint);font-size:.82rem;line-height:1.45;color:#5a4120}
.prod__tip .ic{width:1rem;height:1rem;margin-top:.1rem;color:var(--ember-600)}
.prod__tip b{color:var(--ink)}
.prod__note{margin-top:.55rem;font-size:.84rem;color:var(--muted)}
.giftzone .prod__why{display:inline-flex;align-items:center;justify-content:center;gap:.3rem;min-height:2.75rem}
.prod--sample .prod__media{aspect-ratio:16/10}

/* a zone's tip: a quiet card beside the picks */
.gifttip{display:flex;flex-direction:column;align-items:flex-start;gap:.45rem;padding:1.15rem 1.15rem 1.2rem;border-radius:var(--r-m);background:#fff;border:1.5px dashed var(--line-2)}
.gifttip__ico{display:grid;place-items:center;width:2.6rem;height:2.6rem;border-radius:13px;background:var(--ember-tint);color:var(--ember-600)}
.gifttip b{font:700 1.05rem/1.25 var(--display);color:var(--ink)}
.gifttip p{font-size:.9rem;line-height:1.55;color:var(--text)}
.gifttip .more-link{display:inline-flex;align-items:center;min-height:2.5rem}

/* before you wrap it */
.giftcheck{display:grid;gap:1.25rem;padding:clamp(1.25rem,1rem + 1.5vw,2.25rem);border-radius:var(--r-xl);background:#fff;box-shadow:var(--sh-1)}
.giftcheck__head h2{margin-top:.7rem;font-size:clamp(1.5rem,1.2rem + 1.2vw,2.2rem)}
.giftcheck__head p{margin-top:.5rem;color:var(--muted)}
.giftcheck__img{display:none}
.giftcheck .checks{margin-top:0}
#more .teambox{margin-top:1.5rem}

@media (min-width:40rem){
  .giftzone__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .giftzone__grid>:last-child:nth-child(odd){grid-column:1/-1}
  .giftzone__tips{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (min-width:48rem){
  .zonepick{grid-template-columns:repeat(4,minmax(0,1fr))}
  .zonepick__item:last-child:nth-child(odd){grid-column:auto}
}
@media (min-width:64rem){
  .zonepick{grid-template-columns:repeat(7,minmax(0,1fr))}
  .shopfor{grid-template-columns:auto minmax(0,1fr);align-items:center;gap:1rem}
  .giftzone__grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .giftzone__grid>:last-child:nth-child(odd){grid-column:auto}
  .giftzone__grid>.gifttip:nth-child(2){grid-column:span 2}
  .giftcheck{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:2.5rem;align-items:start}
  .giftcheck__img{display:block;width:100%;height:auto;margin-top:1.25rem;border-radius:var(--r-l);aspect-ratio:4/3;object-fit:cover}
}
@media (min-width:40rem){.giftzone__grid--three>:last-child:nth-child(odd){grid-column:auto}}
@media (min-width:48rem){.giftzone__grid--three{grid-template-columns:repeat(3,minmax(0,1fr))}}
.gifttip .more-link,.prod--sample .btn{white-space:normal;text-align:left}
.giftzone__grid>.gifttip{justify-content:center}

/* ===== tidy pass (2026-10-18): phones see the zones as a rail and the sample picks as compact rows ===== */
@media (max-width:39.99rem){
  .zonepick.rail-sm{grid-template-columns:none;grid-auto-columns:min(8.5rem,38%)}
  .giftzone__grid--three .prod__media{aspect-ratio:16/10}
  .zonepick.rail-sm>.zonepick__item:last-child:nth-child(odd){grid-column:auto}
  .zonepick__body{padding:1.3rem .7rem .7rem}
  .shopfor .subtopics{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  .shopfor .subtopics a{flex:none}
  .giftzone .prod--sample{display:grid;grid-template-columns:7.5rem minmax(0,1fr)}
  .giftzone .prod--sample .prod__media{aspect-ratio:auto;min-height:100%}
  .giftzone .prod--sample .prod__award{left:.4rem;right:auto;bottom:.4rem;top:auto;max-width:calc(100% - .8rem)}
  .giftzone .prod--sample .prod__award>span{font-size:.75rem;padding:.2rem .45rem;white-space:normal;line-height:1.2}
  .giftzone .prod--sample .prod__body{padding:.8rem .9rem .85rem}
  .giftzone .prod--sample .prod__actions{padding-top:.55rem}
  .gifttip{padding:.9rem 1rem 1rem;gap:.3rem}
  .gifttip__ico{width:2.2rem;height:2.2rem;border-radius:11px}
  .gifttip .more-link{min-height:2.75rem}
}

/* post-tidy review (2026-10-18, P3-4): in a one-pick zone at desktop the tip spans two columns beside the pick;
   it now hugs its text at the top instead of stretching to the pick's height */
@media (min-width:64rem){
  .giftzone__grid>.gifttip:nth-child(2){align-self:start}
}