.pw-container {
 max-width: 1300px;
 margin: 1.8rem auto;
 padding: 0 1rem;
}

.pw-family-group {
 margin-bottom: 1.5rem;
}

.pw-family-card {
 border: 1px solid #dee2e6;
 border-radius: 1rem;
 background-color: #fff;
 overflow: hidden;
 transition: box-shadow 0.2s ease;
}

.pw-family-card:hover {
 box-shadow: 0 6px 14px rgba(0,0,0,0.05);
}

.pw-family-header {
 background-color: #f8f9fc;
 padding: 1rem 1.25rem;
 cursor: pointer;
 border-bottom: 1px solid transparent;
 transition: background 0.2s;
 display: flex;
 align-items: center;
 justify-content: space-between;
 flex-wrap: wrap;
}

.pw-family-header:hover {
 background-color: #f1f3f7;
}

.pw-family-title-area {
 display: flex;
 align-items: center;
 gap: 12px;
 flex-wrap: wrap;
}

.pw-printer-image {
 width: 36px;
 height: 36px;
 object-fit: contain;
 border-radius: 6px;
 background-color: #f0f4f8;
 padding: 4px;
 transition: transform 0.2s ease;
}

.pw-family-header:hover .pw-printer-image {
 transform: scale(1.02);
}

.pw-family-name {
 font-size: 1.4rem;
 font-weight: 600;
 letter-spacing: -0.2px;
 color: #1a2c3e;
 margin: 0;
 line-height: 1.3;
}

.pw-toggle-icon {
 font-size: 1.7rem;
 font-weight: 400;
 color: #2c6e9e;
 background: rgba(44,110,158,0.1);
 border-radius: 40px;
 width: 36px;
 height: 36px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 transition: all 0.2s;
}

.pw-family-header[aria-expanded="true"] .pw-toggle-icon {
 background: #2c6e9e;
 color: white;
}

.pw-family-collapse {
 border-top: 0px solid #e9ecef;
}

.pw-family-collapse.show {
 border-top: 1px solid #e9ecef;
}

.pw-models-grid {
 padding: 1.5rem 1.25rem 1.5rem 1.25rem;
 background: #ffffff;
 display: grid;
 grid-template-columns: repeat(3, 1fr);
 gap: 0.9rem 1.2rem;
}

.pw-model-link {
 display: flex;
 align-items: center;
 justify-content: space-between;
 background: #ffffff;
 border: 1px solid #e2e8f0;
 border-radius: 0.75rem;
 padding: 0.7rem 1rem;
 transition: all 0.2s ease;
 text-decoration: none;
 color: #1e4663;
 font-weight: 500;
}

.pw-model-link:hover {
 background-color: #f0f6fe;
 border-color: #bdd4e7;
 text-decoration: none;
 color: #0b3550;
 transform: translateY(-1px);
 box-shadow: 0 3px 8px rgba(0,0,0,0.03);
}

.pw-model-name {
 font-size: 0.95rem;
 letter-spacing: -0.2px;
 word-break: break-word;
}

.pw-external-icon {
 font-size: 0.85rem;
 color: #6c86a3;
 transition: transform 0.1s;
 margin-left: 8px;
}

.pw-model-link:hover .pw-external-icon {
 color: #2c6e9e;
 transform: translate(2px, -2px);
}

@media (max-width: 768px) {
 .pw-models-grid {
  grid-template-columns: repeat(2, 1fr);
  gap: 0.8rem;
  padding: 1.25rem;
 }
 .pw-family-name {
  font-size: 1.2rem;
 }
 .pw-printer-image {
  width: 32px;
  height: 32px;
 }
}

@media (max-width: 480px) {
 .pw-models-grid {
  grid-template-columns: 1fr;
 }
 .pw-family-header {
  padding: 0.8rem 1rem;
 }
 .pw-model-link {
  padding: 0.65rem 0.9rem;
 }
 .pw-printer-image {
  width: 28px;
  height: 28px;
 }
}

.collapsing {
 transition-duration: 0.25s;
}

.pw-printer-image {
 background-color: #f8f9fa;
}

.pw-a {
 text-decoration: none;
}

.pw-d-flex {
 display: flex;
}

.pw-align-items-center {
 align-items: center;
}

.pw-justify-content-between {
 justify-content: space-between;
}

.pw-flex-wrap {
 flex-wrap: wrap;
}

.pw-mb-3 {
 margin-bottom: 1rem;
}

.pw-mt-2 {
 margin-top: 0.5rem;
}

.pw-mr-1 {
 margin-right: 0.25rem;
}

.pw-mb-4 {
 margin-bottom: 1.5rem;
}

.pw-text-muted {
 color: #6c757d;
}

@media (min-width: 576px) {
 .pw-mt-sm-0 {
  margin-top: 0;
 }
}