/* ============================================================================
   PlagLab — ELEVATE layer  (loads last; additive premium finish)
   Concept: "The Forensic Instrument." One coherent, precision feel across
   every view. Signature = the Verdict Instrument that opens each report:
   a certificate of analysis a customer understands in one glance.
   Palette evolves the suite — navy ink · orange spark · RED plagiarism /
   BLUE ai — and never fights the existing style/premium/turnitin layers.
   ========================================================================== */
:root{
  --el-ink:#161b34;
  --el-soft:#4b5172;
  --el-faint:#8a90ad;
  --el-ok:#1f9d57;      --el-ok-deep:#15803d;
  --el-warn:#c98514;    --el-warn-deep:#9a6410;
  --el-bad:#d83a52;     --el-bad-deep:#b3243c;
  --el-navy:#272783;    --el-purple:#7b4fc4;  --el-orange:#f5921e;
  --el-red:#d83a52;     --el-blue:#2f6bf5;
  --el-ring:rgba(22,27,52,.09);
  --el-hair:rgba(22,27,52,.06);
  --el-card:#ffffff;
  --el-glass:rgba(255,255,255,.7);
  --el-sh-1:0 1px 2px rgba(20,30,80,.05), 0 12px 30px -16px rgba(20,30,80,.22);
  --el-sh-2:0 2px 6px -2px rgba(20,30,80,.10), 0 34px 70px -32px rgba(20,30,80,.40);
  --el-ease:cubic-bezier(.22,.7,.2,1);
}
html[data-theme="dark"]{
  --el-ink:#eef1fb; --el-soft:#aeb4d4; --el-faint:#7e85a8;
  --el-ring:rgba(150,170,230,.14); --el-hair:rgba(150,170,230,.09);
  --el-card:#141a2e; --el-glass:rgba(20,26,46,.7);
}

/* ═══════════════════════════════════════════════════════════════════════
   1 · THE VERDICT INSTRUMENT  — signature element
   ═════════════════════════════════════════════════════════════════════ */
.verdict-hero{
  --vh-tone:var(--el-warn); --vh-deep:var(--el-warn-deep);
  --vh-soft:rgba(201,133,20,.12);
  position:relative; margin:8px 0 22px; border-radius:26px; overflow:hidden;
  background:var(--el-card); border:1px solid var(--el-ring);
  box-shadow:var(--el-sh-2);
  padding:clamp(22px,3.2vw,34px) clamp(20px,3.2vw,38px) clamp(20px,3vw,30px);
  animation:vh-in .6s var(--el-ease) both;
}
.verdict-hero.v-ok{  --vh-tone:var(--el-ok);   --vh-deep:var(--el-ok-deep);   --vh-soft:rgba(31,157,87,.12); }
.verdict-hero.v-warn{--vh-tone:var(--el-warn); --vh-deep:var(--el-warn-deep); --vh-soft:rgba(201,133,20,.13); }
.verdict-hero.v-bad{ --vh-tone:var(--el-bad);  --vh-deep:var(--el-bad-deep);  --vh-soft:rgba(216,58,82,.12); }
@keyframes vh-in{ from{ opacity:0; transform:translateY(16px) } }

/* verdict-tinted top accent + a soft interior light */
.vh-accent{ position:absolute; inset:0 0 auto 0; height:5px;
  background:linear-gradient(90deg,var(--vh-tone),color-mix(in srgb,var(--vh-tone) 45%,var(--el-orange))); }
.verdict-hero::before{ content:""; position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(120% 90% at 0% -10%, var(--vh-soft), transparent 55%),
    radial-gradient(80% 70% at 108% 0%, rgba(39,39,131,.05), transparent 60%); }

.vh-grid{ position:relative; display:grid; grid-template-columns:1fr auto; gap:clamp(20px,3vw,44px);
  align-items:center; }
@media(max-width:760px){ .vh-grid{ grid-template-columns:1fr; } }

