/* theanalogue.app/learn: one stylesheet for the hub, sections and articles.
   Same tokens as the homepage. Source of truth: learn-src/learn.css (copied to /learn.css by the build). */
:root{
  --bg:#0A0806;--card:#18140D;--card2:#241C13;--amber:#FF3300;--amber-m:#962E00;--amber-d:rgba(255,51,0,0.10);
  --white:#F6F2EA;--bright:#FAF6EE;--fog:#C5BCAD;--dim:#7A6B5E;--border:#382F20;--border2:#221A12;--green:#52C97A;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;scroll-padding-top:calc(96px + env(safe-area-inset-top,0px));}
body{background:var(--bg);color:var(--white);font-family:'Playfair Display',serif;font-size:18px;line-height:1.7;overflow-x:hidden;}
a{color:var(--amber);}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}

/* header: logo + CTA on top; the site links sit on their own row on phones */
.top{position:sticky;top:0;z-index:50;display:grid;grid-template-columns:1fr auto;align-items:center;gap:0 16px;
  padding:env(safe-area-inset-top,0px) 16px 0;background:rgba(8,6,4,0.97);backdrop-filter:blur(14px);border-bottom:1px solid var(--border);}
.logo{font-weight:500;font-size:19px;letter-spacing:0.06em;color:var(--amber);text-decoration:none;white-space:nowrap;height:52px;display:flex;align-items:center;}
.top-cta{font-family:'Rajdhani',sans-serif;font-weight:700;font-size:12px;letter-spacing:0.14em;text-transform:uppercase;color:var(--bg);background:var(--amber);padding:7px 12px;white-space:nowrap;text-decoration:none;}
.top-cta{grid-row:1;grid-column:2;}
.top-cta:hover{background:#FF7826;}
.top-links{grid-column:1 / -1;display:flex;gap:22px;overflow-x:auto;padding:0 0 12px;scrollbar-width:none;}
.top-links::-webkit-scrollbar{display:none;}
.top-links a{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:var(--fog);text-decoration:none;white-space:nowrap;}
.top-links a:hover{color:var(--amber);}
@media(min-width:760px){
  .top{grid-template-columns:auto 1fr auto;}
  .top-links{grid-column:auto;justify-content:flex-end;padding:0;}
  .top-cta{grid-row:auto;grid-column:auto;}
}
.main{max-width:1100px;margin:0 auto;padding:22px 16px 72px;}

/* breadcrumbs */
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:6px;font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:0.08em;color:var(--dim);margin-bottom:26px;}
.crumbs li+li::before{content:'/';margin-right:6px;color:var(--border);}
.crumbs a{color:var(--fog);text-decoration:none;}
.crumbs a:hover{color:var(--amber);}
.crumbs [aria-current]{color:var(--dim);max-width:46ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* hub + section heads */
.kicker{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:0.24em;text-transform:uppercase;color:var(--amber);margin-bottom:12px;}
.hub-head{padding:18px 0 34px;max-width:780px;}
.hub-head h1{font-family:'Rajdhani',sans-serif;font-weight:700;font-size:clamp(42px,9vw,76px);line-height:0.95;margin-bottom:18px;}
.hub-head h1 em{font-style:normal;color:var(--amber);}
.hub-dek{font-size:18px;color:var(--fog);line-height:1.7;}
.search{margin-top:26px;}
.search input{width:100%;background:var(--card);border:1px solid var(--border);border-left:3px solid var(--amber);color:var(--white);
  font-family:'IBM Plex Mono',monospace;font-size:15px;padding:16px 16px;outline:none;-webkit-appearance:none;border-radius:0;}
.search input:focus{border-color:var(--amber);}
.search input::placeholder{color:var(--dim);}
.results{margin-top:12px;border:1px solid var(--border);}
.hit{display:block;background:var(--card);padding:16px 18px;border-bottom:1px solid var(--border2);text-decoration:none;}
.hit:last-child{border-bottom:none;}
.hit:hover{background:var(--card2);}
.hit span{font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:0.16em;text-transform:uppercase;color:var(--amber);}
.hit b{display:block;font-family:'Rajdhani',sans-serif;font-size:20px;color:var(--white);margin:2px 0 4px;}
.hit p{font-size:14.5px;color:var(--fog);line-height:1.55;}
.empty{font-size:15px;color:var(--dim);padding:16px 18px;font-style:italic;}

.cats{display:grid;grid-template-columns:1fr;gap:1px;background:var(--border);border:1px solid var(--border);}
.cat{background:var(--card);display:flex;flex-direction:column;}
.cat-top{display:block;padding:26px 22px 14px;text-decoration:none;border-top:2px solid var(--amber);}
.cat-top h2{font-family:'Rajdhani',sans-serif;font-weight:700;font-size:30px;color:var(--white);line-height:1.05;margin-bottom:8px;}
.cat-top p{font-size:15px;color:var(--fog);line-height:1.6;}
.cat-top:hover h2{color:var(--amber);}
.cat ul{list-style:none;padding:0 22px 22px;}
.cat li{border-top:1px solid var(--border2);}
.cat li a{display:block;padding:11px 0;font-size:15.5px;color:var(--white);text-decoration:none;line-height:1.45;}
.cat li a:hover{color:var(--amber);}
.cat li.empty{padding:11px 0;}

.cards{display:grid;grid-template-columns:1fr;gap:1px;background:var(--border);border:1px solid var(--border);}
.card{background:var(--card);padding:24px 22px;text-decoration:none;display:flex;flex-direction:column;}
.card:hover{background:var(--card2);}
.card-tag{font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:0.16em;text-transform:uppercase;color:var(--amber);margin-bottom:8px;}
.card-title{font-family:'Rajdhani',sans-serif;font-weight:700;font-size:23px;line-height:1.15;color:var(--white);margin-bottom:8px;}
.card p{font-size:15px;color:var(--fog);line-height:1.6;margin-bottom:14px;flex:1;}
.card-more{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:var(--amber);}
.cat-switch{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;margin-top:34px;font-family:'IBM Plex Mono',monospace;font-size:11.5px;letter-spacing:0.12em;text-transform:uppercase;}
.cat-switch span{color:var(--dim);}
.cat-switch a{color:var(--fog);text-decoration:none;border-bottom:1px solid var(--border);}
.cat-switch a:hover{color:var(--amber);border-color:var(--amber);}

/* article */
.article{max-width:740px;margin:0 auto;}
.art-head{margin-bottom:30px;}
.art-tag{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:0.18em;text-transform:uppercase;color:var(--amber);margin-bottom:14px;}
.art-tag a{text-decoration:none;}
.article h1{font-family:'Rajdhani',sans-serif;font-weight:700;font-size:clamp(34px,6.5vw,54px);line-height:1.02;margin-bottom:16px;}
.art-dek{font-size:19px;font-style:italic;color:var(--bright);line-height:1.6;margin-bottom:16px;}
.art-meta{font-family:'IBM Plex Mono',monospace;font-size:11.5px;letter-spacing:0.06em;color:var(--dim);}
.toc{background:var(--card);border:1px solid var(--border);padding:18px 22px;margin-bottom:34px;}
.toc-head{font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:0.2em;text-transform:uppercase;color:var(--dim);margin-bottom:8px;}
.toc ol{padding-left:20px;}
.toc li{font-size:15.5px;line-height:1.5;padding:3px 0;color:var(--dim);}
.toc a{color:var(--fog);text-decoration:none;}
.toc a:hover{color:var(--amber);}

.prose{color:var(--fog);}
.prose > * + *{margin-top:18px;}
.prose h2{font-family:'Rajdhani',sans-serif;font-weight:700;font-size:clamp(26px,4.5vw,34px);line-height:1.1;color:var(--white);margin-top:46px;padding-top:22px;border-top:1px solid var(--border);}
.prose h3{font-family:'Rajdhani',sans-serif;font-weight:700;font-size:22px;line-height:1.2;color:var(--white);margin-top:30px;}
.prose p{font-size:18px;line-height:1.78;}
.prose strong{color:var(--white);font-weight:600;}
.prose ul,.prose ol{padding-left:24px;}
.prose li{font-size:17.5px;line-height:1.7;padding:3px 0;}
.prose li::marker{color:var(--amber);}
.prose code{font-family:'IBM Plex Mono',monospace;font-size:0.82em;background:var(--card2);border:1px solid var(--border);padding:1px 6px;color:var(--white);}
.prose a{text-decoration:none;border-bottom:1px solid var(--amber-m);}
.prose a:hover{border-color:var(--amber);}
.table-wrap{overflow-x:auto;border:1px solid var(--border);-webkit-overflow-scrolling:touch;}
.prose table{width:100%;border-collapse:collapse;font-family:'IBM Plex Mono',monospace;font-size:13px;min-width:460px;}
.prose th{text-align:left;padding:10px 12px;font-size:10.5px;letter-spacing:0.14em;text-transform:uppercase;color:var(--dim);background:var(--card);border-bottom:1px solid var(--border);}
.prose td{padding:10px 12px;border-bottom:1px solid var(--border2);color:var(--fog);vertical-align:top;line-height:1.55;}
.prose tr:last-child td{border-bottom:none;}

.callout{background:linear-gradient(135deg,rgba(255,51,0,0.07),rgba(255,51,0,0.02));border:1px solid rgba(255,51,0,0.22);border-left:3px solid var(--amber);padding:20px 22px;margin:30px 0 !important;}
.callout-tag{font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:0.2em;text-transform:uppercase;color:var(--amber);margin-bottom:8px;}
.callout p{font-size:16.5px !important;line-height:1.7 !important;color:var(--bright);}
.callout p + p{margin-top:10px;}

.faq,.sources{margin-top:52px;padding-top:24px;border-top:1px solid var(--border);}
.faq h2,.sources h2,.related h2{font-family:'Rajdhani',sans-serif;font-weight:700;font-size:28px;color:var(--white);margin-bottom:16px;}
.faq details{background:var(--card);border:1px solid var(--border);margin-bottom:8px;}
.faq summary{cursor:pointer;list-style:none;padding:16px 46px 16px 18px;font-family:'Rajdhani',sans-serif;font-weight:700;font-size:19px;line-height:1.3;color:var(--white);position:relative;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:'+';position:absolute;right:18px;top:13px;font-family:'IBM Plex Mono',monospace;font-size:20px;color:var(--amber);}
.faq details[open] summary::after{content:'\2212';}
.faq details p{padding:0 18px 18px;font-size:16.5px;line-height:1.7;color:var(--fog);}
.sources ol{padding-left:22px;}
.sources li{font-size:14.5px;line-height:1.55;padding:4px 0;color:var(--dim);word-break:break-word;}
.sources a{color:var(--fog);text-decoration:none;border-bottom:1px solid var(--border);}
.sources a:hover{color:var(--amber);border-color:var(--amber);}
.related{max-width:1100px;margin:64px auto 0;}

/* footer */
.foot{border-top:1px solid var(--border);padding:40px 16px 56px;max-width:1100px;margin:0 auto;}
.foot-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:26px;margin-bottom:28px;}
.foot-head{font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--amber);margin-bottom:10px;}
.foot-cols a{display:block;color:var(--fog);text-decoration:none;font-size:14.5px;padding:3px 0;}
.foot-cols a:hover{color:var(--white);}
.foot-fine{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--dim);line-height:1.7;}

@media(min-width:768px){
  .top{padding-left:40px;padding-right:40px;}
  .main{padding:30px 40px 90px;}
  .cats{grid-template-columns:1fr 1fr;}
  .cards{grid-template-columns:repeat(2,1fr);}
  .foot{padding-left:40px;padding-right:40px;}
}
@media(min-width:1024px){ .cards{grid-template-columns:repeat(3,1fr);} }

.draft-banner{font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--bg);background:var(--orange,#FF9800);padding:10px 14px;margin-bottom:20px;}
