/* Homepage: gift-box teaser for the lead magnet + winter parcel set (club preview). Uses site theme vars:
   light — --panel #fff, --text #20291e, --muted #596354, --accent #d5ff00; dark — --panel #191c1e, --text #f5f5f0, --lime #d5ff00. */

/* ---- gift box teaser ---- */
.lead-gift{padding-top:0}
.gift-card{display:grid;grid-template-columns:320px minmax(0,1fr);gap:52px;align-items:center;padding:36px 52px;border:1px solid var(--line);border-radius:24px;background:var(--panel);color:inherit;text-decoration:none;overflow:hidden}
.gift-card:focus-visible{outline:3px solid var(--accent,#d5ff00);outline-offset:4px}
.gift-text h2{font-size:clamp(32px,3.6vw,52px);line-height:1.05;letter-spacing:-1.5px;margin:16px 0 18px}
.gift-text p{max-width:520px;font-size:17px;line-height:1.65;color:var(--muted);margin:0 0 26px}
.gift-text .button{display:inline-flex}

.gift{width:290px;max-width:100%;margin:0 auto;animation:gift-wiggle 4.5s ease-in-out 1.5s infinite;transform-origin:50% 92%}
.gift svg{display:block;width:100%;height:auto;overflow:visible}
.gift-card{--gift-ribbon:#0f1113}
html[data-theme="dark"] .gift-card{--gift-ribbon:#f5f5f0}
.g-rib{fill:var(--gift-ribbon)}
.g-hl{fill:none;stroke:rgba(255,255,255,.35);stroke-width:2.5;stroke-linecap:round}
html[data-theme="dark"] .g-hl{stroke:rgba(15,17,19,.25)}
.g-lidtop{fill:#ecff80}
.g-inside{fill:#6f8a00}
.g-shade{fill:rgba(0,0,0,.07)}
.g-shadow{fill:rgba(0,0,0,.14)}
.g-paper{fill:#fff;stroke:rgba(0,0,0,.08)}
.g-t1{font:800 15px Inter,system-ui,sans-serif;fill:#20291e;text-anchor:middle}
.g-t2{font:500 11px Inter,system-ui,sans-serif;fill:#596354;text-anchor:middle}
.g-lid{transform-box:fill-box;transform-origin:50% 100%;transition:transform .6s cubic-bezier(.3,1.35,.5,1)}
.g-note{opacity:0;transition:transform .65s cubic-bezier(.3,1.35,.5,1) .1s,opacity .25s .1s}

.gift-card:hover .gift,.gift-card:focus-visible .gift,.gift-card.is-open .gift{animation:none}
.gift-card:hover .g-lid,.gift-card:focus-visible .g-lid,.gift-card.is-open .g-lid{transform:translateY(-94px) rotate(-9deg)}
.gift-card:hover .g-note,.gift-card:focus-visible .g-note,.gift-card.is-open .g-note{opacity:1;transform:translateY(-82px)}

@keyframes gift-wiggle{0%,82%,100%{transform:rotate(0)}86%{transform:rotate(-4deg)}90%{transform:rotate(4deg)}94%{transform:rotate(-2deg)}}

/* ---- winter parcel set ---- */
.pb-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.pb-item{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--panel)}
.pb-item img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;background:#ecece6}
.pb-copy{padding:22px 24px 24px}
.pb-copy h3{font-size:22px;line-height:1.25;letter-spacing:-.4px;margin:0 0 16px}
.pb-prices{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:end}
.pb-prices span{display:block;font-size:13px;color:var(--muted);margin-bottom:4px}
.pb-prices s{font-size:20px;font-weight:600;color:var(--muted);text-decoration-thickness:2px}
.pb-prices b{font-size:30px;font-weight:800;letter-spacing:-.5px;color:var(--text)}
.pb-x{display:inline-block;margin-top:16px;padding:4px 10px;border-radius:8px;background:var(--accent,#d5ff00);color:#20291e;font-size:14px;font-weight:800}
.pb-total{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:24px}
.pb-total>div{border:1px solid var(--line);border-radius:16px;padding:18px 22px;background:var(--panel)}
.pb-total span{display:block;font-size:14px;line-height:1.4;color:var(--muted);margin-bottom:6px}
.pb-total b{font-size:32px;font-weight:800;letter-spacing:-.6px;color:var(--text);font-variant-numeric:tabular-nums}
.pb-total .pb-save{border-color:transparent;background:var(--accent,#d5ff00)}
.pb-total .pb-save span,.pb-total .pb-save b{color:#20291e}

@media (max-width:860px){
  .gift-card{grid-template-columns:1fr;gap:8px;padding:28px 24px 32px;text-align:left}
  .gift{width:260px}
  .pb-grid,.pb-total{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  .gift{animation:none}
  .g-lid,.g-note{transition:none}
  .g-lid{transform:translateY(-94px) rotate(-9deg)}
  .g-note{opacity:1;transform:translateY(-82px)}
}
