/* ============================================================
   YV ORBIT — shared styles (index.html + evidence.html)
   Palette: off-white paper, stone, charcoal-green ink,
   YV green and YV wine. No blue, no gold.
   ============================================================ */

:root{
  --paper:#F4F0E9;
  --paper-2:#ECE7DE;
  --stone:#D8D2C6;
  --ink:#1E2923;
  --muted:#5D6860;
  --green:#3E6B52;
  --green-deep:#22402F;
  --wine:#5A1E2B;
  --wine-soft:#8C4554;
  --white:#FBFAF7;
  --max:1180px;
  --display:"Orbitron",ui-sans-serif,system-ui,sans-serif;
  --body:"IBM Plex Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.65 var(--body);font-variant-numeric:tabular-nums}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--green);outline-offset:3px}
.wrap{width:min(calc(100% - 40px),var(--max));margin-inline:auto}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- header ---------- */
.site-header{position:sticky;top:0;z-index:30;background:rgba(244,240,233,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--stone)}
.nav{height:70px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.wordmark{font:700 17px var(--display);letter-spacing:.14em;text-decoration:none;white-space:nowrap}
.wordmark .y{color:var(--green)}
.wordmark .v{color:var(--wine)}
.wordmark .o{color:var(--ink);font-weight:500}
.navlinks{display:flex;align-items:center;gap:26px;font-size:14px;color:var(--muted)}
.navlinks a{text-decoration:none}
.navlinks a:hover{color:var(--ink)}
.navlinks .nav-cta{color:var(--white);background:var(--green-deep);padding:9px 16px;border-radius:3px}
.navlinks .nav-cta:hover{color:var(--white);background:var(--green)}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:10px;min-height:46px;padding:0 20px;border-radius:3px;font:600 15px var(--body);text-decoration:none;border:1px solid var(--green-deep);cursor:pointer;background:none;color:var(--green-deep)}
.btn.solid{background:var(--green-deep);color:var(--white)}
.btn.solid:hover{background:var(--green);border-color:var(--green)}
.btn:not(.solid):hover{background:var(--white)}
.btn svg{width:18px;height:18px;flex:none}

/* ---------- type ---------- */
h1,h2,h3{margin:0;font-weight:600}
.display{font-family:var(--display);letter-spacing:-.01em;line-height:1.08}
h2.display{font-size:clamp(28px,3.6vw,42px)}
.lede{color:var(--muted);font-size:18px;max-width:60ch}
.kicker{font-size:14px;color:var(--green);font-weight:600;margin:0 0 14px}
.fine{font-size:13px;color:var(--muted)}

/* ---------- sections ---------- */
.block{padding:96px 0;border-bottom:1px solid var(--stone)}
.block-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:end;margin-bottom:44px}
.block-head p{margin:0}

/* ---------- hero ---------- */
.hero{padding:88px 0 72px}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);gap:56px;align-items:center}
.hero h1{font:700 clamp(40px,6.4vw,80px)/1.02 var(--display);letter-spacing:-.025em;margin:0 0 28px}
.hero h1 .line2{display:block;color:var(--wine)}
.hero .lede{margin:0 0 34px}
.actions{display:flex;flex-wrap:wrap;gap:12px}

/* YV monogram with orbits */
.mark{position:relative;aspect-ratio:1;max-width:400px;width:100%;margin-left:auto}
.mark svg{width:100%;height:100%;overflow:visible}
.mark .orbit-dot{transform-origin:200px 200px;animation:orbit 18s linear infinite}
@keyframes orbit{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.mark .orbit-dot{animation:none}}

