/*
Theme Name: ReviewerOneSelect
Theme URI: https://reviewerselect.com
Author: Reviewer Select Labs
Author URI: https://reviewerselect.com
Description: A custom WordPress theme for Reviewer Select - Semantic AI peer reviewer matching platform. Features dark/light theme toggle, glassmorphism design, and complex animations.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 7.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: revieweroneselect
*/

/* ============ CTA 3D MOUNT ============ */
#cta-3d {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: .65;
  mix-blend-mode: screen;
}
html.light #cta-3d {
  opacity: .45;
  mix-blend-mode: multiply;
}

#cta-3d canvas {
  width: 100% !important;
  height: 100% !important;
  display: block;
}

/* Make sure CTA content sits in front of the 3D scene */
#cta > .max-w-\[1100px\] { position: relative; z-index: 2; }

/* ============ NAV STRENGTHEN (override base) ============ */
html.dark  { --nav-bg: rgba(8, 10, 22, 0.92);  --nav-border: rgba(255,255,255,.18); }
html.light { --nav-bg: rgba(255,255,255,0.94); --nav-border: rgba(10,12,28,.14); }

#nav { z-index: 90; }
#navInner {
  background: var(--nav-bg) !important;
  border: 1px solid var(--nav-border) !important;
  backdrop-filter: blur(24px) saturate(140%);
  -webkit-backdrop-filter: blur(24px) saturate(140%);
  box-shadow:
    0 1px 0 rgba(255,255,255,.05) inset,
    0 30px 60px -28px rgba(0,0,0,.6);
}
html.light #navInner {
  box-shadow:
    0 1px 0 rgba(255,255,255,.7) inset,
    0 20px 50px -24px rgba(10,12,28,.20);
}
.nav-link { font-weight: 500; letter-spacing: -0.005em; }

/* Make sure loader doesn't outlive its welcome */
#loader.done { pointer-events: none; }

/* Home welcome popup (once per session) */
#homeWelcomeModal.is-open {
  display: flex;
}
body.home-welcome-popup-open {
  overflow: hidden;
}

