/* ============================================================
   Insight Bay — Shop
   Layered on assets/css/styles.css. Uses ONLY the design-system
   tokens (--ib-*) so light/dark, spacing, radius, shadow and motion
   all inherit natively. Nothing here re-defines a brand value.
   ============================================================ */

/* ---------- Currency rail reuse ----------
   The shop reuses the exact .ib-curbar markup + JS from services.html;
   its styles already live in that page's <style>. We re-declare the
   same rules here (scoped-safe, identical values) so the rail also
   works on shop pages that don't carry that inline block. ---------- */
.ib-curbar { display:flex; flex-direction:column; align-items:center; }
.ib-curbar__rail {
  display:flex; gap:.3rem; max-width:100%; padding:.35rem;
  background:var(--ib-bg-soft); border:1px solid var(--ib-line-strong);
  border-radius:999px; box-shadow:var(--ib-shadow);
  overflow-x:auto; scroll-behavior:smooth; -webkit-overflow-scrolling:touch; scrollbar-width:none;
}
.ib-curbar__rail::-webkit-scrollbar { display:none; }
.ib-curbar__rail.is-scrollable {
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 26px, #000 calc(100% - 26px), transparent);
          mask-image:linear-gradient(90deg, transparent, #000 26px, #000 calc(100% - 26px), transparent);
}
.ib-curbar__pill {
  flex:0 0 auto; padding:.6rem 1.05rem; border-radius:999px; border:none; cursor:pointer;
  background:transparent; color:var(--ib-ink-soft); font-size:.95rem; font-weight:600;
  white-space:nowrap; transition:background .2s ease, color .2s ease, transform .15s ease;
}
.ib-curbar__pill b { font-weight:700; margin-left:.18rem; }
.ib-curbar__pill:hover { color:var(--ib-ink); }
.ib-curbar__pill:focus-visible { outline:2px solid var(--ib-accent); outline-offset:2px; }
.ib-curbar__pill.is-active { background:var(--ib-accent); color:#fff; box-shadow:0 4px 12px -4px rgba(201,100,66,.5); }
.ib-curbar__pill.is-active b { color:#fff; }
.ib-curbar__hint { font-size:.78rem; color:var(--ib-ink-muted); margin-top:.7rem; }

/* ============================================================
   MARKETPLACE GRID + PRODUCT CARDS
   ============================================================ */
.ib-shop-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(300px, 1fr));
  gap:1.5rem;
  margin-top:2.5rem;
}
@media (min-width:1080px){ .ib-shop-grid { gap:1.75rem; } }

.ib-pcard {
  position:relative;
  display:flex; flex-direction:column;
  background:var(--ib-card-bg);
  border:1px solid var(--ib-line);
  border-radius:var(--ib-radius-lg);
  overflow:hidden;
  transition:transform .35s var(--ibe-out, cubic-bezier(.22,.61,.21,1)), box-shadow .35s ease, border-color .35s ease;
}
.ib-pcard:hover { transform:translateY(-4px); border-color:var(--ib-line-strong); box-shadow:var(--ib-shadow-lg); }

/* Cover: A4-ish book face on a soft plinth, gentle zoom on hover */
.ib-pcard__cover {
  position:relative;
  aspect-ratio:1 / 1.02;
  overflow:hidden;
  background:
    radial-gradient(circle at 30% 15%, rgba(201,100,66,.10), transparent 55%),
    linear-gradient(160deg, var(--ib-bg-hero-top), var(--ib-bg-deep));
  border-bottom:1px solid var(--ib-line);
  display:flex; align-items:flex-end; justify-content:center;
  padding:1.5rem 1.5rem 0;
}
.ib-pcard__cover img {
  width:82%;
  border-radius:10px 10px 0 0;
  box-shadow:0 20px 40px -18px rgba(12,19,34,.55), 0 2px 0 rgba(255,255,255,.04) inset;
  transform:translateY(6px);
  transition:transform .45s var(--ibe-out, cubic-bezier(.22,.61,.21,1));
}
.ib-pcard:hover .ib-pcard__cover img { transform:translateY(0) scale(1.015); }

.ib-pcard__ribbon {
  position:absolute; top:.9rem; left:.9rem; z-index:2;
  display:inline-flex; align-items:center; gap:.35rem;
  padding:.32rem .7rem; border-radius:999px;
  font-size:.7rem; font-weight:700; letter-spacing:.04em;
  background:var(--ib-accent); color:#fff;
  box-shadow:0 4px 12px -4px rgba(201,100,66,.5);
}
.ib-pcard__ribbon.is-soon { background:var(--ib-ink); color:var(--ib-bg); }

.ib-pcard__body { display:flex; flex-direction:column; gap:.75rem; padding:1.4rem 1.4rem 1.5rem; flex:1; }
.ib-pcard__meta { display:flex; flex-wrap:wrap; gap:.4rem; }
.ib-pcard__tag {
  font-size:.72rem; font-weight:600; letter-spacing:.02em;
  color:var(--ib-ink-soft); background:var(--ib-bg-deep);
  border:1px solid var(--ib-line); border-radius:999px; padding:.28rem .6rem;
}
.ib-pcard__tag.is-accent { color:var(--ib-accent); background:var(--ib-accent-soft); border-color:transparent; }
.ib-pcard h3 { font-size:1.2rem; line-height:1.25; margin:0; }
.ib-pcard__desc { font-size:.92rem; color:var(--ib-ink-soft); line-height:1.55; margin:0; }

.ib-pcard__outcomes { list-style:none; padding:0; margin:.25rem 0 0; display:grid; gap:.3rem; }
.ib-pcard__outcomes li { position:relative; padding-left:1.4rem; font-size:.84rem; color:var(--ib-ink-soft); line-height:1.4; }
.ib-pcard__outcomes li::before {
  content:''; position:absolute; left:0; top:.2rem; width:.95rem; height:.95rem;
  border-radius:50%; background:var(--ib-accent-soft);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C96442' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E");
  background-size:.62rem; background-repeat:no-repeat; background-position:center;
}

.ib-pcard__assure { display:flex; flex-wrap:wrap; gap:.5rem 1rem; margin-top:.35rem; }
.ib-assure { display:inline-flex; align-items:center; gap:.35rem; font-size:.76rem; color:var(--ib-ink-muted); font-weight:500; }
.ib-assure svg { width:14px; height:14px; color:var(--ib-success); flex:0 0 auto; }

.ib-pcard__foot {
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  margin-top:auto; padding-top:1.1rem; border-top:1px solid var(--ib-line);
}
.ib-pcard__price { display:flex; align-items:baseline; gap:.4rem; }
.ib-pcard__price .amt { font-family:var(--ib-font-serif); font-size:1.7rem; font-weight:700; color:var(--ib-ink); line-height:1; }
.ib-pcard__price .was { font-size:.85rem; color:var(--ib-ink-muted); text-decoration:line-through; }
.ib-pcard__price .per { font-size:.76rem; color:var(--ib-ink-muted); }
.ib-pcard__cta { display:flex; gap:.5rem; }
.ib-pcard__cta .ib-btn { padding:.6rem 1rem; font-size:.85rem; }

/* Coming-soon card is calmer */
.ib-pcard.is-soon .ib-pcard__cover { filter:saturate(.6) opacity(.9); }
.ib-pcard.is-soon .ib-pcard__price { opacity:.55; }

/* Coming-soon cover placeholder (no image yet) */
.ib-pcard__soon-face {
  width:82%; aspect-ratio:1 / 1.414; border-radius:10px 10px 0 0;
  transform:translateY(6px);
  background:linear-gradient(160deg,#0C1322,#070B14);
  border:1px solid rgba(91,147,255,.22);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.5rem; text-align:center; padding:1.5rem;
}
.ib-pcard__soon-face .n { font-family:var(--ib-font-serif); font-size:2.4rem; font-weight:800; color:#3FD9F4; line-height:1; }
.ib-pcard__soon-face .t { font-size:.8rem; letter-spacing:.16em; text-transform:uppercase; color:rgba(238,243,251,.7); }

/* ============================================================
   PRODUCT DETAIL PAGE (PDP)
   ============================================================ */
.ib-pdp { display:grid; grid-template-columns:1fr; gap:2.5rem; }
@media (min-width:960px){ .ib-pdp { grid-template-columns:minmax(0,1.35fr) minmax(340px,.9fr); gap:3.5rem; align-items:start; } }

/* Buy panel (sticky on desktop) */
.ib-buybox {
  position:relative;
  background:var(--ib-card-bg); border:1px solid var(--ib-line);
  border-radius:var(--ib-radius-lg); padding:1.6rem; box-shadow:var(--ib-shadow);
}
@media (min-width:960px){ .ib-buybox { position:sticky; top:92px; } }
.ib-buybox__cover {
  display:block; width:100%; border-radius:var(--ib-radius);
  box-shadow:0 24px 48px -20px rgba(12,19,34,.6); margin-bottom:1.25rem;
}
.ib-buybox__price { display:flex; align-items:baseline; gap:.5rem; margin:.25rem 0 .1rem; }
.ib-buybox__price .amt { font-family:var(--ib-font-serif); font-size:2.4rem; font-weight:700; color:var(--ib-ink); line-height:1; }
.ib-buybox__price .per { font-size:.82rem; color:var(--ib-ink-muted); }
.ib-buybox__vat { font-size:.8rem; color:var(--ib-ink-muted); margin:0 0 1.1rem; }
.ib-buybox .ib-btn { width:100%; justify-content:center; }
.ib-buybox__second { margin-top:.6rem; }

.ib-buybox__assurances { list-style:none; padding:0; margin:1.25rem 0 0; display:grid; gap:.6rem; }
.ib-buybox__assurances li { display:flex; align-items:flex-start; gap:.6rem; font-size:.88rem; color:var(--ib-ink-soft); }
.ib-buybox__assurances svg { width:17px; height:17px; color:var(--ib-success); flex:0 0 auto; margin-top:.1rem; }

.ib-buybox__pay { margin-top:1.25rem; padding-top:1.1rem; border-top:1px dashed var(--ib-line); }

/* Spec strip */
.ib-spec { display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--ib-line); border:1px solid var(--ib-line); border-radius:var(--ib-radius); overflow:hidden; margin:1.75rem 0; }
@media (min-width:620px){ .ib-spec { grid-template-columns:repeat(4,1fr); } }
.ib-spec__cell { background:var(--ib-card-bg); padding:1.1rem 1.2rem; }
.ib-spec__k { font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--ib-ink-muted); }
.ib-spec__v { font-family:var(--ib-font-serif); font-size:1.15rem; color:var(--ib-ink); margin-top:.25rem; font-weight:600; }

/* Preview gallery */
.ib-gallery { display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; margin-top:1.25rem; }
@media (min-width:720px){ .ib-gallery { grid-template-columns:repeat(3,1fr); } }
.ib-gallery figure { margin:0; border-radius:var(--ib-radius); overflow:hidden; border:1px solid var(--ib-line); background:var(--ib-bg-deep); cursor:zoom-in; transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.ib-gallery figure:hover { transform:translateY(-3px); box-shadow:var(--ib-shadow); border-color:var(--ib-line-strong); }
.ib-gallery img { display:block; width:100%; height:100%; object-fit:cover; }

/* "What's inside" list */
.ib-inside { display:grid; grid-template-columns:1fr; gap:1rem; margin-top:1.25rem; }
@media (min-width:640px){ .ib-inside { grid-template-columns:1fr 1fr; } }
.ib-inside__item { display:flex; gap:.9rem; padding:1.15rem 1.25rem; background:var(--ib-card-bg); border:1px solid var(--ib-line); border-radius:var(--ib-radius); }
.ib-inside__ico { flex:0 0 auto; width:40px; height:40px; border-radius:11px; background:var(--ib-accent-soft); color:var(--ib-accent); display:grid; place-items:center; }
.ib-inside__ico svg { width:20px; height:20px; }
.ib-inside__t { font-weight:600; color:var(--ib-ink); font-size:.98rem; }
.ib-inside__d { font-size:.86rem; color:var(--ib-ink-soft); line-height:1.5; margin-top:.2rem; }

/* Lightbox */
.ib-lightbox { position:fixed; inset:0; z-index:120; display:none; align-items:center; justify-content:center; padding:24px; background:rgba(12,13,12,.86); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
.ib-lightbox.is-open { display:flex; animation:ib-fade-in .2s ease both; }
.ib-lightbox img { max-width:min(920px,92vw); max-height:88vh; border-radius:12px; box-shadow:0 30px 80px -20px rgba(0,0,0,.7); }
.ib-lightbox__close { position:absolute; top:18px; right:22px; width:44px; height:44px; border-radius:999px; border:1px solid rgba(245,241,235,.3); background:rgba(0,0,0,.35); color:#fff; font-size:1.4rem; cursor:pointer; display:grid; place-items:center; }
.ib-lightbox__close:hover { background:var(--ib-accent); border-color:var(--ib-accent); }

/* ============================================================
   CHECKOUT OVERLAY (info → OTP → payment → success)
   ============================================================ */
.ib-co { position:fixed; inset:0; z-index:130; display:none; }
.ib-co.is-open { display:block; }
.ib-co__scrim { position:absolute; inset:0; background:rgba(12,13,12,.55); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); animation:ib-fade-in .25s ease both; }
.ib-co__panel {
  position:absolute; top:0; right:0; height:100%;
  width:min(560px, 100%);
  background:var(--ib-bg); border-left:1px solid var(--ib-line);
  box-shadow:-24px 0 60px -30px rgba(0,0,0,.5);
  display:flex; flex-direction:column;
  animation:ib-co-in .4s var(--ibe-out, cubic-bezier(.22,.61,.21,1)) both;
}
@keyframes ib-co-in { from { transform:translateX(30px); opacity:.4; } to { transform:none; opacity:1; } }
@media (max-width:600px){ .ib-co__panel { width:100%; border-left:none; } }

.ib-co__head { display:flex; align-items:center; gap:1rem; padding:1.15rem 1.4rem; border-bottom:1px solid var(--ib-line); background:var(--ib-nav-bg); backdrop-filter:blur(12px); }
.ib-co__head-title { display:flex; align-items:center; gap:.6rem; font-weight:700; color:var(--ib-ink); }
.ib-co__head-title .ib-logo-mark { width:26px; height:26px; font-size:.85rem; }
.ib-co__close { margin-left:auto; width:40px; height:40px; border-radius:999px; border:1px solid var(--ib-line); background:transparent; color:var(--ib-ink-soft); cursor:pointer; display:grid; place-items:center; transition:background .15s ease,color .15s ease,border-color .15s ease; }
.ib-co__close:hover { background:var(--ib-bg-deep); color:var(--ib-ink); border-color:var(--ib-line-strong); }
.ib-co__close svg { width:18px; height:18px; }

.ib-co__body { flex:1; overflow-y:auto; padding:1.5rem 1.4rem 2rem; -webkit-overflow-scrolling:touch; }

/* Order summary row */
.ib-co__summary { display:flex; gap:.9rem; align-items:center; padding:1rem; background:var(--ib-bg-soft); border:1px solid var(--ib-line); border-radius:var(--ib-radius); margin-bottom:1.4rem; }
.ib-co__summary img { width:46px; height:60px; object-fit:cover; border-radius:6px; box-shadow:0 6px 14px -6px rgba(12,19,34,.6); flex:0 0 auto; }
.ib-co__summary .t { font-weight:600; color:var(--ib-ink); font-size:.95rem; line-height:1.3; }
.ib-co__summary .s { font-size:.8rem; color:var(--ib-ink-muted); margin-top:.15rem; }
.ib-co__summary .p { margin-left:auto; font-family:var(--ib-font-serif); font-weight:700; font-size:1.35rem; color:var(--ib-ink); white-space:nowrap; }

/* Stepper */
.ib-co__steps { display:flex; align-items:center; gap:.4rem; margin-bottom:1.5rem; }
.ib-co__step { display:flex; align-items:center; gap:.5rem; flex:1; }
.ib-co__step .dot { width:26px; height:26px; border-radius:999px; border:1.5px solid var(--ib-line-strong); color:var(--ib-ink-muted); display:grid; place-items:center; font-size:.8rem; font-weight:700; flex:0 0 auto; background:var(--ib-card-bg); transition:all .25s ease; }
.ib-co__step .lbl { font-size:.76rem; font-weight:600; color:var(--ib-ink-muted); white-space:nowrap; }
.ib-co__step .bar { flex:1; height:2px; background:var(--ib-line); border-radius:2px; }
.ib-co__step.is-active .dot { border-color:var(--ib-accent); color:#fff; background:var(--ib-accent); box-shadow:0 0 0 4px rgba(201,100,66,.16); }
.ib-co__step.is-active .lbl { color:var(--ib-ink); }
.ib-co__step.is-done .dot { border-color:var(--ib-success); background:var(--ib-success); color:#fff; }
.ib-co__step.is-done .lbl { color:var(--ib-ink-soft); }
@media (max-width:460px){ .ib-co__step .lbl { display:none; } }

.ib-co__pane { display:none; animation:ib-fade-up .35s var(--ibe-out, cubic-bezier(.22,.61,.21,1)) both; }
.ib-co__pane.is-active { display:block; }
.ib-co__h { font-size:1.25rem; font-weight:700; color:var(--ib-ink); margin:0 0 .35rem; letter-spacing:-.01em; }
.ib-co__sub { font-size:.9rem; color:var(--ib-ink-soft); line-height:1.55; margin:0 0 1.25rem; }

/* Floating-label fields */
.ib-fl { position:relative; margin-bottom:1rem; }
.ib-fl input, .ib-fl select {
  width:100%; height:56px; padding:1.35rem .95rem .5rem; font-size:1rem;
  background:var(--ib-card-bg); color:var(--ib-ink);
  border:1px solid var(--ib-line-strong); border-radius:var(--ib-radius-sm);
  transition:border-color .15s ease, box-shadow .15s ease;
  font-family:inherit;
}
.ib-fl label { position:absolute; left:.98rem; top:1.05rem; font-size:1rem; color:var(--ib-ink-muted); pointer-events:none; transition:transform .16s var(--ibe-out, ease), color .16s ease, font-size .16s ease; transform-origin:left top; }
.ib-fl input:focus, .ib-fl select:focus { outline:none; border-color:var(--ib-accent); box-shadow:0 0 0 3px rgba(201,100,66,.16); }
.ib-fl input:focus + label, .ib-fl input:not(:placeholder-shown) + label,
.ib-fl select:focus + label, .ib-fl select.has-value + label { transform:translateY(-.7rem) scale(.78); color:var(--ib-accent); }
.ib-fl.is-invalid input, .ib-fl.is-invalid select { border-color:var(--ib-accent); box-shadow:0 0 0 3px rgba(201,100,66,.14); }
.ib-fl.is-valid input { border-color:color-mix(in srgb, var(--ib-success) 55%, var(--ib-line-strong)); }
.ib-fl__err { font-size:.78rem; color:var(--ib-accent); margin:.3rem 0 0 .2rem; min-height:1em; display:block; animation:ib-shake .3s ease; }
.ib-fl select { appearance:none; -webkit-appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23807A72' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right .9rem center; background-size:1.05rem; padding-right:2.5rem; cursor:pointer; }
[data-theme="dark"] .ib-fl select { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C9C4BB' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); }

/* Phone with country code */
.ib-fl-phone { display:grid; grid-template-columns:118px 1fr; gap:.6rem; }

/* Row of two */
.ib-fl-row { display:grid; grid-template-columns:1fr 1fr; gap:.6rem; }
@media (max-width:420px){ .ib-fl-row { grid-template-columns:1fr; } }

/* OTP inputs */
.ib-otp { display:flex; gap:.5rem; justify-content:space-between; margin:.5rem 0 1rem; }
.ib-otp input {
  width:100%; aspect-ratio:1/1.15; max-width:56px; text-align:center;
  font-family:var(--ib-font-serif); font-size:1.5rem; font-weight:700; color:var(--ib-ink);
  background:var(--ib-card-bg); border:1.5px solid var(--ib-line-strong); border-radius:12px;
  transition:border-color .15s ease, box-shadow .15s ease, transform .1s ease;
}
.ib-otp input:focus { outline:none; border-color:var(--ib-accent); box-shadow:0 0 0 3px rgba(201,100,66,.16); }
.ib-otp.is-filled input { border-color:color-mix(in srgb, var(--ib-success) 60%, var(--ib-line-strong)); }
.ib-otp.is-error input { border-color:var(--ib-accent); animation:ib-shake .3s ease; }
.ib-co__resend { font-size:.85rem; color:var(--ib-ink-muted); text-align:center; }
.ib-co__resend button { background:none; border:none; color:var(--ib-accent); font-weight:600; cursor:pointer; font-size:.85rem; padding:0; }
.ib-co__resend button:disabled { color:var(--ib-ink-muted); cursor:default; }

/* Inline status / error banner */
.ib-co__note { display:none; padding:.8rem 1rem; border-radius:10px; font-size:.88rem; margin-bottom:1rem; line-height:1.45; }
.ib-co__note.is-show { display:block; }
.ib-co__note.err { background:#fbeae3; border:1px solid var(--ib-accent); color:var(--ib-ink); }
[data-theme="dark"] .ib-co__note.err { background:rgba(201,100,66,.12); }
.ib-co__note.ok { background:rgba(79,122,74,.12); border:1px solid var(--ib-success); color:var(--ib-ink); }

/* Payment pane */
.ib-co__pay-methods { display:flex; flex-direction:column; gap:1rem; }
.ib-co__gw { border:1px solid var(--ib-line); border-radius:var(--ib-radius); padding:1.2rem; background:var(--ib-card-bg); }
.ib-co__gw h4 { font-size:.95rem; margin:0 0 .2rem; color:var(--ib-ink); }
.ib-co__gw p { font-size:.82rem; color:var(--ib-ink-muted); margin:0 0 1rem; }
.ib-co__or { text-align:center; font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; color:var(--ib-ink-muted); position:relative; }
.ib-co__or::before, .ib-co__or::after { content:''; position:absolute; top:50%; width:38%; height:1px; background:var(--ib-line); }
.ib-co__or::before { left:0; } .ib-co__or::after { right:0; }
#ib-rzp-btn { width:100%; justify-content:center; }
#ib-paypal-holder { min-height:48px; }

.ib-co__trust { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem 1rem; margin-top:1.25rem; padding-top:1rem; border-top:1px solid var(--ib-line); }
.ib-co__trust span { display:inline-flex; align-items:center; gap:.35rem; font-size:.76rem; color:var(--ib-ink-muted); }
.ib-co__trust svg { width:14px; height:14px; color:var(--ib-success); }

/* Spinner overlay while talking to gateways */
.ib-co__loading { display:none; flex-direction:column; align-items:center; justify-content:center; gap:1rem; padding:3rem 1rem; text-align:center; }
.ib-co__loading.is-show { display:flex; }
.ib-co__spinner { width:40px; height:40px; border-radius:50%; border:3px solid var(--ib-line); border-top-color:var(--ib-accent); animation:ib-spin .7s linear infinite; }
.ib-co__loading p { font-size:.9rem; color:var(--ib-ink-soft); margin:0; }

/* Success pane */
.ib-co__success { text-align:center; padding:1rem .5rem; }
.ib-co__success .mark { width:84px; height:84px; margin:0 auto 1.2rem; display:block; }
.ib-co__success .mark .ring { fill:none; stroke:var(--ib-success); stroke-width:2; stroke-dasharray:201; stroke-dashoffset:201; animation:ib-line-draw .7s var(--ibe-out, ease) .1s forwards; }
.ib-co__success .mark .tick { fill:none; stroke:var(--ib-success); stroke-width:3.2; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:44; stroke-dashoffset:44; animation:ib-line-draw .45s var(--ibe-out, ease) .65s forwards; }
.ib-co__success h3 { font-size:1.55rem; color:var(--ib-ink); margin:0 0 .4rem; }
.ib-co__success p { color:var(--ib-ink-soft); line-height:1.6; margin:0 auto 1.5rem; max-width:38ch; }
.ib-co__dl { width:100%; justify-content:center; font-size:1.02rem; padding:1rem 1.4rem; }
.ib-co__dl-again { margin-top:.8rem; font-size:.85rem; color:var(--ib-ink-muted); }
.ib-co__dl-again button { background:none; border:none; color:var(--ib-accent); font-weight:600; cursor:pointer; }
.ib-co__receipt { margin-top:1.5rem; padding:1rem; background:var(--ib-bg-soft); border:1px solid var(--ib-line); border-radius:var(--ib-radius); font-size:.82rem; color:var(--ib-ink-muted); text-align:left; }
.ib-co__receipt b { color:var(--ib-ink); font-weight:600; }

@media (prefers-reduced-motion: reduce){
  .ib-co__panel, .ib-co__pane, .ib-co__scrim, .ib-lightbox { animation:none !important; }
  .ib-co__success .mark .ring, .ib-co__success .mark .tick { animation:none !important; stroke-dashoffset:0 !important; }
  .ib-pcard, .ib-pcard__cover img { transition:none !important; }
}

/* ============================================================
   PAYMENT RAIL — identical to the tutoring bundle checkout (/book)
   ============================================================ */
.ib-pay { margin-top:1.4rem; display:flex; flex-direction:column; }
.ib-pay__or {
  display:flex; align-items:center; gap:.85rem; margin:1rem 0;
  color:var(--ib-ink-muted); font-size:.7rem; font-weight:700;
  text-transform:uppercase; letter-spacing:.18em;
}
.ib-pay__or span { flex:1; height:1px; background:var(--ib-line); }
.ib-pay__card { width:100%; justify-content:center; font-weight:600; }
.ib-pay__card svg { opacity:.9; }
.ib-pay__note {
  display:flex; align-items:flex-start; gap:.5rem;
  margin:1.05rem 0 0; font-size:.78rem; line-height:1.55; color:var(--ib-ink-muted);
}
.ib-pay__note svg { flex:0 0 auto; margin-top:.15rem; color:var(--ib-success); }
.ib-wallets { width:100%; }
@media (max-width:600px){ .ib-pay { margin-top:1.15rem; } }

/* ============================================================
   BACK TO SHOP
   ============================================================ */
.ib-back {
  display:inline-flex; align-items:center; gap:.45rem;
  padding:.6rem 1.05rem; border-radius:999px;
  border:1px solid var(--ib-line-strong); background:var(--ib-card-bg);
  color:var(--ib-ink); font-weight:600; font-size:.9rem;
  transition:background .18s ease, border-color .18s ease, transform .18s ease, color .18s ease;
}
.ib-back:hover { background:var(--ib-bg-deep); border-color:var(--ib-accent); color:var(--ib-ink); }
.ib-back svg { width:16px; height:16px; transition:transform .2s ease; }
.ib-back:hover svg { transform:translateX(-3px); }
.ib-back:focus-visible { outline:2px solid var(--ib-accent); outline-offset:2px; }

/* ============================================================
   STICKY MOBILE BUY BAR (product page)
   The buy box sits below the content on phones, so the price + CTA
   stay reachable at all times — Apple/Stripe pattern.
   ============================================================ */
.ib-buybar {
  position:fixed; left:0; right:0; bottom:0; z-index:90;
  display:none; align-items:center; gap:.9rem;
  padding:.7rem 1rem calc(.7rem + env(safe-area-inset-bottom, 0px));
  background:var(--ib-nav-bg);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-top:1px solid var(--ib-line);
  box-shadow:0 -8px 24px -12px rgba(32,32,30,.25);
}
.ib-buybar__price { display:flex; flex-direction:column; line-height:1.15; flex:0 0 auto; }
.ib-buybar__price .amt { font-family:var(--ib-font-serif); font-size:1.3rem; font-weight:700; color:var(--ib-ink); }
.ib-buybar__price .lbl { font-size:.68rem; color:var(--ib-ink-muted); }
.ib-buybar .ib-btn { flex:1; justify-content:center; min-height:48px; }
[data-theme="dark"] .ib-buybar { box-shadow:0 -8px 24px -12px rgba(0,0,0,.6); }
@media (max-width:959px){
  .ib-buybar { display:flex; }
  /* Reserve room so the bar never covers the footer. Beats the base
     `body:not(:has([data-sticky-cta]))` rule by later source order. */
  body:has(.ib-buybar) { padding-bottom:5.75rem; }
}

/* ============================================================
   RESPONSIVE HARDENING — mobile overflow fix
   Grid items default to `min-width:auto`, so an intrinsically wide child
   (the 1200px cover image) can force its track wider than the phone,
   pushing the whole page out and clipping every row. Clamp every track
   and item to a zero minimum, and cap media at 100%.
   ============================================================ */
.ib-pdp { grid-template-columns:minmax(0,1fr); }
.ib-pdp > * { min-width:0; }
@media (min-width:960px){
  .ib-pdp { grid-template-columns:minmax(0,1.35fr) minmax(340px,.9fr); }
}
.ib-pdp__main, .ib-buybox { min-width:0; max-width:100%; }

.ib-spec { grid-template-columns:repeat(2, minmax(0,1fr)); }
@media (min-width:620px){ .ib-spec { grid-template-columns:repeat(4, minmax(0,1fr)); } }
.ib-spec__cell { min-width:0; }

.ib-gallery { grid-template-columns:repeat(2, minmax(0,1fr)); }
@media (min-width:720px){ .ib-gallery { grid-template-columns:repeat(3, minmax(0,1fr)); } }
.ib-gallery figure { min-width:0; }

.ib-inside { grid-template-columns:minmax(0,1fr); }
@media (min-width:640px){ .ib-inside { grid-template-columns:repeat(2, minmax(0,1fr)); } }
.ib-inside__item { min-width:0; }
.ib-inside__d, .ib-inside__t { overflow-wrap:anywhere; }

/* Cards: never let a 300px min track exceed a narrow phone. */
.ib-shop-grid { grid-template-columns:repeat(auto-fill, minmax(min(300px, 100%), 1fr)); }
.ib-pcard, .ib-pcard__body, .ib-pcard__foot { min-width:0; }
.ib-pcard__desc, .ib-pcard h3 { overflow-wrap:anywhere; }

/* Media can never exceed its box. */
.ib-buybox__cover, .ib-gallery img, .ib-pcard__cover img, .ib-co__summary img {
  max-width:100%; height:auto;
}

/* Currency rail scrolls inside its own box rather than widening the page. */
.ib-curbar, .ib-curbar__rail { max-width:100%; min-width:0; }

/* Checkout summary must wrap, not push. */
.ib-co__summary, .ib-co__summary > div { min-width:0; }
.ib-co__summary .t { overflow-wrap:anywhere; }

/* Phone polish */
@media (max-width:560px){
  .ib-spec__cell { padding:.9rem 1rem; }
  .ib-spec__v { font-size:1.02rem; }
  .ib-buybox { padding:1.25rem; }
  .ib-pcard__foot { flex-wrap:wrap; gap:.75rem; }
  .ib-pcard__cta { width:100%; }
  .ib-pcard__cta .ib-btn { flex:1; justify-content:center; }
}