/* =========================================================
   Report page styles (content-dominant + compact price card)
   ========================================================= */

/* ---- Page background (report page only) ---- */
body.report-gradient{
  background:
    radial-gradient(1200px 520px at -10% -10%, rgba(110,75,255,.08), transparent 60%),
    radial-gradient(1000px 480px at 110% -10%, rgba(156,77,255,.08), transparent 60%),
    linear-gradient(180deg, #f9f5ff 0%, #f3ecff 40%, #ffffff 100%);
}

/* Slight elevation for white cards */
.rpt-head,
.tabpanels,
.buy-card{ box-shadow: 0 8px 22px rgba(110,75,255,.07); }

/* ---- Containers ---- */
.container{ max-width:1200px; margin:0 auto; padding:0 20px; }

/* ⚠️ Keep HEADER the same as homepage */
body.report-gradient header.site-header .container.nav-row{ max-width:1200px !important; }

/* Widen ONLY report content + crumbs (not the global header) */
.rpt-grid.container,
.container.crumbs{ max-width:min(96vw,1680px); }

/* =========================================================
   LAYOUT
   ========================================================= */

/* FORCE wider left column + tighter gutter */
.rpt-grid{
  display:grid;
  grid-template-columns:minmax(0, calc(100% - 340px - 12px)) 340px !important;
  gap:12px !important;
  margin-bottom:40px;
}
@media (max-width:992px){
  .rpt-grid{ grid-template-columns:1fr !important; }
}

/* Remove any hidden caps on the left stack */
.rpt-main,
.rpt-main .rpt-head,
.rpt-main .tabs,
.rpt-main .tabpanels{
  max-width:none !important;
  width:100% !important;
  margin-left:0 !important;
  margin-right:0 !important;
}

/* =========================================================
   HEADER (cover + title + meta)
   ========================================================= */
.rpt-head{
  display:grid;
  grid-template-columns:200px 1fr;
  gap:20px;
  border:1px solid var(--line);
  background:#fff;
  border-radius:14px;
  padding:18px;
  margin-bottom:16px;
}
@media (min-width:1360px){
  .rpt-head{ grid-template-columns:260px 1fr; }
}
@media (max-width:700px){
  .rpt-head{ grid-template-columns:1fr; }
}

.rpt-cover{ position:relative; }
.rpt-cover img{
  width:100%;
  height:auto;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--tint);
}
.badge.badge-pdf{
  position:absolute; left:8px; top:8px;
  background:#ef233c; color:#fff;
  font-size:.72rem; padding:3px 6px; border-radius:6px;
}

.rpt-htext h1{ margin:0 0 6px; font-size:1.5rem; line-height:1.3; }
.rpt-htext p{ margin:0 0 10px; color:var(--muted); }
.rpt-meta{
  display:flex; flex-wrap:wrap; gap:12px 18px;
  padding:0; margin:0; list-style:none; font-size:.95rem;
}
.rpt-meta li strong{ color:var(--ink); }

/* =========================================================
   TABS
   ========================================================= */
.tabs{ display:flex; flex-wrap:wrap; gap:10px; margin:10px 0; }
.tab{
  border:1px solid var(--line);
  background:#fff;
  border-radius:999px;
  padding:8px 12px;
  font-weight:500;
  cursor:pointer;
  transition: box-shadow .15s, border-color .15s, background .15s;
  font-family:inherit;
}
.tab.ghost{ background:transparent; }
.tab.active, .tab:hover{ border-color:var(--brand); box-shadow:0 2px 10px rgba(54,16,240,.08); }

.tabpanels{
  border:1px solid var(--line);
  background:#fff;
  border-radius:14px;
  padding:20px;
}
.tabpanel{ display:none; }
.tabpanel.show{ display:block; }

.tabpanel h4{ margin:14px 0 8px; }
.tabpanel ul{ margin:6px 0 12px 18px; }
.tabpanel li{ margin:4px 0; }

/* =========================================================
   BUY CARD (compact, sticky)
   ========================================================= */
.rpt-buy{ position:relative; }
.buy-card{
  border:1px solid var(--line);
  background:#fff;
  border-radius:14px;
  padding:14px;
  position:sticky; top:92px;
  max-width:340px !important;  /* keep compact */
  margin-left:auto;
}
.buy-ttl{ margin:0 0 10px; font-size:1.02rem; }

/* License rows */
.license{ display:grid; gap:8px; margin-bottom:10px; }
.license .row{
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:10px; align-items:center;
  border:1px solid var(--line);
  border-radius:10px;
  padding:8px 10px;
  background:#fff;
  font-size:.95rem;
}
.license .row input{ transform:translateY(1px); }

/* Price */
.pricebox{
  margin:8px 0 10px;
  border:1px dashed var(--brand);
  border-radius:10px;
  padding:10px;
  font-size:1.1rem;
  font-weight:700;
  text-align:center;
}

/* Buttons — scope to MAIN so header FAQ button keeps homepage look */
main .w-100{ width:100%; }
main .btn-lg{ padding:12px 14px; font-size:.98rem; }
main .stack{ display:grid; gap:8px; margin-top:10px; }

