:root{ --ink:#14140F; --chartreuse:#C6E135; --paper:#F7F7F2; --stone:#8B8B7D; --stonelight:#D8D8CC; }
html{scroll-behavior:smooth;}
body{background:var(--paper); color:var(--ink);}
::selection{background:var(--chartreuse); color:var(--ink);}
:focus-visible{outline:2px solid var(--chartreuse); outline-offset:3px;}

.eyebrow{ font-family:'Space Grotesk',sans-serif; font-weight:600; letter-spacing:.12em; text-transform:uppercase; font-size:.72rem; color:var(--stone); }
.btn-primary{ background:var(--chartreuse); color:var(--ink); font-weight:700; font-size:.9rem; padding:.9rem 1.6rem; border-radius:3px; transition:transform .15s ease; display:inline-block; border:none; cursor:pointer; }
.btn-primary:hover{ transform:translateY(-1px); }
.btn-secondary{ border:1.5px solid var(--ink); color:var(--ink); font-weight:600; font-size:.9rem; padding:.85rem 1.55rem; border-radius:3px; transition:background .15s ease; display:inline-block; }
.btn-secondary:hover{ background:rgba(20,20,15,.06); }

.card{ border:1px solid var(--stonelight); border-radius:4px; background:#fff; transition:border-color .15s ease, transform .15s ease; }
.card:hover{ border-color:var(--ink); transform:translateY(-2px); }

input, select{ background:#fff; border:1.5px solid var(--stone); border-radius:3px; padding:.85rem 1rem; font-family:'Inter',sans-serif; font-size:1rem; width:100%; }
input:focus{ border-color:var(--ink); }

.page-hero{ background:var(--ink); color:var(--paper); padding:3.5rem 0; }
nav a.active{ color:var(--ink); border-bottom:2px solid var(--chartreuse); padding-bottom:2px; }

.draw{ stroke-dasharray:900; stroke-dashoffset:900; animation:draw 1.8s ease forwards; }
.d1{animation-delay:.1s} .d2{animation-delay:.4s}
.node{ opacity:0; transform:scale(0); animation:nodeIn .4s cubic-bezier(.34,1.56,.64,1) forwards; }
.n1{animation-delay:1.6s} .n2{animation-delay:1.8s} .n3{animation-delay:2s} .n4{animation-delay:2.2s} .n5{animation-delay:2.4s}
.pulse{ animation:pulse 2.4s ease-in-out infinite; animation-delay:2.6s; }
@keyframes draw{ to{ stroke-dashoffset:0; } }
@keyframes nodeIn{ to{ opacity:1; transform:scale(1); } }
@keyframes pulse{ 0%,100%{ opacity:.5; transform:scale(1); } 50%{ opacity:1; transform:scale(1.15); } }
@media (prefers-reduced-motion: reduce){
  .draw{animation:none; stroke-dashoffset:0;}
  .node{animation:none; opacity:1; transform:scale(1);}
  .pulse{animation:none; opacity:.8;}
}

.zip-result{ display:none; }
.zip-result.show{ display:block; }
