/* ---------- SUBPAGE: ABOUT ---------- */
.subpage-hero{padding:80px 0 40px}
.subpage-eyebrow{
  font-family:'JetBrains Mono', monospace; font-size:12px;
  text-transform:uppercase; letter-spacing:.12em; color:var(--muted);
  display:flex; align-items:center; gap:10px; margin-bottom:18px;
}
.subpage-eyebrow::before{content:""; width:24px; height:1.5px; background:var(--ink)}
.subpage-h1{
  font-family:'Archivo Black', sans-serif;
  font-size:clamp(56px, 7vw, 108px);
  line-height:.92; letter-spacing:-0.035em;
  margin:0 0 24px;
}
.subpage-h1 em{font-family:'Instrument Serif', serif; font-style:italic; font-weight:400; color:var(--accent)}

.about-intro{
  display:grid; grid-template-columns: 1.3fr 1fr; gap:48px;
  padding:24px 0 64px;
}
.about-intro p{font-size:19px; line-height:1.55; color:var(--ink-2); margin:0 0 18px; max-width:640px}
.about-intro p:first-of-type::first-letter{
  font-family:'Archivo Black', sans-serif;
  font-size:64px; line-height:.85; float:left;
  margin:6px 10px 0 0; color:var(--accent); letter-spacing:-0.02em;
}
.about-portrait{
  border:1.5px solid var(--ink); background:var(--paper);
  min-height:420px; position:relative; overflow:hidden;
  box-shadow:6px 6px 0 var(--ink);
  display:flex; flex-direction:column;
}
.about-portrait .ph-top{
  flex:1; background:linear-gradient(135deg, var(--accent) 0%, #d8350a 100%);
  display:flex; align-items:center; justify-content:center; position:relative;
}
.about-portrait .ph-initials{
  font-family:'Archivo Black', sans-serif;
  font-size:140px; color:#fff;
  letter-spacing:-0.06em; line-height:.85;
  text-shadow:0 4px 0 rgba(0,0,0,.15);
}
.about-portrait .ph-stamp{
  position:absolute; top:18px; right:18px;
  border:1.5px solid #fff; padding:6px 10px;
  font-family:'JetBrains Mono', monospace; font-size:10px; color:#fff;
  text-transform:uppercase; letter-spacing:.1em; transform:rotate(4deg);
  background:rgba(0,0,0,.2);
}
.about-portrait .ph-coords{
  position:absolute; bottom:18px; left:18px;
  font-family:'JetBrains Mono', monospace; font-size:10px; color:#fff;
  opacity:.85;
}
.about-portrait .ph-bottom{
  background:var(--ink); color:var(--cream); padding:18px 22px;
  display:flex; justify-content:space-between; align-items:center; gap:12px;
}
.about-portrait .ph-name{font-family:'Archivo Black', sans-serif; font-size:18px; letter-spacing:-0.02em}
.about-portrait .ph-role{font-family:'JetBrains Mono', monospace; font-size:11px; color:#a8a299; text-transform:uppercase; letter-spacing:.08em; margin-top:2px}

.about-stats{
  display:grid; grid-template-columns:repeat(4, 1fr); gap:0;
  border-top:1.5px solid var(--ink); border-bottom:1.5px solid var(--ink);
  margin:0 0 80px;
}
.about-stat{
  padding:28px 22px; border-right:1.5px solid var(--rule);
}
.about-stat:last-child{border-right:0}
.about-stat .v{font-family:'Archivo Black', sans-serif; font-size:56px; line-height:1; letter-spacing:-0.035em}
.about-stat .v em{font-family:'Instrument Serif', serif; font-style:italic; font-weight:400; color:var(--accent)}
.about-stat .l{font-family:'JetBrains Mono', monospace; font-size:11px; text-transform:uppercase; letter-spacing:.1em; color:var(--muted); margin-top:8px}

.about-quote{
  padding:64px 0;
  border-top:1.5px solid var(--rule); border-bottom:1.5px solid var(--rule);
  margin-bottom:80px;
}
.about-quote blockquote{
  font-family:'Instrument Serif', serif;
  font-size:clamp(32px, 4vw, 56px);
  line-height:1.1; letter-spacing:-0.02em;
  margin:0; max-width:1000px;
  text-wrap:balance;
}
.about-quote blockquote em{color:var(--accent); font-style:italic}
.about-quote cite{
  display:block; margin-top:24px;
  font-family:'JetBrains Mono', monospace; font-size:12px;
  text-transform:uppercase; letter-spacing:.12em; color:var(--muted);
  font-style:normal;
}

.timeline{
  display:grid; grid-template-columns: 200px 1fr; gap:0;
  border-top:1.5px solid var(--rule);
}
.tl-row{
  display:contents;
}
.tl-year{
  padding:24px 22px 24px 0;
  font-family:'Archivo Black', sans-serif; font-size:36px;
  letter-spacing:-0.02em; line-height:1;
  border-right:1.5px solid var(--rule); border-bottom:1.5px solid var(--rule);
  color:var(--accent);
}
.tl-body{
  padding:24px 0 24px 28px; border-bottom:1.5px solid var(--rule);
}
.tl-body h4{font-family:'Archivo', sans-serif; font-weight:700; font-size:22px; margin:0 0 6px; letter-spacing:-0.01em}
.tl-body p{margin:0; font-size:15px; color:var(--ink-2); line-height:1.55; max-width:720px}

.contact-card{
  display:grid; grid-template-columns:1fr 1fr; gap:0;
  border:1.5px solid var(--ink); margin-top:48px; box-shadow:8px 8px 0 var(--ink);
}
.contact-l{padding:36px 32px; background:var(--paper)}
.contact-r{padding:36px 32px; background:var(--ink); color:var(--cream); border-left:1.5px solid var(--ink)}
.contact-card h3{font-family:'Archivo Black', sans-serif; font-size:32px; line-height:1; letter-spacing:-0.02em; margin:0 0 12px}
.contact-r h3{color:#fff}
.contact-card h3 em{font-family:'Instrument Serif', serif; font-style:italic; font-weight:400; color:var(--accent)}
.contact-row{display:flex; flex-direction:column; gap:4px; margin-bottom:18px}
.contact-row .l{font-family:'JetBrains Mono', monospace; font-size:11px; text-transform:uppercase; letter-spacing:.1em; color:var(--muted)}
.contact-r .contact-row .l{color:#8a8578}
.contact-row .v{font-family:'Archivo', sans-serif; font-weight:600; font-size:17px}
.contact-row .v a{border-bottom:1.5px solid var(--ink); padding-bottom:1px}
.contact-r .contact-row .v a{border-bottom:1.5px solid var(--accent); color:var(--accent)}
.contact-row .v a:hover{color:var(--accent)}
.contact-r .contact-row .v a:hover{color:#fff; border-color:#fff}

/* spam-safe email */
.email-safe{font-family:'JetBrains Mono', monospace; user-select:all}
.email-safe::after{
  /* Bot-deterrent CSS-generated content; readable to humans */
  /* The real address gets assembled by JS at runtime */
}
.email-stat{
  display:inline-flex; align-items:center; gap:8px;
  font-family:'JetBrains Mono', monospace; font-size:10px;
  text-transform:uppercase; letter-spacing:.1em; color:var(--ok);
  margin-top:6px;
}
.email-stat::before{content:""; width:6px; height:6px; border-radius:50%; background:var(--ok); box-shadow:0 0 0 3px rgba(31,122,58,.2)}

@media (max-width: 900px){
  .about-intro{grid-template-columns:1fr; gap:36px}
  .about-portrait{min-height:340px}
  .about-portrait .ph-initials{font-size:96px}
  .about-stats{grid-template-columns:1fr 1fr}
  .about-stat{border-bottom:1.5px solid var(--rule)}
  .about-stat:nth-child(3), .about-stat:nth-child(4){border-bottom:0}
  .timeline{grid-template-columns: 100px 1fr}
  .tl-year{font-size:24px; padding-right:14px}
  .tl-body{padding-left:18px}
  .contact-card{grid-template-columns:1fr}
  .contact-r{border-left:0; border-top:1.5px solid var(--ink)}
}

/* ---------- SUBPAGE: PRIVACY ---------- */
.legal-grid{
  display:grid; grid-template-columns: 240px 1fr; gap:48px;
  padding:24px 0 80px;
}
.legal-toc{
  position:sticky; top:88px; align-self:start;
  border-left:1.5px solid var(--ink); padding:6px 0;
}
.legal-toc h5{
  font-family:'JetBrains Mono', monospace; font-size:11px;
  text-transform:uppercase; letter-spacing:.12em; color:var(--muted);
  margin:0 0 12px; padding-left:18px;
}
.legal-toc ul{list-style:none; padding:0; margin:0}
.legal-toc li{
  padding:6px 0; padding-left:18px; margin-left:-1.5px;
  font-size:13px; line-height:1.4; cursor:pointer;
  border-left:1.5px solid transparent;
  transition:border-color .12s, color .12s;
}
.legal-toc li:hover{color:var(--accent); border-left-color:var(--accent)}
.legal-toc li.active{color:var(--accent); border-left-color:var(--accent); font-weight:600}
.legal-toc .tn{
  font-family:'JetBrains Mono', monospace; font-size:11px;
  margin-right:8px; color:var(--muted);
}
.legal-body{max-width:780px; font-size:16px; line-height:1.7; color:var(--ink-2)}
.legal-body section{padding:8px 0 28px; scroll-margin-top:90px}
.legal-body h2{
  font-family:'Archivo Black', sans-serif;
  font-size:32px; line-height:1; letter-spacing:-0.025em;
  margin:24px 0 14px; color:var(--ink);
  display:flex; align-items:baseline; gap:14px;
}
.legal-body h2 .n{
  font-family:'JetBrains Mono', monospace; font-size:13px;
  color:var(--accent); letter-spacing:.05em;
  text-transform:uppercase;
}
.legal-body p{margin:0 0 14px}
.legal-body ul{padding-left:22px; margin:8px 0 14px}
.legal-body li{margin-bottom:8px}
.legal-body strong{color:var(--ink)}
.legal-body .note{
  border-left:3px solid var(--accent); padding:14px 18px;
  background:var(--paper); font-family:'JetBrains Mono', monospace;
  font-size:13px; color:var(--ink-2); margin:18px 0;
}
.legal-meta{
  display:flex; gap:20px; flex-wrap:wrap; padding:18px 0;
  border-top:1.5px solid var(--rule); border-bottom:1.5px solid var(--rule);
  margin-bottom:32px;
  font-family:'JetBrains Mono', monospace; font-size:11px;
  text-transform:uppercase; letter-spacing:.1em; color:var(--muted);
}
.legal-meta b{color:var(--ink); font-weight:700}
@media (max-width: 900px){
  .legal-grid{grid-template-columns:1fr; gap:24px}
  .legal-toc{position:static; border-left:0; border-top:1.5px solid var(--ink); padding:18px 0 0}
}

/* ---------- AUTH (login / signup) ---------- */
.auth-shell{
  display:grid; grid-template-columns: 0.95fr 1.05fr;
  min-height: calc(100vh - 64px - 39px); /* subtract nav + ticker */
  align-items:stretch;
  border-top:1.5px solid var(--ink);
}
.auth-side{
  background:var(--ink); color:var(--cream);
  padding:64px 64px 48px;
  display:flex; flex-direction:column; justify-content:space-between;
  position:relative; overflow:hidden;
}
.auth-side::before{
  content:""; position:absolute; right:-80px; top:-80px;
  width:340px; height:340px; background:var(--accent);
  border-radius:50%; opacity:.18; filter:blur(2px);
}
.auth-side .eyebrow{
  background:transparent; border-color:var(--cream); color:var(--cream);
  align-self:flex-start; position:relative; z-index:1;
}
.auth-side h2{
  font-family:'Archivo Black', sans-serif;
  font-size:clamp(48px, 5.5vw, 88px);
  line-height:0.92; letter-spacing:-0.035em;
  margin:24px 0 22px; position:relative; z-index:1;
  text-wrap:balance;
}
.auth-side h2 em{
  font-family:'Instrument Serif', serif; font-style:italic; font-weight:400;
  color:var(--accent);
}
.auth-side .auth-lede{
  font-size:18px; line-height:1.5; color:#c4bfa9; max-width:440px;
  margin:0 0 32px; position:relative; z-index:1;
}
.auth-bullets{
  list-style:none; padding:0; margin:0;
  display:flex; flex-direction:column; gap:12px;
  position:relative; z-index:1;
}
.auth-bullets li{
  display:flex; align-items:flex-start; gap:12px;
  font-size:15px; line-height:1.4;
}
.auth-bullets li::before{
  content:""; flex-shrink:0;
  width:10px; height:10px; background:var(--accent);
  transform:rotate(45deg); margin-top:7px;
}
.auth-quote{
  border-top:1px solid #2a2823; padding-top:24px; margin-top:32px;
  position:relative; z-index:1;
}
.auth-quote blockquote{
  font-family:'Instrument Serif', serif; font-size:22px;
  line-height:1.35; margin:0; max-width:440px; color:var(--cream);
}
.auth-quote cite{
  display:block; margin-top:12px; font-style:normal;
  font-family:'JetBrains Mono', monospace; font-size:11px;
  text-transform:uppercase; letter-spacing:.12em; color:#8a8578;
}
.auth-meta-row{
  display:flex; gap:32px; margin-top:24px;
  position:relative; z-index:1;
}
.auth-meta-row > div{display:flex; flex-direction:column}
.auth-meta-row .v{
  font-family:'Archivo Black', sans-serif; font-size:32px;
  line-height:1; letter-spacing:-0.025em; color:var(--accent);
}
.auth-meta-row .l{
  font-family:'JetBrains Mono', monospace; font-size:11px;
  text-transform:uppercase; letter-spacing:.1em; color:#8a8578; margin-top:6px;
}

.auth-main{
  background:var(--cream); padding:56px 64px;
  display:flex; flex-direction:column; justify-content:center;
}
.auth-card{
  max-width:480px; width:100%; margin:0 auto;
}
.auth-card h1{
  font-family:'Archivo Black', sans-serif;
  font-size:42px; line-height:1; letter-spacing:-0.025em;
  margin:0 0 8px;
}
.auth-card h1 em{
  font-family:'Instrument Serif', serif; font-style:italic; font-weight:400;
  color:var(--accent);
}
.auth-card .auth-sub{
  font-size:15px; color:var(--ink-2); margin:0 0 28px;
}
.auth-card .auth-sub a{
  color:var(--accent); border-bottom:1.5px solid var(--accent); font-weight:600;
}
.auth-card .auth-sub a:hover{color:var(--ink); border-color:var(--ink)}

.social-row{display:flex; flex-direction:column; gap:8px; margin-bottom:20px}
.social-btn{
  display:flex; align-items:center; gap:10px;
  padding:12px 16px; border:1.5px solid var(--ink); background:var(--paper);
  font-weight:600; font-size:14px; cursor:pointer;
  transition:all .12s;
  width:100%; text-align:left;
}
.social-btn:hover{background:var(--ink); color:var(--cream)}
.social-btn:hover svg path, .social-btn:hover svg circle{fill:currentColor}
.social-btn .ico{width:20px; height:20px; flex-shrink:0; display:flex; align-items:center; justify-content:center}
.social-btn .ico svg{width:100%; height:100%}
.social-btn .lbl{flex:1}
.social-btn .arr{font-family:'JetBrains Mono', monospace; font-size:14px; opacity:.4}
.social-btn:hover .arr{opacity:1}

.auth-divider{
  display:flex; align-items:center; gap:12px;
  margin:6px 0 20px;
  font-family:'JetBrains Mono', monospace; font-size:11px;
  text-transform:uppercase; letter-spacing:.12em; color:var(--muted);
}
.auth-divider::before, .auth-divider::after{
  content:""; flex:1; height:1.5px; background:var(--rule);
}

.field{display:flex; flex-direction:column; gap:6px; margin-bottom:14px}
.field label{
  font-family:'JetBrains Mono', monospace; font-size:11px;
  text-transform:uppercase; letter-spacing:.1em; color:var(--muted);
  display:flex; justify-content:space-between; align-items:center;
}
.field label .hint{color:var(--accent); text-transform:none; letter-spacing:0; font-size:11px; font-family:inherit}
.field label .hint a{border-bottom:1.5px solid var(--accent); padding-bottom:1px}
.field input[type=email], .field input[type=text], .field input[type=password]{
  padding:13px 14px; border:1.5px solid var(--ink); background:var(--paper);
  outline:none; font-size:15px; font-family:'JetBrains Mono', monospace;
  transition:background .12s, box-shadow .12s;
}
.field input:focus{background:#fff; box-shadow: 0 0 0 3px rgba(239,74,20,.18)}
.field-pw{position:relative}
.field-pw input{padding-right:62px}
.field-pw .toggle{
  position:absolute; right:0; top:0; height:100%; padding:0 14px;
  font-family:'JetBrains Mono', monospace; font-size:11px;
  text-transform:uppercase; letter-spacing:.08em; color:var(--muted);
  background:transparent; border-left:1.5px solid var(--rule); cursor:pointer;
}
.field-pw .toggle:hover{color:var(--accent)}

.pw-strength{
  display:flex; gap:4px; margin-top:8px;
}
.pw-strength span{
  flex:1; height:4px; background:var(--rule); opacity:.3;
}
.pw-strength.s1 span:nth-child(-n+1){opacity:1; background:#c84c1a}
.pw-strength.s2 span:nth-child(-n+2){opacity:1; background:#d8821a}
.pw-strength.s3 span:nth-child(-n+3){opacity:1; background:#c89e1a}
.pw-strength.s4 span:nth-child(-n+4){opacity:1; background:var(--ok)}
.pw-strength-label{
  font-family:'JetBrains Mono', monospace; font-size:10px;
  text-transform:uppercase; letter-spacing:.08em; color:var(--muted);
  margin-top:6px; display:flex; justify-content:space-between;
}
.pw-strength-label .v{color:var(--ink); font-weight:700}

.field-check{
  display:flex; gap:10px; align-items:flex-start;
  font-size:13px; line-height:1.45; margin:6px 0 4px;
  cursor:pointer;
}
.field-check input{
  width:18px; height:18px; flex-shrink:0; margin-top:2px;
  accent-color:var(--accent); cursor:pointer;
}
.field-check span{color:var(--ink-2)}
.field-check a{color:var(--ink); font-weight:600; border-bottom:1.5px solid var(--ink); padding-bottom:1px}
.field-check a:hover{color:var(--accent); border-color:var(--accent)}
.field-check .req{color:var(--accent); margin-left:2px}

.auth-submit{
  width:100%; padding:15px 20px; margin-top:18px;
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  font-size:15px; font-weight:700;
}
.auth-foot{
  margin-top:24px; padding-top:18px; border-top:1.5px solid var(--rule);
  font-family:'JetBrains Mono', monospace; font-size:11px;
  text-transform:uppercase; letter-spacing:.08em; color:var(--muted);
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px;
}
.auth-foot .lock::before{content:"🔒 "; font-size:13px}

/* Provider icons (inline SVG variant) */
.ico-github svg{fill:var(--ink)}
.ico-google svg path:first-child{fill:#ef4a14}

@media (max-width:980px){
  .auth-shell{grid-template-columns:1fr}
  .auth-side{padding:48px 32px 36px}
  .auth-main{padding:36px 28px}
  .auth-card h1{font-size:32px}
  .auth-side h2{font-size:42px}
  .auth-quote{display:none}
}
