/* ============================================================
   ProjectPulse — design tokens
   Ink navy console, phosphor-green pulse, amber for trial/price
   ============================================================ */
:root{
  --ink:      #0B1220;
  --slate:    #141C2E;
  --slate-2:  #1B2436;
  --wire:     #2A3550;
  --paper:    #E9EDF3;
  --paper-dim:#9FAAC0;
  --signal:   #35D488;
  --signal-dim: #1E7A54;
  --amber:    #F5A623;
  --red:      #E5544D;

  --display: 'Space Grotesk', system-ui, sans-serif;
  --body: 'Inter', system-ui, sans-serif;
  --mono: 'JetBrains Mono', ui-monospace, Menlo, monospace;

  --radius: 10px;
  --maxw: 1180px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--ink);
  color:var(--paper);
  font-family:var(--body);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;}

h1,h2,h3,h4{font-family:var(--display);font-weight:600;letter-spacing:-0.01em;margin:0 0 .5em;}
h1{font-size:clamp(2.1rem,4.5vw,3.4rem);line-height:1.05;}
h2{font-size:clamp(1.5rem,3vw,2.1rem);}
h3{font-size:1.15rem;}
p{color:var(--paper-dim);margin:0 0 1em;}
.mono{font-family:var(--mono);}
.eyebrow{
  font-family:var(--mono);
  font-size:.72rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--signal);
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.eyebrow::before{
  content:"";
  width:6px;height:6px;border-radius:50%;
  background:var(--signal);
  box-shadow:0 0 0 3px rgba(53,212,136,.18);
}

