/* Steam & Ink: Gift a Tattoo page (gift.html). Builds on styles.css. */
.gift-page .nav .nav-gift,.gift-page .mnav a[aria-current]{color:#ffd23f}
.gift-hero{--tint:rgba(12,44,28,.5);padding-top:56px}
.gift-cert{--tint:rgba(8,42,68,.5)}
.gift-redeem{--tint:rgba(16,62,44,.48)}
.gift-redeem h2{margin-bottom:.4em}
.gift-redeem .btn{margin:.4em 0 1.2em}

/* holiday bonus banner (off by default) */
.gift-bonus{background:linear-gradient(90deg,#5a1414,#8a2a1a 50%,#5a1414);border-bottom:2px solid #e3c088;box-shadow:0 6px 20px rgba(0,0,0,.4)}
.gift-bonus[hidden]{display:none}
.gb-inner{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:center;gap:4px 14px;padding-top:12px;padding-bottom:12px;text-align:center}
.gb-kick{font:700 .72rem/1.3 var(--caps);letter-spacing:.24em;text-transform:uppercase;color:#ffd23f}
.gb-text{font:700 clamp(1.15rem,3.6vw,1.5rem)/1.2 var(--caps);letter-spacing:.04em;color:#fff3d6}
.gb-note{font:italic 400 1rem/1.3 var(--body);color:#f4dcc0}
.gb-note:empty{display:none}

/* "You're gifting this design" */
.gift-design{display:flex;gap:18px;align-items:flex-start;margin:0 auto 28px;padding:16px;border-radius:6px;border:1px solid rgba(227,192,136,.55);background:linear-gradient(165deg,rgba(16,58,52,.92),rgba(6,28,30,.94));box-shadow:0 14px 34px rgba(0,0,0,.4)}
.gift-design[hidden]{display:none}
.gift-design img{flex:none;width:120px;height:160px;object-fit:cover;border-radius:3px;background:#fbf5e8;padding:4px;border:2px solid #c38a52}
.gift-design img[hidden]{display:none}
.gd-text{min-width:0}
.gd-kick{display:block;font:600 .7rem/1.3 var(--caps);letter-spacing:.2em;text-transform:uppercase;color:var(--jade)}
.gift-design h3{margin:.15em 0 .1em;font:700 1.5rem/1.15 var(--caps);color:var(--cream)}
.gift-design p{margin:0 0 .3em}
.gd-set{font:600 .74rem/1.3 var(--caps);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.gd-price{font:700 1.2rem/1.2 var(--caps);color:var(--brass)}
.gd-tiers{font-size:.98rem;color:var(--muted);line-height:1.35}
.gd-help{font-size:1rem;line-height:1.4;color:var(--cream)}
.gd-note{font-size:.95rem;line-height:1.4;color:var(--muted);font-style:italic}
.gd-clear{margin-top:4px;min-height:44px;padding:0 2px;background:none;border:0;color:var(--brass);font:italic 500 1rem var(--body);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.gift-design [hidden]{display:none}

/* amount picker */
.gift-buy{display:grid;gap:14px;padding:46px 40px 40px}
.gift-h3{margin:0;text-align:center;font:700 1.05rem/1.3 var(--caps);letter-spacing:.2em;text-transform:uppercase;color:var(--brass)}
.amounts{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.amt{min-height:58px;border-radius:5px;border:1.5px solid rgba(227,192,136,.55);background:rgba(4,20,22,.6);color:var(--cream);font:700 1.3rem/1 var(--caps);letter-spacing:.03em;cursor:pointer;transition:background .2s,border-color .2s,transform .15s,box-shadow .2s;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.amt:hover{border-color:var(--brass);background:rgba(227,192,136,.1)}
.amt:active{transform:scale(.97)}
.amt.on{background:var(--metal-btn);color:#24150a;border-color:#f5dcaa;box-shadow:inset 0 1px 0 rgba(255,248,230,.75),0 0 0 3px rgba(227,192,136,.25),0 6px 18px rgba(195,138,82,.3)}
.amt:focus-visible{outline:3px solid var(--jade);outline-offset:3px}
.amt-custom{font-size:1rem;letter-spacing:.12em;text-transform:uppercase}
.custom-amt{display:grid;gap:7px;font:600 .72rem var(--caps);text-transform:uppercase;letter-spacing:.18em;color:var(--brass)}
.custom-amt[hidden]{display:none}
.ca-wrap{display:flex;align-items:center;gap:8px;font:600 1.4rem var(--caps);color:var(--brass)}
.ca-wrap input{flex:1;min-width:0;font:400 20px var(--body);color:var(--cream);background:rgba(4,20,22,.72);border:1px solid rgba(227,192,136,.4);border-radius:3px;padding:12px 14px}
.ca-wrap input:focus{border-color:var(--jade);box-shadow:0 0 0 4px rgba(95,174,143,.16);outline:none}
.amt-hint{margin:0;text-align:center;color:var(--muted);font-size:1rem;line-height:1.45}
.gift-go{min-height:56px;font-size:.9rem;margin-top:4px}
.gift-go.not-linked{filter:saturate(.55);opacity:.88}
.gift-secure{margin:0;text-align:center;color:var(--muted);font-size:.98rem;line-height:1.5}
.gift-secure b{color:var(--cream)}
.gift-preview-note{margin:0;padding:10px 12px;border:1px dashed #ffd23f;border-radius:5px;background:rgba(255,210,63,.08);color:#ffe9a8;text-align:center;font-size:.98rem;line-height:1.4}
.gift-preview-note[hidden]{display:none}
.gift-preview-note.flash{animation:gpn .9s ease}
@keyframes gpn{0%,100%{background:rgba(255,210,63,.08)}30%{background:rgba(255,210,63,.3)}}
.gift-steps{margin-top:34px}

/* certificate form + result */
.cert-form .opt{font:italic 400 .9rem var(--body);letter-spacing:0;text-transform:none;color:var(--muted)}
.cert-code-note{margin:0;padding:12px 14px;border-left:3px solid var(--bronze);background:rgba(4,20,22,.5);color:var(--muted);font-size:.98rem;line-height:1.45}
.cert-out{margin-top:34px;text-align:center}
.cert-out[hidden]{display:none}
.cert-out img{display:block;width:100%;height:auto;border-radius:3px;box-shadow:0 0 0 1px rgba(227,192,136,.5),0 24px 60px rgba(0,0,0,.55)}
.cert-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin:22px 0 10px}
.cert-actions .btn{flex:1 1 180px;max-width:280px}
.cert-print{display:none}

@media (max-width:639px){
  .gift-buy{padding:40px 22px 32px}
  .gift-design{gap:14px;padding:12px}
  .gift-design img{width:92px;height:122px}
  .gift-design h3{font-size:1.25rem}
  .amounts{gap:8px}
  .amt{font-size:1.12rem;min-height:54px;padding:0 2px}
  .amt-custom{font-size:.78rem;letter-spacing:.04em}
}
@media (max-width:359px){
  .amounts{gap:8px}
  .amt{font-size:1.12rem;min-height:54px}
  .amt-custom{font-size:.82rem;letter-spacing:.06em}
  .gift-design{flex-direction:column;align-items:center;text-align:center}
}

/* print: only the certificate, one landscape page */
@media print{
  @page{size:letter landscape;margin:.35in}
  html,body{background:#fff!important;padding:0!important}
  body::before{display:none}
  body>*:not(.cert-print){display:none!important}
  .cert-print{display:block!important}
  .cert-print img{display:block;width:100%;height:auto;max-height:7.7in;object-fit:contain;margin:0 auto}
}
.sq-how{margin:10px 0 0;padding:10px 12px;border:1px solid rgba(227,192,136,.45);border-radius:5px;background:rgba(227,192,136,.08);color:var(--cream);text-align:center;font-size:1.02rem;line-height:1.4}
.sq-how b{color:#f0cf98}
@media (max-width:360px){.amounts{gap:6px}.amt{font-size:1rem}.amt-custom{font-size:.7rem;letter-spacing:.02em}}
.gift-go{text-align:center}
@media (max-width:359px){.gift-go{letter-spacing:.08em;font-size:.9rem}}