/* ═══════════════════════════════════════════════════════════
   HIGH CRITERIA INC. — Shared site design system
   Shares type/palette language with the Kind Cut NFT site
   (Fraunces + DM Sans) but in a professional, non-fiction key.
   ════════════════════════════════════════════════════════ */
:root {
  --paper:     #0f0f0d;
  --paper-2:   #16150f;
  --panel:     #1b1a14;
  --panel-2:   #22201a;
  --ink:       #f1ece0;
  --ink-dim:   #b9b1a0;
  --ink-faint: #74695a;
  --rule:      rgba(241,236,224,0.14);
  --rule-soft: rgba(241,236,224,0.07);

  --gold:        #c99a4a;
  --gold-bright: #e2b768;
  --gold-d:      rgba(201,154,74,0.14);
  --moss:        #7a9468;
  --moss-d:      rgba(122,148,104,0.14);
  --clay:        #a85c40;
  --clay-d:      rgba(168,92,64,0.14);

  --radius: 4px;
  --nav-h: 64px;
  --F-display: "Fraunces", serif;
  --F-body:    "DM Sans", sans-serif;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:var(--F-body);font-weight:400;font-size:16px;
  color:var(--ink);background:var(--paper);min-height:100vh;
  overflow-x:hidden;position:relative;
}
body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(ellipse 900px 500px at 12% -10%, rgba(201,154,74,.12), transparent 60%),
    radial-gradient(ellipse 700px 500px at 92% 5%, rgba(122,148,104,.08), transparent 60%);
}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
* { position:relative; z-index:1 }
p{line-height:1.75;color:var(--ink-dim)}
strong{color:var(--ink);font-weight:600}

.wrap{width:min(1080px,100vw - 3rem);margin-inline:auto}
.label{
  font-family:var(--F-body);font-size:.7rem;font-weight:700;
  letter-spacing:.22em;text-transform:uppercase;color:var(--gold-bright);
  margin-bottom:.75rem;display:block;
}
.display-heading{
  font-family:var(--F-display);font-weight:600;
  font-size:clamp(2.2rem,4.2vw,3.6rem);line-height:1.08;
  letter-spacing:-.01em;color:var(--ink);
}
h2.section-heading{
  font-family:var(--F-display);font-weight:600;
  font-size:clamp(1.6rem,2.6vw,2.2rem);color:var(--ink);margin-bottom:1rem;
}

/* ── Nav ───────────────────────────────────────────────── */
.nav{
  position:sticky;top:0;z-index:50;height:var(--nav-h);
  display:flex;align-items:center;justify-content:space-between;
  padding:0 clamp(1.25rem,3vw,2.5rem);
  background:rgba(15,15,13,0.86);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--rule);
}
.nav-logo{display:flex;align-items:center;gap:.6rem;font-family:var(--F-display);font-weight:600;font-size:1.05rem}
.nav-logo-img{width:32px;height:32px;border-radius:50%;object-fit:cover}
.nav-center{display:flex;gap:2rem}
.nav-center a{font-size:.9rem;color:var(--ink-dim);transition:color .15s}
.nav-center a:hover,.nav-center a.active{color:var(--gold-bright)}
.nav-right a{font-size:.85rem;color:var(--ink-dim)}
@media (max-width:720px){ .nav-center{display:none} }

/* ── Buttons ───────────────────────────────────────────── */
.btn-primary{
  display:inline-flex;align-items:center;gap:.5rem;
  background:var(--gold);color:#1a1408;font-weight:700;font-size:.9rem;
  padding:.85rem 1.5rem;border-radius:var(--radius);transition:background .15s,transform .15s;
}
.btn-primary:hover{background:var(--gold-bright);transform:translateY(-1px)}
.btn-ghost{
  display:inline-flex;align-items:center;gap:.5rem;
  border:1px solid var(--rule);color:var(--ink);font-weight:600;font-size:.9rem;
  padding:.8rem 1.4rem;border-radius:var(--radius);transition:border-color .15s,background .15s;
}
.btn-ghost:hover{border-color:var(--gold);background:var(--gold-d)}

/* ── Hero ──────────────────────────────────────────────── */
.hero{padding:clamp(3rem,8vw,6rem) 0 clamp(2.5rem,6vw,4rem)}
.hero .wrap{display:flex;flex-direction:column;gap:1.5rem;max-width:760px}
.hero-desc{font-size:1.05rem;max-width:640px}
.hero-actions{display:flex;gap:1rem;flex-wrap:wrap;margin-top:.5rem}