/* ---------- nav ---------- */
.nav{
  position:sticky;top:0;z-index:40;
  background:rgba(11,18,32,.85);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--wire);
}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:68px;}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--display);font-weight:700;font-size:1.15rem;}
.brand svg{width:22px;height:22px;}
.navlinks{display:flex;gap:28px;align-items:center;font-size:.92rem;color:var(--paper-dim);}
.navlinks a:hover{color:var(--paper);}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:11px 22px;border-radius:8px;
  font-family:var(--mono);font-size:.85rem;font-weight:500;letter-spacing:.02em;
  border:1px solid transparent;cursor:pointer;transition:transform .15s ease, background .15s ease, border-color .15s ease;
}
.btn-primary{background:var(--signal);color:#04150D;}
.btn-primary:hover{transform:translateY(-1px);background:#4EE39B;}
.btn-ghost{border-color:var(--wire);color:var(--paper);}
.btn-ghost:hover{border-color:var(--signal);color:var(--signal);}
.btn-amber{background:var(--amber);color:#231400;}
.btn-amber:hover{transform:translateY(-1px);background:#FFB63F;}
.btn[disabled]{opacity:.45;cursor:not-allowed;transform:none !important;}

/* ---------- hero / pulse signature ---------- */
.hero{padding:88px 0 56px;position:relative;overflow:hidden;}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center;}
@media(max-width:860px){.hero-grid{grid-template-columns:1fr;}}
.pulse-wrap{border:1px solid var(--wire);border-radius:var(--radius);background:var(--slate);padding:18px 18px 8px;}
.pulse-wrap .cap{display:flex;justify-content:space-between;font-family:var(--mono);font-size:.7rem;color:var(--paper-dim);margin-bottom:6px;text-transform:uppercase;letter-spacing:.1em;}
.pulse-line{width:100%;height:auto;display:block;}
.pulse-line path{
  fill:none;stroke:var(--signal);stroke-width:2.2;
  stroke-dasharray:1400;stroke-dashoffset:1400;
  animation:draw 3.4s ease-in-out infinite;
  filter:drop-shadow(0 0 5px rgba(53,212,136,.55));
}
@keyframes draw{
  0%{stroke-dashoffset:1400;}
  55%{stroke-dashoffset:0;}
  100%{stroke-dashoffset:-40;}
}
@media (prefers-reduced-motion: reduce){
  .pulse-line path{animation:none;stroke-dashoffset:0;}
}

/* section divider using pulse motif, thin */
.divider{height:34px;overflow:hidden;opacity:.55;margin:8px 0 28px;}
.divider svg{width:100%;height:100%;}
.divider path{fill:none;stroke:var(--wire);stroke-width:1.4;}

section{padding:40px 0;}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:28px;flex-wrap:wrap;}
.section-head p{margin:0;max-width:520px;}

/* ---------- tiles ---------- */
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
@media(max-width:960px){.tiles{grid-template-columns:repeat(2,1fr);}}
@media(max-width:640px){.tiles{grid-template-columns:1fr;}}

.tile{
  border:1px solid var(--wire);
  background:var(--slate);
  border-radius:var(--radius);
  padding:22px;
  display:flex;flex-direction:column;gap:12px;
  position:relative;
  transition:border-color .18s ease, transform .18s ease;
}
.tile:hover{border-color:var(--signal-dim);transform:translateY(-2px);}
.tile-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;}
.tag{
  font-family:var(--mono);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;
  padding:4px 8px;border-radius:5px;border:1px solid var(--wire);color:var(--paper-dim);
}
.tag.sre{color:#7FE3C0;border-color:var(--signal-dim);}
.tag.py{color:#8FC1F5;border-color:#254A6E;}
.tag.util{color:#F5C97F;border-color:#6E5525;}
.duration{font-family:var(--mono);font-size:.72rem;color:var(--paper-dim);}
.tile h3{margin-bottom:2px;}
.tile p{font-size:.9rem;margin-bottom:4px;flex-grow:1;}
.tile-foot{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding-top:10px;border-top:1px solid var(--wire);}
.price-tag{font-family:var(--mono);font-size:.85rem;color:var(--amber);}
.lock{
  position:absolute;top:16px;right:16px;
  width:26px;height:26px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:var(--ink);border:1px solid var(--wire);
  font-size:.75rem;
}
.tile.locked{opacity:.6;}
.tile-link{font-family:var(--mono);font-size:.8rem;color:var(--signal);display:inline-flex;gap:6px;align-items:center;}

/* ---------- trial banner ---------- */
.trial-banner{
  border:1px solid var(--signal-dim);
  background:linear-gradient(90deg, rgba(53,212,136,.10), rgba(53,212,136,.02));
  border-radius:var(--radius);
  padding:16px 20px;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  flex-wrap:wrap;
  margin-bottom:8px;
}
.trial-banner.expired{border-color:var(--red);background:linear-gradient(90deg, rgba(229,84,77,.12), rgba(229,84,77,.02));}
.trial-banner .msg{font-family:var(--mono);font-size:.85rem;}
.trial-banner.expired .msg{color:#FFB0AC;}
.trial-banner:not(.expired) .msg{color:#9FF0CD;}

/* ---------- forms ---------- */
.form-card{
  max-width:560px;margin:0 auto;
  border:1px solid var(--wire);background:var(--slate);
  border-radius:var(--radius);padding:32px;
}
label{display:block;font-family:var(--mono);font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;color:var(--paper-dim);margin-bottom:6px;}
.field{margin-bottom:18px;}
input,select,textarea{
  width:100%;padding:12px 14px;border-radius:8px;
  border:1px solid var(--wire);background:var(--ink);color:var(--paper);
  font-family:var(--body);font-size:.95rem;
}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--signal);}
.error-text{color:var(--red);font-size:.78rem;font-family:var(--mono);margin-top:6px;display:none;}
.field.invalid input, .field.invalid select{border-color:var(--red);}
.field.invalid .error-text{display:block;}
.form-note{font-size:.82rem;color:var(--paper-dim);margin-top:6px;}
.success-box{
  border:1px solid var(--signal-dim);background:rgba(53,212,136,.08);
  border-radius:var(--radius);padding:24px;text-align:center;
}

/* ---------- pricing table ---------- */
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
@media(max-width:900px){.price-grid{grid-template-columns:1fr;}}
.price-card{border:1px solid var(--wire);background:var(--slate);border-radius:var(--radius);padding:24px;display:flex;flex-direction:column;gap:10px;}
.price-card .amt{font-family:var(--display);font-size:2rem;color:var(--paper);}
.price-card .amt span{font-family:var(--mono);font-size:.85rem;color:var(--paper-dim);}
.price-card ul{padding-left:18px;margin:0 0 12px;color:var(--paper-dim);font-size:.88rem;}
.price-card li{margin-bottom:6px;}

footer{border-top:1px solid var(--wire);padding:36px 0;margin-top:40px;}
footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:.82rem;color:var(--paper-dim);}
.badge-count{font-family:var(--mono);color:var(--signal);}
