/* ============================================================
   GeoAIVO — Report / Share styles (demo-report.html, shared-report.html)
   Loaded in addition to styles.css.
   Tokens are inherited from :root in styles.css.
   ============================================================ */

/* ---------- page shell (light, printable) ---------- */
body.demopage{
  background:var(--report-bg);
  color:var(--report-fg);
  font-family:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  line-height:1.6;
  margin:0;
}
.dwrap{max-width:1080px;margin:0 auto;padding:0 24px 80px}

/* ---------- hero ---------- */
.dhero{
  position:relative;
  padding:54px 0 40px;
  border-bottom:1px solid var(--report-divider);
  margin-bottom:32px;
}
.dhero__eyebrow{
  display:inline-block;
  padding:.35em .9em;
  border-radius:99px;
  background:rgba(109,94,252,.1);
  color:var(--report-accent);
  font-weight:700;
  font-size:.78rem;
  letter-spacing:.04em;
  margin-bottom:16px;
}
.dhero h1{
  font-family:'Space Grotesk',sans-serif;
  font-size:2.4rem;
  line-height:1.1;
  margin:0 0 12px;
  color:var(--report-fg);
  font-weight:700;
  letter-spacing:-.02em;
}
.dhero p{font-size:1.06rem;color:var(--report-muted);max-width:680px;margin:0}
.dhero__grid{display:grid;grid-template-columns:1.7fr 1fr;gap:36px;align-items:flex-start;margin-top:24px}
.dhero__stats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;padding:22px;background:var(--report-surface);border:1px solid var(--report-divider);border-radius:16px}
.dstat b{display:block;font-family:'Space Grotesk',sans-serif;font-size:1.4rem;font-weight:700;color:var(--report-fg);line-height:1;margin-bottom:4px}
.dstat span{font-size:.74rem;color:var(--report-muted);text-transform:uppercase;letter-spacing:.06em;font-weight:600}

/* ---------- CTA buttons (used in report pages) ---------- */
.dcta{display:flex;gap:12px;align-items:center;margin-top:24px;flex-wrap:wrap}
.dbtn{
  display:inline-flex;align-items:center;gap:8px;
  padding:.85em 1.4em;border-radius:11px;
  font-weight:700;font-size:.95rem;
  text-decoration:none;cursor:pointer;border:none;
  transition:transform .2s var(--ease),box-shadow .2s var(--ease),border-color .2s,color .2s,background .2s;
  font-family:inherit;
}
.dbtn--primary{
  background:linear-gradient(135deg,var(--violet),var(--cyan));
  color:#fff;
  box-shadow:0 10px 30px -10px rgba(109,94,252,.5);
}
.dbtn--primary:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 40px -14px rgba(109,94,252,.6);
}
.dbtn--ghost{
  background:transparent;
  color:var(--report-fg);
  border:1px solid var(--report-divider);
}
.dbtn--ghost:hover{
  border-color:var(--report-accent);
  color:var(--report-accent);
  transform:translateY(-1px);
}
.dnote{font-size:.78rem;color:var(--report-muted);margin-top:8px}

