/* ============================================================================
 * library-books.css — Growth Library 3D book covers.
 * Six-face cuboid: front cover, back cover, spine, fore-edge page block,
 * top edge, bottom edge. Hover (desktop) or tap (mobile) flips to back.
 * ========================================================================== */

.iis-bookshelf {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 88px 52px;            /* extra vertical room for the floor shadow */
  padding: 30px 12px 60px;
  /* NOTE: perspective lives on each .iis-book (single, per-book projection).
     Putting it here too stacks a second projection and distorts the box. */
}

.iis-book {
  position: relative;
  width: 100%;
  aspect-ratio: 2 / 3;
  max-width: 240px;
  margin: 0 auto;
  --book-depth: 36px;
  /* Pose A (ref 1): stands nearly upright, turned to reveal the SPINE on the left.
     rest-x kept tiny so the view is near eye-level — a downward tilt makes the
     spine's top edge poke past the cover's top-left corner. */
  --rest-x: 1deg;
  --rest-y: 23deg;
  transform-style: preserve-3d;
  transform: perspective(1700px) rotateX(var(--rest-x)) rotateY(var(--rest-y));
  transition: transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
  cursor: pointer;
  border-radius: 3px 7px 7px 3px;
  /* NOTE: do NOT add filter / opacity / clip-path / mask here — any of them
     forces this element to flatten its children, which silently overrides
     transform-style: preserve-3d and breaks the flip. The cast shadow lives
     on the .iis-book__face elements instead (so it rotates with the book). */
  will-change: transform;
}

/* Pose B (ref 2): every other book turns harder into a deeper 3D angle.
   Works for bare books (standalone demo) and books inside .iis-book-cell
   (the live Growth Library wraps each book in a cell with a caption). */
.iis-book:nth-child(even),
.iis-book-cell:nth-child(even) .iis-book {
  --rest-x: 2deg;
  --rest-y: 33deg;
}

.iis-book:focus { outline: none; }
.iis-book:focus-visible {
  outline: 2px solid #c8a046;
  outline-offset: 8px;
  border-radius: 4px;
}

@media (hover: hover) and (pointer: fine) {
  .iis-book:hover {
    transform: perspective(1700px) rotateX(3deg) rotateY(180deg) translateY(-12px);
  }
}
.iis-book.is-flipped {
  transform: perspective(1700px) rotateX(3deg) rotateY(180deg) translateY(-12px);
}

.iis-book a,
.iis-book a:hover,
.iis-book a:focus,
.iis-book a:visited { text-decoration: none; }

/* DO NOT add display:grid or flex here — breaks backface-visibility in Edge. */
.iis-book__face {
  position: absolute;
  inset: 0;
  border-radius: 3px 6px 6px 3px;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  overflow: hidden;
}

