.tool-suite-nav {
  --suite-accent: #b85f49;
  --suite-soft: #f3ded6;
  --suite-hover: #fff5f1;
  --suite-border: rgba(128, 91, 77, .19);
  --suite-columns: 5;
  margin: 24px 0 42px;
  padding: 10px;
  border: 1px solid var(--suite-border);
  border-radius: 22px;
  background: rgba(255, 254, 250, .74);
  box-shadow: 0 16px 40px rgba(54, 47, 41, .07);
  backdrop-filter: blur(12px);
}

.tool-suite-nav[data-suite="image"] {
  --suite-accent: #a95f4b;
  --suite-soft: #f2ddd5;
  --suite-hover: #fff5f1;
  --suite-border: rgba(157, 91, 72, .18);
}

.tool-suite-nav[data-suite="text"] {
  --suite-accent: #705da8;
  --suite-soft: #e8e0f5;
  --suite-hover: #f7f3fc;
  --suite-border: rgba(112, 93, 168, .18);
}

.tool-suite-nav[data-suite="developer"] {
  --suite-accent: #3f7285;
  --suite-soft: #dcecef;
  --suite-hover: #f0f7f8;
  --suite-border: rgba(63, 114, 133, .18);
  --suite-columns: 3;
}

.tool-suite-nav[data-suite="date"] {
  --suite-accent: #6c61a9;
  --suite-soft: #e2ddf3;
  --suite-hover: #f2effa;
  --suite-border: rgba(103, 91, 151, .19);
  --suite-columns: 4;
}

.tool-suite-nav[data-suite="qr"] {
  --suite-accent: #527aa5;
  --suite-soft: #dbe8f3;
  --suite-hover: #eef4f9;
  --suite-border: rgba(84, 101, 118, .19);
  --suite-columns: 5;
}

.tool-suite-nav[data-suite="pdf"] {
  --suite-accent: #b85f49;
  --suite-soft: #f0d9d1;
  --suite-hover: #fff5f1;
  --suite-border: rgba(163, 91, 73, .18);
  --suite-columns: 4;
}

.suite-nav-links {
  display: grid;
  grid-template-columns: repeat(var(--suite-columns), minmax(0, 1fr));
  gap: 9px;
}

.suite-nav-toggle { display: none; }

.tool-suite-nav a {
  min-width: 0;
  min-height: 88px;
  display: grid;
  grid-template-columns: 43px minmax(0, 1fr) auto;
  align-items: center;
  gap: 11px;
  border: 1px solid transparent;
  border-radius: 16px;
  padding: 13px 12px;
  color: #514d47;
  text-decoration: none;
  transition: border-color .18s, background .18s, color .18s, transform .18s, box-shadow .18s;
}

.tool-suite-nav a:hover {
  border-color: var(--suite-border);
  color: var(--suite-accent);
  background: var(--suite-hover);
  transform: translateY(-1px);
}

.tool-suite-nav a.active {
  border-color: #292725;
  color: #fff;
  background: #292725;
  box-shadow: 0 10px 24px rgba(41, 39, 37, .16);
}

.tool-suite-nav b {
  width: 43px;
  height: 43px;
  display: grid;
  place-items: center;
  border-radius: 13px;
  color: var(--suite-accent);
  background: var(--suite-soft);
  font: 850 10px/1 Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  letter-spacing: -.02em;
}

.tool-suite-nav a.active b {
  color: #fff;
  background: var(--suite-accent);
}

.tool-suite-nav span {
  min-width: 0;
  display: grid;
  gap: 5px;
}

.tool-suite-nav strong,
.tool-suite-nav small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tool-suite-nav strong {
  font-size: 13px;
  letter-spacing: -.02em;
}

.tool-suite-nav small {
  color: #8e877e;
  font-size: 9px;
  font-weight: 650;
  line-height: 1.35;
}

.tool-suite-nav a.active small { color: #bdb8b0; }
.tool-suite-nav i { color: #ff7253; font-size: 15px; font-style: normal; }
.tool-suite-nav a.active i { color: #ff9c82; }

@media (max-width: 1030px) {
  .tool-suite-nav,
  .tool-suite-nav[data-suite="pdf"] { --suite-columns: 3; }
  .tool-suite-nav a { min-height: 82px; }
}

@media (max-width: 700px) {
  .tool-suite-nav {
    margin: 18px 0 30px;
    padding: 7px;
    border-radius: 18px;
  }

  .suite-nav-links { grid-template-columns: 1fr; }

  .tool-suite-nav a {
    min-height: 72px;
    padding: 10px 11px;
  }

  .tool-suite-nav.suite-nav-ready .suite-nav-toggle {
    width: 100%;
    min-height: 74px;
    display: grid;
    grid-template-columns: 43px minmax(0, 1fr) auto;
    align-items: center;
    gap: 11px;
    border: 0;
    border-radius: 14px;
    padding: 10px 11px;
    color: #fff;
    background: #292725;
    box-shadow: 0 10px 24px rgba(41, 39, 37, .15);
    text-align: left;
    cursor: pointer;
  }

  .tool-suite-nav.suite-nav-ready .suite-nav-toggle b {
    color: #fff;
    background: var(--suite-accent);
  }

  .tool-suite-nav.suite-nav-ready .suite-nav-toggle small {
    color: #bdb8b0;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
  }

  .tool-suite-nav.suite-nav-ready .suite-nav-toggle i {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #ff9c82;
    font-size: 14px;
  }

  .tool-suite-nav.suite-nav-ready .suite-nav-toggle em {
    color: #f2eee9;
    font-size: 9px;
    font-style: normal;
    font-weight: 750;
    white-space: nowrap;
  }

  .tool-suite-nav.suite-nav-ready .suite-nav-toggle i::after {
    content: "⌄";
    transition: transform .18s;
  }

  .tool-suite-nav.suite-nav-ready .suite-nav-links { display: none; }

  .tool-suite-nav.suite-nav-ready.is-open .suite-nav-links {
    display: grid;
    margin-top: 7px;
  }

  .tool-suite-nav.suite-nav-ready.is-open .suite-nav-toggle i::after {
    transform: rotate(180deg);
  }
}