/* ==========================================================================
   Book page: "ورقتك العلمية الأولى" — colorful, playful theme
   Scoped under body.bp-page so other book pages are unaffected.
   ========================================================================== */

.bp-page {
  --c-blue: #1F4ED8;   --s-blue: #EAF0FD;   --d-blue: #1A3FB0;
  --c-orange: #F7941D; --s-orange: #FFF2E2; --d-orange: #C2620A;
  --c-violet: #7C3AED; --s-violet: #F2ECFE; --d-violet: #6D28D9;
  --c-pink: #EC4899;   --s-pink: #FDEAF3;   --d-pink: #BE185D;
  --c-teal: #14B8A6;   --s-teal: #E3F7F4;   --d-teal: #0F766E;
  --c-sky: #0EA5E9;    --s-sky: #E2F3FD;    --d-sky: #0369A1;
  --rainbow: linear-gradient(120deg, #1F4ED8 0%, #7C3AED 40%, #EC4899 70%, #F7941D 100%);
}
.bp-c-blue   { --c: var(--c-blue);   --cs: var(--s-blue);   --cd: var(--d-blue); }
.bp-c-orange { --c: var(--c-orange); --cs: var(--s-orange); --cd: var(--d-orange); }
.bp-c-violet { --c: var(--c-violet); --cs: var(--s-violet); --cd: var(--d-violet); }
.bp-c-pink   { --c: var(--c-pink);   --cs: var(--s-pink);   --cd: var(--d-pink); }
.bp-c-teal   { --c: var(--c-teal);   --cs: var(--s-teal);   --cd: var(--d-teal); }
.bp-c-sky    { --c: var(--c-sky);    --cs: var(--s-sky);    --cd: var(--d-sky); }

/* Headings: keep Arabic text in Cairo in both languages */
.bp-page main h1, .bp-page main h2, .bp-page main h3 {
  font-family: "Newsreader", "Cairo", Georgia, serif;
}
html[dir="rtl"] .bp-page main h1,
html[dir="rtl"] .bp-page main h2,
html[dir="rtl"] .bp-page main h3,
.bp-page .book-hero-title { font-family: "Cairo", "Newsreader", sans-serif; }

.bp-page .section-head--center { margin-left: auto; margin-right: auto; text-align: center; }

/* Colored pill eyebrow */
.bp-pill {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 7px 16px; border-radius: 999px;
  background: var(--cs, var(--s-violet)); color: var(--cd, var(--d-violet));
  font-size: 13px; font-weight: 700; letter-spacing: 0.02em;
  margin-bottom: 14px;
}
.bp-pill::before { display: none; }

/* ---------- Floating decorations ---------- */
.bp-shapes { position: absolute; inset: 0; pointer-events: none; z-index: 0; }
.bp-shape {
  position: absolute; display: block; font-weight: 800; line-height: 1;
  animation: bpDrift var(--dur, 7s) ease-in-out infinite;
  animation-delay: var(--delay, 0s);
}
.bp-shape--dot   { width: var(--size, 16px); height: var(--size, 16px); border-radius: 50%; background: var(--c); opacity: .85; }
.bp-shape--ring  { width: var(--size, 40px); height: var(--size, 40px); border-radius: 50%; border: 5px solid var(--c); opacity: .55; }
.bp-shape--glyph { color: var(--c); font-size: var(--size, 28px); opacity: .7; font-family: "Inter", sans-serif; }
.bp-shape--blob  { width: var(--size, 70px); height: var(--size, 70px); border-radius: 42% 58% 63% 37% / 41% 44% 56% 59%; background: var(--c); opacity: .14; }
@keyframes bpDrift {
  0%, 100% { transform: translate(0, 0) rotate(0deg); }
  33%      { transform: translate(6px, -14px) rotate(12deg); }
  66%      { transform: translate(-8px, 6px) rotate(-8deg); }
}

/* ---------- Hero ---------- */
.bp-page .book-hero {
  position: relative; overflow: hidden;
  padding: 64px 0 96px;
  background:
    radial-gradient(520px 380px at 8% 12%, rgba(124, 58, 237, .16), transparent 65%),
    radial-gradient(520px 380px at 92% 18%, rgba(247, 148, 29, .20), transparent 65%),
    radial-gradient(600px 460px at 72% 105%, rgba(20, 184, 166, .16), transparent 65%),
    radial-gradient(480px 380px at 0% 100%, rgba(236, 72, 153, .14), transparent 65%),
    #FCFBFF;
}
.bp-page .book-hero .container { position: relative; z-index: 1; }
.bp-page .book-cover-frame {
  position: relative; background: transparent; border: 0; padding: 0; max-width: 340px;
}
.bp-page .book-cover-frame::before {
  content: ""; position: absolute; inset: 10% 6%;
  border-radius: 50%;
  background: conic-gradient(from 0deg, #1F4ED8, #7C3AED, #EC4899, #F7941D, #14B8A6, #1F4ED8);
  filter: blur(42px); opacity: .45; z-index: 0;
  animation: bpSpin 14s linear infinite;
}
.bp-page .book-cover-frame img {
  position: relative; z-index: 1;
  animation: bpBob 5s ease-in-out infinite;
}
@keyframes bpSpin { to { transform: rotate(360deg); } }
@keyframes bpBob {
  0%, 100% { transform: translateY(0) rotate(-1.5deg); }
  50%      { transform: translateY(-12px) rotate(1.5deg); }
}

.bp-page .book-hero-title {
  font-size: clamp(36px, 5vw, 58px); font-weight: 700; line-height: 1.25;
  background: var(--rainbow); -webkit-background-clip: text; background-clip: text;
  color: transparent; margin-bottom: 8px;
  padding-bottom: 4px;
}
.bp-page .book-hero-subtitle { font-size: 20px; font-weight: 600; color: var(--text-dark); margin-bottom: 10px; }
.bp-page .book-hero-author { font-size: 15px; color: var(--d-violet); margin-bottom: 18px; }
.bp-page .book-hero-desc { font-size: 17px; color: #475569; margin-bottom: 22px; }

.bp-chips { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 30px; }
.bp-chip {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 9px 16px; border-radius: 999px;
  background: var(--cs); color: var(--cd);
  border: 1.5px solid color-mix(in srgb, var(--c) 30%, transparent);
  font-size: 14px; font-weight: 700;
  transition: transform .25s ease;
}
.bp-chip:hover { transform: translateY(-3px) rotate(-2deg); }
.bp-chip-emoji { font-size: 17px; line-height: 1; }

.bp-buy-title { font-size: 15px; font-weight: 700; color: var(--text-dark); margin-bottom: 12px; font-family: inherit !important; }
.bp-buy { display: flex; flex-wrap: wrap; gap: 12px; }
.bp-buy .btn {
  border: 0; border-radius: 999px; padding: 14px 26px; font-size: 15px; font-weight: 700;
  color: #fff; transition: transform .2s ease, box-shadow .2s ease;
}
.bp-buy .bp-btn-jarir   { background: linear-gradient(135deg, #F7941D, #EC4899); box-shadow: 0 10px 24px -8px rgba(236, 72, 153, .55); }
.bp-buy .bp-btn-madarak { background: linear-gradient(135deg, #1F4ED8, #7C3AED); box-shadow: 0 10px 24px -8px rgba(124, 58, 237, .55); }
.bp-buy .btn:hover { transform: translateY(-3px) scale(1.03); color: #fff; }

/* ---------- FAQ bubbles: one color each ---------- */
.bp-page .faq-cloud-section { background: #fff; }
.bp-page .faq-bubble:nth-child(6n+1) { --c: var(--c-blue);   --cs: var(--s-blue); }
.bp-page .faq-bubble:nth-child(6n+2) { --c: var(--c-orange); --cs: var(--s-orange); }
.bp-page .faq-bubble:nth-child(6n+3) { --c: var(--c-violet); --cs: var(--s-violet); }
.bp-page .faq-bubble:nth-child(6n+4) { --c: var(--c-pink);   --cs: var(--s-pink); }
.bp-page .faq-bubble:nth-child(6n+5) { --c: var(--c-teal);   --cs: var(--s-teal); }
.bp-page .faq-bubble:nth-child(6n+6) { --c: var(--c-sky);    --cs: var(--s-sky); }
.bp-page .faq-bubble .faq-bubble-inner {
  background: var(--cs); border: 2px solid color-mix(in srgb, var(--c) 28%, transparent);
  font-weight: 600; box-shadow: 0 8px 20px -10px color-mix(in srgb, var(--c) 60%, transparent);
}
.bp-page .faq-bubble .faq-bubble-icon { background: var(--c); color: #fff; }
.bp-page .faq-bubble.reveal.is-visible:hover .faq-bubble-inner { border-color: var(--c); }

/* ---------- Audience: moving colorful cards ---------- */
.bp-audience-section { position: relative; overflow: hidden; background: linear-gradient(180deg, #FCFBFF 0%, #F6F3FF 100%); }
.bp-aud-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px;
  position: relative; z-index: 1;
}
.bp-aud-card {
  position: relative; overflow: hidden;
  background: #fff; border-radius: 24px; padding: 28px 26px 26px;
  border: 2px solid color-mix(in srgb, var(--c) 18%, transparent);
  box-shadow: 0 14px 30px -18px color-mix(in srgb, var(--c) 70%, transparent);
  transition: opacity .7s ease, transform .35s cubic-bezier(.34, 1.56, .64, 1), border-color .25s ease, box-shadow .25s ease;
  transition-delay: calc(var(--i, 0) * 80ms), 0s, 0s, 0s;
}
.bp-aud-card::after {
  content: ""; position: absolute; width: 130px; height: 130px; border-radius: 50%;
  background: var(--cs); top: -50px; inset-inline-end: -40px; z-index: 0;
  transition: transform .4s ease;
}
.bp-aud-card > * { position: relative; z-index: 1; }
.bp-aud-card.reveal.is-visible:hover {
  transform: translateY(-10px) rotate(-1.2deg);
  border-color: var(--c);
  box-shadow: 0 24px 40px -18px color-mix(in srgb, var(--c) 80%, transparent);
}
.bp-aud-card:hover::after { transform: scale(1.5); }
.bp-aud-emoji {
  width: 66px; height: 66px; border-radius: 20px;
  display: flex; align-items: center; justify-content: center;
  font-size: 34px; line-height: 1; margin-bottom: 18px;
  background: var(--c); box-shadow: 0 10px 20px -8px var(--c);
  animation: bpHop 3.2s ease-in-out infinite;
  animation-delay: calc(var(--i, 0) * -0.5s);
}
@keyframes bpHop {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  20%      { transform: translateY(-8px) rotate(-6deg); }
  40%      { transform: translateY(0) rotate(0deg); }
  55%      { transform: translateY(-4px) rotate(5deg); }
  70%      { transform: translateY(0) rotate(0deg); }
}
.bp-aud-card:hover .bp-aud-emoji { animation-duration: 1s; }
.bp-aud-label { font-size: 21px; font-weight: 700; color: var(--cd); margin-bottom: 8px; }
.bp-aud-card p { font-size: 15px; color: #475569; line-height: 1.7; }

/* ---------- Table of contents: journey tiles ---------- */
.bp-toc-section { background: #fff; }
.bp-toc {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 16px;
}
.bp-toc-item {
  position: relative; display: flex; align-items: center; gap: 14px;
  padding: 18px 18px; border-radius: 18px;
  background: var(--cs);
  border: 2px solid transparent;
  transition: opacity .7s ease, transform .3s cubic-bezier(.34, 1.56, .64, 1), border-color .2s ease, background .2s ease;
}
.bp-toc-item.reveal.is-visible:hover { transform: translateY(-6px) scale(1.03); border-color: var(--c); background: #fff; }
.bp-toc-num {
  flex-shrink: 0; width: 46px; height: 46px; border-radius: 14px;
  background: var(--c); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-family: "Inter", sans-serif; font-weight: 800; font-size: 17px;
  box-shadow: 0 8px 16px -8px var(--c);
}
.bp-toc-item p { font-size: 15.5px; font-weight: 600; color: var(--text-dark); line-height: 1.45; flex: 1; }
.bp-toc-emoji { font-size: 22px; line-height: 1; transition: transform .3s ease; }
.bp-toc-item:hover .bp-toc-emoji { transform: scale(1.35) rotate(-10deg); }

/* ---------- Author note ---------- */
.bp-note-section { background: linear-gradient(180deg, #F6F3FF 0%, #FFF6EC 100%); }
.bp-page .author-note {
  border: 3px solid transparent;
  background: linear-gradient(#fff, #fff) padding-box, var(--rainbow) border-box;
  box-shadow: 0 30px 60px -30px rgba(124, 58, 237, .45);
}
.bp-page .author-note-icon { color: var(--c-violet); opacity: .35; }
.bp-page .author-note-sign .author-note-author { color: var(--d-violet); }

/* ---------- Testimonials: colorful avatars ---------- */
.bp-page .coverflow-slide .coverflow-avatar { color: #fff; }
.bp-page .coverflow-slide:nth-child(6n+1) .coverflow-avatar { background: var(--c-blue); }
.bp-page .coverflow-slide:nth-child(6n+2) .coverflow-avatar { background: var(--c-orange); }
.bp-page .coverflow-slide:nth-child(6n+3) .coverflow-avatar { background: var(--c-violet); }
.bp-page .coverflow-slide:nth-child(6n+4) .coverflow-avatar { background: var(--c-pink); }
.bp-page .coverflow-slide:nth-child(6n+5) .coverflow-avatar { background: var(--c-teal); }
.bp-page .coverflow-slide:nth-child(6n+6) .coverflow-avatar { background: var(--c-sky); }
.bp-page .coverflow-dot.is-active { background: var(--c-violet); }

/* ---------- Closing call to action ---------- */
.bp-cta { padding: 0 0 112px; background: #fff; }
.bp-cta-box {
  position: relative; overflow: hidden; text-align: center;
  border-radius: 32px; padding: 64px 32px;
  background: linear-gradient(130deg, #1F4ED8 0%, #7C3AED 50%, #EC4899 100%);
  color: #fff;
}
.bp-cta-box .bp-shapes { z-index: 0; }
.bp-cta-box > :not(.bp-shapes) { position: relative; z-index: 1; }
.bp-cta-emoji { font-size: 48px; display: inline-block; margin-bottom: 10px; animation: bpBob 3.5s ease-in-out infinite; }
.bp-cta-box .section-title { color: #fff; margin-bottom: 10px; }
.bp-cta-box p { font-size: 18px; opacity: .92; margin-bottom: 28px; }
.bp-cta-box .bp-buy { justify-content: center; }
.bp-cta-box .bp-buy .btn { background: #fff; color: var(--d-violet); box-shadow: 0 12px 24px -10px rgba(0, 0, 0, .35); }
.bp-cta-box .bp-buy .bp-btn-jarir { color: var(--d-orange); }
.bp-cta-box .bp-buy .btn:hover { color: var(--d-violet); }
.bp-cta-box .bp-buy .bp-btn-jarir:hover { color: var(--d-orange); }

/* ---------- Responsive ---------- */
@media (max-width: 960px) {
  .bp-aud-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 900px) {
  .bp-page .book-hero { padding: 40px 0 72px; text-align: center; }
  .bp-chips, .bp-page .book-hero .bp-buy { justify-content: center; }
  .bp-page .book-hero-desc { margin-left: auto; margin-right: auto; }
  .bp-page .book-cover-frame { max-width: 260px; }
}
@media (max-width: 600px) {
  .bp-aud-grid { grid-template-columns: 1fr; gap: 16px; }
  .bp-aud-card { display: grid; grid-template-columns: auto 1fr; column-gap: 16px; align-items: start; padding: 20px; }
  .bp-aud-emoji { width: 54px; height: 54px; font-size: 28px; margin-bottom: 0; grid-row: span 2; border-radius: 16px; }
  .bp-aud-label { font-size: 18px; margin-bottom: 4px; }
  .bp-toc { grid-template-columns: 1fr; gap: 12px; }
  .bp-cta { padding-bottom: 72px; }
  .bp-cta-box { padding: 48px 22px; border-radius: 24px; }
  .bp-shape { opacity: .35; }
  .bp-buy .btn { flex: 1 1 auto; text-align: center; justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
  .bp-shape, .bp-aud-emoji, .bp-page .book-cover-frame img,
  .bp-page .book-cover-frame::before, .bp-cta-emoji { animation: none; }
}

/* ---------- Author note with photo ---------- */
.bp-note-section { position: relative; overflow: hidden; }
.bp-note-wrap {
  position: relative; z-index: 1;
  display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 48px; align-items: center;
}
.bp-page .bp-note-wrap .author-note { max-width: none; margin: 0; }
.bp-note-photo { position: relative; margin: 0; max-width: 420px; justify-self: center; width: 100%; }
.bp-note-blob {
  position: absolute; inset: 14% 2% 0 2%;
  border-radius: 46% 54% 40% 60% / 52% 44% 56% 48%;
  background: linear-gradient(140deg, #F7941D 0%, #EC4899 45%, #7C3AED 100%);
  box-shadow: 0 30px 60px -25px rgba(124, 58, 237, .55);
  animation: bpMorph 12s ease-in-out infinite;
}
@keyframes bpMorph {
  0%, 100% { border-radius: 46% 54% 40% 60% / 52% 44% 56% 48%; }
  50%      { border-radius: 58% 42% 55% 45% / 42% 58% 42% 58%; }
}
.bp-note-photo picture, .bp-note-photo img {
  position: relative; z-index: 1; display: block; width: 100%; height: auto;
  border-bottom-left-radius: 40% 12%; border-bottom-right-radius: 40% 12%;
}
.bp-note-sticker {
  position: absolute; z-index: 2; top: 18%; inset-inline-start: -4%;
  width: 58px; height: 58px; border-radius: 18px;
  display: flex; align-items: center; justify-content: center; font-size: 28px;
  background: #fff; border: 3px solid var(--c);
  box-shadow: 0 12px 24px -10px var(--c);
  animation: bpHop 3.4s ease-in-out infinite;
}
.bp-note-sticker--2 { top: auto; bottom: 14%; inset-inline-start: auto; inset-inline-end: -3%; animation-delay: -1.6s; }

/* Coverflow side slides sit off-stage; keep them from widening the page */
.bp-page .bp-testimonials { overflow: hidden; }

@media (max-width: 900px) {
  .bp-note-wrap { grid-template-columns: 1fr; gap: 8px; }
  .bp-note-photo { max-width: 300px; }
}
@media (prefers-reduced-motion: reduce) {
  .bp-note-blob, .bp-note-sticker { animation: none; }
}

/* ==========================================================================
   Research section — navy, academic; animated paper mockup
   ========================================================================== */
.bp-research {
  position: relative; overflow: hidden;
  padding: 104px 0 0;
  background:
    radial-gradient(600px 400px at 85% 10%, rgba(124, 58, 237, .28), transparent 65%),
    radial-gradient(500px 400px at 5% 90%, rgba(20, 184, 166, .18), transparent 65%),
    linear-gradient(180deg, #0B1533 0%, #13224F 100%);
  color: #E2E8F0;
}
.bp-research::before { /* faint graph-paper grid */
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image:
    linear-gradient(rgba(148, 163, 184, .07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(148, 163, 184, .07) 1px, transparent 1px);
  background-size: 28px 28px;
}
.bp-research-grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.bp-research .section-title { color: #fff; }
.bp-pill--dark { background: rgba(99, 197, 218, .14); color: #8FE3F2; border: 1px solid rgba(99, 197, 218, .3); }
.bp-research-sub { font-size: 17px; color: #CBD5E1; margin-bottom: 26px; max-width: 520px; line-height: 1.8; }
.bp-research-list { display: grid; gap: 12px; margin-bottom: 30px; }
.bp-research-list li { display: flex; gap: 12px; align-items: flex-start; font-size: 15.5px; color: #E2E8F0; line-height: 1.6; }
.bp-research-tick {
  flex-shrink: 0; width: 24px; height: 24px; border-radius: 7px; margin-top: 2px;
  background: linear-gradient(135deg, #14B8A6, #1F4ED8); color: #fff;
  display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 800;
}
.bp-index-label { font-size: 13px; color: #94A3B8; margin-bottom: 12px; font-weight: 600; letter-spacing: .02em; }
.bp-index-names { display: flex; flex-wrap: wrap; gap: 10px; }
html[dir="rtl"] .bp-index-names { justify-content: flex-end; }
.bp-index-names span {
  font-family: "Inter", sans-serif; font-weight: 700; font-size: 15px; color: #fff;
  padding: 10px 16px; border-radius: 10px;
  background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .16);
}

/* Paper mockup */
.bp-paper-stage { position: relative; padding: 24px 28px 36px; }
.bp-paper {
  position: relative; background: #fff; color: #0F172A;
  border-radius: 6px; padding: 26px 26px 22px;
  font-family: "Newsreader", Georgia, serif; font-size: 10.5px; line-height: 1.45; text-align: left;
  box-shadow: 14px 12px 0 -3px #C7D2FE, 26px 22px 0 -6px rgba(199, 210, 254, .45), 0 40px 80px -30px rgba(0, 0, 0, .6);
  transform: rotate(-2.5deg);
  transition: transform .5s ease;
}

.bp-paper-stage:hover .bp-paper { transform: rotate(0deg) scale(1.02); }
.bp-paper-top { display: flex; justify-content: space-between; align-items: center; font-family: "Inter", sans-serif; font-size: 8.5px; color: #64748B; border-bottom: 1px solid #E2E8F0; padding-bottom: 8px; margin-bottom: 14px; text-transform: uppercase; letter-spacing: .06em; }
.bp-paper-oa { background: #FFF2E2; color: #C2620A; padding: 2px 7px; border-radius: 99px; font-weight: 700; }
.bp-paper-title { font-size: 19px; font-weight: 600; line-height: 1.2; text-align: center; margin-bottom: 6px; }
.bp-paper-authors { text-align: center; font-size: 11.5px; color: #1F4ED8; }
.bp-paper-affil { text-align: center; font-size: 8.5px; color: #64748B; margin-bottom: 12px; font-style: italic; }
.bp-paper-abstract { background: #F8FAFC; border-left: 3px solid #7C3AED; padding: 9px 11px; margin-bottom: 12px; }
.bp-paper-abstract b { font-size: 10px; }
.bp-paper-kw { margin-top: 6px; font-size: 9px; }
.bp-paper-kw span { display: inline-block; background: #F2ECFE; color: #6D28D9; border-radius: 4px; padding: 0 5px; margin-right: 3px; font-family: "Inter", sans-serif; }
.bp-paper-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.bp-paper-h { font-weight: 700; font-size: 10.5px; margin: 6px 0 4px; }
.bp-paper .ln {
  display: block; height: 4px; border-radius: 2px; background: #CBD5E1; margin: 4px 0;
  width: 0; transition: width 1.1s ease;
}
.bp-paper-stage.is-visible .ln { width: var(--w); }
.bp-paper .ln-cite { position: relative; }
.bp-paper .ln-cite::after { content: "[1]"; position: absolute; right: -16px; top: -5px; font-size: 8px; color: #1F4ED8; font-weight: 700; }
.bp-paper-table { width: 100%; border-collapse: collapse; margin-top: 8px; font-size: 9px; font-family: "Inter", sans-serif; }
.bp-paper-table th, .bp-paper-table td { border-top: 1px solid #CBD5E1; border-bottom: 1px solid #CBD5E1; padding: 3px 4px; text-align: left; }
.bp-paper-table tr:last-child td { font-weight: 700; color: #0F766E; }
.bp-paper-fig { border: 1px solid #E2E8F0; border-radius: 4px; padding: 6px; margin-bottom: 6px; }
.bp-paper-fig svg { width: 100%; height: auto; display: block; }
.bp-paper-fig span { display: block; font-size: 8px; color: #64748B; font-style: italic; margin-top: 3px; }
.bp-paper-fig .bar { transform-origin: 50% 62px; transform-box: view-box; transform: scaleY(0); transition: transform .8s cubic-bezier(.34, 1.56, .64, 1); }
.bp-paper-stage.is-visible .bar { transform: scaleY(1); }
.bp-paper-stage.is-visible .bar:nth-of-type(2) { transition-delay: .15s; }
.bp-paper-stage.is-visible .bar:nth-of-type(3) { transition-delay: .3s; }
.bp-paper-stage.is-visible .bar:nth-of-type(4) { transition-delay: .45s; }
.bp-paper-fig .trend { stroke-dasharray: 90; stroke-dashoffset: 90; transition: stroke-dashoffset 1s ease .8s; }
.bp-paper-stage.is-visible .trend { stroke-dashoffset: 0; }
.bp-paper-refs { margin-top: 8px; border-top: 1px solid #E2E8F0; padding-top: 4px; }
.bp-paper-refs .ref { display: flex; align-items: center; gap: 6px; font-size: 8.5px; color: #1F4ED8; font-weight: 700; }
.bp-paper-refs .ref .ln { flex: 0 0 auto; }
.bp-paper-doi { margin-top: 10px; font-family: "Inter", monospace; font-size: 8.5px; color: #64748B; }
.bp-paper-stamp {
  position: absolute; right: 18px; bottom: 26px;
  border: 3px solid #16A34A; color: #16A34A; border-radius: 10px;
  padding: 6px 12px; font-family: "Inter", sans-serif; font-weight: 900; font-size: 18px; letter-spacing: .12em;
  text-align: center; line-height: 1.1; background: rgba(255, 255, 255, .85);
  transform: rotate(-14deg) scale(2.2); opacity: 0;
  transition: transform .45s cubic-bezier(.34, 1.56, .64, 1) 1.6s, opacity .2s ease 1.6s;
}
.bp-paper-stamp small { display: block; font-size: 8px; letter-spacing: .04em; font-weight: 700; }
.bp-paper-stage.is-visible .bp-paper-stamp { transform: rotate(-14deg) scale(1); opacity: 1; }
.bp-paper-badge {
  position: absolute; z-index: 2; font-family: "Inter", sans-serif; font-weight: 700; font-size: 12.5px;
  padding: 8px 13px; border-radius: 999px; color: #fff; white-space: nowrap;
  box-shadow: 0 10px 22px -8px rgba(0, 0, 0, .5);
  animation: bpDrift 7s ease-in-out infinite;
}
.bp-paper-badge--1 { top: 4px; left: -6px; background: linear-gradient(135deg, #14B8A6, #0EA5E9); }
.bp-paper-badge--2 { top: 38%; right: -4px; background: linear-gradient(135deg, #F7941D, #EC4899); animation-delay: -2s; }
.bp-paper-badge--3 { bottom: 4px; left: 10%; background: linear-gradient(135deg, #1F4ED8, #7C3AED); animation-delay: -4s; }

/* Scrolling keyword ribbon */
.bp-marquee { position: relative; z-index: 1; margin-top: 80px; border-top: 1px solid rgba(255, 255, 255, .1); padding: 18px 0; overflow: hidden; background: rgba(0, 0, 0, .18); }
.bp-marquee-track { display: flex; gap: 44px; width: max-content; animation: bpMarquee 38s linear infinite; }
.bp-marquee-track span { font-family: "Inter", sans-serif; font-weight: 700; font-size: 15px; color: #94A3B8; white-space: nowrap; display: inline-flex; align-items: center; gap: 44px; }
.bp-marquee-track span::after { content: "◆"; font-size: 8px; color: #F7941D; }
@keyframes bpMarquee { to { transform: translateX(-50%); } }

/* ==========================================================================
   "The page is a paper": section numbers + invented science shapes
   ========================================================================== */
.bp-sec {
  display: block; font-family: "Inter", ui-monospace, monospace; font-size: 12px; font-weight: 700;
  letter-spacing: .08em; color: #94A3B8; margin-bottom: 10px; direction: ltr;
}
.bp-sec b { color: var(--c-violet); font-weight: 800; }
.bp-research .bp-sec { color: #64748B; }
.bp-research .bp-sec b { color: #8FE3F2; }
.bp-cta-box .bp-sec { color: rgba(255, 255, 255, .7); }
.bp-cta-box .bp-sec b { color: #fff; }
html[dir="rtl"] .bp-research-text .bp-sec { text-align: right; }

.bp-sci {
  position: absolute; pointer-events: none; z-index: 0;
  width: var(--size, 110px); height: auto; color: var(--c);
  opacity: .5; animation: bpDrift var(--dur, 9s) ease-in-out infinite; animation-delay: var(--delay, 0s);
}
.bp-research .bp-sci { opacity: .35; }
.bp-sci text { font-family: "Inter", sans-serif; font-weight: 700; fill: currentColor; }

@media (max-width: 900px) {
  .bp-research { padding-top: 72px; }
  .bp-research-grid { grid-template-columns: 1fr; gap: 40px; }
  .bp-paper-stage { max-width: 460px; margin: 0 auto; width: 100%; }
  .bp-marquee { margin-top: 56px; }
  .bp-sci { --size: 72px; opacity: .3; }
}
@media (max-width: 480px) {
  .bp-paper { padding: 18px 16px; font-size: 9.5px; }
  .bp-paper-title { font-size: 16px; }
  .bp-paper-stamp { font-size: 14px; right: 10px; }
  .bp-paper-badge { font-size: 11px; padding: 6px 10px; }
  .bp-paper-stage { padding: 20px 10px 30px; }
}
@media (prefers-reduced-motion: reduce) {
  .bp-marquee-track, .bp-paper-badge, .bp-sci { animation: none; }
  .bp-paper .ln { width: var(--w); transition: none; }
  .bp-paper-fig .bar { transform: none; transition: none; }
  .bp-paper-fig .trend { stroke-dashoffset: 0; }
  .bp-paper-stamp { transform: rotate(-14deg); opacity: 1; transition: none; }
}
.bp-page .faq-cloud-section, .bp-toc-section, .bp-page .bp-testimonials { position: relative; overflow: hidden; }
.bp-page .faq-cloud-section > .container, .bp-toc-section > .container, .bp-page .bp-testimonials > .container { position: relative; z-index: 1; }
.bp-page .book-hero .bp-sec { margin-bottom: 8px; }
.bp-page .author-note .bp-sec { margin-bottom: 6px; }

html[dir="rtl"] .bp-sec { text-align: right; }
.section-head--center .bp-sec, html[dir="rtl"] .section-head--center .bp-sec, .bp-cta-box .bp-sec { text-align: center; }
.bp-cta-box .bp-sci { opacity: .6; }
@media (max-width: 600px) {
  .bp-sci, .bp-research .bp-sci { opacity: .14; --size: 64px; }
}

/* "This book helps you write" strip */
.bp-writes {
  background: rgba(255, 255, 255, .75); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  border: 1.5px dashed #C4B5FD; border-radius: 18px;
  padding: 14px 16px 16px; margin-bottom: 18px; max-width: 600px;
}
.bp-writes-label { font-size: 14.5px; font-weight: 800; color: var(--d-violet); margin-bottom: 10px; }
.bp-writes-list { display: flex; flex-wrap: wrap; gap: 8px; }
.bp-writes-list li {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 7px 13px; border-radius: 10px; font-size: 14px; font-weight: 700;
  background: #fff; color: var(--cd); border: 1.5px solid color-mix(in srgb, var(--c) 35%, transparent);
  box-shadow: 0 6px 14px -10px var(--c);
  transition: transform .25s cubic-bezier(.34, 1.56, .64, 1), background .2s ease;
}
.bp-writes-list li:hover { transform: translateY(-3px) scale(1.04); background: var(--cs); }
.reveal.is-visible .bp-writes-list li { animation: bpPopIn .5s cubic-bezier(.34, 1.56, .64, 1) both; }
.reveal.is-visible .bp-writes-list li:nth-child(2) { animation-delay: .08s; }
.reveal.is-visible .bp-writes-list li:nth-child(3) { animation-delay: .16s; }
.reveal.is-visible .bp-writes-list li:nth-child(4) { animation-delay: .24s; }
.reveal.is-visible .bp-writes-list li:nth-child(5) { animation-delay: .32s; }
.reveal.is-visible .bp-writes-list li:nth-child(6) { animation-delay: .40s; }
@keyframes bpPopIn { from { opacity: 0; transform: scale(.6) translateY(8px); } to { opacity: 1; transform: none; } }
@media (max-width: 900px) {
  .bp-writes { margin-left: auto; margin-right: auto; }
  .bp-writes-list { justify-content: center; }
}
@media (prefers-reduced-motion: reduce) { .reveal.is-visible .bp-writes-list li { animation: none; } }
@media (max-width: 900px) { html[dir] .bp-page .book-hero .bp-sec { text-align: center; } }

.bp-page .book-hero .bp-writes { margin-top: 6px; margin-bottom: 30px; }
.bp-c-green { --c: #16A34A; --cs: #E7F7EC; --cd: #15803D; }
.reveal.is-visible .bp-writes-list li:nth-child(7) { animation-delay: .48s; }
.reveal.is-visible .bp-writes-list li:nth-child(8) { animation-delay: .56s; }
.author-note-cred {
  display: inline-flex; align-items: center; gap: 6px; margin-top: 10px !important;
  font-size: 12.5px; color: #64748B; background: #F8FAFC; border: 1px solid #E2E8F0;
  padding: 5px 11px; border-radius: 999px;
}

.bp-page .author-note-text { white-space: pre-line; }
.author-note-creds { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; margin-top: 14px; }
.author-note-creds .author-note-cred { margin-top: 0 !important; }

/* Author note: centered layout */
.bp-page .author-note { text-align: center; }
.bp-page .author-note .bp-sec,
html[dir="rtl"] .bp-page .author-note .bp-sec { text-align: center; }
.bp-page .author-note-icon { margin-left: auto; margin-right: auto; }
.bp-page .author-note .eyebrow { justify-content: center; }
.bp-page .author-note-sign { text-align: center; }
.bp-page .author-note-creds { justify-content: center; }
.bp-page .author-note-text { text-align: justify; text-justify: inter-word; }
/* "Cited by" counter badge */
.bp-paper-badge--3 { background: linear-gradient(135deg, #16A34A, #14B8A6); }
.bp-count { font-variant-numeric: tabular-nums; display: inline-block; min-width: 1.3em; text-align: center; font-size: 14px; }
.bp-count-arrow { display: inline-block; transition: transform .3s ease; }
.bp-counted .bp-count-arrow { animation: bpArrowUp 1.2s ease-in-out 3; }
.bp-counted .bp-paper-badge--3 { animation: bpBadgePop .5s cubic-bezier(.34, 1.56, .64, 1), bpDrift 7s ease-in-out .5s infinite; }
@keyframes bpArrowUp { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-4px); } }
@keyframes bpBadgePop { 0% { transform: scale(1); } 50% { transform: scale(1.18); } 100% { transform: scale(1); } }

.bp-page .book-cover-frame picture { display: contents; }