/* ==========================================================================
   Savalan Kebab — First-order promo popup. Design from Figma (17:6148 desktop /
   17:6203 mobile). Depends on design-system.css tokens.
   ========================================================================== */
.svk-promo, .svk-promo *{box-sizing:border-box}

.svk-promo{position:fixed;inset:0;z-index:100050;display:flex;align-items:center;justify-content:center;padding:20px}
.svk-promo[hidden]{display:none}
body.svk-promo-lock{overflow:hidden}

/* Scrim */
.svk-promo__scrim{position:absolute;inset:0;background:rgba(0,0,0,.5);opacity:0;transition:opacity .3s var(--ease,ease)}
.svk-promo.is-open .svk-promo__scrim{opacity:1}

/* Card */
.svk-promo__card{position:relative;z-index:1;width:100%;max-width:860px;
  background:linear-gradient(160deg, var(--sg-forest) 0%, var(--sg-forest-700) 100%);
  border-radius:var(--r-card-lg);padding:48px 56px 44px;
  display:flex;flex-direction:column;align-items:center;gap:30px;text-align:center;
  box-shadow:0 30px 90px rgba(0,0,0,.4);
  transform:translateY(14px) scale(.97);opacity:0;
  transition:transform .34s cubic-bezier(.2,.8,.2,1),opacity .3s ease}
.svk-promo.is-open .svk-promo__card{transform:none;opacity:1}
@media (prefers-reduced-motion:reduce){
  .svk-promo__card,.svk-promo__scrim{transition:none}
  .svk-promo__card{transform:none}
}

/* Close */
.svk-promo__close{position:absolute;top:18px;right:18px;width:34px;height:34px;padding:0;border:none;border-radius:50%;
  background:var(--sg-flame);color:var(--sg-ink);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;
  box-shadow:none;transition:background .15s var(--ease,ease),transform .15s var(--ease,ease)}
.svk-promo__close:hover{background:var(--sg-flame-700);transform:scale(1.06)}
.svk-promo__close:focus-visible{outline:2px solid #fff;outline-offset:2px}
.svk-promo__close svg{width:18px;height:18px;display:block}

/* Head */
.svk-promo__head{display:flex;flex-direction:column;gap:16px;align-items:center;width:100%}
.svk-promo__title{font-family:var(--f-display);font-weight:400;color:#fff;
  font-size:clamp(34px,4vw,52px);line-height:1;margin:0;text-transform:capitalize;letter-spacing:-.015em;text-wrap:balance}
.svk-promo__sub{font-family:var(--f-body);font-weight:500;color:rgba(255,255,255,.9);
  font-size:clamp(16px,1.9vw,22px);line-height:1.42;margin:0}

/* Circular food image */
.svk-promo__media{width:min(306px,62vw);aspect-ratio:1;border-radius:50%;overflow:hidden;flex:0 0 auto;
  box-shadow:0 12px 34px rgba(0,0,0,.25)}
.svk-promo__media img{width:100%;height:100%;object-fit:cover;display:block}

/* Promo code block */
.svk-promo__code{display:flex;align-items:center;gap:16px}
.svk-promo__code-label{font-family:var(--f-body);font-weight:400;color:rgba(255,255,255,.9);font-size:clamp(14px,1.4vw,16px);white-space:nowrap}
.svk-promo__code-row{display:flex;align-items:stretch}
.svk-promo__code-value{display:inline-flex;align-items:center;justify-content:center;min-width:206px;padding:13px 24px;
  border:1px solid var(--sg-flame);border-right:none;border-radius:var(--r-full) 0 0 var(--r-full);
  background:rgba(255,255,255,.04);
  font-family:var(--f-body);font-weight:700;font-size:clamp(18px,1.8vw,20px);color:var(--sg-flame);
  letter-spacing:.04em;text-transform:uppercase;user-select:all;white-space:nowrap}
.svk-promo__copy{display:inline-flex;align-items:center;justify-content:center;width:56px;padding:12px 16px;border:none;cursor:pointer;
  border-radius:0 var(--r-full) var(--r-full) 0;color:var(--sg-ink);
  background:var(--sg-flame);
  transition:background .15s var(--ease,ease)}
.svk-promo__copy:hover{background:var(--sg-flame-700)}
.svk-promo__copy:focus-visible{outline:2px solid #fff;outline-offset:2px}
.svk-promo__ico{width:26px;height:26px;display:block}
.svk-promo__ico--check{display:none}
.svk-promo__copy.is-copied .svk-promo__ico--copy{display:none}
.svk-promo__copy.is-copied .svk-promo__ico--check{display:block}

/* Note + copied feedback */
.svk-promo__note{font-family:var(--f-body);font-weight:400;color:rgba(255,255,255,.72);font-size:clamp(14px,1.5vw,18px);margin:0;max-width:34ch}
.svk-promo__copied{min-height:18px;font-family:var(--f-body);font-weight:600;font-size:13px;color:var(--sg-flame);
  opacity:0;transform:translateY(-4px);transition:opacity .2s ease,transform .2s ease}
.svk-promo__copied.is-visible{opacity:1;transform:none}

/* ---- Mobile ---- */
@media (max-width:600px){
  .svk-promo{padding:16px}
  .svk-promo__card{border-radius:24px;padding:40px 20px 24px;gap:22px}
  .svk-promo__close{top:14px;right:14px;width:32px;height:32px}
  .svk-promo__code{flex-direction:column;gap:12px}
  .svk-promo__media{width:min(200px,52vw)}
}