/* anukistrading.com - site stylesheet. Fonts are self-hosted variable woff2 in /fonts/. */
@font-face { font-family:'Manrope'; src:url("/fonts/manrope-200-800.woff2") format('woff2'); font-weight:200 800; font-display:swap; }
@font-face { font-family:'JetBrains Mono'; src:url("/fonts/jetbrains-mono-100-800.woff2") format('woff2'); font-weight:100 800; font-display:swap; }
@font-face { font-family:'Fraunces'; src:url("/fonts/fraunces-100-900.woff2") format('woff2'); font-weight:100 900; font-display:swap; }

:root{
  --bg-base:#171b22; --bg-surface:#1d222b; --bg-elevated:#242b37; --bg-inset:#11151b;
  --fg-primary:#eef1f5; --fg-secondary:#aeb8c6; --fg-muted:#7d8799; --fg-faint:#566173;
  --line-default:#2c333f; --line-strong:#3a4351; --line-accent:#305f67;
  --accent:#2fd4c6; --accent-soft:rgba(47,212,198,0.16); --accent-dim:rgba(47,212,198,0.34);
  --ok:#34d399;
  --font-sans:'Manrope',ui-sans-serif,system-ui,sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,monospace;
  --font-display:'Fraunces',Georgia,serif;
  --ease-out:cubic-bezier(0.23,1,0.32,1);
  color-scheme:dark;
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  min-height:100vh;
  background-color:var(--bg-base);
  background-image:
    radial-gradient(110% 70% at 15% -10%, rgba(47,212,198,0.07), transparent 55%),
    radial-gradient(90% 60% at 100% 0%, rgba(120,130,150,0.045), transparent 50%);
  color:var(--fg-primary);
  font-family:var(--font-sans);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  font-feature-settings:'ss01','cv11';
  position:relative;
  overflow-x:hidden;
}
/* film grain */
body::before{
  content:'';position:fixed;inset:0;z-index:0;pointer-events:none;opacity:0.025;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
/* faint dot-grid plane */
body::after{
  content:'';position:fixed;inset:0;z-index:0;pointer-events:none;opacity:0.5;
  background-image:radial-gradient(circle at 1px 1px, rgba(255,255,255,0.025) 1px, transparent 0);
  background-size:34px 34px;
  -webkit-mask-image:radial-gradient(120% 90% at 50% 0%, #000 25%, transparent 75%);
  mask-image:radial-gradient(120% 90% at 50% 0%, #000 25%, transparent 75%);
}
.wrap{position:relative;z-index:1;max-width:1080px;margin:0 auto;padding:0 28px;}

.eyebrow{font-family:var(--font-mono);font-size:0.6875rem;letter-spacing:0.24em;text-transform:uppercase;color:var(--fg-muted);font-weight:600;}

/* ---------- header ---------- */
header.site{
  position:sticky;top:0;z-index:30;
  backdrop-filter:blur(10px);
  background:rgba(23,27,34,0.62);
  border-bottom:1px solid var(--line-default);
}
.site-inner{display:flex;align-items:center;justify-content:space-between;height:64px;}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--fg-primary);}
.glyph{
  display:grid;place-items:center;height:32px;width:32px;border-radius:5px;
  border:1px solid var(--line-accent);background:var(--accent-soft);
  box-shadow:0 0 0 1px rgba(47,212,198,0.05), 0 0 18px -5px var(--accent-soft);
}
.glyph span{font-family:var(--font-display);font-size:18px;line-height:1;color:var(--accent);}
.brand .name{font-family:var(--font-display);font-size:16px;letter-spacing:0.01em;color:var(--fg-primary);}
.brand .name b{font-weight:500;}
.status-pill{
  display:inline-flex;align-items:center;gap:8px;
  border:1px solid var(--line-default);background:var(--bg-inset);
  border-radius:999px;padding:6px 13px;
  font-family:var(--font-mono);font-size:0.6875rem;color:var(--fg-secondary);letter-spacing:0.03em;
}
.dot{height:6px;width:6px;border-radius:999px;background:var(--accent);box-shadow:0 0 9px -1px var(--accent);}
@media (prefers-reduced-motion: no-preference){ .dot.live{animation:breathe 2.6s var(--ease-out) infinite;} }
@keyframes breathe{0%,100%{opacity:1;}50%{opacity:0.35;}}

/* ---------- hero ---------- */
.hero{padding:clamp(70px,13vh,150px) 0 clamp(40px,7vh,80px);position:relative;}
.hero .eyebrow{margin-bottom:26px;}
.hero h1{
  font-family:var(--font-display);
  font-weight:340;
  font-size:clamp(2.9rem,8.5vw,6.6rem);
  line-height:0.98;
  letter-spacing:-0.025em;
  color:var(--fg-primary);
  max-width:14ch;
}
.hero h1 .quiet{font-style:italic;color:var(--accent);position:relative;white-space:nowrap;}
.hero h1 .quiet::after{
  content:'';position:absolute;left:0;right:0;bottom:0.1em;height:2px;
  background:linear-gradient(90deg,var(--accent),transparent);opacity:0.6;
}
.hero p.lead{
  margin-top:30px;max-width:46ch;
  font-size:clamp(1.05rem,1.9vw,1.4rem);
  line-height:1.55;color:var(--fg-secondary);font-weight:300;
}
.hero .meta{margin-top:34px;display:flex;align-items:center;gap:16px;flex-wrap:wrap;}
.meta-chip{display:inline-flex;align-items:center;gap:9px;font-family:var(--font-mono);font-size:0.75rem;color:var(--fg-muted);}
.meta-sep{width:1px;height:14px;background:var(--line-strong);}

/* oscilloscope band */
.scope{margin-top:clamp(48px,8vh,86px);position:relative;border-top:1px solid var(--line-default);border-bottom:1px solid var(--line-default);background:linear-gradient(180deg,rgba(255,255,255,0.012),transparent);}
.scope-inner{position:relative;height:148px;overflow:hidden;}
.scope canvas{display:block;width:100%;height:100%;}
.scope .scale{position:absolute;top:10px;left:0;display:flex;gap:0;}
.scope .ticks{position:absolute;inset:0;pointer-events:none;display:flex;justify-content:space-between;padding:0 0;}
.scope .ticks span{width:1px;background:var(--line-default);opacity:0.6;}
.scope-label{position:absolute;top:9px;left:2px;font-family:var(--font-mono);font-size:0.625rem;letter-spacing:0.16em;text-transform:uppercase;color:var(--fg-faint);}
.scope-label.r{left:auto;right:2px;color:var(--accent);opacity:0.7;}

/* ---------- principles ---------- */
.principles{padding:clamp(64px,11vh,120px) 0;}
.sec-head{display:flex;align-items:baseline;gap:14px;margin-bottom:44px;}
.sec-head .num{font-family:var(--font-mono);font-size:0.75rem;color:var(--accent);}
.sec-head h2{font-family:var(--font-display);font-weight:380;font-size:clamp(1.5rem,3vw,2.1rem);letter-spacing:-0.01em;color:var(--fg-primary);}
.grid3{display:grid;grid-template-columns:1fr;gap:1px;background:var(--line-default);border:1px solid var(--line-default);border-radius:8px;overflow:hidden;}
@media(min-width:760px){.grid3{grid-template-columns:repeat(3,1fr);}}
.cell{
  background:linear-gradient(180deg,rgba(255,255,255,0.014),transparent 130px),var(--bg-surface);
  padding:30px 26px 34px;position:relative;min-height:230px;display:flex;flex-direction:column;
}
.cell .idx{font-family:var(--font-mono);font-size:0.625rem;letter-spacing:0.16em;color:var(--fg-faint);}
.cell h3{font-family:var(--font-display);font-weight:420;font-size:1.32rem;margin-top:18px;color:var(--fg-primary);letter-spacing:-0.01em;}
.cell .rule{height:1px;width:36px;background:var(--accent);opacity:0.55;margin:16px 0;}
.cell p{font-size:0.95rem;line-height:1.62;color:var(--fg-muted);font-weight:300;}

/* ---------- statement strip ---------- */
.statement{border-top:1px solid var(--line-default);padding:clamp(56px,9vh,96px) 0;}
.statement p{font-family:var(--font-display);font-weight:300;font-size:clamp(1.35rem,3.4vw,2.4rem);line-height:1.32;letter-spacing:-0.015em;color:var(--fg-secondary);max-width:24ch;}
.statement p em{font-style:italic;color:var(--fg-primary);}

/* ---------- architecture ---------- */
.arch{border-top:1px solid var(--line-default);padding:clamp(64px,11vh,120px) 0;}
.arch .prose{max-width:64ch;display:flex;flex-direction:column;gap:20px;}
.arch .prose p{font-size:clamp(1rem,1.5vw,1.12rem);line-height:1.7;color:var(--fg-secondary);font-weight:300;}
.arch .prose strong{color:var(--fg-primary);font-weight:500;}

/* ---------- footer ---------- */
footer.site{border-top:1px solid var(--line-default);background:rgba(7,8,10,0.5);}
.foot-inner{padding:40px 0 48px;display:flex;flex-wrap:wrap;gap:28px;justify-content:space-between;align-items:flex-end;}
.foot-brand{display:flex;align-items:center;gap:11px;}
.foot-status{display:flex;flex-direction:column;gap:8px;}
.foot-status .row{display:inline-flex;align-items:center;gap:9px;font-family:var(--font-mono);font-size:0.6875rem;color:var(--fg-muted);letter-spacing:0.04em;}
.foot-legal{font-family:var(--font-mono);font-size:0.6875rem;color:var(--fg-faint);letter-spacing:0.03em;text-align:right;line-height:1.9;}
.foot-legal a{color:var(--fg-muted);text-decoration:none;border-bottom:1px solid var(--line-strong);transition:color 160ms var(--ease-out),border-color 160ms var(--ease-out);}
.foot-legal a:hover{color:var(--accent);border-color:var(--accent-dim);}

/* entrance, transform-only so static capture / reduced-motion stays visible */
@media (prefers-reduced-motion: no-preference){
  .reveal{animation:rise 0.7s var(--ease-out) both;}
  .d1{animation-delay:0.05s;} .d2{animation-delay:0.13s;} .d3{animation-delay:0.21s;} .d4{animation-delay:0.29s;}
}
@keyframes rise{from{transform:translateY(16px);}to{transform:translateY(0);}}