/* kubivo.ru sales layer: product extras, «Щёлк!», thank-you page, gift card (/podarok/). Uses kubivo.com's tokens. */

/* ---------- product page: gift line + colour-aware 3D link ---------- */
.kv-extra{display:grid;gap:10px;margin:0 0 22px}
.kv-gift-line,.kv-3d-line{display:flex;gap:12px;align-items:center;padding:12px 14px;border-radius:16px;text-decoration:none!important;color:var(--k-ink)!important;font:500 15px/1.45 var(--k-body);transition:transform .18s ease,box-shadow .18s ease}
.kv-gift-line{background:linear-gradient(135deg,#FFF1F6,#FFF8E6);box-shadow:inset 0 0 0 1.5px rgba(219,20,88,.25)}
.kv-gift-line b{font-family:var(--k-display);font-size:16px;color:var(--k-pink)}
.kv-3d-line{background:rgba(14,157,180,.08);box-shadow:inset 0 0 0 1.5px rgba(14,157,180,.22)}
.kv-3d-line b{color:var(--k-teal-d,#087285)}
.kv-gift-line:hover,.kv-3d-line:hover{transform:translateY(-2px);box-shadow:0 10px 24px -14px rgba(17,19,24,.35)}
.kv-gift-ico{flex:none;width:34px;height:34px;border-radius:9px;background:var(--k-pink);position:relative;box-shadow:inset 0 -4px 0 rgba(0,0,0,.12)}
.kv-gift-ico:before{content:"";position:absolute;left:50%;top:0;bottom:0;width:6px;margin-left:-3px;background:var(--k-lime)}
.kv-gift-ico:after{content:"";position:absolute;left:0;right:0;top:12px;height:6px;background:var(--k-lime)}
.kv-3d-cubes{flex:none;display:flex;gap:2px}
.kv-3d-cubes i{width:16px;height:16px;border-radius:4px;background:#D3D6D9;box-shadow:inset 0 -3px 0 rgba(0,0,0,.12);transition:background .3s}
.kv-3d-cubes i+i{background:#3FB2CE}
.kv-3d-line:hover .kv-3d-cubes i:first-child{transform:translateX(2px)}
.kv-3d-line:hover .kv-3d-cubes i+i{transform:translateX(-2px)}

/* ---------- «Щёлк!» ---------- */
.kv-snap{position:fixed;z-index:100000;width:0;height:0;pointer-events:none}
.kv-snap i{position:absolute;top:-34px;width:30px;height:30px;border-radius:8px;box-shadow:inset 0 -5px 0 rgba(0,0,0,.14),0 6px 14px -6px rgba(17,19,24,.5)}
.kv-snap__b{left:-62px;animation:kv-snap-l .42s cubic-bezier(.5,1.6,.6,1) forwards}
.kv-snap__a{left:32px;animation:kv-snap-r .42s cubic-bezier(.5,1.6,.6,1) forwards}
.kv-snap b{position:absolute;left:-40px;top:-74px;width:80px;text-align:center;font:700 22px/1 var(--k-display);color:var(--k-pink);opacity:0;animation:kv-snap-word .9s .32s ease-out forwards}
.kv-snap u{position:absolute;left:-30px;top:-49px;width:60px;height:60px;border-radius:50%;border:3px solid var(--k-lime);opacity:0;animation:kv-snap-ring .6s .36s ease-out forwards}
@keyframes kv-snap-l{to{transform:translateX(31px) rotate(0)}}
@keyframes kv-snap-r{to{transform:translateX(-31px)}}
@keyframes kv-snap-word{0%{opacity:0;transform:translateY(8px) scale(.7)}25%{opacity:1;transform:translateY(0) scale(1.08)}100%{opacity:0;transform:translateY(-22px) scale(1)}}
@keyframes kv-snap-ring{0%{opacity:.9;transform:scale(.3)}100%{opacity:0;transform:scale(1.6)}}
.kv-bump{animation:kv-bump .7s cubic-bezier(.3,1.8,.5,1)}
@keyframes kv-bump{0%{transform:scale(1)}30%{transform:scale(1.28) rotate(-8deg)}60%{transform:scale(.94) rotate(4deg)}100%{transform:scale(1)}}

/* ---------- thank-you page ---------- */
.kv-ty{position:relative;overflow:hidden;margin:0 0 34px;padding:38px 28px 30px;border-radius:28px;text-align:center;
  background:radial-gradient(60% 70% at 10% 0%,rgba(183,255,42,.22),rgba(183,255,42,0) 70%),radial-gradient(60% 70% at 90% 10%,rgba(219,20,88,.13),rgba(219,20,88,0) 70%),#fff;
  box-shadow:0 24px 60px -34px rgba(17,19,24,.45)}
.kv-ty__snap{display:flex;justify-content:center;gap:0;margin:0 auto 6px}
.kv-ty__snap i{display:grid;place-items:center;width:58px;height:58px;border-radius:14px;font:700 24px/1 var(--k-display);font-style:normal;color:rgba(17,19,24,.55);box-shadow:inset 0 -7px 0 rgba(0,0,0,.12)}
.kv-ty__n{background:#D3D6D9;animation:kv-ty-l .6s .2s cubic-bezier(.5,1.7,.6,1) both}
.kv-ty__s{background:#3FB2CE;color:rgba(255,255,255,.85)!important;animation:kv-ty-r .6s .2s cubic-bezier(.5,1.7,.6,1) both}
@keyframes kv-ty-l{from{transform:translateX(-46px) rotate(-10deg)}}
@keyframes kv-ty-r{from{transform:translateX(46px) rotate(10deg)}}
.kv-ty__kick{margin:4px 0 0;font:700 30px/1 var(--k-display);color:var(--k-pink)}
.kv-ty__h{margin:8px auto 8px!important;max-width:720px;font:700 clamp(26px,3.2vw,40px)/1.08 var(--k-display)!important;color:var(--k-ink)}
.kv-ty__lead{margin:0 auto 22px;max-width:620px;color:var(--k-text);font-size:16px}
.kv-ty__steps{list-style:none;margin:0 auto 26px;padding:0;max-width:880px;display:grid;grid-template-columns:repeat(4,1fr);gap:12px;counter-reset:s;text-align:left}
.kv-ty__steps li{position:relative;padding:16px 14px 14px;border-radius:18px;background:rgba(14,157,180,.07);counter-increment:s}
.kv-ty__steps li:before{content:counter(s);position:absolute;right:12px;top:10px;font:700 26px/1 var(--k-display);color:rgba(14,157,180,.28)}
.kv-ty__steps b{display:block;margin-bottom:6px;font:700 18px/1.15 var(--k-display);color:var(--k-teal-d,#087285)}
.kv-ty__steps span{display:block;font-size:14px;line-height:1.45;color:var(--k-text)}
.kv-ty__cta{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-bottom:18px}
.kv-ty__share{margin:0;color:var(--k-mute);font-size:14px}
.kv-ty__share a,.kv-copy{color:var(--k-pink)!important;font-weight:700;text-decoration:none}
.kv-copy{background:none;border:0;padding:0;cursor:pointer;font:inherit;font-weight:700;color:var(--k-pink)}
.kv-conf{position:absolute;top:-16px;width:12px;height:12px;border-radius:3px;opacity:0;animation:kv-fall linear forwards;pointer-events:none}
@keyframes kv-fall{0%{opacity:1;transform:translate(0,0) rotate(0)}100%{opacity:.9;transform:translate(var(--dx),520px) rotate(var(--rx))}}
@media (max-width:820px){.kv-ty__steps{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.kv-ty{padding:30px 16px 24px;border-radius:22px}.kv-ty__steps{grid-template-columns:1fr}}

/* ---------- gift card page ---------- */
.kv-gift .kv-gift__grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,56px);align-items:center}
.kv-gift__how{margin:18px 0 22px;padding:0;list-style:none;display:grid;gap:8px;counter-reset:g}
.kv-gift__how li{counter-increment:g;display:flex;gap:10px;align-items:center;font-weight:600}
.kv-gift__how li:before{content:counter(g);flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:var(--k-lime);font:700 15px/1 var(--k-display);color:#1B2408}
.kv-gift__how a{color:var(--k-pink);font-weight:700}
.kv-gift label{display:block;margin:0 0 12px;font:700 15px/1.2 var(--k-display);color:var(--k-ink)}
.kv-gift input[data-kv-in]{display:block;width:100%;margin-top:6px;padding:12px 14px;border:2px solid rgba(17,19,24,.14);border-radius:14px;font:500 17px/1.2 var(--k-body);background:#fff}
.kv-gift input[data-kv-in]:focus{outline:0;border-color:var(--k-teal)}
.kv-gift__sets{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 20px}
.kv-gift__sets button{display:flex;align-items:center;gap:7px;padding:7px 12px 7px 8px;border:2px solid rgba(17,19,24,.12);border-radius:999px;background:#fff;font:700 14px/1 var(--k-display);color:var(--k-ink);cursor:pointer}
.kv-gift__sets button i{display:flex;width:22px;height:22px;border-radius:6px;overflow:hidden}
.kv-gift__sets button i:before,.kv-gift__sets button i:after{content:"";flex:1;background:var(--b)}
.kv-gift__sets button i:after{background:var(--a)}
.kv-gift__sets button[aria-pressed="true"]{border-color:var(--k-ink);box-shadow:0 4px 0 var(--k-ink)}
.kv-gift__note{margin-top:12px;font-size:13px;color:var(--k-mute)}

/* gift card (/podarok/): own block name, so it never restyles the site's .kv-card content cards */
.kv-gcard{--kb:#D3D6D9;--ka:#3FB2CE;container-type:inline-size;position:relative;overflow:hidden;aspect-ratio:297/210;width:100%;padding:5% 5.5% 3.6%;border-radius:22px;color:var(--k-ink);
  display:grid;grid-template-columns:minmax(0,60fr) minmax(0,40fr);grid-template-rows:auto 1fr auto;column-gap:3%;
  background:radial-gradient(55% 60% at 100% 0%,color-mix(in srgb,var(--ka) 30%,transparent),transparent 70%),radial-gradient(50% 55% at 0% 100%,rgba(183,255,42,.25),transparent 70%),#FFFDF7;
  box-shadow:0 30px 70px -36px rgba(17,19,24,.55),inset 0 0 0 2px rgba(17,19,24,.06)}
.kv-gcard p{margin:0}
.kv-gcard__top{grid-column:1/-1;display:flex;justify-content:space-between;align-items:flex-start}
.kv-gcard__logo img{display:block;width:17cqw;height:auto}
.kv-gcard__kick{padding:.55em 1.1em;border-radius:999px;background:var(--k-pink);color:#fff;font:700 2.1cqw/1 var(--k-display);white-space:nowrap}
.kv-gcard__body{grid-column:1;align-self:center}
.kv-gcard__to{margin:0!important;font:700 6.6cqw/1.02 var(--k-display)!important;color:var(--k-ink)!important;letter-spacing:-.01em}
.kv-gcard__to span{background:linear-gradient(transparent 60%,var(--k-lime) 60%,var(--k-lime) 92%,transparent 92%)}
.kv-gcard__main{margin-top:1.8cqw!important;font:600 2.35cqw/1.38 var(--k-body);color:var(--k-text)}
.kv-gcard__main b{color:var(--k-ink)}
.kv-gcard__when{margin-top:2.2cqw!important;font:700 2.35cqw/1.3 var(--k-display);color:var(--k-teal-d,#087285)}
.kv-gcard__from{margin-top:.8cqw!important;font:700 2.9cqw/1.2 var(--k-display);color:var(--k-ink)}
.kv-gcard__art{grid-column:2;grid-row:2;position:relative;align-self:stretch}
.kv-gcard__stack{position:absolute;right:4%;top:6%;width:78%;display:flex;flex-direction:column;align-items:center;gap:1.1cqw;transform:rotate(-5deg)}
.kv-gcard__stack b{display:flex;gap:1.1cqw}
.kv-gcard__stack i{display:block;width:7.6cqw;height:7.6cqw;border-radius:1.6cqw;background:var(--kb);box-shadow:inset 0 -.8cqw 0 rgba(0,0,0,.13)}
.kv-gcard__stack b:nth-child(odd) i:nth-child(odd),.kv-gcard__stack b:nth-child(even) i:nth-child(even){background:var(--ka)}
.kv-gcard__mascot{position:absolute;left:0;bottom:0;width:38%;transform:rotate(-4deg)}
.kv-gcard__mascot img{display:block;width:100%;height:auto}
.kv-gcard__fine{grid-column:1/-1;margin-top:1.4cqw!important;font:500 1.25cqw/1.3 var(--k-body);color:var(--k-mute)}
.kv-gift__sets button,.kv-ty .kv-copy{text-transform:none!important;letter-spacing:0!important;min-height:0!important}
.kv-ty .kv-copy{background:none!important;box-shadow:none!important;padding:0!important;font-size:14px!important;color:var(--k-pink)!important}
@media screen and (max-width:600px){
  .kv-gcard{aspect-ratio:auto;grid-template-columns:1fr;grid-template-rows:auto auto auto auto;padding:22px 20px 16px;border-radius:20px}
  .kv-gcard__logo img{width:92px}
  .kv-gcard__kick{font-size:12px}
  .kv-gcard__body{margin-top:18px}
  .kv-gcard__to{font-size:36px!important}
  .kv-gcard__main,.kv-gcard__when{font-size:15px;margin-top:10px!important}
  .kv-gcard__from{font-size:18px}
  .kv-gcard__art{grid-column:1;grid-row:3;height:150px;margin-top:8px}
  .kv-gcard__stack{width:auto;right:8px;top:0;gap:5px}.kv-gcard__stack b{gap:5px}
  .kv-gcard__stack i{width:36px;height:36px;border-radius:8px;box-shadow:inset 0 -4px 0 rgba(0,0,0,.13)}
  .kv-gcard__mascot{width:110px}
  .kv-gcard__fine{font-size:10px;margin-top:10px!important}
}
@media (max-width:900px){.kv-gift .kv-gift__grid{grid-template-columns:1fr}.kv-gift__preview{order:-1}}

@media print{
  @page{size:A4 landscape;margin:0}
  html,body{background:#fff!important}
  body *{visibility:hidden!important}
  .kv-gcard,.kv-gcard *{visibility:visible!important}
  .kv-gcard{position:fixed!important;left:0;top:0;width:297mm!important;height:210mm!important;aspect-ratio:auto;border-radius:0;box-shadow:none;-webkit-print-color-adjust:exact;print-color-adjust:exact}
}
@media (prefers-reduced-motion:reduce){.kv-ty__n,.kv-ty__s,.kv-bump{animation:none!important}}

/* showroom (kubivo-showroom.php): the box under the price, until selling starts */
.kv-soon p{margin:0 0 6px}
.kv-soon__cta{margin:12px 0 10px!important}
.kv-soon__note{margin:8px 0 0!important;font-size:13px;color:#5D636E}
.kv-forms-off{font-weight:600}
.kv-soon-img img{display:block;width:100%;height:auto;border-radius:28px;box-shadow:var(--k-soft-lg,0 18px 36px -24px rgba(27,31,39,.3))}