/* =========================================================
   MODAL (lead capture)
   ========================================================= */
.modal{
  position:fixed; inset:0; z-index:60;
  display:none;
  align-items:center; justify-content:center;
  padding:24px;
}
.modal.show{ display:flex; }
.modal-backdrop{
  position:absolute; inset:0;
  background:rgba(12,12,24,.55);
  backdrop-filter:blur(2px);
}
.modal-dialog{
  position:relative;
  width:min(720px, 92vw);
  max-height:90vh; overflow:auto;
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  box-shadow:0 30px 80px rgba(0,0,0,.35);
  animation:pop .18s ease-out;
}

/* Header band */
.modal-title{
  display:block; margin:0; padding:14px 18px;
  background:linear-gradient(90deg,#6e4bff,#9c4dff);
  color:#fff; font-size:1.05rem; font-weight:700;
  border-top-left-radius:18px; border-top-right-radius:18px;
  letter-spacing:.2px;
}

/* Close button */
.modal-close{
  position:absolute; right:12px; top:10px;
  border:0; background:transparent; color:#fff;
  font-size:22px; cursor:pointer;
}

/* Form */
.grid2{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.grid2 textarea{ grid-column:1 / -1; }
.grid2 button{ grid-column:1 / -1; }

.modal-dialog form{ padding:16px; }
.modal-dialog input,
.modal-dialog textarea{
  width:100%;
  padding:12px 12px;
  border:1px solid var(--line);
  background:#fafbff;
  border-radius:12px;
  transition:border .15s, box-shadow .15s, background .15s;
  outline:none; font-family:inherit;
}
.modal-dialog textarea{ min-height:110px; resize:vertical; }
.modal-dialog input:focus,
.modal-dialog textarea:focus{
  border-color:#8a63ff; background:#fff;
  box-shadow:0 0 0 4px rgba(138,99,255,.12);
}

/* Submit */
.modal-dialog .btn{
  display:inline-block;
  border-radius:12px;
  border:1px solid transparent;
  cursor:pointer;
  text-decoration:none;
  height:46px;
}
.modal-dialog .btn-primary{
  background:linear-gradient(90deg,#6e4bff,#9c4dff);
  color:#fff; font-weight:700; letter-spacing:.2px;
}
.modal-dialog .btn:hover{ filter:brightness(.98); }

/* Pop animation */
@keyframes pop{
  from{ transform:translateY(10px); opacity:.75; }
  to{ transform:translateY(0); opacity:1; }
}

/* Utilities — scope to MAIN so global header never changes */
main .btn{
  display:inline-block; border-radius:10px; border:1px solid transparent;
  cursor:pointer; text-decoration:none;
}
main .btn-primary{ background:linear-gradient(90deg,#6e4bff,#9c4dff); color:#fff; }
main .btn-ghost{ background:#fff; border-color:var(--line); color:var(--brand-ink); }
main .btn:hover{ filter:brightness(.98); }

@media (max-width:700px){
  .grid2{ grid-template-columns:1fr; }
}

/* ---- Breadcrumbs (unchanged) ---- */
.crumbs{ font-size:.92rem; margin:16px auto; }
.crumbs a{ color:var(--brand-ink); text-decoration:none; }
.crumbs span{ color:var(--muted); margin:0 6px; }

/* --- Keep report page header identical to homepage --- */
body.report-gradient .site-header .nav-row{
  /* same vertical rhythm as home */
  padding-top: 18px !important;
  padding-bottom: 18px !important;
}

body.report-gradient .site-header .brand-logo{
  /* same logo height as home */
  height: 48px !important;
}

body.report-gradient .site-header .nav-link{
  font-weight: 500;          /* match home weight */
}

body.report-gradient .site-header .btn.btn-ghost.btn-sm{
  font-weight: 600;          /* match FAQ pill on home */
}

/* =========================================================
   CHATBOT HARDENING (CSS-only fallback)
   ========================================================= */

/* Only allow our mount host and the buy card in the right column */
.rpt-buy > :not(#kbMount):not(.buy-card){
  display:none !important;
}

/* Nuke any legacy/global chat elements outside the Shadow DOM */
.rpt-buy #kbCard,
.rpt-buy .kb-card,
.rpt-buy #kbBody,
.rpt-buy #kbInput,
.rpt-buy #kbSend,
.rpt-buy #kbLaunch{
  display:none !important;
}

/* Hide any old widget that shows a "Type your question" input */
.rpt-buy :where(div,section,aside,form):has(input[placeholder*="Type your question" i]){
  display:none !important;
}

/* 🔧 Ensure the Shadow-DOM host reserves space and sits above the sticky card */
#kbMount{
  display:block;
  min-height:56px;          /* room for sticky launcher */
  position:relative;        /* create stacking context for shadow children */
  z-index:5;                /* place it above .buy-card (which has no z-index) */
  margin-bottom:12px;       /* breathing room */
}