:root{
  --burgundy:#6f1d2b;
  --burgundy-dark:#4f1220;
  --cream:#faf7f2;
  --ink:#1f2937;
  --line:#d7d0c6;
  --card:#fff;
  --soft:#ece7df;
  --shadow:0 8px 24px rgba(17,24,39,.08);
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family:Arial,Helvetica,sans-serif;
  color:var(--ink);
  background:linear-gradient(180deg,#f4eee7 0%,#fbfaf8 100%);
  min-height:100vh;
}
.wrap{max-width:1180px;margin:0 auto;padding:16px}
.hero{
  background:var(--burgundy);
  color:#fff;
  border-radius:20px;
  padding:22px;
  box-shadow:var(--shadow);
  margin-bottom:16px;
}
.hero-top{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.hero h1{margin:7px 0 6px;font-size:1.9rem}
.hero p{margin:0;opacity:.95}
.badge{
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  padding:6px 10px;
  font-size:.8rem;
  font-weight:700;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.18);
}
.vendor-logo-wrap{
  width:190px;
  min-height:82px;
  padding:9px 13px;
  border-radius:14px;
  background:rgba(255,255,255,.97);
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 4px 16px rgba(0,0,0,.10);
}
.vendor-logo{max-width:100%;max-height:68px;object-fit:contain}
.panel{
  background:#fff;
  border:1px solid var(--line);
  border-radius:20px;
  padding:18px;
  box-shadow:var(--shadow);
}
.intro{margin-bottom:16px}
.intro h2,.info h3{margin:0 0 6px;color:var(--burgundy-dark)}
.intro p,.info p{margin:0;color:#5b6470}
.tool-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
  margin-bottom:16px;
}
.tool-card{
  display:flex;
  gap:16px;
  min-height:210px;
  padding:22px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:20px;
  box-shadow:var(--shadow);
  color:var(--ink);
  text-decoration:none;
  transition:transform .14s ease,box-shadow .14s ease,border-color .14s ease;
}
.tool-card:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 28px rgba(17,24,39,.12);
  border-color:#bca9aa;
}
.icon{
  flex:0 0 54px;
  width:54px;
  height:54px;
  border-radius:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#f1e8e9;
  color:var(--burgundy);
  font-size:1.8rem;
  font-weight:900;
}
.tool-copy{display:flex;flex-direction:column}
.tool-copy h2{margin:2px 0 8px;color:var(--burgundy-dark);font-size:1.35rem}
.tool-copy p{margin:0;color:#505966;line-height:1.55;flex:1}
.open-link{margin-top:18px;color:var(--burgundy);font-weight:800}
.not-configured{opacity:.82}
.info{border-left:5px solid var(--burgundy)}
@media(max-width:720px){
  .tool-grid{grid-template-columns:1fr}
  .hero h1{font-size:1.5rem}
  .vendor-logo-wrap{width:160px}
  .tool-card{min-height:180px}
}