/* ---------- record strip (signature) ---------- */
.record{background:var(--green-deep);color:var(--paper);padding:56px 0 48px}
.record-top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:20px 40px;margin-bottom:26px}
.record h2{font:600 clamp(22px,2.6vw,30px)/1.25 var(--display);max-width:26ch;margin:0}
.record p{margin:0;color:#C7D3CA;max-width:46ch;font-size:15px}
.strip{position:relative;width:100%}
.strip svg{width:100%;height:auto;display:block;overflow:visible}
.strip .tick-label{fill:#9FB3A5;font:500 12px var(--body)}
.strip .axis{stroke:#5E7D69}
.strip .breakeven{stroke:var(--paper);stroke-dasharray:3 4}
.strip .be-label{fill:var(--paper);font:600 12px var(--body)}
.strip .dot{cursor:pointer;transition:r .15s}
.strip .dot:hover,.strip .dot:focus{r:9}
.strip .side-label{font:600 13px var(--body)}
.legend{display:flex;flex-wrap:wrap;gap:22px;margin-top:20px;font-size:14px;color:#C7D3CA}
.legend i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:8px;vertical-align:0}
.tip{position:absolute;pointer-events:none;background:var(--paper);color:var(--ink);padding:10px 12px;border-radius:3px;font-size:13px;line-height:1.45;box-shadow:0 6px 20px rgba(0,0,0,.25);opacity:0;transform:translate(-50%,-110%);transition:opacity .12s;white-space:nowrap;z-index:5}
.tip strong{display:block;font-size:14px}

/* ---------- ledger ---------- */
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.filter{font:500 14px var(--body);padding:8px 14px;border-radius:999px;border:1px solid var(--stone);background:var(--white);color:var(--ink);cursor:pointer}
.filter[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.filter .count{color:var(--muted);margin-left:6px}
.filter[aria-pressed="true"] .count{color:#AEB8B1}
.ledger{width:100%;border-collapse:collapse;font-size:15px}
.ledger th{text-align:left;font-weight:500;color:var(--muted);font-size:13px;padding:10px 12px;border-bottom:1px solid var(--ink)}
.ledger td{padding:14px 12px;border-bottom:1px solid var(--stone);vertical-align:middle}
.ledger tbody tr{cursor:pointer}
.ledger tbody tr:hover{background:var(--white)}
.ledger .num{text-align:right;white-space:nowrap}
.ledger .name strong{display:block;font-weight:600}
.ledger .name span{font-size:13px;color:var(--muted)}
.pos{color:var(--green)}
.neg{color:var(--wine)}
.kind{display:inline-block;font-size:12px;font-weight:600;padding:3px 8px;border-radius:3px;white-space:nowrap}
.kind.backtest{background:var(--paper-2);color:var(--muted)}
.kind.forward{background:rgba(62,107,82,.14);color:var(--green-deep)}
.kind.update{background:rgba(90,30,43,.09);color:var(--wine)}
.pfbar{position:relative;width:120px;height:8px;background:var(--paper-2);border-radius:4px}
.pfbar::after{content:"";position:absolute;left:62.5%;top:-4px;bottom:-4px;width:1px;background:var(--ink)}
.pfbar span{position:absolute;top:0;bottom:0;left:0;border-radius:4px}
.ledger-note{margin-top:20px}

/* ---------- MQL5 EA ---------- */
.ea{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:start}
.ea-facts{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--ink)}
.ea-facts div{padding:18px 0;border-bottom:1px solid var(--stone)}
.ea-facts div:nth-child(odd){padding-right:20px}
.ea-facts dt{font-size:13px;color:var(--muted)}
.ea-facts dd{margin:4px 0 0;font-weight:600;font-size:17px}
.ea h3{font:600 clamp(24px,2.8vw,32px)/1.2 var(--display);margin:0 0 16px}

/* ---------- tools ---------- */
.tools{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.tool{background:var(--white);border:1px solid var(--stone);border-radius:6px;padding:34px;display:flex;flex-direction:column}
.tool h3{font:600 22px/1.25 var(--display);margin:6px 0 12px}
.tool .platform{font-size:13px;color:var(--muted)}
.tool p{margin:0 0 22px;color:var(--muted)}
.tool-shot{display:block;margin:0 0 24px;border:1px solid var(--stone);border-radius:4px;overflow:hidden;background:var(--paper-2)}
.tool-shot img{width:100%;height:auto}
.tool-shot:hover{border-color:var(--green)}
.tool ul{margin:0 0 26px;padding-left:18px}
.tool li{margin:6px 0}
.tool .demo{margin-top:auto;border-top:1px solid var(--stone);padding-top:22px}
.tool .demo-label{font-size:13px;color:var(--muted);margin-bottom:12px}
.verdicts{display:flex;flex-wrap:wrap;gap:6px}
.verdicts span{font-size:13px;font-weight:600;padding:5px 10px;border-radius:3px;border:1px solid var(--stone)}
.verdicts .v-ok{background:rgba(62,107,82,.12);border-color:transparent;color:var(--green-deep)}
.verdicts .v-mid{background:var(--paper-2);border-color:transparent;color:var(--ink)}
.verdicts .v-bad{background:rgba(90,30,43,.1);border-color:transparent;color:var(--wine)}
.tf-flow{display:flex;align-items:center;flex-wrap:wrap;gap:6px;font-size:13px;font-weight:600}
.tf-flow .tf{padding:5px 9px;border-radius:3px;background:var(--paper-2)}
.tf-flow .arrow{color:var(--muted);padding:0 4px}
.tf-flow .out{padding:5px 10px;border-radius:3px;background:var(--green-deep);color:var(--white)}
.tool .status{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-top:22px}
.tool .status span{font-size:14px;color:var(--muted)}

/* ---------- method ---------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);counter-reset:s;border-top:1px solid var(--ink)}
.step{padding:26px 24px 0 0;counter-increment:s}
.step::before{content:counter(s);font:700 30px var(--display);color:var(--wine);display:block;margin-bottom:14px}
.step h3{font-size:18px;margin-bottom:8px}
.step p{margin:0;color:var(--muted);font-size:15px}

/* ---------- connect ---------- */
.connect{background:var(--green-deep);color:var(--paper);padding:96px 0}
.connect-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px}
.connect h2{color:var(--paper)}
.connect .lede{color:#C7D3CA}
.socials{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-top:32px}
.social{display:flex;align-items:center;gap:12px;padding:14px 16px;border:1px solid rgba(244,240,233,.22);border-radius:4px;text-decoration:none;font-weight:500;font-size:15px}
.social:hover{background:rgba(244,240,233,.08);border-color:rgba(244,240,233,.5)}
.social svg{width:20px;height:20px;flex:none}
.form{background:var(--paper);color:var(--ink);border-radius:6px;padding:32px}
.form h3{font:600 20px var(--display);margin:0 0 6px}
.form > p{margin:0 0 22px;color:var(--muted);font-size:15px}
.field{margin-bottom:16px}
.field label{display:block;font-size:14px;font-weight:600;margin-bottom:6px}
.field input,.field select,.field textarea{width:100%;font:400 16px var(--body);color:var(--ink);background:var(--white);border:1px solid var(--stone);border-radius:3px;padding:11px 12px}
.field textarea{min-height:110px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--green);outline-offset:0;border-color:var(--green)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.form .btn{width:100%;justify-content:center;margin-top:6px}
.form-msg{font-size:14px;margin:12px 0 0;min-height:1.4em}

/* ---------- footer ---------- */
.site-footer{background:var(--green-deep);color:#AFC0B4;border-top:1px solid rgba(244,240,233,.14);padding:32px 0;font-size:14px}
.footer-row{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
.site-footer .wordmark .o{color:var(--paper)}
.site-footer .wordmark .y{color:#8DB89C}
.site-footer .wordmark .v{color:#C98896}
.risk{margin:18px 0 0;font-size:13px;max-width:90ch;color:#93A598}

/* ---------- lightbox ---------- */
.lightbox{position:fixed;inset:0;z-index:50;background:rgba(18,26,21,.92);display:none;align-items:center;justify-content:center;padding:24px}
.lightbox.open{display:flex}
.lightbox figure{margin:0;max-width:min(1100px,100%);max-height:100%;display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:0;background:var(--paper);border-radius:6px;overflow:hidden}
.lightbox img{width:100%;height:100%;max-height:86vh;object-fit:contain;background:#0f1411}
.lightbox figcaption{padding:26px;overflow:auto;max-height:86vh}
.lightbox figcaption h3{font:600 19px/1.3 var(--display);margin:8px 0 14px}
.lightbox dl{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;margin:0 0 16px;font-size:14px}
.lightbox dt{color:var(--muted)}
.lightbox dd{margin:0;font-weight:600;text-align:right}
.lightbox .close{position:absolute;top:16px;right:18px;background:var(--paper);border:0;border-radius:3px;width:42px;height:42px;font-size:24px;cursor:pointer;color:var(--ink)}
.lightbox .open-full{font-size:14px;font-weight:600;color:var(--green-deep)}

/* ---------- evidence page grid ---------- */
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;padding:8px 0 96px}
.shot{background:var(--white);border:1px solid var(--stone);border-radius:6px;overflow:hidden;cursor:pointer;text-align:left;padding:0;font:inherit;color:inherit;display:flex;flex-direction:column}
.shot:hover{border-color:var(--green)}
.shot img{aspect-ratio:1;object-fit:cover;width:100%;background:#0f1411}
.shot .cap{padding:16px 18px 18px}
.shot .cap strong{display:block;font-size:16px;margin:8px 0 4px;line-height:1.3}
.shot .cap span.meta{font-size:13px;color:var(--muted)}
.shot .cap .result{display:block;margin-top:10px;font-weight:600;font-size:15px}

/* ---------- responsive ---------- */
@media (max-width:960px){
  .hero-grid,.block-head,.ea,.connect-grid{grid-template-columns:1fr;gap:28px}
  .mark{max-width:300px;margin:0}
  .tools{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr 1fr;gap:0 24px}
  .step{padding-bottom:26px}
  .gallery{grid-template-columns:1fr 1fr}
  .lightbox figure{grid-template-columns:1fr;overflow:auto}
  .lightbox img{max-height:60vh}
  .lightbox figcaption{max-height:none}
  .ledger .hide-m{display:none}
}
@media (max-width:640px){
  .wrap{width:calc(100% - 32px)}
  .navlinks a:not(.nav-cta){display:none}
  .hero{padding:48px 0 56px}
  .mark{max-width:220px}
  .block{padding:64px 0}
  .lede{font-size:16px}
  .steps{grid-template-columns:1fr}
  .gallery{grid-template-columns:1fr}
  .form-row{grid-template-columns:1fr}
  .tool{padding:24px}
  .form{padding:22px}
  .ledger thead{display:none}
  .ledger,.ledger tbody,.ledger tr,.ledger td{display:block;width:100%}
  .ledger tr{padding:14px 0;border-bottom:1px solid var(--stone);display:grid;grid-template-columns:1fr auto;gap:4px 12px}
  .ledger td{border:0;padding:0}
  .ledger td.name{grid-column:1/-1}
  .ledger td.kind-cell{grid-column:1}
  .ledger td.net{grid-column:2;grid-row:2;text-align:right}
  .ledger td.pf-cell{grid-column:1/-1}
  .ledger .hide-s{display:none}
  .pfbar{width:100%}
  .connect{padding:64px 0}
}