/* Bitcoin.ac.pk v1.0 — 2025-09-07
   PK-inspired theme: dark by default, Bitcoin orange accents */
:root{
  --bg:#0e0f12;
  --bg-soft:#15161a;
  --text:#e7e9ee;
  --muted:#9aa3af;
  --accent:#F7931A;
  --card:#121318;
  --border:#22252b;
}
:root.light, body.light{
  --bg:#ffffff;
  --bg-soft:#f7f7f9;
  --text:#0c0d10;
  --muted:#5b6472;
  --accent:#F7931A;
  --card:#ffffff;
  --border:#e8eaee;
}
html,body{height:100%}
*{box-sizing:border-box}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
  color:var(--text);
  background:var(--bg);
}
.page{display:flex;min-height:100%;flex-direction:column}
.content{flex:1 0 auto}
.wrap{max-width:1100px;margin:0 auto;padding:24px}
.nav{position:sticky;top:0;z-index:10;background:var(--bg);backdrop-filter:saturate(150%) blur(8px);border-bottom:1px solid var(--border)}
.nav .nav-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;max-width:1100px;margin:0 auto;padding:12px 16px}
.logo{display:flex;align-items:center;gap:10px;color:var(--text);text-decoration:none;font-weight:700}
.logo img{width:28px;height:28px}
.nav ul{display:flex;list-style:none;margin:0;padding:0;gap:10px}
.nav a{color:var(--text);text-decoration:none;padding:8px 10px;border-radius:10px}
.nav a.active,.nav a:hover{background:var(--bg-soft)}
.nav-toggle{display:none;background:none;border:none;cursor:pointer}
.nav-toggle span{display:block;width:20px;height:2px;background:var(--text);margin:4px 0}
.right-actions{display:flex;gap:8px;align-items:center}
.hero{padding:24px 0;border-bottom:1px solid var(--border)}
.hero-inner{display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:center}
.hero h1{font-size:44px;margin:0 0 10px}
.lead{color:var(--muted);max-width:56ch}
.btc-orb{font-size:120px;background:linear-gradient(145deg,#f9a93f,#F7931A);-webkit-background-clip:text;background-clip:text;color:transparent;text-align:center;filter:drop-shadow(0 10px 20px rgba(247,147,26,.2))}
.grid{display:grid;gap:16px}
.grid.cards{grid-template-columns:repeat(4,1fr)}
.grid.two{grid-template-columns:repeat(2,1fr)}
.card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:16px}
.card-link{text-decoration:none;color:var(--text)}
.card-link h3{margin:0 0 8px}
.section-title{font-size:24px;margin:8px 0 12px}
.footer{border-top:1px solid var(--border);background:var(--bg-soft)}
.footer .wrap{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.price-card .price{font-size:36px;font-weight:700}
.price-row{display:flex;align-items:center;justify-content:space-between;gap:16px}
.chips{display:flex;gap:8px;margin:12px 0}
.chip{border:1px solid var(--border);background:transparent;color:var(--text);padding:6px 10px;border-radius:999px;cursor:pointer}
.chip-active,.chip:hover{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
.btn{display:inline-block;background:var(--accent);color:#1a1a1a;border:none;padding:10px 14px;border-radius:12px;font-weight:700;text-decoration:none}
.btn:hover{filter:brightness(1.05)}
.prose p{line-height:1.65}
.prose h1,.prose h2,.prose h3{margin-top:0.8em}
.callout{border-left:4px solid var(--accent);padding:10px 12px;border-radius:8px;background:var(--bg-soft);color:var(--text)}
.callout.warning{border-left-color:#f85149}
.callout.info{border-left-color:#3b82f6}
.list .list-item{padding:12px 0;border-bottom:1px dashed var(--border)}
.muted{color:var(--muted)}
.tiny{font-size:12px}
/* Responsive */
@media (max-width:960px){
  .hero-inner{grid-template-columns:1fr}
  .grid.cards{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:640px){
  .nav ul{display:none;position:absolute;top:54px;left:0;right:0;background:var(--bg);padding:10px;border-bottom:1px solid var(--border)}
  .nav ul.open{display:flex;flex-direction:column}
  .nav-toggle{display:block}
  .grid.cards{grid-template-columns:1fr}
  .grid.two{grid-template-columns:1fr}
  .hero h1{font-size:32px}
}


/* Themed links */
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
.prose a{text-decoration:underline}