.iis-book__spine {
  position: absolute;
  top: 0; bottom: 0; left: 0;
  width: var(--book-depth);
  transform-origin: left center;
  transform: rotateY(-90deg);
  /* Hidden at rest: at rotateY(-18deg) the spine faces away from the camera.
     Without this, its mirrored backface bleeds through the hollow box. */
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  background:
    repeating-linear-gradient(180deg, transparent 0 18%, rgba(0,0,0,0.18) 18.6%, rgba(255,255,255,0.08) 19.2%, transparent 19.8% 38%),
    linear-gradient(to right, rgba(0,0,0,0.55) 0%, rgba(0,0,0,0.10) 65%, rgba(255,255,255,0.06) 100%),
    linear-gradient(180deg, color-mix(in srgb, var(--book-color1, #13294b) 88%, black), color-mix(in srgb, var(--book-color2, #0b1f3a) 88%, black));
  box-shadow: inset 0 8px 14px -8px rgba(0,0,0,0.7), inset 0 -8px 14px -8px rgba(0,0,0,0.7), inset 1px 0 0 rgba(0,0,0,0.35);
  border-radius: 2px 0 0 2px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.iis-book__spine-text {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  font: 600 9.5px/1 "Georgia", serif;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: rgba(220, 195, 130, 0.75);
  white-space: nowrap;
  text-shadow: 0 1px 0 rgba(0,0,0,0.5);
  max-height: 78%;
  overflow: hidden;
  padding: 0 4px;
}

.iis-book__pages {
  position: absolute;
  top: 4px; bottom: 4px; right: 0;
  width: calc(var(--book-depth) - 2px);
  transform-origin: right center;
  transform: rotateY(90deg);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  background:
    repeating-linear-gradient(to right, rgba(0,0,0,0.06) 0 0.4px, transparent 0.4px 1.4px),
    repeating-linear-gradient(to right, #f6ecc8 0 0.7px, #e0cf95 0.7px 1.4px),
    linear-gradient(180deg, #f6ecc6 0%, #cdb986 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.5), inset 0 -1px 0 rgba(0,0,0,0.2), inset -2px 0 4px -1px rgba(0,0,0,0.18), inset 2px 0 4px -1px rgba(0,0,0,0.18);
  border-radius: 0 1px 1px 0;
}
.iis-book__pages::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, rgba(255,255,255,0.18) 0%, transparent 40%, transparent 60%, rgba(0,0,0,0.10) 100%);
  pointer-events: none;
}

.iis-book__edge-top, .iis-book__edge-bottom {
  position: absolute;
  left: 2px; right: 2px;
  height: var(--book-depth);
  transition: opacity 0.3s ease;
  background:
    repeating-linear-gradient(to right, rgba(0,0,0,0.07) 0 0.4px, transparent 0.4px 1.4px),
    repeating-linear-gradient(to right, #f6ecc8 0 0.7px, #ddcb91 0.7px 1.4px),
    linear-gradient(90deg, #d8c590 0%, #f6ecc8 22%, #f6ecc8 78%, #c2b07c 100%);
}
.iis-book__edge-top {
  top: 0;
  transform: rotateX(90deg) translateY(calc(var(--book-depth) / -2)) translateZ(calc(var(--book-depth) / 2));
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.6), inset 0 -2px 4px rgba(0,0,0,0.18);
  /* Hidden: at the spine-forward angle its far corner pokes past the cover's
     top-left as a stray cream wedge. Thickness is carried by the spine instead. */
  display: none;
}
.iis-book__edge-bottom {
  bottom: 0;
  transform-origin: center bottom;
  transform: rotateX(90deg);
  /* Folds back from the bottom cover-line; its front now faces away (z < 0),
     so it's culled — we're looking slightly DOWN at the book, so the bottom
     cap must not show (only the top edge does). */
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,0.25), inset 0 2px 4px rgba(0,0,0,0.15);
}

/* When flipped to the back, drop the cream page-edge caps — the back is a
   cover, not an open page block, so it shouldn't have white top/bottom bands. */
.iis-book:hover .iis-book__edge-top,
.iis-book:hover .iis-book__edge-bottom,
.iis-book.is-flipped .iis-book__edge-top,
.iis-book.is-flipped .iis-book__edge-bottom {
  opacity: 0;
}

/* === FRONT COVER === */
.iis-book__front {
  background:
    linear-gradient(125deg, rgba(255,255,255,0.14) 0%, rgba(255,255,255,0.04) 18%, transparent 36%, transparent 70%, rgba(0,0,0,0.18) 100%),
    radial-gradient(ellipse at 92% 96%, rgba(0,0,0,0.32) 0%, transparent 55%),
    radial-gradient(ellipse at 22% 18%, rgba(255, 240, 200, 0.08) 0%, transparent 50%),
    linear-gradient(135deg, var(--book-color1, #13294b) 0%, var(--book-color2, #0b1f3a) 100%);
  color: #f4e9c8;
  display: block;
  transform: translateZ(0.5px);
  box-shadow:
    0 28px 32px -14px rgba(0, 0, 0, 0.55),
    inset 10px 0 18px -8px rgba(0,0,0,0.75),
    inset 0 1px 0 rgba(255,255,255,0.14),
    inset 0 -1px 0 rgba(0,0,0,0.55),
    inset -1px 0 0 rgba(0,0,0,0.35);
}
.iis-book__front::before {
  content: "";
  position: absolute;
  top: 0; bottom: 0; left: 16px;
  width: 1px;
  background: rgba(0,0,0,0.45);
  box-shadow: -1px 0 1px rgba(255,255,255,0.10), 1px 0 2px rgba(0,0,0,0.5);
}
.iis-book__front::after {
  content: "";
  position: absolute;
  inset: 18px 16px 18px 28px;
  border: 1px solid rgba(200, 168, 96, 0.50);
  border-radius: 1px;
  box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.35), inset 0 -1px 0 rgba(255, 220, 140, 0.18);
  pointer-events: none;
}

.iis-book__series {
  position: absolute;
  top: 30px;
  left: 28px;
  right: 16px;
  z-index: 2;
  font: 500 9.5px/1 "Inter", "Helvetica Neue", Arial, sans-serif;
  letter-spacing: 0.42em;
  text-transform: uppercase;
  color: rgba(220, 196, 130, 0.62);
  text-shadow: 0 1px 0 rgba(0,0,0,0.5);
  text-align: center;
}

.iis-book__title {
  position: absolute;
  top: 50%;
  left: 28px;
  right: 16px;
  transform: translateY(-50%);
  z-index: 2;
  font: 700 23px/1.18 "Cormorant Garamond", "Playfair Display", "Georgia", serif;
  margin: 0;
  padding: 0 4px;
  text-align: center;
  text-wrap: balance;
  /* Wrap on whole words only (never mid-word like "Suppo rt"); break a single
     over-long word if forced; clamp to keep long titles off the series/author. */
  hyphens: manual;
  word-break: normal;
  overflow-wrap: break-word;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  overflow: hidden;
  max-height: 5.2em;
  letter-spacing: -0.005em;
  background: linear-gradient(170deg, #f3e0a8 0%, #d3aa54 28%, #9c6f24 48%, #b9853a 56%, #e9c97b 78%, #f3e0a8 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  filter: drop-shadow(0 1px 0.5px rgba(0,0,0,0.55)) drop-shadow(0.5px 1.5px 1.5px rgba(0,0,0,0.35));
  text-shadow: 0 -0.5px 0 rgba(255, 235, 175, 0.25), 0 0.5px 0 rgba(255, 215, 135, 0.18);
}
.iis-book__title--long  { font-size: 18px; }
.iis-book__title--xlong { font-size: 14.5px; line-height: 1.24; }

.iis-book__author {
  position: absolute;
  bottom: 30px;
  left: 28px;
  right: 16px;
  z-index: 2;
  font: 600 10px/1.4 "Inter", "Helvetica Neue", Arial, sans-serif;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(220, 196, 130, 0.62);
  text-align: center;
  text-shadow: 0 1px 0 rgba(0,0,0,0.5);
}

.iis-book__crest {
  position: absolute;
  bottom: 16px; right: 18px;
  width: 26px; height: 26px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, rgba(255,225,150,0.35) 0%, transparent 60%);
  border: 1px solid rgba(200,160,70,0.65);
  display: grid;
  place-items: center;
  font: 700 11px/1 "Georgia", serif;
  color: transparent;
  z-index: 3;
  box-shadow: inset 0 1px 0 rgba(255,225,150,0.25), inset 0 -1px 0 rgba(0,0,0,0.5), 0 1px 0 rgba(0,0,0,0.3);
}
.iis-book__crest::after {
  content: attr(data-letter);
  background: linear-gradient(180deg, #f0d488 0%, #c89a3d 50%, #8e6312 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: 0 1px 0 rgba(0,0,0,0.55);
}

/* === BACK COVER === */
/* Same cloth binding as the front — NOT a paper page. Uses the book's theme
   colors so each back matches its own front; spine hinge + gold frame are
   mirrored to the right (this face is rotateY(180deg)). */
.iis-book__back {
  transform: rotateY(180deg) translateZ(0.5px);
  background:
    linear-gradient(235deg, rgba(255,255,255,0.12) 0%, rgba(255,255,255,0.04) 18%, transparent 36%, transparent 70%, rgba(0,0,0,0.20) 100%),
    radial-gradient(ellipse at 86% 96%, rgba(0,0,0,0.30) 0%, transparent 55%),
    radial-gradient(ellipse at 78% 16%, rgba(255, 240, 200, 0.07) 0%, transparent 50%),
    linear-gradient(135deg, var(--book-color1, #13294b) 0%, var(--book-color2, #0b1f3a) 100%);
  color: #f4e9c8;
  padding: 28px 30px 22px 24px;
  display: flex;
  flex-direction: column;
  box-shadow:
    0 28px 32px -14px rgba(0, 0, 0, 0.55),
    inset -10px 0 18px -8px rgba(0,0,0,0.75),
    inset 0 1px 0 rgba(255,255,255,0.12),
    inset 0 -1px 0 rgba(0,0,0,0.55),
    inset 1px 0 0 rgba(0,0,0,0.35);
}
.iis-book__back::before {            /* spine hinge — dark, like the front */
  content: "";
  position: absolute;
  top: 0; bottom: 0; right: 16px;
  width: 1px;
  background: rgba(0,0,0,0.45);
  box-shadow: 1px 0 1px rgba(255,255,255,0.10), -1px 0 2px rgba(0,0,0,0.5);
}
.iis-book__back::after {             /* gold-foil frame, mirrored from the front */
  content: "";
  position: absolute;
  inset: 18px 28px 18px 16px;
  border: 1px solid rgba(200, 168, 96, 0.45);
  border-radius: 1px;
  box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.35), inset 0 -1px 0 rgba(255, 220, 140, 0.18);
  pointer-events: none;
}

.iis-book__audience {
  display: inline-block;
  padding: 4px 10px;
  font: 700 9px/1 "Inter", "Helvetica Neue", Arial, sans-serif;
  letter-spacing: 0.20em;
  text-transform: uppercase;
  border-radius: 99px;
  color: #fffaf0;
  margin-bottom: 10px;
  align-self: flex-start;
  border: 1px solid rgba(244, 233, 200, 0.30);   /* keeps the pill legible on any dark cover */
}
.iis-book__audience--humans   { background: #b8954f; }
.iis-book__audience--it       { background: #3f6cae; }   /* brightened from navy so it shows on a navy back */
.iis-book__audience--business { background: #b5733a; }   /* brightened from brown */
.iis-book__audience--everyone { background: #9a9a9a; }

.iis-book__back-title {
  font: 600 14.5px/1.22 "Cormorant Garamond", "Georgia", serif;
  margin: 0 0 8px;
  color: #f1dca6;                                  /* warm gold-foil, was navy */
  text-shadow: 0 1px 0 rgba(0,0,0,0.45);
  letter-spacing: -0.003em;
}

.iis-book__summary {
  font: 12.5px/1.55 "Cormorant Garamond", "Georgia", serif;
  color: rgba(244, 233, 200, 0.84);               /* cream, was dark ink */
  margin: 0;
  font-style: italic;
  letter-spacing: 0.005em;
  flex: 1 1 auto;
  overflow: hidden;
  min-height: 0;
}

.iis-book__meta {
  margin-top: 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border-top: 1px solid rgba(200, 168, 96, 0.30);  /* gold rule, was navy */
  padding-top: 12px;
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
}

.iis-book__price {
  font: 700 17px/1 "Cormorant Garamond", "Georgia", serif;
  color: #f0d488;                                  /* gold, was navy */
}
.iis-book__price-strike {
  font-size: 11px;
  font-weight: 400;
  color: #998a6c;
  text-decoration: line-through;
  margin-right: 4px;
}

.iis-book__open {
  font: 600 11px/1 "Inter", "Helvetica Neue", Arial, sans-serif;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #1a1407;
  background: linear-gradient(180deg, #f0d488 0%, #c89a3d 100%);
  padding: 8px 12px;
  border-radius: 3px;
  border: 1px solid #e9c97b;
  transition: filter 0.25s ease, transform 0.2s ease;
}
.iis-book__open:hover { filter: brightness(1.08); transform: translateY(-1px); }

.iis-book.is-locked .iis-book__front { filter: grayscale(0.7) brightness(0.85); }
.iis-book.is-locked .iis-book__crest { opacity: 0.4; }
.iis-book.is-locked .iis-book__open  { background: #6b6b6b; border-color: #888; }

.iis-book.theme-navy    { --book-color1: #13294b; --book-color2: #0b1f3a; }
.iis-book.theme-emerald { --book-color1: #1e4d3b; --book-color2: #0e2a20; }
.iis-book.theme-wine    { --book-color1: #5a1d2c; --book-color2: #371017; }
.iis-book.theme-ink     { --book-color1: #1a1407; --book-color2: #0a0703; }
.iis-book.theme-rust    { --book-color1: #6e3017; --book-color2: #421a0c; }
.iis-book.theme-forest  { --book-color1: #243927; --book-color2: #12201a; }
.iis-book.theme-cobalt  { --book-color1: #15355c; --book-color2: #08203c; }
.iis-book.theme-amber   { --book-color1: #6b4310; --book-color2: #3c2407; }
.iis-book.theme-slate   { --book-color1: #2b3340; --book-color2: #161c26; }
.iis-book.theme-plum    { --book-color1: #3d1a44; --book-color2: #1f0c25; }

@media (prefers-reduced-motion: reduce) {
  .iis-book, .iis-book.is-flipped, .iis-book:hover {
    transform: none !important;
    transition: none !important;
    animation: none !important;
  }
  .iis-book__face { transition: opacity 0.25s ease; }
  .iis-book__back { opacity: 0; transform: none; }
  .iis-book.is-flipped .iis-book__back,
  .iis-book:hover .iis-book__back { opacity: 1; }
  .iis-book.is-flipped .iis-book__front,
  .iis-book:hover .iis-book__front { opacity: 0; }
}

@media (max-width: 520px) {
  /* Let auto-fill (minmax 240) decide columns so books never shrink below 240px
     and trigger mid-word title breaks. Don't override the title sizes here —
     the length classes already keep long titles tidy at 240px. */
  .iis-bookshelf { gap: 52px 20px; }
}

/* ============================================================================
 * PRODUCTION (Growth Library) — each catalog product renders as a .iis-book-cell:
 * the 3D book plus an audience caption beneath it ("who it's for"). The back
 * cover carries the live Peek/Unlock commerce buttons.
 * ========================================================================== */
.iis-book-cell {
  display: block;            /* block (not flex): flex+aspect-ratio shrinks the book inside a grid cell */
  width: 100%;
  max-width: 240px;
  margin: 0 auto;
}
.iis-book-cell .iis-book { margin: 0; }

/* "Who it's for" caption under each book */
.iis-book-cap {
  margin-top: 16px;
  font: 600 10.5px/1.3 "Inter", "Helvetica Neue", Arial, sans-serif;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(220, 196, 130, 0.78);
  text-align: center;
}

/* Price + Peek/Unlock live BELOW the book (not on the back cover) */
.iis-book-buy {
  margin-top: 9px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
}
.iis-book-buy .iis-book__price {
  font: 700 16px/1 "Cormorant Garamond", "Georgia", serif;
  color: #f0d488;
  margin-right: 2px;
}

/* AI-systems audience pill colour (back cover) */
.iis-book__audience--ai { background: #4a5d8a; }

/* Two-button commerce row on the back (Peek + Unlock) */
.iis-book__actions { display: flex; align-items: center; gap: 6px; }
.iis-book__peek {
  font: 600 10px/1 "Inter", "Helvetica Neue", Arial, sans-serif;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #f4e9c8;
  background: rgba(244, 233, 200, 0.10);
  padding: 8px 9px;
  border-radius: 3px;
  border: 1px solid rgba(200, 168, 96, 0.45);
  cursor: pointer;
  transition: background 0.2s ease, transform 0.2s ease;
}
.iis-book__peek:hover { background: rgba(244, 233, 200, 0.18); transform: translateY(-1px); }
.iis-book__meta .iis-book__open { cursor: pointer; }

/* Locked / coming-soon books */
.iis-book.is-locked .iis-book__peek { display: none; }

/* Concierge-book hint under the buy row */
.iis-book-note {
  margin-top: 7px;
  font: 500 9.5px/1.4 "Inter", "Helvetica Neue", Arial, sans-serif;
  letter-spacing: 0.04em;
  color: rgba(244, 233, 200, 0.42);
  text-align: center;
}

/* ============================================================================
 * CONCIERGE BOOK ORDER MODAL — fee breakdown, optional services, T&C gate.
 * ========================================================================== */
.iis-bk-modal {
  position: fixed; inset: 0; z-index: 9999;
  display: flex; align-items: center; justify-content: center;
  padding: 24px;
  background: rgba(4, 8, 16, 0.78);
  -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
  animation: iis-bk-fade 0.2s ease;
}
@keyframes iis-bk-fade { from { opacity: 0; } to { opacity: 1; } }
.iis-bk-card {
  position: relative;
  width: 100%; max-width: 440px;
  max-height: 90vh; overflow-y: auto;
  background: linear-gradient(180deg, #11172b 0%, #0b1020 100%);
  border: 1px solid rgba(200, 168, 96, 0.35);
  border-radius: 12px;
  padding: 30px 28px 26px;
  color: #f4e9c8;
  box-shadow: 0 30px 80px -20px rgba(0, 0, 0, 0.8);
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
}
.iis-bk-x {
  position: absolute; top: 12px; right: 14px;
  width: 32px; height: 32px; line-height: 30px;
  background: none; border: none; color: rgba(244, 233, 200, 0.55);
  font-size: 26px; cursor: pointer; border-radius: 6px;
}
.iis-bk-x:hover { color: #f4e9c8; background: rgba(244, 233, 200, 0.08); }
.iis-bk-head { margin-bottom: 18px; padding-right: 24px; }
.iis-bk-ey { font-size: 9.5px; letter-spacing: 0.26em; text-transform: uppercase; color: #d3aa54; font-weight: 700; }
.iis-bk-head h3 { font: 600 19px/1.25 "Cormorant Garamond", Georgia, serif; margin: 6px 0 2px; color: #f4e9c8; }
.iis-bk-head p { margin: 0; font-size: 12px; color: rgba(244, 233, 200, 0.55); }
.iis-bk-rows { border-top: 1px solid rgba(244, 233, 200, 0.12); padding-top: 12px; }
.iis-bk-rows .r, .iis-bk-svc-wrap .r {
  display: flex; justify-content: space-between; gap: 12px;
  font-size: 12.5px; color: rgba(244, 233, 200, 0.78);
  padding: 5px 0;
}
.iis-bk-rows .r span:last-child { color: #f4e9c8; font-variant-numeric: tabular-nums; }
.iis-bk-svc-wrap { margin-top: 14px; border-top: 1px solid rgba(244, 233, 200, 0.12); padding-top: 12px; }
.iis-bk-lbl { font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: rgba(244, 233, 200, 0.5); margin-bottom: 8px; }
.iis-bk-svc {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 8px 0; cursor: pointer; border-bottom: 1px solid rgba(244, 233, 200, 0.06);
}
.iis-bk-svc input { width: 16px; height: 16px; margin-top: 2px; accent-color: #c8a046; flex: 0 0 auto; }
.iis-bk-svc .t { font-size: 12.5px; color: #f4e9c8; flex: 1 1 auto; }
.iis-bk-svc .t small { display: block; font-size: 10.5px; color: rgba(244, 233, 200, 0.5); margin-top: 2px; }
.iis-bk-svc .pr { color: #f0d488; font-weight: 600; white-space: nowrap; font-size: 12.5px; }
.iis-bk-svc-wrap .r.sub { color: rgba(244, 233, 200, 0.5); padding-top: 8px; }
.iis-bk-total {
  display: flex; justify-content: space-between; align-items: baseline;
  margin: 16px 0 14px; padding-top: 14px;
  border-top: 1px solid rgba(200, 168, 96, 0.3);
}
.iis-bk-total span:first-child { font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: rgba(244, 233, 200, 0.6); }
.iis-bk-total span:last-child { font: 700 24px/1 "Cormorant Garamond", Georgia, serif; color: #f0d488; font-variant-numeric: tabular-nums; }
.iis-bk-tnc { display: flex; align-items: flex-start; gap: 10px; cursor: pointer; margin-bottom: 16px; }
.iis-bk-tnc input { width: 16px; height: 16px; margin-top: 2px; accent-color: #c8a046; flex: 0 0 auto; }
.iis-bk-tnc span { font-size: 11.5px; line-height: 1.55; color: rgba(244, 233, 200, 0.7); }
.iis-bk-tnc a { color: #d3aa54; }
.iis-bk-go {
  width: 100%; padding: 13px; border-radius: 4px;
  background: linear-gradient(180deg, #f0d488 0%, #c89a3d 100%);
  border: 1px solid #e9c97b; color: #1a1407;
  font: 700 12px/1 "Inter", "Helvetica Neue", Arial, sans-serif;
  letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer;
  transition: filter 0.2s ease, transform 0.15s ease;
}
.iis-bk-go:hover:not(:disabled) { filter: brightness(1.08); transform: translateY(-1px); }
.iis-bk-go:disabled { opacity: 0.4; cursor: not-allowed; }
.iis-bk-fine { margin: 12px 0 0; font-size: 10.5px; line-height: 1.6; color: rgba(244, 233, 200, 0.45); }