/* ===================================================
   Codensec — Tools
   Premium tooling presentation built on existing tokens.
   =================================================== */

.tools-hero {
  padding: 150px 0 100px;
  border-bottom: 1px solid var(--line-soft);
}

.tools-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(320px, .8fr);
  gap: 72px;
  align-items: center;
}

.tools-hero h1 {
  font-size: clamp(2.7rem, 6vw, 4.5rem);
  letter-spacing: -.04em;
}

.tools-hero p {
  max-width: 650px;
  color: var(--text-dim);
  font-size: var(--step-1);
  margin-top: 24px;
}

.hero-actions { display:flex; gap:12px; flex-wrap:wrap; margin-top:32px; }

.tools-signal {
  border: 1px solid var(--line);
  background: var(--bg-raised);
  padding: 28px;
  font-family: var(--font-mono);
  box-shadow: 0 20px 60px color-mix(in srgb, var(--bg) 18%, transparent);
}

.signal-top {
  display:flex;
  justify-content:space-between;
  color:var(--text-faint);
  font-size:.72rem;
  letter-spacing:.08em;
  padding-bottom:20px;
  border-bottom:1px solid var(--line);
}

.signal-lines { display:grid; }
.signal-lines span {
  padding:17px 0;
  border-bottom:1px solid var(--line-soft);
  font-size:.82rem;
  color:var(--text-dim);
}
.signal-lines span::before { content:'→'; color:var(--text); margin-right:12px; }
.signal-foot { padding-top:20px; font-size:.68rem; color:var(--text-faint); letter-spacing:.1em; }

.tools-section-head { max-width: 720px; }
.tools-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }

.tool-card {
  display:flex;
  flex-direction:column;
  min-height:440px;
  background:var(--bg-raised);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:28px;
  transition:transform .18s ease,border-color .18s ease,background .18s ease;
}
.tool-card:hover { transform:translateY(-4px); border-color:var(--text-faint); background:var(--bg-inset); }

.tool-card-top,.premium-card-top { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.tool-status,.premium-badge {
  font-family:var(--font-mono);
  font-size:.65rem;
  letter-spacing:.08em;
  color:var(--text-faint);
}
.tool-status::before { content:'●'; color:var(--success); margin-right:7px; }

.tool-icon {
  width:54px;
  height:54px;
  margin:34px 0 22px;
  display:grid;
  place-items:center;
  border:1px solid var(--line);
  background:var(--bg);
  color:var(--text);
  font-family:var(--font-mono);
  font-size:.8rem;
  letter-spacing:.06em;
}

.tool-card h3 { font-size:1.65rem; margin-bottom:12px; }
.tool-card > p { color:var(--text-dim); font-size:.9rem; }
.pill-row { display:flex; gap:7px; flex-wrap:wrap; margin-top:20px; }
.tool-card .tool-link { margin-top:auto; padding-top:28px; font-size:.8rem; font-family:var(--font-mono); border-top:1px solid var(--line-soft); color:var(--text); }
.tool-link span { margin-left:8px; color:var(--text-dim); }
.tool-link:hover { color:var(--text-dim); }

.premium-section { background:linear-gradient(180deg,var(--bg),var(--bg-raised)); }
.premium-grid { display:grid; grid-template-columns:1.25fr 1fr 1fr; gap:16px; align-items:stretch; }

.premium-card {
  min-height:590px;
  display:flex;
  flex-direction:column;
  background:var(--bg-raised);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:28px;
  position:relative;
  overflow:hidden;
}

.premium-card::before {
  content:'';
  position:absolute;
  inset:0 0 auto 0;
  height:1px;
  background:var(--text-faint);
  opacity:.5;
}

.premium-featured { background:var(--bg-inset); }
.premium-featured::before { background:var(--text); opacity:.8; }
.premium-badge { color:var(--text); }

.premium-content { padding-top:50px; }
.eyebrow { color:var(--text-faint); font-family:var(--font-mono); font-size:.68rem; text-transform:uppercase; letter-spacing:.09em; }
.premium-card h3 { font-size:clamp(1.8rem,3vw,2.35rem); margin-top:10px; }
.premium-lead { color:var(--text-dim); margin-top:14px; font-size:.9rem; }

.feature-list { display:grid; grid-template-columns:1fr 1fr; margin-top:30px; border-top:1px solid var(--line); }
.feature-list div { display:grid; grid-template-columns:30px 1fr; gap:8px; padding:15px 10px 15px 0; border-bottom:1px solid var(--line-soft); }
.feature-list div:nth-child(odd) { border-right:1px solid var(--line-soft); padding-right:14px; }
.feature-list span,.custom-points strong { font-family:var(--font-mono); color:var(--text-faint); font-size:.68rem; }
.feature-list p { color:var(--text-dim); font-size:.76rem; line-height:1.45; }

.vault-topics { display:flex; flex-wrap:wrap; gap:8px; margin-top:30px; }
.vault-topics span { border:1px solid var(--line); padding:8px 10px; color:var(--text-dim); font-size:.72rem; background:var(--bg); }

.custom-points { margin-top:30px; border-top:1px solid var(--line); }
.custom-points div { display:flex; justify-content:space-between; gap:20px; padding:17px 0; border-bottom:1px solid var(--line-soft); }
.custom-points span { color:var(--text-dim); font-size:.8rem; }

.premium-footer { margin-top:auto; padding-top:24px; border-top:1px solid var(--line); display:flex; justify-content:space-between; align-items:center; gap:18px; flex-wrap:wrap; }
.premium-footer > span { color:var(--text-faint); font-family:var(--font-mono); font-size:.64rem; }

.tools-note { border-bottom:1px solid var(--line-soft); }
.tools-note-panel { display:grid; grid-template-columns:.8fr 1.2fr; gap:72px; align-items:center; border:1px solid var(--line); padding:40px; background:var(--bg-raised); }
.tools-note-panel h2 { font-size:clamp(1.7rem,3vw,2.5rem); }
.tools-note-panel p { color:var(--text-dim); font-size:.9rem; }

@media(max-width:1050px) {
  .tools-grid { grid-template-columns:1fr 1fr; }
  .premium-grid { grid-template-columns:1fr 1fr; }
  .premium-featured { grid-column:1/-1; }
}

@media(max-width:900px) {
  .tools-hero-grid,.tools-note-panel { grid-template-columns:1fr; }
  .tools-hero { padding-top:125px; }
  .tools-grid { grid-template-columns:1fr; }
  .premium-grid { grid-template-columns:1fr; }
  .premium-featured { grid-column:auto; }
}

@media(max-width:560px) {
  .tools-hero { padding:110px 0 72px; }
  .tools-hero h1 { font-size:2.55rem; }
  .tool-card,.premium-card,.tools-note-panel { padding:22px; }
  .feature-list { grid-template-columns:1fr; }
  .feature-list div:nth-child(odd) { border-right:0; padding-right:0; }
}


/* Shared responsive grid and overflow guardrails */
@media (max-width: 700px) {
  .grid-3,.grid-4,.cards-grid,.services-grid,.tools-grid,.research-grid,.tech-grid,.team-grid,.footer-grid { grid-template-columns: 1fr !important; }
  .hero-grid,.split-grid,.feature-panel,.content-grid,.two-col,.two-column { grid-template-columns: 1fr !important; }
  .card { min-width: 0; }
  table { display: block; width: 100%; overflow-x: auto; }
}
@media (min-width: 701px) and (max-width: 1100px) {
  .grid-3,.grid-4,.cards-grid,.services-grid,.tools-grid,.research-grid,.tech-grid,.team-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
