*{box-sizing:border-box}html{font-family:Inter,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:#172033;background:#f6f8fb}body{margin:0}a{color:inherit}.hero{min-height:390px;display:grid;grid-template-columns:1.05fr .95fr;background:linear-gradient(115deg,#071d43,#0b2d63 58%,#145aa6);color:#fff;overflow:hidden}.hero-copy{padding:64px clamp(28px,6vw,92px);align-self:center}.eyebrow{text-transform:uppercase;letter-spacing:.13em;font-size:.75rem;font-weight:700;color:#9fdde6}.hero h1{font-size:clamp(2.5rem,5vw,5rem);line-height:.95;margin:14px 0 20px;letter-spacing:-.04em}.hero p{font-size:1.18rem;line-height:1.55;max-width:680px;color:#e5efff}.hero-visual{position:relative;min-height:390px}.hero-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0b2d63 0%,transparent 32%)}.hero-visual img{width:100%;height:100%;object-fit:cover;display:block}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}.button{padding:11px 17px;border-radius:9px;text-decoration:none;font-weight:650}.primary{background:#ff8a25;color:#101828}.secondary{border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.08)}main{max-width:1500px;margin:0 auto;padding:42px clamp(20px,4vw,60px) 56px}.intro h2{font-size:2rem;color:#0b2d63;margin:0 0 8px}.intro p{color:#667085;margin:0 0 28px}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.project-card{display:grid;grid-template-columns:54px 1fr auto;gap:14px;align-items:start;background:#fff;border:1px solid #dbe3ee;border-radius:14px;padding:20px;text-decoration:none;box-shadow:0 5px 20px rgba(13,45,99,.04);transition:.18s ease}.project-card:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(13,45,99,.10);border-color:#a6bedc}.card-icon img{width:48px;height:48px;object-fit:contain}.card-meta{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;font-weight:750;color:#145aa6}.app .card-meta{color:#c86410}.tests .card-meta{color:#667085}.card-body h3{font-size:1.02rem;margin:5px 0 7px;color:#0b2d63;overflow-wrap:anywhere}.card-body p{font-size:.89rem;line-height:1.45;color:#667085;margin:0}.arrow{font-size:1.3rem;color:#145aa6}.legend{display:flex;gap:22px;flex-wrap:wrap;margin-top:26px;color:#667085;font-size:.86rem}.dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:6px}.dot.library{background:#145aa6}.dot.app{background:#ff8a25}.dot.tests{background:#98a2b3}footer{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;border-top:1px solid #dbe3ee;background:#fff;padding:20px clamp(20px,4vw,60px);color:#667085;font-size:.85rem}footer a{color:#145aa6;text-decoration:none}@media(max-width:1050px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero{grid-template-columns:1fr}.hero-visual{min-height:250px}.hero-visual:after{background:linear-gradient(180deg,#0b2d63 0%,transparent 35%)}}@media(max-width:680px){.grid{grid-template-columns:1fr}.hero-copy{padding:42px 24px}.hero h1{font-size:2.6rem}.project-card{grid-template-columns:48px 1fr auto}}
/* v2: stable, deliberate card navigation affordance */
.project-card{grid-template-columns:54px 1fr 34px;align-items:center}
.arrow{
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#eef5ff;
  color:#145aa6;
  font-size:1.05rem;
  line-height:1;
  font-weight:800;
  transition:.18s ease;
}
.project-card:hover .arrow{
  background:#145aa6;
  color:#fff;
  transform:translateX(2px);
}

.version-badge{
  display:inline-block;
  margin-top:16px;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.22);
  color:#dbeafe;
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.04em;
}
.adapter .card-meta{color:#087c7c}
.dot.adapter{background:#087c7c}