/* ============ THEME VARIABLES ============ */
html.dark {
  --bg: #05060f;
  --bg-elev: #0a0c1c;
  --ink: #e7e9f5;
  --ink-soft: rgba(231,233,245,.75);
  --ink-mute: rgba(231,233,245,.55);
  --ink-faint: rgba(231,233,245,.40);
  --line: rgba(255,255,255,.07);
  --line-strong: rgba(255,255,255,.14);
  --glass-from: rgba(255,255,255,.05);
  --glass-to: rgba(255,255,255,.015);
  --glass-strong-from: rgba(18,21,45,.85);
  --glass-strong-to: rgba(10,12,28,.85);
  --nav-bg: rgba(8, 10, 22, 0.92);
  --nav-border: rgba(255,255,255,.18);
  --grid-dot: rgba(255,255,255,.08);
  --vignette: #05060f;
  --orb-1: rgba(91,140,255,.55);
  --orb-2: rgba(167,139,250,.40);
  --orb-3: rgba(59,86,168,.35);
  --btn-primary-from: #ffffff;
  --btn-primary-to: #d9def0;
  --btn-primary-ink: #0a0c1c;
  --btn-ghost-ink: #cfd5ff;
  --btn-ghost-border: rgba(255,255,255,.12);
  --btn-ghost-bg: rgba(255,255,255,.02);
  --pill-bg: rgba(255,255,255,.03);
  --code-bg: rgba(255,255,255,.02);
  --blue: #5b8cff;
  --violet: #a78bfa;
  --pink: #e6a3ff;
  --accent: #7c5cff;
}
html.light {
  --bg: #f4f2ec;
  --bg-elev: #ffffff;
  --ink: #0a0c1c;
  --ink-soft: rgba(10,12,28,.78);
  --ink-mute: rgba(10,12,28,.58);
  --ink-faint: rgba(10,12,28,.42);
  --line: rgba(10,12,28,.08);
  --line-strong: rgba(10,12,28,.14);
  --glass-from: rgba(255,255,255,.75);
  --glass-to: rgba(255,255,255,.45);
  --glass-strong-from: rgba(255,255,255,.92);
  --glass-strong-to: rgba(248,246,239,.92);
  --nav-bg: rgba(255,255,255,0.94);
  --nav-border: rgba(10,12,28,.14);
  --grid-dot: rgba(10,12,28,.10);
  --vignette: #f4f2ec;
  --orb-1: rgba(91,140,255,.30);
  --orb-2: rgba(167,139,250,.25);
  --orb-3: rgba(124,192,255,.25);
  --btn-primary-from: #0a0c1c;
  --btn-primary-to: #1c2040;
  --btn-primary-ink: #ffffff;
  --btn-ghost-ink: #0a0c1c;
  --btn-ghost-border: rgba(10,12,28,.16);
  --btn-ghost-bg: rgba(10,12,28,.03);
  --pill-bg: rgba(255,255,255,.55);
  --code-bg: rgba(10,12,28,.04);
  --blue: #3661e6;
  --violet: #7c4ee6;
  --pink: #c248d0;
  --accent: #5b3ee0;
}
html, body { background: var(--bg); color: var(--ink); transition: background-color .5s ease, color .5s ease; }
body { font-family: 'Manrope', system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
::selection { background: rgba(91,140,255,.35); color: var(--ink); }

/* Editorial display type */
.display { font-family: 'Instrument Serif', serif; font-weight: 400; letter-spacing: -.02em; line-height: .95; }
html.dark .display em { font-style: italic; color: #cfd5ff; }
html.light .display em { font-style: italic; color: #3a4180; }
.mono { font-family: 'JetBrains Mono', ui-monospace, monospace; letter-spacing: .02em; }

/* Subtle grain */
.grain::after{
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.06; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .6 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

/* Layered gradient mesh */
.mesh::before{
  content:""; position:absolute; inset:-20% -10% 0 -10%; z-index:0; pointer-events:none;
  background:
    radial-gradient(40% 30% at 20% 10%, rgba(91,140,255,.35), transparent 60%),
    radial-gradient(35% 30% at 80% 20%, rgba(167,139,250,.30), transparent 60%),
    radial-gradient(30% 25% at 60% 70%, rgba(230,163,255,.20), transparent 60%);
  filter: blur(40px);
}

/* Glass cards */
.glass {
  background: linear-gradient(180deg, var(--glass-from), var(--glass-to));
  border: 1px solid var(--line);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
.glass-strong { background: linear-gradient(180deg, var(--glass-strong-from), var(--glass-strong-to)); border:1px solid var(--line-strong); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
html.light .glass-strong { box-shadow: 0 30px 80px -50px rgba(10,12,28,.25); }

/* Hairline divider */
html.dark .hairline { background: linear-gradient(90deg, transparent, rgba(255,255,255,.18), transparent); height:1px; }
html.light .hairline { background: linear-gradient(90deg, transparent, rgba(10,12,28,.18), transparent); height:1px; }

/* Glow border */
.ring-glow { box-shadow: inset 0 0 0 1px rgba(255,255,255,.06), 0 30px 80px -40px rgba(91,140,255,.45); }

/* Buttons */
.btn { position:relative; display:inline-flex; align-items:center; gap:.55rem; padding:.8rem 1.15rem; border-radius:999px; font-weight:500; font-size: 14px; transition: transform .25s ease, background .25s ease, color .25s ease, border-color .25s ease, box-shadow .35s ease; white-space:nowrap; }
.btn-primary { background: linear-gradient(180deg, var(--btn-primary-from), var(--btn-primary-to)); color: var(--btn-primary-ink); border:1px solid var(--line-strong); }
.btn-primary:hover { transform: translateY(-1px); box-shadow: 0 12px 30px -10px rgba(91,140,255,.35); }
.btn-ghost { color: var(--btn-ghost-ink); border:1px solid var(--btn-ghost-border); background: var(--btn-ghost-bg); }
.btn-ghost:hover { background: var(--code-bg); border-color: var(--line-strong); }

/* Underline hover */
.nav-link { position:relative; }
.nav-link::after{ content:""; position:absolute; left:0; right:0; bottom:-6px; height:1px; background:linear-gradient(90deg,#5b8cff,#a78bfa); transform: scaleX(0); transform-origin:left; transition: transform .35s ease; }
.nav-link:hover::after, .nav-link[data-active="true"]::after { transform: scaleX(1); }

/* Tag pill */
.pill { display:inline-flex; align-items:center; gap:.5rem; padding:.4rem .75rem; border-radius:999px; border:1px solid var(--line-strong); background: var(--pill-bg); font-size:12px; color: var(--ink-soft); backdrop-filter: blur(8px); }
.pill .dot { width:6px; height:6px; border-radius:999px; background: var(--blue); box-shadow:0 0 12px var(--blue); }

/* Reveal */
.reveal { opacity:0; transform: translateY(24px); }

/* Particles canvas (handled in JS), neural svg */
.neural line, .neural circle { vector-effect: non-scaling-stroke; }

/* FAQ */
details > summary { list-style:none; cursor:pointer; }
details > summary::-webkit-details-marker { display:none; }
details[open] .chev { transform: rotate(45deg); }
.chev { transition: transform .35s ease; }

/* Dotted grid */
.dots {
  background-image: radial-gradient(var(--grid-dot) 1px, transparent 1px);
  background-size: 22px 22px;
}

/* Loader */
#loader { position:fixed; inset:0; z-index:100; background: var(--bg); display:flex; align-items:center; justify-content:center; transition: opacity .8s ease, visibility .8s; }
#loader.done { opacity:0; visibility:hidden; }
.loader-bar { width:160px; height:1px; background:rgba(255,255,255,.1); position:relative; overflow:hidden; }
.loader-bar::after { content:""; position:absolute; inset:0; width:30%; background:linear-gradient(90deg,#5b8cff,#a78bfa,#e6a3ff); animation: slide 1.2s ease-in-out infinite; }
@keyframes slide { 0%{ left:-30% } 100%{ left:100% } }

/* Card lift */
.lift { transition: transform .45s cubic-bezier(.2,.7,.2,1), box-shadow .45s ease, border-color .45s ease; }
.lift:hover { transform: translateY(-4px); border-color: rgba(123,140,255,.35); box-shadow: 0 30px 80px -40px rgba(91,140,255,.55); }

/* Floating orbs */
.orb { position:absolute; border-radius:999px; filter: blur(60px); opacity:.55; pointer-events:none; }

/* Bento card */
.bento { background: linear-gradient(180deg, var(--glass-strong-from), var(--glass-strong-to)); border:1px solid var(--line); position:relative; overflow:hidden; backdrop-filter: blur(14px); }
.bento:hover { border-color: rgba(91,140,255,.35); }

/* Scrolling marquee */
.marquee { mask-image: linear-gradient(90deg, transparent, black 10%, black 90%, transparent); }
.marquee-track { animation: marq 40s linear infinite; }
@keyframes marq { 0%{ transform: translateX(0) } 100%{ transform: translateX(-50%) } }

/* Active concept chip pulse */
@keyframes pulseDot { 0%, 100% { opacity:.4 } 50%{ opacity:1 } }
.pulseDot { animation: pulseDot 2.2s ease-in-out infinite; }

/* Progress dash */
.dashline { stroke-dasharray: 6 8; }

/* Hide scrollbar where needed */
.no-scrollbar::-webkit-scrollbar { display:none; }
.no-scrollbar { scrollbar-width:none; }

/* Mobile nav drawer */
#drawer { transform: translateX(100%); transition: transform .45s cubic-bezier(.2,.7,.2,1); }
#drawer.open { transform: translateX(0); }

/* Section label */
.label { font-family:'JetBrains Mono',monospace; font-size:11px; color: var(--ink-mute); letter-spacing:.18em; text-transform:uppercase; }

/* Contact / form fields */
.form-field {
  width: 100%;
  border-radius: 0.75rem;
  background: transparent;
  padding: 0.75rem 1rem;
  font-size: 14px;
  outline: none;
  color: var(--ink);
  border: 1px solid var(--line-strong);
  transition: border-color .25s ease, box-shadow .25s ease;
}
.form-field::placeholder { color: var(--ink-mute); }
.form-field:focus {
  border-color: rgba(91,140,255,.45);
  box-shadow: 0 0 0 3px rgba(91,140,255,.12);
}
textarea.form-field { resize: vertical; min-height: 140px; }
.form-label {
  display: block;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.02em;
  margin-bottom: 0.5rem;
  color: var(--ink-soft);
}

@keyframes contactFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
}
.contact-float-slow {
  animation: contactFloat 6s ease-in-out infinite;
}

/* Inline color helpers driven by theme */
.t-ink { color: var(--ink); }
.t-soft { color: var(--ink-soft); }
.t-mute { color: var(--ink-mute); }
.t-faint { color: var(--ink-faint); }
.bg-elev { background: var(--bg-elev); }
.bd-line { border-color: var(--line); }
.bd-line-strong { border-color: var(--line-strong); }

/* Light-mode adjustments for things that were hard-coded white */
html.light .neural circle { filter: saturate(1.2); }
html.light .ring-glow { box-shadow: inset 0 0 0 1px rgba(10,12,28,.06), 0 30px 80px -40px rgba(91,140,255,.30); }
html.light .shadow-glow { box-shadow: 0 0 0 1px rgba(10,12,28,.08), 0 20px 60px -20px rgba(91,140,255,.20) !important; }
html.light .pulseDot { box-shadow: 0 0 0 0 rgba(91,140,255,.0); }
html.light #particles { opacity:.45; }

/* Theme toggle */
.theme-toggle { position:relative; width:56px; height:28px; border-radius:999px; border:1px solid var(--line-strong); background: var(--pill-bg); transition: background .3s ease, border-color .3s ease; }
.theme-toggle .knob { position:absolute; top:2px; left:2px; width:22px; height:22px; border-radius:999px; background: linear-gradient(180deg, var(--blue), var(--violet)); display:grid; place-items:center; color:#fff; transition: left .35s cubic-bezier(.2,.7,.2,1); }
html.light .theme-toggle .knob { left: calc(100% - 24px); }

/* ============ LIGHT-MODE UTILITY OVERRIDES ============ */
html.light .text-white            { color: #0a0c1c !important; }
html.light .text-white\/85        { color: rgba(10,12,28,.88) !important; }
html.light .text-white\/80        { color: rgba(10,12,28,.84) !important; }
html.light .text-white\/75        { color: rgba(10,12,28,.80) !important; }
html.light .text-white\/70        { color: rgba(10,12,28,.74) !important; }
html.light .text-white\/65        { color: rgba(10,12,28,.68) !important; }
html.light .text-white\/60        { color: rgba(10,12,28,.62) !important; }
html.light .text-white\/55        { color: rgba(10,12,28,.56) !important; }
html.light .text-white\/50        { color: rgba(10,12,28,.50) !important; }
html.light .text-white\/45        { color: rgba(10,12,28,.46) !important; }
html.light .text-white\/40        { color: rgba(10,12,28,.42) !important; }

html.light .bg-white\/5           { background-color: rgba(10,12,28,.04) !important; }
html.light .bg-white\/10          { background-color: rgba(10,12,28,.08) !important; }
html.light .bg-white\/\[0\.02\]   { background-color: rgba(10,12,28,.03) !important; }
html.light .bg-white\/\[0\.015\]  { background-color: rgba(10,12,28,.02) !important; }

html.light .border-white\/5       { border-color: rgba(10,12,28,.07) !important; }
html.light .border-white\/10      { border-color: rgba(10,12,28,.10) !important; }
html.light .border-white\/20      { border-color: rgba(10,12,28,.18) !important; }
html.light .border-white\/30      { border-color: rgba(10,12,28,.24) !important; }
html.light .divide-white\/5 > * + * { border-color: rgba(10,12,28,.06) !important; }

html.light .bg-ink-900\/40,
html.light .bg-ink-900\/60,
html.light .bg-ink-900\/70 { background-color: rgba(255,255,255,.65) !important; backdrop-filter: blur(10px); }

/* Loader background switches */
html.light #loader { background:#f4f2ec; }

/* Concept chip tweaks for light mode */
html.light .bg-arc-blue\/10    { background-color: rgba(91,140,255,.10) !important; }
html.light .bg-arc-blue\/15    { background-color: rgba(91,140,255,.14) !important; }
html.light .bg-arc-violet\/10  { background-color: rgba(167,139,250,.12) !important; }
html.light .bg-arc-violet\/15  { background-color: rgba(167,139,250,.16) !important; }
html.light .bg-arc-pink\/10    { background-color: rgba(230,163,255,.14) !important; }
html.light .bg-arc-pink\/15    { background-color: rgba(230,163,255,.18) !important; }
html.light .bg-arc-sky\/15     { background-color: rgba(124,192,255,.16) !important; }

/* Concept text colors stay vivid */
html.light .text-arc-sky    { color: #2675c4 !important; }
html.light .text-arc-blue   { color: #2a52cc !important; }
html.light .text-arc-violet { color: #6b3ec4 !important; }
html.light .text-arc-pink   { color: #a23bb0 !important; }
html.light .text-emerald-300, html.light .text-emerald-400 { color:#1b8a52 !important; }
html.light .text-rose-300   { color:#b03b4b !important; }
html.light .text-amber-300  { color:#a8631c !important; }

/* Hero stats grid divider */
html.light .bg-white\/5.rounded-2xl  { background-color: rgba(10,12,28,.08) !important; }

/* Mesh/orbs softer in light mode */
html.light .mesh::before { opacity:.55; }
html.light .grain::after { opacity:.04; mix-blend-mode: multiply; }

.light footer li a:hover{
  color: #000 !important;
}
.light footer a:hover{
  color: #000 !important;
}

/* Footer LinkedIn icon — brand blue */
footer a[aria-label="LinkedIn"] svg {
  color: #0A66C2;
}
.light footer a[aria-label="LinkedIn"]:hover svg,
footer a[aria-label="LinkedIn"]:hover svg {
  color: #0A66C2 !important;
}

/* Blog styles */
.blog-prose h2 { font-family: 'Instrument Serif', serif; font-size: 28px; line-height: 1.2; margin-top: 2rem; margin-bottom: 1rem; color: var(--ink); }
.blog-prose h3 { font-family: 'Instrument Serif', serif; font-size: 22px; line-height: 1.3; margin-top: 1.5rem; margin-bottom: 0.75rem; color: var(--ink); }
.blog-prose p { margin-bottom: 1rem; line-height: 1.75; color: var(--ink-soft); }
.blog-prose ul, .blog-prose ol { margin-bottom: 1rem; padding-left: 1.5rem; }
.blog-prose li { margin-bottom: 0.5rem; line-height: 1.75; color: var(--ink-soft); }
.blog-prose a { color: var(--blue); text-decoration: underline; }
.blog-prose a:hover { opacity: 0.8; }

/* TOC styles */
.toc-link { display: block; padding: 0.5rem 0; font-size: 13px; color: var(--ink-mute); border-left: 2px solid transparent; padding-left: 1rem; transition: all 0.2s; }
.toc-link:hover, .toc-link.active { color: var(--ink); border-left-color: var(--blue); }

/* Filter chips */
.filter-chip { display: inline-flex; align-items: center; padding: 0.4rem 0.85rem; border-radius: 999px; font-size: 12px; font-weight: 500; border: 1px solid var(--line-strong); background: var(--pill-bg); color: var(--ink-soft); cursor: pointer; transition: all 0.2s; }
.filter-chip:hover, .filter-chip.active { background: var(--blue); color: #fff; border-color: var(--blue); }

/* Legal prose */
.legal-prose h2 { font-family: 'Instrument Serif', serif; font-size: 28px; margin-top: 2rem; margin-bottom: 1rem; color: var(--ink); }
.legal-prose h3 { font-family: 'Instrument Serif', serif; font-size: 22px; margin-top: 1.5rem; margin-bottom: 0.75rem; color: var(--ink); }
.legal-prose p { margin-bottom: 1rem; line-height: 1.75; color: var(--ink-soft); }
.legal-prose ul { margin-bottom: 1rem; padding-left: 1.5rem; }
.legal-prose li { margin-bottom: 0.5rem; color: var(--ink-soft); }

/* Documentation styles */
.doc-sidebar { position: sticky; top: 120px; }
.doc-sidebar a { display: block; padding: 0.4rem 0; font-size: 13px; color: var(--ink-mute); transition: color 0.2s; }
.doc-sidebar a:hover, .doc-sidebar a.active { color: var(--ink); }

/* Code blocks */
pre.code-block { background: var(--code-bg); border: 1px solid var(--line); border-radius: 0.75rem; padding: 1rem; overflow-x: auto; font-family: 'JetBrains Mono', monospace; font-size: 13px; color: var(--ink-soft); }
.code-tabs { display: flex; gap: 0; border-bottom: 1px solid var(--line); }
.code-tab { padding: 0.5rem 1rem; font-size: 12px; font-weight: 500; color: var(--ink-mute); cursor: pointer; border-bottom: 2px solid transparent; transition: all 0.2s; }
.code-tab:hover, .code-tab.active { color: var(--ink); border-bottom-color: var(--blue); }