/* — left: verdict + plain english — */
.vh-left{ min-width:0; }
.vh-eyebrow{ display:flex; align-items:center; gap:8px; font-family:var(--mono);
  font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--el-faint); }
.vh-mark{ width:16px; height:16px; border-radius:5px; flex:none;
  background:linear-gradient(140deg,var(--el-navy),var(--el-purple)); box-shadow:inset 0 0 0 2px rgba(255,255,255,.25); }
.vh-eyebrow .vh-dot{ opacity:.5 }
.vh-eyebrow #vhFile{ color:var(--el-soft); text-transform:none; letter-spacing:0; font-weight:500;
  max-width:34ch; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

.vh-seal-row{ display:flex; align-items:center; gap:14px; margin:16px 0 4px; }
.vh-seal{ width:56px; height:56px; flex:none; border-radius:16px; display:grid; place-items:center;
  font-size:26px; font-weight:800; color:var(--vh-deep);
  background:var(--vh-soft); border:1.5px solid color-mix(in srgb,var(--vh-tone) 32%,transparent);
  box-shadow:0 10px 24px -14px var(--vh-tone); }
.vh-word{ font-family:var(--display); font-weight:800; letter-spacing:-.02em; line-height:1;
  font-size:clamp(30px,4.6vw,46px); color:var(--vh-deep); }
.vh-word-sub{ font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--el-faint); margin-top:6px; }
.vh-headline{ font-family:var(--serif); font-size:clamp(15px,1.5vw,17.5px); line-height:1.62;
  color:var(--el-soft); max-width:52ch; margin:14px 0 0; }

