/* greyhoundapi.com — AI Lab hub (/ai-greyhound-racing-lab).
   Scoped under .lab so it cannot reach the shared nav or footer. */

.lab .eyebrow { margin: 0 0 14px; }
.lab section { padding: 62px 0; }
.lab .band { background: #F1EFE7; }
.lab .band-ink { background: var(--night); color: var(--night-ink); }
.lab .sechead { max-width: 64ch; margin: 0 0 32px; }
.lab .sechead h2 { font: 700 clamp(28px,3.4vw,40px)/1.05 var(--disp); letter-spacing: -.01em; margin: 0 0 10px; }
.lab .sechead p { font: 400 17px/1.6 var(--body); color: #47534c; margin: 0; }
.lab .band-ink .sechead h2 { color: #fff; } .lab .band-ink .sechead p { color: #9BB3A8; }

/* ---------- hero ---------- */
.lab-hero { position: relative; overflow: hidden; color: #EAF3EE;
  background: radial-gradient(1200px 520px at 74% -20%, rgba(52,211,153,.26), transparent 60%),
              linear-gradient(135deg,#07281B,#0E5B41 56%,#062A1F); }
.lab-hero::before { content:""; position:absolute; inset:0; pointer-events:none;
  background: repeating-linear-gradient(90deg, rgba(255,255,255,.03) 0 1px, transparent 1px 96px); }
.lab-hero::after { content:""; position:absolute; right:-140px; top:-160px; width:520px; height:520px; border-radius:50%;
  background: radial-gradient(circle, rgba(126,211,174,.35), transparent 62%); filter: blur(10px); pointer-events:none; }
.lab-hero-in { position: relative; display:grid; grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);
  gap:48px; align-items:center; padding: 62px 0 68px; }
.lab-hero-copy { max-width: 60ch; }
.lab-hero .eyebrow { color: #7FD3AE; }
.lab-hero h1 { font: 700 clamp(42px,5.6vw,72px)/.95 var(--disp); letter-spacing: -.025em; color:#fff; margin: 0 0 20px; }
.lab-hero h1 span { color: #8CE6BE; }
.lab-hero .sub { font: 400 20px/1.6 var(--body); color:#C6DED2; margin: 0 0 30px; max-width: 58ch; }
.lab-hero .sub strong { color:#EAF3EE; font-weight:600; }
.lab-cta { display:flex; gap:12px; flex-wrap:wrap; }
.btn-ink { display:inline-flex; align-items:center; gap:9px; background:#fff; color:#0A4231; font:600 15px var(--body);
  padding:14px 26px; border-radius:10px; text-decoration:none; }
.btn-ink:hover { background:#EAF3EE; color:#0A4231; }
.btn-ghost-ink { display:inline-flex; align-items:center; gap:9px; background:transparent; color:#EAF3EE;
  border:1px solid rgba(255,255,255,.35); font:600 15px var(--body); padding:14px 26px; border-radius:10px; text-decoration:none; }
.btn-ghost-ink:hover { background:rgba(255,255,255,.1); color:#fff; }
.lab-hstats { position:relative; display:flex; gap:38px; flex-wrap:wrap; margin-top:40px; padding-top:26px;
  border-top:1px solid rgba(255,255,255,.16); }
.lab-hstat .n { font:700 32px/1 var(--disp); color:#fff; }
.lab-hstat .l { font:500 11px var(--mono); letter-spacing:.09em; text-transform:uppercase; color:#8FB3A2; margin-top:7px; }


/* ---------- hero visual: six traps -> network -> ranked call ---------- */
.lab-viz { width:100%; height:auto; display:block; overflow:hidden; }
.lv-edge { stroke:#5FD3A4; stroke-width:1; fill:none; opacity:.16;
  stroke-dasharray:5 9; animation:lvFlow 3.2s linear infinite; }
@keyframes lvFlow { to { stroke-dashoffset:-42; } }
.lv-node { fill:#0B2A20; stroke:#3FA980; stroke-width:1.6; }
.lv-node-pulse { animation:lvPulse 2.6s ease-in-out infinite; transform-origin:center; }
@keyframes lvPulse { 0%,100%{opacity:.45} 50%{opacity:1} }
.lv-trap { stroke:rgba(255,255,255,.5); stroke-width:1.4; }
.lv-tnum { font:700 11px var(--mono); fill:#fff; text-anchor:middle; dominant-baseline:central; }
.lv-tnum.dark { fill:#14100E; }
.lv-lane { stroke:rgba(255,255,255,.09); stroke-width:1; }
.lv-dog { fill:#8CE6BE; opacity:.9; }
.lv-label { font:600 9.5px var(--mono); fill:#7FD3AE; letter-spacing:.1em; text-transform:uppercase; }
.lv-outbg { fill:rgba(255,255,255,.08); }
.lv-outbar { fill:url(#lvGrad); }
.lv-outtxt { font:700 12px var(--mono); fill:#EAF3EE; dominant-baseline:central; }
.lv-outpct { font:700 12px var(--mono); fill:#8CE6BE; text-anchor:end; dominant-baseline:central; }
.lv-card { fill:rgba(0,0,0,.32); stroke:rgba(255,255,255,.16); }
@media (prefers-reduced-motion: reduce) {
  .lv-edge, .lv-node-pulse, .lv-dog { animation:none !important; }
  .lv-edge { opacity:.22; }
}

/* ---------- project cards ---------- */
.pgrid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.pcard { display:flex; flex-direction:column; background:var(--white); border:1px solid var(--line);
  border-top:3px solid var(--green); border-radius:14px; padding:22px 24px 20px; }
.pcard.soon { border-top-color:#C9D3CC; background:#FBFAF6; }
.pcard-h { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:4px; }
.pcard h3 { font:700 21px var(--disp); margin:0; }
.pstatus { font:600 10px var(--mono); letter-spacing:.07em; text-transform:uppercase; padding:3px 9px; border-radius:999px; }
.pstatus.live { background:#12301f; color:#7fe0ac; }
.pstatus.soon { background:#EDEBE3; color:#6d7a72; }
.ptag { font:500 12px var(--mono); color:var(--mut); margin-bottom:12px; }
.ptag b { color:var(--orange); font-weight:600; }
.pcard p { font:400 14.5px/1.62 var(--body); color:#47534c; margin:0 0 16px; flex:1; }
.pstats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; padding:14px 0; margin-bottom:4px;
  border-top:1px solid #EEECE4; }
.pstats > div { min-width:0; }
/* Coming-soon cards reserve the same band so every footer sits on one line. */
.pstats.ghost { border-top-color:transparent; }
.pstats .n { font:700 18px/1 var(--mono); color:var(--green); }
.pstats .l { font:500 10.5px var(--mono); letter-spacing:.05em; text-transform:uppercase; color:var(--mut); margin-top:5px; }
.pfoot { display:flex; align-items:center; gap:14px; padding-top:14px; border-top:1px solid #EEECE4; }
.pfoot a { display:inline-flex; align-items:center; gap:7px; font:600 13.5px var(--body); text-decoration:none; }
.pgh { color:#40544a; } .pgh:hover { color:var(--ink); }
.pmore { margin-left:auto; color:var(--green); }
.pmore:hover { color:var(--green-deep); }
.pfoot .pending { margin-left:auto; font:500 12.5px var(--mono); color:var(--mut); }

/* ---------- thesis ---------- */
.thesis { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.thes { background:var(--white); border:1px solid var(--line); border-radius:14px; padding:24px; }
.thes .ic { width:38px; height:38px; border-radius:11px; display:grid; place-items:center; margin-bottom:14px;
  background:#EAF5EF; color:var(--green); font:700 17px var(--disp); }
.thes h4 { font:700 18px var(--disp); margin:0 0 8px; }
.thes p { font:400 14px/1.6 var(--body); color:#47534c; margin:0; }

/* ---------- terminal ---------- */
.runrow { display:grid; grid-template-columns:.9fr 1.1fr; gap:44px; align-items:center; }
.term { background:#0A1310; border:1px solid #1c2b24; border-radius:14px; overflow:hidden; }
.term-bar { display:flex; align-items:center; gap:8px; padding:11px 16px; background:#0C1A15; border-bottom:1px solid #1c2b24;
  font:500 12px var(--mono); color:#7f9a8c; }
.term-bar i { width:10px; height:10px; border-radius:50%; background:#2a3b33; }
.term pre { margin:0; padding:18px 20px; font:500 13px/1.8 var(--mono); color:#C6DED2; overflow-x:auto; }
.term .c { color:#6b7f74; } .term .g { color:#86C79A; } .term .k { color:#8FB3D6; } .term .n { color:#E0B24A; }

.lab-disc { border:1px dashed var(--line); border-radius:12px; padding:18px 22px; margin-top:26px;
  font:400 13.5px/1.65 var(--body); color:#5c6660; }
.lab-disc strong { color:var(--ink); }

@media (max-width:1000px){ .pgrid,.thesis{grid-template-columns:repeat(2,minmax(0,1fr));} .runrow{grid-template-columns:1fr;gap:28px;}
  .lab-hero-in{grid-template-columns:1fr;gap:34px;} .lab-viz{max-width:560px;} }
@media (max-width:720px){
  /* The default .wrap gutter is 20px, which leaves cards and the terminal
     sitting almost on the screen edge once everything is one column. */
  .lab .wrap { padding-left:24px; padding-right:24px; }
  .lab section { padding:46px 0; }
  .lab-hero-in { padding:44px 0 50px; }
  .lab .sechead { margin-bottom:24px; }
  .pcard { padding:20px 20px 18px; }
  .thes { padding:20px; }
  .term pre { padding:16px 16px; font-size:12px; line-height:1.7; }
  .lab-disc { padding:16px 18px; }
}
@media (max-width:640px){ .pgrid,.thesis{grid-template-columns:1fr;} .lab-hstats{gap:22px 28px;} }

/* ---------- Q&A list (insights detail page) ---------- */
.qa-list { display:grid; gap:14px; }
.qa { background:var(--white); border:1px solid var(--line); border-left:3px solid var(--green);
  border-radius:13px; padding:22px 24px; }
.qa-q { display:flex; gap:11px; align-items:baseline; font:700 18px/1.4 var(--disp); margin:0 0 12px; color:var(--ink); }
.qa-mark { flex:none; font:700 13px var(--mono); color:var(--orange); }
.qa-a { font:400 15px/1.68 var(--body); color:#3c463f; }
.qa-a p { margin:0 0 10px; } .qa-a p:last-child { margin:0; }
.qa-a ul, .qa-a ol { margin:0 0 10px; padding-left:20px; }
.qa-a li { margin:3px 0; }
.qa-a code { font-size:.92em; }
.qa-tools { display:flex; gap:7px; align-items:center; flex-wrap:wrap; margin-top:14px;
  padding-top:12px; border-top:1px solid #EEECE4; }
.qa-tools .lead { font:600 10.5px var(--mono); letter-spacing:.07em; text-transform:uppercase; color:var(--mut); }
.qa-tool { font:600 11.5px var(--mono); background:#EAF5EF; color:#0E5B41; border-radius:6px; padding:3px 9px; }

/* chips, shared with the tool-usage block */
.lab .chips { display:flex; gap:8px; flex-wrap:wrap; }
.lab .chip { font:600 13px var(--mono); background:var(--white); border:1px solid var(--line);
  border-radius:8px; padding:7px 13px; color:var(--ink); }
.lab .chip small { color:var(--mut); font-weight:500; }
