.product-hero{padding:5rem 0;background:linear-gradient(145deg,#f8fbff,#eef9f3)}.product-hero h1{max-width:800px;margin:.7rem 0 1rem;color:var(--navy);font-size:clamp(2.7rem,6vw,5rem);line-height:1;letter-spacing:-.05em}.product-hero p{max-width:680px;color:var(--muted);font-size:1.08rem}.how-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:.75rem}.how-grid article,.category-card,.product-card{padding:1.2rem;border:1px solid var(--line);border-radius:18px;background:#fff}.how-grid b{color:var(--blue)}.how-grid h3{font-size:1rem;color:var(--navy)}.how-grid p,.category-card p{font-size:.83rem;color:var(--muted)}.category-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem}.category-card{font-weight:800;color:var(--navy)}.catalog-tools{display:flex;gap:.7rem;margin:1.2rem 0;flex-wrap:wrap}.catalog-tools .text-field{flex:1;min-width:230px}.filter-button{padding:.65rem .8rem;border:1px solid var(--line);border-radius:999px;background:#fff;cursor:pointer}.filter-button.active{background:var(--navy);color:#fff}.career-card[hidden]{display:none}.meter{height:8px;background:#e7edf6;border-radius:99px;overflow:hidden}.meter span{display:block;height:100%;background:var(--blue)}.split{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.product-card h2,.product-card h3{color:var(--navy)}.roadmap-list{display:grid;gap:.8rem}.roadmap-item{display:grid;grid-template-columns:90px 1fr;gap:1rem;padding:1rem;border:1px solid var(--line);border-radius:14px;background:#fff}.roadmap-item b{color:var(--blue)}.empty-state{text-align:center;padding:2.5rem}.honest-note{padding:1rem;border-left:4px solid var(--blue);background:var(--sky);color:#365468}.loading-state{display:none;text-align:center;padding:2rem}.loading-state.show{display:block}.loading-dot{display:inline-block;width:10px;height:10px;margin:4px;border-radius:50%;background:var(--blue);animation:pulse .8s infinite alternate}.loading-dot:nth-child(2){animation-delay:.2s}.loading-dot:nth-child(3){animation-delay:.4s}@keyframes pulse{to{opacity:.2;transform:translateY(-5px)}}@media(max-width:900px){.how-grid{grid-template-columns:repeat(2,1fr)}.category-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:620px){.how-grid,.category-grid,.split{grid-template-columns:1fr}.roadmap-item{grid-template-columns:1fr}.product-hero{padding:3.5rem 0}.product-hero .button{width:100%}}