/* evidence — the proof, condensed to a line */
.vh-evidence{ display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.vh-chip{ font-family:var(--mono); font-size:11.5px; letter-spacing:.02em; color:var(--el-soft);
  background:color-mix(in srgb,var(--el-ink) 4%,transparent); border:1px solid var(--el-hair);
  border-radius:999px; padding:6px 12px; display:inline-flex; gap:6px; align-items:baseline; }
.vh-chip b{ font-family:var(--display); font-weight:700; color:var(--el-ink); font-variant-numeric:tabular-nums; }
.vh-chip.ok b{ color:var(--el-ok-deep); }
.vh-chip.bad{ background:rgba(216,58,82,.08); border-color:transparent; }
.vh-chip.bad b{ color:var(--el-bad-deep); }

.vh-actions{ display:flex; flex-wrap:wrap; gap:10px; margin-top:22px; }
.vh-btn{ font-family:var(--display); font-weight:600; font-size:14.5px; border-radius:999px;
  padding:12px 22px; cursor:pointer; border:1.5px solid transparent; transition:.2s var(--el-ease);
  display:inline-flex; align-items:center; gap:8px; }
.vh-btn.primary{ color:#fff; border:0; background:linear-gradient(120deg,var(--el-navy),var(--el-purple));
  box-shadow:0 14px 30px -14px rgba(123,79,196,.7); }
.vh-btn.primary:hover{ transform:translateY(-2px); box-shadow:0 20px 40px -14px rgba(123,79,196,.85); }
.vh-btn.primary span{ color:#ffd9a8; }
.vh-btn.ghost{ background:transparent; color:var(--el-ink); border-color:var(--el-ring); }
.vh-btn.ghost:hover{ border-color:var(--el-navy); color:var(--el-navy); transform:translateY(-2px); }

/* — right: the two precision gauges — */
.vh-right{ display:flex; gap:clamp(10px,2vw,26px); justify-content:center; }
@media(max-width:760px){ .vh-right{ justify-content:flex-start; margin-top:4px; } }
.vh-gauge{ margin:0; text-align:center; --g:var(--el-navy); }
.vh-gauge.vh-sim{ --g:var(--el-red); }
.vh-gauge.vh-ai{  --g:var(--el-blue); }
.vh-gsvg{ width:clamp(126px,15vw,152px); height:auto; display:block; }
.vh-gtrack{ fill:none; stroke:var(--el-hair); stroke-width:9; stroke-linecap:round; }
.vh-gfill{ fill:none; stroke:var(--g); stroke-width:9; stroke-linecap:round;
  transition:stroke-dashoffset 1.4s var(--el-ease) .15s;
  filter:drop-shadow(0 3px 6px color-mix(in srgb,var(--g) 40%,transparent)); }
.vh-tick{ stroke:var(--el-hair); stroke-width:1.4; }
.vh-tick.big{ stroke:color-mix(in srgb,var(--el-ink) 26%,transparent); stroke-width:1.8; }
.vh-gauge figcaption{ margin-top:-14px; display:flex; flex-direction:column; align-items:center; }
.vh-gnum{ font-family:var(--mono); font-weight:600; font-variant-numeric:tabular-nums; line-height:1;
  color:var(--g); }
.vh-gnum b{ font-size:34px; font-weight:700; }
.vh-gnum i{ font-size:16px; font-style:normal; opacity:.7; margin-left:1px; }
.vh-glabel{ font-family:var(--display); font-weight:600; font-size:12.5px; color:var(--el-ink); margin-top:5px; }
.vh-gband{ font-family:var(--mono); font-size:10px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--el-faint); margin-top:3px; min-height:12px; }

/* ═══════════════════════════════════════════════════════════════════════
   2 · COMMERCIAL HERO  — premium finish
   ═════════════════════════════════════════════════════════════════════ */
.hero{ position:relative; }
.hero::before{ content:""; position:absolute; inset:-40px 0 auto 0; height:420px; z-index:-1; pointer-events:none;
  background:
    radial-gradient(50% 60% at 18% 0%, rgba(123,79,196,.10), transparent 70%),
    radial-gradient(46% 58% at 82% -6%, rgba(39,39,131,.10), transparent 72%),
    radial-gradient(60% 50% at 50% -8%, rgba(245,146,30,.06), transparent 70%); }
.hero-eyebrow{ display:inline-flex; align-items:center; gap:8px; padding:6px 14px; border-radius:999px;
  background:var(--el-glass); border:1px solid var(--el-ring); backdrop-filter:blur(8px);
  box-shadow:var(--el-sh-1); }
.hero-h1{ letter-spacing:-.025em; }
.hero-h1 .hl{ color:var(--el-navy); }

.hero-stats{ gap:0; border:1px solid var(--el-ring); border-radius:18px; background:var(--el-card);
  box-shadow:var(--el-sh-1); overflow:hidden; max-width:720px; margin:0 auto; }
.hstat{ flex:1; min-width:120px; padding:18px 14px; align-items:center; text-align:center;
  border-right:1px solid var(--el-hair); }
.hstat:last-child{ border-right:0; }
.hstat b{ font-size:1.9rem; background:linear-gradient(120deg,var(--el-navy),var(--el-purple));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
@media(max-width:640px){ .hstat{ flex-basis:50%; border-bottom:1px solid var(--el-hair); }
  .hstat:nth-child(even){ border-right:0; } }

.cta-primary{ background:linear-gradient(120deg,var(--el-navy),var(--el-purple)); border:0;
  box-shadow:0 18px 40px -16px rgba(123,79,196,.7); }
.cta-primary:hover{ background:linear-gradient(120deg,var(--navy-deep,#1c1c66),var(--el-purple)); }

/* feature cards — hairline top accent, calmer hover */
.feat{ position:relative; overflow:hidden; border-radius:16px; }
.feat::before{ content:""; position:absolute; inset:0 0 auto 0; height:3px; opacity:0; transition:opacity .25s var(--el-ease);
  background:linear-gradient(90deg,var(--el-navy),var(--el-purple)); }
.feat:hover{ transform:translateY(-4px); box-shadow:var(--el-sh-2); }
.feat:hover::before{ opacity:1; }
.feat-ic{ display:inline-grid; place-items:center; width:44px; height:44px; border-radius:12px;
  background:color-mix(in srgb,var(--el-navy) 8%,transparent); color:var(--el-navy); }

.vs-table{ border-radius:16px; }
.vs-table thead th.us{ background:linear-gradient(120deg,var(--el-navy),var(--el-purple)); }
.way{ border-radius:20px; }
.way-btn.primary{ background:linear-gradient(120deg,var(--el-navy),var(--el-purple)); border:0;
  box-shadow:0 16px 36px -16px rgba(123,79,196,.7); }

/* ═══════════════════════════════════════════════════════════════════════
   3 · UPLOAD  — tactile, premium intake
   ═════════════════════════════════════════════════════════════════════ */
.submit-card{ border-radius:22px; box-shadow:var(--el-sh-1); }
.dropzone{ border-radius:18px; border:2px dashed var(--el-ring);
  background:
    linear-gradient(180deg, color-mix(in srgb,var(--el-navy) 3%,transparent), transparent 60%),
    var(--el-card); transition:border-color .22s var(--el-ease), background .22s var(--el-ease), transform .22s var(--el-ease), box-shadow .3s var(--el-ease); }
.dropzone:hover, .dropzone.drag{ border-color:var(--el-navy); border-style:solid;
  background:color-mix(in srgb,var(--el-navy) 5%,var(--el-card));
  transform:translateY(-2px); box-shadow:0 22px 44px -26px rgba(39,39,131,.5); }
.up-icon{ width:48px; height:48px; padding:10px; border-radius:14px;
  background:color-mix(in srgb,var(--el-navy) 8%,transparent); color:var(--el-navy); box-sizing:content-box; }
.fmt{ border-radius:7px; }
.opt-card{ border-radius:14px; transition:border-color .2s var(--el-ease), background .2s var(--el-ease), transform .2s var(--el-ease); }
.opt-card:hover{ transform:translateY(-1px); box-shadow:var(--el-sh-1); }
.side-card{ border-radius:18px; box-shadow:var(--el-sh-1); }
.ck-ic{ display:inline-grid; place-items:center; width:26px; height:26px; border-radius:8px;
  background:color-mix(in srgb,var(--el-navy) 8%,transparent); font-size:.85rem; }

/* ═══════════════════════════════════════════════════════════════════════
   4 · PROGRESS  — calm precision
   ═════════════════════════════════════════════════════════════════════ */
.prog-ring{ width:120px; height:120px; }
.prog-ring svg{ width:120px; height:120px; }
.prog-ring .pr-track{ stroke:var(--el-hair); stroke-width:5; }
.prog-ring .pr-arc{ stroke:url(#elGrad); stroke-width:5; }
.prog-ring #progPct{ background:linear-gradient(120deg,var(--el-navy),var(--el-purple));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
/* gradient stroke fallback: paint a purple ring when no <defs> present */
.prog-ring .pr-arc{ stroke:var(--el-purple); }

/* ═══════════════════════════════════════════════════════════════════════
   5 · SHARED  — service switcher + section rhythm
   ═════════════════════════════════════════════════════════════════════ */
.svc-switch{ background:var(--el-glass); backdrop-filter:blur(14px) saturate(1.4); }
.svc-switch .svc-link.active{ background:linear-gradient(120deg,var(--el-navy),var(--el-purple)); }

/* frame the evidence reader so it sits under the verdict as "the proof" */
#tii-report{ box-shadow:var(--el-sh-2); }

/* ═══════════════════════════════════════════════════════════════════════
   6 · MOTION / A11Y GUARDS
   ═════════════════════════════════════════════════════════════════════ */
@media(prefers-reduced-motion:reduce){
  .verdict-hero{ animation:none; }
  .vh-gfill{ transition:none; }
}
