:root {
  --blue: #0a2540;
  --blue-2: #2e3aa0;
  --blue-3: #3848c4;
  --green: #4ec53a;
  --green-soft: #dcf5d4;
  --ink: #0a0e1a;
  --paper: #fafaf7;
  --paper-2: #f2f0e8;
  --line: #0a0e1a1a;
  --mute: #5b6271;
  --radius: 14px;
}
html,body{background:var(--paper);color:var(--ink);font-family:'Inter',system-ui,sans-serif;}
.serif{font-family:'Instrument Serif',serif;font-weight:400;letter-spacing:-0.01em;}
.mono{font-family:'JetBrains Mono',ui-monospace,monospace;}
.hair{border-color:var(--line);}
.chip{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;background:#fff;border:1px solid var(--line);font-size:11px;letter-spacing:0.02em;white-space:nowrap;}
@media(min-width:768px){.chip{gap:8px;padding:6px 12px;font-size:12px;}}
.dot{width:8px;height:8px;border-radius:999px;background:var(--green);box-shadow:0 0 0 4px color-mix(in oklab,var(--green) 22%,transparent);}
.ulink{position:relative;}
.ulink::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;background:currentColor;transform-origin:right;transform:scaleX(1);transition:transform .4s;}
.ulink:hover::after{transform-origin:left;transform:scaleX(0);}
.prod-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:.2s;display:flex;flex-direction:column;}
.prod-card:hover{border-color:var(--ink);transform:translateY(-2px);box-shadow:0 14px 34px -20px rgba(10,14,26,0.25);}
.ph{background:repeating-linear-gradient(135deg,#eef2ff 0 10px,#f7f8fb 10px 20px);color:var(--mute);display:grid;place-items:center;font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.04em;}
.stock-in{color:var(--green);}
.btn-primary{background:var(--ink);color:#fff;border-radius:999px;padding:12px 18px;font-weight:500;display:inline-flex;align-items:center;gap:8px;transition:.2s;font-size:13px;}
.btn-primary:hover{background:var(--blue-2);}
.btn-ghost{border:1px solid var(--ink);color:var(--ink);border-radius:999px;padding:11px 17px;font-weight:500;display:inline-flex;align-items:center;gap:8px;transition:.2s;font-size:13px;}
.btn-ghost:hover{background:var(--ink);color:#fff;}
.sub-chip{padding:7px 12px;border-radius:999px;border:1px solid var(--line);background:#fff;font-size:12px;white-space:nowrap;cursor:pointer;transition:.15s;}
.sub-chip:hover{border-color:var(--ink);}
.sub-chip.active{background:var(--ink);color:#fff;border-color:var(--ink);}
.energy-badge{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;background:var(--green-soft);color:#0a6b17;font-size:10.5px;font-weight:600;border-radius:4px;font-family:'JetBrains Mono',monospace;}
.btu-badge{display:inline-block;padding:2px 7px;background:#eef2ff;color:var(--blue-2);font-size:10.5px;font-weight:600;border-radius:4px;font-family:'JetBrains Mono',monospace;}
.hub-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px;transition:.3s;position:relative;overflow:hidden;display:flex;flex-direction:column;min-height:260px;}
.hub-card:hover{border-color:var(--ink);transform:translateY(-3px);box-shadow:0 20px 50px -20px rgba(10,14,26,0.2);}
.hub-card::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:linear-gradient(90deg,var(--blue-2),var(--green));transform:scaleX(0);transform-origin:left;transition:transform .5s;}
.hub-card:hover::after{transform:scaleX(1);}