/* ── Cards ─────────────────────────────────────────────── */
.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.5rem;margin-top:2rem}
.card{
  background:var(--panel);border:1px solid var(--rule);border-radius:var(--radius);
  padding:1.75rem;display:flex;flex-direction:column;gap:.9rem;
  transition:border-color .15s,transform .15s;
}
.card:hover{border-color:var(--gold);transform:translateY(-2px)}
.card-icon{width:40px;height:40px;border-radius:50%;background:var(--gold-d);display:flex;align-items:center;justify-content:center;color:var(--gold-bright);font-size:1.2rem}
.card h3{font-family:var(--F-display);font-size:1.3rem;color:var(--ink)}
.card p{font-size:.92rem;flex:1}
.card .btn-ghost,.card .btn-primary{align-self:flex-start;margin-top:.25rem}

/* ── Section ───────────────────────────────────────────── */
.section{padding:clamp(2.5rem,6vw,4.5rem) 0;border-top:1px solid var(--rule-soft)}
.two-col{display:grid;grid-template-columns:1.1fr 0.9fr;gap:3rem;align-items:center}
@media (max-width:820px){ .two-col{grid-template-columns:1fr} }
.rounded-img{border-radius:var(--radius);border:1px solid var(--rule);overflow:hidden}

/* ── Footer ────────────────────────────────────────────── */
footer{border-top:1px solid var(--rule);padding:2.5rem 0;margin-top:2rem}
footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;font-size:.85rem;color:var(--ink-faint)}
footer a{color:var(--ink-dim)}
footer a:hover{color:var(--gold-bright)}

/* ── CV page ───────────────────────────────────────────── */
.cv-header{text-align:center;padding-bottom:1.5rem;border-bottom:1px solid var(--rule);margin-bottom:2rem}
.cv-header h1{font-family:var(--F-display);font-size:clamp(1.8rem,3vw,2.4rem)}
.cv-header .contact{font-size:.88rem;color:var(--ink-dim);margin-top:.5rem}
.cv-header .contact a{color:var(--gold-bright)}
.cv-section{margin-bottom:2.25rem}
.cv-section h2{
  font-family:var(--F-display);font-size:1.15rem;color:var(--gold-bright);
  text-transform:uppercase;letter-spacing:.08em;font-weight:600;
  border-bottom:1px solid var(--rule);padding-bottom:.5rem;margin-bottom:1rem;
}
.cv-entry{display:grid;grid-template-columns:1fr auto;gap:1rem;margin-bottom:1.1rem}
.cv-entry .role{font-weight:700;color:var(--ink)}
.cv-entry .org{color:var(--ink-dim);font-size:.92rem}
.cv-entry .dates{color:var(--ink-faint);font-size:.85rem;white-space:nowrap;text-align:right}
.cv-entry .desc{grid-column:1/-1;font-size:.92rem;color:var(--ink-dim);margin-top:.25rem}
.cv-list{list-style:none}
.cv-list li{display:flex;justify-content:space-between;gap:1rem;padding:.35rem 0;border-bottom:1px dashed var(--rule-soft);font-size:.92rem}
.cv-list li span:last-child{color:var(--ink-faint);white-space:nowrap}
.pub{font-size:.88rem;color:var(--ink-dim);margin-bottom:1rem;padding-left:1rem;border-left:2px solid var(--rule)}
.pub strong{color:var(--ink)}
.pub a{color:var(--gold-bright)}
.cv-download{display:flex;justify-content:center;margin:2rem 0}

/* ── Podcast page ──────────────────────────────────────── */
.podcast-hero{display:flex;gap:2.5rem;align-items:center;flex-wrap:wrap}
.podcast-cover{width:260px;height:260px;border-radius:var(--radius);overflow:hidden;border:1px solid var(--rule);flex-shrink:0}
.podcast-cover img{width:100%;height:100%;object-fit:cover}
.podcast-info{flex:1;min-width:280px}
.episode-list{margin-top:1rem}
.episode-list li{padding:.9rem 0;border-bottom:1px solid var(--rule-soft);font-size:.92rem;color:var(--ink-dim)}

/* ── NFT landing ───────────────────────────────────────── */
.collection-card{position:relative;overflow:hidden;padding:0;border-radius:var(--radius)}
.collection-card img{width:100%;height:220px;object-fit:cover}
.collection-card .cc-body{padding:1.5rem}
.tag{display:inline-block;font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-bright);background:var(--gold-d);padding:.25rem .6rem;border-radius:2px;margin-bottom:.6rem}