/* ---------- score card (snapshot) ---------- */
.dscore{
  display:grid;grid-template-columns:auto 1fr;gap:36px;align-items:center;
  background:var(--report-surface);
  border:1px solid var(--report-divider);
  border-radius:20px;
  padding:32px;
  margin-bottom:32px;
  box-shadow:var(--report-card-shadow);
}
.dring{
  --p:0;
  width:160px;height:160px;
  border-radius:50%;
  display:grid;place-items:center;
  background:conic-gradient(var(--report-accent) calc(var(--p)*1%),#e6e8f0 0);
  position:relative;
  box-shadow:0 0 0 1px rgba(109,94,252,.12),0 18px 40px -20px rgba(109,94,252,.4);
}
.dring::before{content:"";position:absolute;inset:14px;border-radius:50%;background:#fff}
.dring__v{
  position:relative;
  font-family:'Space Grotesk',sans-serif;
  font-size:3rem;font-weight:800;
  color:var(--report-fg);line-height:1;
  font-variant-numeric:tabular-nums;
}
.dring__v small{display:block;font-size:.36em;color:var(--report-muted);font-weight:600;margin-top:6px;letter-spacing:.04em}
.dscore__stats{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.dscore__stats .dstat b{font-size:1.6rem}

/* ---------- SoM bars (per engine) ---------- */
.dbars{display:grid;gap:14px;margin-top:8px}
.dbar{display:flex;align-items:center;gap:14px}
.dbar__eng{
  width:100px;flex:none;
  font-weight:600;color:var(--report-fg);
  font-size:.92rem;
  font-family:'Space Grotesk',sans-serif;
}
.dbar__track{
  flex:1;height:24px;
  background:#eef0f7;
  border-radius:8px;
  overflow:hidden;position:relative;
}
.dbar__fill{
  height:100%;
  background:linear-gradient(100deg,var(--violet),var(--cyan));
  border-radius:8px;
  width:0;
  transition:width 1.2s var(--ease);
  display:flex;align-items:center;justify-content:flex-end;
  padding-right:10px;color:#fff;
  font-weight:700;font-size:.78rem;
  font-family:'Space Grotesk',sans-serif;
}

/* ---------- block (report section card) ---------- */
.dblocks{display:grid;grid-template-columns:1fr;gap:24px;margin-bottom:32px}
.dblock{
  background:#fff;
  border:1px solid var(--report-divider);
  border-radius:16px;
  padding:28px;
  box-shadow:var(--report-card-shadow);
  transition:transform .25s var(--ease),box-shadow .25s;
}
.dblock h2{
  font-family:'Space Grotesk',sans-serif;
  font-size:1.3rem;color:var(--report-fg);
  margin:0 0 6px;font-weight:700;
  letter-spacing:-.01em;
}
.dblock p.dblock__sub{color:var(--report-muted);margin:0 0 18px;font-size:.94rem}

/* ---------- prompt cards ---------- */
.dpromt{
  border:1px solid var(--report-divider);
  border-radius:12px;
  padding:14px 16px;
  margin-bottom:10px;
  background:var(--report-surface);
  transition:border-color .2s;
}
.dpromt:hover{border-color:rgba(109,94,252,.4)}
.dpromt__q{font-weight:600;color:var(--report-fg);margin-bottom:8px;font-size:.95rem}
.dpromt__tags{display:flex;flex-wrap:wrap;gap:6px}
.dpromt__tag{font-size:.74rem;padding:.25em .65em;border-radius:99px;font-weight:600}
.dpromt__tag--cited{background:rgba(31,224,164,.16);color:#0d8a5e}
.dpromt__tag--missed{background:rgba(255,77,109,.12);color:#c1263e}

/* ---------- fix priority cards ---------- */
.dfix{
  display:flex;gap:14px;
  padding:14px 16px;
  border-radius:12px;
  background:rgba(109,94,252,.05);
  border-left:3px solid var(--report-accent);
  margin-bottom:10px;
  transition:transform .2s var(--ease);
}
.dfix:hover{transform:translateX(2px)}
.dfix__pri{
  flex:none;
  font-size:.7rem;font-weight:800;
  padding:.3em .7em;border-radius:6px;
  background:var(--report-accent);color:#fff;
  text-transform:uppercase;letter-spacing:.05em;
  height:fit-content;
}
.dfix h4{font-size:.98rem;margin:0 0 4px;color:var(--report-fg);font-family:'Space Grotesk',sans-serif}
.dfix p{margin:0;font-size:.86rem;color:var(--report-muted)}

/* ---------- upgrade band (dark gradient) ---------- */
.dupgrade{
  margin-top:40px;
  padding:36px 32px;
  border-radius:22px;
  background:linear-gradient(135deg,#1a1a3a,#0e1a3a);
  color:#fff;text-align:center;
  position:relative;overflow:hidden;
  box-shadow:0 30px 80px -30px rgba(11,12,20,.4);
}
.dupgrade::before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(circle at 30% 20%,rgba(109,94,252,.4),transparent 50%),
    radial-gradient(circle at 80% 60%,rgba(31,224,164,.3),transparent 50%);
}
.dupgrade__inner{position:relative}
.dupgrade h2{
  font-family:'Space Grotesk',sans-serif;
  font-size:1.6rem;margin:0 0 8px;
  font-weight:700;letter-spacing:-.01em;
}
.dupgrade p{color:#b9bdd6;max-width:540px;margin:0 auto 22px;font-size:.96rem}
.dupgrade .dbtn--primary{padding:1em 1.8em;font-size:1rem}

/* ---------- loader ---------- */
.dloader{text-align:center;padding:60px 20px;color:var(--report-muted)}
.dloader__spin{
  width:40px;height:40px;
  border:3px solid var(--report-divider);
  border-top-color:var(--report-accent);
  border-radius:50%;
  animation:ds 1s linear infinite;
  margin:0 auto 18px;
}
@keyframes ds{to{transform:rotate(360deg)}}

/* ---------- shared-report top bar ---------- */
.shared-bar{
  position:sticky;top:0;z-index:50;
  background:var(--share-hero-grad);
  color:#fff;
  padding:14px 24px;
  display:flex;justify-content:space-between;align-items:center;
  gap:16px;flex-wrap:wrap;
  box-shadow:0 4px 18px -8px rgba(80,60,240,.4);
}
.shared-bar__l{display:flex;align-items:center;gap:12px;font-weight:600;font-size:.92rem}
.shared-bar__l img{height:24px;width:24px}
.shared-bar__r{display:flex;gap:10px;align-items:center}
.shared-bar a{
  background:rgba(255,255,255,.18);
  color:#fff;
  padding:.55em 1.1em;
  border-radius:10px;
  font-size:.85rem;font-weight:600;
  text-decoration:none;
  backdrop-filter:blur(6px);
  border:1px solid rgba(255,255,255,.3);
  transition:.2s;
}
.shared-bar a:hover{background:rgba(255,255,255,.28);transform:translateY(-1px)}
.shared-bar__exp{font-size:.78rem;opacity:.85}

/* shared-report 404 state */
.shared-404{min-height:60vh;display:grid;place-items:center;text-align:center;padding:24px}
.shared-404 h1{font-family:'Space Grotesk',sans-serif;font-size:2rem;color:var(--report-fg);margin:0 0 12px;font-weight:700}
.shared-404 p{color:var(--report-muted);max-width:480px;margin:0 auto 24px}

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width:760px){
  .dwrap{padding:0 16px 60px}
  .dhero{padding:36px 0 28px;margin-bottom:24px}
  .dhero h1{font-size:1.8rem}
  .dhero__grid{grid-template-columns:1fr;gap:20px}
  .dscore{grid-template-columns:1fr;text-align:center;padding:24px}
  .dscore__stats{grid-template-columns:repeat(3,1fr);gap:14px}
  .dbar__eng{width:80px;font-size:.84rem}
  .dblock{padding:22px}
  .dupgrade{padding:28px 22px}
  .shared-bar{padding:12px 16px}
  .shared-bar__exp{display:none}
  .dring{width:130px;height:130px}
  .dring__v{font-size:2.4rem}
}
@media (max-width:480px){
  .dstat b{font-size:1.2rem!important}
  .dstat span{font-size:.66rem}
  .dpromt__tag{font-size:.68rem}
}
@media (prefers-reduced-motion:reduce){
  .dloader__spin{animation:none!important}
  .dbar__fill,.dbtn{transition:none!important}
}
